feat： 所有导入导出 放入新组件内

nezha-fronted/src/components/page/alert/alertRule.vue

@@ -10,24 +10,29 @@
       @search="search"
     >
       <template v-slot:top-tool-right>
-        <export-excel
+        <button id="alert-add" v-has="'alertRule_add'" :title="$t('overall.createAlertRule')" class="top-tool-btn"
+                @click="add">
+          <i class="nz-icon-create-square nz-icon"></i>
+        </button>
+        <top-tool-more-options
+          ref="export"
           id="alert-rule"
-          :permissions="{import: 'alertRule_add'}"
           :params="searchLabel"
-          class="top-tool-export margin-r-10"
+          :permissions="{import: 'alertRule_add', export: 'alertRule_view'}"
+          class="top-tool-export margin-l-10 margin-r-10"
           export-file-name="AlertRule"
           export-url="/alert/rule/export"
           import-url="/alert/rule/import"
           @afterImport="getTableData"
         >
-          <template slot="optionZone">
+          <template v-slot:before>
-            <button id="alert-add" v-has="'alertRule_add'" :title="$t('overall.createAlertRule')" class="top-tool-btn"
+            <div>
-                    @click="add">
+              <el-dropdown-item>
-              <i class="nz-icon-create-square nz-icon"></i>
+                <delete-button :type="'link'" :title="$t('overall.batchDel')" id="alert-rule-batch-delete" v-has="'alertRule_delete'" :api="url" :delete-objs="batchDeleteObjs" @after="getTableData" @before="delFlag=true"></delete-button>
-            </button>
+              </el-dropdown-item>
+            </div>
           </template>
-        </export-excel>
+        </top-tool-more-options>
-        <delete-button id="alert-rule-batch-delete" v-has="'alertRule_delete'" :api="url" :delete-objs="batchDeleteObjs" @after="getTableData" @before="delFlag=true"></delete-button>
       </template>
       <template v-slot:default="slotProps">
         <alert-rule-table
@@ -63,6 +68,8 @@ import deleteButton from '@/components/common/deleteButton'
 import nzDataList from '@/components/common/table/nzDataList'
 import dataListMixin from '@/components/common/mixin/dataList'
 import alertRuleTable from '@/components/common/table/alert/alertRuleTable'
