2312072104
/
dm
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

1

This commit is contained in:
nopy 2024-07-08 22:09:24 +08:00
parent 6bb52471ad
commit 76582c0d06
14 changed files with 115 additions and 85 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
app-dm/src/nav/nav.jsx
View File

@ -57,6 +57,13 @@ function HeaderNav() {
<div className='Form-nav'> <div className='Form-nav'>
<div className="set-list-nav"> <div className="set-list-nav">
<button className='close-btn-nav' onClick={handleSettingsClick}>X</button> <button className='close-btn-nav' onClick={handleSettingsClick}>X</button>
<ul>
<li>账号管理</li>
<li>个人信息</li>
<li>登录设备</li>
<li>我的通知</li>
<li>个性化</li>
</ul>
</div> </div>
<button className='exit-btn-nav' onClick={outlog}>退出登录</button> <button className='exit-btn-nav' onClick={outlog}>退出登录</button>
</div> </div>

22
app-dm/src/nav/style.css
View File

@ -95,7 +95,7 @@
background-color: #e7f8fbf3; background-color: #e7f8fbf3;
padding: 0; padding: 0;
list-style: none; list-style: none;
z-index: 1; z-index: 1000;
/* 默认隐藏在屏幕左侧外 */ /* 默认隐藏在屏幕左侧外 */
transform: translateX(-100%); transform: translateX(-100%);
@ -127,6 +127,20 @@
.set-list-nav { .set-list-nav {
margin-top: 80px; margin-top: 80px;
} }
.set-list-nav ul {
background-color: transparent;
padding: 0;
}
.set-list-nav li {
height: 80px;
width: 100%;
font-size: 20px;
text-align: center;
line-height: 80px;
border-bottom: 1px solid #4f946a;
background-color: #e7f8fbf3;
overflow: hidden;
}
.close-btn-nav { .close-btn-nav {
width: 30px; width: 30px;
height: 25px; height: 25px;
@ -146,13 +160,17 @@
background-color: #c6f1e3; background-color: #c6f1e3;
} }
.set-list-nav li:hover{
cursor: pointer;
color: rgb(13, 121, 105);
}
.exit-btn-nav{ .exit-btn-nav{
height: 40px; height: 40px;
width: 170px; width: 170px;
border: none; border: none;
border-radius: 10px; border-radius: 10px;
font-size: 18px; font-size: 18px;
margin-top: 340%; margin-top: 290px;
margin-left: 25px; margin-left: 25px;
background-color: rgb(176, 245, 218); background-color: rgb(176, 245, 218);
} }

63
app-dm/src/pages/Home/Home.css
View File

@ -1,8 +1,7 @@
/* 右侧首页内容 */ /* 右侧首页内容 */
.body-right-home{ .body-right-home{
width: 1420px; width: 1420px;
/* height: 1330px; */ height: 1280px;
height: 830px;
position: absolute; position: absolute;
top: 72px; top: 72px;
left: 220px; left: 220px;
@ -33,38 +32,23 @@
border-radius: 10px 10px 0 0; border-radius: 10px 10px 0 0;
} }
/* 灰盒子 */
/* .block{
width: 1300px;
height: 150px;
position: absolute;
top: 220px;
left: 58px;
border: 1px solid #d3d3d3;
background-color: #fff;
}
.block-box{
width: 98%;
height: 128px;
background-color: #f7f8f9;
border: 1px solid #d3d3d3;
margin: 11px;
} */
/* 题目+课表 */ /* 题目+课表 */
/* .box-two{ .box-two{
width: 1420px; width: 1420px;
height: 390px; height: 390px;
display: flex; display: flex;
align-content: center; align-content: center;
} */ }
/* 题目 */ /* 题目 */
/* .list{ .list{
width: 560px; width: 560px;
height: 310px; height: 310px;
/* background-color: #e9eef8; */
/* background-color: #bdd2ee; */
background-image: linear-gradient(120deg,rgb(192, 215, 245),rgb(217, 237, 250),rgb(178, 207, 245)); background-image: linear-gradient(120deg,rgb(192, 215, 245),rgb(217, 237, 250),rgb(178, 207, 245));
position: absolute; position: absolute;
top: 390px; top: 260px;
left: 115px; left: 115px;
padding: 10px; padding: 10px;
} }
@ -75,6 +59,7 @@
margin-left: -5px; margin-left: -5px;
font-weight: 600; font-weight: 600;
font-size: 18px; font-size: 18px;
/* background-color: #d5e3ff; */
background-color: #cce6f6; background-color: #cce6f6;
color: #506f98; color: #506f98;
border-radius: 0 0 10px 10px; border-radius: 0 0 10px 10px;
@ -114,17 +99,17 @@
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
} */ }
/* 课表 */ /* 课表 */
.timetable{ .timetable{
width: 620px; width: 580px;
height: 400px; height: 330px;
/* background-color: #eee8f9; */ /* background-color: #eee8f9; */
background-image: linear-gradient(rgb(234, 212, 251),rgb(219, 195, 238),rgb(218, 184, 244)); background-image: linear-gradient(rgb(234, 212, 251),rgb(219, 195, 238),rgb(218, 184, 244));
position: absolute; position: absolute;
top: 280px; top: 260px;
left: 780px; left: 730px;
} }
.schedule{ .schedule{
width: 560px; width: 560px;
@ -146,9 +131,9 @@
box-shadow: 2px 0 5px #beb0dc; box-shadow: 2px 0 5px #beb0dc;
} }
.schedule table{ .schedule table{
width: 530px; width: 500px;
height: 340px; height: 280px;
margin-top: -45px; margin-top: -50px;
margin-left: 40px; margin-left: 40px;
background-color: #ffffff; background-color: #ffffff;
border: 1px solid rgb(187, 186, 186); border: 1px solid rgb(187, 186, 186);
@ -164,12 +149,11 @@
/* 图表 */ /* 图表 */
.chart{ .chart{
width: 730px; width: 1200px;
height: 400px; height: 500px;
position: absolute; position: absolute;
left: 110px; left: 110px;
top: 280px; top: 660px;
left: 20px;
/* background-color: #d8f2f7d7; */ /* background-color: #d8f2f7d7; */
background-image: linear-gradient(#d8f2f7d7,rgb(165, 232, 232),rgba(192, 244, 243, 0.916)); background-image: linear-gradient(#d8f2f7d7,rgb(165, 232, 232),rgba(192, 244, 243, 0.916));
} }
@ -188,11 +172,11 @@
} }
.line-graph{ .line-graph{
width: 620px; width: 860px;
height: 320px; height: 420px;
padding: 10px; padding: 10px;
margin-top: -90px; margin-top: -90px;
margin-left: 50px; margin-left: 160px;
background-color: #fff; background-color: #fff;
border-radius: 15px; border-radius: 15px;
} }
@ -226,6 +210,5 @@
height: 60px; height: 60px;
position: absolute; position: absolute;
bottom: 0; bottom: 0;
/* background-color: rgba(49, 67, 113, 0.4); */ background-color: #dbdeec;
background-color: #d8dcec;
} }

