From 3f41ad8cf82b08585e89815feadb5a17938b3033 Mon Sep 17 00:00:00 2001
From: luxiaotao1123 <t1341870251@163.com>
Date: 星期三, 15 五月 2024 16:07:26 +0800
Subject: [PATCH] #

---
 src/pages/left/components/loc-charts.jsx    |    4 +
 src/pages/right/index.jsx                   |    6 +-
 src/pages/right/components/task-charts.jsx  |   40 +++++++++----
 src/api/report/index.js                     |    8 ++
 src/pages/right/components/inout-charts.jsx |   63 ++++++++++++++-------
 5 files changed, 85 insertions(+), 36 deletions(-)

diff --git a/src/api/report/index.js b/src/api/report/index.js
index a06f450..180db24 100644
--- a/src/api/report/index.js
+++ b/src/api/report/index.js
@@ -14,4 +14,12 @@
         return res.data.data;
     }
     return Promise.reject(new Error(res.data.msg));
+}
+
+export async function getTaskCharts(_params) {
+    const res = await request.get('/digital/charts/taskcharts', _params);
+    if (res.data.code === 200) {
+        return res.data.data;
+    }
+    return Promise.reject(new Error(res.data.msg));
 }
\ No newline at end of file
diff --git a/src/pages/left/components/loc-charts.jsx b/src/pages/left/components/loc-charts.jsx
index 0029878..1bb7926 100644
--- a/src/pages/left/components/loc-charts.jsx
+++ b/src/pages/left/components/loc-charts.jsx
@@ -48,6 +48,10 @@
     }
   }, []);
 
+  useEffect(() => {
+    console.log(trafficWay);
+  }, [trafficWay])
+
 
   const data = [];
   const color = ['#00ffff', '#00cfff', '#006ced', '#ffe000', '#ffa800', '#ff5b00'];
diff --git a/src/pages/right/components/inout-charts.jsx b/src/pages/right/components/inout-charts.jsx
index 2a8ba0a..0342784 100644
--- a/src/pages/right/components/inout-charts.jsx
+++ b/src/pages/right/components/inout-charts.jsx
@@ -1,29 +1,50 @@
+import { useEffect, useState } from 'react';
 import { ScrollBoard } from '@jiaminghi/data-view-react';
+import { getAgvCharts } from '@/api/report';
 
 const InOutCharts = () => {
-  const config = {
-    header: ['缂栧彿', '鏃堕棿', '绫诲瀷', '鍖哄煙', '鍗曞彿'],
-    data: [
-      ['1', '2023-06-01 12:00:00', '鍏ュ簱', 'A1', 'b12c3'],
-      ['2', '2023-06-01 12:00:00', '鍑哄簱', 'A2', 'b12c3'],
-      ['3', '2023-06-01 12:00:00', '鍏ュ簱', 'A3', 'b12c3'],
-      ['4', '2023-06-01 12:00:00', '鍑哄簱', 'A4', 'b12c3'],
-      ['5', '2023-06-01 12:00:00', '鍏ュ簱', 'A5', 'b12c3'],
-      ['6', '2023-06-01 12:00:00', '鍑哄簱', 'A6', 'b12c3'],
-      ['7', '2023-06-01 12:00:00', '鍏ュ簱', 'A7', 'b12c3'],
-      ['8', '2023-06-01 12:00:00', '鍑哄簱', 'A8', 'b12c3'],
-    ],
-    headerBGC: '#00fff138',
-    oddRowBGC: '#00000017',
-    evenRowBGC: '#ededed13',
-    headerHeight: 28,
-    rowNum: 8,
-    columnWidth: [80, 70, 60, 100],
-  };
+
+  const [apiData, setApiData] = useState([
+    ['AGV1', '100%', 'A1', '1m/s'],
+    ['AGV2', '100%', 'A2', '1m/s'],
+    ['AGV3', '100%', 'A3', '1m/s'],
+    ['AGV4', '100%', 'A4', '1m/s'],
+    ['AGV5', '100%', 'A5', '1m/s'],
+    ['AGV6', '100%', 'A6', '1m/s'],
+    ['AGV7', '100%', 'A7', '1m/s'],
+    ['AGV8', '100%', 'A8', '1m/s'],
+    ['AGV9', '100%', 'A9', '1m/s'],
+    ['AGV10', '100%', 'A10', '1m/s'],
+    ['AGV11', '100%', 'A11', '1m/s'],
+  ]);
+
+  useEffect(() => {
+    const timer = setInterval(() => {
+      getAgvCharts().then(res => {
+        setApiData(res.reverse().map(item => {
+          return ["AGV" + item.agvNo, item.loaderTheta + "掳", item.forkLength, item.inOutFlag]
+        }))
+      })
+    }, 1000);
+
+    return () => {
+      clearInterval(timer);
+    }
+  }, []);
+
   return (
     <ScrollBoard
-      config={config}
-      style={{ width: '100%', height: '280px', fontSize: '12px', marginBottom: '8px' }}
+      config={{
+        header: ['缂栧彿', '杞借揣鍙�', '璐у弶', '浣滀笟'],
+        data: apiData,
+        headerBGC: '#00fff138',
+        oddRowBGC: '#00000017',
+        evenRowBGC: '#ededed13',
+        headerHeight: 28,
+        rowNum: 10,
+        columnWidth: [80, 120, 100, 130],
+      }}
+      style={{ width: '100%', height: '400px', fontSize: '12px', marginBottom: '8px' }}
     />
   );
 };
