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

guanqb

2022-10-18 46d5993f53bf814c13c0fa2468c2e01b7ac4d761

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

 package-lock.json

Diff too large

 public/img/housing/five.jpg

 public/img/housing/four.jpg

 public/img/housing/one.jpg

 public/img/housing/three.jpg

 public/img/housing/two.png

 src/assets/data/housingData.js

New file
@@ -0,0 +1,155 @@
/*
 * @Author: shuishen 1109946754@qq.com
 * @Date: 2022-10-17 16:03:02
 * @LastEditors: shuishen 1109946754@qq.com
 * @LastEditTime: 2022-10-17 17:37:09
 * @FilePath: \srs-police-affairs\src\assets\data\housingData.js
 * @Description: 
 * 
 * Copyright (c) 2022 by shuishen 1109946754@qq.com, All Rights Reserved. 
 */
export default [
    {
        name: '信美家园',
        img: '/img/housing/one.jpg',
        classify: '住宅区',
        area: 'xxx警务室',
        principal: '王敦顿',
        address: '江西省上饶市市广信区信美路18号'
    },
    {
        name: '绿野星城-金凤园',
        img: '/img/housing/two.png',
        classify: '小区',
        area: 'xxx警务室',
        principal: '林光',
        address: '江西省上饶市市广信区信美路18-031号附近'
    },
    {
        name: '阳明花园',
        img: '/img/housing/three.jpg',
        classify: '住宅区',
        area: 'xxx警务室',
        principal: '李刚',
        address: '江西省上饶市市广信区信美路12号'
    },
    {
        name: '蝶景园',
        img: '/img/housing/four.jpg',
        classify: '住宅区',
        area: 'xxx警务室',
        principal: '周坤',
        address: '江西省上饶市市广信区凤凰西大道68号'
    },
    {
        name: '翰园小区',
        img: '/img/housing/five.jpg',
        classify: '小区',
        area: 'xxx警务室',
        address: '江西省上饶市市广信区育才路90号'
    },
    {
        name: '友邦公馆',
        img: '/img/housing/one.jpg',
        classify: '住宅区',
        area: 'xxx警务室',
        principal: '王敦顿',
        address: '江西省上饶市市广信区武夷山大道与七六路交界处'
    },
    {
        name: '雍锦湾',
        img: '/img/housing/two.png',
        classify: '住宅区',
        area: 'xxx警务室',
        principal: '林光',
        address: '江西省上饶市市广信区武夷山大道文英国际西北侧约170米'
    },
    {
        name: '中京禧园',
        img: '/img/housing/three.jpg',
        classify: '小区',
        area: 'xxx警务室',
        principal: '李刚',
        address: '江西省上饶市市广信区凤凰西大道德爱中学南侧约190米'
    },
    {
        name: '绿野幸福里',
        img: '/img/housing/four.jpg',
        classify: '小区',
        area: 'xxx警务室',
        principal: '周坤',
        address: '江西省上饶市市广信区吉阳西路168号'
    },
    {
        name: '中核七一三旭日小区',
        img: '/img/housing/five.jpg',
        classify: '小区',
        area: 'xxx警务室',
        principal: '高猛',
        address: '江西省上饶市市广信区武夷山大道9号713'
    },
    {
        name: '筑城家园',
        img: '/img/housing/one.jpg',
        classify: '住宅区',
        area: 'xxx警务室',
        principal: '王敦顿',
        address: '江西省上饶市市广信区三清山西大道58号'
    },
    {
        name: '西城家园',
        img: '/img/housing/two.png',
        classify: '住宅区',
        area: 'xxx警务室',
        principal: '林光',
        address: '江西省上饶市市广信区渡头街广信区第三小学东侧约220米'
    },
    {
        name: '恒大御府',
        img: '/img/housing/three.jpg',
        classify: '住宅区',
        area: 'xxx警务室',
        principal: '李刚',
        address: '江西省上饶市市广信区三清山大道和锦园后面罗墩'
    },
    {
        name: '凤山花园',
        img: '/img/housing/four.jpg',
        classify: '小区',
        area: 'xxx警务室',
        principal: '周坤',
        address: '江西省上饶市市广信区明叔大道与天佑大道交叉路口往西约230米'
    },
    {
        name: '博能信江印象',
        img: '/img/housing/five.jpg',
        classify: '住宅区',
        area: 'xxx警务室',
        principal: '高猛',
        address: '江西省上饶市市广信区惟义西路5号'
    },
    {
        name: '新科花园',
        img: '/img/housing/one.jpg',
        classify: '小区',
        area: 'xxx警务室',
        principal: '周坤',
        address: '江西省上饶市市广信区惟义西路21号'
    },
    {
        name: '金城花园',
        img: '/img/housing/two.png',
        classify: '小区',
        area: 'xxx警务室',
        principal: '李刚',
        address: '江西省上饶市市广信区金城花园(兴园大道东50米)'
    },
    {
        name: '瑞弘华庭',
        img: '/img/housing/three.jpg',
        classify: '住宅区',
        area: 'xxx警务室',
        principal: '林光',
        address: '江西省上饶市市广信区兴园大道'
    }
]

 src/styles/base/index.scss

