feat: add change user-config

src/pages/user/edit/Profile.tsx

@@ -1,4 +1,4 @@
-import { TextField } from '@mui/material';
+import { InputAdornment, TextField, Tooltip } from '@mui/material';
 import { useForm, Controller } from 'react-hook-form';
 import { Button } from '@mui/material';
 import { useUserStore } from '../store';
@@ -10,6 +10,8 @@ import UploadOutlined from '@ant-design/icons/UploadOutlined';
 import PandaPNG from '@/assets/panda.png';
 import { FileUpload } from '../module/FileUpload';
 import { useTranslation } from 'react-i18next';
+import { Edit } from 'lucide-react';
+import { toast } from 'react-toastify';
 
 export const Profile = () => {
   const { t } = useTranslation();
@@ -73,7 +75,7 @@ export const Profile = () => {
     }
   };
   return (
-    <div className='w-full h-full bg-amber-50 p-4 '>
+    <div className='w-full h-full bg-amber-50 p-4 text-primary'>
       <div className=' shadow-lg p-4 bg-white rounded-lg'>
         <div className='text-2xl'>{t('Profile')}</div>
         <div className='text-sm text-secondary'>{t('Edit your profile')}</div>
@@ -87,7 +89,38 @@ export const Profile = () => {
               <Controller
                 name='username'
                 control={control}
-                render={({ field }) => <TextField {...field} label={t('Name')} className='w-full border rounded-lg p-2' disabled />}
+                render={({ field }) => (
+                  <TextField
+                    {...field}
+                    label={t('Name')}
+                    className='w-full border rounded-lg p-2'
+                    disabled
+                    slotProps={{
+                      input: {
+                        endAdornment: (
+                          <Tooltip title={t('Apply Change Name')}>
+                            <InputAdornment position='end'>
+                              <Edit
+                                className='w-4 h-4 cursor-pointer text-primary'
+                                onClick={() => {
+                                  console.log('onClick edit');
+                                  toast.info('联系客服修改，因为名称和上传文件绑定了。', {
+                                    autoClose: 20000,
+                                  });
+                                }}
+                              />
+                            </InputAdornment>
+                          </Tooltip>
+                        ),
+                        onKeyDown: (event) => {
+                          if (event.key === 'Enter') {
+                            // setSearch(field.value);
+                          }
+                        },
+                      },
+                    }}
+                  />
+                )}
               />
               <Controller
                 name='avatar'