From de5ef26bb1017540969f8847016193f7e1933ee1 Mon Sep 17 00:00:00 2001 From: Rafi Zadanly Date: Sun, 26 Mar 2023 15:10:59 +0700 Subject: transaction detail --- src/lib/auth/components/Menu.jsx | 47 +++ src/lib/transaction/components/Transaction.jsx | 471 ++++++++++++++++-------- src/lib/transaction/components/Transactions.jsx | 12 +- 3 files changed, 374 insertions(+), 156 deletions(-) create mode 100644 src/lib/auth/components/Menu.jsx (limited to 'src/lib') diff --git a/src/lib/auth/components/Menu.jsx b/src/lib/auth/components/Menu.jsx new file mode 100644 index 00000000..3f2b2fb2 --- /dev/null +++ b/src/lib/auth/components/Menu.jsx @@ -0,0 +1,47 @@ +import Link from '@/core/components/elements/Link/Link' +import { useRouter } from 'next/router' + +const Menu = () => { + const router = useRouter() + + const routeStartWith = (route) => router.pathname.startsWith(route) + + return ( +
+
Menu
+ + Daftar Transaksi + + + Invoice & Faktur Pajak + + + Wishlist + + +
Pusat Bantuan
+ Layanan Pelanggan + +
Pengaturan Akun
+ + Daftar Alamat + + +
+ ) +} + +const LinkItem = ({ children, ...props }) => ( + + {children} + +) + +export default Menu diff --git a/src/lib/transaction/components/Transaction.jsx b/src/lib/transaction/components/Transaction.jsx index dc9338fa..dbfdbae9 100644 --- a/src/lib/transaction/components/Transaction.jsx +++ b/src/lib/transaction/components/Transaction.jsx @@ -15,6 +15,11 @@ import Link from '@/core/components/elements/Link/Link' import Alert from '@/core/components/elements/Alert/Alert' import checkoutPoApi from '../api/checkoutPoApi' import cancelTransactionApi from '../api/cancelTransactionApi' +import MobileView from '@/core/components/views/MobileView' +import DesktopView from '@/core/components/views/DesktopView' +import Menu from '@/lib/auth/components/Menu' +import Image from '@/core/components/elements/Image/Image' +import { createSlug } from '@/core/utils/slug' const Transaction = ({ id }) => { const { transaction } = useTransaction({ id }) @@ -88,10 +93,7 @@ const Transaction = ({ id }) => { const memoizeVariantGroupCard = useMemo( () => (
- +

Subtotal

{currencyFormat(totalAmount)}

@@ -124,120 +126,6 @@ const Transaction = ({ id }) => { return ( transaction.data?.name && ( <> -
- -
- -
- - {transaction.data?.name} - - {transaction.data?.paymentTerm} - - {transaction.data?.sales} - {transaction.data?.dateOrder} -
- - - -
- - {transaction.data?.purchaseOrderName || '-'} - -
-

Dokumen PO

- -
-
- - - -
Detail Produk
- - {memoizeVariantGroupCard} - - - - - - - -
-

Invoice

-
- {transaction.data?.invoices?.map((invoice, index) => ( - -
-
-

{invoice?.name}

-
- {invoice.amountResidual > 0 ? ( -
Belum Lunas
- ) : ( -
Lunas
- )} -

- {currencyFormat(invoice.amountTotal)} -

-
-
- -
- - ))} - {transaction.data?.invoices?.length === 0 && ( - - Belum ada Invoice - - )} -
-
- - - -
- {transaction.data?.status == 'draft' && ( - - )} - - {transaction.data?.status != 'draft' && ( - - )} -
- { > Ya, Batalkan -
- +
- +
- +
- -
+ + +
+ +
+ +
+ + {transaction.data?.name} + + {transaction.data?.paymentTerm} + + {transaction.data?.sales} + {transaction.data?.dateOrder} +
+ + + +
+ + {transaction.data?.purchaseOrderName || '-'} + +
+

Dokumen PO

+ +
+
+ + + +
Detail Produk
+ + {memoizeVariantGroupCard} + + + + + + + +
+

Invoice

+
+ {transaction.data?.invoices?.map((invoice, index) => ( + +
+
+

{invoice?.name}

+
+ {invoice.amountResidual > 0 ? ( +
Belum Lunas
+ ) : ( +
Lunas
+ )} +

+ {currencyFormat(invoice.amountTotal)} +

+
+
+ +
+ + ))} + {transaction.data?.invoices?.length === 0 && ( + + Belum ada Invoice + + )} +
+
+ + + +
+ {transaction.data?.status == 'draft' && ( + + )} + + {transaction.data?.status != 'draft' && ( + + )} +
+ + + +
+
+ +
+
+

Detail Transaksi

+ +
+ {transaction?.data?.name} + +
+ + +
+
+
Nama Sales
+
: {transaction?.data?.sales}
+ +
Tanggal Transaksi
+
: {transaction?.data?.dateOrder}
+
+
+
Ketentuan Pembayaran
+
: {transaction?.data?.paymentTerm}
+ +
Purchase Order
+
+ : {transaction?.data?.purchaseOrderName}{' '} + +
+
+
+ +
Info Pengiriman
+
+
+
Detail Pelanggan
+ +
+
+
Detail Pengiriman
+ +
+
+
Detail Penagihan
+ +
+
+ +
Rincian Pembelian
+ + + + + + + + + + + + {transaction?.data?.products?.map((product) => ( + + + + + + + + ))} + +
Nama ProdukJumlahHargaDiskonSubtotal
+ + {product?.name} + +
+ + {product?.parent?.name} + +
+ {product?.code}{' '} + {product?.attributes.length > 0 + ? `| ${product?.attributes.join(', ')}` + : ''} +
+
+ 		{product.quantity}{currencyFormat(product.price.price)} + {product.price.discountPercentage > 0 + ? `${product.price.discountPercentage}%` + : ''} + {currencyFormat(product.price.priceDiscount)}
+ +
+
+
Subtotal
+
{currencyFormat(totalAmount)}
+ +
Total Diskon
+
+ {currencyFormat(-totalDiscountAmount)} +
+ +
PPN 11% (Incl.)
+
{currencyFormat(totalAmount * 0.11)}
+ +
Grand Total
+
+ {currencyFormat(transaction.data?.amountTotal)} +
+
+
+ +
Invoice
+
+ {transaction.data?.invoices?.map((invoice, index) => ( + +
+
+

{invoice?.name}

+
+ {invoice.amountResidual > 0 ? ( +
Belum Lunas
+ ) : ( +
Lunas
+ )} +

+ {currencyFormat(invoice.amountTotal)} +

+
+
+ +
+ + ))} +
+ {transaction.data?.invoices?.length === 0 && ( + + Belum ada Invoice + + )} + +
+ {transaction.data?.status == 'draft' && ( + + )} + {transaction.data?.status != 'draft' && ( + + )} +
+
+
+ ) ) @@ -351,10 +519,7 @@ const SectionAddress = ({ address }) => { } const SectionButton = ({ label, active, toggle }) => ( - @@ -369,7 +534,7 @@ const SectionContent = ({ address }) => { fullAddress = fullAddress.join(', ') return ( -
+
{address.name} {address.email || '-'} {address.mobile || '-'} diff --git a/src/lib/transaction/components/Transactions.jsx b/src/lib/transaction/components/Transactions.jsx index 3d3dd533..0a772967 100644 --- a/src/lib/transaction/components/Transactions.jsx +++ b/src/lib/transaction/components/Transactions.jsx @@ -17,6 +17,7 @@ import _ from 'lodash' import Alert from '@/core/components/elements/Alert/Alert' import MobileView from '@/core/components/views/MobileView' import DesktopView from '@/core/components/views/DesktopView' +import Menu from '@/lib/auth/components/Menu' const Transactions = () => { const router = useRouter() @@ -196,10 +197,15 @@ const Transactions = () => {
-
+
+ +
-

Daftar Transaksi

+

+ Daftar Transaksi{' '} + {transactions?.data?.saleOrders ? `(${transactions?.data?.saleOrders.length})` : ''} +

{
- +
-- cgit v1.2.3
No. Transaksi