14
app-dm/src/pages/Home/Home.jsx
View File

@ -145,13 +145,8 @@ function Home(){
<span>吾日三省吾身,吃饭了吗,睡觉了吗,上达梦做题了吗？</span> <span>吾日三省吾身,吃饭了吗,睡觉了吗,上达梦做题了吗？</span>
<img src={Ad} alt="" height='190px' width='100%'/> <img src={Ad} alt="" height='190px' width='100%'/>
</div> </div>
{/* <div className='block'> <div className='box-two'>
<div className='block-box'> <div className='list'>
内容暂定
</div>
</div> */}
{/* <div className='box-two'> */}
{/* <div className='list'>
<h3>练习和考试</h3> <h3>练习和考试</h3>
<ul> <ul>
<li onClick={handelTestClick}> <li onClick={handelTestClick}>
@ -171,7 +166,7 @@ function Home(){
<span>暂定时间3</span> <span>暂定时间3</span>
</li> </li>
</ul> </ul>
</div> */} </div>
<div className='timetable'> <div className='timetable'>
{/* 课表 */} {/* 课表 */}
<div className='schedule'> <div className='schedule'>
@ -217,9 +212,10 @@ function Home(){
</table> </table>
</div> </div>
</div> </div>
{/* </div> */} </div>
<div className='chart'> <div className='chart'>
<h3>分析图表</h3> <h3>分析图表</h3>
{/* 图表 (未完成)*/}
<div className='line-graph' > <div className='line-graph' >
<Line data={chartData} options={options}/> <Line data={chartData} options={options}/>
</div> </div>

3
app-dm/src/pages/ListPages/Analyse/AnalysePages.css
View File

@ -16,7 +16,8 @@
.test-analyse li{ .test-analyse li{
cursor: pointer; cursor: pointer;
overflow: hidden; overflow: hidden;
width: 1140px; /* width: 1140px; */
width: 100%;
height: 70px; height: 70px;
background-color: #ffffff; background-color: #ffffff;
margin-top: 15px; margin-top: 15px;

13
app-dm/src/pages/ListPages/Subject/Exam.css
View File

@ -21,7 +21,7 @@
/* 第二页（实训题）的左边导航 */ /* 第二页（实训题）的左边导航 */
.nav-left-exam{ .nav-left-exam{
width: 215px; width: 215px;
height: 1540px; height: 900px;
position: absolute; position: absolute;
box-shadow: 2px 2px 6px #d4d4d4; box-shadow: 2px 2px 6px #d4d4d4;
} }
@ -128,4 +128,15 @@
left: 230px; left: 230px;
border-radius: 10px; border-radius: 10px;
background-color: #f7f8fa; background-color: #f7f8fa;
}
.subject-btn{
width: 100px;
height: 40px;
border: none;
margin-top: 150px;
margin-left: 1200px;
border-radius: 20px;
font-size: 18px;
background-image: linear-gradient(rgb(195, 255, 227),rgb(168, 224, 200));
} }

2
app-dm/src/pages/ListPages/Subject/Exam.jsx
View File

@ -331,7 +331,7 @@ function Exam() {
</tbody> </tbody>
</table> </table>
)} )}
<button onClick={submit}>提交</button> <button onClick={submit} className='subject-btn'>提交</button>
</div> </div>
</div> </div>
</div> </div>