diff --git a/src/pages/right/components/task-charts.jsx b/src/pages/right/components/task-charts.jsx
index 66a002d..91639b7 100644
--- a/src/pages/right/components/task-charts.jsx
+++ b/src/pages/right/components/task-charts.jsx
@@ -1,9 +1,32 @@
-import React from 'react';
+import { useEffect, useState } from 'react';
 import ReactECharts from 'echarts-for-react';
 import * as echarts from 'echarts/core';
+import { getTaskCharts } from '@/api/report';
 
 const TasksCharts = () => {
-  const backgroundColor = '#101736';
+  const [seriesData, setSeriesData] = useState([
+    { name: 'A1', data: [120, 132, 101, 134, 90, 230, 210] },
+    { name: 'C3', data: [220, 182, 191, 234, 290, 330, 310] },
+    { name: 'Y2', data: [150, 232, 201, 154, 190, 330, 410] },
+    { name: 'A3', data: [320, 332, 301, 334, 390, 330, 320] },
+  ]);
+
+  const [week, setWeek] = useState(['鍛ㄤ竴', '鍛ㄤ簩', '鍛ㄤ笁', '鍛ㄥ洓', '鍛ㄤ簲', '鍛ㄥ叚', '鍛ㄦ棩']);
+
+  useEffect(() => {
+    const timer = setInterval(() => {
+      getTaskCharts().then(res => {
+        setSeriesData(res.data);
+        setWeek(res.week);
+        console.log(res);
+      })
+    }, 1000);
+
+    return () => {
+      clearInterval(timer);
+    }
+  }, []);
+
   const color = ['#EAEA26', '#906BF9', '#FE5656', '#01E17E', '#3DD1F9', '#FFAD05']; //2涓互涓婄殑series灏遍渶瑕佺敤鍒癱olor鏁扮粍
   const legend = {
     //data锛屽氨鏄彇寰楁瘡涓猻eries閲岄潰鐨刵ame灞炴�с��
@@ -28,12 +51,6 @@
       type: 'shadow',
     },
   };
-  let seriesData = [
-    { name: 'A1', data: [120, 132, 101, 134, 90, 230, 210] },
-    { name: 'C3', data: [220, 182, 191, 234, 290, 330, 310] },
-    { name: 'Y2', data: [150, 232, 201, 154, 190, 330, 410] },
-    { name: 'A3', data: [320, 332, 301, 334, 390, 330, 320] },
-  ];
   const commonConfigFn = (index) => {
     return {
       type: 'line',
@@ -76,7 +93,6 @@
     };
   };
 
-  seriesData = seriesData.map((item, index) => ({ ...item, ...commonConfigFn(index) }));
   const option = {
     color,
     tooltip,
@@ -109,7 +125,7 @@
         show: false, //涓嶆樉绀篻rid绔栧悜鍒嗗壊绾�
       },
 
-      data: ['鍛ㄤ竴', '鍛ㄤ簩', '鍛ㄤ笁', '鍛ㄥ洓', '鍛ㄤ簲', '鍛ㄥ叚', '鍛ㄦ棩'],
+      data: week,
     },
     yAxis: {
       type: 'value',
@@ -127,12 +143,12 @@
       },
     },
 
-    series: seriesData,
+    series: seriesData.map((item, index) => ({ ...item, ...commonConfigFn(index) })),
   };
 
   return (
     <div>
-      <ReactECharts style={{ height: '280px' }} option={option} />
+      <ReactECharts style={{ height: '360px' }} option={option} />
     </div>
   );
 };
diff --git a/src/pages/right/index.jsx b/src/pages/right/index.jsx
index df56a08..b61e57c 100644
--- a/src/pages/right/index.jsx
+++ b/src/pages/right/index.jsx
@@ -31,15 +31,15 @@
         className={`absolute top-2 w-[280px] right-2 bottom-2 ${styles.panel}`}
       >
         <div className="overflow-hidden h-full">
-          <Panel title="鍑哄叆搴撲俊鎭�">
-            <InOutCharts />
-          </Panel>
           <Panel title="鍑哄叆搴撶粺璁�">
             <StatCharts />
           </Panel>
           <Panel title="浠诲姟鍒嗗竷">
             <TaskCharts />
           </Panel>
+          <Panel title="AGV淇℃伅">
+            <InOutCharts />
+          </Panel>
         </div>
         <div
           className={`${'absolute text-white top-1/2 -translate-y-1/2 left-[-21px] bg-black bg-opacity-20 text-xl font-bold bg'}`}

--
Gitblit v1.9.1