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

shuishen

2023-05-06 fa05abb4ccb468db395b0683ff36f2ad419064e5

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

 public/img/code.jpg

 src/styles/base/index.scss

@@ -156,7 +156,7 @@
    .el-dialog {
        display: flex;
        flex-direction: column;
        width: 720px;
        width: 920px;

        .el-dialog__body {
            flex: 1;

 src/styles/media/index.scss

@@ -497,6 +497,11 @@
                                                line-height: countSizeVh(40);
                                            }
                                        }

                                        .code {
                                            width: countSizeVw(120, 1920);
                                            height: countSizeVh(120);
                                        }
                                    }
                                }

@@ -1998,7 +2003,7 @@

                    .resident-details-box {
                        .el-dialog {
                            width: countSizeVw(720, 1920);
                            width: countSizeVw(1080, 1920);
                        }

                        .el-dialog__header span {

 src/views/home/components/dialog/areaDetailsBox.vue

@@ -29,10 +29,16 @@
                    </template>
                </el-table-column>
                <el-table-column :show-overflow-tooltip="true" prop="realName" label="姓名"></el-table-column>
                <el-table-column :show-overflow-tooltip="true" prop="address" label="地址" min-width="240%"></el-table-column>
                <el-table-column :show-overflow-tooltip="true" prop="reAddress" label="地址"
                    min-width="240%"></el-table-column>
                <el-table-column :show-overflow-tooltip="true" prop="phone" label="电话"></el-table-column>
                <el-table-column :show-overflow-tooltip="true" prop="policeStationName" label="所属派出所"></el-table-column>
                <el-table-column :show-overflow-tooltip="true" prop="areaName" label="所属责任区"></el-table-column>
                <el-table-column :show-overflow-tooltip="true" prop="personType" label="人口类型">
                    <template slot-scope="scope">
                        {{ scope.row.personType == 1 ? '户籍人口' : '实有人口' }}
                    </template>
                </el-table-column>
            </el-table>

            <div class="pages all-pagination-sty" ref="tablePagination">
@@ -142,6 +148,7 @@
                size: this.peoplePage.pageSize
            }).then(res => {
                this.peoplePage.total = 0
                console.log('getPersonInfoPage', res)

                if (res.data.data.records.length > 0) {
                    this.peoplePage.total = res.data.data.total

 src/views/home/components/leftContainer.vue

@@ -7,35 +7,23 @@
                        <span :class="{ choosed: peopletype == 0 }">现有人员</span>
                    </div>
                </div>
                <el-main
                    v-loading="personEchartsLoading"
                    element-loading-text="拼命加载中"
                    element-loading-spinner="el-icon-loading"
                    element-loading-background="rgba(0, 0, 0, 0.5)"
                    style="height: calc(100% - 17.6%);"
                >
                <el-main v-loading="personEchartsLoading" element-loading-text="拼命加载中"
                    element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.5)"
                    style="height: calc(100% - 17.6%);">
                    <div class="sub-tab" v-show="peopletype == 0">
                        <div
                            class="tab"
                            :class="{ 'select-on-tab': tabType == 0 }"
                            @click="personTabClick(0)"
                        >
                            <div class="tab-title-small">户籍人口:</div>
                        <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>
@@ -46,94 +34,53 @@
                    </div>
                </el-main>

                <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>
        <div class="house-box" style="position: relative;">
            <div class="box">
                <div class="title">现有住宅</div>
                <el-main
                    v-loading="houseEchartsLoading"
                    element-loading-text="拼命加载中"
                    element-loading-spinner="el-icon-loading"
                    element-loading-background="rgba(0, 0, 0, 0.5)"
                >
                <el-main v-loading="houseEchartsLoading" 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': 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>
@@ -143,45 +90,24 @@
            </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>
        <div class="land-box" style="position: relative;">
            <div class="box">
                <div class="title">现有小区</div>
                <el-main
                    v-loading="landEchartsLoading"
                    element-loading-text="拼命加载中"
                    element-loading-spinner="el-icon-loading"
                    element-loading-background="rgba(0, 0, 0, 0.5)"
                >
                <el-main v-loading="landEchartsLoading" element-loading-text="拼命加载中"
                    element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.5)">
                    <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>
@@ -197,19 +123,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>
@@ -428,7 +345,6 @@
                    this.getPoliceStationInfo()

                } else {

                    this.getVillagePersonStatisticInfoByPoliceStationId(this.policeStaionID != '' ? this.policeStaionID : this.userInfo.dept_id)
                }

@@ -447,7 +363,7 @@
                    this.disposeEchart()
                    curSubofficeData = res.data.data
                    this.personAll = res.data.data

                    console.log('getPoliceStationInfo', res.data.data)
                    this.policeStationPersonInfo = res.data.data
                    //异步，因此放进接口方法内部
                    this.initPersonEcharts()
