perf: update audit report

src/components/Table/ListTable/TableAction/ExportDialog.vue

@@ -3,7 +3,7 @@
     <Dialog
       v-if="exportDialogShow"
       :destroy-on-close="true"
-      :title="$tc('Export')"
+      :title="iDialogTitle"
       :visible.sync="exportDialogShow"
       width="700px"
       @close="handleExportCancel"
@@ -14,10 +14,10 @@
         {{ tips }}
       </el-alert>
       <el-form label-position="left" style="padding-left: 20px">
-        <el-form-item :label="$tc('FileType' )" :label-width="'100px'">
+        <el-form-item v-if="showFileType" :label="$tc('FileType' )" :label-width="'100px'">
           <el-radio-group v-model="exportTypeOption">
             <el-radio
-              v-for="option of exportTypeOptions"
+              v-for="option of iExportTypeOptions"
               :key="option.value"
               :disabled="!option.can"
               :label="option.value"
@@ -99,6 +99,34 @@ export default {
     tipsType: {
       type: String,
       default: 'success'
+    },
+    triggerEvent: {
+      type: String,
+      default: 'showExportDialog'
+    },
+    dialogTitle: {
+      type: String,
+      default: ''
+    },
+    showFileType: {
+      type: Boolean,
+      default: true
+    },
+    defaultExportType: {
+      type: String,
+      default: 'csv'
+    },
+    fixedExportType: {
+      type: String,
+      default: ''
+    },
+    fileTypeOptions: {
+      type: Array,
+      default: () => []
+    },
+    extraQuery: {
+      type: Object,
+      default: () => ({})
     }
   },
   data() {
@@ -137,6 +165,9 @@ export default {
     tableHasQuery() {
       return Object.keys(this.tableQuery).length > 0
     },
+    iDialogTitle() {
+      return this.dialogTitle || this.$tc('Export')
+    },
     exportOptions() {
       return [
         {
@@ -156,7 +187,10 @@ export default {
         }
       ]
     },
-    exportTypeOptions() {
+    iExportTypeOptions() {
+      if (this.fileTypeOptions.length > 0) {
+        return this.fileTypeOptions
+      }
       return [
         {
           label: 'CSV',
@@ -172,10 +206,10 @@ export default {
     }
   },
   beforeDestroy() {
-    this.$eventBus.$off('showExportDialog', this.showExportDialogHandler)
+    this.$eventBus.$off(this.triggerEvent, this.showExportDialogHandler)
   },
   mounted() {
-    this.$eventBus.$on('showExportDialog', this.showExportDialogHandler)
+    this.$eventBus.$on(this.triggerEvent, this.showExportDialogHandler)
   },
   methods: {
     showExportDialogHandler({ selectedRows, url, name }) {
@@ -184,6 +218,9 @@ export default {
       }
     },
     showExportDialog() {
+      this.exportTypeOption = this.fixedExportType || this.defaultExportType
+      this.exportOption = 'all'
+
       if (!this.mfaVerifyRequired) {
         this.exportDialogShow = true
 
@@ -199,6 +236,13 @@ export default {
       }
       this.$axios.get('/api/v1/authentication/confirm/check/?confirm_type=mfa').then(() => {
         this.exportDialogShow = true
+        if (this.hasSelected) {
+          this.exportOption = 'selected'
+        }
+
+        if (this.tableHasQuery) {
+          this.exportOption = 'filtered'
+        }
       })
     },
     downloadCsv(url) {
@@ -216,7 +260,8 @@ export default {
         const spm = await createSourceIdCache(resources)
         query['spm'] = spm.spm
       }
-      query['format'] = exportTypeOption
+      Object.assign(query, this.extraQuery)
+      query['format'] = exportTypeOption || this.fixedExportType || this.defaultExportType
       const queryStr =
         (url.indexOf('?') > -1 ? '&' : '?') +
         queryUtil.stringify(query, '=', '&')

src/components/Table/ListTable/TableAction/ImExportDialog.vue

@@ -1,6 +1,7 @@
 <template>
   <div>
     <ExportDialog :selected-rows="selectedRows" v-bind="exportOptions" v-on="$listeners" />
+    <ExportDialog :selected-rows="selectedRows" v-bind="reportExportOptions" v-on="$listeners" />
     <ImportDialog :selected-rows="selectedRows" v-bind="importOptions" v-on="$listeners" />
   </div>
 </template>
@@ -24,6 +25,10 @@ export default {
       type: Object,
       default: () => ({})
     },
+    reportExportOptions: {
+      type: Object,
+      default: () => ({})
+    },
     importOptions: {
       type: Object,
       default: () => ({})

src/components/Table/ListTable/TableAction/RightSide.vue

@@ -4,6 +4,7 @@
     <ImExportDialog
       v-if="dialogExportVisible"
       :export-options="iExportOptions"
+      :report-export-options="iReportExportOptions"
       :import-options="iImportOptions"
       :selected-rows="selectedRows"
       v-bind="$attrs"
@@ -20,6 +21,7 @@ import { cleanActions } from './utils'
 import { assignIfNot } from '@/utils/common/index'
 
 const defaultTrue = { type: [Boolean, Function, String], default: true }
+const defaultFalse = { type: [Boolean, Function, String], default: false }
 
 export default {
   name: 'RightSide',
@@ -48,6 +50,22 @@ export default {
         })
       }
     },
+    hasReportExport: defaultFalse,
+    reportExportOptions: {
+      type: Object,
+      default: () => ({})
+    },
+    handleReportExportClick: {
+      type: Function,
+      default: function({ selectedRows }) {
+        const url = this.iReportExportOptions.url
+        const triggerEvent = this.iReportExportOptions.triggerEvent || 'showReportExportDialog'
+        this.dialogExportVisible = true
+        this.$nextTick(() => {
+          this.$eventBus.$emit(triggerEvent, { selectedRows, url, name: this.name })
+        })
+      }
+    },
     hasImport: defaultTrue,
     importOptions: {
       type: Object,
@@ -133,9 +151,16 @@ export default {
           name: 'actionExport',
           icon: 'download',
           tip: this.$t('Export'),
-          has: this.hasExport,
+          has: this.showLegacyExport.bind(this),
           callback: this.handleExportClick.bind(this)
         },
+        {
+          name: 'actionReportExport',
+          icon: 'fa-file-excel-o',
+          tip: this.$t('ReportExport'),
+          has: this.showReportExport.bind(this),
+          callback: this.handleReportExportClick.bind(this)
+        },
         {
           name: 'actionRefresh',
           icon: 'refresh',
@@ -179,9 +204,53 @@ export default {
         url: this.tableUrl,
         ...this.exportOptions
       }
+    },
+    iReportExportOptions() {
+      const reportExportOptions = this.reportExportOptions || {}
+      const {
+        extraQuery = {},
+        fileTypeOptions,
+        ...restReportExportOptions
+      } = reportExportOptions
+
+      return {
+        url: this.tableUrl,
+        triggerEvent: 'showReportExportDialog',
+        dialogTitle: this.$t('ReportExport'),
+        fixedExportType: 'xlsx',
+        showFileType: false,
+        ...restReportExportOptions,
+        extraQuery: {
+          export_mode: 'report',
+          ...extraQuery
+        },
+        fileTypeOptions: fileTypeOptions || [
+          {
+            label: 'Excel',
+            value: 'xlsx',
+            can: true
+          }
+        ]
+      }
     }
   },
   methods: {
+    getActionVisibility(value, args) {
+      if (typeof value === 'function') {
+        return value(args)
+      }
+      return value
+    },
+    showLegacyExport(args) {
+      const reportExportVisibility = this.getActionVisibility(this.hasReportExport, args)
+      if (reportExportVisibility) {
+        return false
+      }
+      return this.getActionVisibility(this.hasExport, args)
+    },
+    showReportExport(args) {
+      return this.getActionVisibility(this.hasReportExport, args)
+    },
     handleFilterClick() {
       this.$emit('update:quick-filter-expand', !this.quickFilterExpand)
     },

src/views/audits/JobExecutionLogList.vue

@@ -95,6 +95,7 @@ export default {
       },
       headerActions: {
         hasLeftActions: false,
+        hasReportExport: true,
         hasDatePicker: true,
         hasImport: false,
         searchConfig: {

src/views/audits/JobPeriodTaskList.vue

@@ -73,6 +73,7 @@ export default {
       },
       headerActions: {
         hasLeftActions: false,
+        hasReportExport: true,
         hasImport: false
       }
     }

src/views/audits/LoginLog/LoginLogList.vue

@@ -36,6 +36,7 @@ export default {
       headerActions: {
         hasLeftActions: false,
         hasImport: false,
+        hasReportExport: true,
         hasDatePicker: true,
         searchConfig: {
           getUrlQuery: true

src/views/audits/OperateLog/OperateLogList.vue

@@ -72,7 +72,11 @@ export default {
       headerActions: {
         hasLeftActions: false,
         hasImport: false,
-        hasDatePicker: true
+        hasReportExport: true,
+        hasDatePicker: true,
+        searchConfig: {
+          getUrlQuery: true
+        }
       }
     }
   }

src/views/audits/PasswordChangeLogList.vue

@@ -26,7 +26,11 @@ export default {
       headerActions: {
         hasLeftActions: false,
         hasImport: false,
-        hasDatePicker: true
+        hasReportExport: true,
+        hasDatePicker: true,
+        searchConfig: {
+          getUrlQuery: true
+        }
       }
     }
   }

src/views/sessions/FTPLogList.vue

@@ -69,7 +69,11 @@ export default {
       headerActions: {
         hasLeftActions: false,
         hasImport: false,
-        hasDatePicker: true
+        hasReportExport: true,
+        hasDatePicker: true,
+        searchConfig: {
+          getUrlQuery: true
+        }
       }
     }
   }

src/views/sessions/SessionList/BaseList.vue

@@ -182,6 +182,7 @@ export default {
       headerActions: {
         hasLeftActions: false,
         hasImport: false,
+        hasReportExport: true,
         hasDatePicker: true,
         searchConfig: {
           getUrlQuery: false,

src/views/tickets/BaseTicketList.vue

@@ -193,6 +193,7 @@ export default {
       },
       defaultTicketActions: {
         hasImport: false,
+        hasReportExport: true,
         hasMoreActions: false,
         hasLeftActions: true,
         canCreate: this.$hasPerm('tickets.view_ticket'),