From 65f459216957ecbe83f2bf48127095a0dbcbef68 Mon Sep 17 00:00:00 2001 From: zhoule Date: Tue, 30 Apr 2024 10:27:14 +0800 Subject: [PATCH 1/8] =?UTF-8?q?=E9=A6=96=E9=A1=B5-=E8=BF=9C=E7=AB=AF?= =?UTF-8?q?=E6=9C=BA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../images/layer/路测设备/远端机.svg | 5 + .../layer/路测设备/远端机_active.svg | 3 + .../layer/路测设备/远端机_fault.svg | 3 + .../components/DeviceControlDialog.vue | 55 +++++ .../RemoteMachine/components/DeviceParams.vue | 199 ++++++++++++++++++ .../components/DeviceParamsMulti.vue | 166 +++++++++++++++ .../Dialogs/RemoteMachine/index.vue | 195 +++++++++++++++++ .../components/Dialogs/SmartDevice/index.vue | 24 +-- .../Home/components/RoadAndEvents/index.vue | 8 +- .../RoadAndEvents/utils/buttonEvent.js | 4 + 10 files changed, 642 insertions(+), 20 deletions(-) create mode 100644 ruoyi-ui/src/views/JiHeExpressway/images/layer/路测设备/远端机.svg create mode 100644 ruoyi-ui/src/views/JiHeExpressway/images/layer/路测设备/远端机_active.svg create mode 100644 ruoyi-ui/src/views/JiHeExpressway/images/layer/路测设备/远端机_fault.svg create mode 100644 ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Dialogs/RemoteMachine/components/DeviceControlDialog.vue create mode 100644 ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Dialogs/RemoteMachine/components/DeviceParams.vue create mode 100644 ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Dialogs/RemoteMachine/components/DeviceParamsMulti.vue create mode 100644 ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Dialogs/RemoteMachine/index.vue diff --git a/ruoyi-ui/src/views/JiHeExpressway/images/layer/路测设备/远端机.svg b/ruoyi-ui/src/views/JiHeExpressway/images/layer/路测设备/远端机.svg new file mode 100644 index 00000000..874c4087 --- /dev/null +++ b/ruoyi-ui/src/views/JiHeExpressway/images/layer/路测设备/远端机.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/ruoyi-ui/src/views/JiHeExpressway/images/layer/路测设备/远端机_active.svg b/ruoyi-ui/src/views/JiHeExpressway/images/layer/路测设备/远端机_active.svg new file mode 100644 index 00000000..370cad14 --- /dev/null +++ b/ruoyi-ui/src/views/JiHeExpressway/images/layer/路测设备/远端机_active.svg @@ -0,0 +1,3 @@ + + + diff --git a/ruoyi-ui/src/views/JiHeExpressway/images/layer/路测设备/远端机_fault.svg b/ruoyi-ui/src/views/JiHeExpressway/images/layer/路测设备/远端机_fault.svg new file mode 100644 index 00000000..066c2569 --- /dev/null +++ b/ruoyi-ui/src/views/JiHeExpressway/images/layer/路测设备/远端机_fault.svg @@ -0,0 +1,3 @@ + + + diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Dialogs/RemoteMachine/components/DeviceControlDialog.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Dialogs/RemoteMachine/components/DeviceControlDialog.vue new file mode 100644 index 00000000..200357eb --- /dev/null +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Dialogs/RemoteMachine/components/DeviceControlDialog.vue @@ -0,0 +1,55 @@ + + + + + diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Dialogs/RemoteMachine/components/DeviceParams.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Dialogs/RemoteMachine/components/DeviceParams.vue new file mode 100644 index 00000000..dc8d4b51 --- /dev/null +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Dialogs/RemoteMachine/components/DeviceParams.vue @@ -0,0 +1,199 @@ + + + + + diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Dialogs/RemoteMachine/components/DeviceParamsMulti.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Dialogs/RemoteMachine/components/DeviceParamsMulti.vue new file mode 100644 index 00000000..64b0dda6 --- /dev/null +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Dialogs/RemoteMachine/components/DeviceParamsMulti.vue @@ -0,0 +1,166 @@ + + + + + diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Dialogs/RemoteMachine/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Dialogs/RemoteMachine/index.vue new file mode 100644 index 00000000..3053c351 --- /dev/null +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Dialogs/RemoteMachine/index.vue @@ -0,0 +1,195 @@ + + + + + + \ No newline at end of file diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Dialogs/SmartDevice/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Dialogs/SmartDevice/index.vue index 411f9696..556bcb0f 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Dialogs/SmartDevice/index.vue +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Dialogs/SmartDevice/index.vue @@ -12,19 +12,12 @@ - + - + @@ -131,6 +121,7 @@ export default { this.data = { roadName: null, deviceStateLiteral: deviceInfo?.data.formatValue.deviceState, + ...this.data }; // console.log( @@ -151,9 +142,8 @@ export default { methods: { async getDeviceInfo() { return request({ - url: `/business/device/properties/latest/${ - this.dialogData.iotDeviceId || "10.0.36.143-1883" - }/3`, + url: `/business/device/properties/latest/${this.dialogData.iotDeviceId || "10.0.36.143-1883" + }/3`, method: "get", params: {}, }); @@ -203,7 +193,7 @@ div.switcher { align-items: center; justify-content: end; - > div { + >div { font-size: 16px; padding: 6px 12px; } diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/RoadAndEvents/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/RoadAndEvents/index.vue index 36ee6074..a7291719 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/RoadAndEvents/index.vue +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/RoadAndEvents/index.vue @@ -47,6 +47,7 @@ import TrafficIncidents from "./../Dialogs/TrafficIncidents/index.vue"; import PerceiveEvent from "./../Dialogs/PerceiveEvent/index.vue"; import RoadNetworkFacilities from "./../Dialogs/RoadNetworkFacilities/index.vue"; import SmartDevice from "./../Dialogs/SmartDevice/index.vue"; +import RemoteMachine from "./../Dialogs/RemoteMachine/index.vue"; import SolarEnergy from "./../Dialogs/SolarEnergy/index.vue"; import Intermodulation from "./../Dialogs/Intermodulation/index.vue"; import GuardrailCollision from "./../Dialogs/GuardrailCollision/index.vue"; @@ -71,7 +72,8 @@ export default { Intermodulation, GuardrailCollision, FatigueWakesUp, - RoadNetworkFacilities + RoadNetworkFacilities, + RemoteMachine }, data() { return { @@ -288,10 +290,10 @@ export default { gridColumnStart: (index % columns) + 1, } }, - async handleTrafficRelieve(e){ + async handleTrafficRelieve(e) { await this.handleDeviceImmediate(e._itemData) setTimeout(async () => { - await this.handleDeviceImmediate(e._itemData) + await this.handleDeviceImmediate(e._itemData) }, 500); this.dialogConfig = { // 0 有 可控（球机）ControlCamera | 1 ⽆ 不可控（枪机）Camera diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/RoadAndEvents/utils/buttonEvent.js b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/RoadAndEvents/utils/buttonEvent.js index f95c8fac..a2d3858d 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/RoadAndEvents/utils/buttonEvent.js +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/RoadAndEvents/utils/buttonEvent.js @@ -79,6 +79,10 @@ export const DeviceForMap = { deviceType: "15", dialog: "SolarEnergy", }, + 远端机: { + deviceType: "16", + dialog: "RemoteMachine", + }, }; export const lngLatMap = {}; //优化 缩略图 + 地图 复用lngLatmap From e8f7924f050d2f1c7c3a83ec83c4755ea811540c Mon Sep 17 00:00:00 2001 From: zhoule Date: Tue, 30 Apr 2024 10:51:53 +0800 Subject: [PATCH 2/8] =?UTF-8?q?=E4=BA=8B=E4=BB=B6=E8=AF=A6=E6=83=85?= =?UTF-8?q?=EF=BC=8C=E6=91=84=E5=83=8F=E6=9C=BA=E4=B8=8B=E6=8B=89?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../pages/control/event/event/EventDetailDialog/index.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/EventDetailDialog/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/EventDetailDialog/index.vue index f2e5d41d..ed9b1bec 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/EventDetailDialog/index.vue +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/control/event/event/EventDetailDialog/index.vue @@ -11,7 +11,7 @@
Date: Tue, 30 Apr 2024 14:37:29 +0800 Subject: [PATCH 3/8] =?UTF-8?q?=E6=9B=B4=E6=94=B9bug?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../pages/perception/eventDetection/index.vue | 16 +- .../pages/perception/trafficFlow/index.vue | 20 +- .../changesIndicators/assets/charts3.js | 2 +- .../components/changesIndicators/index.vue | 22 +- .../components/composeFeatures/index.vue | 138 ++-- .../components/congestionIndicator/index.vue | 41 +- .../components/crowding/index.vue | 138 ++-- .../components/roadIndicators/index.vue | 719 +++++++++--------- .../components/saturationMax/index.vue | 140 ++-- .../trafficIndicators/assets/charts.js | 2 +- .../components/trafficIndicators/index.vue | 27 +- .../components/IndicatorAnalysis/index.vue | 119 +-- .../perception/trafficSituation/index.vue | 36 +- 13 files changed, 761 insertions(+), 659 deletions(-) diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/index.vue index 5c85f296..3f60fddc 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/index.vue +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/index.vue @@ -51,11 +51,13 @@ export default { display: flex; flex-direction: column; align-items: stretch; - padding:8px 16px 16px; + padding: 8px 16px 16px; .row_01 { - flex-basis: 55%; margin-bottom: 15px; - display: flex; align-items: stretch; + flex-basis: 55%; + margin-bottom: 15px; + display: flex; + align-items: stretch; pointer-events: none; > div { @@ -77,14 +79,16 @@ export default { width: 100%; flex-basis: 50%; margin-bottom: 15px; - &:last-child{ margin-bottom: 0;} + &:last-child { + margin-bottom: 0; + } } } - } .row_02 { - flex: 1; height: 0; + flex: 1; + height: 0; // pointer-events: none; } } diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/index.vue index ce0686a2..ba17de0e 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/index.vue +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/index.vue @@ -5,7 +5,7 @@
- + @@ -48,9 +48,12 @@ export default { height: 100%; padding: 14px; - .row_01 { height: 160px;} + .row_01 { + height: 160px; + } - .row_02 { overflow: hidden; + .row_02 { + overflow: hidden; // --keep-ratio: scaleX(1); display: flex; pointer-events: none; @@ -59,8 +62,13 @@ export default { > div { pointer-events: auto; } - .unit_01{ flex-basis: 50%; margin-right: 14px;} - .unit_02{ flex-basis: 50%;} + .unit_01 { + flex-basis: 50%; + margin-right: 14px; + } + .unit_02 { + flex-basis: 50%; + } } .row_03 { @@ -84,7 +92,7 @@ export default { } .unit_03 { - flex:1; + flex: 1; } } } diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/components/changesIndicators/assets/charts3.js b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/components/changesIndicators/assets/charts3.js index 5a0bfc22..3504726a 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/components/changesIndicators/assets/charts3.js +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/components/changesIndicators/assets/charts3.js @@ -29,7 +29,7 @@ let options = { left: 0, right: 0, top: "15%", - bottom: "6%", + bottom: "8%", containLabel: true, }, xAxis: { diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/components/changesIndicators/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/components/changesIndicators/index.vue index 6fc8664b..a47f1589 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/components/changesIndicators/index.vue +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/components/changesIndicators/index.vue @@ -158,12 +158,13 @@ export default { .congestion { display: inline-flex; width: 100%; - height: 310px; + // height: 310px; flex-direction: column; --keep-ratio: scaleX(1); .board { - height: 300px; + // height: 300px; + flex: 1; width: 100%; padding: 0px 20px; border-radius: 5px 5px 5px 5px; @@ -175,15 +176,20 @@ export default { background: linear-gradient(180deg, rgba(6, 66, 88, 0) 0%, #064258 93%); #ChangesIndictors { - display: inline-flex; - height: 280px; + // display: inline-flex; + height: 180px; + // width: 100%; width: 100%; + display: flex; + flex: 1; + // height: 0; + position: relative; } } } -.charts { - height: 180px; - width: 100%; -} +// .charts { +// height: 180px; +// width: 100%; +// } diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/components/composeFeatures/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/components/composeFeatures/index.vue index aadcbb6a..cabf9372 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/components/composeFeatures/index.vue +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/components/composeFeatures/index.vue @@ -1,76 +1,74 @@ - - - - - \ No newline at end of file +} +.charts { + height: 120px; + width: 100%; +} + diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/components/congestionIndicator/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/components/congestionIndicator/index.vue index 9cb3c567..11cdc798 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/components/congestionIndicator/index.vue +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/components/congestionIndicator/index.vue @@ -165,7 +165,8 @@ export default { flex-direction: column; .board { - height: 275px; + // height: 275px; + flex: 1; width: 100%; padding: 0px 0px; border-radius: 5px 5px 5px 5px; @@ -173,23 +174,29 @@ export default { display: flex; align-items: center; flex-direction: column; - margin-top: 20px; - + margin-top: 10px; + overflow: hidden; background: linear-gradient(180deg, rgba(6, 66, 88, 0) 0%, #064258 93%); .bodySort { - position: relative; - display: inline-block; - width: 100%; - height: 100%; + flex: 1; + // height: 120px; + // position: relative; + // display: inline-block; + // width: 100%; + // height: 100%; overflow: auto; - padding: 5px 10px; + // padding: 5px 10px; > div:first-child { .barTitle { background: linear-gradient(180deg, #ff6969 0%, #ffb904 100%); } + .text { + font-size: 12px; + } + .lineHight .inner { background: linear-gradient(180deg, #ff6969 0%, #ffb904 100%); } @@ -197,11 +204,11 @@ export default { > div { display: inline-flex; - width: 95%; + width: 100%; height: 41px; background: #0d517460; border-radius: 0px 0px 0px 0px; - margin: 5px; + // margin: 5px; font-size: 14px; font-family: PingFang SC, PingFang SC; font-weight: 500; @@ -225,6 +232,10 @@ export default { margin: 0 10px; } + .text { + font-size: 12px; + } + .lineHight { width: 60%; height: 8px; @@ -249,7 +260,7 @@ export default { .textStr { display: inline-flex; width: 100%; - height: 45px; + height: 35px; flex-direction: row; > div { @@ -278,8 +289,8 @@ export default { } } -.charts { - height: 180px; - width: 100%; -} +// .charts { +// height: 180px; +// width: 100%; +// } diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/components/crowding/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/components/crowding/index.vue index 0609dc80..6f8535b8 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/components/crowding/index.vue +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/components/crowding/index.vue @@ -1,76 +1,74 @@ - - - - - \ No newline at end of file +} +.charts { + height: 120px; + width: 100%; +} + diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/components/roadIndicators/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/components/roadIndicators/index.vue index cba807ab..ddef4dde 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/components/roadIndicators/index.vue +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/components/roadIndicators/index.vue @@ -1,374 +1,411 @@ - - - - - \ No newline at end of file + } + } +} +.charts { + height: 180px; + width: 100%; +} + diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/components/saturationMax/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/components/saturationMax/index.vue index 9ee68c70..fb55f56b 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/components/saturationMax/index.vue +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/components/saturationMax/index.vue @@ -1,76 +1,76 @@ - - - - - \ No newline at end of file +} +.charts { + height: 120px; + width: 100%; +} + diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/components/trafficIndicators/assets/charts.js b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/components/trafficIndicators/assets/charts.js index 0eacaff7..bd2f9818 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/components/trafficIndicators/assets/charts.js +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/components/trafficIndicators/assets/charts.js @@ -81,7 +81,7 @@ var options = { top: "25%", //上边距 right: "0", //右边距 left: "0", //左边距 - bottom: "0%", //下边距 + bottom: "5%", //下边距 containLabel: true, }, xAxis: { diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/components/trafficIndicators/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/components/trafficIndicators/index.vue index 446e9074..094b123b 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/components/trafficIndicators/index.vue +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/components/trafficIndicators/index.vue @@ -92,7 +92,7 @@
上月指标
-
+
本月指标
@@ -317,20 +317,20 @@ export default { gr.addColorStop(1, "rgba(92,197,255,0)"); gr.addColorStop(0, "rgba(92,197,255,0.5)"); // 绘制圆角矩形 - drawRoundRect(context, 98, 11, 90, 22, 12, gr); + drawRoundRect(context, 98, 41, 90, 22, 12, gr); var gr = context.createLinearGradient(35, 0, 75, 0); // 颜色断点 gr.addColorStop(1, "rgba(92,197,255,0)"); gr.addColorStop(0, "rgba(92,197,255,0.5)"); - drawRoundRect(context, -1, 146, 80, 20, 12, gr); + drawRoundRect(context, -1, 176, 80, 20, 12, gr); var gr = context.createLinearGradient(230, 0, 275, 0); // 颜色断点 gr.addColorStop(1, "rgba(92,197,255,0)"); gr.addColorStop(0, "rgba(92,197,255,0.5)"); context.lineWidth = 1; // 设置线段宽度 - drawRoundRect(context, 211, 146, 220, 20, 12, gr); + drawRoundRect(context, 211, 176, 220, 20, 12, gr); const domMap3 = document.getElementById("chart3"); let parentDiv3 = domMap3.firstChild; @@ -348,20 +348,20 @@ export default { gr.addColorStop(1, "rgba(92,197,255,0)"); gr.addColorStop(0, "rgba(92,197,255,0.5)"); // 绘制圆角矩形 - drawRoundRect(context3, 98, 14, 90, 20, 12, gr); + drawRoundRect(context3, 98, 44, 90, 20, 12, gr); var gr = context3.createLinearGradient(35, 0, 75, 0); // 颜色断点 gr.addColorStop(1, "rgba(92,197,255,0)"); gr.addColorStop(0, "rgba(92,197,255,0.5)"); - drawRoundRect(context3, -1, 148, 80, 20, 12, gr); + drawRoundRect(context3, -1, 178, 80, 20, 12, gr); var gr = context3.createLinearGradient(240, 0, 290, 0); // 颜色断点 gr.addColorStop(1, "rgba(92,197,255,0)"); gr.addColorStop(0, "rgba(92,197,255,0.5)"); context3.lineWidth = 1; // 设置线段宽度 - drawRoundRect(context3, 211, 148, 200, 20, 12, gr); + drawRoundRect(context3, 211, 178, 200, 20, 12, gr); }); }); }, @@ -374,14 +374,15 @@ export default { } .congestion { - width: 100%; - margin: 5px 0; + // width: 100%; + // margin: 5px 0; .body { display: flex; flex-direction: row; align-items: center; - height: 395px; + // height: 395px; + flex: 1; width: 100%; font-size: 14px; @@ -417,6 +418,7 @@ export default { font-family: PingFang SC, PingFang SC; font-weight: 500; color: #30bfec; + padding-top: 20px; } #chart2 { @@ -441,9 +443,10 @@ export default { } .board { - height: 320px; + // height: 320px; + flex: 1; width: 100%; - padding: 10px 0px; + padding-top: 10px; border-radius: 5px 5px 5px 5px; opacity: 1; diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/index.vue index 5482f5a4..a39fd111 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/index.vue +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/components/IndicatorAnalysis/index.vue @@ -4,9 +4,9 @@ - +
-
+
@@ -79,36 +79,43 @@ export default { height: 100%; } -.content { - width: 100%; - display: inline-flex; - justify-content: space-between; - pointer-events: none; - margin-top: 19px; - margin-left: 19px; - - > div { - pointer-events: auto; - } - - .content-w { - width: 66.5%; - } - - .content-max { - width: 100%; - } - - .content-l { - width: 25%; - margin-left: 0px; - } -} +// .content { +// // width: 100%; +// // display: inline-flex; +// // justify-content: space-between; +// // pointer-events: none; +// // margin-top: 19px; +// // margin-left: 19px; +// width: 100%; +// margin: auto; +// display: flex; +// flex: 1; +// pointer-events: none; +// margin-top: 19px; +// flex-basis: 20%; + +// > div { +// pointer-events: auto; +// } + +// .content-w {s +// width: 66.5%; +// } + +// .content-l { +// margin-right: 20px; +// flex-basis: 25%; +// display: flex; +// flex-direction: column; +// } +// } .TrafficFlow { width: 100%; height: 100%; - position: relative; + display: flex; + flex-direction: column; + // position: relative; z-index: 6; color: white; @@ -119,36 +126,48 @@ export default { flex: 1; pointer-events: none; margin-top: 19px; + flex-basis: 25%; - .content-l { - width: calc(50%); - min-width: 460px; - margin-right: 20px; + > div { + pointer-events: auto; } - .content-m { - display: inline-flex; - flex-direction: column; - width: calc(100% / 4); - margin-right: 20px; + // .content-w { + // width: 66.5%; + // } - .content-m-t { - width: 100%; - height: 240px; - margin-bottom: 20px; - } + .content-l { + margin-right: 20px; + flex-basis: 25%; + display: flex; + flex-direction: column; } + } + .content-c { + width: 100%; + margin: auto; + display: flex; + // flex: 1; + pointer-events: none; + margin-top: 19px; + flex-basis: 50%; - .content-r { - width: 30%; + .content-max { + flex: 1; + width: 100%; + display: flex; + justify-content: space-between; + align-items: center; + flex-direction: column; } } - .foot { width: 100%; margin: auto; display: flex; - flex: 1; + height: 0; + // flex: 1; + flex-basis: 35%; pointer-events: none; margin-top: 19px; @@ -161,8 +180,8 @@ export default { } .foot-l { - width: 70%; - height: 330px; + flex-basis: 70%; + // height: 330px; } .foot-m { @@ -171,7 +190,9 @@ export default { .foot-r { margin-left: 20px; - width: 33%; + flex-basis: 30%; + flex: 1; + display: flex; } } } diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/index.vue index 63c90b81..4a040678 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/index.vue +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSituation/index.vue @@ -1,6 +1,6 @@