NEZ-3180 fix：Dashboard 页面 query_range 时间参数与上方时间选择器展示不一致

nezha-fronted/src/components/chart/chart/chartDiagram.vue

@@ -9,7 +9,18 @@
 <!--      :isPanel="true"-->
 <!--      ref="diagram"-->
 <!--      :chartInfo="chartInfo" />-->
-    <meta2dMain ref="diagram" v-if="iconArrayLoad" :showHeader="false" :meta2dId="chartInfo.id + '-' + isFullscreen" :topoData="chartInfo.param.topo" :querysArray="querysArray" :params="{ timeType: 5}" :iconArray="iconArray" :isChart="true"/>
+    <meta2dMain
+      ref="diagram"
+      v-if="iconArrayLoad"
+      :showHeader="false"
+      :meta2dId="chartInfo.id + '-' + isFullscreen"
+      :topoData="chartInfo.param.topo"
+      :querysArray="querysArray"
+      :params="{ timeType: 5}"
+      :timeRange="timeRange"
+      :iconArray="iconArray"
+      :isChart="true"
+    />
   </div>
 </template>
 
@@ -35,7 +46,8 @@ export default {
         querysArray: {},
         currentProject: {},
         params: {}
-      }
+      },
+      timeRange: ['', '']
     }
   },
   created () {
@@ -43,6 +55,10 @@ export default {
       this.iconArray = [...res.data.list]
       this.iconArrayLoad = true
     })
+    const timeRange = this.$lodash.cloneDeep(this.filterTime)
+    timeRange[0] = this.momentStrToTimestamp(timeRange[0])
+    timeRange[1] = this.momentStrToTimestamp(timeRange[1])
+    this.timeRange = timeRange
   },
   mounted () {
     bus.$on('showMeta2dPreview', (params) => {
@@ -53,6 +69,11 @@ export default {
   methods: {
     resize () {
       this.$refs.diagram.resize()
+    },
+    refresh (timeRange) {
+      console.log(timeRange)
+      this.timeRange = timeRange
+      this.reload(true)
     }
   },
   destroyed () {

nezha-fronted/src/components/chart/panelChart.vue

@@ -191,7 +191,11 @@ export default {
         this.minusTime = ''
         this.multipleTime = false
       }
+      if (this.chartInfo.type === 'diagram') {
+        this.chartInfo.loaded && this.query(elements, startTime, endTime, step, '', true)
+      } else {
         this.chartInfo.loaded && this.query(elements, startTime, endTime, step)
+      }
     },
     // 参数 isRefresh 标识是否是刷新操作
     getChartData (isRefresh, params) { // 获取chart的数据前的准备 主要用于处理时间参数
@@ -235,12 +239,12 @@ export default {
       this.variablesHandle()
       const elements = this.chartInfo.elements || []
       if (this.isExportHtml) {
-        this.chartInfo.loaded && this.queryData(elements, startTime, endTime, step, params)
+        this.chartInfo.loaded && this.queryData(elements, startTime, endTime, step, params, isRefresh)
         return
       }
-      this.chartInfo.loaded && this.query(elements, startTime, endTime, step, params)
+      this.chartInfo.loaded && this.query(elements, startTime, endTime, step, params, isRefresh)
     },
-    query (elements, startTime, endTime, step, params) { // 获取chart的数据
+    query (elements, startTime, endTime, step, params, isRefresh) { // 获取chart的数据
       this.isError = false
       this.allDataLength = 0
       // this.chartData = this.chartInfo.chartData
@@ -508,6 +512,12 @@ export default {
               } else {
                 this.chartData = [this.chartInfo.param.topo]
               }
+              if (isRefresh) {
+                let dom = this.$refs.chart.$refs['chart' + this.chartInfo.id]
+                if (dom) {
+                  dom.refresh([startTime, endTime])
+                }
+              }
             }
             if (this.chartInfo.type === 'group') {
               this.chartData = lodash.get(this, 'chartInfo.children', [])

nezha-fronted/src/components/common/mixin/beforeMeta2d.js

@@ -18,7 +18,7 @@ export default {
     chart: {}
   },
   methods: {
-    reload () {
+    reload (isRefresh) {
       if (this.currentProject && this.currentProject.id) {
         this.$get('monitor/project/topo', { projectId: this.currentProject.id }).then(res => {
           if (res.data && res.data.topo) {
@@ -42,6 +42,20 @@ export default {
         const res = {
           data: this.chartInfo.param
         }
+        if (isRefresh) {
+          this.$get('/visual/dashboard/chart/' + this.chartInfo.id).then(response => {
+            res.data = JSON.parse(response.data.param)
+            console.log(res.data)
+            this.topoInit(res)
+            this.chartInfo.param.topo = res.data.topo
+            this.$refs.diagram && this.$refs.diagram.reload()
+          })
+        } else {
+          this.topoInit(res)
+        }
+      }
+    },
+    topoInit (res) {
       if (res.data && res.data.topo) {
         this.topoData = res.data.topo || {}
         if (res.data.topo.topo) {
@@ -61,4 +75,3 @@ export default {
     }
   }
 }
-}

nezha-fronted/src/components/common/project/meta2d/js/meta2dMainCalc.js

@@ -124,8 +124,12 @@ export default {
     },
     reload () {
       this.position.show = false
-      const endTime = new Date().getTime()
-      const startTime = endTime - 60 * this.params.timeType * 1000
+      let endTime = new Date().getTime()
+      let startTime = endTime - 60 * this.params.timeType * 1000
+      if (this.isChart) {
+        startTime = this.timeRange[0]
+        endTime = this.timeRange[1]
+      }
       this.getQueryValues(this.querysArray, startTime, endTime).then((arr) => {
         this.clacTopoData(this.$lodash.cloneDeep(this.topoData), arr).then((data) => {
           if (!getTopology(this.meta2dId)) {

nezha-fronted/src/components/common/project/meta2d/meta2dMain.vue

@@ -172,7 +172,9 @@ export default {
     paddingTop: {
       type: Number,
       default: 20
-    }
+    },
+    timeRange: {},
+    nowTimeType: {}
   },
   data () {
     return {
@@ -188,8 +190,6 @@ export default {
       },
     }
   },
-  computed: {
-  },
   components: {
     meta2dHeader,
     meta2dProps,