From 5a2828503af45233b4495e3b38b37d6be76a50d4 Mon Sep 17 00:00:00 2001
From: zhangyu <zhangyu@geedgenetworks.com>
Date: Mon, 17 May 2021 16:41:01 +0800
Subject: [PATCH] =?UTF-8?q?feat=EF=BC=9A=20=E6=89=80=E6=9C=89=E5=AF=BC?=
 =?UTF-8?q?=E5=85=A5=E5=AF=BC=E5=87=BA=20=E6=94=BE=E5=85=A5=E6=96=B0?=
 =?UTF-8?q?=E7=BB=84=E4=BB=B6=E5=86=85?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/components/page/alert/alertRule.vue   | 30 ++++++++++------
 .../src/components/page/asset/asset.vue       |  4 ++-
 .../page/config/template/exprTemp.vue         | 29 +++++++++-------
 .../page/monitor/endpoint/endpointList.vue    | 34 +++++++++++--------
 4 files changed, 57 insertions(+), 40 deletions(-)

diff --git a/nezha-fronted/src/components/page/alert/alertRule.vue b/nezha-fronted/src/components/page/alert/alertRule.vue
index 1e9bc90a1..076fb8a30 100644
--- a/nezha-fronted/src/components/page/alert/alertRule.vue
+++ b/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">
-            <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>
+          <template v-slot:before>
+            <div>
+              <el-dropdown-item>
+                <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>
+              </el-dropdown-item>
+            </div>
           </template>
-        </export-excel>
-        <delete-button id="alert-rule-batch-delete" v-has="'alertRule_delete'" :api="url" :delete-objs="batchDeleteObjs" @after="getTableData" @before="delFlag=true"></delete-button>
+        </top-tool-more-options>
       </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 () {
diff --git a/nezha-fronted/src/components/page/asset/asset.vue b/nezha-fronted/src/components/page/asset/asset.vue
index 6a6bb14ab..4675a7855 100644
--- a/nezha-fronted/src/components/page/asset/asset.vue
+++ b/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
diff --git a/nezha-fronted/src/components/page/config/template/exprTemp.vue b/nezha-fronted/src/components/page/config/template/exprTemp.vue
index 8c5ebc8ed..7a9accf2e 100644
--- a/nezha-fronted/src/components/page/config/template/exprTemp.vue
+++ b/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">
-            <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>
+          <template v-slot:before>
+            <div>
+              <el-dropdown-item>
+                <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>
+              </el-dropdown-item>
+            </div>
           </template>
-        </export-excel>
-
-        <delete-button :delete-objs="batchDeleteObjs" @after="getTableData"
-                       id="alert-msg-batch-delete" v-has="'expressionTemplate_delete'" :api="url"></delete-button>
+        </top-tool-more-options>
       </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 () {
diff --git a/nezha-fronted/src/components/page/monitor/endpoint/endpointList.vue b/nezha-fronted/src/components/page/monitor/endpoint/endpointList.vue
index 52cde9d77..1f914583e 100644
--- a/nezha-fronted/src/components/page/monitor/endpoint/endpointList.vue
+++ b/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">
-            <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>
+          <template v-slot:before>
+            <div>
+              <el-dropdown-item>
+                <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>
+              </el-dropdown-item>
+            </div>
           </template>
-        </export-excel>
-        <delete-button id="account-list-batch-delete" v-has="'monitor_endpoint_delete'" :api="url" :delete-objs="batchDeleteObjs" @after="getTableData" @before="delFlag=true"></delete-button>
+        </top-tool-more-options>
 <!--        <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 () {