update 银川地图中心点做特殊处理
This commit is contained in:
@@ -31,6 +31,7 @@ export const Map = {
|
||||
}).then((res) => {
|
||||
AMap = res;
|
||||
const { zoom, center, mapStyle } = { ...defaultOption, ...option };
|
||||
console.log(zoom, center);
|
||||
//基本地图加载
|
||||
this.map = new AMap.Map(el, {
|
||||
resizeEnable: true,
|
||||
@@ -119,14 +120,17 @@ export const Map = {
|
||||
* @param result
|
||||
* @param extData
|
||||
* @param callback
|
||||
* @param computedCenter 是否计算中心点
|
||||
*/
|
||||
createOverlay(result: ResultType[], extData?: ExtDataType, callback?: Callback) {
|
||||
createOverlay(result: ResultType[], extData?: ExtDataType, callback?: Callback, computedCenter?: boolean) {
|
||||
this.removeOverlayGroup();
|
||||
this.overlayGroup = new AMap.OverlayGroup();
|
||||
let list = getLonLat(result);
|
||||
let center = getCenter(list);
|
||||
let zoom = getZoom(list);
|
||||
this.setZoomCenter(center, zoom);
|
||||
if (computedCenter) {
|
||||
this.setZoomCenter(center, zoom);
|
||||
}
|
||||
for (let i = 0; i < result.length; i++) {
|
||||
let { type, lon, lat, lng } = result[i];
|
||||
if (lng) {
|
||||
|
||||
@@ -1,9 +1,15 @@
|
||||
// 西安地图默认配置
|
||||
export const defaultOption = {
|
||||
// center: [108.660704, 36.386058], //地图中心点
|
||||
center: [108.660704, 36.386058], //地图中心点
|
||||
zoom: 6.5, //地图显示的缩放级别
|
||||
mapStyle: 'darkblue', //地图样式
|
||||
};
|
||||
export const YinChuanOption = {
|
||||
center: [106.32, 38.45], //地图中心点
|
||||
zoom: 8, //地图显示的缩放级别
|
||||
mapStyle: 'darkblue', //地图样式
|
||||
};
|
||||
|
||||
// 地图key
|
||||
export const mapKey = '4bbcb216b889f2d612cbed05ae6979c8';
|
||||
export const mapPlugin = ['AMap.ToolBar', 'AMap.Driving', 'AMap.GeoJSON', 'AMap.MarkerCluster', 'AMap.PlaceSearch'];
|
||||
|
||||
@@ -48,7 +48,7 @@
|
||||
</div>
|
||||
<!-- <div class="level">地图层级:{{ level }}</div>-->
|
||||
</div>
|
||||
<div class="center-footer">
|
||||
<div class="center-footer" v-if="showFooter">
|
||||
<div class="count-item">
|
||||
<div class="num">{{ useDetail?.alerdyreceive || '0' }}</div>
|
||||
<div class="text">累计受理</div>
|
||||
@@ -67,6 +67,26 @@
|
||||
import { aircraft, getKmStr, getTimeStr, legendList, mapApiSwitch, tabList, TabType } from '/@/components/chinaMap/chinaHooks';
|
||||
import { useDetailStore } from '/@/store/modules/detailData.ts';
|
||||
|
||||
const props = defineProps({
|
||||
showFooter: {
|
||||
type: Boolean,
|
||||
default: () => {
|
||||
return true;
|
||||
},
|
||||
},
|
||||
computedCenter: {
|
||||
type: Boolean,
|
||||
default: () => {
|
||||
return true;
|
||||
},
|
||||
},
|
||||
mapOptions: {
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {};
|
||||
},
|
||||
},
|
||||
});
|
||||
const useDetail = useDetailStore();
|
||||
const formState = ref({
|
||||
start: '',
|
||||
@@ -116,17 +136,22 @@
|
||||
const { code, result } = await mapApiSwitch(type, params);
|
||||
if (code == 200) {
|
||||
if (Array.isArray(result) && result.length > 0) {
|
||||
Map.createOverlay(result, {
|
||||
content: (val) => {
|
||||
return `<div style="
|
||||
Map.createOverlay(
|
||||
result,
|
||||
{
|
||||
content: (val) => {
|
||||
return `<div style="
|
||||
width: 21px;
|
||||
height: 44px;
|
||||
position: absolute;
|
||||
left: -20px;
|
||||
top: -20px;" title="${val?.name}">
|
||||
</div>`;
|
||||
},
|
||||
},
|
||||
});
|
||||
() => {},
|
||||
props.computedCenter
|
||||
);
|
||||
} else {
|
||||
Map.removeOverlayGroup();
|
||||
}
|
||||
@@ -137,7 +162,7 @@
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
Map.initMap({ el: 'mapContainer' }).then(() => {
|
||||
Map.initMap({ el: 'mapContainer', option: props.mapOptions }).then(() => {
|
||||
getMapData(tabList[0].type);
|
||||
Map.map && Map.map.on('zoomend', setLevel);
|
||||
Map.map && Map.map.on('zoomend', setLevel);
|
||||
|
||||
@@ -1,12 +1,17 @@
|
||||
<template>
|
||||
<Dialog :openVis="visible" width="50%" title="健康终端报警列表" @close="closeDialog" :maskClosable="false">
|
||||
<template #container>
|
||||
<BasicTable ref="registerTable" class="table-container" :columns="columns" :api="getMonitorList" :apiParams="formState"></BasicTable>
|
||||
<BasicTable ref="registerTable" class="table-container" :columns="columns" :api="getMonitorList" :apiParams="formState">
|
||||
<template #address="{ record, column, index }">
|
||||
<span v-if="record['address']">{{ record?.address }}</span>
|
||||
<span v-else style="color: #eb3636">{{ record?.gpsErrorMsg }}</span>
|
||||
</template>
|
||||
</BasicTable>
|
||||
</template>
|
||||
</Dialog>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { computed, ref, watch } from 'vue';
|
||||
import { computed, ref, watch, h } from 'vue';
|
||||
import Dialog from '/@/components/dialog/Dialog.vue';
|
||||
import { useDialog } from '/@/views/components/dialogHooks.ts';
|
||||
import BasicTable from '/@/components/secondaryScreen/secondMap/components/basicTable/BasicTable.vue';
|
||||
@@ -30,8 +35,8 @@
|
||||
},
|
||||
{
|
||||
title: '二级单位',
|
||||
dataIndex: 'orgName1',
|
||||
key: 'orgName1',
|
||||
dataIndex: 'orgName2',
|
||||
key: 'orgName2',
|
||||
},
|
||||
{
|
||||
title: '联系电话',
|
||||
@@ -57,9 +62,14 @@
|
||||
title: '发生地点',
|
||||
dataIndex: 'address',
|
||||
key: 'address',
|
||||
customRender: ({ record }) => {
|
||||
return record?.address || record?.gpsErrorMsg;
|
||||
},
|
||||
slot: 'address',
|
||||
// customRender: ({ record }) => {
|
||||
// if (record?.address) {
|
||||
// return record?.address;
|
||||
// } else {
|
||||
// return h('span', { style: { color: '#eb3636' } }, record?.gpsErrorMsg);
|
||||
// }
|
||||
// },
|
||||
},
|
||||
];
|
||||
const formState = computed(() => ({
|
||||
|
||||
@@ -4,7 +4,10 @@
|
||||
<div class="title-d-left">
|
||||
{{ dayTimeO }}
|
||||
</div>
|
||||
<div class="title-d-middle"> 银川应急就医服务中心</div>
|
||||
<div class="title-d-middle">
|
||||
<span>{{ title }}</span>
|
||||
<span class="phone">{{ phone }}</span>
|
||||
</div>
|
||||
<div class="title-d-right"> 累计运行时间:{{ dayTimeT }}</div>
|
||||
</div>
|
||||
<div class="body-d">
|
||||
@@ -15,7 +18,7 @@
|
||||
<DailyWorkTrends :refreshState="refreshState" class="daily-work-trends" />
|
||||
</div>
|
||||
<div class="body-d-middle">
|
||||
<china-map />
|
||||
<china-map :showFooter="false" :computedCenter="false" :mapOptions="YinChuanOption" />
|
||||
</div>
|
||||
<div class="body-d-right">
|
||||
<!--健康终端报警-->
|
||||
@@ -52,11 +55,15 @@
|
||||
import { useRoute } from 'vue-router';
|
||||
import { DataType, getSettings } from '/@/utils/settings.ts';
|
||||
import { ServerDetailType } from '/@/components/body-d-left/bodyLeftHooks.ts';
|
||||
import { YinChuanOption } from '/@/assets/mapUtils/mapConstant.ts';
|
||||
|
||||
const title = ref('银川片应急就医服务中心');
|
||||
const phone = '(0951-6805199)';
|
||||
const route = useRoute();
|
||||
const setting = getSettings(DataType.yinChuan);
|
||||
onMounted(() => {
|
||||
init();
|
||||
document.title = title.value;
|
||||
document.addEventListener('visibilitychange', checkTabState);
|
||||
});
|
||||
onUnmounted(() => {
|
||||
@@ -210,6 +217,13 @@
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.title-d-middle {
|
||||
.phone {
|
||||
font-size: 27px;
|
||||
margin-left: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
> :nth-child(1) {
|
||||
width: 29%;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user