Files
sub2proxy/public/login.html
T
2026-06-13 16:57:43 +08:00

167 lines
3.8 KiB
HTML

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>登录 - CatMata Sub2Proxy</title>
<style>
:root {
--bg: #f5f7fb;
--panel: #ffffff;
--text: #111827;
--muted: #6b7280;
--line: #dbe3ef;
--primary: #2563eb;
--primary-dark: #1d4ed8;
--danger: #dc2626;
}
* {
box-sizing: border-box;
}
body {
margin: 0;
min-height: 100vh;
display: grid;
place-items: center;
background: var(--bg);
color: var(--text);
font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
main {
width: min(420px, calc(100vw - 32px));
background: var(--panel);
border: 1px solid var(--line);
border-radius: 8px;
padding: 28px;
box-shadow: 0 24px 70px rgba(15, 23, 42, 0.08);
}
h1 {
margin: 0;
font-size: 1.45rem;
font-weight: 700;
letter-spacing: 0;
}
p {
margin: 8px 0 22px;
color: var(--muted);
line-height: 1.6;
font-size: 0.95rem;
}
label {
display: block;
margin-bottom: 8px;
color: #374151;
font-size: 0.9rem;
font-weight: 600;
}
input {
width: 100%;
height: 44px;
border: 1px solid var(--line);
border-radius: 6px;
padding: 0 12px;
font: inherit;
outline: none;
}
input:focus {
border-color: var(--primary);
box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.14);
}
button {
width: 100%;
height: 44px;
margin-top: 16px;
border: 0;
border-radius: 6px;
background: var(--primary);
color: #fff;
font: inherit;
font-weight: 700;
cursor: pointer;
}
button:hover {
background: var(--primary-dark);
}
button:disabled {
cursor: wait;
opacity: 0.72;
}
.error {
min-height: 22px;
margin-top: 12px;
color: var(--danger);
font-size: 0.9rem;
}
.link {
display: block;
margin-top: 18px;
color: var(--muted);
text-align: center;
text-decoration: none;
font-size: 0.9rem;
}
.link:hover {
color: var(--primary);
}
</style>
</head>
<body>
<main>
<h1>CatMata Sub2Proxy</h1>
<p>输入管理员密码进入完整控制面板。</p>
<form id="login-form">
<label for="password">管理员密码</label>
<input id="password" name="password" type="password" autocomplete="current-password" required autofocus>
<button id="submit-btn" type="submit">登录</button>
<div class="error" id="error"></div>
</form>
<a class="link" href="/sub">进入用户配置页</a>
</main>
<script>
const form = document.getElementById('login-form');
const input = document.getElementById('password');
const button = document.getElementById('submit-btn');
const error = document.getElementById('error');
form.addEventListener('submit', async event => {
event.preventDefault();
error.textContent = '';
button.disabled = true;
button.textContent = '正在登录...';
try {
const res = await fetch('/api/login', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ role: 'admin', password: input.value })
});
const data = await res.json().catch(() => ({}));
if (!res.ok) {
throw new Error(data.error || '登录失败');
}
window.location.href = data.redirectTo || '/config';
} catch (e) {
error.textContent = e.message;
button.disabled = false;
button.textContent = '登录';
}
});
</script>
</body>
</html>