@@ -2,6 +2,8 @@
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    scrollbar-color: rgba(7, 22, 37, 0.8) hsla(0, 0%, 84.7%, 0.2);
    scrollbar-width: thin;
}

html,
@@ -39,7 +41,7 @@
}

::-webkit-scrollbar-track {
    background-color: #fff;
    background-color: hsla(0, 0%, 84.7%, 0.2);
}

::-webkit-scrollbar-thumb:window-inactive {

 src/utils/search.js

New file
@@ -0,0 +1,38 @@
/*
 * @Author: shuishen 1109946754@qq.com
 * @Date: 2022-10-17 09:55:22
 * @LastEditors: shuishen 1109946754@qq.com
 * @LastEditTime: 2022-10-17 14:53:08
 * @FilePath: \srs-police-affairs\src\utils\search.js
 * @Description: 
 * 
 * Copyright (c) 2022 by shuishen 1109946754@qq.com, All Rights Reserved. 
 */

// 模糊查询
export function listQuery (dataArray, searchValue, keyValue) {

    let valArray = []

    dataArray.forEach(item => {
        if (item[keyValue].includes(searchValue)) {
            valArray.push(item)
        }
    })

    return valArray
}

// 精准查询
export function accurateSearch (dataArray, searchValue, keyValue) {

    let valArray = []

    dataArray.forEach(item => {
        if (item[keyValue] == searchValue) {
            valArray.push(item)
        }
    })

    return valArray
}

 src/utils/tool.js

New file
@@ -0,0 +1,42 @@
/*
 * @Author: shuishen 1109946754@qq.com
 * @Date: 2022-10-17 09:34:19
 * @LastEditors: shuishen 1109946754@qq.com
 * @LastEditTime: 2022-10-17 09:45:20
 * @FilePath: \srs-police-affairs\src\utils\tool.js
 * @Description: 
 * 
 * Copyright (c) 2022 by shuishen 1109946754@qq.com, All Rights Reserved. 
 */
function executeFunction (callbackArray, amount) {
    return new Promise(function (resolve, reject) {
        let index = 0

        let currentIndex = 1

        function execute () {

            try {
                callbackArray[index]()
                index++
            } catch (e) {

                return new Error(e)

            } finally {

                if (currentIndex == callbackArray.length) {
                    resolve
                }

                execute()
                currentIndex++
            }

        }

        execute()
    })
}

export default executeFunction

 src/views/house/index.vue

@@ -2,7 +2,7 @@
 * @Author: shuishen 1109946754@qq.com
 * @Date: 2022-08-18 16:18:17
 * @LastEditors: shuishen 1109946754@qq.com
 * @LastEditTime: 2022-09-27 17:15:30
 * @LastEditTime: 2022-10-17 17:05:59
 * @FilePath: \srs-police-affairs\src\views\house\index.vue
 * @Description: 小区-栋-层-房屋
 * 
@@ -12,14 +12,26 @@
<template>
    <div class="container">
        <div class="search-box">
            <!-- <el-input size="small" placeholder="请输入小区名称" v-model="searchHouse">
                <el-button slot="append" icon="el-icon-search"></el-button>
            </el-input>-->
            <input type="text" placeholder="请输入搜索条件" />
            <button class="el-icon-search"></button>
            <input v-model="searchValue" @input="searchChange" type="text" placeholder="请输入搜索条件" />
            <button @click="searchClick" class="el-icon-search"></button>
        </div>

        <div v-show="searchValBoxShow" class="search-val-box">
            <div>
                <div
                    @click="searchVlaClick(item)"
                    v-for="(item, index) in searchArray"
                    :key="index"
                >{{item.name}}</div>
            </div>
        </div>

        <div class="result-content">
            <div class="housing-estate-info">
                <div class="housing-title">
                    书苑名家
                    <div class="progress"></div>
                </div>
                <div class="housing-bg">
                    <img style="width: 100%; height: 100%;" src="/img/bg.png" alt />
                </div>
@@ -481,7 +493,10 @@
</template>

<script>
import { listQuery, accurateSearch } from "@/utils/search.js"

import villageHousesList from '@/assets/data/villageHouse.js'

import house from '../../assets/data/house'

export default {
@@ -590,6 +605,10 @@
            nextFloorShow: true,
            levelList: [],
            houseDate: {},

            searchValue: '',
            searchArray: [],
            searchValBoxShow: false
        }
    },
    created () {
@@ -665,6 +684,7 @@
            this.lastFloorShow = false
            this.apartmentValue = '1'
        },

        nextBtn () {
            if (parseInt(document.querySelector(".build-box").offsetWidth) > Math.abs(parseInt(document.querySelector(".build-box").style.left)) + 356) {
                document.querySelector(".build-box").style.left = parseInt(document.querySelector(".build-box").style.left) - 356 + 'px'
@@ -674,6 +694,7 @@
                }
            }
        },

        lastBtn () {
            document.querySelector(".build-box").style.left = parseInt(document.querySelector(".build-box").style.left) + 356 + 'px'
            this.nextBtnShow = true
@@ -681,6 +702,7 @@
                this.lastBtnShow = false
            }
        },

        lastFloorBtn () {
            console.log(111)
            document.querySelector(".floor-num").style.left = parseInt(document.querySelector(".floor-num").style.left) + 84 + 'px'
@@ -690,6 +712,7 @@
            }
            console.log('111', Math.abs(parseInt(document.querySelector(".floor-num").style.left)))
        },

        nextFloorBtn () {
            console.log('点击了有按钮')
            if (parseInt(document.querySelector(".floor-num").offsetWidth) > Math.abs(parseInt(document.querySelector(".floor-num").style.left)) + 84) {
@@ -700,22 +723,43 @@
                }
            }
        },

        chooseUnit (value) {
            this.floorsType = 1
            document.querySelector(".floor-num").style.left = '0px'
            this.lastFloorShow = false
            this.levelList = this.ridgepoleNum1.unit[value - 1].storey
        },

        isHaveLiudong (arr) {
            return arr.some((item) => { return item.peopleType == '流动人口' })
        },

        isHaveZhongdian (arr) {
            return arr.some((item) => { return item.peopleType == '重点人员' })
        },

        isHaveJingwai (arr) {
            return arr.some((item) => { return item.peopleType == '境外人口' })
        },

        searchChange () {
            if (this.searchValue == '') {
                this.searchValBoxShow = false
                this.searchArray = []
            } else {
                this.searchValBoxShow = true
            }
        },

        searchClick () {
            this.searchValBoxShow = false
        },

        searchVlaClick (item) {
            this.searchValBoxShow = false
            this.searchArray = []
        }
    },

    destroyed () {
@@ -737,13 +781,14 @@
    li {
        list-style: none;
    }

    .search-box {
        padding: 5px;
        height: 48px;
        display: flex;

        input {
            width: 300px;
            flex: 1;
            height: 100%;
            font-size: 18px;
            text-indent: 1em;
@@ -775,13 +820,67 @@
        }
    }

    .search-val-box {
        display: flex;
        flex-direction: column;
        position: absolute;
        top: 48px;
        left: 6px;
        width: calc(100% - 12px);
        max-height: 160px;
        text-align: left;
        color: #fff;
        background: rgba(16, 29, 74, 0.9);
        z-index: 1111;
        border-radius: 10px;
        overflow: hidden;

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

            div {
                padding: 0 10px;
                line-height: 36px;
                cursor: pointer;
            }
        }
    }

    .result-content {
        height: calc(100% - 48px);
        overflow-x: hidden;
        overflow-y: auto;

        .housing-estate-info {
            .housing-title {
                padding: 0 10px;
                position: relative;
                height: 40px;
                text-align: left;
                line-height: 40px;
                font-size: 28px;
                font-weight: bold;
                z-index: 1;

                &::after {
                    content: '';
                    position: absolute;
                    top: 18px;
                    left: 10px;
                    right: 10px;
                    bottom: 4px;
                    background: linear-gradient(
                        135deg,
                        rgb(33 150 243 / 74%),
                        rgb(254 254 254 / 0%)
                    );
                    z-index: -1;
                }
            }

            .housing-bg {
                margin-top: 6px;
                height: 200px;
            }

@@ -1172,4 +1271,39 @@
        }
    }
}

