Merge branch 'master' of http://s16s652780.51mypc.cn:49896/r/srs-police-aff...

guanqb

2023-05-08 dec962bd3a5faae7e15f9a244803ce53ce40d5c8

Merge branch 'master' of http://s16s652780.51mypc.cn:49896/r/srs-police-affairs

 src/api/home/index.js

@@ -2,7 +2,7 @@
 * @Author: shuishen 1109946754@qq.com
 * @Date: 2022-12-27 14:19:19
 * @LastEditors: shuishen 1109946754@qq.com
 * @LastEditTime: 2023-02-11 14:54:32
 * @LastEditTime: 2023-05-08 09:55:58
 * @FilePath: \srs-police-affairs\src\api\home\index.js
 * @Description: 
 * 
@@ -102,7 +102,7 @@
    })
}

// 案件统计接口查询
// 案件统计数量接口查询
export const getCaseAll = (start, end, jjdwbh = '') => {
    return request({
        url: `/api/alarm/alarm/statisticsAlarm`,
@@ -115,6 +115,20 @@
    })
}

// 案件统计排行接口查询
export const getCaseRanking = (start, end, dwbh = '') => {
    return request({
        url: `/api/alarm/alarm/getAlarmVillageOrderList`,
        method: 'get',
        params: {
            start,
            end,
            dwbh
        }
    })
}


