Merge branch 'hm' into dev

src/store/rightPanel.js

@@ -20,6 +20,9 @@ export const useRightPanelStore = defineStore("rightPanelStore", () => {
   //预警弹窗
   const warningVisible = ref(true);
 
+  // 视频通话窗口
+  const videoCallVisible = ref(false)
+
   //关闭右侧弹窗
   const handleCloseAllVisible = () => {
     rightPanelVisible.value = "";
@@ -27,6 +30,7 @@ export const useRightPanelStore = defineStore("rightPanelStore", () => {
     aiVisible.value = false;
     publicHealthVisible.value = false;
     // warningVisible.value = false;
+    videoCallVisible.value = false
   };
 
   //时间轴开关
@@ -48,6 +52,7 @@ export const useRightPanelStore = defineStore("rightPanelStore", () => {
     publicHealthVisible,
     districtString,
     handleCloseAllVisible,
-    timerSwitchStatus
+    timerSwitchStatus,
+    videoCallVisible
   };
 });

src/views/right/components/handleProcess/comp/PeopleCd.vue

@@ -20,7 +20,7 @@
     <div class="line-box"></div>
     <div class="button-box">
       <div class="button-item"><span class="content">语音会议</span></div>
-      <div class="button-item"><span class="content">视频会商</span></div>
+      <div class="button-item" @click="handleMultiPersonVideoCall"><span class="content">视频会商</span></div>
     </div>
   </CommonPanel>
 </template>
@@ -29,6 +29,8 @@
 import { ref } from "vue";
 import CommonPanel from "../../common/CommonPanel.vue";
 import CarImage from "../../../../../assets/img/people-icon.png";
+const emit = defineEmits(['handleVideoCallClick'])
+
 const leftServiceList = [
   {
     name: "上海市疾病预防控制中心",
@@ -110,9 +112,9 @@ const renderContent = (h, { node, data, store }) => {
         data[serviceKey]
       ),
       h("div", { class: "imgbox" }, [
-        h("div", { class: "img1", onclick: (e) => {e.stopPropagation()} }, ""),
-        h("div", { class: "img2", onclick: (e) => {e.stopPropagation()} }, ""),
-        h("div", { class: "img3", onclick: (e) => {e.stopPropagation()} }, ""),
+        h("div", { class: "img1", onClick: (event) => handleVoiceCallClick(event, data) }, ""),
+        h("div", { class: "img2", onClick: (event) => handleSoundClick(event, data) }, ""),
+        h("div", { class: "img3", onClick: (event) => handleVideoCallClick(event, data) }, ""),
       ]),
     ]);
   }
@@ -121,6 +123,16 @@ const renderContent = (h, { node, data, store }) => {
     h("span", { class: "node-label" }, [data[serviceKey]]),
   ]);
 };
+
+// 单人视频
+function handleVideoCallClick(event, data) {
+   emit('handleVideoCallClick',data)
+}
+
+// 多人视频通话
+function handleMultiPersonVideoCall() {
+   emit('handleVideoCallClick')
+}
 </script>
 
 <style lang="scss" scoped>

src/views/right/components/handleProcess/comp/VideoCallView.vue

@@ -0,0 +1,44 @@
+<template>
+  <div class="video_callw_container">
+    
+    <div class="video-box">
+      <div class="title-close" @click="handleClose"></div>
+       
+    </div>
+  </div>
+</template>
+<script setup>
+import { ref, watch, computed, reactive, toRefs, onBeforeMount, onMounted } from 'vue'
+import { useRightPanelStore } from '@/store/rightPanel'
+const rightPanelStore = useRightPanelStore()
+
+const handleClose = () => {
+  rightPanelStore.videoCallVisible = "";
+};
+</script>
+<style lang="scss" scoped>
+.video_callw_container {
+  position: fixed;
+  top: 590px;
+  right: 860px;
+  width: 300px;
+  height: 300px;
+
+  .video-box {
+    position: relative;
+    width: 300px;
+    height: 300px;
+    background-image: url('@/assets/img/Frame 1321314936.png');
+    background-size: 100% 100%;
+  .title-close {
+    position: absolute;
+    right: 15px;
+    top: 15px;
+    width: 30px;
+    height: 30px;
+    background-image: url("@/assets/img/Frame 2136636618.png");
+    background-size: 100% 100%;
+  }
+  }
+}
+</style>

src/views/right/components/handleProcess/index.vue

@@ -139,6 +139,7 @@
     :class="{
       'right-dialog-max': rightPanelStore.emergencyVisible,
     }"
+    @handleVideoCallClick="handleVideoCallClick"
   />
   <CarCd
     v-if="rightPanelStore.rightPanelVisible == '出动车辆'"
@@ -158,6 +159,12 @@
       'right-dialog-max': rightPanelStore.emergencyVisible,
     }"
   />
+    <VideoCallView
+    v-if="rightPanelStore.videoCallVisible"
+    :class="{
+      'right-dialog-max': rightPanelStore.videoCallVisible
+    }"
+  />
 </template>
 
 <script setup>
@@ -172,6 +179,7 @@ import MedicalReport from "./comp/MedicalReport.vue";
 import ProruptionCase from "./comp/ProruptionCase.vue";
 import { WordColudOption } from "../../echarts/echartsOption";
 import { useRightPanelStore } from "@/store/rightPanel";
+import VideoCallView from './comp/VideoCallView.vue'
 
 const rightPanelStore = useRightPanelStore();
 const handlePanelVisible = (val) => {
@@ -182,6 +190,12 @@ const handleEmergencyVisible = () => {
   rightPanelStore.emergencyVisible = true;
 };
 
+function handleVideoCallClick () {
+  console.log('视频')
+  rightPanelStore.videoCallVisible = true
+  console.log(rightPanelStore.videoCallVisible,'rightPanelStore.videoCallVisible')
+}
+
 const yunEchartsRef = ref();
 const ciData = ref([
   { name: "接种率", value: 40 },