| | |
| | | |
| | | <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" |
| | | @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="'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> |
| | |
| | | </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> |
| | |
| | | </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> |
| | |
| | | </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="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="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> |
| | | </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> |
| | |
| | | </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> |
| | |
| | | </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="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> |
| | | </div> |
| | | </template> |
| | |
| | | this.activityList = showArr |
| | | }, |
| | | |
| | | policeSituationChange () { |
| | | policeSituatifonChange () { |
| | | this.policeSituationSelectChange() |
| | | circleLayer.clear() |
| | | circleLayer.remove() |