feat(messaging,announcements): 前端 UI 集成星标/草稿/置顶/已读回执

- 消息星标：MessageList 卡片星标按钮（乐观更新+回滚）、MessageDetail 头部星标切换
- 消息草稿：MessageCompose 自动保存（2s 防抖）+ 手动保存按钮 + 状态指示器 + 发送后清理草稿
- 公告置顶：AnnouncementCard 管理端置顶按钮、AnnouncementDetail 置顶切换、置顶 Badge
- 公告已读回执：用户端详情页自动标记已读 + 已读/未读 Badge、管理端已读人数显示
- i18n：新增 announcements.meta.readCount 翻译键

src/modules/messaging/components/message-list.tsx

@@ -1,9 +1,10 @@
 "use client"
 
-import { useMemo, useState } from "react"
+import { useCallback, useMemo, useState } from "react"
 import Link from "next/link"
-import { Mail, MailOpen, Plus, Send, Inbox, Search, Loader2, ChevronLeft, ChevronRight } from "lucide-react"
+import { Mail, MailOpen, Plus, Send, Inbox, Search, Loader2, ChevronLeft, ChevronRight, Star } from "lucide-react"
 import { useTranslations } from "next-intl"
+import { toast } from "sonner"
 
 import { Badge } from "@/shared/components/ui/badge"
 import { Button } from "@/shared/components/ui/button"
@@ -15,7 +16,7 @@ import { cn, formatDate } from "@/shared/lib/utils"
 import { usePermission } from "@/shared/hooks/use-permission"
 import { Permissions } from "@/shared/types/permissions"
 
-import { getMessagesAction } from "../actions"
+import { getMessagesAction, toggleMessageStarAction } from "../actions"
 import { useMessageSearch } from "../hooks/use-message-search"
 import type { Message, MessageType } from "../types"
 
@@ -36,6 +37,8 @@ export function MessageList({
   const t = useTranslations("messages")
   const [tab, setTab] = useState<Tab>(initialType === "sent" ? "sent" : "inbox")
   const [currentPage, setCurrentPage] = useState(1)
+  const [starredOverride, setStarredOverride] = useState<Record<string, boolean>>({})
+  const [togglingStarId, setTogglingStarId] = useState<string | null>(null)
   const { hasPermission } = usePermission()
   const canSend = hasPermission(Permissions.MESSAGE_SEND)
 
@@ -69,6 +72,38 @@ export function MessageList({
     setCurrentPage(1)
   }
 
+  const getIsStarred = (m: Message): boolean => {
+    const override = starredOverride[m.id]
+    return override === undefined ? m.isStarred : override
+  }
+
+  const handleToggleStar = useCallback(
+    async (e: React.MouseEvent, messageId: string, currentStarred: boolean): Promise<void> => {
+      e.preventDefault()
+      e.stopPropagation()
+      setTogglingStarId(messageId)
+      // 乐观更新
+      setStarredOverride((prev) => ({ ...prev, [messageId]: !currentStarred }))
+      try {
+        const res = await toggleMessageStarAction(messageId)
+        if (res.success) {
+          toast.success(t("messages.starToggled"))
+        } else {
+          // 回滚
+          setStarredOverride((prev) => ({ ...prev, [messageId]: currentStarred }))
+          toast.error(res.message)
+        }
+      } catch {
+        // 回滚
+        setStarredOverride((prev) => ({ ...prev, [messageId]: currentStarred }))
+        toast.error(t("messages.sendFailed"))
+      } finally {
+        setTogglingStarId(null)
+      }
+    },
+    [t]
+  )
+
   return (
     <div className="space-y-6">
       <div className="flex flex-wrap items-center justify-between gap-3">
@@ -128,6 +163,7 @@ export function MessageList({
               const isReceived = m.receiverId === currentUserId
               const counterpart = isReceived ? m.senderName : m.receiverName
               const unread = isReceived && !m.isRead
+              const isStarred = getIsStarred(m)
               return (
                 <Link key={m.id} href={`/messages/${m.id}`} className="block" aria-label={m.subject ?? t("meta.noSubject")}>
                   <Card className={cn("transition-colors hover:bg-accent/50", unread && "border-primary/40")}>
@@ -143,14 +179,33 @@ export function MessageList({
                             {m.subject ?? t("meta.noSubject")}
                           </span>
                           {unread ? <Badge variant="default" className="text-xs">{t("status.new")}</Badge> : null}
+                          {isStarred ? (
+                            <Star className="h-3.5 w-3.5 fill-yellow-400 text-yellow-400" aria-hidden="true" />
+                          ) : null}
                         </div>
                         <p className="text-muted-foreground text-xs">
                           {isReceived ? t("meta.from") : t("meta.to")}: {counterpart ?? t("meta.unknown")}
                         </p>
                       </div>
-                      <span className="text-muted-foreground shrink-0 text-xs">
-                        {formatDate(m.createdAt)}
-                      </span>
+                      <div className="flex shrink-0 items-center gap-1">
+                        <button
+                          type="button"
+                          onClick={(e) => void handleToggleStar(e, m.id, isStarred)}
+                          disabled={togglingStarId === m.id}
+                          aria-label={isStarred ? t("actions.unstar") : t("actions.star")}
+                          className="text-muted-foreground hover:text-foreground inline-flex size-7 items-center justify-center rounded-md transition-colors hover:bg-accent disabled:opacity-50"
+                        >
+                          <Star
+                            className={cn(
+                              "h-4 w-4 transition-colors",
+                              isStarred && "fill-yellow-400 text-yellow-400"
+                            )}
+                          />
+                        </button>
+                        <span className="text-muted-foreground text-xs">
+                          {formatDate(m.createdAt)}
+                        </span>
+                      </div>
                     </CardHeader>
                     <CardContent className="pt-0">
                       <p className="text-muted-foreground line-clamp-2 text-sm whitespace-pre-wrap">