refactor(user): 重构用户卡片组件并优化登录状态更新逻辑- 重构了 UserCard 组件,统一了前端和后台的实现
- 移除了冗余的数据获取逻辑,统一使用 useUserData Hook - 优化了登录状态更新流程,使用 loginUser 方法统一处理登录 - 添加了登录成功后的提示和页面数据刷新
This commit is contained in:
@@ -2,13 +2,11 @@ import {Button} from '@nutui/nutui-react-taro'
|
||||
import {Avatar, Tag} from '@nutui/nutui-react-taro'
|
||||
import {View, Text} from '@tarojs/components'
|
||||
import {Scan} from '@nutui/icons-react-taro';
|
||||
import {getUserInfo, getWxOpenId} from '@/api/layout';
|
||||
import {getWxOpenId} from '@/api/layout';
|
||||
import Taro from '@tarojs/taro';
|
||||
import {useEffect, useState} from "react";
|
||||
import {User} from "@/api/system/user/model";
|
||||
import {useEffect} from "react";
|
||||
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";
|
||||
|
||||
@@ -22,19 +20,7 @@ function UserCard() {
|
||||
getDisplayName,
|
||||
getRoleName
|
||||
} = useUser();
|
||||
const { data, refresh } = useUserData()
|
||||
const [couponCount, setCouponCount] = useState(0)
|
||||
const [pointsCount, setPointsCount] = useState(0)
|
||||
const [giftCount, setGiftCount] = useState(0)
|
||||
|
||||
// 下拉刷新
|
||||
const handleRefresh = async () => {
|
||||
await refresh()
|
||||
Taro.showToast({
|
||||
title: '刷新成功',
|
||||
icon: 'success'
|
||||
})
|
||||
}
|
||||
const {data} = useUserData()
|
||||
|
||||
useEffect(() => {
|
||||
// Taro.getSetting:获取用户的当前设置。返回值中只会出现小程序已经向用户请求过的权限。
|
||||
@@ -53,32 +39,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 = async () => {
|
||||
// 如果已登录,获取最新用户信息
|
||||
@@ -86,11 +46,6 @@ function UserCard() {
|
||||
try {
|
||||
const data = await fetchUserInfo();
|
||||
if (data) {
|
||||
// 加载用户统计数据
|
||||
if (data.userId) {
|
||||
loadUserStats(data.userId)
|
||||
}
|
||||
|
||||
// 获取openId
|
||||
if (!data.openid) {
|
||||
Taro.login({
|
||||
@@ -142,7 +97,7 @@ function UserCard() {
|
||||
};
|
||||
|
||||
/* 获取用户手机号 */
|
||||
const handleGetPhoneNumber = ({detail}: {detail: {code?: string, encryptedData?: string, iv?: string}}) => {
|
||||
const handleGetPhoneNumber = ({detail}: { detail: { code?: string, encryptedData?: string, iv?: string } }) => {
|
||||
const {code, encryptedData, iv} = detail
|
||||
Taro.login({
|
||||
success: function () {
|
||||
@@ -234,15 +189,15 @@ function UserCard() {
|
||||
) : ''}
|
||||
</View>
|
||||
</View>
|
||||
{isAdmin() && <Scan onClick={() => navTo('/user/store/verification', true)} />}
|
||||
{isAdmin() && <Scan onClick={() => navTo('/user/store/verification', true)}/>}
|
||||
<View className={'mr-4 text-sm px-3 py-1 text-black border-gray-400 border-solid border-2 rounded-3xl'}
|
||||
onClick={() => navTo('/user/profile/profile', true)}>
|
||||
onClick={() => navTo('/user/profile/profile', true)}>
|
||||
{'个人资料'}
|
||||
</View>
|
||||
</View>
|
||||
<View className={'flex justify-around mt-1'}>
|
||||
<View className={'item flex justify-center flex-col items-center'}
|
||||
onClick={() => navTo('/user/wallet/wallet', true)}>
|
||||
onClick={() => navTo('/user/wallet/wallet', true)}>
|
||||
<Text className={'text-sm text-gray-500'}>余额</Text>
|
||||
<Text className={'text-xl'}>{data?.balance || '0.00'}</Text>
|
||||
</View>
|
||||
@@ -251,12 +206,12 @@ function UserCard() {
|
||||
<Text className={'text-xl'}>{data?.points || 0}</Text>
|
||||
</View>
|
||||
<View className={'item flex justify-center flex-col items-center'}
|
||||
onClick={() => navTo('/user/coupon/index', true)}>
|
||||
onClick={() => navTo('/user/coupon/index', true)}>
|
||||
<Text className={'text-sm text-gray-500'}>优惠券</Text>
|
||||
<Text className={'text-xl'}>{data?.coupons || 0}</Text>
|
||||
</View>
|
||||
<View className={'item flex justify-center flex-col items-center'}
|
||||
onClick={() => navTo('/user/gift/index', true)}>
|
||||
onClick={() => navTo('/user/gift/index', true)}>
|
||||
<Text className={'text-sm text-gray-500'}>礼品卡</Text>
|
||||
<Text className={'text-xl'}>{data?.giftCards || 0}</Text>
|
||||
</View>
|
||||
|
||||
Reference in New Issue
Block a user