shangfangjian
786f10aa11
- crypto.py: API Key 加密/解密工具 - runtime_config.py: 运行时动态配置管理 - log_buffer.py: 内存日志缓冲区 - config.py: 新增加密配置项 - http_client.py: 增强重试和错误处理
97 lines
3.2 KiB
TypeScript
97 lines
3.2 KiB
TypeScript
/**
|
|
* Admin 后台 - 登录页(报刊风)
|
|
*
|
|
* 密码验证通过后由服务端写入 HttpOnly 会话 Cookie。
|
|
*/
|
|
|
|
import { useState } from 'react'
|
|
import { ApiError, login } from './api'
|
|
|
|
export default function Login({ onSuccess }: { onSuccess: () => void }) {
|
|
const [password, setPassword] = useState('')
|
|
const [submitting, setSubmitting] = useState(false)
|
|
const [error, setError] = useState('')
|
|
|
|
async function handleSubmit(e: React.FormEvent) {
|
|
e.preventDefault()
|
|
if (!password || submitting) return
|
|
setSubmitting(true)
|
|
setError('')
|
|
try {
|
|
await login(password)
|
|
onSuccess()
|
|
} catch (err) {
|
|
setError(
|
|
err instanceof ApiError
|
|
? err.message.split('\n')[0]
|
|
: '登录失败,请检查网络连接',
|
|
)
|
|
} finally {
|
|
setSubmitting(false)
|
|
}
|
|
}
|
|
|
|
return (
|
|
<div className="flex min-h-screen flex-col bg-paper-50 text-ink-800">
|
|
<header className="masthead-rule">
|
|
<div className="mx-auto w-full max-w-md px-5 pt-12 sm:pt-16">
|
|
<div className="border-b border-ink-900 py-5 text-center">
|
|
<h1 className="font-serif text-3xl font-bold tracking-widest text-ink-900">
|
|
先知
|
|
<span className="ml-3 align-baseline font-serif text-sm font-normal italic tracking-normal text-ink-500">
|
|
Profeto
|
|
</span>
|
|
</h1>
|
|
<p className="mt-2 text-2xs tracking-[0.4em] text-ink-500">管理后台 · 管理员登录</p>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
<main className="flex flex-1 items-start justify-center px-5 py-10">
|
|
<form
|
|
onSubmit={handleSubmit}
|
|
className="w-full max-w-sm border border-ink-300 bg-white p-6 shadow-[4px_4px_0_0_rgba(0,0,0,0.06)]"
|
|
>
|
|
<label htmlFor="admin-password" className="block text-xs font-medium tracking-wide text-ink-700">
|
|
管理密码
|
|
</label>
|
|
<input
|
|
id="admin-password"
|
|
type="password"
|
|
value={password}
|
|
onChange={e => setPassword(e.target.value)}
|
|
placeholder="输入服务器 .env 中的 ADMIN_PASSWORD"
|
|
autoFocus
|
|
autoComplete="current-password"
|
|
className="field mt-2 w-full"
|
|
/>
|
|
|
|
{error && (
|
|
<p className="mt-3 border-l-2 border-press bg-press-wash/40 px-3 py-2 text-2xs leading-relaxed text-press-dark">
|
|
{error}
|
|
</p>
|
|
)}
|
|
|
|
<button
|
|
type="submit"
|
|
disabled={!password || submitting}
|
|
className="btn btn-solid mt-5 w-full justify-center"
|
|
>
|
|
{submitting ? '验证中…' : '登 录'}
|
|
</button>
|
|
|
|
<p className="mt-4 border-t border-ink-200 pt-3 text-center text-2xs leading-relaxed text-ink-400">
|
|
密码初始来自服务器 .env,可登录后在「系统配置」页修改;连续输错 5 次将锁定 10 分钟。
|
|
</p>
|
|
</form>
|
|
</main>
|
|
|
|
<footer className="pb-8 text-center text-2xs text-ink-400">
|
|
<a href="/" className="transition-colors hover:text-press">
|
|
← 返回前台版面
|
|
</a>
|
|
</footer>
|
|
</div>
|
|
)
|
|
}
|