update
1.修改socket弹窗等
This commit is contained in:
+206
-3
@@ -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%;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user