警情相关更改

shuishen

2023-01-06 05eae3efbb38ef2c71791a5619a0115c9eb5f4ed

警情相关更改

 src/api/home/index.js

@@ -2,7 +2,7 @@
 * @Author: shuishen 1109946754@qq.com
 * @Date: 2022-12-27 14:19:19
 * @LastEditors: shuishen 1109946754@qq.com
 * @LastEditTime: 2023-01-05 15:16:20
 * @LastEditTime: 2023-01-06 15:51:20
 * @FilePath: \srs-police-affairs\src\api\home\index.js
 * @Description: 
 * 
@@ -42,4 +42,31 @@
        method: 'get',
        params: {}
    })
}

export const getAlarmList = (type, time) => {
    return request({
        url: `/api/alarm/alarm/page`,
        method: 'get',
        params: {
            current: 1,
            size: 100,
            type,
            time
        }
    })
}

// 获取处警历史
export const getActAsPoliceList = (alarmID, cjdwbh) => {
    return request({
        url: `/api/alarm/alarm/page`,
        method: 'get',
        params: {
            current: 1,
            size: 100,
            alarmID,
            cjdwbh
        }
    })
}

 src/components/map/components/mapPopup.vue

@@ -13,53 +13,91 @@
                            <div class="arrow-rb"></div>
                            <div class="label-wrap">
                                <div class="title">
                                    详细信息
                                    警情信息
                                    <div class="details-btn" @click="popupDetailShow">详情>>></div>
                                    <div class="close" @click="closePopup" title="关闭"></div>
                                </div>
                                <div class="change-btn">
                                    <div class="on">接警信息</div>
                                    <div>出警信息</div>
                                    <div @click="currentBtn = '接警信息'" :class="{ on: currentBtn == '接警信息' }">接警信息</div>
                                    <div @click="currentBtnChange('出警信息')" :class="{ on: currentBtn == '出警信息' }">出警信息
                                    </div>
                                </div>
                                <div class="label-content">

                                <div v-show="currentBtn == '接警信息'" class="label-content">
                                    <div class="item">
                                        <div>警情类别:</div>
                                        <div>{{ dataPopup.type }}</div>
                                        <div>接警单位:</div>
                                        <div>{{ dataPopup.JJDWMC }}</div>
                                    </div>
                                    <div class="item">
                                        <div>接警员:</div>
                                        <div>{{ dataPopup.JJYXM }}</div>
                                    </div>
                                    <div class="item">
                                        <div>接警时间:</div>
                                        <div>{{ dataPopup.dealTime }}</div>
                                    </div>
                                    <div class="item">
                                        <div>警情状态:</div>
                                        <div>{{ dataPopup.state }}</div>
                                    </div>
                                    <div class="item">
                                        <div>经办民警:</div>
                                        <div>{{ dataPopup.dealPolice }}</div>
                                        <div>{{ dataPopup.JJSJ }}</div>
                                    </div>
                                    <div class="item">
                                        <div>报警人:</div>
                                        <div>{{ dataPopup.callPeople }}</div>
                                        <div>{{ dataPopup.BJRXM }}</div>
                                    </div>
                                    <div class="item">
                                        <div>报警电话:</div>
                                        <div>{{ dataPopup.comingPhone }}</div>
                                        <div>联系电话:</div>
                                        <div>{{ dataPopup.LXDH }}</div>
                                    </div>
                                    <div class="item">
                                        <div>报警人联系人:</div>
                                        <div>{{ dataPopup.callPhone }}</div>
                                        <div>联系电话:</div>
                                        <div>{{ dataPopup.BJNR }}</div>
                                    </div>
                                    <div class="item">
                                        <div>所属派出所:</div>
                                        <div>{{ dataPopup.policeName }}</div>
                                        <div>事发地址:</div>
                                        <div>{{ dataPopup.SFDZ }}</div>
                                    </div>
                                    <div class="item">
                                        <div>经度:</div>
                                        <div>{{ dataPopup.position[0] }}</div>
                                        <div>报警类型:</div>
                                        <div>{{ dataPopup.BJLX }}</div>
                                    </div>
                                    <div class="item">
                                        <div>纬度:</div>
                                        <div>{{ dataPopup.position[1] }}</div>
                                        <div>备注:</div>
                                        <div>{{ dataPopup.MEMO }}</div>
                                    </div>
                                </div>

                                <div v-show="currentBtn == '出警信息'" class="label-content">
                                    <div class="item">
                                        <div>处警单位:</div>
                                        <div>{{ CJdata.CJDWMC }}</div>
                                    </div>
                                    <div class="item">
                                        <div>处警员:</div>
                                        <div>{{ CJdata.CJYXM }}</div>
                                    </div>
                                    <div class="item">
                                        <div>接警时间:</div>
                                        <div>{{ CJdata.JJSJ }}</div>
                                    </div>
                                    <div class="item">
                                        <div>出动人员:</div>
                                        <div>{{ CJdata.CDRY }}</div>
                                    </div>
                                    <div class="item">
                                        <div>出动车辆:</div>
                                        <div>{{ CJdata.CDCL }}</div>
                                    </div>
                                    <div class="item">
                                        <div>到达现场时间:</div>
                                        <div>{{ CJdata.DDXCSJ }}</div>
                                    </div>
                                    <div class="item">
                                        <div>处理完毕时间:</div>
                                        <div>{{ CJdata.CLWBSJ }}</div>
                                    </div>
                                    <div class="item">
                                        <div>处警类型:</div>
                                        <div>{{ CJdata.CJLX }}</div>
                                    </div>
                                    <div class="item">
                                        <div>备注:</div>
                                        <div>{{ CJdata.MEMO }}</div>
                                    </div>
                                </div>
                            </div>
