Add user manager. Optimize code.

src/pages/Login.tsx

@@ -39,7 +39,7 @@ const Login: React.FC = () => {
                                     description: (
                                         <>
                                             <span>
-                                                你好 <strong>{user.userInfo.nickName}</strong>
+                                                你好 <strong>{user.userInfo.nickname}</strong>
                                             </span>
                                             <br />
                                             <span>

src/pages/ToolsFramework.tsx

@@ -7,6 +7,7 @@ import Sidebar from '@/components/common/sidebar'
 import SidebarItemList from '@/components/common/sidebar/SidebarItemList'
 import SidebarItem from '@/components/common/sidebar/SidebarItem'
 import SidebarSeparate from '@/components/common/sidebar/SidebarSeparate'
+import LoadingMask from '@/components/common/LoadingMask'
 
 const ToolsFramework: React.FC = () => {
     const sidebarScrollRef = useRef<SidebarScrollElement>(null)
@@ -63,7 +64,15 @@ const ToolsFramework: React.FC = () => {
                     </Sidebar>
                 </div>
                 <div className={'right-panel'}>
-                    <Outlet />
+                    <Suspense
+                        fallback={
+                            <>
+                                <LoadingMask />
+                            </>
+                        }
+                    >
+                        <Outlet />
+                    </Suspense>
                 </div>
             </FitFullScreen>
         </>

src/pages/UserFramework.tsx

@@ -5,7 +5,8 @@ import FitFullScreen from '@/components/common/FitFullScreen'
 import Sidebar from '@/components/common/sidebar'
 import SidebarItemList from '@/components/common/sidebar/SidebarItemList'
 import SidebarItem from '@/components/common/sidebar/SidebarItem'
-import { hasPathPermission } from '@/utils/auth.ts'
+import { hasPathPermission } from '@/utils/auth'
+import LoadingMask from '@/components/common/LoadingMask'
 
 const ToolsFramework: React.FC = () => {
     return (
@@ -42,7 +43,15 @@ const ToolsFramework: React.FC = () => {
                     </Sidebar>
                 </div>
                 <div className={'right-panel'}>
-                    <Outlet />
+                    <Suspense
+                        fallback={
+                            <>
+                                <LoadingMask />
+                            </>
+                        }
+                    >
+                        <Outlet />
+                    </Suspense>
                 </div>
             </FitFullScreen>
         </>

src/pages/system/User.tsx

@@ -1,7 +1,50 @@
 import React from 'react'
+import { r_getUserList } from '@/services/user'
+import { COLOR_BACKGROUND, DATABASE_SELECT_SUCCESS } from '@/constants/common.constants'
+import { ColumnsType } from 'antd/es/table/interface'
 
 const User: React.FC = () => {
-    return <></>
+    const [userList, setUserList] = useState<UserWithRoleInfoVo[]>([])
+
+    const tableColumns: ColumnsType<UserWithRoleInfoVo> = [
+        {
+            dataIndex: 'id',
+            title: 'ID'
+        },
+        {
+            dataIndex: ['userInfo', 'avatar'],
+            title: '头像',
+            render: (value) => (
+                <AntdAvatar
+                    src={<img src={`data:image/png;base64,${value}`} alt={'avatar'} />}
+                    style={{ background: COLOR_BACKGROUND }}
+                />
+            )
+        },
+        {
+            dataIndex: 'username',
+            title: '用户名'
+        },
+        {
+            dataIndex: ['userInfo', 'nickname'],
+            title: '昵称'
+        }
+    ]
+
+    useEffect(() => {
+        r_getUserList().then((res) => {
+            const data = res.data
+            if (data.code === DATABASE_SELECT_SUCCESS) {
+                data.data && setUserList(data.data)
+            }
+        })
+    }, [])
+
+    return (
+        <>
+            <AntdTable dataSource={userList} columns={tableColumns} rowKey={'id'} />
+        </>
+    )
 }
 
 export default User