This commit is contained in:
zadit
2024-12-26 08:58:59 +07:00
parent c6d7ed5aae
commit cf38edac85
17 changed files with 259 additions and 167 deletions

View File

@@ -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>