1 | import React from "react";
|
---|
2 | import { Container, Form, Button, Row, Col } from "react-bootstrap";
|
---|
3 | import useFormData from "../Hooks/useFormData";
|
---|
4 |
|
---|
5 | const SearchCriteriasHotel = (props) => {
|
---|
6 |
|
---|
7 | const { formData, onFormChange, onCheckBoxChange, setFormData} = useFormData(props.criterias)
|
---|
8 |
|
---|
9 |
|
---|
10 |
|
---|
11 | return (
|
---|
12 | <>
|
---|
13 | <Container
|
---|
14 | className="p-1 pb-0 mb-5 mt-3 rounded-2"
|
---|
15 | style={{ backgroundColor: "#002B5B", width: "65%"}}
|
---|
16 | >
|
---|
17 | <Form className="rounded-5">
|
---|
18 | <Row className="gx-1">
|
---|
19 | <Col>
|
---|
20 | <Form.Floating className="mb-3">
|
---|
21 | <Form.Control
|
---|
22 | size="md"
|
---|
23 | type="text"
|
---|
24 | placeholder="Каде ќе патувате?:"
|
---|
25 | id="location"
|
---|
26 | name="hotelLocation"
|
---|
27 | onChange={onFormChange}
|
---|
28 | value={formData.hotelLocation}
|
---|
29 | ></Form.Control>
|
---|
30 | <label htmlFor="location">Локација:</label>
|
---|
31 | </Form.Floating>
|
---|
32 | </Col>
|
---|
33 | <Col>
|
---|
34 | <Form.Floating className="mb-3">
|
---|
35 | <Form.Control
|
---|
36 | size="md"
|
---|
37 | type="date"
|
---|
38 | placeholder="Датум на пристигнување:"
|
---|
39 | id="dateFrom"
|
---|
40 | name="dateFrom"
|
---|
41 | onChange={onFormChange}
|
---|
42 | value={formData.dateFrom}
|
---|
43 | ></Form.Control>
|
---|
44 | <label htmlFor="dateFrom">Датум на пристигнување:</label>
|
---|
45 | </Form.Floating>
|
---|
46 | </Col>
|
---|
47 | <Col>
|
---|
48 | <Form.Floating className="mb-3">
|
---|
49 | <Form.Control
|
---|
50 | size="md"
|
---|
51 | type="date"
|
---|
52 | placeholder="Датум на заминување:"
|
---|
53 | id="dateTo"
|
---|
54 | name="dateTo"
|
---|
55 | onChange={onFormChange}
|
---|
56 | value={formData.dateTo}
|
---|
57 | ></Form.Control>
|
---|
58 | <label htmlFor="dateTo">Датум на заминување:</label>
|
---|
59 | </Form.Floating>
|
---|
60 | </Col>
|
---|
61 | <Col>
|
---|
62 | <Form.Floating className="mb-3">
|
---|
63 | <Form.Control
|
---|
64 | size="md"
|
---|
65 | type="number"
|
---|
66 | placeholder="Број на гости:"
|
---|
67 | id="floatingPassengers"
|
---|
68 | name="numBeds"
|
---|
69 | onChange={onFormChange}
|
---|
70 | value={formData.numBeds}
|
---|
71 | ></Form.Control>
|
---|
72 | <label htmlFor="floatingPassengers">Број на гости:</label>
|
---|
73 | </Form.Floating>
|
---|
74 | </Col>
|
---|
75 | <Col>
|
---|
76 | <Form.Group className="my-1">
|
---|
77 | <Button
|
---|
78 | type="submit"
|
---|
79 | style={{ backgroundColor: "#159895" }}
|
---|
80 | size="lg"
|
---|
81 | className="w-100"
|
---|
82 | onClick={(e) => {
|
---|
83 | e.preventDefault();
|
---|
84 | window.location.href = `/search/hotel/${formData.hotelLocation}/${formData.dateFrom}/${formData.dateTo}/${formData.numBeds}`
|
---|
85 | }}
|
---|
86 | >
|
---|
87 | <span className="ikona mx-3">Пребарај</span>
|
---|
88 | </Button>
|
---|
89 | </Form.Group>
|
---|
90 | </Col>
|
---|
91 | </Row>
|
---|
92 | </Form>
|
---|
93 | </Container>
|
---|
94 | </>
|
---|
95 | );
|
---|
96 | };
|
---|
97 |
|
---|
98 | export default SearchCriteriasHotel;
|
---|