freefire/jiang13-bbs
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 9 Wiki Activity

feat: 站点单页、时间线导入与行级 BBCode 短代码

Browse Source 
首页右栏接入单页入口与公告置顶/全部页；Markdown 编辑器支持可视化时间线与 Git 导入；隐藏块改为 [hide]/[timeline] 命名闭合，并修复单页/公告 GORM 更新只改 updated_at 的问题。

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
姜十三
2026-09-17 19:52:06 +08:00
parent 2aacf99a49
commit a83276060f
52 changed files with 5073 additions and 648 deletions
Download Patch File Download Diff File Expand all files Collapse all files

340
frontend/components/MarkdownEditor.tsx
View File

@@ -33,10 +33,13 @@ import {
ChevronDown,
Upload,
Link2,
History,
} from "lucide-react";
import { apiUploadPostImage } from "@/lib/api";
import { toast } from "@/lib/toast";
import MarkdownBodyClient from "@/components/MarkdownBodyClient";
import TimelineEditor from "@/components/TimelineEditor";
import { resolveTimelineBlockForEdit } from "@/lib/directiveBlocks";
import { SHIKI_LANG_IDS } from "@/components/markdown/shikiHighlighter";
type MarkdownEditorProps = {
@@ -49,6 +52,13 @@ type MarkdownEditorProps = {
id?: string;
/** 正文插图体积上限（MB），缺省 5 */
imageMaxMB?: number;
/** 是否提供隐藏可见（[hide]） */
allowHide?: boolean;
/**
* 是否允许「回复可见」。
* 仅当 allowHide 为 true 时生效；不可评论的内容（如公告）应传 false，菜单项置灰。
*/
allowReplyHide?: boolean;
};
type EditorMode = "split" | "write" | "preview";
@@ -110,6 +120,8 @@ export default function MarkdownEditor({
onSubmitShortcut,
id,
imageMaxMB = 5,
allowHide = false,
allowReplyHide = true,
}: MarkdownEditorProps) {
const taRef = useRef<HTMLTextAreaElement>(null);
const fileRef = useRef<HTMLInputElement>(null);
@@ -128,6 +140,11 @@ export default function MarkdownEditor({
const [hidePoints, setHidePoints] = useState(10);
const [hidePassword, setHidePassword] = useState("");
const [hideStep, setHideStep] = useState<"menu" | "points" | "password">("menu");
const [timelineOpen, setTimelineOpen] = useState(false);
const [timelineBody, setTimelineBody] = useState("");
const [timelineRange, setTimelineRange] = useState<{ start: number; end: number } | null>(
null
);
const savedSel = useRef<{ start: number; end: number } | null>(null);
useEffect(() => {
@@ -336,19 +353,20 @@ export default function MarkdownEditor({
points?: number,
password?: string
) => {
if (!allowHide) return;
restoreSel();
const el = taRef.current;
const start = el?.selectionStart ?? 0;
const end = el?.selectionEnd ?? 0;
const selected = value.slice(start, end);
const body = selected || "在此填写隐藏内容";
let open = `:::hide ${kind}`;
let open = `[hide ${kind}]`;
if (kind === "points") {
open = `:::hide points ${points || 10}`;
open = `[hide points=${points || 10}]`;
} else if (kind === "password") {
open = `:::hide password ${password || "password"}`;
open = `[hide password=${password || "password"}]`;
}
const block = `${open}\n${body}\n:::`;
const block = `${open}\n${body}\n[/hide]`;
const padBefore = start > 0 && value[start - 1] !== "\n" ? "\n" : "";
const padAfter = end < value.length && value[end] !== "\n" ? "\n" : "";
const inserted = padBefore + block + padAfter;
@@ -363,6 +381,51 @@ export default function MarkdownEditor({
setPopover(null);
};
const openTimelineEditor = () => {
rememberSel();
const el = taRef.current;
const cursor = el?.selectionStart ?? savedSel.current?.start ?? 0;
const found = resolveTimelineBlockForEdit(value, cursor);
if (found) {
setTimelineBody(found.body);
setTimelineRange({ start: found.start, end: found.end });
} else {
setTimelineBody("");
setTimelineRange(null);
}
setPopover(null);
setTimelineOpen(true);
};
const applyTimelineBlock = (block: string) => {
const el = taRef.current;
if (timelineRange) {
const next = value.slice(0, timelineRange.start) + block + value.slice(timelineRange.end);
onChange(next);
requestAnimationFrame(() => {
if (!el) return;
el.focus();
const pos = timelineRange.start + block.length;
el.setSelectionRange(pos, pos);
});
return;
}
restoreSel();
const start = el?.selectionStart ?? 0;
const end = el?.selectionEnd ?? start;
const padBefore = start > 0 && value[start - 1] !== "\n" ? "\n" : "";
const padAfter = end < value.length && value[end] !== "\n" ? "\n" : "";
const inserted = padBefore + block + padAfter;
const next = value.slice(0, start) + inserted + value.slice(end);
onChange(next);
requestAnimationFrame(() => {
if (!el) return;
el.focus();
const pos = start + inserted.length;
el.setSelectionRange(pos, pos);
});
};
const insertOrderedList = () => {
const el = taRef.current;
if (!el || disabled) return;
@@ -717,134 +780,154 @@ export default function MarkdownEditor({
)}
</div>
<Sep />
<div className="j13-md-popover-anchor relative">
<ToolBtn
label="隐藏内容"
icon={<Lock size={15} />}
active={popover === "hide"}
onClick={() => openPopover("hide")}
/>
{popover === "hide" && (
<div className="j13-md-popover j13-md-popover-form" role="dialog" aria-label="插入隐藏内容">
{hideStep === "menu" ? (
<>
<button type="button" className="j13-md-menu-item" onClick={() => insertHide("login")}>
登录可见
</button>
<button type="button" className="j13-md-menu-item" onClick={() => insertHide("reply")}>
回复可见
</button>
<button
type="button"
className="j13-md-menu-item"
onClick={() => setHideStep("points")}
>
积分可见…
</button>
<button
type="button"
className="j13-md-menu-item"
onClick={() => setHideStep("password")}
>
密码可见…
</button>
</>
) : hideStep === "points" ? (
<>
<label className="j13-md-field">
<span>所需积分</span>
<input
autoFocus
type="number"
min={1}
max={100000}
value={hidePoints}
onChange={(e) => setHidePoints(Number(e.target.value) || 1)}
className="j13-md-popover-input"
onKeyDown={(e) => {
if (e.key === "Enter") {
e.preventDefault();
if (hidePoints >= 1 && hidePoints <= 100000) {
insertHide("points", hidePoints);
}
}
}}
/>
</label>
<div className="j13-md-popover-footer">
<button
type="button"
className="btn btn-line btn-sm"
onClick={() => setHideStep("menu")}
>
返回
<ToolBtn
label="时间线"
icon={<History size={15} />}
onClick={openTimelineEditor}
/>
{allowHide ? (
<div className="j13-md-popover-anchor relative">
<ToolBtn
label="隐藏内容"
icon={<Lock size={15} />}
active={popover === "hide"}
onClick={() => openPopover("hide")}
/>
{popover === "hide" && (
<div className="j13-md-popover j13-md-popover-form" role="dialog" aria-label="插入隐藏内容">
{hideStep === "menu" ? (
<>
<button type="button" className="j13-md-menu-item" onClick={() => insertHide("login")}>
登录可见
</button>
<button
type="button"
className="btn btn-primary btn-sm"
className="j13-md-menu-item"
disabled={!allowReplyHide}
data-tip={allowReplyHide ? undefined : "当前内容不可评论，无法使用回复可见"}
aria-disabled={!allowReplyHide}
onClick={() => {
if (hidePoints < 1 || hidePoints > 100000) {
toast("积分须在 1–100000", "error");
return;
}
insertHide("points", hidePoints);
if (!allowReplyHide) return;
insertHide("reply");
}}
>
插入
回复可见
{!allowReplyHide ? (
<span className="j13-md-menu-item-hint">不可用</span>
) : null}
</button>
</div>
</>
) : (
<>
<label className="j13-md-field">
<span>查看密码（不含空格，1–64 字）</span>
<input
autoFocus
type="text"
value={hidePassword}
maxLength={64}
placeholder="例如：secret"
onChange={(e) => setHidePassword(e.target.value)}
className="j13-md-popover-input"
onKeyDown={(e) => {
if (e.key === "Enter") {
e.preventDefault();
<button
type="button"
className="j13-md-menu-item"
onClick={() => setHideStep("points")}
>
积分可见…
</button>
<button
type="button"
className="j13-md-menu-item"
onClick={() => setHideStep("password")}
>
密码可见…
</button>
</>
) : hideStep === "points" ? (
<>
<label className="j13-md-field">
<span>所需积分</span>
<input
autoFocus
type="number"
min={1}
max={100000}
value={hidePoints}
onChange={(e) => setHidePoints(Number(e.target.value) || 1)}
className="j13-md-popover-input"
onKeyDown={(e) => {
if (e.key === "Enter") {
e.preventDefault();
if (hidePoints >= 1 && hidePoints <= 100000) {
insertHide("points", hidePoints);
}
}
}}
/>
</label>
<div className="j13-md-popover-footer">
<button
type="button"
className="btn btn-line btn-sm"
onClick={() => setHideStep("menu")}
>
返回
</button>
<button
type="button"
className="btn btn-primary btn-sm"
onClick={() => {
if (hidePoints < 1 || hidePoints > 100000) {
toast("积分须在 1–100000", "error");
return;
}
insertHide("points", hidePoints);
}}
>
插入
</button>
</div>
</>
) : (
<>
<label className="j13-md-field">
<span>查看密码（不含空格，1–64 字）</span>
<input
autoFocus
type="text"
value={hidePassword}
maxLength={64}
placeholder="例如：secret"
onChange={(e) => setHidePassword(e.target.value)}
className="j13-md-popover-input"
onKeyDown={(e) => {
if (e.key === "Enter") {
e.preventDefault();
const p = hidePassword.trim();
if (p && !/\s/.test(p)) {
insertHide("password", undefined, p);
}
}
}}
/>
</label>
<div className="j13-md-popover-footer">
<button
type="button"
className="btn btn-line btn-sm"
onClick={() => setHideStep("menu")}
>
返回
</button>
<button
type="button"
className="btn btn-primary btn-sm"
onClick={() => {
const p = hidePassword.trim();
if (p && !/\s/.test(p)) {
insertHide("password", undefined, p);
if (!p || /\s/.test(p) || p.length > 64) {
toast("密码须为 1–64 字符且不含空格", "error");
return;
}
}
}}
/>
</label>
<div className="j13-md-popover-footer">
<button
type="button"
className="btn btn-line btn-sm"
onClick={() => setHideStep("menu")}
>
返回
</button>
<button
type="button"
className="btn btn-primary btn-sm"
onClick={() => {
const p = hidePassword.trim();
if (!p || /\s/.test(p) || p.length > 64) {
toast("密码须为 1–64 字符且不含空格", "error");
return;
}
insertHide("password", undefined, p);
}}
>
插入
</button>
</div>
</>
)}
</div>
)}
</div>
insertHide("password", undefined, p);
}}
>
插入
</button>
</div>
</>
)}
</div>
)}
</div>
) : null}
</div>
<div className="flex items-center gap-2 shrink-0">
<div className="j13-md-mode" role="tablist" aria-label="编辑模式">
@@ -950,6 +1033,17 @@ export default function MarkdownEditor({
<span>支持粘贴/拖拽图片 · Markdown · Ctrl/⌘ + Enter 提交</span>
<span className="tabular-nums">{value.length} 字</span>
</div>
<TimelineEditor
open={timelineOpen}
initialBody={timelineBody}
onClose={() => {
setTimelineOpen(false);
setTimelineRange(null);
setTimelineBody("");
}}
onInsert={applyTimelineBlock}
/>
</div>
);
}