renkang/xj-screen
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update

Browse Source 
1.应急事件显示信息过长，精简一下。
2.救护车图标配色调整
3.医院图标增大一点，显示图标及应急求助时的推荐图标
4.急救弹窗添加呼吸效果
5.急救路线搜索框，控制只搜索新疆境内
6.咨询大屏也要监听事件并弹出弹窗
This commit is contained in:
weixin
2025-10-31 17:51:22 +08:00
parent f44e372210
commit f617922cd3
18 changed files with 480 additions and 190 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/assets/img/legend3.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.4 KiB

After

Width:  |  Height:  |  Size: 2.6 KiB

src/assets/img/mapIcon1-1.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 15 KiB

After

Width:  |  Height:  |  Size: 23 KiB

src/assets/img/mapIcon3.png
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 8.8 KiB

After

Width:  |  Height:  |  Size: 9.6 KiB

src/assets/mapUtils/commonFun.ts
+4 -2
View File
@@ -47,7 +47,9 @@ export function typeToIcon1(type: string) {
const iconSize = [21, 52];
const imageSize = [21, 52];
if (type == '1') {
return createIcon({ icon: mapIcon11, iconSize, imageSize });
const iconS = [30, 65];
const imageS = [30, 65];
return createIcon({ icon: mapIcon11, iconSize: iconS, imageSize: imageS });
}
if (type == '3') {
return createIcon({ icon: mapIcon51, iconSize, imageSize });
@@ -61,7 +63,7 @@ export function typeToIcon1(type: string) {
if (type === 'user') {
const iconS = [36, 88];
const imageS = [36, 88];
return createIcon({ icon: watchIconR, iconS, imageS });
return createIcon({ icon: watchIconR, iconSize: iconS, imageSize: imageS });
}
}
src/assets/mapUtils/map.ts
+34 -7
View File
@@ -24,6 +24,7 @@ export const Map = {
endMarker: null,
driving: null,
walking: null,
mapDriverOrWalkLoading: false,
/**
* @desc 地图舒适化
* @param el dom元素 id选择器
@@ -213,7 +214,7 @@ export const Map = {
if (computedCenter) {
this.setZoomCenter(center, zoom);
}
function createTextOverlayIcon(originalIconUrl, text, options = {}) {
function createTextOverlayIcon(originalIconUrl, text, type) {
return new Promise((resolve) => {
const canvas = document.createElement('canvas');
const ctx = canvas.getContext('2d');
@@ -221,14 +222,16 @@ export const Map = {
img.crossOrigin = 'anonymous';
img.onload = function () {
const width = type == 1 ? 40 : 28;
const height = type == 1 ? 69 : 49;
// 设置画布大小（比原图稍大以容纳文字）
canvas.width = 28;
canvas.height = 49 + 15; // 为文字留出空间
canvas.width = width;
canvas.height = height + 15; // 为文字留出空间
// 绘制原始图标
ctx.drawImage(img, 0, 10, 28, 49);
ctx.drawImage(img, 0, 10, width, height);
// 绘制圆形文字背景
const textX = 22; // 文字X坐标（居右对齐）
const textX = type == 1 ? 32 : 22; // 文字X坐标（居右对齐）
const textY = 11; // 文字Y坐标
const textWidth = ctx.measureText(text).width;
@@ -248,7 +251,7 @@ export const Map = {
ctx.textAlign = 'right';
ctx.textBaseline = 'middle';
ctx.fillStyle = '#ffffff';
ctx.fillText(text, 24.5, 10.8);
ctx.fillText(text, type == 1 ? 35 : 24.5, 10.8);
resolve(canvas.toDataURL());
};
@@ -274,7 +277,7 @@ export const Map = {
}
// 创建一个 Icon
const startIcon: any = typeToIcon(type);
const newIconUrl = await createTextOverlayIcon(startIcon, i + 1 + '');
const newIconUrl = await createTextOverlayIcon(startIcon, i + 1 + '', result[i]?.type);
// 将 icon 传入 marker
const startMarker = new AMap.Marker({
// 点的坐标
@@ -613,6 +616,30 @@ export const Map = {
});
});
},
/**
* @desc 根据坐标获取地址信息
* @param {Array} list 坐标点数组
*/
getInfoByPoint(list: number[]) {
const geocoder = new AMap.Geocoder({
city: '全国',
radius: 1000,
});
let lnglat = new AMap.LngLat(list[0], list[1]);
return new Promise((resolve, reject) => {
geocoder.getAddress(lnglat, (status, result) => {
if (status === 'complete' && result.regeocode) {
let code = result?.regeocode?.addressComponent?.adcode;
code = code.substring(0, 4) + '00';
if (code.substring(0, 3) !== '650') {
code = '650100';
}
return resolve(code);
}
return reject(result);
});
});
},
/**
* @desc 清除导航元素
*/
src/components/dialog/Dialog.vue
+2
View File
@@ -7,6 +7,7 @@
:width="props.width"
:maskClosable="true"
@cancel="handleCancel"
v-bind="$attrs"
destroy-on-close
>
<template #title>
@@ -23,6 +24,7 @@
:width="props.width"
:maskClosable="true"
@cancel="handleCancel"
v-bind="$attrs"
destroy-on-close
>
<template #title>
src/components/secondaryScreen/screen-right/screenRightHooks.ts
+1 -1
View File
@@ -47,7 +47,7 @@ export function sleepCharts({ time, short, long, awake, type }) {
grid: {
top: '15%',
left: '5%',
right: '5%',
right: '8%',
bottom: 30,
},
tooltip: {
src/components/xianMap/xianMapHooks.ts
+2 -2
View File
@@ -1,4 +1,4 @@
import { getAllList, getAllListNew, getAmbulanceList } from '/@/components/xianMap/xianMapApi.ts';
import { getAllListNew } from '/@/components/xianMap/xianMapApi.ts';
export enum TabType {
all = '', //所有资源
@@ -85,7 +85,7 @@ export function aircraftContent() {
</div>`;
}
export function mapApiSwitch(type, params: any) {
export function mapApiSwitch(type: any, params: any) {
// 全部 油田 医疗点 合作医院
if ([TabType.all, TabType.youTianYiYuan, TabType.jianKangXiaoWu, TabType.jiuHuChe, TabType.aed].includes(type)) {
// return getAllList({ ...params });
src/utils/env.ts
+1 -1
View File
@@ -12,7 +12,7 @@
export function getAppEnvConfig() {
// 1. 优先：运行时注入（Docker）
const runtimeEnv = (window as any).__APP_ENV__ || {};
const runtimeEnv = '';
// 2. 其次：构建时环境变量（.env 文件）
const buildEnv = import.meta.env;
src/views/components/emergencyDialog.vue
+3 -1
View File
@@ -1,6 +1,6 @@
<!--健康监测工具-->
<template>
<Dialog :openVis="visible" width="30%" :title="title" @close="closeDialog" :maskClosable="false">
<Dialog v-bind="$attrs" :openVis="visible" width="30%" class="emergency-dialog" :title="title" @close="closeDialog" :maskClosable="false">
<template #container>
<div class="police-con" :class="[themeType]">
<div class="sub-text">
@@ -55,6 +55,7 @@
orgName?: string;
type?: string;
phone?: string;
callType?: string;
}
const userInfo: Ref<UserInfo> = ref<any>({});
@@ -99,6 +100,7 @@
<style scoped lang="less">
.police-con {
padding: 2% 0 2% 5%;
position: relative;
.sub-text {
font-weight: bold;
src/views/components/employeeDialog.vue
+2 -2
View File
@@ -1,6 +1,6 @@
<!--应急求助-->
<template>
<Dialog :openVis="visible" width="30%" :title="title" @close="closeDialog" :maskClosable="false">
<Dialog v-bind="$attrs" :openVis="visible" width="30%" :title="title" @close="closeDialog" class="emergency-dialog" :maskClosable="false">
<template #container>
<div class="police-con" :class="[themeType]">
<div class="sub-text">有一个员工健康监测发生异常！</div>
@@ -84,6 +84,7 @@
userId: userInfo.value?.bindUserId,
hospitalList: list.map((item: any) => {
item['latitude'] = item['lat'];
item['longitude'] = item['lon'];
return item;
}),
@@ -97,7 +98,6 @@
<style scoped lang="less">
.police-con {
color: #ffffff;
background-color: #00152b;
padding: 2% 0 2% 5%;
.sub-text {
src/views/healthConsultation/HealthConsultationIndex.vue
+177 -3
View File
@@ -1,5 +1,5 @@
<template>
<div class="sun-screen-box">
<div class="sun-screen-box" ref="pageRef">
<div class="sun-screen-title">
<div class="sun-title-left">
{{ dateInfo?.day }} {{ dateInfo?.times }}<span style="margin-left: 30px">{{ rightDate }}</span>
@@ -26,6 +26,10 @@
</div>
</div>
</div>
<!-- 健康监测弹窗 -->
<EmployeeDialog ref="employeeDialogRef" :record="socketData" @confirm-help="confirmHelp" :get-container="() => pageRef" />
<!-- 应急、120弹窗 -->
<EmergencyDialog ref="emergencyDialogRef" :record="socketData1" @confirm-help="confirmHelp" :get-container="() => pageRef" />
</template>
<script setup lang="ts">
@@ -37,9 +41,16 @@
import healthContentBottomItem4 from './components/healthContentBottomItem4.vue';
import phonePng from '/@/assets/img/phone.png';
import { ref, onMounted, watch, onUnmounted } from 'vue';
import { ref, onMounted, watch, onUnmounted, nextTick } from 'vue';
import dayjs from 'dayjs';
import { startTime } from '/@/utils/utils.ts';
import { handleSocketUrl, startTime } from '/@/utils/utils.ts';
import { useUserStore } from '/@/store/modules/user.ts';
import { basicPath, useSocket, emergencyPath } from '/@/utils/socket.ts';
import EmployeeDialog from '/@/views/components/employeeDialog.vue';
import EmergencyDialog from '/@/views/components/emergencyDialog.vue';
import { useRouter } from 'vue-router';
const { getCenterInfo, setCount } = useUserStore();
interface DateInfo {
day?: string;
@@ -49,6 +60,7 @@
const rightDate = ref<string>('');
const initDate = ref(startTime);
const timer = ref<number | null>(null);
const pageRef = ref();
const getTime = () => {
dateInfo.value = {
@@ -92,6 +104,139 @@
clearInterval(timer.value);
}
});
// 健康监测工具报警
let socketUrl = handleSocketUrl(basicPath, getCenterInfo?.id);
const { socketData, setSocketData, closeSocket } = useSocket(socketUrl);
const employeeDialogRef = ref();
watch(socketData, (nVal) => {
if (nVal) {
nextTick(() => {
setCount();
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(); //紧急求助
onUnmounted(() => {
// 监听窗口关闭事件，当窗口关闭时，主动去关闭websocket连接，防止连接还没断开就关闭窗口，server端会抛异常。
window.onbeforeunload = function () {
closeSocket();
closeSocket1(); //西安云坐席
};
});
watch(socketData1, (nVal) => {
if (nVal) {
setCount();
setSocketData1(nVal);
emergencyDialogRef.value.openDialog();
}
});
const router = useRouter();
function confirmHelp(data: any) {
// const routeUrl = router.resolve({
// path: '/home1',
// }).href;
sessionStorage.setItem('socketData', JSON.stringify(data));
// window.open(routeUrl, '_blank');
router.push('/home1');
// sessionStorage.removeItem('socketData');
}
function openEmergencyOpen() {
setSocketData1({
userId: '1942871719583739905',
phone: '15129287781',
realName: '连龙刚',
lon: 108.94734,
lat: 34.218951,
sex: 2,
age: 37,
orgCode: 'A01A01A02',
orgName: '硬件部',
departCode: 'A01A01',
departName: '软硬件开发部',
type: '0',
centerId: '1940693902422519809',
popType: 1,
queue: null,
noticeId: null,
careLiaisonName: '周飞飞',
careLiaisonPhone: '18800001111',
lifeguardName: '李林林',
lifeguardPhone: '15511110000',
});
emergencyDialogRef.value.openDialog();
}
function employeeDialogOpen() {
setSocketData({
watchNo: 'A5GTQ24920002519',
eventType: 'a_key_alarm',
eventType_dictText: '一键告警',
bindUserId: '1942871719583739905',
bindDate: '2025-07-23',
createBy: 'apiusername',
createDate: '2025-09-25 15:01:11',
dataValue: '',
address: null,
lon: 0,
lat: 0,
dataDate: '2025-09-25',
warnTime: '2025-09-25 15:00:03',
gpsErrorMsg: '定位超时',
lonGd: null,
latGd: null,
addressGd: null,
sendFlag: '0',
largeScreenFlag: '0',
orgCode: 'A01A01A02',
orgName: '硬件部',
realName: '连龙刚',
phone: '15129287781',
hospitalList: [
{
name: '跃满油田作业区',
lon: 82.9955,
lat: 40.787056,
},
{
name: '跃满油田作业区',
lon: 82.9955,
lat: 40.787056,
},
{
name: '采油一厂稠油小屋',
lon: 84.881775,
lat: 44.987652,
},
],
centerId: '1940693902422519809',
popType: 3,
keyUser: '0',
avatar: null,
sex: 2,
age: 37,
workNo: '2025001',
deptName: '软硬件开发部',
audioUrl: null,
});
employeeDialogRef.value.openDialog();
}
// setTimeout(() => {
// openEmergencyOpen();
// employeeDialogOpen();
// }, 2000);
</script>
<style lang="less" scoped>
@@ -187,4 +332,33 @@
}
}
}
:deep(.emergency-dialog) {
position: relative;
&::before {
content: '';
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
background:
linear-gradient(to top, transparent calc(100% - 15px), #a0440f 100%),
linear-gradient(to bottom, transparent calc(100% - 15px), #a0440f 100%),
linear-gradient(to left, transparent calc(100% - 15px), #a0440f 100%),
linear-gradient(to right, transparent calc(100% - 15px), #a0440f 100%);
animation: borderFlash 2s ease-in-out infinite;
}
@keyframes borderFlash {
0% {
opacity: 1;
}
50% {
opacity: 0.5;
}
100% {
opacity: 1;
}
}
}
</style>
src/views/homePage.vue
+1
View File
@@ -128,6 +128,7 @@
})
.catch((err) => {
loading.value = false;
console.log(err);
});
}
src/views/indexSun.vue
+53 -32
View File
@@ -1,5 +1,5 @@
<template>
<div class="sun-screen-box">
<div class="sun-screen-box" ref="pageRef">
<login-out-button out-url="login" />
<div class="sun-screen-title">
<div class="sun-title-left">
@@ -70,9 +70,9 @@
</div>
<PhoneDialog ref="phoneDialogRef" :title="phoneDialogTitle" :useForm="true" :setting="setting" :phoneType="phoneType" />
<!-- 健康监测弹窗 -->
<EmployeeDialog ref="employeeDialogRef" :record="socketData" @confirm-help="confirmHelp" />
<EmployeeDialog ref="employeeDialogRef" :record="socketData" @confirm-help="confirmHelp" :get-container="() => pageRef" />
<!-- 应急、120弹窗 -->
<EmergencyDialog ref="emergencyDialogRef" :record="socketData1" @confirm-help="confirmHelp" />
<EmergencyDialog ref="emergencyDialogRef" :record="socketData1" @confirm-help="confirmHelp" :get-container="() => pageRef" />
<IndexModal
ref="indexModalRef"
:api="modalApi"
@@ -163,6 +163,7 @@
const phoneDialogTitle = ref('呼入电话');
const phoneDialogRef = ref();
const indexModalRef = ref();
const pageRef = ref();
const indexModalTitle = ref();
const indexColumn: any = ref([]);
const setting = getSettings(DataType.xian);
@@ -199,6 +200,11 @@
const centerInfo = getAuthCache('centerInfo');
centerId.value = centerInfo.id;
document.title = centerInfo.screenTitle || '健康服务中心';
if (sessionStorage.getItem('socketData')) {
confirmHelp(JSON.parse(sessionStorage.getItem('socketData')));
sessionStorage.removeItem('socketData');
}
});
const getTime = () => {
@@ -323,11 +329,6 @@
});
}
// 健康监测工具报警
let socketUrl = handleSocketUrl(basicPath, getCenterInfo?.id);
const { socketData, setSocketData, closeSocket } = useSocket(socketUrl);
const employeeDialogRef = ref();
function openEmergencyOpen() {
setSocketData1({
userId: '1942871719583739905',
@@ -408,11 +409,16 @@
employeeDialogRef.value.openDialog();
}
setTimeout(() => {
// employeeDialogOpen();
// openEmergencyOpen();
// yunZOpen();
}, 5000);
// setTimeout(() => {
// employeeDialogOpen();
// openEmergencyOpen();
// yunZOpen();
// }, 5000);
// 健康监测工具报警
let socketUrl = handleSocketUrl(basicPath, getCenterInfo?.id);
const { socketData, setSocketData, closeSocket } = useSocket(socketUrl);
const employeeDialogRef = ref();
watch(socketData, (nVal) => {
if (nVal) {
@@ -428,6 +434,7 @@
let socketUrl1 = handleSocketUrl(emergencyPath, getCenterInfo?.id);
const { socketData: socketData1, setSocketData: setSocketData1, closeSocket: closeSocket1 } = useSocket(socketUrl1, false);
const emergencyDialogRef = ref(); //紧急求助
watch(socketData1, (nVal) => {
if (nVal) {
setCount();
@@ -459,25 +466,14 @@
Map.removeOverlayGroup();
try {
hospitalList.value = data.hospitalList;
// showHospitalList.value = true;
//用户的坐标信息
let point = [data.lon, data.lat];
centerMapRef.value.setStartPosition(data);
// if (data.hospitalList && data.hospitalList.length > 0) {
// try {
const a = ((await getHospitalList(data.hospitalList, point)) as any) || [];
hospitalList.value = a.sort((a: any, b: any) => a.distance - b.distance);
// showHospitalList.value = true;
// } catch (error) {
// console.log('获取医院列表时出错:', error);
// }
// } else {
// console.log('没有医院list');
// }
// showMapBottom.value = true;
const arr = await Map.createOverlay1(
[...hospitalList.value, { latitude: data.lat, longitude: data.lon }],
hospitalList.value.concat([{ latitude: data.lat, longitude: data.lon }]),
{
content: (val: any) => {
return `<div style="
@@ -490,13 +486,8 @@
},
},
async (val) => {
if (val.type == '3') {
Map.createInfoModal({ option: val, content: infoContentSpecial(val) }, false);
} else if (val.type == '4') {
Map.createInfoModal({ option: val, content: infoContentSpecial(val) }, false);
} else {
Map.createInfoModal({ option: val, content: infoContentSpecial(val) }, false);
}
if (Map.mapDriverOrWalkLoading) return;
Map.createInfoModal({ option: val, content: infoContentSpecial(val) }, false);
const end = await Map.getAddressByPoint([val.lon, val.lat]);
if (!data?.address) {
data['address'] = await Map.getAddressByPoint([data.lon, data.lat]);
@@ -875,4 +866,34 @@
top: 15px;
right: 15px;
}
:deep(.emergency-dialog) {
position: relative;
&::before {
content: '';
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
background:
linear-gradient(to top, transparent calc(100% - 15px), #a0440f 100%),
linear-gradient(to bottom, transparent calc(100% - 15px), #a0440f 100%),
linear-gradient(to left, transparent calc(100% - 15px), #a0440f 100%),
linear-gradient(to right, transparent calc(100% - 15px), #a0440f 100%);
animation: borderFlash 2s ease-in-out infinite;
}
@keyframes borderFlash {
0% {
opacity: 1;
}
50% {
opacity: 0.5;
}
100% {
opacity: 1;
}
}
}
</style>
src/views/indexSun/centerMap.vue
+113 -80
View File
@@ -141,6 +141,8 @@
const routeList = ref<any[]>([]);
const emits = defineEmits(['clearHospitalList', 'showRestB', 'handleDetail']);
let placeSearch: any = null;
let sListen: any = null;
let eListen: any = null;
watch(
() => props.showHospitalList,
(v) => {
@@ -156,21 +158,15 @@
innerLineOption: innerLineLight,
outerLineOption: outerLineOption,
};
Map.initMap(op).then(() => {
getMapData(tabList[0].type);
Map.initMap(op).then(async () => {
await getMapData(tabList[0].type);
Map.map && Map.map.on('zoomend', setLevel);
Map.map && Map.map.on('zoomend', setLevel);
placeSearch = new Map.aMap.PlaceSearch({
extensions: 'all',
pageIndex: 1,
pageSize: 10,
showMarker: false,
await initPlaceSearch();
Map.map.on('moveend', async () => {
// 获取当前地图的中心点[citation:2][citation:6]
await initPlaceSearch();
});
// 确保 AutoComplete 加载完成后再使用
const startAuto = new Map.aMap.AutoComplete({ input: 'startInput' });
const endAuto = new Map.aMap.AutoComplete({ input: 'endInput' });
startAuto.on('select', startSelect);
endAuto.on('select', endSelect);
});
$bus.on(earlyWarning, (params) => {
drawMarker(params);
@@ -185,8 +181,35 @@
});
});
async function initPlaceSearch() {
placeSearch = null;
let city = {};
if (Map.map) {
const { lng, lat } = Map.map.getCenter();
city = await Map.getInfoByPoint([lng, lat]);
} else {
city = {};
}
// 确保 AutoComplete 加载完成后再使用
const startAuto = new Map.aMap.AutoComplete({ input: 'startInput', city, citylimit: true, closeResultOnScroll: false });
const endAuto = new Map.aMap.AutoComplete({ input: 'endInput', city, citylimit: true, closeResultOnScroll: false });
placeSearch = new Map.aMap.PlaceSearch({
city,
extensions: 'all',
pageIndex: 1,
pageSize: 30,
showMarker: false,
});
// const lnglat = Map.aMap.LngLat(87, 43);
// placeSearch.searchNearBy(lnglat, 1000);
sListen && startAuto.off(sListen);
eListen && endAuto.off(eListen);
sListen = startAuto.on('select', startSelect);
eListen = endAuto.on('select', endSelect);
}
function startSelect(e: any) {
placeSearch.search(e.poi.name, function (status, result) {
placeSearch.search(e.poi.name, function (status: any, result: any) {
if (status === 'complete' && result.poiList.pois.length > 0) {
const poi = result.poiList.pois[0]; // 取第一个结果
const { lat, lng } = poi.location;
@@ -199,7 +222,7 @@
}
function endSelect(e: any) {
placeSearch.search(e.poi.name, function (status, result) {
placeSearch.search(e.poi.name, function (status: any, result: any) {
if (status === 'complete' && result.poiList.pois.length > 0) {
const poi = result.poiList.pois[0]; // 取第一个结果
const { lat, lng } = poi.location;
@@ -211,7 +234,7 @@
});
}
function showDrivingLine(item) {
function showDrivingLine(item: any) {
nextTick(() => {
panelTitle.value = '全程' + item.driveTime + item.distance;
routeList.value = item.routeList?.map((item: any) => item?.instruction);
@@ -296,75 +319,87 @@
}
function getSearch({ startPosition, endPosition, start, end }) {
if (Map.mapDriverOrWalkLoading) return message.warn('路线规划中，请稍等');
Map.mapDriverOrWalkLoading = true;
Map.driving && Map.driving.clear();
Map.walking && Map.walking.clear();
const distance = Map.getDistance(startPosition, endPosition);
console.log(startPosition.join(','), endPosition.join(','));
searchFlag.value = true;
const startArr = new Map.aMap.LngLat(startPosition[0], startPosition[1]);
const endtArr = new Map.aMap.LngLat(endPosition[0], endPosition[1]);
// let map = new Map.aMap.Map('container', {
// resizeEnable: true,
// center: [116.397428, 39.90923], //地图中心点
// zoom: 13, //地图显示的缩放级别
// });
if (distance > 2000) {
Map.driving = new Map.aMap.Driving({
map: Map.map,
panel: 'panel',
});
Map.driving.search([{ keyword: start }, { keyword: end }], function (status: any) {
// result 即是对应的驾车导航信息，相关数据结构文档请参考 https://lbs.amap.com/api/javascript-api/reference/route-search#m_DrivingResult
if (status === 'complete') {
// console.log('绘制驾车路线完成');
try {
if (distance > 2000) {
Map.driving = new Map.aMap.Driving({
map: Map.map,
panel: 'panel',
});
Map.driving.search(startArr, endtArr, function (status: any) {
// result 即是对应的驾车导航信息，相关数据结构文档请参考 https://lbs.amap.com/api/javascript-api/reference/route-search#m_DrivingResult
if (status === 'complete') {
// console.log('绘制驾车路线完成');
searchFlag.value = false;
} else {
searchFlag.value = false;
}
});
Map.aMap.Event.addListener(Map.driving, 'complete', (res: any) => {
const data = JSON.parse(JSON.stringify(res));
searchFlag.value = false;
} else {
if (data.info == 'OK') {
const { routes } = data;
setTitle(routes[0]);
let arr = [];
arr.push(data.originName);
routes[0].steps.map((item: any) => {
arr.push(item.instruction);
});
arr.push(data.destinationName);
showRoutePanel.value = true;
routeList.value = arr;
Map.mapDriverOrWalkLoading = false;
}
});
} else {
Map.walking = new Map.aMap.Walking({
map: Map.map,
panel: 'panel',
});
Map.walking.search(startArr, endtArr, function (status: any) {
// result 即是对应的步行导航信息，相关数据结构文档请参考 https://lbs.amap.com/api/javascript-api/reference/route-search#m_DrivingResult
if (status === 'complete') {
// console.log('绘制步行路线完成');
searchFlag.value = false;
} else {
searchFlag.value = false;
}
});
Map.aMap.Event.addListener(Map.walking, 'complete', (res: any) => {
const data = JSON.parse(JSON.stringify(res));
searchFlag.value = false;
}
});
Map.aMap.Event.addListener(Map.driving, 'complete', (res: any) => {
const data = JSON.parse(JSON.stringify(res));
searchFlag.value = false;
if (data.info == 'OK') {
const { routes } = data;
setTitle(routes[0]);
let arr = [];
arr.push(data.originName);
routes[0].steps.map((item: any) => {
arr.push(item.instruction);
});
arr.push(data.destinationName);
showRoutePanel.value = true;
routeList.value = arr;
}
});
} else {
Map.walking = new Map.aMap.Walking({
map: Map.map,
panel: 'panel',
});
Map.walking.search([{ keyword: start }, { keyword: end }], function (status: any) {
// result 即是对应的步行导航信息，相关数据结构文档请参考 https://lbs.amap.com/api/javascript-api/reference/route-search#m_DrivingResult
if (status === 'complete') {
// console.log('绘制步行路线完成');
searchFlag.value = false;
} else {
searchFlag.value = false;
}
});
Map.aMap.Event.addListener(Map.walking, 'complete', (res: any) => {
const data = JSON.parse(JSON.stringify(res));
searchFlag.value = false;
if (data.info == 'ok') {
const { routes } = data;
setTitle(routes[0]);
let arr = [];
arr.push(data.originName);
routes[0].steps.map((item: any) => {
arr.push(item.instruction);
});
arr.push(data.destinationName);
showRoutePanel.value = true;
routeList.value = arr;
}
});
if (data.info == 'ok') {
const { routes } = data;
setTitle(routes[0]);
let arr = [];
arr.push(data.originName);
routes[0].steps.map((item: any) => {
arr.push(item.instruction);
});
arr.push(data.destinationName);
showRoutePanel.value = true;
routeList.value = arr;
Map.mapDriverOrWalkLoading = false;
}
});
}
} catch (e) {
console.log(e);
Map.mapDriverOrWalkLoading = false;
}
}
@@ -404,11 +439,6 @@
} else {
Map.createInfoModal({ option: val, content: infoContent1(val) });
}
// const viewBtn = document.getElementById(val.id);
// viewBtn.onclick = () => {
// handleClickDetail(val);
// };
},
true
);
@@ -622,7 +652,7 @@
.legend-img {
width: 20px;
margin-right: 5px;
margin: -4px 5px 0 0;
}
}
}
@@ -689,7 +719,6 @@
:deep(.modal-box) {
width: 330px;
height: 220px;
padding: 10px 20px;
display: flex;
flex-direction: column;
@@ -731,6 +760,10 @@
}
}
:deep(.modal-box-normal) {
width: 330px;
height: 150px;
}
:deep(.modal-box-normal-1) {
width: 330px;
height: 110px;
}
src/views/indexSun/indexSun.ts
+18 -4
View File
@@ -132,7 +132,7 @@ export const tabList = [
export const legendList = [
{ img: legend2, text: '健康小屋', color: '#1BEFF6' },
{ img: legend1, text: '油田医院', color: '#D86AF7' },
{ img: legend3, text: '救护车', color: '#EE7E31' },
{ img: legend3, text: '救护车', color: '#45FFA1' },
{ img: legend4, text: 'AED', color: '#F23F3D' },
];
@@ -143,11 +143,15 @@ export function infoContent(res: any) {
<span class="item-one">单位：</span>
<span class="item-two">${res.orgName ? res.orgName : '--'}</span>
</div>
<div class="modal-item" >
<div class="modal-item" style="margin: 5px 0">
<span class="item-one">关爱人数：</span>
<span class="item-two">${res.loveNum ? res.loveNum : '--'}</span>
</div>
<div class="modal-item">
<div class="modal-item" style="margin: 0 0 5px 0;">
<span class="item-one">电话：</span>
<span class="item-two">${res.mobile ? res.mobile : '--'}</span>
</div>
<div class="modal-item" style="margin: 0 0 5px 0;">
<span class="item-one">地点：</span>
<span class="item-two">${res.name ? res.name : '--'}</span>
</div>
@@ -158,11 +162,21 @@ export function infoContent(res: any) {
}
export function infoContent1(res: any) {
return `
<div class="modal-box modal-box-normal">
<div class="modal-box ${res.type === '1' ? 'modal-box-normal' : 'modal-box-normal-1'}">
<div class="modal-item">
<span class="item-one">${res.type === '1' ? '医院名称' : '救护车名称'}：</span>
<span class="item-two">${res.name ? res.name : '--'}</span>
</div>
${
res.type === '1'
? `
<div class="modal-item" style="margin: 5px 0">
<span class="item-one">电话：</span>
<span class="item-two">${res.mobile ? res.mobile : '--'}</span>
</div>
`
: ``
}
<div class="modal-item">
<span class="item-one">地点：</span>
<span class="item-two">${res.orgName ? res.orgName : '--'}</span>
src/views/indexSun/oneRightNew.vue
+17 -3
View File
@@ -57,7 +57,7 @@
<div style="color: #ffffff">{{ props.userData?.careLiaisonPhone }}</div>
</template>
<template v-else>
<div class="no-data"> 该员工暂未设置关爱联络员 <img :src="pointPng" alt="" /></div>
<div class="no-data"> 暂未配置关爱联络员 <img :src="pointPng" alt="" /></div>
</template>
</div>
<div>
@@ -67,7 +67,7 @@
<div style="color: #ffffff">{{ props.userData?.lifeguardPhone }}</div>
</template>
<template v-else>
<div class="no-data"> 该员工暂未设置急救人员 <img :src="pointPng" alt="" /></div>
<div class="no-data"> 暂未配置急救人员 <img :src="pointPng" alt="" /></div>
</template>
</div>
</div>
@@ -155,7 +155,21 @@
const emit = defineEmits(['handleView', 'handleEmer']);
const openInfo = ref<boolean>(false);
const archives = ref<object>({});
interface archivesInfo {
bmi?: any;
ua?: any;
hcy?: any;
glu?: any;
sbp?: any;
dbp?: any;
tc?: any;
tg?: any;
ldl?: any;
pastHistory?: any;
surgicalHistory?: any;
medicationHistory?: any;
}
const archives = ref<archivesInfo>({});
watch(
() => props.userData,
src/views/indexSun/threeLeftNew.vue
+52 -52
View File
@@ -5,10 +5,10 @@
</div>
<div style="flex: 1" class="content">
<div class="content-search content-search-select">
<a-select v-model:value="selectValue" class="type-select" :options="selectOptions" @change="getData">
<a-select v-model:value="selectValue" class="type-select" :options="selectOptions">
<a-select-option value="全部数据">全部数据</a-select-option>
</a-select>
<a-select v-model:value="selectValue1" class="type-select" :options="selectOption1" @change="getData" />
<a-select v-model:value="selectValue1" class="type-select" :options="selectOption1" />
</div>
<div class="content-search content-search-new">
<div class="type-time">
@@ -113,7 +113,7 @@
{ label: '近一月', value: 'month' },
{ label: '近一年', value: 'year' },
]);
const newChart = ref<HTMLElement>();
// const newChart = ref<HTMLElement>();
function clickChooseType(type: any) {
if (timer.value) {
clearInterval(timer.value);
@@ -124,14 +124,14 @@
} else {
chooseType.value = 0;
}
getData();
// getData();
}, 10000);
}
if (chooseType.value === type) return;
chooseType.value = type;
nextTick(() => {
getData();
});
// nextTick(() => {
// getData();
// });
}
onMounted(() => {
@@ -140,24 +140,24 @@
}
setTimer();
});
watch(props, () => {
selectValue.value = '';
getData();
});
// watch(props, () => {
// selectValue.value = '';
// getData();
// });
function setTimer() {
if (timer.value) {
clearInterval(timer.value);
}
chooseType.value = 0;
getData();
// getData();
timer.value = setInterval(() => {
if (chooseType.value !== 5) {
chooseType.value += 1;
} else {
chooseType.value = 0;
}
getData();
// getData();
}, 10000);
}
@@ -186,45 +186,45 @@
});
}
const myChart = ref();
function getData() {
twoLApi({
sex: chooseType.value,
depart: selectValue.value,
centerId: getCenterInfo?.id,
})
.then((res: any) => {
if (res.code == 200) {
initChart(res.result);
}
})
.catch((err) => {
console.log(err);
});
}
function initChart(value: any) {
nextTick(() => {
myChart.value = echarts.init(newChart.value!);
const dx =
value.map((item: any) => {
return item.name;
}) || [];
const dy =
value.map((item: any) => {
return item.count;
}) || [];
const max =
value.sort((a: any, b: any) => b.count - a.count).length > 0 ? value.sort((a: any, b: any) => b.count - a.count)[0].count : [];
const m = max % 25 === 0 ? max : (parseInt(max / 25) + 1) * 25;
let option = getClassCharts(dx, dy, m);
myChart.value.setOption(option);
window.addEventListener('resize', () => {
myChart.value.resize();
});
});
}
// const myChart = ref();
// function getData() {
// twoLApi({
// sex: chooseType.value,
// depart: selectValue.value,
// centerId: getCenterInfo?.id,
// })
// .then((res: any) => {
// if (res.code == 200) {
// initChart(res.result);
// }
// })
// .catch((err) => {
// console.log(err);
// });
// }
//
// function initChart(value: any) {
// nextTick(() => {
// myChart.value = echarts.init(newChart.value);
// const dx =
// value.map((item: any) => {
// return item.name;
// }) || [];
// const dy =
// value.map((item: any) => {
// return item.count;
// }) || [];
//
// const max =
// value.sort((a: any, b: any) => b.count - a.count).length > 0 ? value.sort((a: any, b: any) => b.count - a.count)[0].count : [];
// const m = max % 25 === 0 ? max : (parseInt(max / 25) + 1) * 25;
// let option = getClassCharts(dx, dy, m);
// myChart.value.setOption(option);
// window.addEventListener('resize', () => {
// myChart.value.resize();
// });
// });
// }
const emit = defineEmits(['handleView']);
function handleView() {
emit('handleView');