视频会商 选择逻辑调整

src/api/emergencyCommandMap/communication.ts

@@ -8,3 +8,21 @@ export function getStartMiniParan(data) {
     data: data
   });
 }
+
+// 视频会商-部门树
+export function getAvconDeptTree(params) {
+  return request({
+    url: '/api/system/user/avcon/deptTree',
+    method: 'get',
+    params: params
+  });
+}
+
+// 视频会商-部门树
+export function getAvconDeptList(id, params) {
+  return request({
+    url: '/api/system/user/avcon/list/dept/' + id,
+    method: 'get',
+    params: params
+  });
+}

src/components/HeaderSection/index2.vue

@@ -38,7 +38,7 @@
   </div>
 </template>
 
-<script lang="ts" setup name="headerSection">
+<script lang="ts" setup name="headerSection2">
 import usePermissionStore from '@/store/modules/permission';
 import useUserStore from '@/store/modules/user';
 import { onClickOutside } from '@vueuse/core';

src/views/emergencyCommandMap/LeftSection/AssociatedEvent.vue

@@ -129,7 +129,7 @@ const closeDialog = () => {
 // 提交事件信息
 const submitEvent = async () => {
   if (!form.value.event_title) {
-    proxy?.$message.error('请先选择一个事件');
+    proxy?.$modal.msgError('请先选择一个事件');
     return;
   }
   try {
@@ -148,7 +148,7 @@ const submitEvent = async () => {
     refreshPageData();
   } catch (error) {
     console.error('Failed to associate event:', error);
-    proxy?.$message.error('提交表单失败，请检查您的输入');
+    proxy?.$modal.msgError('提交表单失败，请检查您的输入');
   }
 };
 

src/views/emergencyCommandMap/LeftSection/CloseCommand.vue

@@ -145,7 +145,7 @@ const endProcess = () => {
   // 如果 flag 为 false，则需要选择一个事件
   if (!props.flag) {
     if (!form.value.event_id) {
-      proxy?.$message.error('请先选择一个事件');
+      proxy?.$modal.msgError('请先选择一个事件');
       return;
     }
     // 提交选择的事件信息
@@ -160,12 +160,12 @@ const endProcess = () => {
           })
           .catch((error) => {
             console.error('Failed to close event:', error);
-            proxy?.$message.error('关闭事件失败，请检查您的输入');
+            proxy?.$modal.msgError('关闭事件失败，请检查您的输入');
           });
       })
       .catch((error) => {
         console.error('Failed to submit the form:', error);
-        proxy?.$message.error('提交表单失败，请检查您的输入');
+        proxy?.$modal.msgError('提交表单失败，请检查您的输入');
       });
   } else {
     // 如果 flag 为 true，则直接调用 closeEvent 接口关闭事件
@@ -176,7 +176,7 @@ const endProcess = () => {
       })
       .catch((error) => {
         console.error('Failed to submit the form:', error);
-        proxy?.$message.error('提交表单失败，请检查您的输入');
+        proxy?.$modal.msgError('提交表单失败，请检查您的输入');
       });
   }
 };
@@ -204,13 +204,13 @@ const endProcess = () => {
         } catch (error) {
           console.error('Failed to close event:', error);
           reject(error); // 拒绝Promise表示失败
-          proxy?.$message.error('关闭事件失败，请检查您的输入');
+          proxy?.$modal.msgError('关闭事件失败，请检查您的输入');
         } finally {
           buttonLoading.value = false;
         }
       } else {
         reject(new Error('Validation failed')); // 验证失败也拒绝Promise
-        proxy?.$message.error('表单验证失败，请检查您的输入');
+        proxy?.$modal.msgError('表单验证失败，请检查您的输入');
       }
     });
   });

src/views/emergencyCommandMap/LeftSection/Communication.vue

@@ -9,7 +9,7 @@
     <div v-show="activeIndex === 0" class="content">
       <div class="left-content">
         <div class="search-box">
