Changeset e15e8d9 for my-react-app/src/components/Reservations.js

Timestamp:

04/30/25 18:24:41 (2 weeks ago)

Author:

Aleksandar Panovski <apano77@…>

Branches:

main

Children:

2518b3a

Parents:

deea3c4

Message:

menu feature done

File:

• my-react-app/src/components/Reservations.js (modified) (2 diffs)

my-react-app/src/components/Reservations.js

@@ -24 +24 @@
                 const response = await axios.get(`http://localhost:8081/api/reservations/by/${userId}`);
                 setReservations(response.data);
+                console.log(response.data)
             } catch (error) {
                 console.error('Error fetching reservations:', error);
@@ -88 +89 @@
                                         "Not specified"} </p>
                                     <p className="card-text">Party Size: {reservation.partySize || "Not specified"}</p>
+                                    {reservation.preOrderedItems && reservation.preOrderedItems.length > 0 ? (
+                                        <div className="mt-3">
+                                            <h5 className="text-primary">Pre-Ordered Items:</h5>
+                                            <ul className="list-group mb-3">
+                                                {reservation.preOrderedItems.map((itemStr, index) => {
+                                                    const parts = itemStr.split(':');
+                                                    const name = parts[0];
+                                                    const quantity = parseInt(parts[1], 10) || 0;
+                                                    const price = parseFloat(parts[2]) || 0;
+
+                                                    return (
+                                                        <li key={index} className="list-group-item d-flex justify-content-between align-items-center">
+                                                            <span><strong>{name}</strong> × {quantity}</span>
+                                                            <span className="badge bg-success rounded-pill">${(price * quantity).toFixed(2)}</span>
+                                                        </li>
+                                                    );
+                                                })}
+                                            </ul>
+
+                                            <div className="alert alert-info text-center" role="alert">
+                                                <h5>Grand Total: ${reservation.preOrderedItems.reduce((acc, itemStr) => {
+                                                    const parts = itemStr.split(':');
+                                                    const quantity = parseInt(parts[1], 10) || 0;
+                                                    const price = parseFloat(parts[2]) || 0;
+                                                    return acc + (quantity * price);
+                                                }, 0).toFixed(2)}</h5>
+                                            </div>
+                                        </div>
+                                    ) : (
+                                        <p>No pre-ordered items.</p>
+                                    )}
                                     <p className="card-text text-danger">Special Requests: {reservation.specialRequests || "None"}</p>
                                     <p className="card-text">Status: {reservation.status || "Pending"}</p>