mirror of
https://gitlab.com/mbugroup/lti-web-client.git
synced 2026-05-25 15:55:48 +00:00
refactor(FE): Refactor table column definitions to remove unused row
parameter
This commit is contained in:
@@ -66,7 +66,7 @@ const getBwTableColumns = (): PdfColumn<ProductionResult>[] => [
|
|||||||
header: 'No',
|
header: 'No',
|
||||||
flex: 0.5,
|
flex: 0.5,
|
||||||
align: 'center',
|
align: 'center',
|
||||||
cell: ({ row, index }) => index + 1,
|
cell: ({ index }) => index + 1,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
key: 'woa',
|
key: 'woa',
|
||||||
@@ -114,7 +114,7 @@ const getDepTableColumns = (): PdfColumn<ProductionResult>[] => [
|
|||||||
header: 'No',
|
header: 'No',
|
||||||
flex: 0.5,
|
flex: 0.5,
|
||||||
align: 'center',
|
align: 'center',
|
||||||
cell: ({ row, index }) => index + 1,
|
cell: ({ index }) => index + 1,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
key: 'dep_kum',
|
key: 'dep_kum',
|
||||||
@@ -141,7 +141,7 @@ const getButiranTableColumns = (): PdfColumn<ProductionResult>[] => [
|
|||||||
header: 'No',
|
header: 'No',
|
||||||
flex: 0.5,
|
flex: 0.5,
|
||||||
align: 'center',
|
align: 'center',
|
||||||
cell: ({ row, index }) => index + 1,
|
cell: ({ index }) => index + 1,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
key: 'butiran_utuh',
|
key: 'butiran_utuh',
|
||||||
@@ -196,7 +196,7 @@ const getKgTableColumns = (): PdfColumn<ProductionResult>[] => [
|
|||||||
header: 'No',
|
header: 'No',
|
||||||
flex: 0.5,
|
flex: 0.5,
|
||||||
align: 'center',
|
align: 'center',
|
||||||
cell: ({ row, index }) => index + 1,
|
cell: ({ index }) => index + 1,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
key: 'kg_utuh',
|
key: 'kg_utuh',
|
||||||
@@ -251,7 +251,7 @@ const getPersenTableColumns = (): PdfColumn<ProductionResult>[] => [
|
|||||||
header: 'No',
|
header: 'No',
|
||||||
flex: 0.5,
|
flex: 0.5,
|
||||||
align: 'center',
|
align: 'center',
|
||||||
cell: ({ row, index }) => index + 1,
|
cell: ({ index }) => index + 1,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
key: 'persen_utuh',
|
key: 'persen_utuh',
|
||||||
@@ -292,7 +292,7 @@ const getProduksi1TableColumns = (): PdfColumn<ProductionResult>[] => [
|
|||||||
header: 'No',
|
header: 'No',
|
||||||
flex: 0.5,
|
flex: 0.5,
|
||||||
align: 'center',
|
align: 'center',
|
||||||
cell: ({ row, index }) => index + 1,
|
cell: ({ index }) => index + 1,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
key: 'hd',
|
key: 'hd',
|
||||||
@@ -361,7 +361,7 @@ const getProduksi2TableColumns = (): PdfColumn<ProductionResult>[] => [
|
|||||||
header: 'No',
|
header: 'No',
|
||||||
flex: 0.5,
|
flex: 0.5,
|
||||||
align: 'center',
|
align: 'center',
|
||||||
cell: ({ row, index }) => index + 1,
|
cell: ({ index }) => index + 1,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
key: 'fcr',
|
key: 'fcr',
|
||||||
|
|||||||
@@ -0,0 +1,50 @@
|
|||||||
|
import * as yup from 'yup';
|
||||||
|
|
||||||
|
export type ProductionResultFilterType = {
|
||||||
|
area_id: string | null;
|
||||||
|
location_id: string | null;
|
||||||
|
project_flock_id: string | null;
|
||||||
|
kandang_id: string | null;
|
||||||
|
date_start: string | null;
|
||||||
|
date_end: string | null;
|
||||||
|
sort_by: string | null;
|
||||||
|
show_unrecorded: boolean | null;
|
||||||
|
};
|
||||||
|
|
||||||
|
export const ProductionResultFilterSchema = yup.object({
|
||||||
|
area_id: yup.string().nullable(),
|
||||||
|
location_id: yup.string().nullable(),
|
||||||
|
project_flock_id: yup.string().nullable(),
|
||||||
|
kandang_id: yup.string().nullable(),
|
||||||
|
date_start: yup
|
||||||
|
.string()
|
||||||
|
.nullable()
|
||||||
|
.test(
|
||||||
|
'is-valid-date',
|
||||||
|
'Tanggal mulai tidak valid',
|
||||||
|
(value) => !value || !isNaN(Date.parse(value))
|
||||||
|
),
|
||||||
|
date_end: yup
|
||||||
|
.string()
|
||||||
|
.nullable()
|
||||||
|
.test(
|
||||||
|
'is-valid-date',
|
||||||
|
'Tanggal akhir tidak valid',
|
||||||
|
(value) => !value || !isNaN(Date.parse(value))
|
||||||
|
)
|
||||||
|
.test(
|
||||||
|
'is-after-start',
|
||||||
|
'Tanggal akhir tidak boleh lebih awal dari tanggal mulai',
|
||||||
|
function (value) {
|
||||||
|
const { date_start } = this.parent;
|
||||||
|
if (!date_start || !value) return true;
|
||||||
|
return new Date(value) >= new Date(date_start);
|
||||||
|
}
|
||||||
|
),
|
||||||
|
sort_by: yup.string().nullable(),
|
||||||
|
show_unrecorded: yup.boolean().nullable(),
|
||||||
|
});
|
||||||
|
|
||||||
|
export type ProductionResultFilterValues = yup.InferType<
|
||||||
|
typeof ProductionResultFilterSchema
|
||||||
|
>;
|
||||||
|
|||||||
@@ -0,0 +1,38 @@
|
|||||||
|
import React from 'react';
|
||||||
|
import DataStateSkeleton from '@/components/helper/skeleton/DataStateSkeleton';
|
||||||
|
import Table from '@/components/Table';
|
||||||
|
import { ProductionResult } from '@/types/api/report/production-result';
|
||||||
|
import { ColumnDef } from '@tanstack/react-table';
|
||||||
|
|
||||||
|
const ProductionResultSkeleton = ({
|
||||||
|
columns,
|
||||||
|
icon,
|
||||||
|
title,
|
||||||
|
subtitle,
|
||||||
|
}: {
|
||||||
|
columns: ColumnDef<ProductionResult>[];
|
||||||
|
icon: React.ReactNode;
|
||||||
|
title: string;
|
||||||
|
subtitle: string;
|
||||||
|
}) => {
|
||||||
|
return (
|
||||||
|
<div className='relative size-full'>
|
||||||
|
<Table
|
||||||
|
data={[]}
|
||||||
|
columns={columns}
|
||||||
|
isLoading={true}
|
||||||
|
className={{
|
||||||
|
skeletonCellClassName: 'animate-none w-full h-5 bg-base-content/4',
|
||||||
|
headerColumnClassName: 'whitespace-nowrap',
|
||||||
|
containerClassName: 'mb-0 overflow-hidden',
|
||||||
|
tableWrapperClassName: 'overflow-hidden',
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
<div className='absolute inset-0 flex items-center justify-center'>
|
||||||
|
<DataStateSkeleton icon={icon} title={title} description={subtitle} />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default ProductionResultSkeleton;
|
||||||
|
|||||||
@@ -1,6 +1,7 @@
|
|||||||
'use client';
|
'use client';
|
||||||
|
|
||||||
import { useState } from 'react';
|
import React, { useState } from 'react';
|
||||||
|
import { generateProductionResultExcel } from '../export/ProductionResultExportXLSX';
|
||||||
import toast from 'react-hot-toast';
|
import toast from 'react-hot-toast';
|
||||||
|
|
||||||
import { Icon } from '@iconify/react';
|
import { Icon } from '@iconify/react';
|
||||||
@@ -161,11 +162,79 @@ const ProductionResultContent = () => {
|
|||||||
const exportToExcelHandler = async () => {
|
const exportToExcelHandler = async () => {
|
||||||
setIsLoadingExportingToExcel(true);
|
setIsLoadingExportingToExcel(true);
|
||||||
|
|
||||||
await ProductionResultReportApi.exportProductionResultToExcel(
|
try {
|
||||||
projectFlockKandangs
|
let projectFlockKandangsData: BaseProjectFlockKandang[] = [];
|
||||||
|
|
||||||
|
if (selectedProjectFlockKandang) {
|
||||||
|
const projectFlockKandangResponse =
|
||||||
|
await ProjectFlockKandangApi.getSingle(
|
||||||
|
selectedProjectFlockKandang?.value as number
|
||||||
);
|
);
|
||||||
|
|
||||||
|
projectFlockKandangsData = isResponseSuccess(
|
||||||
|
projectFlockKandangResponse
|
||||||
|
)
|
||||||
|
? [projectFlockKandangResponse.data]
|
||||||
|
: [];
|
||||||
|
} else {
|
||||||
|
const projectFlockKandangsResponse =
|
||||||
|
await ProjectFlockKandangApi.getAll({
|
||||||
|
area_id: selectedArea?.value,
|
||||||
|
project_flock_id: selectedProjectFlock?.value,
|
||||||
|
});
|
||||||
|
|
||||||
|
projectFlockKandangsData = isResponseSuccess(
|
||||||
|
projectFlockKandangsResponse
|
||||||
|
)
|
||||||
|
? projectFlockKandangsResponse.data
|
||||||
|
: [];
|
||||||
|
}
|
||||||
|
|
||||||
|
const productionResultData: ProductionResult[] = [];
|
||||||
|
|
||||||
|
for (const kandang of projectFlockKandangsData) {
|
||||||
|
const getProductionResultPath = `${ProductionResultReportApi.basePath}/${kandang.id}?page=1&limit=100`;
|
||||||
|
const getProductionResultRes = await httpClient<
|
||||||
|
BaseApiResponse<ProductionResult[]>
|
||||||
|
>(getProductionResultPath);
|
||||||
|
|
||||||
|
if (isResponseSuccess(getProductionResultRes)) {
|
||||||
|
productionResultData.push(
|
||||||
|
...(getProductionResultRes.data?.map((result) => ({
|
||||||
|
...result,
|
||||||
|
project_flock: {
|
||||||
|
...result.project_flock,
|
||||||
|
name:
|
||||||
|
selectedProjectFlock?.label ||
|
||||||
|
kandang.project_flock?.name ||
|
||||||
|
`Project Flock #${kandang.project_flock_id}`,
|
||||||
|
category: kandang.project_flock?.category || '',
|
||||||
|
kandang: {
|
||||||
|
...result.project_flock?.kandang,
|
||||||
|
name:
|
||||||
|
kandang.kandang?.name || `Kandang #${kandang.kandang_id}`,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
})) || [])
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
if (productionResultData.length === 0) {
|
||||||
|
toast.error('Tidak ada data untuk diexport.');
|
||||||
setIsLoadingExportingToExcel(false);
|
setIsLoadingExportingToExcel(false);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
await generateProductionResultExcel({
|
||||||
|
data: productionResultData,
|
||||||
|
period: '',
|
||||||
|
});
|
||||||
|
} catch {
|
||||||
|
toast.error('Gagal melakukan export laporan hasil produksi! Coba lagi.');
|
||||||
|
} finally {
|
||||||
|
setIsLoadingExportingToExcel(false);
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
const exportToPdfHandler = async () => {
|
const exportToPdfHandler = async () => {
|
||||||
|
|||||||
Reference in New Issue
Block a user