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

src/components/AIChat/MiniChat.vue

@@ -1,3 +1,4 @@
+<!-- eslint-disable vue/no-v-html -->
 <template>
   <div class="mini-chat">
     <!-- 左侧折叠区域 -->
@@ -13,30 +14,38 @@
     <!-- 右侧对话框 -->
     <div class="right-side">
       <!-- 对话区域 -->
-      <div class="dialog-area">
+      <div ref="dialogRef" class="dialog-area">
         <div
-          v-for="message in sortedMessages"
+          v-for="message in store.getMessageHistory"
           :key="message.id"
-          class="flex items-center"
+          class="flex items-center w-100%"
           :style="{ alignSelf: message.type === 'user' ? 'flex-end' : 'flex-start' }"
         >
-          <SvgIcon v-if="message.type !== 'user'" size="30" class="ml-2px mr-2px" name="ai-logo" />
-          <div v-if="message.type !== 'user'" class="answer-message" v-html="formatMessage(message.content)"></div>
-          <div v-if="message.type === 'user'" class="ask-message">{{ message.content }}</div>
+          <template v-if="message.type === 'user'">
+            <div class="flex-grow-1"></div>
+            <div class="ask-message">{{ message.content }}</div>
+          </template>
+          <template v-else>
+            <SvgIcon size="30" class="ml-2px mr-2px" name="ai-logo" />
+            <div class="answer-message">
+              <div v-if="message.contentR1" class="color-gray font-size-12px" v-html="formatMessage(message.contentR1)"> </div>
+              <div v-html="formatMessage(message.content)"> </div>
+            </div>
+          </template>
         </div>
       </div>
       <!-- 底部操作栏 -->
       <div class="input-area">
-        <textarea v-model="inputText" placeholder="请输入你的问题"> </textarea>
+        <TextArea v-model:value="inputText" placeholder="请输入你的问题" />
         <div class="action-bar">
           <!-- 左侧深度思考按钮 -->
-          <div class="think-btn" :class="{ active: isThinking }" @click="toggleThinking"> <span>深度思考</span> </div>
+          <div class="think-btn" :class="{ active: store.deepseekR1Enable }" @click="toggleThinking"> <span>深度思考</span> </div>
 
           <!-- 右侧操作按钮 -->
           <Space>
             <SvgIcon name="send-image" />
             <SvgIcon name="send-file" />
-            <Button type="primary" shape="circle" size="small" :loading="spinning" @click="handleSend">
+            <Button type="primary" shape="circle" size="small" :loading="store.streaming" @click="handleSend">
               <template #icon>
                 <SvgIcon name="send" />
               </template>
@@ -49,334 +58,38 @@
 </template>
 
 <script lang="ts" setup>
-  import { ref, onMounted, unref, computed } from 'vue';
-  import { useUserStore } from '/@/store/modules/user';
+  import { ref, onMounted } from 'vue';
   import { SvgIcon } from '../Icon';
-  import { Space, Button, Popover } from 'ant-design-vue';
+  import { Space, Button, Popover, Input } from 'ant-design-vue';
   import AIChat from './index.vue';
-
-  // 响应式变量声明
+  import { useAIChat } from '/@/store/modules/AIChat';
+  const TextArea = Input.TextArea; // 直接导入TextArea组件使用时打包报错
+  const dialogRef = ref<HTMLElement | null>(null);
   const dialogVisible = ref(true);
-  const isFold = ref(true); // 是否折叠
   const inputText = ref(''); // 输入框内容
-  const historySessions = ref([]); // 消会话历史
-  const spinning = ref(false); // 加载状态
-  const systemMessage = ref(''); // 系统返回信息
-  const session_id = ref(''); // 会话id
-  const hasCreated = ref(false); // 标志位，防止重复调用create接口
-  const hasAdd = ref(false); // 标志位，防止重复调用create接口
-  const userStore = useUserStore(); //获取用户信息
-  const editingId = ref<number | null>(null);
-  const editText = ref('');
-  const isThinking = ref(false);
-  interface ListItem {
-    id: number;
-    title?: string;
-  }
-  let userId = unref(userStore.getUserInfo).id;
-  // const userId = ref(0);
-  type MessageItem = {
-    id: string; // 唯一标识（可用时间戳生成）
-    type: 'user' | 'system';
-    content: string;
-    timestamp: number; // 排序依据
-  };
-  const messageList = ref<MessageItem[]>([]);
-  const sortedMessages = computed(() => {
-    const list = messageList.value;
-    return list.sort((a, b) => a.timestamp - b.timestamp);
-  });
-  const vFocus = {
-    mounted: (el: HTMLElement) => el.querySelector('input')?.focus(),
-  };
-  const scrollToBottom = () => {
-    const dialogArea = document.querySelector('.dialog-area');
-    if (dialogArea) {
-      dialogArea.scrollTop = dialogArea.scrollHeight;
-    }
-  };
+  const store = useAIChat(); //获取用户信息
 
   const openDialog = () => {
     dialogVisible.value = !dialogVisible.value;
   };
-  const fold = () => {
-    // isFold.value = !isFold.value;
-    // if (!isFold.value) {
-    //   sessionsHistoryList();
-    // }
-  };
   //启用深度思考
   const toggleThinking = () => {
-    isThinking.value = !isThinking.value;
-  };
-  //创建新对话
-  async function addNew() {
-    hasAdd.value = !hasAdd.value;
-    const params = {
-      user_id: userId,
-    };
-    let response = await fetch('http://182.92.126.35:6005/sessions/create', {
-      method: 'post',
-      headers: {
-        'Content-Type': 'application/json',
-      },
-      body: JSON.stringify(params),
-    });
-    const data = await response.json();
-    session_id.value = data.id;
-    messageList.value = [];
-  }
-  //编辑标题
-  const startEditing = (item: ListItem) => {
-    editingId.value = item.id;
-    editText.value = item.title || '';
+    store.deepseekR1Enable = !store.deepseekR1Enable;
   };
 
-  // 保存修改
-  const handleSave = async (item: ListItem) => {
-    const params = {
-      chat_session_id: item.id,
-      new_title: editText.value,
-    };
-    try {
-      let response = await fetch('http://182.92.126.35:6005/sessions/change_title', {
-        method: 'POST',
-        headers: {
-          'Content-Type': 'application/json',
-        },
-        body: JSON.stringify(params),
-      });
-      if (!response.ok) {
-        throw new Error('Network response was not ok');
-      }
-      item.title = editText.value;
-    } catch (error) {
-      console.error('保存失败:', error);
-    }
-    editingId.value = null;
-  };
   //获取消息列表
   async function handleSend() {
-    if (session_id.value === '') {
-      await addNew();
-      createSessionTitle({ session_id: session_id.value, title: inputText.value });
-      sendMessage1();
-    } else {
-      createSessionTitle({ session_id: session_id.value, title: inputText.value });
-      sendMessage1();
-    }
-  }
-  //发送消息
-  async function sendMessage() {
-    spinning.value = true;
-    // 添加用户消息
-    messageList.value.push({
-      id: `user_${Date.now()}`,
-      type: 'user',
-      content: inputText.value,
-      timestamp: Date.now(),
-    });
-    const params = {
-      chat_session_id: session_id.value,
-      prompt: inputText.value,
-      ref_file_ids: [],
-      thinking_enabled: false,
-    };
-    inputText.value = ''; // 清空输入框
-    //将用户输入的内容发送到后端
-    try {
-      // 将用户输入的内容发送到后端
-      let response = await fetch('http://182.92.126.35:6005/chat', {
-        method: 'POST',
-        headers: {
-          'Content-Type': 'application/json',
-        },
-        body: JSON.stringify(params),
-      });
-
-      if (!response.ok) {
-        throw new Error('Network response was not ok');
-      }
-
-      const data = await response.json();
-      const assistantReply = data.reply.content; // 获取助手回复
-      // formatMessage(assistantReply);
-      systemMessage.value = assistantReply;
-
-      // 添加系统回答
-      messageList.value.push({
-        id: `system_${Date.now()}`,
-        type: 'system',
-        content: systemMessage.value,
-        timestamp: Date.now(),
-      });
-    } catch (error) {
-      // 请求失败时设置系统消息为"服务器异常"
-      systemMessage.value = '服务器异常';
-      console.error('请求失败:', error);
-    } finally {
-      spinning.value = false; // 无论请求成功与否，都停止加载指示器
-    }
-  }
-  //发送消息  流式响应
-  const sendMessage1 = async () => {
-    spinning.value = true; // 开始加载
-    messageList.value.push({
-      id: `user_${Date.now()}`,
-      type: 'user',
-      content: inputText.value,
-      timestamp: Date.now(),
-    });
-
-    // 构造请求参数
-    const params = {
-      chat_session_id: session_id.value, // 替换为实际的会话 ID
-      prompt: inputText.value,
-      ref_file_ids: [],
-      thinking_enabled: isThinking.value,
-    };
-    inputText.value = ''; // 清空输入框
-    try {
-      // 发送 POST 请求
-      const response = await fetch('http://182.92.126.35:6005/chat_stream', {
-        method: 'POST',
-        headers: {
-          'Content-Type': 'application/json',
-        },
-        body: JSON.stringify(params),
-      });
-
-      // 检查响应是否成功
-      if (!response.ok) {
-        throw new Error('Network response was not ok');
-      }
-
-      // 获取可读流
-      const reader = response.body.getReader();
-
-      // 创建一条新的消息对象
-      const newMessage = {
-        id: `response_${Date.now()}`,
-        type: 'response', // 消息类型
-        content: '',
-        timestamp: Date.now(), // 时间戳用来排序
-      };
-
-      // 将新消息添加到消息列表
-      messageList.value.push(newMessage);
-
-      // 读取流式数据
-      while (true) {
-        const { done, value } = await reader.read();
-        if (done) {
-          console.log('Stream complete');
-          break;
-        }
-
-        // 将流数据转换为字符串
-        const chunk = new TextDecoder().decode(value);
-        console.log('Received chunk:', chunk);
-
-        // 使用正则表达式匹配完整的 JSON 对象
-        const jsonRegex = /{.*?}/g;
-        const matches = chunk.match(jsonRegex);
-
-        if (matches) {
-          matches.forEach((match) => {
-            try {
-              const data = JSON.parse(match);
-              if (data.type === 'text') {
-                // 找到当前消息对象并更新 content
-                const targetMessage = messageList.value.find((msg) => msg.id === newMessage.id);
-                if (targetMessage) {
-                  targetMessage.content += data.content; // 追加内容
-                  scrollToBottom();
-                }
-              }
-            } catch (error) {
-              console.error('Failed to parse JSON:', error);
-            }
-          });
-        }
-      }
-    } catch (error) {
-      // 请求失败时设置系统消息
-      if (!response || !response.ok) {
-        systemMessage.value = '服务器异常';
-        messageList.value.push({
-          id: `system_${Date.now()}`,
-          type: 'system',
-          content: systemMessage.value,
-          timestamp: Date.now(),
-        });
-        console.error('请求失败:', error);
-      }
-    } finally {
-      spinning.value = false; // 停止加载
-    }
-  };
-  //创建标题
-  async function createSessionTitle({ session_id, title }) {
-    const params = {
-      chat_session_id: session_id,
-      prompt: title,
-    };
-    let response = await fetch('http://182.92.126.35:6005/sessions/title', {
-      method: 'post',
-      headers: {
-        'Content-Type': 'application/json',
-      },
-      body: JSON.stringify(params),
-    });
-    const data = await response.json();
-  }
-  //获取会话历史
-  async function sessionsHistoryList() {
-    const params = {
-      user_id: userId,
-    };
-    let response = await fetch(`http://182.92.126.35:6005/sessions`, {
-      method: 'post',
-      headers: {
-        'Content-Type': 'application/json',
-      },
-      body: JSON.stringify(params),
-    });
-    const data = await response.json();
-    historySessions.value = data.chat_sessions;
-  }
-  //获取具体会话记录
-  async function sessionsHistory(id: string) {
-    let response = await fetch(`http://182.92.126.35:6005/sessions/history_chat/?chat_session_id=${id}`, {
-      method: 'get',
-      headers: {
-        'Content-Type': 'application/json',
-      },
-    });
-    const data = await response.json();
-    if (data.chat_messages.length > 0) {
-      messageList.value = [];
-      data.chat_messages.forEach((item: any) => {
-        // role== user 用户提问
-        if (item.role === 'user') {
-          messageList.value.push({
-            id: `user_${Date.now()}`,
-            type: 'user',
-            content: item.content,
-            timestamp: Date.now(),
-          });
-        } else {
-          // role== assistant 机器回答
-          messageList.value.push({
-            id: `system_${Date.now()}`,
-            type: 'system',
-            content: item.content,
-            timestamp: Date.now(),
-          });
+    store
+      .sendQuestion(inputText.value, () => {
+        if (dialogRef.value) {
+          dialogRef.value.scrollTop = dialogRef.value.scrollHeight;
         }
+      })
+      .then(() => {
+        inputText.value = '';
       });
-    }
   }
+
   //格式化消息
   function formatMessage(text: string) {
     let formatted = text
@@ -393,9 +106,10 @@
       .replace(/`([^`]+)`/g, '<code>$1</code>');
     return formatted;
   }
+
   // 初始化按钮定位
   onMounted(() => {
-    sessionsHistoryList();
+    // store.getSessionHistory();
   });
 </script>
 
@@ -433,11 +147,13 @@
         padding: 10px;
         border-radius: 5px;
         background: #0c2842;
+        max-width: 80%;
       }
       .answer-message {
         padding: 10px;
         border-radius: 5px;
         background: #0c2842;
+        max-width: 90%;
       }
     }
 

src/components/AIChat/index.vue

@@ -1,3 +1,5 @@
+<!-- eslint-disable vue/multi-word-component-names -->
+<!-- eslint-disable vue/no-v-html -->
 <template>
   <transition name="fade">
     <div v-if="visible" class="dialog-overlay">
@@ -35,7 +37,7 @@
             }"
           ></span>
           <span v-if="!isFold" class="btn-text">历史对话</span>
-          <a-list style="width: 110px" :split="false" :data-source="historySessions" :scroll="200" class="custom-list">
+          <a-list style="width: 110px" :split="false" :data-source="store.sessionHistory" :scroll="200" class="custom-list">
             <template #renderItem="{ item }">
               <a-list-item
                 :style="{
@@ -49,7 +51,7 @@
                 <!-- 新增flex布局容器 -->
                 <div style="display: flex; justify-content: space-between; width: 100%">
                   <div v-if="editingId !== item.id" class="text-container">
-                    <span class="edit-text">{{ item.title || '新会话' }}</span>
+                    <span :class="{ 'color-white': item.id === store.currentSessionID }" class="edit-text">{{ item.title || '新会话' }}</span>
                     <edit-outlined class="edit-icon" @click="startEditing(item)" />
                   </div>
 
@@ -78,8 +80,8 @@
       <div class="right-side">
         <div class="input-content">
           <!-- 对话区域 -->
-          <div class="dialog-area">
-            <div v-for="message in sortedMessages" :key="message.id" :class="['message-item', message.type]">
+          <div ref="dialogRef" class="dialog-area">
+            <div v-for="message in store.getMessageHistory" :key="message.id" :class="['message-item', message.type]">
               <!-- 用户提问样式 -->
               <div v-if="message.type === 'user'" class="ask-message">
                 <span>{{ message.content }}</span>
@@ -89,27 +91,23 @@
               <div v-else class="system-message">
                 <div class="answerIcon"></div>
                 <div class="answer-message">
-                  <div v-if="message.Origintype === 'thinking'">
-                    <span :id="'thinking-' + message.id" class="thinking-text" v-html="formatMessage(message.content)"></span>
-                  </div>
-                  <div v-if="message.Origintype1 === 'text'">
-                    <span :id="'text-' + message.id" class="answer-text" v-html="formatMessage(message.content1)"></span>
-                  </div>
+                  <div v-if="message.contentR1" class="thinking-text" v-html="formatMessage(message.contentR1)"> </div>
+                  <div class="answer-text" v-html="formatMessage(message.content)"> </div>
                 </div>
               </div>
             </div>
           </div>
           <!-- 文本输入区域 -->
-          <div v-if="spinning" class="thinking-area">
+          <div v-if="store.streaming" class="thinking-area">
             <span style="color: #fff">思考中···</span>
-            <a-spin :spinning="spinning"></a-spin>
+            <a-spin :spinning="store.streaming" />
           </div>
           <div class="input-area">
             <textarea v-model="inputText" placeholder="请输入你的问题"> </textarea>
             <!-- 底部操作栏 -->
             <div class="action-bar">
               <!-- 左侧深度思考按钮 -->
-              <div class="think-btn" :class="{ active: isThinking }" @click="toggleThinking"> <span>深度思考</span> </div>
+              <div class="think-btn" :class="{ active: store.deepseekR1Enable }" @click="toggleThinking"> <span>深度思考</span> </div>
 
               <!-- 右侧操作按钮 -->
               <div class="right-actions">
@@ -129,367 +127,80 @@
 </template>
 
 <script lang="ts" setup>
-  import { ref, onMounted, unref, nextTick, computed } from 'vue';
-  import { useUserStore } from '/@/store/modules/user';
+  import { ref, onMounted } from 'vue';
   import { EditOutlined } from '@ant-design/icons-vue';
+  import { useAIChat } from '/@/store/modules/AIChat';
   // 响应式变量声明
-  const dialogVisible = ref(false);
+  const store = useAIChat(); //获取用户信息
+  const dialogRef = ref<HTMLElement | null>(null);
   const isFold = ref(false); // 是否折叠
   const inputText = ref(''); // 输入框内容
-  const historySessions = ref([]); // 消会话历史
-  const spinning = ref(false); // 加载状态
-  const systemMessage = ref(''); // 系统返回信息
-  const session_id = ref(''); // 会话id
   const hasCreated = ref(false); // 标志位，防止重复调用create接口
-  const hasAdd = ref(false); // 标志位，防止重复调用create接口
-  const userStore = useUserStore(); //获取用户信息
   const editingId = ref<number | null>(null);
   const editText = ref('');
-  const isThinking = ref(false);
-  interface ListItem {
-    id: number;
-    title?: string;
-  }
+
   const props = defineProps({
     visible: {
       type: Boolean,
       required: true,
     },
   });
-  let userId = unref(userStore.getUserInfo).id;
-  // const userId = ref(0);
-  type MessageItem = {
-    id: string; // 唯一标识时间戳
-    type: 'user' | 'system';
-    content?: string;
-    content1?: string;
-    Origintype?: string;
-    Origintype1?: string;
-    timestamp: number; // 排序依据
-  };
-  const messageList = ref<MessageItem[]>([]);
-  const sortedMessages = computed(() => {
-    return messageList.value.sort((a, b) => a.timestamp - b.timestamp);
-  });
+
   const vFocus = {
     mounted: (el: HTMLElement) => el.querySelector('input')?.focus(),
   };
-  const scrollToBottom = () => {
-    const dialogArea = document.querySelector('.dialog-area');
-    if (dialogArea) {
-      dialogArea.scrollTop = dialogArea.scrollHeight;
-    }
-  };
 
   const openMenu = () => {
     if (props.visible) {
-      addNew();
       hasCreated.value = true;
     }
   };
   const fold = () => {
     isFold.value = !isFold.value;
     if (!isFold.value) {
-      sessionsHistoryList();
+      store.getSessionHistory();
     }
   };
-  //启用深度思考
-  const toggleThinking = () => {
-    isThinking.value = !isThinking.value;
+
+  const addNew = () => {
+    store.createSession();
   };
-  //创建新对话
-  async function addNew() {
-    hasAdd.value = !hasAdd.value;
-    const params = {
-      user_id: userId,
-    };
-    let response = await fetch('http://182.92.126.35:6005/sessions/create', {
-      method: 'post',
-      headers: {
-        'Content-Type': 'application/json',
-      },
-      body: JSON.stringify(params),
-    });
-    const data = await response.json();
-    session_id.value = data.id;
-    messageList.value = [];
-  }
+
   //编辑标题
-  const startEditing = (item: ListItem) => {
+  const startEditing = (item) => {
     editingId.value = item.id;
     editText.value = item.title || '';
   };
 
   // 保存修改
-  const handleSave = async (item: ListItem) => {
-    const params = {
-      chat_session_id: item.id,
-      new_title: editText.value,
-    };
-    try {
-      let response = await fetch('http://182.92.126.35:6005/sessions/change_title', {
-        method: 'POST',
-        headers: {
-          'Content-Type': 'application/json',
-        },
-        body: JSON.stringify(params),
-      });
-      if (!response.ok) {
-        throw new Error('Network response was not ok');
-      }
-      item.title = editText.value;
-    } catch (error) {
-      console.error('保存失败:', error);
-    }
-    editingId.value = null;
-  };
-  //获取消息列表
-  async function handleSend() {
-    if (session_id.value === '') {
-      await addNew();
-      createSessionTitle({ session_id: session_id.value, title: inputText.value });
-      sendMessage1();
-    } else {
-      createSessionTitle({ session_id: session_id.value, title: inputText.value });
-      sendMessage1();
-    }
-  }
-  //发送消息
-  async function sendMessage() {
-    spinning.value = true;
-    // 添加用户消息
-    messageList.value.push({
-      id: `user_${Date.now()}`,
-      type: 'user',
-      content: inputText.value,
-      timestamp: Date.now(),
+  const handleSave = (item) => {
+    store.changeSessionTitle(editText.value, item.id).then(() => {
+      editingId.value = null;
+      store.getSessionHistory();
     });
-    const params = {
-      chat_session_id: session_id.value,
-      prompt: inputText.value,
-      ref_file_ids: [],
-      thinking_enabled: false,
-    };
-    inputText.value = ''; // 清空输入框
-    //将用户输入的内容发送到后端
-    try {
-      // 将用户输入的内容发送到后端
-      let response = await fetch('http://182.92.126.35:6005/chat', {
-        method: 'POST',
-        headers: {
-          'Content-Type': 'application/json',
-        },
-        body: JSON.stringify(params),
-      });
-
-      if (!response.ok) {
-        throw new Error('Network response was not ok');
-      }
+  };
 
-      const data = await response.json();
-      const assistantReply = data.reply.content; // 获取助手回复
-      // formatMessage(assistantReply);
-      systemMessage.value = assistantReply;
+  //启用深度思考
+  const toggleThinking = () => {
+    store.deepseekR1Enable = !store.deepseekR1Enable;
+  };
 
-      // 添加系统回答
-      messageList.value.push({
-        id: `system_${Date.now()}`,
-        type: 'system',
-        content: systemMessage.value,
-        timestamp: Date.now(),
+  //获取消息列表
+  async function handleSend() {
+    store
+      .sendQuestion(inputText.value, () => {
+        if (dialogRef.value) {
+          dialogRef.value.scrollTop = dialogRef.value.scrollHeight;
+        }
+      })
+      .then(() => {
+        inputText.value = '';
       });
-    } catch (error) {
-      // 请求失败时设置系统消息为"服务器异常"
-      systemMessage.value = '服务器异常';
-      console.error('请求失败:', error);
-    } finally {
-      spinning.value = false; // 无论请求成功与否，都停止加载指示器
-    }
   }
-  //发送消息  流式响应
-  const sendMessage1 = async () => {
-    spinning.value = true; // 开始加载
-    messageList.value.push({
-      id: `user_${Date.now()}`,
-      type: 'user',
-      content: inputText.value,
-      timestamp: Date.now(),
-    });
-    // 构造请求参数
-    const params = {
-      chat_session_id: session_id.value, // 替换为实际的会话 ID
-      prompt: inputText.value,
-      ref_file_ids: [],
-      thinking_enabled: isThinking.value,
-    };
-    inputText.value = ''; // 清空输入框
-    try {
-      // 发送 POST 请求
-      const response = await fetch('http://182.92.126.35:6005/chat_stream', {
-        method: 'POST',
-        headers: {
-          'Content-Type': 'application/json',
-        },
-        body: JSON.stringify(params),
-      });
-
-      // 检查响应是否成功
-      if (!response.ok) {
-        throw new Error('Network response was not ok');
-      }
-
-      // 获取可读流
-      const reader = response.body.getReader();
-
-      // 创建一条新的消息对象
-      const newMessage = {
-        id: `response_${Date.now()}`,
-        type: 'response', // 消息类型
-        content: '',
-        content1: '',
-        Origintype: '',
-        timestamp: Date.now(), // 时间戳用来排序
-      };
-
-      // 将新消息添加到消息列表
-      messageList.value.push(newMessage);
-
-      // 读取流式数据
-      while (true) {
-        const { done, value } = await reader.read();
-        if (done) {
-          break;
-        }
 
-        // 将流数据转换为字符串
-        const chunk = new TextDecoder().decode(value);
-
-        // 使用正则表达式匹配完整的 JSON 对象
-        const jsonRegex = /{.*?}/g;
-        const matches = chunk.match(jsonRegex);
-        if (matches) {
-          matches.forEach((match) => {
-            try {
-              const data = JSON.parse(match);
-              if (data.type === 'thinking') {
-                // 找到当前消息对象并更新 content
-                const targetMessage = messageList.value.find((msg) => msg.id === newMessage.id);
-                if (targetMessage) {
-                  targetMessage.content += data.content; // 追加内容
-                  targetMessage.Origintype = data.type;
-                  scrollToBottom();
-                }
-              }
-              if (data.type === 'text') {
-                // 找到当前消息对象并更新 content
-                const targetMessage = messageList.value.find((msg) => msg.id === newMessage.id);
-                if (targetMessage) {
-                  targetMessage.content1 += data.content; // 追加内容
-                  targetMessage.Origintype1 = data.type;
-                  scrollToBottom();
-                }
-              }
-            } catch (error) {
-              console.error('Failed to parse JSON:', error);
-            }
-          });
-        }
-      }
-    } catch (error) {
-      // 请求失败时设置系统消息
-      if (!response || !response.ok) {
-        systemMessage.value = '服务器异常';
-        messageList.value.push({
-          id: `system_${Date.now()}`,
-          type: 'system',
-          content: systemMessage.value,
-          Origintype: 'text',
-          timestamp: Date.now(),
-        });
-        console.error('请求失败:', error);
-      }
-    } finally {
-      spinning.value = false; // 停止加载
-    }
-  };
-  //创建标题
-  async function createSessionTitle({ session_id, title }) {
-    const params = {
-      chat_session_id: session_id,
-      prompt: title,
-    };
-    let response = await fetch('http://182.92.126.35:6005/sessions/title', {
-      method: 'post',
-      headers: {
-        'Content-Type': 'application/json',
-      },
-      body: JSON.stringify(params),
-    });
-    const data = await response.json();
-  }
-  //获取会话历史
-  async function sessionsHistoryList() {
-    const params = {
-      user_id: userId,
-    };
-    let response = await fetch(`http://182.92.126.35:6005/sessions`, {
-      method: 'post',
-      headers: {
-        'Content-Type': 'application/json',
-      },
-      body: JSON.stringify(params),
-    });
-    const data = await response.json();
-    historySessions.value = data.chat_sessions;
-  }
   //获取具体会话记录
