[Feat 0000]基于大气压氧气浓度预测功能

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

@@ -11,98 +11,104 @@
       <template #container>
         <slot>
           <Header :deviceType="deviceType" :moduleData="moduleData" :data="data" @select="selectedData = $event" />
-          <Content :style="{ height: header.show ? 'calc(100% - 30px)' : '100%' }" :moduleData="moduleData" :data="selectedData" />
+          <Content
+            :style="{ height: header.show ? 'calc(100% - 30px)' : '100%' }"
+            :moduleData="moduleData"
+            :data="selectedData"
+            :chartData="chartData"
+          />
         </slot>
       </template>
     </ventBox1>
   </Transition>
 </template>
 <script lang="ts" setup>
-  import Header from './header.vue';
-  import Content from './content.vue';
-  // import ModuleLeft from './original/moduleLeft.vue';
-  // import ModuleBottom from './original/moduleBottom.vue';
-  import { computed, ref } from 'vue';
-  import ventBox1 from '/@/components/vent/ventBox1.vue';
-  import { openWindow } from '/@/utils';
-  import { getFormattedText } from '../hooks/helper';
-  // import { ModuleProps } from '../types';
+import Header from './header.vue';
+import Content from './content.vue';
+// import ModuleLeft from './original/moduleLeft.vue';
+// import ModuleBottom from './original/moduleBottom.vue';
+import { computed, ref } from 'vue';
+import ventBox1 from '/@/components/vent/ventBox1.vue';
+import { openWindow } from '/@/utils';
+import { getFormattedText } from '../hooks/helper';
+// import { ModuleProps } from '../types';
 
-  const props = defineProps<{
-    /** 配置的详细模块信息 */
-    moduleData: any;
-    /** 配置的详细样式信息 */
-    showStyle: any;
-    /** 该模块配置中的设备标识符 */
-    deviceType: string;
-    /** api返回的数据 */
-    data: any;
-    moduleName: string;
-    visible: boolean;
-  }>();
-  defineEmits(['close', 'click']);
+const props = defineProps<{
+  /** 配置的详细模块信息 */
+  moduleData: any;
+  /** 配置的详细样式信息 */
+  showStyle: any;
+  /** 该模块配置中的设备标识符 */
+  deviceType: string;
+  /** api返回的数据 */
+  data: any;
+  moduleName: string;
+  visible: boolean;
+  chartData: any;
+}>();
+defineEmits(['close', 'click']);
 
-  const { header } = props.moduleData;
-  const selectedData = ref();
+const { header } = props.moduleData;
+const selectedData = ref();
 
-  const style = computed(() => {
-    const size = props.showStyle.size;
-    const position = props.showStyle.position;
-    return size + position + 'position: absolute; pointer-events: auto; z-index: 1';
-  });
+const style = computed(() => {
+  const size = props.showStyle.size;
+  const position = props.showStyle.position;
+  return size + position + 'position: absolute; pointer-events: auto; z-index: 1';
+});
 
-  const capitalizedPosition = computed(() => {
-    return props.showStyle.position.includes('left') ? 'Left' : 'Right';
-  });
+const capitalizedPosition = computed(() => {
+  return props.showStyle.position.includes('left') ? 'Left' : 'Right';
+});
 
