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

src/layouts/default/header/components/VoiceBroadcast.vue

@@ -39,7 +39,7 @@
             <div>{{ item['isok'] ? '已解决' : '未解决' }}</div>
           </div>
         </div>
-        <div v-if="broadcastList.length > 0" class="more" @click="toMore">更多>></div>
+        <div class="more" @click="toMore">更多>></div>
         <!-- <div v-if="broadcastList.length > 0" class="more" @click.self="test()">测试>></div> -->
       </div>
     </div>
@@ -129,7 +129,6 @@
           if (isBroad.value) {
             await speakVoice.getSpeechCnVoices();
             const messageText = data['warndata'];
-            // const messageText = '这是一个测试';
             speakVoice.handleReply(messageText);
             const time = dayjs().format('YYYY-MM-DD HH:mm:ss');
             console.log(time + '语音播报开始报警------>', data);

src/layouts/default/header/components/VoiceBroadcastGsd.vue

@@ -1,180 +1,188 @@
 <template>
-    <div>
-        <div class="btn" @click="showWarningBroad">
-            <a-badge :dot="isWarningDot" style="display: flex; flex-direction: row">
-                <BellOutlined style="font-size: 22px; color: #fff; margin-right: 10px" />
-                <WarningOutlined style="font-size: 22px; color: #fff" />
-            </a-badge>
+  <div>
+    <div class="btn" @click="showWarningBroad">
+      <a-badge :dot="isWarningDot" style="display: flex; flex-direction: row">
+        <BellOutlined style="font-size: 22px; color: #fff; margin-right: 10px" />
+        <WarningOutlined style="font-size: 22px; color: #fff" />
+      </a-badge>
+    </div>
+    <div v-if="isShowWarningBroad" class="broadcast" ref="VoiceBroadcastRef" id="VoiceBroadcast">
+      <div class="title">
+        <div class="message-title">预警通知</div>
+        <div class="badge-box">
+          <ClearOutlined style="font-size: 20px; color: #fff" @click="clearInfo" />
+          <SoundOutlined :class="{ 'no-play': !isBroad }" style="font-size: 20px; color: #fff" @click="handleBroad" />
         </div>
-        <div v-if="isShowWarningBroad" class="broadcast" ref="VoiceBroadcastRef" id="VoiceBroadcast">
-            <div class="title">
-                <div class="message-title">预警通知</div>
-                <div class="badge-box">
-                    <ClearOutlined style="font-size: 20px; color: #fff" @click="clearInfo" />
-                    <!-- <SoundOutlined :class="{ 'no-play': !isBroad }" style="font-size: 20px; color: #fff" @click="handleBroad" /> -->
-                </div>
-            </div>
-            <div class="broadcast-context">
-                <div class="context-tab">
-                    <div class="context-tab-item" :class="{ 'context-tab-item-active': activeKey == 0 }"> 全部</div>
-                    <!-- <div class="context-tab-item" :class="{ 'context-tab-item-active': activeKey == 1 }"
+      </div>
+      <div class="broadcast-context">
+        <div class="context-tab">
+          <div class="context-tab-item" :class="{ 'context-tab-item-active': activeKey == 0 }"> 全部</div>
+          <!-- <div class="context-tab-item" :class="{ 'context-tab-item-active': activeKey == 1 }"
                         > 未解决</div>
                     <div class="context-tab-item" :class="{ 'context-tab-item-active': activeKey == 2 }"
                         > 已解决</div> -->
-                </div>
-                <div class="context-box">
-                    <div v-if="(broadcastList && broadcastList.length == 0) || !broadcastList" class="no-context">暂无内容
-                    </div>
-                    <div class="context-detail" v-else v-for="(item, index) in broadcastList" :key="index"
-                        :style="{ color: item['isok'] == 0 ? '#f73210' : '#eee', fontWeight: item['isok'] == 0 ? '600' : '500' }">
-                        <div>{{ item['label'] }}</div>
-                        <!-- <div>{{ item['createTime'] }}</div>
+        </div>
+        <div class="context-box">
+          <div v-if="(broadcastList && broadcastList.length == 0) || !broadcastList" class="no-context">暂无内容 </div>
+          <div class="context-detail" v-else v-for="(item, index) in broadcastList" :key="index">
+            <div>{{ item['label'] }}</div>
+            <!-- <div>{{ item['createTime'] }}</div>
                         <div>{{ item['devicename'] }}</div>
                         <div>{{ item['wardescrip'] || item['nwartype_dictText'] }}</div>
                         <div>{{ item['isok'] ? '已解决' : '未解决' }}</div> -->
-                    </div>
-                </div>
-                <div v-if="broadcastList" class="more" @click="toMore">更多>></div>
-                <!-- <div v-if="broadcastList.length > 0" class="more" @click.self="test()">测试>></div> -->
-            </div>
+          </div>
         </div>
+        <div class="more" @click="toMore">更多>></div>
+        <!-- <div v-if="broadcastList.length > 0" class="more" @click.self="test()">测试>></div> -->
+      </div>
     </div>
+  </div>
 </template>
 <script lang="ts">
-import { Tooltip, Badge } from 'ant-design-vue';
-import { SoundOutlined, ClearOutlined, BellOutlined, WarningOutlined } from '@ant-design/icons-vue';
-import Icon from '/@/components/Icon';
-import { defineComponent, ref, unref, onMounted, nextTick, computed } from 'vue';
-import { defHttp } from '/@/utils/http/axios';
-import { useRouter } from 'vue-router';
-import { connectWebSocket, onWebSocket } from '/@/hooks/web/useWebSocket';
-import { getToken } from '/@/utils/auth';
-import { useUserStore } from '/@/store/modules/user';
-import { useGlobSetting } from '/@/hooks/setting';
+  import { SoundOutlined, ClearOutlined, BellOutlined, WarningOutlined } from '@ant-design/icons-vue';
+  import { defineComponent, ref, unref, onMounted, nextTick, computed } from 'vue';
+  import { useRouter } from 'vue-router';
+  import { connectWebSocket, onWebSocket } from '/@/hooks/web/useWebSocket';
+  import { getToken } from '/@/utils/auth';
+  import { useUserStore } from '/@/store/modules/user';
+  import { useGlobSetting } from '/@/hooks/setting';
+  import SpeakVoice from './notify/speakVoice';
 
-import { useDrag } from '@/hooks/event/useDrag';
-export default defineComponent({
+  import { useDrag } from '@/hooks/event/useDrag';
+  export default defineComponent({
     name: 'VoiceBroadcast',
-    components: { Icon, Tooltip, Badge, SoundOutlined, ClearOutlined, BellOutlined, WarningOutlined },
+    components: { SoundOutlined, ClearOutlined, BellOutlined, WarningOutlined },
 
     setup() {
-        let websocketMsg = ref<any[]>([])
-        const userStore = useUserStore();
-        const glob = useGlobSetting();
-        const router = useRouter();
-        const activeKey = ref(0);
-        const isShowWarningBroad = ref(false);
-        const isWarningDot = ref(false);
-        let broadcastList = computed(() => {
-            return localStorage.getItem('messageArr');
-        })
-
-        //点击切换预警信息弹窗显示
-        function showWarningBroad() {
-            isShowWarningBroad.value = !isShowWarningBroad.value;
-            if (isShowWarningBroad.value) {
-                nextTick(() => {
-                    const dom = document.getElementById('VoiceBroadcast');
-                    if (dom) useDrag(dom);
-                });
-            }
-        }
+      let speakVoice;
+      let broadcastList = ref<any[]>([]);
+      const userStore = useUserStore();
+      const glob = useGlobSetting();
+      const router = useRouter();
+      const activeKey = ref(0);
+      const isShowWarningBroad = ref(false);
+      const isBroad = ref(false);
+      const isWarningDot = ref(false);
 
-        async function clearInfo() {
-            localStorage.removeItem('messageArr');
+      //点击切换预警信息弹窗显示
+      function showWarningBroad() {
+        isShowWarningBroad.value = !isShowWarningBroad.value;
+        if (isShowWarningBroad.value) {
+          nextTick(() => {
+            const dom = document.getElementById('VoiceBroadcast');
+            if (dom) useDrag(dom);
+          });
         }
+      }
+      function handleBroad() {
+        isBroad.value = !isBroad.value;
+        onWebSocketMessage('test');
+      }
+      async function clearInfo() {
+        broadcastList.value = [];
+        localStorage.removeItem('messageArr');
+      }
 
-        //点击跳转预警历史详情
-        async function toMore() {
-            await router.push({ path: '/monitorChannel/device-monitor/warningHistory/company/home' });
-            showWarningBroad();
-        }
+      //点击跳转预警历史详情
+      async function toMore() {
+        await router.push({ path: '/monitorChannel/device-monitor/warningHistory/company/home' });
+        showWarningBroad();
+      }
 
-        // 初始化 WebSocket
-        function initWebSocket() {
-            let token = getToken();
-            //将登录token生成一个短的标识
-            // let wsClientId = md5(token);
-            // let userId = unref(userStore.getUserInfo).id + '_' + wsClientId;
-            let userId = unref(userStore.getUserInfo).id + '?token=' + token;
-            // WebSocket与普通的请求所用协议有所不同，ws等同于http，wss等同于https
-            let url = glob.wsUrl?.replace('https://', 'wss://').replace('http://', 'ws://') + '/websocket/' + userId;
-            connectWebSocket(url);
-            onWebSocket(onWebSocketMessage);
-        }
+      // 初始化 WebSocket
+      function initWebSocket() {
+        let token = getToken();
+        //将登录token生成一个短的标识
+        // let wsClientId = md5(token);
+        // let userId = unref(userStore.getUserInfo).id + '_' + wsClientId;
+        let userId = unref(userStore.getUserInfo).id + '?token=' + token;
+        // WebSocket与普通的请求所用协议有所不同，ws等同于http，wss等同于https
+        let url = 'http://' + window.location.hostname + ':9999'?.replace('https://', 'wss://').replace('http://', 'ws://') + '/websocket/' + userId;
+        connectWebSocket(url);
+        onWebSocket(onWebSocketMessage);
+      }
 
-        async function onWebSocketMessage(data) {
-            debugger;
-            console.log('WebSocket 监测消息--------------》', data);
-            if (data.topic === 'warn' || data.cmd === 'user') {
-                const messageText = data['warndata'];
-                if (websocketMsg.value.length <= 20) {
-                    websocketMsg.value.push({ label: messageText })
-                    localStorage.removeItem('messageArr')
-                    localStorage.setItem('messageArr', websocketMsg.value as any);
-                } else {
-                    websocketMsg.value.push({ label: messageText })
-                    websocketMsg.value.splice(0, 1)
-                    localStorage.removeItem('messageArr')
-                    localStorage.setItem('messageArr', websocketMsg.value as any);
-                }
-                //   const messageText = '这是一个测试';
-                if (!isShowWarningBroad.value) {
-                    isWarningDot.value = true;
-                } else {
-                    isWarningDot.value = false;
-                }
-            }
+      async function onWebSocketMessage(data) {
+        console.log('WebSocket 监测消息--------------》', data);
+        if (data.topic === 'warn' || data.cmd === 'user') {
+          const messageText = data['warndata'];
+          if (broadcastList.value.length <= 20) {
+            broadcastList.value.push({ label: messageText });
+            localStorage.removeItem('messageArr');
+            localStorage.setItem('messageArr', broadcastList.value as any);
+          } else {
+            broadcastList.value.shift();
+            broadcastList.value.push({ label: messageText });
+            localStorage.removeItem('messageArr');
+            localStorage.setItem('messageArr', broadcastList.value as any);
+          }
+          if (isBroad.value) {
+            await speakVoice.getSpeechCnVoices();
+            speakVoice.handleReply(messageText);
+            const time = dayjs().format('YYYY-MM-DD HH:mm:ss');
+            console.log(time + '语音播报开始报警------>', data);
+          }
+          //   const messageText = '这是一个测试';
+          if (!isShowWarningBroad.value) {
+            isWarningDot.value = true;
+          } else {
+            isWarningDot.value = false;
+          }
         }
-        onMounted(() => {
-            nextTick(async () => {
-                initWebSocket();
-            });
-            // window.speechSynthesis.onvoiceschanged = () => {
-            //     console.log('语音列表已更新');
-            // };
+      }
+      onMounted(() => {
+        speakVoice = new SpeakVoice();
+        nextTick(async () => {
+          initWebSocket();
         });
-
-        return {
-            showWarningBroad,
-            isShowWarningBroad,
-            activeKey,
-            broadcastList,
-            toMore,
-            clearInfo,
-            isWarningDot,
+        window.speechSynthesis.onvoiceschanged = () => {
+          console.log('语音列表已更新');
         };
+      });
+
+      return {
+        showWarningBroad,
+        isShowWarningBroad,
+        activeKey,
+        broadcastList,
+        toMore,
+        clearInfo,
+        isWarningDot,
+        handleBroad,
+        isBroad,
+      };
     },
-});
+  });
 </script>
 <style lang="less" scoped>
-.btn {
+  .btn {
     line-height: 30px;
     margin-right: 20px;
     cursor: pointer;
     display: flex;
-}
+  }
 
-.no-play {
+  .no-play {
     position: relative;
-
     &::after {
-        position: absolute;
-        width: 70%;
-        height: 100%;
-        content: '';
-        left: 15%;
-        top: 0;
-        background: linear-gradient(to bottom left,
-                transparent 0%,
-                transparent calc(50% - 1px),
-                #ffffff 50%,
-                transparent calc(50% + 1px),
-                transparent 100%);
+      position: absolute;
+      width: 70%;
+      height: 100%;
+      content: '';
+      left: 15%;
+      top: 0;
+      background: linear-gradient(
+        to bottom left,
+        transparent 0%,
+        transparent calc(50% - 1px),
+        #ffffff 50%,
+        transparent calc(50% + 1px),
+        transparent 100%
+      );
     }
-}
+  }
 
-.broadcast {
+  .broadcast {
     width: 500px;
     height: 350px;
     border-radius: 4px;
@@ -188,121 +196,121 @@ export default defineComponent({
     color: #fff;
 
     .title {
-        height: 32px;
-        padding: 0 20px;
+      height: 32px;
+      padding: 0 20px;
 
-        :deep(.ant-badge:not(.ant-badge-status)) {
-            margin-right: 40px !important;
-        }
+      :deep(.ant-badge:not(.ant-badge-status)) {
+        margin-right: 40px !important;
+      }
 
-        display: flex;
-        align-items: center;
-        justify-content: space-between;
-        margin-bottom: 5px;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      margin-bottom: 5px;
 
-        .message-title {
-            font-size: 18px;
-            padding-top: 10px;
-        }
+      .message-title {
+        font-size: 18px;
+        padding-top: 10px;
+      }
 
-        .badge-box {
-            display: flex;
-            align-items: center;
-            padding-top: 10px;
+      .badge-box {
+        display: flex;
+        align-items: center;
+        padding-top: 10px;
 
-            .badge-title {
-                display: inline-block;
-                width: 62px;
-                line-height: 32px;
-                background-color: #2174f0;
-                border-radius: 26px;
-                text-align: center;
-                color: #fff;
-                padding-bottom: 2px;
-            }
+        .badge-title {
+          display: inline-block;
+          width: 62px;
+          line-height: 32px;
+          background-color: #2174f0;
+          border-radius: 26px;
+          text-align: center;
+          color: #fff;
+          padding-bottom: 2px;
         }
+      }
     }
 
     .broadcast-context {
-        .context-tab {
-            display: flex;
-            padding: 20px;
+      .context-tab {
+        display: flex;
+        padding: 20px;
 
-            .context-tab-item {
-                line-height: 24px;
-                background-color: #6b6b6b;
-                border-radius: 24px;
-                text-align: center;
-                padding: 0 10px;
-                color: #fff;
-                margin: 5px;
-                cursor: pointer;
-                font-size: 14px;
-            }
+        .context-tab-item {
+          line-height: 24px;
+          background-color: #6b6b6b;
+          border-radius: 24px;
+          text-align: center;
+          padding: 0 10px;
+          color: #fff;
+          margin: 5px;
+          cursor: pointer;
+          font-size: 14px;
+        }
 
-            .context-tab-item-active {
-                background-color: #2174f0;
-            }
+        .context-tab-item-active {
+          background-color: #2174f0;
         }
+      }
 
-        .context-box {
-            flex: 1;
-            padding: 0 10px;
-            height: 200px;
-            overflow-y: auto;
+      .context-box {
+        flex: 1;
+        padding: 0 10px;
+        height: 200px;
+        overflow-y: auto;
 
-            .no-context {
-                display: flex;
-                justify-content: center;
-                padding-top: 30px;
-                font-size: 16px;
-            }
+        .no-context {
+          display: flex;
+          justify-content: center;
+          padding-top: 30px;
+          font-size: 16px;
+        }
 
-            .context-detail {
-                width: 100%;
-                display: flex;
-                justify-content: space-between;
-                line-height: 24px;
-                padding: 0px 16px;
+        .context-detail {
+          width: 100%;
+          display: flex;
+          justify-content: space-between;
+          line-height: 24px;
+          padding: 0px 16px;
 
-                // div {
-                //     display: flex;
-                //     justify-content: flex-start;
+          // div {
+          //     display: flex;
+          //     justify-content: flex-start;
 
-                //     &:nth-child(1) {
-                //         width: 44%;
-                //     }
+          //     &:nth-child(1) {
+          //         width: 44%;
+          //     }
 
-                //     &:nth-child(2) {
-                //         width: 40%;
-                //     }
+          //     &:nth-child(2) {
+          //         width: 40%;
+          //     }
 
-                //     &:nth-child(3) {
-                //         width: 25%;
-                //     }
+          //     &:nth-child(3) {
+          //         width: 25%;
+          //     }
 
-                //     &:nth-child(4) {
-                //         width: 15%;
-                //     }
-                // }
-            }
+          //     &:nth-child(4) {
+          //         width: 15%;
+          //     }
+          // }
         }
+      }
 
-        .more {
-            position: absolute;
-            left: 24px;
-            bottom: 10px;
-            cursor: pointer;
+      .more {
+        position: absolute;
+        left: 24px;
+        bottom: 10px;
+        cursor: pointer;
 
-            &:hover {
-                color: #2174f0;
-            }
+        &:hover {
+          color: #2174f0;
         }
+      }
     }
-}
+  }
 
-:deep(.zxm-badge-count) {
+  :deep(.zxm-badge-count) {
     width: 8px;
     height: 8px;
-}
+  }
 </style>

src/layouts/default/header/index.vue

@@ -57,8 +57,8 @@
   <div :class="`${prefixCls}-action`" style="position: fixed; top: 30px; right: 20px; z-index: 999999">
     <div class="right-position">
       <!-- 公司端不显示语音播报功能 -->
-      <VoiceBroadcast v-if="sysOrgCode != 'sdmtjtgsd'" />
-      <VoiceBroadcastGsd v-if="sysOrgCode == 'sdmtjtgsd'" />
+      <!-- <VoiceBroadcast v-if="sysOrgCode != 'sdmtjtgsd'" /> -->
+      <VoiceBroadcastGsd v-if="sysOrgCode != 'sdmtjtgsd'" />
       <UserDropDown v-if="showUserDropdown" :theme="getHeaderTheme" />
       <LoginSelect ref="loginSelectRef" @success="loginSelectOk" />
     </div>

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

@@ -6,11 +6,13 @@
       :sysId="deviceId"
       designScope="pressurefan_history"
       :scroll="{ y: 650 }"
+      :only-bouned-devices="true"
+      :show-history-curve="showHistoryCurve"
     />
   </div>
 </template>
 <script setup lang="ts">
-  import { ref, defineProps } from 'vue';
+  import { defineProps, computed } from 'vue';
   import HistoryTable from '../../comment/HistoryTable.vue';
   // import { getTableList } from '../balancePress.api'
 
@@ -24,6 +26,11 @@
       required: true,
     },
   });
+
+  const showHistoryCurve = computed(() => {
+    const arr = ['safetymonitor', 'windrect'];
+    return arr.some((e) => props.deviceType.startsWith(e));
+  });
 </script>
 <style lang="less" scoped>
   .history-box {

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

@@ -22,6 +22,18 @@
         <a-button type="primary" preIcon="ant-design:export-outlined" @click="onExportXlsFn"> 导出</a-button>
       </template>
     </BasicTable>
+    <BarAndLine
+      v-if="showHistoryCurve"
+      :charts-columns="chartsColumns"
+      :option="{
+        legend: {
+          top: '5',
+        },
+      }"
+      :data-source="dataSource"
+      height="250px"
+      x-axis-prop-type="ttime"
+    />
   </div>
 </template>
 
@@ -37,6 +49,7 @@
   import { getAutoScrollContainer } from '/@/utils/common/compUtils';
   import { render } from '/@/utils/common/renderUtils';
   import { useMethods } from '/@/hooks/system/useMethods';
+  import BarAndLine from '/@/components/chart/BarAndLine.vue';
 
   const globalConfig = inject('globalConfig');
   const props = defineProps({
@@ -77,6 +90,15 @@
       type: Array<FormSchema>,
       default: () => [],
     },
+    /** 仅展示已绑定设备，选择是则从系统中获取sysId下已绑定设备。仅能查询到已绑定设备的历史数据 */
+    onlyBounedDevices: {
+      type: Boolean,
+      default: false,
+    },
+    showHistoryCurve: {
+      type: Boolean,
+      default: false,
+    },
   });
   const getDeviceListApi = (params) => defHttp.post({ url: '/monitor/device', params });
   const historyTable = ref();
@@ -112,6 +134,7 @@
   const deviceTypeStr = ref('');
   const deviceTypeName = ref('');
   const deviceType = ref('');
+  const chartsColumns = ref([]);
   loading.value = true;
 
   watch(
@@ -163,6 +186,10 @@
     } else {
       columns.value = column;
     }
+    if (props.showHistoryCurve) {
+      const arr = type.split('_');
+      chartsColumns.value = getTableHeaderColumns(arr[0] + '_chart');
+    }
     setColumns(columns.value);
   });
 
@@ -193,50 +220,40 @@
     }
   );
 
+  /** 获取可供查询历史数据的设备列表 */
   async function getDeviceList() {
     // if (props.deviceType.split('_')[1] && props.deviceType.split('_')[1] === 'history') return;
     let result;
-    if (!props.sysId) {
-      if (props.deviceListApi) {
-        const res = await props.deviceListApi();
-        if (props.deviceType.startsWith('modelsensor')) {
-          if (res['msgTxt'] && res['msgTxt'][0] && res['msgTxt'][0]['datalist']) {
-            result = res['msgTxt'][0]['datalist'];
-          }
-        } else {
-          if (res['records'] && res['records'].length > 0) result = res['records'];
-        }
-        if (res['msgTxt'] && res['msgTxt'][0]) {
-          deviceTypeName.value = res['msgTxt'][0]['typeName'];
-          deviceType.value = res['msgTxt'][0]['type'];
-        }
-      } else {
-        const res = await getDeviceListApi({ devicetype: props.deviceType, pageSize: 10000 });
-        if (res['records'] && res['records'].length > 0) {
-          result = res['records'];
-        } else if (res['msgTxt'] && res['msgTxt'][0] && res['msgTxt'][0]['datalist']) {
-          result = res['msgTxt'][0]['datalist'];
-        }
-        if (res['msgTxt'] && res['msgTxt'][0]) {
-          deviceTypeName.value = res['msgTxt'][0]['typeName'];
-          deviceType.value = res['msgTxt'][0]['type'];
-        }
-      }
-    } else {
-      const res = await getDeviceListApi({
+    let response;
+    if (props.onlyBounedDevices) {
+      response = await getDeviceListApi({
+        systemID: props.sysId,
+        devicetype: 'sys',
+        pageSize: 10000,
+      }).then(({ msgTxt }) => {
+        return { msgTxt: msgTxt.filter((e) => e.type === props.deviceType) };
+      });
+    } else if (props.sysId) {
+      response = await getDeviceListApi({
         sysId: props.sysId,
         devicetype: props.deviceType.startsWith('vehicle') ? 'location_normal' : props.deviceType,
         pageSize: 10000,
       });
-      if (res['records'] && res['records'].length > 0) {
-        result = res['records'];
-      } else if (res['msgTxt'] && res['msgTxt'][0] && res['msgTxt'][0]['datalist']) {
-        result = res['msgTxt'][0]['datalist'];
-      }
-      if (res['msgTxt'] && res['msgTxt'][0]) {
-        deviceTypeName.value = res['msgTxt'][0]['typeName'];
-        deviceType.value = res['msgTxt'][0]['type'];
-      }
+    } else if (props.deviceListApi) {
+      response = await props.deviceListApi();
+    } else {
+      response = await getDeviceListApi({ devicetype: props.deviceType, pageSize: 10000 });
+    }
+
+    // 处理不同格式的数据
+    if (response['records'] && response['records'].length > 0) {
+      result = response['records'];
+    } else if (response['msgTxt'] && response['msgTxt'][0] && response['msgTxt'][0]['datalist']) {
+      result = response['msgTxt'][0]['datalist'];
+    }
+    if (response['msgTxt'] && response['msgTxt'][0]) {
+      deviceTypeName.value = response['msgTxt'][0]['typeName'];
+      deviceType.value = response['msgTxt'][0]['type'];
     }
 
     if (result) {

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

@@ -9,317 +9,316 @@
 </template>
 
 <script lang="ts" name="system-user" setup>
-//ts语法
-import { watch, ref, defineExpose, inject, onMounted } from 'vue';
-import { BasicTable } from '/@/components/Table';
-import { useListPage } from '/@/hooks/system/useListPage';
-import { getTableHeaderColumns } from '/@/hooks/web/useWebColumns';
-import { defHttp } from '/@/utils/http/axios';
-import dayjs from 'dayjs';
-import { getAutoScrollContainer } from '/@/utils/common/compUtils';
-import { safetyDeviceList, safetyList } from './safety.api';
+  //ts语法
+  import { watch, ref, defineExpose, inject, onMounted } from 'vue';
+  import { BasicTable } from '/@/components/Table';
+  import { useListPage } from '/@/hooks/system/useListPage';
+  import { getTableHeaderColumns } from '/@/hooks/web/useWebColumns';
+  import { defHttp } from '/@/utils/http/axios';
+  import dayjs from 'dayjs';
+  import { getAutoScrollContainer } from '/@/utils/common/compUtils';
+  import { safetyDeviceList, safetyList } from './safety.api';
 
-const props = defineProps({
-  columnsType: {
-    type: String,
-    required: true,
-  },
-  columns: {
-    type: Array,
-    // required: true,
-    default: () => [],
-  },
-  deviceType: {
-    type: String,
-    required: true,
-  },
-  deviceListApi: {
-    type: Function,
-  },
-  designScope: {
-    type: String,
-  },
-  sysId: {
-    type: String,
-  },
-  scroll: {
-    type: Object,
-    default: { y: 0 },
-  },
-  list: {
-    type: Function,
-    default: (params) => defHttp.get({ url: '/safety/ventanalyAlarmLog/list', params }),
-  },
-});
-
-const getDeviceListApi = (params) => defHttp.post({ url: '/monitor/device', params });
-const globalConfig = inject('globalConfig');
-const alarmHistory = ref();
-const columns = ref([]);
-const deviceOptions = ref([]);
-const dataTypeName = ref('');
+  const props = defineProps({
+    columnsType: {
+      type: String,
+      required: true,
+    },
+    columns: {
+      type: Array,
+      // required: true,
+      default: () => [],
+    },
+    deviceType: {
+      type: String,
+      required: true,
+    },
+    deviceListApi: {
+      type: Function,
+    },
+    designScope: {
+      type: String,
+    },
+    sysId: {
+      type: String,
+    },
+    scroll: {
+      type: Object,
+      default: { y: 0 },
+    },
+    list: {
+      type: Function,
+      default: (params) => defHttp.get({ url: '/safety/ventanalyAlarmLog/list', params }),
+    },
+  });
 
-const tableScroll = props.scroll.y ? ref({ y: props.scroll.y - 100 }) : ref({});
+  const getDeviceListApi = (params) => defHttp.post({ url: '/monitor/device', params });
+  const globalConfig = inject('globalConfig');
+  const alarmHistory = ref();
+  const columns = ref([]);
+  const deviceOptions = ref([]);
+  const dataTypeName = ref('');
 
-async function getDeviceList() {
-  let result;
-  const res = await getDeviceListApi({ devicetype: props.deviceType, filterParams: { dataTypeName: dataTypeName.value }, pageSize: 10000 });
-  if (res['records'] && res['records'].length > 0) {
-    result = res['records'];
-  } else if (res['msgTxt'] && res['msgTxt'][0] && res['msgTxt'][0]['datalist']) {
-    result = res['msgTxt'][0]['datalist'];
-  }
-  if (result && result.length > 0) {
-    deviceOptions.value = [];
-    deviceOptions.value = result.map((item, index) => {
-      return {
-        label: item['strinstallpos'],
-        value: item['id'] || item['deviceID'],
-        strtype: item['strtype'] || item['deviceType'],
-        strinstallpos: item['strinstallpos'],
-        devicekind: item['devicekind'],
-        stationtype: item['stationtype'],
-      };
-    });
-  } else {
-    deviceOptions.value = [];
-  }
-  await getForm().setFieldsValue({ deviceId: deviceOptions.value[0] ? deviceOptions.value[0]['value'] : '' });
-}
+  const tableScroll = props.scroll.y ? ref({ y: props.scroll.y - 100 }) : ref({});
 
-watch(
-  () => {
-    return props.columnsType;
-  },
-  async (newVal) => {
-    if (!newVal) return;
-    let column;
-    column = getTableHeaderColumns('safetymonitor_warning');
-    if (!column || column.length < 1) {
-      column = getTableHeaderColumns(newVal + '_history');
+  async function getDeviceList() {
+    let result;
+    const res = await getDeviceListApi({ devicetype: props.deviceType, filterParams: { dataTypeName: dataTypeName.value }, pageSize: 10000 });
+    if (res['records'] && res['records'].length > 0) {
+      result = res['records'];
+    } else if (res['msgTxt'] && res['msgTxt'][0] && res['msgTxt'][0]['datalist']) {
+      result = res['msgTxt'][0]['datalist'];
     }
-    if (column && column.length < 1) {
-      const arr = newVal.split('_');
-      const columnKey = arr.reduce((prev, cur, index) => {
-        if (index !== arr.length - 2) {
-          return prev + '_' + cur;
-        } else {
-          return prev;
-        }
+    if (result && result.length > 0) {
+      deviceOptions.value = [];
+      deviceOptions.value = result.map((item, index) => {
+        return {
+          label: item['strinstallpos'],
+          value: item['id'] || item['deviceID'],
+          strtype: item['strtype'] || item['deviceType'],
+          strinstallpos: item['strinstallpos'],
+          devicekind: item['devicekind'],
+          stationtype: item['stationtype'],
+        };
       });
-      columns.value = getTableHeaderColumns(arr[0] + '_history');
     } else {
-      columns.value = column;
+      deviceOptions.value = [];
     }
-    if (alarmHistory.value) reload();
-  },
-  {
-    immediate: true,
+    await getForm().setFieldsValue({ deviceId: deviceOptions.value[0] ? deviceOptions.value[0]['value'] : '' });
   }
-);
 
-watch(
-  () => props.deviceType,
-  async () => {
-    if (alarmHistory.value) getForm().resetFields();
-    await getDeviceList();
-  }
-);
+  watch(
+    () => {
+      return props.columnsType;
+    },
+    async (newVal) => {
+      if (!newVal) return;
+      let column;
+      column = getTableHeaderColumns('safetymonitor_warning');
+      if (!column || column.length < 1) {
+        column = getTableHeaderColumns(newVal + '_history');
+      }
+      if (column && column.length < 1) {
+        const arr = newVal.split('_');
+        const columnKey = arr.reduce((prev, cur, index) => {
+          if (index !== arr.length - 2) {
+            return prev + '_' + cur;
+          } else {
+            return prev;
+          }
+        });
+        columns.value = getTableHeaderColumns(arr[0] + '_history');
+      } else {
+        columns.value = column;
+      }
+      if (alarmHistory.value) reload();
+    },
+    {
+      immediate: true,
+    }
+  );
 
-watch(
-  () => props.scroll.y,
-  (newVal) => {
-    if (newVal) {
-      tableScroll.value = { y: newVal - 100 };
-    } else {
-      tableScroll.value = {};
+  watch(
+    () => props.deviceType,
+    async () => {
+      if (alarmHistory.value) getForm().resetFields();
+      await getDeviceList();
     }
-  }
-);
+  );
 
-// 列表页面公共参数、方法
-const { tableContext, onExportXls } = useListPage({
-  tableProps: {
-    api: safetyList,
-    columns: props.columnsType ? columns : (props.columns as any[]),
-    canResize: false,
-    showTableSetting: false,
-    showActionColumn: false,
-    bordered: false,
-    showIndexColumn: true,
-    size: 'small',
-    scroll: tableScroll,
-    formConfig: {
-      labelAlign: 'left',
-      showAdvancedButton: false,
-      // autoAdvancedCol: 2,
-      actionColOptions: {
+  watch(
+    () => props.scroll.y,
+    (newVal) => {
+      if (newVal) {
+        tableScroll.value = { y: newVal - 100 };
+      } else {
+        tableScroll.value = {};
+      }
+    }
+  );
 
-        xs: 4, // <576px
-        sm: 14, // ≥576px
-        md: 4, // ≥768px
-        lg: 4, // ≥992px
-        xl: 4, // ≥1200px
-        xxl: 4, // ≥1600px
+  // 列表页面公共参数、方法
+  const { tableContext, onExportXls } = useListPage({
+    tableProps: {
+      api: safetyList,
+      columns: props.columnsType ? columns : (props.columns as any[]),
+      canResize: false,
+      showTableSetting: false,
+      showActionColumn: false,
+      bordered: false,
+      showIndexColumn: true,
+      size: 'small',
+      scroll: tableScroll,
+      formConfig: {
+        labelAlign: 'left',
+        showAdvancedButton: false,
+        // autoAdvancedCol: 2,
+        actionColOptions: {
+          xs: 4, // <576px
+          sm: 14, // ≥576px
+          md: 4, // ≥768px
+          lg: 4, // ≥992px
+          xl: 4, // ≥1200px
+          xxl: 4, // ≥1600px
 
-        style: { textAlign: 'left' },
-      },
-      schemas: [
-        {
-          field: 'startTime',
-          label: '开始时间',
-          component: 'DatePicker',
-          defaultValue: dayjs().add(-30, 'day').format('YYYY-MM-DD HH:mm:ss'),
-          required: true,
-          componentProps: {
-            showTime: true,
-            valueFormat: 'YYYY-MM-DD HH:mm:ss',
-            getPopupContainer: getAutoScrollContainer,
-          },
-          colProps: {
-            span: 4,
-          },
+          style: { textAlign: 'left' },
         },
-        {
-          field: 'endTime',
-          label: '结束时间',
-          component: 'DatePicker',
-          defaultValue: dayjs(),
-          required: true,
-          componentProps: {
-            showTime: true,
-            valueFormat: 'YYYY-MM-DD HH:mm:ss',
-            getPopupContainer: getAutoScrollContainer,
-          },
-          colProps: {
-            span: 4,
-          },
-        },
-        {
-          label: '设备类型',
-          field: 'dataTypeName',
-          component: 'ApiSelect',
-          componentProps: {
-            api: safetyDeviceList.bind(null, { devicetype: 'safetymonitor', code: 'dataTypeName' }),
-            labelField: 'name',
-            valueField: 'code',
-            onChange: async (e, option) => {
-              console.log('1111', e, option);
-              dataTypeName.value = e;
-              await getDeviceList();
+        schemas: [
+          {
+            field: 'startTime',
+            label: '开始时间',
+            component: 'DatePicker',
+            defaultValue: dayjs().add(-30, 'day').format('YYYY-MM-DD HH:mm:ss'),
+            required: true,
+            componentProps: {
+              showTime: true,
+              valueFormat: 'YYYY-MM-DD HH:mm:ss',
+              getPopupContainer: getAutoScrollContainer,
             },
-          },
-          colProps: {
-            span: 4,
-          },
-        },
-        {
-          label: '查询设备',
-          field: 'deviceId',
-          component: 'Select',
-          defaultValue: deviceOptions.value[0] ? deviceOptions.value[0]['value'] : '',
-          componentProps: {
-            showSearch: true,
-            filterOption: (input: string, option: any) => {
-              return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0;
+            colProps: {
+              span: 4,
             },
-            options: deviceOptions,
           },
-          colProps: {
-            span: 4,
+          {
+            field: 'endTime',
+            label: '结束时间',
+            component: 'DatePicker',
+            defaultValue: dayjs(),
+            required: true,
+            componentProps: {
+              showTime: true,
+              valueFormat: 'YYYY-MM-DD HH:mm:ss',
+              getPopupContainer: getAutoScrollContainer,
+            },
+            colProps: {
+              span: 4,
+            },
           },
-        },
-        {
-          label: '是否解决',
-          field: 'isok',
-          component: 'Select',
-          componentProps: {
-            options: [
-              {
-                label: '未解决',
-                value: '0',
+          {
+            label: '设备类型',
+            field: 'dataTypeName',
+            component: 'ApiSelect',
+            componentProps: {
+              api: safetyDeviceList.bind(null, { devicetype: 'safetymonitor', code: 'dataTypeName' }),
+              labelField: 'name',
+              valueField: 'code',
+              onChange: async (e, option) => {
+                console.log('1111', e, option);
+                dataTypeName.value = e;
+                await getDeviceList();
               },
-              {
-                label: '已解决',
-                value: '1',
+            },
+            colProps: {
+              span: 4,
+            },
+          },
+          {
+            label: '查询设备',
+            field: 'deviceId',
+            component: 'Select',
+            defaultValue: deviceOptions.value[0] ? deviceOptions.value[0]['value'] : '',
+            componentProps: {
+              showSearch: true,
+              filterOption: (input: string, option: any) => {
+                return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0;
               },
-            ],
+              options: deviceOptions,
+            },
+            colProps: {
+              span: 4,
+            },
           },
-          colProps: { span: 4 },
-        },
-      ],
-    },
-    fetchSetting: {
-      listField: 'records',
+          {
+            label: '是否解决',
+            field: 'isok',
+            component: 'Select',
+            componentProps: {
+              options: [
+                {
+                  label: '未解决',
+                  value: '0',
+                },
+                {
+                  label: '已解决',
+                  value: '1',
+                },
+              ],
+            },
+            colProps: { span: 4 },
+          },
+        ],
+      },
+      fetchSetting: {
+        listField: 'records',
+      },
+      pagination: {
+        current: 1,
+        pageSize: 10,
+        pageSizeOptions: ['10', '30', '50', '100'],
+      },
+      // beforeFetch(params) {
+      //   params.devicetype = props.deviceType + '*';
+      //   if (props.sysId) {
+      //     params.sysId = props.sysId;
+      //   }
+      // },
     },
-    pagination: {
-      current: 1,
-      pageSize: 10,
-      pageSizeOptions: ['10', '30', '50', '100'],
+    exportConfig: {
+      name: '预警历史列表',
+      url: '/safety/ventanalyAlarmLog/exportXls',
     },
-    // beforeFetch(params) {
-    //   params.devicetype = props.deviceType + '*';
-    //   if (props.sysId) {
-    //     params.sysId = props.sysId;
-    //   }
-    // },
-  },
-  exportConfig: {
-    name: '预警历史列表',
-    url: '/safety/ventanalyAlarmLog/exportXls',
-  },
-});
-//注册table数据
-const [registerTable, { reload, setLoading, getForm }] = tableContext;
+  });
+  //注册table数据
+  const [registerTable, { reload, setLoading, getForm }] = tableContext;
 
-onMounted(async () => {
-  await getDeviceList();
-});
+  onMounted(async () => {
+    await getDeviceList();
+  });
 
-defineExpose({ setLoading });
+  defineExpose({ setLoading });
 </script>
 
 <style scoped lang="less">
-@ventSpace: zxm;
+  @ventSpace: zxm;
 
-:deep(.ventSpace-table-body) {
-  height: auto !important;
-}
+  :deep(.ventSpace-table-body) {
+    height: auto !important;
+  }
 
-:deep(.zxm-picker) {
-  height: 30px !important;
-}
+  :deep(.zxm-picker) {
+    height: 30px !important;
+  }
 
-.alarm-history-table {
-  width: 100%;
+  .alarm-history-table {
+    width: 100%;
 
-  :deep(.jeecg-basic-table-form-container) {
-    .@{ventSpace}-form {
-      padding: 0 !important;
-      border: none !important;
-      margin-bottom: 0 !important;
+    :deep(.jeecg-basic-table-form-container) {
+      .@{ventSpace}-form {
+        padding: 0 !important;
+        border: none !important;
+        margin-bottom: 0 !important;
 
-      .@{ventSpace}-picker,
-      .@{ventSpace}-select-selector {
-        width: 100% !important;
-        background: #00000017;
-        border: 1px solid #b7b7b7;
+        .@{ventSpace}-picker,
+        .@{ventSpace}-select-selector {
+          width: 100% !important;
+          background: #00000017;
+          border: 1px solid #b7b7b7;
 
-        input,
-        .@{ventSpace}-select-selection-item,
-        .@{ventSpace}-picker-suffix {
-          color: #fff;
-        }
+          input,
+          .@{ventSpace}-select-selection-item,
+          .@{ventSpace}-picker-suffix {
+            color: #fff;
+          }
 
-        .@{ventSpace}-select-selection-placeholder {
-          color: #ffffffaa;
+          .@{ventSpace}-select-selection-placeholder {
+            color: #ffffffaa;
+          }
         }
       }
-    }
 
-    .@{ventSpace}-table-title {
-      min-height: 0 !important;
+      .@{ventSpace}-table-title {
+        min-height: 0 !important;
+      }
     }
   }
-}
 </style>

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

@@ -171,9 +171,9 @@
           />
         </div>
       </a-tab-pane>
-      <a-tab-pane key="5" tab="报警分析" >
+      <a-tab-pane key="5" tab="报警分析">
         <div class="tab-item">
-          <safetyWarnAnalysis  :device-type="deviceType"></safetyWarnAnalysis>
+          <safetyWarnAnalysis :device-type="deviceType" />
         </div>
       </a-tab-pane>
     </a-tabs>
@@ -202,7 +202,7 @@
   import { ref, onMounted, onUnmounted, shallowRef, defineProps, watch, inject, unref } from 'vue';
   import { list, getDeviceList, safetyList, getExportUrl, subStationList, initSubStation } from './safety.api';
   // import AlarmHistoryCommentTable from '../comment/AlarmHistoryTable.vue';
-  import  safetyWarnAnalysis from '../comment/safetyWarnAnalysis.vue'
+  import safetyWarnAnalysis from '../comment/safetyWarnAnalysis.vue';
   import AlarmHistoryTable from './AlarmHistoryTable.vue';
   import HistoryTable from './HistoryTable.vue';
   import HandlerHistoryTable from '../comment/HandlerHistoryTable.vue';
@@ -655,7 +655,7 @@
 
     .@{ventSpace}-picker,
     .@{ventSpace}-select-selector {
-      width: 100% ;
+      width: 100%;
       background: #00000017 !important;
       border: 1px solid @vent-form-item-border !important;
 

src/views/vent/monitorManager/safetySensorMonitor/AlarmHistoryTable.vue

@@ -0,0 +1,304 @@
+<template>
+  <div class="alarm-history-table">
+    <BasicTable ref="alarmHistory" @register="registerTable">
+      <template #form-onExportXls>
+        <a-button type="primary" preIcon="ant-design:export-outlined" @click="onExportXls()"> 导出</a-button>
+      </template>
+    </BasicTable>
+  </div>
+</template>
+
+<script lang="ts" name="safetyAlarm" setup>
+  //ts语法
+  import { watch, ref, defineExpose, inject, onMounted } from 'vue';
+  import { BasicTable } from '/@/components/Table';
+  import { useListPage } from '/@/hooks/system/useListPage';
+  import { getTableHeaderColumns } from '/@/hooks/web/useWebColumns';
+  import { defHttp } from '/@/utils/http/axios';
+  import dayjs from 'dayjs';
+  import { getAutoScrollContainer } from '/@/utils/common/compUtils';
+  import { safetyDeviceList, safetyList } from '../safetyMonitor/safety.api';
+  import { getDictItemsByCode } from '/@/utils/dict';
+
+  const props = defineProps({
+    columnsType: {
+      type: String,
+      required: true,
+    },
+    columns: {
+      type: Array,
+      // required: true,
+      default: () => [],
+    },
+    deviceType: {
+      type: String,
+      required: true,
+    },
+    deviceListApi: {
+      type: Function,
+    },
+    designScope: {
+      type: String,
+    },
+    sysId: {
+      type: String,
+    },
+    scroll: {
+      type: Object,
+      default: { y: 0 },
+    },
+    list: {
+      type: Function,
+      default: (params) => defHttp.get({ url: '/safety/ventanalyAlarmLog/list', params }),
+    },
+  });
+
+  const getDeviceListApi = (params) => defHttp.post({ url: '/monitor/device', params });
+  const globalConfig = inject('globalConfig');
+  const alarmHistory = ref();
+  const columns = ref([]);
+  const deviceOptions = ref([]);
+  const dataTypeName = ref('');
+
+  const tableScroll = props.scroll.y ? ref({ y: props.scroll.y - 100 }) : ref({});
+
+  async function getDeviceList() {
+    let result;
+    const res = await getDeviceListApi({ devicetype: props.deviceType, filterParams: { dataTypeName: dataTypeName.value }, pageSize: 10000 });
+    if (res['records'] && res['records'].length > 0) {
+      result = res['records'];
+    } else if (res['msgTxt'] && res['msgTxt'][0] && res['msgTxt'][0]['datalist']) {
+      result = res['msgTxt'][0]['datalist'];
+    }
+    if (result && result.length > 0) {
+      deviceOptions.value = [];
+      deviceOptions.value = result.map((item, index) => {
+        return {
+          label: item['strinstallpos'],
+          value: item['id'] || item['deviceID'],
+          strtype: item['strtype'] || item['deviceType'],
+          strinstallpos: item['strinstallpos'],
+          devicekind: item['devicekind'],
+          stationtype: item['stationtype'],
+        };
+      });
+    } else {
+      deviceOptions.value = [];
+    }
+    await getForm().setFieldsValue({ deviceId: deviceOptions.value[0] ? deviceOptions.value[0]['value'] : '' });
+  }
+
+  watch(
+    () => {
+      return props.columnsType;
+    },
+    async (newVal) => {
+      if (!newVal) return;
+      let column;
+      column = getTableHeaderColumns('safetymonitor_warning');
+      if (!column || column.length < 1) {
+        column = getTableHeaderColumns(newVal + '_history');
+      }
+      if (column && column.length < 1) {
+        const arr = newVal.split('_');
+        const columnKey = arr.reduce((prev, cur, index) => {
+          if (index !== arr.length - 2) {
+            return prev + '_' + cur;
+          } else {
+            return prev;
+          }
+        });
+        columns.value = getTableHeaderColumns(arr[0] + '_history');
+      } else {
+        columns.value = column;
+      }
+      if (alarmHistory.value) reload();
+    },
+    {
+      immediate: true,
+    }
+  );
+
+  watch(
+    () => props.deviceType,
+    async () => {
+      if (alarmHistory.value) getForm().resetFields();
+      await getDeviceList();
+    }
+  );
+
+  watch(
+    () => props.scroll.y,
+    (newVal) => {
+      if (newVal) {
+        tableScroll.value = { y: newVal - 100 };
+      } else {
+        tableScroll.value = {};
+      }
+    }
+  );
+
+  // 列表页面公共参数、方法
+  const { tableContext, onExportXls } = useListPage({
+    tableProps: {
+      api: safetyList,
+      columns: props.columnsType ? columns : (props.columns as any[]),
+      canResize: false,
+      showTableSetting: false,
+      showActionColumn: false,
+      bordered: false,
+      showIndexColumn: true,
+      size: 'small',
+      scroll: tableScroll,
+      formConfig: {
+        labelAlign: 'left',
+        showAdvancedButton: false,
+        // autoAdvancedCol: 2,
+        actionColOptions: {
+          xs: 4, // <576px
+          sm: 14, // ≥576px
+          md: 4, // ≥768px
+          lg: 4, // ≥992px
+          xl: 4, // ≥1200px
+          xxl: 4, // ≥1600px
+
+          style: { textAlign: 'left' },
+        },
+        schemas: [
+          {
+            field: 'startTime',
+            label: '开始时间',
+            component: 'DatePicker',
+            defaultValue: dayjs().add(-30, 'day').format('YYYY-MM-DD HH:mm:ss'),
+            required: true,
+            componentProps: {
+              showTime: true,
+              valueFormat: 'YYYY-MM-DD HH:mm:ss',
+              getPopupContainer: getAutoScrollContainer,
+            },
+            colProps: {
+              span: 4,
+            },
+          },
+          {
+            field: 'endTime',
+            label: '结束时间',
+            component: 'DatePicker',
+            defaultValue: dayjs(),
+            required: true,
+            componentProps: {
+              showTime: true,
+              valueFormat: 'YYYY-MM-DD HH:mm:ss',
+              getPopupContainer: getAutoScrollContainer,
+            },
+            colProps: {
+              span: 4,
+            },
+          },
+          {
+            label: '设备类型',
+            field: 'dataTypeName',
+            component: 'ApiSelect',
+            componentProps: {
+              api: getDictItemsByCode.bind(null, 'safetySensorAlarm'),
+              onChange: async (e, option) => {
+                dataTypeName.value = e;
+                await getDeviceList();
+              },
+            },
+            colProps: {
+              span: 4,
+            },
+          },
+          {
+            label: '查询设备',
+            field: 'deviceId',
+            component: 'Select',
+            defaultValue: deviceOptions.value[0] ? deviceOptions.value[0]['value'] : '',
+            componentProps: {
+              showSearch: true,
+              filterOption: (input: string, option: any) => {
+                return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0;
+              },
+              options: deviceOptions,
+            },
+            colProps: {
+              span: 4,
+            },
+          },
+        ],
+      },
+      fetchSetting: {
+        listField: 'records',
+      },
+      pagination: {
+        current: 1,
+        pageSize: 10,
+        pageSizeOptions: ['10', '30', '50', '100'],
+      },
+      // beforeFetch(params) {
+      //   params.devicetype = props.deviceType + '*';
+      //   if (props.sysId) {
+      //     params.sysId = props.sysId;
+      //   }
+      // },
+    },
+    exportConfig: {
+      name: '预警历史列表',
+      url: '/safety/ventanalyAlarmLog/exportXls',
+    },
+  });
+  //注册table数据
+  const [registerTable, { reload, setLoading, getForm }] = tableContext;
+
+  onMounted(async () => {
+    await getDeviceList();
+  });
+
+  defineExpose({ setLoading });
+</script>
+
+<style scoped lang="less">
+  @ventSpace: zxm;
+
+  :deep(.ventSpace-table-body) {
+    height: auto !important;
+  }
+
+  :deep(.zxm-picker) {
+    height: 30px !important;
+  }
+
+  .alarm-history-table {
+    width: 100%;
+
+    :deep(.jeecg-basic-table-form-container) {
+      .@{ventSpace}-form {
+        padding: 0 !important;
+        border: none !important;
+        margin-bottom: 0 !important;
+
+        .@{ventSpace}-picker,
+        .@{ventSpace}-select-selector {
+          width: 100% !important;
+          background: #00000017;
+          border: 1px solid #b7b7b7;
+
+          input,
+          .@{ventSpace}-select-selection-item,
+          .@{ventSpace}-picker-suffix {
+            color: #fff;
+          }
+
+          .@{ventSpace}-select-selection-placeholder {
+            color: #ffffffaa;
+          }
+        }
+      }
+
+      .@{ventSpace}-table-title {
+        min-height: 0 !important;
+      }
+    }
+  }
+</style>

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

@@ -0,0 +1,396 @@
+<template>
+  <div class="sensor-container">
+    <a-spin :spinning="loading">
+      <a-tabs class="tabs-box" type="card" v-model:activeKey="activeKey" @change="tabChange">
+        <a-tab-pane key="1" tab="实时监测">
+          <div class="box-bg table-box" style="margin-bottom: 10px">
+            <div>
+              <label style="color: var(--vent-font-color)">设备类型：</label>
+              <Select
+                @change="handleSensorChange"
+                :options="deviceTypeOption"
+                :fieldNames="{ label: 'label', value: 'value' }"
+                v-model:value="deviceKind"
+                style="width: 200px; margin-bottom: 5px; color: black"
+                placeholder="请选择设备类型"
+                :allowClear="true"
+              />
+              <!--hnjmypmk 崖坪 特有 -->
+              <template v-if="deviceKind === 'modelsensor_multi' && sysOrgCode === 'hnjmypmk'">
+                <a-button type="primary" preIcon="ant-design:export-outlined" @click="onExportXlsFn"> 导出</a-button>
+              </template>
+              <MonitorTable
+                ref="SensorMonitorRef"
+                :is-show-select="true"
+                :columnsType="deviceKind + '_monitor'"
+                :dataSource="dataSource"
+                design-scope="modelsensor_monitor"
+                @select-row="getSelectRow"
+                :deviceType="deviceKind"
+                :scroll="{ y: chartsColumns.length > 0 ? 600 : 600 }"
+                size="''"
+                title="传感器监测"
+              >
+                <template #filterCell="{ column, record }">
+                  <a-tag v-if="column.dataIndex === 'warnFlag'" :color="record.warnFlag == '0' ? 'green' : 'red'">{{
+                    record.warnFlag == '0' ? '正常' : '报警'
+                  }}</a-tag>
+                  <a-tag v-if="column.dataIndex === 'netStatus'" :color="record.netStatus == '0' ? 'default' : 'green'">{{
+                    record.netStatus == '0' ? '断开' : '连接'
+                  }}</a-tag>
+                </template>
+              </MonitorTable>
+            </div>
+          </div>
+        </a-tab-pane>
+        <a-tab-pane key="3" tab="报警历史">
+          <div class="tab-item box-bg" v-if="activeKey == '3'">
+            <SafetyAlarm
+              ref="alarmHistoryTable"
+              v-if="activeKey == '3'"
+              columns-type="alarm"
+              :list="safetyList"
+              device-type="safetymonitor"
+              :device-list-api="getDeviceList.bind(null, { devicekind: 'safetymonitor', pageSize: 10000 })"
+              designScope="alarm-history"
+            />
+          </div>
+        </a-tab-pane>
+      </a-tabs>
+    </a-spin>
+  </div>
+</template>
+
+<script setup lang="ts">
+  import { Select } from 'ant-design-vue';
+  import { onBeforeMount, ref, onMounted, onUnmounted, toRaw, reactive, nextTick, unref } from 'vue';
+  import MonitorTable from '../comment/MonitorTable.vue';
+  import SafetyAlarm from './AlarmHistoryTable.vue';
+  import { list, getTableList } from './sensor.api';
+  import { getTableHeaderColumns } from '/@/hooks/web/useWebColumns';
+  import { cloneDeep } from 'lodash-es';
+  import { useMethods } from '/@/hooks/system/useMethods';
+  import { useGlobSetting } from '/@/hooks/setting';
+  import { useRouter } from 'vue-router';
+  import { getDictItemsByCode } from '/@/utils/dict';
+  import { getDeviceList, safetyList } from '../safetyMonitor/safety.api';
+
+  const router = useRouter();
+  const { sysOrgCode } = useGlobSetting();
+  const { exportXlsPostBlob } = useMethods();
+  const SensorMonitorRef = ref();
+  const deviceBaseList = ref([]);
+  const activeKey = ref('1');
+  const deviceKind = ref('');
+  const deviceTypeOption = ref([]);
+  // 默认初始是第一行
+  const selectRowIndex = ref(0);
+  const dataSource = ref([]);
+  const detailDataSource = ref<any[]>([]);
+  const historyDataSource = ref<any[]>([]);
+  const chartsColumns = ref<any[]>([]);
+  const loading = ref(true);
+
+  const selectData = reactive({
+    strname: '',
+    deviceType: '',
+    deviceID: '',
+  });
+
+  const tabChange = (activeKeyVal) => {
+    activeKey.value = activeKeyVal;
+    detailDataSource.value = [];
+    if (activeKeyVal == 1) {
+      nextTick(() => {
+        SensorMonitorRef.value.setSelectedRowKeys([selectData.deviceID]);
+      });
+    }
+  };
+
+  // https获取监测数据
+  let timer: null | NodeJS.Timeout = null;
+  const getMonitor = (flag?) => {
+    if (Object.prototype.toString.call(timer) === '[object Null]') {
+      timer = setTimeout(
+        async () => {
+          await getDataSource(deviceKind.value);
+          if (timer) {
+            timer = null;
+          }
+          getMonitor();
+        },
+        flag ? 0 : 1000
+      );
+    }
+  };
+
+  const getDataSource = async (devicetype) => {
+    const type = devicetype ? devicetype : 'modelsensor';
+    const res = await list({ devicetype: type, pagetype: 'normal' });
+    dataSource.value = res.msgTxt[0].datalist || [];
+    dataSource.value.map((data: any) => {
+      const readData = data.readData;
+      data = Object.assign(data, readData);
+      return data;
+    });
+    const data: any = toRaw(dataSource.value[selectRowIndex.value]); //maxarea
+    Object.assign(selectData, data);
+
+    // if (chartsColumns.value.length <= 0 && selectData.deviceType) {
+    //   handleChange(selectData.deviceType);
+    // }
+
+    // 如果当前为监测tab
+    if (activeKey.value === '1') {
+      // const isHas = detailDataSource.value.find((item) => item['readTime'] === selectData['readTime']);
+      // // 获取选中数据
+      // if (!isHas) {
+      //   if (detailDataSource.value.length < 15) {
+      //     detailDataSource.value.push({ ...selectData });
+      //   } else {
+      //     detailDataSource.value.shift();
+      //     detailDataSource.value.push({ ...selectData });
+      //   }
+      // }
+      const dataList = cloneDeep(detailDataSource.value);
+      if (dataList.length < 15) {
+        dataList.push({ ...selectData });
+      } else {
+        dataList.shift();
+        dataList.push({ ...selectData });
+      }
+      detailDataSource.value = dataList;
+    }
+
+    if (loading.value) {
+      loading.value = false;
+    }
+    return data;
+  };
+
+  const getSelectRow = (selectRow, index) => {
+    if (!selectRow) return;
+    selectRowIndex.value = index;
+    const baseData: any = deviceBaseList.value.find((baseData: any) => baseData.id === selectRow.deviceID);
+    Object.assign(selectData, selectRow, baseData);
+    if (selectData.deviceType) {
+      // if (timer) {
+      //   clearTimeout(timer);
+      //   timer = undefined;
+      // }
+      if (activeKey.value === '1') detailDataSource.value = [];
+      if (activeKey.value === '2') historyDataSource.value = [];
+      handleChange(selectData.deviceType);
+    }
+  };
+
+  // 获取设备基本信息列表
+  const getDeviceBaseList = () => {
+    getTableList({ pageSize: 1000 }).then((res) => {
+      deviceBaseList.value = res.records;
+    });
+  };
+
+  function handleChange(type) {
+    chartsColumns.value = getTableHeaderColumns(type + '_chart');
+    console.log('[ type ] >', type, chartsColumns.value);
+  }
+
+  function handleSensorChange(type) {
+    loading.value = true;
+    handleChange(type);
+    timer = null;
+    dataSource.value = [];
+    detailDataSource.value = [];
+  }
+
+  function refreshEchatrs() {
+    timer = null;
+    // getMonitor(true);
+    console.log('echarts 刷新');
+  }
+  function historyDataSourceChange(dataSource) {
+    historyDataSource.value = dataSource;
+    if (historyDataSource.value.length > 0) handleChange(historyDataSource.value[0].gdevicetype);
+  }
+
+  function onExportXlsFn() {
+    // 判断时间间隔和查询时间区间，数据量下载大时进行提示
+    const url = '/ventanaly-device/safety/reportInfo/expComReportByParam';
+    return exportXlsPostBlob('多参数报表', url, {
+      deviceKind: deviceKind.value.split('_')[0],
+      deviceType: deviceKind.value,
+      tempName: 'dcsbb',
+    });
+  }
+
+  onBeforeMount(() => {
+    getDeviceBaseList();
+  });
+
+  onMounted(async () => {
+    let dictName = 'modelsensorkind';
+    const route = unref(router.currentRoute);
+    if (route.name) {
+      const nameStrList = route.name.split('-');
+      if (nameStrList.length > 0 && nameStrList[nameStrList.length - 1] !== 'sensorMonitor') {
+        dictName = nameStrList[nameStrList.length - 1];
+      }
+    }
+    const res = getDictItemsByCode(dictName);
+    deviceTypeOption.value = res;
+    deviceKind.value = deviceTypeOption.value[0]['value'];
+    handleChange(deviceKind.value);
+    await getMonitor(true);
+  });
+  onUnmounted(() => {
+    if (timer) {
+      clearTimeout(timer);
+      timer = undefined;
+    }
+  });
+</script>
+<style lang="less" scoped>
+  @import '/@/design/theme.less';
+  @import '/@/design/vent/modal.less';
+  .padding-0 {
+    padding: 10px 0 !important;
+  }
+  .sensor-container {
+    height: 100%;
+    position: relative;
+    padding: 10px;
+    z-index: 999;
+    // max-height: calc(100vh - 150px);
+    .@{ventSpace}-tabs {
+      max-height: calc(100% - 100px);
+      .tab-item {
+        max-height: calc(100% - 170px);
+        overflow-y: auto;
+      }
+    }
+    .title-text {
+      position: absolute;
+      top: -24px;
+      left: 0;
+      width: 100%;
+      text-align: center;
+      color: var(--vent-font-color);
+    }
+    .table-box {
+      // height: calc(60% - 150px);
+      height: 780px;
+      padding: 20px 10px;
+      overflow-y: auto;
+    }
+
+    .box-bg {
+      // border: 1px solid #4d7ad855;
+      // border-radius: 2px;
+      // // background-color: #001d3055;
+      // -webkit-backdrop-filter: blur(8px);
+      // backdrop-filter: blur(8px);
+      // box-shadow: 0 0 10px #5984e055 inset;
+      // background-color: #00b3ff12;
+      padding-bottom: 10px;
+      border: 1px solid #44d3ff70;
+      border-radius: 2px;
+      -webkit-backdrop-filter: blur(8px);
+      box-shadow: 0 0 20px #44b4ff33 inset;
+      background-color: #ffffff11;
+      overflow-y: auto;
+    }
+    .table-box-content {
+      height: 430px;
+      background-color: #ffffff03;
+      border-bottom: 1px solid #44d3ff70;
+    }
+    .charts-box {
+      height: 300px;
+      padding: 5px 10px;
+      margin-top: 10px;
+    }
+  }
+  :deep(.@{ventSpace}-tabs-tabpane-active) {
+    height: 100%;
+  }
+  :deep(.@{ventSpace}-tabs-card) {
+    .@{ventSpace}-tabs-tab {
+      background: var(--vent-device-manager-control-btn-hover);
+      border-color: #74e9fe;
+      border-radius: 0%;
+      &:hover {
+        color: #64d5ff;
+      }
+    }
+    .@{ventSpace}-tabs-tab.@{ventSpace}-tabs-tab-active .@{ventSpace}-tabs-tab-btn {
+      color: aqua;
+    }
+    .@{ventSpace}-tabs-nav::before {
+      border-color: #74e9fe;
+    }
+    .@{ventSpace}-picker,
+    .@{ventSpace}-select-selector {
+      width: 100%;
+      background: #00000017 !important;
+      border: 1px solid @vent-form-item-border !important;
+      input,
+      .@{ventSpace}-select-selection-item,
+      .@{ventSpace}-picker-suffix {
+        color: #fff !important;
+      }
+      .@{ventSpace}-select-selection-placeholder {
+        color: #b7b7b7 !important;
+      }
+    }
+    .@{ventSpace}-pagination-next,
+    .action,
+    .@{ventSpace}-select-arrow,
+    .@{ventSpace}-picker-separator {
+      color: var(--vent-font-color) !important;
+    }
+    .@{ventSpace}-table-cell-row-hover {
+      background: #264d8833 !important;
+    }
+    .@{ventSpace}-table-row-selected {
+      background: #00c0a311 !important;
+      td {
+        background-color: #00000000 !important;
+      }
+    }
+    .@{ventSpace}-table-thead {
+      // background: linear-gradient(#004a8655 0%, #004a86aa 10%) !important;
+      background: #3d9dd45d !important;
+
+      & > tr > th,
+      .@{ventSpace}-table-column-title {
+        // color: #70f9fc !important;
+        border-color: var(--vent-base-border) !important;
+        border-left: none !important;
+        border-right: none !important;
+        padding: 7px;
+      }
+    }
+
+    .@{ventSpace}-table-tbody {
+      tr > td {
+        padding: 12px;
+      }
+    }
+    .@{ventSpace}-table-tbody > tr:hover.@{ventSpace}-table-row > td {
+      background-color: #26648855 !important;
+    }
+
+    .jeecg-basic-table-row__striped {
+      // background: #97efff11 !important;
+      td {
+        background-color: #97efff11 !important;
+      }
+    }
+    :deep(.vent-form) {
+      .@{ventSpace}-select-dropdown {
+        color: #000000 !important;
+      }
+    }
+  }
+</style>

src/views/vent/monitorManager/safetySensorMonitor/sensor.api.ts

@@ -0,0 +1,17 @@
+import { defHttp } from '/@/utils/http/axios';
+
+enum Api {
+  list = '/monitor/device',
+  baseList = '/safety/ventanalyWindow/list',
+}
+/**
+ * 列表接口
+ * @param params
+ */
+export const list = (params) => defHttp.post({ url: Api.list, params });
+
+/**
+ * 保存或者更新用户
+ * @param params
+ */
+export const getTableList = (params) => defHttp.get({ url: Api.baseList, params });

src/views/vent/monitorManager/warningMonitor/alarm.data.ts

@@ -1,7 +1,7 @@
 import { BasicColumn, FormSchema } from '/@/components/Table';
 import { render } from '/@/utils/common/renderUtils';
 import { getAutoScrollContainer } from '/@/utils/common/compUtils';
- import dayjs from 'dayjs';
+import dayjs from 'dayjs';
 
 export const manageAutoColumns: BasicColumn[] = [
   {
@@ -93,57 +93,57 @@ export const safetyColumns: BasicColumn[] = [
     dataIndex: 'devicename',
     align: 'center',
   },
-    {
+  {
     title: '类型',
     dataIndex: 'valuename',
     align: 'center',
   },
-    {
+  {
     title: '单位',
     dataIndex: 'valueUnit',
     align: 'center',
   },
-    {
+  {
     title: '报警时刻',
     dataIndex: 'starttime',
     align: 'center',
   },
-    {
+  {
     title: '解除时刻',
     dataIndex: 'endtime',
     align: 'center',
   },
-   {
+  {
     title: '累计时间',
     dataIndex: 'warntime',
     align: 'center',
   },
-   {
+  {
     title: '报警次数',
     dataIndex: 'alarmNum',
     align: 'center',
   },
-   {
+  {
     title: '最小值',
     dataIndex: 'minValue',
     align: 'center',
   },
-   {
+  {
     title: '最小值时刻',
     dataIndex: 'minValueTime',
     align: 'center',
   },
-    {
+  {
     title: '最大值',
     dataIndex: 'maxValue',
     align: 'center',
   },
-   {
+  {
     title: '最大值时刻',
     dataIndex: 'maxValueTime',
     align: 'center',
   },
-   {
+  {
     title: '原因',
     dataIndex: 'wardescrip',
     align: 'center',
@@ -299,7 +299,7 @@ export const unsafetySchema: FormSchema[] = [
       span: 4,
     },
   },
-]
+];
 
 export const safetySchema: FormSchema[] = [
   {
@@ -313,7 +313,7 @@ export const safetySchema: FormSchema[] = [
     field: 'warnLevel',
     defaultValue: null,
     component: 'JDictSelectTag',
-     componentProps: () => {
+    componentProps: () => {
       return {
         dictCode: 'aqjkAlarmType',
       };
@@ -325,7 +325,7 @@ export const safetySchema: FormSchema[] = [
     field: 'deviceKind',
     defaultValue: null,
     component: 'JDictSelectTag',
-     componentProps: () => {
+    componentProps: () => {
       return {
         dictCode: 'aqjkAlarmDevType',
       };
@@ -405,7 +405,7 @@ export const safetySchema: FormSchema[] = [
     field: 'starttime',
     label: '开始时间',
     component: 'DatePicker',
-      defaultValue: dayjs().startOf('date'),
+    defaultValue: dayjs().startOf('date'),
     componentProps: {
       showTime: false,
       valueFormat: 'YYYY-MM-DD',
@@ -428,5 +428,4 @@ export const safetySchema: FormSchema[] = [
   //     span: 4,
   //   },
   // },
-]
-
+];

src/views/vent/monitorManager/warningMonitor/index-mine.vue

@@ -15,8 +15,7 @@
         <template #bodyCell="{ column, record }">
           <template v-if="column.dict">
             <!-- 除了 101（蓝色预警）其他都是红色字体 -->
-            <span v-if="column.dataIndex === 'nwartype'"
-              :class="{ 'color-#ff3823': ['102', '103', '104', '201', '1001'].includes(record.nwartype) }">
+            <span v-if="column.dataIndex === 'nwartype'" :class="{ 'color-#ff3823': ['102', '103', '104', '201', '1001'].includes(record.nwartype) }">
               {{ render.renderDictText(record.nwartype, 'leveltype') || '-' }}
             </span>
             <span v-else>
@@ -34,8 +33,7 @@
         <template #bodyCell="{ column, record }">
           <template v-if="column.dict">
             <!-- 除了 101（蓝色预警）其他都是红色字体 -->
-            <span v-if="column.dataIndex === 'nwartype'"
-              :class="{ 'color-#ff3823': ['102', '103', '104', '201', '1001'].includes(record.nwartype) }">
+            <span v-if="column.dataIndex === 'nwartype'" :class="{ 'color-#ff3823': ['102', '103', '104', '201', '1001'].includes(record.nwartype) }">
               {{ render.renderDictText(record.nwartype, 'leveltype') || '-' }}
             </span>
             <span v-else>
@@ -46,271 +44,275 @@
       </BasicTable>
     </template>
     <template v-if="activeKey == 'safety'">
-      <AlarmHistoryTable ref="alarmHistoryTable" columns-type="alarm" :list="safetyList" device-type="safetymonitor"
+      <AlarmHistoryTable
+        ref="alarmHistoryTable"
+        columns-type="alarm"
+        :list="safetyList"
+        device-type="safetymonitor"
         :device-list-api="getDeviceList.bind(null, { devicekind: 'safetymonitor', pageSize: 10000 })"
-        designScope="alarm-history" />
+        designScope="alarm-history"
+      />
     </template>
   </div>
 </template>
 
 <script lang="ts" name="system-user" setup>
-//ts语法
-import { watch, ref, defineExpose, onMounted, reactive } from 'vue';
-import { BasicTable } from '/@/components/Table';
-import { useListPage } from '/@/hooks/system/useListPage';
-import { getTableHeaderColumns } from '/@/hooks/web/useWebColumns';
-import { manageAutoColumns } from './alarm.data';
-import { getAutoScrollContainer } from '/@/utils/common/compUtils';
-import { getAlarmLogList, getManageAutoLogList, } from './warning.api';
-import { getDeviceList, safetyList, } from '../safetyMonitor/safety.api';
-import customHeader from '/@/components/vent/customHeader.vue';
-import AlarmHistoryTable from '../safetyMonitor/AlarmHistoryTable.vue';
-import { render } from '/@/utils/common/renderUtils';
-const props = defineProps({
-  formConfig: {
-    type: Object as PropType<FormProps> | undefined,
-    default: undefined,
-  },
-});
+  //ts语法
+  import { watch, ref, defineExpose, onMounted, reactive } from 'vue';
+  import { BasicTable } from '/@/components/Table';
+  import { useListPage } from '/@/hooks/system/useListPage';
+  import { getTableHeaderColumns } from '/@/hooks/web/useWebColumns';
+  import { manageAutoColumns } from './alarm.data';
+  import { getAutoScrollContainer } from '/@/utils/common/compUtils';
+  import { getAlarmLogList, getManageAutoLogList } from './warning.api';
+  import { getDeviceList, safetyList } from '../safetyMonitor/safety.api';
+  import customHeader from '/@/components/vent/customHeader.vue';
+  import AlarmHistoryTable from '../safetyMonitor/AlarmHistoryTable.vue';
+  import { render } from '/@/utils/common/renderUtils';
+  const props = defineProps({
+    formConfig: {
+      type: Object as PropType<FormProps> | undefined,
+      default: undefined,
+    },
+  });
 
-const activeKey = ref('device');
-const alarmHistory = ref();
-const deviceColumns = getTableHeaderColumns('alarm_history') as [];
-const dataColumns = ref(deviceColumns);
-const list = ref<any>(getAlarmLogList);
+  const activeKey = ref('device');
+  const alarmHistory = ref();
+  const deviceColumns = getTableHeaderColumns('alarm_history') as [];
+  const dataColumns = ref(deviceColumns);
+  const list = ref<any>(getAlarmLogList);
 
-// 列表页面公共参数、方法
-const { tableContext, onExportXls } = useListPage({
-  tableProps: {
-    api: list,
-    columns: dataColumns,
-    canResize: true,
-    showTableSetting: false,
-    showActionColumn: false,
-    showIndexColumn: true,
-    bordered: false,
-    size: 'small',
-    formConfig: {
-      labelAlign: 'left',
-      showAdvancedButton: false,
-      // autoAdvancedCol: 2,
-      schemas: [
-        {
-          label: '是否解决',
-          // field: 'isok',
-          field: 'isOk',
-          defaultValue: false,
-          component: 'Select',
-          componentProps: {
-            options: [
-              {
-                label: '未解决',
-                value: false,
-              },
-              {
-                label: '已解决',
-                value: true,
-              },
-            ],
+  // 列表页面公共参数、方法
+  const { tableContext, onExportXls } = useListPage({
+    tableProps: {
+      api: list,
+      columns: dataColumns,
+      canResize: true,
+      showTableSetting: false,
+      showActionColumn: false,
+      showIndexColumn: true,
+      bordered: false,
+      size: 'small',
+      formConfig: {
+        labelAlign: 'left',
+        showAdvancedButton: false,
+        // autoAdvancedCol: 2,
+        schemas: [
+          {
+            label: '是否解决',
+            // field: 'isok',
+            field: 'isOk',
+            defaultValue: false,
+            component: 'Select',
+            componentProps: {
+              options: [
+                {
+                  label: '未解决',
+                  value: false,
+                },
+                {
+                  label: '已解决',
+                  value: true,
+                },
+              ],
+            },
+            colProps: { span: 4 },
           },
-          colProps: { span: 4 },
-        },
-        {
-          label: '所属系统',
-          // field: 'kindtype',systemType
-          field: 'systemType',
-          component: 'Select',
-          componentProps: {
-            options: [
-              {
-                label: '通风',
-                value: 'ventS',
-              },
-              {
-                label: '防灭火',
-                value: 'fireS',
-              },
-              {
-                label: '防尘',
-                value: 'dustS',
-              },
-              {
-                label: '瓦斯',
-                value: 'gasS',
-              },
-            ],
+          {
+            label: '所属系统',
+            // field: 'kindtype',systemType
+            field: 'systemType',
+            component: 'Select',
+            componentProps: {
+              options: [
+                {
+                  label: '通风',
+                  value: 'ventS',
+                },
+                {
+                  label: '防灭火',
+                  value: 'fireS',
+                },
+                {
+                  label: '防尘',
+                  value: 'dustS',
+                },
+                {
+                  label: '瓦斯',
+                  value: 'gasS',
+                },
+              ],
+            },
+            colProps: { span: 4 },
           },
-          colProps: { span: 4 },
-        },
-        // {
-        //   label: '设备类型',
-        //   field: 'deviceKind',
-        //   component: 'MTreeSelect',
-        //   componentProps: {
-        //     virtual: false,
-        //   },
-        //   colProps: { span: 4 },
-        // },
-        {
-          label: '设备类型',
-          field: 'deviceKind',
-          component: 'Select',
-          defaultValue: '',
-          componentProps: {
-            options: [
-              {
-                label: '全部',
-                value: '',
-              },
-
-            ],
-          },
-          colProps: { span: 4 },
-        },
-        {
-          field: 'starttime',
-          label: '开始报警时间',
-          component: 'DatePicker',
-          componentProps: {
-            showTime: true,
-            valueFormat: 'YYYY-MM-DD HH:mm:ss',
-            getPopupContainer: getAutoScrollContainer,
+          // {
+          //   label: '设备类型',
+          //   field: 'deviceKind',
+          //   component: 'MTreeSelect',
+          //   componentProps: {
+          //     virtual: false,
+          //   },
+          //   colProps: { span: 4 },
+          // },
+          {
+            label: '设备类型',
+            field: 'deviceKind',
+            component: 'Select',
+            defaultValue: '',
+            componentProps: {
+              options: [
+                {
+                  label: '全部',
+                  value: '',
+                },
+              ],
+            },
+            colProps: { span: 4 },
           },
-          colProps: {
-            span: 4,
+          {
+            field: 'starttime',
+            label: '开始报警时间',
+            component: 'DatePicker',
+            componentProps: {
+              showTime: true,
+              valueFormat: 'YYYY-MM-DD HH:mm:ss',
+              getPopupContainer: getAutoScrollContainer,
+            },
+            colProps: {
+              span: 4,
+            },
           },
-        },
-        // {
-        //   field: 'endtime',
-        //   label: '结束时间',
-        //   component: 'DatePicker',
-        //   componentProps: {
-        //     showTime: true,
-        //     valueFormat: 'YYYY-MM-DD HH:mm:ss',
-        //     getPopupContainer: getAutoScrollContainer,
-        //   },
-        //   colProps: {
-        //     span: 4,
-        //   },
-        // },
-      ],
-    },
-    fetchSetting: {
-      listField: 'records',
+          // {
+          //   field: 'endtime',
+          //   label: '结束时间',
+          //   component: 'DatePicker',
+          //   componentProps: {
+          //     showTime: true,
+          //     valueFormat: 'YYYY-MM-DD HH:mm:ss',
+          //     getPopupContainer: getAutoScrollContainer,
+          //   },
+          //   colProps: {
+          //     span: 4,
+          //   },
+          // },
+        ],
+      },
+      fetchSetting: {
+        listField: 'records',
+      },
+      pagination: {
+        current: 1,
+        pageSize: 10,
+        pageSizeOptions: ['10', '30', '50', '100'],
+      },
+      beforeFetch(params) {
+        if (!params['deviceKind']) {
+          params['deviceKind'] = null;
+        }
+        return params;
+      },
     },
-    pagination: {
-      current: 1,
-      pageSize: 10,
-      pageSizeOptions: ['10', '30', '50', '100'],
+    exportConfig: {
+      name: '预警历史列表',
+      url: '/safety/ventanalyAlarmLog/exportXls',
     },
-    beforeFetch(params) {
-      if (!params['deviceKind']) {
-        params['deviceKind'] = null;
-      }
-      return params;
-    },
-  },
-  exportConfig: {
-    name: '预警历史列表',
-    url: '/safety/ventanalyAlarmLog/exportXls',
-  },
-});
-//注册table数据
-const [registerTable, { reload, setLoading, getForm }] = tableContext;
+  });
+  //注册table数据
+  const [registerTable, { reload, setLoading, getForm }] = tableContext;
 
-function onChangeTab(tab) {
-  if (tab === 'device') {
-    list.value = getAlarmLogList;
-    dataColumns.value = deviceColumns;
-  } else {
-    list.value = getManageAutoLogList;
-    dataColumns.value = manageAutoColumns;
+  function onChangeTab(tab) {
+    if (tab === 'device') {
+      list.value = getAlarmLogList;
+      dataColumns.value = deviceColumns;
+    } else {
+      list.value = getManageAutoLogList;
+      dataColumns.value = manageAutoColumns;
+    }
   }
-}
-onMounted(async () => {
-  // getEachMineWarnCountInfoList();
-});
+  onMounted(async () => {
+    // getEachMineWarnCountInfoList();
+  });
 
-defineExpose({ setLoading });
+  defineExpose({ setLoading });
 </script>
 
 <style scoped lang="less">
-@ventSpace: zxm;
+  @ventSpace: zxm;
 
-:deep(.zxm-table-container) {
-  max-height: 720px !important;
-}
+  :deep(.zxm-table-container) {
+    max-height: 720px !important;
+  }
 
-:deep(.ventSpace-table-body) {
-  height: auto !important;
-}
+  :deep(.ventSpace-table-body) {
+    height: auto !important;
+  }
 
-:deep(.zxm-picker) {
-  height: 30px !important;
-}
+  :deep(.zxm-picker) {
+    height: 30px !important;
+  }
 
-:deep(.@{ventSpace}-picker-dropdown) {
-  position: absolute !important;
-  top: 35px !important;
-  left: 0 !important;
-}
+  :deep(.@{ventSpace}-picker-dropdown) {
+    position: absolute !important;
+    top: 35px !important;
+    left: 0 !important;
+  }
 
-.tab-box {
-  display: flex;
-  color: #fff;
-  position: relative;
-  // top: 11px;
-  margin-top: 80px;
-  background: linear-gradient(#001325, #012e4f);
+  .tab-box {
+    display: flex;
+    color: #fff;
+    position: relative;
+    // top: 11px;
+    margin-top: 80px;
+    background: linear-gradient(#001325, #012e4f);
 
-  :deep(.zxm-tabs-nav) {
-    margin: 0 !important;
+    :deep(.zxm-tabs-nav) {
+      margin: 0 !important;
 
-    .zxm-tabs-tab {
-      width: 180px;
-      height: 45px;
-      background: url('@/assets/images/top-btn.png') center no-repeat;
-      background-size: cover;
-      display: flex;
-      justify-content: center;
-      font-size: 16px;
-    }
+      .zxm-tabs-tab {
+        width: 180px;
+        height: 45px;
+        background: url('@/assets/images/top-btn.png') center no-repeat;
+        background-size: cover;
+        display: flex;
+        justify-content: center;
+        font-size: 16px;
+      }
 
-    .zxm-tabs-tab-active {
-      width: 180px;
-      position: relative;
-      background: url('@/assets/images/top-btn-select.png') center no-repeat;
-      background-size: cover;
+      .zxm-tabs-tab-active {
+        width: 180px;
+        position: relative;
+        background: url('@/assets/images/top-btn-select.png') center no-repeat;
+        background-size: cover;
 
-      .zxm-tabs-tab-btn {
-        color: #fff !important;
+        .zxm-tabs-tab-btn {
+          color: #fff !important;
+        }
       }
-    }
 
-    .zxm-tabs-ink-bar {
-      width: 0 !important;
-    }
+      .zxm-tabs-ink-bar {
+        width: 0 !important;
+      }
 
-    .zxm-tabs-tab+.zxm-tabs-tab {
-      margin: 0 !important;
+      .zxm-tabs-tab + .zxm-tabs-tab {
+        margin: 0 !important;
+      }
     }
   }
-}
 
-.alarm-history-table {
-  width: 100%;
-  background-color: #0ebbff15;
-  position: relative;
-  margin-top: 10px;
+  .alarm-history-table {
+    width: 100%;
+    background-color: #0ebbff15;
+    position: relative;
+    margin-top: 10px;
 
-  &::after {
-    position: absolute;
-    content: '';
-    width: calc(100% + 10px);
-    height: 2px;
-    top: 0px;
-    left: -10px;
-    border-bottom: 1px solid #0efcff44;
+    &::after {
+      position: absolute;
+      content: '';
+      width: calc(100% + 10px);
+      height: 2px;
+      top: 0px;
+      left: -10px;
+      border-bottom: 1px solid #0efcff44;
+    }
   }
-}
 </style>

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

@@ -63,8 +63,7 @@
       <template #bodyCell="{ column, record }">
         <template v-if="column.dict">
           <!-- 除了 101（蓝色预警）其他都是红色字体 -->
-          <span v-if="column.dataIndex === 'nwartype'"
-            :class="{ 'color-#ff3823': ['102', '103', '104', '201', '1001'].includes(record.nwartype) }">
+          <span v-if="column.dataIndex === 'nwartype'" :class="{ 'color-#ff3823': ['102', '103', '104', '201', '1001'].includes(record.nwartype) }">
             {{ render.renderDictText(record.nwartype, 'leveltype') || '-' }}
           </span>
           <span v-else>
@@ -77,12 +76,12 @@
 </template>
 
 <script lang="ts" name="system-user" setup>
-//ts语法
-import { watch, ref, defineExpose, onMounted, reactive } from 'vue';
-import { BasicTable } from '/@/components/Table';
-import { useListPage } from '/@/hooks/system/useListPage';
-import { getTableHeaderColumns } from '/@/hooks/web/useWebColumns';
-import { manageAutoColumns1, safetyColumns, safetySchema, unsafetySchema } from './alarm.data';
+  //ts语法
+  import { watch, ref, defineExpose, onMounted, reactive } from 'vue';
+  import { BasicTable } from '/@/components/Table';
+  import { useListPage } from '/@/hooks/system/useListPage';
+  import { getTableHeaderColumns } from '/@/hooks/web/useWebColumns';
+  import { manageAutoColumns1, safetyColumns, safetySchema, unsafetySchema } from './alarm.data';
 
 import { list, getEachMineWarnCountInfo, getExportUrl } from './warning.api';
 import { useRoute } from 'vue-router';
@@ -131,47 +130,54 @@ const paramType = ref('aqjkAlarmLog');
 // }
 
 
-// 列表页面公共参数、方法
-const { tableContext, onExportXls, onExportXlsPost } = useListPage({
-  tableProps: {
-    api: list,
-    columns: dataColumns,
-    canResize: true,
-    showTableSetting: false,
-    showActionColumn: false,
-    showIndexColumn: true,
-    bordered: false,
-    size: 'small',
-    formConfig: {
-      labelAlign: 'left',
-      showAdvancedButton: false,
-      // autoAdvancedCol: 4,
-      // labelWidth:50,
-      schemas: searchFormSchema as any
-    },
-    fetchSetting: {
-      listField: 'records',
-    },
-    pagination: {
-      current: 1,
-      pageSize: 10,
-      pageSizeOptions: ['10', '30', '50', '100'],
+
+  
+  
+
+ 
+
+  // 列表页面公共参数、方法
+  const { tableContext, onExportXls, onExportXlsPost } = useListPage({
+    tableProps: {
+      api: list,
+      columns: dataColumns,
+      canResize: true,
+      showTableSetting: false,
+      showActionColumn: false,
+      showIndexColumn: true,
+      bordered: false,
+      size: 'small',
+      formConfig: {
+        labelAlign: 'left',
+        showAdvancedButton: false,
+        // autoAdvancedCol: 4,
+        // labelWidth:50,
+        schemas: searchFormSchema as any,
+      },
+      fetchSetting: {
+        listField: 'records',
+      },
+      pagination: {
+        current: 1,
+        pageSize: 10,
+        pageSizeOptions: ['10', '30', '50', '100'],
+      },
+      beforeFetch(params) {
+        params.type = paramType.value;
+        return params;
+      },
     },
-    beforeFetch(params) {
-      params.type = paramType.value;
-      return params;
+    exportConfig: {
+      name: '预警历史列表',
+      url: () => getExportUrl(activeKey.value),
     },
-  },
-  exportConfig: {
-    name: '预警历史列表',
-    url: () => getExportUrl(activeKey.value)
-  },
-});
-//注册table数据
-const [registerTable, { reload, setLoading, getForm }] = tableContext;
-
+  });
+  //注册table数据
+  const [registerTable, { reload, setLoading, getForm }] = tableContext;
 
+  
 
+ 
 
 //获取预警统计信息
 // async function getEachMineWarnCountInfoList() {
@@ -200,44 +206,46 @@ defineExpose({ setLoading });
 </script>
 
 <style scoped lang="less">
-@import '/@/design/theme.less';
-@ventSpace: zxm;
-
-:deep(.zxm-table-container) {
-  max-height: 720px !important;
-}
-
-:deep(.ventSpace-table-body) {
-  height: auto !important;
-}
-
-:deep(.zxm-picker) {
-  height: 30px !important;
-}
-
-:deep(.@{ventSpace}-picker-dropdown) {
-  position: absolute !important;
-  top: 35px !important;
-  left: 0 !important;
-}
-
-@{theme-deepblue} {
-  // .data-statistics {
-  //   --image-vent-tf: url('/@/assets/images/themify/deepblue/vent-tf.png');
-  //   --image-dust-fc: url('/@/assets/images/themify/deepblue/dust-fc.png');
-  //   --image-gas-ws: url('/@/assets/images/themify/deepblue/gas-ws.png');
-  //   --image-fire-fz: url('/@/assets/images/themify/deepblue/fire-fz.png');
-  //   --image-aqjc: url('/@/assets/images/themify/deepblue/aqjc.png');
-  //   --image-his-one: url('/@/assets/images/themify/deepblue/his-one.png');
-  // }
+  @import '/@/design/theme.less';
+  @ventSpace: zxm;
+
+  :deep(.zxm-table-container) {
+    max-height: 720px !important;
+  }
 
-  .tab-box {
-    --table-border: #0eb3ff66;
-    --tab-bg: linear-gradient(#001325, #051f4a);
-    --image-top-btn: url('/@/assets/images/themify/deepblue/top-btn.png');
-    --image-top-btn-select: url('/@/assets/images/themify/deepblue/top-btn-select.png');
+  :deep(.ventSpace-table-body) {
+    height: auto !important;
   }
-}
+
+  :deep(.zxm-picker) {
+    height: 30px !important;
+  }
+
+  :deep(.@{ventSpace}-picker-dropdown) {
+    position: absolute !important;
+    top: 35px !important;
+    left: 0 !important;
+  }
+
+  // @{theme-deepblue} {
+  //   .data-statistics {
+  //     --image-vent-tf: url('/@/assets/images/themify/deepblue/vent-tf.png');
+  //     --image-dust-fc: url('/@/assets/images/themify/deepblue/dust-fc.png');
+  //     --image-gas-ws: url('/@/assets/images/themify/deepblue/gas-ws.png');
+  //     --image-fire-fz: url('/@/assets/images/themify/deepblue/fire-fz.png');
+  //     --image-aqjc: url('/@/assets/images/themify/deepblue/aqjc.png');
+  //     --image-his-one: url('/@/assets/images/themify/deepblue/his-one.png');
+  //   }
+
+  //   .tab-box {
+  //     --table-border: #0eb3ff66;
+  //     --tab-bg: linear-gradient(#001325, #051f4a);
+  //     --image-top-btn: url('/@/assets/images/themify/deepblue/top-btn.png');
+  //     --image-top-btn-select: url('/@/assets/images/themify/deepblue/top-btn-select.png');
+  //   }
+  // }
+
+
 
 // .data-statistics {
 //   // --image-vent-tf: url('/@/assets/images/vent-tf.png');
@@ -343,51 +351,79 @@ defineExpose({ setLoading });
 //   }
 // }
 
-.tab-box {
-  --table-border: #0efcff44;
-  --tab-bg: linear-gradient(#001325, #012e4f);
-  --image-top-btn: url('/@/assets/images/top-btn.png');
-  --image-top-btn-select: url('/@/assets/images/top-btn-select.png');
-  display: flex;
-  color: #fff;
-  position: relative;
-  // top: 11px;
-   margin-top: 120px;
-  background: var(--tab-bg);
-
-  :deep(.zxm-tabs-nav) {
-    margin: 0 !important;
-
-    .zxm-tabs-tab {
-      width: 180px;
-      height: 45px;
-      background: var(--image-top-btn) center no-repeat;
-      background-size: cover;
-      display: flex;
-      justify-content: center;
-      font-size: 16px;
-    }
+// .tab-box {
+//   --table-border: #0efcff44;
+//   --tab-bg: linear-gradient(#001325, #012e4f);
+//   --image-top-btn: url('/@/assets/images/top-btn.png');
+//   --image-top-btn-select: url('/@/assets/images/top-btn-select.png');
+//   display: flex;
+//   color: #fff;
+//   position: relative;
+//   // top: 11px;
+//    margin-top: 120px;
+//   background: var(--tab-bg);
+
+//   :deep(.zxm-tabs-nav) {
+//     margin: 0 !important;
+
+//     .zxm-tabs-tab {
+//       width: 180px;
+//       height: 45px;
+//       background: var(--image-top-btn) center no-repeat;
+//       background-size: cover;
+//       display: flex;
+//       justify-content: center;
+//       font-size: 16px;
+//     }
 
-    .zxm-tabs-tab-active {
-      width: 180px;
-      position: relative;
-      background: var(--image-top-btn-select) center no-repeat;
-      background-size: cover;
+//     .zxm-tabs-tab-active {
+//       width: 180px;
+//       position: relative;
+//       background: var(--image-top-btn-select) center no-repeat;
+//       background-size: cover;
 
-      .zxm-tabs-tab-btn {
-        color: #fff !important;
-      }
-    }
+//       .zxm-tabs-tab-btn {
+//         color: #fff !important;
+//       }
+//     }
 
-    .zxm-tabs-ink-bar {
-      width: 0 !important;
-    }
+//     .zxm-tabs-ink-bar {
+//       width: 0 !important;
+//     }
 
-    .zxm-tabs-tab+.zxm-tabs-tab {
-      margin: 0 !important;
-    }
-  }
-}
+//     .zxm-tabs-tab+.zxm-tabs-tab {
+//       margin: 0 !important;
+
+//       .zxm-tabs-tab {
+//         width: 180px;
+//         height: 45px;
+//         background: var(--image-top-btn) center no-repeat;
+//         background-size: cover;
+//         display: flex;
+//         justify-content: center;
+//         font-size: 16px;
+//       }
+
+//       .zxm-tabs-tab-active {
+//         width: 180px;
+//         position: relative;
+//         background: var(--image-top-btn-select) center no-repeat;
+//         background-size: cover;
+
+//         .zxm-tabs-tab-btn {
+//           color: #fff !important;
+//         }
+//       }
+
+//       .zxm-tabs-ink-bar {
+//         width: 0 !important;
+//       }
+
+//       .zxm-tabs-tab + .zxm-tabs-tab {
+//         margin: 0 !important;
+//       }
+//     }
+//   }
 
 .alarm-history-table {
   width: 100%;
@@ -396,14 +432,14 @@ defineExpose({ setLoading });
   // margin-top: 10px;
     margin-top: 80px;
 
-  &::after {
-    position: absolute;
-    content: '';
-    width: calc(100% + 10px);
-    height: 2px;
-    top: 0px;
-    left: -10px;
-    border-bottom: 1px solid var(--table-border);
+    &::after {
+      position: absolute;
+      content: '';
+      width: calc(100% + 10px);
+      height: 2px;
+      top: 0px;
+      left: -10px;
+      border-bottom: 1px solid var(--table-border);
+    }
   }
-}
 </style>