refactor(user): 重构用户页面并添加下拉刷新功能

- 移除了 HeaderWithHook 和 IndexWithHook 组件
- 优化了 UserCard 组件，使用 forwardRef 和 useImperativeHandle暴露刷新方法
- 在 User 页面中添加 PullToRefresh组件实现下拉刷新
-集成了 useUserData 钩子用于刷新用户数据

src/pages/user/components/UserCard.tsx

@@ -4,16 +4,15 @@ import {View, Text} from '@tarojs/components'
 import {Scan} from '@nutui/icons-react-taro';
 import {getUserInfo, getWxOpenId} from '@/api/layout';
 import Taro from '@tarojs/taro';
-import {useEffect, useState} from "react";
+import {useEffect, useState, forwardRef, useImperativeHandle} from "react";
 import {User} from "@/api/system/user/model";
 import navTo from "@/utils/common";
 import {TenantId} from "@/config/app";
-import {getMyAvailableCoupons} from "@/api/shop/shopUserCoupon";
 import {useUser} from "@/hooks/useUser";
 import {useUserData} from "@/hooks/useUserData";
 import {getStoredInviteParams} from "@/utils/invite";
 
-function UserCard() {
+const UserCard = forwardRef<any, any>((_, ref) => {
   const {
     isAdmin
   } = useUser();
@@ -21,9 +20,6 @@ function UserCard() {
   const {getDisplayName, getRoleName} = useUser();
   const [IsLogin, setIsLogin] = useState<boolean>(false)
   const [userInfo, setUserInfo] = useState<User>()
-  const [couponCount, setCouponCount] = useState(0)
-  const [pointsCount, setPointsCount] = useState(0)
-  const [giftCount, setGiftCount] = useState(0)
 
   // 下拉刷新
   const handleRefresh = async () => {
@@ -34,6 +30,11 @@ function UserCard() {
     })
   }
 
+  // 暴露方法给父组件
+  useImperativeHandle(ref, () => ({
+    handleRefresh
+  }))
+
   useEffect(() => {
     // Taro.getSetting：获取用户的当前设置。返回值中只会出现小程序已经向用户请求过的权限。
     Taro.getSetting({
@@ -51,33 +52,6 @@ function UserCard() {
     });
   }, []);
 
-  const loadUserStats = (userId: number) => {
-    // 加载优惠券数量
-    getMyAvailableCoupons()
-      .then((coupons: any) => {
-        setCouponCount(coupons?.length || 0)
-      })
-      .catch((error: any) => {
-        console.error('Coupon count error:', error)
-      })
-
-    // 加载积分数量
-    console.log(userId)
-    setPointsCount(0)
-    // getUserPointsStats(userId)
-    //   .then((res: any) => {
-    //     setPointsCount(res.currentPoints || 0)
-    //   })
-    //   .catch((error: any) => {
-    //     console.error('Points stats error:', error)
-    //   })
-    // 加载礼品劵数量
-    setGiftCount(0)
-    // pageUserGiftLog({userId, page: 1, limit: 1}).then(res => {
-    //   setGiftCount(res.count || 0)
-    // })
-  }
-
   const reload = () => {
     Taro.getUserInfo({
       success: (res) => {
@@ -93,11 +67,6 @@ function UserCard() {
             setIsLogin(true);
             Taro.setStorageSync('UserId', data.userId)
 
-            // 加载用户统计数据
-            if (data.userId) {
-              loadUserStats(data.userId)
-            }
-
             // 获取openId
             if (!data.openid) {
               Taro.login({
@@ -268,6 +237,6 @@ function UserCard() {
     </View>
 
   )
-}
+})
 
 export default UserCard;

src/pages/user/user.tsx

@@ -1,9 +1,11 @@
-import {useEffect} from 'react'
+import {useEffect, useRef} from 'react'
+import {PullToRefresh} from '@nutui/nutui-react-taro'
 import UserCard from "./components/UserCard";
 import UserOrder from "./components/UserOrder";
 import UserCell from "./components/UserCell";
 import UserFooter from "./components/UserFooter";
 import {useUser} from "@/hooks/useUser";
+import {useUserData} from "@/hooks/useUserData";
 import './user.scss'
 import IsDealer from "./components/IsDealer";
 
@@ -12,6 +14,18 @@ function User() {
     isAdmin
   } = useUser();
 
+  const { refresh } = useUserData()
+  const userCardRef = useRef<any>()
+
+  // 下拉刷新处理
+  const handleRefresh = async () => {
+    await refresh()
+    // 如果 UserCard 组件有自己的刷新方法，也可以调用
+    if (userCardRef.current?.handleRefresh) {
+      await userCardRef.current.handleRefresh()
+    }
+  }
+
   useEffect(() => {
   }, []);
 
@@ -19,31 +33,39 @@ function User() {
    * 门店核销管理
    */
   if (isAdmin()) {
-    return <>
-      <div className={'w-full'} style={{
-        background: 'linear-gradient(to bottom, #e9fff2, #f9fafb)'
-      }}>
-        <UserCard/>
-        <UserOrder/>
-        <IsDealer/>
-        <UserCell/>
-        <UserFooter/>
-      </div>
-    </>
+    return (
+      <PullToRefresh
+        onRefresh={handleRefresh}
+        headHeight={60}
+      >
+        <div className={'w-full'} style={{
+          background: 'linear-gradient(to bottom, #e9fff2, #f9fafb)'
+        }}>
+          <UserCard ref={userCardRef}/>
+          <UserOrder/>
+          <IsDealer/>
+          <UserCell/>
+          <UserFooter/>
+        </div>
+      </PullToRefresh>
+    )
   }
 
   return (
-    <>
+    <PullToRefresh
+      onRefresh={handleRefresh}
+      headHeight={60}
+    >
       <div className={'w-full'} style={{
         background: 'linear-gradient(to bottom, #e9fff2, #f9fafb)'
       }}>
-        <UserCard/>
+        <UserCard ref={userCardRef}/>
         <UserOrder/>
         <IsDealer/>
         <UserCell/>
         <UserFooter/>
       </div>
-    </>
+    </PullToRefresh>
   )
 }