首页内容显示，弹窗内容显示及相关逻辑

shuishen

2023-01-07 1932115cd2a69a76ae20ddf56ebfa96df49dbfc8

首页内容显示，弹窗内容显示及相关逻辑

 src/components/map/components/mapPopup.vue

@@ -45,12 +45,12 @@
                                        <div>{{ dataPopup.LXDH }}</div>
                                    </div>
                                    <div class="item">
                                        <div>联系电话:</div>
                                        <div>{{ dataPopup.BJNR }}</div>
                                        <div>报警内容:</div>
                                        <div :title="dataPopup.BJNR">{{ dataPopup.BJNR }}</div>
                                    </div>
                                    <div class="item">
                                        <div>事发地址:</div>
                                        <div>{{ dataPopup.SFDZ }}</div>
                                        <div :title="dataPopup.SFDZ">{{ dataPopup.SFDZ }}</div>
                                    </div>
                                    <div class="item">
                                        <div>报警类型:</div>
@@ -163,10 +163,10 @@
.divForms .arrow {
    position: absolute;
    bottom: 50%;
    left: -8px;
    left: 0;
    width: 45px;
    height: 2px;
    transform: rotate(-45deg);
    transform: rotate(-45deg) translate(5px, -15px);
    background-color: #28bbf0;
}

@@ -308,6 +308,10 @@

            &>div:nth-of-type(2) {
                width: calc(100% - 120px);
                max-width: 190px;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
            }
        }


 src/components/map/index.vue

@@ -2,7 +2,7 @@
 * @Author: shuishen 1109946754@qq.com
 * @Date: 2022-08-18 17:00:30
 * @LastEditors: shuishen 1109946754@qq.com
 * @LastEditTime: 2023-01-06 16:59:43
 * @LastEditTime: 2023-01-07 11:09:38
 * @FilePath: \srs-police-affairs\src\components\map\index.vue
 * @Description: 公用地图组件
 * 
