refactor(frontend): 重构前端目录结构并优化认证流程
将前端文件从html目录迁移到views目录，按功能模块组织 重构认证中间件和路由处理，简化页面权限控制 更新静态资源引用路径，统一使用/public前缀 添加学生仪表板页面，优化移动端显示 移除旧版html和js文件，更新样式和脚本
This commit is contained in:
祀梦
@@ -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>
|
||||
<!-- 撖潸⏛�?-->
|
||||
<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>
|
||||
|
||||
<!-- 銝颱���捆�?-->
|
||||
<main>
|
||||
<!-- �梢��箏� -->
|
||||
<section class="hero-section">
|
||||
<div class="hero-content">
|
||||
<h1 class="hero-title">XX摮行嵗摮衣��鞟貍蝞∠�蝟餌�</h1>
|
||||
<p class="hero-subtitle">
|
||||
擃䀹�����具��惣�賜��鞟貍蝞∠�撟喳蝱嚗䔶蛹摮行嵗撣���𣂷��冽䲮雿滨��鞟貍蝞∠��滚𦛚嚗? 摰䂿緵�鞟貍敶訫���䰻霂Ｕ���霈∪�������雿枏�閫���寞��? </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">
|
||||
摮衣��舫��嗆䰻�衤葵鈭箸�蝏抬���𡠺����鞟貍��像�������滨�靽⊥�嚗? �舀��鞟貍頞见飵�������脰扇敶閙䰻�卝�? </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">
|
||||
�坔��臭噶�瑕��乓��耨�嫘��䰻霂Ｗ郎���蝏抬��舀��寥��滢��峕�蝏拍�霈∪��琜�
|
||||
�𣂷�憭𡁶��唳旿撖澆枂�澆��? </p>
|
||||
</div>
|
||||
|
||||
<div class="feature-card">
|
||||
<div class="feature-icon">
|
||||
<i class="fas fa-user-shield"></i>
|
||||
</div>
|
||||
<h3 class="feature-title">蝞∠��䀹��鞉綉�?/h3>
|
||||
<p class="feature-description">
|
||||
蝞∠��睃虾蝞∠��冽�韐行���郎�煺縑�荔��亦�蝟餌�蝏蠘恣�亥”嚗? 霈曄蔭����𣬚頂蝏笔��堆�蝖桐��唳旿摰匧��? </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">
|
||||
�𣂷�銝啣���㦛銵函�霈∪��踝���𡠺�鞟貍�������踹��僐��笆瘥𥪜㦛銵函�嚗? 撣桀𨭌摮行嵗餈𥡝��坔郎霂�摯���蝑𡝗𣈲���? </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摮行嵗�鞟貍蝞∠�蝟餌�嚗䔶�撉屸�����噶�瑞��鞟貍蝞∠��滚𦛚�? </p>
|
||||
<div class="cta-buttons">
|
||||
<a href="/login" class="btn btn-primary">
|
||||
<i class="fas fa-sign-in-alt"></i> 撘�憪衤蝙�? </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;">
|
||||
�游�鈭𦒘蛹摮行嵗�𣂷�銝㮖�����具�������啣��𡝗�蝏拍恣��圾�單䲮獢��? </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摮行嵗摮衣��鞟貍蝞∠�蝟餌� ������?/p>
|
||||
<p>�𠉛頂�菔�嚗?10-12345678 | �桃拳嚗䬙ontact@school.edu.cn</p>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<script src="/public/js/main.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -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>
|
||||
@@ -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