-  async function sessionsHistory(id: string) {
-    let response = await fetch(`http://182.92.126.35:6005/sessions/history_chat/?chat_session_id=${id}`, {
-      method: 'get',
-      headers: {
-        'Content-Type': 'application/json',
-      },
-    });
-    const data = await response.json();
-    if (data.chat_messages.length > 0) {
-      messageList.value = [];
-      data.chat_messages.forEach((item: any) => {
-        // role== user 用户提问
-        if (item.role === 'user') {
-          messageList.value.push({
-            id: `user_${Date.now()}`,
-            type: 'user',
-            content: item.content,
-            timestamp: Date.now(),
-          });
-        } else if (item.role === 'assistant') {
-          // role== assistant 机器回答
-          if (item.thinking_enabled) {
-            messageList.value.push({
-              id: `system_${Date.now()}_thinking`,
-              type: 'system',
-              content: item.thinking_content,
-              Origintype: 'thinking',
-              timestamp: Date.now(),
-            });
-            messageList.value.push({
-              id: `system_${Date.now()}_text`,
-              type: 'system',
-              content1: item.content,
-              Origintype1: 'text',
-              timestamp: Date.now(),
-            });
-          } else {
-            messageList.value.push({
-              id: `system_${Date.now()}`,
-              type: 'system',
-              content: item.content,
-              timestamp: Date.now(),
-            });
-          }
-        }
-      });
-    }
+  function sessionsHistory(id: string) {
+    store.getSessionHistoryByID(id);
   }
   //格式化消息
   function formatMessage(text: string) {
@@ -507,15 +218,10 @@
       .replace(/`([^`]+)`/g, '<code>$1</code>');
     return formatted;
   }
-  const emit = defineEmits(['update:modelValue']);
-
-  const close = () => {
-    emit('update:modelValue', false);
-  };
 
   // 初始化按钮定位
   onMounted(() => {
-    sessionsHistoryList();
+    store.getSessionHistory();
     openMenu();
   });
 </script>

src/components/Form/src/componentMap.ts

@@ -62,8 +62,8 @@ import JAddInput from './jeecg/components/JAddInput.vue';
 import { Time } from '/@/components/Time';
 import JRangeNumber from './jeecg/components/JRangeNumber.vue';
 import UserSelect from './jeecg/components/userSelect/index.vue';
-import JRangeDate from './jeecg/components/JRangeDate.vue'
-import JRangeTime from './jeecg/components/JRangeTime.vue'
+import JRangeDate from './jeecg/components/JRangeDate.vue';
+import JRangeTime from './jeecg/components/JRangeTime.vue';
 import RoleSelectInput from './jeecg/components/roleSelect/RoleSelectInput.vue';
 
 const componentMap = new Map<ComponentType, Component>();
@@ -139,8 +139,6 @@ componentMap.set('RangeDate', JRangeDate);
 componentMap.set('RangeTime', JRangeTime);
 componentMap.set('RoleSelect', RoleSelectInput);
 
-
-
 export function add(compName: ComponentType, component: Component) {
   componentMap.set(compName, component);
 }

src/components/Form/src/jeecg/components/modal/RoleSelectModal.vue

@@ -69,12 +69,12 @@
         },
         //update-begin-author:liusq date:2023-10-30 for: [issues/5514]组件页面显示错位
         actionColOptions: {
-            xs: 24,
-            sm: 8,
-            md: 8,
-            lg: 8,
-            xl: 8,
-            xxl: 8,
+          xs: 24,
+          sm: 8,
+          md: 8,
+          lg: 8,
+          xl: 8,
+          xxl: 8,
         },
         //update-end-author:liusq date:2023-10-30 for: [issues/5514]组件页面显示错位
         schemas: [

src/hooks/system/useMethods.ts

@@ -72,6 +72,7 @@ export function useMethods() {
     defHttp
       .post({ url: url, params: params, timeout: 1000 * 1000 }, { isTransformResponse: false })
       .then((data) => {
+        debugger;
         if (data.code == 200 && data.result) {
           const messageArr = data.result.split('/');
           const fileUrl = messageArr[messageArr.length - 1];
@@ -103,7 +104,8 @@ export function useMethods() {
   }
 
   async function exportXlsPost1(name, url, params, isXlsx = false) {
-    const data = await defHttp.get({ url: url, params: params, responseType: 'blob', timeout: 1000 * 1000 }, { isTransformResponse: false });
+    const data = await defHttp.post({ url: url, data: params, responseType: 'blob' }, { isTransformResponse: false });
+    debugger;
     if (!data) {
       createMessage.warning('文件下载失败');
       return;
@@ -174,7 +176,8 @@ export function useMethods() {
   return {
     handleExportXls: (name: string, url: string, params?: object) => exportXls(name, url, params),
     handleExportXlsPost: (name: string, url: string, params?: object) => exportXlsPost(name, url, params),
-    exportXlsPost0: (name: string, url: string, params?: object) => exportXlsPost1(name, url, params),
+    exportXlsGetBlob: (name: string, url: string, params?: object) => exportXls(name, url, params),
+    exportXlsPostBlob: (name: string, url: string, params?: object) => exportXlsPost1(name, url, params),
     handleImportXls: (data, url, success) => importXls(data, url, success),
     handleExportXlsx: (name: string, url: string, params?: object) => exportXls(name, url, params, true),
   };

src/layouts/default/sider/Aichat copy.vue

@@ -0,0 +1,905 @@
+<template>
+  <div>
+    <transition name="fade">
+      <div v-if="visible" class="dialog-overlay">
+        <!-- 左侧折叠区域 -->
+        <div class="left-side" :class="{ collapsed: isFold }" id="leftSide">
+          <div
+            class="addBtn"
+            :style="{
+              backgroundImage: `url(${isFold ? '/src/assets/images/vent/home/add.svg' : ''})`,
+              backgroundColor: isFold ? '' : '#2cb6ff',
+              width: isFold ? '20px' : 'auto',
+            }"
+            @click="addNew"
+          >
+            <span
+              class="btn-text-bg"
+              :style="{
+                backgroundImage: `url(${!isFold ? '/src/assets/images/vent/home/addB.svg' : ''})`,
+              }"
+            ></span>
+            <span v-if="!isFold" class="btn-text">添加新对话</span>
+          </div>
+          <div class="divider0"></div>
+          <div
+            v-if="isFold"
+            class="historyBtn"
+            :style="{ backgroundImage: `url(${isFold ? '/src/assets/images/vent/home/history.svg' : '/src/assets/images/vent/home/history.svg'})` }"
+            @click="addNew"
+          ></div>
+          <div v-else class="historyBtn1">
+            <span
+              class="btn-text-bg"
+              :style="{
+                backgroundImage: `url(${!isFold ? '/src/assets/images/vent/home/history.svg' : ''})`,
+              }"
+            ></span>
+            <span v-if="!isFold" class="btn-text">历史对话</span>
+            <a-list style="width: 110px" :split="false" :data-source="historySessions" :scroll="200" class="custom-list">
+              <template #renderItem="{ item }">
+                <a-list-item
+                  :style="{
+                    padding: '8px 10px 0 8px',
+                    color: '#5e7081',
+                    fontSize: '10px',
+                    position: 'relative', // 新增定位
+                  }"
+                  @click="sessionsHistory(item.id)"
+                >
+                  <!-- 新增flex布局容器 -->
+                  <div style="display: flex; justify-content: space-between; width: 100%">
+                    <div v-if="editingId !== item.id" class="text-container">
+                      <span class="edit-text">{{ item.title || '新会话' }}</span>
+                      <edit-outlined class="edit-icon" @click="startEditing(item)" />
+                    </div>
+
+                    <!-- 输入框 -->
+                    <a-input
+                      size="small"
+                      v-else
+                      v-model:value="editText"
+                      v-focus
+                      @blur="handleSave(item)"
+                      @keyup.enter="handleSave(item)"
+                      class="edit-input"
+                    />
+                  </div>
+                </a-list-item>
+              </template>
+            </a-list>
+          </div>
+          <div
+            class="foldBtn"
+            :style="{ backgroundImage: `url(${isFold ? '/src/assets/images/vent/home/Fold.svg' : '/src/assets/images/vent/home/unfold.svg'})` }"
+            @click="fold"
+          ></div>
+        </div>
+        <!-- 右侧对话框 -->
+        <div class="right-side">
+          <div class="input-content">
+            <!-- 对话区域 -->
+            <div class="dialog-area">
+              <div v-for="message in sortedMessages" :key="message.id" :class="['message-item', message.type]">
+                <!-- 用户提问样式 -->
+                <div v-if="message.type === 'user'" class="ask-message">
+                  <span>{{ message.content }}</span>
+                </div>
+
+                <!-- 系统回答样式 -->
+                <div v-else class="system-message">
+                  <div class="answerIcon"></div>
+                  <div class="answer-message">
+                    <div v-if="message.Origintype === 'thinking'">
+                      <span :id="'thinking-' + message.id" class="thinking-text" v-html="formatMessage(message.content)"></span>
+                    </div>
+                    <div v-if="message.Origintype1 === 'text'">
+                      <span :id="'text-' + message.id" class="answer-text" v-html="formatMessage(message.content1)"></span>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <!-- 文本输入区域 -->
+            <div v-if="spinning" class="thinking-area">
+              <span style="color: #fff">思考中···</span>
+              <a-spin :spinning="spinning"></a-spin>
+            </div>
+            <div class="input-area">
+              <textarea v-model="inputText" placeholder="请输入你的问题"> </textarea>
+              <!-- 底部操作栏 -->
+              <div class="action-bar">
+                <!-- 左侧深度思考按钮 -->
+                <div class="think-btn" :class="{ active: isThinking }" @click="toggleThinking"> <span>深度思考</span> </div>
+
+                <!-- 右侧操作按钮 -->
+                <div class="right-actions">
+                  <label class="upload-btn">
+                    <div class="send-file"></div>
+                    <span class="divider"> | </span>
+                    <div class="send-img"></div>
+                    <div class="send-btn" @click="handleSend"></div>
+                  </label>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </transition>
+  </div>
+</template>
+
+<script lang="ts" setup>
+import { ref, onMounted, unref, nextTick, computed } from 'vue';
+import { useUserStore } from '/@/store/modules/user';
+import { EditOutlined } from '@ant-design/icons-vue';
+// 响应式变量声明
+const dialogVisible = ref(false);
+const isFold = ref(false); // 是否折叠
+const inputText = ref(''); // 输入框内容
+const historySessions = ref([]); // 消会话历史
+const spinning = ref(false); // 加载状态
+const systemMessage = ref(''); // 系统返回信息
+const session_id = ref(''); // 会话id
+const hasCreated = ref(false); // 标志位，防止重复调用create接口
+const hasAdd = ref(false); // 标志位，防止重复调用create接口
+const userStore = useUserStore(); //获取用户信息
+const editingId = ref<number | null>(null);
+const editText = ref('');
+const isThinking = ref(false);
+interface ListItem {
+  id: number;
+  title?: string;
+}
+defineProps({
+  visible: {
+    type: Boolean,
+    required: true,
+  },
+});
+let userId = unref(userStore.getUserInfo).id;
+// const userId = ref(0);
+type MessageItem = {
+  id: string; // 唯一标识时间戳
+  type: 'user' | 'system';
+  content?: string;
+  content1?: string;
+  Origintype?: string;
+  Origintype1?: string;
+  timestamp: number; // 排序依据
+};
+const messageList = ref<MessageItem[]>([]);
+const sortedMessages = computed(() => {
+  return messageList.value.sort((a, b) => a.timestamp - b.timestamp);
+});
+const vFocus = {
+  mounted: (el: HTMLElement) => el.querySelector('input')?.focus(),
+};
+const scrollToBottom = () => {
+  const dialogArea = document.querySelector('.dialog-area');
+  if (dialogArea) {
+    dialogArea.scrollTop = dialogArea.scrollHeight;
+  }
+};
+
+// const openMenu = () => {
+//   dialogVisible.value = props.modelValue;
+//   // console.log(props.dialogVisible, 'ssssssssss');
+//   if (dialogVisible.value) {
+//     // addNew();
+//     hasCreated.value = true;
+//   }
+// };
+const fold = () => {
+  isFold.value = !isFold.value;
+  if (!isFold.value) {
+    sessionsHistoryList();
+  }
+};
+//启用深度思考
+const toggleThinking = () => {
+  isThinking.value = !isThinking.value;
+};
+//创建新对话
+async function addNew() {
+  hasAdd.value = !hasAdd.value;
+  const params = {
+    user_id: userId,
+  };
+  let response = await fetch('http://182.92.126.35:6005/sessions/create', {
+    method: 'post',
+    headers: {
+      'Content-Type': 'application/json',
+    },
+    body: JSON.stringify(params),
+  });
+  const data = await response.json();
+  session_id.value = data.id;
+  messageList.value = [];
+}
+//编辑标题
+const startEditing = (item: ListItem) => {
+  editingId.value = item.id;
+  editText.value = item.title || '';
+};
+
+// 保存修改
+const handleSave = async (item: ListItem) => {
+  const params = {
+    chat_session_id: item.id,
+    new_title: editText.value,
+  };
+  try {
+    let response = await fetch('http://182.92.126.35:6005/sessions/change_title', {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json',
+      },
+      body: JSON.stringify(params),
+    });
+    if (!response.ok) {
+      throw new Error('Network response was not ok');
+    }
+    item.title = editText.value;
+  } catch (error) {
+    console.error('保存失败:', error);
+  }
+  editingId.value = null;
+};
+//获取消息列表
+async function handleSend() {
+  if (session_id.value === '') {
+    await addNew();
+    createSessionTitle({ session_id: session_id.value, title: inputText.value });
+    sendMessage1();
+  } else {
+    createSessionTitle({ session_id: session_id.value, title: inputText.value });
+    sendMessage1();
+  }
+}
+//发送消息
+async function sendMessage() {
+  spinning.value = true;
+  // 添加用户消息
+  messageList.value.push({
+    id: `user_${Date.now()}`,
+    type: 'user',
+    content: inputText.value,
+    timestamp: Date.now(),
+  });
+  const params = {
+    chat_session_id: session_id.value,
+    prompt: inputText.value,
+    ref_file_ids: [],
+    thinking_enabled: false,
+  };
+  inputText.value = ''; // 清空输入框
+  //将用户输入的内容发送到后端
+  try {
+    // 将用户输入的内容发送到后端
+    let response = await fetch('http://182.92.126.35:6005/chat', {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json',
+      },
+      body: JSON.stringify(params),
+    });
+
+    if (!response.ok) {
+      throw new Error('Network response was not ok');
+    }
+
+    const data = await response.json();
+    const assistantReply = data.reply.content; // 获取助手回复
+    // formatMessage(assistantReply);
+    systemMessage.value = assistantReply;
+
+    // 添加系统回答
+    messageList.value.push({
+      id: `system_${Date.now()}`,
+      type: 'system',
+      content: systemMessage.value,
+      timestamp: Date.now(),
+    });
+  } catch (error) {
+    // 请求失败时设置系统消息为"服务器异常"
+    systemMessage.value = '服务器异常';
+    console.error('请求失败:', error);
+  } finally {
+    spinning.value = false; // 无论请求成功与否，都停止加载指示器
+  }
+}
+//发送消息  流式响应
+const sendMessage1 = async () => {
+  spinning.value = true; // 开始加载
+  messageList.value.push({
+    id: `user_${Date.now()}`,
+    type: 'user',
+    content: inputText.value,
+    timestamp: Date.now(),
+  });
+  // 构造请求参数
+  const params = {
+    chat_session_id: session_id.value, // 替换为实际的会话 ID
+    prompt: inputText.value,
+    ref_file_ids: [],
+    thinking_enabled: isThinking.value,
+  };
+  inputText.value = ''; // 清空输入框
+  try {
+    // 发送 POST 请求
+    const response = await fetch('http://182.92.126.35:6005/chat_stream', {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json',
+      },
+      body: JSON.stringify(params),
+    });
+
+    // 检查响应是否成功
+    if (!response.ok) {
+      throw new Error('Network response was not ok');
+    }
+
+    // 获取可读流
+    const reader = response.body.getReader();
+
+    // 创建一条新的消息对象
+    const newMessage = {
+      id: `response_${Date.now()}`,
+      type: 'response', // 消息类型
+      content: '',
+      content1: '',
+      Origintype: '',
+      timestamp: Date.now(), // 时间戳用来排序
+    };
+
+    // 将新消息添加到消息列表
+    messageList.value.push(newMessage);
+
+    // 读取流式数据
+    while (true) {
+      const { done, value } = await reader.read();
+      if (done) {
+        console.log('Stream complete');
+        break;
+      }
+
+      // 将流数据转换为字符串
+      const chunk = new TextDecoder().decode(value);
+      console.log('Received chunk:', chunk);
+
+      // 使用正则表达式匹配完整的 JSON 对象
+      const jsonRegex = /{.*?}/g;
+      const matches = chunk.match(jsonRegex);
+      if (matches) {
+        matches.forEach((match) => {
+          try {
+            const data = JSON.parse(match);
+            console.log(data.type, '数据类型11111111111111111');
+            if (data.type === 'thinking') {
+              // 找到当前消息对象并更新 content
+              const targetMessage = messageList.value.find((msg) => msg.id === newMessage.id);
+              if (targetMessage) {
+                targetMessage.content += data.content; // 追加内容
+                targetMessage.Origintype = data.type;
+                scrollToBottom();
+              }
+            }
+            if (data.type === 'text') {
+              // 找到当前消息对象并更新 content
+              const targetMessage = messageList.value.find((msg) => msg.id === newMessage.id);
+              if (targetMessage) {
+                targetMessage.content1 += data.content; // 追加内容
+                targetMessage.Origintype1 = data.type;
+                scrollToBottom();
+              }
+            }
+          } catch (error) {
+            console.error('Failed to parse JSON:', error);
+          }
+        });
+      }
+    }
+  } catch (error) {
+    // 请求失败时设置系统消息
+    if (!response || !response.ok) {
+      systemMessage.value = '服务器异常';
+      messageList.value.push({
+        id: `system_${Date.now()}`,
+        type: 'system',
+        content: systemMessage.value,
+        Origintype: 'text',
+        timestamp: Date.now(),
+      });
+      console.error('请求失败:', error);
+    }
+  } finally {
+    spinning.value = false; // 停止加载
+  }
+};
+//创建标题
+async function createSessionTitle({ session_id, title }) {
+  const params = {
+    chat_session_id: session_id,
+    prompt: title,
+  };
+  let response = await fetch('http://182.92.126.35:6005/sessions/title', {
+    method: 'post',
+    headers: {
+      'Content-Type': 'application/json',
+    },
+    body: JSON.stringify(params),
+  });
+  const data = await response.json();
+}
+//获取会话历史
+async function sessionsHistoryList() {
+  const params = {
+    user_id: userId,
+  };
+  let response = await fetch(`http://182.92.126.35:6005/sessions`, {
+    method: 'post',
+    headers: {
+      'Content-Type': 'application/json',
+    },
+    body: JSON.stringify(params),
+  });
+  const data = await response.json();
+  historySessions.value = data.chat_sessions;
+}
+//获取具体会话记录
+async function sessionsHistory(id: string) {
+  let response = await fetch(`http://182.92.126.35:6005/sessions/history_chat/?chat_session_id=${id}`, {
+    method: 'get',
+    headers: {
+      'Content-Type': 'application/json',
+    },
+  });
+  const data = await response.json();
+  if (data.chat_messages.length > 0) {
+    messageList.value = [];
+    data.chat_messages.forEach((item: any) => {
+      // role== user 用户提问
+      if (item.role === 'user') {
+        messageList.value.push({
+          id: `user_${Date.now()}`,
+          type: 'user',
+          content: item.content,
+          timestamp: Date.now(),
+        });
+      } else if (item.role === 'assistant') {
+        // role== assistant 机器回答
+        if (item.thinking_enabled) {
+          messageList.value.push({
+            id: `system_${Date.now()}_thinking`,
+            type: 'system',
+            content: item.thinking_content,
+            Origintype: 'thinking',
+            timestamp: Date.now(),
+          });
+          messageList.value.push({
+            id: `system_${Date.now()}_text`,
+            type: 'system',
+            content1: item.content,
+            Origintype1: 'text',
+            timestamp: Date.now(),
+          });
+        } else {
+          messageList.value.push({
+            id: `system_${Date.now()}`,
+            type: 'system',
+            content: item.content,
+            timestamp: Date.now(),
+          });
+        }
+
+        console.log(item.content);
+      }
+    });
+  }
+}
+//格式化消息
+function formatMessage(text: string) {
+  let formatted = text
+    // 处理换行
+    .replace(/\n\n/g, '<br>')
+    .replace(/\n###/g, '<br> ')
+    .replace(/###/g, '')
+    .replace(/---/g, '')
+    // 处理粗体
+    .replace(/\*\*(.*?)\*\*/g, '<strong>$1</strong>')
+    // 处理斜体
+    .replace(/\*(.*?)\*/g, '<em>$1</em>')
+    // 处理行内代码
+    .replace(/`([^`]+)`/g, '<code>$1</code>');
+  return formatted;
+}
+const emit = defineEmits(['update:modelValue']);
+
+const close = () => {
+  emit('update:modelValue', false);
+};
+
+// 初始化按钮定位
+onMounted(() => {
+  sessionsHistoryList();
+  console.log('ssssssssss');
+});
+</script>
+
+<style lang="less" scoped>
+@keyframes menuShow {
+  0% {
+    width: 0;
+    height: 0;
+  }
+  100% {
+    width: 480px;
+    height: 100vh;
+  }
+}
+.custom-list {
+  height: 360px;
+  overflow-y: auto;
+}
+/* 穿透组件作用域 */
+::v-deep .custom-list {
+  scrollbar-width: thin;
+  scrollbar-color: #1890ff #f0f0f0;
+  &::-webkit-scrollbar {
+    width: 4px;
+    height: 6px;
+  }
+
+  &::-webkit-scrollbar-thumb {
+    background: #1890ff;
+    border-radius: 4px;
+  }
+
+  &::-webkit-scrollbar-track {
+    background: #f0f0f0;
+    border-radius: 4px;
+  }
+}
+::v-deep .zxm-list-items {
+  color: #1890ff;
+}
+::v-deep .zxm-list-item:hover {
+  text-decoration: underline;
+  color: #1890ff !important;
+}
+.text-container {
+  display: flex;
+  align-items: center;
+  width: 100%;
+  overflow: hidden;
+}
+
+.text-ellipsis {
+  flex: 1;
+}
+.edit-text {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  min-width: 0;
+}
+.edit-icon {
+  flex-shrink: 0;
+  cursor: pointer;
+  margin-left: auto;
+}
+.edit-input {
+  font-size: 10px;
+}
+.trigger-button {
+  position: fixed;
+  bottom: 10px;
+  right: 10px;
+  z-index: 1000000;
+  .icon {
+    width: 60px;
+    height: 60px;
+    position: relative;
+    background-image: url('/@/assets/images/vent/home/wakeBtn.png');
+    background-position: center;
+    background-size: 100% 100%;
+  }
+}
+.dialog-overlay {
+  width: 32%;
+  height: 55%;
+  z-index: 999;
+  display: flex;
+  position: fixed;
+  right: 90px;
+  bottom: 20px;
+  box-shadow: 0 0 3px 3px #1074c1;
+  background-color: #09172c;
+}
+
+/* 遮罩层淡入淡出 */
+.fade-enter-active,
+.fade-leave-active {
+  transition: opacity 0.3s;
+}
+.fade-enter-from,
+.fade-leave-to {
+  opacity: 0;
+}
+
+/* 弹窗缩放动画 */
+.scale-enter-active,
+.scale-leave-active {
+  transition: all 0.3s ease;
+}
+.scale-enter-from {
+  transform: scale(0.5) translate(-50%, -50%);
+  opacity: 0;
+}
+.scale-leave-to {
+  transform: scale(1.2) translate(-50%, -50%);
+  opacity: 0;
+}
+
+.left-side {
+  background: #0c2842;
+  transition: width 0.5s ease; /* 平滑过渡动画 */
+  width: 120px; /* 展开时宽度 */
+  position: relative; /* 用于按钮定位 */
+}
+.left-side.collapsed {
+  width: 40px; /* 折叠时宽度 */
+}
+
+.addBtn {
+  height: 30px;
+  position: absolute;
+  background-size: 100% 100%;
+  background-position: center;
+  padding: 2px;
+  right: 10px;
+  top: 10px;
+  left: 10px;
+  align-items: center;
+  border-radius: 3px;
+  cursor: pointer;
+}
+.btn-text-bg {
+  width: 14px;
+  height: 14px;
+  position: absolute;
+  background-size: 100% 100%;
+  right: 10px;
+  top: 9px;
+  left: 10px;
+  bottom: 10px;
+}
+.btn-text {
+  margin-left: 3px;
+  font-size: 12px;
+  color: #fff;
+  white-space: nowrap;
+  margin-left: 30px;
+  line-height: 26px;
+}
+.historyBtn {
+  width: 20px;
+  height: 20px;
+  position: absolute;
+  background-size: 100% 100%;
+  background-position: center;
+  padding: 2px;
+  right: 10px;
+  top: 100px;
+}
+.historyBtn1 {
+  width: 20px;
+  height: 20px;
+  position: absolute;
+  background-size: 100% 100%;
+  background-position: center;
+  left: 3px;
+  top: 80px;
+}
+.divider0 {
+  border-bottom: 1px solid #1074c1;
+  width: auto;
+  margin: 0 10px;
+  height: 13%;
+  display: block;
+  background: transparent;
+}
+.foldBtn {
+  width: 20px;
+  height: 20px;
+  position: absolute;
+  background-size: 100% 100%;
+  background-position: center;
+  padding: 2px;
+  right: 10px;
+  bottom: 10px;
+  cursor: pointer;
+}
+
+.right-side {
+  flex: 1; /* 占据剩余空间 */
+  background: #09172c;
+}
+
+.input-content {
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-end; /* 内容底部对齐 */
+  height: 100%;
+  padding: 20px; /* 统一内边距 */
+}
+.ask-message {
+  align-self: flex-end;
+  float: right;
+  max-width: 70%;
+  padding: 10px;
+  margin: 10px;
+  border-radius: 5px;
+  color: #fff;
+  background: #0c2842;
+  align-self: flex-end; /* 右侧对齐‌:ml-citation{ref="2" data="citationList"} */
+}
+.answer {
+  display: flex;
+  flex-direction: row;
+}
+.answerIcon {
+  flex-shrink: 0;
+  margin-top: 10px;
+  width: 35px;
+  height: 35px;
+  background-image: url('/@/assets/images/vent/home/answerIcon.svg');
+  background-size: 100% 100%;
+}
+.answer-message {
+  float: left;
+  padding: 10px;
+  margin: 10px;
+  border-radius: 5px;
+  background: #0c2842;
+}
+.thinking-text {
+  color: gray;
+  font-size: 12px;
+}
+.answer-text {
+  color: #fff;
+}
+/** 系统返回信息**/
+.system-message {
+  display: flex;
+  flex-direction: row;
+  align-self: flex-start;
+  width: 100%;
+  padding: 12px;
+  display: flex;
+}
+.answerIcon {
+  margin-top: 10px;
+  width: 35px;
+  height: 35px;
+  background-image: url('/@/assets/images/vent/home/answerIcon.svg');
+  background-size: 100% 100%;
+}
+.think-area {
+  color: #7979799f;
+}
+.answer-area {
+  color: #fff;
+}
+.dialog-area {
+  flex: 1; /* 占据剩余空间 */
+  gap: 50px; /* 消息块间隔统一控制 */
+  overflow-y: auto; /* 垂直滚动条 */
+  margin-bottom: 10px;
+}
+.loading-wrapper,
+.content-wrapper {
+  min-height: 40px;
+}
+.message-item.user {
+  margin-bottom: 50px;
+}
+.input-area {
+  background-color: #043256 !important;
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+}
+textarea {
+  background-color: #043256 !important;
+  width: 100%;
+  height: 40px;
+  border: none;
+  resize: none;
+  outline: none;
+  overflow: hidden;
+  padding: 10px; /* 统一内边距 */
+  color: #fff;
+}
+
+.action-bar {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 8px 16px;
+}
+
+.think-btn {
+  border: 1px solid #ccc;
+  width: 120px;
+  height: 20px;
+  line-height: 20px;
+  text-align: center;
+  border-radius: 50px;
+  cursor: pointer;
+  background: white;
+  transition: background 0.3s;
+}
+
+.think-btn.active {
+  background: #1890ff;
+  color: white;
+  border-color: #1890ff;
+}
+.right-actions {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+
+.upload-btn {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+}
+.upload-btn {
+  float: right;
+  display: flex;
+  cursor: pointer;
+  padding: 6px 12px;
+}
+
+.divider {
+  color: #ccc;
+  font-weight: 300;
+  margin: 0 10px;
+}
+
+.send-file {
+  width: 20px;
+  height: 20px;
+  background-image: url('/@/assets/images/vent/home/sendFile.svg');
+  background-size: 100% 100%;
+  border-radius: 4px;
+  cursor: pointer;
+}
+.send-img {
+  width: 20px;
+  height: 20px;
+  background-image: url('/@/assets/images/vent/home/sendImg.svg');
+  background-size: 100% 100%;
+  border-radius: 4px;
+  cursor: pointer;
+}
+.send-btn {
+  width: 20px;
+  height: 20px;
+  margin-left: 10px;
+  margin-right: 10px;
+  background-color: #1074c1;
+  background-image: url('/@/assets/images/vent/home/send.svg');
+  background-position: center;
+  background-size: 100% 100%;
+  border-radius: 2px;
+  cursor: pointer;
+}
+</style>

src/layouts/default/sider/index.vue

@@ -14,7 +14,8 @@
   <BottomSider v-else-if="getIsBottomMenu" />
   <Sider v-else /> -->
   <BottomSider v-if="!noSiderLink.includes(routePath)" />
-  <bottomSider2 v-if="noChatLink.includes(routePath)" />
+  <!-- <bottomSider2 v-if="!noChatLink.includes(routePath)" /> -->
+  <!-- <bottomSider2 /> -->
 </template>
 <script lang="ts">
   import { defineComponent } from 'vue';

src/store/modules/AIChat.ts

@@ -0,0 +1,255 @@
+import { defineStore } from 'pinia';
+import { useUserStore } from './user';
+
+export const useAIChat = defineStore({
+  id: 'ai-chat',
+  state: (): {
+    /** 会话历史 */
+    sessionHistory: {
+      id: string;
+      user_id: string;
+      agent: string;
+      title: string;
+      title_type: string;
+      version: number;
+      current_message_id: number;
+      inserted_at: string;
+      updated_at: string;
+    }[];
+    /** 消息历史 */
+    messageHistory: {
+      id: string; // 唯一标识（可用时间戳生成）
+      type: 'user' | 'system' | 'response';
+      content: string;
+      /** 深度思考时的文本 */
+      contentR1: string;
+      timestamp: number; // 排序依据
+    }[];
+    /** 当前会话ID */
+    currentSessionID: string;
+    /** 当前会话是否有流正在传输 */
+    streaming: boolean;
+    /** 当前会话是否启用 deepseekR1 模型 */
+    deepseekR1Enable: boolean;
+    /** 当前用户ID */
+    userID: string;
+  } => {
+    const userid = useUserStore().getUserInfo.id as string;
+    return {
+      sessionHistory: [],
+      messageHistory: [],
+      currentSessionID: '',
+      streaming: false,
+      deepseekR1Enable: false,
+      userID: userid,
+    };
+  },
+  getters: {
+    getMessageHistory: (state) => {
+      return state.messageHistory.sort((a, b) => a.timestamp - b.timestamp);
+    },
+  },
+  actions: {
+    /** 创建新会话 */
+    async createSession() {
+      const response = await fetch('http://182.92.126.35:6005/sessions/create', {
+        method: 'post',
+        headers: {
+          'Content-Type': 'application/json',
+        },
+        body: JSON.stringify({
+          user_id: this.userID,
+        }),
+      });
+      const data = await response.json();
+      this.currentSessionID = data.id;
+      this.messageHistory = [];
+    },
+    /** 根据当前会话，创建聊天流，流里的数据将会更新到消息历史中 */
+    async createStream(question: string, onUpdate?: any) {
+      this.streaming = true;
+      this.messageHistory.push({
+        id: `user_${Date.now()}`,
+        type: 'user',
+        content: question,
+        contentR1: '',
+        timestamp: Date.now(),
+      });
+
+      try {
+        // 发送 POST 请求
+        const response = await fetch('http://182.92.126.35:6005/chat_stream', {
+          method: 'POST',
+          headers: {
+            'Content-Type': 'application/json',
+          },
+          body: JSON.stringify({
+            chat_session_id: this.currentSessionID,
+            prompt: question,
+            ref_file_ids: [],
+            thinking_enabled: this.deepseekR1Enable,
+          }),
+        });
+
+        // 检查响应是否成功
+        if (!response.ok || !response.body) {
+          throw new Error('Network response was not ok');
+        }
+
+        // 获取可读流
+        const reader = response.body.getReader();
+
+        // 创建一条新的消息对象
+        const newMessage = {
+          id: `response_${Date.now()}`,
+          type: 'response' as any,
+          content: '',
+          contentR1: '',
+          timestamp: Date.now(),
+        };
+
+        // 将新消息添加到消息列表
+        this.messageHistory.push(newMessage);
+
+        // 读取流式数据
+        while (true) {
+          const { done, value } = await reader.read();
+          if (done) {
+            break;
+          }
+
+          // 将流数据转换为字符串
+          const chunk = new TextDecoder().decode(value);
+
+          // 使用正则表达式匹配完整的 JSON 对象
+          const jsonRegex = /{.*?}/g;
+          const matches = chunk.match(jsonRegex);
+
+          if (!matches) continue;
+          matches.forEach((match) => {
+            const data = JSON.parse(match);
+            // 找到当前消息对象并更新 content
+            const targetMessage = this.messageHistory.find((msg) => msg.id === newMessage.id);
+            if (!targetMessage) return;
+            if (data.type === 'text') {
+              targetMessage.content += data.content; // 追加内容
+            }
+            if (data.type === 'thinking') {
+              targetMessage.contentR1 += data.content;
+            }
+            if (typeof onUpdate === 'function') {
+              onUpdate(value);
+            }
+          });
+        }
+      } catch (error) {
+        // 请求失败时设置系统消息
+        this.messageHistory.push({
+          id: `system_${Date.now()}`,
+          type: 'system',
+          content: '系统异常，请稍后再试',
+          contentR1: '',
+          timestamp: Date.now(),
+        });
+      } finally {
+        this.streaming = false;
+      }
+    },
+    /** 创建会话的标题 */
+    async createSessionTitle(title: string) {
+      await fetch('http://182.92.126.35:6005/sessions/title', {
+        method: 'post',
+        headers: {
+          'Content-Type': 'application/json',
+        },
+        body: JSON.stringify({
+          chat_session_id: this.currentSessionID,
+          prompt: title,
+        }),
+      });
+    },
+    /** 修改会话的标题 */
+    async changeSessionTitle(title: string, id: string) {
+      try {
+        const response = await fetch('http://182.92.126.35:6005/sessions/change_title', {
+          method: 'POST',
+          headers: {
+            'Content-Type': 'application/json',
+          },
+          body: JSON.stringify({
+            chat_session_id: id,
+            new_title: title,
+          }),
+        });
+        if (!response.ok) {
+          throw new Error('Network response was not ok');
+        }
+        this.sessionHistory.forEach((session) => {
+          if (session.id === id) {
+            session.title = title;
+          }
+        });
+      } catch (error) {
+        console.error('保存失败:', error);
+      }
+    },
+    /** 获取会话历史 */
+    async getSessionHistory() {
+      const response = await fetch(`http://182.92.126.35:6005/sessions`, {
+        method: 'post',
+        headers: {
+          'Content-Type': 'application/json',
+        },
+        body: JSON.stringify({
+          user_id: this.userID,
+        }),
+      });
+      const data = await response.json();
+      this.sessionHistory = data.chat_sessions;
+    },
+    /** 获取会话历史 */
+    async getSessionHistoryByID(id: string) {
+      const response = await fetch(`http://182.92.126.35:6005/sessions/history_chat/?chat_session_id=${id}`, {
+        method: 'get',
+        headers: {
+          'Content-Type': 'application/json',
+        },
+      });
+      const data = await response.json();
+      if (data.chat_messages.length === 0) return;
+      this.currentSessionID = id;
+      this.messageHistory = data.chat_messages.map((item: any) => {
+        if (item.role === 'user') {
+          // role== user 用户提问
+          return {
+            id: `user_${Date.now()}`,
+            type: 'user',
+            content: item.content,
+            contentR1: '',
+            timestamp: Date.now(),
+          };
+        } else {
+          // role== assistant 机器回答
+          return {
+            id: `system_${Date.now()}`,
+            type: 'system',
+            content: item.content,
+            contentR1: item.thinking_content,
+            timestamp: Date.now(),
+          };
+        }
+      });
+    },
+    /** 发出问题 */
+    async sendQuestion(question: string, onUpdate?: any) {
+      if (this.currentSessionID === '') {
+        await this.createSession();
+        this.createSessionTitle(question);
+        this.createStream(question, onUpdate);
+      } else {
+        this.createSessionTitle(question);
+        this.createStream(question, onUpdate);
+      }
+    },
+  },
+});

