1. 新增展会局部风机控风功能

2. 新增展会风窗控风功能

public/js/config.js

@@ -3,13 +3,13 @@ const VUE_APP_URL = {
   webRtcUrl: '/webRtc' // rtsp服务器IP地址
 }
 const History_Type = {
-  // type: 'remote', // remote、vent  (remote 代表的是历史查询走的装备院的接口，vent是走的咱们的，目前神东的项目都用remote, 其他矿用vent)
-  type: 'vent', // remote、vent
+  type: 'remote', // remote、vent  (remote 代表的是历史查询走的装备院的接口，vent是走的咱们的，目前神东的项目都用remote, 其他矿用vent)
+  // type: 'vent', // remote、vent
   deviceType: []
 }
 
 const VENT_PARAM = {
   // simulatedPassword: '123456', //(simulatedPassword 为空时有密码输入框弹出，不为空时不弹出密码输入框，无需输入密码)
   simulatedPassword: '',
-  showReport: false
+  showReport: true
 }

src/components/Form/src/jeecg/components/userSelect/UserList.vue

@@ -7,10 +7,10 @@
             <a-checkbox v-model:checked="checkStatus[item.id]" />
           </div>
           <div>
-            <a-avatar v-if="item.avatar" :src="getFileAccessHttpUrl(item.avatar)"></a-avatar>
+            <a-avatar v-if="item.avatar" :src="getFileAccessHttpUrl(item.avatar)" />
             <a-avatar v-else-if="item.avatarIcon" class="ant-btn-primary">
               <template #icon>
-                <Icon :icon=" 'ant-design:'+item.avatarIcon " style="margin-top: 4px;font-size: 24px;"/>
+                <Icon :icon="'ant-design:' + item.avatarIcon" style="margin-top: 4px; font-size: 24px" />
               </template>
             </a-avatar>
             <a-avatar v-else>
@@ -34,9 +34,12 @@
   import { UserOutlined } from '@ant-design/icons-vue';
   import { computed, toRaw, reactive, watchEffect, ref } from 'vue';
   import { getFileAccessHttpUrl } from '/@/utils/common/compUtils';
