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

http://localhost:3000/classID/202401

This commit is contained in:
30404 2024-06-26 11:24:33 +08:00
parent aa49c5dd8f
commit 9b85fcff63
5 changed files with 168 additions and 132 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

284
app-dm/src/TeacherPages/classlistpages/classId.jsx
View File

@ -1,135 +1,169 @@
import { useParams } from 'react-router-dom';
import { Link } from 'react-router-dom';
import React, { useEffect, useState } from 'react';
import { BarChart, Bar, XAxis, YAxis, CartesianGrid, Tooltip } from 'recharts';
import axios from 'axios';
import './classid.css'
import { useParams } from 'react-router-dom';
import { Link } from 'react-router-dom';
import React, { useEffect, useState } from 'react';
import { BarChart, Bar, XAxis, YAxis, CartesianGrid, Tooltip } from 'recharts';
import axios from 'axios';
import './classid.css'
function TeacherPage() {
const click=()=>{
console.log(TestScore);
}
const teacher_ID=localStorage.getItem('islogin')
if(teacher_ID==null){
alert('登录过期，请重新登录')
window.location.href='http://36.138.114.105:30294/'
}
const { key } = useParams();
const [isclick,setisclick]=useState(false)
//学生表格
const [classdata,setClassData]=useState([])
const class_succeed = async () => {
try{
const class_scr=await axios.post('/api/teacher/find_student',{key})
const class_data=class_scr.data
setClassData(class_data[1])
setisclick(true)
}catch(error){
alert(error)
function TeacherPage() {
const [selectedSubject, setSelectedSubject] = useState();
const [ID,setID]=useState(null)
const[TestScore,setTestScore]=useState([])
const { key } = useParams();
const [isclick,setisclick]=useState(false)
const [classdata,setClassData]=useState([])
const [studentScores, setStudentScores] = useState([])
const [name,setname]=useState('')
const click=()=>{
console.log(studentScores);
}
}
useState(()=>{
class_succeed();
},[])
//柱形图
const [studentScores, setStudentScores] = useState([]);
useEffect(() => {
class_succeed().then(() => {
const scores = classdata.map(student => ({
name: 11.26, // 学生姓名
score:10, // 学生分数
}));
setStudentScores(scores);
});
}, [isclick]);
function formatDate(dateString) {
// 将日期字符串转换为 Date 对象
const date = new Date(dateString);
// 获取年份、月份和日期
const year = date.getFullYear();
const monthIndex = date.getMonth();
const day = date.getDate();
// 构建格式化后的日期字符串
const formattedDate = `${year}-${(monthIndex + 1).toString().padStart(2, '0')}-${day.toString().padStart(2, '0')}`;
return formattedDate;
}
const[TestScore,setTestScore]=useState()
const Find_details=async (ID)=>{
try{
const Find_details_Src=await axios.post('api/Find_details',{
ID
})
setTestScore(Find_details_Src.data)
}catch{
alert('Find_details出错')
const teacher_ID=localStorage.getItem('islogin')
if(teacher_ID==null){
alert('登录过期，请重新登录')
window.location.href='http://36.138.114.105:30294/'
}
}
//学生表格
const class_succeed = async () => {
try{
const class_scr=await axios.post('/api/teacher/find_student',{key})
const class_data=class_scr.data
setClassData(class_data[1])
setisclick(true)
}catch(error){
alert(error)
}
}
useState(()=>{
class_succeed();
},[])
return(
<div className='body-right-classId'>
<div id='body-right-bottom'>
<h3>班级信息</h3>
<div id='body-right-bottom-left'>
<div id='body-right-bottom-left-nav'>
<p style={{ display: 'flex', justifyContent: 'space-between' }}>
<span style={{ flex: 1 }}>班级</span>
<span style={{ flex: 1 }}>姓名</span>
<span style={{ flex: 1 }}>学号</span>
<span style={{ flex: 1 }}>性别</span>
<span style={{ flex: 1 }}>联系电话</span>
<span style={{ flex: 1 }}>出生日期</span>
<span style={{ flex: 1 }}>查看详情</span>
</p>
useEffect(() => {
class_succeed().then(() => {
const scores = [];
// 遍历 TestScore 对象的每个值
for (const studentId in TestScore) {
// 如果当前学生的信息数组没有被跳过，则对其做进一步处理
if (TestScore.hasOwnProperty(studentId)) {
const studentInfo = TestScore[studentId];
// 检查当前学生的信息数组是否符合特定的科目要求
if (studentInfo[2] === selectedSubject) {
// 只有当学生信息数组的第3个元素（科目）等于"Chinese"时，才添加到 scores 数组中
scores.push({
name: studentInfo[3], // 假设姓名总是位于数组的第4个位置
score: studentInfo[5], // 假设分数总是位于数组的第6个位置
});
}
}
}
setStudentScores(scores);
});
}, [selectedSubject]);
function formatDate(dateString) {
// 将日期字符串转换为 Date 对象
const date = new Date(dateString);
// 获取年份、月份和日期
const year = date.getFullYear();
const monthIndex = date.getMonth();
const day = date.getDate();
// 构建格式化后的日期字符串
const formattedDate = `${year}-${(monthIndex + 1).toString().padStart(2, '0')}-${day.toString().padStart(2, '0')}`;
return formattedDate;
}
const Find_details= async ()=>{
if(ID!==null){
try{
const Find_details_Src = await axios.post('/api/teacher/Find_details',{
ID
})
setTestScore(Find_details_Src.data['TestScore'])
setStudentScores([])
}catch{
alert('Find_details')
}
}
}
useEffect(()=>{
Find_details()
const sltvalue=document.getElementById('selectvalue')
sltvalue.value=''
},[ID])
function handleSubjectChange(event) {
setSelectedSubject(event.target.value);
}
const handleClick = (item) => {
setID(classdata[item][1]);
setname(classdata[item][0]);
};
return(
<div className='body-right-classId'>
<div id='body-right-bottom'>
<h3>班级信息</h3>
<div id='body-right-bottom-left'>
<div id='body-right-bottom-left-nav'>
<p style={{ display: 'flex', justifyContent: 'space-between' }}>
<span style={{ flex: 1 }}>班级</span>
<span style={{ flex: 1 }}>姓名</span>
<span style={{ flex: 1 }}>学号</span>
<span style={{ flex: 1 }}>性别</span>
<span style={{ flex: 1 }}>联系电话</span>
<span style={{ flex: 1 }}>出生日期</span>
<span style={{ flex: 1 }}>查看详情</span>
</p>
</div>
<div id='body-right-student-box'>
<table>
<tbody>
{Object.keys(classdata).map((item)=>(
<tr key={item}>
<td className='box-content'>{classdata[item][2]}</td>
<td className='box-content'>{classdata[item][0]}</td>
<td className='box-content'>{classdata[item][1]}</td>
<td className='box-content'>{classdata[item][3]}</td>
<td className='box-content'>{classdata[item][5]}</td>
<td className='box-content'>{formatDate(classdata[item][4])}</td>
<td className='box-content'><button onClick={(e)=>handleClick(item)} style={{border:'none'}}>查看详情</button></td>
</tr>
))}
</tbody>
</table>
</div>
</div>
<div id='body-right-student-box'>
<table>
<tbody>
{Object.keys(classdata).map((item)=>(
<tr key={item}>
<td className='box-content'>{classdata[item][2]}</td>
<td className='box-content'>{classdata[item][0]}</td>
<td className='box-content'>{classdata[item][1]}</td>
<td className='box-content'>{classdata[item][3]}</td>
<td className='box-content'>{classdata[item][5]}</td>
<td className='box-content'>{formatDate(classdata[item][4])}</td>
<td className='box-content'><button onClick={()=>Find_details(classdata[item][1])} style={{border:'none'}}>查看详情</button></td>
</tr>
))}
</tbody>
</table>
</div>
<div className='body-test-score'>
<h3>成绩</h3>
<div className='body-test-score-bar'>
{name&&<div className='studentName'>已选中{name}</div>}
<button onClick={click}>测试</button>
<select onChange={handleSubjectChange} id='selectvalue'>
<option value="">请选择科目</option>
<option value="Chinese">语文</option>
<option value="Math">数学</option>
<option value="English">英语</option>
<option value="Train">实训</option>
</select>
<div className='table-bar'>
<BarChart width={600} height={350} data={studentScores} barSize={80} className='bar' >
<CartesianGrid strokeDasharray="3 3" />
<XAxis dataKey="name" />
<YAxis dataKey="score"/>
<Tooltip />
<Bar dataKey="score" fill="#ffeed4" />
</BarChart>
</div>
</div>
</div>
</div>
<div className='body-test-score'>
<h3>成绩</h3>
<div className='body-test-score-bar'>
<div className='studentName'>名字</div>
<button onClick={click}>测试</button>
<select>
<option value="">请选择科目</option>
<option value="china">语文</option>
<option value="math">数学</option>
<option value="english">英语</option>
<option value="test">实训</option>
</select>
<div className='table-bar'>
<BarChart width={600} height={350} data={studentScores} barSize={90} className='bar' >
<CartesianGrid strokeDasharray="3 3" />
<XAxis dataKey="name" />
<YAxis dataKey="score"/>
<Tooltip />
<Bar dataKey="score" fill="#ffeed4" />
</BarChart>
</div>
</div>
</div>
</div>
)
}
export default TeacherPage;
)
}
export default TeacherPage;

2
app-dm/src/TeacherPages/classlistpages/classid.css
View File

@ -102,7 +102,5 @@
.studentName{
margin-top: 20px;
font-size: 18px;
width: 72px;
margin-left: 50px;
border: 1px solid black;
}

3
app-dm/src/TeacherPages/list_pods/List_pods.jsx
View File

@ -2,4 +2,5 @@ function List_pods(){
return(
<div></div>
)
}
}
export default List_pods

9
python/app.py
View File

@ -231,10 +231,13 @@ def SendTrainTest():
return '发布成功'
@app.route('/api/Find_details',methods=["POST"])
@app.route('/api/teacher/Find_details',methods=["POST"])
def Find_details():
id=request.json['student_ID']
return Find_details(id)
data=request.json
ID=data['ID']
result=Find_details_Func(ID)
print(result)
return jsonify({'TestScore':result})
@app.route('/')

2
python/teacher_func.py
View File

@ -269,7 +269,7 @@ def SendTrainTestFunc(TrainChoice,TrainCompletion,TrainJudge,Hour,Min,StopTime,C
# return dic_last_three # 返回一个新字典，该字典仅包含排序后的最后三个键及其对应的值
def Find_details(ID):
def Find_details_Func(ID):
dic = {}
cursor = db.cursor()
cursor.execute(f"SELECT * FROM STUDENT_TEST WHERE STUDENT_ID=? AND TF='true' ", (ID))