实体添加及弹窗样式修改

shuishen

2021-12-13 425faac492167c72803d30c96704a4d7df102675

 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
                    ]