Browse Source

修正登录登出流程

main
郑州 3 years ago
parent
commit
f922cb3b93
2 changed files with 22 additions and 7 deletions
  1. +12
    -3
      src/components/AppHeader/components/userCenter/UserCenter.tsx
  2. +10
    -4
      src/pages/login/index.tsx

+ 12
- 3
src/components/AppHeader/components/userCenter/UserCenter.tsx View File

@@ -25,10 +25,14 @@ export default function UserCenter(props: UserCenterProps) {
setPopVisible(nextVisible); setPopVisible(nextVisible);
}, []); }, []);


const onLogoutBtnClick = useCallback(() => {
setPopVisible(false);
}, []);

return ( return (
<Popover <Popover
overlayClassName={styles.popWrapper} overlayClassName={styles.popWrapper}
content={<PopContent />}
content={<PopContent onLogoutBtnClick={onLogoutBtnClick} />}
trigger="click" trigger="click"
visible={popVisible} visible={popVisible}
onVisibleChange={onVisibleChange} onVisibleChange={onVisibleChange}
@@ -45,15 +49,20 @@ export default function UserCenter(props: UserCenterProps) {
); );
} }


function PopContent(props) {
interface PopContentProps {
onLogoutBtnClick: () => void;
}

function PopContent(props: PopContentProps) {
const { onLogoutBtnClick } = props;
const { const {
refresh, refresh,
initialState: { currentUser } = {}, initialState: { currentUser } = {},
setInitialState, setInitialState,
} = useModel('@@initialState'); } = useModel('@@initialState');
console.log(currentUser);


const tryLogout = useCallback(() => { const tryLogout = useCallback(() => {
if (onLogoutBtnClick) onLogoutBtnClick();
confirm({ confirm({
onOk() { onOk() {
logout(); logout();


+ 10
- 4
src/pages/login/index.tsx View File

@@ -1,5 +1,5 @@
import React, { useState } from 'react'; import React, { useState } from 'react';
import { Input, Button } from 'antd';
import { Input, Button, Form } from 'antd';
import styles from './login.less'; import styles from './login.less';
import { history, useModel } from 'umi'; import { history, useModel } from 'umi';
import { MobileFilled, LockFilled } from '@ant-design/icons'; import { MobileFilled, LockFilled } from '@ant-design/icons';
@@ -52,7 +52,7 @@ export default function Login() {
<div>欢迎使用</div> <div>欢迎使用</div>
<div>locking</div> <div>locking</div>
</div> </div>
<div className={styles.form}>
<Form className={styles.form}>
<Input <Input
size="large" size="large"
prefix={<MobileFilled className={styles.icon} />} prefix={<MobileFilled className={styles.icon} />}
@@ -71,10 +71,16 @@ export default function Login() {
onChange={(e) => setPassword(e.target.value)} onChange={(e) => setPassword(e.target.value)}
/> />
<div className={styles.errText}>{errText}</div> <div className={styles.errText}>{errText}</div>
<Button loading={loading} type="primary" block onClick={onLogin}>
<Button
loading={loading}
type="primary"
block
onClick={onLogin}
htmlType="submit"
>
登录 登录
</Button> </Button>
</div>
</Form>
</div> </div>
); );
} }

Loading…
Cancel
Save