feat(admin): 登录改页内弹窗 + P1 站点设置（页头/侧栏）

- 登录：LoginDialog（Modal）替代 /login 页面；/login 重定向回首页
- 设置接口：GET /api/settings 公开读、PATCH 需登录 + version 乐观锁（409/400）
- setting 表存 site JSON：页头（启用/速度/条目+标签+色调）、侧栏（hidden/order）
- /admin：Tabs 页头/侧栏，条目增删与上下移，保存后首页生效
- 首页应用设置：ticker 文本占位符与速度、侧栏顺序与显隐
- 测试 42 passed（settings 5 例）

stash-web/src/components/auth/LoginDialog.tsx

@@ -0,0 +1,119 @@
+import { Button, FormField, Icon, Input, Modal, Notice, Space, Text } from '@stash/ui'
+import { useEffect, useState } from 'react'
+import { login, setup, type SessionState } from '../../auth'
+
+/**
+ * 登录弹窗：首次使用显示「设置密码 + 确认」，之后只显示密码。
+ *
+ * 成功后由父组件刷新会话状态；弹窗本身不跳转页面。
+ */
+type LoginDialogProps = {
+  open: boolean
+  hasAdmin: boolean
+  onClose: () => void
+  onSuccess: (session: SessionState) => void
+}
+
+export function LoginDialog({ open, hasAdmin, onClose, onSuccess }: LoginDialogProps) {
+  const [password, setPassword] = useState('')
+  const [confirm, setConfirm] = useState('')
+  const [error, setError] = useState('')
+  const [busy, setBusy] = useState(false)
+
+  // 每次打开重置，避免上次的错误/输入残留
+  useEffect(() => {
+    if (!open) return
+    setPassword('')
+    setConfirm('')
+    setError('')
+    setBusy(false)
+  }, [open])
+
+  const isSetup = !hasAdmin
+
+  const submit = async () => {
+    setError('')
+    if (isSetup && password !== confirm) {
+      setError('两次输入的密码不一致')
+      return
+    }
+
+    setBusy(true)
+    const result = isSetup ? await setup(password) : await login(password)
+    setBusy(false)
+
+    if (!result.ok) {
+      setError(result.error)
+      return
+    }
+
+    onSuccess({
+      authenticated: true,
+      has_admin: true,
+      username: 'admin',
+    })
+  }
+
+  return (
+    <Modal
+      open={open}
+      onClose={onClose}
+      title={isSetup ? '设置管理员密码' : '登录'}
+      footer={
+        <Space gap="sm" justify="end">
+          <Button variant="secondary" onClick={onClose}>
+            取消
+          </Button>
+          <Button loading={busy} icon={<Icon name="lock_line" />} onClick={submit}>
+            {isSetup ? '设置并登录' : '登录'}
+          </Button>
+        </Space>
+      }
+    >
+      <Space direction="column" gap="md" align="stretch">
+        <Text size="sm" tone="muted">
+          {isSetup
+            ? '首次使用：设置一个至少 8 位的密码，之后用它登录编辑。'
+            : '登录后可以编辑页头滚动信息、侧栏顺序与显示。'}
+        </Text>
+
+        {error !== '' && (
+          <Notice tone="error" title="操作失败">
+            {error}
+          </Notice>
+        )}
+
+        <FormField label="密码" htmlFor="login-password" required>
+          <Input
+            id="login-password"
+            type="password"
+            icon="lock_line"
+            placeholder="输入密码"
+            value={password}
+            autoFocus
+            onChange={(event) => setPassword(event.target.value)}
+            onKeyDown={(event) => {
+              if (event.key === 'Enter') void submit()
+            }}
+          />
+        </FormField>
+
+        {isSetup && (
+          <FormField label="确认密码" htmlFor="login-confirm" required>
+            <Input
+              id="login-confirm"
+              type="password"
+              icon="keyhole_line"
+              placeholder="再输入一次"
+              value={confirm}
+              onChange={(event) => setConfirm(event.target.value)}
+              onKeyDown={(event) => {
+                if (event.key === 'Enter') void submit()
+              }}
+            />
+          </FormField>
+        )}
+      </Space>
+    </Modal>
+  )
+}

