feat: 登录名展示

src/components/GlobalHeader/AvatarDropdown.js

@@ -10,7 +10,7 @@ import connectHistoryHoc from '@/containers/connectHistoryHoc';
 class AvatarDropdown extends React.Component {
   /* eslint-disable no-unused-vars */
   onMenuClick = event => {
-    const { logout, history } = this.props;
+    const { logout, history, loginName } = this.props;
     switch (event.key) {
       case 'logout':
         setAuthority([]);
@@ -24,9 +24,10 @@ class AvatarDropdown extends React.Component {
 
   render() {
     const {
+      loginName,
       currentUser = {
         avatar: logo,
-        name: '测试人员',
+        name: '',
       },
     } = this.props;
     const menuHeaderDropdown = (
@@ -55,7 +56,7 @@ class AvatarDropdown extends React.Component {
         </Menu.Item>
       </Menu>
     );
-    return currentUser && currentUser.name ? (
+    return currentUser ? (
       <HeaderDropdown overlay={menuHeaderDropdown}>
         <span className={`${styles.action} ${styles.account}`}>
           <Avatar
@@ -64,7 +65,9 @@ class AvatarDropdown extends React.Component {
             src={currentUser.avatar}
             alt="avatar"
           />
-          <span className={`${styles.name} anticon`}>{currentUser.name}</span>
+          <span className={`${styles.name} anticon`}>
+            {currentUser.name || loginName || '管理员'}
+          </span>
         </span>
       </HeaderDropdown>
     ) : (

src/containers/App/store/actions.js

@@ -4,6 +4,7 @@ import {
   LOAD_REPOS_SUCCESS,
   SET_AUTHORITY,
   SET_USER_MODE,
+  SET_LOGIN_NAME,
 } from './constants';
 
 export function loadRepos() {
@@ -40,3 +41,10 @@ export function setUserMode(userMode) {
     userMode,
   };
 }
+
+export function setLoginName(loginName) {
+  return {
+    type: SET_LOGIN_NAME,
+    loginName,
+  };
+}

src/containers/App/store/constants.js

@@ -3,3 +3,4 @@ export const LOAD_REPOS_SUCCESS = 'App/LOAD_REPOS_SUCCESS';
 export const LOAD_REPOS_ERROR = 'App/LOAD_REPOS_ERROR';
 export const SET_AUTHORITY = 'App/SET_AUTHORITY';
 export const SET_USER_MODE = 'App/SET_USER_MODE';
+export const SET_LOGIN_NAME = 'App/SET_LOGIN_NAME';

src/containers/App/store/index.js

@@ -11,6 +11,7 @@ const mapState = store => {
     global: storeObj.global,
     auth: storeObj.global.auth,
     userMode: storeObj.global.userMode,
+    loginName: storeObj.global.loginName,
   };
 };
 const mapDispatch = dispatch => ({
@@ -20,6 +21,7 @@ const mapDispatch = dispatch => ({
     dispatch(actionCreators.setAuth([]));
   },
   setUserMode: userMode => dispatch(actionCreators.setUserMode(userMode)),
+  setLoginName: loginName => dispatch(actionCreators.setLoginName(loginName)),
 });
 
 const appConnector = connect(

src/containers/App/store/reducer.js

@@ -6,6 +6,7 @@ import {
   LOAD_REPOS_SUCCESS,
   SET_AUTHORITY,
   SET_USER_MODE,
+  SET_LOGIN_NAME,
 } from './constants';
 
 export const initialState = fromJS({
@@ -17,6 +18,7 @@ export const initialState = fromJS({
     repositories: false,
   },
   userMode: '',
+  loginName: '',
 });
 
 /* eslint-disable default-case, no-param-reassign */
@@ -52,6 +54,10 @@ const appReducer = (state = initialState, action) => {
       return state.merge({
         userMode: action.userMode,
       });
+    case SET_LOGIN_NAME:
+      return state.merge({
+        loginName: action.loginName,
+      });
     default:
       return state;
   }

src/pages/user/login/index.js

@@ -21,7 +21,13 @@ const LoginMessage = ({ content }) => (
 );
 
 const Login = props => {
-  const { userLogin = {}, submitting, setAuth, setUserMode } = props;
+  const {
+    userLogin = {},
+    submitting,
+    setAuth,
+    setUserMode,
+    setLoginName,
+  } = props;
   const { status, type: loginType } = userLogin;
   const history = useHistory();
   const [loading, setLoading] = useState(false);
@@ -41,6 +47,7 @@ const Login = props => {
         if (pass === true) {
           localStorage.setItem('token', token?.access_token || '');
           setUserMode(userMode);
+          setLoginName(loginName);
           if (userMode === USER_MODE.ADMIN || userMode === USER_MODE.SUPER) {
             const authority = [AUTHORITY.LOGIN, AUTHORITY[userMode]];
             setAuthority(authority);