2
app-dm/src/pages/ListPages/Subject/SubjectPage.css
View File

@ -1,5 +1,3 @@
/* 右侧页面 */ /* 右侧页面 */
.body-right-subject{ .body-right-subject{
width: 1420px; width: 1420px;

21
app-dm/src/pages/ListPages/Training/Operation1.css
View File

@ -195,4 +195,25 @@
.btn-back1 p{ .btn-back1 p{
font-size: 20px; font-size: 20px;
margin-left: 5px; margin-left: 5px;
}
.operation-btn1{
width: 100px;
height: 40px;
border: none;
margin-top: 50px;
margin-left: 20px;
border-radius: 20px;
font-size: 18px;
background-image: linear-gradient(rgb(195, 255, 227),rgb(168, 224, 200));
}
.operation-btn2{
width: 100px;
height: 40px;
border: none;
margin-top: 50px;
margin-left: 20px;
border-radius: 20px;
font-size: 18px;
background-image: linear-gradient(rgb(195, 255, 227),rgb(168, 224, 200));
} }

6
app-dm/src/pages/ListPages/Training/Operation1.jsx
View File

@ -351,8 +351,10 @@ function Operation1() {
</tbody> </tbody>
</table> </table>
)} )}
<button onClick={submit}>保存答案</button> <button onClick={submit} className='operation-btn1'>保存答案</button>
<Link to={`/operation2/${operateID}`}><button onClick={saveAnswers}>下一页</button></Link> <Link to={`/operation2/${operateID}`}>
<button onClick={saveAnswers} className='operation-btn2'>下一页</button>
</Link>
</div> </div>
</div> </div>
</div> </div>

22
app-dm/src/pages/ListPages/Training/Operation2.css
View File

