>([]);
useEffect(() => {
- const equStatus = allData?.equStatus;
+ const equStatus = allEquStatus?.equStatus;
if (equStatus) {
setEqList(equStatus);
}
+ },[allEquStatus])
+ // 中间顶部数据
+ useEffect(() => {
+ const numAlarm = allData?.numAlarm;
+ setNumAlarm(numAlarm || '0');
+ const monthMap = allData?.monthMap;
+ setMonthNum(monthMap?.output || '0');
+ const todayMap = allData?.todayMap;
+ setTodayNum(todayMap?.output || '0');
+ setYieldNum(todayMap?.Yield || '0');
},[allData])
- // useEffect(() => {
- // if (selectedMeshId && eqList[selectedMeshId]) {
- // setSelectedMeshObj({
- // equipmentName:eqList[selectedMeshId].equipmentName,
- // run:eqList[selectedMeshId].run ? eqList[selectedMeshId].run : true,
- // error:eqList[selectedMeshId].error ? eqList[selectedMeshId].error : false,
- // });
- // }
- // },[selectedMeshId])
+ useEffect(() => {
+ if (selectedMeshId && eqList[selectedMeshId]) {
+ setSelectedMeshObj({
+ equipmentName:eqList[selectedMeshId].equipmentName,
+ run:eqList[selectedMeshId].run ? eqList[selectedMeshId].run : true,
+ error:eqList[selectedMeshId].error ? eqList[selectedMeshId].error : false,
+ num:eqList[selectedMeshId].inputNum ? eqList[selectedMeshId].inputNum : (eqList[selectedMeshId].outputNum ? eqList[selectedMeshId].outputNum : 0),
+ });
+ }
+ },[selectedMeshId])
useEffect(() => {
// 确保 canvas 引用存在
if (!canvasRef.current) return;
@@ -140,7 +156,6 @@ function MybabylonJS({ modelPath }: MybabylonJSProps) {
ground.material = grid;
let hl = new BABYLON.HighlightLayer("hl1", scene);
- let hl2 = new BABYLON.HighlightLayer("hl2", scene);
// 定义一个函数来加载或重新加载模型
const loadOrReloadModel = async () => {
@@ -197,23 +212,20 @@ function MybabylonJS({ modelPath }: MybabylonJSProps) {
}
}
// 模型点击事件
- // mesh._scene.onPointerDown = async (event, _pickResult) => {
- // console.log('_pickResult',_pickResult)
- // const pickInfo = mesh._scene.pick(
- // mesh._scene.pointerX,
- // mesh._scene.pointerY
- // );
- // //如果需要获取吗模型根节点，而不是模型中某个组件，请用一下方法
- // // getRootNode(pickInfo.pickedMesh as BABYLON.Node) 如上篇文章getRootNode函数
+ mesh._scene.onPointerDown = async (event, _pickResult) => {
+ console.log('_pickResult',_pickResult)
+ const pickInfo = mesh._scene.pick(
+ mesh._scene.pointerX,
+ mesh._scene.pointerY
+ );
+ //判断是否是右键
+ if (!(event.buttons === 1 && pickInfo.pickedMesh)) return;
+ const MeshName = pickInfo.pickedMesh.name;
+ const MeshNameId = pickInfo.pickedMesh.metadata.tags;
- // //判断是否是右键
- // if (!(event.buttons === 1 && pickInfo.pickedMesh)) return;
- // const MeshName = pickInfo.pickedMesh.name;
- // // const MeshNameId = pickInfo.pickedMesh.metadata.tags;
-
- // setSelectedMeshName(MeshName);
- // // setSelectedMeshId(MeshNameId);
- // };
+ setSelectedMeshName(MeshName);
+ setSelectedMeshId(MeshNameId);
+ };
});
LOD0MESH2.meshes.map((mesh) => {
mesh.isPickable = true;
@@ -242,23 +254,20 @@ function MybabylonJS({ modelPath }: MybabylonJSProps) {
}
}
// 模型点击事件
- // mesh._scene.onPointerDown = async (event, _pickResult) => {
- // console.log('_pickResult',_pickResult)
- // const pickInfo = mesh._scene.pick(
- // mesh._scene.pointerX,
- // mesh._scene.pointerY
- // );
- // //如果需要获取吗模型根节点，而不是模型中某个组件，请用一下方法
- // // getRootNode(pickInfo.pickedMesh as BABYLON.Node) 如上篇文章getRootNode函数
+ mesh._scene.onPointerDown = async (event, _pickResult) => {
+ console.log('_pickResult',_pickResult)
+ const pickInfo = mesh._scene.pick(
+ mesh._scene.pointerX,
+ mesh._scene.pointerY
+ );
+ //判断是否是右键
+ if (!(event.buttons === 1 && pickInfo.pickedMesh)) return;
+ const MeshName = pickInfo.pickedMesh.name;
+ const MeshNameId = pickInfo.pickedMesh.metadata.tags;
- // //判断是否是右键
- // if (!(event.buttons === 1 && pickInfo.pickedMesh)) return;
- // const MeshName = pickInfo.pickedMesh.name;
- // // const MeshNameId = pickInfo.pickedMesh.metadata.tags;
-
- // setSelectedMeshName(MeshName);
- // // setSelectedMeshId(MeshNameId);
- // };
+ setSelectedMeshName(MeshName);
+ setSelectedMeshId(MeshNameId);
+ };
});
} catch (error) {
console.error("加载模型失败:", error);
@@ -273,7 +282,6 @@ function MybabylonJS({ modelPath }: MybabylonJSProps) {
camera.alpha = BABYLON.Tools.ToRadians(270);
camera.beta = BABYLON.Tools.ToRadians(25);
camera.radius = 220;
- setShowInfo(true);
setSelectedMeshName(null);
}
// 外部初始位置按钮
@@ -285,7 +293,6 @@ function MybabylonJS({ modelPath }: MybabylonJSProps) {
case BABYLON.PointerEventTypes.POINTERMOVE:
clearTimeout(resetCamera);
resetCamera = setTimeout(reset, 15000);
- setShowInfo(false);
}
});
return scene;
@@ -323,23 +330,38 @@ function MybabylonJS({ modelPath }: MybabylonJSProps) {
resetRef.current();
}
};
+ function formatNumber(str: string, separator = ',') {
+ // 使用正则表达式从右到左每隔3位添加分隔符
+ str = str.toString();
+ return str.replace(/\B(?=(\d{3})+(?!\d))/g, separator);
+ }
+ function toPercentage(decimalStr: string) {
+ let decimal = parseFloat(decimalStr);
+ if (isNaN(decimal)) {
+ throw new Error('Invalid decimal number provided.');
+ }
+ let percent = decimal * 100;
+ let formattedPercent = percent.toFixed(2);
+ return formattedPercent + '%';
+}
+
return (
-
88%
+
{toPercentage(yieldNum)}
成品率
-
8,984
+
{formatNumber(todayNum)}
今日产量
-
12,948,984
+
{formatNumber(monthNum)}
本月产量
-
59
+
{formatNumber(numAlarm)}
设备报警数
@@ -350,13 +372,13 @@ function MybabylonJS({ modelPath }: MybabylonJSProps) {
{selectedMeshObj.equipmentName}
- 进口数量：
- 13,302
+ 进/出口数量：
+ {selectedMeshObj.num}
- */}
报警状态：
diff --git a/src/babylonjs/EqInfoData.ts b/src/babylonjs/EqInfoData.ts
index 81ade82..320a772 100644
--- a/src/babylonjs/EqInfoData.ts
+++ b/src/babylonjs/EqInfoData.ts
@@ -15,7 +15,7 @@ const EqInfoData:EqInfoDataInterface = {
{ name: "2支线", value: 0, code:'1-edge2', label:'inputNum' },
{ name: "3支线", value: 0, code:'1-edge3', label:'inputNum' },
],
- position: [120, 240],
+ position: [180, 210],
},
{
name: "磨边清洗出口",
@@ -24,7 +24,7 @@ const EqInfoData:EqInfoDataInterface = {
{ name: "2支线", value: 0, code:'1-edgeclean2', label:'outputNum' },
{ name: "3支线", value: 0, code:'1-edgeclean3', label:'outputNum' },
],
- position: [320, 150],
+ position: [340, 130],
},
{
name: "打孔出口",
@@ -33,7 +33,7 @@ const EqInfoData:EqInfoDataInterface = {
{ name: "2支线", value: 0, code:'1-punch2', label:'outputNum' },
{ name: "3支线", value: 0, code:'1-punch3', label:'outputNum' },
],
- position: [550, 320],
+ position: [590, 300],
},
{
name: "丝印进口",
@@ -42,7 +42,7 @@ const EqInfoData:EqInfoDataInterface = {
{ name: "2支线", value: 0, code:'1-silk2', label:'inputNum' },
{ name: "3支线", value: 0, code:'1-silk3', label:'inputNum' },
],
- position: [520, 75],
+ position: [510, 65],
},
{
name: "二次固化出口",
@@ -51,12 +51,12 @@ const EqInfoData:EqInfoDataInterface = {
{ name: "2支线", value: 0, code:'1-secsolid2', label:'outputNum' },
{ name: "3支线", value: 0, code:'1-secsolid3', label:'outputNum' },
],
- position: [850, 170],
+ position: [850, 190],
},
{
name: "钢化进口",
data: [{ name: "钢化进口", value: 0, code:'1-temper1', label:'inputNum' }],
- position: [810, 10],
+ position: [750, 10],
},
],
"Line1-2": [
@@ -106,7 +106,7 @@ const EqInfoData:EqInfoDataInterface = {
{ name: "1支线", value: 0, code:'2-edge1', label:'inputNum' },
{ name: "2支线", value: 0, code:'2-edge2', label:'inputNum' },
],
- position: [120, 265],
+ position: [150, 245],
},
{
name: "磨边清洗出口",
@@ -189,7 +189,7 @@ const EqInfoData:EqInfoDataInterface = {
{ name: "1支线", value: 0, code:'3-edge1', label:'inputNum' },
{ name: "2支线", value: 0, code:'3-edge2', label:'inputNum' },
],
- position: [150, 255],
+ position: [150, 225],
},
{
name: "磨边清洗出口",
@@ -197,7 +197,7 @@ const EqInfoData:EqInfoDataInterface = {
{ name: "1支线", value: 0, code:'3-edgeclean1', label:'outputNum' },
{ name: "2支线", value: 0, code:'3-edgeclean2', label:'outputNum' },
],
- position: [350, 170],
+ position: [380, 150],
},
{
name: "打孔出口",
@@ -205,7 +205,7 @@ const EqInfoData:EqInfoDataInterface = {
{ name: "1支线", value: 0, code:'3-punch1', label:'outputNum' },
{ name: "2支线", value: 0, code:'3-punch2', label:'outputNum' },
],
- position: [590, 290],
+ position: [620, 280],
},
{
name: "丝印进口",
@@ -213,7 +213,7 @@ const EqInfoData:EqInfoDataInterface = {
{ name: "1支线", value: 0, code:'3-silk1', label:'inputNum' },
{ name: "2支线", value: 0, code:'3-silk2', label:'inputNum' },
],
- position: [570, 90],
+ position: [560, 90],
},
{
name: "二次固化出口",
@@ -221,7 +221,7 @@ const EqInfoData:EqInfoDataInterface = {
{ name: "1支线", value: 0, code:'3-secsolid1', label:'outputNum' },
{ name: "2支线", value: 0, code:'3-secsolid2', label:'outputNum' },
],
- position: [850, 170],
+ position: [870, 170],
},
{
name: "钢化进口",
@@ -272,7 +272,7 @@ const EqInfoData:EqInfoDataInterface = {
{ name: "1支线", value: 0, code:'4-edge1', label:'inputNum' },
{ name: "2支线", value: 0, code:'4-edge2', label:'inputNum' },
],
- position: [200, 240],
+ position: [200, 150],
},
{
name: "磨边清洗出口",
@@ -280,7 +280,7 @@ const EqInfoData:EqInfoDataInterface = {
{ name: "1支线", value: 0, code:'4-edgeclean1', label:'outputNum' },
{ name: "2支线", value: 0, code:'4-edgeclean2', label:'outputNum' },
],
- position: [370, 190],
+ position: [420, 150],
},
{
name: "一次镀膜进口",
@@ -288,7 +288,7 @@ const EqInfoData:EqInfoDataInterface = {
{ name: "1支线", value: 0, code:'4-fircoat1', label:'inputNum' },
{ name: "2支线", value: 0, code:'4-fircoat2', label:'inputNum' },
],
- position: [610, 300],
+ position: [650, 290],
},
{
name: "二次镀膜进口",
@@ -296,7 +296,7 @@ const EqInfoData:EqInfoDataInterface = {
{ name: "1支线", value: 0, code:'4-seccoat1', label:'inputNum' },
{ name: "2支线", value: 0, code:'4-seccoat2', label:'inputNum' },
],
- position: [590, 85],
+ position: [640, 60],
},
{
name: "二次固化出口",
@@ -309,7 +309,7 @@ const EqInfoData:EqInfoDataInterface = {
{
name: "钢化进口",
data: [{ name: "钢化进口", value: 0, code:'4-temper1', label:'inputNum' }],
- position: [800, 30],
+ position: [820, 20],
},
],
"Line4-2": [
@@ -357,7 +357,7 @@ const EqInfoData:EqInfoDataInterface = {
{ name: "2支线", value: 0, code:'5-edge2', label:'inputNum' },
{ name: "3支线", value: 0, code:'5-edge3', label:'inputNum' },
],
- position: [160, 220],
+ position: [150, 370],
},
{
name: "磨边清洗出口",
@@ -366,7 +366,7 @@ const EqInfoData:EqInfoDataInterface = {
{ name: "2支线", value: 0, code:'5-edgeclean2', label:'outputNum' },
{ name: "3支线", value: 0, code:'5-edgeclean3', label:'outputNum' },
],
- position: [331, 160],
+ position: [380, 130],
},
{
name: "一次镀膜进口",
@@ -375,7 +375,7 @@ const EqInfoData:EqInfoDataInterface = {
{ name: "2支线", value: 0, code:'5-fircoat2', label:'inputNum' },
{ name: "3支线", value: 0, code:'5-fircoat3', label:'inputNum' },
],
- position: [555, 329],
+ position: [650, 310],
},
{
name: "二次镀膜进口",
@@ -384,7 +384,7 @@ const EqInfoData:EqInfoDataInterface = {
{ name: "2支线", value: 0, code:'5-seccoat2', label:'inputNum' },
{ name: "3支线", value: 0, code:'5-seccoat3', label:'inputNum' },
],
- position: [560, 65],
+ position: [640, 20],
},
{
name: "二次固化出口",
@@ -393,12 +393,12 @@ const EqInfoData:EqInfoDataInterface = {
{ name: "2支线", value: 0, code:'5-secsolid2', label:'outputNum' },
{ name: "3支线", value: 0, code:'5-secsolid3', label:'outputNum' },
],
- position: [850, 200],
+ position: [850, 220],
},
{
name: "钢化进口",
data: [{ name: "钢化进口", value: 0, code:'5-temper1', label:'inputNum' }],
- position: [800, 20],
+ position: [830, 10],
},
],
"Line5-2": [
diff --git a/src/babylonjs/LinePageBabylonNew.tsx b/src/babylonjs/LinePageBabylonNew.tsx
index 6f51d62..ad8b429 100644
--- a/src/babylonjs/LinePageBabylonNew.tsx
+++ b/src/babylonjs/LinePageBabylonNew.tsx
@@ -1,4 +1,4 @@
-import React, { useEffect, useRef, useState } from "react";
+import { useEffect, useRef, useState } from "react";
import * as BABYLON from "@babylonjs/core";
import "@babylonjs/core/Debug/debugLayer";
import "@babylonjs/inspector";
@@ -43,7 +43,6 @@ function MybabylonJS({ modelPath }: MybabylonJSProps) {
const allData = useAppSelector(selectLine1Before) as any; // 使用`any`来绕过类型检查
const canvasRef = useRef(null);
const resetRef = useRef<(() => void) | null>(null);
- // onEquObservable.notifyObservers(EquStatus);
const [selectedMeshName, setSelectedMeshName] = useState(null);
const [selectedMeshId, setSelectedMeshId] = useState(null);
const [selectedMeshObj, setSelectedMeshObj] = useState({
@@ -108,7 +107,9 @@ function MybabylonJS({ modelPath }: MybabylonJSProps) {
"camera",
BABYLON.Tools.ToRadians(245),
BABYLON.Tools.ToRadians(25),
- modelPath.slice(-1) === "1"
+ modelPath.slice(-3) === "2-1"
+ ? 120
+ : modelPath.slice(-1) === "1"
? 110
: modelPath.slice(-3) === "5-2"
? 100
@@ -214,9 +215,6 @@ function MybabylonJS({ modelPath }: MybabylonJSProps) {
mesh._scene.pointerX,
mesh._scene.pointerY
);
- //如果需要获取吗模型根节点，而不是模型中某个组件，请用一下方法
- // getRootNode(pickInfo.pickedMesh as BABYLON.Node) 如上篇文章getRootNode函数
-
//判断是否是右键
if (!(event.buttons === 1 && pickInfo.pickedMesh)) return;
const MeshName = pickInfo.pickedMesh.name;
@@ -239,13 +237,15 @@ function MybabylonJS({ modelPath }: MybabylonJSProps) {
camera.alpha = BABYLON.Tools.ToRadians(245);
camera.beta = BABYLON.Tools.ToRadians(25);
camera.radius =
- modelPath.slice(-1) === "1"
+ modelPath.slice(-3) === "2-1"
+ ? 120
+ : modelPath.slice(-1) === "1"
? 110
: modelPath.slice(-3) === "5-2"
? 100
: modelPath.slice(-3) === "1-2"
? 90
- : 65;
+ : 65
setShowInfo(true);
setSelectedMeshName(null);
}
diff --git a/src/page/Component/BarChart/chart.config.ts b/src/page/Component/BarChart/chart.config.ts
index 3fc7d17..743c192 100644
--- a/src/page/Component/BarChart/chart.config.ts
+++ b/src/page/Component/BarChart/chart.config.ts
@@ -2,7 +2,7 @@ import * as echarts from "echarts";
export default function getOptions(dataProps: number[],xData:string[], color: string[]) {
if (dataProps.length === 0) return null;
return {
- grid: { top: 40, right: 10, bottom: 10, left: 10, containLabel: true },
+ grid: { top: 30, right: 10, bottom: 5, left: 10, containLabel: true },
legend: {
show: false,
},
@@ -11,8 +11,10 @@ export default function getOptions(dataProps: number[],xData:string[], color: st
data: xData,
axisLabel: {
color: "#fff",
- fontSize: 12,
+ fontSize: 10,
interval: 0,
+ rotate:20
+
},
axisTick: { show: false },
axisLine: {
diff --git a/src/page/Component/LineChart/chart.config.ts b/src/page/Component/LineChart/chart.config.ts
index 5452b3c..2325342 100644
--- a/src/page/Component/LineChart/chart.config.ts
+++ b/src/page/Component/LineChart/chart.config.ts
@@ -2,13 +2,13 @@ export default function getOptions(chartData: any) {
if (Object.keys(chartData).length === 0) {
return null;
}
- const colors = ["#1A99FF", "#FFB70C", "#C69DFF", "#50F4E3", "#E02094"];
+ const colors = ["#2760FF", "#8167F6", "#5B9BFF", "#99D66C", "#FFD160","#D680FF","#FF6860"];
return {
color: colors,
- grid: { top: 38, right: 12, bottom: 5, left: 15, containLabel: true },
+ grid: { top: 50, right: 12, bottom: 5, left: 15, containLabel: true },
legend: {
show: true,
- top: 10,
+ top: 5,
right: 10,
padding: 0,
itemWidth: 14,
diff --git a/src/page/Component/LineChartRight/chart.config.ts b/src/page/Component/LineChartRight/chart.config.ts
index a4a3fc1..7dc2840 100644
--- a/src/page/Component/LineChartRight/chart.config.ts
+++ b/src/page/Component/LineChartRight/chart.config.ts
@@ -6,16 +6,15 @@ export default function getOptions(tempData: any) {
const colors = ["#1A99FF", "#50F4E3"];
return {
color: colors,
- grid: { top: 30, right: 12, bottom: 10, left: 10, containLabel: true },
+ grid: { top: 30, right: 12, bottom: 10, left: 5, containLabel: true },
legend: {
show: true,
- icon: "roundRect",
top: 10,
right: 10,
padding: 0,
- itemWidth: 10,
+ itemWidth: 14,
itemHeight: 10,
- itemGap: 3,
+ itemGap: 8,
height: 10,
textStyle: {
color: "#DFF1FE",
diff --git a/src/page/Component/SummaryBarChart/chart.config.ts b/src/page/Component/SummaryBarChart/chart.config.ts
index c9b7673..072ff4a 100644
--- a/src/page/Component/SummaryBarChart/chart.config.ts
+++ b/src/page/Component/SummaryBarChart/chart.config.ts
@@ -2,15 +2,14 @@ export default function getOptions(chartData: any) {
if (Object.keys(chartData).length === 0) {
return null;
}
- const colors = ["#2760FF", "#8167F6", "#5B9BFF", "#99D66C", "#FFD160"];
- let sum = chartData.sumData;
+ const colors = ["#2760FF", "#8167F6", "#5B9BFF", "#99D66C", "#FFD160","#D680FF","#FF6860"];
return {
color: colors,
- grid: { top: 48, right: 20, bottom: 5, left: 15, containLabel: true },
+ grid: { top: 48, right: 20, bottom: 5, left: 10, containLabel: true },
legend: {
show: true,
icon: "roundRect",
- top: 10,
+ top: 5,
right: 20,
padding: 0,
itemWidth: 10,
@@ -71,58 +70,6 @@ export default function getOptions(chartData: any) {
},
className: "luoyang-chart-tooltip",
},
- // Declare several bar series, each will be mapped
- // to a column of dataset.source by default.
series:chartData.series
- // series: [
- // {
- // data: chartData.yData1,
- // type: "bar",
- // stack: "a",
- // name: "磨边后",
- // barWidth: 14,
- // label: {
- // show: true,
- // position: "right",
- // color: "inherit",
- // },
- // },
- // {
- // data: chartData.yData2,
- // type: "bar",
- // stack: "a",
- // name: "包装1",
- // label: {
- // show: true,
- // position: "right",
- // color: "inherit",
- // },
- // },
- // {
- // data: chartData.yData3,
- // type: "bar",
- // stack: "a",
- // name: "包装2",
- // label: {
- // show: true,
- // position: "right",
- // color: "inherit",
- // },
- // },
- // {
- // data: [0, 0, 0, 0, 0],
- // type: "bar",
- // stack: "a",
- // name: "",
- // label: {
- // show: true,
- // position: "top",
- // color: "#fff",
- // formatter: function (params: any) {
- // return sum[params.dataIndex];
- // },
- // },
- // },
- // ],
};
}
diff --git a/src/page/LDPage/TopP.tsx b/src/page/LDPage/TopP.tsx
index cc92468..5a902e6 100644
--- a/src/page/LDPage/TopP.tsx
+++ b/src/page/LDPage/TopP.tsx
@@ -1,17 +1,16 @@
import '../../lanhuapp/common.css';
import "./index.css";
import { useState } from "react";
-// import locale from 'antd/locale/zh_CN';
import dayjs from 'dayjs';
import 'dayjs/locale/zh-cn';
function TopP() {
const [time, setTime] = useState(dayjs().format('HH:mm'));
- const [date, setDate] = useState(dayjs().format('YY-MM-DD'));
+ const [date, setDate] = useState(dayjs().format('YY/MM/DD'));
const [weekday, setWeekday] = useState(dayjs().locale('zh-cn').format('dddd'));
setInterval(() => {
setTime(dayjs().format('HH:mm'));
- setDate(dayjs().format('YY-MM-DD'));
+ setDate(dayjs().format('YY/MM/DD'));
setWeekday(dayjs().locale('zh-cn').format('dddd'));
})
return (
diff --git a/src/page/LDPage/index.css b/src/page/LDPage/index.css
index 2377099..886bda1 100644
--- a/src/page/LDPage/index.css
+++ b/src/page/LDPage/index.css
@@ -257,8 +257,8 @@
right: 0px;
bottom: 0px;
z-index: 1002;
- width: 240px;
- height: 180px;
+ width: 300px;
+ height: 140px;
background: url(/public/png/lp/eq_msg_detail.png) 100% no-repeat;
background-size: 100% 100%;
color: #fff;
@@ -266,7 +266,7 @@
}
.ld_center_up .eq_detail_info .left_name {
display: inline-block;
- width: 95px;
+ width: 115px;
height: 28px;
text-align: right;
font-size: 18px;
diff --git a/src/page/LDPage/index.tsx b/src/page/LDPage/index.tsx
index 8faf5d4..8dfef36 100644
--- a/src/page/LDPage/index.tsx
+++ b/src/page/LDPage/index.tsx
@@ -3,30 +3,32 @@ import TopP from "./TopP";
import Left from "./Left";
import Right from "./Right";
import Center from "./Center";
-// import {useEffect} from 'react';
-// import {useLocation,useNavigate} from "react-router-dom";
+import {useEffect} from 'react';
+import {useLocation,useNavigate} from "react-router-dom";
function LDPage() {
- // const navigate = useNavigate();
- // const {state} = useLocation();
- // console.log("LDPage被加载了")
-// useEffect(() => {
-// const handleKeyDown = (event:any) => {
-// if (event.key === 'ArrowUp') {
-// console.log('LDPage向上键被按下');
-// navigate(`/TP/${state.LineID}`);
-// // 执行向上键的逻辑
-// } else if (event.key === 'ArrowDown') {
-// console.log('LDPage向下键被按下');
-// // 执行向下键的逻辑
-// }
-// };
+ const navigate = useNavigate();
+ const location = useLocation();
+ const LineID = location.search.split('=')[1];
+ console.log(location)
+ console.log("LDPage被加载了")
+ useEffect(() => {
+ const handleKeyDown = (event:any) => {
+ if (event.key === 'ArrowUp') {
+ console.log('LDPage向上键被按下');
+ navigate(`/LP/${LineID}`);
+ // 执行向上键的逻辑
+ } else if (event.key === 'ArrowDown') {
+ console.log('LDPage向下键被按下');
+ // 执行向下键的逻辑
+ navigate(`/LP/${LineID}`);
+ }
+ };
+ window.addEventListener('keydown', handleKeyDown);
-// window.addEventListener('keydown', handleKeyDown);
-
-// return () => {
-// window.removeEventListener('keydown', handleKeyDown);
-// };
-// }, []);
+ return () => {
+ window.removeEventListener('keydown', handleKeyDown);
+ };
+ });
return (
diff --git a/src/page/LinePage1-1/Center/CenterDown.tsx b/src/page/LinePage1-1/Center/CenterDown.tsx
index 6668fdc..23cbd13 100644
--- a/src/page/LinePage1-1/Center/CenterDown.tsx
+++ b/src/page/LinePage1-1/Center/CenterDown.tsx
@@ -1,7 +1,7 @@
import ReactECharts from "echarts-for-react";
import TitleBox from "../Component/TitleBox";
import ScrollBoard from "./../../Component/ScrollBoard";
-import SwitchButton from "../Component/SwitchButton";
+// import SwitchButton from "../Component/SwitchButton";
import { useState } from "react";
import getOptions from "../../Component/LineChart/chart.config";
import {useAppSelector} from "./../../../store/hooks"
@@ -29,10 +29,10 @@ function CenterDown() {
{ name: "周", ename: "week" },
{ name: "月", ename: "month" },
];
- const [activeName, setActiveName] = useState(nameList[0].ename);
- const handleButtonChange = (activeName: string) => {
- setActiveName(activeName);
- };
+ const [activeName, setActiveName] = useState(nameList[1].ename);
+ // const handleButtonChange = (activeName: string) => {
+ // setActiveName(activeName);
+ // };
const config = {
header: ["序号", "报警时间", "报警设备", "报警内容"],
headerHeight: 36,
@@ -41,7 +41,7 @@ function CenterDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [80, 137, 137, 137],
+ columnWidth: [80, 137, 177, 97],
data: []
};
// 报警数据
@@ -64,7 +64,7 @@ function CenterDown() {
});
}
config.data = arr
- // 产线成品率
+ // 工段成品率
// @ts-ignore
if (data.todayProductionRates && Object.keys(data.todayProductionRates).length > 0) {
// @ts-ignore
@@ -181,12 +181,12 @@ function CenterDown() {
)}
- {/* 产线成品率 */}
+ {/* 工段成品率 */}
-
*/}
{chartData.xData.length>0 && (
{
}
diff --git a/src/page/LinePage1-1/Component/TitleBox/index.tsx b/src/page/LinePage1-1/Component/TitleBox/index.tsx
index 6579889..6d654c1 100644
--- a/src/page/LinePage1-1/Component/TitleBox/index.tsx
+++ b/src/page/LinePage1-1/Component/TitleBox/index.tsx
@@ -14,12 +14,12 @@ function TitleBox(props: titleProps) {
case "left_up":
return {
img: Defect,
- title: "产线报废汇总",
+ title: "工段报废汇总",
};
case "left_down":
return {
img: Record,
- title: "当前产线报废情况",
+ title: "工序报废情况",
};
case "center_down_left":
return {
@@ -29,12 +29,12 @@ function TitleBox(props: titleProps) {
case "center_down_right":
return {
img: Finished,
- title: "产线成品率",
+ title: "工段成品率",
};
case "right_up":
return {
img: Num,
- title: "各产线总投入和产出",
+ title: "各工段总投入和产出",
};
default:
return {
diff --git a/src/page/LinePage1-1/Left/LeftDown.tsx b/src/page/LinePage1-1/Left/LeftDown.tsx
index bfa2591..fd75bc7 100644
--- a/src/page/LinePage1-1/Left/LeftDown.tsx
+++ b/src/page/LinePage1-1/Left/LeftDown.tsx
@@ -25,7 +25,7 @@ function LeftDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [73, 117, 190],
+ columnWidth: [73, 200, 107],
data: [
["1", "磨边后", 224],
["2", "包装1", 322],
@@ -40,7 +40,7 @@ function LeftDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [73, 117, 190],
+ columnWidth: [73, 200, 107],
data: [
["1", "磨边后", 1119],
["2", "包装1", 1798],
@@ -55,7 +55,7 @@ function LeftDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [73, 117, 190],
+ columnWidth: [73, 200, 107],
data: [
["1", "磨边后", 5004],
["2", "包装1", 9122],
@@ -65,7 +65,9 @@ function LeftDown() {
const color1 = ["#9DD5FF", "#1295FF"];
const color2 = ["#85F6E9", "#2EC6B4"];
// @ts-ignore
- let xData: string[] = data.scrapBars
+ let xData1: string[] = [];
+ let xData2: string[] = [];
+ let xData3: string[] = [];
let dataProps1: number[] = [];
let dataProps2: number[] = [];
let dataProps3: number[] = [];
@@ -77,9 +79,10 @@ function LeftDown() {
// @ts-ignore
data.todayProductionScraps.map((item,index)=>{
let arrInner = [];
- arrInner.push(index+1,item.sectionName,item.scrapNum);
+ arrInner.push(index+1,item.sectionName,item.scrapNum || 0);
arr1.push(arrInner);
- dataProps1.push(item.scrapNum);
+ xData1.push(item.sectionName);
+ dataProps1.push(item.scrapNum || 0);
})
}else{
dataProps1 = []
@@ -89,9 +92,10 @@ function LeftDown() {
// @ts-ignore
data.weekProductionScraps.map((item,index)=>{
let arrInner = [];
- arrInner.push(index+1,item.sectionName,item.scrapNum);
+ arrInner.push(index+1,item.sectionName,item.scrapNum || 0);
arr2.push(arrInner);
- dataProps2.push(item.scrapNum);
+ xData2.push(item.sectionName);
+ dataProps2.push(item.scrapNum || 0);
})
}else{
dataProps2 = []
@@ -101,9 +105,10 @@ function LeftDown() {
// @ts-ignore
data.monthProductionScraps.map((item,index)=>{
let arrInner = [];
- arrInner.push(index+1,item.sectionName,item.scrapNum);
+ arrInner.push(index+1,item.sectionName,item.scrapNum || 0);
arr3.push(arrInner);
- dataProps3.push(item.scrapNum);
+ xData3.push(item.sectionName);
+ dataProps3.push(item.scrapNum || 0);
})
}else{
dataProps3 = []
@@ -111,9 +116,9 @@ function LeftDown() {
configDay.data = arr1;
configWeek.data = arr2;
configMonth.data = arr3;
- const options1 = getOptions(dataProps1,xData, color1);
- const options2 = getOptions(dataProps2,xData, color2);
- const options3 = getOptions(dataProps3,xData, color1);
+ const options1 = getOptions(dataProps1,xData1, color1);
+ const options2 = getOptions(dataProps2,xData2, color2);
+ const options3 = getOptions(dataProps3,xData3, color1);
return (
diff --git a/src/page/LinePage1-1/Left/LeftUp.tsx b/src/page/LinePage1-1/Left/LeftUp.tsx
index 31d2704..6db365c 100644
--- a/src/page/LinePage1-1/Left/LeftUp.tsx
+++ b/src/page/LinePage1-1/Left/LeftUp.tsx
@@ -54,21 +54,34 @@ function LeftUp() {
})
// @ts-ignore
dataSource.day.xData = Object.keys(data.todayAllProductionScraps)
- dataSource.day.xData.map((item,index)=>{
- let sumIner = 0
+ dataSource.day.xData.sort((a,b)=>{// 保证横坐标是有序的
// @ts-ignore
- data.todayAllProductionScraps[item].map((itemInner,indexInner)=>{
- sumIner += itemInner.scrapNum
- dataSource.day.series.map((itemSeries,indexSeries)=>{
+ const lastDigitA = parseInt(a[a.length - 1], 10);
+ // @ts-ignore
+ const lastDigitB = parseInt(b[b.length - 1], 10);
+ return lastDigitA - lastDigitB;
+ })
+ for (let k = 0; k < dataSource.day.xData.length; k++) {
+ let item = dataSource.day.xData[k];
+ let sumIner = 0
+ for(let i = 0;i < dataSource.day.series.length;i++){
+ let itemSeries = dataSource.day.series[i]
+ // @ts-ignore
+ data.todayAllProductionScraps[item].map((itemInner,indexInner)=>{
// @ts-ignore
- if (itemSeries.name === itemInner.sectionName) {
+ if (itemInner.sectionName.indexOf(itemSeries.name)!==-1) {
// @ts-ignore
- itemSeries.data.push(itemInner.scrapNum)
+ itemSeries.data.push(itemInner.scrapNum || 0)
+ sumIner += itemInner.scrapNum || 0
+ return
}
})
- })
+ if (itemSeries.data.length === k) {
+ itemSeries.data.push(0)
+ }
+ }
sum.push(sumIner)
- })
+ }
dataSource.day.series.push({
data: sum,
type: "bar",
@@ -109,21 +122,34 @@ function LeftUp() {
})
// @ts-ignore
dataSource.week.xData = Object.keys(data.weekAllProductionScraps)
- dataSource.week.xData.map((item,index)=>{
- let sumIner = 0
+ dataSource.week.xData.sort((a,b)=>{// 保证横坐标是有序的
// @ts-ignore
- data.weekAllProductionScraps[item].map((itemInner,indexInner)=>{
- sumIner += itemInner.scrapNum
- dataSource.week.series.map((itemSeries,indexSeries)=>{
+ const lastDigitA = parseInt(a[a.length - 1], 10);
+ // @ts-ignore
+ const lastDigitB = parseInt(b[b.length - 1], 10);
+ return lastDigitA - lastDigitB;
+ })
+ for (let k = 0; k < dataSource.week.xData.length; k++) {
+ let item = dataSource.week.xData[k];
+ let sumIner = 0
+ for(let i = 0;i < dataSource.week.series.length;i++){
+ let itemSeries = dataSource.week.series[i]
+ // @ts-ignore
+ data.weekAllProductionScraps[item].map((itemInner,indexInner)=>{
// @ts-ignore
- if (itemSeries.name === itemInner.sectionName) {
+ if (itemInner.sectionName.indexOf(itemSeries.name)!==-1) {
// @ts-ignore
- itemSeries.data.push(itemInner.scrapNum)
+ itemSeries.data.push(itemInner.scrapNum || 0)
+ sumIner += itemInner.scrapNum || 0
+ return
}
})
- })
+ if (itemSeries.data.length === k) {
+ itemSeries.data.push(0)
+ }
+ }
sum.push(sumIner)
- })
+ }
dataSource.week.series.push({
data: sum,
type: "bar",
@@ -164,21 +190,34 @@ function LeftUp() {
})
// @ts-ignore
dataSource.month.xData = Object.keys(data.monthAllProductionScraps)
- dataSource.month.xData.map((item,index)=>{
- let sumIner = 0
+ dataSource.month.xData.sort((a,b)=>{// 保证横坐标是有序的
// @ts-ignore
- data.monthAllProductionScraps[item].map((itemInner,indexInner)=>{
- sumIner += itemInner.scrapNum
- dataSource.month.series.map((itemSeries,indexSeries)=>{
+ const lastDigitA = parseInt(a[a.length - 1], 10);
+ // @ts-ignore
+ const lastDigitB = parseInt(b[b.length - 1], 10);
+ return lastDigitA - lastDigitB;
+ })
+ for (let k = 0; k < dataSource.month.xData.length; k++) {
+ let item = dataSource.month.xData[k];
+ let sumIner = 0
+ for(let i = 0;i < dataSource.month.series.length;i++){
+ let itemSeries = dataSource.month.series[i]
+ // @ts-ignore
+ data.monthAllProductionScraps[item].map((itemInner,indexInner)=>{
// @ts-ignore
- if (itemSeries.name === itemInner.sectionName) {
+ if (itemInner.sectionName.indexOf(itemSeries.name)!==-1) {
// @ts-ignore
- itemSeries.data.push(itemInner.scrapNum)
+ itemSeries.data.push(itemInner.scrapNum || 0)
+ sumIner += itemInner.scrapNum || 0
+ return
}
})
- })
+ if (itemSeries.data.length === k) {
+ itemSeries.data.push(0)
+ }
+ }
sum.push(sumIner)
- })
+ }
dataSource.month.series.push({
data: sum,
type: "bar",
@@ -198,6 +237,7 @@ function LeftUp() {
dataSource.month.series = []
}
const options = getOptions(chartData);
+ console.log('dataSource',dataSource)
return (
diff --git a/src/page/LinePage1-1/Right/RightDown.tsx b/src/page/LinePage1-1/Right/RightDown.tsx
index 8e93f80..4a271c2 100644
--- a/src/page/LinePage1-1/Right/RightDown.tsx
+++ b/src/page/LinePage1-1/Right/RightDown.tsx
@@ -101,7 +101,7 @@ function RightDown() {
let arrInner = [];
arrInner.push(dayjs(item.recTime).format("YYYY/MM/DD"),item.inputNum,item.outputNum);
arr2.push(arrInner);
- tempData[1].data.time.push(dayjs(item.recTime).format("HH:mm"));
+ tempData[1].data.time.push(dayjs(item.recTime).format("MM.DD"));
tempData[1].data.input.push(item.inputNum);
tempData[1].data.output.push(item.outputNum);
})
@@ -117,7 +117,7 @@ function RightDown() {
let arrInner = [];
arrInner.push(dayjs(item.recTime).format("YYYY/MM/DD"),item.inputNum,item.outputNum);
arr3.push(arrInner);
- tempData[2].data.time.push(dayjs(item.recTime).format("HH:mm"));
+ tempData[2].data.time.push(dayjs(item.recTime).format("MM.DD"));
tempData[2].data.input.push(item.inputNum);
tempData[2].data.output.push(item.outputNum);
})
diff --git a/src/page/LinePage1-1/Right/RightUp.tsx b/src/page/LinePage1-1/Right/RightUp.tsx
index a7d1a46..a106318 100644
--- a/src/page/LinePage1-1/Right/RightUp.tsx
+++ b/src/page/LinePage1-1/Right/RightUp.tsx
@@ -12,14 +12,14 @@ function RightUp() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [70, 90, 106, 114],
+ columnWidth: [55, 115, 100, 110],
data: [],
};
let arr:any = []
// @ts-ignore
- if (data.sumProductionDets && data.sumProductionDets.length > 0) {
+ if (data.sectionDet && data.sectionDet.length > 0) {
// @ts-ignore
- data.sumProductionDets.map((item, index) => {
+ data.sectionDet.map((item, index) => {
let arrInner = []
arrInner.push(index + 1, item.lineName, item.inputNum, item.outputNum)
arr.push(arrInner)
diff --git a/src/page/LinePage1-1/index.css b/src/page/LinePage1-1/index.css
index 1a28491..30fbd19 100644
--- a/src/page/LinePage1-1/index.css
+++ b/src/page/LinePage1-1/index.css
@@ -100,7 +100,7 @@
.center_down .right_box .chart_box {
width: 100%;
height: 310px;
- margin-top: 10px;
+ margin-top: 5px;
}
.right_up {
width: 401px;
@@ -230,7 +230,7 @@
right: 0px;
bottom: 0px;
z-index: 1002;
- width: 240px;
+ width: 270px;
height: 110px;
background: url(/public/png/lp/eq_msg_detail.png) 100% no-repeat;
background-size: 100% 100%;
diff --git a/src/page/LinePage1-1/index.tsx b/src/page/LinePage1-1/index.tsx
index daf9389..e9f97a1 100644
--- a/src/page/LinePage1-1/index.tsx
+++ b/src/page/LinePage1-1/index.tsx
@@ -3,7 +3,27 @@ import TopP from "./TopP";
import Left from "./Left";
import Right from "./Right";
import Center from "./Center";
+import {useEffect} from 'react';
+import {useNavigate} from "react-router-dom";
function LinePage() {
+ const navigate = useNavigate();
+ useEffect(() => {
+ const handleKeyDown = (event:any) => {
+ if (event.key === 'ArrowUp') {
+ console.log('LDPage向上键被按下');
+ navigate('/LD?lineId=1-1');
+ // 执行向上键的逻辑
+ } else if (event.key === 'ArrowDown') {
+ console.log('LDPage向下键被按下');
+ // 执行向下键的逻辑
+ navigate('/LD?lineId=1-1');
+ }
+ }
+ window.addEventListener('keydown', handleKeyDown);
+ return () => {
+ window.removeEventListener('keydown', handleKeyDown);
+ };
+ });
return (
diff --git a/src/page/LinePage1-2/Center/CenterDown.tsx b/src/page/LinePage1-2/Center/CenterDown.tsx
index 01a4c64..096ed9a 100644
--- a/src/page/LinePage1-2/Center/CenterDown.tsx
+++ b/src/page/LinePage1-2/Center/CenterDown.tsx
@@ -1,7 +1,7 @@
import ReactECharts from "echarts-for-react";
import TitleBox from "../Component/TitleBox";
import ScrollBoard from "./../../Component/ScrollBoard";
-import SwitchButton from "../Component/SwitchButton";
+// import SwitchButton from "../Component/SwitchButton";
import { useState } from "react";
import getOptions from "../../Component/LineChart/chart.config";
import {useAppSelector} from "./../../../store/hooks"
@@ -29,10 +29,10 @@ function CenterDown() {
{ name: "周", ename: "week" },
{ name: "月", ename: "month" },
];
- const [activeName, setActiveName] = useState(nameList[0].ename);
- const handleButtonChange = (activeName: string) => {
- setActiveName(activeName);
- };
+ const [activeName, setActiveName] = useState(nameList[1].ename);
+ // const handleButtonChange = (activeName: string) => {
+ // setActiveName(activeName);
+ // };
const config = {
header: ["序号", "报警时间", "报警设备", "报警内容"],
headerHeight: 36,
@@ -41,7 +41,7 @@ function CenterDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [80, 137, 137, 137],
+ columnWidth: [80, 137, 177, 97],
data: []
};
// 报警数据
@@ -64,7 +64,7 @@ function CenterDown() {
});
}
config.data = arr
- // 产线成品率
+ // 工段成品率
// @ts-ignore
if (data.todayProductionRates && Object.keys(data.todayProductionRates).length > 0) {
// @ts-ignore
@@ -181,12 +181,12 @@ function CenterDown() {
)}
- {/* 产线成品率 */}
+ {/* 工段成品率 */}
-
*/}
{chartData.xData.length>0 && (
{
}
diff --git a/src/page/LinePage1-2/Component/TitleBox/index.tsx b/src/page/LinePage1-2/Component/TitleBox/index.tsx
index 6579889..6d654c1 100644
--- a/src/page/LinePage1-2/Component/TitleBox/index.tsx
+++ b/src/page/LinePage1-2/Component/TitleBox/index.tsx
@@ -14,12 +14,12 @@ function TitleBox(props: titleProps) {
case "left_up":
return {
img: Defect,
- title: "产线报废汇总",
+ title: "工段报废汇总",
};
case "left_down":
return {
img: Record,
- title: "当前产线报废情况",
+ title: "工序报废情况",
};
case "center_down_left":
return {
@@ -29,12 +29,12 @@ function TitleBox(props: titleProps) {
case "center_down_right":
return {
img: Finished,
- title: "产线成品率",
+ title: "工段成品率",
};
case "right_up":
return {
img: Num,
- title: "各产线总投入和产出",
+ title: "各工段总投入和产出",
};
default:
return {
diff --git a/src/page/LinePage1-2/Left/LeftDown.tsx b/src/page/LinePage1-2/Left/LeftDown.tsx
index 9100416..fe86b1f 100644
--- a/src/page/LinePage1-2/Left/LeftDown.tsx
+++ b/src/page/LinePage1-2/Left/LeftDown.tsx
@@ -25,7 +25,7 @@ function LeftDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [73, 117, 190],
+ columnWidth: [73, 200, 107],
data: [
["1", "磨边后", 224],
["2", "包装1", 322],
@@ -40,7 +40,7 @@ function LeftDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [73, 117, 190],
+ columnWidth: [73, 200, 107],
data: [
["1", "磨边后", 1119],
["2", "包装1", 1798],
@@ -55,7 +55,7 @@ function LeftDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [73, 117, 190],
+ columnWidth: [73, 200, 107],
data: [
["1", "磨边后", 5004],
["2", "包装1", 9122],
@@ -65,7 +65,9 @@ function LeftDown() {
const color1 = ["#9DD5FF", "#1295FF"];
const color2 = ["#85F6E9", "#2EC6B4"];
// @ts-ignore
- let xData: string[] = data.scrapBars
+ let xData1: string[] = [];
+ let xData2: string[] = [];
+ let xData3: string[] = [];
let dataProps1: number[] = [];
let dataProps2: number[] = [];
let dataProps3: number[] = [];
@@ -77,9 +79,10 @@ function LeftDown() {
// @ts-ignore
data.todayProductionScraps.map((item,index)=>{
let arrInner = [];
- arrInner.push(index+1,item.sectionName,item.scrapNum);
+ arrInner.push(index+1,item.sectionName,item.scrapNum || 0);
arr1.push(arrInner);
- dataProps1.push(item.scrapNum);
+ xData1.push(item.sectionName);
+ dataProps1.push(item.scrapNum || 0);
})
}else{
dataProps1 = []
@@ -89,9 +92,10 @@ function LeftDown() {
// @ts-ignore
data.weekProductionScraps.map((item,index)=>{
let arrInner = [];
- arrInner.push(index+1,item.sectionName,item.scrapNum);
+ arrInner.push(index+1,item.sectionName,item.scrapNum || 0);
arr2.push(arrInner);
- dataProps2.push(item.scrapNum);
+ xData2.push(item.sectionName);
+ dataProps2.push(item.scrapNum || 0);
})
}else{
dataProps2 = []
@@ -101,9 +105,10 @@ function LeftDown() {
// @ts-ignore
data.monthProductionScraps.map((item,index)=>{
let arrInner = [];
- arrInner.push(index+1,item.sectionName,item.scrapNum);
+ arrInner.push(index+1,item.sectionName,item.scrapNum || 0);
arr3.push(arrInner);
- dataProps3.push(item.scrapNum);
+ xData3.push(item.sectionName);
+ dataProps3.push(item.scrapNum || 0);
})
}else{
dataProps3 = []
@@ -111,9 +116,9 @@ function LeftDown() {
configDay.data = arr1;
configWeek.data = arr2;
configMonth.data = arr3;
- const options1 = getOptions(dataProps1,xData, color1);
- const options2 = getOptions(dataProps2,xData, color2);
- const options3 = getOptions(dataProps3,xData, color1);
+ const options1 = getOptions(dataProps1,xData1, color1);
+ const options2 = getOptions(dataProps2,xData2, color2);
+ const options3 = getOptions(dataProps3,xData3, color1);
return (
diff --git a/src/page/LinePage1-2/Left/LeftUp.tsx b/src/page/LinePage1-2/Left/LeftUp.tsx
index 166326d..52bec78 100644
--- a/src/page/LinePage1-2/Left/LeftUp.tsx
+++ b/src/page/LinePage1-2/Left/LeftUp.tsx
@@ -54,21 +54,34 @@ function LeftUp() {
})
// @ts-ignore
dataSource.day.xData = Object.keys(data.todayAllProductionScraps)
- dataSource.day.xData.map((item,index)=>{
- let sumIner = 0
+ dataSource.day.xData.sort((a,b)=>{// 保证横坐标是有序的
// @ts-ignore
- data.todayAllProductionScraps[item].map((itemInner,indexInner)=>{
- sumIner += itemInner.scrapNum
- dataSource.day.series.map((itemSeries,indexSeries)=>{
+ const lastDigitA = parseInt(a[a.length - 1], 10);
+ // @ts-ignore
+ const lastDigitB = parseInt(b[b.length - 1], 10);
+ return lastDigitA - lastDigitB;
+ })
+ for (let k = 0; k < dataSource.day.xData.length; k++) {
+ let item = dataSource.day.xData[k];
+ let sumIner = 0
+ for(let i = 0;i < dataSource.day.series.length;i++){
+ let itemSeries = dataSource.day.series[i]
+ // @ts-ignore
+ data.todayAllProductionScraps[item].map((itemInner,indexInner)=>{
// @ts-ignore
- if (itemSeries.name === itemInner.sectionName) {
+ if (itemInner.sectionName.indexOf(itemSeries.name)!==-1) {
// @ts-ignore
- itemSeries.data.push(itemInner.scrapNum)
+ itemSeries.data.push(itemInner.scrapNum || 0)
+ sumIner += itemInner.scrapNum || 0
+ return
}
})
- })
+ if (itemSeries.data.length === k) {
+ itemSeries.data.push(0)
+ }
+ }
sum.push(sumIner)
- })
+ }
dataSource.day.series.push({
data: sum,
type: "bar",
@@ -109,21 +122,34 @@ function LeftUp() {
})
// @ts-ignore
dataSource.week.xData = Object.keys(data.weekAllProductionScraps)
- dataSource.week.xData.map((item,index)=>{
- let sumIner = 0
+ dataSource.week.xData.sort((a,b)=>{// 保证横坐标是有序的
// @ts-ignore
- data.weekAllProductionScraps[item].map((itemInner,indexInner)=>{
- sumIner += itemInner.scrapNum
- dataSource.week.series.map((itemSeries,indexSeries)=>{
+ const lastDigitA = parseInt(a[a.length - 1], 10);
+ // @ts-ignore
+ const lastDigitB = parseInt(b[b.length - 1], 10);
+ return lastDigitA - lastDigitB;
+ })
+ for (let k = 0; k < dataSource.week.xData.length; k++) {
+ let item = dataSource.week.xData[k];
+ let sumIner = 0
+ for(let i = 0;i < dataSource.week.series.length;i++){
+ let itemSeries = dataSource.week.series[i]
+ // @ts-ignore
+ data.weekAllProductionScraps[item].map((itemInner,indexInner)=>{
// @ts-ignore
- if (itemSeries.name === itemInner.sectionName) {
+ if (itemInner.sectionName.indexOf(itemSeries.name)!==-1) {
// @ts-ignore
- itemSeries.data.push(itemInner.scrapNum)
+ itemSeries.data.push(itemInner.scrapNum || 0)
+ sumIner += itemInner.scrapNum || 0
+ return
}
})
- })
+ if (itemSeries.data.length === k) {
+ itemSeries.data.push(0)
+ }
+ }
sum.push(sumIner)
- })
+ }
dataSource.week.series.push({
data: sum,
type: "bar",
@@ -164,21 +190,34 @@ function LeftUp() {
})
// @ts-ignore
dataSource.month.xData = Object.keys(data.monthAllProductionScraps)
- dataSource.month.xData.map((item,index)=>{
- let sumIner = 0
+ dataSource.month.xData.sort((a,b)=>{// 保证横坐标是有序的
// @ts-ignore
- data.monthAllProductionScraps[item].map((itemInner,indexInner)=>{
- sumIner += itemInner.scrapNum
- dataSource.month.series.map((itemSeries,indexSeries)=>{
+ const lastDigitA = parseInt(a[a.length - 1], 10);
+ // @ts-ignore
+ const lastDigitB = parseInt(b[b.length - 1], 10);
+ return lastDigitA - lastDigitB;
+ })
+ for (let k = 0; k < dataSource.month.xData.length; k++) {
+ let item = dataSource.month.xData[k];
+ let sumIner = 0
+ for(let i = 0;i < dataSource.month.series.length;i++){
+ let itemSeries = dataSource.month.series[i]
+ // @ts-ignore
+ data.monthAllProductionScraps[item].map((itemInner,indexInner)=>{
// @ts-ignore
- if (itemSeries.name === itemInner.sectionName) {
+ if (itemInner.sectionName.indexOf(itemSeries.name)!==-1) {
// @ts-ignore
- itemSeries.data.push(itemInner.scrapNum)
+ itemSeries.data.push(itemInner.scrapNum || 0)
+ sumIner += itemInner.scrapNum || 0
+ return
}
})
- })
+ if (itemSeries.data.length === k) {
+ itemSeries.data.push(0)
+ }
+ }
sum.push(sumIner)
- })
+ }
dataSource.month.series.push({
data: sum,
type: "bar",
@@ -198,6 +237,7 @@ function LeftUp() {
dataSource.month.series = []
}
const options = getOptions(chartData);
+ console.log('dataSource',dataSource)
return (
diff --git a/src/page/LinePage1-2/Right/RightDown.tsx b/src/page/LinePage1-2/Right/RightDown.tsx
index a40b34e..7077534 100644
--- a/src/page/LinePage1-2/Right/RightDown.tsx
+++ b/src/page/LinePage1-2/Right/RightDown.tsx
@@ -101,7 +101,7 @@ function RightDown() {
let arrInner = [];
arrInner.push(dayjs(item.recTime).format("YYYY/MM/DD"),item.inputNum,item.outputNum);
arr2.push(arrInner);
- tempData[1].data.time.push(dayjs(item.recTime).format("HH:mm"));
+ tempData[1].data.time.push(dayjs(item.recTime).format("MM.DD"));
tempData[1].data.input.push(item.inputNum);
tempData[1].data.output.push(item.outputNum);
})
@@ -117,7 +117,7 @@ function RightDown() {
let arrInner = [];
arrInner.push(dayjs(item.recTime).format("YYYY/MM/DD"),item.inputNum,item.outputNum);
arr3.push(arrInner);
- tempData[2].data.time.push(dayjs(item.recTime).format("HH:mm"));
+ tempData[2].data.time.push(dayjs(item.recTime).format("MM.DD"));
tempData[2].data.input.push(item.inputNum);
tempData[2].data.output.push(item.outputNum);
})
diff --git a/src/page/LinePage1-2/Right/RightUp.tsx b/src/page/LinePage1-2/Right/RightUp.tsx
index c01c7be..2ec53b8 100644
--- a/src/page/LinePage1-2/Right/RightUp.tsx
+++ b/src/page/LinePage1-2/Right/RightUp.tsx
@@ -12,14 +12,14 @@ function RightUp() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [70, 90, 106, 114],
+ columnWidth: [55, 115, 100, 110],
data: [],
};
let arr:any = []
// @ts-ignore
- if (data.sumProductionDets && data.sumProductionDets.length > 0) {
+ if (data.sectionDet && data.sectionDet.length > 0) {
// @ts-ignore
- data.sumProductionDets.map((item, index) => {
+ data.sectionDet.map((item, index) => {
let arrInner = []
arrInner.push(index + 1, item.lineName, item.inputNum, item.outputNum)
arr.push(arrInner)
diff --git a/src/page/LinePage1-2/index.tsx b/src/page/LinePage1-2/index.tsx
index daf9389..425a1d9 100644
--- a/src/page/LinePage1-2/index.tsx
+++ b/src/page/LinePage1-2/index.tsx
@@ -3,7 +3,27 @@ import TopP from "./TopP";
import Left from "./Left";
import Right from "./Right";
import Center from "./Center";
+import {useEffect} from 'react';
+import {useNavigate} from "react-router-dom";
function LinePage() {
+ const navigate = useNavigate();
+ useEffect(() => {
+ const handleKeyDown = (event:any) => {
+ if (event.key === 'ArrowUp') {
+ console.log('LDPage向上键被按下');
+ navigate('/LD?lineId=1-2');
+ // 执行向上键的逻辑
+ } else if (event.key === 'ArrowDown') {
+ console.log('LDPage向下键被按下');
+ // 执行向下键的逻辑
+ navigate('/LD?lineId=1-2');
+ }
+ }
+ window.addEventListener('keydown', handleKeyDown);
+ return () => {
+ window.removeEventListener('keydown', handleKeyDown);
+ };
+ });
return (
diff --git a/src/page/LinePage2-1/Center/CenterDown.tsx b/src/page/LinePage2-1/Center/CenterDown.tsx
index 52e20c8..b1f2fa3 100644
--- a/src/page/LinePage2-1/Center/CenterDown.tsx
+++ b/src/page/LinePage2-1/Center/CenterDown.tsx
@@ -1,7 +1,7 @@
import ReactECharts from "echarts-for-react";
import TitleBox from "../Component/TitleBox";
import ScrollBoard from "./../../Component/ScrollBoard";
-import SwitchButton from "../Component/SwitchButton";
+// import SwitchButton from "../Component/SwitchButton";
import { useState } from "react";
import getOptions from "../../Component/LineChart/chart.config";
import {useAppSelector} from "./../../../store/hooks"
@@ -29,10 +29,10 @@ function CenterDown() {
{ name: "周", ename: "week" },
{ name: "月", ename: "month" },
];
- const [activeName, setActiveName] = useState(nameList[0].ename);
- const handleButtonChange = (activeName: string) => {
- setActiveName(activeName);
- };
+ const [activeName, setActiveName] = useState(nameList[1].ename);
+ // const handleButtonChange = (activeName: string) => {
+ // setActiveName(activeName);
+ // };
const config = {
header: ["序号", "报警时间", "报警设备", "报警内容"],
headerHeight: 36,
@@ -41,7 +41,7 @@ function CenterDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [80, 137, 137, 137],
+ columnWidth: [80, 137, 177, 97],
data: []
};
// 报警数据
@@ -64,7 +64,7 @@ function CenterDown() {
});
}
config.data = arr
- // 产线成品率
+ // 工段成品率
// @ts-ignore
if (data.todayProductionRates && Object.keys(data.todayProductionRates).length > 0) {
// @ts-ignore
@@ -181,12 +181,12 @@ function CenterDown() {
)}
- {/* 产线成品率 */}
+ {/* 工段成品率 */}
-
*/}
{chartData.xData.length>0 && (
{
}
diff --git a/src/page/LinePage2-1/Component/TitleBox/index.tsx b/src/page/LinePage2-1/Component/TitleBox/index.tsx
index 6579889..6d654c1 100644
--- a/src/page/LinePage2-1/Component/TitleBox/index.tsx
+++ b/src/page/LinePage2-1/Component/TitleBox/index.tsx
@@ -14,12 +14,12 @@ function TitleBox(props: titleProps) {
case "left_up":
return {
img: Defect,
- title: "产线报废汇总",
+ title: "工段报废汇总",
};
case "left_down":
return {
img: Record,
- title: "当前产线报废情况",
+ title: "工序报废情况",
};
case "center_down_left":
return {
@@ -29,12 +29,12 @@ function TitleBox(props: titleProps) {
case "center_down_right":
return {
img: Finished,
- title: "产线成品率",
+ title: "工段成品率",
};
case "right_up":
return {
img: Num,
- title: "各产线总投入和产出",
+ title: "各工段总投入和产出",
};
default:
return {
diff --git a/src/page/LinePage2-1/Left/LeftDown.tsx b/src/page/LinePage2-1/Left/LeftDown.tsx
index f829d78..b62d984 100644
--- a/src/page/LinePage2-1/Left/LeftDown.tsx
+++ b/src/page/LinePage2-1/Left/LeftDown.tsx
@@ -25,7 +25,7 @@ function LeftDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [73, 117, 190],
+ columnWidth: [73, 200, 107],
data: [
["1", "磨边后", 224],
["2", "包装1", 322],
@@ -40,7 +40,7 @@ function LeftDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [73, 117, 190],
+ columnWidth: [73, 200, 107],
data: [
["1", "磨边后", 1119],
["2", "包装1", 1798],
@@ -55,7 +55,7 @@ function LeftDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [73, 117, 190],
+ columnWidth: [73, 200, 107],
data: [
["1", "磨边后", 5004],
["2", "包装1", 9122],
@@ -65,7 +65,9 @@ function LeftDown() {
const color1 = ["#9DD5FF", "#1295FF"];
const color2 = ["#85F6E9", "#2EC6B4"];
// @ts-ignore
- let xData: string[] = data.scrapBars
+ let xData1: string[] = [];
+ let xData2: string[] = [];
+ let xData3: string[] = [];
let dataProps1: number[] = [];
let dataProps2: number[] = [];
let dataProps3: number[] = [];
@@ -77,9 +79,10 @@ function LeftDown() {
// @ts-ignore
data.todayProductionScraps.map((item,index)=>{
let arrInner = [];
- arrInner.push(index+1,item.sectionName,item.scrapNum);
+ arrInner.push(index+1,item.sectionName,item.scrapNum || 0);
arr1.push(arrInner);
- dataProps1.push(item.scrapNum);
+ xData1.push(item.sectionName);
+ dataProps1.push(item.scrapNum || 0);
})
}else{
dataProps1 = []
@@ -89,9 +92,10 @@ function LeftDown() {
// @ts-ignore
data.weekProductionScraps.map((item,index)=>{
let arrInner = [];
- arrInner.push(index+1,item.sectionName,item.scrapNum);
+ arrInner.push(index+1,item.sectionName,item.scrapNum || 0);
arr2.push(arrInner);
- dataProps2.push(item.scrapNum);
+ xData2.push(item.sectionName);
+ dataProps2.push(item.scrapNum || 0);
})
}else{
dataProps2 = []
@@ -101,9 +105,10 @@ function LeftDown() {
// @ts-ignore
data.monthProductionScraps.map((item,index)=>{
let arrInner = [];
- arrInner.push(index+1,item.sectionName,item.scrapNum);
+ arrInner.push(index+1,item.sectionName,item.scrapNum || 0);
arr3.push(arrInner);
- dataProps3.push(item.scrapNum);
+ xData3.push(item.sectionName);
+ dataProps3.push(item.scrapNum || 0);
})
}else{
dataProps3 = []
@@ -111,9 +116,9 @@ function LeftDown() {
configDay.data = arr1;
configWeek.data = arr2;
configMonth.data = arr3;
- const options1 = getOptions(dataProps1,xData, color1);
- const options2 = getOptions(dataProps2,xData, color2);
- const options3 = getOptions(dataProps3,xData, color1);
+ const options1 = getOptions(dataProps1,xData1, color1);
+ const options2 = getOptions(dataProps2,xData2, color2);
+ const options3 = getOptions(dataProps3,xData3, color1);
return (
diff --git a/src/page/LinePage2-1/Left/LeftUp.tsx b/src/page/LinePage2-1/Left/LeftUp.tsx
index 19a3904..cf25aac 100644
--- a/src/page/LinePage2-1/Left/LeftUp.tsx
+++ b/src/page/LinePage2-1/Left/LeftUp.tsx
@@ -54,21 +54,34 @@ function LeftUp() {
})
// @ts-ignore
dataSource.day.xData = Object.keys(data.todayAllProductionScraps)
- dataSource.day.xData.map((item,index)=>{
- let sumIner = 0
+ dataSource.day.xData.sort((a,b)=>{// 保证横坐标是有序的
// @ts-ignore
- data.todayAllProductionScraps[item].map((itemInner,indexInner)=>{
- sumIner += itemInner.scrapNum
- dataSource.day.series.map((itemSeries,indexSeries)=>{
+ const lastDigitA = parseInt(a[a.length - 1], 10);
+ // @ts-ignore
+ const lastDigitB = parseInt(b[b.length - 1], 10);
+ return lastDigitA - lastDigitB;
+ })
+ for (let k = 0; k < dataSource.day.xData.length; k++) {
+ let item = dataSource.day.xData[k];
+ let sumIner = 0
+ for(let i = 0;i < dataSource.day.series.length;i++){
+ let itemSeries = dataSource.day.series[i]
+ // @ts-ignore
+ data.todayAllProductionScraps[item].map((itemInner,indexInner)=>{
// @ts-ignore
- if (itemSeries.name === itemInner.sectionName) {
+ if (itemInner.sectionName.indexOf(itemSeries.name)!==-1) {
// @ts-ignore
- itemSeries.data.push(itemInner.scrapNum)
+ itemSeries.data.push(itemInner.scrapNum || 0)
+ sumIner += itemInner.scrapNum || 0
+ return
}
})
- })
+ if (itemSeries.data.length === k) {
+ itemSeries.data.push(0)
+ }
+ }
sum.push(sumIner)
- })
+ }
dataSource.day.series.push({
data: sum,
type: "bar",
@@ -109,21 +122,34 @@ function LeftUp() {
})
// @ts-ignore
dataSource.week.xData = Object.keys(data.weekAllProductionScraps)
- dataSource.week.xData.map((item,index)=>{
- let sumIner = 0
+ dataSource.week.xData.sort((a,b)=>{// 保证横坐标是有序的
// @ts-ignore
- data.weekAllProductionScraps[item].map((itemInner,indexInner)=>{
- sumIner += itemInner.scrapNum
- dataSource.week.series.map((itemSeries,indexSeries)=>{
+ const lastDigitA = parseInt(a[a.length - 1], 10);
+ // @ts-ignore
+ const lastDigitB = parseInt(b[b.length - 1], 10);
+ return lastDigitA - lastDigitB;
+ })
+ for (let k = 0; k < dataSource.week.xData.length; k++) {
+ let item = dataSource.week.xData[k];
+ let sumIner = 0
+ for(let i = 0;i < dataSource.week.series.length;i++){
+ let itemSeries = dataSource.week.series[i]
+ // @ts-ignore
+ data.weekAllProductionScraps[item].map((itemInner,indexInner)=>{
// @ts-ignore
- if (itemSeries.name === itemInner.sectionName) {
+ if (itemInner.sectionName.indexOf(itemSeries.name)!==-1) {
// @ts-ignore
- itemSeries.data.push(itemInner.scrapNum)
+ itemSeries.data.push(itemInner.scrapNum || 0)
+ sumIner += itemInner.scrapNum || 0
+ return
}
})
- })
+ if (itemSeries.data.length === k) {
+ itemSeries.data.push(0)
+ }
+ }
sum.push(sumIner)
- })
+ }
dataSource.week.series.push({
data: sum,
type: "bar",
@@ -164,21 +190,34 @@ function LeftUp() {
})
// @ts-ignore
dataSource.month.xData = Object.keys(data.monthAllProductionScraps)
- dataSource.month.xData.map((item,index)=>{
- let sumIner = 0
+ dataSource.month.xData.sort((a,b)=>{// 保证横坐标是有序的
// @ts-ignore
- data.monthAllProductionScraps[item].map((itemInner,indexInner)=>{
- sumIner += itemInner.scrapNum
- dataSource.month.series.map((itemSeries,indexSeries)=>{
+ const lastDigitA = parseInt(a[a.length - 1], 10);
+ // @ts-ignore
+ const lastDigitB = parseInt(b[b.length - 1], 10);
+ return lastDigitA - lastDigitB;
+ })
+ for (let k = 0; k < dataSource.month.xData.length; k++) {
+ let item = dataSource.month.xData[k];
+ let sumIner = 0
+ for(let i = 0;i < dataSource.month.series.length;i++){
+ let itemSeries = dataSource.month.series[i]
+ // @ts-ignore
+ data.monthAllProductionScraps[item].map((itemInner,indexInner)=>{
// @ts-ignore
- if (itemSeries.name === itemInner.sectionName) {
+ if (itemInner.sectionName.indexOf(itemSeries.name)!==-1) {
// @ts-ignore
- itemSeries.data.push(itemInner.scrapNum)
+ itemSeries.data.push(itemInner.scrapNum || 0)
+ sumIner += itemInner.scrapNum || 0
+ return
}
})
- })
+ if (itemSeries.data.length === k) {
+ itemSeries.data.push(0)
+ }
+ }
sum.push(sumIner)
- })
+ }
dataSource.month.series.push({
data: sum,
type: "bar",
@@ -198,6 +237,7 @@ function LeftUp() {
dataSource.month.series = []
}
const options = getOptions(chartData);
+ console.log('dataSource',dataSource)
return (
diff --git a/src/page/LinePage2-1/Right/RightDown.tsx b/src/page/LinePage2-1/Right/RightDown.tsx
index b87fb9b..36c7bf7 100644
--- a/src/page/LinePage2-1/Right/RightDown.tsx
+++ b/src/page/LinePage2-1/Right/RightDown.tsx
@@ -101,7 +101,7 @@ function RightDown() {
let arrInner = [];
arrInner.push(dayjs(item.recTime).format("YYYY/MM/DD"),item.inputNum,item.outputNum);
arr2.push(arrInner);
- tempData[1].data.time.push(dayjs(item.recTime).format("HH:mm"));
+ tempData[1].data.time.push(dayjs(item.recTime).format("MM.DD"));
tempData[1].data.input.push(item.inputNum);
tempData[1].data.output.push(item.outputNum);
})
@@ -117,7 +117,7 @@ function RightDown() {
let arrInner = [];
arrInner.push(dayjs(item.recTime).format("YYYY/MM/DD"),item.inputNum,item.outputNum);
arr3.push(arrInner);
- tempData[2].data.time.push(dayjs(item.recTime).format("HH:mm"));
+ tempData[2].data.time.push(dayjs(item.recTime).format("MM.DD"));
tempData[2].data.input.push(item.inputNum);
tempData[2].data.output.push(item.outputNum);
})
diff --git a/src/page/LinePage2-1/Right/RightUp.tsx b/src/page/LinePage2-1/Right/RightUp.tsx
index d3c4b67..4bc5913 100644
--- a/src/page/LinePage2-1/Right/RightUp.tsx
+++ b/src/page/LinePage2-1/Right/RightUp.tsx
@@ -12,14 +12,14 @@ function RightUp() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [70, 90, 106, 114],
+ columnWidth: [55, 115, 100, 110],
data: [],
};
let arr:any = []
// @ts-ignore
- if (data.sumProductionDets && data.sumProductionDets.length > 0) {
+ if (data.sectionDet && data.sectionDet.length > 0) {
// @ts-ignore
- data.sumProductionDets.map((item, index) => {
+ data.sectionDet.map((item, index) => {
let arrInner = []
arrInner.push(index + 1, item.lineName, item.inputNum, item.outputNum)
arr.push(arrInner)
diff --git a/src/page/LinePage2-1/index.css b/src/page/LinePage2-1/index.css
index 1a28491..30fbd19 100644
--- a/src/page/LinePage2-1/index.css
+++ b/src/page/LinePage2-1/index.css
@@ -100,7 +100,7 @@
.center_down .right_box .chart_box {
width: 100%;
height: 310px;
- margin-top: 10px;
+ margin-top: 5px;
}
.right_up {
width: 401px;
@@ -230,7 +230,7 @@
right: 0px;
bottom: 0px;
z-index: 1002;
- width: 240px;
+ width: 270px;
height: 110px;
background: url(/public/png/lp/eq_msg_detail.png) 100% no-repeat;
background-size: 100% 100%;
diff --git a/src/page/LinePage2-1/index.tsx b/src/page/LinePage2-1/index.tsx
index daf9389..bebcf33 100644
--- a/src/page/LinePage2-1/index.tsx
+++ b/src/page/LinePage2-1/index.tsx
@@ -3,7 +3,27 @@ import TopP from "./TopP";
import Left from "./Left";
import Right from "./Right";
import Center from "./Center";
+import {useEffect} from 'react';
+import {useNavigate} from "react-router-dom";
function LinePage() {
+ const navigate = useNavigate();
+ useEffect(() => {
+ const handleKeyDown = (event:any) => {
+ if (event.key === 'ArrowUp') {
+ console.log('LDPage向上键被按下');
+ navigate('/LD?lineId=2-1');
+ // 执行向上键的逻辑
+ } else if (event.key === 'ArrowDown') {
+ console.log('LDPage向下键被按下');
+ // 执行向下键的逻辑
+ navigate('/LD?lineId=2-1');
+ }
+ }
+ window.addEventListener('keydown', handleKeyDown);
+ return () => {
+ window.removeEventListener('keydown', handleKeyDown);
+ };
+ });
return (
diff --git a/src/page/LinePage2-2/Center/CenterDown.tsx b/src/page/LinePage2-2/Center/CenterDown.tsx
index f14f8a9..3d1242b 100644
--- a/src/page/LinePage2-2/Center/CenterDown.tsx
+++ b/src/page/LinePage2-2/Center/CenterDown.tsx
@@ -1,7 +1,7 @@
import ReactECharts from "echarts-for-react";
import TitleBox from "../Component/TitleBox";
import ScrollBoard from "./../../Component/ScrollBoard";
-import SwitchButton from "../Component/SwitchButton";
+// import SwitchButton from "../Component/SwitchButton";
import { useState } from "react";
import getOptions from "../../Component/LineChart/chart.config";
import {useAppSelector} from "./../../../store/hooks"
@@ -29,10 +29,10 @@ function CenterDown() {
{ name: "周", ename: "week" },
{ name: "月", ename: "month" },
];
- const [activeName, setActiveName] = useState(nameList[0].ename);
- const handleButtonChange = (activeName: string) => {
- setActiveName(activeName);
- };
+ const [activeName, setActiveName] = useState(nameList[1].ename);
+ // const handleButtonChange = (activeName: string) => {
+ // setActiveName(activeName);
+ // };
const config = {
header: ["序号", "报警时间", "报警设备", "报警内容"],
headerHeight: 36,
@@ -41,7 +41,7 @@ function CenterDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [80, 137, 137, 137],
+ columnWidth: [80, 137, 177, 97],
data: []
};
// 报警数据
@@ -64,7 +64,7 @@ function CenterDown() {
});
}
config.data = arr
- // 产线成品率
+ // 工段成品率
// @ts-ignore
if (data.todayProductionRates && Object.keys(data.todayProductionRates).length > 0) {
// @ts-ignore
@@ -181,12 +181,12 @@ function CenterDown() {
)}
- {/* 产线成品率 */}
+ {/* 工段成品率 */}
-
*/}
{chartData.xData.length>0 && (
{
}
diff --git a/src/page/LinePage2-2/Component/TitleBox/index.tsx b/src/page/LinePage2-2/Component/TitleBox/index.tsx
index 6579889..6d654c1 100644
--- a/src/page/LinePage2-2/Component/TitleBox/index.tsx
+++ b/src/page/LinePage2-2/Component/TitleBox/index.tsx
@@ -14,12 +14,12 @@ function TitleBox(props: titleProps) {
case "left_up":
return {
img: Defect,
- title: "产线报废汇总",
+ title: "工段报废汇总",
};
case "left_down":
return {
img: Record,
- title: "当前产线报废情况",
+ title: "工序报废情况",
};
case "center_down_left":
return {
@@ -29,12 +29,12 @@ function TitleBox(props: titleProps) {
case "center_down_right":
return {
img: Finished,
- title: "产线成品率",
+ title: "工段成品率",
};
case "right_up":
return {
img: Num,
- title: "各产线总投入和产出",
+ title: "各工段总投入和产出",
};
default:
return {
diff --git a/src/page/LinePage2-2/Left/LeftDown.tsx b/src/page/LinePage2-2/Left/LeftDown.tsx
index e7e83d8..24d08dd 100644
--- a/src/page/LinePage2-2/Left/LeftDown.tsx
+++ b/src/page/LinePage2-2/Left/LeftDown.tsx
@@ -25,7 +25,7 @@ function LeftDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [73, 117, 190],
+ columnWidth: [73, 200, 107],
data: [
["1", "磨边后", 224],
["2", "包装1", 322],
@@ -40,7 +40,7 @@ function LeftDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [73, 117, 190],
+ columnWidth: [73, 200, 107],
data: [
["1", "磨边后", 1119],
["2", "包装1", 1798],
@@ -55,7 +55,7 @@ function LeftDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [73, 117, 190],
+ columnWidth: [73, 200, 107],
data: [
["1", "磨边后", 5004],
["2", "包装1", 9122],
@@ -65,7 +65,9 @@ function LeftDown() {
const color1 = ["#9DD5FF", "#1295FF"];
const color2 = ["#85F6E9", "#2EC6B4"];
// @ts-ignore
- let xData: string[] = data.scrapBars
+ let xData1: string[] = [];
+ let xData2: string[] = [];
+ let xData3: string[] = [];
let dataProps1: number[] = [];
let dataProps2: number[] = [];
let dataProps3: number[] = [];
@@ -77,9 +79,10 @@ function LeftDown() {
// @ts-ignore
data.todayProductionScraps.map((item,index)=>{
let arrInner = [];
- arrInner.push(index+1,item.sectionName,item.scrapNum);
+ arrInner.push(index+1,item.sectionName,item.scrapNum || 0);
arr1.push(arrInner);
- dataProps1.push(item.scrapNum);
+ xData1.push(item.sectionName);
+ dataProps1.push(item.scrapNum || 0);
})
}else{
dataProps1 = []
@@ -89,9 +92,10 @@ function LeftDown() {
// @ts-ignore
data.weekProductionScraps.map((item,index)=>{
let arrInner = [];
- arrInner.push(index+1,item.sectionName,item.scrapNum);
+ arrInner.push(index+1,item.sectionName,item.scrapNum || 0);
arr2.push(arrInner);
- dataProps2.push(item.scrapNum);
+ xData2.push(item.sectionName);
+ dataProps2.push(item.scrapNum || 0);
})
}else{
dataProps2 = []
@@ -101,9 +105,10 @@ function LeftDown() {
// @ts-ignore
data.monthProductionScraps.map((item,index)=>{
let arrInner = [];
- arrInner.push(index+1,item.sectionName,item.scrapNum);
+ arrInner.push(index+1,item.sectionName,item.scrapNum || 0);
arr3.push(arrInner);
- dataProps3.push(item.scrapNum);
+ xData3.push(item.sectionName);
+ dataProps3.push(item.scrapNum || 0);
})
}else{
dataProps3 = []
@@ -111,9 +116,9 @@ function LeftDown() {
configDay.data = arr1;
configWeek.data = arr2;
configMonth.data = arr3;
- const options1 = getOptions(dataProps1,xData, color1);
- const options2 = getOptions(dataProps2,xData, color2);
- const options3 = getOptions(dataProps3,xData, color1);
+ const options1 = getOptions(dataProps1,xData1, color1);
+ const options2 = getOptions(dataProps2,xData2, color2);
+ const options3 = getOptions(dataProps3,xData3, color1);
return (
diff --git a/src/page/LinePage2-2/Left/LeftUp.tsx b/src/page/LinePage2-2/Left/LeftUp.tsx
index e172b49..d812370 100644
--- a/src/page/LinePage2-2/Left/LeftUp.tsx
+++ b/src/page/LinePage2-2/Left/LeftUp.tsx
@@ -54,21 +54,34 @@ function LeftUp() {
})
// @ts-ignore
dataSource.day.xData = Object.keys(data.todayAllProductionScraps)
- dataSource.day.xData.map((item,index)=>{
- let sumIner = 0
+ dataSource.day.xData.sort((a,b)=>{// 保证横坐标是有序的
// @ts-ignore
- data.todayAllProductionScraps[item].map((itemInner,indexInner)=>{
- sumIner += itemInner.scrapNum
- dataSource.day.series.map((itemSeries,indexSeries)=>{
+ const lastDigitA = parseInt(a[a.length - 1], 10);
+ // @ts-ignore
+ const lastDigitB = parseInt(b[b.length - 1], 10);
+ return lastDigitA - lastDigitB;
+ })
+ for (let k = 0; k < dataSource.day.xData.length; k++) {
+ let item = dataSource.day.xData[k];
+ let sumIner = 0
+ for(let i = 0;i < dataSource.day.series.length;i++){
+ let itemSeries = dataSource.day.series[i]
+ // @ts-ignore
+ data.todayAllProductionScraps[item].map((itemInner,indexInner)=>{
// @ts-ignore
- if (itemSeries.name === itemInner.sectionName) {
+ if (itemInner.sectionName.indexOf(itemSeries.name)!==-1) {
// @ts-ignore
- itemSeries.data.push(itemInner.scrapNum)
+ itemSeries.data.push(itemInner.scrapNum || 0)
+ sumIner += itemInner.scrapNum || 0
+ return
}
})
- })
+ if (itemSeries.data.length === k) {
+ itemSeries.data.push(0)
+ }
+ }
sum.push(sumIner)
- })
+ }
dataSource.day.series.push({
data: sum,
type: "bar",
@@ -109,21 +122,34 @@ function LeftUp() {
})
// @ts-ignore
dataSource.week.xData = Object.keys(data.weekAllProductionScraps)
- dataSource.week.xData.map((item,index)=>{
- let sumIner = 0
+ dataSource.week.xData.sort((a,b)=>{// 保证横坐标是有序的
// @ts-ignore
- data.weekAllProductionScraps[item].map((itemInner,indexInner)=>{
- sumIner += itemInner.scrapNum
- dataSource.week.series.map((itemSeries,indexSeries)=>{
+ const lastDigitA = parseInt(a[a.length - 1], 10);
+ // @ts-ignore
+ const lastDigitB = parseInt(b[b.length - 1], 10);
+ return lastDigitA - lastDigitB;
+ })
+ for (let k = 0; k < dataSource.week.xData.length; k++) {
+ let item = dataSource.week.xData[k];
+ let sumIner = 0
+ for(let i = 0;i < dataSource.week.series.length;i++){
+ let itemSeries = dataSource.week.series[i]
+ // @ts-ignore
+ data.weekAllProductionScraps[item].map((itemInner,indexInner)=>{
// @ts-ignore
- if (itemSeries.name === itemInner.sectionName) {
+ if (itemInner.sectionName.indexOf(itemSeries.name)!==-1) {
// @ts-ignore
- itemSeries.data.push(itemInner.scrapNum)
+ itemSeries.data.push(itemInner.scrapNum || 0)
+ sumIner += itemInner.scrapNum || 0
+ return
}
})
- })
+ if (itemSeries.data.length === k) {
+ itemSeries.data.push(0)
+ }
+ }
sum.push(sumIner)
- })
+ }
dataSource.week.series.push({
data: sum,
type: "bar",
@@ -164,21 +190,34 @@ function LeftUp() {
})
// @ts-ignore
dataSource.month.xData = Object.keys(data.monthAllProductionScraps)
- dataSource.month.xData.map((item,index)=>{
- let sumIner = 0
+ dataSource.month.xData.sort((a,b)=>{// 保证横坐标是有序的
// @ts-ignore
- data.monthAllProductionScraps[item].map((itemInner,indexInner)=>{
- sumIner += itemInner.scrapNum
- dataSource.month.series.map((itemSeries,indexSeries)=>{
+ const lastDigitA = parseInt(a[a.length - 1], 10);
+ // @ts-ignore
+ const lastDigitB = parseInt(b[b.length - 1], 10);
+ return lastDigitA - lastDigitB;
+ })
+ for (let k = 0; k < dataSource.month.xData.length; k++) {
+ let item = dataSource.month.xData[k];
+ let sumIner = 0
+ for(let i = 0;i < dataSource.month.series.length;i++){
+ let itemSeries = dataSource.month.series[i]
+ // @ts-ignore
+ data.monthAllProductionScraps[item].map((itemInner,indexInner)=>{
// @ts-ignore
- if (itemSeries.name === itemInner.sectionName) {
+ if (itemInner.sectionName.indexOf(itemSeries.name)!==-1) {
// @ts-ignore
- itemSeries.data.push(itemInner.scrapNum)
+ itemSeries.data.push(itemInner.scrapNum || 0)
+ sumIner += itemInner.scrapNum || 0
+ return
}
})
- })
+ if (itemSeries.data.length === k) {
+ itemSeries.data.push(0)
+ }
+ }
sum.push(sumIner)
- })
+ }
dataSource.month.series.push({
data: sum,
type: "bar",
@@ -198,6 +237,7 @@ function LeftUp() {
dataSource.month.series = []
}
const options = getOptions(chartData);
+ console.log('dataSource',dataSource)
return (
diff --git a/src/page/LinePage2-2/Right/RightDown.tsx b/src/page/LinePage2-2/Right/RightDown.tsx
index 0d204d5..3adfaca 100644
--- a/src/page/LinePage2-2/Right/RightDown.tsx
+++ b/src/page/LinePage2-2/Right/RightDown.tsx
@@ -101,7 +101,7 @@ function RightDown() {
let arrInner = [];
arrInner.push(dayjs(item.recTime).format("YYYY/MM/DD"),item.inputNum,item.outputNum);
arr2.push(arrInner);
- tempData[1].data.time.push(dayjs(item.recTime).format("HH:mm"));
+ tempData[1].data.time.push(dayjs(item.recTime).format("MM.DD"));
tempData[1].data.input.push(item.inputNum);
tempData[1].data.output.push(item.outputNum);
})
@@ -117,7 +117,7 @@ function RightDown() {
let arrInner = [];
arrInner.push(dayjs(item.recTime).format("YYYY/MM/DD"),item.inputNum,item.outputNum);
arr3.push(arrInner);
- tempData[2].data.time.push(dayjs(item.recTime).format("HH:mm"));
+ tempData[2].data.time.push(dayjs(item.recTime).format("MM.DD"));
tempData[2].data.input.push(item.inputNum);
tempData[2].data.output.push(item.outputNum);
})
diff --git a/src/page/LinePage2-2/Right/RightUp.tsx b/src/page/LinePage2-2/Right/RightUp.tsx
index 8265b0c..700a22b 100644
--- a/src/page/LinePage2-2/Right/RightUp.tsx
+++ b/src/page/LinePage2-2/Right/RightUp.tsx
@@ -12,14 +12,14 @@ function RightUp() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [70, 90, 106, 114],
+ columnWidth: [55, 115, 100, 110],
data: [],
};
let arr:any = []
// @ts-ignore
- if (data.sumProductionDets && data.sumProductionDets.length > 0) {
+ if (data.sectionDet && data.sectionDet.length > 0) {
// @ts-ignore
- data.sumProductionDets.map((item, index) => {
+ data.sectionDet.map((item, index) => {
let arrInner = []
arrInner.push(index + 1, item.lineName, item.inputNum, item.outputNum)
arr.push(arrInner)
diff --git a/src/page/LinePage2-2/index.tsx b/src/page/LinePage2-2/index.tsx
index daf9389..e3be42c 100644
--- a/src/page/LinePage2-2/index.tsx
+++ b/src/page/LinePage2-2/index.tsx
@@ -3,7 +3,27 @@ import TopP from "./TopP";
import Left from "./Left";
import Right from "./Right";
import Center from "./Center";
+import {useEffect} from 'react';
+import {useNavigate} from "react-router-dom";
function LinePage() {
+ const navigate = useNavigate();
+ useEffect(() => {
+ const handleKeyDown = (event:any) => {
+ if (event.key === 'ArrowUp') {
+ console.log('LDPage向上键被按下');
+ navigate('/LD?lineId=2-2');
+ // 执行向上键的逻辑
+ } else if (event.key === 'ArrowDown') {
+ console.log('LDPage向下键被按下');
+ // 执行向下键的逻辑
+ navigate('/LD?lineId=2-2');
+ }
+ }
+ window.addEventListener('keydown', handleKeyDown);
+ return () => {
+ window.removeEventListener('keydown', handleKeyDown);
+ };
+ });
return (
diff --git a/src/page/LinePage3-1/Center/CenterDown.tsx b/src/page/LinePage3-1/Center/CenterDown.tsx
index dd58028..f5ed287 100644
--- a/src/page/LinePage3-1/Center/CenterDown.tsx
+++ b/src/page/LinePage3-1/Center/CenterDown.tsx
@@ -1,7 +1,7 @@
import ReactECharts from "echarts-for-react";
import TitleBox from "../Component/TitleBox";
import ScrollBoard from "./../../Component/ScrollBoard";
-import SwitchButton from "../Component/SwitchButton";
+// import SwitchButton from "../Component/SwitchButton";
import { useState } from "react";
import getOptions from "../../Component/LineChart/chart.config";
import {useAppSelector} from "./../../../store/hooks"
@@ -29,10 +29,10 @@ function CenterDown() {
{ name: "周", ename: "week" },
{ name: "月", ename: "month" },
];
- const [activeName, setActiveName] = useState(nameList[0].ename);
- const handleButtonChange = (activeName: string) => {
- setActiveName(activeName);
- };
+ const [activeName, setActiveName] = useState(nameList[1].ename);
+ // const handleButtonChange = (activeName: string) => {
+ // setActiveName(activeName);
+ // };
const config = {
header: ["序号", "报警时间", "报警设备", "报警内容"],
headerHeight: 36,
@@ -41,7 +41,7 @@ function CenterDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [80, 137, 137, 137],
+ columnWidth: [80, 137, 177, 97],
data: []
};
// 报警数据
@@ -64,7 +64,7 @@ function CenterDown() {
});
}
config.data = arr
- // 产线成品率
+ // 工段成品率
// @ts-ignore
if (data.todayProductionRates && Object.keys(data.todayProductionRates).length > 0) {
// @ts-ignore
@@ -181,12 +181,12 @@ function CenterDown() {
)}
- {/* 产线成品率 */}
+ {/* 工段成品率 */}
-
*/}
{chartData.xData.length>0 && (
{
}
diff --git a/src/page/LinePage3-1/Component/TitleBox/index.tsx b/src/page/LinePage3-1/Component/TitleBox/index.tsx
index 6579889..6d654c1 100644
--- a/src/page/LinePage3-1/Component/TitleBox/index.tsx
+++ b/src/page/LinePage3-1/Component/TitleBox/index.tsx
@@ -14,12 +14,12 @@ function TitleBox(props: titleProps) {
case "left_up":
return {
img: Defect,
- title: "产线报废汇总",
+ title: "工段报废汇总",
};
case "left_down":
return {
img: Record,
- title: "当前产线报废情况",
+ title: "工序报废情况",
};
case "center_down_left":
return {
@@ -29,12 +29,12 @@ function TitleBox(props: titleProps) {
case "center_down_right":
return {
img: Finished,
- title: "产线成品率",
+ title: "工段成品率",
};
case "right_up":
return {
img: Num,
- title: "各产线总投入和产出",
+ title: "各工段总投入和产出",
};
default:
return {
diff --git a/src/page/LinePage3-1/Left/LeftDown.tsx b/src/page/LinePage3-1/Left/LeftDown.tsx
index bae9c71..07da79a 100644
--- a/src/page/LinePage3-1/Left/LeftDown.tsx
+++ b/src/page/LinePage3-1/Left/LeftDown.tsx
@@ -25,7 +25,7 @@ function LeftDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [73, 117, 190],
+ columnWidth: [73, 200, 107],
data: [
["1", "磨边后", 224],
["2", "包装1", 322],
@@ -40,7 +40,7 @@ function LeftDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [73, 117, 190],
+ columnWidth: [73, 200, 107],
data: [
["1", "磨边后", 1119],
["2", "包装1", 1798],
@@ -55,7 +55,7 @@ function LeftDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [73, 117, 190],
+ columnWidth: [73, 200, 107],
data: [
["1", "磨边后", 5004],
["2", "包装1", 9122],
@@ -65,7 +65,9 @@ function LeftDown() {
const color1 = ["#9DD5FF", "#1295FF"];
const color2 = ["#85F6E9", "#2EC6B4"];
// @ts-ignore
- let xData: string[] = data.scrapBars
+ let xData1: string[] = [];
+ let xData2: string[] = [];
+ let xData3: string[] = [];
let dataProps1: number[] = [];
let dataProps2: number[] = [];
let dataProps3: number[] = [];
@@ -77,9 +79,10 @@ function LeftDown() {
// @ts-ignore
data.todayProductionScraps.map((item,index)=>{
let arrInner = [];
- arrInner.push(index+1,item.sectionName,item.scrapNum);
+ arrInner.push(index+1,item.sectionName,item.scrapNum || 0);
arr1.push(arrInner);
- dataProps1.push(item.scrapNum);
+ xData1.push(item.sectionName);
+ dataProps1.push(item.scrapNum || 0);
})
}else{
dataProps1 = []
@@ -89,9 +92,10 @@ function LeftDown() {
// @ts-ignore
data.weekProductionScraps.map((item,index)=>{
let arrInner = [];
- arrInner.push(index+1,item.sectionName,item.scrapNum);
+ arrInner.push(index+1,item.sectionName,item.scrapNum || 0);
arr2.push(arrInner);
- dataProps2.push(item.scrapNum);
+ xData2.push(item.sectionName);
+ dataProps2.push(item.scrapNum || 0);
})
}else{
dataProps2 = []
@@ -101,9 +105,10 @@ function LeftDown() {
// @ts-ignore
data.monthProductionScraps.map((item,index)=>{
let arrInner = [];
- arrInner.push(index+1,item.sectionName,item.scrapNum);
+ arrInner.push(index+1,item.sectionName,item.scrapNum || 0);
arr3.push(arrInner);
- dataProps3.push(item.scrapNum);
+ xData3.push(item.sectionName);
+ dataProps3.push(item.scrapNum || 0);
})
}else{
dataProps3 = []
@@ -111,9 +116,9 @@ function LeftDown() {
configDay.data = arr1;
configWeek.data = arr2;
configMonth.data = arr3;
- const options1 = getOptions(dataProps1,xData, color1);
- const options2 = getOptions(dataProps2,xData, color2);
- const options3 = getOptions(dataProps3,xData, color1);
+ const options1 = getOptions(dataProps1,xData1, color1);
+ const options2 = getOptions(dataProps2,xData2, color2);
+ const options3 = getOptions(dataProps3,xData3, color1);
return (
diff --git a/src/page/LinePage3-1/Left/LeftUp.tsx b/src/page/LinePage3-1/Left/LeftUp.tsx
index 7e470a2..ceafe41 100644
--- a/src/page/LinePage3-1/Left/LeftUp.tsx
+++ b/src/page/LinePage3-1/Left/LeftUp.tsx
@@ -54,21 +54,34 @@ function LeftUp() {
})
// @ts-ignore
dataSource.day.xData = Object.keys(data.todayAllProductionScraps)
- dataSource.day.xData.map((item,index)=>{
- let sumIner = 0
+ dataSource.day.xData.sort((a,b)=>{// 保证横坐标是有序的
// @ts-ignore
- data.todayAllProductionScraps[item].map((itemInner,indexInner)=>{
- sumIner += itemInner.scrapNum
- dataSource.day.series.map((itemSeries,indexSeries)=>{
+ const lastDigitA = parseInt(a[a.length - 1], 10);
+ // @ts-ignore
+ const lastDigitB = parseInt(b[b.length - 1], 10);
+ return lastDigitA - lastDigitB;
+ })
+ for (let k = 0; k < dataSource.day.xData.length; k++) {
+ let item = dataSource.day.xData[k];
+ let sumIner = 0
+ for(let i = 0;i < dataSource.day.series.length;i++){
+ let itemSeries = dataSource.day.series[i]
+ // @ts-ignore
+ data.todayAllProductionScraps[item].map((itemInner,indexInner)=>{
// @ts-ignore
- if (itemSeries.name === itemInner.sectionName) {
+ if (itemInner.sectionName.indexOf(itemSeries.name)!==-1) {
// @ts-ignore
- itemSeries.data.push(itemInner.scrapNum)
+ itemSeries.data.push(itemInner.scrapNum || 0)
+ sumIner += itemInner.scrapNum || 0
+ return
}
})
- })
+ if (itemSeries.data.length === k) {
+ itemSeries.data.push(0)
+ }
+ }
sum.push(sumIner)
- })
+ }
dataSource.day.series.push({
data: sum,
type: "bar",
@@ -109,21 +122,34 @@ function LeftUp() {
})
// @ts-ignore
dataSource.week.xData = Object.keys(data.weekAllProductionScraps)
- dataSource.week.xData.map((item,index)=>{
- let sumIner = 0
+ dataSource.week.xData.sort((a,b)=>{// 保证横坐标是有序的
// @ts-ignore
- data.weekAllProductionScraps[item].map((itemInner,indexInner)=>{
- sumIner += itemInner.scrapNum
- dataSource.week.series.map((itemSeries,indexSeries)=>{
+ const lastDigitA = parseInt(a[a.length - 1], 10);
+ // @ts-ignore
+ const lastDigitB = parseInt(b[b.length - 1], 10);
+ return lastDigitA - lastDigitB;
+ })
+ for (let k = 0; k < dataSource.week.xData.length; k++) {
+ let item = dataSource.week.xData[k];
+ let sumIner = 0
+ for(let i = 0;i < dataSource.week.series.length;i++){
+ let itemSeries = dataSource.week.series[i]
+ // @ts-ignore
+ data.weekAllProductionScraps[item].map((itemInner,indexInner)=>{
// @ts-ignore
- if (itemSeries.name === itemInner.sectionName) {
+ if (itemInner.sectionName.indexOf(itemSeries.name)!==-1) {
// @ts-ignore
- itemSeries.data.push(itemInner.scrapNum)
+ itemSeries.data.push(itemInner.scrapNum || 0)
+ sumIner += itemInner.scrapNum || 0
+ return
}
})
- })
+ if (itemSeries.data.length === k) {
+ itemSeries.data.push(0)
+ }
+ }
sum.push(sumIner)
- })
+ }
dataSource.week.series.push({
data: sum,
type: "bar",
@@ -164,21 +190,34 @@ function LeftUp() {
})
// @ts-ignore
dataSource.month.xData = Object.keys(data.monthAllProductionScraps)
- dataSource.month.xData.map((item,index)=>{
- let sumIner = 0
+ dataSource.month.xData.sort((a,b)=>{// 保证横坐标是有序的
// @ts-ignore
- data.monthAllProductionScraps[item].map((itemInner,indexInner)=>{
- sumIner += itemInner.scrapNum
- dataSource.month.series.map((itemSeries,indexSeries)=>{
+ const lastDigitA = parseInt(a[a.length - 1], 10);
+ // @ts-ignore
+ const lastDigitB = parseInt(b[b.length - 1], 10);
+ return lastDigitA - lastDigitB;
+ })
+ for (let k = 0; k < dataSource.month.xData.length; k++) {
+ let item = dataSource.month.xData[k];
+ let sumIner = 0
+ for(let i = 0;i < dataSource.month.series.length;i++){
+ let itemSeries = dataSource.month.series[i]
+ // @ts-ignore
+ data.monthAllProductionScraps[item].map((itemInner,indexInner)=>{
// @ts-ignore
- if (itemSeries.name === itemInner.sectionName) {
+ if (itemInner.sectionName.indexOf(itemSeries.name)!==-1) {
// @ts-ignore
- itemSeries.data.push(itemInner.scrapNum)
+ itemSeries.data.push(itemInner.scrapNum || 0)
+ sumIner += itemInner.scrapNum || 0
+ return
}
})
- })
+ if (itemSeries.data.length === k) {
+ itemSeries.data.push(0)
+ }
+ }
sum.push(sumIner)
- })
+ }
dataSource.month.series.push({
data: sum,
type: "bar",
@@ -198,6 +237,7 @@ function LeftUp() {
dataSource.month.series = []
}
const options = getOptions(chartData);
+ console.log('dataSource',dataSource)
return (
diff --git a/src/page/LinePage3-1/Right/RightDown.tsx b/src/page/LinePage3-1/Right/RightDown.tsx
index b10e116..f6df6f2 100644
--- a/src/page/LinePage3-1/Right/RightDown.tsx
+++ b/src/page/LinePage3-1/Right/RightDown.tsx
@@ -100,7 +100,7 @@ function RightDown() {
let arrInner = [];
arrInner.push(dayjs(item.recTime).format("YYYY/MM/DD"),item.inputNum,item.outputNum);
arr2.push(arrInner);
- tempData[1].data.time.push(dayjs(item.recTime).format("HH:mm"));
+ tempData[1].data.time.push(dayjs(item.recTime).format("MM.DD"));
tempData[1].data.input.push(item.inputNum);
tempData[1].data.output.push(item.outputNum);
})
@@ -116,7 +116,7 @@ function RightDown() {
let arrInner = [];
arrInner.push(dayjs(item.recTime).format("YYYY/MM/DD"),item.inputNum,item.outputNum);
arr3.push(arrInner);
- tempData[2].data.time.push(dayjs(item.recTime).format("HH:mm"));
+ tempData[2].data.time.push(dayjs(item.recTime).format("MM.DD"));
tempData[2].data.input.push(item.inputNum);
tempData[2].data.output.push(item.outputNum);
})
diff --git a/src/page/LinePage3-1/Right/RightUp.tsx b/src/page/LinePage3-1/Right/RightUp.tsx
index ee87241..369822c 100644
--- a/src/page/LinePage3-1/Right/RightUp.tsx
+++ b/src/page/LinePage3-1/Right/RightUp.tsx
@@ -12,14 +12,14 @@ function RightUp() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [70, 90, 106, 114],
+ columnWidth: [55, 115, 100, 110],
data: [],
};
let arr:any = []
// @ts-ignore
- if (data.sumProductionDets && data.sumProductionDets.length > 0) {
+ if (data.sectionDet && data.sectionDet.length > 0) {
// @ts-ignore
- data.sumProductionDets.map((item, index) => {
+ data.sectionDet.map((item, index) => {
let arrInner = []
arrInner.push(index + 1, item.lineName, item.inputNum, item.outputNum)
arr.push(arrInner)
diff --git a/src/page/LinePage3-1/index.tsx b/src/page/LinePage3-1/index.tsx
index daf9389..b43ab75 100644
--- a/src/page/LinePage3-1/index.tsx
+++ b/src/page/LinePage3-1/index.tsx
@@ -3,7 +3,27 @@ import TopP from "./TopP";
import Left from "./Left";
import Right from "./Right";
import Center from "./Center";
+import {useEffect} from 'react';
+import {useNavigate} from "react-router-dom";
function LinePage() {
+ const navigate = useNavigate();
+ useEffect(() => {
+ const handleKeyDown = (event:any) => {
+ if (event.key === 'ArrowUp') {
+ console.log('LDPage向上键被按下');
+ navigate('/LD?lineId=3-1');
+ // 执行向上键的逻辑
+ } else if (event.key === 'ArrowDown') {
+ console.log('LDPage向下键被按下');
+ // 执行向下键的逻辑
+ navigate('/LD?lineId=3-1');
+ }
+ }
+ window.addEventListener('keydown', handleKeyDown);
+ return () => {
+ window.removeEventListener('keydown', handleKeyDown);
+ };
+ });
return (
diff --git a/src/page/LinePage3-2/Center/CenterDown.tsx b/src/page/LinePage3-2/Center/CenterDown.tsx
index 95a18d3..1386274 100644
--- a/src/page/LinePage3-2/Center/CenterDown.tsx
+++ b/src/page/LinePage3-2/Center/CenterDown.tsx
@@ -1,7 +1,7 @@
import ReactECharts from "echarts-for-react";
import TitleBox from "../Component/TitleBox";
import ScrollBoard from "./../../Component/ScrollBoard";
-import SwitchButton from "../Component/SwitchButton";
+// import SwitchButton from "../Component/SwitchButton";
import { useState } from "react";
import getOptions from "../../Component/LineChart/chart.config";
import {useAppSelector} from "./../../../store/hooks"
@@ -29,10 +29,10 @@ function CenterDown() {
{ name: "周", ename: "week" },
{ name: "月", ename: "month" },
];
- const [activeName, setActiveName] = useState(nameList[0].ename);
- const handleButtonChange = (activeName: string) => {
- setActiveName(activeName);
- };
+ const [activeName, setActiveName] = useState(nameList[1].ename);
+ // const handleButtonChange = (activeName: string) => {
+ // setActiveName(activeName);
+ // };
const config = {
header: ["序号", "报警时间", "报警设备", "报警内容"],
headerHeight: 36,
@@ -41,7 +41,7 @@ function CenterDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [80, 137, 137, 137],
+ columnWidth: [80, 137, 177, 97],
data: []
};
// 报警数据
@@ -64,7 +64,7 @@ function CenterDown() {
});
}
config.data = arr
- // 产线成品率
+ // 工段成品率
// @ts-ignore
if (data.todayProductionRates && Object.keys(data.todayProductionRates).length > 0) {
// @ts-ignore
@@ -181,12 +181,12 @@ function CenterDown() {
)}
- {/* 产线成品率 */}
+ {/* 工段成品率 */}
-
*/}
{chartData.xData.length>0 && (
{
}
diff --git a/src/page/LinePage3-2/Component/TitleBox/index.tsx b/src/page/LinePage3-2/Component/TitleBox/index.tsx
index 6579889..6d654c1 100644
--- a/src/page/LinePage3-2/Component/TitleBox/index.tsx
+++ b/src/page/LinePage3-2/Component/TitleBox/index.tsx
@@ -14,12 +14,12 @@ function TitleBox(props: titleProps) {
case "left_up":
return {
img: Defect,
- title: "产线报废汇总",
+ title: "工段报废汇总",
};
case "left_down":
return {
img: Record,
- title: "当前产线报废情况",
+ title: "工序报废情况",
};
case "center_down_left":
return {
@@ -29,12 +29,12 @@ function TitleBox(props: titleProps) {
case "center_down_right":
return {
img: Finished,
- title: "产线成品率",
+ title: "工段成品率",
};
case "right_up":
return {
img: Num,
- title: "各产线总投入和产出",
+ title: "各工段总投入和产出",
};
default:
return {
diff --git a/src/page/LinePage3-2/Left/LeftDown.tsx b/src/page/LinePage3-2/Left/LeftDown.tsx
index d5f6169..a59e786 100644
--- a/src/page/LinePage3-2/Left/LeftDown.tsx
+++ b/src/page/LinePage3-2/Left/LeftDown.tsx
@@ -25,7 +25,7 @@ function LeftDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [73, 117, 190],
+ columnWidth: [73, 200, 107],
data: [
["1", "磨边后", 224],
["2", "包装1", 322],
@@ -40,7 +40,7 @@ function LeftDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [73, 117, 190],
+ columnWidth: [73, 200, 107],
data: [
["1", "磨边后", 1119],
["2", "包装1", 1798],
@@ -55,7 +55,7 @@ function LeftDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [73, 117, 190],
+ columnWidth: [73, 200, 107],
data: [
["1", "磨边后", 5004],
["2", "包装1", 9122],
@@ -65,7 +65,9 @@ function LeftDown() {
const color1 = ["#9DD5FF", "#1295FF"];
const color2 = ["#85F6E9", "#2EC6B4"];
// @ts-ignore
- let xData: string[] = data.scrapBars
+ let xData1: string[] = [];
+ let xData2: string[] = [];
+ let xData3: string[] = [];
let dataProps1: number[] = [];
let dataProps2: number[] = [];
let dataProps3: number[] = [];
@@ -77,9 +79,10 @@ function LeftDown() {
// @ts-ignore
data.todayProductionScraps.map((item,index)=>{
let arrInner = [];
- arrInner.push(index+1,item.sectionName,item.scrapNum);
+ arrInner.push(index+1,item.sectionName,item.scrapNum || 0);
arr1.push(arrInner);
- dataProps1.push(item.scrapNum);
+ xData1.push(item.sectionName);
+ dataProps1.push(item.scrapNum || 0);
})
}else{
dataProps1 = []
@@ -89,9 +92,10 @@ function LeftDown() {
// @ts-ignore
data.weekProductionScraps.map((item,index)=>{
let arrInner = [];
- arrInner.push(index+1,item.sectionName,item.scrapNum);
+ arrInner.push(index+1,item.sectionName,item.scrapNum || 0);
arr2.push(arrInner);
- dataProps2.push(item.scrapNum);
+ xData2.push(item.sectionName);
+ dataProps2.push(item.scrapNum || 0);
})
}else{
dataProps2 = []
@@ -101,9 +105,10 @@ function LeftDown() {
// @ts-ignore
data.monthProductionScraps.map((item,index)=>{
let arrInner = [];
- arrInner.push(index+1,item.sectionName,item.scrapNum);
+ arrInner.push(index+1,item.sectionName,item.scrapNum || 0);
arr3.push(arrInner);
- dataProps3.push(item.scrapNum);
+ xData3.push(item.sectionName);
+ dataProps3.push(item.scrapNum || 0);
})
}else{
dataProps3 = []
@@ -111,9 +116,9 @@ function LeftDown() {
configDay.data = arr1;
configWeek.data = arr2;
configMonth.data = arr3;
- const options1 = getOptions(dataProps1,xData, color1);
- const options2 = getOptions(dataProps2,xData, color2);
- const options3 = getOptions(dataProps3,xData, color1);
+ const options1 = getOptions(dataProps1,xData1, color1);
+ const options2 = getOptions(dataProps2,xData2, color2);
+ const options3 = getOptions(dataProps3,xData3, color1);
return (
diff --git a/src/page/LinePage3-2/Left/LeftUp.tsx b/src/page/LinePage3-2/Left/LeftUp.tsx
index 5737a42..21e8ec3 100644
--- a/src/page/LinePage3-2/Left/LeftUp.tsx
+++ b/src/page/LinePage3-2/Left/LeftUp.tsx
@@ -54,21 +54,34 @@ function LeftUp() {
})
// @ts-ignore
dataSource.day.xData = Object.keys(data.todayAllProductionScraps)
- dataSource.day.xData.map((item,index)=>{
- let sumIner = 0
+ dataSource.day.xData.sort((a,b)=>{// 保证横坐标是有序的
// @ts-ignore
- data.todayAllProductionScraps[item].map((itemInner,indexInner)=>{
- sumIner += itemInner.scrapNum
- dataSource.day.series.map((itemSeries,indexSeries)=>{
+ const lastDigitA = parseInt(a[a.length - 1], 10);
+ // @ts-ignore
+ const lastDigitB = parseInt(b[b.length - 1], 10);
+ return lastDigitA - lastDigitB;
+ })
+ for (let k = 0; k < dataSource.day.xData.length; k++) {
+ let item = dataSource.day.xData[k];
+ let sumIner = 0
+ for(let i = 0;i < dataSource.day.series.length;i++){
+ let itemSeries = dataSource.day.series[i]
+ // @ts-ignore
+ data.todayAllProductionScraps[item].map((itemInner,indexInner)=>{
// @ts-ignore
- if (itemSeries.name === itemInner.sectionName) {
+ if (itemInner.sectionName.indexOf(itemSeries.name)!==-1) {
// @ts-ignore
- itemSeries.data.push(itemInner.scrapNum)
+ itemSeries.data.push(itemInner.scrapNum || 0)
+ sumIner += itemInner.scrapNum || 0
+ return
}
})
- })
+ if (itemSeries.data.length === k) {
+ itemSeries.data.push(0)
+ }
+ }
sum.push(sumIner)
- })
+ }
dataSource.day.series.push({
data: sum,
type: "bar",
@@ -109,21 +122,34 @@ function LeftUp() {
})
// @ts-ignore
dataSource.week.xData = Object.keys(data.weekAllProductionScraps)
- dataSource.week.xData.map((item,index)=>{
- let sumIner = 0
+ dataSource.week.xData.sort((a,b)=>{// 保证横坐标是有序的
// @ts-ignore
- data.weekAllProductionScraps[item].map((itemInner,indexInner)=>{
- sumIner += itemInner.scrapNum
- dataSource.week.series.map((itemSeries,indexSeries)=>{
+ const lastDigitA = parseInt(a[a.length - 1], 10);
+ // @ts-ignore
+ const lastDigitB = parseInt(b[b.length - 1], 10);
+ return lastDigitA - lastDigitB;
+ })
+ for (let k = 0; k < dataSource.week.xData.length; k++) {
+ let item = dataSource.week.xData[k];
+ let sumIner = 0
+ for(let i = 0;i < dataSource.week.series.length;i++){
+ let itemSeries = dataSource.week.series[i]
+ // @ts-ignore
+ data.weekAllProductionScraps[item].map((itemInner,indexInner)=>{
// @ts-ignore
- if (itemSeries.name === itemInner.sectionName) {
+ if (itemInner.sectionName.indexOf(itemSeries.name)!==-1) {
// @ts-ignore
- itemSeries.data.push(itemInner.scrapNum)
+ itemSeries.data.push(itemInner.scrapNum || 0)
+ sumIner += itemInner.scrapNum || 0
+ return
}
})
- })
+ if (itemSeries.data.length === k) {
+ itemSeries.data.push(0)
+ }
+ }
sum.push(sumIner)
- })
+ }
dataSource.week.series.push({
data: sum,
type: "bar",
@@ -164,21 +190,34 @@ function LeftUp() {
})
// @ts-ignore
dataSource.month.xData = Object.keys(data.monthAllProductionScraps)
- dataSource.month.xData.map((item,index)=>{
- let sumIner = 0
+ dataSource.month.xData.sort((a,b)=>{// 保证横坐标是有序的
// @ts-ignore
- data.monthAllProductionScraps[item].map((itemInner,indexInner)=>{
- sumIner += itemInner.scrapNum
- dataSource.month.series.map((itemSeries,indexSeries)=>{
+ const lastDigitA = parseInt(a[a.length - 1], 10);
+ // @ts-ignore
+ const lastDigitB = parseInt(b[b.length - 1], 10);
+ return lastDigitA - lastDigitB;
+ })
+ for (let k = 0; k < dataSource.month.xData.length; k++) {
+ let item = dataSource.month.xData[k];
+ let sumIner = 0
+ for(let i = 0;i < dataSource.month.series.length;i++){
+ let itemSeries = dataSource.month.series[i]
+ // @ts-ignore
+ data.monthAllProductionScraps[item].map((itemInner,indexInner)=>{
// @ts-ignore
- if (itemSeries.name === itemInner.sectionName) {
+ if (itemInner.sectionName.indexOf(itemSeries.name)!==-1) {
// @ts-ignore
- itemSeries.data.push(itemInner.scrapNum)
+ itemSeries.data.push(itemInner.scrapNum || 0)
+ sumIner += itemInner.scrapNum || 0
+ return
}
})
- })
+ if (itemSeries.data.length === k) {
+ itemSeries.data.push(0)
+ }
+ }
sum.push(sumIner)
- })
+ }
dataSource.month.series.push({
data: sum,
type: "bar",
@@ -198,6 +237,7 @@ function LeftUp() {
dataSource.month.series = []
}
const options = getOptions(chartData);
+ console.log('dataSource',dataSource)
return (
diff --git a/src/page/LinePage3-2/Right/RightDown.tsx b/src/page/LinePage3-2/Right/RightDown.tsx
index 623b195..4da95cc 100644
--- a/src/page/LinePage3-2/Right/RightDown.tsx
+++ b/src/page/LinePage3-2/Right/RightDown.tsx
@@ -101,7 +101,7 @@ function RightDown() {
let arrInner = [];
arrInner.push(dayjs(item.recTime).format("YYYY/MM/DD"),item.inputNum,item.outputNum);
arr2.push(arrInner);
- tempData[1].data.time.push(dayjs(item.recTime).format("HH:mm"));
+ tempData[1].data.time.push(dayjs(item.recTime).format("MM.DD"));
tempData[1].data.input.push(item.inputNum);
tempData[1].data.output.push(item.outputNum);
})
@@ -117,7 +117,7 @@ function RightDown() {
let arrInner = [];
arrInner.push(dayjs(item.recTime).format("YYYY/MM/DD"),item.inputNum,item.outputNum);
arr3.push(arrInner);
- tempData[2].data.time.push(dayjs(item.recTime).format("HH:mm"));
+ tempData[2].data.time.push(dayjs(item.recTime).format("MM.DD"));
tempData[2].data.input.push(item.inputNum);
tempData[2].data.output.push(item.outputNum);
})
diff --git a/src/page/LinePage3-2/Right/RightUp.tsx b/src/page/LinePage3-2/Right/RightUp.tsx
index 8bb8eae..6c6b89d 100644
--- a/src/page/LinePage3-2/Right/RightUp.tsx
+++ b/src/page/LinePage3-2/Right/RightUp.tsx
@@ -12,14 +12,14 @@ function RightUp() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [70, 90, 106, 114],
+ columnWidth: [55, 115, 100, 110],
data: [],
};
let arr:any = []
// @ts-ignore
- if (data.sumProductionDets && data.sumProductionDets.length > 0) {
+ if (data.sectionDet && data.sectionDet.length > 0) {
// @ts-ignore
- data.sumProductionDets.map((item, index) => {
+ data.sectionDet.map((item, index) => {
let arrInner = []
arrInner.push(index + 1, item.lineName, item.inputNum, item.outputNum)
arr.push(arrInner)
diff --git a/src/page/LinePage3-2/index.tsx b/src/page/LinePage3-2/index.tsx
index daf9389..d2b2a02 100644
--- a/src/page/LinePage3-2/index.tsx
+++ b/src/page/LinePage3-2/index.tsx
@@ -3,7 +3,27 @@ import TopP from "./TopP";
import Left from "./Left";
import Right from "./Right";
import Center from "./Center";
+import {useEffect} from 'react';
+import {useNavigate} from "react-router-dom";
function LinePage() {
+ const navigate = useNavigate();
+ useEffect(() => {
+ const handleKeyDown = (event:any) => {
+ if (event.key === 'ArrowUp') {
+ console.log('LDPage向上键被按下');
+ navigate('/LD?lineId=3-2');
+ // 执行向上键的逻辑
+ } else if (event.key === 'ArrowDown') {
+ console.log('LDPage向下键被按下');
+ // 执行向下键的逻辑
+ navigate('/LD?lineId=3-2');
+ }
+ }
+ window.addEventListener('keydown', handleKeyDown);
+ return () => {
+ window.removeEventListener('keydown', handleKeyDown);
+ };
+ });
return (
diff --git a/src/page/LinePage4-1/Center/CenterDown.tsx b/src/page/LinePage4-1/Center/CenterDown.tsx
index f8d0c0e..3b2ad1a 100644
--- a/src/page/LinePage4-1/Center/CenterDown.tsx
+++ b/src/page/LinePage4-1/Center/CenterDown.tsx
@@ -1,7 +1,7 @@
import ReactECharts from "echarts-for-react";
import TitleBox from "../Component/TitleBox";
import ScrollBoard from "./../../Component/ScrollBoard";
-import SwitchButton from "../Component/SwitchButton";
+// import SwitchButton from "../Component/SwitchButton";
import { useState } from "react";
import getOptions from "../../Component/LineChart/chart.config";
import {useAppSelector} from "./../../../store/hooks"
@@ -29,10 +29,10 @@ function CenterDown() {
{ name: "周", ename: "week" },
{ name: "月", ename: "month" },
];
- const [activeName, setActiveName] = useState(nameList[0].ename);
- const handleButtonChange = (activeName: string) => {
- setActiveName(activeName);
- };
+ const [activeName, setActiveName] = useState(nameList[1].ename);
+ // const handleButtonChange = (activeName: string) => {
+ // setActiveName(activeName);
+ // };
const config = {
header: ["序号", "报警时间", "报警设备", "报警内容"],
headerHeight: 36,
@@ -41,7 +41,7 @@ function CenterDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [80, 137, 137, 137],
+ columnWidth: [80, 137, 177, 97],
data: []
};
// 报警数据
@@ -64,7 +64,7 @@ function CenterDown() {
});
}
config.data = arr
- // 产线成品率
+ // 工段成品率
// @ts-ignore
if (data.todayProductionRates && Object.keys(data.todayProductionRates).length > 0) {
// @ts-ignore
@@ -181,12 +181,12 @@ function CenterDown() {
)}
- {/* 产线成品率 */}
+ {/* 工段成品率 */}
-
*/}
{chartData.xData.length>0 && (
{
}
diff --git a/src/page/LinePage4-1/Component/TitleBox/index.tsx b/src/page/LinePage4-1/Component/TitleBox/index.tsx
index 6579889..6d654c1 100644
--- a/src/page/LinePage4-1/Component/TitleBox/index.tsx
+++ b/src/page/LinePage4-1/Component/TitleBox/index.tsx
@@ -14,12 +14,12 @@ function TitleBox(props: titleProps) {
case "left_up":
return {
img: Defect,
- title: "产线报废汇总",
+ title: "工段报废汇总",
};
case "left_down":
return {
img: Record,
- title: "当前产线报废情况",
+ title: "工序报废情况",
};
case "center_down_left":
return {
@@ -29,12 +29,12 @@ function TitleBox(props: titleProps) {
case "center_down_right":
return {
img: Finished,
- title: "产线成品率",
+ title: "工段成品率",
};
case "right_up":
return {
img: Num,
- title: "各产线总投入和产出",
+ title: "各工段总投入和产出",
};
default:
return {
diff --git a/src/page/LinePage4-1/Left/LeftDown.tsx b/src/page/LinePage4-1/Left/LeftDown.tsx
index 94e3368..0252fcd 100644
--- a/src/page/LinePage4-1/Left/LeftDown.tsx
+++ b/src/page/LinePage4-1/Left/LeftDown.tsx
@@ -25,7 +25,7 @@ function LeftDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [73, 117, 190],
+ columnWidth: [73, 200, 107],
data: [
["1", "磨边后", 224],
["2", "包装1", 322],
@@ -40,7 +40,7 @@ function LeftDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [73, 117, 190],
+ columnWidth: [73, 200, 107],
data: [
["1", "磨边后", 1119],
["2", "包装1", 1798],
@@ -55,7 +55,7 @@ function LeftDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [73, 117, 190],
+ columnWidth: [73, 200, 107],
data: [
["1", "磨边后", 5004],
["2", "包装1", 9122],
@@ -65,7 +65,9 @@ function LeftDown() {
const color1 = ["#9DD5FF", "#1295FF"];
const color2 = ["#85F6E9", "#2EC6B4"];
// @ts-ignore
- let xData: string[] = data.scrapBars
+ let xData1: string[] = [];
+ let xData2: string[] = [];
+ let xData3: string[] = [];
let dataProps1: number[] = [];
let dataProps2: number[] = [];
let dataProps3: number[] = [];
@@ -77,9 +79,10 @@ function LeftDown() {
// @ts-ignore
data.todayProductionScraps.map((item,index)=>{
let arrInner = [];
- arrInner.push(index+1,item.sectionName,item.scrapNum);
+ arrInner.push(index+1,item.sectionName,item.scrapNum || 0);
arr1.push(arrInner);
- dataProps1.push(item.scrapNum);
+ xData1.push(item.sectionName);
+ dataProps1.push(item.scrapNum || 0);
})
}else{
dataProps1 = []
@@ -89,9 +92,10 @@ function LeftDown() {
// @ts-ignore
data.weekProductionScraps.map((item,index)=>{
let arrInner = [];
- arrInner.push(index+1,item.sectionName,item.scrapNum);
+ arrInner.push(index+1,item.sectionName,item.scrapNum || 0);
arr2.push(arrInner);
- dataProps2.push(item.scrapNum);
+ xData2.push(item.sectionName);
+ dataProps2.push(item.scrapNum || 0);
})
}else{
dataProps2 = []
@@ -101,9 +105,10 @@ function LeftDown() {
// @ts-ignore
data.monthProductionScraps.map((item,index)=>{
let arrInner = [];
- arrInner.push(index+1,item.sectionName,item.scrapNum);
+ arrInner.push(index+1,item.sectionName,item.scrapNum || 0);
arr3.push(arrInner);
- dataProps3.push(item.scrapNum);
+ xData3.push(item.sectionName);
+ dataProps3.push(item.scrapNum || 0);
})
}else{
dataProps3 = []
@@ -111,9 +116,9 @@ function LeftDown() {
configDay.data = arr1;
configWeek.data = arr2;
configMonth.data = arr3;
- const options1 = getOptions(dataProps1,xData, color1);
- const options2 = getOptions(dataProps2,xData, color2);
- const options3 = getOptions(dataProps3,xData, color1);
+ const options1 = getOptions(dataProps1,xData1, color1);
+ const options2 = getOptions(dataProps2,xData2, color2);
+ const options3 = getOptions(dataProps3,xData3, color1);
return (
diff --git a/src/page/LinePage4-1/Left/LeftUp.tsx b/src/page/LinePage4-1/Left/LeftUp.tsx
index 7705eff..9af7d8a 100644
--- a/src/page/LinePage4-1/Left/LeftUp.tsx
+++ b/src/page/LinePage4-1/Left/LeftUp.tsx
@@ -54,21 +54,34 @@ function LeftUp() {
})
// @ts-ignore
dataSource.day.xData = Object.keys(data.todayAllProductionScraps)
- dataSource.day.xData.map((item,index)=>{
- let sumIner = 0
+ dataSource.day.xData.sort((a,b)=>{// 保证横坐标是有序的
// @ts-ignore
- data.todayAllProductionScraps[item].map((itemInner,indexInner)=>{
- sumIner += itemInner.scrapNum
- dataSource.day.series.map((itemSeries,indexSeries)=>{
+ const lastDigitA = parseInt(a[a.length - 1], 10);
+ // @ts-ignore
+ const lastDigitB = parseInt(b[b.length - 1], 10);
+ return lastDigitA - lastDigitB;
+ })
+ for (let k = 0; k < dataSource.day.xData.length; k++) {
+ let item = dataSource.day.xData[k];
+ let sumIner = 0
+ for(let i = 0;i < dataSource.day.series.length;i++){
+ let itemSeries = dataSource.day.series[i]
+ // @ts-ignore
+ data.todayAllProductionScraps[item].map((itemInner,indexInner)=>{
// @ts-ignore
- if (itemSeries.name === itemInner.sectionName) {
+ if (itemInner.sectionName.indexOf(itemSeries.name)!==-1) {
// @ts-ignore
- itemSeries.data.push(itemInner.scrapNum)
+ itemSeries.data.push(itemInner.scrapNum || 0)
+ sumIner += itemInner.scrapNum || 0
+ return
}
})
- })
+ if (itemSeries.data.length === k) {
+ itemSeries.data.push(0)
+ }
+ }
sum.push(sumIner)
- })
+ }
dataSource.day.series.push({
data: sum,
type: "bar",
@@ -109,21 +122,34 @@ function LeftUp() {
})
// @ts-ignore
dataSource.week.xData = Object.keys(data.weekAllProductionScraps)
- dataSource.week.xData.map((item,index)=>{
- let sumIner = 0
+ dataSource.week.xData.sort((a,b)=>{// 保证横坐标是有序的
// @ts-ignore
- data.weekAllProductionScraps[item].map((itemInner,indexInner)=>{
- sumIner += itemInner.scrapNum
- dataSource.week.series.map((itemSeries,indexSeries)=>{
+ const lastDigitA = parseInt(a[a.length - 1], 10);
+ // @ts-ignore
+ const lastDigitB = parseInt(b[b.length - 1], 10);
+ return lastDigitA - lastDigitB;
+ })
+ for (let k = 0; k < dataSource.week.xData.length; k++) {
+ let item = dataSource.week.xData[k];
+ let sumIner = 0
+ for(let i = 0;i < dataSource.week.series.length;i++){
+ let itemSeries = dataSource.week.series[i]
+ // @ts-ignore
+ data.weekAllProductionScraps[item].map((itemInner,indexInner)=>{
// @ts-ignore
- if (itemSeries.name === itemInner.sectionName) {
+ if (itemInner.sectionName.indexOf(itemSeries.name)!==-1) {
// @ts-ignore
- itemSeries.data.push(itemInner.scrapNum)
+ itemSeries.data.push(itemInner.scrapNum || 0)
+ sumIner += itemInner.scrapNum || 0
+ return
}
})
- })
+ if (itemSeries.data.length === k) {
+ itemSeries.data.push(0)
+ }
+ }
sum.push(sumIner)
- })
+ }
dataSource.week.series.push({
data: sum,
type: "bar",
@@ -164,21 +190,34 @@ function LeftUp() {
})
// @ts-ignore
dataSource.month.xData = Object.keys(data.monthAllProductionScraps)
- dataSource.month.xData.map((item,index)=>{
- let sumIner = 0
+ dataSource.month.xData.sort((a,b)=>{// 保证横坐标是有序的
// @ts-ignore
- data.monthAllProductionScraps[item].map((itemInner,indexInner)=>{
- sumIner += itemInner.scrapNum
- dataSource.month.series.map((itemSeries,indexSeries)=>{
+ const lastDigitA = parseInt(a[a.length - 1], 10);
+ // @ts-ignore
+ const lastDigitB = parseInt(b[b.length - 1], 10);
+ return lastDigitA - lastDigitB;
+ })
+ for (let k = 0; k < dataSource.month.xData.length; k++) {
+ let item = dataSource.month.xData[k];
+ let sumIner = 0
+ for(let i = 0;i < dataSource.month.series.length;i++){
+ let itemSeries = dataSource.month.series[i]
+ // @ts-ignore
+ data.monthAllProductionScraps[item].map((itemInner,indexInner)=>{
// @ts-ignore
- if (itemSeries.name === itemInner.sectionName) {
+ if (itemInner.sectionName.indexOf(itemSeries.name)!==-1) {
// @ts-ignore
- itemSeries.data.push(itemInner.scrapNum)
+ itemSeries.data.push(itemInner.scrapNum || 0)
+ sumIner += itemInner.scrapNum || 0
+ return
}
})
- })
+ if (itemSeries.data.length === k) {
+ itemSeries.data.push(0)
+ }
+ }
sum.push(sumIner)
- })
+ }
dataSource.month.series.push({
data: sum,
type: "bar",
@@ -198,6 +237,7 @@ function LeftUp() {
dataSource.month.series = []
}
const options = getOptions(chartData);
+ console.log('dataSource',dataSource)
return (
diff --git a/src/page/LinePage4-1/Right/RightDown.tsx b/src/page/LinePage4-1/Right/RightDown.tsx
index e6c89cc..fc2edfe 100644
--- a/src/page/LinePage4-1/Right/RightDown.tsx
+++ b/src/page/LinePage4-1/Right/RightDown.tsx
@@ -101,7 +101,7 @@ function RightDown() {
let arrInner = [];
arrInner.push(dayjs(item.recTime).format("YYYY/MM/DD"),item.inputNum,item.outputNum);
arr2.push(arrInner);
- tempData[1].data.time.push(dayjs(item.recTime).format("HH:mm"));
+ tempData[1].data.time.push(dayjs(item.recTime).format("MM.DD"));
tempData[1].data.input.push(item.inputNum);
tempData[1].data.output.push(item.outputNum);
})
@@ -117,7 +117,7 @@ function RightDown() {
let arrInner = [];
arrInner.push(dayjs(item.recTime).format("YYYY/MM/DD"),item.inputNum,item.outputNum);
arr3.push(arrInner);
- tempData[2].data.time.push(dayjs(item.recTime).format("HH:mm"));
+ tempData[2].data.time.push(dayjs(item.recTime).format("MM.DD"));
tempData[2].data.input.push(item.inputNum);
tempData[2].data.output.push(item.outputNum);
})
diff --git a/src/page/LinePage4-1/Right/RightUp.tsx b/src/page/LinePage4-1/Right/RightUp.tsx
index 7ef32e7..896a72d 100644
--- a/src/page/LinePage4-1/Right/RightUp.tsx
+++ b/src/page/LinePage4-1/Right/RightUp.tsx
@@ -12,14 +12,14 @@ function RightUp() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [70, 90, 106, 114],
+ columnWidth: [55, 115, 100, 110],
data: [],
};
let arr:any = []
// @ts-ignore
- if (data.sumProductionDets && data.sumProductionDets.length > 0) {
+ if (data.sectionDet && data.sectionDet.length > 0) {
// @ts-ignore
- data.sumProductionDets.map((item, index) => {
+ data.sectionDet.map((item, index) => {
let arrInner = []
arrInner.push(index + 1, item.lineName, item.inputNum, item.outputNum)
arr.push(arrInner)
diff --git a/src/page/LinePage4-1/index.tsx b/src/page/LinePage4-1/index.tsx
index daf9389..e20e7f1 100644
--- a/src/page/LinePage4-1/index.tsx
+++ b/src/page/LinePage4-1/index.tsx
@@ -3,7 +3,27 @@ import TopP from "./TopP";
import Left from "./Left";
import Right from "./Right";
import Center from "./Center";
+import {useEffect} from 'react';
+import {useNavigate} from "react-router-dom";
function LinePage() {
+ const navigate = useNavigate();
+ useEffect(() => {
+ const handleKeyDown = (event:any) => {
+ if (event.key === 'ArrowUp') {
+ console.log('LDPage向上键被按下');
+ navigate('/LD?lineId=4-1');
+ // 执行向上键的逻辑
+ } else if (event.key === 'ArrowDown') {
+ console.log('LDPage向下键被按下');
+ // 执行向下键的逻辑
+ navigate('/LD?lineId=4-1');
+ }
+ }
+ window.addEventListener('keydown', handleKeyDown);
+ return () => {
+ window.removeEventListener('keydown', handleKeyDown);
+ };
+ });
return (
diff --git a/src/page/LinePage4-2/Center/CenterDown.tsx b/src/page/LinePage4-2/Center/CenterDown.tsx
index 2e26257..3cbd808 100644
--- a/src/page/LinePage4-2/Center/CenterDown.tsx
+++ b/src/page/LinePage4-2/Center/CenterDown.tsx
@@ -1,7 +1,7 @@
import ReactECharts from "echarts-for-react";
import TitleBox from "../Component/TitleBox";
import ScrollBoard from "./../../Component/ScrollBoard";
-import SwitchButton from "../Component/SwitchButton";
+// import SwitchButton from "../Component/SwitchButton";
import { useState } from "react";
import getOptions from "../../Component/LineChart/chart.config";
import {useAppSelector} from "./../../../store/hooks"
@@ -29,10 +29,10 @@ function CenterDown() {
{ name: "周", ename: "week" },
{ name: "月", ename: "month" },
];
- const [activeName, setActiveName] = useState(nameList[0].ename);
- const handleButtonChange = (activeName: string) => {
- setActiveName(activeName);
- };
+ const [activeName, setActiveName] = useState(nameList[1].ename);
+ // const handleButtonChange = (activeName: string) => {
+ // setActiveName(activeName);
+ // };
const config = {
header: ["序号", "报警时间", "报警设备", "报警内容"],
headerHeight: 36,
@@ -41,7 +41,7 @@ function CenterDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [80, 137, 137, 137],
+ columnWidth: [80, 137, 177, 97],
data: []
};
// 报警数据
@@ -64,7 +64,7 @@ function CenterDown() {
});
}
config.data = arr
- // 产线成品率
+ // 工段成品率
// @ts-ignore
if (data.todayProductionRates && Object.keys(data.todayProductionRates).length > 0) {
// @ts-ignore
@@ -181,12 +181,12 @@ function CenterDown() {
)}
- {/* 产线成品率 */}
+ {/* 工段成品率 */}
-
*/}
{chartData.xData.length>0 && (
{
}
diff --git a/src/page/LinePage4-2/Component/TitleBox/index.tsx b/src/page/LinePage4-2/Component/TitleBox/index.tsx
index 6579889..6d654c1 100644
--- a/src/page/LinePage4-2/Component/TitleBox/index.tsx
+++ b/src/page/LinePage4-2/Component/TitleBox/index.tsx
@@ -14,12 +14,12 @@ function TitleBox(props: titleProps) {
case "left_up":
return {
img: Defect,
- title: "产线报废汇总",
+ title: "工段报废汇总",
};
case "left_down":
return {
img: Record,
- title: "当前产线报废情况",
+ title: "工序报废情况",
};
case "center_down_left":
return {
@@ -29,12 +29,12 @@ function TitleBox(props: titleProps) {
case "center_down_right":
return {
img: Finished,
- title: "产线成品率",
+ title: "工段成品率",
};
case "right_up":
return {
img: Num,
- title: "各产线总投入和产出",
+ title: "各工段总投入和产出",
};
default:
return {
diff --git a/src/page/LinePage4-2/Left/LeftDown.tsx b/src/page/LinePage4-2/Left/LeftDown.tsx
index ad3c553..f27a995 100644
--- a/src/page/LinePage4-2/Left/LeftDown.tsx
+++ b/src/page/LinePage4-2/Left/LeftDown.tsx
@@ -25,7 +25,7 @@ function LeftDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [73, 117, 190],
+ columnWidth: [73, 200, 107],
data: [
["1", "磨边后", 224],
["2", "包装1", 322],
@@ -40,7 +40,7 @@ function LeftDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [73, 117, 190],
+ columnWidth: [73, 200, 107],
data: [
["1", "磨边后", 1119],
["2", "包装1", 1798],
@@ -55,7 +55,7 @@ function LeftDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [73, 117, 190],
+ columnWidth: [73, 200, 107],
data: [
["1", "磨边后", 5004],
["2", "包装1", 9122],
@@ -65,7 +65,9 @@ function LeftDown() {
const color1 = ["#9DD5FF", "#1295FF"];
const color2 = ["#85F6E9", "#2EC6B4"];
// @ts-ignore
- let xData: string[] = data.scrapBars
+ let xData1: string[] = [];
+ let xData2: string[] = [];
+ let xData3: string[] = [];
let dataProps1: number[] = [];
let dataProps2: number[] = [];
let dataProps3: number[] = [];
@@ -77,9 +79,10 @@ function LeftDown() {
// @ts-ignore
data.todayProductionScraps.map((item,index)=>{
let arrInner = [];
- arrInner.push(index+1,item.sectionName,item.scrapNum);
+ arrInner.push(index+1,item.sectionName,item.scrapNum || 0);
arr1.push(arrInner);
- dataProps1.push(item.scrapNum);
+ xData1.push(item.sectionName);
+ dataProps1.push(item.scrapNum || 0);
})
}else{
dataProps1 = []
@@ -89,9 +92,10 @@ function LeftDown() {
// @ts-ignore
data.weekProductionScraps.map((item,index)=>{
let arrInner = [];
- arrInner.push(index+1,item.sectionName,item.scrapNum);
+ arrInner.push(index+1,item.sectionName,item.scrapNum || 0);
arr2.push(arrInner);
- dataProps2.push(item.scrapNum);
+ xData2.push(item.sectionName);
+ dataProps2.push(item.scrapNum || 0);
})
}else{
dataProps2 = []
@@ -101,9 +105,10 @@ function LeftDown() {
// @ts-ignore
data.monthProductionScraps.map((item,index)=>{
let arrInner = [];
- arrInner.push(index+1,item.sectionName,item.scrapNum);
+ arrInner.push(index+1,item.sectionName,item.scrapNum || 0);
arr3.push(arrInner);
- dataProps3.push(item.scrapNum);
+ xData3.push(item.sectionName);
+ dataProps3.push(item.scrapNum || 0);
})
}else{
dataProps3 = []
@@ -111,9 +116,9 @@ function LeftDown() {
configDay.data = arr1;
configWeek.data = arr2;
configMonth.data = arr3;
- const options1 = getOptions(dataProps1,xData, color1);
- const options2 = getOptions(dataProps2,xData, color2);
- const options3 = getOptions(dataProps3,xData, color1);
+ const options1 = getOptions(dataProps1,xData1, color1);
+ const options2 = getOptions(dataProps2,xData2, color2);
+ const options3 = getOptions(dataProps3,xData3, color1);
return (
diff --git a/src/page/LinePage4-2/Left/LeftUp.tsx b/src/page/LinePage4-2/Left/LeftUp.tsx
index 54473c3..25f71c9 100644
--- a/src/page/LinePage4-2/Left/LeftUp.tsx
+++ b/src/page/LinePage4-2/Left/LeftUp.tsx
@@ -32,7 +32,6 @@ function LeftUp() {
const handleButtonChange = (activeName: string) => {
setActiveName(activeName);
};
- console.log('',chartData)
// @ts-ignore
if (data.todayAllProductionScraps && Object.keys(data.todayAllProductionScraps).length > 0) {
let sum: number[] = [];
@@ -55,21 +54,34 @@ function LeftUp() {
})
// @ts-ignore
dataSource.day.xData = Object.keys(data.todayAllProductionScraps)
- dataSource.day.xData.map((item,index)=>{
- let sumIner = 0
+ dataSource.day.xData.sort((a,b)=>{// 保证横坐标是有序的
// @ts-ignore
- data.todayAllProductionScraps[item].map((itemInner,indexInner)=>{
- sumIner += itemInner.scrapNum
- dataSource.day.series.map((itemSeries,indexSeries)=>{
+ const lastDigitA = parseInt(a[a.length - 1], 10);
+ // @ts-ignore
+ const lastDigitB = parseInt(b[b.length - 1], 10);
+ return lastDigitA - lastDigitB;
+ })
+ for (let k = 0; k < dataSource.day.xData.length; k++) {
+ let item = dataSource.day.xData[k];
+ let sumIner = 0
+ for(let i = 0;i < dataSource.day.series.length;i++){
+ let itemSeries = dataSource.day.series[i]
+ // @ts-ignore
+ data.todayAllProductionScraps[item].map((itemInner,indexInner)=>{
// @ts-ignore
- if (itemSeries.name === itemInner.sectionName) {
+ if (itemInner.sectionName.indexOf(itemSeries.name)!==-1) {
// @ts-ignore
- itemSeries.data.push(itemInner.scrapNum)
+ itemSeries.data.push(itemInner.scrapNum || 0)
+ sumIner += itemInner.scrapNum || 0
+ return
}
})
- })
+ if (itemSeries.data.length === k) {
+ itemSeries.data.push(0)
+ }
+ }
sum.push(sumIner)
- })
+ }
dataSource.day.series.push({
data: sum,
type: "bar",
@@ -110,21 +122,34 @@ function LeftUp() {
})
// @ts-ignore
dataSource.week.xData = Object.keys(data.weekAllProductionScraps)
- dataSource.week.xData.map((item,index)=>{
- let sumIner = 0
+ dataSource.week.xData.sort((a,b)=>{// 保证横坐标是有序的
// @ts-ignore
- data.weekAllProductionScraps[item].map((itemInner,indexInner)=>{
- sumIner += itemInner.scrapNum
- dataSource.week.series.map((itemSeries,indexSeries)=>{
+ const lastDigitA = parseInt(a[a.length - 1], 10);
+ // @ts-ignore
+ const lastDigitB = parseInt(b[b.length - 1], 10);
+ return lastDigitA - lastDigitB;
+ })
+ for (let k = 0; k < dataSource.week.xData.length; k++) {
+ let item = dataSource.week.xData[k];
+ let sumIner = 0
+ for(let i = 0;i < dataSource.week.series.length;i++){
+ let itemSeries = dataSource.week.series[i]
+ // @ts-ignore
+ data.weekAllProductionScraps[item].map((itemInner,indexInner)=>{
// @ts-ignore
- if (itemSeries.name === itemInner.sectionName) {
+ if (itemInner.sectionName.indexOf(itemSeries.name)!==-1) {
// @ts-ignore
- itemSeries.data.push(itemInner.scrapNum)
+ itemSeries.data.push(itemInner.scrapNum || 0)
+ sumIner += itemInner.scrapNum || 0
+ return
}
})
- })
+ if (itemSeries.data.length === k) {
+ itemSeries.data.push(0)
+ }
+ }
sum.push(sumIner)
- })
+ }
dataSource.week.series.push({
data: sum,
type: "bar",
@@ -165,21 +190,34 @@ function LeftUp() {
})
// @ts-ignore
dataSource.month.xData = Object.keys(data.monthAllProductionScraps)
- dataSource.month.xData.map((item,index)=>{
- let sumIner = 0
+ dataSource.month.xData.sort((a,b)=>{// 保证横坐标是有序的
// @ts-ignore
- data.monthAllProductionScraps[item].map((itemInner,indexInner)=>{
- sumIner += itemInner.scrapNum
- dataSource.month.series.map((itemSeries,indexSeries)=>{
+ const lastDigitA = parseInt(a[a.length - 1], 10);
+ // @ts-ignore
+ const lastDigitB = parseInt(b[b.length - 1], 10);
+ return lastDigitA - lastDigitB;
+ })
+ for (let k = 0; k < dataSource.month.xData.length; k++) {
+ let item = dataSource.month.xData[k];
+ let sumIner = 0
+ for(let i = 0;i < dataSource.month.series.length;i++){
+ let itemSeries = dataSource.month.series[i]
+ // @ts-ignore
+ data.monthAllProductionScraps[item].map((itemInner,indexInner)=>{
// @ts-ignore
- if (itemSeries.name === itemInner.sectionName) {
+ if (itemInner.sectionName.indexOf(itemSeries.name)!==-1) {
// @ts-ignore
- itemSeries.data.push(itemInner.scrapNum)
+ itemSeries.data.push(itemInner.scrapNum || 0)
+ sumIner += itemInner.scrapNum || 0
+ return
}
})
- })
+ if (itemSeries.data.length === k) {
+ itemSeries.data.push(0)
+ }
+ }
sum.push(sumIner)
- })
+ }
dataSource.month.series.push({
data: sum,
type: "bar",
@@ -199,6 +237,7 @@ function LeftUp() {
dataSource.month.series = []
}
const options = getOptions(chartData);
+ console.log('dataSource',dataSource)
return (
diff --git a/src/page/LinePage4-2/Right/RightDown.tsx b/src/page/LinePage4-2/Right/RightDown.tsx
index 9470821..82b2ee3 100644
--- a/src/page/LinePage4-2/Right/RightDown.tsx
+++ b/src/page/LinePage4-2/Right/RightDown.tsx
@@ -101,7 +101,7 @@ function RightDown() {
let arrInner = [];
arrInner.push(dayjs(item.recTime).format("YYYY/MM/DD"),item.inputNum,item.outputNum);
arr2.push(arrInner);
- tempData[1].data.time.push(dayjs(item.recTime).format("HH:mm"));
+ tempData[1].data.time.push(dayjs(item.recTime).format("MM.DD"));
tempData[1].data.input.push(item.inputNum);
tempData[1].data.output.push(item.outputNum);
})
@@ -117,7 +117,7 @@ function RightDown() {
let arrInner = [];
arrInner.push(dayjs(item.recTime).format("YYYY/MM/DD"),item.inputNum,item.outputNum);
arr3.push(arrInner);
- tempData[2].data.time.push(dayjs(item.recTime).format("HH:mm"));
+ tempData[2].data.time.push(dayjs(item.recTime).format("MM.DD"));
tempData[2].data.input.push(item.inputNum);
tempData[2].data.output.push(item.outputNum);
})
diff --git a/src/page/LinePage4-2/Right/RightUp.tsx b/src/page/LinePage4-2/Right/RightUp.tsx
index a13347c..d7ef0b0 100644
--- a/src/page/LinePage4-2/Right/RightUp.tsx
+++ b/src/page/LinePage4-2/Right/RightUp.tsx
@@ -12,14 +12,14 @@ function RightUp() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [70, 90, 106, 114],
+ columnWidth: [55, 115, 100, 110],
data: [],
};
let arr:any = []
// @ts-ignore
- if (data.sumProductionDets && data.sumProductionDets.length > 0) {
+ if (data.sectionDet && data.sectionDet.length > 0) {
// @ts-ignore
- data.sumProductionDets.map((item, index) => {
+ data.sectionDet.map((item, index) => {
let arrInner = []
arrInner.push(index + 1, item.lineName, item.inputNum, item.outputNum)
arr.push(arrInner)
diff --git a/src/page/LinePage4-2/index.tsx b/src/page/LinePage4-2/index.tsx
index daf9389..711294a 100644
--- a/src/page/LinePage4-2/index.tsx
+++ b/src/page/LinePage4-2/index.tsx
@@ -3,7 +3,27 @@ import TopP from "./TopP";
import Left from "./Left";
import Right from "./Right";
import Center from "./Center";
+import {useEffect} from 'react';
+import {useNavigate} from "react-router-dom";
function LinePage() {
+ const navigate = useNavigate();
+ useEffect(() => {
+ const handleKeyDown = (event:any) => {
+ if (event.key === 'ArrowUp') {
+ console.log('LDPage向上键被按下');
+ navigate('/LD?lineId=4-2');
+ // 执行向上键的逻辑
+ } else if (event.key === 'ArrowDown') {
+ console.log('LDPage向下键被按下');
+ // 执行向下键的逻辑
+ navigate('/LD?lineId=4-2');
+ }
+ }
+ window.addEventListener('keydown', handleKeyDown);
+ return () => {
+ window.removeEventListener('keydown', handleKeyDown);
+ };
+ });
return (
diff --git a/src/page/LinePage5-1/Center/CenterDown.tsx b/src/page/LinePage5-1/Center/CenterDown.tsx
index dc6ffea..71fdcf1 100644
--- a/src/page/LinePage5-1/Center/CenterDown.tsx
+++ b/src/page/LinePage5-1/Center/CenterDown.tsx
@@ -1,7 +1,7 @@
import ReactECharts from "echarts-for-react";
import TitleBox from "../Component/TitleBox";
import ScrollBoard from "./../../Component/ScrollBoard";
-import SwitchButton from "../Component/SwitchButton";
+// import SwitchButton from "../Component/SwitchButton";
import { useState } from "react";
import getOptions from "../../Component/LineChart/chart.config";
import {useAppSelector} from "./../../../store/hooks"
@@ -29,10 +29,10 @@ function CenterDown() {
{ name: "周", ename: "week" },
{ name: "月", ename: "month" },
];
- const [activeName, setActiveName] = useState(nameList[0].ename);
- const handleButtonChange = (activeName: string) => {
- setActiveName(activeName);
- };
+ const [activeName, setActiveName] = useState(nameList[1].ename);
+ // const handleButtonChange = (activeName: string) => {
+ // setActiveName(activeName);
+ // };
const config = {
header: ["序号", "报警时间", "报警设备", "报警内容"],
headerHeight: 36,
@@ -41,7 +41,7 @@ function CenterDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [80, 137, 137, 137],
+ columnWidth: [80, 137, 177, 97],
data: []
};
// 报警数据
@@ -64,7 +64,7 @@ function CenterDown() {
});
}
config.data = arr
- // 产线成品率
+ // 工段成品率
// @ts-ignore
if (data.todayProductionRates && Object.keys(data.todayProductionRates).length > 0) {
// @ts-ignore
@@ -181,12 +181,12 @@ function CenterDown() {
)}
- {/* 产线成品率 */}
+ {/* 工段成品率 */}
-
*/}
{chartData.xData.length>0 && (
{
}
diff --git a/src/page/LinePage5-1/Component/TitleBox/index.tsx b/src/page/LinePage5-1/Component/TitleBox/index.tsx
index 6579889..6d654c1 100644
--- a/src/page/LinePage5-1/Component/TitleBox/index.tsx
+++ b/src/page/LinePage5-1/Component/TitleBox/index.tsx
@@ -14,12 +14,12 @@ function TitleBox(props: titleProps) {
case "left_up":
return {
img: Defect,
- title: "产线报废汇总",
+ title: "工段报废汇总",
};
case "left_down":
return {
img: Record,
- title: "当前产线报废情况",
+ title: "工序报废情况",
};
case "center_down_left":
return {
@@ -29,12 +29,12 @@ function TitleBox(props: titleProps) {
case "center_down_right":
return {
img: Finished,
- title: "产线成品率",
+ title: "工段成品率",
};
case "right_up":
return {
img: Num,
- title: "各产线总投入和产出",
+ title: "各工段总投入和产出",
};
default:
return {
diff --git a/src/page/LinePage5-1/Left/LeftDown.tsx b/src/page/LinePage5-1/Left/LeftDown.tsx
index a12ee94..c9dcf16 100644
--- a/src/page/LinePage5-1/Left/LeftDown.tsx
+++ b/src/page/LinePage5-1/Left/LeftDown.tsx
@@ -25,7 +25,7 @@ function LeftDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [73, 117, 190],
+ columnWidth: [73, 200, 107],
data: [
["1", "磨边后", 224],
["2", "包装1", 322],
@@ -40,7 +40,7 @@ function LeftDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [73, 117, 190],
+ columnWidth: [73, 200, 107],
data: [
["1", "磨边后", 1119],
["2", "包装1", 1798],
@@ -55,7 +55,7 @@ function LeftDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [73, 117, 190],
+ columnWidth: [73, 200, 107],
data: [
["1", "磨边后", 5004],
["2", "包装1", 9122],
@@ -65,7 +65,9 @@ function LeftDown() {
const color1 = ["#9DD5FF", "#1295FF"];
const color2 = ["#85F6E9", "#2EC6B4"];
// @ts-ignore
- let xData: string[] = data.scrapBars
+ let xData1: string[] = [];
+ let xData2: string[] = [];
+ let xData3: string[] = [];
let dataProps1: number[] = [];
let dataProps2: number[] = [];
let dataProps3: number[] = [];
@@ -77,9 +79,10 @@ function LeftDown() {
// @ts-ignore
data.todayProductionScraps.map((item,index)=>{
let arrInner = [];
- arrInner.push(index+1,item.sectionName,item.scrapNum);
+ arrInner.push(index+1,item.sectionName,item.scrapNum || 0);
arr1.push(arrInner);
- dataProps1.push(item.scrapNum);
+ xData1.push(item.sectionName);
+ dataProps1.push(item.scrapNum || 0);
})
}else{
dataProps1 = []
@@ -89,9 +92,10 @@ function LeftDown() {
// @ts-ignore
data.weekProductionScraps.map((item,index)=>{
let arrInner = [];
- arrInner.push(index+1,item.sectionName,item.scrapNum);
+ arrInner.push(index+1,item.sectionName,item.scrapNum || 0);
arr2.push(arrInner);
- dataProps2.push(item.scrapNum);
+ xData2.push(item.sectionName);
+ dataProps2.push(item.scrapNum || 0);
})
}else{
dataProps2 = []
@@ -101,9 +105,10 @@ function LeftDown() {
// @ts-ignore
data.monthProductionScraps.map((item,index)=>{
let arrInner = [];
- arrInner.push(index+1,item.sectionName,item.scrapNum);
+ arrInner.push(index+1,item.sectionName,item.scrapNum || 0);
arr3.push(arrInner);
- dataProps3.push(item.scrapNum);
+ xData3.push(item.sectionName);
+ dataProps3.push(item.scrapNum || 0);
})
}else{
dataProps3 = []
@@ -111,9 +116,9 @@ function LeftDown() {
configDay.data = arr1;
configWeek.data = arr2;
configMonth.data = arr3;
- const options1 = getOptions(dataProps1,xData, color1);
- const options2 = getOptions(dataProps2,xData, color2);
- const options3 = getOptions(dataProps3,xData, color1);
+ const options1 = getOptions(dataProps1,xData1, color1);
+ const options2 = getOptions(dataProps2,xData2, color2);
+ const options3 = getOptions(dataProps3,xData3, color1);
return (
diff --git a/src/page/LinePage5-1/Left/LeftUp.tsx b/src/page/LinePage5-1/Left/LeftUp.tsx
index 0365d02..de4d768 100644
--- a/src/page/LinePage5-1/Left/LeftUp.tsx
+++ b/src/page/LinePage5-1/Left/LeftUp.tsx
@@ -54,21 +54,34 @@ function LeftUp() {
})
// @ts-ignore
dataSource.day.xData = Object.keys(data.todayAllProductionScraps)
- dataSource.day.xData.map((item,index)=>{
- let sumIner = 0
+ dataSource.day.xData.sort((a,b)=>{// 保证横坐标是有序的
// @ts-ignore
- data.todayAllProductionScraps[item].map((itemInner,indexInner)=>{
- sumIner += itemInner.scrapNum
- dataSource.day.series.map((itemSeries,indexSeries)=>{
+ const lastDigitA = parseInt(a[a.length - 1], 10);
+ // @ts-ignore
+ const lastDigitB = parseInt(b[b.length - 1], 10);
+ return lastDigitA - lastDigitB;
+ })
+ for (let k = 0; k < dataSource.day.xData.length; k++) {
+ let item = dataSource.day.xData[k];
+ let sumIner = 0
+ for(let i = 0;i < dataSource.day.series.length;i++){
+ let itemSeries = dataSource.day.series[i]
+ // @ts-ignore
+ data.todayAllProductionScraps[item].map((itemInner,indexInner)=>{
// @ts-ignore
- if (itemSeries.name === itemInner.sectionName) {
+ if (itemInner.sectionName.indexOf(itemSeries.name)!==-1) {
// @ts-ignore
- itemSeries.data.push(itemInner.scrapNum)
+ itemSeries.data.push(itemInner.scrapNum || 0)
+ sumIner += itemInner.scrapNum || 0
+ return
}
})
- })
+ if (itemSeries.data.length === k) {
+ itemSeries.data.push(0)
+ }
+ }
sum.push(sumIner)
- })
+ }
dataSource.day.series.push({
data: sum,
type: "bar",
@@ -109,21 +122,34 @@ function LeftUp() {
})
// @ts-ignore
dataSource.week.xData = Object.keys(data.weekAllProductionScraps)
- dataSource.week.xData.map((item,index)=>{
- let sumIner = 0
+ dataSource.week.xData.sort((a,b)=>{// 保证横坐标是有序的
// @ts-ignore
- data.weekAllProductionScraps[item].map((itemInner,indexInner)=>{
- sumIner += itemInner.scrapNum
- dataSource.week.series.map((itemSeries,indexSeries)=>{
+ const lastDigitA = parseInt(a[a.length - 1], 10);
+ // @ts-ignore
+ const lastDigitB = parseInt(b[b.length - 1], 10);
+ return lastDigitA - lastDigitB;
+ })
+ for (let k = 0; k < dataSource.week.xData.length; k++) {
+ let item = dataSource.week.xData[k];
+ let sumIner = 0
+ for(let i = 0;i < dataSource.week.series.length;i++){
+ let itemSeries = dataSource.week.series[i]
+ // @ts-ignore
+ data.weekAllProductionScraps[item].map((itemInner,indexInner)=>{
// @ts-ignore
- if (itemSeries.name === itemInner.sectionName) {
+ if (itemInner.sectionName.indexOf(itemSeries.name)!==-1) {
// @ts-ignore
- itemSeries.data.push(itemInner.scrapNum)
+ itemSeries.data.push(itemInner.scrapNum || 0)
+ sumIner += itemInner.scrapNum || 0
+ return
}
})
- })
+ if (itemSeries.data.length === k) {
+ itemSeries.data.push(0)
+ }
+ }
sum.push(sumIner)
- })
+ }
dataSource.week.series.push({
data: sum,
type: "bar",
@@ -164,21 +190,34 @@ function LeftUp() {
})
// @ts-ignore
dataSource.month.xData = Object.keys(data.monthAllProductionScraps)
- dataSource.month.xData.map((item,index)=>{
- let sumIner = 0
+ dataSource.month.xData.sort((a,b)=>{// 保证横坐标是有序的
// @ts-ignore
- data.monthAllProductionScraps[item].map((itemInner,indexInner)=>{
- sumIner += itemInner.scrapNum
- dataSource.month.series.map((itemSeries,indexSeries)=>{
+ const lastDigitA = parseInt(a[a.length - 1], 10);
+ // @ts-ignore
+ const lastDigitB = parseInt(b[b.length - 1], 10);
+ return lastDigitA - lastDigitB;
+ })
+ for (let k = 0; k < dataSource.month.xData.length; k++) {
+ let item = dataSource.month.xData[k];
+ let sumIner = 0
+ for(let i = 0;i < dataSource.month.series.length;i++){
+ let itemSeries = dataSource.month.series[i]
+ // @ts-ignore
+ data.monthAllProductionScraps[item].map((itemInner,indexInner)=>{
// @ts-ignore
- if (itemSeries.name === itemInner.sectionName) {
+ if (itemInner.sectionName.indexOf(itemSeries.name)!==-1) {
// @ts-ignore
- itemSeries.data.push(itemInner.scrapNum)
+ itemSeries.data.push(itemInner.scrapNum || 0)
+ sumIner += itemInner.scrapNum || 0
+ return
}
})
- })
+ if (itemSeries.data.length === k) {
+ itemSeries.data.push(0)
+ }
+ }
sum.push(sumIner)
- })
+ }
dataSource.month.series.push({
data: sum,
type: "bar",
@@ -198,6 +237,7 @@ function LeftUp() {
dataSource.month.series = []
}
const options = getOptions(chartData);
+ console.log('dataSource',dataSource)
return (
diff --git a/src/page/LinePage5-1/Right/RightDown.tsx b/src/page/LinePage5-1/Right/RightDown.tsx
index 86922ad..6b620cb 100644
--- a/src/page/LinePage5-1/Right/RightDown.tsx
+++ b/src/page/LinePage5-1/Right/RightDown.tsx
@@ -101,7 +101,7 @@ function RightDown() {
let arrInner = [];
arrInner.push(dayjs(item.recTime).format("YYYY/MM/DD"),item.inputNum,item.outputNum);
arr2.push(arrInner);
- tempData[1].data.time.push(dayjs(item.recTime).format("HH:mm"));
+ tempData[1].data.time.push(dayjs(item.recTime).format("MM.DD"));
tempData[1].data.input.push(item.inputNum);
tempData[1].data.output.push(item.outputNum);
})
@@ -117,7 +117,7 @@ function RightDown() {
let arrInner = [];
arrInner.push(dayjs(item.recTime).format("YYYY/MM/DD"),item.inputNum,item.outputNum);
arr3.push(arrInner);
- tempData[2].data.time.push(dayjs(item.recTime).format("HH:mm"));
+ tempData[2].data.time.push(dayjs(item.recTime).format("MM.DD"));
tempData[2].data.input.push(item.inputNum);
tempData[2].data.output.push(item.outputNum);
})
diff --git a/src/page/LinePage5-1/Right/RightUp.tsx b/src/page/LinePage5-1/Right/RightUp.tsx
index c55103e..4a8ed4e 100644
--- a/src/page/LinePage5-1/Right/RightUp.tsx
+++ b/src/page/LinePage5-1/Right/RightUp.tsx
@@ -12,14 +12,14 @@ function RightUp() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [70, 90, 106, 114],
+ columnWidth: [55, 115, 100, 110],
data: [],
};
let arr:any = []
// @ts-ignore
- if (data.sumProductionDets && data.sumProductionDets.length > 0) {
+ if (data.sectionDet && data.sectionDet.length > 0) {
// @ts-ignore
- data.sumProductionDets.map((item, index) => {
+ data.sectionDet.map((item, index) => {
let arrInner = []
arrInner.push(index + 1, item.lineName, item.inputNum, item.outputNum)
arr.push(arrInner)
diff --git a/src/page/LinePage5-1/index.tsx b/src/page/LinePage5-1/index.tsx
index daf9389..35689fb 100644
--- a/src/page/LinePage5-1/index.tsx
+++ b/src/page/LinePage5-1/index.tsx
@@ -3,7 +3,27 @@ import TopP from "./TopP";
import Left from "./Left";
import Right from "./Right";
import Center from "./Center";
+import {useEffect} from 'react';
+import {useNavigate} from "react-router-dom";
function LinePage() {
+ const navigate = useNavigate();
+ useEffect(() => {
+ const handleKeyDown = (event:any) => {
+ if (event.key === 'ArrowUp') {
+ console.log('LDPage向上键被按下');
+ navigate('/LD?lineId=5-1');
+ // 执行向上键的逻辑
+ } else if (event.key === 'ArrowDown') {
+ console.log('LDPage向下键被按下');
+ // 执行向下键的逻辑
+ navigate('/LD?lineId=5-1');
+ }
+ }
+ window.addEventListener('keydown', handleKeyDown);
+ return () => {
+ window.removeEventListener('keydown', handleKeyDown);
+ };
+ });
return (
diff --git a/src/page/LinePage5-2/Center/CenterDown.tsx b/src/page/LinePage5-2/Center/CenterDown.tsx
index 8e94275..fef412d 100644
--- a/src/page/LinePage5-2/Center/CenterDown.tsx
+++ b/src/page/LinePage5-2/Center/CenterDown.tsx
@@ -1,7 +1,7 @@
import ReactECharts from "echarts-for-react";
import TitleBox from "../Component/TitleBox";
import ScrollBoard from "./../../Component/ScrollBoard";
-import SwitchButton from "../Component/SwitchButton";
+// import SwitchButton from "../Component/SwitchButton";
import { useState } from "react";
import getOptions from "../../Component/LineChart/chart.config";
import {useAppSelector} from "./../../../store/hooks"
@@ -29,10 +29,10 @@ function CenterDown() {
{ name: "周", ename: "week" },
{ name: "月", ename: "month" },
];
- const [activeName, setActiveName] = useState(nameList[0].ename);
- const handleButtonChange = (activeName: string) => {
- setActiveName(activeName);
- };
+ const [activeName, setActiveName] = useState(nameList[1].ename);
+ // const handleButtonChange = (activeName: string) => {
+ // setActiveName(activeName);
+ // };
const config = {
header: ["序号", "报警时间", "报警设备", "报警内容"],
headerHeight: 36,
@@ -41,7 +41,7 @@ function CenterDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [80, 137, 137, 137],
+ columnWidth: [80, 137, 177, 97],
data: []
};
// 报警数据
@@ -64,7 +64,7 @@ function CenterDown() {
});
}
config.data = arr
- // 产线成品率
+ // 工段成品率
// @ts-ignore
if (data.todayProductionRates && Object.keys(data.todayProductionRates).length > 0) {
// @ts-ignore
@@ -181,12 +181,12 @@ function CenterDown() {
)}
- {/* 产线成品率 */}
+ {/* 工段成品率 */}
-
*/}
{chartData.xData.length>0 && (
{
}
diff --git a/src/page/LinePage5-2/Component/TitleBox/index.tsx b/src/page/LinePage5-2/Component/TitleBox/index.tsx
index 6579889..6d654c1 100644
--- a/src/page/LinePage5-2/Component/TitleBox/index.tsx
+++ b/src/page/LinePage5-2/Component/TitleBox/index.tsx
@@ -14,12 +14,12 @@ function TitleBox(props: titleProps) {
case "left_up":
return {
img: Defect,
- title: "产线报废汇总",
+ title: "工段报废汇总",
};
case "left_down":
return {
img: Record,
- title: "当前产线报废情况",
+ title: "工序报废情况",
};
case "center_down_left":
return {
@@ -29,12 +29,12 @@ function TitleBox(props: titleProps) {
case "center_down_right":
return {
img: Finished,
- title: "产线成品率",
+ title: "工段成品率",
};
case "right_up":
return {
img: Num,
- title: "各产线总投入和产出",
+ title: "各工段总投入和产出",
};
default:
return {
diff --git a/src/page/LinePage5-2/Left/LeftDown.tsx b/src/page/LinePage5-2/Left/LeftDown.tsx
index 7f35755..ff14474 100644
--- a/src/page/LinePage5-2/Left/LeftDown.tsx
+++ b/src/page/LinePage5-2/Left/LeftDown.tsx
@@ -25,7 +25,7 @@ function LeftDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [73, 117, 190],
+ columnWidth: [73, 200, 107],
data: [
["1", "磨边后", 224],
["2", "包装1", 322],
@@ -40,7 +40,7 @@ function LeftDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [73, 117, 190],
+ columnWidth: [73, 200, 107],
data: [
["1", "磨边后", 1119],
["2", "包装1", 1798],
@@ -55,7 +55,7 @@ function LeftDown() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [73, 117, 190],
+ columnWidth: [73, 200, 107],
data: [
["1", "磨边后", 5004],
["2", "包装1", 9122],
@@ -65,7 +65,9 @@ function LeftDown() {
const color1 = ["#9DD5FF", "#1295FF"];
const color2 = ["#85F6E9", "#2EC6B4"];
// @ts-ignore
- let xData: string[] = data.scrapBars
+ let xData1: string[] = [];
+ let xData2: string[] = [];
+ let xData3: string[] = [];
let dataProps1: number[] = [];
let dataProps2: number[] = [];
let dataProps3: number[] = [];
@@ -77,9 +79,10 @@ function LeftDown() {
// @ts-ignore
data.todayProductionScraps.map((item,index)=>{
let arrInner = [];
- arrInner.push(index+1,item.sectionName,item.scrapNum);
+ arrInner.push(index+1,item.sectionName,item.scrapNum || 0);
arr1.push(arrInner);
- dataProps1.push(item.scrapNum);
+ xData1.push(item.sectionName);
+ dataProps1.push(item.scrapNum || 0);
})
}else{
dataProps1 = []
@@ -89,9 +92,10 @@ function LeftDown() {
// @ts-ignore
data.weekProductionScraps.map((item,index)=>{
let arrInner = [];
- arrInner.push(index+1,item.sectionName,item.scrapNum);
+ arrInner.push(index+1,item.sectionName,item.scrapNum || 0);
arr2.push(arrInner);
- dataProps2.push(item.scrapNum);
+ xData2.push(item.sectionName);
+ dataProps2.push(item.scrapNum || 0);
})
}else{
dataProps2 = []
@@ -101,9 +105,10 @@ function LeftDown() {
// @ts-ignore
data.monthProductionScraps.map((item,index)=>{
let arrInner = [];
- arrInner.push(index+1,item.sectionName,item.scrapNum);
+ arrInner.push(index+1,item.sectionName,item.scrapNum || 0);
arr3.push(arrInner);
- dataProps3.push(item.scrapNum);
+ xData3.push(item.sectionName);
+ dataProps3.push(item.scrapNum || 0);
})
}else{
dataProps3 = []
@@ -111,9 +116,9 @@ function LeftDown() {
configDay.data = arr1;
configWeek.data = arr2;
configMonth.data = arr3;
- const options1 = getOptions(dataProps1,xData, color1);
- const options2 = getOptions(dataProps2,xData, color2);
- const options3 = getOptions(dataProps3,xData, color1);
+ const options1 = getOptions(dataProps1,xData1, color1);
+ const options2 = getOptions(dataProps2,xData2, color2);
+ const options3 = getOptions(dataProps3,xData3, color1);
return (
diff --git a/src/page/LinePage5-2/Left/LeftUp.tsx b/src/page/LinePage5-2/Left/LeftUp.tsx
index a0a946e..61c9eb4 100644
--- a/src/page/LinePage5-2/Left/LeftUp.tsx
+++ b/src/page/LinePage5-2/Left/LeftUp.tsx
@@ -54,21 +54,34 @@ function LeftUp() {
})
// @ts-ignore
dataSource.day.xData = Object.keys(data.todayAllProductionScraps)
- dataSource.day.xData.map((item,index)=>{
- let sumIner = 0
+ dataSource.day.xData.sort((a,b)=>{// 保证横坐标是有序的
// @ts-ignore
- data.todayAllProductionScraps[item].map((itemInner,indexInner)=>{
- sumIner += itemInner.scrapNum
- dataSource.day.series.map((itemSeries,indexSeries)=>{
+ const lastDigitA = parseInt(a[a.length - 1], 10);
+ // @ts-ignore
+ const lastDigitB = parseInt(b[b.length - 1], 10);
+ return lastDigitA - lastDigitB;
+ })
+ for (let k = 0; k < dataSource.day.xData.length; k++) {
+ let item = dataSource.day.xData[k];
+ let sumIner = 0
+ for(let i = 0;i < dataSource.day.series.length;i++){
+ let itemSeries = dataSource.day.series[i]
+ // @ts-ignore
+ data.todayAllProductionScraps[item].map((itemInner,indexInner)=>{
// @ts-ignore
- if (itemSeries.name === itemInner.sectionName) {
+ if (itemInner.sectionName.indexOf(itemSeries.name)!==-1) {
// @ts-ignore
- itemSeries.data.push(itemInner.scrapNum)
+ itemSeries.data.push(itemInner.scrapNum || 0)
+ sumIner += itemInner.scrapNum || 0
+ return
}
})
- })
+ if (itemSeries.data.length === k) {
+ itemSeries.data.push(0)
+ }
+ }
sum.push(sumIner)
- })
+ }
dataSource.day.series.push({
data: sum,
type: "bar",
@@ -109,21 +122,34 @@ function LeftUp() {
})
// @ts-ignore
dataSource.week.xData = Object.keys(data.weekAllProductionScraps)
- dataSource.week.xData.map((item,index)=>{
- let sumIner = 0
+ dataSource.week.xData.sort((a,b)=>{// 保证横坐标是有序的
// @ts-ignore
- data.weekAllProductionScraps[item].map((itemInner,indexInner)=>{
- sumIner += itemInner.scrapNum
- dataSource.week.series.map((itemSeries,indexSeries)=>{
+ const lastDigitA = parseInt(a[a.length - 1], 10);
+ // @ts-ignore
+ const lastDigitB = parseInt(b[b.length - 1], 10);
+ return lastDigitA - lastDigitB;
+ })
+ for (let k = 0; k < dataSource.week.xData.length; k++) {
+ let item = dataSource.week.xData[k];
+ let sumIner = 0
+ for(let i = 0;i < dataSource.week.series.length;i++){
+ let itemSeries = dataSource.week.series[i]
+ // @ts-ignore
+ data.weekAllProductionScraps[item].map((itemInner,indexInner)=>{
// @ts-ignore
- if (itemSeries.name === itemInner.sectionName) {
+ if (itemInner.sectionName.indexOf(itemSeries.name)!==-1) {
// @ts-ignore
- itemSeries.data.push(itemInner.scrapNum)
+ itemSeries.data.push(itemInner.scrapNum || 0)
+ sumIner += itemInner.scrapNum || 0
+ return
}
})
- })
+ if (itemSeries.data.length === k) {
+ itemSeries.data.push(0)
+ }
+ }
sum.push(sumIner)
- })
+ }
dataSource.week.series.push({
data: sum,
type: "bar",
@@ -164,21 +190,34 @@ function LeftUp() {
})
// @ts-ignore
dataSource.month.xData = Object.keys(data.monthAllProductionScraps)
- dataSource.month.xData.map((item,index)=>{
- let sumIner = 0
+ dataSource.month.xData.sort((a,b)=>{// 保证横坐标是有序的
// @ts-ignore
- data.monthAllProductionScraps[item].map((itemInner,indexInner)=>{
- sumIner += itemInner.scrapNum
- dataSource.month.series.map((itemSeries,indexSeries)=>{
+ const lastDigitA = parseInt(a[a.length - 1], 10);
+ // @ts-ignore
+ const lastDigitB = parseInt(b[b.length - 1], 10);
+ return lastDigitA - lastDigitB;
+ })
+ for (let k = 0; k < dataSource.month.xData.length; k++) {
+ let item = dataSource.month.xData[k];
+ let sumIner = 0
+ for(let i = 0;i < dataSource.month.series.length;i++){
+ let itemSeries = dataSource.month.series[i]
+ // @ts-ignore
+ data.monthAllProductionScraps[item].map((itemInner,indexInner)=>{
// @ts-ignore
- if (itemSeries.name === itemInner.sectionName) {
+ if (itemInner.sectionName.indexOf(itemSeries.name)!==-1) {
// @ts-ignore
- itemSeries.data.push(itemInner.scrapNum)
+ itemSeries.data.push(itemInner.scrapNum || 0)
+ sumIner += itemInner.scrapNum || 0
+ return
}
})
- })
+ if (itemSeries.data.length === k) {
+ itemSeries.data.push(0)
+ }
+ }
sum.push(sumIner)
- })
+ }
dataSource.month.series.push({
data: sum,
type: "bar",
@@ -198,6 +237,7 @@ function LeftUp() {
dataSource.month.series = []
}
const options = getOptions(chartData);
+ console.log('dataSource',dataSource)
return (
diff --git a/src/page/LinePage5-2/Right/RightDown.tsx b/src/page/LinePage5-2/Right/RightDown.tsx
index a3a1c54..9d38343 100644
--- a/src/page/LinePage5-2/Right/RightDown.tsx
+++ b/src/page/LinePage5-2/Right/RightDown.tsx
@@ -100,7 +100,7 @@ function RightDown() {
let arrInner = [];
arrInner.push(dayjs(item.recTime).format("YYYY/MM/DD"),item.inputNum,item.outputNum);
arr2.push(arrInner);
- tempData[1].data.time.push(dayjs(item.recTime).format("HH:mm"));
+ tempData[1].data.time.push(dayjs(item.recTime).format("MM.DD"));
tempData[1].data.input.push(item.inputNum);
tempData[1].data.output.push(item.outputNum);
})
@@ -116,7 +116,7 @@ function RightDown() {
let arrInner = [];
arrInner.push(dayjs(item.recTime).format("YYYY/MM/DD"),item.inputNum,item.outputNum);
arr3.push(arrInner);
- tempData[2].data.time.push(dayjs(item.recTime).format("HH:mm"));
+ tempData[2].data.time.push(dayjs(item.recTime).format("MM.DD"));
tempData[2].data.input.push(item.inputNum);
tempData[2].data.output.push(item.outputNum);
})
diff --git a/src/page/LinePage5-2/Right/RightUp.tsx b/src/page/LinePage5-2/Right/RightUp.tsx
index 4644deb..c35c8d3 100644
--- a/src/page/LinePage5-2/Right/RightUp.tsx
+++ b/src/page/LinePage5-2/Right/RightUp.tsx
@@ -12,14 +12,14 @@ function RightUp() {
headerBGC: "rgba(79, 114, 136, 0.3)",
oddRowBGC: "rgba(79, 114, 136, 0.3)",
evenRowBGC: "rgba(76, 97, 123, 0.1)",
- columnWidth: [70, 90, 106, 114],
+ columnWidth: [55, 115, 100, 110],
data: [],
};
let arr:any = []
// @ts-ignore
- if (data.sumProductionDets && data.sumProductionDets.length > 0) {
+ if (data.sectionDet && data.sectionDet.length > 0) {
// @ts-ignore
- data.sumProductionDets.map((item, index) => {
+ data.sectionDet.map((item, index) => {
let arrInner = []
arrInner.push(index + 1, item.lineName, item.inputNum, item.outputNum)
arr.push(arrInner)
diff --git a/src/page/LinePage5-2/index.tsx b/src/page/LinePage5-2/index.tsx
index daf9389..b08e90e 100644
--- a/src/page/LinePage5-2/index.tsx
+++ b/src/page/LinePage5-2/index.tsx
@@ -3,7 +3,27 @@ import TopP from "./TopP";
import Left from "./Left";
import Right from "./Right";
import Center from "./Center";
+import {useEffect} from 'react';
+import {useNavigate} from "react-router-dom";
function LinePage() {
+ const navigate = useNavigate();
+ useEffect(() => {
+ const handleKeyDown = (event:any) => {
+ if (event.key === 'ArrowUp') {
+ console.log('LDPage向上键被按下');
+ navigate('/LD?lineId=5-2');
+ // 执行向上键的逻辑
+ } else if (event.key === 'ArrowDown') {
+ console.log('LDPage向下键被按下');
+ // 执行向下键的逻辑
+ navigate('/LD?lineId=5-2');
+ }
+ }
+ window.addEventListener('keydown', handleKeyDown);
+ return () => {
+ window.removeEventListener('keydown', handleKeyDown);
+ };
+ });
return (
diff --git a/src/page/TestPage/CenterUp.tsx b/src/page/TestPage/CenterUp.tsx
deleted file mode 100644
index ea62ec1..0000000
--- a/src/page/TestPage/CenterUp.tsx
+++ /dev/null
@@ -1,41 +0,0 @@
-import React, { useState } from "react"; // 使用useState钩子来管理状态
-import intl from "react-intl-universal";
-import '../../lanhuapp/common.css';
-import "../../lanhuapp/index.css";
-import "../style/standard.css"
-// import MybabylonJS_1 from "../../babylonjs/MybabylonJS_1";
-// import MybabylonJS_2 from "../../babylonjs/MybabylonJS_2";
-import { number } from "echarts";
-import { firePixelShader } from "@babylonjs/materials/fire/fire.fragment";
-
-function CenterUp() {
-
-// 使用 useState 钩子来管理当前的序号状态
-const [modelIndex, setModelIndex] = useState(1); // 默认序号为 1
-
-// 定义切换模型序号的函数
-const prevModelIndex = () => {
- // 当前序号减 1，如果小于 1，则变为 5
- setModelIndex((currentModelIndex) => (currentModelIndex - 1 + 5) % 5);
-};
-
-const nextModelIndex = () => {
- // 当前序号加 1，如果大于 5，则变为 1
- setModelIndex((currentModelIndex) => (currentModelIndex + 1) % 5);
-};
-
-
-
- return (
-
-
- {/*
*/}
- {/* 添加按钮来切换组件 */}
-
-
-
{modelIndex}
-
TestPage Line{LineID}
- 3434
- {/* */}
-
- );
-}
-
-export default TestPage;
\ No newline at end of file
diff --git a/src/page/style/linePage.css b/src/page/style/linePage.css
index 1a28491..30fbd19 100644
--- a/src/page/style/linePage.css
+++ b/src/page/style/linePage.css
@@ -100,7 +100,7 @@
.center_down .right_box .chart_box {
width: 100%;
height: 310px;
- margin-top: 10px;
+ margin-top: 5px;
}
.right_up {
width: 401px;
@@ -230,7 +230,7 @@
right: 0px;
bottom: 0px;
z-index: 1002;
- width: 240px;
+ width: 270px;
height: 110px;
background: url(/public/png/lp/eq_msg_detail.png) 100% no-repeat;
background-size: 100% 100%;
diff --git a/src/store/UpdateData.tsx b/src/store/UpdateData.tsx
index fbebd28..c8162ab 100644
--- a/src/store/UpdateData.tsx
+++ b/src/store/UpdateData.tsx
@@ -1,5 +1,5 @@
import React, {useState} from "react";
-import {useAppDispatch, useAppSelector} from "./hooks";
+import {useAppDispatch} from "./hooks";
import axios from "axios";
import {
@@ -15,62 +15,13 @@ import {
UpdateLine5After
} from "./LinePageSlice"
import { UpdateAllLine } from "./LeaderPageSlice"
-// let initLineGlassStatus: Object = {
-// LINE_1_1: 1,
-// LINE_1_2U: 1,
-// LINE_1_2D: 1,
-// LINE_1_3: 1,
-// LINE_1_4: 1,
-// LINE_2_1: 1,
-// LINE_2_2U: 1,
-// LINE_2_2D: 1,
-// LINE_2_3: 1,
-// LINE_2_4: 1,
-// LINE_3_1: 1,
-// LINE_3_2U: 1,
-// LINE_3_2D: 1,
-// LINE_3_3: 1,
-// LINE_3_4: 1,
-// LINE_4_1: 1,
-// LINE_4_2U: 1,
-// LINE_4_2D: 1,
-// LINE_4_3: 1,
-// LINE_4_4: 1,
-// }
-
-// function PrepareGlassStatus(action: string) {
-// let FinalGlassStatus = initLineGlassStatus;
-// if (action.includes('客户端')) {
-// return FinalGlassStatus;
-// } else {
-// const ProductionMonitoringEntityData = JSON.parse(action);
-// let JsonData = ProductionMonitoringEntityData.lineGlassStatus;
-// // console.log(JsonData)
-
-// let keys: Array = [];
-// let values: Array = []
-// let newJson = new Object();
-// JsonData.map((item: SingleGlassStatus) => {
-// keys.push(item.lineViewCode);
-// values.push(item.status);
-// })
-// for (let i = 0; i < keys.length; i++) {
-// let keyName = keys[i];
-// // @ts-ignore
-// newJson[keyName] = values[i];
-// }
-// FinalGlassStatus = newJson;
-// // console.log(FinalGlassStatus)
-// return FinalGlassStatus;
-// }
-// }
-
function UpdateData() {
const [myUrl, setUrl] = useState('')
axios.get('/wsconfig.json')
.then((r) => {
setUrl(r.data.url)
})
+ let websocketAllLine = null;
let websocket1_1 = null;
let websocket1_2 = null;
let websocket2_1 = null;
@@ -82,65 +33,8 @@ function UpdateData() {
let websocket5_1 = null;
let websocket5_2 = null;
const dispatch = useAppDispatch();
- // 测试接口开始===================
- axios.defaults.headers.common['Authorization'] = 'Bearer test1';
- axios.defaults.headers.common['tenant-id'] = 1;
- console.log('===========')
- axios.get('http://172.16.32.40:48080/admin-api/monitoring/ViewController/driveMonitoring')
- .then((res) => {
- dispatch(UpdateAllLine(res.data));
- // console.log(res)
- })
- return (
- null
- )
- // axios.get(myUrl + '/admin-api/monitoring/ViewController/productionMonitoring?key=1-1')
- // .then((res) => {
- // dispatch(UpdateLine1Before(res.data));
- // })
- // axios.get(myUrl + '/admin-api/monitoring/ViewController/productionMonitoring?key=1-2')
- // .then((res) => {
- // dispatch(UpdateLine1After(res.data));
- // })
- // axios.get(myUrl + '/admin-api/monitoring/ViewController/productionMonitoring?key=2-1')
- // .then((res) => {
- // dispatch(UpdateLine2Before(res.data));
- // })
- // axios.get(myUrl + '/admin-api/monitoring/ViewController/productionMonitoring?key=2-2')
- // .then((res) => {
- // dispatch(UpdateLine2After(res.data));
- // })
- // axios.get(myUrl + '/admin-api/monitoring/ViewController/productionMonitoring?key=3-1')
- // .then((res) => {
- // dispatch(UpdateLine3Before(res.data));
- // })
- // axios.get(myUrl + '/admin-api/monitoring/ViewController/productionMonitoring?key=3-2')
- // .then((res) => {
- // dispatch(UpdateLine3After(res.data));
- // })
- // axios.get(myUrl + '/admin-api/monitoring/ViewController/productionMonitoring?key=4-1')
- // .then((res) => {
- // dispatch(UpdateLine4Before(res.data));
- // })
- // axios.get(myUrl + '/admin-api/monitoring/ViewController/productionMonitoring?key=4-2')
- // .then((res) => {
- // dispatch(UpdateLine4After(res.data));
- // })
- // axios.get(myUrl + '/admin-api/monitoring/ViewController/productionMonitoring?key=5-1')
- // .then((res) => {
- // dispatch(UpdateLine5Before(res.data));
- // })
- // axios.get(myUrl + '/admin-api/monitoring/ViewController/productionMonitoring?key=5-2')
- // .then((res) => {
- // dispatch(UpdateLine5After(res.data));
- // })
- // console.log('===========================================')
- // return (
- // null
- // )
- // 测试接口结束====================
if ('WebSocket' in window) {
- // websocketAllLine = new WebSocket("ws://" + myUrl + "/admin-api/monitoring/ViewController/driveMonitoring");
+ websocketAllLine = new WebSocket("ws://" + myUrl + "/websocket/message?userId=all");
websocket1_1 = new WebSocket("ws://" + myUrl + "/websocket/message?userId=1-1");
websocket1_2 = new WebSocket("ws://" + myUrl + "/websocket/message?userId=1-2");
websocket2_1 = new WebSocket("ws://" + myUrl + "/websocket/message?userId=2-1");
@@ -156,6 +50,10 @@ function UpdateData() {
alert('Not support websocket');
}
// @ts-ignore
+ websocketAllLine.onopen = function (event) {
+ console.log("websocketAllLine-open");
+ }
+ // @ts-ignore
websocket1_1.onopen = function (event) {
console.log("websocket1_1-open");
}
@@ -197,6 +95,17 @@ function UpdateData() {
}
//接收到消息的回调方法
// @ts-ignore
+ websocketAllLine.onmessage = function (event) {
+ let msgData = event.data
+ try {
+ msgData = JSON.parse(event.data);
+ } catch (error) {
+ console.log("websocket: [unable to msgData] : ", event.data);
+ }
+ if (!Object.prototype.toString.call(msgData).includes('Object')) return;
+ dispatch(UpdateAllLine(msgData));
+ }
+ // @ts-ignore
websocket1_1.onmessage = function (event) {
let msgData = event.data
try {
@@ -306,9 +215,7 @@ function UpdateData() {
if (!Object.prototype.toString.call(msgData).includes('Object')) return;
dispatch(UpdateLine5After(msgData));
}
- // return (
- // null
- // )
+ return null;
}
export default UpdateData;
\ No newline at end of file