.progress {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 2px;
    overflow: hidden;
    border-radius: 2px;
}

.progress::after {
    content: '';
    position: absolute;
    left: 0;
    width: 80%;
    height: 100%;
    overflow: hidden;
    border-radius: 2px;
    background: linear-gradient(
        135deg,
        rgba(252, 252, 252, 0.108),
        rgb(254, 254, 254)
    );
    animation: prog 3s ease infinite;
}

@keyframes prog {
    0% {
        transform: translate(-80%, 0);
    }

    100% {
        transform: translate(180%, 0);
    }
}
</style>

 src/views/police/index.vue

@@ -2,7 +2,7 @@
 * @Author: shuishen 1109946754@qq.com
 * @Date: 2022-08-18 16:18:17
 * @LastEditors: shuishen 1109946754@qq.com
 * @LastEditTime: 2022-09-27 14:12:35
 * @LastEditTime: 2022-10-17 15:18:20
 * @FilePath: \srs-police-affairs\src\views\police\index.vue
 * @Description: 辖区管理
 * 
@@ -15,9 +15,20 @@
            <div class="police-car" @click="navClick(1)" :class="{'choosed':navType == 1}">警车</div>
            <div class="interphone" @click="navClick(2)" :class="{'choosed':navType == 2}">手台</div>
        </div>

        <div class="search-box">
            <input type="text" placeholder="请输入搜索条件" />
            <button class="el-icon-search"></button>
            <input v-model="searchValue" @input="searchChange" type="text" placeholder="请输入搜索条件" />
            <button @click="searchClick" class="el-icon-search"></button>
        </div>

        <div v-show="searchValBoxShow" class="search-val-box">
            <div>
                <div
                    @click="searchVlaClick(item)"
                    v-for="(item, index) in searchArray"
                    :key="index"
                >{{item.name}}</div>
            </div>
        </div>

        <div class="list-show">