@ -75,21 +75,26 @@
/* 第二页（实训题题）的右边页面 */ /* 第二页（实训题题）的右边页面 */
.body-right2{ .body-right2{
width: 1415px; width: 1415px;
height: 550px; height: 800px;
position: absolute; position: absolute;
top: 64px; top: 64px;
left: 230px; left: 230px;
border-radius: 10px; border-radius: 10px;
background-color: #f7f8fa; background-color: #f7f8fa;
} }
.body-right2 p{
font-size: 18px;
margin-left: 50px;
}
Link{
font-size: 18px;
margin-left: 50px;
}
/* 返回按钮 */ /* 返回按钮 */
.btn-back2{ .btn-back2{
height: 50px; height: 50px;
position: absolute; position: absolute;
bottom: 50px; bottom: 60px;
right: 230px; right: 230px;
padding: 0 20px; padding: 0 20px;
display: flex; display: flex;
@ -104,15 +109,16 @@
} }
/* 前进按钮 */ /* 前进按钮 */
.btn-out2{ .btn-out2{
width: 140px;
cursor: pointer; cursor: pointer;
height: 50px; height: 50px;
position: absolute; position: absolute;
bottom: 50px; bottom: 60px;
right: 80px; right: 70px;
padding: 0 20px; padding: 0 20px;
display: flex; display: flex;
align-items: center; align-items: center;
/* border: 1px solid #000; */ border: none;
box-shadow: 1px 2px 5px gray; box-shadow: 1px 2px 5px gray;
background-color: #efefef; background-color: #efefef;
} }

10
app-dm/src/pages/ListPages/Training/Operation2.jsx
View File

@ -157,14 +157,14 @@ function Operation2() {
<div className='body-right2'> <div className='body-right2'>
{/* 前端连接数据库⬇ */} {/* 前端连接数据库⬇ */}
{ !isTrue&&TrainData&&Src&&<div> { !isTrue&&TrainData&&Src&&<div>
<p>{TrainData['operateID'][3][0]}</p> <p>题目：{TrainData['operateID'][3][0]}</p>
<Link to={Src[6]}>{Src[6]}</Link> <Link to={Src[6]} style={{fontSize:'18px',marginLeft:'50px'}}>{Src[6]}</Link>
<br /> <br />
<Link to={Src[7]}>{Src[7]}</Link> <Link to={Src[7]} style={{fontSize:'18px',marginLeft:'50px'}}>{Src[7]}</Link>
<br /> <br />
<Link to={Src[8]}>{Src[8]}</Link> <Link to={Src[8]} style={{fontSize:'18px',marginLeft:'50px'}}>{Src[8]}</Link>
<br /> <br />
点击以上链接前往实训 <p>点击以上链接前往实训</p>
</div> </div>
} }
{/* 前端连接数据库 ⬆*/} {/* 前端连接数据库 ⬆*/}

2
app-dm/src/pages/ListPages/Training/TrainingPage.css
View File

@ -77,7 +77,7 @@
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
z-index: 1000; z-index: 1;
animation: slideInFromUp 0.5s ease-out forwards; animation: slideInFromUp 0.5s ease-out forwards;
} }
@keyframes slideInFromUp { @keyframes slideInFromUp {

13
app-dm/src/pages/ListPages/Training/TrainingPage.jsx
View File

@ -4,19 +4,6 @@ import '../Training/TrainingPage.css'
import axios from 'axios'; import axios from 'axios';
// const WarningModal = ({ isOpen, onClose }) => {
// if (!isOpen) return; // 如果警告框不显示，则不渲染
// return (
// <div className="warning-box">
// <div className="warning-content">
// <span className="close-button" onClick={onClose}>×</span>
// <p>提醒 : 请及时完成实训内容！！！</p>
// </div>
// </div>
// );
// };
const WarningModal = ({ isOpen, onClose }) => { const WarningModal = ({ isOpen, onClose }) => {
// 添加一个状态来控制是否应用动画 // 添加一个状态来控制是否应用动画
const [isClosing, setIsClosing] = useState(false); const [isClosing, setIsClosing] = useState(false);