<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"
|
@click="dingw(item)"
|
>
|
<img src="/img/icon/sign-list.png" alt />
|
{{ item.name }}
|
<el-button
|
type="danger"
|
size="mini"
|
icon="el-icon-delete"
|
circle
|
@click.stop="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>
|
<div>
|
<img
|
src='"/9j/4AAQSkZJRgABAgAAAQABAAD/2wBDAAgGBgcGBQgHBwcJCQgKDBQNDAsLDBkSEw8UHRofHh0aHBwgJC4nICIsIxwcKDcpLDAxNDQ0Hyc5PTgyPC4zNDL/2wBDAQkJCQwLDBgNDRgyIRwhMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjL/wAARCAFeAV4DASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6er…sf2r7P5P76OTdt8zd9xjjG5evrXsFFFABXj/x08E+IvGP9g/2Bp/2z7L9o8799HHt3eXt++wzna3T0r2CigD5A/wCFJfEP/oXv/J23/wDjlfR/xS0TUfEfw41bSdJt/tF9P5Plxb1TdtmRjyxAHAJ5NdhRQB4/8C/BPiLwd/b39v6f9j+1fZ/J/fRybtvmbvuMcY3L19a5D4pfC3xl4j+I+ratpOjfaLGfyfLl+1Qpu2wop4ZwRyCORX0fRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFAH//2Q=="'
|
alt=""
|
/>
|
</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: {
|
dingw(item) {
|
let that = this;
|
// console.log(item);
|
// this.$store.dispatch("mapFlyTo", {
|
// lntLat: [item.jd, item.wd, 120], //114.04020791, 27.62934732
|
// heading: 0,
|
// pitch: -90,
|
// roll: 0,
|
// noOpen: true,
|
// mviewer: that.viewer,
|
// });
|
that.viewer.camera.setView({
|
// Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
|
// fromDegrees()方法，将经纬度和高程转换为世界坐标
|
destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
|
item.jd,
|
item.wd,
|
400.0
|
),
|
orientation: {
|
// 指向
|
heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
|
// 视角
|
pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
|
roll: 0.0,
|
},
|
});
|
},
|
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.dispatch("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;
|
this.$store.commit("set_closeMapClick", true);
|
// console.log("开始", "see");
|
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, "")
|
);
|
}
|
this.$store.commit("clearLabelLayerIcon");
|
},
|
};
|
</script>
|
|
<style lang="scss" scoped>
|
.move {
|
cursor: move;
|
}
|
</style>
|
