This commit is contained in:
commit
0d813ceaf9
|
@ -1,9 +1,12 @@
|
||||||
.pods table{
|
.list-pods-container {
|
||||||
width: 500px;
|
width: 100%;
|
||||||
text-align: center;
|
height: 100%;
|
||||||
border: 1px solid black;
|
display: flex;
|
||||||
}
|
justify-content: center;
|
||||||
.pods p{
|
align-items: center;
|
||||||
line-height: 0px;
|
}
|
||||||
margin: 0px;
|
|
||||||
}
|
h1 {
|
||||||
|
font-size: 2rem;
|
||||||
|
color: #333;
|
||||||
|
}
|
|
@ -1,36 +1,28 @@
|
||||||
import './list_pods.css'
|
import './list_pods.css'
|
||||||
|
import React, { useEffect, useState } from 'react';
|
||||||
function List_pods(){
|
function List_pods(){
|
||||||
|
const [seconds, setSeconds] = useState(60);
|
||||||
|
|
||||||
|
const handleStart = () => {
|
||||||
|
const intervalId = setInterval(() => {
|
||||||
|
if (seconds > 0) {
|
||||||
|
setSeconds(seconds - 1);
|
||||||
|
} else {
|
||||||
|
clearInterval(intervalId);
|
||||||
|
alert('考试时间到!');
|
||||||
|
}
|
||||||
|
}, 1000);
|
||||||
|
|
||||||
return(
|
return () => {
|
||||||
<div className="pods">
|
clearInterval(intervalId);
|
||||||
<table>
|
};
|
||||||
<tr>
|
};
|
||||||
<td>Name</td>
|
|
||||||
<td>TestID</td>
|
return (
|
||||||
<td>Train</td>
|
<div className="App">
|
||||||
<td>Start</td>
|
<h1>剩余时间:{seconds}</h1>
|
||||||
<td>End</td>
|
<button onClick={handleStart}>开始倒计时</button>
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td colSpan="5"><hr /></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>zhoutao</td>
|
|
||||||
<td>33</td>
|
|
||||||
<td>0</td>
|
|
||||||
<td>2024-7-1</td>
|
|
||||||
<td>2024-7-2</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>zhoutao</td>
|
|
||||||
<td>33</td>
|
|
||||||
<td>0</td>
|
|
||||||
<td>2024-7-1</td>
|
|
||||||
<td>2024-7-2</td>
|
|
||||||
</tr>
|
|
||||||
</table>
|
|
||||||
</div>
|
</div>
|
||||||
)
|
);
|
||||||
}
|
}
|
||||||
export default List_pods
|
export default List_pods
|
|
@ -10,8 +10,9 @@ import top from '../img/top.jpg'
|
||||||
import axios from 'axios';
|
import axios from 'axios';
|
||||||
|
|
||||||
function Operation1() {
|
function Operation1() {
|
||||||
|
const[isTrue,setisTrue]=useState(true)
|
||||||
const click=()=>{
|
const click=()=>{
|
||||||
console.log(TrainData['operateID'][3][0]);
|
console.log(60 * parseInt(TrainData['operateID'][4]));
|
||||||
}
|
}
|
||||||
const clear=()=>{
|
const clear=()=>{
|
||||||
localStorage.removeItem('choice_answers');
|
localStorage.removeItem('choice_answers');
|
||||||
|
@ -46,25 +47,27 @@ function Operation1() {
|
||||||
}
|
}
|
||||||
useEffect(()=>{
|
useEffect(()=>{
|
||||||
TrainDataFunc()
|
TrainDataFunc()
|
||||||
const RemainingTime=localStorage.getItem('RemainingTime')
|
|
||||||
if(!isNaN(RemainingTime) && RemainingTime !== '') {
|
|
||||||
setCountdown(RemainingTime);
|
|
||||||
} else {
|
|
||||||
setCountdown(60 * parseInt(TrainData['operateID'][4]));
|
|
||||||
}
|
|
||||||
},[])
|
},[])
|
||||||
//倒计时
|
|
||||||
const [countdown, setCountdown] = useState();
|
|
||||||
const [time,settime]=useState()
|
|
||||||
// 倒计时初始化
|
|
||||||
|
|
||||||
|
useEffect(()=>{
|
||||||
|
if(localStorage.getItem('time')){
|
||||||
|
setCountdown(localStorage.getItem('time'))
|
||||||
|
}else{
|
||||||
|
if(TrainData){
|
||||||
|
setCountdown(60 * parseInt(TrainData['operateID'][4]))
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},[TrainData])
|
||||||
|
|
||||||
|
//倒计时
|
||||||
|
const [countdown, setCountdown] = useState(null);
|
||||||
|
|
||||||
// 倒计时更新
|
// 倒计时更新
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
let interval = setInterval(() => {
|
let interval = setInterval(() => {
|
||||||
if (countdown != 0) {
|
if (countdown > 0 ) {
|
||||||
setCountdown(countdown - 1);
|
setCountdown(countdown - 1);
|
||||||
localStorage.setItem('RemainingTime',countdown)
|
localStorage.setItem('time',countdown-1)
|
||||||
} else {
|
} else {
|
||||||
clearInterval(interval);
|
clearInterval(interval);
|
||||||
alert('考试时间到!');
|
alert('考试时间到!');
|
||||||
|
|
|
@ -101,6 +101,7 @@
|
||||||
}
|
}
|
||||||
/* 前进按钮 */
|
/* 前进按钮 */
|
||||||
.btn-out2{
|
.btn-out2{
|
||||||
|
cursor: pointer;
|
||||||
height: 50px;
|
height: 50px;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
bottom: 50px;
|
bottom: 50px;
|
||||||
|
|
|
@ -12,7 +12,7 @@ import top from '../img/top.jpg'
|
||||||
function Operation2() {
|
function Operation2() {
|
||||||
const { operateID } = useParams();
|
const { operateID } = useParams();
|
||||||
//获取剩余时间
|
//获取剩余时间
|
||||||
const RemainingTime=localStorage.getItem('RemainingTime')
|
|
||||||
|
|
||||||
|
|
||||||
//终端
|
//终端
|
||||||
|
@ -67,15 +67,15 @@ function Operation2() {
|
||||||
|
|
||||||
// 倒计时初始化
|
// 倒计时初始化
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
setCountdown(RemainingTime);
|
setCountdown(localStorage.getItem('time'))
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
// 倒计时更新
|
// 倒计时更新
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
let interval = setInterval(() => {
|
let interval = setInterval(() => {
|
||||||
if (countdown != 0) {
|
if (countdown !== 0) {
|
||||||
setCountdown(countdown - 1);
|
setCountdown(countdown - 1);
|
||||||
localStorage.setItem('RemainingTime',countdown)
|
localStorage.setItem('time',countdown-1)
|
||||||
} else {
|
} else {
|
||||||
clearInterval(interval);
|
clearInterval(interval);
|
||||||
alert('考试时间到!');
|
alert('考试时间到!');
|
||||||
|
@ -95,6 +95,12 @@ function Operation2() {
|
||||||
// 下拉菜单
|
// 下拉菜单
|
||||||
const [isSubjectDropdownOpen, setIsSubjectDropdownOpen] = useState(false);
|
const [isSubjectDropdownOpen, setIsSubjectDropdownOpen] = useState(false);
|
||||||
|
|
||||||
|
const tijiao = ()=>{
|
||||||
|
clearInterval()
|
||||||
|
localStorage.removeItem('time')
|
||||||
|
window.location.href='http://baidu.com'
|
||||||
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
<div className='nav-operation2'>
|
<div className='nav-operation2'>
|
||||||
|
@ -132,10 +138,10 @@ function Operation2() {
|
||||||
<p>上一页</p>
|
<p>上一页</p>
|
||||||
<img src={arrowleft} alt="" width='40px' height='40px' />
|
<img src={arrowleft} alt="" width='40px' height='40px' />
|
||||||
</Link>
|
</Link>
|
||||||
<Link className='btn-out2' style={{color:'#000',textDecoration:'none'}}>
|
<button onClick={tijiao} className='btn-out2' style={{color:'#000',textDecoration:'none'}}>
|
||||||
<img src={arrowright} alt="" width='40px' height='40px' />
|
<img src={arrowright} alt="" width='40px' height='40px' />
|
||||||
<p>完成</p>
|
<p>完成</p>
|
||||||
</Link>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
|
|
Loading…
Reference in New Issue