parent: c0c494b2 | patch | commit | ignore whitespace
guanqb
2022-11-02 619b9006bf1746f5d6d0672c9e68fa441bde06e2 
警情图标扩散图
4 files modified
1 files added
93 ■■■■■ changed files
public/img/icon/jq.png patch | view | raw | blame | history
src/assets/data/policeSituationArr/mouthArr.js 20 ●●●●● patch | view | raw | blame | history
src/assets/data/policeSituationArr/weekArr.js 20 ●●●●● patch | view | raw | blame | history
src/views/home/components/bottomContainer.vue 10 ●●●●● patch | view | raw | blame | history
src/views/home/index.vue 43 ●●●●● patch | view | raw | blame | history 
 public/img/icon/jq.png




 src/assets/data/policeSituationArr/mouthArr.js


@@ -1,12 +1,12 @@


export default [


    { 'num': '1', 'type': '聚众斗殴', 'comingPhone': '13466669999', 'dealTime': '2022-09-01', 'dealPolice': '王警官', 'callPeople': '张某三', 'callPhone': '15511112222', 'callContent': '他们先动的手', 'policeName': '车站派出所', 'position': [115.968301, 28.692978] },


    { 'num': '2', 'type': '聚众斗殴', 'comingPhone': '13466669999', 'dealTime': '2022-09-12', 'dealPolice': '王警官', 'callPeople': '张某三', 'callPhone': '15511112222', 'callContent': '他们先动的手', 'policeName': '车站派出所', 'position': [116.001740, 28.652388] },


    { 'num': '3', 'type': '聚众斗殴', 'comingPhone': '13466669999', 'dealTime': '2022-09-13', 'dealPolice': '王警官', 'callPeople': '张某三', 'callPhone': '15511112222', 'callContent': '他们先动的手', 'policeName': '沙溪派出所', 'position': [115.986928, 28.534698] },


    { 'num': '4', 'type': '聚众斗殴', 'comingPhone': '13466669999', 'dealTime': '2022-09-20', 'dealPolice': '王警官', 'callPeople': '张某三', 'callPhone': '15511112222', 'callContent': '他们先动的手', 'policeName': '沙溪派出所', 'position': [116.063849, 28.592397] },


    { 'num': '5', 'type': '聚众斗殴', 'comingPhone': '13466669999', 'dealTime': '2022-09-21', 'dealPolice': '王警官', 'callPeople': '张某三', 'callPhone': '15511112222', 'callContent': '他们先动的手', 'policeName': '灵溪派出所', 'position': [116.088476, 28.584286] },


    { 'num': '6', 'type': '聚众斗殴', 'comingPhone': '13466669999', 'dealTime': '2022-09-21', 'dealPolice': '王警官', 'callPeople': '张某三', 'callPhone': '15511112222', 'callContent': '他们先动的手', 'policeName': '灵溪派出所', 'position': [116.130909, 28.571193] },


    { 'num': '7', 'type': '聚众斗殴', 'comingPhone': '13466669999', 'dealTime': '2022-09-21', 'dealPolice': '王警官', 'callPeople': '张某三', 'callPhone': '15511112222', 'callContent': '他们先动的手', 'policeName': '北门派出所', 'position': [116.169778, 28.615767] },


    { 'num': '8', 'type': '聚众斗殴', 'comingPhone': '13466669999', 'dealTime': '2022-09-21', 'dealPolice': '王警官', 'callPeople': '张某三', 'callPhone': '15511112222', 'callContent': '他们先动的手', 'policeName': '北门派出所', 'position': [116.288719, 28.685802] },


    { 'num': '9', 'type': '聚众斗殴', 'comingPhone': '13466669999', 'dealTime': '2022-09-21', 'dealPolice': '王警官', 'callPeople': '张某三', 'callPhone': '15511112222', 'callContent': '他们先动的手', 'policeName': '江光派出所', 'position': [116.116809, 28.786638] },


    { 'num': '10', 'type': '聚众斗殴', 'comingPhone': '13466669999', 'dealTime': '2022-09-21', 'dealPolice': '王警官', 'callPeople': '张某三', 'callPhone': '15511112222', 'callContent': '他们先动的手', 'policeName': '江光派出所', 'position': [116.190200, 28.759358] },


    { 'num': '1', 'type': '聚众斗殴', 'state': '紧急', 'comingPhone': '13466669999', 'dealTime': '2022-09-01', 'dealPolice': '王警官', 'callPeople': '张某三', 'callPhone': '15511112222', 'callContent': '他们先动的手', 'policeName': '车站派出所', 'position': [115.968301, 28.692978] },


    { 'num': '2', 'type': '聚众斗殴', 'state': '常规', 'comingPhone': '13466669999', 'dealTime': '2022-09-12', 'dealPolice': '王警官', 'callPeople': '张某三', 'callPhone': '15511112222', 'callContent': '他们先动的手', 'policeName': '车站派出所', 'position': [116.001740, 28.652388] },


    { 'num': '3', 'type': '聚众斗殴', 'state': '紧急', 'comingPhone': '13466669999', 'dealTime': '2022-09-13', 'dealPolice': '王警官', 'callPeople': '张某三', 'callPhone': '15511112222', 'callContent': '他们先动的手', 'policeName': '沙溪派出所', 'position': [115.986928, 28.534698] },


    { 'num': '4', 'type': '聚众斗殴', 'state': '常规', 'comingPhone': '13466669999', 'dealTime': '2022-09-20', 'dealPolice': '王警官', 'callPeople': '张某三', 'callPhone': '15511112222', 'callContent': '他们先动的手', 'policeName': '沙溪派出所', 'position': [116.063849, 28.592397] },


    { 'num': '5', 'type': '聚众斗殴', 'state': '紧急', 'comingPhone': '13466669999', 'dealTime': '2022-09-21', 'dealPolice': '王警官', 'callPeople': '张某三', 'callPhone': '15511112222', 'callContent': '他们先动的手', 'policeName': '灵溪派出所', 'position': [116.088476, 28.584286] },


    { 'num': '6', 'type': '聚众斗殴', 'state': '常规', 'comingPhone': '13466669999', 'dealTime': '2022-09-21', 'dealPolice': '王警官', 'callPeople': '张某三', 'callPhone': '15511112222', 'callContent': '他们先动的手', 'policeName': '灵溪派出所', 'position': [116.130909, 28.571193] },


    { 'num': '7', 'type': '聚众斗殴', 'state': '紧急', 'comingPhone': '13466669999', 'dealTime': '2022-09-21', 'dealPolice': '王警官', 'callPeople': '张某三', 'callPhone': '15511112222', 'callContent': '他们先动的手', 'policeName': '北门派出所', 'position': [116.169778, 28.615767] },


    { 'num': '8', 'type': '聚众斗殴', 'state': '常规', 'comingPhone': '13466669999', 'dealTime': '2022-09-21', 'dealPolice': '王警官', 'callPeople': '张某三', 'callPhone': '15511112222', 'callContent': '他们先动的手', 'policeName': '北门派出所', 'position': [116.288719, 28.685802] },


    { 'num': '9', 'type': '聚众斗殴', 'state': '紧急', 'comingPhone': '13466669999', 'dealTime': '2022-09-21', 'dealPolice': '王警官', 'callPeople': '张某三', 'callPhone': '15511112222', 'callContent': '他们先动的手', 'policeName': '江光派出所', 'position': [116.116809, 28.786638] },


    { 'num': '10', 'type': '聚众斗殴', 'state': '常规', 'comingPhone': '13466669999', 'dealTime': '2022-09-21', 'dealPolice': '王警官', 'callPeople': '张某三', 'callPhone': '15511112222', 'callContent': '他们先动的手', 'policeName': '江光派出所', 'position': [116.190200, 28.759358] },


]




 src/assets/data/policeSituationArr/weekArr.js


