30 lines
997 B
TypeScript
30 lines
997 B
TypeScript
import './card-proj-loading.css';
|
||
import {Loading3QuartersOutlined} from '@ant-design/icons';
|
||
import {IProjLoading} from "../../interfaces/card/ICardProj.ts";
|
||
import {useEffect, useState} from "react";
|
||
|
||
export default function CardProjLoading(props: IProjLoading) {
|
||
const [duration, setDuration] = useState(props.duration);
|
||
|
||
useEffect(() => {
|
||
setTimeout(() => {
|
||
const last = duration - 1000;
|
||
if (last <= 0) {
|
||
setDuration(0);
|
||
props.handleCountDownOver();
|
||
return;
|
||
}
|
||
setDuration(last);
|
||
}, 1000);
|
||
}, [duration])
|
||
|
||
return (
|
||
<div className="card-proj-loading">
|
||
<div className="title">
|
||
<Loading3QuartersOutlined spin={true} style={{color: '#0052d9'}}/>
|
||
<span className="label">{props.title}</span>
|
||
</div>
|
||
<div className="desc">{props.desc}，预计等待{duration / 1000}s</div>
|
||
</div>
|
||
)
|
||
} |