diff --git a/src/App.js b/src/App.js index 828008a..b625cc4 100644 --- a/src/App.js +++ b/src/App.js @@ -214,7 +214,10 @@ function App() { let permission = Notification.permission; // Check current permission - if (permission !== "granted") { + const searchParams = new URLSearchParams(location.search); + let searchModal = searchParams.get("modal") || ''; // Get transactionId or set it to empty string + + if (permission !== "granted" && searchModal == '') { setModal("req_notification"); } }; @@ -315,6 +318,17 @@ function App() { }; }, [socket, shopId, location]); // Ensure location is in the dependencies to respond to changes in the URL + useEffect(() => { + if (user.cafeId != null && user.cafeId !== shopId) { + // Preserve existing query parameters + const currentParams = new URLSearchParams(location.search).toString(); + + // Navigate to the new cafeId while keeping existing params + navigate(`/${user.cafeId}?${currentParams}`, { replace: true }); + } + + }, [user, shopId]); + function handleMoveToTransaction(direction, from) { console.log(direction); console.log(from); diff --git a/src/components/Item.js b/src/components/Item.js index 930d4aa..88d832e 100644 --- a/src/components/Item.js +++ b/src/components/Item.js @@ -128,6 +128,24 @@ const Item = ({ )}
+ {forInvoice && + + + + +} { - if (user.cafeId != null && user.cafeId !== shopId) { - // Preserve existing query parameters - const currentParams = new URLSearchParams(location.search).toString(); - - // Navigate to the new cafeId while keeping existing params - navigate(`/${user.cafeId}?${currentParams}`, { replace: true }); - } - - }, [user, shopId]); useEffect(() => { function fetchData() { diff --git a/src/pages/Cart.js b/src/pages/Cart.js index be05bdf..1cc8f11 100644 --- a/src/pages/Cart.js +++ b/src/pages/Cart.js @@ -11,6 +11,8 @@ import { handlePaymentFromGuestDevice, } from "../helpers/transactionHelpers"; +import { getItemsByCafeId } from "../helpers/cartHelpers.js"; + export default function Invoice({ table, sendParam, deviceType, socket }) { const { shopId, tableCode } = useParams(); sendParam({ shopId, tableCode }); @@ -21,6 +23,7 @@ export default function Invoice({ table, sendParam, deviceType, socket }) { const textareaRef = useRef(null); const [orderType, setOrderType] = useState("pickup"); + const [orderMethod, setOrderMethod] = useState("cash"); const [tableNumber, setTableNumber] = useState(""); const [email, setEmail] = useState(""); @@ -39,6 +42,7 @@ export default function Invoice({ table, sendParam, deviceType, socket }) { .filter((itemType) => itemType.itemList.length > 0); // Remove empty itemTypes setCartItems(filteredItems); + console.log(filteredItems) // Update local storage by removing unavailable items const updatedLocalStorage = @@ -140,6 +144,10 @@ export default function Invoice({ table, sendParam, deviceType, socket }) { setOrderType(event.target.value); }; + const handleOrderMethodChange = (event) => { + setOrderMethod(event.target.value); + }; + const handleTableNumberChange = (event) => { setTableNumber(event.target.value); }; @@ -148,10 +156,24 @@ export default function Invoice({ table, sendParam, deviceType, socket }) { setEmail(event.target.value); }; return ( -
-
+
0 ? '': 'calc(100vh - 75px)'), minHeight: (getItemsByCafeId(shopId).length > 0 ? 'calc(100vh - 210px)': '') }}> + +

Keranjang

-
+ {getItemsByCafeId(shopId) < 1 ? +
+
+ + + +
+

Tidak ada item di keranjang

+
+ : + <>
{cartItems.map((itemType) => (
-
- Total: - Rp {totalPrice} -
- Opsi pembayaran - + Pembayaran + + +
- -
handlePay(true)}> - {isPaymentLoading ? ( - - ) : ( - "Tunai" - )} +
+
+ +}
); } diff --git a/src/pages/Invoice.module.css b/src/pages/Invoice.module.css index 894ea1d..87ff1e7 100644 --- a/src/pages/Invoice.module.css +++ b/src/pages/Invoice.module.css @@ -3,7 +3,7 @@ background-color: white; display: flex; flex-direction: column; - justify-content: center; + justify-content: flex-start; font-size: calc(10px + 2vmin); color: rgba(88, 55, 50, 1); background-color: #e9e9e9; @@ -13,11 +13,11 @@ font-family: "Poppins", sans-serif; font-weight: 500; font-style: normal; - font-size: 32px; + font-size: 6vw; color: rgba(88, 55, 50, 1); text-align: left; margin-left: 20px; - margin-top: 17px; + margin-top: 7px; } .Invoice-detail { @@ -58,7 +58,7 @@ color: rgba(88, 55, 50, 1); position: relative; - height: 229.39px; + height: 180px; } .TotalContainer { @@ -69,8 +69,9 @@ font-family: "Poppins", sans-serif; font-weight: 600; font-style: normal; - font-size: 1.5em; + font-size: 1.3em; padding: 10px 0; + padding-top: 20px; margin-bottom: 17px; } @@ -78,10 +79,10 @@ font-family: "Poppins", sans-serif; font-weight: 500; font-style: normal; - font-size: 32px; + font-size: 20px; width: 80vw; - height: 18vw; + height: 40px; border-radius: 50px; background-color: rgba(88, 55, 50, 1); color: white; @@ -91,6 +92,13 @@ margin-bottom: 23px; } +.PayButton div{ + display: flex; + justify-content: space-between; + padding-left: 20px; + padding-right: 20px; +} + .Pay2Button { text-align: center; color: rgba(88, 55, 50, 1); @@ -117,6 +125,7 @@ padding-top: 5px; margin: 26px; background-color: #f9f9f9; + margin-bottom: -20px; } .EmailContainer { @@ -155,6 +164,7 @@ font-size: 1em; padding: 10px 0; margin-bottom: 7px; + font-weight: 600; } .NoteInput { @@ -165,7 +175,6 @@ padding: 10px; font-size: 1.2em; border: 1px solid rgba(88, 55, 50, 0.5); - margin-bottom: 27px; resize: none; /* Prevent resizing */ overflow-wrap: break-word; /* Ensure text wraps */ } diff --git a/src/pages/NotificationRequest.js b/src/pages/NotificationRequest.js index 2d78e69..3f2ef40 100644 --- a/src/pages/NotificationRequest.js +++ b/src/pages/NotificationRequest.js @@ -25,7 +25,7 @@ export default function Transaction_pending({ setModal }) { }; return ( -
+