@@ -1,12 +1,12 @@


export default [


    { 'num': '1', 'type': '民事纠纷', 'comingPhone': '15511112222', 'dealTime': '2022-10-01', 'dealPolice': '刘警官', 'callPeople': '张某某', 'callPhone': '13466669999', 'callContent': '他先动的手', 'policeName': '车站派出所', 'position': [115.956092, 28.655133] },


    { 'num': '2', 'type': '民事纠纷', 'comingPhone': '15511112222', 'dealTime': '2022-10-04', 'dealPolice': '刘警官', 'callPeople': '张某某', 'callPhone': '13466669999', 'callContent': '他先动的手', 'policeName': '车站派出所', 'position': [115.988650, 28.672257] },


    { 'num': '3', 'type': '民事纠纷', 'comingPhone': '15511112222', 'dealTime': '2022-10-09', 'dealPolice': '刘警官', 'callPeople': '张某某', 'callPhone': '13466669999', 'callContent': '他先动的手', 'policeName': '沙溪派出所', 'position': [115.991405, 28.614604] },


    { 'num': '4', 'type': '民事纠纷', 'comingPhone': '15511112222', 'dealTime': '2022-10-12', 'dealPolice': '刘警官', 'callPeople': '张某某', 'callPhone': '13466669999', 'callContent': '他先动的手', 'policeName': '沙溪派出所', 'position': [116.035493, 28.555238] },


    { 'num': '5', 'type': '民事纠纷', 'comingPhone': '15511112222', 'dealTime': '2022-10-19', 'dealPolice': '刘警官', 'callPeople': '张某某', 'callPhone': '13466669999', 'callContent': '他先动的手', 'policeName': '灵溪派出所', 'position': [116.131969, 28.547531] },


    { 'num': '6', 'type': '民事纠纷', 'comingPhone': '15511112222', 'dealTime': '2022-10-19', 'dealPolice': '刘警官', 'callPeople': '张某某', 'callPhone': '13466669999', 'callContent': '他先动的手', 'policeName': '灵溪派出所', 'position': [116.228057, 28.574474] },


    { 'num': '7', 'type': '民事纠纷', 'comingPhone': '15511112222', 'dealTime': '2022-10-19', 'dealPolice': '刘警官', 'callPeople': '张某某', 'callPhone': '13466669999', 'callContent': '他先动的手', 'policeName': '北门派出所', 'position': [116.125402, 28.626082] },


    { 'num': '8', 'type': '民事纠纷', 'comingPhone': '15511112222', 'dealTime': '2022-10-19', 'dealPolice': '刘警官', 'callPeople': '张某某', 'callPhone': '13466669999', 'callContent': '他先动的手', 'policeName': '北门派出所', 'position': [116.254688, 28.633999] },


    { 'num': '9', 'type': '民事纠纷', 'comingPhone': '15511112222', 'dealTime': '2022-10-19', 'dealPolice': '刘警官', 'callPeople': '张某某', 'callPhone': '13466669999', 'callContent': '他先动的手', 'policeName': '江光派出所', 'position': [116.125914, 28.731029] },


    { 'num': '10', 'type': '民事纠纷', 'comingPhone': '15511112222', 'dealTime': '2022-10-19', 'dealPolice': '刘警官', 'callPeople': '张某某', 'callPhone': '13466669999', 'callContent': '他先动的手', 'policeName': '江光派出所', 'position': [116.022654, 28.758122] },


    { 'num': '1', 'type': '民事纠纷', 'state': '紧急', 'comingPhone': '15511112222', 'dealTime': '2022-10-01', 'dealPolice': '刘警官', 'callPeople': '张某某', 'callPhone': '13466669999', 'callContent': '他先动的手', 'policeName': '车站派出所', 'position': [115.956092, 28.655133] },


    { 'num': '2', 'type': '民事纠纷', 'state': '常规', 'comingPhone': '15511112222', 'dealTime': '2022-10-04', 'dealPolice': '刘警官', 'callPeople': '张某某', 'callPhone': '13466669999', 'callContent': '他先动的手', 'policeName': '车站派出所', 'position': [115.988650, 28.672257] },


    { 'num': '3', 'type': '民事纠纷', 'state': '紧急', 'comingPhone': '15511112222', 'dealTime': '2022-10-09', 'dealPolice': '刘警官', 'callPeople': '张某某', 'callPhone': '13466669999', 'callContent': '他先动的手', 'policeName': '沙溪派出所', 'position': [115.991405, 28.614604] },


    { 'num': '4', 'type': '民事纠纷', 'state': '常规', 'comingPhone': '15511112222', 'dealTime': '2022-10-12', 'dealPolice': '刘警官', 'callPeople': '张某某', 'callPhone': '13466669999', 'callContent': '他先动的手', 'policeName': '沙溪派出所', 'position': [116.035493, 28.555238] },


    { 'num': '5', 'type': '民事纠纷', 'state': '紧急', 'comingPhone': '15511112222', 'dealTime': '2022-10-19', 'dealPolice': '刘警官', 'callPeople': '张某某', 'callPhone': '13466669999', 'callContent': '他先动的手', 'policeName': '灵溪派出所', 'position': [116.131969, 28.547531] },


    { 'num': '6', 'type': '民事纠纷', 'state': '常规', 'comingPhone': '15511112222', 'dealTime': '2022-10-19', 'dealPolice': '刘警官', 'callPeople': '张某某', 'callPhone': '13466669999', 'callContent': '他先动的手', 'policeName': '灵溪派出所', 'position': [116.228057, 28.574474] },


    { 'num': '7', 'type': '民事纠纷', 'state': '紧急', 'comingPhone': '15511112222', 'dealTime': '2022-10-19', 'dealPolice': '刘警官', 'callPeople': '张某某', 'callPhone': '13466669999', 'callContent': '他先动的手', 'policeName': '北门派出所', 'position': [116.125402, 28.626082] },


    { 'num': '8', 'type': '民事纠纷', 'state': '常规', 'comingPhone': '15511112222', 'dealTime': '2022-10-19', 'dealPolice': '刘警官', 'callPeople': '张某某', 'callPhone': '13466669999', 'callContent': '他先动的手', 'policeName': '北门派出所', 'position': [116.254688, 28.633999] },


    { 'num': '9', 'type': '民事纠纷', 'state': '紧急', 'comingPhone': '15511112222', 'dealTime': '2022-10-19', 'dealPolice': '刘警官', 'callPeople': '张某某', 'callPhone': '13466669999', 'callContent': '他先动的手', 'policeName': '江光派出所', 'position': [116.125914, 28.731029] },


    { 'num': '10', 'type': '民事纠纷', 'state': '常规', 'comingPhone': '15511112222', 'dealTime': '2022-10-19', 'dealPolice': '刘警官', 'callPeople': '张某某', 'callPhone': '13466669999', 'callContent': '他先动的手', 'policeName': '江光派出所', 'position': [116.022654, 28.758122] },


]




 src/views/home/components/bottomContainer.vue


