feat(FE-170,174): add notes input to approval and rejection confirmation modals

This commit is contained in:
rstubryan
2025-11-19 20:25:06 +07:00
parent 42253d123b
commit d3c3d9c9c6
@@ -14,6 +14,7 @@ import NumberInput from '@/components/input/NumberInput';
import SelectInput, { OptionType } from '@/components/input/SelectInput'; import SelectInput, { OptionType } from '@/components/input/SelectInput';
import CheckboxInput from '@/components/input/CheckboxInput'; import CheckboxInput from '@/components/input/CheckboxInput';
import ConfirmationModal from '@/components/modal/ConfirmationModal'; import ConfirmationModal from '@/components/modal/ConfirmationModal';
import ConfirmationModalWithNotes from '@/components/modal/ConfirmationModalWithNotes';
import { useModal } from '@/components/Modal'; import { useModal } from '@/components/Modal';
import Tooltip from '@/components/Tooltip'; import Tooltip from '@/components/Tooltip';
@@ -92,6 +93,7 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
const [isApproveLoading, setIsApproveLoading] = useState(false); const [isApproveLoading, setIsApproveLoading] = useState(false);
const [isRejectLoading, setIsRejectLoading] = useState(false); const [isRejectLoading, setIsRejectLoading] = useState(false);
const [approvalNotes, setApprovalNotes] = useState('');
const [recordingFormErrorMessage, setRecordingFormErrorMessage] = const [recordingFormErrorMessage, setRecordingFormErrorMessage] =
useState(''); useState('');
const [isDeleteLoading, setIsDeleteLoading] = useState(false); const [isDeleteLoading, setIsDeleteLoading] = useState(false);
@@ -1134,16 +1136,18 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
formik.values.project_flock_kandang_id, formik.values.project_flock_kandang_id,
]); ]);
const approveHandler = async () => { const approveHandler = async (notes: string) => {
setIsApproveLoading(true); setIsApproveLoading(true);
const approveResponse = await RecordingApi.approve( const approveResponse = await RecordingApi.approve(
initialValues?.id as number initialValues?.id as number,
notes
); );
if (isResponseSuccess(approveResponse)) { if (isResponseSuccess(approveResponse)) {
toast.success('Recording berhasil disetujui!'); toast.success('Recording berhasil disetujui!');
approveModal.closeModal(); approveModal.closeModal();
setApprovalNotes('');
await refreshApprovals(); await refreshApprovals();
router.push('/production/recording'); router.push('/production/recording');
} else { } else {
@@ -1156,17 +1160,18 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
setIsApproveLoading(false); setIsApproveLoading(false);
}; };
const rejectHandler = async () => { const rejectHandler = async (notes: string) => {
setIsRejectLoading(true); setIsRejectLoading(true);
const rejectResponse = await RecordingApi.reject( const rejectResponse = await RecordingApi.reject(
initialValues?.id as number, initialValues?.id as number,
'' notes
); );
if (isResponseSuccess(rejectResponse)) { if (isResponseSuccess(rejectResponse)) {
toast.success('Recording berhasil ditolak!'); toast.success('Recording berhasil ditolak!');
rejectModal.closeModal(); rejectModal.closeModal();
setApprovalNotes('');
await refreshApprovals(); await refreshApprovals();
router.push('/production/recording'); router.push('/production/recording');
} else { } else {
@@ -1477,7 +1482,10 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
<Button <Button
variant='outline' variant='outline'
color='success' color='success'
onClick={() => approveModal.openModal()} onClick={() => {
setApprovalNotes('');
approveModal.openModal();
}}
isLoading={isApproveLoading} isLoading={isApproveLoading}
className='w-full sm:w-fit' className='w-full sm:w-fit'
> >
@@ -1492,7 +1500,10 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
<Button <Button
variant='outline' variant='outline'
color='error' color='error'
onClick={() => rejectModal.openModal()} onClick={() => {
setApprovalNotes('');
rejectModal.openModal();
}}
isLoading={isRejectLoading} isLoading={isRejectLoading}
className='w-full sm:w-fit' className='w-full sm:w-fit'
> >
@@ -1778,7 +1789,7 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
<th> <th>
Berat Ayam (gram) Berat Ayam (gram)
<span <span
className='tooltip tooltip-error tooltip-bottom z-[9999]' className='tooltip tooltip-error tooltip-bottom '
data-tip='required' data-tip='required'
> >
<span className='text-error'>*</span> <span className='text-error'>*</span>
@@ -1787,7 +1798,7 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
<th> <th>
Jumlah Ayam Jumlah Ayam
<span <span
className='tooltip tooltip-error tooltip-bottom z-[9999]' className='tooltip tooltip-error tooltip-bottom'
data-tip='required' data-tip='required'
> >
<span className='text-error'>*</span> <span className='text-error'>*</span>
@@ -1796,7 +1807,7 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
<th> <th>
Rata-rata Berat Ayam (gram) Rata-rata Berat Ayam (gram)
<span <span
className='tooltip tooltip-error tooltip-bottom z-[9999]' className='tooltip tooltip-error tooltip-bottom '
data-tip='required' data-tip='required'
> >
<span className='text-error'>*</span> <span className='text-error'>*</span>
@@ -2014,7 +2025,7 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
<th> <th>
Persediaan Persediaan
<span <span
className='tooltip tooltip-error tooltip-bottom z-[9999]' className='tooltip tooltip-error tooltip-bottom '
data-tip='required' data-tip='required'
> >
<span className='text-error'>*</span> <span className='text-error'>*</span>
@@ -2023,7 +2034,7 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
<th> <th>
Jumlah Pakai Jumlah Pakai
<span <span
className='tooltip tooltip-error tooltip-bottom z-[9999]' className='tooltip tooltip-error tooltip-bottom '
data-tip='required' data-tip='required'
> >
<span className='text-error'>*</span> <span className='text-error'>*</span>
@@ -2234,7 +2245,7 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
<th> <th>
Kondisi Kondisi
<span <span
className='tooltip tooltip-error tooltip-bottom z-[9999]' className='tooltip tooltip-error tooltip-bottom '
data-tip='required' data-tip='required'
> >
<span className='text-error'>*</span> <span className='text-error'>*</span>
@@ -2243,7 +2254,7 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
<th> <th>
Jumlah Jumlah
<span <span
className='tooltip tooltip-error tooltip-bottom z-[9999]' className='tooltip tooltip-error tooltip-bottom '
data-tip='required' data-tip='required'
> >
<span className='text-error'>*</span> <span className='text-error'>*</span>
@@ -2444,7 +2455,7 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
<th> <th>
Kondisi Telur Kondisi Telur
<span <span
className='tooltip tooltip-error tooltip-bottom z-[9999]' className='tooltip tooltip-error tooltip-bottom '
data-tip='required' data-tip='required'
> >
<span className='text-error'>*</span> <span className='text-error'>*</span>
@@ -2453,7 +2464,7 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
<th> <th>
Jumlah Jumlah
<span <span
className='tooltip tooltip-error tooltip-bottom z-[9999]' className='tooltip tooltip-error tooltip-bottom '
data-tip='required' data-tip='required'
> >
<span className='text-error'>*</span> <span className='text-error'>*</span>
@@ -2852,12 +2863,13 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
{(type as 'add' | 'edit' | 'detail') === 'detail' && {(type as 'add' | 'edit' | 'detail') === 'detail' &&
!isRecordingApproved(initialValues) && !isRecordingApproved(initialValues) &&
(!isLayingCategory || hasGradingData(initialValues)) && ( (!isLayingCategory || hasGradingData(initialValues)) && (
<ConfirmationModal <ConfirmationModalWithNotes
ref={approveModal.ref} ref={approveModal.ref}
type='success' type='success'
text='Apakah anda yakin ingin menyetujui data Recording ini?' text='Apakah anda yakin ingin menyetujui data Recording ini?'
secondaryButton={{ secondaryButton={{
text: 'Tidak', text: 'Tidak',
onClick: () => setApprovalNotes(''),
}} }}
primaryButton={{ primaryButton={{
text: 'Ya', text: 'Ya',
@@ -2865,6 +2877,8 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
isLoading: isApproveLoading, isLoading: isApproveLoading,
onClick: approveHandler, onClick: approveHandler,
}} }}
placeholder='(Opsional) Tambahkan catatan untuk approval ini...'
rows={3}
/> />
)} )}
@@ -2872,12 +2886,13 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
{(type as 'add' | 'edit' | 'detail') === 'detail' && {(type as 'add' | 'edit' | 'detail') === 'detail' &&
!isRecordingApproved(initialValues) && !isRecordingApproved(initialValues) &&
(!isLayingCategory || hasGradingData(initialValues)) && ( (!isLayingCategory || hasGradingData(initialValues)) && (
<ConfirmationModal <ConfirmationModalWithNotes
ref={rejectModal.ref} ref={rejectModal.ref}
type='error' type='error'
text='Apakah anda yakin ingin menolak data Recording ini?' text='Apakah anda yakin ingin menolak data Recording ini?'
secondaryButton={{ secondaryButton={{
text: 'Tidak', text: 'Tidak',
onClick: () => setApprovalNotes(''),
}} }}
primaryButton={{ primaryButton={{
text: 'Ya', text: 'Ya',
@@ -2885,6 +2900,8 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
isLoading: isRejectLoading, isLoading: isRejectLoading,
onClick: rejectHandler, onClick: rejectHandler,
}} }}
placeholder='(Opsional) Tambahkan catatan untuk reject ini...'
rows={3}
/> />
)} )}
</> </>