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; | ... | ... |