<template>
|
<div id="sdkContainer" class="mapView">
|
<div class="infoBox" v-show="errInfoFlag">
|
<div id="inforMessage"></div>
|
<div class="infoBottom">
|
<button @click="setQueryErroInfo(true)">询问</button>
|
<button @click="setQueryErroInfo(false)">关闭</button>
|
</div>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
import configInfo from "../../assets/js/msg/configInfo.js";
|
import mapView from "./../../assets/js/map/mapView.js";
|
import bus from "./../../assets/js/bus.js";
|
import mapServer from "../../assets/js/map/mapServer.js";
|
export default {
|
data() {
|
return {
|
errInfoMessage: null,
|
errInfoFlag: false
|
};
|
},
|
computed: {
|
erroInfo() {
|
return this.$store.state.erroInfoMessage;
|
}
|
},
|
watch: {
|
erroInfo(nVal, Oval) {
|
if (nVal) {
|
this.setErrorMessage(nVal);
|
}
|
}
|
},
|
methods: {
|
setMapViewStart() {
|
mapView.initMap();
|
|
},
|
setErrorMessage(res) {
|
this.errInfoMessage = res;
|
const obj = configInfo.errorInfo(res);
|
document.getElementById("inforMessage").innerHTML = obj;
|
this.errInfoFlag = true;
|
this.$store.state.erroInfoMessage = null;
|
},
|
setQueryErroInfo(res) {
|
if (res) {
|
const obj = JSON.parse(JSON.stringify(this.errInfoMessage));
|
bus.$emit("mapInfo", {
|
type: "erroInfo",
|
value: obj.val
|
});
|
|
}
|
this.$nextTick(() => {
|
this.errInfoFlag = false;
|
document.getElementById("inforMessage").innerHTML = "";
|
this.errInfoMessage = null;
|
});
|
}
|
},
|
|
mounted() {
|
this.setMapViewStart();
|
}
|
};
|
</script>
|
|
<style scoped>
|
.mapView {
|
width: 100%;
|
height: 100%;
|
position: absolute;
|
}
|
.infoBox {
|
left: 50%;
|
top: 50%;
|
position: absolute;
|
z-index: 40;
|
border-radius: 10px;
|
border: 1px solid #797979;
|
background-color: #000000;
|
box-sizing: border-box;
|
padding: 10px;
|
font-family: "Arial", sans-serif;
|
color: white;
|
transform: translate(-50%, -50%);
|
}
|
.infoBottom {
|
margin-top: 10px;
|
float: right;
|
}
|
.infoBottom :first-child {
|
margin-right: 10px;
|
}
|
.infoBottom button {
|
width: 50px;
|
|
padding: 2px 2px 2px 2px;
|
border-radius: 5px;
|
background-color: #797979;
|
box-sizing: border-box;
|
font-family: "Arial", sans-serif;
|
color: #ffffff;
|
text-align: center;
|
line-height: normal;
|
font-size: 12px;
|
}
|
</style>
|
<style>
|
.infoTitle {
|
font-size: 16px;
|
line-height: 30px;
|
}
|
.infoCount {
|
font-size: 14px;
|
line-height: 30px;
|
}
|
</style>
|
