{row.getVisibleCells().map((cell) => (
- |
+ |
{!isLoading &&
flexRender(cell.column.columnDef.cell, cell.getContext())}
@@ -270,7 +298,7 @@ const Table = ({
emptyContent}
{data.length > 0 && table.getRowModel().rows.length > 0 && !isLoading && (
-
+
({
onPrevPage={prevPageClickHandler}
onNextPage={nextPageClickHandler}
onPageChange={pageChangeHandler}
+ rowOptions={rowOptions}
+ onRowChange={onPageSizeChange}
/>
)}
diff --git a/src/components/input/CheckboxInput.tsx b/src/components/input/CheckboxInput.tsx
index f14bc852..32f14f94 100644
--- a/src/components/input/CheckboxInput.tsx
+++ b/src/components/input/CheckboxInput.tsx
@@ -2,8 +2,9 @@
import { HTMLProps, useEffect, useRef } from 'react';
import { cn } from '@/lib/helper';
+import { Size } from '@/types/theme';
-interface CheckboxInputProps extends HTMLProps {
+interface CheckboxInputProps extends Omit, 'size'> {
name: string;
label?: string;
indeterminate?: boolean;
@@ -16,6 +17,7 @@ interface CheckboxInputProps extends HTMLProps {
isError?: boolean;
isValid?: boolean;
errorMessage?: string;
+ size?: Size;
}
const CheckboxInput = ({
@@ -27,10 +29,19 @@ const CheckboxInput = ({
isValid,
isError,
errorMessage,
+ size = 'sm',
...rest
}: CheckboxInputProps) => {
const ref = useRef(null!);
+ const checkboxBaseClassName = cn('checkbox cursor-pointer rounded-md', {
+ 'checkbox-xs': size === 'xs',
+ 'checkbox-sm': size === 'sm',
+ 'checkbox-md': size === 'md',
+ 'checkbox-lg': size === 'lg',
+ 'checkbox-xl': size === 'xl',
+ });
+
useEffect(() => {
if (typeof indeterminate === 'boolean') {
ref.current.indeterminate = !rest.checked && indeterminate;
@@ -53,7 +64,7 @@ const CheckboxInput = ({
id={name}
name={name}
className={cn(
- 'checkbox rounded-md cursor-pointer',
+ checkboxBaseClassName,
{
'border-error': isError,
'border-success': isValid,
diff --git a/src/components/menu/Menu.tsx b/src/components/menu/Menu.tsx
index b3981065..ae74717d 100644
--- a/src/components/menu/Menu.tsx
+++ b/src/components/menu/Menu.tsx
@@ -1,16 +1,32 @@
import { ReactNode } from 'react';
import { cn } from '@/lib/helper';
+import { Size } from '@/types/theme';
interface MenuProps {
children?: ReactNode;
+ size?: Size;
+ direction?: 'vertical' | 'horizontal';
className?: string;
}
-const Menu = ({ children, className }: MenuProps) => {
- return (
-
- );
+const Menu = ({
+ children,
+ size = 'md',
+ direction = 'vertical',
+ className,
+}: MenuProps) => {
+ const menuBaseClassName = cn('menu w-full', {
+ 'menu-xs': size === 'xs',
+ 'menu-sm': size === 'sm',
+ 'menu-md': size === 'md',
+ 'menu-lg': size === 'lg',
+ 'menu-xl': size === 'xl',
+ 'menu-vertical': direction === 'vertical',
+ 'menu-horizontal': direction === 'horizontal',
+ });
+
+ return ;
};
export default Menu;
diff --git a/src/components/molecules/SidebarMenu.tsx b/src/components/molecules/SidebarMenu.tsx
new file mode 100644
index 00000000..6a217dcc
--- /dev/null
+++ b/src/components/molecules/SidebarMenu.tsx
@@ -0,0 +1,92 @@
+import Link from 'next/link';
+import Menu from '@/components/menu/Menu';
+import { Icon } from '@iconify/react';
+import { cn, isPathActive } from '@/lib/helper';
+
+export interface SidebarMenuItem {
+ type?: 'item' | 'title';
+ text: string;
+ link: string;
+ icon?: string;
+ submenu?: SidebarMenuItem[];
+}
+
+interface SidebarMenuItemProps {
+ item: SidebarMenuItem;
+ activeLink: string;
+}
+
+interface SidebarMenuProps {
+ menu: SidebarMenuItem[];
+ activeLink: string;
+}
+
+const SidebarMenuItem = ({ item, activeLink }: SidebarMenuItemProps) => {
+ const isItemActive = isPathActive(activeLink, item.link);
+
+ const menuItemWithoutSubmenu = (
+
+
+ {item.icon && }
+
+ {item.text}
+
+
+ );
+
+ if (!item.submenu || item.submenu.length === 0) {
+ return menuItemWithoutSubmenu;
+ }
+
+ const menuItemWithSubmenu = (
+
+
+
+ {item.icon && }
+
+ {item.text}
+
+
+
+ {item.submenu.map((submenuItem, submenuIdx) => (
+
+ ))}
+
+
+
+ );
+
+ return menuItemWithSubmenu;
+};
+
+const SidebarMenu = ({ menu, activeLink }: SidebarMenuProps) => {
+ return (
+
+ );
+};
+
+export default SidebarMenu;
diff --git a/src/components/pages/closing/ClosingDetail.tsx b/src/components/pages/closing/ClosingDetail.tsx
new file mode 100644
index 00000000..147b3fbd
--- /dev/null
+++ b/src/components/pages/closing/ClosingDetail.tsx
@@ -0,0 +1,95 @@
+'use client';
+
+import { useMemo, useState } from 'react';
+
+import { Icon } from '@iconify/react';
+import Button from '@/components/Button';
+import Tabs from '@/components/Tabs';
+import ClosingGeneralInformationTable from '@/components/pages/closing/ClosingGeneralInformationTable';
+
+import { ClosingGeneralInformation } from '@/types/api/closing';
+import ClosingSapronakTabContent from './ClosingSapronakTabContent';
+
+interface ClosingDetailProps {
+ id: number;
+ initialValue?: ClosingGeneralInformation;
+}
+
+const ClosingDetail: React.FC = ({ id, initialValue }) => {
+ const [activeTab, setActiveTab] = useState('sapronak');
+
+ const closingDetailTabs = useMemo(() => {
+ const validTabs = [
+ {
+ id: 'sapronak',
+ label: 'Sapronak',
+ content: ,
+ },
+ {
+ id: 'perhitunganSapronak',
+ label: 'Perhitungan Sapronak',
+ content: 'Perhitungan Sapronak',
+ },
+ {
+ id: 'penjualan',
+ label: 'Penjualan',
+ content: 'Penjualan',
+ },
+ {
+ id: 'overhead',
+ label: 'Overhead',
+ content: 'Overhead',
+ },
+ {
+ id: 'hppEkspedisi',
+ label: 'HPP Ekspedisi',
+ content: 'HPP Ekspedisi',
+ },
+ {
+ id: 'dataProduksi',
+ label: 'Data Produksi',
+ content: 'Data Produksi',
+ },
+ {
+ id: 'keuangan',
+ label: 'Keuangan',
+ content: 'Keuangan',
+ },
+ ];
+
+ return validTabs;
+ }, [initialValue]);
+
+ return (
+ <>
+
+
+
+
+ Detail Closing
+
+
+
+
+
+
+
+ );
+};
+
+export default ClosingDetail;
diff --git a/src/components/pages/closing/ClosingGeneralInformationTable.tsx b/src/components/pages/closing/ClosingGeneralInformationTable.tsx
new file mode 100644
index 00000000..af21497a
--- /dev/null
+++ b/src/components/pages/closing/ClosingGeneralInformationTable.tsx
@@ -0,0 +1,100 @@
+import { ClosingGeneralInformation } from '@/types/api/closing';
+
+interface ClosingGeneralInformationProps {
+ initialValue?: ClosingGeneralInformation;
+}
+
+const ClosingGeneralInformationTable = ({
+ initialValue,
+}: ClosingGeneralInformationProps) => {
+ return (
+
+
+
+
+
+
+
+ | Lokasi |
+ : |
+ {initialValue?.location_name} |
+
+
+ | Periode |
+ : |
+ {initialValue?.period} |
+
+
+ | Kategori |
+ : |
+ {initialValue?.project_category} |
+
+
+ | Populasi |
+ : |
+ {initialValue?.population} Ekor |
+
+
+ | Jenis Project |
+ : |
+ {initialValue?.project_type} |
+
+
+ | Kandang Aktif |
+ : |
+ {initialValue?.active_house_count} Kandang |
+
+
+ | Status Pembayaran Penjualan |
+ : |
+ {initialValue?.sales_payment_status} |
+
+
+ | Status Project |
+ : |
+ {initialValue?.project_status} |
+
+
+ | Status Closing |
+ : |
+ {initialValue?.closing_status} |
+
+
+
+
+
+
+
+
+
+
+
+ | Kandang Aktif |
+ : |
+ {initialValue?.active_house_count} Kandang |
+
+
+ | Status Pembayaran Penjualan |
+ : |
+ {initialValue?.sales_payment_status} |
+
+
+ | Status Project |
+ : |
+ {initialValue?.project_status} |
+
+
+ | Status Closing |
+ : |
+ {initialValue?.closing_status} |
+
+
+
+
+
+
+ Sapronak Masuk
+
+
+
+
+
+
+ data={
+ isResponseSuccess(incomingSapronaks)
+ ? incomingSapronaks?.data
+ : []
+ }
+ columns={incomingSapronaksColumns}
+ pageSize={tableFilterState.pageSize}
+ onPageSizeChange={setPageSize}
+ rowOptions={[10, 20, 50, 100]}
+ page={
+ isResponseSuccess(incomingSapronaks)
+ ? incomingSapronaks?.meta?.page
+ : 0
+ }
+ totalItems={
+ isResponseSuccess(incomingSapronaks)
+ ? incomingSapronaks?.meta?.total_results
+ : 0
+ }
+ onPageChange={setPage}
+ isLoading={isLoadingIncomingSapronaks}
+ sorting={sorting}
+ setSorting={setSorting}
+ rowSelection={rowSelection}
+ setRowSelection={setRowSelection}
+ className={{
+ containerClassName: cn({
+ 'w-full mb-20':
+ isResponseSuccess(incomingSapronaks) &&
+ incomingSapronaks?.data?.length === 0,
+ }),
+ }}
+ />
+ Sapronak Keluar
+
+
+
+ }
+ className='w-full!'
+ titleClassName='w-full p-0!'
+ >
+
+
+
+
+ data={
+ isResponseSuccess(outgoingSapronaks)
+ ? outgoingSapronaks?.data
+ : []
+ }
+ columns={outgoingSapronaksColumns}
+ pageSize={tableFilterState.pageSize}
+ onPageSizeChange={setPageSize}
+ rowOptions={[10, 20, 50, 100]}
+ page={
+ isResponseSuccess(outgoingSapronaks)
+ ? outgoingSapronaks?.meta?.page
+ : 0
+ }
+ totalItems={
+ isResponseSuccess(outgoingSapronaks)
+ ? outgoingSapronaks?.meta?.total_results
+ : 0
+ }
+ onPageChange={setPage}
+ isLoading={isLoadingOutgoingSapronaks}
+ sorting={sorting}
+ setSorting={setSorting}
+ rowSelection={rowSelection}
+ setRowSelection={setRowSelection}
+ className={{
+ containerClassName: cn({
+ 'w-full mb-20':
+ isResponseSuccess(outgoingSapronaks) &&
+ outgoingSapronaks?.data?.length === 0,
+ }),
+ }}
+ />
+
+ {projectFlockId && (
+ <>
+
+
+
+
+ )}
+
+ );
+};
+
+export default ClosingSapronakTabContent;
diff --git a/src/components/pages/closing/ClosingsTable.tsx b/src/components/pages/closing/ClosingsTable.tsx
new file mode 100644
index 00000000..91e78c8c
--- /dev/null
+++ b/src/components/pages/closing/ClosingsTable.tsx
@@ -0,0 +1,299 @@
+'use client';
+
+import { ChangeEventHandler, useEffect, useState } from 'react';
+import useSWR from 'swr';
+import { CellContext, ColumnDef, SortingState } from '@tanstack/react-table';
+
+import { Icon } from '@iconify/react';
+import Table from '@/components/Table';
+import DebouncedTextInput from '@/components/input/DebouncedTextInput';
+import Button from '@/components/Button';
+import SelectInput, {
+ OptionType,
+ useSelect,
+} from '@/components/input/SelectInput';
+import RowDropdownOptions from '@/components/table/RowDropdownOptions';
+import RowCollapseOptions from '@/components/table/RowCollapseOptions';
+import RowOptionsMenuWrapper from '@/components/table/RowOptionsMenuWrapper';
+import { cn, formatCurrency, formatDate } from '@/lib/helper';
+import { isResponseSuccess } from '@/lib/api-helper';
+import { useTableFilter } from '@/services/hooks/useTableFilter';
+import { LocationApi } from '@/services/api/master-data';
+import { Location } from '@/types/api/master-data/location';
+import { ClosingApi } from '@/services/api/closing';
+import { Closing } from '@/types/api/closing';
+
+const PROJECT_STATUS_OPTIONS = [
+ {
+ value: 1,
+ label: 'Pengajuan',
+ },
+ {
+ value: 2,
+ label: 'Aktif',
+ },
+];
+
+const RowOptionsMenu = ({
+ type = 'dropdown',
+ props,
+}: {
+ type: 'dropdown' | 'collapse';
+ props: CellContext;
+}) => {
+ return (
+
+ {/* TODO: apply RBAC */}
+
+
+
+
+ );
+};
+
+const ClosingsTable = () => {
+ const {
+ state: tableFilterState,
+ updateFilter,
+ setPage,
+ setPageSize,
+ toQueryString: getTableFilterQueryString,
+ } = useTableFilter({
+ initial: {
+ search: '',
+ nameSort: '',
+ transactionDate: '',
+ realizationDate: '',
+ locationId: '',
+ projectStatus: '',
+ userId: '',
+ },
+ paramMap: {
+ page: 'page',
+ pageSize: 'limit',
+ nameSort: 'sort_name',
+ transactionDate: 'transaction_date',
+ realizationDate: 'realization_date',
+ locationId: 'location_id',
+ projectStatus: 'project_status',
+ userId: 'user_id',
+ },
+ });
+
+ const { data: closings, isLoading: isLoadingClosings } = useSWR(
+ `${ClosingApi.basePath}${getTableFilterQueryString()}`,
+ ClosingApi.getAllFetcher
+ );
+
+ const [sorting, setSorting] = useState([]);
+ const [rowSelection, setRowSelection] = useState>({});
+
+ const closingsColumns: ColumnDef[] = [
+ {
+ header: '#',
+ cell: (props) => props.row.index + 1,
+ },
+ {
+ accessorKey: 'location_name',
+ header: 'Lokasi',
+ },
+ {
+ accessorKey: 'project_category',
+ header: 'Kategori',
+ },
+ {
+ accessorKey: 'period',
+ header: 'Periode',
+ },
+ {
+ accessorKey: 'closing_date',
+ header: 'Periode',
+ cell: (props) =>
+ formatDate(props.row.original.closing_date, 'DD MMM YYYY'),
+ },
+ {
+ accessorKey: 'shed_label',
+ header: 'Jumlah Kandang',
+ },
+ {
+ accessorKey: 'sales_paid_amount',
+ header: 'Jumlah Sudah Bayar',
+ cell: (props) => (
+
+ {formatCurrency(props.row.original.sales_paid_amount)}
+
+ ),
+ },
+ {
+ accessorKey: 'sales_remaining_amount',
+ header: 'Jumlah Sisa Bayar',
+ cell: (props) => (
+
+ {formatCurrency(props.row.original.sales_remaining_amount)}
+
+ ),
+ },
+ {
+ accessorKey: 'sales_payment_status',
+ header: 'Status Pembayaran',
+ },
+ {
+ accessorKey: 'project_status',
+ header: 'Status',
+ },
+ {
+ header: 'Aksi',
+ cell: (props) => {
+ 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 - 3;
+
+ return (
+ <>
+ {currentPageSize > 3 && (
+
+
+
+ )}
+
+ {currentPageSize <= 3 && (
+
+
+
+ )}
+
+ );
+ },
+ },
+ ];
+
+ const {
+ setInputValue: setLocationInputValue,
+ options: locationOptions,
+ isLoadingOptions: isLoadingLocationOptions,
+ } = useSelect(LocationApi.basePath, 'id', 'name');
+
+ const [selectedLocation, setSelectedLocation] = useState(
+ null
+ );
+
+ const locationChangeHandler = (val: OptionType | OptionType[] | null) => {
+ setSelectedLocation(val as OptionType);
+ updateFilter(
+ 'locationId',
+ val ? ((val as OptionType).value as string) : ''
+ );
+ };
+
+ const [selectedProjectStatus, setSelectedProjectStatus] =
+ useState(null);
+
+ const projectStatusChangeHandler = (
+ val: OptionType | OptionType[] | null
+ ) => {
+ setSelectedProjectStatus(val as OptionType);
+ updateFilter(
+ 'projectStatus',
+ val ? ((val as OptionType).value as string) : ''
+ );
+ };
+
+ const searchChangeHandler: ChangeEventHandler = (e) => {
+ updateFilter('search', e.target.value);
+ };
+
+ // track sorting
+ useEffect(() => {
+ const isNameSorted = sorting.find((sortItem) => sortItem.id === 'name');
+
+ if (!isNameSorted) {
+ updateFilter('nameSort', '');
+ } else {
+ updateFilter('nameSort', isNameSorted.desc ? 'desc' : 'asc');
+ }
+ }, [sorting, updateFilter]);
+
+ return (
+ <>
+
+
+
+
+ data={isResponseSuccess(closings) ? closings?.data : []}
+ columns={closingsColumns}
+ pageSize={tableFilterState.pageSize}
+ onPageSizeChange={setPageSize}
+ rowOptions={[10, 20, 50, 100]}
+ page={isResponseSuccess(closings) ? closings?.meta?.page : 0}
+ totalItems={
+ isResponseSuccess(closings) ? closings?.meta?.total_results : 0
+ }
+ onPageChange={setPage}
+ isLoading={isLoadingClosings}
+ sorting={sorting}
+ setSorting={setSorting}
+ rowSelection={rowSelection}
+ setRowSelection={setRowSelection}
+ className={{
+ containerClassName: cn({
+ 'w-full mb-20':
+ isResponseSuccess(closings) && closings?.data?.length === 0,
+ }),
+ }}
+ />
+
| {pengajuanItem.nonstock.name} |
{pengajuanItem.qty} |
- {formatCurrency(pengajuanItem.total_price)} |
+ {formatCurrency(pengajuanItem.price)} |
{pengajuanItem.note ?? '-'} |
)
@@ -269,7 +269,7 @@ const ExpenseRealizationContent = ({
let expenseGrandTotal = 0;
kandangExpense.realisasi?.forEach(
- (item) => (expenseGrandTotal += item.total_price)
+ (item) => (expenseGrandTotal += item.price)
);
return (
@@ -300,7 +300,7 @@ const ExpenseRealizationContent = ({
| {realisasiItem.nonstock.name} |
{realisasiItem.qty} |
- {formatCurrency(realisasiItem.total_price)} |
+ {formatCurrency(realisasiItem.price)} |
{realisasiItem.note ?? '-'} |
)
diff --git a/src/components/pages/expense/ExpenseRequestContent.tsx b/src/components/pages/expense/ExpenseRequestContent.tsx
index af8ceddc..0d7d959d 100644
--- a/src/components/pages/expense/ExpenseRequestContent.tsx
+++ b/src/components/pages/expense/ExpenseRequestContent.tsx
@@ -402,7 +402,10 @@ const ExpenseRequestContent = ({
Tanggal Transaksi |
: |
- {formatDate(initialValues?.expense_date, 'DD MMMM YYYY')}
+ {formatDate(
+ initialValues?.transaction_date,
+ 'DD MMMM YYYY'
+ )}
|
|
| {pengajuanItem.nonstock.name} |
{pengajuanItem.qty} |
-
- {formatCurrency(pengajuanItem.total_price)}
- |
+ {formatCurrency(pengajuanItem.price)} |
{pengajuanItem.note ?? '-'}
|
diff --git a/src/components/pages/expense/ExpensesTable.tsx b/src/components/pages/expense/ExpensesTable.tsx
index 3a50f233..bbcb6c4e 100644
--- a/src/components/pages/expense/ExpensesTable.tsx
+++ b/src/components/pages/expense/ExpensesTable.tsx
@@ -263,11 +263,11 @@ const ExpensesTable = () => {
},
},
{
- accessorKey: 'expense_date',
+ accessorKey: 'transaction_date',
header: 'Tanggal Pengajuan',
cell: (props) =>
- props.row.original.expense_date
- ? formatDate(props.row.original.expense_date, 'DD MMM YYYY')
+ props.row.original.transaction_date
+ ? formatDate(props.row.original.transaction_date, 'DD MMM YYYY')
: '-',
},
{
diff --git a/src/components/pages/expense/form/ExpenseRealizationForm.schema.ts b/src/components/pages/expense/form/ExpenseRealizationForm.schema.ts
index 863238b9..77db761c 100644
--- a/src/components/pages/expense/form/ExpenseRealizationForm.schema.ts
+++ b/src/components/pages/expense/form/ExpenseRealizationForm.schema.ts
@@ -27,7 +27,7 @@ type ExpenseRealizationFormSchemaType = {
label: string;
};
quantity?: number;
- total_cost?: number;
+ price?: number;
notes?: string;
}[];
}[];
@@ -82,7 +82,7 @@ export const ExpenseRealizationFormSchema: Yup.ObjectSchema {
realization.cost_items.forEach((costItem) => {
- const unitPrice =
- parseFloat(String(costItem.total_cost)) /
- parseFloat(String(costItem.quantity));
-
const realizationItem = {
expense_nonstock_id: costItem.nonstock?.value as number,
qty: parseFloat(String(costItem.quantity)) as number,
- unit_price: unitPrice,
- total_price: parseFloat(String(costItem.total_cost)) as number,
+ price: parseFloat(String(costItem.price)) as number,
notes: costItem.notes ?? '',
};
@@ -177,7 +172,7 @@ const ExpenseRealizationForm = ({
{
nonstock: undefined,
quantity: undefined,
- total_cost: undefined,
+ price: undefined,
notes: '',
},
],
diff --git a/src/components/pages/expense/form/ExpenseRealizationKandangDetailExpense.tsx b/src/components/pages/expense/form/ExpenseRealizationKandangDetailExpense.tsx
index 8b889c5b..017a733e 100644
--- a/src/components/pages/expense/form/ExpenseRealizationKandangDetailExpense.tsx
+++ b/src/components/pages/expense/form/ExpenseRealizationKandangDetailExpense.tsx
@@ -48,7 +48,7 @@ const ExpenseRealizationKandangDetailExpense: React.FC<
};
const isExpenseRepeaterInputError = (
- column: 'nonstock' | 'quantity' | 'total_cost' | 'notes',
+ column: 'nonstock' | 'quantity' | 'price' | 'notes',
kandangExpenseIdx: number,
expenseIdx: number
) => {
@@ -112,7 +112,7 @@ const ExpenseRealizationKandangDetailExpense: React.FC<
| Nonstock |
Total Kuantitas |
- Total Biaya |
+ Harga Satuan |
Catatan |
@@ -163,17 +163,17 @@ const ExpenseRealizationKandangDetailExpense: React.FC<
=
documents: Yup.array().of(Yup.mixed().required()).optional(),
- cost_per_kandangs: Yup.array()
+ expense_nonstocks: Yup.array()
.of(
Yup.object({
kandang_id: Yup.number().min(1, 'Wajib memilih kandang!').required(),
@@ -86,7 +86,7 @@ export const ExpenseRequestFormSchema: Yup.ObjectSchema =
label: Yup.string().required(),
}).required('Nonstock wajib diisi!'),
quantity: Yup.number().required('Total kuantitas wajib diisi!'),
- total_cost: Yup.number().required('Total biaya wajib diisi!'),
+ price: Yup.number().required('Harga satuan wajib diisi!'),
notes: Yup.string(),
})
)
@@ -128,8 +128,8 @@ export const getExpenseFormInitialValues = (
label: initialValues.location.name,
}
: undefined,
- transaction_date: initialValues?.expense_date
- ? formatDate(initialValues.expense_date, 'YYYY-MM-DD')
+ transaction_date: initialValues?.transaction_date
+ ? formatDate(initialValues.transaction_date, 'YYYY-MM-DD')
: undefined,
kandangs: initialValues?.kandangs.map((kandang) => ({
id: kandang.kandang_id,
@@ -148,7 +148,7 @@ export const getExpenseFormInitialValues = (
})),
deleted_documents: [],
documents: [],
- cost_per_kandangs: initialValues?.kandangs
+ expense_nonstocks: initialValues?.kandangs
? initialValues.kandangs.map((kandangExpense) => ({
kandang_id: kandangExpense.kandang_id,
cost_items: kandangExpense.pengajuans
@@ -158,7 +158,7 @@ export const getExpenseFormInitialValues = (
label: expenseItem.nonstock.name,
},
quantity: expenseItem.qty,
- total_cost: expenseItem.total_price,
+ price: expenseItem.price,
notes: expenseItem.note,
}))
: [],
diff --git a/src/components/pages/expense/form/ExpenseRequestForm.tsx b/src/components/pages/expense/form/ExpenseRequestForm.tsx
index e47f2f76..d52bde0d 100644
--- a/src/components/pages/expense/form/ExpenseRequestForm.tsx
+++ b/src/components/pages/expense/form/ExpenseRequestForm.tsx
@@ -110,12 +110,12 @@ const ExpenseRequestForm = ({
transaction_date: values?.transaction_date as string,
supplier_id: values.supplier?.value as number,
documents: values.documents as File[],
- cost_per_kandangs: values.cost_per_kandangs.map((costPerKandang) => ({
- kandang_id: costPerKandang.kandang_id,
- cost_items: costPerKandang.cost_items.map((costItem) => ({
+ expense_nonstocks: values.expense_nonstocks.map((expenseNonstock) => ({
+ kandang_id: expenseNonstock.kandang_id,
+ cost_items: expenseNonstock.cost_items.map((costItem) => ({
nonstock_id: costItem.nonstock?.value as number,
quantity: parseFloat(String(costItem.quantity)) as number,
- total_cost: parseFloat(String(costItem.total_cost)) as number,
+ price: parseFloat(String(costItem.price)) as number,
notes: costItem.notes ?? '',
})),
})),
@@ -132,13 +132,13 @@ const ExpenseRequestForm = ({
transaction_date: values?.transaction_date as string,
supplier_id: values.supplier?.value as number,
documents: values.documents as File[],
- cost_per_kandang: values.cost_per_kandangs.map(
- (costPerKandang) => ({
- kandang_id: costPerKandang.kandang_id,
- cost_items: costPerKandang.cost_items.map((costItem) => ({
+ expense_nonstocks: values.expense_nonstocks.map(
+ (expenseNonstock) => ({
+ kandang_id: expenseNonstock.kandang_id,
+ cost_items: expenseNonstock.cost_items.map((costItem) => ({
nonstock_id: costItem.nonstock?.value as number,
quantity: parseFloat(String(costItem.quantity)) as number,
- total_cost: parseFloat(String(costItem.total_cost)) as number,
+ price: parseFloat(String(costItem.price)) as number,
notes: costItem.notes ?? '',
})),
})
@@ -179,53 +179,54 @@ const ExpenseRequestForm = ({
formik.setFieldValue('location', val);
formik.setFieldValue('kandangs', []);
- formik.setFieldValue('cost_per_kandangs', []);
+ formik.setFieldValue('expense_nonstocks', []);
};
const kandangsChangeHandler = (kandangs: { id: number; name: string }[]) => {
formik.setFieldTouched('kandangs', true);
formik.setFieldValue('kandangs', kandangs);
- const newCostPerKandangs = [...(formik.values.cost_per_kandangs ?? [])];
+ const newExpenseNonstocks = [...(formik.values.expense_nonstocks ?? [])];
- // add new cost_per_kandangs
+ // add new expense_nonstocks
kandangs.forEach((kandangItem) => {
- const isKandangExistInCostPerKandangs = newCostPerKandangs.find(
- (costPerKandangItem) => costPerKandangItem.kandang_id === kandangItem.id
+ const isKandangExistInExpenseNonstocks = newExpenseNonstocks.find(
+ (expenseNonstockItem) =>
+ expenseNonstockItem.kandang_id === kandangItem.id
);
- if (isKandangExistInCostPerKandangs) return;
+ if (isKandangExistInExpenseNonstocks) return;
- newCostPerKandangs.push({
+ newExpenseNonstocks.push({
kandang_id: kandangItem.id,
cost_items: [
{
nonstock: undefined,
quantity: undefined,
- total_cost: undefined,
+ price: undefined,
notes: '',
},
],
});
});
- // prune cost_per_kandangs
+ // prune expense_nonstocks
const kandangIds = new Set(kandangs.map((kandang) => kandang.id));
- const deletedCostPerKandangsIdx: number[] = [];
+ const deletedExpenseNonstocksIdx: number[] = [];
- newCostPerKandangs.forEach((costPerKandang, idx) => {
- const isCostPerKandangValid = kandangIds.has(costPerKandang.kandang_id);
+ newExpenseNonstocks.forEach((expenseNonstock, idx) => {
+ const isExpenseNonstockValid = kandangIds.has(expenseNonstock.kandang_id);
- if (!isCostPerKandangValid) {
- deletedCostPerKandangsIdx.push(idx);
+ if (!isExpenseNonstockValid) {
+ deletedExpenseNonstocksIdx.push(idx);
}
});
- deletedCostPerKandangsIdx.forEach((deletedCostPerKandangIdx) => {
- newCostPerKandangs.splice(deletedCostPerKandangIdx, 1);
+ deletedExpenseNonstocksIdx.forEach((deletedExpenseNonstockIdx) => {
+ newExpenseNonstocks.splice(deletedExpenseNonstockIdx, 1);
});
- formik.setFieldValue('cost_per_kandangs', newCostPerKandangs);
+ formik.setFieldValue('expense_nonstocks', newExpenseNonstocks);
};
const supplierChangeHandler = (val: OptionType | OptionType[] | null) => {
diff --git a/src/components/pages/expense/form/ExpenseRequestKandangDetailExpense.tsx b/src/components/pages/expense/form/ExpenseRequestKandangDetailExpense.tsx
index 73e6c9b7..11f54585 100644
--- a/src/components/pages/expense/form/ExpenseRequestKandangDetailExpense.tsx
+++ b/src/components/pages/expense/form/ExpenseRequestKandangDetailExpense.tsx
@@ -41,28 +41,28 @@ const ExpenseRequestKandangDetailExpense: React.FC<
val: OptionType | OptionType[] | null
) => {
formik.setFieldTouched(
- `cost_per_kandangs[${kandangExpenseIdx}].cost_items[${expenseIdx}].nonstock`,
+ `expense_nonstocks[${kandangExpenseIdx}].cost_items[${expenseIdx}].nonstock`,
true
);
formik.setFieldValue(
- `cost_per_kandangs[${kandangExpenseIdx}].cost_items[${expenseIdx}].nonstock`,
+ `expense_nonstocks[${kandangExpenseIdx}].cost_items[${expenseIdx}].nonstock`,
val
);
};
const addExpenseItemHandler = (kandangExpenseIdx: number) => {
const newExpensesValue = [
- ...formik.values.cost_per_kandangs[kandangExpenseIdx].cost_items,
+ ...formik.values.expense_nonstocks[kandangExpenseIdx].cost_items,
{
nonstock: undefined,
- total_cost: undefined,
+ price: undefined,
quantity: undefined,
notes: '',
},
];
formik.setFieldValue(
- `cost_per_kandangs[${kandangExpenseIdx}].cost_items`,
+ `expense_nonstocks[${kandangExpenseIdx}].cost_items`,
newExpensesValue
);
};
@@ -71,28 +71,28 @@ const ExpenseRequestKandangDetailExpense: React.FC<
kandangExpenseIdx: number,
expenseIdx: number
) => {
- const path = `cost_per_kandangs[${kandangExpenseIdx}].cost_items`;
+ const path = `expense_nonstocks[${kandangExpenseIdx}].cost_items`;
// trims values, errors, and touched at expenseIdx
removeArrayItemAndSync(formik, path, expenseIdx);
};
const isExpenseRepeaterInputError = (
- column: 'nonstock' | 'quantity' | 'total_cost' | 'notes',
+ column: 'nonstock' | 'quantity' | 'price' | 'notes',
kandangExpenseIdx: number,
expenseIdx: number
) => {
return (
- formik.touched.cost_per_kandangs?.[kandangExpenseIdx]?.cost_items?.[
+ formik.touched.expense_nonstocks?.[kandangExpenseIdx]?.cost_items?.[
expenseIdx
]?.[column] &&
Boolean(
- formik.errors.cost_per_kandangs?.[kandangExpenseIdx] instanceof
+ formik.errors.expense_nonstocks?.[kandangExpenseIdx] instanceof
Object &&
- formik.errors.cost_per_kandangs?.[kandangExpenseIdx].cost_items?.[
+ formik.errors.expense_nonstocks?.[kandangExpenseIdx].cost_items?.[
expenseIdx
] instanceof Object &&
- formik.errors.cost_per_kandangs?.[kandangExpenseIdx].cost_items?.[
+ formik.errors.expense_nonstocks?.[kandangExpenseIdx].cost_items?.[
expenseIdx
]?.[column]
)
@@ -113,7 +113,7 @@ const ExpenseRequestKandangDetailExpense: React.FC<
- {(formik.values.cost_per_kandangs.length === 0 ||
+ {(formik.values.expense_nonstocks.length === 0 ||
!formik.values.supplier?.value) && (
@@ -122,9 +122,9 @@ const ExpenseRequestKandangDetailExpense: React.FC<
)}
- {formik.values.cost_per_kandangs.length > 0 &&
+ {formik.values.expense_nonstocks.length > 0 &&
formik.values.supplier?.value &&
- formik.values.cost_per_kandangs.map(
+ formik.values.expense_nonstocks.map(
(kandangExpense, kandangExpenseIdx) => {
const kandangName = formik.values.kandangs?.find(
(kandang) => kandang.id === kandangExpense.kandang_id
@@ -147,7 +147,7 @@ const ExpenseRequestKandangDetailExpense: React.FC<
| Nonstock |
Total Kuantitas |
- Total Biaya |
+ Harga Satuan |
Catatan |
{type !== 'detail' && Aksi | }
@@ -178,10 +178,10 @@ const ExpenseRequestKandangDetailExpense: React.FC<
{
{ label: 'Vendor', value: expense?.supplier.name },
{
label: 'Tanggal Transaksi',
- value: formatDate(expense?.expense_date, 'DD MMMM YYYY'),
+ value: formatDate(expense?.transaction_date, 'DD MMMM YYYY'),
},
{
label: 'Tanggal Realisasi',
@@ -326,7 +326,7 @@ const ExpensePDF = ({ expense }: ExpensePDFProps) => {
let expenseRequestTotal = 0;
kandangExpense.pengajuans?.forEach(
- (item) => (expenseRequestTotal += item.total_price)
+ (item) => (expenseRequestTotal += item.price)
);
return (
@@ -374,7 +374,7 @@ const ExpensePDF = ({ expense }: ExpensePDFProps) => {
- Total Biaya
+ Harga Satuan
{
]}
>
- {formatCurrency(pengajuan.total_price)}
+ {formatCurrency(pengajuan.price)}
{
let expenseRealizationTotal = 0;
kandangExpense.realisasi?.forEach(
- (item) => (expenseRealizationTotal += item.total_price)
+ (item) => (expenseRealizationTotal += item.price)
);
return (
@@ -532,7 +532,7 @@ const ExpensePDF = ({ expense }: ExpensePDFProps) => {
- Total Biaya
+ Harga Satuan
{
]}
>
- {formatCurrency(realisasi.total_price)}
+ {formatCurrency(realisasi.price)}
new Promise((resolve) => setTimeout(resolve, ms));
export const formatDate = (date: moment.MomentInput, format?: string) => {
+ if (!date) return '-';
+
return moment(date).format(format);
};
@@ -127,3 +129,16 @@ export const convertRowSelectionObjToArr = (
return result;
};
+
+export const isPathActive = (pathname: string, link?: string) => {
+ if (!link) return false;
+
+ const splittedPathname = pathname.split('/');
+ const splittedLink = link.split('/');
+
+ const isActiveLinkValid = splittedLink.every((linkChunk, idx) => {
+ return linkChunk === splittedPathname[idx];
+ });
+
+ return pathname.startsWith(link) && isActiveLinkValid;
+};
diff --git a/src/services/api/closing.ts b/src/services/api/closing.ts
new file mode 100644
index 00000000..041108d0
--- /dev/null
+++ b/src/services/api/closing.ts
@@ -0,0 +1,54 @@
+import axios from 'axios';
+
+import { BaseApiService } from '@/services/api/base';
+import {
+ Closing,
+ ClosingGeneralInformation,
+ ClosingIncomingSapronak,
+ ClosingOutgoingSapronak,
+} from '@/types/api/closing';
+import { httpClient, httpClientFetcher } from '@/services/http/client';
+import { BaseApiResponse } from '@/types/api/api-general';
+
+export class ClosingApiService extends BaseApiService {
+ constructor(basePath: string) {
+ super(basePath);
+ }
+
+ async getAllIncomingSapronakFetcher(
+ endpoint: string
+ ): Promise> {
+ return await httpClientFetcher>(
+ endpoint
+ );
+ }
+
+ async getAllOutgoingSapronakFetcher(
+ endpoint: string
+ ): Promise> {
+ return await httpClientFetcher>(
+ endpoint
+ );
+ }
+
+ async getGeneralInfo(id: number) {
+ try {
+ const getGeneralInfoPath = `${this.basePath}/${id}`;
+ const getGeneralInfoRes =
+ await httpClient>(
+ getGeneralInfoPath
+ );
+
+ return getGeneralInfoRes;
+ } catch (error) {
+ if (
+ axios.isAxiosError>(error)
+ ) {
+ return error.response?.data;
+ }
+ return undefined;
+ }
+ }
+}
+
+export const ClosingApi = new ClosingApiService('/closing');
diff --git a/src/services/api/expense.ts b/src/services/api/expense.ts
index 337730e6..44a855f4 100644
--- a/src/services/api/expense.ts
+++ b/src/services/api/expense.ts
@@ -492,8 +492,8 @@ export class ExpenseApiService extends BaseApiService<
});
formData.append(
- 'cost_per_kandangs',
- JSON.stringify(payload.cost_per_kandangs)
+ 'expense_nonstocks',
+ JSON.stringify(payload.expense_nonstocks)
);
return formData;
@@ -514,8 +514,8 @@ export class ExpenseApiService extends BaseApiService<
});
formData.append(
- 'cost_per_kandang',
- JSON.stringify(payload.cost_per_kandang)
+ 'expense_nonstocks',
+ JSON.stringify(payload.expense_nonstocks)
);
return formData;
diff --git a/src/styles/daisyui.css b/src/styles/daisyui.css
index fc87399f..8eca2c82 100644
--- a/src/styles/daisyui.css
+++ b/src/styles/daisyui.css
@@ -1,4 +1,9 @@
@layer utilities {
+ .menu {
+ --menu-active-fg: var(--color-primary);
+ --menu-active-bg: transparent;
+ }
+
.step.step-success::before {
--step-bg: var(--color-success);
--step-fg: var(--color-success-content);
diff --git a/src/types/api/closing.d.ts b/src/types/api/closing.d.ts
new file mode 100644
index 00000000..3f7ba816
--- /dev/null
+++ b/src/types/api/closing.d.ts
@@ -0,0 +1,55 @@
+import { Area } from '@/types/api/master-data/area';
+import { Fcr } from '@/types/api/master-data/fcr';
+import { Flock } from '@/types/api/master-data/flock';
+import { Kandang } from '@/types/api/master-data/kandang';
+import { Location } from '@/types/api/master-data/location';
+import { BaseApproval, BaseMetadata } from '@/types/api/api-general';
+
+export type BaseClosing = {
+ id: number;
+ location_id: number;
+ location_name: string;
+ project_category: 'GROWING' | 'LAYING';
+ period: number;
+ closing_date?: string;
+ shed_label: string;
+ shed_count: number;
+ sales_paid_amount: number;
+ sales_remaining_amount: number;
+ sales_payment_status: string;
+ project_status: 'Pengajuan' | 'Aktif' | 'Selesai';
+};
+
+export type Closing = BaseMetadata & BaseClosing;
+
+export type BaseClosingGeneralInformation = BaseClosing & {
+ flock_id: number;
+ period: number;
+ project_type: 'GROWING' | 'LAYING';
+ population: number;
+ active_house_count: number;
+ sales_payment_status: string;
+ project_status: 'Pengajuan' | 'Aktif' | 'Selesai';
+ closing_status: string;
+};
+
+export type ClosingGeneralInformation = BaseMetadata &
+ BaseClosingGeneralInformation;
+
+export type ClosingIncomingSapronak = {
+ id: number;
+ date: string;
+ reference_number: string;
+ transaction_type: string;
+ product_name: string;
+ product_category: string;
+ product_sub_category: string;
+ source_warehouse: string;
+ destination_warehouse: string;
+ quantity: number;
+ unit: string;
+ formatted_quantity: string;
+ notes: string;
+};
+
+export type ClosingOutgoingSapronak = ClosingIncomingSapronak;
diff --git a/src/types/api/expense.d.ts b/src/types/api/expense.d.ts
index 71863503..a62066ba 100644
--- a/src/types/api/expense.d.ts
+++ b/src/types/api/expense.d.ts
@@ -18,7 +18,7 @@ export type BaseExpense = {
id: number;
path: string;
}[];
- expense_date: string;
+ transaction_date: string;
realization_date?: string;
grand_total: number;
location: BaseLocation;
@@ -29,28 +29,23 @@ export type BaseExpense = {
name: string;
pengajuans?: {
id: number;
+ expense_id: number;
+ kandang_id: number;
+ nonstock_id: number;
qty: number;
- unit_price: number;
- total_price: number;
+ price: number;
note?: string;
nonstock: Pick;
- project_flock_kandang: {
- id: number;
- kandang_id: number;
- };
+ created_at: string;
}[];
realisasi?: {
id: number;
+ expense_nonstock_id: number;
qty: number;
- unit_price: number;
- total_price: number;
- date: string;
+ price: number;
note?: string;
nonstock: Pick;
- project_flock_kandang: {
- id: number;
- kandang_id: number;
- };
+ created_at: string;
}[];
}[];
total_pengajuan: number;
@@ -65,12 +60,12 @@ export type CreateExpensePayload = {
transaction_date: string;
supplier_id: number;
documents: File[];
- cost_per_kandangs: {
+ expense_nonstocks: {
kandang_id: number;
cost_items: {
nonstock_id: number;
quantity: number;
- total_cost: number;
+ price: number;
notes: string;
}[];
}[];
@@ -81,12 +76,12 @@ export type UpdateExpensePayload = {
transaction_date: string;
supplier_id: number;
documents: File[];
- cost_per_kandang: {
+ expense_nonstocks: {
kandang_id: number;
cost_items: {
nonstock_id: number;
quantity: number;
- total_cost: number;
+ price: number;
notes: string;
}[];
}[];
@@ -98,8 +93,7 @@ export type CreateExpenseRealizationPayload = {
realizations: {
expense_nonstock_id: number;
qty: number;
- unit_price: number;
- total_price: number;
+ price: number;
notes: string;
}[];
};
diff --git a/src/types/theme.d.ts b/src/types/theme.d.ts
index f83750e4..dcd9e13f 100644
--- a/src/types/theme.d.ts
+++ b/src/types/theme.d.ts
@@ -1,4 +1,4 @@
-type Color =
+export type Color =
| 'primary'
| 'secondary'
| 'accent'
@@ -9,4 +9,4 @@ type Color =
| 'error'
| 'none';
-export { Color };
+export type Size = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
| |