diff options
| author | Rafi Zadanly <zadanlyr@gmail.com> | 2023-02-22 23:36:47 +0700 |
|---|---|---|
| committer | Rafi Zadanly <zadanlyr@gmail.com> | 2023-02-22 23:36:47 +0700 |
| commit | ac3fdf7be9982e65d8f83a20bc487f8dd62e3bfc (patch) | |
| tree | 687d984708708833999c9b83f1e74e32cf64b1c1 /src/lib/transaction/components | |
| parent | 8cfb615556e67408d7afb6d9694b2407447085ff (diff) | |
fix
Diffstat (limited to 'src/lib/transaction/components')
| -rw-r--r-- | src/lib/transaction/components/Transaction.jsx | 61 | ||||
| -rw-r--r-- | src/lib/transaction/components/Transactions.jsx | 49 |
2 files changed, 90 insertions, 20 deletions
diff --git a/src/lib/transaction/components/Transaction.jsx b/src/lib/transaction/components/Transaction.jsx index 17eacd45..7da33551 100644 --- a/src/lib/transaction/components/Transaction.jsx +++ b/src/lib/transaction/components/Transaction.jsx @@ -120,7 +120,10 @@ const Transaction = ({ id }) => { <div className='font-medium p-4'>Detail Produk</div> <div className='p-4 pt-0 flex flex-col gap-y-3'> - <VariantGroupCard variants={transaction.data?.products} buyMore /> + <VariantGroupCard + variants={transaction.data?.products} + buyMore + /> <div className='flex justify-between mt-3 font-medium'> <p>Total Belanja</p> <p>{currencyFormat(transaction.data?.amountTotal)}</p> @@ -137,7 +140,10 @@ const Transaction = ({ id }) => { <p className='font-medium'>Invoice</p> <div className='flex flex-col gap-y-3 mt-4'> {transaction.data?.invoices?.map((invoice, index) => ( - <Link href={`/my/invoice/${invoice.id}`} key={index}> + <Link + href={`/my/invoice/${invoice.id}`} + key={index} + > <div className='shadow rounded-md p-4 text-gray_r-12 font-normal flex justify-between'> <div> <p className='mb-2'>{invoice?.name}</p> @@ -157,7 +163,10 @@ const Transaction = ({ id }) => { </Link> ))} {transaction.data?.invoices?.length === 0 && ( - <Alert type='info' className='text-center'> + <Alert + type='info' + className='text-center' + > Belum ada Invoice </Alert> )} @@ -168,7 +177,10 @@ const Transaction = ({ id }) => { <div className='p-4 pt-0'> {transaction.data?.status == 'draft' && ( - <button className='btn-yellow w-full mt-4' onClick={checkout}> + <button + className='btn-yellow w-full mt-4' + onClick={checkout} + > Lanjutkan Transaksi </button> )} @@ -207,26 +219,50 @@ const Transaction = ({ id }) => { > Ya, Batalkan </button> - <button className='btn-light flex-1' type='button' onClick={closeCancelTransaction}> + <button + className='btn-light flex-1' + type='button' + onClick={closeCancelTransaction} + > Batal </button> </div> </BottomPopup> - <BottomPopup title='Upload PO' close={closeUploadPo} active={uploadPo}> + <BottomPopup + title='Upload PO' + close={closeUploadPo} + active={uploadPo} + > <div> <label>Nomor PO</label> - <input type='text' className='form-input mt-3' ref={poNumber} /> + <input + type='text' + className='form-input mt-3' + ref={poNumber} + /> </div> <div className='mt-4'> <label>Dokumen PO</label> - <input type='file' className='form-input mt-3 py-2' ref={poFile} /> + <input + type='file' + className='form-input mt-3 py-2' + ref={poFile} + /> </div> <div className='grid grid-cols-2 gap-x-3 mt-6'> - <button type='button' className='btn-light w-full' onClick={closeUploadPo}> + <button + type='button' + className='btn-light w-full' + onClick={closeUploadPo} + > Batal </button> - <button type='button' className='btn-solid-red w-full' onClick={submitUploadPo}> + <button + type='button' + className='btn-solid-red w-full' + onClick={submitUploadPo} + > Upload </button> </div> @@ -279,7 +315,10 @@ const SectionAddress = ({ address }) => { } const SectionButton = ({ label, active, toggle }) => ( - <button className='p-4 font-medium flex justify-between w-full' onClick={toggle}> + <button + className='p-4 font-medium flex justify-between w-full' + onClick={toggle} + > <span>{label}</span> {active ? <ChevronUpIcon className='w-5' /> : <ChevronDownIcon className='w-5' />} </button> diff --git a/src/lib/transaction/components/Transactions.jsx b/src/lib/transaction/components/Transactions.jsx index f582319d..ccbdede2 100644 --- a/src/lib/transaction/components/Transactions.jsx +++ b/src/lib/transaction/components/Transactions.jsx @@ -56,7 +56,10 @@ const Transactions = () => { return ( <div className='p-4 flex flex-col gap-y-4'> - <form className='flex gap-x-3' onSubmit={handleSubmit}> + <form + className='flex gap-x-3' + onSubmit={handleSubmit} + > <input type='text' className='form-input' @@ -64,7 +67,10 @@ const Transactions = () => { value={inputQuery} onChange={(e) => setInputQuery(e.target.value)} /> - <button className='btn-light bg-transparent px-3' type='submit'> + <button + className='btn-light bg-transparent px-3' + type='submit' + > <MagnifyingGlassIcon className='w-6' /> </button> </form> @@ -76,13 +82,19 @@ const Transactions = () => { )} {!transactions.isLoading && transactions.data?.saleOrders?.length === 0 && ( - <Alert type='info' className='text-center'> + <Alert + type='info' + className='text-center' + > Tidak ada data transaksi </Alert> )} {transactions.data?.saleOrders?.map((saleOrder, index) => ( - <div className='p-4 shadow border border-gray_r-3 rounded-md' key={index}> + <div + className='p-4 shadow border border-gray_r-3 rounded-md' + key={index} + > <div className='grid grid-cols-2'> <Link href={`/my/transaction/${saleOrder.id}`}> <span className='text-caption-2 text-gray_r-11'>No. Transaksi</span> @@ -90,7 +102,10 @@ const Transactions = () => { </Link> <div className='flex gap-x-1 justify-end'> <TransactionStatusBadge status={saleOrder.status} /> - <EllipsisVerticalIcon className='w-5 h-5' onClick={() => setToOthers(saleOrder)} /> + <EllipsisVerticalIcon + className='w-5 h-5' + onClick={() => setToOthers(saleOrder)} + /> </div> </div> <Link href={`/my/transaction/${saleOrder.id}`}> @@ -129,7 +144,11 @@ const Transactions = () => { className='mt-2 mb-2' /> - <BottomPopup title='Lainnya' active={toOthers} close={() => setToOthers(null)}> + <BottomPopup + title='Lainnya' + active={toOthers} + close={() => setToOthers(null)} + > <div className='flex flex-col gap-y-4 mt-2'> <button className='text-left disabled:opacity-60' @@ -164,16 +183,28 @@ const Transactions = () => { </div> </BottomPopup> - <BottomPopup active={toCancel} close={() => setToCancel(null)} title='Batalkan Transaksi'> + <BottomPopup + active={toCancel} + close={() => setToCancel(null)} + title='Batalkan Transaksi' + > <div className='leading-7 text-gray_r-12/80'> Apakah anda yakin membatalkan transaksi{' '} <span className='underline'>{toCancel?.name}</span>? </div> <div className='flex mt-6 gap-x-4'> - <button className='btn-solid-red flex-1' type='button' onClick={submitCancelTransaction}> + <button + className='btn-solid-red flex-1' + type='button' + onClick={submitCancelTransaction} + > Ya, Batalkan </button> - <button className='btn-light flex-1' type='button' onClick={() => setToCancel(null)}> + <button + className='btn-light flex-1' + type='button' + onClick={() => setToCancel(null)} + > Batal </button> </div> |
