developer/template-10582
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(customer): 优化客户数据查询和表单字段校验

Browse Source 
- 移除新增客户页面对手机号的必填和格式校验
- 修改手机号字段标签为“手机号/微信号”，取消必填和长度限制
- 新增判断当前用户是否为超级管理员逻辑
- 抽取并统一构建客户查询参数方法，根据权限动态设置筛选条件
- 优化客户列表数据获取逻辑，支持超级管理员查看全部客户
- 调整依赖项，更新使用了新构建的查询参数函数
- 增强状态统计接口参数构建，统一调用参数生成函数
- 优化副作用 Hook 依赖，保证数据加载时机正确
This commit is contained in:
赵忠林
2026-06-04 15:21:56 +08:00
parent ca4f1c2a77
commit 812df56f8c
10 changed files with 425 additions and 311 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
src/pages/user/components/UserCard.tsx
View File

@@ -151,15 +151,14 @@ function UserCard() {
}
return (
<View className={'header-bg pt-20'}>
<View className={'p-4'}>
<View className={'header-bg'}>
<View className={'user-card-wrap'}>
<View
className={'user-card w-full flex flex-col justify-around rounded-xl shadow-sm'}
className={'w-full flex flex-col justify-around'}
style={{
background: 'linear-gradient(to bottom, #ffffff, #ffffff)', // 这种情况建议使用类名来控制样式（引入外联样式）
// width: '720rpx',
// margin: '10px auto 0px auto',
height: '120px',
height: '124px',
// borderRadius: '22px 22px 0 0',
}}
>
@@ -174,8 +173,8 @@ function UserCard() {
</Button>
)
}
<View className={'user-info flex flex-col px-2'}>
<View className={'py-1 text-black font-bold max-w-28'}>{getDisplayName()}</View>
<View className={'user-info flex flex-col px-3'}>
<View className={'user-card__name py-1 font-bold max-w-28'}>{getDisplayName()}</View>
{isLoggedIn ? (
<View className={'grade text-xs py-0'}>
<Tag type="success">{getRoleName()}</Tag>
@@ -184,8 +183,8 @@ function UserCard() {
</View>
</View>
<View className={'gap-2 flex items-center'}>
{isAdmin() && <Scan className={'text-gray-900'} size={24} 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'}
{isAdmin() && <Scan className={'user-card__scan'} size={24} onClick={() => navTo('/user/store/verification', true)} />}
<View className={'user-card__profile mr-4 text-sm px-3 py-1'}
onClick={() => navTo('/user/profile/profile', true)}>
{'个人资料'}
</View>

129
src/pages/user/components/UserCell.tsx
View File

@@ -2,7 +2,7 @@ import {Cell} from '@nutui/nutui-react-taro'
import navTo from "@/utils/common";
import Taro from '@tarojs/taro'
import {View, Text} from '@tarojs/components'
import {ArrowRight, LogisticsError, Tips, Ask} from '@nutui/icons-react-taro'
import {ArrowRight, LogisticsError} from '@nutui/icons-react-taro'
import {useUser} from '@/hooks/useUser'
const UserCell = () => {
@@ -26,13 +26,36 @@ const UserCell = () => {
return (
<>
<View className={'px-4'}>
<View className={'p-4'}>
<Cell.Group divider={true} description={
<View style={{display: 'inline-flex', alignItems: 'center'}}>
<Text style={{marginTop: '12px'}}>我的服务</Text>
</View>
}>
<Cell.Group divider={true}>
<Cell
className="nutui-cell-clickable"
title="后台管理"
align="center"
extra={<ArrowRight color="#cccccc" size={18}/>}
onClick={() => Taro.reLaunch({url: '/pages/index/index'})}
/>
</Cell.Group>
<Cell.Group divider={true}>
<Cell
className="nutui-cell-clickable"
title="个人资料"
align="center"
extra={<ArrowRight color="#cccccc" size={18}/>}
onClick={() => navTo('/user/profile/profile', true)}
/>
</Cell.Group>
<Cell.Group divider={true}>
<Cell
className="nutui-cell-clickable"
title="退出登录"
align="center"
extra={<ArrowRight color="#cccccc" size={18}/>}
onClick={onLogout}
/>
</Cell.Group>
<Cell
className="nutui-cell-clickable"
style={{
@@ -81,62 +104,42 @@ const UserCell = () => {
{/* navTo('/user/userVerify/index', true)*/}
{/* }}*/}
{/*/>*/}
<Cell
className="nutui-cell-clickable"
title={
<View style={{display: 'inline-flex', alignItems: 'center'}}>
<Ask size={16}/>
<Text className={'pl-3 text-sm'}>常见问题</Text>
</View>
}
align="center"
extra={<ArrowRight color="#cccccc" size={18}/>}
onClick={() => {
navTo('/user/help/index')
}}
/>
<Cell
className="nutui-cell-clickable"
title={
<View style={{display: 'inline-flex', alignItems: 'center'}}>
<Tips size={16}/>
<Text className={'pl-3 text-sm'}>关于我们</Text>
</View>
}
align="center"
extra={<ArrowRight color="#cccccc" size={18}/>}
onClick={() => {
navTo('/user/about/index')
}}
/>
</Cell.Group>
<Cell.Group divider={true} description={
<View style={{display: 'inline-flex', alignItems: 'center'}}>
<Text style={{marginTop: '12px'}}>账号管理</Text>
</View>
}>
<Cell
className="nutui-cell-clickable"
title="个人资料"
align="center"
extra={<ArrowRight color="#cccccc" size={18}/>}
onClick={() => navTo('/user/profile/profile', true)}
/>
<Cell
className="nutui-cell-clickable"
title="返回首页"
align="center"
extra={<ArrowRight color="#cccccc" size={18}/>}
onClick={() => Taro.reLaunch({url: '/pages/index/index'})}
/>
<Cell
className="nutui-cell-clickable"
title="退出登录"
align="center"
extra={<ArrowRight color="#cccccc" size={18}/>}
onClick={onLogout}
/>
</Cell.Group>
{/* <Cell*/}
{/* className="nutui-cell-clickable"*/}
{/* title={*/}
{/* <View style={{display: 'inline-flex', alignItems: 'center'}}>*/}
{/* <Ask size={16}/>*/}
{/* <Text className={'pl-3 text-sm'}>常见问题</Text>*/}
{/* </View>*/}
{/* }*/}
{/* align="center"*/}
{/* extra={<ArrowRight color="#cccccc" size={18}/>}*/}
{/* onClick={() => {*/}
{/* navTo('/user/help/index')*/}
{/* }}*/}
{/* />*/}
{/* <Cell*/}
{/* className="nutui-cell-clickable"*/}
{/* title={*/}
{/* <View style={{display: 'inline-flex', alignItems: 'center'}}>*/}
{/* <Tips size={16}/>*/}
{/* <Text className={'pl-3 text-sm'}>关于我们</Text>*/}
{/* </View>*/}
{/* }*/}
{/* align="center"*/}
{/* extra={<ArrowRight color="#cccccc" size={18}/>}*/}
{/* onClick={() => {*/}
{/* navTo('/user/about/index')*/}
{/* }}*/}
{/* />*/}
{/*</Cell.Group>*/}
{/*<Cell.Group divider={true} description={*/}
{/* <View style={{display: 'inline-flex', alignItems: 'center'}}>*/}
{/* <Text style={{marginTop: '12px'}}>账号管理</Text>*/}
{/* </View>*/}
{/*}>*/}
{/*</Cell.Group>*/}
</View>
</>
)

2
src/pages/user/components/UserFooter.tsx
View File

@@ -46,7 +46,7 @@ const UserFooter = () => {
return (
<>
<div className={'text-center py-4 w-full text-gray-300'} onClick={onLoginByPhone}>
<div className={'text-center py-4 w-full text-gray-300 fixed bottom-2'} onClick={onLoginByPhone}>
<div className={'text-xs text-gray-400 py-1'}>当前版本：{Version}</div>
<div className={'text-xs text-gray-400 py-1'}>Copyright © { new Date().getFullYear() } {Copyright}</div>
</div>

1
src/pages/user/user.config.ts
View File

@@ -1,5 +1,4 @@
export default definePageConfig({
navigationBarTitleText: '我的',
navigationStyle: 'custom',
navigationBarBackgroundColor: '#e9fff2'
})

75
src/pages/user/user.scss
View File

@@ -1,4 +1,73 @@
.header-bg{
background: url('https://oss.wsdns.cn/20250621/edb5d4da976b4d97ba185cb7077d2858.jpg') no-repeat top center;
background-size: 100%;
.user-page {
min-height: 100vh;
background: linear-gradient(180deg, #f2fbf6 0%, #f8fbff 38%, #f9fafb 100%);
}
.header-bg {
position: relative;
overflow: hidden;
padding-top: 12px;
background:
linear-gradient(90deg, rgba(34, 197, 94, 0.14) 0%, rgba(56, 189, 248, 0.12) 52%, rgba(245, 158, 11, 0.08) 100%),
linear-gradient(135deg, #e8f8ef 0%, #eef7ff 58%, #f9fafb 100%);
}
.header-bg::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
height: 4px;
background: linear-gradient(90deg, #22c55e 0%, #38bdf8 55%, #f59e0b 100%);
}
.user-card-wrap {
position: relative;
z-index: 1;
padding: 16px;
}
.user-card {
border: 1px solid rgba(148, 163, 184, 0.18);
border-radius: 18px !important;
background: linear-gradient(135deg, rgba(255, 255, 255, 0.98) 0%, rgba(247, 252, 255, 0.94) 100%);
box-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
}
.user-card-header {
height: 100%;
padding-top: 0 !important;
}
.user-card .nut-avatar {
border: 3px solid rgba(255, 255, 255, 0.94);
box-shadow: 0 8px 18px rgba(15, 23, 42, 0.12);
}
.user-card__name {
max-width: 150px;
overflow: hidden;
color: #0f172a;
text-overflow: ellipsis;
white-space: nowrap;
}
.user-card__profile {
border: 1px solid rgba(15, 118, 110, 0.22);
border-radius: 999px;
background: #ecfdf5;
color: #0f766e;
white-space: nowrap;
}
.user-card__scan {
padding: 6px;
border-radius: 999px;
background: #ecfeff;
color: #0f766e;
}
.grade .nut-tag {
border-radius: 999px;
}

78
src/pages/user/user.tsx
View File

@@ -1,26 +1,26 @@
import {useEffect, useState} from 'react'
import Taro from '@tarojs/taro';
import {useEffect} from 'react'
// import Taro from '@tarojs/taro';
import UserCard from "./components/UserCard";
import UserOrder from "./components/UserOrder";
// import UserOrder from "./components/UserOrder";
import UserCell from "./components/UserCell";
import UserFooter from "./components/UserFooter";
import {useUser} from "@/hooks/useUser";
import {NavBar} from '@nutui/nutui-react-taro';
import {Home} from '@nutui/icons-react-taro'
import './user.scss'
// import {NavBar} from '@nutui/nutui-react-taro';
// import {Home} from '@nutui/icons-react-taro';
import './user.scss';
function User() {
const [statusBarHeight, setStatusBarHeight] = useState<number>()
// const [statusBarHeight, setStatusBarHeight] = useState<number>()
const {
isAdmin
} = useUser();
useEffect(() => {
Taro.getSystemInfo({
success: (res) => {
setStatusBarHeight(res.statusBarHeight)
},
})
// Taro.getSystemInfo({
// success: (res) => {
// setStatusBarHeight(res.statusBarHeight)
// },
// })
}, []);
/**
@@ -28,11 +28,9 @@ function User() {
*/
if (isAdmin()) {
return <>
<div className={'w-full'} style={{
background: 'linear-gradient(to bottom, #e9fff2, #f9fafb)'
}}>
<div className={'user-page w-full'}>
<UserCard/>
<UserOrder/>
{/*<UserOrder/>*/}
<UserCell/>
<UserFooter/>
</div>
@@ -41,31 +39,29 @@ function User() {
return (
<>
<NavBar
fixed={true}
style={{marginTop: `${statusBarHeight}px`, backgroundColor: 'transparent'}}
onBackClick={() => {
}}
left={
<div style={{
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
width: '30px',
height: '30px',
backgroundColor: 'white',
textAlign: 'center',
borderRadius: '50%',
}}>
<Home size={15} onClick={() => Taro.reLaunch({url: '/pages/index/index'})} style={{color: 'black', marginBottom: '1px'}} />
</div>
}
>
<span>我的</span>
</NavBar>
<div className={'w-full'} style={{
background: 'linear-gradient(to bottom, #e9fff2, #f9fafb)'
}}>
{/*<NavBar*/}
{/* fixed={true}*/}
{/* style={{marginTop: `${statusBarHeight}px`, backgroundColor: 'transparent'}}*/}
{/* onBackClick={() => {*/}
{/* }}*/}
{/* left={*/}
{/* <div style={{*/}
{/* display: 'flex',*/}
{/* alignItems: 'center',*/}
{/* justifyContent: 'center',*/}
{/* width: '30px',*/}
{/* height: '30px',*/}
{/* backgroundColor: 'white',*/}
{/* textAlign: 'center',*/}
{/* borderRadius: '50%',*/}
{/* }}>*/}
{/* <Home size={15} onClick={() => Taro.reLaunch({url: '/pages/index/index'})} style={{color: 'black', marginBottom: '1px'}} />*/}
{/* </div>*/}
{/* }*/}
{/*>*/}
{/* <span>我的</span>*/}
{/*</NavBar>*/}
<div className={'user-page w-full'}>
<UserCard/>
{/*<UserOrder/>*/}
<UserCell/>