Merge branch 'master' of http://192.168.0.105:10010/r/srs-police-affairs

shuishen

2023-02-27 b6beb1bae7c279255856f9305ebb074afb7fb833

Merge branch 'master' of http://192.168.0.105:10010/r/srs-police-affairs

 src/api/dept/index.js

@@ -67,6 +67,7 @@
        // url: '/sf3d/area/getAoiByPt',
        url: '/sf3d/area/stdgetAoiByPt',
        method: 'get',
        authorization: false,
        requestBaseUrl: 'fengt',
        params: {
            lng,
@@ -105,6 +106,7 @@
        // url: '/sf3d/build/houses',
        url: '/sf3d/build/stdhouses',
        method: 'get',
        authorization: false,
        requestBaseUrl: 'fengt',
        params: {
            build_id,

 src/api/video/index.js

@@ -123,6 +123,20 @@
}

/**
 * 历史线面数据查询
 * @param {*} current 当前页
 * @param {*} size 每页数据数量
 */
export const updataRegionSaveList = (params) => {
    return request({
        url: '/api/range/range/updatee',
        method: 'post',
        params: params
    })
}


/**
 * 历史线面数据删除
 * @param {*} id 序号
 */

 src/components/map/index.vue

@@ -355,6 +355,10 @@
            that.mapRemoveLayer(params.layerName, params.type)
        })

        this.$EventBus.$on('mapRemovePolygonLayer', (params) => {
            that.mapRemovePolygonLayer(params.layerName, params.polygonName,params.type)
        })

        this.$EventBus.$on('mapClearLayer', (params) => {
            that.mapClearLayer(params.layerName, params.type)
        })
