feat: 重设计搜索帖子 UI/UX,新增筛选面板与结果页 chips

将高级筛选移入独立面板,统一 URL 状态与清除逻辑,并优化移动端搜索与空结果反馈。

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
2026-08-27 19:21:55 +08:00
parent c6df703b96
commit 55b1831da2
8 changed files with 1190 additions and 214 deletions

View File

@@ -21,7 +21,6 @@ export default function FeedHeader({
keyword,
tag = '',
author = '',
titleOnly = false,
boards,
stats,
postTotal,
@@ -30,20 +29,16 @@ export default function FeedHeader({
const nav = useNavigate();
const board = boards.find(b => b.id === boardId);
const filtered = !!(keyword || tag || author);
const isSearch = !!(keyword || author);
const isTag = !!tag;
const filtered = isSearch || isTag;
const inBoard = !filtered && boardId > 0 && !!board;
/** 侧栏已有「全部帖子 / 板块名」,中间栏不再重复;仅搜索/标签保留标题 */
let title = '';
if (tag) title = `标签:${tag}`;
else if (keyword || author) {
const parts: string[] = [];
if (keyword) parts.push(titleOnly ? `标题含「${keyword}` : `搜索:${keyword}`);
if (author) parts.push(`作者 ${author}`);
if (boardId && board) parts.push(`板块 ${board.name}`);
title = parts.join(' · ');
}
const TitleTag = titleAs;
let title = '';
if (isTag) title = `标签:${tag}`;
else if (isSearch) title = '搜索结果';
return (
<div className={`feed-head${filtered ? ' feed-head--solo' : ' feed-head--stats-only'}`}>
<div className="feed-head__title">
@@ -77,19 +72,19 @@ export default function FeedHeader({
</span>
</div>
)}
{filtered && (
<span className="feed-head__meta feed-head__meta--count"> {postTotal} </span>
)}
</div>
{filtered && (
{isTag && (
<button
type="button"
className="feed-head__clear"
onClick={() => navigateFeed(nav, '/')}
>
{tag ? '清除标签' : '清除搜索'}
</button>
)}
{filtered && (
<span className="feed-toolbar__count"> {postTotal} </span>
)}
</div>
);
}