监控聚合和警情数据调整

guanqb

2022-11-09 88add828d28169f15ce88d2363b08241db1cea29

监控聚合和警情数据调整

 src/assets/data/policeSituationArr/historyArr.js

 src/assets/data/policeSituationArr/realtimeArr.js

 src/views/home/components/bottomContainer.vue

@@ -1,12 +1,30 @@
<template>
    <div class="container">
        <div class="header">
            <div class="bottom-title">
                警情动态
            <div class="history-tab">
                <span
                    class="beforetime"
                    :class="{ choosed: historytype == 0 }"
                    @click="historyTabClick(0)"
                >实时</span>
                <span
                    class="beforetime"
                    :class="{ choosed: historytype == 1 }"
                    @click="historyTabClick(1)"
                >历史</span>
            </div>
            <div class="timeTab">
                <span class="beforetime" :class="{ choosed: timetype == 0 }" @click="timeTabClick(0)">周</span>
                <span class="beforetime" :class="{ choosed: timetype == 1 }" @click="timeTabClick(1)">月</span>
            <div class="bottom-title">警情动态</div>
            <div class="timeTab" v-show="historytype">
                <span
                    class="beforetime"
                    :class="{ choosed: timetype == 0 }"
                    @click="timeTabClick(0)"
                >周</span>
                <span
                    class="beforetime"
                    :class="{ choosed: timetype == 1 }"
                    @click="timeTabClick(1)"
                >月</span>
            </div>
        </div>

@@ -24,10 +42,17 @@
                    <span class="callContent">报警内容</span>
                </li>
            </ul>
            <vue-seamless-scroll :data="timetype == 0 ? policeSituationWeekArr : policeSituationMouthArr" class="warp">
            <vue-seamless-scroll
                :data="historytype == 0 ? policeSituationRealtimeArr : policeSituationHistoryArr"
                class="warp"
            >
                <ul class="item">
                    <li v-for="(item, index) in (timetype == 0 ? policeSituationWeekArr : policeSituationMouthArr)"
                        :key="index" :data-obj="JSON.stringify(item)" class="row">
                    <li
                        v-for="(item, index) in (historytype == 0 ? policeSituationRealtimeArr : policeSituationHistoryArr)"
                        :key="index"
                        :data-obj="JSON.stringify(item)"
                        class="row"
                    >
                        <span class="num" v-text="item.num"></span>
                        <span class="type" v-text="item.type"></span>
                        <span class="state" v-text="item.state"></span>
@@ -46,15 +71,16 @@

<script>
import vueSeamlessScroll from 'vue-seamless-scroll'
import weekArr from '@/assets/data/policeSituationArr/weekArr.js'
import mouthArr from '@/assets/data/policeSituationArr/mouthArr.js'
import realtimeArr from '@/assets/data/policeSituationArr/realtimeArr.js'
import historyArr from '@/assets/data/policeSituationArr/historyArr.js'

