Explorar o código

feat: 右上角用户信息使用当前用户的昵称

NeeDaye hai 6 meses
pai
achega
51c9814d47

+ 9 - 4
src/layouts/index.tsx

@@ -2,10 +2,11 @@ import { CollaspedType } from '@/types/LayoutType';
 import { Outlet, useModel } from '@umijs/max';
 import {Avatar, Layout, Popover} from 'antd';
 import { Header } from 'antd/es/layout/layout';
-import React, {useState} from 'react';
+import React, { useEffect, useState } from 'react';
 import SideMenu from './SideMenu';
 import UserPopover from './UserPopContent';
 import './styles/index.less';
+import { UserInfoType } from '@/types/UserType';
 const { Sider, Content } = Layout;
 
 const contentStyle: React.CSSProperties = {
@@ -29,7 +30,11 @@ const layoutStyle = {
 
 const App: React.FC = () => {
   const [menuWidth] = useState(CollaspedType.OPEN);
-  const { userInfo } = useModel('global');
+  const [userInfo, setUserInfo] = useState<UserInfoType>({ expertName: '', expertId: ''});
+
+  useEffect(() => {
+    setUserInfo(JSON.parse(localStorage.getItem('userInfo') || '{}'))
+  }, []);
   return (
     <Layout style={layoutStyle}>
       <Sider theme="light" width={menuWidth} style={siderStyle}>
@@ -43,9 +48,9 @@ const App: React.FC = () => {
           <Popover placement="bottom" content={<UserPopover />}>
             <div className="header-user">
               <Avatar style={{ backgroundColor: '#fde3cf', color: '#f56a00' }}>
-                {userInfo.realName.charAt(0)}
+                {userInfo.expertName.charAt(0)}
               </Avatar>
-              <span className="header-user-name"> {userInfo.realName}</span>
+              <span className="header-user-name"> {userInfo.expertName}</span>
             </div>
           </Popover>
         </Header>

+ 2 - 5
src/models/global.ts

@@ -5,11 +5,8 @@ import { useState } from 'react';
 
 const useUser = () => {
   const [name, setName] = useState<string>(DEFAULT_NAME);
-  const userDataTemp = <UserInfoType>{
-    username: 'mx',
-    realName: '谢先生',
-    phoneNumber: '17347315117'
-  };
+  const user = JSON.parse(localStorage.getItem('userInfo') || '{}');
+  const userDataTemp = <UserInfoType>user
   const [userInfo, setUserInfo] = useState<UserInfoType>(userDataTemp);
   return {
     name,

+ 1 - 0
src/pages/LoginCallback/index.tsx

@@ -16,6 +16,7 @@ const LoginPage: React.FC = () => {
       const data = await LoginController.login({ sessionId: searchParams.get('sessionId') || '' });
       if (data.code === 200) {
         localStorage.setItem('token', data.data.accessToken as string)
+        localStorage.setItem('userInfo', JSON.stringify(data.data.userInfo))
         navigate('/');
       }
     }

+ 0 - 1
src/pages/Play/components/SinglePlayer.tsx

@@ -68,7 +68,6 @@ const SyncVideoPlayer: React.FC<SyncVideoPlayerProps> = ({
   };
 
   const handleSeek = (e: React.ChangeEvent<HTMLInputElement>) => {
-    console.log(e.currentTarget.value);
     const newTime = parseFloat(e.target.value);
     setCurrentTime(newTime);
     syncMedia(newTime);

+ 2 - 4
src/types/UserType.ts

@@ -2,8 +2,6 @@
  * 定义用户信息类型
  */
 export type UserInfoType  = {
-    username: string;
-    realName: string;
-    phoneNumber: string;
-    avatar: string;
+  expertId: string;
+  expertName: string;
 }