fix:修复从编辑页删除图表的bug & 新增table类型图表参数

nezha-fronted/src/components/charts/chart-list.vue

@@ -842,6 +842,9 @@
                   chartInfo.param.nullType=chartInfo.param.nullType||'connected';
                   query+='&nullType='+chartInfo.param.nullType;
                 }
+                if(chartInfo.type === 'table'&&chartInfo.param&&chartInfo.param.last == 1){
+                  return this.$get('/prom/api/v1/query_range?query=' + query + "&start=" + this.$stringTimeParseToUnix(endTime) + "&end=" + this.$stringTimeParseToUnix(endTime) + '&step=' + step);
+                }
                 return this.$get('/prom/api/v1/query_range?query=' + query + "&start=" + this.$stringTimeParseToUnix(startTime) + "&end=" + this.$stringTimeParseToUnix(endTime) + '&step=' + step);
               });
               // 一个图表的所有element单独获取数据

nezha-fronted/src/components/common/bottomBox/tabs/panelTab.vue

@@ -86,7 +86,7 @@
     </div>
     <button class="to-top" :class="{'to-top-is-hover': tableHover}" v-show="showTopBtn" @click="$toTop('el', $refs.dashboardScrollbar.wrap)" style="bottom: 0;"><i class="nz-icon nz-icon-top"></i></button>
     <transition name="right-box">
-      <chart-box @close="closeRightBox" :chart="chart" v-if="rightBox.show" ref="addChartModal" :show-panel="showPanel" :panel-data="panelData" @on-create-success="createSuccess" @on-delete-success="delChartOk"></chart-box>
+      <chart-box @close="closeRightBox" @delete-chart="delChart" :chart="chart" v-if="rightBox.show" ref="addChartModal" :show-panel="showPanel" :panel-data="panelData" @on-create-success="createSuccess" @on-delete-success="delChartOk"></chart-box>
     </transition>
   </div>
 </template>
@@ -249,12 +249,30 @@
                 type: 'success',
                 message: this.$t("tip.deleteSuccess")
               });
+              this.rightBox.show = false;
               let chartList=this.$refs.chartList.dataList;