stash-web/src/components/auth/LoginPage.tsx

@@ -1,126 +0,0 @@
-import { Button, Card, FormField, Icon, Input, Notice, Space, Text, Title } from '@stash/ui'
-import { useEffect, useState } from 'react'
-import { fetchSession, login, setup, type SessionState } from '../../auth'
-
-/**
- * 登录页：首次打开是「设置密码」，之后是「登录」。
- *
- * 成功后整页跳回首页（而不是 SPA 内跳转），让服务端重新下发 Cookie 后的首帧
- * 也带上登录态，避免首屏闪一下未登录 UI。
- */
-export function LoginPage() {
-  const [session, setSession] = useState<SessionState | null>(null)
-  const [password, setPassword] = useState('')
-  const [confirm, setConfirm] = useState('')
-  const [error, setError] = useState('')
-  const [busy, setBusy] = useState(false)
-
-  useEffect(() => {
-    let alive = true
-    fetchSession().then((next) => {
-      if (!alive) return
-      if (next.authenticated) {
-        window.location.assign('/')
-        return
-      }
-      setSession(next)
-    })
-    return () => {
-      alive = false
-    }
-  }, [])
-
-  const isSetup = session !== null && !session.has_admin
-
-  const submit = async () => {
-    setError('')
-
-    if (isSetup && password !== confirm) {
-      setError('两次输入的密码不一致')
-      return
-    }
-
-    setBusy(true)
-    const result = isSetup ? await setup(password) : await login(password)
-    setBusy(false)
-
-    if (result.ok) {
-      window.location.assign('/')
-      return
-    }
-
-    setError(result.error)
-  }
-
-  return (
-    <div className="login-page">
-      <Card padding="lg" className="login-card">
-        <Space gap="sm" className="login-brand">
-          <span className="site-brand-mark" aria-hidden="true">
-            S
-          </span>
-          <span className="site-brand-name">STASH</span>
-        </Space>
-
-        <Title level={2}>{isSetup ? '设置管理员密码' : '登录'}</Title>
-        <Text size="sm" tone="muted">
-          {isSetup
-            ? '首次使用：设置一个至少 8 位的密码，之后用它在任意设备上登录。'
-            : '登录后可以编辑侧栏、页头滚动信息与内容。'}
-        </Text>
-
-        {error !== '' && (
-          <Notice tone="error" title="操作失败">
-            {error}
-          </Notice>
-        )}
-
-        <FormField
-          label="密码"
-          htmlFor="password"
-          required
-          hint={isSetup ? '至少 8 位，建议混合字母与数字' : undefined}
-        >
-          <Input
-            id="password"
-            type="password"
-            size="lg"
-            icon="lock_line"
-            placeholder="输入密码"
-            value={password}
-            autoFocus
-            onChange={(event) => setPassword(event.target.value)}
-            onKeyDown={(event) => {
-              if (event.key === 'Enter') void submit()
-            }}
-          />
-        </FormField>
-
-        {isSetup && (
-          <FormField label="确认密码" htmlFor="confirm" required>
-            <Input
-              id="confirm"
-              type="password"
-              size="lg"
-              icon="keyhole_line"
-              placeholder="再输入一次"
-              value={confirm}
-              onChange={(event) => setConfirm(event.target.value)}
-              onKeyDown={(event) => {
-                if (event.key === 'Enter') void submit()
-              }}
-            />
-          </FormField>
-        )}
-
-        <Button size="lg" block loading={busy} icon={<Icon name="lock_line" />} onClick={submit}>
-          {isSetup ? '设置并登录' : '登录'}
-        </Button>
-
-        <a className="login-back" href="/">
-          返回首页
-        </a>
-      </Card>
-    </div>
-  )
-}