安保更改

shuishen

2023-03-09 beac0f9a8bfe0f0e4d8db19fa18a9745ed1fcc40

安保更改

 src/components/map/components/yToolTip.vue

New file
@@ -0,0 +1,86 @@
<!--
 * @Author: shuishen 1109946754@qq.com
 * @Date: 2023-03-09 10:36:05
 * @LastEditors: shuishen 1109946754@qq.com
 * @LastEditTime: 2023-03-09 11:31:03
 * @FilePath: \srs-police-affairs\src\components\map\components\yToolTip.vue
 * @Description: 
 * 
 * Copyright (c) 2023 by ${git_name_email}, All Rights Reserved. 
-->
<template>
    <div ref="toolTopBox" v-show="tooltipShow">
        <div class="tool-text">
            {{ handlerText }}
        </div>
    </div>
</template>

<script>
export default {
    data () {
        return {
            handlerText: '',
            tooltipShow: false
        }
    },

    mounted () {
        const that = this

        this.$EventBus.$on('showTooltip', params => {
            that.showTooltip(params)
        })

        this.$EventBus.$on('closeTooltip', () => {
            that.closeTooltip()
        })
    },

    methods: {
        showTooltip (params) {
            const that = this

            this.handlerText = params.text

            this.tooltipShow = true

            that.updateWindowCoord(params.position)
        },

        closeTooltip () {
            this.tooltipShow = false
        },

        updateWindowCoord (windowCoord) {
            let x = windowCoord.x + 12
            let y = windowCoord.y - this.$refs.toolTopBox.offsetHeight / 2

            this.$refs.toolTopBox.style.cssText = `
                position: fixed;
                z-index:99;
                transform:translate3d(${Math.round(x)}px,${Math.round(y)}px, 0);
            `
        }
    }
}
</script>

<style lang="scss" scoped>
.tool-text {
    position: relative;
    padding: 0.6vh;
    color: #fff;
    background: rgba(0, 0, 0, .7);
    border-radius: 0.6vh;
}

.tool-text::after {
    content: '';
    position: absolute;
    left: -0.8vh;
    border-top: 0.8vh solid transparent;
    border-right: 0.8vh solid rgba(0, 0, 0, .7);
    border-bottom: 0.8vh solid transparent;
}
</style>

 src/components/map/index.vue

@@ -2,7 +2,7 @@
 * @Author: shuishen 1109946754@qq.com
 * @Date: 2022-08-18 17:00:30
 * @LastEditors: shuishen 1109946754@qq.com
 * @LastEditTime: 2023-03-08 09:47:02
 * @LastEditTime: 2023-03-09 10:50:09
 * @FilePath: \srs-police-affairs\src\components\map\index.vue
 * @Description: 公用地图组件
 * 
@@ -66,6 +66,8 @@
        <activity-police-popup></activity-police-popup>

        <video-list-popup></video-list-popup>

        <y-tool-tip></y-tool-tip>

        <assemble-box></assemble-box>
    </div>
@@ -187,13 +189,14 @@
import mapPopup from './components/mapPopup.vue'
import activityPolicePopup from './components/activityPolicePopup.vue'
import videoListPopup from './components/videoListPopup.vue'
import yToolTip from './components/yToolTip.vue'



