Changeset cc4db18 for frontend/src/FrontPage.js
- Timestamp:
- 07/06/22 13:13:35 (2 years ago)
- Branches:
- master
- Children:
- 899b19d
- Parents:
- d76b7ee
- File:
-
- 1 edited
Legend:
- Unmodified
- Added
- Removed
-
frontend/src/FrontPage.js
rd76b7ee rcc4db18 1 import React, {useState } from 'react'1 import React, {useState, useEffect} from 'react' 2 2 import {Header} from "./Header"; 3 3 import {useNavigate} from "react-router-dom"; 4 import {Button, Image, Modal} from "antd";4 import {Button, Card, Image, Modal, Spin} from "antd"; 5 5 import placeholderImage from '../src/Assets/placeholder.png' 6 6 import AddNewReservation from "./Dashboard/AddNewReservation"; 7 import axios from "axios"; 8 import env from "./env"; 7 9 8 10 const FrontPage = ({}) => { … … 10 12 const [newReservationModal, setNewReservationModal] = useState(false); 11 13 const [saveModalLoading, setSaveModalLoading] = useState(false); 14 const [loading, setLoading] = useState(true); 12 15 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 13 25 return( 14 26 <div> 15 27 <Header onClickButton={()=>history('/login')} buttonText={'Логирај се'}/> 28 {loading ? <Spin style={{margin: 20}}/> : 16 29 <div style={{ 17 30 height: '400px', … … 20 33 padding: '20px' 21 34 }}> 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> 36 79 </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 } 48 81 <Modal 49 82 style={{top: 20}}
Note:
See TracChangeset
for help on using the changeset viewer.