@@ -76,8 +114,17 @@

<script>
import { mapGetters } from 'vuex'

import { getActAsPoliceList } from "@/api/home/index.js"

export default {
    name: 'mapPopup',
    data () {
        return {
            currentBtn: '接警信息',
            CJdata: {}
        }
    },
    computed: {
        ...mapGetters([
            'detailsPopup',
@@ -86,7 +133,20 @@
    },
    methods: {
        closePopup () {
            this.currentBtn = '接警信息'
            this.$store.commit('SET_DETAILSPOPUP', false)
        },

        currentBtnChange (type) {
            this.currentBtn = type
            getActAsPoliceList(this.dataPopup.JJDBH, '').then(res => {
                console.log(res, 999999)
                // this.CJdata = res.data.result
            })
        },

        popupDetailShow () {
            this.$EventBus.$emit('policeSituationSiteClick', this.dataPopup)
        }
    }
}
@@ -124,7 +184,7 @@

.divForms .area {
    position: relative;
    min-width: 420px;
    min-width: 360px;
}

.divForms-wrap {
@@ -220,12 +280,13 @@
        }

        &>div.on {
            border-bottom: 2px solid #1831a7;
            color: #3d95f3;
            border-bottom: 2px solid #3d95f3;
        }
    }

    .label-content {
        padding: 4px 0;
        padding: 10px 0;

        .item {
            display: flex;
@@ -237,7 +298,7 @@
            text-align: left;

            &>div:first-child {
                width: 96px;
                width: 112px;
                text-align: justify;
                display: inline-block;
                text-align-last: justify;
@@ -260,10 +321,22 @@
    height: 36px;
    line-height: 36px;

    .details-btn {
        position: absolute;
        top: 0;
        right: 28px;
        height: 100%;
        cursor: pointer;
    }

    .details-btn:hover {
        color: #3d95f3;
    }

    .close {
        position: absolute;
        right: 5px;
        top: -2px;
        top: 0;
    }

    .close::before {

 src/styles/media/index.scss

@@ -721,7 +721,7 @@
                                    &>.park-content,
                                    &>.business-content {
                                        height: countSizeVh(380);
                                        

                                        .el-table__header-wrapper {
                                            height: countSizeVh(48);

@@ -756,7 +756,7 @@
                                            font-size: countSizeVh(16);
                                        }

                                        

                                    }
                                }

@@ -2354,7 +2354,7 @@
                    }

                    .area {
                        min-width: countSizeVw(420, 1920);
                        min-width: countSizeVw(360, 1920);
                    }

                    .b-t {
@@ -2390,7 +2390,7 @@
                    }

                    .label-content {
                        padding: countSizeVh(4) 0;
                        padding: countSizeVh(10) 0;
                    }


@@ -2411,7 +2411,6 @@

                            .close {
                                right: countSizeVw(5, 1920);
                                top: countSizeVh(-2);
                            }

                            .close::before {

 src/views/home/components/bottomContainer.vue

@@ -12,12 +12,12 @@
                        start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker> -->


                    <el-date-picker @change="datePickerChange" v-show="timetype == 0" v-model="currentTime" type="week"
                        format="yyyy 第 WW 周" :picker-options="pickerOptions" placeholder="选择周">
                    <el-date-picker @change="datePickerChange" v-show="timetype == 0" v-model="currentWeekTime"
                        type="week" format="yyyy 第 WW 周" :picker-options="pickerOptions" placeholder="选择周">
                    </el-date-picker>

                    <el-date-picker @change="datePickerChange" v-show="timetype == 1" v-model="currentTime" type="month"
                        :picker-options="pickerOptions" placeholder="选择月">
                    <el-date-picker @change="datePickerChange" v-show="timetype == 1" v-model="currentMonthTime"
                        type="month" :picker-options="pickerOptions" placeholder="选择月">
                    </el-date-picker>
                </div>
                <div class="history-tab">
@@ -51,15 +51,15 @@
                        <li v-for="(item, index) in listCurrentData" :key="index" :data-obj="JSON.stringify(item)"
                            class="row">
                            <span class="num" v-text="index + 1"></span>
                            <span class="receiving-alarm-unit" v-text="JJDWMC"></span>
                            <span class="receiving-alarm-people" v-text="JJYXM"></span>
                            <span class="receiving-alarm-time" v-text="JJSJ"></span>
                            <span class="call-people" v-text="BJRXM"></span>
                            <span class="call-phone" v-text="LXDH"></span>
                            <span class="call-police-content" v-text="BJNR"></span>
                            <span class="incident-site" v-text="SFDZ"></span>
                            <span class="call-police-type" v-text="BJLX"></span>
                            <span class="alarm-bz" v-text="MEMO"></span>
                            <span class="receiving-alarm-unit" v-text="item.JJDWMC"></span>
                            <span class="receiving-alarm-people" v-text="item.JJYXM"></span>
                            <span class="receiving-alarm-time" v-text="item.JJSJ"></span>
                            <span class="call-people" v-text="item.BJRXM"></span>
                            <span class="call-phone" v-text="item.LXDH"></span>
                            <span class="call-police-content" v-text="item.BJNR"></span>
                            <span class="incident-site" v-text="item.SFDZ"></span>
                            <span class="call-police-type" v-text="item.BJLX"></span>
                            <span class="alarm-bz" v-text="item.MEMO"></span>
                        </li>
                    </ul>
                </vue-seamless-scroll>
@@ -105,7 +105,7 @@
import vueSeamlessScroll from 'vue-seamless-scroll'
import historyArr from '@/assets/data/policeSituationArr/historyArr.js'

import { getCallPolices, getAnswerPolices } from "@/api/home/index.js"
import { getCallPolices, getAnswerPolices, getAlarmList } from "@/api/home/index.js"

export default {
    data () {
@@ -118,7 +118,8 @@
            policeSituationHistoryArr: [],
            policeSituationHistorySaveArr: [],
            eventTime: '',
            currentTime: '',
            currentWeekTime: '',
            currentMonthTime: '',
            pickerOptions: {}, // 日期设置对象
            classOption: {
                step: 1
@@ -151,14 +152,7 @@
    },

    created () {
        this.policeSituationHistoryArr = historyArr
        this.policeSituationHistorySaveArr = historyArr

        this.getAnswerPolices()

        setInterval(() => {
            console.log(this.currentTime)
        }, 5000)

        // disabledDate 为true表示不可选,false表示可选
        this.pickerOptions = {
@@ -178,10 +172,12 @@
    },

    methods: {
        // 时间改变事件
        datePickerChange (e) {
            // this.timetype
            const dateStr = this.dateFormat(e)

            this.getAlarmList(this.timetype, dateStr)
        },

        // 获取当前日期
@@ -196,94 +192,72 @@
            return time
        },

        // 获取实时接警记录
        getAnswerPolices () {
            // getCallPolices().then(res => {
            //     res.data.result
            // })

            // getAnswerPolices().then(res => {
            //     this.policeSituationRealtimeArr = res.data.result
            // })

            this.policeSituationRealtimeArr = [
                {
                    JJDW: '公安局',
                    position: [112, 28]
                },
                {
                    JJDW: '派出所'
                },
            ]
            this.policeSituationRealtimeArr = [{
                ZDDWXZB: 112,
                ZDDWYZB: 25,
                JJDWMC: '公安局'

            },
            {
                JJDWMC: '公安局'
            }]

        },

        // 获取历史接警记录
        getAlarmList (type, time) {
            getAlarmList(type, time).then(res => {
                this.policeSituationHistoryArr = res.data.result
            })
        },

        // 周月选择
        timeTabClick (type) {
            this.timetype = type

            if (type == 0) {
                this.getAlarmList(type, this.dateFormat(this.currentWeekTime))
            } else {
                this.currentMonthTime == '' ? this.currentMonthTime = new Date() : ''

                this.getAlarmList(type, this.dateFormat(this.currentMonthTime))
            }

            this.$emit('changePoliceSituationTimeType', type)
            this.$emit('policeSituationChange')
        },

        // 实时历史选择
        historyTabClick (type) {
            this.historytype = type

            this.currentWeekTime = new Date()

            if (type == 0) {
                this.getAnswerPolices()
            } else {
                this.policeSituationHistoryArr = this.chooseMouthTimeDate(this.policeSituationHistorySaveArr)
                this.getAlarmList(type, this.dateFormat(this.currentWeekTime))
            }
        },

        historyTabClick (type) {
            this.historytype = type
            this.$emit('changePoliceSituationHistoryType', type)
            this.$emit('policeSituationChange')
        },

        chooseWeekTimeDate (arr) {
            let lastWeekArr = []
            let realtimeTimeStamp = new Date().valueOf() - 24 * 60 * 60 * 1000
            let lastWeekTimeStamp = new Date().valueOf() - 7 * 24 * 60 * 60 * 1000
            arr.forEach(item => {
                if (new Date(item.dealTime).valueOf() < realtimeTimeStamp && new Date(item.dealTime).valueOf() > lastWeekTimeStamp) {
                    lastWeekArr.push(item)
                }
            })
            return lastWeekArr
        chooseWeekTimeDate () {
            return this.policeSituationHistoryArr
        },

        chooseMouthTimeDate (arr) {
            let lastMouthArr = []
            let realtimeTimeStamp = new Date().valueOf() - 24 * 60 * 60 * 1000
            let lastMouthTimeStamp = new Date().valueOf() - 30 * 24 * 60 * 60 * 1000
            arr.forEach(item => {
                if (new Date(item.dealTime).valueOf() < realtimeTimeStamp && new Date(item.dealTime).valueOf() > lastMouthTimeStamp) {
                    lastMouthArr.push(item)
                }
            })
            return lastMouthArr
        chooseMouthTimeDate () {
            return this.policeSituationHistoryArr
        },

        policeSituationClick (item) {
            if (item.position) {
                this.$EventBus.$emit('toPosition', {
                    layerName: 'policeSituationyLayers',
                    siteJd: Number(item.position[0]),
                    siteWd: Number(item.position[1])
                })
                this.$store.commit('SET_DETAILSPOPUP', true)
                this.$store.commit('SET_DATAPOPUP', item)
                var popup = new global.DC.DivForms(global.viewer, {
                    domId: 'divFormsDomBox',
                    position: [
                        global.DC.Transform.transformWGS84ToCartesian(
                            new global.DC.Position(
                                Number(item.position[0]),
                                Number(item.position[1]),
                                0
                            )
                        )
                    ]
                })
            } else {
                this.$emit('policeSituationSiteClick', item)
            }
        },

        // 列表行选择
        handleSelectClick (e) {
            let element
            for (let i = 0; i < e.path.length; i++) {
@@ -296,8 +270,36 @@
            let currentItem = JSON.parse(element.dataset.obj)

            this.policeSituationClick(currentItem)
        }
        },

        // 点击定位或者显示弹窗
        policeSituationClick (item) {
            if (item.ZDDWXZB && item.ZDDWXZB != 0 && item.ZDDWYZB && item.ZDDWYZB != 0) {
                this.$EventBus.$emit('toPosition', {
                    layerName: 'policeSituationyLayers',
                    siteJd: Number(item.ZDDWXZB),
                    siteWd: Number(item.ZDDWYZB)
                })

                this.$store.commit('SET_DETAILSPOPUP', true)
                this.$store.commit('SET_DATAPOPUP', item)

                var popup = new global.DC.DivForms(global.viewer, {
                    domId: 'divFormsDomBox',
                    position: [
                        global.DC.Transform.transformWGS84ToCartesian(
                            new global.DC.Position(
                                Number(item.ZDDWXZB),
                                Number(item.ZDDWYZB),
                                0
                            )
                        )
                    ]
                })
            } else {
                this.$emit('policeSituationSiteClick', item)
            }
        }
    }
}
</script>

 src/views/home/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-01-05 17:04:32
 * @LastEditTime: 2023-01-06 15:44:39
 * @FilePath: \srs-police-affairs\src\views\home\index.vue
 * @Description: 小区-栋-层-房屋
 *
@@ -218,8 +218,8 @@
        <el-dialog title="警情信息" :modal="true" :visible.sync="policeSituationVisible"
            :before-close="policeSituationBeforeClose" :close-on-click-modal="true" class="policeSituation-details-box">
            <div class="btn-change">
                <div :class="{ on: policeInformationType == '接警信息' }" @click="policeInformationType = '接警信息'">接警信息</div>
                <div :class="{ on: policeInformationType == '出警信息' }" @click="policeInformationType = '出警信息'">出警信息</div>
                <div :class="{ on: policeInformationType == '接警信息' }" @click="alarmOrActAsPolice('接警信息')">接警信息</div>
                <div :class="{ on: policeInformationType == '出警信息' }" @click="alarmOrActAsPolice('出警信息')">出警信息</div>
            </div>

            <div v-show="policeInformationType == '接警信息'" class="box">
@@ -277,7 +277,62 @@
                </div>
            </div>

            <div v-show="policeInformationType == '出警信息'" class="box"></div>
            <div v-show="policeInformationType == '出警信息'" class="box">
                <div class="item">
                    <div>处警单位编号:</div>
                    <div>{{ policeSituationDetailArr.CJDWBH }}</div>
                </div>
                <div class="item">
                    <div>处警单位名称:</div>
                    <div>{{ policeSituationDetailArr.CJDWMC }}</div>
                </div>
                <div class="item">
                    <div>处警单编号:</div>
                    <div>{{ policeSituationDetailArr.CJDBH }}</div>
                </div>
                <div class="item">
                    <div>处警员编号:</div>
                    <div>{{ policeSituationDetailArr.CJYBH }}</div>
                </div>
                <div class="item">
                    <div>处警员姓名:</div>
                    <div>{{ policeSituationDetailArr.CJYXM }}</div>
                </div>
                <div class="item">
                    <div>接警时间:</div>
                    <div>{{ policeSituationDetailArr.JJSJ }}</div>
                </div>
                <div class="item">
                    <div>到达现场时间:</div>
                    <div>{{ policeSituationDetailArr.DDXCSJ }}</div>
                </div>
                <div class="item">
                    <div>首次反馈时间:</div>
                    <div>{{ policeSituationDetailArr.SCFKSJ }}</div>
                </div>
                <div class="item">
                    <div>处理完毕时间:</div>
                    <div>{{ policeSituationDetailArr.CLWBSJ }}</div>
                </div>
                <div class="item">
                    <div>出动人员:</div>
                    <div>{{ policeSituationDetailArr.CDRY }}</div>
                </div>
                <div class="item">
                    <div>出动车辆:</div>
                    <div>{{ policeSituationDetailArr.CDCL }}</div>
                </div>

                <div class="item">
                    <div>处警类型:</div>
                    <div>{{ policeSituationDetailArr.CJLX }}</div>
                </div>

                <div class="dialog-content">
                    <div>备注:</div>
                    <div>{{ policeSituationDetailArr.MEMO }}</div>
                </div>
            </div>
        </el-dialog>
    </div>
</template>
@@ -400,6 +455,8 @@
import policeSituationHistoryArr from '@/assets/data/policeSituationArr/historyArr.js'
import { getPoliceStationList } from "@/api/dept"
import { convertStringToList } from "@/utils/geometryStringTool"

import { getActAsPoliceList } from "@/api/home/index.js"

export default {
    data () {
@@ -542,6 +599,7 @@
    components: { leftContainer, rightContainer, bottomContainer },

    created () {
        const that = this
        this.carList = carList
        this.phoneList = phoneList
        this.monitoringList = monitoringList
@@ -559,6 +617,12 @@

        this.getResidentialQuartersList('361102')


        this.$EventBus.$on('policeSituationSiteClick', (params) => {
            console.log(params)

            that.policeSituationSiteClick(params)
        })
    },

    mounted () {
@@ -604,6 +668,18 @@
    },

    methods: {
        // 接出警切换
        alarmOrActAsPolice (type) {
            this.policeInformationType = type

            if (type == '出警信息') {
                getActAsPoliceList(this.policeSituationDetailArr.JJDBH).then(res => {
                    console.log(res, '出警信息')

                })
            }
        },

        searchName (name, arr) {
            let obj = {}
            let flag = false