@@ -565,6 +569,20 @@
        },

        /**
         * 删除图层指定面
         * @param {*} layerName 图层名称
         * @param {*} polygonName 面名称
         * @param {*} type 图层类型
         */
         mapRemovePolygonLayer (layerName,polygonName, type) {
            if (type == 'VectorLayer' || type == 'ClusterLayer' || type == 'HeatLayer') {
                if (layersObjcect[layerName] && layersObjcect[layerName] != null&&polygonObj[polygonName]&&polygonObj[polygonName]!=null) {
                    layersObjcect[layerName].removeOverlay(polygonObj[polygonName])
                }
            }
        },

        /**
         * 清空图层
         * @param {*} layerName 图层名称
         * @param {*} type 图层类型

 src/styles/base/index.scss

@@ -987,4 +987,97 @@
            }
        }
    }
}

.edit-range-box {
    .el-dialog {
        display: flex;
        flex-direction: column;
        width: 240px;
        height: 176px;

        .el-dialog__body {
            .el-button {
                padding: 0;
                background-color: #409eff;
                color: #fff;
                width: 60px;
                height: 30px;
                text-align: center;
                margin-top: 10px;
            }

            &>div {
                display: flex;
                justify-content: center;
                margin-bottom: 10px;
            }

            .value-name-box {
                height: 32px;
                line-height: 32px;
                width: 120px;
            }

            .color-box {
                display: flex;
                width: 140px;
                height: 32px;
                background-color: rgba(8, 56, 185, 0.5);
                padding: 6px;


                &>div {
                    width: 20px;
                    height: 20px;
                    line-height: 20px;
                    border: 1px solid #409EFF;
                    margin-right: 10px;
                    cursor: pointer;
                    user-select: none;
                }

                &>div:hover {
                    border: 1px solid #eee;
                }

                .red-color {
                    background-color: red;
                }

                .green-color {
                    background-color: green;
                }

                .blue-color {
                    background-color: blue;
                }
            }

            .input-width-box {
                input {
                    outline: none;
                    width: 80px;
                    height: 28px;
                    background-color: rgba(8, 56, 185, 0.5);
                    border: none;
                    color: #fff;
                    border-radius: 4px;
                    padding-left: 15px;
                }

                input:focus {
                    border-color: #409EFF;
                    border: 1px solid #409EFF;
                }
            }

            .units {
                width: 40px;
                height: 26px;
                text-align: left;
                padding-left: 10px;
            }
        }
    }
}

 src/styles/media/index.scss

@@ -2301,6 +2301,62 @@
                        }
                    }

                    .edit-range-box {
                        .el-dialog {
                            width: countSizeVw(240, 1920);
                            height: countSizeVh(176);

                            .el-dialog__body {
                                .el-button {
                                    width: countSizeVw(60, 1920);
                                    height: countSizeVh(30);
                                    margin-top: countSizeVh(10);
                                }

                                &>div {
                                    margin-bottom: countSizeVh(10);
                                }

                                .value-name-box {
                                    height: countSizeVh(32);
                                    line-height: countSizeVh(32);
                                    width: countSizeVw(120, 1920);
                                }

                                .color-box {
                                    width: countSizeVw(140, 1920);
                                    height: countSizeVh(32);
                                    padding: countSizeVh(6);


                                    &>div {
                                        width: countSizeVw(20, 1920);
                                        height: countSizeVh(20);
                                        line-height: countSizeVh(20);
                                        border: countSizeVh(1) solid #409EFF;
                                        margin-right: countSizeVw(10, 1920);
                                    }
                                }

                                .input-width-box {
                                    input {
                                        width: countSizeVw(80, 1920);
                                        height: countSizeVh(28);
                                        border-radius: countSizeVh(4);
                                        padding-left: countSizeVw(15, 1920);
                                    }

                                }

                                .units {
                                    width: countSizeVw(40, 1920);
                                    height: countSizeVh(26);
                                    padding-left: countSizeVw(10, 1920)
                                }
                            }
                        }
                    }

                }

                .flexible-btn {

 src/views/activity/index.vue

@@ -1399,7 +1399,7 @@
                        }
                    })
                }
            })
            },{material: global.DC.Color.RED})
        },

        // 删除所有地图绘制元素
@@ -1431,7 +1431,7 @@
                            }
                        })
                    }
                })
                },{material: global.DC.Color.RED})
            } else {
                arrowPlot && arrowPlot.draw(type, overlay => {
                    if (overlay) {
@@ -1455,7 +1455,7 @@
                            this.addSecurityPlot(this.showingSecurityId, position, plotType)
                        })
                    }
                })
                },{material: global.DC.Color.RED})
            }
        },


 src/views/video/list.vue

@@ -294,7 +294,7 @@
                        })
                    }
                }
            })
            },{material: global.DC.Color.RED})
        },

        removeDrawLayer () {
@@ -432,8 +432,7 @@
                    let area = this.$turf.area(polygon)
                    extent = area.toFixed(3)
                }
                console.log({ type: this.drawType, position: drawPositionStr, name: this.drawName, extent: extent, width: this.range }, 5555, this.drawPlotData._positions)
                this.insertRegionSaveList({ type: this.drawType, positions: drawPositionStr, name: this.drawName, extent: extent, width: this.range })
                this.insertRegionSaveList({type:this.drawType, positions:drawPositionStr, name:this.drawName, extent: extent,width:this.range})
                this.drawDialogVisible = false
                this.drawName = ''
                if (drawPlotLayers != null) {

 src/views/video/region.vue

@@ -225,16 +225,49 @@
            :close-on-click-modal="true" class="car-video-box">
            <video id="videoElement" autoplay controls width="100%" height="100%" style="object-fit: fill"></video>
        </el-dialog>

        <el-dialog title="修改范围" :modal="false" :visible.sync="editRangeVisible" :close-on-click-modal="true"
            class="edit-range-box">
            <div>
                <div class="value-name-box">选择范围颜色：</div>
                <div class="color-box">
                    <div class="red-color" @click="changeRangeColor('#FF0000')">{{ chooseRangeColor == '#FF0000' ? '√' : '' }}
                    </div>
                    <div class="green-color" @click="changeRangeColor('#00FF00')">{{ chooseRangeColor == '#00FF00' ? '√' : ''
                    }}
                    </div>
                    <div class="blue-color" @click="changeRangeColor('#0000FF')">{{ chooseRangeColor == '#0000FF' ? '√' : ''
                    }}
                    </div>
                </div>
            </div>
            <div v-show="isLineRange">
                <div class="value-name-box">设置范围宽度：</div>
                <div class="input-width-box">
                    <input type="text" v-model="lineWidth" placeholder="请输入..." />
                </div>
                <div class="units">米</div>
            </div>
            <div>
                <el-button @click="saveRangeInfo">保存</el-button>
                <el-button @click="editRange">编辑</el-button>
                <el-button @click="deleteRange">删除</el-button>
                <el-button @click="editRangeVisible = false">取消</el-button>
            </div>
        </el-dialog>
    </div>
</template>

<script>
import EntityDraw from "@/utils/EntityDraw.js"
import { listQuery, accurateSearch } from "@/utils/search.js"
import { getVideoList, getDevices, getRegionSaveList, deleteRegionSaveList, getRegionList } from '@/api/video/index.js'
import { getVideoList, getDevices, getRegionSaveList, deleteRegionSaveList, getRegionList ,updataRegionSaveList} from '@/api/video/index.js'
import flvjs from 'flv.js'

let graphicLayer = null
// let graphicLayer = null
let rangeLayer = null
let rangeLineLayer = null
let plot = undefined

export default {
    inject: ['userInfo'],
@@ -306,7 +339,13 @@
                video6: false,
                video7: false,
                video8: false,
            }
            },
            chooseRangeColor: '#FF0000',
            editRangeVisible:false,
            lineWidth:'',
            rangeOverlayData:{},
            isLineRange:false,
            isEndDrawPlot:true,
        }
    },

@@ -318,7 +357,19 @@

    mounted () {
        this.$parent.$parent.$parent.resize('400px', true)
        graphicLayer = new EntityDraw()
        // graphicLayer = new EntityDraw()
        this.$nextTick(() => {
            if (rangeLayer == null) {
            rangeLayer = new global.DC.VectorLayer('rangeLayer')
                global.viewer.addLayer(rangeLayer)
                plot = new global.DC.Plot(global.viewer)
            }
            if (rangeLineLayer == null) {
                rangeLineLayer = new global.DC.VectorLayer('rangeLineLayer')
                global.viewer.addLayer(rangeLineLayer)
            }
        })
        
    },

    methods: {
@@ -442,7 +493,7 @@

        initRangeListLayer () {
            this.$EventBus.$emit('mapRemoveLayer', {
                layerName: 'rangeLayer',
                layerName: 'rangeSaveLayer',
                type: 'VectorLayer'
            })

@@ -450,46 +501,139 @@
                layerName: 'monitoringLayers',
                type: 'VectorLayer'
            })
            
            if (rangeLineLayer != null) {
                rangeLineLayer.clear()
            }

            this.saveRangeList.forEach(item => {
                let positionStr = ''
                if (item.type == 1) {
                    let linePositionStr = ''
                    linePositionStr = item.positions.replace(/,/g, ';')
                    linePositionStr = linePositionStr.replace(/ /g, ',')
                    linePositionStr += ';'
                    this.$EventBus.$emit('layerPolylineAdd', {
                        layerName: 'rangeLayer',
                        positions: linePositionStr,
                        material: global.DC.Color.YELLOW.withAlpha(0.8),
                        width: 1,
                    })
                    let coords = global.DC.GeoTools.polylineBuffer(linePositionStr, 100)
                    let polygon = new global.DC.Polygon(coords)
                    let position = ''
                    polygon._positions.forEach(item => {
                        position += item._lng + ',' + item._lat + ';'
                    })
                    positionStr = position
                } else {
                if(item.type == 1){
                   let linePositionStr = ''
                   linePositionStr = item.positions.replace(/,/g,';')
                   linePositionStr = linePositionStr.replace(/ /g, ',')
                   linePositionStr +=';'
                   let coords = global.DC.GeoTools.polylineBuffer(linePositionStr, 100)
                   let polygon = new global.DC.Polygon(coords)
                   let position = ''
                   polygon._positions.forEach(item => {
                       position += item._lng + ',' + item._lat + ';'
                   })
                   positionStr = position
                }else{
                    positionStr = this.convertPositionDate(item.positions, 'polygon')
                }
                let color = ''
                        if (item.color == '') {
                            color = global.DC.Namespace.Cesium.Color.fromBytes(255, 0, 0, 150)
                        } else {
                            let r = parseInt(item.color.slice(1, 3), 16)
                            let g = parseInt(item.color.slice(3, 5), 16)
                            let b = parseInt(item.color.slice(5, 7), 16)
                            color = global.DC.Namespace.Cesium.Color.fromBytes(r, g, b, 150)
                        }
                this.$EventBus.$emit('layerPolygonAdd', {
                    layerName: 'rangeLayer',
                    positions: positionStr,
                    material: global.DC.Namespace.Cesium.Color.fromBytes(
                        255, 0, 0, 100
                    ),
                    polygonName: 'polygon' + item.id,
                    incident: this.overlayTypeClick
                        layerName: 'rangeSaveLayer',
                        positions: positionStr,
                        material: color,
                        polygonName: 'polygon' + item.id,
                        params:item,
                        incident: this.overlayTypeClick
                })
            })

        },

        // 点击线面
        overlayTypeClick (e) {
            console.log(e, 23232)
        overlayTypeClick(e){
            if(this.isEndDrawPlot == false){
                this.$message({
                    message: '请先完成编辑',
                    type: 'error'
                })
            }else{
                 this.rangeOverlayData = e.overlay
                 this.lineWidth = e.overlay.attrParams.width != -1 ? e.overlay.attrParams.width : 100
                 this.chooseRangeColor = e.overlay.attrParams.color != '' ? e.overlay.attrParams.color : '#FF0000'
                 if(e.overlay.attrParams.type == 1){
                     this.isLineRange = true
                 }else{
                     this.isLineRange = false
                 }
                 this.editRangeVisible =true
            }
        },

         // 改变范围颜色
         changeRangeColor (color) {
            this.chooseRangeColor = color
        },

        // 保存范围修改
        saveRangeInfo() {
            this.updataRegionSaveList({ id: this.rangeOverlayData.attrParams.id, color: this.chooseRangeColor ,width:this.lineWidth})
            this.editRangeVisible = false
        },

        // 更新范围信息
        updataRegionSaveList(params){
            this.isEndDrawPlot =true
            updataRegionSaveList(params).then(res=>{
                if (res.data.success) {
                    this.$message({
                        message: '保存成功',
                        type: 'warning'
                    })
                } else {
                    this.$message({
                        message: '保存失败'
                    })
                }
                this.getRegionSaveList(this.currentPage, this.pagesize, this.userInfo.dept_id)
                this.editRangeVisible = false
            })
        },

        // 删除线面
        deleteRange(){
            deleteRegionSaveList(this.rangeOverlayData.attrParams.id).then(res => {
                if (res.data.success) {
                    this.$message({
                        message: '删除成功',
                        type: 'warning'
                    })
                    this.getRegionSaveList(this.currentPage, this.pagesize, this.userInfo.dept_id)
                } else {
                    this.$message({
                        message: '删除失败'
                    })
                }
            this.editRangeVisible = false
            })
        },

        // 编辑线面
        editRange(){
            this.editRangeVisible = false
            this.isEndDrawPlot =false
            let overlayData = this.rangeOverlayData
            if(this.rangeOverlayData.attrParams.type == 1){
                this.$EventBus.$emit('mapRemovePolygonLayer', {
                    layerName: 'rangeSaveLayer',
                    polygonName: 'polygon' + this.rangeOverlayData.attrParams.id,
                    type: 'VectorLayer'
            })
            overlayData = this.rangeOverlayData.attrParams.lineObj
            }
            plot.edit(overlayData, (e) => {
                let position = ''
                overlayData._positions.forEach(item => {
                    position += item._lng + ' ' + item._lat + ','
                })
                position = position.slice(0, position.length - 1)
                rangeLayer.addOverlay(overlayData)
                this.updataRegionSaveList({ id: this.rangeOverlayData.attrParams.id, color: this.chooseRangeColor ,width:this.lineWidth,positions:position})
            })
        },

        convertPositionDate (data, type) {
@@ -853,12 +997,16 @@
        })

        this.$EventBus.$emit('mapRemoveLayer', {
            layerName: 'rangeLayer',
            layerName: 'rangeSaveLayer',
            type: 'VectorLayer'
        })

        graphicLayer.destroy()
        // graphicLayer.destroy()

        if (rangeLineLayer != null) {
                rangeLineLayer.clear()
            }
            
        this.$parent.$parent.$parent.resize('0px')

        if (this.flvPlayer != null) {