feat(FE-316): Display created uniformity in confirmation preview

This commit is contained in:
rstubryan
2025-12-31 10:37:21 +07:00
parent ef3611e7fc
commit e32b9ddcb2
5 changed files with 110 additions and 30 deletions
@@ -61,50 +61,42 @@ interface UniformityPreviewData {
}
const UniformityConfirmationPreview = ({
tanggal = '28 Desember 2025',
lokasiFarm = 'Farm A',
projectFlock = 'Flock 2025-01',
kandang = 'Kandang 1',
file_name = 'uniformity_data.xlsx',
status = 'APPROVED',
uniformity,
}: {
tanggal?: string;
lokasiFarm?: string;
projectFlock?: string;
kandang?: string;
file_name?: string;
status?: string;
uniformity?: Uniformity;
}) => {
const data: UniformityPreviewData[] = [
{
id: 'tanggal',
label: 'Tanggal',
value: tanggal,
value: uniformity
? formatDate(uniformity.applied_at, 'DD MMM YYYY')
: '-',
},
{
id: 'lokasi-farm',
label: 'Lokasi Farm',
value: lokasiFarm,
value: uniformity?.location_name || '-',
},
{
id: 'project-flock',
label: 'Project Flock',
value: projectFlock,
value: uniformity?.flock_name || '-',
},
{
id: 'kandang',
label: 'Kandang',
value: kandang,
value: uniformity?.kandang_name || '-',
},
{
id: 'file-uniformity',
label: 'File Uniformity',
value: file_name,
value: '-', // File name tidak tersedia di GET ALL response
},
{
id: 'status',
label: 'Status',
value: status,
value: uniformity?.status || '-',
},
];
@@ -161,6 +153,10 @@ const UniformityTable = ({ refresh }: { refresh?: () => void }) => {
const searchParams = useSearchParams();
const isSuccess = useUniformityStore((s) => s.isSuccess);
const setIsSuccess = useUniformityStore((s) => s.setIsSuccess);
const createdUniformity = useUniformityStore((s) => s.createdUniformity);
const setCreatedUniformity = useUniformityStore(
(s) => s.setCreatedUniformity
);
const {
state: tableFilterState,
@@ -449,6 +445,7 @@ const UniformityTable = ({ refresh }: { refresh?: () => void }) => {
const handleSuccessModalClose = () => {
successModal.closeModal();
setIsSuccess(false);
setCreatedUniformity(null);
};
const singleDeleteHandler = useCallback(async () => {
@@ -507,12 +504,18 @@ const UniformityTable = ({ refresh }: { refresh?: () => void }) => {
}, [selectedRowIds, selectedUniformities, singleDeleteModal]);
const handleBulkApprove = useCallback(() => {
if (selectedRowIds.length === 1) {
setSelectedUniformity(selectedUniformities[0]);
}
bulkApproveModal.openModal();
}, [bulkApproveModal]);
}, [bulkApproveModal, selectedRowIds, selectedUniformities]);
const handleBulkReject = useCallback(() => {
if (selectedRowIds.length === 1) {
setSelectedUniformity(selectedUniformities[0]);
}
bulkRejectModal.openModal();
}, [bulkRejectModal]);
}, [bulkRejectModal, selectedRowIds, selectedUniformities]);
const bulkApproveHandler = useCallback(async () => {
setIsBulkActionLoading(true);
@@ -899,7 +902,46 @@ const UniformityTable = ({ refresh }: { refresh?: () => void }) => {
}}
>
<div className='flex flex-col gap-4 mt-4'>
<UniformityConfirmationPreview />
{createdUniformity ? (
<UniformityConfirmationPreview
uniformity={{
id: createdUniformity.id,
location_name: createdUniformity.info_umum.lokasi_farm,
flock_name: createdUniformity.info_umum.project_flock,
kandang_name: createdUniformity.info_umum.kandang,
applied_at: createdUniformity.info_umum.tanggal,
week: 0,
status: 'Pengajuan',
uniformity: createdUniformity.result.uniformity,
cv: createdUniformity.result.cv,
chick_qty_of_weight:
createdUniformity.sampling.chick_qty_of_weight,
uniform_qty: createdUniformity.result.uniform_qty,
mean_up: createdUniformity.sampling.mean_up,
mean_down: createdUniformity.sampling.mean_down,
standard_mean_weight: null,
standard_uniformity: null,
created_at: '',
created_by: 0,
project_flock_kandang_id: 0,
created_user: {
id: 0,
id_user: 0,
email: '',
name: '',
},
updated_at: '',
}}
/>
) : selectedRowIds.length === 1 ? (
<UniformityConfirmationPreview
uniformity={selectedUniformities[0]}
/>
) : (
<div className='text-center text-gray-500'>
{selectedRowIds.length} data dipilih
</div>
)}
</div>
</ConfirmationModal>
@@ -923,7 +965,7 @@ const UniformityTable = ({ refresh }: { refresh?: () => void }) => {
}}
>
<div className='flex flex-col gap-4 mt-4'>
<UniformityConfirmationPreview />
<UniformityConfirmationPreview uniformity={selectedUniformity} />
</div>
</ConfirmationModal>
@@ -947,7 +989,15 @@ const UniformityTable = ({ refresh }: { refresh?: () => void }) => {
}}
>
<div className='flex flex-col gap-4 mt-4'>
<UniformityConfirmationPreview />
{selectedRowIds.length === 1 ? (
<UniformityConfirmationPreview
uniformity={selectedUniformities[0]}
/>
) : (
<div className='text-center text-gray-500'>
{selectedRowIds.length} data dipilih
</div>
)}
</div>
</ConfirmationModal>
@@ -971,7 +1021,7 @@ const UniformityTable = ({ refresh }: { refresh?: () => void }) => {
}}
>
<div className='flex flex-col gap-4 mt-4'>
<UniformityConfirmationPreview />
<UniformityConfirmationPreview uniformity={selectedUniformity} />
</div>
</ConfirmationModal>
@@ -995,7 +1045,15 @@ const UniformityTable = ({ refresh }: { refresh?: () => void }) => {
}}
>
<div className='flex flex-col gap-4 mt-4'>
<UniformityConfirmationPreview />
{selectedRowIds.length === 1 ? (
<UniformityConfirmationPreview
uniformity={selectedUniformities[0]}
/>
) : (
<div className='text-center text-gray-500'>
{selectedRowIds.length} data dipilih
</div>
)}
</div>
</ConfirmationModal>
@@ -1018,7 +1076,15 @@ const UniformityTable = ({ refresh }: { refresh?: () => void }) => {
}}
>
<div className='flex flex-col gap-4 mt-4'>
<UniformityConfirmationPreview />
{selectedRowIds.length === 1 ? (
<UniformityConfirmationPreview
uniformity={selectedUniformities[0]}
/>
) : (
<div className='text-center text-gray-500'>
{selectedRowIds.length} data dipilih
</div>
)}
</div>
</ConfirmationModal>
@@ -40,6 +40,9 @@ const UniformityResultForm = () => {
);
const uniformityFormData = useUniformityStore((s) => s.uniformityFormData);
const setIsSuccess = useUniformityStore((s) => s.setIsSuccess);
const setCreatedUniformity = useUniformityStore(
(s) => s.setCreatedUniformity
);
const [isSubmitting, setIsSubmitting] = React.useState(false);
@@ -68,11 +71,12 @@ const UniformityResultForm = () => {
const res = await UniformityApi.createUniformity(payload);
if (isResponseError(res)) {
toast.error(res.message);
if (!res || isResponseError(res)) {
toast.error(res?.message || 'Failed to create uniformity');
return;
}
setCreatedUniformity(res.data);
setIsSuccess(true);
setExpandedDrawerOpen(false);
setIsNextStep(false);
+5 -2
View File
@@ -53,7 +53,7 @@ export class UniformityApiService extends BaseApiService<
async createUniformity(
payload: CreateUniformityPayload
): Promise<BaseApiResponse<Uniformity> | undefined> {
): Promise<BaseApiResponse<UniformityDetail> | undefined> {
const formData = new FormData();
formData.append('date', payload.date);
formData.append('week', payload.week.toString());
@@ -66,7 +66,10 @@ export class UniformityApiService extends BaseApiService<
formData.append('document', payload.document);
}
return await this.create(formData as unknown as CreateUniformityPayload);
return await this.customRequest<BaseApiResponse<UniformityDetail>>('', {
method: 'POST',
payload: formData as unknown as Record<string, unknown>,
});
}
async verifyUniformity(
@@ -12,6 +12,7 @@ export const createUniformitySlice: StateCreator<
verifyUniformityResult: null,
uniformityFormData: null,
isSuccess: false,
createdUniformity: null,
// Actions
setUniformityStep: (step) => set({ uniformityStep: step }),
@@ -23,11 +24,14 @@ export const createUniformitySlice: StateCreator<
setIsSuccess: (success) => set({ isSuccess: success }),
setCreatedUniformity: (data) => set({ createdUniformity: data }),
resetUniformity: () =>
set({
uniformityStep: 'preview',
verifyUniformityResult: null,
uniformityFormData: null,
isSuccess: false,
createdUniformity: null,
}),
});
+3
View File
@@ -1,6 +1,7 @@
import type { ProductionStandardRepeaterFormSchemaValues } from '@/components/pages/master-data/production-standard/form/ProductionStandardForm.schema';
import type {
UniformityFormData,
UniformityDetail,
VerifyUniformityResponse,
} from '@/types/api/uniformity/uniformity';
@@ -59,11 +60,13 @@ export type UniformitySlice = {
verifyUniformityResult: VerifyUniformityResponse | null;
uniformityFormData: UniformityFormData | null;
isSuccess: boolean;
createdUniformity: UniformityDetail | null;
// Actions
setUniformityStep: (step: UniformityStep) => void;
setVerifyUniformityResult: (result: VerifyUniformityResponse | null) => void;
setUniformityFormData: (data: UniformityFormData | null) => void;
setIsSuccess: (success: boolean) => void;
setCreatedUniformity: (data: UniformityDetail | null) => void;
resetUniformity: () => void;
};