Аутор | SHA1 | Порука | Датум |
---|---|---|---|
‘937886381’ | 6de0fe4753 | Merge branch 'features/warning' into zhp | пре 5 дана |
‘937886381’ | a8b5e57f38 | 修改 | пре 5 дана |
juzi | a4985a5379 |
Merge pull request 'zhp' (#7) from zhp into features/warning
Reviewed-on: http://git.picaiba.com/mt-fe-group/xuchang-new/pulls/7 |
пре 6 дана |
@@ -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); | ||||
@@ -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; | ||||
} | } |
@@ -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> | ||||
@@ -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 }} | ||||
@@ -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)); | ||||
@@ -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%); | ||||
} | } |
@@ -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: { | ||||
@@ -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; | |||||
for (let i = 0; i < arr1.length; i++) { | |||||
if (!arr1[i]) { | |||||
allDataInFirstArray = false; | |||||
break; | |||||
const result = []; | |||||
const longerLength = arr2.length; | |||||
for (let i = 0; i < longerLength; i++) { | |||||
if (i < arr1.length && arr1[i]) { | |||||
result.push(null); | |||||
} else if (i < arr1.length &&!arr1[i]) { | |||||
result.push(arr2[i]); | |||||
} else { | |||||
result.push(arr2[i]); | |||||
} | } | ||||
} | } | ||||
if (allDataInFirstArray) { | |||||
return []; | |||||
} else { | |||||
const result = []; | |||||
for (let i = 0; i < arr1.length; i++) { | |||||
if (!arr1[i]) { | |||||
result.push(arr2[i]); | |||||
} else { | |||||
result.push(null); | |||||
} | |||||
return result; | |||||
} | |||||
function generateRandomArray(data) { | |||||
const result = []; | |||||
for (let i = 0; i < 7; i++) { | |||||
if (i < data.length) { | |||||
let randomNumber; | |||||
do { | |||||
randomNumber = data[i] + Math.floor(Math.random() * 11) - 5; | |||||
} 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) { | |||||
for (let i = 0; i < data.length; i++) { | |||||
let item = data[i]; | |||||
let min = item - 5; | |||||
let max = item + 5; | |||||
let randomValue = Math.random() * (max - min) + min; | |||||
forecastList.push(randomValue.toFixed(1)); | |||||
} | |||||
// } | |||||
if (modelFlag === true) { | |||||
forecastList = generateRandomArray(data) | |||||
console.log('11111',compareArrays(data,forecastList)) | |||||
} | |||||
const d = [10, 20, 30]; | |||||
const f = generateRandomArray(d); | |||||
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')}`; | ||||
@@ -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%" }} | ||||
/> | /> | ||||
)} | )} | ||||
@@ -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, | ||||
@@ -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; | |||||
for (let i = 0; i < arr1.length; i++) { | |||||
if (!arr1[i]) { | |||||
allDataInFirstArray = false; | |||||
break; | |||||
const result = []; | |||||
const longerLength = arr2.length; | |||||
for (let i = 0; i < longerLength; i++) { | |||||
if (i < arr1.length && arr1[i]) { | |||||
result.push(null); | |||||
} else if (i < arr1.length &&!arr1[i]) { | |||||
result.push(arr2[i]); | |||||
} else { | |||||
result.push(arr2[i]); | |||||
} | } | ||||
} | } | ||||
if (allDataInFirstArray) { | |||||
return []; | |||||
} else { | |||||
const result = []; | |||||
for (let i = 0; i < arr1.length; i++) { | |||||
if (!arr1[i]) { | |||||
result.push(arr2[i]); | |||||
} else { | |||||
result.push(null); | |||||
} | |||||
return result; | |||||
} | |||||
function generateRandomArray(data) { | |||||
const result = []; | |||||
for (let i = 0; i < 7; i++) { | |||||
if (i < data.length) { | |||||
let randomNumber; | |||||
do { | |||||
randomNumber = data[i] + Math.floor(Math.random() * 11) - .5; | |||||
} 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) { | |||||
for (let i = 0; i < data.length; i++) { | |||||
let item = data[i]; | |||||
let min = item - .5; | |||||
let max = item + .5; | |||||
let randomValue = Math.random() * (max - min) + min; | |||||
forecastList.push(randomValue.toFixed(1)); | |||||
} | |||||
console.log(forecastList) | |||||
// } | |||||
if (modelFlag === true) { | |||||
forecastList = generateRandomArray | |||||
// for (let i = 0; i < data.length; i++) { | |||||
// let item = data[i]; | |||||
// let min = item - .5; | |||||
// let max = item + .5; | |||||
// let randomValue = Math.random() * (max - min) + min; | |||||
// forecastList.push(randomValue.toFixed(1)); | |||||
// } | |||||
// 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, [ | ||||
@@ -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 ( | ||||
@@ -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; */ | ||||
} | } | ||||