freefire
a83276060f
首页右栏接入单页入口与公告置顶/全部页；Markdown 编辑器支持可视化时间线与 Git 导入；隐藏块改为 [hide]/[timeline] 命名闭合，并修复单页/公告 GORM 更新只改 updated_at 的问题。 Co-authored-by: Cursor <cursoragent@cursor.com>
900 lines
31 KiB
TypeScript
900 lines
31 KiB
TypeScript
"use client";
|
||
|
||
import {
|
||
Globe,
|
||
Loader2,
|
||
MessageSquare,
|
||
Save,
|
||
UserPlus,
|
||
MessagesSquare,
|
||
ExternalLink,
|
||
Shield,
|
||
Mail,
|
||
HardDrive,
|
||
Ban,
|
||
Wrench,
|
||
Palette,
|
||
FileText,
|
||
Paperclip,
|
||
Image as ImageIcon,
|
||
GitBranch,
|
||
RotateCcw,
|
||
CheckCircle2,
|
||
} from "lucide-react";
|
||
import { useEffect, useMemo, useRef, useState, type ReactNode } from "react";
|
||
import {
|
||
AdminExtChipEditor,
|
||
AdminField,
|
||
AdminPageHeader,
|
||
AdminSection,
|
||
AdminStepper,
|
||
AdminSwitch,
|
||
} from "@/components/admin";
|
||
import { apiGetAdminSettings, apiUpdateSiteSettings, type PublicSettings } from "@/lib/api";
|
||
import { toast } from "@/lib/toast";
|
||
import ConfirmDialog from "@/components/ConfirmDialog";
|
||
|
||
function extsEqual(a: string[], b: string[]) {
|
||
if (a.length !== b.length) return false;
|
||
return a.every((v, i) => v === b[i]);
|
||
}
|
||
|
||
/** 与后端 DefaultTimelineGitAdapterJSON 对齐的内置默认适配器 */
|
||
const DEFAULT_TIMELINE_GIT_IMPORT = `{
|
||
"max_pages": 10,
|
||
"max_commits": 100,
|
||
"sources": [
|
||
{
|
||
"id": "github",
|
||
"host": "github.com",
|
||
"list_path": "^/(?P<owner>[^/]+)/(?P<repo>[^/]+)/commits/(?P<ref>[^/]+)/?$",
|
||
"commit_path": "^/(?P<owner>[^/]+)/(?P<repo>[^/]+)/commit/(?P<sha>[0-9a-fA-F]{7,64})/?$",
|
||
"api_url": "https://api.github.com/repos/{owner}/{repo}/commits",
|
||
"commit_api": "https://api.github.com/repos/{owner}/{repo}/commits/{sha}",
|
||
"query": { "sha": "{ref}", "per_page": "100", "page": "{page}" },
|
||
"headers": { "User-Agent": "jiang13-bbs", "Accept": "application/vnd.github+json" },
|
||
"pagination": "link_header",
|
||
"item": {
|
||
"sha": "sha",
|
||
"date": "commit.committer.date",
|
||
"message": "commit.message",
|
||
"source_url": "html_url"
|
||
}
|
||
},
|
||
{
|
||
"id": "gitea",
|
||
"host": "*",
|
||
"list_path": "^/(?P<owner>[^/]+)/(?P<repo>[^/]+)/commits/branch/(?P<ref>.+)/?$",
|
||
"commit_path": "^/(?P<owner>[^/]+)/(?P<repo>[^/]+)/commit/(?P<sha>[0-9a-fA-F]{7,64})/?$",
|
||
"api_url": "https://{host}/api/v1/repos/{owner}/{repo}/commits",
|
||
"commit_api": "https://{host}/api/v1/repos/{owner}/{repo}/git/commits/{sha}",
|
||
"query": { "sha": "{ref}", "limit": "50", "page": "{page}" },
|
||
"headers": { "User-Agent": "jiang13-bbs", "Accept": "application/json" },
|
||
"pagination": "query_page",
|
||
"item": {
|
||
"sha": "sha",
|
||
"date": "created",
|
||
"message": "commit.message",
|
||
"source_url": "html_url"
|
||
}
|
||
}
|
||
]
|
||
}`;
|
||
|
||
type SectionId =
|
||
| "basic"
|
||
| "content"
|
||
| "gitimport"
|
||
| "brand"
|
||
| "footer"
|
||
| "security"
|
||
| "mail"
|
||
| "storage"
|
||
| "words"
|
||
| "maintenance";
|
||
|
||
const NAV: { id: SectionId; label: string; ready?: boolean }[] = [
|
||
{ id: "basic", label: "基本信息", ready: true },
|
||
{ id: "content", label: "内容与互动", ready: true },
|
||
{ id: "gitimport", label: "提交导入", ready: true },
|
||
{ id: "brand", label: "品牌与 SEO" },
|
||
{ id: "footer", label: "页脚与合规" },
|
||
{ id: "security", label: "安全与限流" },
|
||
{ id: "mail", label: "邮件" },
|
||
{ id: "storage", label: "对象存储" },
|
||
{ id: "words", label: "敏感词" },
|
||
{ id: "maintenance", label: "系统维护" },
|
||
];
|
||
|
||
function SwitchRow({
|
||
title,
|
||
description,
|
||
control,
|
||
bordered,
|
||
}: {
|
||
title: ReactNode;
|
||
description: string;
|
||
control: ReactNode;
|
||
bordered?: boolean;
|
||
}) {
|
||
return (
|
||
<div
|
||
className="flex items-start justify-between gap-4 flex-wrap py-4 first:pt-0 last:pb-0"
|
||
style={bordered ? { borderBottom: "1px solid var(--line)" } : undefined}
|
||
>
|
||
<div className="min-w-0 flex-1">
|
||
<p className="text-[14.5px] font-medium flex items-center gap-1.5" style={{ color: "var(--ink)" }}>
|
||
{title}
|
||
</p>
|
||
<p className="meta text-[12.5px] mt-1 leading-relaxed">{description}</p>
|
||
</div>
|
||
<div className="shrink-0">{control}</div>
|
||
</div>
|
||
);
|
||
}
|
||
|
||
function ComingSoonCard({
|
||
title,
|
||
description,
|
||
icon,
|
||
}: {
|
||
title: string;
|
||
description: string;
|
||
icon: ReactNode;
|
||
}) {
|
||
return (
|
||
<AdminSection title={title} description={description}>
|
||
<div
|
||
className="rounded-[var(--r-sm)] px-4 py-10 text-center"
|
||
style={{ background: "var(--panel-2)", color: "var(--ink-3)" }}
|
||
>
|
||
<span className="inline-flex mb-2 opacity-80" aria-hidden>
|
||
{icon}
|
||
</span>
|
||
<p className="text-[14px]" style={{ color: "var(--ink-2)" }}>
|
||
即将推出
|
||
</p>
|
||
<p className="meta text-[12.5px] mt-1">此分区尚未开放配置</p>
|
||
</div>
|
||
</AdminSection>
|
||
);
|
||
}
|
||
|
||
export default function SettingsAdmin({ initial }: { initial: PublicSettings }) {
|
||
const [siteName, setSiteName] = useState(initial.site_name);
|
||
const [siteDescription, setSiteDescription] = useState(initial.site_description);
|
||
const [allowRegister, setAllowRegister] = useState(initial.allow_register);
|
||
const [allowComments, setAllowComments] = useState(initial.allow_comments !== false);
|
||
const [allowMessages, setAllowMessages] = useState(initial.allow_messages !== false);
|
||
const [postLinkNewTab, setPostLinkNewTab] = useState(initial.post_link_new_tab !== false);
|
||
const [savedName, setSavedName] = useState(initial.site_name);
|
||
const [savedDesc, setSavedDesc] = useState(initial.site_description);
|
||
const [saving, setSaving] = useState(false);
|
||
const [togglingReg, setTogglingReg] = useState(false);
|
||
const [togglingComments, setTogglingComments] = useState(false);
|
||
const [togglingMessages, setTogglingMessages] = useState(false);
|
||
const [togglingLink, setTogglingLink] = useState(false);
|
||
const [active, setActive] = useState<SectionId>("basic");
|
||
|
||
const [extLimit, setExtLimit] = useState(initial.attachment_ext_limit !== false);
|
||
const [exts, setExts] = useState<string[]>(() => [...(initial.attachment_exts || [])]);
|
||
const [savedExts, setSavedExts] = useState<string[]>(() => [...(initial.attachment_exts || [])]);
|
||
const [attMaxMB, setAttMaxMB] = useState(initial.attachment_max_mb || 20);
|
||
const [attMaxCount, setAttMaxCount] = useState(initial.attachment_max_count || 10);
|
||
const [imageMaxMB, setImageMaxMB] = useState(initial.image_max_mb || 5);
|
||
const [togglingExtLimit, setTogglingExtLimit] = useState(false);
|
||
const [savingLimits, setSavingLimits] = useState(false);
|
||
const [savingExts, setSavingExts] = useState(false);
|
||
|
||
const [gitImportJSON, setGitImportJSON] = useState("");
|
||
const [savedGitImport, setSavedGitImport] = useState("");
|
||
const [gitImportLoading, setGitImportLoading] = useState(false);
|
||
const [gitImportLoaded, setGitImportLoaded] = useState(false);
|
||
const [savingGitImport, setSavingGitImport] = useState(false);
|
||
const [restoreGitOpen, setRestoreGitOpen] = useState(false);
|
||
const [gitValidateMsg, setGitValidateMsg] = useState<{ ok: boolean; text: string } | null>(null);
|
||
|
||
const dirty = siteName.trim() !== savedName || siteDescription.trim() !== savedDesc;
|
||
const extsDirty = useMemo(() => !extsEqual(exts, savedExts), [exts, savedExts]);
|
||
const gitImportDirty = gitImportJSON !== savedGitImport;
|
||
|
||
const loadGitImport = async () => {
|
||
if (gitImportLoading) return;
|
||
setGitImportLoading(true);
|
||
try {
|
||
const res = await apiGetAdminSettings();
|
||
const raw = res.timeline_git_import?.trim() || DEFAULT_TIMELINE_GIT_IMPORT;
|
||
let pretty = raw;
|
||
try {
|
||
pretty = JSON.stringify(JSON.parse(raw), null, 2);
|
||
} catch {
|
||
/* 保持原文 */
|
||
}
|
||
setGitImportJSON(pretty);
|
||
setSavedGitImport(pretty);
|
||
setGitImportLoaded(true);
|
||
setGitValidateMsg(null);
|
||
} catch (e) {
|
||
toast(e instanceof Error ? e.message : "加载适配器失败");
|
||
} finally {
|
||
setGitImportLoading(false);
|
||
}
|
||
};
|
||
|
||
useEffect(() => {
|
||
void loadGitImport();
|
||
// 仅挂载时拉取一次
|
||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||
}, []);
|
||
|
||
useEffect(() => {
|
||
const ids = NAV.map((n) => n.id);
|
||
const observer = new IntersectionObserver(
|
||
(entries) => {
|
||
const visible = entries
|
||
.filter((e) => e.isIntersecting)
|
||
.sort((a, b) => a.boundingClientRect.top - b.boundingClientRect.top);
|
||
if (visible[0]?.target?.id) {
|
||
const id = visible[0].target.id.replace(/^settings-/, "") as SectionId;
|
||
if (ids.includes(id)) setActive(id);
|
||
}
|
||
},
|
||
{ rootMargin: "-20% 0px -60% 0px", threshold: [0, 0.25, 0.5] }
|
||
);
|
||
ids.forEach((id) => {
|
||
const el = document.getElementById(`settings-${id}`);
|
||
if (el) observer.observe(el);
|
||
});
|
||
return () => observer.disconnect();
|
||
}, []);
|
||
|
||
const scrollTo = (id: SectionId) => {
|
||
setActive(id);
|
||
document.getElementById(`settings-${id}`)?.scrollIntoView({ behavior: "smooth", block: "start" });
|
||
if (id === "gitimport" && !gitImportLoaded && !gitImportLoading) {
|
||
void loadGitImport();
|
||
}
|
||
};
|
||
|
||
const validateGitImportClient = (): boolean => {
|
||
try {
|
||
JSON.parse(gitImportJSON);
|
||
setGitValidateMsg({ ok: true, text: "JSON 语法有效（服务端保存时还会做结构校验）" });
|
||
return true;
|
||
} catch (e) {
|
||
setGitValidateMsg({
|
||
ok: false,
|
||
text: e instanceof Error ? `JSON 无效：${e.message}` : "JSON 无效",
|
||
});
|
||
return false;
|
||
}
|
||
};
|
||
|
||
const saveGitImport = async () => {
|
||
if (savingGitImport) return;
|
||
if (!validateGitImportClient()) {
|
||
toast("请先修正 JSON 语法");
|
||
return;
|
||
}
|
||
setSavingGitImport(true);
|
||
try {
|
||
await apiUpdateSiteSettings({ timeline_git_import: gitImportJSON });
|
||
// 保存后以服务端规范化结果为准
|
||
const res = await apiGetAdminSettings();
|
||
const raw = res.timeline_git_import?.trim() || gitImportJSON;
|
||
let pretty = raw;
|
||
try {
|
||
pretty = JSON.stringify(JSON.parse(raw), null, 2);
|
||
} catch {
|
||
/* 保持 */
|
||
}
|
||
setGitImportJSON(pretty);
|
||
setSavedGitImport(pretty);
|
||
toast("提交导入适配器已保存", "ok");
|
||
} catch (e) {
|
||
toast(e instanceof Error ? e.message : "保存失败");
|
||
} finally {
|
||
setSavingGitImport(false);
|
||
}
|
||
};
|
||
|
||
const restoreGitDefault = async () => {
|
||
setSavingGitImport(true);
|
||
try {
|
||
let pretty = DEFAULT_TIMELINE_GIT_IMPORT;
|
||
try {
|
||
pretty = JSON.stringify(JSON.parse(DEFAULT_TIMELINE_GIT_IMPORT), null, 2);
|
||
} catch {
|
||
/* 保持 */
|
||
}
|
||
await apiUpdateSiteSettings({ timeline_git_import: pretty });
|
||
setGitImportJSON(pretty);
|
||
setSavedGitImport(pretty);
|
||
setGitValidateMsg(null);
|
||
setRestoreGitOpen(false);
|
||
toast("已恢复默认适配器", "ok");
|
||
} catch (e) {
|
||
toast(e instanceof Error ? e.message : "恢复失败");
|
||
} finally {
|
||
setSavingGitImport(false);
|
||
}
|
||
};
|
||
|
||
const saveIdentity = async () => {
|
||
if (saving) return;
|
||
const name = siteName.trim();
|
||
if (!name) {
|
||
toast("站点名称不能为空");
|
||
return;
|
||
}
|
||
setSaving(true);
|
||
try {
|
||
const res = await apiUpdateSiteSettings({
|
||
site_name: name,
|
||
site_description: siteDescription.trim(),
|
||
});
|
||
setSiteName(res.site_name);
|
||
setSiteDescription(res.site_description);
|
||
setSavedName(res.site_name);
|
||
setSavedDesc(res.site_description);
|
||
toast("站点信息已保存", "ok");
|
||
} catch (e) {
|
||
toast(e instanceof Error ? e.message : "保存失败");
|
||
} finally {
|
||
setSaving(false);
|
||
}
|
||
};
|
||
|
||
const toggleRegister = async () => {
|
||
if (togglingReg) return;
|
||
const next = !allowRegister;
|
||
setTogglingReg(true);
|
||
try {
|
||
const res = await apiUpdateSiteSettings({ allow_register: next });
|
||
setAllowRegister(res.allow_register);
|
||
toast(res.allow_register ? "已开放注册" : "已关闭注册", "ok");
|
||
} catch (e) {
|
||
toast(e instanceof Error ? e.message : "保存失败");
|
||
} finally {
|
||
setTogglingReg(false);
|
||
}
|
||
};
|
||
|
||
const toggleComments = async () => {
|
||
if (togglingComments) return;
|
||
const next = !allowComments;
|
||
setTogglingComments(true);
|
||
try {
|
||
const res = await apiUpdateSiteSettings({ allow_comments: next });
|
||
setAllowComments(res.allow_comments);
|
||
toast(res.allow_comments ? "已开放评论" : "已关闭评论", "ok");
|
||
} catch (e) {
|
||
toast(e instanceof Error ? e.message : "保存失败");
|
||
} finally {
|
||
setTogglingComments(false);
|
||
}
|
||
};
|
||
|
||
const toggleMessages = async () => {
|
||
if (togglingMessages) return;
|
||
const next = !allowMessages;
|
||
setTogglingMessages(true);
|
||
try {
|
||
const res = await apiUpdateSiteSettings({ allow_messages: next });
|
||
setAllowMessages(res.allow_messages);
|
||
toast(res.allow_messages ? "已开放消息" : "已关闭消息", "ok");
|
||
} catch (e) {
|
||
toast(e instanceof Error ? e.message : "保存失败");
|
||
} finally {
|
||
setTogglingMessages(false);
|
||
}
|
||
};
|
||
|
||
const togglePostLinkNewTab = async () => {
|
||
if (togglingLink) return;
|
||
const next = !postLinkNewTab;
|
||
setTogglingLink(true);
|
||
try {
|
||
const res = await apiUpdateSiteSettings({ post_link_new_tab: next });
|
||
setPostLinkNewTab(res.post_link_new_tab !== false);
|
||
toast(res.post_link_new_tab !== false ? "帖子与评论外链将在新标签打开" : "帖子与评论外链将在当前页打开", "ok");
|
||
} catch (e) {
|
||
toast(e instanceof Error ? e.message : "保存失败");
|
||
} finally {
|
||
setTogglingLink(false);
|
||
}
|
||
};
|
||
|
||
const toggleExtLimit = async () => {
|
||
if (togglingExtLimit) return;
|
||
const next = !extLimit;
|
||
setTogglingExtLimit(true);
|
||
try {
|
||
const res = await apiUpdateSiteSettings({ attachment_ext_limit: next });
|
||
setExtLimit(res.attachment_ext_limit !== false);
|
||
toast(res.attachment_ext_limit !== false ? "已开启附件类型限制" : "已关闭附件类型限制", "ok");
|
||
} catch (e) {
|
||
toast(e instanceof Error ? e.message : "保存失败");
|
||
} finally {
|
||
setTogglingExtLimit(false);
|
||
}
|
||
};
|
||
|
||
const saveUploadLimits = async (patch: {
|
||
attachment_max_mb?: number;
|
||
attachment_max_count?: number;
|
||
image_max_mb?: number;
|
||
}) => {
|
||
if (savingLimits) return;
|
||
setSavingLimits(true);
|
||
try {
|
||
const res = await apiUpdateSiteSettings(patch);
|
||
setAttMaxMB(res.attachment_max_mb);
|
||
setAttMaxCount(res.attachment_max_count);
|
||
setImageMaxMB(res.image_max_mb);
|
||
toast("上传限额已保存", "ok");
|
||
} catch (e) {
|
||
toast(e instanceof Error ? e.message : "保存失败");
|
||
} finally {
|
||
setSavingLimits(false);
|
||
}
|
||
};
|
||
|
||
// 步进器手输会连续触发 onChange，防抖后再写库
|
||
const limitsTimer = useRef<ReturnType<typeof setTimeout> | null>(null);
|
||
const scheduleLimitSave = (patch: {
|
||
attachment_max_mb?: number;
|
||
attachment_max_count?: number;
|
||
image_max_mb?: number;
|
||
}) => {
|
||
if (limitsTimer.current) clearTimeout(limitsTimer.current);
|
||
limitsTimer.current = setTimeout(() => {
|
||
void saveUploadLimits(patch);
|
||
}, 450);
|
||
};
|
||
|
||
useEffect(() => {
|
||
return () => {
|
||
if (limitsTimer.current) clearTimeout(limitsTimer.current);
|
||
};
|
||
}, []);
|
||
|
||
const saveExts = async () => {
|
||
if (savingExts || !extsDirty) return;
|
||
setSavingExts(true);
|
||
try {
|
||
const res = await apiUpdateSiteSettings({ attachment_exts: exts });
|
||
setExts([...res.attachment_exts]);
|
||
setSavedExts([...res.attachment_exts]);
|
||
toast("附件扩展名已保存", "ok");
|
||
} catch (e) {
|
||
toast(e instanceof Error ? e.message : "保存失败");
|
||
} finally {
|
||
setSavingExts(false);
|
||
}
|
||
};
|
||
|
||
return (
|
||
<div>
|
||
<AdminPageHeader
|
||
icon={Globe}
|
||
title="站点设置"
|
||
description="配置站点名称、互动开关与后续扩展分区；主题色请到「外观」页调整"
|
||
/>
|
||
|
||
<div className="flex flex-col lg:flex-row gap-6 lg:gap-8 items-start">
|
||
<nav
|
||
className="w-full lg:w-52 shrink-0 lg:sticky lg:top-4 flex lg:flex-col gap-1 overflow-x-auto lg:overflow-visible pb-1 lg:pb-0"
|
||
aria-label="设置分区"
|
||
>
|
||
{NAV.map((item) => {
|
||
const isActive = active === item.id;
|
||
return (
|
||
<button
|
||
key={item.id}
|
||
type="button"
|
||
onClick={() => scrollTo(item.id)}
|
||
className="shrink-0 text-left px-3 py-2 rounded-[var(--r-sm)] text-[13.5px] transition-colors whitespace-nowrap"
|
||
style={{
|
||
background: isActive ? "var(--accent-soft)" : "transparent",
|
||
color: isActive ? "var(--accent)" : "var(--ink-2)",
|
||
fontWeight: isActive ? 600 : 400,
|
||
}}
|
||
aria-current={isActive ? "true" : undefined}
|
||
>
|
||
{item.label}
|
||
{!item.ready && (
|
||
<span className="ml-1.5 text-[10.5px]" style={{ color: "var(--ink-3)" }}>
|
||
即将
|
||
</span>
|
||
)}
|
||
</button>
|
||
);
|
||
})}
|
||
</nav>
|
||
|
||
<div className="flex-1 min-w-0 flex flex-col gap-4 w-full">
|
||
<div id="settings-basic" className="scroll-mt-4">
|
||
<AdminSection title="基本信息" description="用于页眉品牌、页脚版权与 SEO 元信息">
|
||
<AdminField
|
||
id="site-name"
|
||
className="mb-4"
|
||
label="站点名称"
|
||
maxLength={32}
|
||
value={siteName}
|
||
onChange={setSiteName}
|
||
placeholder="姜十三论坛"
|
||
/>
|
||
|
||
<AdminField
|
||
id="site-desc"
|
||
className="mb-4"
|
||
label="站点简介"
|
||
as="textarea"
|
||
minHeight="96px"
|
||
maxLength={160}
|
||
value={siteDescription}
|
||
onChange={setSiteDescription}
|
||
placeholder="一句话介绍社区定位…"
|
||
/>
|
||
|
||
<div className="flex justify-end">
|
||
<button
|
||
type="button"
|
||
className="btn btn-primary btn-sm"
|
||
disabled={!dirty || saving}
|
||
onClick={() => void saveIdentity()}
|
||
>
|
||
{saving ? <Loader2 size={14} className="animate-spin" /> : <Save size={14} />}
|
||
保存基本信息
|
||
</button>
|
||
</div>
|
||
</AdminSection>
|
||
</div>
|
||
|
||
<div id="settings-content" className="scroll-mt-4 flex flex-col gap-4">
|
||
<AdminSection title="内容与互动" description="控制注册、评论、消息与链接打开方式">
|
||
<SwitchRow
|
||
bordered
|
||
title={
|
||
<>
|
||
<UserPlus size={15} /> 开放注册
|
||
</>
|
||
}
|
||
description="关闭后，游客将无法提交注册；已有账号仍可登录。适用于内测或维护期。"
|
||
control={
|
||
<AdminSwitch
|
||
checked={allowRegister}
|
||
disabled={togglingReg}
|
||
onChange={() => void toggleRegister()}
|
||
label="开放注册"
|
||
/>
|
||
}
|
||
/>
|
||
<SwitchRow
|
||
bordered
|
||
title={
|
||
<>
|
||
<MessageSquare size={15} /> 开放评论
|
||
</>
|
||
}
|
||
description="关闭后前台不展示评论入口、评论数量与已有评论，并提示本站不支持评论。"
|
||
control={
|
||
<AdminSwitch
|
||
checked={allowComments}
|
||
disabled={togglingComments}
|
||
onChange={() => void toggleComments()}
|
||
label="开放评论"
|
||
/>
|
||
}
|
||
/>
|
||
<SwitchRow
|
||
bordered
|
||
title={
|
||
<>
|
||
<MessagesSquare size={15} /> 开放消息
|
||
</>
|
||
}
|
||
description="关闭后前台不展示私聊与群聊入口；已有会话由后台消息管理继续监管。"
|
||
control={
|
||
<AdminSwitch
|
||
checked={allowMessages}
|
||
disabled={togglingMessages}
|
||
onChange={() => void toggleMessages()}
|
||
label="开放消息"
|
||
/>
|
||
}
|
||
/>
|
||
<SwitchRow
|
||
title={
|
||
<>
|
||
<ExternalLink size={15} /> 外链新标签打开
|
||
</>
|
||
}
|
||
description="开启后，帖子与评论中的 Markdown 外链在新标签打开；关闭则当前页跳转。"
|
||
control={
|
||
<AdminSwitch
|
||
checked={postLinkNewTab}
|
||
disabled={togglingLink}
|
||
onChange={() => void togglePostLinkNewTab()}
|
||
label="外链新标签打开"
|
||
/>
|
||
}
|
||
/>
|
||
</AdminSection>
|
||
|
||
<AdminSection
|
||
title="附件与上传"
|
||
description="帖子附件限额、扩展名白名单与正文插图体积；改后经实时通道同步到发帖页"
|
||
>
|
||
<SwitchRow
|
||
bordered
|
||
title={
|
||
<>
|
||
<Paperclip size={15} /> 附件单文件上限
|
||
</>
|
||
}
|
||
description="发帖附件体积上限。过大可能拖垮进程，并须把反代 / Next 请求体上限调到不少于该值。"
|
||
control={
|
||
<AdminStepper
|
||
value={attMaxMB}
|
||
min={1}
|
||
max={999999}
|
||
unit="MB"
|
||
ariaLabel="附件单文件上限"
|
||
disabled={savingLimits}
|
||
onChange={(n) => {
|
||
setAttMaxMB(n);
|
||
scheduleLimitSave({ attachment_max_mb: n });
|
||
}}
|
||
/>
|
||
}
|
||
/>
|
||
{attMaxMB >= 50 ? (
|
||
<p className="j13-ext-warn !mt-0 !mb-3" role="status">
|
||
当前 ≥50MB：请确认服务器内存与反代 body 上限已同步调大，否则用户仍会先撞上网关 413。
|
||
</p>
|
||
) : null}
|
||
|
||
<SwitchRow
|
||
bordered
|
||
title={
|
||
<>
|
||
<Paperclip size={15} /> 每帖附件个数
|
||
</>
|
||
}
|
||
description="单帖（含草稿）最多可绑定的附件数量。"
|
||
control={
|
||
<AdminStepper
|
||
value={attMaxCount}
|
||
min={1}
|
||
max={20}
|
||
unit="个"
|
||
ariaLabel="每帖附件个数"
|
||
disabled={savingLimits}
|
||
onChange={(n) => {
|
||
setAttMaxCount(n);
|
||
scheduleLimitSave({ attachment_max_count: n });
|
||
}}
|
||
/>
|
||
}
|
||
/>
|
||
|
||
<SwitchRow
|
||
bordered
|
||
title={
|
||
<>
|
||
<ImageIcon size={15} /> 正文插图上限
|
||
</>
|
||
}
|
||
description="Markdown 拖拽/粘贴图片（仅 JPEG / PNG / WebP）。插图会在服务端解析头部。"
|
||
control={
|
||
<AdminStepper
|
||
value={imageMaxMB}
|
||
min={1}
|
||
max={999999}
|
||
unit="MB"
|
||
ariaLabel="正文插图上限"
|
||
disabled={savingLimits}
|
||
onChange={(n) => {
|
||
setImageMaxMB(n);
|
||
scheduleLimitSave({ image_max_mb: n });
|
||
}}
|
||
/>
|
||
}
|
||
/>
|
||
{imageMaxMB >= 10 ? (
|
||
<p className="j13-ext-warn !mt-0 !mb-3" role="status">
|
||
插图 ≥10MB：解码头部更耗内存，建议保持较小值。
|
||
</p>
|
||
) : null}
|
||
|
||
<SwitchRow
|
||
bordered
|
||
title={
|
||
<>
|
||
<Paperclip size={15} /> 限制附件扩展名
|
||
</>
|
||
}
|
||
description={
|
||
extLimit
|
||
? "仅允许下方列表中的扩展名；安装包 / 脚本 / 网页可按需保留。"
|
||
: "任意格式可传，仍受体积上限与下载沙箱约束。"
|
||
}
|
||
control={
|
||
<AdminSwitch
|
||
checked={extLimit}
|
||
disabled={togglingExtLimit}
|
||
onChange={() => void toggleExtLimit()}
|
||
label="限制附件扩展名"
|
||
/>
|
||
}
|
||
/>
|
||
|
||
<div className="pt-2">
|
||
<p className="text-[13.5px] font-medium mb-2" style={{ color: "var(--ink)" }}>
|
||
允许的扩展名
|
||
</p>
|
||
<AdminExtChipEditor
|
||
value={exts}
|
||
onChange={setExts}
|
||
disabled={!extLimit || savingExts}
|
||
/>
|
||
<div className="flex justify-end mt-3">
|
||
<button
|
||
type="button"
|
||
className="btn btn-primary btn-sm"
|
||
disabled={!extsDirty || savingExts || !extLimit}
|
||
onClick={() => void saveExts()}
|
||
>
|
||
{savingExts ? <Loader2 size={14} className="animate-spin" /> : <Save size={14} />}
|
||
保存扩展名
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</AdminSection>
|
||
</div>
|
||
|
||
<div id="settings-gitimport" className="scroll-mt-4">
|
||
<AdminSection
|
||
title="提交导入"
|
||
description="声明式匹配规则，非可执行脚本。用于将 GitHub / Gitea 等提交历史导入时间线。"
|
||
>
|
||
<p className="meta text-[12.5px] mb-3 leading-relaxed">
|
||
通过 JSON 描述 host、路径正则与 API 字段映射；服务端只按规则拉取，不会执行任意代码。
|
||
</p>
|
||
|
||
{gitImportLoading && !gitImportLoaded ? (
|
||
<div className="flex items-center gap-2 meta py-8 justify-center">
|
||
<Loader2 size={16} className="animate-spin" /> 加载适配器…
|
||
</div>
|
||
) : (
|
||
<>
|
||
<label className="field-label" htmlFor="git-import-json">
|
||
适配器 JSON
|
||
</label>
|
||
<textarea
|
||
id="git-import-json"
|
||
className="j13-compose-field w-full font-mono text-[12.5px] leading-relaxed"
|
||
style={{ minHeight: 320 }}
|
||
spellCheck={false}
|
||
value={gitImportJSON}
|
||
onChange={(e) => {
|
||
setGitImportJSON(e.target.value);
|
||
setGitValidateMsg(null);
|
||
}}
|
||
placeholder="粘贴或编辑适配器 JSON…"
|
||
/>
|
||
|
||
{gitValidateMsg ? (
|
||
<p
|
||
className={`mt-2 text-[12.5px] flex items-start gap-1.5 ${
|
||
gitValidateMsg.ok ? "" : "alert-error !mt-2"
|
||
}`}
|
||
style={gitValidateMsg.ok ? { color: "var(--ok, #137333)" } : undefined}
|
||
role="status"
|
||
>
|
||
{gitValidateMsg.ok ? <CheckCircle2 size={14} className="mt-0.5 shrink-0" /> : null}
|
||
{gitValidateMsg.text}
|
||
</p>
|
||
) : null}
|
||
|
||
<div className="flex flex-wrap items-center gap-2 mt-4">
|
||
<button
|
||
type="button"
|
||
className="btn btn-line btn-sm"
|
||
disabled={gitImportLoading || savingGitImport}
|
||
onClick={() => {
|
||
if (validateGitImportClient()) toast("语法校验通过", "ok");
|
||
else toast("JSON 语法无效");
|
||
}}
|
||
>
|
||
<CheckCircle2 size={14} /> 校验
|
||
</button>
|
||
<button
|
||
type="button"
|
||
className="btn btn-primary btn-sm"
|
||
disabled={!gitImportDirty || savingGitImport}
|
||
onClick={() => void saveGitImport()}
|
||
>
|
||
{savingGitImport ? (
|
||
<Loader2 size={14} className="animate-spin" />
|
||
) : (
|
||
<Save size={14} />
|
||
)}
|
||
保存
|
||
</button>
|
||
<button
|
||
type="button"
|
||
className="btn btn-line btn-sm"
|
||
disabled={savingGitImport}
|
||
onClick={() => setRestoreGitOpen(true)}
|
||
>
|
||
<RotateCcw size={14} /> 恢复默认
|
||
</button>
|
||
<span className="meta text-[11.5px] inline-flex items-center gap-1 ml-auto">
|
||
<GitBranch size={12} /> GitHub + Gitea 模板
|
||
</span>
|
||
</div>
|
||
</>
|
||
)}
|
||
</AdminSection>
|
||
</div>
|
||
|
||
<div id="settings-brand" className="scroll-mt-4">
|
||
<ComingSoonCard
|
||
title="品牌与 SEO"
|
||
description="站点图标、OG 图与结构化元数据"
|
||
icon={<Palette size={22} />}
|
||
/>
|
||
</div>
|
||
<div id="settings-footer" className="scroll-mt-4">
|
||
<ComingSoonCard
|
||
title="页脚与合规"
|
||
description="备案号、版权声明与合规链接"
|
||
icon={<FileText size={22} />}
|
||
/>
|
||
</div>
|
||
<div id="settings-security" className="scroll-mt-4">
|
||
<ComingSoonCard
|
||
title="安全与限流"
|
||
description="登录/注册速率与发帖冷静期等"
|
||
icon={<Shield size={22} />}
|
||
/>
|
||
</div>
|
||
<div id="settings-mail" className="scroll-mt-4">
|
||
<ComingSoonCard title="邮件" description="SMTP 与通知邮件模板" icon={<Mail size={22} />} />
|
||
</div>
|
||
<div id="settings-storage" className="scroll-mt-4">
|
||
<ComingSoonCard
|
||
title="对象存储"
|
||
description="附件与头像的云端存储配置"
|
||
icon={<HardDrive size={22} />}
|
||
/>
|
||
</div>
|
||
<div id="settings-words" className="scroll-mt-4">
|
||
<ComingSoonCard title="敏感词" description="内容过滤词库与命中策略" icon={<Ban size={22} />} />
|
||
</div>
|
||
<div id="settings-maintenance" className="scroll-mt-4">
|
||
<ComingSoonCard
|
||
title="系统维护"
|
||
description="维护模式、缓存与诊断工具"
|
||
icon={<Wrench size={22} />}
|
||
/>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<ConfirmDialog
|
||
open={restoreGitOpen}
|
||
title="恢复默认适配器"
|
||
message="将覆盖当前「提交导入」JSON 为内置 GitHub + Gitea 模板，并立即保存。确定继续？"
|
||
busy={savingGitImport}
|
||
confirmLabel="恢复并保存"
|
||
onCancel={() => !savingGitImport && setRestoreGitOpen(false)}
|
||
onConfirm={() => void restoreGitDefault()}
|
||
/>
|
||
</div>
|
||
);
|
||
}
|