From 167c4498bb98c87d01885f66945dd014a3c83c6c Mon Sep 17 00:00:00 2001 From: zhangyu Date: Fri, 10 Dec 2021 11:33:45 +0800 Subject: [PATCH] =?UTF-8?q?NEZ-1281=20feat=EF=BC=9Achart-value=20=E7=BB=84?= =?UTF-8?q?=E4=BB=B6=E5=BC=80=E5=8F=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../assets/css/components/chart/chart.scss | 10 + nezha-fronted/src/components/chart/chart.vue | 9 +- .../src/components/chart/chart/chartStat.vue | 56 +- .../src/components/chart/chart/tools.js | 3 + .../src/components/chart/testData.js | 1013 ----------------- .../src/components/common/js/constants.js | 2 +- .../common/rightBox/chart/chartConfig.vue | 9 +- .../common/rightBox/chart/publicConfig.js | 2 + .../src/components/page/dashboard/panel.vue | 1 - 9 files changed, 86 insertions(+), 1019 deletions(-) delete mode 100644 nezha-fronted/src/components/chart/testData.js diff --git a/nezha-fronted/src/assets/css/components/chart/chart.scss b/nezha-fronted/src/assets/css/components/chart/chart.scss index 1eb0352c3..1f69d3085 100644 --- a/nezha-fronted/src/assets/css/components/chart/chart.scss +++ b/nezha-fronted/src/assets/css/components/chart/chart.scss @@ -256,3 +256,13 @@ height: 100%; } } +.chart-stat{ + height: calc(100% - 20px); + margin: 10px; + display: flex; + justify-content: center; + align-items: center; + font-size: 30px; + word-break: break-all; + border-radius: 2px; +} diff --git a/nezha-fronted/src/components/chart/chart.vue b/nezha-fronted/src/components/chart/chart.vue index b8a13dc29..77fb6ef1e 100644 --- a/nezha-fronted/src/components/chart/chart.vue +++ b/nezha-fronted/src/components/chart/chart.vue @@ -55,6 +55,12 @@ :chart-info="chartInfo" :chart-option="chartOption" > + @@ -79,7 +85,7 @@ import chartTreemap from './chart/chartTreemap' import chartUrl from './chart/chartUrl' import chartValue from './chart/chartValue' import chartHexagon from './chart/chartHexagon' -import { getOption, isTimeSeries, isHexagonFigure, isUrl, isText, isChartPie, isChartBar, isTreemap, isLog } from './chart/tools' +import { getOption, isTimeSeries, isHexagonFigure, isUrl, isText, isChartPie, isChartBar, isTreemap, isLog, isStat } from './chart/tools' import lodash from 'lodash' export default { @@ -133,6 +139,7 @@ export default { isText, isTreemap, isLog, + isStat, resize () { this.$refs['chart' + this.chartInfo.id].resize() } diff --git a/nezha-fronted/src/components/chart/chart/chartStat.vue b/nezha-fronted/src/components/chart/chart/chartStat.vue index 28e6932b2..a0864dad0 100644 --- a/nezha-fronted/src/components/chart/chart/chartStat.vue +++ b/nezha-fronted/src/components/chart/chart/chartStat.vue @@ -1,10 +1,62 @@ diff --git a/nezha-fronted/src/components/chart/chart/tools.js b/nezha-fronted/src/components/chart/chart/tools.js index 73be52583..ad381c12f 100644 --- a/nezha-fronted/src/components/chart/chart/tools.js +++ b/nezha-fronted/src/components/chart/chart/tools.js @@ -73,6 +73,9 @@ export function isTreemap (type) { export function isLog (type) { return type === chartType.log } +export function isStat (type) { + return type === chartType.stat +} export function initColor (colorNum = 20) { const colorList = [ diff --git a/nezha-fronted/src/components/chart/testData.js b/nezha-fronted/src/components/chart/testData.js deleted file mode 100644 index a15bdda07..000000000 --- a/nezha-fronted/src/components/chart/testData.js +++ /dev/null @@ -1,1013 +0,0 @@ -const chartData = { - msg: 'success', - code: 200, - data: { - total: 3, - pageSize: -1, - pages: 1, - pageNo: 1, - list: [ - // { - // id: 690483, - // name: '123', - // panelId: 1243, - // groupId: 0, - // datasource: 'metrics', - // span: 12, - // height: 6, - // updateBy: 1, - // updateAt: '2021-11-10 07:06:09', - // type: 'line', - // unit: 2, - // weight: 0, - // param: '{' + - // ' "style":"area",' + - // ' "showHeader":false,' + - // ' "stack":true,' + - // ' "legend":{' + - // ' "placement":"bottom",' + - // ' "values":["min","max","avg","first","last","total"]' + - // ' },' + - // ' "thresholds":[{' + - // ' "color":"#eee",' + - // ' "val":"0.9"' + - // ' },{' + - // ' "color":"#aaa",' + - // ' "val":"1.1"' + - // ' }],' + - // ' "nullType":"zero"' + - // '}', - // pid: null, - // buildIn: 0, - // remark: '123', - // seq: null, - // x: 0, - // y: 0, - // w: 6, - // h: 4, - // i: 690483, - // elements: [ - // { - // id: 68527, - // chartId: 690483, - // // expression: 'up{asset="44.37"}', - // expression: 'label_replace(up{instance=~\'.*10090\',job=\'\'},"asset","$1","instance","(.*)")', - // type: 'expert', - // legend: '{{asset}}', - // buildIn: 0, - // seq: null - // }, - // { - // id: 68528, - // chartId: 690483, - // expression: 'Hadoop_HBase_Healthy', - // type: 'expert', - // legend: '', - // buildIn: 0, - // seq: null - // } - // ], - // sync: null, - // panel: { - // id: 1243, - // name: 'test', - // createBy: null, - // type: null, - // link: null, - // pid: null, - // weight: null, - // buildIn: null, - // seq: null, - // children: null, - // parent: null, - // chartNum: null - // }, - // group: { - // id: 0, - // name: null, - // panelId: null, - // groupId: null, - // span: null, - // height: null, - // updateBy: null, - // updateAt: null, - // type: null, - // unit: null, - // weight: null, - // param: null, - // pid: null, - // buildIn: null, - // remark: null, - // seq: null, - // x: null, - // y: null, - // elements: null, - // sync: null, - // panel: null, - // group: null, - // children: null, - // chartNums: null, - // asset: null, - // varType: null, - // varId: null, - // varName: null - // }, - // children: [ - // - // ], - // chartNums: null, - // asset: null, - // varType: null, - // varId: null, - // varName: null - // }, - // { - // id: 690500, - // name: '233', - // panelId: 1243, - // groupId: 0, - // datasource: 'metrics', - // span: 6, - // height: 4, - // updateBy: 1, - // updateAt: '2021-11-10 09:05:13', - // type: 'point', - // unit: 2, - // weight: 1, - // param: '{' + - // ' "style":"point",' + - // ' "showHeader":true,' + - // ' "stack":false,' + - // ' "legend":{' + - // ' "placement":"right"' + - // // ' "values":["min","max","avg","first","last","total"]' + - // ' },' + - // ' "thresholds":[{' + - // ' "color":"#ff0000",' + - // ' "val":"100"' + - // ' },{' + - // ' "color":"#00ff00",' + - // ' "val":"250"' + - // ' }],' + - // ' "nullType":"zero"' + - // '}', - // pid: null, - // buildIn: 0, - // remark: '', - // seq: null, - // x: 6, - // y: 0, - // w: 3, - // h: 4, - // i: 690484, - // elements: [ - // { - // id: 68542, - // chartId: 690500, - // expression: '233', - // type: 'expert', - // legend: '', - // buildIn: 0, - // seq: null - // } - // ], - // sync: null, - // panel: { - // id: 1243, - // name: 'test', - // createBy: null, - // type: null, - // link: null, - // pid: null, - // weight: null, - // buildIn: null, - // seq: null, - // children: null, - // parent: null, - // chartNum: null - // }, - // group: { - // id: 0, - // name: null, - // panelId: null, - // groupId: null, - // span: null, - // height: null, - // updateBy: null, - // updateAt: null, - // type: null, - // unit: null, - // weight: null, - // pid: null, - // buildIn: null, - // remark: null, - // seq: null, - // x: null, - // y: null, - // elements: null, - // sync: null, - // panel: null, - // group: null, - // children: null, - // chartNums: null, - // asset: null, - // varType: null, - // varId: null, - // varName: null - // }, - // children: [ - // - // ], - // chartNums: null, - // asset: null, - // varType: null, - // varId: null, - // varName: null - // }, - // { - // id: 690501, - // name: '323', - // panelId: 1243, - // groupId: 0, - // span: 6, - // height: 4, - // updateBy: 1, - // updateAt: '2021-11-10 09:51:06', - // type: 'line', - // unit: 2, - // weight: 2, - // datasource: 'metrics', - // param: '{' + - // ' "style":"line",' + - // ' "showHeader":true,' + - // ' "stack":true,' + - // ' "legend":{' + - // ' "placement":"left"' + - // // ' "values":["min","max","avg","first","last","total"]' + - // ' },' + - // ' "thresholds":[{' + - // ' "color":"#eee",' + - // ' "val":"10.1"' + - // ' },{' + - // ' "color":"#aaa",' + - // ' "val":"base"' + - // ' }],' + - // ' "nullType":"zero"' + - // '}', - // pid: null, - // buildIn: 0, - // remark: '123', - // seq: null, - // x: 0, - // y: 4, - // w: 6, - // h: 4, - // i: 690485, - // elements: [ - // { - // id: 68527, - // chartId: 690483, - // expression: 'up{asset="44.37"}', - // type: 'expert', - // legend: '', - // buildIn: 0, - // seq: null - // }, - // { - // id: 68528, - // chartId: 690483, - // expression: 'Hadoop_HBase_Healthy', - // type: 'expert', - // legend: '', - // buildIn: 0, - // seq: null - // } - // ], - // sync: null, - // panel: { - // id: 1243, - // name: 'test', - // createBy: null, - // type: null, - // link: null, - // pid: null, - // weight: null, - // buildIn: null, - // seq: null, - // children: null, - // parent: null, - // chartNum: null - // }, - // group: { - // id: 0, - // name: null, - // panelId: null, - // groupId: null, - // span: null, - // height: null, - // updateBy: null, - // updateAt: null, - // type: null, - // unit: null, - // weight: null, - // param: null, - // pid: null, - // buildIn: null, - // remark: null, - // seq: null, - // x: null, - // y: null, - // elements: null, - // sync: null, - // panel: null, - // group: null, - // children: null, - // chartNums: null, - // asset: null, - // varType: null, - // varId: null, - // varName: null - // }, - // children: [ - // { - // id: 690502, - // name: '123', - // panelId: 1243, - // groupId: 690501, - // span: 12, - // height: 4, - // updateBy: 1, - // updateAt: '2021-11-10 09:51:15', - // type: 'line', - // unit: 2, - // weight: 3, - // param: { - // last: 0, - // legendValue: { - // total: 'off', - // min: 'off', - // avg: 'off', - // last: 'off', - // max: 'off' - // }, - // threshold: '123', - // valueMapping: { - // mapping: [ - // { - // color: { - // bac: '#fff', - // text: '#000' - // }, - // text: '', - // value: '' - // } - // ], - // type: 'text' - // }, - // url: '', - // nullType: 'null' - // }, - // pid: null, - // buildIn: 0, - // remark: '', - // seq: null, - // x: 0, - // y: 0, - // w: 12, - // h: 4, - // i: 690489, - // elements: [ - // { - // id: 68543, - // chartId: 690502, - // expression: '123', - // type: 'expert', - // legend: '', - // buildIn: 0, - // seq: null - // } - // ], - // sync: null, - // panel: { - // id: 1243, - // name: 'test', - // createBy: null, - // type: null, - // link: null, - // pid: null, - // weight: null, - // buildIn: null, - // seq: null, - // children: null, - // parent: null, - // chartNum: null - // }, - // group: { - // id: 690501, - // name: '123', - // panelId: null, - // groupId: null, - // span: null, - // height: null, - // updateBy: null, - // updateAt: null, - // type: null, - // unit: null, - // weight: null, - // param: null, - // pid: null, - // buildIn: null, - // remark: null, - // seq: null, - // x: null, - // y: null, - // elements: null, - // sync: null, - // panel: null, - // group: null, - // children: null, - // chartNums: null, - // asset: null, - // varType: null, - // varId: null, - // varName: null - // }, - // children: [ - // - // ], - // chartNums: null, - // asset: null, - // varType: null, - // varId: null, - // varName: null - // } - // ], - // chartNums: null, - // asset: null, - // varType: null, - // varId: null, - // varName: null - // }, - // { - // id: 690502, - // name: '324', - // panelId: 1243, - // groupId: 0, - // span: 6, - // height: 4, - // updateBy: 1, - // updateAt: '2021-11-10 09:51:06', - // type: 'hexagonFigure', - // unit: 2, - // weight: 2, - // datasource: 'misc', - // param: '{' + - // ' "from":"module",' + - // ' "showHeader":true,' + - // ' "length":"48",' + - // ' "showTooltip": true ,' + - // ' "col":"8"' + - // '}', - // pid: null, - // buildIn: 0, - // remark: '123', - // seq: null, - // x: 6, - // y: 4, - // w: 6, - // h: 4, - // i: 690502, - // elements: [ - // { - // id: 68527, - // chartId: 690483, - // expression: 'up{asset="44.37"}', - // type: 'expert', - // legend: '', - // buildIn: 0, - // seq: null - // }, - // { - // id: 68528, - // chartId: 690483, - // expression: 'Hadoop_HBase_Healthy', - // type: 'expert', - // legend: '', - // buildIn: 0, - // seq: null - // } - // ], - // sync: null, - // panel: { - // id: 1243, - // name: 'test', - // createBy: null, - // type: null, - // link: null, - // pid: null, - // weight: null, - // buildIn: null, - // seq: null, - // children: null, - // parent: null, - // chartNum: null - // }, - // group: { - // id: 0, - // name: null, - // panelId: null, - // groupId: null, - // span: null, - // height: null, - // updateBy: null, - // updateAt: null, - // type: null, - // unit: null, - // weight: null, - // param: null, - // pid: null, - // buildIn: null, - // remark: null, - // seq: null, - // x: null, - // y: null, - // elements: null, - // sync: null, - // panel: null, - // group: null, - // children: null, - // chartNums: null, - // asset: null, - // varType: null, - // varId: null, - // varName: null - // }, - // children: [ - // { - // id: 690502, - // name: '123', - // panelId: 1243, - // groupId: 690501, - // span: 12, - // height: 4, - // updateBy: 1, - // updateAt: '2021-11-10 09:51:15', - // type: 'line', - // unit: 2, - // weight: 3, - // param: { - // last: 0, - // legendValue: { - // total: 'off', - // min: 'off', - // avg: 'off', - // last: 'off', - // max: 'off' - // }, - // threshold: '123', - // valueMapping: { - // mapping: [ - // { - // color: { - // bac: '#fff', - // text: '#000' - // }, - // text: '', - // value: '' - // } - // ], - // type: 'text' - // }, - // url: '', - // nullType: 'null' - // }, - // pid: null, - // buildIn: 0, - // remark: '', - // seq: null, - // x: 0, - // y: 0, - // w: 12, - // h: 4, - // i: 690489, - // elements: [ - // { - // id: 68543, - // chartId: 690502, - // expression: '123', - // type: 'expert', - // legend: '', - // buildIn: 0, - // seq: null - // } - // ], - // sync: null, - // panel: { - // id: 1243, - // name: 'test', - // createBy: null, - // type: null, - // link: null, - // pid: null, - // weight: null, - // buildIn: null, - // seq: null, - // children: null, - // parent: null, - // chartNum: null - // }, - // group: { - // id: 690501, - // name: '123', - // panelId: null, - // groupId: null, - // span: null, - // height: null, - // updateBy: null, - // updateAt: null, - // type: null, - // unit: null, - // weight: null, - // param: null, - // pid: null, - // buildIn: null, - // remark: null, - // seq: null, - // x: null, - // y: null, - // elements: null, - // sync: null, - // panel: null, - // group: null, - // children: null, - // chartNums: null, - // asset: null, - // varType: null, - // varId: null, - // varName: null - // }, - // children: [ - // - // ], - // chartNums: null, - // asset: null, - // varType: null, - // varId: null, - // varName: null - // } - // ], - // chartNums: null, - // asset: null, - // varType: null, - // varId: null, - // varName: null - // }, - // { - // id: 690487, - // name: '123', - // panelId: 1243, - // groupId: 0, - // datasource: 6, - // span: 12, - // height: 6, - // updateBy: 1, - // updateAt: '2021-11-10 07:06:09', - // type: 'url', - // unit: 2, - // weight: 0, - // param: '{' + - // ' "style":"area",' + - // ' "showHeader":false,' + - // ' "stack":true,' + - // ' "legend":{' + - // ' "placement":"bottom",' + - // ' "values":["min","max","avg","first","last","total"]' + - // ' },' + - // ' "thresholds":[{' + - // ' "color":"#eee",' + - // ' "val":"0.9"' + - // ' },{' + - // ' "color":"#aaa",' + - // ' "val":"1.1"' + - // ' }],' + - // ' "nullType":"zero",' + - // ' "url":"http://192.168.36.91"' + - // '}', - // pid: null, - // buildIn: 0, - // remark: 'url', - // seq: null, - // x: 8, - // y: 6, - // w: 6, - // h: 4, - // i: 690487, - // elements: [ - // { - // id: 68527, - // chartId: 690487, - // // expression: 'up{asset="44.37"}', - // expression: 'label_replace(up{instance=~\'.*10090\',job=\'\'},"asset","$1","instance","(.*)")', - // type: 'expert', - // legend: '{{asset}}', - // buildIn: 0, - // seq: null - // }, - // { - // id: 68528, - // chartId: 690487, - // expression: 'Hadoop_HBase_Healthy', - // type: 'expert', - // legend: '', - // buildIn: 0, - // seq: null - // } - // ], - // sync: null, - // panel: { - // id: 1243, - // name: 'test', - // createBy: null, - // type: null, - // link: null, - // pid: null, - // weight: null, - // buildIn: null, - // seq: null, - // children: null, - // parent: null, - // chartNum: null - // }, - // group: { - // id: 0, - // name: null, - // panelId: null, - // groupId: null, - // span: null, - // height: null, - // updateBy: null, - // updateAt: null, - // type: null, - // unit: null, - // weight: null, - // param: null, - // pid: null, - // buildIn: null, - // remark: null, - // seq: null, - // x: null, - // y: null, - // elements: null, - // sync: null, - // panel: null, - // group: null, - // children: null, - // chartNums: null, - // asset: null, - // varType: null, - // varId: null, - // varName: null - // }, - // children: [ - // - // ], - // chartNums: null, - // asset: null, - // varType: null, - // varId: null, - // varName: null - // }, - // { - // id: 690489, - // name: '123', - // panelId: 1243, - // groupId: 0, - // datasource: 5, - // span: 12, - // height: 6, - // updateBy: 1, - // updateAt: '2021-11-10 07:06:09', - // type: 'text', - // unit: 2, - // weight: 0, - // param: '{' + - // ' "style":"area",' + - // ' "showHeader":false,' + - // ' "stack":true,' + - // ' "legend":{' + - // ' "placement":"bottom",' + - // ' "values":["min","max","avg","first","last","total"]' + - // ' },' + - // ' "thresholds":[{' + - // ' "color":"#eee",' + - // ' "val":"0.9"' + - // ' },{' + - // ' "color":"#aaa",' + - // ' "val":"1.1"' + - // ' }],' + - // ' "nullType":"zero",' + - // ' "text": "

ss

"' + - // '}', - // pid: null, - // buildIn: 0, - // remark: 'text', - // seq: null, - // x: 10, - // y: 8, - // w: 6, - // h: 4, - // i: 690489, - // elements: [ - // { - // id: 68531, - // chartId: 690489, - // // expression: 'up{asset="44.37"}', - // expression: 'label_replace(up{instance=~\'.*10090\',job=\'\'},"asset","$1","instance","(.*)")', - // type: 'expert', - // legend: '{{asset}}', - // buildIn: 0, - // seq: null - // }, - // { - // id: 68532, - // chartId: 690489, - // expression: 'Hadoop_HBase_Healthy', - // type: 'expert', - // legend: '', - // buildIn: 0, - // seq: null - // } - // ], - // sync: null, - // panel: { - // id: 1243, - // name: 'test', - // createBy: null, - // type: null, - // link: null, - // pid: null, - // weight: null, - // buildIn: null, - // seq: null, - // children: null, - // parent: null, - // chartNum: null - // }, - // group: { - // id: 0, - // name: null, - // panelId: null, - // groupId: null, - // span: null, - // height: null, - // updateBy: null, - // updateAt: null, - // type: null, - // unit: null, - // weight: null, - // param: null, - // pid: null, - // buildIn: null, - // remark: null, - // seq: null, - // x: null, - // y: null, - // elements: null, - // sync: null, - // panel: null, - // group: null, - // children: null, - // chartNums: null, - // asset: null, - // varType: null, - // varId: null, - // varName: null - // }, - // children: [ - // - // ], - // chartNums: null, - // asset: null, - // varType: null, - // varId: null, - // varName: null - // }, - { - id: 690506, - name: '123', - panelId: 1243, - groupId: 0, - datasource: 'metrics', - span: 4, - height: 4, - updateBy: 1, - updateAt: '2021-11-10 07:06:09', - type: 'treemap', - unit: 2, - weight: 0, - param: JSON.stringify( - { - nullType: 'null', - statistics: 'last', - text: 'all', - valueMapping: - { - show: true, - mapping: [ - { type: 'value', show: true, value: 2, display: 'value', color: { bac: '#8ef9ab', text: '#6a21bc' } }, - { type: 'range', show: true, display: 'range', color: { bac: '#ef1cd0', text: '#66d815' }, from: 2, to: 123123 }, - { type: 'regx', show: true, display: 'regx', color: { bac: '#000000', text: '#ffffff' }, regx: '2' }] - } - }), - pid: null, - buildIn: 0, - remark: '123', - seq: null, - x: 0, - y: 0, - w: 6, - h: 4, - i: 690506, - elements: [ - { - id: 68527, - chartId: 690483, - // expression: 'up{asset="44.37"}', - // expression: 'label_replace(up{instance=~\'.*10090\',job=\'\'},"asset","$1","instance","(.*)")', - expression: '123', - type: 'expert', - legend: '{{asset}}', - buildIn: 0, - seq: null, - name: 'A' - }, - // { - // id: 68528, - // chartId: 690483, - // expression: 'Hadoop_HBase_Healthy', - // type: 'expert', - // legend: '{{asset}}', - // buildIn: 0, - // seq: null, - // name: 'B' - // } - ], - sync: null, - panel: { - id: 1243, - name: 'test', - createBy: null, - type: null, - link: null, - pid: null, - weight: null, - buildIn: null, - seq: null, - children: null, - parent: null, - chartNum: null - }, - group: { - id: 0, - name: null, - panelId: null, - groupId: null, - span: null, - height: null, - updateBy: null, - updateAt: null, - type: null, - unit: null, - weight: null, - param: null, - pid: null, - buildIn: null, - remark: null, - seq: null, - x: null, - y: null, - elements: null, - sync: null, - panel: null, - group: null, - children: null, - chartNums: null, - asset: null, - varType: null, - varId: null, - varName: null - }, - children: [ - - ], - chartNums: null, - asset: null, - varType: null, - varId: null, - varName: null - } - ] - }, - time: '2021-11-10 09:51:27' -} -export default chartData diff --git a/nezha-fronted/src/components/common/js/constants.js b/nezha-fronted/src/components/common/js/constants.js index 29cdcb386..03abd45bc 100644 --- a/nezha-fronted/src/components/common/js/constants.js +++ b/nezha-fronted/src/components/common/js/constants.js @@ -392,7 +392,7 @@ export const chartType = { point: 'point', bar: 'bar', table: 'table', - singleStat: 'singleStat', + stat: 'stat', gauge: 'gauge', pie: 'pie', treemap: 'treemap', diff --git a/nezha-fronted/src/components/common/rightBox/chart/chartConfig.vue b/nezha-fronted/src/components/common/rightBox/chart/chartConfig.vue index 6cfba2016..1bc15516e 100644 --- a/nezha-fronted/src/components/common/rightBox/chart/chartConfig.vue +++ b/nezha-fronted/src/components/common/rightBox/chart/chartConfig.vue @@ -52,7 +52,7 @@
{{expressionsShow[index-1].error}}
- + @@ -650,6 +650,7 @@ import chartTypeShow from '@/components/common/rightBox/chart/chartTypeShow' import VueTagsInput from '@johmun/vue-tags-input' import draggable from 'vuedraggable' import { randomcolor, ColorReverse } from '@/components/common/js/radomcolor/randomcolor' + export default { name: 'chartConfig', components: { @@ -769,6 +770,12 @@ export default { case 'treemap': case 'guage': case 'pie': + if (type === 'stat') { + this.expressions = [] + this.expressionName = [] + this.chartConfig.elements = [this.chartConfig.elements[0]] + this.addExpression(this.chartConfig.elements[0]) + } if (this.oldType === 'stat' || this.oldType === 'bar' || this.oldType === 'treemap' || this.oldType === 'guage' || this.oldType === 'pie') { break } diff --git a/nezha-fronted/src/components/common/rightBox/chart/publicConfig.js b/nezha-fronted/src/components/common/rightBox/chart/publicConfig.js index 3cd698c75..7a7e456ba 100644 --- a/nezha-fronted/src/components/common/rightBox/chart/publicConfig.js +++ b/nezha-fronted/src/components/common/rightBox/chart/publicConfig.js @@ -1,6 +1,7 @@ import chartDataFormat from '@/components/charts/chartDataFormat' import { getUUID, resetZIndex } from '@/components/common/js/common' import { randomcolor, ColorReverse } from '@/components/common/js/radomcolor/randomcolor' +import { isStat } from '@/components/chart/chart/tools' const rz = { methods: { rz (e) { @@ -163,6 +164,7 @@ export default { }, mixins: [rz], methods: { + isStat, expressionChange: function () { if (this.expressions.length) { this.chartConfig.elements = [] diff --git a/nezha-fronted/src/components/page/dashboard/panel.vue b/nezha-fronted/src/components/page/dashboard/panel.vue index 1928ff551..bb08ea2a8 100644 --- a/nezha-fronted/src/components/page/dashboard/panel.vue +++ b/nezha-fronted/src/components/page/dashboard/panel.vue @@ -155,7 +155,6 @@ import panelBox from '@/components/common/rightBox/panelBox' import chartTempBox from '@/components/common/rightBox/chartTempBox' import topToolMoreOptions from '@/components/common/popBox/topToolMoreOptions' import { fromRoute } from '@/components/common/js/constants' -import chartData from '@/components/chart/testData' import { randomcolor } from '@/components/common/js/radomcolor/randomcolor' export default {