feat(user): 优化用户信息加载及表单体验
- 新增页面加载状态,加载中显示提示 - 等待 useUser 初始化完成后再加载用户数据 - 添加获取数据字典和用户信息的异常处理及错误提示 - 同步更新备注信息表单控件,修正校验提示文案 - 修正备注信息输入框的name属性,确保表单数据绑定正确
This commit is contained in:
@@ -34,7 +34,7 @@ interface InputEvent {
|
||||
}
|
||||
function Profile() {
|
||||
const formId = Number(router?.params.id)
|
||||
const {user, updateUser} = useUser()
|
||||
const {user, updateUser, loading} = useUser()
|
||||
|
||||
const [sex, setSex] = useState<DictData[]>()
|
||||
const [FormData, setFormData] = useState<User>(
|
||||
@@ -49,16 +49,27 @@ function Profile() {
|
||||
comments: undefined
|
||||
}
|
||||
)
|
||||
const [pageLoading, setPageLoading] = useState(true)
|
||||
|
||||
const reload = () => {
|
||||
// 获取数据字典
|
||||
pageDictData({limit: 200}).then(res => {
|
||||
setSex(res?.list.filter((item) => item.dictCode === 'sex'))
|
||||
}).catch(err => {
|
||||
console.error('获取数据字典失败:', err)
|
||||
})
|
||||
// 获取用户信息
|
||||
getUserInfo().then((data) => {
|
||||
// 更新表单数据
|
||||
setFormData(data);
|
||||
}).catch(err => {
|
||||
console.error('获取用户信息失败:', err)
|
||||
Taro.showToast({
|
||||
title: '获取用户信息失败',
|
||||
icon: 'none'
|
||||
})
|
||||
}).finally(() => {
|
||||
setPageLoading(false)
|
||||
})
|
||||
}
|
||||
|
||||
@@ -140,9 +151,12 @@ function Profile() {
|
||||
});
|
||||
}
|
||||
|
||||
// 等待 useUser 初始化完成后再加载数据
|
||||
useEffect(() => {
|
||||
reload()
|
||||
}, []);
|
||||
if (!loading) {
|
||||
reload()
|
||||
}
|
||||
}, [loading]);
|
||||
|
||||
// 监听 useUser hook 中的用户信息变化,同步更新表单数据
|
||||
useEffect(() => {
|
||||
@@ -151,6 +165,15 @@ function Profile() {
|
||||
}
|
||||
}, [user]);
|
||||
|
||||
// 加载中显示
|
||||
if (loading || pageLoading) {
|
||||
return (
|
||||
<View className={'flex justify-center items-center h-screen'}>
|
||||
<Text>加载中...</Text>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className={'p-4'}>
|
||||
@@ -223,14 +246,14 @@ function Profile() {
|
||||
label="备注信息"
|
||||
name="comments"
|
||||
initialValue={FormData.comments}
|
||||
rules={[{message: '备注信息'}]}
|
||||
rules={[{message: '请输入备注信息'}]}
|
||||
>
|
||||
<TextArea
|
||||
placeholder={'个性签名'}
|
||||
value={FormData?.comments}
|
||||
onChange={(value) => setFormData({...FormData, comments: value})}
|
||||
/>
|
||||
<Input placeholder={'个性签名'} />
|
||||
<TextArea
|
||||
name="comments"
|
||||
placeholder={'个性签名'}
|
||||
value={FormData?.comments}
|
||||
onChange={(value) => setFormData({...FormData, comments: value})}
|
||||
/>
|
||||
</Form.Item>
|
||||
</Form>
|
||||
</ConfigProvider>
|
||||
|
||||
Reference in New Issue
Block a user