+import topToolMoreOptions from '@/components/common/popBox/topToolMoreOptions'
+
 export default {
   name: 'alert-config',
   components: {
@@ -70,7 +77,8 @@ export default {
     alertRuleBox,
     alertRuleTable,
     nzDataList,
-    'export-excel': exportXLSX
+    'export-excel': exportXLSX,
+    topToolMoreOptions
   },
   mixins: [dataListMixin],
   data () {

nezha-fronted/src/components/page/asset/asset.vue

@@ -17,8 +17,9 @@
           <i class="nz-icon nz-icon-create-square"></i>
         </button>
         <top-tool-more-options
+          ref="export"
           id="model"
-          :params="filter"
+          :params="searchLabel"
           :permissions="{
                   import: 'asset_add',
                   export: 'asset_view'
@@ -115,6 +116,7 @@ export default {
   data () {
     return {
       url: 'asset/asset',
+      filter: {},
       // 侧滑
       rightBox: {
         batchShow: false

nezha-fronted/src/components/page/config/template/exprTemp.vue

@@ -18,26 +18,29 @@
         </div>
       </template>
       <template v-slot:top-tool-right>
-        <export-excel
+        <button id="expr-tmpl-list-export" v-has="'expressionTemplate_add'" :title="$t('overall.createTemplate')" class="top-tool-btn"
+                type="button" @click="add">
+          <i class="nz-icon nz-icon-create-square"></i>
+        </button>
+        <top-tool-more-options
+          ref="export"
           id="expression-template-list"
           export-url="expression/tmpl/export"
           import-url="expression/tmpl/import"
           export-file-name="expression-template"
           :params="searchLabel"
           :permissions="{import: 'expressionTemplate_add', export: 'expressionTemplate_view'}"
+          class="top-tool-export margin-l-10 margin-r-10"
           @afterImport="getTableData"
-          class="top-tool-export margin-r-10"
         >
-          <template slot="optionZone">
+          <template v-slot:before>
-            <button id="expr-tmpl-list-export" v-has="'expressionTemplate_add'" :title="$t('overall.createTemplate')" class="top-tool-btn"
+            <div>
-                    type="button" @click="add">
+              <el-dropdown-item>
-              <i class="nz-icon nz-icon-create-square"></i>
+                <delete-button :type="'link'" :title="$t('overall.batchDel')" :delete-objs="batchDeleteObjs" @after="getTableData" id="alert-msg-batch-delete" v-has="'expressionTemplate_delete'" :api="url"></delete-button>
-            </button>
+              </el-dropdown-item>
+            </div>
           </template>
-        </export-excel>
+        </top-tool-more-options>
-
-        <delete-button :delete-objs="batchDeleteObjs" @after="getTableData"
-                       id="alert-msg-batch-delete" v-has="'expressionTemplate_delete'" :api="url"></delete-button>
       </template>
       <template v-slot:default="slotProps">
         <expr-tmpl-table
@@ -82,7 +85,7 @@
 
 <script>
 import bus from '@/libs/bus'
-import exportXLSX from '@/components/common/exportXLSX'
+import topToolMoreOptions from '@/components/common/popBox/topToolMoreOptions'
 import exprTmplBox from '@/components/common/rightBox/exprTmplBox'
 import deleteButton from '@/components/common/deleteButton'
 import dataListMixin from '@/components/common/mixin/dataList'
@@ -94,7 +97,7 @@ export default {
     deleteButton,
     exprTmplBox,
     exprTmplTable,
-    'export-excel': exportXLSX
+    topToolMoreOptions
   },
   mixins: [dataListMixin],
   data () {

nezha-fronted/src/components/page/monitor/endpoint/endpointList.vue

@@ -13,25 +13,29 @@
         <button id="asset-filter" :class="{ 'is-focus': dataListLayout.indexOf('clickSearch') > -1 }" class="top-tool-btn margin-r-10" @click.stop="showClickSearch">
           <i class="nz-icon nz-icon-funnel"></i>
         </button>
-        <export-excel
+        <button id="account-add" v-has="'monitor_endpoint_add'" class="top-tool-btn"
+                type="button" @click="add">
+          <i class="nz-icon-create-square nz-icon"></i>
+        </button>
+        <top-tool-more-options
           ref="export"
           id="expression-template-list"
-          export-url="monitor/endpoint/export"
-          import-url="monitor/endpoint/import"
-          export-file-name="expression-template"
           :params="searchLabel"
           :permissions="{import: 'monitor_endpoint_add', export: 'monitor_module_view'}"
+          class="top-tool-export margin-l-10 margin-r-10"
+          export-file-name="expression-template"
+          export-url="monitor/endpoint/export"
+          import-url="monitor/endpoint/import"
           @afterImport="getTableData"
-          class="top-tool-export margin-r-10"
         >
-          <template slot="optionZone">
+          <template v-slot:before>
-            <button id="account-add" v-has="'monitor_endpoint_add'" class="top-tool-btn"
+            <div>
-                    type="button" @click="add">
+              <el-dropdown-item>
-              <i class="nz-icon-create-square nz-icon"></i>
+                <delete-button :type="'link'" :title="$t('overall.batchDel')" id="account-list-batch-delete" v-has="'monitor_endpoint_delete'" :api="url" :delete-objs="batchDeleteObjs" @after="getTableData" @before="delFlag=true"></delete-button>
-            </button>
+              </el-dropdown-item>
+            </div>
           </template>
-        </export-excel>
+        </top-tool-more-options>
-        <delete-button id="account-list-batch-delete" v-has="'monitor_endpoint_delete'" :api="url" :delete-objs="batchDeleteObjs" @after="getTableData" @before="delFlag=true"></delete-button>
 <!--        <button id="account-batch-modify" v-has="'monitor_endpoint_add'" :class="{'nz-btn-disabled' : batchDeleteObjs.length<1}" class="top-tool-btn margin-r-20"-->
 <!--                type="button" @click="batchModify">-->
 <!--          <i class="nz-icon-batch-edit nz-icon"></i>-->
@@ -76,13 +80,13 @@
 <script>
 import deleteButton from '@/components/common/deleteButton'
 import addEndpointBox from '@/components/common/rightBox/addEndpointBox'
-import exportXLSX from '@/components/common/exportXLSX'
 import nzDataList from '@/components/common/table/nzDataList'
 import dataListMixin from '@/components/common/mixin/dataList'
 import endpointTable from '@/components/common/table/settings/endpointTable'
 import EditEndpointBoxNew from '@/components/common/rightBox/editEndpointBoxNew'
 import batchModifyEndpoint from '@/components/common/rightBox/batchModifyEndpoint'
 import clickSearch from '@/components/common/labelFilter/clickSearch'
+import topToolMoreOptions from '@/components/common/popBox/topToolMoreOptions'
 
 export default {
   beforeRouteLeave (to, from, next) { // 路由离开之前触发
@@ -96,9 +100,9 @@ export default {
     addEndpointBox,
     deleteButton,
     endpointTable,
-    'export-excel': exportXLSX,
     clickSearch,
-    batchModifyEndpoint
+    batchModifyEndpoint,
+    topToolMoreOptions,
   },
   mixins: [dataListMixin],
   data () {