This commit is contained in:
30404 2024-07-10 12:50:10 +08:00
commit 0dc1bba456
2 changed files with 91 additions and 9 deletions

View File

@ -66,3 +66,41 @@
margin-left: 1230px; margin-left: 1230px;
margin-top: -45px; margin-top: -45px;
} }
.modal {
display: none;
position: fixed;
z-index: 1;
left: 0;
top: 0;
width: 100%;
height: 100%;
overflow: auto;
background-color: rgb(0,0,0);
background-color: rgba(0,0,0,0.4);
}
.modal-content {
background-color: #fefefe;
margin: 15% auto;
padding: 20px;
border: 1px solid #888;
width: 80%;
}
.close {
color: #aaa;
float: right;
font-size: 28px;
font-weight: bold;
}
.close:hover,
.close:focus {
color: black;
text-decoration: none;
cursor: pointer;
}

View File

@ -2,12 +2,13 @@ import axios from 'axios';
import './Trainmanage.css' import './Trainmanage.css'
import { Link } from 'react-router-dom'; import { Link } from 'react-router-dom';
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
// import axios from 'axios';
function TrainManage(){ function TrainManage(){
const teacher_ID=localStorage.getItem('islogin') const teacher_ID=localStorage.getItem('islogin')
const [Data,setData]=useState() const [Data,setData]=useState([])
const [showModal, setShowModal] = useState(false);
const [selectedTrain, setSelectedTrain] = useState(null);
const [testID,settestID]=useState() const [testID,settestID]=useState()
const [TrainData,setTrainData]=useState() const [TrainData,setTrainData]=useState()
// //
@ -18,7 +19,7 @@ function TrainManage(){
}) })
setData(getTrainSrc.data['data']) setData(getTrainSrc.data['data'])
}catch{ }catch{
alert('aaaa') alert('获取实训信息失败')
} }
} }
@ -41,6 +42,13 @@ function TrainManage(){
getTrainData() getTrainData()
},[testID]) },[testID])
const handleTrainClick = (train) => {
setSelectedTrain(train);
setShowModal(true);
};
return( return(
<div className='body-trainmanage'> <div className='body-trainmanage'>
<p className='title'>已结束的实训</p> <p className='title'>已结束的实训</p>
@ -48,16 +56,52 @@ function TrainManage(){
{Data&&<div className='train-list-trainmanage'> {Data&&<div className='train-list-trainmanage'>
<ul className="ul-trainmanage"> <ul className="ul-trainmanage">
{Object.keys(Data).map((key)=>( {Object.keys(Data).map((key)=>(
<li key={key}> <li key={key} onClick={() => handleTrainClick(key)}>
<span>实训ID:{Data[key][10]}</span> <span>实训ID:{Data[key][10]}</span>
<h6 className='TrainTitle'>实训名称:{eval(Data[key][11])}</h6> <h6 className='TrainTitle'>实训名称:{eval(Data[key][11])}</h6>
<p>关闭时间{Data[key][6]}</p> <p>关闭时间{Data[key][6]}</p>
</li> </li>
))} ))}
</ul> </ul>
<Link to='/teacher/trainmanage/TrainPods' className='ManagePods' >管理实训</Link> <Link to='/teacher/trainmanage/TrainPods' className='ManagePods' >管理实训</Link>
<Link to='/teacher/SendTrain' className='sendtestpage'>发布实训</Link> <Link to='/teacher/SendTrain' className='sendtestpage'>发布实训</Link>
</div>} </div>}
{/* 弹窗组件 */}
{showModal && (
<div className='modal'>
<div className='modal-content'>
<span className='close' onClick={() => setShowModal(false)}>&times;</span>
<h2>实训信息</h2>
<table>
<thead>
<tr>
<th>实训ID</th>
<th>实训名称</th>
<th>学号</th>
<th>基础成绩</th>
<th>实训成绩</th>
<th>总成绩</th>
</tr>
</thead>
<tbody>
{selectedTrain && selectedTrain.students.map((student, index) => (
<tr key={index}>
<td>{selectedTrain[10]}</td>
<td>{eval(selectedTrain[11])}</td>
<td>{student.studentID}</td>
<td>{student.baseScore}</td>
<td>{student.trainScore}</td>
<td>{student.totalScore}</td>
</tr>
))}
</tbody>
</table>
</div>
</div>
)}
</div> </div>
) )
} }