mirror of
https://gitlab.com/mbugroup/lti-web-client.git
synced 2026-05-20 13:32:00 +00:00
merge: resolve conflict
This commit is contained in:
rstubryan
@@ -64,7 +64,10 @@ export const FormActions = <T,>({
|
||||
type='reset'
|
||||
color='warning'
|
||||
className='px-4'
|
||||
onClick={formik.handleReset}
|
||||
onClick={() => {
|
||||
formik.handleReset();
|
||||
formik.validateForm();
|
||||
}}
|
||||
>
|
||||
Reset
|
||||
</Button>
|
||||
|
||||
@@ -1,355 +1,56 @@
|
||||
'use client';
|
||||
|
||||
import { useState, useMemo } from 'react';
|
||||
import { useState } from 'react';
|
||||
import useSWR from 'swr';
|
||||
import { SortingState } from '@tanstack/react-table';
|
||||
import { Icon } from '@iconify/react';
|
||||
|
||||
import Table from '@/components/Table';
|
||||
import { useModal } from '@/components/Modal';
|
||||
import ConfirmationModal from '@/components/modal/ConfirmationModal';
|
||||
import { ROWS_OPTIONS } from '@/config/constant';
|
||||
import { Movement } from '@/types/api/inventory/movement';
|
||||
import { MovementApi } from '@/services/api/inventory';
|
||||
import { cn } from '@/lib/helper';
|
||||
import { isResponseSuccess } from '@/lib/api-helper';
|
||||
import { useTableFilter } from '@/services/hooks/useTableFilter';
|
||||
import { ROWS_OPTIONS } from '@/config/constant';
|
||||
import { TableToolbar } from '@/components/table/TableToolbar';
|
||||
import { TableRowSizeSelector } from '@/components/table/TableRowSizeSelector';
|
||||
import { TableRowOptions } from '@/components/table/TableRowOptions';
|
||||
import { OptionType } from '@/components/input/SelectInput';
|
||||
import Button from '@/components/Button';
|
||||
import { cn } from '@/lib/helper';
|
||||
|
||||
// Dummy data
|
||||
const baseMetadata = {
|
||||
created_user: {
|
||||
id: 1,
|
||||
id_user: 1,
|
||||
email: 'user@example.com',
|
||||
name: 'User',
|
||||
},
|
||||
created_at: '2024-06-01T00:00:00Z',
|
||||
updated_at: '2024-06-01T00:00:00Z',
|
||||
};
|
||||
|
||||
const dummyMovements: Movement[] = [
|
||||
{
|
||||
...baseMetadata,
|
||||
id: 1,
|
||||
alasan_transfer: 'Restock',
|
||||
tanggal_transfer: '2024-06-01',
|
||||
warehouse_asal: {
|
||||
...baseMetadata,
|
||||
id: 1,
|
||||
name: 'Warehouse A',
|
||||
type: 'AREA',
|
||||
area: { id: 1, name: 'Area 1' },
|
||||
},
|
||||
warehouse_tujuan: {
|
||||
...baseMetadata,
|
||||
id: 2,
|
||||
name: 'Warehouse B',
|
||||
type: 'AREA',
|
||||
area: { id: 2, name: 'Area 2' },
|
||||
},
|
||||
product: [
|
||||
{
|
||||
product: {
|
||||
...baseMetadata,
|
||||
id: 1,
|
||||
name: 'Product X',
|
||||
brand: 'Brand X',
|
||||
sku: 'SKU-X',
|
||||
product_price: 10000,
|
||||
selling_price: 12000,
|
||||
tax: 10,
|
||||
expiry_period: 365,
|
||||
uom: {
|
||||
...baseMetadata,
|
||||
id: 1,
|
||||
name: 'PCS',
|
||||
},
|
||||
product_category: {
|
||||
...baseMetadata,
|
||||
id: 1,
|
||||
code: 'CAT-1',
|
||||
name: 'Category 1',
|
||||
},
|
||||
suppliers: [],
|
||||
flags: [],
|
||||
},
|
||||
qty_product: 10,
|
||||
},
|
||||
],
|
||||
ekspedisi: [
|
||||
{
|
||||
product_id: 1,
|
||||
qty: 10,
|
||||
supplier: {
|
||||
...baseMetadata,
|
||||
id: 1,
|
||||
name: 'Supplier 1',
|
||||
alias: 'S1',
|
||||
category: 'General',
|
||||
pic: 'PIC 1',
|
||||
type: 'Type 1',
|
||||
hatchery: 'Hatchery 1',
|
||||
phone: '08123456789',
|
||||
email: 'supplier1@example.com',
|
||||
address: 'Address 1',
|
||||
npwp: '1234567890123456',
|
||||
account_number: '1234567890',
|
||||
balance: 0,
|
||||
due_date: 30,
|
||||
},
|
||||
plat_nomor: 'B 1234 CD',
|
||||
no_surat_jalan: 'SJ-001',
|
||||
dokumen: 'doc1.pdf',
|
||||
biaya_ekspedisi: 50000,
|
||||
nama_sopir: 'Andi',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
...baseMetadata,
|
||||
id: 2,
|
||||
alasan_transfer: 'Mutasi Stok',
|
||||
tanggal_transfer: '2024-06-02',
|
||||
warehouse_asal: {
|
||||
...baseMetadata,
|
||||
id: 2,
|
||||
name: 'Warehouse B',
|
||||
type: 'AREA',
|
||||
area: { id: 2, name: 'Area 2' },
|
||||
},
|
||||
warehouse_tujuan: {
|
||||
...baseMetadata,
|
||||
id: 3,
|
||||
name: 'Warehouse C',
|
||||
type: 'AREA',
|
||||
area: { id: 3, name: 'Area 3' },
|
||||
},
|
||||
product: [
|
||||
{
|
||||
product: {
|
||||
...baseMetadata,
|
||||
id: 2,
|
||||
name: 'Product Y',
|
||||
brand: 'Brand Y',
|
||||
sku: 'SKU-Y',
|
||||
product_price: 20000,
|
||||
selling_price: 25000,
|
||||
tax: 5,
|
||||
expiry_period: 180,
|
||||
uom: {
|
||||
...baseMetadata,
|
||||
id: 2,
|
||||
name: 'BOX',
|
||||
},
|
||||
product_category: {
|
||||
...baseMetadata,
|
||||
id: 2,
|
||||
code: 'CAT-2',
|
||||
name: 'Category 2',
|
||||
},
|
||||
suppliers: [],
|
||||
flags: [],
|
||||
},
|
||||
qty_product: 5,
|
||||
},
|
||||
],
|
||||
ekspedisi: [
|
||||
{
|
||||
product_id: 2,
|
||||
qty: 5,
|
||||
supplier: {
|
||||
...baseMetadata,
|
||||
id: 2,
|
||||
name: 'Supplier 2',
|
||||
alias: 'S2',
|
||||
category: 'Special',
|
||||
pic: 'PIC 2',
|
||||
type: 'Type 2',
|
||||
hatchery: 'Hatchery 2',
|
||||
phone: '08123456780',
|
||||
email: 'supplier2@example.com',
|
||||
address: 'Address 2',
|
||||
npwp: '1234567890123457',
|
||||
account_number: '1234567891',
|
||||
balance: 1000,
|
||||
due_date: 15,
|
||||
},
|
||||
plat_nomor: 'D 5678 EF',
|
||||
no_surat_jalan: 'SJ-002',
|
||||
dokumen: 'doc2.pdf',
|
||||
biaya_ekspedisi: 60000,
|
||||
nama_sopir: 'Budi',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
...baseMetadata,
|
||||
id: 3,
|
||||
alasan_transfer: 'Pengembalian',
|
||||
tanggal_transfer: '2024-06-03',
|
||||
warehouse_asal: {
|
||||
...baseMetadata,
|
||||
id: 3,
|
||||
name: 'Warehouse C',
|
||||
type: 'AREA',
|
||||
area: { id: 3, name: 'Area 3' },
|
||||
},
|
||||
warehouse_tujuan: {
|
||||
...baseMetadata,
|
||||
id: 1,
|
||||
name: 'Warehouse A',
|
||||
type: 'AREA',
|
||||
area: { id: 1, name: 'Area 1' },
|
||||
},
|
||||
product: [
|
||||
{
|
||||
product: {
|
||||
...baseMetadata,
|
||||
id: 3,
|
||||
name: 'Product Z',
|
||||
brand: 'Brand Z',
|
||||
sku: 'SKU-Z',
|
||||
product_price: 15000,
|
||||
selling_price: 18000,
|
||||
tax: 8,
|
||||
expiry_period: 90,
|
||||
uom: {
|
||||
...baseMetadata,
|
||||
id: 3,
|
||||
name: 'KG',
|
||||
},
|
||||
product_category: {
|
||||
...baseMetadata,
|
||||
id: 3,
|
||||
code: 'CAT-3',
|
||||
name: 'Category 3',
|
||||
},
|
||||
suppliers: [],
|
||||
flags: [],
|
||||
},
|
||||
qty_product: 8,
|
||||
},
|
||||
],
|
||||
ekspedisi: [
|
||||
{
|
||||
product_id: 3,
|
||||
qty: 8,
|
||||
supplier: {
|
||||
...baseMetadata,
|
||||
id: 3,
|
||||
name: 'Supplier 3',
|
||||
alias: 'S3',
|
||||
category: 'Return',
|
||||
pic: 'PIC 3',
|
||||
type: 'Type 3',
|
||||
hatchery: 'Hatchery 3',
|
||||
phone: '08123456781',
|
||||
email: 'supplier3@example.com',
|
||||
address: 'Address 3',
|
||||
npwp: '1234567890123458',
|
||||
account_number: '1234567892',
|
||||
balance: 500,
|
||||
due_date: 10,
|
||||
},
|
||||
plat_nomor: 'F 9101 GH',
|
||||
no_surat_jalan: 'SJ-003',
|
||||
dokumen: 'doc3.pdf',
|
||||
biaya_ekspedisi: 40000,
|
||||
nama_sopir: 'Cici',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
...baseMetadata,
|
||||
id: 4,
|
||||
alasan_transfer: 'Transfer Internal',
|
||||
tanggal_transfer: '2024-06-04',
|
||||
warehouse_asal: {
|
||||
...baseMetadata,
|
||||
id: 4,
|
||||
name: 'Warehouse D',
|
||||
type: 'AREA',
|
||||
area: { id: 4, name: 'Area 4' },
|
||||
},
|
||||
warehouse_tujuan: {
|
||||
...baseMetadata,
|
||||
id: 5,
|
||||
name: 'Warehouse E',
|
||||
type: 'AREA',
|
||||
area: { id: 5, name: 'Area 5' },
|
||||
},
|
||||
product: [
|
||||
{
|
||||
product: {
|
||||
...baseMetadata,
|
||||
id: 4,
|
||||
name: 'Product A',
|
||||
brand: 'Brand A',
|
||||
sku: 'SKU-A',
|
||||
product_price: 5000,
|
||||
selling_price: 7000,
|
||||
tax: 0,
|
||||
expiry_period: 60,
|
||||
uom: {
|
||||
...baseMetadata,
|
||||
id: 4,
|
||||
name: 'LITER',
|
||||
},
|
||||
product_category: {
|
||||
...baseMetadata,
|
||||
id: 4,
|
||||
code: 'CAT-4',
|
||||
name: 'Category 4',
|
||||
},
|
||||
suppliers: [],
|
||||
flags: [],
|
||||
},
|
||||
qty_product: 20,
|
||||
},
|
||||
],
|
||||
ekspedisi: [
|
||||
{
|
||||
product_id: 4,
|
||||
qty: 20,
|
||||
supplier: {
|
||||
...baseMetadata,
|
||||
id: 4,
|
||||
name: 'Supplier 4',
|
||||
alias: 'S4',
|
||||
category: 'Internal',
|
||||
pic: 'PIC 4',
|
||||
type: 'Type 4',
|
||||
hatchery: 'Hatchery 4',
|
||||
phone: '08123456782',
|
||||
email: 'supplier4@example.com',
|
||||
address: 'Address 4',
|
||||
npwp: '1234567890123459',
|
||||
account_number: '1234567893',
|
||||
balance: 200,
|
||||
due_date: 20,
|
||||
},
|
||||
plat_nomor: 'H 2345 IJ',
|
||||
no_surat_jalan: 'SJ-004',
|
||||
dokumen: 'doc4.pdf',
|
||||
biaya_ekspedisi: 30000,
|
||||
nama_sopir: 'Dedi',
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
import RowDropdownOptions from '@/components/table/RowDropdownOptions';
|
||||
import RowCollapseOptions from '@/components/table/RowCollapseOptions';
|
||||
import { TableRowOptions } from '@/components/table/TableRowOptions';
|
||||
|
||||
const MovementTable = () => {
|
||||
const [search, setSearch] = useState('');
|
||||
const [page, setPage] = useState(1);
|
||||
const [pageSize, setPageSize] = useState(10);
|
||||
const {
|
||||
state: tableFilterState,
|
||||
updateFilter,
|
||||
setPage,
|
||||
setPageSize,
|
||||
toQueryString: getTableFilterQueryString,
|
||||
} = useTableFilter({
|
||||
initial: { search: '' },
|
||||
paramMap: { page: 'page', pageSize: 'limit' },
|
||||
});
|
||||
|
||||
const [sorting, setSorting] = useState<SortingState>([]);
|
||||
const [, setSelectedMovement] = useState<Movement | undefined>(undefined);
|
||||
const [selectedMovement, setSelectedMovement] = useState<
|
||||
Movement | undefined
|
||||
>(undefined);
|
||||
const [isDeleteLoading, setIsDeleteLoading] = useState(false);
|
||||
|
||||
const deleteModal = useModal();
|
||||
|
||||
const {
|
||||
data: movements,
|
||||
isLoading,
|
||||
mutate: refreshMovements,
|
||||
} = useSWR(
|
||||
`${MovementApi.basePath}${getTableFilterQueryString()}`,
|
||||
MovementApi.getAllFetcher
|
||||
);
|
||||
|
||||
const searchChangeHandler = (e: React.ChangeEvent<HTMLInputElement>) => {
|
||||
setSearch(e.target.value);
|
||||
updateFilter('search', e.target.value);
|
||||
setPage(1);
|
||||
};
|
||||
|
||||
@@ -361,17 +62,15 @@ const MovementTable = () => {
|
||||
|
||||
const confirmationModalDeleteClickHandler = async () => {
|
||||
setIsDeleteLoading(true);
|
||||
setTimeout(() => {
|
||||
setIsDeleteLoading(false);
|
||||
try {
|
||||
await MovementApi.delete(selectedMovement?.id as number);
|
||||
refreshMovements();
|
||||
deleteModal.closeModal();
|
||||
}, 1000);
|
||||
} finally {
|
||||
setIsDeleteLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
const paginatedData = useMemo(() => {
|
||||
const start = (page - 1) * pageSize;
|
||||
return dummyMovements.slice(start, start + pageSize);
|
||||
}, [page, pageSize]);
|
||||
|
||||
return (
|
||||
<div className='flex flex-col gap-4'>
|
||||
<div className='flex flex-col gap-2 mb-4'>
|
||||
@@ -381,81 +80,120 @@ const MovementTable = () => {
|
||||
label: 'Tambah Movement',
|
||||
}}
|
||||
search={{
|
||||
value: search,
|
||||
value: tableFilterState.search,
|
||||
onChange: searchChangeHandler,
|
||||
placeholder: 'Cari Movement',
|
||||
}}
|
||||
/>
|
||||
<TableRowSizeSelector
|
||||
value={pageSize}
|
||||
value={tableFilterState.pageSize}
|
||||
onChange={pageSizeChangeHandler}
|
||||
options={ROWS_OPTIONS}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<Table
|
||||
data={paginatedData}
|
||||
<Table<Movement>
|
||||
data={isResponseSuccess(movements) ? movements?.data : []}
|
||||
columns={[
|
||||
{
|
||||
header: '#',
|
||||
cell: (props) => pageSize * (page - 1) + props.row.index + 1,
|
||||
},
|
||||
{
|
||||
accessorKey: 'warehouse_asal',
|
||||
header: 'Gudang Asal',
|
||||
cell: (props) => props.row.original.warehouse_asal.name,
|
||||
},
|
||||
{
|
||||
accessorKey: 'warehouse_tujuan',
|
||||
header: 'Gudang Tujuan',
|
||||
cell: (props) => props.row.original.warehouse_tujuan.name,
|
||||
},
|
||||
{
|
||||
accessorKey: 'product',
|
||||
header: 'Nama Produk',
|
||||
cell: (props) =>
|
||||
props.row.original.product.map((p) => p.product.name),
|
||||
tableFilterState.pageSize * (tableFilterState.page - 1) +
|
||||
props.row.index +
|
||||
1,
|
||||
},
|
||||
{
|
||||
accessorKey: 'alasan_transfer',
|
||||
accessorFn: (row) => row.source_warehouse?.name,
|
||||
header: 'Gudang Asal',
|
||||
},
|
||||
{
|
||||
accessorFn: (row) => row.destination_warehouse?.name,
|
||||
header: 'Gudang Tujuan',
|
||||
},
|
||||
{
|
||||
accessorKey: 'transfer_reason',
|
||||
header: 'Catatan',
|
||||
},
|
||||
{
|
||||
accessorKey: 'biaya_ekspedisi',
|
||||
header: 'Biaya Ekspedisi',
|
||||
accessorKey: 'transfer_date',
|
||||
header: 'Tanggal',
|
||||
cell: (props) =>
|
||||
props.row.original.ekspedisi.map((e) => e.biaya_ekspedisi),
|
||||
new Date(props.row.original.transfer_date).toLocaleDateString(
|
||||
'id-ID'
|
||||
),
|
||||
},
|
||||
{
|
||||
id: 'actions',
|
||||
cell: (props) => (
|
||||
<div className='dropdown dropdown-end'>
|
||||
<Button tabIndex={0} variant='ghost' className='px-2'>
|
||||
<Icon icon='carbon:overflow-menu-vertical' />
|
||||
</Button>
|
||||
<TableRowOptions
|
||||
type='dropdown'
|
||||
recordId={props.row.original.id}
|
||||
basePath='/inventory/movement'
|
||||
onDelete={() => {
|
||||
setSelectedMovement(props.row.original);
|
||||
deleteModal.openModal();
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
),
|
||||
accessorFn: (row) => {
|
||||
const totalCost = row.deliveries?.reduce(
|
||||
(sum, d) => sum + (d.shipping_cost_total || 0),
|
||||
0
|
||||
);
|
||||
return totalCost?.toLocaleString('id-ID');
|
||||
},
|
||||
header: 'Biaya Pengiriman',
|
||||
},
|
||||
{
|
||||
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 - 2;
|
||||
|
||||
const deleteClickHandler = () => {
|
||||
setSelectedMovement(props.row.original);
|
||||
deleteModal.openModal();
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
{currentPageSize > 2 && (
|
||||
<RowDropdownOptions isLast2Rows={isLast2Rows}>
|
||||
<TableRowOptions
|
||||
type='dropdown'
|
||||
recordId={props.row.original.id}
|
||||
basePath='/inventory/movement'
|
||||
queryParam='movementId'
|
||||
showEdit={false}
|
||||
showDelete={false}
|
||||
/>
|
||||
</RowDropdownOptions>
|
||||
)}
|
||||
|
||||
{currentPageSize <= 2 && (
|
||||
<RowCollapseOptions>
|
||||
<TableRowOptions
|
||||
type='collapse'
|
||||
recordId={props.row.original.id}
|
||||
basePath='/inventory/movement'
|
||||
queryParam='movementId'
|
||||
showEdit={false}
|
||||
showDelete={false}
|
||||
/>
|
||||
</RowCollapseOptions>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
},
|
||||
},
|
||||
]}
|
||||
pageSize={pageSize}
|
||||
page={page}
|
||||
totalItems={dummyMovements.length}
|
||||
pageSize={tableFilterState.pageSize}
|
||||
page={isResponseSuccess(movements) ? movements?.meta?.page : 0}
|
||||
totalItems={
|
||||
isResponseSuccess(movements) ? movements?.meta?.total_results : 0
|
||||
}
|
||||
onPageChange={setPage}
|
||||
isLoading={false}
|
||||
isLoading={isLoading}
|
||||
sorting={sorting}
|
||||
setSorting={setSorting}
|
||||
className={{
|
||||
containerClassName: cn({
|
||||
'mb-20': paginatedData.length === 0,
|
||||
'mb-20':
|
||||
isResponseSuccess(movements) && movements?.data?.length === 0,
|
||||
}),
|
||||
tableWrapperClassName: 'overflow-x-auto min-h-full!',
|
||||
tableClassName: 'font-inter w-full table-auto min-h-full!',
|
||||
|
||||
@@ -7,27 +7,28 @@ export type ProductSchema = {
|
||||
label: string;
|
||||
} | null;
|
||||
product_id: number;
|
||||
qty_product: number;
|
||||
product_qty: number;
|
||||
};
|
||||
|
||||
export type EkspedisiSchema = {
|
||||
product: {
|
||||
value: number;
|
||||
label: string;
|
||||
} | null;
|
||||
product_id: number;
|
||||
qty: number;
|
||||
export type DeliverySchema = {
|
||||
delivery_cost: number;
|
||||
delivery_cost_per_item?: number | undefined;
|
||||
document?: File | string | null;
|
||||
driver_name: string;
|
||||
vehicle_plate: string;
|
||||
supplier: {
|
||||
value: number;
|
||||
label: string;
|
||||
} | null;
|
||||
supplier_id: number;
|
||||
plat_nomor: string;
|
||||
no_surat_jalan: string;
|
||||
dokumen: string | File;
|
||||
biaya_ekspedisi: number;
|
||||
biaya_ekspedisi_per_item?: number | undefined;
|
||||
nama_sopir: string;
|
||||
products: {
|
||||
product: {
|
||||
value: number;
|
||||
label: string;
|
||||
} | null;
|
||||
product_id: number;
|
||||
product_qty: number;
|
||||
}[];
|
||||
};
|
||||
|
||||
const ProductObjectSchema: Yup.ObjectSchema<ProductSchema> = Yup.object({
|
||||
@@ -36,94 +37,80 @@ const ProductObjectSchema: Yup.ObjectSchema<ProductSchema> = Yup.object({
|
||||
label: Yup.string().required(),
|
||||
}).nullable(),
|
||||
product_id: Yup.number().required('Produk wajib diisi!'),
|
||||
qty_product: Yup.number()
|
||||
product_qty: Yup.number()
|
||||
.required('Qty wajib diisi!')
|
||||
.min(1, 'Qty minimal 1!')
|
||||
.typeError('Qty harus berupa angka!'),
|
||||
});
|
||||
|
||||
const EkspedisiObjectSchema: Yup.ObjectSchema<EkspedisiSchema> = Yup.object({
|
||||
const DeliveryProductObjectSchema = Yup.object({
|
||||
product: Yup.object({
|
||||
value: Yup.number().min(1).required(),
|
||||
label: Yup.string().required(),
|
||||
}).nullable(),
|
||||
product_id: Yup.number().required('Produk wajib diisi!'),
|
||||
qty: Yup.number()
|
||||
product_qty: Yup.number()
|
||||
.required('Qty wajib diisi!')
|
||||
.min(1, 'Qty minimal 1!')
|
||||
.typeError('Qty harus berupa angka!')
|
||||
.test('max-product-qty', 'Qty melebihi stok produk!', function (value) {
|
||||
const { product_id } = this.parent;
|
||||
const products = (this.options.context?.product ?? []) as {
|
||||
product_id: number;
|
||||
qty_product: number;
|
||||
}[];
|
||||
const product = products.find((p) => p.product_id === product_id);
|
||||
if (!product) return true;
|
||||
return (value ?? 0) <= Number(product.qty_product);
|
||||
.typeError('Qty harus berupa angka!'),
|
||||
});
|
||||
|
||||
const DeliveryObjectSchema: Yup.ObjectSchema<DeliverySchema> = Yup.object({
|
||||
delivery_cost: Yup.number()
|
||||
.required('Biaya pengiriman wajib diisi!')
|
||||
.min(1, 'Biaya minimal 1!')
|
||||
.typeError('Biaya harus berupa angka!'),
|
||||
delivery_cost_per_item: Yup.number()
|
||||
.transform((value) => (isNaN(value) ? undefined : value))
|
||||
.min(1, 'Biaya per item minimal 1!')
|
||||
.typeError('Biaya per item harus berupa angka!'),
|
||||
document_index: Yup.number().optional(),
|
||||
document: Yup.mixed<File | string>()
|
||||
.nullable()
|
||||
.test('fileSize', 'Ukuran dokumen maksimal 2 MB', (value) => {
|
||||
if (!value) return true;
|
||||
if (typeof value === 'string') return true;
|
||||
if (value instanceof File) return value.size <= 2 * 1024 * 1024;
|
||||
return false;
|
||||
}),
|
||||
driver_name: Yup.string().required('Nama sopir wajib diisi!'),
|
||||
vehicle_plate: Yup.string().required('Plat nomor wajib diisi!'),
|
||||
supplier: Yup.object({
|
||||
value: Yup.number().min(1).required(),
|
||||
label: Yup.string().required(),
|
||||
}).nullable(),
|
||||
supplier_id: Yup.number().required('Supplier wajib diisi!'),
|
||||
plat_nomor: Yup.string().required('Plat nomor wajib diisi!'),
|
||||
no_surat_jalan: Yup.string().required('No surat jalan wajib diisi!'),
|
||||
dokumen: Yup.mixed<string | File>()
|
||||
.required('Dokumen wajib diisi!')
|
||||
.test(
|
||||
'fileType',
|
||||
'Mohon upload file berformat PDF atau JPEG/JPG.',
|
||||
(value) =>
|
||||
typeof value === 'string' ||
|
||||
(value instanceof File &&
|
||||
['application/pdf', 'image/jpeg', 'image/jpg'].includes(value.type))
|
||||
)
|
||||
.test(
|
||||
'fileSize',
|
||||
'Ukuran dokumen maksimal 2 MB!',
|
||||
(value) =>
|
||||
typeof value === 'string' ||
|
||||
(value instanceof File && value.size <= 2 * 1024 * 1024)
|
||||
),
|
||||
biaya_ekspedisi: Yup.number()
|
||||
.required('Biaya ekspedisi wajib diisi!')
|
||||
.min(0, 'Biaya minimal 0!')
|
||||
.typeError('Biaya harus berupa angka!'),
|
||||
biaya_ekspedisi_per_item: Yup.number()
|
||||
.transform((value) => (isNaN(value) ? undefined : value))
|
||||
.min(0, 'Biaya per item minimal 0!')
|
||||
.typeError('Biaya per item harus berupa angka!')
|
||||
.optional()
|
||||
.default(undefined),
|
||||
nama_sopir: Yup.string().required('Nama sopir wajib diisi!'),
|
||||
products: Yup.array()
|
||||
.of(DeliveryProductObjectSchema)
|
||||
.min(1, 'Minimal harus ada 1 produk!')
|
||||
.required('Produk wajib diisi!'),
|
||||
});
|
||||
|
||||
export const MovementFormSchema = Yup.object({
|
||||
alasan_transfer: Yup.string().required('Alasan transfer wajib diisi!'),
|
||||
tanggal_transfer: Yup.string().required('Tanggal transfer wajib diisi!'),
|
||||
warehouse_asal: Yup.object({
|
||||
transfer_reason: Yup.string().required('Alasan transfer wajib diisi!'),
|
||||
transfer_date: Yup.string().required('Tanggal transfer wajib diisi!'),
|
||||
source_warehouse: Yup.object({
|
||||
value: Yup.number().min(1).required(),
|
||||
label: Yup.string().required(),
|
||||
}).nullable(),
|
||||
warehouse_asal_id: Yup.number()
|
||||
source_warehouse_id: Yup.number()
|
||||
.required('Gudang asal wajib diisi!')
|
||||
.typeError('Gudang asal wajib diisi!'),
|
||||
warehouse_tujuan: Yup.object({
|
||||
destination_warehouse: Yup.object({
|
||||
value: Yup.number().min(1).required(),
|
||||
label: Yup.string().required(),
|
||||
}).nullable(),
|
||||
warehouse_tujuan_id: Yup.number()
|
||||
destination_warehouse_id: Yup.number()
|
||||
.required('Gudang tujuan wajib diisi!')
|
||||
.typeError('Gudang tujuan wajib diisi!'),
|
||||
product: Yup.array()
|
||||
products: Yup.array()
|
||||
.of(ProductObjectSchema)
|
||||
.min(1, 'Minimal harus ada 1 produk!')
|
||||
.required('Produk wajib diisi!'),
|
||||
ekspedisi: Yup.array()
|
||||
.of(EkspedisiObjectSchema)
|
||||
.min(1, 'Minimal harus ada 1 ekspedisi!')
|
||||
.required('Ekspedisi wajib diisi!'),
|
||||
deliveries: Yup.array()
|
||||
.of(DeliveryObjectSchema)
|
||||
.min(1, 'Minimal harus ada 1 pengiriman!')
|
||||
.required('Pengiriman wajib diisi!'),
|
||||
});
|
||||
|
||||
export const UpdateMovementFormSchema = MovementFormSchema;
|
||||
@@ -132,41 +119,61 @@ export type MovementFormValues = Yup.InferType<typeof MovementFormSchema>;
|
||||
|
||||
export const getMovementFormInitialValues = (
|
||||
initialValues?: Movement
|
||||
): MovementFormValues => ({
|
||||
alasan_transfer: initialValues?.alasan_transfer ?? '',
|
||||
tanggal_transfer: initialValues?.tanggal_transfer ?? '',
|
||||
warehouse_asal: initialValues?.warehouse_asal
|
||||
? {
|
||||
value: initialValues.warehouse_asal.id,
|
||||
label: initialValues.warehouse_asal.name,
|
||||
}
|
||||
: null,
|
||||
warehouse_asal_id: initialValues?.warehouse_asal?.id ?? 0,
|
||||
warehouse_tujuan: initialValues?.warehouse_tujuan
|
||||
? {
|
||||
value: initialValues.warehouse_tujuan.id,
|
||||
label: initialValues.warehouse_tujuan.name,
|
||||
}
|
||||
: null,
|
||||
warehouse_tujuan_id: initialValues?.warehouse_tujuan?.id ?? 0,
|
||||
product:
|
||||
initialValues?.product?.map((p) => ({
|
||||
product: { value: p.product.id, label: p.product.name },
|
||||
product_id: p.product.id,
|
||||
qty_product: p.qty_product,
|
||||
})) ?? [],
|
||||
ekspedisi:
|
||||
initialValues?.ekspedisi?.map((e) => ({
|
||||
product: { value: e.product_id, label: '' },
|
||||
product_id: e.product_id,
|
||||
qty: e.qty,
|
||||
supplier: { value: e.supplier.id, label: e.supplier.name },
|
||||
supplier_id: e.supplier.id,
|
||||
plat_nomor: e.plat_nomor,
|
||||
no_surat_jalan: e.no_surat_jalan,
|
||||
dokumen: e.dokumen,
|
||||
biaya_ekspedisi: e.biaya_ekspedisi,
|
||||
biaya_ekspedisi_per_item: e.biaya_ekspedisi,
|
||||
nama_sopir: e.nama_sopir,
|
||||
})) ?? [],
|
||||
});
|
||||
): MovementFormValues => {
|
||||
const detailIdToProductId = new Map<number, number>();
|
||||
initialValues?.details?.forEach((detail) => {
|
||||
detailIdToProductId.set(detail.id, detail.product_id);
|
||||
});
|
||||
|
||||
return {
|
||||
transfer_reason: initialValues?.transfer_reason ?? '',
|
||||
transfer_date: initialValues?.transfer_date ?? '',
|
||||
source_warehouse: initialValues?.source_warehouse
|
||||
? {
|
||||
value: initialValues.source_warehouse.id,
|
||||
label: initialValues.source_warehouse.name,
|
||||
}
|
||||
: null,
|
||||
source_warehouse_id: initialValues?.source_warehouse?.id ?? 0,
|
||||
destination_warehouse: initialValues?.destination_warehouse
|
||||
? {
|
||||
value: initialValues.destination_warehouse.id,
|
||||
label: initialValues.destination_warehouse.name,
|
||||
}
|
||||
: null,
|
||||
destination_warehouse_id: initialValues?.destination_warehouse?.id ?? 0,
|
||||
products:
|
||||
initialValues?.details?.map((p) => ({
|
||||
product: { value: p.product_id, label: `Product ID: ${p.product_id}` },
|
||||
product_id: p.product_id,
|
||||
product_qty: p.quantity,
|
||||
})) ?? [],
|
||||
deliveries:
|
||||
initialValues?.deliveries?.map((d) => {
|
||||
return {
|
||||
delivery_cost: d.shipping_cost_total,
|
||||
delivery_cost_per_item: d.shipping_cost_item,
|
||||
document_index: 0,
|
||||
document: d.document_path || null,
|
||||
driver_name: d.driver_name,
|
||||
vehicle_plate: d.vehicle_plate,
|
||||
supplier: d.supplier
|
||||
? { value: d.supplier.id, label: d.supplier.name }
|
||||
: null,
|
||||
supplier_id: d.supplier_id,
|
||||
products: d.items.map((item) => {
|
||||
const productId =
|
||||
detailIdToProductId.get(item.stock_transfer_detail_id) ?? 0;
|
||||
return {
|
||||
product:
|
||||
productId > 0
|
||||
? { value: productId, label: `Product ID: ${productId}` }
|
||||
: null,
|
||||
product_id: productId,
|
||||
product_qty: item.quantity,
|
||||
};
|
||||
}),
|
||||
};
|
||||
}) ?? [],
|
||||
};
|
||||
};
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@@ -8,7 +8,6 @@ import {
|
||||
UpdateMovementPayload,
|
||||
} from '@/types/api/inventory/movement';
|
||||
import { isResponseError } from '@/lib/api-helper';
|
||||
import { containsFile, toFormData } from '@/lib/form-data';
|
||||
|
||||
export const useMovementFormHandlers = (initialValuesId?: number) => {
|
||||
const router = useRouter();
|
||||
@@ -17,12 +16,16 @@ export const useMovementFormHandlers = (initialValuesId?: number) => {
|
||||
const [isDeleteLoading, setIsDeleteLoading] = useState(false);
|
||||
|
||||
const createMovementHandler = useCallback(
|
||||
async (payload: CreateMovementPayload) => {
|
||||
const finalPayload = containsFile(payload)
|
||||
? (toFormData(payload) as unknown as CreateMovementPayload)
|
||||
: payload;
|
||||
async (payload: CreateMovementPayload, documents: File[] = []) => {
|
||||
const formData = new FormData();
|
||||
formData.append('data', JSON.stringify(payload));
|
||||
documents.forEach((file, index) => {
|
||||
formData.append(`documents[${index}]`, file);
|
||||
});
|
||||
|
||||
const res = await MovementApi.create(finalPayload);
|
||||
const res = await MovementApi.create(
|
||||
formData as unknown as CreateMovementPayload
|
||||
);
|
||||
if (isResponseError(res)) {
|
||||
setMovementFormErrorMessage(res.message);
|
||||
return;
|
||||
@@ -34,10 +37,24 @@ export const useMovementFormHandlers = (initialValuesId?: number) => {
|
||||
);
|
||||
|
||||
const updateMovementHandler = useCallback(
|
||||
async (movementId: number, payload: UpdateMovementPayload) => {
|
||||
const finalPayload = containsFile(payload)
|
||||
? (toFormData(payload) as unknown as UpdateMovementPayload)
|
||||
: payload;
|
||||
async (
|
||||
movementId: number,
|
||||
payload: UpdateMovementPayload,
|
||||
documents: File[] = []
|
||||
) => {
|
||||
let finalPayload: UpdateMovementPayload | FormData;
|
||||
|
||||
if (documents.length > 0) {
|
||||
const formData = new FormData();
|
||||
formData.append('data', JSON.stringify(payload));
|
||||
documents.forEach((file, index) => {
|
||||
formData.append(`documents[${index}]`, file);
|
||||
});
|
||||
|
||||
finalPayload = formData as unknown as UpdateMovementPayload;
|
||||
} else {
|
||||
finalPayload = payload;
|
||||
}
|
||||
|
||||
const res = await MovementApi.update(movementId, finalPayload);
|
||||
if (res?.status === 'error') {
|
||||
|
||||
@@ -7,6 +7,9 @@ interface TableRowOptionsProps {
|
||||
recordId: string | number;
|
||||
basePath: string;
|
||||
onDelete?: () => void;
|
||||
queryParam?: string;
|
||||
showEdit?: boolean;
|
||||
showDelete?: boolean;
|
||||
}
|
||||
|
||||
export const TableRowOptions = ({
|
||||
@@ -14,6 +17,9 @@ export const TableRowOptions = ({
|
||||
recordId,
|
||||
basePath,
|
||||
onDelete,
|
||||
queryParam = 'id',
|
||||
showEdit = true,
|
||||
showDelete = true,
|
||||
}: TableRowOptionsProps) => (
|
||||
<div
|
||||
tabIndex={type === 'dropdown' ? 0 : undefined}
|
||||
@@ -26,7 +32,7 @@ export const TableRowOptions = ({
|
||||
)}
|
||||
>
|
||||
<Button
|
||||
href={`${basePath}/detail/?id=${recordId}`}
|
||||
href={`${basePath}/detail/?${queryParam}=${recordId}`}
|
||||
variant='ghost'
|
||||
color='primary'
|
||||
className='justify-start text-sm'
|
||||
@@ -34,16 +40,18 @@ export const TableRowOptions = ({
|
||||
<Icon icon='mdi:eye-outline' width={16} height={16} />
|
||||
Detail
|
||||
</Button>
|
||||
<Button
|
||||
href={`${basePath}/detail/edit/?id=${recordId}`}
|
||||
variant='ghost'
|
||||
color='warning'
|
||||
className='justify-start text-sm'
|
||||
>
|
||||
<Icon icon='material-symbols:edit-outline' width={16} height={16} />
|
||||
Edit
|
||||
</Button>
|
||||
{onDelete && (
|
||||
{showEdit && (
|
||||
<Button
|
||||
href={`${basePath}/detail/edit/?${queryParam}=${recordId}`}
|
||||
variant='ghost'
|
||||
color='warning'
|
||||
className='justify-start text-sm'
|
||||
>
|
||||
<Icon icon='mdi:pencil-outline' width={16} height={16} />
|
||||
Edit
|
||||
</Button>
|
||||
)}
|
||||
{showDelete && onDelete && (
|
||||
<Button
|
||||
onClick={onDelete}
|
||||
variant='ghost'
|
||||
@@ -51,9 +59,10 @@ export const TableRowOptions = ({
|
||||
className='text-error hover:text-inherit justify-start text-sm'
|
||||
>
|
||||
<Icon
|
||||
icon='material-symbols:delete-outline-rounded'
|
||||
icon='mdi:delete-outline'
|
||||
width={16}
|
||||
height={16}
|
||||
className='justify-start text-sm'
|
||||
/>
|
||||
Delete
|
||||
</Button>
|
||||
|
||||
@@ -125,18 +125,6 @@ export const MAIN_DRAWER_LINKS: MAIN_DRAWER_MENU[] = [
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: 'Persediaan',
|
||||
link: '/inventory',
|
||||
icon: 'material-symbols:box-outline-rounded',
|
||||
submenu: [
|
||||
{
|
||||
title: 'Penyesuaian Persediaan',
|
||||
link: '/inventory/adjustment',
|
||||
icon: 'material-symbols:box-edit-outline-rounded',
|
||||
}
|
||||
]
|
||||
},
|
||||
] as const;
|
||||
|
||||
export const ROWS_OPTIONS = [
|
||||
|
||||
@@ -1,4 +1,9 @@
|
||||
import { BaseApiService } from '@/services/api/base';
|
||||
import {
|
||||
CreateProductWarehousePayload,
|
||||
ProductWarehouse,
|
||||
UpdateProductWarehousePayload,
|
||||
} from '@/types/api/inventory/product-warehouse';
|
||||
import {
|
||||
CreateMovementPayload,
|
||||
Movement,
|
||||
@@ -7,17 +12,22 @@ import {
|
||||
import {
|
||||
CreateInventoryAdjustmentPayload,
|
||||
InventoryAdjustment,
|
||||
UpdateInventoryAdjustmentPayload,
|
||||
} from '@/types/api/inventory/adjustment';
|
||||
|
||||
export const ProductWarehouseApi = new BaseApiService<
|
||||
ProductWarehouse,
|
||||
CreateProductWarehousePayload,
|
||||
UpdateProductWarehousePayload
|
||||
>('/inventory/product-warehouses');
|
||||
|
||||
export const MovementApi = new BaseApiService<
|
||||
Movement,
|
||||
CreateMovementPayload,
|
||||
UpdateMovementPayload
|
||||
>('/inventory/movements');
|
||||
>('/inventory/transfers');
|
||||
|
||||
export const inventoryAdjustmentApi = new BaseApiService<
|
||||
InventoryAdjustment,
|
||||
CreateInventoryAdjustmentPayload,
|
||||
UpdateInventoryAdjustmentPayload
|
||||
unknown
|
||||
>('/inventory/adjustments');
|
||||
|
||||
@@ -14,6 +14,9 @@ export async function httpClient<T, B = unknown>(
|
||||
(!opts.auth && opts.auth !== 'none' && opts.auth !== 'bearer');
|
||||
const isBearerAuth = opts.auth === 'bearer' && !!opts.token;
|
||||
|
||||
const isFormData =
|
||||
typeof FormData !== 'undefined' && opts.body instanceof FormData;
|
||||
|
||||
const config: AxiosRequestConfig = {
|
||||
url: path,
|
||||
method: opts.method ?? 'GET',
|
||||
@@ -22,7 +25,7 @@ export async function httpClient<T, B = unknown>(
|
||||
timeout: opts.timeoutMs ?? 10_000,
|
||||
withCredentials: isCookieAuth && !isBearerAuth,
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
...(isFormData ? {} : { 'Content-Type': 'application/json' }),
|
||||
...(opts.headers ?? {}),
|
||||
...(isBearerAuth && !isCookieAuth
|
||||
? { Authorization: `Bearer ${opts.token}` }
|
||||
|
||||
+40
-31
@@ -1,51 +1,60 @@
|
||||
import { BaseMetadata } from '@/types/api/api-general';
|
||||
import { Product } from '@/types/api/master-data/product';
|
||||
import { Supplier } from '@/types/api/master-data/supplier';
|
||||
import { Warehouse } from '@/types/api/master-data/warehouse';
|
||||
|
||||
export type BaseMovement = {
|
||||
id: number;
|
||||
alasan_transfer: string;
|
||||
tanggal_transfer: string;
|
||||
warehouse_asal: Warehouse;
|
||||
warehouse_tujuan: Warehouse;
|
||||
product: {
|
||||
product: Product;
|
||||
qty_product: number;
|
||||
}[];
|
||||
ekspedisi: {
|
||||
transfer_reason: string;
|
||||
transfer_date: string;
|
||||
source_warehouse: Warehouse;
|
||||
destination_warehouse: Warehouse;
|
||||
details: {
|
||||
id: number;
|
||||
product_id: number;
|
||||
qty: number;
|
||||
quantity: number;
|
||||
before_quantity: number;
|
||||
after_quantity: number;
|
||||
}[];
|
||||
deliveries: {
|
||||
id: number;
|
||||
supplier_id: number;
|
||||
supplier: Supplier;
|
||||
plat_nomor: string;
|
||||
no_surat_jalan: string;
|
||||
dokumen: string;
|
||||
biaya_ekspedisi: number;
|
||||
nama_sopir: string;
|
||||
vehicle_plate: string;
|
||||
driver_name: string;
|
||||
document_number: string;
|
||||
document_path: string;
|
||||
shipping_cost_item: number;
|
||||
shipping_cost_total: number;
|
||||
items: {
|
||||
id: number;
|
||||
stock_transfer_detail_id: number;
|
||||
quantity: number;
|
||||
}[];
|
||||
}[];
|
||||
};
|
||||
|
||||
export type Movement = BaseMetadata & BaseMovement;
|
||||
|
||||
export type CreateMovementPayload = {
|
||||
alasan_transfer: string;
|
||||
tanggal_transfer: string;
|
||||
warehouse_asal_id: number;
|
||||
warehouse_tujuan_id: number;
|
||||
product: {
|
||||
transfer_reason: string;
|
||||
transfer_date: string;
|
||||
source_warehouse_id: number;
|
||||
destination_warehouse_id: number;
|
||||
products: {
|
||||
product_id: number;
|
||||
qty_product: number;
|
||||
product_qty: number;
|
||||
}[];
|
||||
ekspedisi: {
|
||||
product_id: number;
|
||||
qty: number;
|
||||
deliveries: {
|
||||
delivery_cost: number;
|
||||
delivery_cost_per_item: number;
|
||||
document_index?: number;
|
||||
driver_name: string;
|
||||
vehicle_plate: string;
|
||||
supplier_id: number;
|
||||
plat_nomor: string;
|
||||
no_surat_jalan: string;
|
||||
dokumen: string | File;
|
||||
biaya_ekspedisi: number;
|
||||
biaya_ekspedisi_per_item?: number;
|
||||
nama_sopir: string;
|
||||
products: {
|
||||
product_id: number;
|
||||
product_qty: number;
|
||||
}[];
|
||||
}[];
|
||||
};
|
||||
|
||||
|
||||
+22
@@ -0,0 +1,22 @@
|
||||
import { BaseMetadata } from '@/types/api/api-general';
|
||||
import { Warehouse } from '@/types/api/master-data/warehouse';
|
||||
import { Product } from '@/types/api/master-data/product';
|
||||
|
||||
export type BaseProductWarehouse = {
|
||||
id: number;
|
||||
product_id: number;
|
||||
warehouse_id: number;
|
||||
quantity: number;
|
||||
product: Product;
|
||||
warehouse: Warehouse;
|
||||
};
|
||||
|
||||
export type ProductWarehouse = BaseMetadata & BaseProductWarehouse;
|
||||
|
||||
export type CreateProductWarehousePayload = {
|
||||
product_id: number;
|
||||
warehouse_id: number;
|
||||
quantity: number;
|
||||
};
|
||||
|
||||
export type UpdateProductWarehousePayload = CreateProductWarehousePayload;
|
||||
Reference in New Issue
Block a user