@@ -171,29 +171,29 @@
            // global.viewer.addTerrain(terrain)

            // 天地图 影像
            // global.viewer.imageryLayers.addImageryProvider(
            //     new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({
            //         url: 'http://t{s}.tianditu.gov.cn/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=e45274b0235bb913eceb393aabbf9c9c',
            //         subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'],
            //         format: 'image/jpeg',
            //         show: true,
            //         maximumLevel: 18
            //     })
            // )
            global.viewer.imageryLayers.addImageryProvider(
                new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({
                    url: 'http://t{s}.tianditu.gov.cn/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=e45274b0235bb913eceb393aabbf9c9c',
                    subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'],
                    format: 'image/jpeg',
                    show: true,
                    maximumLevel: 18
                })
            )


            // 上饶部署，内网使用的
            global.viewer.imageryLayers.addImageryProvider(
                new global.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
                    url: "http://10.141.11.11:8090/MapTileService/wmts?STORETYPE=merged-dat&PROJECTION=4326",
                    layer: "wmts_4326_361100",
                    style: "default",
                    format: "image/png",
                    tileMatrixSetID: "c",
                    tileMatrixLabels: new Array(18).fill(0).map((v, i) => i + 1),
                    tilingScheme: new global.DC.Namespace.Cesium.GeographicTilingScheme(),
                })
            )
            // global.viewer.imageryLayers.addImageryProvider(
            //     new global.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
            //         url: "http://10.141.11.11:8090/MapTileService/wmts?STORETYPE=merged-dat&PROJECTION=4326",
            //         layer: "wmts_4326_361100",
            //         style: "default",
            //         format: "image/png",
            //         tileMatrixSetID: "c",
            //         tileMatrixLabels: new Array(18).fill(0).map((v, i) => i + 1),
            //         tilingScheme: new global.DC.Namespace.Cesium.GeographicTilingScheme(),
            //     })
            // )

            // 设置地图初始位置，角度等
            global.viewer.camera.setView({

 src/styles/base/index.scss

@@ -354,9 +354,9 @@

        .el-dialog__body {
            padding-top: 0;
            flex: 1;
            display: flex;
            flex-direction: column;
            height: calc(100% - 56px);

            .btn-change {
                display: flex;
@@ -382,6 +382,7 @@
                flex-wrap: wrap;
                justify-self: flex-start;
                align-content: flex-start;
                overflow-y: auto;

                .item {
                    display: flex;
@@ -402,13 +403,16 @@

                    &>div:nth-of-type(2) {
                        width: calc(100% - 140px);

                        overflow: hidden;
                        text-overflow: ellipsis;
                        white-space: nowrap;
                    }
                }

                .dialog-content {
                    width: 100%;
                    display: flex;
                    height: 36px;
                    line-height: 36px;
                    flex-direction: row;
                    text-align: left;

 src/styles/media/index.scss

@@ -321,14 +321,15 @@

                        .equiment-detail {
                            height: countSizeVh(540);

                            .right {
                                .monitor {
                                    height: countSizeVh(540);
                                }
                    

                                .others {
                                    height: countSizeVh(495);
                    

                                    .pages {
                                        padding-bottom: countSizeVh(3);
                                        padding-top: countSizeVh(10);
@@ -1801,22 +1802,27 @@
                            line-height: countSizeVh(30);
                            font-size: countSizeVh(16);
                        }

                        .el-dialog__header span {
                            font-size: countSizeVh(18);
                        }

                        .el-dialog__header button {
                            font-size: countSizeVh(18);
                            right: countSizeVw(10, 1920);
                        }

                        .el-dialog {
                            width: countSizeVw(720, 1920);
                            height: countSizeVh(480);
                        }
                        .el-dialog .el-dialog__body  {

                        .el-dialog .el-dialog__body {
                            height: countSizeVh(450);
                            padding: countSizeVh(6);
                        }
                    }

                    .police-affairs-details-box {
                        .el-dialog {
                            width: countSizeVw(540, 1920);
@@ -2042,71 +2048,68 @@
                    }

                    .policeSituation-details-box {
                        .el-dialog__header span {
                            font-size: countSizeVh(18);
                        }

                        .el-dialog .el-dialog__body {
                            font-size: countSizeVh(16);
                        }

                        .el-dialog__header button {
                            font-size: countSizeVh(18);
                            right: countSizeVw(10, 1920);
                        }

                        .el-dialog {
                            width: countSizeVw(800, 1920);
                            height: countSizeVh(500);
                        }

                        .el-dialog .el-dialog__header {
                            height: countSizeVh(56);
                            line-height: countSizeVh(56);
                        }
                            .el-dialog__header {
                                height: countSizeVh(56);
                                line-height: countSizeVh(56);

                        .el-dialog .el-dialog__body {
                                span {
                                    font-size: countSizeVh(18);
                                }

                            .btn-change {
                                height: countSizeVh(36);
                                line-height: countSizeVh(36);
                                border-bottom: countSizeVh(2) solid #3d5ad5;

                                &>div {
                                    padding: 0 countSizeVw(12, 1920);
                                button {
                                    font-size: countSizeVh(18);
                                    right: countSizeVw(10, 1920);
                                }
                            }

                            .box {
                            .el-dialog__body {
                                height: calc(100% - countSizeVh(56));
                                font-size: countSizeVh(16);

                                .item {
                                    width: calc(50% - countSizeVw(20, 1920));
                                .btn-change {
                                    height: countSizeVh(36);
                                    line-height: countSizeVh(36);
                                    margin: 0 countSizeVw(10, 1920);
                                    border-bottom: countSizeVh(2) solid #3d5ad5;

                                    &>div:first-child {
                                        width: countSizeVw(120, 1920);
                                        margin-right: countSizeVw(20, 1920);
                                    }

                                    &>div:nth-of-type(2) {
                                        width: calc(100% - countSizeVw(140, 1920));
                                    &>div {
                                        padding: 0 countSizeVw(12, 1920);
                                    }
                                }

                                .dialog-content {
                                    height: countSizeVh(36);
                                    line-height: countSizeVh(36);
                                    margin-left: countSizeVw(10, 1920);
                                .box {

                                    &>div:first-child {
                                        width: countSizeVw(120, 1920);
                                        margin-right: countSizeVw(20, 1920);
                                    .item {
                                        width: calc(50% - countSizeVw(20, 1920));
                                        height: countSizeVh(36);
                                        line-height: countSizeVh(36);
                                        margin: 0 countSizeVw(10, 1920);

                                        &>div:first-child {
                                            width: countSizeVw(120, 1920);
                                            margin-right: countSizeVw(20, 1920);
                                        }

                                        &>div:nth-of-type(2) {
                                            width: calc(100% - countSizeVw(140, 1920));
                                        }
                                    }

                                    &>div:nth-of-type(2) {
                                        width: calc(100% - countSizeVw(140, 1920));
                                    .dialog-content {
                                        line-height: countSizeVh(36);
                                        margin-left: countSizeVw(10, 1920);

                                        &>div:first-child {
                                            width: countSizeVw(120, 1920);
                                            margin-right: countSizeVw(20, 1920);
                                        }

                                        &>div:nth-of-type(2) {
                                            width: calc(100% - countSizeVw(140, 1920));
                                        }
                                    }
                                }
                            }
@@ -2386,13 +2389,6 @@

            #divFormsDomBox {
                .divForms {
                    .arrow {
                        left: countSizeVw(-8, 1920);
                        width: countSizeVw(45, 1920);
                        height: countSizeVh(2);
                        transform: rotate(-45deg);
                    }

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

 src/views/home/components/bottomContainer.vue

@@ -26,7 +26,6 @@
                    <span class="beforetime" :class="{ choosed: historytype == 1 }"
                        @click="historyTabClick(1)">历史</span>
                </div>

            </div>

            <div class="body" ref="tableBox" @click="handleSelectClick($event)">
@@ -53,11 +52,12 @@
                            <span class="num" v-text="index + 1"></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="receiving-alarm-time" :title="item.JJSJ"
                                v-text="item.JJSJ.substring(0, 10)"></span>
                            <span class="call-people" v-text="item.BJRXM"></span>
                            <span class="call-phone" v-text="item.LXDH"></span>
                            <span class="call-police-content" :title="item.BJNR" v-text="item.BJNR"></span>
                            <span class="incident-site" v-text="item.SFDZ"></span>
                            <span class="incident-site" :title="item.SFDZ" 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>
@@ -195,7 +195,9 @@
        // 获取实时接警记录
        getAnswerPolices () {
            // getAnswerPolices().then(res => {
            //     this.policeSituationRealtimeArr = res.data.result
            //     this.policeSituationRealtimeArr = res.data.result.map((item, index) => {
            //         return { ...item, lng: item.ZDDWXZB, lat: item.ZDDWYZB }
            //     })
            // })

            this.policeSituationRealtimeArr = [{
@@ -261,8 +263,8 @@
                JJSJ: '2022-12-12 12:12:12',
                BJRXM: '西门庆祝',
                LXDH: 17335843642,
                BJNR: '今日在某小区查获私人赌博场所',
                SFDZ: '上饶市信州区万达华府小区',
                BJNR: '今日在某小区查获私人赌博场所今日在某小区查获私人赌博场所今日在某小区查获私人赌博场所今日在某小区查获私人赌博场所今日在某小区查获私人赌博场所今日在某小区查获私人赌博场所今日在某小区查获私人赌博场所今日在某小区查获私人赌博场所今日在某小区查获私人赌博场所今日在某小区查获私人赌博场所今日在某小区查获私人赌博场所今日在某小区查获私人赌博场所今日在某小区查获私人赌博场所今日在某小区查获私人赌博场所今日在某小区查获私人赌博场所今日在某小区查获私人赌博场所今日在某小区查获私人赌博场所今日在某小区查获私人赌博场所',
                SFDZ: '上饶市信州区万达华府小区上饶市信州区万达华府小区',
                BJLX: '聚众赌博',
                MEMO: '人群聚集赌博'
            },
@@ -277,12 +279,18 @@
                BJLX: '聚众赌博',
                MEMO: '人群聚集赌博'
            }]

            this.policeSituationRealtimeArr = this.policeSituationRealtimeArr.map((item, index) => {
                return { ...item, lng: item.ZDDWXZB, lat: item.ZDDWYZB }
            })
        },

        // 获取历史接警记录
        getAlarmList (type, time) {
            getAlarmList(type, time).then(res => {
                this.policeSituationHistoryArr = res.data.data.records
                this.policeSituationHistoryArr = res.data.data.records.map((item, index) => {
                    return { ...item, lng: item.ZDDWXZB, lat: item.ZDDWYZB }
                })
            })
        },

@@ -298,7 +306,6 @@
                this.getAlarmList(type, this.dateFormat(this.currentMonthTime))
            }

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

@@ -306,23 +313,25 @@
        historyTabClick (type) {
            this.historytype = type

            this.timetype = 0

            this.currentWeekTime = new Date()

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

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

        chooseWeekTimeDate () {
            return this.policeSituationHistoryArr
        chooseRealData () {
            return this.policeSituationRealtimeArr
        },

        chooseMouthTimeDate () {
        chooseTimeDate () {
            return this.policeSituationHistoryArr
        },

@@ -507,6 +516,7 @@
                cursor: pointer;

                span {
                    padding: 0 4px;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    white-space: nowrap;
@@ -517,23 +527,23 @@
                }

                .receiving-alarm-unit {
                    width: 12%;
                    width: 12.6%;
                }

                .receiving-alarm-people {
                    width: 8%;
                    width: 7.6%;
                }

                .receiving-alarm-time {
                    width: 10%;
                    width: 9.6%;
                }

                .call-people {
                    width: 8%;
                    width: 7.6%;
                }

                .call-phone {
                    width: 8%;
                    width: 10%;
                }

                .call-police-content {

 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-06 15:44:39
 * @LastEditTime: 2023-01-07 11:13:02
 * @FilePath: \srs-police-affairs\src\views\home\index.vue
 * @Description: 小区-栋-层-房屋
 *
@@ -11,31 +11,17 @@

<template>
    <div class="home-page container">
        <left-container
            class="left-container"
            @showpeopledetail="showpeopledetail"
            @showlanddetail="showlanddetail"
            @showkeypersondetail="showkeypersondetail"
            ref="leftContainer"
        ></left-container>
        <left-container class="left-container" @showpeopledetail="showpeopledetail" @showlanddetail="showlanddetail"
            @showkeypersondetail="showkeypersondetail" ref="leftContainer"></left-container>

        <right-container
            class="right-container"
            @showequimentdetail="showequimentdetail"
            @selectPoliceChangeEventData="selectPoliceChangeEventData"
            @changeActivityType="changeActivityType"
            @activityChange="activityChange"
            ref="rightContainer"
        ></right-container>
        <right-container class="right-container" @showequimentdetail="showequimentdetail"
            @selectPoliceChangeEventData="selectPoliceChangeEventData" @changeActivityType="changeActivityType"
            @activityChange="activityChange" ref="rightContainer"></right-container>

        <bottom-container
            class="bottom-container"
            ref="bottomContainer"
        <bottom-container class="bottom-container" ref="bottomContainer"
            @changePoliceSituationHistoryType="changePoliceSituationHistoryType"
            @changePoliceSituationTimeType="changePoliceSituationTimeType"
            @policeSituationChange="policeSituationChange"
            @policeSituationSiteClick="policeSituationSiteClick"
        ></bottom-container>
            @policeSituationSiteClick="policeSituationSiteClick"></bottom-container>

        <div class="center-container">
            <div class="layers-control-btn house">
@@ -62,69 +48,30 @@
        </div>

        <div ref="RegionSelect" style="left: 0;" class="region-select">
            <map-select
                class="map-select"
                @selectCheck="policeStationSelect"
                :checkValue="policeStationCheckValue"
                :options="policeStationOptions"
                :optionsName="'policeStationName'"
            ></map-select>
            <map-select class="map-select" @selectCheck="policeStationSelect" :checkValue="policeStationCheckValue"
                :options="policeStationOptions" :optionsName="'policeStationName'"></map-select>

            <map-select
                class="map-select"
                @selectCheck="areaSelect"
                :checkValue="areaCheckValue"
                :options="areaOptions"
                :optionsName="'areaCheckName'"
            ></map-select>
            <map-select class="map-select" @selectCheck="areaSelect" :checkValue="areaCheckValue" :options="areaOptions"
                :optionsName="'areaCheckName'"></map-select>

            <map-select
                class="map-select"
                @selectCheck="housingSelect"
                :checkValue="housingCheckValue"
                :options="housingOptions"
                :optionsName="'housingsName'"
            ></map-select>
            <map-select class="map-select" @selectCheck="housingSelect" :checkValue="housingCheckValue"
                :options="housingOptions" :optionsName="'housingsName'"></map-select>
        </div>

        <el-dialog
            :title="dialogTitle"
            :modal="true"
            :visible.sync="dialogVisible"
            :before-close="dialogBeforeClose"
            :close-on-click-modal="true"
        >
            <video
                src="/video/sp.mp4"
                autoplay
                controls
                width="100%"
                height="100%"
                ref="videoElement"
                style="object-fit: fill"
            ></video>
        <el-dialog :title="dialogTitle" :modal="true" :visible.sync="dialogVisible" :before-close="dialogBeforeClose"
            :close-on-click-modal="true">
            <video src="/video/sp.mp4" autoplay controls width="100%" height="100%" ref="videoElement"
                style="object-fit: fill"></video>
        </el-dialog>

        <el-dialog
            :title="panoramaTitle"
            :modal="true"
            :visible.sync="panoramaVisible"
            :before-close="panoramaBeforeClose"
            :close-on-click-modal="true"
            class="panorama-details-box"
        >
        <el-dialog :title="panoramaTitle" :modal="true" :visible.sync="panoramaVisible"
            :before-close="panoramaBeforeClose" :close-on-click-modal="true" class="panorama-details-box">
            <!-- <iframe src="http://vr.jxpskj.com/JXSFKZQJ/QJ/" style="width: 100%; height: 100%;" frameborder="0"></iframe>-->
            <iframe :src="panoramaVrUrl" style="width: 100%; height: 100%;" frameborder="0" />
        </el-dialog>

        <el-dialog
            :title="activityTitle"
            :modal="true"
            :visible.sync="activityVisible"
            :before-close="activityBeforeClose"
            :close-on-click-modal="true"
            class="activity-details-box"
        >
        <el-dialog :title="activityTitle" :modal="true" :visible.sync="activityVisible"
            :before-close="activityBeforeClose" :close-on-click-modal="true" class="activity-details-box">
            <div class="item">
                <div>活动名称:</div>
                <div>{{ activityDetailArr.activityName }}</div>
@@ -159,14 +106,8 @@
            </div>
        </el-dialog>

        <el-dialog
            :title="phoneTitle"
            :modal="true"
            :visible.sync="phoneVisible"
            :before-close="phoneBeforeClose"
            :close-on-click-modal="true"
            class="phone-details-box"
        >
        <el-dialog :title="phoneTitle" :modal="true" :visible.sync="phoneVisible" :before-close="phoneBeforeClose"
            :close-on-click-modal="true" class="phone-details-box">
            <div class="item">
                <div>责任人：</div>
                <div>{{ phoneDetails.person }}</div>
@@ -185,14 +126,8 @@
            </div>
        </el-dialog>

        <el-dialog
            :title="peopleTitle"
            :modal="true"
            :visible.sync="peopleVisible"
            :before-close="peopleBeforeClose"
            :close-on-click-modal="true"
            class="area-details-box"
        >
        <el-dialog :title="peopleTitle" :modal="true" :visible.sync="peopleVisible" :before-close="peopleBeforeClose"
            :close-on-click-modal="true" class="area-details-box">
            <div class="item">
                <div>责任区负责人：</div>
                <div>王某某</div>
@@ -211,58 +146,30 @@
            </div>
        </el-dialog>

        <el-dialog
            :title="equimentTitle"
            :modal="true"
            :visible.sync="equimentVisible"
            :before-close="equimentBeforeClose"
            :close-on-click-modal="true"
            class="equiment-details-box"
        >
        <el-dialog :title="equimentTitle" :modal="true" :visible.sync="equimentVisible"
            :before-close="equimentBeforeClose" :close-on-click-modal="true" class="equiment-details-box">
            <div class="equiment-detail">
                <div class="left">
                    <el-tree
                        :data="jurisdictionData"
                        :props="defaultProps"
                        @node-click="jurisdictionNodeClick"
                        ref="tree"
                        node-key="id"
                    ></el-tree>
                    <el-tree :data="jurisdictionData" :props="defaultProps" @node-click="jurisdictionNodeClick"
                        ref="tree" node-key="id"></el-tree>
                </div>
                <div class="right">
                    <div class="monitor" v-if="monitorContent">
                        <video
                            src="/video/sp.mp4"
                            autoplay
                            controls
                            width="100%"
                            height="100%"
                            ref="videoElement"
                            style="object-fit: fill"
                        ></video>
                        <video src="/video/sp.mp4" autoplay controls width="100%" height="100%" ref="videoElement"
                            style="object-fit: fill"></video>
                    </div>
                    <div class="others" v-if="othersContent">
                        <el-table
                            :data="showArr.slice((currentPage - 1) * pagesize, currentPage * pagesize)"
                        <el-table :data="showArr.slice((currentPage - 1) * pagesize, currentPage * pagesize)"
                            style="width: 100%"
                            :header-cell-style="{ 'text-align': 'center', 'background-color': '#203c60', 'borderColor': '#324e75' }"
                            :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75' }"
                            :row-class-name="tableRowClassName"
                        >
                            :row-class-name="tableRowClassName">
                            <el-table-column prop="carID" label="车牌号" v-if="carArrShow"></el-table-column>
                            <el-table-column prop="carType" label="车型" v-if="carArrShow"></el-table-column>
                            <el-table-column prop="phoneID" label="手台号" v-if="phoneArrShow"></el-table-column>
                            <el-table-column prop="phoneType" label="手台机型" v-if="phoneArrShow"></el-table-column>
                            <el-table-column
                                prop="recorderID"
                                label="执法记录仪号"
                                v-if="recorderArrShow"
                            ></el-table-column>
                            <el-table-column
                                prop="recorderType"
                                label="记录仪机型"
                                v-if="recorderArrShow"
                            ></el-table-column>
                            <el-table-column prop="recorderID" label="执法记录仪号" v-if="recorderArrShow"></el-table-column>
                            <el-table-column prop="recorderType" label="记录仪机型" v-if="recorderArrShow"></el-table-column>
                            <el-table-column prop="id" label="设备号" v-if="stateArrShow"></el-table-column>
                            <el-table-column prop="equimentType" label="设备类型" v-if="stateArrShow"></el-table-column>
                            <el-table-column prop="policeStation" label="所属派出所"></el-table-column>
@@ -270,35 +177,20 @@
                            <el-table-column prop="state" label="状态"></el-table-column>
                        </el-table>
                        <div class="pages">
                            <el-pagination
                                background
                                layout="prev, pager, next"
                                :total="showArr.length"
                                :page-size="pagesize"
                                pager-count="3"
                                :current-page="currentPage"
                                @current-change="handleCurrentChange"
                            ></el-pagination>
                            <el-pagination background layout="prev, pager, next" :total="showArr.length"
                                :page-size="pagesize" pager-count="3" :current-page="currentPage"
                                @current-change="handleCurrentChange"></el-pagination>
                        </div>
                    </div>
                </div>
            </div>
        </el-dialog>

        <el-dialog
            :title="landTitle"
            :modal="true"
            :visible.sync="landVisible"
            :before-close="landBeforeClose"
            :close-on-click-modal="true"
            class="land-details-box"
        >
            <el-table
                :data="landDetailArr"
                style="width: 100%"
        <el-dialog :title="landTitle" :modal="true" :visible.sync="landVisible" :before-close="landBeforeClose"
            :close-on-click-modal="true" class="land-details-box">
            <el-table :data="landDetailArr" style="width: 100%"
                :header-cell-style="{ 'text-align': 'center', 'background-color': '#203c60', 'borderColor': '#324e75' }"
                :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75', 'cursor': 'pointer' }"
            >
                :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75', 'cursor': 'pointer' }">
                <el-table-column prop="housingEastate" label="小区名称" width="100"></el-table-column>
                <el-table-column prop="location" label="位置" width="140"></el-table-column>
                <el-table-column prop="area" label="面积" width="120"></el-table-column>
@@ -307,20 +199,11 @@
            </el-table>
        </el-dialog>

        <el-dialog
            :title="keyPersonTitle"
            :modal="true"
            :visible.sync="keyPersonVisible"
            :before-close="keyPersonBeforeClose"
            :close-on-click-modal="true"
            class="keyPerson-details-box"
        >
            <el-table
                :data="keyPersonDetailArr"
                style="width: 100%"
        <el-dialog :title="keyPersonTitle" :modal="true" :visible.sync="keyPersonVisible"
            :before-close="keyPersonBeforeClose" :close-on-click-modal="true" class="keyPerson-details-box">
            <el-table :data="keyPersonDetailArr" style="width: 100%"
                :header-cell-style="{ 'text-align': 'center', 'background-color': '#203c60', 'borderColor': '#324e75' }"
                :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75', 'cursor': 'pointer' }"
            >
                :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75', 'cursor': 'pointer' }">
                <el-table-column prop="type" label="重点人员类型"></el-table-column>
                <el-table-column prop="name" label="姓名"></el-table-column>
                <el-table-column prop="sex" label="性别"></el-table-column>
@@ -331,31 +214,11 @@
            </el-table>
        </el-dialog>

        <el-dialog
            title="警情信息"
            :modal="true"
            :visible.sync="policeSituationVisible"
            :before-close="policeSituationBeforeClose"
            :close-on-click-modal="true"
            class="policeSituation-details-box"
        >
        <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 :class="{ on: policeInformationType == '接警信息' }" @click="alarmOrActAsPolice('接警信息')">接警信息</div>
                <div :class="{ on: policeInformationType == '出警信息' }" @click="alarmOrActAsPolice('出警信息')">出警信息</div>
            </div>

            <div v-show="policeInformationType == '接警信息'" class="box">
@@ -392,21 +255,25 @@
                    <div>{{ policeSituationDetailArr.BJRXM }}</div>
                </div>
                <div class="item">
                    <div>事发地址:</div>
                    <div>{{ policeSituationDetailArr.SFDZ }}</div>
                </div>
                <div class="item">
                    <div>报警类别:</div>
                    <div>{{ policeSituationDetailArr.BJLB }}</div>
                </div>

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

                <div class="dialog-content">
                    <div>事发地址:</div>
                    <div>{{ policeSituationDetailArr.SFDZ }}</div>
                </div>

                <div class="dialog-content">
                    <div>报警内容:</div>
                    <div>{{ policeSituationDetailArr.BJNR }}</div>
                </div>

                <div class="dialog-content">
                    <div>备注:</div>
                    <div>{{ policeSituationDetailArr.MEMO }}</div>
@@ -587,8 +454,6 @@
import bottomContainer from './components/bottomContainer'
import historyArr from '@/assets/data/activitysData/history.js'
import underwayArr from '@/assets/data/activitysData/underway.js'
import realtimeArr from '@/assets/data/policeSituationArr/realtimeArr.js'
import policeSituationHistoryArr from '@/assets/data/policeSituationArr/historyArr.js'
import { getPoliceStationList } from "@/api/dept"
import { convertStringToList } from "@/utils/geometryStringTool"

@@ -723,9 +588,6 @@
            underwayArr: [],
            activityType: 0,
            policeSituationHistoryType: 0,
            policeSituationTimeType: 0,
            policeSituationRealtimeArr: [],
            policeSituationHistoryArr: [],
            policeSituationDetailArr: {},
            CJdata: {},
            activityDetailArr: {},
@@ -748,8 +610,6 @@
        this.getPoliceStationList()
        this.historyArr = historyArr
        this.underwayArr = underwayArr
        this.policeSituationRealtimeArr = realtimeArr
        this.policeSituationHistoryArr = policeSituationHistoryArr
        this.getPanoramaList()

        this.getResidentialQuartersList('361102')
@@ -1086,32 +946,21 @@
                this.policeSituationList.forEach((item, index) => {
                    let center = new global.DC.Position(item.lng, item.lat)
                    let point = new global.DC.PointPrimitive(center)

                    let num = 0
                    if (item.state == '处理中') {
                        timer[index] = setInterval(() => {
                            num++
                            if (num >= 10) {
                                num = 0
                            }
                            point.setStyle({
                                outlineColor: global.DC.Color.RED.withAlpha(0.5),//边框颜色
                                outlineWidth: num,//边框大小，
                                color: global.DC.Color.RED
                            })
                        }, 100)
                    } else {
                        timer[index] = setInterval(() => {
                            num++
                            if (num >= 10) {
                                num = 0
                            }
                            point.setStyle({
                                outlineColor: global.DC.Color.GREEN.withAlpha(0.5),//边框颜色
                                outlineWidth: num,//边框大小，
                                color: global.DC.Color.GREEN
                            })
                        }, 100)
                    }

                    timer[index] = setInterval(() => {
                        num++
                        if (num >= 10) {
                            num = 0
                        }
                        point.setStyle({
                            outlineColor: global.DC.Color.RED.withAlpha(0.5),//边框颜色
                            outlineWidth: num,//边框大小，
                            color: global.DC.Color.RED
                        })
                    }, 100)

                    point.attrParams = item
                    point.on(global.DC.MouseEventType.CLICK, this.policeSituationSiteClick)
                    circleLayer.addOverlay(point)
@@ -1123,43 +972,19 @@

        policeSituationSelectChange () {
            let showArr = []
            if (this.policeStaionChecked && this.policeStaionChecked.policeStationName != '全部') {
                let arr1 = []
                let arr2 = []
                realtimeArr.some(item => {
                    if (item.policeName == this.policeStaionChecked.policeStationName) {
                        arr1.push(item)
                    }
                })
                this.policeSituationRealtimeArr = arr1
                policeSituationHistoryArr.some(item => {
                    if (item.policeName == this.policeStaionChecked.policeStationName) {
                        arr2.push(item)
                    }
                })
                this.policeSituationHistoryArr = arr2

            } else {
                this.policeSituationRealtimeArr = realtimeArr
                this.policeSituationHistoryArr = policeSituationHistoryArr
            }
            if (this.policeSituationHistoryType == 0) {
                showArr = this.policeSituationRealtimeArr
                showArr = this.$refs.bottomContainer.chooseRealData()
            } else {
                let showSaveArr = this.policeSituationHistoryArr
                if (this.policeSituationTimeType == 0) {
                    showArr = this.$refs.bottomContainer.chooseWeekTimeDate(showSaveArr)
                } else {
                    showArr = this.$refs.bottomContainer.chooseMouthTimeDate(showSaveArr)
                }
                showArr = this.$refs.bottomContainer.chooseTimeDate()
            }

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

            this.policeSituationList = showArr
        },

@@ -1622,10 +1447,6 @@
            this.policeSituationHistoryType = type
        },

        changePoliceSituationTimeType (type) {
            this.policeSituationTimeType = type
        },

        /**
         * 获取所有全景数据
         */
@@ -1939,9 +1760,7 @@
                background-color: #66b1ff87;
            }

            :deep(.el-tree--highlight-current
                    .el-tree-node.is-current
                    > .el-tree-node__content) {
            :deep(.el-tree--highlight-current .el-tree-node.is-current > .el-tree-node__content) {
                background: #454545;
            }