感知事件检测

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

@@ -77,13 +77,14 @@ export function geTwarningTotal(query) {
 
          //感知事件源分析
          export function getWarningSourceGroup(query) {
-            //system/status/tablist
             return request({
-                url: '/perceivedEvents/warning/warningSourceGroup',
-                method: 'post',
-                params: {
-                  ...query,
-                }
+                // url: '/perceivedEvents/warning/warningSourceGroup',
+                // method: 'post',
+                url: '/business/warning/list',
+                method: 'get',
+                // params: {
+                //   ...query,
+                // }
               })
           }          
 

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

@@ -22,7 +22,7 @@ var options = {
       orient: 'vertical',
       top: "center",
       icon: "circle",
-      right: 30,
+      right: 15,
       itemGap: 16,
       itemWidth: 8,
       itemHeight: 8,

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

@@ -140,9 +140,9 @@ export default {
         context.lineWidth = 1; // 设置线段宽度
 
         // 绘制圆角矩形
-        drawRoundRect(context, 260, 50, 120, 24, 12, gr)
-        drawRoundRect(context, 260, 78, 120, 24, 12, gr)
-        drawRoundRect(context, 260, 106, 120, 24, 12, gr)
+        drawRoundRect(context, 272, 50, 120, 24, 12, gr)
+        drawRoundRect(context, 272, 78, 120, 24, 12, gr)
+        drawRoundRect(context, 272, 106, 120, 24, 12, gr)
 
       });
     });

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

@@ -13,6 +13,7 @@ import WgtTitle from '../../../widgets/title'
 import * as echarts from "echarts";
 import chartsStatistics from "./assets/charts";
 import { getDailyCumulative } from '../../../../../../../api/event/perceiveEvent';
+import moment from "moment";
 
 export default {
   name: 'RailWayDay',
@@ -88,7 +89,7 @@ export default {
             }
 
             data.forEach((it) => {
-              timer.push(it.time);
+              timer.push(moment(it.time).format('HH:mm'));
               number.push(it.number);
             });
 

ruoyi-ui/src/views/JiHeExpressway/pages/perception/eventDetection/components/eventQuery/assets/charts2.js

@@ -107,7 +107,7 @@ var options = {
     //圆环中间内容
     text: "{zb|12}",
     subtext: "类型分析",
-    left: "19%",
+    left: "17.5%",
     top: "40%",
     textStyle: {
       rich: {

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

@@ -1,41 +1,55 @@
-let data = [{
-  average: 30,
-  name: '视频识别',
-  percent: 0.2
-}, {
-  average: 25,
-  name: '雷达识别',
-  percent: 0.25
-}, {
-  average: 15,
-  name: '锥桶',
-  percent: 0.08
-}, {
-  average: 30,
-  name: '护栏碰撞',
-  percent: 0.14
-}]
+let data = [
+  {
+    average: 30,
+    name: "视频识别",
+    percent: 0.2,
+  },
+  {
+    average: 25,
+    name: "雷达识别",
+    percent: 0.25,
+  },
+  {
+    average: 15,
+    name: "锥桶",
+    percent: 0.3,
+  },
+  {
+    average: 30,
+    name: "护栏碰撞",
+    percent: 0.25,
+  },
+];
 
 window.mainData = data;
 
-let chartData = [], lengData = [], colorList = ['#006EDF', '#00FF00', '#FFC30D', '#FF8400', '#1DA7FF', '#2967EA'];
+let chartData = [],
+  lengData = [],
+  colorList = [
+    "#006EDF",
+    "#00FF00",
+    "#FFC30D",
+    "#FF8400",
+    "#1DA7FF",
+    "#2967EA",
+  ];
 for (let i = 0; i < data.length; i++) {
   chartData.push({
     value: data[i].average,
     name: data[i].name,
-    percent: data[i].percent,
-    color: colorList[i]
-  })
+    // percent: data[i].percent,
+    color: colorList[i],
+  });
   lengData.push({
     name: data[i].name,
-    color: colorList[i]
-  })
+    color: colorList[i],
+  });
 }
 
