From 9622bff4d4902fcef81214236cc7ff035163e5e7 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Wed, 13 Nov 2024 16:46:14 +0700
Subject: <iman> pengajuan tempo

---
 src/lib/tempo/components/Tempo.jsx | 277 +++++++++++++++++++++++++++++++++++++
 1 file changed, 277 insertions(+)
 create mode 100644 src/lib/tempo/components/Tempo.jsx

(limited to 'src/lib/tempo/components/Tempo.jsx')

diff --git a/src/lib/tempo/components/Tempo.jsx b/src/lib/tempo/components/Tempo.jsx
new file mode 100644
index 00000000..9b68251c
--- /dev/null
+++ b/src/lib/tempo/components/Tempo.jsx
@@ -0,0 +1,277 @@
+import {
+  CheckIcon,
+  ClockIcon,
+  EllipsisVerticalIcon,
+  MagnifyingGlassIcon,
+} from '@heroicons/react/24/outline';
+import { toQuery } from 'lodash-contrib';
+import _ from 'lodash';
+import { useRouter } from 'next/router';
+import { useState } from 'react';
+import useInvoices from '../hooks/useInvoices';
+import Spinner from '@/core/components/elements/Spinner/Spinner';
+import Alert from '@/core/components/elements/Alert/Alert';
+import Pagination from '@/core/components/elements/Pagination/Pagination';
+import Link from '@/core/components/elements/Link/Link';
+import currencyFormat from '@/core/utils/currencyFormat';
+import BottomPopup from '@/core/components/elements/Popup/BottomPopup';
+import { downloadInvoice, downloadTaxInvoice } from '../utils/invoices';
+import MobileView from '@/core/components/views/MobileView';
+import DesktopView from '@/core/components/views/DesktopView';
+import Menu from '@/lib/auth/components/Menu';
+
+const Tempo = () => {
+  const router = useRouter();
+  const { q = '', page = 1 } = router.query;
+
+  const limit = 15;
+
+  const query = {
+    name: q,
+    offset: (page - 1) * limit,
+    limit,
+  };
+  const { invoices } = useInvoices({ query });
+
+  const [inputQuery, setInputQuery] = useState(q);
+  const [toOthers, setToOthers] = useState(null);
+
+  const pageCount = Math.ceil(invoices?.data?.invoiceTotal / limit);
+  let pageQuery = _.omit(query, ['limit', 'offset']);
+  pageQuery = _.pickBy(pageQuery, _.identity);
+  pageQuery = toQuery(pageQuery);
+
+  const handleSubmit = (e) => {
+    e.preventDefault();
+    router.push(`/my/invoices?q=${inputQuery}`);
+  };
+
+  return (
+    <>
+      <MobileView>
+        <div className='p-4 flex flex-col gap-y-4'>
+          <form className='flex gap-x-3' onSubmit={handleSubmit}>
+            <input
+              type='text'
+              className='form-input'
+              placeholder='Cari Invoice...'
+              value={inputQuery}
+              onChange={(e) => setInputQuery(e.target.value)}
+            />
+            <button className='btn-light bg-transparent px-3' type='submit'>
+              <MagnifyingGlassIcon className='w-6' />
+            </button>
+          </form>
+
+          {invoices.isLoading && (
+            <div className='flex justify-center my-4'>
+              <Spinner className='w-6 text-gray_r-12/50 fill-gray_r-12' />
+            </div>
+          )}
+
+          {!invoices.isLoading && invoices.data?.invoices?.length === 0 && (
+            <Alert type='info' className='text-center'>
+              Tidak ada invoice
+            </Alert>
+          )}
+
+          {invoices.data?.invoices?.map((invoice, index) => (
+            <div
+              className='p-4 shadow border border-gray_r-3 rounded-md'
+              key={index}
+            >
+              <div className='grid grid-cols-2'>
+                <Link href={`${router.pathname}/${invoice.id}`}>
+                  <span className='text-caption-2 text-gray_r-11'>
+                    No. Invoice
+                  </span>
+                  <h2 className='text-danger-500 mt-1'>{invoice.name}</h2>
+                </Link>
+                <div className='flex gap-x-1 justify-end'>
+                  {invoice.amountResidual > 0 ? (
+                    <div className='badge-solid-red h-fit ml-auto'>
+                      Belum Lunas
+                    </div>
+                  ) : (
+                    <div className='badge-solid-green h-fit ml-auto'>Lunas</div>
+                  )}
+                  <EllipsisVerticalIcon
+                    className='w-5 h-5'
+                    onClick={() => setToOthers(invoice)}
+                  />
+                </div>
+              </div>
+              <Link href={`${router.pathname}/${invoice.id}`}>
+                <div className='grid grid-cols-2 text-caption-2 text-gray_r-11 mt-2 font-normal'>
+                  <p>{invoice.invoiceDate}</p>
+                  <p className='text-right'>{invoice.paymentTerm}</p>
+                </div>
+                <hr className='my-3' />
+                <div className='grid grid-cols-2'>
+                  <div>
+                    <span className='text-caption-2 text-gray_r-11'>
+                      No. Purchase Order
+                    </span>
+                    <p className='mt-1 font-medium text-gray_r-12'>
+                      {invoice.purchaseOrderName || '-'}
+                    </p>
+                  </div>
+                  <div className='text-right'>
+                    <span className='text-caption-2 text-gray_r-11'>
+                      Total Invoice
+                    </span>
+                    <p className='mt-1 font-medium text-gray_r-12'>
+                      {currencyFormat(invoice.amountTotal)}
+                    </p>
+                  </div>
+                </div>
+              </Link>
+              {invoice.efaktur ? (
+                <div className='badge-green h-fit mt-3 ml-auto flex items-center gap-x-0.5'>
+                  <CheckIcon className='w-4 stroke-2' />
+                  Faktur Pajak
+                </div>
+              ) : (
+                <div className='badge-red h-fit mt-3 ml-auto flex items-center gap-x-0.5'>
+                  <ClockIcon className='w-4 stroke-2' />
+                  Faktur Pajak
+                </div>
+              )}
+            </div>
+          ))}
+
+          <Pagination
+            pageCount={pageCount}
+            currentPage={parseInt(page)}
+            url={`/my/invoices${pageQuery}`}
+            className='mt-2 mb-2'
+          />
+
+          <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'
+                onClick={() => {
+                  downloadInvoice(toOthers);
+                  setToOthers(null);
+                }}
+              >
+                Download Invoice
+              </button>
+              <button
+                className='text-left disabled:opacity-60'
+                disabled={!toOthers?.efaktur}
+                onClick={() => {
+                  downloadTaxInvoice(toOthers);
+                  setToOthers(null);
+                }}
+              >
+                Download Faktur Pajak
+              </button>
+            </div>
+          </BottomPopup>
+        </div>
+      </MobileView>
+
+      <DesktopView>
+        <div className='container mx-auto flex py-10'>
+          <div className='w-3/12 pr-4'>
+            <Menu />
+          </div>
+          <div className='w-9/12 p-4 bg-white border border-gray_r-6 rounded'>
+            <div className='flex mb-6 items-center justify-between'>
+              <h1 className='text-title-sm font-semibold'>
+                Invoice & Faktur Pajak{' '}
+                {invoices?.data?.invoices
+                  ? `(${invoices?.data?.invoices.length})`
+                  : ''}
+              </h1>
+              <form className='flex gap-x-2' onSubmit={handleSubmit}>
+                <input
+                  type='text'
+                  className='form-input'
+                  placeholder='Cari Invoice...'
+                  value={inputQuery}
+                  onChange={(e) => setInputQuery(e.target.value)}
+                />
+                <button className='btn-light bg-transparent px-3' type='submit'>
+                  <MagnifyingGlassIcon className='w-6' />
+                </button>
+              </form>
+            </div>
+
+            <table className='table-data'>
+              <thead>
+                <tr>
+                  <th>No. Invoice</th>
+                  <th>No. PO</th>
+                  <th>Tanggal</th>
+                  <th className='!text-left'>Salesperson</th>
+                  <th>Status</th>
+                  <th className='!text-left'>Total</th>
+                </tr>
+              </thead>
+              <tbody>
+                {invoices.isLoading && (
+                  <tr>
+                    <td colSpan={6}>
+                      <div className='flex justify-center my-2'>
+                        <Spinner className='w-6 text-gray_r-12/50 fill-gray_r-12' />
+                      </div>
+                    </td>
+                  </tr>
+                )}
+                {!invoices.isLoading &&
+                  (!invoices?.data?.invoices ||
+                    invoices?.data?.invoices?.length == 0) && (
+                    <tr>
+                      <td colSpan={6}>Tidak ada invoice</td>
+                    </tr>
+                  )}
+                {invoices.data?.invoices?.map((invoice) => (
+                  <tr key={invoice.id}>
+                    <td>
+                      <Link href={`${router.pathname}/${invoice.id}`}>
+                        {invoice.name}
+                      </Link>
+                    </td>
+                    <td>{invoice.purchaseOrderName || '-'}</td>
+                    <td>{invoice.invoiceDate}</td>
+                    <td className='!text-left'>{invoice.sales}</td>
+                    <td>
+                      {invoice.amountResidual > 0 ? (
+                        <div className='badge-solid-red h-fit mx-auto'>
+                          Belum Lunas
+                        </div>
+                      ) : (
+                        <div className='badge-solid-green h-fit mx-auto'>
+                          Lunas
+                        </div>
+                      )}
+                    </td>
+                    <td className='!text-left'>
+                      {currencyFormat(invoice.amountTotal)}
+                    </td>
+                  </tr>
+                ))}
+              </tbody>
+            </table>
+
+            <Pagination
+              pageCount={pageCount}
+              currentPage={parseInt(page)}
+              url={`/my/invoices${pageQuery}`}
+              className='mt-2 mb-2'
+            />
+          </div>
+        </div>
+      </DesktopView>
+    </>
+  );
+};
+
+export default Tempo;
-- 
cgit v1.2.3


From f481bae4d28b770d85ca2340cff60acbec70d0ee Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Thu, 14 Nov 2024 09:45:15 +0700
Subject: <iman>

---
 src/lib/tempo/components/Tempo.jsx | 20 ++++++++++++--------
 1 file changed, 12 insertions(+), 8 deletions(-)

(limited to 'src/lib/tempo/components/Tempo.jsx')

diff --git a/src/lib/tempo/components/Tempo.jsx b/src/lib/tempo/components/Tempo.jsx
index 9b68251c..c3cf621c 100644
--- a/src/lib/tempo/components/Tempo.jsx
+++ b/src/lib/tempo/components/Tempo.jsx
@@ -8,14 +8,17 @@ import { toQuery } from 'lodash-contrib';
 import _ from 'lodash';
 import { useRouter } from 'next/router';
 import { useState } from 'react';
-import useInvoices from '../hooks/useInvoices';
+import useInvoices from '../../invoice/hooks/useInvoices';
 import Spinner from '@/core/components/elements/Spinner/Spinner';
 import Alert from '@/core/components/elements/Alert/Alert';
 import Pagination from '@/core/components/elements/Pagination/Pagination';
 import Link from '@/core/components/elements/Link/Link';
 import currencyFormat from '@/core/utils/currencyFormat';
 import BottomPopup from '@/core/components/elements/Popup/BottomPopup';
-import { downloadInvoice, downloadTaxInvoice } from '../utils/invoices';
+import {
+  downloadInvoice,
+  downloadTaxInvoice,
+} from '../../invoice/utils/invoices';
 import MobileView from '@/core/components/views/MobileView';
 import DesktopView from '@/core/components/views/DesktopView';
 import Menu from '@/lib/auth/components/Menu';