src/views/vent/bundle/bundleMonitorTable/bundle-table.data.ts

@@ -1321,8 +1321,8 @@ export const wlmlcolumns: BasicColumn[] = [
     title: '管路名称',
     width: 60,
     align: 'center',
-    dataIndex: 'glmc',
-    key: 'glmc',
+    dataIndex: 'jcdd',
+    key: 'jcdd',
   },
   {
     title: '分析次数',
@@ -1570,3 +1570,202 @@ export const Cctkcolumns: BasicColumn[] = [
     align: 'center',
   },
 ];
+export const Jinjiecolumns: BasicColumn[] = [
+  {
+    title: '分站安装位置',
+    width: 100,
+    align: 'center',
+    dataIndex: 'sbmc',
+    key: 'sbmc',
+  },
+  {
+    title: '束管编号',
+    dataIndex: 'glbh',
+    key: 'glbh',
+    width: 80,
+    align: 'center',
+  },
+  {
+    title: '管路名称',
+    dataIndex: 'jcdd',
+    key: 'jcdd',
+    width: 100,
+    align: 'center',
+  },
+  {
+    title: 'O₂(%)',
+    children: [
+      {
+        title: '最小值',
+        dataIndex: 'o2_min',
+        key: 'o2_min',
+        width: 80,
+        align: 'center',
+      },
+      {
+        title: '最大值',
+        dataIndex: 'o2_max',
+        key: 'o2_max',
+        width: 80,
+        align: 'center',
+      },
+      {
+        title: '平均值',
+        dataIndex: 'o2_ave',
+        key: 'o2_ave',
+        width: 80,
+        align: 'center',
+      },
+    ],
+  },
+
+  {
+    title: 'CO₂(%)',
+    children: [
+      {
+        title: '最小值',
+        dataIndex: 'co2_min',
+        key: 'co2_min',
+        width: 80,
+        align: 'center',
+      },
+      {
+        title: '最大值',
+        dataIndex: 'co2_max',
+        key: 'co2_max',
+        width: 80,
+        align: 'center',
+      },
+      {
+        title: '平均值',
+        dataIndex: 'co2_ave',
+        key: 'co2_ave',
+        width: 80,
+        align: 'center',
+      },
+    ],
+  },
+  {
+    title: 'CO(PPM)',
+    children: [
+      {
+        title: '最小值',
+        dataIndex: 'co_min',
+        key: 'co_min',
+        width: 80,
+        align: 'center',
+      },
+      {
+        title: '最大值',
+        dataIndex: 'co_max',
+        key: 'co_max',
+        width: 80,
+        align: 'center',
+      },
+      {
+        title: '平均值',
+        dataIndex: 'co_ave',
+        key: 'co_ave',
+        width: 80,
+        align: 'center',
+      },
+    ],
+  },
+  {
+    title: 'CH₄(%)',
+    children: [
+      {
+        title: '最小值',
+        dataIndex: 'ch4_min',
+        key: 'ch4_min',
+        width: 80,
+        align: 'center',
+      },
+      {
+        title: '最大值',
+        dataIndex: 'ch4_max',
+        key: 'ch4_max',
+        width: 80,
+        align: 'center',
+      },
+      {
+        title: '平均值',
+        dataIndex: 'ch4_ave',
+        key: 'ch4_ave',
+        width: 80,
+        align: 'center',
+      },
+    ],
+  },
+  {
+    title: 'C₂H₂(%)',
+    children: [
+      {
+        title: '最小值',
+        dataIndex: 'c2h2_min',
+        key: 'c2h2_min',
+        width: 80,
+        align: 'center',
+      },
+      {
+        title: '最大值',
+        dataIndex: 'c2h2_max',
+        key: 'c2h2_max',
+        width: 80,
+        align: 'center',
+      },
+      {
+        title: '平均值',
+        dataIndex: 'c2h2_ave',
+        key: 'c2h2_ave',
+        width: 80,
+        align: 'center',
+      },
+    ],
+  },
+  {
+    title: 'C₂H₄(%)',
+    children: [
+      {
+        title: '最小值',
+        dataIndex: 'c2h4_min',
+        key: 'c2h4_min',
+        width: 80,
+        align: 'center',
+      },
+      {
+        title: '最大值',
+        dataIndex: 'c2h4_max',
+        key: 'c2h4_max',
+        width: 80,
+        align: 'center',
+      },
+      {
+        title: '平均值',
+        dataIndex: 'c2h4_ave',
+        key: 'c2h4_ave',
+        width: 80,
+        align: 'center',
+      },
+    ],
+  },
+  {
+    title: '备注',
+    dataIndex: 'smark',
+    key: 'smark',
+    width: 100,
+    align: 'center',
+  },
+  {
+    title: '煤自燃阶段',
+    dataIndex: 'internalFireWarnLevel',
+    width: 100,
+    align: 'center',
+  },
+  {
+    title: '操作',
+    dataIndex: 'action',
+    width: 100,
+    align: 'center',
+  },
+];

src/views/vent/bundle/bundleMonitorTable/index.vue

@@ -50,7 +50,18 @@
 
 <script setup lang="ts">
 import { ref, onMounted, computed, shallowRef, reactive, nextTick } from 'vue';
-import { columns, Hjtcolumns, Bdcolumns, Bltcolumns, Sgtcolumns, Yjlcolumns, Cctrkcolumns, wlmlcolumns, Cctkcolumns } from './bundle-table.data';
+import {
+  columns,
+  Hjtcolumns,
+  Bdcolumns,
+  Bltcolumns,
+  Sgtcolumns,
+  Yjlcolumns,
+  Cctrkcolumns,
+  wlmlcolumns,
+  Cctkcolumns,
+  Jinjiecolumns,
+} from './bundle-table.data';
 import { getBundleInfoList, getAllFileList, getAllFileListById } from './bundle-table.api';
 import customHeader from '/@/components/vent/customHeader.vue';
 // import { blastDelta } from './modal/blastDelta.vue';
@@ -100,6 +111,8 @@ const computedColumns = computed(() => {
       return wlmlcolumns; // 乌兰木伦对应的列配置
     case 'sdmtjtcctmk':
       return Cctkcolumns; // 乌兰木伦对应的列配置
+    case 'sdmtjtjjmk':
+      return Jinjiecolumns; // 锦界对应的列配置
     default:
       return columns; // 默认情况下返回的列配置
   }
@@ -772,6 +785,99 @@ function updateChart(data: any) {
             type: 'bar',
           },
         ];
