feat: 新增站点公告系统与多项体验优化

此提交完成了以下核心功能与优化:
1. 新增站点公告全流程支持:包含公告模型、CRUD接口、管理后台页面、公告详情页与首页展示
2. 实现评论楼层化与回复嵌套:重构评论系统为树状结构,支持回复评论与层级限制
3. 添加用户在线状态追踪:异步更新用户最后活跃时间并做SQL限频
4. 优化用户体验:移动端浮动操作条、统一板块标签样式、用户页签到积分展示、注册即登录优化
5. 其他细节优化:SEO站点地图新增公告页、评论分页与统计、登录/注册表单增强等
This commit is contained in:
2026-09-13 21:38:01 +08:00
parent 9bae6f2513
commit 996a870015
41 changed files with 2846 additions and 786 deletions

View File

@@ -0,0 +1,82 @@
"use client";
import { useEffect, useState } from "react";
import { ArrowUp, MessageSquare } from "lucide-react";
import LikeButton from "./LikeButton";
/**
* 帖子详情移动端浮动操作条(lg 以下显示):
* 长文读到中途也能点赞 / 跳评论框 / 回顶部,不必滚到文末。
*/
export default function MobilePostBar({
postId,
liked,
likeCount,
}: {
postId: string;
liked: boolean;
likeCount: number;
}) {
const [showTop, setShowTop] = useState(false);
useEffect(() => {
const onScroll = () => setShowTop(window.scrollY > 400);
onScroll();
window.addEventListener("scroll", onScroll, { passive: true });
return () => window.removeEventListener("scroll", onScroll);
}, []);
const scrollToComments = () => {
document.getElementById("comment-input")?.scrollIntoView({
behavior: window.matchMedia("(prefers-reduced-motion: reduce)").matches ? "auto" : "smooth",
block: "center",
});
};
const scrollToTop = () => {
window.scrollTo({
top: 0,
behavior: window.matchMedia("(prefers-reduced-motion: reduce)").matches ? "auto" : "smooth",
});
};
return (
<div className="lg:hidden fixed bottom-4 left-1/2 -translate-x-1/2 z-40" role="navigation" aria-label="阅读操作">
<div
className="flex items-center gap-0.5 rounded-full border px-1.5 py-1.5"
style={{
background: "color-mix(in srgb, var(--panel) 90%, transparent)",
borderColor: "var(--line-2)",
boxShadow: "var(--shadow-lg)",
backdropFilter: "blur(14px)",
WebkitBackdropFilter: "blur(14px)",
}}
>
<button
type="button"
onClick={scrollToComments}
className="w-11 h-11 flex items-center justify-center rounded-full transition-colors hover:bg-[var(--panel-2)]"
style={{ color: "var(--ink-2)" }}
aria-label="跳到评论框"
>
<MessageSquare size={18} />
</button>
{/* 放大点赞按钮的触控区域(样式见 globals.css .j13-bar-like) */}
<div className="j13-bar-like">
<LikeButton postId={postId} liked={liked} likeCount={likeCount} variant="compact" />
</div>
{showTop && (
<button
type="button"
onClick={scrollToTop}
className="w-11 h-11 flex items-center justify-center rounded-full transition-colors hover:bg-[var(--panel-2)] j13-toast-in"
style={{ color: "var(--ink-2)" }}
aria-label="回到顶部"
>
<ArrowUp size={18} />
</button>
)}
</div>
</div>
);
}