@@ -35,7 +46,7 @@
                                <span>{{(currentPage - 1) * pagesize + scope.$index + 1}}</span>
                            </template>
                        </el-table-column>
                        <el-table-column prop="carId" label="车牌号" width="170"></el-table-column>
                        <el-table-column prop="name" label="名称" width="170"></el-table-column>
                        <el-table-column prop="carType" label="警车类型" width="180"></el-table-column>
                        <!-- <el-table-column prop="position" label="经纬度"></el-table-column> -->
                    </el-table>
@@ -66,7 +77,7 @@
                                <span>{{(currentPage - 1) * pagesize + scope.$index + 1}}</span>
                            </template>
                        </el-table-column>
                        <el-table-column prop="id" label="手台号" width="170"></el-table-column>
                        <el-table-column prop="name" label="名称" width="170"></el-table-column>
                        <el-table-column prop="phoneType" label="手台类型" width="180"></el-table-column>
                    </el-table>
                </div>
@@ -146,6 +157,8 @@
</template>

<script>
import { listQuery, accurateSearch } from "@/utils/search.js"

import carList from '@/assets/data/car.js'
import phoneList from '@/assets/data/phone.js'
export default {
@@ -161,6 +174,9 @@
            phoneDetails: {},
            phoneTitle: '',
            phoneVisible: false,
            searchValue: '',
            searchArray: [],
            searchValBoxShow: false
        }
    },
    created () {
@@ -168,7 +184,6 @@
        this.phoneList = phoneList
    },
    mounted () {
        this.navClick()
    },
    updated () {
    },
