Merge branch 'master' of http://47.94.222.6:3003/lizuo/VentSystem_2.0_front

.env.production

@@ -14,9 +14,9 @@ VITE_BUILD_COMPRESS = 'gzip'
 
 # 使用压缩时是否删除原始文件，默认为false
 VITE_BUILD_COMPRESS_DELETE_ORIGIN_FILE = false
-#VITE_PROXY = [["/jeecgsystem","http://47.94.222.6:9999"],["/upload","http://localhost:3300/upload"]]
+VITE_PROXY = [["/jeecgsystem","http://47.94.222.6:9999"],["/upload","http://localhost:3300/upload"]]
 #VITE_PROXY = [["/jeecgsystem","http://192.168.1.4:9999"],["/upload","http://localhost:3300/upload"]]
-VITE_PROXY = [["/jeecgsystem","http://192.168.0.79:9999"],["/upload","http://localhost:3300/upload"]]
+#VITE_PROXY = [["/jeecgsystem","http://192.168.0.79:9999"],["/upload","http://localhost:3300/upload"]]
 #VITE_PROXY = [["/jeecgsystem","http://42.194.132.36:8099"],["/upload","http://localhost:3300/upload"]]
 #VITE_PROXY = [["/jeecgsystem","http://192.168.0.30:8086"],["/upload","http://localhost:3300/upload"]]
 #VITE_PROXY = [["/jeecgsystem","http://127.0.0.1:9999"],["/upload","http://localhost:3300/upload"]]
@@ -26,9 +26,9 @@ VITE_GLOB_API_URL=/jeecgsystem
 
 #后台接口全路径地址(必填)
 #VITE_GLOB_DOMAIN_URL=http://jeecg-boot-system:8080/jeecg-boot
-#VITE_GLOB_DOMAIN_URL=http://47.94.222.6:9999
+VITE_GLOB_DOMAIN_URL=http://47.94.222.6:9999
 #VITE_GLOB_DOMAIN_URL=http://192.168.1.4:9999
-VITE_GLOB_DOMAIN_URL=http://192.168.0.79:9999
+#VITE_GLOB_DOMAIN_URL=http://192.168.0.79:9999
 #VITE_GLOB_DOMAIN_URL=http://127.0.0.1:9999
 #VITE_GLOB_DOMAIN_URL=http://42.194.132.36:8099
 #采育服务器
@@ -48,7 +48,7 @@ VITE_USE_PWA = false
 VITE_LEGACY = false
 
 #微前端qiankun应用,命名必须以VITE_APP_SUB_开头,jeecg-app-1为子应用的项目名称,也是子应用的路由父路径
-#VITE_APP_SUB_APP = [["micro-need-air", "//47.94.222.6:7123/"], ["micro-vent-3dModal", "//47.94.222.6:7121/"],["micro-fire-front", "//47.94.222.6:7124/"]]
+VITE_APP_SUB_APP = [["micro-need-air", "//47.94.222.6:7123/"], ["micro-vent-3dModal", "//47.94.222.6:7121/"],["micro-fire-front", "//47.94.222.6:7124/"]]
 #VITE_APP_SUB_APP = [["micro-vent-3dModal", "//192.168.0.79:7121/"]]
 #VITE_APP_SUB_APP = [["micro-need-air", "//127.0.0.1:20000/"], ["micro-vent-3dModal", "//127.0.0.1:30000/"], ["micro-fire-front", "//127.0.0.1:40000/"]]
-VITE_APP_SUB_APP = [["micro-need-air", "//127.0.0.1:7123/"], ["micro-vent-3dModal", "//127.0.0.1:7121/"]]
+#VITE_APP_SUB_APP = [["micro-need-air", "//127.0.0.1:7123/"], ["micro-vent-3dModal", "//127.0.0.1:7121/"]]

src/App.vue

@@ -9,17 +9,18 @@
 </template>
 
 <script lang="ts" setup>
-  import { ref } from 'vue';
+  import { ref, watch } from 'vue';
   import { ConfigProvider } from 'ant-design-vue';
   import { AppProvider } from '/@/components/Application';
   import { useTitle } from '/@/hooks/web/useTitle';
   import { useLocale } from '/@/locales/useLocale';
   import AdaptiveContainer from '/@/components/Container/src/Adaptive.vue';
+  import { useAppStore } from '/@/store/modules/app';
 
   // 解决日期时间国际化问题
   import 'dayjs/locale/zh-cn';
 
-
+  const appStore = useAppStore();
   // support Multi-language
   const { getAntdLocale } = useLocale();
   const width = ref(1920);
@@ -30,6 +31,14 @@
     height.value = 1080;
   }
 
+  watch([()=> appStore.getWidthScale, () => appStore.getHeightScale], () => {
+    const popoverDomList = document.getElementsByClassName('zxm-popover')
+    Array.prototype.map.call(popoverDomList, dom => {
+      console.log('弹窗节点------>',dom,);
+      
+    })
+  })
+
   useTitle();
 </script>
 <style lang="less" scoped>

src/assets/icons/alarm-warning.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="95.859" height="95.946" viewBox="0 0 95.859 95.946">
+  <path id="路径_55451" data-name="路径 55451" d="M79.592,91.7a5.946,5.946,0,0,0-3.036-1.63,1.484,1.484,0,0,1-1.209-1.452V54.176a26.985,26.985,0,1,0-53.969-.206V88.619a1.484,1.484,0,0,1-1.209,1.452,6,6,0,0,0-4.788,5.875H81.344A6.015,6.015,0,0,0,79.592,91.7ZM53.544,43.475,51.726,59.713h7.13L43.191,82.453l1.818-16.238h-7.14ZM48.363,19.489a3,3,0,0,1-3-3V3a3,3,0,1,1,6,0V16.491A3,3,0,0,1,48.363,19.489ZM26.625,27.744a3,3,0,0,1-4.095-1.1L15.784,14.963a3,3,0,1,1,5.191-3l6.746,11.684A3,3,0,0,1,26.625,27.744Zm43.475,0a3,3,0,0,0,4.095-1.1l6.746-11.684a3,3,0,1,0-5.191-3L69,23.649A3,3,0,0,0,70.1,27.744ZM19.363,41.686A2.993,2.993,0,0,1,15.691,43.8L2.657,40.318A3,3,0,1,1,4.2,34.527l13.033,3.495A2.992,2.992,0,0,1,19.363,41.686Zm58,0A2.993,2.993,0,0,0,81.035,43.8l13.033-3.495a3,3,0,0,0-1.555-5.79L79.479,38.013A3.008,3.008,0,0,0,77.362,41.686Z" transform="translate(-0.43)" fill="#fff"/>
+</svg>

src/assets/icons/ch2val.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="158" height="104" viewBox="0 0 158 104">
+  <text id="C_H_" data-name="C₂H₄" transform="translate(0 84)" fill="#fff" font-size="78" font-family="Kingsoft_Cloud_Font"><tspan x="0" y="0">C</tspan><tspan y="0" font-family="SegoeUI-Bold, Segoe UI" font-weight="700">₂</tspan><tspan y="0">H</tspan><tspan y="0" font-family="SegoeUI-Bold, Segoe UI" font-weight="700">₄</tspan></text>
+</svg>

src/assets/icons/chval.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="157" height="104" viewBox="0 0 157 104">
+  <text id="C_H_" data-name="C₂H₂" transform="translate(0 84)" fill="#fff" font-size="78" font-family="Kingsoft_Cloud_Font"><tspan x="0" y="0">C</tspan><tspan y="0" font-family="SegoeUI-Bold, Segoe UI" font-weight="700">₂</tspan><tspan y="0">H</tspan><tspan y="0" font-family="SegoeUI-Bold, Segoe UI" font-weight="700">₂</tspan></text>
+</svg>

src/assets/icons/co2val.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="127" height="104" viewBox="0 0 127 104">
+  <text id="CO_" data-name="CO₂" transform="translate(0 84)" fill="#fff" font-size="78" font-family="Kingsoft_Cloud_Font"><tspan x="0" y="0">CO</tspan><tspan y="0" font-family="SegoeUI-Bold, Segoe UI" font-weight="700">₂</tspan></text>
+</svg>

src/assets/icons/coval.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="96" height="78" viewBox="0 0 96 78">
+  <text id="CO" transform="translate(0 62)" fill="#fff" font-size="78" font-family="Kingsoft_Cloud_Font"><tspan x="0" y="0">CO</tspan></text>
+</svg>

src/assets/icons/gasval.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="127" height="104" viewBox="0 0 127 104">
+  <text id="CH_" data-name="CH₄" transform="translate(0 84)" fill="#fff" font-size="78" font-family="Kingsoft_Cloud_Font"><tspan x="0" y="0">CH</tspan><tspan y="0" font-family="SegoeUI-Bold, Segoe UI" font-weight="700">₄</tspan></text>
+</svg>

src/assets/icons/link.svg

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="82.862" height="101.264" viewBox="0 0 82.862 101.264">
+  <g id="组_13471" data-name="组 13471" transform="translate(-200.867 -201.069) rotate(30)">
+    <path id="路径_55452" data-name="路径 55452" d="M356.783,72.866a21.128,21.128,0,1,0-42.191,0V86.43a24.389,24.389,0,0,1,9.782-9.521V72.866a11.347,11.347,0,1,1,22.628,0V93.342a11.347,11.347,0,0,1-11.347,11.347,11.216,11.216,0,0,1-7.108-2.608v11.086a20.737,20.737,0,0,0,7.108,1.3,21.128,21.128,0,0,0,21.128-21.128Z" transform="translate(0 0)" fill="#fff"/>
+    <path id="路径_55453" data-name="路径 55453" d="M347,350.391v6a11.347,11.347,0,1,1-22.628,0v-22.3a11.347,11.347,0,0,1,11.282-11.347,11.216,11.216,0,0,1,4.369.913,11.476,11.476,0,0,1,2.739,1.7V314.264a20.867,20.867,0,0,0-7.108-1.3,21.128,21.128,0,0,0-21.063,21.128v22.367a21.128,21.128,0,1,0,42.191,0V341a24.324,24.324,0,0,1-9.782,9.39Z" transform="translate(0 -235.66)" fill="#fff"/>
+  </g>
+</svg>

src/assets/icons/o2val.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="80" height="104" viewBox="0 0 80 104">
+  <text id="O_" data-name="O₂" transform="translate(0 84)" fill="#fff" font-size="78" font-family="Kingsoft_Cloud_Font"><tspan x="0" y="0">O</tspan><tspan y="0" font-family="SegoeUI-Bold, Segoe UI" font-weight="700">₂</tspan></text>
+</svg>

