shuishen
2023-04-09 669ceaf9e4ca2dec505a208b0efb960b8f3dc83f
Merge branch 'master' of http://s16s652780.51mypc.cn:49896/r/srs-police-affairs
13 files modified
318 ■■■■ changed files
src/components/map/index.vue 43 ●●●● patch | view | raw | blame | history
src/store/getters.js 1 ●●●● patch | view | raw | blame | history
src/store/modules/popupParams.js 10 ●●●● patch | view | raw | blame | history
src/styles/dc/index.scss 2 ●●● patch | view | raw | blame | history
src/styles/media/index.scss 15 ●●●●● patch | view | raw | blame | history
src/utils/turfPolygon.js 5 ●●●●● patch | view | raw | blame | history
src/views/activity/components/publicIndex.vue 5 ●●●●● patch | view | raw | blame | history
src/views/activity/index.vue 26 ●●●●● patch | view | raw | blame | history
src/views/home/components/bottomContainer.vue 6 ●●●●● patch | view | raw | blame | history
src/views/home/components/rightContainer.vue 130 ●●●●● patch | view | raw | blame | history
src/views/home/index.vue 26 ●●●● patch | view | raw | blame | history
src/views/policeInfor/index.vue 45 ●●●●● patch | view | raw | blame | history
vue.config.js 4 ●●●● patch | view | raw | blame | history
src/components/map/index.vue
@@ -10,20 +10,24 @@
-->
<template>
    <div class="viewer-box" id="viewer-container">
        <slot ref="mainContent" name="mainContent"></slot>
        <slot name="showButton"></slot>
    <slot ref="mainContent" name="mainContent"></slot>
    <slot name="showButton"></slot>
        <div class="over-look-btn">
            <el-tooltip content="一键俯视" placement="top" effect="dark">
                <i class="fa fa-eye" style="vertical-align: middle; cursor: pointer" @click="overLookClick"></i>
            </el-tooltip>
            <i class="fa fa-eye" style="vertical-align: middle; cursor: pointer" @click="overLookClick"></i>
        </el-tooltip>
        </div>
        <!-- 全屏控制按钮 -->
        <div class="screen-full-btn">
            <el-tooltip v-if="isFullscreen" content="缩放" placement="top" effect="dark">
                <i class="fa fa-compress" style="vertical-align: middle; cursor: pointer" @click="fullscreenchange"></i>
            </el-tooltip>
            <el-tooltip v-if="!isFullscreen" content="全屏" placement="top" effect="dark">
                <i class="fa fa-expand" style="vertical-align: middle; cursor: pointer" @click="fullscreenchange"></i>
            <!-- <el-tooltip v-if="isFullscreen" content="缩放" placement="top" effect="dark">
                                                                                        <i class="fa fa-compress" style="vertical-align: middle; cursor: pointer" @click="fullscreenchange"></i>
                                                                                    </el-tooltip> -->
            <!-- <el-tooltip v-if="!isFullscreen" content="全屏" placement="top" effect="dark">
                                                                                            <i class="fa fa-expand" style="vertical-align: middle; cursor: pointer" @click="fullscreenchange"></i>
                                                                                        </el-tooltip> -->
            <el-tooltip content="显示/隐藏" placement="top" effect="dark">
                <i class="fa fa-expand" style="vertical-align: middle; cursor: pointer" @click="switchShowHomeContent"></i>
            </el-tooltip>
        </div>
        <!-- 切换矢量图按钮 -->
