| | |
| | | * @Author: shuishen 1109946754@qq.com |
| | | * @Date: 2022-12-27 14:19:19 |
| | | * @LastEditors: shuishen 1109946754@qq.com |
| | | * @LastEditTime: 2023-01-30 10:04:22 |
| | | * @LastEditTime: 2023-02-01 14:50:48 |
| | | * @FilePath: \srs-police-affairs\src\api\home\index.js |
| | | * @Description: |
| | | * |
| | |
| | | |
| | | export default { |
| | | name: 'mapPopup', |
| | | |
| | | inject: ["getWidth", 'userInfo'], |
| | | |
| | | data () { |
| | | return { |
| | | currentBtn: '接警信息', |
| | |
| | | scaleDomFlag: false |
| | | } |
| | | }, |
| | | |
| | | inject: ["getWidth"], |
| | | |
| | | computed: { |
| | | ...mapGetters([ |
| | |
| | | |
| | | this.CJdata = {} |
| | | |
| | | getActAsPoliceList(this.dataPopup.JJDBH, '').then(res => { |
| | | getActAsPoliceList(this.dataPopup.JJDBH, this.userInfo.dept_id).then(res => { |
| | | if (res.data.data.records.length > 0) { |
| | | this.CJdata = res.data.data.records[0] |
| | | } |
| | |
| | | <div class="header"> |
| | | <div class="bottom-title">警情动态</div> |
| | | <div class="timeTab" v-show="historytype"> |
| | | <span |
| | | class="beforetime" |
| | | :class="{ choosed: timetype == 0 }" |
| | | @click="timeTabClick(0)" |
| | | >周</span> |
| | | <span |
| | | class="beforetime" |
| | | :class="{ choosed: timetype == 1 }" |
| | | @click="timeTabClick(1)" |
| | | >月</span> |
| | | <span |
| | | class="beforetime" |
| | | :class="{ choosed: timetype == 2 }" |
| | | @click="timeTabClick(2)" |
| | | >自定义</span> |
| | | <span class="beforetime" :class="{ choosed: timetype == 0 }" @click="timeTabClick(0)">周</span> |
| | | <span class="beforetime" :class="{ choosed: timetype == 1 }" @click="timeTabClick(1)">月</span> |
| | | <span class="beforetime" :class="{ choosed: timetype == 2 }" @click="timeTabClick(2)">自定义</span> |
| | | </div> |
| | | |
| | | <div class="timeSeclect" v-show="historytype"> |
| | | <el-date-picker |
| | | v-show="timetype == 0" |
| | | v-model="currentWeekTime" |
| | | @change="datePickerChange" |
| | | type="week" |
| | | align="center" |
| | | format="yyyy 第 WW 周" |
| | | placeholder="选择周" |
| | | popper-class="date-week-style" |
| | | ></el-date-picker> |
| | | <el-date-picker v-show="timetype == 0" v-model="currentWeekTime" @change="datePickerChange" |
| | | type="week" align="center" format="yyyy 第 WW 周" placeholder="选择周" |
| | | popper-class="date-week-style"></el-date-picker> |
| | | |
| | | <el-date-picker |
| | | v-show="timetype == 1" |
| | | v-model="currentMonthTime" |
| | | @change="datePickerChange" |
| | | type="month" |
| | | align="center" |
| | | placeholder="选择月" |
| | | popper-class="date-mouth-style" |
| | | ></el-date-picker> |
| | | <el-date-picker v-show="timetype == 1" v-model="currentMonthTime" @change="datePickerChange" |
| | | type="month" align="center" placeholder="选择月" popper-class="date-mouth-style"></el-date-picker> |
| | | |
| | | <el-date-picker |
| | | v-show="timetype == 2" |
| | | :clearable="false" |
| | | v-model="currentTime" |
| | | type="daterange" |
| | | align="center" |
| | | unlink-panels |
| | | range-separator="至" |
| | | start-placeholder="开始日期" |
| | | end-placeholder="结束日期" |
| | | @change="datePickerChange" |
| | | :picker-options="pickerOptions" |
| | | popper-class="date-day-style" |
| | | ></el-date-picker> |
| | | <el-date-picker v-show="timetype == 2" :clearable="false" v-model="currentTime" type="daterange" |
| | | align="center" unlink-panels range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" |
| | | @change="datePickerChange" :picker-options="pickerOptions" |
| | | popper-class="date-day-style"></el-date-picker> |
| | | </div> |
| | | |
| | | <div class="history-tab"> |
| | | <span |
| | | class="beforetime" |
| | | :class="{ choosed: historytype == 0 }" |
| | | @click="historyTabClick(0)" |
| | | >实时</span> |
| | | <span |
| | | class="beforetime" |
| | | :class="{ choosed: historytype == 1 }" |
| | | @click="historyTabClick(1)" |
| | | >历史</span> |
| | | <span class="beforetime" :class="{ choosed: historytype == 0 }" |
| | | @click="historyTabClick(0)">实时</span> |
| | | <span class="beforetime" :class="{ choosed: historytype == 1 }" |
| | | @click="historyTabClick(1)">历史</span> |
| | | </div> |
| | | </div> |
| | | |
| | | <div |
| | | class="body" |
| | | v-if="historytype == 0" |
| | | ref="tableBox" |
| | | @click="handleSelectClick($event)" |
| | | > |
| | | <div class="body" v-if="historytype == 0" ref="tableBox" @click="handleSelectClick($event)"> |
| | | <ul class="title-header"> |
| | | <li> |
| | | <span class="num">序号</span> |
| | |
| | | </li> |
| | | </ul> |
| | | |
| | | <vue-seamless-scroll |
| | | v-if="policeSituationRealtimeArr.length > 0" |
| | | :data="policeSituationRealtimeArr" |
| | | class="warp" |
| | | :class-option="classOption" |
| | | > |
| | | <vue-seamless-scroll v-if="policeSituationRealtimeArr.length > 0" :data="policeSituationRealtimeArr" |
| | | class="warp" :class-option="classOption"> |
| | | <ul class="item"> |
| | | <li |
| | | v-for="(item, index) in policeSituationRealtimeArr" |
| | | :key="index" |
| | | :data-obj="JSON.stringify(item)" |
| | | class="row" |
| | | > |
| | | <li v-for="(item, index) in policeSituationRealtimeArr" :key="index" |
| | | :data-obj="JSON.stringify(item)" class="row"> |
| | | <span class="num" v-text="item.index"></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" |
| | | :title="item.BJSJ" |
| | | v-text="item.BJSJ.substring(0, 10)" |
| | | ></span> |
| | | <span class="receiving-alarm-time" :title="item.BJSJ" |
| | | v-text="item.BJSJ.substring(0, 10)"></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> |
| | |
| | | </div> |
| | | |
| | | <div class="current-table-body" ref="ElTableBox" v-if="historytype == 1"> |
| | | <el-table |
| | | :data="policeSituationHistoryArr" |
| | | :key="currentPage" |
| | | style="width: 100%" |
| | | <el-table :data="policeSituationHistoryArr" :key="currentPage" style="width: 100%" |
| | | :height="currentTableHeight" |
| | | :header-cell-style="{ 'text-align': 'center', 'background-color': 'rgba(9, 40, 199, 0.5)', 'borderColor': '#324e75' }" |
| | | :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75' }" |
| | | @cell-click="rowClick" |
| | | > |
| | | <el-table-column |
| | | :show-overflow-tooltip="true" |
| | | prop="index" |
| | | label="序号" |
| | | min-width="6%" |
| | | ></el-table-column> |
| | | <el-table-column |
| | | :show-overflow-tooltip="true" |
| | | prop="JJDWMC" |
| | | label="接警单位" |
| | | min-width="12.6%" |
| | | ></el-table-column> |
| | | <el-table-column |
| | | :show-overflow-tooltip="true" |
| | | prop="JJYXM" |
| | | label="接警员" |
| | | min-width="7.6%" |
| | | ></el-table-column> |
| | | :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75' }" @cell-click="rowClick"> |
| | | <el-table-column :show-overflow-tooltip="true" prop="index" label="序号" |
| | | min-width="6%"></el-table-column> |
| | | <el-table-column :show-overflow-tooltip="true" prop="JJDWMC" label="接警单位" |
| | | min-width="12.6%"></el-table-column> |
| | | <el-table-column :show-overflow-tooltip="true" prop="JJYXM" label="接警员" |
| | | min-width="7.6%"></el-table-column> |
| | | <el-table-column label="报警时间" min-width="9.6%"> |
| | | <template slot-scope="scope"> |
| | | <span>{{ scope.row.BJSJ.substring(0, 10) }}</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column |
| | | :show-overflow-tooltip="true" |
| | | prop="BJRXM" |
| | | label="报警人" |
| | | min-width="7.6%" |
| | | ></el-table-column> |
| | | <el-table-column |
| | | :show-overflow-tooltip="true" |
| | | prop="LXDH" |
| | | label="联系电话" |
| | | min-width="10%" |
| | | ></el-table-column> |
| | | <el-table-column |
| | | :show-overflow-tooltip="true" |
| | | prop="BJNR" |
| | | label="报警内容" |
| | | min-width="12%" |
| | | ></el-table-column> |
| | | <el-table-column |
| | | :show-overflow-tooltip="true" |
| | | prop="SFDZ" |
| | | label="事发地址" |
| | | min-width="12%" |
| | | ></el-table-column> |
| | | <el-table-column |
| | | :show-overflow-tooltip="true" |
| | | prop="BJLX" |
| | | label="报警类型" |
| | | min-width="8%" |
| | | ></el-table-column> |
| | | <el-table-column |
| | | :show-overflow-tooltip="true" |
| | | prop="MEMO" |
| | | label="备注" |
| | | min-width="12%" |
| | | ></el-table-column> |
| | | <el-table-column :show-overflow-tooltip="true" prop="BJRXM" label="报警人" |
| | | min-width="7.6%"></el-table-column> |
| | | <el-table-column :show-overflow-tooltip="true" prop="LXDH" label="联系电话" |
| | | min-width="10%"></el-table-column> |
| | | <el-table-column :show-overflow-tooltip="true" prop="BJNR" label="报警内容" |
| | | min-width="12%"></el-table-column> |
| | | <el-table-column :show-overflow-tooltip="true" prop="SFDZ" label="事发地址" |
| | | min-width="12%"></el-table-column> |
| | | <el-table-column :show-overflow-tooltip="true" prop="BJLX" label="报警类型" |
| | | min-width="8%"></el-table-column> |
| | | <el-table-column :show-overflow-tooltip="true" prop="MEMO" label="备注" |
| | | min-width="12%"></el-table-column> |
| | | </el-table> |
| | | |
| | | <div class="pages" ref="ElPagination" v-if="policeSituationHistoryArr.length > 0"> |
| | | <el-pagination |
| | | background |
| | | layout="prev, pager, next" |
| | | :page-size="pagesize" |
| | | :page-count="pagesCount" |
| | | :current-page="currentPage" |
| | | @current-change="handleCurrentChange" |
| | | ></el-pagination> |
| | | <el-pagination background layout="prev, pager, next" :page-size="pagesize" :page-count="pagesCount" |
| | | :current-page="currentPage" @current-change="handleCurrentChange"></el-pagination> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | |
| | | <svg class="border-svg"> |
| | | <defs> |
| | | <path |
| | | id="bottom-box-path" |
| | | d="M0,0c56.33,0,112.67,0,169,0c2.5,4.31,6.95,6.19,11,9c0.67,1,1.33,2,2,3c16.33,0,32.67,0,49,0 |
| | | <path id="bottom-box-path" d="M0,0c56.33,0,112.67,0,169,0c2.5,4.31,6.95,6.19,11,9c0.67,1,1.33,2,2,3c16.33,0,32.67,0,49,0 |
| | | c55.99,0,112.01,0,168,0c238.64,0,477.36,0,716,0c1.01,1.73,4.64,4.26,5,5c0,20,0,40,0,60c0,49,0,98,0,147c-0.89,1.52,0,19.4,0,25 |
| | | c0,22.33,0,44.67,0,67c-1.43,0.78-4.01,2.77-5,4c-13,0-26,0-39,0c-3-3.33-6-6.67-9-10c-22,0-44,0-66,0c-2.26,3.84-6.72,5.26-8,10 |
| | | c-241.98,0-484.02,0-726,0c-64.33,0-128.67,0-193,0c-17,0-34,0-51,0c-5.68,0-16.19,1.49-20-1c-4.4-2.88-3-12.84-3-20 |
| | | c0-19.33,0-38.67,0-58C0,160.67,0,80.33,0,0z" |
| | | fill="transparent" |
| | | /> |
| | | c0-19.33,0-38.67,0-58C0,160.67,0,80.33,0,0z" fill="transparent" /> |
| | | <radialGradient id="border-box-gradient" 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-mask"> |
| | | <circle cx="0" cy="0" r="150" fill="url(#border-box-gradient)"> |
| | | <animateMotion |
| | | dur="8s" |
| | | path="M0,0c56.33,0,112.67,0,169,0c2.5,4.31,6.95,6.19,11,9c0.67,1,1.33,2,2,3c16.33,0,32.67,0,49,0 |
| | | <animateMotion dur="8s" path="M0,0c56.33,0,112.67,0,169,0c2.5,4.31,6.95,6.19,11,9c0.67,1,1.33,2,2,3c16.33,0,32.67,0,49,0 |
| | | c55.99,0,112.01,0,168,0c238.64,0,477.36,0,716,0c1.01,1.73,4.64,4.26,5,5c0,20,0,40,0,60c0,49,0,98,0,147c-0.89,1.52,0,19.4,0,25 |
| | | c0,22.33,0,44.67,0,67c-1.43,0.78-4.01,2.77-5,4c-13,0-26,0-39,0c-3-3.33-6-6.67-9-10c-22,0-44,0-66,0c-2.26,3.84-6.72,5.26-8,10 |
| | | c-241.98,0-484.02,0-726,0c-64.33,0-128.67,0-193,0c-17,0-34,0-51,0c-5.68,0-16.19,1.49-20-1c-4.4-2.88-3-12.84-3-20 |
| | | c0-19.33,0-38.67,0-58C0,160.67,0,80.33,0,0z" |
| | | rotate="auto" |
| | | repeatCount="indefinite" |
| | | /> |
| | | c0-19.33,0-38.67,0-58C0,160.67,0,80.33,0,0z" rotate="auto" repeatCount="indefinite" /> |
| | | </circle> |
| | | </mask> |
| | | </defs> |
| | | |
| | | <use |
| | | stroke-width="2" |
| | | xlink:href="#bottom-box-path" |
| | | mask="url(#border-box-mask)" |
| | | stroke="#4fd2dd" |
| | | > |
| | | <animate |
| | | attributeName="stroke-dasharray" |
| | | from="0, 3220" |
| | | to="3220, 0" |
| | | dur="8s" |
| | | repeatCount="indefinite" |
| | | /> |
| | | <use stroke-width="2" xlink:href="#bottom-box-path" mask="url(#border-box-mask)" stroke="#4fd2dd"> |
| | | <animate attributeName="stroke-dasharray" from="0, 3220" to="3220, 0" dur="8s" |
| | | repeatCount="indefinite" /> |
| | | </use> |
| | | </svg> |
| | | </div> |
| | |
| | | import { getAnswerPolices, getAlarmList } from "@/api/home/index.js" |
| | | |
| | | export default { |
| | | inject: ["getWidth", 'userInfo'], |
| | | |
| | | data () { |
| | | return { |
| | | timetype: 2, |
| | |
| | | currentTableHeight: 0, |
| | | } |
| | | }, |
| | | |
| | | inject: ["getWidth"], |
| | | |
| | | components: { |
| | | vueSeamlessScroll |
| | |
| | | |
| | | // 获取历史接警记录 |
| | | getAlarmList (params) { |
| | | getAlarmList({ ...params, size: this.pagesize }).then(res => { |
| | | getAlarmList({ ...params, size: this.pagesize, jjdwbh: this.userInfo.dept_id }).then(res => { |
| | | this.pagesCount = res.data.data.pages |
| | | |
| | | this.policeSituationHistoryArr = [] |
| | |
| | | |
| | | <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" |
| | | ref="rightContainer" |
| | | ></right-container> |
| | | <right-container class="right-container" @showequimentdetail="showequimentdetail" |
| | | @selectPoliceChangeEventData="selectPoliceChangeEventData" @changeActivityType="changeActivityType" |
| | | ref="rightContainer"></right-container> |
| | | |
| | | <bottom-container |
| | | class="bottom-container" |
| | | ref="bottomContainer" |
| | | <bottom-container class="bottom-container" ref="bottomContainer" |
| | | @changePoliceSituationHistoryType="changePoliceSituationHistoryType" |
| | | @policeSituationChange="policeSituationChange" |
| | | @policeSituationSiteClick="policeSituationSiteClick" |
| | | ></bottom-container> |
| | | @policeSituationSiteClick="policeSituationSiteClick"></bottom-container> |
| | | |
| | | <div class="center-container"> |
| | | <div class="layers-control-btn house"> |
| | |
| | | </div> |
| | | |
| | | <div ref="RegionSelect" style="left: 0;" class="region-select"> |
| | | <map-select |
| | | class="map-select" |
| | | @selectCheck="policeStationSelect" |
| | | :checkValue="policeStationCheckValue" |
| | | :options="policeStationOptions" |
| | | :optionsName="'name'" |
| | | ></map-select> |
| | | <map-select class="map-select" @selectCheck="policeStationSelect" :checkValue="policeStationCheckValue" |
| | | :options="policeStationOptions" :optionsName="'name'"></map-select> |
| | | |
| | | <map-select |
| | | class="map-select" |
| | | @selectCheck="areaSelect" |
| | | :checkValue="areaCheckValue" |
| | | :options="areaOptions" |
| | | :optionsName="'name'" |
| | | ></map-select> |
| | | <map-select class="map-select" @selectCheck="areaSelect" :checkValue="areaCheckValue" :options="areaOptions" |
| | | :optionsName="'name'"></map-select> |
| | | |
| | | <map-select |
| | | class="map-select" |
| | | @selectCheck="housingSelect" |
| | | :checkValue="housingCheckValue" |
| | | :options="housingOptions" |
| | | :optionsName="'name'" |
| | | ></map-select> |
| | | <map-select class="map-select" @selectCheck="housingSelect" :checkValue="housingCheckValue" |
| | | :options="housingOptions" :optionsName="'name'"></map-select> |
| | | </div> |
| | | |
| | | <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="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> |
| | |
| | | </div> |
| | | </el-dialog> |
| | | |
| | | <el-dialog |
| | | :title="peopleTitle" |
| | | :modal="true" |
| | | :visible.sync="peopleVisible" |
| | | :before-close="personInfoClose" |
| | | :close-on-click-modal="true" |
| | | class="area-details-box" |
| | | > |
| | | <el-dialog :title="peopleTitle" :modal="true" :visible.sync="peopleVisible" :before-close="personInfoClose" |
| | | :close-on-click-modal="true" class="area-details-box"> |
| | | <div class="header"> |
| | | <div> |
| | | 负责人: |
| | |
| | | <input type="text" v-model="peopleCallPhone" 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-table |
| | | :data="peopleInfoList" |
| | | style="width: 100%" |
| | | <el-table :data="peopleInfoList" 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 label="序号" type="index" align="center"> |
| | | <template slot-scope="scope"> |
| | | <span>{{(peoplePage.currentPage - 1) * peoplePage.pageSize + scope.$index + 1}}</span> |
| | |
| | | </el-table> |
| | | |
| | | <div class="pages" ref="tablePagination"> |
| | | <el-pagination |
| | | background |
| | | layout="prev, pager, next" |
| | | :page-size="peoplePage.pageSize" |
| | | :total="peoplePage.total" |
| | | :current-page="peoplePage.currentPage" |
| | | @current-change="handlePeopleCurrentChange" |
| | | ></el-pagination> |
| | | <el-pagination background layout="prev, pager, next" :page-size="peoplePage.pageSize" |
| | | :total="peoplePage.total" :current-page="peoplePage.currentPage" |
| | | @current-change="handlePeopleCurrentChange"></el-pagination> |
| | | </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="others"> |
| | | <el-table |
| | | :data="equimentTableData" |
| | | style="width: 100%" |
| | | <el-table :data="equimentTableData" 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 type="index" :index="indexMethod" label="序号"></el-table-column> |
| | | <el-table-column prop="channelId" label="通道编号"></el-table-column> |
| | | <el-table-column prop="deviceId" label="设备编号"></el-table-column> |
| | |
| | | </el-table-column> |
| | | <el-table-column label="操作"> |
| | | <template slot-scope="scope"> |
| | | <el-button |
| | | @click="play(scope.row)" |
| | | type="text" |
| | | size="small" |
| | | title="播放视频" |
| | | > |
| | | <el-button @click="play(scope.row)" type="text" size="small" title="播放视频"> |
| | | <i class="el-icon-video-play"></i> |
| | | </el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <div class="pages"> |
| | | <el-pagination |
| | | background |
| | | layout="prev, pager, next" |
| | | :total="equimentPagingTotal" |
| | | :page-size="pagesize" |
| | | pager-count="3" |
| | | :current-page="currentPage" |
| | | @current-change="handleCurrentChange" |
| | | ></el-pagination> |
| | | <el-pagination background layout="prev, pager, next" :total="equimentPagingTotal" |
| | | :page-size="pagesize" pager-count="3" :current-page="currentPage" |
| | | @current-change="handleCurrentChange"></el-pagination> |
| | | </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-dialog :title="landTitle" :modal="true" :visible.sync="landVisible" :before-close="landBeforeClose" |
| | | :close-on-click-modal="true" class="land-details-box"> |
| | | <div class="header"> |
| | | <div> |
| | | 负责人: |
| | |
| | | <input type="text" v-model="callPhone" placeholder="请输入联系电话" /> |
| | | </div> |
| | | <el-button type="primary" icon="el-icon-search" @click="searchLandDetail">搜索</el-button> |
| | | <el-button |
| | | type="primary" |
| | | icon="el-icon-delete" |
| | | @click="clearLandDetailSearchValue" |
| | | >清空</el-button> |
| | | <el-button type="primary" icon="el-icon-delete" @click="clearLandDetailSearchValue">清空</el-button> |
| | | </div> |
| | | |
| | | <el-table |
| | | :data="landDetailArr" |
| | | style="width: 100%" |
| | | <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 label="序号" type="index" width="50" align="center"> |
| | | <template slot-scope="scope"> |
| | | <span>{{(landPage.currentPage - 1) * landPage.pageSize + scope.$index + 1}}</span> |
| | |
| | | <el-table-column prop="phone" label="联系电话"></el-table-column> |
| | | </el-table> |
| | | <div class="pages" ref="tablePagination"> |
| | | <el-pagination |
| | | background |
| | | layout="prev, pager, next" |
| | | :page-size="landPage.pageSize" |
| | | :total="landPage.total" |
| | | :current-page="landPage.currentPage" |
| | | @current-change="landHandleCurrentChange" |
| | | ></el-pagination> |
| | | <el-pagination background layout="prev, pager, next" :page-size="landPage.pageSize" |
| | | :total="landPage.total" :current-page="landPage.currentPage" |
| | | @current-change="landHandleCurrentChange"></el-pagination> |
| | | </div> |
| | | </el-dialog> |
| | | |
| | | <el-dialog |
| | | :title="keyPersonTitle" |
| | | :modal="true" |
| | | :visible.sync="keyPersonVisible" |
| | | :before-close="personInfoClose" |
| | | :close-on-click-modal="true" |
| | | class="keyPerson-details-box" |
| | | > |
| | | <el-dialog :title="keyPersonTitle" :modal="true" :visible.sync="keyPersonVisible" |
| | | :before-close="personInfoClose" :close-on-click-modal="true" class="keyPerson-details-box"> |
| | | <div class="header"> |
| | | <div> |
| | | 人员名称: |
| | |
| | | <input type="text" v-model="peopleCallPhone" 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-table |
| | | :data="keyPersonDetailArr" |
| | | style="width: 100%" |
| | | <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="zdryxl" label="重点人员类型"></el-table-column> |
| | | <el-table-column prop="realName" label="姓名"></el-table-column> |
| | | <el-table-column prop="address" label="地址"></el-table-column> |
| | |
| | | </el-table> |
| | | |
| | | <div class="pages" ref="tablePagination"> |
| | | <el-pagination |
| | | background |
| | | layout="prev, pager, next" |
| | | :page-size="peoplePage.pageSize" |
| | | :total="peoplePage.total" |
| | | :current-page="peoplePage.currentPage" |
| | | @current-change="handlePersonPageChange" |
| | | ></el-pagination> |
| | | <el-pagination background layout="prev, pager, next" :page-size="peoplePage.pageSize" |
| | | :total="peoplePage.total" :current-page="peoplePage.currentPage" |
| | | @current-change="handlePersonPageChange"></el-pagination> |
| | | </div> |
| | | </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="alarmOrActAsPolice('接警信息')" |
| | | >接警信息</div> |
| | | <div |
| | | :class="{ on: policeInformationType == '出警信息' }" |
| | | @click="alarmOrActAsPolice('出警信息')" |
| | | >出警信息</div> |
| | | <div :class="{ on: policeInformationType == '接警信息' }" @click="alarmOrActAsPolice('接警信息')">接警信息</div> |
| | | <div :class="{ on: policeInformationType == '出警信息' }" @click="alarmOrActAsPolice('出警信息')">出警信息</div> |
| | | </div> |
| | | |
| | | <div v-show="policeInformationType == '接警信息'" class="box"> |
| | |
| | | </div> |
| | | </div> |
| | | |
| | | <div |
| | | v-show="policeInformationType == '出警信息' && JSON.stringify(CJdata) != '{}'" |
| | | class="box" |
| | | > |
| | | <div v-show="policeInformationType == '出警信息' && JSON.stringify(CJdata) != '{}'" class="box"> |
| | | <div class="item"> |
| | | <div>处警单位编号:</div> |
| | | <div>{{ CJdata.CJDWBH }}</div> |
| | |
| | | </div> |
| | | </div> |
| | | |
| | | <div |
| | | v-show="policeInformationType == '出警信息' && JSON.stringify(CJdata) == '{}'" |
| | | class="box no-data" |
| | | >暂无数据</div> |
| | | <div v-show="policeInformationType == '出警信息' && JSON.stringify(CJdata) == '{}'" class="box no-data">暂无数据 |
| | | </div> |
| | | </el-dialog> |
| | | |
| | | <el-dialog |
| | | :title="dialogEquimentVideoTitle" |
| | | :modal="true" |
| | | :visible.sync="dialogEquimentVideoVisible" |
| | | :before-close="dialogBeforeClose" |
| | | :close-on-click-modal="true" |
| | | class="car-video-box" |
| | | > |
| | | <video |
| | | autoplay |
| | | controls |
| | | width="100%" |
| | | height="100%" |
| | | ref="videoElement" |
| | | id="videoElement" |
| | | style="object-fit: fill" |
| | | ></video> |
| | | <el-dialog :title="dialogEquimentVideoTitle" :modal="true" :visible.sync="dialogEquimentVideoVisible" |
| | | :before-close="dialogBeforeClose" :close-on-click-modal="true" class="car-video-box"> |
| | | <video autoplay controls width="100%" height="100%" ref="videoElement" id="videoElement" |
| | | style="object-fit: fill"></video> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | |
| | | if (type == '出警信息') { |
| | | this.CJdata = {} |
| | | |
| | | getActAsPoliceList(this.policeSituationDetailObj.JJDBH).then(res => { |
| | | getActAsPoliceList(this.policeSituationDetailObj.JJDBH, this.userInfo.dept_id).then(res => { |
| | | if (res.data.data.records.length > 0) { |
| | | this.CJdata = res.data.data.records[0] |
| | | } |
| | |
| | | * @Author: shuishen 1109946754@qq.com |
| | | * @Date: 2022-08-18 16:18:17 |
| | | * @LastEditors: shuishen 1109946754@qq.com |
| | | * @LastEditTime: 2023-01-31 15:17:06 |
| | | * @LastEditTime: 2023-02-01 14:52:49 |
| | | * @FilePath: \srs-police-affairs\src\views\house\index.vue |
| | | * @Description: 小区-栋-层-房屋 |
| | | * |
| | |
| | | |
| | | // 获取历史接警记录 |
| | | getAlarmList () { |
| | | getAlarmList({ current: this.callPolicePage.currentPage, size: this.callPolicePage.pagesize, sfdz: this.villageInfo.name }).then(res => { |
| | | getAlarmList({ current: this.callPolicePage.currentPage, size: this.callPolicePage.pagesize, sfdz: this.villageInfo.name, jjdwbh: this.userInfo.dept_id }).then(res => { |
| | | this.callPolicePage.count = res.data.data.pages |
| | | |
| | | this.callPoliceData = [] |