NEZ-3185 feat：dashboard promql&logql支持自定义 step

nezha-fronted/src/assets/css/common.scss

@@ -743,3 +743,6 @@ i.nz-icon-override{
 .el-form-item__error {
   padding-top: 0;
 }
+input::placeholder{
+  text-transform:capitalize;
+}

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

@@ -244,6 +244,13 @@ export default {
       }
       this.chartInfo.loaded && this.query(elements, startTime, endTime, step, params, isRefresh)
     },
+    getIemStep (element, step) {
+      let myStep = step
+      if (element.step) {
+        myStep = element.step + 's'
+      }
+      return myStep
+    },
     query (elements, startTime, endTime, step, params, isRefresh) { // 获取chart的数据
       this.isError = false
       this.allDataLength = 0
@@ -271,10 +278,11 @@ export default {
               urlPre += '/logs/loki'
             }
             let requests = elements.map((element) => {
+              const myStep = this.getIemStep(element, step)
               if (this.from === fromRoute.chartTemp || this.from === fromRoute.dashboardTemp) {
                 return chartTempData
               }
-              let query = `${urlPre}/api/v1/query_range?start=${startTime}&end=${endTime}&step=${step}`
+              let query = `${urlPre}/api/v1/query_range?start=${startTime}&end=${endTime}&step=${myStep}`
               if (isTimeSeries(this.chartInfo.type)) {
                 let nullType = this.chartInfo.param.nullType || 'null'
                 nullType = (nullType === 'connected' ? 'null' : nullType)
@@ -298,10 +306,11 @@ export default {
             })
             if (this.multipleTime) {
               const multipleRequests = elements.map((element) => {
+                const myStep = this.getIemStep(element, step)
                 if (this.from === fromRoute.chartTemp || this.from === fromRoute.dashboardTemp) {
                   return chartTempData
                 }
-                let query = `${urlPre}/api/v1/query_range?start=${startTime - this.minusTime / 1000}&end=${endTime - this.minusTime / 1000}&step=${step}`
+                let query = `${urlPre}/api/v1/query_range?start=${startTime - this.minusTime / 1000}&end=${endTime - this.minusTime / 1000}&step=${myStep}`
                 if (isTimeSeries(this.chartInfo.type)) {
                   let nullType = this.chartInfo.param.nullType || 'null'
                   nullType = (nullType === 'connected' ? 'null' : nullType)
@@ -351,7 +360,8 @@ export default {
               }
               if (comparisonSt && comparisonEt) {
                 const comparisonRequests = elements.map((element) => {
-                  let query = `${urlPre}/api/v1/query_range?start=${comparisonSt}&end=${comparisonEt}&step=${step}`
+                  const myStep = this.getIemStep(element, step)
+                  let query = `${urlPre}/api/v1/query_range?start=${comparisonSt}&end=${comparisonEt}&step=${myStep}`
                   if (element.filter) {
                     query += `&filter=${element.filter}`
                   }

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

@@ -82,7 +82,7 @@ export default {
       const meta2dOptions = {
         minScale: this.minScale,
         // maxScale: 2,
-        autoAnchor: false,
+        autoAnchor: false
         // disableAnchor: true
       }
       const meta2d = new window.Meta2d(this.meta2dId, meta2dOptions)
@@ -131,8 +131,12 @@ export default {
         startTime = this.timeRange[0]
         endTime = this.timeRange[1]
       } else if (this.filterTime) {
-        startTime = this.filterTime[0]
-        endTime = this.filterTime[1]
+        startTime = this.momentStrToTimestamp(this.filterTime[0])
+        endTime = this.momentStrToTimestamp(this.filterTime[1])
+      }
+      if (typeof (startTime) == 'string') {
+        startTime = this.momentStrToTimestamp(this.filterTime[0])
+        endTime = this.momentStrToTimestamp(this.filterTime[1])
       }
       this.getQueryValues(this.querysArray, startTime, endTime).then((arr) => {
         this.clacTopoData(this.$lodash.cloneDeep(this.topoData), arr).then((data) => {

nezha-fronted/src/components/common/rightBox/chart/chartConfig.vue

@@ -106,6 +106,13 @@
                 <el-col style="flex: 1">
                   <el-input maxlength="512" show-word-limit size="small" type="text" v-model="expressionsShow[index-1].legend" @change="expressionChange"></el-input>
                 </el-col>
+                <el-col class="legend-title" style="margin-left: 10px">
+                  <span class="legend-title__span">{{$t('overall.step')}}&nbsp;</span>
+                </el-col>
+                <el-col style="flex: 1">
+                  <el-input-number @change="expressionChange" v-model="expressionsShow[index-1].step" size="small" :min="minStep" :precision="0" :controls="false" class="append_unit" :placeholder="$t('overall.auto')" :data-unit="$t('overall.seconds')">
+                  </el-input-number>
+                </el-col>
               </el-row>
             </el-row>
           </transition>
@@ -1341,7 +1348,11 @@ export default {
     }
   },
   mixins: [promqlInputMixin, publicConfig, chartTypeShow],
-  computed: {},
+  computed: {
+    minStep () {
+      return this.nzDefaultConfig.minStep
+    }
+  },
   data () {
     return {
       rules: {

nezha-fronted/src/components/common/rightBox/chart/chartRightBox.vue

@@ -381,7 +381,7 @@ export default {
           height: 4,
           unit: 2,
           type: 'line',
-          elements: [{ expression: '', legend: '', type: 'expert', id: '', name: 'A', state: 1 }],
+          elements: [{ expression: '', legend: '', type: 'expert', id: '', name: 'A', state: 1 , step: undefined}],
           param: {
             stack: 0,
             nullType: 'null',
@@ -423,7 +423,7 @@ export default {
           height: 4,
           unit: 2,
           type: 'log',
-          elements: [{ expression: '', legend: '', type: 'expert', id: '', name: 'A', state: 1 }],
+          elements: [{ expression: '', legend: '', type: 'expert', id: '', name: 'A', state: 1 , step: undefined}],
           param: {
             enable: {
               thresholds: false,

nezha-fronted/src/components/common/rightBox/chart/publicConfig.js

@@ -327,7 +327,8 @@ export default {
               legend: this.expressionsShow[i].legend,
               name: this.expressionName[i],
               state: this.expressionsShow[i].state,
-              orderNum: i
+              orderNum: i,
+              step: this.expressionsShow[i].step
             })
           }
         })
@@ -407,7 +408,8 @@ export default {
           error: '',
           legend: '',
           elementId: '',
-          state: 1
+          state: 1,
+          step: undefined
         })
         this.expressionChange()
       } else {
@@ -420,7 +422,8 @@ export default {
           error: '',
           elementId: item.id,
           legend: item.legend,
-          state: item.state
+          state: item.state,
+          step: item.step
         })
       }
     },

nezha-fronted/src/components/page/dashboard/dashboard.vue

@@ -272,7 +272,7 @@ export default {
             pointSize: 6
           }
         },
-        elements: [{ expression: '', legend: '', type: 'expert', id: '', name: 'A', state: 1, orderNum: 0 }],
+        elements: [{ expression: '', legend: '', type: 'expert', id: '', name: 'A', state: 1, orderNum: 0 , step: undefined}],
         panel: '',
         sync: 0,
         remark: '',