[Feat 0000] 首页模块配置更新及代码优化

src/views/vent/deviceManager/configurationTable/types.ts

@@ -134,6 +134,8 @@ export interface ModuleDataTable {
   }[];
 }
 export interface ModuleDataPreset {
+  /** 读取数据时的基础路径，如果配置了 header，应接着 Config.deviceType 配取值路径，反之应配置详尽路径 */
+  readFrom: string;
   /** 表格的预设样式，由各个预设单独使用，没有固定类型 */
   [key: string]: any;
 }
@@ -189,7 +191,7 @@ export interface ModuleData {
   gallery: ModuleDataGallery[];
   complex_list: ModuleDataComplexList[];
   /** 如果目前没有数据可以对接，可使用模拟数据先行展示 */
-  mock?: any[];
+  mock?: any;
   /** 如果模块需要跳转，可以在这里配置，不支持 formatter 格式 */
   to?: string;
 }

src/views/vent/home/configurable/components/content.vue

@@ -100,7 +100,7 @@
         />
       </template>
       <template v-if="config.key === 'blast_delta'">
-        <BlastDelta class="content__module" :pos-monitor="blastDeltaData" :canvas-size="{ width: 250, height: 137 }" />
+        <BlastDelta class="content__module" :pos-monitor="config.config.mock" :canvas-size="{ width: 250, height: 137 }" />
       </template>
       <template v-if="config.key === 'fire_control'">
         <FIreControl class="content__module" />
@@ -137,7 +137,6 @@
   import BlastDelta from '../../../monitorManager/deviceMonitor/components/device/modal/blastDelta.vue';
   import FIreWarn from './FIreWarn.vue';
   import FIreControl from './FIreControl.vue';
-  import { posMonitorData } from '../configurable.data';
 
   const props = defineProps<{
     deviceType: Config['deviceType'];
@@ -153,13 +152,19 @@
     selectedDeviceID.value = key;
   }
 
-  const blastDeltaData = ref();
-
   const { selectedDeviceID, selectedDevice, selectedDeviceSlot, selectedDeviceLabel, options, fetchDevices } = useInitDevices(
     props.deviceType,
     headerConfig
   );
 
+  function getData(raw, readFrom) {
+    if (mock) return mock;
+    if (readFrom) {
+      return get(raw, readFrom);
+    }
+    return raw;
+  }
+
   /** 根据配置里的layout将配置格式化为带 key 的具体配置，例如：[{ key: 'list', value: any, ...ModuleDataList }] */
   const layoutConfig = computed(() => {
     const refData = selectedDevice.value;
@@ -176,7 +181,7 @@
         case 'board': {
           const cfg = board.shift();
           if (!cfg) break;
-          const data = mock || cfg.readFrom ? get(refData, cfg.readFrom) : refData;
+          const data = getData(refData, cfg.readFrom);
 
           arr.push({
             ...cfg,
@@ -194,7 +199,8 @@
         case 'list': {
           const cfg = list.shift();
           if (!cfg) break;
-          const data = mock || cfg.readFrom ? get(refData, cfg.readFrom) : refData;
+          const data = getData(refData, cfg.readFrom);
+
           arr.push({
             ...cfg,
             key,
@@ -211,7 +217,7 @@
         case 'gallery': {
           const cfg = gallery.shift();
           if (!cfg) break;
-          const data = mock || cfg.readFrom ? get(refData, cfg.readFrom) : refData;
+          const data = getData(refData, cfg.readFrom);
 
           arr.push({
             ...cfg,
@@ -229,7 +235,7 @@
         case 'complex_list': {
           const cfg = complex_list.shift();
           if (!cfg) break;
-          const data = mock || cfg.readFrom ? get(refData, cfg.readFrom) : refData;
+          const data = getData(refData, cfg.readFrom);
 
           arr.push({
             ...cfg,
@@ -254,7 +260,7 @@
         case 'chart': {
           const cfg = chart.shift();
           if (!cfg) break;
-          const data = mock || cfg.readFrom ? get(refData, cfg.readFrom) : refData;
+          const data = getData(refData, cfg.readFrom);
 
           arr.push({
             key,
@@ -266,7 +272,7 @@
         case 'table': {
           const cfg = table.shift();
           if (!cfg) break;
-          const data = mock || cfg.readFrom ? get(refData, cfg.readFrom) : refData;
+          const data = getData(refData, cfg.readFrom);
 
           arr.push({
             ...cfg,
@@ -279,7 +285,7 @@
         default: {
           const cfg = preset.shift();
           if (!cfg) break;
-          const data = mock || cfg.readFrom ? get(refData, cfg.readFrom) : refData;
+          const data = getData(refData, cfg.readFrom);
 
           arr.push({
             key,
@@ -294,7 +300,6 @@
   });
 
   onMounted(() => {
-    blastDeltaData.value = posMonitorData;
     fetchDevices();
   });
 </script>

src/views/vent/home/configurable/configurable.data.ts

@@ -708,7 +708,11 @@ export const testConfigA: Config[] = [
       ],
       table: [],
       chart: [],
-      preset: [{}],
+      preset: [
+        {
+          readFrom: '',
+        },
+      ],
     },
     showStyle: {
       size: 'width:450px;height:280px;',
@@ -968,7 +972,12 @@ export const testConfigA: Config[] = [
       ],
       table: [],
       chart: [],
-      preset: [{}],
+      preset: [
+        {
+          readFrom: 'bd',
+          mock: posMonitorData,
+        },
+      ],
       complex_list: [
         {
           type: 'B',