From 8958ae54cb09a40bdef5de73e6ccc286b2ab32e5 Mon Sep 17 00:00:00 2001 From: pipipi-pikachu Date: Sun, 11 Apr 2021 13:26:40 +0800 Subject: [PATCH] =?UTF-8?q?perf:=20=E4=BC=98=E5=8C=96=E5=9B=BE=E8=A1=A8?= =?UTF-8?q?=E7=BC=A9=E7=95=A5=E5=9B=BE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/plugins/iconPark.ts | 22 +++++++++---- src/views/Editor/CanvasTool/ChartPool.vue | 2 +- src/views/Editor/CanvasTool/index.vue | 2 +- .../element/ChartElement/BaseChartElement.vue | 32 +++++++++++++++++-- 4 files changed, 47 insertions(+), 11 deletions(-) diff --git a/src/plugins/iconPark.ts b/src/plugins/iconPark.ts index d1f600f7..6874c434 100644 --- a/src/plugins/iconPark.ts +++ b/src/plugins/iconPark.ts @@ -54,10 +54,14 @@ import { BringToFrontOne, SentToBack, Github, - ChartLine, - ChartHistogram, ChartProportion, - PentagonOne, + ChartHistogram, + ChartHistogramOne, + ChartLine, + ChartLineArea, + ChartScatter, + ChartPie, + ChartRing, Text, Rotate, LeftTwo, @@ -71,6 +75,7 @@ import { Click, Theme, ArrowCircleLeft, + GraphicDesign, } from '@icon-park/vue-next' export default { @@ -78,8 +83,9 @@ export default { // 插入元素 app.component('IconFontSize', FontSize) app.component('IconPicture', Picture) - app.component('IconPentagonOne', PentagonOne) + app.component('IconGraphicDesign', GraphicDesign) app.component('IconConnection', Connection) + app.component('IconChartProportion', ChartProportion) app.component('IconInsertTable', InsertTable) // 锁定与解锁 @@ -151,9 +157,13 @@ export default { app.component('IconCloseSmall', CloseSmall) // 图表 - app.component('IconChartLine', ChartLine) app.component('IconChartHistogram', ChartHistogram) - app.component('IconChartProportion', ChartProportion) + app.component('IconChartHistogramOne', ChartHistogramOne) + app.component('IconChartLine', ChartLine) + app.component('IconChartLineArea', ChartLineArea) + app.component('IconChartScatter', ChartScatter) + app.component('IconChartPie', ChartPie) + app.component('IconChartRing', ChartRing) // 其他 app.component('IconPlayOne', PlayOne) diff --git a/src/views/Editor/CanvasTool/ChartPool.vue b/src/views/Editor/CanvasTool/ChartPool.vue index e1ed2523..b7dcd454 100644 --- a/src/views/Editor/CanvasTool/ChartPool.vue +++ b/src/views/Editor/CanvasTool/ChartPool.vue @@ -4,7 +4,7 @@
- +
diff --git a/src/views/Editor/CanvasTool/index.vue b/src/views/Editor/CanvasTool/index.vue index 21e4c865..cd0973eb 100644 --- a/src/views/Editor/CanvasTool/index.vue +++ b/src/views/Editor/CanvasTool/index.vue @@ -23,7 +23,7 @@ - + diff --git a/src/views/components/element/ChartElement/BaseChartElement.vue b/src/views/components/element/ChartElement/BaseChartElement.vue index c4de9ed6..b47c9063 100644 --- a/src/views/components/element/ChartElement/BaseChartElement.vue +++ b/src/views/components/element/ChartElement/BaseChartElement.vue @@ -18,9 +18,13 @@ :height="elementInfo.height" :outline="elementInfo.outline" /> - - - + + + + + + + @@ -45,8 +49,30 @@ export default defineComponent({ setup(props) { const size = computed(() => Math.min(props.elementInfo.width, props.elementInfo.height)) + const chartType = computed(() => { + const _chartType = props.elementInfo.chartType + const _options = props.elementInfo.options + + if (_chartType === 'bar') { + if (_options?.horizontalBars) return 'horizontalBar' + return 'bar' + } + else if (_chartType === 'line') { + if (_options?.showArea) return 'area' + else if (_options && _options.showLine === false) return 'scatter' + return 'line' + } + else if (_chartType === 'pie') { + if (_options?.donut) return 'ring' + return 'pie' + } + + return '' + }) + return { size, + chartType, } }, })