1.修改socket弹窗等
This commit is contained in:
2025-07-08 16:00:47 +08:00
parent 07f14c7703
commit 8a630dd1cd
11 changed files with 476 additions and 171 deletions
+206 -3
View File
@@ -20,7 +20,7 @@
</div>
</div>
<div class="sun-body-center">
<CenterMap />
<CenterMap :showHospitalList="showHospitalList" :hospitalList="hospitalList" @clear-hospital-list="clearHospitalList" />
</div>
<div class="sun-body-right">
<div class="sun-body-right-one">
@@ -36,6 +36,11 @@
</div>
</div>
<PhoneDialog ref="phoneDialogRef" :title="phoneDialogTitle" :useForm="true" :setting="setting" :phoneType="phoneType" />
<!-- <YunZuoXiDialog ref="yunZuoXiDialogRef" :record="xianYunData" @confirmHelp="confirmHelp" />-->
<!-- 健康监测弹窗 -->
<EmployeeDialog ref="employeeDialogRef" :record="socketData" />
<!-- 应急120弹窗 -->
<EmergencyDialog ref="emergencyDialogRef" :record="socketData1" @confirm-help="confirmHelp" />
<IndexModal
ref="indexModalRef"
:api="modalApi"
@@ -57,14 +62,23 @@
import threeR from '/@/views/indexSun/threeR.vue';
import CenterMap from '/@/views/indexSun/centerMap.vue';
import { ServerDetailType } from '/@/components/body-d-left/bodyLeftHooks.ts';
import { nextTick, onMounted, ref } from 'vue';
import { columns, fromLists, threeRModalColumns, threeRModalFromList, towRcolumns, twoRform } from '/@/views/indexSun/indexSun.ts';
import { nextTick, onMounted, onUnmounted, ref, watch } from 'vue';
import PhoneDialog from '/@/views/components/phoneDialog/phoneDialog.vue';
import { DataType, getSettings } from '/@/utils/settings.ts';
import IndexModal from '/@/views/indexSun/indexModal.vue';
import LoginOutButton from '/@/views/components/loginOutButton.vue';
import router from '/@/router';
import { getAuthCache } from '/@/utils/auth.ts';
import { basicPath, useSocket, emergencyPath } from '/@/utils/socket.ts';
import { Map } from '/@/assets/mapUtils/map.ts';
import YunZuoXiDialog from '/@/views/components/yunZuoXiDialog.vue';
import EmployeeDialog from '/@/views/components/employeeDialog.vue';
import EmergencyDialog from '/@/views/components/emergencyDialog.vue';
import { handleSocketUrl } from '/@/utils/utils.ts';
import { useUserStore } from '/@/store/modules/user.ts';
const { getCenterInfo } = useUserStore();
import { threeRModalApi, twoRModal1Api, twoRModal2Api, twoRModal3Api } from '/@/views/indexSun/indexSun.api.ts';
import dayjs from 'dayjs';
//0:处置 1:处理 2:呼入 3:全部
@@ -84,6 +98,7 @@
const centerInfo = getAuthCache('centerInfo');
centerId.value = centerInfo.id;
});
function handleOneLeftClick(item) {
const { name, key } = item;
//呼入电话
@@ -99,6 +114,7 @@
});
}
}
function handleTwoLClick() {
indexModalTitle.value = '主诉分类详情';
indexColumn.value = columns[1];
@@ -108,12 +124,184 @@
indexModalRef.value.openDialog();
});
}
function handleOneRClick() {
console.log(12333);
router.push({
path: '/indexSon',
});
}
// 健康监测工具报警
let socketUrl = handleSocketUrl(basicPath, getCenterInfo?.id);
const { socketData, setSocketData, closeSocket } = useSocket(socketUrl);
const employeeDialogRef = ref();
function employeeDialogOpen() {
setSocketData({
userId: '001a9878fdaf401c844a03e2fc7c370b',
realName: '曹燕',
lon: 87.587482,
lat: 43.856052,
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();
}
setTimeout(() => {
// employeeDialogOpen();
// openEmergencyOpen();
// yunZOpen();
}, 5000);
watch(socketData, (nVal) => {
if (nVal) {
nextTick(() => {
setSocketData(nVal);
employeeDialogRef.value.openDialog();
});
}
});
//应急求助、120弹窗
let socketUrl1 = handleSocketUrl(emergencyPath, getCenterInfo?.id);
const { socketData: socketData1, setSocketData: setSocketData1, closeSocket: closeSocket1 } = useSocket(socketUrl1, false);
const emergencyDialogRef = ref(); //紧急求助
watch(socketData1, (nVal) => {
if (nVal) {
setSocketData1(nVal);
emergencyDialogRef.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;
}
onUnmounted(() => {
// 监听窗口关闭事件,当窗口关闭时,主动去关闭websocket连接,防止连接还没断开就关闭窗口,server端会抛异常。
window.onbeforeunload = function () {
closeSocket();
closeSocket1(); //西安云坐席
};
});
function handleThreeRClick(type) {
const textArr = ['心血管异常人员列表', '脑血管异常人员列表', '冠状CT异常人员列表'];
console.log(type);
@@ -159,6 +347,7 @@
letter-spacing: 2px;
background: url('/@/assets/indexSun/bigBg.png') no-repeat;
background-size: 100% 100%;
.sun-screen-title {
height: 80px;
background: url('/@/assets/indexSun/bg.png') no-repeat;
@@ -168,10 +357,12 @@
color: #fff;
text-align: center;
line-height: 60px;
.sun-title-left,
.sun-title-right {
width: 23%;
}
.sun-title-center {
flex: 1;
font-size: 50px;
@@ -181,11 +372,13 @@
font-weight: bold;
}
}
.sun-body-content {
height: calc(100% - 80px);
padding: 10px 20px;
display: flex;
justify-content: space-between;
.sun-body-left,
.sun-body-right {
height: 100%;
@@ -194,6 +387,7 @@
flex-direction: column;
justify-content: space-between;
}
.sun-body-center {
flex: 1;
margin: 0 10px;
@@ -201,6 +395,7 @@
display: flex;
flex-direction: column;
}
.sun-body-left {
.sun-body-left-one,
.sun-body-left-two,
@@ -208,6 +403,7 @@
margin-bottom: 10px;
border: 1px solid #00ccff;
border-radius: 14px;
.one-l-box,
.two-l-box,
.three-l-box,
@@ -215,14 +411,17 @@
height: 100%;
}
}
.sun-body-left-one {
height: 27%;
}
.sun-body-left-two,
.sun-body-left-three {
height: 36%;
}
}
.sun-body-right {
.sun-body-right-one,
.sun-body-right-two,
@@ -230,18 +429,22 @@
border: 1px solid #00ccff;
border-radius: 14px;
margin-bottom: 10px;
.one-r-box,
.two-r-box,
.three-r-box {
height: 100%;
}
}
.sun-body-right-one {
height: 30%;
}
.sun-body-right-two {
height: 42%;
}
.sun-body-right-three {
height: 26%;
}