diff --git a/backend/src/main/java/io/dataease/controller/chart/ChartViewController.java b/backend/src/main/java/io/dataease/controller/chart/ChartViewController.java index 8ce32d17ac..5bb7d3d54c 100644 --- a/backend/src/main/java/io/dataease/controller/chart/ChartViewController.java +++ b/backend/src/main/java/io/dataease/controller/chart/ChartViewController.java @@ -3,6 +3,7 @@ package io.dataease.controller.chart; import com.github.xiaoymin.knife4j.annotations.ApiSupport; import io.dataease.base.domain.ChartViewWithBLOBs; import io.dataease.commons.utils.AuthUtils; +import io.dataease.controller.request.chart.ChartCalRequest; import io.dataease.controller.request.chart.ChartExtRequest; import io.dataease.controller.request.chart.ChartViewRequest; import io.dataease.controller.response.ChartDetail; @@ -100,4 +101,10 @@ public class ChartViewController { public List search(@RequestBody ChartViewRequest chartViewRequest) { return chartViewService.search(chartViewRequest); } + + @ApiOperation("计算结果") + @PostMapping("/calcData") + public ChartViewDTO calcData(@RequestBody ChartCalRequest request) throws Exception { + return chartViewService.calcData(request.getView(), request.getRequestList()); + } } diff --git a/backend/src/main/java/io/dataease/controller/request/chart/ChartCalRequest.java b/backend/src/main/java/io/dataease/controller/request/chart/ChartCalRequest.java new file mode 100644 index 0000000000..8dd21f144f --- /dev/null +++ b/backend/src/main/java/io/dataease/controller/request/chart/ChartCalRequest.java @@ -0,0 +1,17 @@ +package io.dataease.controller.request.chart; + +import io.dataease.base.domain.ChartViewWithBLOBs; +import io.swagger.annotations.ApiModelProperty; +import lombok.Data; + +/** + * @Author gin + * @Date 2021/11/10 11:27 上午 + */ +@Data +public class ChartCalRequest { + @ApiModelProperty("视图") + private ChartViewWithBLOBs view; + @ApiModelProperty("额外请求参数") + private ChartExtRequest requestList; +} diff --git a/backend/src/main/java/io/dataease/service/chart/ChartViewService.java b/backend/src/main/java/io/dataease/service/chart/ChartViewService.java index 177e9689ea..beee14ae42 100644 --- a/backend/src/main/java/io/dataease/service/chart/ChartViewService.java +++ b/backend/src/main/java/io/dataease/service/chart/ChartViewService.java @@ -179,6 +179,10 @@ public class ChartViewService { public ChartViewDTO getData(String id, ChartExtRequest requestList) throws Exception { ChartViewWithBLOBs view = chartViewMapper.selectByPrimaryKey(id); + return calcData(view, requestList); + } + + public ChartViewDTO calcData(ChartViewWithBLOBs view, ChartExtRequest requestList) throws Exception { if (ObjectUtils.isEmpty(view)) { throw new RuntimeException(Translator.get("i18n_chart_delete")); } @@ -424,7 +428,7 @@ public class ChartViewService { data = datasourceProvider.getData(datasourceRequest); } else { try { - data = cacheViewData(datasourceProvider, datasourceRequest, id); + data = cacheViewData(datasourceProvider, datasourceRequest, view.getId()); } catch (Exception e) { LogUtil.error(e); } finally { diff --git a/frontend/src/lang/en.js b/frontend/src/lang/en.js index d53fc4901e..e82c093d1d 100644 --- a/frontend/src/lang/en.js +++ b/frontend/src/lang/en.js @@ -969,7 +969,8 @@ export default { preview: 'Preview', next: 'Next', select_dataset: 'Select Dataset', - select_chart_type: 'Select Chart Type' + select_chart_type: 'Select Chart Type', + recover: 'Reset' }, dataset: { sheet_warn: 'There are multiple sheet pages, and the first one is extracted by default', diff --git a/frontend/src/lang/tw.js b/frontend/src/lang/tw.js index 20bce1c9c7..b2ed395331 100644 --- a/frontend/src/lang/tw.js +++ b/frontend/src/lang/tw.js @@ -970,7 +970,8 @@ export default { preview: '上一步', next: '下一步', select_dataset: '選擇數據集', - select_chart_type: '選擇圖表類型' + select_chart_type: '選擇圖表類型', + recover: '重置' }, dataset: { sheet_warn: '有多個 Sheet 頁，默認抽取第一個', diff --git a/frontend/src/lang/zh.js b/frontend/src/lang/zh.js index efdd283bda..51d2ca8630 100644 --- a/frontend/src/lang/zh.js +++ b/frontend/src/lang/zh.js @@ -973,7 +973,8 @@ export default { preview: '上一步', next: '下一步', select_dataset: '选择数据集', - select_chart_type: '选择图表类型' + select_chart_type: '选择图表类型', + recover: '重置' }, dataset: { sheet_warn: '有多个 Sheet 页，默认抽取第一个', diff --git a/frontend/src/views/chart/view/ChartEdit.vue b/frontend/src/views/chart/view/ChartEdit.vue index 96d3e7e7a1..35ec5d09af 100644 --- a/frontend/src/views/chart/view/ChartEdit.vue +++ b/frontend/src/views/chart/view/ChartEdit.vue @@ -16,10 +16,10 @@ - - - - + + {{ $t('chart.recover') }} + + {{ $t('commons.save') }} @@ -114,7 +114,7 @@ {{ $t('chart.chart_type') }} - + @@ -207,10 +207,10 @@ {{ $t('chart.result_count') }} - + {{ $t('chart.result_mode_all') }} - + @@ -226,8 +226,8 @@ :options="places" :placeholder="$t('chart.select_map_range')" :normalizer="normalizer" - @input="save" - @deselect="save" + @input="calcData" + @deselect="calcData" /> @@ -253,7 +253,7 @@ :move="onMove" class="drag-block-style" @add="addXaxis" - @update="save(true)" + @update="calcData(true)" > @@ -288,7 +288,7 @@ :move="onMove" class="drag-block-style" @add="addYaxis" - @update="save(true)" + @update="calcData(true)" > @@ -312,7 +312,7 @@ :move="onMove" class="drag-block-style" @add="addYaxisExt" - @update="save(true)" + @update="calcData(true)" > @@ -336,7 +336,7 @@ :move="onMove" class="drag-block-style" @add="addStack" - @update="save(true)" + @update="calcData(true)" > @@ -366,7 +366,7 @@ :move="onMove" class="drag-block-style" @add="addBubble" - @update="save(true)" + @update="calcData(true)" > @@ -390,7 +390,7 @@ class="theme-item-class" style="padding:2px 0 0 0;width:100%;min-height: 32px;border-radius: 4px;border: 1px solid #DCDFE6;overflow-x: auto;display: flex;align-items: center;background-color: white;" @add="addCustomFilter" - @update="save(true)" + @update="calcData(true)" > @@ -414,7 +414,7 @@ :move="onMove" class="drag-block-style" @add="addDrill" - @update="save(true)" + @update="calcData(true)" > @@ -435,7 +435,7 @@ {{ $t('chart.style_priority') }} - + {{ $t('chart.chart') }} {{ $t('chart.dashboard') }} @@ -603,7 +603,7 @@ class="dialog-css" :fullscreen="true" > - +
{{ $t('dataset.field_manage') }} @@ -800,7 +800,8 @@ export default { { name: 'AntV', value: 'antv' }, { name: 'ECharts', value: 'echarts' } ], - drill: false + drill: false, + hasEdit: false } }, computed: { @@ -874,7 +875,7 @@ export default { this.resetDatasetField() } }, - save(getData, trigger, needRefreshGroup = false, switchType = false) { + buildParam(getData, trigger, needRefreshGroup = false, switchType = false) { if (!this.view.resultCount || this.view.resultCount === '' || this.view.resultCount.length > 4 || @@ -987,10 +988,10 @@ export default { } }) if (view.type.startsWith('pie') || - view.type.startsWith('funnel') || - view.type.startsWith('text') || - view.type.startsWith('gauge') || - view.type === 'treemap' || + view.type.startsWith('funnel') || + view.type.startsWith('text') || + view.type.startsWith('gauge') || + view.type === 'treemap' || view.type === 'liquid' || view.type === 'waterfall') { if (view.yaxis.length > 1) { @@ -1004,9 +1005,9 @@ export default { view.customAttr.label.show = true } if (view.type === 'liquid' || - view.type.includes('table') || - view.type.includes('text') || - view.type.includes('gauge')) { + view.type.includes('table') || + view.type.includes('text') || + view.type.includes('gauge')) { view.drillFields = [] } view.customFilter.forEach(function(ele) { @@ -1024,6 +1025,11 @@ export default { view.drillFields = JSON.stringify(view.drillFields) view.extBubble = JSON.stringify(view.extBubble) delete view.data + return view + }, + save(getData, trigger, needRefreshGroup = false, switchType = false) { + const view = this.buildParam(getData, trigger, needRefreshGroup, switchType) + if (!view) return post('/chart/view/save', view).then(response => { // this.get(response.data.id); // this.getData(response.data.id) @@ -1043,18 +1049,75 @@ export default { this.closeChangeChart() }) }, + calcData(getData, trigger, needRefreshGroup = false, switchType = false) { + this.hasEdit = true + const view = this.buildParam(getData, trigger, needRefreshGroup, switchType) + if (!view) return + post('/chart/view/calcData', { + view: view, + requestList: { + filter: [], + drill: this.drillClickDimensionList + } + }).then(response => { + const view = JSON.parse(JSON.stringify(response.data)) + this.view.xaxis = view.xaxis ? JSON.parse(view.xaxis) : [] + this.view.yaxis = view.yaxis ? JSON.parse(view.yaxis) : [] + this.view.yaxisExt = view.yaxisExt ? JSON.parse(view.yaxisExt) : [] + this.view.extStack = view.extStack ? JSON.parse(view.extStack) : [] + this.view.drillFields = view.drillFields ? JSON.parse(view.drillFields) : [] + this.view.extBubble = view.extBubble ? JSON.parse(view.extBubble) : [] + this.view.customAttr = view.customAttr ? JSON.parse(view.customAttr) : {} + this.view.customStyle = view.customStyle ? JSON.parse(view.customStyle) : {} + this.view.customFilter = view.customFilter ? JSON.parse(view.customFilter) : {} + // 将视图传入echart组件 + this.chart = response.data + this.data = response.data.data + // console.log(JSON.stringify(this.chart)) + this.httpRequest.status = true + if (this.chart.privileges) { + this.param.privileges = this.chart.privileges + } + if (!response.data.drill) { + this.drillClickDimensionList.splice(this.drillClickDimensionList.length - 1, 1) + + this.resetDrill() + } + this.drill = response.data.drill + this.drillFilters = JSON.parse(JSON.stringify(response.data.drillFilters ? response.data.drillFilters : [])) + + this.closeChangeChart() + }) + }, + + calcStyle() { + this.hasEdit = true + // 将视图传入echart...组件 + const view = JSON.parse(JSON.stringify(this.view)) + view.customAttr = JSON.stringify(this.view.customAttr) + view.customStyle = JSON.stringify(this.view.customStyle) + this.chart = view + }, closeEdit() { if (this.view.title && this.view.title.length > 50) { this.$warning(this.$t('chart.title_limit')) return } - // 从仪表板入口关闭 - bus.$emit('PanelSwitchComponent', { name: 'PanelEdit' }) - // this.$emit('switchComponent', { name: '' }) - this.$success(this.$t('commons.save_success')) + const view = this.buildParam(true, 'chart', false, false) + if (!view) return + post('/chart/view/save', view).then(response => { + this.hasEdit = false + this.refreshGroup(view) + this.closeChangeChart() + // 从仪表板入口关闭 + bus.$emit('PanelSwitchComponent', { name: 'PanelEdit' }) + // this.$emit('switchComponent', { name: '' }) + this.$success(this.$t('commons.save_success')) + }) }, getData(id) { + this.hasEdit = false if (id) { ajaxGetData(id, { filter: [], @@ -1139,12 +1202,12 @@ export default { }, dimensionItemChange(item) { - this.save(true) + this.calcData(true) }, dimensionItemRemove(item) { this.view.xaxis.splice(item.index, 1) - this.save(true) + this.calcData(true) }, quotaItemChange(item) { @@ -1154,7 +1217,7 @@ export default { // ele.summary = item.summary // } // }) - this.save(true) + this.calcData(true) }, quotaItemRemove(item) { @@ -1163,63 +1226,63 @@ export default { } else if (item.removeType === 'quotaExt') { this.view.yaxisExt.splice(item.index, 1) } - this.save(true) + this.calcData(true) }, onColorChange(val) { this.view.customAttr.color = val - this.save() + this.calcStyle() }, onSizeChange(val) { this.view.customAttr.size = val - this.save() + this.calcStyle() }, onTextChange(val) { this.view.customStyle.text = val this.view.title = val.title - this.save(false, '', true) + this.calcStyle() }, onLegendChange(val) { this.view.customStyle.legend = val - this.save() + this.calcStyle() }, onLabelChange(val) { this.view.customAttr.label = val - this.save() + this.calcStyle() }, onTooltipChange(val) { this.view.customAttr.tooltip = val - this.save() + this.calcStyle() }, onChangeXAxisForm(val) { this.view.customStyle.xAxis = val - this.save() + this.calcStyle() }, onChangeYAxisForm(val) { this.view.customStyle.yAxis = val - this.save() + this.calcStyle() }, onChangeYAxisExtForm(val) { this.view.customStyle.yAxisExt = val - this.save() + this.calcStyle() }, onChangeBackgroundForm(val) { this.view.customStyle.background = val - this.save() + this.calcStyle() }, onChangeSplitForm(val) { this.view.customStyle.split = val - this.save() + this.calcStyle() }, showDimensionEditFilter(item) { @@ -1242,7 +1305,7 @@ export default { } } this.view.xaxis[this.dimensionItem.index].filter = this.dimensionItem.filter - this.save(true) + this.calcData(true) this.closeDimensionFilter() }, @@ -1270,13 +1333,13 @@ export default { } else if (this.quotaItem.filterType === 'quotaExt') { this.view.yaxisExt[this.quotaItem.index].filter = this.quotaItem.filter } - this.save(true) + this.calcData(true) this.closeQuotaFilter() }, filterItemRemove(item) { this.view.customFilter.splice(item.index, 1) - this.save(true) + this.calcData(true) }, showEditFilter(item) { this.filterItem = JSON.parse(JSON.stringify(item)) @@ -1299,7 +1362,7 @@ export default { } } this.view.customFilter[this.filterItem.index].filter = this.filterItem.filter - this.save(true) + this.calcData(true) this.closeResultFilter() }, @@ -1317,7 +1380,7 @@ export default { } else if (this.itemForm.renameType === 'quotaExt') { this.view.yaxisExt[this.itemForm.index].name = this.itemForm.name } - this.save(true) + this.calcData(true) this.closeRename() } else { return false @@ -1371,6 +1434,7 @@ export default { this.selectTableFlag = false }, + // 更换数据集 changeChart() { if (this.view.tableId !== this.changeTable.id) { this.view.tableId = this.changeTable.id @@ -1381,7 +1445,9 @@ export default { this.view.extBubble = [] this.view.drillFields = [] } - this.save(true, 'chart', false) + // this.save(true, 'chart', false) + this.calcData(true, 'chart', false) + this.initTableData(this.view.tableId) }, fieldFilter(val) { @@ -1430,7 +1496,7 @@ export default { this.dragCheckType(this.view.xaxis, 'd') } this.dragMoveDuplicate(this.view.xaxis, e) - this.save(true) + this.calcData(true) }, addYaxis(e) { if ((this.view.type === 'map' || this.view.type === 'waterfall') && this.view.yaxis.length > 1) { @@ -1438,7 +1504,7 @@ export default { } this.dragCheckType(this.view.yaxis, 'q') this.dragMoveDuplicate(this.view.yaxis, e) - this.save(true) + this.calcData(true) }, addYaxisExt(e) { if (this.view.type === 'map' && this.view.yaxisExt.length > 1) { @@ -1446,17 +1512,17 @@ export default { } this.dragCheckType(this.view.yaxisExt, 'q') this.dragMoveDuplicate(this.view.yaxisExt, e) - this.save(true) + this.calcData(true) }, moveToDimension(e) { this.dragCheckType(this.dimensionData, 'd') this.dragMoveDuplicate(this.dimensionData, e) - this.save(true) + this.calcData(true) }, moveToQuota(e) { this.dragCheckType(this.quotaData, 'q') this.dragMoveDuplicate(this.quotaData, e) - this.save(true) + this.calcData(true) }, addCustomFilter(e) { // 记录数等自动生成字段不做为过滤条件 @@ -1468,7 +1534,7 @@ export default { } } this.dragMoveDuplicate(this.view.customFilter, e) - this.save(true) + this.calcData(true) }, initAreas() { @@ -1502,26 +1568,26 @@ export default { if (this.view.extStack && this.view.extStack.length > 1) { this.view.extStack = [this.view.extStack[0]] } - this.save(true) + this.calcData(true) }, stackItemChange(item) { - this.save(true) + this.calcData(true) }, stackItemRemove(item) { this.view.extStack.splice(item.index, 1) - this.save(true) + this.calcData(true) }, drillItemChange(item) { - this.save(true) + this.calcData(true) }, drillItemRemove(item) { this.view.drillFields.splice(item.index, 1) - this.save(true) + this.calcData(true) }, addDrill(e) { this.dragCheckType(this.view.drillFields, 'd') this.dragMoveDuplicate(this.view.drillFields, e) - this.save(true) + this.calcData(true) }, addBubble(e) { @@ -1529,14 +1595,14 @@ export default { if (this.view.extBubble && this.view.extBubble.length > 1) { this.view.extBubble = [this.view.extBubble[0]] } - this.save(true) + this.calcData(true) }, bubbleItemChange(item) { - this.save(true) + this.calcData(true) }, bubbleItemRemove(item) { this.view.extBubble.splice(item.index, 1) - this.save(true) + this.calcData(true) }, chartClick(param) { @@ -1545,11 +1611,13 @@ export default { if (this.chart.type === 'map') { if (this.sendToChildren(param)) { this.drillClickDimensionList.push({ dimensionList: param.data.dimensionList }) - this.getData(this.param.id) + // this.getData(this.param.id) + this.calcData(true, 'chart', false, false) } } else { this.drillClickDimensionList.push({ dimensionList: param.data.dimensionList }) - this.getData(this.param.id) + // this.getData(this.param.id) + this.calcData(true, 'chart', false, false) } } else if (this.view.drillFields.length > 0) { this.$message({ @@ -1576,7 +1644,8 @@ export default { this.backToParent(index, length) } - this.getData(this.param.id) + // this.getData(this.param.id) + this.calcData(true, 'chart', false, false) }, // 回到父级地图 backToParent(index, length) { @@ -1639,8 +1708,11 @@ export default { renderComponent() { return this.chart.render - } + }, + reset() { + this.getData(this.param.id) + } } }