79 lines
1.7 KiB
Vue
79 lines
1.7 KiB
Vue
<template>
|
|
<div>
|
|
<TopNav navTitle="地图模式" :showRight="false" :showLeft="true" />
|
|
<GdMap />
|
|
</div>
|
|
</template>
|
|
<script setup>
|
|
import { ref, onMounted } from "vue";
|
|
import { useRoute } from "vue-router";
|
|
import TopNav from "../../../components/topNav.vue";
|
|
import GdMap from "../../../components/GdMap/index.vue";
|
|
import { getMApWdgj } from "../../../api/common.js";
|
|
import { hintToast } from "../../../utils/tools.js";
|
|
import emitter from "../../../utils/eventBus.js";
|
|
const item = ref(null); // 警情数据
|
|
const isRlt = ref(false);
|
|
const points = ref([]);
|
|
onMounted(() => {
|
|
window.closeMapTitle = closeMapTitle;
|
|
_getMApWdgj();
|
|
});
|
|
//获取坐标数据
|
|
function _getMApWdgj() {
|
|
let data = {
|
|
dwrq: useRoute().query.time,
|
|
sfzh: JSON.parse(window.localStorage.getItem("userInfo")).idEntityCard,
|
|
};
|
|
getMApWdgj(data).then((res) => {
|
|
if (res && res.zbList.length > 0) {
|
|
for (let i = 0; i < res.zbList.length; i++) {
|
|
points.value = [...points.value, ...res.zbList[i]];
|
|
}
|
|
points.value = points.value.join(",");
|
|
emitter.emit("drawLine", points.value);
|
|
}
|
|
});
|
|
}
|
|
//关闭弹窗dom
|
|
function closeMapTitle(val) {
|
|
let doms = document.getElementById(val);
|
|
doms.remove();
|
|
}
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
.map_but_box {
|
|
position: absolute;
|
|
bottom: 10vw;
|
|
width: 50%;
|
|
left: 50%;
|
|
z-index: 99;
|
|
margin-left: -25%;
|
|
}
|
|
|
|
.top_btn {
|
|
position: fixed;
|
|
top: 16vw;
|
|
left: 0;
|
|
right: 12px;
|
|
height: 24px;
|
|
color: #fff;
|
|
z-index: 9;
|
|
text-align: right;
|
|
|
|
span {
|
|
display: inline-block;
|
|
border: 1px solid #fff;
|
|
line-height: 22px;
|
|
padding: 0 12px;
|
|
border-radius: 12px;
|
|
font-size: 14px;
|
|
}
|
|
|
|
span.active {
|
|
background: #517cea;
|
|
border-color: #517cea;
|
|
}
|
|
}
|
|
</style>
|