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

shuishen

2023-01-07 f4e23c893b66b831bb8bd675e39b641501151570

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

 src/styles/media/index.scss

@@ -341,7 +341,6 @@


                    }

                    .house-page {
                        .container-content {

@@ -2452,9 +2451,11 @@
            top: countSizeVh(116) !important;
            left: countSizeVw(0, 1920) !important;
        }
                    // el-popover-6062

        .el-popover {
            min-width: countSizeVw(150, 1920);
            width: countSizeVw(400, 1920);
            padding: countSizeVh(12);
            border-radius: countSizeVh(4);
            font-size: countSizeVh(14);

 src/views/home/components/leftContainer.vue

@@ -11,59 +11,93 @@
                        共
                        <span :class="{ choosed: peopletype == 0 }">100</span>人
                        <span :class="{ choosed: peopletype == 1 }">1</span>人
                    </div> -->
                    </div>-->
                </div>
                <div class="sub-tab" v-show="peopletype == 0">
                    <div class="tab" :class="{ 'select-on-tab': tabType == 0 }" @click="personTabClick(0)">
                    <div
                        class="tab"
                        :class="{ 'select-on-tab': tabType == 0 }"
                        @click="personTabClick(0)"
                    >
                        <div class="tab-title-small">户籍人口:</div>
                        <div class="tab-title-small">164.57万人</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">1人</div>
                    </div>
                    <!-- <div class="tab3" :class="{ 'select-on-tab': tabType == 2 }" @click="personTabClick(2)">
                        <div class="num">91995人</div>
                        <div class="type">境外人口</div>
                    </div> -->
                    </div>-->
                </div>
                <div id="PersonEcharts" class="echarts-box"></div>
                <div class="back" title="返回上一级" v-show="dataDeep == 2 && peopletype == 0" @click="backBegin"></div>
                <div
                    class="back"
                    title="返回上一级"
                    v-show="dataDeep == 2 && peopletype == 0"
                    @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">
                    </path>
                    <radialGradient id="border-box-8-gradient-974b4d7cfafa444396861ca1d1173c8c" cx="50%" cy="50%"
                        r="50%">
                        <stop offset="0%" stop-color="#fff" stop-opacity="1"></stop>
                        <stop offset="100%" stop-color="#fff" stop-opacity="0"></stop>
                    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"></animateMotion>
                                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">
                    </animate>
                <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>
@@ -71,11 +105,19 @@
            <div class="box">
                <div class="title">现有房屋</div>
                <div class="sub-tab">
                    <div class="tab" :class="{ 'select-on-tab': tabTypeTwo == 0 }" @click="houseTabClick(0)">
                    <div
                        class="tab"
                        :class="{ 'select-on-tab': tabTypeTwo == 0 }"
                        @click="houseTabClick(0)"
                    >
                        <div class="tab-title-small">实有房屋:</div>
                        <div class="tab-title-small">182万户</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">634个</div>
                    </div>
@@ -84,11 +126,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">
                    </animate>
                <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>
@@ -96,11 +146,19 @@
            <div class="box">
                <div class="title">现有地</div>
                <div class="sub-tab">
                    <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">634个</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">634个</div>
                    </div>
@@ -109,11 +167,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">
                    </animate>
                <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>
@@ -132,7 +198,7 @@
const myLandColors = ['#4150d8', '#28bf7e', '#ed7c2f', '#f2a93b', '#f9cf36', '#4a5bdc', '#4cd698', '#f4914e', '#fcb75b', '#ffe180', '#b6c2ff', '#96edc1']

export default {
    data() {
    data () {
        return {
            tabType: 0,
            peopletype: 0,
@@ -253,7 +319,7 @@
            keyPersonSelectSaveArr: [],
        }
    },
    mounted() {
    mounted () {
        this.initLandEcharts()
        this.initPersonEcharts()
        this.inithouseEcharts()
@@ -265,20 +331,20 @@
        })
    },
    methods: {
        echartsResize() {
        echartsResize () {
            homePersonmyChart && homePersonmyChart != null && homePersonmyChart.resize()
            landMyChart && landMyChart != null && landMyChart.resize()
            keyPersonmyChart && keyPersonmyChart != null && keyPersonmyChart.resize()
            houseMyChart && houseMyChart != null && houseMyChart.resize()
        },

        initPersonEcharts() {
        initPersonEcharts () {
            var chartDom = document.getElementById('PersonEcharts')
            homePersonmyChart = this.$echarts.init(chartDom)
            homePersonmyChart.setOption(this.initPersonOptions(['车站所', '沙溪所', '灵溪所', '北门所', '江光所'], [881, 2211, 6414, 4321, 1232], ['#06B5D7', '#44C0C1', '#71C8B1']))
        },

        initPersonOptions(xDate, yDate, colors) {
        initPersonOptions (xDate, yDate, colors) {
            return {
                tooltip: {
                    trigger: 'item',
@@ -355,7 +421,7 @@
            }
        },

        personTabClick(type) {
        personTabClick (type) {
            this.tabType = type
            this.dataDeep = 1
            let xDate, yDate, colors
@@ -370,17 +436,17 @@
                colors = ['#06B5D7', '#44C0C1', '#71C8B1']
                homePersonmyChart.setOption(this.initPersonOptions(xDate, yDate, colors), true)
            } else if (type == 1) {
                this.peopleTabClick(type);
                this.peopleTabClick(type)
            }
        },

        inithouseEcharts() {
        inithouseEcharts () {
            var chartDom = document.getElementById('houseEcharts')
            houseMyChart = this.$echarts.init(chartDom)
            houseMyChart.setOption(this.initHouseOptions(['商业房屋', '居民住宅', '公共用房', '文化场所', '政府建筑'], [88188, 1222211, 464104, 43201, 12302], [{ 'value': 1222211, 'realValue': 88188 }, { 'value': 1222211, 'realValue': 1222211 }, { 'value': 1222211, 'realValue': 464104 }, { 'value': 1222211, 'realValue': 43201 }, { 'value': 1222211, 'realValue': 12302 }]))
        },

        initHouseOptions(xDate, y1Date, y2Date) {
        initHouseOptions (xDate, y1Date, y2Date) {
            return {
                tooltip: {
                    trigger: 'item',
@@ -470,7 +536,7 @@
            }
        },

        houseTabClick(type) {
        houseTabClick (type) {
            this.tabTypeTwo = type

            let xDate, y1Date, y2Date
@@ -487,19 +553,19 @@
            houseMyChart.setOption(this.initHouseOptions(xDate, y1Date, y2Date), true)
        },

        initLandEcharts() {
        initLandEcharts () {
            var chartDom = document.getElementById('landEcharts')
            landMyChart = this.$echarts.init(chartDom)
            landMyChart.setOption(this.initLandOptions(['车站所', '沙溪所', '灵溪所', '北门所', '江光所', '水南所', '秦峰所', '茅家岭所', '西市所', '朝阳所'], [6414, 2211, 4321, 1232, 881, 6414, 2211, 4321, 1232, 881]))
        },

        initLandOptions(xDate, yDate) {
        initLandOptions (xDate, yDate) {
            return {
                grid: {
                    top: '4%',
                    left: '12%',
                    right: '4%',
                    bottom: '18%'
                    bottom: '24%'
                },
                tooltip: {
                    trigger: 'item',
@@ -517,6 +583,7 @@
                    axisLabel: {
                        color: "#fff",
                        interval: 0,
                        rotate: 45,
                        fontSize: fontSize(14)
                    },
                    axisLine: {
@@ -540,6 +607,7 @@
                        data: yDate,
                        type: 'bar',
                        barWidth: '24%',
                        barCategoryGap: '10%',
                        itemStyle: {
                            normal: {
                                barBorderRadius: [30, 30, 0, 0],
@@ -552,34 +620,34 @@
                    }
                ],
                // zoomData: [  // 有滚动条 平移
                dataZoom: [  // 有滚动条 平移
                    {
                        type: 'slider',
                        show: true,
                        realtime: true,
                        start: 0,
                        end: 40,  // 初始展示40%
                        height: 4,
                        backgroundColor: 'rgba(47,69,84,0.2)',
                        fillerColor: "rgba(17, 100, 210, 0.42)", // 滚动条颜色
                        borderColor: "rgba(17, 100, 210, 0.12)",
                        handleSize: 0, // 两边手柄尺寸
                        showDetail: false, // 拖拽时是否展示滚动条两侧的文字
                        top: '96%',
                    },
                    {
                        type: "inside",  // 支持内部鼠标滚动平移
                        start: 0,
                        end: 40,
                        zoomOnMouseWheel: false,  // 关闭滚轮缩放
                        moveOnMouseWheel: true, // 开启滚轮平移
                        moveOnMouseMove: true  // 鼠标移动能触发数据窗口平移 
                    }
                ]
                // dataZoom: [  // 有滚动条 平移
                //     {
                //         type: 'slider',
                //         show: true,
                //         realtime: true,
                //         start: 0,
                //         end: 40,  // 初始展示40%
                //         height: 4,
                //         backgroundColor: 'rgba(47,69,84,0.2)',
                //         fillerColor: "rgba(17, 100, 210, 0.42)", // 滚动条颜色
                //         borderColor: "rgba(17, 100, 210, 0.12)",
                //         handleSize: 0, // 两边手柄尺寸
                //         showDetail: false, // 拖拽时是否展示滚动条两侧的文字
                //         top: '96%',
                //     },
                //     {
                //         type: "inside",  // 支持内部鼠标滚动平移
                //         start: 0,
                //         end: 40,
                //         zoomOnMouseWheel: false,  // 关闭滚轮缩放
                //         moveOnMouseWheel: true, // 开启滚轮平移
                //         moveOnMouseMove: true  // 鼠标移动能触发数据窗口平移 
                //     }
                // ]
            }
        },

        landTabClick(type) {
        landTabClick (type) {
            this.tabTypeThree = type
            let xDate, yDate

@@ -594,7 +662,7 @@
            landMyChart.setOption(this.initLandOptions(xDate, yDate), true)
        },

        peopleTabClick(type) {
        peopleTabClick (type) {
            // this.peopletype = type
            homePersonmyChart.dispose()
            this.$nextTick(() => {
@@ -611,7 +679,7 @@
            })
        },

        clickPeopleChart() {
        clickPeopleChart () {
            homePersonmyChart.on('click', params => {
                let xDate, yDate, colors
                this.dataDeep = 2
@@ -696,7 +764,7 @@
            })
        },

        clickLandChart() {
        clickLandChart () {
            landMyChart.on('click', params => {
                this.landVisible = true
                this.landTitle = params.name
@@ -708,7 +776,7 @@
            })
        },

        clickkeyPersonChart() {
        clickkeyPersonChart () {
            keyPersonmyChart.on('click', params => {
                let keyPersonDetailNewArr = []
                this.keyPersonSelectArr.some((item) => {
@@ -720,14 +788,14 @@
            })
        },

        initkeyPersonEcharts() {
        initkeyPersonEcharts () {
            var chartDom = document.getElementById('PersonEcharts')
            keyPersonmyChart = this.$echarts.init(chartDom)
            let dataArr = this.getKeyPersonCount(this.keyPersonSelectArr)
            keyPersonmyChart.setOption(this.initkeyPersonOption(dataArr))
        },

        initkeyPersonOption(dataArr) {
        initkeyPersonOption (dataArr) {
            return {
                tooltip: {
                    trigger: 'item',
@@ -787,7 +855,7 @@
            }
        },

        selectPoliceChangeData(name) {
        selectPoliceChangeData (name) {
            if (this.peopletype == 0 && this.tabType == 0) {
                let xDate, yDate, colors
                if (name == '车站所') {
@@ -845,7 +913,7 @@

        },

        backBegin() {
        backBegin () {
            this.dataDeep = 1
            let xDate, yDate, colors
            if (this.tabType == 0) {
@@ -864,7 +932,7 @@
            homePersonmyChart.setOption(this.initPersonOptions(xDate, yDate, colors), true)
        },

        getKeyPersonCount(arr) {
        getKeyPersonCount (arr) {
            let valueArr = [0, 0, 0, 0, 0, 0, 0]
            arr.some(item => {
                if (item.type == '涉恐人员') {
@@ -895,7 +963,7 @@
            return KeyPersonDataArr
        },

        selectAreaChangeData(name) {
        selectAreaChangeData (name) {
            if (this.peopletype == 1) {
                if (this.peopletype == 1 && name != '全部') {
                    let arr = []
@@ -919,7 +987,7 @@

    },

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

        if (homePersonmyChart) {
@@ -993,7 +1061,6 @@
        background-size: 100% 100%;
        background-repeat: no-repeat;


        .box {
            display: flex;
            position: absolute;
@@ -1046,7 +1113,7 @@
                color: #fff;
            }

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

                &>div {
                & > div {
                    height: 22px;
                    line-height: 22px;
                }

 src/views/house/index.vue

@@ -190,11 +190,11 @@

                            <div class="content">
                                <div class="one">
                                    <div>
                                    <div @click="goTOPeopleDetail">
                                        <div>160</div>
                                        <div>户籍人口</div>
                                    </div>
                                    <div>
                                    <div @click="goTOPeopleDetail">
                                        <div style="color:#FF796C">16</div>
                                        <div>重点人口</div>
                                    </div>
@@ -551,6 +551,30 @@
                <el-table-column prop="workplace" label="工作地" width="180"></el-table-column>
            </el-table>-->
        </el-dialog>

        <el-dialog
            :title="keyPersonTitle"
            :modal="false"
            :visible.sync="keyPersonVisible"
            :before-close="keyPersonBeforeClose"
            :close-on-click-modal="true"
            class="keyPerson-details-box"
        >
            <el-table
                :data="keyPersonDetailArr"
                style="width: 100%"
                :header-cell-style="{ 'text-align': 'center', 'background-color': '#203c60', 'borderColor': '#324e75' }"
                :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75', 'cursor': 'pointer' }"
            >
                <el-table-column prop="type" label="重点人员类型"></el-table-column>
                <el-table-column prop="name" label="姓名"></el-table-column>
                <el-table-column prop="sex" label="性别"></el-table-column>
                <el-table-column prop="address" label="地址"></el-table-column>
                <el-table-column prop="phone" label="电话"></el-table-column>
                <el-table-column prop="policeStation" label="所属派出所"></el-table-column>
                <el-table-column prop="housingEastate" label="所属责任区"></el-table-column>
            </el-table>
        </el-dialog>
    </div>
</template>

@@ -741,6 +765,64 @@
            parkingLotData: [],
            comeOutData: [],
            businessData: [],
            keyPersonVisible: false,
            keyPersonDetailArr: [
                {
                    "name": "张某某",
                    "sex": "女",
                    "address": "XXXXXX",
                    "phone": "132XXXX6666",
                    "policeStation": "车站所",
                    "housingEastate": "责任区1",
                    "type": "涉恐人员"
                },
                {
                    "name": "黄某某",
                    "sex": "男",
                    "address": "XXXXXX",
                    "phone": "132XXXX6666",
                    "policeStation": "沙溪所",
                    "housingEastate": "责任区4",
                    "type": "涉恐人员"
                },
                {
                    "name": "邓某某",
                    "sex": "女",
                    "address": "XXXXXX",
                    "phone": "132XXXX6666",
                    "policeStation": "灵溪所",
                    "housingEastate": "责任区3",
                    "type": "涉恐人员"
                },
                {
                    "name": "章某某",
                    "sex": "女",
                    "address": "XXXXXX",
                    "phone": "132XXXX6666",
                    "policeStation": "江光所",
                    "housingEastate": "责任区1",
                    "type": "涉恐人员"
                },
                {
                    "name": "王某某",
                    "sex": "女",
                    "address": "XXXXXX",
                    "phone": "132XXXX6666",
                    "policeStation": "车站所",
                    "housingEastate": "责任区3",
                    "type": "涉恐人员"
                },
                {
                    "name": "贾某某",
                    "sex": "男",
                    "address": "XXXXXX",
                    "phone": "132XXXX6666",
                    "policeStation": "灵溪所",
                    "housingEastate": "责任区2",
                    "type": "涉恐人员"
                }
            ],

        }
    },
    watch: {
@@ -1150,6 +1232,10 @@
                },
            })
        },

        goTOPeopleDetail () {
            this.keyPersonVisible = true
        },
    },

    destroyed () {
@@ -1433,8 +1519,7 @@
                    }

                    .ridgepole-info {

                        .title{
                        .title {
                            // border-bottom: 1px solid #33566c;
                            margin-left: 10px;
                        }
@@ -1450,6 +1535,9 @@
                                justify-content: center;
                                border-right: 1px solid #50555f;

                                & > div {
                                    cursor: pointer;
                                }
                                & > div:last-child {
                                    margin-left: 14px;
                                    font-size: 18px;
@@ -1469,12 +1557,15 @@
                    }

                    .people-info {
                        .title{
                        .title {
                            margin-left: 10px;
                        }
                        .content {
                            background: rgba(8, 56, 185, 0.5);
                            .one div {
                                cursor: pointer;
                            }

                            background: rgba(8, 56, 185, 0.5);

                            .two {
                                margin-top: 16px;
@@ -1528,7 +1619,6 @@
                    .ridgepole-info,
                    .people-info,
                    .house-info {
                        
                        .title {
                            height: 40px;
                            line-height: 40px;
@@ -1541,9 +1631,8 @@
                    }

                    .house-element-info {
                        .condo{
                        .condo {
                            margin-top: 5px;

                        }
                    }


 src/views/police/index.vue

@@ -107,7 +107,12 @@
                        :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75', 'cursor': 'pointer' }"
                        :height="currentTableHeight"
                    >
                        <el-table-column prop="name" label="名称" min-width="25%"></el-table-column>
                        <el-table-column
                            prop="name"
                            label="名称"
                            min-width="25%"
                            :show-overflow-tooltip="true"
                        ></el-table-column>
                        <el-table-column prop="phoneType" label="类型" min-width="25%"></el-table-column>
                        <el-table-column prop="state" label="状态" min-width="25%">
                            <template slot-scope="scope">
@@ -158,9 +163,14 @@
                        :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75', 'cursor': 'pointer' }"
                        :height="currentTableHeight"
                    >
                        <el-table-column prop="name" label="名称" min-width="25%"></el-table-column>
                        <el-table-column prop="dtType" label="类型" min-width="25%"></el-table-column>
                        <el-table-column prop="state" label="状态" min-width="25%">
                        <el-table-column
                            prop="name"
                            label="名称"
                            min-width="40%"
                            :show-overflow-tooltip="true"
                        ></el-table-column>
                        <el-table-column prop="dtType" label="类型" min-width="20%"></el-table-column>
                        <el-table-column prop="state" label="状态" min-width="15%">
                            <template slot-scope="scope">
                                <div class="state-box" :class="{ online: scope.row.state == '在线' }"></div>
                            </template>
@@ -209,7 +219,12 @@
                        :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75', 'cursor': 'pointer' }"
                        :height="currentTableHeight"
                    >
                        <el-table-column prop="name" label="名称" min-width="25%"></el-table-column>
                        <el-table-column
                            prop="name"
                            label="名称"
                            min-width="25%"
                            :show-overflow-tooltip="true"
                        ></el-table-column>
                        <el-table-column prop="phoneType" label="类型" min-width="25%"></el-table-column>
                        <el-table-column label="状态" min-width="25%">
                            <template slot-scope="scope">
@@ -1071,6 +1086,12 @@
                    background-color: #4ccc7d;
                }
            }

            :deep(.el-table td.el-table__cell div) {
                overflow: hidden;
                white-space: nowrap;
                text-overflow: ellipsis;
            }
        }

        .track-box {