From 950f670f85a53c525955f82477ca6754c6108b56 Mon Sep 17 00:00:00 2001 From: nopy <646880214@qq.com> Date: Sat, 29 Jun 2024 13:06:28 +0800 Subject: [PATCH] 6.29 --- app-dm/src/pages/ListPages/Subject/Exam.css | 171 +++++++++++--------- app-dm/src/pages/ListPages/Subject/Exam.jsx | 113 ++++++++++++- app-dm/src/router/index.jsx | 4 +- 3 files changed, 202 insertions(+), 86 deletions(-) diff --git a/app-dm/src/pages/ListPages/Subject/Exam.css b/app-dm/src/pages/ListPages/Subject/Exam.css index d25ad69..247fb2f 100644 --- a/app-dm/src/pages/ListPages/Subject/Exam.css +++ b/app-dm/src/pages/ListPages/Subject/Exam.css @@ -1,61 +1,43 @@ -/* 导航 */ -.nav-test{ - width: 100%; - height: 52px; +/* 上面导航 */ +.nav-exam{ + height: 50px; + width: 1630px; + margin-bottom: 5px; + box-shadow: 1px 1px 6px #d4d4d4; +} +.nav-exam p{ + width: 200px; + height: 40px; font-size: 20px; - background-color: rgb(255, 255, 255); - box-shadow: 3px 2px 2px #d4d4d4; + line-height: 10px; + padding-right: 10px; + float: right; } -.nav1{ - line-height:15px; - font-size: 20px; - margin-left: 100px; - font-weight: 500; - font-family: '微软雅黑'; -} - -.nav1 p{ - font-size: 15px; - margin-top: 15px; -} -.nav1 h1{ - font-size: 20px; - margin-top: 15px; -} - -.time{ - position: absolute; - right: 50px; - top: 8px; -} - -/* 主体 */ -.body-box{ +.body-exam{ display: flex; - align-content: center; + flex-direction: column; } - -/* 左侧 */ -.body-left-test{ +/* 第二页(实训题)的左边导航 */ +.nav-left-exam{ width: 215px; - height: 840px; + height: 1540px; + position: absolute; box-shadow: 2px 2px 6px #d4d4d4; } - -.body-left-test p{ - font-size: 16px; +.nav-left-exam p{ + height: 10px; + font-size: 15px; padding: 0 10px; + margin-top: 6px; } - -.body-left-test ul{ +.nav-left-ul1-exam{ width: 175px; - height: 240px; - border-top: 1px solid #7f7f7f; + position: relative; + border-top: 2px solid rgb(212, 212, 212); } - -.body-left-test li{ - width: 75px; +.nav-left-ul1-exam li{ + width: 65px; height: 40px; font-size: 18px; list-style-type: none; @@ -64,42 +46,77 @@ line-height: 40px; display: block; cursor: pointer; - border-bottom: 1px solid #7f7f7f; - /* background-color:aliceblue; */ -} - -/* 右侧 */ -.body-right-test{ - width: 1403px; - height: 828px; - margin-top: 10px; - margin-left: 5px; - background-color: #fff; + /* border-bottom: 1px solid #7f7f7f; */ + background-color: #f5f5f5; + border-bottom: 2px solid rgb(212, 212, 212); } - - -/* 提交按钮 */ -#submit{ +/* 下拉菜单 */ +.dropdown-menu1-exam { + height: auto; position: absolute; + top: 62px; + left: 0px; + z-index: 1000; +} +.dropdown-menu1-exam li{ + background-color: rgb(236, 232, 232); + border-bottom: 2px solid rgb(213, 208, 208); +} +/* 显示下拉菜单 */ +.subject-dropdown.open1-exam + .dropdown-menu1-exam { + display: block; +} +.subject-dropdown1-exam span{ + position: absolute; + top: 15px; + left: 180px; } -#choice_box input{ - margin-top: 20px; - margin-left: 20px; +/* 题目预览框 */ +.countBox-exam{ + height: 280px; + padding: 7px; + position: fixed; + right: 0px; + top: 65px; + background-color:#e8f7f0; + box-shadow: 0px 0px 6px #aacbae; + z-index: 1000; + transition: top 0.3s; /* 平滑过渡效果 */ } -#choice_box td{ - border-bottom: 2px solid rgb(111, 203, 242); - width: 2000px; +.fixed-count-box-exam { + position: fixed; + top: 0; + right: 0; + width: auto; + z-index: 1000; } -#comple_box td{ - border-bottom: 2px solid rgb(111, 203, 242); - width: 2000px; +.countBox-exam div{ + display: flex; + flex-wrap:wrap; + width: 200px; } -.input_txt{ - border: none; - border-bottom: 1px solid black; - font-size: 16px; - font-family: 'heiti'; +.countBox-exam td{ + width: 40px; + height: 30px; + border: 1px solid black; + text-align: center; + margin-left: 5px; + margin-top: 5px; + cursor: pointer; } - - +.countBox-exam tr{ + font-size: 18px; + font-weight: 550; + color: #364a38; +} +.answered-exam { + /* 例如,改变题目的背景色 */ + width: 40px; + height: 30px; + background-color: rgb(149, 223, 187); + text-align: center; + margin-left: 5px; + margin-top: 5px; + cursor: pointer; +} \ No newline at end of file diff --git a/app-dm/src/pages/ListPages/Subject/Exam.jsx b/app-dm/src/pages/ListPages/Subject/Exam.jsx index 16265fd..17f52a8 100644 --- a/app-dm/src/pages/ListPages/Subject/Exam.jsx +++ b/app-dm/src/pages/ListPages/Subject/Exam.jsx @@ -1,13 +1,112 @@ import './Exam.css' +import { Terminal } from "@xterm/xterm"; +import "@xterm/xterm/css/xterm.css" +import React,{ MouseEvent, useEffect, useRef, useState } from "react"; import { useParams } from 'react-router'; +import { Link } from 'react-router-dom'; +// import arrowright from '../img/arrowright.jpg' +import bottom from '../img/bottom.jpg' +import top from '../img/top.jpg' import axios from 'axios'; -import { useEffect, useState } from 'react'; -// 首页 课程班级 -function Exam(){ - return( -
- ) +function Exam() { + + + //倒计时 + const [countdown, setCountdown] = useState(null); + + // 倒计时更新 + useEffect(() => { + let interval = setInterval(() => { + if (countdown !== 0 ) { + setCountdown(countdown - 1); + localStorage.setItem('time',countdown-1) + } else { + clearInterval(interval); + alert('考试时间到!'); + } + }, 1000); + return () => clearInterval(interval); + }, [countdown]); + + // useEffect(()=>{ + // if(countdown<0){ + // console.log('c'); + // setCountdown(60 * parseInt(TrainData['operateID'][4])) + // localStorage.removeItem('time') + // } + // },[TrainData]) + + // 转换秒数为时分秒格式 + 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 [isSubjectDropdownOpen, setIsSubjectDropdownOpen] = useState(false); + + return ( +
+
+ {/* 导航 */} + {/*

{OperationId}

*/} +

剩余时间:{countdown >=0 && formatTime(countdown)}

+
+
+
+ {/* 左边导航 */} +

题目

+
    +
  • setIsSubjectDropdownOpen(!isSubjectDropdownOpen)}> + 主观题 + {isSubjectDropdownOpen ? : } + {isSubjectDropdownOpen && ( +
      +
    • 判断题
    • +
    • 选择题
    • +
    • 简答题
    • + {/* 子菜单项 */} +
    + )} +
  • + +
  • 实训题
  • + +
+ {/* 题目预览框 */} + {/* 根据isFixed状态来设置countBox的类 */} + {/*
+ {TrainData&& + 选择题: +
+ {Object.keys(TrainData['operateID'][0]).map((key,index)=>( +
+ ))} + + 填空题: +
+ {Object.keys(TrainData['operateID'][1]).map((key,index)=>( +
+ ))} + + 判断题: +
+ {Object.keys(TrainData['operateID'][2]).map((key,index)=>( +
+ ))} + +
{index+1}
{index+1}
{index+1}
} +
*/} +
+ {/*
+ +
*/} +
+
+ ) } -export default Exam \ No newline at end of file +export default Exam; \ No newline at end of file diff --git a/app-dm/src/router/index.jsx b/app-dm/src/router/index.jsx index b5e2aa3..a2c4596 100755 --- a/app-dm/src/router/index.jsx +++ b/app-dm/src/router/index.jsx @@ -23,8 +23,8 @@ import ClassID from '../TeacherPages/classlistpages/classId'; import ManageTest from '../TeacherPages/TestManage/ManageTest'; import SendTest from '../TeacherPages/TestManage/SendTest'; import Marking from '../TeacherPages/MarkingPages/Marking'; -import SendTrain from '../TeacherPages/Trainmanage/SendTrain' -import TrainManage from '../TeacherPages/Trainmanage/Trainmanage' +import SendTrain from '../TeacherPages/TrainManage/SendTrain' +import TrainManage from '../TeacherPages/TrainManage/Trainmanage' import StudentLink from '../TeacherPages/MarkingPages/StudentLink';