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