-
-
-
-
- 4009-120-999
-
-
-
- `;
- const markers = [];
- for (let i = 0; i < result.length; i++) {
- let { lon, lat } = result[i];
- const marker = new AMap.Marker({
- // 点的坐标
- position: [lon, lat],
- //启用点击事件 如果需要点击事件，必须开启
- clickable: true,
- title: `4009-120-999`,
- content: content,
- offset: new AMap.Pixel(-16, -30),
- });
- markers.push(marker);
- }
-
- // //将组 挂载到地图上
- // this.aircraftGroup.setMap(this.map);
- // //将需要批量控制的点放到一个组中，通过控制组，就可以操作组内所有所有覆盖物
- // this.aircraftGroup.addOverlay(markers);
-
- if (this.cluster) {
- // this.cluster.setMap(null);
- this.map.remove(this.cluster);
- // this.cluster = null;
- this.cluster.setMap(null);
- }
- //使用renderCluserMarker属性实现聚合点的完全自定义绘制
- let sts = [
- {
- url: mapbg,
- size: new AMap.Size(32, 32),
- offset: new AMap.Pixel(-16, -30),
- textColor: '#fff',
- textSize: 20,
- },
- ];
+ this.createAirRange(result);
let that = this;
- let arr = result.map((item) => ({ weight: 4, lnglat: [item.lon, item.lat] }));
+ let arr = result.map((item) => ({ weight: 4, lnglat: [item.lon, item.lat], params: item.name }));
let count = 4;
this.cluster = new AMap.MarkerClusterer(
that.map, // 地图实例
arr,
{
renderMarker: (context) => {
- var factor = Math.pow(context.count / count, 1 / 18);
- var div = document.createElement('div');
- var Hue = 180 - factor * 180;
- var bgColor = 'hsla(' + Hue + ',100%,50%,0.7)';
- var fontColor = 'hsla(' + Hue + ',100%,20%,1)';
- var borderColor = 'hsla(' + Hue + ',100%,40%,1)';
- var shadowColor = 'hsla(' + Hue + ',100%,50%,1)';
- var size = Math.round(30 + Math.pow(context.count / count, 1 / 5) * 20);
+ let factor = Math.pow(context.count / count, 1 / 18);
+ let div = document.createElement('div');
+ div.className = 'render-air';
+ let Hue = 180 - factor * 180;
+ let size = Math.round(30 + Math.pow(context.count / count, 1 / 5) * 20);
div.style.width = div.style.height = size + 'px';
- div.innerHTML = content || context.count;
- div.style.lineHeight = size + 'px';
- div.style.color = fontColor;
+ div.innerHTML = aircraftContent() || context.count;
+ div.style.color = '#fff';
div.style.fontSize = '14px';
- div.style.textAlign = 'center';
context.marker.setOffset(new AMap.Pixel(-size / 2, -size / 2));
context.marker.setContent(div);
+ this.airMarkerList.push(context.marker);
+ context.marker.on('click', () => {
+ console.log('data', context);
+ });
},
}
);
- console.log('xx', this.cluster);
this.cluster.setMap(this.map);
- this.getRange(result);
},
clearAircraft() {
- if (this.aircraftGroup) {
- this.map.remove(this.aircraftGroup);
- this.aircraftGroup = null;
+ if (this.cluster) {
+ this.map.remove(this.cluster);
+ this.cluster = null;
}
},
- getRange(list) {
- //绘制飞机的范围图
- var array = new Array(list.length);
- for (var i = 0; i < list.length; i++) {
- var circle = new AMap.Circle({
- center: [list[i].lon, list[i].lat],
- radius: 100000, //半径
- borderWeight: 3,
- strokeColor: '#FF33FF',
- strokeOpacity: 1,
- strokeWeight: 6,
- strokeOpacity: 0.2,
- fillOpacity: 0.4,
- strokeStyle: 'dashed',
- strokeDasharray: [10, 10],
- // 线样式还支持 'dashed'
- fillColor: '#1791fc',
- zIndex: 50,
- });
- circle.setMap(this.map);
- array.push(circle);
+ /**
+ * @desc 飞机范围
+ * @param list
+ */
+ createAirRange(list) {
+ this.removeOverlayGroup();
+ this.circleGroup = new AMap.OverlayGroup();
+ for (let i = 0; i < list.length; i++) {
+ let circle = createCircle({ lon: list[i].lon, lat: list[i].lat });
+ this.circleGroup.setMap(this.map);
+ this.circleGroup.addOverlay(circle);
+ }
+ },
+ clearAirRange() {
+ if (this.circleGroup) {
+ this.map.remove(this.circleGroup);
+ this.circleGroup = null;
+ }
+ },
+ /**
+ * @desc 地方医院医疗点显示
+ * @param cityCode 城市code
+ * @param keywords 搜索名称
+ */
+ createActiveHospital(cityCode: string, keywords = '医院') {
+ this.removeOverlayGroup();
+ this.clearActiveHospital();
+ if (!cityCode) return;
+ // AMap.plugin(['AMap.PlaceSearch'], () => {
+ // //构造地点查询类
+ //
+ // });
+ this.placeSearch = new AMap.PlaceSearch({
+ pageSize: 30, // 单页显示结果条数
+ pageIndex: 1, // 页码
+ city: cityCode, // 兴趣点城市
+ citylimit: true, //是否强制限制在设置的城市内搜索
+ map: this.map, // 展现结果的地图实例
+ // panel: 'map_hospital', // 结果列表将在此容器中进行展示。
+ autoFitView: false, // 是否自动调整地图视野使绘制的 Marker点都处于视口的可见范围
+ });
+ //关键字查询
+ this.placeSearch.search(keywords);
+ },
+ clearActiveHospital() {
+ if (this.placeSearch) {
+ // debugger;
+ this.placeSearch.clear();
+ this.placeSearch = null;
+ }
+ },
+ createMarker(option) {
+ this.clearMarker();
+ let { lon, lat, zoom = 12 } = option;
+ const icon = createIcon({ icon: alarmIcon, iconSize: [36, 42], imageSize: [36, 42] });
+ this.marker = new AMap.Marker({
+ position: [lon, lat],
+ icon: icon,
+ offset: new AMap.Pixel(0, 0), //设置偏移量
+ // label: {
+ // content: labelContent,
+ // offset: labelOffset,
+ // },
+ });
+ this.map.add(this.marker);
+ this.map.setZoomAndCenter(zoom, [lon, lat]);
+ },
+ clearMarker() {
+ if (this.marker) {
+ this.marker.setMap(null);
+ this.marker = null;
}
- return array;
},
};
diff --git a/src/components/body-d-left/bodyLeftHooks.ts b/src/components/body-d-left/bodyLeftHooks.ts
index 27833ff..eb9f132 100644
--- a/src/components/body-d-left/bodyLeftHooks.ts
+++ b/src/components/body-d-left/bodyLeftHooks.ts
@@ -1,6 +1,44 @@
import { ref } from 'vue';
import * as echarts from 'echarts';
+export function useStatistics() {
+ const statistics = ref([
+ {
+ name: '最新呼入电话',
+ value: '',
+ key: 'gross',
+ },
+ {
+ name: '最新受理电话',
+ value: '',
+ key: 'alerdyreceive',
+ },
+ {
+ name: '突发重大伤病应急',
+ value: '',
+ key: 'jqqz',
+ },
+ {
+ name: '重大伤病应急就医',
+ value: '',
+ key: 'dbjy',
+ },
+ ]);
+
+ function setStatistics(data = {}) {
+ statistics.value.forEach((item) => {
+ const { key } = item;
+ item.value = data[key];
+ });
+ console.log('fffffff', statistics.value);
+ }
+
+ return {
+ statistics,
+ setStatistics,
+ };
+}
+
export const timeTab = [
{
name: '全部',
diff --git a/src/components/body-d-left/oneL.vue b/src/components/body-d-left/oneL.vue
index d1d2854..af9cc6d 100644
--- a/src/components/body-d-left/oneL.vue
+++ b/src/components/body-d-left/oneL.vue
@@ -12,9 +12,9 @@
>
-
-
{{ item?.title }}
-
{{ item?.gross }}
+
+ {{ item?.name }}
+ {{ item?.value }}
@@ -25,10 +25,10 @@
import { onMounted, ref } from 'vue';
import PublicTitle from '../publicTitle.vue';
import { list } from './left.api';
- import { timeTab, useSpin } from '/@/components/body-d-left/bodyLeftHooks.ts';
+ import { timeTab, useSpin, useStatistics } from '/@/components/body-d-left/bodyLeftHooks.ts';
const typeTime = ref(timeTab);
- const dataLists = ref([]);
+ const { statistics, setStatistics } = useStatistics();
const selectIndex = ref(0);
const selectVal = ref('1');
const { setSpin, spinning } = useSpin();
@@ -42,10 +42,10 @@
try {
const { code, result } = (await list({ condition: selectVal.value })) || {};
setSpin(!spinning.value);
- if (code != 200) {
+ if (code != 200 || !Array.isArray(result)) {
return;
}
- dataLists.value = result?.map((item) => ({ ...item, title: '最新呼入电话' }));
+ setStatistics(result[0]);
} catch {
setSpin(!spinning.value);
}
@@ -70,10 +70,6 @@
overflow-y: auto;
position: relative;
- > :nth-child(1) {
- padding-top: 0 !important;
- }
-
.spin {
position: absolute;
left: 50%;
@@ -100,7 +96,7 @@
}
}
- .server-item:nth-child(2n) {
+ .server-item:nth-child(odd) {
background-color: #0a0a0c;
}
}
diff --git a/src/components/body-d-right/oneR.vue b/src/components/body-d-right/oneR.vue
index 76e6521..77322ac 100644
--- a/src/components/body-d-right/oneR.vue
+++ b/src/components/body-d-right/oneR.vue
@@ -4,11 +4,12 @@
-
{{ item?.realName }}
-
{{ item?.eventType_dictText }}
+
{{ item?.realName }}
+
{{ item?.eventType_dictText }}
{{ item?.warnTime }}
+
@@ -25,23 +26,23 @@
姓名：
- {{ userInfo.name }}
+ {{ userInfo?.realName }}
二级单位：
- {{ userInfo.unit }}
+ {{ userInfo?.orgName1 }}
手机号码：
- {{ userInfo.iphone }}
+ {{ userInfo?.phone }}
异常事件：
- {{ userInfo.abnormal }}
+ {{ userInfo?.eventType_dictText }}
发生时间：
- {{ userInfo.time }}
+ {{ userInfo?.warnTime }}
发生地点：
@@ -54,23 +55,24 @@
+
\ No newline at end of file
diff --git a/src/utils/bus.ts b/src/utils/bus.ts
new file mode 100644
index 0000000..5dc098c
--- /dev/null
+++ b/src/utils/bus.ts
@@ -0,0 +1,5 @@
+// 引入mitt插件 index.ts
+import mitt from "mitt"
+
+const $bus = mitt();
+export default $bus
\ No newline at end of file