public/index.html
@@ -2,7 +2,7 @@ * @Author: shuishen 1109946754@qq.com * @Date: 2022-09-07 09:34:58 * @LastEditors: shuishen 1109946754@qq.com * @LastEditTime: 2022-09-28 09:03:27 * @LastEditTime: 2023-01-06 17:01:58 * @FilePath: \srs-police-affairs\public\index.html * @Description: * @@ -17,7 +17,7 @@ <meta name="viewport" content="width=device-width,initial-scale=1.0"> <link rel="icon" href="<%= BASE_URL %>affairs.ico"> <title> 社区警务平台 信州公安VR指挥平台 </title> <script src="./depend/vue.min.js"></script> src/api/home/index.js
@@ -2,7 +2,7 @@ * @Author: shuishen 1109946754@qq.com * @Date: 2022-12-27 14:19:19 * @LastEditors: shuishen 1109946754@qq.com * @LastEditTime: 2023-01-05 15:16:20 * @LastEditTime: 2023-01-06 16:30:13 * @FilePath: \srs-police-affairs\src\api\home\index.js * @Description: * @@ -42,4 +42,32 @@ method: 'get', params: {} }) } // 获取接警历史记录 export const getAlarmList = (type, time) => { return request({ url: `/api/alarm/alarm/page`, method: 'get', params: { current: 1, size: 100, type, time } }) } // 获取处警历史 export const getActAsPoliceList = (alarmID, cjdwbh = '') => { return request({ url: `/api/outAlarm/outAlarm/page`, method: 'get', params: { current: 1, size: 100, alarmID, cjdwbh } }) } src/api/police/index.js
@@ -2,7 +2,7 @@ * @Author: shuishen 1109946754@qq.com * @Date: 2022-11-15 15:10:41 * @LastEditors: shuishen 1109946754@qq.com * @LastEditTime: 2022-12-05 15:22:33 * @LastEditTime: 2023-01-06 17:13:07 * @FilePath: \srs-police-affairs\src\api\police\index.js * @Description: * src/api/video/index.js
@@ -2,7 +2,7 @@ * @Author: shuishen 1109946754@qq.com * @Date: 2022-11-15 15:10:41 * @LastEditors: shuishen 1109946754@qq.com * @LastEditTime: 2022-12-19 17:38:55 * @LastEditTime: 2023-01-06 17:15:39 * @FilePath: \srs-police-affairs\src\api\video\index.js * @Description: * @@ -20,7 +20,8 @@ */ export const getVideoList = (page, count, query, params = {}) => { return request({ url: '/device/query/devices/34020000002000000003/channels', // 内网使用地址,外网把36110000002009999000更换掉 url: '/device/query/devices/36110000002009999000/channels', method: 'get', requestBaseUrl: 'outside', params: { src/components/map/components/mapPopup.vue
@@ -13,53 +13,91 @@ <div class="arrow-rb"></div> <div class="label-wrap"> <div class="title"> 详细信息 警情信息 <div class="details-btn" @click="popupDetailShow">详情>>></div> <div class="close" @click="closePopup" title="关闭"></div> </div> <div class="change-btn"> <div class="on">接警信息</div> <div>出警信息</div> <div @click="currentBtn = '接警信息'" :class="{ on: currentBtn == '接警信息' }">接警信息</div> <div @click="currentBtnChange('出警信息')" :class="{ on: currentBtn == '出警信息' }">出警信息 </div> </div> <div class="label-content"> <div v-show="currentBtn == '接警信息'" class="label-content"> <div class="item"> <div>警情类别:</div> <div>{{ dataPopup.type }}</div> <div>接警单位:</div> <div>{{ dataPopup.JJDWMC }}</div> </div> <div class="item"> <div>接警员:</div> <div>{{ dataPopup.JJYXM }}</div> </div> <div class="item"> <div>接警时间:</div> <div>{{ dataPopup.dealTime }}</div> </div> <div class="item"> <div>警情状态:</div> <div>{{ dataPopup.state }}</div> </div> <div class="item"> <div>经办民警:</div> <div>{{ dataPopup.dealPolice }}</div> <div>{{ dataPopup.JJSJ }}</div> </div> <div class="item"> <div>报警人:</div> <div>{{ dataPopup.callPeople }}</div> <div>{{ dataPopup.BJRXM }}</div> </div> <div class="item"> <div>报警电话:</div> <div>{{ dataPopup.comingPhone }}</div> <div>联系电话:</div> <div>{{ dataPopup.LXDH }}</div> </div> <div class="item"> <div>报警人联系人:</div> <div>{{ dataPopup.callPhone }}</div> <div>联系电话:</div> <div>{{ dataPopup.BJNR }}</div> </div> <div class="item"> <div>所属派出所:</div> <div>{{ dataPopup.policeName }}</div> <div>事发地址:</div> <div>{{ dataPopup.SFDZ }}</div> </div> <div class="item"> <div>经度:</div> <div>{{ dataPopup.position[0] }}</div> <div>报警类型:</div> <div>{{ dataPopup.BJLX }}</div> </div> <div class="item"> <div>纬度:</div> <div>{{ dataPopup.position[1] }}</div> <div>备注:</div> <div>{{ dataPopup.MEMO }}</div> </div> </div> <div v-show="currentBtn == '出警信息'" class="label-content"> <div class="item"> <div>处警单位:</div> <div>{{ CJdata.CJDWMC }}</div> </div> <div class="item"> <div>处警员:</div> <div>{{ CJdata.CJYXM }}</div> </div> <div class="item"> <div>接警时间:</div> <div>{{ CJdata.JJSJ }}</div> </div> <div class="item"> <div>出动人员:</div> <div>{{ CJdata.CDRY }}</div> </div> <div class="item"> <div>出动车辆:</div> <div>{{ CJdata.CDCL }}</div> </div> <div class="item"> <div>到达现场时间:</div> <div>{{ CJdata.DDXCSJ }}</div> </div> <div class="item"> <div>处理完毕时间:</div> <div>{{ CJdata.CLWBSJ }}</div> </div> <div class="item"> <div>处警类型:</div> <div>{{ CJdata.CJLX }}</div> </div> <div class="item"> <div>备注:</div> <div>{{ CJdata.MEMO }}</div> </div> </div> </div> @@ -76,8 +114,17 @@ <script> import { mapGetters } from 'vuex' import { getActAsPoliceList } from "@/api/home/index.js" export default { name: 'mapPopup', data () { return { currentBtn: '接警信息', CJdata: {} } }, computed: { ...mapGetters([ 'detailsPopup', @@ -86,7 +133,21 @@ }, methods: { closePopup () { this.currentBtn = '接警信息' this.$store.commit('SET_DETAILSPOPUP', false) }, currentBtnChange (type) { this.currentBtn = type this.CJdata = {} getActAsPoliceList(this.dataPopup.JJDBH, '').then(res => { this.CJdata = res.data.data.records }) }, popupDetailShow () { this.$EventBus.$emit('policeSituationSiteClick', this.dataPopup) } } } @@ -124,7 +185,7 @@ .divForms .area { position: relative; min-width: 420px; min-width: 360px; } .divForms-wrap { @@ -220,12 +281,13 @@ } &>div.on { border-bottom: 2px solid #1831a7; color: #3d95f3; border-bottom: 2px solid #3d95f3; } } .label-content { padding: 4px 0; padding: 10px 0; .item { display: flex; @@ -237,7 +299,7 @@ text-align: left; &>div:first-child { width: 96px; width: 112px; text-align: justify; display: inline-block; text-align-last: justify; @@ -260,10 +322,22 @@ height: 36px; line-height: 36px; .details-btn { position: absolute; top: 0; right: 28px; height: 100%; cursor: pointer; } .details-btn:hover { color: #3d95f3; } .close { position: absolute; right: 5px; top: -2px; top: 0; } .close::before { src/components/map/index.vue
@@ -2,7 +2,7 @@ * @Author: shuishen 1109946754@qq.com * @Date: 2022-08-18 17:00:30 * @LastEditors: shuishen 1109946754@qq.com * @LastEditTime: 2022-12-30 13:59:43 * @LastEditTime: 2023-01-06 16:59:43 * @FilePath: \srs-police-affairs\src\components\map\index.vue * @Description: 公用地图组件 * @@ -15,37 +15,20 @@ <!-- 全屏控制按钮 --> <div class="screen-full-btn"> <el-tooltip v-if="isFullscreen" content="缩放" placement="bottom" effect="dark"> <i class="fa fa-compress" style="vertical-align: middle; cursor: pointer" @click="fullscreenchange" ></i> <i class="fa fa-compress" style="vertical-align: middle; cursor: pointer" @click="fullscreenchange"></i> </el-tooltip> <el-tooltip v-if="!isFullscreen" content="全屏" placement="bottom" effect="dark"> <i class="fa fa-expand" style="vertical-align: middle; cursor: pointer" @click="fullscreenchange" ></i> <i class="fa fa-expand" style="vertical-align: middle; cursor: pointer" @click="fullscreenchange"></i> </el-tooltip> </div> <!-- 切换矢量图按钮 --> <div class="image-switch-icon-btn" title="切换影像" @mouseover="showImgBtn = true" @mouseleave="showImgBtn = false" > <div class="image-switch-icon-btn" title="切换影像" @mouseover="showImgBtn = true" @mouseleave="showImgBtn = false"> <div class="icon-box"> <img src="/img/base_map.png" alt /> </div> <div class="image-switch-img-btn" v-show="showImgBtn" @mouseover="showImgBtn = true" @mouseleave="showImgBtn = false" > <div class="image-switch-img-btn" v-show="showImgBtn" @mouseover="showImgBtn = true" @mouseleave="showImgBtn = false"> <div class="img" @click="switchImg"> <span :class="{ on: imgtype == 0 }">影像</span> </div> @@ -188,29 +171,29 @@ // global.viewer.addTerrain(terrain) // 天地图 影像 global.viewer.imageryLayers.addImageryProvider( new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({ url: 'http://t{s}.tianditu.gov.cn/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=e45274b0235bb913eceb393aabbf9c9c', subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'], format: 'image/jpeg', show: true, maximumLevel: 18 }) ) // global.viewer.imageryLayers.addImageryProvider( // new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({ // url: 'http://t{s}.tianditu.gov.cn/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=e45274b0235bb913eceb393aabbf9c9c', // subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'], // format: 'image/jpeg', // show: true, // maximumLevel: 18 // }) // ) // 上饶部署,内网使用的 // global.viewer.imageryLayers.addImageryProvider( // new global.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({ // url: "http://10.141.11.11:8090/MapTileService/wmts?STORETYPE=merged-dat&PROJECTION=4326", // layer: "wmts_4326_361100", // style: "default", // format: "image/png", // tileMatrixSetID: "c", // tileMatrixLabels: new Array(18).fill(0).map((v, i) => i + 1), // tilingScheme: new global.DC.Namespace.Cesium.GeographicTilingScheme(), // }) // ) global.viewer.imageryLayers.addImageryProvider( new global.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({ url: "http://10.141.11.11:8090/MapTileService/wmts?STORETYPE=merged-dat&PROJECTION=4326", layer: "wmts_4326_361100", style: "default", format: "image/png", tileMatrixSetID: "c", tileMatrixLabels: new Array(18).fill(0).map((v, i) => i + 1), tilingScheme: new global.DC.Namespace.Cesium.GeographicTilingScheme(), }) ) // 设置地图初始位置,角度等 global.viewer.camera.setView({ src/router/axios.js
@@ -2,7 +2,7 @@ * @Author: shuishen 1109946754@qq.com * @Date: 2022-07-29 15:19:13 * @LastEditors: shuishen 1109946754@qq.com * @LastEditTime: 2023-01-03 10:58:13 * @LastEditTime: 2023-01-06 17:13:56 * @FilePath: \srs-police-affairs\src\router\axios.js * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE */ @@ -41,12 +41,13 @@ // 调用监控平台的 if (config.requestBaseUrl == "outside") { // 内网部署地址 config.baseURL = 'http://10.141.11.11:18185/api' // config.baseURL = 'http://10.141.11.11:18185/api' config.baseURL = 'http://192.168.0.126:18185/api' // config.baseURL = "http://192.168.0.129:18185/api" } else if (config.requestBaseUrl == "fengt") { // feng tu 数据 // config.baseURL = "http://10.141.11.11:18080" config.baseURL = "http://192.168.0.112:18080" config.baseURL = "http://10.141.11.11:18080" // config.baseURL = "http://192.168.0.112:18080" } else if (config.requestBaseUrl == "fengtDS") { config.baseURL = "http://192.168.0.112:9091" } src/styles/base/index.scss
@@ -102,7 +102,6 @@ align-items: center; justify-content: center; width: 100%; height: 100%; } } } @@ -292,7 +291,7 @@ display: flex; flex-direction: column; width: 1000px; height: 600px; height: 620px; top: 50%; left: 50% !important; transform: translate(-50%, -50%); src/styles/media/index.scss
@@ -319,6 +319,24 @@ } } .equiment-detail { height: countSizeVh(540); .right { .monitor { height: countSizeVh(540); } .others { height: countSizeVh(495); .pages { padding-bottom: countSizeVh(3); padding-top: countSizeVh(10); } } } } } @@ -721,7 +739,7 @@ &>.park-content, &>.business-content { height: countSizeVh(380); .el-table__header-wrapper { height: countSizeVh(48); @@ -756,7 +774,7 @@ font-size: countSizeVh(16); } } } @@ -812,7 +830,7 @@ .search-content { left: countSizeVw(760, 1920); top: countSizeVh(40); top: countSizeVh(100); width: countSizeVw(460, 1920); height: countSizeVh(36); @@ -1036,7 +1054,7 @@ .search-content { left: countSizeVw(760, 1920); top: countSizeVh(40); top: countSizeVh(100); width: countSizeVw(460, 1920); height: countSizeVh(36); @@ -1230,7 +1248,7 @@ .search-content { left: countSizeVw(760, 1920); top: countSizeVh(40); top: countSizeVh(100); width: countSizeVw(460, 1920); height: countSizeVh(36); @@ -1725,7 +1743,7 @@ .search-content { left: countSizeVw(760, 1920); top: countSizeVh(40); top: countSizeVh(120); width: countSizeVw(460, 1920); height: countSizeVh(36); @@ -1777,6 +1795,28 @@ } .main-content { .car-video-box { .el-dialog .el-dialog__header { height: countSizeVh(30); line-height: countSizeVh(30); font-size: countSizeVh(16); } .el-dialog__header span { font-size: countSizeVh(18); } .el-dialog__header button { font-size: countSizeVh(18); right: countSizeVw(10, 1920); } .el-dialog { width: countSizeVw(720, 1920); height: countSizeVh(480); } .el-dialog .el-dialog__body { height: countSizeVh(450); padding: countSizeVh(6); } } .police-affairs-details-box { .el-dialog { width: countSizeVw(540, 1920); @@ -1957,7 +1997,7 @@ .el-dialog { width: countSizeVw(1000, 1920); height: countSizeVh(600); height: countSizeVh(620); } } @@ -2354,7 +2394,7 @@ } .area { min-width: countSizeVw(420, 1920); min-width: countSizeVw(360, 1920); } .b-t { @@ -2390,7 +2430,7 @@ } .label-content { padding: countSizeVh(4) 0; padding: countSizeVh(10) 0; } @@ -2411,7 +2451,6 @@ .close { right: countSizeVw(5, 1920); top: countSizeVh(-2); } .close::before { src/views/activity/index.vue
@@ -1787,8 +1787,10 @@ .search-content { position: absolute; position: fixed; z-index: 99; left: 760px; top: 40px; top: 140px; width: 460px; height: 36px; src/views/home/components/bottomContainer.vue
@@ -12,12 +12,12 @@ start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker> --> <el-date-picker @change="datePickerChange" v-show="timetype == 0" v-model="currentTime" type="week" format="yyyy 第 WW 周" :picker-options="pickerOptions" placeholder="选择周"> <el-date-picker @change="datePickerChange" v-show="timetype == 0" v-model="currentWeekTime" type="week" format="yyyy 第 WW 周" :picker-options="pickerOptions" placeholder="选择周"> </el-date-picker> <el-date-picker @change="datePickerChange" v-show="timetype == 1" v-model="currentTime" type="month" :picker-options="pickerOptions" placeholder="选择月"> <el-date-picker @change="datePickerChange" v-show="timetype == 1" v-model="currentMonthTime" type="month" :picker-options="pickerOptions" placeholder="选择月"> </el-date-picker> </div> <div class="history-tab"> @@ -51,15 +51,15 @@ <li v-for="(item, index) in listCurrentData" :key="index" :data-obj="JSON.stringify(item)" class="row"> <span class="num" v-text="index + 1"></span> <span class="receiving-alarm-unit" v-text="JJDWMC"></span> <span class="receiving-alarm-people" v-text="JJYXM"></span> <span class="receiving-alarm-time" v-text="JJSJ"></span> <span class="call-people" v-text="BJRXM"></span> <span class="call-phone" v-text="LXDH"></span> <span class="call-police-content" v-text="BJNR"></span> <span class="incident-site" v-text="SFDZ"></span> <span class="call-police-type" v-text="BJLX"></span> <span class="alarm-bz" v-text="MEMO"></span> <span class="receiving-alarm-unit" v-text="item.JJDWMC"></span> <span class="receiving-alarm-people" v-text="item.JJYXM"></span> <span class="receiving-alarm-time" v-text="item.JJSJ"></span> <span class="call-people" v-text="item.BJRXM"></span> <span class="call-phone" v-text="item.LXDH"></span> <span class="call-police-content" :title="item.BJNR" v-text="item.BJNR"></span> <span class="incident-site" v-text="item.SFDZ"></span> <span class="call-police-type" v-text="item.BJLX"></span> <span class="alarm-bz" v-text="item.MEMO"></span> </li> </ul> </vue-seamless-scroll> @@ -105,7 +105,7 @@ import vueSeamlessScroll from 'vue-seamless-scroll' import historyArr from '@/assets/data/policeSituationArr/historyArr.js' import { getCallPolices, getAnswerPolices } from "@/api/home/index.js" import { getCallPolices, getAnswerPolices, getAlarmList } from "@/api/home/index.js" export default { data () { @@ -118,7 +118,8 @@ policeSituationHistoryArr: [], policeSituationHistorySaveArr: [], eventTime: '', currentTime: '', currentWeekTime: '', currentMonthTime: '', pickerOptions: {}, // 日期设置对象 classOption: { step: 1 @@ -151,14 +152,7 @@ }, created () { this.policeSituationHistoryArr = historyArr this.policeSituationHistorySaveArr = historyArr this.getAnswerPolices() setInterval(() => { console.log(this.currentTime) }, 5000) // disabledDate 为true表示不可选,false表示可选 this.pickerOptions = { @@ -178,10 +172,12 @@ }, methods: { // 时间改变事件 datePickerChange (e) { // this.timetype const dateStr = this.dateFormat(e) this.getAlarmList(this.timetype, dateStr) }, // 获取当前日期 @@ -196,94 +192,141 @@ return time }, // 获取实时接警记录 getAnswerPolices () { // getCallPolices().then(res => { // res.data.result // }) // getAnswerPolices().then(res => { // this.policeSituationRealtimeArr = res.data.result // }) this.policeSituationRealtimeArr = [ { JJDW: '公安局', position: [112, 28] }, { JJDW: '派出所' }, ] this.policeSituationRealtimeArr = [{ ZDDWXZB: 112, ZDDWYZB: 25, JJDWMC: '信州公安局派出所', JJYXM: '欧阳西门', JJSJ: '2022-12-12 12:12:12', BJRXM: '西门庆祝', LXDH: 17335843642, BJNR: '今日在某小区查获私人赌博场所,今日在某小区查获私人赌博场所今日在某小区查获私人赌博场所今日在某小区查获私人赌博场所', SFDZ: '上饶市信州区万达华府小区', BJLX: '聚众赌博', MEMO: '人群聚集赌博' }, { JJDWMC: '信州公安局派出所', JJYXM: '欧阳西门', JJSJ: '2022-12-12 12:12:12', BJRXM: '西门庆祝', LXDH: 17335843642, BJNR: '今日在某小区查获私人赌博场所,今日在某小区查获私人赌博场所今日在某小区查获私人赌博场所今日在某小区查获私人赌博场所', SFDZ: '上饶市信州区万达华府小区', BJLX: '聚众赌博', MEMO: '人群聚集赌博' }, { JJDWMC: '信州公安局派出所', JJYXM: '欧阳西门', JJSJ: '2022-12-12 12:12:12', BJRXM: '西门庆祝', LXDH: 17335843642, BJNR: '今日在某小区查获私人赌博场所', SFDZ: '上饶市信州区万达华府小区', BJLX: '聚众赌博', MEMO: '人群聚集赌博' }, { JJDWMC: '信州公安局派出所', JJYXM: '欧阳西门', JJSJ: '2022-12-12 12:12:12', BJRXM: '西门庆祝', LXDH: 17335843642, BJNR: '今日在某小区查获私人赌博场所', SFDZ: '上饶市信州区万达华府小区', BJLX: '聚众赌博', MEMO: '人群聚集赌博' }, { JJDWMC: '信州公安局派出所', JJYXM: '欧阳西门', JJSJ: '2022-12-12 12:12:12', BJRXM: '西门庆祝', LXDH: 17335843642, BJNR: '今日在某小区查获私人赌博场所', SFDZ: '上饶市信州区万达华府小区', BJLX: '聚众赌博', MEMO: '人群聚集赌博' }, { JJDWMC: '信州公安局派出所', JJYXM: '欧阳西门', JJSJ: '2022-12-12 12:12:12', BJRXM: '西门庆祝', LXDH: 17335843642, BJNR: '今日在某小区查获私人赌博场所', SFDZ: '上饶市信州区万达华府小区', BJLX: '聚众赌博', MEMO: '人群聚集赌博' }, { JJDWMC: '信州公安局派出所', JJYXM: '欧阳西门', JJSJ: '2022-12-12 12:12:12', BJRXM: '西门庆祝', LXDH: 17335843642, BJNR: '今日在某小区查获私人赌博场所', SFDZ: '上饶市信州区万达华府小区', BJLX: '聚众赌博', MEMO: '人群聚集赌博' }] }, // 获取历史接警记录 getAlarmList (type, time) { getAlarmList(type, time).then(res => { this.policeSituationHistoryArr = res.data.data.records }) }, // 周月选择 timeTabClick (type) { this.timetype = type if (type == 0) { this.getAlarmList(type, this.dateFormat(this.currentWeekTime)) } else { this.currentMonthTime == '' ? this.currentMonthTime = new Date() : '' this.getAlarmList(type, this.dateFormat(this.currentMonthTime)) } this.$emit('changePoliceSituationTimeType', type) this.$emit('policeSituationChange') }, // 实时历史选择 historyTabClick (type) { this.historytype = type this.currentWeekTime = new Date() if (type == 0) { this.getAnswerPolices() } else { this.policeSituationHistoryArr = this.chooseMouthTimeDate(this.policeSituationHistorySaveArr) this.getAlarmList(type, this.dateFormat(this.currentWeekTime)) } }, historyTabClick (type) { this.historytype = type this.$emit('changePoliceSituationHistoryType', type) this.$emit('policeSituationChange') }, chooseWeekTimeDate (arr) { let lastWeekArr = [] let realtimeTimeStamp = new Date().valueOf() - 24 * 60 * 60 * 1000 let lastWeekTimeStamp = new Date().valueOf() - 7 * 24 * 60 * 60 * 1000 arr.forEach(item => { if (new Date(item.dealTime).valueOf() < realtimeTimeStamp && new Date(item.dealTime).valueOf() > lastWeekTimeStamp) { lastWeekArr.push(item) } }) return lastWeekArr chooseWeekTimeDate () { return this.policeSituationHistoryArr }, chooseMouthTimeDate (arr) { let lastMouthArr = [] let realtimeTimeStamp = new Date().valueOf() - 24 * 60 * 60 * 1000 let lastMouthTimeStamp = new Date().valueOf() - 30 * 24 * 60 * 60 * 1000 arr.forEach(item => { if (new Date(item.dealTime).valueOf() < realtimeTimeStamp && new Date(item.dealTime).valueOf() > lastMouthTimeStamp) { lastMouthArr.push(item) } }) return lastMouthArr chooseMouthTimeDate () { return this.policeSituationHistoryArr }, policeSituationClick (item) { if (item.position) { this.$EventBus.$emit('toPosition', { layerName: 'policeSituationyLayers', siteJd: Number(item.position[0]), siteWd: Number(item.position[1]) }) this.$store.commit('SET_DETAILSPOPUP', true) this.$store.commit('SET_DATAPOPUP', item) var popup = new global.DC.DivForms(global.viewer, { domId: 'divFormsDomBox', position: [ global.DC.Transform.transformWGS84ToCartesian( new global.DC.Position( Number(item.position[0]), Number(item.position[1]), 0 ) ) ] }) } else { this.$emit('policeSituationSiteClick', item) } }, // 列表行选择 handleSelectClick (e) { let element for (let i = 0; i < e.path.length; i++) { @@ -296,8 +339,36 @@ let currentItem = JSON.parse(element.dataset.obj) this.policeSituationClick(currentItem) } }, // 点击定位或者显示弹窗 policeSituationClick (item) { if (item.ZDDWXZB && item.ZDDWXZB != 0 && item.ZDDWYZB && item.ZDDWYZB != 0) { this.$EventBus.$emit('toPosition', { layerName: 'policeSituationyLayers', siteJd: Number(item.ZDDWXZB), siteWd: Number(item.ZDDWYZB) }) this.$store.commit('SET_DETAILSPOPUP', true) this.$store.commit('SET_DATAPOPUP', item) var popup = new global.DC.DivForms(global.viewer, { domId: 'divFormsDomBox', position: [ global.DC.Transform.transformWGS84ToCartesian( new global.DC.Position( Number(item.ZDDWXZB), Number(item.ZDDWYZB), 0 ) ) ] }) } else { this.$emit('policeSituationSiteClick', item) } } } } </script> @@ -435,6 +506,12 @@ display: flex; cursor: pointer; span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .num { width: 6%; } src/views/home/index.vue
@@ -2,7 +2,7 @@ * @Author: shuishen 1109946754@qq.com * @Date: 2022-08-18 16:18:17 * @LastEditors: shuishen 1109946754@qq.com * @LastEditTime: 2023-01-05 17:04:32 * @LastEditTime: 2023-01-06 15:44:39 * @FilePath: \srs-police-affairs\src\views\home\index.vue * @Description: 小区-栋-层-房屋 * @@ -11,18 +11,31 @@ <template> <div class="home-page container"> <left-container class="left-container" @showpeopledetail="showpeopledetail" @showlanddetail="showlanddetail" @showkeypersondetail="showkeypersondetail" ref="leftContainer"></left-container> <left-container class="left-container" @showpeopledetail="showpeopledetail" @showlanddetail="showlanddetail" @showkeypersondetail="showkeypersondetail" ref="leftContainer" ></left-container> <right-container class="right-container" @showequimentdetail="showequimentdetail" @selectPoliceChangeEventData="selectPoliceChangeEventData" @changeActivityType="changeActivityType" @activityChange="activityChange" ref="rightContainer"></right-container> <right-container class="right-container" @showequimentdetail="showequimentdetail" @selectPoliceChangeEventData="selectPoliceChangeEventData" @changeActivityType="changeActivityType" @activityChange="activityChange" ref="rightContainer" ></right-container> <bottom-container class="bottom-container" ref="bottomContainer" <bottom-container class="bottom-container" ref="bottomContainer" @changePoliceSituationHistoryType="changePoliceSituationHistoryType" @changePoliceSituationTimeType="changePoliceSituationTimeType" @policeSituationChange="policeSituationChange" @policeSituationSiteClick="policeSituationSiteClick"></bottom-container> @policeSituationSiteClick="policeSituationSiteClick" ></bottom-container> <div class="center-container"> <div class="layers-control-btn house"> @@ -49,30 +62,69 @@ </div> <div ref="RegionSelect" style="left: 0;" class="region-select"> <map-select class="map-select" @selectCheck="policeStationSelect" :checkValue="policeStationCheckValue" :options="policeStationOptions" :optionsName="'policeStationName'"></map-select> <map-select class="map-select" @selectCheck="policeStationSelect" :checkValue="policeStationCheckValue" :options="policeStationOptions" :optionsName="'policeStationName'" ></map-select> <map-select class="map-select" @selectCheck="areaSelect" :checkValue="areaCheckValue" :options="areaOptions" :optionsName="'areaCheckName'"></map-select> <map-select class="map-select" @selectCheck="areaSelect" :checkValue="areaCheckValue" :options="areaOptions" :optionsName="'areaCheckName'" ></map-select> <map-select class="map-select" @selectCheck="housingSelect" :checkValue="housingCheckValue" :options="housingOptions" :optionsName="'housingsName'"></map-select> <map-select class="map-select" @selectCheck="housingSelect" :checkValue="housingCheckValue" :options="housingOptions" :optionsName="'housingsName'" ></map-select> </div> <el-dialog :title="dialogTitle" :modal="true" :visible.sync="dialogVisible" :before-close="dialogBeforeClose" :close-on-click-modal="true"> <video src="/video/sp.mp4" autoplay controls width="100%" height="100%" ref="videoElement" style="object-fit: fill"></video> <el-dialog :title="dialogTitle" :modal="true" :visible.sync="dialogVisible" :before-close="dialogBeforeClose" :close-on-click-modal="true" > <video src="/video/sp.mp4" autoplay controls width="100%" height="100%" ref="videoElement" style="object-fit: fill" ></video> </el-dialog> <el-dialog :title="panoramaTitle" :modal="true" :visible.sync="panoramaVisible" :before-close="panoramaBeforeClose" :close-on-click-modal="true" class="panorama-details-box"> <el-dialog :title="panoramaTitle" :modal="true" :visible.sync="panoramaVisible" :before-close="panoramaBeforeClose" :close-on-click-modal="true" class="panorama-details-box" > <!-- <iframe src="http://vr.jxpskj.com/JXSFKZQJ/QJ/" style="width: 100%; height: 100%;" frameborder="0"></iframe>--> <iframe :src="panoramaVrUrl" style="width: 100%; height: 100%;" frameborder="0" /> </el-dialog> <el-dialog :title="activityTitle" :modal="true" :visible.sync="activityVisible" :before-close="activityBeforeClose" :close-on-click-modal="true" class="activity-details-box"> <el-dialog :title="activityTitle" :modal="true" :visible.sync="activityVisible" :before-close="activityBeforeClose" :close-on-click-modal="true" class="activity-details-box" > <div class="item"> <div>活动名称:</div> <div>{{ activityDetailArr.activityName }}</div> @@ -107,8 +159,14 @@ </div> </el-dialog> <el-dialog :title="phoneTitle" :modal="true" :visible.sync="phoneVisible" :before-close="phoneBeforeClose" :close-on-click-modal="true" class="phone-details-box"> <el-dialog :title="phoneTitle" :modal="true" :visible.sync="phoneVisible" :before-close="phoneBeforeClose" :close-on-click-modal="true" class="phone-details-box" > <div class="item"> <div>责任人:</div> <div>{{ phoneDetails.person }}</div> @@ -127,8 +185,14 @@ </div> </el-dialog> <el-dialog :title="peopleTitle" :modal="true" :visible.sync="peopleVisible" :before-close="peopleBeforeClose" :close-on-click-modal="true" class="area-details-box"> <el-dialog :title="peopleTitle" :modal="true" :visible.sync="peopleVisible" :before-close="peopleBeforeClose" :close-on-click-modal="true" class="area-details-box" > <div class="item"> <div>责任区负责人:</div> <div>王某某</div> @@ -147,30 +211,58 @@ </div> </el-dialog> <el-dialog :title="equimentTitle" :modal="true" :visible.sync="equimentVisible" :before-close="equimentBeforeClose" :close-on-click-modal="true" class="equiment-details-box"> <el-dialog :title="equimentTitle" :modal="true" :visible.sync="equimentVisible" :before-close="equimentBeforeClose" :close-on-click-modal="true" class="equiment-details-box" > <div class="equiment-detail"> <div class="left"> <el-tree :data="jurisdictionData" :props="defaultProps" @node-click="jurisdictionNodeClick" ref="tree" node-key="id"></el-tree> <el-tree :data="jurisdictionData" :props="defaultProps" @node-click="jurisdictionNodeClick" ref="tree" node-key="id" ></el-tree> </div> <div class="right"> <div class="monitor" v-if="monitorContent"> <video src="/video/sp.mp4" autoplay controls width="100%" height="100%" ref="videoElement" style="object-fit: fill"></video> <video src="/video/sp.mp4" autoplay controls width="100%" height="100%" ref="videoElement" style="object-fit: fill" ></video> </div> <div class="others" v-if="othersContent"> <el-table :data="showArr.slice((currentPage - 1) * pagesize, currentPage * pagesize)" <el-table :data="showArr.slice((currentPage - 1) * pagesize, currentPage * pagesize)" 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-class-name="tableRowClassName" > <el-table-column prop="carID" label="车牌号" v-if="carArrShow"></el-table-column> <el-table-column prop="carType" label="车型" v-if="carArrShow"></el-table-column> <el-table-column prop="phoneID" label="手台号" v-if="phoneArrShow"></el-table-column> <el-table-column prop="phoneType" label="手台机型" v-if="phoneArrShow"></el-table-column> <el-table-column prop="recorderID" label="执法记录仪号" v-if="recorderArrShow"></el-table-column> <el-table-column prop="recorderType" label="记录仪机型" v-if="recorderArrShow"></el-table-column> <el-table-column prop="recorderID" label="执法记录仪号" v-if="recorderArrShow" ></el-table-column> <el-table-column prop="recorderType" label="记录仪机型" v-if="recorderArrShow" ></el-table-column> <el-table-column prop="id" label="设备号" v-if="stateArrShow"></el-table-column> <el-table-column prop="equimentType" label="设备类型" v-if="stateArrShow"></el-table-column> <el-table-column prop="policeStation" label="所属派出所"></el-table-column> @@ -178,20 +270,35 @@ <el-table-column prop="state" label="状态"></el-table-column> </el-table> <div class="pages"> <el-pagination background layout="prev, pager, next" :total="showArr.length" :page-size="pagesize" pager-count="3" :current-page="currentPage" @current-change="handleCurrentChange"></el-pagination> <el-pagination background layout="prev, pager, next" :total="showArr.length" :page-size="pagesize" pager-count="3" :current-page="currentPage" @current-change="handleCurrentChange" ></el-pagination> </div> </div> </div> </div> </el-dialog> <el-dialog :title="landTitle" :modal="true" :visible.sync="landVisible" :before-close="landBeforeClose" :close-on-click-modal="true" class="land-details-box"> <el-table :data="landDetailArr" style="width: 100%" <el-dialog :title="landTitle" :modal="true" :visible.sync="landVisible" :before-close="landBeforeClose" :close-on-click-modal="true" class="land-details-box" > <el-table :data="landDetailArr" style="width: 100%" :header-cell-style="{ 'text-align': 'center', 'background-color': '#203c60', 'borderColor': '#324e75' }" :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75', 'cursor': 'pointer' }"> :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75', 'cursor': 'pointer' }" > <el-table-column prop="housingEastate" label="小区名称" width="100"></el-table-column> <el-table-column prop="location" label="位置" width="140"></el-table-column> <el-table-column prop="area" label="面积" width="120"></el-table-column> @@ -200,11 +307,20 @@ </el-table> </el-dialog> <el-dialog :title="keyPersonTitle" :modal="true" :visible.sync="keyPersonVisible" :before-close="keyPersonBeforeClose" :close-on-click-modal="true" class="keyPerson-details-box"> <el-table :data="keyPersonDetailArr" style="width: 100%" <el-dialog :title="keyPersonTitle" :modal="true" :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' }"> :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> @@ -215,11 +331,31 @@ </el-table> </el-dialog> <el-dialog title="警情信息" :modal="true" :visible.sync="policeSituationVisible" :before-close="policeSituationBeforeClose" :close-on-click-modal="true" class="policeSituation-details-box"> <el-dialog title="警情信息" :modal="true" :visible.sync="policeSituationVisible" :before-close="policeSituationBeforeClose" :close-on-click-modal="true" class="policeSituation-details-box" > <div class="btn-change"> <div :class="{ on: policeInformationType == '接警信息' }" @click="policeInformationType = '接警信息'">接警信息</div> <div :class="{ on: policeInformationType == '出警信息' }" @click="policeInformationType = '出警信息'">出警信息</div> <div :class="{ on: policeInformationType == '接警信息' }" @click="policeInformationType = '接警信息'" >接警信息</div> <div :class="{ on: policeInformationType == '出警信息' }" @click="policeInformationType = '出警信息'" >出警信息</div> <div :class="{ on: policeInformationType == '接警信息' }" @click="alarmOrActAsPolice('接警信息')" >接警信息</div> <div :class="{ on: policeInformationType == '出警信息' }" @click="alarmOrActAsPolice('出警信息')" >出警信息</div> </div> <div v-show="policeInformationType == '接警信息'" class="box"> @@ -277,7 +413,62 @@ </div> </div> <div v-show="policeInformationType == '出警信息'" class="box"></div> <div v-show="policeInformationType == '出警信息'" class="box"> <div class="item"> <div>处警单位编号:</div> <div>{{ CJdata.CJDWBH }}</div> </div> <div class="item"> <div>处警单位名称:</div> <div>{{ CJdata.CJDWMC }}</div> </div> <div class="item"> <div>处警单编号:</div> <div>{{ CJdata.CJDBH }}</div> </div> <div class="item"> <div>处警员编号:</div> <div>{{ CJdata.CJYBH }}</div> </div> <div class="item"> <div>处警员姓名:</div> <div>{{ CJdata.CJYXM }}</div> </div> <div class="item"> <div>接警时间:</div> <div>{{ CJdata.JJSJ }}</div> </div> <div class="item"> <div>到达现场时间:</div> <div>{{ CJdata.DDXCSJ }}</div> </div> <div class="item"> <div>首次反馈时间:</div> <div>{{ CJdata.SCFKSJ }}</div> </div> <div class="item"> <div>处理完毕时间:</div> <div>{{ CJdata.CLWBSJ }}</div> </div> <div class="item"> <div>出动人员:</div> <div>{{ CJdata.CDRY }}</div> </div> <div class="item"> <div>出动车辆:</div> <div>{{ CJdata.CDCL }}</div> </div> <div class="item"> <div>处警类型:</div> <div>{{ CJdata.CJLX }}</div> </div> <div class="dialog-content"> <div>备注:</div> <div>{{ CJdata.MEMO }}</div> </div> </div> </el-dialog> </div> </template> @@ -400,6 +591,8 @@ import policeSituationHistoryArr from '@/assets/data/policeSituationArr/historyArr.js' import { getPoliceStationList } from "@/api/dept" import { convertStringToList } from "@/utils/geometryStringTool" import { getActAsPoliceList } from "@/api/home/index.js" export default { data () { @@ -534,6 +727,7 @@ policeSituationRealtimeArr: [], policeSituationHistoryArr: [], policeSituationDetailArr: {}, CJdata: {}, activityDetailArr: {}, } @@ -542,6 +736,7 @@ components: { leftContainer, rightContainer, bottomContainer }, created () { const that = this this.carList = carList this.phoneList = phoneList this.monitoringList = monitoringList @@ -559,6 +754,12 @@ this.getResidentialQuartersList('361102') this.$EventBus.$on('policeSituationSiteClick', (params) => { console.log(params) that.policeSituationSiteClick(params) }) }, mounted () { @@ -604,6 +805,18 @@ }, methods: { // 接出警切换 alarmOrActAsPolice (type) { this.policeInformationType = type this.CJdata = {} if (type == '出警信息') { getActAsPoliceList(this.policeSituationDetailArr.JJDBH).then(res => { this.CJdata = res.data.data.records }) } }, searchName (name, arr) { let obj = {} let flag = false @@ -1726,7 +1939,9 @@ background-color: #66b1ff87; } :deep(.el-tree--highlight-current .el-tree-node.is-current > .el-tree-node__content) { :deep(.el-tree--highlight-current .el-tree-node.is-current > .el-tree-node__content) { background: #454545; } @@ -1738,6 +1953,7 @@ .right { width: 70%; height: 100%; float: left; .monitor { src/views/house/index.vue
@@ -795,6 +795,7 @@ // 获取小区楼栋信息 getResidentialQuartersInfo (areaId, adcode) { getResidentialQuartersInfo(areaId, adcode).then(res => { this.getHouses(res.data.data.build[1].build_id, '361102') this.housingData.name = res.data.data.aoi_name this.buildingList = [] res.data.data.build.forEach(item => { @@ -803,7 +804,6 @@ }) console.log('buildingList', this.buildingList) this.buildingChoosed = this.buildingList[1] this.getHouses(this.buildingList[1].build_id, '361102') }) }, @@ -850,6 +850,8 @@ // 楼栋单元楼层户室查询 getHouses (build_id, adcode) { getHouses(build_id, adcode).then(res => { console.log(res, 999) // 你下面的这些是用来做啥的 this.unitHouseChoosed = res.data.data.unit[this.unitValue - 1].house let houseFloorList = [] this.unitHouseChoosed.forEach(item => { @@ -1768,6 +1770,8 @@ .search-content { position: absolute; position: fixed; z-index: 99; left: 760px; top: 40px; width: 460px; src/views/layout/index.vue
@@ -2,7 +2,7 @@ * @Author: shuishen 1109946754@qq.com * @Date: 2022-08-18 16:18:24 * @LastEditors: shuishen 1109946754@qq.com * @LastEditTime: 2022-12-28 10:08:37 * @LastEditTime: 2023-01-06 17:01:29 * @FilePath: \srs-police-affairs\src\views\layout\index.vue * @Description: * @@ -24,7 +24,7 @@ </div> <div class="title"> <h3>社区警务平台</h3> <h3>信州公安VR指挥平台</h3> </div> <!-- 菜单导航 --> src/views/police/index.vue
@@ -1160,6 +1160,8 @@ .search-content { position: absolute; position: fixed; z-index: 99; left: 760px; top: 40px; width: 460px; src/views/video/list.vue
@@ -762,8 +762,10 @@ .search-content { position: absolute; position: fixed; z-index: 99; left: 760px; top: 40px; top: 120px; width: 460px; height: 36px;