export default {
    data () {
        return {
            timetype: 0,
            policeSituationWeekArr: [],
            policeSituationMouthArr: []
            historytype: 0,
            policeSituationRealtimeArr: [],
            policeSituationHistoryArr: []
        }
    },

@@ -63,8 +89,8 @@
    },

    created () {
        this.policeSituationWeekArr = weekArr
        this.policeSituationMouthArr = mouthArr
        this.policeSituationRealtimeArr = realtimeArr
        this.policeSituationHistoryArr = historyArr
    },

    mounted () {
@@ -74,30 +100,33 @@
    methods: {
        timeTabClick (type) {
            this.timetype = type
        },

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

        },

        selectPoliceSituatiionArr (name) {
            if (name == '全部') {
                this.policeSituationWeekArr = weekArr
                this.policeSituationMouthArr = mouthArr
                this.policeSituationRealtimeArr = realtimeArr
                this.policeSituationHistoryArr = historyArr
            } else {
                let weekNewArr = []
                let mouthNewArr = []
                weekArr.forEach(item => {
                realtimeArr.forEach(item => {
                    if (item.policeName == name) {
                        weekNewArr.push(item)
                    }
                })
                this.policeSituationWeekArr = weekNewArr
                mouthArr.forEach(item => {
                this.policeSituationRealtimeArr = weekNewArr
                historyArr.forEach(item => {
                    if (item.policeName == name) {
                        mouthNewArr.push(item)
                    }
                })
                this.policeSituationMouthArr = mouthNewArr
                this.policeSituationHistoryArr = mouthNewArr
            }
        },

@@ -159,7 +188,7 @@
            line-height: 36px;
            color: #fff;
            text-align: center;
            background: #3366e2
            background: #3366e2;
        }

        .bottom-title::after {
@@ -184,7 +213,31 @@
            overflow: hidden;

            span {
                width: 42px;
                padding: 0 10px;
                height: 26px;
                text-align: center;
                line-height: 26px;
                background: rgb(1, 76, 137);
            }

            .beforetime {
                color: rgb(98, 95, 95);
                cursor: pointer;
            }

            .choosed {
                color: #fff;
            }
        }
        .history-tab {
            position: absolute;
            top: 10px;
            left: 10px;
            display: flex;
            border-radius: 6px;
            overflow: hidden;
            span {
                padding: 0 10px;
                height: 26px;
                text-align: center;
                line-height: 26px;

 src/views/home/index.vue

@@ -495,8 +495,8 @@
import bottomContainer from './components/bottomContainer'
import historyArr from '@/assets/data/activitysData/history.js'
import underwayArr from '@/assets/data/activitysData/underway.js'
import weekArr from '@/assets/data/policeSituationArr/weekArr.js'
import mouthArr from '@/assets/data/policeSituationArr/mouthArr.js'
import realtimeArr from '@/assets/data/policeSituationArr/realtimeArr.js'
import policeSituationHistoryArr from '@/assets/data/policeSituationArr/historyArr.js'

export default {
    data () {
@@ -624,7 +624,7 @@
            historyArr: [],
            underwayArr: [],
            activityType: 0,
            policeSituationType: 0,
            policeSituationHistoryType: 0,
            policeSituationWeekArr: [],
            policeSituationMouthArr: [],
            policeSituationDetailArr: {},
@@ -644,8 +644,8 @@
        this.housingDate = housingDate
        this.historyArr = historyArr
        this.underwayArr = underwayArr
        this.policeSituationWeekArr = weekArr
        this.policeSituationMouthArr = mouthArr
        this.policeSituationWeekArr = realtimeArr
        this.policeSituationMouthArr = policeSituationHistoryArr
    },

    mounted () {
@@ -820,6 +820,7 @@
                    this.$EventBus.$emit('layerPointAdd', {
                        layerName: 'monitoringLayers',
                        type: "billboard",
                        layerType: 'ClusterLayer',
                        params: item,
                        incident: this.siteClick
                    })
@@ -959,17 +960,16 @@

        policeSituationSelectChange () {
            let showArr = []
            let showNewArr = []
            if (this.policeStaionChecked && this.policeStaionChecked.policeStationName != '全部') {
                let arr1 = []
                let arr2 = []
                weekArr.some(item => {
                realtimeArr.some(item => {
                    if (item.policeName == this.policeStaionChecked.policeStationName) {
                        arr1.push(item)
                    }
                })
                this.policeSituationWeekArr = arr1
                mouthArr.some(item => {
                policeSituationHistoryArr.some(item => {
                    if (item.policeName == this.policeStaionChecked.policeStationName) {
                        arr2.push(item)
                    }
@@ -977,10 +977,10 @@
                this.policeSituationMouthArr = arr2

            } else {
                this.policeSituationWeekArr = weekArr
                this.policeSituationMouthArr = mouthArr
                this.policeSituationWeekArr = realtimeArr
                this.policeSituationMouthArr = policeSituationHistoryArr
            }
            if (this.policeSituationType == 0) {
            if (this.policeSituationHistoryType == 0) {
                showArr = this.policeSituationWeekArr
            } else {
                showArr = this.policeSituationMouthArr
@@ -1060,7 +1060,8 @@
                            lat: center[1],
                            alt: 0,
                            text: item.areaCheckName
                        }
                        },
                        distanceDisplayCondition: { "near": 0, "far": 200000 }
                    })
                }
            })
@@ -1087,7 +1088,8 @@
                            lat: center[1],
                            alt: 0,
                            text: item.housingsName
                        }
                        },
                        distanceDisplayCondition: { "near": 0, "far": 200000 }
                    })
                }
            })
@@ -1430,7 +1432,7 @@
        },

        changePoliceSituationType (type) {
            this.policeSituationType = type
            this.policeSituationHistoryType = type
        },

    },