From 425faac492167c72803d30c96704a4d7df102675 Mon Sep 17 00:00:00 2001
From: shuishen <1109946754@qq.com>
Date: Mon, 13 Dec 2021 08:46:38 +0800
Subject: [PATCH] 实体添加及弹窗样式修改
---
src/components/map/index.vue | 98 +++++++++++++++++++++++++++++++++++++++++++-----
1 files changed, 87 insertions(+), 11 deletions(-)
diff --git a/src/components/map/index.vue b/src/components/map/index.vue
index 48e18ce..223bc6b 100644
--- a/src/components/map/index.vue
+++ b/src/components/map/index.vue
@@ -35,19 +35,84 @@
<div id="map_popup_content">
</div>
- <div ref="mapContentContent" v-show="false" id="map_content_content">
- <div class="arc-bcg">
- <img src="/img/job/one.jpg"
- alt=""
- @click="alert(1)">
+ <div ref="mapContentContent"
+ v-show="false"
+ id="map_content_content">
+ <div id="mapChildContent">
+ <div class="arc-bcg">
+ <img src="/img/job/one.jpg"
+ alt=""
+ @click="alert(1)">
+ </div>
+ <div class="popup-nav">
+ <ul>
+ <li>
+ <i class="popup-icon come-nav deblurring"></i>
+ 到这
+ </li>
+ <li>
+ <i class="popup-icon start-nav deblurring"></i>
+ 出发
+ </li>
+ <li>
+ <i class="popup-icon qr-code-nav deblurring"></i>
+ 二维码
+ </li>
+ <li>
+ <i class="popup-icon atlas-nav deblurring"></i>
+ 图集
+ </li>
+ <li>
+ <i class="popup-icon live-action-nav deblurring"></i>
+ 实景
+ </li>
+ </ul>
+ </div>
+ <div class="arc-box">
+ <ul class="tab-btn">
+ <li class="on">教学科研行政</li>
+ <li>生活服务</li>
+ </ul>
+ <div class="btm-content">
+ <div class="on">
+ <ul>
+ <li>
+ <i class="popup-icon location-icon deblurring"></i>
+ 教学楼
+ </li>
+ <li>
+ <i class="popup-icon location-icon deblurring"></i>
+ 教学楼
+ </li>
+ </ul>
+ </div>
+ <div>
+ <ul>
+ <li>
+ <i class="popup-icon location-icon deblurring"></i>
+ 生活楼
+ </li>
+ <li>
+ <i class="popup-icon location-icon deblurring"></i>
+ 生活楼
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+ <div class="btm-box"></div>
</div>
</div>
+
+ <left-nav ref="leftNav"></left-nav>
</div>
</template>
<script>
import { mapGetters } from 'vuex'
+
+var $ = window.$
export default {
name: 'mapBox',
@@ -62,6 +127,19 @@
])
},
mounted () {
+ this.$nextTick(() => {
+ // 动态添加dom元素，并绑定VUE事件(打开pdf)(.pdf-item为动态添加的元素，放置在父元素.pdf-body下)
+ $('#map_popup_content').on('click', '.arc-bcg', function () {
+ alert(1)
+ })
+
+ $('#map_popup_content').on('click', '.tab-btn li', function (e) {
+ $(this).addClass('on').siblings().removeClass('on')
+
+ $(this).parent().siblings().children(`div:eq(${$(this).index()})`).addClass('on').siblings().removeClass('on')
+ })
+ })
+
var DC = global.DC
var that = this
@@ -136,13 +214,13 @@
}
})
- console.log(DC, 456)
+ that.$store.commit('SET_VIEWER', viewer)
+
+ that.$refs.leftNav.initialize(viewer)
const popup = viewer.popup
popup.hide()
-
- that.$store.commit('SET_VIEWER', viewer)
const baselayer = DC.ImageryLayerFactory.createArcGisImageryLayer({
url:
@@ -215,14 +293,12 @@
viewer.scene.globe.depthTestAgainstTerrain = false
- console.log(document.getElementById('map_content_content'))
-
// 定制化窗体
var divForms = new DC.divForms(viewer, {
domId: 'div1',
title: '成教楼 ',
className: 'divForms-dom',
- content: document.getElementById('map_content_content'),
+ content: document.getElementById('mapChildContent'),
position: [
e.position
]
--
Gitblit v1.9.3