Merge branch 'feat/FE/US-77/TASK-141-slicing-detail-page-for-transfer-to-laying' into 'feat/FE/US-77/transfer-to-laying'

[FEAT/FE][US#77/TASK#141] Slicing detail page for Transfer to Laying

See merge request mbugroup/lti-web-client!26
This commit is contained in:
Rivaldi A N S
2025-10-23 10:37:31 +00:00
5 changed files with 194 additions and 5 deletions
+2
View File
@@ -0,0 +1,2 @@
npm run lint
npm run build
+17
View File
@@ -35,6 +35,7 @@
"daisyui": "^5.1.12",
"eslint": "^9",
"eslint-config-next": "15.5.3",
"husky": "^9.1.7",
"tailwindcss": "^4",
"typescript": "^5"
}
@@ -4176,6 +4177,22 @@
"react-is": "^16.7.0"
}
},
"node_modules/husky": {
"version": "9.1.7",
"resolved": "https://registry.npmjs.org/husky/-/husky-9.1.7.tgz",
"integrity": "sha512-5gs5ytaNjBrh5Ow3zrvdUUY+0VxIuWVL4i9irt6friV+BqdCfmV11CQTWMiBYWHbXhco+J1kHfTOUkePhCDvMA==",
"dev": true,
"license": "MIT",
"bin": {
"husky": "bin.js"
},
"engines": {
"node": ">=18"
},
"funding": {
"url": "https://github.com/sponsors/typicode"
}
},
"node_modules/ignore": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.2.tgz",
+3 -1
View File
@@ -6,7 +6,8 @@
"dev": "eslint && next dev --turbopack",
"build": "next build --turbopack",
"start": "next start",
"lint": "eslint"
"lint": "eslint",
"prepare": "husky"
},
"dependencies": {
"@tanstack/match-sorter-utils": "^8.19.4",
@@ -36,6 +37,7 @@
"daisyui": "^5.1.12",
"eslint": "^9",
"eslint-config-next": "15.5.3",
"husky": "^9.1.7",
"tailwindcss": "^4",
"typescript": "^5"
}
@@ -42,10 +42,18 @@ const TransferToLayingForm = ({
initialValues,
}: TransferToLayingFormProps) => {
const router = useRouter();
// Modal hooks
const deleteModal = useModal();
const approveModal = useModal();
const rejectModal = useModal();
const [formErrorMessage, setFormErrorMessage] = useState('');
// Modal loading state
const [isDeleteLoading, setIsDeleteLoading] = useState(false);
const [isApproveLoading, setIsApproveLoading] = useState(false);
const [isRejectLoading, setIsRejectLoading] = useState(false);
const createTransferToLayingHandler = useCallback(
async (payload: CreateTransferToLayingPayload) => {
@@ -152,15 +160,65 @@ const TransferToLayingForm = ({
deleteModal.openModal();
};
const approveClickHandler = () => {
approveModal.openModal();
};
const rejectClickHandler = () => {
rejectModal.openModal();
};
// Modal confirm click handler
const confirmationModalDeleteClickHandler = async () => {
setIsDeleteLoading(true);
// TODO: delete data and integrate to real API
deleteModal.closeModal();
toast.success('Successfully delete TransferToLaying!');
toast.success('Berhasil menghapus data transfer ke laying!');
setIsDeleteLoading(false);
};
const confirmationModalApproveClickHandler = async () => {
setIsApproveLoading(true);
const approveResponse = await TransferToLayingApi.approve(
initialValues?.id as number
);
if (isResponseSuccess(approveResponse)) {
approveModal.closeModal();
toast.success('Berhasil approve data transfer ke laying!');
} else {
approveModal.closeModal();
toast.error('Gagal approve data transfer ke laying!');
}
setIsApproveLoading(false);
};
const confirmationModalRejectClickHandler = async () => {
setIsRejectLoading(true);
const rejectResponse = await TransferToLayingApi.reject(
initialValues?.id as number
);
if (isResponseSuccess(rejectResponse)) {
rejectModal.closeModal();
toast.success('Berhasil reject data transfer ke laying!');
} else {
rejectModal.closeModal();
toast.error('Gagal reject data transfer ke laying!');
}
setIsRejectLoading(false);
};
const isRepeaterInputError = (
column: keyof TransferToLayingFormValues['kandangs'][0],
idx: number
@@ -303,10 +361,38 @@ const TransferToLayingForm = ({
</h1>
</header>
<div className='w-full my-4 flex flex-row justify-end gap-2'>
{type === 'detail' && (
<>
<Button
variant='outline'
color='success'
onClick={approveClickHandler}
// disabled={selectedRowIds.length === 0}
className='w-full sm:w-fit'
>
<Icon icon='material-symbols:check' width={24} height={24} />
Approve
</Button>
<Button
variant='outline'
color='error'
onClick={rejectClickHandler}
// disabled={selectedRowIds.length === 0}
className='w-full sm:w-fit'
>
<Icon icon='material-symbols:close' width={24} height={24} />
Reject
</Button>
</>
)}
</div>
<form
onSubmit={formik.handleSubmit}
onReset={formik.handleReset}
className='w-full mt-8 flex flex-col gap-6'
className='w-full flex flex-col gap-6'
>
<div className='flex flex-col gap-4'>
<TextInput
@@ -494,7 +580,7 @@ const TransferToLayingForm = ({
<Button
type='button'
color='warning'
href={`/master-data/nonstock/detail/edit/?nonstockId=${initialValues?.id}`}
href={`/production/transfer-to-laying/detail/edit/?transferToLayingId=${initialValues?.id}`}
className='px-4'
>
<Icon
@@ -549,7 +635,7 @@ const TransferToLayingForm = ({
<ConfirmationModal
ref={deleteModal.ref}
type='error'
text='Apakah anda yakin ingin menghapus data TransferToLaying?'
text='Apakah anda yakin ingin menghapus data transfer ke laying ini?'
secondaryButton={{
text: 'Tidak',
}}
@@ -561,6 +647,40 @@ const TransferToLayingForm = ({
}}
/>
)}
{type === 'detail' && (
<>
<ConfirmationModal
ref={approveModal.ref}
type='success'
text='Apakah anda yakin ingin approve data transfer ke laying ini?'
secondaryButton={{
text: 'Tidak',
}}
primaryButton={{
text: 'Ya',
color: 'success',
isLoading: isApproveLoading,
onClick: confirmationModalApproveClickHandler,
}}
/>
<ConfirmationModal
ref={rejectModal.ref}
type='error'
text='Apakah anda yakin ingin reject data transfer ke laying ini?'
secondaryButton={{
text: 'Tidak',
}}
primaryButton={{
text: 'Ya',
color: 'error',
isLoading: isRejectLoading,
onClick: confirmationModalRejectClickHandler,
}}
/>
</>
)}
</>
);
};
@@ -776,6 +776,30 @@ export class TransferToLayingService extends BaseApiService<
}
}
// TODO: remove dummy data and integrate to real API
async approve(
id: number
): Promise<BaseApiResponse<{ message: string }> | undefined> {
try {
await sleep(750);
return {
code: 200,
status: 'success',
message: 'Berhasil approve data transfer ke laying!',
data: {
message: 'Berhasil approve data transfer ke laying!',
},
};
} catch (error) {
// if (axios.isAxiosError<BaseApiResponse<T>>(error)) {
// return error.response?.data;
// }
return undefined;
}
}
// TODO: remove dummy data and integrate to real API
async bulkApprove(
ids: number[]
@@ -800,6 +824,30 @@ export class TransferToLayingService extends BaseApiService<
}
}
// TODO: remove dummy data and integrate to real API
async reject(
id: number
): Promise<BaseApiResponse<{ message: string }> | undefined> {
try {
await sleep(750);
return {
code: 200,
status: 'success',
message: 'Berhasil reject data transfer ke laying!',
data: {
message: 'Berhasil reject data transfer ke laying!',
},
};
} catch (error) {
// if (axios.isAxiosError<BaseApiResponse<T>>(error)) {
// return error.response?.data;
// }
return undefined;
}
}
// TODO: remove dummy data and integrate to real API
async bulkReject(
ids: number[]