Commit 971dc7633d479aad4a4712c13f647570c1eb7ebc
1 parent
20cb11fd
perf: extract const in visual board
Showing
5 changed files
with
51 additions
and
44 deletions
1 | 1 | import { EChartsOption } from 'echarts'; |
2 | -import { FrontComponent } from '../../const/const'; | |
2 | +import { FrontComponent, Gradient, GradientColor } from '../../const/const'; | |
3 | 3 | import { fontSize, RadioRecord } from '../../detail/config/util'; |
4 | -import { Gradient, visualOptionField } from '../../detail/config/visualOptions'; | |
5 | 4 | import { |
6 | 5 | ComponentInfo, |
7 | 6 | DataComponentRecord, |
... | ... | @@ -11,14 +10,6 @@ import { |
11 | 10 | import { isArray } from '/@/utils/is'; |
12 | 11 | import { buildUUID } from '/@/utils/uuid'; |
13 | 12 | |
14 | -export type GradientKey = | |
15 | - | visualOptionField.FIRST_PHASE_COLOR | |
16 | - | visualOptionField.FIRST_PHASE_VALUE | |
17 | - | visualOptionField.SECOND_PHASE_COLOR | |
18 | - | visualOptionField.SECOND_PHASE_VALUE | |
19 | - | visualOptionField.THIRD_PHASE_COLOR | |
20 | - | visualOptionField.THIRD_PHASE_VALUE; | |
21 | - | |
22 | 13 | export interface GradientInfoRecord { |
23 | 14 | key: Gradient; |
24 | 15 | value: number; |
... | ... | @@ -40,12 +31,6 @@ export interface DashboardComponentLayout { |
40 | 31 | componentType: FrontComponent; |
41 | 32 | } |
42 | 33 | |
43 | -export enum GradientColor { | |
44 | - FIRST = '#67e0e3', | |
45 | - SECOND = '#37a2da', | |
46 | - THIRD = '#fd666d', | |
47 | -} | |
48 | - | |
49 | 34 | export const instrumentComponent1 = (params?: Partial<ComponentInfo>): EChartsOption => { |
50 | 35 | const { value = 10, unit = '°C' } = params || {}; |
51 | 36 | return { | ... | ... |
... | ... | @@ -29,3 +29,27 @@ export enum FrontComponent { |
29 | 29 | CONTROL_COMPONENT_SLIDING_SWITCH = 'control-component-sliding-switch', |
30 | 30 | MAP_COMPONENT_TRACK = 'map-component-track', |
31 | 31 | } |
32 | + | |
33 | +export enum Gradient { | |
34 | + FIRST = 'first', | |
35 | + SECOND = 'second', | |
36 | + THIRD = 'third', | |
37 | +} | |
38 | +export enum GradientColor { | |
39 | + FIRST = '#67e0e3', | |
40 | + SECOND = '#37a2da', | |
41 | + THIRD = '#fd666d', | |
42 | +} | |
43 | + | |
44 | +export enum visualOptionField { | |
45 | + FONT_COLOR = 'fontColor', | |
46 | + UNIT = 'unit', | |
47 | + ICON_COLOR = 'iconColor', | |
48 | + ICON = 'icon', | |
49 | + FIRST_PHASE_COLOR = 'firstPhaseColor', | |
50 | + SECOND_PHASE_COLOR = 'secondPhaseColor', | |
51 | + THIRD_PHASE_COLOR = 'thirdPhaseColor', | |
52 | + FIRST_PHASE_VALUE = 'firstPhaseValue', | |
53 | + SECOND_PHASE_VALUE = 'secondPhaseValue', | |
54 | + THIRD_PHASE_VALUE = 'thirdPhaseValue', | |
55 | +} | ... | ... |
1 | 1 | <script lang="ts" setup> |
2 | 2 | import { ref, unref } from 'vue'; |
3 | - import { | |
4 | - schemasMap, | |
5 | - VisualOptionParams, | |
6 | - visualOptionField, | |
7 | - Gradient, | |
8 | - } from '../config/visualOptions'; | |
3 | + import { schemasMap, VisualOptionParams } from '../config/visualOptions'; | |
9 | 4 | import { useForm, BasicForm } from '/@/components/Form'; |
10 | 5 | import { BasicModal, useModalInner } from '/@/components/Modal'; |
11 | 6 | import { ComponentInfo } from '/@/api/dataBoard/model'; |
12 | 7 | import { computed } from '@vue/reactivity'; |
13 | - import { FrontComponent } from '../../components/help'; | |
8 | + import { FrontComponent, Gradient, visualOptionField } from '../../const/const'; | |
14 | 9 | |
15 | 10 | const emit = defineEmits(['close', 'register']); |
16 | 11 | ... | ... |
1 | +import { FrontComponent, GradientColor } from '../../const/const'; | |
1 | 2 | import { FormSchema } from '/@/components/Form'; |
2 | 3 | |
3 | 4 | export interface VisualOptionParams { |
... | ... | @@ -13,17 +14,6 @@ export interface VisualOptionParams { |
13 | 14 | [visualOptionField.THIRD_PHASE_VALUE]: string; |
14 | 15 | } |
15 | 16 | |
16 | -export enum Gradient { | |
17 | - FIRST = 'first', | |
18 | - SECOND = 'second', | |
19 | - THIRD = 'third', | |
20 | -} | |
21 | -export enum GradientColor { | |
22 | - FIRST = '#67e0e3', | |
23 | - SECOND = '#37a2da', | |
24 | - THIRD = '#fd666d', | |
25 | -} | |
26 | - | |
27 | 17 | export enum visualOptionField { |
28 | 18 | FONT_COLOR = 'fontColor', |
29 | 19 | UNIT = 'unit', |
... | ... | @@ -188,13 +178,13 @@ export const modeFour: FormSchema[] = [ |
188 | 178 | }, |
189 | 179 | ]; |
190 | 180 | |
191 | -export const schemasMap = new Map<string, FormSchema[]>(); | |
181 | +export const schemasMap = new Map<FrontComponent, FormSchema[]>(); | |
192 | 182 | |
193 | -schemasMap.set('text-component-1', modeOne); | |
194 | -schemasMap.set('text-component-2', modeOne); | |
195 | -schemasMap.set('text-component-3', modeOne); | |
196 | -schemasMap.set('text-component-4', modeTwo); | |
197 | -schemasMap.set('text-component-5', modeTwo); | |
198 | -schemasMap.set('instrument-component-1', modeOne); | |
199 | -schemasMap.set('instrument-component-2', modeThree); | |
200 | -schemasMap.set('digital-dashboard-component', modeFour); | |
183 | +schemasMap.set(FrontComponent.TEXT_COMPONENT_1, modeOne); | |
184 | +schemasMap.set(FrontComponent.TEXT_COMPONENT_2, modeOne); | |
185 | +schemasMap.set(FrontComponent.TEXT_COMPONENT_3, modeOne); | |
186 | +schemasMap.set(FrontComponent.TEXT_COMPONENT_4, modeTwo); | |
187 | +schemasMap.set(FrontComponent.TEXT_COMPONENT_5, modeTwo); | |
188 | +schemasMap.set(FrontComponent.INSTRUMENT_COMPONENT_1, modeOne); | |
189 | +schemasMap.set(FrontComponent.INSTRUMENT_COMPONENT_2, modeThree); | |
190 | +schemasMap.set(FrontComponent.DIGITAL_DASHBOARD_COMPONENT, modeFour); | ... | ... |
1 | 1 | import { Component } from 'vue'; |
2 | 2 | import { Layout } from 'vue3-grid-layout'; |
3 | -import { FrontComponent, FrontComponentCategory } from '../const/const'; | |
3 | +import { FrontComponent, FrontComponentCategory, visualOptionField } from '../const/const'; | |
4 | 4 | import { RadioRecord } from '../detail/config/util'; |
5 | 5 | import { DataComponentRecord, DataSource } from '/@/api/dataBoard/model'; |
6 | 6 | |
... | ... | @@ -25,6 +25,19 @@ export interface ComponentConfig { |
25 | 25 | ) => Recordable; |
26 | 26 | } |
27 | 27 | |
28 | +export interface VisualOptionParams { | |
29 | + [visualOptionField.FONT_COLOR]: string; | |
30 | + [visualOptionField.UNIT]: string; | |
31 | + [visualOptionField.ICON_COLOR]: string; | |
32 | + [visualOptionField.ICON]: string; | |
33 | + [visualOptionField.FIRST_PHASE_COLOR]: string; | |
34 | + [visualOptionField.SECOND_PHASE_COLOR]: string; | |
35 | + [visualOptionField.THIRD_PHASE_COLOR]: string; | |
36 | + [visualOptionField.FIRST_PHASE_VALUE]: string; | |
37 | + [visualOptionField.SECOND_PHASE_VALUE]: string; | |
38 | + [visualOptionField.THIRD_PHASE_VALUE]: string; | |
39 | +} | |
40 | + | |
28 | 41 | export interface VisualComponentProps<Layout = Recordable, Value = Recordable> { |
29 | 42 | value?: Value; |
30 | 43 | layout?: Layout; | ... | ... |