mt-fe-group/luoyang-screen
9
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

2.21日版

Browse Source
This commit is contained in:
朱菊兰
2025-02-21 11:10:35 +08:00
parent 128b362587
commit 1812afd680
89 changed files with 1420 additions and 995 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
src/page/LinePage1-2/Center/CenterDown.tsx
View File

@@ -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<string>(nameList[0].ename);
const handleButtonChange = (activeName: string) => {
setActiveName(activeName);
};
const [activeName, setActiveName] = useState<string>(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() {
</p>)}
</div>
</div>
{/* 产线成品率 */}
{/* 工段成品率 */}
<div className="center_down_inner flex-col right_box">
<TitleBox title={"center_down_right"} />
<div className="left_up_switch">
{/* <div className="left_up_switch">
<SwitchButton nameList={nameList} onChange={handleButtonChange} />
</div>
</div> */}
{chartData.xData.length>0 && (
<div className="chart_box">
{<ReactECharts option={options} style={{ height: "100%" }} />}

8
src/page/LinePage1-2/Component/TitleBox/index.tsx
View File

@@ -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 {

31
src/page/LinePage1-2/Left/LeftDown.tsx
View File

@@ -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 (
<div className="left_down">
<TitleBox title={"left_down"} />

94
src/page/LinePage1-2/Left/LeftUp.tsx
View File

@@ -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 (
<div className="left_up">
<TitleBox title={"left_up"} />

4
src/page/LinePage1-2/Right/RightDown.tsx
View File

@@ -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);
})

6
src/page/LinePage1-2/Right/RightUp.tsx
View File

@@ -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)

20
src/page/LinePage1-2/index.tsx
View File

@@ -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 (
<React.Fragment>
<TopP />