@@ -183,13 +186,14 @@ const Tempo = () => {
             <Menu />
           </div>
           <div className='w-9/12 p-4 bg-white border border-gray_r-6 rounded'>
+            <div className='flex flex-col mb-6 items-start justify-start'>
+              <h1 className='text-title-sm font-semibold'>Pembayaran Tempo</h1>
+              <p>
+                Jenis Tempo Pembayaran Anda adalah :{' '}
+                <span className='badge-solid-green px-2'>7 Hari</span>
+              </p>
+            </div>
             <div className='flex mb-6 items-center justify-between'>
-              <h1 className='text-title-sm font-semibold'>
-                Invoice & Faktur Pajak{' '}
-                {invoices?.data?.invoices
-                  ? `(${invoices?.data?.invoices.length})`
-                  : ''}
-              </h1>
               <form className='flex gap-x-2' onSubmit={handleSubmit}>
                 <input
                   type='text'
-- 
cgit v1.2.3


From 79691a1ed94bcad877c3d5585e8ae9787bd18de0 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Thu, 14 Nov 2024 17:13:32 +0700
Subject: <iman> add penghajuan tempo

---
 src/lib/tempo/components/Tempo.jsx | 268 +++++++++++++++++++++++--------------
 1 file changed, 169 insertions(+), 99 deletions(-)

(limited to 'src/lib/tempo/components/Tempo.jsx')

diff --git a/src/lib/tempo/components/Tempo.jsx b/src/lib/tempo/components/Tempo.jsx
index c3cf621c..3f6e36d1 100644
--- a/src/lib/tempo/components/Tempo.jsx
+++ b/src/lib/tempo/components/Tempo.jsx
@@ -4,10 +4,10 @@ import {
   EllipsisVerticalIcon,
   MagnifyingGlassIcon,
 } from '@heroicons/react/24/outline';
-import { toQuery } from 'lodash-contrib';
+import { div, toQuery } from 'lodash-contrib';
 import _ from 'lodash';
 import { useRouter } from 'next/router';
-import { useState } from 'react';
+import { useState, useEffect } from 'react';
 import useInvoices from '../../invoice/hooks/useInvoices';
 import Spinner from '@/core/components/elements/Spinner/Spinner';
 import Alert from '@/core/components/elements/Alert/Alert';
@@ -22,8 +22,11 @@ import {
 import MobileView from '@/core/components/views/MobileView';
 import DesktopView from '@/core/components/views/DesktopView';
 import Menu from '@/lib/auth/components/Menu';
-
+import odooApi from '@/core/api/odooApi';
+import { getAuth } from '@/core/utils/auth';
+import ProgressBar from '@ramonak/react-progress-bar';
 const Tempo = () => {
+  const auth = getAuth();
   const router = useRouter();
   const { q = '', page = 1 } = router.query;
 
@@ -36,6 +39,8 @@ const Tempo = () => {
   };
   const { invoices } = useInvoices({ query });
 
+  const [isLoading, setIsLoading] = useState(true);
+  const [tempo, setTempo] = useState([]);
   const [inputQuery, setInputQuery] = useState(q);
   const [toOthers, setToOthers] = useState(null);
 
@@ -48,9 +53,169 @@ const Tempo = () => {
     e.preventDefault();
     router.push(`/my/invoices?q=${inputQuery}`);
   };
-
+  useEffect(() => {
+    const loadTempo = async () => {
+      setIsLoading(true);
+      const dataTempo = await odooApi(
+        'GET',
+        `/api/v1/check/${auth.parentId}/tempo`
+      );
+      setTempo(dataTempo);
+      setIsLoading(false);
+    };
+    loadTempo();
+  }, []);
+  const limitTempo = Math.round(
+    parseInt(tempo.amountDue + tempo.remainingLimit)
+  );
+  const amountDue = Math.round(parseInt(tempo.amountDue));
+  console.log('tempo', tempo);
+  const getLabel = () => {
+    if (Math.round((amountDue / limitTempo) * 100) >= 100)
+      return 'Limit Tempo mencapai batas';
+    if (Math.round((amountDue / limitTempo) * 100) >= 50) return 'Hampir Habis';
+    return '';
+  };
   return (
     <>
+      <DesktopView>
+        <div className='container mx-auto flex py-10'>
+          <div className='w-3/12 pr-4'>
+            <Menu />
+          </div>
+          <div className='w-9/12 p-4 bg-white border border-gray_r-6 rounded'>
+            <div className='flex flex-col mb-6 items-start justify-start'>
+              <h1 className='text-title-sm font-semibold'>Pembayaran Tempo</h1>
+              <p>
+                Jenis Tempo Pembayaran Anda adalah :{' '}
+                {!isLoading && (
+                  <span className='badge-solid-green px-2'>
+                    {tempo.paymentTerm}
+                  </span>
+                )}
+              </p>
+            </div>
+            <div className='grid grid-flow-col gap-4 mb-4'>
+              <div className='border  w-full p-4'>
+                <p>Limit Tempo Terpakai</p>
+                <h1>{!isLoading && currencyFormat(amountDue)}</h1>
+              </div>
+              <div className='border w-full p-4'>
+                <p>Limit Tempo</p>
+                <h1>{!isLoading && currencyFormat(limitTempo)}</h1>
+              </div>
+            </div>
+
+            <div className='flex gap-2 flex-col'>
+              <ProgressBar
+                completed={amountDue}
+                bgColor='#ef4444'
+                labelAlignment='outside'
+                isLabelVisible={false}
+                baseBgColor='#E5E7EB'
+                labelColor='#e80909'
+                labelSize='0'
+                maxCompleted={limitTempo}
+                height='10px'
+              />
+              <span className='flex justify-end opacity-75 font-semibold text-red-500'>
+                {getLabel()}
+              </span>
+            </div>
+
+            <div className='flex mb-6 items-center justify-between mt-4'>
+              <form className='flex gap-x-2' onSubmit={handleSubmit}>
+                <button className='btn-light bg-transparent px-3' type='submit'>
+                  <MagnifyingGlassIcon className='w-6' />
+                </button>
+                <input
+                  type='text'
+                  className='form-input'
+                  placeholder='Cari Nomor Pesanan anda'
+                  value={inputQuery}
+                  onChange={(e) => setInputQuery(e.target.value)}
+                />
+              </form>
+            </div>
+
+            <table className='table-data'>
+              <thead>
+                <tr>
+                  <th>No. Invoice</th>
+                  <th>No. Transaksi</th>
+                  <th className='!text-left'>Salesperson</th>
+                  <th>Tanggal</th>
+                  <th>Jatuh Tempo</th>
+                  <th>Status</th>
+                  <th className='!text-left'>Total</th>
+                </tr>
+              </thead>
+              <tbody>
+                {invoices.isLoading && (
+                  <tr>
+                    <td colSpan={6}>
+                      <div className='flex justify-center my-2'>
+                        <Spinner className='w-6 text-gray_r-12/50 fill-gray_r-12' />
+                      </div>
+                    </td>
+                  </tr>
+                )}
+                {!invoices.isLoading &&
+                  (!invoices?.data?.invoices ||
+                    invoices?.data?.invoices?.length == 0) && (
+                    <tr>
+                      <td colSpan={6}>Tidak ada invoice</td>
+                    </tr>
+                  )}
+                {invoices.data?.invoices?.map((invoice) => (
+                  <tr key={invoice.id}>
+                    <td>
+                      <Link href={`${router.pathname}/${invoice.id}`}>
+                        {invoice.name}
+                      </Link>
+                    </td>
+                    <td>{invoice.purchaseOrderName || '-'}</td>
+                    <td className='!text-left'>{invoice.sales}</td>
+                    <td>{invoice.invoiceDate}</td>
+                    <td>
+                      {invoice.amountResidual > 0 ? (
+                        <div className='badge-solid-red h-fit mx-auto'>
+                          Belum Lunas
+                        </div>
+                      ) : (
+                        <div className='badge-solid-green h-fit mx-auto'>
+                          Lunas
+                        </div>
+                      )}
+                    </td>
+                    <td>
+                      {invoice.amountResidual > 0 ? (
+                        <div className='badge-solid-red h-fit mx-auto'>
+                          Belum Lunas
+                        </div>
+                      ) : (
+                        <div className='badge-solid-green h-fit mx-auto'>
+                          Lunas
+                        </div>
+                      )}
+                    </td>
+                    <td className='!text-left'>
+                      {currencyFormat(invoice.amountTotal)}
+                    </td>
+                  </tr>
+                ))}
+              </tbody>
+            </table>
+
+            <Pagination
+              pageCount={pageCount}
+              currentPage={parseInt(page)}
+              url={`/my/invoices${pageQuery}`}
+              className='mt-2 mb-2'
+            />
+          </div>
+        </div>
+      </DesktopView>
       <MobileView>
         <div className='p-4 flex flex-col gap-y-4'>
           <form className='flex gap-x-3' onSubmit={handleSubmit}>
@@ -179,101 +344,6 @@ const Tempo = () => {
           </BottomPopup>
         </div>
       </MobileView>
-
-      <DesktopView>
-        <div className='container mx-auto flex py-10'>
-          <div className='w-3/12 pr-4'>
-            <Menu />
-          </div>
-          <div className='w-9/12 p-4 bg-white border border-gray_r-6 rounded'>
-            <div className='flex flex-col mb-6 items-start justify-start'>
-              <h1 className='text-title-sm font-semibold'>Pembayaran Tempo</h1>
-              <p>
-                Jenis Tempo Pembayaran Anda adalah :{' '}
-                <span className='badge-solid-green px-2'>7 Hari</span>
-              </p>
-            </div>
-            <div className='flex mb-6 items-center justify-between'>
-              <form className='flex gap-x-2' onSubmit={handleSubmit}>
-                <input
-                  type='text'
-                  className='form-input'
-                  placeholder='Cari Invoice...'
-                  value={inputQuery}
-                  onChange={(e) => setInputQuery(e.target.value)}
-                />
-                <button className='btn-light bg-transparent px-3' type='submit'>
-                  <MagnifyingGlassIcon className='w-6' />
-                </button>
-              </form>
-            </div>
-
-            <table className='table-data'>
-              <thead>
-                <tr>
-                  <th>No. Invoice</th>
-                  <th>No. PO</th>
-                  <th>Tanggal</th>
-                  <th className='!text-left'>Salesperson</th>
-                  <th>Status</th>
-                  <th className='!text-left'>Total</th>
-                </tr>
-              </thead>
-              <tbody>
-                {invoices.isLoading && (
-                  <tr>
-                    <td colSpan={6}>
-                      <div className='flex justify-center my-2'>
-                        <Spinner className='w-6 text-gray_r-12/50 fill-gray_r-12' />
-                      </div>
-                    </td>
-                  </tr>
-                )}
-                {!invoices.isLoading &&
-                  (!invoices?.data?.invoices ||
-                    invoices?.data?.invoices?.length == 0) && (
-                    <tr>
-                      <td colSpan={6}>Tidak ada invoice</td>
-                    </tr>
-                  )}
-                {invoices.data?.invoices?.map((invoice) => (
-                  <tr key={invoice.id}>
-                    <td>
-                      <Link href={`${router.pathname}/${invoice.id}`}>
-                        {invoice.name}
-                      </Link>
-                    </td>
-                    <td>{invoice.purchaseOrderName || '-'}</td>
-                    <td>{invoice.invoiceDate}</td>
-                    <td className='!text-left'>{invoice.sales}</td>
-                    <td>
-                      {invoice.amountResidual > 0 ? (
-                        <div className='badge-solid-red h-fit mx-auto'>
-                          Belum Lunas
-                        </div>
-                      ) : (
-                        <div className='badge-solid-green h-fit mx-auto'>
-                          Lunas
-                        </div>
-                      )}
-                    </td>
-                    <td className='!text-left'>
-                      {currencyFormat(invoice.amountTotal)}
-                    </td>
-                  </tr>
-                ))}
-              </tbody>
-            </table>
-
-            <Pagination
-              pageCount={pageCount}
-              currentPage={parseInt(page)}
-              url={`/my/invoices${pageQuery}`}
-              className='mt-2 mb-2'
-            />
-          </div>
-        </div>
-      </DesktopView>
     </>
   );
 };
-- 
cgit v1.2.3


From cf92e065f057737071e6cd7c666a4f1c475bb613 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Fri, 15 Nov 2024 14:21:17 +0700
Subject: <iman> update pengajuan tempo

---
 src/lib/tempo/components/Tempo.jsx | 305 ++++++++++++++++++++++++-------------
 1 file changed, 201 insertions(+), 104 deletions(-)

(limited to 'src/lib/tempo/components/Tempo.jsx')

diff --git a/src/lib/tempo/components/Tempo.jsx b/src/lib/tempo/components/Tempo.jsx
index 3f6e36d1..ef516c64 100644
--- a/src/lib/tempo/components/Tempo.jsx
+++ b/src/lib/tempo/components/Tempo.jsx
@@ -4,6 +4,7 @@ import {
   EllipsisVerticalIcon,
   MagnifyingGlassIcon,
 } from '@heroicons/react/24/outline';
+import { Skeleton } from '@chakra-ui/react';
 import { div, toQuery } from 'lodash-contrib';
 import _ from 'lodash';
 import { useRouter } from 'next/router';
@@ -25,33 +26,37 @@ import Menu from '@/lib/auth/components/Menu';
 import odooApi from '@/core/api/odooApi';
 import { getAuth } from '@/core/utils/auth';
 import ProgressBar from '@ramonak/react-progress-bar';
+import FooterBanner from '~/modules/footer-banner';
 const Tempo = () => {
   const auth = getAuth();
   const router = useRouter();
-  const { q = '', page = 1 } = router.query;
+  const { q = '', page = 1, limit = 15 } = router.query;
 
-  const limit = 15;
+  const [pageNew, setPageNew] = useState(page);
+  const [limitNew, setLimitNew] = useState(limit);
 
   const query = {
     name: q,
-    offset: (page - 1) * limit,
-    limit,
+    offset: (pageNew - 1) * limitNew,
+    limit: limitNew,
   };
   const { invoices } = useInvoices({ query });
-
+  console.log('invoices', invoices);
   const [isLoading, setIsLoading] = useState(true);
   const [tempo, setTempo] = useState([]);
   const [inputQuery, setInputQuery] = useState(q);
   const [toOthers, setToOthers] = useState(null);
 
-  const pageCount = Math.ceil(invoices?.data?.invoiceTotal / limit);
-  let pageQuery = _.omit(query, ['limit', 'offset']);
+  const pageCount = Math.ceil(invoices?.data?.invoiceTotal / limitNew);
+  let pageQuery = _.omit(query, ['limitNew', 'offset']);
+  console.log('pageQuery1', pageQuery);
   pageQuery = _.pickBy(pageQuery, _.identity);
+  console.log('pageQuery2', pageQuery);
   pageQuery = toQuery(pageQuery);
-
+  console.log('pageQuery3', pageQuery);
   const handleSubmit = (e) => {
     e.preventDefault();
-    router.push(`/my/invoices?q=${inputQuery}`);
+    router.push(`/my/tempo?q=${inputQuery}`);
   };
   useEffect(() => {
     const loadTempo = async () => {
@@ -76,6 +81,8 @@ const Tempo = () => {
     if (Math.round((amountDue / limitTempo) * 100) >= 50) return 'Hampir Habis';
     return '';
   };
+  const startItem = 1 + (pageNew - 1) * limitNew;
+  const endItem = Math.min(limitNew * pageNew, invoices?.data?.invoiceTotal);
   return (
     <>
       <DesktopView>
@@ -83,26 +90,44 @@ const Tempo = () => {
           <div className='w-3/12 pr-4'>
             <Menu />
           </div>
-          <div className='w-9/12 p-4 bg-white border border-gray_r-6 rounded'>
+          <div className='w-9/12 p-4 bg-white border border-gray_r-6 rounded flex flex-col gap-y-4'>
             <div className='flex flex-col mb-6 items-start justify-start'>
               <h1 className='text-title-sm font-semibold'>Pembayaran Tempo</h1>
-              <p>
-                Jenis Tempo Pembayaran Anda adalah :{' '}
-                {!isLoading && (
-                  <span className='badge-solid-green px-2'>
-                    {tempo.paymentTerm}
-                  </span>
-                )}
+              <p className='flex flex-row gap-2 w-full'>
+                Jenis Tempo Pembayaran Anda adalah{' '}
+                <Skeleton
+                  isLoaded={!isLoading}
+                  h='fit'
+                  w={32}
+                  className='badge-solid-green px-2 text-sm flex items-center justify-center font-thin'
+                >
+                  {' '}
+                  {tempo.paymentTerm}
+                </Skeleton>
               </p>
             </div>
             <div className='grid grid-flow-col gap-4 mb-4'>
               <div className='border  w-full p-4'>
                 <p>Limit Tempo Terpakai</p>
-                <h1>{!isLoading && currencyFormat(amountDue)}</h1>
+                <Skeleton
+                  isLoaded={!isLoading}
+                  h='36px'
+                  // w={16}
+                  className='text-3xl font-semibold'
+                >
+                  {currencyFormat(amountDue)}
+                </Skeleton>
               </div>
               <div className='border w-full p-4'>
                 <p>Limit Tempo</p>
-                <h1>{!isLoading && currencyFormat(limitTempo)}</h1>
+                <Skeleton
+                  isLoaded={!isLoading}
+                  h='36px'
+                  // w={16}
+                  className='text-3xl font-semibold'
+                >
+                  {currencyFormat(limitTempo)}
+                </Skeleton>
               </div>
             </div>
 
@@ -122,102 +147,174 @@ const Tempo = () => {
                 {getLabel()}
               </span>
             </div>
+            <div className='border p-4 rounded mt-4'>
+              <div className='flex mb-6 items-center justify-between mt-4'>
+                <form className='flex' onSubmit={handleSubmit}>
+                  <button className='bg-gray_r-2 px-3' type='submit'>
+                    <MagnifyingGlassIcon className='w-6' />
+                  </button>
+                  <input
+                    type='text'
+                    className='form-input bg-gray_r-2 border-none'
+                    placeholder='Cari Invoice...'
+                    value={inputQuery}
+                    onChange={(e) => setInputQuery(e.target.value)}
+                  />
+                </form>
+                {!invoices.isLoading && (
+                  <div className='flex flex-row gap-4 items-center justify-center'>
+                    <p>
+                      Menampilkan {startItem}-{endItem} dari{' '}
+                      {invoices?.data?.invoiceTotal}
+                    </p>
+                    <select
+                      id='limitSelect'
+                      value={limitNew}
+                      onChange={(e) => {
+                        setLimitNew(Number(e.target.value));
+                        setPageNew(1);
+                      }}
+                      className='border p-2'
+                    >
+                      <option value={10}>10</option>
+                      <option value={15}>15</option>
+                      <option value={20}>20</option>
+                    </select>
+                  </div>
+                )}
+              </div>
 
-            <div className='flex mb-6 items-center justify-between mt-4'>
-              <form className='flex gap-x-2' onSubmit={handleSubmit}>
-                <button className='btn-light bg-transparent px-3' type='submit'>
-                  <MagnifyingGlassIcon className='w-6' />
-                </button>
-                <input
-                  type='text'
-                  className='form-input'
-                  placeholder='Cari Nomor Pesanan anda'
-                  value={inputQuery}
-                  onChange={(e) => setInputQuery(e.target.value)}
-                />
-              </form>
-            </div>
-
-            <table className='table-data'>
-              <thead>
-                <tr>
-                  <th>No. Invoice</th>
-                  <th>No. Transaksi</th>
-                  <th className='!text-left'>Salesperson</th>
-                  <th>Tanggal</th>
-                  <th>Jatuh Tempo</th>
-                  <th>Status</th>
-                  <th className='!text-left'>Total</th>
-                </tr>
-              </thead>
-              <tbody>
-                {invoices.isLoading && (
+              <table className='table-data'>
+                <thead>
                   <tr>
-                    <td colSpan={6}>
-                      <div className='flex justify-center my-2'>
-                        <Spinner className='w-6 text-gray_r-12/50 fill-gray_r-12' />
-                      </div>
-                    </td>
+                    <th>No. Invoice</th>
+                    <th>No. Transaksi</th>
+                    <th className='!text-left'>Salesperson</th>
+                    <th>Tanggal</th>
+                    <th>Jatuh Tempo</th>
+                    <th>Status</th>
+                    <th className='!text-left'>Total</th>
                   </tr>
-                )}
-                {!invoices.isLoading &&
-                  (!invoices?.data?.invoices ||
-                    invoices?.data?.invoices?.length == 0) && (
+                </thead>
+                <tbody>
+                  {invoices.isLoading && (
                     <tr>
-                      <td colSpan={6}>Tidak ada invoice</td>
+                      <td colSpan={6}>
+                        <div className='flex justify-center my-2'>
+                          <Spinner className='w-6 text-gray_r-12/50 fill-gray_r-12' />
+                        </div>
+                      </td>
                     </tr>
                   )}
-                {invoices.data?.invoices?.map((invoice) => (
-                  <tr key={invoice.id}>
-                    <td>
-                      <Link href={`${router.pathname}/${invoice.id}`}>
-                        {invoice.name}
-                      </Link>
-                    </td>
-                    <td>{invoice.purchaseOrderName || '-'}</td>
-                    <td className='!text-left'>{invoice.sales}</td>
-                    <td>{invoice.invoiceDate}</td>
-                    <td>
-                      {invoice.amountResidual > 0 ? (
-                        <div className='badge-solid-red h-fit mx-auto'>
-                          Belum Lunas
-                        </div>
-                      ) : (
-                        <div className='badge-solid-green h-fit mx-auto'>
-                          Lunas
-                        </div>
-                      )}
-                    </td>
-                    <td>
-                      {invoice.amountResidual > 0 ? (
-                        <div className='badge-solid-red h-fit mx-auto'>
-                          Belum Lunas
-                        </div>
-                      ) : (
-                        <div className='badge-solid-green h-fit mx-auto'>
-                          Lunas
-                        </div>
-                      )}
-                    </td>
-                    <td className='!text-left'>
-                      {currencyFormat(invoice.amountTotal)}
-                    </td>
-                  </tr>
-                ))}
-              </tbody>
-            </table>
+                  {!invoices.isLoading &&
+                    (!invoices?.data?.invoices ||
+                      invoices?.data?.invoices?.length == 0) && (
+                      <tr>
+                        <td colSpan={6}>Tidak ada invoice</td>
+                      </tr>
+                    )}
+                  {invoices.data?.invoices?.map((invoice) => (
+                    <tr key={invoice.id}>
+                      <td>
+                        <Link href={`/my/invoices/${invoice.id}`}>
+                          {invoice.name}
+                        </Link>
+                      </td>
+                      <td>{invoice.salesOrder || '-'}</td>
+                      <td className='!text-left'>{invoice.sales}</td>
+                      <td>{invoice.invoiceDate}</td>
+                      <td>{invoice.invoiceDateDue}</td>
+                      <td>
+                        {invoice.amountResidual > 0 ? (
+                          <div className='badge-solid-red h-fit mx-auto'>
+                            Belum Lunas
+                          </div>
+                        ) : (
+                          <div className='badge-solid-green h-fit mx-auto'>
+                            Lunas
+                          </div>
+                        )}
+                      </td>
+                      <td className='!text-left'>
+                        {currencyFormat(invoice.amountTotal)}
+                      </td>
+                    </tr>
+                  ))}
+                </tbody>
+              </table>
 
-            <Pagination
-              pageCount={pageCount}
-              currentPage={parseInt(page)}
-              url={`/my/invoices${pageQuery}`}
-              className='mt-2 mb-2'
-            />
+              <Pagination
+                pageCount={pageCount}
+                currentPage={parseInt(pageNew)}
+                // url={`/my/tempo${pageQuery}`}
+                url={`/my/tempo?${toQuery(_.omit(query, ['page']))}`}
+                className='mt-2 mb-2'
+              />
+            </div>
+            <div className=''>
+              <FooterBanner />
+            </div>
           </div>
         </div>
       </DesktopView>
       <MobileView>
         <div className='p-4 flex flex-col gap-y-4'>
+          <div className='flex flex-col gap-y-2'>
+            <div className='flex flex-col items-center justify-center'>
+              <p className='flex flex-row w-full text-sm gap-2 items-center justify-start'>
+                Jenis Tempo Pembayaran Anda adalah{' '}
+                <Skeleton
+                  isLoaded={!isLoading}
+                  h='fit'
+                  w={24}
+                  className='badge-solid-green px-1 text-xs flex items-center justify-center font-thin'
+                >
+                  {' '}
+                  {tempo.paymentTerm}
+                </Skeleton>
+              </p>
+            </div>
+            <div className='grid grid-flow-col text-sm'>
+              <div className='  w-full'>
+                <p>Limit Tempo Terpakai</p>
+                <Skeleton
+                  isLoaded={!isLoading}
+                  // h='36px'
+                  // w={16}
+                  className='font-semibold text-lg'
+                >
+                  {currencyFormat(amountDue)}
+                </Skeleton>
+              </div>
+              <div className=' w-full'>
+                <p>Limit Tempo</p>
+                <Skeleton
+                  isLoaded={!isLoading}
+                  // h='36px'
+                  // w={16}
+                  className=' font-semibold text-lg'
+                >
+                  {currencyFormat(limitTempo)}
+                </Skeleton>
+              </div>
+            </div>
+          </div>
+          <div className='flex gap-2 flex-col'>
+            <ProgressBar
+              completed={amountDue}
+              bgColor='#ef4444'
+              labelAlignment='outside'
+              isLabelVisible={false}
+              baseBgColor='#E5E7EB'
+              labelColor='#e80909'
+              labelSize='0'
+              maxCompleted={limitTempo}
+              height='6px'
+            />
+            <span className='flex justify-end opacity-75 text-xs font-semibold text-red-500'>
+              {getLabel()}
+            </span>
+          </div>
           <form className='flex gap-x-3' onSubmit={handleSubmit}>
             <input
               type='text'
@@ -310,7 +407,7 @@ const Tempo = () => {
 
           <Pagination
             pageCount={pageCount}
-            currentPage={parseInt(page)}
+            currentPage={parseInt(pageNew)}
             url={`/my/invoices${pageQuery}`}
             className='mt-2 mb-2'
           />
-- 
cgit v1.2.3


From f906429778e932e2cdbdee05492e697a090a469c Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Fri, 15 Nov 2024 15:21:21 +0700
Subject: <iman> update code

---
 src/lib/tempo/components/Tempo.jsx | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

(limited to 'src/lib/tempo/components/Tempo.jsx')

diff --git a/src/lib/tempo/components/Tempo.jsx b/src/lib/tempo/components/Tempo.jsx
index ef516c64..7d9ede7d 100644
--- a/src/lib/tempo/components/Tempo.jsx
+++ b/src/lib/tempo/components/Tempo.jsx
@@ -83,6 +83,11 @@ const Tempo = () => {
   };
   const startItem = 1 + (pageNew - 1) * limitNew;
   const endItem = Math.min(limitNew * pageNew, invoices?.data?.invoiceTotal);
+  const getDueDate = (invoice) => {
+    const [day, month, year] = invoice.split('/');
+    const dueDate = new Date(year, month - 1, day); // Konversi ke objek Date
+    return dueDate;
+  };
   return (
     <>
       <DesktopView>
@@ -227,7 +232,9 @@ const Tempo = () => {
                       <td>
                         {invoice.amountResidual > 0 ? (
                           <div className='badge-solid-red h-fit mx-auto'>
-                            Belum Lunas
+                            {new Date() > getDueDate(invoice.invoiceDateDue)
+                              ? 'Jatuh Tempo'
+                              : 'Belum Lunas'}
                           </div>
                         ) : (
                           <div className='badge-solid-green h-fit mx-auto'>
-- 
cgit v1.2.3


From 0a84e659a4ac55207ca9624977be6bf771c3abe9 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Fri, 15 Nov 2024 17:10:46 +0700
Subject: <iman> update

---
 src/lib/tempo/components/Tempo.jsx | 106 ++++++++++++++++++++++---------------
 1 file changed, 63 insertions(+), 43 deletions(-)

(limited to 'src/lib/tempo/components/Tempo.jsx')

diff --git a/src/lib/tempo/components/Tempo.jsx b/src/lib/tempo/components/Tempo.jsx
index 7d9ede7d..bfeddfbb 100644
--- a/src/lib/tempo/components/Tempo.jsx
+++ b/src/lib/tempo/components/Tempo.jsx
@@ -88,6 +88,18 @@ const Tempo = () => {
     const dueDate = new Date(year, month - 1, day); // Konversi ke objek Date
     return dueDate;
   };
+
+  const formatTanggal = (tanggalInput) => {
+    const [day, month, year] = tanggalInput.split('/');
+    const date = new Date(year, month - 1, day);
+    const formattedDate = new Intl.DateTimeFormat('id-ID', {
+      day: '2-digit',
+      month: 'short',
+      year: 'numeric',
+    }).format(date);
+
+    return formattedDate;
+  };
   return (
     <>
       <DesktopView>
@@ -265,45 +277,43 @@ const Tempo = () => {
         </div>
       </DesktopView>
       <MobileView>
-        <div className='p-4 flex flex-col gap-y-4'>
-          <div className='flex flex-col gap-y-2'>
-            <div className='flex flex-col items-center justify-center'>
-              <p className='flex flex-row w-full text-sm gap-2 items-center justify-start'>
-                Jenis Tempo Pembayaran Anda adalah{' '}
-                <Skeleton
-                  isLoaded={!isLoading}
-                  h='fit'
-                  w={24}
-                  className='badge-solid-green px-1 text-xs flex items-center justify-center font-thin'
-                >
-                  {' '}
-                  {tempo.paymentTerm}
-                </Skeleton>
-              </p>
+        <div className='flex flex-col gap-y-2 bg-[#FEF8E2]'>
+          <div className='flex flex-col items-center justify-center'>
+            <p className='flex flex-row w-full text-sm gap-2 items-center justify-start'>
+              Jenis Tempo Pembayaran Anda adalah{' '}
+              <Skeleton
+                isLoaded={!isLoading}
+                h='fit'
+                w={24}
+                className='badge-solid-green px-1 text-xs flex items-center justify-center font-thin'
+              >
+                {' '}
+                {tempo.paymentTerm}
+              </Skeleton>
+            </p>
+          </div>
+          <div className='grid grid-flow-col text-sm'>
+            <div className='  w-full'>
+              <p>Limit Tempo Terpakai</p>
+              <Skeleton
+                isLoaded={!isLoading}
+                // h='36px'
+                // w={16}
+                className='font-semibold text-lg'
+              >
+                {currencyFormat(amountDue)}
+              </Skeleton>
             </div>
-            <div className='grid grid-flow-col text-sm'>
-              <div className='  w-full'>
-                <p>Limit Tempo Terpakai</p>
-                <Skeleton
-                  isLoaded={!isLoading}
-                  // h='36px'
-                  // w={16}
-                  className='font-semibold text-lg'
-                >
-                  {currencyFormat(amountDue)}
-                </Skeleton>
-              </div>
-              <div className=' w-full'>
-                <p>Limit Tempo</p>
-                <Skeleton
-                  isLoaded={!isLoading}
-                  // h='36px'
-                  // w={16}
-                  className=' font-semibold text-lg'
-                >
-                  {currencyFormat(limitTempo)}
-                </Skeleton>
-              </div>
+            <div className=' w-full'>
+              <p>Limit Tempo</p>
+              <Skeleton
+                isLoaded={!isLoading}
+                // h='36px'
+                // w={16}
+                className=' font-semibold text-lg'
+              >
+                {currencyFormat(limitTempo)}
+              </Skeleton>
             </div>
           </div>
           <div className='flex gap-2 flex-col'>
@@ -322,6 +332,8 @@ const Tempo = () => {
               {getLabel()}
             </span>
           </div>
+        </div>
+        <div className='p-4 flex flex-col gap-y-4'>
           <form className='flex gap-x-3' onSubmit={handleSubmit}>
             <input
               type='text'
@@ -355,14 +367,18 @@ const Tempo = () => {
               <div className='grid grid-cols-2'>
                 <Link href={`${router.pathname}/${invoice.id}`}>
                   <span className='text-caption-2 text-gray_r-11'>
-                    No. Invoice
+                    No. Transaksi
                   </span>
-                  <h2 className='text-danger-500 mt-1'>{invoice.name}</h2>
+                  <h2 className='font-semibold text-black mt-1'>
+                    {invoice.salesOrder}
+                  </h2>
                 </Link>
                 <div className='flex gap-x-1 justify-end'>
                   {invoice.amountResidual > 0 ? (
                     <div className='badge-solid-red h-fit ml-auto'>
-                      Belum Lunas
+                      {new Date() > getDueDate(invoice.invoiceDateDue)
+                        ? 'Jatuh Tempo'
+                        : 'Belum Lunas'}
                     </div>
                   ) : (
                     <div className='badge-solid-green h-fit ml-auto'>Lunas</div>
@@ -375,8 +391,12 @@ const Tempo = () => {
               </div>
               <Link href={`${router.pathname}/${invoice.id}`}>
                 <div className='grid grid-cols-2 text-caption-2 text-gray_r-11 mt-2 font-normal'>
-                  <p>{invoice.invoiceDate}</p>
-                  <p className='text-right'>{invoice.paymentTerm}</p>
+                  <p className='opacity-70'>
+                    {formatTanggal(invoice.invoiceDate)}
+                  </p>
+                  <p className='text-right text-xs text-red-500'>
+                    Jatuh Tempo: {formatTanggal(invoice.invoiceDateDue)}
+                  </p>
                 </div>
                 <hr className='my-3' />
                 <div className='grid grid-cols-2'>
-- 
cgit v1.2.3


From 13b9b5dd101e6dba13ddcf04aff42cfb4156c4d8 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Sat, 16 Nov 2024 09:50:43 +0700
Subject: <iman> update

---
 src/lib/tempo/components/Tempo.jsx | 42 ++++++++++++++++++++++++++++++--------
 1 file changed, 34 insertions(+), 8 deletions(-)

(limited to 'src/lib/tempo/components/Tempo.jsx')

diff --git a/src/lib/tempo/components/Tempo.jsx b/src/lib/tempo/components/Tempo.jsx
index bfeddfbb..8fb55147 100644
--- a/src/lib/tempo/components/Tempo.jsx
+++ b/src/lib/tempo/components/Tempo.jsx
@@ -116,7 +116,7 @@ const Tempo = () => {
                   isLoaded={!isLoading}
                   h='fit'
                   w={32}
-                  className='badge-solid-green px-2 text-sm flex items-center justify-center font-thin'
+                  className='badge-solid-green px-1 text-sm flex items-center justify-center font-thin'
                 >
                   {' '}
                   {tempo.paymentTerm}
@@ -125,7 +125,7 @@ const Tempo = () => {
             </div>
             <div className='grid grid-flow-col gap-4 mb-4'>
               <div className='border  w-full p-4'>
-                <p>Limit Tempo Terpakai</p>
+                <p>Kredit Limit Terpakai</p>
                 <Skeleton
                   isLoaded={!isLoading}
                   h='36px'
@@ -136,7 +136,18 @@ const Tempo = () => {
                 </Skeleton>
               </div>
               <div className='border w-full p-4'>
-                <p>Limit Tempo</p>
+                <p>Sisa Kredit Limit</p>
+                <Skeleton
+                  isLoaded={!isLoading}
+                  h='36px'
+                  // w={16}
+                  className='text-3xl font-semibold'
+                >
+                  {currencyFormat(Math.round(parseInt(limitTempo - amountDue)))}
+                </Skeleton>
+              </div>
+              <div className='border w-full p-4'>
+                <p>Kredit Limit</p>
                 <Skeleton
                   isLoaded={!isLoading}
                   h='36px'
@@ -243,11 +254,15 @@ const Tempo = () => {
                       <td>{invoice.invoiceDateDue}</td>
                       <td>
                         {invoice.amountResidual > 0 ? (
-                          <div className='badge-solid-red h-fit mx-auto'>
-                            {new Date() > getDueDate(invoice.invoiceDateDue)
-                              ? 'Jatuh Tempo'
-                              : 'Belum Lunas'}
-                          </div>
+                          new Date() > getDueDate(invoice.invoiceDateDue) ? (
+                            <div className='inline-flex items-center rounded-md bg-red-50 px-2 py-1 text-xs font-medium text-red-700 ring-1 ring-inset ring-red-600/20'>
+                              Jatuh Tempo
+                            </div>
+                          ) : (
+                            <div className='badge-solid-red h-fit mx-auto'>
+                              Belum Lunas
+                            </div>
+                          )
                         ) : (
                           <div className='badge-solid-green h-fit mx-auto'>
                             Lunas
@@ -304,6 +319,17 @@ const Tempo = () => {
                 {currencyFormat(amountDue)}
               </Skeleton>
             </div>
+            <div className='w-full'>
+              <p>Sisa Kredit Limit</p>
+              <Skeleton
+                isLoaded={!isLoading}
+                // h='36px'
+                // w={16}
+                className='font-semibold text-lg'
+              >
+                {currencyFormat(Math.round(parseInt(limitTempo - amountDue)))}
+              </Skeleton>
+            </div>
             <div className=' w-full'>
               <p>Limit Tempo</p>
               <Skeleton
-- 
cgit v1.2.3


From 902366a41c554ad23ef709b9659cf19c7ca076bc Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Mon, 18 Nov 2024 13:43:26 +0700
Subject: <iman> add pengajuan tempo detail

---
 src/lib/tempo/components/Tempo.jsx | 157 ++++++++++++++++++-------------------
 1 file changed, 77 insertions(+), 80 deletions(-)

(limited to 'src/lib/tempo/components/Tempo.jsx')

diff --git a/src/lib/tempo/components/Tempo.jsx b/src/lib/tempo/components/Tempo.jsx
index 8fb55147..71dd0f64 100644
--- a/src/lib/tempo/components/Tempo.jsx
+++ b/src/lib/tempo/components/Tempo.jsx
@@ -41,7 +41,6 @@ const Tempo = () => {
     limit: limitNew,
   };
   const { invoices } = useInvoices({ query });
-  console.log('invoices', invoices);
   const [isLoading, setIsLoading] = useState(true);
   const [tempo, setTempo] = useState([]);
   const [inputQuery, setInputQuery] = useState(q);
@@ -49,11 +48,8 @@ const Tempo = () => {
 
   const pageCount = Math.ceil(invoices?.data?.invoiceTotal / limitNew);
   let pageQuery = _.omit(query, ['limitNew', 'offset']);
-  console.log('pageQuery1', pageQuery);
   pageQuery = _.pickBy(pageQuery, _.identity);
-  console.log('pageQuery2', pageQuery);
   pageQuery = toQuery(pageQuery);
-  console.log('pageQuery3', pageQuery);
   const handleSubmit = (e) => {
     e.preventDefault();
     router.push(`/my/tempo?q=${inputQuery}`);
@@ -74,7 +70,6 @@ const Tempo = () => {
     parseInt(tempo.amountDue + tempo.remainingLimit)
   );
   const amountDue = Math.round(parseInt(tempo.amountDue));
-  console.log('tempo', tempo);
   const getLabel = () => {
     if (Math.round((amountDue / limitTempo) * 100) >= 100)
       return 'Limit Tempo mencapai batas';
@@ -292,72 +287,74 @@ const Tempo = () => {
         </div>
       </DesktopView>
       <MobileView>
-        <div className='flex flex-col gap-y-2 bg-[#FEF8E2]'>
-          <div className='flex flex-col items-center justify-center'>
-            <p className='flex flex-row w-full text-sm gap-2 items-center justify-start'>
-              Jenis Tempo Pembayaran Anda adalah{' '}
-              <Skeleton
-                isLoaded={!isLoading}
-                h='fit'
-                w={24}
-                className='badge-solid-green px-1 text-xs flex items-center justify-center font-thin'
-              >
-                {' '}
-                {tempo.paymentTerm}
-              </Skeleton>
-            </p>
-          </div>
-          <div className='grid grid-flow-col text-sm'>
-            <div className='  w-full'>
-              <p>Limit Tempo Terpakai</p>
-              <Skeleton
-                isLoaded={!isLoading}
-                // h='36px'
-                // w={16}
-                className='font-semibold text-lg'
-              >
-                {currencyFormat(amountDue)}
-              </Skeleton>
+        <div className=' bg-[#FEF8E2] w-[110%] inset-0 relative transform -translate-x-5 px-8 py-4'>
+          <div className='flex flex-col gap-y-4 '>
+            <div className='flex flex-col items-center justify-center'>
+              <p className='flex flex-row w-full text-sm gap-2 items-center justify-start'>
+                Jenis Tempo Pembayaran Anda adalah{' '}
+                <Skeleton
+                  isLoaded={!isLoading}
+                  h='fit'
+                  w={24}
+                  className='badge-solid-green px-1 text-xs flex items-center justify-center font-thin'
+                >
+                  {' '}
+                  {tempo.paymentTerm}
+                </Skeleton>
+              </p>
             </div>
-            <div className='w-full'>
-              <p>Sisa Kredit Limit</p>
-              <Skeleton
-                isLoaded={!isLoading}
-                // h='36px'
-                // w={16}
-                className='font-semibold text-lg'
-              >
-                {currencyFormat(Math.round(parseInt(limitTempo - amountDue)))}
-              </Skeleton>
+            <div className='flex  justify-around text-sm '>
+              <div className='w-[40%]  flex flex-col gap-2'>
+                <p>Limit Tempo Terpakai</p>
+                <Skeleton
+                  isLoaded={!isLoading}
+                  // h='36px'
+                  // w={16}
+                  className='font-semibold text-base'
+                >
+                  {currencyFormat(amountDue)}
+                </Skeleton>
+              </div>
+              <div className='w-[30%] flex  flex-col gap-2'>
+                <p>Sisa Kredit Limit</p>
+                <Skeleton
+                  isLoaded={!isLoading}
+                  // h='36px'
+                  // w={16}
+                  className='font-semibold text-base'
+                >
+                  {currencyFormat(Math.round(parseInt(limitTempo - amountDue)))}
+                </Skeleton>
+              </div>
+              <div className=' w-[30%] flex flex-col gap-2'>
+                <p>Limit Tempo</p>
+                <Skeleton
+                  isLoaded={!isLoading}
+                  // h='36px'
+                  // w={16}
+                  className=' font-semibold text-base'
+                >
+                  {currencyFormat(limitTempo)}
+                </Skeleton>
+              </div>
             </div>
-            <div className=' w-full'>
-              <p>Limit Tempo</p>
-              <Skeleton
-                isLoaded={!isLoading}
-                // h='36px'
-                // w={16}
-                className=' font-semibold text-lg'
-              >
-                {currencyFormat(limitTempo)}
-              </Skeleton>
+            <div className='flex gap-2 flex-col'>
+              <ProgressBar
+                completed={amountDue}
+                bgColor='#ef4444'
+                labelAlignment='outside'
+                isLabelVisible={false}
+                baseBgColor='#E5E7EB'
+                labelColor='#e80909'
+                labelSize='0'
+                maxCompleted={limitTempo}
+                height='6px'
+              />
+              <span className='flex justify-end opacity-75 text-xs font-semibold text-red-500'>
+                {getLabel()}
+              </span>
             </div>
           </div>
-          <div className='flex gap-2 flex-col'>
-            <ProgressBar
-              completed={amountDue}
-              bgColor='#ef4444'
-              labelAlignment='outside'
-              isLabelVisible={false}
-              baseBgColor='#E5E7EB'
-              labelColor='#e80909'
-              labelSize='0'
-              maxCompleted={limitTempo}
-              height='6px'
-            />
-            <span className='flex justify-end opacity-75 text-xs font-semibold text-red-500'>
-              {getLabel()}
-            </span>
-          </div>
         </div>
         <div className='p-4 flex flex-col gap-y-4'>
           <form className='flex gap-x-3' onSubmit={handleSubmit}>
@@ -391,7 +388,7 @@ const Tempo = () => {
               key={index}
             >
               <div className='grid grid-cols-2'>
-                <Link href={`${router.pathname}/${invoice.id}`}>
+                <Link href={`/my/quotations/${invoice.salesOrderId}`}>
                   <span className='text-caption-2 text-gray_r-11'>
                     No. Transaksi
                   </span>
@@ -399,7 +396,7 @@ const Tempo = () => {
                     {invoice.salesOrder}
                   </h2>
                 </Link>
-                <div className='flex gap-x-1 justify-end'>
+                <div className='flex gap-x-1 justify-end  items-center'>
                   {invoice.amountResidual > 0 ? (
                     <div className='badge-solid-red h-fit ml-auto'>
                       {new Date() > getDueDate(invoice.invoiceDateDue)
@@ -409,13 +406,13 @@ const Tempo = () => {
                   ) : (
                     <div className='badge-solid-green h-fit ml-auto'>Lunas</div>
                   )}
-                  <EllipsisVerticalIcon
+                  {/* <EllipsisVerticalIcon
                     className='w-5 h-5'
                     onClick={() => setToOthers(invoice)}
-                  />
+                  /> */}
                 </div>
               </div>
-              <Link href={`${router.pathname}/${invoice.id}`}>
+              <Link href={`/my/invoices/${invoice.id}`}>
                 <div className='grid grid-cols-2 text-caption-2 text-gray_r-11 mt-2 font-normal'>
                   <p className='opacity-70'>
                     {formatTanggal(invoice.invoiceDate)}
@@ -428,23 +425,23 @@ const Tempo = () => {
                 <div className='grid grid-cols-2'>
                   <div>
                     <span className='text-caption-2 text-gray_r-11'>
-                      No. Purchase Order
+                      No. Invoice
                     </span>
-                    <p className='mt-1 font-medium text-gray_r-12'>
-                      {invoice.purchaseOrderName || '-'}
+                    <p className='mt-1 font-semibold text-gray_r-12'>
+                      {invoice.name || '-'}
                     </p>
                   </div>
                   <div className='text-right'>
-                    <span className='text-caption-2 text-gray_r-11'>
-                      Total Invoice
+                    <span className='opacity-65 text-caption-2 text-gray_r-11'>
+                      Total Belanja
                     </span>
-                    <p className='mt-1 font-medium text-gray_r-12'>
+                    <p className='mt-1 font-semibold text-red-500 '>
                       {currencyFormat(invoice.amountTotal)}
                     </p>
                   </div>
                 </div>
               </Link>
-              {invoice.efaktur ? (
+              {/* {invoice.efaktur ? (
                 <div className='badge-green h-fit mt-3 ml-auto flex items-center gap-x-0.5'>
                   <CheckIcon className='w-4 stroke-2' />
                   Faktur Pajak
@@ -454,7 +451,7 @@ const Tempo = () => {
                   <ClockIcon className='w-4 stroke-2' />
                   Faktur Pajak
                 </div>
-              )}
+              )} */}
             </div>
           ))}
 
-- 
cgit v1.2.3


From 00cbfa62bf4c5784b1c49c766cc2a53749a6cc43 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Thu, 21 Nov 2024 16:38:57 +0700
Subject: <iman> edit pengajuan tempo

---
 src/lib/tempo/components/Tempo.jsx | 20 ++++++++++++--------
 1 file changed, 12 insertions(+), 8 deletions(-)

(limited to 'src/lib/tempo/components/Tempo.jsx')

diff --git a/src/lib/tempo/components/Tempo.jsx b/src/lib/tempo/components/Tempo.jsx
index 71dd0f64..d8af450d 100644
--- a/src/lib/tempo/components/Tempo.jsx
+++ b/src/lib/tempo/components/Tempo.jsx
@@ -305,7 +305,7 @@ const Tempo = () => {
             </div>
             <div className='flex  justify-around text-sm '>
               <div className='w-[40%]  flex flex-col gap-2'>
-                <p>Limit Tempo Terpakai</p>
+                <p>Kredit Limit Terpakai</p>
                 <Skeleton
                   isLoaded={!isLoading}
                   // h='36px'
@@ -327,7 +327,7 @@ const Tempo = () => {
                 </Skeleton>
               </div>
               <div className=' w-[30%] flex flex-col gap-2'>
-                <p>Limit Tempo</p>
+                <p>Kredit Limit</p>
                 <Skeleton
                   isLoaded={!isLoading}
                   // h='36px'
@@ -396,13 +396,17 @@ const Tempo = () => {
                     {invoice.salesOrder}
                   </h2>
                 </Link>
-                <div className='flex gap-x-1 justify-end  items-center'>
+                <div className='flex gap-x-1 justify-end  items-end '>
                   {invoice.amountResidual > 0 ? (
-                    <div className='badge-solid-red h-fit ml-auto'>
-                      {new Date() > getDueDate(invoice.invoiceDateDue)
-                        ? 'Jatuh Tempo'
-                        : 'Belum Lunas'}
-                    </div>
+                    new Date() > getDueDate(invoice.invoiceDateDue) ? (
+                      <div className='inline-flex items-end rounded-md bg-red-50 px-2 py-1 text-xs font-medium text-red-700 ring-1 ring-inset ring-red-600/20'>
+                        Jatuh Tempo
+                      </div>
+                    ) : (
+                      <div className='badge-solid-red h-fit ml-auto'>
+                        Belum Lunas
+                      </div>
+                    )
                   ) : (
                     <div className='badge-solid-green h-fit ml-auto'>Lunas</div>
                   )}
-- 
cgit v1.2.3


From 35793c84f780e0de60a5e833343949e980d3a63f Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Sat, 23 Nov 2024 13:35:14 +0700
Subject: <iman> update

---
 src/lib/tempo/components/Tempo.jsx | 13 ++++++++-----
 1 file changed, 8 insertions(+), 5 deletions(-)

(limited to 'src/lib/tempo/components/Tempo.jsx')

diff --git a/src/lib/tempo/components/Tempo.jsx b/src/lib/tempo/components/Tempo.jsx
index d8af450d..80d593e6 100644
--- a/src/lib/tempo/components/Tempo.jsx
+++ b/src/lib/tempo/components/Tempo.jsx
@@ -113,8 +113,7 @@ const Tempo = () => {
                   w={32}
                   className='badge-solid-green px-1 text-sm flex items-center justify-center font-thin'
                 >
-                  {' '}
-                  {tempo.paymentTerm}
+                  {tempo.paymentTerm ? tempo.paymentTerm : 'Review'}
                 </Skeleton>
               </p>
             </div>
@@ -127,7 +126,7 @@ const Tempo = () => {
                   // w={16}
                   className='text-3xl font-semibold'
                 >
-                  {currencyFormat(amountDue)}
+                  {amountDue ? currencyFormat(amountDue) : '-'}
                 </Skeleton>
               </div>
               <div className='border w-full p-4'>
@@ -138,7 +137,11 @@ const Tempo = () => {
                   // w={16}
                   className='text-3xl font-semibold'
                 >
-                  {currencyFormat(Math.round(parseInt(limitTempo - amountDue)))}
+                  {limitTempo && amountDue
+                    ? currencyFormat(
+                        Math.round(parseInt(limitTempo - amountDue))
+                      )
+                    : '-'}
                 </Skeleton>
               </div>
               <div className='border w-full p-4'>
@@ -149,7 +152,7 @@ const Tempo = () => {
                   // w={16}
                   className='text-3xl font-semibold'
                 >
-                  {currencyFormat(limitTempo)}
+                  {limitTempo ? currencyFormat(limitTempo) : '-'}
                 </Skeleton>
               </div>
             </div>
-- 
cgit v1.2.3


From 9a49b8d84761781531cb417731cb9ef802f63541 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Wed, 4 Dec 2024 10:59:21 +0700
Subject: <iman> update pengajuan tempo

---
 src/lib/tempo/components/Tempo.jsx | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

(limited to 'src/lib/tempo/components/Tempo.jsx')

diff --git a/src/lib/tempo/components/Tempo.jsx b/src/lib/tempo/components/Tempo.jsx
index 80d593e6..e6c3959d 100644
--- a/src/lib/tempo/components/Tempo.jsx
+++ b/src/lib/tempo/components/Tempo.jsx
@@ -301,8 +301,7 @@ const Tempo = () => {
                   w={24}
                   className='badge-solid-green px-1 text-xs flex items-center justify-center font-thin'
                 >
-                  {' '}
-                  {tempo.paymentTerm}
+                  {tempo.paymentTerm ? tempo.paymentTerm : 'Review'}
                 </Skeleton>
               </p>
             </div>
-- 
cgit v1.2.3


From e9cd13307f0095dc4edc5048752675d80c551564 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Fri, 6 Dec 2024 17:06:26 +0700
Subject: <iman> pengajuan tempo

---
 src/lib/tempo/components/Tempo.jsx | 217 ++++++++++++++++++++-----------------
 1 file changed, 116 insertions(+), 101 deletions(-)

(limited to 'src/lib/tempo/components/Tempo.jsx')

diff --git a/src/lib/tempo/components/Tempo.jsx b/src/lib/tempo/components/Tempo.jsx
index e6c3959d..95eb461f 100644
--- a/src/lib/tempo/components/Tempo.jsx
+++ b/src/lib/tempo/components/Tempo.jsx
@@ -27,11 +27,13 @@ import odooApi from '@/core/api/odooApi';
 import { getAuth } from '@/core/utils/auth';
 import ProgressBar from '@ramonak/react-progress-bar';
 import FooterBanner from '~/modules/footer-banner';
+import Image from '~/components/ui/image';
+import useDevice from '@/core/hooks/useDevice';
 const Tempo = () => {
   const auth = getAuth();
   const router = useRouter();
   const { q = '', page = 1, limit = 15 } = router.query;
-
+  const { isDesktop, isMobile } = useDevice();
   const [pageNew, setPageNew] = useState(page);
   const [limitNew, setLimitNew] = useState(limit);
 
@@ -173,116 +175,129 @@ const Tempo = () => {
                 {getLabel()}
               </span>
             </div>
-            <div className='border p-4 rounded mt-4'>
-              <div className='flex mb-6 items-center justify-between mt-4'>
-                <form className='flex' onSubmit={handleSubmit}>
-                  <button className='bg-gray_r-2 px-3' type='submit'>
-                    <MagnifyingGlassIcon className='w-6' />
-                  </button>
-                  <input
-                    type='text'
-                    className='form-input bg-gray_r-2 border-none'
-                    placeholder='Cari Invoice...'
-                    value={inputQuery}
-                    onChange={(e) => setInputQuery(e.target.value)}
-                  />
-                </form>
-                {!invoices.isLoading && (
-                  <div className='flex flex-row gap-4 items-center justify-center'>
-                    <p>
-                      Menampilkan {startItem}-{endItem} dari{' '}
-                      {invoices?.data?.invoiceTotal}
-                    </p>
-                    <select
-                      id='limitSelect'
-                      value={limitNew}
-                      onChange={(e) => {
-                        setLimitNew(Number(e.target.value));
-                        setPageNew(1);
-                      }}
-                      className='border p-2'
-                    >
-                      <option value={10}>10</option>
-                      <option value={15}>15</option>
-                      <option value={20}>20</option>
-                    </select>
-                  </div>
-                )}
+            {!invoices?.data?.invoices ||
+            invoices?.data?.invoices?.length == 0 ? (
+              <div className='flex justify-center'>
+                <Image
+                  src='/images/ICON-DOKUMEN-VERIFIKASI.png'
+                  alt='Registrasi Tempo'
+                  width={isMobile ? 300 : 600}
+                  height={isMobile ? 300 : 550}
+                />
               </div>
+            ) : (
+              <div className='border p-4 rounded mt-4'>
+                <div className='flex mb-6 items-center justify-between mt-4'>
+                  <form className='flex' onSubmit={handleSubmit}>
+                    <button className='bg-gray_r-2 px-3' type='submit'>
+                      <MagnifyingGlassIcon className='w-6' />
+                    </button>
+                    <input
+                      type='text'
+                      className='form-input bg-gray_r-2 border-none'
+                      placeholder='Cari Invoice...'
+                      value={inputQuery}
+                      onChange={(e) => setInputQuery(e.target.value)}
+                    />
+                  </form>
+                  {!invoices.isLoading && (
+                    <div className='flex flex-row gap-4 items-center justify-center'>
+                      <p>
+                        Menampilkan {startItem}-{endItem} dari{' '}
+                        {invoices?.data?.invoiceTotal}
+                      </p>
+                      <select
+                        id='limitSelect'
+                        value={limitNew}
+                        onChange={(e) => {
+                          setLimitNew(Number(e.target.value));
+                          setPageNew(1);
+                        }}
+                        className='border p-2'
+                      >
+                        <option value={10}>10</option>
+                        <option value={15}>15</option>
+                        <option value={20}>20</option>
+                      </select>
+                    </div>
+                  )}
+                </div>
 
-              <table className='table-data'>
-                <thead>
-                  <tr>
-                    <th>No. Invoice</th>
-                    <th>No. Transaksi</th>
-                    <th className='!text-left'>Salesperson</th>
-                    <th>Tanggal</th>
-                    <th>Jatuh Tempo</th>
-                    <th>Status</th>
-                    <th className='!text-left'>Total</th>
-                  </tr>
-                </thead>
-                <tbody>
-                  {invoices.isLoading && (
+                <table className='table-data'>
+                  <thead>
                     <tr>
-                      <td colSpan={6}>
-                        <div className='flex justify-center my-2'>
-                          <Spinner className='w-6 text-gray_r-12/50 fill-gray_r-12' />
-                        </div>
-                      </td>
+                      <th>No. Invoice</th>
+                      <th>No. Transaksi</th>
+                      <th className='!text-left'>Salesperson</th>
+                      <th>Tanggal</th>
+                      <th>Jatuh Tempo</th>
+                      <th>Status</th>
+                      <th className='!text-left'>Total</th>
                     </tr>
-                  )}
-                  {!invoices.isLoading &&
-                    (!invoices?.data?.invoices ||
-                      invoices?.data?.invoices?.length == 0) && (
+                  </thead>
+                  <tbody>
+                    {invoices.isLoading && (
                       <tr>
-                        <td colSpan={6}>Tidak ada invoice</td>
+                        <td colSpan={6}>
+                          <div className='flex justify-center my-2'>
+                            <Spinner className='w-6 text-gray_r-12/50 fill-gray_r-12' />
+                          </div>
+                        </td>
                       </tr>
                     )}
-                  {invoices.data?.invoices?.map((invoice) => (
-                    <tr key={invoice.id}>
-                      <td>
-                        <Link href={`/my/invoices/${invoice.id}`}>
-                          {invoice.name}
-                        </Link>
-                      </td>
-                      <td>{invoice.salesOrder || '-'}</td>
-                      <td className='!text-left'>{invoice.sales}</td>
-                      <td>{invoice.invoiceDate}</td>
-                      <td>{invoice.invoiceDateDue}</td>
-                      <td>
-                        {invoice.amountResidual > 0 ? (
-                          new Date() > getDueDate(invoice.invoiceDateDue) ? (
-                            <div className='inline-flex items-center rounded-md bg-red-50 px-2 py-1 text-xs font-medium text-red-700 ring-1 ring-inset ring-red-600/20'>
-                              Jatuh Tempo
-                            </div>
+                    {!invoices.isLoading &&
+                      (!invoices?.data?.invoices ||
+                        invoices?.data?.invoices?.length == 0) && (
+                        <tr>
+                          <td colSpan={6}>Tidak ada Invoice</td>
+                        </tr>
+                      )}
+                    {invoices.data?.invoices?.map((invoice) => (
+                      <tr key={invoice.id}>
+                        <td>
+                          <Link href={`/my/invoices/${invoice.id}`}>
+                            {invoice.name}
+                          </Link>
+                        </td>
+                        <td>{invoice.salesOrder || '-'}</td>
+                        <td className='!text-left'>{invoice.sales}</td>
+                        <td>{invoice.invoiceDate}</td>
+                        <td>{invoice.invoiceDateDue}</td>
+                        <td>
+                          {invoice.amountResidual > 0 ? (
+                            new Date() > getDueDate(invoice.invoiceDateDue) ? (
+                              <div className='inline-flex items-center rounded-md bg-red-50 px-2 py-1 text-xs font-medium text-red-700 ring-1 ring-inset ring-red-600/20'>
+                                Jatuh Tempo
+                              </div>
+                            ) : (
+                              <div className='badge-solid-red h-fit mx-auto'>
+                                Belum Lunas
+                              </div>
+                            )
                           ) : (
-                            <div className='badge-solid-red h-fit mx-auto'>
-                              Belum Lunas
+                            <div className='badge-solid-green h-fit mx-auto'>
+                              Lunas
                             </div>
-                          )
-                        ) : (
-                          <div className='badge-solid-green h-fit mx-auto'>
-                            Lunas
-                          </div>
-                        )}
-                      </td>
-                      <td className='!text-left'>
-                        {currencyFormat(invoice.amountTotal)}
-                      </td>
-                    </tr>
-                  ))}
-                </tbody>
-              </table>
+                          )}
+                        </td>
+                        <td className='!text-left'>
+                          {currencyFormat(invoice.amountTotal)}
+                        </td>
+                      </tr>
+                    ))}
+                  </tbody>
+                </table>
+
+                <Pagination
+                  pageCount={pageCount}
+                  currentPage={parseInt(pageNew)}
+                  // url={`/my/tempo${pageQuery}`}
+                  url={`/my/tempo?${toQuery(_.omit(query, ['page']))}`}
+                  className='mt-2 mb-2'
+                />
+              </div>
+            )}
 
-              <Pagination
-                pageCount={pageCount}
-                currentPage={parseInt(pageNew)}
-                // url={`/my/tempo${pageQuery}`}
-                url={`/my/tempo?${toQuery(_.omit(query, ['page']))}`}
-                className='mt-2 mb-2'
-              />
-            </div>
             <div className=''>
               <FooterBanner />
             </div>
-- 
cgit v1.2.3


From f2451beed670dc697aa2026b2df6ad1ad1e90da2 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Mon, 9 Dec 2024 15:00:45 +0700
Subject: <iman> update pengajuan tempo

---
 src/lib/tempo/components/Tempo.jsx | 12 ++++++++----
 1 file changed, 8 insertions(+), 4 deletions(-)

(limited to 'src/lib/tempo/components/Tempo.jsx')

diff --git a/src/lib/tempo/components/Tempo.jsx b/src/lib/tempo/components/Tempo.jsx
index 95eb461f..33c5bae6 100644
--- a/src/lib/tempo/components/Tempo.jsx
+++ b/src/lib/tempo/components/Tempo.jsx
@@ -61,7 +61,7 @@ const Tempo = () => {
       setIsLoading(true);
       const dataTempo = await odooApi(
         'GET',
-        `/api/v1/check/${auth.parentId}/tempo`
+        `/api/v1/check/${auth.partnerId}/tempo`
       );
       setTempo(dataTempo);
       setIsLoading(false);
@@ -329,7 +329,7 @@ const Tempo = () => {
                   // w={16}
                   className='font-semibold text-base'
                 >
-                  {currencyFormat(amountDue)}
+                  {amountDue ? currencyFormat(amountDue) : '-'}
                 </Skeleton>
               </div>
               <div className='w-[30%] flex  flex-col gap-2'>
@@ -340,7 +340,11 @@ const Tempo = () => {
                   // w={16}
                   className='font-semibold text-base'
                 >
-                  {currencyFormat(Math.round(parseInt(limitTempo - amountDue)))}
+                  {limitTempo && amountDue
+                    ? currencyFormat(
+                        Math.round(parseInt(limitTempo - amountDue))
+                      )
+                    : '-'}
                 </Skeleton>
               </div>
               <div className=' w-[30%] flex flex-col gap-2'>
@@ -351,7 +355,7 @@ const Tempo = () => {
                   // w={16}
                   className=' font-semibold text-base'
                 >
-                  {currencyFormat(limitTempo)}
+                  {limitTempo ? currencyFormat(limitTempo) : '-'}
                 </Skeleton>
               </div>
             </div>
-- 
cgit v1.2.3


From 0f84963214ee6dc5b5a44d945540826a66bec9e0 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Wed, 11 Dec 2024 11:51:45 +0700
Subject: <iman> update pengajuan tempo

---
 src/lib/tempo/components/Tempo.jsx | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

(limited to 'src/lib/tempo/components/Tempo.jsx')

diff --git a/src/lib/tempo/components/Tempo.jsx b/src/lib/tempo/components/Tempo.jsx
index 33c5bae6..dc8307c8 100644
--- a/src/lib/tempo/components/Tempo.jsx
+++ b/src/lib/tempo/components/Tempo.jsx
@@ -175,8 +175,7 @@ const Tempo = () => {
                 {getLabel()}
               </span>
             </div>
-            {!invoices?.data?.invoices ||
-            invoices?.data?.invoices?.length == 0 ? (
+            {tempo.length > 0 && !tempo.paymentTerm ? (
               <div className='flex justify-center'>
                 <Image
                   src='/images/ICON-DOKUMEN-VERIFIKASI.png'
-- 
cgit v1.2.3


From 915dc67e1ce31eab1f2415cc8df95cebb75a137d Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Fri, 13 Dec 2024 14:18:03 +0700
Subject: <iman>update pengajuan tempo request

---
 src/lib/tempo/components/Tempo.jsx | 50 ++++++++++++++++++++++----------------
 1 file changed, 29 insertions(+), 21 deletions(-)

(limited to 'src/lib/tempo/components/Tempo.jsx')

diff --git a/src/lib/tempo/components/Tempo.jsx b/src/lib/tempo/components/Tempo.jsx
index dc8307c8..8a7f4f71 100644
--- a/src/lib/tempo/components/Tempo.jsx
+++ b/src/lib/tempo/components/Tempo.jsx
@@ -108,7 +108,7 @@ const Tempo = () => {
             <div className='flex flex-col mb-6 items-start justify-start'>
               <h1 className='text-title-sm font-semibold'>Pembayaran Tempo</h1>
               <p className='flex flex-row gap-2 w-full'>
-                Jenis Tempo Pembayaran Anda adalah{' '}
+                Status Detail Tempo Pembayaran Anda adalah{' '}
                 <Skeleton
                   isLoaded={!isLoading}
                   h='fit'
@@ -175,7 +175,7 @@ const Tempo = () => {
                 {getLabel()}
               </span>
             </div>
-            {tempo.length > 0 && !tempo.paymentTerm ? (
+            {auth?.tempoProgres == 'review' && !tempo.paymentTerm ? (
               <div className='flex justify-center'>
                 <Image
                   src='/images/ICON-DOKUMEN-VERIFIKASI.png'
@@ -265,12 +265,12 @@ const Tempo = () => {
                         <td>
                           {invoice.amountResidual > 0 ? (
                             new Date() > getDueDate(invoice.invoiceDateDue) ? (
-                              <div className='inline-flex items-center rounded-md bg-red-50 px-2 py-1 text-xs font-medium text-red-700 ring-1 ring-inset ring-red-600/20'>
+                              <div className='badge-solid-red h-fit mx-auto'>
                                 Jatuh Tempo
                               </div>
                             ) : (
-                              <div className='badge-solid-red h-fit mx-auto'>
-                                Belum Lunas
+                              <div className=' h-fit mx-auto inline-flex items-center rounded-md bg-red-50 px-2 py-1 text-xs font-medium text-red-700 ring-1 ring-inset ring-red-600/20'>
+                                Belum Jatuh Tempo
                               </div>
                             )
                           ) : (
@@ -308,7 +308,7 @@ const Tempo = () => {
           <div className='flex flex-col gap-y-4 '>
             <div className='flex flex-col items-center justify-center'>
               <p className='flex flex-row w-full text-sm gap-2 items-center justify-start'>
-                Jenis Tempo Pembayaran Anda adalah{' '}
+                Status Detail Tempo Pembayaran Anda adalah{' '}
                 <Skeleton
                   isLoaded={!isLoading}
                   h='fit'
@@ -377,18 +377,20 @@ const Tempo = () => {
           </div>
         </div>
         <div className='p-4 flex flex-col gap-y-4'>
-          <form className='flex gap-x-3' onSubmit={handleSubmit}>
-            <input
-              type='text'
-              className='form-input'
-              placeholder='Cari Invoice...'
-              value={inputQuery}
-              onChange={(e) => setInputQuery(e.target.value)}
-            />
-            <button className='btn-light bg-transparent px-3' type='submit'>
-              <MagnifyingGlassIcon className='w-6' />
-            </button>
-          </form>
+          {!invoices.isLoading && invoices.data?.invoices?.length != 0 && (
+            <form className='flex gap-x-3' onSubmit={handleSubmit}>
+              <input
+                type='text'
+                className='form-input'
+                placeholder='Cari Invoice...'
+                value={inputQuery}
+                onChange={(e) => setInputQuery(e.target.value)}
+              />
+              <button className='btn-light bg-transparent px-3' type='submit'>
+                <MagnifyingGlassIcon className='w-6' />
+              </button>
+            </form>
+          )}
 
           {invoices.isLoading && (
             <div className='flex justify-center my-4'>
@@ -397,9 +399,15 @@ const Tempo = () => {
           )}
 
           {!invoices.isLoading && invoices.data?.invoices?.length === 0 && (
-            <Alert type='info' className='text-center'>
-              Tidak ada invoice
-            </Alert>
+            // <Alert type='info' className='text-center'>
+            //   Tidak ada invoice
+            // </Alert>
+            <Image
+              src='/images/ICON-DOKUMEN-VERIFIKASI.png'
+              alt='Registrasi Tempo'
+              width={isMobile ? 300 : 600}
+              height={isMobile ? 300 : 550}
+            />
           )}
 
           {invoices.data?.invoices?.map((invoice, index) => (
-- 
cgit v1.2.3


From 0178a1f88d7d34824562e1413be073c0795a47cf Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Mon, 16 Dec 2024 17:42:31 +0700
Subject: <iman> update code

---
 src/lib/tempo/components/Tempo.jsx | 134 +++++++++++++++++++------------------
 1 file changed, 70 insertions(+), 64 deletions(-)

(limited to 'src/lib/tempo/components/Tempo.jsx')

diff --git a/src/lib/tempo/components/Tempo.jsx b/src/lib/tempo/components/Tempo.jsx
index 8a7f4f71..97b21454 100644
--- a/src/lib/tempo/components/Tempo.jsx
+++ b/src/lib/tempo/components/Tempo.jsx
@@ -113,7 +113,9 @@ const Tempo = () => {
                   isLoaded={!isLoading}
                   h='fit'
                   w={32}
-                  className='badge-solid-green px-1 text-sm flex items-center justify-center font-thin'
+                  className={`${
+                    tempo.paymentTerm ? 'badge-solid-green' : 'badge-yellow'
+                  }  px-1 text-sm flex items-center justify-center font-thin`}
                 >
                   {tempo.paymentTerm ? tempo.paymentTerm : 'Review'}
                 </Skeleton>
@@ -175,7 +177,7 @@ const Tempo = () => {
                 {getLabel()}
               </span>
             </div>
-            {auth?.tempoProgres == 'review' && !tempo.paymentTerm ? (
+            {auth && auth?.tempoProgres == 'review' && !tempo.paymentTerm ? (
               <div className='flex justify-center'>
                 <Image
                   src='/images/ICON-DOKUMEN-VERIFIKASI.png'
@@ -313,7 +315,9 @@ const Tempo = () => {
                   isLoaded={!isLoading}
                   h='fit'
                   w={24}
-                  className='badge-solid-green px-1 text-xs flex items-center justify-center font-thin'
+                  className={`${
+                    tempo.paymentTerm ? 'badge-solid-green' : 'badge-yellow'
+                  }  px-1 text-xs flex items-center justify-center font-thin`}
                 >
                   {tempo.paymentTerm ? tempo.paymentTerm : 'Review'}
                 </Skeleton>
@@ -377,7 +381,7 @@ const Tempo = () => {
           </div>
         </div>
         <div className='p-4 flex flex-col gap-y-4'>
-          {!invoices.isLoading && invoices.data?.invoices?.length != 0 && (
+          {auth && !auth?.tempoProgres == 'review' && tempo.paymentTerm && (
             <form className='flex gap-x-3' onSubmit={handleSubmit}>
               <input
                 type='text'
@@ -398,7 +402,7 @@ const Tempo = () => {
             </div>
           )}
 
-          {!invoices.isLoading && invoices.data?.invoices?.length === 0 && (
+          {auth && auth?.tempoProgres == 'review' && !tempo.paymentTerm ? (
             // <Alert type='info' className='text-center'>
             //   Tidak ada invoice
             // </Alert>
@@ -408,72 +412,73 @@ const Tempo = () => {
               width={isMobile ? 300 : 600}
               height={isMobile ? 300 : 550}
             />
-          )}
-
-          {invoices.data?.invoices?.map((invoice, index) => (
-            <div
-              className='p-4 shadow border border-gray_r-3 rounded-md'
-              key={index}
-            >
-              <div className='grid grid-cols-2'>
-                <Link href={`/my/quotations/${invoice.salesOrderId}`}>
-                  <span className='text-caption-2 text-gray_r-11'>
-                    No. Transaksi
-                  </span>
-                  <h2 className='font-semibold text-black mt-1'>
-                    {invoice.salesOrder}
-                  </h2>
-                </Link>
-                <div className='flex gap-x-1 justify-end  items-end '>
-                  {invoice.amountResidual > 0 ? (
-                    new Date() > getDueDate(invoice.invoiceDateDue) ? (
-                      <div className='inline-flex items-end rounded-md bg-red-50 px-2 py-1 text-xs font-medium text-red-700 ring-1 ring-inset ring-red-600/20'>
-                        Jatuh Tempo
-                      </div>
+          ) : (
+            invoices.data?.invoices?.map((invoice, index) => (
+              <div
+                className='p-4 shadow border border-gray_r-3 rounded-md'
+                key={index}
+              >
+                <div className='grid grid-cols-2'>
+                  <Link href={`/my/quotations/${invoice.salesOrderId}`}>
+                    <span className='text-caption-2 text-gray_r-11'>
+                      No. Transaksi
+                    </span>
+                    <h2 className='font-semibold text-black mt-1'>
+                      {invoice.salesOrder}
+                    </h2>
+                  </Link>
+                  <div className='flex gap-x-1 justify-end  items-end '>
+                    {invoice.amountResidual > 0 ? (
+                      new Date() > getDueDate(invoice.invoiceDateDue) ? (
+                        <div className='inline-flex items-end rounded-md bg-red-50 px-2 py-1 text-xs font-medium text-red-700 ring-1 ring-inset ring-red-600/20'>
+                          Jatuh Tempo
+                        </div>
+                      ) : (
+                        <div className='badge-solid-red h-fit ml-auto'>
+                          Belum Lunas
+                        </div>
+                      )
                     ) : (
-                      <div className='badge-solid-red h-fit ml-auto'>
-                        Belum Lunas
+                      <div className='badge-solid-green h-fit ml-auto'>
+                        Lunas
                       </div>
-                    )
-                  ) : (
-                    <div className='badge-solid-green h-fit ml-auto'>Lunas</div>
-                  )}
-                  {/* <EllipsisVerticalIcon
+                    )}
+                    {/* <EllipsisVerticalIcon
                     className='w-5 h-5'
                     onClick={() => setToOthers(invoice)}
                   /> */}
+                  </div>
                 </div>
-              </div>
-              <Link href={`/my/invoices/${invoice.id}`}>
-                <div className='grid grid-cols-2 text-caption-2 text-gray_r-11 mt-2 font-normal'>
-                  <p className='opacity-70'>
-                    {formatTanggal(invoice.invoiceDate)}
-                  </p>
-                  <p className='text-right text-xs text-red-500'>
-                    Jatuh Tempo: {formatTanggal(invoice.invoiceDateDue)}
-                  </p>
-                </div>
-                <hr className='my-3' />
-                <div className='grid grid-cols-2'>
-                  <div>
-                    <span className='text-caption-2 text-gray_r-11'>
-                      No. Invoice
-                    </span>
-                    <p className='mt-1 font-semibold text-gray_r-12'>
-                      {invoice.name || '-'}
+                <Link href={`/my/invoices/${invoice.id}`}>
+                  <div className='grid grid-cols-2 text-caption-2 text-gray_r-11 mt-2 font-normal'>
+                    <p className='opacity-70'>
+                      {formatTanggal(invoice.invoiceDate)}
                     </p>
-                  </div>
-                  <div className='text-right'>
-                    <span className='opacity-65 text-caption-2 text-gray_r-11'>
-                      Total Belanja
-                    </span>
-                    <p className='mt-1 font-semibold text-red-500 '>
-                      {currencyFormat(invoice.amountTotal)}
+                    <p className='text-right text-xs text-red-500'>
+                      Jatuh Tempo: {formatTanggal(invoice.invoiceDateDue)}
                     </p>
                   </div>
-                </div>
-              </Link>
-              {/* {invoice.efaktur ? (
+                  <hr className='my-3' />
+                  <div className='grid grid-cols-2'>
+                    <div>
+                      <span className='text-caption-2 text-gray_r-11'>
+                        No. Invoice
+                      </span>
+                      <p className='mt-1 font-semibold text-gray_r-12'>
+                        {invoice.name || '-'}
+                      </p>
+                    </div>
+                    <div className='text-right'>
+                      <span className='opacity-65 text-caption-2 text-gray_r-11'>
+                        Total Belanja
+                      </span>
+                      <p className='mt-1 font-semibold text-red-500 '>
+                        {currencyFormat(invoice.amountTotal)}
+                      </p>
+                    </div>
+                  </div>
+                </Link>
+                {/* {invoice.efaktur ? (
                 <div className='badge-green h-fit mt-3 ml-auto flex items-center gap-x-0.5'>
                   <CheckIcon className='w-4 stroke-2' />
                   Faktur Pajak
@@ -484,8 +489,9 @@ const Tempo = () => {
                   Faktur Pajak
                 </div>
               )} */}
-            </div>
-          ))}
+              </div>
+            ))
+          )}
 
           <Pagination
             pageCount={pageCount}
-- 
cgit v1.2.3


From daa0b872601789815513508d48a14cbd8e1f6518 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Mon, 23 Dec 2024 13:39:47 +0700
Subject: <iman> update pengajuan tempo

---
 src/lib/tempo/components/Tempo.jsx | 16 +++++++++-------
 1 file changed, 9 insertions(+), 7 deletions(-)

(limited to 'src/lib/tempo/components/Tempo.jsx')

diff --git a/src/lib/tempo/components/Tempo.jsx b/src/lib/tempo/components/Tempo.jsx
index 97b21454..6f0a2a8c 100644
--- a/src/lib/tempo/components/Tempo.jsx
+++ b/src/lib/tempo/components/Tempo.jsx
@@ -323,7 +323,7 @@ const Tempo = () => {
                 </Skeleton>
               </p>
             </div>
-            <div className='flex  justify-around text-sm '>
+            <div className='flex items-start justify-around text-sm '>
               <div className='w-[40%]  flex flex-col gap-2'>
                 <p>Kredit Limit Terpakai</p>
                 <Skeleton
@@ -406,12 +406,14 @@ const Tempo = () => {
             // <Alert type='info' className='text-center'>
             //   Tidak ada invoice
             // </Alert>
-            <Image
-              src='/images/ICON-DOKUMEN-VERIFIKASI.png'
-              alt='Registrasi Tempo'
-              width={isMobile ? 300 : 600}
-              height={isMobile ? 300 : 550}
-            />
+            <div className='flex items-center justify-center'>
+              <Image
+                src='/images/ICON-DOKUMEN-VERIFIKASI.png'
+                alt='Registrasi Tempo'
+                width={isMobile ? 300 : 600}
+                height={isMobile ? 300 : 550}
+              />
+            </div>
           ) : (
             invoices.data?.invoices?.map((invoice, index) => (
               <div
-- 
cgit v1.2.3


From 6f4ecaa362c2333c59d08f775c13fa1c5bf5e13b Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Thu, 9 Jan 2025 08:53:25 +0700
Subject: <iman> update tempo

---
 src/lib/tempo/components/Tempo.jsx | 194 ++++++++++++++++++++++++++++++-------
 1 file changed, 160 insertions(+), 34 deletions(-)

(limited to 'src/lib/tempo/components/Tempo.jsx')

diff --git a/src/lib/tempo/components/Tempo.jsx b/src/lib/tempo/components/Tempo.jsx
index 6f0a2a8c..f2a9e650 100644
--- a/src/lib/tempo/components/Tempo.jsx
+++ b/src/lib/tempo/components/Tempo.jsx
@@ -29,18 +29,22 @@ import ProgressBar from '@ramonak/react-progress-bar';
 import FooterBanner from '~/modules/footer-banner';
 import Image from '~/components/ui/image';
 import useDevice from '@/core/hooks/useDevice';
+import { Tooltip } from '@chakra-ui/react';
+import { InfoIcon } from 'lucide-react';
 const Tempo = () => {
   const auth = getAuth();
   const router = useRouter();
-  const { q = '', page = 1, limit = 15 } = router.query;
+  const { q = '', page = 1, limit = 15, status = 0 } = router.query;
   const { isDesktop, isMobile } = useDevice();
   const [pageNew, setPageNew] = useState(page);
   const [limitNew, setLimitNew] = useState(limit);
+  const [statusNew, setStatusNew] = useState(status);
 
   const query = {
     name: q,
     offset: (pageNew - 1) * limitNew,
     limit: limitNew,
+    status: statusNew,
   };
   const { invoices } = useInvoices({ query });
   const [isLoading, setIsLoading] = useState(true);
@@ -71,7 +75,7 @@ const Tempo = () => {
   const limitTempo = Math.round(
     parseInt(tempo.amountDue + tempo.remainingLimit)
   );
-  const amountDue = Math.round(parseInt(tempo.amountDue));
+  const amountDue = Math.round(parseInt(tempo.amountDue + tempo.amountDueSale));
   const getLabel = () => {
     if (Math.round((amountDue / limitTempo) * 100) >= 100)
       return 'Limit Tempo mencapai batas';
@@ -79,7 +83,13 @@ const Tempo = () => {
     return '';
   };
   const startItem = 1 + (pageNew - 1) * limitNew;
-  const endItem = Math.min(limitNew * pageNew, invoices?.data?.invoiceTotal);
+  const endItem = Math.min(
+    limitNew * pageNew,
+    invoices?.data?.invoiceTotal +
+      (statusNew === 0 || statusNew === 2 || statusNew === 4
+        ? invoices?.data?.saleOrderTotal
+        : 0)
+  );
   const getDueDate = (invoice) => {
     const [day, month, year] = invoice.split('/');
     const dueDate = new Date(year, month - 1, day); // Konversi ke objek Date
@@ -97,6 +107,13 @@ const Tempo = () => {
 
     return formattedDate;
   };
+
+  const handleClick = () => {
+    setStatusNew((prevStatus) => (prevStatus === 4 ? 0 : 4)); // Toggle antara 4 dan 0
+  };
+  const handleClickInvoice = () => {
+    setStatusNew((prevStatus) => (prevStatus === 1 ? 0 : 1)); // Toggle antara 4 dan 0
+  };
   return (
     <>
       <DesktopView>
@@ -107,6 +124,27 @@ const Tempo = () => {
           <div className='w-9/12 p-4 bg-white border border-gray_r-6 rounded flex flex-col gap-y-4'>
             <div className='flex flex-col mb-6 items-start justify-start'>
               <h1 className='text-title-sm font-semibold'>Pembayaran Tempo</h1>
+              <div className='flex items-start mb-4'>
+                <p className='flex flex-row gap-2 w-full items-center'>
+                  Kredit Limit Anda
+                  <Skeleton
+                    isLoaded={!isLoading}
+                    h='fit'
+                    w='fit'
+                    className='text-3xl font-semibold text-green-600 min-w-56'
+                  >
+                    {limitTempo ? currencyFormat(limitTempo) : '-'}
+                  </Skeleton>
+                </p>
+                <Tooltip
+                  placement='top-start'
+                  label='Jumlah kredit limit dapat berubah sesuai dengan ketentuan yang Indoteknik miliki.'
+                >
+                  <div className='text-gray-600'>
+                    <InfoIcon size={15} />
+                  </div>
+                </Tooltip>
+              </div>
               <p className='flex flex-row gap-2 w-full'>
                 Status Detail Tempo Pembayaran Anda adalah{' '}
                 <Skeleton
@@ -121,25 +159,14 @@ const Tempo = () => {
                 </Skeleton>
               </p>
             </div>
-            <div className='grid grid-flow-col gap-4 mb-4'>
-              <div className='border  w-full p-4'>
-                <p>Kredit Limit Terpakai</p>
-                <Skeleton
-                  isLoaded={!isLoading}
-                  h='36px'
-                  // w={16}
-                  className='text-3xl font-semibold'
-                >
-                  {amountDue ? currencyFormat(amountDue) : '-'}
-                </Skeleton>
-              </div>
+            <div className='flex flex-row gap-4'>
               <div className='border w-full p-4'>
                 <p>Sisa Kredit Limit</p>
                 <Skeleton
                   isLoaded={!isLoading}
                   h='36px'
                   // w={16}
-                  className='text-3xl font-semibold'
+                  className='text-3xl font-semibold text-green-600'
                 >
                   {limitTempo && amountDue
                     ? currencyFormat(
@@ -148,31 +175,72 @@ const Tempo = () => {
                     : '-'}
                 </Skeleton>
               </div>
-              <div className='border w-full p-4'>
-                <p>Kredit Limit</p>
+              <div
+                className={`border  w-fit p-4 flex gap-4 items-center hover:cursor-pointer hover:shadow-lg ${
+                  statusNew == 4 ? 'bg-red-100' : ''
+                }`}
+                onClick={handleClick}
+              >
+                <div className=''>
+                  <p>Kredit Limit Terpakai</p>
+                  <Skeleton
+                    isLoaded={!isLoading}
+                    h='36px'
+                    // w={16}
+                    className='text-3xl font-semibold text-red-600'
+                  >
+                    {amountDue ? currencyFormat(amountDue) : '-'}
+                  </Skeleton>
+                </div>
+                <div className='w-fit h-full flex items-center text-red-600 text-lg text-nowrap font-medium '>
+                  {tempo.amountDueTotal
+                    ? tempo.amountDueTotal +
+                      tempo.amountDueSaleTotal +
+                      ` Transaksi`
+                    : ''}
+                </div>
+              </div>
+              <div
+                className={`border  w-fit p-4 flex gap-4 items-center hover:cursor-pointer hover:shadow-lg ${
+                  statusNew == 1 ? 'bg-red-100' : ''
+                }`}
+                onClick={handleClickInvoice}
+              >
+                <div className=''>
+                  <p>Jatuh Tempo</p>
+                  <Skeleton
+                    isLoaded={!isLoading}
+                    h='36px'
+                    // w={16}
+                    className='text-3xl font-semibold text-red-600'
+                  >
+                    {tempo.amountJatuhTempo
+                      ? currencyFormat(tempo.amountJatuhTempo)
+                      : '-'}
+                  </Skeleton>
+                </div>
+                <div className='w-fit h-full flex items-center text-red-600 text-lg text-nowrap font-medium '>
+                  {tempo.amountJatuhTempoTotal
+                    ? tempo.amountJatuhTempoTotal + ` Invoice`
+                    : ''}
+                </div>
+              </div>
+              {/* <div className='border w-full p-4'>
+                <p>Jatuh Tempo</p>
                 <Skeleton
                   isLoaded={!isLoading}
                   h='36px'
                   // w={16}
-                  className='text-3xl font-semibold'
+                  className='text-3xl font-semibold text-red-600'
                 >
-                  {limitTempo ? currencyFormat(limitTempo) : '-'}
+                  {tempo.amountJatuhTempo
+                    ? currencyFormat(tempo.amountJatuhTempo)
+                    : '-'}
                 </Skeleton>
-              </div>
+              </div> */}
             </div>
 
             <div className='flex gap-2 flex-col'>
-              <ProgressBar
-                completed={amountDue}
-                bgColor='#ef4444'
-                labelAlignment='outside'
-                isLabelVisible={false}
-                baseBgColor='#E5E7EB'
-                labelColor='#e80909'
-                labelSize='0'
-                maxCompleted={limitTempo}
-                height='10px'
-              />
               <span className='flex justify-end opacity-75 font-semibold text-red-500'>
                 {getLabel()}
               </span>
@@ -187,7 +255,7 @@ const Tempo = () => {
                 />
               </div>
             ) : (
-              <div className='border p-4 rounded mt-4'>
+              <div className='border p-4 rounded'>
                 <div className='flex mb-6 items-center justify-between mt-4'>
                   <form className='flex' onSubmit={handleSubmit}>
                     <button className='bg-gray_r-2 px-3' type='submit'>
@@ -205,7 +273,10 @@ const Tempo = () => {
                     <div className='flex flex-row gap-4 items-center justify-center'>
                       <p>
                         Menampilkan {startItem}-{endItem} dari{' '}
-                        {invoices?.data?.invoiceTotal}
+                        {invoices?.data?.invoiceTotal +
+                          (statusNew === 0 || statusNew === 2 || statusNew === 4
+                            ? invoices?.data?.saleOrderTotal
+                            : 0)}
                       </p>
                       <select
                         id='limitSelect'
@@ -220,6 +291,19 @@ const Tempo = () => {
                         <option value={15}>15</option>
                         <option value={20}>20</option>
                       </select>
+                      <select
+                        id='statusSelect'
+                        value={statusNew}
+                        onChange={(e) => {
+                          setStatusNew(Number(e.target.value));
+                        }}
+                        className='border p-2'
+                      >
+                        <option value={0}>All</option>
+                        <option value={1}>Jatuh Tempo</option>
+                        <option value={2}>Belum Jatuh Tempo</option>
+                        <option value={3}>Lunas</option>
+                      </select>
                     </div>
                   )}
                 </div>
@@ -236,6 +320,48 @@ const Tempo = () => {
                       <th className='!text-left'>Total</th>
                     </tr>
                   </thead>
+                  <tbody>
+                    {/* {invoices.isLoading && (
+                      <tr>
+                        <td colSpan={6}>
+                          <div className='flex justify-center my-2'>
+                            <Spinner className='w-6 text-gray_r-12/50 fill-gray_r-12' />
+                          </div>
+                        </td>
+                      </tr>
+                    )} */}
+                    {/* {!invoices.isLoading &&
+                      (!invoices?.data?.saleOrders ||
+                        invoices?.data?.saleOrders?.length == 0) && (
+                        <tr>
+                          <td colSpan={6}>Tidak ada orders</td>
+                        </tr>
+                      )} */}
+                    {(statusNew == 0 || statusNew == 2 || statusNew == 4) &&
+                      invoices.data?.saleOrders?.map((orders) => (
+                        <tr key={orders.id}>
+                          <td>{orders.salesOrder || '-'}</td>
+                          <td>
+                            <Link href={`/my/transactions/${orders.id}`}>
+                              {orders.name}
+                            </Link>
+                          </td>
+                          <td className='!text-left'>{orders.sales}</td>
+                          <td>{orders.dateOrder.split(' ')[0]}</td>
+                          <td>-</td>
+                          <td>
+                            {
+                              <div className=' h-fit mx-auto inline-flex items-center rounded-md bg-red-50 px-2 py-1 text-xs font-medium text-red-700 ring-1 ring-inset ring-red-600/20'>
+                                Belum Jatuh Tempo
+                              </div>
+                            }
+                          </td>
+                          <td className='!text-left'>
+                            {currencyFormat(orders.amountTotal)}
+                          </td>
+                        </tr>
+                      ))}
+                  </tbody>
                   <tbody>
                     {invoices.isLoading && (
                       <tr>
-- 
cgit v1.2.3


From ad3418b4181a79485b0feb6882d6ae4ec744c776 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Thu, 9 Jan 2025 09:51:23 +0700
Subject: <iman> update tempo

---
 src/lib/tempo/components/Tempo.jsx | 40 +++++++-------------------------------
 1 file changed, 7 insertions(+), 33 deletions(-)

(limited to 'src/lib/tempo/components/Tempo.jsx')

diff --git a/src/lib/tempo/components/Tempo.jsx b/src/lib/tempo/components/Tempo.jsx
index f2a9e650..b79824fa 100644
--- a/src/lib/tempo/components/Tempo.jsx
+++ b/src/lib/tempo/components/Tempo.jsx
@@ -76,12 +76,7 @@ const Tempo = () => {
     parseInt(tempo.amountDue + tempo.remainingLimit)
   );
   const amountDue = Math.round(parseInt(tempo.amountDue + tempo.amountDueSale));
-  const getLabel = () => {
-    if (Math.round((amountDue / limitTempo) * 100) >= 100)
-      return 'Limit Tempo mencapai batas';
-    if (Math.round((amountDue / limitTempo) * 100) >= 50) return 'Hampir Habis';
-    return '';
-  };
+
   const startItem = 1 + (pageNew - 1) * limitNew;
   const endItem = Math.min(
     limitNew * pageNew,
@@ -159,13 +154,13 @@ const Tempo = () => {
                 </Skeleton>
               </p>
             </div>
-            <div className='flex flex-row gap-4'>
+            <div className='grid grid-flow-col gap-4'>
               <div className='border w-full p-4'>
                 <p>Sisa Kredit Limit</p>
                 <Skeleton
                   isLoaded={!isLoading}
                   h='36px'
-                  // w={16}
+                  w='full'
                   className='text-3xl font-semibold text-green-600'
                 >
                   {limitTempo && amountDue
@@ -176,7 +171,7 @@ const Tempo = () => {
                 </Skeleton>
               </div>
               <div
-                className={`border  w-fit p-4 flex gap-4 items-center hover:cursor-pointer hover:shadow-lg ${
+                className={`border  w-full p-4 flex gap-4  items-center hover:cursor-pointer hover:shadow-lg ${
                   statusNew == 4 ? 'bg-red-100' : ''
                 }`}
                 onClick={handleClick}
@@ -186,7 +181,7 @@ const Tempo = () => {
                   <Skeleton
                     isLoaded={!isLoading}
                     h='36px'
-                    // w={16}
+                    w='full'
                     className='text-3xl font-semibold text-red-600'
                   >
                     {amountDue ? currencyFormat(amountDue) : '-'}
@@ -201,7 +196,7 @@ const Tempo = () => {
                 </div>
               </div>
               <div
-                className={`border  w-fit p-4 flex gap-4 items-center hover:cursor-pointer hover:shadow-lg ${
+                className={`border  w-full p-4 flex gap-4 items-center hover:cursor-pointer hover:shadow-lg ${
                   statusNew == 1 ? 'bg-red-100' : ''
                 }`}
                 onClick={handleClickInvoice}
@@ -211,7 +206,7 @@ const Tempo = () => {
                   <Skeleton
                     isLoaded={!isLoading}
                     h='36px'
-                    // w={16}
+                    w='full'
                     className='text-3xl font-semibold text-red-600'
                   >
                     {tempo.amountJatuhTempo
@@ -240,11 +235,6 @@ const Tempo = () => {
               </div> */}
             </div>
 
-            <div className='flex gap-2 flex-col'>
-              <span className='flex justify-end opacity-75 font-semibold text-red-500'>
-                {getLabel()}
-              </span>
-            </div>
             {auth && auth?.tempoProgres == 'review' && !tempo.paymentTerm ? (
               <div className='flex justify-center'>
                 <Image
@@ -488,22 +478,6 @@ const Tempo = () => {
                 </Skeleton>
               </div>
             </div>
-            <div className='flex gap-2 flex-col'>
-              <ProgressBar
-                completed={amountDue}
-                bgColor='#ef4444'
-                labelAlignment='outside'
-                isLabelVisible={false}
-                baseBgColor='#E5E7EB'
-                labelColor='#e80909'
-                labelSize='0'
-                maxCompleted={limitTempo}
-                height='6px'
-              />
-              <span className='flex justify-end opacity-75 text-xs font-semibold text-red-500'>
-                {getLabel()}
-              </span>
-            </div>
           </div>
         </div>
         <div className='p-4 flex flex-col gap-y-4'>
-- 
cgit v1.2.3


From fedaceac3e41741c198c94fd20917c9572fa7ec1 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Fri, 10 Jan 2025 15:26:44 +0700
Subject: <iman> update tempo page mobile view

---
 src/lib/tempo/components/Tempo.jsx | 305 +++++++++++++++++++++++++------------
 1 file changed, 209 insertions(+), 96 deletions(-)

(limited to 'src/lib/tempo/components/Tempo.jsx')

diff --git a/src/lib/tempo/components/Tempo.jsx b/src/lib/tempo/components/Tempo.jsx
index b79824fa..3af5b56c 100644
--- a/src/lib/tempo/components/Tempo.jsx
+++ b/src/lib/tempo/components/Tempo.jsx
@@ -25,7 +25,6 @@ import DesktopView from '@/core/components/views/DesktopView';
 import Menu from '@/lib/auth/components/Menu';
 import odooApi from '@/core/api/odooApi';
 import { getAuth } from '@/core/utils/auth';
-import ProgressBar from '@ramonak/react-progress-bar';
 import FooterBanner from '~/modules/footer-banner';
 import Image from '~/components/ui/image';
 import useDevice from '@/core/hooks/useDevice';
@@ -286,6 +285,11 @@ const Tempo = () => {
                         value={statusNew}
                         onChange={(e) => {
                           setStatusNew(Number(e.target.value));
+                          if (e.target.value == 0) {
+                            if (inputQuery) {
+                              router.push('/my/tempo/');
+                            }
+                          }
                         }}
                         className='border p-2'
                       >
@@ -424,40 +428,44 @@ const Tempo = () => {
       <MobileView>
         <div className=' bg-[#FEF8E2] w-[110%] inset-0 relative transform -translate-x-5 px-8 py-4'>
           <div className='flex flex-col gap-y-4 '>
+            <p className='flex flex-row gap-2 w-full text-sm items-center'>
+              <span className='opacity-70 text-nowrap'>
+                Kredit Limit Anda :{' '}
+              </span>
+              <Skeleton
+                isLoaded={!isLoading}
+                h='fit'
+                w='fit'
+                className='text-xl font-semibold text-green-700 min-w-56'
+              >
+                {limitTempo ? currencyFormat(limitTempo) : '-'}
+              </Skeleton>
+            </p>
             <div className='flex flex-col items-center justify-center'>
               <p className='flex flex-row w-full text-sm gap-2 items-center justify-start'>
-                Status Detail Tempo Pembayaran Anda adalah{' '}
+                <span className='opacity-70'>
+                  Status Detail Tempo Pembayaran Anda adalah :
+                </span>
                 <Skeleton
                   isLoaded={!isLoading}
                   h='fit'
                   w={24}
                   className={`${
                     tempo.paymentTerm ? 'badge-solid-green' : 'badge-yellow'
-                  }  px-1 text-xs flex items-center justify-center font-thin`}
+                  }  px-1 text-xs flex items-center justify-center font-extralight text-nowrap`}
                 >
                   {tempo.paymentTerm ? tempo.paymentTerm : 'Review'}
                 </Skeleton>
               </p>
             </div>
-            <div className='flex items-start justify-around text-sm '>
-              <div className='w-[40%]  flex flex-col gap-2'>
-                <p>Kredit Limit Terpakai</p>
-                <Skeleton
-                  isLoaded={!isLoading}
-                  // h='36px'
-                  // w={16}
-                  className='font-semibold text-base'
-                >
-                  {amountDue ? currencyFormat(amountDue) : '-'}
-                </Skeleton>
-              </div>
+            <div className='flex items-start justify-around text-sm gap-3'>
               <div className='w-[30%] flex  flex-col gap-2'>
-                <p>Sisa Kredit Limit</p>
+                <p className='opacity-70 text-nowrap'>Sisa Kredit Limit</p>
                 <Skeleton
                   isLoaded={!isLoading}
                   // h='36px'
                   // w={16}
-                  className='font-semibold text-base'
+                  className='font-semibold text-sm text-nowrap text-green-700 '
                 >
                   {limitTempo && amountDue
                     ? currencyFormat(
@@ -465,34 +473,72 @@ const Tempo = () => {
                       )
                     : '-'}
                 </Skeleton>
+              </div>{' '}
+              <div className='w-[40%]  flex flex-col gap-2'>
+                <p className='opacity-70 text-nowrap'>Kredit Limit Terpakai</p>
+                <Skeleton
+                  isLoaded={!isLoading}
+                  // h='36px'
+                  // w={16}
+                  className='font-semibold text-sm text-nowrap text-green-700'
+                >
+                  {amountDue ? currencyFormat(amountDue) : '-'}
+                </Skeleton>
               </div>
               <div className=' w-[30%] flex flex-col gap-2'>
-                <p>Kredit Limit</p>
+                <p className='opacity-70 text-nowrap'>Jatuh Tempo</p>
                 <Skeleton
                   isLoaded={!isLoading}
                   // h='36px'
                   // w={16}
-                  className=' font-semibold text-base'
+                  className=' font-semibold text-sm text-nowrap text-red-600'
                 >
-                  {limitTempo ? currencyFormat(limitTempo) : '-'}
+                  {tempo.amountJatuhTempo
+                    ? currencyFormat(tempo.amountJatuhTempo)
+                    : '-'}
                 </Skeleton>
               </div>
             </div>
           </div>
         </div>
-        <div className='p-4 flex flex-col gap-y-4'>
-          {auth && !auth?.tempoProgres == 'review' && tempo.paymentTerm && (
-            <form className='flex gap-x-3' onSubmit={handleSubmit}>
-              <input
-                type='text'
-                className='form-input'
-                placeholder='Cari Invoice...'
-                value={inputQuery}
-                onChange={(e) => setInputQuery(e.target.value)}
-              />
+        <div className='p-4 flex flex-col gap-y-4 w-full'>
+          {auth && (!auth?.tempoProgres == 'review' || tempo.paymentTerm) && (
+            <form
+              className='w-full flex gap-x-2 flex-row justify-between'
+              onSubmit={handleSubmit}
+            >
+              <div className='flex w-3/5'>
+                <input
+                  type='text'
+                  className='form-input'
+                  placeholder='Cari Invoice...'
+                  value={inputQuery}
+                  onChange={(e) => setInputQuery(e.target.value)}
+                />
+              </div>
               <button className='btn-light bg-transparent px-3' type='submit'>
                 <MagnifyingGlassIcon className='w-6' />
               </button>
+              <div className='flex w-1/5 '>
+                <div className='flex flex-row gap-4 items-center justify-center'>
+                  <select
+                    id='statusSelect'
+                    value={statusNew}
+                    onChange={(e) => {
+                      setStatusNew(Number(e.target.value));
+                      if (e.target.value == 0) {
+                        setInputQuery(' ');
+                      }
+                    }}
+                    className='border p-2 w-full h-full rounded-md'
+                  >
+                    <option value={0}>All</option>
+                    <option value={1}>Jatuh Tempo</option>
+                    <option value={2}>Belum Jatuh Tempo</option>
+                    <option value={3}>Lunas</option>
+                  </select>
+                </div>
+              </div>
             </form>
           )}
 
@@ -515,90 +561,157 @@ const Tempo = () => {
               />
             </div>
           ) : (
-            invoices.data?.invoices?.map((invoice, index) => (
-              <div
-                className='p-4 shadow border border-gray_r-3 rounded-md'
-                key={index}
-              >
-                <div className='grid grid-cols-2'>
-                  <Link href={`/my/quotations/${invoice.salesOrderId}`}>
-                    <span className='text-caption-2 text-gray_r-11'>
-                      No. Transaksi
-                    </span>
-                    <h2 className='font-semibold text-black mt-1'>
-                      {invoice.salesOrder}
-                    </h2>
-                  </Link>
-                  <div className='flex gap-x-1 justify-end  items-end '>
-                    {invoice.amountResidual > 0 ? (
-                      new Date() > getDueDate(invoice.invoiceDateDue) ? (
-                        <div className='inline-flex items-end rounded-md bg-red-50 px-2 py-1 text-xs font-medium text-red-700 ring-1 ring-inset ring-red-600/20'>
-                          Jatuh Tempo
-                        </div>
-                      ) : (
+            <div>
+              {(statusNew == 0 || statusNew == 2 || statusNew == 4) &&
+                invoices.data?.saleOrders?.map((invoice, index) => (
+                  <div
+                    className='p-4 shadow border border-gray_r-3 rounded-md'
+                    key={index}
+                  >
+                    <div className='grid grid-cols-2'>
+                      <Link href={`/my/quotations/${invoice.id}`}>
+                        <span className='text-caption-2 text-gray_r-11'>
+                          No. Transaksi
+                        </span>
+                        <h2 className='font-semibold text-black mt-1'>
+                          {invoice.name}
+                        </h2>
+                      </Link>
+                      <div className='flex gap-x-1 justify-end  items-end '>
                         <div className='badge-solid-red h-fit ml-auto'>
-                          Belum Lunas
+                          Belum Jatuh Tempo
                         </div>
-                      )
-                    ) : (
-                      <div className='badge-solid-green h-fit ml-auto'>
-                        Lunas
+                        {/* <EllipsisVerticalIcon
+                      className='w-5 h-5'
+                      onClick={() => setToOthers(invoice)}
+                    /> */}
                       </div>
-                    )}
-                    {/* <EllipsisVerticalIcon
-                    className='w-5 h-5'
-                    onClick={() => setToOthers(invoice)}
-                  /> */}
+                    </div>
+                    <Link href={`/my/quotations/${invoice.id}`}>
+                      <div className='grid grid-cols-2 text-caption-2 text-gray_r-11 mt-2 font-normal'>
+                        <p className='opacity-70'>
+                          {invoice.dateOrder.split(' ')[0]}
+                        </p>
+                        <p className='text-right text-xs text-red-500'>
+                          Jatuh Tempo: -
+                        </p>
+                      </div>
+                      <hr className='my-3' />
+                      <div className='grid grid-cols-2'>
+                        <div>
+                          <span className='text-caption-2 text-gray_r-11'>
+                            No. Invoice
+                          </span>
+                          <p className='mt-1 font-semibold text-gray_r-12'>-</p>
+                        </div>
+                        <div className='text-right'>
+                          <span className='opacity-65 text-caption-2 text-gray_r-11'>
+                            Total Belanja
+                          </span>
+                          <p className='mt-1 font-semibold text-red-500 '>
+                            {currencyFormat(invoice.amountTotal)}
+                          </p>
+                        </div>
+                      </div>
+                    </Link>
+                    {/* {invoice.efaktur ? (
+                  <div className='badge-green h-fit mt-3 ml-auto flex items-center gap-x-0.5'>
+                    <CheckIcon className='w-4 stroke-2' />
+                    Faktur Pajak
                   </div>
-                </div>
-                <Link href={`/my/invoices/${invoice.id}`}>
-                  <div className='grid grid-cols-2 text-caption-2 text-gray_r-11 mt-2 font-normal'>
-                    <p className='opacity-70'>
-                      {formatTanggal(invoice.invoiceDate)}
-                    </p>
-                    <p className='text-right text-xs text-red-500'>
-                      Jatuh Tempo: {formatTanggal(invoice.invoiceDateDue)}
-                    </p>
+                ) : (
+                  <div className='badge-red h-fit mt-3 ml-auto flex items-center gap-x-0.5'>
+                    <ClockIcon className='w-4 stroke-2' />
+                    Faktur Pajak
                   </div>
-                  <hr className='my-3' />
+                )} */}
+                  </div>
+                ))}
+              {invoices.data?.invoices?.map((invoice, index) => (
+                <div
+                  className='p-4 shadow border border-gray_r-3 rounded-md'
+                  key={index}
+                >
                   <div className='grid grid-cols-2'>
-                    <div>
+                    <Link href={`/my/quotations/${invoice.salesOrderId}`}>
                       <span className='text-caption-2 text-gray_r-11'>
-                        No. Invoice
+                        No. Transaksi
                       </span>
-                      <p className='mt-1 font-semibold text-gray_r-12'>
-                        {invoice.name || '-'}
-                      </p>
+                      <h2 className='font-semibold text-black mt-1'>
+                        {invoice.salesOrder}
+                      </h2>
+                    </Link>
+                    <div className='flex gap-x-1 justify-end  items-end '>
+                      {invoice.amountResidual > 0 ? (
+                        new Date() > getDueDate(invoice.invoiceDateDue) ? (
+                          <div className='inline-flex items-end rounded-md bg-red-50 px-2 py-1 text-xs font-medium text-red-700 ring-1 ring-inset ring-red-600/20'>
+                            Jatuh Tempo
+                          </div>
+                        ) : (
+                          <div className='badge-solid-red h-fit ml-auto'>
+                            Belum Jatuh Tempo
+                          </div>
+                        )
+                      ) : (
+                        <div className='badge-solid-green h-fit ml-auto'>
+                          Lunas
+                        </div>
+                      )}
+                      {/* <EllipsisVerticalIcon
+                      className='w-5 h-5'
+                      onClick={() => setToOthers(invoice)}
+                    /> */}
                     </div>
-                    <div className='text-right'>
-                      <span className='opacity-65 text-caption-2 text-gray_r-11'>
-                        Total Belanja
-                      </span>
-                      <p className='mt-1 font-semibold text-red-500 '>
-                        {currencyFormat(invoice.amountTotal)}
+                  </div>
+                  <Link href={`/my/invoices/${invoice.id}`}>
+                    <div className='grid grid-cols-2 text-caption-2 text-gray_r-11 mt-2 font-normal'>
+                      <p className='opacity-70'>
+                        {formatTanggal(invoice.invoiceDate)}
                       </p>
+                      <p className='text-right text-xs text-red-500'>
+                        Jatuh Tempo: {formatTanggal(invoice.invoiceDateDue)}
+                      </p>
+                    </div>
+                    <hr className='my-3' />
+                    <div className='grid grid-cols-2'>
+                      <div>
+                        <span className='text-caption-2 text-gray_r-11'>
+                          No. Invoice
+                        </span>
+                        <p className='mt-1 font-semibold text-gray_r-12'>
+                          {invoice.name || '-'}
+                        </p>
+                      </div>
+                      <div className='text-right'>
+                        <span className='opacity-65 text-caption-2 text-gray_r-11'>
+                          Total Belanja
+                        </span>
+                        <p className='mt-1 font-semibold text-red-500 '>
+                          {currencyFormat(invoice.amountTotal)}
+                        </p>
+                      </div>
                     </div>
+                  </Link>
+                  {/* {invoice.efaktur ? (
+                  <div className='badge-green h-fit mt-3 ml-auto flex items-center gap-x-0.5'>
+                    <CheckIcon className='w-4 stroke-2' />
+                    Faktur Pajak
                   </div>
-                </Link>
-                {/* {invoice.efaktur ? (
-                <div className='badge-green h-fit mt-3 ml-auto flex items-center gap-x-0.5'>
-                  <CheckIcon className='w-4 stroke-2' />
-                  Faktur Pajak
-                </div>
-              ) : (
-                <div className='badge-red h-fit mt-3 ml-auto flex items-center gap-x-0.5'>
-                  <ClockIcon className='w-4 stroke-2' />
-                  Faktur Pajak
+                ) : (
+                  <div className='badge-red h-fit mt-3 ml-auto flex items-center gap-x-0.5'>
+                    <ClockIcon className='w-4 stroke-2' />
+                    Faktur Pajak
+                  </div>
+                )} */}
                 </div>
-              )} */}
-              </div>
-            ))
+              ))}
+            </div>
           )}
 
           <Pagination
             pageCount={pageCount}
             currentPage={parseInt(pageNew)}
-            url={`/my/invoices${pageQuery}`}
+            url={`/my/tempo?${toQuery(_.omit(query, ['page']))}`}
             className='mt-2 mb-2'
           />
 
-- 
cgit v1.2.3


From 40f762589601de0fe1d5b06164b2553ebdbf5ecd Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Sat, 11 Jan 2025 09:27:46 +0700
Subject: <iman> update code

---
 src/lib/tempo/components/Tempo.jsx | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

(limited to 'src/lib/tempo/components/Tempo.jsx')

diff --git a/src/lib/tempo/components/Tempo.jsx b/src/lib/tempo/components/Tempo.jsx
index 3af5b56c..c246f3d8 100644
--- a/src/lib/tempo/components/Tempo.jsx
+++ b/src/lib/tempo/components/Tempo.jsx
@@ -33,7 +33,7 @@ import { InfoIcon } from 'lucide-react';
 const Tempo = () => {
   const auth = getAuth();
   const router = useRouter();
-  const { q = '', page = 1, limit = 15, status = 0 } = router.query;
+  const { q = '', page = 1, limit = 15, status = '' } = router.query;
   const { isDesktop, isMobile } = useDevice();
   const [pageNew, setPageNew] = useState(page);
   const [limitNew, setLimitNew] = useState(limit);
@@ -282,7 +282,7 @@ const Tempo = () => {
                       </select>
                       <select
                         id='statusSelect'
-                        value={statusNew}
+                        value={statusNew ?? ''} // Gunakan nullish coalescing untuk default value
                         onChange={(e) => {
                           setStatusNew(Number(e.target.value));
                           if (e.target.value == 0) {
@@ -293,6 +293,9 @@ const Tempo = () => {
                         }}
                         className='border p-2'
                       >
+                        <option value='' disabled hidden>
+                          Status
+                        </option>
                         <option value={0}>All</option>
                         <option value={1}>Jatuh Tempo</option>
                         <option value={2}>Belum Jatuh Tempo</option>
-- 
cgit v1.2.3

