From f03eaffa9e35982a134b3dc56e0c793bae244208 Mon Sep 17 00:00:00 2001 From: junjun Date: Wed, 14 Sep 2022 13:59:56 +0800 Subject: [PATCH] =?UTF-8?q?feat(=E8=A7=86=E5=9B=BE):=20=E8=BE=85=E5=8A=A9?= =?UTF-8?q?=E7=BA=BF=E6=94=AF=E6=8C=81=E5=8A=A8=E6=80=81=E5=80=BC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/views/chart/chart/common/common.js | 7 +- .../views/chart/chart/common/common_antv.js | 7 +- .../chart/components/senior/AssistLine.vue | 64 +++++++++++----- .../senior/dialog/AssistLineEdit.vue | 75 +++++++++++++++++-- frontend/src/views/chart/view/ChartEdit.vue | 7 +- 5 files changed, 133 insertions(+), 27 deletions(-) diff --git a/frontend/src/views/chart/chart/common/common.js b/frontend/src/views/chart/chart/common/common.js index f8b97be386..ccb98c70d6 100644 --- a/frontend/src/views/chart/chart/common/common.js +++ b/frontend/src/views/chart/chart/common/common.js @@ -231,7 +231,12 @@ export function seniorCfg(chart_option, chart) { if (customStyle.yAxis) { yAxis = JSON.parse(JSON.stringify(customStyle.yAxis)) } - senior.assistLine.forEach(ele => { + + const fixedLines = senior.assistLine.filter(ele => ele.field === '0') + const dynamicLines = chart.data.dynamicAssistLines + const lines = fixedLines.concat(dynamicLines) + + lines.forEach(ele => { if (chart.type.includes('horizontal')) { chart_option.series[0].markLine.data.push({ symbol: 'none', diff --git a/frontend/src/views/chart/chart/common/common_antv.js b/frontend/src/views/chart/chart/common/common_antv.js index c2945b25af..9c736d0d8e 100644 --- a/frontend/src/views/chart/chart/common/common_antv.js +++ b/frontend/src/views/chart/chart/common/common_antv.js @@ -658,7 +658,12 @@ export function getAnalyse(chart) { const a = JSON.parse(JSON.stringify(customStyle.yAxis)) yAxisPosition = transAxisPosition(chart, a) } - senior.assistLine.forEach(ele => { + + const fixedLines = senior.assistLine.filter(ele => ele.field === '0') + const dynamicLines = chart.data.dynamicAssistLines + const lines = fixedLines.concat(dynamicLines) + + lines.forEach(ele => { const content = ele.name + ' : ' + parseFloat(ele.value) assistLine.push({ type: 'line', diff --git a/frontend/src/views/chart/components/senior/AssistLine.vue b/frontend/src/views/chart/components/senior/AssistLine.vue index da7b7fdcfd..e21665a93f 100644 --- a/frontend/src/views/chart/components/senior/AssistLine.vue +++ b/frontend/src/views/chart/components/senior/AssistLine.vue @@ -16,10 +16,14 @@ {{ $t('chart.field_fixed') }} + {{ $t('chart.field_dynamic') }} - + {{ item.value }} + + {{ item.curField.name + '(' + $t('chart.' + item.summary) + ')' }} + @@ -34,7 +38,7 @@ width="70%" class="dialog-css" > - +
{{ $t('chart.cancel') }} {{ $t('chart.confirm') }} @@ -52,13 +56,18 @@ export default { chart: { type: Object, required: true + }, + quotaData: { + type: Array, + required: true } }, data() { return { assistLine: [], editLineDialog: false, - lineArr: [] + lineArr: [], + quotaFields: [] } }, watch: { @@ -114,21 +123,40 @@ export default { }) return } - if (!ele.value) { - this.$message({ - message: this.$t('chart.value_can_not_empty'), - type: 'error', - showClose: true - }) - return - } - if (parseFloat(ele.value).toString() === 'NaN') { - this.$message({ - message: this.$t('chart.value_error'), - type: 'error', - showClose: true - }) - return + if (ele.field === '0') { + if (!ele.value) { + this.$message({ + message: this.$t('chart.value_can_not_empty'), + type: 'error', + showClose: true + }) + return + } + if (parseFloat(ele.value).toString() === 'NaN') { + this.$message({ + message: this.$t('chart.value_error'), + type: 'error', + showClose: true + }) + return + } + } else { + if (!ele.fieldId || ele.fieldId === '') { + this.$message({ + message: this.$t('chart.field_not_empty'), + type: 'error', + showClose: true + }) + return + } + if (!ele.summary || ele.summary === '') { + this.$message({ + message: this.$t('chart.summary_not_empty'), + type: 'error', + showClose: true + }) + return + } } } this.assistLine = JSON.parse(JSON.stringify(this.lineArr)) diff --git a/frontend/src/views/chart/components/senior/dialog/AssistLineEdit.vue b/frontend/src/views/chart/components/senior/dialog/AssistLineEdit.vue index 489cd0ae27..1fec0fc210 100644 --- a/frontend/src/views/chart/components/senior/dialog/AssistLineEdit.vue +++ b/frontend/src/views/chart/components/senior/dialog/AssistLineEdit.vue @@ -3,7 +3,7 @@
- + @@ -16,9 +16,37 @@ /> - + + + + + + + + + + + {{ quota.name }} + + + + + + + + + + + + + !ele.chartId && ele.id !== 'count') + }, init() { this.lineArr = JSON.parse(JSON.stringify(this.line)) }, @@ -91,6 +137,23 @@ export default { changeAssistLine() { this.$emit('onAssistLineChange', this.lineArr) + }, + changeAssistLineField(item) { + item.curField = this.getQuotaField(item.fieldId) + this.changeAssistLine() + }, + getQuotaField(id) { + if (!id) { + return {} + } + const fields = this.quotaData.filter(ele => { + return ele.id === id + }) + if (fields.length === 0) { + return {} + } else { + return fields[0] + } } } } @@ -119,7 +182,7 @@ span { .value-item { position: relative; display: inline-block; - width: 120px !important; + width: 100px !important; } .select-item { diff --git a/frontend/src/views/chart/view/ChartEdit.vue b/frontend/src/views/chart/view/ChartEdit.vue index f4450cf46a..d0e4dae9ab 100644 --- a/frontend/src/views/chart/view/ChartEdit.vue +++ b/frontend/src/views/chart/view/ChartEdit.vue @@ -803,6 +803,7 @@ :param="param" class="attr-selector" :chart="chart" + :quota-data="quotaData" @onAssistLineChange="onAssistLineChange" /> @@ -2029,7 +2030,7 @@ export default { onAssistLineChange(val) { this.view.senior.assistLine = val - this.calcStyle() + this.calcData() }, onThresholdChange(val) { @@ -2294,6 +2295,8 @@ export default { closeEditDsField() { this.editDsField = false this.initTableField(this.table.id) + // 因动态计算较多，更新字段后重新计算视图数据 + this.calcData() }, editChartField() { @@ -2751,6 +2754,8 @@ export default { this.editChartCalcField = false this.currEditField = {} this.initTableField(this.table.id) + // 因动态计算较多，更新字段后重新计算视图数据 + this.calcData() }, deleteChartCalcField(item) { this.$confirm(this.$t('dataset.confirm_delete'), this.$t('chart.tips'), {