92 lines
3.9 KiB
HTML
92 lines
3.9 KiB
HTML
<!doctype html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width,initial-scale=1">
|
|
<title>学生自助分组</title>
|
|
<link rel="stylesheet" href="/style.css">
|
|
</head>
|
|
<body>
|
|
<header class="topbar">
|
|
<div class="brand"><i class="brand-mark">组</i><span>学生自助分组系统</span></div>
|
|
<div class="toolbar hidden" id="userToolbar">
|
|
<span class="chip" id="userChip"></span>
|
|
<button class="ghost" id="logoutButton" type="button">退出</button>
|
|
</div>
|
|
</header>
|
|
|
|
<main class="page">
|
|
<div id="loginArea" class="login-wrap">
|
|
<form class="login-card" id="loginForm">
|
|
<h1 class="title">学生登录</h1>
|
|
<p class="subtitle">账号是你的学号，首次登录密码也是学号。登录后必须修改密码。</p>
|
|
<label for="username">学号</label>
|
|
<input id="username" name="username" inputmode="numeric" autocomplete="username" required>
|
|
<label for="password">密码</label>
|
|
<input id="password" name="password" type="password" autocomplete="current-password" required>
|
|
<button class="full" data-working type="submit">登录</button>
|
|
<div class="notice" id="loginNotice"></div>
|
|
<p class="hint">老师会发布学生端网址。只有当前开放班级的学生可以登录。</p>
|
|
</form>
|
|
</div>
|
|
|
|
<div id="mainArea" class="hidden">
|
|
<div class="statistics" id="statistics"></div>
|
|
|
|
<div class="two-col">
|
|
<div>
|
|
<section class="panel">
|
|
<div class="section-head"><h2>我的信息</h2><span class="chip" id="loginState">已登录</span></div>
|
|
<div class="identity" id="identity"></div>
|
|
<div id="myGroupAction"></div>
|
|
</section>
|
|
|
|
<section class="panel">
|
|
<div class="section-head"><h2>修改密码</h2></div>
|
|
<form id="passwordForm">
|
|
<label for="oldPassword">原密码</label>
|
|
<input id="oldPassword" type="password" autocomplete="current-password" required>
|
|
<label for="newPassword">新密码</label>
|
|
<input id="newPassword" type="password" minlength="8" autocomplete="new-password" required>
|
|
<label for="confirmPassword">确认新密码</label>
|
|
<input id="confirmPassword" type="password" minlength="8" autocomplete="new-password" required>
|
|
<button class="full" data-working type="submit">保存新密码</button>
|
|
<p class="hint">新密码至少 8 位，不能与学号或原密码相同。</p>
|
|
</form>
|
|
</section>
|
|
</div>
|
|
|
|
<section class="panel">
|
|
<div class="section-head">
|
|
<h2>全部小组</h2>
|
|
<div class="status-row" id="classStatus"></div>
|
|
</div>
|
|
<div class="grid" id="groupsGrid"></div>
|
|
</section>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
|
|
<div class="modal-mask hidden" id="passwordModal">
|
|
<form class="modal" id="firstPasswordForm">
|
|
<h2 class="title">首次登录请修改密码</h2>
|
|
<p class="subtitle">为了防止他人用学号冒充你登录，必须先设置新的登录密码。</p>
|
|
<label for="firstOld">原密码（首次登录是你的学号）</label>
|
|
<input id="firstOld" type="password" required>
|
|
<label for="firstNew">新密码（至少 8 位）</label>
|
|
<input id="firstNew" type="password" minlength="8" required>
|
|
<label for="firstConfirm">确认新密码</label>
|
|
<input id="firstConfirm" type="password" minlength="8" required>
|
|
<div class="modal-actions">
|
|
<button class="success" data-working type="submit">确认修改</button>
|
|
<button class="ghost" type="button" id="logoutFromModal">退出登录</button>
|
|
</div>
|
|
<div class="notice" id="firstPasswordNotice"></div>
|
|
</form>
|
|
</div>
|
|
|
|
<script src="/shared.js"></script>
|
|
<script src="/student.js"></script>
|
|
</body>
|
|
</html>
|