perf: extract const in visual board

 import { EChartsOption } from 'echarts';
 import { EChartsOption } from 'echarts';
-import { FrontComponent } from '../../const/const';
+import { FrontComponent, Gradient, GradientColor } from '../../const/const';
 import { fontSize, RadioRecord } from '../../detail/config/util';
 import { fontSize, RadioRecord } from '../../detail/config/util';
-import { Gradient, visualOptionField } from '../../detail/config/visualOptions';
 import {
 import {
   ComponentInfo,
   ComponentInfo,
   DataComponentRecord,
   DataComponentRecord,
@@ -11,14 +10,6 @@ import {
 import { isArray } from '/@/utils/is';
 import { isArray } from '/@/utils/is';
 import { buildUUID } from '/@/utils/uuid';
 import { buildUUID } from '/@/utils/uuid';
 
 
-export type GradientKey =
-  | visualOptionField.FIRST_PHASE_COLOR
-  | visualOptionField.FIRST_PHASE_VALUE
-  | visualOptionField.SECOND_PHASE_COLOR
-  | visualOptionField.SECOND_PHASE_VALUE
-  | visualOptionField.THIRD_PHASE_COLOR
-  | visualOptionField.THIRD_PHASE_VALUE;
-
 export interface GradientInfoRecord {
 export interface GradientInfoRecord {
   key: Gradient;
   key: Gradient;
   value: number;
   value: number;
@@ -40,12 +31,6 @@ export interface DashboardComponentLayout {
   componentType: FrontComponent;
   componentType: FrontComponent;
 }
 }
 
 
-export enum GradientColor {
-  FIRST = '#67e0e3',
-  SECOND = '#37a2da',
-  THIRD = '#fd666d',
-}
-
 export const instrumentComponent1 = (params?: Partial<ComponentInfo>): EChartsOption => {
 export const instrumentComponent1 = (params?: Partial<ComponentInfo>): EChartsOption => {
   const { value = 10, unit = '°C' } = params || {};
   const { value = 10, unit = '°C' } = params || {};
   return {
   return {

@@ -29,3 +29,27 @@ export enum FrontComponent {
   CONTROL_COMPONENT_SLIDING_SWITCH = 'control-component-sliding-switch',
   CONTROL_COMPONENT_SLIDING_SWITCH = 'control-component-sliding-switch',
   MAP_COMPONENT_TRACK = 'map-component-track',
   MAP_COMPONENT_TRACK = 'map-component-track',
 }
 }
+
+export enum Gradient {
+  FIRST = 'first',
+  SECOND = 'second',
+  THIRD = 'third',
+}
+export enum GradientColor {
+  FIRST = '#67e0e3',
+  SECOND = '#37a2da',
+  THIRD = '#fd666d',
+}
+
+export enum visualOptionField {
+  FONT_COLOR = 'fontColor',
+  UNIT = 'unit',
+  ICON_COLOR = 'iconColor',
+  ICON = 'icon',
+  FIRST_PHASE_COLOR = 'firstPhaseColor',
+  SECOND_PHASE_COLOR = 'secondPhaseColor',
+  THIRD_PHASE_COLOR = 'thirdPhaseColor',
+  FIRST_PHASE_VALUE = 'firstPhaseValue',
+  SECOND_PHASE_VALUE = 'secondPhaseValue',
+  THIRD_PHASE_VALUE = 'thirdPhaseValue',
+}

 <script lang="ts" setup>
 <script lang="ts" setup>
   import { ref, unref } from 'vue';
   import { ref, unref } from 'vue';
-  import {
-    schemasMap,
-    VisualOptionParams,
-    visualOptionField,
-    Gradient,
-  } from '../config/visualOptions';
+  import { schemasMap, VisualOptionParams } from '../config/visualOptions';
   import { useForm, BasicForm } from '/@/components/Form';
   import { useForm, BasicForm } from '/@/components/Form';
   import { BasicModal, useModalInner } from '/@/components/Modal';
   import { BasicModal, useModalInner } from '/@/components/Modal';
   import { ComponentInfo } from '/@/api/dataBoard/model';
   import { ComponentInfo } from '/@/api/dataBoard/model';
   import { computed } from '@vue/reactivity';
   import { computed } from '@vue/reactivity';
-  import { FrontComponent } from '../../components/help';
+  import { FrontComponent, Gradient, visualOptionField } from '../../const/const';
 
 
   const emit = defineEmits(['close', 'register']);
   const emit = defineEmits(['close', 'register']);
 
 

+import { FrontComponent, GradientColor } from '../../const/const';
 import { FormSchema } from '/@/components/Form';
 import { FormSchema } from '/@/components/Form';
 
 
 export interface VisualOptionParams {
 export interface VisualOptionParams {
@@ -13,17 +14,6 @@ export interface VisualOptionParams {
   [visualOptionField.THIRD_PHASE_VALUE]: string;
   [visualOptionField.THIRD_PHASE_VALUE]: string;
 }
 }
 
 
-export enum Gradient {
-  FIRST = 'first',
-  SECOND = 'second',
-  THIRD = 'third',
-}
-export enum GradientColor {
-  FIRST = '#67e0e3',
-  SECOND = '#37a2da',
-  THIRD = '#fd666d',
-}
-
 export enum visualOptionField {
 export enum visualOptionField {
   FONT_COLOR = 'fontColor',
   FONT_COLOR = 'fontColor',
   UNIT = 'unit',
   UNIT = 'unit',
@@ -188,13 +178,13 @@ export const modeFour: FormSchema[] = [
   },
   },
 ];
 ];
 
 
-export const schemasMap = new Map<string, FormSchema[]>();
+export const schemasMap = new Map<FrontComponent, FormSchema[]>();
 
 
-schemasMap.set('text-component-1', modeOne);
-schemasMap.set('text-component-2', modeOne);
-schemasMap.set('text-component-3', modeOne);
-schemasMap.set('text-component-4', modeTwo);
-schemasMap.set('text-component-5', modeTwo);
-schemasMap.set('instrument-component-1', modeOne);
-schemasMap.set('instrument-component-2', modeThree);
-schemasMap.set('digital-dashboard-component', modeFour);
+schemasMap.set(FrontComponent.TEXT_COMPONENT_1, modeOne);
+schemasMap.set(FrontComponent.TEXT_COMPONENT_2, modeOne);
+schemasMap.set(FrontComponent.TEXT_COMPONENT_3, modeOne);
+schemasMap.set(FrontComponent.TEXT_COMPONENT_4, modeTwo);
+schemasMap.set(FrontComponent.TEXT_COMPONENT_5, modeTwo);
+schemasMap.set(FrontComponent.INSTRUMENT_COMPONENT_1, modeOne);
+schemasMap.set(FrontComponent.INSTRUMENT_COMPONENT_2, modeThree);
+schemasMap.set(FrontComponent.DIGITAL_DASHBOARD_COMPONENT, modeFour);

 import { Component } from 'vue';
 import { Component } from 'vue';
 import { Layout } from 'vue3-grid-layout';
 import { Layout } from 'vue3-grid-layout';
-import { FrontComponent, FrontComponentCategory } from '../const/const';
+import { FrontComponent, FrontComponentCategory, visualOptionField } from '../const/const';
 import { RadioRecord } from '../detail/config/util';
 import { RadioRecord } from '../detail/config/util';
 import { DataComponentRecord, DataSource } from '/@/api/dataBoard/model';
 import { DataComponentRecord, DataSource } from '/@/api/dataBoard/model';
 
 
@@ -25,6 +25,19 @@ export interface ComponentConfig {
   ) => Recordable;
   ) => Recordable;
 }
 }
 
 
+export interface VisualOptionParams {
+  [visualOptionField.FONT_COLOR]: string;
+  [visualOptionField.UNIT]: string;
+  [visualOptionField.ICON_COLOR]: string;
+  [visualOptionField.ICON]: string;
+  [visualOptionField.FIRST_PHASE_COLOR]: string;
+  [visualOptionField.SECOND_PHASE_COLOR]: string;
+  [visualOptionField.THIRD_PHASE_COLOR]: string;
+  [visualOptionField.FIRST_PHASE_VALUE]: string;
+  [visualOptionField.SECOND_PHASE_VALUE]: string;
+  [visualOptionField.THIRD_PHASE_VALUE]: string;
+}
+
 export interface VisualComponentProps<Layout = Recordable, Value = Recordable> {
 export interface VisualComponentProps<Layout = Recordable, Value = Recordable> {
   value?: Value;
   value?: Value;
   layout?: Layout;
   layout?: Layout;