feat: polish BI dashboards and bump version

src/modules/admin/FeedbackAdminPage.tsx

@@ -2,6 +2,7 @@ import { useCallback, useEffect, useState } from 'react';
 import { motion, AnimatePresence } from 'motion/react';
 import { Inbox, RotateCcw, X, Send, CheckCircle2, AlertCircle, Image as ImageIcon, Loader2, ArrowLeft } from 'lucide-react';
 import { fetchJson } from '../../auth/api-client';
+import { EmptyState, LoadingState, PageFrame, SurfaceCard } from '../../components/ui/surface';
 
 interface FeedbackItem {
   id: number;
@@ -20,10 +21,10 @@ interface FeedbackItem {
 }
 
 const TYPE_LABEL: Record<string, string> = {
-  dimension: '💡 新维度',
-  bug: '🐛 Bug',
-  ux: '🎨 体验',
-  other: '📝 其他',
+  dimension: '新维度',
+  bug: 'Bug',
+  ux: '体验',
+  other: '其他',
 };
 
 const STATUS_OPTIONS: { key: FeedbackItem['status']; label: string; cls: string }[] = [
@@ -126,36 +127,36 @@ export default function FeedbackAdminPage() {
   }, {});
 
   return (
-    <div className="min-h-screen bg-[#F8F9FB] p-4 md:p-8">
-      <div className="max-w-5xl mx-auto space-y-4">
-        <header className="flex items-center justify-between">
-          <div className="flex items-center gap-3 min-w-0">
+    <PageFrame
+      title="用户反馈管理"
+      subtitle="查看、回复、跟进用户提交的建议，形成从问题发现到处理闭环的运营后台。"
+      icon={Inbox}
+      eyebrow="FEEDBACK OPS"
+      meta={`当前 ${items.length} 条反馈`}
+      actions={(
+        <div className="flex items-center gap-2">
             <button
               onClick={() => {
                 // 优先 history.back（来自 SPA 内部跳转）；否则回到主页
                 if (window.history.length > 1) window.history.back();
                 else { window.location.hash = '#mileage'; }
               }}
-              className="w-9 h-9 rounded-xl bg-white border border-slate-100 hover:border-blue-200 hover:bg-blue-50 hover:text-blue-600 text-slate-500 flex items-center justify-center transition-colors flex-shrink-0"
+              className="flex h-9 w-9 items-center justify-center rounded-xl border border-slate-100 bg-white text-slate-500 transition-colors hover:border-blue-200 hover:bg-blue-50 hover:text-blue-600"
               title="返回"
             >
               <ArrowLeft size={16} />
             </button>
-            <div className="w-10 h-10 rounded-xl bg-gradient-to-br from-blue-500 to-cyan-400 flex items-center justify-center flex-shrink-0">
-              <Inbox size={18} className="text-white" />
-            </div>
-            <div className="min-w-0">
-              <h1 className="text-lg font-black text-slate-900 leading-tight">用户反馈管理</h1>
-              <p className="text-[11px] font-bold text-slate-400">查看、回复、跟进用户提交的建议</p>
-            </div>
-          </div>
-          <button onClick={reload} className="p-2 text-slate-400 hover:text-blue-500 flex-shrink-0" title="刷新">
+          <button onClick={reload} className="flex h-9 w-9 items-center justify-center rounded-xl bg-slate-900 text-white shadow-sm transition-colors hover:bg-slate-800" title="刷新">
             <RotateCcw size={16} className={loading ? 'animate-spin' : ''} />
           </button>
-        </header>
+        </div>
+      )}
+      maxWidth="max-w-5xl"
+    >
 
         {/* 状态过滤 */}
-        <div className="bg-white rounded-2xl border border-slate-100 shadow-sm p-2 flex items-center gap-1 overflow-x-auto">
+        <SurfaceCard className="p-2">
+        <div className="flex items-center gap-1 overflow-x-auto">
           <button
             onClick={() => setStatusFilter('')}
             className={`px-3 py-1.5 rounded-lg text-[11px] font-bold whitespace-nowrap ${statusFilter === '' ? 'bg-blue-50 text-blue-600' : 'text-slate-500 hover:bg-slate-50'}`}
@@ -170,6 +171,7 @@ export default function FeedbackAdminPage() {
             </button>
           ))}
         </div>
+        </SurfaceCard>
 
         {error && (
           <div className="bg-rose-50 border border-rose-100 rounded-xl p-3 flex items-center gap-2 text-[12px] font-bold text-rose-600">
@@ -192,9 +194,9 @@ export default function FeedbackAdminPage() {
         {/* 列表 */}
         <div className="space-y-2">
           {loading && items.length === 0 ? (
-            <div className="bg-white rounded-2xl p-10 text-center text-slate-300 text-[12px] font-bold">加载中…</div>
+            <LoadingState label="正在加载用户反馈" />
           ) : items.length === 0 ? (
-            <div className="bg-white rounded-2xl p-10 text-center text-slate-300 text-[12px] font-bold">还没有反馈</div>
+            <EmptyState title="还没有反馈" description="新的用户反馈会出现在这里" />
           ) : items.map(it => {
             const shots = parseScreenshots(it.screenshots);
             const statusOpt = STATUS_OPTIONS.find(o => o.key === it.status);
@@ -218,7 +220,7 @@ export default function FeedbackAdminPage() {
                 {(shots.length > 0 || it.contact) && (
                   <div className="flex items-center gap-3 mt-2 text-[10px] text-slate-400 font-bold">
                     {shots.length > 0 && <span className="flex items-center gap-0.5"><ImageIcon size={11} />{shots.length} 张</span>}
-                    {it.contact && <span>📞 {it.contact}</span>}
+                    {it.contact && <span>联系 {it.contact}</span>}
                   </div>
                 )}
                 {it.reply_content && (
@@ -236,8 +238,6 @@ export default function FeedbackAdminPage() {
             );
           })}
         </div>
-      </div>
-
       {/* 详情 / 回复弹窗 */}
       <AnimatePresence>
         {active && (
@@ -336,6 +336,6 @@ export default function FeedbackAdminPage() {
           </motion.div>
         )}
       </AnimatePresence>
-    </div>
+    </PageFrame>
   );
 }