From d057c8fdb1ed9db6cfcebacb146cd0ffbc1ad7fe Mon Sep 17 00:00:00 2001
From: guanqb <18720758508@163.com>
Date: Tue, 20 Sep 2022 09:29:02 +0800
Subject: [PATCH] Merge branch 'master' of http://192.168.0.105:10010/r/srs-police-affairs
---
src/views/home/index copy.vue | 635 ++++++++++++++++++++++++++++++++++++++++++
src/views/home/index.vue | 61 +++
.gitignore | 1
src/components/map/index.vue | 165 ++++++++--
src/views/activity/index.vue | 2
5 files changed, 826 insertions(+), 38 deletions(-)
diff --git a/.gitignore b/.gitignore
index 403adbc..1393384 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,6 +1,7 @@
.DS_Store
node_modules
/dist
+/public/sd
# local env files
diff --git a/src/components/map/index.vue b/src/components/map/index.vue
index 1e66b6e..8a43f82 100644
--- a/src/components/map/index.vue
+++ b/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-09-17 16:21:14
+ * @LastEditTime: 2022-09-19 18:19:53
* @FilePath: \srs-police-affairs\src\components\map\index.vue
* @Description: 公用地图组件
*
@@ -34,12 +34,18 @@
var siteEntitylayers = null
-let layersObjce = {
+let layersObjcect = {
housingEstateLayer: null,
patrolWagonLayer: null,
handMachineLayer: null,
monitoringLayer: null,
panoramaLayer: null
+}
+
+let tilesetLayer = null
+
+let tilesetObject = {
+ sdTilesetLayer: null
}
export default {
@@ -187,17 +193,36 @@
// 图层加入地图
- layersObjce.housingEstateLayer = new global.DC.VectorLayer('housingEstateLayer')
- global.viewer.addLayer(layersObjce.housingEstateLayer)
- layersObjce.patrolWagonLayer = new global.DC.VectorLayer('patrolWagonLayer')
- global.viewer.addLayer(layersObjce.patrolWagonLayer)
- layersObjce.handMachineLayer = new global.DC.VectorLayer('handMachineLayer')
- global.viewer.addLayer(layersObjce.handMachineLayer)
- layersObjce.monitoringLayer = new global.DC.VectorLayer('monitoringLayer')
- global.viewer.addLayer(layersObjce.monitoringLayer)
- layersObjce.panoramaLayer = new global.DC.VectorLayer('panoramaLayer')
- global.viewer.addLayer(layersObjce.panoramaLayer)
+ layersObjcect.housingEstateLayer = new global.DC.VectorLayer('housingEstateLayer')
+ global.viewer.addLayer(layersObjcect.housingEstateLayer)
+ layersObjcect.patrolWagonLayer = new global.DC.VectorLayer('patrolWagonLayer')
+ global.viewer.addLayer(layersObjcect.patrolWagonLayer)
+ layersObjcect.handMachineLayer = new global.DC.VectorLayer('handMachineLayer')
+ global.viewer.addLayer(layersObjcect.handMachineLayer)
+ layersObjcect.monitoringLayer = new global.DC.VectorLayer('monitoringLayer')
+ global.viewer.addLayer(layersObjcect.monitoringLayer)
+ layersObjcect.panoramaLayer = new global.DC.VectorLayer('panoramaLayer')
+ global.viewer.addLayer(layersObjcect.panoramaLayer)
+ // 模型图层添加
+ tilesetLayer = new global.DC.TilesetLayer('tilesetLayer')
+ global.viewer.addLayer(tilesetLayer)
+
+ // 加载围栏
+ let layer = new global.DC.VectorLayer('layer')
+ global.viewer.addLayer(layer)
+
+ let wall = new global.DC.Wall(
+ '116.018142,28.688089,100.0; 116.017756,28.684648,100.0; 116.019507,28.677570,100.0; 116.033653,28.675634,100.0; 116.034223,28.681389,100.0; 116.033483,28.687265,100.0; 116.018142,28.688089,100.0'
+ )
+
+ wall.setStyle({
+ material: new global.DC.WallTrailMaterialProperty({
+ color: global.DC.Color.BLUE,
+ speed: 8
+ })
+ })
+ layer.addOverlay(wall)
@@ -219,14 +244,7 @@
})
)
- let tilesLayer = new global.DC.TilesetLayer('tilesLayer')
- global.viewer.addLayer(tilesLayer)
- let tileset = new global.DC.Tileset(
- '/qx/tileset.json'
- )
- tilesLayer.addOverlay(tileset)
- global.viewer.flyTo(tileset)
// 加载顺丰底图
@@ -242,7 +260,7 @@
// Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
// fromDegrees()方法，将经纬度和高程转换为世界坐标
destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
- 117.971, 28.44444, 8000.0
+ 116.027429, 28.681978, 8000.0
),
orientation: {
// 指向
@@ -257,7 +275,7 @@
global.viewer.use(new global.DC.Measure())
- // global.viewer.locationBar.enable = true
+ global.viewer.locationBar.enable = true
// 缩放
global.viewer.zoomController.enable = true
// 比例尺
@@ -300,29 +318,44 @@
// })
- this.$EventBus.on('mapAddLayer', (params) => {
+ this.$EventBus.$on('mapAddLayer', (params) => {
that.mapAddLayer(params.layerName, params.type)
})
- this.$EventBus.on('mapRemoveLayer', (params) => {
+ this.$EventBus.$on('mapRemoveLayer', (params) => {
that.mapRemoveLayer(params.layerName, params.type)
})
- this.$EventBus.on('mapClearLayer', (params) => {
+ this.$EventBus.$on('mapClearLayer', (params) => {
that.mapClearLayer(params.layerName, params.type)
})
- this.$EventBus.on('layerPointAdd', (params) => {
+ this.$EventBus.$on('layerPointAdd', (params) => {
// eslint-disable-next-line no-unused-vars
that.layerPointAdd(params.layerName, params.type, params.params, params.incident = (e) => { })
})
- this.$EventBus.on('layerShow', (params) => {
+ this.$EventBus.$on('layerPolygonAdd', (params) => {
+ that.layerPolygonAdd(params.layerName, params.positions, params.material)
+ })
+
+ this.$EventBus.$on('layerShow', (params) => {
that.layerShow(params.layerName, params.flag)
})
- this.$EventBus.on('flyToPosition', (params) => {
+ this.$EventBus.$on('flyToPosition', (params) => {
that.flyToPosition(params.siteJd, params.siteWd, params.siteGd = 0, params.siteHeading = 0, params.sitePitch = -90, params.siteRoll = 0, params.time = 3)
+ })
+
+
+ this.$EventBus.$on('addMxTileset', (params) => {
+ // eslint-disable-next-line no-unused-vars
+ that.addMxTileset(params.titlesetName, params.titlesetUrl, params.incident = (e) => { })
+ })
+
+ this.$EventBus.$on('removeMxTileset', (params) => {
+ // eslint-disable-next-line no-unused-vars
+ that.removeMxTileset(params.titlesetName, params.incident = (e) => { })
})
},
@@ -385,8 +418,9 @@
*/
mapAddLayer (layerName, type) {
if (type == 'VectorLayer') {
- layersObjce[layerName] = new global.DC.VectorLayer('layerName')
- global.viewer.addLayer(layersObjce[layerName])
+ if (!layersObjcect[layerName]) layersObjcect[layerName] = null
+ layersObjcect[layerName] = new global.DC.VectorLayer('layerName')
+ global.viewer.addLayer(layersObjcect[layerName])
}
},
@@ -397,9 +431,9 @@
*/
mapRemoveLayer (layerName, type) {
if (type == 'VectorLayer') {
- layersObjce[layerName].remove()
+ layersObjcect[layerName].remove()
- layersObjce[layerName] = null
+ layersObjcect[layerName] = null
}
},
@@ -410,7 +444,7 @@
*/
mapClearLayer (layerName, type) {
if (type == 'VectorLayer') {
- layersObjce[layerName].clear()
+ layersObjcect[layerName].clear()
}
},
@@ -442,8 +476,30 @@
})
}
pointElement.attrParams = params
- layersObjce[layerName].addOverlay(pointElement)
+ layersObjcect[layerName].addOverlay(pointElement)
pointElement.on(global.DC.MouseEventType.CLICK, incident)
+ },
+
+ /**
+ * 图层面添加
+ * @param {*} layerName 图层名称
+ * @param {*} positions 图层位置数据
+ * @param {*} material 颜色
+ */
+ layerPolygonAdd (layerName, positions, material) {
+ if (!layersObjcect[layerName] || layersObjcect[layerName] == null) {
+ this.mapAddLayer(layerName, 'VectorLayer')
+ }
+
+ let polygon = new global.DC.Polygon(positions)
+
+ polygon.setStyle({
+ material: material,
+ extrudedHeight: 0,
+ perPositionHeight: true
+ })
+
+ layersObjcect[layerName].addOverlay(polygon)
},
/**
@@ -452,7 +508,7 @@
* @param {*} flag 显示隐藏
*/
layerShow (layerName, flag) {
- layersObjce[layerName].show = flag
+ layersObjcect[layerName].show = flag
},
/**
@@ -478,7 +534,46 @@
function () { },
time
)
- }
+ },
+ // sdTilesetLayer
+
+ /**
+ * 添加模型
+ * @param {*} titlesetName 图层名称
+ * @param {*} titlesetUrl 模型地址
+ * @param {*} incident 模型点击事件
+ */
+ addMxTileset (titlesetName, titlesetUrl, incident) {
+ if (!tilesetObject[titlesetName]) tilesetObject[titlesetName] = null
+
+ tilesetObject[titlesetName] = new global.DC.Tileset(titlesetUrl, {
+ luminanceAtZenith: 0.4,
+ // cullWithChildrenBounds: false,
+ // cullRequestsWhileMoving: false,
+ // skipLevelOfDetail: false,
+ shadows: global.DC.Namespace.Cesium.ShadowMode.DISABLED
+ })
+
+ tilesetObject[titlesetName].setHeight(5)
+
+
+ tilesetLayer.addOverlay(tilesetObject[titlesetName])
+
+ global.viewer.flyTo(tilesetObject[titlesetName])
+
+ tilesetObject[titlesetName].on(global.DC.MouseEventType.CLICK, incident)
+ },
+
+ /**
+ * 删除模型
+ * @param {*} titlesetName 图层名称
+ * @param {*} incident 模型点击事件
+ */
+ removeMxTileset (titlesetName, incident) {
+ tilesetObject[titlesetName].off(global.DC.MouseEventType.CLICK, incident)
+ tilesetLayer.removeOverlay(tilesetObject[titlesetName])
+ tilesetObject[titlesetName] = null
+ },
},
}
diff --git a/src/views/activity/index.vue b/src/views/activity/index.vue
index bb69f29..9e60493 100644
--- a/src/views/activity/index.vue
+++ b/src/views/activity/index.vue
@@ -2,7 +2,7 @@
* @Author: shuishen 1109946754@qq.com
* @Date: 2022-08-18 16:18:17
* @LastEditors: shuishen 1109946754@qq.com
- * @LastEditTime: 2022-09-19 14:59:44
+ * @LastEditTime: 2022-09-19 17:42:50
* @FilePath: \srs-police-affairs\src\views\activity\index.vue
* @Description: 安保活动
*
diff --git a/src/views/home/index copy.vue b/src/views/home/index copy.vue
new file mode 100644
index 0000000..bc1f428
--- /dev/null
+++ b/src/views/home/index copy.vue
@@ -0,0 +1,635 @@
+<!--
+ * @Author: shuishen 1109946754@qq.com
+ * @Date: 2022-08-18 16:18:17
+ * @LastEditors: shuishen 1109946754@qq.com
+ * @LastEditTime: 2022-09-19 18:27:39
+ * @FilePath: \srs-police-affairs\src\views\home\index.vue
+ * @Description: 小区-栋-层-房屋
+ *
+ * Copyright (c) 2022 by shuishen 1109946754@qq.com, All Rights Reserved.
+-->
+
+<template>
+ <div class="container">
+ <div class="left-container">
+ <div class="person-box">
+ <div class="title">
+ <div class="one-level">现有人员</div>
+ <!-- <div class="two-level">现有人员</div> -->
+ </div>
+
+ <div class="sub-title">
+ <div class="one-level">实有人口总数</div>
+ <div class="two-level">183.16万人</div>
+ </div>
+
+ <div class="sub-tab">
+ <div class="tab">
+ <div class="num">164.57万人</div>
+ <div class="type">户籍人口</div>
+ </div>
+ <div class="tab">
+ <div class="num">17.52万人</div>
+ <div class="type">流动人口</div>
+ </div>
+ <div class="tab">
+ <div class="num">91995人</div>
+ <div class="type">境外人口</div>
+ </div>
+ </div>
+
+ <div id="PersonEcharts" class="echarts-box"></div>
+ </div>
+ <div class="land-box">
+ <div class="title">
+ <div class="one-level">现有房屋</div>
+ <!-- <div class="two-level">现有房屋</div> -->
+ </div>
+
+ <div class="sub-tab">
+ <div class="tab">
+ <div class="num">1822603户</div>
+ <div class="num">实有房屋</div>
+ </div>
+ <div class="tab">
+ <div class="num">634个</div>
+ <div class="num">关注场所</div>
+ </div>
+ </div>
+
+ <div id="LandEcharts" class="echarts-box"></div>
+ </div>
+ <div class="equipment-box">
+ <div class="title">
+ <div class="one-level">现有设备</div>
+ <!-- <div class="two-level">现有设备</div> -->
+ </div>
+
+ <div id="EquipmentEcharts" class="echarts-box"></div>
+ </div>
+ </div>
+ <div class="right-container">
+ <div class="case-box">
+ <div class="title">
+ <div class="one-level">警情动态</div>
+ <div class="two-level">当前16</div>
+ </div>
+
+ <div id="EventChangeEcharts" class="echarts-box"></div>
+ </div>
+ <div class="alert-box">
+ <div class="title">
+ <div class="one-level">警情近一年</div>
+ <div class="two-level">历史累计</div>
+ </div>
+
+ <div class="sub-title">
+ <div class="one-level">警情、案事件总量</div>
+ <div class="two-level">555578起</div>
+ </div>
+
+ <div id="EventCountEcharts" class="echarts-box"></div>
+ </div>
+ <div class="crowd-box">
+ <div class="title">
+ <div class="one-level">重点稳控/服务人群</div>
+ <div class="two-level">当前38</div>
+ </div>
+
+ <div id="peopleList" class="echarts-box">
+ <el-table
+ :data="arr"
+ style="width: 100%"
+ :header-cell-style="{'text-align':'center','background-color':'#00204f','borderColor':'#073365'}"
+ :cell-style="{'text-align':'center','borderColor':'#073365'}"
+ :row-class-name="tableRowClassName"
+ >
+ <el-table-column prop="type" label="人员类型" width="80"></el-table-column>
+ <el-table-column prop="num" label="人数" width="180"></el-table-column>
+ <el-table-column prop="radio" label="占比" width="120"></el-table-column>
+ </el-table>
+ </div>
+ </div>
+ </div>
+
+ <div class="center-container">
+ <div class="layers-control-btn">
+ <el-checkbox v-model="houseLayerShow" @change="houseChange">小区</el-checkbox>
+ </div>
+ <div class="layers-control-btn">
+ <el-checkbox v-model="carLayerShow">警车</el-checkbox>
+ </div>
+ <div class="layers-control-btn">
+ <el-checkbox v-model="phoneLayerShow">手台</el-checkbox>
+ </div>
+ <div class="layers-control-btn">
+ <el-checkbox v-model="videoLayerShow">监控</el-checkbox>
+ </div>
+ <div class="layers-control-btn">
+ <el-checkbox v-model="panoramaLayerShow">全景</el-checkbox>
+ </div>
+ </div>
+ </div>
+</template>
+
+<script>
+export default {
+ data () {
+ return {
+ navType: 0,
+ houseLayerShow: false,
+ carLayerShow: false,
+ phoneLayerShow: false,
+ videoLayerShow: false,
+ panoramaLayerShow: false,
+ arr: [{ 'type': '孤寡老人', 'num': '0', 'radio': '0.00%' }, { 'type': '邪教人员', 'num': '1', 'radio': '2.00%' }, { 'type': '上访人员', 'num': '8', 'radio': '14.00%' }, { 'type': '涉毒', 'num': '15', 'radio': '27.00%' }, { 'type': '留守儿童', 'num': '6', 'radio': '11.00%' }, { 'type': '重点青少年', 'num': '5', 'radio': '9.00%' }]
+ }
+ },
+ created () {
+
+
+
+
+
+ },
+ mounted () {
+ this.initPersonEcharts()
+ this.initLandEcharts()
+ this.initEquipmentEcharts()
+ this.initEventChangeEcharts()
+ this.initEventCountEcharts()
+
+ this.$nextTick(() => {
+ let position = [
+ [
+ [115.935114, 28.627012, 100],
+ [115.930150, 28.733535, 100],
+ [115.986738, 28.683523, 100],
+ [116.015526, 28.647454, 100],
+ ]
+ ]
+
+ position.forEach((item) => {
+ let str = ''
+ item.forEach(it => {
+ str = str + `${it[0]},${it[1]},${it[2]};`
+ })
+
+ this.$EventBus.$emit('layerPolygonAdd', {
+ layerName: 'polygonLayer',
+ positions: str,
+ material: global.DC.Namespace.Cesium.Color.fromBytes(
+ 3,
+ 255,
+ 13,
+ 10
+ ),
+ })
+ })
+ })
+ },
+ updated () {
+ },
+ methods: {
+ navClick (e) {
+ this.navType = e.target.dataset.type
+ },
+ initPersonEcharts () {
+ var chartDom = document.getElementById('PersonEcharts')
+ var myChart = this.$echarts.init(chartDom)
+ var option
+
+ option = {
+ xAxis: {
+ type: 'category',
+ data: ['湖北', '上海', '北京', '广东', '浙江'],
+ },
+ yAxis: {
+ type: 'value',
+ splitLine: {
+ show: true,
+ lineStyle: {
+ color: "rgba(0,0,255,0.1)"
+ }
+ }
+ },
+ series: [
+ {
+ data: [6414, 4231, 2211, 1231, 881],
+ type: 'bar',
+ itemStyle: {
+ normal: {
+ label: {
+ show: true,
+ position: 'top',
+ textStyle: {
+ color: '#1a94a8',
+ fontSize: 16
+ }
+ }
+ }
+ }
+ }
+ ],
+ grid: {
+ x: 40,
+ y: 10,
+ x2: 20,
+ y2: 20
+ },
+ }
+
+ option && myChart.setOption(option)
+ window.addEventListener("resize", function () {
+ myChart.resize()
+ })
+ },
+ initLandEcharts () {
+ var chartDom = document.getElementById('LandEcharts')
+ var myChart = this.$echarts.init(chartDom)
+ var option
+
+ option = {
+ color: ['#2967c4', '#112d54'],
+ xAxis: {
+ type: 'value',
+ splitLine: {
+ show: true,
+ lineStyle: {
+ color: "rgba(0,0,255,0.1)"
+ }
+ },
+ axisLine: {
+ show: false
+ },
+ axisLabel: {
+ show: false
+ },
+ axisTick: {
+ show: false
+ },
+
+ },
+ yAxis: {
+ type: 'category',
+ data: ['公共场所', '学校教培', '机动车维修', '娱乐场所', '寄递业'],
+ axisLine: {
+ show: false
+ },
+ axisTick: {
+ show: false
+ },
+
+ },
+ series: [
+ {
+ data: [54, 77, 97, 141, 191],
+ type: 'bar',
+ zlevel: 2,
+ },
+ {
+ data: [{ 'value': 191, 'realValue': 54 }, { 'value': 191, 'realValue': 77 }, { 'value': 191, 'realValue': 97 }, { 'value': 191, 'realValue': 141 }, { 'value': 191, 'realValue': 191 }],
+ type: 'bar',
+ barGap: '-100%',
+ label: {
+ show: true,
+ color: '#fff',
+ position: 'right', // 标签右对齐
+ distance: 5,// 标签距离柱条的距离
+ formatter: params => {
+ return params.data.realValue + '个'
+ }
+ }
+ }
+ ],
+ grid: {
+ x: 70,
+ y: 10,
+ x2: 10,
+ y2: 20
+ },
+ }
+
+ option && myChart.setOption(option)
+ },
+ initEquipmentEcharts () {
+ var chartDom = document.getElementById('EquipmentEcharts')
+ var myChart = this.$echarts.init(chartDom)
+ var option
+ var regionTotal = 0
+ let dataArr = [
+ { value: 21438, name: '未知' },
+ { value: 4664, name: '固定枪机' },
+ { value: 310, name: '固定球机' },
+ { value: 279, name: '可控球机' },
+ { value: 241, name: '卡口枪击' },
+ { value: 5, name: '云台枪击' }
+ ]
+ for (let i = 0; i < dataArr.length; i++) {
+ regionTotal += dataArr[i].value
+ }
+ console.log(regionTotal)
+ option = {
+ title: {
+ show: true,
+ text: ['{a|摄像头总数}', `{b|${regionTotal}个}`].join(' '), // 主副标题
+ left: 'left',
+ textStyle: {
+ rich: {
+ a: {
+ fontWeight: 'normal',
+ fontSize: 16,
+ color: '#fff'
+ },
+ b: {
+ fontSize: 22,
+ fontWeight: 'bolder',
+ color: '#fff'
+ }
+ }
+ }
+ },
+ tooltip: {
+ trigger: 'item'
+ },
+ legend: {
+ left: '55%',
+ y: '20%',
+ itemGap: 10,
+ textStyle: {
+ color: '#fff'
+ },
+ formatter: function (name) {
+ let data = option.series[0].data
+ let tarValue
+ for (let i = 0; i < data.length; i++) {
+ if (data[i].name == name) {
+ tarValue = data[i].value
+ }
+ }
+ let v = tarValue
+ return `${name} ${v} 个 `
+ },
+ },
+ series: [
+ {
+ name: 'Access From',
+ type: 'pie',
+ radius: ['40%', '70%'],
+ center: ['27%', '57%'],
+ avoidLabelOverlap: false,
+ label: {
+ show: false,
+ position: 'center'
+ },
+ emphasis: {
+ label: {
+ show: true,
+ fontSize: '40',
+ fontWeight: 'bold'
+ }
+ },
+ labelLine: {
+ show: false
+ },
+ data: dataArr
+ }
+ ],
+ grid: {
+ x: 10,
+ y: 10,
+ x2: 10,
+ y2: 20
+ },
+ }
+
+ option && myChart.setOption(option)
+ },
+ initEventChangeEcharts () {
+ var chartDom = document.getElementById('EventChangeEcharts')
+ var myChart = this.$echarts.init(chartDom)
+ var option
+
+ option = {
+ xAxis: {
+ type: 'category',
+ data: ['3-26', '3-27', '3-28', '3-29', '3-30', '3-31', '4-1']
+ },
+ yAxis: {
+ type: 'value',
+ splitLine: {
+ show: true,
+ lineStyle: {
+ color: "rgba(0,0,255,0.1)"
+ }
+ },
+ },
+ series: [
+ {
+ data: [0, 1, 0, 2, 0, 1, 0],
+ type: 'line'
+ }
+ ],
+ grid: {
+ x: 30,
+ y: 40,
+ x2: 10,
+ y2: 20
+ },
+ }
+
+ option && myChart.setOption(option)
+
+ },
+ initEventCountEcharts () {
+ var chartDom = document.getElementById('EventCountEcharts')
+ var myChart = this.$echarts.init(chartDom)
+ var option
+
+ option = {
+ tooltip: {
+ trigger: 'item'
+ },
+ legend: {
+ left: '75%',
+ y: '10%',
+ itemGap: 25,
+ textStyle: {
+ color: '#fff' // 图例文字颜色
+ }
+ },
+ series: [
+ {
+ name: 'Access From',
+ type: 'pie',
+ radius: ['40%', '70%'],
+ center: ['40%', '60%'],
+ avoidLabelOverlap: false,
+ label: {
+ show: false,
+ position: 'center'
+ },
+ emphasis: {
+ label: {
+ show: true,
+ fontSize: '40',
+ fontWeight: 'bold'
+ }
+ },
+ labelLine: {
+ show: false
+ },
+ data: [
+ { value: 4659154, name: '入室盗窃' },
+ { value: 916685, name: '抢劫抢夺' },
+ { value: 916685, name: '汽车被盗' },
+ { value: 916685, name: '交通事故' },
+ { value: 916685, name: '打架斗殴' },
+ { value: 916685, name: '走失人口' }
+ ]
+ }
+ ],
+ grid: {
+ x: 10,
+ y: 10,
+ x2: 10,
+ y2: 20
+ },
+ }
+
+ option && myChart.setOption(option)
+ },
+ tableRowClassName () {
+ // if ((rowIndex + 1) % 2 === 0) {
+ return "aa"
+ // } else {
+ // return "background:rgba(0,8,1,0.1)"
+ // }
+ },
+ }
+}
+</script>
+
+<style scoped lang="scss">
+.container {
+ color: #fff;
+
+ .left-container {
+ position: fixed;
+ top: 80px;
+ left: 0;
+ width: 400px;
+ height: calc(100% - 80px);
+ background: rgba(7, 22, 37, 0.8);
+
+ .person-box {
+ height: 40%;
+ }
+
+ .land-box,
+ .equipment-box {
+ height: 30%;
+ }
+ }
+
+ .right-container {
+ position: fixed;
+ top: 80px;
+ right: 0;
+ width: 400px;
+ height: calc(100% - 80px);
+ background: rgba(7, 22, 37, 0.8);
+
+ .case-box {
+ height: 30%;
+ }
+
+ .alert-box,
+ .crowd-box {
+ height: 35%;
+ .el-table__row.statistics-warning-row {
+ background: #ff0000;
+ }
+ }
+ ::v-deep .el-table tr:nth-child(2n) {
+ background: #03254c;
+ color: #fff;
+ }
+ ::v-deep .el-table tr:nth-child(2n-1) {
+ background: #26426a;
+ color: #fff;
+ }
+ ::v-deep .el-table tr:hover td {
+ color: #000;
+ }
+ }
+
+ .left-container,
+ .right-container {
+ .person-box,
+ .land-box,
+ .equipment-box,
+ .case-box,
+ .alert-box,
+ .crowd-box {
+ display: flex;
+ flex-direction: column;
+ padding: 10px;
+
+ .title {
+ display: flex;
+ justify-content: space-between;
+ height: 40px;
+ }
+
+ .sub-title {
+ display: flex;
+ justify-content: space-between;
+ height: 36px;
+ }
+
+ .sub-tab {
+ display: flex;
+
+ .tab {
+ margin: 0 10px;
+ flex: 1;
+ background: rgba(5, 21, 38, 0.8);
+ border: 1px solid #fff;
+
+ & > div {
+ height: 26px;
+ line-height: 26px;
+ }
+ }
+ }
+
+ .echarts-box {
+ flex: 1;
+ }
+
+ .sub-tab + .echarts-box {
+ margin-top: 10px;
+ }
+ }
+ }
+
+ .center-container {
+ display: flex;
+ position: fixed;
+ left: 50%;
+ bottom: 80px;
+ transform: translate(-50%, 0);
+
+ .layers-control-btn {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ margin: 0 10px;
+ width: 160px;
+ height: 60px;
+ background: rgba(7, 22, 37, 0.8);
+ }
+ }
+}
+</style>
diff --git a/src/views/home/index.vue b/src/views/home/index.vue
index 0e99c7f..aaeaa8a 100644
--- a/src/views/home/index.vue
+++ b/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: 2022-09-17 10:40:49
+ * @LastEditTime: 2022-09-19 18:29:26
* @FilePath: \srs-police-affairs\src\views\home\index.vue
* @Description: 小区-栋-层-房屋
*
@@ -114,7 +114,7 @@
<div class="center-container">
<div class="layers-control-btn">
- <el-checkbox v-model="houseLayerShow">小区</el-checkbox>
+ <el-checkbox v-model="houseLayerShow" @change="houseChange">小区</el-checkbox>
</div>
<div class="layers-control-btn">
<el-checkbox v-model="carLayerShow">警车</el-checkbox>
@@ -146,6 +146,11 @@
}
},
created () {
+
+
+
+
+
},
mounted () {
this.initPersonEcharts()
@@ -153,6 +158,35 @@
this.initEquipmentEcharts()
this.initEventChangeEcharts()
this.initEventCountEcharts()
+
+ this.$nextTick(() => {
+ let position = [
+ [
+ [115.935114, 28.627012, 100],
+ [115.930150, 28.733535, 100],
+ [115.986738, 28.683523, 100],
+ [116.015526, 28.647454, 100],
+ ]
+ ]
+
+ position.forEach((item) => {
+ let str = ''
+ item.forEach(it => {
+ str = str + `${it[0]},${it[1]},${it[2]};`
+ })
+
+ this.$EventBus.$emit('layerPolygonAdd', {
+ layerName: 'polygonLayer',
+ positions: str,
+ material: global.DC.Namespace.Cesium.Color.fromBytes(
+ 3,
+ 255,
+ 13,
+ 10
+ ),
+ })
+ })
+ })
},
updated () {
},
@@ -465,6 +499,29 @@
option && myChart.setOption(option)
},
+<<<<<<< HEAD
+ tableRowClassName () {
+ // if ((rowIndex + 1) % 2 === 0) {
+ return "aa"
+ // } else {
+ // return "background:rgba(0,8,1,0.1)"
+ // }
+ },
+
+ houseChange (e) {
+ if (e == true) {
+ this.$EventBus.$emit('addMxTileset', {
+ titlesetName: 'sdTilesetLayer',
+ titlesetUrl: "/sd/tileset.json"
+ })
+ } else {
+ this.$EventBus.$emit('removeMxTileset', {
+ titlesetName: 'sdTilesetLayer'
+ })
+ }
+ }
+=======
+>>>>>>> 0296d220b566f61bbedd8f422bbf3f03b5641a47
}
}
</script>
--
Gitblit v1.9.3