-  // 根据配置里的定位判断应该使用哪个class
-  function getModuleClass({ size, position }) {
-    const [_, width] = size.match(/width:([0-9]+)px/) || [];
-    if (position.includes('bottom') || parseInt(width) > 800) {
-      return 'module-common module-common-longer';
-    }
-    return 'module-common';
+// 根据配置里的定位判断应该使用哪个class
+function getModuleClass({ size, position }) {
+  const [_, width] = size.match(/width:([0-9]+)px/) || [];
+  if (position.includes('bottom') || parseInt(width) > 800) {
+    return 'module-common module-common-longer';
   }
+  return 'module-common';
+}
 
-  function redirectTo() {
-    const { to } = props.moduleData;
-    if (!to) return;
-    openWindow(getFormattedText(selectedData.value, to));
-  }
+function redirectTo() {
+  const { to } = props.moduleData;
+  if (!to) return;
+  openWindow(getFormattedText(selectedData.value, to));
+}
 </script>
 <style lang="less" scoped>
-  @import '/@/design/theme.less';
+@import '/@/design/theme.less';
 
-  .module-common .box1-center {
-    height: calc(100% - 48px);
-  }
+.module-common .box1-center {
+  height: calc(100% - 48px);
+}
 
-  :deep(.box1-center) {
-    height: calc(100% - 48px);
-  }
-  :deep(.box1-center > .box-container) {
-    height: 100%;
-    padding: 0 !important;
-    width: 100% !important;
-  }
-  @{theme-deepblue} {
-    .module-common-longer {
-      :deep(.box1-top) {
-        --image-box1-top: url('/@/assets/images/themify/deepblue/vent/border/box2-top-long.png');
-      }
-      :deep(.box1-bottom) {
-        --image-box1-bottom: none;
-      }
-    }
-  }
+:deep(.box1-center) {
+  height: calc(100% - 48px);
+}
+:deep(.box1-center > .box-container) {
+  height: 100%;
+  padding: 0 !important;
+  width: 100% !important;
+}
+@{theme-deepblue} {
   .module-common-longer {
     :deep(.box1-top) {
-      --image-box1-top: url('/@/assets/images/vent/box-top-bg.png');
-      background-image: var(--image-box1-top);
+      --image-box1-top: url('/@/assets/images/themify/deepblue/vent/border/box2-top-long.png');
     }
     :deep(.box1-bottom) {
-      --image-box1-bottom: url('/@/assets/images/vent/box-bottom-bg.png');
-      background-image: var(--image-box1-bottom);
+      --image-box1-bottom: none;
     }
   }
+}
+.module-common-longer {
+  :deep(.box1-top) {
+    --image-box1-top: url('/@/assets/images/vent/box-top-bg.png');
+    background-image: var(--image-box1-top);
+  }
+  :deep(.box1-bottom) {
+    --image-box1-bottom: url('/@/assets/images/vent/box-bottom-bg.png');
+    background-image: var(--image-box1-bottom);
+  }
+}
 </style>

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

@@ -149,238 +149,240 @@
   </div>
 </template>
 <script lang="ts" setup>
-  import { computed } from 'vue';
-  import {
-    CommonItem,
-    Config,
-    // ModuleDataBoard,
-    // ModuleDataChart,
-    // ModuleDataList,
-    // ModuleDataPreset,
-    // ModuleDataTable,
-  } from '../../../deviceManager/configurationTable/types';
-  import MiniBoard from './detail/MiniBoard.vue';
-  import TimelineList from './detail/TimelineList.vue';
-  import TimelineListNew from './detail/TimelineListNew.vue';
-  import CustomList from './detail/CustomList.vue';
-  import CustomGallery from './detail/CustomGallery.vue';
-  import ComplexList from './detail/ComplexList.vue';
-  import GalleryList from './detail/GalleryList.vue';
-  import CustomTable from './detail/CustomTable.vue';
-  import CustomChart from './detail/CustomChart.vue';
-  import { clone } from 'lodash-es';
-  import { getData, getFormattedText } from '../hooks/helper';
-  import BlastDelta from '../../../monitorManager/deviceMonitor/components/device/modal/blastDelta.vue';
-  import QHCurve from './preset/QHCurve.vue';
-  import MeasureDetail from './preset/MeasureDetail.vue';
-  import CustomTabs from './preset/CustomTabs.vue';
-  import AIChat from '/@/components/AIChat/MiniChat.vue';
-  import DeviceAlarm from './preset/DeviceAlarm.vue';
-  import SelectCs from './preset/SelectCs.vue';
-  import MiniBoardNew from './detail/MiniBoard-New.vue';
-  import Partition from './preset/partition.vue';
-  import SelectorDualChart from './preset/selectorDualChart.vue';
-  import RadioLabel from './preset/radioLabel.vue';
-  import ButtonList from './preset/buttonList.vue';
-  // import FIreWarn from './preset/FIreWarn.vue';
-  // import FIreControl from './preset/FIreControl.vue';
+import { computed } from 'vue';
+import {
+  CommonItem,
+  Config,
+  // ModuleDataBoard,
+  // ModuleDataChart,
+  // ModuleDataList,
+  // ModuleDataPreset,
+  // ModuleDataTable,
+} from '../../../deviceManager/configurationTable/types';
+import MiniBoard from './detail/MiniBoard.vue';
+import TimelineList from './detail/TimelineList.vue';
+import TimelineListNew from './detail/TimelineListNew.vue';
+import CustomList from './detail/CustomList.vue';
+import CustomGallery from './detail/CustomGallery.vue';
+import ComplexList from './detail/ComplexList.vue';
+import GalleryList from './detail/GalleryList.vue';
+import CustomTable from './detail/CustomTable.vue';
+import CustomChart from './detail/CustomChart.vue';
+import { clone } from 'lodash-es';
+import { getData, getFormattedText } from '../hooks/helper';
+import BlastDelta from '../../../monitorManager/deviceMonitor/components/device/modal/blastDelta.vue';
+import QHCurve from './preset/QHCurve.vue';
+import MeasureDetail from './preset/MeasureDetail.vue';
+import CustomTabs from './preset/CustomTabs.vue';
+import AIChat from '/@/components/AIChat/MiniChat.vue';
+import DeviceAlarm from './preset/DeviceAlarm.vue';
+import SelectCs from './preset/SelectCs.vue';
+import MiniBoardNew from './detail/MiniBoard-New.vue';
+import Partition from './preset/partition.vue';
+import SelectorDualChart from './preset/selectorDualChart.vue';
+import RadioLabel from './preset/radioLabel.vue';
+import ButtonList from './preset/buttonList.vue';
+// import FIreWarn from './preset/FIreWarn.vue';
+// import FIreControl from './preset/FIreControl.vue';
 
-  const props = defineProps<{
-    data: any;
-    moduleData: Config['moduleData'];
-  }>();
+const props = defineProps<{
+  data: any;
+  moduleData: Config['moduleData'];
+  chartData: any;
+}>();
 
-  const { background, layout } = props.moduleData;
+const { background, layout } = props.moduleData;
 
-  // 获取当原始配置带 items 项时的最终 items 配置
-  function getItems(raw, items: CommonItem[]) {
-    return items.map((i) => {
+// 获取当原始配置带 items 项时的最终 items 配置
+function getItems(raw, items: CommonItem[]) {
+  return items.map((i) => {
+    return {
+      ...i,
+      label: getFormattedText(raw, i.label, i.trans),
+      value: getFormattedText(raw, i.value, i.trans),
+    };
+  });
+}
+
+// 获取当 List 组件配置带 items 项时的最终 items 配置
+function getListItems(raw: any, items: CommonItem[], mapFromData?: boolean) {
+  if (mapFromData && Array.isArray(raw)) {
+    return raw.map((data) => {
+      const item = items[0];
       return {
-        ...i,
-        label: getFormattedText(raw, i.label, i.trans),
-        value: getFormattedText(raw, i.value, i.trans),
+        ...item,
+        label: getFormattedText(data, item.label, item.trans),
+        value: getFormattedText(data, item.value, item.trans),
       };
     });
   }
+  return getItems(raw, items);
+}
+
+/** 根据配置里的layout将配置格式化为带 key 的具体配置，例如：[{ key: 'list', value: any, ...ModuleDataList }] */
+const layoutConfig = computed(() => {
+  const refData = props.data;
+  const board = clone(props.moduleData.board) || [];
+  const list = clone(props.moduleData.list) || [];
+  const gallery = clone(props.moduleData.gallery) || [];
+  const complex_list = clone(props.moduleData.complex_list) || [];
+  const gallery_list = clone(props.moduleData.gallery_list) || [];
+  const tabs = clone(props.moduleData.tabs) || [];
+  const chart = clone(props.moduleData.chart) || [];
+  const table = clone(props.moduleData.table) || [];
+  const preset = clone(props.moduleData.preset) || [];
+  const partition = clone(props.moduleData.partition) || [];
+  const mockData = clone(props.chartData) || [];
+  return layout.items.reduce((arr: any[], item) => {
+    switch (item.name) {
+      case 'board': {
+        const cfg = board.shift();
+        if (!cfg) break;
+        const data = getData(refData, cfg.readFrom, cfg.parser);
 
-  // 获取当 List 组件配置带 items 项时的最终 items 配置
-  function getListItems(raw: any, items: CommonItem[], mapFromData?: boolean) {
-    if (mapFromData && Array.isArray(raw)) {
-      return raw.map((data) => {
-        const item = items[0];
-        return {
+        arr.push({
+          overflow: true,
           ...item,
-          label: getFormattedText(data, item.label, item.trans),
-          value: getFormattedText(data, item.value, item.trans),
-        };
-      });
-    }
-    return getItems(raw, items);
-  }
+          ...cfg,
+          items: getItems(data, cfg.items),
+        });
+        break;
+      }
+      case 'list': {
+        const cfg = list.shift();
+        if (!cfg) break;
+        const data = getData(refData, cfg.readFrom, cfg.parser);
 
-  /** 根据配置里的layout将配置格式化为带 key 的具体配置，例如：[{ key: 'list', value: any, ...ModuleDataList }] */
-  const layoutConfig = computed(() => {
-    const refData = props.data;
-    const board = clone(props.moduleData.board) || [];
-    const list = clone(props.moduleData.list) || [];
-    const gallery = clone(props.moduleData.gallery) || [];
-    const complex_list = clone(props.moduleData.complex_list) || [];
-    const gallery_list = clone(props.moduleData.gallery_list) || [];
-    const tabs = clone(props.moduleData.tabs) || [];
-    const chart = clone(props.moduleData.chart) || [];
-    const table = clone(props.moduleData.table) || [];
-    const preset = clone(props.moduleData.preset) || [];
-    const partition = clone(props.moduleData.partition) || [];
+        arr.push({
+          overflow: true,
+          ...item,
+          ...cfg,
+          items: getListItems(data, cfg.items, cfg.mapFromData),
+        });
+        break;
+      }
+      case 'gallery': {
+        const cfg = gallery.shift();
+        if (!cfg) break;
+        const data = getData(refData, cfg.readFrom, cfg.parser);
 
-    return layout.items.reduce((arr: any[], item) => {
-      switch (item.name) {
-        case 'board': {
-          const cfg = board.shift();
-          if (!cfg) break;
-          const data = getData(refData, cfg.readFrom, cfg.parser);
+        arr.push({
+          overflow: true,
+          ...item,
+          ...cfg,
+          items: getItems(data, cfg.items),
+        });
+        break;
+      }
+      case 'complex_list': {
+        const cfg = complex_list.shift();
+        if (!cfg) break;
+        const data = getData(refData, cfg.readFrom, cfg.parser);
 
+        if (cfg.mapFromData) {
+          const firstListItem = cfg.items[0];
           arr.push({
             overflow: true,
             ...item,
             ...cfg,
-            items: getItems(data, cfg.items),
+            items: (data || []).map((d) => {
+              return {
+                title: getFormattedText(d, firstListItem.title, firstListItem.trans),
+                contents: firstListItem.contents.map((e) => {
+                  return {
+                    ...e,
+                    label: getFormattedText(d, e.label, e.trans),
+                    value: getFormattedText(d, e.value, e.trans),
+                  };
+                }),
+              };
+            }),
           });
-          break;
-        }
-        case 'list': {
-          const cfg = list.shift();
-          if (!cfg) break;
-          const data = getData(refData, cfg.readFrom, cfg.parser);
-
+        } else {
           arr.push({
             overflow: true,
             ...item,
             ...cfg,
-            items: getListItems(data, cfg.items, cfg.mapFromData),
+            items: cfg.items.map((i) => {
+              return {
+                title: getFormattedText(data, i.title, i.trans),
+                contents: i.contents.map((e) => {
+                  return {
+                    ...e,
+                    label: getFormattedText(data, e.label, e.trans),
+                    value: getFormattedText(data, e.value, e.trans),
+                  };
+                }),
+              };
+            }),
           });
-          break;
         }
-        case 'gallery': {
-          const cfg = gallery.shift();
-          if (!cfg) break;
-          const data = getData(refData, cfg.readFrom, cfg.parser);
+        break;
+      }
+      case 'gallery_list': {
+        const cfg = gallery_list.shift();
+        if (!cfg) break;
+        const data = getData(refData, cfg.readFrom, cfg.parser);
 
+        arr.push({
+          overflow: true,
+          ...item,
+          ...cfg,
+          items: getItems(data, cfg.items),
+          galleryItems: getItems(data, cfg.galleryItems),
+        });
+        break;
+      }
+      case 'tabs': {
+        const cfg = tabs.shift();
+        if (!cfg) break;
+        const data = getData(refData, cfg.readFrom, cfg.parser);
+
+        if (cfg.mapFromData) {
+          const firstListItem = cfg.items[0];
           arr.push({
             overflow: true,
             ...item,
             ...cfg,
-            items: getItems(data, cfg.items),
+            items: (data || []).map((d) => {
+              return {
+                title: getFormattedText(d, firstListItem.title, firstListItem.trans),
+                contents: firstListItem.contents.map((e) => {
+                  return {
+                    ...e,
+                    label: getFormattedText(d, e.label, e.trans),
+                    value: getFormattedText(d, e.value, e.trans),
+                  };
+                }),
+              };
+            }),
           });
-          break;
-        }
-        case 'complex_list': {
-          const cfg = complex_list.shift();
-          if (!cfg) break;
-          const data = getData(refData, cfg.readFrom, cfg.parser);
-
-          if (cfg.mapFromData) {
-            const firstListItem = cfg.items[0];
-            arr.push({
-              overflow: true,
-              ...item,
-              ...cfg,
-              items: (data || []).map((d) => {
-                return {
-                  title: getFormattedText(d, firstListItem.title, firstListItem.trans),
-                  contents: firstListItem.contents.map((e) => {
-                    return {
-                      ...e,
-                      label: getFormattedText(d, e.label, e.trans),
-                      value: getFormattedText(d, e.value, e.trans),
-                    };
-                  }),
-                };
-              }),
-            });
-          } else {
-            arr.push({
-              overflow: true,
-              ...item,
-              ...cfg,
-              items: cfg.items.map((i) => {
-                return {
-                  title: getFormattedText(data, i.title, i.trans),
-                  contents: i.contents.map((e) => {
-                    return {
-                      ...e,
-                      label: getFormattedText(data, e.label, e.trans),
-                      value: getFormattedText(data, e.value, e.trans),
-                    };
-                  }),
-                };
-              }),
-            });
-          }
-          break;
-        }
-        case 'gallery_list': {
-          const cfg = gallery_list.shift();
-          if (!cfg) break;
-          const data = getData(refData, cfg.readFrom, cfg.parser);
-
+        } else {
           arr.push({
             overflow: true,
             ...item,
             ...cfg,
-            items: getItems(data, cfg.items),
-            galleryItems: getItems(data, cfg.galleryItems),
+            items: cfg.items.map((i) => {
+              return {
+                title: getFormattedText(data, i.title, i.trans),
+                contents: i.contents.map((e) => {
+                  return {
+                    ...e,
+                    label: getFormattedText(data, e.label, e.trans),
+                    value: getFormattedText(data, e.value, e.trans),
+                  };
+                }),
+              };
+            }),
           });
-          break;
-        }
-        case 'tabs': {
-          const cfg = tabs.shift();
-          if (!cfg) break;
-          const data = getData(refData, cfg.readFrom, cfg.parser);
-
-          if (cfg.mapFromData) {
-            const firstListItem = cfg.items[0];
-            arr.push({
-              overflow: true,
-              ...item,
-              ...cfg,
-              items: (data || []).map((d) => {
-                return {
-                  title: getFormattedText(d, firstListItem.title, firstListItem.trans),
-                  contents: firstListItem.contents.map((e) => {
-                    return {
-                      ...e,
-                      label: getFormattedText(d, e.label, e.trans),
-                      value: getFormattedText(d, e.value, e.trans),
-                    };
-                  }),
-                };
-              }),
-            });
-          } else {
-            arr.push({
-              overflow: true,
-              ...item,
-              ...cfg,
-              items: cfg.items.map((i) => {
-                return {
-                  title: getFormattedText(data, i.title, i.trans),
-                  contents: i.contents.map((e) => {
-                    return {
-                      ...e,
-                      label: getFormattedText(data, e.label, e.trans),
-                      value: getFormattedText(data, e.value, e.trans),
-                    };
-                  }),
-                };
-              }),
-            });
-          }
-          break;
         }
-        case 'chart': {
-          const cfg = chart.shift();
+        break;
+      }
+      case 'chart': {
+        const cfg = chart.shift();
+        if (cfg?.type == 'scatter') {
           if (!cfg) break;
-          const data = getData(refData, cfg.readFrom, cfg.parser);
+          const data = getData(mockData, cfg.readFrom, cfg.parser);
 
           arr.push({
             ...item,
@@ -388,151 +390,161 @@
             data,
           });
           break;
-        }
-        case 'table': {
-          const cfg = table.shift();
-          if (!cfg) break;
-          const data = getData(refData, cfg.readFrom, cfg.parser);
-
-          arr.push({
-            ...cfg,
-            ...item,
-            columns: cfg.columns,
-            data,
-          });
-          break;
-        }
-        case 'partition': {
-          const cfg = partition.shift();
+        } else {
           if (!cfg) break;
           const data = getData(refData, cfg.readFrom, cfg.parser);
           arr.push({
-            overflow: true,
             ...item,
+            config: cfg,
             data,
-            ...cfg,
           });
           break;
         }
-        default: {
-          const cfg = preset.shift();
-          if (!cfg) break;
-          const data = getData(refData, cfg.readFrom, cfg.parser);
+      }
+      case 'table': {
+        const cfg = table.shift();
+        if (!cfg) break;
+        const data = getData(refData, cfg.readFrom, cfg.parser);
 
-          arr.push({
-            ...item,
-            data,
-            config: cfg,
-          });
-          break;
-        }
+        arr.push({
+          ...cfg,
+          ...item,
+          columns: cfg.columns,
+          data,
+        });
+        break;
       }
-      // console.log(arr,'arr---')
-      return arr;
-    }, []);
-  });
+      case 'partition': {
+        const cfg = partition.shift();
+        if (!cfg) break;
+        const data = getData(refData, cfg.readFrom, cfg.parser);
+        arr.push({
+          overflow: true,
+          ...item,
+          data,
+          ...cfg,
+        });
+        break;
+      }
+      default: {
+        const cfg = preset.shift();
+        if (!cfg) break;
+        const data = getData(refData, cfg.readFrom, cfg.parser);
+
+        arr.push({
+          ...item,
+          data,
+          config: cfg,
+        });
+        break;
+      }
+    }
+    // console.log(arr,'arr---')
+    return arr;
+  }, []);
+});
 </script>
 <style lang="less" scoped>
-  @import '@/design/theme.less';
+@import '@/design/theme.less';
 
-  .content {
-    height: calc(100% - 30px);
-    position: relative;
-    // z-index: -2;
-    display: flex;
-    flex-direction: column;
-    overflow-y: auto; // 这里会导致样式无故添加滚动条
-    overflow-x: hidden;
-  }
+.content {
+  height: calc(100% - 30px);
+  position: relative;
+  // z-index: -2;
+  display: flex;
+  flex-direction: column;
+  overflow-y: auto; // 这里会导致样式无故添加滚动条
+  overflow-x: hidden;
+}
 
-  .content__background {
-    width: 100%;
-    height: 100%;
-    position: absolute;
-    top: 0;
-    left: 0;
-    z-index: 0;
-    object-fit: fill;
-  }
+.content__background {
+  width: 100%;
+  height: 100%;
+  position: absolute;
+  top: 0;
+  left: 0;
+  z-index: 0;
+  object-fit: fill;
+}
 
-  .image__background {
-    width: 35%;
-    height: 61%;
-    left: 30%;
-  }
+.image__background {
+  width: 35%;
+  height: 61%;
+  left: 30%;
+}
 
-  .content__module {
-    // margin-top: 5px;
-    // margin-bottom: 5px;
-    width: 100%;
-    height: 100%;
-  }
+.content__module {
+  // margin-top: 5px;
+  // margin-bottom: 5px;
+  width: 100%;
+  height: 100%;
+}
 
-  .content__module1 {
-    background: url('@/assets/images/vent/homeNew/databg/4.png');
-    background-repeat: no-repeat;
-    background-size: 100% 100%;
-    height: 129px;
-    margin-top: 20%;
-  }
+.content__module1 {
+  background: url('@/assets/images/vent/homeNew/databg/4.png');
+  background-repeat: no-repeat;
+  background-size: 100% 100%;
+  height: 129px;
+  margin-top: 20%;
+}
 
-  .content__moduleFire {
-    width: 100%;
-    height: 100%;
-    margin-left: -24% !important;
-  }
+.content__moduleFire {
+  width: 100%;
+  height: 100%;
+  margin-left: -24% !important;
+}
 
-  .content__module_dust {
-    background: url('@/assets/images/vent/homeNew/bottomBg.png');
-    background-repeat: no-repeat;
-    background-size: 100% 100%;
-    width: 100%;
-    height: 100%;
-  }
+.content__module_dust {
+  background: url('@/assets/images/vent/homeNew/bottomBg.png');
+  background-repeat: no-repeat;
+  background-size: 100% 100%;
+  width: 100%;
+  height: 100%;
+}
 
-  // .content__module:first-of-type {
-  //   margin-top: 0;
-  // }
-  // .content__module:last-of-type {
-  //   margin-bottom: 0;
-  // }
-  ::-webkit-scrollbar {
-    width: 5px !important;
-  }
+// .content__module:first-of-type {
+//   margin-top: 0;
+// }
+// .content__module:last-of-type {
+//   margin-bottom: 0;
+// }
+::-webkit-scrollbar {
+  width: 5px !important;
+}
 
-  ::-webkit-scrollbar-thumb {
-    width: 5px !important;
-  }
+::-webkit-scrollbar-thumb {
+  width: 5px !important;
+}
 
-  :deep(.zxm-select:not(.zxm-select-customize-input) .zxm-select-selector) {
-    /* background-color: transparent; */
-    color: #fff;
-  }
+:deep(.zxm-select:not(.zxm-select-customize-input) .zxm-select-selector) {
+  /* background-color: transparent; */
+  color: #fff;
+}
 
-  :deep(.zxm-select-arrow) {
-    color: #fff;
-  }
+:deep(.zxm-select-arrow) {
+  color: #fff;
+}
 
-  :deep(.zxm-select-selection-item) {
-    color: #fff !important;
-  }
+:deep(.zxm-select-selection-item) {
+  color: #fff !important;
+}
 
-  :deep(.zxm-select-selection-placeholder) {
-    color: #fff !important;
-  }
+:deep(.zxm-select-selection-placeholder) {
+  color: #fff !important;
+}
 
-  :deep(.dialog-overlay) {
-    width: 100%;
-    height: 100%;
-    position: unset;
-    box-shadow: unset;
-  }
+:deep(.dialog-overlay) {
+  width: 100%;
+  height: 100%;
+  position: unset;
+  box-shadow: unset;
+}
 
-  ::-webkit-scrollbar {
-    width: 5px !important;
-  }
+::-webkit-scrollbar {
+  width: 5px !important;
+}
 
-  ::-webkit-scrollbar-thumb {
-    width: 5px !important;
-  }
+::-webkit-scrollbar-thumb {
+  width: 5px !important;
+}
 </style>

src/views/vent/monitorManager/balancePressMonitor/balancePress.api.ts

@@ -73,7 +73,7 @@ export const validPassword = (params) =>
 export const getO2PressData = (params) => {
   // 将对象参数转换为query string
   const queryString = new URLSearchParams(params).toString();
-  return defHttp.get({
+  return defHttp.post({
     url: `${Api.getO2PressData}?${queryString}`,
   });
 };

src/views/vent/monitorManager/balancePressMonitor/components/balancePressHome2.vue

@@ -9,559 +9,593 @@
         :module-name="cfg.moduleName"
         :device-type="cfg.deviceType"
         :data="selectData"
+        :chartData="mockData"
         :visible="true"
       /> </div
   ></a-spin>
 </template>
 <script setup lang="ts">
-  import { ref, onMounted, onUnmounted, defineProps } from 'vue';
-  import { mountedThree, destroy, setModelType, updateText, play } from '../balancePress.threejs';
-  import { list } from '../balancePress.api';
-  import ModuleCommon from '../../../home/configurable/components/ModuleCommon.vue';
-  import { useInitConfigs } from '../../../home/configurable/hooks/useInit';
-  import { useGlobSetting } from '/@/hooks/setting';
-  // import { Config } from '../../../deviceManager/configurationTable/types';
+import { ref, onMounted, onUnmounted, defineProps } from 'vue';
+import { mountedThree, destroy, setModelType, updateText, play } from '../balancePress.threejs';
+import { list, getO2PressData } from '../balancePress.api';
+import ModuleCommon from '../../../home/configurable/components/ModuleCommon.vue';
+import { useInitConfigs } from '../../../home/configurable/hooks/useInit';
+import { useGlobSetting } from '/@/hooks/setting';
+import ventBox1 from '/@/components/vent/ventBox1.vue';
+import CustomChart from '@/views/vent/home/configurable/components/detail/CustomChart.vue';
+import { PressO2Option, mockData1 } from '../balancePressO2.data';
+// import { Config } from '../../../deviceManager/configurationTable/types';
 
-  const props = defineProps({
-    deviceId: {
-      type: String,
-      require: true,
-    },
-  });
-
-  const { sysOrgCode } = useGlobSetting();
-
-  const loading = ref(false);
+const props = defineProps({
+  deviceId: {
+    type: String,
+    require: true,
+  },
+});
 
-  // 监测数据
-  const selectData = ref();
+const { sysOrgCode } = useGlobSetting();
 
-  // https获取监测数据
-  let timer: any = null;
-  function getMonitor(flag?) {
-    if (Object.prototype.toString.call(timer) === '[object Null]') {
-      timer = setTimeout(
-        async () => {
-          if (props.deviceId) {
-            const data = await getDataSource(props.deviceId);
-            // Object.assign(selectData, data);
-            updateText(selectData);
-            selectData.value = data;
-          }
-          if (timer) {
-            timer = null;
-          }
-          await getMonitor();
-          loading.value = false;
-        },
-        flag ? 0 : 1000
-      );
-    }
-  }
+const loading = ref(false);
 
-  async function getDataSource(systemID) {
-    const res = await list({ devicetype: 'sys', systemID });
+// 监测数据
+const selectData = ref();
+const mockData = ref<{ chartData: { dateTime: string; o2Val: string; pressureVal: string }[] }>({
+  chartData: [],
+});
+const O2PressDataFetched = ref(false);
+const modelsensorO2Data = ref<any[]>([]);
 
-    const result = Array.from(res.msgTxt).reduce(
-      (obj: any, e: any) => {
-        // if (true) {
-        if (sysOrgCode === 'sdmtjtswmk') {
-          if (e.type.startsWith('fanlocal')) {
-            obj.fanlocal.datalist.push(...e.datalist);
-          }
-          if (e.type.startsWith('safetymonitor')) {
-            e.datalist.forEach((ele) => {
-              if (ele.strinstallpos.includes('风门')) {
-                obj.gate.datalist.push(ele);
-              } else if (ele.strinstallpos.includes('风窗')) {
-                obj.window.datalist.push(ele);
-              } else if (ele.strinstallpos.includes('工作面')) {
-                obj.work_surface.datalist.push(ele);
-              } else {
-                obj.others.datalist.push(ele);
-              }
-            });
-          }
-          if (e.type.startsWith('avgpressure_lowoxygen')) {
-            e.datalist.forEach((ele) => {
-              ele.strinstallpos = ele.strinstallpos.replaceAll(' ', '');
-              ele.strname = ele.strname.replaceAll(' ', '');
-            });
-          }
+// https获取监测数据
+let timer: any = null;
+function getMonitor(flag?) {
+  if (Object.prototype.toString.call(timer) === '[object Null]') {
+    timer = setTimeout(
+      async () => {
+        if (props.deviceId) {
+          const data = await getDataSource(props.deviceId);
+          // Object.assign(selectData, data);
+          updateText(selectData);
+          selectData.value = data;
         }
-
-        obj[e.type] = e;
-        return obj;
+        if (timer) {
+          timer = null;
+        }
+        await getMonitor();
+        loading.value = false;
       },
-      {
-        /** 用于归类fanlocal */
-        fanlocal: { datalist: [] },
-        /** 用于归类gate */
-        gate: { datalist: [] },
-        /** 用于归类window */
-        window: { datalist: [] },
-        /** 用于归类work_surface */
-        work_surface: { datalist: [] },
-        others: { datalist: [] },
-      }
+      flag ? 0 : 1000
     );
-    return result;
   }
+}
+
+async function getDataSource(systemID) {
+  const res = await list({ devicetype: 'sys', systemID });
+  const result = Array.from(res.msgTxt).reduce(
+    (obj: any, e: any) => {
+      // if (true) {
+      modelsensorO2Data.value = [];
+      if (sysOrgCode === 'sdmtjtswmk') {
+        if (e.type.startsWith('fanlocal')) {
+          obj.fanlocal.datalist.push(...e.datalist);
+        }
+        if (e.type.startsWith('safetymonitor')) {
+          e.datalist.forEach((ele) => {
+            if (ele.strinstallpos.includes('风门')) {
+              obj.gate.datalist.push(ele);
+            } else if (ele.strinstallpos.includes('风窗')) {
+              obj.window.datalist.push(ele);
+            } else if (ele.strinstallpos.includes('工作面')) {
+              obj.work_surface.datalist.push(ele);
+            } else {
+              obj.others.datalist.push(ele);
+            }
+          });
+        }
+        if (e.type.startsWith('avgpressure_lowoxygen')) {
+          e.datalist.forEach((ele) => {
+            ele.strinstallpos = ele.strinstallpos.replaceAll(' ', '');
+            ele.strname = ele.strname.replaceAll(' ', '');
+          });
+        }
+      }
+      if (e.type.includes('modelsensor_o2')) {
+        modelsensorO2Data.value.push(...e.datalist);
+        console.log(modelsensorO2Data.value, '氧气数据');
+        if (!O2PressDataFetched.value) {
+          O2PressDataFetched.value = true;
+          getO2Press(modelsensorO2Data.value);
+        }
+      }
+      obj[e.type] = e;
+      return obj;
+    },
+    {
+      /** 用于归类fanlocal */
+      fanlocal: { datalist: [] },
+      /** 用于归类gate */
+      gate: { datalist: [] },
+      /** 用于归类window */
+      window: { datalist: [] },
+      /** 用于归类work_surface */
+      work_surface: { datalist: [] },
+      others: { datalist: [] },
+    }
+  );
+  return result;
+}
 
-  // const configs = ref<Config[]>([
-  //   {
-  //     deviceType: 'fanlocal',
-  //     moduleName: '局部风机',
-  //     pageType: 'balancePressHome',
-  //     moduleData: {
-  //       header: {
-  //         show: true,
-  //         readFrom: 'datalist',
-  //         selector: {
-  //           show: true,
-  //           value: '${deviceID}',
-  //           trans: {
-  //             '1910221332833665026': '主机',
-  //             '1910221283626090497': '备机',
-  //           },
-  //         },
-  //         slot: {
-  //           show: false,
-  //           value: '',
-  //         },
-  //       },
-  //       background: {
-  //         show: false,
-  //         type: 'image',
-  //         link: '',
-  //       },
-  //       layout: {
-  //         direction: 'column',
-  //         items: [
-  //           {
-  //             name: 'tabs',
-  //             basis: '100%',
-  //           },
-  //         ],
-  //       },
-  //       complex_list: [],
-  //       chart: [],
-  //       table: [],
-  //       gallery: [],
-  //       list: [],
-  //       tabs: [
-  //         {
-  //           type: 'K',
-  //           readFrom: '',
-  //           mapFromData: false,
-  //           items: [
-  //             {
-  //               title: '电机1',
-  //               contents: [
-  //                 {
-  //                   label: '输出功率',
-  //                   value: '${readData.Fan1StartStatus}',
-  //                   color: 'blue',
-  //                 },
-  //                 {
-  //                   label: '输出电压',
-  //                   value: '${readData.Fan1StartStatus}',
-  //                   color: 'blue',
-  //                 },
-  //               ],
-  //             },
-  //             {
-  //               title: '电机2',
-  //               contents: [
-  //                 {
-  //                   label: '输出功率',
-  //                   value: '${readData.Fan2StartStatus}',
-  //                   color: 'blue',
-  //                 },
-  //                 {
-  //                   label: '输出电压',
-  //                   value: '${readData.Fan2StartStatus}',
-  //                   color: 'blue',
-  //                 },
-  //                 {
-  //                   label: '输出电压',
-  //                   value: '${readData.Fan2StartStatus}',
-  //                   color: 'blue',
-  //                 },
-  //                 {
-  //                   label: '输出电压',
-  //                   value: '${readData.Fan2StartStatus}',
-  //                   color: 'blue',
-  //                 },
-  //               ],
-  //             },
-  //           ],
-  //         },
-  //       ],
-  //       gallery_list: [],
-  //       preset: [],
-  //       to: '',
-  //     },
-  //     showStyle: {
-  //       size: 'width:470px;height:260px;',
-  //       version: '原版',
-  //       position: 'top:20px;left:0;',
-  //     },
-  //   },
-  //   {
-  //     deviceType: '',
-  //     moduleName: '风门',
-  //     pageType: 'balancePressHome',
-  //     moduleData: {
-  //       header: {
-  //         show: false,
-  //         readFrom: '',
-  //         selector: {
-  //           show: false,
-  //           value: '',
-  //         },
-  //         slot: {
-  //           show: false,
-  //           value: '',
-  //         },
-  //       },
-  //       background: {
-  //         show: false,
-  //         type: 'image',
-  //         link: '',
-  //       },
-  //       layout: {
-  //         direction: 'column',
-  //         items: [
-  //           {
-  //             name: 'complex_list',
-  //             basis: '100%',
-  //           },
-  //         ],
-  //       },
-  //       complex_list: [
-  //         {
-  //           type: 'G',
-  //           readFrom: 'gate.datalist',
-  //           mapFromData: true,
-  //           items: [
-  //             {
-  //               title: '${deviceID}',
-  //               trans: {
-  //                 '1915631893453004802': '22107胶运顺槽入口自动风门2',
-  //                 '1915631893478170626': '22107胶运顺槽入口自动风门1',
-  //                 '1915631897043329025': '22107辅回撤通道自动风门1',
-  //                 '1915631895088783362': '22107辅回撤通道自动风门2',
-  //               },
-  //               contents: [
-  //                 {
-  //                   label: '状态',
-  //                   value: '${readData.V}',
-  //                   color: 'blue',
-  //                 },
-  //               ],
-  //             },
-  //           ],
-  //         },
-  //       ],
-  //       chart: [],
-  //       table: [],
-  //       gallery: [],
-  //       list: [],
-  //       gallery_list: [],
-  //       preset: [],
-  //       to: '',
-  //     },
-  //     showStyle: {
-  //       size: 'width:470px;height:320px;',
-  //       version: '原版',
-  //       position: 'top:290px;left:0;',
-  //     },
-  //   },
-  //   {
-  //     deviceType: '',
-  //     moduleName: '综采工作面推进度',
-  //     pageType: 'balancePressHome',
-  //     moduleData: {
-  //       header: {
-  //         show: false,
-  //         readFrom: '',
-  //         selector: {
-  //           show: false,
-  //           value: '',
-  //         },
-  //         slot: {
-  //           show: false,
-  //           value: '',
-  //         },
-  //       },
-  //       background: {
-  //         show: false,
-  //         type: 'image',
-  //         link: '',
-  //       },
-  //       layout: {
-  //         direction: 'column',
-  //         items: [
-  //           {
-  //             name: 'list',
-  //             basis: '100%',
-  //           },
-  //         ],
-  //       },
-  //       complex_list: [],
-  //       chart: [],
-  //       table: [],
-  //       gallery: [],
-  //       list: [
-  //         {
-  //           type: 'K',
-  //           readFrom: '',
-  //           items: [
-  //             {
-  //               label: '进度',
-  //               value: '50%',
-  //               color: 'blue',
-  //             },
-  //             {
-  //               label: '埋深',
-  //               value: '2000km',
-  //               color: 'blue',
-  //             },
-  //           ],
-  //         },
-  //       ],
-  //       gallery_list: [],
-  //       preset: [],
-  //       to: '',
-  //     },
-  //     showStyle: {
-  //       size: 'width:470px;height:130px;',
-  //       version: '原版',
-  //       position: 'top:620px;left:0;',
-  //     },
-  //   },
-  //   {
-  //     deviceType: '',
-  //     moduleName: '重点监控传感器',
-  //     pageType: 'balancePressHome',
-  //     moduleData: {
-  //       header: {
-  //         show: false,
-  //         readFrom: '',
-  //         selector: {
-  //           show: false,
-  //           value: '',
-  //         },
-  //         slot: {
-  //           show: false,
-  //           value: '',
-  //         },
-  //       },
-  //       background: {
-  //         show: false,
-  //         type: 'image',
-  //         link: '',
-  //       },
-  //       layout: {
-  //         direction: 'column',
-  //         items: [
-  //           {
-  //             name: 'complex_list',
-  //             basis: '100%',
-  //           },
-  //         ],
-  //       },
-  //       complex_list: [
-  //         {
-  //           type: 'G',
-  //           readFrom: 'avgpressure_lowoxygen_normal.datalist',
-  //           mapFromData: true,
-  //           items: [
-  //             {
-  //               title: '${strinstallpos}',
-  //               contents: [
-  //                 {
-  //                   label: '网络状态',
-  //                   value: '${readData.netStatus_str}',
-  //                   color: 'blue',
-  //                 },
-  //               ],
-  //             },
-  //           ],
-  //         },
-  //       ],
-  //       chart: [],
-  //       table: [],
-  //       gallery: [],
-  //       list: [],
-  //       gallery_list: [],
-  //       preset: [],
-  //       to: '',
-  //     },
-  //     showStyle: {
-  //       size: 'width:470px;height:230px;',
-  //       version: '原版',
-  //       position: 'top:20px;right:0;',
-  //     },
-  //   },
-  //   {
-  //     deviceType: '',
-  //     moduleName: '辅助巡检传感器',
-  //     pageType: 'balancePressHome',
-  //     moduleData: {
-  //       header: {
-  //         show: false,
-  //         readFrom: '',
-  //         selector: {
-  //           show: false,
-  //           value: '',
-  //         },
-  //         slot: {
-  //           show: false,
-  //           value: '',
-  //         },
-  //       },
-  //       background: {
-  //         show: false,
-  //         type: 'image',
-  //         link: '',
-  //       },
-  //       layout: {
-  //         direction: 'column',
-  //         items: [
-  //           {
-  //             name: 'complex_list',
-  //             basis: '100%',
-  //           },
-  //         ],
-  //       },
-  //       complex_list: [
-  //         {
-  //           type: 'G',
-  //           readFrom: 'others.datalist',
-  //           mapFromData: true,
-  //           items: [
-  //             {
-  //               title: '${strinstallpos}',
-  //               contents: [
-  //                 {
-  //                   label: '网络状态',
-  //                   value: '${readData.netStatus_str}',
-  //                   color: 'blue',
-  //                 },
-  //               ],
-  //             },
-  //           ],
-  //         },
-  //       ],
-  //       chart: [],
-  //       table: [],
-  //       gallery: [],
-  //       list: [],
-  //       gallery_list: [],
-  //       preset: [],
-  //       to: '',
-  //     },
-  //     showStyle: {
-  //       size: 'width:470px;height:230px;',
-  //       version: '原版',
-  //       position: 'top:260px;right:0;',
-  //     },
-  //   },
-  //   {
-  //     deviceType: '',
-  //     moduleName: '地面大气压',
-  //     pageType: 'balancePressHome',
-  //     moduleData: {
-  //       header: {
-  //         show: false,
-  //         readFrom: '',
-  //         selector: {
-  //           show: false,
-  //           value: '',
-  //         },
-  //         slot: {
-  //           show: false,
-  //           value: '',
-  //         },
-  //       },
-  //       background: {
-  //         show: false,
-  //         type: 'image',
-  //         link: '',
-  //       },
-  //       layout: {
-  //         direction: 'column',
-  //         items: [
-  //           {
-  //             name: 'chart',
-  //             basis: '100%',
-  //           },
-  //         ],
-  //       },
-  //       complex_list: [],
-  //       chart: [
-  //         {
-  //           type: 'line_smooth',
-  //           readFrom: 'surface_history.datalist',
-  //           legend: { show: true },
-  //           xAxis: [{ show: true }],
-  //           yAxis: [
-  //             { show: true, name: '压力1(Pa)', position: 'left' },
-  //             { show: true, name: '压力2(Pa)', position: 'right' },
-  //           ],
-  //           series: [
-  //             { readFrom: '', xprop: 'time', yprop: 'pressure1', label: '压力1' },
-  //             // { readFrom: 'datalist', xprop: 'strinstallpos', yprop: 'readData.va', label: '风速' },
-  //           ],
-  //         },
-  //       ],
-  //       table: [],
-  //       gallery: [],
-  //       list: [],
-  //       gallery_list: [],
-  //       preset: [],
-  //       to: '',
-  //     },
-  //     showStyle: {
-  //       size: 'width:470px;height:250px;',
-  //       version: '原版',
-  //       position: 'top:500px;right:0;',
-  //     },
-  //   },
-  // ]);
+// const configs = ref<Config[]>([
+//   {
+//     deviceType: 'fanlocal',
+//     moduleName: '局部风机',
+//     pageType: 'balancePressHome',
+//     moduleData: {
+//       header: {
+//         show: true,
+//         readFrom: 'datalist',
+//         selector: {
+//           show: true,
+//           value: '${deviceID}',
+//           trans: {
+//             '1910221332833665026': '主机',
+//             '1910221283626090497': '备机',
+//           },
+//         },
+//         slot: {
+//           show: false,
+//           value: '',
+//         },
+//       },
+//       background: {
+//         show: false,
+//         type: 'image',
+//         link: '',
+//       },
+//       layout: {
+//         direction: 'column',
+//         items: [
+//           {
+//             name: 'tabs',
+//             basis: '100%',
+//           },
+//         ],
+//       },
+//       complex_list: [],
+//       chart: [],
+//       table: [],
+//       gallery: [],
+//       list: [],
+//       tabs: [
+//         {
+//           type: 'K',
+//           readFrom: '',
+//           mapFromData: false,
+//           items: [
+//             {
+//               title: '电机1',
+//               contents: [
+//                 {
+//                   label: '输出功率',
+//                   value: '${readData.Fan1StartStatus}',
+//                   color: 'blue',
+//                 },
+//                 {
+//                   label: '输出电压',
+//                   value: '${readData.Fan1StartStatus}',
+//                   color: 'blue',
+//                 },
+//               ],
+//             },
+//             {
+//               title: '电机2',
+//               contents: [
+//                 {
+//                   label: '输出功率',
+//                   value: '${readData.Fan2StartStatus}',
+//                   color: 'blue',
+//                 },
+//                 {
+//                   label: '输出电压',
+//                   value: '${readData.Fan2StartStatus}',
+//                   color: 'blue',
+//                 },
+//                 {
+//                   label: '输出电压',
+//                   value: '${readData.Fan2StartStatus}',
+//                   color: 'blue',
+//                 },
+//                 {
+//                   label: '输出电压',
+//                   value: '${readData.Fan2StartStatus}',
+//                   color: 'blue',
+//                 },
+//               ],
+//             },
+//           ],
+//         },
+//       ],
+//       gallery_list: [],
+//       preset: [],
+//       to: '',
+//     },
+//     showStyle: {
+//       size: 'width:470px;height:260px;',
+//       version: '原版',
+//       position: 'top:20px;left:0;',
+//     },
+//   },
+//   {
+//     deviceType: '',
+//     moduleName: '风门',
+//     pageType: 'balancePressHome',
+//     moduleData: {
+//       header: {
+//         show: false,
+//         readFrom: '',
+//         selector: {
+//           show: false,
+//           value: '',
+//         },
+//         slot: {
+//           show: false,
+//           value: '',
+//         },
+//       },
+//       background: {
+//         show: false,
+//         type: 'image',
+//         link: '',
+//       },
+//       layout: {
+//         direction: 'column',
+//         items: [
+//           {
+//             name: 'complex_list',
+//             basis: '100%',
+//           },
+//         ],
+//       },
+//       complex_list: [
+//         {
+//           type: 'G',
+//           readFrom: 'gate.datalist',
+//           mapFromData: true,
+//           items: [
+//             {
+//               title: '${deviceID}',
+//               trans: {
+//                 '1915631893453004802': '22107胶运顺槽入口自动风门2',
+//                 '1915631893478170626': '22107胶运顺槽入口自动风门1',
+//                 '1915631897043329025': '22107辅回撤通道自动风门1',
+//                 '1915631895088783362': '22107辅回撤通道自动风门2',
+//               },
+//               contents: [
+//                 {
+//                   label: '状态',
+//                   value: '${readData.V}',
+//                   color: 'blue',
+//                 },
+//               ],
+//             },
+//           ],
+//         },
+//       ],
+//       chart: [],
+//       table: [],
+//       gallery: [],
+//       list: [],
+//       gallery_list: [],
+//       preset: [],
+//       to: '',
+//     },
+//     showStyle: {
+//       size: 'width:470px;height:320px;',
+//       version: '原版',
+//       position: 'top:290px;left:0;',
+//     },
+//   },
+//   {
+//     deviceType: '',
+//     moduleName: '综采工作面推进度',
+//     pageType: 'balancePressHome',
+//     moduleData: {
+//       header: {
+//         show: false,
+//         readFrom: '',
+//         selector: {
+//           show: false,
+//           value: '',
+//         },
+//         slot: {
+//           show: false,
+//           value: '',
+//         },
+//       },
+//       background: {
+//         show: false,
+//         type: 'image',
+//         link: '',
+//       },
+//       layout: {
+//         direction: 'column',
+//         items: [
+//           {
+//             name: 'list',
+//             basis: '100%',
+//           },
+//         ],
+//       },
+//       complex_list: [],
+//       chart: [],
+//       table: [],
+//       gallery: [],
+//       list: [
+//         {
+//           type: 'K',
+//           readFrom: '',
+//           items: [
+//             {
+//               label: '进度',
+//               value: '50%',
+//               color: 'blue',
+//             },
+//             {
+//               label: '埋深',
+//               value: '2000km',
+//               color: 'blue',
+//             },
+//           ],
+//         },
+//       ],
+//       gallery_list: [],
+//       preset: [],
+//       to: '',
+//     },
+//     showStyle: {
+//       size: 'width:470px;height:130px;',
+//       version: '原版',
+//       position: 'top:620px;left:0;',
+//     },
+//   },
+//   {
+//     deviceType: '',
+//     moduleName: '重点监控传感器',
+//     pageType: 'balancePressHome',
+//     moduleData: {
+//       header: {
+//         show: false,
+//         readFrom: '',
+//         selector: {
+//           show: false,
+//           value: '',
+//         },
+//         slot: {
+//           show: false,
+//           value: '',
+//         },
+//       },
+//       background: {
+//         show: false,
+//         type: 'image',
+//         link: '',
+//       },
+//       layout: {
+//         direction: 'column',
+//         items: [
+//           {
+//             name: 'complex_list',
+//             basis: '100%',
+//           },
+//         ],
+//       },
+//       complex_list: [
+//         {
+//           type: 'G',
+//           readFrom: 'avgpressure_lowoxygen_normal.datalist',
+//           mapFromData: true,
+//           items: [
+//             {
+//               title: '${strinstallpos}',
+//               contents: [
+//                 {
+//                   label: '网络状态',
+//                   value: '${readData.netStatus_str}',
+//                   color: 'blue',
+//                 },
+//               ],
+//             },
+//           ],
+//         },
+//       ],
+//       chart: [],
+//       table: [],
+//       gallery: [],
+//       list: [],
+//       gallery_list: [],
+//       preset: [],
+//       to: '',
+//     },
+//     showStyle: {
+//       size: 'width:470px;height:230px;',
+//       version: '原版',
+//       position: 'top:20px;right:0;',
+//     },
+//   },
+//   {
+//     deviceType: '',
+//     moduleName: '辅助巡检传感器',
+//     pageType: 'balancePressHome',
+//     moduleData: {
+//       header: {
+//         show: false,
+//         readFrom: '',
+//         selector: {
+//           show: false,
+//           value: '',
+//         },
+//         slot: {
+//           show: false,
+//           value: '',
+//         },
+//       },
+//       background: {
+//         show: false,
+//         type: 'image',
+//         link: '',
+//       },
+//       layout: {
+//         direction: 'column',
+//         items: [
+//           {
+//             name: 'complex_list',
+//             basis: '100%',
+//           },
+//         ],
+//       },
+//       complex_list: [
+//         {
+//           type: 'G',
+//           readFrom: 'others.datalist',
+//           mapFromData: true,
+//           items: [
+//             {
+//               title: '${strinstallpos}',
+//               contents: [
+//                 {
+//                   label: '网络状态',
+//                   value: '${readData.netStatus_str}',
+//                   color: 'blue',
+//                 },
+//               ],
+//             },
+//           ],
+//         },
+//       ],
+//       chart: [],
+//       table: [],
+//       gallery: [],
+//       list: [],
+//       gallery_list: [],
+//       preset: [],
+//       to: '',
+//     },
+//     showStyle: {
+//       size: 'width:470px;height:230px;',
+//       version: '原版',
+//       position: 'top:260px;right:0;',
+//     },
+//   },
+//   {
+//     deviceType: '',
+//     moduleName: '地面大气压',
+//     pageType: 'balancePressHome',
+//     moduleData: {
+//       header: {
+//         show: false,
+//         readFrom: '',
+//         selector: {
+//           show: false,
+//           value: '',
+//         },
+//         slot: {
+//           show: false,
+//           value: '',
+//         },
+//       },
+//       background: {
+//         show: false,
+//         type: 'image',
+//         link: '',
+//       },
+//       layout: {
+//         direction: 'column',
+//         items: [
+//           {
+//             name: 'chart',
+//             basis: '100%',
+//           },
+//         ],
+//       },
+//       complex_list: [],
+//       chart: [
+//         {
+//           type: 'line_smooth',
+//           readFrom: 'surface_history.datalist',
+//           legend: { show: true },
+//           xAxis: [{ show: true }],
+//           yAxis: [
+//             { show: true, name: '压力1(Pa)', position: 'left' },
+//             { show: true, name: '压力2(Pa)', position: 'right' },
+//           ],
+//           series: [
+//             { readFrom: '', xprop: 'time', yprop: 'pressure1', label: '压力1' },
+//             // { readFrom: 'datalist', xprop: 'strinstallpos', yprop: 'readData.va', label: '风速' },
+//           ],
+//         },
+//       ],
+//       table: [],
+//       gallery: [],
+//       list: [],
+//       gallery_list: [],
+//       preset: [],
+//       to: '',
+//     },
+//     showStyle: {
+//       size: 'width:470px;height:250px;',
+//       version: '原版',
+//       position: 'top:500px;right:0;',
+//     },
+//   },
+// ]);
 
-  const { configs, fetchConfigs } = useInitConfigs();
+async function getO2Press(params) {
+  console.log(params[0]?.deviceID, 'ID数据');
+  const deviceID = params[0]?.deviceID;
+  const param = {
+    deviceId: deviceID,
+  };
+  const res = await getO2PressData(param);
+  const chartData = [...res?.o2HistoryDataList, ...res?.o2List];
+  mockData.value = { chartData };
+  O2PressDataFetched.value = true;
+}
+const { configs, fetchConfigs } = useInitConfigs();
 
-  onMounted(async () => {
-    // getMonitor()
-    fetchConfigs('balancePressHome');
-    loading.value = true;
-    // mountedThree().then(async () => {
-    //   await setModelType('balancePressTun'); //balancePressBase
-    //   loading.value = false;
-    //   timer = null;
-    //   await getMonitor(true);
-    //   play('startSmoke', 'top', 30, 'open', 0);
-    // });
-    timer = null;
-    await getMonitor(true);
-    loading.value = false;
-  });
+onMounted(async () => {
+  // getMonitor()
+  fetchConfigs('balancePressHome');
+  loading.value = true;
+  // mountedThree().then(async () => {
+  //   await setModelType('balancePressTun'); //balancePressBase
+  //   loading.value = false;
+  //   timer = null;
+  //   await getMonitor(true);
+  //   play('startSmoke', 'top', 30, 'open', 0);
+  // });
+  timer = null;
+  await getMonitor(true);
+  loading.value = false;
+});
 
-  onUnmounted(() => {
-    destroy();
-    if (timer) {
-      clearTimeout(timer);
-    }
-  });
+onUnmounted(() => {
+  destroy();
+  if (timer) {
+    clearTimeout(timer);
+  }
+});
 </script>
 <style lang="less" scoped>
-  @import '/@/design/vent/modal.less';
-  @import '../../comment/less/workFace.less';
-  @ventSpace: zxm;
-  .monitor-container {
-    margin-top: 60px;
-  }
+@import '/@/design/vent/modal.less';
+@import '../../comment/less/workFace.less';
+@ventSpace: zxm;
+.monitor-container {
+  margin-top: 60px;
+}
+.lr {
+  width: 340px !important;
+}
+.fix-box {
+  margin-right: 19% !important;
+  margin-top: 1% !important;
+}
 </style>