Files
WebWork/frontend/public/js/student.js
祀梦 e5a2a9d042 feat: 添加学生个人中心页面和数据库备份功能
refactor(auth): 重构认证模块适配Bootstrap 5样式
feat(controller): 在登录响应中返回用户对象
feat(server): 添加学生个人中心路由
refactor(models): 重构学生和成绩模型结构
style: 更新登录和注册页面UI设计
chore: 添加数据库备份脚本和空备份文件
2025-12-21 22:34:29 +08:00

135 lines
4.6 KiB
JavaScript

/**
* 学生端功能管理
*/
class StudentManager {
constructor() {
this.apiBase = '/api/student';
this.init();
}
init() {
this.initDashboard();
this.updateCurrentTime();
setInterval(() => this.updateCurrentTime(), 1000);
}
updateCurrentTime() {
const timeElement = document.getElementById('currentTime');
if (timeElement) {
const now = new Date();
const options = {
year: 'numeric', month: 'long', day: 'numeric',
hour: '2-digit', minute: '2-digit', second: '2-digit'
};
timeElement.textContent = now.toLocaleString('zh-CN', options);
}
}
async initDashboard() {
// 检查是否在仪表板页面
if (!document.getElementById('gradesTableBody')) return;
try {
const response = await fetch(`${this.apiBase}/grades`);
const result = await response.json();
if (result.success) {
this.renderDashboard(result.data);
} else {
if (window.authManager) {
window.authManager.showNotification(result.message || '获取数据失败', 'error');
}
}
} catch (error) {
console.error('Fetch dashboard data failed:', error);
}
}
renderDashboard(data) {
const { grades, statistics } = data;
// 渲染统计数据
if (statistics) {
this.updateElement('gpaValue', statistics.gpa);
this.updateElement('courseCount', statistics.totalCourses);
this.updateElement('creditTotal', statistics.totalCredits);
// 班级排名如果后端没提供,可以显示为 '-' 或固定值
this.updateElement('classRank', statistics.classRank || '-');
}
// 渲染成绩表格
const tbody = document.getElementById('gradesTableBody');
if (tbody) {
if (!grades || grades.length === 0) {
tbody.innerHTML = '<tr><td colspan="8" class="text-center py-4 text-muted">暂无成绩记录</td></tr>';
return;
}
tbody.innerHTML = grades.map(grade => `
<tr>
<td>${grade.course_name}</td>
<td>${grade.course_code || '-'}</td>
<td>${grade.credit}</td>
<td>${grade.score}</td>
<td>${grade.grade_level || '-'}</td>
<td>${grade.grade_point || '-'}</td>
<td>
<span class="badge ${this.getScoreBadgeClass(grade.score)}">
${this.getScoreText(grade.score)}
</span>
</td>
<td>
<button class="btn btn-sm btn-outline-primary" onclick="studentManager.viewDetails(${grade.id})">
<i class="fas fa-eye"></i> 详情
</button>
</td>
</tr>
`).join('');
}
}
updateElement(id, value) {
const el = document.getElementById(id);
if (el) el.textContent = value;
}
getScoreBadgeClass(score) {
const s = parseFloat(score);
if (s >= 90) return 'bg-success';
if (s >= 80) return 'bg-info';
if (s >= 60) return 'bg-warning';
return 'bg-danger';
}
getScoreText(score) {
const s = parseFloat(score);
if (s >= 60) return '及格';
return '不及格';
}
viewDetails(id) {
// 实现查看详情逻辑,或者跳转到详情页
console.log('View details for score:', id);
}
}
// 初始化
document.addEventListener('DOMContentLoaded', () => {
window.studentManager = new StudentManager();
// 从 Session 获取用户信息并更新 UI
fetch('/api/auth/me')
.then(res => res.json())
.then(result => {
if (result.success && result.data.user) {
const user = result.data.user;
const nameEl = document.getElementById('userName');
const studentNameEl = document.getElementById('studentName');
const studentClassEl = document.getElementById('studentClass');
if (nameEl) nameEl.textContent = user.name;
if (studentNameEl) studentNameEl.textContent = user.name;
if (studentClassEl) studentClassEl.textContent = user.class || '未分配';
}
});
});