import { useState } from 'react';
import { Button, Form } from 'react-bootstrap';
import { Link } from 'react-router-dom';

const Page5 = () => {
    const [validated, setValidated] = useState(false);

    const handleSubmit = (event) => {
        const form = event.currentTarget;
        if (form.checkValidity() === false) {
            event.preventDefault();
            event.stopPropagation();
        }

        setValidated(true);
    };

    return (
        <div className="row justify-content-center">
            <Form className="col-md-6 m-0" noValidate validated={validated} onSubmit={handleSubmit}>
                <Form.Group className="mb-2" controlId="lastname">
                    <Form.Label>Фамилия</Form.Label>
                    <Form.Control type="text" name="lastname" required />
                    <Form.Control.Feedback>Фамилия заполнена</Form.Control.Feedback>
                    <Form.Control.Feedback type="invalid">Фамилия не заполнена</Form.Control.Feedback>
                </Form.Group>
                <Form.Group className="mb-2" controlId="firstname">
                    <Form.Label>Имя</Form.Label>
                    <Form.Control type="text" name="firstname" required />
                </Form.Group>
                <Form.Group className="mb-2" controlId="email">
                    <Form.Label>E-mail</Form.Label>
                    <Form.Control type="email" name="email" placeholder="name@example.ru" required />
                </Form.Group>
                <Form.Group className="mb-2" controlId="date">
                    <Form.Label>Дата</Form.Label>
                    <Form.Control type="date" name="date" required />
                </Form.Group>
                <div className="text-center">
                    <Button className="w-50" variant="primary" type="submit">Отправить</Button>
                </div>
                <Link to="/page6">
                    Вход для админа
                </Link>
            </Form>
        </div>
    );
};

export default Page5;