From ad8fd5412cb320a2b1af063ff5d2e35c84a8dbc0 Mon Sep 17 00:00:00 2001 From: gongjiale <942894820@qq.com> Date: Fri, 25 Nov 2022 16:55:53 +0800 Subject: [PATCH] =?UTF-8?q?=E6=8F=90=E4=BA=A4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../areaMonitor/components/VideoListRight.vue | 101 +++++++++++++----- .../areaMonitor/components/VideoLists.vue | 6 +- src/views/pages/areaMonitor/image/jianyi.png | Bin 0 -> 325 bytes src/views/pages/areaMonitor/image/zongjie.png | Bin 0 -> 449 bytes src/views/pages/areaMonitor/index.vue | 2 +- 5 files changed, 77 insertions(+), 32 deletions(-) create mode 100644 src/views/pages/areaMonitor/image/jianyi.png create mode 100644 src/views/pages/areaMonitor/image/zongjie.png diff --git a/src/views/pages/areaMonitor/components/VideoListRight.vue b/src/views/pages/areaMonitor/components/VideoListRight.vue index dfa345c..9cca132 100644 --- a/src/views/pages/areaMonitor/components/VideoListRight.vue +++ b/src/views/pages/areaMonitor/components/VideoListRight.vue @@ -51,7 +51,7 @@ > -->
- 结论：{{ relevanceName1 }} 结论：{{ relevanceName1 }}、{{ relevanceName2 }}、{{ relevanceName1 }} 与{{ areaName }}人员聚集较强相关。 @@ -89,7 +89,7 @@
- 决策建议： + 决策建议： 预测{{ analysis.area }} - 下周人流量较高，建议增加环卫人员数量、垃圾收运频次 + 本周末人流量较高，建议增加管理人员数量、环卫人员数量。
@@ -111,7 +111,7 @@ import * as echarts from "echarts"; export default { data() { return { - daterange: null, + daterange: ['2022-11-18','2022-11-25'], dataForm: { title: "", startDate: "", @@ -129,11 +129,11 @@ export default { //管理力量分析 analysis: { manageNum: 3, - sanitationNum: 14, + sanitationNum: 5, garbageNum: 2, mechanNum: 1, advice: "", - area: "第一海水浴场", + area: "台东商圈", }, }; }, @@ -159,37 +159,37 @@ export default { { title: "TOP1", img:require("../image/one.png"), - areaName: "第一海水浴场", + areaName: "台东商圈", areaId: "1", - num: "223", + num: "12", }, { title: "TOP2", img:require("../image/two.png"), - areaName: "石老人海水浴场", + areaName: "李村商圈", areaId: "2", - num: "123", + num: "8", }, { title: "TOP3", img:require("../image/three.png"), - areaName: "金沙滩海水浴场", + areaName: "五四广场", areaId: "3", - num: "111", + num: "7", }, { title: "4", img:require("../image/four.png"), areaName: "第一海水浴场", areaId: "4", - num: "65", + num: "5", }, { title: "5", img:require("../image/five.png"), - areaName: "第一海水浴场", + areaName: "石老人海水浴场", areaId: "5", - num: "32", + num: "4", }, ]; }, @@ -222,7 +222,7 @@ export default { }, xAxis: { type: "category", - data: ["人员聚集", "违规停车", "路面不洁", "违章", "占道经营"], + data: ["违章停车", "垃圾桶满溢", "占道经营", "道路不洁", "垃圾收运不及时"], axisLine: { show: false, // 不显示坐标轴线 lineStyle: { @@ -262,7 +262,8 @@ export default { }, series: [ { - data: [250, 200, 150, 110, 100, 50], + name:"事件数量", + data: [31, 24, 17, 13, 12], type: "bar", itemStyle: { normal: { @@ -316,7 +317,7 @@ export default { }, xAxis: { type: "category", - data: ["11.04", "11.05", "11.06", "11.07", "11.08", "11.09", "11.10"], + data: ["11/18", "11/19", "11/20", "11/21", "11/22", "11/23", "11/24"], axisLine: { show: false, // 不显示坐标轴线 lineStyle: { @@ -382,8 +383,8 @@ export default { ], series: [ { - name: "人员数量", - data: [14, 10, 4, 11, 10, 12, 6, 13], + name: "人流量", + data: [2500, 5600, 6500, 1200, 2300, 2400, 1900, 1800], type: "bar", itemStyle: { normal: { @@ -402,10 +403,10 @@ export default { }, }, { - name: "路面不洁", + name: "违章停车数量", type: "line", yAxisIndex: 1, - data: [150, 165, 160, 150, 130, 140, 160], + data: [1, 10, 12, 2, 2, 3, 2,1], itemStyle: { normal: { color: "#faa12f", //圆点颜色 @@ -422,10 +423,10 @@ export default { }, }, { - name: "违规停车", + name: "垃圾桶满溢事件数量", type: "line", yAxisIndex: 1, - data: [140, 155, 126, 172, 130, 120, 150], + data: [1,7,8,1,2,2,1,2], itemStyle: { normal: { color: "#eff20c", //圆点颜色 @@ -442,10 +443,10 @@ export default { }, }, { - name: "垃圾桶满溢", + name: "占道经营事件数量", type: "line", yAxisIndex: 1, - data: [170, 155, 110, 120, 110, 120, 110], + data: [1,4,5,1,1,2,1,2], itemStyle: { normal: { color: "#08e715", //圆点颜色 @@ -461,6 +462,46 @@ export default { }, }, }, + { + name: "道路不洁事件数量", + type: "line", + yAxisIndex: 1, + data: [1,2,1,1,2,2,3,1], + itemStyle: { + normal: { + color: "#e51b4d", //圆点颜色 + borderColor: "rgba(251,222,153,0.5)", + borderWidth: 4, + lineStyle: { + //折线颜色大小 + type: "solid", //'dotted'虚线 'solid'实线 + color: "#e51b4d", + width: 1, + borderColor: "#e51b4d", //拐点边框颜色 + }, + }, + }, + }, + { + name: "垃圾收运不及时事件数量", + type: "line", + yAxisIndex: 1, + data: [2,1,1,2,1,3,1,1], + itemStyle: { + normal: { + color: "#d63ac3", //圆点颜色 + borderColor: "rgba(251,222,153,0.5)", + borderWidth: 4, + lineStyle: { + //折线颜色大小 + type: "solid", //'dotted'虚线 'solid'实线 + color: "#d63ac3", + width: 1, + borderColor: "#d63ac3", //拐点边框颜色 + }, + }, + }, + }, ], }; eventChart.setOption(option); @@ -517,8 +558,8 @@ export default { font-size: 12px; } .inner-title { - margin-top: 6px; - margin-bottom: 6px; + margin-top: 10px; + margin-bottom: 10px; margin-left: 10px; font-size: 16px; font-weight: bold; @@ -633,9 +674,13 @@ export default { } } .analysis-advice { + border-color: #107bb0; + box-shadow: 1px 1px 5px 1px RGB(16, 123, 176, 0.8) inset; color: rgb(0 255 255); font-size: 14px; margin-left: 10px; + margin-right: 10px; + margin-top: 8px; } } .list4 { diff --git a/src/views/pages/areaMonitor/components/VideoLists.vue b/src/views/pages/areaMonitor/components/VideoLists.vue index 7883a64..73f71b3 100644 --- a/src/views/pages/areaMonitor/components/VideoLists.vue +++ b/src/views/pages/areaMonitor/components/VideoLists.vue @@ -310,8 +310,8 @@ export default { } .el-checkbox-group { - height: 316px; - width: 372px; + height: 425px; + width: 444px; overflow-y: auto; margin-top: 6px; &::-webkit-scrollbar { @@ -348,7 +348,7 @@ export default { } .el-tree { - width: 398px; + width: 444px; height:460px; overflow-y: auto; margin-top: 10px; diff --git a/src/views/pages/areaMonitor/image/jianyi.png b/src/views/pages/areaMonitor/image/jianyi.png new file mode 100644 index 0000000000000000000000000000000000000000..0753fba960903f56ddb43e07a271671a48d305d4 GIT binary patch literal 325 zcmV-L0lNN)P)Px#|4BqaR5(wilQBv|Q4mGXDYUWCA}+uUSlC#aMObJji2HB{S%4sFp&(dUiI`Mc zh^4K)2x5~$n=3E;A0*`G2lJ|dH|M-zW}Yl~EPRp&pgY60uU=NUePE~LtAkn)brjD! zN#23=>al)d<`yKm2fl$JunSzNdvghr^ngvZo8+;GN?fXK6(qR<)++c8SgPSxL6Xui zD!7O~)x)Zpr|Lmt1rzWs@T?x!O-}NnZcP;=*#@3~YoG%R{=!uSZ|X*qpuBhnoC6o? z(d2lOe5jo!L4XsWr@l_xjU->{YU>o57Awh6U0Fo%qb@HZ7_I+U(Do0e-H!$TfotX$ XHBFxpCiUVz00000NkvXXu0mjfnIMQ$ literal 0 HcmV?d00001 diff --git a/src/views/pages/areaMonitor/image/zongjie.png b/src/views/pages/areaMonitor/image/zongjie.png new file mode 100644 index 0000000000000000000000000000000000000000..89ada07dfd786ae0d7193ac72c327d165c33814f GIT binary patch literal 449 zcmV;y0Y3hTP)Px$dr3q=R5(wKlRZmAF&Kr<3EaBdL2e3N+!URPlZ%TuI4G#IIP@2|S+IhGpqmaA z9d%Jba1dMs{Si936qB@ca+J%>D=DqCSNoAEL(X%b>DWIP~Dp`ZciDK9PJDk)sd*AmP;k zTxzW=gBsfg)a&)>D2m=iBmz+Be0@qpYGG`{>fQzzV~$DghWi3|0Z`Lg-;eX3v;kqp r-us0#O>4zs@nf7|_sqyDkAnRGuBpcG$Qy#Q00000NkvXXu0mjf^moW^ literal 0 HcmV?d00001 diff --git a/src/views/pages/areaMonitor/index.vue b/src/views/pages/areaMonitor/index.vue index 4c26cb4..61fa295 100644 --- a/src/views/pages/areaMonitor/index.vue +++ b/src/views/pages/areaMonitor/index.vue @@ -924,7 +924,7 @@ export default { right: 10px; top: 89px; width: 477px; - height: 658px; + height:700px; background: rgba(5, 33, 59, 1); } .legend {