Merge remote-tracking branch 'origin/main'
Lei OT
1 year ago
commit
c7f29f4999
@ -1,125 +1,109 @@
|
||||
import { useNavigate, useLocation } from "react-router-dom";
|
||||
import { useNavigate, useLocation } from 'react-router-dom';
|
||||
import { useEffect } from 'react';
|
||||
import { Button, Checkbox, Form, Input, Row, App } from 'antd';
|
||||
import { useStore } from '@/stores/StoreContext.js';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import useAuthStore from '@/stores/Auth'
|
||||
import useNoticeStore from '@/stores/Notice';
|
||||
|
||||
function Login() {
|
||||
const { t, i18n } = useTranslation();
|
||||
const [validateUserPassword, loginStatus, logout] =
|
||||
useAuthStore((state) => [state.validateUserPassword, state.loginStatus])
|
||||
const getBulletinUnReadCount = useNoticeStore((state) => state.getBulletinUnReadCount)
|
||||
|
||||
const { authStore } = useStore();
|
||||
const [valdateUserPassword, fetchUserDetail, loginStatus] =
|
||||
useAuthStore((state) => [state.valdateUserPassword, state.fetchUserDetail, state.loginStatus])
|
||||
const { t, i18n } = useTranslation()
|
||||
const { notification } = App.useApp();
|
||||
const navigate = useNavigate()
|
||||
const location = useLocation()
|
||||
const [form] = Form.useForm()
|
||||
|
||||
const getBulletinUnReadCount = useNoticeStore((state) => state.getBulletinUnReadCount);
|
||||
|
||||
useEffect (() => {
|
||||
if (location.search === '?out') {
|
||||
authStore.logout();
|
||||
navigate('/login');
|
||||
logout();
|
||||
navigate('/login')
|
||||
}
|
||||
return () => {
|
||||
// unmount...
|
||||
};
|
||||
}, []);
|
||||
}, [])
|
||||
|
||||
useEffect (() => {
|
||||
if (loginStatus === 302) {
|
||||
navigate("/reservation/newest")
|
||||
navigate('/reservation/newest')
|
||||
}
|
||||
}, [loginStatus]);
|
||||
}, [loginStatus])
|
||||
|
||||
const onFinish = (values) => {
|
||||
valdateUserPassword(values.username, values.password)
|
||||
.then((userId) => {
|
||||
// noticeStore.getBulletinUnReadCount(userId);
|
||||
|
||||
console.info('valdateUserPassword')
|
||||
//
|
||||
})
|
||||
validateUserPassword(values.username, values.password)
|
||||
.catch(ex => {
|
||||
notification.error({
|
||||
message: `Notification`,
|
||||
description: 'Login failed. Incorrect username or password.',
|
||||
message: t('Validation.Title'),
|
||||
description: t('Validation.LoginFailed'),
|
||||
placement: 'top',
|
||||
duration: 4,
|
||||
});
|
||||
});
|
||||
};
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
const onFinishFailed = (errorInfo) => {
|
||||
console.log('Failed:', errorInfo);
|
||||
}
|
||||
console.info('loginStatus: ' + loginStatus)
|
||||
if (loginStatus === 302) {
|
||||
} else {
|
||||
return (
|
||||
<Row justify="center" align="middle" style={{ minHeight: 500 }}>
|
||||
<Form
|
||||
name="basic"
|
||||
// layout="vertical"
|
||||
form={form}
|
||||
size="large"
|
||||
labelCol={{
|
||||
span: 8,
|
||||
}}
|
||||
|
||||
return (
|
||||
<Row justify='center' align='middle' style={{ minHeight: 500 }}>
|
||||
<Form
|
||||
name='basic'
|
||||
form={form}
|
||||
size='large'
|
||||
labelCol={{
|
||||
span: 8,
|
||||
}}
|
||||
wrapperCol={{
|
||||
span: 16,
|
||||
}}
|
||||
style={{
|
||||
maxWidth: 600,
|
||||
}}
|
||||
initialValues={{
|
||||
remember: true,
|
||||
}}
|
||||
onFinish={onFinish}
|
||||
onFinishFailed={onFinishFailed}
|
||||
autoComplete='off'
|
||||
>
|
||||
<Form.Item
|
||||
label={t('Username')}
|
||||
name='username'
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t('Validation.UsernameIsEmpty'),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t('Password')}
|
||||
name='password'
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: t('Validation.PasswordIsEmpty'),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<Input.Password />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
wrapperCol={{
|
||||
offset: 8,
|
||||
span: 16,
|
||||
}}
|
||||
style={{
|
||||
maxWidth: 600,
|
||||
}}
|
||||
initialValues={{
|
||||
remember: true,
|
||||
}}
|
||||
onFinish={onFinish}
|
||||
onFinishFailed={onFinishFailed}
|
||||
autoComplete="off"
|
||||
>
|
||||
<Form.Item
|
||||
label={t("Username")}
|
||||
name="username"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: 'Please input your username!',
|
||||
},
|
||||
]}
|
||||
>
|
||||
<Input />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
label={t("Password")}
|
||||
name="password"
|
||||
rules={[
|
||||
{
|
||||
required: true,
|
||||
message: 'Please input your password!',
|
||||
},
|
||||
]}
|
||||
>
|
||||
<Input.Password />
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
wrapperCol={{
|
||||
offset: 8,
|
||||
span: 16,
|
||||
}}
|
||||
>
|
||||
<Button type="primary" htmlType="submit" style={{width: "100%"}}>
|
||||
{t('Login')}
|
||||
</Button>
|
||||
</Form.Item>
|
||||
</Form>
|
||||
</Row>
|
||||
);
|
||||
}
|
||||
<Button type='primary' htmlType='submit' style={{width: '100%'}}>
|
||||
{t('Login')}
|
||||
</Button>
|
||||
</Form.Item>
|
||||
</Form>
|
||||
</Row>
|
||||
)
|
||||
}
|
||||
|
||||
export default Login;
|
||||
export default Login
|
||||
|
||||
Loading…
Reference in New Issue