@@ -472,7 +388,7 @@
        getVillagePersonStatisticInfoByPoliceStationId (policeStationId, name) {
            getVillagePersonStatisticInfoByPoliceStationId(policeStationId, name).then(res => {
                if (res.data.code == 200) {

                    console.log(res, 'getVillagePersonStatisticInfoByPoliceStationId')
                    this.disposeEchart()
                    var chartDom = document.getElementById('PersonEcharts')
                    homePersonmyChart = this.$echarts.init(chartDom)
@@ -484,25 +400,30 @@


                    this.villagePersonStatisticInfoList = res.data.data
                    var xDate = [], yDate = [], colors = ['#ccf9d0', '#f9d888', '#f7857e']
                    var xDate = [], yDate1 = [], yDate2 = [], colors1 = ['#ccf9d0', '#f9d888', '#f7857e'], colors2 = ['#FF6666', '#FFFF00', '#0066CC']

                    if (this.villagePersonStatisticInfoList.data.length > 0) {
                        this.villagePersonStatisticInfoList.data.forEach(e => {
                            xDate.push(e.name.replace('居民委员会', ''))
                            yDate.push({
                                value: e.num,
                            yDate1.push({
                                value: e.hjnum,
                                name: e.name,
                                id: e.id
                            })
                            yDate2.push({
                                value: e.synum,
                                name: e.name,
                                id: e.id
                            })
                        })
                    }

                    homePersonmyChart.setOption(this.initPersonOptions(xDate, yDate, colors), true)
                    homePersonmyChart.setOption(this.initPersonOptions(xDate, yDate1, yDate2, colors1, colors2), true)
                    this.clickPeopleChart()

                    setTimeout(() => {
                        this.dataDeep = 2,
                            this.personEchartsLoading = false
                        this.dataDeep = 2
                        this.personEchartsLoading = false
                    }, 1000)

                }
@@ -521,14 +442,20 @@
            var chartDom = document.getElementById('PersonEcharts')
            homePersonmyChart = this.$echarts.init(chartDom)

            var xDate = [], yDate = []
            var xDate = [], yDate1 = [], yDate2 = []
            //传入x,y轴数据

            if (this.policeStationPersonInfo.data.length > 0) {
                this.policeStationPersonInfo.data.forEach(e => {
                    xDate.push(e.name.replace('派出', ''))
                    yDate.push({
                        value: e.num,
                    yDate1.push({
                        value: e.hjnum,
                        id: e.id,
                        type: 'policeStation',
                        name: e.name
                    })
                    yDate2.push({
                        value: e.synum,
                        id: e.id,
                        type: 'policeStation',
                        name: e.name
@@ -536,7 +463,7 @@
                })
            }

            homePersonmyChart.setOption(this.initPersonOptions(xDate, yDate, ['#06B5D7', '#44C0C1', '#71C8B1']))
            homePersonmyChart.setOption(this.initPersonOptions(xDate, yDate1, yDate2, ['#06B5D7', '#44C0C1', '#71C8B1'], ['#FF6666', '#9a76dc', '#602ac2']))
        },

        /**
@@ -546,7 +473,7 @@
         * @param {*} colors
         * @return {*}
         */
        initPersonOptions (xDate, yDate, colors) {
        initPersonOptions (xDate, yDate1, yDate2, colors1, colors2) {
            let options

            if (xDate.length == 0) {
@@ -601,42 +528,94 @@
                            fontSize: fontSize(12)
                        }
                    },
                    legend: {
                        itemWidth: 15,
                        itemHeight: 15,
                        data: ['户籍人口', '实有人口'],
                        textStyle: {
                            color: '#fff'
                        }
                    },
                    series: [
                        {
                            data: yDate,
                            name: '户籍人口',
                            data: yDate1,
                            type: 'bar',
                            barWidth: '40%',
                            stack: true,
                            emphasis: {
                                disabled: true,
                                focus: 'none'
                            },
                            itemStyle: {
                                normal: {
                                    color: function (params) {
                                        return new global.echarts.graphic.LinearGradient(
                                            0, 0, 0, 1,
                                            [
                                                { offset: 0, color: colors[0] },
                                                { offset: 0.5, color: colors[1] },
                                                { offset: 1, color: colors[2] },
                                            ]
                                        )
                                    }
                                    color: colors1[0],
                                    // color: function (params) {
                                    //     return new global.echarts.graphic.LinearGradient(
                                    //         0, 0, 0, 1,
                                    //         [
                                    //             { offset: 0, color: colors1[0] },
                                    //             { offset: 0.5, color: colors1[1] },
                                    //             { offset: 1, color: colors1[2] },
                                    //         ]
                                    //     )
                                    // }
                                },
                                emphasis: {
                                    color: function (params) {
                                        return new global.echarts.graphic.LinearGradient(
                                            0, 0, 0, 1,
                                            [
                                                { offset: 0, color: colors[2] },
                                                { offset: 0.7, color: colors[1] },
                                                { offset: 1, color: colors[0] }
                                            ]
                                        )
                                    }
                                    color: colors1[0],
                                    // color: function (params) {
                                    //     return new global.echarts.graphic.LinearGradient(
                                    //         0, 0, 0, 1,
                                    //         [
                                    //             { offset: 0, color: colors1[2] },
                                    //             { offset: 0.7, color: colors1[1] },
                                    //             { offset: 1, color: colors1[0] }
                                    //         ]
                                    //     )
                                    // }
                                }
                            },
                        }
                        },
                        {
                            name: '实有人口',
                            data: yDate2,
                            type: 'bar',
                            barWidth: '40%',
                            stack: true,
                            emphasis: {
                                disabled: true,
                                focus: 'none'
                            },
                            itemStyle: {
                                normal: {
                                    color: colors2[0]
                                    // color: function (params) {
                                    //     return new global.echarts.graphic.LinearGradient(
                                    //         0, 0, 0, 1,
                                    //         [
                                    //             { offset: 0, color: colors2[2] },
                                    //             { offset: 0.5, color: colors2[1] },
                                    //             { offset: 1, color: colors2[0] },
                                    //         ]
                                    //     )
                                    // }
                                },
                                emphasis: {
                                    color: colors2[0]
                                    // color: function (params) {
                                    //     return new global.echarts.graphic.LinearGradient(
                                    //         0, 0, 0, 1,
                                    //         [
                                    //             { offset: 0, color: colors2[0] },
                                    //             { offset: 0.7, color: colors2[1] },
                                    //             { offset: 1, color: colors2[2] }
                                    //         ]
                                    //     )
                                    // }
                                }
                            },
                        },

                    ],
                    grid: {
                        top: '4%',
@@ -1497,7 +1476,7 @@
                color: #fff;
            }

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

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

 src/views/house/index.vue

@@ -13,204 +13,114 @@
    <div class="house-page container">
        <div v-show="boxShow" class="container-content">
            <div v-show="contentShow" class="search-box">
                <el-popover
                    ref="popover"
                    placement="bottom"
                    trigger="manual"
                    v-model="searchTreeShowFlag"
                    popper-class="tree-search-popup"
                    @mousedown.native="preventFocusLost"
                >
                    <el-tree
                        v-show="searchLazyFlag == true"
                        ref="popupTree"
                        style="overflow: auto;"
                        class="select-tree-box"
                        :load="loadNode"
                        :lazy="true"
                        :props="props"
                        @current-change="currentChangeHandle"
                        @mousedown.native="preventFocusLost"
                    ></el-tree>
                <el-popover ref="popover" placement="bottom" trigger="manual" v-model="searchTreeShowFlag"
                    popper-class="tree-search-popup" @mousedown.native="preventFocusLost">
                    <el-tree v-show="searchLazyFlag == true" ref="popupTree" style="overflow: auto;" class="select-tree-box"
                        :load="loadNode" :lazy="true" :props="props" @current-change="currentChangeHandle"
                        @mousedown.native="preventFocusLost"></el-tree>

                    <el-tree
                        v-show="searchLazyFlag == false"
                        :empty-text="treeEmptyText"
                        ref="popupTree"
                        style="overflow: auto;"
                        class="select-tree-box"
                        :data="searchTreeData"
                        :props="defaultProps"
                        :default-expand-all="true"
                        @current-change="currentChangeHandle"
                        @mousedown.native="preventFocusLost"
                    ></el-tree>
                    <el-tree v-show="searchLazyFlag == false" :empty-text="treeEmptyText" ref="popupTree"
                        style="overflow: auto;" class="select-tree-box" :data="searchTreeData" :props="defaultProps"
                        :default-expand-all="true" @current-change="currentChangeHandle"
                        @mousedown.native="preventFocusLost"></el-tree>
                </el-popover>

                <el-input
                    ref="searchTreeInput"
                    v-model="searchTreeName"
                    @input="searchInputTree"
                    @focus="searchTreeShowFlag = true"
                    @blur="searchTreeShowFlag = false"
                    v-popover:popover
                    placeholder="请输入搜索条件"
                    style="cursor: pointer;"
                ></el-input>
                <el-input ref="searchTreeInput" v-model="searchTreeName" @input="searchInputTree"
                    @focus="searchTreeShowFlag = true" @blur="searchTreeShowFlag = false" v-popover:popover
                    placeholder="请输入搜索条件" style="cursor: pointer;"></el-input>
            </div>

            <div v-show="contentShow" class="result-content" ref="resultContentBox">
                <el-main
                    v-loading="villageInfoLoading"
                    element-loading-background="rgba(0, 0, 0, 0.5)"
                    element-loading-text="数据正在加载中"
                    element-loading-spinner="el-icon-loading"
                    style="overflow:hidden;padding:0px;"
                >
                <el-main v-loading="villageInfoLoading" element-loading-background="rgba(0, 0, 0, 0.5)"
                    element-loading-text="数据正在加载中" element-loading-spinner="el-icon-loading"
                    style="overflow:hidden;padding:0px;">
                    <div class="housing-estate-info" ref="housingEstateInfoBox">
                        <div class="housing-title">
                            {{ villageInfo.name }}
                            <div class="progress"></div>
                        </div>
                        <div class="housing-bg">
                            <el-image
                                fit="contain"
                                :src="villageInfo.pic_url"
                                :preview-src-list="villageInfo.pic_url_singleArr"
                            >
                            <el-image fit="contain" :src="villageInfo.pic_url"
                                :preview-src-list="villageInfo.pic_url_singleArr">
                                <div slot="error" class="image-slot">暂无照片</div>
                            </el-image>
                            <el-empty
                                :image-size="120"
                                description="暂无照片"
                                v-show="!villageInfo.pic_url && isHaveNoPic == true"
                            ></el-empty>
                            <el-empty :image-size="120" description="暂无照片"
                                v-show="!villageInfo.pic_url && isHaveNoPic == true"></el-empty>
                        </div>
                        <div class="housing-introduce">
                            <div>
                                <div class="l">分类属性：</div>
                                <div
                                    class="r"
                                >{{ villageInfo.type_name ? villageInfo.type_name : '暂无数据' }}</div>
                                <div class="r">{{ villageInfo.type_name ? villageInfo.type_name : '暂无数据' }}</div>
                            </div>
                            <div>
                                <div class="l">所属辖区：</div>
                                <div
                                    class="r"
                                >{{ villageInfo.policeStationName ? villageInfo.policeStationName : '暂无数据' }}</div>
                                <div class="r">{{ villageInfo.policeStationName ? villageInfo.policeStationName : '暂无数据' }}
                                </div>
                            </div>
                            <div>
                                <div class="l">包干民警：</div>
                                <div
                                    class="r"
                                >{{ villageInfo.policeName ? villageInfo.policeName : '暂无数据' }}</div>
                                <div class="r">{{ villageInfo.policeName ? villageInfo.policeName : '暂无数据' }}</div>
                            </div>
                            <div>
                                <div class="l">标准地址：</div>
                                <div
                                    class="r"
                                >{{ villageInfo.address ? villageInfo.address : '暂无数据' }}</div>
                                <div class="r">{{ villageInfo.address ? villageInfo.address : '暂无数据' }}</div>
                            </div>
                            <!-- <div class="code">
                                <el-image fit="contain" src="/img/code.jpg" :preview-src-list="['/img/code.jpg']">
                                    <div slot="error" class="image-slot">暂无二维码</div>
                                </el-image>
                            </div> -->
                        </div>
                    </div>
                </el-main>

                <div class="nav-tab" ref="navTabBox">
                    <div
                        class="nav"
                        :class="navType == 0 ? 'choosed' : ''"
                        @click="navClick"
                        data-type="0"
                    >基本信息</div>
                    <div
                        class="nav"
                        :class="navType == 1 ? 'choosed' : ''"
                        @click="navClick"
                        data-type="1"
                    >报警信息</div>
                    <div class="nav" :class="navType == 0 ? 'choosed' : ''" @click="navClick" data-type="0">基本信息</div>
                    <div class="nav" :class="navType == 1 ? 'choosed' : ''" @click="navClick" data-type="1">报警信息</div>
                </div>

                <div class="base-info" v-show="navType == 0">
                    <div class="sub-nav-list">
                        <div
                            class="sub-nav"
                            :class="{ on: subNavType == 1 }"
                            @click="switchSubNav(1)"
                        >楼栋</div>
                        <div
                            class="sub-nav"
                            :class="{ on: subNavType == 2 }"
                            @click="switchSubNav(2)"
                        >出入口</div>
                        <div
                            class="sub-nav"
                            :class="{ on: subNavType == 3 }"
                            @click="switchSubNav(3)"
                        >停车场</div>
                        <div
                            class="sub-nav"
                            :class="{ on: subNavType == 4 }"
                            @click="switchSubNav(4)"
                        >商业</div>
                        <div class="sub-nav" :class="{ on: subNavType == 1 }" @click="switchSubNav(1)">楼栋</div>
                        <div class="sub-nav" :class="{ on: subNavType == 2 }" @click="switchSubNav(2)">出入口</div>
                        <div class="sub-nav" :class="{ on: subNavType == 3 }" @click="switchSubNav(3)">停车场</div>
                        <div class="sub-nav" :class="{ on: subNavType == 4 }" @click="switchSubNav(4)">商业</div>
                    </div>

                    <div class="floor-content" v-show="subNavType == 1">
                        <el-main
                            v-loading="BuildListLoading"
                            v-show="isShowBuildListBox"
                            element-loading-background="rgba(0, 0, 0, 0.5)"
                            element-loading-text="数据正在加载中"
                            element-loading-spinner="el-icon-loading"
                            style="overflow:hidden;padding:0px;"
                            class="build-item"
                        >
                            <div
                                class="build-info"
                                v-show="!BuildListLoading && buildingList.length"
                            >
                        <el-main v-loading="BuildListLoading" v-show="isShowBuildListBox"
                            element-loading-background="rgba(0, 0, 0, 0.5)" element-loading-text="数据正在加载中"
                            element-loading-spinner="el-icon-loading" style="overflow:hidden;padding:0px;"
                            class="build-item">
                            <div class="build-info" v-show="!BuildListLoading && buildingList.length">
                                <div class="nextBtn" @click="lastBtn" v-show="lastBtnShow == true">
                                    <i class="el-icon-caret-left"></i>
                                </div>
                                <div class="build-outBox" ref="BuildOutBox">
                                    <div class="build-box" style="left: 0px;">
                                        <div
                                            class="ridgepole-list"
                                            v-for="index of Math.ceil(buildingList.length / 10)"
                                            :key="index"
                                        >
                                            <div
                                                v-for="(item, index) in buildingList.slice((index - 1) * 10, index * 10)"
                                                :key="index"
                                                @click="buildingClick(item)"
                                                :class="{ on: buildingChoosed.name == item.name }"
                                                :title="item.name"
                                            >
                                        <div class="ridgepole-list" v-for="index of Math.ceil(buildingList.length / 10)"
                                            :key="index">
                                            <div v-for="(item, index) in buildingList.slice((index - 1) * 10, index * 10)"
                                                :key="index" @click="buildingClick(item)"
                                                :class="{ on: buildingChoosed.name == item.name }" :title="item.name">
                                                {{
                                                item.name
                                                    item.name
                                                }}
                                                <div @click.stop title="显示/隐藏楼栋高亮">
                                                    <el-checkbox
                                                        v-model="isBuildHighLightchecked"
                                                    <el-checkbox v-model="isBuildHighLightchecked"
                                                        v-show="buildingChoosed.name == item.name"
                                                        @change="changeBuildHighLightchecked"
                                                    ></el-checkbox>
                                                        @change="changeBuildHighLightchecked"></el-checkbox>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="nextBtn rightBtn" @click="nextBtn">
                                    <i
                                        v-show="buildingList.length > 10 && nextBtnShow"
                                        class="el-icon-caret-right"
                                    ></i>
                                    <i v-show="buildingList.length > 10 && nextBtnShow" class="el-icon-caret-right"></i>
                                </div>
                            </div>
                            <div
                                class="build-info"
                                v-show="!BuildListLoading && !buildingList.length"
                                style="justify-content: center;"
                            >暂无楼栋数据</div>
                            <div class="build-info" v-show="!BuildListLoading && !buildingList.length"
                                style="justify-content: center;">暂无楼栋数据</div>
                        </el-main>
                        <div class="ridgepole-info" v-if="isShowHouseBox">
                            <div class="title">楼栋信息</div>
@@ -234,9 +144,7 @@
                            <div class="content">
                                <div class="one">
                                    <div @click="goTOPeopleDetail(1)">
                                        <div
                                            style="color:#72fff8"
                                        >{{ peopleInfo.registeredPopulation }}</div>
                                        <div style="color:#72fff8">{{ peopleInfo.registeredPopulation }}</div>
                                        <div>户籍人口</div>
                                    </div>
                                    <div @click="goTOPeopleDetail(2)">
@@ -251,166 +159,95 @@
                            <div class="condo" v-show="isShowUnitChoose">
                                <div class="type">选择单元</div>
                                <div class="type-select">
                                    <el-select
                                        size="small"
                                        v-model="unitValue"
                                        placeholder="请选择"
                                        @change="chooseUnit"
                                    >
                                        <el-option
                                            v-for="item in unitOptions"
                                            :key="item.value"
                                            :label="item.label"
                                            :value="item.value"
                                            class="unit-option"
                                        ></el-option>
                                    <el-select size="small" v-model="unitValue" placeholder="请选择" @change="chooseUnit">
                                        <el-option v-for="item in unitOptions" :key="item.value" :label="item.label"
                                            :value="item.value" class="unit-option"></el-option>
                                    </el-select>
                                </div>
                            </div>
                            <el-main
                                v-loading="pictLoading"
                                element-loading-background="rgba(0, 0, 0, 0.5)"
                                element-loading-text="数据正在加载中"
                                element-loading-spinner="el-icon-loading"
                                style="overflow:hidden;padding:0px;height: 240px;"
                            >
                            <el-main v-loading="pictLoading" element-loading-background="rgba(0, 0, 0, 0.5)"
                                element-loading-text="数据正在加载中" element-loading-spinner="el-icon-loading"
                                style="overflow:hidden;padding:0px;height: 240px;">
                                <div class="floor-outBox">
                                    <div
                                        @click="lastFloorBtn"
                                        class="floorBtn"
                                        v-show="lastFloorShow"
                                    >
                                    <div @click="lastFloorBtn" class="floorBtn" v-show="lastFloorShow">
                                        <i class="el-icon-caret-left"></i>
                                    </div>
                                    <div class="floor-box">
                                        <div class="floor-num" style="left: 0;">
                                            <div
                                                :class="{ on: floorsType == index }"
                                                @click="floorsType = index"
                                                v-for="index in Math.ceil(unitChoosedArr.length / 5)"
                                                :key="index"
                                            >
                                            <div :class="{ on: floorsType == index }" @click="floorsType = index"
                                                v-for="index in Math.ceil(unitChoosedArr.length / 5)" :key="index">
                                                {{ unitChoosedArr[index * 5 - 5].sname }}{{ unitChoosedArr[index * 5
                                                - 5].sname ==
                                                unitChoosedArr[unitChoosedArr.length - 1].sname ? '' : '-' }}{{
                                                unitChoosedArr[index *
                                                5
                                                - 1] ? (unitChoosedArr[index * 5
                                                - 1].sname) : (unitChoosedArr[index * 5 - 5].sname ==
                                                unitChoosedArr[unitChoosedArr.length - 1].sname
                                                ? '' : unitChoosedArr[unitChoosedArr.length - 1].sname)
                                                }}层
                                                    - 5].sname ==
                                                    unitChoosedArr[unitChoosedArr.length - 1].sname ? '' : '-' }}{{
        unitChoosedArr[index *
        5
        - 1] ? (unitChoosedArr[index * 5
            - 1].sname) : (unitChoosedArr[index * 5 - 5].sname ==
                unitChoosedArr[unitChoosedArr.length - 1].sname
                ? '' : unitChoosedArr[unitChoosedArr.length - 1].sname)
    }}层
                                            </div>
                                        </div>
                                    </div>
                                    <div
                                        @click="nextFloorBtn"
                                        class="floorBtn rightFloorBtn"
                                        v-show="nextFloorShow"
                                    >
                                    <div @click="nextFloorBtn" class="floorBtn rightFloorBtn" v-show="nextFloorShow">
                                        <i class="el-icon-caret-right"></i>
                                    </div>
                                </div>
                                <div
                                    class="floor-detail"
                                    v-show="!pictLoading && isHaveResidentData"
                                >
                                    <div
                                        v-for="(item, index) in unitChoosedArr.slice((floorsType - 1) * 5, floorsType * 5)"
                                        :key="index"
                                    >
                                <div class="floor-detail" v-show="!pictLoading && isHaveResidentData">
                                    <div v-for="(item, index) in unitChoosedArr.slice((floorsType - 1) * 5, floorsType * 5)"
                                        :key="index">
                                        <div class="title">{{ item.sname }}层：</div>
                                        <div class="detail">
                                            <div
                                                v-for="(value, index) in item.children_infos"
                                                :key="index"
                                            <div v-for="(value, index) in item.children_infos" :key="index"
                                                @click="residentDetailsClick(value)"
                                                :class="{ on: floorChoosed == value.sname }"
                                            >{{ value.sname }}室</div>
                                                :class="{ on: floorChoosed == value.sname }">{{ value.sname }}室</div>
                                        </div>
                                    </div>
                                </div>
                                <div
                                    class="floor-detail"
                                    v-show="!pictLoading && !isHaveResidentData"
                                    style="display: flex;justify-content: center;align-items: center;"
                                >暂无户室数据</div>
                                <div class="floor-detail" v-show="!pictLoading && !isHaveResidentData"
                                    style="display: flex;justify-content: center;align-items: center;">暂无户室数据</div>
                            </el-main>
                        </div>
                    </div>

                    <div class="come-out-content" v-show="subNavType == 2">
                        <el-table
                            :data="comeOutData"
                            style="width: 100%"
                        <el-table :data="comeOutData" style="width: 100%"
                            :header-cell-style="{ 'text-align': 'center', 'background-color': '#203c60', 'borderColor': '#324e75' }"
                            :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75' }"
                            :row-class-name="tableRowClassName"
                            @row-click="deepDataRowClick($event, 'comeOut')"
                            :empty-text="houseDeepNoDataText"
                            v-loading="houseDeepLoading"
                            element-loading-text="拼命加载中"
                            element-loading-spinner="el-icon-loading"
                            element-loading-background="rgba(0, 0, 0, 0.5)"
                        >
                            <el-table-column
                                prop="name"
                                label="名称"
                                width="180"
                                :show-overflow-tooltip="true"
                            ></el-table-column>
                            :row-class-name="tableRowClassName" @row-click="deepDataRowClick($event, 'comeOut')"
                            :empty-text="houseDeepNoDataText" v-loading="houseDeepLoading" element-loading-text="拼命加载中"
                            element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.5)">
                            <el-table-column prop="name" label="名称" width="180"
                                :show-overflow-tooltip="true"></el-table-column>
                            <el-table-column prop="x" label="经度" width="100"></el-table-column>
                            <el-table-column prop="y" label="纬度" width="100"></el-table-column>
                        </el-table>
                    </div>

                    <div class="park-content" v-show="subNavType == 3">
                        <el-table
                            :data="parkingLotData"
                            style="width: 100%"
                        <el-table :data="parkingLotData" style="width: 100%"
                            :header-cell-style="{ 'text-align': 'center', 'background-color': '#203c60', 'borderColor': '#324e75' }"
                            :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75' }"
                            :row-class-name="tableRowClassName"
                            @row-click="deepDataRowClick($event, 'park')"
                            :empty-text="houseDeepNoDataText"
                            v-loading="houseDeepLoading"
                            element-loading-text="拼命加载中"
                            element-loading-spinner="el-icon-loading"
                            element-loading-background="rgba(0, 0, 0, 0.5)"
                        >
                            <el-table-column
                                prop="name"
                                label="名称"
                                width="180"
                                :show-overflow-tooltip="true"
                            ></el-table-column>
                            :row-class-name="tableRowClassName" @row-click="deepDataRowClick($event, 'park')"
                            :empty-text="houseDeepNoDataText" v-loading="houseDeepLoading" element-loading-text="拼命加载中"
                            element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.5)">
                            <el-table-column prop="name" label="名称" width="180"
                                :show-overflow-tooltip="true"></el-table-column>
                            <el-table-column prop="x" label="经度" width="100"></el-table-column>
                            <el-table-column prop="y" label="纬度" width="100"></el-table-column>
                        </el-table>
                    </div>

                    <div class="business-content" v-show="subNavType == 4">
                        <el-table
                            :data="businessData"
                            style="width: 100%"
                        <el-table :data="businessData" style="width: 100%"
                            :header-cell-style="{ 'text-align': 'center', 'background-color': '#203c60', 'borderColor': '#324e75' }"
                            :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75' }"
                            :row-class-name="tableRowClassName"
                            @row-click="deepDataRowClick($event, 'business')"
                            @sort-change="sortDevName"
                            :empty-text="houseDeepNoDataText"
                            v-loading="houseDeepLoading"
                            element-loading-text="拼命加载中"
                            element-loading-spinner="el-icon-loading"
                            element-loading-background="rgba(0, 0, 0, 0.5)"
                        >
                            <el-table-column
                                sortable="custom"
                                prop="name"
                                label="名称"
                                width="180"
                                :show-overflow-tooltip="true"
                            ></el-table-column>
                            :row-class-name="tableRowClassName" @row-click="deepDataRowClick($event, 'business')"
                            @sort-change="sortDevName" :empty-text="houseDeepNoDataText" v-loading="houseDeepLoading"
                            element-loading-text="拼命加载中" element-loading-spinner="el-icon-loading"
                            element-loading-background="rgba(0, 0, 0, 0.5)">
                            <el-table-column sortable="custom" prop="name" label="名称" width="180"
                                :show-overflow-tooltip="true"></el-table-column>
                            <el-table-column prop="x" label="经度" width="100"></el-table-column>
                            <el-table-column prop="y" label="纬度" width="100"></el-table-column>
                        </el-table>
@@ -418,58 +255,36 @@
                </div>

                <div class="police-info" v-if="navType == 1" ref="policeTableBox">
                    <el-main
                        v-loading="policeInfoLoading"
                        element-loading-text="拼命加载中"
                        element-loading-spinner="el-icon-loading"
                        element-loading-background="rgba(0, 0, 0, 0.5)"
                    >
                        <el-table
                            :data="callPoliceData"
                            style="width: 100%"
                            :height="currentTableHeight"
                    <el-main v-loading="policeInfoLoading" element-loading-text="拼命加载中"
                        element-loading-spinner="el-icon-loading" element-loading-background="rgba(0, 0, 0, 0.5)">
                        <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>
                        </div>
                        <el-table :data="callPoliceData" style="width: 100%" :height="currentTableHeight"
                            :header-cell-style="{ 'text-align': 'center', 'background-color': '#203c60', 'borderColor': '#324e75' }"
                            :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75' }"
                            :row-class-name="tableRowClassName"
                            :empty-text="jqNoDataText"
                            class="police-infor-table"
                            @cell-click="housingPoliceSiteClick"
                        >
                            <el-table-column
                                prop="JJDWMC"
                                :show-overflow-tooltip="true"
                                label="接警单位"
                                min-width="80%"
                            ></el-table-column>
                            :row-class-name="tableRowClassName" :empty-text="jqNoDataText" class="police-infor-table"
                            @cell-click="housingPoliceSiteClick">
                            <el-table-column prop="JJDWMC" :show-overflow-tooltip="true" label="接警单位"
                                min-width="80%"></el-table-column>
                            <el-table-column label="报警时间" prop="BJSJ" min-width="50%"></el-table-column>
                            <el-table-column prop="BJLX" :show-overflow-tooltip="true" label="报警类型"></el-table-column>
                            <el-table-column label="操作" align="center" min-width="36%">
                                <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>
                                </template>
                            </el-table-column>
                        </el-table>

                        <div class="pages all-pagination-sty" ref="ElPagination">
                            <el-pagination
                                background
                                layout="prev, pager, next"
                                :page-size="callPolicePage.pageSize"
                                :page-count="callPolicePage.count"
                                :current-page="callPolicePage.currentPage"
                                @current-change="handleCurrentChange"
                            ></el-pagination>
                            <el-pagination background layout="prev, pager, next" :page-size="callPolicePage.pageSize"
                                :page-count="callPolicePage.count" :current-page="callPolicePage.currentPage"
                                @current-change="handleCurrentChange"></el-pagination>
                        </div>
                    </el-main>
                </div>
@@ -478,15 +293,8 @@

        <map-search-box></map-search-box>

        <el-dialog
            title="报警信息"
            :visible.sync="policeSituationVisible"
            :modal-append-to-body="false"
            :modal="true"
            :close-on-click-modal="false"
            :before-close="policeSituationBeforeClose"
            class="policeSituation-details-box"
        >
        <el-dialog title="报警信息" :visible.sync="policeSituationVisible" :modal-append-to-body="false" :modal="true"
            :close-on-click-modal="false" :before-close="policeSituationBeforeClose" class="policeSituation-details-box">
            <div class="box">
                <div class="item">
                    <div>接警单位编号:</div>
@@ -547,44 +355,65 @@
            </div>
        </el-dialog>

        <el-dialog
            :title="residentDetailsTitle"
            :visible.sync="residentDetailsShow"
            :modal-append-to-body="false"
            :modal="true"
            :close-on-click-modal="false"
            :before-close="residentDetailsClose"
            class="resident-details-box"
            width="24%"
        >
            <el-table
                :data="houseDate"
        <el-dialog :title="residentDetailsTitle" :visible.sync="residentDetailsShow" :modal-append-to-body="false"
            :modal="true" :close-on-click-modal="false" :before-close="residentDetailsClose" class="resident-details-box">
            <el-table :data="houseDate"
                :header-cell-style="{ 'text-align': 'center', 'background-color': '#203c60', 'borderColor': '#324e75' }"
                :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75' }"
                v-loading="residentLoading"
                element-loading-text="拼命加载中"
                element-loading-spinner="el-icon-loading"
                element-loading-background="rgba(17, 38, 163, 1)"
                :empty-text="residentNoDataText"
            >
                <el-table-column prop="realName" label="姓名"></el-table-column>
                <el-table-column prop="phone" label="电话"></el-table-column>
                <el-table-column prop="cardNo" label="身份证号"></el-table-column>
                :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75' }" v-loading="residentLoading"
                element-loading-text="拼命加载中" element-loading-spinner="el-icon-loading"
                element-loading-background="rgba(17, 38, 163, 1)" :empty-text="residentNoDataText">
                <el-table-column prop="realName" label="姓名">
                    <template slot-scope="scope">
                        <span :style="{ color: (scope.row.isKeyPeople == 1 ? '#f00!important' : '#000') }">{{
                            scope.row.realName }}
                        </span>
                    </template>
                </el-table-column>
                <el-table-column prop="phone" label="电话">
                    <template slot-scope="scope">
                        <span :style="{ color: (scope.row.isKeyPeople == 1 ? '#f00!important' : '#000') }">{{
                            scope.row.phone }}
                        </span>
                    </template>
                </el-table-column>
                <el-table-column prop="cardNo" label="身份证号">
                    <template slot-scope="scope">
                        <span :style="{ color: (scope.row.isKeyPeople == 1 ? '#f00!important' : '#000') }">{{
                            scope.row.cardNo }}
                        </span>
                    </template>
                </el-table-column>
                <el-table-column prop="relationship" label="户主关系">
                    <template slot-scope="scope">
                        <span :style="{ color: (scope.row.isKeyPeople == 1 ? '#f00!important' : '#000') }">{{
                            scope.row.relationship }}
                        </span>
                    </template>
                </el-table-column>
                <el-table-column prop="address" label="户籍地址">
                    <template slot-scope="scope">
                        <span :style="{ color: (scope.row.isKeyPeople == 1 ? '#f00!important' : '#000') }">{{
                            scope.row.address }}
                        </span>
                    </template>
                </el-table-column>
                <el-table-column label="人口类型">
                    <template slot-scope="scope">{{ scope.row.personType == 1 ? '户籍人口' : '实有人口' }}</template>
                    <template slot-scope="scope"><span
                            :style="{ color: (scope.row.isKeyPeople == 1 ? '#f00!important' : '#000') }">{{
                                scope.row.personType == 1 ? '户籍人口' : '实有人口' }}</span></template>
                </el-table-column>
                <el-table-column label="是否为重点人员">
                    <template slot-scope="scope"><span
                            :style="{ color: (scope.row.isKeyPeople == 1 ? '#f00!important' : '#000') }">{{
                                scope.row.isKeyPeople == 1 ? '是' :
                                '否'
                            }}</span></template>
                </el-table-column>
            </el-table>
        </el-dialog>

        <el-dialog
            :title="keyPersonTitle"
            :visible.sync="keyPersonVisible"
            :modal-append-to-body="false"
            :modal="true"
            :close-on-click-modal="false"
            :before-close="keyPersonBeforeClose"
            class="keyPerson-details-box-two"
        >
        <el-dialog :title="keyPersonTitle" :visible.sync="keyPersonVisible" :modal-append-to-body="false" :modal="true"
            :close-on-click-modal="false" :before-close="keyPersonBeforeClose" class="keyPerson-details-box-two">
            <div class="header">
                <div>
                    姓名：
@@ -595,25 +424,14 @@
                    <input type="text" v-model="callPhone" placeholder="请输入联系电话" />
                </div>
                <el-button type="primary" icon="el-icon-search" @click="searchPeopleDetail">搜索</el-button>
                <el-button
                    type="primary"
                    icon="el-icon-delete"
                    @click="clearPeopleDetailSearchValue"
                >清空</el-button>
                <el-button type="primary" icon="el-icon-delete" @click="clearPeopleDetailSearchValue">清空</el-button>
            </div>
            <el-main
                v-loading="keyPeopleLoading"
                element-loading-text="拼命加载中"
                element-loading-spinner="el-icon-loading"
                element-loading-background="rgba(0, 0, 0, 0.5)"
            >
                <el-table
                    :data="personDetailArr"
                    style="width: 100%"
            <el-main v-loading="keyPeopleLoading" element-loading-text="拼命加载中" element-loading-spinner="el-icon-loading"
                element-loading-background="rgba(0, 0, 0, 0.5)">
                <el-table :data="personDetailArr" style="width: 100%"
                    :header-cell-style="{ 'text-align': 'center', 'background-color': '#203c60', 'borderColor': '#324e75' }"
                    :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75', 'cursor': 'default' }"
                    :empty-text="peopleNoDataText"
                >
                    :empty-text="peopleNoDataText">
                    <el-table-column label="序号" type="index" width="50" align="center">
                        <template slot-scope="scope">
                            <span>{{ (peoplePage.currentPage - 1) * peoplePage.pageSize + scope.$index + 1 }}</span>
@@ -623,27 +441,16 @@
                    <el-table-column prop="realName" label="姓名"></el-table-column>
                    <el-table-column prop="cardNo" label="身份证号"></el-table-column>
                    <el-table-column label="户室">
                        <template
                            slot-scope="scope"
                        >{{ scope.row.address.split(villageInfo.name)[1] }}</template>
                        <template slot-scope="scope">{{ scope.row.address.split(villageInfo.name)[1] }}</template>
                    </el-table-column>
                    <el-table-column prop="phone" label="电话"></el-table-column>
                    <el-table-column prop="policeStationName" label="所属派出所"></el-table-column>
                    <el-table-column prop="areaName" label="所属责任区"></el-table-column>
                </el-table>
                <div
                    class="pages all-pagination-sty"
                    ref="tablePagination"
                    v-show="!keyPeopleLoading"
                >
                    <el-pagination
                        background
                        layout="prev, pager, next"
                        :page-size="peoplePage.pageSize"
                        :total="peoplePage.total"
                        :current-page="peoplePage.currentPage"
                        @current-change="peopleHandleCurrentChange"
                    ></el-pagination>
                <div class="pages all-pagination-sty" ref="tablePagination" v-show="!keyPeopleLoading">
                    <el-pagination background layout="prev, pager, next" :page-size="peoplePage.pageSize"
                        :total="peoplePage.total" :current-page="peoplePage.currentPage"
                        @current-change="peopleHandleCurrentChange"></el-pagination>
                </div>
            </el-main>
        </el-dialog>
@@ -805,7 +612,39 @@
            villageInfoLoading: false,
            BuildListLoading: false,
            isHaveResidentData: false,

            pickerOptions: {
                shortcuts: [
                    {
                        text: "最近一周",
                        onClick (picker) {
                            const end = new Date()
                            const start = new Date()
                            start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
                            picker.$emit("pick", [start, end])
                        },
                    },
                    {
                        text: "最近一个月",
                        onClick (picker) {
                            const end = new Date()
                            const start = new Date()
                            start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
                            picker.$emit("pick", [start, end])
                        },
                    },
                    {
                        text: "最近三个月",
                        onClick (picker) {
                            const end = new Date()
                            const start = new Date()
                            start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
                            picker.$emit("pick", [start, end])
                        },
                    },
                ],
            },
            eventTime: [],
            eventTimeArr: [],
        }
    },

@@ -835,7 +674,7 @@
            // 原来 361100  临时361102
            this.getSearchExtensivelyBgAoiDeepdata(
                "ebf48ecaa1fd436fa3d40c4600aa051f",
                "361102",
                "361100",
                this.$route.query.id,
                "1|3"
            )
@@ -857,7 +696,7 @@
                // 大搜之搜索面详细数据（停车场出入口商场）--默认万达华府
                this.getSearchExtensivelyBgAoiDeepdata(
                    "ebf48ecaa1fd436fa3d40c4600aa051f",
                    "361102",
                    "361100",
                    villageId,
                    "1|3"
                )
@@ -901,6 +740,27 @@
    updated () { },

    methods: {
        // 警情统计中时间变化
        async caseTimeChange (e) {
            const date = e.map((item) => {
                return this.dateFormat(item)
            })
            this.eventTimeArr = date
            this.getAlarmList(this.eventTimeArr)
        },

        // 获取当前日期
        dateFormat (dateData) {
            var date = new Date(dateData)
            var y = date.getFullYear()
            var m = date.getMonth() + 1
            m = m < 10 ? "0" + m : m
            var d = date.getDate()
            d = d < 10 ? "0" + d : d
            const time = y + "-" + m + "-" + d
            return time
        },

        changeBuildHighLightchecked (e) {
            this.$EventBus.$emit("switchThreeDimensions", e)
        },
@@ -1070,7 +930,7 @@

            this.getSearchExtensivelyBgAoiDeepdata(
                "ebf48ecaa1fd436fa3d40c4600aa051f",
                "361102",
                "361100",
                current.id,
                "1|3"
            )
@@ -1080,6 +940,7 @@
        },

        navClick (e) {
            if (this.navType == e.target.dataset.type) return
            this.navType = e.target.dataset.type

            this.$store.commit('SET_HOUSEDEEPDATAPOPUP', false)
@@ -1093,7 +954,8 @@
                this.jqNoDataText = '  '
                this.callPolicePage.currentPage = 1
                this.callPoliceData = []
                this.getAlarmList()
                this.eventTime = this.getHalfYearTime()
                this.getAlarmList(this.eventTimeArr)
            } else {
                circleLayer.clear()
                circleLayer.remove()
@@ -1185,7 +1047,9 @@
                                siteWd: `${item.y}`,
                                siteGd: 360,
                                // build_id: `${item.std_addr_id.split("|")[1]}`,
                                build_id: `${item.uid}`,
                                build_uid: `${item.uid}`,
                                // 文档请求3D
                                build_std_addr_id: `${item.std_addr_id.split("|")[1]}`,

                                // 临时新加 business_id 用来请求3D
                                business_id: `${item.business_id}`,
@@ -1239,7 +1103,7 @@
                }

                this.callPolicePage.currentPage = 1
                this.getAlarmList()
                this.getAlarmList(this.eventTimeArr)
            }).catch(res => {
                setTimeout(() => {
                    this.villageInfoLoading = false
@@ -1303,8 +1167,8 @@
        },

        // 三维接口查询楼栋
        getHouses3DData (build_id, adcode, aoiArr) {
            getHouses(build_id, adcode).then((res) => {
        getHouses3DData (build_std_addr_id, adcode, aoiArr) {
            getHouses(build_std_addr_id, adcode).then((res) => {
                let houseData = res.data.data.properties
                console.log('getHouses3DData--then')
                this.$EventBus.$emit("showThreeDimensions", {
@@ -1349,8 +1213,8 @@
        },

        // 三维接口查询楼栋
        getResident3DData (build_id, adcode, house_name) {
            getHouses(build_id, adcode).then((res) => {
        getResident3DData (build_std_addr_id, adcode, house_name) {
            getHouses(build_std_addr_id, adcode).then((res) => {
                let residentList = res.data.data.properties.nwwqd.features
                console.log('getResident3DData--then')
                let curHousingHWTXA = res.data.data.properties.hwtxa
@@ -1393,11 +1257,18 @@
            this.getResident3DData(this.choosedBuildId, "361102", params.sname)
            console.log('residentDetailsClick--then')
            let residentId = params.std_addr_id.split('|')[2]
            this.getVillagePersonInfo(residentId)
            // this.getVillagePersonInfo(residentId)
            this.houseDate = [
                { realName: '张三', phone: '17755556666', cardNo: '123456999911223344', personType: 1, isKeyPeople: 0, address: '湖北省武汉市江汉区', relationship: '夫妻' },
                { realName: '李四', phone: '17755556666', cardNo: '123456999911223344', personType: 0, isKeyPeople: 0, address: '湖北省武汉市江汉区', relationship: '夫妻' },
                { realName: '王五', phone: '17755556666', cardNo: '123456999911223344', personType: 1, isKeyPeople: 1, address: '湖北省武汉市江汉区', relationship: '夫妻' },
                { realName: '孙六', phone: '17755556666', cardNo: '123456999911223344', personType: 1, isKeyPeople: 0, address: '湖北省武汉市江汉区', relationship: '夫妻' },
                { realName: '薛七', phone: '17755556666', cardNo: '123456999911223344', personType: 0, isKeyPeople: 1, address: '湖北省武汉市江汉区', relationship: '夫妻' },
            ]
            this.residentDetailsTitle = `${params.name}住户信息`
            this.residentDetailsShow = true
            this.residentNoDataText = ' '
            this.residentLoading = true
            // this.residentLoading = true
        },

        residentDetailsClose () {
@@ -1430,16 +1301,16 @@
            }, 200)
            this.isShowFloorCount = true
            // 获取户籍人口重点人口数据
            this.choosedBuildId = item.build_id
            this.choosedBuildId = item.build_uid
            // 重点人口户籍人口
            this.getVillagePersonStatisticInfoByBuildId(item.build_id)
            this.getVillagePersonStatisticInfoByBuildId(item.build_uid)
            // 楼栋单元楼层户室查询-大搜
            this.getUnitHousesData(
                "ebf48ecaa1fd436fa3d40c4600aa051f",
                "361102",
                item.build_id,
                "361100",
                item.build_uid,
                "1|3")
            this.getHouses3DData(item.business_id, "361102", aoiArr)
            this.getHouses3DData(item.build_std_addr_id, "361102", aoiArr)
            this.floorsType = 1
            document.querySelector(".floor-num").style.left = "0px"
            this.lastFloorShow = false
@@ -1622,7 +1493,7 @@
        },

        // 获取历史接警记录
        getAlarmList () {
        getAlarmList (timeArr) {
            if (circleLayer != null) {
                circleLayer.clear()
                circleLayer.remove()
@@ -1638,8 +1509,10 @@
                size: this.callPolicePage.pagesize,
                sfdz: this.villageInfo.name,
                jjdwbh: this.userInfo.dept_id,
                start: this.getHalfYearTime()[0],
                end: this.getHalfYearTime()[1]
                // start: this.getHalfYearTime()[0],
                // end: this.getHalfYearTime()[1],
                start: timeArr[0],
                end: timeArr[1]
            }).then((res) => {
                this.callPolicePage.count = res.data.data.pages

@@ -1782,7 +1655,7 @@
            this.callPolicePage.currentPage = currentPage
            this.policeInfoLoading = true
            this.jqNoDataText = '  '
            this.getAlarmList()
            this.getAlarmList(this.eventTimeArr)
        },

        peopleHandleCurrentChange (currentPage) {
@@ -1953,13 +1826,13 @@
                let bgId = res.data.data.properties.ijnnl
                getSearchExtensively(
                    "ebf48ecaa1fd436fa3d40c4600aa051f",
                    "361102",
                    "361100",
                    "",
                    bgId
                ).then(async (res) => {
                    let chooseBuildItem = []
                    this.buildingList.forEach((item) => {
                        if (item.build_id == res.data.result[0].cid) {
                        if (item.build_std_addr_id == res.data.result[0].cid) {
                            chooseBuildItem = item
                        }
                    })
@@ -2167,7 +2040,7 @@
            border-radius: 10px;
            overflow: hidden;

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

@@ -2202,11 +2075,9 @@
                        left: 10px;
                        right: 10px;
                        bottom: 4px;
                        background: linear-gradient(
                            135deg,
                            rgba(229, 253, 255, 0.013),
                            rgb(43 124 255 / 90%)
                        );
                        background: linear-gradient(135deg,
                                rgba(229, 253, 255, 0.013),
                                rgb(43 124 255 / 90%));
                        z-index: -1;
                    }
                }
@@ -2248,7 +2119,9 @@
                }

                .housing-introduce {
                    & > div {
                    position: relative;

                    &>div {
                        padding: 0 10px;
                        display: flex;

@@ -2265,6 +2138,14 @@
                            text-align: left;
                            line-height: 40px;
                        }
                    }

                    .code {
                        position: absolute;
                        width: 120px;
                        height: 120px;
                        right: 0;
                        top: 0;
                    }
                }
            }
@@ -2311,7 +2192,7 @@
                    }
                }

                & > .floor-content {
                &>.floor-content {
                    .build-info {
                        display: flex;
                        position: relative;
@@ -2360,7 +2241,7 @@
                                    flex-wrap: wrap;
                                    width: 356px;

                                    & > div {
                                    &>div {
                                        display: flex;
                                        align-items: center;
                                        justify-content: center;
@@ -2387,16 +2268,14 @@
                                            right: 0;
                                        }

                                        :deep(.el-checkbox
                                                .el-checkbox__inner) {
                                        :deep(.el-checkbox .el-checkbox__inner) {
                                            width: 12px;
                                            height: 12px;
                                            border-radius: 1px;
                                            border: 0;
                                        }

                                        :deep(.el-checkbox
                                                .el-checkbox__inner::after) {
                                        :deep(.el-checkbox .el-checkbox__inner::after) {
                                            height: 7px;
                                            left: 5px;
                                        }
@@ -2415,7 +2294,7 @@
                        .content {
                            display: flex;

                            & > div {
                            &>div {
                                height: 26px;
                                line-height: 26px;
                                flex: 1;
@@ -2423,11 +2302,11 @@
                                justify-content: center;
                                border-right: 1px solid #fff !important;

                                & > div {
                                &>div {
                                    cursor: default;
                                }

                                & > div:last-child {
                                &>div:last-child {
                                    margin-left: 14px;
                                    font-size: 18px;
                                    font-weight: bold;
@@ -2435,11 +2314,11 @@
                                }
                            }

                            & > div:first-child {
                            &>div:first-child {
                                width: 30%;
                            }

                            & > div:last-child {
                            &>div:last-child {
                                border-right: 1px solid transparent !important;
                            }
                        }
@@ -2464,10 +2343,10 @@
                                display: flex;
                                justify-content: space-around;

                                & > div {
                                &>div {
                                    flex: 1;

                                    & > div:first-child {
                                    &>div:first-child {
                                        height: 30px;
                                        line-height: 30px;
                                        font-size: 18px;
@@ -2475,7 +2354,7 @@
                                        color: #499d99;
                                    }

                                    & > div:last-child {
                                    &>div:last-child {
                                        height: 26px;
                                        line-height: 26px;
                                    }
@@ -2490,8 +2369,8 @@
                            justify-content: space-around;
                            background: rgba(8, 56, 185, 0.5);

                            & > div {
                                & > div:first-child {
                            &>div {
                                &>div:first-child {
                                    height: 30px;
                                    line-height: 30px;
                                    font-size: 18px;
@@ -2529,6 +2408,7 @@
                    }

                    .house-element-info {

                        .condo,
                        .legend {
                            display: flex;
@@ -2551,12 +2431,12 @@
                                display: flex;
                                flex: 1;

                                & > div {
                                &>div {
                                    flex: 1;
                                    display: flex;
                                    align-items: center;

                                    & > span {
                                    &>span {
                                        margin: 0 10px;
                                        width: 14px;
                                        height: 8px;
@@ -2623,7 +2503,7 @@
                                    left: 0;
                                    transition: all 1s;

                                    & > div {
                                    &>div {
                                        margin: 0 4px;
                                        display: flex;
                                        justify-content: center;
@@ -2636,7 +2516,7 @@
                                        border: 0.0925925926vh solid #fff;
                                    }

                                    & > .on {
                                    &>.on {
                                        border: 1px solid orange;
                                        color: orange;
                                    }
@@ -2648,7 +2528,7 @@
                            margin-top: 14px;
                            height: 220px;

                            & > div {
                            &>div {
                                margin: 8px;
                                height: 36px;
                                line-height: 36px;
@@ -2662,7 +2542,7 @@
                                    flex: 1;
                                    display: flex;

                                    & > div {
                                    &>div {
                                        margin: 0 4px;
                                        position: relative;
                                        width: 68px;
@@ -2686,38 +2566,34 @@
                                        }

                                        .focus {
                                            top: calc(
                                                (100% - 18px) / 4 * 2 + 6px
                                            );
                                            top: calc((100% - 18px) / 4 * 2 + 6px);
                                            background: rgb(255, 121, 108);
                                        }

                                        .warning {
                                            top: calc(
                                                (100% - 18px) / 4 * 3 + 12px
                                            );
                                            top: calc((100% - 18px) / 4 * 3 + 12px);
                                            background: rgb(254, 172, 4);
                                        }
                                    }

                                    & > .on {
                                    &>.on {
                                        color: orange;
                                        border-color: orange !important;
                                    }

                                    & > .chuzu {
                                    &>.chuzu {
                                        border: 1px solid #3a8b3a;
                                    }

                                    & > .zizhu {
                                    &>.zizhu {
                                        border: 1px solid #2c77bb;
                                    }

                                    & > .kongzhi {
                                    &>.kongzhi {
                                        border: 1px solid #5c6169;
                                    }

                                    & > .shangye {
                                    &>.shangye {
                                        border: 1px solid #cc9456;
                                    }
                                }
@@ -2784,11 +2660,9 @@
    height: 100%;
    overflow: hidden;
    border-radius: 2px;
    background: linear-gradient(
        135deg,
        rgba(252, 252, 252, 0.108),
        rgb(254, 254, 254)
    );
    background: linear-gradient(135deg,
            rgba(252, 252, 252, 0.108),
            rgb(254, 254, 254));
    animation: prog 3s ease infinite;
}