From 596e2d00957b3e7dfed61dfbebad7ed3eb66cee9 Mon Sep 17 00:00:00 2001 From: randy-ar Date: Tue, 20 Jan 2026 15:22:35 +0700 Subject: [PATCH] fix(FE): change nominal to absolute value, change form state initial balance, and changes filter options --- .../pages/finance/FinanceDetail.tsx | 2 +- src/components/pages/finance/FinanceTable.tsx | 152 +++++++++--------- .../FormFinanceAddInitialBalance.tsx | 7 +- src/config/constant.ts | 8 + 4 files changed, 94 insertions(+), 75 deletions(-) diff --git a/src/components/pages/finance/FinanceDetail.tsx b/src/components/pages/finance/FinanceDetail.tsx index 76d2d1a0..3ee9a7df 100644 --- a/src/components/pages/finance/FinanceDetail.tsx +++ b/src/components/pages/finance/FinanceDetail.tsx @@ -64,7 +64,7 @@ const FinanceDetail = ({ finance }: { finance: Finance }) => { }, { label: 'Nominal', - value: formatCurrency(finance.nominal), + value: formatCurrency(Math.abs(finance.nominal)), }, ].filter((item) => { // Hide party account number row if transaction type is INJECTION diff --git a/src/components/pages/finance/FinanceTable.tsx b/src/components/pages/finance/FinanceTable.tsx index ff62b9db..686a6d4e 100644 --- a/src/components/pages/finance/FinanceTable.tsx +++ b/src/components/pages/finance/FinanceTable.tsx @@ -19,6 +19,7 @@ import { FINANCE_INITIAL_BALANCE_STATUS, FINANCE_INJECTION_STATUS, FINANCE_TRANSACTION_STATUS, + FINANCE_TRANSACTION_TYPE_OPTIONS, } from '@/config/constant'; import { FinanceApi } from '@/services/api/finance'; import { isResponseSuccess } from '@/lib/api-helper'; @@ -65,24 +66,19 @@ const RowOptionsMenu = ({ {FINANCE_TRANSACTION_STATUS.includes( props.row.original.transaction_type - ) && - props.row.original.party?.type !== 'SUPPLIER' && ( - - - - )} + ) && ( + + + + )} {FINANCE_INITIAL_BALANCE_STATUS.includes( props.row.original.transaction_type @@ -148,7 +144,8 @@ const FinanceTable = () => { search: '', transactionType: '', bankId: '', - partyType: '', + customerId: '', + supplierId: '', sortBy: '', startDate: '', endDate: '', @@ -158,7 +155,8 @@ const FinanceTable = () => { pageSize: 'limit', transactionType: 'transaction_type', bankId: 'bank_id', - partyType: 'party_type', + customerId: 'customer_id', + supplierId: 'supplier_id', sortBy: 'sort_date', startDate: 'start_date', endDate: 'end_date', @@ -172,7 +170,8 @@ const FinanceTable = () => { search: '', transactionType: '', bankId: '', - partyType: '', + customerId: '', + supplierId: '', sortBy: '', startDate: '', endDate: '', @@ -180,9 +179,10 @@ const FinanceTable = () => { const [selectedTransactionType, setSelectedTransactionType] = useState(null); const [selectedBank, setSelectedBank] = useState(null); - const [selectedPartyType, setSelectedPartyType] = useState( - null - ); + const [selectedCustomerId, setSelectedCustomerId] = + useState(null); + const [selectedSupplierId, setSelectedSupplierId] = + useState(null); const [selectedSortBy, setSelectedSortBy] = useState(null); const [selectedFinance, setSelectedFinance] = useState(null); const [isDeleteLoading, setIsDeleteLoading] = useState(false); @@ -197,27 +197,18 @@ const FinanceTable = () => { FinanceApi.getAllFetcher ); - // ===== Options ===== - const transactionTypeOptions = useMemo(() => { - return [ - { label: 'Customer', value: 'CUSTOMER' }, - { label: 'Supplier', value: 'SUPPLIER' }, - ]; - }, []); const { - options: partyTypeOptions, - isLoadingOptions: partyTypeIsLoadingOptions, - setInputValue: partyTypeInputValue, - loadMore: partyTypeLoadMore, - } = useSelect( - selectedTransactionType - ? selectedTransactionType.value === 'CUSTOMER' - ? CustomerApi.basePath - : SupplierApi.basePath - : '', - 'id', - 'name' - ); + options: customerOptions, + isLoadingOptions: customerIsLoadingOptions, + setInputValue: customerInputValue, + loadMore: customerLoadMore, + } = useSelect(CustomerApi.basePath, 'id', 'name'); + const { + options: supplierOptions, + isLoadingOptions: supplierIsLoadingOptions, + setInputValue: supplierInputValue, + loadMore: supplierLoadMore, + } = useSelect(SupplierApi.basePath, 'id', 'name'); const sortByOptions = useMemo(() => { return [ { label: 'Tanggal Pembayaran', value: 'payment_date' }, @@ -251,11 +242,18 @@ const FinanceTable = () => { bankId: val ? ((val as OptionType).value as string) : '', })); }; - const partyTypeChangeHandler = (val: OptionType | OptionType[] | null) => { - setSelectedPartyType(val as OptionType); + const customerIdChangeHandler = (val: OptionType | OptionType[] | null) => { + setSelectedCustomerId(val as OptionType); setPendingFilters((prev) => ({ ...prev, - partyType: val ? ((val as OptionType).value as string) : '', + customerId: val ? ((val as OptionType).value as string) : '', + })); + }; + const supplierIdChangeHandler = (val: OptionType | OptionType[] | null) => { + setSelectedSupplierId(val as OptionType); + setPendingFilters((prev) => ({ + ...prev, + supplierId: val ? ((val as OptionType).value as string) : '', })); }; const sortByChangeHandler = (val: OptionType | OptionType[] | null) => { @@ -279,7 +277,8 @@ const FinanceTable = () => { updateFilter('search', pendingFilters.search); updateFilter('transactionType', pendingFilters.transactionType); updateFilter('bankId', pendingFilters.bankId); - updateFilter('partyType', pendingFilters.partyType); + updateFilter('customerId', pendingFilters.customerId); + updateFilter('supplierId', pendingFilters.supplierId); updateFilter('sortBy', pendingFilters.sortBy); updateFilter('startDate', pendingFilters.startDate); updateFilter('endDate', pendingFilters.endDate); @@ -287,14 +286,16 @@ const FinanceTable = () => { const resetFilterHandler = () => { setSelectedTransactionType(null); setSelectedBank(null); - setSelectedPartyType(null); + setSelectedCustomerId(null); + setSelectedSupplierId(null); setSelectedSortBy(null); const emptyFilters = { search: '', transactionType: '', bankId: '', - partyType: '', + customerId: '', + supplierId: '', sortBy: '', startDate: '', endDate: '', @@ -304,7 +305,8 @@ const FinanceTable = () => { updateFilter('search', ''); updateFilter('transactionType', ''); updateFilter('bankId', ''); - updateFilter('partyType', ''); + updateFilter('customerId', ''); + updateFilter('supplierId', ''); updateFilter('sortBy', ''); updateFilter('startDate', ''); updateFilter('endDate', ''); @@ -477,26 +479,30 @@ const FinanceTable = () => { >
+ { onMenuScrollToBottom={bankLoadMore} isClearable /> - { value={pendingFilters.endDate} onChange={endDateChangeHandler} /> +
diff --git a/src/components/pages/finance/add/initial-balance/FormFinanceAddInitialBalance.tsx b/src/components/pages/finance/add/initial-balance/FormFinanceAddInitialBalance.tsx index e1a31415..cb46c0e1 100644 --- a/src/components/pages/finance/add/initial-balance/FormFinanceAddInitialBalance.tsx +++ b/src/components/pages/finance/add/initial-balance/FormFinanceAddInitialBalance.tsx @@ -245,7 +245,11 @@ const FormFinanceAddInitialBalance = ({ } required isClearable - isDisabled={!formik.values.party_type_option?.value} + isDisabled={ + !formik.values.party_type_option?.value || + (type === 'edit' && + formik.values.party_type_option?.value == 'SUPPLIER') + } />