<template>
|
<public-box class="tool-sign">
|
<template slot="public-box-header">
|
<div class="title">
|
<img class="icon deblurring" src="/img/icon/tool-sign.png" alt />
|
<span>地图标记</span>
|
</div>
|
<img class="close" src="/img/navicon/close.png" alt @click="closeModel" />
|
</template>
|
<template slot="public-box-content">
|
<div class="list-box">
|
<ul v-show="signList.length > 0">
|
<li v-for="(item, index) in signList" :key="index">
|
<img src="/img/icon/sign-list.png" alt />
|
{{ item.name }}
|
<el-button
|
type="danger"
|
size="mini"
|
icon="el-icon-delete"
|
circle
|
@click="deleteIcon(item.id)"
|
></el-button>
|
</li>
|
</ul>
|
<div v-show="signList.length == 0" class="no-data">
|
<img src="/img/icon/no-data.png" alt />
|
<div>暂无数据</div>
|
</div>
|
</div>
|
<div class="btn-box">
|
<el-button type="primary" size="mini" @click.stop="addSign"
|
>新增</el-button
|
>
|
</div>
|
</template>
|
</public-box>
|
</template>
|
|
<script>
|
import { mapGetters } from "vuex";
|
import { getlabel, deletelabel } from "@/api/pc/label";
|
|
export default {
|
data() {
|
return {
|
DC: null,
|
signList: [],
|
destroyedFlag: true,
|
};
|
},
|
computed: {
|
...mapGetters(["viewer", "addSignList"]),
|
},
|
mounted() {
|
this.$store.commit("initLabelLayer", this.viewer);
|
this.getData();
|
},
|
watch: {
|
addSignList() {
|
this.getData();
|
},
|
},
|
methods: {
|
deleteIcon(id) {
|
let that = this;
|
deletelabel(id).then((res) => {
|
console.log(res);
|
if (res.data.code == 200) {
|
that.$message({
|
message: "删除标签成功",
|
type: "success",
|
});
|
} else {
|
that.$message({
|
message: "删除标签失败",
|
type: "warning",
|
});
|
}
|
that.getData();
|
});
|
},
|
getData() {
|
let that = this;
|
getlabel().then((res) => {
|
console.log(res);
|
const data = res.data.data.records;
|
that.signList = data;
|
// that.$store.commit("clearLabelLayerIcon");
|
that.$store.commit("addLabelLayerIcon", { list: data, clear: true });
|
});
|
},
|
moveMessage(e, b) {
|
if (b == "") {
|
this.viewer.tooltip.enable = false;
|
} else {
|
this.viewer.tooltip.enable = true;
|
this.viewer.tooltip.showAt(e.windowPosition, b);
|
}
|
},
|
|
addSign() {
|
var that = this;
|
that.DC = global.DC;
|
|
that.viewer.on(that.DC.MouseEventType.MOUSE_MOVE, (e) =>
|
that.moveMessage(e, "点击确认标注位置")
|
);
|
|
that.viewer.once(that.DC.MouseEventType.CLICK, (e) => {
|
if (that.destroyedFlag == false) return;
|
|
that.viewer.on(that.DC.MouseEventType.MOUSE_MOVE, (e) =>
|
that.moveMessage(e, "")
|
);
|
|
// eslint-disable-next-line no-unused-vars
|
const popup = new this.DC.DivForms(this.viewer, {
|
domId: "AddTagBox",
|
position: [
|
that.DC.Transform.transformWGS84ToCartesian(
|
new that.DC.Position(
|
Number(e.wgs84SurfacePosition.lng),
|
Number(e.wgs84SurfacePosition.lat),
|
Number(e.wgs84SurfacePosition.alt)
|
)
|
),
|
],
|
});
|
|
that.$store.commit("SET_ADDTAGPOSITION", e.wgs84SurfacePosition);
|
that.$store.commit("SET_ADDTAGPOPUP", true);
|
});
|
},
|
|
closeModel() {
|
this.$store.dispatch("delVisitedViews", this.$route);
|
this.$router.push("/pcLayout/default");
|
this.$store.commit("clearLabelLayerIcon");
|
},
|
},
|
destroyed() {
|
var that = this;
|
that.destroyedFlag = false;
|
if (that.DC) {
|
that.viewer.on(that.DC.MouseEventType.MOUSE_MOVE, (e) =>
|
that.moveMessage(e, "")
|
);
|
}
|
},
|
};
|
</script>
|
|
<style lang="scss" scoped>
|
.move {
|
cursor: move;
|
}
|
</style>
|
