mirror of
https://gitlab.com/mbugroup/lti-web-client.git
synced 2026-05-20 13:32:00 +00:00
feat(FE-337): slicing ui form finance and API integration
This commit is contained in:
randy-ar
@@ -1,5 +1,7 @@
|
||||
const FinanceAddInitialBalance = () => {
|
||||
return <div>Initial Balance</div>;
|
||||
import FormFinanceAddInitialBalance from '@/components/pages/finance/add/initial-balance/FormFinanceAddInitialBalance';
|
||||
|
||||
const FinanceAddInitialBalancePage = () => {
|
||||
return <FormFinanceAddInitialBalance type='add' />;
|
||||
};
|
||||
|
||||
export default FinanceAddInitialBalance;
|
||||
export default FinanceAddInitialBalancePage;
|
||||
|
||||
@@ -0,0 +1,7 @@
|
||||
import FormFinanceInjection from '@/components/pages/finance/add/injection/FormFinanceInjection';
|
||||
|
||||
const FinanceAddInjectionPage = () => {
|
||||
return <FormFinanceInjection type='add' />;
|
||||
};
|
||||
|
||||
export default FinanceAddInjectionPage;
|
||||
@@ -0,0 +1,51 @@
|
||||
'use client';
|
||||
|
||||
import { useRouter, useSearchParams } from 'next/navigation';
|
||||
import useSWR from 'swr';
|
||||
import { FinanceApi } from '@/services/api/finance';
|
||||
import { isResponseError, isResponseSuccess } from '@/lib/api-helper';
|
||||
import FormFinanceAddInitialBalance from '@/components/pages/finance/add/initial-balance/FormFinanceAddInitialBalance';
|
||||
|
||||
const EditFinanceInitialBalancePage = () => {
|
||||
const router = useRouter();
|
||||
const searchParams = useSearchParams();
|
||||
|
||||
const financeId = searchParams.get('financeId');
|
||||
|
||||
const { data: finance, isLoading: isLoadingFinance } = useSWR(
|
||||
financeId,
|
||||
(id: number) => FinanceApi.getSingle(id)
|
||||
);
|
||||
|
||||
if (!financeId) {
|
||||
router.back();
|
||||
|
||||
return (
|
||||
<div className='w-full flex flex-row justify-center items-center p-4'>
|
||||
<span className='loading loading-spinner loading-xl' />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
if (!isLoadingFinance && (!finance || isResponseError(finance))) {
|
||||
router.replace('/404');
|
||||
return;
|
||||
}
|
||||
|
||||
return (
|
||||
<div className='w-full p-4 flex flex-row justify-center'>
|
||||
{isLoadingFinance && (
|
||||
<span className='loading loading-spinner loading-xl' />
|
||||
)}
|
||||
|
||||
{!isLoadingFinance && (
|
||||
<FormFinanceAddInitialBalance
|
||||
type='edit'
|
||||
initialValues={isResponseSuccess(finance) ? finance.data : undefined}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default EditFinanceInitialBalancePage;
|
||||
@@ -0,0 +1,51 @@
|
||||
'use client';
|
||||
|
||||
import { useRouter, useSearchParams } from 'next/navigation';
|
||||
import useSWR from 'swr';
|
||||
import { FinanceApi } from '@/services/api/finance';
|
||||
import { isResponseError, isResponseSuccess } from '@/lib/api-helper';
|
||||
import FormFinanceInjection from '@/components/pages/finance/add/injection/FormFinanceInjection';
|
||||
|
||||
const EditFinanceInjectionPage = () => {
|
||||
const router = useRouter();
|
||||
const searchParams = useSearchParams();
|
||||
|
||||
const financeId = searchParams.get('financeId');
|
||||
|
||||
const { data: finance, isLoading: isLoadingFinance } = useSWR(
|
||||
financeId,
|
||||
(id: number) => FinanceApi.getSingle(id)
|
||||
);
|
||||
|
||||
if (!financeId) {
|
||||
router.back();
|
||||
|
||||
return (
|
||||
<div className='w-full flex flex-row justify-center items-center p-4'>
|
||||
<span className='loading loading-spinner loading-xl' />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
if (!isLoadingFinance && (!finance || isResponseError(finance))) {
|
||||
router.replace('/404');
|
||||
return;
|
||||
}
|
||||
|
||||
return (
|
||||
<div className='w-full p-4 flex flex-row justify-center'>
|
||||
{isLoadingFinance && (
|
||||
<span className='loading loading-spinner loading-xl' />
|
||||
)}
|
||||
|
||||
{!isLoadingFinance && (
|
||||
<FormFinanceInjection
|
||||
type='edit'
|
||||
initialValues={isResponseSuccess(finance) ? finance.data : undefined}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default EditFinanceInjectionPage;
|
||||
@@ -0,0 +1,52 @@
|
||||
'use client';
|
||||
|
||||
import { useRouter, useSearchParams } from 'next/navigation';
|
||||
import useSWR from 'swr';
|
||||
import { FinanceApi } from '@/services/api/finance';
|
||||
import { isResponseError, isResponseSuccess } from '@/lib/api-helper';
|
||||
import FormFinanceAdd from '@/components/pages/finance/add/FormFinanceAdd';
|
||||
import FormFinanceAddInitialBalance from '@/components/pages/finance/add/initial-balance/FormFinanceAddInitialBalance';
|
||||
|
||||
const EditFinanceTransactionPage = () => {
|
||||
const router = useRouter();
|
||||
const searchParams = useSearchParams();
|
||||
|
||||
const financeId = searchParams.get('financeId');
|
||||
|
||||
const { data: finance, isLoading: isLoadingFinance } = useSWR(
|
||||
financeId,
|
||||
(id: number) => FinanceApi.getSingle(id)
|
||||
);
|
||||
|
||||
if (!financeId) {
|
||||
router.back();
|
||||
|
||||
return (
|
||||
<div className='w-full flex flex-row justify-center items-center p-4'>
|
||||
<span className='loading loading-spinner loading-xl' />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
if (!isLoadingFinance && (!finance || isResponseError(finance))) {
|
||||
router.replace('/404');
|
||||
return;
|
||||
}
|
||||
|
||||
return (
|
||||
<div className='w-full p-4 flex flex-row justify-center'>
|
||||
{isLoadingFinance && (
|
||||
<span className='loading loading-spinner loading-xl' />
|
||||
)}
|
||||
|
||||
{!isLoadingFinance && (
|
||||
<FormFinanceAdd
|
||||
type='edit'
|
||||
initialValues={isResponseSuccess(finance) ? finance.data : undefined}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default EditFinanceTransactionPage;
|
||||
@@ -1,11 +1,27 @@
|
||||
import Button from '@/components/Button';
|
||||
import Card from '@/components/Card';
|
||||
import { FormHeader } from '@/components/helper/form/FormHeader';
|
||||
import RequirePermission from '@/components/helper/RequirePermission';
|
||||
import DebouncedTextInput from '@/components/input/DebouncedTextInput';
|
||||
import { useModal } from '@/components/Modal';
|
||||
import ConfirmationModal from '@/components/modal/ConfirmationModal';
|
||||
import Table from '@/components/Table';
|
||||
import { formatCurrency, formatTitleCase } from '@/lib/helper';
|
||||
import {
|
||||
FINANCE_INITIAL_BALANCE_STATUS,
|
||||
FINANCE_TRANSACTION_STATUS,
|
||||
} from '@/config/constant';
|
||||
import { formatCurrency, formatDate, formatTitleCase } from '@/lib/helper';
|
||||
import { FinanceApi } from '@/services/api/finance';
|
||||
import { Finance } from '@/types/api/finance/finance';
|
||||
import { Icon } from '@iconify/react';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import { useState } from 'react';
|
||||
import toast from 'react-hot-toast';
|
||||
|
||||
const FinanceDetail = ({ finance }: { finance: Finance }) => {
|
||||
const router = useRouter();
|
||||
const deleteModal = useModal();
|
||||
const [isDeleteLoading, setIsDeleteLoading] = useState(false);
|
||||
const informasiUmum = [
|
||||
{
|
||||
label: 'ID',
|
||||
@@ -21,7 +37,7 @@ const FinanceDetail = ({ finance }: { finance: Finance }) => {
|
||||
},
|
||||
{
|
||||
label: 'Tanggal',
|
||||
value: finance.payment_date,
|
||||
value: formatDate(finance.payment_date, 'DD MMM yyyy'),
|
||||
},
|
||||
{
|
||||
label: 'Metode Pembayaran',
|
||||
@@ -54,6 +70,18 @@ const FinanceDetail = ({ finance }: { finance: Finance }) => {
|
||||
value: formatCurrency(finance.income_amount),
|
||||
},
|
||||
];
|
||||
|
||||
const confirmationModalDeleteClickHandler = async () => {
|
||||
setIsDeleteLoading(true);
|
||||
|
||||
await FinanceApi.delete(finance.id as number);
|
||||
router.back();
|
||||
|
||||
deleteModal.closeModal();
|
||||
toast.success('Successfully delete Finance!');
|
||||
setIsDeleteLoading(false);
|
||||
};
|
||||
|
||||
return (
|
||||
<div className='flex flex-col gap-6 p-6'>
|
||||
<FormHeader title='' backUrl='/finance' />
|
||||
@@ -108,6 +136,57 @@ const FinanceDetail = ({ finance }: { finance: Finance }) => {
|
||||
/>
|
||||
</div>
|
||||
</Card>
|
||||
|
||||
<div className='flex flex-row gap-2 justify-end'>
|
||||
{FINANCE_TRANSACTION_STATUS.includes(finance.transaction_type) && (
|
||||
<RequirePermission permissions='lti.finance.payments.update'>
|
||||
<Button
|
||||
color='warning'
|
||||
className='min-w-24'
|
||||
href={`/finance/detail/edit?financeId=${finance.id}`}
|
||||
>
|
||||
<Icon icon='mdi:pencil-outline' />
|
||||
Edit
|
||||
</Button>
|
||||
</RequirePermission>
|
||||
)}
|
||||
{FINANCE_INITIAL_BALANCE_STATUS.includes(finance.transaction_type) && (
|
||||
<RequirePermission permissions='lti.finance.initial_balances.update'>
|
||||
<Button
|
||||
color='warning'
|
||||
className='min-w-24'
|
||||
href={`/finance/detail/edit/initial-balance?financeId=${finance.id}`}
|
||||
>
|
||||
<Icon icon='mdi:pencil-outline' />
|
||||
Edit
|
||||
</Button>
|
||||
</RequirePermission>
|
||||
)}
|
||||
<RequirePermission permissions='lti.finance.transaction.delete'>
|
||||
<Button
|
||||
color='error'
|
||||
className='min-w-24'
|
||||
onClick={() => deleteModal.openModal()}
|
||||
>
|
||||
<Icon icon='mdi:delete-outline' />
|
||||
Delete
|
||||
</Button>
|
||||
</RequirePermission>
|
||||
</div>
|
||||
<ConfirmationModal
|
||||
ref={deleteModal.ref}
|
||||
type='error'
|
||||
text={`Apakah anda yakin ingin menghapus data Finance ini (${finance?.payment_code})?`}
|
||||
secondaryButton={{
|
||||
text: 'Tidak',
|
||||
}}
|
||||
primaryButton={{
|
||||
text: 'Ya',
|
||||
color: 'error',
|
||||
isLoading: isDeleteLoading,
|
||||
onClick: confirmationModalDeleteClickHandler,
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import { ChangeEventHandler, useMemo, useState } from 'react';
|
||||
import { Row } from '@tanstack/react-table';
|
||||
import { CellContext, Row } from '@tanstack/react-table';
|
||||
import { useSearchParams } from 'next/navigation';
|
||||
import useSWR from 'swr';
|
||||
|
||||
@@ -16,14 +16,118 @@ import Menu from '@/components/menu/Menu';
|
||||
import MenuItem from '@/components/menu/MenuItem';
|
||||
import Table from '@/components/Table';
|
||||
import Tooltip from '@/components/Tooltip';
|
||||
import { formatCurrency, formatDate } from '@/lib/helper';
|
||||
import { formatCurrency, formatDate, formatTitleCase } from '@/lib/helper';
|
||||
import { useTableFilter } from '@/services/hooks/useTableFilter';
|
||||
import { Finance } from '@/types/api/finance/finance';
|
||||
import { ROWS_OPTIONS } from '@/config/constant';
|
||||
import {
|
||||
FINANCE_INITIAL_BALANCE_STATUS,
|
||||
FINANCE_INJECTION_STATUS,
|
||||
FINANCE_TRANSACTION_STATUS,
|
||||
ROWS_OPTIONS,
|
||||
} from '@/config/constant';
|
||||
import { FinanceApi } from '@/services/api/finance';
|
||||
import { isResponseSuccess } from '@/lib/api-helper';
|
||||
import { BankApi, CustomerApi, SupplierApi } from '@/services/api/master-data';
|
||||
import { Bank } from '@/types/api/master-data/bank';
|
||||
import { useModal } from '@/components/Modal';
|
||||
import ConfirmationModal from '@/components/modal/ConfirmationModal';
|
||||
import toast from 'react-hot-toast';
|
||||
import RowOptionsMenuWrapper from '@/components/table/RowOptionsMenuWrapper';
|
||||
import RequirePermission from '@/components/helper/RequirePermission';
|
||||
import { Icon } from '@iconify/react';
|
||||
import RowDropdownOptions from '@/components/table/RowDropdownOptions';
|
||||
import RowCollapseOptions from '@/components/table/RowCollapseOptions';
|
||||
|
||||
const RowOptionsMenu = ({
|
||||
type = 'dropdown',
|
||||
props,
|
||||
deleteClickHandler,
|
||||
}: {
|
||||
type: 'dropdown' | 'collapse';
|
||||
props: CellContext<Finance, unknown>;
|
||||
deleteClickHandler: () => void;
|
||||
}) => {
|
||||
return (
|
||||
<RowOptionsMenuWrapper type={type}>
|
||||
<RequirePermission permissions='lti.finance.transaction.detail'>
|
||||
<Button
|
||||
href={`/finance/detail?financeId=${props.row.original.id}`}
|
||||
variant='ghost'
|
||||
color='primary'
|
||||
className='justify-start text-sm'
|
||||
>
|
||||
<Icon icon='mdi:eye-outline' width={16} height={16} />
|
||||
Detail
|
||||
</Button>
|
||||
</RequirePermission>
|
||||
|
||||
{FINANCE_TRANSACTION_STATUS.includes(
|
||||
props.row.original.transaction_type
|
||||
) && (
|
||||
<RequirePermission permissions='lti.finance.payments.update'>
|
||||
<Button
|
||||
href={`/finance/detail/edit?financeId=${props.row.original.id}`}
|
||||
variant='ghost'
|
||||
color='warning'
|
||||
className='justify-start text-sm'
|
||||
>
|
||||
<Icon icon='material-symbols:edit-outline' width={16} height={16} />
|
||||
Edit
|
||||
</Button>
|
||||
</RequirePermission>
|
||||
)}
|
||||
|
||||
{FINANCE_INITIAL_BALANCE_STATUS.includes(
|
||||
props.row.original.transaction_type
|
||||
) && (
|
||||
<RequirePermission permissions='lti.finance.initial_balances.update'>
|
||||
<Button
|
||||
href={`/finance/detail/edit/initial-balance?financeId=${props.row.original.id}`}
|
||||
variant='ghost'
|
||||
color='warning'
|
||||
className='justify-start text-sm'
|
||||
>
|
||||
<Icon icon='material-symbols:edit-outline' width={16} height={16} />
|
||||
Edit
|
||||
</Button>
|
||||
</RequirePermission>
|
||||
)}
|
||||
|
||||
{FINANCE_INJECTION_STATUS.includes(
|
||||
props.row.original.transaction_type
|
||||
) && (
|
||||
<RequirePermission permissions='lti.finance.injections.update'>
|
||||
<Button
|
||||
href={`/finance/detail/edit/injection?financeId=${props.row.original.id}`}
|
||||
variant='ghost'
|
||||
color='warning'
|
||||
className='justify-start text-sm'
|
||||
>
|
||||
<Icon icon='material-symbols:edit-outline' width={16} height={16} />
|
||||
Edit
|
||||
</Button>
|
||||
</RequirePermission>
|
||||
)}
|
||||
|
||||
<RequirePermission permissions='lti.finance.transaction.delete'>
|
||||
<Button
|
||||
onClick={deleteClickHandler}
|
||||
variant='ghost'
|
||||
color='error'
|
||||
className='text-error hover:text-inherit'
|
||||
>
|
||||
<Icon
|
||||
icon='material-symbols:delete-outline-rounded'
|
||||
width={16}
|
||||
height={16}
|
||||
className='justify-start text-sm'
|
||||
/>
|
||||
Delete
|
||||
</Button>
|
||||
</RequirePermission>
|
||||
</RowOptionsMenuWrapper>
|
||||
);
|
||||
};
|
||||
|
||||
const FinanceTable = () => {
|
||||
const {
|
||||
@@ -56,6 +160,7 @@ const FinanceTable = () => {
|
||||
|
||||
// ===== State =====
|
||||
const [searchParams, setSearchParams] = useSearchParams();
|
||||
const deleteModal = useModal();
|
||||
const [pendingFilters, setPendingFilters] = useState({
|
||||
search: '',
|
||||
transactionType: '',
|
||||
@@ -72,6 +177,8 @@ const FinanceTable = () => {
|
||||
null
|
||||
);
|
||||
const [selectedSortBy, setSelectedSortBy] = useState<OptionType | null>(null);
|
||||
const [selectedFinance, setSelectedFinance] = useState<Finance | null>(null);
|
||||
const [isDeleteLoading, setIsDeleteLoading] = useState(false);
|
||||
|
||||
// ===== Fetch Data =====
|
||||
const {
|
||||
@@ -79,7 +186,7 @@ const FinanceTable = () => {
|
||||
isLoading,
|
||||
mutate: refreshFinances,
|
||||
} = useSWR(
|
||||
`${FinanceApi.basePath}${getTableFilterQueryString()}`,
|
||||
`${FinanceApi.basePath}/transactions${getTableFilterQueryString()}`,
|
||||
FinanceApi.getAllFetcher
|
||||
);
|
||||
|
||||
@@ -193,6 +300,16 @@ const FinanceTable = () => {
|
||||
updateFilter('startDate', '');
|
||||
updateFilter('endDate', '');
|
||||
};
|
||||
const confirmationModalDeleteClickHandler = async () => {
|
||||
setIsDeleteLoading(true);
|
||||
|
||||
await FinanceApi.delete(selectedFinance?.id as number);
|
||||
refreshFinances();
|
||||
|
||||
deleteModal.closeModal();
|
||||
toast.success('Successfully delete Finance!');
|
||||
setIsDeleteLoading(false);
|
||||
};
|
||||
|
||||
const columns = useMemo(() => {
|
||||
return [
|
||||
@@ -203,14 +320,30 @@ const FinanceTable = () => {
|
||||
{
|
||||
header: 'References Number',
|
||||
accessorKey: 'reference_number',
|
||||
cell: (props: CellContext<Finance, unknown>) => {
|
||||
const value = props.row.original.reference_number;
|
||||
return <span>{value ?? '-'}</span>;
|
||||
},
|
||||
},
|
||||
{
|
||||
header: 'Jenis Transaksi',
|
||||
accessorKey: 'transaction_type',
|
||||
cell: (props: CellContext<Finance, unknown>) => {
|
||||
const value = props.row.original.transaction_type
|
||||
.split('_')
|
||||
.join(' ');
|
||||
return <span>{formatTitleCase(value)}</span>;
|
||||
},
|
||||
},
|
||||
{
|
||||
header: 'Pihak',
|
||||
accessorFn: (finance: Finance) => finance.party.name,
|
||||
cell: (props: CellContext<Finance, unknown>) => {
|
||||
if (props.row.original.party.id) {
|
||||
return <span>{props.row.original.party.name}</span>;
|
||||
}
|
||||
return <span>{'-'}</span>;
|
||||
},
|
||||
},
|
||||
{
|
||||
header: 'Tanggal',
|
||||
@@ -220,6 +353,10 @@ const FinanceTable = () => {
|
||||
{
|
||||
header: 'Metode Pembayaran',
|
||||
accessorKey: 'payment_method',
|
||||
cell: (props: CellContext<Finance, unknown>) => {
|
||||
const value = props.row.original.payment_method.split('_').join(' ');
|
||||
return <span>{formatTitleCase(value)}</span>;
|
||||
},
|
||||
},
|
||||
{
|
||||
header: 'Bank',
|
||||
@@ -237,36 +374,73 @@ const FinanceTable = () => {
|
||||
},
|
||||
{
|
||||
header: 'Aksi',
|
||||
cell: ({ row }: { row: Row<Finance> }) => (
|
||||
<Dropdown
|
||||
trigger={<Button variant='ghost'>...</Button>}
|
||||
direction='bottom'
|
||||
align='end'
|
||||
>
|
||||
<Menu>
|
||||
<MenuItem
|
||||
title='Detail'
|
||||
href={`/finance/detail?financeId=${row.original.id}`}
|
||||
className='hover:bg-primary hover:text-primary-content'
|
||||
cell: (props: CellContext<Finance, unknown>) => {
|
||||
const currentPageSize =
|
||||
props.table.getPaginationRowModel().rows.length;
|
||||
const currentPageRows = props.table.getPaginationRowModel().flatRows;
|
||||
const currentRowRelativeIndex =
|
||||
currentPageRows.findIndex((r) => r.id === props.row.id) + 1;
|
||||
|
||||
const isLast2Rows = currentRowRelativeIndex > currentPageSize - 2;
|
||||
|
||||
const deleteClickHandler = () => {
|
||||
setSelectedFinance(props.row.original);
|
||||
deleteModal.openModal();
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
{currentPageSize > 2 && (
|
||||
<RowDropdownOptions isLast2Rows={isLast2Rows}>
|
||||
<RowOptionsMenu
|
||||
type='dropdown'
|
||||
props={props}
|
||||
deleteClickHandler={deleteClickHandler}
|
||||
/>
|
||||
</Menu>
|
||||
</Dropdown>
|
||||
),
|
||||
</RowDropdownOptions>
|
||||
)}
|
||||
|
||||
{currentPageSize <= 2 && (
|
||||
<RowCollapseOptions>
|
||||
<RowOptionsMenu
|
||||
type='collapse'
|
||||
props={props}
|
||||
deleteClickHandler={deleteClickHandler}
|
||||
/>
|
||||
</RowCollapseOptions>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
},
|
||||
},
|
||||
];
|
||||
}, []);
|
||||
return (
|
||||
<section className='size-full p-6 flex flex-col gap-6'>
|
||||
<div className='flex justify-end gap-2'>
|
||||
<Button color='warning' className='min-w-24'>
|
||||
<RequirePermission permissions='lti.finance.injections.create'>
|
||||
<Button
|
||||
color='warning'
|
||||
className='min-w-24'
|
||||
href='/finance/add/injection'
|
||||
>
|
||||
Injection Saldo Bank
|
||||
</Button>
|
||||
<Button color='info' className='text-white min-w-24'>
|
||||
</RequirePermission>
|
||||
<RequirePermission permissions='lti.finance.initial_balances.create'>
|
||||
<Button
|
||||
color='info'
|
||||
className='text-white min-w-24'
|
||||
href='/finance/add/initial-balance'
|
||||
>
|
||||
Saldo Awal
|
||||
</Button>
|
||||
</RequirePermission>
|
||||
<RequirePermission permissions='lti.finance.payments.create'>
|
||||
<Button color='primary' className='min-w-24' href='/finance/add'>
|
||||
Tambah
|
||||
</Button>
|
||||
</RequirePermission>
|
||||
</div>
|
||||
<Card
|
||||
variant='bordered'
|
||||
@@ -363,8 +537,26 @@ const FinanceTable = () => {
|
||||
pageSize={tableFilterState.pageSize}
|
||||
page={tableFilterState.page}
|
||||
onPageChange={setPage}
|
||||
onPageSizeChange={setPageSize}
|
||||
totalItems={
|
||||
isResponseSuccess(finances) ? finances.meta?.total_results : 0
|
||||
}
|
||||
isLoading={isLoading}
|
||||
/>
|
||||
<ConfirmationModal
|
||||
ref={deleteModal.ref}
|
||||
type='error'
|
||||
text={`Apakah anda yakin ingin menghapus data Finance ini (${selectedFinance?.payment_code})?`}
|
||||
secondaryButton={{
|
||||
text: 'Tidak',
|
||||
}}
|
||||
primaryButton={{
|
||||
text: 'Ya',
|
||||
color: 'error',
|
||||
isLoading: isDeleteLoading,
|
||||
onClick: confirmationModalDeleteClickHandler,
|
||||
}}
|
||||
/>
|
||||
</section>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -15,18 +15,6 @@ import { OptionType } from '@/components/input/SelectInput';
|
||||
}
|
||||
*/
|
||||
|
||||
// Type for API payload (what gets sent to the server)
|
||||
export type FinancePayload = {
|
||||
party_id: number;
|
||||
party_type: string;
|
||||
payment_date: string;
|
||||
payment_method: string;
|
||||
bank_id: number;
|
||||
reference_number: string;
|
||||
nominal: number;
|
||||
notes: string;
|
||||
};
|
||||
|
||||
// Type for form values (includes option objects for SelectInput)
|
||||
export type FinanceFormValues = {
|
||||
party_type_option: OptionType | null;
|
||||
@@ -41,32 +29,36 @@ export type FinanceFormValues = {
|
||||
};
|
||||
|
||||
export const FinanceFormSchema = Yup.object().shape({
|
||||
party_type_option: Yup.object({
|
||||
label: Yup.string().required('Wajib Diisi'),
|
||||
value: Yup.string().required('Wajib Diisi'),
|
||||
})
|
||||
party_type_option: Yup.mixed()
|
||||
.nullable()
|
||||
.required('Jenis transaksi wajib diisi'),
|
||||
party_id_option: Yup.object({
|
||||
label: Yup.string().required('Wajib Diisi'),
|
||||
value: Yup.number().required('Wajib Diisi'),
|
||||
})
|
||||
.test(
|
||||
'is-valid-option',
|
||||
'Jenis transaksi wajib diisi',
|
||||
(value) => value !== null && value !== undefined
|
||||
),
|
||||
party_id_option: Yup.mixed()
|
||||
.nullable()
|
||||
.required('Pihak wajib diisi'),
|
||||
.test(
|
||||
'is-valid-option',
|
||||
'Pihak wajib diisi',
|
||||
(value) => value !== null && value !== undefined
|
||||
),
|
||||
party_account_number: Yup.string().required('Nomor rekening wajib diisi'),
|
||||
payment_date: Yup.string().required('Tanggal pembayaran wajib diisi'),
|
||||
payment_method_option: Yup.object({
|
||||
label: Yup.string().required('Wajib Diisi'),
|
||||
value: Yup.string().required('Wajib Diisi'),
|
||||
})
|
||||
payment_method_option: Yup.mixed()
|
||||
.nullable()
|
||||
.required('Metode pembayaran wajib diisi'),
|
||||
bank_id_option: Yup.object({
|
||||
label: Yup.string().required('Wajib Diisi'),
|
||||
value: Yup.number().required('Wajib Diisi'),
|
||||
})
|
||||
.test(
|
||||
'is-valid-option',
|
||||
'Metode pembayaran wajib diisi',
|
||||
(value) => value !== null && value !== undefined
|
||||
),
|
||||
bank_id_option: Yup.mixed()
|
||||
.nullable()
|
||||
.required('Bank wajib diisi'),
|
||||
.test(
|
||||
'is-valid-option',
|
||||
'Bank wajib diisi',
|
||||
(value) => value !== null && value !== undefined
|
||||
),
|
||||
reference_number: Yup.string().required('Nomor referensi wajib diisi'),
|
||||
nominal: Yup.string().required('Nominal wajib diisi'),
|
||||
notes: Yup.string().required('Catatan wajib diisi'),
|
||||
|
||||
@@ -14,16 +14,20 @@ import TextInput from '@/components/input/TextInput';
|
||||
import {
|
||||
FinanceFormSchema,
|
||||
FinanceFormValues,
|
||||
FinancePayload,
|
||||
} from '@/components/pages/finance/add/FormFinanceAdd.schema';
|
||||
import {
|
||||
FINANCE_PARTY_TYPE_OPTIONS,
|
||||
FINANCE_PAYMENT_METHOD_OPTIONS,
|
||||
} from '@/config/constant';
|
||||
import { isResponseError, isResponseSuccess } from '@/lib/api-helper';
|
||||
import { formatTitleCase } from '@/lib/helper';
|
||||
import { formatDate, formatTitleCase } from '@/lib/helper';
|
||||
import { FinanceApi } from '@/services/api/finance';
|
||||
import { BankApi, CustomerApi, SupplierApi } from '@/services/api/master-data';
|
||||
import {
|
||||
CreateFinancePayment,
|
||||
Finance,
|
||||
UpdateFinancePayment,
|
||||
} from '@/types/api/finance/finance';
|
||||
import { Bank } from '@/types/api/master-data/bank';
|
||||
import { useFormik } from 'formik';
|
||||
import { useRouter } from 'next/navigation';
|
||||
@@ -32,7 +36,7 @@ import toast from 'react-hot-toast';
|
||||
|
||||
interface FormFinanceAddProps {
|
||||
type?: 'add' | 'edit';
|
||||
initialValues?: FinanceFormValues & { id?: number };
|
||||
initialValues?: Finance;
|
||||
}
|
||||
|
||||
const FormFinanceAdd = ({
|
||||
@@ -44,14 +48,28 @@ const FormFinanceAdd = ({
|
||||
// ===== Formik =====
|
||||
const formikInitialValues = useMemo((): FinanceFormValues => {
|
||||
return {
|
||||
party_type_option: initialValues?.party_type_option || null,
|
||||
party_id_option: initialValues?.party_id_option || null,
|
||||
party_type_option:
|
||||
FINANCE_PARTY_TYPE_OPTIONS.find(
|
||||
(option) => option.value === initialValues?.party.type
|
||||
) || null,
|
||||
party_id_option: {
|
||||
label: initialValues?.party.name || '',
|
||||
value: initialValues?.party.id || 0,
|
||||
},
|
||||
payment_date: initialValues?.payment_date || '',
|
||||
payment_method_option: initialValues?.payment_method_option || null,
|
||||
bank_id_option: initialValues?.bank_id_option || null,
|
||||
party_account_number: initialValues?.party_account_number || '',
|
||||
payment_method_option:
|
||||
FINANCE_PAYMENT_METHOD_OPTIONS.find(
|
||||
(option) => option.value === initialValues?.payment_method
|
||||
) || null,
|
||||
bank_id_option: initialValues?.bank
|
||||
? {
|
||||
label: initialValues.bank.name,
|
||||
value: initialValues.bank.id,
|
||||
}
|
||||
: null,
|
||||
party_account_number: initialValues?.party.account_number || '',
|
||||
reference_number: initialValues?.reference_number || '',
|
||||
nominal: initialValues?.nominal || '',
|
||||
nominal: initialValues?.nominal.toString() || '',
|
||||
notes: initialValues?.notes || '',
|
||||
};
|
||||
}, [initialValues]);
|
||||
@@ -59,6 +77,8 @@ const FormFinanceAdd = ({
|
||||
const formik = useFormik<FinanceFormValues>({
|
||||
initialValues: formikInitialValues,
|
||||
validationSchema: FinanceFormSchema,
|
||||
validateOnChange: true,
|
||||
validateOnBlur: true,
|
||||
onSubmit: async (values) => {
|
||||
const payload = transformFormValuesToPayload(values);
|
||||
|
||||
@@ -96,11 +116,11 @@ const FormFinanceAdd = ({
|
||||
// ===== Helper Functions =====
|
||||
const transformFormValuesToPayload = (
|
||||
values: FinanceFormValues
|
||||
): FinancePayload => {
|
||||
): CreateFinancePayment => {
|
||||
return {
|
||||
party_id: Number(values.party_id_option?.value) || 0,
|
||||
party_type: (values.party_type_option?.value as string) || '',
|
||||
payment_date: values.payment_date,
|
||||
payment_date: formatDate(values.payment_date, 'YYYY-MM-DD'),
|
||||
payment_method: (values.payment_method_option?.value as string) || '',
|
||||
bank_id: Number(values.bank_id_option?.value) || 0,
|
||||
reference_number: values.reference_number,
|
||||
@@ -111,7 +131,7 @@ const FormFinanceAdd = ({
|
||||
|
||||
// ===== Handler =====
|
||||
const createFinance = useCallback(
|
||||
async (payload: FinancePayload) => {
|
||||
async (payload: CreateFinancePayment) => {
|
||||
const response = await FinanceApi.create(payload);
|
||||
|
||||
if (isResponseError(response)) {
|
||||
@@ -126,7 +146,7 @@ const FormFinanceAdd = ({
|
||||
[router]
|
||||
);
|
||||
const updateFinance = useCallback(
|
||||
async (financeId: number, payload: FinancePayload) => {
|
||||
async (financeId: number, payload: UpdateFinancePayment) => {
|
||||
const response = await FinanceApi.update(financeId, payload);
|
||||
|
||||
if (isResponseError(response)) {
|
||||
@@ -145,7 +165,10 @@ const FormFinanceAdd = ({
|
||||
<>
|
||||
<section className='w-full max-w-xl mx-auto'>
|
||||
<div className='flex flex-col gap-6 p-6'>
|
||||
<FormHeader title='Tambah Data Keuangan' />
|
||||
<FormHeader
|
||||
title={`${type === 'add' ? 'Tambah' : 'Ubah'} Data Keuangan`}
|
||||
backUrl='/finance'
|
||||
/>
|
||||
<form className='flex flex-col gap-4' onSubmit={formik.handleSubmit}>
|
||||
<SelectInput
|
||||
label='Jenis Transaksi'
|
||||
@@ -154,18 +177,15 @@ const FormFinanceAdd = ({
|
||||
value={formik.values.party_type_option}
|
||||
onChange={(value) => {
|
||||
formik.setFieldValue('party_type_option', value);
|
||||
formik.setFieldTouched('party_type_option', true);
|
||||
}}
|
||||
isError={
|
||||
!!(
|
||||
isError={Boolean(
|
||||
formik.touched.party_type_option &&
|
||||
formik.errors.party_type_option
|
||||
)
|
||||
}
|
||||
)}
|
||||
errorMessage={
|
||||
formik.touched.party_type_option &&
|
||||
formik.errors.party_type_option
|
||||
? String(formik.errors.party_type_option)
|
||||
? formik.errors.party_type_option
|
||||
: ''
|
||||
}
|
||||
required
|
||||
@@ -184,18 +204,14 @@ const FormFinanceAdd = ({
|
||||
value={formik.values.party_id_option}
|
||||
onChange={(value) => {
|
||||
formik.setFieldValue('party_id_option', value);
|
||||
formik.setFieldTouched('party_id_option', true);
|
||||
}}
|
||||
isLoading={isLoadingPartyOptions}
|
||||
isError={
|
||||
!!(
|
||||
formik.touched.party_id_option &&
|
||||
formik.errors.party_id_option
|
||||
)
|
||||
}
|
||||
isError={Boolean(
|
||||
formik.touched.party_id_option && formik.errors.party_id_option
|
||||
)}
|
||||
errorMessage={
|
||||
formik.touched.party_id_option && formik.errors.party_id_option
|
||||
? String(formik.errors.party_id_option)
|
||||
? formik.errors.party_id_option
|
||||
: ''
|
||||
}
|
||||
required
|
||||
@@ -209,9 +225,9 @@ const FormFinanceAdd = ({
|
||||
value={formik.values.payment_date}
|
||||
onChange={formik.handleChange}
|
||||
onBlur={formik.handleBlur}
|
||||
isError={
|
||||
!!(formik.touched.payment_date && formik.errors.payment_date)
|
||||
}
|
||||
isError={Boolean(
|
||||
formik.touched.payment_date && formik.errors.payment_date
|
||||
)}
|
||||
errorMessage={
|
||||
formik.touched.payment_date && formik.errors.payment_date
|
||||
? formik.errors.payment_date
|
||||
@@ -226,18 +242,15 @@ const FormFinanceAdd = ({
|
||||
value={formik.values.payment_method_option}
|
||||
onChange={(value) => {
|
||||
formik.setFieldValue('payment_method_option', value);
|
||||
formik.setFieldTouched('payment_method_option', true);
|
||||
}}
|
||||
isError={
|
||||
!!(
|
||||
isError={Boolean(
|
||||
formik.touched.payment_method_option &&
|
||||
formik.errors.payment_method_option
|
||||
)
|
||||
}
|
||||
)}
|
||||
errorMessage={
|
||||
formik.touched.payment_method_option &&
|
||||
formik.errors.payment_method_option
|
||||
? String(formik.errors.payment_method_option)
|
||||
? formik.errors.payment_method_option
|
||||
: ''
|
||||
}
|
||||
required
|
||||
@@ -268,17 +281,14 @@ const FormFinanceAdd = ({
|
||||
value={formik.values.bank_id_option}
|
||||
onChange={(value) => {
|
||||
formik.setFieldValue('bank_id_option', value);
|
||||
formik.setFieldTouched('bank_id_option', true);
|
||||
}}
|
||||
isLoading={isLoadingBankOptions}
|
||||
isError={
|
||||
!!(
|
||||
isError={Boolean(
|
||||
formik.touched.bank_id_option && formik.errors.bank_id_option
|
||||
)
|
||||
}
|
||||
)}
|
||||
errorMessage={
|
||||
formik.touched.bank_id_option && formik.errors.bank_id_option
|
||||
? String(formik.errors.bank_id_option)
|
||||
? formik.errors.bank_id_option
|
||||
: ''
|
||||
}
|
||||
required
|
||||
@@ -291,12 +301,10 @@ const FormFinanceAdd = ({
|
||||
value={formik.values.party_account_number}
|
||||
onChange={formik.handleChange}
|
||||
onBlur={formik.handleBlur}
|
||||
isError={
|
||||
!!(
|
||||
isError={Boolean(
|
||||
formik.touched.party_account_number &&
|
||||
formik.errors.party_account_number
|
||||
)
|
||||
}
|
||||
)}
|
||||
errorMessage={
|
||||
formik.touched.party_account_number &&
|
||||
formik.errors.party_account_number
|
||||
@@ -312,12 +320,10 @@ const FormFinanceAdd = ({
|
||||
value={formik.values.reference_number}
|
||||
onChange={formik.handleChange}
|
||||
onBlur={formik.handleBlur}
|
||||
isError={
|
||||
!!(
|
||||
isError={Boolean(
|
||||
formik.touched.reference_number &&
|
||||
formik.errors.reference_number
|
||||
)
|
||||
}
|
||||
)}
|
||||
errorMessage={
|
||||
formik.touched.reference_number &&
|
||||
formik.errors.reference_number
|
||||
@@ -333,7 +339,7 @@ const FormFinanceAdd = ({
|
||||
value={formik.values.nominal}
|
||||
onChange={formik.handleChange}
|
||||
onBlur={formik.handleBlur}
|
||||
isError={!!(formik.touched.nominal && formik.errors.nominal)}
|
||||
isError={Boolean(formik.touched.nominal && formik.errors.nominal)}
|
||||
errorMessage={
|
||||
formik.touched.nominal && formik.errors.nominal
|
||||
? formik.errors.nominal
|
||||
@@ -348,12 +354,13 @@ const FormFinanceAdd = ({
|
||||
value={formik.values.notes}
|
||||
onChange={formik.handleChange}
|
||||
onBlur={formik.handleBlur}
|
||||
isError={!!(formik.touched.notes && formik.errors.notes)}
|
||||
isError={Boolean(formik.touched.notes && formik.errors.notes)}
|
||||
errorMessage={
|
||||
formik.touched.notes && formik.errors.notes
|
||||
? formik.errors.notes
|
||||
: ''
|
||||
}
|
||||
required
|
||||
/>
|
||||
<div className='flex justify-center gap-4'>
|
||||
<Button
|
||||
@@ -361,10 +368,15 @@ const FormFinanceAdd = ({
|
||||
color='warning'
|
||||
className='w-min-24'
|
||||
onClick={() => formik.resetForm()}
|
||||
disabled={formik.isSubmitting}
|
||||
>
|
||||
Reset
|
||||
</Button>
|
||||
<Button type='submit' className='w-min-24'>
|
||||
<Button
|
||||
type='submit'
|
||||
className='w-min-24'
|
||||
disabled={formik.isSubmitting || !formik.isValid}
|
||||
>
|
||||
Submit
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
+62
@@ -0,0 +1,62 @@
|
||||
import * as Yup from 'yup';
|
||||
import { OptionType } from '@/components/input/SelectInput';
|
||||
|
||||
/**
|
||||
* API Payload format for Initial Balance:
|
||||
* {
|
||||
"party_type": "CUSTOMER",
|
||||
"party_id": 1,
|
||||
"bank_id": 1,
|
||||
"reference_number": "IB.MBU.001",
|
||||
"initial_balance_type": "DEBIT",
|
||||
"nominal": 5000000,
|
||||
"note": "Saldo awal piutang customer"
|
||||
}
|
||||
*/
|
||||
|
||||
// Type for form values (includes option objects for SelectInput)
|
||||
export type InitialBalanceFormValues = {
|
||||
party_type_option: OptionType | null;
|
||||
party_id_option: OptionType | null;
|
||||
bank_id_option: OptionType | null;
|
||||
reference_number: string;
|
||||
initial_balance_type_option: OptionType | null;
|
||||
nominal: string;
|
||||
note: string;
|
||||
};
|
||||
|
||||
export const InitialBalanceFormSchema = Yup.object().shape({
|
||||
party_type_option: Yup.mixed()
|
||||
.nullable()
|
||||
.test(
|
||||
'is-valid-option',
|
||||
'Jenis pihak wajib diisi',
|
||||
(value) => value !== null && value !== undefined
|
||||
),
|
||||
party_id_option: Yup.mixed()
|
||||
.nullable()
|
||||
.test(
|
||||
'is-valid-option',
|
||||
'Pihak wajib diisi',
|
||||
(value) => value !== null && value !== undefined
|
||||
),
|
||||
bank_id_option: Yup.mixed()
|
||||
.nullable()
|
||||
.test(
|
||||
'is-valid-option',
|
||||
'Bank wajib diisi',
|
||||
(value) => value !== null && value !== undefined
|
||||
),
|
||||
reference_number: Yup.string().required('Nomor referensi wajib diisi'),
|
||||
initial_balance_type_option: Yup.mixed()
|
||||
.nullable()
|
||||
.test(
|
||||
'is-valid-option',
|
||||
'Tipe saldo awal wajib diisi',
|
||||
(value) => value !== null && value !== undefined
|
||||
),
|
||||
nominal: Yup.string().required('Nominal wajib diisi'),
|
||||
note: Yup.string().required('Catatan wajib diisi'),
|
||||
});
|
||||
|
||||
export const UpdateInitialBalanceFormSchema = InitialBalanceFormSchema;
|
||||
|
||||
@@ -0,0 +1,378 @@
|
||||
'use client';
|
||||
|
||||
import Button from '@/components/Button';
|
||||
import { FormHeader } from '@/components/helper/form/FormHeader';
|
||||
import NumberInput from '@/components/input/NumberInput';
|
||||
import SelectInput, {
|
||||
OptionType,
|
||||
useSelect,
|
||||
} from '@/components/input/SelectInput';
|
||||
import TextArea from '@/components/input/TextArea';
|
||||
import TextInput from '@/components/input/TextInput';
|
||||
import {
|
||||
InitialBalanceFormSchema,
|
||||
InitialBalanceFormValues,
|
||||
} from '@/components/pages/finance/add/initial-balance/FormFinanceAddInitialBalance.schema';
|
||||
import {
|
||||
FINANCE_INITIAL_BALANCE_TYPE_OPTIONS,
|
||||
FINANCE_PARTY_TYPE_OPTIONS,
|
||||
} from '@/config/constant';
|
||||
import { isResponseError, isResponseSuccess } from '@/lib/api-helper';
|
||||
import { formatTitleCase } from '@/lib/helper';
|
||||
import { FinanceApi } from '@/services/api/finance';
|
||||
import { BankApi, CustomerApi, SupplierApi } from '@/services/api/master-data';
|
||||
import {
|
||||
CreateInitialBalance,
|
||||
Finance,
|
||||
UpdateInitialBalance,
|
||||
} from '@/types/api/finance/finance';
|
||||
import { Bank } from '@/types/api/master-data/bank';
|
||||
import { Icon } from '@iconify/react';
|
||||
import { useFormik } from 'formik';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import { useCallback, useMemo } from 'react';
|
||||
import toast from 'react-hot-toast';
|
||||
|
||||
interface FormFinanceAddInitialBalanceProps {
|
||||
type?: 'add' | 'edit';
|
||||
initialValues?: Finance;
|
||||
}
|
||||
|
||||
const FormFinanceAddInitialBalance = ({
|
||||
type = 'add',
|
||||
initialValues,
|
||||
}: FormFinanceAddInitialBalanceProps) => {
|
||||
const router = useRouter();
|
||||
|
||||
// ===== Formik =====
|
||||
const formikInitialValues = useMemo((): InitialBalanceFormValues => {
|
||||
// Type assertion to handle potential initial_balance_type field
|
||||
const extendedInitialValues = initialValues as Finance & {
|
||||
initial_balance_type?: string;
|
||||
};
|
||||
|
||||
return {
|
||||
party_type_option:
|
||||
FINANCE_PARTY_TYPE_OPTIONS.find(
|
||||
(option) => option.value === initialValues?.party.type
|
||||
) || null,
|
||||
party_id_option: initialValues?.party
|
||||
? {
|
||||
label: initialValues.party.name,
|
||||
value: initialValues.party.id,
|
||||
}
|
||||
: null,
|
||||
bank_id_option: initialValues?.bank
|
||||
? {
|
||||
label: initialValues.bank.name,
|
||||
value: initialValues.bank.id,
|
||||
}
|
||||
: null,
|
||||
reference_number: initialValues?.reference_number || '',
|
||||
initial_balance_type_option:
|
||||
(initialValues?.nominal ?? 0) < 0
|
||||
? FINANCE_INITIAL_BALANCE_TYPE_OPTIONS.find(
|
||||
(option) => option.value === 'NEGATIVE'
|
||||
) || null
|
||||
: FINANCE_INITIAL_BALANCE_TYPE_OPTIONS.find(
|
||||
(option) => option.value === 'POSITIVE'
|
||||
) || null,
|
||||
nominal: initialValues?.nominal?.toString() || '',
|
||||
note: initialValues?.notes || '',
|
||||
};
|
||||
}, [initialValues]);
|
||||
|
||||
const formik = useFormik<InitialBalanceFormValues>({
|
||||
initialValues: formikInitialValues,
|
||||
validationSchema: InitialBalanceFormSchema,
|
||||
validateOnChange: true,
|
||||
validateOnBlur: true,
|
||||
onSubmit: async (values) => {
|
||||
const payload = transformFormValuesToPayload(values);
|
||||
|
||||
switch (type) {
|
||||
case 'add':
|
||||
await createInitialBalance(payload);
|
||||
break;
|
||||
|
||||
case 'edit':
|
||||
if (initialValues?.id) {
|
||||
await updateInitialBalance(initialValues.id, payload);
|
||||
}
|
||||
break;
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
// ===== Options =====
|
||||
const { options: partyOptions, isLoadingOptions: isLoadingPartyOptions } =
|
||||
useSelect(
|
||||
formik.values.party_type_option?.value === 'CUSTOMER'
|
||||
? CustomerApi.basePath
|
||||
: SupplierApi.basePath,
|
||||
'id',
|
||||
'name',
|
||||
'',
|
||||
{ limit: 'limit' }
|
||||
);
|
||||
const {
|
||||
options: bankOptions,
|
||||
rawData: bankRawData,
|
||||
isLoadingOptions: isLoadingBankOptions,
|
||||
} = useSelect<Bank>(BankApi.basePath, 'id', 'name', '', { limit: 'limit' });
|
||||
|
||||
// ===== Helper Functions =====
|
||||
const transformFormValuesToPayload = (
|
||||
values: InitialBalanceFormValues
|
||||
): CreateInitialBalance => {
|
||||
return {
|
||||
party_type: (values.party_type_option?.value as string) || '',
|
||||
party_id: Number(values.party_id_option?.value) || 0,
|
||||
bank_id: Number(values.bank_id_option?.value) || 0,
|
||||
reference_number: values.reference_number,
|
||||
initial_balance_type:
|
||||
(values.initial_balance_type_option?.value as string) || '',
|
||||
nominal: Number(values.nominal.replace(/\D/g, '')) || 0,
|
||||
note: values.note,
|
||||
};
|
||||
};
|
||||
|
||||
// ===== Handler =====
|
||||
const createInitialBalance = useCallback(
|
||||
async (payload: CreateInitialBalance) => {
|
||||
const response = await FinanceApi.createInitialBalances(payload);
|
||||
|
||||
if (isResponseError(response)) {
|
||||
toast.error(response.message);
|
||||
return;
|
||||
}
|
||||
|
||||
toast.success('Saldo awal berhasil ditambahkan');
|
||||
router.refresh();
|
||||
router.push('/finance');
|
||||
},
|
||||
[router]
|
||||
);
|
||||
|
||||
const updateInitialBalance = useCallback(
|
||||
async (financeId: number, payload: UpdateInitialBalance) => {
|
||||
const response = await FinanceApi.updateInitialBalances(
|
||||
financeId,
|
||||
payload
|
||||
);
|
||||
|
||||
if (isResponseError(response)) {
|
||||
toast.error(response.message);
|
||||
return;
|
||||
}
|
||||
|
||||
toast.success('Saldo awal berhasil diperbarui');
|
||||
router.refresh();
|
||||
router.push('/finance');
|
||||
},
|
||||
[router]
|
||||
);
|
||||
|
||||
return (
|
||||
<>
|
||||
<section className='w-full max-w-xl mx-auto'>
|
||||
<div className='flex flex-col gap-6 p-6'>
|
||||
<FormHeader
|
||||
title={`${type === 'add' ? 'Tambah' : 'Ubah'} Saldo Awal`}
|
||||
backUrl='/finance'
|
||||
/>
|
||||
<form className='flex flex-col gap-4' onSubmit={formik.handleSubmit}>
|
||||
<SelectInput
|
||||
label='Jenis Pihak'
|
||||
placeholder='Pilih jenis pihak'
|
||||
options={FINANCE_PARTY_TYPE_OPTIONS}
|
||||
value={formik.values.party_type_option}
|
||||
onChange={(value) => {
|
||||
formik.setFieldValue('party_type_option', value);
|
||||
}}
|
||||
isError={Boolean(
|
||||
formik.touched.party_type_option &&
|
||||
formik.errors.party_type_option
|
||||
)}
|
||||
errorMessage={
|
||||
formik.touched.party_type_option &&
|
||||
formik.errors.party_type_option
|
||||
? formik.errors.party_type_option
|
||||
: ''
|
||||
}
|
||||
required
|
||||
isClearable
|
||||
/>
|
||||
<SelectInput
|
||||
label={
|
||||
formik.values.party_type_option?.value
|
||||
? formatTitleCase(
|
||||
formik.values.party_type_option.value as string
|
||||
)
|
||||
: 'Pilih Jenis Pihak Dahulu'
|
||||
}
|
||||
placeholder={`Pilih ${formik.values.party_type_option?.value ? formatTitleCase(formik.values.party_type_option.value as string) : 'jenis pihak dahulu'}`}
|
||||
options={partyOptions}
|
||||
value={formik.values.party_id_option}
|
||||
onChange={(value) => {
|
||||
formik.setFieldValue('party_id_option', value);
|
||||
}}
|
||||
isLoading={isLoadingPartyOptions}
|
||||
isError={Boolean(
|
||||
formik.touched.party_id_option && formik.errors.party_id_option
|
||||
)}
|
||||
errorMessage={
|
||||
formik.touched.party_id_option && formik.errors.party_id_option
|
||||
? formik.errors.party_id_option
|
||||
: ''
|
||||
}
|
||||
required
|
||||
isClearable
|
||||
isDisabled={!formik.values.party_type_option?.value}
|
||||
/>
|
||||
<SelectInput
|
||||
label='Bank'
|
||||
placeholder='Pilih bank'
|
||||
options={
|
||||
isResponseSuccess(bankRawData)
|
||||
? bankOptions.map((option) => ({
|
||||
label:
|
||||
bankRawData.data?.find(
|
||||
(item) => item.id === option.value
|
||||
)?.alias +
|
||||
' - ' +
|
||||
bankRawData.data?.find(
|
||||
(item) => item.id === option.value
|
||||
)?.account_number +
|
||||
' - ' +
|
||||
bankRawData.data?.find(
|
||||
(item) => item.id === option.value
|
||||
)?.owner,
|
||||
value: option.value,
|
||||
}))
|
||||
: []
|
||||
}
|
||||
value={formik.values.bank_id_option}
|
||||
onChange={(value) => {
|
||||
formik.setFieldValue('bank_id_option', value);
|
||||
}}
|
||||
isLoading={isLoadingBankOptions}
|
||||
isError={Boolean(
|
||||
formik.touched.bank_id_option && formik.errors.bank_id_option
|
||||
)}
|
||||
errorMessage={
|
||||
formik.touched.bank_id_option && formik.errors.bank_id_option
|
||||
? formik.errors.bank_id_option
|
||||
: ''
|
||||
}
|
||||
required
|
||||
isClearable
|
||||
/>
|
||||
<TextInput
|
||||
label='Nomor Referensi'
|
||||
placeholder='Masukkan nomor referensi'
|
||||
name='reference_number'
|
||||
value={formik.values.reference_number}
|
||||
onChange={formik.handleChange}
|
||||
onBlur={formik.handleBlur}
|
||||
isError={Boolean(
|
||||
formik.touched.reference_number &&
|
||||
formik.errors.reference_number
|
||||
)}
|
||||
errorMessage={
|
||||
formik.touched.reference_number &&
|
||||
formik.errors.reference_number
|
||||
? formik.errors.reference_number
|
||||
: ''
|
||||
}
|
||||
required
|
||||
/>
|
||||
<SelectInput
|
||||
label='Tipe Saldo Awal'
|
||||
placeholder='Pilih tipe saldo awal'
|
||||
options={FINANCE_INITIAL_BALANCE_TYPE_OPTIONS}
|
||||
value={formik.values.initial_balance_type_option}
|
||||
onChange={(value) => {
|
||||
formik.setFieldValue('initial_balance_type_option', value);
|
||||
}}
|
||||
isError={Boolean(
|
||||
formik.touched.initial_balance_type_option &&
|
||||
formik.errors.initial_balance_type_option
|
||||
)}
|
||||
errorMessage={
|
||||
formik.touched.initial_balance_type_option &&
|
||||
formik.errors.initial_balance_type_option
|
||||
? formik.errors.initial_balance_type_option
|
||||
: ''
|
||||
}
|
||||
required
|
||||
isClearable
|
||||
/>
|
||||
<NumberInput
|
||||
label='Nominal'
|
||||
placeholder='Masukkan nominal'
|
||||
name='nominal'
|
||||
value={formik.values.nominal}
|
||||
onChange={formik.handleChange}
|
||||
onBlur={formik.handleBlur}
|
||||
isError={Boolean(formik.touched.nominal && formik.errors.nominal)}
|
||||
errorMessage={
|
||||
formik.touched.nominal && formik.errors.nominal
|
||||
? formik.errors.nominal
|
||||
: ''
|
||||
}
|
||||
allowNegative={false}
|
||||
startAdornment={
|
||||
formik.values.initial_balance_type_option?.value ===
|
||||
'POSITIVE' ? (
|
||||
<Icon icon='mdi:plus' />
|
||||
) : formik.values.initial_balance_type_option?.value ===
|
||||
'NEGATIVE' ? (
|
||||
<Icon icon='mdi:minus' />
|
||||
) : (
|
||||
''
|
||||
)
|
||||
}
|
||||
required
|
||||
/>
|
||||
<TextArea
|
||||
label='Catatan'
|
||||
placeholder='Masukkan catatan'
|
||||
name='note'
|
||||
value={formik.values.note}
|
||||
onChange={formik.handleChange}
|
||||
onBlur={formik.handleBlur}
|
||||
isError={Boolean(formik.touched.note && formik.errors.note)}
|
||||
errorMessage={
|
||||
formik.touched.note && formik.errors.note
|
||||
? formik.errors.note
|
||||
: ''
|
||||
}
|
||||
required
|
||||
/>
|
||||
<div className='flex justify-center gap-4'>
|
||||
<Button
|
||||
type='reset'
|
||||
color='warning'
|
||||
className='w-min-24'
|
||||
onClick={() => formik.resetForm()}
|
||||
disabled={formik.isSubmitting}
|
||||
>
|
||||
Reset
|
||||
</Button>
|
||||
<Button
|
||||
type='submit'
|
||||
className='w-min-24'
|
||||
disabled={formik.isSubmitting || !formik.isValid}
|
||||
>
|
||||
Submit
|
||||
</Button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</section>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default FormFinanceAddInitialBalance;
|
||||
|
||||
@@ -0,0 +1,25 @@
|
||||
import { OptionType } from '@/components/input/SelectInput';
|
||||
import * as Yup from 'yup';
|
||||
|
||||
// Type for form values (includes option objects for SelectInput)
|
||||
export type InjectionFormValues = {
|
||||
bank_id_option: OptionType | null;
|
||||
adjustment_date: string;
|
||||
nominal: string;
|
||||
note: string;
|
||||
};
|
||||
|
||||
export const InjectionFormSchema = Yup.object<InjectionFormValues>({
|
||||
bank_id_option: Yup.mixed()
|
||||
.nullable()
|
||||
.test(
|
||||
'is-valid-option',
|
||||
'Bank wajib diisi',
|
||||
(value) => value !== null && value !== undefined
|
||||
),
|
||||
adjustment_date: Yup.string().required('Tanggal penyesuaian wajib diisi'),
|
||||
nominal: Yup.string().required('Nominal wajib diisi'),
|
||||
note: Yup.string().required('Catatan wajib diisi'),
|
||||
});
|
||||
|
||||
export const UpdateInjectionFormSchema = InjectionFormSchema;
|
||||
@@ -0,0 +1,251 @@
|
||||
'use client';
|
||||
|
||||
import Button from '@/components/Button';
|
||||
import { FormHeader } from '@/components/helper/form/FormHeader';
|
||||
import DateInput from '@/components/input/DateInput';
|
||||
import NumberInput from '@/components/input/NumberInput';
|
||||
import SelectInput, {
|
||||
OptionType,
|
||||
useSelect,
|
||||
} from '@/components/input/SelectInput';
|
||||
import TextArea from '@/components/input/TextArea';
|
||||
import {
|
||||
InjectionFormSchema,
|
||||
InjectionFormValues,
|
||||
} from '@/components/pages/finance/add/injection/FormFinanceInjection.schema';
|
||||
import { isResponseError, isResponseSuccess } from '@/lib/api-helper';
|
||||
import { formatDate } from '@/lib/helper';
|
||||
import { FinanceApi } from '@/services/api/finance';
|
||||
import { BankApi } from '@/services/api/master-data';
|
||||
import {
|
||||
CreateInjection,
|
||||
Finance,
|
||||
UpdateInjection,
|
||||
} from '@/types/api/finance/finance';
|
||||
import { Bank } from '@/types/api/master-data/bank';
|
||||
import { useFormik } from 'formik';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import { useCallback, useMemo } from 'react';
|
||||
import toast from 'react-hot-toast';
|
||||
|
||||
interface FormFinanceInjectionProps {
|
||||
type?: 'add' | 'edit';
|
||||
initialValues?: Finance;
|
||||
}
|
||||
|
||||
const FormFinanceInjection = ({
|
||||
type = 'add',
|
||||
initialValues,
|
||||
}: FormFinanceInjectionProps) => {
|
||||
const router = useRouter();
|
||||
|
||||
// ===== Formik =====
|
||||
const formikInitialValues = useMemo((): InjectionFormValues => {
|
||||
return {
|
||||
bank_id_option: initialValues?.bank
|
||||
? {
|
||||
label: initialValues.bank.name,
|
||||
value: initialValues.bank.id,
|
||||
}
|
||||
: null,
|
||||
adjustment_date: initialValues?.payment_date || '',
|
||||
nominal: initialValues?.nominal?.toString() || '',
|
||||
note: initialValues?.notes || '',
|
||||
};
|
||||
}, [initialValues]);
|
||||
|
||||
const formik = useFormik<InjectionFormValues>({
|
||||
initialValues: formikInitialValues,
|
||||
validationSchema: InjectionFormSchema,
|
||||
validateOnChange: true,
|
||||
validateOnBlur: true,
|
||||
onSubmit: async (values) => {
|
||||
const payload = transformFormValuesToPayload(values);
|
||||
|
||||
switch (type) {
|
||||
case 'add':
|
||||
await createInjection(payload);
|
||||
break;
|
||||
|
||||
case 'edit':
|
||||
if (initialValues?.id) {
|
||||
await updateInjection(initialValues.id, payload);
|
||||
}
|
||||
break;
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
// ===== Options =====
|
||||
const {
|
||||
options: bankOptions,
|
||||
rawData: bankRawData,
|
||||
isLoadingOptions: isLoadingBankOptions,
|
||||
} = useSelect<Bank>(BankApi.basePath, 'id', 'name', '', { limit: 'limit' });
|
||||
|
||||
// ===== Helper Functions =====
|
||||
const transformFormValuesToPayload = (
|
||||
values: InjectionFormValues
|
||||
): CreateInjection => {
|
||||
return {
|
||||
bank_id: Number(values.bank_id_option?.value) || 0,
|
||||
adjustment_date: formatDate(values.adjustment_date, 'YYYY-MM-DD'),
|
||||
nominal: Number(values.nominal.replace(/\D/g, '')) || 0,
|
||||
notes: values.note,
|
||||
};
|
||||
};
|
||||
|
||||
// ===== Handler =====
|
||||
const createInjection = useCallback(
|
||||
async (payload: CreateInjection) => {
|
||||
const response = await FinanceApi.createInjections(payload);
|
||||
|
||||
if (isResponseError(response)) {
|
||||
toast.error(response.message);
|
||||
return;
|
||||
}
|
||||
|
||||
toast.success('Injeksi dana berhasil ditambahkan');
|
||||
router.refresh();
|
||||
router.push('/finance');
|
||||
},
|
||||
[router]
|
||||
);
|
||||
|
||||
const updateInjection = useCallback(
|
||||
async (financeId: number, payload: UpdateInjection) => {
|
||||
const response = await FinanceApi.updateInjections(financeId, payload);
|
||||
|
||||
if (isResponseError(response)) {
|
||||
toast.error(response.message);
|
||||
return;
|
||||
}
|
||||
|
||||
toast.success('Injeksi dana berhasil diperbarui');
|
||||
router.refresh();
|
||||
router.push('/finance');
|
||||
},
|
||||
[router]
|
||||
);
|
||||
|
||||
return (
|
||||
<>
|
||||
<section className='w-full max-w-xl mx-auto'>
|
||||
<div className='flex flex-col gap-6 p-6'>
|
||||
<FormHeader
|
||||
title={`${type === 'add' ? 'Tambah' : 'Ubah'} Injeksi Dana`}
|
||||
backUrl='/finance'
|
||||
/>
|
||||
<form className='flex flex-col gap-4' onSubmit={formik.handleSubmit}>
|
||||
<SelectInput
|
||||
label='Bank'
|
||||
placeholder='Pilih bank'
|
||||
options={
|
||||
isResponseSuccess(bankRawData)
|
||||
? bankOptions.map((option) => ({
|
||||
label:
|
||||
bankRawData.data?.find(
|
||||
(item) => item.id === option.value
|
||||
)?.alias +
|
||||
' - ' +
|
||||
bankRawData.data?.find(
|
||||
(item) => item.id === option.value
|
||||
)?.account_number +
|
||||
' - ' +
|
||||
bankRawData.data?.find(
|
||||
(item) => item.id === option.value
|
||||
)?.owner,
|
||||
value: option.value,
|
||||
}))
|
||||
: []
|
||||
}
|
||||
value={formik.values.bank_id_option}
|
||||
onChange={(value) => {
|
||||
formik.setFieldValue('bank_id_option', value);
|
||||
}}
|
||||
isLoading={isLoadingBankOptions}
|
||||
isError={Boolean(
|
||||
formik.touched.bank_id_option && formik.errors.bank_id_option
|
||||
)}
|
||||
errorMessage={
|
||||
formik.touched.bank_id_option && formik.errors.bank_id_option
|
||||
? formik.errors.bank_id_option
|
||||
: ''
|
||||
}
|
||||
required
|
||||
isClearable
|
||||
/>
|
||||
<DateInput
|
||||
label='Tanggal Penyesuaian'
|
||||
placeholder='Pilih tanggal penyesuaian'
|
||||
name='adjustment_date'
|
||||
value={formik.values.adjustment_date}
|
||||
onChange={formik.handleChange}
|
||||
onBlur={formik.handleBlur}
|
||||
isError={Boolean(
|
||||
formik.touched.adjustment_date && formik.errors.adjustment_date
|
||||
)}
|
||||
errorMessage={
|
||||
formik.touched.adjustment_date && formik.errors.adjustment_date
|
||||
? formik.errors.adjustment_date
|
||||
: ''
|
||||
}
|
||||
required
|
||||
/>
|
||||
<NumberInput
|
||||
label='Nominal'
|
||||
placeholder='Masukkan nominal'
|
||||
name='nominal'
|
||||
value={formik.values.nominal}
|
||||
onChange={formik.handleChange}
|
||||
onBlur={formik.handleBlur}
|
||||
isError={Boolean(formik.touched.nominal && formik.errors.nominal)}
|
||||
errorMessage={
|
||||
formik.touched.nominal && formik.errors.nominal
|
||||
? formik.errors.nominal
|
||||
: ''
|
||||
}
|
||||
allowNegative={true}
|
||||
required
|
||||
/>
|
||||
<TextArea
|
||||
label='Catatan'
|
||||
placeholder='Masukkan catatan'
|
||||
name='note'
|
||||
value={formik.values.note}
|
||||
onChange={formik.handleChange}
|
||||
onBlur={formik.handleBlur}
|
||||
isError={Boolean(formik.touched.note && formik.errors.note)}
|
||||
errorMessage={
|
||||
formik.touched.note && formik.errors.note
|
||||
? formik.errors.note
|
||||
: ''
|
||||
}
|
||||
required
|
||||
/>
|
||||
<div className='flex justify-center gap-4'>
|
||||
<Button
|
||||
type='reset'
|
||||
color='warning'
|
||||
className='w-min-24'
|
||||
onClick={() => formik.resetForm()}
|
||||
disabled={formik.isSubmitting}
|
||||
>
|
||||
Reset
|
||||
</Button>
|
||||
<Button
|
||||
type='submit'
|
||||
className='w-min-24'
|
||||
disabled={formik.isSubmitting || !formik.isValid}
|
||||
>
|
||||
Submit
|
||||
</Button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</section>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default FormFinanceInjection;
|
||||
@@ -1,5 +0,0 @@
|
||||
const FormFinanceAdjust = () => {
|
||||
return <div>Finance Adjust</div>;
|
||||
};
|
||||
|
||||
export default FormFinanceAdjust;
|
||||
@@ -79,18 +79,6 @@ const InventoryAdjustmentTable = () => {
|
||||
year: 'numeric',
|
||||
}),
|
||||
},
|
||||
// {
|
||||
// id: 'before_quantity',
|
||||
// header: 'Stok Sebelum',
|
||||
// accessorFn: (row) =>
|
||||
// formatNumber(String(row.product_warehouse?.quantity)),
|
||||
// },
|
||||
// {
|
||||
// id: 'after_quantity',
|
||||
// header: 'Stok Sesudah',
|
||||
// accessorFn: (row) =>
|
||||
// formatNumber(String(row.product_warehouse?.quantity)),
|
||||
// },
|
||||
{
|
||||
id: 'quantity',
|
||||
header: 'Kuantitas',
|
||||
@@ -187,14 +175,6 @@ const InventoryAdjustmentTable = () => {
|
||||
Tambah
|
||||
</Button>
|
||||
</RequirePermission>
|
||||
|
||||
{/* <DebouncedTextInput
|
||||
name='search'
|
||||
placeholder='Cari Stock Adjustment'
|
||||
value={tableFilterState.search}
|
||||
onChange={searchChangeHandler}
|
||||
className={{ wrapper: 'sm:max-w-3xs' }}
|
||||
/> */}
|
||||
</div>
|
||||
|
||||
<div className='flex flex-row justify-end'>
|
||||
|
||||
@@ -300,6 +300,17 @@ export const FINANCE_PAYMENT_METHOD_OPTIONS = [
|
||||
{ label: 'Saldo', value: 'SALDO' },
|
||||
];
|
||||
|
||||
export const FINANCE_INITIAL_BALANCE_TYPE_OPTIONS = [
|
||||
{ label: 'Saldo Awal Positif', value: 'POSITIVE' },
|
||||
{ label: 'Saldo Awal Negatif', value: 'NEGATIVE' },
|
||||
];
|
||||
|
||||
export const FINANCE_TRANSACTION_STATUS = ['PENJUALAN', 'BIAYA'];
|
||||
|
||||
export const FINANCE_INITIAL_BALANCE_STATUS = ['SALDO_AWAL'];
|
||||
|
||||
export const FINANCE_INJECTION_STATUS = ['INJECTION'];
|
||||
|
||||
export const APPROVAL_WORKFLOWS = [
|
||||
{
|
||||
key: 'PROJECT_FLOCKS',
|
||||
|
||||
@@ -68,6 +68,28 @@ export const ROUTE_PERMISSIONS: Record<string, string[]> = {
|
||||
'/expense/realization/': ['lti.expense.create.realization'],
|
||||
'/expense/realization/edit/': ['lti.expense.update.realization'],
|
||||
|
||||
// Finance
|
||||
// // ===== FINANCE =====
|
||||
// "lti.finance.transaction.list",
|
||||
// "lti.finance.transaction.detail",
|
||||
// "lti.finance.transaction.delete",
|
||||
// "lti.finance.payments.create",
|
||||
// "lti.finance.payments.update",
|
||||
// "lti.finance.initial_balances.create",
|
||||
// "lti.finance.initial_balances.update",
|
||||
// "lti.finance.injections.create",
|
||||
// "lti.finance.injections.update",
|
||||
'/finance/': ['lti.finance.transaction.list'],
|
||||
'/finance/detail/': ['lti.finance.transaction.detail'],
|
||||
'/finance/add/': ['lti.finance.payments.create'],
|
||||
'/finance/detail/edit/': ['lti.finance.payments.update'],
|
||||
'/finance/add/initial-balance/': ['lti.finance.initial_balances.create'],
|
||||
'/finance/detail/edit/initial-balance/': [
|
||||
'lti.finance.initial_balances.update',
|
||||
],
|
||||
'/finance/add/injection/': ['lti.finance.injections.create'],
|
||||
'/finance/detail/edit/injection/': ['lti.finance.injections.update'],
|
||||
|
||||
// Closing
|
||||
'/closing/': ['lti.closing.list'],
|
||||
'/closing/detail/': ['lti.closing.detail'],
|
||||
|
||||
+174
-37
@@ -1,11 +1,16 @@
|
||||
import axios from 'axios';
|
||||
import { BaseApiService } from '@/services/api/base';
|
||||
import { BaseApiResponse } from '@/types/api/api-general';
|
||||
import { httpClient } from '@/services/http/client';
|
||||
import { Finance } from '@/types/api/finance/finance';
|
||||
// DUMMY_START
|
||||
import { getAllFetcher, getFetcher } from '@/dummy/finance/finance.dummy';
|
||||
// DUMMY_END
|
||||
import { httpClient, httpClientFetcher } from '@/services/http/client';
|
||||
import {
|
||||
CreateFinancePayment,
|
||||
CreateInitialBalance,
|
||||
CreateInjection,
|
||||
Finance,
|
||||
UpdateFinancePayment,
|
||||
UpdateInitialBalance,
|
||||
UpdateInjection,
|
||||
} from '@/types/api/finance/finance';
|
||||
|
||||
export class FinanceApiService extends BaseApiService<
|
||||
Finance,
|
||||
@@ -16,41 +21,173 @@ export class FinanceApiService extends BaseApiService<
|
||||
super(basePath);
|
||||
}
|
||||
|
||||
async getAllFetcher(): Promise<BaseApiResponse<Finance[]>> {
|
||||
// DUMMY_START
|
||||
return await getAllFetcher();
|
||||
// DUMMY_END
|
||||
|
||||
// LIVE_START
|
||||
// try {
|
||||
// const path = `${this.basePath}/`;
|
||||
// return await httpClient<BaseApiResponse<Finance[]>>(path);
|
||||
// } catch (error) {
|
||||
// if (axios.isAxiosError<BaseApiResponse<Finance[]>>(error)) {
|
||||
// return error.response?.data;
|
||||
// }
|
||||
// return undefined;
|
||||
// }
|
||||
// LIVE_END
|
||||
async getSingle(id: number): Promise<BaseApiResponse<Finance>> {
|
||||
return await httpClientFetcher<BaseApiResponse<Finance>>(
|
||||
`${this.basePath}/transactions/${id}`
|
||||
);
|
||||
}
|
||||
|
||||
async getSingle(id: number): Promise<BaseApiResponse<Finance>> {
|
||||
// DUMMY_START
|
||||
return await getFetcher(id);
|
||||
// DUMMY_END
|
||||
async create(payload: CreateFinancePayment) {
|
||||
const isFormData =
|
||||
typeof FormData !== 'undefined' && payload instanceof FormData;
|
||||
try {
|
||||
const headers = isFormData
|
||||
? { ...(this.header ?? {}) }
|
||||
: { 'Content-Type': 'application/json', ...(this.header ?? {}) };
|
||||
|
||||
// LIVE_START
|
||||
// try {
|
||||
// const path = `${this.basePath}/`;
|
||||
// return await httpClient<BaseApiResponse<Finance[]>>(path);
|
||||
// } catch (error) {
|
||||
// if (axios.isAxiosError<BaseApiResponse<Finance[]>>(error)) {
|
||||
// return error.response?.data;
|
||||
// }
|
||||
// return undefined;
|
||||
// }
|
||||
// LIVE_END
|
||||
const createRes = await httpClient<BaseApiResponse<Finance>>(
|
||||
`${this.basePath}/payments`,
|
||||
{
|
||||
method: 'POST',
|
||||
body: payload,
|
||||
headers,
|
||||
}
|
||||
);
|
||||
return createRes;
|
||||
} catch (error: unknown) {
|
||||
if (axios.isAxiosError<BaseApiResponse<Finance>>(error)) {
|
||||
return error.response?.data;
|
||||
}
|
||||
return undefined;
|
||||
}
|
||||
}
|
||||
|
||||
async createInitialBalances(payload: CreateInitialBalance) {
|
||||
const isFormData =
|
||||
typeof FormData !== 'undefined' && payload instanceof FormData;
|
||||
try {
|
||||
const headers = isFormData
|
||||
? { ...(this.header ?? {}) }
|
||||
: { 'Content-Type': 'application/json', ...(this.header ?? {}) };
|
||||
|
||||
const createRes = await httpClient<BaseApiResponse<Finance>>(
|
||||
`${this.basePath}/initial-balances`,
|
||||
{
|
||||
method: 'POST',
|
||||
body: payload,
|
||||
headers,
|
||||
}
|
||||
);
|
||||
return createRes;
|
||||
} catch (error: unknown) {
|
||||
if (axios.isAxiosError<BaseApiResponse<Finance>>(error)) {
|
||||
return error.response?.data;
|
||||
}
|
||||
return undefined;
|
||||
}
|
||||
}
|
||||
|
||||
async createInjections(payload: CreateInjection) {
|
||||
const isFormData =
|
||||
typeof FormData !== 'undefined' && payload instanceof FormData;
|
||||
try {
|
||||
const headers = isFormData
|
||||
? { ...(this.header ?? {}) }
|
||||
: { 'Content-Type': 'application/json', ...(this.header ?? {}) };
|
||||
|
||||
const createRes = await httpClient<BaseApiResponse<Finance>>(
|
||||
`${this.basePath}/injections`,
|
||||
{
|
||||
method: 'POST',
|
||||
body: payload,
|
||||
headers,
|
||||
}
|
||||
);
|
||||
return createRes;
|
||||
} catch (error: unknown) {
|
||||
if (axios.isAxiosError<BaseApiResponse<Finance>>(error)) {
|
||||
return error.response?.data;
|
||||
}
|
||||
return undefined;
|
||||
}
|
||||
}
|
||||
|
||||
async update(id: number, payload: UpdateFinancePayment) {
|
||||
const isFormData =
|
||||
typeof FormData !== 'undefined' && payload instanceof FormData;
|
||||
try {
|
||||
const updatePath = `${this.basePath}/payments/${id}`;
|
||||
|
||||
const headers = isFormData
|
||||
? { ...(this.header ?? {}) }
|
||||
: { 'Content-Type': 'application/json', ...(this.header ?? {}) };
|
||||
|
||||
const updateRes = await httpClient<BaseApiResponse<Finance>>(updatePath, {
|
||||
method: 'PATCH',
|
||||
body: payload,
|
||||
headers,
|
||||
});
|
||||
return updateRes;
|
||||
} catch (error: unknown) {
|
||||
if (axios.isAxiosError<BaseApiResponse<Finance>>(error)) {
|
||||
return error.response?.data;
|
||||
}
|
||||
return undefined;
|
||||
}
|
||||
}
|
||||
|
||||
async updateInitialBalances(id: number, payload: UpdateInitialBalance) {
|
||||
const isFormData =
|
||||
typeof FormData !== 'undefined' && payload instanceof FormData;
|
||||
try {
|
||||
const updatePath = `${this.basePath}/initial-balances/${id}`;
|
||||
|
||||
const headers = isFormData
|
||||
? { ...(this.header ?? {}) }
|
||||
: { 'Content-Type': 'application/json', ...(this.header ?? {}) };
|
||||
|
||||
const updateRes = await httpClient<BaseApiResponse<Finance>>(updatePath, {
|
||||
method: 'PATCH',
|
||||
body: payload,
|
||||
headers,
|
||||
});
|
||||
return updateRes;
|
||||
} catch (error: unknown) {
|
||||
if (axios.isAxiosError<BaseApiResponse<Finance>>(error)) {
|
||||
return error.response?.data;
|
||||
}
|
||||
return undefined;
|
||||
}
|
||||
}
|
||||
|
||||
async updateInjections(id: number, payload: UpdateInjection) {
|
||||
const isFormData =
|
||||
typeof FormData !== 'undefined' && payload instanceof FormData;
|
||||
try {
|
||||
const updatePath = `${this.basePath}/injections/${id}`;
|
||||
|
||||
const headers = isFormData
|
||||
? { ...(this.header ?? {}) }
|
||||
: { 'Content-Type': 'application/json', ...(this.header ?? {}) };
|
||||
|
||||
const updateRes = await httpClient<BaseApiResponse<Finance>>(updatePath, {
|
||||
method: 'PATCH',
|
||||
body: payload,
|
||||
headers,
|
||||
});
|
||||
return updateRes;
|
||||
} catch (error: unknown) {
|
||||
if (axios.isAxiosError<BaseApiResponse<Finance>>(error)) {
|
||||
return error.response?.data;
|
||||
}
|
||||
return undefined;
|
||||
}
|
||||
}
|
||||
|
||||
async delete(id: number) {
|
||||
try {
|
||||
const deletePath = `${this.basePath}/transactions/${id}`;
|
||||
const deleteRes = await httpClient<BaseApiResponse>(deletePath, {
|
||||
method: 'DELETE',
|
||||
});
|
||||
return deleteRes;
|
||||
} catch (error) {
|
||||
if (axios.isAxiosError<BaseApiResponse>(error)) {
|
||||
return error.response?.data;
|
||||
}
|
||||
return undefined;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export const FinanceApi = new FinanceApiService('/finances');
|
||||
export const FinanceApi = new FinanceApiService('/finance');
|
||||
|
||||
Vendored
+37
-6
@@ -1,4 +1,4 @@
|
||||
export interface Finance {
|
||||
export type Finance = {
|
||||
id: number;
|
||||
payment_code: string;
|
||||
reference_number: string;
|
||||
@@ -12,18 +12,49 @@ export interface Finance {
|
||||
income_amount: number;
|
||||
nominal: number;
|
||||
notes: string;
|
||||
}
|
||||
};
|
||||
|
||||
export interface FinanceParty {
|
||||
export type FinanceParty = {
|
||||
id: number;
|
||||
name: string;
|
||||
type: string;
|
||||
account_number: string;
|
||||
}
|
||||
export interface FinanceBank {
|
||||
};
|
||||
export type FinanceBank = {
|
||||
id: number;
|
||||
name: string;
|
||||
alias: string;
|
||||
owner: string;
|
||||
account_number: string;
|
||||
}
|
||||
};
|
||||
export type CreateFinancePayment = {
|
||||
party_id: number;
|
||||
party_type: string;
|
||||
payment_date: string;
|
||||
payment_method: string;
|
||||
bank_id: number;
|
||||
reference_number: string;
|
||||
nominal: number;
|
||||
notes: string;
|
||||
};
|
||||
|
||||
export type UpdateFinancePayment = CreateFinancePayment;
|
||||
export type CreateInitialBalance = {
|
||||
party_type: string;
|
||||
party_id: number;
|
||||
bank_id: number;
|
||||
reference_number: string;
|
||||
initial_balance_type: string;
|
||||
nominal: number;
|
||||
note: string;
|
||||
};
|
||||
|
||||
export type UpdateInitialBalance = CreateInitialBalance;
|
||||
export type CreateInjection = {
|
||||
bank_id: number;
|
||||
adjustment_date: string;
|
||||
nominal: number;
|
||||
notes: string;
|
||||
};
|
||||
|
||||
export type UpdateInjection = CreateInjection;
|
||||
|
||||
Reference in New Issue
Block a user