export default {
    name: 'mapBox',

    components: { mapPopup, activityPolicePopup, videoListPopup },
    components: { mapPopup, activityPolicePopup, videoListPopup, yToolTip },

    data () {
        return {

 src/views/activity/components/drawBtnBox.vue

@@ -118,11 +118,14 @@
    },

    mounted () {
        drawLabelStatus = 'end'

        this.$nextTick(() => {
            if (drawLayers == null) {
                drawLayers = new global.DC.VectorLayer('drawLayers')
                global.viewer.addLayer(drawLayers)
                plot = new global.DC.Plot(global.viewer)

            }


@@ -130,12 +133,12 @@
                drawArrowLayers = new global.DC.VectorLayer('drawArrowLayers')
                global.viewer.addLayer(drawArrowLayers)
                arrowPlot = new global.DC.Plot(global.viewer)

            }

            global.viewer.on(global.DC.MouseEventType.CLICK, this.viewerClick)
            global.viewer.on(global.DC.MouseEventType.MOUSE_MOVE, this.viewerLableMove)
            global.viewer.on(global.DC.MouseEventType.LEFT_UP, this.labelUp)

        })
    },

@@ -143,13 +146,20 @@
        // 地图元素绘制
        draw (poltType, policeType) {

            labelPositionChange = false
            drawLabelStatus = 'end'
            isAddLabel = false

            let flag = false

            const that = this

            global.viewer.tooltip.enable = true

            // this.policeType = ''  // ?

            plot && plot.draw(poltType, overlay => {
                if (isAddLabel) return

                if (poltType == 'billboard' && policeType == 'policeman') {
                    overlay.icon = '/img/icon/police-people.png'
@@ -210,6 +220,11 @@
        },

        drawArrow (type, iconType) {
            labelPositionChange = false
            drawLabelStatus = 'end'
            isAddLabel = false

            global.viewer.tooltip.enable = true

            if (type == 'polygon') {

@@ -217,6 +232,8 @@
                let flag = false

                plot && plot.draw(type, overlay => {
                    if (isAddLabel) return

                    if (overlay) {
                        drawArrowLayers.addOverlay(overlay)
                        plot.edit(overlay, (e) => {
@@ -251,6 +268,8 @@
                let flag = false

                plot && plot.draw(type, overlay => {
                    if (isAddLabel) return

                    if (iconType == 'icon1') {
                        that.$parent.plotSaveType = 6
                        overlay.size = [24, 24]
@@ -284,6 +303,8 @@
                const that = this
                let flag = false
                arrowPlot && arrowPlot.draw(type, overlay => {
                    if (isAddLabel) return

                    if (overlay) {
                        let plotType = ''
                        if (type == 'attack_arrow') {
@@ -295,7 +316,9 @@
                        } else if (type == 'tailed_attack_arrow') {
                            plotType = 4
                        }

                        that.$parent.plotSaveType = plotType

                        plot.edit(overlay, (e) => {
                            flag = true
                            let positionStr = ''
@@ -393,10 +416,13 @@
        },

        drawArrowLabel () {
            this.labelPopupTitle = ""
            global.viewer.tooltip.enable = false
            plot != null && plot.stop()
            arrowPlot != null && arrowPlot.stop()

            isAddLabel = true
            this.labelPopupTitle = ""
            drawLabelStatus = 'start'
            global.viewer.tooltip.enable = true

            this.$emit('drawLabel', drawLabelStatus)
        },
@@ -422,9 +448,9 @@
        },

        labelShowPopup (e) {
            this.labelPopupTitle = '添加文字标注'
            this.addLabelVisible = true
            this.addLabelPosition = e.wgs84SurfacePosition.lng + ' ' + e.wgs84SurfacePosition.lat + ',' + e.wgs84SurfacePosition.lng + ' ' + e.wgs84SurfacePosition.lat
            global.viewer.tooltip.enable = true
        },

        // 文字标注窗口的添加按钮
@@ -455,7 +481,8 @@

            setTimeout(() => {
                if (eventLast == 0) {
                    global.viewer.tooltip.enable = false
                    this.$EventBus.$emit('closeTooltip')

                    labelPositionChange = true
                    curLabelOverLayer = e.overlay
                    global.viewer.scene.screenSpaceCameraController.enableRotate = false
@@ -479,7 +506,7 @@
        },

        updateLableMove (e) {
            global.viewer.tooltip.enable = false
            this.$EventBus.$emit('closeTooltip')

            curLabelOverLayer.position = {
                lng: e.wgs84SurfacePosition.lng,
@@ -493,21 +520,22 @@

        viewerLableMove (e) {
            if (isAddLabel == true) {
                global.viewer.tooltip.showAt(e.windowPosition, '单击选择文字标注位置')
                this.$EventBus.$emit('showTooltip', {
                    position: e.windowPosition,
                    text: '单击选择文字标注位置'
                })
            } else {
                if (e.overlay && e.overlay.attrParams && e.overlay.attrParams.id) {
                    const flag = labelOverLayerID.some(item => item == e.overlay.attrParams.id)

                    if (flag == true) {
                        global.viewer.tooltip.enable = true

                        global.viewer.tooltip.showAt({
                            x: e.windowPosition.x + 10,
                            y: e.windowPosition.y
                        }, '长按开启拖拽,单击修改名称')
                    if (flag == true && labelPositionChange != true) {
                        this.$EventBus.$emit('showTooltip', {
                            position: e.windowPosition,
                            text: '长按开启拖拽,单击修改名称'
                        })
                    }
                } else {
                    global.viewer.tooltip.enable = false
                    this.$EventBus.$emit('closeTooltip')
                }
            }
        },
@@ -517,11 +545,14 @@
            isAddLabel = false
            this.addLabelVisible = false
            drawLabelStatus = 'end'

            this.$EventBus.$emit('closeTooltip')
        },

        // 单击文字标绘
        reEditLabel (e) {
            global.viewer.tooltip.enable = false
            this.$EventBus.$emit('closeTooltip')

            this.labelId = e.overlay.attrParams.id
            this.labelPopupTitle = "修改文字标注"
            this.labelInput = e.overlay.attrParams.item.name
@@ -530,7 +561,8 @@
    },

    destroyed () {
        plot.stop()
        plot != null && plot.stop()
        arrowPlot != null && arrowPlot.stop()

        drawLayers.remove()
        drawLayers = null

 src/views/activity/index.vue

@@ -2,7 +2,7 @@
 * @Author: shuishen 1109946754@qq.com
 * @Date: 2022-08-18 16:18:17
 * @LastEditors: shuishen 1109946754@qq.com
 * @LastEditTime: 2023-03-08 21:52:10
 * @LastEditTime: 2023-03-09 12:09:40
 * @FilePath: \srs-police-affairs\src\views\activity\index.vue
 * @Description: 安保活
 *
@@ -765,20 +765,34 @@
                        arrowsListLayer.addOverlay(chooseArrow)
                        // 缓存区的话需要扣去包含的核心区
                        if (item.areaType == 2) {


                            let itemPositionArr = item.position.slice(11, item.position.length - 1).replace(/,/g, ';').replace(/ /g, ',').split(';')
                            itemPositionArr.push(itemPositionArr[0])
                            itemPositionArr = itemPositionArr.map(item => {
                                return item.split(',').map(Number)
                            })
                            let cachePolygon = this.$turf.polygon([itemPositionArr])

                            plotList.forEach(inItem => {
                                // 查询被包含的核心区
                                if (inItem.areaType == 1 && inItem.type == 5) {


                                    let inItemPositionArr = inItem.position.slice(11, inItem.position.length - 1).replace(/,/g, ';').replace(/ /g, ',').split(';')



                                    inItemPositionArr.push(inItemPositionArr[0])
                                    inItemPositionArr = inItemPositionArr.map(item => {
                                        return item.split(',').map(Number)
                                    })

                                    if (inItemPositionArr.length == 3 && inItemPositionArr[0][0] == inItemPositionArr[2][0] &&
                                        inItemPositionArr[2][1] == inItemPositionArr[0][1]) {
                                        return
                                    }

                                    let carePolygon = this.$turf.polygon([inItemPositionArr])
                                    let isContains = this.$turf.booleanContains(cachePolygon, carePolygon)
                                    // 如果完全包含就作为洞面扣去