update 云坐席弹窗WebSocket

src/views/yinChuan/yinChuan.vue

@@ -24,7 +24,14 @@
                 <DailyWorkTrends theme="dark" :refreshState="refreshState" class="daily-work-trends" />
             </div>
             <div class="body-d-middle">
-                <china-map :showFooter="false" :computedCenter="false" :mapOptions="YinChuanOption" />
+                <china-map
+                    :showFooter="false"
+                    :computedCenter="false"
+                    :mapOptions="YinChuanOption"
+                    :showHospitalList="showHospitalList"
+                    :hospitalList="hospitalList"
+                    @clearHospitalList="clearHospitalList"
+                />
             </div>
             <div class="body-d-right">
                 <!--健康终端报警-->
@@ -37,7 +44,8 @@
         </div>
         <div class="bottom-d"></div>
         <EmployeeDialog ref="employeeDialogRef" :record="socketData" />
-        <EmergencyDialog ref="emergencyDialogRef" :record="emergencyData" />
+        <EmergencyDialog ref="emergencyDialogRef" :record="emergencyData" @confirmHelp="confirmHelp" />
+        <YunZuoXiDialog ref="yunZuoXiDialogRef" :record="yunZuoXiData" @confirmHelp="confirmHelp" />
         <PhoneDialog ref="phoneDialogRef" :phoneType="phoneType" :setting="setting" :title="phoneDialogTitle" :useForm="true" />
         <TerminalAlarmDialog ref="terminalAlarmDialogRef" :setting="setting" />
     </div>
@@ -52,10 +60,11 @@
     import ChinaMap from '/@/components/chinaMap/chinaMap.vue';
     import EmployeeDialog from '/@/views/components/employeeDialog.vue';
     import EmergencyDialog from '/@/views/components/emergencyDialog.vue';
+    import YunZuoXiDialog from '/@/views/components/yunZuoXiDialog.vue';
     import PhoneDialog from '/@/views/components/phoneDialog/phoneDialog.vue';
     import TerminalAlarmDialog from '/@/views/yinChuan/componetns/TerminalAlarmDialog/TerminalAlarmDialog.vue';
     import { useTopTime } from '/@/utils/utils.ts';
-    import { basicPath, emergencyPath, useSocket } from '/@/utils/socket.ts';
+    import { basicPath, emergencyPath, useSocket, yinChuanPath } from '/@/utils/socket.ts';
     import { useRefresh } from '/@/hooks/autoRefresh';
     import { DEFAULT_TIME } from '/@/hooks/autoRefresh/pageRefreshTime.ts';
     import { useRoute } from 'vue-router';
@@ -63,6 +72,7 @@
     import { ServerDetailType } from '/@/components/body-d-left/bodyLeftHooks.ts';
     import { YinChuanOption } from '/@/assets/mapUtils/mapConstant.ts';
     import { useUserStore } from '/@/store/modules/user.ts';
+    import { Map } from '/@/assets/mapUtils/map.ts';
 
     const title = ref('银川片应急就医服务中心');
     const phone = '(0951-6805199)';
@@ -183,7 +193,18 @@
         if (nVal) {
             nextTick(() => {
                 setEmergencyData(nVal);
-                emergencyDialogRef.value.openDialog;
+                emergencyDialogRef.value.openDialog();
+            });
+        }
+    });
+    //银川云坐席
+    const { socketData: yunZuoXiData, setSocketData: setYunZuoXiData, closeSocket: closeSocket3 } = useSocket(yinChuanPath);
+    const yunZuoXiDialogRef = ref();
+    watch(yunZuoXiData, (nVal) => {
+        if (nVal) {
+            nextTick(() => {
+                setYunZuoXiData(nVal);
+                yunZuoXiDialogRef.value.openDialog();
             });
         }
     });
@@ -192,6 +213,7 @@
         window.onbeforeunload = function () {
             closeSocket();
             closeSocket2();
+            closeSocket3(); //银川云坐席
         };
 
         clearInterval(interval.value);
@@ -225,6 +247,88 @@
         terminalAlarmDialogRef.value.openDialog();
     }
 
+    //确认应急求助
+    const hospitalList = ref([]); //医院列表
+    const showHospitalList = ref(false);
+
+    async function confirmHelp(data) {
+        if (!data.lon) return;
+        hospitalList.value = [];
+        //用户的坐标信息
+        let point = [data.lon, data.lat];
+        if (data.hospitalList && data.hospitalList.length > 0) {
+            try {
+                hospitalList.value = await getHospitalList(data.hospitalList, point);
+                showHospitalList.value = true;
+            } catch (error) {
+                console.log('获取医院列表时出错:', error);
+            }
+        } else {
+            console.log('没有医院list');
+        }
+        Map.getAddressByPoint(point).then((res) => {
+            const option = {
+                lon: data.lon,
+                lat: data.lat,
+                position: point,
+                name: data.realName,
+                address: res,
+                sex: data.sex,
+            };
+            Map.createEmergencyMarker(option);
+        });
+    }
+
+    async function getHospitalList(hospitalList, userLocation) {
+        const hospitalPromises = hospitalList.map(async (item) => {
+            item.distance = getDistance(userLocation, [item.lon, item.lat]);
+            const { time, routeList } = await getDriveTime(userLocation, [item.lon, item.lat]);
+            item.driveTime = time;
+            item.routeList = routeList;
+            item.userLocation = userLocation;
+            return item; // 返回更新后的医院条目
+        });
+        return Promise.all(hospitalPromises);
+    }
+
+    function getDistance(userLocation, destination) {
+        const value = Map.getDistance(userLocation, destination);
+        return value > 1000 ? (value / 1000).toFixed(2) + 'km' : value + 'm';
+    }
+
+    async function getDriveTime(userLocation, destination) {
+        let { time, steps } = await Map.getDriveTime(userLocation, destination);
+        let h,
+            m,
+            s = 0;
+        if (time <= 60) {
+            return {
+                time: `${s}秒`,
+                routeList: steps,
+            };
+        }
+        if (time > 60 && time < 3600) {
+            m = Math.floor(time / 60);
+            return {
+                time: `${m}分`,
+                routeList: steps,
+            };
+        }
+        if (time >= 3600) {
+            h = Math.floor(time / 3600);
+            m = Math.floor((time - h * 3600) / 60);
+            return {
+                time: `${h}小时${m}分`,
+                routeList: steps,
+            };
+        }
+    }
+
+    function clearHospitalList() {
+        hospitalList.value = [];
+        showHospitalList.value = false;
+    }
+
     // function test() {
     //     let nVal = {
     //         watchNo: 'CRFTQ22C03000080',