-let a = chartData.map(t => {
-  t.value = parseInt(t.value)
-  return t
-})
+let a = chartData.map((t) => {
+  t.value = parseInt(t.value);
+  return t;
+});
 const sum = a.reduce((per, cur) => per + cur.value, 0);
 const gap = (1 * sum) / 100;
 const pieData1 = [];
@@ -64,14 +78,15 @@ var options = {
     confine: true,
     textStyle: {
       fontSize: 10, // 字体大小
-      color: '#333',
+      color: "#333",
     },
-    color: '#333',
+    color: "#333",
     backgroundColor: "#ffffff",
   },
-  title: {   //圆环中间内容
-    text: '{tb|100}',
-    subtext: '{zb|总数}',
+  title: {
+    //圆环中间内容
+    text: "{tb|100}",
+    subtext: "{zb|总数}",
     left: "22%",
     top: "40%",
     textStyle: {
@@ -80,24 +95,24 @@ var options = {
           width: 45,
           color: "#fff",
           fontSize: 21,
-          align: 'center'
-        }
-      }
+          align: "center",
+        },
+      },
     },
     subtextStyle: {
       rich: {
         zb: {
           width: 45,
-          color: '#fff',
+          color: "#fff",
           fontSize: 13,
-          align: 'center'
-        }
-      }
+          align: "center",
+        },
+      },
     },
   },
