feat(posts): 类型特殊块移至正文下，采纳答案卡与中奖楼层按评论标记

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-09-16 08:33:00 +08:00
parent 92695c2143
commit 44fdcace4c
8 changed files with 410 additions and 83 deletions
--- a/frontend/app/globals.css
+++ b/frontend/app/globals.css
@@ -303,6 +303,64 @@ body {
  border-color: color-mix(in srgb, var(--ok) 30%, var(--line));
 }

+/* 正文下方已采纳答案：问答资料卡 */
+.j13-accepted-answer {
+  margin-top: 1.75rem;
+  padding: 1.15rem 1.25rem 1.25rem;
+  border-radius: 14px;
+  border: 1px solid color-mix(in srgb, var(--ok) 28%, var(--line));
+  background: color-mix(in srgb, var(--ok) 7%, var(--panel));
+  box-shadow: inset 3px 0 0 0 var(--ok);
+}
+.dark .j13-accepted-answer {
+  background: color-mix(in srgb, var(--ok) 12%, var(--panel));
+  border-color: color-mix(in srgb, var(--ok) 36%, var(--line));
+}
+.j13-accepted-answer__head {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: 12px 16px;
+  margin-bottom: 0.9rem;
+  padding-bottom: 0.85rem;
+  border-bottom: 1px solid color-mix(in srgb, var(--ok) 18%, var(--line));
+}
+.j13-accepted-answer__meta {
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+  min-width: 0;
+  flex: 1;
+}
+.j13-accepted-answer__status {
+  margin: 0;
+  font-size: 15px;
+  font-weight: 600;
+  color: var(--ink);
+  line-height: 1.3;
+}
+.j13-accepted-answer__author {
+  display: flex;
+  align-items: center;
+  gap: 10px;
+  min-width: 0;
+}
+.j13-accepted-answer__body {
+  min-width: 0;
+}
+/* 正文下方类型特殊块（投票/悬赏/抽奖/问答状态） */
+.j13-interact-below {
+  margin-top: 1.75rem;
+}
+.j13-interact-below + .j13-accepted-answer,
+.j13-interact-below + .j13-question-below {
+  margin-top: 1rem;
+}
+.j13-question-below {
+  margin-top: 1.75rem;
+}
+
 .j13-compose-field {
  width: 100%;
  padding: 10px 14px;
@@ -1134,12 +1192,15 @@ a.j13-mention-token:hover {
    padding: 4px 11px;
    border-radius: 999px;
    white-space: nowrap;
-    background: var(--gold);
-    color: #ffffff;
+    /* 中奖：明亮类金色（不用偏棕的 --gold 实心白字） */
+    background: color-mix(in srgb, #d4a017 22%, var(--panel));
+    color: #8a6d00;
+    box-shadow: inset 0 0 0 1px color-mix(in srgb, #d4a017 42%, transparent);
  }
  .dark .badge-winner {
-    background: var(--gold);
-    color: #1a1204;
+    background: color-mix(in srgb, #e8c56b 26%, transparent);
+    color: #f5dfa0;
+    box-shadow: inset 0 0 0 1px color-mix(in srgb, #e8c56b 48%, transparent);
  }

  /* 站点公告列表 */
--- a/frontend/app/post/[id]/page.tsx
+++ b/frontend/app/post/[id]/page.tsx
@@ -35,7 +35,8 @@ import RoleBadge from "@/components/RoleBadge";
 import MarkdownBody from "@/components/MarkdownBody";
 import ContentLockGate from "@/components/ContentLockGate";
 import PostAttachments from "@/components/PostAttachments";
-import PostInteractPanels from "@/components/PostInteractPanels";
+import PostInteractPanels, { QuestionStatusCard } from "@/components/PostInteractPanels";
+import AcceptedAnswerCard from "@/components/AcceptedAnswerCard";
 import { canModerateBoard } from "@/lib/roles";
 import { IconComment, IconEye } from "@/components/Icons";
 import { normalizePostType, postTypeLabel, contentAccessLabel, typeStatusLabel, typeStatusClass } from "@/lib/postMeta";
@@ -479,6 +480,24 @@ export default async function PostDetailPage({ params, searchParams }: PageProps
        ? ("bounty" as const)
        : null;

+  const acceptedAnswer =
+    post.question?.accepted_answer || post.bounty?.accepted_answer || null;
+  const acceptedAnswerVariant =
+    postType === "bounty" && post.bounty?.accepted_answer
+      ? ("bounty" as const)
+      : ("question" as const);
+  const questionState =
+    postType === "question"
+      ? post.question ?? {
+          solved: false,
+          accepted_comment_id: 0,
+          accepted_floor: 0,
+          can_accept: canManageTyped,
+          can_solve: canManageTyped,
+          can_reopen: false,
+        }
+      : null;
+
  const jsonLd = {
    "@context": "https://schema.org",
    "@type": "DiscussionForumPosting",
@@ -494,6 +513,20 @@ export default async function PostDetailPage({ params, searchParams }: PageProps
      interactionType: { "@type": "ReadAction" },
      userInteractionCount: post.view_count,
    },
+    ...(acceptedAnswer &&
+      !acceptedAnswer.deleted &&
+      !post.content_locked && {
+        acceptedAnswer: {
+          "@type": "Comment",
+          text: acceptedAnswer.content,
+          dateCreated: acceptedAnswer.created_at,
+          author: {
+            "@type": "Person",
+            name: acceptedAnswer.user.nickname || acceptedAnswer.user.username,
+          },
+          url: `#comment-${acceptedAnswer.id}`,
+        },
+      }),
  };

  // 目录项与 Markdown 标题按渲染顺序一一对应（extractToc 顺序 == 文档顺序）
@@ -650,26 +683,6 @@ export default async function PostDetailPage({ params, searchParams }: PageProps
                </div>
              )}

-              <PostInteractPanels
-                postId={post.id}
-                question={
-                  postType === "question"
-                    ? post.question ?? {
-                        solved: false,
-                        accepted_comment_id: 0,
-                        accepted_floor: 0,
-                        can_accept: canManageTyped,
-                        can_solve: canManageTyped,
-                        can_reopen: false,
-                      }
-                    : post.question
-                }
-                poll={post.poll}
-                bounty={post.bounty}
-                lottery={post.lottery}
-                loggedIn={!!me.user}
-              />
-
              {post.content_locked ? (
                <ContentLockGate
                  postId={post.id}
@@ -689,6 +702,25 @@ export default async function PostDetailPage({ params, searchParams }: PageProps
                <PostAttachments postId={post.id} items={post.attachments || []} />
              )}

+              {/* 类型特殊块（投票/悬赏/抽奖/问答）统一放正文最下方 */}
+              <PostInteractPanels
+                postId={post.id}
+                poll={post.poll}
+                bounty={post.bounty}
+                lottery={post.lottery}
+                loggedIn={!!me.user}
+              />
+              {!post.content_locked && acceptedAnswer ? (
+                <AcceptedAnswerCard
+                  answer={acceptedAnswer}
+                  variant={acceptedAnswerVariant}
+                  postId={post.id}
+                  canReopen={!!post.question?.can_reopen}
+                />
+              ) : questionState ? (
+                <QuestionStatusCard postId={post.id} state={questionState} />
+              ) : null}
+
              {/* 文末点赞：分隔线后居中，唯一的点赞入口（作者行不再放置） */}
              <div
                className="mt-9 pt-7 flex justify-center"
@@ -729,9 +761,11 @@ export default async function PostDetailPage({ params, searchParams }: PageProps
                  post.bounty?.accepted_comment_id ||
                  0
                }
-                winnerUserIds={
+                winnerCommentIds={
                  post.lottery?.drawn
-                    ? (post.lottery.winners || []).map((w) => w.id)
+                    ? (post.lottery.winners || [])
+                        .map((w) => w.comment_id || 0)
+                        .filter((id) => id > 0)
                    : []
                }
              />