提交最新代码

ruoyi-ui/src/api/event/perceiveEvent.js

@@ -129,7 +129,7 @@ export function geTwarningTotal(query) {
             return request({
                 url: '/perceivedEvents/warning/warningTrend',
                 method: 'post',
-                params: {
+                data: {
                   ...query,
                 }
               })
@@ -141,7 +141,7 @@ export function geTwarningTotal(query) {
             return request({
                 url: '/perceivedEvents/warning/warningSectionType',
                 method: 'post',
-                params: {
+                data: {
                   ...query,
                 }
               })
@@ -153,6 +153,19 @@ export function geTwarningTotal(query) {
             return request({
                 url: '/perceivedEvents/warning/sectionMarkNumber',
                 method: 'post',
+                data: {
+                  ...query,
+                }
+              })
+          }  
+
+///
+    //查询辖区路段列表
+    export function getRoadSectionList(query) {
+      //system/status/tablist
+      return request({
+          url: '/business/roadSection/list',
+          method: 'get',
           params: {
             ...query,
           }

ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/eventQuery/index.vue

@@ -2,6 +2,7 @@
     <div class='congestion'>
       <WgtTitle :title="'感知事件查询'" ></WgtTitle>
       <div class="board">
+        <ProgressBar class="keep-ratio" @selectItem="selectProgress" :dataList="dataList"  :selectIndex="7" />
         <div class="searchPanel">
           <el-select v-model="area" size="mini" class="selectRoad" placeholder="请选择">
             <el-option
@@ -28,12 +29,11 @@
             :type="year"
             placeholder="请选择"
         />
-        <el-quarter-picker  size="mini" class="selectRoad" style="width:180px;" v-if="year == 'quarter'" v-model="quarter" aria-placeholder="请选季度" />
+        <el-quarter-picker  size="mini" class="selectRoad" style="width:180px;" v-if="year == 'quarter'" v-model="dateTime" aria-placeholder="请选季度" />
 
-          <el-button type="primary" size="mini" class="btnSearch"  icon="el-icon-search">查询</el-button>
+          <el-button type="primary" size="mini" class="btnSearch" @click="searchQuery" icon="el-icon-search">查询</el-button>
           <el-button class="btnReset"  size="mini" icon="el-icon-refresh-left" >重置</el-button>
         </div>
-        <ProgressBar class="keep-ratio" :dataList="dataList"  :selectIndex="7" />
       </div>  
       <div class="body" >
         <div  id="chart1" class="keep-ratio" >
@@ -58,6 +58,7 @@
   import chart2 from "./assets/charts2";
   import chart3 from "./assets/charts3";
   import ElQuarterPicker from './ElQuarterPicker'
+  import { getWarningTrend,getWarningSectionType,getSectionMarkNumber,getRoadSectionList } from '../../../../../../../api/event/perceiveEvent';
 
   const drawRoundRect = ( ctx, x, y, width, height, radius ,gr) => {   
   // ctx, 矩形距离x坐标位置, 矩形距离y坐标的位置, 矩形的宽, 矩形的长,圆角角度 
@@ -93,7 +94,7 @@
            label: '月'
         },
         {
-            value: 'date',
+            value: 'day',
            label: '日'
         },
         {
@@ -101,14 +102,14 @@
            label: '季'
         },],
         areaOptions: [{
-          value: '济南',
+          value: '0531',
           label: '济南'
         }, {
           value: '菏泽',
           label: '菏泽'
       }],
       dateTime:"",
-      area: '济南',
+      area: '0531',
       dataList:[
         {
           title:"殷家林枢纽"
@@ -160,6 +161,7 @@
         }
       ],
       quarter:"",
+      selectId:1,
       year:"year",
         list:[
           {name:'大学城-长清', direction:'济南方向', state:"正常",speed:'108.14km/h', follow:'161'},
@@ -176,11 +178,77 @@
       
     },
     methods: {
-  
+      selectProgress(item){
+        this.selectId = item.id;
+      },
+      searchQuery(){
+        let dateTime = this.dateTime;
+        if ( this.year == "year") {
+          dateTime = new Date(dateTime);
+          dateTime = dateTime.getFullYear();
+          console.log(dateTime);
+        }
+        if ( this.year == "month") {
+          dateTime = new Date(dateTime);
+          let m = dateTime.getMonth()+1;
+          m = m < 10?"0"+m:m;
+          dateTime = dateTime.getFullYear() + "-" + m +"-00 00:00:00";
+          console.log(dateTime);
+        }
+        //感知事件趋势
+        getWarningTrend({
+            "type": this.year,
+            "sectionId": this.selectId,
+            "createTime": dateTime,
+        }).then(res=>{
+          console.log(res);
+          chart1.series[0].data = [];
+          this.myChart1.setOption(chart1);
+        });
+        //类型占比
+        getWarningSectionType({
+            "type": this.year,
+            "sectionId": this.selectId,
+            "createTime": dateTime,
+        }).then(res=>{
+          console.log(res);
+          chart2.series[0].data = [];
+          this.myChart2.setOption(chart2);
+        })
+          //路段范围内桩号分布
+          getSectionMarkNumber({
+            "type": this.year,
+            "sectionId": this.selectId,
+            "createTime": dateTime,
+        }).then(res=>{
+          console.log(res);
+          chart3.series[0].data = [];
+          chart3.series[1].data = [];
+          this.myChart3.setOption(chart3);
+        })
+      },
     },
     mounted() {
       setTimeout(() => {
         this.$nextTick(() => {
+
+          getRoadSectionList().then(res=>{
+              console.log(res);
+              if ( res.code == 200 ) {
+                let rows = res.rows;
+                this.dataList = [];
+                rows.forEach(it=>{
+                    this.dataList.push({
+                      title:it.sectionName.split("-")[0],
+                      id:it.id,
+
+                    });
+                })
+              }
+             
+
+          })
+
             var myChart1 = echarts.init(document.getElementById('chart1'));
              myChart1.setOption(chart1);
              var myChart2 = echarts.init(document.getElementById('chart2'));
@@ -188,6 +256,9 @@
              var myChart3 = echarts.init(document.getElementById('chart3'));
              myChart3.setOption(chart3);
 
+             this.myChart1 = myChart1;
+             this.myChart2 = myChart2;
+             this.myChart3 = myChart3;
              
         const domMap = document.getElementById("chart2");
         let parentDiv = domMap.firstChild; 
@@ -288,7 +359,7 @@
         height: 40px;
         width:100%;
         font-size: 14px;
-        margin-bottom: 10px;
+        margin-top: 10px;
     div{
       white-space: nowrap;
       margin-right: 4px;

ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/eventQuery/progressBar.vue

@@ -2,8 +2,8 @@
     <div class='congestion'>
        <div :style="{width: dataList.length * 300}" >
         <div :class="selectIndex == index?selectLine < 1?'item action Abefore':'item action Aafter':selectIndex + selectLine == index?selectLine < 1?'item action Aafter':'item action Abefore':'item'" v-for="(item,index) in dataList"   :key="index"  >
-            <i class="after" @click="selectItem(index,-1)"></i>
+            <i class="after" @click="selectItem(index,-1, dataList[index - 1])"></i>
-            <i class="before" @click="selectItem(index,+1)" ></i>
+            <i class="before" @click="selectItem(index,+1,item)" ></i>
             <span></span>
             <div>{{ item.title }}</div>
         </div>
@@ -38,9 +38,11 @@ import { number } from 'echarts';
       
     },
     methods: {
-        selectItem(index,num){
+        selectItem(index,num,item){
             this.selectIndex = index;
-            this.selectLine = num
+            this.selectLine = num;
+            if (  item )
+            this.$emit("selectItem",item);
         }
     },
     mounted() {
@@ -147,7 +149,7 @@ import { number } from 'echarts';
 
         >.item {
             position: relative;
-            width: 180px;
+            width: 113px;
             height:35px;
             display: inline-flex;
             flex-direction: column;

ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/monthStatistics/index.vue

@@ -12,6 +12,8 @@
   import WgtTitle from '../../../widgets/title'
   import * as echarts from "echarts";
   import chartsStatistics from "./assets/charts";
+  import { getDailyCumulativeMonth } from '../../../../../../../api/event/perceiveEvent';
+
   export default {
     name: 'MonthStatistics',
     components: {
@@ -33,7 +35,34 @@
       setTimeout(() => {
         this.$nextTick(() => {
           var myChart = echarts.init(document.getElementById('monthStatistics'));
+          getDailyCumulativeMonth().then((res)=>{
+            console.log(res);
+            if ( res.code == 200 ) {
+              let data = res.data;
+              let timeData = [];
+              let datasN = [];
+              for (var i = 0; i < 24;i++){
+                let k = 0;
+                 for (var j = 0;j < data.length;j++){
+                    let it = data[j];
+                      if ( it.time == i ) {
+                       timeData.push( i +"点至"+ (i +1)+"点");
+                       datasN.push(it.number);
+                       k++;
+                    }
+                 }
+                 if ( k == 0 ) {
+                   timeData.push( i +"点至"+ (i +1)+"点");
+                   datasN.push(0);
+                 }
+              }
+              chartsStatistics.xAxis.data =  timeData;
+              chartsStatistics.series[0].data = datasN;
+              
               myChart.setOption(chartsStatistics);
+            }
+           
+          });
         });
       });
     },

ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/railway/assets/charts.js

@@ -49,7 +49,7 @@ var options = {
                margin:-5,
                formatter: function (value) {
                   let index = xdata.value.indexOf(value);
-                  return `{a|Top${index+1}} {b|${value}}`
+                  return `{a|Top${index + 2}} {b|${value}}`
                },
                rich: {
                   a: {