update
1.应急事件显示信息过长，精简一下。 2.救护车图标配色调整 3.医院图标增大一点，显示图标及应急求助时的推荐图标 4.急救弹窗添加呼吸效果 5.急救路线搜索框，控制只搜索新疆境内 6.咨询大屏也要监听事件并弹出弹窗
This commit is contained in:
@@ -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;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user