Aktifkan Notifikasi

+

Transactions

{/* */} diff --git a/src/pages/Transaction.js b/src/pages/Transaction.js index 827b683..661f43a 100644 --- a/src/pages/Transaction.js +++ b/src/pages/Transaction.js @@ -107,7 +107,7 @@ export default function Transactions({ propsShopId, sendParam, deviceType, handl }, [transaction?.notes]); return ( -
+
{transaction && ( diff --git a/src/pages/Transaction_confirmed.js b/src/pages/Transaction_confirmed.js index 17f51ca..b22da36 100644 --- a/src/pages/Transaction_confirmed.js +++ b/src/pages/Transaction_confirmed.js @@ -123,7 +123,7 @@ export default function Transactions({ }, [transaction?.notes]); return ( -
+
{transaction && (
+

pesananmu selesai diproses nih

diff --git a/src/pages/Transaction_failed.js b/src/pages/Transaction_failed.js index 10a0c42..64db99c 100644 --- a/src/pages/Transaction_failed.js +++ b/src/pages/Transaction_failed.js @@ -13,7 +13,7 @@ export default function Transaction_pending() { }; return ( -
+

transaction failed

diff --git a/src/pages/Transaction_pending.js b/src/pages/Transaction_pending.js index 00d2b98..ce8b822 100644 --- a/src/pages/Transaction_pending.js +++ b/src/pages/Transaction_pending.js @@ -107,7 +107,7 @@ export default function Transactions({ propsShopId, sendParam, deviceType, handl }, [transaction?.notes]); return ( -
+
{transaction && ( @@ -122,9 +122,13 @@ export default function Transactions({ propsShopId, sendParam, deviceType, handl
-

sedang memeriksa ketersediaan

-

Transaction ID: {transaction.transactionId}

-

Payment Type: {transaction.payment_type}

+

memeriksa ketersediaan

+

ID Transaksi: {transaction.transactionId}

+

Pembayaran: {transaction.payment_type}

+

{transaction.serving_type === "pickup" + ? "Ambil sendiri" + : `Diantar ke meja ${transaction.Table ? transaction.Table.tableNo : "N/A" + }`}

diff --git a/src/pages/Transaction_success.js b/src/pages/Transaction_success.js index f7033ea..b7bce42 100644 --- a/src/pages/Transaction_success.js +++ b/src/pages/Transaction_success.js @@ -25,7 +25,7 @@ export default function Transaction_pending({ setModal }) { }; return ( -
+

Transaction Success

+ +
+
+

{transaction.confirmed === 1 ? ( + "Silahkan cek pembayaran" + ) : transaction.confirmed === -1 ? ( + "Declined" + ) : transaction.confirmed === -2 ? ( + "Canceled" + ) : transaction.confirmed === 2 ? ( + "Sedang diproses" + ) : transaction.confirmed === 3 ? ( + "Transaction success" + ) : ( + "Silahkan cek ketersediaan" + )}

+ +

Transaction ID: {transaction.transactionId}

+

Payment Type: {transaction.payment_type}

+
+
+
+
+ +
+
+
+ +
+
+ {transaction.paymentClaimed && transaction.confirmed < 2 && (

payment claimed

)} -

- Transaction ID: {transaction.transactionId} -

-

- Payment Type: {transaction.payment_type} -

    {transaction.DetailedTransactions.map((detail) => (
  • @@ -141,6 +166,23 @@ export default function Transactions({ propsShopId, sendParam, deviceType }) { transaction.Table ? transaction.Table.tableNo : "N/A" }`} + + {transaction.notes != "" && ( + <> +
    + Note : + +
    + +
    +