Projekt

Obecné

Profil

Stáhnout (3.15 KB) Statistiky
| Větev: | Tag: | Revize:
1
import 'antd/dist/antd.css';
2
import { Form, Input, Button } from 'antd';
3
import { UserOutlined, LockOutlined } from '@ant-design/icons';
4
import { LoggedUserContext } from '../../contexts/LoggedUserContext';
5
import { LoginLayout } from '../../layouts/LoginLayout';
6
import { useContext } from 'react';
7
import { useRouter } from 'next/router';
8
import { ShowToast } from '../../utils/alerts';
9
import { getTokenData } from '../../utils/login';
10
import { LoginResponse } from '../../api';
11

    
12
/**
13
 * Creates a login screen.
14
 * @returns Html structure of the login screen.
15
 */
16
function Login() {
17
    const { login, role } = useContext(LoggedUserContext);
18
    const router = useRouter();
19
    /**
20
     * Handles submission a form when its fields were successfully validated.
21
     * @param values Fields of the login form.
22
     */
23
    const onFinish = async (values: any) => {
24
        const loginRes = await login(values.username, values.password);
25

    
26
        if (!loginRes) {
27
            ShowToast(
28
                'Chybně zadané heslo nebo uživatelské jméno',
29
                'error',
30
                3000,
31
                'top-end'
32
            );
33
        } else {
34
            let data: LoginResponse | null = await getTokenData();
35
            ShowToast('Přihlášení proběhlo úspěšně', 'success', 3000, 'top-end');
36
            if (data?.role === 'ADMINISTRATOR') {
37
                await router.push('/documents/admin');
38
            } else if (data?.role === 'ANNOTATOR') {
39
                await router.push('/documents/annotator');
40
            }
41
        }
42
    };
43

    
44
    /**
45
     * Handles submission a form when its validation failed.
46
     * @param errorInfo Validation errors.
47
     */
48
    const onFinishFailed = (errorInfo: any) => {
49
        ShowToast('Zadané údaje nejsou validní', 'error', 3000, 'top-end');
50
    };
51

    
52
    return (
53
        <LoginLayout>
54
            <Form
55
                name="login"
56
                onFinish={onFinish}
57
                onFinishFailed={onFinishFailed}
58
                autoComplete="off"
59
            >
60
                <Form.Item
61
                    name="username"
62
                    rules={[
63
                        {
64
                            required: true,
65
                            message: 'Prosím zadejte své uživatelské jméno',
66
                        },
67
                    ]}
68
                >
69
                    <Input
70
                        prefix={<UserOutlined className="site-form-item-icon" />}
71
                        placeholder="Uživatelské jméno"
72
                    />
73
                </Form.Item>
74

    
75
                <Form.Item
76
                    name="password"
77
                    rules={[{ required: true, message: 'Prosím zadejte své heslo' }]}
78
                >
79
                    <Input.Password
80
                        prefix={<LockOutlined className="site-form-item-icon" />}
81
                        placeholder="Heslo"
82
                    />
83
                </Form.Item>
84
                <Form.Item>
85
                    <Button type="primary" htmlType="submit" className="w-100">
86
                        Přihlásit
87
                    </Button>
88
                </Form.Item>
89
            </Form>
90
        </LoginLayout>
91
    );
92
}
93

    
94
export default Login;
    (1-1/1)