Compare commits

..

2 Commits

Author SHA1 Message Date
fc778e9de6 feat(user): 优化用户信息加载及表单体验
- 新增页面加载状态,加载中显示提示
- 等待 useUser 初始化完成后再加载用户数据
- 添加获取数据字典和用户信息的异常处理及错误提示
- 同步更新备注信息表单控件,修正校验提示文案
- 修正备注信息输入框的name属性,确保表单数据绑定正确
2026-04-29 17:07:14 +08:00
0ae33997ee feat(user): 优化用户信息加载及表单体验
- 新增页面加载状态,加载中显示提示
- 等待 useUser 初始化完成后再加载用户数据
- 添加获取数据字典和用户信息的异常处理及错误提示
- 同步更新备注信息表单控件,修正校验提示文案
- 修正备注信息输入框的name属性,确保表单数据绑定正确
2026-04-29 16:48:05 +08:00

View File

@@ -3,6 +3,7 @@ import {ArrowRight} from '@nutui/icons-react-taro'
import {useEffect, useState} from "react"; import {useEffect, useState} from "react";
import {ConfigProvider} from '@nutui/nutui-react-taro' import {ConfigProvider} from '@nutui/nutui-react-taro'
import Taro, {getCurrentInstance} from '@tarojs/taro' import Taro, {getCurrentInstance} from '@tarojs/taro'
import {View, Text} from '@tarojs/components'
import {getUserInfo} from "@/api/layout"; import {getUserInfo} from "@/api/layout";
import {TenantId} from "@/config/app"; import {TenantId} from "@/config/app";
import { TextArea } from '@nutui/nutui-react-taro' import { TextArea } from '@nutui/nutui-react-taro'
@@ -34,7 +35,7 @@ interface InputEvent {
} }
function Profile() { function Profile() {
const formId = Number(router?.params.id) const formId = Number(router?.params.id)
const {user, updateUser} = useUser() const {user, updateUser, loading} = useUser()
const [sex, setSex] = useState<DictData[]>() const [sex, setSex] = useState<DictData[]>()
const [FormData, setFormData] = useState<User>( const [FormData, setFormData] = useState<User>(
@@ -49,16 +50,27 @@ function Profile() {
comments: undefined comments: undefined
} }
) )
const [pageLoading, setPageLoading] = useState(true)
const reload = () => { const reload = () => {
// 获取数据字典 // 获取数据字典
pageDictData({limit: 200}).then(res => { pageDictData({limit: 200}).then(res => {
setSex(res?.list.filter((item) => item.dictCode === 'sex')) setSex(res?.list.filter((item) => item.dictCode === 'sex'))
}).catch(err => {
console.error('获取数据字典失败:', err)
}) })
// 获取用户信息 // 获取用户信息
getUserInfo().then((data) => { getUserInfo().then((data) => {
// 更新表单数据 // 更新表单数据
setFormData(data); setFormData(data);
}).catch(err => {
console.error('获取用户信息失败:', err)
Taro.showToast({
title: '获取用户信息失败',
icon: 'none'
})
}).finally(() => {
setPageLoading(false)
}) })
} }
@@ -140,9 +152,12 @@ function Profile() {
}); });
} }
// 等待 useUser 初始化完成后再加载数据
useEffect(() => { useEffect(() => {
reload() if (!loading) {
}, []); reload()
}
}, [loading]);
// 监听 useUser hook 中的用户信息变化,同步更新表单数据 // 监听 useUser hook 中的用户信息变化,同步更新表单数据
useEffect(() => { useEffect(() => {
@@ -151,6 +166,15 @@ function Profile() {
} }
}, [user]); }, [user]);
// 加载中显示
if (loading || pageLoading) {
return (
<View className={'flex justify-center items-center h-screen'}>
<Text>...</Text>
</View>
)
}
return ( return (
<> <>
<div className={'p-4'}> <div className={'p-4'}>
@@ -223,14 +247,14 @@ function Profile() {
label="备注信息" label="备注信息"
name="comments" name="comments"
initialValue={FormData.comments} initialValue={FormData.comments}
rules={[{message: '备注信息'}]} rules={[{message: '请输入备注信息'}]}
> >
<TextArea <TextArea
placeholder={'个性签名'} name="comments"
value={FormData?.comments} placeholder={'个性签名'}
onChange={(value) => setFormData({...FormData, comments: value})} value={FormData?.comments}
/> onChange={(value) => setFormData({...FormData, comments: value})}
<Input placeholder={'个性签名'} /> />
</Form.Item> </Form.Item>
</Form> </Form>
</ConfigProvider> </ConfigProvider>