@@ -761,6 +765,26 @@
            }
        },
        // 切换首页显示隐藏
        switchShowHomeContent () {
            this.$store.commit('SET_ISSHOWHOMECONTENT', !this.$store.state.popupParams.isShowHomeContent)
            if (this.$store.state.popupParams.isShowHomeContent) {
                if (document.querySelector('.dc-container .dc-zoom-controller').classList.contains('homebottom')) return
                document.querySelector('.dc-container .dc-zoom-controller').classList.add('homebottom')
                document.querySelector('.screen-full-btn').classList.add('homebottom')
                document.querySelector('.over-look-btn').classList.add('homebottom')
                document.querySelector('.image-switch-icon-btn').classList.add('iconbottom')
            } else {
                if (!document.querySelector('.dc-container .dc-zoom-controller').classList.contains('homebottom')) return
                document.querySelector('.dc-container .dc-zoom-controller').classList.remove('homebottom')
                document.querySelector('.screen-full-btn').classList.remove('homebottom')
                document.querySelector('.over-look-btn').classList.remove('homebottom')
                document.querySelector('.image-switch-icon-btn').classList.remove('iconbottom')
            }
        },
        /**
         * 在图层中添加实体(点)
         * @param {*} item 图标
@@ -922,6 +946,7 @@
                labelElement.on(global.DC.MouseEventType.CLICK, incident)
            } else if (type == 'HeatPoint') {
                layersObjcect[layerName].setPositions(params.positions)
                console.log('----------HeatPoint------------', params.positions)
            }
        },
src/store/getters.js
@@ -21,6 +21,7 @@
    houseDeepDataPopupData: (state) => state.popupParams.houseDeepDataPopupData,
    videoRowClickPopup: (state) => state.popupParams.videoRowClickPopup,
    videoRowClickPopupData: (state) => state.popupParams.videoRowClickPopupData,
    isShowHomeContent: (state) => state.popupParams.isShowHomeContent,
}
export default getters
src/store/modules/popupParams.js
@@ -30,7 +30,9 @@
        videoRowClickPopupData: {},
        houseDeepDataPopup: false,
        houseDeepDataPopupData: {}
        houseDeepDataPopupData: {},
        isShowHomeContent: true,
    },
    mutations: {
@@ -81,7 +83,11 @@
        SET_VIDEOROWCLICKPOPUPDATA (state, videoRowClickPopupData) {
            state.videoRowClickPopupData = videoRowClickPopupData
        }
        },
        SET_ISSHOWHOMECONTENT (state, isShowHomeContent) {
            state.isShowHomeContent = isShowHomeContent
        },
    },
    actions: {
src/styles/dc/index.scss
@@ -61,7 +61,7 @@
    justify-content: center;
    position: absolute;
    left: 10px;
    bottom: 10px;
    bottom: 244px;
    width: 36px;
    height: 36px;
    font-size: 20px;
src/styles/media/index.scss
@@ -209,6 +209,12 @@
                            }
                            .alert-box {
                                .echarts-box {
                                    height: 100%;
                                }
                            }
                            .person-box {
                                .back {
                                    top: countSizeVh(102);
@@ -2386,7 +2392,14 @@
                }
                // 地图,控制按钮
                .over-look-btn,
                .over-look-btn {
                    left: countSizeVh(10);
                    bottom: countSizeVh(224);
                    width: countSizeVh(36);
                    height: countSizeVh(36);
                    font-size: countSizeVh(20);
                }
                .screen-full-btn {
                    left: countSizeVh(10);
                    bottom: countSizeVh(10);
src/utils/turfPolygon.js
@@ -12,6 +12,7 @@
export const computerCapacity = (data, type) => {
    if (type == 'region') {
        console.log('computerCapacity', data)
        const pointArr = data.reduce((pre, cur) => {
            cur.position && JSON.parse(cur.position).coordinates[0][0].forEach(item => {
                console.log(item, 959)
@@ -33,7 +34,7 @@
        console.log(scope, scaledPoly, 5555)
    } else {
        let pointArr = []
        console.log('data', data)
        data.forEach(item => {
            if (item.longitude && item.latitude) {
                pointArr.push(turf.point([item.longitude, item.latitude]))
@@ -52,7 +53,7 @@
        console.log(scope, 5555)
        const poly = turf.polygon([[[0, 29], [3.5, 29], [2.5, 32], [0, 29]]])
        // const poly = turf.polygon([[[0, 29], [3.5, 29], [2.5, 32], [0, 29]]])
        global.viewer.flyToBounds(scope,
            { heading: 0, pitch: -45, roll: 0 },
src/views/activity/components/publicIndex.vue
@@ -251,10 +251,13 @@
            this.currentPlotType = params.item.plotType
            this.closeActivityDetails()
            // 当前选中的ID
            this.showingSecurityId = params.item.id
            // 当前选中的详情
            this.activityDetails = params.item
            // 测试安保活动报错
            this.dialogVisible = true
            if (this.userInfo.dept_id == '1123598813738675201' || this.userInfo.dept_id == params.item.deptId) {
@@ -269,6 +272,7 @@
            // 加载当前活动区域
            if (params.item.activityArea && params.item.activityArea.length > 0) {
                let polyGonData = params.item.activityArea.slice(11, params.item.activityArea.length - 1)
                polyGonData = polyGonData.replace(/,/g, ";")
                polyGonData = polyGonData.replace(/ /g, ",")
@@ -293,6 +297,7 @@
            this.getSecurityPlotList(params.id)
            this.getSecurityPoliceList(params.id)
            this.getSecurityCarList(params.id)
        },
        // 获取树状警员列表
src/views/activity/index.vue
@@ -187,7 +187,8 @@
        </div>
        <div class="second-container" :class="{ 'spread': boxShow, 'take-back': !boxShow }">
            <el-tree :data="treeData" show-checkbox node-key="id" @check="treeCheckClick"></el-tree>
            <el-tree :data="treeData" show-checkbox node-key="id" @check="treeCheckClick"
                @check-change="treeCheckChange"></el-tree>
        </div>
        <map-search-box></map-search-box>
@@ -202,6 +203,7 @@
import publicIndex from './components/publicIndex.vue'
import { initMapPosition } from '@/utils/mapPositionInit'
import { computerCapacity } from "@/utils/turfPolygon.js"
let loading = null
@@ -436,6 +438,7 @@
        this.$EventBus.$on('activeDeleteLineOrPoint', (type) => {
            this.activeDeleteLineOrPoint(type)
        })
    },
    mounted () {
@@ -554,7 +557,6 @@
            this.showingSecurityId = item.id
            this.$refs.PublicIndexPage.reloadAll({ id: item.id, deptId: item.deptId, item })
            this.activityDeptId = item.deptId
@@ -686,7 +688,27 @@
            }
            this.dataTreeCheckedNodes = e2.checkedNodes
            this.eachDataTreeCheckedNodes(this.dataTreeCheckedNodes)
        },
        //树形控件选中状态改变事件
        treeCheckChange (e1, e2) {
            if (e2 && !e1.children) {
                let iconArr = []
                if (e1.label == '视频监控') {
                    iconArr = cameraList
                } else if (e1.label == '警车') {
                    iconArr = carList
                } else if (e1.label == '公网') {
                    iconArr = talkBackEquipmentPublicList
                } else if (e1.label == '专网') {
                    iconArr = talkBackEquipmentList
                } else if (e1.label == '执法记录仪') {
                    iconArr = policeCarmeraList
                }
                // 获取图标中心跳转
                computerCapacity(iconArr, 'icon')
            }
        },
        // 遍历树数据实时图标
src/views/home/components/bottomContainer.vue
@@ -44,7 +44,7 @@
                    <li>
                        <span class="num">序号</span>
                        <span class="receiving-alarm-unit">接警单位</span>
                    <span class="receiving-alarm-time">报警时间</span>
                        <span class="receiving-alarm-time">报警时间</span>
                        <span class="call-police-content">报警内容</span>
                        <span class="incident-site">事发地址</span>
                        <span class="call-police-type">报警类型</span>
@@ -53,8 +53,7 @@
                    </li>
                </ul>
                <!-- <vue-seamless-scroll v-if="policeSituationRealtimeArr.length > 0" :data="policeSituationRealtimeArr"
                                                                                                                                                                                                                                                                                    class="warp" :class-option="classOption"> -->
                <!-- <vue-seamless-scroll v-if="policeSituationRealtimeArr.length > 0" :data="policeSituationRealtimeArr" class="warp" :class-option="classOption"> -->
                <div v-if="policeSituationRealtimeArr.length > 0" :data="policeSituationRealtimeArr" class="warp"
                    :class-option="classOption">
                    <el-carousel indicator-position="none" direction="vertical" @change="changeAlarm">
@@ -335,7 +334,6 @@
        // 获取实时接警记录
        getAnswerPolices () {
            getAnswerPolices({ deptId: this.policeStaionID != '' ? this.policeStaionID : this.userInfo.dept_id }).then(res => {
                this.policeSituationRealtimeArr = []
src/views/home/components/rightContainer.vue
@@ -369,7 +369,7 @@
            })
            setTimeout(() => {
                eventchangemychart.hideLoading()
                eventchangemychart.setOption(this.initEventChangeOption(optionsData.xData, optionsData.yData))
                eventchangemychart.setOption(this.initEventChangeOption(optionsData.xData, optionsData.yDataList))
            }, 500)
        },
@@ -401,18 +401,42 @@
                end,
                this.policeStaionID != "" ? this.policeStaionID : this.userInfo.dept_id
            ).then((res) => {
                if (res.data.length > 0) {
                    return res.data.reduce(
                if (res.data.timeList) {
                    let yDataList = {}
                    yDataList.dqList = res.data.dqList.reduce(
                        (previous, current) => {
                            previous.xData.push(current.days)
                            previous.yData.push(current.cout)
                            previous.push(current.count)
                            return previous
                        },
                        { xData: [], yData: [] }
                        []
                    )
                    yDataList.zpList = res.data.zpList.reduce(
                        (previous, current) => {
                            previous.push(current.count)
                            return previous
                        },
                        []
                    )
                    yDataList.jfList = res.data.jfList.reduce(
                        (previous, current) => {
                            previous.push(current.count)
                            return previous
                        },
                        []
                    )
                    yDataList.qtList = res.data.qtList.reduce(
                        (previous, current) => {
                            previous.push(current.count)
                            return previous
                        },
                        []
                    )
                    let xData = res.data.timeList.map(item => item.slice(5, 10))
                    return { xData, yDataList }
                } else {
                    return { xData: [], yData: [] }
                    return { xData: [], yDataList: {} }
                }
            })
            return caseAll
@@ -438,9 +462,7 @@
            const optionsData = await this.getCaseAll(date[0], date[1])
            // eventchangemychart.setOption(this.initEventChangeOption(optionsData.xData, optionsData.yData))
            eventchangemychart.setOption(this.initEventChangeOption(['盗窃', '诈骗', '纠纷', '其他'], [12, 34, 25, 8]))
            eventchangemychart.setOption(this.initEventChangeOption(optionsData.xData, optionsData.yDataList))
            setTimeout(() => {
                this.eventChangeEchartsLoading = false
@@ -448,7 +470,7 @@
        },
        // 案件统计的options
        initEventChangeOption (xData, yData) {
        initEventChangeOption (xData, yDataList) {
            let option
            if (xData.length == 0) {
                //暂无数据
@@ -484,6 +506,9 @@
                            },
                        },
                    },
                    legend: {
                        data: ['盗窃', '诈骗', '纠纷', '其他']
                    },
                    yAxis: {
                        type: "value",
@@ -504,41 +529,60 @@
                    },
                    series: [
                        {
                            data: yData,
                            name: '盗窃',
                            data: yDataList.dqList,
                            type: "line",
                            smooth: true,
                            areaStyle: {
                                normal: {
                                    //渐变色
                                    color: new this.$echarts.graphic.LinearGradient(
                                        0,
                                        0,
                                        0,
                                        1,
                                        [
                                            {
                                                //波形图渐变色样式
                                                offset: 0,
                                                color: "rgba(3, 108, 255, 0.7)",
                                            },
                                            {
                                                offset: 0.8,
                                                color: "rgba(3, 108, 255, 0.1)",
                                            },
                                        ],
                                        false
                                    ),
                                },
                            },
                            itemStyle: {
                                normal: {
                                    color: "red", //改变折线点的颜色
                                    lineStyle: {
                                        color: "rgba(3, 108, 255, 1)", //改变折线颜色
                                    },
                                },
                            },
                            // areaStyle: {
                            //     normal: {
                            //         //渐变色
                            //         color: new this.$echarts.graphic.LinearGradient(
                            //             0,
                            //             0,
                            //             0,
                            //             1,
                            //             [
                            //                 {
                            //                     //波形图渐变色样式
                            //                     offset: 0,
                            //                     color: "rgba(3, 108, 255, 0.7)",
                            //                 },
                            //                 {
                            //                     offset: 0.8,
                            //                     color: "rgba(3, 108, 255, 0.1)",
                            //                 },
                            //             ],
                            //             false
                            //         ),
                            //     },
                            // },
                            // itemStyle: {
                            //     normal: {
                            //         color: "red", //改变折线点的颜色
                            //         lineStyle: {
                            //             color: "rgba(3, 108, 255, 1)", //改变折线颜色
                            //         },
                            //     },
                            // },
                        },
                        {
                            name: '诈骗',
                            data: yDataList.zpList,
                            type: "line",
                            smooth: true,
                        },
                        {
                            name: '纠纷',
                            data: yDataList.jfList,
                            type: "line",
                            smooth: true,
                        },
                        {
                            name: '其他',
                            data: yDataList.qtList,
                            type: "line",
                            smooth: true,
                        }
                    ],
                    grid: {
                        top: "4%",
src/views/home/index.vue
@@ -10,7 +10,7 @@
-->
<template>
    <div class="home-page container">
    <div class="home-page container" v-show="isShowHomeContent">
        <left-container class="left-container" @showpeopledetail="showpeopledetail"
            @showkeypersondetail="showkeypersondetail" ref="leftContainer"
            @showlanddetail="showlanddetail"></left-container>
@@ -311,6 +311,8 @@
let DataSourcesArray = []
let loading = null
import { mapGetters } from 'vuex'
let treeData = [
    {
@@ -524,6 +526,10 @@
    components: { leftContainer, rightContainer, bottomContainer, schedulingList, landDetailsBox, areaDetailsBox, keyPersonBox },
    computed: {
        ...mapGetters([
            'isShowHomeContent'
        ]),
        positionColor () {
            return (row) => {
                if (row.X && row.X != 0
@@ -566,7 +572,7 @@
            this.selectAllClass = true
            this.policeStaionID = this.userInfo.dept_id
        }
        this.$store.commit('SET_ISSHOWHOMECONTENT', true)
        this.getPoliceStationTree(1)
        // setTimeout(() => {
@@ -1905,11 +1911,25 @@
        showlanddetail (name, type, id) {
            this.$refs.landDetailsBox.showlanddetail(name, type, id)
        }
        },
        // 首页显示隐藏页面进入跳转逻辑
        showHomeContentBtnStyle () {
            if (!this.$store.state.popupParams.isShowHomeContent) {
                this.$store.commit('SET_ISSHOWHOMECONTENT', true)
                if (document.querySelector('.dc-container .dc-zoom-controller').classList.contains('homebottom')) return
                document.querySelector('.dc-container .dc-zoom-controller').classList.add('homebottom')
                document.querySelector('.screen-full-btn').classList.add('homebottom')
                document.querySelector('.over-look-btn').classList.add('homebottom')
                document.querySelector('.image-switch-icon-btn').classList.add('iconbottom')
            }
        },
    },
    destroyed () {
        this.$store.commit('SET_MAPSEARCHPOPUP', false)
        this.showHomeContentBtnStyle()
        loading && loading.close()
src/views/policeInfor/index.vue
@@ -363,27 +363,24 @@
        getAnswerPolices () {
            this.loading()
            this.realPoliceInforData = []
            this.realEmptyText = ""
            this.realEmptyText = "  "
            getAnswerPolices({ deptId: this.userInfo.dept_id }).then(res => {
                if (res.data && res.data.length) {
                    this.realPoliceInforData = res.data.map((item, index) => {
                        const bjlxText = BjlxData.filter(i => item.BJLX == i.BJLX)[0].VALUE || ''
                        const bjlxText = BjlxData.filter(i => item.BJLX == i.BJLX)[0] ? BjlxData.filter(i => item.BJLX == i.BJLX)[0].VALUE : ''
                        return { ...item, index: index + 1, lng: item.ZDDWXZB, lat: item.ZDDWYZB, BJLX: bjlxText }
                    })
                    this.addPoliceInforSiteLayer(this.realPoliceInforData)
                } else {
                    this.realPoliceInforData = []
                    this.realEmptyText = "暂无实时警情信息"
                }
                this.addPoliceInforSiteLayer(this.realPoliceInforData)
                setTimeout(() => {
                    loading && loading.close()
                }, 500)
            }).catch(res => {
                this.realEmptyText = "实时警情请求失败"
                this.realEmptyText = "暂无实时警情信息"
                setTimeout(() => {
                    loading && loading.close()
                }, 500)
@@ -480,28 +477,30 @@
            // }, 500)
        },
        // 获取历史接警记录
        // 获取历史接警记录(不分页)
        getAlarmList (params) {
            this.loading()
            this.historyPoliceInforData = []
            this.historyEmptyText = ""
            getAlarmList({ ...params, size: this.pages.size, jjdwbh: this.userInfo.dept_id }).then(res => {
                if (res.data.data.records.length > 0) {
                    this.pages.total = res.data.data.pages
                    this.historyPoliceInforData = res.data.data.records.map((item, index) => {
                        const bjlxText = BjlxData.filter(i => item.BJLX == i.BJLX)[0].VALUE || ''
            getAlarmList({ ...params, size: this.pages.size, jjdwbh: this.userInfo.dept_id, type: 3 }).then(res => {
                console.log('------------getAlarmList----------', res.data.data, 1122)
                if (res.data.data.length > 0) {
                    // this.pages.total = res.data.data.pages
                    this.historyPoliceInforData = res.data.data.map((item, index) => {
                        const bjlxText = BjlxData.filter(i => item.BJLX == i.BJLX)[0] ? BjlxData.filter(i => item.BJLX == i.BJLX)[0].VALUE : ''
                        return { ...item, index: index + 1, lng: item.ZDDWXZB, lat: item.ZDDWYZB, BJLX: bjlxText }
                    })
                } else {
                    this.pages.total = 0
                    // this.pages.total = 0
                    this.historyPoliceInforData = []
                    this.realEmptyText = "暂无历史警情信息"
                }
                this.addPoliceInforSiteLayer(this.historyPoliceInforData)
                setTimeout(() => {
                    loading && loading.close()
                }, 500)
            }).catch(res => {
                setTimeout(() => {
                    loading && loading.close()
                }, 500)
@@ -596,13 +595,13 @@
        addPoliceInforSiteLayer (data) {
            this.clearLayer()
            let policeInfoPositionList = []
            data.forEach((item, index) => {
                if (item.lng && item.lng != undefined && item.lng != '') {
                    let center = new global.DC.Position(Number(item.lng), Number(item.lat))
                    let point = new global.DC.PointPrimitive(center)
                    policeInfoPositionList.push(center)
                    let num = 0
                    timer[index] = setInterval(() => {
@@ -623,6 +622,14 @@
                    policeInforSiteLayer.addOverlay(point)
                }
            })
            this.$EventBus.$emit('layerPointAdd', {
                layerName: 'policeInfoHeatLayer',
                type: "HeatPoint",
                layerType: 'HeatLayer',
                params: {
                    positions: policeInfoPositionList
                }
            })
        },
        /**
vue.config.js
@@ -161,8 +161,8 @@
        proxy: {
            "/api": {
                // target用于配置你允许访问数据的计算机名称,即是你的api接口的服务器地址
                target: "http://localhost:82",
                // target: "http://192.168.0.100:82",
                // target: "http://localhost:82",
                target: "http://192.168.0.100:82",
                // target: "http://17.20.10.3:82",
                // target: "http://10.141.11.11:8081/api",
                // ws: true, //启用webSocket6566