fix(admin): 后台列表切换保留当前内容,去掉加载占位

用户档案、用户列表、内容筛选与公告页等数据到达后再换视图,避免滚动条闪动。

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
2026-09-17 00:57:54 +08:00
parent a0a9aeed66
commit 442af625f6
7 changed files with 213 additions and 100 deletions

View File

@@ -10,7 +10,6 @@ import {
ExternalLink,
FolderSearch,
History,
Loader2,
Monitor,
ShieldAlert,
ShieldCheck,
@@ -151,6 +150,9 @@ export default function UsersAdmin({
setUsers(res.users);
setSummary(res.summary);
setTotal(res.total);
setFilter(opts.filter);
setPage(opts.page);
setAppliedQ(opts.q);
setError("");
} catch (e) {
if (seq !== seqRef.current) return;
@@ -166,8 +168,6 @@ export default function UsersAdmin({
debounceRef.current = setTimeout(() => {
const q = keyword.trim();
if (q !== appliedQ) {
setAppliedQ(q);
setPage(1);
load({ page: 1, filter, q });
}
}, 400);
@@ -195,8 +195,6 @@ export default function UsersAdmin({
const submitSearch = () => {
const q = keyword.trim();
if (q === appliedQ) return;
setAppliedQ(q);
setPage(1);
load({ page: 1, filter, q });
};
@@ -204,16 +202,12 @@ export default function UsersAdmin({
const clearSearch = () => {
setKeyword("");
if (appliedQ !== "" || page !== 1) {
setAppliedQ("");
setPage(1);
load({ page: 1, filter, q: "" });
}
};
const changeFilter = (f: UserFilter) => {
if (f === filter) return;
setFilter(f);
setPage(1);
load({ page: 1, filter: f, q: appliedQ });
};
@@ -221,7 +215,6 @@ export default function UsersAdmin({
const totalPages = Math.max(1, Math.ceil(total / PAGE_SIZE));
const next = Math.min(Math.max(1, p), totalPages);
if (next === page) return;
setPage(next);
load({ page: next, filter, q: appliedQ });
};
@@ -467,13 +460,9 @@ export default function UsersAdmin({
</div>
)}
<div aria-busy={loading} style={{ opacity: loading ? 0.55 : 1, transition: "opacity .15s" }}>
<div aria-busy={loading}>
{error ? (
<p className="alert-error m-4">{error}</p>
) : loading && users.length === 0 ? (
<div className="flex items-center justify-center gap-2 py-16 meta text-[13px]">
<Loader2 size={16} className="animate-spin" /> 加载中…
</div>
) : users.length === 0 ? (
<AdminEmpty
icon={<Users size={22} />}
@@ -713,17 +702,15 @@ function LoginLogsDialog({ target, onClose }: { target: AdminUser | null; onClos
}
>
<div className="-mx-1.5 px-1.5 overflow-y-auto flex-1 min-h-0" style={{ maxHeight: "min(52vh, 420px)" }}>
{loading ? (
<div className="flex items-center justify-center gap-2 py-12 meta text-[13px]">
<Loader2 size={16} className="animate-spin" /> 加载中…
</div>
) : err ? (
{err ? (
<p className="alert-error my-4">{err}</p>
) : logs.length === 0 ? (
<div className="text-center py-12">
<Monitor size={22} className="mx-auto mb-2" style={{ color: "var(--ink-3)" }} />
<p className="meta text-[12.5px]">暂无登录记录</p>
</div>
loading ? null : (
<div className="text-center py-12">
<Monitor size={22} className="mx-auto mb-2" style={{ color: "var(--ink-3)" }} />
<p className="meta text-[12.5px]">暂无登录记录</p>
</div>
)
) : (
<ul className="flex flex-col">
{logs.map((log) => (