|
|
|
|
@ -112,11 +112,11 @@
@@ -112,11 +112,11 @@
|
|
|
|
|
import { useDebounceFn } from '@vueuse/core'; |
|
|
|
|
import { EventSourcePolyfill } from 'event-source-polyfill/src/eventsource'; |
|
|
|
|
import { getAccessToken } from '/@/utils/auth'; |
|
|
|
|
import { useTimeoutFn } from '@vueuse/core' |
|
|
|
|
|
|
|
|
|
/** 类型规范统一声明定义区域 */ |
|
|
|
|
interface MapState { |
|
|
|
|
first: boolean; |
|
|
|
|
loading: boolean; |
|
|
|
|
defaultZoom: number; |
|
|
|
|
toggleOperatePanelClass: Recordable; |
|
|
|
|
toggleStatus: boolean; |
|
|
|
|
@ -168,8 +168,6 @@
@@ -168,8 +168,6 @@
|
|
|
|
|
const mapState = reactive<MapState>({ |
|
|
|
|
/** 首次初始化 */ |
|
|
|
|
first: false, |
|
|
|
|
/** 遮罩层状态 */ |
|
|
|
|
loading: false, |
|
|
|
|
/** 默认缩放大小 */ |
|
|
|
|
defaultZoom: 7, |
|
|
|
|
/** 面板类样式属性 */ |
|
|
|
|
@ -242,53 +240,75 @@
@@ -242,53 +240,75 @@
|
|
|
|
|
|
|
|
|
|
onBeforeMount(() => { |
|
|
|
|
if (!instance) return; |
|
|
|
|
mapState.loading = true; |
|
|
|
|
// 初始化高德地图组件 |
|
|
|
|
AMapLoader.load({ |
|
|
|
|
key: mapState.mapConfig.amapKey, |
|
|
|
|
version: '2.0', |
|
|
|
|
plugins: ['AMap.MarkerCluster', 'AMap.Driving'] |
|
|
|
|
}).then(async AMap => { |
|
|
|
|
// 创建地图实例 |
|
|
|
|
map = new AMap.Map(instance.refs.mapview, mapState.mapConfig.options); |
|
|
|
|
map.plugin(['AMap.ToolBar', 'AMap.MapType', 'AMap.ControlBar', 'AMap.Scale'], () => { |
|
|
|
|
if (mapProps.mapControl?.includes('toolBar')) { |
|
|
|
|
// 地图操作工具条插件 |
|
|
|
|
map.addControl(new AMap.ToolBar()); |
|
|
|
|
} |
|
|
|
|
if (mapProps.mapControl?.includes('controlBar')) { |
|
|
|
|
// 组合了旋转,倾斜,复位,缩放插件 |
|
|
|
|
map.addControl(new AMap.ControlBar()); |
|
|
|
|
} |
|
|
|
|
if (mapProps.mapControl?.includes('scale')) { |
|
|
|
|
// 比例尺插件 |
|
|
|
|
const scale = new AMap.Scale(); |
|
|
|
|
scale.show(); |
|
|
|
|
map.addControl(scale); |
|
|
|
|
} |
|
|
|
|
if (mapProps.mapControl?.includes('mapType')) { |
|
|
|
|
// 地图类型切换插件 |
|
|
|
|
map.addControl( |
|
|
|
|
new AMap.MapType({ |
|
|
|
|
defaultType: 0, |
|
|
|
|
showRoad: true |
|
|
|
|
}) |
|
|
|
|
); |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
map.on('zoomchange', ctx => { |
|
|
|
|
mapState.defaultZoom = subtract(divide(map.getZoom(),2), 1); |
|
|
|
|
}); |
|
|
|
|
useTimeoutFn(() => { |
|
|
|
|
// 创建地图实例 |
|
|
|
|
map = new AMap.Map(instance.refs.mapview, mapState.mapConfig.options); |
|
|
|
|
map.plugin(['AMap.ToolBar', 'AMap.MapType', 'AMap.ControlBar', 'AMap.Scale'], () => { |
|
|
|
|
if (mapProps.mapControl?.includes('toolBar')) { |
|
|
|
|
// 地图操作工具条插件 |
|
|
|
|
map.addControl(new AMap.ToolBar()); |
|
|
|
|
} |
|
|
|
|
if (mapProps.mapControl?.includes('controlBar')) { |
|
|
|
|
// 组合了旋转,倾斜,复位,缩放插件 |
|
|
|
|
map.addControl(new AMap.ControlBar()); |
|
|
|
|
} |
|
|
|
|
if (mapProps.mapControl?.includes('scale')) { |
|
|
|
|
// 比例尺插件 |
|
|
|
|
const scale = new AMap.Scale(); |
|
|
|
|
scale.show(); |
|
|
|
|
map.addControl(scale); |
|
|
|
|
} |
|
|
|
|
if (mapProps.mapControl?.includes('mapType')) { |
|
|
|
|
// 地图类型切换插件 |
|
|
|
|
map.addControl( |
|
|
|
|
new AMap.MapType({ |
|
|
|
|
defaultType: 0, |
|
|
|
|
showRoad: true |
|
|
|
|
}) |
|
|
|
|
); |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
map.on('zoomchange', ctx => { |
|
|
|
|
mapState.defaultZoom = subtract(divide(map.getZoom(),2), 1); |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
// 医院集群标记点 |
|
|
|
|
hospitalMarkerCluster = new AMap.MarkerCluster(map, [], { |
|
|
|
|
gridSize: 80, |
|
|
|
|
maxZoom: 14, |
|
|
|
|
renderMarker(ctx) { |
|
|
|
|
const { marker, data } = ctx; |
|
|
|
|
if (Array.isArray(data) && data[0]) { |
|
|
|
|
const { label, mapOrientation, mapNotify } = data[0]; |
|
|
|
|
let content = `<img width="30px" height="30px" style="transform: scale(1) rotate(${360 - Number(mapOrientation)}deg);" src='${hospital}'/>`; |
|
|
|
|
// 医院集群标记点 |
|
|
|
|
hospitalMarkerCluster = new AMap.MarkerCluster(map, [], { |
|
|
|
|
gridSize: 80, |
|
|
|
|
maxZoom: 14, |
|
|
|
|
renderMarker(ctx) { |
|
|
|
|
const { marker, data } = ctx; |
|
|
|
|
if (Array.isArray(data) && data[0]) { |
|
|
|
|
const { label, mapOrientation, mapNotify } = data[0]; |
|
|
|
|
let content = `<img width="30px" height="30px" style="transform: scale(1) rotate(${360 - Number(mapOrientation)}deg);" src='${hospital}'/>`; |
|
|
|
|
marker.setLabel({ |
|
|
|
|
direction: 'bottom', |
|
|
|
|
// 设置文本标注偏移量 |
|
|
|
|
offset: new AMap.Pixel(-4, 0), |
|
|
|
|
// 设置文本标注内容 |
|
|
|
|
content: `<div>${label}</div>` |
|
|
|
|
}); |
|
|
|
|
marker.setOffset(new AMap.Pixel(-18, -10)); |
|
|
|
|
if (mapNotify) { |
|
|
|
|
content = `<img width="30px" height="30px" style="transform: scale(1) rotate(${360 - Number(mapOrientation)}deg);" src='${hospitalTwinkle}'/>`; |
|
|
|
|
} |
|
|
|
|
marker.setContent(content); |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
renderClusterMarker(ctx) { |
|
|
|
|
const { clusterData, marker, count } = ctx; |
|
|
|
|
let content = `<img width="30px" height="30px" src='${hospital}'/>`; |
|
|
|
|
if(clusterData.some(item => item.mapNotify)){ |
|
|
|
|
content = `<img width="30px" height="30px" src='${hospitalTwinkle}'/>`; |
|
|
|
|
} |
|
|
|
|
marker.setContent(content); |
|
|
|
|
const label = count == 1 ? clusterData[0].label : `医院数量:${count}`; |
|
|
|
|
marker.setLabel({ |
|
|
|
|
direction: 'bottom', |
|
|
|
|
// 设置文本标注偏移量 |
|
|
|
|
@ -297,45 +317,38 @@
@@ -297,45 +317,38 @@
|
|
|
|
|
content: `<div>${label}</div>` |
|
|
|
|
}); |
|
|
|
|
marker.setOffset(new AMap.Pixel(-18, -10)); |
|
|
|
|
if (mapNotify) { |
|
|
|
|
content = `<img width="30px" height="30px" style="transform: scale(1) rotate(${360 - Number(mapOrientation)}deg);" src='${hospitalTwinkle}'/>`; |
|
|
|
|
} |
|
|
|
|
marker.setContent(content); |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
renderClusterMarker(ctx) { |
|
|
|
|
const { clusterData, marker, count } = ctx; |
|
|
|
|
let content = `<img width="30px" height="30px" src='${hospital}'/>`; |
|
|
|
|
if(clusterData.some(item => item.mapNotify)){ |
|
|
|
|
content = `<img width="30px" height="30px" src='${hospitalTwinkle}'/>`; |
|
|
|
|
} |
|
|
|
|
marker.setContent(content); |
|
|
|
|
const label = count == 1 ? clusterData[0].label : `医院数量:${count}`; |
|
|
|
|
marker.setLabel({ |
|
|
|
|
direction: 'bottom', |
|
|
|
|
// 设置文本标注偏移量 |
|
|
|
|
offset: new AMap.Pixel(-4, 0), |
|
|
|
|
// 设置文本标注内容 |
|
|
|
|
content: `<div>${label}</div>` |
|
|
|
|
}); |
|
|
|
|
marker.setOffset(new AMap.Pixel(-18, -10)); |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
hospitalMarkerCluster.on('click', ctx => { |
|
|
|
|
const { lnglat } = ctx; |
|
|
|
|
map.setZoomAndCenter(18, lnglat); |
|
|
|
|
}); |
|
|
|
|
}); |
|
|
|
|
hospitalMarkerCluster.on('click', ctx => { |
|
|
|
|
const { lnglat } = ctx; |
|
|
|
|
map.setZoomAndCenter(18, lnglat); |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
// 医检机构集群标记点 |
|
|
|
|
orgMarkerCluster = new AMap.MarkerCluster(map, [], { |
|
|
|
|
gridSize: 80, |
|
|
|
|
maxZoom: 14, |
|
|
|
|
renderMarker(ctx) { |
|
|
|
|
const { marker, data } = ctx; |
|
|
|
|
if (Array.isArray(data) && data[0]) { |
|
|
|
|
const { label, mapOrientation } = data[0]; |
|
|
|
|
const content = `<img width="30px" height="30px" style="transform: scale(1) rotate(${360 - Number(mapOrientation)}deg);" src='${redFlag}'/>`; |
|
|
|
|
// 医检机构集群标记点 |
|
|
|
|
orgMarkerCluster = new AMap.MarkerCluster(map, [], { |
|
|
|
|
gridSize: 80, |
|
|
|
|
maxZoom: 14, |
|
|
|
|
renderMarker(ctx) { |
|
|
|
|
const { marker, data } = ctx; |
|
|
|
|
if (Array.isArray(data) && data[0]) { |
|
|
|
|
const { label, mapOrientation } = data[0]; |
|
|
|
|
const content = `<img width="30px" height="30px" style="transform: scale(1) rotate(${360 - Number(mapOrientation)}deg);" src='${redFlag}'/>`; |
|
|
|
|
marker.setContent(content); |
|
|
|
|
marker.setLabel({ |
|
|
|
|
direction: 'bottom', |
|
|
|
|
// 设置文本标注偏移量 |
|
|
|
|
offset: new AMap.Pixel(-4, 0), |
|
|
|
|
// 设置文本标注内容 |
|
|
|
|
content: `<div>${label}</div>` |
|
|
|
|
}); |
|
|
|
|
marker.setOffset(new AMap.Pixel(-18, -10)); |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
renderClusterMarker(ctx) { |
|
|
|
|
const { clusterData, marker, count } = ctx; |
|
|
|
|
const content = `<img width="30px" height="30px" src='${redFlag}'/>`; |
|
|
|
|
marker.setContent(content); |
|
|
|
|
const label = count == 1 ? clusterData[0].label : `医检机构数量:${count}`; |
|
|
|
|
marker.setLabel({ |
|
|
|
|
direction: 'bottom', |
|
|
|
|
// 设置文本标注偏移量 |
|
|
|
|
@ -345,37 +358,37 @@
@@ -345,37 +358,37 @@
|
|
|
|
|
}); |
|
|
|
|
marker.setOffset(new AMap.Pixel(-18, -10)); |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
renderClusterMarker(ctx) { |
|
|
|
|
const { clusterData, marker, count } = ctx; |
|
|
|
|
const content = `<img width="30px" height="30px" src='${redFlag}'/>`; |
|
|
|
|
marker.setContent(content); |
|
|
|
|
const label = count == 1 ? clusterData[0].label : `医检机构数量:${count}`; |
|
|
|
|
marker.setLabel({ |
|
|
|
|
direction: 'bottom', |
|
|
|
|
// 设置文本标注偏移量 |
|
|
|
|
offset: new AMap.Pixel(-4, 0), |
|
|
|
|
// 设置文本标注内容 |
|
|
|
|
content: `<div>${label}</div>` |
|
|
|
|
}); |
|
|
|
|
marker.setOffset(new AMap.Pixel(-18, -10)); |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
orgMarkerCluster.on('click', ctx => { |
|
|
|
|
const { lnglat } = ctx; |
|
|
|
|
map.setZoomAndCenter(18, lnglat); |
|
|
|
|
}); |
|
|
|
|
}); |
|
|
|
|
orgMarkerCluster.on('click', ctx => { |
|
|
|
|
const { lnglat } = ctx; |
|
|
|
|
map.setZoomAndCenter(18, lnglat); |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
// 收样员集群标记点 |
|
|
|
|
courierUserMarkerCluster = new AMap.MarkerCluster(map, [], { |
|
|
|
|
gridSize: 80, |
|
|
|
|
maxZoom: 14, |
|
|
|
|
renderMarker(ctx) { |
|
|
|
|
const { marker, data } = ctx; |
|
|
|
|
if (Array.isArray(data) && data[0]) { |
|
|
|
|
const { label, mapOrientation } = data[0]; |
|
|
|
|
const content = `<img width="30px" height="30px" style="transform: scale(1) rotate(${360 - Number(mapOrientation)}deg);" src='${medicalKit}'/>`; |
|
|
|
|
// 收样员集群标记点 |
|
|
|
|
courierUserMarkerCluster = new AMap.MarkerCluster(map, [], { |
|
|
|
|
gridSize: 80, |
|
|
|
|
maxZoom: 14, |
|
|
|
|
renderMarker(ctx) { |
|
|
|
|
const { marker, data } = ctx; |
|
|
|
|
if (Array.isArray(data) && data[0]) { |
|
|
|
|
const { label, mapOrientation } = data[0]; |
|
|
|
|
const content = `<img width="30px" height="30px" style="transform: scale(1) rotate(${360 - Number(mapOrientation)}deg);" src='${medicalKit}'/>`; |
|
|
|
|
marker.setContent(content); |
|
|
|
|
marker.setLabel({ |
|
|
|
|
direction: 'bottom', |
|
|
|
|
// 设置文本标注偏移量 |
|
|
|
|
offset: new AMap.Pixel(-4, 0), |
|
|
|
|
// 设置文本标注内容 |
|
|
|
|
content: `<div>${label}</div>` |
|
|
|
|
}); |
|
|
|
|
marker.setOffset(new AMap.Pixel(-18, -10)); |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
renderClusterMarker(ctx) { |
|
|
|
|
const { clusterData, marker, count } = ctx; |
|
|
|
|
const content = `<img width="30px" height="30px" src='${medicalKit}'/>`; |
|
|
|
|
marker.setContent(content); |
|
|
|
|
const label = count == 1 ? clusterData[0].label : `收样员数量:${count}`; |
|
|
|
|
marker.setLabel({ |
|
|
|
|
direction: 'bottom', |
|
|
|
|
// 设置文本标注偏移量 |
|
|
|
|
@ -385,102 +398,87 @@
@@ -385,102 +398,87 @@
|
|
|
|
|
}); |
|
|
|
|
marker.setOffset(new AMap.Pixel(-18, -10)); |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
renderClusterMarker(ctx) { |
|
|
|
|
const { clusterData, marker, count } = ctx; |
|
|
|
|
const content = `<img width="30px" height="30px" src='${medicalKit}'/>`; |
|
|
|
|
marker.setContent(content); |
|
|
|
|
const label = count == 1 ? clusterData[0].label : `收样员数量:${count}`; |
|
|
|
|
marker.setLabel({ |
|
|
|
|
direction: 'bottom', |
|
|
|
|
// 设置文本标注偏移量 |
|
|
|
|
offset: new AMap.Pixel(-4, 0), |
|
|
|
|
// 设置文本标注内容 |
|
|
|
|
content: `<div>${label}</div>` |
|
|
|
|
}); |
|
|
|
|
marker.setOffset(new AMap.Pixel(-18, -10)); |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
courierUserMarkerCluster.on('click', ctx => { |
|
|
|
|
const { lnglat } = ctx; |
|
|
|
|
map.setZoomAndCenter(18, lnglat); |
|
|
|
|
}); |
|
|
|
|
}); |
|
|
|
|
courierUserMarkerCluster.on('click', ctx => { |
|
|
|
|
const { lnglat } = ctx; |
|
|
|
|
map.setZoomAndCenter(18, lnglat); |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
// 扫描收样员园形范围 |
|
|
|
|
scanCourierUserCircleRange = new AMap.Circle({ |
|
|
|
|
radius: 14000, |
|
|
|
|
borderWeight: 3, |
|
|
|
|
strokeColor: '#3600ff', |
|
|
|
|
strokeOpacity: 0, |
|
|
|
|
strokeWeight: 6, |
|
|
|
|
fillOpacity: 0, |
|
|
|
|
strokeStyle: 'dashed', |
|
|
|
|
strokeDasharray: [8, 8], |
|
|
|
|
fillColor: '#1791fc', |
|
|
|
|
zIndex: 50 |
|
|
|
|
}); |
|
|
|
|
// 扫描收样员园形范围 |
|
|
|
|
scanCourierUserCircleRange = new AMap.Circle({ |
|
|
|
|
radius: 14000, |
|
|
|
|
borderWeight: 3, |
|
|
|
|
strokeColor: '#3600ff', |
|
|
|
|
strokeOpacity: 0, |
|
|
|
|
strokeWeight: 6, |
|
|
|
|
fillOpacity: 0, |
|
|
|
|
strokeStyle: 'dashed', |
|
|
|
|
strokeDasharray: [8, 8], |
|
|
|
|
fillColor: '#1791fc', |
|
|
|
|
zIndex: 50 |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
// 构造路线导航类 |
|
|
|
|
driving = new AMap.Driving({ |
|
|
|
|
map: map, |
|
|
|
|
panel: instance.refs.mapPanel |
|
|
|
|
}); |
|
|
|
|
// 构造路线导航类 |
|
|
|
|
driving = new AMap.Driving({ |
|
|
|
|
map: map, |
|
|
|
|
panel: instance.refs.mapPanel |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
// 初始化地图组件所需数据 |
|
|
|
|
const hospitalList = await listHospital({ size: 40, mapNotify: '1' }); |
|
|
|
|
mapState.hospitalList = hospitalList.data?.map(item => ({ |
|
|
|
|
value: item.id, |
|
|
|
|
label: item.name, |
|
|
|
|
mapLat: item.mapLat, |
|
|
|
|
mapLng: item.mapLng, |
|
|
|
|
mapNotify: !!~~item.mapNotify, |
|
|
|
|
mapOrientation: item.mapOrientation |
|
|
|
|
})); |
|
|
|
|
const hospitalPoints = mapState.hospitalList.map(hospital => ({ |
|
|
|
|
lnglat: [hospital.mapLng, hospital.mapLat], ...hospital |
|
|
|
|
})); |
|
|
|
|
hospitalMarkerCluster?.setData(hospitalPoints); |
|
|
|
|
const orgList = await listOrg({ size: 40 }); |
|
|
|
|
mapState.orgList = orgList.data?.map(item => ({ |
|
|
|
|
value: item.id, |
|
|
|
|
label: item.name, |
|
|
|
|
mapOrientation: item.mapOrientation, |
|
|
|
|
mapLat: item.mapLat, |
|
|
|
|
mapLng: item.mapLng |
|
|
|
|
})); |
|
|
|
|
const orgPoints = mapState.orgList.map(org => ({ |
|
|
|
|
lnglat: [org.mapLng, org.mapLat], ...org |
|
|
|
|
})); |
|
|
|
|
orgMarkerCluster?.setData(orgPoints); |
|
|
|
|
// 初始化地图组件所需数据 |
|
|
|
|
const hospitalList = await listHospital({ size: 40, mapNotify: '1' }); |
|
|
|
|
mapState.hospitalList = hospitalList.data?.map(item => ({ |
|
|
|
|
value: item.id, |
|
|
|
|
label: item.name, |
|
|
|
|
mapLat: item.mapLat, |
|
|
|
|
mapLng: item.mapLng, |
|
|
|
|
mapNotify: !!~~item.mapNotify, |
|
|
|
|
mapOrientation: item.mapOrientation |
|
|
|
|
})); |
|
|
|
|
const hospitalPoints = mapState.hospitalList.map(hospital => ({ |
|
|
|
|
lnglat: [hospital.mapLng, hospital.mapLat], ...hospital |
|
|
|
|
})); |
|
|
|
|
hospitalMarkerCluster?.setData(hospitalPoints); |
|
|
|
|
const orgList = await listOrg({ size: 40 }); |
|
|
|
|
mapState.orgList = orgList.data?.map(item => ({ |
|
|
|
|
value: item.id, |
|
|
|
|
label: item.name, |
|
|
|
|
mapOrientation: item.mapOrientation, |
|
|
|
|
mapLat: item.mapLat, |
|
|
|
|
mapLng: item.mapLng |
|
|
|
|
})); |
|
|
|
|
const orgPoints = mapState.orgList.map(org => ({ |
|
|
|
|
lnglat: [org.mapLng, org.mapLat], ...org |
|
|
|
|
})); |
|
|
|
|
orgMarkerCluster?.setData(orgPoints); |
|
|
|
|
|
|
|
|
|
// sse长轮询连接获取收样员gps位置 |
|
|
|
|
eventSource = new EventSourcePolyfill(mapDesigner.sseUrl, { |
|
|
|
|
headers: { Authorization: `Bearer ${getAccessToken()}` } |
|
|
|
|
}); |
|
|
|
|
// sse长轮询连接获取收样员gps位置 |
|
|
|
|
eventSource = new EventSourcePolyfill(mapDesigner.sseUrl, { |
|
|
|
|
headers: { Authorization: `Bearer ${getAccessToken()}` } |
|
|
|
|
}); |
|
|
|
|
|
|
|
|
|
eventSource.onopen = function (ev) { |
|
|
|
|
console.info(ev,'建立连接。。。'); |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
eventSource.onmessage = function (ev) { |
|
|
|
|
try { |
|
|
|
|
let { data } = ev; |
|
|
|
|
let mapLogistic = JSON.parse(data); |
|
|
|
|
let courierUser = mapState.courierUserList.find(item => item.value == mapLogistic?.courierUserId); |
|
|
|
|
courierUser && (courierUser.mapLat = mapLogistic.courierLat); |
|
|
|
|
courierUser && (courierUser.mapLng = mapLogistic.courierLng); |
|
|
|
|
} catch (e) {} |
|
|
|
|
console.info(ev); |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
eventSource.onerror = function (ev) { |
|
|
|
|
console.info(ev); |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
// 加载完毕 |
|
|
|
|
complete(); |
|
|
|
|
eventSource.onopen = function (ev) { |
|
|
|
|
console.info(ev,'建立连接。。。'); |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
eventSource.onmessage = function (ev) { |
|
|
|
|
try { |
|
|
|
|
let { data } = ev; |
|
|
|
|
let mapLogistic = JSON.parse(data); |
|
|
|
|
let courierUser = mapState.courierUserList.find(item => item.value == mapLogistic?.courierUserId); |
|
|
|
|
courierUser && (courierUser.mapLat = mapLogistic.courierLat); |
|
|
|
|
courierUser && (courierUser.mapLng = mapLogistic.courierLng); |
|
|
|
|
} catch (e) {} |
|
|
|
|
console.info(ev); |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
eventSource.onerror = function (ev) { |
|
|
|
|
console.info(ev); |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
// 加载完毕 |
|
|
|
|
complete(); |
|
|
|
|
},350, { immediate: true }); |
|
|
|
|
}).catch(error => { |
|
|
|
|
mapState.loading = false; |
|
|
|
|
throw error; |
|
|
|
|
}); |
|
|
|
|
}); |
|
|
|
|
@ -497,7 +495,6 @@
@@ -497,7 +495,6 @@
|
|
|
|
|
if (map) { |
|
|
|
|
setMapDataJson(mapProps.options); |
|
|
|
|
handleSetCourierUserList(); |
|
|
|
|
mapState.loading = false; |
|
|
|
|
mapState.first = true; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
wangxiang
2 years ago