Merge branch 'master' of http://192.168.0.105:10010/r/srs-police-affairs

guanqb

2023-02-08 f40918f9c3b4de685190ef0aec678fff4d3bca47

Merge branch 'master' of http://192.168.0.105:10010/r/srs-police-affairs

 src/App.vue

@@ -10,9 +10,9 @@
-->
<template>
    <div id="app" :style="{
    width: (useSceen == true ? currentWidth + 'px' : '100%'),
    height: (useSceen == true ? currentHeight + 'px' : '100%')
}">
        width: (useSceen == true ? currentWidth + 'px' : '100%'),
        height: (useSceen == true ? currentHeight + 'px' : '100%')
    }">
        <router-view></router-view>
    </div>
</template>

 src/api/video/index.js

@@ -2,7 +2,7 @@
 * @Author: shuishen 1109946754@qq.com
 * @Date: 2022-11-15 15:10:41
 * @LastEditors: shuishen 1109946754@qq.com
 * @LastEditTime: 2023-01-11 11:29:09
 * @LastEditTime: 2023-02-08 10:11:23
 * @FilePath: \srs-police-affairs\src\api\video\index.js
 * @Description: 
 * 
@@ -145,9 +145,18 @@
 */
export const getTreeDevices = (params) => {
    return request({
        url: '/device/query/tree/36110000002009999000',
        url: '/api/deviceChannel/deviceChannel/lazy-tree',
        method: 'get',
        requestBaseUrl: 'outside',
        params: {
            ...params
        }
    })
}

export const getSearchTreeDevices = (params) => {
    return request({
        url: '/api/deviceChannel/deviceChannel/tree',
        method: 'get',
        params: {
            ...params
        }

 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-02-06 17:25:33
 * @LastEditTime: 2023-02-08 16:49:29
 * @FilePath: \srs-police-affairs\src\components\map\index.vue
 * @Description: 公用地图组件
 * 
@@ -15,38 +15,21 @@
        <!-- 全屏控制按钮 -->
        <div class="screen-full-btn">
            <el-tooltip v-if="isFullscreen" content="缩放" placement="bottom" effect="dark">
                <i
                    class="fa fa-compress"
                    style="vertical-align: middle; cursor: pointer"
                    @click="fullscreenchange"
                ></i>
                <i class="fa fa-compress" style="vertical-align: middle; cursor: pointer" @click="fullscreenchange"></i>
            </el-tooltip>
            <el-tooltip v-if="!isFullscreen" content="全屏" placement="bottom" effect="dark">
                <i
                    class="fa fa-expand"
                    style="vertical-align: middle; cursor: pointer"
                    @click="fullscreenchange"
                ></i>
                <i class="fa fa-expand" style="vertical-align: middle; cursor: pointer" @click="fullscreenchange"></i>
            </el-tooltip>
        </div>
        <!-- 切换矢量图按钮 -->
        <div
            style="display: none !important;"
            class="image-switch-icon-btn"
            title="切换影像"
            @mouseover="showImgBtn = true"
            @mouseleave="showImgBtn = false"
        >
        <div style="display: none !important;" class="image-switch-icon-btn" title="切换影像" @mouseover="showImgBtn = true"
            @mouseleave="showImgBtn = false">
            <div class="icon-box">
                <img src="/img/base_map.png" alt />
            </div>

            <div
                class="image-switch-img-btn"
                v-show="showImgBtn"
                @mouseover="showImgBtn = true"
                @mouseleave="showImgBtn = false"
            >
            <div class="image-switch-img-btn" v-show="showImgBtn" @mouseover="showImgBtn = true"
                @mouseleave="showImgBtn = false">
                <div class="img" @click="switchImg">
                    <span :class="{ on: imgtype == 0 }">影像</span>
                </div>
@@ -191,40 +174,50 @@
            // 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.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(),
            //     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.UrlTemplateImageryProvider({
                    url: 'http://10.141.11.11:80/ysapi/geoserver/gwc/service/wmts/{z}/{y}/{x}.png',
                })
            )

            // 影像图层
            // global.viewer.imageryLayers.addImageryProvider(
            // const ysWmts = global.viewer.imageryLayers.addImageryProvider(
            //     new global.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
            //         url: "http://10.141.11.12:18088/geoserver/gwc/service/wmts?STORETYPE=merged-dat&PROJECTION=4326",
            //         url: "http://10.141.11.11:80/ysapi/geoserver/gwc/service/wmts",
            //         layer: "test",
            //         style: "default",
            //         style: "",
            //         format: "image/png",
            //         tileMatrixSetID: "c",
            //         tileMatrixLabels: new Array(18).fill(0).map((v, i) => i + 1),
            //         tilingScheme: new global.DC.Namespace.Cesium.GeographicTilingScheme(),
            //         tileMatrixSetID: gridsetName,
            //         tileMatrixLabels: gridNames.map(item => {
            //             let arr = item.split(':')
            //             arr[2] = arr[2] - 1
            //             return arr.join(':')
            //         }),
            //         // tilingScheme: new global.DC.Namespace.Cesium.GeographicTilingScheme(),
            //     })
            // )


 src/styles/media/index.scss

