活动页面切换按钮功能实现

guanqb

2023-01-09 6fb1a6da698c02ba1680974443aca25d4a782efb

活动页面切换按钮功能实现

 src/views/activity/index.vue

@@ -248,7 +248,7 @@
            <!-- <div class="row-box">
                <div class="category">应急预案：</div>
                <div class="category-value">
                    <el-switch v-model="polylineSwitch" @change="switchChange" active-color="#13ce66"
                    <el-switch v-model="policeSwitch" @change="switchChange" active-color="#13ce66"
                        inactive-color="#ccc"></el-switch>
                </div>
            </div>
@@ -280,7 +280,7 @@
                <div class="category">警力资源：</div>
                <div class="category-value">
                    <el-switch
                        v-model="polylineSwitch"
                        v-model="policeSwitch"
                        @change="switchChange"
                        active-color="#13ce66"
                        inactive-color="#ccc"
@@ -561,9 +561,9 @@
            },
            dialogVisible: false,
            currentClickIndex: '',
            polylineSwitch: false,
            arrowBtnSwitch: false,
            polylineBtnSwitch: false,
            policeSwitch: true,
            arrowBtnSwitch: true,
            polylineBtnSwitch: true,
            analyseInput: 100,
            activityList: [],
            activityDetails: {},
@@ -699,7 +699,7 @@
        },

        // 获取活动警员分布信息
        getSecurityPoliceList (securityId) {
        getSecurityPoliceList (securityId, pointShow) {
            this.removeAll()
            this.$EventBus.$emit('mapClearLayer', {
                layerName: 'newDrawLayers',
@@ -733,7 +733,7 @@
                            incident: this.overlayTypeClick
                        })

                    } else if (item.type == 3) {
                    } else if (item.type == 3 && pointShow) {
                        let positionObj = this.convertBillboardPositionDate(item.position, 'policeman', item.id, item.policemanId)
                        this.$EventBus.$emit('layerPointAdd', {
                            layerName: 'newDrawLayers',
@@ -747,7 +747,7 @@
        },

        // 获取活动警车分布信息
        getSecurityCarList (securityId) {
        getSecurityCarList (securityId, pointShow, polylineShow) {
            this.removeAll()
            this.$EventBus.$emit('mapClearLayer', {
                layerName: 'newCarDrawLayers',
@@ -755,7 +755,7 @@
            })
            getSecurityCarList(securityId).then(res => {
                res.data.data.forEach(item => {
                    if (item.type == 1) {
                    if (item.type == 1 && polylineShow) {
                        let positionNewArr = this.convertPolylineOrPolygonPositionDate(item.position, item.type)
                        this.$EventBus.$emit('layerPolylineAdd', {
                            layerName: 'newCarDrawLayers',
@@ -781,7 +781,7 @@
                            // incident: this.overlayTypeClick
                        })

                    } else if (item.type == 3) {
                    } else if (item.type == 3 && pointShow) {
                        let positionObj = this.convertBillboardPositionDate(item.position, 'policecar', item.id, item.carId)
                        this.$EventBus.$emit('layerPointAdd', {
                            layerName: 'newCarDrawLayers',
@@ -835,21 +835,21 @@
        // 修改活动警员
        updateActivityPolice (id, policemanId) {
            updateActivityPolice(id, policemanId).then(res => {
                this.getSecurityPoliceList(this.showingSecurityId)
                this.getSecurityPoliceList(this.showingSecurityId, this.policeSwitch)
            })
        },

        // 修改活动警车
        updateActivityCar (id, carId) {
            updateActivityCar(id, carId).then(res => {
                this.getSecurityCarList(this.showingSecurityId)
                this.getSecurityCarList(this.showingSecurityId, this.policeSwitch, this.polylineBtnSwitch)
            })
        },

        // 活动添加警车和范围
        addCarAndRange (carId, position, securityId, type) {
            addCarAndRange(carId, position, securityId, type).then(res => {
                this.getSecurityCarList(securityId)
                this.getSecurityCarList(securityId, this.policeSwitch, this.polylineBtnSwitch)
            })
        },

@@ -869,7 +869,7 @@
        // 活动添加警员
        addActivityPolice (policemanId, position, securityId, type) {
            addActivityPolice(policemanId, position, securityId, type).then(res => {
                this.getSecurityPoliceList(securityId)
                this.getSecurityPoliceList(securityId, this.policeSwitch)
            })
        },

@@ -950,17 +950,15 @@
                layerName: 'newDrawLayers',
                type: 'VectorLayer'
            })
            this.getSecurityPoliceList(item.id)
            this.getSecurityCarList(item.id)
            this.getSecurityPlotList(item.id)
            this.getSecurityPoliceList(item.id, this.policeSwitch)
            this.getSecurityCarList(item.id, this.policeSwitch, this.polylineBtnSwitch)
            this.getSecurityPlotList(item.id, this.arrowBtnSwitch)
            if (this.currentClickIndex !== '' && this.currentClickIndex == index) {
                return
            }
            this.analyseInput = 100

            this.activityDetails = item

            this.polylineSwitch = false

            if (analyseLayer != null) {
                analyseLayer.clear()
@@ -996,8 +994,10 @@
            })
        },

        // 切换轨迹路线显示
        // 切换轨警力资源显示
        switchChange (e) {
            this.getSecurityCarList(this.securityId, this.policeSwitch, this.polylineBtnSwitch)
            this.getSecurityPoliceList(this.showingSecurityId, this.policeSwitch)
            if (e == true) {
                this.$EventBus.$emit('layerPolylineAdd', {
                    layerName: 'polylineLayer',
@@ -1021,12 +1021,13 @@

        // 切换作战标绘
        switchArrowBtnChange (e) {

            this.getSecurityPlotList(this.securityIdy, this.arrowBtnSwitch)
        },

        // 切换轨迹播放控件
        switchBtnChange (e) {
            this.isTrackBtnShow = e
            this.getSecurityCarList(this.securityId, this.policeSwitch, this.polylineBtnSwitch)
        },

        // 输入绘制线范围
@@ -1050,7 +1051,6 @@
        closeActivityDetails () {
            this.dialogVisible = false
            this.currentClickIndex = ''
            this.polylineSwitch = false
            analyseLayer.clear()
            this.$EventBus.$emit('mapClearLayer', {
                layerName: 'polylineLayer',
@@ -1245,14 +1245,15 @@
        // 保存活动标绘箭头
        addSecurityPlot (securityId, position, type) {
            addSecurityPlot(securityId, position, type).then(res => {
                this.getSecurityPlotList(securityId)
                this.getSecurityPlotList(securityId, this.arrowBtnSwitch)
            })
        },

        // 获取活动标绘箭头列表
        getSecurityPlotList (securityId) {
        getSecurityPlotList (securityId, arrowShow) {
            arrowsListLayer.clear()
            this.removeAllArrow()
            if (!arrowShow) return
            getSecurityPlotList(securityId).then(res => {
                res.data.data.forEach(item => {
                    let position = item.position.slice(11, item.position.length - 1).replace(/,/g, ';').replace(/ /g, ',')
@@ -1294,7 +1295,7 @@
        updateSecurityPlot (id, position) {
            updateSecurityPlot(id, position).then(res => {
                console.log(res, 222)
                this.getSecurityPlotList(this.securityId)
                this.getSecurityPlotList(this.securityId, this.arrowBtnSwitch)
            })
        },