diff --git a/nezha-fronted/src/components/charts/chart-list.vue b/nezha-fronted/src/components/charts/chart-list.vue index 98e4bfe68..979ac0a4e 100644 --- a/nezha-fronted/src/components/charts/chart-list.vue +++ b/nezha-fronted/src/components/charts/chart-list.vue @@ -375,6 +375,7 @@ export default { editData(chartId) { // 获取该id下chart的相关信息 const chart = this.dataList.find(item => item.id === chartId); + console.info("aaa",chart) if (chart) { this.$emit('on-edit-chart', chart); } diff --git a/nezha-fronted/src/components/charts/chart-table.vue b/nezha-fronted/src/components/charts/chart-table.vue index d147a1870..3bbad4fb7 100644 --- a/nezha-fronted/src/components/charts/chart-table.vue +++ b/nezha-fronted/src/components/charts/chart-table.vue @@ -35,11 +35,11 @@
- - - - - + + + + +
@@ -52,11 +52,11 @@ - - - - - + + + + + diff --git a/nezha-fronted/src/components/common/language/cn.js b/nezha-fronted/src/components/common/language/cn.js index 227b3770d..d55761d52 100644 --- a/nezha-fronted/src/components/common/language/cn.js +++ b/nezha-fronted/src/components/common/language/cn.js @@ -110,6 +110,7 @@ const cn = { multiChartsShow:"多图展示", createPanel:"创建面板", selectPanel:"选择已有面板", + saveChart:'保存图表', saveChartToPanel:"保存图表到看板" }, metricPreview:{ diff --git a/nezha-fronted/src/components/common/language/en.js b/nezha-fronted/src/components/common/language/en.js index 2608f534a..c74231e07 100644 --- a/nezha-fronted/src/components/common/language/en.js +++ b/nezha-fronted/src/components/common/language/en.js @@ -116,6 +116,7 @@ const en = { multiChartsShow:'Multiple charts',//"多图展示" createPanel:'New panel', //"创建面板" selectPanel:'Exist panel',//"选择已有面板" + saveChart: 'Save chart', saveChartToPanel:"Save chart to panel"//Save chart to panel. }, metricPreview:{ diff --git a/nezha-fronted/src/components/common/rightBox/panelBox.vue b/nezha-fronted/src/components/common/rightBox/panelBox.vue index 4707bbcee..e23fa86a6 100644 --- a/nezha-fronted/src/components/common/rightBox/panelBox.vue +++ b/nezha-fronted/src/components/common/rightBox/panelBox.vue @@ -17,7 +17,7 @@ - + @@ -125,6 +125,6 @@ diff --git a/nezha-fronted/src/components/page/asset/assetAddUnit.vue b/nezha-fronted/src/components/page/asset/assetAddUnit.vue index e2f9e93b7..48233e4f4 100644 --- a/nezha-fronted/src/components/page/asset/assetAddUnit.vue +++ b/nezha-fronted/src/components/page/asset/assetAddUnit.vue @@ -886,7 +886,6 @@ type: 'warning' }).then(() => { this.$delete(data + "?ids=" + item).then(response => { - const h = this.$createElement; if (response.code === 200) { this.$message({duration: 2000, type: 'success', message: this.$t("tip.deleteSuccess")}); this.$emit('refreshData', 'true') diff --git a/nezha-fronted/src/components/page/dashboard/chartBox.vue b/nezha-fronted/src/components/page/dashboard/chartBox.vue index d708b4ab5..0240f1201 100644 --- a/nezha-fronted/src/components/page/dashboard/chartBox.vue +++ b/nezha-fronted/src/components/page/dashboard/chartBox.vue @@ -81,9 +81,9 @@ :value="item.id" :id="'chart-box-panel-'+item.id"> {{item.name}}
- -
@@ -238,6 +238,7 @@ //productId: 0,//不需要这个参数，可以删除 panelId: 0, panelName: '', + selectFirstPanel: false, metricList: [], // metric列表 metricCascaderList:[],//metric级联列表 deleteIndex: '', // 要删除的指标模块 @@ -264,9 +265,37 @@ this.$refs.panelBox2.setTitle(this.$t("dashboard.panel.createPanelTitle")); }, panelReload(panelName) { - this.panelName = panelName; + if (panelName) { + this.panelName = panelName; + } this.$emit("reloadOnlyPanel"); }, + deletePanel(panel) { + this.$confirm(this.$t("tip.confirmDelete"), { + confirmButtonText: this.$t("tip.yes"), + cancelButtonText: this.$t("tip.no"), + type: 'warning' + }).then(() => { + this.$delete("panel?ids=" + panel.id).then(response => { + if (response.code === 200) { + this.$message({duration: 2000, type: 'success', message: this.$t("tip.deleteSuccess")}); + if (this.panelId == panel.id) { + this.selectFirstPanel = true; + this.$emit('reload', true); + } else { + this.$emit('reload'); + } + } else { + this.$message.error(response.msg); + } + }) + }); + }, + editPanel(panel) { + this.$refs.panelBox2.show(true); + this.panel = Object.assign({}, panel); + this.$refs.panelBox2.setTitle(this.$t("dashboard.panel.editPanelTitle")); + }, setTitle(title) { this.rightBox.title = title; }, @@ -405,7 +434,9 @@ this.esc(); this.$message({duration: 1000, type: 'success', message: this.$t("tip.saveSuccess")}); this.$refs.chartForm.resetFields();//清空表单 - this.$emit('on-create-success', 'create', response.data,params); + let panel = this.panelData.find(p => p.id === this.panelId); + console.info("panel", panel) + this.$emit('on-create-success', 'create', response.data,params, panel); } else { this.$message.error(response.msg); } @@ -523,8 +554,17 @@ }) }, // 创建打开 - createData(panelId) { - this.panelId = panelId; + createData(panelId, elementInfo) { + if (panelId == -1) { + this.panelId = this.panelData[0].id; + } else { + this.panelId = panelId; + } + if (elementInfo) { + this.$nextTick(() => { + this.$refs.chartTag[0].setMdata(elementInfo.elements[0]); + }); + } this.isedit = false; this.initInfo(); // 初始化图表信息 //this.chartModal = true;//????控制弹出框显示和隐藏的，不需要了 @@ -571,7 +611,7 @@ }, // 创建时打开,用于清空chart-tag数据 initOpen() { - bus.$emit('clear_history'); + //bus.$emit('clear_history'); /* 项目不需要produce if (this.$route.params.productId) { this.productId = parseInt(this.$route.params.productId, 10); @@ -591,7 +631,10 @@ deep: true, immediate: true, handler(n, o) { - if (this.panelName) { + if (this.selectFirstPanel) { + this.selectFirstPanel = false; + this.panelId = n[0].id; + } else if (this.panelName) { for (let i = 0; i < n.length; i++) { if (n[i].name == this.panelName) { this.panelId = n[i].id; diff --git a/nezha-fronted/src/components/page/dashboard/chartMetric.vue b/nezha-fronted/src/components/page/dashboard/chartMetric.vue index 119751437..009ff5504 100644 --- a/nezha-fronted/src/components/page/dashboard/chartMetric.vue +++ b/nezha-fronted/src/components/page/dashboard/chartMetric.vue @@ -347,7 +347,7 @@ export default { // 编辑已有图表状态时，先填充数据 setMdata(data) { - //alert('metricSetData'+JSON.stringify(data)); + //console.info('metricSetData', JSON.stringify(data)); this.setDataFlag = true; this.target = Object.assign({}, data); //this.pointer = diff --git a/nezha-fronted/src/components/page/dashboard/chartMetricForPreview.vue b/nezha-fronted/src/components/page/dashboard/chartMetricForPreview.vue index 192e72cd7..bfb036271 100644 --- a/nezha-fronted/src/components/page/dashboard/chartMetricForPreview.vue +++ b/nezha-fronted/src/components/page/dashboard/chartMetricForPreview.vue @@ -356,7 +356,7 @@ export default { // alert('metric第三步，normal'); // 当该项metric为空时，重置一下 if (!this.elementInfo.metric && this.$refs.metricSelect) { - this.$refs.metricSelect.reset(); + //this.$refs.metricSelect.reset(); } this.clickTabelShow(1,'normal'); } @@ -529,7 +529,7 @@ export default { this.$refs.elementInfo.resetFields();//??? } if (this.$refs.metricSelect) { - this.$refs.metricSelect.reset(); + //this.$refs.metricSelect.reset(); } this.elementInfo.tagList = []; }, diff --git a/nezha-fronted/src/components/page/dashboard/metricPreview.scss b/nezha-fronted/src/components/page/dashboard/metricPreview.scss index 9c791c76a..d5574c50b 100644 --- a/nezha-fronted/src/components/page/dashboard/metricPreview.scss +++ b/nezha-fronted/src/components/page/dashboard/metricPreview.scss @@ -8,7 +8,7 @@ height: 100%; } .table-list { - margin-top:40px; + padding-top: 20px; overflow-y:auto; height: 100%; } @@ -21,6 +21,12 @@ .chartBoxMul { width: 100%; } + .chart-preview-area { + height: calc(100% - 180px); + overflow-y: auto; + overflow-x: hidden; + position: relative + } .common-detail-top-title { font-size: 16px; color: #5697f1; diff --git a/nezha-fronted/src/components/page/dashboard/metricPreview.vue b/nezha-fronted/src/components/page/dashboard/metricPreview.vue index 4ae6db5ce..3261c74e9 100644 --- a/nezha-fronted/src/components/page/dashboard/metricPreview.vue +++ b/nezha-fronted/src/components/page/dashboard/metricPreview.vue @@ -13,9 +13,7 @@
-
- +
- +
 
 - - + + + +
{ + if (response.code === 200) { + this.panelData = response.data.list; + } + }); + }, // 获取图表信息 getChartParam(params, chartCount) { this.chartCount = chartCount; @@ -409,6 +427,7 @@ refresh_scroll() { }, mounted: function() { this.getInit(); + this.getPanelData(); }, watch: { diff --git a/nezha-fronted/src/components/page/dashboard/metricSet.scss b/nezha-fronted/src/components/page/dashboard/metricSet.scss index f46307eb2..5a775c989 100644 --- a/nezha-fronted/src/components/page/dashboard/metricSet.scss +++ b/nezha-fronted/src/components/page/dashboard/metricSet.scss @@ -22,7 +22,7 @@ } .operate-area { // border-top: 1px solid #dfe7f2; - border-bottom: 1px solid #dfe7f2; + // border-bottom: 1px solid #dfe7f2; padding-bottom: 20px; text-align: right; .operate-area-title { diff --git a/nezha-fronted/src/components/page/dashboard/metricSet.vue b/nezha-fronted/src/components/page/dashboard/metricSet.vue index 4c76842cc..e89a364c4 100644 --- a/nezha-fronted/src/components/page/dashboard/metricSet.vue +++ b/nezha-fronted/src/components/page/dashboard/metricSet.vue @@ -45,22 +45,22 @@ - + >{{chartSwitchWord}}--> - + >{{$t('dashboard.metric.createPanel')}}--> - + >{{$t('dashboard.metric.saveChart')}} - + @@ -94,7 +93,6 @@ :rules="{ required: true, type: 'number', trigger: 'change' }"> px -
@@ -114,25 +112,28 @@
- + -->
- - + +