@@ -25,6 +25,7 @@


                <li style="color: #fff; background: rgb(1, 76, 137);">


                    <span class="num">序号</span>


                    <span class="type">警情类别</span>


                    <span class="state">警情状态</span>


                    <span class="comingPhone">报警电话</span>


                    <span class="dealTime">接警时间</span>


                    <span class="dealPolice">经办民警</span>


@@ -49,6 +50,7 @@


                    >


                        <span class="num" v-text="item.num"></span>


                        <span class="type" v-text="item.type"></span>


                        <span class="state" v-text="item.state"></span>


                        <span class="comingPhone" v-text="item.comingPhone"></span>


                        <span class="dealTime" v-text="item.dealTime"></span>


                        <span class="dealPolice" v-text="item.dealPolice"></span>


@@ -291,6 +293,10 @@


                    width: 10%;


                }




                .state {


                    width: 8%;


                }




                .comingPhone {


                    width: 14%;


                }


@@ -300,11 +306,11 @@


                }




                .dealPolice {


                    width: 12%;


                    width: 8%;


                }




                .callPeople {


                    width: 12%;


                    width: 8%;


                }




                .callPhone {




 src/views/home/index.vue


@@ -343,6 +343,7 @@




<script>


let cylinderLayer = null


let circleDiffLayer = null




import axios from "axios"


import carList from '@/assets/data/car.js'


@@ -601,6 +602,8 @@


    mounted () {


        this.$nextTick(() => {


            this.initPoliceStationLayer()


            circleDiffLayer = new global.DC.VectorLayer('circleDiffLayer')


            global.viewer.addLayer(circleDiffLayer)




            document.querySelector('.dc-container .dc-zoom-controller').classList.add('homebottom')


            document.querySelector('.dc-container .dc-location-bar').classList.add('homebottom')


@@ -864,6 +867,11 @@


                layerName: 'policeSituationLayers',


                type: 'VectorLayer'


            })


            circleDiffLayer.clear()


            circleDiffLayer.remove()


            circleDiffLayer = null


            circleDiffLayer = new global.DC.VectorLayer('circleDiffLayer')


            global.viewer.addLayer(circleDiffLayer)


            if (this.policeSituationLayerShow == true) {


                this.policeSituationList.forEach(item => {


                    this.$EventBus.$emit('layerPointAdd', {


@@ -872,12 +880,33 @@


                        params: item,


                        incident: this.policeSituationSiteClick


                    })


                    let center = global.DC.Position.fromObject({ lng: item.lng, lat: item.lat })


                    let circle = new global.DC.Circle(center, 1000)


                    if (item.state == '紧急') {


                        circle.setStyle({


                            material: new global.DC.CircleDiffuseMaterialProperty({


                                color: global.DC.Color.RED.withAlpha(0.2),


                                speed: 8.0


                            })


                        })


                    } else {


                        circle.setStyle({


                            material: new global.DC.CircleDiffuseMaterialProperty({


                                color: global.DC.Color.GREEN.withAlpha(0.2),


                                speed: 8.0


                            })


                        })


                    }


                    circleDiffLayer.addOverlay(circle)


                })


            } else {


                this.$EventBus.$emit('mapClearLayer', {


                    layerName: 'policeSituationLayers',


                    type: 'VectorLayer'


                })


                circleDiffLayer.clear()


                // circleDiffLayer.remove()


                // circleDiffLayer = null


            }


        },




@@ -910,7 +939,7 @@


                showArr = this.policeSituationMouthArr


            }


            showArr.forEach((item, index) => {


                showNewArr.push({ name: `${index + 1}号警情`, lng: `${Number(item.position[0])}`, lat: `${Number(item.position[1])}`, alt: 100, url: '/img/icon/zf.png' })


                showNewArr.push({ name: `${index + 1}号警情`, lng: `${Number(item.position[0])}`, lat: `${Number(item.position[1])}`, alt: 100, url: '/img/icon/jq.png', state: item.state })


            })


            this.policeSituationList = showNewArr


        },


@@ -1405,6 +1434,10 @@


        cylinderLayer.clear()


        cylinderLayer.remove()


        cylinderLayer = null


        circleDiffLayer.clear()


        circleDiffLayer.remove()


        circleDiffLayer = null






        document.querySelector('.dc-container .dc-zoom-controller').classList.remove('homebottom')


        document.querySelector('.dc-container .dc-location-bar').classList.remove('homebottom')


@@ -1543,14 +1576,14 @@


        }


        .policeSituation {


            :deep(.el-checkbox__inner) {


                background: rgb(191, 135, 92);


                border-color: rgb(191, 135, 92);


                background: rgb(228, 63, 63);


                border-color: rgb(228, 63, 63);


            }




            :deep(.is-checked) {


                .el-checkbox__inner {


                    background: rgb(191, 135, 92);


                    border-color: rgb(191, 135, 92);


                    background: rgb(228, 63, 63);


                    border-color: rgb(228, 63, 63);


                }


            }


        }