Changeset 899b19d for frontend/src/FrontPage.js

Timestamp:

07/10/22 10:27:45 (2 years ago)

Author:

Danilo <danilo.najkov@…>

Branches:

master

Children:

a26f6a1

Parents:

cc4db18

Message:

reviews full feature

File:

• frontend/src/FrontPage.js (modified) (4 diffs)

frontend/src/FrontPage.js

@@ -2 +2 @@
 import {Header} from "./Header";
 import {useNavigate} from "react-router-dom";
-import {Button, Card, Image, Modal, Spin} from "antd";
+import {Button, Card, DatePicker, Form, Image, Input, Modal, notification, Rate, Spin} from "antd";
 import placeholderImage from '../src/Assets/placeholder.png'
 import AddNewReservation from "./Dashboard/AddNewReservation";
 import axios from "axios";
 import env from "./env";
+import Review from "./Dashboard/Review";
 
-const FrontPage = ({}) => {
+const FrontPage = ({user, logout}) => {
     const [restaurant, setRestaurant] = useState({name:'Sample Restaurant name', address: 'Sample street 1', city:'Sample'});
     const [newReservationModal, setNewReservationModal] = useState(false);
     const [saveModalLoading, setSaveModalLoading] = useState(false);
+    const [newReviewModal, setNewReviewModal] = useState(false);
     const [loading, setLoading] = useState(true);
+    const [refreshToggle, setRefreshToggle] = useState(false);
     const history = useNavigate();
 
@@ -23 +26 @@
     },[])
 
+    const saveNewReview = data =>{
+        setSaveModalLoading(true)
+        axios.post(env.api + 'Reviews',data,{ headers: {Authorization: sessionStorage.getItem('Auth')}}).then(res=>{
+            setNewReviewModal(false)
+            setSaveModalLoading(false)
+            notification['success']({
+                message: 'Успешно зачувано',
+            });
+            setRefreshToggle(ref => !ref);
+        }).catch(err=>{
+            setSaveModalLoading(false)
+            notification['error']({
+                message: 'Се случи проблем при зачувување',
+            });
+        });
+    }
+
     return(
         <div>
-            <Header onClickButton={()=>history('/login')} buttonText={'Логирај се'}/>
+            <Header onClickButton={!user?()=>history('/login'):logout} buttonText={!user?'Најави се':'Одјави се'}/>
             {loading ? <Spin style={{margin: 20}}/> :
                 <div style={{
@@ -69 +89 @@
                     </div>
                     <div style={{textAlign: 'start', backgroundColor: '#F2F2F2'}}>
-                        <h2 style={{textAlign:'center',paddingTop:'20px'}}>Мени</h2>
+                        <div style={{
+                            width: '100%',
+                            height:'75px',
+                            backgroundColor: 'white',
+                            padding: '20px',
+                            border: '1px solid lightgray'
+                        }} >
+                            <h2 style={{float: 'left'}}>Мени</h2>
+                        </div>
                         {restaurant.menu.map(el =>
-                            <Card title={el.title} style={{ width: 280, display:'inline-block', margin:'10px' }} size="small">
+                            <Card key={el.id} title={el.title} style={{ width: 280, display:'inline-block', margin:'10px' }} size="small">
                                 <p>{el.description}</p>
                                 <b>{el.price} ден.</b>
                             </Card>
                         )}
+                        <Review user={user} front refresh={refreshToggle} setVisible={setNewReviewModal}/>
                     </div>
                 </div>
@@ -92 +121 @@
                 <AddNewReservation setModalSaveLoading={setSaveModalLoading} setModalVisible={setNewReservationModal} />
             </Modal>
+            <Modal
+                style={{top: 20}}
+                width={'700px'}
+                title="Нова оценка"
+                footer={[
+                    <Button form="newReviewForm" key="submit" htmlType="submit" type={'primary'} loading={saveModalLoading}>
+                        Прати
+                    </Button>
+                ]}
+                onCancel={()=>setNewReviewModal(false)}
+                visible={newReviewModal}>
+                <Form onFinish={saveNewReview}
+                      id={'newReviewForm'}
+                      onFinishFailed={()=>
+                          notification['error']({
+                              message: 'Ве молиме поправете ги сите грешки пред зачувување!',
+                          })}>
+                    <Form.Item
+                        label="Наслов"
+                        name="title"
+                        rules={[
+                            {
+                                required: true,
+                                message: 'Ве молиме внесете наслов!',
+                            },
+                        ]}
+                    >
+                        <Input/>
+                    </Form.Item>
+                    <Form.Item
+                        label="Опис"
+                        name="description"
+                        rules={[
+                            {
+                                required: true,
+                                message: 'Ве молиме внесете опис!',
+                            },
+                        ]}
+                    >
+                        <Input.TextArea rows={4}/>
+                    </Form.Item>
+                    <Form.Item
+                        label="Оценка"
+                        name="stars"
+                        rules={[
+                            {
+                                required: true,
+                                message: 'Ве молиме внесете оценка!',
+                            },
+                        ]}
+                    >
+                        <Rate/>
+                    </Form.Item>
+                </Form>
+            </Modal>
         </div>
-
     )
 }
-
 export default FrontPage;