通风监测预警优化，均压提交返显对接

src/views/vent/monitorManager/alarmMonitor/common.data.ts

@@ -263,17 +263,7 @@ export const ventilateTopList = [
     list: [],
   },
   { id: 3, imgSrc: false, label: '', value: null, text: '--', list: [] },
-  // {
-  //   id: 4,
-  //   imgSrc: false,
-  //   label: '其他信息',
-  //   value: null,
-  //   text: '',
-  //   list: [
-  //     { id: 0, label: 'O₂', value: '--' },
-  //     { id: 1, label: 'CO', value: '--' },
-  //   ],
-  // },
+ 
 ];
 //束管监测选项列表
 export const contentList = [

src/views/vent/monitorManager/alarmMonitor/common/top-area.vue

@@ -0,0 +1,259 @@
+<template>
+    <div class="topArea">
+
+        <div v-if="!activeIndex">
+            <div class="work-nav">
+                <div class="nav" v-for="(item, index) in statusD" :key="index">
+                    <div class="pic" v-if="item.imgSrc"></div>
+                    <div class="content" v-if="item.label && item.value">
+                        <span>{{ item.label }}</span>
+                        <span>{{ item.value }}</span>
+                    </div>
+                    <div :style="{ color: item.text == '正常' ? 'var(--vent-table-action-link)' : '#ff2313' }"
+                        style="width: 100%; padding: 0px 10px; text-align: center; font-weight: bold" v-if="item.text">
+                        {{ item.text }}
+                    </div>
+                    <div class="percent" v-if="item.list.length != 0">
+                        <div class="title">{{ item.label }}</div>
+                        <div class="value">
+                            <div class="content-box" v-for="(items, ind) in item.list" :key="ind">
+                                <span style="color: #b3b8cc">{{ `${items.label} :` }}</span>
+                                <span style="color: var(--vent-table-action-link); margin-left: 10px">{{ items.value
+                                    }}</span>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="bot-area">
+                <div class="title-t">
+                    <div class="text-t">通风信息状态监测</div>
+                </div>
+                <div class="echart-boxd">
+                    <echartLine :echartDataGq="echartD" :maxY="maxY" :minY="minY" :echartDw="echartDw" />
+                </div>
+            </div>
+        </div>
+        <div v-else>
+            <MonitorTable ref="tunMonitorRef" :columns="ventTunColumns" :dataSource="ventTunDataSource"
+                :isShowSelect="false" :scroll="{ y: 300 }" title="巷道阻力分析" />
+        </div>
+
+    </div>
+</template>
+
+<script setup lang="ts">
+import { ref, reactive, watch } from 'vue'
+import { ventTunColumns } from '../alarm.data';
+import MonitorTable from '../../comment/MonitorTable.vue';
+import echartLine from '../common/echartLine.vue';
+let props = defineProps({
+    activeIndex: {
+        type: Number,
+        default: 0
+    },
+    statusData: {
+        type: Array,
+        default: () => {
+            return []
+        }
+    },
+    echartData:{
+        type:Object,
+        default:()=>{
+            return {}
+        }
+    },
+    maxY:{
+        type:Number,
+        default:0
+    },
+    minY:{
+        type:Number,
+        default:0
+    },
+    ventTunDataSource:{
+        type:Array,
+        default:()=>{
+            return []
+        }
+    }
+})
+
+let statusD = ref<any[]>([])
+let echartD=reactive({})
+let echartDw = ref('(m³/min)');
+
+
+
+watch(() => props.statusData, (newV, oldV) => {
+    statusD.value = newV
+}, { immediate: true })
+
+watch(()=>props.echartData,(newE,oldE)=>{
+    console.log(newE,'999')
+    echartD=Object.assign({},newE)
+},{immediate:true})
+
+</script>
+
+<style lang="less" scoped>
+.topArea {
+    position: relative;
+    width: 100%;
+    height: 100%;
+
+    .work-nav {
+        height: 30%;
+        width: 100%;
+        background: var(--image-bj1) no-repeat center;
+        background-size: 100% 100%;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        border-bottom: 3px solid;
+        border-image: var(--border-image-1) 1 1 1;
+
+        .nav {
+            display: flex;
+            justify-content: center;
+            align-items: center;
+
+            &:nth-child(1) {
+                flex: 1;
+                height: 100%;
+                border-right: 2px solid;
+                border-image: var(--border-image-2) 1 1 1;
+            }
+
+            &:nth-child(2) {
+                flex: 1;
+                height: 100%;
+                border-right: 2px solid;
+                border-image: var(--border-image-2) 1 1 1;
+            }
+
+            &:nth-child(3) {
+                flex: 1;
+                height: 100%;
+                border-right: 2px solid;
+                border-image: var(--border-image-2) 1 1 1;
+            }
+
+            &:nth-child(4) {
+                flex: 1;
+                color: #b3b8cc;
+                font-size: 16px;
+                height: 100%;
+                border-right: 2px solid;
+                border-image: var(--border-image-2) 1 1 1;
+            }
+
+            /**
+            &:nth-child(5) {
+              flex: 1.4;
+              height: 100%;
+
+              .percent {
+                width: 100%;
+                height: 82%;
+                padding: 0px 20px;
+                box-sizing: border-box;
+                display: flex;
+                flex-direction: column;
+                justify-content: space-around;
+
+                .title {
+                  font-size: 14px;
+                  padding: 5px 0px;
+                  color: #b3b8cc;
+                  text-align: center;
+                }
+
+                .value {
+                  display: flex;
+                  justify-content: space-between;
+
+                  span {
+                    font-family: 'douyuFont';
+                    font-size: 18px;
+                  }
+                }
+              }
+            }*/
+
+            .pic {
+                width: 90px;
+                height: 90px;
+            }
+
+            .content {
+                height: 82%;
+                margin-left: 15px;
+                color: var(--vent-font-color);
+                display: flex;
+                flex-direction: column;
+                justify-content: space-around;
+
+                span {
+                    font-size: 14px;
+
+                    &:nth-child(1) {
+                        padding: 5px 0px;
+                        color: #b3b8cc;
+                    }
+
+                    &:nth-child(2) {
+                        font-family: 'douyuFont';
+                        font-size: 16px;
+                        color: var(--vent-table-action-link);
+                    }
+                }
+            }
+        }
+
+        .nav:nth-child(1) .pic {
+            background: var(--image-jinfengliang) no-repeat center;
+            background-size: 100% 100%;
+        }
+
+        .nav:nth-child(2) .pic {
+            background: var(--image-huifengliang) no-repeat center;
+            background-size: 100% 100%;
+        }
+
+        .nav:nth-child(3) .pic {
+            background: var(--image-xufengliang) no-repeat center;
+            background-size: 100% 100%;
+        }
+    }
+
+    .bot-area {
+        height: calc(100% - 30% - 3px);
+        padding: 10px;
+        background: var(--image-bj1) no-repeat;
+        background-size: 100% 100%;
+        box-sizing: border-box;
+
+        .title-t {
+            height: 30px;
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+
+            .text-t {
+                font-family: 'douyuFont';
+                font-size: 14px;
+                color: var(--vent-font-color);
+            }
+        }
+
+        .echart-boxd {
+            width: 100%;
+            height: 250px;
+        }
+    }
+
+
+}
+</style>

src/views/vent/monitorManager/alarmMonitor/warn/ventilateWarn.vue

@@ -33,42 +33,8 @@
       </div>
       <div class="ventilate-content">
         <a-spin :spinning="loading">
-          <div v-if="!activeIndex">
-            <div class="work-nav">
-              <div class="nav" v-for="(item, index) in ventilateTopList" :key="index">
-                <div class="pic" v-if="item.imgSrc"></div>
-                <div class="content" v-if="item.label && item.value">
-                  <span>{{ item.label }}</span>
-                  <span>{{ item.value }}</span>
-                </div>
-                <div :style="{ color: item.text == '正常' ? 'var(--vent-table-action-link)' : '#ff2313' }"
-                  style="width: 100%; padding: 0px 10px; text-align: center; font-weight: bold" v-if="item.text">
-                  {{ item.text }}
-                </div>
-                <div class="percent" v-if="item.list.length != 0">
-                  <div class="title">{{ item.label }}</div>
-                  <div class="value">
-                    <div class="content-box" v-for="(items, ind) in item.list" :key="ind">
-                      <span style="color: #b3b8cc">{{ `${items.label} :` }}</span>
-                      <span style="color: var(--vent-table-action-link); margin-left: 10px">{{ items.value }}</span>
-                    </div>
-                  </div>
-                </div>
-              </div>
-            </div>
-            <div class="bot-area">
-              <div class="title-t">
-                <div class="text-t">通风信息状态监测</div>
-              </div>
-              <div class="echart-boxd">
-                <echartLine :echartDataGq="echartDataFc1" :maxY="maxY" :minY="minY" :echartDw="echartDw" />
-              </div>
-            </div>
-          </div>
-          <div v-else>
-            <MonitorTable ref="tunMonitorRef" :columns="ventTunColumns" :dataSource="ventTunDataSource"
-              :isShowSelect="false" :scroll="{ y: 300 }" title="巷道阻力分析" />
-          </div>
+          <TopArea :activeIndex="activeIndex" :statusData="ventilateTopList" :echartData="echartDataFc1"
+            :ventTunDataSource="ventTunDataSource" :maxY="maxY" :minY="minY"></TopArea>
         </a-spin>
       </div>
     </div>
@@ -88,12 +54,10 @@ import { useGlobSetting } from '/@/hooks/setting';
 import { useRouter } from 'vue-router';
 import { sysTypeWarnList, sysWarn, getDevice } from '../common.api';
 import { ventilateTopList, typeMenuListTf, getMaxY, getMinY } from '../common.data';
-import MonitorTable from '../../comment/MonitorTable.vue';
 import CustomHeader from '/@/components/vent/customHeader.vue';
-import echartLine from '../common/echartLine.vue';
 import MeasurePoint from '../common/measurePoint.vue';
-import { ventTunColumns } from '../alarm.data';
 import { realTimeNetCal, modalParam } from '../alarm.api';
+import TopArea from '../common/top-area.vue';
 
 //巷道阻力分析数据
 let hdData = reactive({
@@ -115,7 +79,7 @@ let activeIndex1 = ref(0);
 let maxY = ref<any>(0);
 let minY = ref<any>(0)
 const loading = ref(false);
-let echartDw = ref('(m³/min)');
+
 //通风图表数据
 const echartDataFc1 = reactive<any>({
   maxData: {
@@ -156,9 +120,13 @@ function btnClick(ind) {
 //点击切换实时\报表数据
 let handlerToggle = () => {
   monitor.value = !monitor.value;
-  ventilateTopList[0].value = monitor.value ? toggleData.faceIntM3  : toggleData.jin;
-  ventilateTopList[1].value = monitor.value ? toggleData.faceRetM3 : toggleData.hui ;
-  if (monitor.value ) {
+  echartDataFc1.maxData.data.length = 0;
+  echartDataFc1.minData.data.length = 0;
+  echartDataFc1.aveValue.data.length = 0;
+  echartDataFc1.xData.length = 0;
+  ventilateTopList[0].value = monitor.value ? toggleData.faceIntM3 : toggleData.jin;
+  ventilateTopList[1].value = monitor.value ? toggleData.faceRetM3 : toggleData.hui;
+  if (monitor.value) {
     toggleData.history_report.forEach((v) => {
       echartDataFc1.maxData.data.push(parseFloat(v.faceIntM3));
       echartDataFc1.minData.data.push(parseFloat(v.faceRetM3));
@@ -266,12 +234,12 @@ function getDetailList(param) {
     } else if (showToggle.value == 'report') {
       ventilateTopList[0].value = param.faceIntM3;
       ventilateTopList[1].value = param.faceRetM3;
-        param.history_report.forEach((v) => {
-          echartDataFc1.maxData.data.push(parseFloat(v.faceIntM3));
-          echartDataFc1.minData.data.push(parseFloat(v.faceRetM3));
-          echartDataFc1.aveValue.data.push(0);
-          echartDataFc1.xData.push(v.time);
-        });
+      param.history_report.forEach((v) => {
+        echartDataFc1.maxData.data.push(parseFloat(v.faceIntM3));
+        echartDataFc1.minData.data.push(parseFloat(v.faceRetM3));
+        echartDataFc1.aveValue.data.push(0);
+        echartDataFc1.xData.push(v.time);
+      });
     } else {
       ventilateTopList[0].value = monitor.value ? param.faceIntM3 : param.jin;
       ventilateTopList[1].value = monitor.value ? param.faceRetM3 : param.hui;
@@ -299,8 +267,6 @@ function getDetailList(param) {
     let echartD = [echartDataFc1.maxData.data, echartDataFc1.minData.data]
     maxY.value = getMaxY(echartD)
     minY.value = getMinY(echartD)
-    console.log(maxY.value, 'yMax---')
-    console.log(minY.value, 'yMin---')
   }
 }
 //获取通风监控测点信息
@@ -574,157 +540,6 @@ onUnmounted(() => {
       padding: 10px 0px;
       box-sizing: border-box;
       margin-right: 10px;
-
-      .work-nav {
-        height: 30%;
-        width: 100%;
-        background: var(--image-bj1) no-repeat center;
-        background-size: 100% 100%;
-        display: flex;
-        justify-content: space-between;
-        align-items: center;
-        border-bottom: 3px solid;
-        border-image: var(--border-image-1) 1 1 1;
-
-        .nav {
-          display: flex;
-          justify-content: center;
-          align-items: center;
-
-          &:nth-child(1) {
-            flex: 1;
-            height: 100%;
-            border-right: 2px solid;
-            border-image: var(--border-image-2) 1 1 1;
-          }
-
-          &:nth-child(2) {
-            flex: 1;
-            height: 100%;
-            border-right: 2px solid;
-            border-image: var(--border-image-2) 1 1 1;
-          }
-
-          &:nth-child(3) {
-            flex: 1;
-            height: 100%;
-            border-right: 2px solid;
-            border-image: var(--border-image-2) 1 1 1;
-          }
-
-          &:nth-child(4) {
-            flex: 1;
-            color: #b3b8cc;
-            font-size: 16px;
-            height: 100%;
-            border-right: 2px solid;
-            border-image: var(--border-image-2) 1 1 1;
-          }
-
-          /**
-            &:nth-child(5) {
-              flex: 1.4;
-              height: 100%;
-
-              .percent {
-                width: 100%;
-                height: 82%;
-                padding: 0px 20px;
-                box-sizing: border-box;
-                display: flex;
-                flex-direction: column;
-                justify-content: space-around;
-
-                .title {
-                  font-size: 14px;
-                  padding: 5px 0px;
-                  color: #b3b8cc;
-                  text-align: center;
-                }
-
-                .value {
-                  display: flex;
-                  justify-content: space-between;
-
-                  span {
-                    font-family: 'douyuFont';
-                    font-size: 18px;
-                  }
-                }
-              }
-            }*/
-
-          .pic {
-            width: 90px;
-            height: 90px;
-          }
-
-          .content {
-            height: 82%;
-            margin-left: 15px;
-            color: var(--vent-font-color);
-            display: flex;
-            flex-direction: column;
-            justify-content: space-around;
-
-            span {
-              font-size: 14px;
-
-              &:nth-child(1) {
-                padding: 5px 0px;
-                color: #b3b8cc;
-              }
-
-              &:nth-child(2) {
-                font-family: 'douyuFont';
-                font-size: 16px;
-                color: var(--vent-table-action-link);
-              }
-            }
-          }
-        }
-
-        .nav:nth-child(1) .pic {
-          background: var(--image-jinfengliang) no-repeat center;
-          background-size: 100% 100%;
-        }
-
-        .nav:nth-child(2) .pic {
-          background: var(--image-huifengliang) no-repeat center;
-          background-size: 100% 100%;
-        }
-
-        .nav:nth-child(3) .pic {
-          background: var(--image-xufengliang) no-repeat center;
-          background-size: 100% 100%;
-        }
-      }
-
-      .bot-area {
-        height: calc(100% - 30% - 3px);
-        padding: 10px;
-        background: var(--image-bj1) no-repeat;
-        background-size: 100% 100%;
-        box-sizing: border-box;
-
-        .title-t {
-          height: 30px;
-          display: flex;
-          justify-content: space-between;
-          align-items: center;
-
-          .text-t {
-            font-family: 'douyuFont';
-            font-size: 14px;
-            color: var(--vent-font-color);
-          }
-        }
-
-        .echart-boxd {
-          width: 100%;
-          height: 250px;
-        }
-      }
     }
   }
 

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

@@ -5,6 +5,8 @@ enum Api {
   list = '/monitor/device',
   baseList = '/safety/ventanalyManageSystem/list',
   deviceList = '/safety/ventanalyManageSystem/linkdevicelist',
+  submit = '/monitor/demo/avePress/add',
+  subList= '/monitor/demo/avePress/list'
 }
 /**
  * 列表接口
@@ -23,3 +25,15 @@ export const getTableList = (params) => defHttp.get({ url: Api.baseList, params
  * @param params
  */
 export const deviceList = (params) => defHttp.get({ url: Api.deviceList, params });
+
+/**
+ * 监测参数提交
+ * @param params
+ */
+export const submit = (params) => defHttp.post({ url: Api.submit, params });
+
+/**
+ * 监测参数查询列表
+ * @param params
+ */
+export const subList = () => defHttp.get({ url: Api.subList });

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

@@ -107,25 +107,25 @@ export const monitorParam = [
 export const settingParam1 = [
   {
     title: 'CO浓度限值',
-    code: 'a',
+    code: 'coMaxStart',
     value: '',
     unit: '%',
   },
   {
     title: 'O2浓度限值',
-    code: 'b',
+    code: 'o2MinStart',
     value: '',
     unit: '%',
   },
   {
     title: '30min CO下降梯度',
-    code: 'c',
+    code: 'coRiseStart',
     value: '',
     unit: '%',
   },
   {
     title: '30min O2下降梯度',
-    code: 'd',
+    code: 'o2DownStart',
     value: '',
     unit: '%',
   },
@@ -133,25 +133,25 @@ export const settingParam1 = [
 export const settingParam2 = [
   {
     title: '风窗面积调整梯度',
-    code: 'e',
+    code: 'windowAreaSetGrad',
     value: '',
     unit: '㎡',
   },
   {
     title: '风窗调节判定时间',
-    code: 'f',
+    code: 'windowSetTime',
     value: '',
     unit: 'min',
   },
   {
     title: '最小风窗面积',
-    code: 'g',
+    code: 'windowMinArea',
     value: '',
     unit: '㎡',
   },
   {
     title: '默认风窗面积',
-    code: 'h',
+    code: 'windowAreaDef',
     value: '',
     unit: '㎡',
   },
@@ -160,31 +160,31 @@ export const settingParam2 = [
 export const settingParam3 = [
   {
     title: '调节最短持续时间',
-    code: 'i',
+    code: 'setMinTime',
     value: '',
     unit: 'min',
   },
   {
     title: 'CO浓度不高于',
-    code: 'j',
+    code: 'coEnd',
     value: '',
     unit: '㎡',
   },
   {
     title: 'CO最高限值持续时间',
-    code: 'k',
+    code: 'coTimeEnd',
     value: '',
     unit: 'min',
   },
   {
     title: 'O2浓度不低于',
-    code: 'l',
+    code: 'o2End',
     value: '',
     unit: '㎡',
   },
   {
     title: 'O2最低限值持续时间',
-    code: 'm',
+    code: 'o2TimeEnd',
     value: '',
     unit: 'min',
   },

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

@@ -137,7 +137,7 @@
   import { SvgIcon } from '/@/components/Icon';
   import { mountedThree, destroy, setModelType, updateText, play } from '../balancePress.threejs';
   import { settingParam1, settingParam2, settingParam3, windowParam, localFanParam, monitorParam, windrectParam } from '../balancePress.data';
-  import { list } from '../balancePress.api';
+  import { list ,submit,subList} from '../balancePress.api';
   import { message } from 'ant-design-vue';
   import { get } from 'lodash-es';
 
@@ -221,9 +221,22 @@
   }
 
   // 喷粉操作
-  function onSubmit() {
-    sessionStorage.setItem('lalance-press-formdata', JSON.stringify(formData.value));
-    message.success('提交成功');
+  async function onSubmit() {
+    let res=await submit(formData.value)
+    if(res.code==500){
+      message.success(res.message);
+    }else {
+      initParamList()
+      message.success('提交成功');
+    }
+  }
+
+  //获取低氧参数监测返显列表
+  async function initParamList(){
+    let res=await subList()
+    if(res && res.records.length!=0){
+      formData.value=res.records[0]
+    }
   }
 
   watch(
@@ -232,39 +245,36 @@
       if (newVal && oldVal != undefined) {
         setModelType('balancePressBase');
       }
-
       loading.value = true;
     }
   );
 
   const formData = ref({
-    a: 0,
-    b: 0,
-    c: 0,
-    d: 0,
-    e: 0,
-    f: 0,
-    g: 0,
-    h: 0,
-    i: 0,
-    j: 0,
-    k: 0,
-    l: 0,
-    m: 0,
+    coMaxStart: 0,
+    o2MinStart: 0,
+    coRiseStart: 0,
+    o2DownStart: 0,
+    windowAreaSetGrad: 0,
+    windowSetTime: 0,
+    windowMinArea: 0,
+    windowAreaDef: 0,
+    setMinTime: 0,
+    coEnd: 0,
+    coTimeEnd: 0,
+    o2End: 0,
+    o2TimeEnd: 0,
   });
 
   onBeforeMount(() => {});
 
   onMounted(() => {
-    // getMonitor()
     loading.value = true;
-    const storage = sessionStorage.getItem('lalance-press-formdata');
-    if (storage) formData.value = JSON.parse(storage);
     mountedThree().then(async () => {
       await setModelType('balancePressBase');
       loading.value = false;
       timer = null;
-      await getMonitor(true);
+      await initParamList()
+      await getMonitor(true); 
       play('startSmoke', 'top', 30, 'open', 0);
     });
   });

src/views/vent/monitorManager/comment/comment.data.ts

@@ -1,4 +1,117 @@
 import { BasicColumn } from '/@/components/Table';
+
+//传感器监测-预警分析
+export const analysisColumns: BasicColumn[] = [
+  {
+    title: '序号',
+    width: 60,
+    align: 'center',
+    customRender: ({ index }: { index: number }) => `${index + 1}`,
+  },
+  {
+    title: '地点',
+    dataIndex: 'strInstallPos',
+    key: 'strInstallPos',
+    align: 'center',
+  },
+  {
+    title: '第一次',
+    children: [
+      {
+        title: 'CH4(%)',
+        dataIndex: 'ch4One',
+        key: 'ch4One',
+        align: 'center',
+      },
+      {
+        title: 'CO2(%)',
+        dataIndex: 'co2One',
+        key: 'co2One',
+        align: 'center',
+      },
+      {
+        title: 'CO(ppm)',
+        dataIndex: 'coOne',
+        key: 'coOne',
+        align: 'center',
+      },
+      {
+        title: 'O2(%)',
+        dataIndex: 'o2One',
+        key: 'o2One',
+        align: 'center',
+      },
+      {
+        title: '温度(°C)',
+        dataIndex: 'tOne',
+        key: 'tOne',
+        align: 'center',
+      },
+      {
+        title: '时间',
+        dataIndex: 'timeOne',
+        key: 'timeOne',
+        align: 'center',
+      },
+    ],
+  },
+  {
+    title: '第二次',
+    children: [
+      {
+        title: 'CH4(%)',
+        dataIndex: 'ch4Two',
+        key: 'ch4Two',
+        align: 'center',
+      },
+      {
+        title: 'CO2(%)',
+        dataIndex: 'co2Two',
+        key: 'co2Two',
+        align: 'center',
+      },
+      {
+        title: 'CO(ppm)',
+        dataIndex: 'coTwo',
+        key: 'coTwo',
+        align: 'center',
+      },
+      {
+        title: 'O2(%)',
+        dataIndex: 'o2Two',
+        key: 'o2Two',
+        align: 'center',
+      },
+      {
+        title: '温度(°C)',
+        dataIndex: 'tTwo',
+        key: 'tTwo',
+        align: 'center',
+      },
+      {
+        title: '时间',
+        dataIndex: 'timeTwo',
+        key: 'timeTwo',
+        align: 'center',
+      },
+    ],
+  },
+  {
+    title: '瓦检员',
+    dataIndex: 'checkPerson',
+    key: 'checkPerson',
+    align: 'center',
+  },
+
+  {
+    title: '操作',
+    dataIndex: 'action',
+    width: 120,
+    align: 'center',
+    slots: { customRender: 'action' },
+  },
+];
+
 export const gaspatrolColumnsTwo: BasicColumn[] = [
   {
     title: '序号',

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

@@ -0,0 +1,64 @@
+<template>
+    <div class="warnAnalysis">
+        <div class="warn-tag">
+            <a-tag color="pink" v-for="(item, index) in tagList" :key="index">{{ item.title }}</a-tag>
+        </div>
+        <div class="warn-content">
+            <a-table :columns="analysisColumns" :data-source="tableData" size="small" :scroll="{ y: 500 }" class="tableW"
+                :pagination="pagination" >
+                <template #bodyCell="{ column, text }"></template>
+
+            </a-table>
+        </div>
+    </div>
+</template>
+
+<script setup lang="ts">
+import { ref, reactive } from 'vue'
+import {analysisColumns} from './comment.data'
+
+let tagList = ref([
+    { title: '测试1' },
+    { title: '测试2' },
+    { title: '测试3' },
+    { title: '测试4' },
+    { title: '测试5' },
+    { title: '测试6' },
+])
+let pagination = reactive({
+    current: 1, // 当前页码
+    pageSize: 10, // 每页显示条数
+    total: 0, // 总条目数，后端返回
+    // showTotal: (total, range) => `${range[0]}-${range[1]} 条，总共 ${total} 条`, // 分页右下角显示信息
+    showSizeChanger: true, // 是否可改变每页显示条数
+    pageSizeOptions: ['10', '20', '50'], // 可选的每页显示条数
+  });
+let tableData=ref<any[]>([])
+</script>
+
+<style lang="less" scoped>
+.warnAnalysis {
+    position: relative;
+    width: 100%;
+    height: 100%;
+
+    .warn-tag {
+        height: 30px;
+        margin: 10px;
+        text-align: center;
+    }
+
+    .warn-content {
+        margin: 10px;
+    }
+}
+
+::v-deep .zxm-tag {
+    font-size: 14px;
+    padding: 0px 20px;
+    line-height: 28px;
+    background: linear-gradient(#2cd1ff55, #1eb0ff55);
+    border-color: #74e9fe;
+    color: #fff;
+}
+</style>

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

@@ -85,6 +85,11 @@
             <AlarmHistoryTable columns-type="alarm" device-type="modelsensor" designScope="alarm-history" />
           </div>
         </a-tab-pane>
+        <a-tab-pane key="4" tab="预警分析">
+          <div class="tab-item box-bg" v-if="activeKey == '4'">
+           <warnAnalysis></warnAnalysis>
+          </div>
+        </a-tab-pane>
         <!-- <a-tab-pane key="4" tab="操作历史">
           <div class="tab-item box-bg">
             <HandlerHistoryTable columns-type="operator_history" device-type="modelsensor" designScope="alarm-history" />
@@ -105,6 +110,7 @@
   import MonitorTable from '../comment/MonitorTable.vue';
   import HistoryTable from '../comment/HistoryTable.vue';
   import AlarmHistoryTable from '../comment/AlarmHistoryTable.vue';
+  import warnAnalysis from '../comment/warnAnalysis.vue'
   import { list, getTableList } from './sensor.api';
   import { deviceList } from '../../deviceManager/comment/pointTabel/point.api';
   import { getTableHeaderColumns } from '/@/hooks/web/useWebColumns';