NEZ-845 feat： chart template 增加导入导出按钮，修改topo下拉框显示不全的问题 以及 diagram loging 隐藏时机的变更

nezha-fronted/src/components/common/ChartDiagram/diagram.vue

@@ -4,7 +4,7 @@
 </style>
 <template>
   <div class="project-box list-page" v-loading="topologyLoading" v-has="'topo_list'">
-    <div class="main-list">
+    <div class="main-list" style="overflow: hidden">
       <div class="main-container" :class="fromOverView?'from-overview':'from-project'" style="background: #fff">
         <div v-if="(editTopologyFlag || isPreview)&&!fromChart" class="edit-topologyLine top-tools" style="padding-left: 20px;width: calc(100% - 20px);display: inline-block">
           <!--工具栏-->
@@ -685,6 +685,7 @@ export default {
           })
           if (this.fromTopologyDialog && !this.isPreview) {
             setTimeout(() => {
+              this.topologyLoading = false
               getTopology(this.topologyIndex).open(data)
               getTopology(this.topologyIndex).centerView()
               getTopology(this.topologyIndex).resize()
@@ -720,6 +721,7 @@ export default {
                   getTopology(this.topologyIndex).lock(2)
                 }
               }
+              this.topologyLoading = false
               this.penToolTipScale = getTopology(this.topologyIndex).data.scale
               setTimeout(() => {
                 getTopology(this.topologyIndex).data.pens.forEach(item => {
@@ -729,7 +731,7 @@ export default {
                       item.startAnimate()
                     })
                   }
-                }, 100)
+                })
               })
               // if(this.fromPrev){
               //   getTopology(this.topologyIndex).scaleTo(data.scale/2)
@@ -782,7 +784,6 @@ export default {
         } else {
           getTopology(this.topologyIndex).open(data)
         }
-        this.topologyLoading = false
         if (!getTopology(this.topologyIndex).data.name) {
           getTopology(this.topologyIndex).data.name = ''
         }

nezha-fronted/src/components/common/popBox/topToolMoreOptions.vue

