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

2021-07-20 10:16:28 +08:00
parent a602c60303
commit 2048640321
4 changed files with 58 additions and 14 deletions
--- a/nezha-fronted/src/components/common/ChartDiagram/diagram.vue
+++ b/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 = ''
        }
--- a/nezha-fronted/src/components/common/popBox/topToolMoreOptions.vue
+++ b/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) {
+        if (this.paramsType !== 'template') {
          params.pageSize = -1
+        }
        delete params.start_time
        delete params.end_time
        delete params.id
--- a/nezha-fronted/src/components/common/project/L5/CanvasProps.vue
+++ b/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"
-                             class="right-box-row-with-btn" popper-class="chart-box-dropdown-small"
+                  <el-select :placeholder="$t('el.select.placeholder')" :popper-append-to-body="true"
+                             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"
-                             class="right-box-row-with-btn" popper-class="chart-box-dropdown-small"
+                  <el-select :placeholder="$t('el.select.placeholder')" :popper-append-to-body="true"
+                             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">
--- a/nezha-fronted/src/components/page/config/template/chartTemp.vue
+++ b/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>
-
-        <delete-button :delete-objs="batchDeleteObjs" @after="getTableData"
-                       id="alert-msg-batch-delete" v-has="'expressionTemplate_delete'" :api="url"></delete-button></template>
+        <top-tool-more-options
+          ref="export"
+          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 () {