// 获取设备统计数据 
export const getEquipment = (jjdwbh = '') => {
    return request({

 src/styles/media/index.scss

@@ -225,12 +225,6 @@

                            }

                            .alert-box {
                                .echarts-box {
                                    height: 100%;
                                }
                            }

                            .person-box {
                                .back {
                                    top: countSizeVh(102);

 src/views/activity/index.vue

@@ -2,7 +2,7 @@
 * @Author: shuishen 1109946754@qq.com
 * @Date: 2023-03-24 16:36:55
 * @LastEditors: shuishen 1109946754@qq.com
 * @LastEditTime: 2023-04-18 20:12:05
 * @LastEditTime: 2023-05-08 09:37:39
 * @FilePath: \srs-police-affairs\src\views\activity\index.vue
 * @Description: 
 * 
@@ -17,39 +17,55 @@
                <div>
                    <div class="category">名称：</div>
                    <div class="category-value search-activity">
                        <el-input size="small" placeholder="请输入…" v-model="searchActivity" @change="activeSearch" clearable>
                        </el-input>
                        <el-input
                            size="small"
                            placeholder="请输入…"
                            v-model="searchActivity"
                            @change="activeSearch"
                            clearable
                        ></el-input>
                    </div>
                </div>
            </div>

            <div class="result-content">
                <div class="table-box">
                    <el-collapse v-show="activityList.length > 0" v-model="activeActivityIndex" accordion
                        @change="handleActivityChange" class="activity-list">
                        <el-collapse-item v-for="item in activityList" :name="item.id" :key="item.id">
                            <template slot="title">
                                {{ item.name }}({{ item.plotType == 1 ? '二维' : '三维' }})
                            </template>
                    <el-collapse
                        v-show="activityList.length > 0"
                        v-model="activeActivityIndex"
                        accordion
                        @change="handleActivityChange"
                        class="activity-list"
                    >
                        <el-collapse-item
                            v-for="item in activityList"
                            :name="item.id"
                            :key="item.id"
                        >
                            <template
                                slot="title"
                            >{{ item.name }}({{ item.plotType == 1 ? '二维' : '三维' }})</template>
                            <el-collapse v-model="activeActivityElementIndex" accordion>
                                <el-collapse-item title="要素资源" :name="yszy">
                                    <el-collapse v-model="elementPoliceIndex" accordion>
                                        <el-collapse-item title="警车" :name="jc">
                                            <ul>
                                                <li v-for="carItem in chooseActivityPoliceCarList" :key="carItem.id"
                                                    @click="carOrPoliceItemClick(carItem.position, 'point')">
                                                    {{ carItem.serialNumber }}
                                                </li>
                                                <li
                                                    v-for="carItem in chooseActivityPoliceCarList"
                                                    :key="carItem.id"
                                                    @click="carOrPoliceItemClick(carItem.position, 'point')"
                                                >{{ carItem.serialNumber }}</li>
                                            </ul>
                                        </el-collapse-item>
                                    </el-collapse>
                                    <el-collapse v-model="elementPoliceCarIndex" accordion>
                                        <el-collapse-item title="警员" :name="jy">
                                            <ul>
                                                <li v-for="policeItem in chooseActivityPoliceManList" :key="policeItem.id"
                                                    @click="carOrPoliceItemClick(policeItem.position, 'point')">
                                                    {{ policeItem.policeName }}
                                                </li>
                                                <li
                                                    v-for="policeItem in chooseActivityPoliceManList"
                                                    :key="policeItem.id"
                                                    @click="carOrPoliceItemClick(policeItem.position, 'point')"
                                                >{{ policeItem.policeName }}</li>
                                            </ul>
                                        </el-collapse-item>
                                    </el-collapse>
@@ -57,8 +73,11 @@
                                    <el-collapse v-model="elementCustomIndex" accordion>
                                        <el-collapse-item title="自定义图片标注" :name="wxrw">
                                            <ul>
                                                <li v-for="(item, index) in customList" :key="item.id"
                                                    @click="carOrPoliceItemClick(item.position, 'people')">
                                                <li
                                                    v-for="(item, index) in customList"
                                                    :key="item.id"
                                                    @click="carOrPoliceItemClick(item.position, 'people')"
                                                >
                                                    {{ item.remark && item.remark.trim() != '' ? item.remark :
                                                        `自定义图片标注${index + 1}` }}
                                                </li>
@@ -69,24 +88,33 @@
                                    <el-collapse v-model="elementNormalIndex" accordion>
                                        <el-collapse-item title="其他" :name="wxrw">
                                            <ul>
                                                <li v-for="(item, index) in restList" :key="item.id"
                                                    @click="carOrPoliceItemClick(item.position, 'people')">
                                                <li
                                                    v-for="(item, index) in restList"
                                                    :key="item.id"
                                                    @click="carOrPoliceItemClick(item.position, 'people')"
                                                >
                                                    {{ item.remark && item.remark.trim() != '' ? item.remark :
                                                        restCurType(item, index) }}
                                                </li>
                                            </ul>
                                        </el-collapse-item>
                                    </el-collapse>

                                </el-collapse-item>
                            </el-collapse>
                            <el-collapse v-model="activeActivityArrowIndex" accordion>
                                <el-collapse-item title="作战标绘" :name="zzbh">
                                    <el-collapse v-model="attackArrowIndex" accordion v-show="item.plotType == 1">
                                    <el-collapse
                                        v-model="attackArrowIndex"
                                        accordion
                                        v-show="item.plotType == 1"
                                    >
                                        <el-collapse-item title="进攻箭头" :name="jgjt">
                                            <ul>
                                                <li v-for="(attackItem, index) in attackArrowList" :key="attackItem.id"
                                                    @click="carOrPoliceItemClick(attackItem.position, 'arrow')">
                                                <li
                                                    v-for="(attackItem, index) in attackArrowList"
                                                    :key="attackItem.id"
                                                    @click="carOrPoliceItemClick(attackItem.position, 'arrow')"
                                                >
                                                    {{ attackItem.remark && attackItem.remark.trim() != '' ?
                                                        attackItem.remark : `进攻箭头${index +
                                                        1}` }}
@@ -95,11 +123,18 @@
                                        </el-collapse-item>
                                    </el-collapse>

                                    <el-collapse v-model="doubleArrowIndex" accordion v-show="item.plotType == 1">
                                    <el-collapse
                                        v-model="doubleArrowIndex"
                                        accordion
                                        v-show="item.plotType == 1"
                                    >
                                        <el-collapse-item title="双箭头" :name="sjt">
                                            <ul>
                                                <li v-for="(doubleItem, index) in doubleArrowList" :key="doubleItem.id"
                                                    @click="carOrPoliceItemClick(doubleItem.position, 'arrow')">
                                                <li
                                                    v-for="(doubleItem, index) in doubleArrowList"
                                                    :key="doubleItem.id"
                                                    @click="carOrPoliceItemClick(doubleItem.position, 'arrow')"
                                                >
                                                    {{ doubleItem.remark && doubleItem.remark.trim() != '' ?
                                                        doubleItem.remark : `双箭头${index
                                                        + 1}` }}
@@ -107,11 +142,18 @@
                                            </ul>
                                        </el-collapse-item>
                                    </el-collapse>
                                    <el-collapse v-model="fineArrowIndex" accordion v-show="item.plotType == 1">
                                    <el-collapse
                                        v-model="fineArrowIndex"
                                        accordion
                                        v-show="item.plotType == 1"
                                    >
                                        <el-collapse-item title="直箭头" :name="zjt">
                                            <ul>
                                                <li v-for="(fineItem, index) in fineArrowList" :key="fineItem.id"
                                                    @click="carOrPoliceItemClick(fineItem.position, 'arrow')">
                                                <li
                                                    v-for="(fineItem, index) in fineArrowList"
                                                    :key="fineItem.id"
                                                    @click="carOrPoliceItemClick(fineItem.position, 'arrow')"
                                                >
                                                    {{ fineItem.remark && fineItem.remark.trim() != '' ? fineItem.remark :
                                                        `直箭头${index +
                                                        1}` }}
@@ -119,12 +161,18 @@
                                            </ul>
                                        </el-collapse-item>
                                    </el-collapse>
                                    <el-collapse v-model="tailedAttackArrowIndex" accordion v-show="item.plotType == 1">
                                    <el-collapse
                                        v-model="tailedAttackArrowIndex"
                                        accordion
                                        v-show="item.plotType == 1"
                                    >
                                        <el-collapse-item title="燕尾箭头" :name="ywjt">
                                            <ul>
                                                <li v-for="(tailedItem, index) in tailedAttackArrowList"
                                                <li
                                                    v-for="(tailedItem, index) in tailedAttackArrowList"
                                                    :key="tailedItem.id"
                                                    @click="carOrPoliceItemClick(tailedItem.position, 'arrow')">
                                                    @click="carOrPoliceItemClick(tailedItem.position, 'arrow')"
                                                >
                                                    {{ tailedItem.remark && tailedItem.remark.trim() != '' ?
                                                        tailedItem.remark : `燕尾箭头${index
                                                        + 1}` }}
@@ -135,8 +183,11 @@
                                    <el-collapse v-model="polygonArrowIndex" accordion>
                                        <el-collapse-item title="多边形" :name="dbx">
                                            <ul>
                                                <li v-for="(polygonItem, index) in polygonList" :key="polygonItem.id"
                                                    @click="carOrPoliceItemClick(polygonItem.position, 'polygon')">
                                                <li
                                                    v-for="(polygonItem, index) in polygonList"
                                                    :key="polygonItem.id"
                                                    @click="carOrPoliceItemClick(polygonItem.position, 'polygon')"
                                                >
                                                    {{ polygonItem.remark && polygonItem.remark.trim() != '' ?
                                                        polygonItem.remark :
                                                        `多边形${index + 1}` }}
@@ -147,8 +198,11 @@
                                    <el-collapse v-model="borkenlineIndex" accordion>
                                        <el-collapse-item title="折线" :name="dbx">
                                            <ul>
                                                <li v-for="(polygonItem, index) in borkenList" :key="polygonItem.id"
                                                    @click="carOrPoliceItemClick(polygonItem.position, 'polygon')">
                                                <li
                                                    v-for="(polygonItem, index) in borkenList"
                                                    :key="polygonItem.id"
                                                    @click="carOrPoliceItemClick(polygonItem.position, 'polygon')"
                                                >
                                                    {{ polygonItem.remark && polygonItem.remark.trim() != '' ?
                                                        polygonItem.remark : `折线${index
                                                        + 1}` }}
@@ -161,8 +215,11 @@
                            <el-collapse v-model="activeActivityLineIndex" accordion>
                                <el-collapse-item title="巡逻路线" :name="xllx">
                                    <ul>
                                        <li v-for="(lineItem, index) in chooseActivityLineList" :key="lineItem.id"
                                            @click="carOrPoliceItemClick(lineItem.polygonPositionStr, 'line')">
                                        <li
                                            v-for="(lineItem, index) in chooseActivityLineList"
                                            :key="lineItem.id"
                                            @click="carOrPoliceItemClick(lineItem.polygonPositionStr, 'line')"
                                        >
                                            {{ lineItem.remark && lineItem.remark.trim() != '' ? lineItem.remark :
                                                `路线${index + 1}` }}
                                        </li>
@@ -175,15 +232,26 @@
                    <div v-show="activityList == 0" class="no-data">暂无数据</div>
                </div>
                <div class="pages all-pagination-sty">
                    <el-pagination background layout="prev, pager, next" :page-size="pagesize" :page-count="pagesCount"
                        :current-page="currentPage" @current-change="handleCurrentChange"></el-pagination>
                    <el-pagination
                        background
                        layout="prev, pager, next"
                        :page-size="pagesize"
                        :page-count="pagesCount"
                        :current-page="currentPage"
                        @current-change="handleCurrentChange"
                    ></el-pagination>
                </div>
            </div>
        </div>

        <div class="second-container" :class="{ 'spread': boxShow, 'take-back': !boxShow }">
            <el-tree :data="treeData" show-checkbox node-key="id" @check="treeCheckClick"
                @check-change="treeCheckChange"></el-tree>
            <el-tree
                :data="treeData"
                show-checkbox
                node-key="id"
                @check="treeCheckClick"
                @check-change="treeCheckChange"
            ></el-tree>
        </div>

        <map-search-box></map-search-box>
@@ -757,7 +825,7 @@
            if (data != []) {
                data.some(item => {
                    return item.label == '视频监控'
                }) ? this.iconImageShowOrHidden('/img/icon/camera.png', '', cameraList, 'activityCameraLayers') : this.clearLayerIconForMap('activityCameraLayers')
                }) ? this.iconImageShowOrHidden('/img/icon/video.png', '/img/icon/video-off.png', cameraList, 'activityCameraLayers') : this.clearLayerIconForMap('activityCameraLayers')

                data.some(item => {
                    return item.label == '警车'
@@ -809,6 +877,12 @@
                if (data.length > 0) {
                    data.forEach(item => {
                        if (item.longitude && item.latitude) {
                            let url = item.clockStatus == 0 ? img : imgOk

                            if (img == '/img/icon/video.png') {
                                url = item.status == 1 ? '/img/icon/video.png' : '/img/icon/video-off.png'
                            }

                            this.$EventBus.$emit('layerPointAdd', {
                                layerName: layerName,
                                type: "billboard",
@@ -818,7 +892,7 @@
                                    lng: item.longitude,
                                    lat: item.latitude,
                                    alt: 1,
                                    url: item.clockStatus == 0 ? img : imgOk
                                    url
                                },
                            })
                        }
@@ -1277,12 +1351,8 @@
        left: 10px;
    }



    .item-new-width {
        width: 25vw;
    }


}
</style>

 src/views/home/components/rightContainer.vue

@@ -7,18 +7,33 @@
                </div>

                <div class="table-box" v-show="!showMJL">
                    <el-table size="small" :height="tableHeight" :data="schedulingList" style="width: 100%;"
                    <el-table
                        size="small"
                        :height="tableHeight"
                        :data="schedulingList"
                        style="width: 100%;"
                        :header-cell-style="{ 'text-align': 'center' }"
                        :cell-style="{ 'text-align': 'center', borderColor: '#324e75' }" :row-class-name="tableRowClassName"
                        :empty-text="schedulingNoDataText" v-loading="schedulingLoading" element-loading-text="拼命加载中"
                        element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.5)">
                        :cell-style="{ 'text-align': 'center', borderColor: '#324e75' }"
                        :row-class-name="tableRowClassName"
                        :empty-text="schedulingNoDataText"
                        v-loading="schedulingLoading"
                        element-loading-text="拼命加载中"
                        element-loading-spinner="el-icon-loading"
                        element-loading-background="rgba(0, 0, 0, 0.5)"
                    >
                        <el-table-column prop="dept" label="值班单位"></el-table-column>
                        <el-table-column prop="person" label="姓名"></el-table-column>
                        <el-table-column prop="contact" label="联系方式"></el-table-column>
                    </el-table>
                    <div class="pointList" v-if="schedulingList == []">
                        <el-tooltip class="item" effect="dark" :content="item.dept" placement="top"
                            v-for="(item, index) in schedulingDeptList" :key="index">
                        <el-tooltip
                            class="item"
                            effect="dark"
                            :content="item.dept"
                            placement="top"
                            v-for="(item, index) in schedulingDeptList"
                            :key="index"
                        >
                            <div class="point" @click="getSchedlingList(item)"></div>
                        </el-tooltip>
                    </div>
@@ -27,36 +42,37 @@
                <div class="duty-information-box" v-show="showMJL">
                    <div>
                        <div>
                            <span>
                                值班
                            </span>
                            <span>值班</span>
                        </div>
                        <div>
                            <span>
                                徐星逸，任圣日，娄永攀，蔡善龙，陈小强，刘开勇，梅祥，吕镇，付建冬
                            </span>
                            <span>徐星逸，任圣日，娄永攀，蔡善龙，陈小强，刘开勇，梅祥，吕镇，付建冬</span>
                        </div>
                    </div>
                    <div>
                        <div>
                            <span>
                                副班、巡逻
                            </span>
                            <span>副班、巡逻</span>
                        </div>
                        <div>
                            <span>
                                章正椿，夏文翔，叶江明，黄俊龙，苏茯林，王顺祥
                            </span>
                            <span>章正椿，夏文翔，叶江明，黄俊龙，苏茯林，王顺祥</span>
                        </div>
                    </div>
                </div>
            </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>
@@ -66,22 +82,60 @@
                <div class="title">
                    警情统计
                    <div class="timer">
                        <el-date-picker :clearable="false" v-model="eventTime" type="daterange" align="right" unlink-panels
                            range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" @change="caseTimeChange"
                            :picker-options="pickerOptions"></el-date-picker>
                        <el-date-picker
                            :clearable="false"
                            v-model="eventTime"
                            type="daterange"
                            align="right"
                            unlink-panels
                            range-separator="至"
                            start-placeholder="开始日期"
                            end-placeholder="结束日期"
                            @change="caseTimeChange"
                            :picker-options="pickerOptions"
                        ></el-date-picker>
                    </div>
                </div>
                <el-main v-loading="eventChangeEchartsLoading" element-loading-text="拼命加载中"
                    element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.5)">
                <el-main
                    v-loading="eventChangeEchartsLoading"
                    element-loading-text="拼命加载中"
                    element-loading-spinner="el-icon-loading"
                    element-loading-background="rgba(0, 0, 0, 0.5)"
                >
                    <div class="sub-tab">
                        <div
                            class="tab"
                            :class="{ 'select-on-tab': caseInfoType == 0 }"
                            @click="initEventChangeEcharts(0)"
                        >
                            <div class="tab-title-small">警情变化趋势</div>
                        </div>
                        <div
                            class="tab"
                            :class="{ 'select-on-tab': caseInfoType == 1 }"
                            @click="initEventChangeEcharts(1)"
                        >
                            <div class="tab-title-small">警情排行</div>
                        </div>
                    </div>
                    <div id="EventChangeEcharts" class="echarts-box"></div>
                </el-main>
            </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>
@@ -117,13 +171,25 @@
        <div class="crowd-box" ref="crowdBox">
            <div class="box">
                <div class="title">现有设备</div>
                <el-main v-loading="equipmentEchartsLoading" element-loading-text="拼命加载中"
                    element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.5)">
                <el-main
                    v-loading="equipmentEchartsLoading"
                    element-loading-text="拼命加载中"
                    element-loading-spinner="el-icon-loading"
                    element-loading-background="rgba(0, 0, 0, 0.5)"
                >
                    <div class="sub-tab">
                        <div class="tab" :class="{ 'select-on-tab': linetype == 0 }" @click="initEquipmentEcharts(0)">
                        <div
                            class="tab"
                            :class="{ 'select-on-tab': linetype == 0 }"
                            @click="initEquipmentEcharts(0)"
                        >
                            <div class="tab-title-small">设备种类</div>
                        </div>
                        <div class="tab" :class="{ 'select-on-tab': linetype == 1 }" @click="initEquipmentEcharts(1)">
                        <div
                            class="tab"
                            :class="{ 'select-on-tab': linetype == 1 }"
                            @click="initEquipmentEcharts(1)"
                        >
                            <div class="tab-title-small">设备状态</div>
                        </div>
                    </div>
@@ -132,10 +198,19 @@
            </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>
@@ -166,7 +241,7 @@
import { getSchedulingList, getSchedulingDeptList } from "@/api/home/index.js"
import { fontSize } from "@/utils/fontSize.js"

import { getCaseAll, getEquipment } from "@/api/home/index.js"
import { getCaseAll, getCaseRanking, getEquipment } from "@/api/home/index.js"

const timeEvents = []

@@ -219,6 +294,7 @@
            showMJL: false,
            originTitle: ['值班', '副班、巡逻'],
            transTitle: [{ label: '人员', width: '28%', align: 'center' }, { label: '人员', width: '', align: 'left' },],
            caseInfoType: 0
        }
    },

