Changeset 07f4e8b for frontend/src/Components/Tab
- Timestamp:
- 01/24/24 17:42:28 (10 months ago)
- Branches:
- master
- Children:
- 0f5aa27
- Parents:
- 5528b99
- Location:
- frontend/src/Components/Tab
- Files:
-
- 2 edited
-
TabFormHotel.js (modified) (1 diff)
-
TabFormTransport.js (modified) (5 diffs)
Legend:
- Unmodified
- Added
- Removed
-
frontend/src/Components/Tab/TabFormHotel.js
r5528b99 r07f4e8b 1 1 import React from "react"; 2 import { Button, Col, Container, Form, Row} from "react-bootstrap";3 import { FaMagnet} from "react-icons/fa"4 import { HiMagnifyingGlass} from "react-icons/hi2"2 import {Button, Col, Container, Form, InputGroup, Row} from "react-bootstrap"; 3 import {FaMagnet} from "react-icons/fa" 4 import {HiMagnifyingGlass} from "react-icons/hi2" 5 5 import useFormData from "../Hooks/useFormData"; 6 6 7 7 function TabFormHotel() { 8 8 9 const { formData, onFormChange, setFormData } = useFormData({ 10 hotelLocation: undefined, 11 dateFrom: undefined, 12 dateTo: undefined, 13 numBeds: undefined 14 }) 9 const {formData, onFormChange, setFormData, onCheckBoxChange} = useFormData({ 10 hotelLocation: undefined, 11 dateFrom: undefined, 12 dateTo: undefined, 13 numBeds: undefined, 14 flexible: false, 15 }) 15 16 16 return ( 17 <Form className='rounded-5' > 18 <Row> 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 value={formData.hotelLocation} 28 onChange={onFormChange} 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 value={formData.dateFrom} 42 onChange={onFormChange} 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 value={formData.dateTo} 56 onChange={onFormChange} 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 value={formData.numBeds} 70 onChange={onFormChange} 71 ></Form.Control> 72 <label htmlFor="floatingPassengers">Број на гости:</label> 73 </Form.Floating> 17 return ( 18 <Form className='rounded-5'> 19 <Row> 20 <Col> 21 <Form.Floating className="mb-3"> 22 <Form.Control 23 size="md" 24 type="text" 25 placeholder="Каде ќе патувате?:" 26 id="location" 27 name="hotelLocation" 28 value={formData.hotelLocation} 29 onChange={onFormChange} 30 ></Form.Control> 31 <label htmlFor="location">Локација:</label> 32 </Form.Floating> 33 <div className="mb-3"> 34 <Form.Check 35 type={"checkbox"} 36 id={`default-checkbox}`} 37 label={`флексибилност +- 3 дена`} 38 onChange={onCheckBoxChange} 39 name={'flexible'} 40 value={formData.flexible} 41 /> 42 </div> 43 </Col> 44 <Col> 45 <Form.Floating className="mb-3"> 46 <Form.Control 47 size="md" 48 type="date" 49 placeholder="Датум на пристигнување:" 50 id="dateFrom" 51 name="dateFrom" 52 value={formData.dateFrom} 53 onChange={onFormChange} 54 ></Form.Control> 55 <label htmlFor="dateFrom">Датум на пристигнување:</label> 56 </Form.Floating> 57 </Col> 58 <Col> 59 <Form.Floating className="mb-3"> 60 <Form.Control 61 size="md" 62 type="date" 63 placeholder="Датум на заминување:" 64 id="dateTo" 65 name="dateTo" 66 value={formData.dateTo} 67 onChange={onFormChange} 68 ></Form.Control> 69 <label htmlFor="dateTo">Датум на заминување:</label> 70 </Form.Floating> 71 </Col> 72 <Col> 73 <Form.Floating className="mb-3"> 74 <Form.Control 75 size="md" 76 type="number" 77 placeholder="Број на гости:" 78 id="floatingPassengers" 79 name="numBeds" 80 value={formData.numBeds} 81 onChange={onFormChange} 82 ></Form.Control> 83 <label htmlFor="floatingPassengers">Број на гости:</label> 84 </Form.Floating> 74 85 75 <Form.Group className="my-1">76 <Button type="submit" style={{backgroundColor: "#159895"}} size="lg"77 onClick={(e) => {78 e.preventDefault();79 window.location.href = `/search/hotel/${formData.hotelLocation}/${formData.dateFrom}/${formData.dateTo}/${formData.numBeds}`80 }}>81 <span className="ikona my-1"><HiMagnifyingGlass/></span>82 <span className="ikona mx-3">Пребарај</span>83 </Button>84 </Form.Group>85 </Col>86 <Form.Group className="my-1"> 87 <Button type="submit" style={{backgroundColor: "#159895"}} size="lg" 88 onClick={(e) => { 89 e.preventDefault(); 90 window.location.href = `/search/hotel/${formData.hotelLocation}/${formData.dateFrom}/${formData.dateTo}/${formData.numBeds}/${formData.flexible}` 91 }}> 92 <span className="ikona my-1"><HiMagnifyingGlass/></span> 93 <span className="ikona mx-3">Пребарај</span> 94 </Button> 95 </Form.Group> 96 </Col> 86 97 87 </Row>88 </Form>89 );98 </Row> 99 </Form> 100 ); 90 101 } 91 102 -
frontend/src/Components/Tab/TabFormTransport.js
r5528b99 r07f4e8b 2 2 import { Button, Col, Container, Form, Row } from "react-bootstrap"; 3 3 import { HiMagnifyingGlass } from "react-icons/hi2" 4 import useFormData from "../Hooks/useFormData"; 4 5 5 6 function TabFormTransport() { 7 8 const { formData, onFormChange, setFormData } = useFormData({ 9 from: undefined, 10 to: undefined, 11 date: undefined, 12 numPassengers: 0 13 }) 14 6 15 return ( 7 16 <Form> … … 14 23 placeholder="Од:" 15 24 id="floatingFrom" 25 value={formData.from} 26 name={'from'} 27 onChange={onFormChange} 16 28 ></Form.Control> 17 29 <label htmlFor="floatingFrom">Од:</label> … … 25 37 placeholder="До:" 26 38 id="floatingTo" 39 name={'to'} 40 value={formData.to} 41 onChange={onFormChange} 27 42 ></Form.Control> 28 43 <label htmlFor="floatingTo">До:</label> … … 36 51 placeholder="Датум:" 37 52 id="floatingDate" 53 name={'date'} 54 value={formData.date} 55 onChange={onFormChange} 38 56 ></Form.Control> 39 57 <label htmlFor="floatingDate">Датум:</label> … … 46 64 type="number" 47 65 placeholder="Број на патници:" 66 name={'numPassengers'} 48 67 id="floatingPassengers" 68 value={formData.numPassengers} 69 onChange={onFormChange} 49 70 ></Form.Control> 50 71 <label htmlFor="floatingPassengers">Број на патници:</label> 51 72 </Form.Floating> 52 73 <Form.Group className="my-1"> 53 <Button type="submit" style={{backgroundColor: "#159895"}} size="lg"> 74 <Button type="submit" style={{backgroundColor: "#159895"}} size="lg" onClick={(e) => { 75 e.preventDefault(); 76 window.location.href = `/search/transport/${formData.from}/${formData.to}/${formData.date}/${formData.numPassengers}` 77 }}> 54 78 <span className="ikona my-1"><HiMagnifyingGlass/></span> 55 79 <span className="ikona mx-3">Пребарај</span>
Note:
See TracChangeset
for help on using the changeset viewer.