-  color: ['#5973FF', '#14d8b4', '#FFC30D', '#61D8FF', '#1DA7FF', '#2967EA'],
+  color: ["#5973FF", "#14d8b4", "#FFC30D", "#61D8FF", "#1DA7FF", "#2967EA"],
   legend: {
-    top: '20%',
+    top: "8%",
     right: 0,
     orient: "vertical", //改变排列方式
     icon: "circle", //改变legend小图标形状
@@ -116,7 +131,7 @@ var options = {
           padding: 5,
           marginLeft: 5,
           color: "#37E7FF",
-        }
+        },
       },
     },
     itemStyle: {
@@ -124,32 +139,27 @@ var options = {
     },
     data: lengData,
     formatter: function (name) {
-      let total = 0
-      let target = 0
+      let target = 0;
       if (!mainData) return "";
-      for (let i = 0; i < data.length; i++) {
-        if (window.mainData[i]) {
-          total += window.mainData[i].percent
-          if (window.mainData[i].name === name) {
-            target = window.mainData[i].percent
-          }
+      for (let i = 0; i < window.mainData.length; i++) {
+        if (window.mainData[i].name === name) {
+          target = window.mainData[i].percent;
         }
       }
       var arr = [
-        '{a|' + name + (name.length == 4 ? '}' : '}      '),
-        '{b|' + ((target / total) * 100).toFixed(2) + '%}',
-      ]
-      return arr.join('  ')
+        "{a|" + name + (name.trim().length == 4 ? "}" : "}      "),
+        "{b|" + (target * 100).toFixed(0) + "%}",
+      ];
+      return arr.join("  ");
     },
-
   },
   series: [
     {
-      name: '',
-      avoidLabelOverlap: true,//防止标签重叠
-      type: 'pie',
-      radius: ['63%', '73%'], //大小
-      center: ['30%', '50%'], //位置
+      name: "",
+      avoidLabelOverlap: true, //防止标签重叠
+      type: "pie",
+      radius: ["63%", "73%"], //大小
+      center: ["30%", "50%"], //位置
       hoverAnimation: true,
       itemStyle: {
         normal: {
@@ -165,37 +175,37 @@ var options = {
         },
         normal: {
           length: 30, // 指示线长度
-          length2: 80
+          length2: 80,
         },
       },
       data: pieData1,
       label: {
         show: false,
-        formatter: function (params) { },
+        formatter: function (params) {},
         textStyle: {
-          fontSize: '18',
-          fontWeight: 'bold',
-          color: '#fff'
+          fontSize: "18",
+          fontWeight: "bold",
+          color: "#fff",
         },
         rich: {
           color0: {
-            color: '#D56383',
+            color: "#D56383",
           },
           color1: {
-            color: '#00FF95',
+            color: "#00FF95",
           },
           color3: {
-            color: '#FFE900',
+            color: "#FFE900",
           },
           color2: {
-            color: '#F5B157',
+            color: "#F5B157",
           },
           color4: {
-            color: '#1DA7FF',
+            color: "#1DA7FF",
           },
           color5: {
-            color: '#2967EA'
-          }
+            color: "#2967EA",
+          },
         },
       },
       emphasis: {
@@ -203,11 +213,11 @@ var options = {
       },
     },
     {
-      type: 'gauge',
+      type: "gauge",
       zlevel: 0,
       splitNumber: 360,
-      radius: '50%',
-      center: ['30%', '50%'],
+      radius: "50%",
+      center: ["30%", "50%"],
       startAngle: 90,
       endAngle: -269.9999,
       axisLine: {
@@ -224,7 +234,7 @@ var options = {
         length: 68,
         lineStyle: {
           width: 2,
-          color: '#277DCA',
+          color: "#277DCA",
         },
       },
       pointer: {
@@ -235,11 +245,11 @@ var options = {
       },
     },
     {
-      type: 'gauge',
+      type: "gauge",
       zlevel: 2,
       splitNumber: 185,
-      radius: '80%',
-      center: ['30%', '50%'],
+      radius: "80%",
+      center: ["30%", "50%"],
       startAngle: 90,
       endAngle: -269.9999,
       axisLine: {
@@ -256,7 +266,7 @@ var options = {
         length: 2,
         lineStyle: {
           width: 1,
-          color: '#017383',
+          color: "#017383",
         },
       },
       pointer: {
@@ -266,7 +276,7 @@ var options = {
         show: 0,
       },
     },
-  ]
+  ],
 };
 
-export default options
+export default options;

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

@@ -56,66 +56,81 @@ export default {
 
         getWarningSourceGroup().then((res) => {
           if (res.code == 200) {
-            let data = res.data.warningSourceList;
-            let total = res.data.total;
+            let data = res.rows;
+            let total = 0;
+
             if (data.length > 0) {
-              let warningTypes = [];
-              let number = [];
-              data.forEach((it, index )=> {
+              let chartData = [
+                {
+                  average: 0,
+                  name: '视频AI   ',
+                  percent: 0.3
+                },
+                {
+                  average: 0,
+                  name: '雷达识别',
+                  percent: 0.2
+                }, {
+                  average: 0,
+                  name: '锥桶',
+                  percent: 0.1
+                }, {
+                  average: 0,
+                  name: '护栏碰撞',
+                  percent: 0.2
+                }, {
+                  average: 0,
+                  name: '扫码报警',
+                  percent: 0.1
+                }, {
+                  average: 0,
+                  name: '非机预警',
+                  percent: 0.1
+                },
+              ]
+              data.forEach(it => {
                 if (it.warningSource == 1) {
-                  warningTypes.push('交通拥堵');
+                  chartData[0].average++;
                 }
                 if (it.warningSource == 2) {
-                  warningTypes.push('行人');
+                  chartData[1].average++;
                 }
                 if (it.warningSource == 3) {
-                  warningTypes.push('非机动车');
+                  chartData[2].average++;
                 }
                 if (it.warningSource == 4) {
-                  warningTypes.push('停车');
+                  chartData[3].average++;
                 }
                 if (it.warningSource == 5) {
-                  warningTypes.push('倒车/逆行');
+                  chartData[4].average++;
                 }
                 if (it.warningSource == 6) {
-                  warningTypes.push('烟火');
-                }
-                if (it.warningSource == 7) {
-                  warningTypes.push('撒落物');
-                }
-                if (it.warningSource == 8) {
-                  warningTypes.push('异常天气');
+                  chartData[5].average ++;
                 }
-                if (it.warningSource == 9) {
-                  warningTypes.push('护栏碰撞');
-                }
-
-                number.push(it.number);
-                drawRoundRect(context, 231, 37 + (index * 27), 138, 20, 12, gr);
+                total ++;
+                // drawRoundRect(context, 231, 37 + (index * 27), 138, 20, 12, gr);
               })
+              // console.log('data',chartData)
               let colorList = ['#006EDF', '#00FF00', '#FFC30D', '#FF8400', '#1DA7FF', '#2967EA'];
               let lengData = [];
               let mainData = [];
-              let mainCount = 0;
-              for (let j = 0; j < number.length; j++) {
-                mainCount += number[j];
-              }
-              for (let i = 0; i < warningTypes.length; i++) {
-                let it = warningTypes[i];
+
+              for (let i = 0; i < chartData.length; i++) {
+                let it = chartData[i];
                 lengData.push({
-                  name: it,
+                  name: it.name,
                   color: colorList[i],
-                  value: number[i],
+                  value: it.average,
                 });
                 mainData.push({
-                  name: it,
+                  name: it.name,
                   color: colorList[i],
-                  value: number[i],
-                  percent: number[i] / mainCount
+                  value: it.average,
+                  percent: it.average / total
                 })
               }
               window.mainData = mainData;
-              console.log('mainData',mainData)
+              // console.log('mainData', mainData)
               chartsStatistics.title.text = `{tb|${total}}`;
               chartsStatistics.title.subtext = "{zb|总数}";
 
@@ -123,11 +138,12 @@ export default {
               chartsStatistics.series[0].data = mainData;
 
               myChart.on('mouseover', (params) => {
+                // console.log('params',params)
                 if (params.componentType == 'graphic') {
                   return
                 }
                 chartsStatistics.title.text = `{tb|${params.percent}%}`;
-                chartsStatistics.title.subtext =  `{zb|${params.data.name}}`;
+                chartsStatistics.title.subtext = `{zb|${params.data.name}}`;
                 // chartsStatistics.title.left = "22%";
                 myChart.setOption(chartsStatistics);
               })
@@ -140,7 +156,9 @@ export default {
                 myChart.setOption(chartsStatistics);
               })
             }
+
           }
+
           myChart.setOption(chartsStatistics);
         })
 
@@ -157,10 +175,12 @@ export default {
         let gr = context.createLinearGradient(230, 0, 360, 0);
         gr.addColorStop(1, 'rgba(92,197,255,0)');
         gr.addColorStop(0, 'rgba(92,197,255,0.3)');
-        // drawRoundRect(context, 241, 37, 134, 20, 12, gr);
-        // drawRoundRect(context, 241, 64, 134, 20, 12, gr);
-        // drawRoundRect(context, 241, 91, 134, 20, 12, gr);
-        // drawRoundRect(context, 241, 118, 134, 20, 12, gr);
+        drawRoundRect(context, 248, 15, 134, 21, 12, gr);
+        drawRoundRect(context, 248, 42, 134, 21, 12, gr);
+        drawRoundRect(context, 248, 69, 134, 21, 12, gr);
+        drawRoundRect(context, 248, 96, 134, 21, 12, gr);
+        drawRoundRect(context, 248, 123, 134, 21, 12, gr);
+        drawRoundRect(context, 248, 150, 134, 21, 12, gr);
 
         context.lineWidth = 1; // 设置线段宽度
 

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

@@ -102,7 +102,7 @@ var options = {
             data: sdata,
             color: '#fff',
             formatter: (c) => {
-               return `{a|}{b|${c.value}辆}`
+               return `{a|}{b|${c.value}件}`
             },
             rich: {
                a: {

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

@@ -117,7 +117,7 @@ export default {
                 });
               }
 
-              drawRoundRect(context, 254, 8 + i * 28, 120, 24, 12, gr)
+              drawRoundRect(context, 250, 8 + i * 28, 120, 24, 12, gr)
             }
 
             chartsStatistics.legend.data = typeAnalysisData?.map(x => x.name);