Browse Source

```

feat(components): 调整 QRLoginButton 默认属性并优化用户卡片布局

- 修改 QRLoginButton 组件的默认 type 为 'default',size为 'small'
- 在 UserCard 组件中注释掉 QRLoginButton 的引入和使用- 使用 Space 组件优化用户卡片中的按钮布局
- 替换原有条件渲染逻辑,统一使用按钮展示“扫码核销”功能
- 样式微调与代码格式化```
master
科技小王子 7 days ago
parent
commit
92bd00ea44
  1. 4
      src/components/QRLoginButton.tsx
  2. 1
      src/pages/index/Header.tsx
  3. 42
      src/pages/user/components/UserCard.tsx
  4. 5
      src/pages/user/components/UserGrid.tsx

4
src/components/QRLoginButton.tsx

@ -28,8 +28,8 @@ export interface QRLoginButtonProps {
*
*/
const QRLoginButton: React.FC<QRLoginButtonProps> = ({
type = 'primary',
size = 'normal',
type = 'default',
size = 'small',
text = '扫码登录',
showIcon = true,
onSuccess,

1
src/pages/index/Header.tsx

@ -207,6 +207,7 @@ const Header = (props: any) => {
<TriangleDown className={'text-white'} size={9}/>
</View>
)}>
{/*<QRLoginButton />*/}
</NavBar>
</>
)

42
src/pages/user/components/UserCard.tsx

@ -1,8 +1,8 @@
import {Button} from '@nutui/nutui-react-taro'
import {Avatar, Tag} from '@nutui/nutui-react-taro'
import {Avatar, Tag, Space} from '@nutui/nutui-react-taro'
import {View, Text, Image} from '@tarojs/components'
import {Scan} from '@nutui/icons-react-taro';
import {getUserInfo, getWxOpenId} from '@/api/layout';
import {Scan} from '@nutui/icons-react-taro';
import Taro from '@tarojs/taro';
import {useEffect, useState, forwardRef, useImperativeHandle} from "react";
import {User} from "@/api/system/user/model";
@ -11,7 +11,7 @@ import {TenantId} from "@/config/app";
import {useUser} from "@/hooks/useUser";
import {useUserData} from "@/hooks/useUserData";
import {getStoredInviteParams} from "@/utils/invite";
import QRLoginButton from "@/components/QRLoginButton";
// import QRLoginButton from "@/components/QRLoginButton";
const UserCard = forwardRef<any, any>((_, ref) => {
const {
@ -185,10 +185,14 @@ const UserCard = forwardRef<any, any>((_, ref) => {
<View className={'flex items-center mx-4'}>
{
IsLogin ? (
<Avatar size="large" src={userInfo?.avatar || 'https://oss.wsdns.cn/20250623/62f830b85edb4a7293b8948c25e6f987.jpeg'} shape="round"/>
<Avatar size="large"
src={userInfo?.avatar || 'https://oss.wsdns.cn/20250623/62f830b85edb4a7293b8948c25e6f987.jpeg'}
shape="round"/>
) : (
<Button className={'text-black'} open-type="getPhoneNumber" onGetPhoneNumber={handleGetPhoneNumber}>
<Avatar size="large" src={userInfo?.avatar || 'https://oss.wsdns.cn/20250623/62f830b85edb4a7293b8948c25e6f987.jpeg'} shape="round"/>
<Avatar size="large"
src={userInfo?.avatar || 'https://oss.wsdns.cn/20250623/62f830b85edb4a7293b8948c25e6f987.jpeg'}
shape="round"/>
</Button>
)
}
@ -205,11 +209,25 @@ const UserCard = forwardRef<any, any>((_, ref) => {
) : ''}
</View>
</View>
{userInfo?.userId === 33738 &&
<QRLoginButton />
}
{isAdmin() &&
<Scan className={'text-gray-900'} size={24} onClick={() => navTo('/user/store/verification', true)}/>}
<Space style={{
marginTop: '30px',
marginRight: '10px'
}}>
{/*{userInfo?.userId === 33738 &&*/}
{/* <QRLoginButton/>*/}
{/*}*/}
{!isAdmin() &&
<Button
size={'small'}
onClick={() => navTo('/user/store/verification', true)}
>
<View className="flex items-center justify-center">
<Scan className="mr-1" />
</View>
</Button>
}
</Space>
</View>
<View className={'flex justify-around mt-1'}>
<View className={'item flex justify-center flex-col items-center'}
@ -238,14 +256,14 @@ const UserCard = forwardRef<any, any>((_, ref) => {
<View
className="absolute top-0 right-0 overflow-hidden"
style={{
borderRadius:"0 0.75rem 0 0"
borderRadius: "0 0.75rem 0 0"
}}
onClick={() => navTo('/user/profile/profile', true)}
>
<Image
src="https://oss.wsdns.cn/20250913/7c3de38b377344b89131aba40214f63f.png"
style={{
width:"200rpx"
width: "200rpx"
}}
mode="widthFix"
/>

5
src/pages/user/components/UserGrid.tsx

@ -11,7 +11,8 @@ import {
People,
AfterSaleService,
Logout,
ShoppingAdd, ShoppingRemove, Service
ShoppingAdd,
Service
} from '@nutui/icons-react-taro'
import {useUser} from "@/hooks/useUser";
@ -102,7 +103,7 @@ const UserCell = () => {
</View>
</Grid.Item>
<Grid.Item text={'管理中心'} onClick={() => navTo('/admin/index', true)}>
<Grid.Item text={'扫码登录'} onClick={() => navTo('/admin/index', true)}>
<View className="text-center">
<View className="w-12 h-12 bg-red-50 rounded-xl flex items-center justify-center mx-auto mb-2">
<AfterSaleService className={'text-red-500'} size="20"/>

Loading…
Cancel
Save