@@ -280,7 +356,7 @@
        getHomeAllData (id = "") {
            this.policeStaionID = id

            this.initEventChangeEcharts()
            this.initEventChangeEcharts(this.caseInfoType)

            this.initEquipmentEcharts(this.linetype)

@@ -290,6 +366,7 @@
            }

            rightTiming = setInterval(async () => {
                this.initEventChangeEcharts(this.caseInfoType)
                this.initEquipmentEcharts(this.linetype)
            }, 600000)
        },
@@ -408,11 +485,12 @@

        // 获取警情统计值
        getCaseAll (start, end) {
            const caseAll = getCaseAll(
            getCaseAll(
                start,
                end,
                this.policeStaionID != "" ? this.policeStaionID : this.userInfo.dept_id
            ).then((res) => {
                let obj = {}
                if (res.data.timeList) {
                    let yDataList = {}
                    yDataList.dqList = res.data.dqList.reduce(
@@ -444,44 +522,131 @@
                        []
                    )
                    let xData = res.data.timeList.map(item => item.slice(5, 10))
                    return { xData, yDataList }
                    obj = { xData, yDataList }
                } else {
                    return { xData: [], yDataList: {} }
                    obj = { xData: [], yDataList: {} }
                }

            })
                eventchangemychart.setOption(this.initEventChangeOption(obj.xData, obj.yDataList))

            return caseAll
                setTimeout(() => {
                    this.eventChangeEchartsLoading = false
                }, 500)
            })
        },

        // 初始化警情统计
        async initEventChangeEcharts () {
        // 获取警情排行统计值
        getCaseRanking (start, end) {
            const caseAll = getCaseRanking(
                start,
                end,
                this.policeStaionID != "" ? this.policeStaionID : this.userInfo.dept_id
            ).then((res) => {
                let data = []

                if (res.data.data) {
                    res.data.data.push({
                        name: 123,
                        count: 1
                    })

                    res.data.data.push({
                        name: 456,
                        count: 1
                    })

                    res.data.data.push({
                        name: 22,
                        count: 1
                    })

                    res.data.data.push({
                        name: 33,
                        count: 1
                    })

                    res.data.data.push({
                        name: 55,
                        count: 1
                    })

                    res.data.data.push({
                        name: 66,
                        count: 1
                    })

                    res.data.data = res.data.data.sort((a, b) => a.value - b.value)
                    res.data.data = res.data.data.map((item, index) => {
                        item.value = item.count

                        if (index == 0) {
                            item.itemStyle = {
                                color: '#EB3C5A'
                            }
                        } else if (index == 1) {
                            item.itemStyle = {
                                color: '#FA8331'
                            }
                        } else if (index == 2) {
                            item.itemStyle = {
                                color: '#F7B833'
                            }
                        } else {
                            item.itemStyle = {
                                color: '#395FFD'
                            }
                        }

                        return item
                    }).sort((a, b) => b.value - a.value)

                    console.log(res.data.data, 465)

                    data = res.data.data
                } else {
                    data = []
                }

                eventchangemychart.setOption(this.initRankingOption(data))

                setTimeout(() => {
                    this.eventChangeEchartsLoading = false
                }, 500)
            })
        },

        // 初始化警情数量统计
        async initEventChangeEcharts (type) {
            this.caseInfoType = type
            this.eventChangeEchartsLoading = true
            var chartDom = document.getElementById("EventChangeEcharts")

            if (
                eventchangemychart != null &&
                eventchangemychart != "" &&
                eventchangemychart != undefined
            )
            ) {

                eventchangemychart.clear()
                eventchangemychart.dispose()

            }

            var chartDom = document.getElementById("EventChangeEcharts")
            eventchangemychart = this.$echarts.init(chartDom)

            const date = this.eventTime.map((item) => {
                return this.dateFormat(item)
            })

            const optionsData = await this.getCaseAll(date[0], date[1])
            if (type == 0) {
                this.getCaseAll(date[0], date[1])
            } else {
                this.getCaseRanking(date[0], date[1])
            }

            eventchangemychart.setOption(this.initEventChangeOption(optionsData.xData, optionsData.yDataList))

            setTimeout(() => {
                this.eventChangeEchartsLoading = false
            }, 500)
        },

        // 警情统计的options
        // 警情数量统计的options
        initEventChangeOption (xData, yDataList) {
            let option
            if (xData.length == 0) {
@@ -607,6 +772,147 @@
                        bottom: "4%",
                        containLabel: true,
                    },
                }
            }

            return option
        },

        // 警情排行统计的options
        initRankingOption (dataArr) {
            let option
            if (dataArr.length == 0) {
                //暂无数据
                option = {
                    title: {
                        text: "暂无警情排行数据",
                        x: "center",
                        y: "center",
                        textStyle: {
                            color: "#fff",
                            fontSize: fontSize(14),
                            fontWeight: "normal",
                        },
                    },
                }
            } else {
                let seriesData = dataArr.map(item => {
                    return { value: item.value, itemStyle: item.itemStyle }
                })
                option = {
                    tooltip: {
                        trigger: "item",
                        formatter:
                            ' <span style="display: inline-block; margin-right: 4px; border-radius: 10px; width: 10px; height: 10px;background-color: #91cc75;"></span> {b0}<strong style="margin-left:10px;color:#5c7bd9">{c0}起</strong>',
                    },
                    xAxis: {
                        type: "value",
                        splitLine: { show: false },
                        axisLabel: { show: false },
                        axisTick: { show: false },
                        axisLine: { show: false }
                    },
                    yAxis: [
                        {
                            type: "category",
                            inverse: true,
                            axisLine: { show: false },
                            axisTick: { show: false },
                            data: dataArr.map((item) => item.name),
                            axisLabel: {
                                rich: {
                                    nt1: {
                                        color: "#fff",
                                        backgroundColor: '#EB3B5A',
                                        width: fontSize(12),
                                        height: fontSize(12),
                                        fontSize: fontSize(10),
                                        align: "center",
                                        borderRadius: fontSize(50),
                                        padding: [0, 1, 2, 1]
                                    },
                                    nt2: {
                                        color: "#fff",
                                        backgroundColor: '#FA8231',
                                        width: fontSize(12),
                                        height: fontSize(12),
                                        fontSize: fontSize(10),
                                        align: "center",
                                        borderRadius: fontSize(50),
                                        padding: [0, 1, 2, 1]
                                    },
                                    nt3: {
                                        color: "#fff",
                                        backgroundColor: '#F7B731',
                                        width: fontSize(12),
                                        height: fontSize(12),
                                        fontSize: fontSize(10),
                                        align: "center",
                                        borderRadius: fontSize(50),
                                        padding: [0, 1, 2, 1]
                                    },
                                    nt: {
                                        color: "#fff",
                                        backgroundColor: '#00a9c8',
                                        width: fontSize(12),
                                        height: fontSize(12),
                                        fontSize: fontSize(10),
                                        align: "center",
                                        borderRadius: fontSize(50),
                                        padding: [0, 1, 2, 1]
                                    }
                                },
                                formatter: function (value, index) {
                                    let idx = index + 1
                                    if (idx <= 3) {
                                        return ["{nt" + idx + "|" + idx + "}"].join("\n")
                                    } else {
                                        return ["{nt|" + idx + "}"].join("\n")
                                    }
                                }
                            }
                        },
                        {//名称
                            type: 'category',
                            offset: -10,
                            position: "left",
                            axisLine: { show: false },
                            axisTick: { show: false },
                            axisLabel: {
                                color: '#fff',
                                align: "left",
                                verticalAlign: "bottom",
                                lineHeight: fontSize(24),
                                fontSize: fontSize(10)
                            },
                            data: dataArr.reverse().map((item) => item.name),
                        },
                    ],
                    series: [
                        {
                            zlevel: 1,
                            type: "bar",
                            barWidth: fontSize(10),
                            data: seriesData,
                            itemStyle: {
                                normal: {
                                    barBorderRadius: fontSize(5)
                                }
                            },
                            label: {
                                show: true,
                                fontSize: fontSize(10),
                                color: "#fff"
                            }
                        }
                    ],
                    grid: {
                        top: "3%",
                        left: "-20%",
                        right: "2%",
                        bottom: "3%",
                        containLabel: true,
                    }
                }
            }

@@ -1034,7 +1340,6 @@
        //     margin-left: 8px;
        // }


        :deep(.el-main) {
            padding: 0;
        }
@@ -1206,7 +1511,6 @@
                    width: 72%;
                    text-align: left;
                }

            }
        }


 src/views/police/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-05-05 10:58:05
 * @LastEditTime: 2023-05-08 09:30:10
 * @FilePath: \srs-police-affairs\src\views\police\index.vue
 * @Description: 辖区管理
 * 
