mirror of
https://gitlab.com/mbugroup/lti-web-client.git
synced 2026-05-20 13:32:00 +00:00
feat/FE/US-34/TASK-54-51-slicing-ui-client-side-validation-stock-adjustment
This commit is contained in:
randy-ar
+15
@@ -0,0 +1,15 @@
|
|||||||
|
{
|
||||||
|
"singleQuote": true,
|
||||||
|
"jsxSingleQuote": true,
|
||||||
|
"endOfLine": "lf",
|
||||||
|
"arrowParens": "always",
|
||||||
|
"bracketSpacing": true,
|
||||||
|
"embeddedLanguageFormatting": "auto",
|
||||||
|
"htmlWhitespaceSensitivity": "css",
|
||||||
|
"printWidth": 80,
|
||||||
|
"proseWrap": "preserve",
|
||||||
|
"quoteProps": "as-needed",
|
||||||
|
"semi": true,
|
||||||
|
"tabWidth": 2,
|
||||||
|
"trailingComma": "es5"
|
||||||
|
}
|
||||||
@@ -0,0 +1,11 @@
|
|||||||
|
import InventoryAdjustmentForm from "@/components/pages/inventory/adjustment/form/InventoryAdjustmentForm";
|
||||||
|
|
||||||
|
const CreateInventoryAdjustment = () => {
|
||||||
|
return (
|
||||||
|
<section className="w-full p-4 flex flex-row justify-center">
|
||||||
|
<InventoryAdjustmentForm/>
|
||||||
|
</section>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default CreateInventoryAdjustment;
|
||||||
@@ -0,0 +1,11 @@
|
|||||||
|
import InventoryAdjustmentForm from "@/components/pages/inventory/adjustment/form/InventoryAdjustmentForm";
|
||||||
|
|
||||||
|
const DetailInventoryAdjustment = () => {
|
||||||
|
return (
|
||||||
|
<section>
|
||||||
|
<InventoryAdjustmentForm/>
|
||||||
|
</section>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default DetailInventoryAdjustment;
|
||||||
@@ -0,0 +1,12 @@
|
|||||||
|
import InventoryAdjustmentForm from '@/components/pages/inventory/adjustment/form/InventoryAdjustmentForm';
|
||||||
|
import InventoryAdjustmentTable from '@/components/pages/inventory/adjustment/InventoryAdjustmentTable';
|
||||||
|
|
||||||
|
const InventoryAdjustment = () => {
|
||||||
|
return (
|
||||||
|
<section className='w-full p-4'>
|
||||||
|
<InventoryAdjustmentTable />
|
||||||
|
</section>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default InventoryAdjustment;
|
||||||
@@ -0,0 +1,114 @@
|
|||||||
|
'use client';
|
||||||
|
|
||||||
|
import { ChangeEventHandler, ReactNode } from 'react';
|
||||||
|
import { cn } from '@/lib/helper';
|
||||||
|
|
||||||
|
export interface RadioOption {
|
||||||
|
label: string;
|
||||||
|
value: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
export interface RadioInputProps {
|
||||||
|
label?: string;
|
||||||
|
bottomLabel?: string;
|
||||||
|
name: string;
|
||||||
|
value?: string;
|
||||||
|
options: RadioOption[];
|
||||||
|
variant?: string; // contoh: 'radio-primary', 'radio-secondary', dll
|
||||||
|
className?: {
|
||||||
|
wrapper?: string;
|
||||||
|
label?: string;
|
||||||
|
radioWrapper?: string;
|
||||||
|
radio?: string;
|
||||||
|
};
|
||||||
|
isError?: boolean;
|
||||||
|
isValid?: boolean;
|
||||||
|
errorMessage?: string;
|
||||||
|
required?: boolean;
|
||||||
|
disabled?: boolean;
|
||||||
|
startAdornment?: ReactNode;
|
||||||
|
endAdornment?: ReactNode;
|
||||||
|
onChange?: ChangeEventHandler<HTMLInputElement>;
|
||||||
|
onBlur?: (e: React.FocusEvent<HTMLInputElement>) => void;
|
||||||
|
}
|
||||||
|
|
||||||
|
const RadioInput = ({
|
||||||
|
label,
|
||||||
|
bottomLabel,
|
||||||
|
name,
|
||||||
|
value,
|
||||||
|
options,
|
||||||
|
variant = 'radio-primary',
|
||||||
|
className,
|
||||||
|
isError,
|
||||||
|
isValid,
|
||||||
|
errorMessage,
|
||||||
|
required = false,
|
||||||
|
disabled = false,
|
||||||
|
onChange,
|
||||||
|
onBlur,
|
||||||
|
}: RadioInputProps) => {
|
||||||
|
return (
|
||||||
|
<div className={cn('w-full flex flex-col gap-2', className?.wrapper)}>
|
||||||
|
{/* Label atas */}
|
||||||
|
{label && (
|
||||||
|
<label
|
||||||
|
className={cn(
|
||||||
|
'w-full text-sm font-normal leading-5',
|
||||||
|
{ 'text-error': isError },
|
||||||
|
className?.label
|
||||||
|
)}
|
||||||
|
>
|
||||||
|
{label}
|
||||||
|
{required && (
|
||||||
|
<span className='text-error ml-1' title='required'>
|
||||||
|
*
|
||||||
|
</span>
|
||||||
|
)}
|
||||||
|
</label>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{/* Daftar opsi radio */}
|
||||||
|
<div
|
||||||
|
className={cn(
|
||||||
|
'flex flex-row flex-wrap gap-4 items-center',
|
||||||
|
className?.radioWrapper
|
||||||
|
)}
|
||||||
|
>
|
||||||
|
{options.map((option) => (
|
||||||
|
<label
|
||||||
|
key={option.value}
|
||||||
|
className={cn(
|
||||||
|
'flex flex-row items-center gap-2 cursor-pointer',
|
||||||
|
disabled && 'opacity-60 cursor-not-allowed'
|
||||||
|
)}
|
||||||
|
>
|
||||||
|
<input
|
||||||
|
type='radio'
|
||||||
|
name={name}
|
||||||
|
value={option.value}
|
||||||
|
checked={value === option.value}
|
||||||
|
onChange={onChange}
|
||||||
|
onBlur={onBlur}
|
||||||
|
disabled={disabled}
|
||||||
|
className={cn('radio', variant, className?.radio)}
|
||||||
|
/>
|
||||||
|
<span className='text-sm'>{option.label}</span>
|
||||||
|
</label>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Label bawah */}
|
||||||
|
{!isError && bottomLabel && (
|
||||||
|
<p className='text-sm opacity-60'>{bottomLabel}</p>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{/* Pesan error */}
|
||||||
|
{isError && errorMessage && (
|
||||||
|
<p className='text-sm text-error'>{errorMessage}</p>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default RadioInput;
|
||||||
@@ -0,0 +1,124 @@
|
|||||||
|
'use client';
|
||||||
|
|
||||||
|
import {
|
||||||
|
ChangeEventHandler,
|
||||||
|
FocusEventHandler,
|
||||||
|
ReactNode,
|
||||||
|
} from 'react';
|
||||||
|
|
||||||
|
import { cn } from '@/lib/helper';
|
||||||
|
|
||||||
|
export interface TextAreaProps {
|
||||||
|
label?: string;
|
||||||
|
bottomLabel?: string;
|
||||||
|
name: string;
|
||||||
|
value?: string | number;
|
||||||
|
placeholder?: string;
|
||||||
|
className?: {
|
||||||
|
wrapper?: string;
|
||||||
|
label?: string;
|
||||||
|
inputWrapper?: string;
|
||||||
|
input?: string;
|
||||||
|
};
|
||||||
|
isError?: boolean;
|
||||||
|
isValid?: boolean;
|
||||||
|
disabled?: boolean;
|
||||||
|
readOnly?: boolean;
|
||||||
|
required?: boolean;
|
||||||
|
isLoading?: boolean;
|
||||||
|
errorMessage?: string;
|
||||||
|
startAdornment?: ReactNode;
|
||||||
|
endAdornment?: ReactNode;
|
||||||
|
onChange?: ChangeEventHandler<HTMLTextAreaElement>;
|
||||||
|
onBlur?: FocusEventHandler<HTMLTextAreaElement>;
|
||||||
|
cols?: number;
|
||||||
|
}
|
||||||
|
|
||||||
|
const TextArea = ({
|
||||||
|
label,
|
||||||
|
bottomLabel,
|
||||||
|
name,
|
||||||
|
value,
|
||||||
|
placeholder,
|
||||||
|
className,
|
||||||
|
isError,
|
||||||
|
isValid,
|
||||||
|
errorMessage,
|
||||||
|
startAdornment,
|
||||||
|
endAdornment,
|
||||||
|
disabled = false,
|
||||||
|
required = false,
|
||||||
|
onChange,
|
||||||
|
onBlur,
|
||||||
|
readOnly = false,
|
||||||
|
isLoading = false,
|
||||||
|
cols = 3
|
||||||
|
}: TextAreaProps) => {
|
||||||
|
return (
|
||||||
|
<div
|
||||||
|
className={cn(
|
||||||
|
'w-full flex flex-col gap-2 text-start',
|
||||||
|
className?.wrapper
|
||||||
|
)}
|
||||||
|
>
|
||||||
|
{label && (
|
||||||
|
<label
|
||||||
|
htmlFor={name}
|
||||||
|
className={cn(
|
||||||
|
'w-full text-sm font-normal leading-5',
|
||||||
|
{
|
||||||
|
'text-error': isError,
|
||||||
|
},
|
||||||
|
className?.label
|
||||||
|
)}
|
||||||
|
>
|
||||||
|
{label}
|
||||||
|
{required && (
|
||||||
|
<>
|
||||||
|
{' '}
|
||||||
|
<span className='tooltip tooltip-error' data-tip='required'>
|
||||||
|
<span className='text-error'> *</span>
|
||||||
|
</span>
|
||||||
|
</>
|
||||||
|
)}
|
||||||
|
</label>
|
||||||
|
)}
|
||||||
|
{startAdornment && startAdornment}
|
||||||
|
|
||||||
|
<textarea
|
||||||
|
className={cn(
|
||||||
|
'input h-12 px-4 py-2 text-base font-normal leading-6 w-full rounded-lg! outline-none! transition-all',
|
||||||
|
{
|
||||||
|
'border-error': isError,
|
||||||
|
'border-success!': isValid,
|
||||||
|
},
|
||||||
|
className?.inputWrapper
|
||||||
|
)}
|
||||||
|
id={name}
|
||||||
|
name={name}
|
||||||
|
placeholder={placeholder}
|
||||||
|
value={value}
|
||||||
|
cols={cols}
|
||||||
|
onChange={onChange}
|
||||||
|
onBlur={onBlur}
|
||||||
|
disabled={disabled}
|
||||||
|
readOnly={readOnly}
|
||||||
|
/>
|
||||||
|
|
||||||
|
{(isLoading || endAdornment) && (
|
||||||
|
<div className='flex flex-row gap-2'>
|
||||||
|
{isLoading && <span className='loading loading-spinner' />}
|
||||||
|
|
||||||
|
{endAdornment && endAdornment}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{!isError && bottomLabel && (
|
||||||
|
<p className='w-full text-sm opacity-60'>{bottomLabel}</p>
|
||||||
|
)}
|
||||||
|
{isError && <p className='w-full text-sm text-error'>{errorMessage}</p>}
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default TextArea;
|
||||||
@@ -0,0 +1,334 @@
|
|||||||
|
'use client';
|
||||||
|
|
||||||
|
import Button from '@/components/Button';
|
||||||
|
import DebouncedTextInput from '@/components/input/DebouncedTextInput';
|
||||||
|
import SelectInput, { OptionType } from '@/components/input/SelectInput';
|
||||||
|
import Table from '@/components/Table';
|
||||||
|
import RowCollapseOptions from '@/components/table/RowCollapseOptions';
|
||||||
|
import RowDropdownOptions from '@/components/table/RowDropdownOptions';
|
||||||
|
import { ROWS_OPTIONS } from '@/config/constant';
|
||||||
|
import { isResponseSuccess } from '@/lib/api-helper';
|
||||||
|
import { cn } from '@/lib/helper';
|
||||||
|
import { inventoryAdjustmentApi } from '@/services/api/inventory';
|
||||||
|
import { useTableFilter } from '@/services/hooks/useTableFilter';
|
||||||
|
import { InventoryAdjustment } from '@/types/api/inventory/adjustment';
|
||||||
|
import { Icon } from '@iconify/react';
|
||||||
|
import {
|
||||||
|
CellContext,
|
||||||
|
ColumnDef,
|
||||||
|
ColumnSort,
|
||||||
|
SortingState,
|
||||||
|
} from '@tanstack/react-table';
|
||||||
|
import { ChangeEventHandler, useCallback, useEffect, useState } from 'react';
|
||||||
|
import useSWR from 'swr';
|
||||||
|
|
||||||
|
const RowOptionsMenu = ({
|
||||||
|
type = 'dropdown',
|
||||||
|
props,
|
||||||
|
}: {
|
||||||
|
type: 'dropdown' | 'collapse';
|
||||||
|
props: CellContext<InventoryAdjustment, unknown>;
|
||||||
|
}) => {
|
||||||
|
return (
|
||||||
|
<div
|
||||||
|
tabIndex={type === 'dropdown' ? 0 : undefined}
|
||||||
|
className={cn(
|
||||||
|
{
|
||||||
|
'dropdown-content': type === 'dropdown',
|
||||||
|
'mt-2': type === 'collapse',
|
||||||
|
},
|
||||||
|
'p-2.5 mr-2 flex flex-col gap-1 bg-base-100 rounded-box z-10 border border-black/10 shadow'
|
||||||
|
)}
|
||||||
|
>
|
||||||
|
<Button
|
||||||
|
href={`/inventory/adjustment/detail?inventoryAdjustmentId=${props.row.original.id}`}
|
||||||
|
variant='ghost'
|
||||||
|
color='primary'
|
||||||
|
className='justify-start text-sm'
|
||||||
|
>
|
||||||
|
<Icon icon='mdi:eye-outline' width={16} height={16} />
|
||||||
|
Detail
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
const InventoryAdjustmentTable = () => {
|
||||||
|
const {
|
||||||
|
state: tableFilterState,
|
||||||
|
updateFilter,
|
||||||
|
setPage,
|
||||||
|
setPageSize,
|
||||||
|
toQueryString: getTableFilterQueryString,
|
||||||
|
} = useTableFilter({
|
||||||
|
initial: {
|
||||||
|
search: '',
|
||||||
|
productCategorySort: '',
|
||||||
|
productSort: '',
|
||||||
|
warehouseSort: '',
|
||||||
|
stockSort: '',
|
||||||
|
},
|
||||||
|
paramMap: {
|
||||||
|
page: 'page',
|
||||||
|
pageSize: 'limit',
|
||||||
|
productCategorySort: 'sort_product_category',
|
||||||
|
productSort: 'sort_product',
|
||||||
|
warehouseSort: 'sort_warehouse',
|
||||||
|
stockSort: 'sort_stock',
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
// Fetch Data
|
||||||
|
const {
|
||||||
|
data: inventoryAdjustments,
|
||||||
|
isLoading,
|
||||||
|
mutate: refreshInventoryAdjustments,
|
||||||
|
} = useSWR(
|
||||||
|
`${inventoryAdjustmentApi.basePath}${getTableFilterQueryString()}`,
|
||||||
|
inventoryAdjustmentApi.getAllFetcher
|
||||||
|
);
|
||||||
|
|
||||||
|
// State
|
||||||
|
const [selectedInventoryAdjustment, setSelectedInventoryAdjustment] =
|
||||||
|
useState<InventoryAdjustment | undefined>(undefined);
|
||||||
|
const [sorting, setSorting] = useState<SortingState>([]);
|
||||||
|
|
||||||
|
// Columns
|
||||||
|
const inventoryAdjustmentsColumns: ColumnDef<InventoryAdjustment>[] = [
|
||||||
|
{
|
||||||
|
header: '#',
|
||||||
|
cell: (props) =>
|
||||||
|
tableFilterState.pageSize * (tableFilterState.page - 1) +
|
||||||
|
props.row.index +
|
||||||
|
1,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 'product_name',
|
||||||
|
header: 'Nama Produk',
|
||||||
|
accessorFn: (row) => row.product_warehouse?.product?.name ?? '-',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 'warehouse_name',
|
||||||
|
header: 'Gudang',
|
||||||
|
accessorFn: (row) => row.product_warehouse?.warehouse?.name ?? '-',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 'created_at',
|
||||||
|
header: 'Tanggal',
|
||||||
|
accessorFn: (row) =>
|
||||||
|
new Date(row.created_at).toLocaleDateString('id-ID', {
|
||||||
|
day: '2-digit',
|
||||||
|
month: 'short',
|
||||||
|
year: 'numeric',
|
||||||
|
}),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 'before_quantity',
|
||||||
|
header: 'Stok Sebelum',
|
||||||
|
accessorFn: (row) => formatNumber(String(row.before_quantity)),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 'after_quantity',
|
||||||
|
header: 'Stok Sesudah',
|
||||||
|
accessorFn: (row) => formatNumber(String(row.after_quantity)),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 'quantity',
|
||||||
|
header: 'Kuantitas',
|
||||||
|
accessorFn: (row) => formatNumber(String(row.quantity)),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 'transaction_type',
|
||||||
|
header: 'Tipe Transaksi',
|
||||||
|
accessorFn: (row) => {
|
||||||
|
if (row.transaction_type === 'INCREASE') return 'Peningkatan';
|
||||||
|
if (row.transaction_type === 'DECREASE') return 'Penurunan';
|
||||||
|
return '-';
|
||||||
|
},
|
||||||
|
cell: (props) => {
|
||||||
|
const type = props.row.original.transaction_type;
|
||||||
|
const label =
|
||||||
|
type === 'INCREASE'
|
||||||
|
? 'Peningkatan'
|
||||||
|
: type === 'DECREASE'
|
||||||
|
? 'Penurunan'
|
||||||
|
: '-';
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div
|
||||||
|
className={`small mx-auto badge badge-soft ${
|
||||||
|
type === 'INCREASE'
|
||||||
|
? 'badge-success'
|
||||||
|
: 'badge-error'
|
||||||
|
}`}
|
||||||
|
>
|
||||||
|
{label}
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 'created_by',
|
||||||
|
header: 'Oleh',
|
||||||
|
accessorFn: (row) => row.created_user?.name ?? '-',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 'actions',
|
||||||
|
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;
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
{currentPageSize > 2 && (
|
||||||
|
<RowDropdownOptions isLast2Rows={isLast2Rows}>
|
||||||
|
<RowOptionsMenu type='dropdown' props={props} />
|
||||||
|
</RowDropdownOptions>
|
||||||
|
)}
|
||||||
|
{currentPageSize <= 2 && (
|
||||||
|
<RowCollapseOptions>
|
||||||
|
<RowOptionsMenu type='dropdown' props={props} />
|
||||||
|
</RowCollapseOptions>
|
||||||
|
)}
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
// Handler
|
||||||
|
const searchChangeHandler: ChangeEventHandler<HTMLInputElement> = (e) => {
|
||||||
|
updateFilter('search', e.target.value);
|
||||||
|
};
|
||||||
|
|
||||||
|
const pageSizeChangeHandler = (val: OptionType | OptionType[] | null) => {
|
||||||
|
const newVal = val as OptionType;
|
||||||
|
setPageSize(newVal.value as number);
|
||||||
|
};
|
||||||
|
|
||||||
|
const updateSortingFilter = useCallback(
|
||||||
|
(
|
||||||
|
sortName: Exclude<keyof typeof tableFilterState, 'page' | 'pageSize'>,
|
||||||
|
sortFilter: ColumnSort | undefined
|
||||||
|
) => {
|
||||||
|
if (!sortFilter) {
|
||||||
|
updateFilter(sortName, '');
|
||||||
|
} else {
|
||||||
|
updateFilter(sortName, sortFilter.desc ? 'desc' : 'asc');
|
||||||
|
}
|
||||||
|
},
|
||||||
|
[updateFilter]
|
||||||
|
);
|
||||||
|
|
||||||
|
// Effect
|
||||||
|
useEffect(() => {
|
||||||
|
const productCategorySortFilter = sorting.find(
|
||||||
|
(sortItem) => sortItem.id === 'productCategory'
|
||||||
|
);
|
||||||
|
const productSortFilter = sorting.find(
|
||||||
|
(sortItem) => sortItem.id === 'product'
|
||||||
|
);
|
||||||
|
const warehouseSortFilter = sorting.find(
|
||||||
|
(sortItem) => sortItem.id === 'warehouse'
|
||||||
|
);
|
||||||
|
const stockSortFilter = sorting.find((sortItem) => sortItem.id === 'stock');
|
||||||
|
|
||||||
|
updateSortingFilter('productCategorySort', productCategorySortFilter);
|
||||||
|
updateSortingFilter('productSort', productSortFilter);
|
||||||
|
updateSortingFilter('warehouseSort', warehouseSortFilter);
|
||||||
|
updateSortingFilter('stockSort', stockSortFilter);
|
||||||
|
}, [sorting]);
|
||||||
|
|
||||||
|
// Utils Function
|
||||||
|
const formatNumber = (value: string) => {
|
||||||
|
const numericValue = value.replace(/[^0-9.]/g, '');
|
||||||
|
const [integer, decimal] = numericValue.split('.');
|
||||||
|
const formattedInteger = integer.replace(/\B(?=(\d{3})+(?!\d))/g, ',');
|
||||||
|
return decimal ? `${formattedInteger}.${decimal}` : formattedInteger;
|
||||||
|
};
|
||||||
|
|
||||||
|
// Render
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<div className='w-full p-0 sm:p-4'>
|
||||||
|
<div className='flex flex-col gap-2 mb-4'>
|
||||||
|
<div className='w-full flex flex-col sm:flex-row justify-between items-end sm:items-center gap-2'>
|
||||||
|
<div className='flex flex-row'>
|
||||||
|
<Button href='/inventory/adjustment/add' color='primary'>
|
||||||
|
<Icon icon='ic:round-plus' width={24} height={24} />
|
||||||
|
Tambah Stock Adjustment
|
||||||
|
</Button>
|
||||||
|
|
||||||
|
{/* <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'>
|
||||||
|
<SelectInput
|
||||||
|
label='Baris'
|
||||||
|
options={ROWS_OPTIONS}
|
||||||
|
value={{
|
||||||
|
label: String(tableFilterState.pageSize),
|
||||||
|
value: tableFilterState.pageSize,
|
||||||
|
}}
|
||||||
|
onChange={pageSizeChangeHandler}
|
||||||
|
className={{ wrapper: 'max-w-28' }}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<Table<InventoryAdjustment>
|
||||||
|
data={
|
||||||
|
isResponseSuccess(inventoryAdjustments)
|
||||||
|
? inventoryAdjustments?.data
|
||||||
|
: []
|
||||||
|
}
|
||||||
|
columns={inventoryAdjustmentsColumns}
|
||||||
|
pageSize={tableFilterState.pageSize}
|
||||||
|
page={
|
||||||
|
isResponseSuccess(inventoryAdjustments)
|
||||||
|
? inventoryAdjustments?.meta?.page
|
||||||
|
: 0
|
||||||
|
}
|
||||||
|
totalItems={
|
||||||
|
isResponseSuccess(inventoryAdjustments)
|
||||||
|
? inventoryAdjustments?.meta?.total_results
|
||||||
|
: 0
|
||||||
|
}
|
||||||
|
onPageChange={setPage}
|
||||||
|
isLoading={isLoading}
|
||||||
|
sorting={sorting}
|
||||||
|
setSorting={setSorting}
|
||||||
|
className={{
|
||||||
|
containerClassName: cn({
|
||||||
|
'mb-20':
|
||||||
|
isResponseSuccess(inventoryAdjustments) &&
|
||||||
|
inventoryAdjustments?.data?.length === 0,
|
||||||
|
}),
|
||||||
|
tableWrapperClassName: 'overflow-x-auto min-h-full!',
|
||||||
|
tableClassName: 'font-inter w-full table-auto min-h-full!',
|
||||||
|
headerRowClassName: 'border-b border-b-gray-200',
|
||||||
|
headerColumnClassName:
|
||||||
|
'px-6 py-3 text-xs font-semibold text-gray-500 last:flex last:flex-row last:justify-end',
|
||||||
|
bodyRowClassName: 'border-b border-b-gray-200',
|
||||||
|
bodyColumnClassName:
|
||||||
|
'px-6 py-3 last:flex last:flex-row last:justify-end',
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default InventoryAdjustmentTable;
|
||||||
@@ -0,0 +1,34 @@
|
|||||||
|
import * as Yup from 'yup';
|
||||||
|
|
||||||
|
export const InventoryAdjustmentFormSchema = Yup.object({
|
||||||
|
product_category: Yup.object({
|
||||||
|
value: Yup.number().required('ID Kategori Produk wajib diisi!'),
|
||||||
|
label: Yup.string().required('Nama Kategori Produk wajib diisi!'),
|
||||||
|
}).nullable(),
|
||||||
|
product_category_id: Yup.number().nullable(),
|
||||||
|
|
||||||
|
product: Yup.object({
|
||||||
|
value: Yup.number().required('ID Produk wajib diisi!'),
|
||||||
|
label: Yup.string().required('Nama Produk wajib diisi!'),
|
||||||
|
}).required('Produk wajib diisi!'),
|
||||||
|
product_id: Yup.number().required('ID Produk wajib diisi!'),
|
||||||
|
|
||||||
|
warehouse: Yup.object({
|
||||||
|
value: Yup.number().required('ID Gudang wajib diisi!'),
|
||||||
|
label: Yup.string().required('Nama Gudang wajib diisi!'),
|
||||||
|
}).required('Gudang wajib diisi!'),
|
||||||
|
warehouse_id: Yup.number().required('ID Gudang wajib diisi!'),
|
||||||
|
|
||||||
|
transaction_type: Yup.string()
|
||||||
|
.oneOf(['increase', 'decrease'], 'Tipe transaksi tidak valid')
|
||||||
|
.required('Tipe transaksi wajib diisi'),
|
||||||
|
quantity: Yup.number()
|
||||||
|
.typeError('Kuantitas harus berupa angka')
|
||||||
|
.min(1, 'Minimal kuantitas adalah 1')
|
||||||
|
.required('Kuantitas wajib diisi'),
|
||||||
|
note: Yup.string().required('Catatan wajib diisi!'),
|
||||||
|
});
|
||||||
|
|
||||||
|
export type InventoryAdjustmentFormValues = Yup.InferType<
|
||||||
|
typeof InventoryAdjustmentFormSchema
|
||||||
|
>;
|
||||||
@@ -0,0 +1,385 @@
|
|||||||
|
'use client';
|
||||||
|
|
||||||
|
import { isResponseError, isResponseSuccess } from '@/lib/api-helper';
|
||||||
|
import { inventoryAdjustmentApi } from '@/services/api/inventory';
|
||||||
|
import {
|
||||||
|
CreateInventoryAdjustmentPayload,
|
||||||
|
InventoryAdjustment,
|
||||||
|
} from '@/types/api/inventory/adjustment';
|
||||||
|
import { useFormik } from 'formik';
|
||||||
|
import { useRouter } from 'next/navigation';
|
||||||
|
import { use, useCallback, useEffect, useMemo, useState } from 'react';
|
||||||
|
import toast from 'react-hot-toast';
|
||||||
|
import {
|
||||||
|
InventoryAdjustmentFormSchema,
|
||||||
|
InventoryAdjustmentFormValues,
|
||||||
|
} from './InventoryAdjustmentForm.schema';
|
||||||
|
import useSWR from 'swr';
|
||||||
|
import {
|
||||||
|
ProductApi,
|
||||||
|
ProductCategoryApi,
|
||||||
|
WarehouseApi,
|
||||||
|
} from '@/services/api/master-data';
|
||||||
|
import Button from '@/components/Button';
|
||||||
|
import { Icon } from '@iconify/react';
|
||||||
|
import SelectInput, { OptionType } from '@/components/input/SelectInput';
|
||||||
|
import TextInput from '@/components/input/TextInput';
|
||||||
|
import RadioInput from '@/components/input/RadioInput';
|
||||||
|
import TextArea from '@/components/input/TextArea';
|
||||||
|
|
||||||
|
interface InventoryAdjustmentFormProps {
|
||||||
|
type?: 'add' | 'edit' | 'detail';
|
||||||
|
initialValues?: InventoryAdjustment;
|
||||||
|
}
|
||||||
|
const InventoryAdjustmentForm = ({
|
||||||
|
type = 'add',
|
||||||
|
initialValues,
|
||||||
|
}: InventoryAdjustmentFormProps) => {
|
||||||
|
// State
|
||||||
|
const router = useRouter();
|
||||||
|
const [
|
||||||
|
InventoryAdjustmentFormErrorMessage,
|
||||||
|
setInventoryAdjustmentFormErrorMessage,
|
||||||
|
] = useState('');
|
||||||
|
const [selectedProductCategories, setSelectedProductCategories] =
|
||||||
|
useState('');
|
||||||
|
const [disabledProduct, setDisabledProduct] = useState(true);
|
||||||
|
const [optionsProduct, setOptionsProduct] = useState<OptionType[]>([]);
|
||||||
|
const [quantityLabel, setQuantityLabel] = useState('Kurangi Stok');
|
||||||
|
const [transactionType, setTransactionType] = useState('increment');
|
||||||
|
|
||||||
|
// Submit Handler
|
||||||
|
const createInventoryAdjustmentHandler = useCallback(
|
||||||
|
async (payload: CreateInventoryAdjustmentPayload) => {
|
||||||
|
const createInventoryAdjustmentRes = await inventoryAdjustmentApi.create(
|
||||||
|
payload
|
||||||
|
);
|
||||||
|
|
||||||
|
if (isResponseError(createInventoryAdjustmentRes)) {
|
||||||
|
setInventoryAdjustmentFormErrorMessage(
|
||||||
|
createInventoryAdjustmentRes.message
|
||||||
|
);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
toast.success(createInventoryAdjustmentRes?.message as string);
|
||||||
|
router.push('/inventory/adjustment');
|
||||||
|
},
|
||||||
|
[router]
|
||||||
|
);
|
||||||
|
|
||||||
|
const formikInitialValues = useMemo<InventoryAdjustmentFormValues>(() => {
|
||||||
|
return {
|
||||||
|
product_category_id: initialValues?.product_category?.id ?? 0,
|
||||||
|
product_id: initialValues?.product?.id ?? 0,
|
||||||
|
warehouse_id: initialValues?.warehouse?.id ?? 0,
|
||||||
|
product_category: {
|
||||||
|
value: initialValues?.product_category?.id ?? 0,
|
||||||
|
label: initialValues?.product_category?.name ?? '',
|
||||||
|
},
|
||||||
|
product: {
|
||||||
|
value: initialValues?.product?.id ?? 0,
|
||||||
|
label: initialValues?.product?.name ?? '',
|
||||||
|
},
|
||||||
|
warehouse: {
|
||||||
|
value: initialValues?.warehouse?.id ?? 0,
|
||||||
|
label: initialValues?.warehouse?.name ?? '',
|
||||||
|
},
|
||||||
|
quantity: initialValues?.quantity ?? 0,
|
||||||
|
transaction_type: initialValues?.transaction_type ?? 'increase',
|
||||||
|
note: initialValues?.note ?? '',
|
||||||
|
};
|
||||||
|
}, [initialValues]);
|
||||||
|
|
||||||
|
// Formik
|
||||||
|
const formik = useFormik<InventoryAdjustmentFormValues>({
|
||||||
|
initialValues: formikInitialValues,
|
||||||
|
validationSchema: InventoryAdjustmentFormSchema,
|
||||||
|
onSubmit: async (values) => {
|
||||||
|
setInventoryAdjustmentFormErrorMessage('');
|
||||||
|
const payload: CreateInventoryAdjustmentPayload = {
|
||||||
|
product_id: values.product_id as number,
|
||||||
|
warehouse_id: values.warehouse_id as number,
|
||||||
|
quantity: values.quantity as number,
|
||||||
|
transaction_type: values.transaction_type as string,
|
||||||
|
note: values.note,
|
||||||
|
};
|
||||||
|
|
||||||
|
switch (type) {
|
||||||
|
case 'add':
|
||||||
|
await createInventoryAdjustmentHandler(payload);
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
// Fetch Data
|
||||||
|
const productCategoriesUrl = `${
|
||||||
|
ProductCategoryApi.basePath
|
||||||
|
}?${new URLSearchParams({
|
||||||
|
search: '',
|
||||||
|
}).toString()}`;
|
||||||
|
const { data: productCategories, isLoading: isLoadingProductCategories } =
|
||||||
|
useSWR(productCategoriesUrl, ProductCategoryApi.getAllFetcher);
|
||||||
|
|
||||||
|
const productUrl = `${ProductApi.basePath}?${new URLSearchParams({
|
||||||
|
search: '',
|
||||||
|
product_category_id: selectedProductCategories,
|
||||||
|
}).toString()}`;
|
||||||
|
const { data: products, isLoading: isLoadingProducts } = useSWR(
|
||||||
|
productUrl,
|
||||||
|
ProductApi.getAllFetcher
|
||||||
|
);
|
||||||
|
|
||||||
|
const warehouseUrl = `${WarehouseApi.basePath}?${new URLSearchParams({
|
||||||
|
search: '',
|
||||||
|
}).toString()}`;
|
||||||
|
const { data: warehouses, isLoading: isLoadingWarehouses } = useSWR(
|
||||||
|
warehouseUrl,
|
||||||
|
WarehouseApi.getAllFetcher
|
||||||
|
);
|
||||||
|
|
||||||
|
// Map Data to Options
|
||||||
|
const optionsProductCategory = isResponseSuccess(productCategories)
|
||||||
|
? productCategories?.data.map((productCategory) => ({
|
||||||
|
value: productCategory.id,
|
||||||
|
label: productCategory.name,
|
||||||
|
}))
|
||||||
|
: [];
|
||||||
|
const optionsWarehouse = isResponseSuccess(warehouses)
|
||||||
|
? warehouses?.data.map((warehouse) => ({
|
||||||
|
value: warehouse.id,
|
||||||
|
label: warehouse.name,
|
||||||
|
}))
|
||||||
|
: [];
|
||||||
|
|
||||||
|
// Options Handler
|
||||||
|
const productCategoryChangeHandler = (
|
||||||
|
val: OptionType | OptionType[] | null
|
||||||
|
) => {
|
||||||
|
formik.setFieldTouched('product_category_id', true);
|
||||||
|
formik.setFieldValue('product_category_id', (val as OptionType)?.value);
|
||||||
|
|
||||||
|
formik.setFieldValue('product_category', val);
|
||||||
|
setSelectedProductCategories((val as OptionType)?.value as string);
|
||||||
|
const disabled = (val as OptionType)?.value == null;
|
||||||
|
setDisabledProduct(disabled);
|
||||||
|
if (disabled) {
|
||||||
|
formik.setFieldValue('product_id', 0);
|
||||||
|
formik.setFieldValue('product', {
|
||||||
|
value: 0,
|
||||||
|
label: '',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const productChangeHandler = (val: OptionType | OptionType[] | null) => {
|
||||||
|
formik.setFieldValue('product', val);
|
||||||
|
|
||||||
|
formik.setFieldTouched('product_id', true);
|
||||||
|
formik.setFieldValue('product_id', (val as OptionType)?.value);
|
||||||
|
};
|
||||||
|
|
||||||
|
const warehouseChangeHandler = (val: OptionType | OptionType[] | null) => {
|
||||||
|
formik.setFieldValue('warehouse', val);
|
||||||
|
|
||||||
|
formik.setFieldTouched('warehouse_id', true);
|
||||||
|
formik.setFieldValue('warehouse_id', (val as OptionType)?.value);
|
||||||
|
};
|
||||||
|
|
||||||
|
const { setValues: formikSetValues } = formik;
|
||||||
|
|
||||||
|
// Effect
|
||||||
|
useEffect(() => {
|
||||||
|
formikSetValues(formikInitialValues);
|
||||||
|
}, [formikSetValues, formikInitialValues]);
|
||||||
|
useEffect(() => {
|
||||||
|
if (isResponseSuccess(products)) {
|
||||||
|
const options = products.data.map((p) => ({
|
||||||
|
value: p.id,
|
||||||
|
label: p.name,
|
||||||
|
}));
|
||||||
|
setOptionsProduct(options);
|
||||||
|
}
|
||||||
|
}, [products]);
|
||||||
|
|
||||||
|
// Utils Function
|
||||||
|
const formatNumber = (value: string) => {
|
||||||
|
const numericValue = value.replace(/[^0-9.]/g, '');
|
||||||
|
const [integer, decimal] = numericValue.split('.');
|
||||||
|
const formattedInteger = integer.replace(/\B(?=(\d{3})+(?!\d))/g, ',');
|
||||||
|
return decimal ? `${formattedInteger}.${decimal}` : formattedInteger;
|
||||||
|
};
|
||||||
|
|
||||||
|
// Render
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<section className='w-full max-w-xl'>
|
||||||
|
<header className='flex flex-col gap-4'>
|
||||||
|
<Button
|
||||||
|
href='/inventory/adjustment'
|
||||||
|
variant='link'
|
||||||
|
className='w-fit p-0 text-primary'
|
||||||
|
>
|
||||||
|
<Icon icon='uil:arrow-left' width={24} height={24} />
|
||||||
|
Kembali
|
||||||
|
</Button>
|
||||||
|
|
||||||
|
<h1 className='text-2xl font-bold text-center'>
|
||||||
|
{type === 'add' && 'Tambah Stock Adjustment'}
|
||||||
|
{type === 'detail' && 'Detail Stock Adjustment'}
|
||||||
|
</h1>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<form
|
||||||
|
onSubmit={formik.handleSubmit}
|
||||||
|
onReset={formik.handleReset}
|
||||||
|
className='w-full mt-8 flex flex-col gap-6'
|
||||||
|
>
|
||||||
|
<div className='flex flex-col gap-4'>
|
||||||
|
{/* Select Input Product Category */}
|
||||||
|
<SelectInput
|
||||||
|
required
|
||||||
|
label='Kategori Produk'
|
||||||
|
value={formik.values.product_category as OptionType}
|
||||||
|
onChange={productCategoryChangeHandler}
|
||||||
|
onInputChange={setSelectedProductCategories}
|
||||||
|
options={optionsProductCategory}
|
||||||
|
isLoading={isLoadingProductCategories}
|
||||||
|
isError={
|
||||||
|
formik.touched.product_category &&
|
||||||
|
Boolean(formik.errors.product_category)
|
||||||
|
}
|
||||||
|
errorMessage={formik.errors.product_category as string}
|
||||||
|
isDisabled={type === 'detail'}
|
||||||
|
isClearable
|
||||||
|
/>
|
||||||
|
|
||||||
|
{/* Select Input Product */}
|
||||||
|
<SelectInput
|
||||||
|
required
|
||||||
|
label='Produk'
|
||||||
|
value={formik.values.product as OptionType}
|
||||||
|
onChange={productChangeHandler}
|
||||||
|
options={optionsProduct}
|
||||||
|
isLoading={isLoadingProducts}
|
||||||
|
isError={formik.touched.product && Boolean(formik.errors.product)}
|
||||||
|
errorMessage={formik.errors.product as string}
|
||||||
|
isDisabled={type === 'detail' || disabledProduct}
|
||||||
|
isClearable
|
||||||
|
/>
|
||||||
|
|
||||||
|
{/* Select Input Warehouse */}
|
||||||
|
<SelectInput
|
||||||
|
required
|
||||||
|
label='Warehouse'
|
||||||
|
value={formik.values.warehouse as OptionType}
|
||||||
|
onChange={warehouseChangeHandler}
|
||||||
|
options={optionsWarehouse}
|
||||||
|
isLoading={isLoadingWarehouses}
|
||||||
|
isError={
|
||||||
|
formik.touched.warehouse && Boolean(formik.errors.warehouse)
|
||||||
|
}
|
||||||
|
errorMessage={formik.errors.warehouse as string}
|
||||||
|
isDisabled={type === 'detail'}
|
||||||
|
isClearable
|
||||||
|
/>
|
||||||
|
|
||||||
|
{/* Number Input Stock */}
|
||||||
|
<TextInput
|
||||||
|
required
|
||||||
|
label={quantityLabel}
|
||||||
|
name='quantity'
|
||||||
|
type='text'
|
||||||
|
value={formatNumber(String(formik.values.quantity))}
|
||||||
|
onChange={(e) => {
|
||||||
|
const rawValue = e.target.value.replace(/,/g, '');
|
||||||
|
const numericValue = parseFloat(rawValue);
|
||||||
|
if (!isNaN(numericValue)) {
|
||||||
|
formik.setFieldValue('quantity', numericValue);
|
||||||
|
} else {
|
||||||
|
formik.setFieldValue('quantity', 0);
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
onBlur={formik.handleBlur}
|
||||||
|
isError={
|
||||||
|
formik.touched.quantity && Boolean(formik.errors.quantity)
|
||||||
|
}
|
||||||
|
errorMessage={formik.errors.quantity as string}
|
||||||
|
readOnly={type === 'detail'}
|
||||||
|
/>
|
||||||
|
{/* Radio Button Flag Stock */}
|
||||||
|
<RadioInput
|
||||||
|
name='transaction_type'
|
||||||
|
label='Tipe Transaksi'
|
||||||
|
options={[
|
||||||
|
{ label: 'Tambah', value: 'increase' },
|
||||||
|
{ label: 'Kurang', value: 'decrease' },
|
||||||
|
]}
|
||||||
|
value={formik.values.transaction_type}
|
||||||
|
onChange={(e) => {
|
||||||
|
formik.handleChange(e);
|
||||||
|
// kamu juga bisa menambahkan efek tambahan
|
||||||
|
setQuantityLabel(
|
||||||
|
e.target.value === 'increase' ? 'Tambah Stok' : 'Kurangi Stok'
|
||||||
|
);
|
||||||
|
}}
|
||||||
|
onBlur={formik.handleBlur}
|
||||||
|
isError={
|
||||||
|
formik.touched.transaction_type &&
|
||||||
|
Boolean(formik.errors.transaction_type)
|
||||||
|
}
|
||||||
|
errorMessage={formik.errors.transaction_type as string}
|
||||||
|
variant='radio-primary'
|
||||||
|
required
|
||||||
|
bottomLabel='Pilih salah satu tipe transaksi'
|
||||||
|
/>
|
||||||
|
|
||||||
|
{/* Text Area Input Reason */}
|
||||||
|
<TextArea
|
||||||
|
required
|
||||||
|
label='Alasan'
|
||||||
|
name='note'
|
||||||
|
value={formik.values.note as string}
|
||||||
|
onChange={formik.handleChange}
|
||||||
|
onBlur={formik.handleBlur}
|
||||||
|
isError={formik.touched.note && Boolean(formik.errors.note)}
|
||||||
|
errorMessage={formik.errors.note as string}
|
||||||
|
readOnly={type === 'detail'}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div className='flex flex-row justify-between gap-2 flex-wrap'>
|
||||||
|
{type !== 'detail' && (
|
||||||
|
<div className='flex flex-row justify-end gap-2'>
|
||||||
|
<Button type='reset' color='warning' className='px-4'>
|
||||||
|
Reset
|
||||||
|
</Button>
|
||||||
|
<Button
|
||||||
|
type='submit'
|
||||||
|
color='primary'
|
||||||
|
isLoading={formik.isSubmitting}
|
||||||
|
disabled={!formik.isValid || formik.isSubmitting}
|
||||||
|
className='px-4'
|
||||||
|
>
|
||||||
|
Submit
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
{InventoryAdjustmentFormErrorMessage && (
|
||||||
|
<div role='alert' className='alert alert-error'>
|
||||||
|
<Icon
|
||||||
|
icon='material-symbols:error-outline'
|
||||||
|
width={24}
|
||||||
|
height={24}
|
||||||
|
/>
|
||||||
|
<span>{InventoryAdjustmentFormErrorMessage}</span>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</section>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default InventoryAdjustmentForm;
|
||||||
@@ -79,6 +79,18 @@ export const MAIN_DRAWER_LINKS: MAIN_DRAWER_MENU[] = [
|
|||||||
},
|
},
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
title: 'Persediaan',
|
||||||
|
link: '/inventory',
|
||||||
|
icon: 'material-symbols:box-outline-rounded',
|
||||||
|
submenu: [
|
||||||
|
{
|
||||||
|
title: 'Penyesuaian Stok',
|
||||||
|
link: '/inventory/adjustment',
|
||||||
|
icon: 'material-symbols:box-edit-outline-rounded',
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
] as const;
|
] as const;
|
||||||
|
|
||||||
export const ROWS_OPTIONS = [
|
export const ROWS_OPTIONS = [
|
||||||
|
|||||||
@@ -0,0 +1,11 @@
|
|||||||
|
import {
|
||||||
|
InventoryAdjustment,
|
||||||
|
CreateInventoryAdjustmentPayload,
|
||||||
|
} from '@/types/api/inventory/adjustment';
|
||||||
|
import { BaseApiService } from './base';
|
||||||
|
|
||||||
|
export const inventoryAdjustmentApi = new BaseApiService<
|
||||||
|
InventoryAdjustment,
|
||||||
|
CreateInventoryAdjustmentPayload,
|
||||||
|
unknown
|
||||||
|
>('/inventory/adjustments');
|
||||||
+31
@@ -0,0 +1,31 @@
|
|||||||
|
import { ProductCategory } from '@/types/api/master-data/product-category';
|
||||||
|
import { Product } from '@/types/api/master-data/product';
|
||||||
|
import { Warehouse } from '../master-data/warehouse';
|
||||||
|
|
||||||
|
export type BaseInventoryAdjustment = {
|
||||||
|
id: number;
|
||||||
|
transaction_type: string;
|
||||||
|
quantity: number;
|
||||||
|
before_quantity: number;
|
||||||
|
after_quantity: number;
|
||||||
|
note: string;
|
||||||
|
product_warehouse_id: number;
|
||||||
|
product_warehouse: {
|
||||||
|
id: number;
|
||||||
|
quantity: number;
|
||||||
|
product_id: number;
|
||||||
|
warehouse_id: number;
|
||||||
|
product: Product;
|
||||||
|
warehouse: Warehouse;
|
||||||
|
};
|
||||||
|
};
|
||||||
|
|
||||||
|
export type InventoryAdjustment = BaseMetadata & BaseInventoryAdjustment;
|
||||||
|
|
||||||
|
export type CreateInventoryAdjustmentPayload = {
|
||||||
|
product_id: number;
|
||||||
|
warehouse_id: number;
|
||||||
|
transaction_type: string;
|
||||||
|
quantity: number;
|
||||||
|
note: string;
|
||||||
|
};
|
||||||
Reference in New Issue
Block a user