+      case 'sdmtjtjjmk':
+        return [
+          {
+            name: 'O₂最大值',
+            data: o2MaxValues,
+            type: 'bar',
+          },
+          {
+            name: 'O₂最小值',
+            data: o2MinValues,
+            type: 'bar',
+          },
+          {
+            name: 'O₂平均值',
+            data: o2AveValues,
+            type: 'bar',
+          },
+          {
+            name: 'CO最大值',
+            data: coMaxValues,
+            type: 'bar',
+          },
+          {
+            name: 'CO最小值',
+            data: coMinValues,
+            type: 'bar',
+          },
+          {
+            name: 'CO平均值',
+            data: coAveValues,
+            type: 'bar',
+          },
+          {
+            name: 'CO₂最大值',
+            data: co2MaxValues,
+            type: 'bar',
+          },
+          {
+            name: 'CO₂最小值',
+            data: co2MinValues,
+            type: 'bar',
+          },
+          {
+            name: 'CO₂平均值',
+            data: co2AveValues,
+            type: 'bar',
+          },
+          {
+            name: 'CH₄最大值',
+            data: ch4MaxValues,
+            type: 'bar',
+          },
+          {
+            name: 'CH₄最小值',
+            data: ch4MinValues,
+            type: 'bar',
+          },
+          {
+            name: 'CH₄平均值',
+            data: ch4AveValues,
+            type: 'bar',
+          },
+          {
+            name: 'C₂H₄最大值',
+            data: c2h4MaxValues,
+            type: 'bar',
+          },
+          {
+            name: 'C₂H₄最小值',
+            data: c2h4MinValues,
+            type: 'bar',
+          },
+          {
+            name: 'C₂H₄平均值',
+            data: c2h4AveValues,
+            type: 'bar',
+          },
+          {
+            name: 'C₂H₂最大值',
+            data: c2h2MaxValues,
+            type: 'bar',
+          },
+          {
+            name: 'C₂H₂最小值',
+            data: c2h2MinValues,
+            type: 'bar',
+          },
+          {
+            name: 'C₂H₂平均值',
+            data: c2h2AveValues,
+            type: 'bar',
+          },
+        ];
       default:
         return [
           {

src/views/vent/bundleSpy/bundleSpyTable/bundleSpy-table.data.ts

@@ -930,7 +930,7 @@ export const Wlmlcolumns: BasicColumn[] = [
     align: 'center',
   },
   {
-    title: 'N氮气(%)',
+    title: '氮气(%)',
     dataIndex: 'n2_ave',
     key: 'n2_ave',
     width: 100,
@@ -1005,3 +1005,99 @@ export const Wlmlcolumns: BasicColumn[] = [
     align: 'center',
   },
 ];
+export const Jinjiecolumns: BasicColumn[] = [
+  {
+    title: '序号',
+    width: 60,
+    align: 'center',
+    dataIndex: 'xh',
+    key: 'xh',
+  },
+  {
+    title: '检查地点',
+    dataIndex: 'jcdd',
+    key: 'jcdd',
+    width: 100,
+    align: 'center',
+  },
+  {
+    title: '气体分析结果表',
+    children: [
+      {
+        title: 'N₂(%)',
+        dataIndex: 'n2_ave',
+        key: 'n2_ave',
+        width: 100,
+        align: 'center',
+      },
+      {
+        title: 'CO₂(%)',
+        dataIndex: 'co2_ave',
+        key: 'co2_ave',
+        width: 100,
+        align: 'center',
+      },
+      {
+        title: 'O₂(%)',
+        dataIndex: 'o2_ave',
+        key: 'o2_ave',
+        width: 100,
+        align: 'center',
+      },
+      {
+        title: 'CO(%)',
+        dataIndex: 'co_ave',
+        key: 'co_ave',
+        width: 100,
+        align: 'center',
+      },
+      {
+        title: 'CH₄(%)',
+        dataIndex: 'ch4_ave',
+        key: 'ch4_ave',
+        width: 100,
+        align: 'center',
+      },
+      {
+        title: 'C₂H₂(%)',
+        dataIndex: 'c2h2_ave',
+        key: 'c2h2_ave',
+        width: 100,
+        align: 'center',
+      },
+      {
+        title: 'C2H6(%)',
+        dataIndex: 'c2h6_ave',
+        key: 'c2h6_ave',
+        width: 100,
+        align: 'center',
+      },
+      {
+        title: 'C₂H₄(%)',
+        dataIndex: 'c2h4_ave',
+        key: 'c2h4_ave',
+        width: 100,
+        align: 'center',
+      },
+    ],
+  },
+  {
+    title: '分析时间',
+    dataIndex: 'fxsj',
+    key: 'fxsj',
+    width: 100,
+    align: 'center',
+  },
+  {
+    title: '煤自燃阶段',
+    dataIndex: 'internalFireWarnLevel',
+    width: 100,
+    align: 'center',
+  },
+  {
+    title: '操作',
+    dataIndex: 'action',
+    width: 100,
+    align: 'center',
+  },
+];

src/views/vent/bundleSpy/bundleSpyTable/index.vue

@@ -44,7 +44,7 @@
 
 <script setup lang="ts">
 import { ref, onMounted, computed, reactive, shallowRef } from 'vue';
-import { columns, Hjtcolumns, Bdcolumns, Bltcolumns, Sgtcolumns, Yjlcolumns, Cctrkcolumns, Wlmlcolumns } from './bundleSpy-table.data';
+import { columns, Hjtcolumns, Bdcolumns, Bltcolumns, Sgtcolumns, Yjlcolumns, Cctrkcolumns, Wlmlcolumns, Jinjiecolumns } from './bundleSpy-table.data';
 import { getbundleSpyInfoList, getAllFileList, getAllFileListById } from './bundleSpy-table.api';
 import customHeader from '/@/components/vent/customHeader.vue';
 import * as echarts from 'echarts';
@@ -90,6 +90,8 @@ const computedColumns = computed(() => {
       return Cctrkcolumns; // 寸草塔二矿对应的列配置
     case 'sdmtjtwlmlmk':
       return Wlmlcolumns; // 乌兰木伦对应的列配置
+    case 'sdmtjtjjmk':
+      return Jinjiecolumns; // 锦界对应的列配置
     default:
       return columns; // 默认情况下返回的列配置
   }

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

@@ -211,7 +211,7 @@
     await form.validate();
     const formData = form.getFieldsValue();
     deviceInfo.value = deviceOptions.value.find((opt) => {
-      return opt.value === formData.gdeviceid;
+      return opt.value === formData.gdeviceids.split(',')[0];
     }) as Record<string, unknown>;
     const code = (deviceInfo.value.deviceType || props.deviceCode.concat('*')) as string;
     await fetchData(formData, code, deviceInfo.value);

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

@@ -1,6 +1,7 @@
 import dayjs from 'dayjs';
 import { BasicTableProps, PaginationProps, FormProps, FormSchema } from '/@/components/Table';
 import { getAutoScrollContainer } from '/@/utils/common/compUtils';
+import { get } from 'lodash-es';
 
 /**
  * 默认的查询表单项props
@@ -42,13 +43,15 @@ export const getDefaultSchemas: (dictOptions: any[], deviceOptions: any[]) => Fo
   },
   {
     label: '查询设备',
-    field: 'gdeviceid',
+    field: 'gdeviceids',
     component: 'Select',
     required: true,
-    defaultValue: deviceOptions[0].value,
+    defaultValue: [get(deviceOptions, '[0].value', '')],
     componentProps: {
       options: deviceOptions,
       // onChange: (e, option) => {
+      mode: 'multiple',
+      maxTagCount: 'responsive',
       //   nextTick(async () => {
       //     await getDataSource();
       //   });

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

@@ -70,9 +70,10 @@
         />
       </a-tab-pane>
       <a-tab-pane key="9" :tab="'预案管理'">
-        <template v-if="activeKey == '9'">
-          <AccidentPlanTable :deviceId="deviceData.id" />
-        </template>
+        <AccidentPlanTable :deviceId="deviceData.id" />
+      </a-tab-pane>
+      <a-tab-pane v-if="deviceType == 'led'" key="10" :tab="'节目管理'">
+        <LEDPlaylistTable :deviceId="deviceData.id" />
       </a-tab-pane>
       <!-- <a-tab-pane key="9" tab="预警指标修改">
         <template v-if="activeKey == '9'">
@@ -93,6 +94,7 @@
   import ManagerWarningDeviceTable from './warningTabel/index2.vue';
   import BackWindDeviceTable from './warningTabel/index3.vue';
   import AccidentPlanTable from './warningTabel/index4.vue';
+  import LEDPlaylistTable from './warningTabel/index5.vue';
   import WorkFacePointTable from './pointTabel/WorkFacePointTable.vue';
   import DeviceReportInfo from './DeviceReportInfo.vue';
   // import editWarnTable from './editWarnTable/index.vue'

src/views/vent/deviceManager/comment/DeviceReportInfo.vue

@@ -8,110 +8,81 @@
   </div>
 </template>
 <script lang="ts" setup>
-  import { onMounted, ref, defineEmits, onUnmounted, watch, PropType, nextTick, inject, onBeforeMount } from 'vue';
-  import { BasicForm, useForm } from '/@/components/Form/index';
-  import { FormSchema } from '/@/components/Form';
-  import { getFormSchemaColumns } from '/@/hooks/web/useWebColumns';
-  import { list as substationList } from '/@/views/vent/deviceManager/substationTabel/substation.api';
-  import { list, updateReportInfo, sysList, sysInput } from '../../monitorManager/comment/comment.api';
-  const deviceData = inject('formData') as any;
-  const emit = defineEmits(['close', 'register']);
-  const FormRef = ref();
-  const tabType = ref('');
+import { onMounted, ref, defineEmits, onUnmounted, watch, PropType, nextTick, inject, onBeforeMount } from 'vue';
+import { BasicForm, useForm } from '/@/components/Form/index';
+import { FormSchema } from '/@/components/Form';
+import { getFormSchemaColumns } from '/@/hooks/web/useWebColumns';
+import { list as substationList } from '/@/views/vent/deviceManager/substationTabel/substation.api';
+import { list, updateReportInfo, sysList, sysInput } from '../../monitorManager/comment/comment.api';
+const deviceData = inject('formData') as any;
+const emit = defineEmits(['close', 'register']);
+const FormRef = ref();
+const tabType = ref('');
 
-  const formSchema = ref<any[]>([]);
-  const formData = ref(deviceData);
-  const deviceTypeName = ref(deviceData.devicekind ? deviceData.devicekind : deviceData.strtype);
+const formSchema = ref<any[]>([]);
+const formData = ref(deviceData);
+const deviceTypeName = ref(deviceData.devicekind ? deviceData.devicekind : deviceData.strtype);
 
-  const arrToFormColumns = (tableHeaderColumns = [], devicetype) => {
-    const columnList: any[] = [];
-    tableHeaderColumns.forEach((item: any) => {
-      let columnsItem;
-      if (item.type == 1 || item.type == 10) {
+const arrToFormColumns = (tableHeaderColumns = [], devicetype) => {
+  const columnList: any[] = [];
+  tableHeaderColumns.forEach((item: any) => {
+    let columnsItem;
+    if (item.type == 1 || item.type == 10) {
+      columnsItem = {
+        label: item.des, //_dictText
+        field: item.monitorcode,
+        component: item.type == 1 ? 'Input' : item.type == 10 ? 'InputTextArea' : '',
+      };
+    } else {
+      if (item.type == 2 && item['monitorcode'] == 'nsubstationid') {
         columnsItem = {
           label: item.des, //_dictText
           field: item.monitorcode,
-          component: item.type == 1 ? 'Input' : item.type == 10 ? 'InputTextArea' : '',
+          component: 'ApiSelect',
+          componentProps: {
+            api: substationList,
+            labelField: 'strname',
+            valueField: 'id',
+          },
         };
-      } else {
-        if (item.type == 2 && item['monitorcode'] == 'nsubstationid') {
-          columnsItem = {
-            label: item.des, //_dictText
-            field: item.monitorcode,
-            component: 'ApiSelect',
-            componentProps: {
-              api: substationList,
-              labelField: 'strname',
-              valueField: 'id',
-            },
-          };
-        }
-        if (item.type == 3) {
-          columnsItem = {
-            label: item.des, //_dictText
-            field: item.monitorcode,
-            component: 'RadioGroup',
-            defaultValue: 1,
-            componentProps: () => {
-              return {
-                options: [
-                  { label: '是', value: 1, key: '1' },
-                  { label: '否', value: 0, key: '2' },
-                ],
-                stringToNumber: true,
-              };
-            },
-          };
-        }
-        if (item.type == 4) {
-          columnsItem = {
-            label: item.des, //_dictText
-            field: item.monitorcode,
-            component: 'JDictSelectTag',
-            componentProps: {
-              dictCode: item.dict,
-              placeholder: '请选择',
-              stringToNumber: true,
-            },
-          };
-        }
       }
-      columnList.push(columnsItem);
-    });
-    formSchema.value = columnList;
-    if (tabType.value === 'deviceInfo') {
-      formSchema.value.unshift(
-        {
-          label: '设备id', //_dictText
-          field: 'id',
-          component: 'Input',
-          componentProps: {
-            disabled: true,
-            show: false,
+      if (item.type == 3) {
+        columnsItem = {
+          label: item.des, //_dictText
+          field: item.monitorcode,
+          component: 'RadioGroup',
+          defaultValue: 1,
+          componentProps: () => {
+            return {
+              options: [
+                { label: '是', value: 1, key: '1' },
+                { label: '否', value: 0, key: '2' },
+              ],
+              stringToNumber: true,
+            };
           },
-        },
-        {
-          label: '点表',
-          field: 'strtype',
+        };
+      }
+      if (item.type == 4) {
+        columnsItem = {
+          label: item.des, //_dictText
+          field: item.monitorcode,
           component: 'JDictSelectTag',
           componentProps: {
-            dictCode: `${devicetype.split('_')[0]}kind`,
-            placeholder: '请选择点表',
+            dictCode: item.dict,
+            placeholder: '请选择',
+            // stringToNumber: false,
           },
-        }
-      );
-      formSchema.value.push({
-        label: '备用分站',
-        field: 'stationids',
-        component: 'ApiSelect',
-        componentProps: {
-          api: substationList,
-          labelField: 'strname',
-          valueField: 'id',
-        },
-      });
-    } else {
-      formSchema.value.unshift({
+        };
+      }
+    }
+    columnList.push(columnsItem);
+  });
+  formSchema.value = columnList;
+  console.log(formSchema.value, 'sssssssssssssssssssss');
+  if (tabType.value === 'deviceInfo') {
+    formSchema.value.unshift(
+      {
         label: '设备id', //_dictText
         field: 'id',
         component: 'Input',
@@ -119,57 +90,87 @@
           disabled: true,
           show: false,
         },
-      });
-    }
-  };
+      },
+      {
+        label: '点表',
+        field: 'strtype',
+        component: 'JDictSelectTag',
+        componentProps: {
+          dictCode: `${devicetype.split('_')[0]}kind`,
+          placeholder: '请选择点表',
+        },
+      }
+    );
+    formSchema.value.push({
+      label: '备用分站',
+      field: 'stationids',
+      component: 'ApiSelect',
+      componentProps: {
+        api: substationList,
+        labelField: 'strname',
+        valueField: 'id',
+      },
+    });
+  } else {
+    formSchema.value.unshift({
+      label: '设备id', //_dictText
+      field: 'id',
+      component: 'Input',
+      componentProps: {
+        disabled: true,
+        show: false,
+      },
+    });
+  }
+};
 
-  const [registerForm, { resetSchema, getFieldsValue, setFieldsValue, resetFields }] = useForm({
-    schemas: <FormSchema[]>formSchema.value,
-    showActionButtonGroup: false,
-  });
+const [registerForm, { resetSchema, getFieldsValue, setFieldsValue, resetFields }] = useForm({
+  schemas: <FormSchema[]>formSchema.value,
+  showActionButtonGroup: false,
+});
 
-  function getColumns() {
-    let formSchemaArr = getFormSchemaColumns(`${deviceData.devicekind ? deviceData.devicekind : deviceData.strtype}_input`) || [];
-    if (formSchemaArr && formSchemaArr.length < 1) {
-      const arr = deviceTypeName.value.split('_');
-      formSchemaArr = getFormSchemaColumns(arr[0] + '_input') || [];
-    }
-    arrToFormColumns(formSchemaArr, deviceTypeName.value);
-    resetSchema(formSchema.value);
+function getColumns() {
+  let formSchemaArr = getFormSchemaColumns(`${deviceData.devicekind ? deviceData.devicekind : deviceData.strtype}_input`) || [];
+  if (formSchemaArr && formSchemaArr.length < 1) {
+    const arr = deviceTypeName.value.split('_');
+    formSchemaArr = getFormSchemaColumns(arr[0] + '_input') || [];
   }
+  arrToFormColumns(formSchemaArr, deviceTypeName.value);
+  resetSchema(formSchema.value);
+}
 
-  async function onReset() {
-    await resetFields();
-    await setFieldsValue({ ...deviceData });
-  }
+async function onReset() {
+  await resetFields();
+  await setFieldsValue({ ...deviceData });
+}
 
-  async function handleSubmit() {
-    const data = await getFieldsValue();
-    if (!deviceData.devicekind) {
-      await sysInput(data);
-    } else {
-      await updateReportInfo(data);
-    }
+async function handleSubmit() {
+  const data = await getFieldsValue();
+  if (!deviceData.devicekind) {
+    await sysInput(data);
+  } else {
+    await updateReportInfo(data);
   }
+}
 
-  onBeforeMount(async () => {});
+onBeforeMount(async () => {});
 
-  onMounted(async () => {
-    getColumns();
-    let result;
-    if (!deviceData.devicekind) {
-      result = await sysList({ id: deviceData.id });
-    } else {
-      result = await list({ id: deviceData.id });
-    }
-    formData.value = result['records'][0] || [];
-    await setFieldsValue({
-      ...formData.value,
-    });
+onMounted(async () => {
+  getColumns();
+  let result;
+  if (!deviceData.devicekind) {
+    result = await sysList({ id: deviceData.id });
+  } else {
+    result = await list({ id: deviceData.id });
+  }
+  formData.value = result['records'][0] || [];
+  await setFieldsValue({
+    ...formData.value,
   });
-  onUnmounted(() => {});
+});
+onUnmounted(() => {});
 </script>
 <style scoped lang="less">
-  @import '/@/design/theme.less';
-  @import '/@/design/vent/modal.less';
+@import '/@/design/theme.less';
+@import '/@/design/vent/modal.less';
 </style>

src/views/vent/deviceManager/comment/cameraTabel/camera.data.ts

@@ -35,6 +35,10 @@ export const columns: BasicColumn[] = [
           value: 'flv',
         },
         {
+          label: '园子沟转URL',
+          value: 'YZG_URL',
+        },
+        {
           label: '红柳林code转URl',
           value: 'HLL',
         },

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

@@ -0,0 +1,84 @@
+<!-- eslint-disable vue/multi-word-component-names -->
+<template>
+  <!-- 配置预警设备 -->
+  <div class="device-box">
+    <a-button class="vent-margin-b-5" type="primary" @click="handleOpen('add', {})"> 新增 </a-button>
+    <a-table :columns="ledPlaylistColumns" :data-source="dataSource" bordered :scroll="{ y: 500 }" :pagination="false" showIndexColumn>
+      <template #bodyCell="{ column, record }">
+        <template v-if="column.dataIndex === 'operation'">
+          <a class="action-link" @click="handleOpen('update', record)">编辑</a>
+          <a-popconfirm title="确认删除" @confirm="handleDelete(record)">
+            <a class="action-link vent-margin-l-10">删除</a>
+          </a-popconfirm>
+        </template>
+      </template>
+    </a-table>
+  </div>
+  <BasicModal @register="register" :width="800" :min-height="600" @ok="onSubmit">
+    <BasicForm @register="registerForm" />
+  </BasicModal>
+</template>
+
+<script lang="ts" setup>
+  import { ref, onMounted, nextTick } from 'vue';
+  import { ledPlaylistColumns, ledPlaylistFormSchemas } from './warning.data';
+  import { updateProgram, deleteProgram, addProgram } from './warning.api';
+  // import BaseModal from './BaseModal.vue';
+  import { message } from 'ant-design-vue';
+  import { BasicForm, useForm } from '/@/components/Form';
+  import { BasicModal, useModal } from '/@/components/Modal';
+  import { queryById } from '../../deviceTable/device.api';
+
+  defineEmits(['register']);
+
+  const props = defineProps({
+    deviceId: { type: String },
+  });
+
+  const formSchemas = ledPlaylistFormSchemas();
+  const dataSource = ref<any[]>([]);
+
+  const [register, { openModal, closeModal }] = useModal();
+  const [registerForm, { setFieldsValue, resetFields, validateFields, getFieldsValue }] = useForm({
+    schemas: formSchemas,
+    showActionButtonGroup: false,
+  });
+
+  async function getDataSource() {
+    const result = await queryById({ id: props.deviceId });
+    dataSource.value = result.programList || [];
+  }
+
+  async function handleOpen(flag, record) {
+    openModal(true, {
+      isUpdate: flag == 'update',
+    });
+    nextTick(() => {
+      resetFields();
+      setFieldsValue(record);
+    });
+  }
+
+  async function handleDelete(record) {
+    await deleteProgram({ id: record.id });
+    getDataSource();
+  }
+
+  async function onSubmit() {
+    await validateFields();
+    const values = getFieldsValue();
+    // 提交数据弹窗
+    if (values.id) {
+      await updateProgram(values);
+    } else {
+      await addProgram(values);
+    }
+    message.info('操作成功');
+    getDataSource();
+    closeModal();
+  }
+
+  onMounted(async () => {
+    getDataSource();
+  });
+</script>

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

@@ -45,6 +45,10 @@ enum Api {
   modelAlarmAutoAdd = '/safety/modelAlarmAuto/add',
   modelAlarmAutoDeleteBatch = '/safety/modelAlarmAuto/deleteBatch',
   modelAlarmAutoAddBatch = '/safety/modelAlarmAuto/addBatch',
+
+  addProgram = '/monitor/voice-alarm/addProgram',
+  updateProgram = '/monitor/voice-alarm/updateProgram',
+  deleteProgram = '/monitor/voice-alarm/deleteProgram',
 }
 /**
  * 导出api
@@ -147,3 +151,7 @@ export const modelAlarmAutoAddBatch = (params) => defHttp.post({ url: Api.modelA
 export const modelAlarmAutoDelete = (params) => defHttp.delete({ url: Api.modelAlarmAutoDelete, params }, { joinParamsToUrl: true }).then(() => {});
 export const modelAlarmAutoDeleteBatch = (params) => defHttp.delete({ url: Api.modelAlarmAutoDeleteBatch, params });
 export const modelAlarmAutoEdit = (params) => defHttp.post({ url: Api.modelAlarmAutoEdit, params });
+
+export const addProgram = (params) => defHttp.post({ url: Api.addProgram, params });
+export const updateProgram = (params) => defHttp.post({ url: Api.updateProgram, params });
+export const deleteProgram = (params) => defHttp.post({ url: Api.deleteProgram, params });

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

@@ -880,7 +880,7 @@ export const modelAlarmFormSchemas = () =>
     },
   ];
 
-export const modelAlarmColumns: TableColumnType[] = [
+export const modelAlarmColumns: BasicColumn[] = [
   {
     title: '序号',
     width: 80,
@@ -912,3 +912,70 @@ export const modelAlarmColumns: TableColumnType[] = [
   // { dataIndex: 'updateTime', title: '更新日期' },
   { dataIndex: 'operation', title: '操作' },
 ];
+
+export const ledPlaylistColumns: BasicColumn[] = [
+  { dataIndex: 'programName', title: '节目标题' },
+  { dataIndex: 'programContent', title: '节目内容' },
+  { dataIndex: 'programIndex', title: '节目排序' },
+  {
+    dataIndex: 'programType',
+    title: '节目类别',
+    format: new Map([
+      [2, '其他'],
+      [1, '循环'],
+      [0, '默认'],
+    ]),
+  },
+];
+
+export const ledPlaylistFormSchemas = () =>
+  <FormSchema[]>[
+    {
+      label: 'ID',
+      field: 'id',
+      component: 'Input',
+      show: false,
+    },
+    {
+      label: 'deviceID',
+      field: 'deviceId',
+      component: 'Input',
+      show: false,
+    },
+    {
+      label: '节目标题',
+      field: 'programName',
+      component: 'Input',
+    },
+    {
+      label: '节目内容',
+      field: 'programContent',
+      component: 'Input',
+    },
+    {
+      label: '节目排序',
+      field: 'programIndex',
+      component: 'InputNumber',
+    },
+    {
+      label: '节目类别',
+      field: 'programType',
+      component: 'Select',
+      componentProps: {
+        options: [
+          {
+            label: '其他',
+            value: 2,
+          },
+          {
+            label: '循环',
+            value: 1,
+          },
+          {
+            label: '默认',
+            value: 0,
+          },
+        ],
+      },
+    },
+  ];

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

@@ -257,6 +257,8 @@ export interface ModuleDataChart extends ReadFrom {
   /** 图表legend配置 */
   legend: {
     show: boolean;
+    /** 参考echarts格式化文本 */
+    formatter?: string;
   };
 }
 

src/views/vent/deviceManager/deviceTable/device.api.ts

@@ -3,13 +3,14 @@ import { Modal } from 'ant-design-vue';
 
 enum Api {
   list = '/safety/ventanalyDeviceInfo/list',
+  queryById = '/safety/ventanalyDeviceInfo/queryById',
   save = '/safety/ventanalyDeviceInfo/add',
   edit = '/safety/ventanalyDeviceInfo/edit',
   deleteById = '/safety/ventanalyDeviceInfo/delete',
   deleteBatch = '/safety/ventanalyDeviceInfo/deleteBatch',
   importExcel = '/sys/user/importExcel',
   exportXls = '/safety/ventanalyMonitorParams/exportXls',
-  importExcel1='/safety/gasDayReport/importByExcel'
+  importExcel1 = '/safety/gasDayReport/importByExcel',
 }
 /**
  * 导出api
@@ -30,6 +31,8 @@ export const getImportUrl1 = Api.importExcel1;
  */
 export const list = (params) => defHttp.get({ url: Api.list, params });
 
+export const queryById = (params) => defHttp.get({ url: Api.queryById, params });
+
 /**
  * 删除用户
  */

src/views/vent/dust/dustMonitorTable/dust-table.data.ts

@@ -819,6 +819,98 @@ export const Cctkcolumns = [
     align: 'center',
   },
 ];
+export const Jinjiecolumns = [
+  {
+    title: '序号',
+    width: 60,
+    align: 'center',
+    dataIndex: 'xh',
+  },
+  {
+    title: '测尘地点',
+    dataIndex: 'ccdd',
+    key: 'ccdd',
+    width: 150,
+    align: 'center',
+  },
+  {
+    title: '生产工艺',
+    dataIndex: 'zyhj',
+    key: 'zyhj',
+    width: 80,
+    align: 'center',
+  },
+  {
+    title: '测尘位置',
+    dataIndex: 'jcdd',
+    key: 'jcdd',
+    width: 120,
+    align: 'center',
+  },
+  {
+    title: '防尘措施',
+    dataIndex: 'fccs',
+    key: 'fccs',
+    width: 120,
+    align: 'center',
+  },
+  {
+    title: '采样时间(s)',
+    width: 100,
+    align: 'center',
+    children: [
+      {
+        title: '总粉尘',
+        dataIndex: 'cysj_zc',
+        key: 'cysj_zc',
+        width: 80,
+        align: 'center',
+      },
+      {
+        title: '呼吸性粉尘',
+        dataIndex: 'cysj_hc',
+        key: 'cysj_hc',
+        width: 80,
+        align: 'center',
+      },
+    ],
+  },
+  {
+    title: '粉尘浓度(mg/m³)',
+    width: 100,
+    align: 'center',
+    children: [
+      {
+        title: '总粉尘',
+        dataIndex: 'sc_zcds',
+        key: 'sc_zcds',
+        width: 80,
+        align: 'center',
+      },
+      {
+        title: '呼吸性粉尘',
+        dataIndex: 'sc_hcds',
+        key: 'sc_hcds',
+        width: 80,
+        align: 'center',
+      },
+    ],
+  },
+  {
+    title: '检测时间',
+    dataIndex: 'jcsj',
+    key: 'jcsj',
+    width: 80,
+    align: 'center',
+  },
+  {
+    title: '备注',
+    dataIndex: 'smark',
+    key: 'smark',
+    width: 80,
+    align: 'center',
+  },
+];
 //监测字段
 export const fieldMapping = {
   sc_zcds: '总尘-作业工序-生产(短时间监测浓度，mg/m³)',
@@ -878,6 +970,10 @@ export const fieldWlmlMapping = {
   sc_zcds: '总尘(粉尘浓度，mg/m³)',
   sc_hcds: '呼尘(粉尘浓度，mg/m³)',
 };
+export const fieldJinjieMapping = {
+  sc_zcds: '总粉尘(粉尘浓度，mg/m³)',
+  sc_hcds: '呼吸性粉尘(粉尘浓度，mg/m³)',
+};
 // 检测地点
 export const dataColumns = [
   {
@@ -1196,6 +1292,37 @@ export const dataWlmlColumns = [
     key: 'zyhj',
   },
 ];
+export const dataJinjieColumns = [
+  {
+    title: '监测字段',
+    align: 'center',
+    dataIndex: 'key',
+    key: 'key',
+    width: 100,
+    customRender: ({ text }) => fieldJinjieMapping[text] || text,
+  },
+  {
+    title: '最大值',
+    dataIndex: 'value',
+    align: 'center',
+    width: 100,
+    key: 'value',
+  },
+  {
+    width: 100,
+    align: 'center',
+    title: '测尘位置',
+    dataIndex: 'jcdd',
+    key: 'jcdd',
+  },
+  {
+    width: 100,
+    align: 'center',
+    title: '生产工艺',
+    dataIndex: 'zyhj',
+    key: 'zyhj',
+  },
+];
 // 当日情况粉尘情况分析
 export const AllDataColumns = [
   {
@@ -1528,3 +1655,34 @@ export const AllDataWlmlColumns = [
     key: 'zyhj',
   },
 ];
+export const AllDataJinjieColumns = [
+  {
+    title: '监测字段',
+    align: 'center',
+    dataIndex: 'key',
+    key: 'key',
+    width: 100,
+    customRender: ({ text }) => fieldJinjieMapping[text] || text,
+  },
+  {
+    title: '最大值',
+    dataIndex: 'value',
+    align: 'center',
+    width: 100,
+    key: 'value',
+  },
+  {
+    width: 100,
+    align: 'center',
+    title: '测尘位置',
+    dataIndex: 'jcdd',
+    key: 'jcdd',
+  },
+  {
+    width: 100,
+    align: 'center',
+    title: '生产工艺',
+    dataIndex: 'zyhj',
+    key: 'zyhj',
+  },
+];

src/views/vent/dust/dustMonitorTable/index.vue

@@ -74,6 +74,7 @@ import {
   Wlmlcolumns,
   Cctrkcolumns,
   Cctkcolumns,
+  Jinjiecolumns,
   dataColumns,
   dataDltColumns,
   dataSwColumns,
@@ -84,6 +85,7 @@ import {
   dataYjlColumns,
   dataCctrkColumns,
   dataWlmlColumns,
+  dataJinjieColumns,
   AllDataColumns,
   AllDataDltColumns,
   AllDataSwColumns,
@@ -94,6 +96,7 @@ import {
   AllDataYjlColumns,
   AllDataCctrkColumns,
   AllDataWlmlColumns,
+  AllDataJinjieColumns,
 } from './dust-table.data';
 import { getDustInfoList, getAllFileList, getAllFileListById } from './dsut-table.api';
 import customHeader from '/@/components/vent/customHeader.vue';
@@ -148,6 +151,8 @@ const computedColumns = computed(() => {
       return Wlmlcolumns; // 乌兰木伦对应的列配置
     case 'sdmtjtcctmk':
       return Wlmlcolumns; // 寸草塔一矿对应的列配置
+    case 'sdmtjtjjmk':
+      return Jinjiecolumns; // 锦界对应的列配置
     default:
       return columns; // 默认情况下返回的列配置
   }
@@ -176,6 +181,8 @@ const AllDataComputedColumns = computed(() => {
       return AllDataWlmlColumns; // 乌兰木伦对应的列配置
     case 'sdmtjtcctmk':
       return AllDataWlmlColumns; // 寸草塔一矿对应的列配置
+    case 'sdmtjtjjmk':
+      return AllDataJinjieColumns; // 锦界对应的列配置
     default:
       return AllDataColumns; // 默认情况下返回的列配置
   }
@@ -204,6 +211,8 @@ const DataComputedColumns = computed(() => {
       return dataWlmlColumns; // 乌兰木伦对应的列配置
     case 'sdmtjtcctmk':
       return dataWlmlColumns; // 寸草塔一矿对应的列配置
+    case 'sdmtjtjjmk':
+      return dataJinjieColumns; // 锦界对应的列配置
     default:
       return dataColumns; // 默认情况下返回的列配置
   }
@@ -409,6 +418,8 @@ function processTableData(data: any) {
         return WlmlMaxValues; // 乌兰木伦对应的列配置
       case 'sdmtjtcctmk':
         return WlmlMaxValues; // 寸草塔一矿对应的列配置
+      case 'sdmtjtjjmk':
+        return WlmlMaxValues; // 锦界对应的列配置
       default:
         return maxValues; // 默认情况下返回的列配置
     }
@@ -580,6 +591,8 @@ function processTableData(data: any) {
         return overallWlmlMaxValues; // 乌兰木伦对应的列配置
       case 'sdmtjtcctmk':
         return overallWlmlMaxValues; // 寸草塔一矿对应的列配置
+      case 'sdmtjtjjmk':
+        return overallWlmlMaxValues; // 锦界对应的列配置
       default:
         return overallMaxValues; // 默认情况下返回的列配置
     }

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

@@ -58,8 +58,8 @@
         },
         {
           label: '通风巷道长度(万m)',
-          value: '223196',
-          // value: '${midinfo[0].sysdata.totallength}',
+          // value: '223196',
+          value: '${totallength}',
         },
         {
           label: '有效风量率',

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

@@ -251,9 +251,7 @@
               show: true,
               position: 'outside',
               color: '#ddd',
-              formatter: function ({ name, value }) {
-                return `${name}\n${value}pa`;
-              },
+              formatter: get(legend, 'formatter', '{b}\n{c}pa'),
             },
             labelLine: {
               length: 30,

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

@@ -325,9 +325,9 @@ export const testConfigVent: Config[] = [
       table: [],
       chart: [
         {
-          type: 'pie_drag',
+          type: 'pie_halo',
           readFrom: '',
-          legend: { show: false },
+          legend: { show: false, formatter: '{b}:{c}\n{d}%' },
           xAxis: [{ show: false }],
           yAxis: [{ show: false, name: '风量', position: 'left' }],
           series: [{ readFrom: 'piechart', xprop: 'label', yprop: 'valMock', label: '' }],

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

@@ -13,7 +13,7 @@
         全矿井通风检测
         <CaretDownOutlined />
       </a>
-      <MonitorBar v-if="showBar" class="module-monitor-bar" :is-data-real-time="isDataRealTime" :data="data" />
+      <MonitorBar v-if="showBar" class="module-monitor-bar" :is-data-real-time="isDataRealTime" :data="barData" />
       <!-- <a-dropdown class="module-dropdown" :class="{ 'module-dropdown-original': isOriginal }" :trigger="['click']" placement="bottomRight">
         <template #overlay>
         </template>
@@ -76,7 +76,7 @@
   </div>
 </template>
 <script lang="ts" setup>
-  import { onMounted, onUnmounted, ref, watch } from 'vue';
+  import { computed, onMounted, onUnmounted, ref, watch } from 'vue';
   // import { CaretDownOutlined } from '@ant-design/icons-vue';
   import MonitorBar from './components/MonitorBar.vue';
   import { useInitConfigs, useInitPage } from './hooks/useInit';
@@ -97,6 +97,10 @@
   const router = useRouter();
   const isDataRealTime = ref(sysDataType === 'monitor');
   const showBar = ref(true);
+  const barData = computed(() => ({
+    ...data.value,
+    totallength: 223196,
+  }));
   let interval: number | undefined;
 
   function switchDataMode() {

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

@@ -0,0 +1,276 @@
+<!-- eslint-disable vue/multi-word-component-names -->
+<template>
+  <div class="company-home">
+    <div style="width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 0">
+      <VentModal />
+    </div>
+    <!-- 如果是有 deviceType、type 等 query，认为是详情页，不需要展示普通模块，只需要模型 -->
+    <template v-if="!route.query.deviceType">
+      <div v-if="!route.query.embed" class="top-bg">
+        <div class="main-title">{{ mainTitle }}</div>
+      </div>
+      <a class="ant-dropdown-link module-dropdown" @click.prevent="showBar = !showBar">
+        全矿井通风检测
+        <CaretDownOutlined />
+      </a>
+      <MonitorBar v-if="showBar" class="module-monitor-bar" :is-data-real-time="isDataRealTime" :data="barData" />
+      <!-- <a-dropdown class="module-dropdown" :class="{ 'module-dropdown-original': isOriginal }" :trigger="['click']" placement="bottomRight">
+        <template #overlay>
+        </template>
+      </a-dropdown> -->
+
+      <!-- 采用定位方式以避免出现各个模块隐藏时其他模块下移的问题 -->
+      <template v-if="isOriginal">
+        <ModuleOriginal
+          v-for="cfg in configs"
+          :key="cfg.deviceType"
+          :show-style="cfg.showStyle"
+          :module-data="cfg.moduleData"
+          :module-name="cfg.moduleName"
+          :device-type="cfg.deviceType"
+          :data="data"
+          :visible="true"
+        />
+      </template>
+      <template v-else-if="isCommon">
+        <ModuleCommon
+          v-for="cfg in configs"
+          :key="cfg.deviceType"
+          :show-style="cfg.showStyle"
+          :module-data="cfg.moduleData"
+          :module-name="cfg.moduleName"
+          :device-type="cfg.deviceType"
+          :data="data"
+          :visible="true"
+        />
+      </template>
+      <template v-else>
+        <!-- 下面是正常展示的各新版模块 -->
+        <ModuleEnhanced
+          v-for="cfg in enhancedConfigs"
+          :key="cfg.deviceType"
+          :visible="cfg.visible"
+          :show-style="cfg.showStyle"
+          :module-data="cfg.moduleData"
+          :module-name="cfg.moduleName"
+          :device-type="cfg.deviceType"
+          :data="data"
+          @close="cfg.visible = false"
+        />
+        <!-- 下面是用于呼出已隐藏的模块的按钮 -->
+        <div class="pos-absolute top-70px left-460px z-3">
+          <div v-for="(item, i) in hiddenList" :key="`vvhchg${i}`">
+            <AButton class="module-trigger-button" @click="item.visible = true">{{ item.moduleName }}</AButton>
+          </div>
+        </div>
+      </template>
+      <div
+        v-if="sysDataType === 'all'"
+        :class="{ 'realtime-mode': isDataRealTime }"
+        alt="切换数据模式"
+        class="switch-button report-mode right-525px"
+        @click="switchDataMode"
+      ></div>
+      <div class="switch-button icon-goto right-475px" @click="goMicroApp()"></div>
+    </template>
+  </div>
+</template>
+<script lang="ts" setup>
+  import { computed, onMounted, onUnmounted, ref, watch } from 'vue';
+  // import { CaretDownOutlined } from '@ant-design/icons-vue';
+  import MonitorBar from './components/MonitorBar.vue';
+  import { useInitConfigs, useInitPage } from './hooks/useInit';
+  import ModuleEnhanced from './components/ModuleEnhanced.vue';
+  import ModuleOriginal from './components/ModuleOriginal.vue';
+  import ModuleCommon from './components/ModuleCommon.vue';
+  // import { useRoute } from 'vue-router';
+  import VentModal from '/@/components/vent/micro/ventModal.vue';
+  import { list } from './configurable.api';
+  import { useRoute, useRouter } from 'vue-router';
+  import { useGlobSetting } from '/@/hooks/setting';
+  // import { testConfigVent, testConfigVentRealtime } from './configurable.data';
+
+  const { sysDataType = 'monitor', title = '智能通风管控系统' } = useGlobSetting();
+  const { configs, isOriginal, isCommon, fetchConfigs } = useInitConfigs();
+  const { mainTitle, enhancedConfigs, hiddenList, data, updateData, updateEnhancedConfigs } = useInitPage(title);
+  const route = useRoute();
+  const router = useRouter();
+  const isDataRealTime = ref(sysDataType === 'monitor');
+  const showBar = ref(true);
+  const barData = computed(() => ({
+    ...data.value,
+    totallength: 90810,
+  }));
+  let interval: number | undefined;
+
+  function switchDataMode() {
+    isDataRealTime.value = !isDataRealTime.value;
+    refresh();
+  }
+
+  function refresh() {
+    fetchConfigs(isDataRealTime.value ? 'vent_realtime' : 'vent').then(() => {
+      // configs.value = isDataRealTime.value ? testConfigVentRealtime : testConfigVent;
+      updateEnhancedConfigs(configs.value);
+
+      list({}).then(updateData);
+    });
+  }
+
+  function initInterval() {
+    setInterval(() => {
+      list({}).then(updateData);
+    }, 60000);
+  }
+
+  function goMicroApp() {
+    router.push({
+      path: route.path,
+      query: {
+        ...route.query,
+        type: 'model3D',
+        deviceType: 'model3D',
+      },
+    });
+  }
+
+  watch(
+    () => route.query,
+    () => {
+      if (route.query.deviceType) {
+        // 仅需要展示子应用，模拟 unmounted
+        clearInterval(interval);
+      } else {
+        // 模拟 mounted
+        refresh();
+        initInterval();
+      }
+    }
+  );
+
+  onMounted(() => {
+    refresh();
+    initInterval();
+  });
+
+  onUnmounted(() => {
+    clearInterval(interval);
+  });
+</script>
+<style lang="less" scoped>
+  @import '/@/design/theme.less';
+
+  @font-face {
+    font-family: 'douyuFont';
+    src: url('/@/assets/font/douyuFont.otf');
+  }
+
+  @{theme-deepblue} {
+    .company-home {
+      --image-modal-top: url('/@/assets/images/themify/deepblue/vent/home/modal-top.png');
+    }
+  }
+
+  .company-home {
+    --image-modal-top: url('/@/assets/images/vent/home/modal-top.png');
+    --image-monitor-realtime: url('/@/assets/images/company/monitor-realtime.png');
+    --image-monitor-doc: url('/@/assets/images/company/monitor-doc.png');
+    --image-monitor-goto: url('/@/assets/images/company/monitor-goto.png');
+
+    width: 100%;
+    height: 100%;
+    color: @white;
+    position: relative;
+    // background: url('@/assets/images/home-container/configurable/firehome/bg.png') no-repeat center;
+
+    .top-bg {
+      width: 100%;
+      height: 56px;
+      background: var(--image-modal-top) no-repeat center;
+      position: absolute;
+      z-index: 1;
+      .main-title {
+        height: 56px;
+        font-family: 'douyuFont';
+        font-size: 20px;
+        letter-spacing: 2px;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+      }
+    }
+
+    // .module-left {
+    //   position: absolute;
+    //   width: 450px;
+    //   height: 280px;
+    //   left: 0;
+    // }
+    // .module-right {
+    //   position: absolute;
+    //   width: 450px;
+    //   height: 280px;
+    //   right: 0;
+    // }
+    // .module-bottom {
+    //   position: absolute;
+    //   width: 1000px;
+    //   height: 280px;
+    // }
+    .module-dropdown {
+      padding: 5px;
+      background-image: @vent-configurable-dropdown;
+      border-bottom: 2px solid @vent-configurable-home-light-border;
+      color: @vent-font-color;
+      position: absolute;
+      top: 60px;
+      right: 480px;
+    }
+    .module-dropdown-original {
+      padding: 10px;
+      background-image: @vent-configurable-dropdown;
+      border-bottom: 2px solid @vent-configurable-home-light-border;
+      color: @vent-font-color;
+      position: absolute;
+      top: 70px;
+      right: 460px;
+    }
+    .module-trigger-button {
+      color: @vent-font-color;
+      background-image: @vent-configurable-dropdown;
+      border: none;
+      border-bottom: 2px solid @vent-configurable-home-light-border;
+    }
+
+    .switch-button {
+      width: 34px;
+      height: 34px;
+      position: absolute;
+      // right: 5px;
+      bottom: 300px;
+      z-index: 5;
+      background-repeat: no-repeat;
+      background-size: 100% 100%;
+    }
+    .report-mode {
+      background-image: var(--image-monitor-doc);
+    }
+    .realtime-mode {
+      background-image: var(--image-monitor-realtime);
+    }
+    .icon-goto {
+      background-image: var(--image-monitor-goto);
+    }
+
+    .module-monitor-bar {
+      position: absolute;
+      top: 100px;
+      width: 1000px;
+      height: 200px;
+      left: calc(50% - 500px);
+    }
+  }
+  :deep(.loading-box) {
+    position: unset;
+  }
+</style>

src/views/vent/monitorManager/alarmMonitor/common/echartLine.vue

@@ -5,336 +5,332 @@
 </template>
 
 <script lang="ts" setup>
-import { defineProps, ref, nextTick, reactive, watch } from 'vue';
-import * as echarts from 'echarts';
+  import { defineProps, ref, nextTick, reactive, watch } from 'vue';
+  import * as echarts from 'echarts';
 
-let props = defineProps({
-  echartDataGq: {
-    type: Object,
-  },
-  maxY: {
-    type: Number,
-  },
-  echartDw: {
-    type: String,
-  },
-  echartDw1: {
-    type: String,
-  },
-  gridV: {
-    type: Object,
-    default: () => {
-      return {
-        top: '15%',
-        left: '2%',
-        bottom: '6%',
-        right: '2%',
-        containLabel: true,
-      };
+  let props = defineProps({
+    echartDataGq: {
+      type: Object,
     },
-  },
-  // //报警历史交点坐标
-  // pointHisWarnData:{
-  //   type:Object,
-  //   default:()=>{
-  //     return {}
-  //   }
-  // }
-});
-//获取dom元素节点
-let line = ref<any>();
-let echartDataGqs = reactive({});
-watch(
-  () => props.echartDataGq,
-  (data) => {
-    echartDataGqs = Object.assign({}, data);
-    getOption();
-  },
-  { immediate: true, deep: true }
-);
-function getOption() {
-  nextTick(() => {
-    let myChart = echarts.init(line.value);
-    let option = {
-      grid: props.gridV,
-      tooltip: {
-        trigger: 'axis',
-        backgroundColor: 'rgba(0, 0, 0, .6)',
-        textStyle: {
-          color: '#fff',
-          fontSize: 12,
-        },
+    maxY: {
+      type: Number,
+    },
+    echartDw: {
+      type: String,
+    },
+    echartDw1: {
+      type: String,
+    },
+    gridV: {
+      type: Object,
+      default: () => {
+        return {
+          top: '15%',
+          left: '2%',
+          bottom: '6%',
+          right: '2%',
+          containLabel: true,
+        };
       },
-      legend: {
-        align: 'left',
-        right: 'center',
-        top: '-20',
-        type: 'plain',
-        textStyle: {
-          color: '#7ec7ff',
-          fontSize: 14,
-        },
-        // icon:'rect',
-        itemGap: 25,
-        itemWidth: 18,
-        icon: 'path://M0 2a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v0a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2z',
-        data: [
-          {
-            name: echartDataGqs.avgData ? echartDataGqs.avgData.lengedData : '',
-          },
-          {
-            name: echartDataGqs.maxData ? echartDataGqs.maxData.lengedData : '',
-          },
-          {
-            name: echartDataGqs.minData ? echartDataGqs.minData.lengedData : '',
-          },
-          {
-            name: echartDataGqs.curData ? echartDataGqs.curData.lengedData : '',
+    },
+    // //报警历史交点坐标
+    // pointHisWarnData:{
+    //   type:Object,
+    //   default:()=>{
+    //     return {}
+    //   }
+    // }
+  });
+  //获取dom元素节点
+  let line = ref<any>();
+  let echartDataGqs = reactive({});
+  watch(
+    () => props.echartDataGq,
+    (data) => {
+      echartDataGqs = Object.assign({}, data);
+      getOption();
+    },
+    { immediate: true, deep: true }
+  );
+  function getOption() {
+    nextTick(() => {
+      let myChart = echarts.init(line.value);
+      let option = {
+        grid: props.gridV,
+        tooltip: {
+          trigger: 'axis',
+          backgroundColor: 'rgba(0, 0, 0, .6)',
+          textStyle: {
+            color: '#fff',
+            fontSize: 12,
           },
-        ],
-      },
-      xAxis: [
-        {
-          type: 'category',
-          boundaryGap: false,
-          axisLabel: {
-            // formatter: '{value}',
+        },
+        legend: {
+          align: 'left',
+          right: 'center',
+          top: '-20',
+          type: 'plain',
+          textStyle: {
+            color: '#7ec7ff',
             fontSize: 14,
-            margin: 20,
-            textStyle: {
-              color: '#b3b8cc',
+          },
+          // icon:'rect',
+          itemGap: 25,
+          itemWidth: 18,
+          icon: 'path://M0 2a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v0a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2z',
+          data: [
+            {
+              name: echartDataGqs.avgData ? echartDataGqs.avgData.lengedData : '',
+            },
+            {
+              name: echartDataGqs.maxData ? echartDataGqs.maxData.lengedData : '',
+            },
+            {
+              name: echartDataGqs.minData ? echartDataGqs.minData.lengedData : '',
+            },
+            {
+              name: echartDataGqs.curData ? echartDataGqs.curData.lengedData : '',
             },
-            formatter: function (params) {
-              let newParamsName = ref(''); // 最终拼接成的字符串
-              let paramsNameNumber = ref(params.length); // 实际标签的个数
-              let provideNumber = ref(10); // 每行能显示的字的个数
-              let rowNumber = Math.ceil(paramsNameNumber.value / provideNumber.value); // 换行的话，需要显示几行，向上取整
-              /**
-               * 判断标签的个数是否大于规定的个数， 如果大于，则进行换行处理 如果不大于，即等于或小于，就返回原标签
-               */
-              // 条件等同于rowNumber>1
-              if (paramsNameNumber.value > provideNumber.value) {
-                /** 循环每一行,p表示行 */
-                for (var p = 0; p < rowNumber; p++) {
-                  var tempStr = ''; // 表示每一次截取的字符串
-                  var start = p * provideNumber.value; // 开始截取的位置
-                  var end = start + provideNumber.value; // 结束截取的位置
-                  // 此处特殊处理最后一行的索引值
-                  if (p == rowNumber - 1) {
-                    // 最后一次不换行
-                    tempStr = params.substring(start, paramsNameNumber.value);
-                  } else {
-                    // 每一次拼接字符串并换行
-                    tempStr = params.substring(start, end) + '\n';
+          ],
+        },
+        xAxis: [
+          {
+            type: 'category',
+            boundaryGap: false,
+            axisLabel: {
+              // formatter: '{value}',
+              fontSize: 14,
+              margin: 20,
+              textStyle: {
+                color: '#b3b8cc',
+              },
+              formatter: function (params) {
+                let newParamsName = ref(''); // 最终拼接成的字符串
+                let paramsNameNumber = ref(params.length); // 实际标签的个数
+                let provideNumber = ref(10); // 每行能显示的字的个数
+                let rowNumber = Math.ceil(paramsNameNumber.value / provideNumber.value); // 换行的话，需要显示几行，向上取整
+                /**
+                 * 判断标签的个数是否大于规定的个数， 如果大于，则进行换行处理 如果不大于，即等于或小于，就返回原标签
+                 */
+                // 条件等同于rowNumber>1
+                if (paramsNameNumber.value > provideNumber.value) {
+                  /** 循环每一行,p表示行 */
+                  for (var p = 0; p < rowNumber; p++) {
+                    var tempStr = ''; // 表示每一次截取的字符串
+                    var start = p * provideNumber.value; // 开始截取的位置
+                    var end = start + provideNumber.value; // 结束截取的位置
+                    // 此处特殊处理最后一行的索引值
+                    if (p == rowNumber - 1) {
+                      // 最后一次不换行
+                      tempStr = params.substring(start, paramsNameNumber.value);
+                    } else {
+                      // 每一次拼接字符串并换行
+                      tempStr = params.substring(start, end) + '\n';
+                    }
+                    newParamsName.value += tempStr; // 最终拼成的字符串
                   }
-                  newParamsName.value += tempStr; // 最终拼成的字符串
+                } else {
+                  // 将旧标签的值赋给新标签
+                  newParamsName.value = params;
                 }
-              } else {
-                // 将旧标签的值赋给新标签
-                newParamsName.value = params;
-              }
-              //将最终的字符串返回
-              return newParamsName.value;
+                //将最终的字符串返回
+                return newParamsName.value;
+              },
             },
-          },
-          axisLine: {
-            lineStyle: {
-              // color: 'rgba(14, 53, 95)',
-              color: '#244a94',
+            axisLine: {
+              lineStyle: {
+                // color: 'rgba(14, 53, 95)',
+                color: '#244a94',
+              },
             },
-          },
-          splitLine: {
-            show: false,
-            //   lineStyle: {
-            //     color: '#243753',
-            //   },
-          },
-          axisTick: {
-            show: false,
-          },
-          data: echartDataGqs.xData ? echartDataGqs.xData : [],
-        },
-      ],
-      yAxis: [
-        {
-          boundaryGap: false,
-          type: 'value',
-          max: props.maxY,
-          axisLabel: {
-            textStyle: {
-              color: '#b3b8cc',
+            splitLine: {
+              show: false,
+              //   lineStyle: {
+              //     color: '#243753',
+              //   },
             },
-            formatter: '{value}',
-          },
-          name: props.echartDw,
-          nameTextStyle: {
-            color: '#fff',
-            fontSize: 12,
-            lineHeight: 10,
-          },
-          splitLine: {
-            lineStyle: {
-              // color: 'rgba(14, 53, 95)',
-              color: '#0d2973',
+            axisTick: {
+              show: false,
             },
+            data: echartDataGqs.xData ? echartDataGqs.xData : [],
           },
-          axisLine: {
-            show: true,
-            lineStyle: {
-              // color: 'rgba(14, 53, 95)',
-              color: '#244a94',
+        ],
+        yAxis: [
+          {
+            boundaryGap: false,
+            type: 'value',
+            max: props.maxY,
+            axisLabel: {
+              textStyle: {
+                color: '#b3b8cc',
+              },
+              formatter: '{value}',
             },
-          },
-          axisTick: {
-            show: false,
-          },
-        },
-        {
-          boundaryGap: false,
-          type: 'value',
-          max: props.maxY,
-          axisLabel: {
-            textStyle: {
-              color: '#b3b8cc',
+            name: props.echartDw,
+            nameTextStyle: {
+              color: '#fff',
+              fontSize: 12,
+              lineHeight: 10,
             },
-            formatter: '{value}',
-          },
-          name: props.echartDw1,
-          nameTextStyle: {
-            color: '#fff',
-            fontSize: 12,
-            lineHeight: 10,
-          },
-          splitLine: {
-            lineStyle: {
-              color: 'rgba(14, 53, 95)',
+            splitLine: {
+              lineStyle: {
+                // color: 'rgba(14, 53, 95)',
+                color: '#0d2973',
+              },
             },
-          },
-          axisLine: {
-            show: true,
-            lineStyle: {
-              color: 'rgba(14, 53, 95)',
+            axisLine: {
+              show: true,
+              lineStyle: {
+                // color: 'rgba(14, 53, 95)',
+                color: '#244a94',
+              },
+            },
+            axisTick: {
+              show: false,
             },
           },
-          axisTick: {
-            show: false,
+          {
+            boundaryGap: false,
+            type: 'value',
+            max: props.maxY,
+            axisLabel: {
+              textStyle: {
+                color: '#b3b8cc',
+              },
+              formatter: '{value}',
+            },
+            name: props.echartDw1,
+            nameTextStyle: {
+              color: '#fff',
+              fontSize: 12,
+              lineHeight: 10,
+            },
+            splitLine: {
+              lineStyle: {
+                color: 'rgba(14, 53, 95)',
+              },
+            },
+            axisLine: {
+              show: true,
+              lineStyle: {
+                color: 'rgba(14, 53, 95)',
+              },
+            },
+            axisTick: {
+              show: false,
+            },
           },
-        },
-      ],
-      series: [
-        {
-          name: echartDataGqs.maxData ? echartDataGqs.maxData.lengedData : '',
-          type: 'line',
+        ],
+        series: [
+          {
+            name: echartDataGqs.maxData ? echartDataGqs.maxData.lengedData : '',
+            type: 'line',
 
-          // markPoint: {
-          //   symbol: 'circle',
-          //   data: [
-          //     {
-          //       coord: [345.44, 94250.0],
-          //       name: '交点',
-          //     },
+            // markPoint: {
+            //   symbol: 'circle',
+            //   data: [
+            //     {
+            //       coord: [345.44, 94250.0],
+            //       name: '交点',
+            //     },
 
-          //   ],
-          //   symbolSize: 10,
-          //   itemStyle: {
-          //     color: '#19a3df',
-          //     borderColor: '#a3c8d8',
-          //   },
-          //   label: {
-          //     fontSize: 10,
-          //     color: '#fff',
-          //   },
-          // },
-          smooth: true,
-          symbol: 'none',
-          zlevel: 3,
-          itemStyle: {
-            color: '#fc0808',
-            borderColor: '#fc0808',
-          },
-          lineStyle: {
-            normal: {
-              width: 2,
-              color: '#fc0808'
+            //   ],
+            //   symbolSize: 10,
+            //   itemStyle: {
+            //     color: '#19a3df',
+            //     borderColor: '#a3c8d8',
+            //   },
+            //   label: {
+            //     fontSize: 10,
+            //     color: '#fff',
+            //   },
+            // },
+            smooth: true,
+            symbol: 'none',
+            zlevel: 3,
+            itemStyle: {
+              // color: '#19a3df',
+              color: '#ff0000',
+              borderColor: '#a3c8d8',
             },
+            lineStyle: {
+              normal: {
+                width: 2,
+                color: '#19a3df',
+              },
+            },
+            data: echartDataGqs.maxData ? echartDataGqs.maxData.data : [],
           },
-          data: echartDataGqs.maxData ? echartDataGqs.maxData.data : [],
-        },
-        {
-          name: echartDataGqs.minData ? echartDataGqs.minData.lengedData : '',
-          type: 'line',
-          smooth: true,
-          symbol: 'none',
-          zlevel: 3,
-          itemStyle: {
-            color: '#4fffad',
-            borderColor: '#a3c8d8',
-          },
-          lineStyle: {
-            normal: {
-              width: 2,
+          {
+            name: echartDataGqs.minData ? echartDataGqs.minData.lengedData : '',
+            type: 'line',
+            smooth: true,
+            symbol: 'none',
+            zlevel: 3,
+            itemStyle: {
               color: '#4fffad',
+              borderColor: '#a3c8d8',
             },
+            lineStyle: {
+              normal: {
+                width: 2,
+                color: '#4fffad',
+              },
+            },
+            data: echartDataGqs.minData ? echartDataGqs.minData.data : [],
           },
-          data: echartDataGqs.minData ? echartDataGqs.minData.data : [],
-        },
-        {
-          name: echartDataGqs.avgData ? echartDataGqs.avgData.lengedData : '',
-          type: 'line',
-          smooth: true,
-          symbol: 'none',
-          zlevel: 3,
-          itemStyle: {
-            color: '#fc8452',
-            borderColor: '#a3c8d8',
-          },
-          lineStyle: {
-            normal: {
-              width: 2,
+          {
+            name: echartDataGqs.avgData ? echartDataGqs.avgData.lengedData : '',
+            type: 'line',
+            smooth: true,
+            symbol: 'none',
+            zlevel: 3,
+            itemStyle: {
               color: '#fc8452',
+              borderColor: '#a3c8d8',
+            },
+            lineStyle: {
+              normal: {
+                width: 2,
+                color: '#fc8452',
+              },
             },
-          },
 
-          data: echartDataGqs.avgData ? echartDataGqs.avgData.data : [],
-        },
-        {
-          name: echartDataGqs.curData ? echartDataGqs.curData.lengedData : '',
-          type: 'line',
-          smooth: true,
-          symbol: 'none',
-          zlevel: 3,
-          itemStyle: {
-            color: '#fc8452',
-            borderColor: '#a3c8d8',
+            data: echartDataGqs.avgData ? echartDataGqs.avgData.data : [],
           },
-          lineStyle: {
-            normal: {
-              width: 2,
+          {
+            name: echartDataGqs.curData ? echartDataGqs.curData.lengedData : '',
+            type: 'line',
+            smooth: true,
+            symbol: 'none',
+            zlevel: 3,
+            itemStyle: {
               color: '#fc8452',
+              borderColor: '#a3c8d8',
+            },
+            lineStyle: {
+              normal: {
+                width: 2,
+                color: '#fc8452',
+              },
             },
-          },
 
-          data: echartDataGqs.curData ? echartDataGqs.curData.data : [],
-        },
-      ],
-    };
-    myChart.setOption(option);
-    window.onresize = function () {
-      myChart.resize();
-    };
-  });
-}
+            data: echartDataGqs.curData ? echartDataGqs.curData.data : [],
+          },
+        ],
+      };
+      myChart.setOption(option);
+      window.onresize = function () {
+        myChart.resize();
+      };
+    });
+  }
 </script>
 
 <style scoped lang="less">
-.echartLine {
-  width: 100%;
-  height: 100%;
-
-  .line {
+  .echartLine {
     width: 100%;
     height: 100%;
    
   }
-}
 </style>

src/views/vent/monitorManager/alarmMonitor/common/warnGradeEchart.vue

@@ -25,13 +25,13 @@
     (newV, oldV) => {
       let data: any[] = [];
       Object.keys(newV).forEach((el) => {
-        if (el == 'dust') {
+        if (el == 'dust' && newV[el]) {
           data.push({ name: '粉尘', value: newV[el] });
-        } else if (el == 'fire') {
+        } else if (el == 'fire' && newV[el]) {
           data.push({ name: '火灾', value: newV[el] });
-        } else if (el == 'gas') {
+        } else if (el == 'gas' && newV[el]) {
           data.push({ name: '瓦斯', value: newV[el] });
-        } else if (el == 'vent') {
+        } else if (el == 'vent' && newV[el]) {
           data.push({ name: '通风', value: newV[el] });
         }
       });

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

@@ -379,7 +379,7 @@
               <div class="detail-box">
                 <div class="detail-item" v-for="(item, index) in gasMonitor" :key="index">
                   <div class="">{{ item.label }}</div>
-                  <div class="value">{{ !item.value1 && item.value1 != '0' ? '-' : item.value1 }}</div>
+                  <div class="value">{{ !item.value1 ? '-' : item.value1 }}</div>
                 </div>
               </div>
             </div>

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

@@ -253,7 +253,7 @@
             <div class="icon"></div>
             <div class="container">
               <div class="data-box" v-for="(item, index) in fireMonitor1" :key="index">
-                <div class="box-item">
+                <div class="box-item" style="width: 200px">
                   <div
                     :class="{
                       value1: item.warnLevel == '绿色预警',
@@ -265,7 +265,7 @@
                   <div class="title">监测位置</div>
                 </div>
 
-                <div class="box-item">
+                <div class="box-item" style="width: 80px">
                   <div
                     :class="{
                       value1: item.warnLevel == '绿色预警',
@@ -399,12 +399,6 @@
       case 'fire':
         router.push('/fire/warn/home');
         break;
-      case 'dust':
-        router.push('/dust/warn/home');
-        break;
-      case 'gas':
-        router.push('/gas/warn/home');
-        break;
       case 'sbyj':
         // router.push('/device/warn/home');
         router.push('/device/warn/home');
@@ -434,26 +428,32 @@
     console.log(res, '预警数据--------------');
     // fireMonitor1.value.length = 0;
     toggleData = Object.assign({}, res);
-    windData.levels = res.info.sysInfo.ventS.levels;
-    windData.levels['blue'] = warnNumMap.get('vent');
-    if (showToggle.value == 'monitor') {
-      windData.jf = res.ventInfo.zongjinfeng;
-      windData.hf = res.ventInfo.zonghuifeng;
-    } else if (showToggle.value == 'report') {
-      windData.jf = res.ventInfo.totalIntM3;
-      windData.hf = res.ventInfo.totalRetM3;
-    } else {
-      windData.jf = monitor.value ? res.ventInfo.zongjinfeng : res.ventInfo.totalIntM3;
-      windData.hf = monitor.value ? res.ventInfo.zonghuifeng : res.ventInfo.totalRetM3;
+
+    if (res.ventInfo) {
+      if (showToggle.value == 'monitor') {
+        windData.jf = res.ventInfo.zongjinfeng;
+        windData.hf = res.ventInfo.zonghuifeng;
+      } else if (showToggle.value == 'report') {
+        windData.jf = res.ventInfo.totalIntM3;
+        windData.hf = res.ventInfo.totalRetM3;
+      } else {
+        windData.jf = monitor.value ? res.ventInfo.zongjinfeng : res.ventInfo.totalIntM3;
+        windData.hf = monitor.value ? res.ventInfo.zonghuifeng : res.ventInfo.totalRetM3;
+      }
+      windData.xf = res.ventInfo.xufengliang;
+    }
+    if (res.info && res.info.sysInfo) {
+      windData.levels = res.info.sysInfo.ventS.levels;
+      windData.levels['blue'] = warnNumMap.get('vent');
+      dustData.levels = res.info.sysInfo.dustS.levels;
+      dustData.levels['blue'] = warnNumMap.get('dust');
+      centerData.fire = res.info.sysInfo.fireS.maxLevel;
+      centerData.tf = res.info.sysInfo.ventS.maxLevel;
+      centerData.ws = res.info.sysInfo.gasS.maxLevel;
+      centerData.fc = res.info.sysInfo.dustS.maxLevel;
     }
-    windData.xf = res.ventInfo.xufengliang;
-    dustData.levels = res.info.sysInfo.dustS.levels;
-    dustData.levels['blue'] = warnNumMap.get('dust');
-    centerData.fire = res.info.sysInfo.fireS.maxLevel;
-    centerData.tf = res.info.sysInfo.ventS.maxLevel;
-    centerData.ws = res.info.sysInfo.gasS.maxLevel;
-    centerData.sb = res.info.deviceWarnInfo.maxLevel;
-    centerData.fc = res.info.sysInfo.dustS.maxLevel;
+
+    if (res.info && res.info.deviceWarnInfo) centerData.sb = res.info.deviceWarnInfo.maxLevel;
     centerData.riskLevel = res.info.riskLevel;
     Levels = Object.assign({}, await getDisasterProportion());
     centerData.levels =
@@ -1376,61 +1376,58 @@
             margin: 10px auto;
             position: relative;
             background-image: linear-gradient(to right, #39a3ff66, #39a3ff00);
+            padding: 5px 0;
             .box-item {
-              width: 100%;
               height: 100%;
               display: flex;
               flex-direction: column;
               align-items: center;
-              padding: 0 20px;
 
               .value {
-                font-size: 16px;
-                font-family: 'douyuFont';
+                font-size: 14px;
+                font-weight: 600;
                 color: #2bdcff;
                 margin-bottom: 5px;
               }
 
               .value1 {
-                font-size: 16px;
-                font-family: 'douyuFont';
+                font-size: 14px;
+                font-weight: 600;
                 margin-bottom: 5px;
                 color: rgb(145, 230, 9);
               }
 
               .value2 {
-                font-size: 16px;
-                font-family: 'douyuFont';
+                font-size: 14px;
+                font-weight: 600;
                 margin-bottom: 5px;
-                // color: rgb(0, 242, 255);
                 color: #ffff35;
               }
 
               .value3 {
-                font-size: 16px;
-                font-family: 'douyuFont';
+                font-size: 14px;
+                font-weight: 600;
                 margin-bottom: 5px;
-                // color: #ffff35;
                 color: #ff0000;
               }
 
               .value4 {
-                font-size: 16px;
-                font-family: 'douyuFont';
+                font-size: 14px;
+                font-weight: 600;
                 margin-bottom: 5px;
                 color: #ffbe69;
               }
 
               .value5 {
-                font-size: 16px;
-                font-family: 'douyuFont';
+                font-size: 14px;
+                font-weight: 600;
                 margin-bottom: 5px;
                 color: #ff6f00;
               }
 
               .value6 {
-                font-size: 16px;
-                font-family: 'douyuFont';
+                font-size: 14px;
+                font-weight: 600;
                 margin-bottom: 5px;
                 color: #ff0000;
               }
@@ -1441,7 +1438,7 @@
             }
 
             .box-item1 {
-              width: 50%;
+              width: 120px;
               height: 100%;
               display: flex;
               flex-direction: column;
@@ -1449,58 +1446,56 @@
               padding: 0 20px;
 
               .value {
-                font-size: 16px;
-                font-family: 'douyuFont';
+                font-size: 14px;
+                font-weight: 600;
                 color: #2bdcff;
                 margin-bottom: 5px;
               }
 
               .value1 {
-                font-size: 16px;
-                font-family: 'douyuFont';
+                font-size: 14px;
+                font-weight: 600;
                 margin-bottom: 5px;
                 color: rgb(145, 230, 9);
               }
 
               .value2 {
-                font-size: 16px;
-                font-family: 'douyuFont';
+                font-size: 14px;
+                font-weight: 600;
                 margin-bottom: 5px;
-                // color: rgb(0, 242, 255);
                 color: #ffff35;
               }
 
               .value3 {
-                font-size: 16px;
-                font-family: 'douyuFont';
+                font-size: 14px;
+                font-weight: 600;
                 margin-bottom: 5px;
-                // color: #ffff35;
                 color: #ff0000;
               }
 
               .value4 {
-                font-size: 16px;
-                font-family: 'douyuFont';
+                font-size: 14px;
+                font-weight: 600;
                 margin-bottom: 5px;
                 color: #ffbe69;
               }
 
               .value5 {
-                font-size: 16px;
-                font-family: 'douyuFont';
+                font-size: 14px;
+                font-weight: 600;
                 margin-bottom: 5px;
                 color: #ff6f00;
               }
 
               .value6 {
-                font-size: 16px;
-                font-family: 'douyuFont';
+                font-size: 14px;
+                font-weight: 600;
                 margin-bottom: 5px;
                 color: #ff0000;
               }
 
               .title {
-                font-size: 13px;
+                font-size: 14px;
               }
             }
           }

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

@@ -2,12 +2,18 @@
   <customHeader :options="options" @change="getSelectRow" :optionValue="optionValue"> 粉尘监测预警 </customHeader>
   <div class="dustWarn">
     <div class="top-dust">
-      <a-button v-if="!hasPermission('dustWarn:return')" preIcon="ant-design:rollback-outlined" type="text" size="small"
-        style="position: absolute; left: 15px; top: 15px; color: #fff" @click="getBack">返回</a-button>
+      <a-button
+        v-if="!hasPermission('dustWarn:return')"
+        preIcon="ant-design:rollback-outlined"
+        type="text"
+        size="small"
+        style="position: absolute; left: 15px; top: 15px; color: #fff"
+        @click="getBack"
+        >返回</a-button
+      >
       <div class="alarm-menu">
         <div class="card-btn">
-          <div :class="activeIndex1 == ind ? 'btn1' : 'btn'" v-for="(item, ind) in menuList" :key="ind"
-            @click="cardClick(ind, item)">
+          <div :class="activeIndex1 == ind ? 'btn1' : 'btn'" v-for="(item, ind) in menuList" :key="ind" @click="cardClick(ind, item)">
             <div class="text">{{ item.name }}</div>
             <div class="warn">{{ item.warn }}</div>
           </div>
@@ -15,8 +21,12 @@
       </div>
       <div class="dust-content">
         <div class="content-left">
-          <div :class="activeIndex == index ? 'content-left-item' : 'content-left-item1'"
-            v-for="(item, index) in topAreaList" :key="index" @click="topAreaClick(index)">
+          <div
+            :class="activeIndex == index ? 'content-left-item' : 'content-left-item1'"
+            v-for="(item, index) in topAreaList"
+            :key="index"
+            @click="topAreaClick(index)"
+          >
             <div class="content-title">{{ item.title }}</div>
             <div class="content-items" v-for="(ite, ind) in item.content" :key="ind">
               <span>{{ ite.label }}</span>
@@ -43,611 +53,613 @@
 </template>
 
 <script setup lang="ts">
-import { ref, reactive, onMounted, onUnmounted } from 'vue';
-import { sysTypeWarnList, sysWarn, getDevice } from '../common.api';
-import echartLine from '../common/echartLine.vue';
-import { useSystemSelect } from '/@/hooks/vent/useSystemSelect';
-import { useRouter } from 'vue-router';
-import CustomHeader from '/@/components/vent/customHeader.vue';
-import { usePermission } from '/@/hooks/web/usePermission';
-import { useGlobSetting } from '/@/hooks/setting';
-import MeasurePoint from '../common/measurePoint.vue';
-
-const glob = useGlobSetting();
-const { hasPermission } = usePermission();
-const { options, optionValue, getSelectRow, getSysDataSource } = useSystemSelect('sys_surface_caimei'); // 参数为场景类型（设备类型管理中可以查询到）
-//左侧数据列表
-let menuList = ref<any[]>([]);
-//当前左侧激活菜单的索引
-let activeIndex1 = ref(0);
-//顶部区域激活选项
-let activeIndex = ref(0);
-//顶部区域数据
-let topAreaList = reactive<any[]>([]);
-let choiceData = reactive<any[]>([]);
-//粉尘图表数据
-let echartDataFc = reactive<any>({
-  maxData: {
-    lengedData: '实时值(mg/m³)',
-    data: [],
-  },
-  minData: {
-    lengedData: '预测值(mg/m³)',
-    data: [],
-  },
-  aveValue: {
-    lengedData: '预警值(mg/m³)',
-    data: [],
-  },
-  xData: [],
-});
-let maxY = ref<any>(0);
-let echartDw = ref('(mg/m³)');
-let gridV = reactive({
-  top: '12%',
-  left: '2%',
-  bottom: '5%',
-  right: '5%',
-  containLabel: true,
-});
-const cardListTf = ref<any[]>([]);
-const chartListTf = ref<any[]>([]);
-let router = useRouter();
-let echartNow = ref<any[]>([]);
-let echartYc = reactive<any[]>([]);
-let flag = ref(true);
-
-// https获取监测数据
-let timer: null | NodeJS.Timeout = null;
-function getMonitor(flag?) {
-  timer = setTimeout(
-    () => {
-      getMenuList()
-      getWindDeviceList();
-      if (timer) {
-        timer = null;
-      }
-      getMonitor(false);
-    }, flag ? 0 : 1000)
-}
-//返回首页
-function getBack() {
-  router.push('/monitorChannel/monitor-alarm-home');
-}
-//菜单选项切换
-function cardClick(ind, item) {
-  clearTimeout(timer);
-  activeIndex1.value = ind;
-  getMonitor(true);
-}
-//顶部区域选项切换
-function topAreaClick(index) {
-  activeIndex.value = index;
-  echartDataFc.maxData.data.length = 0;
-  echartDataFc.minData.data.length = 0;
-  echartDataFc.aveValue.data.length = 0;
-  echartDataFc.xData.length = 0;
-  echartYc.length = 0;
-  flag.value = true;
-  if (flag.value) {
-    echartNow.value = JSON.parse(choiceData[index].readData.expectInfo)['list'];
-    flag.value = false;
-  }
-  echartYc.push({
-    time: JSON.parse(choiceData[index].readData.expectInfo)['nowTime'],
-    value: JSON.parse(choiceData[index].readData.expectInfo)['nowVal'],
+  import { ref, reactive, onMounted, onUnmounted } from 'vue';
+  import { sysTypeWarnList, sysWarn, getDevice } from '../common.api';
+  import echartLine from '../common/echartLine.vue';
+  import { useSystemSelect } from '/@/hooks/vent/useSystemSelect';
+  import { useRouter } from 'vue-router';
+  import CustomHeader from '/@/components/vent/customHeader.vue';
+  import { usePermission } from '/@/hooks/web/usePermission';
+  import { useGlobSetting } from '/@/hooks/setting';
+  import MeasurePoint from '../common/measurePoint.vue';
+
+  const glob = useGlobSetting();
+  const { hasPermission } = usePermission();
+  const { options, optionValue, getSelectRow, getSysDataSource } = useSystemSelect('sys_surface_caimei'); // 参数为场景类型（设备类型管理中可以查询到）
+  //左侧数据列表
+  let menuList = ref<any[]>([]);
+  //当前左侧激活菜单的索引
+  let activeIndex1 = ref(0);
+  //顶部区域激活选项
+  let activeIndex = ref(0);
+  //顶部区域数据
+  let topAreaList = reactive<any[]>([]);
+  let choiceData = reactive<any[]>([]);
+  //粉尘图表数据
+  let echartDataFc = reactive<any>({
+    maxData: {
+      lengedData: '实时值(mg/m³)',
+      data: [],
+    },
+    minData: {
+      lengedData: '预测值(mg/m³)',
+      data: [],
+    },
+    aveValue: {
+      lengedData: '预警值(mg/m³)',
+      data: [],
+    },
+    xData: [],
   });
-  let setData = [...echartNow.value, ...echartYc].sort((a, b) => Date.parse(new Date(a.time)) - Date.parse(new Date(b.time)));
-  setData.forEach((el) => {
-    if (el.value && el.value != '0') {
-      echartDataFc.xData.push(el.time);
-      echartDataFc.maxData.data.push(el.value);
-      echartDataFc.minData.data.push(JSON.parse(choiceData[index].readData.expectInfo)['aveVal']);
-      echartDataFc.aveValue.data.push(
-        JSON.parse(choiceData[activeIndex.value].readData.expectInfo)['fmin']
-          ? JSON.parse(choiceData[activeIndex.value].readData.expectInfo)['fmin']
-          : 0
-      );
-    }
+  let maxY = ref<any>(0);
+  let echartDw = ref('(mg/m³)');
+  let gridV = reactive({
+    top: '12%',
+    left: '2%',
+    bottom: '5%',
+    right: '5%',
+    containLabel: true,
   });
-}
-//获取左侧菜单列表
-async function getMenuList() {
-  let res = await sysTypeWarnList({ type: 'dust' });
-  if (res.length != 0) {
-    const menuListTemp: any[] = [];
-    res.forEach((el) => {
-      menuListTemp.push({
-        name: el.systemname,
-        warn: el.warnDes,
-        deviceID: el.id,
-        strtype: el.strtype,
-        detail: el.detail,
-      });
-    });
-    menuList.value = menuListTemp;
-    getDetailList(menuList.value[activeIndex1.value].detail);
+  const cardListTf = ref<any[]>([]);
+  const chartListTf = ref<any[]>([]);
+  let router = useRouter();
+  let echartNow = ref<any[]>([]);
+  let echartYc = reactive<any[]>([]);
+  let flag = ref(true);
+
+  // https获取监测数据
+  let timer: null | NodeJS.Timeout = null;
+  function getMonitor(flag?) {
+    timer = setTimeout(
+      () => {
+        getMenuList();
+        getWindDeviceList();
+        if (timer) {
+          timer = null;
+        }
+        getMonitor(false);
+      },
+      flag ? 0 : 1000
+    );
   }
-}
-//获取右侧详情列表数据
-function getDetailList(param) {
-  topAreaList.length = 0;
-  if (JSON.stringify(param) != '{}') {
-    param.dust.forEach((el) => {
-      topAreaList.push({
-        title: el.strinstallpos,
-        content: [
-          { ids: 0, label: '温度(°C)', value: el.readData.temperature || '--' },
-          { ids: 1, label: '粉尘浓度(mg/m³)', value: el.readData.dustval || '--' },
-          { ids: 2, label: '喷雾水压(MPa)', value: el.readData.waterPressure || '--' },
-          { ids: 3, label: '喷雾状态', value: el.readData.atomizingState || '--' },
-        ],
-      });
+  //返回首页
+  function getBack() {
+    router.push('/monitorChannel/monitor-alarm-home');
+  }
+  //菜单选项切换
+  function cardClick(ind, item) {
+    clearTimeout(timer);
+    activeIndex1.value = ind;
+    getMonitor(true);
+  }
+  //顶部区域选项切换
+  function topAreaClick(index) {
+    activeIndex.value = index;
+    echartDataFc.maxData.data.length = 0;
+    echartDataFc.minData.data.length = 0;
+    echartDataFc.aveValue.data.length = 0;
+    echartDataFc.xData.length = 0;
+    echartYc.length = 0;
+    flag.value = true;
+    if (flag.value) {
+      echartNow.value = JSON.parse(choiceData[index].readData.expectInfo)['list'];
+      flag.value = false;
+    }
+    echartYc.push({
+      time: JSON.parse(choiceData[index].readData.expectInfo)['nowTime'],
+      value: JSON.parse(choiceData[index].readData.expectInfo)['nowVal'],
     });
-    choiceData = param.dust;
-
-    if (choiceData[activeIndex.value]) {
-      if (flag.value) {
-        echartNow.value = JSON.parse(choiceData[activeIndex.value].readData.expectInfo)['list'];
-        flag.value = false;
-      }
-      echartYc.push({
-        time: JSON.parse(choiceData[activeIndex.value].readData.expectInfo)['nowTime'],
-        value: JSON.parse(choiceData[activeIndex.value].readData.expectInfo)['nowVal'],
-      });
-      let setData = [...echartNow.value, ...echartYc].sort((a, b) => Date.parse(new Date(a.time)) - Date.parse(new Date(b.time)));
-      echartDataFc.maxData.data.length = 0;
-      echartDataFc.minData.data.length = 0;
-      echartDataFc.aveValue.data.length = 0;
-      echartDataFc.xData.length = 0;
-      setData.forEach((el) => {
-        if (el.value && el.value != '0') {
-          echartDataFc.xData.push(el.time);
-          echartDataFc.maxData.data.push(el.value);
-          echartDataFc.minData.data.push(JSON.parse(choiceData[activeIndex.value].readData.expectInfo)['aveVal']);
-          echartDataFc.aveValue.data.push(
-            JSON.parse(choiceData[activeIndex.value].readData.expectInfo)['fmin']
-              ? JSON.parse(choiceData[activeIndex.value].readData.expectInfo)['fmin']
-              : 0
-          );
-        }
-      });
-      maxY.value = echartDataFc.maxData.data.reduce((acr, cur) => {
-        return acr > cur ? acr : cur;
-      });
-      maxY.value =
-        maxY.value.toString().indexOf('.') == -1 ? maxY.value.toString() : maxY.value.toString().substring(0, maxY.value.toString().indexOf('.'));
-      if (maxY.value.length < 2 && Number(maxY.value) < 1) {
-        maxY.value = 1;
-      } else if (maxY.value.length < 2 && Number(maxY.value) >= 1) {
-        maxY.value = 10;
-      } else if (maxY.value.length < 3) {
-        maxY.value = (Number(maxY.value[0]) + 1) * 10;
-      } else if (maxY.value.length < 4) {
-        maxY.value = (Number(maxY.value[0]) + 1) * 100;
-      } else if (maxY.value.length < 5) {
-        maxY.value = (Number(maxY.value[0]) + 1) * 1000;
-      } else if (maxY.value.length < 6) {
-        maxY.value = (Number(maxY.value[0]) + 1) * 10000;
-      }
-    } else {
-      activeIndex.value = 0;
-      if (flag.value) {
-        echartNow.value = JSON.parse(choiceData[activeIndex.value].readData.expectInfo)['list'];
-        flag.value = false;
+    let setData = [...echartNow.value, ...echartYc].sort((a, b) => Date.parse(new Date(a.time)) - Date.parse(new Date(b.time)));
+    setData.forEach((el) => {
+      if (el.value && el.value != '0') {
+        echartDataFc.xData.push(el.time);
+        echartDataFc.maxData.data.push(el.value);
+        echartDataFc.minData.data.push(JSON.parse(choiceData[index].readData.expectInfo)['aveVal']);
+        echartDataFc.aveValue.data.push(
+          JSON.parse(choiceData[activeIndex.value].readData.expectInfo)['fmin']
+            ? JSON.parse(choiceData[activeIndex.value].readData.expectInfo)['fmin']
+            : 0
+        );
       }
-      echartYc.push({
-        time: JSON.parse(choiceData[activeIndex.value].readData.expectInfo)['nowTime'],
-        value: JSON.parse(choiceData[activeIndex.value].readData.expectInfo)['nowVal'],
-      });
-      let setData = [...echartNow.value, ...echartYc].sort((a, b) => Date.parse(new Date(a.time)) - Date.parse(new Date(b.time)));
-      echartDataFc.maxData.data.length = 0;
-      echartDataFc.minData.data.length = 0;
-      echartDataFc.aveValue.data.length = 0;
-      echartDataFc.xData.length = 0;
-      setData.forEach((el) => {
-        if (el.value && el.value != '0') {
-          echartDataFc.xData.push(el.time);
-          echartDataFc.maxData.data.push(el.value);
-          echartDataFc.minData.data.push(JSON.parse(choiceData[activeIndex.value].readData.expectInfo)['aveVal']);
-          echartDataFc.aveValue.data.push(
-            JSON.parse(choiceData[activeIndex.value].readData.expectInfo)['fmin']
-              ? JSON.parse(choiceData[activeIndex.value].readData.expectInfo)['fmin']
-              : 0
-          );
-        }
-      });
-      maxY.value = echartDataFc.maxData.data.reduce((acr, cur) => {
-        return acr > cur ? acr : cur;
+    });
+  }
+  //获取左侧菜单列表
+  async function getMenuList() {
+    let res = await sysTypeWarnList({ type: 'dust' });
+    if (res.length != 0) {
+      const menuListTemp: any[] = [];
+      res.forEach((el) => {
+        menuListTemp.push({
+          name: el.systemname,
+          warn: el.warnDes,
+          deviceID: el.id,
+          strtype: el.strtype,
+          detail: el.detail,
+        });
       });
-      maxY.value =
-        maxY.value.toString().indexOf('.') == -1 ? maxY.value.toString() : maxY.value.toString().substring(0, maxY.value.toString().indexOf('.'));
-      if (maxY.value.length < 2) {
-        maxY.value = 10;
-      } else if (maxY.value.length < 3) {
-        maxY.value = (Number(maxY.value[0]) + 1) * 10;
-      } else if (maxY.value.length < 4) {
-        maxY.value = (Number(maxY.value[0]) + 1) * 100;
-      } else if (maxY.value.length < 5) {
-        maxY.value = (Number(maxY.value[0]) + 1) * 1000;
-      } else if (maxY.value.length < 6) {
-        maxY.value = (Number(maxY.value[0]) + 1) * 10000;
-      }
+      menuList.value = menuListTemp;
+      getDetailList(menuList.value[activeIndex1.value].detail);
     }
   }
-}
-
-//获取粉尘监控测点信息
-async function getWindDeviceList() {
-  // cardListTf.length = 0;
-  const cardListTfTemp: any[] = [];
-  const chartListTfTemp: any[] = [];
-  let res = await getDevice({ devicetype: 'dusting', pagetype: 'normal' });
-  if (res && res.msgTxt[0]) {
-    let list = res.msgTxt[0].datalist || [];
-    if (list.length > 0) {
-      list.forEach((el: any) => {
-        const readData = el.readData;
-        el = Object.assign(el, readData);
-        cardListTfTemp.push({
-          label: '通信状态',
-          value: el.netStatus == '0' ? '断开' : '连接',
-          listR: [
-            { id: 0, label: '安装位置', dw: '', value: el.strinstallpos || '-' },
-            { id: 1, label: '粉尘浓度', dw: '(mg/m³)', value: el.dustval || '-' },
-            {
-              id: 2,
-              label: '巷道湿度',
-              dw: el.humidity && Number(el.humidity) < 1 ? '(RH)' : el.humidity && Number(el.humidity) > 1 ? '(%RH)' : '',
-              value: el.humidity || '-',
-            },
-            { id: 4, label: '巷道温度', dw: el.humidity ? '(℃)' : '', value: el.temperature || '-' },
-            {
-              id: 3,
-              label: '是否报警',
-              dw: '',
-              value: el.warnFlag == '0' ? '正常' : el.warnFlag == 1 ? '报警' : el.warnFlag == 2 ? '断开' : '未监测',
-            },
+  //获取右侧详情列表数据
+  function getDetailList(param) {
+    topAreaList.length = 0;
+    if (JSON.stringify(param) != '{}') {
+      param.dust.forEach((el) => {
+        topAreaList.push({
+          title: el.strinstallpos,
+          content: [
+            { ids: 0, label: '温度(°C)', value: el.readData.temperature || '--' },
+            { ids: 1, label: '粉尘浓度(mg/m³)', value: el.readData.dustval || '--' },
+            { ids: 2, label: '喷雾水压(MPa)', value: el.readData.waterPressure || '--' },
+            { ids: 3, label: '喷雾状态', value: el.readData.atomizingState || '--' },
           ],
         });
+      });
+      choiceData = param.dust;
 
-        // 初始化预测曲线配置，分别为x轴时间、平均、最大、最小、实时
-        const avgParam = el.avgParam || {
-          avg_dusting_value: 0,
-          max_dusting_value: 0,
-          min_dusting_value: 0,
-        };
-        chartListTfTemp.push({
-          label: el.strinstallpos,
-          time: new Date(),
-          data: [avgParam.avg_dusting_value, avgParam.max_dusting_value, avgParam.min_dusting_value, el.readData.dustval],
+      if (choiceData[activeIndex.value]) {
+        if (flag.value) {
+          echartNow.value = JSON.parse(choiceData[activeIndex.value].readData.expectInfo)['list'];
+          flag.value = false;
+        }
+        echartYc.push({
+          time: JSON.parse(choiceData[activeIndex.value].readData.expectInfo)['nowTime'],
+          value: JSON.parse(choiceData[activeIndex.value].readData.expectInfo)['nowVal'],
         });
-      });
+        let setData = [...echartNow.value, ...echartYc].sort((a, b) => Date.parse(new Date(a.time)) - Date.parse(new Date(b.time)));
+        echartDataFc.maxData.data.length = 0;
+        echartDataFc.minData.data.length = 0;
+        echartDataFc.aveValue.data.length = 0;
+        echartDataFc.xData.length = 0;
+        setData.forEach((el) => {
+          if (el.value && el.value != '0') {
+            echartDataFc.xData.push(el.time);
+            echartDataFc.maxData.data.push(el.value);
+            echartDataFc.minData.data.push(JSON.parse(choiceData[activeIndex.value].readData.expectInfo)['aveVal']);
+            echartDataFc.aveValue.data.push(
+              JSON.parse(choiceData[activeIndex.value].readData.expectInfo)['fmin']
+                ? JSON.parse(choiceData[activeIndex.value].readData.expectInfo)['fmin']
+                : 0
+            );
+          }
+        });
+        maxY.value = echartDataFc.maxData.data.reduce((acr, cur) => {
+          return acr > cur ? acr : cur;
+        });
+        maxY.value =
+          maxY.value.toString().indexOf('.') == -1 ? maxY.value.toString() : maxY.value.toString().substring(0, maxY.value.toString().indexOf('.'));
+        if (maxY.value.length < 2 && Number(maxY.value) < 1) {
+          maxY.value = 1;
+        } else if (maxY.value.length < 2 && Number(maxY.value) >= 1) {
+          maxY.value = 10;
+        } else if (maxY.value.length < 3) {
+          maxY.value = (Number(maxY.value[0]) + 1) * 10;
+        } else if (maxY.value.length < 4) {
+          maxY.value = (Number(maxY.value[0]) + 1) * 100;
+        } else if (maxY.value.length < 5) {
+          maxY.value = (Number(maxY.value[0]) + 1) * 1000;
+        } else if (maxY.value.length < 6) {
+          maxY.value = (Number(maxY.value[0]) + 1) * 10000;
+        }
+      } else {
+        activeIndex.value = 0;
+        if (flag.value) {
+          echartNow.value = JSON.parse(choiceData[activeIndex.value].readData.expectInfo)['list'];
+          flag.value = false;
+        }
+        echartYc.push({
+          time: JSON.parse(choiceData[activeIndex.value].readData.expectInfo)['nowTime'],
+          value: JSON.parse(choiceData[activeIndex.value].readData.expectInfo)['nowVal'],
+        });
+        let setData = [...echartNow.value, ...echartYc].sort((a, b) => Date.parse(new Date(a.time)) - Date.parse(new Date(b.time)));
+        echartDataFc.maxData.data.length = 0;
+        echartDataFc.minData.data.length = 0;
+        echartDataFc.aveValue.data.length = 0;
+        echartDataFc.xData.length = 0;
+        setData.forEach((el) => {
+          if (el.value && el.value != '0') {
+            echartDataFc.xData.push(el.time);
+            echartDataFc.maxData.data.push(el.value);
+            echartDataFc.minData.data.push(JSON.parse(choiceData[activeIndex.value].readData.expectInfo)['aveVal']);
+            echartDataFc.aveValue.data.push(
+              JSON.parse(choiceData[activeIndex.value].readData.expectInfo)['fmin']
+                ? JSON.parse(choiceData[activeIndex.value].readData.expectInfo)['fmin']
+                : 0
+            );
+          }
+        });
+        maxY.value = echartDataFc.maxData.data.reduce((acr, cur) => {
+          return acr > cur ? acr : cur;
+        });
+        maxY.value =
+          maxY.value.toString().indexOf('.') == -1 ? maxY.value.toString() : maxY.value.toString().substring(0, maxY.value.toString().indexOf('.'));
+        if (maxY.value.length < 2) {
+          maxY.value = 10;
+        } else if (maxY.value.length < 3) {
+          maxY.value = (Number(maxY.value[0]) + 1) * 10;
+        } else if (maxY.value.length < 4) {
+          maxY.value = (Number(maxY.value[0]) + 1) * 100;
+        } else if (maxY.value.length < 5) {
+          maxY.value = (Number(maxY.value[0]) + 1) * 1000;
+        } else if (maxY.value.length < 6) {
+          maxY.value = (Number(maxY.value[0]) + 1) * 10000;
+        }
+      }
     }
   }
-  cardListTf.value = cardListTfTemp;
-  chartListTf.value = chartListTfTemp;
-}
-onMounted(() => {
-  getMenuList();
-  getMonitor(true);
-});
-onUnmounted(() => {
-  if (timer) {
-    clearTimeout(timer);
-    timer = undefined;
+
+  //获取粉尘监控测点信息
+  async function getWindDeviceList() {
+    // cardListTf.length = 0;
+    const cardListTfTemp: any[] = [];
+    const chartListTfTemp: any[] = [];
+    let res = await getDevice({ devicetype: 'dusting', pagetype: 'normal' });
+    if (res && res.msgTxt[0]) {
+      let list = res.msgTxt[0].datalist || [];
+      if (list.length > 0) {
+        list.forEach((el: any) => {
+          const readData = el.readData;
+          el = Object.assign(el, readData);
+          cardListTfTemp.push({
+            label: '通信状态',
+            value: el.netStatus == '0' ? '断开' : '连接',
+            listR: [
+              { id: 0, label: '安装位置', dw: '', value: el.strinstallpos || '-' },
+              { id: 1, label: '粉尘浓度', dw: '(mg/m³)', value: el.dustval || '-' },
+              {
+                id: 2,
+                label: '巷道湿度',
+                dw: el.humidity && Number(el.humidity) < 1 ? '(RH)' : el.humidity && Number(el.humidity) > 1 ? '(%RH)' : '',
+                value: el.humidity || '-',
+              },
+              { id: 4, label: '巷道温度', dw: el.humidity ? '(℃)' : '', value: el.temperature || '-' },
+              {
+                id: 3,
+                label: '是否报警',
+                dw: '',
+                value: el.warnFlag == '0' ? '正常' : el.warnFlag == 1 ? '报警' : el.warnFlag == 2 ? '断开' : '未监测',
+              },
+            ],
+          });
+
+          // 初始化预测曲线配置，分别为x轴时间、平均、最大、最小、实时
+          const avgParam = el.avgParam || {
+            avg_dusting_value: 0,
+            max_dusting_value: 0,
+            min_dusting_value: 0,
+          };
+          chartListTfTemp.push({
+            label: el.strinstallpos,
+            time: new Date(),
+            data: [avgParam.avg_dusting_value, avgParam.max_dusting_value, avgParam.min_dusting_value, el.readData.dustval],
+          });
+        });
+      }
+    }
+    cardListTf.value = cardListTfTemp;
+    chartListTf.value = chartListTfTemp;
   }
-});
+  onMounted(() => {
+    getMenuList();
+    getMonitor(true);
+  });
+  onUnmounted(() => {
+    if (timer) {
+      clearTimeout(timer);
+      timer = undefined;
+    }
+  });
 </script>
 
 <style lang="less" scoped>
-@import '/@/design/theme.less';
+  @import '/@/design/theme.less';
+
+  @{theme-deepblue} {
+    .dustWarn {
+      --image-border: url('/@/assets/images/themify/deepblue/fire/border.png');
+      --image-no-choice: url('/@/assets/images/themify/deepblue/fire/no-choice.png');
+      --image-choice: url('/@/assets/images/themify/deepblue/fire/choice.png');
+      --image-dust-choice: url('/@/assets/images/themify/deepblue/fire/dust-choice.png');
+      --image-dust-content: url('/@/assets/images/themify/deepblue/fire/dust-content.png');
+      --image-dust-choice1: url('/@/assets/images/themify/deepblue/fire/dust-choice1.png');
+      --image-dust-content: url('/@/assets/images/themify/deepblue/fire/dust-content.png');
+      --image-bj1: url('/@/assets/images/themify/deepblue/fire/bj1.png');
+    }
+  }
 
-@{theme-deepblue} {
   .dustWarn {
-    --image-border: url('/@/assets/images/themify/deepblue/fire/border.png');
-    --image-no-choice: url('/@/assets/images/themify/deepblue/fire/no-choice.png');
-    --image-choice: url('/@/assets/images/themify/deepblue/fire/choice.png');
-    --image-dust-choice: url('/@/assets/images/themify/deepblue/fire/dust-choice.png');
-    --image-dust-content: url('/@/assets/images/themify/deepblue/fire/dust-content.png');
-    --image-dust-choice1: url('/@/assets/images/themify/deepblue/fire/dust-choice1.png');
-    --image-dust-content: url('/@/assets/images/themify/deepblue/fire/dust-content.png');
-    --image-bj1: url('/@/assets/images/themify/deepblue/fire/bj1.png');
-  }
-}
-
-.dustWarn {
-  --image-border: url('/@/assets/images/fire/border.png');
-  --image-no-choice: url('/@/assets/images/fire/no-choice.png');
-  --image-choice: url('/@/assets/images/fire/choice.png');
-  --image-dust-choice: url('/@/assets/images/fire/dust-choice.png');
-  --image-dust-content: url('/@/assets/images/fire/dust-content.png');
-  --image-dust-choice1: url('/@/assets/images/fire/dust-choice1.png');
-  --image-dust-content: url('/@/assets/images/fire/dust-content.png');
-  --image-bj1: url('/@/assets/images/fire/bj1.png');
-  width: 100%;
-  height: 100%;
-  padding: 80px 10px 15px 10px;
-  box-sizing: border-box;
-
-  .top-dust {
-    display: flex;
-    justify-content: space-between;
-    height: 50%;
-    margin-bottom: 15px;
-    background: var(--image-border) no-repeat center;
-    background-size: 100% 100%;
-
-    .alarm-menu {
-      height: 100%;
-      width: 15%;
-      padding: 10px;
-      box-sizing: border-box;
+    --image-border: url('/@/assets/images/fire/border.png');
+    --image-no-choice: url('/@/assets/images/fire/no-choice.png');
+    --image-choice: url('/@/assets/images/fire/choice.png');
+    --image-dust-choice: url('/@/assets/images/fire/dust-choice.png');
+    --image-dust-content: url('/@/assets/images/fire/dust-content.png');
+    --image-dust-choice1: url('/@/assets/images/fire/dust-choice1.png');
+    --image-dust-content: url('/@/assets/images/fire/dust-content.png');
+    --image-bj1: url('/@/assets/images/fire/bj1.png');
+    width: 100%;
+    height: 100%;
+    padding: 80px 10px 15px 10px;
+    box-sizing: border-box;
 
-      .card-btn {
-        width: 100%;
-        height: 100%;
-        overflow-y: auto;
-
-        .btn {
-          position: relative;
-          width: 81%;
-          height: 24%;
-          margin-bottom: 6%;
-          font-family: 'douyuFont';
-          background: var(--image-no-choice) no-repeat;
-          background-size: 100% 100%;
-          cursor: pointer;
-
-          .text {
-            width: 80%;
-            position: absolute;
-            left: 50%;
-            top: 28px;
-            font-size: 14px;
-            color: var(--vent-table-action-link);
-            text-align: center;
-            transform: translate(-50%, 0);
-          }
+    .top-dust {
+      display: flex;
+      justify-content: space-between;
+      height: 50%;
+      margin-bottom: 15px;
+      background: var(--image-border) no-repeat center;
+      background-size: 100% 100%;
 
-          .warn {
-            width: 100%;
-            position: absolute;
-            left: 50%;
-            bottom: 11px;
-            font-size: 12px;
-            color: #fff;
-            text-align: center;
-            transform: translate(-50%, 0);
-          }
-        }
+      .alarm-menu {
+        height: 100%;
+        width: 15%;
+        padding: 10px;
+        box-sizing: border-box;
 
-        .btn1 {
-          position: relative;
+        .card-btn {
           width: 100%;
-          height: 24%;
-          margin-bottom: 6%;
-          font-family: 'douyuFont';
-          background: var(--image-choice) no-repeat;
-          background-size: 100% 100%;
-          cursor: pointer;
-
-          .text {
-            width: 80%;
-            position: absolute;
-            left: 50%;
-            top: 28px;
-            font-size: 14px;
-            color: var(--vent-table-action-link);
-            text-align: center;
-            transform: translate(-62%, 0);
+          height: 100%;
+          overflow-y: auto;
+
+          .btn {
+            position: relative;
+            width: 81%;
+            height: 24%;
+            margin-bottom: 6%;
+            font-family: 'douyuFont';
+            background: var(--image-no-choice) no-repeat;
+            background-size: 100% 100%;
+            cursor: pointer;
+
+            .text {
+              width: 80%;
+              position: absolute;
+              left: 50%;
+              top: 28px;
+              font-size: 14px;
+              color: var(--vent-table-action-link);
+              text-align: center;
+              transform: translate(-50%, 0);
+            }
+
+            .warn {
+              width: 100%;
+              position: absolute;
+              left: 50%;
+              bottom: 11px;
+              font-size: 12px;
+              color: #fff;
+              text-align: center;
+              transform: translate(-50%, 0);
+            }
           }
 
-          .warn {
+          .btn1 {
+            position: relative;
             width: 100%;
-            position: absolute;
-            left: 50%;
-            bottom: 11px;
-            font-size: 14px;
-            color: #fff;
-            text-align: center;
-            transform: translate(-60%, 0);
+            height: 24%;
+            margin-bottom: 6%;
+            font-family: 'douyuFont';
+            background: var(--image-choice) no-repeat;
+            background-size: 100% 100%;
+            cursor: pointer;
+
+            .text {
+              width: 80%;
+              position: absolute;
+              left: 50%;
+              top: 28px;
+              font-size: 14px;
+              color: var(--vent-table-action-link);
+              text-align: center;
+              transform: translate(-62%, 0);
+            }
+
+            .warn {
+              width: 100%;
+              position: absolute;
+              left: 50%;
+              bottom: 11px;
+              font-size: 14px;
+              color: #fff;
+              text-align: center;
+              transform: translate(-60%, 0);
+            }
           }
         }
       }
-    }
-
-    .dust-content {
-      display: flex;
-      justify-content: space-between;
-      height: 100%;
-      width: 85%;
-      padding: 10px 0px;
-      box-sizing: border-box;
 
-      .content-left {
-        width: 280px;
-        height: 100%;
+      .dust-content {
         display: flex;
-        flex-direction: column;
-        // justify-content: space-around;
-        align-items: flex-start;
-        overflow-y: auto;
-        overflow-x: hidden;
-
-        .content-left-item {
-          position: relative;
-          width: 272px;
-          height: 173px;
-          flex-shrink: 0;
-          background: var(--image-dust-choice) no-repeat center;
-          background-size: 100% 100%;
-          margin: 5px 0px;
-
-          .content-title {
-            width: 85%;
-            position: absolute;
-            top: 2px;
-            left: 50%;
-            transform: translate(-55%, 0);
-            font-size: 14px;
-            color: #fff;
-            text-align: center;
-          }
+        justify-content: space-between;
+        height: 100%;
+        width: 85%;
+        padding: 10px 0px;
+        box-sizing: border-box;
 
-          .content-items {
-            position: absolute;
-            left: 50%;
-            transform: translate(-54%, 0);
-            display: flex;
-            justify-content: space-between;
-            align-items: center;
-            width: 240px;
-            height: 26px;
-            color: #fff;
-            font-size: 14px;
-            padding: 0px 5px;
-            box-sizing: border-box;
-            background: var(--image-dust-content) no-repeat center;
+        .content-left {
+          width: 280px;
+          height: 100%;
+          display: flex;
+          flex-direction: column;
+          // justify-content: space-around;
+          align-items: flex-start;
+          overflow-y: auto;
+          overflow-x: hidden;
+
+          .content-left-item {
+            position: relative;
+            width: 272px;
+            height: 173px;
+            flex-shrink: 0;
+            background: var(--image-dust-choice) no-repeat center;
             background-size: 100% 100%;
-
-            &:nth-child(2) {
-              top: 32px;
+            margin: 5px 0px;
+
+            .content-title {
+              width: 85%;
+              position: absolute;
+              top: 2px;
+              left: 50%;
+              transform: translate(-55%, 0);
+              font-size: 14px;
+              color: #fff;
+              text-align: center;
             }
 
-            &:nth-child(3) {
-              top: 67px;
+            .content-items {
+              position: absolute;
+              left: 50%;
+              transform: translate(-54%, 0);
+              display: flex;
+              justify-content: space-between;
+              align-items: center;
+              width: 240px;
+              height: 26px;
+              color: #fff;
+              font-size: 14px;
+              padding: 0px 5px;
+              box-sizing: border-box;
+              background: var(--image-dust-content) no-repeat center;
+              background-size: 100% 100%;
+
+              &:nth-child(2) {
+                top: 32px;
+              }
+
+              &:nth-child(3) {
+                top: 67px;
+              }
+
+              &:nth-child(4) {
+                top: 102px;
+              }
+
+              &:nth-child(5) {
+                top: 136px;
+              }
             }
+          }
 
-            &:nth-child(4) {
-              top: 102px;
+          .content-left-item1 {
+            position: relative;
+            width: 250px;
+            height: 173px;
+            flex-shrink: 0;
+            background: var(--image-dust-choice1) no-repeat center;
+            background-size: 100% 100%;
+            margin: 5px 0px;
+
+            .content-title {
+              width: 85%;
+              position: absolute;
+              top: 2px;
+              left: 50%;
+              transform: translate(-50%, 0);
+              font-size: 14px;
+              color: #fff;
+              text-align: center;
             }
 
-            &:nth-child(5) {
-              top: 136px;
+            .content-items {
+              position: absolute;
+              left: 50%;
+              transform: translate(-54%, 0);
+              display: flex;
+              justify-content: space-between;
+              align-items: center;
+              width: 215px;
+              height: 26px;
+              color: #fff;
+              font-size: 14px;
+              padding: 0px 5px;
+              box-sizing: border-box;
+              background: var(--image-dust-content) no-repeat center;
+              background-size: 100% 100%;
+
+              &:nth-child(2) {
+                top: 32px;
+              }
+
+              &:nth-child(3) {
+                top: 67px;
+              }
+
+              &:nth-child(4) {
+                top: 102px;
+              }
+
+              &:nth-child(5) {
+                top: 136px;
+              }
             }
           }
         }
 
-        .content-left-item1 {
-          position: relative;
-          width: 250px;
-          height: 173px;
-          flex-shrink: 0;
-          background: var(--image-dust-choice1) no-repeat center;
-          background-size: 100% 100%;
-          margin: 5px 0px;
-
-          .content-title {
-            width: 85%;
-            position: absolute;
-            top: 2px;
-            left: 50%;
-            transform: translate(-50%, 0);
-            font-size: 14px;
-            color: #fff;
-            text-align: center;
-          }
+        .content-right {
+          width: calc(100% - 280px);
+          height: 100%;
 
-          .content-items {
-            position: absolute;
-            left: 50%;
-            transform: translate(-54%, 0);
+          .title-t {
+            height: 30px;
+            margin-bottom: 10px;
             display: flex;
             justify-content: space-between;
             align-items: center;
-            width: 215px;
-            height: 26px;
-            color: #fff;
-            font-size: 14px;
-            padding: 0px 5px;
-            box-sizing: border-box;
-            background: var(--image-dust-content) no-repeat center;
-            background-size: 100% 100%;
-
-            &:nth-child(2) {
-              top: 32px;
-            }
-
-            &:nth-child(3) {
-              top: 67px;
-            }
-
-            &:nth-child(4) {
-              top: 102px;
-            }
 
-            &:nth-child(5) {
-              top: 136px;
+            .text-t {
+              font-family: 'douyuFont';
+              font-size: 14px;
+              color: #fff;
             }
           }
-        }
-      }
-
-      .content-right {
-        width: calc(100% - 280px);
-        height: 100%;
-
-        .title-t {
-          height: 30px;
-          margin-bottom: 10px;
-          display: flex;
-          justify-content: space-between;
-          align-items: center;
 
-          .text-t {
-            font-family: 'douyuFont';
-            font-size: 14px;
-            color: #fff;
+          .echart-boxd {
+            width: 100%;
+            height: calc(100% - 40px);
           }
         }
 
-        .echart-boxd {
+        .content-right1 {
           width: 100%;
-          height: calc(100% - 40px);
-        }
-      }
-
-      .content-right1 {
-        width: 100%;
-        height: 100%;
+          height: 100%;
 
-        .title-t {
-          height: 30px;
-          margin-bottom: 10px;
-          display: flex;
-          justify-content: space-between;
-          align-items: center;
+          .title-t {
+            height: 30px;
+            margin-bottom: 10px;
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
 
-          .text-t {
-            font-family: 'douyuFont';
-            font-size: 14px;
-            color: #fff;
+            .text-t {
+              font-family: 'douyuFont';
+              font-size: 14px;
+              color: #fff;
+            }
           }
-        }
 
-        .echart-boxd {
-          width: 100%;
-          height: calc(100% - 40px);
+          .echart-boxd {
+            width: 100%;
+            height: calc(100% - 40px);
+          }
         }
       }
     }
-  }
 
-  .bot-dust {
-    height: calc(50% - 15px);
-    background: var(--image-border) no-repeat center;
-    background-size: 100% 100%;
-    padding: 10px;
-    box-sizing: border-box;
-
-    .bot-area {
-      height: 100%;
-      padding: 10px;
-      background: var(--image-bj1) no-repeat center;
+    .bot-dust {
+      height: calc(50% - 15px);
+      background: var(--image-border) no-repeat center;
       background-size: 100% 100%;
+      padding: 10px;
       box-sizing: border-box;
+
+      .bot-area {
+        height: 100%;
+        padding: 10px;
+        background: var(--image-bj1) no-repeat center;
+        background-size: 100% 100%;
+        box-sizing: border-box;
+      }
     }
   }
-}
 </style>

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

@@ -45,7 +45,7 @@
         size="small"
         style="position: absolute; z-index: 99; left: 102px; width: 150px; top: 2px"
       />
-      <template v-if="globalConfig.History_Type == 'vent'">
+      <template v-if="stationType != 'redis'">
         <a-date-picker
           v-model:value="historyParams.ttime_begin"
           valueFormat="YYYY-MM-DD HH:mm:ss"
@@ -72,7 +72,7 @@
           <a-select-option value="1">1秒</a-select-option>
           <a-select-option value="2">5秒</a-select-option>
           <a-select-option value="3">10秒</a-select-option>
-          <a-select-option value="4">30分钟</a-select-option>
+          <a-select-option value="4">30秒</a-select-option>
           <a-select-option value="5">1分钟</a-select-option>
           <a-select-option value="6">10分钟</a-select-option>
           <a-select-option value="7">30分钟</a-select-option>
@@ -202,7 +202,6 @@
       const currentPage = ref<number>(1);
       const pageSize = ref<number>(20);
       const total = ref(0);
-
       const echartsOption = {
         grid: {
           top: '60px',
@@ -271,6 +270,7 @@
             const device = options.value.find((device) => device['deviceID'] === newDeviceId);
             if (device) {
               let res;
+              stationType.value = device['stationtype'];
               if (device['stationtype'] !== 'redis') {
                 resultXAxisPropType.value = 'ttime';
                 historyList = (params) => defHttp.get({ url: '/safety/ventanalyMonitorData/listdays', params });
@@ -363,6 +363,7 @@
         echartsOption2,
         onChange,
         globalConfig,
+        stationType,
       };
     },
   });

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

@@ -36,6 +36,7 @@
   import dayjs from 'dayjs';
   import { getAutoScrollContainer } from '/@/utils/common/compUtils';
   import { render } from '/@/utils/common/renderUtils';
+  import { useMethods } from '/@/hooks/system/useMethods';
 
   const globalConfig = inject('globalConfig');
   const props = defineProps({
@@ -77,7 +78,6 @@
       default: () => [],
     },
   });
-
   const getDeviceListApi = (params) => defHttp.post({ url: '/monitor/device', params });
   const historyTable = ref();
   const loading = ref(false);
@@ -110,6 +110,8 @@
   const tableScroll = props.scroll.y ? ref({ y: props.scroll.y - 100 }) : ref({});
   let deviceOptions = ref([]);
   const deviceTypeStr = ref('');
+  const deviceTypeName = ref('');
+  const deviceType = ref('');
   loading.value = true;
 
   watch(
@@ -203,6 +205,10 @@
         } 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) {
@@ -210,6 +216,10 @@
         } 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({
@@ -222,6 +232,10 @@
       } 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'];
+      }
     }
 
     if (result) {
@@ -236,10 +250,13 @@
           stationtype: item['stationtype'],
         };
       });
+
       stationType.value = deviceOptions.value[0]['stationtype'];
       historyType.value = deviceOptions.value[0]['strtype'] || deviceOptions.value[0]['devicekind'];
     }
-    await getForm().setFieldsValue({ gdeviceid: props.deviceId ? props.deviceId : deviceOptions.value[0] ? deviceOptions.value[0]['value'] : '' });
+    await getForm().setFieldsValue({
+      gdeviceids: props.deviceId ? [props.deviceId] : deviceOptions.value[0] ? [deviceOptions.value[0]['value']] : [''],
+    });
   }
 
   function resetFormParam() {
@@ -266,7 +283,7 @@
         column: pagination['createTime'],
         startTime: formData['ttime_begin'],
         endTime: formData['ttime_end'],
-        deviceId: formData['gdeviceid'],
+        deviceId: formData['gdeviceids'],
         strtype: props.deviceType + '*',
         sysId: props.sysId,
         interval: intervalMap.get(formData['skip']) ? intervalMap.get(formData['skip']) : '1h',
@@ -361,15 +378,17 @@
                 },
                 {
                   label: computed(() => `${deviceKide.value.startsWith('location') ? '查询人员' : '查询设备'}`),
-                  field: 'gdeviceid',
+                  field: 'gdeviceids',
                   component: 'Select',
-                  defaultValue: props.deviceId ? props.deviceId : deviceOptions.value[0] ? deviceOptions.value[0]['value'] : '',
+                  defaultValue: props.deviceId ? [props.deviceId] : deviceOptions.value[0] ? [deviceOptions.value[0]['value']] : [''],
                   required: true,
                   componentProps: {
                     showSearch: true,
                     filterOption: (input: string, option: any) => {
                       return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0;
                     },
+                    mode: 'multiple',
+                    maxTagCount: 'responsive',
                     options: deviceOptions,
                     onChange: (e, option) => {
                       if (option && (option['strinstallpos'] || option['strtype'] || option['devicekind']))

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

@@ -17,8 +17,11 @@
         <slot name="filterCell" v-bind="{ column, record }"></slot>
       </template>
       <template #action="{ record }">
-          <slot name="action" v-bind="{ record }"></slot>
-        </template>
+        <slot name="action" v-bind="{ record }"></slot>
+      </template>
+      <template #form-submitBefore>
+        <slot name="submitBefore"></slot>
+      </template>
     </BasicTable>
   </div>
 </template>
@@ -134,6 +137,7 @@
     },
   });
   const [registerTable, { reload, setLoading, setSelectedRowKeys, getSelectRowKeys, getForm, setPagination }, { rowSelection, selectedRowKeys,  }] = tableContext;
+  
   watch(
     () => {
       return props.dataSource;
@@ -156,32 +160,32 @@
       immediate: true
     }
   );
-   watch(
-    () => {
-      return props.columnsType;
-    },
-    (newVal) => {
-      console.log(newVal,'val-----')
-      if(!newVal) return
-      const column =  getTableHeaderColumns(newVal.endsWith('_monitor') ? newVal : newVal+'_monitor')
-      console.log('监测列表表头000------------>', newVal)
-      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]+'_monitor');
-      }else{
-        columns.value = column
-      }
-    },
-    {
-      immediate: true
+  watch(
+  () => {
+    return props.columnsType;
+  },
+  (newVal) => {
+    console.log(newVal,'val-----')
+    if(!newVal) return
+    const column =  getTableHeaderColumns(newVal.endsWith('_monitor') ? newVal : newVal+'_monitor')
+    console.log('监测列表表头000------------>', newVal)
+    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]+'_monitor');
+    }else{
+      columns.value = column
     }
+  },
+  {
+    immediate: true
+  }
   );
 
   watch(() => props.scroll.y, (newVal) => {

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

@@ -15,8 +15,8 @@ enum Api {
   exportXlsUrl = '/monitor/exportXls',
   queryNowGasInsInfo = '/safety/gasDayReport/queryNowGasInsInfo', //查询当前各班瓦斯巡检信息
   queryNowGasSta = '/safety/gasDayReport/queryNowGasSta',
-   queryReportData='/safety/reportLocalData/queryReportData',//查询瓦斯日报列表
-   getDeviceListBySubId = '/safety/ventanalyDeviceInfo/getDeviceListBySubId',//查询分站
+  queryReportData = '/safety/reportLocalData/queryReportData', //查询瓦斯日报列表
+  getDeviceListBySubId = '/safety/ventanalyDeviceInfo/getDeviceListBySubId', //查询分站
 }
 //分站全部列表
 export const getListAll = () => defHttp.post({ url: Api.getDeviceListBySubId });
@@ -54,4 +54,4 @@ export const queryNowGasSta = (params) => defHttp.post({ url: Api.queryNowGasSta
  * 瓦斯日报列表
  * @param params
  */
-export const queryReportData = (params) => defHttp.post({ url: Api.queryReportData,params },);
+export const queryReportData = (params) => defHttp.post({ url: Api.queryReportData, params });

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

@@ -66,6 +66,7 @@ export function getMonitorComponent() {
     case 'sdmtjtbetmk': //布尔台
       FiberModal = defineAsyncComponent(() => import('./modal/fiber.modal-Gx.vue'));
       break;
+    case 'hnjmypmk': //崖坪 华宁焦煤
     case 'sdmtjtyjlmk': //榆家梁
     case 'sdmtjtcctmk': //榆家梁
     case 'sdmtjtswmk': //上湾
@@ -546,7 +547,15 @@ export const noWarningArr = [
 ]; // 无预警详情的
 export const haveSysDetailArr = ['forcFan', 'pulping']; //有场景详情的
 // export const haveSysDetailArr = ['']; //有场景详情的
-
+// 无定位
+export const noLocationArr = () => {
+  const { sysOrgCode } = useGlobSetting();
+  if (sysOrgCode === 'sdmtjtcctrk') {
+    return ['location', 'vehicle'];
+  } else {
+    return [];
+  }
+};
 export const noHistoryArr = () =>
   History_Type['type'] == 'remote'
     ? ['surface_history', 'majorpath', 'gasDayReport', 'dustDayReport', 'bundleDayReport', 'bundleSpyDayReport', 'gasDay', 'gate_linkdlfm']

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

@@ -282,7 +282,7 @@
                 :scroll="{ y: scroll.y - 110 }"
                 style="margin-top: 60px"
               >
-                <template #action="{ record }">
+                <template v-if="!noLocationList.includes('location')" #action="{ record }">
                   <TableAction
                     :actions="[
                       {
@@ -307,7 +307,7 @@
                 :form-config="vehicleFormConfig"
                 :scroll="{ y: scroll.y - 110 }"
               >
-                <template #action="{ record }">
+                <template v-if="!noLocationList.includes('location')" #action="{ record }">
                   <TableAction
                     :actions="[
                       {
@@ -319,7 +319,7 @@
                 </template>
               </MonitorTable>
             </template>
-            <template v-else-if="deviceType.startsWith('gasmonitor') && activeKey == '1'">
+            <!-- <template v-else-if="deviceType.startsWith('gasmonitor') && activeKey == '1'">
               <MonitorTable
                 ref="monitorTable"
                 :columnsType="`${deviceType}_monitor`"
@@ -359,7 +359,7 @@
                   </a-tag>
                 </template>
               </MonitorTable>
-            </template>
+            </template> -->
             <!-- 瓦斯人工巡检 -->
             <template v-else-if="deviceType.startsWith('gasDay_normal') && activeKey == '1'">
               <gaspatrolTable :tableData="gaspatrolData" @getSearch="getSearch" @locate="goLocation"></gaspatrolTable>
@@ -645,6 +645,7 @@
     noHistoryArr,
     getMonitorComponent,
     vehicleFormConfig,
+    noLocationArr,
   } from './device.data';
   import mainPath from './modal/mainPath.vue';
   import { formConfig } from '../../../safetyMonitor/safety.data';
@@ -657,25 +658,11 @@
   import { useGo } from '/@/hooks/web/usePage';
   import { useGlobSetting } from '/@/hooks/setting';
 
-  //瓦斯巡检查询参数
-  const addressData = ref(''); //巡检地点
-  const personData = ref(''); //巡检员
-  const instypeData = ref('2'); //巡检类型
-  const classData = ref('night'); //巡检班次
-  const gaspatrolData = ref<any[]>([]);
-  const inspectJd = ref<any>('');
-  const inspectList = reactive<any[]>([
-    { label: '第一次巡检已检数', val: 0 },
-    { label: '第一次巡检未检数', val: 0 },
-    { label: '第二次巡检已检数', val: 0 },
-    { label: '第二次巡检未检数', val: 0 },
-  ]);
-  const stationData = ref<any[]>([]);
+  type DeviceType = { deviceType: string; deviceName: string; datalist: any[] };
   const glob = useGlobSetting();
   // import { BorderBox8 as DvBorderBox8 } from '@kjgl77/datav-vue3';
 
   const { FiberModal, BundleModal, DustModal, BallvalveModal, AtomizingModal, GaspatrolModal, WisdomBallModal } = getMonitorComponent();
-  type DeviceType = { deviceType: string; deviceName: string; datalist: any[] };
 
   const props = defineProps({
     pageData: {
@@ -698,20 +685,13 @@
     },
   };
   const router = useRouter();
-
   const actions = getActions();
-  // actions.setGlobalState({ pageObj: { pageType: 'home' } });
   const locationForm = reactive({
     strname: '',
     department: '',
     stationname: '',
   });
-
-  const safetymonitorForm = reactive({
-    dataTypeName: '',
-    strinstallpos: '',
-  });
-
+  const noLocationList = noLocationArr();
   const monitorTable = ref();
   const historyTable = ref();
   const alarmHistoryTable = ref();
@@ -748,6 +728,20 @@
   const treeData = ref<TreeProps['treeData']>([]);
   let departmentInfo: Null | Object = null;
   let startMonitorTimer = 0;
+  //瓦斯巡检查询参数
+  const addressData = ref(''); //巡检地点
+  const personData = ref(''); //巡检员
+  const instypeData = ref('2'); //巡检类型
+  const classData = ref('night'); //巡检班次
+  const gaspatrolData = ref<any[]>([]);
+  const inspectJd = ref<any>('');
+  const inspectList = reactive<any[]>([
+    { label: '第一次巡检已检数', val: 0 },
+    { label: '第一次巡检未检数', val: 0 },
+    { label: '第二次巡检已检数', val: 0 },
+    { label: '第二次巡检未检数', val: 0 },
+  ]);
+  const stationData = ref<any[]>([]);
   let searchReportParam = ref('gasDayNight'); //瓦斯日报查询条件-非布尔台
   let searchReportParam1 = ref('gasDay1'); //瓦斯日报查询条件-布尔台
   let reportTableData = ref<any[]>([]); //瓦斯日报列表数据
@@ -1121,14 +1115,14 @@
     console.log(res, '瓦斯日报列表');
     reportTableData.value = JSON.parse(res.content) || [];
   }
-
+  // 详情跳转
   function goDetail(record?) {
     if (record) {
       activeID.value = record.deviceID;
       if (deviceType.value.startsWith('fiber')) {
         currentModal.value = FiberModal;
         modalVisible.value = true;
-      }else if (deviceType.value.startsWith('dusting')) {
+      } else if (deviceType.value.startsWith('dusting')) {
         currentModal.value = DustModal;
         modalVisible.value = true;
       } else if (deviceType.value.startsWith('bundletube')) {
@@ -1367,26 +1361,6 @@
       message.success('设置成功');
     }, 600);
   }
-
-  // function clearMonitor() {
-  //   clearTimeout(timer);
-  //   timer = undefined;
-  //   if (startMonitorTimer) {
-  //     clearTimeout(startMonitorTimer);
-  //   }
-  //   dataSource.value = [];
-  //   startMonitorTimer = setTimeout(() => {
-  //     expandedKeys.value = keys;
-  //     selectedKeys.value = keys;
-  //     treeNodeTitle.value = e.node.title;
-  //     activeKey.value = '1';
-  //     timer = null;
-  //     if (e.node.children?.length < 1) {
-  //       getMonitor(true);
-  //     }
-  //   }, 1000);
-  // }show
-
   watch(
     () => props.pageData,
     async (pageObj) => {

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

@@ -0,0 +1,406 @@
+<template>
+  <BasicModal v-bind="$attrs" @register="register" :title="`光纤测温详情    ${currentTime}`" width="1200px" @ok="handleOk" @cancel="handleCancel">
+    <div class="fiber-modal">
+      <div class="modal-left">
+        <div
+          v-for="device in deviceList"
+          class="link-item"
+          :class="{ 'active-device-title': device.deviceID === activeDeviceID }"
+          :key="device.deviceID"
+        >
+          <span class="" @click="selectDevice(device.deviceID)">{{ device.strinstallpos }}</span>
+        </div>
+      </div>
+      <div class="modal-right">
+        <div class="right-top">
+          <div class="top-item">
+            <div class="icon">
+              <SvgIcon class="icon-style max-temperature" size="38" name="max-temperature" />
+            </div>
+            <div class="item-container">
+              <div class="title">最高温度</div>
+              <div class="value">{{ posMonitor.fmax || '--' }} <span>℃</span> </div>
+            </div>
+          </div>
+          <div class="top-item">
+            <div class="icon">
+              <SvgIcon class="icon-style min-temperature" size="38" name="min-temperature" />
+            </div>
+            <div class="item-container">
+              <div class="title">最低温度</div>
+              <div class="value">{{ posMonitor.fmin || '--' }} <span>℃</span></div>
+            </div>
+          </div>
+          <div class="top-item">
+            <div class="icon">
+              <SvgIcon class="icon-style aveg-temperature" size="38" name="aveg-temperature" />
+            </div>
+            <div class="item-container">
+              <div class="title">平均温度</div>
+              <div class="value">{{ posMonitor.favg || '--' }} <span>℃</span></div>
+            </div>
+          </div>
+          <div class="top-item warning-box">
+            <div class="icon">
+              <SvgIcon class="icon-style" size="38" name="risk-level" />
+            </div>
+            <div class="item-container">
+              <div class="title">风险等级</div>
+              <div class="warning-value">低风险</div>
+            </div>
+          </div>
+        </div>
+        <div class="right-bottom">
+          <span class="base-title">测点监测曲线</span>
+          <div class="echarts-box">
+            <BarAndLine xAxisPropType="pos" :dataSource="posList" height="100%" :chartsColumns="chartsColumns" :option="echatsOption" />
+          </div>
+        </div>
+      </div>
+    </div>
+  </BasicModal>
+</template>
+<script lang="ts">
+  import { defineComponent, ref, watch, shallowRef, reactive } from 'vue';
+  import { BasicModal, useModalInner } from '/@/components/Modal';
+  import BarAndLine from '/@/components/chart/BarAndLine.vue';
+  import { SvgIcon } from '/@/components/Icon';
+  import { Decoration7 as DvDecoration7, ScrollBoard as DvScrollBoard } from '@kjgl77/datav-vue3';
+  import dayjs from 'dayjs';
+  import { forIn } from 'lodash-es';
+
+  export default defineComponent({
+    components: { BasicModal, BarAndLine, SvgIcon, DvScrollBoard, DvDecoration7 },
+    props: {
+      dataSource: { type: Array },
+      activeID: { type: String },
+    },
+    setup(props) {
+      const currentTime = ref(dayjs().format('YYYY-MM-DD HH:mm:ss'));
+      const modelRef = ref({});
+      const loading = ref(true);
+      const activeDeviceID = ref<any>('');
+      const deviceList = ref<any[]>([]);
+      // const posList = reactive<any[]>([]);
+      const posList = ref<any[]>([]);
+      const posMonitor = shallowRef({});
+
+      const echatsOption = {
+        grid: {
+          top: '10%',
+          left: '2px',
+          right: '10px',
+          bottom: '3%',
+          containLabel: true,
+        },
+        toolbox: {
+          feature: {},
+        },
+      };
+
+      const chartsColumns = [
+        {
+          legend: '温度',
+          seriesName: '(℃)',
+          ymax: 100,
+          yname: '℃',
+          linetype: 'line',
+          yaxispos: 'left',
+          color: '#FDB146',
+          sort: 1,
+          xRotate: 0,
+          dataIndex: 'value',
+        },
+      ];
+
+      const [register, { setModalProps, closeModal }] = useModalInner();
+
+      function handleVisibleChange(visible) {
+        if (visible) {
+          loading.value = true;
+          setModalProps({ loading: true, confirmLoading: true });
+
+          setTimeout(() => {
+            loading.value = false;
+            setModalProps({ loading: false, confirmLoading: false });
+          }, 1000);
+        }
+      }
+
+      // 选择监测
+      function selectDevice(id) {
+        loading.value = true;
+        setModalProps({ loading: true, confirmLoading: true });
+        setTimeout(() => {
+          loading.value = false;
+          activeDeviceID.value = id;
+          setModalProps({ loading: false, confirmLoading: false });
+        }, 300);
+      }
+
+      function handleOk(e) {
+        e.preventDefault();
+        closeModal();
+      }
+
+      function handleCancel(e) {
+        e.preventDefault();
+        closeModal();
+      }
+
+      watch([() => props.dataSource, () => props.activeID], ([newDataSource, newActiveID], [oldDataSource, oldActiveID]) => {
+        console.log(newDataSource, 'newDataSource--------------');
+        deviceList.value = newDataSource as any[];
+        if (newActiveID != oldActiveID) {
+          activeDeviceID.value = newActiveID as string;
+        }
+        // activeDeviceID.value = activeDeviceID.value ? activeDeviceID.value : newActiveID;
+        newDataSource?.forEach((item: any, index) => {
+          if ((!activeDeviceID.value && index == 0) || item.deviceID === activeDeviceID.value) {
+            posMonitor.value = item.readData;
+            const posArr: any[] = [];
+            forIn(item.readData, (key, value) => {
+              if (key.startsWith('TemDataPoints')) {
+                const index = Number(key.split('_')[0].split('TemDataPoints')[1]);
+                if (!posArr[index]) posArr[index] = value;
+              }
+            });
+            posMonitor.value['fmax'] = Math.max(...posArr);
+            posMonitor.value['fmin'] = Math.min(...posArr);
+            posMonitor.value['favg'] = posArr.reduce((a, b) => a + b, 0) / posArr.length;
+            const posListTemp: { pos: string; value: any }[] = [];
+            posArr.forEach((item, index) => {
+              if (item) {
+                posListTemp.push({ pos: '测点' + index, value: item });
+              }
+            });
+            posList.value = posListTemp;
+          }
+        });
+      });
+
+      return {
+        register,
+        model: modelRef,
+        currentTime,
+        handleVisibleChange,
+        selectDevice,
+        handleOk,
+        handleCancel,
+        deviceList,
+        activeDeviceID,
+        posMonitor,
+        echatsOption,
+        chartsColumns,
+        posList,
+      };
+    },
+  });
+</script>
+<style lang="less" scoped>
+  .fiber-modal {
+    width: 100%;
+    height: 650px;
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+
+    .modal-left {
+      width: 200px;
+      height: 100%;
+      overflow-y: auto;
+      background: #ffffff11;
+      padding: 5px;
+      border-radius: 5px;
+
+      .active-device-title {
+        color: aqua;
+      }
+
+      .link-item {
+        position: relative;
+        cursor: pointer;
+        line-height: 30px;
+        padding-left: 30px;
+
+        span:hover {
+          color: #89ffff;
+        }
+
+        &::after {
+          content: '';
+          position: absolute;
+          display: block;
+          width: 8px;
+          height: 8px;
+          top: 12px;
+          left: 10px;
+          transform: rotateZ(45deg) skew(10deg, 10deg);
+          background: #45d3fd;
+        }
+      }
+    }
+
+    .modal-right {
+      width: calc(100% - 220px);
+      overflow-y: auto;
+
+      .base-title {
+        line-height: 32px;
+        position: relative;
+        padding-left: 20px;
+
+        &::after {
+          content: '';
+          position: absolute;
+          display: block;
+          width: 4px;
+          height: 12px;
+          top: 4px;
+          left: 10px;
+          background: #45d3fd;
+          border-radius: 4px;
+        }
+      }
+
+      .right-top {
+        display: flex;
+        flex-direction: row;
+        justify-content: space-between;
+        margin-bottom: 10px;
+
+        .top-item {
+          width: 200px;
+          height: 80px;
+          display: flex;
+          flex-direction: row;
+          justify-content: center;
+          border: 1px solid rgba(25, 237, 255, 0.4);
+          box-shadow: inset 0 0 10px rgba(0, 197, 255, 0.6);
+          background: rgba(0, 0, 0, 0.06666666666666667);
+          padding-top: 16px;
+
+          .icon {
+            margin-right: 10px;
+            margin-top: 5px;
+            color: #fdb146;
+          }
+
+          .item-container {
+            width: 100px;
+            display: flex;
+            flex-direction: column;
+            justify-content: center;
+
+            div {
+              text-align: center;
+            }
+
+            .title {
+              font-size: 18px;
+            }
+
+            .value {
+              text-shadow: 0 0 25px #00fbfe;
+              background: linear-gradient(0deg, #45d3fd, #45d3fd, #61ddb1, #61ddb1);
+              font-style: normal;
+              background-size: cover;
+              font-family: electronicFont;
+              font-size: 30px;
+              -webkit-background-clip: text;
+              background-clip: text;
+              -webkit-text-fill-color: transparent;
+              position: relative;
+              top: -8px;
+
+              span {
+                font-family: Arial, Helvetica, sans-serif;
+                font-size: 18px;
+                color: aliceblue;
+              }
+            }
+          }
+        }
+
+        .warning-box {
+          padding-top: 0px;
+
+          .icon {
+            margin-top: 20px;
+
+            .icon-style {
+              color: #fdb146;
+            }
+          }
+
+          .warning-value {
+            font-size: 18px;
+            color: #61ddb1;
+          }
+        }
+      }
+
+      // .right-center {
+      //   margin-top: 20px;
+      //   display: flex;
+      //   flex-direction: row;
+      //   justify-content: space-between;
+
+      //   .table-box {
+      //     position: relative;
+      //     width: 500px;
+      //     height: 250px;
+      //     :deep(.zxm-table-wrapper) {
+      //       height: 220px !important;
+      //       background: #ffffff05 !important;
+      //       border-bottom: 1px solid #91e9fe80 !important;
+      //     }
+      //   }
+
+      //   .warning-box {
+      //     width: calc(100% - 520px);
+
+      //     .warning-container {
+      //       width: 100%;
+      //       height: convert;
+      //       background: #009acd00;
+
+      //       :deep(.dv-scroll-board) {
+      //         .row-item {
+      //           height: 40px !important;
+      //           line-height: 40px !important;
+      //         }
+
+      //         .header-item {
+      //           border-top: 1px solid #91e9fe !important;
+      //           border-bottom: 1px solid #91e9fe !important;
+      //         }
+      //       }
+      //     }
+      //   }
+      // }
+
+      .right-bottom {
+        margin-top: 20px;
+        height: calc(100% - 100px);
+
+        .echarts-box {
+          width: 100%;
+          height: calc(100% - 32px);
+        }
+      }
+    }
+  }
+
+  :deep(.zxm-table-body) {
+    border: 1px solid rgba(57, 232, 255, 0.2) !important;
+
+    .zxm-table-tbody > tr > td {
+      border: none !important;
+    }
+  }
+
+  :deep(.zxm-table-cell) {
+    border-right: none !important;
+  }
+</style>

src/views/vent/monitorManager/gateMonitor/components/AlarmHistoryTableHj.vue

@@ -0,0 +1,179 @@
+<template>
+  <div class="alarm-history-table">
+    <BasicTable ref="alarmHistory" @register="registerTable">
+      <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) }">
+            {{ render.renderDictText(record.nwartype, 'leveltype') || '-' }}
+          </span>
+          <span v-else>
+            {{ render.renderDictText(record[column.dataIndex], column.dict) || '-' }}
+          </span>
+        </template>
+      </template>
+    </BasicTable>
+  </div>
+</template>
+
+<script lang="ts" setup>
+  //ts语法
+  import { watch, ref, defineExpose, inject, onMounted } from 'vue';
+  import { BasicTable, BasicColumn } from '/@/components/Table';
+  import { useListPage } from '/@/hooks/system/useListPage';
+  import { defHttp } from '/@/utils/http/axios';
+  import dayjs from 'dayjs';
+  import { getAutoScrollContainer } from '/@/utils/common/compUtils';
+  import { render } from '/@/utils/common/renderUtils';
+
+  const props = defineProps({
+    scroll: {
+      type: Object,
+      default: { y: 0 },
+    },
+    list: {
+      type: Function,
+      default: (params) => defHttp.get({ url: '/safety/ventanalyAlarmLog/getHZGateAlarmLog', params }),
+    },
+  });
+
+  const alarmHistory = ref();
+  const columns: BasicColumn[] = [
+    {
+      title: '安装地点',
+      dataIndex: 'content',
+      width: 300,
+      align: 'center',
+    },
+    {
+      title: '报警事件',
+      dataIndex: 'createTime',
+      width: 300,
+      align: 'center',
+    },
+  ];
+
+  const tableScroll = props.scroll.y ? ref({ y: props.scroll.y - 100 }) : ref({});
+
+  watch(
+    () => props.scroll.y,
+    (newVal) => {
+      if (newVal) {
+        tableScroll.value = { y: newVal - 100 };
+      } else {
+        tableScroll.value = {};
+      }
+    }
+  );
+
+  // 列表页面公共参数、方法
+  const { tableContext, onExportXls } = useListPage({
+    tableProps: {
+      api: props.list,
+      columns: columns,
+      canResize: true,
+      showTableSetting: false,
+      showActionColumn: false,
+      bordered: false,
+      size: 'small',
+      scroll: tableScroll,
+      showIndexColumn: true,
+      formConfig: {
+        showAdvancedButton: false,
+        // autoAdvancedCol: 2,
+        schemas: [
+          {
+            field: 'createTime_begin',
+            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: 'createTime_end',
+            label: '结束时间',
+            component: 'DatePicker',
+            defaultValue: dayjs(),
+            required: true,
+            componentProps: {
+              showTime: true,
+              valueFormat: 'YYYY-MM-DD HH:mm:ss',
+              getPopupContainer: getAutoScrollContainer,
+            },
+            colProps: {
+              span: 4,
+            },
+          },
+          {
+            label: '查询设备',
+            field: 'deviceid',
+            component: 'Input',
+            colProps: {
+              span: 4,
+            },
+          },
+        ],
+      },
+      fetchSetting: {
+        listField: 'records',
+      },
+      pagination: {
+        current: 1,
+        pageSize: 10,
+        pageSizeOptions: ['10', '30', '50', '100'],
+      },
+    },
+  });
+  //注册table数据
+  const [registerTable, { setLoading }] = tableContext;
+
+  onMounted(async () => {});
+
+  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/gateMonitor/index.vue

@@ -245,22 +245,30 @@
           </a-tab-pane>
           <a-tab-pane key="4" tab="报警历史">
             <div class="tab-item" v-if="activeKey === '4'">
-              <AlarmHistoryTable
-                columns-type="alarm"
-                :device-type="deviceType"
-                :device-list-api="getTableList"
-                designScope="alarm-history"
-                :scroll="scroll"
-              >
-                <template #filterCell="{ column, record }">
-                  <a-tag v-if="column.dataIndex === 'warnFlag'" :color="record.warnFlag == '0' ? 'green' : record.warnFlag == 1 ? '#FF5812' : 'gray'">
-                    {{ record.warnFlag == '0' ? '正常' : record.warnFlag == 1 ? '报警' : record.warnFlag == 2 ? '断开' : '未监测' }}</a-tag
-                  >
-                  <a-tag v-if="column.dataIndex === 'netStatus'" :color="record.netStatus == '0' ? '#f00' : 'green'">{{
-                    record.netStatus == '0' ? '断开' : '连接'
-                  }}</a-tag>
-                </template>
-              </AlarmHistoryTable>
+              <template v-if="sysOrgCode != 'zmhjhzmy'">
+                <AlarmHistoryTable
+                  columns-type="alarm"
+                  :device-type="deviceType"
+                  :device-list-api="getTableList"
+                  designScope="alarm-history"
+                  :scroll="scroll"
+                >
+                  <template #filterCell="{ column, record }">
+                    <a-tag
+                      v-if="column.dataIndex === 'warnFlag'"
+                      :color="record.warnFlag == '0' ? 'green' : record.warnFlag == 1 ? '#FF5812' : 'gray'"
+                    >
+                      {{ record.warnFlag == '0' ? '正常' : record.warnFlag == 1 ? '报警' : record.warnFlag == 2 ? '断开' : '未监测' }}</a-tag
+                    >
+                    <a-tag v-if="column.dataIndex === 'netStatus'" :color="record.netStatus == '0' ? '#f00' : 'green'">{{
+                      record.netStatus == '0' ? '断开' : '连接'
+                    }}</a-tag>
+                  </template>
+                </AlarmHistoryTable>
+              </template>
+              <template v-else>
+                <AlarmHistoryTableHj :scroll="scroll" />
+              </template>
             </div>
           </a-tab-pane>
           <a-tab-pane key="5" tab="操作历史">
@@ -306,6 +314,7 @@
   import HistoryTable from '../comment/HistoryTable.vue';
   import AlarmHistoryTable from '../comment/AlarmHistoryTable.vue';
   import HandlerHistoryTable from '../comment/HandlerHistoryTable.vue';
+  import AlarmHistoryTableHj from './components/AlarmHistoryTableHj.vue';
   import HandleModal from './modal.vue';
   import DeviceBaseInfo from '../comment/components/DeviceBaseInfo.vue';
   import { mountedThree, addMonitorText, play, destroy, setModelType, computePlay, playWindow } from './gate.threejs';
@@ -322,9 +331,10 @@
   import { usePermission } from '/@/hooks/web/usePermission';
   import { getDictItems } from '/@/api/common/api';
   import { render } from '/@/utils/common/renderUtils';
+  import { useGlobSetting } from '/@/hooks/setting';
 
   const { hasPermission } = usePermission();
-
+  const { sysOrgCode } = useGlobSetting();
   const globalConfig = inject('globalConfig');
 
   const { currentRoute } = useRouter();
@@ -985,8 +995,17 @@
     loading.value = true;
     const playerDom = document.getElementById('fm-player1')?.getElementsByClassName('vjs-tech')[0];
     mountedThree(playerDom).then(async () => {
-      await getMonitor(true);
-      loading.value = false;
+      if (sysOrgCode != 'zmhjhzmy') {
+        await getMonitor(true);
+        loading.value = false;
+      } else {
+        // 韩咀无风门设备,只有报警历史数据,无其他数据
+        setModelType('fm1').then(async () => {
+          loading.value = false;
+          dataSource.value = [];
+          addMonitorText(selectData);
+        });
+      }
     });
   });
 

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

@@ -0,0 +1,152 @@
+<!-- eslint-disable vue/multi-word-component-names -->
+<template>
+  <div class="p-10px device-manager-box">
+    <!-- 配置预警设备 -->
+    <a-button class="vent-margin-b-5 mr-5px" type="primary" @click="handleDisplay()">批量下发</a-button>
+    <a-popconfirm title="停止播放" @confirm="handleStop()">
+      <a-button class="vent-margin-b-5 mr-5px" type="primary">批量停止</a-button>
+    </a-popconfirm>
+    <BasicTable @register="registerTable" :rowSelection="rowSelection">
+      <template #operation="{ record }">
+        <a class="action-link" @click="handleChange(record)">切换节目</a>
+        <a class="action-link ml-10px" @click="handleDisplay(record)">下发</a>
+        <a-popconfirm title="停止播放" @confirm="handleStop(record)">
+          <a class="action-link ml-10px">停止播放</a>
+        </a-popconfirm>
+      </template>
+    </BasicTable>
+    <BasicModal title="节目表单" @register="register1" @ok="onSubmit1">
+      <BasicForm @register="registerForm1" />
+    </BasicModal>
+    <BasicModal title="下发内容表单" @register="register2" @ok="onSubmit2">
+      <BasicForm @register="registerForm2" />
+    </BasicModal>
+  </div>
+</template>
+
+<script lang="ts" setup>
+  import { onMounted, nextTick } from 'vue';
+  import { programSchema, displaySchema } from './led.data';
+  // import BaseModal from './BaseModal.vue';
+  import { message } from 'ant-design-vue';
+  import { BasicForm, useForm } from '/@/components/Form';
+  import { BasicModal, useModal } from '/@/components/Modal';
+  import { getTableHeaderColumns } from '/@/hooks/web/useWebColumns';
+  import { BasicTable } from '/@/components/Table';
+  import { useListPage } from '/@/hooks/system/useListPage';
+  import { changeProgram, inputDisplay, list, stopVoice } from './led.api';
+  import { get } from 'lodash-es';
+
+  /** 等待操作的led屏幕列表 */
+  let ledList: any[] = [];
+
+  const [register1, modalContext1] = useModal();
+  const [register2, modalContext2] = useModal();
+  const [registerForm1, formContext1] = useForm({
+    schemas: programSchema,
+    showActionButtonGroup: false,
+  });
+  const [registerForm2, formContext2] = useForm({
+    schemas: displaySchema,
+    showActionButtonGroup: false,
+  });
+  const { tableContext } = useListPage({
+    tableProps: {
+      api: list,
+      showActionColumn: true,
+      actionColumn: {
+        dataIndex: 'operation',
+        title: '操作',
+        width: 120,
+        slots: { customRender: 'operation' },
+      },
+      rowSelection: { type: 'checkbox' },
+      useSearchForm: false,
+      title: 'LED列表',
+    },
+  });
+  const [registerTable, { setColumns, reload, getSelectRows }, { rowSelection }] = tableContext;
+
+  /** 切换节目 */
+  function handleChange(record) {
+    modalContext1.openModal();
+    nextTick(() => {
+      formContext1.setFieldsValue({
+        deviceId: record.deviceId,
+        id: record.other1,
+      });
+      // 根据每个显示屏的节目初始化节目下拉框
+      formContext1.updateSchema({
+        field: 'id',
+        componentProps: {
+          options: get(record, 'programList', []).map((e) => {
+            return {
+              value: e.id,
+              label: e.programName,
+              programType: e.programType,
+            };
+          }),
+        },
+      });
+    });
+  }
+
+  async function onSubmit1() {
+    await formContext1.validateFields();
+    const values = formContext1.getFieldsValue();
+    await changeProgram(values);
+    reload();
+    modalContext1.closeModal();
+  }
+
+  /** 内容下发 */
+  function handleDisplay(record?: any) {
+    if (record) {
+      ledList = [record];
+      modalContext2.openModal();
+      nextTick(() => {
+        formContext2.setFieldsValue(record);
+      });
+    } else {
+      const selection = getSelectRows();
+      if (!selection.length) return message.info('未选择项目');
+
+      ledList = selection;
+      modalContext2.openModal();
+      nextTick(() => {
+        formContext2.resetFields();
+      });
+    }
+  }
+
+  async function onSubmit2() {
+    await formContext2.validateFields();
+    const values = formContext2.getFieldsValue();
+    inputDisplay({
+      deviceIdList: ledList.map((e) => e.deviceId), //设备id,可以传多个
+      ...values,
+    });
+    reload();
+    modalContext2.closeModal();
+  }
+
+  /** 停止播放 */
+  function handleStop(record?: any) {
+    if (record) {
+      ledList = [record];
+    } else {
+      const selection = getSelectRows();
+      if (!selection.length) return message.info('未选择项目');
+
+      ledList = selection;
+    }
+
+    stopVoice({
+      deviceIdList: ledList.map((e) => e.deviceId), //设备id,可以传多个
+    });
+  }
+
+  onMounted(async () => {
+    setColumns(getTableHeaderColumns(`led_list`));
+  });
+</script>

src/views/vent/monitorManager/ledMonitor/led.api.ts

@@ -0,0 +1,25 @@
+import { defHttp } from '/@/utils/http/axios';
+
+enum Api {
+  list = '/safety/ventanalyDeviceInfo/list',
+  changeProgram = '/monitor/voice-alarm/changeProgram',
+  stopVoice = '/monitor/voice-alarm/stopVoice',
+  inputDisplay = '/monitor/voice-alarm/inputDisplay',
+}
+
+/**
+ * 列表接口
+ * @param params
+ */
+export const list = (params) =>
+  defHttp.get({ url: Api.list, params: { strtype: 'led_PH21', ...params } }).then((r) => {
+    r.records.forEach((e) => {
+      const temp = e.deviceId;
+      e.deviceId = e.id;
+      e.id = temp;
+    });
+  });
+
+export const changeProgram = (params) => defHttp.post({ url: Api.changeProgram, params });
+export const stopVoice = (params) => defHttp.post({ url: Api.stopVoice, params });
+export const inputDisplay = (params) => defHttp.post({ url: Api.inputDisplay, params });

src/views/vent/monitorManager/ledMonitor/led.data.ts

@@ -0,0 +1,49 @@
+import { FormSchema } from '/@/components/Table';
+
+export const programSchema: FormSchema[] = [
+  {
+    label: 'ID',
+    field: 'deviceId',
+    component: 'Input',
+    show: false,
+    // colProps: { span: 6 },
+  },
+  {
+    label: '节目',
+    field: 'id',
+    component: 'Select',
+    componentProps: {
+      dictCode: '',
+      placeholder: '请选择设备类型',
+    },
+    // colProps: { span: 6 },
+  },
+];
+
+export const displaySchema: FormSchema[] = [
+  {
+    label: '地点',
+    field: 'content',
+    component: 'Input',
+    componentProps: {
+      placeholder: '请输入地点（少于10字）',
+    },
+    // show({ values }) {
+    //   // 只有循环节目支持下发内容
+    //   return values.programId === 1;
+    // },
+    rules: [{ required: false, message: '文本过长', max: 10 }],
+    // colProps: { span: 6 },
+  },
+  {
+    label: '内容',
+    field: 'describe',
+    component: 'Input',
+    // show({ values }) {
+    //   // 只有循环节目支持下发内容
+    //   return values.programId === 1;
+    // },
+    defaultValue: '发生灾害，请马上撤离！',
+    // colProps: { span: 6 },
+  },
+];

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

@@ -245,9 +245,12 @@
     }}</div>
 
     <div v-if="hasPermission('btn:show')" class="top-box control-group">
-      <template v-for="(item, index) in modalTypeArr.centerBtnArr" :key="index">
-        <div v-if="hasPermission(item.permission)" class="button-box" @click="showModal(item)">{{ item.value }}</div>
-      </template>
+      <div style="width: 100%; display: flex; justify-content: center">
+        <template v-for="(item, index) in modalTypeArr.centerBtnArr" :key="index">
+          <div v-if="hasPermission(item.permission)" class="button-box" @click="showModal(item)">{{ item.value }}</div>
+        </template>
+      </div>
+
       <!-- <div class="button-box" v-for="(item, index) in modalTypeArr.centerBtnArr" :key="index" @click="showModal(item)">{{ item.value }}</div> -->
     </div>
 
@@ -1704,9 +1707,9 @@
   .top-box {
     display: flex !important;
     align-items: center !important;
-    justify-content: space-around !important;
+    // justify-content: space-around !important;
     position: absolute !important;
-    width: 1035px !important;
+    width: 1165px !important;
     height: 75px !important;
     left: 50% !important;
     top: 85px !important;
@@ -2046,7 +2049,6 @@
       width: 334px !important;
     }
   }
-
   .scene-box .bottom-tabs-box {
     height: 280px;
 

src/views/vent/monitorManager/mainFanMonitor/main.data.ts

@@ -812,8 +812,8 @@ export const assistanceData = {
 
 export const setOption = (deviceType?) => {
   let yMax = 4500;
-  const { sysOrgCode } = useGlobSetting();
-  // const sysOrgCode = 'sdmtjtcctrk';
+  // const { sysOrgCode } = useGlobSetting();
+  const sysOrgCode = 'sdmtjtwlmlmk';
   if (sysOrgCode == 'sdmtjtdltmk') {
     // 这里判断白家渠还是五当沟
     if (deviceType == 'fanmain_bjq') {
@@ -841,6 +841,8 @@ export const setOption = (deviceType?) => {
     yMax = 3000;
   } else if (sysOrgCode == 'sdmtjtcctrk') {
     yMax = 600;
+  } else if (sysOrgCode == 'sdmtjtwlmlmk') {
+    yMax = 4000;
   } else {
     yMax = 4500;
   }
@@ -1151,8 +1153,8 @@ export const initData1 = () => {
 
 // 大柳塔武当沟
 export const initData = (deviceType?) => {
-  const { sysOrgCode } = useGlobSetting();
-  // const sysOrgCode = 'sdmtjtcctrk';
+  // const { sysOrgCode } = useGlobSetting();
+  const sysOrgCode = 'sdmtjtwlmlmk';
   if (sysOrgCode == 'sdmtjtdltmk') {
     return initDataDlt(deviceType);
   } else if (sysOrgCode == 'sdmtjtswmk') {
@@ -1171,10 +1173,72 @@ export const initData = (deviceType?) => {
     return initDataJj();
   } else if (sysOrgCode == 'sdmtjtcctrk') {
     return initDataCctr();
+  } else if (sysOrgCode == 'sdmtjtwlmlmk') {
+    return initDataWlml();
   } else {
     return initData1();
   }
 };
+// 乌兰木伦
+const initDataWlml = () => {
+  const data: any[] = [];
+  data.push({
+    angle: -3,
+    Hz: -3,
+    a: -15.607,
+    b: 6242.3,
+    c: -621571,
+    min: 198,
+    max: 220,
+  });
+  data.push({
+    angle: -2,
+    Hz: -2,
+    a: -8.3134,
+    b: 3178.9,
+    c: -300224,
+    min: 198,
+    max: 220,
+  });
+  data.push({
+    angle: 0,
+    Hz: 0,
+    a: -8.9632,
+    b: 3751.3,
+    c: -389068,
+    min: 198,
+    max: 220,
+  });
+  // data.push({
+  //   angle: 1,
+  //   Hz: 1,
+  //   a: -12.77,
+  //   b: 5415.9,
+  //   c: -571193,
+  //   min: 250,
+  //   max: 275,
+  // });
+  // data.push({
+  //   angle: 2,
+  //   Hz: 2,
+  //   a: -12.432,
+  //   b: 5635.5,
+  //   c: -635361,
+  //   min: 272,
+  //   max: 290,
+  // });
+  // data.push({
+  //   angle: 3,
+  //   Hz: 3,
+  //   a: -2.9424,
+  //   b: 1147.7,
+  //   c: -104620,
+  //   min: 290,
+  //   max: 310,
+  // });
+  return data;
+};
+
 // 石圪台
 const initDataCctr = () => {
   const data: any[] = [];

src/views/vent/monitorManager/nitrogen/nitrogen.dataCc_2.ts

@@ -138,11 +138,11 @@ export const preFanMonitorData = [
   },
 ];
 export const totalData = [
-  {
-    title: '总出风管流量',
-    code: 'TotalOutPipeFlow',
-    unit: 'm³/h',
-  },
+  // {
+  //   title: '总出风管流量',
+  //   code: 'TotalOutPipeFlow',
+  //   unit: 'm³/h',
+  // },
   {
     title: '总出风管压力',
     code: 'TotalOutPipePre',

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

@@ -15,6 +15,10 @@
                 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="false"
@@ -101,14 +105,14 @@
   import MonitorTable from '../comment/MonitorTable.vue';
   import HistoryTable from '../comment/HistoryTable.vue';
   import AlarmHistoryTable from '../comment/AlarmHistoryTable.vue';
-  import HandlerHistoryTable from '../comment/HandlerHistoryTable.vue';
   import { list, getTableList } from './sensor.api';
-  import { list as baseList } from '../../deviceManager/sensorTabel/sensor.api';
   import { deviceList } from '../../deviceManager/comment/pointTabel/point.api';
   import { getTableHeaderColumns } from '/@/hooks/web/useWebColumns';
   import { cloneDeep } from 'lodash-es';
-  import customHeader from '/@/components/vent/customHeader.vue';
-
+  import { useMethods } from '/@/hooks/system/useMethods';
+  import { useGlobSetting } from '/@/hooks/setting';
+  const { sysOrgCode } = useGlobSetting();
+  const { exportXlsPostBlob } = useMethods();
   const SensorMonitorRef = ref();
   const deviceBaseList = ref([]);
   const activeKey = ref('1');
@@ -270,6 +274,16 @@
     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();
   });

src/views/vent/monitorManager/windowMonitor/components/modal.vue

@@ -13,19 +13,19 @@
       </template>
       <template v-if="type == '7'">
         <div class="vent-flex-row input-box">
-          <div class="label">前窗目标风量：</div>
+          <div class="label">前窗目标风量(m³/min)：</div>
           <a-input-number size="small" placeholder="0" :min="0" v-model:value="data" />
         </div>
       </template>
       <template v-if="type == '8'">
         <div class="vent-flex-row input-box">
-          <div class="label">后窗目标风量：</div>
+          <div class="label">后窗目标风量(m³/min)：</div>
           <a-input-number size="small" placeholder="0" :min="0" v-model:value="data" />
         </div>
       </template>
       <template v-if="type == 'ldkzStart'">
         <div class="vent-flex-row input-box">
-          <div class="label">瓦斯超限浓度：</div>
+          <div class="label">瓦斯超限浓度(%)：</div>
           <a-input-number size="small" placeholder="0" :min="0" v-model:value="data" />
         </div>
       </template>
@@ -35,6 +35,12 @@
           <a-input-number size="small" placeholder="0" :min="0" v-model:value="data" />
         </div>
       </template>
+      <template v-if="type.startsWith('air')">
+        <div class="vent-flex-row input-box">
+          <div class="label">风窗过风量(m³/min)：</div>
+          <a-input-number size="small" placeholder="0" :min="0" v-model:value="data" />
+        </div>
+      </template>
       <div v-if="!globalConfig?.simulatedPassword" class="vent-flex-row input-box">
         <div class="label">操作密码：</div>
         <a-input size="small" type="password" v-model:value="passWord" />
@@ -104,7 +110,7 @@
   @ventSpace: zxm;
 
   .label {
-    width: 110px;
+    min-width: 110px;
   }
   .@{ventSpace}-input,
   .@{ventSpace}-input-number {

src/views/vent/monitorManager/windowMonitor/dandaoFcBd3.threejs.ts

@@ -159,7 +159,7 @@ class ddFc_7 {
         const planeMesh = new THREE.Mesh(planeGeometry, textMaterial);
         planeMesh.name = 'monitorText';
         planeMesh.scale.set(0.003, 0.0034, 0.004);
-        planeMesh.position.set(4.25, 0.44, -0.27);
+        planeMesh.position.set(4.25, 0.41, -0.27);
         this.group?.add(planeMesh);
       }
     });

src/views/vent/monitorManager/windowMonitor/dandaoFcYjl.threejs.ts

@@ -53,8 +53,16 @@ class ddFc_1 {
         x: 100,
         y: 95,
       },
+      // {
+      //   text: `${selectData.OpenDegree ? '设定开度值(°)' : selectData.forntArea ? '过风面积(㎡)' : '过风面积(㎡)'}:`,
+      //   font: 'normal 30px Arial',
+      //   color: '#009900',
+      //   strokeStyle: '#002200',
+      //   x: 5,
+      //   y: 145,
+      // },
       {
-        text: `${selectData.OpenDegree ? '开度值(°)' : selectData.forntArea ? '过风面积(㎡)' : '过风面积(㎡)'}:`,
+        text: '设定开度值(°):',
         font: 'normal 30px Arial',
         color: '#009900',
         strokeStyle: '#002200',

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

@@ -18,7 +18,7 @@
   <div class="scene-box">
     <div class="top-box">
       <div class="top-center" style="display: flex">
-        <div class="row" v-if="Number(selectData.nwindow) > 1">
+        <div class="row" v-if="Number(selectData.nwindownum) == 2">
           <div v-if="hasPermission('window:AreaControl')" class="button-box" @click="setArea(1)">设定前窗面积</div>
           <div v-if="hasPermission('window:AreaControl')" class="button-box" @click="setArea(2)">设定后窗面积</div>
           <div v-if="hasPermission('window:showAngle')" class="button-box" @click="setAngle(1)">设定前窗角度</div>
@@ -33,13 +33,14 @@
           <!-- <div v-if="hasPermission('window:ldkz')" class="button-box" @click="setArea(3)">自主联动控制开启</div>
           <div v-if="hasPermission('window:ldkz')" class="button-box" @click="setArea(4)">自主联动控制停止</div> -->
         </div>
-        <div class="row" v-if="hasPermission('window:fourAreaControl') && selectData.windowModal == 'sdFc4'">
+        <div class="row" v-if="hasPermission('window:fourAreaControl') && Number(selectData.nwindownum) == 4">
           <div class="button-box" @click="setControl('frontSetValue1', '前窗1面积设置')">前窗1面积</div>
           <div class="button-box" @click="setControl('frontSetValue2', '前窗2面积设置')">前窗2面积</div>
           <div class="button-box" @click="setControl('frontSetValue3', '后窗1面积设置')">后窗1面积</div>
           <div class="button-box" @click="setControl('frontSetValue4', '后窗2面积设置')">后窗2面积</div>
         </div>
-        <div class="row" v-if="Number(selectData.nwindow) == 1">
+
+        <div class="row" v-if="Number(selectData.nwindownum) == 1">
           <div v-if="hasPermission('window:AreaControl')" class="button-box" @click="setArea(1)">设定风窗面积</div>
           <div v-if="hasPermission('window:showAngle')" class="button-box" @click="setAngle(1)">设定风窗角度</div>
         </div>
@@ -49,6 +50,12 @@
         <div v-if="hasPermission('window:gasldkz')" class="button-box" @click="setArea('ldkzStart')">瓦斯超限调控开启</div>
         <div v-if="hasPermission('window:controlFull')" class="button-box" @click="setArea(5)">一键全开</div>
         <div v-if="hasPermission('window:controlFull')" class="button-box" @click="setArea(6)">一键全关</div>
+        <div class="row" v-if="hasPermission('window:fourFlControl') && Number(selectData.nwindownum) == 4">
+          <div class="button-box" @click="setControl('air1', '前窗1风量设置')">设定前窗1风量</div>
+          <div class="button-box" @click="setControl('air2', '前窗2风量设置')">设定前窗2风量</div>
+          <div class="button-box" @click="setControl('air3', '后窗1风量设置')">设定后窗1风量</div>
+          <div class="button-box" @click="setControl('air4', '后窗2风量设置')">设定后窗2风量</div>
+        </div>
         <!-- 展会功能 -->
         <!-- <div v-if="hasPermission('window:ldkz')" class="button-box" @click="setArea('ldkzStart')">自主联动控制开启</div>
         <div v-if="hasPermission('window:ldkz')" class="button-box" @click="setArea('ldkzStop')">自主联动控制停止</div> -->
@@ -514,6 +521,9 @@
       } else if (handlerState.startsWith('frontSetValue')) {
         data.paramcode = handlerState;
         data.value = value;
+      } else {
+        data.paramcode = handlerState;
+        data.value = value;
       }
       deviceControlApi(handlerState == 3 ? params : data)
         .then((res) => {

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

@@ -138,9 +138,9 @@
   }
   //导入导出方法
   function onExportXlsFn() {
-    const { exportXlsPost0 } = useMethods();
+    const { exportXlsGetBlob } = useMethods();
     const params = resetFormParam();
-    exportXlsPost0('历史数据', postExportXlsUrl, params);
+    exportXlsGetBlob('历史数据', postExportXlsUrl, params);
   }
 
   // 列表页面公共参数、方法