From 5e07c2ca6d9d5b321202c0ec4846e460d75f633e Mon Sep 17 00:00:00 2001 From: MTrun <1262327911@qq.com> Date: Thu, 27 Jan 2022 23:16:51 +0800 Subject: [PATCH] =?UTF-8?q?fix:=20=E6=96=B0=E5=A2=9E=E5=9B=BE=E8=A1=A8?= =?UTF-8?q?=E5=B1=85=E4=B8=AD=E6=8B=96=E6=8B=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Charts/Bars/BarCommon/config.ts | 19 +++++++++----- .../components/Charts/Bars/BarCommon/index.ts | 4 ++- src/packages/index.d.ts | 10 +++++-- .../modules/chartEditStore/chartEditStore.ts | 26 ++++++++++++------- src/utils/plugin.ts | 20 ++++++++++++++ .../components/EditRange/index.vue | 12 ++++++--- .../ContentEdit/hooks/useContextMenu.hook.ts | 3 +++ .../chart/ContentEdit/hooks/useDrop.hook.ts | 22 ++++++++-------- .../chart/ContentEdit/hooks/useStyle.hook.ts | 1 + 9 files changed, 83 insertions(+), 34 deletions(-) diff --git a/src/packages/components/Charts/Bars/BarCommon/config.ts b/src/packages/components/Charts/Bars/BarCommon/config.ts index 72be61bf..4c6cd93e 100644 --- a/src/packages/components/Charts/Bars/BarCommon/config.ts +++ b/src/packages/components/Charts/Bars/BarCommon/config.ts @@ -1,10 +1,15 @@ import { getUUID } from '@/utils' import { BarCommonConfig } from './index' +export const chartSize = { + w: 500, + h: 300 +} + export default class Config { private id: string = getUUID() private key: string = BarCommonConfig.key - public attr = { x: 0, y: 0, w: 500, h: 300 } + public attr = { x: 0, y: 0, ...chartSize } // 图表配置项 public config = { @@ -17,21 +22,21 @@ export default class Config { }, xAxis: { type: 'category', - data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'], + data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'] }, yAxis: { - type: 'value', + type: 'value' }, series: [ { data: [120, 200, 150, 80, 70, 110, 130], - type: 'bar', - }, - ], + type: 'bar' + } + ] } // 设置坐标 - public setPosition(x: number, y: number):void { + public setPosition(x: number, y: number): void { this.attr.x = x this.attr.y = y } diff --git a/src/packages/components/Charts/Bars/BarCommon/index.ts b/src/packages/components/Charts/Bars/BarCommon/index.ts index a066c4d9..bbfc197c 100644 --- a/src/packages/components/Charts/Bars/BarCommon/index.ts +++ b/src/packages/components/Charts/Bars/BarCommon/index.ts @@ -2,6 +2,7 @@ import BarCommon from './index.vue' import image from '@/assets/images/chart/charts/bar_x.png' import { ConfigType, PackagesCategoryEnum } from '@/packages/index.d' import { ChatCategoryEnum, ChatCategoryEnumName } from '../../index.d' +import { chartSize } from './config' export const BarCommonConfig: ConfigType = { key: 'VBarCommon', @@ -10,5 +11,6 @@ export const BarCommonConfig: ConfigType = { categoryName: ChatCategoryEnumName.BAR, package: PackagesCategoryEnum.CHARTS, node: BarCommon, - image: image + image: image, + chartData: { chartSize } } diff --git a/src/packages/index.d.ts b/src/packages/index.d.ts index ce400c34..f3ef7542 100644 --- a/src/packages/index.d.ts +++ b/src/packages/index.d.ts @@ -7,6 +7,12 @@ export type ConfigType = { category: string categoryName: string package: string + chartData: { + chartSize: { + w: number + h: number + } + } node: Component image: string | (() => Promise) [T: string]: unknown @@ -16,14 +22,14 @@ export enum PackagesCategoryEnum { CHARTS = 'Charts', TABLES = 'Tables', INFORMATION = 'Informations', - DECORATES = 'Decorates', + DECORATES = 'Decorates' } export enum PackagesCategoryName { CHARTS = '图表', TABLES = '表格', INFORMATION = '信息', - DECORATES = '小组件', + DECORATES = '小组件' } export type PackagesType = { diff --git a/src/store/modules/chartEditStore/chartEditStore.ts b/src/store/modules/chartEditStore/chartEditStore.ts index 20203615..9b7e1459 100644 --- a/src/store/modules/chartEditStore/chartEditStore.ts +++ b/src/store/modules/chartEditStore/chartEditStore.ts @@ -1,5 +1,6 @@ import { defineStore } from 'pinia' import debounce from 'lodash/debounce' +import { loadingStart, loadingFinish, loadingError } from '@/utils' import { chartEditStoreType, EditCanvasType, @@ -53,16 +54,23 @@ export const useChartEditStoreStore = defineStore({ }, // * 删除组件列表 removeComponentList(chartData: T | number): void { - if(typeof chartData === 'number') { - this.componentList.splice(chartData, 1) - return + loadingStart() + try { + if(typeof chartData === 'number') { + this.componentList.splice(chartData, 1) + loadingFinish() + return + } + const i = this.componentList.findIndex(e => e.key === chartData.key) + if (i !== -1) { + this.componentList.splice(i, 1) + loadingFinish() + return + } + window['$message'].success(`图表删除失败，无法找到此元素`) + } catch(value) { + loadingError() } - const i = this.componentList.findIndex(e => e.key === chartData.key) - if (i !== -1) { - this.componentList.splice(i, 1) - return - } - window['$message'].success(`图表删除失败，无法找到此元素`) }, // * 设置数据项 setEditCanvasItem< diff --git a/src/utils/plugin.ts b/src/utils/plugin.ts index 411a8a21..561c7653 100644 --- a/src/utils/plugin.ts +++ b/src/utils/plugin.ts @@ -1,3 +1,4 @@ +import { nextTick } from 'vue' import { icon } from '@/plugins' import { DialogEnum } from '@/enums/pluginEnum' import { dialogIconSize } from '@/settings/designSetting' @@ -6,6 +7,25 @@ import { DialogReactive } from 'naive-ui' const { InformationCircleIcon } = icon.ionicons5 import { renderIcon } from '@/utils' +// * 开启加载 +export const loadingStart = () => { + window['$loading'].start() +} + +// * 加载结束 +export const loadingFinish = () => { + setTimeout(() => { + window['$loading'].finish() + }) +} + +// * 加载错误 +export const loadingError = () => { + setTimeout(() => { + window['$loading'].error() + }) +} + /** * * render 对话框 * @param { Object} params 配置参数 diff --git a/src/views/chart/ContentEdit/components/EditRange/index.vue b/src/views/chart/ContentEdit/components/EditRange/index.vue index e42d0aad..52275eb1 100644 --- a/src/views/chart/ContentEdit/components/EditRange/index.vue +++ b/src/views/chart/ContentEdit/components/EditRange/index.vue @@ -1,16 +1,20 @@ - +