增加地图元素清空功能，完成附近医院路线规划功能

2024-05-23 15:05:34 +08:00
parent 1599ffd6d8
commit 0eb5fad72f
11 changed files with 611 additions and 31 deletions
@@ -14,7 +14,7 @@
                <three-l :key="tabState" :setting="setting" :refreshState="refreshState" />
            </div>
            <div class="body-d-middle">
-                <china-map />
+                <china-map :showHospitalList="showHospitalList" :hospitalList="hospitalList" @clearHospitalList="clearHospitalList"></china-map>
            </div>
            <div class="body-d-right">
                <one-r :setting="setting" :refreshState="refreshState" />
@@ -24,12 +24,12 @@
        </div>
        <div class="bottom-d"></div>
        <EmployeeDialog ref="employeeDialogRef" :record="socketData" />
-        <EmergencyDialog ref="emergencyDialogRef" :record="emergencyData" />
+        <EmergencyDialog ref="emergencyDialogRef" :record="emergencyData" @confirmHelp="confirmHelp" />
        <PhoneDialog ref="phoneDialogRef" :title="phoneDialogTitle" :useForm="true" :setting="setting" :phoneType="phoneType" />
    </div>
 </template>
 <script setup lang="ts">
-    import { onUnmounted, ref, watch, nextTick, onMounted } from 'vue';
+    import { nextTick, onMounted, onUnmounted, ref, watch } from 'vue';
    import OneL from '/@/components/body-d-left/oneL.vue';
    import TwoL from '/@/components/body-d-left/twoL.vue';
    import ThreeL from '/@/components/body-d-left/threeL.vue';
@@ -46,6 +46,7 @@
    import { DataType, getSettings } from '/@/utils/settings.ts';
    import { ServerDetailType } from '/@/components/body-d-left/bodyLeftHooks.ts';
    import PhoneDialog from '/@/views/components/phoneDialog/phoneDialog.vue';
+    import { Map } from '/@/assets/mapUtils/map.ts';

    const { refreshState } = useRefresh(DEFAULT_TIME);
    const dayTimeO = ref();
@@ -85,6 +86,60 @@
    // 健康监测工具报警
    const { socketData, setSocketData, closeSocket } = useSocket(basicPath + `${DataType.xian}`);
    const employeeDialogRef = ref();
+
+    //模拟开启
+    function employeeDialogOpen() {
+        setEmergencyData({
+            userId: '001a9878fdaf401c844a03e2fc7c370b',
+            realName: '曹燕',
+            lon: 108.872442,
+            lat: 34.189956,
+            sex: 2,
+            age: 40,
+            orgCode: 'A01A33A05',
+            orgName: '地质研究所',
+            hospitalList: [
+                {
+                    id: null,
+                    name: '交大一附院',
+                    lat: 34.22,
+                    lon: 108.94,
+                    type: null,
+                    ambulance: null,
+                    docNum: null,
+                    nurseNum: null,
+                    expertNum: null,
+                    distance: null,
+                },
+                {
+                    id: null,
+                    name: '高新医院',
+                    lat: 34.23,
+                    lon: 108.88,
+                    type: null,
+                    ambulance: null,
+                    docNum: null,
+                    nurseNum: null,
+                    expertNum: null,
+                    distance: null,
+                },
+                {
+                    id: null,
+                    name: '人民医院',
+                    lat: 34.24,
+                    lon: 108.93,
+                    type: null,
+                    ambulance: null,
+                    docNum: null,
+                    nurseNum: null,
+                    expertNum: null,
+                    distance: null,
+                },
+            ],
+        });
+        emergencyDialogRef.value.openDialog();
+    }
+
    watch(socketData, (nVal) => {
        if (nVal) {
            nextTick(() => {
@@ -94,7 +149,7 @@
        }
    });

-    //应急求助 + `/${DataType.xian}`
+    //应急求助
    const { socketData: emergencyData, setSocketData: setEmergencyData, closeSocket: closeSocket2 } = useSocket(emergencyPath + `${DataType.xian}`);
    const emergencyDialogRef = ref();

@@ -137,6 +192,99 @@
        });
    }

+    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.length > 0) {
+            try {
+                hospitalList.value = await getHospitalList(data.hospitalList, point);
+                showHospitalList.value = true;
+            } catch (error) {
+                console.log('获取医院列表时出错:', error);
+            }
+        }
+        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 getHospitalList(hospitalList, userLocation) {
+    //     hospitalList.forEach(async (item) => {
+    //         item.distance = getDistance(userLocation, [item.lon, item.lat]);
+    //         let { time, routeList } = await getDriveTime(userLocation, [item.lon, item.lat]);
+    //         item.driveTime = time;
+    //         item.routeList = routeList;
+    //         item.userLocation = userLocation;
+    //         console.log('time', item.driveTime);
+    //     });
+    //     return hospitalList;
+    // }
+
+    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',