diff --git a/src/app/inventory/adjustment/detail/page.tsx b/src/app/inventory/adjustment/detail/page.tsx index 432fa3fd..5e96c86a 100644 --- a/src/app/inventory/adjustment/detail/page.tsx +++ b/src/app/inventory/adjustment/detail/page.tsx @@ -2,9 +2,7 @@ import { useEffect, useState } from 'react'; import { useRouter } from 'next/navigation'; -import useSWR from 'swr'; import InventoryAdjustmentForm from '@/components/pages/inventory/adjustment/form/InventoryAdjustmentForm'; -import { inventoryAdjustmentApi } from '@/services/api/inventory'; import type { InventoryAdjustment } from '@/types/api/inventory/adjustment'; const DetailInventoryAdjustment = () => { diff --git a/src/app/inventory/adjustment/page.tsx b/src/app/inventory/adjustment/page.tsx index 95199079..518fd0bf 100644 --- a/src/app/inventory/adjustment/page.tsx +++ b/src/app/inventory/adjustment/page.tsx @@ -1,4 +1,3 @@ -import InventoryAdjustmentForm from '@/components/pages/inventory/adjustment/form/InventoryAdjustmentForm'; import InventoryAdjustmentTable from '@/components/pages/inventory/adjustment/InventoryAdjustmentTable'; const InventoryAdjustment = () => { diff --git a/src/components/input/RadioInput.tsx b/src/components/input/RadioInput.tsx index de3f23f5..71a731aa 100644 --- a/src/components/input/RadioInput.tsx +++ b/src/components/input/RadioInput.tsx @@ -14,7 +14,7 @@ export interface RadioInputProps { name: string; value?: string; options: RadioOption[]; - variant?: string; // contoh: 'radio-primary', 'radio-secondary', dll + variant?: string; className?: { wrapper?: string; label?: string; @@ -41,7 +41,6 @@ const RadioInput = ({ variant = 'radio-primary', className, isError, - isValid, errorMessage, required = false, disabled = false, diff --git a/src/components/pages/inventory/adjustment/InventoryAdjustmentTable.tsx b/src/components/pages/inventory/adjustment/InventoryAdjustmentTable.tsx index 449ae3a7..45cfd3f3 100644 --- a/src/components/pages/inventory/adjustment/InventoryAdjustmentTable.tsx +++ b/src/components/pages/inventory/adjustment/InventoryAdjustmentTable.tsx @@ -1,11 +1,8 @@ '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'; @@ -14,45 +11,13 @@ 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 { useCallback, useEffect, useState } from 'react'; import useSWR from 'swr'; -const RowOptionsMenu = ({ - type = 'dropdown', - props, -}: { - type: 'dropdown' | 'collapse'; - props: CellContext; -}) => { - return ( -
- -
- ); -}; - const InventoryAdjustmentTable = () => { const { state: tableFilterState, @@ -82,15 +47,12 @@ const InventoryAdjustmentTable = () => { const { data: inventoryAdjustments, isLoading, - mutate: refreshInventoryAdjustments, } = useSWR( `${inventoryAdjustmentApi.basePath}${getTableFilterQueryString()}`, inventoryAdjustmentApi.getAllFetcher ); // State - const [selectedInventoryAdjustment, setSelectedInventoryAdjustment] = - useState(undefined); const [sorting, setSorting] = useState([]); // Columns @@ -170,40 +132,9 @@ const InventoryAdjustmentTable = () => { 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 && ( - // - // - // - // )} - // {currentPageSize <= 2 && ( - // - // - // - // )} - // - // ); - // }, - // }, ]; // Handler - const searchChangeHandler: ChangeEventHandler = (e) => { - updateFilter('search', e.target.value); - }; - const pageSizeChangeHandler = (val: OptionType | OptionType[] | null) => { const newVal = val as OptionType; setPageSize(newVal.value as number); @@ -240,7 +171,7 @@ const InventoryAdjustmentTable = () => { updateSortingFilter('productSort', productSortFilter); updateSortingFilter('warehouseSort', warehouseSortFilter); updateSortingFilter('stockSort', stockSortFilter); - }, [sorting]); + }, [sorting, updateSortingFilter]); // Utils Function const formatNumber = (value: string) => { @@ -259,7 +190,7 @@ const InventoryAdjustmentTable = () => {
{/* ([]); const [quantityLabel, setQuantityLabel] = useState('Tambah Stok'); - const [transactionType, setTransactionType] = useState('increment'); // Submit Handler const createInventoryAdjustmentHandler = useCallback( @@ -99,23 +68,14 @@ const InventoryAdjustmentForm = ({ [router] ); - const formikInitialValues = useMemo(() => { + const formikInitialValues = useMemo>(() => { 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 ?? '', - }, + product_category: undefined, + product: undefined, + warehouse: undefined, quantity: initialValues?.quantity ?? 0, transaction_type: initialValues?.transaction_type ?? 'increase', note: initialValues?.note ?? '', @@ -125,7 +85,7 @@ const InventoryAdjustmentForm = ({ // Formik const formik = useFormik({ enableReinitialize: true, - initialValues: formikInitialValues, + initialValues: formikInitialValues as InventoryAdjustmentFormValues, validationSchema: InventoryAdjustmentFormSchema, onSubmit: async (values) => { setInventoryAdjustmentFormErrorMessage(''); @@ -198,10 +158,7 @@ const InventoryAdjustmentForm = ({ setDisabledProduct(disabled); if (disabled) { formik.setFieldValue('product_id', 0); - formik.setFieldValue('product', { - value: 0, - label: '', - }); + formik.setFieldValue('product', null); } }; @@ -219,6 +176,15 @@ const InventoryAdjustmentForm = ({ formik.setFieldValue('warehouse_id', (val as OptionType)?.value); }; + const resetHandler = () => { + formik.resetForm(); + setQuantityLabel('Tambah Stok'); + productCategoryChangeHandler(null); + productChangeHandler(null); + warehouseChangeHandler(null); + }; + + const { setValues: formikSetValues } = formik; // Effect @@ -228,28 +194,39 @@ const InventoryAdjustmentForm = ({ String(initialValues.product_warehouse.product.id) ); setDisabledProduct(false); - formik.setFieldValue('product_id', initialValues.product_warehouse.product.id); + formik.setFieldValue( + 'product_id', + initialValues.product_warehouse.product.id + ); formik.setFieldValue('product', { value: initialValues.product_warehouse.product.id, label: initialValues.product_warehouse.product.name, }); - formik.setFieldValue('warehouse_id', initialValues.product_warehouse.warehouse.id); + formik.setFieldValue( + 'warehouse_id', + initialValues.product_warehouse.warehouse.id + ); formik.setFieldValue('warehouse', { value: initialValues.product_warehouse.warehouse.id, label: initialValues.product_warehouse.warehouse.name, }); - formik.setFieldValue('quantity', initialValues.product_warehouse.quantity); - formik.setFieldValue('transaction_type', initialValues.transaction_type.toLowerCase()); + formik.setFieldValue( + 'quantity', + initialValues.product_warehouse.quantity + ); + formik.setFieldValue( + 'transaction_type', + initialValues.transaction_type.toLowerCase() + ); formik.setFieldValue('note', initialValues.note); } if (initialValues?.transaction_type) { const type = initialValues.transaction_type.toLowerCase(); - setTransactionType(type); setQuantityLabel(type === 'increase' ? 'Tambah Stok' : 'Kurangi Stok'); } - }, []); + }, [formik, initialValues, setQuantityLabel, setDisabledProduct, setSelectedProductCategories]); useEffect(() => { - // formikSetValues(formikInitialValues); + formikSetValues(formikInitialValues as InventoryAdjustmentFormValues); }, [formikSetValues, formikInitialValues]); useEffect(() => { if (isResponseSuccess(products)) { @@ -284,8 +261,8 @@ const InventoryAdjustmentForm = ({

- {type === 'add' && 'Tambah Stock Adjustment'} - {type === 'detail' && 'Detail Stock Adjustment'} + {type === 'add' && 'Tambah Penyesuaian Persediaan'} + {type === 'detail' && 'Detail Penyesuaian Persediaan'}

@@ -386,6 +363,7 @@ const InventoryAdjustmentForm = ({ errorMessage={formik.errors.quantity as string} readOnly={type === 'detail'} /> + {/* Radio Button Flag Stock */} { formik.handleChange(e); - // kamu juga bisa menambahkan efek tambahan setQuantityLabel( e.target.value === 'increase' ? 'Tambah Stok' : 'Kurangi Stok' ); @@ -430,31 +407,31 @@ const InventoryAdjustmentForm = ({
{type !== 'detail' && (
-
)} - {InventoryAdjustmentFormErrorMessage && ( -
- - {InventoryAdjustmentFormErrorMessage} -
- )}
+ {InventoryAdjustmentFormErrorMessage && ( +
+ + {InventoryAdjustmentFormErrorMessage} +
+ )} diff --git a/src/components/pages/master-data/customer/form/CustomerForm.tsx b/src/components/pages/master-data/customer/form/CustomerForm.tsx index ee824866..09e545be 100644 --- a/src/components/pages/master-data/customer/form/CustomerForm.tsx +++ b/src/components/pages/master-data/customer/form/CustomerForm.tsx @@ -41,7 +41,6 @@ const CustomerForm = ({ const [customerFormErrorMessage, setCustomerFormErrorMessage] = useState(''); const [isDeleteLoading, setIsDeleteLoading] = useState(false); const [picSelectInputValue, setPicSelectInputValue] = useState(''); - const [typeSelectInputValue, setTypeSelectInputValue] = useState(''); // Fetch Data const picUrl = `${UserApi.basePath}?${new URLSearchParams({ @@ -252,7 +251,6 @@ const CustomerForm = ({ } onChange={typeChangeHandler} options={typeOptions} - onInputChange={setTypeSelectInputValue} isError={formik.touched.type && Boolean(formik.errors.type)} errorMessage={formik.errors.type as string} isDisabled={formType === 'detail'} diff --git a/src/components/pages/master-data/supplier/form/SupplierForm.tsx b/src/components/pages/master-data/supplier/form/SupplierForm.tsx index fb4630ae..7215e136 100644 --- a/src/components/pages/master-data/supplier/form/SupplierForm.tsx +++ b/src/components/pages/master-data/supplier/form/SupplierForm.tsx @@ -42,8 +42,6 @@ const SupplierForm = ({ // Setup State const [supplierFormErrorMessage, setSupplierFormErrorMessage] = useState(''); const [isDeleteLoading, setIsDeleteLoading] = useState(false); - const [typeSelectInputValue, setTypeSelectInputValue] = useState(''); - const [categorySelectInputValue, setCategorySelectInputValue] = useState(''); const [hatcheryTagInputValue, setHatcheryTagInputValue] = useState(''); // -- Options data mapping @@ -108,8 +106,6 @@ const SupplierForm = ({ }; // Memo - console.log('Memo'); - console.log(initialValues); const formikInitialValues = useMemo(() => { return { name: initialValues?.name ?? '', @@ -125,7 +121,7 @@ const SupplierForm = ({ account_number: initialValues?.account_number ?? '', due_date: initialValues?.due_date ?? 1, }; - }, [initialValues]); + }, [initialValues, typeOptions, categoryOptions]); // Formik const formik = useFormik({ @@ -260,7 +256,6 @@ const SupplierForm = ({ } onChange={typeChangeHandler} options={typeOptions} - onInputChange={setTypeSelectInputValue} isError={formik.touched.type && Boolean(formik.errors.type)} errorMessage={formik.errors.type as string} isDisabled={formType === 'detail'} @@ -278,7 +273,6 @@ const SupplierForm = ({ } onChange={categoryChangeHandler} options={categoryOptions} - onInputChange={setCategorySelectInputValue} isError={ formik.touched.category && Boolean(formik.errors.category) } diff --git a/src/config/constant.ts b/src/config/constant.ts index 830953d5..ed68adb5 100644 --- a/src/config/constant.ts +++ b/src/config/constant.ts @@ -85,7 +85,7 @@ export const MAIN_DRAWER_LINKS: MAIN_DRAWER_MENU[] = [ icon: 'material-symbols:box-outline-rounded', submenu: [ { - title: 'Penyesuaian Stok', + title: 'Penyesuaian Persediaan', link: '/inventory/adjustment', icon: 'material-symbols:box-edit-outline-rounded', } diff --git a/src/types/api/inventory/adjustment.d.ts b/src/types/api/inventory/adjustment.d.ts index 268c9428..9d995919 100644 --- a/src/types/api/inventory/adjustment.d.ts +++ b/src/types/api/inventory/adjustment.d.ts @@ -1,4 +1,3 @@ -import { ProductCategory } from '@/types/api/master-data/product-category'; import { Product } from '@/types/api/master-data/product'; import { Warehouse } from '../master-data/warehouse';