Ignore:
Timestamp:
07/06/22 13:13:35 (2 years ago)
Author:
Danilo <danilo.najkov@…>
Branches:
master
Children:
899b19d
Parents:
d76b7ee
Message:

reservation module changes + contact module + menu module

File:
1 edited

Legend:

Unmodified
Added
Removed
  • frontend/src/FrontPage.js

    rd76b7ee rcc4db18  
    1 import React, {useState} from 'react'
     1import React, {useState, useEffect} from 'react'
    22import {Header} from "./Header";
    33import {useNavigate} from "react-router-dom";
    4 import {Button, Image, Modal} from "antd";
     4import {Button, Card, Image, Modal, Spin} from "antd";
    55import placeholderImage from '../src/Assets/placeholder.png'
    66import AddNewReservation from "./Dashboard/AddNewReservation";
     7import axios from "axios";
     8import env from "./env";
    79
    810const FrontPage = ({}) => {
     
    1012    const [newReservationModal, setNewReservationModal] = useState(false);
    1113    const [saveModalLoading, setSaveModalLoading] = useState(false);
     14    const [loading, setLoading] = useState(true);
    1215    const history = useNavigate();
     16
     17    useEffect(()=>{
     18        setLoading(true);
     19        axios.get(env.api + 'Restaurants').then(res=>{
     20            setRestaurant(res.data);
     21            setLoading(false);
     22        });
     23    },[])
     24
    1325    return(
    1426        <div>
    1527            <Header onClickButton={()=>history('/login')} buttonText={'Логирај се'}/>
     28            {loading ? <Spin style={{margin: 20}}/> :
    1629                <div style={{
    1730                    height: '400px',
     
    2033                    padding: '20px'
    2134                }}>
    22                 <div id={'businessFrontImage'}>
    23                     <Image
    24                         src={restaurant.photo}
    25                         id={'businessFrontInsideImage'}
    26                         placeholder={
    27                             <img
    28                                 src={placeholderImage}
    29                                 alt={'place'}
    30                                 style={{width:'100%',height:'100%'}}
    31                             />
    32                         }
    33                         wrapperStyle={{overflow:'hidden',width:'100%'}}
    34                         style={{width:'100%', height:'100%',margin: 'auto',objectFit:'cover'}}>
    35                     </Image>
     35                    <div id={'businessFrontImage'}>
     36                        <Image
     37                            src={restaurant.base64Image}
     38                            id={'businessFrontInsideImage'}
     39                            placeholder={
     40                                <img
     41                                    src={placeholderImage}
     42                                    alt={'place'}
     43                                    style={{width: '100%', height: '100%'}}
     44                                />
     45                            }
     46                            wrapperStyle={{overflow: 'hidden', width: '100%'}}
     47                            style={{width: '100%', height: '100%', margin: 'auto', objectFit: 'cover'}}>
     48                        </Image>
     49                    </div>
     50                    <div id={'businessFrontInfo'}>
     51                        <div style={{
     52                            width: '100%',
     53                            height: '100%',
     54                            display: 'flex',
     55                            flexDirection: 'column',
     56                            justifyContent: 'space-between'
     57                        }}>
     58                            <div style={{flexGrow: 1, fontSize: '20px', fontWeight: '500', textAlign: 'start'}}>
     59                                {restaurant.name}
     60                                <div style={{
     61                                    color: 'gray',
     62                                    fontSize: '10px'
     63                                }}>{restaurant.address}, {restaurant.phone}</div>
     64                            </div>
     65                            <Button onClick={() => setNewReservationModal(true)}
     66                                    style={{width: '100%', marginTop: '5px'}} type={'primary'}>Резервирај</Button>
     67                        </div>
     68
     69                    </div>
     70                    <div style={{textAlign: 'start', backgroundColor: '#F2F2F2'}}>
     71                        <h2 style={{textAlign:'center',paddingTop:'20px'}}>Мени</h2>
     72                        {restaurant.menu.map(el =>
     73                            <Card title={el.title} style={{ width: 280, display:'inline-block', margin:'10px' }} size="small">
     74                                <p>{el.description}</p>
     75                                <b>{el.price} ден.</b>
     76                            </Card>
     77                        )}
     78                    </div>
    3679                </div>
    37                 <div id={'businessFrontInfo'} >
    38                     <div style={{width:'100%',height:'100%',display:'flex',flexDirection:'column',justifyContent:'space-between'}}>
    39                         <div style={{flexGrow:1, fontSize:'20px', fontWeight:'500', textAlign:'start'}}>
    40                             {restaurant.name}
    41                             <div style={{color:'gray',fontSize:'10px'}}>{restaurant.address}, {restaurant.city}</div>
    42                         </div>
    43                         <Button onClick={()=>setNewReservationModal(true)} style={{width:'100%',marginTop:'5px'}} type={'primary'}>Резервирај</Button>
    44                     </div>
    45 
    46                 </div>
    47             </div>
     80            }
    4881            <Modal
    4982                style={{top: 20}}
Note: See TracChangeset for help on using the changeset viewer.