This commit is contained in:
zadit frontend
2024-08-04 23:44:40 +00:00
parent 6461279b06
commit 7426ccd61b
8 changed files with 112 additions and 86 deletions

View File

@@ -110,7 +110,7 @@ function CafePage({
removeConnectedGuestSides={removeConnectedGuestSides}
/>
<div style={{ marginTop: "5px" }}></div>
<SearchInput shopId={shopId} />
<SearchInput shopId={shopId} tableId={tableId} />
<div style={{ marginTop: "15px" }}></div>
<ItemTypeLister
user={user}

View File

@@ -16,7 +16,7 @@ function SearchResult({ user, shopItems, sendParam }) {
sendParam({ shopId, tableId });
const [searchValue, setSearchValue] = useState(
"dwadawa vvwqd21qb13 4kfawfdwa dhawldhawr dliawbdjawndlks",
"dwadawa vvwqd21qb13 4kfawfdwa dhawldhawr dliawbdjawndlks"
);
// Function to handle search input change
@@ -28,7 +28,7 @@ function SearchResult({ user, shopItems, sendParam }) {
.map((itemType) => {
// Filter items in the itemList based on searchValue
const filteredItemList = itemType.itemList.filter((item) =>
item.name.toLowerCase().includes(searchValue.toLowerCase()),
item.name.toLowerCase().includes(searchValue.toLowerCase())
);
// Return itemType with only filtered items
@@ -47,6 +47,7 @@ function SearchResult({ user, shopItems, sendParam }) {
<div style={{ marginTop: "5px" }}></div>
<SearchInput
shopId={shopId}
tableId={tableId}
autofocus={true}
onSearchChange={handleSearchChange}
/>

View File

@@ -73,58 +73,59 @@ export default function Transactions({ propsShopId, sendParam, deviceType }) {
<div style={{ marginTop: "30px" }}></div>
<TableCanvas tables={tables} selectedTable={selectedTable} />
<div className={styles.TransactionListContainer}>
{transactions.map((transaction) => (
<div
key={transaction.transactionId}
className={styles.RoundedRectangle}
onClick={() =>
setSelectedTable(transaction.Table || { tableId: 0 })
}
>
<h2 className={styles["Transactions-detail"]}>
Transaction ID: {transaction.transactionId}
</h2>
<h2 className={styles["Transactions-detail"]}>
Payment Type: {transaction.payment_type}
</h2>
<ul>
{transaction.DetailedTransactions.map((detail) => (
<li key={detail.detailedTransactionId}>
<span>{detail.Item.name}</span> - {detail.qty} x Rp{" "}
{detail.Item.price}
</li>
))}
</ul>
<h2 className={styles["Transactions-detail"]}>
{transaction.serving_type === "pickup"
? "Diambil di kasir"
: `Diantar ke meja nomor ${
transaction.Table ? transaction.Table.tableNo : "N/A"
}`}
</h2>
<div className={styles.TotalContainer}>
<span>Total:</span>
<span>
Rp {calculateTotalPrice(transaction.DetailedTransactions)}
</span>
{transactions &&
transactions.map((transaction) => (
<div
key={transaction.transactionId}
className={styles.RoundedRectangle}
onClick={() =>
setSelectedTable(transaction.Table || { tableId: 0 })
}
>
<h2 className={styles["Transactions-detail"]}>
Transaction ID: {transaction.transactionId}
</h2>
<h2 className={styles["Transactions-detail"]}>
Payment Type: {transaction.payment_type}
</h2>
<ul>
{transaction.DetailedTransactions.map((detail) => (
<li key={detail.detailedTransactionId}>
<span>{detail.Item.name}</span> - {detail.qty} x Rp{" "}
{detail.Item.price}
</li>
))}
</ul>
<h2 className={styles["Transactions-detail"]}>
{transaction.serving_type === "pickup"
? "Diambil di kasir"
: `Diantar ke meja nomor ${
transaction.Table ? transaction.Table.tableNo : "N/A"
}`}
</h2>
<div className={styles.TotalContainer}>
<span>Total:</span>
<span>
Rp {calculateTotalPrice(transaction.DetailedTransactions)}
</span>
</div>
<div className={styles.TotalContainer}>
<button
className={styles.PayButton}
onClick={() => handleConfirm(transaction.transactionId)}
disabled={transaction.confirmed || isPaymentLoading} // Disable button if confirmed or loading
>
{isPaymentLoading ? (
<ColorRing height="50" width="50" color="white" />
) : transaction.confirmed ? (
"Confirmed" // Display "Confirmed" if the transaction is confirmed
) : (
"Confirm" // Display "Confirm" otherwise
)}
</button>
</div>
</div>
<div className={styles.TotalContainer}>
<button
className={styles.PayButton}
onClick={() => handleConfirm(transaction.transactionId)}
disabled={transaction.confirmed || isPaymentLoading} // Disable button if confirmed or loading
>
{isPaymentLoading ? (
<ColorRing height="50" width="50" color="white" />
) : transaction.confirmed ? (
"Confirmed" // Display "Confirmed" if the transaction is confirmed
) : (
"Confirm" // Display "Confirm" otherwise
)}
</button>
</div>
</div>
))}
))}
</div>
</div>
);