Merge branch 'development' into feat/daily-checklist-master-data

This commit is contained in:
ValdiANS
2026-03-09 13:42:01 +07:00
13 changed files with 337 additions and 128 deletions
@@ -185,7 +185,9 @@ const InventoryAdjustmentForm = ({
isLoadingOptions: isLoadingProductOptions,
loadMore: loadMoreProducts,
rawData: products,
} = useSelect<Product>(ProductApi.basePath, 'id', 'name', 'search');
} = useSelect<Product>(ProductApi.basePath, 'id', 'name', 'search', {
include_all: 'true',
});
const {
setInputValue: setDepletionProductInputValue,
@@ -23,7 +23,7 @@ const ChickinLogsView = ({
rawDataApprovals: BaseApproval[];
}) => {
const [chickinErrorMessage, setChickinErrorMessage] = useState('');
const { openChickinApproveModal } = useChickinStore();
const { openChickinApproveModal, openChickinDeleteModal } = useChickinStore();
const handleClickApprove = () => {
openChickinApproveModal(initialValues, async (notes?: string) => {
@@ -44,6 +44,21 @@ const ChickinLogsView = ({
});
};
const handleDeleteChickin = (chickinId: number) => {
openChickinDeleteModal(chickinId, async () => {
const deleteRes = await ChickinApi.delete(chickinId);
if (isResponseSuccess(deleteRes)) {
toast.success(deleteRes?.message || 'Chickin berhasil dihapus');
afterSubmit && afterSubmit();
}
if (isResponseError(deleteRes)) {
toast.error(deleteRes?.message || 'Gagal menghapus chickin');
}
});
};
return (
<>
<div className='px-4 pb-4 flex flex-col gap-4'>
@@ -86,14 +101,30 @@ const ChickinLogsView = ({
<div className='text-lg font-semibold'>
Chick In #{index + 1} - {latestApproval?.step_number}
</div>
<PillBadge
content={
isApproved ? 'Disetujui' : isPending ? 'Pending' : '-'
}
color={
isApproved ? 'green' : isPending ? 'yellow' : 'gray'
}
/>
<div className='flex flex-row gap-2 items-center'>
<PillBadge
content={
isApproved ? 'Disetujui' : isPending ? 'Pending' : '-'
}
color={
isApproved ? 'green' : isPending ? 'yellow' : 'gray'
}
/>
{isApproved && (
<Button
color='error'
className='w-fit text-sm text-base-100 rounded-lg shadow-sm btn-xs!'
onClick={() => handleDeleteChickin(chickin.id)}
>
<Icon
icon='heroicons:trash-solid'
width={10}
height={10}
/>
</Button>
)}
</div>
</div>
{/* Tanggal Chick In */}
@@ -200,6 +200,7 @@ const ProjectFlockTable = ({ refresh }: { refresh?: () => void }) => {
const confirmModal = useModal();
const successModal = useModal();
const chickinApproveModal = useModal();
const chickinDeleteModal = useModal();
const closingModal = useModal();
const [approvalAction, setApprovalAction] = useState<'APPROVED' | 'REJECTED'>(
'APPROVED'
@@ -214,6 +215,11 @@ const ProjectFlockTable = ({ refresh }: { refresh?: () => void }) => {
chickinApproveCallback,
closeChickinApproveModal,
setChickinApproveLoading,
isChickinDeleteModalOpen,
isChickinDeleteLoading,
chickinDeleteCallback,
closeChickinDeleteModal,
setChickinDeleteLoading,
} = useChickinStore();
const {
@@ -478,6 +484,14 @@ const ProjectFlockTable = ({ refresh }: { refresh?: () => void }) => {
}
}, [isChickinApproveModalOpen, chickinApproveModal]);
useEffect(() => {
if (isChickinDeleteModalOpen) {
chickinDeleteModal.openModal();
} else {
chickinDeleteModal.closeModal();
}
}, [isChickinDeleteModalOpen, chickinDeleteModal]);
useEffect(() => {
if (isClosingModalOpen) {
closingModal.openModal();
@@ -1208,6 +1222,38 @@ const ProjectFlockTable = ({ refresh }: { refresh?: () => void }) => {
}}
/>
{/* Chickin Delete Modal */}
<ConfirmationModal
ref={chickinDeleteModal.ref}
type='error'
text='Apakah anda yakin ingin menghapus data chick in ini?'
secondaryButton={{
text: 'Tidak',
onClick: () => {
closeChickinDeleteModal();
},
}}
className={{
modal: 'z-9999',
}}
primaryButton={{
text: 'Ya',
color: 'error',
isLoading: isChickinDeleteLoading,
onClick: async () => {
if (chickinDeleteCallback) {
setChickinDeleteLoading(true);
try {
await chickinDeleteCallback();
} finally {
setChickinDeleteLoading(false);
closeChickinDeleteModal();
}
}
},
}}
/>
{/* Filter Modal */}
<Modal
ref={filterModal.ref}
@@ -104,8 +104,19 @@ const RowOptionsMenu = ({
return recording.approval?.action === 'REJECTED';
};
const isRecordingEditable = (recording: Recording) => {
if (
recording.executed_at &&
recording.project_flock?.project_flock_category === 'GROWING'
) {
return false;
}
return true;
};
const isApproved = isRecordingApproved(props.row.original);
const isRejected = isRecordingRejected(props.row.original);
const isEditable = isRecordingEditable(props.row.original);
return (
<div className='relative'>
@@ -138,18 +149,20 @@ const RowOptionsMenu = ({
View Details
</Button>
</RequirePermission>
<RequirePermission permissions='lti.production.recording.update'>
<Button
href={`/production/recording/detail/edit/?recordingId=${props.row.original.id}`}
variant='ghost'
color='none'
className='p-3 justify-start text-sm font-semibold w-full'
onClick={closePopover}
>
<Icon icon='mdi:pencil-outline' width={20} height={20} />
Edit
</Button>
</RequirePermission>
{isEditable && (
<RequirePermission permissions='lti.production.recording.update'>
<Button
href={`/production/recording/detail/edit/?recordingId=${props.row.original.id}`}
variant='ghost'
color='none'
className='p-3 justify-start text-sm font-semibold w-full'
onClick={closePopover}
>
<Icon icon='mdi:pencil-outline' width={20} height={20} />
Edit
</Button>
</RequirePermission>
)}
{!isApproved && !isRejected && (
<RequirePermission permissions='lti.production.recording.approve'>
<Button
@@ -182,20 +195,22 @@ const RowOptionsMenu = ({
</Button>
</RequirePermission>
)}
<RequirePermission permissions='lti.production.recording.delete'>
<Button
onClick={() => {
deleteClickHandler();
closePopover();
}}
variant='ghost'
color='error'
className='p-3 justify-start text-sm font-semibold w-full focus-visible:text-error-content hover:text-error-content'
>
<Icon icon='mdi:delete-outline' width={20} height={20} />
Delete
</Button>
</RequirePermission>
{isEditable && (
<RequirePermission permissions='lti.production.recording.delete'>
<Button
onClick={() => {
deleteClickHandler();
closePopover();
}}
variant='ghost'
color='error'
className='p-3 justify-start text-sm font-semibold w-full focus-visible:text-error-content hover:text-error-content'
>
<Icon icon='mdi:delete-outline' width={20} height={20} />
Delete
</Button>
</RequirePermission>
)}
</div>
</PopoverContent>
</div>
@@ -272,6 +272,16 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
return recording?.approval?.action === 'REJECTED';
}, []);
const isRecordingEditable = useCallback((recording?: Recording) => {
if (
recording?.executed_at &&
recording?.project_flock?.project_flock_category === 'GROWING'
) {
return false;
}
return true;
}, []);
// ===== PAYLOAD CREATION HELPERS =====
const createGrowingPayload = useCallback(
(values: RecordingGrowingFormValues) => {
@@ -2990,42 +3000,46 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
<div className='flex flex-col sm:flex-row sm:justify-between gap-2'>
{/* Left side - Detail & Edit actions */}
<div className='flex flex-col sm:flex-row justify-start gap-2 w-full sm:w-auto'>
{type === 'detail' && deleteRecordingClickHandler && (
<RequirePermission permissions='lti.production.recording.delete'>
<Button
type='button'
color='error'
onClick={deleteRecordingClickHandler}
className='px-4'
>
<Icon
icon='material-symbols:delete-outline-rounded'
width={24}
height={24}
className='justify-start text-sm'
/>
Delete
</Button>
</RequirePermission>
)}
{type === 'detail' && initialValues && (
<RequirePermission permissions='lti.production.recording.update'>
<Button
type='button'
color='warning'
href={`/production/recording/detail/edit/?recordingId=${initialValues.id}`}
className='px-4'
>
<Icon
icon='material-symbols:edit-outline'
width={24}
height={24}
className='justify-start text-sm'
/>
Edit
</Button>
</RequirePermission>
)}
{type === 'detail' &&
deleteRecordingClickHandler &&
isRecordingEditable(initialValues) && (
<RequirePermission permissions='lti.production.recording.delete'>
<Button
type='button'
color='error'
onClick={deleteRecordingClickHandler}
className='px-4'
>
<Icon
icon='material-symbols:delete-outline-rounded'
width={24}
height={24}
className='justify-start text-sm'
/>
Delete
</Button>
</RequirePermission>
)}
{type === 'detail' &&
initialValues &&
isRecordingEditable(initialValues) && (
<RequirePermission permissions='lti.production.recording.update'>
<Button
type='button'
color='warning'
href={`/production/recording/detail/edit/?recordingId=${initialValues.id}`}
className='px-4'
>
<Icon
icon='material-symbols:edit-outline'
width={24}
height={24}
className='justify-start text-sm'
/>
Edit
</Button>
</RequirePermission>
)}
</div>
{/* Right side actions */}
<div className='flex flex-col sm:flex-row sm:justify-end gap-2 w-full sm:w-auto'>
@@ -50,12 +50,18 @@ const TransferToLayingConfirmationModalTable = ({
transferToLayingForm?: TransferToLayingFormValues;
transferToLayingId?: number;
}) => {
const isValidId =
transferToLayingId !== undefined &&
transferToLayingId !== null &&
!isNaN(transferToLayingId) &&
transferToLayingId > 0;
const { data: transferToLaying, isLoading: isLoadingTransferToLaying } =
useSWR(
transferToLayingId
isValidId
? ['detail-transfer-to-laying', String(transferToLayingId)]
: undefined,
([id]) => TransferToLayingApi.getSingle(Number(id))
([, id]) => TransferToLayingApi.getSingle(Number(id))
);
const confirmationTableColumns: ColumnDef<TransferToLayingConfirmationTableDataType>[] =
@@ -273,12 +279,16 @@ const TransferToLayingConfirmationModal = ({
{transferToLayingIds &&
!transferToLayingForm &&
transferToLayingIds.map((transferToLayingId, idx) => (
<TransferToLayingConfirmationModalTable
key={idx}
transferToLayingId={transferToLayingId}
/>
))}
transferToLayingIds
.filter(
(id) => id !== undefined && id !== null && !isNaN(id) && id > 0
)
.map((transferToLayingId, idx) => (
<TransferToLayingConfirmationModalTable
key={idx}
transferToLayingId={transferToLayingId}
/>
))}
{withNote && (
<TextArea
@@ -229,6 +229,8 @@ const TransferToLayingFormModal = () => {
ProjectFlock | undefined
>(undefined);
const [maxSourceQuantity, setMaxSourceQuantity] = useState<number>(0);
const selectedFlockDestinationRawData = isResponseSuccess(
flockDestinationRawData
)
@@ -353,19 +355,14 @@ const TransferToLayingFormModal = () => {
return { available: countAvailable, unavailable: countUnavailable };
}, [mappedFlockDestinationKandangsMaxTargetQty]);
const totalEnteredChickenForTransfer =
formik.values.flockSourceKandangs.reduce(
(acc, item) => acc + Number(item.quantity),
0
);
const totalTransferedChicken = formik.values.flockDestinationKandangs.reduce(
(acc, item) => acc + Number(item.quantity),
0
);
// Sisa transfer = Max available dari kandang asal - Total yang sudah diisi di kandang tujuan
const totalAvailableChickenForTransfer =
totalEnteredChickenForTransfer - totalTransferedChicken;
maxSourceQuantity - totalTransferedChicken;
const isNextButtonDisabled = useMemo(() => {
if (step === 1) {
@@ -397,6 +394,7 @@ const TransferToLayingFormModal = () => {
formik.setFieldValue('maxTotalQuantity', '');
formik.setFieldValue('reason', '');
formik.setFieldTouched('reason', false);
setMaxSourceQuantity(0);
setStep(2);
};
@@ -404,6 +402,7 @@ const TransferToLayingFormModal = () => {
const flockSourceChangeHandler = (val: OptionType | OptionType[] | null) => {
formik.setFieldValue('flockSource', val);
formik.setFieldValue('flockSourceKandangs', []);
setMaxSourceQuantity(0);
};
const flockDestinationChangeHandler = (
@@ -469,6 +468,26 @@ const TransferToLayingFormModal = () => {
formik.setFieldValue('maxTotalQuantity', totalTransferedChicken);
}, [totalTransferedChicken, formik.values.flockDestinationKandangs]);
// Auto-fill source kandang quantity from total destination quantity
useEffect(() => {
if (formik.values.flockSourceKandangs.length > 0) {
formik.setFieldValue(
'flockSourceKandangs.0.quantity',
totalTransferedChicken
);
}
}, [totalTransferedChicken]);
useEffect(() => {
if (
formik.values.flockSourceKandangs.length > 0 &&
formik.values.flockSourceKandangs[0].maxQuantity &&
maxSourceQuantity === 0
) {
setMaxSourceQuantity(formik.values.flockSourceKandangs[0].maxQuantity);
}
}, [formik.values.flockSourceKandangs, maxSourceQuantity]);
return (
<>
<Modal
@@ -583,14 +602,9 @@ const TransferToLayingFormModal = () => {
k.kandang.value === item.project_flock_kandang_id
);
const flockSourceKandangCheckboxChangeHandler: FormEventHandler<
HTMLInputElement
> = (e) => {
const checked = (e.target as HTMLInputElement)
.checked;
if (checked) {
const flockSourceKandangRadioChangeHandler = () => {
if (isAvailable) {
formik.setFieldValue('flockSourceKandangs', [
...formik.values.flockSourceKandangs,
{
kandang: {
value: item.project_flock_kandang_id,
@@ -600,15 +614,7 @@ const TransferToLayingFormModal = () => {
maxQuantity: item.available_qty,
},
]);
} else {
formik.setFieldValue(
'flockSourceKandangs',
formik.values.flockSourceKandangs.filter(
(k) =>
k.kandang.value !==
item.project_flock_kandang_id
)
);
setMaxSourceQuantity(item.available_qty);
}
};
@@ -618,28 +624,22 @@ const TransferToLayingFormModal = () => {
className='w-full p-3 flex flex-row items-center justify-between'
>
<div className='flex flex-row items-center gap-3'>
<CheckboxInput
name={`flockSourceKandang.${itemIdx}.value`}
<input
type='radio'
name='flockSourceKandang'
value={item.project_flock_kandang_id}
checked={isChecked}
onChange={
flockSourceKandangCheckboxChangeHandler
}
size='md'
onChange={flockSourceKandangRadioChangeHandler}
disabled={!isAvailable}
classNames={{
checkbox: cn({
'bg-base-200 border border-base-content/10 opacity-100':
!isAvailable,
}),
}}
className={cn('radio radio-md radio-primary', {
'opacity-50 cursor-not-allowed': !isAvailable,
})}
/>
<label
htmlFor={`flockSourceKandang.${itemIdx}.value`}
className={cn('text-sm text-base-content/50', {
'cursor-pointer': isAvailable,
'cursor-not-allowed': !isAvailable,
'cursor-not-allowed opacity-50': !isAvailable,
})}
>
{item.kandang_name}{' '}
@@ -858,7 +858,7 @@ const TransferToLayingFormModal = () => {
<NumberInput
key={`flockSourceKandangs-${item.kandang.value}-${index}`}
name={`flockSourceKandangs.${index}.quantity`}
placeholder='Masukkan Kuantitas'
placeholder='Masukkan Kuantitas pada Kandang Tujuan'
value={item.quantity}
onChange={formik.handleChange}
isError={isInvalid}
@@ -875,6 +875,8 @@ const TransferToLayingFormModal = () => {
<div className='w-px bg-base-content/10' />
</div>
}
readOnly
disabled
className={{
inputPrefix:
'py-0 px-0 pl-3 text-base-content/50 bg-transparent border-r-0',
@@ -1000,7 +1002,7 @@ const TransferToLayingFormModal = () => {
isError={totalAvailableChickenForTransfer < 0}
errorMessage={
totalAvailableChickenForTransfer < 0
? `Jumlah transfer melebihi ketersediaan (${formatNumber(totalEnteredChickenForTransfer, 'en-US')} ayam)`
? `Jumlah transfer melebihi ketersediaan (${formatNumber(maxSourceQuantity, 'en-US')} ayam)`
: ''
}
disabled
@@ -48,11 +48,11 @@ const RowOptionsMenu = ({
popoverPosition: 'bottom' | 'top';
deleteClickHandler: () => void;
}) => {
const showEditButton =
props.row.original.approval.action !== 'APPROVED' &&
props.row.original.approval.action !== 'REJECTED';
const showEditButton = props.row.original.approval.action !== 'APPROVED';
const showDeleteButton = showEditButton;
const showDeleteButton =
props.row.original.approval.action === 'APPROVED' ||
props.row.original.approval.step_name.toLowerCase() === 'pengajuan';
const popoverId = `transferToLaying#${props.row.original.id}`;
const popoverAnchorName = `--anchor-transferToLaying#${props.row.original.id}`;
@@ -4,13 +4,16 @@ import { create } from 'zustand';
import { devtools } from 'zustand/middleware';
import { createChickinApprovalSlice } from '@/stores/production/chickin/slices/chickin-approval.slice';
import { ChickinApprovalSlice } from '@/stores/production/chickin/slices/chickin-approval.slice';
import { createChickinDeleteSlice } from '@/stores/production/chickin/slices/chickin-delete.slice';
import { ChickinDeleteSlice } from '@/stores/production/chickin/slices/chickin-delete.slice';
export type ChickinStore = ChickinApprovalSlice;
export type ChickinStore = ChickinApprovalSlice & ChickinDeleteSlice;
export const useChickinStore = create<ChickinStore>()(
devtools(
(...args) => ({
...createChickinApprovalSlice(...args),
...createChickinDeleteSlice(...args),
}),
{
name: 'ChickinStore',
@@ -0,0 +1,57 @@
import { StateCreator } from 'zustand';
export type ChickinDeleteSlice = {
// State
isChickinDeleteModalOpen: boolean;
selectedChickinIdForDelete: number | null;
isChickinDeleteLoading: boolean;
chickinDeleteCallback: (() => Promise<void>) | null;
// Actions
openChickinDeleteModal: (
chickinId: number,
callback: () => Promise<void>
) => void;
closeChickinDeleteModal: () => void;
setChickinDeleteLoading: (loading: boolean) => void;
resetChickinDelete: () => void;
};
export const createChickinDeleteSlice: StateCreator<
ChickinDeleteSlice,
[],
[],
ChickinDeleteSlice
> = (set) => ({
// Initial state
isChickinDeleteModalOpen: false,
selectedChickinIdForDelete: null,
isChickinDeleteLoading: false,
chickinDeleteCallback: null,
// Actions
openChickinDeleteModal: (chickinId, callback) =>
set({
isChickinDeleteModalOpen: true,
selectedChickinIdForDelete: chickinId,
chickinDeleteCallback: callback,
}),
closeChickinDeleteModal: () =>
set({
isChickinDeleteModalOpen: false,
selectedChickinIdForDelete: null,
chickinDeleteCallback: null,
}),
setChickinDeleteLoading: (loading) =>
set({ isChickinDeleteLoading: loading }),
resetChickinDelete: () =>
set({
isChickinDeleteModalOpen: false,
selectedChickinIdForDelete: null,
isChickinDeleteLoading: false,
chickinDeleteCallback: null,
}),
});
+1
View File
@@ -49,6 +49,7 @@ export type BaseRecording = {
project_flock: ProjectFlock;
record_datetime: string;
day: number;
executed_at: string;
} & ProductionMetrics;
export type RecordingDepletion = {