-          <el-input v-model="queryParams.keyword" class="custom-input" placeholder="组织架构搜索" style="width: 487px">
+          <el-input v-model="queryParams.keyword" class="custom-input" placeholder="组织架构搜索" style="width: 487px" @keyup.enter="getTree">
             <template #prefix>
               <el-icon class="el-input__icon"><search /></el-icon>
             </template>
@@ -83,12 +83,12 @@
         </div>
       </div>
       <div class="btn-box">
-        <div class="btn">
-          <div class="icon1" @click="handleJoinMeeting"></div>
+        <div class="btn" @click="handleJoinMeeting">
+          <div class="icon1"></div>
           <div class="text">会议号入会</div>
         </div>
-        <div class="btn">
-          <div class="icon2" @click="handleStartCall"></div>
+        <div class="btn" @click="handleStartCall">
+          <div class="icon2"></div>
           <div class="text">电话呼叫</div>
         </div>
         <div class="btn" @click="handleStartMeeting">
@@ -102,74 +102,37 @@
 
 <script lang="ts" setup>
 import { Search } from '@element-plus/icons-vue';
-import { getStartMiniParan } from '@/api/emergencyCommandMap/communication';
-import { ConvergedCommunication } from '@/utils/convergedCommunication';
-import { ElMessage } from 'element-plus'; // 确保已正确导入 ElMessage
+import { getAvconDeptList, getAvconDeptTree, getStartMiniParan } from '@/api/emergencyCommandMap/communication';
+import { deepClone } from '@/utils';
 
 const proxy = getCurrentInstance()?.proxy;
 
 let activeIndex = ref(0);
 const options = ref([{ name: '全部', value: '全部' }]);
-const queryParams = ref({
-  value1: '',
-  keyword: ''
-});
 const menu = ref([{ name: '视频会商' }, { name: '无人机' }, { name: '单兵设备' }]);
-const treeData = ref([
-  {
-    label: '茂名市',
-    children: [
-      {
-        label: '茂名市委',
-        children: [
-          {
-            label: '茂名市纪委监委',
-            isLeaf: true
-          },
-          {
-            label: '茂名市委办公室',
-            isLeaf: true
-          },
-          {
-            label: '茂名市委组织部',
-            isLeaf: true
-          }
-        ]
-      },
-      {
-        label: '茂名市人大',
-        children: [
-          {
-            label: '茂名市人大常委会秘书长、副秘书长',
-            isLeaf: true
-          },
-          {
-            label: '茂名市人大常委会办公室',
-            isLeaf: true
-          },
-          {
-            label: '茂名市人大常委会研究室',
-            isLeaf: true
-          }
-        ]
-      }
-    ]
-  }
-]);
+const treeData = ref([]);
 const userList = ref([]);
