Explorar el Código

✨ feat(profile): 移动用户统计卡片到个人中心页面

- 从首页移除UserStatsCard组件及其骨架屏
- 在个人中心页面添加UserStatsCard组件
- 引入useHomeData hook获取用户统计数据
- 添加个人中心页面加载状态骨架屏

✨ refactor(home): 移除首页用户统计相关代码

- 删除首页用户统计卡片渲染代码
- 移除首页用户统计骨架屏
- 添加代码注释说明功能已移动到个人中心
yourname hace 8 meses
padre
commit
6c42bcd42a
Se han modificado 2 ficheros con 42 adiciones y 7 borrados
  1. 2 7
      src/client/mobile/pages/HomePage.tsx
  2. 40 0
      src/client/mobile/pages/ProfilePage.tsx

+ 2 - 7
src/client/mobile/pages/HomePage.tsx

@@ -125,7 +125,6 @@ const HomeContent: React.FC = () => {
         <HeaderSkeleton />
         <div className="p-4 space-y-4">
           <BannerSkeleton />
-          {user && <UserStatsSkeleton />}
           <CategorySkeleton />
           <ListItemSkeleton count={3} />
           <ListItemSkeleton count={4} />
@@ -213,12 +212,8 @@ const HomeContent: React.FC = () => {
           </div>
         )}
 
-        {/* 用户统计 */}
-        {user && homeData.userStats && (
-          <div className="px-4 mt-2">
-            <UserStatsCard stats={homeData.userStats} />
-          </div>
-        )}
+        {/* 用户统计 - 已移动到个人中心 */}
+        
 
         {/* 服务分类 */}
         <div className="bg-white mt-2 p-4">

+ 40 - 0
src/client/mobile/pages/ProfilePage.tsx

@@ -4,6 +4,8 @@ import { useNavigate } from 'react-router-dom';
 import { userPreferenceClient } from '@/client/api';
 import { FontSizeType } from '@/server/modules/silver-users/user-preference.entity';
 import { App, Card, Button } from 'antd';
+import { useHomeData } from '../hooks/useHomeData';
+import { UserStatsCard } from '../components/UserStatsCard';
 
 const fontSizeOptions = [
   { value: FontSizeType.SMALL, label: '小' },
@@ -20,6 +22,9 @@ const ProfilePage: React.FC = () => {
   const [loading, setLoading] = useState(false);
   const [preferenceId, setPreferenceId] = useState<number | null>(null);
 
+  // 获取首页数据用于显示用户统计
+  const { data: homeData, isLoading } = useHomeData();
+
   useEffect(() => {
     if (user) {
       loadUserPreference();
@@ -27,6 +32,8 @@ const ProfilePage: React.FC = () => {
   }, [user]);
 
   const loadUserPreference = async () => {
+    if (!user) return;
+    
     try {
       const response = await (userPreferenceClient as any).$get({
         query: { filters: JSON.stringify({ userId: user.id }) }
@@ -114,8 +121,41 @@ const ProfilePage: React.FC = () => {
     );
   }
 
+  if (isLoading) {
+    return (
+      <div className="min-h-screen bg-gray-50 p-4">
+        <div className="bg-white rounded-lg shadow p-6 mb-4 animate-pulse">
+          <div className="flex items-center">
+            <div className="w-16 h-16 bg-gray-300 rounded-full"></div>
+            <div className="ml-4 flex-1">
+              <div className="h-6 bg-gray-300 rounded w-32 mb-2"></div>
+              <div className="h-4 bg-gray-300 rounded w-48"></div>
+            </div>
+          </div>
+        </div>
+        <div className="bg-white rounded-lg shadow p-6 mb-4">
+          <div className="h-6 bg-gray-300 rounded w-24 mb-4"></div>
+          <div className="grid grid-cols-2 gap-4">
+            {Array.from({ length: 4 }).map((_, i) => (
+              <div key={i} className="text-center">
+                <div className="w-12 h-12 bg-gray-300 rounded-full mx-auto mb-2"></div>
+                <div className="h-8 bg-gray-300 rounded w-16 mx-auto mb-1"></div>
+                <div className="h-4 bg-gray-300 rounded w-12 mx-auto"></div>
+              </div>
+            ))}
+          </div>
+        </div>
+      </div>
+    );
+  }
+
   return (
     <div className="min-h-screen bg-gray-50 p-4">
+      {/* 用户数据 - 最前面显示 */}
+      {user && homeData?.userStats && (
+        <UserStatsCard stats={homeData.userStats} />
+      )}
+
       {/* 用户信息卡片 */}
       <div className="bg-white rounded-lg shadow p-6 mb-4">
         <div className="flex items-center">