@@ -442,7 +442,7 @@
                                type: 'billboard',
                                params: {
                                    ...item,
                                    url: '/img/icon/camera.png',
                                    url: item.status == 1 ? '/img/icon/video.png' : '/img/icon/video-off.png',
                                    setStyle: {
                                        disableDepthTestDistance: Number.POSITIVE_INFINITY
                                    }

 src/views/policeInfor/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-05-06 21:39:45
 * @LastEditTime: 2023-05-08 09:19:32
 * @FilePath: \srs-police-affairs\src\views\policeInfor\index.vue
 * @Description: 辖区管理
 * 
@@ -16,40 +16,82 @@
                <div class="search-item-box">
                    <span>警情类型：</span>

                    <el-select style="flex: 1;" size="small" v-model="policeInforValue" @change="policeTypeChange"
                        placeholder="请选择">
                        <el-option v-for="item in policeInforOptions" :key="item.value" :label="item.label"
                            :value="item.value"></el-option>
                    <el-select
                        style="flex: 1;"
                        size="small"
                        v-model="policeInforValue"
                        @change="policeTypeChange"
                        placeholder="请选择"
                    >
                        <el-option
                            v-for="item in policeInforOptions"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value"
                        ></el-option>
                    </el-select>
                </div>

                <div class="search-item-box">
                    <el-date-picker size="mini" :clearable="false" v-model="currentTime" type="daterange" align="center"
                        unlink-panels range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"
                        @change="datePickerChange" :picker-options="pickerOptions"></el-date-picker>
                    <el-date-picker
                        size="mini"
                        :clearable="false"
                        v-model="currentTime"
                        type="daterange"
                        align="center"
                        unlink-panels
                        range-separator="至"
                        start-placeholder="开始日期"
                        end-placeholder="结束日期"
                        @change="datePickerChange"
                        :picker-options="pickerOptions"
                    ></el-date-picker>
                </div>
            </div>

            <div class="police-info">
                <el-table :data="historyPoliceInforData" style="width: 100%" :height="currentTableHeight"
                <el-table
                    :data="historyPoliceInforData"
                    style="width: 100%"
                    :height="currentTableHeight"
                    :header-cell-style="{ 'text-align': 'center', 'background-color': '#203c60', 'borderColor': '#324e75' }"
                    :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75', 'cursor': 'default' }"
                    :row-class-name="tableRowClassName" class="police-infor-table" @cell-mouse-enter="tableEnter"
                    @cell-mouse-leave="tabelLeave">
                    :row-class-name="tableRowClassName"
                    class="police-infor-table"
                    @cell-mouse-enter="tableEnter"
                    @cell-mouse-leave="tabelLeave"
                >
                    <template slot="empty">
                        <div>{{ historyEmptyText }}</div>
                    </template>
                    <el-table-column prop="JJDWMC" :show-overflow-tooltip="true" label="接警单位"
                        min-width="80%"></el-table-column>
                    <el-table-column
                        prop="JJDWMC"
                        :show-overflow-tooltip="true"
                        label="接警单位"
                        min-width="80%"
                    ></el-table-column>
                    <el-table-column prop="BJSJ" label="报警时间" min-width="50%"></el-table-column>
                    <el-table-column prop="BJLX" label="报警类型"></el-table-column>
                    <el-table-column label="操作" align="center" min-width="32%">
                        <template slot-scope="scope">
                            <el-button v-if="!whetherPosition(scope.row)" @click="clickData(scope.row)" type="text"
                                size="small" title="定位">
                                <i class="el-icon-location" :style="{ color: positionColor(scope.row) }"></i>
                            <el-button
                                v-if="!whetherPosition(scope.row)"
                                @click="clickData(scope.row)"
                                type="text"
                                size="small"
                                title="定位"
                            >
                                <i
                                    class="el-icon-location"
                                    :style="{ color: positionColor(scope.row) }"
                                ></i>
                            </el-button>
                            <el-buttonalign-justify @click="siteClick(scope.row)" type="text" size="small" title="详情">
                            <el-buttonalign-justify
                                @click="siteClick(scope.row)"
                                type="text"
                                size="small"
                                title="详情"
                            >
                                <i class="el-icon-document"></i>
                            </el-buttonalign-justify>
                        </template>
@@ -58,12 +100,24 @@
            </div>
        </div>

        <el-dialog title="警情信息" :visible.sync="policeSituationVisible" :modal-append-to-body="false"
            :before-close="policeSituationBeforeClose" :modal="true" :close-on-click-modal="false"
            class="policeSituation-details-box">
        <el-dialog
            title="警情信息"
            :visible.sync="policeSituationVisible"
            :modal-append-to-body="false"
            :before-close="policeSituationBeforeClose"
            :modal="true"
            :close-on-click-modal="false"
            class="policeSituation-details-box"
        >
            <div class="btn-change">
                <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">
@@ -125,7 +179,10 @@
                </div>
            </div>

            <div v-show="policeInformationType == '出警信息' && JSON.stringify(CJdata) != '{}'" class="box">
            <div
                v-show="policeInformationType == '出警信息' && JSON.stringify(CJdata) != '{}'"
                class="box"
            >
                <div class="item">
                    <div>处警单位编号:</div>
                    <div>{{ CJdata.CJDWBH }}</div>
@@ -182,11 +239,17 @@
                </div>
            </div>

            <div v-show="policeInformationType == '出警信息' && JSON.stringify(CJdata) == '{}'" class="box no-data">暂无警情</div>
            <div
                v-show="policeInformationType == '出警信息' && JSON.stringify(CJdata) == '{}'"
                class="box no-data"
            >暂无警情</div>
        </el-dialog>

        <div class="cur-tooltip" v-show="currentTooltip"
            :style="{ top: currentPointerPosition.y + 'px', left: currentPointerPosition.x + 'px' }">
        <div
            class="cur-tooltip"
            v-show="currentTooltip"
            :style="{ top: currentPointerPosition.y + 'px', left: currentPointerPosition.x + 'px' }"
        >
            <div class="type-name">报警内容</div>
            <div class="type-content">{{ currentBJNR }}</div>
        </div>
@@ -639,6 +702,8 @@
                    this.realEmptyText = "暂无历史警情信息"
                }

                this.addPoliceInforSiteLayer(this.historyPoliceInforData)

                setTimeout(() => {
                    loading && loading.close()
                }, 500)
@@ -733,6 +798,38 @@
            // })
        },

        addPoliceInforSiteLayer (data) {
            this.clearLayer()
            let policeInfoPositionList = []

            data.forEach((item, index) => {
                if (item.lng && item.lng != undefined && item.lng != '') {
                    let center = new global.DC.Position(Number(item.lng), Number(item.lat))
                    let point = new global.DC.PointPrimitive(center)
                    policeInfoPositionList.push(center)
                    let num = 0

                    timer[index] = setInterval(() => {
                        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.siteClick)
                    policeInforSiteLayer.addOverlay(point)
                }
            })
        },


        /**
         * @description: 警情闪烁点的点击事件
         * @param {*} e