| | |
| | | }) |
| | | } |
| | | |
| | | // 获取接警历史记录统计数据 |
| | | export const getAlarmStatistics = (params) => { |
| | | return request({ |
| | | url: `/api/alarm/alarm/statisticsAlarmByBJLX`, |
| | | method: 'get', |
| | | params: { |
| | | ...params |
| | | } |
| | | }) |
| | | } |
| | | |
| | | // 获取处警历史 |
| | | export const getActAsPoliceList = (alarmID, cjdwbh = '') => { |
| | | return request({ |
| | |
| | | <slot name="showButton"></slot> |
| | | <div class="over-look-btn"> |
| | | <el-tooltip content="一键俯视" placement="top" effect="dark"> |
| | | <i |
| | | class="fa fa-eye" |
| | | style="vertical-align: middle; cursor: pointer" |
| | | @click="overLookClick" |
| | | ></i> |
| | | <i class="fa fa-eye" style="vertical-align: middle; cursor: pointer" @click="overLookClick"></i> |
| | | </el-tooltip> |
| | | </div> |
| | | <!-- 全屏控制按钮 --> |
| | | <div class="screen-full-btn"> |
| | | <el-tooltip |
| | | v-if="!isShowHomeContentBtn && isFullscreen" |
| | | content="缩放" |
| | | placement="top" |
| | | effect="dark" |
| | | > |
| | | <i |
| | | class="fa fa-compress" |
| | | style="vertical-align: middle; cursor: pointer" |
| | | @click="fullscreenchange" |
| | | ></i> |
| | | <el-tooltip v-if="!isShowHomeContentBtn && isFullscreen" content="缩放" placement="top" effect="dark"> |
| | | <i class="fa fa-compress" style="vertical-align: middle; cursor: pointer" @click="fullscreenchange"></i> |
| | | </el-tooltip> |
| | | |
| | | <el-tooltip |
| | | v-if="!isShowHomeContentBtn && !isFullscreen" |
| | | content="全屏" |
| | | placement="top" |
| | | effect="dark" |
| | | > |
| | | <i |
| | | class="fa fa-expand" |
| | | style="vertical-align: middle; cursor: pointer" |
| | | @click="fullscreenchange" |
| | | ></i> |
| | | <el-tooltip v-if="!isShowHomeContentBtn && !isFullscreen" content="全屏" placement="top" effect="dark"> |
| | | <i class="fa fa-expand" style="vertical-align: middle; cursor: pointer" @click="fullscreenchange"></i> |
| | | </el-tooltip> |
| | | <el-tooltip v-if="isShowHomeContentBtn" content="显示/隐藏" placement="top" effect="dark"> |
| | | <i |
| | | class="fa fa-expand" |
| | | style="vertical-align: middle; cursor: pointer" |
| | | @click="switchShowHomeContent" |
| | | ></i> |
| | | <i class="fa fa-expand" style="vertical-align: middle; cursor: pointer" @click="switchShowHomeContent"></i> |
| | | </el-tooltip> |
| | | </div> |
| | | <!-- 切换矢量图按钮 --> |
| | |
| | | // global.viewer.addTerrain(terrain) |
| | | |
| | | // 内网 |
| | | // that.switchImg() |
| | | that.switchImg() |
| | | |
| | | // 地形数据添加 |
| | | // that.addTerrain() |
| | | that.addTerrain() |
| | | |
| | | // 外网 |
| | | global.viewer.imageryLayers.addImageryProvider( |
| | | new global.DC.Namespace.Cesium.UrlTemplateImageryProvider({ |
| | | url: 'http://t{s}.tianditu.gov.cn/DataServer?T=vec_w&x={x}&y={y}&l={z}&tk=d083e4cf30bfc438ef93436c10c2c20a', |
| | | 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=vec_w&x={x}&y={y}&l={z}&tk=d083e4cf30bfc438ef93436c10c2c20a', |
| | | // subdomains: ['0', '1', '2', '3', '4', '5', '6', '7'], |
| | | // format: 'image/jpeg', |
| | | // show: true, |
| | | // maximumLevel: 18 |
| | | // }) |
| | | // ) |
| | | |
| | | // 设置地图初始位置,角度等 |
| | | global.viewer.camera.setView({ |
| | |
| | | .el-table td .cell { |
| | | height: auto !important; |
| | | } |
| | | |
| | | .jq-tab { |
| | | |
| | | div { |
| | | height: countSizeVh(30); |
| | | line-height: countSizeVh(30); |
| | | } |
| | | } |
| | | |
| | | .echarts-box { |
| | | padding: countSizeVh(12); |
| | | height: countSizeVh(300); |
| | | } |
| | | } |
| | | |
| | | .all-pagination-sty { |
| | |
| | | <span>要素资源:</span> |
| | | <ul> |
| | | <li> |
| | | <button |
| | | @click="drawThreeArrow('billboard', 'police', 'policeman')" |
| | | title="警员" |
| | | > |
| | | <button @click="drawThreeArrow('billboard', 'police', 'policeman')" title="警员"> |
| | | <img src="/img/icon/police-people-btn.png" style="height:100%" /> |
| | | </button> |
| | | </li> |
| | | <li> |
| | | <button |
| | | @click="drawThreeArrow('billboard', 'police', 'policecar')" |
| | | title="警车" |
| | | > |
| | | <button @click="drawThreeArrow('billboard', 'police', 'policecar')" title="警车"> |
| | | <img src="/img/icon/car-btn.png" style="height:100%" /> |
| | | </button> |
| | | </li> |
| | | <li> |
| | | <button |
| | | @click="drawThreeArrow('billboard', 'icon', 'icon4')" |
| | | title="自定义图片标注" |
| | | >自定义图片标注</button> |
| | | <button @click="drawThreeArrow('billboard', 'icon', 'icon4')" title="自定义图片标注">自定义图片标注</button> |
| | | </li> |
| | | <li> |
| | | <button @click="drawThreeArrow('billboard', 'icon', 'icon5')" title="其他">其他</button> |
| | |
| | | <span>作战标绘:</span> |
| | | <ul> |
| | | <li> |
| | | <button |
| | | @click="drawThreeArrow('polygon', 'polygon', 'polygon')" |
| | | title="多边形" |
| | | >多边形</button> |
| | | <button @click="drawThreeArrow('polygon', 'polygon', 'polygon')" title="多边形">多边形</button> |
| | | </li> |
| | | <li> |
| | | <button |
| | | @click="drawThreeArrow('brokenline', 'brokenline', 'brokenline')" |
| | | title="折线" |
| | | >折线</button> |
| | | <button @click="drawThreeArrow('brokenline', 'brokenline', 'brokenline')" title="折线">折线</button> |
| | | </li> |
| | | </ul> |
| | | </div> |
| | |
| | | <li> |
| | | <!-- <el-button |
| | | ></el-button>--> |
| | | <button |
| | | @click="drawThreeArrow('polyline', 'policecar', 'polyline')" |
| | | title="巡逻路线" |
| | | > |
| | | <button @click="drawThreeArrow('polyline', 'policecar', 'polyline')" title="巡逻路线"> |
| | | <img src="/img/icon/route1.png" style="height:100%" /> |
| | | </button> |
| | | </li> |
| | |
| | | let positions = position.split(';').map((item, index) => `${item},140`) |
| | | positions.push(positions[0]) |
| | | positions = positions.join(';') |
| | | if (item.type == 5 || item.areaType == 2) { |
| | | if (item.type == 5 && item.areaType == 2) { |
| | | this.$parent.removeArrowsListLayer(addPlotOverlayData) |
| | | |
| | | addPlotOverlayData = new global.DC.Wall(positions) |
| | |
| | | .right { |
| | | height: 100%; |
| | | |
| | | & > div { |
| | | &>div { |
| | | display: flex; |
| | | } |
| | | |
| | |
| | | <template> |
| | | <div> |
| | | <el-dialog |
| | | title="修改标绘" |
| | | :visible.sync="editPlotVisible" |
| | | :modal="true" |
| | | :close-on-click-modal="false" |
| | | :modal-append-to-body="true" |
| | | :append-to-body="true" |
| | | class="edit-plot-box" |
| | | > |
| | | <el-dialog title="修改标绘" :visible.sync="editPlotVisible" :modal="true" :close-on-click-modal="false" |
| | | :modal-append-to-body="true" :append-to-body="true" class="edit-plot-box"> |
| | | <div> |
| | | <div class="line"> |
| | | <div class="value-name-box">描述:</div> |
| | | <div class="input-width-box" style="flex: 1;"> |
| | | <input |
| | | style="width: 100%;" |
| | | type="text" |
| | | v-model="polygonRemark" |
| | | placeholder="请输入..." |
| | | /> |
| | | <input style="width: 100%;" type="text" v-model="polygonRemark" placeholder="请输入..." /> |
| | | </div> |
| | | </div> |
| | | |
| | |
| | | <div class="value-name-box">选择类型:</div> |
| | | <div class="select-type" style="flex: 1;"> |
| | | <el-select size="small" v-model="restPlotType" placeholder="请选择类型"> |
| | | <el-option |
| | | v-for="item in restPlotSelectArray" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value" |
| | | ></el-option> |
| | | <el-option v-for="item in restPlotSelectArray" :key="item.value" :label="item.label" |
| | | :value="item.value"></el-option> |
| | | </el-select> |
| | | </div> |
| | | </div> |
| | | |
| | | <div class="line" v-show="customImageShow"> |
| | | <div class="value-name-box">选择图片:</div> |
| | | <div |
| | | class="select-image" |
| | | style="position: relative; display: flex; align-items: center;" |
| | | > |
| | | <el-button |
| | | style="margin-top: 0; position: relative; background: transparent; border-color: #fff;" |
| | | @click="imagesListShow = !imagesListShow" |
| | | > |
| | | <img |
| | | :src="curImgUrl" |
| | | alt |
| | | style="position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; z-index: 999; width: 20px; height: 20px;" |
| | | /> |
| | | <div class="select-image" style="position: relative; display: flex; align-items: center;"> |
| | | <el-button style="margin-top: 0; position: relative; background: transparent; border-color: #fff;" |
| | | @click="imagesListShow = !imagesListShow"> |
| | | <img :src="curImgUrl" alt |
| | | style="position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; z-index: 999; width: 20px; height: 20px;" /> |
| | | </el-button> |
| | | |
| | | <images-select v-show="imagesListShow" @curClick="curClick"></images-select> |
| | |
| | | <div class="line"> |
| | | <div class="value-name-box">选择标绘颜色:</div> |
| | | <div class="pick-color-box"> |
| | | <el-color-picker |
| | | v-model="choosePlotColor" |
| | | :predefine="predefineColors" |
| | | size="small" |
| | | ></el-color-picker> |
| | | <el-color-picker v-model="choosePlotColor" :predefine="predefineColors" |
| | | size="small"></el-color-picker> |
| | | </div> |
| | | </div> |
| | | |
| | | <div class="line"> |
| | | <div class="value-name-box">设置透明度:</div> |
| | | <div class="alpha"> |
| | | <el-slider |
| | | :min="1" |
| | | v-model="choosePlotColorAlpha" |
| | | :format-tooltip="formatTooltip" |
| | | ></el-slider> |
| | | <el-slider :min="1" v-model="choosePlotColorAlpha" :format-tooltip="formatTooltip"></el-slider> |
| | | </div> |
| | | </div> |
| | | |
| | |
| | | </div> |
| | | </el-dialog> |
| | | |
| | | <el-dialog |
| | | title="新增标绘" |
| | | :visible.sync="polygonAddVisible" |
| | | :modal="true" |
| | | :close-on-click-modal="false" |
| | | :modal-append-to-body="true" |
| | | :append-to-body="true" |
| | | class="add-polygon-box" |
| | | :before-close="cancelSavePolygon" |
| | | > |
| | | <el-dialog title="新增标绘" :visible.sync="polygonAddVisible" :modal="true" :close-on-click-modal="false" |
| | | :modal-append-to-body="true" :append-to-body="true" class="add-polygon-box" :before-close="cancelSavePolygon"> |
| | | <div> |
| | | <div class="line"> |
| | | <div class="value-name-box">描述:</div> |
| | | <div class="input-width-box" style="flex: 1;"> |
| | | <input |
| | | style="width: 100%;" |
| | | type="text" |
| | | v-model="polygonRemark" |
| | | placeholder="请输入..." |
| | | /> |
| | | <input style="width: 100%;" type="text" v-model="polygonRemark" placeholder="请输入..." /> |
| | | </div> |
| | | </div> |
| | | |
| | |
| | | <div class="value-name-box">选择类型:</div> |
| | | <div class="select-type" style="flex: 1;"> |
| | | <el-select size="small" v-model="restPlotType" placeholder="请选择类型"> |
| | | <el-option |
| | | v-for="item in restPlotSelectArray" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value" |
| | | ></el-option> |
| | | <el-option v-for="item in restPlotSelectArray" :key="item.value" :label="item.label" |
| | | :value="item.value"></el-option> |
| | | </el-select> |
| | | </div> |
| | | </div> |
| | |
| | | <div class="value-name-box">选择类型:</div> |
| | | <div class="select-type" style="flex: 1;"> |
| | | <el-select size="small" v-model="polygonAreaType" placeholder="请选择区域类型"> |
| | | <el-option |
| | | v-for="item in polygonAreaOption" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value" |
| | | ></el-option> |
| | | <el-option v-for="item in polygonAreaOption" :key="item.value" :label="item.label" |
| | | :value="item.value"></el-option> |
| | | </el-select> |
| | | </div> |
| | | </div> |
| | | |
| | | <div class="line" v-show="customImageShow"> |
| | | <div class="value-name-box">选择图片:</div> |
| | | <div |
| | | class="select-image" |
| | | style="position: relative; display: flex; align-items: center;" |
| | | > |
| | | <el-button |
| | | style="margin-top: 0; position: relative; background: transparent; border-color: #fff;" |
| | | @click="imagesListShow = !imagesListShow" |
| | | > |
| | | <img |
| | | :src="curImgUrl" |
| | | alt |
| | | style="position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; z-index: 999; width: 20px; height: 20px;" |
| | | /> |
| | | <div class="select-image" style="position: relative; display: flex; align-items: center;"> |
| | | <el-button style="margin-top: 0; position: relative; background: transparent; border-color: #fff;" |
| | | @click="imagesListShow = !imagesListShow"> |
| | | <img :src="curImgUrl" alt |
| | | style="position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; z-index: 999; width: 20px; height: 20px;" /> |
| | | </el-button> |
| | | <images-select v-show="imagesListShow" @curClick="curClick"></images-select> |
| | | </div> |
| | |
| | | <div class="line"> |
| | | <div class="value-name-box">选择标绘颜色:</div> |
| | | <div class="pick-color-box"> |
| | | <el-color-picker |
| | | v-model="choosePlotColor" |
| | | :predefine="predefineColors" |
| | | size="small" |
| | | ></el-color-picker> |
| | | <el-color-picker v-model="choosePlotColor" :predefine="predefineColors" |
| | | size="small"></el-color-picker> |
| | | </div> |
| | | </div> |
| | | |
| | | <div class="line"> |
| | | <div class="value-name-box">设置透明度:</div> |
| | | <div class="alpha"> |
| | | <el-slider |
| | | :min="1" |
| | | v-model="choosePlotColorAlpha" |
| | | :format-tooltip="formatTooltip" |
| | | ></el-slider> |
| | | <el-slider :min="1" v-model="choosePlotColorAlpha" :format-tooltip="formatTooltip"></el-slider> |
| | | </div> |
| | | </div> |
| | | |
| | |
| | | :value="item.value" class="option-css"></el-option> |
| | | </el-select> |
| | | </div> |
| | | <!-- <div class="jq-tab">1111111111</div> --> |
| | | <el-table :data="callPoliceData" style="width: 100%" :height="currentTableHeight" |
| | | :header-cell-style="{ 'text-align': 'center', 'background-color': '#203c60', 'borderColor': '#324e75' }" |
| | | :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75' }" |
| | | :row-class-name="tableRowClassName" :empty-text="jqNoDataText" class="police-infor-table" |
| | | @cell-click="housingPoliceSiteClick"> |
| | | <el-table-column prop="JJDWMC" :show-overflow-tooltip="true" label="接警单位" |
| | | min-width="80%"></el-table-column> |
| | | <el-table-column label="报警时间" prop="BJSJ" min-width="50%"></el-table-column> |
| | | <el-table-column prop="BJLX" :show-overflow-tooltip="true" label="报警类型"></el-table-column> |
| | | <el-table-column label="操作" align="center" min-width="36%"> |
| | | <template slot-scope="scope"> |
| | | <el-button v-if="!whetherPosition(scope.row)" @click="clickData(scope.row)" type="text" |
| | | size="small" title="定位"> |
| | | <i class="el-icon-location" :style="{ color: positionColor(scope.row) }"></i> |
| | | </el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | |
| | | <div class="pages all-pagination-sty" ref="ElPagination"> |
| | | <el-pagination background layout="prev, pager, next" :page-size="callPolicePage.pageSize" |
| | | :page-count="callPolicePage.count" :current-page="callPolicePage.currentPage" |
| | | @current-change="handleCurrentChange"></el-pagination> |
| | | <div class="jq-tab"> |
| | | <div :class="{ choosed: jqType == 0 }" @click="jqTabClick(0)">明细</div> |
| | | <div :class="{ choosed: jqType == 1 }" @click="jqTabClick(1)">统计图</div> |
| | | </div> |
| | | <div v-show="jqType == 0"> |
| | | <el-table :data="callPoliceData" style="width: 100%" :height="currentTableHeight" |
| | | :header-cell-style="{ 'text-align': 'center', 'background-color': '#203c60', 'borderColor': '#324e75' }" |
| | | :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75' }" |
| | | :row-class-name="tableRowClassName" :empty-text="jqNoDataText" class="police-infor-table" |
| | | @cell-click="housingPoliceSiteClick"> |
| | | <el-table-column prop="JJDWMC" :show-overflow-tooltip="true" label="接警单位" |
| | | min-width="80%"></el-table-column> |
| | | <el-table-column label="报警时间" prop="BJSJ" min-width="50%"></el-table-column> |
| | | <el-table-column prop="BJLX" :show-overflow-tooltip="true" label="报警类型"></el-table-column> |
| | | <el-table-column label="操作" align="center" min-width="36%"> |
| | | <template slot-scope="scope"> |
| | | <el-button v-if="!whetherPosition(scope.row)" @click="clickData(scope.row)" |
| | | type="text" size="small" title="定位"> |
| | | <i class="el-icon-location" :style="{ color: positionColor(scope.row) }"></i> |
| | | </el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | |
| | | <div class="pages all-pagination-sty" ref="ElPagination"> |
| | | <el-pagination background layout="prev, pager, next" :page-size="callPolicePage.pageSize" |
| | | :page-count="callPolicePage.count" :current-page="callPolicePage.currentPage" |
| | | @current-change="handleCurrentChange"></el-pagination> |
| | | </div> |
| | | </div> |
| | | <div> |
| | | <div class="echarts-box" id="JQSEchart"></div> |
| | | </div> |
| | | |
| | | </el-main> |
| | | </div> |
| | | </div> |
| | |
| | | let curHousingName = "" |
| | | |
| | | let curHousingHWTXA = {} |
| | | let JQSmychart = null |
| | | |
| | | import { BjlxData } from "@/assets/police" |
| | | |
| | |
| | | getAoiByPt, |
| | | getSearchExtensivelyHousesdata |
| | | } from "@/api/dept/index.js" |
| | | import { getAlarmList } from "@/api/home/index.js" |
| | | import { getAlarmList, getAlarmStatistics } from "@/api/home/index.js" |
| | | |
| | | let wallLayer = null |
| | | |
| | |
| | | data () { |
| | | return { |
| | | typeValue: '', |
| | | jqType: 0, |
| | | policeInforOptions: [ |
| | | { |
| | | value: '', |
| | |
| | | wallLayer = new global.DC.VectorLayer("wallLayer") |
| | | global.viewer.addLayer(wallLayer) |
| | | } |
| | | |
| | | // console.log('JQSmychart', JQSmychart) |
| | | |
| | | let option = { |
| | | series: [ |
| | | { |
| | | type: 'pie', |
| | | radius: '50%', |
| | | data: [ |
| | | { value: 1048, name: 'Search Engine' }, |
| | | { value: 735, name: 'Direct' }, |
| | | { value: 580, name: 'Email' }, |
| | | { value: 484, name: 'Union Ads' }, |
| | | { value: 300, name: 'Video Ads' } |
| | | ] |
| | | } |
| | | ] |
| | | } |
| | | JQSmychart.setOption(option, true) |
| | | }) |
| | | }, |
| | | |
| | | updated () { }, |
| | | |
| | | methods: { |
| | | // 警情统计 |
| | | getAlarmStatistics () { |
| | | getAlarmStatistics({ |
| | | start: this.eventTimeArr[0], |
| | | end: this.eventTimeArr[1], |
| | | aoiId: this.villageInfo.aoiId, |
| | | }).then( |
| | | res => { |
| | | console.log('getAlarmStatistics', res.data) |
| | | let newArr = [] |
| | | res.data.forEach(item => { |
| | | newArr.push({ name: item.name, value: item.count }) |
| | | }) |
| | | this.$nextTick(() => { |
| | | var chartDom = document.getElementById('JQSEchart') |
| | | JQSmychart = this.$echarts.init(chartDom) |
| | | JQSmychart.setOption(this.initJQSOption(newArr)) |
| | | }) |
| | | |
| | | } |
| | | ) |
| | | }, |
| | | |
| | | // 警情图表 |
| | | initJQSOption (dataArr) { |
| | | let options |
| | | if (dataArr.length == 0) { |
| | | options = { |
| | | title: { |
| | | text: '暂无警情数据', |
| | | x: 'center', |
| | | y: 'center', |
| | | textStyle: { |
| | | color: '#fff', |
| | | fontWeight: 'normal', |
| | | // fontSize: fontSize(14) |
| | | } |
| | | } |
| | | } |
| | | } else { |
| | | options = { |
| | | series: [ |
| | | { |
| | | type: 'pie', |
| | | radius: '50%', |
| | | data: dataArr |
| | | } |
| | | ] |
| | | } |
| | | } |
| | | return options |
| | | }, |
| | | |
| | | // 警情切换tab |
| | | jqTabClick (type) { |
| | | this.jqType = type |
| | | if (type == 1) { |
| | | this.getAlarmStatistics() |
| | | } |
| | | }, |
| | | |
| | | // 警情下拉事件 |
| | | changeJQType (type) { |
| | | this.getAlarmList() |
| | | }, |
| | |
| | | |
| | | navClick (e) { |
| | | if (this.navType == e.target.dataset.type) return |
| | | this.jqType = 0 |
| | | this.navType = e.target.dataset.type |
| | | |
| | | this.$store.commit('SET_HOUSEDEEPDATAPOPUP', false) |
| | |
| | | :deep(.el-select) { |
| | | width: 100%; |
| | | } |
| | | } |
| | | |
| | | .jq-tab { |
| | | display: flex; |
| | | |
| | | div { |
| | | width: 50%; |
| | | height: 30px; |
| | | line-height: 30px; |
| | | cursor: pointer; |
| | | } |
| | | |
| | | div.choosed { |
| | | background-color: #2f50b7; |
| | | } |
| | | } |
| | | |
| | | .echarts-box { |
| | | // padding: 12px; |
| | | padding-top: 0; |
| | | flex: 1; |
| | | width: 100%; |
| | | height: 300px; |
| | | } |
| | | } |
| | | } |
| | |
| | | <div class="search-item-box"> |
| | | <span>警情类型:</span> |
| | | |
| | | <el-select |
| | | style="flex: 1;" |
| | | size="small" |
| | | v-model="policeInforValue" |
| | | @change="policeTypeChange" |
| | | placeholder="请选择" |
| | | > |
| | | <el-option |
| | | v-for="item in policeInforOptions" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value" |
| | | ></el-option> |
| | | <el-select style="flex: 1;" size="small" v-model="policeInforValue" @change="policeTypeChange" |
| | | placeholder="请选择"> |
| | | <el-option v-for="item in policeInforOptions" :key="item.value" :label="item.label" |
| | | :value="item.value"></el-option> |
| | | </el-select> |
| | | </div> |
| | | |
| | | <div class="search-item-box"> |
| | | <el-date-picker |
| | | size="mini" |
| | | :clearable="false" |
| | | v-model="currentTime" |
| | | type="daterange" |
| | | align="center" |
| | | unlink-panels |
| | | range-separator="至" |
| | | start-placeholder="开始日期" |
| | | end-placeholder="结束日期" |
| | | @change="datePickerChange" |
| | | :picker-options="pickerOptions" |
| | | ></el-date-picker> |
| | | <el-date-picker size="mini" :clearable="false" v-model="currentTime" type="daterange" align="center" |
| | | unlink-panels range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" |
| | | @change="datePickerChange" :picker-options="pickerOptions"></el-date-picker> |
| | | </div> |
| | | </div> |
| | | |
| | | <div class="police-info"> |
| | | <el-table |
| | | :data="historyPoliceInforData" |
| | | style="width: 100%" |
| | | :height="currentTableHeight" |
| | | <el-table :data="historyPoliceInforData" style="width: 100%" :height="currentTableHeight" |
| | | :header-cell-style="{ 'text-align': 'center', 'background-color': '#203c60', 'borderColor': '#324e75' }" |
| | | :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75', 'cursor': 'default' }" |
| | | :row-class-name="tableRowClassName" |
| | | class="police-infor-table" |
| | | @cell-mouse-enter="tableEnter" |
| | | @cell-mouse-leave="tabelLeave" |
| | | > |
| | | :row-class-name="tableRowClassName" class="police-infor-table" @cell-mouse-enter="tableEnter" |
| | | @cell-mouse-leave="tabelLeave"> |
| | | <template slot="empty"> |
| | | <div>{{ historyEmptyText }}</div> |
| | | </template> |
| | | <el-table-column |
| | | prop="JJDWMC" |
| | | :show-overflow-tooltip="true" |
| | | label="接警单位" |
| | | min-width="80%" |
| | | ></el-table-column> |
| | | <el-table-column prop="JJDWMC" :show-overflow-tooltip="true" label="接警单位" |
| | | min-width="80%"></el-table-column> |
| | | <el-table-column prop="BJSJ" label="报警时间" min-width="50%"></el-table-column> |
| | | <el-table-column prop="BJLX" label="报警类型"></el-table-column> |
| | | <el-table-column label="操作" align="center" min-width="32%"> |
| | | <template slot-scope="scope"> |
| | | <el-button |
| | | v-if="!whetherPosition(scope.row)" |
| | | @click="clickData(scope.row)" |
| | | type="text" |
| | | size="small" |
| | | title="定位" |
| | | > |
| | | <i |
| | | class="el-icon-location" |
| | | :style="{ color: positionColor(scope.row) }" |
| | | ></i> |
| | | <el-button v-if="!whetherPosition(scope.row)" @click="clickData(scope.row)" type="text" |
| | | size="small" title="定位"> |
| | | <i class="el-icon-location" :style="{ color: positionColor(scope.row) }"></i> |
| | | </el-button> |
| | | <el-buttonalign-justify |
| | | @click="siteClick(scope.row)" |
| | | type="text" |
| | | size="small" |
| | | title="详情" |
| | | > |
| | | <el-buttonalign-justify @click="siteClick(scope.row)" type="text" size="small" title="详情"> |
| | | <i class="el-icon-document"></i> |
| | | </el-buttonalign-justify> |
| | | </template> |
| | |
| | | </div> |
| | | </div> |
| | | |
| | | <el-dialog |
| | | title="警情信息" |
| | | :visible.sync="policeSituationVisible" |
| | | :modal-append-to-body="false" |
| | | :before-close="policeSituationBeforeClose" |
| | | :modal="true" |
| | | :close-on-click-modal="false" |
| | | class="policeSituation-details-box" |
| | | > |
| | | <el-dialog title="警情信息" :visible.sync="policeSituationVisible" :modal-append-to-body="false" |
| | | :before-close="policeSituationBeforeClose" :modal="true" :close-on-click-modal="false" |
| | | 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 |
| | | class="cur-tooltip" |
| | | v-show="currentTooltip" |
| | | :style="{ top: currentPointerPosition.y + 'px', left: currentPointerPosition.x + 'px' }" |
| | | > |
| | | <div class="cur-tooltip" v-show="currentTooltip" |
| | | :style="{ top: currentPointerPosition.y + 'px', left: currentPointerPosition.x + 'px' }"> |
| | | <div class="type-name">报警内容</div> |
| | | <div class="type-content">{{ currentBJNR }}</div> |
| | | </div> |
| | |
| | | global.viewer, // 视图层 |
| | | bounds, // 矩形坐标 |
| | | { |
| | | radius: 80, |
| | | radius: 40, |
| | | maxOpacity: .5, |
| | | minOpacity: 0, |
| | | blur: .75 |
| | |
| | | |
| | | |
| | | if (item.ZDDWXZB && item.ZDDWXZB != '' && item.ZDDWXZB > 0) { |
| | | positions.push({ x: Number(item.ZDDWXZB), y: Number(item.ZDDWYZB), value: 23 }) |
| | | positions.push({ x: Number(item.ZDDWXZB), y: Number(item.ZDDWYZB), value: 16 }) |
| | | } |
| | | |
| | | return { ...item, index: index + 1, lng: item.ZDDWXZB, lat: item.ZDDWYZB, BJLX: bjlxText } |