@@ -151,7 +151,9 @@ export default {
     },
     rollbackImport () {
       let url
-      if (this.importUrl.indexOf('asset') > -1) {
+      if (this.importUrl.indexOf('/asset/model') > -1) {
+        url = '/asset/model/cancelImport'
+      } else if (this.importUrl.indexOf('asset') > -1) {
         url = '/asset/asset/cancelImport'
       } else if (this.importUrl.indexOf('endpoint') > -1) {
         url = '/monitor/endpoint/cancelImport'
@@ -161,6 +163,10 @@ export default {
         url = 'visual/panel/cancelImport'
       } else if (this.importUrl.indexOf('tmpl') > -1) {
         url = '/expression/tmpl/cancelImport'
+      } else if (this.importUrl.indexOf('dc/cabinet') > -1) {
+        url = '/dc/cabinet/cancelImport'
+      } else if (this.importUrl.indexOf('dc') > -1) {
+        url = '/dc/cancelImport'
       }
       this.$delete(url + '?seq=' + this.importResult.seq).then(response => {
         if (response.code == 200) {
@@ -184,6 +190,9 @@ export default {
             form.append('linkId', this.link ? this.link.id : '')
           }
         }
+        if (this.importUrl.indexOf('dc/cabinet') > -1) {
+          form.append('dcIds', this.params.dcIds)
+        }
         form.append('language', localStorage.getItem('nz-language') ? localStorage.getItem('nz-language') : 'en')
         this.$post(this.importUrl, form, { 'Content-Type': 'multipart/form-data' }).then(response => {
           if (response.code == 200 && response.msg == 'success') {
@@ -223,7 +232,9 @@ export default {
 
       let url = null
       const param = { language: language }
-      if (this.importUrl.indexOf('asset') > -1) {
+      if (this.importUrl.indexOf('/asset/model') > -1) {
+        url = '/asset/model/template'
+      } else if (this.importUrl.indexOf('asset') > -1) {
         url = '/asset/asset/template'
         param.type = 'asset'
       } else if (this.importUrl.indexOf('panel') > -1) {
@@ -236,6 +247,10 @@ export default {
         url = '/expression/tmpl/template'
       } else if (this.importUrl.indexOf('alert') > -1) {
         url = '/alert/rule/template'
+      } else if (this.importUrl.indexOf('dc/cabinet') > -1) {
+        url = '/dc/cabinet/template'
+      } else if (this.importUrl.indexOf('dc') > -1) {
+        url = '/dc/template'
       }
 
       if (!url) {
@@ -262,7 +277,9 @@ export default {
         })
       }
       if (this.exportUrl.indexOf('panel') > -1) {
-        params.pageSize = -1
+        if (this.paramsType !== 'template') {
+          params.pageSize = -1
+        }
         delete params.start_time
         delete params.end_time
         delete params.id

nezha-fronted/src/components/common/project/L5/CanvasProps.vue

@@ -708,8 +708,8 @@
               <div class="props-pen-item">
                 <div>{{ $t('project.topology.textAlign') }}</div>
                 <div class="p10 pl0">
-                  <el-select :placeholder="$t('el.select.placeholder')" :popper-append-to-body="false"
+                  <el-select :placeholder="$t('el.select.placeholder')" :popper-append-to-body="true"
-                             class="right-box-row-with-btn" popper-class="chart-box-dropdown-small"
+                             class="right-box-row-with-btn no-style-class" popper-class="chart-box-dropdown-small"
                              size="mini"
                              v-model="selection.pen.font.textAlign" value-key="chartType" @change="onChange">
                     <el-option :key="item.id" :label="item.name" :value="item.id" v-for="item in textAlignOptions">
@@ -722,8 +722,8 @@
               <div class="props-pen-item">
                 <div>{{ $t('project.topology.textBaseline') }}</div>
                 <div class="p10 pl0">
-                  <el-select :placeholder="$t('el.select.placeholder')" :popper-append-to-body="false"
+                  <el-select :placeholder="$t('el.select.placeholder')" :popper-append-to-body="true"
-                             class="right-box-row-with-btn" popper-class="chart-box-dropdown-small"
+                             class="right-box-row-with-btn no-style-class" popper-class="chart-box-dropdown-small"
                              size="mini"
                              v-model="selection.pen.font.textBaseline" value-key="chartType" @change="onChange">
                     <el-option :key="item.id" :label="item.name" :value="item.id" v-for="item in textBaselineOptions">

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

@@ -36,9 +36,33 @@
                 type="button" @click="add">
           <i class="nz-icon nz-icon-create-square"></i>
         </button>
-
+        <top-tool-more-options
-        <delete-button :delete-objs="batchDeleteObjs" @after="getTableData"
+          ref="export"
-                       id="alert-msg-batch-delete" v-has="'expressionTemplate_delete'" :api="url"></delete-button></template>
+          id="expression-template-list"
+          export-url="visual/panel/export"
+          import-url="visual/panel/import"
+          export-file-name="chart-temp-template"
+          :params="searchLabel"
+          :params2="{
+            panelId:0,
+            returnChildren: 0,
+            groupId: 0
+          }"
+          :paramsType="'template'"
+          :permissions="{import: 'expressionTemplate_add', export: 'expressionTemplate_view'}"
+          class="top-tool-export margin-r-10"
+          @afterImport="getTableData"
+        >
+          <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>
+        </top-tool-more-options>
+      </template>
       <template  v-slot="slotProps">
         <chartTmplTable
           ref="dataTable"
@@ -74,6 +98,7 @@ import chartBox from '@/components/page/dashboard/chartBox'
 import deleteButton from '@/components/common/deleteButton'
 import dataListMixin from '@/components/common/mixin/dataList'
 import chartTmplTable from '@/components/common/table/settings/chartTmplTable'
+import topToolMoreOptions from "@/components/common/popBox/topToolMoreOptions";
 
 export default {
   name: 'chartTemp',
@@ -81,7 +106,8 @@ export default {
     chartBox,
     deleteButton,
     chartTmplTable,
-    'export-excel': exportXLSX
+    'export-excel': exportXLSX,
+    topToolMoreOptions
   },
   mixins: [dataListMixin],
   data () {