@@ -1081,9 +1081,9 @@
                                height: countSizeVh(52);

                                input {
                                    font-size: countSizeVh(18);
                                    height: countSizeVh(32);
                                    font-size: countSizeVh(16);
                                    border: countSizeVh(1) solid rgb(0, 92, 169);
                                    border-radius: countSizeVh(20) 0 0 countSizeVw(20, 1920);
                                }

                                button {
@@ -2649,7 +2649,7 @@

        .date-day-style.el-picker-panel {
            width: countSizeVw(536, 1920) !important;
            

        }

        .el-date-range-picker__header div {
@@ -2691,11 +2691,12 @@
            margin-left: countSizeVw(110, 1920);
            display: flex;
        }

        .el-picker-panel__body {
            display: flex;
        }
       
        .el-date-table .disabled div{

        .el-date-table .disabled div {
            background-color: $sub-tab-border-color;
        }


 src/views/home/components/bottomContainer.vue

@@ -2,7 +2,7 @@
 * @Author: shuishen 1109946754@qq.com
 * @Date: 2023-01-13 15:52:59
 * @LastEditors: shuishen 1109946754@qq.com
 * @LastEditTime: 2023-02-04 15:23:10
 * @LastEditTime: 2023-02-07 11:27:50
 * @FilePath: \srs-police-affairs\src\views\home\components\bottomContainer.vue
 * @Description: 
 * 
@@ -148,6 +148,8 @@
</template>

<script>
let alarmTiming = null

import vueSeamlessScroll from 'vue-seamless-scroll'

import { getAnswerPolices, getAlarmList } from "@/api/home/index.js"
@@ -560,9 +562,17 @@
                return this.dateFormat(item)
            })

            if (alarmTiming != null) {
                clearInterval(alarmTiming)
                alarmTiming = null
            }

            if (type == 0) {
                await this.getAnswerPolices()

                alarmTiming = setInterval(() => {
                    this.getAnswerPolices()
                }, 60000)
            } else {
                this.currentPage = 1


 src/views/home/components/leftContainer.vue

@@ -13,27 +13,19 @@
                    </div>-->
                </div>
                <div class="sub-tab" v-show="peopletype == 0">
                    <div
                        class="tab"
                        :class="{ 'select-on-tab': tabType == 0 }"
                        @click="personTabClick(0)"
                    >
                    <div class="tab" :class="{ 'select-on-tab': tabType == 0 }" @click="personTabClick(0)">
                        <div class="tab-title-small">户籍人口:</div>
                        <div class="tab-title-small">
                            {{
                            personAll.total ? personAll.total : 0
                                personAll.total ? personAll.total : 0
                            }}人
                        </div>
                    </div>
                    <div
                        class="tab"
                        :class="{ 'select-on-tab': tabType == 1 }"
                        @click="personTabClick(1)"
                    >
                    <div class="tab" :class="{ 'select-on-tab': tabType == 1 }" @click="personTabClick(1)">
                        <div class="tab-title-small">重点人员:</div>
                        <div class="tab-title-small">
                            {{
                            personAll.emphasisNum ? personAll.emphasisNum : 0
                                personAll.emphasisNum ? personAll.emphasisNum : 0
                            }}人
                        </div>
                    </div>
@@ -43,68 +35,41 @@
                    </div>-->
                </div>
                <div id="PersonEcharts" class="echarts-box"></div>
                <div
                    class="back"
                    title="返回上一级"
                    v-show="dataDeep == 2 && peopletype == 0 && showBack"
                    @click="backBegin"
                ></div>
                <div class="back" title="返回上一级" v-show="dataDeep == 2 && peopletype == 0 && showBack"
                    @click="backBegin"></div>
            </div>

            <svg class="border-svg">
                <defs>
                    <path
                        id="border-box-8-path-974b4d7cfafa444396861ca1d1173c8c"
                    <path id="border-box-8-path-974b4d7cfafa444396861ca1d1173c8c"
                        d="M0.27,0.03c52.66,0,105.34,0,158,0c1.67,2,3.33,4,5,6c1,0.33,2,0.67,3,1c1.33,1.67,2.67,3.33,4,5
                    c16,0,32,0,48,0c53.66,0,107.34,0,161,0c1.13,1.72,0.63,1.36,3,2c0,0.67,0,1.33,0,2c0.67,0,1.33,0,2,0
                    c0.01,104.58,0.01,206.44,0,309c-1.43,0.78-4.01,2.77-5,4c-12,0-24,0-36,0c-2.67-3.33-5.33-6.67-8-10c-21,0-42,0-63,0
                    c-1.08,2.32-2.35,4.25-4,6c-0.67,0.33-1.33,0.67-2,1c-0.33,1-0.67,2-1,3c-20,0-40,0-60,0c-66.66,0-133.34,0-200,0
                    c-1.28-1.57-2.76-2.25-4-4c-0.33,0-0.67,0-1,0c0-8.67,0-17.33,0-26c0-19.66,0-39.34,0-59C0.27,160.04,0.27,80.02,0.27,0.03z"
                        fill="transparent"
                    />
                    <radialGradient
                        id="border-box-8-gradient-974b4d7cfafa444396861ca1d1173c8c"
                        cx="50%"
                        cy="50%"
                        r="50%"
                    >
                    c-1.28-1.57-2.76-2.25-4-4c-0.33,0-0.67,0-1,0c0-8.67,0-17.33,0-26c0-19.66,0-39.34,0-59C0.27,160.04,0.27,80.02,0.27,0.03z" fill="transparent" />
                    <radialGradient id="border-box-8-gradient-974b4d7cfafa444396861ca1d1173c8c" cx="50%" cy="50%"
                        r="50%">
                        <stop offset="0%" stop-color="#fff" stop-opacity="1" />
                        <stop offset="100%" stop-color="#fff" stop-opacity="0" />
                    </radialGradient>
                    <mask id="border-box-8-mask-974b4d7cfafa444396861ca1d1173c8c">
                        <circle
                            cx="0"
                            cy="0"
                            r="150"
                            fill="url(#border-box-8-gradient-974b4d7cfafa444396861ca1d1173c8c)"
                        >
                            <animateMotion
                                dur="8s"
                        <circle cx="0" cy="0" r="150"
                            fill="url(#border-box-8-gradient-974b4d7cfafa444396861ca1d1173c8c)">
                            <animateMotion dur="8s"
                                path="M0.27,0.03c52.66,0,105.34,0,158,0c1.67,2,3.33,4,5,6c1,0.33,2,0.67,3,1c1.33,1.67,2.67,3.33,4,5
                        c16,0,32,0,48,0c53.66,0,107.34,0,161,0c1.13,1.72,0.63,1.36,3,2c0,0.67,0,1.33,0,2c0.67,0,1.33,0,2,0
                        c0.01,104.58,0.01,206.44,0,309c-1.43,0.78-4.01,2.77-5,4c-12,0-24,0-36,0c-2.67-3.33-5.33-6.67-8-10c-21,0-42,0-63,0
                        c-1.08,2.32-2.35,4.25-4,6c-0.67,0.33-1.33,0.67-2,1c-0.33,1-0.67,2-1,3c-20,0-40,0-60,0c-66.66,0-133.34,0-200,0
                        c-1.28-1.57-2.76-2.25-4-4c-0.33,0-0.67,0-1,0c0-8.67,0-17.33,0-26c0-19.66,0-39.34,0-59C0.27,160.04,0.27,80.02,0.27,0.03z"
                                rotate="auto"
                                repeatCount="indefinite"
                            />
                                rotate="auto" repeatCount="indefinite" />
                        </circle>
                    </mask>
                </defs>

                <use
                    stroke-width="2"
                    xlink:href="#border-box-8-path-974b4d7cfafa444396861ca1d1173c8c"
                    mask="url(#border-box-8-mask-974b4d7cfafa444396861ca1d1173c8c)"
                    stroke="#4fd2dd"
                >
                    <animate
                        attributeName="stroke-dasharray"
                        from="0, 1442"
                        to="1442, 0"
                        dur="8s"
                        repeatCount="indefinite"
                    />
                <use stroke-width="2" xlink:href="#border-box-8-path-974b4d7cfafa444396861ca1d1173c8c"
                    mask="url(#border-box-8-mask-974b4d7cfafa444396861ca1d1173c8c)" stroke="#4fd2dd">
                    <animate attributeName="stroke-dasharray" from="0, 1442" to="1442, 0" dur="8s"
                        repeatCount="indefinite" />
                </use>
            </svg>
        </div>
@@ -112,19 +77,11 @@
            <div class="box">
                <div class="title">现有住宅</div>
                <div class="sub-tab">
                    <div
                        class="tab"
                        :class="{ 'select-on-tab': tabTypeTwo == 0 }"
                        @click="houseTabClick(0)"
                    >
                    <div class="tab" :class="{ 'select-on-tab': tabTypeTwo == 0 }" @click="houseTabClick(0)">
                        <div class="tab-title-small">实有楼栋:</div>
                        <div class="tab-title-small">{{ realHouseNum?realHouseNum: 0 }}栋</div>
                    </div>
                    <div
                        class="tab"
                        :class="{ 'select-on-tab': tabTypeTwo == 1 }"
                        @click="houseTabClick(1)"
                    >
                    <div class="tab" :class="{ 'select-on-tab': tabTypeTwo == 1 }" @click="houseTabClick(1)">
                        <div class="tab-title-small">关注场所:</div>
                        <div class="tab-title-small">{{ keyPlaceNum?keyPlaceNum: 0 }}栋</div>
                    </div>
@@ -133,19 +90,10 @@
            </div>

            <svg class="border-svg">
                <use
                    stroke-width="2"
                    xlink:href="#border-box-8-path-974b4d7cfafa444396861ca1d1173c8c"
                    mask="url(#border-box-8-mask-974b4d7cfafa444396861ca1d1173c8c)"
                    stroke="#4fd2dd"
                >
                    <animate
                        attributeName="stroke-dasharray"
                        from="0, 1442"
                        to="1442, 0"
                        dur="8s"
                        repeatCount="indefinite"
                    />
                <use stroke-width="2" xlink:href="#border-box-8-path-974b4d7cfafa444396861ca1d1173c8c"
                    mask="url(#border-box-8-mask-974b4d7cfafa444396861ca1d1173c8c)" stroke="#4fd2dd">
                    <animate attributeName="stroke-dasharray" from="0, 1442" to="1442, 0" dur="8s"
                        repeatCount="indefinite" />
                </use>
            </svg>
        </div>
@@ -153,19 +101,11 @@
            <div class="box">
                <div class="title">现有地</div>
                <div class="sub-tab" v-show="isAllPoliceStation">
                    <div
                        class="tab"
                        :class="{ 'select-on-tab': tabTypeThree == 0 }"
                        @click="landTabClick(0)"
                    >
                    <div class="tab" :class="{ 'select-on-tab': tabTypeThree == 0 }" @click="landTabClick(0)">
                        <div class="tab-title-small">小区:</div>
                        <div class="tab-title-small">{{ villageNum?villageNum: 0 }}个</div>
                    </div>
                    <div
                        class="tab"
                        :class="{ 'select-on-tab': tabTypeThree == 1 }"
                        @click="landTabClick(1)"
                    >
                    <div class="tab" :class="{ 'select-on-tab': tabTypeThree == 1 }" @click="landTabClick(1)">
                        <div class="tab-title-small">责任区:</div>
                        <div class="tab-title-small">{{ areaNum?areaNum: 0 }}个</div>
                    </div>
@@ -181,19 +121,10 @@
            </div>

            <svg class="border-svg">
                <use
                    stroke-width="2"
                    xlink:href="#border-box-8-path-974b4d7cfafa444396861ca1d1173c8c"
                    mask="url(#border-box-8-mask-974b4d7cfafa444396861ca1d1173c8c)"
                    stroke="#4fd2dd"
                >
                    <animate
                        attributeName="stroke-dasharray"
                        from="0, 1442"
                        to="1442, 0"
                        dur="8s"
                        repeatCount="indefinite"
                    />
                <use stroke-width="2" xlink:href="#border-box-8-path-974b4d7cfafa444396861ca1d1173c8c"
                    mask="url(#border-box-8-mask-974b4d7cfafa444396861ca1d1173c8c)" stroke="#4fd2dd">
                    <animate attributeName="stroke-dasharray" from="0, 1442" to="1442, 0" dur="8s"
                        repeatCount="indefinite" />
                </use>
            </svg>
        </div>
@@ -209,6 +140,8 @@
let keyPersonmyChart = null
let houseMyChart
let landMyChart

let leftTiming = null

let myColor = ['#00e9db', '#00c0e9', '#0096f3', '#33CCFF', '#33FFCC', '#eb2100', '#eb3600', '#d0570e', '#d0a00e', '#34da62']

@@ -369,11 +302,24 @@
                this.isAllPoliceStation = true
            }

            this.personTabClick(0)
            this.personTabClick(this.tabType)

            this.houseTabClick(0)
            this.houseTabClick(this.tabTypeTwo)

            this.landTabClick(0)
            this.landTabClick(this.tabTypeThree)

            if (leftTiming != null) {
                clearInterval(leftTiming)
                leftTiming = null
            }

            leftTiming = setInterval(async () => {
                this.personTabClick(this.tabType)

                this.houseTabClick(this.tabTypeTwo)

                this.landTabClick(this.tabTypeThree)
            }, 600000)
        },

        /**
@@ -385,15 +331,7 @@
            this.tabType = type
            this.dataDeep = 1

            if (homePersonmyChart != null && homePersonmyChart != '' && homePersonmyChart != undefined) {
                homePersonmyChart.dispose()
                homePersonmyChart.off('click')
            }

            if (keyPersonmyChart != null && keyPersonmyChart != '' && keyPersonmyChart != undefined) {
                keyPersonmyChart.dispose()
                keyPersonmyChart.off('click')
            }
            this.disposeEchart()

            if (type == 0) {
                if (this.userInfo.dept_id == '1123598813738675201' && this.policeStaionID == '') {
@@ -416,6 +354,8 @@
        getPoliceStationInfo () {
            getVillagePersonStatisticInfo().then(res => {
                if (res.data.code == 200) {
                    this.disposeEchart()

                    this.personAll = res.data.data
                    this.policeStationPersonInfo = res.data.data
                    //异步，因此放进接口方法内部
@@ -435,6 +375,8 @@
        getVillagePersonStatisticInfoByPoliceStationId (policeStationId, name) {
            getVillagePersonStatisticInfoByPoliceStationId(policeStationId, name).then(res => {
                if (res.data.code == 200) {
                    this.disposeEchart()

                    var chartDom = document.getElementById('PersonEcharts')
                    homePersonmyChart = this.$echarts.init(chartDom)
                    this.personAll = res.data.data
@@ -630,6 +572,8 @@
         */
        getHouseStatisticInfo (isFollow) {
            getHouseStatisticInfo(this.policeStaionID != '' ? this.policeStaionID : this.userInfo.dept_id, isFollow).then(res => {
                this.disposeHouseEchart()

                let xDate = []
                let yDate = []
                if (isFollow == 1) {
@@ -747,6 +691,8 @@

        houseTabClick (type) {
            this.tabTypeTwo = type

            this.disposeHouseEchart()
            if (type == 0) {
                this.getHouseStatisticInfo(2)
            } else {
@@ -861,6 +807,8 @@
         * @return {*}
         */
        async initkeyPersonEcharts () {
            this.disposeEchart()

            var chartDom = document.getElementById('PersonEcharts')
            keyPersonmyChart = this.$echarts.init(chartDom)

@@ -999,6 +947,7 @@
        landTabClick (type) {
            this.tabTypeThree = type

            this.disposeLandEchart()
            if (type == 0) {
                this.getAreaStatisticInfo(2)
            } else if (type == 1) {
@@ -1014,6 +963,8 @@
         */
        getAreaStatisticInfo (type) {
            getAreaStatisticInfo(type, this.policeStaionID != '' ? this.policeStaionID : this.userInfo.dept_id).then(res => {
                this.disposeLandEchart()

                let landData = []
                if (type == 2) {
                    this.areaNum = res.data.data.areaNum
@@ -1072,8 +1023,6 @@
            })
        },



        /**
         * @description: 视图窗口改变时，echarts图表重置
         * @return {*}
@@ -1085,27 +1034,51 @@
            houseMyChart && houseMyChart != null && houseMyChart.resize()
        },

        /**
         * @description: 销毁所有echarts实例，解绑点击事件
         * @return {*}
         */
        disposeEchart () {
            if (homePersonmyChart != null && homePersonmyChart != '' && homePersonmyChart != undefined) {
                homePersonmyChart.dispose()
                homePersonmyChart.off('click')
            }

            if (keyPersonmyChart != null && keyPersonmyChart != '' && keyPersonmyChart != undefined) {
                keyPersonmyChart.dispose()
                keyPersonmyChart.off('click')
            }
        },

        /**
         * @description: 销毁所有echarts实例，解绑点击事件
         * @return {*}
         */
        disposeHouseEchart () {
            if (houseMyChart != null && houseMyChart != '' && houseMyChart != undefined) {
                houseMyChart.dispose()
                houseMyChart.off('click')
            }
        },

        /**
         * @description: 销毁所有echarts实例，解绑点击事件
         * @return {*}
         */
        disposeLandEchart () {
            if (landMyChart != null && landMyChart != '' && landMyChart != undefined) {
                landMyChart.dispose()
                landMyChart.off('click')
            }
        }
    },

    destroyed () {
        window.removeEventListener("resize", this.echartsResize)

        if (homePersonmyChart) {
            homePersonmyChart.dispose()
            homePersonmyChart = null
        }
        if (houseMyChart) {
            houseMyChart.dispose()
            houseMyChart = null
        }
        if (landMyChart) {
            landMyChart.dispose()
            landMyChart = null
        }
        if (keyPersonmyChart) {
            keyPersonmyChart.dispose()
            keyPersonmyChart = null
        }
        this.disposeEchart()
        this.disposeHouseEchart()
        this.disposeLandEchart()
    }
}
</script>
@@ -1213,7 +1186,7 @@
                color: #fff;
            }

            & > div:nth-of-type(2) {
            &>div:nth-of-type(2) {
                font-size: 14px;
            }
        }
@@ -1241,7 +1214,7 @@
                align-items: center;
                justify-content: center;

                & > div {
                &>div {
                    height: 22px;
                    line-height: 22px;
                    white-space: nowrap;

 src/views/home/components/rightContainer.vue

@@ -81,8 +81,8 @@
                <div class="title">
                    <div>现有设备</div>
                    <div class="title-tab">
                        <span :class="{ choosed: linetype == 0 }" @click="lineTabClick(0)">设备种类</span>/
                        <span :class="{ choosed: linetype == 1 }" @click="lineTabClick(1)">设备状态</span>
                        <span :class="{ choosed: linetype == 0 }" @click="initEquipmentEcharts(0)">设备种类</span>/
                        <span :class="{ choosed: linetype == 1 }" @click="initEquipmentEcharts(1)">设备状态</span>
                    </div>
                </div>
                <div style="overflow: hidden;" id="EquipmentEcharts" class="echarts-box"></div>
@@ -103,6 +103,7 @@
const oneColor = ['#4caf50', '#2979ff', '#ffd600', '#0d47a1', '#b71c1c']
const twoColor = ['#5470FE', '#91cc75', '#fac858', '#ee6666', '#73c0de', '#3ba272', '#fc8452', '#9a60b4', '#ea7ccc']

let rightTiming = null
let equipmentmyChart = null
let eventchangemychart = null
let timer
@@ -201,7 +202,18 @@

            this.initEventChangeEcharts()

            this.initEquipmentEcharts()
            this.initEquipmentEcharts(this.linetype)

            if (rightTiming != null) {
                clearInterval(rightTiming)
                rightTiming = null
            }

            rightTiming = setInterval(async () => {

                this.initEquipmentEcharts(this.linetype)

            }, 600000)
        },

        getSchedulingList () {
@@ -388,7 +400,7 @@
        // 现有设备统计
        getEquipment () {
            const typeData = {
                carCount: '警车',
                carCount: '车辆',
                monitorCount: '摄像头',
                recorderCount: '手台',
                phoneCount: '手持记录仪'
@@ -418,8 +430,8 @@

                    return data
                } else {
                    let normalData = { value: 0, name: '正常', color: '#4caf50', online: true, label: { color: oneColor[0] } }
                    let faultData = { value: 0, name: '故障', color: '#ffd600', online: false, label: { color: oneColor[2] } }
                    let normalData = { value: 0, name: '在线', color: '#4caf50', online: true, label: { color: oneColor[0] } }
                    let faultData = { value: 0, name: '离线', color: '#ffd600', online: false, label: { color: oneColor[2] } }

                    res.data.forEach(item => {
                        this.regionTotal += item.count
@@ -428,12 +440,12 @@

                        for (let key in typeData) {
                            if (item.type == typeData[key]) {
                                normalData[key] = item.online
                                faultData[key] = item.offline
                                normalData[key] = Number(item.online)
                                faultData[key] = Number(item.offline)
                            }
                        }

                        faultData.value += item.offline
                        faultData.value = Number(faultData.value) + Number(item.offline)
                    })

                    data = [normalData, faultData]
@@ -448,20 +460,16 @@
            return dataAll
        },

        // 设备种类，设备状态切换
        async lineTabClick (type) {
        // 现有设备饼图初始化
        async initEquipmentEcharts (type) {
            this.linetype = type

            const data = await this.getEquipment()
            if (equipmentmyChart != null && equipmentmyChart != '' && equipmentmyChart != undefined) {
                equipmentmyChart.dispose()
                equipmentmyChart.off('click')
            }

            equipmentmyChart.setOption(this.initEquipmentOptions(data), true)
        },

        // 现有设备饼图初始化
        async initEquipmentEcharts () {
            var chartDom = document.getElementById('EquipmentEcharts')
            if (equipmentmyChart != null && equipmentmyChart != '' && equipmentmyChart != undefined) equipmentmyChart.dispose()

            equipmentmyChart = this.$echarts.init(chartDom)

            const data = await this.getEquipment()
@@ -472,7 +480,7 @@
                }
            })

            equipmentmyChart.setOption(this.initEquipmentOptions(data))
            equipmentmyChart.setOption(this.initEquipmentOptions(newData))

            if (newData.length > 1) {
                this.equipmentEchartsCarousel()
@@ -481,7 +489,6 @@
                equipmentmyChart.off('mouseover')
                equipmentmyChart.off('mouseout')
            }

        },

        // 现有设备options饼图数据
@@ -493,7 +500,7 @@
                    formatter: function (params) {
                        let tipHtml = ``

                        if ('carCount' in params.data) {
                        if ('carCount' in params.data || 'monitorCount' in params.data) {
                            tipHtml = `
                            ${params.marker} 
                            <strong style="color: ${params.color}">${params.data.name} ${params.data.value}台</strong>
@@ -505,7 +512,14 @@
                            <span style="margin-left:10px;color:#91cc75">摄像头：${params.data.monitorCount}台</span>
                            `
                        } else {
                            tipHtml = `${params.marker} <strong style="color: ${params.color}">${params.data.name} ${params.data.value}台</strong><br /><span style="color:#4caf50">正常：${params.data.working}台</span><br /><span style="color:#ccc">故障：${params.data.fault}台</span><br /><span style="margin-left:10px;color:#ccc">设备故障率：${Math.floor(params.data.fault / (params.data.working + params.data.fault) * 100)}%</span><br />`
                            tipHtml = `${params.marker} 
                            <strong style="color: ${params.color}">${params.data.name} ${params.data.value}台</strong>
                            <br />
                            <span style="color:#4caf50">在线：${params.data.working}台</span>
                            <br />
                            <span style="color:#ccc">离线：${params.data.fault}台</span>
                            <br />
                            <span style="margin-left:10px;color:#ccc">设备离线率：${Math.floor(params.data.fault / (params.data.working + params.data.fault) * 100)}%</span><br />`
                        }
                        return tipHtml
                    },
@@ -572,16 +586,7 @@
                                }
                                return colorList[params.dataIndex]
                            },
                            fontSize: fontSize(16),
                            normal: {
                                formatter (e) {
                                    if (e.data.value == 0) {
                                        e.data.emphasis.label.show = false
                                    } else {
                                        return `${e.data.name}`
                                    }
                                }
                            }
                            fontSize: fontSize(16)
                        },
                        itemStyle: {
                            normal: {

 src/views/layout/index.vue

@@ -2,7 +2,7 @@
 * @Author: shuishen 1109946754@qq.com
 * @Date: 2022-08-18 16:18:24
 * @LastEditors: shuishen 1109946754@qq.com
 * @LastEditTime: 2023-02-07 10:05:32
 * @LastEditTime: 2023-02-08 09:49:16
 * @FilePath: \srs-police-affairs\src\views\layout\index.vue
 * @Description: 
 * 
@@ -142,8 +142,8 @@
                    menuName: '运维管理',
                    openExternal: true,
                    // 内网
                    // path: 'http://10.141.11.11:8081/#/security/security'
                    path: 'http://192.168.0.201:1888/#/security/security'
                    path: 'http://10.141.11.11:8081/#/security/security'
                    // path: 'http://192.168.43.201:1888/#/security/security'
                }
            ],


 src/views/video/list.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-12 17:08:15
 * @LastEditTime: 2023-02-08 11:21:57
 * @FilePath: \srs-police-affairs\src\views\video\list.vue
 * @Description: 辖区管理
 * 
@@ -14,13 +14,7 @@
        <div v-show="boxShow" class="container-content">
            <div class="search-box">
                点位名称：
                <input
                    v-model="searchValue"
                    @input="searchChange"
                    type="text"
                    placeholder="请输入搜索条件"
                />
                <button @click="searchClick" class="el-icon-search"></button>
                <input v-model="searchValue" @input="searchChange" type="text" placeholder="请输入搜索条件" />
            </div>

            <div class="draw-btn">
@@ -37,79 +31,49 @@
                <button @click="changeRange" class="btn">确定</button>
            </div>
            <div v-show="searchValBoxShow" class="search-val-box">
                <div
                    @click="searchVlaClick(item)"
                    v-for="(item, index) in searchArray"
                    :key="index"
                >{{ item.name }}</div>
                <div @click="searchVlaClick(item)" v-for="(item, index) in searchArray" :key="index">{{ item.name }}
                </div>
            </div>

            <div class="down-tree">
                <el-scrollbar>
                    <el-tree :props="props" :load="loadNode" lazy @node-click="treeClick"></el-tree>
                    <el-tree v-show="searchLazyFlag" :props="props" :load="loadNode" lazy
                        @node-click="treeClick"></el-tree>

                    <el-tree v-show="searchLazyFlag == false" :data="searchTreeData" :props="defaultProps"
                        :default-expand-all="true" @node-click="treeClick"></el-tree>
                </el-scrollbar>
            </div>

            <div class="list-show" v-if="false">
                <div class="car-list">
                    <div class="list-box">
                        <el-table
                            :data="monitoringList"
                            style="width: 100%"
                        <el-table :data="monitoringList" style="width: 100%"
                            :header-cell-style="{ 'text-align': 'center', 'background-color': 'rgba(9, 40, 199, 0.5)', 'borderColor': '#324e75' }"
                            :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75' }"
                            @cell-click="rowClick"
                        >
                            <el-table-column
                                :show-overflow-tooltip="true"
                                prop="name"
                                label="点位名称"
                                min-width="35%"
                            ></el-table-column>
                            <el-table-column
                                :show-overflow-tooltip="true"
                                prop="pTZTypeText"
                                label="点位类型"
                                min-width="35%"
                            ></el-table-column>
                            <el-table-column
                                :show-overflow-tooltip="true"
                                prop="status"
                                label="状态"
                                min-width="30%"
                            >
                            :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75' }" @cell-click="rowClick">
                            <el-table-column :show-overflow-tooltip="true" prop="name" label="点位名称"
                                min-width="35%"></el-table-column>
                            <el-table-column :show-overflow-tooltip="true" prop="pTZTypeText" label="点位类型"
                                min-width="35%"></el-table-column>
                            <el-table-column :show-overflow-tooltip="true" prop="status" label="状态" min-width="30%">
                                <template slot-scope="scope">
                                    <div
                                        class="state-box"
                                        :class="{ online: scope.row.status == '1' }"
                                    ></div>
                                    <div class="state-box" :class="{ online: scope.row.status == '1' }"></div>
                                </template>
                            </el-table-column>
                        </el-table>
                    </div>
                    <div class="pages">
                        <el-pagination
                            background
                            layout="prev, pager, next"
                            :page-size="pagesize"
                            :page-count="pagesCount"
                            :current-page="currentPage"
                            pager-count="5"
                            @current-change="handleCurrentChange"
                        ></el-pagination>
                        <el-pagination background layout="prev, pager, next" :page-size="pagesize"
                            :page-count="pagesCount" :current-page="currentPage" pager-count="5"
                            @current-change="handleCurrentChange"></el-pagination>
                    </div>
                </div>
            </div>
        </div>

        <div class="search-content">
            <input
                v-model="searchExtensivelyValue"
                @input="searchExtensivelyChange"
                @focus="searchExtensivelyFocus"
                type="text"
                placeholder="请输入搜索条件"
            />
            <input v-model="searchExtensivelyValue" @input="searchExtensivelyChange" @focus="searchExtensivelyFocus"
                type="text" placeholder="请输入搜索条件" />
            <div class="clear" v-show="isShowClearBtn" @click="clearSearchValue" title="清空">
                <img src="../../../public/img/icon/clear.png" alt />
            </div>
@@ -117,39 +81,17 @@
        </div>
        <div v-show="searchExtensivelyValBoxShow" class="searchExtensively-val-box">
            <div>
                <div
                    @click="searchExtensivelyVlaClick(item)"
                    v-for="(item, index) in searchExtensivelyArray"
                    :key="index"
                >{{ item.name }}</div>
                <div @click="searchExtensivelyVlaClick(item)" v-for="(item, index) in searchExtensivelyArray"
                    :key="index">{{ item.name }}</div>
            </div>
        </div>

        <el-dialog
            :title="dialogTitle"
            :modal="false"
            :visible.sync="dialogVisible"
            :before-close="dialogBeforeClose"
            :close-on-click-modal="true"
            class="car-video-box"
        >
            <video
                id="videoElement"
                autoplay
                controls
                width="100%"
                height="100%"
                style="object-fit: fill"
            ></video>
        <el-dialog :title="dialogTitle" :modal="false" :visible.sync="dialogVisible" :before-close="dialogBeforeClose"
            :close-on-click-modal="true" class="car-video-box">
            <video id="videoElement" autoplay controls width="100%" height="100%" style="object-fit: fill"></video>
        </el-dialog>
        <el-dialog
            :title="drawDialogTitle"
            :modal="false"
            :visible.sync="drawDialogVisible"
            :before-close="drawDialogBeforeClose"
            :close-on-click-modal="true"
            class="video-draw-box"
        >
        <el-dialog :title="drawDialogTitle" :modal="false" :visible.sync="drawDialogVisible"
            :before-close="drawDialogBeforeClose" :close-on-click-modal="true" class="video-draw-box">
            <input type="text" v-model="drawName" placeholder="请输入绘制线或面的名称" />
            <button @click="saveDrawInfo">保存</button>
        </el-dialog>
@@ -159,13 +101,15 @@
<script>
import EntityDraw from "@/utils/EntityDraw.js"
import { listQuery, accurateSearch } from "@/utils/search.js"
import { getVideoList, getDevices, getRegionList, insertRegionSaveList, getTreeDevices } from '@/api/video/index.js'
import { getVideoList, getDevices, getRegionList, insertRegionSaveList, getTreeDevices, getSearchTreeDevices } from '@/api/video/index.js'
import { getSearchExtensively } from '@/api/dept/index.js'
import flvjs from 'flv.js'

let graphicLayer = null

export default {
    inject: ['userInfo'],

    data () {
        return {
            currentPage: 1,
@@ -195,12 +139,16 @@
            props: {
                label: 'name',
                children: 'zones',
                isLeaf: (data, node) => {
                    if (data.parent == false) {
                        return true
                    }
                }
                isLeaf: 'leaf'
            },

            defaultProps: {
                children: "children", //代表children为子级
                label: "name", //根据name渲染tree列表
            },

            searchLazyFlag: true,
            searchTreeData: []
        }
    },

@@ -324,31 +272,21 @@
            this.drawName = ''
        },

        searchChange () {
            if (this.searchValue == '') {
                this.searchValBoxShow = false
                this.searchArray = []
                this.getVideoList(this.currentPage, this.pagesize, this.searchValue)
                this.$message({
                    message: '请输入搜索内容',
                    type: 'warning'
                })
            } else {
                this.searchArray = listQuery(this.monitoringSaveList, this.searchValue, 'name')
                this.searchValBoxShow = true
                this.getVideoList(this.currentPage, this.pagesize, this.searchValue)
            }
        },
        searchChange (e) {
            if (e.target.value.trim() != '') {
                this.searchLazyFlag = false

        searchClick () {
            if (this.searchValue != '') {
                this.searchValBoxShow = false
                this.getVideoList(this.currentPage, this.pagesize, this.searchValue)
            } else {
                this.$message({
                    message: '请输入搜索内容',
                    type: 'warning'
                this.searchTreeData = []
                getSearchTreeDevices({
                    deviceId: '36110000002009999000',
                    parentId: '361102',
                    deptId: this.userInfo.dept_id,
                    name: this.searchValue.trim()
                }).then(res => {
                    this.searchTreeData = res.data.data
                })
            } else {
                this.searchLazyFlag = true
            }
        },

@@ -591,62 +529,71 @@
        },

        async loadNode (node, resolve) {
            if (node.level === 0) {
                return resolve([{ name: '信州分局' }])
            let type = Number(node.level) + 1

            let data = null

            let parentId = null

            if (type == 1 || type == 2) {
                parentId = 361102
            } else {
                parentId = node.data.id
            }
            if (node.level === 1) {
                let data = []
                await getTreeDevices({ page: 1, count: 100, parentId: 361102, onlyCatalog: false }).then(res => {
                    data = res.data.data.list
                })
                return resolve(data)
            }
            if (node.level > 1) {
                let data = []
                await getTreeDevices({ page: 1, count: 100, parentId: node.data.id, onlyCatalog: false }).then(res => {
                    data = res.data.data.list
                })
                return resolve(data)
            }

            await getTreeDevices({
                deviceId: '36110000002009999000',
                parentId,
                deptId: this.userInfo.dept_id,
                type,
                sourceId: type == 4 ? '' : '36110202',
            }).then(res => {
                data = res.data.data

                data.forEach(item => item.leaf = !item.parent)
            })

            return resolve(data)
        },

        async treeClick (node) {
            if (node.parent == false) {
                console.log(node, node.name, node.id, node.basicData.channelId, node.basicData.longitude, node.basicData.latitude)
                this.$EventBus.$emit('toPosition', {
                    siteJd: node.basicData.longitude,
                    siteWd: node.basicData.latitude,
                    siteGd: 600,
                })
                this.$EventBus.$emit('mapClearLayer', {
                    layerName: 'searchLayer',
                    type: 'VectorLayer'
                })
                this.$EventBus.$emit('layerPointAdd', {
                    layerName: 'searchLayer',
                    type: 'label',
                    params: {
                        lng: node.basicData.longitude,
                        lat: node.basicData.latitude,
                        alt: 0,
                        text: node.name
                    }
                })
                this.$EventBus.$emit('layerPointAdd', {
                    layerName: 'searchLayer',
                    type: "billboard",
                    params: {
                        name: node.name,
                        lng: node.basicData.longitude,
                        lat: node.basicData.latitude,
                        alt: 100,
                        url: '/img/icon/video.png',
                        channelId: node.id
                    },
                    incident: this.siteClick
                })
            if (node.parent == true) return

            }
            this.$EventBus.$emit('toPosition', {
                siteJd: node.longitude,
                siteWd: node.latitude,
                siteGd: 600,
            })

            this.$EventBus.$emit('mapClearLayer', {
                layerName: 'searchLayer',
                type: 'VectorLayer'
            })

            this.$EventBus.$emit('layerPointAdd', {
                layerName: 'searchLayer',
                type: 'label',
                params: {
                    lng: node.longitude,
                    lat: node.latitude,
                    alt: 0,
                    text: node.name
                }
            })

            this.$EventBus.$emit('layerPointAdd', {
                layerName: 'searchLayer',
                type: "billboard",
                params: {
                    name: node.name,
                    lng: node.longitude,
                    lat: node.latitude,
                    alt: 100,
                    url: '/img/icon/video.png',
                    channelId: node.id
                },
                incident: this.siteClick
            })
        },
    },

@@ -698,14 +645,12 @@

            input {
                flex: 1;
                height: 100%;
                font-size: 18px;
                font-size: 16px;
                text-indent: 1em;
                color: #ffffff;
                background-color: rgba(24, 79, 202, 0.6);
                // border: 1px solid rgb(0, 92, 169);
                border: 1px solid rgb(24, 79, 202);
                border-radius: 20px 0 0 20px;
            }

            input:focus {
@@ -749,7 +694,7 @@
            border-radius: 10px;
            overflow-y: auto;

            & > div {
            &>div {
                height: 100%;
                padding: 0 10px;
                line-height: 36px;
@@ -823,7 +768,7 @@
        .list-show {
            flex: 1;

            & > div {
            &>div {
                height: 100%;
                display: flex;
                flex-direction: column;
@@ -857,12 +802,15 @@
        }

        .down-tree {
            height: 100%;
            flex: 1;
            overflow: hidden;

            :deep(.el-tree-node.is-expanded > .el-tree-node__children) {
                display: inline;
            }

            :deep(.el-scrollbar) {
                height: calc(100% - 80px);
                height: 100%;
            }
        }
    }
@@ -943,7 +891,7 @@
        border-radius: 10px;
        overflow: hidden;

        & > div {
        &>div {
            height: 100%;
            overflow-y: auto;