blob: da5d54ceefa2fa4d9897f72bd52baa2602e884b5 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
|
<script lang="ts">
import type { Route } from '../lib/router';
import { Button } from '$lib/components/ui/button';
import { Input } from '$lib/components/ui/input';
import { Label } from '$lib/components/ui/label';
import { Alert } from '$lib/components/ui/alert';
import * as Card from '$lib/components/ui/card';
import { Separator } from '$lib/components/ui/separator';
import { session } from '../lib/session.svelte';
import { go } from '../lib/router';
import { postLogin, postRegister, postResetPassword } from '../lib/client';
import { extractStatusMessage, statusByName } from '../lib/state';
interface Props {
route: Route;
}
let { route }: Props = $props();
const mode = $derived(route.name);
let email = $state('');
let password = $state('');
let name = $state('');
// Initial route query is deliberately read once: token is consumed at page load.
// svelte-ignore state_referenced_locally
let inviteToken = $state(route.query.get('invite') ?? '');
// svelte-ignore state_referenced_locally
let resetToken = $state(route.query.get('token') ?? '');
let busy = $state(false);
let resultError = $state<string | null>(null);
let done = $state<string | null>(null);
let pw2 = $state('');
let newPassword = $state('');
async function login(e: SubmitEvent) {
e.preventDefault();
busy = true;
resultError = null;
try {
await postLogin(email.trim(), password);
const user = await session.refresh();
if (user) session.set(user);
go('/projects');
} catch (err) {
if (statusByName(err) === 'unauthorized') resultError = '邮箱或密码不正确，或账户已被停用';
else resultError = extractStatusMessage(err);
} finally {
busy = false;
}
}
async function register(e: SubmitEvent) {
e.preventDefault();
busy = true;
resultError = null;
try {
const { user } = await postRegister(inviteToken.trim(), name.trim(), email.trim(), password);
session.set(user);
go('/projects');
} catch (err) {
resultError = extractStatusMessage(err);
} finally {
busy = false;
}
}
async function reset(e: SubmitEvent) {
e.preventDefault();
busy = true;
resultError = null;
try {
if (!resetToken.trim()) {
resultError = '链接中的重置令牌未提供。请使用管理员发给您的完整恢复链接打开本页。';
return;
}
if (newPassword.length < 8) {
resultError = '新密码长度需至少 8 位';
return;
}
if (newPassword !== pw2) {
resultError = '两次输入的新密码不一致';
return;
}
await postResetPassword(resetToken.trim(), newPassword);
done = '密码已重置，现在可以用新密码登录。';
} catch (err) {
resultError = extractStatusMessage(err);
} finally {
busy = false;
}
}
</script>
<section class="min-h-screen flex items-center justify-center p-6 min-w-0">
<Card.Root class="w-[min(400px,100%)] p-8 max-[768px]:p-7" role="main">
<div class="mb-4">
<span class="inline-block w-8 h-8 rounded-lg bg-primary mb-2" aria-hidden="true"></span>
<h1 class="text-xl font-semibold mb-1">策研 <span class="text-muted-foreground/70 font-medium text-[0.8rem]">Strategy Lab</span></h1>
<p class="text-sm text-muted-foreground max-w-[26em]">内部策略研究平台 · 仅限受邀成员</p>
</div>
{#if mode === 'register'}
<form onsubmit={register}>
<div class="flex flex-col gap-4">
<div>
<Label for="inv">邀请令牌</Label>
<Input id="inv" bind:value={inviteToken} required autocomplete="off" />
<p class="text-sm text-muted-foreground mt-1">单次有效，来自管理员邀请</p>
</div>
<div>
<Label for="nm">姓名</Label>
<Input id="nm" bind:value={name} required autocomplete="name" />
</div>
<div>
<Label for="em">邮箱</Label>
<Input id="em" type="email" bind:value={email} required autocomplete="email" />
</div>
<div>
<Label for="pw">密码</Label>
<Input id="pw" type="password" bind:value={password} required autocomplete="new-password" minlength={8} />
<p class="text-sm text-muted-foreground mt-1">至少 8 位</p>
</div>
{#if resultError}<Alert variant="destructive">{resultError}</Alert>{/if}
<Button type="submit" disabled={busy}>{busy ? '创建中…' : '开通账户'}</Button>
<p class="text-sm text-muted-foreground">已有账户？ <a class="hover:underline" href="#/login">登录</a></p>
</div>
</form>
{:else if mode === 'reset'}
{#if done}
<Alert>{done}</Alert>
<p class="mt-2"><a class="hover:underline" href="#/login">前往登录</a></p>
{:else}
<form onsubmit={reset}>
<div class="flex flex-col gap-4">
<div>
<Label for="rt">重置令牌</Label>
<Input id="rt" bind:value={resetToken} autocomplete="off" />
<p class="text-sm text-muted-foreground mt-1">由管理员线下发放的恢复链接自动填入；不支持邮箱自动发送</p>
</div>
<div>
<Label for="np">新密码</Label>
<Input id="np" type="password" bind:value={newPassword} required autocomplete="new-password" minlength={8} />
</div>
<div>
<Label for="np2">再输入一次新密码</Label>
<Input id="np2" type="password" bind:value={pw2} required autocomplete="new-password" minlength={8} />
</div>
{#if resultError}<Alert variant="destructive">{resultError}</Alert>{/if}
<Button type="submit" disabled={busy}>{busy ? '重置中…' : '重置密码'}</Button>
<p class="text-sm text-muted-foreground">想起密码了？ <a class="hover:underline" href="#/login">直接登录</a></p>
</div>
</form>
{/if}
{:else}
<form onsubmit={login}>
<div class="flex flex-col gap-4">
<div>
<Label for="le">邮箱</Label>
<Input id="le" type="email" bind:value={email} required autocomplete="email" />
</div>
<div>
<Label for="lp">密码</Label>
<Input id="lp" type="password" bind:value={password} required autocomplete="current-password" />
</div>
{#if resultError}<Alert variant="destructive">{resultError}</Alert>{/if}
<Button type="submit" disabled={busy}>{busy ? '登录中…' : '登录'}</Button>
<p class="text-sm text-muted-foreground">
开通新账户需要管理员邀请： <a class="hover:underline" href="#/register">用邀请令牌注册</a>
{#if route.query.get('invite')}<span>（邀请令牌已自动填入）</span>{/if}
</p>
<p class="text-sm text-muted-foreground">忘记密码？请联系管理员获取 <a class="hover:underline" href="#/reset">恢复链接</a></p>
</div>
</form>
{/if}
</Card.Root>
</section>
|
