CN-468 fix: 时间、刷新问题修复

src/views/Temp.vue

@@ -76,7 +76,6 @@ export default {
       const data = lineData.map(d => {
         return [getMillisecond(new Date(d[2]).getTime()), d[1]]
       })
-      console.info(JSON.stringify(data))
       const option = this.$_.cloneDeep(lineOption)
       option.series.data = data
       const dom = document.getElementById('lineCanvas')

src/views/charts/Chart.vue

@@ -4,6 +4,7 @@
     <chart-no-data v-if="isNoData"></chart-no-data>
     <template v-else>
       <chart-tabs
+        ref="chart"
         v-if="isTabs"
         :chart-info="chartInfo"
         :time-filter="timeFilter"
@@ -42,6 +43,7 @@
       ></chart-block>
 
       <chart-group
+        ref="chart"
         v-else-if="isGroup"
         :query-params="queryParams"
         :time-filter="timeFilter"
@@ -452,15 +454,8 @@ export default {
     tabHandleClickType: {
       deep: true,
       handler (n) {
-        console.log(n)
         this.tabHandleClickType = n
       }
-    },
-    chartData: {
-      deep: true,
-      immediate: true,
-      handler (n) {
-      }
     }
   },
   setup (props) {

src/views/charts/PanelChart.vue

@@ -165,21 +165,21 @@ export default {
     }
   },
   methods: {
-    /* 参数 extraParams 额外请求参数，isRefresh 是否是刷新 */
-    getChartData (url, extraParams = {}, isRefresh, chartTimeFilter, num) {
+    /* 参数 extraParams 额外请求参数 */
+    getChartData (url, extraParams = {}, chartTimeFilter, num) {
       const vm = this
       this.loading = true
-      this.standaloneTimeRange.use = !!isRefresh
       try {
-        // 单个图表刷新时，使用单独的时间
         if (chartTimeFilter) {
-          this.queryTimeRange = { startTime: getSecond(chartTimeFilter.startTime), endTime: getSecond(chartTimeFilter.endTime) }
+          // 图表自带timeFilter刷新时
+          this.queryTimeRange = { startTime: getSecond(chartTimeFilter.startTime), endTime: getSecond(chartTimeFilter.endTime), dateRangeValue: chartTimeFilter.dateRangeValue }
         } else if (this.standaloneTimeRange.use) {
-          this.queryTimeRange = { startTime: getSecond(this.standaloneTimeRange.startTime), endTime: getSecond(this.standaloneTimeRange.endTime) }
+          // 单个图表刷新时，使用单独的时间
+          this.queryTimeRange = { startTime: getSecond(this.standaloneTimeRange.startTime), endTime: getSecond(this.standaloneTimeRange.endTime), dateRangeValue: this.timeFilter.dateRangeValue }
         } else if (this.timeFilter) {
-          this.queryTimeRange = { startTime: getSecond(this.timeFilter.startTime), endTime: getSecond(this.timeFilter.endTime) }
+          this.queryTimeRange = { startTime: getSecond(this.timeFilter.startTime), endTime: getSecond(this.timeFilter.endTime), dateRangeValue: this.timeFilter.dateRangeValue }
         } else {
-          this.queryTimeRange = { startTime: getSecond(this.chartTimeFilter.startTime), endTime: getSecond(this.chartTimeFilter.endTime) }
+          this.queryTimeRange = { startTime: getSecond(this.chartTimeFilter.startTime), endTime: getSecond(this.chartTimeFilter.endTime), dateRangeValue: this.chartTimeFilter.dateRangeValue }
         }
         const chartParams = this.chartInfo.params
         if (this.isAlarmInfo && JSON.stringify(extraParams) === '{}') {
@@ -270,9 +270,9 @@ export default {
               }
             }, 200)
           })
-        } else if (isGroup(this.chartInfo.type)) {
-          this.chartInfo.children = [...this.chartInfo.children]
-        } else if (isBlock(this.chartInfo.type)) {
+        } else if (this.isGroup || this.isTabs) {
+          this.$refs.chart.$refs.chart.reload()
+        } else if (this.isBlock) {
           if (!this.chartInfo.firstShow) {
             this.chartInfo.firstShow = true
           } else {
@@ -309,15 +309,19 @@ export default {
         this.timeFilter.startTime = chartTimeFilter.startTime
         this.timeFilter.endTime = chartTimeFilter.endTime
         this.timeFilter.dateRangeValue = chartTimeFilter.dateRangeValue
-        this.getChartData(null, {}, true, chartTimeFilter)
+        this.getChartData(null, {}, chartTimeFilter)
       } else {
-        const myEndTime = window.$dayJs.tz().valueOf()
-        const myStartTime = myEndTime - this.timeFilter.dateRangeValue * 60 * 1000
-        this.standaloneTimeRange.use = true
-        this.standaloneTimeRange.startTime = myStartTime
-        this.standaloneTimeRange.endTime = myEndTime
+        if (this.timeFilter.dateRangeValue && this.timeFilter.dateRangeValue > 0) {
+          const myEndTime = window.$dayJs.tz().valueOf()
+          const myStartTime = myEndTime - this.timeFilter.dateRangeValue * 60 * 1000
+          this.standaloneTimeRange.use = true
+          this.standaloneTimeRange.startTime = myStartTime
+          this.standaloneTimeRange.endTime = myEndTime
+        } else {
+          this.standaloneTimeRange.use = false
+        }
         this.emitter.emit('chart-pageNo')
-        this.getChartData(null, {}, true)
+        this.getChartData(null, {})
       }
     },
     tabHandleClick (value) {

src/views/charts/charts/ChartGroup.vue

@@ -2,7 +2,7 @@
   <panel-chart-list
       :time-filter="timeFilter"
       :query-params="queryParams"
-      :data-list="chartInfo.children"
+      :data-list="dataList"
       :panel-lock="true"
       :entity="entity"
   >
@@ -11,6 +11,7 @@
 
 <script>
 import chartMixin from '@/views/charts/charts/chart-mixin'
+import _ from 'lodash'
 
 export default {
   name: 'ChartGroup',
@@ -18,6 +19,17 @@ export default {
   props: {
     timeFilter: Object,
     queryParams: Object
+  },
+  methods: {
+    reload () {
+      this.dataList = _.cloneDeep(this.dataList)
+    }
+  },
+  setup (props) {
+    const dataList = [...props.chartInfo.children]
+    return {
+      dataList
+    }
   }
 }
 </script>

src/views/charts/charts/ChartTabs.vue

@@ -6,7 +6,7 @@
       :ref="`chart-${chartInfo.id}`"
   >
     <el-tab-pane
-        v-for="tab in chartInfo.children"
+        v-for="tab in dataList"
         :label="tab.i18n ? $t(tab.i18n) : tab.name" :name="`${tab.id}`"
         :key="tab.id"
         :ref="`chart-${chartInfo.id}`"
@@ -29,14 +29,6 @@ import chartMixin from '@/views/charts/charts/chart-mixin'
 
 export default {
   name: 'ChartTabs',
-  computed: {
-    timeFilter () {
-      return {
-        startTime: this.queryParams.startTime,
-        endTime: this.queryParams.endTime
-      }
-    }
-  },
   mixins: [chartMixin],
   methods: {
     showFullscreen () {
@@ -44,6 +36,9 @@ export default {
     },
     changeTab (tab) {
       this.activeTab = tab.paneName
+    },
+    reload () {
+      this.dataList = _.cloneDeep(this.dataList)
     }
   },
   setup (props) {
@@ -51,8 +46,10 @@ export default {
     if (!_.isEmpty(props.chartInfo.children)) {
       activeTab = `${props.chartInfo.children[0].id}`
     }
+    const dataList = [...props.chartInfo.children]
     return {
-      activeTab
+      activeTab,
+      dataList
     }
   }
 }

src/views/detections/Index.vue

@@ -673,7 +673,6 @@ export default {
     'filterData.securityEvent.0.value': {
       deep: true,
       handler (n, o) {
-        console.info(n, o)
         this.$refs.search.changeParams({ column: this.filterData.securityEvent[0].column, oldValue: o, newValue: n })
       }
     },