From bf58722dfd03ea1513f3acc7331d4d4403fca76e Mon Sep 17 00:00:00 2001
From: shuishen <1109946754@qq.com>
Date: Fri, 18 Mar 2022 11:48:37 +0800
Subject: [PATCH] Merge branch 'master' of http://192.168.0.105:10010/r/school-web
---
src/components/map/components/mapPopup.vue | 366 ++++++++++++++++++++++++++++-----------------------
1 files changed, 202 insertions(+), 164 deletions(-)
diff --git a/src/components/map/components/mapPopup.vue b/src/components/map/components/mapPopup.vue
index c29b7c8..04c3ab4 100644
--- a/src/components/map/components/mapPopup.vue
+++ b/src/components/map/components/mapPopup.vue
@@ -66,7 +66,7 @@
<i class="popup-icon start-nav deblurring"></i>
出发
</li>
- <li v-show="false" @click="qrCodeClick">
+ <li v-show="pupupQRUrl != ''" @click="qrCodeClick">
<i class="popup-icon qr-code-nav deblurring"></i>
二维码
</li>
@@ -166,6 +166,12 @@
id="FullScreenBox"
>
<div class="title">
+ <img
+ @click="returnDetailsPopup"
+ class="return-btn"
+ src="/img/icon/return.png"
+ alt
+ />
{{ stateName }}
<img
@click="screen"
@@ -200,6 +206,12 @@
<div class="monitor-wrap">
<div class="content-wrap">
<div class="title">
+ <img
+ @click="returnDetailsPopup"
+ class="return-btn"
+ src="/img/icon/return.png"
+ alt
+ />
{{ stateName }}
<img
@click="closeMonitorPopupBox"
@@ -275,7 +287,7 @@
<div class="arrow-rb"></div>
<div class="label-wrap">
<div class="title">
- {{ nowlabelLayerData.name }} 二维码分享
+ {{ nowlabelLayerData.name }}
<img
@click="closelabelLayerid"
class="close-box"
@@ -287,9 +299,9 @@
<!-- data:image/png;base64, -->
<img
:src="nowlabelLayerData.qrcode"
- alt=""
+ alt
class="labelLayeridewm"
- style="width:250px,height:250px"
+ style="width: 250px; height: 250px"
/>
</div>
</div>
@@ -301,114 +313,115 @@
</div>
</div>
</div>
- <!-- 新增编辑标签 -->
- <div v-if="addIconsLayerIconPopup" class="monitor-dom" id="leftNavsAdd">
- <div style="width: 100%; height: 100%">
- <div class="divForms divForms-theme">
- <div class="divForms-wrap">
- <div class="area">
- <div class="arrow-lt"></div>
- <div class="b-t"></div>
- <div class="b-r"></div>
- <div class="b-b"></div>
- <div class="b-l"></div>
- <div class="arrow-rb"></div>
- <div class="label-wrap">
- <div class="title">
- <el-input
- v-model="addIconFromcolumn[0].value"
- placeholder="请输入标签名称"
- class="addIconFromInput"
- >
- <template slot="prepend">标题:</template
- ><i
- slot="suffix"
- class="el-icon-edit el-input__icon addIconFromInputicon"
- ></i>
- </el-input>
- <img
- @click="closeaddIconsLayerIconPopup"
- class="close-box"
- src="/img/navicon/close.png"
- alt
- />
- </div>
- <div class="add-tag-content">
- <div class="addIconsLayer">
- <div
- :class="[
- 'addIconsLayerinimgs',
- ourImages.length > 3 ? 'isOverImgs' : '',
- ]"
- >
- <!-- action="https://jsonplaceholder.typicode.com/posts/" -->
- <el-upload
- :action="
- apiUrls +
- '/blade-resource/oss/endpoint/put-files-talk'
- "
- list-type="picture-card"
- :on-preview="handlePictureCardPreview"
- :on-remove="handleRemove"
- :on-success="onsuccess"
- >
- <i class="el-icon-plus"></i>
- </el-upload>
- <el-dialog
- :visible.sync="dialogVisible"
- :modal-append-to-body="false"
- :append-to-body="true"
- >
- <img width="100%" :src="dialogImageUrl" alt="" />
- </el-dialog>
- </div>
- <div
- class="addIconsLayerin"
- v-for="(item, index) in addIconFromcolumn"
- :key="index"
- v-show="index != 0"
- >
- <el-input
- v-model="item.value"
- :placeholder="'请输入' + item.label"
- class="addIconFromInput"
- :disabled="index == 2 || index == 3"
- >
- <template slot="prepend">{{ item.label }}:</template>
- </el-input>
+ </div>
- <el-dropdown
- v-show="index == 2 || index == 3"
- @command="chouseAddicon"
- >
- <span class="el-dropdown-link">
- <i class="el-icon-arrow-down el-icon--right"></i>
- </span>
- <el-dropdown-menu slot="dropdown">
- <el-dropdown-item
- v-for="(itemc, indexc) in item.chouse"
- :key="indexc"
- :command="{ index: index, indexc: indexc }"
- >{{ itemc.value }}</el-dropdown-item
- >
- <!-- @click="chouseAddicon(index, indexc)" -->
- </el-dropdown-menu>
- </el-dropdown>
- </div>
- </div>
- <div class="addIconsLayerBut">
- <el-button type="primary" @click="saveIconsLayer"
- >保存标签</el-button
+ <!-- 新增编辑标签 -->
+ <div
+ v-if="addIconsLayerIconPopup"
+ class="monitor-dom add-sign-box-style"
+ id="leftNavsAdd"
+ >
+ <div style="width: 100%; height: 100%">
+ <div class="divForms divForms-theme">
+ <div class="divForms-wrap">
+ <div class="area">
+ <div class="arrow-lt"></div>
+ <div class="b-t"></div>
+ <div class="b-r"></div>
+ <div class="b-b"></div>
+ <div class="b-l"></div>
+ <div class="arrow-rb"></div>
+ <div class="label-wrap">
+ <div class="title">
+ <el-input
+ v-model="addIconFromcolumn[0].value"
+ placeholder="请输入标签名称"
+ class="addIconFromInput"
+ >
+ <template slot="prepend">标题:</template>
+ </el-input>
+ <img
+ @click="closeaddIconsLayerIconPopup"
+ class="close-box"
+ src="/img/navicon/close.png"
+ alt
+ />
+ </div>
+ <div class="add-tag-content">
+ <div class="addIconsLayer">
+ <div
+ :class="[
+ 'addIconsLayerinimgs',
+ ourImages.length > 3 ? 'isOverImgs' : '',
+ ]"
+ >
+ <!-- action="https://jsonplaceholder.typicode.com/posts/" -->
+ <el-upload
+ :action="
+ apiUrls +
+ '/blade-resource/oss/endpoint/put-files-talk'
+ "
+ list-type="picture-card"
+ :on-preview="handlePictureCardPreview"
+ :on-remove="handleRemove"
+ :on-success="onsuccess"
>
+ <i class="el-icon-plus"></i>
+ </el-upload>
+ <el-dialog
+ :visible.sync="dialogVisible"
+ :modal-append-to-body="false"
+ :append-to-body="true"
+ >
+ <img width="100%" :src="dialogImageUrl" alt />
+ </el-dialog>
</div>
+ <div
+ class="addIconsLayerin"
+ v-for="(item, index) in addIconFromcolumn"
+ :key="index"
+ v-show="index != 0"
+ >
+ <el-input
+ v-model="item.value"
+ :placeholder="'请输入' + item.label"
+ class="addIconFromInput"
+ :disabled="index == 2 || index == 3"
+ >
+ <template slot="prepend">{{ item.label }}:</template>
+ </el-input>
+
+ <el-dropdown
+ v-show="index == 2 || index == 3"
+ @command="chouseAddicon"
+ >
+ <span class="el-dropdown-link">
+ <i class="el-icon-arrow-down el-icon--right"></i>
+ </span>
+ <el-dropdown-menu slot="dropdown">
+ <el-dropdown-item
+ v-for="(itemc, indexc) in item.chouse"
+ :key="indexc"
+ :command="{ index: index, indexc: indexc }"
+ >{{ itemc.value }}</el-dropdown-item
+ >
+ <!-- @click="chouseAddicon(index, indexc)" -->
+ </el-dropdown-menu>
+ </el-dropdown>
+ </div>
+ </div>
+ <div class="addIconsLayerBut">
+ <el-button type="primary" @click="saveIconsLayer"
+ >保存标签</el-button
+ >
</div>
</div>
</div>
- <div class="b-t-l"></div>
- <div class="b-b-r"></div>
</div>
- <div class="arrow"></div>
+ <div class="b-t-l"></div>
+ <div class="b-b-r"></div>
</div>
+ <div class="arrow"></div>
</div>
</div>
</div>
@@ -465,21 +478,15 @@
import { setlabel } from "@/api/pc/label";
import { add } from "@/api/pc/leftNav/index";
-import leftNavsAdd from "./mapPopupOther/leftNavsAdd.vue";
-
export default {
name: "mapPopup",
- components: {
- leftNavsAdd,
- },
+
data() {
- let apiUrls = window.$apiUrls;
return {
ourImages: [],
dialogImageUrl: "",
dialogVisible: false,
- apiUrls: $apiUrls,
- DC: null,
+ apiUrls: null,
tabBtnFlag: "教学科研行政",
QRCodeFlag: false,
audioSource: "",
@@ -490,9 +497,8 @@
fullscreen: false,
fullScreenUrl: "/img/icon/bigScreen.png",
addTagName: "",
- addTagLayer: null,
addIconFromcolumn: [
- //顺序不要随便换
+ // 顺序不要随便换
{
label: "名称",
prop: "mechanismname",
@@ -701,7 +707,6 @@
},
computed: {
...mapGetters([
- "viewer",
"popupBgUrl",
"pupupQRUrl",
// 终点
@@ -738,15 +743,15 @@
"campusNavFlag",
"addTagPopup",
"addTagPosition",
- //自定义标签弹窗
+ // 自定义标签弹窗
"labelLayerDataShow",
"nowlabelLayerData",
- "addIconsLayerIconPopup", //自定义标签编辑窗口
- "addIconsLayerIconPosition", //自定义标签坐标
+ "addIconsLayerIconPopup", // 自定义标签编辑窗口
+ "addIconsLayerIconPosition", // 自定义标签坐标
]),
},
created() {
- this.DC = global.DC;
+ this.apiUrls = window.$apiUrls;
this.audioSynth = window.speechSynthesis;
this.audioMsg = new window.SpeechSynthesisUtterance();
@@ -757,14 +762,16 @@
this.audioCourse = false;
};
},
- mounted() {},
+ mounted() {
+ global.viewer.scene.globe.depthTestAgainstTerrain = false;
+ },
watch: {
addIconsLayerIconPopup() {
if (this.addIconsLayerIconPopup) {
this.addIconFromcolumn[9].value = this.addIconsLayerIconPosition[0];
this.addIconFromcolumn[10].value = this.addIconsLayerIconPosition[1];
} else {
- for (let k in this.addIconFromcolumn) {
+ for (const k in this.addIconFromcolumn) {
if (k == 2) {
this.addIconFromcolumn[k].value = "红旗校区";
this.addIconFromcolumn[k].valueid = "1";
@@ -778,7 +785,7 @@
this.addIconFromcolumn[k].value = "";
}
this.ourImages = [];
- this.$store.commit("set_closeMapClick", false); //开启其他操作
+ this.$store.commit("set_closeMapClick", false); // 开启其他操作
}
},
addTagPopup() {
@@ -858,7 +865,7 @@
for (var k in this.ourImages) {
imgs.push(this.ourImages[k].response);
}
- let d = {
+ const d = {
tpurl: imgs.join(","),
mechanismname: this.addIconFromcolumn[0].value,
telephone: this.addIconFromcolumn[1].value,
@@ -942,13 +949,13 @@
}
// eslint-disable-next-line new-cap
- var positions = this.DC.Transform.transformWGS84ToCartesian(
+ var positions = global.DC.Transform.transformWGS84ToCartesian(
// eslint-disable-next-line new-cap
- new this.DC.Position.fromArray(this.pointPosition)
+ new global.DC.Position.fromArray(this.pointPosition)
);
- this.viewer.scene.globe.depthTestAgainstTerrain = false;
+
// eslint-disable-next-line no-unused-vars
- var panorama = new this.DC.PanoramaBox(this.viewer, {
+ var panorama = new global.DC.PanoramaBox(global.viewer, {
domId: "PanoramaBox",
position: [positions],
});
@@ -965,19 +972,40 @@
this.audioCourse = false;
}
// eslint-disable-next-line new-cap
- var positions = this.DC.Transform.transformWGS84ToCartesian(
+ var positions = global.DC.Transform.transformWGS84ToCartesian(
// eslint-disable-next-line new-cap
- new this.DC.Position.fromArray(this.pointPosition)
+ new global.DC.Position.fromArray(this.pointPosition)
);
- this.viewer.scene.globe.depthTestAgainstTerrain = false;
// eslint-disable-next-line no-unused-vars
- var monitor = new this.DC.PanoramaBox(this.viewer, {
+ var monitor = new global.DC.PanoramaBox(global.viewer, {
domId: "MonitorBox",
position: [positions],
});
this.$store.commit("SET_PANORAMAPOPUP", false);
this.$store.commit("SET_DETAILSPOPUP", false);
this.$store.commit("SET_MONITORPOPUP", true);
+ },
+
+ returnDetailsPopup() {
+ var positions = global.DC.Transform.transformWGS84ToCartesian(
+ // eslint-disable-next-line new-cap
+ new global.DC.Position.fromArray(this.pointPosition)
+ );
+
+ // eslint-disable-next-line no-unused-vars
+ var divBox = new global.DC.PanoramaBox(global.viewer, {
+ domId: "divFormsDomBox",
+ position: [positions],
+ });
+
+ global.viewer.zoomToPosition(
+ // eslint-disable-next-line new-cap
+ new global.DC.Position.fromArray(this.pointPosition)
+ );
+
+ this.$store.commit("SET_DETAILSPOPUP", true);
+ this.$store.commit("SET_MONITORPOPUP", false);
+ this.$store.commit("SET_PANORAMAPOPUP", false);
},
closeMapPopupBox() {
@@ -1010,21 +1038,22 @@
this.$store.commit("SET_ADDTAGPOPUP", false);
- // if (this.addTagLayer == null) {
- // this.addTagLayer = new this.DC.HtmlLayer("addTagLayer");
- // this.viewer.addLayer(this.addTagLayer);
- // }
-
- //2022.3.2对接接口
+ // 2022.3.2对接接口
// 新增标签
- let data = {
+ const data = {
name: this.RemoveTheBlank(this.addTagName),
jd: this.addTagPosition.lng,
wd: this.addTagPosition.lat,
};
// console.log(data);
+ let oks = setTimeout(() => {
+ that.$message({
+ message: "新增标签失败",
+ type: "warning",
+ });
+ }, 5000);
setlabel(data).then((res) => {
- console.log(res);
+ clearTimeout(oks);
if (res.data.code == 200) {
doit();
that.$message({
@@ -1039,29 +1068,11 @@
}
that.addTagName = "";
});
- let doit = () => {
+ const doit = () => {
that.$store.dispatch("addLabelLayerIcon", {
// list: [data],
add: true,
});
- // const divIcon = new this.DC.DivIcon(
- // new that.DC.Position(
- // Number(that.addTagPosition.lng),
- // Number(that.addTagPosition.lat),
- // 0
- // ),
- // `
- // <div class="tag-entitys-box">
- // <div class="tag-content">
- // ${that.addTagName}
- // </div>
- // <div class="tag-angle-content">
- // <img src="https://map.hit.edu.cn/images/tarrow_xq.png">
- // </div>
- // </div>
- // `
- // );
- // this.addTagLayer.addOverlay(divIcon);
};
},
@@ -1120,8 +1131,8 @@
}
this.newPopup(result);
- this.viewer.flyToPosition(
- new this.DC.Position(
+ global.viewer.flyToPosition(
+ new global.DC.Position(
Number(result.jd),
Number(result.wd),
300,
@@ -1136,11 +1147,15 @@
},
newPopup(item) {
- const position = this.DC.Transform.transformWGS84ToCartesian(
- new this.DC.Position(Number(item.jd), Number(item.wd), Number(item.gd))
+ const position = global.DC.Transform.transformWGS84ToCartesian(
+ new global.DC.Position(
+ Number(item.jd),
+ Number(item.wd),
+ Number(item.gd)
+ )
);
// eslint-disable-next-line no-unused-vars
- var popup = new this.DC.DivForms(this.viewer, {
+ var popup = new global.DC.DivForms(global.viewer, {
domId: "divFormsDomBox",
position: [position],
});
@@ -1160,9 +1175,32 @@
};
</script>
-<style>
+<style lang="scss">
.labelLayeridewm {
width: 250px !important;
height: 250px !important;
}
+
+.add-sign-box-style {
+ input:-moz-placeholder,
+ textarea:-moz-placeholder {
+ color: #fff;
+ }
+ input:-ms-input-placeholder,
+ textarea:-ms-input-placeholder {
+ color: #fff;
+ }
+ input::-webkit-input-placeholder,
+ textarea::-webkit-input-placeholder {
+ color: #fff;
+ }
+
+ .addIconsLayerinimgs {
+ margin-top: 4px;
+ }
+
+ .addIconsLayerin {
+ padding: 0 10px;
+ }
+}
</style>
--
Gitblit v1.9.3