ok

2024-12-26 08:58:59 +07:00
parent c6d7ed5aae
commit cf38edac85
17 changed files with 259 additions and 167 deletions
--- a/src/pages/Cart.js
+++ b/src/pages/Cart.js
@@ -144,9 +144,11 @@ export default function Invoice({ table, sendParam, deviceType, socket }) {
    console.log(localStorage.getItem('cart'))
    console.log(cartItems)

+    if(localStorage.getItem('cart') == "[]") return;
+
    // Parse the local storage cart
    const localStorageCart = JSON.parse(localStorage.getItem('cart'));
-
+    console.log(localStorageCart)
    // Create a set of itemIds from the local storage cart for quick lookup
    const localStorageItemIds = new Set(localStorageCart[0].items.map(item => item.itemId));

--- a/src/pages/CreateCafe.js
+++ b/src/pages/CreateCafe.js
@@ -1,9 +1,8 @@
 import React, { useState } from 'react';
-import { createClerks } from '../helpers/userHelpers'; // Adjust the import path as needed
+import { createCafe } from '../helpers/cafeHelpers'; // Adjust the import path as needed

 const CreateClerk = ({ shopId }) => {
-  const [username, setUsername] = useState('');
-  const [password, setPassword] = useState('');
+  const [name, setName] = useState('');
  const [loading, setLoading] = useState(false);
  const [message, setMessage] = useState('');

@@ -13,16 +12,16 @@ const CreateClerk = ({ shopId }) => {
    setMessage('');

    // Basic validation
-    if (!username || !password) {
-      setMessage('Username and password are required');
+    if (!name) {
+      setMessage('name is required');
      setLoading(false);
      return;
    }

    try {
-      const create = await createClerks(shopId, username, password);
+      const create = await createCafe(name);

-      if (create) setMessage('Clerk created successfully');
+      if (create) setMessage('Cafe created successfully');
      else setMessage('Failed to create clerk');
    } catch (error) {
      setMessage('Error creating clerk');
@@ -37,16 +36,9 @@ const CreateClerk = ({ shopId }) => {
      <form onSubmit={handleSubmit} style={styles.form}>
        <input
          type="text"
-          placeholder="Username"
-          value={username}
-          onChange={(e) => setUsername(e.target.value)}
-          style={styles.input}
-        />
-        <input
-          type="password"
-          placeholder="Password"
-          value={password}
-          onChange={(e) => setPassword(e.target.value)}
+          placeholder="Cafe name"
+          value={name}
+          onChange={(e) => setName(e.target.value)}
          style={styles.input}
        />
        <button type="submit" style={styles.button} disabled={loading}>
--- a/src/pages/CreateTenant.js
+++ b/src/pages/CreateTenant.js
@@ -1,7 +1,8 @@
 import React, { useState } from 'react';
-import { createClerks } from '../helpers/userHelpers'; // Adjust the import path as needed
+import { createCafeOwner } from '../helpers/userHelpers'; // Adjust the import path as needed

-const CreateClerk = ({ shopId }) => {
+const CreateClerk = () => {
+  const [email, setEmail] = useState('');
  const [username, setUsername] = useState('');
  const [password, setPassword] = useState('');
  const [loading, setLoading] = useState(false);
@@ -20,7 +21,7 @@ const CreateClerk = ({ shopId }) => {
    }

    try {
-      const create = await createClerks(shopId, username, password);
+      const create = await createCafeOwner(email, username, password);

      if (create) setMessage('Clerk created successfully');
      else setMessage('Failed to create clerk');
@@ -33,8 +34,15 @@ const CreateClerk = ({ shopId }) => {

  return (
    <div style={styles.container}>
-      <h2 style={styles.header}>Tambah Kedai</h2>
+      <h2 style={styles.header}>Tambah Tenant</h2>
      <form onSubmit={handleSubmit} style={styles.form}>
+      <input
+          type="text"
+          placeholder="Email"
+          value={email}
+          onChange={(e) => setEmail(e.target.value)}
+          style={styles.input}
+        />
        <input
          type="text"
          placeholder="Username"
@@ -50,7 +58,7 @@ const CreateClerk = ({ shopId }) => {
          style={styles.input}
        />
        <button type="submit" style={styles.button} disabled={loading}>
-          {loading ? 'Creating...' : 'Create Clerk'}
+          {loading ? 'Creating...' : 'Create Tenant'}
        </button>
        {message && (
          <p style={{ ...styles.message, color: message.includes('success') ? 'green' : 'red' }}>
--- a/src/pages/LinktreePage.module.css
+++ b/src/pages/LinktreePage.module.css
@@ -497,7 +497,7 @@
 .cafeListWrapper {
  background-color: white;
  border-radius: 20px 20px 0 0;
-  top: 83vh;
+  bottom: 0;
  position: absolute;
  width: 100%;
 }
--- a/src/pages/Transaction_confirmed.js
+++ b/src/pages/Transaction_confirmed.js
@@ -138,7 +138,7 @@ export default function Transactions({
            <div className={styles['receipt-header']}>
              <ColorRing className={styles['receipt-logo']} />
              <div className={styles['receipt-info']}>
-                <h3>silahkan bayar ke kasir</h3>
+                {transaction.payment_type == 'cashless' ? <h3>silahkan bayar QR</h3> : <h3>silahkan bayar ke kasir</h3>}
                <p>Transaction ID: {transaction.transactionId}</p>
                <p>Payment Type: {transaction.payment_type}</p>
              </div>
--- a/src/pages/Transaction_pending.js
+++ b/src/pages/Transaction_pending.js
@@ -5,7 +5,7 @@ import { ColorRing } from "react-loader-spinner";
 import {
  getTransaction,
  confirmTransaction,
-  declineTransaction,
+  cancelTransaction,
 } from "../helpers/transactionHelpers";
 import { getTables } from "../helpers/tableHelper";
 import TableCanvas from "../components/TableCanvas";
@@ -29,12 +29,24 @@ export default function Transactions({ propsShopId, sendParam, deviceType, handl
      try {
        const fetchedTransaction = await getTransaction(transactionId);
        setTransaction(fetchedTransaction);
-        console.log(transaction);
+        console.log(fetchedTransaction); // Log the fetched transaction
      } catch (error) {
        console.error("Error fetching transaction:", error);
      }
    };
-    fetchData();
+
+    const waitForLocalStorage = async () => {
+      while (localStorage.getItem("auth") === null) {
+        await new Promise((resolve) => setTimeout(resolve, 1000)); // Wait 1 second
+      }
+    };
+
+    const initialize = async () => {
+      await waitForLocalStorage();
+      await fetchData();
+    };
+
+    initialize();
  }, [searchParams]);

  useEffect(() => {
@@ -75,7 +87,7 @@ export default function Transactions({ propsShopId, sendParam, deviceType, handl
    if (isPaymentLoading) return;
    setIsPaymentLoading(true);
    try {
-      const c = await declineTransaction(transactionId);
+      const c = await cancelTransaction(transactionId);
      // if (c) {
      //   // Update the confirmed status locally
      //   setTransactions((prevTransactions) =>
@@ -180,7 +192,7 @@ export default function Transactions({ propsShopId, sendParam, deviceType, handl
            <div className={styles.TotalContainer}>
              <button
                className={styles.PayButton}
-                onClick={() => handleConfirm(transaction.transactionId)}
+                onClick={() => handleDecline(transaction.transactionId)}
                disabled={
                  transaction.confirmed === -1 ||
                  transaction.confirmed === 3 ||
--- a/src/pages/Transactions.js
+++ b/src/pages/Transactions.js
@@ -25,9 +25,9 @@ export default function Transactions({ propsShopId, sendParam, deviceType }) {
    const fetchTransactions = async () => {
      try {
        let response;
-          response = await getTransactionsFromCafe(shopId || propsShopId, 5, false);
-          setTransactions(response);
-          response = await getMyTransactions(shopId || propsShopId, 5);
+        response = await getTransactionsFromCafe(shopId || propsShopId, 5, false);
+        setTransactions(response);
+        response = await getMyTransactions(shopId || propsShopId, 5);
        setMyTransactions(response);
      } catch (error) {
        console.error("Error fetching transactions:", error);
@@ -101,10 +101,10 @@ export default function Transactions({ propsShopId, sendParam, deviceType }) {
  return (
    <div className={styles.Transactions}>
      <div style={{ marginTop: "30px" }}></div>
-      <h2 className={styles["Transactions-title"]}>Transactions</h2>
+      <h2 className={styles["Transactions-title"]}>Daftar transaksi</h2>
      <div style={{ marginTop: "30px" }}></div>
      {/* <TableCanvas tables={tables} selectedTable={selectedTable} /> */}
-      <div className={styles.TransactionListContainer}>
+      <div className={styles.TransactionListContainer} style={{ padding: '0 20px 0 20px' }}>
        {transactions &&
          transactions.map((transaction) => (
            <div
@@ -114,37 +114,66 @@ export default function Transactions({ propsShopId, sendParam, deviceType }) {
                setSelectedTable(transaction.Table || { tableId: 0 })
              }
            >
-              
-            <div className={styles['receipt-header']}>
-              <div className={styles['receipt-info']}>
-                <h3>{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"
-                    )}</h3>
-                    
-                <p>Transaction ID: {transaction.transactionId}</p>
-                <p>Payment Type: {transaction.payment_type}</p>
-              </div>
-            </div>
-            <div className={styles['dotted-line']}>
-              <div className={styles['circle-left']}>
-                
+
+              <div className={styles['receipt-header']}>
+                {transaction.confirmed === 1 ? (
+                  <ColorRing className={styles['receipt-logo']} />
+                ) : transaction.confirmed ===  -1 || transaction.confirmed ===  -2 ? (
+                  <div style={{ display: 'flex', justifyContent: 'center' }}>
+                    <svg
+                      style={{ width: '60px', transform: 'Rotate(45deg)' }}
+                      clipRule="evenodd"
+                      fillRule="evenodd"
+                      strokeLinejoin="round"
+                      strokeMiterlimit="2"
+                      viewBox="0 0 24 24"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="m12.002 2c5.518 0 9.998 4.48 9.998 9.998 0 5.517-4.48 9.997-9.998 9.997-5.517 0-9.997-4.48-9.997-9.997 0-5.518 4.48-9.998 9.997-9.998zm0 1.5c-4.69 0-8.497 3.808-8.497 8.498s3.807 8.497 8.497 8.497 8.498-3.807 8.498-8.497-3.808-8.498-8.498-8.498zm-.747 7.75h-3.5c-.414 0-.75.336-.75.75s.336.75.75.75h3.5v3.5c0 .414.336.75.75.75s.75-.336.75-.75v-3.5h3.5c.414 0 .75-.336.75-.75s-.336-.75-.75-.75h-3.5v-3.5c0-.414-.336-.75-.75-.75s-.75.336-.75.75z"
+                        fillRule="nonzero"
+                      />
+                    </svg>
                  </div>
-              <div className={styles['line']} ></div>
-              <div className={styles['circle-right']} >
-                
+                ) : transaction.confirmed === 2 ? (
+                  <ColorRing className={styles['receipt-logo']} />
+                ) : transaction.confirmed === 3 ? (
+                  "Transaction success"
+                ) : (
+                  
+                  <ColorRing className={styles['receipt-logo']} />
+                )}
+
+
+                <div className={styles['receipt-info']}>
+                  <h3>{transaction.confirmed === 1 ? (
+                    "Silahkan cek pembayaran"
+                  ) : transaction.confirmed === -1 ? (
+                    "Dibatalkan oleh kasir"
+                  ) : transaction.confirmed === -2 ? (
+                    "Dibatalkan oleh pelanggan"
+                  ) : transaction.confirmed === 2 ? (
+                    "Sedang diproses"
+                  ) : transaction.confirmed === 3 ? (
+                    "Transaction success"
+                  ) : (
+                    "Silahkan cek ketersediaan"
+                  )}</h3>
+
+                  <p>Transaction ID: {transaction.transactionId}</p>
+                  <p>Payment Type: {transaction.payment_type}</p>
+                </div>
              </div>
-            </div>
-           
+              <div className={styles['dotted-line']}>
+                <div className={styles['circle-left']}>
+
+                </div>
+                <div className={styles['line']} ></div>
+                <div className={styles['circle-right']} >
+
+                </div>
+              </div>
+
              {transaction.paymentClaimed && transaction.confirmed < 2 && (
                <div className={styles.RibbonBanner}>
                  <img src={"https://i.imgur.com/yt6osgL.png"}></img>
@@ -162,27 +191,26 @@ export default function Transactions({ propsShopId, sendParam, deviceType }) {
              <h2 className={styles["Transactions-detail"]}>
                {transaction.serving_type === "pickup"
                  ? "Self pickup"
-                  : `Serve to ${
-                      transaction.Table ? transaction.Table.tableNo : "N/A"
-                    }`}
+                  : `Serve to ${transaction.Table ? transaction.Table.tableNo : "N/A"
+                  }`}
              </h2>
-              
-            {transaction.notes != "" && (
-              <>
-                <div className={styles.NoteContainer}>
-                  <span>Note :</span>
-                  <span></span>
-                </div>

-                <div className={styles.NoteContainer}>
-                  <textarea
-                    className={styles.NoteInput}
-                    value={transaction.notes}
-                    disabled
-                  />
-                </div>
-              </>
-            )}
+              {transaction.notes != "" && (
+                <>
+                  <div className={styles.NoteContainer}>
+                    <span>Note :</span>
+                    <span></span>
+                  </div>
+
+                  <div className={styles.NoteContainer}>
+                    <textarea
+                      className={styles.NoteInput}
+                      value={transaction.notes}
+                      disabled
+                    />
+                  </div>
+                </>
+              )}
              <div className={styles.TotalContainer}>
                <span>Total:</span>
                <span>
--- a/src/pages/Transactions.module.css
+++ b/src/pages/Transactions.module.css
@@ -8,7 +8,7 @@
  color: rgba(88, 55, 50, 1);
  background-color: #e9e9e9;
  border-radius: 15px;
-  max-height: 80vh;
+  max-height: 87vh;
  width: 80vw;
 }
 .Transactions {
@@ -226,7 +226,7 @@
 .dotted-line .line {
  border-top: 13px dotted #dbdbdb;
  width: 100%;
-  margin: 0 20px;
+  margin: 0 18px;
 }

 .dotted-line .circle-left {