This commit is contained in:
parent
15116fb047
commit
592adf7cf2
|
@ -5,267 +5,9 @@ import { useEffect, useState } from 'react';
|
||||||
|
|
||||||
// 首页 课程班级
|
// 首页 课程班级
|
||||||
function Exam(){
|
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(
|
return(
|
||||||
<div className="test">
|
<div></div>
|
||||||
<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 id='choice_box'>
|
export default Exam
|
||||||
<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;
|
|
Loading…
Reference in New Issue