From 4ed8c5cc49c89ffbcd2ec66a0db7fb43dcec2ee2 Mon Sep 17 00:00:00 2001 From: nopy <646880214@qq.com> Date: Thu, 27 Jun 2024 10:51:57 +0800 Subject: [PATCH] 6.27 --- .../pages/ListPages/Training/Operation2.jsx | 1 + .../pages/ListPages/Training/Operation3.css | 0 .../pages/ListPages/Training/Operation3.jsx | 95 ------------------- .../pages/ListPages/Training/TrainingPage.css | 11 +++ .../pages/ListPages/Training/TrainingPage.jsx | 38 ++++++-- app-dm/src/router/index.jsx | 2 - 6 files changed, 43 insertions(+), 104 deletions(-) delete mode 100644 app-dm/src/pages/ListPages/Training/Operation3.css delete mode 100644 app-dm/src/pages/ListPages/Training/Operation3.jsx diff --git a/app-dm/src/pages/ListPages/Training/Operation2.jsx b/app-dm/src/pages/ListPages/Training/Operation2.jsx index 72a6cbd..a2c2bdb 100644 --- a/app-dm/src/pages/ListPages/Training/Operation2.jsx +++ b/app-dm/src/pages/ListPages/Training/Operation2.jsx @@ -137,4 +137,5 @@ function Operation2() { ) } + export default Operation2; \ No newline at end of file diff --git a/app-dm/src/pages/ListPages/Training/Operation3.css b/app-dm/src/pages/ListPages/Training/Operation3.css deleted file mode 100644 index e69de29..0000000 diff --git a/app-dm/src/pages/ListPages/Training/Operation3.jsx b/app-dm/src/pages/ListPages/Training/Operation3.jsx deleted file mode 100644 index e531d3d..0000000 --- a/app-dm/src/pages/ListPages/Training/Operation3.jsx +++ /dev/null @@ -1,95 +0,0 @@ -import './Operation2.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 arrowleft from '../img/arrowleft.jpg' -import arrowright from '../img/arrowright.jpg' -import bottom from '../img/bottom.jpg' -import top from '../img/top.jpg' - -function Operation3() { - const { operateID } = useParams(); - - //倒计时 - // const { OperationId } = useParams(); - const [test_data, setTestData] = useState(''); - const [countdown, setCountdown] = useState(0); - - // 倒计时初始化 - useEffect(() => { - const examDuration = 60 * 60; // 假设考试时长为1小时 - setCountdown(examDuration); - }, []); - - // 倒计时更新 - useEffect(() => { - let interval = setInterval(() => { - if (countdown > 0) { - setCountdown(countdown - 1); - } else { - clearInterval(interval); - alert('考试时间到!'); - } - }, 1000); - return () => clearInterval(interval); - }, [countdown]); - - // 转换秒数为时分秒格式 - 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}

*/} -

剩余时间:{formatTime(countdown)}

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

题目

-
    - -
  • setIsSubjectDropdownOpen(!isSubjectDropdownOpen)}> - 主观题 - {isSubjectDropdownOpen ? : } - {isSubjectDropdownOpen && ( -
      -
    • 判断题
    • -
    • 选择题
    • -
    • 简答题
    • - {/* 子菜单项 */} -
    - )} -
  • - -
  • 实训题
  • -
-
-
- 第三页(实训题:)的右边页面 -
- -

上一页

- - - - -

完成

- -
-
- ) -} - -export default Operation3; \ No newline at end of file diff --git a/app-dm/src/pages/ListPages/Training/TrainingPage.css b/app-dm/src/pages/ListPages/Training/TrainingPage.css index ca6d480..e91207b 100644 --- a/app-dm/src/pages/ListPages/Training/TrainingPage.css +++ b/app-dm/src/pages/ListPages/Training/TrainingPage.css @@ -78,6 +78,17 @@ justify-content: center; align-items: center; z-index: 1000; + animation: slideInFromUp 0.5s ease-out forwards; +} +@keyframes slideInFromUp { + from { + transform: translateY(100%); + opacity: 0; + } + to { + transform: translateY(0); + opacity: 1; + } } .warning-content { width: 1420px; diff --git a/app-dm/src/pages/ListPages/Training/TrainingPage.jsx b/app-dm/src/pages/ListPages/Training/TrainingPage.jsx index 833bc80..7e9ce92 100755 --- a/app-dm/src/pages/ListPages/Training/TrainingPage.jsx +++ b/app-dm/src/pages/ListPages/Training/TrainingPage.jsx @@ -4,17 +4,43 @@ import '../Training/TrainingPage.css' import axios from 'axios'; +// const WarningModal = ({ isOpen, onClose }) => { + +// if (!isOpen) return; // 如果警告框不显示,则不渲染 +// return ( +//
+//
+// × +//

提醒 : 请及时完成实训内容!!!

+//
+//
+// ); +// }; + const WarningModal = ({ isOpen, onClose }) => { - if (!isOpen) return null; // 如果警告框不显示,则不渲染 + // 添加一个状态来控制是否应用动画 + const [isClosing, setIsClosing] = useState(false); - return ( -
+ // 定义关闭警告框的函数 + const handleClose = () => { + setIsClosing(true); // 设置状态以触发动画 + setTimeout(() => { + setIsClosing(false); // 确保动画结束后状态能够重置 + onClose(); // 动画结束后调用传入的onClose函数来关闭Modal + }, 500); // 500ms 应与CSS动画持续时间一致 + }; + + if (!isOpen || !isClosing) { + return ( +
- × + {!isClosing && ×}

提醒 : 请及时完成实训内容!!!

); + } + return null; }; const list4=[ @@ -23,6 +49,7 @@ const list4=[ ] // 首页 学习分析 function SubjectPage(){ + const student_ID=localStorage.getItem('islogin') if(student_ID==null){ alert('登录过期,请重新登录') @@ -48,13 +75,10 @@ function SubjectPage(){ // 控制警告框显示的状态 const [isWarningOpen, setWarningOpen] = useState(false); - // 打开警告框 const openWarning = () => setWarningOpen(true); - // 关闭警告框 const closeWarning = () => setWarningOpen(false); - // 可以在适当的时机调用openWarning函数来显示警告框 useEffect(() => { openWarning(); diff --git a/app-dm/src/router/index.jsx b/app-dm/src/router/index.jsx index 1a281f0..1bdcebf 100755 --- a/app-dm/src/router/index.jsx +++ b/app-dm/src/router/index.jsx @@ -16,7 +16,6 @@ import AnalysePage from '../pages/ListPages/Analyse/AnalysePages'; import Exam from '../pages/ListPages/Subject/Exam'; import Operation1 from '../pages/ListPages/Training/Operation1'; import Operation2 from '../pages/ListPages/Training/Operation2'; -import Operation3 from '../pages/ListPages/Training/Operation3'; // 教师页面 import TeacherPage from '../TeacherPages/TeacherPage'; @@ -78,7 +77,6 @@ function App() { }/> {/*实训管理-发布实训*/} }/> {/* 实训页面1:理论 */} }/> {/* 实训页面2:数据库 */} - }/> {/* 实训页面3:web前端 */} }/> }/>