-  
+
   export default {
     name: 'UserList',
+    components: {
+      UserOutlined,
+    },
     props: {
       dataList: {
         type: Array,
@@ -51,13 +54,10 @@
         type: Array,
         default: () => [],
       },
-      excludeUserIdList:{
+      excludeUserIdList: {
         type: Array,
         default: () => [],
-      }
-    },
-    components: {
-      UserOutlined,
+      },
     },
     emits: ['selected', 'unSelect'],
     setup(props, { emit }) {
@@ -109,7 +109,7 @@
         console.error('onChangeChecked', e);
       }
 
-     // const showDataList = ref<any[]>([])
+      // const showDataList = ref<any[]>([])
       const checkStatus = reactive<any>({});
       watchEffect(() => {
         let arr1 = props.dataList;
@@ -124,8 +124,6 @@
             checkStatus[item.id] = false;
           }
         }
-        
-      
       });
 
       function prevent(e) {
@@ -134,22 +132,22 @@
       }
 
       function records2DataList() {
-        let arr:any[] = [];
+        let arr: any[] = [];
         let excludeList = props.excludeUserIdList;
         let records = props.dataList;
-        if(records && records.length>0){
-          for(let item of records){
-            if(excludeList.indexOf(item.id)<0){
-              arr.push({...item})
+        if (records && records.length > 0) {
+          for (let item of records) {
+            if (excludeList.indexOf(item.id) < 0) {
+              arr.push({ ...item });
             }
           }
         }
         return arr;
       }
-      
-      const showDataList = computed(()=>{
+
+      const showDataList = computed(() => {
         let excludeList = props.excludeUserIdList;
-        if(excludeList && excludeList.length>0){
+        if (excludeList && excludeList.length > 0) {
           return records2DataList();
         }
         return props.dataList;
@@ -163,7 +161,7 @@
         onChangeChecked,
         checkStatus,
         showDataList,
-        getFileAccessHttpUrl
+        getFileAccessHttpUrl,
       };
     },
   };

src/components/Modal/src/BasicModal.vue

@@ -210,6 +210,7 @@
 
       // 取消事件
       async function handleCancel(e: Event) {
+        debugger;
         e?.stopPropagation();
         // 过滤自定义关闭按钮的空白区域
         if ((e.target as HTMLElement)?.classList?.contains(prefixCls + '-close--custom')) return;

src/components/Table/src/hooks/useTableForm.ts

@@ -35,7 +35,6 @@ export function useTableForm(
   }
 
   function handleSearchInfoChange(info: Recordable) {
-    debugger;
     const { handleSearchInfoFn } = unref(propsRef);
     if (handleSearchInfoFn && isFunction(handleSearchInfoFn)) {
       info = handleSearchInfoFn(info) || info;

src/components/chart/BarAndLine.vue

@@ -72,7 +72,7 @@
         dataZoom: {},
         legend: {},
         timeline: null,
-        xAxis: null,
+        xAxis: {},
         yAxis: null,
         series: null,
       });
@@ -93,12 +93,14 @@
       });
 
       function initChartsOption() {
+        debugger;
         optionUtil = new EchartsUtil(merge(option, props.option));
         optionUtil.initChartOption(props.chartsType, chartsColumns);
       }
       initChartsOption();
 
       function initCharts(isRefresh = false) {
+        // debugger;
         //轴数据
         if (option.series && option.series.length === chartsColumns.length) {
           let xAxisData = props.dataSource.map((item) => item[props.xAxisPropType]);
@@ -106,12 +108,13 @@
             option.series[index].data = props.dataSource.map((item) => item[propType.dataIndex] || 0);
           });
           option.xAxis[0].data = xAxisData;
-          console.log('echarts监测列表数据', option.xAxis[0].data);
+          // console.log('echarts监测列表数据', option.xAxis[0].data);
           setOptions(option, isRefresh);
         }
       }
       setTimeout(() => {
         spinning.value = false;
+        initCharts(true);
       }, 1000);
       return { chartRef, spinning };
     },

src/components/chart/BarAndLineCustom.vue

@@ -77,7 +77,6 @@
       });
 
       function initCharts() {
-
         if (props.option) {
           Object.assign(option, props.option);
         }
@@ -85,8 +84,8 @@
         // let typeArr = Array.from(new Set(props.chartData.map((item) => item.type)));
         //轴数据
         let xAxisData = Array.from(new Set(props.chartData.map((item) => item[props.xAxisPropType])));
-        [...props.propTypeArr].forEach((filed:string, index) => {
-          option.series[index]['data'] = props.chartData.map(item => item[filed]);
+        [...props.propTypeArr].forEach((filed: string, index) => {
+          option.series[index]['data'] = props.chartData.map((item) => item[filed]);
         });
         option.xAxis.data = xAxisData;
         setOptions(option, false);

src/components/chart/BarSingle.vue

@@ -2,327 +2,328 @@
   <div ref="chartRef" :style="{ height, width }"></div>
 </template>
 <script lang="ts">
-import { defineComponent, PropType, ref, Ref, reactive, watchEffect, onMounted } from 'vue';
-import { useECharts } from '/@/hooks/web/useECharts';
-import { getTableHeaderColumns } from '/@/hooks/web/useWebColumns';
-import { merge } from 'lodash-es';
+  import { defineComponent, PropType, ref, Ref, reactive, watchEffect, onMounted } from 'vue';
+  import { useECharts } from '/@/hooks/web/useECharts';
+  import { getTableHeaderColumns } from '/@/hooks/web/useWebColumns';
+  import { merge } from 'lodash-es';
 
-export default defineComponent({
-  name: 'BarAndLine',
-  props: {
-    chartsColumns: {
-      type: Array,
-      default: () => [],
-    },
-    chartsColumnsType: {
-      type: String,
-    },
-    dataSource: {
-      type: Object,
-      default: () => { },
-    },
-    xAxisData: {
-      type: Array,
-      default: () => [],
-    },
-    width: {
-      type: String as PropType<string>,
-      default: '100%',
-    },
-    height: {
-      type: String as PropType<string>,
-      default: '100%',
-    },
-    option: {
-      type: Object,
-      default: () => ({}),
-    },
-    color: {
-      type: Array,
-      default: () => [],
+  export default defineComponent({
+    name: 'BarAndLine',
+    props: {
+      chartsColumns: {
+        type: Array,
+        default: () => [],
+      },
+      chartsColumnsType: {
+        type: String,
+      },
+      dataSource: {
+        type: Object,
+        default: () => {},
+      },
+      xAxisData: {
+        type: Array,
+        default: () => [],
+      },
+      width: {
+        type: String as PropType<string>,
+        default: '100%',
+      },
+      height: {
+        type: String as PropType<string>,
+        default: '100%',
+      },
+      option: {
+        type: Object,
+        default: () => ({}),
+      },
+      color: {
+        type: Array,
+        default: () => [],
+      },
+      fontColor: {
+        type: Array,
+        default: () => [],
+      },
     },
-    fontColor: {
-      type: Array,
-      default: () => [],
-    }
-  },
-  setup(props) {
-    const chartRef = ref<HTMLDivElement | null>(null);
-    const { setOptions, echarts } = useECharts(chartRef as Ref<HTMLDivElement>);
-    const chartData = getTableHeaderColumns(props.chartsColumnsType) || [];
-    const chartsColumns: [] = props.chartsColumns.length > 0 ? props.chartsColumns : chartData;
-
+    setup(props) {
+      const chartRef = ref<HTMLDivElement | null>(null);
+      const { setOptions, echarts } = useECharts(chartRef as Ref<HTMLDivElement>);
+      const chartData = getTableHeaderColumns(props.chartsColumnsType) || [];
+      const chartsColumns: [] = props.chartsColumns.length > 0 ? props.chartsColumns : chartData;
 
-    const colors = props.color.length > 0 ? props.color : [
-      [
-        { offset: 0.5, color: 'rgba(14, 159, 255, 1)' },
-        { offset: 0.6, color: 'rgba(97, 199, 252, 0.8)' },
-        { offset: 1, color: 'rgba(97, 199, 252, 0.08)' },
-      ],
-      [
-        { offset: 0.5, color: 'rgba(137, 163, 164, 1)' },
-        { offset: 1, color: 'rgba(137, 163, 164, 0.8)' },
-        { offset: 1, color: 'rgba(137, 163, 164, 0.08)' },
-      ],
-      [
-        { offset: 0.5, color: 'rgba(44, 166, 166, 1)' },
-        { offset: 1, color: 'rgba(44, 166, 166, 0.8)' },
-        { offset: 1, color: 'rgba(44, 166, 166, 0.08)' },
-      ],
-      [
-        { offset: 0.5, color: 'rgba(34, 66, 186, 1)' },
-        { offset: 1, color: 'rgba(34, 66, 186, 0.8)' },
-        { offset: 1, color: 'rgba(34, 66, 186, 0.08)' },
-      ],
-      [
-        { offset: 0.5, color: 'rgba(34, 66, 186, 1)' },
-        { offset: 1, color: 'rgba(34, 66, 186, 0.8)' },
-        { offset: 1, color: 'rgba(34, 66, 186, 0.08)' },
-      ],
-    ];
+      const colors =
+        props.color.length > 0
+          ? props.color
+          : [
+              [
+                { offset: 0.5, color: 'rgba(14, 159, 255, 1)' },
+                { offset: 0.6, color: 'rgba(97, 199, 252, 0.8)' },
+                { offset: 1, color: 'rgba(97, 199, 252, 0.08)' },
+              ],
+              [
+                { offset: 0.5, color: 'rgba(137, 163, 164, 1)' },
+                { offset: 1, color: 'rgba(137, 163, 164, 0.8)' },
+                { offset: 1, color: 'rgba(137, 163, 164, 0.08)' },
+              ],
+              [
+                { offset: 0.5, color: 'rgba(44, 166, 166, 1)' },
+                { offset: 1, color: 'rgba(44, 166, 166, 0.8)' },
+                { offset: 1, color: 'rgba(44, 166, 166, 0.08)' },
+              ],
+              [
+                { offset: 0.5, color: 'rgba(34, 66, 186, 1)' },
+                { offset: 1, color: 'rgba(34, 66, 186, 0.8)' },
+                { offset: 1, color: 'rgba(34, 66, 186, 0.08)' },
+              ],
+              [
+                { offset: 0.5, color: 'rgba(34, 66, 186, 1)' },
+                { offset: 1, color: 'rgba(34, 66, 186, 0.8)' },
+                { offset: 1, color: 'rgba(34, 66, 186, 0.08)' },
+              ],
+            ];
 
-    const option = reactive(merge({
-      grid: {
-        top: '60px',
-        bottom: 10,
-        right: 20,
-        left: 10,
-        containLabel: true,
-      },
-      xAxis: {
-        offset: 8,
-        axisLine: {
-          show: true,
-          lineStyle: {
-            color: '#006c9d',
+      const option = reactive(
+        merge(
+          {
+            grid: {
+              top: '60px',
+              bottom: 10,
+              right: 20,
+              left: 10,
+              containLabel: true,
+            },
+            xAxis: {
+              offset: 8,
+              axisLine: {
+                show: true,
+                lineStyle: {
+                  color: '#006c9d',
+                },
+              },
+              axisLabel: {
+                color: '#ffffff',
+              },
+              axisTick: {
+                show: false,
+              },
+              splitLine: {
+                lineStyle: {
+                  color: 'rgba(21,80,126,.3)',
+                  type: 'dashed', //设置网格线类型 dotted：虚线   solid:实线
+                },
+                show: true,
+              },
+              showBackground: true,
+              backgroundStyle: {
+                color: 'rgba(205, 95, 255, 1)',
+              },
+              data: [],
+            },
 
-          },
-        },
-        axisLabel: {
-          color: '#ffffff',
-        },
-        axisTick: {
-          show: false
-        },
-        splitLine: {
-          lineStyle: {
-            color: 'rgba(21,80,126,.3)',
-            type: 'dashed', //设置网格线类型 dotted：虚线   solid:实线
-          },
-          show: true,
-        },
-        showBackground: true,
-        backgroundStyle: {
-          color: 'rgba(205, 95, 255, 1)',
-        },
-        data: [],
-      },
+            yAxis: {
+              type: 'value',
+              alignTicks: true,
+              axisLine: {
+                show: true,
+                lineStyle: {
+                  color: '#006c9d',
+                },
+              },
+              axisLabel: {
+                show: true,
+                color: '#ffffff',
+                // formatter: '{value}' + item.yname
+              },
+              interval: 1,
+              min: 0,
+              splitLine: {
+                lineStyle: {
+                  color: 'rgba(21,80,126,.3)',
+                  type: 'dashed', //设置网格线类型 dotted：虚线   solid:实线
+                },
+                // show: item.linetype == 'line' ? true : false,
+                show: true,
+              },
+              showBackground: true,
+              backgroundStyle: {
+                color: 'rgba(205, 95, 255, 1)',
+              },
+            },
 
-      yAxis: {
-        type: 'value',
-        alignTicks: true,
-        axisLine: {
-          show: true,
-          lineStyle: {
-            color: '#006c9d',
-          },
-        },
-        axisLabel: {
-          show: true,
-          color: '#ffffff',
-          // formatter: '{value}' + item.yname
-        },
-        interval: 1,
-        min: 0,
-        splitLine: {
-          lineStyle: {
-            color: 'rgba(21,80,126,.3)',
-            type: 'dashed', //设置网格线类型 dotted：虚线   solid:实线
+            series: [],
           },
-          // show: item.linetype == 'line' ? true : false,
-          show: true,
-        },
-        showBackground: true,
-        backgroundStyle: {
-          color: 'rgba(205, 95, 255, 1)',
-        },
-      },
+          props.option
+        )
+      );
 
-      series: []
-    }, props.option));
-
-    if (props.option) {
-      merge(option, props.option)
-    }
-
-    watchEffect(() => {
-      props.dataSource && option.series && initCharts();
-    });
+      if (props.option) {
+        merge(option, props.option);
+      }
 
+      watchEffect(() => {
+        props.dataSource && option.series && initCharts();
+      });
 
-    function initDta(xData: string[], yData: number[], ymax?) {
-      // 设置顶部和底部的值
-      let symbolData: number[] = [], newShadowHight: number[] = []
-      if(!ymax) ymax = Math.max(...yData)
+      function initDta(xData: string[], yData: number[], ymax?) {
+        // 设置顶部和底部的值
+        let symbolData: number[] = [],
+          newShadowHight: number[] = [];
+        if (!ymax) ymax = Math.max(...yData);
 
-      yData.forEach(() => {
-        symbolData.push(1)
-        newShadowHight.push(ymax)
-      })
-      var color = '#fff'
+        yData.forEach(() => {
+          symbolData.push(1);
+          newShadowHight.push(ymax);
+        });
+        var color = '#fff';
 
-      option.xAxis.data = xData as never[]
-      option.series = [
-        // 底部
-        {
-          z: 2,
-          type: 'pictorialBar',
-          symbol: 'diamond',
-          symbolOffset: ['0%', '50%'],
-          symbolSize: [30, 12],
-          toolltip: {
-            show: false
-          },
-          itemStyle: {
-            color: function (params) {
-              
-              return colors[params.dataIndex][1].color;
+        option.xAxis.data = xData as never[];
+        option.series = [
+          // 底部
+          {
+            z: 2,
+            type: 'pictorialBar',
+            symbol: 'diamond',
+            symbolOffset: ['0%', '50%'],
+            symbolSize: [30, 12],
+            toolltip: {
+              show: false,
             },
-          },
-          data: symbolData, // [1,1,1,1,1]
-        },
-        // 内容区域
-        {
-          z: 1,
-          type: 'bar',
-          barWidth: 30,
-          // name: legendData[0].name,
-          itemStyle: {
-            color: function (params) {
-              return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
-                {
-                  offset: 0,
-                  // @ts-ignore
-                  color: colors[params.dataIndex][1].color,
-                },
-                {
-                  offset: 1,
-                  color: colors[params.dataIndex][2].color,
-                },
-              ]);
+            itemStyle: {
+              color: function (params) {
+                return colors[params.dataIndex][1].color;
+              },
             },
+            data: symbolData, // [1,1,1,1,1]
           },
-          label: {
-            show: true, //开启显示
-            position: 'top', //在上方显示
-            // formatter: '{c}%',//显示百分号
-            textStyle: { //数值样式
-              // color: function (params) {
-              //   return props.fontColor.length > params ? props.fontColor[params.dataIndex] : '#fff';
-              // },
-              color: color,
-              fontSize: 13//字体大小
-            }
+          // 内容区域
+          {
+            z: 1,
+            type: 'bar',
+            barWidth: 30,
+            // name: legendData[0].name,
+            itemStyle: {
+              color: function (params) {
+                return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                  {
+                    offset: 0,
+                    // @ts-ignore
+                    color: colors[params.dataIndex][1].color,
+                  },
+                  {
+                    offset: 1,
+                    color: colors[params.dataIndex][2].color,
+                  },
+                ]);
+              },
+            },
+            label: {
+              show: true, //开启显示
+              position: 'top', //在上方显示
+              // formatter: '{c}%',//显示百分号
+              textStyle: {
+                //数值样式
+                // color: function (params) {
+                //   return props.fontColor.length > params ? props.fontColor[params.dataIndex] : '#fff';
+                // },
+                color: color,
+                fontSize: 13, //字体大小
+              },
+            },
+            data: yData,
           },
-          data: yData
-        },
 
-        // 内容的顶部
-        {
-          z: 3,
-          type: 'pictorialBar',
-          symbol: 'diamond',
-          symbolPosition: 'end',
-          symbolOffset: ['0%', '-50%'],
-          symbolSize: [30, 12],
-          toolltip: {
-            show: false
-          },
-          itemStyle: {
-            color: function (params) {
-              color = colors[params.dataIndex][1].color
-              return colors[params.dataIndex][0].color;
+          // 内容的顶部
+          {
+            z: 3,
+            type: 'pictorialBar',
+            symbol: 'diamond',
+            symbolPosition: 'end',
+            symbolOffset: ['0%', '-50%'],
+            symbolSize: [30, 12],
+            toolltip: {
+              show: false,
             },
+            itemStyle: {
+              color: function (params) {
+                color = colors[params.dataIndex][1].color;
+                return colors[params.dataIndex][0].color;
+              },
+            },
+
+            data: yData,
           },
-          
-          data: yData,
-        },
-        // 阴影区域
-        {
-          z: 0,
-          type: 'bar',
-          barWidth: 30,
-          barGap: "-100%",
-          data: newShadowHight,
-          itemStyle: {
-            color: "#00365F66"
-          }
-        },
-        // 阴影的顶部
-        {
-          z: 3,
-          type: 'pictorialBar',
-          symbol: 'diamond',
-          symbolPosition: 'end',
-          symbolOffset: ['0%', '-50%'],
-          symbolSize: [30, 12],
-          toolltip: {
-            show: false
+          // 阴影区域
+          {
+            z: 0,
+            type: 'bar',
+            barWidth: 30,
+            barGap: '-100%',
+            data: newShadowHight,
+            itemStyle: {
+              color: '#00365F66',
+            },
           },
-          itemStyle: {
-            color: "#00365F66"
+          // 阴影的顶部
+          {
+            z: 3,
+            type: 'pictorialBar',
+            symbol: 'diamond',
+            symbolPosition: 'end',
+            symbolOffset: ['0%', '-50%'],
+            symbolSize: [30, 12],
+            toolltip: {
+              show: false,
+            },
+            itemStyle: {
+              color: '#00365F66',
+            },
+            data: newShadowHight,
           },
-          data: newShadowHight,
-        }
-      ] as never[]
-
-    }
-
-    function initCharts() {
-
-      //轴数据
-      if (option.series) {
-        const xAxisData: any[] = [];
-        const series: any[] = [];
-        const seriesData: any[] = [];
-        // const legendData: { name: string, itemStyle: Object }[] = [];
-        let ymax = 0
-        props.xAxisData.forEach((item: any, index) => {
-
-          xAxisData.push(item['key']);
-          // seriesData.push(props.dataSource[item.valueKey] || '');
-          seriesData.push(props.dataSource[item.valueKey]);
+        ] as never[];
+      }
 
-        });
+      function initCharts() {
+        //轴数据
+        if (option.series) {
+          const xAxisData: any[] = [];
+          const series: any[] = [];
+          const seriesData: any[] = [];
+          // const legendData: { name: string, itemStyle: Object }[] = [];
+          let ymax = 0;
+          props.xAxisData.forEach((item: any, index) => {
+            xAxisData.push(item['key']);
+            // seriesData.push(props.dataSource[item.valueKey] || '');
+            seriesData.push(props.dataSource[item.valueKey]);
+          });
 
-        for (let i = 0; i < chartsColumns.length; i++) {
-          const item: any = chartsColumns[i]
-          // legendData.push({
-          //   name: item.legend + (item.yname ? '(' + item.yname + ')' : ''),
-          //   itemStyle: {
-          //     color: new echarts.graphic.LinearGradient(1, 0, 0, 0, colors[i]),
-          //   },
-          // })
-          if (!ymax && item['ymax']) {
-            ymax = item['ymax']
+          for (let i = 0; i < chartsColumns.length; i++) {
+            const item: any = chartsColumns[i];
+            // legendData.push({
+            //   name: item.legend + (item.yname ? '(' + item.yname + ')' : ''),
+            //   itemStyle: {
+            //     color: new echarts.graphic.LinearGradient(1, 0, 0, 0, colors[i]),
+            //   },
+            // })
+            if (!ymax && item['ymax']) {
+              ymax = item['ymax'];
+            }
           }
 
-        }
+          // option.legend.data = legendData
+          // option.series[0].data = seriesData;
 
-        // option.legend.data = legendData
-        // option.series[0].data = seriesData;
+          // option.series = series;
+          // option.xAxis.data = xAxisData;
 
-        // option.series = series;
-        // option.xAxis.data = xAxisData;
+          initDta(xAxisData, seriesData);
 
-        initDta(xAxisData, seriesData)
+          console.log('option------------->', option);
 
-        console.log('option------------->', option);
-
-        setOptions(option, false);
+          setOptions(option, false);
+        }
       }
-    }
-    return { chartRef };
-  },
-});
+      return { chartRef };
+    },
+  });
 </script>

src/hooks/system/useCamera.ts

@@ -205,7 +205,7 @@ export function useCamera() {
                 fluid: true,
                 autoplay: true,
                 isLive: true,
-                playsinline: false,
+                playsinline: true,
                 screenShot: true,
                 whitelist: [''],
                 ignores: ['time'],
@@ -245,16 +245,16 @@ export function useCamera() {
                   cors: true,
                   poster: '/src/assets/images/vent/noSinge.png',
                   hls: {
-                    retryCount: 3, // 重试 3 次，默认值
-                    retryDelay: 1000, // 每次重试间隔 1 秒，默认值
+                    retryCount: 10, // 重试 3 次，默认值
+                    retryDelay: 30000, // 每次重试间隔 1 秒，默认值
                     loadTimeout: 10000, // 请求超时时间为 10 秒，默认值
+                    disconnectTime: 30, //直播断流时间，
                     fetchOptions: {
                       // 该参数会透传给 fetch，默认值为 undefined
                       mode: 'cors',
                     },
                     targetLatency: 10, // 直播目标延迟，默认 10 秒
                     maxLatency: 20, // 直播允许的最大延迟，默认 20 秒
-                    disconnectTime: 10, // 直播断流时间，默认 0 秒，（独立使用时等于 maxLatency）
                     maxJumpDistance: 10,
                   },
                 });
@@ -272,16 +272,16 @@ export function useCamera() {
                   plugins: [HlsPlugin], // 第二步
                   poster: '/src/assets/images/vent/noSinge.png',
                   hls: {
-                    retryCount: 3, // 重试 3 次，默认值
-                    retryDelay: 1000, // 每次重试间隔 1 秒，默认值
+                    retryCount: 10, // 重试 3 次，默认值
+                    retryDelay: 30000, // 每次重试间隔 1 秒，默认值
                     loadTimeout: 10000, // 请求超时时间为 10 秒，默认值
+                    disconnectTime: 30,
                     fetchOptions: {
                       // 该参数会透传给 fetch，默认值为 undefined
                       mode: 'cors',
                     },
                     targetLatency: 10, // 直播目标延迟，默认 10 秒
                     maxLatency: 20, // 直播允许的最大延迟，默认 20 秒
-                    disconnectTime: 10, // 直播断流时间，默认 0 秒，（独立使用时等于 maxLatency）
                     maxJumpDistance: 10,
                   },
                 });

src/qiankun/apps.ts

@@ -11,6 +11,7 @@ const _apps: AppMetadata[] = [];
 for (const key in import.meta.env) {
   if (key === 'VITE_APP_SUB_APP') {
     const appList = JSON.parse(import.meta.env[key].replace(/'/g, '"'));
+
     appList.forEach((app) => {
       let utlStr;
       if (import.meta.env.PROD) {

src/utils/echartsUtil.ts

@@ -1,4 +1,5 @@
 import echarts from '/@/utils/lib/echarts';
+import { merge } from 'lodash-es';
 export default class echartsUtil {
   option: any;
   type: string;
@@ -58,7 +59,8 @@ export default class echartsUtil {
     grid = this.getGrid(yAxis, type);
     // timeline = this.getTimeline(xdata, ydata);
     tooltip = this.getTooltip();
-    xAxis = this.getXAxis(xdata, series, type);
+    debugger;
+    xAxis = merge(this.getXAxis(xdata, series, type), [{ ...this.option.xAxis }]);
 
     dataZoom = this.getDataZoom(type);
 
@@ -131,17 +133,18 @@ export default class echartsUtil {
         axisLabel: {
           show: true,
           color: '#ffffffbb',
+          // interval: 0,
           rotate: rotate,
           formatter: function (params) {
-            var newParamsName = '';
+            let newParamsName = '';
             const paramsNameNumber = params.length;
             const provideNumber = 10; // 单行显示文字个数
             const rowNumber = Math.ceil(paramsNameNumber / provideNumber);
             if (paramsNameNumber > provideNumber) {
               for (let p = 0; p < rowNumber; p++) {
-                var tempStr = '';
-                var start = p * provideNumber;
-                var end = start + provideNumber;
+                let tempStr = '';
+                const start = p * provideNumber;
+                const end = start + provideNumber;
                 if (p === rowNumber - 1) {
                   tempStr = params.substring(start, paramsNameNumber);
                 } else {
@@ -185,7 +188,13 @@ export default class echartsUtil {
       axisLabel: {
         show: true,
         color: '#ffffffcc',
-        // formatter: '{value}' + item.yname
+        formatter: function (value) {
+          if (typeof value === 'number' && /[\.]/.test(value)) {
+            return Math.round(value * 100) / 100;
+          } else {
+            return value;
+          }
+        },
       },
       splitLine: {
         lineStyle: {
@@ -208,6 +217,7 @@ export default class echartsUtil {
       type: item.linetype,
       yAxisIndex: item.sort - 1,
       barCategoryGap: '30%',
+      showSymbol: false,
       data: [...ylist],
       barMaxWidth: '20',
       itemStyle: {

src/views/vent/deviceManager/comment/warningTabel/BaseModal.vue

@@ -3,130 +3,124 @@
     <BasicForm @register="registerForm">
       <template #monitor="{ model, field }">
         <div class="vent-flex-row-between">
-          <Select ref="selectRef" disabled v-model:value="pointData" :options="option"
-            style="width: calc(100% - 65px);" />
-          <a-button class="vent-margin-b-5" type="primary" @click="selectPoint(model['strtype'])"
-            style="position: absolute; right: 0; top: 1px;">选择</a-button>
+          <Select ref="selectRef" disabled v-model:value="pointData" :options="option" style="width: calc(100% - 65px)" />
+          <a-button class="vent-margin-b-5" type="primary" @click="selectPoint(model['strtype'])" style="position: absolute; right: 0; top: 1px"
+            >选择</a-button
+          >
         </div>
       </template>
     </BasicForm>
   </BasicModal>
-  <DevicePointTable @register="registerModal" :data-source="devicePointList" :selection-row-keys="pointData"
-    @reload="setPoint" />
+  <DevicePointTable @register="registerModal" :data-source="devicePointList" :selection-row-keys="pointData" @reload="setPoint" />
 </template>
 <script lang="ts" setup>
-import { onMounted, ref, defineEmits, unref, nextTick } from 'vue';
-import { BasicForm, useForm } from '/@/components/Form/index';
-import { BasicModal, useModalInner, useModal } from '/@/components/Modal';
-import type { FormSchema } from '/@/components/Form/src/types/form';
-import { Select, message } from 'ant-design-vue';
-import DevicePointTable from './DevicePointTable.vue';
-import { workFacePointList } from './warning.api'
+  import { onMounted, ref, defineEmits, unref, nextTick } from 'vue';
+  import { BasicForm, useForm } from '/@/components/Form/index';
+  import { BasicModal, useModalInner, useModal } from '/@/components/Modal';
+  import type { FormSchema } from '/@/components/Form/src/types/form';
+  import { Select, message } from 'ant-design-vue';
+  import DevicePointTable from './DevicePointTable.vue';
+  import { workFacePointList } from './warning.api';
 
-const props = defineProps({
-  formSchemas: {
-    type: Array as PropType<FormSchema[]>,
-    default: () => ([]),
-  },
-  deviceId: { type: String },
-  monitorType: {
-    type: String,
-    default: '2'
-  }
-})
-const emit = defineEmits(['add', 'update', 'register'])
-const option = ref<any[]>([])
-const devicePointList = ref<any[]>([])
-const pointData = ref<String[]>([])
-const title = ref('')
-const isUpdate = ref(false)
-// 注册 form
-const [registerForm, { resetFields, setFieldsValue, validate, getFieldsValue }] = useForm({
-  schemas: props.formSchemas,
-  showActionButtonGroup: false,
-});
+  const props = defineProps({
+    formSchemas: {
+      type: Array as PropType<FormSchema[]>,
+      default: () => [],
+    },
+    deviceId: { type: String },
+    monitorType: {
+      type: String,
+      default: '2',
+    },
+  });
+  const emit = defineEmits(['add', 'update', 'register']);
+  const option = ref<any[]>([]);
+  const devicePointList = ref<any[]>([]);
+  const pointData = ref<String[]>([]);
+  const title = ref('');
+  const isUpdate = ref(false);
+  // 注册 form
+  const [registerForm, { resetFields, setFieldsValue, validate, getFieldsValue }] = useForm({
+    schemas: props.formSchemas,
+    showActionButtonGroup: false,
+  });
 
-// 注册 modal
-const [register, { setModalProps }] = useModalInner(async (data) => {
-  isUpdate.value = unref(data.isUpdate);
-  title.value = unref(data.title);
-  await resetFields();
-  if (data.isUpdate) {
-    await setFieldsValue({ ...data.record });
-    pointData.value = [data.record['monitorId']]
+  // 注册 modal
+  const [register, { setModalProps }] = useModalInner(async (data) => {
+    isUpdate.value = unref(data.isUpdate);
+    title.value = unref(data.title);
+    await resetFields();
+    if (data.isUpdate) {
+      await setFieldsValue({ ...data.record });
+      pointData.value = [data.record['monitorId']];
 
-    await getDevicePointList(data.record['deviceId'])
-    devicePointList.value.forEach(item => {
-      if (item['id'] == pointData.value) {
-        setPoint([item])
-      }
-    })
-    // 初始打开有数据时候要查点表
+      await getDevicePointList(data.record['deviceId']);
+      devicePointList.value.forEach((item) => {
+        if (item['id'] == pointData.value) {
+          setPoint([item]);
+        }
+      });
+      // 初始打开有数据时候要查点表
+    } else if (data.record) {
+      await setFieldsValue({ relId: data.record['relId'] || data.record['id'], monitorId: '' });
+    }
+  });
+
+  const [registerModal, { openModal }] = useModal();
 
-  } else if (data.record) {
-    await setFieldsValue({ relId: data.record['relId'] || data.record['id'], monitorId: '' });
+  async function getDevicePointList(strtype) {
+    try {
+      const result = await workFacePointList({ deviceType: strtype, valueType: props.monitorType });
+      devicePointList.value = result;
+    } catch (error) {
+      devicePointList.value = [];
+    }
   }
-});
 
-const [registerModal, { openModal }] = useModal();
+  async function onSubmit() {
+    try {
+      const data = await getFieldsValue();
+      await setFieldsValue({ ...data, monitorId: pointData.value[0] });
+      const values = await validate();
+      setModalProps({ confirmLoading: true });
 
-async function getDevicePointList(strtype) {
-  try {
-    const result = await workFacePointList({ deviceType: strtype, valueType: props.monitorType });
-    devicePointList.value = result
-  } catch (error) {
-    devicePointList.value = []
+      // 提交表单
+      if (!isUpdate.value) {
+        emit('add', 'add', values);
+      } else {
+        emit('update', 'update', values);
+      }
+      // //关闭弹窗
+      // closeModal();
+      // //刷新列表
+      // reload()
+    } finally {
+      setModalProps({ confirmLoading: false });
+    }
   }
-};
 
-async function onSubmit() {
-  try {
-    const data = await getFieldsValue()
-    await setFieldsValue({ ...data, monitorId: pointData.value[0] })
-    const values = await validate();
-    setModalProps({ confirmLoading: true });
-
-    // 提交表单
-    if (!isUpdate.value) {
-      emit('add', 'add', values)
+  async function selectPoint(strtype) {
+    if (strtype) {
+      await getDevicePointList(strtype);
+      openModal();
     } else {
-      emit('update', 'update', values)
+      message.info('请先选择设备！');
     }
-    // //关闭弹窗
-    // closeModal();
-    // //刷新列表
-    // reload()
-  } finally {
-    setModalProps({ confirmLoading: false });
   }
-}
-
-async function selectPoint(strtype) {
-  if (strtype) {
 
-    await getDevicePointList(strtype)
-    openModal()
-  } else {
-    message.info('请先选择设备！')
+  function setPoint(value) {
+    const data = value[0];
+    option.value = [
+      {
+        value: data.id,
+        label: data.valuename,
+      },
+    ];
+    nextTick(() => {
+      pointData.value = [data.id];
+    });
   }
-}
-
-function setPoint(value) {
-  const data = value[0]
-  option.value = [
-    {
-      value: data.id,
-      label: data.valuename
-    }
-  ]
-  nextTick(() => {
-    pointData.value = [data.id]
-  })
-}
-
-onMounted(async () => {
-
-});
 
+  onMounted(async () => {});
 </script>
 <style scoped lang="less"></style>

src/views/vent/deviceManager/comment/warningTabel/index1.vue

@@ -6,15 +6,15 @@
       </div>
     </div>
     <div class="device-box">
-      <a-button class="vent-margin-b-5" type="primary" @click="handleOpen"> 新增 </a-button>
+      <a-button class="vent-margin-b-5" type="primary" @click="handleOpen($event)"> 新增 </a-button>
       <a-table :columns="controlColumns" :data-source="dataSource" bordered :scroll="{ y: 500 }" :pagination="false">
         <template #bodyCell="{ column, record }">
           <template v-if="column.dataIndex === 'operation'">
-            <a class="action-link" @click="handleOpen(record)">编辑</a>
+            <a class="action-link" @click="handleOpen($event, record)">编辑</a>
             <a class="action-link vent-margin-l-10" @click="handleDelete(record)">删除</a>
           </template>
           <template v-if="column.dataIndex === 'operation1'">
-            <a class="action-link" @click="handleOpen()">新增</a>
+            <a class="action-link" @click="handleOpen($event)">新增</a>
           </template>
         </template>
       </a-table>
@@ -56,7 +56,7 @@
 
   const [register, { openModal, closeModal }] = useModal();
 
-  function handleOpen(record?) {
+  function handleOpen(event: Event, record?) {
     if (!activeID.value) {
       message.warning('请先选择预警条目！');
       return;

src/views/vent/deviceManager/comment/warningTabel/warning.data.ts

@@ -314,7 +314,6 @@ export const controlFormSchemas = (param) =>
         };
       },
     },
-
     {
       label: '点位',
       field: 'monitorId',
@@ -323,6 +322,12 @@ export const controlFormSchemas = (param) =>
       required: true,
     },
     {
+      label: '值',
+      field: 'value',
+      component: 'Input',
+      align: 'center',
+    },
+    {
       label: '执行顺序',
       field: 'orderNum',
       component: 'InputNumber',
@@ -737,4 +742,3 @@ export const testData1 = [
     updateBy: 'Dublin No. 2 Lake Park',
   },
 ];
-

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

@@ -50,8 +50,15 @@
             </div>
           </div>
           <!-- <div ref="alarmCounts" style="height: 225px" id="alarmCounts"></div> -->
-          <BarSingle :xAxisData="xAxisData" :dataSource="windData.levels" height="225px" :chartsColumns="chartsColumns"
-            :option="option" :color="colors" :fontColor="fontColor" />
+          <BarSingle
+            :xAxisData="xAxisData"
+            :dataSource="windData.levels"
+            height="225px"
+            :chartsColumns="chartsColumns"
+            :option="option"
+            :color="colors"
+            :fontColor="fontColor"
+          />
         </template>
       </ventBox1>
       <ventBox1 class="vent-margin-t-10">
@@ -67,30 +74,34 @@
                 </div>
                 <div></div>
                 <img :src="item.url" :alt="item.text" />
-                <div class="level-text" :class="{
-                  'level-text-0': item.level == 0,
-                  'level-text-1': item.level == 101,
-                  'level-text-2': item.level == 102,
-                  'level-text-3': item.level == 103,
-                  'level-text-4': item.level == 104,
-                  'level-text-5': item.level == 201,
-                  'level-text-6':
-                    item.level != 0 && item.level != 101 && item.level != 102 && item.level != 103 && item.level != 104 && item.level != 201,
-                }">{{
-                  item.level == 0
-                    ? '低风险'
-                    : item.level == 101
+                <div
+                  class="level-text"
+                  :class="{
+                    'level-text-0': item.level == 0,
+                    'level-text-1': item.level == 101,
+                    'level-text-2': item.level == 102,
+                    'level-text-3': item.level == 103,
+                    'level-text-4': item.level == 104,
+                    'level-text-5': item.level == 201,
+                    'level-text-6':
+                      item.level != 0 && item.level != 101 && item.level != 102 && item.level != 103 && item.level != 104 && item.level != 201,
+                  }"
+                  >{{
+                    item.level == 0
+                      ? '低风险'
+                      : item.level == 101
                       ? '低风险'
                       : item.level == 102
-                        ? '一般风险'
-                        : item.level == 103
-                          ? '较大风险'
-                          : item.level == 104
-                            ? '较大风险'
-                            : item.level == 201
-                              ? '报警'
-                              : '未连接'
-                }}</div>
+                      ? '一般风险'
+                      : item.level == 103
+                      ? '较大风险'
+                      : item.level == 104
+                      ? '较大风险'
+                      : item.level == 201
+                      ? '报警'
+                      : '未连接'
+                  }}</div
+                >
               </div>
             </template>
           </div>
@@ -100,21 +111,28 @@
     <div class="center-box">
       <div class="animation-box">
         <canvas class="rain"></canvas>
-        <div class="bottom" :class="{
-          bottom1: centerData.levels == 101 || centerData.levels == 0 || centerData.levels == 10000,
-          bottom2: centerData.levels == 102,
-          bottom3: centerData.levels == 103,
-          bottom4: centerData.levels == 104,
-          bottom5: centerData.levels == 201,
-        }">
+        <div
+          class="bottom"
+          :class="{
+            bottom1: centerData.levels == 101 || centerData.levels == 0 || centerData.levels == 10000,
+            bottom2: centerData.levels == 102,
+            bottom3: centerData.levels == 103,
+            bottom4: centerData.levels == 104,
+            bottom5: centerData.levels == 201,
+          }"
+        >
           <div class="animation1">
             <div class="ball"></div>
-            <svg xmlns="http://www.w3.org/2000/svg" width="375.334" height="77.559" viewBox="0 0 375.334 77.559"
-              style="opacity: 0.5">
+            <svg xmlns="http://www.w3.org/2000/svg" width="375.334" height="77.559" viewBox="0 0 375.334 77.559" style="opacity: 0.5">
               <g id="组_14135" data-name="组 14135" transform="translate(-755.058 -139.886)">
-                <path id="椭圆_2595" data-name="椭圆 2595"
+                <path
+                  id="椭圆_2595"
+                  data-name="椭圆 2595"
                   d="M186.917-.75c12.711,0,25.415.263,37.757.783,12.03.506,23.863,1.262,35.171,2.245,11.1.966,21.816,2.161,31.835,3.553,9.928,1.379,19.265,2.963,27.751,4.709s16.2,3.668,22.92,5.713A120.653,120.653,0,0,1,359.7,22.825a40.842,40.842,0,0,1,11.018,7.3c2.568,2.581,3.87,5.239,3.87,7.9s-1.3,5.322-3.87,7.9a40.842,40.842,0,0,1-11.018,7.3,120.653,120.653,0,0,1-17.345,6.572c-6.716,2.044-14.428,3.966-22.92,5.713s-17.823,3.329-27.751,4.709c-10.02,1.392-20.731,2.588-31.835,3.553-11.308.984-23.142,1.739-35.171,2.245-12.343.519-25.046.783-37.757.783s-25.415-.263-37.757-.783c-12.03-.506-23.863-1.262-35.171-2.245-11.1-.966-21.816-2.161-31.835-3.553-9.928-1.379-19.265-2.963-27.751-4.709s-16.2-3.668-22.92-5.713a120.652,120.652,0,0,1-17.345-6.572,40.841,40.841,0,0,1-11.018-7.3c-2.568-2.581-3.87-5.239-3.87-7.9s1.3-5.322,3.87-7.9a40.842,40.842,0,0,1,11.018-7.3,120.651,120.651,0,0,1,17.345-6.572C38.2,14.208,45.91,12.286,54.4,10.54S72.225,7.211,82.153,5.831c10.02-1.392,20.731-2.588,31.835-3.553C125.3,1.294,137.13.539,149.16.033,161.5-.487,174.206-.75,186.917-.75Zm0,76.98c49.941,0,96.885-4,132.186-11.257,17.134-3.523,30.578-7.623,39.96-12.184,9.642-4.688,14.53-9.653,14.53-14.759s-4.889-10.072-14.53-14.759c-9.382-4.561-22.826-8.66-39.96-12.184C283.8,3.827,236.858-.171,186.917-.171s-96.885,4-132.186,11.257C37.6,14.61,24.153,18.709,14.771,23.27,5.129,27.958.241,32.923.241,38.029S5.129,48.1,14.771,52.789c9.382,4.561,22.826,8.661,39.96,12.184C90.032,72.232,136.976,76.23,186.917,76.23Z"
-                  transform="translate(755.808 140.636)" fill="#28a6ff" opacity="0.7" />
+                  transform="translate(755.808 140.636)"
+                  fill="#28a6ff"
+                  opacity="0.7"
+                />
               </g>
             </svg>
           </div>
@@ -122,9 +140,14 @@
             <div class="ball1"></div>
             <svg xmlns="http://www.w3.org/2000/svg" width="414.878" height="91.7" viewBox="0 0 414.878 91.7">
               <g id="组_14136" data-name="组 14136" transform="translate(-721.822 -158.273)">
-                <path id="椭圆_2595" data-name="椭圆 2595"
+                <path
+                  id="椭圆_2595"
+                  data-name="椭圆 2595"
                   d="M206.689-.75c14.05,0,28.092.311,41.735.925,13.3.6,26.377,1.492,38.877,2.655,12.275,1.142,24.114,2.555,35.189,4.2,10.974,1.631,21.294,3.5,30.674,5.567s17.91,4.337,25.335,6.754a128.134,128.134,0,0,1,19.172,7.771,45.082,45.082,0,0,1,12.178,8.633c2.838,3.051,4.278,6.195,4.278,9.344s-1.439,6.293-4.278,9.344a45.082,45.082,0,0,1-12.178,8.633A128.134,128.134,0,0,1,378.5,70.847c-7.424,2.417-15.948,4.69-25.335,6.754s-19.7,3.936-30.674,5.567c-11.075,1.646-22.915,3.059-35.189,4.2-12.5,1.163-25.58,2.056-38.877,2.655-13.643.614-27.685.925-41.735.925s-28.092-.311-41.735-.925c-13.3-.6-26.377-1.492-38.877-2.655-12.275-1.142-24.114-2.555-35.189-4.2-10.974-1.631-21.294-3.5-30.674-5.567S42.3,73.265,34.879,70.847a128.133,128.133,0,0,1-19.173-7.771A45.082,45.082,0,0,1,3.528,54.444C.689,51.393-.75,48.249-.75,45.1s1.439-6.293,4.278-9.344a45.083,45.083,0,0,1,12.178-8.633,128.133,128.133,0,0,1,19.173-7.771c7.424-2.417,15.948-4.69,25.335-6.754s19.7-3.936,30.674-5.567c11.075-1.646,22.915-3.059,35.189-4.2,12.5-1.163,25.58-2.056,38.877-2.655C178.6-.439,192.639-.75,206.689-.75Zm0,91.015c55.2,0,107.093-4.727,146.113-13.31,18.939-4.166,33.8-9.012,44.17-14.405,10.657-5.542,16.061-11.413,16.061-17.45s-5.4-11.908-16.061-17.45c-10.37-5.393-25.231-10.24-44.17-14.405C313.782,4.662,261.892-.065,206.689-.065S99.6,4.662,60.576,13.244c-18.939,4.166-33.8,9.012-44.17,14.405C5.749,33.192.345,39.063.345,45.1s5.4,11.908,16.061,17.45c10.37,5.393,25.231,10.24,44.17,14.405C99.6,85.538,151.487,90.265,206.689,90.265Z"
-                  transform="translate(722.572 159.023)" fill="#3dd8ff" opacity="0.5" />
+                  transform="translate(722.572 159.023)"
+                  fill="#3dd8ff"
+                  opacity="0.5"
+                />
               </g>
             </svg>
           </div>
@@ -133,18 +156,18 @@
               centerData.levels == 101
                 ? '低风险'
                 : centerData.levels == 102
-                  ? '一般风险'
-                  : centerData.levels == 103
-                    ? '较大风险'
-                    : centerData.levels == 104
-                      ? '重大风险'
-                      : centerData.levels == 201
-                        ? '报警'
-                        : // : centerData.levels == 0
-                        // ? '正常'
-                        // : centerData.levels == 10000
-                        // ? '正常'
-                        '低风险'
+                ? '一般风险'
+                : centerData.levels == 103
+                ? '较大风险'
+                : centerData.levels == 104
+                ? '重大风险'
+                : centerData.levels == 201
+                ? '报警'
+                : // : centerData.levels == 0
+                  // ? '正常'
+                  // : centerData.levels == 10000
+                  // ? '正常'
+                  '低风险'
             }}</div>
             <div class="text2">风险分析</div>
           </div>
@@ -158,8 +181,7 @@
             </div>
             <div class="item-monitor-box">
               <span class="title">火灾监测预警</span>
-              <span :class="centerData.fire ? 'value' : 'value1'">{{ centerData.fire == '正常' ? '低风险' : centerData.fire
-                }}</span>
+              <span :class="centerData.fire ? 'value' : 'value1'">{{ centerData.fire == '正常' ? '低风险' : centerData.fire }}</span>
             </div>
           </div>
           <div class="item item2">
@@ -168,8 +190,7 @@
             </div>
             <div class="item-monitor-box">
               <span class="title">设备监测预警</span>
-              <span :class="centerData.sb ? 'value' : 'value1'">{{ centerData.sb == '正常' ? '低风险' : centerData.sb
-                }}</span>
+              <span :class="centerData.sb ? 'value' : 'value1'">{{ centerData.sb == '正常' ? '低风险' : centerData.sb }}</span>
             </div>
           </div>
           <div class="item item3">
@@ -178,8 +199,7 @@
             </div>
             <div class="item-monitor-box">
               <span class="title">粉尘监测预警</span>
-              <span :class="centerData.fc ? 'value' : 'value1'">{{ centerData.fc == '正常' ? '低风险' : centerData.fc
-                }}</span>
+              <span :class="centerData.fc ? 'value' : 'value1'">{{ centerData.fc == '正常' ? '低风险' : centerData.fc }}</span>
             </div>
           </div>
           <div class="item item4">
@@ -188,8 +208,7 @@
             </div>
             <div class="item-monitor-box">
               <span class="title">瓦斯监测预警</span>
-              <span :class="centerData.ws ? 'value' : 'value1'">{{ centerData.ws == '正常' ? '低风险' : centerData.ws
-                }}</span>
+              <span :class="centerData.ws ? 'value' : 'value1'">{{ centerData.ws == '正常' ? '低风险' : centerData.ws }}</span>
               <div class="">
                 <span class="title">矿井瓦斯鉴定等级监测</span>
                 <span class="value">低瓦斯</span>
@@ -202,8 +221,7 @@
             </div>
             <div class="item-monitor-box">
               <span class="title">通风监测预警</span>
-              <span :class="centerData.tf ? 'value' : 'value1'">{{ centerData.tf == '正常' ? '低风险' : centerData.tf
-                }}</span>
+              <span :class="centerData.tf ? 'value' : 'value1'">{{ centerData.tf == '正常' ? '低风险' : centerData.tf }}</span>
             </div>
           </div>
         </div>
@@ -214,15 +232,17 @@
           <div class="item item1">
             <div class="icon"></div>
             <div class="data-box" v-for="(item, index) in fireMonitor1" :key="index">
-              <div :class="{
-                value1: item.level == 0,
-                value2: item.level == 101,
-                value3: item.level == 102,
-                value4: item.level == 103,
-                value5: item.level == 104,
-                value6: item.level == 201,
-                value: item.level != 0 && item.level != 101 && item.level != 102 && item.level != 103 && item.level != 104 && item.level != 201,
-              }">{{ item.value ? item.value : '-' }}
+              <div
+                :class="{
+                  value1: item.level == 0,
+                  value2: item.level == 101,
+                  value3: item.level == 102,
+                  value4: item.level == 103,
+                  value5: item.level == 104,
+                  value6: item.level == 201,
+                  value: item.level != 0 && item.level != 101 && item.level != 102 && item.level != 103 && item.level != 104 && item.level != 201,
+                }"
+                >{{ item.value ? item.value : '-' }}
               </div>
               <div class="title">{{ item.title }}</div>
             </div>
@@ -230,10 +250,7 @@
           <div class="item">
             <div class="icon"></div>
             <div class="data-box" v-for="(item, index) in fireMonitor" :key="index">
-
-              <div class="value1"> {{ !item.value  ? '-' : item.value == '正常' ? '低风险' : item.value
-                }}
-              </div>
+              <div class="value1"> {{ !item.value ? '-' : item.value == '正常' ? '低风险' : item.value }} </div>
               <div class="title">{{ item.title }}</div>
             </div>
           </div>
@@ -287,8 +304,15 @@
             </div>
           </div> -->
 
-          <BarSingle :xAxisData="xAxisData" :dataSource="dustData.levels" height="332px" :chartsColumns="chartsColumns"
-            :option="option" :color="colors" :fontColor="fontColor" />
+          <BarSingle
+            :xAxisData="xAxisData"
+            :dataSource="dustData.levels"
+            height="332px"
+            :chartsColumns="chartsColumns"
+            :option="option"
+            :color="colors"
+            :fontColor="fontColor"
+          />
         </template>
       </ventBox1>
     </div>
@@ -296,1177 +320,1180 @@
 </template>
 
 <script setup lang="ts">
-import { ref, onMounted, onUnmounted, reactive, } from 'vue';
-import { useRouter } from 'vue-router';
-import customHeader from '/@/components/vent/customHeader.vue';
-import { getTotalList, sysTypeWarnList } from './alarm.api';
-import { iconsMonitor, chartsColumns, xAxisData, option, colors, fontColor, fireMonitor, fireMonitor1 } from './alarm.data';
-import ventBox1 from '/@/components/vent/ventBox1.vue';
-import BarSingle from '../../../../components/chart/BarSingle.vue';
-import { rainBg } from '/@/utils/ui.js';
-
-let router = useRouter()
-
-const warnNumMap = new Map([
-  ['fire', 0],
-  ['dust', 0],
-  ['vent', 0],
-  ['gas', 0],
-]);
-
-const resetScroll = (e: Event) => {
-  if (e.target && e.target) (e.target as Element).scrollTop = 0;
-};
-let windData = reactive({
-  levels: {},
-  jf: 0,
-  hf: 0,
-  xf: 0,
-}); //通风监测数据
-let dustData = reactive({
-  //粉尘监测数据
-  levels: {},
-});
-let centerData = reactive({
-  fire: '',
-  tf: '',
-  ws: '',
-  sb: '',
-  fc: '',
-  levels: 0,
-});
-//瓦斯
-let gasMonitor = reactive<any[]>([]);
-let gasData = {
-  sums: 0,
-  sums1: 0,
-};
-
-//跳转详情
-function showModal(data) {
-  switch (data) {
-    case 'vent':
-      router.push('/ventilate/warn/home')
-      break;
-    case 'fire':
-      router.push('/fire/warn/home')
-      break;
-    case 'dust':
-      router.push('/dust/warn/home')
-      break;
-    case 'gas':
-      router.push('/gas/warn/home')
-      break;
-    case 'sbyj':
-      router.push('/device/warn/home')
-      break;
-  }
-}
-
-
-// https获取监测数据
-let timer: null | NodeJS.Timeout = null;
-function getMonitor(flag = false) {
-  timer = setTimeout(
-    async () => {
-      // await getDataSource();
-      await getList();
-      if (timer) {
-        timer = null;
-      }
-      getMonitor();
-    },
-    flag ? 0 : 10000
-  );
-}
-
-// 获取预警数据
-async function getList() {
-  const res = await getTotalList({});
-  console.log(res, '预警数据--------------');
-  let data = [];
-  windData.levels = res.info.sysInfo.ventS.levels;
-  windData.levels['blue'] = warnNumMap.get('vent');
-  // windData.jf = res.ventInfo.zongfengliang;
-  windData.jf = res.ventInfo.zongjinfeng;
-  windData.hf = res.ventInfo.zonghuifeng;
-  windData.xf = res.ventInfo.xufengliang;
-  dustData.levels = res.info.sysInfo.dustS.levels;
-  dustData.levels['blue'] = warnNumMap.get('dust');
-  centerData.fire = res.info.sysInfo.fireS.status;
-  centerData.tf = res.info.sysInfo.ventS.status;
-  centerData.ws = res.info.sysInfo.gasS.status;
-  centerData.sb = res.info.deviceWarnInfo.status;
-  centerData.fc = res.info.sysInfo.dustS.status;
-  Object.keys(res.info.sysInfo).forEach((v) => {
-    if (res.info.sysInfo[v].maxLevel) {
-      data.push(res.info.sysInfo[v].maxLevel);
-    } else {
-      data.push(0);
-    }
+  import { ref, onMounted, onUnmounted, reactive } from 'vue';
+  import { useRouter } from 'vue-router';
+  import customHeader from '/@/components/vent/customHeader.vue';
+  import { getTotalList, sysTypeWarnList } from './alarm.api';
+  import { iconsMonitor, chartsColumns, xAxisData, option, colors, fontColor, fireMonitor, fireMonitor1 } from './alarm.data';
+  import ventBox1 from '/@/components/vent/ventBox1.vue';
+  import BarSingle from '../../../../components/chart/BarSingle.vue';
+  import { rainBg } from '/@/utils/ui.js';
+
+  let router = useRouter();
+
+  const warnNumMap = new Map([
+    ['fire', 0],
+    ['dust', 0],
+    ['vent', 0],
+    ['gas', 0],
+  ]);
+
+  const resetScroll = (e: Event) => {
+    if (e.target && e.target) (e.target as Element).scrollTop = 0;
+  };
+  let windData = reactive({
+    levels: {},
+    jf: 0,
+    hf: 0,
+    xf: 0,
+  }); //通风监测数据
+  let dustData = reactive({
+    //粉尘监测数据
+    levels: {},
   });
-  data = data.sort((a, b) => b - a);
-  centerData.levels = data[0];
-  Object.keys(iconsMonitor).forEach((el) => {
-    if (res.info.devicekindInfo[el]) {
-      iconsMonitor[el].level = res.info.devicekindInfo[el].maxLevel;
-    }
+  let centerData = reactive({
+    fire: '',
+    tf: '',
+    ws: '',
+    sb: '',
+    fc: '',
+    levels: 0,
   });
-  fireMonitor[0].value =
-    res.info.sysInfo.fireS.summaryInfo.external.temperature && res.info.sysInfo.fireS.summaryInfo.external.temperature.maxlevel == '0'
-      ? '正常'
-      : '';
-  fireMonitor[1].value =
-    res.info.sysInfo.fireS.summaryInfo.external.smokeval &&
+  //瓦斯
+  let gasMonitor = reactive<any[]>([]);
+  let gasData = {
+    sums: 0,
+    sums1: 0,
+  };
+
+  //跳转详情
+  function showModal(data) {
+    switch (data) {
+      case 'vent':
+        router.push('/ventilate/warn/home');
+        break;
+      case 'fire':
+        router.push('/fire/warn/home');
+        break;
+      case 'dust':
+        router.push('/dust/warn/home');
+        break;
+      case 'gas':
+        router.push('/gas/warn/home');
+        break;
+      case 'sbyj':
+        router.push('/device/warn/home');
+        break;
+    }
+  }
+
+  // https获取监测数据
+  let timer: null | NodeJS.Timeout = null;
+  function getMonitor(flag = false) {
+    timer = setTimeout(
+      async () => {
+        // await getDataSource();
+        await getList();
+        if (timer) {
+          timer = null;
+        }
+        getMonitor();
+      },
+      flag ? 0 : 10000
+    );
+  }
+
+  // 获取预警数据
+  async function getList() {
+    const res = await getTotalList({});
+    console.log(res, '预警数据--------------');
+    let data = [];
+    windData.levels = res.info.sysInfo.ventS.levels;
+    windData.levels['blue'] = warnNumMap.get('vent');
+    // windData.jf = res.ventInfo.zongfengliang;
+    windData.jf = res.ventInfo.zongjinfeng;
+    windData.hf = res.ventInfo.zonghuifeng;
+    windData.xf = res.ventInfo.xufengliang;
+    dustData.levels = res.info.sysInfo.dustS.levels;
+    dustData.levels['blue'] = warnNumMap.get('dust');
+    centerData.fire = res.info.sysInfo.fireS.status;
+    centerData.tf = res.info.sysInfo.ventS.status;
+    centerData.ws = res.info.sysInfo.gasS.status;
+    centerData.sb = res.info.deviceWarnInfo.status;
+    centerData.fc = res.info.sysInfo.dustS.status;
+    Object.keys(res.info.sysInfo).forEach((v) => {
+      if (res.info.sysInfo[v].maxLevel) {
+        data.push(res.info.sysInfo[v].maxLevel);
+      } else {
+        data.push(0);
+      }
+    });
+    data = data.sort((a, b) => b - a);
+    centerData.levels = data[0];
+    Object.keys(iconsMonitor).forEach((el) => {
+      if (res.info.devicekindInfo[el]) {
+        iconsMonitor[el].level = res.info.devicekindInfo[el].maxLevel;
+      }
+    });
+    fireMonitor[0].value =
+      res.info.sysInfo.fireS.summaryInfo.external.temperature && res.info.sysInfo.fireS.summaryInfo.external.temperature.maxlevel == '0'
+        ? '正常'
+        : '';
+    fireMonitor[1].value =
+      res.info.sysInfo.fireS.summaryInfo.external.smokeval &&
       res.info.sysInfo.fireS.summaryInfo.external.smokeval.maxlevel &&
       res.info.sysInfo.fireS.summaryInfo.external.smokeval.maxlevel == '0'
-      ? '正常'
-      : '';
-  fireMonitor[2].value =
-    res.info.sysInfo.fireS.summaryInfo.external.fireval &&
+        ? '正常'
+        : '';
+    fireMonitor[2].value =
+      res.info.sysInfo.fireS.summaryInfo.external.fireval &&
       res.info.sysInfo.fireS.summaryInfo.external.fireval.maxlevel &&
       res.info.sysInfo.fireS.summaryInfo.external.fireval.maxlevel == '0'
-      ? '正常'
-      : '';
-  fireMonitor[3].value =
-    res.info.sysInfo.fireS.summaryInfo.external.coval && res.info.sysInfo.fireS.summaryInfo.external.coval.value
-      ? res.info.sysInfo.fireS.summaryInfo.external.coval.value
-      : '';
-  // fireMonitor[0].level = res.info.sysInfo.fireS.summaryInfo.external.temperature ? res.info.sysInfo.fireS.summaryInfo.external.temperature.maxlevel : '';
-  // fireMonitor[1].value = res.info.sysInfo.fireS.summaryInfo.external.coval ? res.info.sysInfo.fireS.summaryInfo.external.coval.value : '';
-  // fireMonitor[1].level = res.info.sysInfo.fireS.summaryInfo.external.coval ? res.info.sysInfo.fireS.summaryInfo.external.coval.maxlevel : '';
-  // fireMonitor[2].value = res.info.sysInfo.fireS.summaryInfo.external.chval ? res.info.sysInfo.fireS.summaryInfo.external.chval.value : '';
-  // fireMonitor[2].level = res.info.sysInfo.fireS.summaryInfo.external.chval ? res.info.sysInfo.fireS.summaryInfo.external.chval.maxlevel : '';
-  // fireMonitor[3].value = res.info.sysInfo.fireS.summaryInfo.external.ch2val ? res.info.sysInfo.fireS.summaryInfo.external.ch2val.value : '';
-  // fireMonitor[3].level = res.info.sysInfo.fireS.summaryInfo.external.ch2val ? res.info.sysInfo.fireS.summaryInfo.external.ch2val.maxlevel : '';
-  // fireMonitor[4].value = res.info.sysInfo.fireS.summaryInfo.external.co2val ? res.info.sysInfo.fireS.summaryInfo.external.co2val.value : '';
-  // fireMonitor[4].level = res.info.sysInfo.fireS.summaryInfo.external.co2val ? res.info.sysInfo.fireS.summaryInfo.external.co2val.maxlevel : '';
-  // fireMonitor[5].value = res.info.sysInfo.fireS.summaryInfo.external.o2val ? res.info.sysInfo.fireS.summaryInfo.external.o2val.value : '';
-  // fireMonitor[5].level = res.info.sysInfo.fireS.summaryInfo.external.o2val ? res.info.sysInfo.fireS.summaryInfo.external.o2val.maxlevel : '';
-
-  fireMonitor1[0].value = res.info.sysInfo.fireS.summaryInfo.internal.coval ? res.info.sysInfo.fireS.summaryInfo.internal.coval.value : '';
-  fireMonitor1[0].level = res.info.sysInfo.fireS.summaryInfo.internal.coval ? res.info.sysInfo.fireS.summaryInfo.internal.coval.maxlevel : '';
-  fireMonitor1[1].value = res.info.sysInfo.fireS.summaryInfo.internal.chval ? res.info.sysInfo.fireS.summaryInfo.internal.chval.value : '';
-  fireMonitor1[1].level = res.info.sysInfo.fireS.summaryInfo.internal.chval ? res.info.sysInfo.fireS.summaryInfo.internal.chval.maxlevel : '';
-  fireMonitor1[2].value = res.info.sysInfo.fireS.summaryInfo.internal.ch2val ? res.info.sysInfo.fireS.summaryInfo.internal.ch2val.value : '';
-  fireMonitor1[2].level = res.info.sysInfo.fireS.summaryInfo.internal.ch2val ? res.info.sysInfo.fireS.summaryInfo.internal.ch2val.maxlevel : '';
-  fireMonitor1[3].value = res.info.sysInfo.fireS.summaryInfo.internal.co2val ? res.info.sysInfo.fireS.summaryInfo.internal.co2val.value : '';
-  fireMonitor1[3].level = res.info.sysInfo.fireS.summaryInfo.internal.co2val ? res.info.sysInfo.fireS.summaryInfo.internal.co2val.maxlevel : '';
-  fireMonitor1[4].value = res.info.sysInfo.fireS.summaryInfo.internal.o2val ? res.info.sysInfo.fireS.summaryInfo.internal.o2val.value : '';
-  fireMonitor1[4].level = res.info.sysInfo.fireS.summaryInfo.internal.o2val ? res.info.sysInfo.fireS.summaryInfo.internal.o2val.maxlevel : '';
-  gasMonitor.length = 0;
-  gasData.sums = 0;
-  gasData.sums1 = 0;
-  res.info.sysInfo.gasS.devices.forEach((el) => {
-    gasData.sums += el.gasNumber;
-    gasData.sums1 += el.pumpNumber;
-    gasMonitor.push({ label: el.systemname, value: el.gasNumber, value1: el.pumpNumber });
+        ? '正常'
+        : '';
+    fireMonitor[3].value =
+      res.info.sysInfo.fireS.summaryInfo.external.coval && res.info.sysInfo.fireS.summaryInfo.external.coval.value
+        ? res.info.sysInfo.fireS.summaryInfo.external.coval.value
+        : '';
+
+    // fireMonitor[0].level = res.info.sysInfo.fireS.summaryInfo.external.temperature ? res.info.sysInfo.fireS.summaryInfo.external.temperature.maxlevel : '';
+    // fireMonitor[1].value = res.info.sysInfo.fireS.summaryInfo.external.coval ? res.info.sysInfo.fireS.summaryInfo.external.coval.value : '';
+    // fireMonitor[1].level = res.info.sysInfo.fireS.summaryInfo.external.coval ? res.info.sysInfo.fireS.summaryInfo.external.coval.maxlevel : '';
+    // fireMonitor[2].value = res.info.sysInfo.fireS.summaryInfo.external.chval ? res.info.sysInfo.fireS.summaryInfo.external.chval.value : '';
+    // fireMonitor[2].level = res.info.sysInfo.fireS.summaryInfo.external.chval ? res.info.sysInfo.fireS.summaryInfo.external.chval.maxlevel : '';
+    // fireMonitor[3].value = res.info.sysInfo.fireS.summaryInfo.external.ch2val ? res.info.sysInfo.fireS.summaryInfo.external.ch2val.value : '';
+    // fireMonitor[3].level = res.info.sysInfo.fireS.summaryInfo.external.ch2val ? res.info.sysInfo.fireS.summaryInfo.external.ch2val.maxlevel : '';
+    // fireMonitor[4].value = res.info.sysInfo.fireS.summaryInfo.external.co2val ? res.info.sysInfo.fireS.summaryInfo.external.co2val.value : '';
+    // fireMonitor[4].level = res.info.sysInfo.fireS.summaryInfo.external.co2val ? res.info.sysInfo.fireS.summaryInfo.external.co2val.maxlevel : '';
+    // fireMonitor[5].value = res.info.sysInfo.fireS.summaryInfo.external.o2val ? res.info.sysInfo.fireS.summaryInfo.external.o2val.value : '';
+    // fireMonitor[5].level = res.info.sysInfo.fireS.summaryInfo.external.o2val ? res.info.sysInfo.fireS.summaryInfo.external.o2val.maxlevel : '';
+
+    // fireMonitor1[0].value = res.info.sysInfo.fireS.summaryInfo.internal.coval ? res.info.sysInfo.fireS.summaryInfo.internal.coval.value : '';
+    fireMonitor1[0].value = res.info.sysInfo.fireS.summaryInfo.internal.coval ? '50.0' : '';
+    fireMonitor1[0].level = res.info.sysInfo.fireS.summaryInfo.internal.coval ? res.info.sysInfo.fireS.summaryInfo.internal.coval.maxlevel : '';
+    fireMonitor1[1].value = res.info.sysInfo.fireS.summaryInfo.internal.chval ? res.info.sysInfo.fireS.summaryInfo.internal.chval.value : '';
+    fireMonitor1[1].level = res.info.sysInfo.fireS.summaryInfo.internal.chval ? res.info.sysInfo.fireS.summaryInfo.internal.chval.maxlevel : '';
+    fireMonitor1[2].value = res.info.sysInfo.fireS.summaryInfo.internal.ch2val ? res.info.sysInfo.fireS.summaryInfo.internal.ch2val.value : '';
+    fireMonitor1[2].level = res.info.sysInfo.fireS.summaryInfo.internal.ch2val ? res.info.sysInfo.fireS.summaryInfo.internal.ch2val.maxlevel : '';
+    fireMonitor1[3].value = res.info.sysInfo.fireS.summaryInfo.internal.co2val ? res.info.sysInfo.fireS.summaryInfo.internal.co2val.value : '';
+    fireMonitor1[3].level = res.info.sysInfo.fireS.summaryInfo.internal.co2val ? res.info.sysInfo.fireS.summaryInfo.internal.co2val.maxlevel : '';
+    fireMonitor1[4].value = res.info.sysInfo.fireS.summaryInfo.internal.o2val ? res.info.sysInfo.fireS.summaryInfo.internal.o2val.value : '';
+    fireMonitor1[4].level = res.info.sysInfo.fireS.summaryInfo.internal.o2val ? res.info.sysInfo.fireS.summaryInfo.internal.o2val.maxlevel : '';
+    gasMonitor.length = 0;
+    gasData.sums = 0;
+    gasData.sums1 = 0;
+    res.info.sysInfo.gasS.devices.forEach((el) => {
+      gasData.sums += el.gasNumber;
+      gasData.sums1 += el.pumpNumber;
+      gasMonitor.push({ label: el.systemname, value: el.gasNumber, value1: el.pumpNumber });
+    });
+  }
+
+  function getLevelNum() {
+    return new Promise(async (resolve) => {
+      const typeArr = ['fire', 'dust', 'vent', 'gas'];
+      for (let i = 0; i < typeArr.length; i++) {
+        const type = typeArr[i];
+        const result = await sysTypeWarnList({ type });
+        warnNumMap.set(type, result['length']);
+      }
+      resolve(null);
+    });
+  }
+
+  onMounted(async () => {
+    await getLevelNum();
+    await getMonitor(true);
+    rainBg('rain', 'animation-box');
   });
-}
-
-function getLevelNum() {
-  return new Promise(async (resolve) => {
-    const typeArr = ['fire', 'dust', 'vent', 'gas'];
-    for (let i = 0; i < typeArr.length; i++) {
-      const type = typeArr[i];
-      const result = await sysTypeWarnList({ type });
-      warnNumMap.set(type, result['length']);
+
+  onUnmounted(() => {
+    if (timer) {
+      clearTimeout(timer);
+      timer = undefined;
     }
-    resolve(null);
   });
-}
-
-onMounted(async () => {
-  await getLevelNum();
-  await getMonitor(true);
-  rainBg('rain', 'animation-box');
-});
-
-onUnmounted(() => {
-  if (timer) {
-    clearTimeout(timer);
-    timer = undefined;
-  }
-});
 </script>
 <style lang="less" scoped>
-@import '/@/design/vent/color.less';
-@a: 370px; // 椭圆x轴半径(长半径)
-@b: 107px; // 椭圆y轴半径(短半径)
-@s: 40; // 坐标点的数目(数目越大，动画越精细)
+  @import '/@/design/vent/color.less';
+  @a: 370px; // 椭圆x轴半径(长半径)
+  @b: 107px; // 椭圆y轴半径(短半径)
+  @s: 40; // 坐标点的数目(数目越大，动画越精细)
 
-@bg: #e6e2df;
+  @bg: #e6e2df;
 
-.loop(@index) when (@index < @s + 1) {
-  .loop((@index + 1));
-  @keyframeSel: @index * 100% ./ @s;
+  .loop(@index) when (@index < @s + 1) {
+    .loop((@index + 1));
+    @keyframeSel: @index * 100% ./ @s;
 
-  @{keyframeSel} {
-    transform: translate(@a * (cos(360deg ./ @s * @index)), @b * (sin(360deg ./ @s * @index)));
+    @{keyframeSel} {
+      transform: translate(@a * (cos(360deg ./ @s * @index)), @b * (sin(360deg ./ @s * @index)));
+    }
   }
-}
-
-.sensor-container {
-  width: 100%;
-  height: calc(100% - 86px);
-  display: flex;
-  position: relative;
-  top: 78px;
 
-  .lr {
-    width: 650px;
-    height: 100%;
+  .sensor-container {
+    width: 100%;
+    height: calc(100% - 86px);
+    display: flex;
+    position: relative;
+    top: 78px;
 
-    // background-color: #ffffff10;
-  }
+    .lr {
+      width: 650px;
+      height: 100%;
 
-  .left-box {
-    .vent-param {
-      width: 100%;
-      margin-top: 10px;
+      // background-color: #ffffff10;
+    }
 
-      .light-group {
-        display: flex;
-        flex-direction: row;
-        justify-content: space-between;
-        position: relative;
+    .left-box {
+      .vent-param {
+        width: 100%;
+        margin-top: 10px;
 
-        .param-item {
-          width: 150px;
+        .light-group {
           display: flex;
-          flex-direction: column;
-          justify-content: center;
-          align-items: center;
-          position: reactive;
-
-          .icon {
-            display: block;
-            position: absolute;
-            top: -5px;
-          }
+          flex-direction: row;
+          justify-content: space-between;
+          position: relative;
 
-          .param {
+          .param-item {
+            width: 150px;
             display: flex;
             flex-direction: column;
             justify-content: center;
             align-items: center;
+            position: reactive;
 
-            .param-icon {
-              width: 121px;
-              height: 69px;
-              background: url('/@/assets/images/vent/vent-param-bg.png');
+            .icon {
+              display: block;
+              position: absolute;
+              top: -5px;
+            }
+
+            .param {
               display: flex;
               flex-direction: column;
               justify-content: center;
               align-items: center;
-              position: relative;
-              top: -20px;
-              margin-top: 10px;
 
-              .param-title {
+              .param-icon {
+                width: 121px;
+                height: 69px;
+                background: url('/@/assets/images/vent/vent-param-bg.png');
+                display: flex;
+                flex-direction: column;
+                justify-content: center;
+                align-items: center;
                 position: relative;
-                top: -4px;
-              }
+                top: -20px;
+                margin-top: 10px;
 
-              .param-unit {
-                position: relative;
-                top: -2px;
-                font-size: 12px;
-              }
-            }
+                .param-title {
+                  position: relative;
+                  top: -4px;
+                }
 
-            .param-val-box {
-              display: flex;
-              flex-direction: column;
-              justify-content: center;
-              align-items: center;
-              position: relative;
-              top: -20px;
+                .param-unit {
+                  position: relative;
+                  top: -2px;
+                  font-size: 12px;
+                }
+              }
 
-              .param-val-icon {
-                width: 2px;
-                height: 15px;
-                background: #00d8ff;
+              .param-val-box {
+                display: flex;
+                flex-direction: column;
+                justify-content: center;
+                align-items: center;
                 position: relative;
+                top: -20px;
 
-                &::after {
-                  content: '';
-                  display: block;
-                  position: absolute;
-                  width: 6px;
-                  height: 6px;
-                  border-radius: 3px;
+                .param-val-icon {
+                  width: 2px;
+                  height: 15px;
                   background: #00d8ff;
-                  bottom: -2px;
-                  left: -2px;
+                  position: relative;
+
+                  &::after {
+                    content: '';
+                    display: block;
+                    position: absolute;
+                    width: 6px;
+                    height: 6px;
+                    border-radius: 3px;
+                    background: #00d8ff;
+                    bottom: -2px;
+                    left: -2px;
+                  }
                 }
-              }
 
-              .param-val {
-                position: relative;
-                font-family: 'douyuFont';
-                // color: #20dbfd;
-                text-shadow: 0 0 25px #00d8ff;
-                font-size: 13px;
-                border: 1px solid #40b7f3;
-                padding: 5px 30px 2px 30px;
-                top: 2px;
-
-                &::after {
-                  width: calc(100% - 4px);
-                  height: calc(100% - 4px);
-                  content: '';
-                  position: absolute;
+                .param-val {
+                  position: relative;
+                  font-family: 'douyuFont';
+                  // color: #20dbfd;
+                  text-shadow: 0 0 25px #00d8ff;
+                  font-size: 13px;
+                  border: 1px solid #40b7f3;
+                  padding: 5px 30px 2px 30px;
                   top: 2px;
-                  left: 2px;
-                  display: block;
-                  border: 1px solid #006ea6;
+
+                  &::after {
+                    width: calc(100% - 4px);
+                    height: calc(100% - 4px);
+                    content: '';
+                    position: absolute;
+                    top: 2px;
+                    left: 2px;
+                    display: block;
+                    border: 1px solid #006ea6;
+                  }
                 }
               }
             }
           }
         }
       }
-    }
-
-    .icons-box {
-      display: flex;
-      flex-wrap: wrap;
-      // max-height: 365px;
-      height: 365px;
-      overflow-y: hidden;
-
-      // align-items: start ;
-      &:hover {
-        overflow-y: auto;
-        overflow-x: auto;
-
-        // &>.icon-item {
-        //   animation-play-state: paused;
-        //   animation: move1 2s linear;
-        // }
-      }
 
-      .icon-item {
-        position: relative;
+      .icons-box {
         display: flex;
-        align-items: center;
-        justify-content: center;
-        padding: 3px;
-        // animation: move 10s linear infinite;
+        flex-wrap: wrap;
+        // max-height: 365px;
+        height: 365px;
+        overflow-y: hidden;
 
-        &:nth-child(even) {
-          padding-right: 0px;
-        }
+        // align-items: start ;
+        &:hover {
+          overflow-y: auto;
+          overflow-x: auto;
 
-        .level-text {
-          position: absolute;
-          top: 51px;
-          right: 25px;
-          color: #fff;
-          font-family: 'douyuFont';
-          font-size: 12px;
+          // &>.icon-item {
+          //   animation-play-state: paused;
+          //   animation: move1 2s linear;
+          // }
         }
 
-        .level-text-0 {
-          color: rgb(145, 230, 9);
-          text-shadow: 2px 2px 4px #001c22;
-        }
+        .icon-item {
+          position: relative;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          padding: 3px;
+          // animation: move 10s linear infinite;
 
-        .level-text-1 {
-          color: rgb(0, 242, 255);
-          text-shadow: 2px 2px 4px #001c22;
-        }
+          &:nth-child(even) {
+            padding-right: 0px;
+          }
 
-        .level-text-2 {
-          color: #ffff35;
-          text-shadow: 2px 2px 4px #313100;
-        }
+          .level-text {
+            position: absolute;
+            top: 51px;
+            right: 25px;
+            color: #fff;
+            font-family: 'douyuFont';
+            font-size: 12px;
+          }
 
-        .level-text-3 {
-          color: #ffbe69;
-          text-shadow: 2px 2px 4px #271600;
-        }
+          .level-text-0 {
+            color: rgb(145, 230, 9);
+            text-shadow: 2px 2px 4px #001c22;
+          }
 
-        .level-text-4 {
-          color: #ff6f00;
-          // color: #09caff;
-          text-shadow: 2px 2px 4px #060200;
-        }
+          .level-text-1 {
+            color: rgb(0, 242, 255);
+            text-shadow: 2px 2px 4px #001c22;
+          }
 
-        .level-text-5 {
-          color: #ff0000;
-          text-shadow: 2px 2px 4px #200000;
-        }
+          .level-text-2 {
+            color: #ffff35;
+            text-shadow: 2px 2px 4px #313100;
+          }
 
-        .level-text-6 {
-          color: #bbb;
-          text-shadow: 2px 2px 4px #001c22;
-        }
+          .level-text-3 {
+            color: #ffbe69;
+            text-shadow: 2px 2px 4px #271600;
+          }
+
+          .level-text-4 {
+            color: #ff6f00;
+            // color: #09caff;
+            text-shadow: 2px 2px 4px #060200;
+          }
+
+          .level-text-5 {
+            color: #ff0000;
+            text-shadow: 2px 2px 4px #200000;
+          }
 
-        img {
-          width: 225px;
-          height: 79px;
+          .level-text-6 {
+            color: #bbb;
+            text-shadow: 2px 2px 4px #001c22;
+          }
+
+          img {
+            width: 225px;
+            height: 79px;
+          }
         }
-      }
 
-      .wrapper {
-        position: absolute;
-        top: 48px;
-        left: 82px;
-        color: #ffffffe0;
-        font-size: 13px;
-        text-align: center;
-        letter-spacing: 1px;
+        .wrapper {
+          position: absolute;
+          top: 48px;
+          left: 82px;
+          color: #ffffffe0;
+          font-size: 13px;
+          text-align: center;
+          letter-spacing: 1px;
+        }
       }
-    }
 
-    @keyframes move {
-      0% {
-        transform: translateY(0px);
-      }
+      @keyframes move {
+        0% {
+          transform: translateY(0px);
+        }
 
-      100% {
-        transform: translateY(-269px);
+        100% {
+          transform: translateY(-269px);
+        }
       }
-    }
 
-    @keyframes move1 {
-      0% {
-        transform: translateY(0px);
+      @keyframes move1 {
+        0% {
+          transform: translateY(0px);
+        }
       }
     }
-  }
-
-  .center-box {
-    width: calc(100% - 710px);
-    // background-color: #ffffff10;
-    margin: 0 8px;
-    display: flex;
-    flex-direction: column;
-    justify-content: flex-end;
 
-    .fire-monitor {
+    .center-box {
+      width: calc(100% - 710px);
+      // background-color: #ffffff10;
+      margin: 0 8px;
       display: flex;
       flex-direction: column;
-      width: 100%;
-      position: relative;
+      justify-content: flex-end;
 
-      .top {
+      .fire-monitor {
+        display: flex;
+        flex-direction: column;
         width: 100%;
-        height: 35px;
-        background: url('/@/assets/images/vent/box-top-bg.png');
-        background-size: 100% 100%;
-        text-align: center;
-        color: #fff;
-        padding-top: 6px;
-      }
-
-      .container {
-        width: calc(100% - 2px);
-        min-height: 50px;
-        padding: 0 10px;
-        color: #fff;
-        background-color: #00213236;
-        backdrop-filter: blur(5px);
-
-        &::before {
-          content: '';
-          display: block;
-          position: absolute;
-          top: 5px;
-          left: 0;
-          width: 1px;
-          height: calc(100% - 10px);
-          background-image: linear-gradient(#3df6ff00, #3df6ff, #3df6ff00);
-        }
+        position: relative;
 
-        &::after {
-          content: '';
-          display: block;
-          position: absolute;
-          right: 0;
-          top: 5px;
-          width: 1px;
-          height: calc(100% - 10px);
-          background: linear-gradient(#3df6ff00, #3df6ff, #3df6ff00);
+        .top {
+          width: 100%;
+          height: 35px;
+          background: url('/@/assets/images/vent/box-top-bg.png');
+          background-size: 100% 100%;
+          text-align: center;
+          color: #fff;
+          padding-top: 6px;
         }
 
-        .item {
-          height: 130px;
-          width: 100%;
-          position: relative;
-          top: -10px;
-          display: flex;
-          // justify-content: space-between;
-          align-content: center;
-          padding-top: 50px;
+        .container {
+          width: calc(100% - 2px);
+          min-height: 50px;
+          padding: 0 10px;
+          color: #fff;
+          background-color: #00213236;
+          backdrop-filter: blur(5px);
 
           &::before {
             content: '';
-            width: 100%;
-            height: 150px;
+            display: block;
             position: absolute;
-            top: 0px;
-            background: url('/@/assets/images/vent/fire-bg-top.png');
-            background-size: 100% 100%;
+            top: 5px;
+            left: 0;
+            width: 1px;
+            height: calc(100% - 10px);
+            background-image: linear-gradient(#3df6ff00, #3df6ff, #3df6ff00);
           }
 
-          .icon {
-            width: 82px;
-            height: 36px;
-            margin: 0 20px 0 50px;
-            background: url('/@/assets/images/vent/icon-bottom-bg.png');
-            position: relative;
-            top: 30px;
-
-            &::after {
-              position: absolute;
-              content: '';
-              width: 50px;
-              height: 50px;
-              top: -25px;
-              left: 20px;
-              background: url('/@/assets/images/vent/outer-icon.svg') no-repeat;
-            }
+          &::after {
+            content: '';
+            display: block;
+            position: absolute;
+            right: 0;
+            top: 5px;
+            width: 1px;
+            height: calc(100% - 10px);
+            background: linear-gradient(#3df6ff00, #3df6ff, #3df6ff00);
           }
 
-          .data-box {
+          .item {
+            height: 130px;
+            width: 100%;
+            position: relative;
+            top: -10px;
             display: flex;
-            flex-direction: column;
-            // margin: 0 10px;
-            width: 118px;
+            // justify-content: space-between;
+            align-content: center;
+            padding-top: 50px;
 
-            .value {
-              font-size: 16px;
-              font-family: 'douyuFont';
-              color: #2bdcff;
-              margin-bottom: 5px;
+            &::before {
+              content: '';
+              width: 100%;
+              height: 150px;
+              position: absolute;
+              top: 0px;
+              background: url('/@/assets/images/vent/fire-bg-top.png');
+              background-size: 100% 100%;
             }
 
-            .value1 {
-              font-size: 16px;
-              font-family: 'douyuFont';
-              margin-bottom: 5px;
-              color: rgb(145, 230, 9);
+            .icon {
+              width: 82px;
+              height: 36px;
+              margin: 0 20px 0 50px;
+              background: url('/@/assets/images/vent/icon-bottom-bg.png');
+              position: relative;
+              top: 30px;
+
+              &::after {
+                position: absolute;
+                content: '';
+                width: 50px;
+                height: 50px;
+                top: -25px;
+                left: 20px;
+                background: url('/@/assets/images/vent/outer-icon.svg') no-repeat;
+              }
             }
 
-            .value2 {
-              font-size: 16px;
-              font-family: 'douyuFont';
-              margin-bottom: 5px;
-              color: rgb(0, 242, 255);
-            }
+            .data-box {
+              display: flex;
+              flex-direction: column;
+              // margin: 0 10px;
+              width: 118px;
 
-            .value3 {
-              font-size: 16px;
-              font-family: 'douyuFont';
-              margin-bottom: 5px;
-              color: #ffff35;
-            }
+              .value {
+                font-size: 16px;
+                font-family: 'douyuFont';
+                color: #2bdcff;
+                margin-bottom: 5px;
+              }
 
-            .value4 {
-              font-size: 16px;
-              font-family: 'douyuFont';
-              margin-bottom: 5px;
-              color: #ffbe69;
-            }
+              .value1 {
+                font-size: 16px;
+                font-family: 'douyuFont';
+                margin-bottom: 5px;
+                color: rgb(145, 230, 9);
+              }
 
-            .value5 {
-              font-size: 16px;
-              font-family: 'douyuFont';
-              margin-bottom: 5px;
-              color: #ff6f00;
-            }
+              .value2 {
+                font-size: 16px;
+                font-family: 'douyuFont';
+                margin-bottom: 5px;
+                color: rgb(0, 242, 255);
+              }
 
-            .value6 {
-              font-size: 16px;
-              font-family: 'douyuFont';
-              margin-bottom: 5px;
-              color: #ff0000;
-            }
+              .value3 {
+                font-size: 16px;
+                font-family: 'douyuFont';
+                margin-bottom: 5px;
+                color: #ffff35;
+              }
 
-            .title {
-              font-size: 13px;
+              .value4 {
+                font-size: 16px;
+                font-family: 'douyuFont';
+                margin-bottom: 5px;
+                color: #ffbe69;
+              }
+
+              .value5 {
+                font-size: 16px;
+                font-family: 'douyuFont';
+                margin-bottom: 5px;
+                color: #ff6f00;
+              }
+
+              .value6 {
+                font-size: 16px;
+                font-family: 'douyuFont';
+                margin-bottom: 5px;
+                color: #ff0000;
+              }
+
+              .title {
+                font-size: 13px;
+              }
             }
           }
-        }
 
-        .item1 {
-          top: -10px;
+          .item1 {
+            top: -10px;
 
-          &::before {
-            transform: matrix(1, 0, 0, -1, 0, 0);
-          }
+            &::before {
+              transform: matrix(1, 0, 0, -1, 0, 0);
+            }
 
-          .icon {
-            &::after {
-              background: url('/@/assets/images/vent/inner-icon.svg') no-repeat;
+            .icon {
+              &::after {
+                background: url('/@/assets/images/vent/inner-icon.svg') no-repeat;
+              }
             }
           }
         }
-      }
 
-      .bottom {
-        width: 100%;
-        height: 35px;
-        background: url('/@/assets/images/vent/box-bottom-bg.png');
-        background-size: 100% 100%;
-        position: absolute;
-        bottom: 0;
+        .bottom {
+          width: 100%;
+          height: 35px;
+          background: url('/@/assets/images/vent/box-bottom-bg.png');
+          background-size: 100% 100%;
+          position: absolute;
+          bottom: 0;
+        }
       }
-    }
-
-    .animation-box {
-      height: fit-content;
-      flex: 1;
-      margin-bottom: 10px;
-      background: url('/@/assets/images/vent/alarm/center-bg.png');
-      background-size: contain;
-      background-position: center;
-      display: flex;
-      flex-direction: column;
-      align-items: center;
-      position: relative;
-      top: 45px;
 
-      .rain {
-        position: absolute;
-      }
+      .animation-box {
+        height: fit-content;
+        flex: 1;
+        margin-bottom: 10px;
+        background: url('/@/assets/images/vent/alarm/center-bg.png');
+        background-size: contain;
+        background-position: center;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        position: relative;
+        top: 45px;
 
-      .bottom {
-        width: 528px;
-        height: 395px;
-        background-repeat: no-repeat;
-        position: absolute;
-        z-index: 999;
-
-        &::before {
-          content: '';
-          width: 325px;
-          height: 379px;
+        .rain {
           position: absolute;
-          left: 105px;
-          top: -60px;
-          background: url('/@/assets/images/vent/alarm/warning-bg.png') no-repeat;
         }
 
-        .animation1 {
-          width: 390px;
-          height: 78px;
+        .bottom {
+          width: 528px;
+          height: 395px;
+          background-repeat: no-repeat;
           position: absolute;
-          top: -30px;
-          left: 80px;
           z-index: 999;
 
-          // animation: rotate3 3s linear infinite;
-          .ball {
+          &::before {
+            content: '';
+            width: 325px;
+            height: 379px;
             position: absolute;
-            width: 12px;
-            height: 12px;
-            background: radial-gradient(closest-side, #e1f7f8, #e1f7f800);
-            border-radius: 6px;
-            background-size: cover;
-            offset-path: path('M186.917-.75c12.711,0,25.415.263,37.757.783,12.03.506,23.863,1.262,35.171,2.245,11.1.966,21.816,2.161,31.835,3.553,9.928,1.379,19.265,2.963,27.751,4.709s16.2,3.668,22.92,5.713A120.653,120.653,0,0,1,359.7,22.825a40.842,40.842,0,0,1,11.018,7.3c2.568,2.581,3.87,5.239,3.87,7.9s-1.3,5.322-3.87,7.9a40.842,40.842,0,0,1-11.018,7.3,120.653,120.653,0,0,1-17.345,6.572c-6.716,2.044-14.428,3.966-22.92,5.713s-17.823,3.329-27.751,4.709c-10.02,1.392-20.731,2.588-31.835,3.553-11.308.984-23.142,1.739-35.171,2.245-12.343.519-25.046.783-37.757.783s-25.415-.263-37.757-.783c-12.03-.506-23.863-1.262-35.171-2.245-11.1-.966-21.816-2.161-31.835-3.553-9.928-1.379-19.265-2.963-27.751-4.709s-16.2-3.668-22.92-5.713a120.652,120.652,0,0,1-17.345-6.572,40.841,40.841,0,0,1-11.018-7.3c-2.568-2.581-3.87-5.239-3.87-7.9s1.3-5.322,3.87-7.9a40.842,40.842,0,0,1,11.018-7.3,120.651,120.651,0,0,1,17.345-6.572C38.2,14.208,45.91,12.286,54.4,10.54S72.225,7.211,82.153,5.831c10.02-1.392,20.731-2.588,31.835-3.553C125.3,1.294,137.13.539,149.16.033,161.5-.487,174.206-.75,186.917-.75Zm0,76.98c49.941,0,96.885-4,132.186-11.257,17.134-3.523,30.578-7.623,39.96-12.184,9.642-4.688,14.53-9.653,14.53-14.759s-4.889-10.072-14.53-14.759c-9.382-4.561-22.826-8.66-39.96-12.184C283.8,3.827,236.858-.171,186.917-.171s-96.885,4-132.186,11.257C37.6,14.61,24.153,18.709,14.771,23.27,5.129,27.958.241,32.923.241,38.029S5.129,48.1,14.771,52.789c9.382,4.561,22.826,8.661,39.96,12.184C90.032,72.232,136.976,76.23,186.917,76.23Z'
-              );
-            animation: 10s linear 0s infinite alternate ball;
+            left: 105px;
+            top: -60px;
+            background: url('/@/assets/images/vent/alarm/warning-bg.png') no-repeat;
           }
-        }
 
-        .animation2 {
-          width: 430px;
-          height: 92px;
-          position: absolute;
-          top: 0px;
-          left: 60px;
-          z-index: 999;
-
-          // animation: rotate4 3s linear infinite;
-          .ball1 {
+          .animation1 {
+            width: 390px;
+            height: 78px;
             position: absolute;
-            width: 12px;
-            height: 12px;
-            background: radial-gradient(closest-side, #e1f7f8, #e1f7f800);
-            border-radius: 6px;
-            background-size: cover;
-            offset-path: path('M206.689-.75c14.05,0,28.092.311,41.735.925,13.3.6,26.377,1.492,38.877,2.655,12.275,1.142,24.114,2.555,35.189,4.2,10.974,1.631,21.294,3.5,30.674,5.567s17.91,4.337,25.335,6.754a128.134,128.134,0,0,1,19.172,7.771,45.082,45.082,0,0,1,12.178,8.633c2.838,3.051,4.278,6.195,4.278,9.344s-1.439,6.293-4.278,9.344a45.082,45.082,0,0,1-12.178,8.633A128.134,128.134,0,0,1,378.5,70.847c-7.424,2.417-15.948,4.69-25.335,6.754s-19.7,3.936-30.674,5.567c-11.075,1.646-22.915,3.059-35.189,4.2-12.5,1.163-25.58,2.056-38.877,2.655-13.643.614-27.685.925-41.735.925s-28.092-.311-41.735-.925c-13.3-.6-26.377-1.492-38.877-2.655-12.275-1.142-24.114-2.555-35.189-4.2-10.974-1.631-21.294-3.5-30.674-5.567S42.3,73.265,34.879,70.847a128.133,128.133,0,0,1-19.173-7.771A45.082,45.082,0,0,1,3.528,54.444C.689,51.393-.75,48.249-.75,45.1s1.439-6.293,4.278-9.344a45.083,45.083,0,0,1,12.178-8.633,128.133,128.133,0,0,1,19.173-7.771c7.424-2.417,15.948-4.69,25.335-6.754s19.7-3.936,30.674-5.567c11.075-1.646,22.915-3.059,35.189-4.2,12.5-1.163,25.58-2.056,38.877-2.655C178.6-.439,192.639-.75,206.689-.75Zm0,91.015c55.2,0,107.093-4.727,146.113-13.31,18.939-4.166,33.8-9.012,44.17-14.405,10.657-5.542,16.061-11.413,16.061-17.45s-5.4-11.908-16.061-17.45c-10.37-5.393-25.231-10.24-44.17-14.405C313.782,4.662,261.892-.065,206.689-.065S99.6,4.662,60.576,13.244c-18.939,4.166-33.8,9.012-44.17,14.405C5.749,33.192.345,39.063.345,45.1s5.4,11.908,16.061,17.45c10.37,5.393,25.231,10.24,44.17,14.405C99.6,85.538,151.487,90.265,206.689,90.265Z'
+            top: -30px;
+            left: 80px;
+            z-index: 999;
+
+            // animation: rotate3 3s linear infinite;
+            .ball {
+              position: absolute;
+              width: 12px;
+              height: 12px;
+              background: radial-gradient(closest-side, #e1f7f8, #e1f7f800);
+              border-radius: 6px;
+              background-size: cover;
+              offset-path: path(
+                'M186.917-.75c12.711,0,25.415.263,37.757.783,12.03.506,23.863,1.262,35.171,2.245,11.1.966,21.816,2.161,31.835,3.553,9.928,1.379,19.265,2.963,27.751,4.709s16.2,3.668,22.92,5.713A120.653,120.653,0,0,1,359.7,22.825a40.842,40.842,0,0,1,11.018,7.3c2.568,2.581,3.87,5.239,3.87,7.9s-1.3,5.322-3.87,7.9a40.842,40.842,0,0,1-11.018,7.3,120.653,120.653,0,0,1-17.345,6.572c-6.716,2.044-14.428,3.966-22.92,5.713s-17.823,3.329-27.751,4.709c-10.02,1.392-20.731,2.588-31.835,3.553-11.308.984-23.142,1.739-35.171,2.245-12.343.519-25.046.783-37.757.783s-25.415-.263-37.757-.783c-12.03-.506-23.863-1.262-35.171-2.245-11.1-.966-21.816-2.161-31.835-3.553-9.928-1.379-19.265-2.963-27.751-4.709s-16.2-3.668-22.92-5.713a120.652,120.652,0,0,1-17.345-6.572,40.841,40.841,0,0,1-11.018-7.3c-2.568-2.581-3.87-5.239-3.87-7.9s1.3-5.322,3.87-7.9a40.842,40.842,0,0,1,11.018-7.3,120.651,120.651,0,0,1,17.345-6.572C38.2,14.208,45.91,12.286,54.4,10.54S72.225,7.211,82.153,5.831c10.02-1.392,20.731-2.588,31.835-3.553C125.3,1.294,137.13.539,149.16.033,161.5-.487,174.206-.75,186.917-.75Zm0,76.98c49.941,0,96.885-4,132.186-11.257,17.134-3.523,30.578-7.623,39.96-12.184,9.642-4.688,14.53-9.653,14.53-14.759s-4.889-10.072-14.53-14.759c-9.382-4.561-22.826-8.66-39.96-12.184C283.8,3.827,236.858-.171,186.917-.171s-96.885,4-132.186,11.257C37.6,14.61,24.153,18.709,14.771,23.27,5.129,27.958.241,32.923.241,38.029S5.129,48.1,14.771,52.789c9.382,4.561,22.826,8.661,39.96,12.184C90.032,72.232,136.976,76.23,186.917,76.23Z'
               );
-            animation: 10s linear 0s infinite alternate ball1;
+              animation: 10s linear 0s infinite alternate ball;
+            }
           }
-        }
-
-        .text-box {
-          width: 100%;
-          display: flex;
-          flex-direction: column;
-          color: #fff;
-          align-items: center;
-          margin-top: 90px;
 
-          .text1 {
-            font-size: 26px;
-            font-weight: 600;
-            letter-spacing: 2px;
-            margin-bottom: 10px;
-          }
+          .animation2 {
+            width: 430px;
+            height: 92px;
+            position: absolute;
+            top: 0px;
+            left: 60px;
+            z-index: 999;
 
-          .text2 {
-            font-size: 18px;
-            color: #ffffffdd;
+            // animation: rotate4 3s linear infinite;
+            .ball1 {
+              position: absolute;
+              width: 12px;
+              height: 12px;
+              background: radial-gradient(closest-side, #e1f7f8, #e1f7f800);
+              border-radius: 6px;
+              background-size: cover;
+              offset-path: path(
+                'M206.689-.75c14.05,0,28.092.311,41.735.925,13.3.6,26.377,1.492,38.877,2.655,12.275,1.142,24.114,2.555,35.189,4.2,10.974,1.631,21.294,3.5,30.674,5.567s17.91,4.337,25.335,6.754a128.134,128.134,0,0,1,19.172,7.771,45.082,45.082,0,0,1,12.178,8.633c2.838,3.051,4.278,6.195,4.278,9.344s-1.439,6.293-4.278,9.344a45.082,45.082,0,0,1-12.178,8.633A128.134,128.134,0,0,1,378.5,70.847c-7.424,2.417-15.948,4.69-25.335,6.754s-19.7,3.936-30.674,5.567c-11.075,1.646-22.915,3.059-35.189,4.2-12.5,1.163-25.58,2.056-38.877,2.655-13.643.614-27.685.925-41.735.925s-28.092-.311-41.735-.925c-13.3-.6-26.377-1.492-38.877-2.655-12.275-1.142-24.114-2.555-35.189-4.2-10.974-1.631-21.294-3.5-30.674-5.567S42.3,73.265,34.879,70.847a128.133,128.133,0,0,1-19.173-7.771A45.082,45.082,0,0,1,3.528,54.444C.689,51.393-.75,48.249-.75,45.1s1.439-6.293,4.278-9.344a45.083,45.083,0,0,1,12.178-8.633,128.133,128.133,0,0,1,19.173-7.771c7.424-2.417,15.948-4.69,25.335-6.754s19.7-3.936,30.674-5.567c11.075-1.646,22.915-3.059,35.189-4.2,12.5-1.163,25.58-2.056,38.877-2.655C178.6-.439,192.639-.75,206.689-.75Zm0,91.015c55.2,0,107.093-4.727,146.113-13.31,18.939-4.166,33.8-9.012,44.17-14.405,10.657-5.542,16.061-11.413,16.061-17.45s-5.4-11.908-16.061-17.45c-10.37-5.393-25.231-10.24-44.17-14.405C313.782,4.662,261.892-.065,206.689-.065S99.6,4.662,60.576,13.244c-18.939,4.166-33.8,9.012-44.17,14.405C5.749,33.192.345,39.063.345,45.1s5.4,11.908,16.061,17.45c10.37,5.393,25.231,10.24,44.17,14.405C99.6,85.538,151.487,90.265,206.689,90.265Z'
+              );
+              animation: 10s linear 0s infinite alternate ball1;
+            }
           }
-        }
 
-        .icon-animation {
-          width: 178px;
-          height: 208px;
-          margin: 0 auto;
-          top: -130px;
-          left: 4px;
-          position: relative;
-          animation: 0.5s linear 0s infinite alternate iconMove;
-        }
-      }
+          .text-box {
+            width: 100%;
+            display: flex;
+            flex-direction: column;
+            color: #fff;
+            align-items: center;
+            margin-top: 90px;
 
-      .bottom1 {
-        background-image: url('/@/assets/images/vent/alarm/warning-icon-bg1.png');
+            .text1 {
+              font-size: 26px;
+              font-weight: 600;
+              letter-spacing: 2px;
+              margin-bottom: 10px;
+            }
 
-        .icon-animation {
-          background: url('/@/assets/images/vent/alarm/warning-icon-bg-a1.png');
-        }
+            .text2 {
+              font-size: 18px;
+              color: #ffffffdd;
+            }
+          }
 
-        .text-box {
-          .text1 {
-            color: #00d8ff;
+          .icon-animation {
+            width: 178px;
+            height: 208px;
+            margin: 0 auto;
+            top: -130px;
+            left: 4px;
+            position: relative;
+            animation: 0.5s linear 0s infinite alternate iconMove;
           }
         }
-      }
 
-      .bottom2 {
-        background-image: url('/@/assets/images/vent/alarm/warning-icon-bg2.png');
+        .bottom1 {
+          background-image: url('/@/assets/images/vent/alarm/warning-icon-bg1.png');
 
-        .icon-animation {
-          background: url('/@/assets/images/vent/alarm/warning-icon-bg-a2.png');
-        }
+          .icon-animation {
+            background: url('/@/assets/images/vent/alarm/warning-icon-bg-a1.png');
+          }
 
-        .text-box {
-          .text1 {
-            color: #fcfc22;
+          .text-box {
+            .text1 {
+              color: #00d8ff;
+            }
           }
         }
-      }
 
-      .bottom3 {
-        background-image: url('/@/assets/images/vent/alarm/warning-icon-bg3.png');
+        .bottom2 {
+          background-image: url('/@/assets/images/vent/alarm/warning-icon-bg2.png');
 
-        .icon-animation {
-          background: url('/@/assets/images/vent/alarm/warning-icon-bg-a3.png');
-        }
+          .icon-animation {
+            background: url('/@/assets/images/vent/alarm/warning-icon-bg-a2.png');
+          }
 
-        .text-box {
-          .text1 {
-            color: #ff7010;
+          .text-box {
+            .text1 {
+              color: #fcfc22;
+            }
           }
         }
-      }
 
-      .bottom4 {
-        background-image: url('/@/assets/images/vent/alarm/warning-icon-bg4.png');
+        .bottom3 {
+          background-image: url('/@/assets/images/vent/alarm/warning-icon-bg3.png');
 
-        .icon-animation {
-          background: url('/@/assets/images/vent/alarm/warning-icon-bg-a4.png');
-        }
+          .icon-animation {
+            background: url('/@/assets/images/vent/alarm/warning-icon-bg-a3.png');
+          }
 
-        .text-box {
-          .text1 {
-            color: #df4e43;
+          .text-box {
+            .text1 {
+              color: #ff7010;
+            }
           }
         }
-      }
 
-      .bottom5 {
-        background-image: url('/@/assets/images/vent/alarm/warning-icon-bg5.png');
+        .bottom4 {
+          background-image: url('/@/assets/images/vent/alarm/warning-icon-bg4.png');
 
-        .icon-animation {
-          background: url('/@/assets/images/vent/alarm/warning-icon-bg-a5.png');
-        }
-
-        .text-box {
-          .text1 {
-            color: #ff2313;
-            // animation: color-blink 1s infinite;
+          .icon-animation {
+            background: url('/@/assets/images/vent/alarm/warning-icon-bg-a4.png');
           }
 
-          // @keyframes color-blink {
-          //   0% { color: red; }
-          //   50% { color: blue; }
-          //   100% { color: red; }
-          // }
+          .text-box {
+            .text1 {
+              color: #df4e43;
+            }
+          }
         }
-      }
 
-      .total-item-monitor-box {
-        width: 100%;
-        height: 237px;
-        position: relative;
-        top: 180px;
-        left: 265px;
-        background: url('/@/assets/images/vent/alarm/bottom1.png') no-repeat;
-        background-size: contain;
+        .bottom5 {
+          background-image: url('/@/assets/images/vent/alarm/warning-icon-bg5.png');
 
-        &::after {
-          content: '';
-          width: 750px;
-          height: 750px;
-          position: absolute;
-          transform-style: preserve-3d;
-          transform: translateX(0%) translateY(0%) rotateX(72deg);
-          background: url('/@/assets/images/vent/alarm/bottom.png');
-          animation: rotate1 3s linear infinite;
-          top: -200px;
-          left: -180px;
-        }
+          .icon-animation {
+            background: url('/@/assets/images/vent/alarm/warning-icon-bg-a5.png');
+          }
 
-        .item {
-          position: absolute;
+          .text-box {
+            .text1 {
+              color: #ff2313;
+              // animation: color-blink 1s infinite;
+            }
 
-          // width: 107px;
-          // height: 107px;
-          // left: 120px;
-          // top: 115px;
-          // animation: red-ball 10s linear infinite;
-          .icon-box {
-            width: 100px;
-            height: 100px;
+            // @keyframes color-blink {
+            //   0% { color: red; }
+            //   50% { color: blue; }
+            //   100% { color: red; }
+            // }
+          }
+        }
 
-            position: relative;
-            z-index: 0;
+        .total-item-monitor-box {
+          width: 100%;
+          height: 237px;
+          position: relative;
+          top: 180px;
+          left: 265px;
+          background: url('/@/assets/images/vent/alarm/bottom1.png') no-repeat;
+          background-size: contain;
 
-            &::before {
-              position: absolute;
-              content: '';
-              width: 105px;
-              height: 68px;
-              top: 15px;
-              z-index: -1;
-              background: url('/@/assets/images/vent/alarm/icon-bg.png') no-repeat;
-            }
+          &::after {
+            content: '';
+            width: 750px;
+            height: 750px;
+            position: absolute;
+            transform-style: preserve-3d;
+            transform: translateX(0%) translateY(0%) rotateX(72deg);
+            background: url('/@/assets/images/vent/alarm/bottom.png');
+            animation: rotate1 3s linear infinite;
+            top: -200px;
+            left: -180px;
+          }
 
-            &::after {
-              position: absolute;
-              content: '';
-              width: 71px;
-              height: 71px;
-              top: 26px;
-              left: 14px;
-              z-index: 1;
-              background: url(/src/assets/images/vent/alarm/icon-animation.png) no-repeat;
-              transform: translateX(0%) rotateX(70deg);
-              animation: rotate2 2s linear infinite;
-            }
+          .item {
+            position: absolute;
 
-            .icon {
+            // width: 107px;
+            // height: 107px;
+            // left: 120px;
+            // top: 115px;
+            // animation: red-ball 10s linear infinite;
+            .icon-box {
               width: 100px;
               height: 100px;
-              background-repeat: no-repeat;
-              background-position: top center;
-              position: relative;
-              top: 5px;
-            }
-          }
 
-          .item-monitor-box {
-            color: #fff;
-            position: relative;
-            top: -135px;
-            left: -20px;
-            font-weight: 600;
-            // background: #06020066;
-            padding: 5px 20px 8px 20px;
+              position: relative;
+              z-index: 0;
+
+              &::before {
+                position: absolute;
+                content: '';
+                width: 105px;
+                height: 68px;
+                top: 15px;
+                z-index: -1;
+                background: url('/@/assets/images/vent/alarm/icon-bg.png') no-repeat;
+              }
 
-            &::before {
-              position: absolute;
-              content: '';
-              width: 196px;
-              height: 48px;
-              left: -20px;
-              top: -10px;
-              background: url('/@/assets/images/vent/alarm/data-bg.png');
-            }
+              &::after {
+                position: absolute;
+                content: '';
+                width: 71px;
+                height: 71px;
+                top: 26px;
+                left: 14px;
+                z-index: 1;
+                background: url(/src/assets/images/vent/alarm/icon-animation.png) no-repeat;
+                transform: translateX(0%) rotateX(70deg);
+                animation: rotate2 2s linear infinite;
+              }
 
-            .value {
-              color: #2bdcff;
-              margin-left: 20px;
+              .icon {
+                width: 100px;
+                height: 100px;
+                background-repeat: no-repeat;
+                background-position: top center;
+                position: relative;
+                top: 5px;
+              }
             }
 
-            .value1 {
-              font-size: 16px;
-              font-weight: 800;
-              margin-top: 6px;
-              margin-left: 10px;
-              color: #ff0000;
-              animation: color-blink 1s infinite;
-            }
+            .item-monitor-box {
+              color: #fff;
+              position: relative;
+              top: -135px;
+              left: -20px;
+              font-weight: 600;
+              // background: #06020066;
+              padding: 5px 20px 8px 20px;
+
+              &::before {
+                position: absolute;
+                content: '';
+                width: 196px;
+                height: 48px;
+                left: -20px;
+                top: -10px;
+                background: url('/@/assets/images/vent/alarm/data-bg.png');
+              }
 
-            @keyframes color-blink {
-              0% {
-                color: red;
+              .value {
+                color: #2bdcff;
+                margin-left: 20px;
               }
 
-              50% {
-                color: rgb(198, 0, 0);
+              .value1 {
+                font-size: 16px;
+                font-weight: 800;
+                margin-top: 6px;
+                margin-left: 10px;
+                color: #ff0000;
+                animation: color-blink 1s infinite;
               }
 
-              100% {
-                color: rgb(255, 18, 18);
+              @keyframes color-blink {
+                0% {
+                  color: red;
+                }
+
+                50% {
+                  color: rgb(198, 0, 0);
+                }
+
+                100% {
+                  color: rgb(255, 18, 18);
+                }
               }
             }
           }
-        }
 
-        .item1 {
-          top: 230px;
-          left: 150px;
+          .item1 {
+            top: 230px;
+            left: 150px;
 
-          .icon {
-            background-image: url('/@/assets/images/vent/alarm/icon-fire.svg');
+            .icon {
+              background-image: url('/@/assets/images/vent/alarm/icon-fire.svg');
+            }
           }
-        }
 
-        .item2 {
-          top: 185px;
-          left: -120px;
+          .item2 {
+            top: 185px;
+            left: -120px;
 
-          .icon {
-            background-image: url('/@/assets/images/vent/alarm/icon-device.svg');
+            .icon {
+              background-image: url('/@/assets/images/vent/alarm/icon-device.svg');
+            }
           }
-        }
 
-        .item3 {
-          top: 185px;
-          left: 420px;
+          .item3 {
+            top: 185px;
+            left: 420px;
 
-          .icon {
-            background-image: url('/@/assets/images/vent/alarm/icon-dust.svg');
+            .icon {
+              background-image: url('/@/assets/images/vent/alarm/icon-dust.svg');
+            }
           }
-        }
 
-        .item4 {
-          top: 20px;
-          left: 390px;
+          .item4 {
+            top: 20px;
+            left: 390px;
 
-          .icon {
-            background-image: url('/@/assets/images/vent/alarm/icon-gas.svg');
-          }
+            .icon {
+              background-image: url('/@/assets/images/vent/alarm/icon-gas.svg');
+            }
 
-          .item-monitor-box {
-            top: -155px;
+            .item-monitor-box {
+              top: -155px;
 
-            &::before {
-              top: 10px;
+              &::before {
+                top: 10px;
+              }
             }
           }
-        }
 
-        .item5 {
-          top: 25px;
-          left: -110px;
+          .item5 {
+            top: 25px;
+            left: -110px;
 
-          .icon {
-            background-image: url('/@/assets/images/vent/alarm/icon-vent.svg');
+            .icon {
+              background-image: url('/@/assets/images/vent/alarm/icon-vent.svg');
+            }
           }
         }
-      }
 
-      @keyframes iconMove {
-        100% {
-          opacity: 0;
+        @keyframes iconMove {
+          100% {
+            opacity: 0;
+          }
         }
-      }
 
-      @keyframes rotate1 {
-        0% {
-          transform: translateX(0%) rotateX(72deg) rotateZ(-360deg);
-        }
+        @keyframes rotate1 {
+          0% {
+            transform: translateX(0%) rotateX(72deg) rotateZ(-360deg);
+          }
 
-        100% {
-          transform: translateX(0%) rotateX(72deg) rotateZ(0);
+          100% {
+            transform: translateX(0%) rotateX(72deg) rotateZ(0);
+          }
         }
-      }
 
-      @keyframes rotate2 {
-        0% {
-          transform: translateX(0%) rotateX(70deg) rotateZ(0);
-        }
+        @keyframes rotate2 {
+          0% {
+            transform: translateX(0%) rotateX(70deg) rotateZ(0);
+          }
 
-        100% {
-          transform: translateX(0%) rotateX(70deg) rotateZ(-360deg);
+          100% {
+            transform: translateX(0%) rotateX(70deg) rotateZ(-360deg);
+          }
         }
-      }
 
-      @keyframes rotate3 {
-        0% {
-          transform: translateX(0%) rotateX(80deg) rotateZ(0);
-        }
+        @keyframes rotate3 {
+          0% {
+            transform: translateX(0%) rotateX(80deg) rotateZ(0);
+          }
 
-        100% {
-          transform: translateX(0%) rotateX(80deg) rotateZ(-360deg);
+          100% {
+            transform: translateX(0%) rotateX(80deg) rotateZ(-360deg);
+          }
         }
-      }
 
-      @keyframes rotate4 {
-        100% {
-          transform: translateX(0%) rotateX(80deg) rotateZ(0);
-        }
+        @keyframes rotate4 {
+          100% {
+            transform: translateX(0%) rotateX(80deg) rotateZ(0);
+          }
 
-        0% {
-          transform: translateX(0%) rotateX(80deg) rotateZ(-360deg);
+          0% {
+            transform: translateX(0%) rotateX(80deg) rotateZ(-360deg);
+          }
         }
-      }
 
-      @keyframes ball {
-        100% {
-          offset-distance: 100%;
-        }
+        @keyframes ball {
+          100% {
+            offset-distance: 100%;
+          }
 
-        0% {
-          offset-distance: 0%;
+          0% {
+            offset-distance: 0%;
+          }
         }
-      }
 
-      @keyframes ball1 {
-        0% {
-          offset-distance: 100%;
-        }
+        @keyframes ball1 {
+          0% {
+            offset-distance: 100%;
+          }
 
-        100% {
-          offset-distance: 0%;
+          100% {
+            offset-distance: 0%;
+          }
         }
       }
     }
-  }
 
-  .right-box {
-    .dust-monitor {
-      display: flex;
-      justify-content: space-between;
-      padding: 0 20px;
-      margin-bottom: 20px;
-      margin-top: 15px;
-
-      .value {
-        width: 131px;
-        height: 44px;
-        background: url('/@/assets/images/vent/value-bg.png');
+    .right-box {
+      .dust-monitor {
         display: flex;
-        justify-content: center;
-        align-items: center;
-      }
+        justify-content: space-between;
+        padding: 0 20px;
+        margin-bottom: 20px;
+        margin-top: 15px;
+
+        .value {
+          width: 131px;
+          height: 44px;
+          background: url('/@/assets/images/vent/value-bg.png');
+          display: flex;
+          justify-content: center;
+          align-items: center;
+        }
 
-      .title {
-        text-align: center;
-        margin-bottom: 5px;
-      }
+        .title {
+          text-align: center;
+          margin-bottom: 5px;
+        }
 
-      .value {
-        font-size: 16px;
-        font-family: 'douyuFont';
-        color: #3df5ff;
+        .value {
+          font-size: 16px;
+          font-family: 'douyuFont';
+          color: #3df5ff;
+        }
       }
-    }
 
-    .gas-box {
-      height: 390px;
-      display: flex;
-      justify-content: space-between;
-      padding: 0 10px;
+      .gas-box {
+        height: 390px;
+        display: flex;
+        justify-content: space-between;
+        padding: 0 10px;
 
-      .gas-item {
-        position: relative;
+        .gas-item {
+          position: relative;
 
-        .top {
-          height: 136px;
-          padding-top: 30px;
+          .top {
+            height: 136px;
+            padding-top: 30px;
 
-          .value {
-            font-size: 26px;
-            font-family: 'douyuFont';
-            color: #3df5ff;
-            text-align: center;
-            margin-bottom: 5px;
-          }
+            .value {
+              font-size: 26px;
+              font-family: 'douyuFont';
+              color: #3df5ff;
+              text-align: center;
+              margin-bottom: 5px;
+            }
 
-          .title {
-            width: 205px;
-            height: 48px;
-            text-align: center;
-            background: url('/@/assets/images/vent/plane.png') no-repeat;
-            background-size: contain;
-            background-position: bottom;
-          }
+            .title {
+              width: 205px;
+              height: 48px;
+              text-align: center;
+              background: url('/@/assets/images/vent/plane.png') no-repeat;
+              background-size: contain;
+              background-position: bottom;
+            }
 
-          &::before {
-            position: absolute;
-            content: '';
-            width: 136px;
-            height: 101px;
-            left: 35px;
-            top: 15px;
-            background: url('/@/assets/images/vent/small-bg1.png') no-repeat;
-            background-size: cover;
+            &::before {
+              position: absolute;
+              content: '';
+              width: 136px;
+              height: 101px;
+              left: 35px;
+              top: 15px;
+              background: url('/@/assets/images/vent/small-bg1.png') no-repeat;
+              background-size: cover;
+            }
           }
-        }
 
-        .detail-box {
-          position: relative;
-          margin: 0 auto;
-          width: 184px;
-          height: calc(100% - 136px);
-          background: linear-gradient(to bottom, transparent, #00679b77) no-repeat;
-          background-size: cover;
-          display: flex;
-          flex-direction: column;
-          justify-content: flex-start;
-          align-items: center;
-          overflow-y: auto;
-          // padding: 50px 0 20px 0;
-
-          &::after {
-            position: absolute;
-            content: '';
-            left: 0px;
-            bottom: 0px;
+          .detail-box {
+            position: relative;
+            margin: 0 auto;
             width: 184px;
-            height: 31px;
-            background: url('/@/assets/images/vent/plane1.png') no-repeat center;
-            background-size: 100% 100%;
-            background-position: bottom;
-          }
-
-          .detail-item {
-            width: 100%;
-            height: 40px;
-            background-image: linear-gradient(to right, #39a3ff66, #39a3ff00);
-            // margin: 5px 0;
+            height: calc(100% - 136px);
+            background: linear-gradient(to bottom, transparent, #00679b77) no-repeat;
+            background-size: cover;
             display: flex;
-            padding: 0 10px;
-            justify-content: space-between;
+            flex-direction: column;
+            justify-content: flex-start;
             align-items: center;
-            margin-bottom: 30px;
+            overflow-y: auto;
+            // padding: 50px 0 20px 0;
 
-            .value {
-              font-size: 16px;
-              font-family: 'douyuFont';
-              color: #2bdcff;
-              text-align: center;
+            &::after {
+              position: absolute;
+              content: '';
+              left: 0px;
+              bottom: 0px;
+              width: 184px;
+              height: 31px;
+              background: url('/@/assets/images/vent/plane1.png') no-repeat center;
+              background-size: 100% 100%;
+              background-position: bottom;
+            }
+
+            .detail-item {
+              width: 100%;
+              height: 40px;
+              background-image: linear-gradient(to right, #39a3ff66, #39a3ff00);
+              // margin: 5px 0;
+              display: flex;
+              padding: 0 10px;
+              justify-content: space-between;
+              align-items: center;
+              margin-bottom: 30px;
+
+              .value {
+                font-size: 16px;
+                font-family: 'douyuFont';
+                color: #2bdcff;
+                text-align: center;
+              }
             }
           }
         }
       }
     }
-  }
 
-  .monitor-title {
-    cursor: pointer;
+    .monitor-title {
+      cursor: pointer;
+    }
   }
-}
 </style>

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

@@ -274,7 +274,7 @@ function setNoRtspVideo(id, videoAddr) {
       fluid: true,
       autoplay: true,
       isLive: true,
-      playsinline: false,
+      playsinline: true,
       screenShot: true,
       whitelist: [''],
       ignores: ['time'],

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

@@ -6,7 +6,7 @@
       <a-select-option value="history">历史记录</a-select-option>
     </a-select>
 
-    <div class="charts-box" v-if="chartsType === 'listMonitor'" style="position: absolute; top: 20px;">
+    <div class="charts-box" v-if="chartsType === 'listMonitor'" style="position: absolute; top: 20px">
       <BarAndLine
         :chartsColumnsType="chartsColumnsType"
         :xAxisPropType="xAxisPropType"
@@ -123,18 +123,19 @@
         height="100%"
         :option="echartsOption1"
         chartsType="history"
-        style="margin-top: 20px;"
+        style="margin-top: 20px"
         :chartsColumns="chartsColumns"
       />
     </div>
   </div>
 </template>
 <script lang="ts">
-  import { ref, defineComponent, watch, reactive, onMounted, watchEffect, inject  } from 'vue';
+  import { ref, defineComponent, watch, reactive, onMounted, watchEffect, inject } from 'vue';
   import BarAndLine from '/@/components/chart/BarAndLine.vue';
   import dayjs from 'dayjs';
   import { defHttp } from '/@/utils/http/axios';
   import { Select, Pagination } from 'ant-design-vue';
+  import { merge } from 'lodash-es';
 
   export default defineComponent({
     name: 'DeviceEcharts',
@@ -171,26 +172,30 @@
     },
     setup(props) {
       const globalConfig = inject('globalConfig');
-      let historyList
-      if(globalConfig.History_Type == 'vent'){
+      let historyList;
+      if (globalConfig.History_Type == 'vent') {
         historyList = (params) => defHttp.get({ url: '/safety/ventanalyMonitorData/list', params });
-      }else{
+      } else {
         historyList = (params) => defHttp.post({ url: '/ventanaly-device/history/getHistoryData', params });
       }
       const chartsType = ref('listMonitor');
       const deviceId = ref('');
       const options = ref([]);
-      const historyParams = reactive(History_Type == 'vent'?{
-        tData: dayjs(),
-        ttime: ['', ''],
-        ttime_begin: dayjs.startOf('date')('HH:mm:ss'),
-        ttime_end: dayjs('HH:mm:ss'),
-        skip: '1',
-      }: {
-        startTime: dayjs().startOf('date'),
-        endTime: dayjs(),
-        interval: '10s'
-      });
+      const historyParams = reactive(
+        History_Type == 'vent'
+          ? {
+              tData: dayjs(),
+              ttime: ['', ''],
+              ttime_begin: dayjs.startOf('date')('HH:mm:ss'),
+              ttime_end: dayjs('HH:mm:ss'),
+              skip: '1',
+            }
+          : {
+              startTime: dayjs().startOf('date'),
+              endTime: dayjs(),
+              interval: '10s',
+            }
+      );
       const resultXAxisPropType = ref('');
       const resultDataSource = ref<any[]>([]);
       const detailDataSource = ref<any[]>([]);
@@ -209,6 +214,11 @@
         toolbox: {
           feature: {},
         },
+        xAxis: {
+          axisLabel: {
+            interval: 0,
+          },
+        },
       };
       const echartsOption1 = {
         grid: {
@@ -221,6 +231,9 @@
         toolbox: {
           feature: {},
         },
+        xAxis: {
+          interval: 0,
+        },
       };
       const echartsOption2 = {
         grid: {
@@ -235,13 +248,12 @@
         },
       };
 
-
       const onChange = (pageNumber: number) => {
         console.log('Page: ', pageNumber);
       };
 
       watch(
-        [chartsType, deviceId, historyParams, pageSize, currentPage,],
+        [chartsType, deviceId, historyParams, pageSize, currentPage],
         async (
           [newChartsType, newDeviceId, newHistoryParams, newPageSize, newCurrentPage],
           [oldChartsType, oldDeviceId, oldHistoryParams, oldPageSize, oldCurrentPage]
@@ -257,7 +269,7 @@
               currentPage.value = 1;
             }
             let res;
-            if(globalConfig.History_Type == 'vent'){
+            if (globalConfig.History_Type == 'vent') {
               resultXAxisPropType.value = 'gcreatetime';
               res = await historyList({
                 ttime_begin: historyParams.ttime[0] ? historyParams.ttime[0] : null,
@@ -269,7 +281,7 @@
                 pageSize: pageSize.value,
                 pageNo: currentPage.value,
               });
-            }else{
+            } else {
               resultXAxisPropType.value = 'time';
               res = await historyList({
                 startTime: historyParams.startTime,
@@ -278,10 +290,10 @@
                 interval: historyParams.interval,
               });
             }
-            if(res.records && res.records.length > 0){
+            if (res.records && res.records.length > 0) {
               resultDataSource.value = res.records.map((item) => Object.assign(item, item.readData));
-            }else{
-              resultDataSource.value = []
+            } else {
+              resultDataSource.value = [];
             }
             total.value = res.total;
           } else if (newChartsType === 'detail') {
@@ -312,7 +324,7 @@
 
       onMounted(async () => {
         const res = await props.deviceListApi();
-        if(res && res.records){
+        if (res && res.records) {
           options.value = res.records;
           deviceId.value = options.value[0]['id'];
         }
@@ -333,15 +345,15 @@
         echartsOption1,
         echartsOption2,
         onChange,
-        globalConfig
+        globalConfig,
       };
     },
   });
 </script>
-<style lang="less" >
+<style lang="less">
   :deep(.vent-select-dropdown) {
     color: #000 !important;
-    .vent-select-item{
+    .vent-select-item {
       color: #000 !important;
     }
   }
@@ -375,13 +387,11 @@
     .@{ventSpace}-picker-separator {
       color: #fff !important;
     }
-    
   }
   :deep(.@{ventSpace}-select-dropdown) {
     color: #000 !important;
-    .@{ventSpace}-select-item{
+    .@{ventSpace}-select-item {
       color: #000 !important;
     }
   }
 </style>
-

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

@@ -2,6 +2,12 @@
   <div class="history-table" v-if="loading">
     <BasicTable ref="historyTable" @register="registerTable" :data-source="dataSource">
       <template #bodyCell="{ column, record }">
+        <a-tag v-if="column.dataIndex === 'warnFlag'" :color="record.warnFlag == '0' ? 'green' : 'red'">{{
+          record.warnFlag == '0' ? '正常' : '报警'
+        }}</a-tag>
+        <a-tag v-if="column.dataIndex === 'netStatus'" :color="record.netStatus == '0' ? '#f00' : 'green'">{{
+          record.netStatus == '0' ? '断开' : '连接'
+        }}</a-tag>
         <slot name="filterCell" v-bind="{ column, record }"></slot>
       </template>
 
@@ -68,7 +74,7 @@
   const getDeviceListApi = (params) => defHttp.post({ url: '/ventanaly-device/monitor/device', params });
   const historyTable = ref();
   const loading = ref(false);
-  const stationType = ref('plc');
+  const stationType = ref('plc1');
   const dataSource = ref([]);
   const intervalMap = new Map([
     ['1', '1s'],
@@ -218,11 +224,12 @@
           stationtype: item['stationtype'],
         };
       });
+      stationType.value = deviceOptions.value[0]['stationtype'];
     }
     await getForm().setFieldsValue({ gdeviceid: props.deviceId ? props.deviceId : deviceOptions.value[0] ? deviceOptions.value[0]['value'] : '' });
-    nextTick(async () => {
-      await getDataSource();
-    });
+    // nextTick(async () => {
+    //   await getDataSource();
+    // });
   }
 
   async function getDataSource() {
@@ -254,6 +261,9 @@
       }
     } else {
       const params = {
+        pageNum: pagination['current'],
+        pageSize: pagination['pageSize'],
+        column: pagination['createTime'],
         startTime: formData['ttime_begin'],
         endTime: formData['ttime_end'],
         deviceId: formData['gdeviceid'],
@@ -340,6 +350,7 @@
                       if (option && (option['strinstallpos'] || option['strtype'] || option['devicekind']))
                         historyType.value = option['strtype'] || option['devicekind'];
                       if (option['strtype']) deviceTypeStr.value = option['strtype'];
+                      debugger;
                       stationType.value = option['stationtype'];
                     },
                   },
@@ -446,13 +457,17 @@
     if (deviceOptions.value[0]) {
       stationType.value = deviceOptions.value[0]['stationtype'];
       historyType.value = deviceOptions.value[0]['strtype'] || deviceOptions.value[0]['devicekind'];
-      nextTick(() => {
-        getDataSource();
+      nextTick(async () => {
+        await getDataSource();
       });
     }
 
-    watch([() => getPaginationRef()['current'], () => getPaginationRef()['pageSize']], () => {
-      getDataSource();
+    watch([() => getPaginationRef()['current'], () => getPaginationRef()['pageSize']], async () => {
+      if (deviceOptions.value[0]) {
+        if (deviceOptions.value[0]) {
+          await getDataSource();
+        }
+      }
     });
   });
   defineExpose({ setLoading });

src/views/vent/monitorManager/deviceMonitor/components/device/device.data.ts

@@ -132,7 +132,7 @@ export const chartsColumnList = [
   },
   {
     legend: '氧气',
-    seriesName: '(氧气%)',
+    seriesName: '(%)',
     ymax: 30,
     yname: '%',
     linetype: 'line',

src/views/vent/monitorManager/deviceMonitor/components/device/modal/gaspatrol.modal.vue

@@ -147,7 +147,7 @@
       const echatsOption = {
         grid: {
           top: '25%',
-          left: '30',
+          left: '10',
           right: '45',
           bottom: '3%',
           containLabel: true,

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

@@ -1,6 +1,9 @@
 <template>
   <div class="scene-box">
-    <DeviceVue ref="DeviceRef" v-if="routerParam !== 'home' && routerParam !== 'timesolution' && routerParam !== 'model3D'" :pageData="pageData" />
+    <template v-if="routerParam !== 'timesolution' && routerParam !== 'home'">
+      <Emergency ref="NetworkRef" v-if="deviceKind === 'emergency'" :pageResult="pageResult" @changePageType="changePageType" />
+      <DeviceVue ref="DeviceRef" v-else :pageData="pageData" />
+    </template>
     <Network ref="NetworkRef" v-if="routerParam === 'timesolution'" :pageResult="pageResult" @changePageType="changePageType" />
   </div>
   <VentModal style="width: 100%; height: 100%; position: absolute" />
@@ -10,6 +13,7 @@
   import { ref, onMounted, watch } from 'vue';
   import DeviceVue from './components/device/index.vue';
   import Network from './components/network/index.vue';
+  import Emergency from './components/emergency/index.vue';
   import { getActions } from '/@/qiankun/state';
   import { useRoute } from 'vue-router';
   import { onBeforeUnmount } from 'vue';
@@ -22,6 +26,7 @@
   const NetworkRef = ref(null);
 
   const routerParam = ref('home');
+  const deviceKind = ref('');
   const pageData = ref({});
   const pageResult = ref({});
 
@@ -47,6 +52,7 @@
 
   onMounted(() => {
     const { type, deviceType } = route.query;
+    deviceKind.value = deviceType as string;
     if (type === 'network') {
       routerParam.value = 'network';
       actions.setGlobalState({ pageObj: { pageType: 'network' } });
@@ -54,7 +60,12 @@
       if (deviceType) {
         pageData.value = { pageType: deviceType };
         actions.setGlobalState({ pageObj: { pageType: deviceType } });
-      }
+      } //  else if (type === 'emergency') {
+      //   if (deviceType) {
+      //     pageData.value = { pageType: deviceType };
+      //     actions.setGlobalState({ pageObj: { pageType: 'emergency' } });
+      //   }
+      // }
     } else {
       routerParam.value = 'home';
       actions.setGlobalState({ pageObj: { pageType: 'home' } });

src/views/vent/monitorManager/fanLocalMonitor/fanLocal.data.ts

@@ -1,7 +1,8 @@
 import { BasicColumn } from '/@/components/Table';
 import { FormSchema } from '/@/components/Table';
 import { rules } from '/@/utils/helper/validator';
-import { ref } from 'vue';
+import { ref, reactive } from 'vue';
+import { cloneDeep } from 'lodash-es';
 export const columns: BasicColumn[] = [
   {
     title: '名称',
@@ -887,7 +888,14 @@ export const fanSetting2 = [
 
 export const data_model = ref<any>({
   layout_center: { x: 727, y: 226 },
-  config: { background_color: '#00000000', scale: 0.9, position_center: { x: 0, y: 0 }, svg_position_center: { x: 50, y: 50 }, grid: true, ruler: false },
+  config: {
+    background_color: '#00000000',
+    scale: 0.9,
+    position_center: { x: 0, y: 0 },
+    svg_position_center: { x: 50, y: 50 },
+    grid: true,
+    ruler: false,
+  },
   done_json: [
     {
       id: 'connection_lineSAVIxZbu1U',
@@ -3491,3 +3499,462 @@ export const data_model = ref<any>({
     },
   ],
 });
+
+export const option = reactive<EChartsOption>({
+  title: {
+    text: '局部通风机运行工况智能决策',
+    textStyle: {
+      color: '#BF954D',
+    },
+    left: 'center',
+    top: 0,
+  },
+  // backgroundColor: '#39deff',
+  tooltip: {
+    trigger: 'axis',
+    axisPointer: {
+      type: 'cross',
+      label: {
+        backgroundColor: '#6a7985',
+      },
+    },
+  },
+  toolbox: {
+    show: true,
+  },
+  grid: {
+    left: 8,
+    right: 50,
+    bottom: 0,
+    containLabel: true,
+  },
+  xAxis: {
+    type: 'category',
+    name: 'm³/min',
+    nameTextStyle: {
+      fontWeight: 600,
+      fontSize: 13,
+    },
+    splitLine: { show: true, lineStyle: { color: 'rgba(21,80,126,.5)' } },
+    axisLabel: {
+      margin: 10,
+      fontSize: 14,
+      color: '#f1f1f199',
+    },
+    boundaryGap: false,
+    data: [],
+  },
+  yAxis: {
+    type: 'value',
+    axisLine: {
+      show: true,
+      lineStyle: {
+        color: '#006c9d',
+      },
+    },
+    splitLine: { show: true, lineStyle: { color: 'rgba(21,80,126,.5)' } },
+    axisLabel: {
+      show: true,
+      fontSize: 14,
+      formatter: '{value}',
+      color: '#0071A5',
+    },
+    min: 1000,
+    max: 9000,
+    name: 'Pa',
+    nameTextStyle: {
+      fontWeight: 600,
+      fontSize: 13,
+    },
+  },
+  series: [],
+});
+export const echatsOption = {
+  // tooltip: {
+  //   show: true,
+  //   formatter: function (datas: []) {
+  //     return datas.map((item) => {
+  //       item['data'] = item['data'].toFixed(2);
+  //       return item;
+  //     });
+  //   },
+  // },
+  legend: {
+    top: -10,
+  },
+  grid: {
+    top: '15%',
+    left: '20',
+    right: '25',
+    bottom: '0',
+    containLabel: true,
+  },
+  toolbox: {
+    feature: {
+      saveAsImage: {
+        show: false,
+      },
+    },
+  },
+  xAxis: {
+    type: 'category',
+    axisLabel: {
+      margin: 10,
+      color: '#f1f1f199',
+    },
+    name: 'm³/min',
+  },
+  yAxis: {
+    axisLabel: {
+      color: '#0071A5',
+    },
+  },
+};
+
+export const chartsColumnList = [
+  {
+    legend: '瓦斯浓度',
+    seriesName: '(%)',
+    ymax: 0.8,
+    yname: '%',
+    linetype: 'line',
+    yaxispos: 'left',
+    color: '#00FFA8',
+    sort: 1,
+    xRotate: 0,
+    dataIndex: 'gas',
+  },
+  {
+    legend: '风量',
+    seriesName: '(m³/min)',
+    ymax: 1100,
+    yname: 'm³/min',
+    linetype: 'line',
+    yaxispos: 'right',
+    color: '#FDB146',
+    sort: 2,
+    xRotate: 0,
+    dataIndex: 'm3',
+  },
+  {
+    legend: '频率',
+    seriesName: '(Hz)',
+    ymax: 50,
+    yname: 'Hz',
+    linetype: 'line',
+    yaxispos: 'right',
+    color: '#AE19FF',
+    sort: 3,
+    xRotate: 0,
+    dataIndex: 'Hz',
+  },
+];
+
+export const initData = () => {
+  const num = 20;
+  const obj = {
+    angle: 0,
+    Hz: 50.0,
+    a: -0.0354466316912028,
+    b: 46.9032472840413,
+    c: -6837.67023286905,
+    min: 600,
+    max: 1100.0,
+  };
+  const a = -0.0354,
+    m = 46.90324,
+    n = -6837.67023;
+  const data = [];
+  for (let i = 0; i <= num; i++) {
+    const item = cloneDeep(obj);
+    const maxn = 14 * i - 0.15 * i * i;
+    item['a'] = Math.round((a - 0.02 * 0.02 * i) * 10000) / 10000;
+    item['Hz'] = 50 - i;
+    item['c'] = n - 10 * i - 0.0232 * i * i;
+    item['b'] = m + i * 0.31 * 0.12;
+    item['max'] = 1090.0 - maxn;
+    item['min'] = 600 + 0.2 * (i - 50) * i;
+    data.push(item);
+  }
+  console.log('------------------->', data);
+  return data;
+};
+
+export const fanInfoData = reactive({
+  fj: '一号回风井',
+  xh: 'FBCDZ No.29',
+  gl: '2×500',
+  edgl: '740',
+  eddy: '10000',
+  eddl: '38.4',
+  flfw: '110~260',
+  fyfw: '200~4100',
+  fbdj: 'ExdI',
+  ccrq: '2010.07',
+  sccj: '南阳防爆',
+  tjfs: '变频调节',
+  plfw: '30~50',
+});
+
+export const fanInfo = [
+  {
+    title: '风井',
+    code: 'fj',
+    value: '一号回风井',
+  },
+  {
+    title: '型号',
+    code: 'xh',
+    value: 'FBCDZ No.29',
+  },
+  {
+    title: '功率(kW)',
+    code: 'gl',
+    value: '2×500',
+  },
+  {
+    title: '额定转速(r/min)',
+    code: 'edgl',
+    value: '740',
+  },
+  {
+    title: '额定电压(V)',
+    code: 'eddy',
+    value: '10000',
+  },
+  {
+    title: '额定电流(A)',
+    code: 'eddl',
+    value: '38.4',
+  },
+  {
+    title: '风量范围(m³/s)',
+    code: 'flfw',
+    value: '110~260',
+  },
+  {
+    title: '风压范围(Pa)',
+    code: 'fyfw',
+    value: '200~4100',
+  },
+  {
+    title: '防爆等级',
+    code: 'fbdj',
+    value: 'ExdI',
+  },
+  {
+    title: '出厂日期',
+    code: 'ccrq',
+    value: '2010.07',
+  },
+  {
+    title: '生产厂家',
+    code: 'sccj',
+    value: '南阳防爆',
+  },
+  {
+    title: '调节方式',
+    code: 'tjfs',
+    value: '变频调节',
+  },
+  {
+    title: '频率可调范围(Hz)',
+    code: 'plfw',
+    value: '30~50',
+  },
+];
+
+export const getSchamas = (): FormSchema[] => {
+  return [
+    {
+      field: 'fj',
+      component: 'Input',
+      label: '风井',
+      colProps: {
+        span: 6,
+      },
+    },
+    {
+      field: 'xh',
+      component: 'Input',
+      label: '型号',
+      colProps: {
+        span: 6,
+      },
+    },
+    {
+      field: 'gl',
+      component: 'Input',
+      label: '功率(kW)',
+      colProps: {
+        span: 6,
+      },
+    },
+    {
+      field: 'edgl',
+      component: 'Input',
+      label: '额定转速(r/min)',
+      colProps: {
+        span: 6,
+      },
+    },
+    {
+      field: 'eddy',
+      component: 'Input',
+      label: '额定电压(V)',
+      colProps: {
+        span: 6,
+      },
+    },
+    {
+      field: 'eddl',
+      component: 'Input',
+      label: '额定电流(A)',
+      colProps: {
+        span: 6,
+      },
+    },
+    {
+      field: 'flfw',
+      component: 'Input',
+      label: '风量范围(m³/s)',
+      colProps: {
+        span: 6,
+      },
+    },
+    {
+      field: 'fyfw',
+      component: 'Input',
+      label: '风压范围(Pa)',
+      colProps: {
+        span: 6,
+      },
+    },
+    {
+      field: 'fbdj',
+      component: 'Select',
+      label: '防爆等级',
+      colProps: {
+        span: 6,
+      },
+      componentProps: {
+        options: [
+          {
+            label: 'ExdI',
+            value: 'ExdI',
+            key: '1',
+          },
+        ],
+      },
+    },
+    {
+      field: 'ccrq',
+      component: 'Input',
+      label: '出厂日期',
+      colProps: {
+        span: 6,
+      },
+    },
+    {
+      field: 'sccj',
+      component: 'Input',
+      label: '生产厂家',
+      colProps: {
+        span: 6,
+      },
+    },
+    {
+      field: 'tjfs',
+      component: 'Select',
+      label: '调节方式',
+      colProps: {
+        span: 6,
+      },
+      componentProps: {
+        options: [
+          {
+            label: '变频调节',
+            value: '变频调节',
+            key: '1',
+          },
+        ],
+      },
+    },
+    {
+      field: 'plfw',
+      component: 'Input',
+      label: '频率可调范围(Hz)',
+      colProps: {
+        span: 6,
+      },
+    },
+  ];
+};
+
+export const getSchamas1 = (): FormSchema[] => {
+  return [
+    {
+      field: 'Hz',
+      component: 'InputNumber',
+      label: '频率(Hz)',
+      required: true,
+      colProps: {
+        span: 6,
+      },
+    },
+    {
+      field: 'a',
+      component: 'InputNumber',
+      label: '二次项系数',
+      required: true,
+      colProps: {
+        span: 6,
+      },
+    },
+    {
+      field: 'b',
+      component: 'InputNumber',
+      label: '一次项系数',
+      required: true,
+      colProps: {
+        span: 6,
+      },
+    },
+    {
+      field: 'c',
+      component: 'InputNumber',
+      label: '常数项系数',
+      required: true,
+      colProps: {
+        span: 6,
+      },
+    },
+    {
+      field: 'min',
+      component: 'InputNumber',
+      label: '风量下限(m³/s)',
+      required: true,
+      colProps: {
+        span: 6,
+      },
+    },
+    {
+      field: 'max',
+      component: 'InputNumber',
+      label: '风量上限(m³/s)',
+      required: true,
+      colProps: {
+        span: 6,
+      },
+    },
+  ];
+};
+
+export const lineFormData = reactive({
+  Hz: null,
+  a: null,
+  b: null,
+  c: null,
+  min: null,
+  max: null,
+});

src/views/vent/monitorManager/fanLocalMonitor/fcfanLocal.three.ts

@@ -10,6 +10,7 @@ class fcFan {
   }
 
   mountedThree() {
+    if (!this.model) return;
     return new Promise((resolve) => {
       this.model.setGLTFModel([this.modelName]).then((gltf) => {
         this.group = gltf[0];

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

@@ -25,10 +25,12 @@
         </div>
         <div class="elementTag" id="outBox">
           <div class="elementContent elementContent-r" v-if="selectData.windQuantity2 || selectData.gas1 || selectData.ductOutletAirVolume_merge">
-            <p v-if="selectData.windQuantity2 || selectData.ductOutletAirVolume_merge"
+            <p v-if="selectData.windQuantity2 || selectData.m3 || selectData.ductOutletAirVolume_merge"
               >迎头供风量：<span class="value">{{
                 selectData.windQuantity2
                   ? selectData.windQuantity2
+                  : selectData.m3
+                  ? selectData.m3
                   : selectData.ductOutletAirVolume_merge
                   ? selectData.ductOutletAirVolume_merge
                   : '-'
@@ -295,12 +297,17 @@
           </a-tab-pane>
           <a-tab-pane key="3" tab="历史数据">
             <div class="tab-item" v-if="activeKey === '3'">
-              <HistoryTable
-                :columns-type="`${selectData.deviceType}`"
-                :device-type="`${devicekide}`"
-                designScope="fanlocal-history"
-                :scroll="scroll"
-              />
+              <HistoryTable :columns-type="`${selectData.deviceType}`" :device-type="`${devicekide}`" designScope="fanlocal-history" :scroll="scroll">
+                <template #filterCell="{ column, record }">
+                  <a-tag v-if="column.dataIndex === 'warnFlag'" :color="record.warnFlag == '0' ? 'green' : 'red'">{{
+                    record.warnFlag == '0' ? '正常' : '报警'
+                  }}</a-tag>
+                  <a-tag v-if="column.dataIndex === 'netStatus'" :color="record.netStatus == '0' ? 'default' : 'green'">{{
+                    record.netStatus == '0' ? '断开' : '连接'
+                  }}</a-tag>
+                  <div v-if="record.nwindownum == 1 && column.dataIndex === 'rearArea'">/</div>
+                </template>
+              </HistoryTable>
             </div>
           </a-tab-pane>
           <a-tab-pane key="4" tab="报警历史">
@@ -344,13 +351,20 @@
     style="z-index: 999; position: absolute; top: 100px; right: 15px; width: 100%; height: 100%; margin: auto; pointer-events: none"
   >
   </div>
-  <a-modal v-model:visible="modalIsShow" :title="modalTitle" @ok="handleOk">
+  <a-modal v-model:visible="modalIsShow" :title="modalTitle" :maskStyle="{ backgroundColor: '#000000aa', backdropFilter: 'blur(3px)' }">
+    <template #footer>
+      <div v-if="controlType != 'startFan'">
+        <a-button key="back" @click="cancel">返回</a-button>
+        <a-button key="submit" type="primary" :loading="loading" @click="handleOk">确定</a-button>
+      </div>
+    </template>
     <div class="modal-container">
       <div class="vent-flex-row">
         <ExclamationCircleFilled style="color: #ffb700; font-size: 30px" />
         <div class="warning-text">您是否要进行{{ modalTitle }}操作？</div>
       </div>
       <div class="" v-if="controlType == 'startSmoke'">
+        <!-- 互斥控制 -->
         <div class="startSmoke-select">
           <div class="label">主机：</div>
           <a-radio-group v-model:value="mainWindIsShow1" @change="changeMotor" name="localWind1">
@@ -366,6 +380,21 @@
           </a-radio-group>
         </div>
       </div>
+      <div class="" v-if="controlType == 'startFan'">
+        <!-- 不互斥控制 -->
+        <div class="startSmoke-select">
+          <div class="label">主机：</div>
+          <div :class="{ 'button-box': true, 'button-disable': false }" @click="handleOk('Fan1Open')">开启</div>
+          <div :class="{ 'button-box': true, 'button-disable': false }" @click="handleOk('Fan1Stop')">停止</div>
+          <div :class="{ 'button-box': true, 'button-disable': false }" @click="handleOk('Fan1Reset')">复位</div>
+        </div>
+        <div class="startSmoke-select">
+          <div class="label">备机：</div>
+          <div :class="{ 'button-box': true, 'button-disable': false }" @click="handleOk('Fan2Open')">开启</div>
+          <div :class="{ 'button-box': true, 'button-disable': false }" @click="handleOk('Fan2Stop')">停止</div>
+          <div :class="{ 'button-box': true, 'button-disable': false }" @click="handleOk('Fan2Reset')">复位</div>
+        </div>
+      </div>
       <!-- 调频 -->
       <div class="vent-flex-row input-box" v-if="controlType == 'Fan1Frequency'">
         <div class="label">主风机运行频率（Hz）：</div>
@@ -403,6 +432,12 @@
         <div class="label">瓦斯电闭锁限值（m³/min）：</div>
         <a-input-number size="small" v-model:value="frequencyVal" :min="0" :max="50" :step="0.1" />
       </div>
+      <div v-if="controlType == 'gasAlarmSet'">
+        <div class="vent-flex-row input-box">
+          <div class="label">设置瓦斯超限浓度：</div>
+          <a-input-number size="small" v-model:value="gasWarningVal" :min="0" :max="1" :step="0.01" />
+        </div>
+      </div>
       <div v-if="controlType == 'gasAlarm'">
         <div class="vent-flex-row input-box">
           <div class="label">传感器名称：</div>
@@ -431,6 +466,7 @@
       </div>
     </div>
   </a-modal>
+  <ConditionAssistance @register="registerModalAssistance" :dataSource="historySource" />
   <DeviceBaseInfo @register="registerModal" :device-type="selectData['deviceType']" />
   <reportInfo @register="registerModal1" :editID="editID" :fileType="fileType" />
 </template>
@@ -462,25 +498,35 @@
   import { message } from 'ant-design-vue';
   import { useCamera } from '/@/hooks/system/useCamera';
   import { CaretRightOutlined } from '@ant-design/icons-vue';
+  import ConditionAssistance from './components/conditionAssistance.vue';
   import { DownloadOutlined } from '@ant-design/icons-vue';
   import reportInfo from '../comment/components/reportInfo.vue';
   import { save, reportList } from '../../reportManager/reportManager.api';
   import { usePermission } from '/@/hooks/web/usePermission';
+  import { useGlobSetting } from '/@/hooks/setting';
   const { hasPermission } = usePermission();
   const globalConfig = inject('globalConfig');
   const [registerModal, { openModal, closeModal }] = useModal();
   const [registerModal1, { openModal: openModal1, closeModal: closeModal1 }] = useModal();
+  const [registerModalAssistance, { openModal: openAssistance, closeModal: closeAssistance }] = useModal();
   const { currentRoute } = useRouter();
   const router = useRouter();
 
+  const globSetting = useGlobSetting();
+
   const modalTypeArr = reactive({
     leftBtnArr: [
       {
         key: 'startSmoke',
-        value: '启动风机',
+        value: '启停风机',
         permission: 'btn:openclose',
       },
       {
+        key: 'startFan',
+        value: '启停风机',
+        permission: 'btn:openclose1',
+      },
+      {
         key: 'changeSmoke', // 主备两个点位
         value: '一键倒机',
         permission: 'btn:change',
@@ -533,6 +579,20 @@
     ],
     rightBtnArr: [
       {
+        key: 'gasAlarmSet',
+        value: '瓦斯限值设定',
+        // permission: 'fanLocal:control',
+      },
+      {
+        key: 'kkjc',
+        value: '工况辅助决策',
+      },
+      {
+        key: 'diameter',
+        value: '风筒直径',
+        permission: 'fanLocal:control',
+      },
+      {
         key: 'diameter',
         value: '风筒直径',
         permission: 'fanLocal:control',
@@ -594,6 +654,8 @@
   const scroll = reactive({
     y: 180,
   });
+
+  const gasWarningVal = ref(0.6); // 瓦斯最大报警值
   const playerRef = ref();
   const MonitorDataTable = ref();
   const modalSensor = ref(null);
@@ -606,6 +668,8 @@
   const fan2FrequencyVal = ref(40); //备机频率
   const mainWindIsShow1 = ref('open'); // 主机默认启动leftColumns
   const mainWindIsShow2 = ref('stop'); // 备机默认不启动
+  const fanControl = ref('');
+
   const passWord = ref('');
   // 默认初始是第一行
   const selectRowIndex = ref(-1);
@@ -632,6 +696,7 @@
   };
   const frequencyVal = ref(0);
   const dataSource = ref([]);
+  const historySource = ref([]);
   // 关联设备信息
   const linkDeviceInfo = ref({});
   // 监测数据
@@ -738,6 +803,11 @@
           if (data['Fan2StartStatus'] && data['Fan2StartStatus'] === '1.0') data['Fan2StartStatus'] = '1';
           if (data['Fan1StartStatus'] && data['Fan1StartStatus'] === '0.0') data['Fan1StartStatus'] = '0';
           if (data['Fan2StartStatus'] && data['Fan2StartStatus'] === '0.0') data['Fan2StartStatus'] = '0';
+
+          if (globSetting.sysOrgCode === 'sdmtjtbetmk') {
+            if (data['m3']) data['ductOutletAirVolume_merge'] = data['m3'];
+            if (data['m3']) data['inletAirVolume_merge'] = (Number(data['m3']) * 1.08).toFixed(2);
+          }
           dataSource.value.push(data);
         });
         if (MonitorDataTable.value && selectRowIndex.value == -1) {
@@ -780,7 +850,7 @@
             playSmoke(selectData);
             addText(selectData);
           }
-
+          historySource.value = selectData.history;
           if (timer) {
             timer = null;
           }
@@ -820,7 +890,7 @@
         if (linkDeviceInfo.value['window_fWindowM3']) {
           modalType.value = 'fc';
         }
-
+        // 主备互斥控制
         if (data['Fan1StartStatus'] == '1') {
           mainWindIsShow1.value = 'open';
           mainWindIsShow2.value = 'stop';
@@ -850,6 +920,12 @@
   // 打开并设置modal的标题
   function showModal(obj) {
     if (!btnClick.value) return;
+    if (obj.key == 'kkjc') {
+      gasWarningVal.value = 0.6;
+      // 工况辅助决策
+      openAssistance(true, {});
+      return;
+    }
     controlType.value = obj.key;
     modalTitle.value = obj.value;
     passWord.value = '';
@@ -869,7 +945,7 @@
     }
   }
 
-  function handleOk(e: MouseEvent) {
+  function handleOk(control?) {
     const handType = controlType.value;
     const data = {
       deviceid: selectData.deviceID,
@@ -878,8 +954,10 @@
       password: passWord.value || globalConfig?.simulatedPassword,
       value: null,
     };
+    debugger;
     if (handType === 'startSmoke') {
       // 启动风机
+      // 以下是互斥
       if (mainWindIsShow1.value === 'open' && mainWindIsShow2.value === 'stop') {
         // playSmoke(handType, 'top', frequency, 'open');
         data.paramcode = 'CtrlFan1Start';
@@ -892,11 +970,11 @@
               message.success('指令已下发成功！');
             }
             modalTitle.value = '';
-            modalIsShow.value = true;
+            modalIsShow.value = false;
             btnClick.value = true;
           })
           .catch((err) => {
-            modalIsShow.value = true;
+            // modalIsShow.value = true;
           });
       } else if (mainWindIsShow2.value === 'open' && mainWindIsShow1.value === 'stop') {
         // playSmoke(handType, 'down', frequency, 'open');
@@ -919,6 +997,35 @@
       } else if (mainWindIsShow1.value === 'stop' && mainWindIsShow2.value === 'stop') {
         // playSmoke(handType, '', frequency, 'stop');
       }
+    } else if (handType === 'startFan') {
+      if (control === 'Fan1Open') {
+        data.paramcode = 'CtrlFan1Start';
+      } else if (control === 'Fan2Open') {
+        data.paramcode = 'CtrlFan2Start';
+      } else if (control === 'Fan1Stop') {
+        data.paramcode = 'Fan1Stop';
+      } else if (control === 'Fan2Stop') {
+        data.paramcode = 'Fan2Stop';
+      } else if (control === 'Fan1Reset') {
+        data.paramcode = 'Fan1Reset';
+      } else if (control === 'Fan2Reset') {
+        data.paramcode = 'Fan2Reset';
+      }
+      btnClick.value = false;
+      deviceControlApi(data)
+        .then((res) => {
+          if (globalConfig.History_Type == 'remote') {
+            message.success('指令已下发至生产管控平台成功！');
+          } else {
+            message.success('指令已下发成功！');
+          }
+          modalTitle.value = '';
+          modalIsShow.value = false;
+          btnClick.value = true;
+        })
+        .catch((err) => {
+          btnClick.value = true;
+        });
     } else if (handType === 'Fan1Frequency' || handType === 'Fan2Frequency' || handType === 'FanFrequency') {
       // 调频
       if (handType === 'Fan1Frequency') {
@@ -1056,9 +1163,62 @@
         modalIsShow.value = false;
         btnClick.value = true;
       });
+    } else if (handType === 'gasAlarmSet') {
+      if (passWord.value != '123456') {
+        message.error('密码错误，请重新输入！');
+        return;
+      }
+      if (gasWarningVal.value) {
+        modalTitle.value = '';
+        modalIsShow.value = false;
+        setTimeout(() => {
+          passWord.value = '';
+          modalIsShow.value = true;
+          controlType.value = 'toGkjc';
+          modalTitle.value = '工况决策辅助';
+        }, 500);
+      } else {
+        message.error('请核对瓦斯超限浓度值！');
+      }
+    } else if (handType === 'toGkjc') {
+      if (passWord.value != '123456') {
+        message.error('密码错误，请重新输入！');
+        return;
+      }
+      //进行工况决策
+      if (selectData.Fan1StartStatus == '1') {
+        openAssistance(true, {
+          m3: selectData.m3 || 675.87,
+          // m3: 675.87,
+          frequency: 30,
+          // frequency: selectData.Fan1fHz || selectData.Fan1FreqHz || selectData.Fan1Loop_Frequency,
+          gasWarningVal: gasWarningVal.value,
+          isCompute: false,
+        });
+      } else if (selectData.Fan2StartStatus == '1') {
+        openAssistance(true, {
+          m3: selectData.m3 || 675.87,
+          // m3: 675.87,
+          frequency: 30,
+          // frequency: selectData.Fan2fHz || selectData.Fan2FreqHz || selectData.Fan2Loop_Frequency,
+          gasWarningVal: gasWarningVal.value,
+          isCompute: false,
+        });
+      } else {
+        // openAssistance(true, { m3: 635.04, dataDh: 5748 });
+        openAssistance(true);
+      }
+      modalTitle.value = '';
+      modalIsShow.value = false;
     }
   }
 
+  function cancel() {
+    modalTitle.value = '';
+    modalIsShow.value = false;
+    gasWarningVal.value = 0;
+  }
+
   function handleChangeSensor(value: string) {
     console.log(value);
   }
@@ -1345,4 +1505,53 @@
       pointer-events: auto !important;
     }
   }
+  :deep(.button-box) {
+    position: relative;
+    padding: 5px;
+    // border: 1px transparent solid;
+    border-radius: 5px;
+    margin-left: 8px;
+    margin-right: 8px;
+    width: auto;
+    // height: 40px;
+    // border: 1px solid #65dbea;
+    height: 35px !important;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: #fff;
+    padding: 0 15px 5px 15px;
+    cursor: pointer;
+    &:hover {
+      background: linear-gradient(#2cd1ff55, #1eb0ff55);
+    }
+    &::before {
+      width: calc(100% - 6px);
+      height: 27px;
+      content: '';
+      position: absolute;
+      top: 3px;
+      right: 0;
+      left: 3px;
+      bottom: 0;
+      z-index: -1;
+      border-radius: inherit; /*important*/
+      background: linear-gradient(#1fa6cb, #127cb5);
+    }
+    &::after {
+      width: calc(100% + 32px);
+      height: 10px;
+      content: '';
+      position: absolute;
+      top: 28px;
+      right: 0;
+      left: -16px;
+      bottom: 0;
+      z-index: -1;
+      border-radius: inherit; /*important*/
+      background-position: center;
+      background-size: 100%;
+      z-index: 999;
+    }
+  }
 </style>

src/views/vent/monitorManager/gasPumpMonitor/components/gasPumpHome.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="monitor-container">
     <div id="FlowSensor" class="FlowSensor-box" style="position: absolute; display: none">
-      <div class="elementContent" v-if="deviceType == 'pump_under'">
+      <div class="elementContent" v-if="selectData['deviceType'] == 'pump_under' || selectData['deviceType'] == 'pump_n12m2pq'">
         <fourBorderBg>
           <template v-for="(item, index) in modelMonitor" :key="index">
             <div class="gas-monitor-row">
@@ -271,6 +271,7 @@
     jxmsqh: '1',
     ykjdqh: '1',
     FlowSensor_InputFlux: '-',
+    deviceType: '',
   });
 
   const { getCamera, removeCamera } = useCamera();
@@ -382,7 +383,7 @@
       nextTick(async () => {
         if (props.deviceType == 'pump_over') {
           setModelType('gasPump');
-        } else if (props.deviceType == 'pump_under') {
+        } else if (props.deviceType == 'pump_under' || props.deviceType == 'pump_n12m2pq') {
           setModelType('gasPumpUnder');
         }
       });

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

@@ -78,27 +78,36 @@
                 <a-tag v-else-if="column.dataIndex === 'frontGateOpen' && record.frontGateOpen == '0' && record.frontGateClose == 1" color="default"
                   >关闭</a-tag
                 >
-                <a-tag v-else-if="column.dataIndex === 'frontGateOpen' && record.frontGateOpen == 1 && record.frontGateClose == '0'" color="#46C66F"
+                <a-tag v-else-if="column.dataIndex === 'frontGateOpen' && record.frontGateOpen == '1' && record.frontGateClose == '0'" color="#46C66F"
                   >打开</a-tag
                 >
+                <a-tag v-else-if="column.dataIndex === 'frontGateOpen' && record.frontGateOpen == '1' && record.frontGateClose == '1'" color="#FF0000"
+                  >点位异常</a-tag
+                >
                 <a-tag v-if="column.dataIndex === 'rearGateOpen' && record.rearGateOpen == '0' && record.rearGateClose == '0'" color="red"
                   >正在运行</a-tag
                 >
-                <a-tag v-else-if="column.dataIndex === 'rearGateOpen' && record.rearGateOpen == '0' && record.rearGateClose == 1" color="default"
+                <a-tag v-else-if="column.dataIndex === 'rearGateOpen' && record.rearGateOpen == '0' && record.rearGateClose == '1'" color="default"
                   >关闭</a-tag
                 >
-                <a-tag v-else-if="column.dataIndex === 'rearGateOpen' && record.rearGateOpen == 1 && record.rearGateClose == '0'" color="#46C66F"
+                <a-tag v-else-if="column.dataIndex === 'rearGateOpen' && record.rearGateOpen == '1' && record.rearGateClose == '0'" color="#46C66F"
                   >打开</a-tag
                 >
+                <a-tag v-else-if="column.dataIndex === 'rearGateOpen' && record.rearGateOpen == '1' && record.rearGateClose == '1'" color="#FF0000"
+                  >点位异常</a-tag
+                >
                 <a-tag v-if="column.dataIndex === 'midGateOpen' && record.midGateOpen == '0' && record.midGateClose == '0'" color="red"
                   >正在运行</a-tag
                 >
                 <a-tag v-else-if="column.dataIndex === 'midGateOpen' && record.midGateOpen == '0' && record.midGateClose == 1" color="default"
                   >关闭</a-tag
                 >
-                <a-tag v-else-if="column.dataIndex === 'midGateOpen' && record.midGateOpen == 1 && record.midGateClose == '0'" color="#46C66F"
+                <a-tag v-else-if="column.dataIndex === 'midGateOpen' && record.midGateOpen == '1' && record.midGateClose == '0'" color="#46C66F"
                   >打开</a-tag
                 >
+                <a-tag v-else-if="column.dataIndex === 'midGateOpen' && record.midGateOpen == '1' && record.midGateClose == '1'" color="#FF0000"
+                  >点位异常</a-tag
+                >
                 <template v-if="column.dataIndex === 'ndoortype'">
                   <span v-if="record.ndoortype == '0'">气动风门</span>
                   <span v-else color="default">液压风门</span>
@@ -138,18 +147,88 @@
           </a-tab-pane> -->
           <a-tab-pane key="3" tab="历史数据">
             <div class="tab-item" v-if="activeKey === '3'">
-              <HistoryTable columns-type="gate" device-type="gate" designScope="gate-history" :scroll="scroll" />
+              <HistoryTable columns-type="gate" device-type="gate" designScope="gate-history" :scroll="scroll">
+                <template #filterCell="{ column, record }">
+                  <a-tag v-if="column.dataIndex === 'frontGateOpen' && record.frontGateOpen == '0' && record.frontGateClose == '0'" color="red"
+                    >正在运行</a-tag
+                  >
+                  <a-tag v-else-if="column.dataIndex === 'frontGateOpen' && record.frontGateOpen == '0' && record.frontGateClose == 1" color="default"
+                    >关闭</a-tag
+                  >
+                  <a-tag
+                    v-else-if="column.dataIndex === 'frontGateOpen' && record.frontGateOpen == '1' && record.frontGateClose == '0'"
+                    color="#46C66F"
+                    >打开</a-tag
+                  >
+                  <a-tag
+                    v-else-if="column.dataIndex === 'frontGateOpen' && record.frontGateOpen == '1' && record.frontGateClose == '1'"
+                    color="#FF0000"
+                    >点位异常</a-tag
+                  >
+                  <a-tag v-if="column.dataIndex === 'rearGateOpen' && record.rearGateOpen == '0' && record.rearGateClose == '0'" color="red"
+                    >正在运行</a-tag
+                  >
+                  <a-tag v-else-if="column.dataIndex === 'rearGateOpen' && record.rearGateOpen == '0' && record.rearGateClose == '1'" color="default"
+                    >关闭</a-tag
+                  >
+                  <a-tag v-else-if="column.dataIndex === 'rearGateOpen' && record.rearGateOpen == '1' && record.rearGateClose == '0'" color="#46C66F"
+                    >打开</a-tag
+                  >
+                  <a-tag v-else-if="column.dataIndex === 'rearGateOpen' && record.rearGateOpen == '1' && record.rearGateClose == '1'" color="#FF0000"
+                    >点位异常</a-tag
+                  >
+                  <a-tag v-if="column.dataIndex === 'midGateOpen' && record.midGateOpen == '0' && record.midGateClose == '0'" color="red"
+                    >正在运行</a-tag
+                  >
+                  <a-tag v-else-if="column.dataIndex === 'midGateOpen' && record.midGateOpen == '0' && record.midGateClose == 1" color="default"
+                    >关闭</a-tag
+                  >
+                  <a-tag v-else-if="column.dataIndex === 'midGateOpen' && record.midGateOpen == '1' && record.midGateClose == '0'" color="#46C66F"
+                    >打开</a-tag
+                  >
+                  <a-tag v-else-if="column.dataIndex === 'midGateOpen' && record.midGateOpen == '1' && record.midGateClose == '1'" color="#FF0000"
+                    >点位异常</a-tag
+                  >
+                  <template v-if="column.dataIndex === 'ndoortype'">
+                    <span v-if="record.ndoortype == '0'">气动风门</span>
+                    <span v-else color="default">液压风门</span>
+                  </template>
+                  <template v-if="column.dataIndex === 'doorUse'">
+                    <span v-if="record.doorUse == 2">行人风门</span>
+                    <span v-else color="default">行车风门</span>
+                  </template>
+                  <template v-else-if="column.dataIndex === 'warnLevel'">
+                    <a-tag v-if="record.warnLevel == '101'" color="green">低风险</a-tag>
+                    <a-tag v-else-if="record.warnLevel == '102'" color="#FF5812">一般风险</a-tag>
+                    <a-tag v-else-if="record.warnLevel == '103'" color="#FF5812">较大风险</a-tag>
+                    <a-tag v-else-if="record.warnLevel == '104'" color="#FF5812">重大风险</a-tag>
+                    <a-tag v-else-if="record.warnLevel == '201'" color="#FF0000">报警</a-tag>
+                    <a-tag v-else-if="record.warnLevel == '10000'" color="#FF5812">数据超限</a-tag>
+                    <a-tag v-else-if="record.warnLevel == '1001'" color="default">网络中断</a-tag>
+                    <a-tag v-else color="green">正常</a-tag>
+                  </template>
+                  <a-tag v-else-if="column.dataIndex === 'warnFlag'" :color="record.warnFlag == '0' ? 'green' : 'red'">{{
+                    record.warnFlag == '0' ? '正常' : '报警'
+                  }}</a-tag>
+                  <a-tag v-if="column.dataIndex === 'netStatus'" :color="record.netStatus == '0' ? '#f00' : 'green'">{{
+                    record.netStatus == '0' ? '断开' : '连接'
+                  }}</a-tag>
+                </template>
+              </HistoryTable>
             </div>
           </a-tab-pane>
           <a-tab-pane key="4" tab="报警历史">
             <div class="tab-item" v-if="activeKey === '4'">
-              <AlarmHistoryTable
-                columns-type="alarm"
-                device-type="gate"
-                :device-list-api="getTableList"
-                designScope="alarm-history"
-                :scroll="scroll"
-              />
+              <AlarmHistoryTable columns-type="alarm" device-type="gate" :device-list-api="getTableList" designScope="alarm-history" :scroll="scroll">
+                <template #filterCell="{ column, record }">
+                  <a-tag v-if="column.dataIndex === 'warnFlag'" :color="record.warnFlag == '0' ? 'green' : record.warnFlag == 1 ? '#FF5812' : 'gray'">
+                    {{ record.warnFlag == '0' ? '正常' : record.warnFlag == 1 ? '报警' : record.warnFlag == 2 ? '断开' : '未监测' }}</a-tag
+                  >
+                  <a-tag v-if="column.dataIndex === 'netStatus'" :color="record.netStatus == '0' ? '#f00' : 'green'">{{
+                    record.netStatus == '0' ? '断开' : '连接'
+                  }}</a-tag>
+                </template>
+              </AlarmHistoryTable>
             </div>
           </a-tab-pane>
           <a-tab-pane key="5" tab="操作历史">

src/views/vent/monitorManager/groutMonitor/grout.data.ts

@@ -656,8 +656,8 @@ export function getMonitorComponent() {
       groutHome = defineAsyncComponent(() => import('./components/groutHomelt.vue'));
       break;
     default:
-      // groutHome = defineAsyncComponent(() => import('./components/groutHomeHjt.vue'));
-      groutHome = defineAsyncComponent(() => import('./components/groutHomelt.vue'));
+      groutHome = defineAsyncComponent(() => import('./components/groutHomeHjt.vue'));
+      // groutHome = defineAsyncComponent(() => import('./components/groutHomelt.vue'));
       return groutHome;
   }
 }

src/views/vent/monitorManager/groutMonitor/grout.threejs.ts

@@ -100,8 +100,8 @@ export const mountedThree = () => {
     groutBaseObj = new ChamberBase(model);
     await groutBaseObj.mountedThree();
 
-    BertaiObj=new BertaiBase(model) //lxh
-    await BertaiObj.mountedThree();//lxh
+    BertaiObj = new BertaiBase(model); //lxh
+    await BertaiObj.mountedThree(); //lxh
 
     addMouseEvent();
     model.animate();

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

@@ -237,13 +237,13 @@
                       <div
                         class="signal-round vent-margin-l-8"
                         :class="{
-                          'signal-round-run': selectData[state.dataIndex],
-                          'signal-round-warning': selectData[state.dataIndex] !== undefined && !selectData[state.dataIndex],
+                          'signal-round-run': selectData[state.dataIndex] == '0',
+                          'signal-round-warning': selectData[state.dataIndex] !== undefined && selectData[state.dataIndex] == '1',
                           'signal-round-gry': selectData[state.dataIndex] === undefined,
                         }"
                       ></div>
                       <div class="vent-margin-l-8">{{
-                        selectData[state.dataIndex] === undefined ? '无状态' : selectData[state.dataIndex] ? '正常' : '异常'
+                        selectData[state.dataIndex] === undefined ? '无状态' : selectData[state.dataIndex] == '0' ? '正常' : '异常'
                       }}</div>
                     </div>
                   </div>
@@ -282,7 +282,17 @@
           </a-tab-pane> -->
           <a-tab-pane key="3" tab="历史数据">
             <div class="tab-item" v-if="activeKey === '3'">
-              <HistoryTable device-type="fanmain" designScope="fanmain-history" :scroll="scroll" />
+              <HistoryTable device-type="fanmain" designScope="fanmain-history" :scroll="scroll">
+                <template #filterCell="{ column, record }">
+                  <a-tag v-if="column.dataIndex === 'warnFlag'" :color="record.warnFlag == '0' ? 'green' : 'red'">{{
+                    record.warnFlag == '0' ? '正常' : '报警'
+                  }}</a-tag>
+                  <a-tag v-if="column.dataIndex === 'netStatus'" :color="record.netStatus == '0' ? 'default' : 'green'">{{
+                    record.netStatus == '0' ? '断开' : '连接'
+                  }}</a-tag>
+                  <div v-if="record.nwindownum == 1 && column.dataIndex === 'rearArea'">/</div>
+                </template>
+              </HistoryTable>
             </div>
           </a-tab-pane>
           <a-tab-pane key="4" tab="报警历史">

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

@@ -214,6 +214,113 @@
   async function getDataSource() {
     const res = await list({ devicetype: 'forcFan', pagetype: 'normal' });
     let dataSource = res.msgTxt[0] && res.msgTxt[0].datalist ? res.msgTxt[0].datalist[0] : [];
+    // dataSource = {
+    //   msgType: null,
+    //   deviceID: '1773237923639201793',
+    //   strname: '寸草塔二矿压风机',
+    //   strinstallpos: '寸草塔二矿压风机',
+    //   fsectarea: 'null',
+    //   stationname: '寸草塔二矿压风机',
+    //   stationtype: 'redis',
+    //   deviceType: 'forcFan_normal',
+    //   typeName: '压风机',
+    //   netStatus: 1,
+    //   warnFlag: 0,
+    //   warnLevel: 0,
+    //   warnLevel_str: '正常',
+    //   warnTime: null,
+    //   readTime: '2024-04-07 14:47:23',
+    //   warnDes: '',
+    //   frontGateOpenCtrl: null,
+    //   rearGateOpenCtrl: null,
+    //   readData: {
+    //     PRE1_MOT_PhaseATemp: '27',
+    //     PRE3_CPR_CoolantTemp: '76',
+    //     PRE3_MOT_PhaseCTemp: '92',
+    //     sign: '0',
+    //     PRE1_CPR_UnLoadPre: '6.7',
+    //     PRE1_CPR_LoadorUnload: '0',
+    //     PRE3_CPR_ExhaustPre: '6.0',
+    //     PRE2_CPR_ExhaustTemp: '47',
+    //     PRE3_MOT_DrivingEndVibrationValid: '-8.6',
+    //     PRE1_VLS_OverTempAlarm: '0',
+    //     PRE2_CPR_LoadorUnload: '1',
+    //     PRE2_AlamSignal: '0',
+    //     PRE3_MOT_PhaseBTemp: '91',
+    //     PRE2_MOT_DrivingEndVibrationValid: '-8.6',
+    //     PRE1_CPR_ExhaustPre: '5.7',
+    //     PRE3_FaultSignal: '0',
+    //     PRE3_MOT_Power: '0',
+    //     PRE3_MOT_PhaseATemp: '103',
+    //     PRE2_CPR_CoolantTemp: '73',
+    //     PRE1_HostTemp: '22',
+    //     PRE1_FaultSignal: '0',
+    //     PRE2_FaultSignal: '0',
+    //     PRE2_VLS_OverTempAlarm: '0',
+    //     PRE2_MOT_FrontAxleTemp: '43',
+    //     PRE3_MOT_BackAxleTemp: '57',
+    //     PRE1_MOT_TotalRunTime: '493',
+    //     PRE3_MOT_FrontAxleTemp: '80',
+    //     PRE3_VLS_OverTempAlarm: '0',
+    //     PRE1_CPR_LoadTime: '7143',
+    //     PRE2_CPR_LoadTime: '6036',
+    //     PRE3_CPR_LoadTime: '4019',
+    //     PRE2_MOT_Power: '0',
+    //     PRE2_MOT_PhaseBTemp: '72',
+    //     PRE2_HostTemp: '101',
+    //     PRE2_MOT_TotalRunTime: '7318',
+    //     PRE3_MOT_NoneDrivingEndVibrationValid: '-8.46',
+    //     PRE2_MOT_NoneDrivingEndVibrationValid: '-8.44',
+    //     PRE2_MOT_BackAxleTemp: '52',
+    //     PRE1_MOT_NoneDrivingEndVibrationValid: '0.0',
+    //     PRE1_Status: '0',
+    //     PRE3_Status: '1',
+    //     PRE2_Status: '1',
+    //     PRE1_VLS_Temp: '35',
+    //     PRE3_CPR_UnLoadPre: '7.2',
+    //     PRE1_AlamSignal: '0',
+    //     PRE2_CPR_ExhaustPre: '5.8',
+    //     PRE3_CPR_ExhaustTemp: '50',
+    //     PRE3_MOT_TotalRunTime: '4038',
+    //     PRE1_MOT_BackAxleTemp: '26',
+    //     PRE2_MOT_PhaseATemp: '72',
+    //     PRE1_MOT_FrontAxleTemp: '34',
+    //     PRE3_VLS_Temp: '53',
+    //     PRE1_MOT_Power: '351',
+    //     PRE1_CPR_LoadPre: '6.0',
+    //     PRE1_MOT_DrivingEndVibrationValid: '0.0',
+    //     PRE3_AlamSignal: '0',
+    //     PRE3_CPR_LoadPre: '6.5',
+    //     PRE2_CPR_LoadPre: '6.1',
+    //     PRE3_CPR_LoadorUnload: '1',
+    //     PRE1_MOT_PhaseCTemp: '27',
+    //     TotalOutPipePre: '5.75',
+    //     PRE1_CPR_CoolantTemp: '23',
+    //     PRE1_MOT_PhaseBTemp: '26',
+    //     PRE2_MOT_PhaseCTemp: '71',
+    //     PRE2_CPR_UnLoadPre: '7.2',
+    //     PRE3_HostTemp: '96',
+    //     PRE2_VLS_Temp: '49',
+    //     isRun: '-2',
+    //     PRE1_CPR_ExhaustTemp: '27',
+    //     TotalOutPipeFlow: '9999',
+    //   },
+    //   readDataDes: null,
+    //   summaryHour: [],
+    //   summaryDay: [],
+    //   history: [],
+    //   dayhistory: [],
+    //   totalInfo: null,
+    //   sign: null,
+    //   cameras: [],
+    //   links: [],
+    //   other1: null,
+    //   other2: null,
+    //   other3: null,
+    //   remarkInfo: null,
+    //   linkInfo: null,
+    // };
+
     if (dataSource) {
       Object.assign(monitorData.value, dataSource, dataSource.readData);
     }

src/views/vent/monitorManager/nitrogen/nitrogen.data.1.ts

@@ -73,6 +73,7 @@ export async function getMonitorData() {
     case 'sdmtjtcctrk': // 寸草2
       return await import('./nitrogen.dataCc_2');
     default: //默认
+      // return await import('./nitrogen.dataCc_2');
       return await import('./nitrogen.dataBet');
   }
 }

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

@@ -288,7 +288,7 @@
               tempData1.push(item);
             }
           });
-          dataSource.value = [...tempData, ...tempData1];
+          dataSource.value = [...tempData];
         } else {
           dataSource.value = dataArr;
         }

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

@@ -104,6 +104,7 @@
   import { list as baseList } from '../../deviceManager/sensorTabel/sensor.api';
   import { deviceList } from '../../deviceManager/comment/pointTabel/point.api';
   import { getTableHeaderColumns } from '/@/hooks/web/useWebColumns';
+  import { cloneDeep } from 'lodash-es';
 
   const SensorMonitorRef = ref();
   const deviceBaseList = ref([]);
@@ -194,16 +195,24 @@
 
     // 如果当前为监测tab
     if (activeKey.value === '1') {
-      const isHas = detailDataSource.value.find((item) => item['readTime'] === selectData['readTime']);
-      // 获取选中数据
-      if (!isHas) {
-        if (detailDataSource.value.length < 15) {
-          detailDataSource.value.push({ ...selectData });
-        } else {
-          detailDataSource.value.shift();
-          detailDataSource.value.push({ ...selectData });
-        }
+      // const isHas = detailDataSource.value.find((item) => item['readTime'] === selectData['readTime']);
+      // // 获取选中数据
+      // if (!isHas) {
+      //   if (detailDataSource.value.length < 15) {
+      //     detailDataSource.value.push({ ...selectData });
+      //   } else {
+      //     detailDataSource.value.shift();
+      //     detailDataSource.value.push({ ...selectData });
+      //   }
+      // }
+      const dataList = cloneDeep(detailDataSource.value);
+      if (dataList.length < 15) {
+        dataList.push({ ...selectData });
+      } else {
+        dataList.shift();
+        dataList.push({ ...selectData });
       }
+      detailDataSource.value = dataList;
     }
 
     if (loading.value) {

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

@@ -101,7 +101,17 @@
           </a-tab-pane> -->
           <a-tab-pane key="3" tab="历史数据">
             <div class="tab-item" v-if="activeKey === '3'">
-              <HistoryTable columns-type="window" device-type="window" designScope="window-history" :scroll="scroll" />
+              <HistoryTable columns-type="window" device-type="window" designScope="window-history" :scroll="scroll">
+                <template #filterCell="{ column, record }">
+                  <a-tag v-if="column.dataIndex === 'warnFlag'" :color="record.warnFlag == '0' ? 'green' : 'red'">{{
+                    record.warnFlag == '0' ? '正常' : '报警'
+                  }}</a-tag>
+                  <a-tag v-if="column.dataIndex === 'netStatus'" :color="record.netStatus == '0' ? 'default' : 'green'">{{
+                    record.netStatus == '0' ? '断开' : '连接'
+                  }}</a-tag>
+                  <div v-if="record.nwindownum == 1 && column.dataIndex === 'rearArea'">/</div>
+                </template>
+              </HistoryTable>
             </div>
           </a-tab-pane>
           <a-tab-pane key="4" tab="报警历史">

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

@@ -93,7 +93,7 @@
                 xAxisPropType="strname"
                 :dataSource="dataSource"
                 height="100%"
-                :chartsColumns="chartsColumns"
+                :chartsColumns="chartsColumnList"
                 :device-list-api="baseList"
                 device-type="windrect"
               />
@@ -103,9 +103,13 @@
             <div class="tab-item">
               <HistoryTable columns-type="windrect" device-type="windrect" designScope="windrect-history" :scroll="scroll">
                 <template #filterCell="{ column, record }">
-                  <a-tag v-if="column.dataIndex === 'warnFlag'" :color="record.warnFlag == '0' ? 'green' : record.warnFlag == 1 ? '#FF5812' : 'gray'">
-                    {{ record.warnFlag == '0' ? '正常' : record.warnFlag == 1 ? '报警' : record.warnFlag == 2 ? '断开' : '未监测' }}</a-tag
-                  >
+                  <a-tag v-if="column.dataIndex === 'warnFlag'" :color="record.warnFlag == '0' ? 'green' : 'red'">{{
+                    record.warnFlag == '0' ? '正常' : '报警'
+                  }}</a-tag>
+                  <a-tag v-if="column.dataIndex === 'netStatus'" :color="record.netStatus == '0' ? 'default' : 'green'">{{
+                    record.netStatus == '0' ? '断开' : '连接'
+                  }}</a-tag>
+                  <div v-if="record.nwindownum == 1 && column.dataIndex === 'rearArea'">/</div>
                 </template>
               </HistoryTable>
             </div>
@@ -184,7 +188,8 @@
   import { list, pathList, deviceList, testWind, exportXls } from './windrect.api';
   import { list as baseList } from '../../deviceManager/windfindingTabel/windfinding.api';
   import { message, Progress } from 'ant-design-vue';
-  import { chartsColumns } from './windrect.data';
+  import { chartsColumns, option } from './windrect.data';
+  import { getTableHeaderColumns } from '/@/hooks/web/useWebColumns';
   import { setDivHeight } from '/@/utils/event';
   import { BorderBox8 as DvBorderBox8 } from '@kjgl77/datav-vue3';
   import { useRouter } from 'vue-router';
@@ -228,6 +233,9 @@
     sensorLeft: 0,
   });
 
+  const chartsColumnArr = getTableHeaderColumns('windrect_chart');
+  const chartsColumnList = ref(chartsColumnArr.length > 0 ? chartsColumnArr : chartsColumns);
+
   // const dataSource = computed(() => {
   //   const data = [...getRecordList()] || [];
   //   Object.assign(selectData, toRaw(data[selectRowIndex.value]));

src/views/vent/monitorManager/windrectMonitor/windrect.data.ts

@@ -1,6 +1,8 @@
 import { BasicColumn } from '/@/components/Table';
 import { FormSchema } from '/@/components/Table';
 import { rules } from '/@/utils/helper/validator';
+import { reactive } from 'vue';
+
 export const resultColumns: BasicColumn[] = [
   // {
   //   title: '测风描述',
@@ -361,7 +363,7 @@ export const chartsColumns = [
     seriesName: 'm³/min',
     ymax: 10000,
     yname: 'm³/min',
-    linetype: 'bar',
+    linetype: 'line',
     yaxispos: 'left',
     color: '#3DF6FF',
     sort: 1,
@@ -373,35 +375,23 @@ export const chartsColumns = [
     seriesName: '(m/s)',
     ymax: 10,
     yname: 'm/s',
-    linetype: 'bar',
+    linetype: 'line',
     yaxispos: 'right',
     color: '#cd5fff',
     sort: 2,
     xRotate: 0,
     dataIndex: 'va',
   },
-  // {
-  //   legend: 'V3风速',
-  //   seriesName: '',
-  //   ymax: 20,
-  //   yname: 'm/min',
-  //   linetype: 'bar',
-  //   yaxispos: 'left',
-  //   color: '#fac858',
-  //   sort: 1,
-  //   xRotate: 0,
-  //   dataIndex: 'incipientWindSpeed3',
-  // },
-  // {
-  //   legend: '气源压力',
-  //   seriesName: '(MPa)',
-  //   ymax: 50,
-  //   yname: 'MPa',
-  //   linetype: 'line',
-  //   yaxispos: 'right',
-  //   color: '#fc8452',
-  //   sort: 2,
-  //   xRotate: 0,
-  //   dataIndex: 'sourcePressure',
-  // },
 ];
+
+export const option = {
+  xAxis: {
+    type: 'category',
+    boundaryGap: false,
+    axisLine: { lineStyle: { color: '#57617B' } },
+    axisLabel: { color: '#ffffffcc' },
+    splitLine: { show: true, lineStyle: { color: '#57617B22', type: 'dashed' } },
+    interval: 0,
+    rotate: 40,
+  },
+};

src/views/vent/performance/comment/DeviceModal.vue

@@ -78,7 +78,7 @@
             autosave: false, //是否自动保存
             forcesave: true, //定义保存按钮是否显示
             hideRightMenu: true,
-            spellcheck: false,//ture打开拼写检查，false关闭拼写检查。（默认为ture）
+            spellcheck: false, //ture打开拼写检查，false关闭拼写检查。（默认为ture）
           },
           //用户信息
           user: {