@@ -177,9 +192,17 @@
            this.currentPage = currentPage
            console.log(this.currentPage)  //点击第几页
        },

        navClick (type) {
            if (!type) { type = 1 }
            this.navType = type

            this.searchValue = ''
            this.searchValBoxShow = false
            this.searchArray = []
            this.carList = carList
            this.phoneList = phoneList

            if (type == 1) {
                this.$EventBus.$emit('mapClearLayer', {
                    layerName: 'phoneLayers',
@@ -248,6 +271,41 @@

        phoneBeforeClose () {
            this.phoneVisible = false
        },

        searchChange () {
            if (this.searchValue == '') {
                this.searchValBoxShow = false
                this.searchArray = []
                this.carList = carList
                this.phoneList = phoneList
            } else {
                if (this.navType == 1) {
                    this.searchArray = listQuery(carList, this.searchValue, 'name')
                } else {
                    this.searchArray = listQuery(phoneList, this.searchValue, 'name')
                }
                this.searchValBoxShow = true
            }
        },

        searchClick () {
            this.searchValBoxShow = false
            if (this.navType == 1) {
                this.carList = accurateSearch(carList, this.searchValue, 'name')
            } else {
                this.phoneList = accurateSearch(phoneList, this.searchValue, 'name')
            }
        },

        searchVlaClick (item) {
            this.searchValBoxShow = false
            this.searchArray = []
            if (this.navType == 1) {
                this.carList = [item]
            } else {
                this.phoneList = [item]
            }
        }
    },

@@ -297,12 +355,12 @@
    }

    .search-box {
        padding: 5px;
        padding: 6px;
        height: 48px;
        display: flex;

        input {
            width: 300px;
            flex: 1;
            height: 100%;
            font-size: 18px;
            text-indent: 1em;
@@ -311,12 +369,15 @@
            border: 1px solid rgb(0, 92, 169);
            border-radius: 20px 0 0 20px;
        }

        input:focus {
            outline: none;
        }

        input::-webkit-input-placeholder {
            color: rgba(238, 238, 238, 0.7);
        }

        button {
            font-size: 24px;
            font-weight: 700;
@@ -328,12 +389,40 @@
            cursor: pointer;
            border-radius: 0 20px 20px 0;
        }

        button:active {
            background-color: rgb(0, 92, 169);
            border: 1px solid rgb(0, 92, 169);
        }
    }

    .search-val-box {
        display: flex;
        flex-direction: column;
        position: absolute;
        top: 98px;
        left: 6px;
        width: calc(100% - 12px);
        max-height: 160px;
        text-align: left;
        color: #fff;
        background: rgba(16, 29, 74, 0.9);
        z-index: 1111;
        border-radius: 10px;
        overflow: hidden;

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

            div {
                padding: 0 10px;
                line-height: 36px;
                cursor: pointer;
            }
        }
    }

    .list-show {
        flex: 1;


 src/views/video/index.vue

@@ -2,7 +2,7 @@
 * @Author: shuishen 1109946754@qq.com
 * @Date: 2022-08-18 16:18:17
 * @LastEditors: shuishen 1109946754@qq.com
 * @LastEditTime: 2022-09-27 09:19:30
 * @LastEditTime: 2022-10-17 15:27:27
 * @FilePath: \srs-police-affairs\src\views\video\index.vue
 * @Description: 辖区管理
 * 
@@ -12,8 +12,18 @@
<template>
    <div class="container">
        <div class="search-box">
            <input type="text" placeholder="请输入搜索条件" />
            <button class="el-icon-search"></button>
            <input v-model="searchValue" @input="searchChange" type="text" placeholder="请输入搜索条件" />
            <button @click="searchClick" class="el-icon-search"></button>
        </div>

        <div v-show="searchValBoxShow" class="search-val-box">
            <div>
                <div
                    @click="searchVlaClick(item)"
                    v-for="(item, index) in searchArray"
                    :key="index"
                >{{item.name}}</div>
            </div>
        </div>

        <div class="list-show">
@@ -31,7 +41,7 @@
                                <span>{{(currentPage - 1) * pagesize + scope.$index + 1}}</span>
                            </template>
                        </el-table-column>
                        <el-table-column prop="id" label="设备ID" width="150"></el-table-column>
                        <el-table-column prop="name" label="设备名称" width="150"></el-table-column>
                        <el-table-column prop="type" label="设备类型"></el-table-column>
                    </el-table>
                </div>
@@ -75,6 +85,8 @@
</template>

<script>
import { listQuery, accurateSearch } from "@/utils/search.js"

import monitoringList from '@/assets/data/monitoring.js'

export default {
@@ -85,6 +97,9 @@
            monitoringList: [],
            dialogTitle: '',
            dialogVisible: false,
            searchValue: '',
            searchArray: [],
            searchValBoxShow: false
        }
    },
    created () {
@@ -141,6 +156,28 @@
            this.$refs.videoElement.pause()
            this.dialogVisible = false
        },

        searchChange () {
            if (this.searchValue == '') {
                this.searchValBoxShow = false
                this.searchArray = []
                this.monitoringList = monitoringList
            } else {
                this.searchArray = listQuery(monitoringList, this.searchValue, 'name')
                this.searchValBoxShow = true
            }
        },

        searchClick () {
            this.searchValBoxShow = false
            this.monitoringList = accurateSearch(monitoringList, this.searchValue, 'name')
        },

        searchVlaClick (item) {
            this.searchValBoxShow = false
            this.searchArray = []
            this.monitoringList = [item]
        }
    },

    destroyed () {
@@ -167,7 +204,7 @@
        display: flex;

        input {
            width: 300px;
            flex: 1;
            height: 100%;
            font-size: 18px;
            text-indent: 1em;
@@ -203,6 +240,33 @@
        }
    }

    .search-val-box {
        display: flex;
        flex-direction: column;
        position: absolute;
        top: 48px;
        left: 6px;
        width: calc(100% - 12px);
        max-height: 160px;
        text-align: left;
        color: #fff;
        background: rgba(16, 29, 74, 0.9);
        z-index: 1111;
        border-radius: 10px;
        overflow: hidden;

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

            div {
                padding: 0 10px;
                line-height: 36px;
                cursor: pointer;
            }
        }
    }

    .list-show {
        flex: 1;