+              let nextChart=null,prevChart=null
               for (let i =0;i< chartList.length;i++){
                 if(chartList[i].id === data.id){
                   chartList.splice(i,1);
-                  break;
                 }
+                if(data.next != -1){
+                  if(chartList[i].id === data.next){
+                    nextChart = chartList[i]
+                  }
+                }
+                if(data.prev != 0){
+                  if(chartList[i].id === data.prev){
+                    prevChart = chartList[i]
+                  }
+                }
+              }
+              if(nextChart&&prevChart){ //删除图表为中间位置
+                prevChart.next = nextChart.id;
+                nextChart.prev = prevChart.id;
+              }else{
+                if(!nextChart) prevChart.next = -1;
+                if(!prevChart) nextChart.prev = 0;
               }
               // this.getTableData(this.obj.id); //删除相关图表后，刷新面板数据
             } else {

nezha-fronted/src/components/common/language/cn.js

@@ -129,6 +129,7 @@ const cn = {
         url: "URL",
         statistics:'Statistics',
         sync: '同步到设备',
+        last:'Last',
         threshold:'阈值',
         typeVal: {
           line: {

nezha-fronted/src/components/common/language/en.js

@@ -138,6 +138,7 @@ const en = {
         statistics:'Statistics',
         legendTip:'Controls the name of the time series, using name or pattern. For example {{hostname}} will be replaced with label value for the label hostname.',
         sync: 'Sync to assets',
+        last:'Last',
         threshold:'Threshold',
         typeVal:{
           line:{

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

@@ -143,6 +143,9 @@
           <span class="nz-input-append">px</span>
         </el-form-item>
 
+        <el-form-item :label="$t('dashboard.panel.chartForm.last')" v-if="editChart.type == 'table'">
+          <el-switch class="exporter-switch" v-model="editChart.param.last" active-color="#ee9d3f" :active-value="1" :inactive-value="0"></el-switch>
+        </el-form-item>
 
         <el-form-item :label="$t('dashboard.panel.chartForm.sync')" v-if="showPanel.type && showPanel.type == 'model'">
           <el-switch class="exporter-switch" v-model="editChart.sync" active-color="#ee9d3f" :active-value="1" :inactive-value="0"></el-switch>
@@ -531,24 +534,8 @@
           }
         });
       },
-      del(u) {
-        this.$confirm(this.$t("tip.confirmDelete"), {
-          confirmButtonText: this.$t("tip.yes"),
-          cancelButtonText: this.$t("tip.no"),
-          type: 'warning'
-        }).then(() => {
-          this.$delete("panel/" + this.panelId + "/charts?ids=" + u.id).then(response => {
-            if (response.code === 200) {
-              if(this.$refs.chartForm){
-                this.$refs.chartForm.resetFields();//清空表单
-              }
-              this.$message({duration: 1000, type: 'success', message: this.$t("tip.deleteSuccess")});
-              this.esc(true);
-            } else {
-              this.$message.error(response.msg);
-            }
-          })
-        });
+      del() {
+          this.$emit('delete-chart',this.editChart)
       },
       //----------------------------------
 
@@ -1054,6 +1041,7 @@
         this.editChart.height = 400+'';
         this.editChart.unit=2;
         let param = {};
+        param.last=0;
         param.url='';
         param.threshold='';
         param.valueMapping={type:'text',mapping:[{value:'',text:''}]};
@@ -1120,6 +1108,8 @@
           this.setIsOtherChart();
           if(chartType === 'bar'||chartType === 'line'||chartType === 'stackArea'){
             this.editChart.param={nullType:this.editChart.param.nullType,threshold:'',legendValue:{min:'off',max:'off',avg:'off',last:'off',total:'off'}}
+          }else if(chartType == 'table'){
+            this.editChart.param.last= 0;
           }
           /*if(this.$refs.chartTag){
             this.$refs.chartTag.forEach((item, index) => {
@@ -1295,7 +1285,9 @@
           } else if(n.type === 'singleStat'){
             n.param&&!n.param.valueMapping&&this.$set(this.editChart.param,'valueMapping',{type:'value',mapping:[{text:'',value:''}]})
             this.setIsSingleStat();
-          } else {
+          } else if(n.type  === 'table'){
+            n.param.last?this.$set(this.editChart.param,'last',n.param.last):this.$set(this.editChart.param,'last',0)
+          }else {
             this.setIsOtherChart();
             n.param&&!n.param.legendValue&&this.$set(this.editChart.param,'legendValue',{min:'off',max:'off',avg:'off',last:'off',total:'off'})
           }

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

@@ -84,7 +84,7 @@
     <button class="to-top" :class="{'to-top-is-hover': tableHover}" v-show="showTopBtn" @click="$toTop('el', $refs.dashboardScrollbar.wrap)" style="bottom: 0;"><i class="nz-icon nz-icon-top"></i></button>
 
     <transition name="right-box">
-      <chart-box @close="closeChartBox" :chart="chart" v-if="rightBox.chart.show" ref="addChartModal" :show-panel="showPanel" :panel-data="panelData" @reload="panelReload" @on-create-success="createSuccess" @on-delete-success="delChartOk" @reloadOnlyPanel="panelReloadOnlyPanel"></chart-box>
+      <chart-box @close="closeChartBox" @delete-chart="delChart" :chart="chart" v-if="rightBox.chart.show" ref="addChartModal" :show-panel="showPanel" :panel-data="panelData" @reload="panelReload" @on-create-success="createSuccess" @on-delete-success="delChartOk" @reloadOnlyPanel="panelReloadOnlyPanel"></chart-box>
     </transition>
     <transition name="right-box">
       <panel-box v-if="closePanelBox" :panel="panel" @reload="panelReload" @reloadForDel="panelReloadForDel" ref="panelBox"></panel-box>
@@ -321,6 +321,7 @@
                 type: 'success',
                 message: this.$t("tip.deleteSuccess")
               });
+              this.rightBox.chart.show = false;
               let chartList=this.$refs.chartList.dataList;
               let nextChart=null,prevChart=null
               for (let i =0;i< chartList.length;i++){