src/components/chart/BarAndLine.vue

@@ -94,8 +94,6 @@
       });
 
       function initChartsOption() {
-        debugger
-
         optionUtil = new EchartsUtil(Object.assign(option, props.option));
         optionUtil.initChartOption(props.chartsType, chartsColumns);
       }

src/design/public.less

@@ -9,7 +9,7 @@
 // =================================
 
 ::-webkit-scrollbar {
-  width: 7px;
+  width: 4px;
   height: 8px;
 }
 

src/design/vent/modal.less

@@ -420,10 +420,13 @@
         height: 240px;
         color: #fff;
       }
-      .@{ventSpace}-tabs-content,
-      .vent-table {
-        height: calc(100% - 10px);
-      }
+      // .@{ventSpace}-tabs-content,
+      // .vent-table {
+      //   height: calc(100% - 10px);
+      // }
+      // .@{ventSpace}-tabs-content{
+      //   height: calc(100% - 10px);
+      // }
       .@{ventSpace}-tabs-top > .@{ventSpace}-tabs-nav {
         margin: 0 !important;
       }
@@ -431,7 +434,6 @@
         padding: 0 !important;
       }
       .vent-table {
-        overflow-y: auto;
         .@{ventSpace}-table-column-title,
         .@{ventSpace}-table-thead > tr > th {
           color: #84f2ff !important;

src/utils/event/index.ts

@@ -40,3 +40,35 @@ export function triggerWindowResize() {
   (event as any).eventType = 'message';
   window.dispatchEvent(event);
 }
+
+export function setDivHeight(e: MouseEvent, minHeight, scroll) {
+  e.preventDefault();
+  const divObject = e.currentTarget as HTMLElement;
+  if (divObject) {
+    const divHeight = divObject.offsetHeight;
+    let height = divHeight;
+    const startY = e.clientY;
+    document.onmousemove = function (res) {
+      res.preventDefault();
+      const distY = Math.abs(res.clientY - startY);
+      if (res.clientY > startY) {
+        if (divHeight - distY >= minHeight) {
+          height = divHeight - distY;
+        } else {
+          height = minHeight;
+        }
+      }
+      if (res.clientY < startY) {
+        height = divHeight + distY;
+      }
+      divObject.style.height = height + 'px';
+    };
+    document.onmouseup = function () {
+      document.onmousemove = null;
+      if (scroll.y != height - 100) {
+        scroll.y = height - 100;
+      }
+      console.log('scroll.y-------------->', scroll.y);
+    };
+  }
+}

src/views/system/dict/index.vue

@@ -27,7 +27,16 @@
       </template>
       <!--操作栏-->
       <template #action="{ record }">
-        <TableAction :actions="getTableAction(record)" />
+        <!-- <TableAction :actions="getTableAction(record)" /> -->
+        <a class="table-action-link" @click="handleEdit(record)">编辑</a>
+        <a class="table-action-link" @click="handleItem(record)">字典配置</a>
+        <a-popconfirm
+          title="确定删除?"
+          @confirm="handleDelete(record)"
+          style="display: inline-block"
+        >
+          <a class="table-action-link">删除</a>
+        </a-popconfirm>
       </template>
     </BasicTable>
   </div>
@@ -75,7 +84,7 @@
         schemas: searchFormSchema,
       },
       actionColumn: {
-        width: 240,
+        width: 280,
       },
     },
     //update-begin---author:wangshuai ---date:20220616  for：[issues/I5AMDD]导入/导出功能，操作后提示没有传递 export.url/import.url 参数------------
@@ -175,13 +184,13 @@
         label: '字典配置',
         onClick: handleItem.bind(null, record),
       },
-      {
-        label: '删除',
-        popConfirm: {
-          title: '确定删除吗?',
-          confirm: handleDelete.bind(null, record),
-        },
-      },
+      // {
+      //   label: '删除',
+      //   popConfirm: {
+      //     title: '确定删除吗?',
+      //     confirm: handleDelete.bind(null, record),
+      //   },
+      // },
     ];
   }
 </script>

src/views/vent/comment/EditRowTable.vue

@@ -180,7 +180,39 @@
 </script>
 <style scoped lang="less">
   @ventSpace: zxm;
+  @vent-table-no-hover: #00bfff10;
+  
   :deep(.@{ventSpace}-table-body) {
     height: auto !important;
   }
+
+  :deep(.@{ventSpace}-table-cell-row-hover) {
+    background: #264d8833 !important;
+  }
+  :deep(.@{ventSpace}-table-row-selected) {
+    background: #268bc522 !important;
+  }
+
+  :deep(.@{ventSpace}-table-tbody > tr > td) {
+    background-color: #0dc3ff05;
+  }
+  :deep(.jeecg-basic-table-row__striped) {
+    td {
+      background-color: @vent-table-no-hover !important;
+    }
+  }
+  :deep(.@{ventSpace}-select-dropdown) {
+    .@{ventSpace}-select-item {
+      color: #fff !important;
+    }
+
+    .@{ventSpace}-select-item-option-selected,
+    .@{ventSpace}-select-item-option-active {
+      background-color: #00678b66 !important;
+    }
+
+    .@{ventSpace}-select-item:hover {
+      background-color: #008fc366 !important;
+    }
+  }
 </style>

src/views/vent/comment/components/bottomMenu.vue

@@ -1,7 +1,6 @@
 <template>
   <div class="bottom-btn-group">
-    <div v-for="item in navList" :key="item.pathName" class="vent-row-center btn-item" @click="setBtn('click', item)"
-      @mouseenter="setBtn('over', item)" @mouseleave="setBtn('leave', item)">
+    <div v-for="item in navList" :key="item.pathName" class="vent-row-center btn-item" @click="setBtn('click', item)">
       <dv-decoration11
         :color="isBtnActive === item.pathName ? activeColors : item.isHover ? activeColors : noActiveColors"
         style="width:200px;height:60px;">

src/views/vent/deviceManager/comment/NormalTable.vue

@@ -264,9 +264,8 @@
 
 <style scoped lang="less">
   @ventSpace: zxm;
- 
-
   @vent-table-no-hover: #00bfff10;
+
   :deep(.@{ventSpace}-table-cell-row-hover) {
     background: #264d8833 !important;
   }
@@ -282,4 +281,18 @@
       background-color: @vent-table-no-hover !important;
     }
   }
+  :deep(.@{ventSpace}-select-dropdown) {
+    .@{ventSpace}-select-item {
+      color: #fff !important;
+    }
+
+    .@{ventSpace}-select-item-option-selected,
+    .@{ventSpace}-select-item-option-active {
+      background-color: #00678b66 !important;
+    }
+
+    .@{ventSpace}-select-item:hover {
+      background-color: #008fc366 !important;
+    }
+  }
 </style>

src/views/vent/monitorManager/comment/GroupMonitorTable.vue

@@ -1,8 +1,8 @@
 <template>
   <div class="vent-table">
     <a-radio-group v-model:value="selectRowIndex" @change="setSelectedRowKeys" style="width: 100%">
-      <a-table :columns="columns" :pagination="false" :data-source="dataTableSource" bordered style="margin-top: 5px">
-        <template #bodyCell="{ column, record, index }">
+      <a-table :columns="columns" :pagination="false" :data-source="dataTableSource" bordered style="margin-top: 5px" :scroll="scroll">
+        <template #bodyCell="{ column, record }">
           <template v-if="column.dataIndex === 'isCheck'">
             <a-radio :value="record.deviceID" />
           </template>
@@ -20,7 +20,7 @@
 
 <script lang="ts" setup>
   //ts语法
