zhp #8

Merged
juzi merged 2 commits from zhp into features/warning 2024-09-14 13:21:58 +08:00
14 changed files with 145 additions and 81 deletions
Showing only changes of commit a8b5e57f38 - Show all commits

Binary file not shown.

Before

Width:  |  Height:  |  Size: 41 KiB

After

Width:  |  Height:  |  Size: 43 KiB

View File

@ -1,7 +1,7 @@
/* /*
* @Author: zhp * @Author: zhp
* @Date: 2024-08-29 09:46:11 * @Date: 2024-08-29 09:46:11
* @LastEditTime: 2024-09-13 16:27:51 * @LastEditTime: 2024-09-14 09:20:36
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
*/ */
@ -19,9 +19,7 @@ function BlueRect(props) {
const [isVisible, setIsVisible] = useState(false); const [isVisible, setIsVisible] = useState(false);
const [chartData, setChartData] = useState(null); const [chartData, setChartData] = useState(null);
const updateVisibilityState = (newVisibilityState) => { const updateVisibilityState = (newVisibilityState) => {
console.log(newVisibilityState)
setIsVisible(!newVisibilityState); setIsVisible(!newVisibilityState);
console.log(`Parent's isVisible updated to: ${newVisibilityState}`);
// isVisible // isVisible
}; };
// const parentRef = useRef(null); // const parentRef = useRef(null);

View File

@ -1,6 +1,6 @@
.bottomBarItem { .bottomBarItem {
background: url(../../../assets/pointsBack.png) no-repeat; background: url(../../../assets/pointsBack.png) no-repeat;
background-size: 100% 100%; background-size: 100% 100%;
width: 551px; width: 761px;
height: 335px; height: 335px;
} }

View File

@ -33,6 +33,7 @@ function KilnCenter({ onFloorChange }) {
position: "absolute", position: "absolute",
top: "12%", top: "12%",
display: "flex", display: "flex",
zIndex:99,
flexDirection: "column", flexDirection: "column",
}} }}
> >
@ -40,7 +41,7 @@ function KilnCenter({ onFloorChange }) {
{floor === 4 && ( {floor === 4 && (
<div <div
className="fireAndTime" className="fireAndTime"
style={{ position: "absolute", top: "-112px", height: "400px" }} style={{ position: "absolute", top: "-112px", height: "212px" }}
> >
<Chart1 /> <Chart1 />
</div> </div>

View File

@ -1,7 +1,7 @@
/* /*
* @Author: zhp * @Author: zhp
* @Date: 2024-08-28 15:27:46 * @Date: 2024-08-28 15:27:46
* @LastEditTime: 2024-09-12 15:28:17 * @LastEditTime: 2024-09-14 08:39:56
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
*/ */
@ -47,7 +47,7 @@ function FloorTwoToOne(props) {
left: "0px", left: "0px",
width: "calc(100% - 500px)", width: "calc(100% - 500px)",
height: "calc(100% - 7px)", height: "calc(100% - 7px)",
zIndex: 998, zIndex: -99,
overflow: "clip", overflow: "clip",
}} }}
initial={{ opacity: 0 }} initial={{ opacity: 0 }}

View File

@ -1,7 +1,7 @@
/* /*
* @Author: zhp * @Author: zhp
* @Date: 2024-09-12 13:44:55 * @Date: 2024-09-12 13:44:55
* @LastEditTime: 2024-09-13 14:53:34 * @LastEditTime: 2024-09-14 09:21:16
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
*/ */
@ -14,7 +14,7 @@ import React, { useContext,useEffect,useState} from 'react'
import { HomeContext } from '../../../../../pages/Home'; import { HomeContext } from '../../../../../pages/Home';
function generateRandomArray(data) { function generateRandomArray(data) {
const randomArray = []; const randomArray = [];
for (let i = 0; i < 24; i++) { for (let i = 0; i < 25; i++) {
let randomNumber; let randomNumber;
do { do {
randomNumber = ((Math.random() * (data - 1)).toFixed(1)); randomNumber = ((Math.random() * (data - 1)).toFixed(1));

View File

@ -39,7 +39,7 @@
border-radius: 100%; border-radius: 100%;
top: 50%; top: 50%;
background-color: rgba(255, 194, 20, 1); background-color: rgba(255, 194, 20, 1);
left: -1.1vw; left: -27px;
transform: translateY(-50%) translateX(50%); transform: translateY(-50%) translateX(50%);
} }
.block{ .block{
@ -75,6 +75,6 @@
background-color: rgba(0, 255, 245, 1); background-color: rgba(0, 255, 245, 1);
border-radius: 100%; border-radius: 100%;
top: 50%; top: 50%;
left: -1.1vw; left: -27px;
transform: translateY(-50%) translateX(50%); transform: translateY(-50%) translateX(50%);
} }

View File

@ -1,7 +1,7 @@
/* /*
* @Author: zhp * @Author: zhp
* @Date: 2024-08-28 09:25:58 * @Date: 2024-08-28 09:25:58
* @LastEditTime: 2024-09-13 14:22:01 * @LastEditTime: 2024-09-14 09:05:44
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
*/ */
@ -9,7 +9,7 @@
export default function getOptions(data, times, range, yName,forecastList,color,color1,areaStyle,areaStyle1) { export default function getOptions(data, times, range, yName,forecastList,color,color1,areaStyle,areaStyle1) {
return { return {
grid: { top: 38, right: 44, bottom: 20, left: 48 }, grid: { top: 38, right: 0, bottom: 20, left: 48 },
xAxis: { xAxis: {
type: "category", type: "category",
data:times, data:times,
@ -108,7 +108,7 @@ export default function getOptions(data, times, range, yName,forecastList,color,
// lineStyle:{ // lineStyle:{
// color:color1 // color:color1
// }, // },
itemStyle: { itemStyle: {
normal: { normal: {
color: 'rgba(0, 255, 245, 1))', //改变折线点的颜色 color: 'rgba(0, 255, 245, 1))', //改变折线点的颜色
lineStyle: { lineStyle: {

View File

@ -1,7 +1,7 @@
/* /*
* @Author: zhp * @Author: zhp
* @Date: 2024-08-28 09:25:58 * @Date: 2024-08-28 09:25:58
* @LastEditTime: 2024-09-13 16:50:40 * @LastEditTime: 2024-09-14 10:57:55
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
*/ */
@ -11,27 +11,38 @@ import getOptions from "./chart.config";
import * as echarts from "echarts"; import * as echarts from "echarts";
import { useState } from "react"; import { useState } from "react";
function compareArrays(arr1, arr2) { function compareArrays(arr1, arr2) {
let allDataInFirstArray = true; const result = [];
for (let i = 0; i < arr1.length; i++) { const longerLength = arr2.length;
if (!arr1[i]) { for (let i = 0; i < longerLength; i++) {
allDataInFirstArray = false; if (i < arr1.length && arr1[i]) {
break; result.push(null);
} else if (i < arr1.length &&!arr1[i]) {
result.push(arr2[i]);
} else {
result.push(arr2[i]);
} }
} }
return result;
if (allDataInFirstArray) { }
return []; function generateRandomArray(data) {
} else { const result = [];
const result = []; for (let i = 0; i < 7; i++) {
for (let i = 0; i < arr1.length; i++) { if (i < data.length) {
if (!arr1[i]) { let randomNumber;
result.push(arr2[i]); do {
} else { randomNumber = data[i] + Math.floor(Math.random() * 11) - 5;
result.push(null); } while (randomNumber < 0);
} result.push(randomNumber);
} else {
let lastDataValue = data[data.length - 1];
let randomNumber;
do {
randomNumber = lastDataValue + Math.floor(Math.random() * 11) - 5;
} while (randomNumber < 0);
result.push(randomNumber);
} }
return result;
} }
return result;
} }
function CommonChart(props) { function CommonChart(props) {
const { dataSource } = props; const { dataSource } = props;
@ -43,19 +54,14 @@ function CommonChart(props) {
const yName = dataSource.yName; const yName = dataSource.yName;
const currentTime = new Date(); const currentTime = new Date();
const times = []; const times = [];
// }
let forecastList = [] let forecastList = []
// if (modelFlag === true) { if (modelFlag === true) {
for (let i = 0; i < data.length; i++) { forecastList = generateRandomArray(data)
let item = data[i]; console.log('11111',compareArrays(data,forecastList))
let min = item - 5; }
let max = item + 5; const d = [10, 20, 30];
let randomValue = Math.random() * (max - min) + min; const f = generateRandomArray(d);
forecastList.push(randomValue.toFixed(1)); console.log('forRYF',f);
}
// }
for(let i = 0; i < 7; i++) { for(let i = 0; i < 7; i++) {
currentTime.setMinutes(currentTime.getMinutes() - 10); currentTime.setMinutes(currentTime.getMinutes() - 10);
const timeString = `${currentTime.getHours()}:${currentTime.getMinutes().toString().padStart(2, '0')}`; const timeString = `${currentTime.getHours()}:${currentTime.getMinutes().toString().padStart(2, '0')}`;

View File

@ -1,7 +1,7 @@
/* /*
* @Author: zhp * @Author: zhp
* @Date: 2024-09-13 14:47:50 * @Date: 2024-09-13 14:47:50
* @LastEditTime: 2024-09-13 15:44:40 * @LastEditTime: 2024-09-14 10:47:18
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
*/ */
@ -17,7 +17,7 @@ function getTimeArray() {
const timeArray = []; const timeArray = [];
let currentTime = todaySeven; let currentTime = todaySeven;
while (currentTime < tomorrowSeven) { while (currentTime <= tomorrowSeven) {
const hours = currentTime.getHours(); const hours = currentTime.getHours();
const minutes = currentTime.getMinutes(); const minutes = currentTime.getMinutes();
if (minutes === 0) { if (minutes === 0) {
@ -28,6 +28,42 @@ function getTimeArray() {
return timeArray; return timeArray;
} }
// function compareArrays(arr1, arr2) {
// let hasMissingDataInFirstArray = false;
// for (let i = 0; i < arr1.length; i++) {
// if (!arr1[i]) {
// hasMissingDataInFirstArray = true;
// break;
// }
// }
// if (hasMissingDataInFirstArray) {
// const result = new Array(arr2.length).fill(null);
// for (let i = 0; i < arr1.length; i++) {
// if (!arr1[i]) {
// result[i] = arr2[i];
// }
// }
// return result;
// } else {
// return arr2.map(() => null);
// }
// }
function emptyFirstTwelve(arr) {
const newArr = [...arr];
for (let i = 0; i < 12 && i < newArr.length; i++) {
newArr[i] = null;
}
return newArr;
}
function emptyLastThirteen(arr) {
const newArr = [...arr];
const startIndex = Math.max(0, newArr.length - 13);
for (let i = startIndex; i < newArr.length; i++) {
newArr[i] = null;
}
return newArr;
}
function CommonChart(props) { function CommonChart(props) {
const { dataSource } = props; const { dataSource } = props;
@ -46,6 +82,7 @@ function CommonChart(props) {
let randomValue = Math.random() * (max - min) + min; let randomValue = Math.random() * (max - min) + min;
forecastList.push(randomValue.toFixed(1)); forecastList.push(randomValue.toFixed(1));
} }
console.log('times',times)
let areaStyle = { let areaStyle = {
opacity: 0.8, opacity: 0.8,
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
@ -113,7 +150,7 @@ function CommonChart(props) {
<div className={cls.commonChart}> <div className={cls.commonChart}>
{data.length > 0 && ( {data.length > 0 && (
<ReactECharts <ReactECharts
option={getOptions(data, times, yRange, yName,forecastList,color,color1,areaStyle,areaStyle1)} option={getOptions(emptyLastThirteen(data), times, yRange, yName,emptyFirstTwelve(forecastList),color,color1,areaStyle,areaStyle1)}
style={{ height: "100%" }} style={{ height: "100%" }}
/> />
)} )}

View File

@ -1,7 +1,7 @@
/* /*
* @Author: zhp * @Author: zhp
* @Date: 2024-09-13 15:39:36 * @Date: 2024-09-13 15:39:36
* @LastEditTime: 2024-09-13 15:45:40 * @LastEditTime: 2024-09-14 11:20:39
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
*/ */
@ -16,7 +16,7 @@
export default function getOptions(data, times, range, yName,forecastList,color,color1,areaStyle,areaStyle1) { export default function getOptions(data, times, range, yName,forecastList,color,color1,areaStyle,areaStyle1) {
return { return {
grid: { top: 38, right: 44, bottom: 40, left: 48 }, grid: { top: 38, right: 0, bottom: 40, left: 48 },
xAxis: { xAxis: {
type: "category", type: "category",
data:times, data:times,
@ -71,7 +71,11 @@ export default function getOptions(data, times, range, yName,forecastList,color,
label: { label: {
show: true, show: true,
position: 'top', position: 'top',
color:'inherit' color: 'inherit',
formatter: (params) => {
const index = params.dataIndex;
return index % 2 === 0? params.value : '';
}
}, },
symbol: 'circle', symbol: 'circle',
symbolSize: 6, symbolSize: 6,
@ -109,7 +113,11 @@ export default function getOptions(data, times, range, yName,forecastList,color,
label: { label: {
show: true, show: true,
position: 'top', position: 'top',
color:'inherit' color: 'inherit',
formatter: (params) => {
const index = params.dataIndex;
return index % 2 === 0? params.value : '';
}
}, },
symbol: 'circle', symbol: 'circle',
symbolSize: 6, symbolSize: 6,

View File

@ -1,7 +1,7 @@
/* /*
* @Author: zhp * @Author: zhp
* @Date: 2024-09-02 09:56:13 * @Date: 2024-09-02 09:56:13
* @LastEditTime: 2024-09-13 15:36:42 * @LastEditTime: 2024-09-14 10:59:47
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
*/ */
@ -12,27 +12,38 @@ import getOptions from "./chart.config";
import * as echarts from "echarts"; import * as echarts from "echarts";
import { useState } from "react"; import { useState } from "react";
function compareArrays(arr1, arr2) { function compareArrays(arr1, arr2) {
let allDataInFirstArray = true; const result = [];
for (let i = 0; i < arr1.length; i++) { const longerLength = arr2.length;
if (!arr1[i]) { for (let i = 0; i < longerLength; i++) {
allDataInFirstArray = false; if (i < arr1.length && arr1[i]) {
break; result.push(null);
} else if (i < arr1.length &&!arr1[i]) {
result.push(arr2[i]);
} else {
result.push(arr2[i]);
} }
} }
return result;
if (allDataInFirstArray) { }
return []; function generateRandomArray(data) {
} else { const result = [];
const result = []; for (let i = 0; i < 7; i++) {
for (let i = 0; i < arr1.length; i++) { if (i < data.length) {
if (!arr1[i]) { let randomNumber;
result.push(arr2[i]); do {
} else { randomNumber = data[i] + Math.floor(Math.random() * 11) - .5;
result.push(null); } while (randomNumber < 0);
} result.push(randomNumber);
} else {
let lastDataValue = data[data.length - 1];
let randomNumber;
do {
randomNumber = lastDataValue + Math.floor(Math.random() * 11) - .5;
} while (randomNumber < 0);
result.push(randomNumber);
} }
return result;
} }
return result;
} }
function CommonChart(props) { function CommonChart(props) {
const { dataSource } = props; const { dataSource } = props;
@ -44,16 +55,17 @@ function CommonChart(props) {
const xData = dataSource.xData || []; const xData = dataSource.xData || [];
console.log('xData',props); console.log('xData',props);
let forecastList = []; let forecastList = [];
// if (modelFlag === true) { if (modelFlag === true) {
for (let i = 0; i < data.length; i++) { forecastList = generateRandomArray
let item = data[i]; // for (let i = 0; i < data.length; i++) {
let min = item - .5; // let item = data[i];
let max = item + .5; // let min = item - .5;
let randomValue = Math.random() * (max - min) + min; // let max = item + .5;
forecastList.push(randomValue.toFixed(1)); // let randomValue = Math.random() * (max - min) + min;
} // forecastList.push(randomValue.toFixed(1));
console.log(forecastList) // }
// } // console.log(forecastList)
}
let areaStyle = { let areaStyle = {
opacity: 0.8, opacity: 0.8,
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [ color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [

View File

@ -1,7 +1,7 @@
/* /*
* @Author: zhp * @Author: zhp
* @Date: 2024-08-20 14:09:17 * @Date: 2024-08-20 14:09:17
* @LastEditTime: 2024-09-13 16:39:20 * @LastEditTime: 2024-09-14 09:09:29
* @LastEditors: zhp * @LastEditors: zhp
* @Description: * @Description:
*/ */
@ -14,7 +14,6 @@ import SeasonToggle from "../seasonButton";
import InputDataToggle from "../inputData"; import InputDataToggle from "../inputData";
function paramsInput(props) { function paramsInput(props) {
const handleClick = () => { const handleClick = () => {
console.log(11111);
props.onSendValueToParent(true); props.onSendValueToParent(true);
}; };
return ( return (

View File

@ -18,6 +18,9 @@
.bottom{ .bottom{
/* height: 100%; */ /* height: 100%; */
margin-top: 20px; margin-top: 20px;
position: absolute;
z-index:100;
width: 92%;
/* display: flex; */ /* display: flex; */
/* justify-content: center; */ /* justify-content: center; */
} }