67 lines
4.0 KiB
HTML
67 lines
4.0 KiB
HTML
<!doctype html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<meta name="description" content="Traffic Intelligence 用户登录与 Google Authenticator 验证">
|
|
<title>用户登录 · Traffic Intelligence</title>
|
|
<link rel="stylesheet" href="assets/styles.css">
|
|
</head>
|
|
<body class="login-page">
|
|
<header class="site-header">
|
|
<a class="brand" href="index.html"><span class="brand-mark" aria-hidden="true"><i></i><i></i><i></i></span><span><strong>Traffic Intelligence</strong><small>投放决策工作台</small></span></a>
|
|
<a class="home-link" href="index.html">返回首页</a>
|
|
</header>
|
|
|
|
<main class="login-main shell">
|
|
<section class="login-intro">
|
|
<p class="eyebrow"><span></span> IDENTITY CHECK</p>
|
|
<h1>登录后开始<br><em>转换链接。</em></h1>
|
|
<p>请选择自己的账号，并使用密码和 Google Authenticator 动态码完成验证。</p>
|
|
<div class="login-note"><b>!</b><span><strong>简易本机验证</strong>账号绑定、登录状态和链接记录仅保存在当前浏览器，不属于服务端安全认证。</span></div>
|
|
</section>
|
|
|
|
<section class="panel login-card">
|
|
<div class="panel-title"><span>ACCOUNT</span><h2 id="loginTitle">用户登录</h2><p id="loginSubtitle">选择你的账号</p></div>
|
|
<label class="field-label" for="loginUser">用户账号</label>
|
|
<select id="loginUser"></select>
|
|
<div class="selected-role" id="selectedRole"></div>
|
|
|
|
<form id="signinForm" class="auth-form hidden" novalidate>
|
|
<label class="field-label" for="signinPassword">登录密码</label>
|
|
<input id="signinPassword" type="password" autocomplete="current-password" placeholder="输入本机登录密码">
|
|
<label class="field-label" for="signinCode">Google Authenticator 验证码</label>
|
|
<input id="signinCode" class="otp-input" inputmode="numeric" autocomplete="one-time-code" maxlength="6" placeholder="000000">
|
|
<div class="auth-message" id="signinMessage" role="alert"></div>
|
|
<button class="primary-btn full-btn" type="submit"><span>登录</span><b>→</b></button>
|
|
<button class="text-btn danger-text" id="resetEnrollment" type="button">忘记密码？重置这个账号的本机绑定</button>
|
|
</form>
|
|
|
|
<form id="enrollForm" class="auth-form hidden" novalidate>
|
|
<div class="setup-steps">
|
|
<div><b>1</b><p><strong>打开 Google Authenticator</strong><span>点击“＋”并选择“输入设置密钥”</span></p></div>
|
|
<div><b>2</b><p><strong>填写账号和设置密钥</strong><span>类型选择“基于时间”</span></p></div>
|
|
</div>
|
|
<label class="field-label">Authenticator 设置密钥</label>
|
|
<div class="setup-key"><code id="setupKey">生成中…</code><button id="copySetupKey" type="button">复制</button></div>
|
|
<p class="field-help">账号名称：<strong id="authAccountName"></strong></p>
|
|
<label class="field-label" for="newPassword">设置本机登录密码</label>
|
|
<input id="newPassword" type="password" autocomplete="new-password" placeholder="至少 8 位">
|
|
<label class="field-label" for="confirmPassword">再次输入密码</label>
|
|
<input id="confirmPassword" type="password" autocomplete="new-password" placeholder="再次输入相同密码">
|
|
<label class="field-label" for="setupCode">输入 App 中显示的 6 位验证码</label>
|
|
<input id="setupCode" class="otp-input" inputmode="numeric" autocomplete="one-time-code" maxlength="6" placeholder="000000">
|
|
<div class="auth-message" id="enrollMessage" role="alert"></div>
|
|
<button class="primary-btn full-btn" type="submit"><span>完成绑定并登录</span><b>→</b></button>
|
|
</form>
|
|
</section>
|
|
</main>
|
|
|
|
<div class="toast" id="toast" role="status"></div>
|
|
<script src="assets/data/users.js"></script>
|
|
<script src="assets/auth.js"></script>
|
|
<script src="assets/common.js"></script>
|
|
<script src="assets/login.js"></script>
|
|
</body>
|
|
</html>
|