diff --git a/ruoyi-ui/src/views/JiHeExpressway/images/ListItem/1.svg b/ruoyi-ui/src/views/JiHeExpressway/images/ListItem/1.svg new file mode 100644 index 00000000..a1979bb8 --- /dev/null +++ b/ruoyi-ui/src/views/JiHeExpressway/images/ListItem/1.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + + diff --git a/ruoyi-ui/src/views/JiHeExpressway/images/ListItem/10.svg b/ruoyi-ui/src/views/JiHeExpressway/images/ListItem/10.svg new file mode 100644 index 00000000..a0cefbcd --- /dev/null +++ b/ruoyi-ui/src/views/JiHeExpressway/images/ListItem/10.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + + + + + diff --git a/ruoyi-ui/src/views/JiHeExpressway/images/ListItem/11.svg b/ruoyi-ui/src/views/JiHeExpressway/images/ListItem/11.svg new file mode 100644 index 00000000..1c56a53c --- /dev/null +++ b/ruoyi-ui/src/views/JiHeExpressway/images/ListItem/11.svg @@ -0,0 +1,12 @@ + + + + + + + + + + + + diff --git a/ruoyi-ui/src/views/JiHeExpressway/images/ListItem/2.svg b/ruoyi-ui/src/views/JiHeExpressway/images/ListItem/2.svg new file mode 100644 index 00000000..e9678e3e --- /dev/null +++ b/ruoyi-ui/src/views/JiHeExpressway/images/ListItem/2.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + + + + diff --git a/ruoyi-ui/src/views/JiHeExpressway/images/ListItem/3.svg b/ruoyi-ui/src/views/JiHeExpressway/images/ListItem/3.svg new file mode 100644 index 00000000..6a75eadf --- /dev/null +++ b/ruoyi-ui/src/views/JiHeExpressway/images/ListItem/3.svg @@ -0,0 +1,26 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/ruoyi-ui/src/views/JiHeExpressway/images/ListItem/4.svg b/ruoyi-ui/src/views/JiHeExpressway/images/ListItem/4.svg new file mode 100644 index 00000000..c67a8df1 --- /dev/null +++ b/ruoyi-ui/src/views/JiHeExpressway/images/ListItem/4.svg @@ -0,0 +1,12 @@ + + + + + + + + + + + + diff --git a/ruoyi-ui/src/views/JiHeExpressway/images/ListItem/5.svg b/ruoyi-ui/src/views/JiHeExpressway/images/ListItem/5.svg new file mode 100644 index 00000000..8431dd64 --- /dev/null +++ b/ruoyi-ui/src/views/JiHeExpressway/images/ListItem/5.svg @@ -0,0 +1,46 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/ruoyi-ui/src/views/JiHeExpressway/images/ListItem/6.svg b/ruoyi-ui/src/views/JiHeExpressway/images/ListItem/6.svg new file mode 100644 index 00000000..4db5043b --- /dev/null +++ b/ruoyi-ui/src/views/JiHeExpressway/images/ListItem/6.svg @@ -0,0 +1,26 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/ruoyi-ui/src/views/JiHeExpressway/images/ListItem/7.svg b/ruoyi-ui/src/views/JiHeExpressway/images/ListItem/7.svg new file mode 100644 index 00000000..13e8a5b3 --- /dev/null +++ b/ruoyi-ui/src/views/JiHeExpressway/images/ListItem/7.svg @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + + + + + diff --git a/ruoyi-ui/src/views/JiHeExpressway/images/ListItem/8.svg b/ruoyi-ui/src/views/JiHeExpressway/images/ListItem/8.svg new file mode 100644 index 00000000..8e78a36f --- /dev/null +++ b/ruoyi-ui/src/views/JiHeExpressway/images/ListItem/8.svg @@ -0,0 +1,36 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/ruoyi-ui/src/views/JiHeExpressway/images/ListItem/9.svg b/ruoyi-ui/src/views/JiHeExpressway/images/ListItem/9.svg new file mode 100644 index 00000000..d845704e --- /dev/null +++ b/ruoyi-ui/src/views/JiHeExpressway/images/ListItem/9.svg @@ -0,0 +1,31 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + 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 @@ + + + 暂无设备参数 + + + {{ data.text }} + handleSwitcherChange(value, data)" /> + {{ data.state ? '开' : + '关' }} + + + + + + + + + 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 @@ + + + 暂无设备参数 + + + {{ data.text }} + handleSwitcherChange(value, data)" /> + {{ data.state ? '开' : + '关' }} + + + + + + + + + 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 29feb81b..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 @@ - + - + 设备操作 @@ -32,10 +25,7 @@ - + @@ -122,12 +112,16 @@ export default { }, async created() { // if (!this.dialogData.iotDeviceId) this.dialogData.iotDeviceId = '10.0.36.146-1883'; - + if(this.dialogData){ + this.data = { + ...this.dialogData, + } + } let deviceInfo = await this.getDeviceInfo(); this.data = { - ...this.dialogData, roadName: null, - deviceStateLiteral: deviceInfo.data.formatValue.deviceState, + deviceStateLiteral: deviceInfo?.data.formatValue.deviceState, + ...this.data }; // console.log( @@ -148,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: {}, }); @@ -200,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/Dialogs/TrafficIncidents/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Dialogs/TrafficIncidents/index.vue index 5844f6ff..8c296b5a 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Dialogs/TrafficIncidents/index.vue +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Dialogs/TrafficIncidents/index.vue @@ -161,7 +161,7 @@ export default { // this.$emit('traffic-relieve', this.data); // }); request({ - url: `dc/system/event/${this.data.eventType}/${this.dialogData.id}`, + url: `dc/system/event/${this.dialogData.id}`, method: "delete", }).then((result) => { if (result.code == 200) Message.success("成功!"); diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/HomeFilter/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/HomeFilter/index.vue index 4e55059c..f7b33396 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/HomeFilter/index.vue +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/HomeFilter/index.vue @@ -110,7 +110,8 @@ export default { this.formList[2].options.options = options; }, immediate: true, - deep: true + deep: true, + isButtonClick: false } }, methods: { @@ -126,6 +127,13 @@ export default { this.$parent.$refs.RoadAndEventsRef?.setFilterDataNoAction?.(data); }, async handleResetForm() { + if(this.isButtonClick){return} + + this.isButtonClick = true; + setTimeout(() => { + this.isButtonClick = false; + }, 500); + this.$refs.FormConfigRef?.reset(); this.activeIcon = "filter"; this.filterEnd(initSearch); diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/HomeFrameControl/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/HomeFrameControl/index.vue index 3485c370..7b231d2a 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/HomeFrameControl/index.vue +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/HomeFrameControl/index.vue @@ -1,13 +1,18 @@ - - - + popper-class="global-input-search-popover" @hide="onHide()"> + + + + + + + + - + {{ }} @@ -31,7 +36,7 @@ 暂无数据 - + @@ -322,22 +327,6 @@ export default { return true; }, }, - // { - // label: "控制操作:", - // key: "controlOp", - // type: "select", - // default: null, - // options: { - // clearable: true, - // options: [{ - // label: "在线", - // value: "1" - // }, { - // label: "离线", - // value: "0" - // }] - // }, - // }, ], DeviceTopics, componentMap, @@ -353,6 +342,7 @@ export default { label: "描述", }, ], + data2:[], //批量管控 dataRecord:{ operType: "0", operTime:[] @@ -417,6 +407,10 @@ export default { changeHandle(this.data, this.formList); }, methods: { + onHide(){ + this.data['deviceType']=deviceTypeDefault; + changeHandle(this.data, this.formList); + }, submitClick() { this.$refs.ControlComponent?.handleSubmit(); }, @@ -429,6 +423,9 @@ export default { } else if(this.tabAction === '3'){ this.dataRecord.operTime = [moment().startOf('month').format('YYYY-MM-DD 00:00:00'),moment().endOf('month').format('YYYY-MM-DD 23:59:59'),] this.bindRecord(); + } else if(this.tabAction === '1'){ + // this.data['deviceType']=deviceTypeDefault; + // changeHandle(this.data, this.formList); } }, handleClick(type) { @@ -466,7 +463,7 @@ export default { .then((result) => { if (result.code != 200) return; this.tableTotal = result.total; - this.data = result.rows; + this.data2 = result.rows; }) .finally(() => { }); @@ -487,7 +484,6 @@ export default { e.operTime = moment(e.operTime).format('YYYY-MM-DD HH:mm:ss') e.operType = _.find(this.Enum_ControlType,{key:e.operType}).label }); - console.log(result.rows) this.tableData = result.rows; this.tableTotal = result.total; }) 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 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 a30ca6bd..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 @@ { if (result.code == 200) Message.success("成功!"); 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 @@ - + @@ -33,6 +33,22 @@ export default {