-const selectList = computed(() => {
-  const data = [];
-  userList.value.forEach((item) => {
-    if (item.checked) {
-      data.push(item);
-    }
-  });
-  return data;
+const queryParams = reactive({
+  label: '',
+  value1: ''
 });
+
+const getTree = () => {
+  getAvconDeptTree(queryParams).then((res) => {
+    treeData.value = res.data;
+  });
+};
+const selectList = ref([]);
 const getCheckedClass = () => {
   let res = 'common-checked';
   const len = userList.value.length;
-  const len2 = selectList.value.length;
+  let len2 = 0;
+  userList.value.forEach((item) => {
+    const index = selectList.value.findIndex((item2) => item2.id === item.id);
+    if (index > -1) {
+      len2++;
+    }
+  });
   if (len2 > 0 && len2 === len) {
     res = 'common-checked-active';
   } else if (len2 > 0) {
@@ -178,56 +141,13 @@ const getCheckedClass = () => {
   return res;
 };
 const handleNodeClick = (item) => {
-  if (item.isLeaf) {
-    const data = [
-      {
-        id: 1,
-        name: '李莉莉',
-        duty: '副主任',
-        dept: '茂名市/茂名市政府/茂名应急管理局',
-        mobile: 'mmyj0006@mm.zw.yj'
-      },
-      {
-        id: 2,
-        name: '何里',
-        duty: '副主任',
-        dept: '茂名市/茂名市政府/茂名应急管理局',
-        mobile: 'mmyj0007@mm.zw.yj'
-      },
-      {
-        id: 3,
-        name: '张三',
-        duty: '副主任',
-        dept: '茂名市/茂名市政府/茂名应急管理局',
-        mobile: 'mmyj0008@mm.zw.yj'
-      },
-      {
-        id: 4,
-        name: '张三',
-        duty: '副主任',
-        dept: '茂名市/茂名市政府/茂名应急管理局',
-        mobile: 'mmyj0009@mm.zw.yj'
-      },
-      {
-        id: 5,
-        name: '张三',
-        duty: '副主任',
-        dept: '茂名市/茂名市政府/茂名应急管理局',
-        mobile: ''
-      },
-      {
-        id: 6,
-        name: '张三',
-        duty: '副主任',
-        dept: '茂名市/茂名市政府/茂名应急管理局',
-        mobile: ''
-      }
-    ];
-    data.forEach((item) => {
-      item.checked = false;
+  getAvconDeptList(item.id, {}).then((res) => {
+    res.data.forEach((item) => {
+      const index = selectList.value.findIndex((item2) => item2.id === item.id);
+      item.checked = index > -1;
     });
-    userList.value = data;
-  }
+    userList.value = res.data;
+  });
 };
 // 全选、全取消
 const handleChecked = () => {
@@ -238,11 +158,13 @@ const handleChecked = () => {
   }
   userList.value.forEach((item) => {
     item.checked = flag;
+    changeSelectList(item);
   });
 };
 // 单个选中、取消选中
 const handleChecked2 = (item) => {
   item.checked = !item.checked;
+  changeSelectList(item);
 };
 // 清空
 const clearSelect = () => {
@@ -251,6 +173,19 @@ const clearSelect = () => {
       item.checked = false;
     }
   });
+  selectList.value = [];
+};
+const changeSelectList = (item) => {
+  const index = selectList.value.findIndex((item2) => item2.id === item.id);
+  if (item.checked) {
+    if (index === -1) {
+      selectList.value.push(deepClone(item));
+    }
+  } else {
+    if (index > -1) {
+      selectList.value.splice(index, 1);
+    }
+  }
 };
 // 清空指定项
 const deleteItem = (item) => {
@@ -260,21 +195,23 @@ const deleteItem = (item) => {
       break;
     }
   }
+  item.checked = false;
+  changeSelectList(item);
 };
 
 // 会议号入会
 const handleJoinMeeting = () => {
-  proxy?.$message.error('融合通信新开发功能，暂未对接');
+  proxy?.$modal.msgError('融合通信新开发功能，暂未对接');
   return false;
 
   const screenWidth = window.screen.width * window.devicePixelRatio;
   const screenHeight = window.screen.height * window.devicePixelRatio;
   const data = {
-    "userid": "", // 空表示后台获取当前用户对应融合通信dev_id
-    "password": "123",
+    'userid': '', // 空表示后台获取当前用户对应融合通信dev_id
+    'password': '123',
     roomid: '715724498', // 会议号
-    windowpos: { "x": 0, "y": 0, "width": screenWidth, "height": screenHeight, "top": true },
-    members: { num: 1} // 不用邀请别人
+    windowpos: { 'x': 0, 'y': 0, 'width': screenWidth, 'height': screenHeight, 'top': true },
+    members: { num: 1 } // 不用邀请别人
   };
   getStartMiniParan(data).then((res) => {
     // 创建一个a标签元素
@@ -284,31 +221,30 @@ const handleJoinMeeting = () => {
     // 触发点击事件
     a.click();
   });
-}
+};
 
 // 电话呼叫
 const handleStartCall = () => {
   let dev_list = [];
-  userList.value.forEach((item)=>{
-    if(item.checked && item.mobile != '') {
-      dev_list.push({id: item.mobile, avtype: 'a'}); // a 音频 v 视频 默认 av
+  userList.value.forEach((item) => {
+    if (item.checked && item.mobile != '') {
+      dev_list.push({ id: item.mobile, avtype: 'a' }); // a 音频 v 视频 默认 av
     }
   });
   if (dev_list.length == 0) {
-    proxy?.$message.error('请勾选人员');
+    proxy?.$modal.msgError('请勾选人员');
     return false;
   }
   const screenWidth = window.screen.width * window.devicePixelRatio;
   const screenHeight = window.screen.height * window.devicePixelRatio;
   const data = {
-    "userid": "", // 空表示后台获取当前用户对应融合通信dev_id
-    "password": "123",
+    userid: '', // 空表示后台获取当前用户对应融合通信dev_id
+    password: '123',
     roomid: '', // 空表示新会议室
-    windowpos: { "x": 0, "y": 0, "width": screenWidth, "height": screenHeight, "top": true },
+    windowpos: { 'x': 0, 'y': 0, 'width': screenWidth, 'height': screenHeight, 'top': true },
     members: {
       num: dev_list.length + 2, // 配置多少个座位，一般就是邀请人多少个就多少个
-      "dev-list": dev_list,
-      // "sip-list": [ { "id": "60002" }, { "id": "60008", "avtype": "a" }, { "id": "60003", "avtype": "v" } ]
+      'dev-list': dev_list
     }
   };
   getStartMiniParan(data).then((res) => {
@@ -324,26 +260,25 @@ const handleStartCall = () => {
 // 发起会议
 const handleStartMeeting = () => {
   let dev_list = [];
-  userList.value.forEach((item)=>{
-    if(item.checked && item.mobile != '') {
-      dev_list.push({id: item.mobile, avtype: 'av'}); // a 音频 v 视频 默认 av
+  userList.value.forEach((item) => {
+    if (item.checked && item.mobile != '') {
+      dev_list.push({ id: item.mobile, avtype: 'av' }); // a 音频 v 视频 默认 av
     }
   });
   if (dev_list.length == 0) {
-    proxy?.$message.error('请勾选人员');
+    proxy?.$modal.msgError('请勾选人员');
     return false;
   }
   const screenWidth = window.screen.width * window.devicePixelRatio;
   const screenHeight = window.screen.height * window.devicePixelRatio;
   const data = {
-    "userid": "", // 空表示后台获取当前用户对应融合通信dev_id
-    "password": "123",
+    'userid': '', // 空表示后台获取当前用户对应融合通信dev_id
+    'password': '123',
     roomid: '', // 空表示新会议室
-    windowpos: { "x": 0, "y": 0, "width": screenWidth, "height": screenHeight, "top": true },
+    windowpos: { 'x': 0, 'y': 0, 'width': screenWidth, 'height': screenHeight, 'top': true },
     members: {
       num: dev_list.length + 2, // 配置多少个座位，一般就是邀请人多少个就多少个
-      "dev-list": dev_list,
-      // "sip-list": [ { "id": "60002" }, { "id": "60008", "avtype": "a" }, { "id": "60003", "avtype": "v" } ]
+      'dev-list': dev_list
     }
   };
   getStartMiniParan(data).then((res) => {
@@ -355,6 +290,9 @@ const handleStartMeeting = () => {
     a.click();
   });
 };
+onMounted(() => {
+  getTree();
+});
 </script>
 
 <style lang="scss" scoped>
@@ -507,9 +445,10 @@ const handleStartMeeting = () => {
             background-color: #122868;
           }
           .phone-icon {
+            flex-shrink: 0;
             width: 62px;
             height: 63px;
-            background: url('@/assets/images/emergencyCommandMap/communication/phone.png');
+            background: url('@/assets/images/emergencyCommandMap/communication/phone.png') no-repeat;
             cursor: pointer;
           }
         }