refactor(frontend): 重构前端目录结构并优化认证流程
将前端文件从html目录迁移到views目录，按功能模块组织 重构认证中间件和路由处理，简化页面权限控制 更新静态资源引用路径，统一使用/public前缀 添加学生仪表板页面，优化移动端显示 移除旧版html和js文件，更新样式和脚本
This commit is contained in:
祀梦
130
frontend/views/auth/index.html
Normal file
130
frontend/views/auth/index.html
Normal file
@@ -0,0 +1,130 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>学生成绩管理系统</title>
|
||||
<link rel="stylesheet" href="/public/css/style.css">
|
||||
<link rel="stylesheet" href="/public/css/main.css">
|
||||
</head>
|
||||
<body>
|
||||
<!-- 导航<E5AFBC><E888AA>?-->
|
||||
<nav class="navbar">
|
||||
<div class="navbar-brand">
|
||||
<i class="fas fa-graduation-cap"></i>
|
||||
<span>XX学校成绩管理系统</span>
|
||||
</div>
|
||||
<div class="navbar-menu">
|
||||
<a href="/" class="btn btn-secondary">
|
||||
<i class="fas fa-home"></i> 主页
|
||||
</a>
|
||||
<div class="navbar-user">
|
||||
<a href="/login" class="btn btn-primary" id="loginBtn">
|
||||
<i class="fas fa-sign-in-alt"></i> 登录
|
||||
</a>
|
||||
<a href="/register" class="btn btn-secondary" id="registerBtn">
|
||||
<i class="fas fa-user-plus"></i> 注册
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<!-- 主体内容<E58685><E5AEB9>?-->
|
||||
<main>
|
||||
<!-- 英雄区域 -->
|
||||
<section class="hero-section">
|
||||
<div class="hero-content">
|
||||
<h1 class="hero-title">XX学校学生成绩管理系统</h1>
|
||||
<p class="hero-subtitle">
|
||||
高效、安全、智能的成绩管理平台，为学校师生提供全方位的成绩管理服务<E69C8D><E58AA1>? 实现成绩录入、查询、统计和分析的一体化解决方案<E696B9><E6A188>? </p>
|
||||
<div class="cta-buttons">
|
||||
<a href="/login" class="btn btn-primary" id="heroLoginBtn">
|
||||
<i class="fas fa-sign-in-alt"></i> 立即登录
|
||||
</a>
|
||||
<a href="#features" class="btn btn-secondary">
|
||||
<i class="fas fa-info-circle"></i> 了解功能
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 功能特色 -->
|
||||
<section id="features" class="features-section">
|
||||
<h2 class="section-title">系统功能特色</h2>
|
||||
<div class="features-grid">
|
||||
<div class="feature-card">
|
||||
<div class="feature-icon">
|
||||
<i class="fas fa-user-graduate"></i>
|
||||
</div>
|
||||
<h3 class="feature-title">学生成绩查询</h3>
|
||||
<p class="feature-description">
|
||||
学生可随时查看个人成绩，包括各科成绩、平均分、排名等信息<E4BFA1><E681AF>? 支持成绩趋势分析和历史记录查看<E69FA5><E79C8B>? </p>
|
||||
</div>
|
||||
|
||||
<div class="feature-card">
|
||||
<div class="feature-icon">
|
||||
<i class="fas fa-chalkboard-teacher"></i>
|
||||
</div>
|
||||
<h3 class="feature-title">教师成绩管理</h3>
|
||||
<p class="feature-description">
|
||||
教师可便捷录入、修改、查询学生成绩，支持批量操作和成绩统计分析，
|
||||
提供多种数据导出格式<E6A0BC><E5BC8F>? </p>
|
||||
</div>
|
||||
|
||||
<div class="feature-card">
|
||||
<div class="feature-icon">
|
||||
<i class="fas fa-user-shield"></i>
|
||||
</div>
|
||||
<h3 class="feature-title">管理员权限控<EFBFBD><EFBFBD>?/h3>
|
||||
<p class="feature-description">
|
||||
管理员可管理用户账户、学生信息，查看系统统计报表<E68AA5><E8A1A8>? 设置权限和系统参数，确保数据安全<E5AE89><E585A8>? </p>
|
||||
</div>
|
||||
|
||||
<div class="feature-card">
|
||||
<div class="feature-icon">
|
||||
<i class="fas fa-chart-line"></i>
|
||||
</div>
|
||||
<h3 class="feature-title">智能统计分析</h3>
|
||||
<p class="feature-description">
|
||||
提供丰富的图表统计功能，包括成绩分布、趋势分析、对比图表等<E8A1A8><E7AD89>? 帮助学校进行教学评估和决策支持<E694AF><E68C81>? </p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- 行动号召 -->
|
||||
<section class="cta-section">
|
||||
<h2 class="cta-title">立即体验智能成绩管理</h2>
|
||||
<p style="font-size: 1.2rem; color: #666; margin-bottom: 40px; max-width: 600px; margin-left: auto; margin-right: auto;">
|
||||
加入XX学校成绩管理系统，体验高效、便捷的成绩管理服务<E69C8D><E58AA1>? </p>
|
||||
<div class="cta-buttons">
|
||||
<a href="/login" class="btn btn-primary">
|
||||
<i class="fas fa-sign-in-alt"></i> 开始使<E5A78B><E4BDBF>? </a>
|
||||
<a href="#" class="btn btn-secondary">
|
||||
<i class="fas fa-book"></i> 查看文档
|
||||
</a>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<!-- 页脚 -->
|
||||
<footer class="footer">
|
||||
<div class="footer-content">
|
||||
<h3 style="margin-bottom: 20px;">XX学校学生成绩管理系统</h3>
|
||||
<p style="color: #ccc; margin-bottom: 20px; max-width: 600px; margin-left: auto; margin-right: auto;">
|
||||
致力于为学校提供专业、安全、高效的数字化成绩管理解决方案<E696B9><E6A188>? </p>
|
||||
<div class="footer-links">
|
||||
<a href="#"><i class="fas fa-info-circle"></i> 关于我们</a>
|
||||
<a href="#"><i class="fas fa-envelope"></i> 联系我们</a>
|
||||
<a href="#"><i class="fas fa-shield-alt"></i> 隐私政策</a>
|
||||
<a href="#"><i class="fas fa-file-contract"></i> 服务条款</a>
|
||||
</div>
|
||||
<div class="copyright">
|
||||
<p>© 2023 XX学校学生成绩管理系统 版权所<E69D83><E68980>?/p>
|
||||
<p>联系电话<EFBFBD><EFBFBD>?10-12345678 | 邮箱：contact@school.edu.cn</p>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<script src="/public/js/main.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
62
frontend/views/auth/login.html
Normal file
62
frontend/views/auth/login.html
Normal file
@@ -0,0 +1,62 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>学生成绩管理系统 - 登录</title>
|
||||
<link rel="stylesheet" href="/public/css/style.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="auth-container">
|
||||
<div class="auth-header">
|
||||
<h1><i class="fas fa-graduation-cap"></i> 学生成绩管理系统</h1>
|
||||
<p>请登录您的账户</p>
|
||||
</div>
|
||||
|
||||
<div class="auth-card">
|
||||
<form id="loginForm">
|
||||
<div class="form-group">
|
||||
<label for="id">
|
||||
<i class="fas fa-user"></i> 学号/工号
|
||||
</label>
|
||||
<input type="text" id="id" name="id" required
|
||||
placeholder="请输入学号/工号" autocomplete="username">
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="password">
|
||||
<i class="fas fa-lock"></i> 密码
|
||||
</label>
|
||||
<input type="password" id="password" name="password" required
|
||||
placeholder="请输入密码" autocomplete="current-password">
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="role">
|
||||
<i class="fas fa-user-tag"></i> 角色
|
||||
</label>
|
||||
<select id="role" name="role" required>
|
||||
<option value="">请选择角色</option>
|
||||
<option value="student">学生</option>
|
||||
<option value="teacher">教师</option>
|
||||
<option value="admin">管理员</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<button type="submit" class="btn btn-primary btn-block">
|
||||
<i class="fas fa-sign-in-alt"></i> 登录
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="auth-footer">
|
||||
<p>没有账户？ <a href="/register">立即注册</a></p>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="/public/js/auth.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
86
frontend/views/auth/register.html
Normal file
86
frontend/views/auth/register.html
Normal file
@@ -0,0 +1,86 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>学生成绩管理系统 - 注册</title>
|
||||
<link rel="stylesheet" href="/public/css/style.css">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="auth-container">
|
||||
<div class="auth-header">
|
||||
<h1><i class="fas fa-graduation-cap"></i> 学生成绩管理系统</h1>
|
||||
<p>创建新账户</p>
|
||||
</div>
|
||||
|
||||
<div class="auth-card">
|
||||
<form id="registerForm">
|
||||
<div class="form-group">
|
||||
<label for="id">
|
||||
<i class="fas fa-id-card"></i> 学号/工号
|
||||
</label>
|
||||
<input type="text" id="id" name="id" required
|
||||
placeholder="请输入学号或工号" autocomplete="username">
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="name">
|
||||
<i class="fas fa-user"></i> 姓名
|
||||
</label>
|
||||
<input type="text" id="name" name="name" required
|
||||
placeholder="请输入姓名">
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="password">
|
||||
<i class="fas fa-lock"></i> 密码
|
||||
</label>
|
||||
<input type="password" id="password" name="password" required
|
||||
placeholder="请输入密码" autocomplete="new-password">
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="confirmPassword">
|
||||
<i class="fas fa-lock"></i> 确认密码
|
||||
</label>
|
||||
<input type="password" id="confirmPassword" name="confirmPassword" required
|
||||
placeholder="请再次输入密码" autocomplete="new-password">
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="role">
|
||||
<i class="fas fa-user-tag"></i> 角色
|
||||
</label>
|
||||
<select id="role" name="role" required>
|
||||
<option value="">请选择角色</option>
|
||||
<option value="student">学生</option>
|
||||
<option value="teacher">教师</option>
|
||||
<option value="admin">管理员</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="form-group" id="classField" style="display: none;">
|
||||
<label for="class">
|
||||
<i class="fas fa-users"></i> 班级
|
||||
</label>
|
||||
<input type="text" id="class" name="class"
|
||||
placeholder="请输入班级（学生/教师必填）">
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<button type="submit" class="btn btn-primary btn-block">
|
||||
<i class="fas fa-user-plus"></i> 注册
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="auth-footer">
|
||||
<p>已有账户？ <a href="/login">立即登录</a></p>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="/public/js/auth.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user