From 78efa5b642740fe9605145a38d0cd7bb7fbdbb6d Mon Sep 17 00:00:00 2001
From: zhangyu <zhangyu@geedgenetworks.com>
Date: Tue, 3 Aug 2021 15:32:22 +0800
Subject: [PATCH] =?UTF-8?q?fix=EF=BC=9A=E8=B0=83=E6=95=B4module=E7=9A=84?=
 =?UTF-8?q?=E5=AF=BC=E5=85=A5=E5=AF=BC=E5=87=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../common/popBox/topToolMoreOptions.vue      |  5 +++
 .../common/rightBox/editEndpointBoxNew.vue    | 43 ++++++++++++++-----
 .../page/monitor/endpoint/endpointList.vue    |  7 +--
 .../page/monitor/module/moduleList.vue        | 37 +++++++++-------
 4 files changed, 64 insertions(+), 28 deletions(-)

diff --git a/nezha-fronted/src/components/common/popBox/topToolMoreOptions.vue b/nezha-fronted/src/components/common/popBox/topToolMoreOptions.vue
index 4a0843698..e90cefc24 100644
--- a/nezha-fronted/src/components/common/popBox/topToolMoreOptions.vue
+++ b/nezha-fronted/src/components/common/popBox/topToolMoreOptions.vue
@@ -157,6 +157,8 @@ export default {
         url = '/asset/asset/cancelImport'
       } else if (this.importUrl.indexOf('endpoint') > -1) {
         url = '/monitor/endpoint/cancelImport'
+      } else if (this.importUrl.indexOf('module') > -1) {
+        url = '/monitor/module/cancelImport'
       } else if (this.importUrl.indexOf('rule') > -1) {
         url = '/alert/rule/cancelImport'
       } else if (this.importUrl.indexOf('panel') > -1) {
@@ -243,6 +245,9 @@ export default {
       } else if (this.importUrl.indexOf('endpoint') > -1) {
         url = '/monitor/endpoint/template'
         param.type = 'endpoint'
+      } else if (this.importUrl.indexOf('module') > -1) {
+        url = '/monitor/module/template'
+        param.type = 'module'
       } else if (this.importUrl.indexOf('tmpl') > -1) {
         url = '/expression/tmpl/template'
       } else if (this.importUrl.indexOf('alert') > -1) {
diff --git a/nezha-fronted/src/components/common/rightBox/editEndpointBoxNew.vue b/nezha-fronted/src/components/common/rightBox/editEndpointBoxNew.vue
index b1dc8105e..aa2897ee4 100644
--- a/nezha-fronted/src/components/common/rightBox/editEndpointBoxNew.vue
+++ b/nezha-fronted/src/components/common/rightBox/editEndpointBoxNew.vue
@@ -31,16 +31,19 @@
           </el-form-item>
           <!--module-->
           <el-form-item :label='$t("project.module.module")' prop="remark">
-            <el-select id="module-box-input-module" v-model="editEndpoint.moduleId" :disabled="!editEndpoint.projectId || disabled " class="right-box__select" placeholder="" popper-class="right-box-select-dropdown prevent-clickoutside" size="small" value-key="id">
+            <el-select @change="renderEndpoint" id="module-box-input-module" v-model="editEndpoint.moduleId" :disabled="!editEndpoint.projectId || disabled " class="right-box__select" placeholder="" popper-class="right-box-select-dropdown prevent-clickoutside" size="small" value-key="id">
               <el-option v-for="item in moduleList" :id="'module-'+item.id" :key="item.id" :label="item.name" :value="item.id"></el-option>
             </el-select>
           </el-form-item>
           <!--asset-->
-          <el-form-item :label='$t("project.module.asset")' label-width="125px" prop="asset">
-            <el-select id="module-box-input-module" v-model="editEndpoint.moduleId" :disabled="!editEndpoint.projectId || disabled " class="right-box__select" placeholder="" popper-class="right-box-select-dropdown prevent-clickoutside" size="small" value-key="id">
-              <el-option v-for="item in moduleList" :id="'module-'+item.id" :key="item.id" :label="item.name" :value="item.id"></el-option>
+          <el-form-item :label='$t("project.module.asset")' label-width="125px" prop="assetId" v-if="!disabled">
+            <el-select id="module-box-input-asset"  @change="renderEndpoint" v-model="editEndpoint.assetId" :disabled="disabled" class="right-box__select" placeholder="" popper-class="right-box-select-dropdown prevent-clickoutside" size="small" value-key="id">
+              <el-option v-for="item in assetList" :id="'asset-'+item.id" :key="item.id" :label="item.name" :value="item.id"></el-option>
             </el-select>
           </el-form-item>
+          <el-form-item :label='$t("project.module.asset")' label-width="125px" prop="assetName" v-if="disabled">
+            <el-input id="module-box-input-assetName" v-model="editEndpoint.assetName" :disabled="disabled"   placeholder="" show-word-limit size="small"></el-input>
+          </el-form-item>
           <!--name-->
           <el-form-item v-if="optionType!=='batch'" :label='$t("project.module.name")' label-width="125px" prop="name">
             <el-input id="module-box-input-name" v-model="editEndpoint.name" maxlength="64" placeholder="" show-word-limit size="small"></el-input>
@@ -538,7 +541,8 @@ export default {
     optionType: {
       type: String,
       default: 'batch'
-    }
+    },
+    blankObject: {}
   },
   components: {
     'select-walk': selectWalk,
@@ -570,7 +574,10 @@ export default {
         name: [
           { validator: this.optionType === 'batch' ? '' : noSpecialChar, trigger: 'change' }
         ],
-        asset: [
+        assetId: [
+          { required: !(this.optionType === 'batch'), message: this.$t('validate.required'), trigger: 'change' }
+        ],
+        assetName: [
           { required: !(this.optionType === 'batch'), message: this.$t('validate.required'), trigger: 'change' }
         ],
         projectId: [
@@ -585,6 +592,7 @@ export default {
       },
       projectList: [],
       moduleList: [],
+      assetList: [],
       credentialList: [],
       typeList: [
         {
@@ -729,7 +737,9 @@ export default {
       })
     },
     getAsset () {
-
+      this.$get('asset/asset', { pageSize: -1 }).then(res => {
+        this.assetList = res.data.list
+      })
     },
     getWalkData () {
       this.$get('mib/tree', { pageSize: -1, pageNo: 1 }).then(response => {
@@ -1127,15 +1137,28 @@ export default {
         return assetData
       }
     },
+    renderEndpoint () {
+      console.log(123123, (JSON.stringify(this.editEndpoint.configs) === JSON.stringify(this.blankObject.configs)))
+      if (this.disabled) {
+        return
+      }
+      if (this.editEndpoint.moduleId && this.editEndpoint.assetId && (JSON.stringify(this.editEndpoint.configs) === JSON.stringify(this.blankObject.configs))) {
+        this.$post('/monitor/endpoint/render', { moduleIds: this.editEndpoint.moduleId, assetIds: this.editEndpoint.assetId }).then(res => {
+          console.log(res)
+          this.editEndpoint.configs = res.data.list[0].configs
+        })
+      }
+    }
   },
   mounted () {
-    this.getWalkData()
-    this.getAsset()
-    this.ChartTemplateList()
+
   },
   created () {
     this.getProjectList()
     this.getCredential()
+    this.getWalkData()
+    this.getAsset()
+    this.ChartTemplateList()
   },
   computed: {
     mibName () {
diff --git a/nezha-fronted/src/components/page/monitor/endpoint/endpointList.vue b/nezha-fronted/src/components/page/monitor/endpoint/endpointList.vue
index 453a41cd2..f5831cce4 100644
--- a/nezha-fronted/src/components/page/monitor/endpoint/endpointList.vue
+++ b/nezha-fronted/src/components/page/monitor/endpoint/endpointList.vue
@@ -71,10 +71,10 @@
     </nz-data-list>
     <transition name="right-box">
 <!--      <addEndpointBox v-if="rightBox.show" :endpoint="object" @close="closeRightBox"></addEndpointBox>-->
-      <edit-endpoint-box-new v-if="rightBox.show" :module="object" @close="closeRightEditBox" :disabled="false" :optionType="'add'"></edit-endpoint-box-new>
+      <edit-endpoint-box-new :blankObject="blankObject" v-if="rightBox.show" :module="object" @close="closeRightEditBox" :disabled="false" :optionType="'add'"></edit-endpoint-box-new>
     </transition>
     <transition name="right-box">
-      <edit-endpoint-box-new v-if="rightBox.editShow" :module="object" @close="closeRightEditBox" :disabled="true" :optionType="'edit'"></edit-endpoint-box-new>
+      <edit-endpoint-box-new :blankObject="blankObject" v-if="rightBox.editShow" :module="object" @close="closeRightEditBox" :disabled="true" :optionType="'edit'"></edit-endpoint-box-new>
     </transition>
     <transition name="right-box">
       <batchModifyEndpoint v-if="rightBox.batchModify" :module="object" @close="closeRightBatchModify" :selectEndpointList="batchDeleteObjs" :disabled="true" :type="'edit'"></batchModifyEndpoint>
@@ -115,6 +115,7 @@ export default {
       blankObject: {
         id: '',
         projectId: '',
+        assetId: '',
         name: '',
         port: '',
         chartIds: '',
@@ -128,7 +129,7 @@ export default {
               snmpCredentialsId: '',
               metrics_path: '',
               port: '',
-              host: '{{asset.manageIp}}',
+              host: '',
               scrape_interval: '',
               scrape_timeout: '',
               params: '',
diff --git a/nezha-fronted/src/components/page/monitor/module/moduleList.vue b/nezha-fronted/src/components/page/monitor/module/moduleList.vue
index 0b876fa9f..da59ed340 100644
--- a/nezha-fronted/src/components/page/monitor/module/moduleList.vue
+++ b/nezha-fronted/src/components/page/monitor/module/moduleList.vue
@@ -11,25 +11,30 @@
       @search="search"
     >
       <template v-slot:top-tool-right>
-        <export-excel
-          id="expression-template-list"
-          v-has="''"
+        <button id="account-add" v-has="'monitor_module_add'" :title="$t('overall.createModule')" 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="endpoint-template-list"
+          :params="searchLabel"
+          :params2="searchCheckBox"
+          :permissions="{import: 'monitor_endpoint_add', export: 'monitor_module_view'}"
+          class="top-tool-export margin-l-10 margin-r-10"
+          export-file-name="module"
           export-url="monitor/module/export"
           import-url="monitor/module/import"
-          export-file-name="module"
-          :params="searchLabel"
-          :permissions="{import: 'asset.add', export: 'asset.add'}"
           @afterImport="getTableData"
-          class="top-tool-export margin-r-10"
         >
-          <template slot="optionZone">
-            <button id="account-add" v-has="'monitor_module_add'" :title="$t('overall.createModule')" 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_module_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_module_delete'" :api="url" :delete-objs="batchDeleteObjs" @after="getTableData" @before="delFlag=true"></delete-button>
+        </top-tool-more-options>
       </template>
       <template v-slot="slotProps">
         <module-table
@@ -70,6 +75,7 @@ import dataListMixin from '@/components/common/mixin/dataList'
 import moduleTable from '@/components/common/table/settings/moduleTable'
 import exportXLSX from '@/components/common/exportXLSX'
 import alertSilenceBox from '@/components/common/rightBox/alertSilenceBox'
+import topToolMoreOptions from '@/components/common/popBox/topToolMoreOptions'
 
 export default {
   name: 'moduleList',
@@ -79,7 +85,8 @@ export default {
     deleteButton,
     moduleTable,
     'export-excel': exportXLSX,
-    alertSilenceBox
+    alertSilenceBox,
+    topToolMoreOptions
   },
   mixins: [dataListMixin],
   data () {