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

src/components/chart/BarAndLine.vue

@@ -23,7 +23,7 @@
       },
       chartsType: {
         type: String,
-        default: 'listMonitor',
+        default: '',
       },
       dataSource: {
         type: Array,

src/components/chart/BarSingle1.vue

@@ -68,7 +68,6 @@
       });
 
       function initChartsOption() {
-
         const optionUtil = new EchartsUtil(option);
         optionUtil.initChartOption('listMonitor', chartsColumns);
         console.log('option----------->', option);
@@ -77,8 +76,6 @@
       initChartsOption();
 
       function initCharts() {
-        
-
         //轴数据
         if (option.series) {
           const xAxisData: string[] = [];

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

@@ -190,6 +190,11 @@ export interface ModuleDataChart extends ReadFrom {
   sortBy?: string;
   /** 排序规则，desc降序，asc升序 */
   order?: 'desc' | 'asc';
+  /** 数据缩放组件的配置，每一项对应一项 xAxis 配置 */
+  dataZoom?: {
+    /** 数据轴允许展示的最大数据量，超长后出现数据缩放组件，配置后大部分图表会抬高以适配一个数据缩放组件 */
+    maxAxisLength: number;
+  }[];
   /** 图表x轴配置（若有），支持多个，注意至少一个 */
   xAxis: {
     show: boolean;

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

@@ -119,10 +119,11 @@
   let deviceData = ref<any>({}); //设备监测数据
   let navList = reactive([
     { name: '总回风量(m³/min)', isShow: true, valList: [] },
-    { name: '需风量(m³/min)', isShow: true, valList: [] },
+    { name: '总进风量(m³/min)', isShow: true, valList: [] },
+    { name: '计划风量(m³/min)', isShow: true, valList: [] },
     // { name: '有效风量(m³/min)', isShow: true, valList: [] },
-    { name: '等积孔(m²)', isShow: true, valList: [] },
-    { name: '外部漏风率', isShow: false, val: 0 },
+    // { name: '等积孔(m²)', isShow: true, valList: [] },
+    // { name: '外部漏风率', isShow: false, val: 0 },
     { name: '有效风量率', isShow: false, val: '0%' },
   ]);
   let nowTimeYear = ref('');
@@ -171,24 +172,27 @@
       //   xufengliang: '7232', // 有效风量
       //   zonghuifeng: '8188' // 总会风
       // }
+      // 总回
       navList[0].valList =
-        centerList && centerList.zongfengliang
-          ? centerList.zongfengliang.split('').map((el) => {
+        centerList && centerList.zonghuifeng
+          ? centerList.zonghuifeng.split('').map((el) => {
               return { val: el };
             })
           : [];
+      // 总进
       navList[1].valList =
-        centerList && centerList.xufengliang
-          ? centerList.xufengliang
+        centerList && centerList.zongjinfeng
+          ? centerList.zongjinfeng
               .toString()
               .split('')
               .map((el) => {
                 return { val: el };
               })
           : [];
+      // 计划风量
       navList[2].valList =
-        centerList && centerList.dengjikong
-          ? (Number(centerList.dengjikong) > 10 ? centerList.dengjikong.toFixed(2) : `0${centerList.dengjikong.toFixed(2)}`)
+        centerList && centerList.xufengliang
+          ? centerList.xufengliang
               .toString()
               .split('')
               .map((el) => {

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

@@ -31,7 +31,7 @@
     const inst = getInstance();
     const domWidth = inst ? inst.getWidth() : 500;
     // 依据每一个图表配置生成图表选项
-    const { yAxis = [], xAxis = [], legend, order, type, sortBy, series } = props.chartConfig;
+    const { yAxis = [], xAxis = [], legend, order, type, sortBy, series, dataZoom = [] } = props.chartConfig;
     const textStyle = {
       color: '#fff',
     };
@@ -68,6 +68,15 @@
       return res;
     }, []);
 
+    const baseDataZoom = dataZoom.map((e, i) => {
+      return {
+        type: 'slider',
+        show: get(baseSeries, '[0].data.length', 1) > e.maxAxisLength,
+        xAxisIndex: i,
+        end: e.maxAxisLength,
+      };
+    });
+
     if (type === 'pie') {
       return {
         textStyle,
@@ -105,7 +114,7 @@
         textStyle,
         grid: {
           top: 50,
-          bottom: 50,
+          bottom: dataZoom.length ? 70 : 50,
         },
         legend: {
           textStyle,
@@ -114,6 +123,7 @@
         tooltip: {
           trigger: 'item',
         },
+        dataZoom: baseDataZoom,
         xAxis: xAxis.map((e) => {
           return {
             ...e,
@@ -188,8 +198,9 @@
           left: 60,
           top: 40,
           right: 60,
-          bottom: 30,
+          bottom: dataZoom.length ? 70 : 30,
         },
+        dataZoom: baseDataZoom,
         xAxis: xAxis.map((e) => {
           return {
             ...e,
@@ -231,8 +242,9 @@
         grid: {
           left: 60,
           right: 60,
-          bottom: 30,
+          bottom: dataZoom.length ? 70 : 30,
         },
+        dataZoom: baseDataZoom,
         xAxis: xAxis.map((e) => {
           return {
             ...e,
@@ -274,8 +286,9 @@
           left: 50,
           top: 50,
           right: 50,
-          bottom: 50,
+          bottom: dataZoom.length ? 70 : 50,
         },
+        dataZoom: baseDataZoom,
         xAxis: xAxis.map((e) => {
           return {
             ...e,
@@ -329,9 +342,10 @@
           left: 40,
           top: 50,
           right: 40,
-          bottom: 10,
+          bottom: dataZoom.length ? 70 : 10,
           show: false,
         },
+        dataZoom: baseDataZoom,
         xAxis: xAxis.map((e) => {
           return {
             ...e,

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

@@ -1,11 +1,11 @@
 import { Config } from '../../deviceManager/configurationTable/types';
-import { BDdustMock, BDfireMock } from './configurable.data.bd';
+// import { BDdustMock, BDfireMock } from './configurable.data.bd';
 
 export const testConfigVent: Config[] = [
   {
     deviceType: 'fanmain',
     moduleName: '主通风机系统',
-    pageType: '',
+    pageType: 'vent',
     moduleData: {
       header: {
         show: true,
@@ -79,7 +79,7 @@ export const testConfigVent: Config[] = [
   {
     deviceType: 'fanlocal',
     moduleName: '局部通风机系统',
-    pageType: '',
+    pageType: 'vent',
     moduleData: {
       header: {
         show: true,
@@ -153,7 +153,7 @@ export const testConfigVent: Config[] = [
   {
     deviceType: '',
     moduleName: '通风设施远程控制',
-    pageType: '',
+    pageType: 'vent',
     moduleData: {
       header: {
         show: false,
@@ -194,7 +194,7 @@ export const testConfigVent: Config[] = [
   {
     deviceType: 'sys_wind',
     moduleName: '风量监测',
-    pageType: '',
+    pageType: 'vent',
     moduleData: {
       header: {
         show: false,
@@ -255,7 +255,7 @@ export const testConfigVent: Config[] = [
   {
     deviceType: 'sys_majorpath',
     moduleName: '关键通风路线',
-    pageType: '',
+    pageType: 'vent',
     moduleData: {
       header: {
         show: true,
@@ -334,7 +334,7 @@ export const testConfigVent: Config[] = [
   {
     deviceType: 'sys_surface_caimei',
     moduleName: '工作面智能监控',
-    pageType: '',
+    pageType: 'vent',
     moduleData: {
       header: {
         show: true,
@@ -416,7 +416,7 @@ export const testConfigVent: Config[] = [
   {
     deviceType: 'warn',
     moduleName: '预警监测',
-    pageType: '',
+    pageType: 'vent',
     moduleData: {
       header: {
         show: true,
@@ -502,7 +502,7 @@ export const testConfigDust: Config[] = [
   {
     deviceType: '',
     moduleName: '工作面风险监测',
-    pageType: '',
+    pageType: 'dust',
     moduleData: {
       header: {
         show: false,
@@ -611,7 +611,7 @@ export const testConfigDust: Config[] = [
         },
       ],
       preset: [],
-      mock: BDdustMock,
+      // mock: BDdustMock,
     },
     showStyle: {
       size: 'width:450px;height:860px;',
@@ -622,7 +622,7 @@ export const testConfigDust: Config[] = [
   {
     deviceType: 'dustDustGraph',
     moduleName: '综放工作面粉尘浓度',
-    pageType: '',
+    pageType: 'dust',
     moduleData: {
       header: {
         show: true,
@@ -674,7 +674,7 @@ export const testConfigDust: Config[] = [
       list: [],
       complex_list: [],
       preset: [],
-      mock: BDdustMock,
+      // mock: BDdustMock,
     },
     showStyle: {
       size: 'width:1000px;height:280px;',
@@ -685,7 +685,7 @@ export const testConfigDust: Config[] = [
   {
     deviceType: '',
     moduleName: '智能喷雾降尘装置',
-    pageType: '',
+    pageType: 'dust',
     moduleData: {
       header: {
         show: false,
@@ -749,7 +749,7 @@ export const testConfigDust: Config[] = [
       complex_list: [],
       preset: [],
       to: 'http://10.248.210.154:8801',
-      mock: BDdustMock,
+      // mock: BDdustMock,
     },
     showStyle: {
       size: 'width:450px;height:280px;',
@@ -760,7 +760,7 @@ export const testConfigDust: Config[] = [
   {
     deviceType: '',
     moduleName: '隔爆设施管理台账',
-    pageType: '',
+    pageType: 'dust',
     moduleData: {
       header: {
         show: false,
@@ -815,7 +815,7 @@ export const testConfigDust: Config[] = [
       list: [],
       complex_list: [],
       preset: [],
-      mock: BDdustMock,
+      // mock: BDdustMock,
     },
     showStyle: {
       size: 'width:450px;height:280px;',
@@ -826,7 +826,7 @@ export const testConfigDust: Config[] = [
   {
     deviceType: 'statics',
     moduleName: '粉尘静态指标',
-    pageType: '',
+    pageType: 'dust',
     moduleData: {
       header: {
         show: false,
@@ -882,7 +882,7 @@ export const testConfigDust: Config[] = [
       list: [],
       complex_list: [],
       preset: [],
-      mock: BDdustMock,
+      // mock: BDdustMock,
     },
     showStyle: {
       size: 'width:450px;height:280px;',
@@ -896,7 +896,7 @@ export const testConfigFire: Config[] = [
   {
     deviceType: 'fireManageInfo',
     moduleName: '重点区域风险监测',
-    pageType: '',
+    pageType: 'fire',
     moduleData: {
       header: {
         show: false,
@@ -977,7 +977,7 @@ export const testConfigFire: Config[] = [
         },
       ],
       preset: [],
-      mock: BDfireMock,
+      // mock: BDfireMock,
     },
     showStyle: {
       size: 'width:450px;height:425px;',
@@ -988,7 +988,7 @@ export const testConfigFire: Config[] = [
   {
     deviceType: 'pdArray',
     moduleName: '带式输送机防灭火监控系统',
-    pageType: '',
+    pageType: 'fire',
     moduleData: {
       header: {
         show: true,
@@ -1051,7 +1051,7 @@ export const testConfigFire: Config[] = [
           series: [
             {
               label: '${strinstallpos}',
-              readFrom: 'fibreTemperatureArr',
+              readFrom: 'fibreTemperature',
               xprop: 'pos',
               yprop: 'value',
             },
@@ -1064,7 +1064,7 @@ export const testConfigFire: Config[] = [
       list: [],
       complex_list: [],
       preset: [],
-      mock: BDfireMock,
+      // mock: BDfireMock,
     },
     showStyle: {
       size: 'width:450px;height:425px;',
@@ -1075,7 +1075,7 @@ export const testConfigFire: Config[] = [
   {
     deviceType: 'sgGxObj',
     moduleName: '工作面光纤监测',
-    pageType: '',
+    pageType: 'fire',
     moduleData: {
       header: {
         show: true,
@@ -1114,7 +1114,7 @@ export const testConfigFire: Config[] = [
           series: [
             {
               label: '${strinstallpos}',
-              readFrom: 'fibreTemperatureArr',
+              readFrom: 'fibreTemperature',
               xprop: 'pos',
               yprop: 'value',
             },
@@ -1127,7 +1127,7 @@ export const testConfigFire: Config[] = [
       list: [],
       complex_list: [],
       preset: [],
-      mock: BDfireMock,
+      // mock: BDfireMock,
     },
     showStyle: {
       size: 'width:1000px;height:280px;',
@@ -1138,7 +1138,7 @@ export const testConfigFire: Config[] = [
   {
     deviceType: 'sgGxObj',
     moduleName: '工作面束管监测',
-    pageType: '',
+    pageType: 'fire',
     moduleData: {
       header: {
         show: true,
@@ -1319,7 +1319,7 @@ export const testConfigFire: Config[] = [
           readFrom: '',
         },
       ],
-      mock: BDfireMock,
+      // mock: BDfireMock,
     },
     showStyle: {
       size: 'width:450px;height:570px;',
@@ -1330,7 +1330,7 @@ export const testConfigFire: Config[] = [
   {
     deviceType: 'aqjkArray',
     moduleName: '安全监控系统',
-    pageType: '',
+    pageType: 'fire',
     moduleData: {
       header: {
         show: false,
@@ -1389,7 +1389,7 @@ export const testConfigFire: Config[] = [
       list: [],
       complex_list: [],
       preset: [],
-      mock: BDfireMock,
+      // mock: BDfireMock,
     },
     showStyle: {
       size: 'width:450px;height:280px;',

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

@@ -75,6 +75,7 @@
   // import { useRoute } from 'vue-router';
   import VentModal from '/@/components/vent/micro/ventModal.vue';
   import { getHomeData } from './configurable.api';
+  import { BDDustMock } from './mock';
   // import { testConfigDust } from './configurable.data';
 
   const { configs, isOriginal, isCommon, fetchConfigs } = useInitConfigs();
@@ -86,11 +87,12 @@
       // configs.value = testConfigDust;
       updateEnhancedConfigs(configs.value);
 
-      getHomeData({}).then(updateData);
+      Promise.resolve(BDDustMock).then(updateData);
+      // getHomeData({}).then(updateData);
     });
-    setInterval(() => {
-      getHomeData({}).then(updateData);
-    }, 60000);
+    // setInterval(() => {
+    //   getHomeData({}).then(updateData);
+    // }, 60000);
   });
 
   onUnmounted(() => {

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

@@ -75,6 +75,7 @@
   // import { useRoute } from 'vue-router';
   import VentModal from '/@/components/vent/micro/ventModal.vue';
   import { getHomeData } from './configurable.api';
+  import { BDFireMock } from './mock';
   // import { testConfigFire } from './configurable.data';
 
   const { configs, isOriginal, isCommon, fetchConfigs } = useInitConfigs();
@@ -86,11 +87,12 @@
       // configs.value = testConfigFire;
       updateEnhancedConfigs(configs.value);
 
-      getHomeData({}).then(updateData);
+      Promise.resolve(BDFireMock).then(updateData);
+      // getHomeData({}).then(updateData);
     });
-    setInterval(() => {
-      getHomeData({}).then(updateData);
-    }, 60000);
+    // setInterval(() => {
+    //   getHomeData({}).then(updateData);
+    // }, 60000);
   });
 
   onUnmounted(() => {

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

@@ -116,7 +116,7 @@
     const indexColumn = {
       title: '序号',
       dataIndex: 'key',
-      width: 120,
+      width: 80,
       align: 'center',
       customCell: (_, index) => {
         if (index % 2 == 0) {
@@ -168,7 +168,7 @@
 
     columns.value.splice(1, 0, runDevice);
     if (props.isShowSelect) {
-      columns.value = [isCheckColumn, ...columns.value];
+      columns.value = [isCheckColumn, indexColumn, ...columns.value];
     } else {
       columns.value = [indexColumn, ...columns.value];
     }

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

@@ -240,7 +240,6 @@
                 :dataSource="echartData"
                 height="300px"
                 :chartsColumns="chartsColumns"
-                chartsType="listMonitor"
                 :option="echatsOption"
               />
             </template>

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

@@ -107,7 +107,6 @@
                 :dataSource="echartData"
                 height="340px"
                 :chartsColumns="chartsColumns"
-                chartsType="listMonitor"
                 :option="echatsOption"
               />
               <!-- :option="zhudanOption" -->

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

@@ -165,7 +165,6 @@
                 :dataSource="echartData"
                 height="320px"
                 :chartsColumns="chartsColumns"
-                chartsType="listMonitor"
                 :option="echatsOption"
               />
             </template>

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

@@ -122,7 +122,6 @@
                 :dataSource="echartData"
                 height="340px"
                 :chartsColumns="chartsColumns"
-                chartsType="listMonitor"
                 :option="echatsOption"
               />
             </template>

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

@@ -77,7 +77,6 @@
                 :dataSource="echartData"
                 height="340px"
                 :chartsColumns="chartsColumns"
-                chartsType="listMonitor"
                 :option="echatsOption"
               />
             </template>

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

@@ -194,7 +194,7 @@
               <!-- 工作面echarts图标 -->
               <BarAndLine v-if="activeKey == '1' && deviceType == 'surface_history'" class="echarts-line"
                 xAxisPropType="time" :dataSource="surfaceEchartsData" height="300px"
-                :chartsColumns="surfaceChartsColumns" :option="echatsOption" chartsType="listMonitor" />
+                :chartsColumns="surfaceChartsColumns" :option="echatsOption" />
               <MonitorTable v-else-if="activeKey == '1'" ref="monitorTable" :columnsType="`${deviceType}_monitor`"
                 :dataSource="dataSource" design-scope="device_monitor" :isShowActionColumn="true" :isShowSelect="false"
                 title="设备监测" :scroll="{ y: scroll.y - 30 }">
@@ -737,7 +737,11 @@ async function getDataSource() {
 }
 
 function goLocation(record) {
-  actions.setGlobalState({ locationId: record.deviceID, locationObj: null, pageObj: null });
+  if(record['deviceType'] == 'person_bd' || record['deviceType'] == 'car_bd'){
+    actions.setGlobalState({ locationId: record.devNum, locationObj: null, pageObj: null });
+  }else{
+    actions.setGlobalState({ locationId: record.deviceID, locationObj: null, pageObj: null });
+  }
 }
 
 function goDetail(record?) {

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

@@ -176,14 +176,7 @@
         <div class="right-bottom">
           <span class="base-title">实时数据监测曲线</span>
           <div class="echarts-box">
-            <BarAndLine
-              xAxisPropType="time"
-              :dataSource="posList"
-              height="100%"
-              :chartsColumns="chartsColumns"
-              :option="echatsOption"
-              chartsType="listMonitor"
-            />
+            <BarAndLine xAxisPropType="time" :dataSource="posList" height="100%" :chartsColumns="chartsColumns" :option="echatsOption" />
           </div>
         </div>
       </div>

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

@@ -223,7 +223,6 @@
               width="100%"
               :chartsColumns="chartsColumns"
               :option="echatsOption"
-              chartsType="listMonitor"
             />
           </div>
         </div>

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

@@ -1,10 +1,21 @@
 <template>
-  <BasicModal v-bind="$attrs" @register="register" :title="`束管监测详情 ${currentTime}`" width="1200px" @ok="handleOk"
-    @cancel="handleCancel" wrapClassName="bundle-modal">
+  <BasicModal
+    v-bind="$attrs"
+    @register="register"
+    :title="`束管监测详情 ${currentTime}`"
+    width="1200px"
+    @ok="handleOk"
+    @cancel="handleCancel"
+    wrapClassName="bundle-modal"
+  >
     <div class="fiber-modal">
       <div class="modal-left">
-        <div v-for="device in deviceList" class="link-item"
-          :class="{ 'active-device-title': device.deviceID === activeDeviceID }" :key="device.deviceID">
+        <div
+          v-for="device in deviceList"
+          class="link-item"
+          :class="{ 'active-device-title': device.deviceID === activeDeviceID }"
+          :key="device.deviceID"
+        >
           <span class="" @click="selectDevice(device.deviceID)">{{ device.strinstallpos }}</span>
         </div>
       </div>
@@ -17,8 +28,7 @@
             </div>
             <div class="item-container">
               <div class="title">一氧化碳</div>
-              <div class="value">{{ posMonitor.coval !== undefined && posMonitor.coval !== null ? posMonitor.coval : '-'
-                }} <span>ppm</span> </div>
+              <div class="value">{{ posMonitor.coval !== undefined && posMonitor.coval !== null ? posMonitor.coval : '-' }} <span>ppm</span> </div>
             </div>
           </div>
           <div class="top-item">
@@ -27,8 +37,7 @@
             </div>
             <div class="item-container">
               <div class="title">二氧化碳</div>
-              <div class="value">{{ posMonitor.co2val !== undefined && posMonitor.co2val !== null ? posMonitor.co2val :
-                '-' }} <span>%</span></div>
+              <div class="value">{{ posMonitor.co2val !== undefined && posMonitor.co2val !== null ? posMonitor.co2val : '-' }} <span>%</span></div>
             </div>
           </div>
           <div class="top-item">
@@ -37,8 +46,7 @@
             </div>
             <div class="item-container">
               <div class="title">甲烷</div>
-              <div class="value">{{ posMonitor.gasval !== undefined && posMonitor.gasval !== null ? posMonitor.gasval :
-                '-' }} <span>%</span></div>
+              <div class="value">{{ posMonitor.gasval !== undefined && posMonitor.gasval !== null ? posMonitor.gasval : '-' }} <span>%</span></div>
             </div>
           </div>
           <div class="top-item">
@@ -47,8 +55,7 @@
             </div>
             <div class="item-container">
               <div class="title">乙烯</div>
-              <div class="value">{{ posMonitor.ch2val !== undefined && posMonitor.ch2val !== null ? posMonitor.ch2val :
-                '-' }} <span>ppm</span></div>
+              <div class="value">{{ posMonitor.ch2val !== undefined && posMonitor.ch2val !== null ? posMonitor.ch2val : '-' }} <span>ppm</span></div>
             </div>
           </div>
           <div class="top-item">
@@ -57,8 +64,7 @@
             </div>
             <div class="item-container">
               <div class="title">乙炔</div>
-              <div class="value">{{ posMonitor.chval !== undefined && posMonitor.chval !== null ? posMonitor.chval : '-'
-                }} <span>ppm</span></div>
+              <div class="value">{{ posMonitor.chval !== undefined && posMonitor.chval !== null ? posMonitor.chval : '-' }} <span>ppm</span></div>
             </div>
           </div>
           <div class="top-item">
@@ -67,8 +73,7 @@
             </div>
             <div class="item-container">
               <div class="title">氧气</div>
-              <div class="value">{{ posMonitor.o2val !== undefined && posMonitor.o2val !== null ? posMonitor.o2val : '-'
-                }} <span>%</span></div>
+              <div class="value">{{ posMonitor.o2val !== undefined && posMonitor.o2val !== null ? posMonitor.o2val : '-' }} <span>%</span></div>
             </div>
           </div>
           <div class="top-item warning-box">
@@ -77,11 +82,14 @@
             </div>
             <div class="item-container">
               <div class="title">风险等级</div>
-              <div :class="{
-                value1: posMonitor['syswarnLevel_str'] == '绿色预警',
-                value2: posMonitor['syswarnLevel_str'] == '黄色预警',
-                value3: posMonitor['syswarnLevel_str'] == '红色预警',
-              }">{{ posMonitor['syswarnLevel_str'] || '-' }}</div>
+              <div
+                :class="{
+                  value1: posMonitor['syswarnLevel_str'] == '绿色预警',
+                  value2: posMonitor['syswarnLevel_str'] == '黄色预警',
+                  value3: posMonitor['syswarnLevel_str'] == '红色预警',
+                }"
+                >{{ posMonitor['syswarnLevel_str'] || '-' }}</div
+              >
             </div>
           </div>
           <div class="top-item warning-box">
@@ -94,13 +102,21 @@
             </div>
           </div>
         </div>
-        <div style="width: 100%;display: flex">
+        <div style="width: 100%; display: flex">
           <div class="right-bottom">
-            <span class="base-title">设备监测曲线&nbsp; <span style="color: red">{{ posMonitor['netStatus'] != 1 ? '(设备未连接)' :
-                '' }}</span></span>
+            <span class="base-title"
+              >设备监测曲线&nbsp; <span style="color: red">{{ posMonitor['netStatus'] != 1 ? '(设备未连接)' : '' }}</span></span
+            >
             <div class="echarts-box">
-              <BarAndLine class="echarts-line" :xAxisPropType="xAxisPropType" :dataSource="historyList" height="100%"
-                width="100%" :chartsColumns="chartsColumns" :option="echatsOption" chartsType="listMonitor" />
+              <BarAndLine
+                class="echarts-line"
+                :xAxisPropType="xAxisPropType"
+                :dataSource="historyList"
+                height="100%"
+                width="100%"
+                :chartsColumns="chartsColumns"
+                :option="echatsOption"
+              />
             </div>
           </div>
           <div class="right-bottom1">
@@ -110,444 +126,443 @@
             </div>
           </div>
         </div>
-
       </div>
     </div>
   </BasicModal>
 </template>
 <script lang="ts">
-import { defineComponent, ref, watch, shallowRef, onMounted } from 'vue';
-import { BasicModal, useModalInner } from '/@/components/Modal';
-import BarAndLine from '/@/components/chart/BarAndLine.vue';
-import blastDelta from './blastDelta.vue';
-import { SvgIcon } from '/@/components/Icon';
-import dayjs from 'dayjs';
-import { getTableHeaderColumns } from '/@/hooks/web/useWebColumns';
-import { chartsColumnList } from '../device.data';
-import { listdays, getHistoryData } from '../device.api';
-
-export default defineComponent({
-  components: { BasicModal, BarAndLine, SvgIcon, blastDelta },
-  props: {
-    dataSource: { type: Array },
-    activeID: { type: String },
-  },
-  setup(props) {
-    const currentTime = ref(dayjs().format('YYYY-MM-DD HH:mm:ss'));
-    const modelRef = ref({});
-    const loading = ref(true);
-    const activeDeviceID = ref('');
-    const deviceList = ref<any[]>([]);
-    const historyList = ref<any[]>([]);
-    const posList = ref<any[]>([]);
-    const posMonitor = shallowRef({});
-
-    const echatsOption = {
-      grid: {
-        top: '29%',
-        left: '3',
-        right: '20',
-        bottom: '3%',
-        containLabel: true,
-      },
-      toolbox: {
-        feature: null,
-      },
-    };
-
-    const chartsColumnArr = getTableHeaderColumns('bundletube_chart');
-    const chartsColumns = chartsColumnArr.length > 0 ? chartsColumnArr : chartsColumnList;
-    const xAxisPropType = ref('ttime');
-    const [register, { setModalProps, closeModal }] = useModalInner();
-
-    function handleVisibleChange(visible) {
-      if (visible) {
+  import { defineComponent, ref, watch, shallowRef, onMounted } from 'vue';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import BarAndLine from '/@/components/chart/BarAndLine.vue';
+  import blastDelta from './blastDelta.vue';
+  import { SvgIcon } from '/@/components/Icon';
+  import dayjs from 'dayjs';
+  import { getTableHeaderColumns } from '/@/hooks/web/useWebColumns';
+  import { chartsColumnList } from '../device.data';
+  import { listdays, getHistoryData } from '../device.api';
+
+  export default defineComponent({
+    components: { BasicModal, BarAndLine, SvgIcon, blastDelta },
+    props: {
+      dataSource: { type: Array },
+      activeID: { type: String },
+    },
+    setup(props) {
+      const currentTime = ref(dayjs().format('YYYY-MM-DD HH:mm:ss'));
+      const modelRef = ref({});
+      const loading = ref(true);
+      const activeDeviceID = ref('');
+      const deviceList = ref<any[]>([]);
+      const historyList = ref<any[]>([]);
+      const posList = ref<any[]>([]);
+      const posMonitor = shallowRef({});
+
+      const echatsOption = {
+        grid: {
+          top: '29%',
+          left: '3',
+          right: '20',
+          bottom: '3%',
+          containLabel: true,
+        },
+        toolbox: {
+          feature: null,
+        },
+      };
+
+      const chartsColumnArr = getTableHeaderColumns('bundletube_chart');
+      const chartsColumns = chartsColumnArr.length > 0 ? chartsColumnArr : chartsColumnList;
+      const xAxisPropType = ref('ttime');
+      const [register, { setModalProps, closeModal }] = useModalInner();
+
+      function handleVisibleChange(visible) {
+        if (visible) {
+          loading.value = true;
+          setModalProps({ loading: true, confirmLoading: true });
+
+          setTimeout(() => {
+            loading.value = false;
+            setModalProps({ loading: false, confirmLoading: false });
+          }, 1000);
+        }
+      }
+
+      // 选择监测
+      function selectDevice(id) {
         loading.value = true;
         setModalProps({ loading: true, confirmLoading: true });
-
         setTimeout(() => {
           loading.value = false;
+          activeDeviceID.value = id;
           setModalProps({ loading: false, confirmLoading: false });
-        }, 1000);
+        }, 300);
+        getListdays();
       }
-    }
 
-    // 选择监测
-    function selectDevice(id) {
-      loading.value = true;
-      setModalProps({ loading: true, confirmLoading: true });
-      setTimeout(() => {
-        loading.value = false;
-        activeDeviceID.value = id;
-        setModalProps({ loading: false, confirmLoading: false });
-      }, 300);
-      getListdays();
-    }
-
-    function handleOk(e) {
-      e.preventDefault();
-      closeModal();
-    }
+      function handleOk(e) {
+        e.preventDefault();
+        closeModal();
+      }
 
-    function handleCancel(e) {
-      e.preventDefault();
-      closeModal();
-    }
+      function handleCancel(e) {
+        e.preventDefault();
+        closeModal();
+      }
 
-    //获取历史数据
-    async function getListdays() {
-      if (posMonitor.value.stationtype && posMonitor.value.stationtype != 'redis') {
-        xAxisPropType.value = 'ttime';
-        const ttime_begin = dayjs().startOf('date').format('YYYY-MM-DD HH:mm:ss');
-        const ttime_end = dayjs().format('YYYY-MM-DD HH:mm:ss');
-        const pageNo = 1;
-        const pageSize = 100;
-        const skip = 8;
-        const strtype = posMonitor.value.deviceType;
-        let res = await listdays({
-          ttime_begin,
-          ttime_end,
-          pageNo,
-          pageSize,
-          skip,
-          strtype,
-          column: 'createTime',
-          gdeviceid: activeDeviceID.value,
-        });
-        console.log(res, '束管历史数据');
-        let data = res.datalist.records;
-        if (data.length != 0) {
-          data.forEach((el) => {
-            Object.assign(el, el.readData);
-          });
-        }
-        historyList.value = data;
-      } else {
-        const params = {
-          pageNum: 1,
-          pageSize: 100,
-          startTime: dayjs(new Date().getTime() - 3 * 24 * 60 * 60 * 1000).format('YYYY-MM-DD HH:mm:ss'),
-          endTime: dayjs(new Date().getTime()).format('YYYY-MM-DD HH:mm:ss'),
-          deviceId: activeDeviceID.value,
-          interval: '1h',
-          isEmployee: true,
-        };
-        xAxisPropType.value = 'time';
-        const result = await getHistoryData({ ...params });
-        if (result['records'].length != 0) {
-          result['records'].forEach((el) => {
-            el.ch2val = el.C2H4;
-            el.chval = el.C2H2;
-            el.co2val = el.CO2;
-            el.coval = el.CO;
-            el.gasval = el.CH4;
-            el.o2val = el.O2;
+      //获取历史数据
+      async function getListdays() {
+        if (posMonitor.value.stationtype && posMonitor.value.stationtype != 'redis') {
+          xAxisPropType.value = 'ttime';
+          const ttime_begin = dayjs().startOf('date').format('YYYY-MM-DD HH:mm:ss');
+          const ttime_end = dayjs().format('YYYY-MM-DD HH:mm:ss');
+          const pageNo = 1;
+          const pageSize = 100;
+          const skip = 8;
+          const strtype = posMonitor.value.deviceType;
+          let res = await listdays({
+            ttime_begin,
+            ttime_end,
+            pageNo,
+            pageSize,
+            skip,
+            strtype,
+            column: 'createTime',
+            gdeviceid: activeDeviceID.value,
           });
+          console.log(res, '束管历史数据');
+          let data = res.datalist.records;
+          if (data.length != 0) {
+            data.forEach((el) => {
+              Object.assign(el, el.readData);
+            });
+          }
+          historyList.value = data;
+        } else {
+          const params = {
+            pageNum: 1,
+            pageSize: 100,
+            startTime: dayjs(new Date().getTime() - 3 * 24 * 60 * 60 * 1000).format('YYYY-MM-DD HH:mm:ss'),
+            endTime: dayjs(new Date().getTime()).format('YYYY-MM-DD HH:mm:ss'),
+            deviceId: activeDeviceID.value,
+            interval: '1h',
+            isEmployee: true,
+          };
+          xAxisPropType.value = 'time';
+          const result = await getHistoryData({ ...params });
+          if (result['records'].length != 0) {
+            result['records'].forEach((el) => {
+              el.ch2val = el.C2H4;
+              el.chval = el.C2H2;
+              el.co2val = el.CO2;
+              el.coval = el.CO;
+              el.gasval = el.CH4;
+              el.o2val = el.O2;
+            });
+          }
+          historyList.value = result['records'];
         }
-        historyList.value = result['records'];
       }
-    }
 
-    watch(
-      [() => props.dataSource, () => props.activeID],
-      ([newDataSource, newActiveID], [oldDataSource, oldActiveID]) => {
-        // if (newActiveID != oldActiveID) {
-        //   activeDeviceID.value = newActiveID as string;
-        // }
-        activeDeviceID.value = activeDeviceID.value ? activeDeviceID.value : newActiveID;
-        deviceList.value = newDataSource?.filter((item: any, index) => {
-          if ((!activeDeviceID.value && index == 0) || item.deviceID === activeDeviceID.value) {
-            // activeDeviceID.value = item.deviceID;
-            posMonitor.value = Object.assign(item, item.readData);
-          }
-          item.readTime = item.readTime?.substring(11);
-          return item;
-        });
-      },
-      { immediate: true }
-    );
-    onMounted(() => {
-      getListdays();
-    });
-    return {
-      register,
-      model: modelRef,
-      currentTime,
-      handleVisibleChange,
-      selectDevice,
-      handleOk,
-      handleCancel,
-      deviceList,
-      historyList,
-      activeDeviceID,
-      posMonitor,
-      echatsOption,
-      posList,
-      chartsColumns,
-      xAxisPropType,
-    };
-  },
-});
+      watch(
+        [() => props.dataSource, () => props.activeID],
+        ([newDataSource, newActiveID], [oldDataSource, oldActiveID]) => {
+          // if (newActiveID != oldActiveID) {
+          //   activeDeviceID.value = newActiveID as string;
+          // }
+          activeDeviceID.value = activeDeviceID.value ? activeDeviceID.value : newActiveID;
+          deviceList.value = newDataSource?.filter((item: any, index) => {
+            if ((!activeDeviceID.value && index == 0) || item.deviceID === activeDeviceID.value) {
+              // activeDeviceID.value = item.deviceID;
+              posMonitor.value = Object.assign(item, item.readData);
+            }
+            item.readTime = item.readTime?.substring(11);
+            return item;
+          });
+        },
+        { immediate: true }
+      );
+      onMounted(() => {
+        getListdays();
+      });
+      return {
+        register,
+        model: modelRef,
+        currentTime,
+        handleVisibleChange,
+        selectDevice,
+        handleOk,
+        handleCancel,
+        deviceList,
+        historyList,
+        activeDeviceID,
+        posMonitor,
+        echatsOption,
+        posList,
+        chartsColumns,
+        xAxisPropType,
+      };
+    },
+  });
 </script>
 <style lang="less">
-.bundle-modal {
-  .zxm-modal {
-    top: 30px !important;
+  .bundle-modal {
+    .zxm-modal {
+      top: 30px !important;
+    }
   }
-}
 </style>
 
 <style lang="less" scoped>
-.fiber-modal {
-  width: 100%;
-  height: 650px;
-  display: flex;
-  flex-direction: row;
-  justify-content: space-between;
-
-  .modal-left {
-    width: 200px;
-    height: 100%;
-    overflow-y: auto;
-    background: #ffffff11;
-    padding: 5px;
-    border-radius: 5px;
-
-    .active-device-title {
-      color: aqua;
-    }
+  .fiber-modal {
+    width: 100%;
+    height: 650px;
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+
+    .modal-left {
+      width: 200px;
+      height: 100%;
+      overflow-y: auto;
+      background: #ffffff11;
+      padding: 5px;
+      border-radius: 5px;
+
+      .active-device-title {
+        color: aqua;
+      }
 
-    .link-item {
-      position: relative;
-      cursor: pointer;
-      line-height: 30px;
-      padding-left: 30px;
+      .link-item {
+        position: relative;
+        cursor: pointer;
+        line-height: 30px;
+        padding-left: 30px;
 
-      span:hover {
-        color: #89ffff;
-      }
+        span:hover {
+          color: #89ffff;
+        }
 
-      &::after {
-        content: '';
-        position: absolute;
-        display: block;
-        width: 8px;
-        height: 8px;
-        top: 12px;
-        left: 10px;
-        transform: rotateZ(45deg) skew(10deg, 10deg);
-        background: #45d3fd;
+        &::after {
+          content: '';
+          position: absolute;
+          display: block;
+          width: 8px;
+          height: 8px;
+          top: 12px;
+          left: 10px;
+          transform: rotateZ(45deg) skew(10deg, 10deg);
+          background: #45d3fd;
+        }
       }
     }
-  }
 
-  .modal-right {
-    width: calc(100% - 220px);
-    overflow-y: auto;
-
-    .base-title {
-      line-height: 32px;
-      position: relative;
-      padding-left: 20px;
-
-      &::after {
-        content: '';
-        position: absolute;
-        display: block;
-        width: 4px;
-        height: 12px;
-        top: 4px;
-        left: 10px;
-        background: #45d3fd;
-        border-radius: 4px;
-      }
-    }
+    .modal-right {
+      width: calc(100% - 220px);
+      overflow-y: auto;
+
+      .base-title {
+        line-height: 32px;
+        position: relative;
+        padding-left: 20px;
 
-    .right-top {
-      display: flex;
-      flex-direction: row;
-      justify-content: space-between;
-      flex-wrap: wrap;
-      margin-bottom: 10px;
+        &::after {
+          content: '';
+          position: absolute;
+          display: block;
+          width: 4px;
+          height: 12px;
+          top: 4px;
+          left: 10px;
+          background: #45d3fd;
+          border-radius: 4px;
+        }
+      }
 
-      .top-item {
-        width: 220px;
-        height: 100px;
+      .right-top {
         display: flex;
         flex-direction: row;
-        justify-content: center;
-        border: 1px solid rgba(25, 237, 255, 0.4);
-        box-shadow: inset 0 0 10px rgba(0, 197, 255, 0.6);
-        background: rgba(0, 0, 0, 0.06666666666666667);
-        padding-top: 20px;
-        margin: 10px 0;
-
-        .icon {
-          margin-right: 10px;
-          margin-top: 5px;
-          color: #fdb146;
-        }
+        justify-content: space-between;
+        flex-wrap: wrap;
+        margin-bottom: 10px;
 
-        .item-container {
-          width: 110px;
+        .top-item {
+          width: 220px;
+          height: 100px;
           display: flex;
-          flex-direction: column;
+          flex-direction: row;
           justify-content: center;
-
-          div {
-            text-align: center;
+          border: 1px solid rgba(25, 237, 255, 0.4);
+          box-shadow: inset 0 0 10px rgba(0, 197, 255, 0.6);
+          background: rgba(0, 0, 0, 0.06666666666666667);
+          padding-top: 20px;
+          margin: 10px 0;
+
+          .icon {
+            margin-right: 10px;
+            margin-top: 5px;
+            color: #fdb146;
           }
 
-          .title {
-            font-size: 18px;
-          }
+          .item-container {
+            width: 110px;
+            display: flex;
+            flex-direction: column;
+            justify-content: center;
 
-          .value {
-            text-shadow: 0 0 25px #00fbfe;
-            background: linear-gradient(0deg, #45d3fd, #45d3fd, #61ddb1, #61ddb1);
-            font-style: normal;
-            background-size: cover;
-            font-family: electronicFont;
-            font-size: 30px;
-            -webkit-background-clip: text;
-            background-clip: text;
-            -webkit-text-fill-color: transparent;
-            position: relative;
-            top: -8px;
-
-            span {
-              font-family: Arial, Helvetica, sans-serif;
+            div {
+              text-align: center;
+            }
+
+            .title {
               font-size: 18px;
-              color: aliceblue;
+            }
+
+            .value {
+              text-shadow: 0 0 25px #00fbfe;
+              background: linear-gradient(0deg, #45d3fd, #45d3fd, #61ddb1, #61ddb1);
+              font-style: normal;
+              background-size: cover;
+              font-family: electronicFont;
+              font-size: 30px;
+              -webkit-background-clip: text;
+              background-clip: text;
+              -webkit-text-fill-color: transparent;
+              position: relative;
+              top: -8px;
+
+              span {
+                font-family: Arial, Helvetica, sans-serif;
+                font-size: 18px;
+                color: aliceblue;
+              }
             }
           }
         }
-      }
 
-      .warning-box {
-        padding-top: 0px;
+        .warning-box {
+          padding-top: 0px;
 
-        .icon {
-          margin-top: 20px;
+          .icon {
+            margin-top: 20px;
 
-          :deep(.icon-style) {
-            width: auto;
-            color: #fdb146;
+            :deep(.icon-style) {
+              width: auto;
+              color: #fdb146;
+            }
           }
-        }
 
-        .warning-value {
-          font-size: 18px;
-          color: #61ddb1;
-        }
+          .warning-value {
+            font-size: 18px;
+            color: #61ddb1;
+          }
 
-        .value1 {
-          font-size: 18px;
-          color: rgb(145, 230, 9) !important;
-        }
+          .value1 {
+            font-size: 18px;
+            color: rgb(145, 230, 9) !important;
+          }
 
-        .value2 {
-          font-size: 18px;
-          // color: rgb(0, 242, 255) !important;
-          color: #ffff35 !important;
-        }
+          .value2 {
+            font-size: 18px;
+            // color: rgb(0, 242, 255) !important;
+            color: #ffff35 !important;
+          }
 
-        .value3 {
-          font-size: 18px;
-          // color: #ffff35 !important;
-          color: #ff0000 !important;
-        }
+          .value3 {
+            font-size: 18px;
+            // color: #ffff35 !important;
+            color: #ff0000 !important;
+          }
 
-        .value4 {
-          font-size: 18px;
-          color: #ffbe69 !important;
-        }
+          .value4 {
+            font-size: 18px;
+            color: #ffbe69 !important;
+          }
 
-        .value5 {
-          font-size: 18px;
-          color: #ff6f00 !important;
-        }
+          .value5 {
+            font-size: 18px;
+            color: #ff6f00 !important;
+          }
 
-        .value6 {
-          font-size: 18px;
-          color: #ff0000 !important;
+          .value6 {
+            font-size: 18px;
+            color: #ff0000 !important;
+          }
         }
       }
-    }
 
-    .right-center {
-      margin-top: 20px;
-      display: flex;
-      flex-direction: row;
-      justify-content: space-between;
+      .right-center {
+        margin-top: 20px;
+        display: flex;
+        flex-direction: row;
+        justify-content: space-between;
 
-      .table-box {
-        position: relative;
-        width: 500px;
-        height: 250px;
-      }
+        .table-box {
+          position: relative;
+          width: 500px;
+          height: 250px;
+        }
 
-      .warning-box {
-        width: calc(100% - 520px);
+        .warning-box {
+          width: calc(100% - 520px);
 
-        .warning-container {
-          width: 100%;
-          height: convert;
-          background: #009acd00;
+          .warning-container {
+            width: 100%;
+            height: convert;
+            background: #009acd00;
 
-          :deep(.dv-scroll-board) {
-            .row-item {
-              height: 40px !important;
-              line-height: 40px !important;
-            }
+            :deep(.dv-scroll-board) {
+              .row-item {
+                height: 40px !important;
+                line-height: 40px !important;
+              }
 
-            .header-item {
-              border-top: 1px solid #91e9fe !important;
-              border-bottom: 1px solid #91e9fe !important;
+              .header-item {
+                border-top: 1px solid #91e9fe !important;
+                border-bottom: 1px solid #91e9fe !important;
+              }
             }
           }
         }
       }
-    }
-
-    .right-bottom {
-      width: 58%;
-      margin-top: 10px;
 
-      .echarts-box {
-        width: 100%;
-        height: 320px;
-        position: relative;
-        // display: flex;
-        // justify-content: space-between;
+      .right-bottom {
+        width: 58%;
+        margin-top: 10px;
 
-        .echarts-line {
-          width: calc(100% + 80px);
-          position: absolute;
+        .echarts-box {
+          width: 100%;
+          height: 320px;
+          position: relative;
+          // display: flex;
+          // justify-content: space-between;
+
+          .echarts-line {
+            width: calc(100% + 80px);
+            position: absolute;
+          }
         }
       }
-    }
 
-    .right-bottom1 {
-      width: 42%;
-      margin-top: 10px;
-      .echarts-box {
-        width: 100%;
-        height: 320px;
+      .right-bottom1 {
+        width: 42%;
+        margin-top: 10px;
+        .echarts-box {
+          width: 100%;
+          height: 320px;
+        }
       }
     }
   }
-}
 
-:deep(.zxm-table-body) {
-  border: 1px solid rgba(57, 232, 255, 0.2) !important;
+  :deep(.zxm-table-body) {
+    border: 1px solid rgba(57, 232, 255, 0.2) !important;
 
-  .zxm-table-tbody>tr>td {
-    border: none !important;
+    .zxm-table-tbody > tr > td {
+      border: none !important;
+    }
   }
-}
 
-:deep(.zxm-table-cell) {
-  border-right: none !important;
-}
+  :deep(.zxm-table-cell) {
+    border-right: none !important;
+  }
 </style>

src/views/vent/monitorManager/deviceMonitor/components/device/modal/fiber.modal.bd.vue

@@ -56,14 +56,7 @@
         <div class="right-bottom">
           <span class="base-title">测点监测曲线</span>
           <div class="echarts-box">
-            <BarAndLine
-              xAxisPropType="pos"
-              :dataSource="posList"
-              height="100%"
-              :chartsColumns="chartsColumns"
-              :option="echatsOption"
-              chartsType="listMonitor"
-            />
+            <BarAndLine xAxisPropType="pos" :dataSource="posList" height="100%" :chartsColumns="chartsColumns" :option="echatsOption" />
           </div>
         </div>
         <div class="right-center">

src/views/vent/monitorManager/deviceMonitor/components/device/modal/fiber.modal.cct.vue

@@ -47,7 +47,6 @@
               height="100%"
               :chartsColumns="chartsColumns"
               :option="echatsOption"
-              chartsType="listMonitor"
             />
           </div>
         </div>

src/views/vent/monitorManager/deviceMonitor/components/device/modal/fiber.modal.hlg.vue

@@ -47,7 +47,6 @@
               height="100%"
               :chartsColumns="chartsColumns"
               :option="echatsOption"
-              chartsType="listMonitor"
             />
           </div>
         </div>
@@ -200,7 +199,7 @@
             posList.length = 0;
             posList1.length = 0;
             // let counts = Math.ceil((Object.keys(item.readData).length - 2) / 5);
-            let counts = Math.ceil((Object.keys(item.readData).filter(v=>v.indexOf('Section')!=-1).length) / 5);
+            let counts = Math.ceil(Object.keys(item.readData).filter((v) => v.indexOf('Section') != -1).length / 5);
             for (let i = 0; i < counts; i++) {
               posList.push({
                 Section_MaxTemp: item.readData[`Section${i + 1}_MaxTemp`],

src/views/vent/monitorManager/deviceMonitor/components/device/modal/fiber.modal.sjh.vue

@@ -66,14 +66,7 @@
         <div class="right-bottom">
           <span class="base-title">测点监测曲线</span>
           <div class="echarts-box">
-            <BarAndLine
-              xAxisPropType="tempmax"
-              :dataSource="posList1"
-              height="100%"
-              :chartsColumns="chartsColumns"
-              :option="echatsOption"
-              chartsType="listMonitor"
-            />
+            <BarAndLine xAxisPropType="tempmax" :dataSource="posList1" height="100%" :chartsColumns="chartsColumns" :option="echatsOption" />
           </div>
         </div>
       </div>

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

@@ -78,7 +78,6 @@
               height="100%"
               :chartsColumns="chartsColumns"
               :option="echatsOption"
-              chartsType="listMonitor"
             />
           </div>
         </div>

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

@@ -117,7 +117,6 @@
               width="100%"
               :chartsColumns="chartsColumns"
               :option="echatsOption"
-              chartsType="listMonitor"
             />
 
             <!-- 爆炸三角形 -->

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

@@ -110,7 +110,6 @@
               height="100%"
               :chartsColumns="chartsColumns"
               :option="echatsOption"
-              chartsType="listMonitor"
             />
           </div>
         </div>

src/views/vent/monitorManager/deviceMonitor/components/device/modal/history-ball.vue

@@ -50,7 +50,6 @@
         width="100%"
         :chartsColumns="chartsColumns"
         :option="echatsOption"
-        chartsType="listMonitor"
       />
     </div>
   </div>

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

@@ -1,116 +1,116 @@
 <template>
-    <BasicModal v-bind="$attrs" @register="register" :title="`智慧球监测详情    ${currentTime}`" width="1200px" @ok="handleOk" @cancel="handleCancel">
-      <div class="fiber-modal">
-        <div class="modal-left">
-          <div
-            v-for="device in deviceList"
-            class="link-item"
-            :class="{ 'active-device-title': device.deviceID === activeDeviceID }"
-            :key="device.deviceID"
-          >
-            <span class="" @click="selectDevice(device.deviceID)">{{ device.strinstallpos }}</span>
-          </div>
+  <BasicModal v-bind="$attrs" @register="register" :title="`智慧球监测详情    ${currentTime}`" width="1200px" @ok="handleOk" @cancel="handleCancel">
+    <div class="fiber-modal">
+      <div class="modal-left">
+        <div
+          v-for="device in deviceList"
+          class="link-item"
+          :class="{ 'active-device-title': device.deviceID === activeDeviceID }"
+          :key="device.deviceID"
+        >
+          <span class="" @click="selectDevice(device.deviceID)">{{ device.strinstallpos }}</span>
         </div>
-        <div class="modal-right">
-          <span class="base-title">基本信息</span>
-          <div class="base-box">
-            <!-- <div class="base-item">
+      </div>
+      <div class="modal-right">
+        <span class="base-title">基本信息</span>
+        <div class="base-box">
+          <!-- <div class="base-item">
               <span class="title">所属区域：</span>
               <span class="value">{{ posMonitor['beltName'] ? posMonitor['beltName'] : '-' }}</span>
             </div> -->
-            <div class="base-item">
-              <span class="title">当前安装位置：</span>
-              <span class="value">{{ posMonitor['strinstallpos'] ? posMonitor['strinstallpos'] : '-' }}</span>
-            </div>
-            <div class="base-item">
-              <span class="title">停采线距离：</span>
-              <span class="value">{{ posMonitor['initStopLine'] ? posMonitor['initStopLine'] : '-' }}</span>
-            </div>
-            <!-- <div class="base-item">
+          <div class="base-item">
+            <span class="title">当前安装位置：</span>
+            <span class="value">{{ posMonitor['strinstallpos'] ? posMonitor['strinstallpos'] : '-' }}</span>
+          </div>
+          <div class="base-item">
+            <span class="title">停采线距离：</span>
+            <span class="value">{{ posMonitor['initStopLine'] ? posMonitor['initStopLine'] : '-' }}</span>
+          </div>
+          <!-- <div class="base-item">
               <span class="title">监测区域范围：</span>
               <span class="value"
                 >{{ posMonitor['startArea'] ? posMonitor['startArea'] : '-' }}m - {{ posMonitor['engArea'] ? posMonitor['engArea'] : '-' }}m</span
               >
             </div> -->
-            <!-- <div class="base-item">
+          <!-- <div class="base-item">
               <span class="title">开启温度：</span>
               <span class="value"
                 >{{ posMonitor['tempStart'] !== undefined && posMonitor['tempStart'] !== null ? posMonitor['tempStart'] : '-' }}℃</span
               >
             </div> -->
-            <!-- <div class="base-item">
+          <!-- <div class="base-item">
               <span class="title">关闭温度：</span>
               <span class="value">{{ posMonitor['tempStop'] !== undefined && posMonitor['tempStop'] !== null ? posMonitor['tempStop'] : '-' }}℃</span>
             </div> -->
+        </div>
+        <span class="base-title">实时监测参数</span>
+        <div class="right-top">
+          <!-- 温度 -->
+          <div class="top-item">
+            <div class="icon">
+              <SvgIcon class="icon-style aveg-temperature" size="40" name="aveg-temperature" />
+            </div>
+            <div class="item-container">
+              <div class="title">温度值</div>
+              <div class="value"
+                >{{ posMonitor['tempValue'] !== undefined && posMonitor['tempValue'] !== null ? posMonitor['tempValue'] : '-' }} <span>℃</span></div
+              >
+            </div>
           </div>
-          <span class="base-title">实时监测参数</span>
-          <div class="right-top">
-            <!-- 温度 -->
-            <div class="top-item">
-              <div class="icon">
-                <SvgIcon class="icon-style aveg-temperature" size="40" name="aveg-temperature" />
-              </div>
-              <div class="item-container">
-                <div class="title">温度值</div>
-                <div class="value"
-                  >{{ posMonitor['tempValue'] !== undefined && posMonitor['tempValue'] !== null ? posMonitor['tempValue'] : '-' }} <span>℃</span></div
-                >
-              </div>
+          <div class="top-item">
+            <div class="icon">
+              <!-- <SvgIcon class="icon-style max-temperature" size="38" name="max-temperature" /> -->
+              <SvgIcon class="icon-style" name="pressure" size="40" />
             </div>
-            <div class="top-item">
-              <div class="icon">
-                <!-- <SvgIcon class="icon-style max-temperature" size="38" name="max-temperature" /> -->
-                <SvgIcon class="icon-style" name="pressure" size="40" />
-              </div>
-              <div class="item-container">
-                <div class="title">设备电量值</div>
-                <div class="value"
-                  >{{ posMonitor['quantity'] !== undefined && posMonitor['quantity'] !== null ? posMonitor['quantity'] : '-' }} <span>W</span>
-                </div>
+            <div class="item-container">
+              <div class="title">设备电量值</div>
+              <div class="value"
+                >{{ posMonitor['quantity'] !== undefined && posMonitor['quantity'] !== null ? posMonitor['quantity'] : '-' }} <span>W</span>
               </div>
             </div>
-            <div class="top-item">
-              <div class="icon">
-                <!-- <SvgIcon class="icon-style min-temperature" size="38" name="min-temperature" /> -->
-                <SvgIcon class="icon-style" name="coval" style="width: 62px; height: 30px; margin-top: 10px" />
-              </div>
-              <div class="item-container">
-                <div class="title">一氧化碳值</div>
-                <div class="value"
-                  >{{ posMonitor['coValue'] !== undefined && posMonitor['coValue'] !== null ? posMonitor['coValue'] : '-' }} <span>ppm</span></div
-                >
-              </div>
+          </div>
+          <div class="top-item">
+            <div class="icon">
+              <!-- <SvgIcon class="icon-style min-temperature" size="38" name="min-temperature" /> -->
+              <SvgIcon class="icon-style" name="coval" style="width: 62px; height: 30px; margin-top: 10px" />
             </div>
-            <div class="top-item">
-              <div class="icon">
-                <SvgIcon class="icon-style" name="o2val" style="width: 46px; height: 42px; " />
-              </div>
-              <div class="item-container">
-                <div class="title">氧气值</div>
-                <div class="value"
-                  >{{ posMonitor['o2Value'] !== undefined && posMonitor['o2Value'] !== null ? posMonitor['o2Value'] : '-' }} <span>%</span></div
-                >
-              </div>
+            <div class="item-container">
+              <div class="title">一氧化碳值</div>
+              <div class="value"
+                >{{ posMonitor['coValue'] !== undefined && posMonitor['coValue'] !== null ? posMonitor['coValue'] : '-' }} <span>ppm</span></div
+              >
             </div>
-            <div class="top-item warning-box">
-              <div class="icon">
-                <SvgIcon class="icon-style" size="38" name="risk-level" style="margin-top: 6px" />
-              </div>
-              <div class="item-container">
-                <div class="title">通信状态</div>
-                <div class="warning-value">{{ posMonitor['devicesSTAT'] == 0 ? '关闭' : posMonitor['devicesSTAT'] == 1 ? '开启' : '离线' }}</div>
-              </div>
+          </div>
+          <div class="top-item">
+            <div class="icon">
+              <SvgIcon class="icon-style" name="o2val" style="width: 46px; height: 42px" />
             </div>
-            <div class="top-item warning-box">
-              <div class="icon">
-                <SvgIcon class="icon-style" size="38" name="risk-level" style="margin-top: 6px" />
-              </div>
-              <div class="item-container">
-                <div class="title">报警状态</div>
-                <div class="warning-value">{{ posMonitor['devicesSTAT'] == 0 ? '关闭' : posMonitor['devicesSTAT'] == 1 ? '开启' : '离线' }}</div>
-              </div>
+            <div class="item-container">
+              <div class="title">氧气值</div>
+              <div class="value"
+                >{{ posMonitor['o2Value'] !== undefined && posMonitor['o2Value'] !== null ? posMonitor['o2Value'] : '-' }} <span>%</span></div
+              >
+            </div>
+          </div>
+          <div class="top-item warning-box">
+            <div class="icon">
+              <SvgIcon class="icon-style" size="38" name="risk-level" style="margin-top: 6px" />
+            </div>
+            <div class="item-container">
+              <div class="title">通信状态</div>
+              <div class="warning-value">{{ posMonitor['devicesSTAT'] == 0 ? '关闭' : posMonitor['devicesSTAT'] == 1 ? '开启' : '离线' }}</div>
+            </div>
+          </div>
+          <div class="top-item warning-box">
+            <div class="icon">
+              <SvgIcon class="icon-style" size="38" name="risk-level" style="margin-top: 6px" />
+            </div>
+            <div class="item-container">
+              <div class="title">报警状态</div>
+              <div class="warning-value">{{ posMonitor['devicesSTAT'] == 0 ? '关闭' : posMonitor['devicesSTAT'] == 1 ? '开启' : '离线' }}</div>
             </div>
-            <!-- <div class="top-item item-data">
+          </div>
+          <!-- <div class="top-item item-data">
               <div class="icon">
                 <SvgIcon class="icon-style" name="temp" style="width: 62px; height: 38px; margin-top: 10px" />
               </div>
@@ -232,421 +232,419 @@
                 >报警阈值：<span class="rang-data">{{ posMonitor['PressureWarn'] ? posMonitor['PressureWarn'] : '-' }}</span></div
               >
             </div> -->
-          </div>
-          <div class="right-bottom">
-            <span class="base-title">设备监测</span>
-            <!-- <a-table size="small" :columns="ballvalveColumns" :data-source="historyList" :pagination="false" :scroll="{ y: 300 }" /> -->
-            <div class="echarts-box">
-              <BarAndLine
-                class="echarts-line"
-                xAxisPropType="time"
-                :dataSource="historyList"
-                height="100%"
-                width="100%"
-                :chartsColumns="chartsColumns"
-                :option="echatsOption"
-                chartsType="listMonitor"
-              />
-            </div>
+        </div>
+        <div class="right-bottom">
+          <span class="base-title">设备监测</span>
+          <!-- <a-table size="small" :columns="ballvalveColumns" :data-source="historyList" :pagination="false" :scroll="{ y: 300 }" /> -->
+          <div class="echarts-box">
+            <BarAndLine
+              class="echarts-line"
+              xAxisPropType="time"
+              :dataSource="historyList"
+              height="100%"
+              width="100%"
+              :chartsColumns="chartsColumns"
+              :option="echatsOption"
+            />
           </div>
         </div>
       </div>
-    </BasicModal>
-  </template>
-  <script lang="ts">
-    import { defineComponent, ref, watch, shallowRef } from 'vue';
-    import { BasicModal, useModalInner } from '/@/components/Modal';
-    import BarAndLine from '/@/components/chart/BarAndLine.vue';
-    import { SvgIcon } from '/@/components/Icon';
-    import { chartsColumnListBall } from '../device.data';
-    import { Decoration7 as DvDecoration7, ScrollBoard as DvScrollBoard } from '@kjgl77/datav-vue3';
-    import dayjs from 'dayjs';
-    import { ballvalveColumns } from '../device.data';
-    import { getTableHeaderColumns } from '/@/hooks/web/useWebColumns';
-  
-    export default defineComponent({
-      components: { BasicModal, BarAndLine, SvgIcon, DvScrollBoard, DvDecoration7 },
-      props: {
-        dataSource: { type: Array },
-        activeID: { type: String },
-      },
-      setup(props) {
-        const currentTime = ref(dayjs().format('YYYY-MM-DD HH:mm:ss'));
-        const modelRef = ref({});
-        const loading = ref(true);
-        const activeDeviceID = ref('');
-        const deviceList = ref<any[]>([]);
-        const historyList = ref<any[]>([]);
-        const posList = ref<any[]>([]);
-        const posMonitor = shallowRef({});
-        const chartsColumnArr = getTableHeaderColumns('firemon_normal_chart');
-        const chartsColumns = chartsColumnArr.length > 0 ? chartsColumnArr : chartsColumnListBall;
-        const echatsOption = {
-          grid: {
-            top: '20%',
-            left: '10',
-            right: '65',
-            bottom: '0',
-            containLabel: true,
-          },
-          toolbox: {
-            feature: {},
-          },
-        };
-  
-        const [register, { setModalProps, closeModal }] = useModalInner();
-  
-        function handleVisibleChange(visible) {
-          if (visible) {
-            loading.value = true;
-            setModalProps({ loading: true, confirmLoading: true });
-  
-            setTimeout(() => {
-              loading.value = false;
-              setModalProps({ loading: false, confirmLoading: false });
-            }, 1000);
-          }
-        }
-  
-        // 选择监测
-        function selectDevice(id) {
+    </div>
+  </BasicModal>
+</template>
+<script lang="ts">
+  import { defineComponent, ref, watch, shallowRef } from 'vue';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import BarAndLine from '/@/components/chart/BarAndLine.vue';
+  import { SvgIcon } from '/@/components/Icon';
+  import { chartsColumnListBall } from '../device.data';
+  import { Decoration7 as DvDecoration7, ScrollBoard as DvScrollBoard } from '@kjgl77/datav-vue3';
+  import dayjs from 'dayjs';
+  import { ballvalveColumns } from '../device.data';
+  import { getTableHeaderColumns } from '/@/hooks/web/useWebColumns';
+
+  export default defineComponent({
+    components: { BasicModal, BarAndLine, SvgIcon, DvScrollBoard, DvDecoration7 },
+    props: {
+      dataSource: { type: Array },
+      activeID: { type: String },
+    },
+    setup(props) {
+      const currentTime = ref(dayjs().format('YYYY-MM-DD HH:mm:ss'));
+      const modelRef = ref({});
+      const loading = ref(true);
+      const activeDeviceID = ref('');
+      const deviceList = ref<any[]>([]);
+      const historyList = ref<any[]>([]);
+      const posList = ref<any[]>([]);
+      const posMonitor = shallowRef({});
+      const chartsColumnArr = getTableHeaderColumns('firemon_normal_chart');
+      const chartsColumns = chartsColumnArr.length > 0 ? chartsColumnArr : chartsColumnListBall;
+      const echatsOption = {
+        grid: {
+          top: '20%',
+          left: '10',
+          right: '65',
+          bottom: '0',
+          containLabel: true,
+        },
+        toolbox: {
+          feature: {},
+        },
+      };
+
+      const [register, { setModalProps, closeModal }] = useModalInner();
+
+      function handleVisibleChange(visible) {
+        if (visible) {
           loading.value = true;
           setModalProps({ loading: true, confirmLoading: true });
+
           setTimeout(() => {
             loading.value = false;
-            activeDeviceID.value = id;
             setModalProps({ loading: false, confirmLoading: false });
-          }, 300);
+          }, 1000);
         }
-  
-        function handleOk(e) {
-          e.preventDefault();
-          closeModal();
+      }
+
+      // 选择监测
+      function selectDevice(id) {
+        loading.value = true;
+        setModalProps({ loading: true, confirmLoading: true });
+        setTimeout(() => {
+          loading.value = false;
+          activeDeviceID.value = id;
+          setModalProps({ loading: false, confirmLoading: false });
+        }, 300);
+      }
+
+      function handleOk(e) {
+        e.preventDefault();
+        closeModal();
+      }
+
+      function handleCancel(e) {
+        e.preventDefault();
+        closeModal();
+      }
+
+      watch([() => props.dataSource, () => props.activeID], ([newDataSource, newActiveID], [oldDataSource, oldActiveID]) => {
+        // if (newActiveID != oldActiveID) {
+        //   activeDeviceID.value = newActiveID as string;
+        // }
+        activeDeviceID.value = activeDeviceID.value ? activeDeviceID.value : newActiveID;
+        deviceList.value = newDataSource?.filter((item: any, index) => {
+          if ((!activeDeviceID.value && index == 0) || item.deviceID === activeDeviceID.value) {
+            // activeDeviceID.value = item.deviceID;
+            posMonitor.value = Object.assign(item, item.readData);
+            historyList.value = item['history'];
+          }
+          item.readTime = item.readTime?.substring(11);
+          return item;
+        });
+      });
+
+      return {
+        register,
+        model: modelRef,
+        currentTime,
+        handleVisibleChange,
+        selectDevice,
+        handleOk,
+        handleCancel,
+        ballvalveColumns,
+        deviceList,
+        historyList,
+        activeDeviceID,
+        posMonitor,
+        echatsOption,
+        chartsColumnListBall,
+        chartsColumns,
+      };
+    },
+  });
+</script>
+<style lang="less" scoped>
+  .fiber-modal {
+    width: 100%;
+    height: 650px;
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+
+    .modal-left {
+      width: 200px;
+      height: 100%;
+      overflow-y: auto;
+      background: #ffffff11;
+      padding: 5px;
+      border-radius: 5px;
+
+      .active-device-title {
+        color: aqua;
+      }
+
+      .link-item {
+        position: relative;
+        cursor: pointer;
+        line-height: 30px;
+        padding-left: 30px;
+
+        span:hover {
+          color: #89ffff;
         }
-  
-        function handleCancel(e) {
-          e.preventDefault();
-          closeModal();
+
+        &::after {
+          content: '';
+          position: absolute;
+          display: block;
+          width: 8px;
+          height: 8px;
+          top: 12px;
+          left: 10px;
+          transform: rotateZ(45deg) skew(10deg, 10deg);
+          background: #45d3fd;
         }
-  
-        watch([() => props.dataSource, () => props.activeID], ([newDataSource, newActiveID], [oldDataSource, oldActiveID]) => {
-          // if (newActiveID != oldActiveID) {
-          //   activeDeviceID.value = newActiveID as string;
-          // }
-          activeDeviceID.value = activeDeviceID.value ? activeDeviceID.value : newActiveID;
-          deviceList.value = newDataSource?.filter((item: any, index) => {
-            if ((!activeDeviceID.value && index == 0) || item.deviceID === activeDeviceID.value) {
-              // activeDeviceID.value = item.deviceID;
-              posMonitor.value = Object.assign(item, item.readData);
-              historyList.value = item['history'];
-            }
-            item.readTime = item.readTime?.substring(11);
-            return item;
-          });
-        });
-  
-        return {
-          register,
-          model: modelRef,
-          currentTime,
-          handleVisibleChange,
-          selectDevice,
-          handleOk,
-          handleCancel,
-          ballvalveColumns,
-          deviceList,
-          historyList,
-          activeDeviceID,
-          posMonitor,
-          echatsOption,
-          chartsColumnListBall,
-          chartsColumns,
-        };
-      },
-    });
-  </script>
-  <style lang="less" scoped>
-    .fiber-modal {
-      width: 100%;
-      height: 650px;
-      display: flex;
-      flex-direction: row;
-      justify-content: space-between;
-  
-      .modal-left {
-        width: 200px;
-        height: 100%;
-        overflow-y: auto;
-        background: #ffffff11;
-        padding: 5px;
-        border-radius: 5px;
-  
-        .active-device-title {
-          color: aqua;
+      }
+    }
+
+    .modal-right {
+      width: calc(100% - 220px);
+      overflow-y: auto;
+      .base-title {
+        line-height: 32px;
+        position: relative;
+        padding-left: 20px;
+
+        &::after {
+          content: '';
+          position: absolute;
+          display: block;
+          width: 4px;
+          height: 12px;
+          top: 4px;
+          left: 10px;
+          background: #45d3fd;
+          border-radius: 4px;
         }
-  
-        .link-item {
-          position: relative;
-          cursor: pointer;
+      }
+
+      .base-box {
+        width: 100%;
+        // height: 100px;
+        height: 65px;
+        font-size: 14px;
+        display: flex;
+        flex-direction: row;
+        flex-wrap: wrap;
+        border: 1px solid rgba(25, 237, 255, 0.4);
+        box-shadow: inset 0 0 10px rgba(0, 197, 255, 0.3);
+        background: rgba(0, 0, 0, 0.06666666666666667);
+        padding: 15px 20px;
+        margin-bottom: 10px;
+        .base-item {
+          width: 33%;
           line-height: 30px;
-          padding-left: 30px;
-  
-          span:hover {
-            color: #89ffff;
+          span {
+            display: inline-block;
           }
-  
-          &::after {
-            content: '';
-            position: absolute;
-            display: block;
-            width: 8px;
-            height: 8px;
-            top: 12px;
-            left: 10px;
-            transform: rotateZ(45deg) skew(10deg, 10deg);
-            background: #45d3fd;
+          .title {
+            width: 120px;
           }
-        }
-      }
-  
-      .modal-right {
-        width: calc(100% - 220px);
-        overflow-y: auto;
-        .base-title {
-          line-height: 32px;
-          position: relative;
-          padding-left: 20px;
-  
-          &::after {
-            content: '';
-            position: absolute;
-            display: block;
-            width: 4px;
-            height: 12px;
-            top: 4px;
-            left: 10px;
-            background: #45d3fd;
-            border-radius: 4px;
+          .value {
+            width: 150px;
+            text-overflow: ellipsis;
           }
         }
-  
-        .base-box {
-          width: 100%;
-          // height: 100px;
-          height: 65px;
-          font-size: 14px;
+      }
+
+      .right-top {
+        display: flex;
+        flex-direction: row;
+        justify-content: space-between;
+        flex-wrap: wrap;
+        margin-bottom: 10px;
+        .top-item {
+          width: 220px;
+          height: 100px;
           display: flex;
           flex-direction: row;
-          flex-wrap: wrap;
+          justify-content: center;
           border: 1px solid rgba(25, 237, 255, 0.4);
-          box-shadow: inset 0 0 10px rgba(0, 197, 255, 0.3);
+          box-shadow: inset 0 0 10px rgba(0, 197, 255, 0.6);
           background: rgba(0, 0, 0, 0.06666666666666667);
-          padding: 15px 20px;
-          margin-bottom: 10px;
-          .base-item {
-            width: 33%;
-            line-height: 30px;
-            span {
-              display: inline-block;
-            }
-            .title {
-              width: 120px;
-            }
-            .value {
-              width: 150px;
-              text-overflow: ellipsis;
-            }
+          padding-top: 20px;
+          margin: 10px 0;
+
+          .icon {
+            margin-right: 10px;
+            margin-top: 5px;
+            color: #fdb146;
           }
-        }
-  
-        .right-top {
-          display: flex;
-          flex-direction: row;
-          justify-content: space-between;
-          flex-wrap: wrap;
-          margin-bottom: 10px;
-          .top-item {
-            width: 220px;
-            height: 100px;
+
+          .item-container {
+            width: 100px;
             display: flex;
-            flex-direction: row;
+            flex-direction: column;
             justify-content: center;
-            border: 1px solid rgba(25, 237, 255, 0.4);
-            box-shadow: inset 0 0 10px rgba(0, 197, 255, 0.6);
-            background: rgba(0, 0, 0, 0.06666666666666667);
-            padding-top: 20px;
-            margin: 10px 0;
-  
-            .icon {
-              margin-right: 10px;
-              margin-top: 5px;
-              color: #fdb146;
+
+            div {
+              text-align: center;
             }
-  
-            .item-container {
-              width: 100px;
-              display: flex;
-              flex-direction: column;
-              justify-content: center;
-  
-              div {
-                text-align: center;
-              }
-  
-              .title {
+
+            .title {
+              font-size: 18px;
+            }
+
+            .value {
+              text-shadow: 0 0 25px #00fbfe;
+              background: linear-gradient(0deg, #45d3fd, #45d3fd, #61ddb1, #61ddb1);
+              font-style: normal;
+              background-size: cover;
+              font-family: electronicFont;
+              font-size: 30px;
+              -webkit-background-clip: text;
+              background-clip: text;
+              -webkit-text-fill-color: transparent;
+              position: relative;
+              top: -8px;
+
+              span {
+                font-family: Arial, Helvetica, sans-serif;
                 font-size: 18px;
+                color: aliceblue;
               }
-  
-              .value {
-                text-shadow: 0 0 25px #00fbfe;
-                background: linear-gradient(0deg, #45d3fd, #45d3fd, #61ddb1, #61ddb1);
-                font-style: normal;
-                background-size: cover;
-                font-family: electronicFont;
-                font-size: 30px;
-                -webkit-background-clip: text;
-                background-clip: text;
-                -webkit-text-fill-color: transparent;
-                position: relative;
-                top: -8px;
-  
-                span {
-                  font-family: Arial, Helvetica, sans-serif;
-                  font-size: 18px;
-                  color: aliceblue;
-                }
-              }
-              .alarm-value {
-                text-shadow: 0 0 25px #fe1500;
-                background: linear-gradient(0deg, #fd4545, #fd5e45, #dd7461, #dd6161);
-                -webkit-background-clip: text;
-                background-clip: text;
-                -webkit-text-fill-color: transparent;
-              }
+            }
+            .alarm-value {
+              text-shadow: 0 0 25px #fe1500;
+              background: linear-gradient(0deg, #fd4545, #fd5e45, #dd7461, #dd6161);
+              -webkit-background-clip: text;
+              background-clip: text;
+              -webkit-text-fill-color: transparent;
             }
           }
-          .item-data {
-            position: relative;
-            height: 120px;
-            padding-top: 0;
-            .icon {
-              position: absolute;
-              left: 20px;
-              top: 25px;
-              // margin-right: 30px;
-              // margin-top: 25px;
+        }
+        .item-data {
+          position: relative;
+          height: 120px;
+          padding-top: 0;
+          .icon {
+            position: absolute;
+            left: 20px;
+            top: 25px;
+            // margin-right: 30px;
+            // margin-top: 25px;
+          }
+          .item-container {
+            width: 140px;
+            position: absolute;
+            padding-top: 15px;
+            justify-content: flex-start;
+            right: 0;
+            .value {
+              top: 0px;
             }
-            .item-container {
-              width: 140px;
-              position: absolute;
-              padding-top: 15px;
-              justify-content: flex-start;
-              right: 0;
-              .value {
-                top: 0px;
-              }
-              .state-close {
-                color: #b9b9b9;
-              }
-              .state-open {
-                color: #00ff88;
-              }
-              .state-offline {
-                color: #ffd000;
-              }
+            .state-close {
+              color: #b9b9b9;
             }
-            .rang {
-              position: absolute;
-              color: #ff8331;
-              bottom: 10px;
-              right: 20px;
-              .rang-data {
-                padding: 0 5px;
-              }
+            .state-open {
+              color: #00ff88;
             }
-          }
-  
-          .warning-box {
-            padding-top: 0px;
-  
-            .icon {
-              margin-top: 20px;
-  
-              :deep(.icon-style) {
-                width: auto;
-                color: #fdb146;
-              }
+            .state-offline {
+              color: #ffd000;
             }
-  
-            .warning-value {
-              font-size: 18px;
-              color: #61ddb1;
+          }
+          .rang {
+            position: absolute;
+            color: #ff8331;
+            bottom: 10px;
+            right: 20px;
+            .rang-data {
+              padding: 0 5px;
             }
           }
         }
-  
-        .right-center {
-          margin-top: 20px;
-          display: flex;
-          flex-direction: row;
-          justify-content: space-between;
-  
-          .table-box {
-            position: relative;
-            width: 500px;
-            height: 250px;
-          }
-  
-          .warning-box {
-            width: calc(100% - 520px);
-  
-            .warning-container {
-              width: 100%;
-              height: convert;
-              background: #009acd00;
-  
-              :deep(.dv-scroll-board) {
-                .row-item {
-                  height: 40px !important;
-                  line-height: 35px !important;
-                }
-  
-                .header-item {
-                  border-top: 1px solid #91e9fe !important;
-                  border-bottom: 1px solid #91e9fe !important;
-                }
-              }
+
+        .warning-box {
+          padding-top: 0px;
+
+          .icon {
+            margin-top: 20px;
+
+            :deep(.icon-style) {
+              width: auto;
+              color: #fdb146;
             }
           }
+
+          .warning-value {
+            font-size: 18px;
+            color: #61ddb1;
+          }
         }
-  
-        .right-bottom {
-          margin-top: 10px;
-  
-          .echarts-box {
+      }
+
+      .right-center {
+        margin-top: 20px;
+        display: flex;
+        flex-direction: row;
+        justify-content: space-between;
+
+        .table-box {
+          position: relative;
+          width: 500px;
+          height: 250px;
+        }
+
+        .warning-box {
+          width: calc(100% - 520px);
+
+          .warning-container {
             width: 100%;
-            height: 180px;
-            position: relative;
-  
-            .echarts-line {
-              width: calc(100% + 80px);
-              position: absolute;
+            height: convert;
+            background: #009acd00;
+
+            :deep(.dv-scroll-board) {
+              .row-item {
+                height: 40px !important;
+                line-height: 35px !important;
+              }
+
+              .header-item {
+                border-top: 1px solid #91e9fe !important;
+                border-bottom: 1px solid #91e9fe !important;
+              }
             }
           }
         }
       }
-    }
-  
-    :deep(.zxm-table-body) {
-      border: 1px solid rgba(57, 232, 255, 0.2) !important;
-  
-      .zxm-table-tbody > tr > td {
-        border: none !important;
+
+      .right-bottom {
+        margin-top: 10px;
+
+        .echarts-box {
+          width: 100%;
+          height: 180px;
+          position: relative;
+
+          .echarts-line {
+            width: calc(100% + 80px);
+            position: absolute;
+          }
+        }
       }
     }
-  
-    :deep(.zxm-table-cell) {
-      border-right: none !important;
+  }
+
+  :deep(.zxm-table-body) {
+    border: 1px solid rgba(57, 232, 255, 0.2) !important;
+
+    .zxm-table-tbody > tr > td {
+      border: none !important;
     }
-  </style>
-  
+  }
+
+  :deep(.zxm-table-cell) {
+    border-right: none !important;
+  }
+</style>

src/views/vent/monitorManager/fanLocalMonitor/components/conditionAssistance.vue

@@ -21,7 +21,6 @@
           height="400px"
           :chartsColumns="chartsColumnList"
           :option="echatsOption"
-          chartsType="listMonitor"
         />
       </div>
       <div class="center-box">

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

@@ -411,7 +411,6 @@
                 width="100%"
                 :chartsColumns="chartsColumnsZDKZ"
                 :option="echatsOption"
-                chartsType="listMonitor"
               />
             </div>
           </a-tab-pane>

src/views/vent/monitorManager/fanLocalMonitor1/components/conditionAssistance.vue

@@ -21,7 +21,6 @@
           height="400px"
           :chartsColumns="chartsColumnList"
           :option="echatsOption"
-          chartsType="listMonitor"
         />
       </div>
       <div class="center-box">

src/views/vent/monitorManager/fanLocalMonitor1/components/conditionAssistance1.vue

@@ -21,7 +21,6 @@
           height="400px"
           :chartsColumns="chartsColumnList"
           :option="echatsOption"
-          chartsType="listMonitor"
         />
       </div>
       <div class="center-box">

src/views/vent/monitorManager/fanLocalMonitor1/components/fanlocal-echart-line.vue

@@ -8,7 +8,6 @@
       width="100%"
       :chartsColumns="chartsColumn"
       :option="echatsOption"
-      chartsType="listMonitor"
     />
   </div>
 </template>

src/views/vent/monitorManager/fireDoorMonitor/fireDoor.threejs.ts

@@ -1,7 +1,7 @@
 import * as THREE from 'three';
 import UseThree from '../../../../utils/threejs/useThree';
 import FireDoor from './fireDoor.threejs.fire';
-// import FireDoorF from './fireDoor.threejs.fireF';
+import FireDoorF from './fireDoor.threejs.fireF';
 import { animateCamera } from '/@/utils/threejs/util';
 import useEvent from '../../../../utils/threejs/useEvent';
 import { useGlobSetting } from '/@/hooks/setting';
@@ -131,7 +131,6 @@ const setControls = () => {
 };
 
 export const mountedThree = () => {
-  // const { sysOrgCode } = useGlobSetting();
   return new Promise(async (resolve) => {
     model = new UseThree('#damper3D', '', '#deviceDetail');
     model.setEnvMap('test1');
@@ -140,7 +139,7 @@ export const mountedThree = () => {
     fireDoor = new FireDoor(model);
     fireDoor.mountedThree();
 
-    // fireDoorF = new FireDoorF(model);
+    fireDoorF = new FireDoorF(model);
     fireDoorF.mountedThree();
     resolve(null);
     setControls();

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

@@ -337,7 +337,7 @@
     }
   }
   async function getSubstation() {
-    const list: [] = await subStationList({ strtype: 'kafka', monitorparam: 'safetymonitor*' });
+    const list: [] = await subStationList({ monitorparam: 'safetymonitor*' });
     subStationOptions.value = list;
     if (list.length > 0) {
       subStation.value = list[0]['id'];

src/views/vent/monitorManager/safetyMonitor/safety.api.ts

@@ -9,7 +9,7 @@ enum Api {
   safetyList = '/monitor/history/getAlarmHistoryData',
   export = '/safety/reportInfo/expComReport?tempName=aqjk',
   subStationList = '/safety/ventanalySubStation/alllist',
-  initSubStation = '/monitor/initSafetyMonitorDeviceInfo',
+  initSubStation = '/ventanaly-device/monitor/initKafkaDeviceInfo',
 }
 /**
  * 列表接口

src/views/vent/monitorManager/windrectMonitor/dantou.threejs.ts

@@ -190,6 +190,19 @@ class ddWindRect {
     this.isLRAnimation = false;
   }
 
+  resetModalType(flag) {
+    const ddcfObj = this.group.getObjectByName(this.modelName);
+    if (ddcfObj) {
+      if (flag === 'sensor') {
+        ddcfObj.getObjectByName('ChuanGanQi').visible = true;
+        ddcfObj.getObjectByName('SheBei_1').visible = false;
+      } else {
+        ddcfObj.getObjectByName('ChuanGanQi').visible = false;
+        ddcfObj.getObjectByName('SheBei_1').visible = true;
+      }
+    }
+  }
+
   mountedThree() {
     return new Promise((resolve) => {
       this.model.setGLTFModel([this.modelName], this.group).then(() => {

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

@@ -562,37 +562,47 @@
   }
   // 切换检测数据
   async function getSelectRow(selectRow, index) {
+    debugger;
     if (selectRow) {
       loading.value = true;
       selectRowIndex.value = index;
       Object.assign(selectData, selectRow);
       let type = '';
-      if (selectRow.deviceType.startsWith('windrect_rect')) {
-        type = 'lmWindRect';
-      }
-      if (selectRow.deviceType.startsWith('windrect_normal')) {
-        type = 'zdWindRect';
-      }
-      if (selectRow.deviceType.startsWith('windrect_rect_single')) {
-        type = 'lmWindSide';
-      }
-      if (selectRow.deviceType.startsWith('windrect_ds')) {
-        type = 'dsWindRect_move';
-        // type = 'duisheFixed';
-      }
-      if (selectRow.deviceType.startsWith('windrect_ds_four')) {
-        type = 'dsWindRect_four';
-      }
-      if (
-        selectRow.deviceType.startsWith('windrect_ds_two') ||
-        selectRow.deviceType.startsWith('windrect_ds_sut') ||
-        selectRow.deviceType.startsWith('windrect_muti')
-      ) {
-        type = 'duisheFixed';
-      }
-      if (selectRow.deviceType.startsWith('windrect_dd') || selectRow.deviceType == 'windrect_safety' || selectRow.deviceType == 'windrect_sensor') {
-        type = 'ddWindSide';
+      if (selectRow['modelType']) {
+        type = selectRow['modelType'];
+      } else {
+        if (selectRow.deviceType.startsWith('windrect_rect')) {
+          type = 'lmWindRect';
+        }
+        if (selectRow.deviceType.startsWith('windrect_normal')) {
+          type = 'zdWindRect';
+        }
+        if (selectRow.deviceType.startsWith('windrect_rect_single')) {
+          type = 'lmWindSide';
+        }
+        if (selectRow.deviceType.startsWith('windrect_ds')) {
+          type = 'dsWindRect_move';
+          // type = 'duisheFixed';
+        }
+        if (selectRow.deviceType.startsWith('windrect_ds_four')) {
+          type = 'dsWindRect_four';
+        }
+        if (
+          selectRow.deviceType.startsWith('windrect_ds_two') ||
+          selectRow.deviceType.startsWith('windrect_ds_sut') ||
+          selectRow.deviceType.startsWith('windrect_muti')
+        ) {
+          type = 'duisheFixed';
+        }
+        if (
+          selectRow.deviceType.startsWith('windrect_dd') ||
+          selectRow.deviceType == 'windrect_safety' ||
+          selectRow.deviceType == 'windrect_sensor'
+        ) {
+          type = 'ddWindSide';
+        }
       }
+
       // const type = selectRowIndex.value >= 1 ? 'lmWindRect' : selectRowIndex.value <= 3 ? 'zdWindRect' : 'dsWindRect';
       await setModelType(type);
       loading.value = false;

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

@@ -41,7 +41,7 @@ const startAnimation = () => {
       dsWindRectObj.mouseUpModel.call(dsWindRectObj);
     } else if (windRectType === 'lmWindSide' && lmWindRectSideObj) {
       lmWindRectSideObj.mouseUpModel.call(lmWindRectSideObj);
-    } else if (windRectType === 'ddWindSide' && ddWindRectObj) {
+    } else if ((windRectType === 'ddWindSide' || windRectType === 'ddWindSide_sensor') && ddWindRectObj) {
       ddWindRectObj.mouseUpModel.call(ddWindRectObj);
     } else if (windRectType === 'duisheFixed' && fixedWindRectObj) {
       fixedWindRectObj.mouseUpModel.call(fixedWindRectObj);
@@ -61,7 +61,7 @@ const mouseEvent = (event) => {
         dsWindRectObj.mousedownModel.call(dsWindRectObj, intersects);
       } else if (windRectType === 'lmWindSide' && lmWindRectSideObj) {
         lmWindRectSideObj.mousedownModel.call(lmWindRectSideObj, intersects);
-      } else if (windRectType === 'ddWindSide' && ddWindRectObj) {
+      } else if ((windRectType === 'ddWindSide' || windRectType === 'ddWindSide_sensor') && ddWindRectObj) {
         ddWindRectObj.mousedownModel.call(ddWindRectObj, intersects);
       } else if (windRectType === 'duisheFixed' && fixedWindRectObj) {
         fixedWindRectObj.mousedownModel.call(fixedWindRectObj, intersects);
@@ -81,7 +81,7 @@ export const addMonitorText = (selectData) => {
     return dsWindRectObj.addMonitorText.call(dsWindRectObj, selectData);
   } else if (windRectType === 'lmWindSide' && lmWindRectSideObj) {
     return lmWindRectSideObj.addMonitorText.call(lmWindRectSideObj, selectData);
-  } else if (windRectType === 'ddWindSide' && ddWindRectObj) {
+  } else if ((windRectType === 'ddWindSide' || windRectType === 'ddWindSide_sensor') && ddWindRectObj) {
     return ddWindRectObj.addMonitorText.call(ddWindRectObj, selectData);
   } else if (windRectType === 'duisheFixed' && fixedWindRectObj) {
     fixedWindRectObj.addMonitorText.call(fixedWindRectObj, selectData);
@@ -135,7 +135,7 @@ export const setModelType = (type) => {
 
   lmWindRectSideObj.deviceRunState = '';
   lmWindRectSideObj.tanTouRunState = '';
-
+  debugger;
   return new Promise((resolve) => {
     if (windRectType === 'lmWindRect' && lmWindRectObj && lmWindRectObj.group) {
       // 显示双道风窗
@@ -286,7 +286,7 @@ export const setModelType = (type) => {
         );
         // lmWindRectSideObj.playCamera(true);
       }, 300);
-    } else if (windRectType === 'ddWindSide' && ddWindRectObj && ddWindRectObj.group) {
+    } else if (windRectType.startsWith('ddWindSide') && ddWindRectObj && ddWindRectObj.group) {
       model.startAnimation = ddWindRectObj.render.bind(ddWindRectObj);
       group = ddWindRectObj.group;
 
@@ -306,6 +306,13 @@ export const setModelType = (type) => {
         model.scene.remove(fixedWindRectObj.group);
       }
       model.scene?.add(ddWindRectObj.group);
+      if (windRectType == 'ddWindSide_sensor') {
+        // 显示传感器头
+        ddWindRectObj.resetModalType('sensor');
+      } else {
+        // 显示单头测风
+        ddWindRectObj.resetModalType('');
+      }
       setTimeout(async () => {
         resolve(null);
         const oldCameraPosition = { x: -1020, y: 100, z: 500 };
@@ -359,25 +366,25 @@ export const mountedThree = (playerDom) => {
     model = new UseThree('#window3D');
     model.setEnvMap('test1');
     model.renderer.toneMappingExposure = 1.0;
-    resolve(null);
+
     ddWindRectObj = new ddWindRect(model);
-    ddWindRectObj.mountedThree();
+    await ddWindRectObj.mountedThree();
 
     fixedWindRectObj = new fixedWindRect(model);
-    fixedWindRectObj.mountedThree(playerDom);
+    await fixedWindRectObj.mountedThree(playerDom);
 
     dsWindRectObj = new dsWindRect(model);
-    dsWindRectObj.mountedThree();
+    await dsWindRectObj.mountedThree();
 
     zdWindRectObj = new zdWindRect(model);
-    zdWindRectObj.mountedThree();
+    await zdWindRectObj.mountedThree();
 
     lmWindRectSideObj = new lmWindRectSide(model);
-    lmWindRectSideObj.mountedThree();
+    await lmWindRectSideObj.mountedThree();
 
     lmWindRectObj = new lmWindRect(model);
-    lmWindRectObj.mountedThree();
-
+    await lmWindRectObj.mountedThree();
+    resolve(null);
     model.animate();
     startAnimation();
   });