-  import { defineExpose, toRaw, watch, ref, onMounted, onUnmounted } from 'vue';
+  import { toRaw, watch, ref, onMounted, onUnmounted } from 'vue';
   import { getTableHeaderColumns } from '/@/hooks/web/useWebColumns';
   const props = defineProps({
     columnsType: {
@@ -40,6 +40,10 @@
     title: {
       type: String,
     },
+    scroll: {
+      type: Object,
+      default: () => null
+    },
   });
 
   const emits = defineEmits(['selectRow']);

src/views/vent/monitorManager/comment/HandlerHistoryTable.vue

@@ -84,6 +84,15 @@
       formConfig: {
         labelAlign: 'left',
         showAdvancedButton: false,
+        baseColProps: {
+          // offset: 0.5,
+          xs: 24,
+          sm: 24,
+          md: 24,
+          lg: 9,
+          xl: 7,
+          xxl: 4,
+        },
         schemas: [
           {
             label: '时间范围',

src/views/vent/monitorManager/comment/HistoryTable.vue

@@ -207,6 +207,26 @@
   .history-table {
     width: 100%;
     :deep(.jeecg-basic-table-form-container) {
+      .@{ventSpace}-form {
+        padding: 0 !important;
+        border: none !important;
+        margin-bottom: 0 !important;
+        .@{ventSpace}-picker,
+        .@{ventSpace}-select-selector {
+          width: 100% !important;
+          height: 100%;
+          background: #00000017;
+          border: 1px solid #b7b7b7;
+          input,
+          .@{ventSpace}-select-selection-item,
+          .@{ventSpace}-picker-suffix {
+            color: #fff;
+          }
+          .@{ventSpace}-select-selection-placeholder {
+            color: #ffffffaa;
+          }
+        }
+      }
       .@{ventSpace}-table-title {
         min-height: 0 !important;
       }

src/views/vent/monitorManager/compressor/components/nitrogenHome.vue

@@ -284,7 +284,6 @@ onUnmounted(() => {
   display: flex;
   justify-content: center;
 }
-
 #nitrogenCss3D {
   .modal-monitor {
     width: 200px;
@@ -299,7 +298,6 @@ onUnmounted(() => {
   }
 
 }
-
 .nitrogen-home {
   width: 100%;
   height: 100%;
@@ -559,109 +557,105 @@ onUnmounted(() => {
   }
   
 }
-  
 
-  &:deep(.main) {
-    .title {
-      height: 34px;
-      text-align: center;
-      font-weight: 600;
-      color: #7AF5FF;
-      // background-image: url('../../../assets/img/yfj/light.png');
-      background-repeat: no-repeat;
-      background-position-x: center;
-      background-position-y: 100%;
-      background-size: 80%;
-      font-size: 16px;
-    }
+&:deep(.main) {
+  .title {
+    height: 34px;
+    text-align: center;
+    font-weight: 600;
+    color: #7AF5FF;
+    // background-image: url('../../../assets/img/yfj/light.png');
+    background-repeat: no-repeat;
+    background-position-x: center;
+    background-position-y: 100%;
+    background-size: 80%;
+    font-size: 16px;
+  }
+  .monitor-item {
+    width: 200px;
+    display: flex;
+    flex-direction: row;
+    width: auto;
+    margin-bottom: 3px;
 
-    .monitor-item {
-      width: 200px;
+    .monitor-val {
+      color: #ffb700;
       display: flex;
-      flex-direction: row;
       width: auto;
-      margin-bottom: 3px;
-
-      .monitor-val {
-        color: #ffb700;
-        display: flex;
-        width: auto;
 
-        .val {
-          width: 80px;
-          font-size: 14px;
-        }
+      .val {
+        width: 80px;
+        font-size: 14px;
+      }
 
-        .unit {
-          color: #ffffffbb;
-          font-size: 14px;
+      .unit {
+        color: #ffffffbb;
+        font-size: 14px;
 
-        }
       }
     }
+  }
+  .monitor-title {
+    width: 100px;
+    color: #7AF5FF;
+    font-weight: 400;
+    font-size: 14px;
+  }
+  .signal-item {
+    display: flex;
+    justify-content: space-between;
 
-    .monitor-title {
-      width: 100px;
-      color: #7AF5FF;
-      font-weight: 400;
-      font-size: 14px;
-    }
-
-    .signal-item {
-      display: flex;
-      justify-content: space-between;
-
-      // margin-bottom: 5px;
-      .signal-round {
-        display: inline-block;
-        width: 8px;
-        height: 8px;
+    // margin-bottom: 5px;
+    .signal-round {
+      display: inline-block;
+      width: 8px;
+      height: 8px;
+      border-radius: 50%;
+      margin: 0 10px;
+      position: relative;
+
+      &::after {
+        display: block;
+        content: '';
+        position: absolute;
+        width: 12px;
+        height: 12px;
+        top: -2px;
+        left: -2px;
         border-radius: 50%;
-        margin: 0 10px;
-        position: relative;
-
-        &::after {
-          display: block;
-          content: '';
-          position: absolute;
-          width: 12px;
-          height: 12px;
-          top: -2px;
-          left: -2px;
-          border-radius: 50%;
-        }
       }
+    }
 
-      .signal-round-gry {
-        background-color: #858585;
+    .signal-round-gry {
+      background-color: #858585;
 
-        &::after {
-          background-color: #85858544;
-          box-shadow: 0 0 1px 1px #85858599;
-        }
+      &::after {
+        background-color: #85858544;
+        box-shadow: 0 0 1px 1px #85858599;
       }
+    }
 
-      .signal-round-run {
-        background-color: #67FC00;
+    .signal-round-run {
+      background-color: #67FC00;
 
-        &::after {
-          background-color: #67FC0044;
-          box-shadow: 0 0 1px 1px #c6ff77;
-        }
+      &::after {
+        background-color: #67FC0044;
+        box-shadow: 0 0 1px 1px #c6ff77;
       }
+    }
 
-      .signal-round-warning {
-        background-color: #E9170B;
+    .signal-round-warning {
+      background-color: #E9170B;
 
-        &::after {
-          background-color: #E9170B44;
-          box-shadow: 0 0 1px 1px #E9170B;
-        }
+      &::after {
+        background-color: #E9170B44;
+        box-shadow: 0 0 1px 1px #E9170B;
       }
     }
   }
-  :deep(.zxm-radio-wrapper){
-    color: #fff !important;
-  }
+}
+:deep(.zxm-radio-wrapper){
+  color: #fff !important;
+}
 
 </style>

src/views/vent/monitorManager/deviceMonitor/index.vue

@@ -29,18 +29,21 @@
             <div  class="location-item">
               <div class="item-title">{{ location.title }}&nbsp;:</div>
               <div>
-                <a-radio-group v-model:value="location.isVisible" :name="location.deviceType">
+                <a-radio-group v-model:value="location.Visible" :name="location.deviceType">
                   <a-radio :value="1">是</a-radio>
                   <a-radio :value="0">否</a-radio>
                 </a-radio-group>
               </div>
             </div>
           </template>
+          <div class="location-bottom-btn">
+            <span @click="setLocation">提交</span>
+          </div>
         </div>
       </div>
     </div>
    
-    <div class="bottom-tabs-box" @mousedown="setDivHeight" id="monitorBox">
+    <div class="bottom-tabs-box" @mousedown="setDivHeight($event, 250, scroll)" id="monitorBox">
       <div class="to-small" @click="toHome"></div>
       <div class="device-button-group" v-if="deviceList.length > 0">
         <div class="device-button" :class="{ 'device-active': deviceActive == device.deviceType }"
@@ -52,12 +55,12 @@
       </div>
       <a-tabs class="tabs-box" v-model:activeKey="activeKey" @change="tabChange">
         <a-tab-pane key="1" tab="实时监测">
-          <template v-if="deviceType == 'fan' && activeKey == '1'">
+          <template v-if="deviceType == 'fan' && activeKey == '1' && isRefresh">
             <GroupMonitorTable :dataSource="dataSource" :columnsType="`${deviceType}_monitor`" />
           </template>
-          <template v-else-if="activeKey == '1'">
+          <template v-else-if="activeKey == '1' && isRefresh">
             <MonitorTable ref="monitorTable" :columnsType="`${deviceType}_monitor`" :dataSource="dataSource"
-              design-scope="device_monitor" :isShowPagination="false" :isShowActionColumn="true" title="设备监测">
+              design-scope="device_monitor" :isShowPagination="false" :isShowActionColumn="true" title="设备监测" :scroll="scroll">
               <template #action="{ record }">
                 <TableAction :actions="[
                   {
@@ -70,30 +73,74 @@
                   },
                 ]" />
               </template>
+              <template #filterCell="{ column, record }">
+                <template v-if="deviceType.startsWith('gate')">
+                  <template v-if="record.frontGateOpenCtrl">
+                    <a-tag v-if="column.dataIndex === 'frontGateOpen' && record.frontGateOpen == 0 && record.frontGateClose == 0" color="red">正在打开</a-tag>
+                    <a-tag v-else-if="column.dataIndex === 'frontGateOpen'" color="processing">打开</a-tag>
+                  </template>
+                  <template v-else>
+                    <a-tag v-if="column.dataIndex === 'frontGateOpen' && record.frontGateOpen == 0 && record.frontGateClose == 0" color="red">正在关闭</a-tag>
+                    <a-tag v-else-if="column.dataIndex === 'frontGateOpen' && record.frontGateOpen == 0 && record.frontGateClose == 1" color="default">关闭</a-tag>
+                    <a-tag v-else-if="column.dataIndex === 'frontGateOpen' && record.frontGateOpen == 1 && record.frontGateClose == 0" color="default">打开</a-tag>
+                  </template>
+                  <template v-if="record.rearGateOpenCtrl">
+                    <a-tag v-if="column.dataIndex === 'rearGateOpen' && record.rearGateOpen == 0 && record.rearGateClose == 0" color="red">正在打开</a-tag>
+                    <a-tag v-else-if="column.dataIndex === 'rearGateOpen'" color="processing">打开</a-tag>
+                  </template>
+                  <template v-else>
+                    <a-tag v-if="column.dataIndex === 'rearGateOpen' && record.rearGateOpen == 0 && record.rearGateClose == 0" color="red">正在关闭</a-tag>
+                    <a-tag v-else-if="column.dataIndex === 'rearGateOpen' && record.rearGateOpen == 0 && record.rearGateClose == 1" color="default">关闭</a-tag>
+                    <a-tag v-else-if="column.dataIndex === 'rearGateOpen' && record.rearGateOpen == 1 && record.rearGateClose == 0" color="default">打开</a-tag>
+                  </template>
+                </template>
+                <template v-if="deviceType.startsWith('windrect')">
+                  <a-tag v-if="column.dataIndex === 'sign'" :color="record.sign == 0 ? '#95CF65' : record.sign == 1 ? '#4590EA' : '#9876AA'"> {{
+                    record.sign == 0 ? '高位' : record.sign == 1 ? '中位' : '低位'
+                  }}</a-tag>
+                  <template v-if="record && column && column.dataIndex === 'isRun' && record.isRun">
+                    <a-tag v-if="record.isRun == -2 || record.isRun == -1" :color="record.isRun == -2 ? '#95CF65' : '#ED5700'">{{
+                      record.isRun == -2 ? '空闲' : '等待'
+                    }}</a-tag>
+                    <a-tag v-else-if="record.isRun == 100" color="#4693FF">完成</a-tag>
+                    <Progress v-else :percent="Number(record.isRun)" size="small" status="active" />
+                  </template>
+                </template>
+                <a-tag v-if="column.dataIndex === 'warnFlag'" :color="record.warnFlag == 0 ? 'green' : record.warnFlag == 1 ? '#FF5812' : 'gray'"> {{
+                  record.warnFlag == 0 ? '正常' : record.warnFlag == 1 ? '报警' : record.warnFlag == 2 ? '断开' : '未监测'
+                }}</a-tag>
+                <a-tag v-if="column.dataIndex === 'netStatus'" :color="record.netStatus == 0 ? 'default' : 'green'">{{
+                  record.netStatus == 0 ? '断开' : '连接'
+                }}</a-tag>
+              </template>
             </MonitorTable>
           </template>
         </a-tab-pane>
         <a-tab-pane key="2" tab="历史数据">
           <div class="tab-item">
-            <HistoryTable ref="historyTable" v-if="activeKey == '2'" :sysId="systemID" :columns-type="`${deviceType}`"
+            <HistoryTable ref="historyTable" v-if="activeKey == '2' && isRefresh" :sysId="systemID" :columns-type="`${deviceType}`"
               :device-type="deviceType"
               :device-list-api="getDeviceList.bind(null, { strtype: deviceType, sysId: systemID })"
-              designScope="device-history" />
+              designScope="device-history"
+              :scroll="scroll"
+               />
           </div>
         </a-tab-pane>
         <a-tab-pane key="3" tab="报警历史">
           <div class="tab-item">
-            <AlarmHistoryTable ref="alarmHistoryTable" v-if="activeKey == '3'" :sysId="systemID" columns-type="alarm"
+            <AlarmHistoryTable ref="alarmHistoryTable" v-if="activeKey == '3' && isRefresh" :sysId="systemID" columns-type="alarm"
               :device-type="deviceType"
               :device-list-api="getDeviceList.bind(null, { strtype: deviceType, sysId: systemID })"
+              :scroll="scroll"
               designScope="alarm-history" />
           </div>
         </a-tab-pane>
         <a-tab-pane key="4" tab="操作历史">
           <div class="tab-item">
-            <HandlerHistoryTable ref="handlerHistoryTable" v-if="activeKey == '4'" :sysId="systemID"
+            <HandlerHistoryTable ref="handlerHistoryTable" v-if="activeKey == '4' && isRefresh" :sysId="systemID"
               columns-type="operatorhistory" :device-type="deviceType"
               :device-list-api="getDeviceList.bind(null, { strtype: deviceType, sysId: systemID })"
+              :scroll="scroll"
               designScope="operator-history" />
           </div>
         </a-tab-pane>
@@ -104,23 +151,23 @@
   </div>
 </template>
 <script setup lang="ts">
-import { ref, onMounted, onUnmounted, ComponentOptions, shallowRef, nextTick } from 'vue'
+import { ref, onMounted, onUnmounted, ComponentOptions, shallowRef, nextTick, watch, reactive } from 'vue'
 import { SendOutlined } from '@ant-design/icons-vue';
 import { list, getDeviceList, getDeviceTypeList } from './device.api'
-// import { locationList } from './device.data'
 import AlarmHistoryTable from '../comment/AlarmHistoryTable.vue';
 import HistoryTable from '../comment/HistoryTable.vue';
 import HandlerHistoryTable from '../comment/HandlerHistoryTable.vue';
 import MonitorTable from '../comment/MonitorTable.vue';
 import GroupMonitorTable from '../comment/GroupMonitorTable.vue';
-import { TreeProps, message } from 'ant-design-vue';
+import { TreeProps, message, Progress } from 'ant-design-vue';
 import { TableAction } from '/@/components/Table';
 import FiberModal from './modal/fiber.modal.vue';
+import BundleModal from './modal/bundle.modal.vue'
 import DustModal from './modal/dust.modal.vue'
 import { SvgIcon } from '/@/components/Icon';
 import { getActions } from '/@/qiankun/state';
 import { useRouter } from 'vue-router';
-import { initDictOptions } from '/@/utils/dict/index';
+import { setDivHeight } from '/@/utils/event';
 
 
 type DeviceType = { deviceType: string, deviceName: string, datalist: any[] };
@@ -142,13 +189,14 @@ const currentModal = shallowRef<Nullable<ComponentOptions>>(null); //模态框
 const modalVisible = ref<Boolean>(false); // 模态框是否可见
 
 //
-const drawerHeight = ref(240) // 监测框最小高度
+
+// const drawerHeight = ref(240) // 监测框最小高度
 const treeShow = ref(true) //是否显示树形菜单
 const locationSettingShow = ref(false) //是否显示树形菜单
 const treeNodeTitle = ref('') // 选中的树形标题
 
-const locationList = ref([])
-const deviceList = ref<DeviceType[]>([])
+const locationList = ref([]) //巷道定位图标显示列表
+const deviceList = ref<DeviceType[]>([]) //关联设备列表
 const deviceActive = ref('')
 const activeKey = ref('1'); // tab key
 const dataSource = shallowRef([]) // 实时监测数据
@@ -158,8 +206,9 @@ const systemType = ref('')
 const systemID = ref('') // 系统监测时，系统id
 const selectedKeys = ref<string[]>([]);
 const expandedKeys = ref<string[]>([]);
-const scroll = ref({
-  y: drawerHeight.value - 100
+const isRefresh = ref(true) 
+const scroll = reactive({
+  y: 240
 })
 const treeData = ref<TreeProps['treeData']>([]);
 
@@ -180,13 +229,14 @@ const onSelect: TreeProps['onSelect'] = (keys, e) => {
   }
   selectedKeys.values = keys
   treeNodeTitle.value = e.node.title
-  debugger
   if(timer) clearTimeout(timer)
   timer = undefined
   if (monitorTable.value) monitorTable.value.setLoading(true)
   nextTick(() => {
-    timer = null
-    getMonitor()
+    setTimeout(() => {
+      timer = null
+      getMonitor()
+    }, 0)
   })
   
 };
@@ -227,28 +277,28 @@ async function getDeviceType() {
       });
       return dataSourceList
     }
-    console.log('树形菜单-------------->', treeData.value)
     treeData.value = getData(result, dataSource, key)
-
   }
 }
 
 // https获取监测数据
 let timer: null | NodeJS.Timeout = undefined;
 function getMonitor() {
-  if (timer) timer = null
-  if (Object.prototype.toString.call(timer) === '[object Null]' && deviceType.value) {
-    timer = setTimeout(async () => {
-      await getDataSource()
-      if (timer) {
-        getMonitor();
-      }
-    }, 1000);
+  if(deviceType.value){
+    if (timer) timer = null
+    if (Object.prototype.toString.call(timer) === '[object Null]') {
+      timer = setTimeout(async () => {
+        await getDataSource()
+        if (timer) {
+          getMonitor();
+        }
+      }, 1000);
+    }
   }
 };
 
 async function getDataSource() {
-  if (deviceType.value.startsWith('sys') && systemID.value) {
+  if (deviceType.value && deviceType.value.startsWith('sys') && systemID.value) {
     const res = await list({ devicetype: 'sys', systemID: systemID.value });
     const result = res.msgTxt;
     const deviceArr = <DeviceType[]>[]
@@ -261,10 +311,17 @@ async function getDataSource() {
         deviceArr.unshift({ deviceType: item.type, deviceName: item['typeName'] ? item['typeName'] : item['datalist'][0]['typeName'], datalist: data })
       }
     })
-    console.log('关联设备列表', deviceArr)
+
     deviceList.value = deviceArr
-    deviceActive.value = deviceArr[1].deviceType
-    monitorChange(1)
+    if(deviceArr.length > 0){
+      if(deviceArr[1]){
+        deviceActive.value = deviceArr[1].deviceType
+        monitorChange(1)
+      }else{
+        deviceActive.value = deviceArr[0].deviceType
+        monitorChange(0)
+      }
+    }
   } else {
     const res = await list({ devicetype: deviceType.value, pagetype: 'normal' })
     if (res.msgTxt[0]) {
@@ -277,41 +334,10 @@ async function getDataSource() {
   }
 }
 
-function setDivHeight(e: MouseEvent) {
-  const divObject = document.getElementById('monitorBox') as HTMLElement
-  const divHeight = divObject.offsetHeight
-  drawerHeight.value = divHeight
-  const startY = e.clientY
-  document.onmousemove = function (res) {
-    res.preventDefault()
-    const distY = Math.abs(res.clientY - startY)
-    if (res.clientY > startY) {
-      if (divHeight - distY >= 240) {
-        drawerHeight.value = divHeight - distY
-      } else {
-        drawerHeight.value = 240
-      }
-    }
-    if (res.clientY < startY) {
-      drawerHeight.value = divHeight + distY
-    }
-    divObject.style.height = drawerHeight.value + 'px'
-  }
-  document.onmouseup = function () {
-    document.onmousemove = null
-    if (scroll.value.y != drawerHeight.value - 100) {
-      scroll.value = { y: drawerHeight.value - 100 }
-
-      // const tableBody =  document.getElementsByClassName('zxm-table-container')[0].children[1] as HTMLElement
-      // debugger
-      // tableBody.style.height = `${drawerHeight.value - 350}px`
-    }
-  }
-}
-
 function goLocation(record) {
   actions.setGlobalState({ locationId: record.deviceID, locationObj: null, pageObj: null });
 }
+
 function goDetail(record?) {
 
   if (record) {
@@ -319,10 +345,14 @@ function goDetail(record?) {
       activeID.value = record.deviceID
       currentModal.value = FiberModal
       modalVisible.value = true;
-    } else if (deviceType.value.startsWith('dusting')) {
+    } else if (deviceType.value.startsWith('dusting')) { //bundletube
       activeID.value = record.deviceID
       currentModal.value = DustModal
       modalVisible.value = true;
+    } else if (deviceType.value.startsWith('bundletube')) {
+      activeID.value = record.deviceID
+      currentModal.value = BundleModal
+      modalVisible.value = true;
     } else if (deviceType.value.indexOf("gate") != -1) {
       const newPage = router.resolve({ path: '/monitorChannel/monitor-gate' })
       window.open(newPage.href, '_blank')
@@ -368,6 +398,7 @@ function toHome() {
   deviceList.value = []
   if(timer) clearTimeout(timer)
   timer = undefined
+  deviceType.value = ''
   actions.setGlobalState({ pageObj: { pageType: 'home' } });
 }
 
@@ -393,7 +424,6 @@ async function findTreeDataValue(data: [], obj) {
     })
   }
   findDeviceType(data, obj)
-  debugger
   if (timer === undefined) {
     timer = null
     await getDataSource()
@@ -419,7 +449,28 @@ function monitorChange(index) {
     handlerHistoryTable.value.setLoading(true)
   }
 }
+/**
+ * 设置巷道设备定位图标的显示与隐藏
+ */
+function setLocation() {
+  let locationStr = ''
+  locationList.value.forEach((item: any) => {
+    if(item.Visible) {
+       locationStr = locationStr ? locationStr +','+ item.value : item.value
+    }
+  })
+  actions.setGlobalState({ locationId: null, locationObj: null, pageObj:null, locationPlane: locationStr });
+  setTimeout(() => {
+    message.success('设置成功')
+  }, 600)
+}
 
+watch(() => scroll.y, () => {
+  isRefresh.value = false
+  nextTick(() => {
+    isRefresh.value = true
+  } )
+})
 
 onMounted(async () => {
   actions.onGlobalStateChange((newState, prev) => {
@@ -435,15 +486,17 @@ onMounted(async () => {
               findTreeDataValue(treeData.value, { deviceType: pageObj.pageType })
             }
           }
+          const posShowData = pageObj.locationPlane
+          if (posShowData) {
+            locationList.value = posShowData
+          }
         }
       }
     }
   })
   await getDeviceType()
-  locationList.value = await initDictOptions('devPosVisible')
-  console.log('定位列表------------>', locationList.value)
-  // getMonitor()
 })
+
 onUnmounted(() => {
   if (timer) {
     clearTimeout(timer);
@@ -706,6 +759,26 @@ onUnmounted(() => {
         color: #87f1ff;
       }
     }
+    .location-bottom-btn{
+      width: 100%;
+      color: #fff;
+      display: flex;
+      justify-content: flex-end;
+      margin-top: 20px;
+      span{
+        display: inline-block;
+        width: 100%;
+        background: #00709955;
+        border-radius: 3px;
+        border: 1px solid rgba(174, 243, 255, 0.3);
+        text-align: center;
+        padding: 2px 0;
+        cursor: pointer;
+        &:hover{
+          background: #00557422;
+        }
+      }
+    }
   }
 }
 .location-select-show{
@@ -960,8 +1033,8 @@ onUnmounted(() => {
 }
 
 :deep(.@{ventSpace}-tabs-tabpane-active) {
-  overflow: auto;
-  // height: 100%;
+  // overflow: auto;
+  height: 100%;
 }
 
 :deep(.zxm-select-dropdown) {

src/views/vent/monitorManager/deviceMonitor/modal/bundle.modal.vue

@@ -0,0 +1,446 @@
+<template>
+  <BasicModal v-bind="$attrs" @register="register" :title="`束管监测详情    ${currentTime}`" width="1200px" @ok="handleOk" @cancel="handleCancel" >
+    <div class="fiber-modal">
+      <div class="modal-left">
+        <div v-for="device in deviceList" class="link-item" :class="{'active-device-title': device.deviceID === activeDeviceID }" :key="device.deviceID">
+          <span class="" @click="selectDevice(device.deviceID)">{{ device.strinstallpos }}</span>
+        </div>
+      </div>
+      <div class="modal-right">
+        <span class="base-title">实时监测参数</span>
+        <div class="right-top">
+          <div class="top-item">
+            <div class="icon">
+              <SvgIcon class="icon-style" name="coval" style="width: 62px; height: 38px; margin-top: 10px;" />
+            </div>
+            <div class="item-container">
+              <div class="title">一氧化碳</div>
+              <div class="value">{{ posMonitor.coval }} <span>ppm</span> </div>
+            </div>
+          </div>
+          <div class="top-item">
+            <div class="icon">
+              <SvgIcon class="icon-style" name="co2val"  style="width: 72px; height: 46px;" />
+            </div>
+            <div class="item-container">
+              <div class="title">二氧化碳</div>
+              <div class="value">{{ posMonitor.co2val }} <span>%</span></div>
+            </div>
+          </div>
+          <div class="top-item">
+            <div class="icon">
+              <SvgIcon class="icon-style" name="gasval"  style="width: 72px; height: 46px;"/>
+            </div>
+            <div class="item-container">
+              <div class="title">甲烷</div>
+              <div class="value">{{ posMonitor.gasval }} <span>%</span></div>
+            </div>
+          </div>
+          <div class="top-item">
+            <div class="icon">
+              <SvgIcon class="icon-style" name="ch2val"  style="width: 76px; height: 42px;"/>
+            </div>
+            <div class="item-container">
+              <div class="title">乙烯</div>
+              <div class="value">{{ posMonitor.ch2val }} <span>ppm</span></div>
+            </div>
+          </div>
+          <div class="top-item">
+            <div class="icon">
+              <SvgIcon class="icon-style" name="chval" style="width: 76px; height: 42px;" />
+            </div>
+            <div class="item-container">
+              <div class="title">乙炔</div>
+              <div class="value">{{ posMonitor.chval }} <span>ppm</span></div>
+            </div>
+          </div>
+          <div class="top-item">
+            <div class="icon">
+              <SvgIcon class="icon-style" name="o2val"  style="width: 76px; height: 50px;"/>
+            </div>
+            <div class="item-container">
+              <div class="title">氧气</div>
+              <div class="value">{{ posMonitor.o2val }} <span>%</span></div>
+            </div>
+          </div>
+          <div class="top-item warning-box">
+            <div class="icon">
+              <SvgIcon class="icon-style" size="42" name="alarm-warning" style="margin-top: 5px;" />
+            </div>
+            <div class="item-container">
+              <div class="title">风险等级</div>
+              <div class="warning-value">低风险</div>
+            </div>
+          </div>
+          <div class="top-item warning-box">
+            <div class="icon">
+              <SvgIcon class="icon-style" size="42" name="link" style="margin-top: 5px;"/>
+            </div>
+            <div class="item-container">
+              <div class="title">连接状态</div>
+              <div class="warning-value">连接</div>
+            </div>
+          </div>
+        </div>
+        <div class="right-bottom">
+          <span class="base-title">设备监测曲线</span>
+          <div class="echarts-box">
+            <BarAndLine
+              class="echarts-line"
+              xAxisPropType="readTime"
+              :dataSource="deviceList"
+              height="100%"
+              :chartsColumns="chartsColumns"
+              :option="echatsOption"
+              chartsType="listMonitor" />
+          </div>
+        </div>
+      </div>
+    </div>
+  </BasicModal>
+</template>
+<script lang="ts">
+import { defineComponent, ref, watch, shallowRef, reactive } from 'vue';
+import { BasicModal, useModalInner } from '/@/components/Modal';
+import BarAndLine from '/@/components/chart/BarAndLine.vue';
+import { SvgIcon } from '/@/components/Icon';
+import { Decoration7 as DvDecoration7, ScrollBoard as DvScrollBoard } from '@kjgl77/datav-vue3';
+import dayjs from 'dayjs'
+
+export default defineComponent({
+  components: { BasicModal, BarAndLine, SvgIcon, DvScrollBoard, DvDecoration7 },
+  props: {
+    dataSource: {type: Array},
+    activeID: {type: String}
+  },
+  setup(props) {
+    const currentTime = ref(dayjs().format('YYYY-MM-DD HH:mm:ss'))
+    const modelRef = ref({});
+    const loading = ref(true);
+    const activeDeviceID = ref('');
+    const deviceList = ref<any[]>([])
+    const posList = ref<any[]>([])
+    const posMonitor = shallowRef({})
+
+    const echatsOption = {
+      grid: {
+        top: '25%',
+        left: '0%',
+        right: '0%',
+        bottom: '3%',
+        containLabel: true
+      },
+      toolbox: {
+        feature: {}
+      }
+    }
+
+    const chartsColumns = [
+      {
+        legend: '一氧化碳',
+        seriesName: '(ppm)',
+        ymax: 20,
+        yname: 'ppm',
+        linetype: 'line',
+        yaxispos: 'left',
+        color: '#FDB146',
+        sort: 1,
+        xRotate: 0,
+        dataIndex: 'coval',
+      },
+      {
+        legend: '二氧化碳',
+        seriesName: '(%)',
+        ymax: 10,
+        yname: '%',
+        linetype: 'line',
+        yaxispos: 'right',
+        color: '#9C83D9',
+        sort: 2,
+        xRotate: 0,
+        dataIndex: 'co2val',
+      },
+      {
+        legend: '甲烷',
+        seriesName: '(%)',
+        ymax: 10,
+        yname: '%',
+        linetype: 'line',
+        yaxispos: 'right',
+        color: '#DA3914',
+        sort: 2,
+        xRotate: 0,
+        dataIndex: 'gasval',
+      },
+      {
+        legend: '氧气',
+        seriesName: '(%)',
+        ymax: 10,
+        yname: '%',
+        linetype: 'line',
+        yaxispos: 'right',
+        color: '#03C2EC',
+        sort: 2,
+        xRotate: 0,
+        dataIndex: 'o2val',
+      },
+      {
+        legend: '乙炔',
+        seriesName: '(ppm)',
+        ymax: 20,
+        yname: 'ppm',
+        linetype: 'line',
+        yaxispos: 'left',
+        color: '#00FFA8',
+        sort: 1,
+        xRotate: 0,
+        dataIndex: 'chval',
+      },
+      {
+        legend: '乙烯',
+        seriesName: '(ppm)',
+        ymax: 20,
+        yname: 'ppm',
+        linetype: 'line',
+        yaxispos: 'left',
+        color: '#AE19FF',
+        sort: 1,
+        xRotate: 0,
+        dataIndex: 'ch2val',
+      },
+    ]
+    const [register, { setModalProps, closeModal }] = useModalInner();
+
+    function handleVisibleChange(visible) {
+      if (visible) {
+        loading.value = true;
+        setModalProps({ loading: true, confirmLoading: true });
+
+        setTimeout(() => {
+          loading.value = false;
+          setModalProps({ loading: false, confirmLoading: false });
+        }, 1000);
+      }
+    }
+
+    // 选择监测
+    function selectDevice (id){
+      loading.value = true;
+      setModalProps({ loading: true, confirmLoading: true });
+       setTimeout(() => {
+        loading.value = false;
+        activeDeviceID.value = id
+        setModalProps({ loading: false, confirmLoading: false });
+      }, 300);
+    }
+
+    function handleOk(e) {
+      e.preventDefault()
+      closeModal()
+    }
+
+    function handleCancel(e) {
+      e.preventDefault()
+      closeModal()
+    }
+
+    watch([() => props.dataSource, () => props.activeID], ([newDataSource, newActiveID], [oldDataSource, oldActiveID]) => {
+      if(newActiveID != oldActiveID){
+        activeDeviceID.value = newActiveID as string
+      }
+      deviceList.value = newDataSource?.filter((item:any, index) => {
+        if((!activeDeviceID.value && index == 0) || item.deviceID === activeDeviceID.value){
+          activeDeviceID.value = item.deviceID
+          posMonitor.value = item.readData
+        }
+        item.readTime = item.readTime?.substring(11)
+        return item
+      })
+    })
+
+    return { register, model: modelRef, currentTime, handleVisibleChange, selectDevice, handleOk, handleCancel, deviceList, activeDeviceID, posMonitor, echatsOption, posList, chartsColumns };
+  },
+  
+});
+</script>
+<style lang="less" scoped>
+  .fiber-modal{
+    width: 100%;
+    height: 650px;
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    
+    .modal-left{
+      width: 200px;
+      height: 100%;
+      overflow-y: auto;
+      background: #ffffff11;
+      padding: 5px;
+      border-radius: 5px;
+      .active-device-title {
+        color: aqua;
+      }
+      .link-item{
+        position: relative;
+        cursor: pointer;
+        line-height: 30px;
+        padding-left: 30px;
+        span:hover{
+          color: #89ffff;
+        }
+        &::after{
+          content: '';
+          position: absolute;
+          display: block;
+          width: 8px;
+          height: 8px;
+          top: 12px;
+          left: 10px;
+          transform: rotateZ(45deg) skew(10deg, 10deg);
+          background: #45d3fd;
+        }
+      }
+    }
+    .modal-right{
+      width: calc(100% - 220px);
+      .base-title{
+        line-height: 32px;
+        position: relative;
+        padding-left: 20px;
+        &::after{
+          content: '';
+          position: absolute;
+          display: block;
+          width: 4px;
+          height: 12px;
+          top: 4px;
+          left: 10px;
+          background: #45d3fd;
+          border-radius: 4px;
+        }
+      }
+      .right-top{
+        display: flex;
+        flex-direction: row;
+        justify-content: space-between;
+        flex-wrap: wrap;
+        margin-bottom: 10px;
+        .top-item{
+          width: 220px;
+          height: 100px;
+          display: flex;
+          flex-direction: row;
+          justify-content: center;
+          border: 1px solid rgba(25,237,255,.4);
+          box-shadow: inset 0 0 10px rgba(0,197,255,.6);
+          background: rgba(0,0,0,.06666666666666667);
+          padding-top: 20px;
+          margin: 10px 0;
+          .icon{
+            margin-right: 10px;
+            margin-top: 5px;
+            color: #FDB146;
+          }
+          .item-container{
+            width: 100px;
+            display: flex;
+            flex-direction: column;
+            justify-content: center;
+            div{
+              text-align: center;
+            }
+            .title{
+              font-size: 18px;
+            }
+            .value{
+              text-shadow: 0 0 25px #00fbfe;
+              background: linear-gradient( 0deg,#45d3fd, #45d3fd, #61ddb1,#61ddb1);
+              font-style: normal;
+              background-size: cover;
+              font-family: electronicFont;
+              font-size: 30px;
+              -webkit-background-clip: text;
+              background-clip: text;
+              -webkit-text-fill-color: transparent;
+              position: relative;
+              top: -8px;
+              span{
+                font-family: Arial, Helvetica, sans-serif;
+                font-size: 18px;
+                color: aliceblue;
+              }
+              
+            }
+            
+          }
+        }
+        .warning-box{
+          padding-top: 0px;
+          .icon{
+            margin-top: 20px;
+            :deep(.icon-style){
+              width: auto;
+              color: #FDB146;
+            }
+          }
+          .warning-value{
+            font-size: 18px;
+            color: #61ddb1;
+          }
+        }
+      }
+      .right-center{
+        margin-top: 20px;
+        display: flex;
+        flex-direction: row;
+        justify-content: space-between;
+        .table-box{
+          position: relative;
+          width: 500px;
+          height: 250px;
+        }
+        .warning-box{
+          width: calc(100% - 520px);
+          .warning-container{
+            width: 100%;
+            height: convert;
+            background: #009acd00;
+            :deep(.dv-scroll-board){
+              .row-item{
+                height: 40px !important;
+                line-height: 40px !important;
+              }
+              .header-item{
+                border-top: 1px solid #91e9fe !important;
+                border-bottom: 1px solid #91e9fe !important;
+              }
+            }
+
+          }
+        }
+      }
+      .right-bottom{
+        margin-top: 20px;
+        .echarts-box{
+          width: 100%;
+          height: 320px;
+          position: relative;
+          .echarts-line{
+            width: calc(100% + 80px);
+            position: absolute
+          }
+        }
+      }      
+    }
+  }
+  :deep(.zxm-table-body){
+    border: 1px solid rgba(57, 232, 255, 0.2) !important;
+    .zxm-table-tbody > tr > td{
+      border: none !important;
+    }
+  }
+  :deep(.zxm-table-cell){
+    border-right: none !important;
+  }
+</style>

src/views/vent/monitorManager/fanLocalMonitor/index.vue

@@ -49,20 +49,13 @@
     <div class="title-text">
       {{ selectData.stationname }}
     </div>
-    <div class="bottom-tabs-box">
+    <div class="bottom-tabs-box" @mousedown="setDivHeight($event, 240, scroll)">
       <a-tabs class="tabs-box" v-model:activeKey="activeKey" @change="tabChange">
         <a-tab-pane key="1" tab="实时监测">
-          <GroupMonitorTable :dataSource="dataSource" columnsType="fanlocal_monitor" @selectRow="getSelectRow" />
-          <!-- <MonitorTable
-            columnsType="fanlocal_monitor"
-            :dataSource="dataSource"
-            @selectRow="getSelectRow"
-            design-scope="fanlocal-monitor"
-            title="局部通风机监测"
-          /> -->
+          <GroupMonitorTable  v-if="activeKey === '1' && isRefresh" :dataSource="dataSource" columnsType="fanlocal_monitor" @selectRow="getSelectRow" :scroll="scroll"/>
         </a-tab-pane>
         <a-tab-pane key="2" tab="实时曲线图" force-render>
-          <div class="tab-item" v-if="activeKey === '2'">
+          <div class="tab-item" v-if="activeKey === '2' && isRefresh">
             <div class="vent-flex-row-between" style="height: 100%">
               <BarSingle
                 :xAxisData="[
@@ -90,17 +83,17 @@
           </div>
         </a-tab-pane>
         <a-tab-pane key="3" tab="历史数据">
-          <div class="tab-item">
+          <div class="tab-item" v-if="activeKey === '3' && isRefresh">
             <HistoryTable columns-type="fanlocal" device-type="fanlocal" :device-list-api="baseList" designScope="fanlocal-history" />
           </div>
         </a-tab-pane>
         <a-tab-pane key="4" tab="报警历史">
-          <div class="tab-item">
+          <div class="tab-item" v-if="activeKey === '4' && isRefresh">
             <AlarmHistoryTable columns-type="alarm" device-type="fanlocal" :device-list-api="baseList" designScope="alarm-history" />
           </div>
         </a-tab-pane>
         <a-tab-pane key="5" tab="操作历史">
-          <div class="tab-item">
+          <div class="tab-item" v-if="activeKey === '5' && isRefresh">
             <HandlerHistoryTable columns-type="operatorhistory" device-type="fanlocal" :device-list-api="baseList" designScope="alarm-history" />
           </div>
         </a-tab-pane>
@@ -193,7 +186,7 @@
 
 <script setup lang="ts">
   import { ExclamationCircleFilled } from '@ant-design/icons-vue';
-  import { onBeforeMount, ref, onMounted, nextTick, toRaw, reactive, onUnmounted } from 'vue';
+  import { onBeforeMount, ref, onMounted, nextTick, toRaw, reactive, onUnmounted, watch } from 'vue';
   import BarSingle from '../../../../components/chart/BarSingle.vue';
   import GroupMonitorTable from '../comment/GroupMonitorTable.vue';
   import HistoryTable from '../comment/HistoryTable.vue';
@@ -207,6 +200,7 @@
   import { deviceControlApi } from '/@/api/vent/index';
   import LivePlayer from '@liveqing/liveplayer-v3';
   import { message } from 'ant-design-vue';
+  import { setDivHeight } from '/@/utils/event';
 
   const modalTypeArr = reactive({
     leftBtnArr: [
@@ -282,6 +276,12 @@
       label: 'T3',
     },
   ]);
+
+  const isRefresh = ref(true)
+  const scroll = reactive({
+    y: 180
+  })
+  
   const modalSensor = ref(null);
   const loading = ref(false);
   const activeKey = ref('1');
@@ -315,11 +315,7 @@
   };
   // 监测数据
   const selectData = reactive(lodash.cloneDeep(initData));
-  // const dataSource = computed(() => {
-  //   const data = [...getRecordList()] || [];
-  //   Object.assign(selectData, toRaw(data[selectRowIndex.value]));
-  //   return data;
-  // });
+
   const tabChange = (activeKeyVal) => {
     activeKey.value = activeKeyVal;
   };
@@ -376,8 +372,6 @@
       loading.value = false;
     });
     const data = dataSource.value[baseDataIndex];
-    // mainWindIsShow1.value = 'stop';
-    // mainWindIsShow2.value = 'stop';
     if (data['fanStart1'] == 1) {
       mainWindIsShow1.value = 'open';
       mainWindIsShow2.value = 'stop';
@@ -492,6 +486,13 @@
     }
   };
 
+  watch(() => scroll.y, () => {
+    isRefresh.value = false
+    nextTick(() => {
+      isRefresh.value = true
+    })
+  })
+
   onBeforeMount(() => {
     getDeviceBaseList();
   });

src/views/vent/monitorManager/gateMonitor/index.vue

@@ -71,16 +71,19 @@
     <div class="title-text">
       {{ selectData.strname }}
     </div>
-    <div class="bottom-tabs-box">
+    <div class="bottom-tabs-box" @mousedown="setDivHeight($event, 250, scroll)">
       <a-tabs class="tabs-box" v-model:activeKey="activeKey" @change="tabChange">
         <a-tab-pane key="1" tab="实时监测">
           <MonitorTable
+            v-if="activeKey === '1' && isRefresh"
             class="monitor-table"
             columnsType="gate_monitor"
             :dataSource="dataSource"
             design-scope="gate-monitor"
             @selectRow="getSelectRow"
+            :scroll="scroll"
             title="风门监测"
+            :isShowPagination="false"
           >
             <template #filterCell="{ column, record }">
               <template v-if="record.frontGateOpenCtrl">
@@ -112,7 +115,7 @@
           </MonitorTable>
         </a-tab-pane>
         <a-tab-pane key="2" tab="实时曲线图" force-render>
-          <div class="tab-item" v-if="activeKey === '2'">
+          <div class="tab-item" v-if="activeKey === '2' && isRefresh">
             <DeviceEcharts
               chartsColumnsType="gate_chart"
               xAxisPropType="strname"
@@ -125,18 +128,18 @@
           </div>
         </a-tab-pane>
         <a-tab-pane key="3" tab="历史数据">
-          <div class="tab-item">
-            <HistoryTable columns-type="gate" device-type="gate" :device-list-api="getTableList" designScope="gate-history" />
+          <div class="tab-item"  v-if="activeKey === '3' && isRefresh">
+            <HistoryTable columns-type="gate" device-type="gate" :device-list-api="getTableList" designScope="gate-history" :scroll="scroll"/>
           </div>
         </a-tab-pane>
         <a-tab-pane key="4" tab="报警历史">
-          <div class="tab-item">
-            <AlarmHistoryTable columns-type="alarm" device-type="gate" :device-list-api="getTableList" designScope="alarm-history" />
+          <div class="tab-item"  v-if="activeKey === '4' && isRefresh">
+            <AlarmHistoryTable columns-type="alarm" device-type="gate" :device-list-api="getTableList" designScope="alarm-history" :scroll="scroll"/>
           </div>
         </a-tab-pane>
         <a-tab-pane key="5" tab="操作历史">
-          <div class="tab-item">
-            <HandlerHistoryTable columns-type="operatorhistory" device-type="gate" :device-list-api="getTableList" designScope="alarm-history" />
+          <div class="tab-item"  v-if="activeKey === '5' && isRefresh">
+            <HandlerHistoryTable columns-type="operatorhistory" device-type="gate" :device-list-api="getTableList" designScope="alarm-history" :scroll="scroll"/>
           </div>
         </a-tab-pane>
       </a-tabs>
@@ -159,7 +162,7 @@
 
 <script setup lang="ts">
   import LivePlayer from '@liveqing/liveplayer-v3';
-  import {onBeforeUnmount, onUnmounted, onMounted, ref, reactive, toRaw, nextTick } from 'vue';
+  import {onBeforeUnmount, onUnmounted, onMounted, ref, reactive, toRaw, nextTick, watch } from 'vue';
   import DeviceEcharts from '../comment/DeviceEcharts.vue';
   import MonitorTable from '../comment/MonitorTable.vue';
   import HistoryTable from '../comment/HistoryTable.vue';
@@ -172,6 +175,7 @@
   import { list, getTableList } from './gate.api';
   import { chartsColumns } from './gate.data';
   import lodash from 'lodash';
+  import { setDivHeight } from '/@/utils/event';
 
   const player1 = ref(null);
   const player2 = ref(null);
@@ -179,6 +183,11 @@
   const activeKey = ref('1'); // tab
   const loading = ref(false);
 
+  const isRefresh = ref(true)
+  const scroll = reactive({
+    y: 240
+  })
+
   const frontDoorIsOpen = ref(false); //前门是否开启
   const backDoorIsOpen = ref(false); //后门是否开启
 
@@ -290,11 +299,6 @@
 
   // 播放动画
   function playAnimation(handlerState) {
-    
-    // frontGateOpenCtrl rearGateOpenCtrl
-    //selectData.frontGateOpen == 0 && selectData.frontGateClose == 0
-    //selectData.rearGateOpen == 0 && selectData.rearGateClose == 0
-
     switch (handlerState) {
       case 1: // 打开前门
         if (selectData.frontGateOpen == '0' && selectData.frontGateClose == '1') {
@@ -583,6 +587,12 @@
     }
   };
   
+  watch(() => scroll.y, () => {
+    isRefresh.value = false
+    nextTick(() => {
+      isRefresh.value = true
+    })
+  })
 
   onMounted(() => {
     loading.value = true;
@@ -628,4 +638,8 @@
   :deep(.@{ventSpace}-tabs-tabpane-active) {
     overflow: auto;
   }
+  ::-webkit-scrollbar-thumb {
+    -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
+    background: #4288A444;
+  }
 </style>

src/views/vent/monitorManager/mainFanMonitor/index.vue

@@ -6,7 +6,7 @@
       class="threejs-Object-CSS"
       v-show="!loading"
       style="width: 100%; height: 100%; position: absolute; pointer-events: none; overflow: hidden; z-index: 1; top: 0"
-    >
+      >
       <div style="position: relative">
         <div class="elementTag" id="inputBox">
           <div class="elementContent elementContent-r" v-if="selectData.DataPa && backMonitorIsShow">
@@ -152,10 +152,10 @@
         </div>
       </div>
     </div>
-    <div class="bottom-tabs-box">
+    <div class="bottom-tabs-box" @mousedown="setDivHeight($event, 250, scroll)">
       <a-tabs class="tabs-box" v-model:activeKey="activeKey" @change="tabChange">
         <a-tab-pane key="1" tab="实时监测">
-          <GroupMonitorTable :dataSource="dataSource" columnsType="fanmain_monitor" @selectRow="getSelectRow" />
+          <GroupMonitorTable v-if="activeKey === '1' && isRefresh" :dataSource="dataSource" columnsType="fanmain_monitor" @selectRow="getSelectRow" :scroll="scroll"/>
         </a-tab-pane>
         <!-- <a-tab-pane key="2" tab="实时曲线图" force-render>
           <div class="tab-item" v-if="activeKey === '2'">
@@ -163,18 +163,18 @@
           </div>
         </a-tab-pane> -->
         <a-tab-pane key="3" tab="历史数据">
-          <div class="tab-item">
-            <HistoryTable columns-type="fanmain" device-type="fanmain" :device-list-api="baseList" designScope="fanmain-history" />
+          <div class="tab-item" v-if="activeKey === '3' && isRefresh">
+            <HistoryTable columns-type="fanmain" device-type="fanmain" :device-list-api="baseList" designScope="fanmain-history" :scroll="scroll"/>
           </div>
         </a-tab-pane>
         <a-tab-pane key="4" tab="报警历史">
-          <div class="tab-item">
-            <AlarmHistoryTable columns-type="alarm" device-type="fanmain" :device-list-api="baseList" designScope="alarm-history" />
+          <div class="tab-item" v-if="activeKey === '4' && isRefresh">
+            <AlarmHistoryTable columns-type="alarm" device-type="fanmain" :device-list-api="baseList" designScope="alarm-history" :scroll="scroll"/>
           </div>
         </a-tab-pane>
         <a-tab-pane key="5" tab="操作历史">
-          <div class="tab-item">
-            <HandlerHistoryTable columns-type="operatorhistory" device-type="fanlocal" :device-list-api="baseList" designScope="alarm-history" />
+          <div class="tab-item" v-if="activeKey === '5' && isRefresh">
+            <HandlerHistoryTable columns-type="operatorhistory" device-type="fanlocal" :device-list-api="baseList" designScope="alarm-history" :scroll="scroll"/>
           </div>
         </a-tab-pane>
       </a-tabs>
@@ -223,7 +223,7 @@
 <script setup lang="ts">
   import { ExclamationCircleFilled } from '@ant-design/icons-vue';
   import FanEchrats from '/@/views/vent/monitorManager/mainFanMonitor/fanEchrats.vue';
-  import { onBeforeMount, computed, ComputedRef, ref, onMounted, nextTick, onUnmounted, reactive, toRaw, toRef, toRefs } from 'vue';
+  import { onBeforeMount, computed, ref, onMounted, nextTick, onUnmounted, reactive, toRaw, watch } from 'vue';
   import GroupMonitorTable from '../comment/GroupMonitorTable.vue';
   import HistoryTable from '../comment/HistoryTable.vue';
   import AlarmHistoryTable from '../comment/AlarmHistoryTable.vue';
@@ -237,6 +237,12 @@
   import { list as baseList } from '../../deviceManager/fanTabel/fan.api';
   import { getTableList } from '/@/views/vent/monitorManager/fanLocalMonitor/fanLocal.api';
   import { getTableHeaderColumns } from '/@/hooks/web/useWebColumns';
+  import { setDivHeight } from '/@/utils/event';
+
+  const isRefresh = ref(true)
+  const scroll = reactive({
+    y: 180
+  })
 
   const modalTypeArr = reactive({
     centerBtnArr: [
@@ -561,6 +567,13 @@
     }
   };
 
+  watch(() => scroll.y, () => {
+    isRefresh.value = false
+    nextTick(() => {
+      isRefresh.value = true
+    })
+  })
+
   onBeforeMount(() => {
     // document.body.addEventListener('mousedown', addPlayVideo, true);
     getDeviceBaseList();

src/views/vent/monitorManager/nitrogen/components/nitrogenAlarmHistory.vue

@@ -13,5 +13,6 @@
     width: 100%;
     position: fixed;
     top: 80px;
+    margin-top: 20px;
   }
 </style>

src/views/vent/monitorManager/nitrogen/components/nitrogenHandleHistory.vue

@@ -12,5 +12,6 @@
   .handle-history{
     position: fixed;
     top: 80px;
+    margin-top: 20px;
   }
 </style>

src/views/vent/monitorManager/nitrogen/components/nitrogenHistory.vue

@@ -12,5 +12,6 @@
   .nitrogen-history{
     position: fixed;
     top: 80px;
+    margin-top: 20px;
   }
 </style>

src/views/vent/monitorManager/nitrogen/index.vue

@@ -1,9 +1,6 @@
 <template>
   <div class="nitrogen-box">
-    <div class="nitrogen-home-header">
-      <Decoration5 class="header-icon" :dur="2" :color="['#21437F', '#2CF7FE']" style="width:500px;height:40px;" />
-      <div class="header-text">智能压风管控系统</div>
-    </div>
+    <customHeader >智能压风管控系统</customHeader>
     <nitrogenHome v-if="btnActive == 'nitrogen_page'" />
     <nitrogenEcharts v-if="btnActive == 'yfj_monitor_echarts'"/>
     <nitrogenHistory v-if="btnActive == 'yfj_history'"/>
@@ -20,7 +17,7 @@ import nitrogenEcharts from './components/nitrogenEcharts.vue'
 import nitrogenHistory from './components/nitrogenHistory.vue'
 import nitrogenHandleHistory from './components/nitrogenHandleHistory.vue'
 import nitrogenAlarmHistory from './components/nitrogenAlarmHistory.vue'
-import { Decoration5 } from '@kjgl77/datav-vue3'
+import customHeader from '/@/views/vent/comment/components/customHeader.vue';
 import BottomMenu from '/@/views/vent/comment/components/bottomMenu.vue';
 
 const btnActive = ref('nitrogen_page')
@@ -28,7 +25,7 @@ const navList = ref([
   {
     title: '监控界面',
     pathName: 'nitrogen_page',
-    isHover: true
+    isHover: false
   },
   {
     title: '实时曲线',

src/views/vent/monitorManager/windowMonitor/index.vue

@@ -56,15 +56,18 @@
     <div class="title-text">
       {{ selectData.strname }}
     </div>
-    <div class="bottom-tabs-box">
+    <div class="bottom-tabs-box" @mousedown="setDivHeight($event, 250, scroll)">
       <a-tabs class="tabs-box" v-model:activeKey="activeKey" @change="tabChange">
         <a-tab-pane key="1" tab="实时监测">
           <MonitorTable
+            v-if="activeKey === '1' && isRefresh"
             columnsType="window_monitor"
             :dataSource="dataSource"
             @selectRow="getSelectRow"
             design-scope="window-monitor"
+            :scroll="scroll"
             title="风窗监测"
+            :isShowPagination="false"
           >
             <template #filterCell="{ column, record }">
               <a-tag v-if="column.dataIndex === 'warnFlag'" :color="record.warnFlag == 0 ? 'green' : 'red'">{{
@@ -78,7 +81,7 @@
           </MonitorTable>
         </a-tab-pane>
         <a-tab-pane key="2" tab="实时曲线图" force-render>
-          <div class="tab-item" v-if="activeKey === '2'">
+          <div class="tab-item" v-if="activeKey === '2' && isRefresh">
             <DeviceEcharts
               chartsColumnsType="window_chart"
               xAxisPropType="strname"
@@ -91,18 +94,18 @@
           </div>
         </a-tab-pane>
         <a-tab-pane key="3" tab="历史数据">
-          <div class="tab-item">
-            <HistoryTable columns-type="window" device-type="window" :device-list-api="baseList" designScope="window-history" />
+          <div class="tab-item" v-if="activeKey === '3' && isRefresh">
+            <HistoryTable columns-type="window" device-type="window" :device-list-api="baseList" designScope="window-history" :scroll="scroll"/>
           </div>
         </a-tab-pane>
         <a-tab-pane key="4" tab="报警历史">
-          <div class="tab-item">
-            <AlarmHistoryTable columns-type="alarm" device-type="window" :device-list-api="baseList" designScope="alarm-history" />
+          <div class="tab-item" v-if="activeKey === '4' && isRefresh">
+            <AlarmHistoryTable columns-type="alarm" device-type="window" :device-list-api="baseList" designScope="alarm-history" :scroll="scroll"/>
           </div>
         </a-tab-pane>
         <a-tab-pane key="5" tab="操作历史">
-          <div class="tab-item">
-            <HandlerHistoryTable columns-type="operatorhistory" device-type="fanlocal" :device-list-api="baseList" designScope="alarm-history" />
+          <div class="tab-item" v-if="activeKey === '5' && isRefresh">
+            <HandlerHistoryTable columns-type="operatorhistory" device-type="fanlocal" :device-list-api="baseList" designScope="alarm-history" :scroll="scroll"/>
           </div>
         </a-tab-pane>
       </a-tabs>
@@ -118,13 +121,12 @@
 <script setup lang="ts">
   import { message } from 'ant-design-vue';
   import DeviceEcharts from '../comment/DeviceEcharts.vue';
-  import { onBeforeMount, ref, onMounted, onUnmounted, reactive, toRaw } from 'vue';
+  import { onBeforeMount, ref, onMounted, onUnmounted, reactive, toRaw, watch, nextTick } from 'vue';
   import MonitorTable from '../comment/MonitorTable.vue';
   import HistoryTable from '../comment/HistoryTable.vue';
   import AlarmHistoryTable from '../comment/AlarmHistoryTable.vue';
   import HandlerHistoryTable from '../comment/HandlerHistoryTable.vue';
   import HandleModal from './modal.vue';
-  import { initWebSocket, getRecordList } from '/@/hooks/web/useVentWebSocket';
   import { mountedThree, destroy, addFmText, play, setModelType } from './window.threejs';
   import { list, getTableList } from './window.api';
   import { list as baseList } from '../../deviceManager/windWindowTabel/ventanalyWindow.api';
@@ -132,10 +134,16 @@
   import { deviceControlApi } from '/@/api/vent/index';
   import lodash from 'lodash';
   import LivePlayer from '@liveqing/liveplayer-v3';
+  import { setDivHeight } from '/@/utils/event';
 
   const player1 = ref(null);
   const player2 = ref(null);
 
+  const isRefresh = ref(true)
+  const scroll = reactive({
+    y: 240
+  })
+
   const modalIsShow = ref<boolean>(false); // 是否显示模态框
   const modalTitle = ref(''); // 模态框标题显示内容，根据设备操作类型决定
   const modalType = ref(''); // 模态框内容显示类型，设备操作类型
@@ -324,6 +332,13 @@
     }
   };
 
+  watch(() => scroll.y, () => {
+    isRefresh.value = false
+    nextTick(() => {
+      isRefresh.value = true
+    })
+  })
+
   onBeforeMount(() => {
     // const sendVal = JSON.stringify({ pagetype: 'normal', devicetype: 'window', orgcode: '', ids: '', systemID: '' });
     // initWebSocket(sendVal);
@@ -352,9 +367,9 @@
   @import '/@/design/vent/modal.less';
   @ventSpace: zxm;
 
-  :deep(.@{ventSpace}-tabs-tabpane-active) {
-    overflow: auto;
-  }
+  // :deep(.@{ventSpace}-tabs-tabpane-active) {
+  //   height: 100%;
+  // }
   .input-box {
     display: flex;
     align-items: center;

src/views/vent/monitorManager/windrectMonitor/index.vue

@@ -40,7 +40,7 @@
     <div class="title-text">
       {{ selectData.strname }}
     </div>
-    <div class="bottom-tabs-box">
+    <div class="bottom-tabs-box" @mousedown="setDivHeight($event, 250, scroll)">
       <div class="tabs-button-group">
         <a-button class="tabs-button" type="primary" @click="openModel">一键测风</a-button>
         <!-- <a-button class="tabs-button" type="primary" @click="exportExcel()">导出报表</a-button> -->
@@ -48,11 +48,14 @@
       <a-tabs class="tabs-box" v-model:activeKey="activeKey" @change="tabChange">
         <a-tab-pane key="1" tab="实时监测">
           <MonitorTable
+            v-if="activeKey === '1' && isRefresh"
             columnsType="windrect_monitor"
             :dataSource="dataSource"
             design-scope="windrect-monitor"
             @selectRow="getSelectRow"
+            :scroll="scroll"
             title="测风装置监测"
+            :isShowPagination="false"
           >
             <template #filterCell="{ column, record }">
               <a-tag v-if="column.dataIndex === 'netStatus'" :color="record.netStatus == 0 ? '#FF5812' : 'green'">{{
@@ -75,7 +78,7 @@
           </MonitorTable>
         </a-tab-pane>
         <a-tab-pane key="2" tab="监测曲线图" force-render>
-          <div class="tab-item" v-if="activeKey === '2'">
+          <div class="tab-item" v-if="activeKey === '2' && isRefresh">
             <DeviceEcharts
               chartsColumnsType="windrect_chart"
               xAxisPropType="strname"
@@ -89,7 +92,7 @@
         </a-tab-pane>
         <a-tab-pane key="3" tab="历史数据">
           <div class="tab-item">
-            <HistoryTable columns-type="windrect" device-type="windrect" :device-list-api="baseList" designScope="windrect-history" >
+            <HistoryTable columns-type="windrect" device-type="windrect" :device-list-api="baseList" designScope="windrect-history" :scroll="scroll">
               <template #filterCell="{ column, record }">
                 <a-tag v-if="column.dataIndex === 'warnFlag'" :color="record.warnFlag == 0 ? 'green' : record.warnFlag == 1 ? '#FF5812' : 'gray'"> {{
                   record.warnFlag == 0 ? '正常' : record.warnFlag == 1 ? '报警' : record.warnFlag == 2 ? '断开' : '未监测'
@@ -99,17 +102,17 @@
           </div>
         </a-tab-pane>
         <a-tab-pane key="4" tab="报警历史">
-          <div class="tab-item">
-            <AlarmHistoryTable columns-type="alarm" device-type="windrect" :device-list-api="baseList" designScope="alarm-history" />
+          <div class="tab-item" v-if="activeKey === '4' && isRefresh">
+            <AlarmHistoryTable columns-type="alarm" device-type="windrect" :device-list-api="baseList" designScope="alarm-history" :scroll="scroll"/>
           </div>
         </a-tab-pane>
         <a-tab-pane key="5" tab="操作历史">
-          <div class="tab-item">
-            <HandlerHistoryTable columns-type="operator_history" device-type="fanlocal" :device-list-api="baseList" designScope="operator_history" />
+          <div class="tab-item" v-if="activeKey === '5' && isRefresh">
+            <HandlerHistoryTable columns-type="operator_history" device-type="fanlocal" :device-list-api="baseList" designScope="operator_history" :scroll="scroll"/>
           </div>
         </a-tab-pane>
-        <a-tab-pane key="6" tab="测风结果">
-          <ResultTable v-if="activeKey == 6" deviceType="windrect_list" />
+        <a-tab-pane key="6" tab="测风结果" v-if="activeKey === '6' && isRefresh">
+          <ResultTable v-if="activeKey == 6" deviceType="windrect_list" :scroll="scroll"/>
         </a-tab-pane>
       </a-tabs>
     </div>
@@ -139,7 +142,7 @@
 
 <script setup lang="ts">
   import DeviceEcharts from '../comment/DeviceEcharts.vue';
-  import { onBeforeMount, computed, ComputedRef, ref, onMounted, onUnmounted, reactive, toRaw, toRef, toRefs, Ref } from 'vue';
+  import { onBeforeMount,ref, onMounted, onUnmounted, reactive, toRaw, nextTick, watch } from 'vue';
   import { BasicModal, useModalInner } from '/@/components/Modal';
   import MonitorTable from '../comment/MonitorTable.vue';
   import ModalTable from './components/modalTable.vue';
@@ -147,7 +150,6 @@
   import HistoryTable from '../comment/HistoryTable.vue';
   import AlarmHistoryTable from '../comment/AlarmHistoryTable.vue';
   import HandlerHistoryTable from '../comment/HandlerHistoryTable.vue';
-  import { initWebSocket, getRecordList } from '/@/hooks/web/useVentWebSocket';
   import { deviceControlApi } from '/@/api/vent/index';
   import { mountedThree, destroy, addFmText, play, setModelType, playCamera } from './windrect.threejs';
   import LivePlayer from '@liveqing/liveplayer-v3';
@@ -155,6 +157,12 @@
   import { list as baseList } from '../../deviceManager/windfindingTabel/windfinding.api';
   import { message, Progress } from 'ant-design-vue';
   import { chartsColumns } from './windrect.data';
+  import { setDivHeight } from '/@/utils/event';
+
+  const isRefresh = ref(true)
+  const scroll = reactive({
+    y: 240
+  })
 
   const modalTable = ref();
   const runNum = ref(5); //设备运行数量
@@ -628,6 +636,13 @@
     });
   };
 
+  watch(() => scroll.y, () => {
+    isRefresh.value = false
+    nextTick(() => {
+      isRefresh.value = true
+    })
+  })
+
   onBeforeMount(() => {
     getPathList();
   });
@@ -656,7 +671,7 @@
 
   
   :deep(.@{ventSpace}-tabs-tabpane-active) {
-    overflow: auto;
+    height: 100%;
   }
   .head-line {
     display: flex;
@@ -697,7 +712,4 @@
       }
     }
   }
-  .@{ventSpace}-tabs-tabpane {
-    overflow-y: auto !important;
-  }
 </style>