From a5fca25f63353fd03f65ae1c5fa2c116bb59f9fe Mon Sep 17 00:00:00 2001
From: lb <liubin_9396@163.com>
Date: Tue, 18 Jul 2023 14:59:02 +0800
Subject: [PATCH] update center time

---
 .../CenterTopData/LeftBoxes/index.jsx         | 68 ++++++++++++++++++-
 1 file changed, 66 insertions(+), 2 deletions(-)

diff --git a/src/components/CenterTopData/LeftBoxes/index.jsx b/src/components/CenterTopData/LeftBoxes/index.jsx
index c26aa64..e512099 100644
--- a/src/components/CenterTopData/LeftBoxes/index.jsx
+++ b/src/components/CenterTopData/LeftBoxes/index.jsx
@@ -1,4 +1,4 @@
-import React, { useState, useContext } from 'react';
+import React, { useState, useContext, useEffect } from 'react';
 import SocketContext from '../../../store/socket-data-provider';
 import icon1 from '@/assets/CenterChart2icon1.svg';
 import icon2 from '@/assets/CenterChart2icon2.svg';
@@ -9,6 +9,70 @@ import cls from './leftbox.module.less';
 
 const Chart2 = () => {
 	const ctx = useContext(SocketContext);
+	let [restTime, setResttime] = useState(
+		ctx.runState?.lastFireChangeTime || '0分0秒',
+	);
+	let [time, setTime] = useState([0, 0]);
+
+	useEffect(() => {
+		let timer = null;
+		if (restTime == null) return;
+		if (/分/.test(restTime) && /秒/.test(restTime)) {
+			let [min, sec] = restTime.replace(/分/, ':').replace(/秒/, '').split(':');
+			timer = setInterval(() => {
+				if (Number(sec) === 0 && Number(min) === 0) {
+					clearInterval(timer);
+					return;
+				}
+				if (Number(sec) === 0) {
+					sec = 59;
+					min--;
+				} else {
+					sec--;
+				}
+				setTime([min, sec]);
+			}, 1000);
+		} else if (/分/.test(restTime)) {
+			let sec,
+				min = restTime.replace(/分/, ':');
+			sec = 0;
+
+			timer = setInterval(() => {
+				if (Number(sec) === 0 && Number(min) === 0) {
+					clearInterval(timer);
+					return;
+				}
+				if (Number(sec) === 0) {
+					sec = 59;
+					min--;
+				} else {
+					sec--;
+				}
+				setTime([min, sec]);
+			}, 1000);
+		} else if (/秒/.test(restTime)) {
+			let min,
+				sec = restTime.replace(/秒/, '');
+			min = 0;
+
+			timer = setInterval(() => {
+				if (Number(sec) === 0 && Number(min) === 0) {
+					clearInterval(timer);
+					return;
+				}
+				if (Number(sec) === 0) {
+					sec = 59;
+					min--;
+				} else {
+					sec--;
+				}
+				setTime([min, sec]);
+			}, 1000);
+		}
+		return () => {
+			clearInterval(timer);
+		};
+	}, [ctx.runState?.lastFireChangeTime]);
 
 	const data = [
 		{
@@ -19,7 +83,7 @@ const Chart2 = () => {
 		{
 			icon: icon3,
 			label: '剩余时间',
-			value: ctx.runState?.lastFireChangeTime || '-',
+			value: `${time[0]}分${time[1]}秒`,
 		},
 		{
 			icon: icon2,