This commit is contained in:
parent
15116fb047
commit
592adf7cf2
|
|
@ -5,267 +5,9 @@ import { useEffect, useState } from 'react';
|
|||
|
||||
// 首页 课程班级
|
||||
function Exam(){
|
||||
const {examId} = useParams()
|
||||
const student_ID=localStorage.getItem('islogin')
|
||||
if(student_ID==null){
|
||||
alert('登录过期，请重新登录')
|
||||
window.location.href='http://36.138.114.105:30294/'
|
||||
}
|
||||
// 初始化倒计时状态
|
||||
const [countdown, setCountdown] = useState(0);
|
||||
const Countdown=true
|
||||
|
||||
//创建答案字典，将用户填入的答案添加到答案字典
|
||||
const [choice_answer,setchoice_answer]=useState({})
|
||||
const [completion_answer,setcompletion_answer]=useState({})
|
||||
const [judge_answer,setjudge_answer]=useState({})
|
||||
|
||||
const [testdata,settestdata]=useState('')
|
||||
const test_func= async()=>{
|
||||
try{
|
||||
const test_src= await axios.post('/api/student/TrainData',{student_ID})
|
||||
const test_data=test_src.data
|
||||
settestdata(test_data)
|
||||
}catch(error){
|
||||
alert(error)
|
||||
|
||||
}
|
||||
}
|
||||
useEffect(()=>{
|
||||
test_func()
|
||||
},[])
|
||||
// 倒计时初始化
|
||||
useEffect(() => {
|
||||
const examDuration = 10;
|
||||
setCountdown(examDuration);
|
||||
}, []);
|
||||
|
||||
// 转换秒数为时分秒格式
|
||||
const formatTime = (seconds) => {
|
||||
const hours = Math.floor(seconds / 3600);
|
||||
const minutes = Math.floor((seconds % 3600) / 60);
|
||||
const secs = seconds % 60;
|
||||
return `${hours.toString().padStart(2, '0')}:${minutes.toString().padStart(2, '0')}:${secs.toString().padStart(2, '0')}`;
|
||||
};
|
||||
|
||||
const [changetime,setchangetime]=useState(true)
|
||||
|
||||
// 倒计时更新
|
||||
useEffect(() => {
|
||||
let interval = setInterval(() => {
|
||||
if (countdown > 0) {
|
||||
setCountdown(countdown - 1);
|
||||
}else{
|
||||
clearInterval(interval)
|
||||
alert('时间到！已强制交卷')
|
||||
//与下面点击
|
||||
let sum = 0;
|
||||
for (let item of testdata[examId][0][0]) {
|
||||
for (let i of item) {
|
||||
if (i[6] === choice_answer[sum]) {
|
||||
// 使用函数式更新
|
||||
setscore(prevscore => prevscore + 2);
|
||||
}else{
|
||||
}
|
||||
}
|
||||
for(let item of testdata[examId][0][1]){
|
||||
for(let i of item){
|
||||
if(i[2]===completion_answer[sum]){
|
||||
setscore(prevscore => prevscore + 2);
|
||||
}else{
|
||||
}
|
||||
}
|
||||
}
|
||||
for(let item of testdata[examId][0][2]){
|
||||
for(let i of item){
|
||||
console.log(i);
|
||||
if(i[2]===judge_answer[sum]){
|
||||
setscore(prevscore => prevscore + 2);
|
||||
}else{
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
sum++; // 每次循环完一个 item 后，sum 加 1
|
||||
}
|
||||
console.log(score);
|
||||
}
|
||||
}, 1000);
|
||||
|
||||
|
||||
return () => clearInterval(interval);
|
||||
}, [countdown]);
|
||||
|
||||
//提交按钮按钮并进行对照批改
|
||||
//设置总分 score
|
||||
const [score,setscore]=useState(0)
|
||||
|
||||
// 计算成绩
|
||||
const submit = async() => {
|
||||
alert('提交成功')
|
||||
let sum = 0;
|
||||
for (let item of testdata[examId][0][0]) {
|
||||
for (let i of item) {
|
||||
if (i[6] === choice_answer[sum]) {
|
||||
// 使用函数式更新
|
||||
setscore(prevscore => prevscore + 2);
|
||||
}
|
||||
}
|
||||
for(let item of testdata[examId][0][1]){
|
||||
for(let i of item){
|
||||
if(i[2]===completion_answer[sum]){
|
||||
setscore(prevscore => prevscore + 2);
|
||||
}
|
||||
}
|
||||
}
|
||||
for(let item of testdata[examId][0][2]){
|
||||
for(let i of item){
|
||||
if(i[2]===judge_answer[sum]){
|
||||
setscore(prevscore => prevscore + 2);
|
||||
}
|
||||
}
|
||||
}
|
||||
sum++; // 每次循环完一个 item 后，sum 加 1
|
||||
}
|
||||
};
|
||||
const [isMounted, setIsMounted] = useState(false);
|
||||
useEffect(()=>{
|
||||
if(isMounted){
|
||||
const score_func=async()=>{
|
||||
try{
|
||||
const score_entry_src=await axios.post('/api/student/score_entry',{
|
||||
student_ID,
|
||||
score,
|
||||
examId
|
||||
})
|
||||
}catch(error){
|
||||
alert(error)
|
||||
}
|
||||
window.location.href='http://36.138.114.105:30294/subject'
|
||||
}
|
||||
score_func()
|
||||
}else{
|
||||
setIsMounted(true)
|
||||
}
|
||||
},[score])
|
||||
|
||||
|
||||
//给选择题添加事件监听器
|
||||
const handleOptionChange = (event) => {
|
||||
const selectedValue = event.target.value;
|
||||
const key = parseInt(event.target.name.replace('group', ''));
|
||||
const updatedChoiceAnswer = { ...choice_answer, [key]: selectedValue };
|
||||
setchoice_answer(updatedChoiceAnswer);
|
||||
};
|
||||
|
||||
//填空题
|
||||
const handleInputChange = (event) => {
|
||||
const { name, value } = event.target;
|
||||
setcompletion_answer({
|
||||
...completion_answer,
|
||||
[name]: value
|
||||
});
|
||||
};
|
||||
|
||||
//判断题
|
||||
const handleJudgeOption=(event)=>{
|
||||
const judgeoption=event.target.value;
|
||||
const key=parseInt(event.target.name.replace('judge',''))
|
||||
const updatedJudgeAnswer={ ...judge_answer,[key]:judgeoption}
|
||||
setjudge_answer(updatedJudgeAnswer)
|
||||
}
|
||||
|
||||
return(
|
||||
<div className="test">
|
||||
<div className='nav-test'>
|
||||
{testdata&&<div className='nav1'>
|
||||
<p>试卷ID:{examId}</p>
|
||||
<p>发布人:{testdata[examId][5]}</p>
|
||||
<div className='time'>
|
||||
{/* 倒计时 */}
|
||||
<h1>剩余时间：{formatTime(countdown)}</h1>
|
||||
</div>
|
||||
</div>}
|
||||
</div>
|
||||
<div className='body-box'>
|
||||
<div className="body-left-test">
|
||||
<p>题目</p>
|
||||
<ul>
|
||||
<li>判断题</li>
|
||||
<li>选择题</li>
|
||||
<li>解答题</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div className='body-right-test'>
|
||||
{/* 右边的题目 */}
|
||||
<div></div>
|
||||
)
|
||||
}
|
||||
|
||||
<div id='choice_box'>
|
||||
<span style={{color:'red'}}>选择题</span>
|
||||
<table>
|
||||
{testdata&&<thead>
|
||||
{Object.keys(testdata[examId][0][0]).map((key)=>(
|
||||
<tr key={key}>
|
||||
<td>
|
||||
<span style={{fontSize:'30px'}}>{parseInt(key,10)+1}:{testdata[examId][0][0][key][0][1]}</span>
|
||||
<div>
|
||||
<label><input type="radio" value={testdata[examId][0][0][key][0][2]} onChange={handleOptionChange} name={`group${key}`}/>A: {testdata[examId][0][0][key][0][2]}</label>
|
||||
<br />
|
||||
<label><input type="radio" value={testdata[examId][0][0][key][0][3]} onChange={handleOptionChange} name={`group${key}`}/>B: {testdata[examId][0][0][key][0][3]}</label>
|
||||
<br />
|
||||
<label><input type="radio" value={testdata[examId][0][0][key][0][4]} onChange={handleOptionChange} name={`group${key}`}/>C: {testdata[examId][0][0][key][0][4]}</label>
|
||||
<br />
|
||||
<label><input type="radio" value={testdata[examId][0][0][key][0][5]} onChange={handleOptionChange} name={`group${key}`}/>D: {testdata[examId][0][0][key][0][5]}</label>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
))}
|
||||
</thead>}
|
||||
</table>
|
||||
</div>
|
||||
{/* */}
|
||||
<div id='comple_box'>
|
||||
<span style={{color:'red'}}>填空题</span>
|
||||
<table>
|
||||
{ testdata&&<thead>
|
||||
{Object.keys(testdata[examId][0][1]).map((key)=>(
|
||||
<tr key={key}>
|
||||
<td>
|
||||
<div>
|
||||
<p>{parseInt(key,10)+1}:{testdata[examId][0][1][key][0][1]}
|
||||
<input type="text" className='input_txt' onChange={handleInputChange} name={key}/>
|
||||
</p>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
))}
|
||||
</thead>}
|
||||
</table>
|
||||
</div>
|
||||
<div id='judge_box'>
|
||||
<span style={{color:'red'}}>判断题</span>
|
||||
{ testdata&&<table>
|
||||
<thead>
|
||||
{Object.keys(testdata[examId][0][2]).map((key)=>(
|
||||
<tr>
|
||||
<td key={key}>
|
||||
<div>
|
||||
<p>{parseInt(key,10)+1}:{testdata[examId][0][2][key][0][1]}</p>
|
||||
<label><input type="radio" name={`judge${key}`} onChange={handleJudgeOption} value={true}/>T</label>
|
||||
<label><input type="radio" name={`judge${key}`} onChange={handleJudgeOption} value={false}/>F</label>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
))}
|
||||
</thead>
|
||||
</table>}
|
||||
|
||||
</div>
|
||||
<div>
|
||||
<button id='submit' onClick={submit}>提交</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)};
|
||||
|
||||
export default Exam;
|
||||
export default Exam
|
||||
Loading…
Reference in New Issue