Merge branch 'master' of http://182.92.126.35:3000/hrx/mky-vent-base

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

@@ -127,7 +127,7 @@ export interface CommonItem {
 
 export interface ModuleDataBoard extends ReadFrom {
   /** 展示牌预设的背景类型 */
-  type: 'A' | 'B' | 'C' | 'D' | 'E' | 'F' | 'G';
+  type: 'A' | 'B' | 'C' | 'D' | 'E' | 'F' | 'G' | 'H';
   /** 展示牌布局，决定是 label 部分在上方或是 value 在上方 */
   layout: 'val-top' | 'label-top';
   /** 核心配置，每个展示牌对应一项 */
@@ -136,14 +136,14 @@ export interface ModuleDataBoard extends ReadFrom {
 
 export interface ModuleDataList extends ReadFrom {
   /** 列表预设的背景类型 */
-  type: 'timeline' | 'A' | 'B' | 'C' | 'D' | 'E' | 'F' | 'G';
+  type: 'timeline' | 'A' | 'B' | 'C' | 'D' | 'E' | 'F' | 'G' | 'H' | 'I';
   /** 是否需要根据数据来决定所展示的项目数量，需要确保 items 至少有一项，且 readFrom 指向数组 */
   mapFromData?: boolean;
   /** 核心配置，每个列表项对应一项 */
   items: Array<
     {
       /** 列表项指定颜色，根据类型不同会有各自的样式 */
-      color?: 'red' | 'orange' | 'yellow' | 'green' | 'blue' | 'white';
+      color?: 'red' | 'orange' | 'yellow' | 'green' | 'blue' | 'white' | 'lightblue';
       /** 针对列表项说明的额外信息，部分类型的列表项会使用 */
       info?: string;
     } & CommonItem
@@ -152,12 +152,12 @@ export interface ModuleDataList extends ReadFrom {
 
 export interface ModuleDataGallery extends ReadFrom {
   /** 画廊预设的背景类型 */
-  type: 'A' | 'B' | 'C' | 'D' | 'E' | 'F' | 'G' | 'H';
+  type: 'A' | 'B' | 'C' | 'D' | 'E' | 'F' | 'G' | 'H' | 'I';
   /** 核心配置，每个画廊项对应一项 */
   items: Array<
     {
       /** 画廊项指定颜色，根据类型不同会有各自的样式 */
-      color?: 'red' | 'orange' | 'yellow' | 'green' | 'blue' | 'white';
+      color?: 'red' | 'orange' | 'yellow' | 'green' | 'blue' | 'white' | 'lightblue';
     } & CommonItem
   >;
 }
@@ -185,7 +185,7 @@ export interface ModuleDataGalleryList extends ReadFrom {
 
 export interface ModuleDataChart extends ReadFrom {
   /** 图表类型，一个类型对应一种图表预设 */
-  type: 'pie' | 'bar' | 'line' | 'line_area' | 'line_bar' | 'line_smooth' | 'line_smooth_complex' | 'bar_stack';
+  type: 'pie' | 'bar' | 'line' | 'line_area' | 'line_bar' | 'line_smooth' | 'line_smooth_complex' | 'bar_stack' | 'bar_cylinder';
   /** 排序依据，该项应配置将配合 readFrom 使用 */
   sortBy?: string;
   /** 排序规则，desc降序，asc升序 */
@@ -244,7 +244,7 @@ export interface ModuleDataPreset extends ReadFrom {
 
 export interface ModuleDataComplexList extends ReadFrom {
   /** 列表预设的背景类型 */
-  type: 'A' | 'B' | 'C' | 'D';
+  type: 'A' | 'B' | 'C' | 'D' | 'E';
   /** 是否需要根据数据来决定所展示的项目数量，需要确保 items 至少有一项，且 readFrom 指向数组 */
   mapFromData?: boolean;
   /** 核心配置，每个列表项对应一项 */
@@ -254,7 +254,7 @@ export interface ModuleDataComplexList extends ReadFrom {
     contents: Array<
       {
         /** 列表项指定颜色，根据类型不同会有各自的样式 */
-        color?: 'red' | 'orange' | 'yellow' | 'green' | 'blue' | 'white';
+        color?: 'red' | 'orange' | 'yellow' | 'green' | 'blue' | 'white' | 'lightblue';
         /** 针对列表项说明的额外信息，部分类型的列表项会使用 */
         info?: string;
       } & CommonItem

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

@@ -82,13 +82,16 @@
   // 根据配置里的定位判断应该使用哪个module组件
   const daneClass = computed(() => {
     const position = props.showStyle.position;
-    if (position.includes('left:0')) {
+    if (position.includes('bottom')) {
+      return 'dane-w';
+    }
+    if (position.includes('left')) {
       return 'dane-m';
     }
-    if (position.includes('right:0')) {
+    if (position.includes('right')) {
       return 'dane-m';
     }
-    return 'dane-w';
+    return 'dane-m';
   });
 
   //切换时间选项
@@ -142,7 +145,7 @@
       align-items: center;
       justify-content: space-between;
       width: 100%;
-      height: 34px;
+      height: 38px;
       padding: 0 40px 0 50px;
 
       .common-navL {
@@ -178,7 +181,7 @@
     }
 
     .dane-content {
-      height: calc(100% - 34px);
+      height: calc(100% - 38px);
       // border-image: linear-gradient(#1dabeb, #1dabeb22);
       border-image: linear-gradient(#1dabeb 0%, #1dabeb 60%, #000723) 30;
       // border-left: 1px;

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

@@ -110,13 +110,16 @@
   // 根据配置里的定位判断应该使用哪个module组件
   const daneClass = computed(() => {
     const position = props.showStyle.position;
-    if (position.includes('left:0')) {
+    if (position.includes('bottom')) {
+      return 'dane-w';
+    }
+    if (position.includes('left')) {
       return 'dane-m';
     }
-    if (position.includes('right:0')) {
+    if (position.includes('right')) {
       return 'dane-m';
     }
-    return 'dane-w';
+    return 'dane-m';
   });
 
   //切换时间选项

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

@@ -50,13 +50,16 @@
 
   // 根据配置里的定位判断应该使用哪个module组件
   function getModuleComponent(position) {
-    if (position.includes('left:0')) {
+    if (position.includes('bottom')) {
+      return ModuleBottom;
+    }
+    if (position.includes('left')) {
       return ModuleLeft;
     }
-    if (position.includes('right:0')) {
+    if (position.includes('right')) {
       return ModuleRight;
     }
-    return ModuleBottom;
+    return ModuleLeft;
   }
 
   function redirectTo() {

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

@@ -49,10 +49,13 @@
 
   // 根据配置里的定位判断应该使用哪个module组件
   function getModuleComponent(position) {
-    if (position.includes('left:0')) {
+    if (position.includes('bottom')) {
+      return ModuleBottom;
+    }
+    if (position.includes('left')) {
       return ModuleLeft;
     }
-    if (position.includes('right:0')) {
+    if (position.includes('right')) {
       return ModuleLeft;
     }
     return ModuleBottom;

src/views/vent/home/configurable/components/detail/ComplexList.vue

@@ -43,230 +43,288 @@
   //   defineEmits(['click']);
 </script>
 <style lang="less" scoped>
-  @import '@/design/vent/color.less';
-  /* Timeline 相关的样式 */
+    @import '@/design/vent/color.less';
+    /* Timeline 相关的样式 */
 
-  .list {
-    padding: 5px 20px;
-    position: relative;
-    width: 100%;
-    height: 100%;
-  }
-
-  .list-item_A {
-    position: relative;
-    height: 140px;
-    background-repeat: no-repeat;
-    background-image: url(/@/assets/images/home-container/configurable/firehome/img-3.png);
-    background-size: auto 100%;
-    background-position: center;
-  }
-  .list-item__title_A {
-    position: absolute;
-    left: 41%;
-    // font-size: 14px;
-    top: 15px;
-  }
-  // .list-item__content_A {
-  //   position: absolute;
-  //   left: 35%;
-  //   top: 55px;
-  //   display: flex;
-  //   justify-content: space-evenly;
-  // }
-  .list-item__content_A:nth-of-type(2) {
-    position: absolute;
-    top: 15px;
-    left: 14%;
-    width: 22%;
-    text-align: center;
-    display: block;
-
-    .list-item__label {
-      font-size: 18px;
-      margin-bottom: 25px;
-    }
-    .list-item__info {
-      display: none;
-    }
-    .list-item__value {
-      font-size: 24px;
+    .list {
+      padding: 5px 20px;
+      position: relative;
+      width: 100%;
+      height: 100%;
     }
-  }
-  .list-item__content_A:nth-of-type(3) {
-    position: absolute;
-    left: 41%;
-    top: 55px;
 
-    .list-item__info {
-      display: none;
+    .list-item_A {
+      position: relative;
+      height: 140px;
+      background-repeat: no-repeat;
+      background-image: url(/@/assets/images/home-container/configurable/firehome/img-3.png);
+      background-size: auto 100%;
+      background-position: center;
     }
-    .list-item__value {
-      font-size: 20px;
+    .list-item__title_A {
+      position: absolute;
+      left: 41%;
+      // font-size: 14px;
+      top: 15px;
     }
-  }
-  .list-item__content_A:nth-of-type(4) {
-    position: absolute;
-    left: 66%;
-    top: 55px;
+    // .list-item__content_A {
+    //   position: absolute;
+    //   left: 35%;
+    //   top: 55px;
+    //   display: flex;
+    //   justify-content: space-evenly;
+    // }
+    .list-item__content_A:nth-of-type(2) {
+      position: absolute;
+      top: 15px;
+      left: 14%;
+      width: 22%;
+      text-align: center;
+      display: block;
 
-    .list-item__info {
-      display: none;
+      .list-item__label {
+        font-size: 18px;
+        margin-bottom: 25px;
+      }
+      .list-item__info {
+        display: none;
+      }
+      .list-item__value {
+        font-size: 24px;
+      }
     }
-    .list-item__value {
-      font-size: 20px;
+    .list-item__content_A:nth-of-type(3) {
+      position: absolute;
+      left: 41%;
+      top: 55px;
+
+      .list-item__info {
+        display: none;
+      }
+      .list-item__value {
+        font-size: 20px;
+      }
     }
-  }
-  .list-item__content_A:nth-of-type(5) {
-    position: absolute;
-    left: 35%;
-    bottom: 10px;
-    display: flex;
-    align-items: center;
+    .list-item__content_A:nth-of-type(4) {
+      position: absolute;
+      left: 66%;
+      top: 55px;
 
-    .list-item__info {
-      display: none;
+      .list-item__info {
+        display: none;
+      }
+      .list-item__value {
+        font-size: 20px;
+      }
     }
-    .list-item__value {
-      font-size: 20px;
-      margin-left: 5px;
+    .list-item__content_A:nth-of-type(5) {
+      position: absolute;
+      left: 35%;
+      bottom: 10px;
+      display: flex;
+      align-items: center;
+
+      .list-item__info {
+        display: none;
+      }
+      .list-item__value {
+        font-size: 20px;
+        margin-left: 5px;
+      }
     }
-  }
 
-  .list-item_B {
-    // height: 155px;
-    background-repeat: no-repeat;
-    // background-size: 100% 100%;
-    // background-size: auto 100%;
-    background-size: 87% auto;
-    background-position: center;
-    background-image: url(/@/assets/images/home-container/configurable/firehome/img-7.png);
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    text-align: center;
-    padding: 0 10%;
-    margin-top: 5px;
-    height: 33px;
+    .list-item_B {
+      // height: 155px;
+      background-repeat: no-repeat;
+      // background-size: 100% 100%;
+      // background-size: auto 100%;
+      background-size: 87% auto;
+      background-position: center;
+      background-image: url(/@/assets/images/home-container/configurable/firehome/img-7.png);
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      text-align: center;
+      padding: 0 10%;
+      margin-top: 5px;
+      height: 33px;
 
-    .list-item__label {
-      font-size: 11px;
+      .list-item__label {
+        font-size: 11px;
+      }
+      .list-item__value {
+        font-size: 18px;
+        margin-left: 5px;
+      }
+      .list-item__content_B {
+        height: 100%;
+        display: flex;
+        align-items: center;
+        flex-basis: 100px;
+        flex-grow: 1;
+      }
+      .list-item__title_B {
+        width: 40px;
+        text-align: center;
+        margin-right: 50px
+        // height: 30px;
+        // background-size: auto 80%;
+        // background-position: center;
+        // background-repeat: no-repeat;
+      }
+      .list-item__info {
+        display: none;
+      }
     }
-    .list-item__value {
-      font-size: 18px;
-      margin-left: 5px;
+
+    .list_C {
+      padding: 5px 10px;
     }
-    .list-item__content_B {
-      height: 100%;
+
+    .list__wrapper_C {
       display: flex;
-      align-items: center;
-      flex-basis: 100px;
-      flex-grow: 1;
+      justify-content: space-between;
+      flex-wrap: wrap;
     }
-    .list-item__title_B {
-      width: 40px;
-      text-align: center;
-      margin-right: 50px
-      // height: 30px;
-      // background-size: auto 80%;
-      // background-position: center;
-      // background-repeat: no-repeat;
+
+    .list-item_C {
+      position: relative;
+      height: 140px;
+      width: 200px;
+      background-repeat: no-repeat;
+      background-image: url(/@/assets/images/home-container/configurable/firehome/img-8.png);
+      background-size: 100% 100%;
+      background-position: left center;
     }
-    .list-item__info {
-      display: none;
+    .list-item__title_C {
+      position: absolute;
+      left: 99px;
+      // font-size: 14px;
+      top: 15px;
     }
-  }
+    .list-item__content_C:nth-of-type(2) {
+      position: absolute;
+      top: 15px;
+      left: 19px;
+      width: 30%;
+      text-align: center;
+      display: block;
 
-  .list_C {
-    padding: 5px 10px;
-  }
+      .list-item__label {
+        // font-size: 18px;
+        margin-bottom: 25px;
+      }
+      .list-item__info {
+        display: none;
+      }
+      .list-item__value {
+        font-size: 18px;
+      }
+    }
+    .list-item__content_C:nth-of-type(3) {
+      position: absolute;
+      left: 99px;
+      top: 55px;
 
-  .list__wrapper_C {
-    display: flex;
-    justify-content: space-between;
-    flex-wrap: wrap;
-  }
+      .list-item__info {
+        display: none;
+      }
+      .list-item__value {
+        font-size: 18px;
+      }
+    }
 
-  .list-item_C {
-    position: relative;
-    height: 140px;
-    width: 200px;
-    background-repeat: no-repeat;
-    background-image: url(/@/assets/images/home-container/configurable/firehome/img-8.png);
-    background-size: 100% 100%;
-    background-position: left center;
-  }
-  .list-item__title_C {
-    position: absolute;
-    left: 99px;
-    // font-size: 14px;
-    top: 15px;
-  }
-  .list-item__content_C:nth-of-type(2) {
-    position: absolute;
-    top: 15px;
-    left: 19px;
-    width: 30%;
-    text-align: center;
-    display: block;
 
-    .list-item__label {
-      // font-size: 18px;
-      margin-bottom: 25px;
-    }
-    .list-item__info {
-      display: none;
+    .list_D {
+      padding: 5px 10px;
     }
-    .list-item__value {
-      font-size: 18px;
+
+    .list__wrapper_D {
+      display: flex;
+      justify-content: space-between;
+      flex-wrap: wrap;
     }
-  }
-  .list-item__content_C:nth-of-type(3) {
-    position: absolute;
-    left: 99px;
-    top: 55px;
 
-    .list-item__info {
-      display: none;
+    .list-item_D {
+      position: relative;
+      height: 110px;
+      width: 200px;
+      background-repeat: no-repeat;
+      background-image: url(/@/assets/images/home-container/configurable/firehome/img-9.png);
+      background-size: 100% auto;
+      background-position: center top;
+      text-align: center;
+      margin-bottom: 20px;
     }
-    .list-item__value {
-      font-size: 18px;
+    .list-item__title_D {
+      position: absolute;
+      width: 100%;
+      bottom: 0;
+      font-size: 20px;
     }
-  }
+    .list-item__content_D:nth-of-type(2) {
+      position: absolute;
+      top: 10%;
+      left: 10%;
+      width: 30%;
+      text-align: center;
 
+      .list-item__info {
+        display: none;
+      }
+      .list-item__value {
+        font-size: 19px;
+      }
+    }
+    .list-item__content_D:nth-of-type(3) {
+      position: absolute;
+      top: 10%;
+      right: 10%;
+      width: 30%;
+      text-align: center;
 
-  .list_D {
+      .list-item__info {
+        display: none;
+      }
+      .list-item__value {
+        font-size: 19px;
+      }
+    }
+
+  .list_E {
     padding: 5px 10px;
   }
 
-  .list__wrapper_D {
+  .list__wrapper_E {
     display: flex;
     justify-content: space-between;
     flex-wrap: wrap;
+    padding: 0 10px;
   }
 
-  .list-item_D {
+  .list-item_E {
     position: relative;
-    height: 100px;
-    width: 200px;
+    height: 104px;
+    width: 188px;
     background-repeat: no-repeat;
-    background-image: url(/@/assets/images/home-container/configurable/firehome/img-9.png);
+    background-image: url(/@/assets/images/home-container/configurable/dusthome/list_bg_1.png);
     background-size: 100% auto;
     background-position: center top;
     text-align: center;
     margin-bottom: 20px;
   }
-  .list-item__title_D {
-    position: absolute;
+  .list-item__title_E {
+    // position: absolute;
     width: 100%;
-    bottom: 0;
+    // top: 0;
+    font-size: 18px;
+    margin-top: 10px;
   }
-  .list-item__content_D:nth-of-type(2) {
+  .list-item__content_E:nth-of-type(2) {
     position: absolute;
-    top: 10%;
-    left: 10%;
-    width: 30%;
-    text-align: center;
+    top: 40%;
+    left: 5%;
+    text-align: left;
 
     .list-item__info {
       display: none;
@@ -275,12 +333,11 @@
       font-size: 18px;
     }
   }
-  .list-item__content_D:nth-of-type(3) {
+  .list-item__content_E:nth-of-type(3) {
     position: absolute;
-    top: 10%;
-    right: 10%;
-    width: 30%;
-    text-align: center;
+    top: 40%;
+    right: 5%;
+    text-align: right;
 
     .list-item__info {
       display: none;
@@ -290,44 +347,47 @@
     }
   }
 
-  // .list-item__title_B_O2 {
-  //   background-image: url(/@/assets/images/home-container/configurable/firehome/O₂.png);
-  // }
-  // .list-item__title_B_CH4 {
-  //   background-image: url(/@/assets/images/home-container/configurable/firehome/CH₄.png);
-  // }
-  // .list-item__title_B_CO {
-  //   background-image: url(/@/assets/images/home-container/configurable/firehome/CO.png);
-  // }
-  // .list-item__title_B_CO2 {
-  //   background-image: url(/@/assets/images/home-container/configurable/firehome/CO₂.png);
-  // }
+    // .list-item__title_B_O2 {
+    //   background-image: url(/@/assets/images/home-container/configurable/firehome/O₂.png);
+    // }
+    // .list-item__title_B_CH4 {
+    //   background-image: url(/@/assets/images/home-container/configurable/firehome/CH₄.png);
+    // }
+    // .list-item__title_B_CO {
+    //   background-image: url(/@/assets/images/home-container/configurable/firehome/CO.png);
+    // }
+    // .list-item__title_B_CO2 {
+    //   background-image: url(/@/assets/images/home-container/configurable/firehome/CO₂.png);
+    // }
 
-  // .list-item__label {
-  //   flex-basis: 55%;
-  // }
-  // .list-item__info {
-  //   flex-grow: 1;
-  // }
-  // .list-item__value {
-  //   flex-basis: 30%;
-  // }
-  .list-item__value_red {
-    color: red;
-  }
-  .list-item__value_orange {
-    color: orange;
-  }
-  .list-item__value_yellow {
-    color: yellow;
-  }
-  .list-item__value_green {
-    color: yellowgreen;
-  }
-  .list-item__value_blue {
-    color: #009bff;
-  }
-  .list-item__value_white {
-    color: white;
-  }
+    // .list-item__label {
+    //   flex-basis: 55%;
+    // }
+    // .list-item__info {
+    //   flex-grow: 1;
+    // }
+    // .list-item__value {
+    //   flex-basis: 30%;
+    // }
+    .list-item__value_red {
+      color: red;
+    }
+    .list-item__value_orange {
+      color: orange;
+    }
+    .list-item__value_yellow {
+      color: yellow;
+    }
+    .list-item__value_green {
+      color: yellowgreen;
+    }
+    .list-item__value_blue {
+      color: #009bff;
+    }
+    .list-item__value_white {
+      color: white;
+    }
+    .gallery-item__value_lightblue {
+      color: @vent-configurable-home-light-border;
+    }
 </style>

src/views/vent/home/configurable/components/detail/CustomChart.vue

@@ -411,6 +411,95 @@
       };
     }
 
+    // 柱状图，圆柱形样式
+    if (type === 'bar_cylinder') {
+      return {
+        textStyle,
+        grid: {
+          top: 40,
+          bottom: 50,
+        },
+        legend: {
+          textStyle,
+          show: legend.show,
+        },
+        tooltip: {
+          trigger: 'item',
+        },
+        xAxis: xAxis.map((e) => {
+          return {
+            ...e,
+            type: 'category',
+            axisLabel: {
+              interval: 0,
+              width: 800 / get(baseSeries, '[0].data.length', 1),
+              overflow: 'break',
+            },
+          };
+        }),
+        yAxis: yAxis.map((e) => {
+          return {
+            ...e,
+            splitLine: {
+              lineStyle: {
+                opacity: 0.1,
+              },
+            },
+          };
+        }),
+        series: baseSeries.reduce((curr: EChartsOption[], serie, index) => {
+          const colors = ['#66ffff', '#00ff66', '#ffff66'];
+          if (baseSeries.length === 1) {
+            curr.push({
+              ...serie,
+              type: 'pictorialBar',
+              symbol: 'circle',
+              symbolPosition: 'end',
+              symbolSize: [20, 10],
+              symbolOffset: [0, -5],
+              barGap: '-100%',
+              yAxisIndex: index,
+              itemStyle: {
+                color: ({ dataIndex }) => colors[dataIndex % colors.length],
+              },
+            });
+            curr.push({
+              ...serie,
+              type: 'pictorialBar',
+              symbol: 'circle',
+              symbolPosition: 'start',
+              symbolSize: [20, 10],
+              symbolOffset: [0, 5],
+              barGap: '-100%',
+              yAxisIndex: index,
+              itemStyle: {
+                color: ({ dataIndex }) => colors[dataIndex % colors.length],
+              },
+            });
+          }
+          curr.push({
+            ...serie,
+            type: 'bar',
+            silent: true,
+            yAxisIndex: index,
+            barWidth: 20,
+            barGap: '100%',
+            itemStyle: {
+              color: ({ dataIndex }) =>
+                new graphic.LinearGradient(0, 0, 0, 1, [
+                  { offset: 0, color: `${colors[dataIndex % colors.length]}44` },
+                  { offset: 0.5, color: colors[dataIndex % colors.length] },
+                  { offset: 1, color: colors[dataIndex % colors.length] },
+                ]),
+              borderRadius: [5, 5, 0, 0],
+            },
+          });
+
+          return curr;
+        }, []),
+      };
+    }
+
     return {};
   };
 

src/views/vent/home/configurable/components/detail/CustomGallery.vue

@@ -423,6 +423,58 @@
       center bottom;
   }
 
+  .gallery > .gallery-item_I {
+    width: 120px;
+    height: 30px;
+    position: absolute;
+    background-size: 100% auto;
+    background-repeat: no-repeat;
+    background-position: bottom;
+    background-image: url(/@/assets/images/home-container/configurable/dusthome/gallery_I_2.png);
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 0 10px;
+
+    .gallery-item__value {
+      font-size: 20px;
+    }
+  }
+  .gallery > .gallery-item_I:nth-child(2) {
+    top: calc(50% - 51px);
+    left: calc(50% - 200px);
+    width: 110px;
+    height: 102px;
+    line-height: 102px;
+    padding: 0;
+    background-image: url(/@/assets/images/home-container/configurable/dusthome/gallery_I_1.png);
+
+    .gallery-item__label {
+      display: none;
+    }
+    .gallery-item__value {
+      width: 100%;
+      text-align: center;
+      font-size: 24px;
+    }
+  }
+  .gallery > .gallery-item_I:nth-child(3) {
+    top: calc(50% - 35px);
+    left: calc(50% - 70px);
+  }
+  .gallery > .gallery-item_I:nth-child(4) {
+    top: calc(50% - 35px);
+    left: calc(50% + 70px);
+  }
+  .gallery > .gallery-item_I:nth-child(5) {
+    bottom: calc(50% - 35px);
+    left: calc(50% - 70px);
+  }
+  .gallery > .gallery-item_I:nth-child(6) {
+    bottom: calc(50% - 35px);
+    left: calc(50% + 70px);
+  }
+
   .gallery-item__value_red {
     color: red;
   }
@@ -441,4 +493,7 @@
   .gallery-item__value_white {
     color: white;
   }
+  .gallery-item__value_lightblue {
+    color: @vent-configurable-home-light-border;
+  }
 </style>

src/views/vent/home/configurable/components/detail/CustomList.vue

@@ -241,6 +241,71 @@
     font-size: 18px;
     color: aliceblue;
   }
+
+  .list_H {
+    background: none;
+  }
+  .list-item__content_H {
+    height: 50px;
+    background-repeat: no-repeat;
+    padding: 20px 50px 0 50px;
+    display: flex;
+    background-position: bottom;
+    background-size: 100% auto;
+    background-image: url(/@/assets/images/home-container/configurable/list_bg_h.png);
+    margin-bottom: 10px;
+    text-align: center;
+  }
+  .list-item__content_H > div {
+    flex-basis: 33.3%;
+  }
+
+  .list_I {
+    background: none;
+  }
+  .list__wrapper_I {
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: flex-start;
+  }
+  .list-item_I {
+    width: 160px;
+    height: 63px;
+    align-items: center;
+    text-align: center;
+    background-image: url('/@/assets/images/home-container/configurable/list_bg_i.png');
+    background-repeat: no-repeat;
+    background-size: auto 100%;
+    margin: 5px 10px;
+  }
+  .list-item__content_I {
+    position: relative;
+    width: 100%;
+    height: 100%;
+  }
+  .list-item__content_I > .list-item__label {
+    width: 60px;
+    height: 100%;
+    left: 0;
+    position: absolute;
+    font-size: 20px;
+    line-height: 63px;
+    color: #009bff;
+  }
+  .list-item__content_I > .list-item__info {
+    height: 50%;
+    left: 70px;
+    position: absolute;
+  }
+  .list-item__content_I > .list-item__value {
+    top: 50%;
+    height: 50%;
+    left: 70px;
+    // color: #00fbfe;
+    position: absolute;
+    font-size: 18px;
+  }
+
   // .list-item__icon_red {
   //   background-image: url('@/assets/images/home-container/configurable/warn_icon_5.png');
   // }
@@ -308,4 +373,7 @@
   .list-item__value_white {
     color: white;
   }
+  .gallery-item__value_lightblue {
+    color: @vent-configurable-home-light-border;
+  }
 </style>

src/views/vent/home/configurable/components/detail/CustomTable.vue

@@ -16,7 +16,7 @@
 </template>
 <script lang="ts" setup>
   import { computed, defineProps } from 'vue';
-  import _ from 'lodash-es';
+  import _ from 'lodash';
 
   let props = withDefaults(
     defineProps<{
@@ -140,6 +140,7 @@
     }
     .table__content_list_C {
       .table__content_list_row {
+        min-height: 50px;
         // background-position: center;
         background-size: 100% auto;
         background-repeat: no-repeat;

src/views/vent/home/configurable/components/detail/MiniBoard.vue

@@ -1,6 +1,6 @@
 <!-- eslint-disable vue/multi-word-component-names -->
 <template>
-  <div class="mini-board" :class="`mini-board_${type}`">
+  <div class="mini-board" :class="`mini-board_${type} mini-board_${type}_${getValueDecoClass(value)}`">
     <template v-if="layout === 'val-top'">
       <slot name="value">
         <div class="mini-board__value" :class="`mini-board__value_${type}`">
@@ -44,6 +44,22 @@
     }
   );
 
+  // 获取某些 value 对应的特殊的 装饰用的类名
+  function getValueDecoClass(value) {
+    switch (value) {
+      case '低风险':
+        return 'low_risk';
+      case '一般风险':
+        return 'risk';
+      case '较大风险':
+        return 'high_risk';
+      case '报警':
+        return 'warning';
+      default:
+        return '';
+    }
+  }
+
   defineEmits(['click']);
 </script>
 <style lang="less" scoped>
@@ -88,7 +104,7 @@
   }
   .mini-board_E {
     width: 30%;
-    height: 200px;
+    height: 180px;
     padding: 20px 5px;
     background-image: url('/@/assets/images/home-container/configurable/board_bg_1.png');
     background-position: center bottom;
@@ -111,6 +127,15 @@
     background-position: center bottom;
     background-repeat: no-repeat;
   }
+  .mini-board_H {
+    width: 174px;
+    height: 104px;
+    background-image: url('/@/assets/images/home-container/configurable/board_bg_3.png');
+    background-size: 100% auto;
+    background-position: center bottom;
+    background-repeat: no-repeat;
+    padding: 45px 0 0 0;
+  }
 
   .mini-board__value_A {
     color: @vent-gas-primary-text;
@@ -154,17 +179,14 @@
     line-height: 17px;
     height: 17px;
   }
-
   .mini-board__value_E {
     font-size: 20px;
     font-weight: bold;
-    margin-top: 30px;
-    // line-height: 76px;
   }
   .mini-board__label_E {
-    line-height: 17px;
-    height: 80px;
-    padding-top: 60px;
+    line-height: 20px;
+    height: 90px;
+    padding-top: 30%;
     background-repeat: no-repeat;
     background-position: center top;
   }
@@ -205,4 +227,17 @@
       background-image: url(/@/assets/images/home-container/configurable/dusthome/jdjl.png);
     }
   }
+
+  .mini-board_H_low_risk {
+    background-image: url('/@/assets/images/home-container/configurable/board_bg_3.png');
+  }
+  .mini-board_H_risk {
+    background-image: url('/@/assets/images/home-container/configurable/board_bg_2.png');
+  }
+  .mini-board_H_high_risk {
+    background-image: url('/@/assets/images/home-container/configurable/board_bg_5.png');
+  }
+  .mini-board_H_warning {
+    background-image: url('/@/assets/images/home-container/configurable/board_bg_4.png');
+  }
 </style>

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

@@ -132,6 +132,64 @@ export const getDisHome = (params) => {
         e.chval = e.chVal || 0;
       });
     }
+    if (res.obfObj) {
+      res.obfObj.obfObjModded = [
+        {
+          objType: '甲烷',
+          arrayDev: res.obfObj.arrayDev.map((e) => {
+            return {
+              strinstallpos: e.strinstallpos,
+              val: e.ch4Val || 0,
+            };
+          }),
+        },
+        {
+          objType: '一氧化碳',
+          arrayDev: res.obfObj.arrayDev.map((e) => {
+            return {
+              strinstallpos: e.strinstallpos,
+              val: e.coVal || 0,
+            };
+          }),
+        },
+        {
+          objType: '乙炔',
+          arrayDev: res.obfObj.arrayDev.map((e) => {
+            return {
+              strinstallpos: e.strinstallpos,
+              val: e.c2h2Val || 0,
+            };
+          }),
+        },
+        {
+          objType: '二氧化碳',
+          arrayDev: res.obfObj.arrayDev.map((e) => {
+            return {
+              strinstallpos: e.strinstallpos,
+              val: e.co2Val || 0,
+            };
+          }),
+        },
+        {
+          objType: '氧气',
+          arrayDev: res.obfObj.arrayDev.map((e) => {
+            return {
+              strinstallpos: e.strinstallpos,
+              val: e.o2Val || 0,
+            };
+          }),
+        },
+        {
+          objType: '乙烯',
+          arrayDev: res.obfObj.arrayDev.map((e) => {
+            return {
+              strinstallpos: e.strinstallpos,
+              val: e.c2h4Val || 0,
+            };
+          }),
+        },
+      ];
+    }
     return res;
   });
 };

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

@@ -158,11 +158,11 @@ export const testConfigBDDust: Config[] = [
         items: [
           {
             name: 'gallery',
-            basis: '20%',
+            basis: '30%',
           },
           {
             name: 'complex_list',
-            basis: '80%',
+            basis: '70%',
           },
         ],
       },
@@ -170,33 +170,33 @@ export const testConfigBDDust: Config[] = [
       chart: [],
       gallery: [
         {
-          type: 'F',
+          type: 'I',
           readFrom: 'dustManageInfo',
           items: [
             {
               label: '',
               value: '${totalNum}',
-              color: 'blue',
+              color: 'white',
             },
             {
               label: '低风险',
               value: '${dfxNum}',
-              color: 'blue',
+              color: 'lightblue',
             },
             {
               label: '一般风险',
               value: '${ybNum}',
-              color: 'blue',
+              color: 'lightblue',
             },
             {
               label: '较大风险',
               value: '${jdNum}',
-              color: 'blue',
+              color: 'lightblue',
             },
             {
               label: '重大风险',
               value: '${zdNum}',
-              color: 'blue',
+              color: 'lightblue',
             },
           ],
         },
@@ -206,7 +206,7 @@ export const testConfigBDDust: Config[] = [
       list: [],
       complex_list: [
         {
-          type: 'A',
+          type: 'E',
           readFrom: 'dustManageInfo.sysList',
           mapFromData: true,
           items: [
@@ -231,12 +231,81 @@ export const testConfigBDDust: Config[] = [
         },
       ],
       preset: [],
-      // mock: BDdustMock,
+      mock: BDdustMock,
     },
     showStyle: {
-      size: 'width:450px;height:750px;',
+      size: 'width:440px;height:460px;',
       version: '保德',
-      position: 'top:170px;left:0;',
+      position: 'top:170px;left:10px;',
+    },
+  },
+  {
+    deviceType: '',
+    moduleName: '设备信息',
+    pageType: '',
+    moduleData: {
+      header: {
+        show: false,
+        readFrom: '',
+        selector: {
+          show: false,
+          value: '',
+        },
+        slot: {
+          show: false,
+          value: '',
+        },
+      },
+      background: {
+        show: false,
+        type: 'video',
+        link: '',
+      },
+      layout: {
+        direction: 'row',
+        items: [
+          {
+            name: 'table',
+            basis: '100%',
+          },
+        ],
+      },
+      board: [],
+      chart: [],
+      gallery: [],
+      gallery_list: [],
+      table: [
+        {
+          type: 'A',
+          readFrom: '',
+          columns: [
+            {
+              name: '设备名称',
+              prop: 'name',
+            },
+            {
+              name: '连接状态',
+              prop: 'st',
+            },
+            {
+              name: '应用场景',
+              prop: 'sc',
+            },
+            {
+              name: '喷雾状态',
+              prop: 'pw',
+            },
+          ],
+        },
+      ],
+      list: [],
+      complex_list: [],
+      preset: [],
+    },
+    showStyle: {
+      size: 'width:440px;height:280px;',
+      version: '保德',
+      position: 'top:640px;left:10px;',
     },
   },
   {
@@ -294,12 +363,12 @@ export const testConfigBDDust: Config[] = [
       list: [],
       complex_list: [],
       preset: [],
-      // mock: BDdustMock,
+      mock: BDdustMock,
     },
     showStyle: {
-      size: 'width:1000px;height:280px;',
+      size: 'width:980px;height:280px;',
       version: '保德',
-      position: 'top:640px;left:460px',
+      position: 'bottom:8px;left:470px',
     },
   },
   {
@@ -369,12 +438,12 @@ export const testConfigBDDust: Config[] = [
       complex_list: [],
       preset: [],
       to: 'http://10.248.210.154:8801',
-      // mock: BDdustMock,
+      mock: BDdustMock,
     },
     showStyle: {
-      size: 'width:450px;height:280px;',
+      size: 'width:440px;height:300px;',
       version: '保德',
-      position: 'top:60px;right:0;',
+      position: 'top:60px;right:10px;',
     },
   },
   {
@@ -414,7 +483,7 @@ export const testConfigBDDust: Config[] = [
       gallery_list: [],
       table: [
         {
-          type: 'C',
+          type: 'A',
           readFrom: 'devGbsb',
           columns: [
             {
@@ -435,12 +504,12 @@ export const testConfigBDDust: Config[] = [
       list: [],
       complex_list: [],
       preset: [],
-      // mock: BDdustMock,
+      mock: BDdustMock,
     },
     showStyle: {
-      size: 'width:450px;height:280px;',
+      size: 'width:440px;height:280px;',
       version: '保德',
-      position: 'top:350px;right:0;',
+      position: 'top:370px;right:10px;',
     },
   },
   {
@@ -502,12 +571,12 @@ export const testConfigBDDust: Config[] = [
       list: [],
       complex_list: [],
       preset: [],
-      // mock: BDdustMock,
+      mock: BDdustMock,
     },
     showStyle: {
-      size: 'width:450px;height:280px;',
+      size: 'width:440px;height:260px;',
       version: '保德',
-      position: 'top:640px;right:0;',
+      position: 'top:660px;right:10px;',
     },
   },
 ];
@@ -5511,7 +5580,7 @@ export const testConfigBDFire: Config[] = [
       },
       board: [
         {
-          type: 'A',
+          type: 'H',
           readFrom: 'fireManageInfo',
           layout: 'label-top',
           items: [
@@ -5561,9 +5630,9 @@ export const testConfigBDFire: Config[] = [
       // mock: BDfireMock,
     },
     showStyle: {
-      size: 'width:450px;height:310px;',
+      size: 'width:440px;height:300px;',
       version: '保德',
-      position: 'top:170px;left:0;',
+      position: 'top:170px;left:10px;',
     },
   },
   {
@@ -5640,9 +5709,9 @@ export const testConfigBDFire: Config[] = [
       },
     },
     showStyle: {
-      size: 'width:450px;height:120px;',
+      size: 'width:440px;height:130px;',
       version: '保德',
-      position: 'top:490px;left:0;',
+      position: 'top:480px;left:10px;',
     },
   },
   {
@@ -5672,11 +5741,11 @@ export const testConfigBDFire: Config[] = [
         items: [
           {
             name: 'board',
-            basis: '30%',
+            basis: '35%',
           },
           {
             name: 'chart',
-            basis: '70%',
+            basis: '65%',
           },
         ],
       },
@@ -5727,9 +5796,9 @@ export const testConfigBDFire: Config[] = [
       // mock: BDfireMock,
     },
     showStyle: {
-      size: 'width:450px;height:300px;',
+      size: 'width:440px;height:300px;',
       version: '保德',
-      position: 'top:620px;left:0;',
+      position: 'top:620px;left:10px;',
     },
   },
   {
@@ -5759,11 +5828,11 @@ export const testConfigBDFire: Config[] = [
         items: [
           {
             name: 'list',
-            basis: '65%',
+            basis: '60%',
           },
           {
             name: 'blast_delta',
-            basis: '35%',
+            basis: '40%',
           },
         ],
       },
@@ -5774,7 +5843,7 @@ export const testConfigBDFire: Config[] = [
       table: [],
       list: [
         {
-          type: 'G',
+          type: 'I',
           readFrom: '',
           items: [
             {
@@ -5839,9 +5908,9 @@ export const testConfigBDFire: Config[] = [
       // mock: BDfireMock,
     },
     showStyle: {
-      size: 'width:1000px;height:300px;',
+      size: 'width:980px;height:300px;',
       version: '保德',
-      position: 'top:620px;left:460px',
+      position: 'bottom:8px;left:470px',
     },
   },
   {
@@ -5902,9 +5971,9 @@ export const testConfigBDFire: Config[] = [
       // mock: BDfireMock,
     },
     showStyle: {
-      size: 'width:1000px;height:280px;',
+      size: 'width:980px;height:280px;',
       version: '保德',
-      position: 'top:640px;left:460px',
+      position: 'bottom:8px;left:470px',
     },
   },
   {
@@ -5914,10 +5983,10 @@ export const testConfigBDFire: Config[] = [
     moduleData: {
       header: {
         show: true,
-        readFrom: 'arrayDev',
+        readFrom: 'obfObjModded',
         selector: {
           show: true,
-          value: '${strinstallpos}',
+          value: '${objType}',
         },
         slot: {
           show: false,
@@ -5933,53 +6002,29 @@ export const testConfigBDFire: Config[] = [
         direction: 'row',
         items: [
           {
-            name: 'board',
+            name: 'chart',
             basis: '100%',
           },
         ],
       },
-      board: [
+      board: [],
+      chart: [
         {
-          type: 'G',
-          layout: 'label-top',
+          type: 'bar_cylinder',
           readFrom: '',
-          items: [
-            {
-              label: '一氧化碳',
-              value: '${coVal}',
-            },
-            {
-              label: '二氧化碳',
-              value: '${co2Val}',
-            },
-            {
-              label: '氧气',
-              value: '${o2Val}',
-            },
-            {
-              label: '温度',
-              value: '${tempVal}',
-            },
-            {
-              label: '乙烯',
-              value: '${c2h4Val}',
-            },
-            {
-              label: '甲烷',
-              value: '${ch4Val}',
-            },
-            {
-              label: '乙炔',
-              value: '${c2h2Val}',
-            },
+          legend: { show: false },
+          xAxis: [{ show: true }],
+          yAxis: [{ show: true, name: '', position: 'left' }],
+          series: [
             {
-              label: '压差',
-              value: '${dpVal}',
+              readFrom: 'arrayDev',
+              xprop: 'strinstallpos',
+              yprop: 'val',
+              label: '',
             },
           ],
         },
       ],
-      chart: [],
       gallery: [],
       gallery_list: [],
       table: [],
@@ -5989,9 +6034,9 @@ export const testConfigBDFire: Config[] = [
       // mock: BDfireMock,
     },
     showStyle: {
-      size: 'width:450px;height:230px;',
+      size: 'width:440px;height:230px;',
       version: '保德',
-      position: 'top:170px;right:0;',
+      position: 'top:170px;right:10px;',
     },
   },
   {
@@ -6063,7 +6108,7 @@ export const testConfigBDFire: Config[] = [
       table: [],
       list: [
         {
-          type: 'F',
+          type: 'H',
           readFrom: 'arrayCount',
           items: [
             {
@@ -6092,9 +6137,9 @@ export const testConfigBDFire: Config[] = [
       // mock: BDfireMock,
     },
     showStyle: {
-      size: 'width:450px;height:240px;',
+      size: 'width:440px;height:240px;',
       version: '保德',
-      position: 'top:410px;right:0;',
+      position: 'top:410px;right:10px;',
     },
   },
   {
@@ -6159,12 +6204,12 @@ export const testConfigBDFire: Config[] = [
       list: [],
       complex_list: [],
       preset: [],
-      // mock: BDfireMock,
+      mock: BDfireMock,
     },
     showStyle: {
-      size: 'width:450px;height:260px;',
+      size: 'width:440px;height:260px;',
       version: '保德',
-      position: 'top:660px;right:0;',
+      position: 'top:660px;right:10px;',
     },
   },
 ];
@@ -6267,9 +6312,9 @@ export const testConfigBDNew: Config[] = [
   //     // mock: BDfireMock,
   //   },
   //   // showStyle: {
-  //   //   size: 'width:450px;height:760px;',
+  //   //   size: 'width:440px;height:760px;',
   //   //   version: '保德',
-  //   //   position: 'top:160px;left:0;',
+  //   //   position: 'top:160px;left:10px;',
   //   // },
   //   showStyle: {
   //     size: 'width:1000px;height:280px;',
@@ -6373,9 +6418,9 @@ export const testConfigBDNew: Config[] = [
   //     // mock: BDfireMock,
   //   },
   //   showStyle: {
-  //     size: 'width:450px;height:760px;',
+  //     size: 'width:440px;height:760px;',
   //     version: '保德',
-  //     position: 'top:160px;left:0;',
+  //     position: 'top:160px;left:10px;',
   //   },
   // },
   // {
@@ -6705,7 +6750,7 @@ export const testConfigBDNew: Config[] = [
   //     },
   //   },
   //   showStyle: {
-  //     size: 'width:450px;height:570px;',
+  //     size: 'width:440px;height:570px;',
   //     version: '新版',
   //     position: 'top:60px;right:0;',
   //   },
@@ -6803,7 +6848,7 @@ export const testConfigBDNew: Config[] = [
   //     // mock: BDfireMock,
   //   },
   //   showStyle: {
-  //     size: 'width:450px;height:280px;',
+  //     size: 'width:440px;height:280px;',
   //     version: '保德',
   //     position: 'top:640px;right:0;',
   //   },

src/views/vent/home/configurable/dustBD.vue

@@ -66,18 +66,18 @@
   import ModuleBD from './components/ModuleBD.vue';
   import VentModal from '/@/components/vent/micro/ventModal.vue';
   import { getDisHome } from './configurable.api';
+  import { testConfigBDDust } from './configurable.data.bd';
   // import { getToken } from '/@/utils/auth';
 
   const { configs, fetchConfigs } = useInitConfigs();
-  const { mainTitle, data, updateData, updateEnhancedConfigs } = useInitPage('保德煤矿粉尘灾害预警系统');
+  const { mainTitle, data, updateData } = useInitPage('保德煤矿粉尘灾害预警系统');
   let interval: number | undefined;
   // function hideLoading() {
   //   loading.value = false;
   // }
   onMounted(() => {
     fetchConfigs('BD_dust').then(() => {
-      // configs.value = testConfigVent;
-      updateEnhancedConfigs(configs.value);
+      configs.value = testConfigBDDust;
 
       getDisHome({
         dataList: configs.value
@@ -177,7 +177,8 @@
     position: absolute;
     height: 115px;
     top: 50px;
-    width: 450px;
+    left: 10px;
+    width: 440px;
     background-image: url('/@/assets/images/home-container/configurable/firehome/qkjaq.png');
     background-color: #000723;
     background-repeat: no-repeat;

src/views/vent/home/configurable/fireBD.vue

@@ -35,12 +35,10 @@
     </div>
     <div class="right-t">
       <div class="tcontent-l" @click="redirectTo('/grout-home')">
-        <div>智能</div>
-        <div>注浆系统</div>
+        <div>智能注浆系统</div>
       </div>
       <div class="tcontent-r" @click="redirectTo('/nitrogen-home')">
-        <div>智能</div>
-        <div>注氮系统</div>
+        <div>智能注氮系统</div>
       </div>
     </div>
     <ModuleBD
@@ -54,6 +52,7 @@
       :visible="true"
     />
     <ModuleBDDual
+      v-if="cfgA && cfgB"
       :show-style="cfgA.showStyle"
       :module-data-a="cfgA.moduleData"
       :module-name-a="cfgA.moduleName"
@@ -76,9 +75,9 @@
   import { useInitConfigs, useInitPage } from './hooks/useInit';
   import ModuleBD from './components/ModuleBD.vue';
   import ModuleBDDual from './components/ModuleBDDual.vue';
-  // import { testConfigBDFire } from './configurable.data';
   import VentModal from '/@/components/vent/micro/ventModal.vue';
   import { getDisHome } from './configurable.api';
+  // import { testConfigBDFire } from './configurable.data.bd';
   // import { getToken } from '/@/utils/auth';
 
   const cfgs = computed(() =>
@@ -97,15 +96,14 @@
     })
   );
   const { configs, fetchConfigs } = useInitConfigs();
-  const { mainTitle, data, updateData, updateEnhancedConfigs } = useInitPage('保德煤矿火灾预警系统');
+  const { mainTitle, data, updateData } = useInitPage('保德煤矿火灾预警系统');
   let interval: number | undefined;
   // function hideLoading() {
   //   loading.value = false;
   // }
   onMounted(() => {
     fetchConfigs('BD_fire').then(() => {
-      // configs.value = testConfigVent;
-      updateEnhancedConfigs(configs.value);
+      // configs.value = testConfigBDFire;
 
       getDisHome({
         dataList: configs.value
@@ -209,6 +207,7 @@
     position: absolute;
     height: 115px;
     top: 40px;
+    left: 5px;
     width: 450px;
     background-image: url('/@/assets/images/home-container/configurable/firehome/qkjaq.png');
     background-color: #000723;
@@ -269,7 +268,7 @@
     position: absolute;
     // height: 160px;
     height: 115px;
-    right: 0;
+    right: 5px;
     top: 50px;
     width: 450px;
     background-image: url('/@/assets/images/home-container/configurable/firehome/common-border2.png');
@@ -287,36 +286,24 @@
       height: 100%;
       font-size: 16px;
       font-weight: bold;
-      background-image: url(/@/assets/images/home-container/configurable/firehome/img-5.png),
-        url(/@/assets/images/home-container/configurable/firehome/ggxt.png);
-      background-size:
-        auto 100%,
-        auto auto;
+      background-image: url(/@/assets/images/home-container/configurable/firehome/znzjxt.png);
+      background-size: auto 100%;
       background-repeat: no-repeat;
-      background-position:
-        center,
-        center top;
+      background-position: center;
       text-align: center;
-      padding-top: 35px;
-      line-height: 40px;
+      padding-top: 85px;
     }
     .tcontent-r {
       flex: 1;
       height: 100%;
       font-size: 16px;
       font-weight: bold;
-      background-image: url(/@/assets/images/home-container/configurable/firehome/img-5.png),
-        url(/@/assets/images/home-container/configurable/firehome/zjxt.png);
-      background-size:
-        auto 100%,
-        auto auto;
+      background-image: url(/@/assets/images/home-container/configurable/firehome/znzdxt.png);
+      background-size: auto 100%;
       background-repeat: no-repeat;
-      background-position:
-        center,
-        center top;
+      background-position: center;
       text-align: center;
-      padding-top: 35px;
-      line-height: 40px;
+      padding-top: 85px;
     }
   }
 

src/views/vent/home/configurable/index.vue

@@ -15,87 +15,120 @@
     </a-dropdown> -->
     <!-- 采用定位方式以避免出现各个模块隐藏时其他模块下移的问题 -->
 
-    <template v-if="isOriginal">
-      <ModuleOriginal
-        v-for="cfg in configs"
-        :key="cfg.deviceType"
-        :show-style="cfg.showStyle"
-        :module-data="cfg.moduleData"
-        :module-name="cfg.moduleName"
-        :device-type="cfg.deviceType"
-        :data="data"
-        :visible="true"
-      />
-    </template>
-    <template v-else-if="isCommon">
-      <ModuleCommon
-        v-for="cfg in configs"
-        :key="cfg.deviceType"
-        :show-style="cfg.showStyle"
-        :module-data="cfg.moduleData"
-        :module-name="cfg.moduleName"
-        :device-type="cfg.deviceType"
-        :data="data"
-        :visible="true"
-      />
-    </template>
-    <template v-else>
-      <!-- 下面是正常展示的各新版模块 -->
-      <ModuleEnhanced
-        v-for="cfg in enhancedConfigs"
-        :key="cfg.deviceType"
-        :visible="cfg.visible"
-        :show-style="cfg.showStyle"
-        :module-data="cfg.moduleData"
-        :module-name="cfg.moduleName"
-        :device-type="cfg.deviceType"
-        :data="data"
-        @close="cfg.visible = false"
-      />
-      <!-- 下面是用于呼出已隐藏的模块的按钮 -->
-      <div class="pos-absolute top-70px left-460px z-3">
-        <div v-for="(item, i) in hiddenList" :key="`vvhchg${i}`">
-          <AButton class="module-trigger-button" @click="item.visible = true">{{ item.moduleName }}</AButton>
+    <div class="left-t">
+      <div class="tcontent-area">
+        <div class="tcontent-l">
+          <div>监测</div>
+          <div>区域</div>
         </div>
+        <div class="tcontent-c">
+          <div style="margin-bottom: 15px; color: #009bff; font-size: 24px; font-weight: bolder; letter-spacing: 10px">
+            {{ data.fireAllMineWarn }}
+          </div>
+          <div style="color: #fff; font-size: 12px">自燃倾向性等级 : 自燃</div>
+        </div>
+        <div class="tcontent-r">
+          <div>火灾</div>
+          <div>风险</div>
+        </div>
+      </div>
+    </div>
+    <div class="right-t">
+      <div class="tcontent-l" @click="redirectTo('/grout-home')">
+        <div>智能注浆系统</div>
+      </div>
+      <div class="tcontent-r" @click="redirectTo('/nitrogen-home')">
+        <div>智能注氮系统</div>
       </div>
-    </template>
-    <div style="width: 1000px; height: 570px; position: absolute; left: calc(50% - 500px); top: 60px">
+    </div>
+    <ModuleBD
+      v-for="cfg in cfgs"
+      :key="cfg.deviceType"
+      :show-style="cfg.showStyle"
+      :module-data="cfg.moduleData"
+      :module-name="cfg.moduleName"
+      :device-type="cfg.deviceType"
+      :data="data"
+      :visible="true"
+    />
+    <ModuleBDDual
+      v-if="cfgA && cfgB"
+      :show-style="cfgA.showStyle"
+      :module-data-a="cfgA.moduleData"
+      :module-name-a="cfgA.moduleName"
+      :device-type-a="cfgA.deviceType"
+      :module-data-b="cfgB.moduleData"
+      :module-name-b="cfgB.moduleName"
+      :device-type-b="cfgB.deviceType"
+      :data="data"
+      :visible="true"
+    />
+    <div style="width: 1000px; height: 550px; position: absolute; left: calc(50% - 500px); top: 60px">
       <VentModal />
     </div>
   </div>
 </template>
 <script lang="ts" setup>
-  import { onMounted, onUnmounted } from 'vue';
+  import { computed, onMounted, onUnmounted } from 'vue';
   // import { CaretDownOutlined } from '@ant-design/icons-vue';
   // import MonitorCenter from './components/MonitorCenter.vue';
   import { useInitConfigs, useInitPage } from './hooks/useInit';
-  import ModuleEnhanced from './components/ModuleEnhanced.vue';
-  import ModuleOriginal from './components/ModuleOriginal.vue';
-  import ModuleCommon from './components/ModuleCommon.vue';
-  // import { useRoute } from 'vue-router';
+  import ModuleBD from './components/ModuleBD.vue';
+  import ModuleBDDual from './components/ModuleBDDual.vue';
   import VentModal from '/@/components/vent/micro/ventModal.vue';
-  import { getHomeData } from './configurable.api';
-  import { testConfigVent } from './configurable.data';
+  import { getDisHome } from './configurable.api';
+  import { testConfigBDFire } from './configurable.data.bd';
+  // import { getToken } from '/@/utils/auth';
 
-  const { configs, isOriginal, isCommon, fetchConfigs } = useInitConfigs();
-  const { mainTitle, enhancedConfigs, hiddenList, data, updateData, updateEnhancedConfigs } = useInitPage('智能通风管控系统');
+  const cfgs = computed(() =>
+    configs.value.filter((_, index) => {
+      return index !== 4 && index !== 3;
+    })
+  );
+  const cfgA = computed<any>(() =>
+    configs.value.find((_, index) => {
+      return index === 3;
+    })
+  );
+  const cfgB = computed<any>(() =>
+    configs.value.find((_, index) => {
+      return index === 4;
+    })
+  );
+  const { configs, fetchConfigs } = useInitConfigs();
+  const { mainTitle, data, updateData } = useInitPage('保德煤矿火灾预警系统');
   let interval: number | undefined;
-
+  // function hideLoading() {
+  //   loading.value = false;
+  // }
   onMounted(() => {
-    // fetchConfigs('vent').then(() => {
-    configs.value = testConfigVent;
-    updateEnhancedConfigs(configs.value);
+    // fetchConfigs('BD_fire').then(() => {
+    configs.value = testConfigBDFire;
 
-    getHomeData({}).then(updateData);
+    getDisHome({
+      dataList: configs.value
+        .map((e) => e.deviceType)
+        .concat('fireAllMineWarn')
+        .join(','),
+    }).then(updateData);
     // });
-    setInterval(() => {
-      getHomeData({}).then(updateData);
-    }, 6000);
+    // setInterval(() => {
+    //   getDisHome({
+    //     dataList: configs.value
+    //       .map((e) => e.deviceType)
+    //       .concat('fireAllMineWarn')
+    //       .join(','),
+    //   }).then(updateData);
+    // }, 60000);
   });
 
   onUnmounted(() => {
     clearInterval(interval);
   });
+
+  function redirectTo(url) {
+    window.open(url);
+  }
 </script>
 <style lang="less" scoped>
   @font-face {
@@ -108,18 +141,18 @@
     height: 100%;
     color: @white;
     position: relative;
-    // background: url('@/assets/images/home-container/configurable/firehome/bg.png') no-repeat center;
+    background: url('@/assets/images/home-container/configurable/firehome/bg.png') no-repeat center;
 
     .top-bg {
       width: 100%;
-      height: 56px;
-      background: url('@/assets/images/vent/home/modal-top.png') no-repeat center;
+      height: 86px;
+      background: url(/@/assets/images/home-container/configurable/firehome/fire-title.png) no-repeat center;
       position: absolute;
       z-index: 1;
       .main-title {
-        height: 56px;
+        height: 86px;
         font-family: 'douyuFont';
-        font-size: 20px;
+        font-size: 26px;
         letter-spacing: 2px;
         display: flex;
         justify-content: center;
@@ -129,13 +162,13 @@
 
     // .module-left {
     //   position: absolute;
-    //   width: 450px;
+    //   width: 440px;
     //   height: 280px;
     //   left: 0;
     // }
     // .module-right {
     //   position: absolute;
-    //   width: 450px;
+    //   width: 440px;
     //   height: 280px;
     //   right: 0;
     // }
@@ -169,6 +202,111 @@
       border-bottom: 2px solid #3df6ff;
     }
   }
+
+  .left-t {
+    position: absolute;
+    height: 115px;
+    top: 40px;
+    left: 10px;
+    width: 440px;
+    background-image: url('/@/assets/images/home-container/configurable/firehome/qkjaq.png');
+    background-color: #000723;
+    background-repeat: no-repeat;
+    background-position: center;
+    background-size: 100% 100%;
+
+    .tcontent-area {
+      display: flex;
+      position: absolute;
+      top: 50%;
+      left: 0;
+      box-sizing: border-box;
+      align-items: center;
+      justify-content: space-around;
+      width: 100%;
+      height: 70px;
+      padding: 0 15px;
+      transform: translate(0, -40%);
+
+      .tcontent-l {
+        display: flex;
+        flex: 1;
+        flex-direction: column;
+        align-items: center;
+        justify-content: center;
+        height: 100%;
+        color: #9da5aa;
+        font-size: 14px;
+        font-weight: bold;
+        letter-spacing: 2px;
+      }
+
+      .tcontent-c {
+        display: flex;
+        flex: 3;
+        flex-direction: column;
+        align-items: center;
+        justify-content: center;
+        height: 100%;
+      }
+
+      .tcontent-r {
+        display: flex;
+        flex: 1;
+        flex-direction: column;
+        align-items: center;
+        justify-content: center;
+        height: 100%;
+        color: #9da5aa;
+        font-size: 14px;
+        font-weight: bold;
+        letter-spacing: 2px;
+      }
+    }
+  }
+  .right-t {
+    position: absolute;
+    // height: 160px;
+    height: 115px;
+    right: 10px;
+    top: 50px;
+    width: 440px;
+    background-image: url('/@/assets/images/home-container/configurable/firehome/common-border2.png');
+    background-color: #000723;
+    background-repeat: no-repeat;
+    background-position: center;
+    background-size: 100% 100%;
+    display: flex;
+    align-items: center;
+    justify-content: space-around;
+    z-index: 1;
+
+    .tcontent-l {
+      flex: 1;
+      height: 100%;
+      font-size: 16px;
+      font-weight: bold;
+      background-image: url(/@/assets/images/home-container/configurable/firehome/znzjxt.png);
+      background-size: auto 100%;
+      background-repeat: no-repeat;
+      background-position: center;
+      text-align: center;
+      padding-top: 85px;
+    }
+    .tcontent-r {
+      flex: 1;
+      height: 100%;
+      font-size: 16px;
+      font-weight: bold;
+      background-image: url(/@/assets/images/home-container/configurable/firehome/znzdxt.png);
+      background-size: auto 100%;
+      background-repeat: no-repeat;
+      background-position: center;
+      text-align: center;
+      padding-top: 85px;
+    }
+  }
+
   :deep(.loading-box) {
     position: unset;
   }

src/views/vent/safetyList/common/detail.vue

@@ -43,43 +43,91 @@
                 </div>
                 <!-- 监测详情 -->
                 <div class="detail-content" v-if="activeKey == 'manageAuto'">
-                    <a-table size="small" :scroll="{ y: 710 }" :columns="columnsDetail" :data-source="tableData"
-                        :pagination="pagination" @change="pageChange">
+                    <div class="search-area">
+                        <span style="color:#fff">分站：</span>
+                        <a-select v-model:value="searchStationId" style="width: 240px;margin-right: 10px;">
+                            <a-select-option v-for="file in stationList" :key="file.label" :value="file.value">{{
+                                file.label }}</a-select-option>
+                        </a-select>
+                        <a-button type="primary" preIcon="ant-design:search-outlined" style="margin-right: 15px"
+                            @click="getSearch">查询</a-button>
+                        <a-button preIcon="ant-design:sync-outlined" @click="getReset">重置</a-button>
+                    </div>
+                    <a-table size="small" :scroll="{ y: 680 }" :columns="columnsDetail" :data-source="tableData">
                         <template #action="{ record }">
-                            <!-- <a-button v-if="!record.devInfoList" type="primary" :disabled="record.linkId != '0'"
-                                size="small" @click="handlerunDeviceMonitor(record, '启动')">启动</a-button>
-                            <a-button type="success" size="small" style="margin: 0px 10px"
-                                @click="handlerunDeviceMonitor(record, '编辑')">编辑</a-button> -->
                             <a-button type="primary" size="small" @click="handleEdit(record)">编辑</a-button>
                         </template>
-                        <template #bodyCell="{ column, text }">
-                            <template v-if="column.dataIndex === 'valueJc' && text">
-                                <div v-for="item in text.split(',')" :key="item">
-                                    <span
-                                        v-if="item.substring(item.indexOf(':') + 1) && !isNaN(parseFloat(item.substring(item.indexOf(':') + 1)))"
-                                        style="display: inline-block;width: 45%;text-align: right; color:rgb(0, 242, 255);margin-right:5px">{{
-                                            item.substring(0, item.indexOf(':') + 1) }}</span>
-                                    <span
-                                        v-if="item.substring(item.indexOf(':') + 1) && !isNaN(parseFloat(item.substring(item.indexOf(':') + 1)))"
-                                        style="display: inline-block; width:50%;text-align: left; color:#fff">{{
-                                            item.substring(item.indexOf(':') + 1) === '1' ? '正风' :
-                                                item.substring(item.indexOf(':') + 1) === '2' ?
-                                                    '反风' : item.substring(item.indexOf(':') + 1) }} </span>
-                                </div>
-                            </template>
-
-                        </template>
+                        <template #bodyCell="{ column, text }"></template>
                     </a-table>
                     <!-- 编辑弹窗 -->
-                    <a-modal  v-model:visible="visibleModalEdit" :width="650" title="编辑信息"
-                        @ok="handleOkEdit" @cancel="handleCancelEdit">
+                    <a-modal v-model:visible="visibleModalEdit" centered :width="650" title="编辑信息" :footer="null">
                         <a-form :model="formEdit" labelAlign="right" :label-col="{ span: 7 }"
                             :wrapper-col="{ span: 17 }">
-                            <a-form-item label="安装位置">
-                                <a-input v-model:value="formEdit.address" placeholder="请输入"
+                            <!-- <a-form-item label="日时：">
+                                <a-select v-model:value="formEdit.rs"   style="width: 260px;margin-right: 10px;">
+                                    <a-select-option v-for="file in timeList" :key="file.label"
+                                        :value="file.value">{{
+                                            file.label }}</a-select-option>
+                                </a-select>
+                                <a-button type="primary">下发</a-button>
+                            </a-form-item>
+                            <a-form-item label="分秒：">
+                                <a-input v-model:value="formEdit.fm" placeholder="请输入"
+                                    style="width: 260px;margin-right: 10px;" />
+                                <a-button type="primary">下发</a-button>
+                            </a-form-item> -->
+                            <!-- <a-form-item label="年月：">
+                                <a-date-picker v-model:value="formEdit.ny" placeholder="请输入"
+                                    style="width: 260px;margin-right: 10px;" />
+                                <a-button type="primary">下发</a-button>
+                            </a-form-item> -->
+                            <a-form-item label="软件版本：">
+                                <a-input v-model:value="formEdit.rjbb" placeholder="请输入"
+                                    style="width: 260px;margin-right: 10px;" />
+                                <a-button type="primary" @click="handleClick('软件版本')">下发</a-button>
+                            </a-form-item>
+                            <a-form-item label="硬件版本：">
+                                <a-input v-model:value="formEdit.yjbb" placeholder="请输入"
+                                    style="width: 260px;margin-right: 10px;" />
+                                <a-button type="primary" @click="handleClick('硬件版本')">下发</a-button>
+                            </a-form-item>
+                            <a-form-item label="电池额定容量：">
+                                <a-input v-model:value="formEdit.dcedrl" placeholder="请输入"
                                     style="width: 260px;margin-right: 10px;" />
-                                    <a-button type="primary" >下发</a-button>
+                                <a-button type="primary" @click="handleClick('电池额定容量')">下发</a-button>
                             </a-form-item>
+                            <a-form-item label="四个字节保存密码：">
+                                <a-input v-model:value="formEdit.sgzjbcmm" placeholder="请输入"
+                                    style="width: 260px;margin-right: 10px;" />
+                                <a-button type="primary" @click="handleClick('四个字节保存密码')">下发</a-button>
+                            </a-form-item>
+                            <a-form-item label="第一路485波特率：">
+                                <a-input v-model:value="formEdit.dyl485btl" placeholder="请输入"
+                                    style="width: 260px;margin-right: 10px;" />
+                                <a-button type="primary" @click="handleClick('第一路485波特率')">下发</a-button>
+                            </a-form-item>
+                            <a-form-item label="维护性放电：">
+                                <a-select v-model:value="formEdit.whxfd" style="width: 260px;margin-right: 10px;">
+                                    <a-select-option v-for="file in whxfdList" :key="file.label" :value="file.value">{{
+                                        file.label }}</a-select-option>
+                                </a-select>
+                                <a-button type="primary" @click="handleClick('维护性放电')">下发</a-button>
+                            </a-form-item>
+                            <a-form-item label="近程断电控制1：">
+                                <a-select v-model:value="formEdit.jcddkz1" style="width: 260px;margin-right: 10px;">
+                                    <a-select-option v-for="file in jcddkzList" :key="file.label" :value="file.value">{{
+                                        file.label }}</a-select-option>
+                                </a-select>
+                                <a-button type="primary" @click="handleClick('近程断电控制1')">下发</a-button>
+                            </a-form-item>
+                            <a-form-item label="近程断电控制2：">
+                                <a-select v-model:value="formEdit.jcddkz2" style="width: 260px;margin-right: 10px;">
+                                    <a-select-option v-for="file in jcddkzList" :key="file.label" :value="file.value">{{
+                                        file.label }}</a-select-option>
+                                </a-select>
+                                <a-button type="primary" @click="handleClick('近程断电控制2')">下发</a-button>
+                            </a-form-item>
+
                         </a-form>
                     </a-modal>
                 </div>
@@ -90,7 +138,7 @@
 
 <script setup lang="ts">
 import { ref, nextTick, reactive, onMounted, onUnmounted } from 'vue';
-import { subStationList, getList, getEdit, runDeviceMonitor, update158DevName, updateDebugStatus } from '../safetyList.api';
+import { subStationList, getList, getEdit, runDeviceMonitor, update158DevName, updateDebugStatus, get158StationData, set158StationData } from '../safetyList.api';
 import { columnsDetail } from '../safetyList.data'
 import customHeader from '/@/components/vent/customHeader.vue';
 
@@ -109,18 +157,39 @@ let clsoeNum = ref(0)
 let stationId = ref(null)
 let tableData = ref<any[]>([])
 //分页参数配置
-let pagination = reactive({
-    current: 1, // 当前页码
-    pageSize: 20, // 每页显示条数
-    total: 0, // 总条目数，后端返回
-    // showTotal: (total, range) => `${range[0]}-${range[1]} 条，总共 ${total} 条`, // 分页右下角显示信息
-    showSizeChanger: true, // 是否可改变每页显示条数
-    pageSizeOptions: ['10', '20', '30', '40', '50', '100'], // 可选的每页显示条数
-});
-let visibleModalEdit=ref(false)
-let formEdit=reactive({
-    address:'',
+// let pagination = reactive({
+//     current: 1, // 当前页码
+//     pageSize: 20, // 每页显示条数
+//     total: 0, // 总条目数，后端返回
+//     // showTotal: (total, range) => `${range[0]}-${range[1]} 条，总共 ${total} 条`, // 分页右下角显示信息
+//     showSizeChanger: true, // 是否可改变每页显示条数
+//     pageSizeOptions: ['10', '20', '30', '40', '50', '100'], // 可选的每页显示条数
+// });
+let visibleModalEdit = ref(false)
+let formEdit = reactive({
+    id: '',
+    rs: '',
+    fm: '',
+    ny: '',
+    rjbb: '',
+    yjbb: '',
+    sgzjbcmm: '',
+    dyl485btl: '',
+    whxfd: '',
+    jcddkz1: '',
+    jcddkz2: '',
+    dcedrl: '',
 })
+let whxfdList = reactive<any[]>([
+    { label: '维护放电开启', value: '1' },
+    { label: '维护放电关闭', value: '0' },
+])
+let jcddkzList = reactive<any[]>([
+    { label: '控制', value: '1' },
+    { label: '不控制', value: '0' },
+])
+let searchStationId = ref('')
+let stationList = reactive<any[]>([])
 
 //tab选项切换
 function onChangeTab(tab) {
@@ -128,9 +197,13 @@ function onChangeTab(tab) {
 }
 //获取分站实时监测信息
 async function getSubStationList() {
+    stationList.length = 0
     let res = await subStationList({ strtype: "modbus" })
     if (res.length != 0) {
         cardList.value = res
+        res.forEach(el => {
+            stationList.push({ label: el.strinstallpos, value: el.id })
+        })
         openNum.value = cardList.value?.filter(v => v.linkstatus == 1)['length']
         clsoeNum.value = cardList.value?.filter(v => v.linkstatus == 0)['length']
     } else {
@@ -160,43 +233,98 @@ function changeStatus(val) {
 }
 //获取详细信息列表
 async function getStationList() {
-    let res = await getList({ subId: stationId.value, pageNo: pagination.current, pageSize: pagination.pageSize, })
-    res.forEach(el => {
-        el.key = el.id
-        el.linkstatusC = el.linkstatus ? '连接' : '未连接'
-        el.gdmsC = el.gdms == '1' ? '直流供电' : el.gdms == '0' ? '交流供电' : ''
-        el.debugTitle = '调试'
-        el.children = el.devInfoList
-        el.children.forEach(v => {
-            v.key = v.id
-            v.linkstatus = v.linkId
-            v.debugTitle = '调试'
-            v.linkstatusC = v.linkstatus == '0' ? '待启用' : v.linkstatus == '1' ? '连接' : '断开'
-            v.updateTime = v.time
-            v.gdmsC = v.gdms == '1' ? '直流供电' : v.gdms == '0' ? '交流供电' : ''
-            v.valueJc = `风向:${v.forward || ''},风量:${v.m3 || ''}m³/min,风速:${v.windSpeed || ''}m/s,气压:${v.pa || ''}Pa,压差:${v.difPress || ''}Pa,温度:${v.temperature || ''}℃,湿度:${v.humidity || ''}%,断面积:${v.area || ''}㎡`
-        })
-    })
-    tableData.value = res
-    pagination.total = res.total
+    tableData.value.length = 0
+    let res = await get158StationData({ stationId: searchStationId.value })
+    res.dqgdfsC = res.dqgdfs == '1' ? '交流供电' : res.dqgdfs == '0' ? '电池供电' : ''
+    res.kgdwztC = res.kgdwzt == '1' ? '开启' : res.kgdwzt == '0' ? '关闭' : ''
+    res.dccfdztC = res.dccfdzt == '0' ? '充电' : res.dccfdzt == '1' ? '放电' : res.dccfdzt == '2' ? '不充不放' : ''
+    res.whxfdC = res.whxfd == '1' ? '维护放电开启' : res.whxfd == '0' ? '维护放电关闭' : ''
+    res.jcddkz1C = res.jcddkz1 == '1' ? '控制' : res.jcddkz1 == '0' ? '不控制' : ''
+    res.jcddkz2C = res.jcddkz2 == '1' ? '控制' : res.jcddkz2 == '0' ? '不控制' : ''
+    tableData.value.push(res)
+    // tableData.value = res
+    // pagination.total = res.total
 }
-//分页切换
-function pageChange(val) {
-    pagination.current = val.current;
-    pagination.pageSize = val.pageSize;
-    getStationList();
+//查询
+function getSearch() {
+    getStationList()
+}
+//重置
+function getReset() {
+    searchStationId.value=''
+    getStationList()
 }
+//分页切换
+// function pageChange(val) {
+//     pagination.current = val.current;
+//     pagination.pageSize = val.pageSize;
+//     getStationList();
+// }
 //编辑
 function handleEdit(record) {
-    visibleModalEdit.value=true
+    visibleModalEdit.value = true
+    formEdit = {
+        id: record.id,
+        rs: record.rs,
+        fm: record.fm,
+        ny: record.ny,
+        rjbb: record.rjbb,
+        yjbb: record.yjbb,
+        sgzjbcmm: record.sgzjbcmm,
+        dyl485btl: record.dyl485btl,
+        whxfd: record.whxfd,
+        jcddkz1: record.jcddkz1,
+        jcddkz2: record.jcddkz2,
+        dcedrl: record.dcedrl,
+    }
 }
-//编辑确认
-function handleOkEdit(){}
-//编辑取消
-function handleCancelEdit(){
-    visibleModalEdit.value=false
+//下发
+async function handleClick(data) {
+    switch (data) {
+        case '软件版本':
+            await set158StationData({ stationId: formEdit.id, plcCode: 'rjbb', value: formEdit.rjbb })
+            visibleModalEdit.value = false
+            getStationList()
+            break;
+        case '硬件版本':
+            await set158StationData({ stationId: formEdit.id, plcCode: 'yjbb', value: formEdit.yjbb })
+            visibleModalEdit.value = false
+            getStationList()
+            break;
+        case '电池额定容量':
+            await set158StationData({ stationId: formEdit.id, plcCode: 'dcedrl', value: formEdit.dcedrl })
+            visibleModalEdit.value = false
+            getStationList()
+            break;
+        case '四个字节保存密码':
+            await set158StationData({ stationId: formEdit.id, plcCode: 'sgzjbcmm', value: formEdit.sgzjbcmm })
+            visibleModalEdit.value = false
+            getStationList()
+            break;
+        case '第一路485波特率':
+            await set158StationData({ stationId: formEdit.id, plcCode: 'dyl485btl', value: formEdit.dyl485btl })
+            visibleModalEdit.value = false
+            getStationList()
+            break;
+        case '维护性放电':
+            await set158StationData({ stationId: formEdit.id, plcCode: 'whxfd', value: formEdit.whxfd })
+            visibleModalEdit.value = false
+            getStationList()
+            break;
+        case '近程断电控制1':
+            await set158StationData({ stationId: formEdit.id, plcCode: 'jcddkz1', value: formEdit.jcddkz1 })
+            visibleModalEdit.value = false
+            getStationList()
+            break;
+        case '近程断电控制2':
+            await set158StationData({ stationId: formEdit.id, plcCode: 'jcddkz2', value: formEdit.jcddkz2 })
+            visibleModalEdit.value = false
+            getStationList()
+            break;
+    }
 }
 
+
 onMounted(() => {
     getSubStationList()
     getStationList()
@@ -389,6 +517,10 @@ onMounted(() => {
             .detail-content {
                 width: 100%;
                 height: 100%;
+
+                .search-area {
+                    margin-bottom: 10px;
+                }
             }
         }
     }
@@ -406,4 +538,20 @@ onMounted(() => {
 ::v-deep(.zxm-input) {
     font-size: 12px;
 }
+
+:deep(.zxm-select:not(.zxm-select-customize-input) .zxm-select-selector) {
+    border: 1px solid #3ad8ff77 !important;
+    background-color: #ffffff00 !important;
+}
+
+:deep(.zxm-select-selection-item) {
+    color: #fff !important;
+}
+
+.zxm-picker,
+.zxm-input {
+    border: 1px solid #3ad8ff77 !important;
+    background-color: #ffffff00 !important;
+    color: #fff !important;
+}
 </style>

src/views/vent/safetyList/safetyList.api.ts

@@ -6,7 +6,9 @@ enum Api {
   getEdit='/safety/ventanalySubStation/edit',
   runDeviceMonitor='/safety/ventanalyDeviceInfo/runDeviceMonitor',
   update158DevName='/safety/ventanalyDeviceInfo/update158DevName',
-  updateDebugStatus='/safety/ventanalyDeviceInfo/updateDebugStatus'
+  updateDebugStatus='/safety/ventanalyDeviceInfo/updateDebugStatus',
+  get158StationData='/safety/ventanalyDeviceInfo/get158StationData',
+  set158StationData='/safety/ventanalyDeviceInfo/set158StationData'
 }
 
 
@@ -21,4 +23,8 @@ export const runDeviceMonitor = (params) => defHttp.post({ url: Api.runDeviceMon
 //编辑设备名称
 export const update158DevName = (params) => defHttp.post({ url: Api.update158DevName, params });
 // 分站设备调试
-export const updateDebugStatus = (params) => defHttp.post({ url: Api.updateDebugStatus,params },{ joinParamsToUrl: true });
+export const updateDebugStatus = (params) => defHttp.post({ url: Api.updateDebugStatus,params },{ joinParamsToUrl: true });
+// 分站详情列表
+export const get158StationData = (params) => defHttp.post({ url: Api.get158StationData,params },{ joinParamsToUrl: true });
+// 分站详情下发
+export const set158StationData = (params) => defHttp.post({ url: Api.set158StationData,params },{ joinParamsToUrl: true });

src/views/vent/safetyList/safetyList.data.ts

@@ -13,12 +13,6 @@ export const columns: BasicColumn[] = [
         key: 'strinstallpos',
         align: 'center',
     },
-    // {
-    //     title: '名称',
-    //     dataIndex: 'strname',
-    //     key: 'strname',
-    //     align: 'center',
-    // },
     {
         title: '监测值',
         dataIndex: 'valueJc',
@@ -29,28 +23,28 @@ export const columns: BasicColumn[] = [
         title: '供电模式',
         dataIndex: 'gdmsC',
         key: 'gdmsC',
-        width:100,
+        width: 100,
         align: 'center',
     },
     {
         title: '电池容量(%)',
         dataIndex: 'dcrl',
         key: 'dcrl',
-        width:110,
+        width: 110,
         align: 'center',
     },
     {
         title: '连接状态',
         dataIndex: 'linkstatusC',
         key: 'linkstatusC',
-        width:80,
+        width: 80,
         align: 'center',
     },
     {
         title: '时间',
         dataIndex: 'updateTime',
         key: 'updateTime',
-        width:120,
+        width: 120,
         align: 'center',
     },
     {
@@ -67,148 +61,128 @@ export const columnsDetail: BasicColumn[] = [
         title: '安装位置',
         dataIndex: 'strinstallpos',
         key: 'strinstallpos',
-        width:120,
-        align: 'center',
-    },
-    {
-        title: '版本号',
-        dataIndex: '',
-        key: '',
         align: 'center',
     },
     {
-        title: '监测值',
-        dataIndex: 'valueJc',
-        key: 'valueJc',
-        width:150,
+        title: '硬件版本',
+        dataIndex: 'yjbb',
+        key: 'yjbb',
+        width: 100,
         align: 'center',
     },
     {
         title: '供电模式',
-        dataIndex: 'gdmsC',
-        key: 'gdmsC',
-        width:100,
+        dataIndex: 'dqgdfsC',
+        key: 'dqgdfsC',
+        width: 100,
         align: 'center',
     },
     {
-        title: '电池容量(%)',
-        dataIndex: 'dcrl',
-        key: 'dcrl',
-        width:80,
+        title: '电量(%)',
+        dataIndex: 'dl',
+        key: 'dl',
+        width: 80,
         align: 'center',
     },
     {
         title: '直流供电电压(mv)',
-        dataIndex: '',
-        key: '',
-        width:80,
+        dataIndex: 'zlgddy',
+        key: 'zlgddy',
+        width: 80,
         align: 'center',
     },
     {
         title: '电池组总电压(mv)',
-        dataIndex: '',
-        key: '',
-        width:80,
+        dataIndex: 'dczzdy',
+        key: 'dczzdy',
+        width: 80,
         align: 'center',
     },
     {
         title: '负载电流(mA)',
-        dataIndex: '',
-        key: '',
-        width:80,
+        dataIndex: 'fzcdl',
+        key: 'fzcdl',
+        width: 80,
         align: 'center',
     },
     {
         title: '充电电流(mA)',
-        dataIndex: '',
-        key: '',
-        width:80,
+        dataIndex: 'dccddl',
+        key: 'dccddl',
+        width: 80,
         align: 'center',
     },
     {
-        title: '电池温度()',
-        dataIndex: '',
-        key: '',
-        width:80,
+        title: '电池温度(℃)',
+        dataIndex: 'dcdwd',
+        key: 'dcdwd',
+        width: 80,
         align: 'center',
     },
     {
-        title: '底板温度()',
-        dataIndex: '',
-        key: '',
-        width:80,
+        title: '底板温度(℃)',
+        dataIndex: 'dbdwd',
+        key: 'dbdwd',
+        width: 80,
         align: 'center',
     },
     {
         title: '档位状态',
-        dataIndex: '',
-        key: '',
-        width:80,
+        dataIndex: 'kgdwztC',
+        key: 'kgdwztC',
+        width: 80,
         align: 'center',
     },
     {
         title: '均衡状态',
-        dataIndex: '',
-        key: '',
-        width:80,
+        dataIndex: 'jhzt',
+        key: 'jhzt',
+        width: 80,
         align: 'center',
     },
     {
         title: '充放电状态',
-        dataIndex: '',
-        key: '',
-        width:80,
+        dataIndex: 'dccfdztC',
+        key: 'dccfdztC',
+        width: 80,
         align: 'center',
     },
     {
-        title: '电池数量',
-        dataIndex: '',
-        key: '',
-        width:80,
+        title: '电池数量(节)',
+        dataIndex: 'jrdcdsl',
+        key: 'jrdcdsl',
+        width: 80,
         align: 'center',
     },
     {
-        title: '电池额定容量',
-        dataIndex: '',
-        key: '',
-        width:80,
+        title: '电池额定容量(mah)',
+        dataIndex: 'dcedrl',
+        key: 'dcedrl',
+        width: 100,
         align: 'center',
     },
     {
-        title: '放电状态',
-        dataIndex: '',
-        key: '',
-        width:80,
+        title: '维护性放电',
+        dataIndex: 'whxfdC',
+        key: 'whxfdC',
+        width: 80,
         align: 'center',
     },
     {
         title: '断电控制1',
-        dataIndex: '',
-        key: '',
-        width:80,
+        dataIndex: 'jcddkz1C',
+        key: 'jcddkz1C',
+        width: 80,
         align: 'center',
     },
     {
         title: '断电控制2',
-        dataIndex: '',
-        key: '',
-        width:80,
-        align: 'center',
-    },
-    {
-        title: '连接状态',
-        dataIndex: 'linkstatusC',
-        key: 'linkstatusC',
-        width:80,
+        dataIndex: 'jcddkz2C',
+        key: 'jcddkz2C',
+        width: 80,
         align: 'center',
     },
-    // {
-    //     title: '时间',
-    //     dataIndex: 'updateTime',
-    //     key: 'updateTime',
-    //     width: 120,
-    //     align: 'center',
-    // },
+
     {
         title: '操作',
         dataIndex: 'action',