From 57f80c959873e9f5af6bfe3ef7ef8868a530cfc2 Mon Sep 17 00:00:00 2001 From: lau572 <1010031226@qq.com> Date: Tue, 24 Dec 2024 10:17:37 +0800 Subject: [PATCH 1/9] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E8=A7=86=E9=A2=91?= =?UTF-8?q?=E5=BC=B9=E7=AA=97=E6=9C=AA=E6=AD=A3=E5=B8=B8=E5=85=B3=E9=97=AD?= =?UTF-8?q?=E6=97=B6=E7=9A=84=E9=94=99=E8=AF=AF?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../JiHeExpressway/components/VideoMulti/videoStream.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/ruoyi-ui/src/views/JiHeExpressway/components/VideoMulti/videoStream.js b/ruoyi-ui/src/views/JiHeExpressway/components/VideoMulti/videoStream.js index b371b7ec..0b609610 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/components/VideoMulti/videoStream.js +++ b/ruoyi-ui/src/views/JiHeExpressway/components/VideoMulti/videoStream.js @@ -112,7 +112,10 @@ export class HttpLivePlayer { this.initLiveVideo(); }).catch(error => { console.error('获取URL失败:', error); - Message.error('无法获取视频流URL'); + + this.destroy(); + this.clearMediaElementErrors(); // 清除媒体元素的错误状态 + // Message.error('无法获取视频流URL'); }); } From 5f20aee1be18587ff070ef2936e1ec2038c275e5 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=8E=8B=E5=85=B4=E7=90=B3?= <1911390090@qq.com> Date: Wed, 25 Dec 2024 12:18:40 +0800 Subject: [PATCH 2/9] =?UTF-8?q?=E4=BA=A4=E9=80=9A=E6=B5=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../trafficFlow/analysis/flow/index.vue | 19 ++++++++++++++++++- 1 file changed, 18 insertions(+), 1 deletion(-) diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/analysis/flow/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/analysis/flow/index.vue index 18e79d83..489d42ed 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/analysis/flow/index.vue +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/analysis/flow/index.vue @@ -62,7 +62,22 @@ export default { direction: data.direction } }).then(resLastYear=>{ - chartsStatistics.xAxis.data = res.data.map(x=>x.name); + //将字符串按照 '-' 分割成两行 + function splitNameByDash(name) { + const parts = name.split('-'); + if (parts.length > 1) { + return `${parts[0]}\n${parts.slice(1).join('-')}`; + } + return name; + } + chartsStatistics.xAxis.data = res.data.map(x=>splitNameByDash(x.name)); + chartsStatistics.xAxis.axisLabel = { + fontSize: 15, // 调整字体大小 + formatter: function (value) { + return value; + } + }; + chartsStatistics.series[0].data = res.data.map(x=>x.totalPassengerFlow); chartsStatistics.series[1].data = res.data.map(x=>x.typeTruckFlow); chartsStatistics.series[2].data = res.data.map(x=>x.typeSpecialVehicleFlow); @@ -78,6 +93,8 @@ export default { } }, mounted() { + // 将字符串按照 '-' 分割成两行 + // this.$nextTick(() => { // var myChart = echarts.init(document.getElementById("anaFlow")); // myChart.setOption(chartsStatistics); From 6b3a544a074007e1ba1d3853aeda9daf97dcd5da Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=8E=8B=E5=85=B4=E7=90=B3?= <1911390090@qq.com> Date: Wed, 25 Dec 2024 19:46:36 +0800 Subject: [PATCH 3/9] =?UTF-8?q?=E4=BA=A4=E9=80=9A=E6=B5=81=E9=A6=96?= =?UTF-8?q?=E9=A1=B5=20=E5=AE=9E=E6=97=B6=E8=BD=A6=E6=B5=81=E9=87=8F?= =?UTF-8?q?=E8=B7=AF=E6=AE=B5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../components/ConditionStatistics/index.vue | 34 ++++--------------- .../ConditionStatistics/js/carStatistics.js | 2 +- .../ConditionStatistics/js/focusStatistics.js | 2 +- .../trafficFlow/analysis/real/charts.js | 21 ++++++------ .../trafficFlow/analysis/real/index.vue | 28 +++++++++++++-- 5 files changed, 45 insertions(+), 42 deletions(-) diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/ConditionStatistics/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/ConditionStatistics/index.vue index 3f7b1219..a9c6ec3f 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/ConditionStatistics/index.vue +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/ConditionStatistics/index.vue @@ -43,7 +43,7 @@
本年：{{ earlyWarningEvents.year }} 起
-
在途车辆统计
+
日累计车流量
@@ -157,39 +157,19 @@ export default { }, bindCharts(){ const today = moment().format('YYYY-MM-DD') - request({ - url: '/business/traffic-statistics/history/realTimeTrafficFlow', - method: 'get', - params: { - startDate: today, - periodType: 4, - direction: 1 - } - }).then(res1=>{ + request({ - url: '/business/traffic-statistics/history/realTimeTrafficFlow', + url: '/business/traffic-statistics/history/trafficFlowAtTollTypes', method: 'get', params: { startDate: today, - periodType: 4, - direction: 3 } }).then(res3=>{ // totalPassengerFlow 客车 typeSpecialVehicleFlow//特种车 typeTruckFlow 其他 let total = 0, p0 = 0, p1=0,p2=0,_p0 = 0, _p1=0,_p2=0; - res1.data.forEach(x=>{ - total+=(x.totalPassengerFlow+x.typeTruckFlow+x.typeSpecialVehicleFlow) - p0 += x.totalPassengerFlow - p1 += x.typeSpecialVehicleFlow - p2 += x.typeTruckFlow - }) - res3.data.forEach(x=>{ - - total+=(x.totalPassengerFlow+x.typeTruckFlow+x.typeSpecialVehicleFlow) - p0 += x.totalPassengerFlow - p1 += x.typeSpecialVehicleFlow - p2 += x.typeTruckFlow - }) + total+=(res3.data.bus +res3.data.truck) + p0 += res3.data.bus + p1 += res3.data.truck if(total > 0){ _p0 = parseFloat((p0/total*100).toFixed(1)) @@ -216,7 +196,7 @@ export default { myChart3.setOption(otherStatistics); }) - }) + }, bindTrafficIncident(){ // 预警事件 diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/ConditionStatistics/js/carStatistics.js b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/ConditionStatistics/js/carStatistics.js index 8dd2cefd..8c98c0ca 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/ConditionStatistics/js/carStatistics.js +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/ConditionStatistics/js/carStatistics.js @@ -98,7 +98,7 @@ var carStatistics = { }, detail: { formatter: function (params) { - return `{cn|}\n{number|${params + "%"}\n}{wcl|小客车}`; + return `{cn|}\n{number|${params + "%"}\n}{wcl|客车}`; }, rich: { fontFamily: "PangMenZhengDao-Regular", diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/ConditionStatistics/js/focusStatistics.js b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/ConditionStatistics/js/focusStatistics.js index dc9abc30..f2ab3780 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/ConditionStatistics/js/focusStatistics.js +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/ConditionStatistics/js/focusStatistics.js @@ -98,7 +98,7 @@ var focusStatistics = { }, detail: { formatter: function (params) { - return `{cn|}\n{number|${params + "%"}\n}{wcl|重点车辆}`; + return `{cn|}\n{number|${params + "%"}\n}{wcl|货车}`; }, rich: { fontFamily: "PangMenZhengDao-Regular", diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/analysis/real/charts.js b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/analysis/real/charts.js index 36de7582..598927fb 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/analysis/real/charts.js +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/analysis/real/charts.js @@ -5,14 +5,15 @@ var options = { confine:true, trigger: "axis", formatter: (params) => { - - let name = params[0].name.replace(/-/g, "") - let name1 = name+'-济南' - let name2 = name+'-菏泽' + // 获取第一个参数的名称并按 '-' 分割 + let parts = params[0].name.split('-'); + // let name = params[0].name.replace(/-/g, "") + let name1 = parts[0]+"-"+parts[1]+'-济南' + let name2 = parts[1]+"-"+parts[0]+'-菏泽' if(params[0].axisIndex === 1){ - name1 = name+'-菏泽' - name2 = name+'-济南' - } + name1 = parts[0]+"-"+parts[1]+'-菏泽' + name2 = parts[1]+"-"+parts[0]+'-济南' + } return `${name1}
${params[0].marker}${params[0].seriesName}: ${params[0].value} 辆 @@ -48,13 +49,13 @@ var options = { itemStyle: { color: '#6DBBFB' } - + },{ name: "去年同期", itemStyle: { color: '#5FA52B' } - + }, ], }, @@ -312,7 +313,7 @@ var options = { }, }, data: [ - 195,25, 194, 94, 94, 7, 25, 194, 94, 94, 74, 21, 67, 36, 56, 195, 4, 21, + 195,25, 194, 94, 94, 7, 25, 194, 94, 94, 74, 21, 67, 36, 56, 195, 4, 21, ], }, ], diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/analysis/real/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/analysis/real/index.vue index e2555bf2..e38b3826 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/analysis/real/index.vue +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficFlow/analysis/real/index.vue @@ -78,9 +78,31 @@ export default { url: '/business/traffic-statistics/history/realTimeTrafficFlowHour', method: 'get' }).then(res=>{ - const xAxis = res.data["1"].map(x=>x.name); - chartOptions.xAxis[0].data = xAxis; - chartOptions.xAxis[1].data = xAxis; + const data = res.data["1"]; + const xAxis = data.map(item => { + const parts = item.name.split('-'); + if (parts.length > 1) { + return { value: item.name, name: `${parts[0]}\n${parts.slice(1).join('-')}` }; + } else { + return { value: item.name, name: item.name }; + } + }); + chartOptions.xAxis[0].data = xAxis.map(x => x.value); + chartOptions.xAxis[1].data = xAxis.map(x => x.value); + + chartOptions.xAxis.forEach(axis => { + axis.axisLabel = { + ...axis.axisLabel, + formatter: function(value) { + const parts = value.split('-'); + if (parts.length > 1) { + return `${parts[0]}\n${parts.slice(1).join('-')}`; + } else { + return value; + } + } + }; + }); // 1今年菏泽 2今年济南 3去年菏泽 4去年济南 chartOptions.series[0].data = res.data['2'].map(x=>x.totalFlow) chartOptions.series[1].data = res.data['4'].map(x=>x.totalFlow) From a8ce3521dd7106042e93a6f5e5112ca97e421a95 Mon Sep 17 00:00:00 2001 From: lau572 <1010031226@qq.com> Date: Thu, 26 Dec 2024 13:59:54 +0800 Subject: [PATCH 4/9] =?UTF-8?q?=E4=B8=80=E7=B1=BB=E4=BA=A4=E8=B0=83?= =?UTF-8?q?=E7=AB=99=E9=A1=B5=E9=9D=A2=E4=BF=AE=E6=94=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../trafficSurvey/comprehensiveQuery/data.js | 13 +- .../comprehensiveQuery/index.vue | 288 +++++++++++++++++- .../comprehensiveQuery/tableCharts.js | 84 +++++ 3 files changed, 363 insertions(+), 22 deletions(-) create mode 100644 ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSurvey/comprehensiveQuery/tableCharts.js diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSurvey/comprehensiveQuery/data.js b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSurvey/comprehensiveQuery/data.js index 6f7ea01a..57b615d5 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSurvey/comprehensiveQuery/data.js +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSurvey/comprehensiveQuery/data.js @@ -86,22 +86,19 @@ export const searchFormList = [ label: "方向:", key: "direction", type: "RadioGroup", + required: true, isAlone: true, - default:'', + default:'1', options: { activeColor: "linear-gradient(180deg, #37E7FF 0%, #009BCC 100%)", options: [ { key: "1", - label: "菏泽", - }, - { - key: "3", - label: "济南", + label: "分方向", }, { - key: "", - label: "双向", + key: "2", + label: "不分方向", } ], }, diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSurvey/comprehensiveQuery/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSurvey/comprehensiveQuery/index.vue index fb463558..889e61ff 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSurvey/comprehensiveQuery/index.vue +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSurvey/comprehensiveQuery/index.vue @@ -33,7 +33,11 @@
- +
+
+
+ +
@@ -46,7 +50,54 @@
- + + +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + @@ -59,6 +110,60 @@
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
@@ -144,6 +249,7 @@ import * as echarts from "echarts"; import chartOptions from "./charts"; import { Loading } from 'element-ui'; + import tableChartsOptions from "./tableCharts"; export default { @@ -165,21 +271,11 @@ devItem:{}, queryForm:{ iotDeviceId:'', - direction:'', + direction:'1', date:moment(new Date()).format("YYYY-MM-DD HH:mm:ss"), type:'1', dataType:'1', }, - typeOptions:[ - {value:"1",label:"日"}, - {value:"2",label:"月"}, - {value:"3",label:"年"}, - ], - directionOptions:[ - {value:"1",label:"菏泽"}, - {value:"3",label:"济南"}, - {value:"",label:"双向"}, - ], modelVisible:false, loading:false, deviceList: [], @@ -195,6 +291,7 @@ }, realTimeTableData:[], realTimeDataList:[], + tableKey:null, }; }, created(){ @@ -232,9 +329,121 @@ }).then(res => { if (res.code == 200) { this.tableData = res.data + this.tableKey = Math.random() + + this.initTableCharts() } }) }, + + initTableCharts(){ + if(!this.myTableChart){ + this.myTableChart = echarts.init(document.getElementById("tableChart")); + } + tableChartsOptions.series = [] + if( this.tableData && this.tableData.length > 0){ + let dataList = [] + //车流量去掉自然合计值、折算值、自然平均值，车速去掉平均值 + if (this.queryForm.dataType == '1'){ + tableChartsOptions.yAxis[0].name = '流量' + dataList = this.tableData.slice(0,this.tableData.length - 3); + tableChartsOptions.xAxis.data = dataList.map(item => item.time.slice(item.time.length - 2,item.time.length)) + if (this.queryForm.direction == '1'){ + tableChartsOptions.series = [ + { + name: "菏泽", + type: "line", + selectedMode: false, + itemStyle: { + barBorderRadius: [10, 10, 10, 10], // 圆角（左上、右上、右下、左下） + // lenged文本 + opacity: 1, + color: '#02A0F8', + }, + data: dataList.map(item => item.trafficVolumeHZ), + }, + { + name: "济南", + type: "line", + selectedMode: false, + itemStyle: { + // lenged文本 + barBorderRadius: [10, 10, 10, 10], // 圆角（左上、右上、右下、左下） + opacity: 1, + color: '#E4BB53' + }, + data: dataList.map(item => item.trafficVolumeJN), + }, + ] + } else { + tableChartsOptions.series = [ + { + name: "车流量", + type: "line", + selectedMode: false, + itemStyle: { + barBorderRadius: [10, 10, 10, 10], // 圆角（左上、右上、右下、左下） + // lenged文本 + opacity: 1, + color: '#02A0F8', + }, + data: dataList.map(item => item.trafficVolume), + }, + ] + } + } else { + tableChartsOptions.yAxis[0].name = '车速' + dataList = this.tableData.slice(0,this.tableData.length - 1); + tableChartsOptions.xAxis.data = dataList.map(item => item.time.slice(item.time.length - 2,item.time.length)) + + if (this.queryForm.direction == '1'){ + tableChartsOptions.series = [ + { + name: "菏泽", + type: "line", + selectedMode: false, + itemStyle: { + barBorderRadius: [10, 10, 10, 10], // 圆角（左上、右上、右下、左下） + // lenged文本 + opacity: 1, + color: '#02A0F8', + }, + data: dataList.map(item => item.avgSpeedHZ), + }, + { + name: "济南", + type: "line", + selectedMode: false, + itemStyle: { + // lenged文本 + barBorderRadius: [10, 10, 10, 10], // 圆角（左上、右上、右下、左下） + opacity: 1, + color: '#E4BB53' + }, + data: dataList.map(item => item.avgSpeedJN), + }, + ] + } else { + tableChartsOptions.series = [ + { + name: "车速", + type: "line", + selectedMode: false, + itemStyle: { + barBorderRadius: [10, 10, 10, 10], // 圆角（左上、右上、右下、左下） + // lenged文本 + opacity: 1, + color: '#02A0F8', + }, + data: dataList.map(item => item.avgSpeed), + }, + ] + } + } + } + + this.myTableChart.setOption(tableChartsOptions,{ notMerge: true }); + }, visibleClose(){ this.modelVisible = false if (this.myChart) { @@ -244,7 +453,6 @@ }, formatTime(timestamp) { return moment(timestamp).format('HH:mm'); - }, realTimeData(){ @@ -437,4 +645,56 @@ display: flex; } + + ::v-deep .el-table .el-table__header-wrapper th { + background-color: #064258 !important; + color: #00d1ff; + border-color: #064258 !important; + border: 0px !important; + font-size: 14px; + font-family: PingFang SC, PingFang SC; + font-weight: 500; + } + + ::v-deep .el-table { + border: 0px !important; + background-color: transparent; + font-size: 12px !important; + } + + ::v-deep .el-table__body-wrapper { + background-color: #064258; + color: #fff; + } + + ::v-deep .el-table .el-table__cell { + height: 47px; + padding-left: 15px; + font-size: 14px; + font-family: PingFang SC, PingFang SC; + font-weight: 500; + color: #ffffff; + } + + ::v-deep .el-table tr:hover td { + background: #1b2528 !important; + color: #00d1ff; + height: 47px; + } + + ::v-deep .el-table tr:nth-child(odd) td { + background-color: #13272f; + border: 0px !important; + } + + ::v-deep .el-table tr:nth-child(even) td { + border: 0px !important; + } + + ::v-deep .el-table tr { + background-color: #133242 !important; + border-collapse: 0; + border: 0px !important; + background-color: transparent !important; + } diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSurvey/comprehensiveQuery/tableCharts.js b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSurvey/comprehensiveQuery/tableCharts.js new file mode 100644 index 00000000..f41385c6 --- /dev/null +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/perception/trafficSurvey/comprehensiveQuery/tableCharts.js @@ -0,0 +1,84 @@ +import * as echarts from "echarts"; + +let options = { + tooltip: { + show: true, + trigger: "axis", + }, + grid: { + left: "15px", + right: "10px", + top: "50px", + bottom: "0px", + containLabel: true, + }, + xAxis: { + data: [], + show: true, + axisTick: { + show: false, + lineStyle: { + color: "#fff", + }, + }, + axisLine: { + lineStyle: { + color: "#2A6278", + }, + }, + axisLabel: { + align: "center", + rotate: "1", + margin: 10, + textStyle: { + fontSize: 12, + color: "#E5E7E8", + }, + }, + }, + yAxis: [ + { + name: "", + nameTextStyle: { + color: "#E5E7E8", + fomtSize: 10, + }, + axisLine: { + lineStyle: { + color: "#1C82C5", + }, + }, + splitLine: { + show: true, + lineStyle: { + color: "#2A6278", + type: "solid", + }, + }, + axisLabel: { + show: true, + color: "#E5E7E8", + textStyle: { + fontSize: 12, + }, + }, + axisTick: { + show: false, + }, + }, + ], + legend: { + itemHeight: 8, + itemWidth: 8, + top: "0", + right: "2%", + textStyle: { + color: "#fff", + }, + }, + series: [ + + ], +}; + +export default options; From 8512e2daf738b69c263f78e32123a46598179786 Mon Sep 17 00:00:00 2001 From: lau572 <1010031226@qq.com> Date: Tue, 24 Dec 2024 10:17:37 +0800 Subject: [PATCH 5/9] =?UTF-8?q?=E9=A6=96=E9=A1=B5=E7=BC=A9=E7=95=A5?= =?UTF-8?q?=E5=9B=BE=E5=9C=B0=E5=B8=82=E4=BA=A4=E7=95=8C=E7=BA=BF?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../pages/Home/components/Thumbnail/data.js | 62 ++++++++++++------- .../pages/Home/components/Thumbnail/index.vue | 38 +++++++++++- 2 files changed, 77 insertions(+), 23 deletions(-) diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Thumbnail/data.js b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Thumbnail/data.js index ff79c474..a1c13703 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Thumbnail/data.js +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Thumbnail/data.js @@ -158,60 +158,78 @@ export const actualLocationList = [ export const canvasList = [ { name: "殷家林枢纽", - code: "K54", + code: "K54\n+394", line: "G3京台高速", // isFoot: true, distance: 0.06989, }, - { name: "大学城收费站", code: "K59", distance: 50.563 }, - { name: "长清收费站", code: "K72", distance: 140.05 }, - { name: "长清服务区", code: "K79", distance: 63.66 }, + { name: "大学城收费站", code: "K59\n+289", distance: 50.563 }, + { name: "长清收费站", code: "K72\n+847", distance: 140.05 }, + { name: "长清服务区", code: "K79\n+010", distance: 63.66 }, { name: "松竹枢纽", - code: "K83", + code: "K83\n+885", line: "S0101济南绕城高速二环西环段", distance: 50.358, }, - { name: "孝里收费站", code: "K86", distance: 27 }, - { name: "平阴北收费站", code: "K99", distance: 136.88 }, - { name: "平阴收费站", code: "K105", distance: 63.57 }, - { name: "平阴停车区", code: "K114", distance: 87.815 }, + { name: "孝里收费站", code: "K86\n+499", distance: 27 }, + { name: "平阴北收费站", code: "K99\n+750", distance: 136.88 }, + { name: "平阴收费站", code: "K105\n+904", distance: 63.57 }, + { name: "平阴停车区", code: "K114\n+405", distance: 87.815 }, { name: "孔村枢纽", - code: "K117", + code: "K117\n+878", line: "G22青兰高速", distance: 35.876, }, - { name: "平阴南收费站", code: "K126", distance: 86.2 }, + { name: "平阴南收费站", code: "K126\n+223", distance: 86.2 }, { name: "魏雪枢纽", - code: "K133", + code: "K133\n+588", line: "泰东高速", distance: 35.876, }, - { name: "东平服务区", code: "K139", distance: 140.42 }, - { name: "东平收费站", code: "K145", distance: 63 }, + { name: "东平服务区", code: "K139\n+817", distance: 140.42 }, + { name: "东平收费站", code: "K145\n+933", distance: 63 }, { name: "东平湖枢纽", - code: "K155", + code: "K155\n+652", line: "S30董梁高速", distance: 70, }, - { name: "沙河停车区", code: "K159", distance: 70 }, - { name: "梁山东收费站", code: "K173", distance: 70 }, - { name: "梁山收费站", code: "K179", distance: 70 }, + { name: "沙河停车区", code: "K159\n+156", distance: 70 }, + { name: "梁山东收费站", code: "K173\n+950", distance: 70 }, + { name: "梁山收费站", code: "K179\n+396", distance: 70 }, { name: "信楼枢纽", - code: "K182", + code: "K182\n+987", line: "郓鄄高速", distance: 35.876, }, - { name: "梁山服务区", code: "K186", distance: 70 }, - { name: "嘉祥西收费站", code: "K190", distance: 70 }, + { name: "梁山服务区", code: "K186\n+061", distance: 70 }, + { name: "嘉祥西收费站", code: "K190\n+495", distance: 70 }, { name: "王官屯枢纽", - code: "K208", + code: "K208\n+979", line: "G1511日兰高速", distance: 120, }, ]; +export const boundaryLineList = [ + { + name: "济南 泰安", + code: "K132\n+469", + distance: 0.49282, + }, + { + name: "泰安 济宁", + code: "K160\n+708", + distance: 0.64576, + }, + { + name: "济宁 菏泽", + code: "K200\n+752", + distance: 0.86296, + }, + +]; diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Thumbnail/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Thumbnail/index.vue index dd38de05..4c4e52a5 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Thumbnail/index.vue +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/Home/components/Thumbnail/index.vue @@ -7,7 +7,7 @@ import { onceObserver } from "@screen/utils/resizeObserver"; import Vue from "vue"; import { Graph, Shape } from '@antv/x6' import { debounce } from "lodash"; -import { actualLocationList, canvasList } from "./data.js"; +import { actualLocationList, canvasList,boundaryLineList } from "./data.js"; const faultBg = require(`@screen/images/mapBg/fault.svg`); const normalBg = require(`@screen/images/mapBg/active.svg`); @@ -54,12 +54,25 @@ const rect = { } } } +const boundaryLineStyle = { + shape: "rect", + width: 0.1, + attrs: { + "body": { + stroke: "rgba(255,255,255,0.5)", + strokeWidth: 2, + strokeDasharray: '4, 7', + + } + } +} export default { name: "Thumbnail", data() { return { list: [], //计算真实距离与画布距离的比例 *节点真实距离作为canvasItem.distance的值 + boundaryLineList: [], //计算真实距离与画布距离的比例 *节点真实距离作为canvasItem.distance的值 translateX: 0, translateY: 50, allInstance: 0, @@ -168,6 +181,7 @@ export default { }, async mapInit() { this.list = _.cloneDeep(canvasList) + this.boundaryLineList = _.cloneDeep(boundaryLineList) this.translateX = 0; this.translateY = 40; this.allInstance = 0; @@ -397,6 +411,11 @@ export default { info.distance = svgWidth * actualLocationList[index].intervalDistance; await this.drawTag(info, graph); } + for (let index in this.boundaryLineList) { + const info = this.boundaryLineList[index]; + info.distance = svgWidth * info.distance; + await this.drawBoundaryLine(info, graph); + } //文字覆盖问题修复 graph.getCellById("K79+010_底部文字").translate(-10, 0) graph.getCellById("K83+885_底部文字").translate(-10, 0); @@ -410,6 +429,23 @@ export default { graph.getCellById("K155+652_底部文字").translate(-10, 0); graph.getCellById("K190+495_底部文字").translate(10, 0); + }, + async drawBoundaryLine(info, graph, isFoot = false) { + let text = info.name + let x = info.distance + 10; + graph.addNode({ ...boundaryLineStyle, x: x, y: 30, height: 135, zIndex: 1 }); + const textNode = { + label: text, + attrs: { + label: { + fontSize: 30, + fill: "rgba(255,255,255,0.5)", + fontWeight: 600 + } + } + } + graph.addNode({ ...textNode, x: x, y: 98 ,zIndex:1}) + }, async drayLine(info, graph, isFoot = false) { let text = info.line From 0391c4f7496b74c0310ae4e9e9ddf2cafd41b7bc Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=8E=8B=E5=85=B4=E7=90=B3?= <1911390090@qq.com> Date: Fri, 27 Dec 2024 14:50:01 +0800 Subject: [PATCH 6/9] =?UTF-8?q?=E8=AE=BE=E5=A4=87=E5=9C=A8=E7=BA=BF?= =?UTF-8?q?=E7=8E=87?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../smart/statisticalAnalysis/query/data.js | 2 +- .../smart/statisticalAnalysis/query/index.vue | 61 ++++++++++++++++--- 2 files changed, 53 insertions(+), 10 deletions(-) diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/smart/statisticalAnalysis/query/data.js b/ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/smart/statisticalAnalysis/query/data.js index 56d19415..85dc4a06 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/smart/statisticalAnalysis/query/data.js +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/smart/statisticalAnalysis/query/data.js @@ -143,7 +143,7 @@ export const searchFormList = [ required: true, type: "datePicker", default: [ - moment().startOf("month").format("YYYY-MM-DD HH:mm:ss"), + moment().subtract(1, 'days').endOf('day').format("YYYY-MM-DD HH:mm:ss"), moment().format("YYYY-MM-DD HH:mm:ss"), ], options: { diff --git a/ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/smart/statisticalAnalysis/query/index.vue b/ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/smart/statisticalAnalysis/query/index.vue index 03ced8dd..c4303c20 100644 --- a/ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/smart/statisticalAnalysis/query/index.vue +++ b/ruoyi-ui/src/views/JiHeExpressway/pages/maintenanceOperations/smart/statisticalAnalysis/query/index.vue @@ -7,9 +7,24 @@ 导出丢包
- + 上一日 + 下一日 + + +
+
@@ -39,7 +54,7 @@ {{ scope.row.direction == "1" ? "菏泽方向" : scope.row.direction == "2" ? "双向": "济南方向"}} - + @@ -17,14 +14,12 @@