gitea-admin/lti-web-client
1
0
Fork 0
mirror of https://gitlab.com/mbugroup/lti-web-client.git synced 2026-05-25 15:55:48 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor(FE-114): refactor card native to card component

Browse Source
This commit is contained in:
rstubryan
2025-10-22 14:49:38 +07:00
parent f486a659d0
commit bdb3ab1a50
1 changed files with 951 additions and 961 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/pages/production/recording/form/RecordingForm.tsx
+57 -67
View File
@@ -31,6 +31,7 @@ import { ProjectFlock } from '@/types/api/production/project-flock';
import { Warehouse } from '@/types/api/master-data/warehouse';
import { LocationApi } from '@/services/api/master-data';
import FieldMessage from '@/components/helper/FieldMessage';
import Card from '@/components/Card';
interface RecordingFormProps {
type?: 'add' | 'edit' | 'detail';
@@ -634,10 +635,13 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
className='w-full mt-8 flex flex-col gap-6'
>
{/* Basic Info Card */}
<div className='card bg-base-100 shadow mb-4'>
<div className='card-body flex flex-col gap-6'>
<h2 className='card-title'>Informasi Recording</h2>
<Card
title='Informasi Recording'
className={{
wrapper: 'w-full mb-4 shadow',
body: 'flex flex-col gap-6',
}}
>
<div className='grid grid-cols-1 md:grid-cols-2 gap-6'>
<SelectInput
required
@@ -676,9 +680,7 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
: ''
}
onChange={(e) => {
const date = e.target.value
? new Date(e.target.value)
: null;
const date = e.target.value ? new Date(e.target.value) : null;
formik.setFieldValue('recording_date', date);
}}
onBlur={formik.handleBlur}
@@ -743,13 +745,16 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
}
/>
</div>
</div>
</div>
</Card>
{/* Feed Data Table */}
<div className='card bg-base-100 shadow mb-4'>
<div className='card-body'>
<h2 className='card-title mb-4'>Data Pakan</h2>
<Card
title='Data Pakan'
className={{
wrapper: 'w-full mb-4 shadow',
title: 'mb-4',
}}
>
<div className='overflow-x-auto'>
<table className='table'>
<thead>
@@ -846,10 +851,7 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
) ?? '')
: '';
formik.setFieldValue(
`feed_data.${idx}.feed`,
val
);
formik.setFieldValue(`feed_data.${idx}.feed`, val);
formik.setFieldValue(
`feed_data.${idx}.feed_id`,
productWarehouseId || ''
@@ -886,8 +888,7 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
isDisabled={type === 'detail'}
isClearable
className={{
wrapper:
'w-full min-w-52 md:min-w-72 lg:min-w-80',
wrapper: 'w-full min-w-52 md:min-w-72 lg:min-w-80',
}}
/>
</td>
@@ -896,8 +897,7 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
type='text'
name={`feed_data.${idx}.feed_qty`}
value={
feed.feed_qty === '' ||
feed.feed_qty === undefined
feed.feed_qty === '' || feed.feed_qty === undefined
? ''
: String(feed.feed_qty)
}
@@ -921,18 +921,12 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
decimals={0}
min={0}
isError={
isRepeaterInputError(
'feed_data',
'feed_stock',
idx
).isError
isRepeaterInputError('feed_data', 'feed_stock', idx)
.isError
}
errorMessage={
isRepeaterInputError(
'feed_data',
'feed_stock',
idx
).errorMessage
isRepeaterInputError('feed_data', 'feed_stock', idx)
.errorMessage
}
readOnly={type === 'detail'}
className={{
@@ -992,13 +986,16 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
</Button>
</div>
)}
</div>
</div>
</Card>
{/* Body Weight Table */}
<div className='card bg-base-100 shadow mb-4'>
<div className='card-body'>
<h2 className='card-title mb-4'>Berat Ayam</h2>
<Card
title='Berat Ayam'
className={{
wrapper: 'w-full mb-4 shadow',
title: 'mb-4',
}}
>
<div className='overflow-x-auto'>
<table className='table'>
<thead>
@@ -1232,13 +1229,16 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
</Button>
</div>
)}
</div>
</div>
</Card>
{/* Vaccination Table */}
<div className='card bg-base-100 shadow mb-4'>
<div className='card-body'>
<h2 className='card-title mb-4'>Vaccination</h2>
<Card
title='Vaccination'
className={{
wrapper: 'w-full mb-4 shadow',
title: 'mb-4',
}}
>
<div className='overflow-x-auto'>
<table className='table'>
<thead>
@@ -1303,10 +1303,7 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
checked={selectedVaccine.includes(idx)}
onChange={(e) => {
if (e.target.checked) {
setSelectedVaccine([
...selectedVaccine,
idx,
]);
setSelectedVaccine([...selectedVaccine, idx]);
} else {
setSelectedVaccine(
selectedVaccine.filter((i) => i !== idx)
@@ -1326,8 +1323,7 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
value={
ovkOptions.find(
(opt: OptionType) =>
Number(opt.value) ===
Number(vaccine.vaccine_id)
Number(opt.value) === Number(vaccine.vaccine_id)
) ?? null
}
onChange={(val) => {
@@ -1385,8 +1381,7 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
isDisabled={type === 'detail'}
isClearable
className={{
wrapper:
'w-full min-w-52 md:min-w-72 lg:min-w-80',
wrapper: 'w-full min-w-52 md:min-w-72 lg:min-w-80',
}}
/>
</td>
@@ -1491,13 +1486,16 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
</Button>
</div>
)}
</div>
</div>
</Card>
{/* Mortality Table */}
<div className='card bg-base-100 shadow mb-4'>
<div className='card-body'>
<h2 className='card-title mb-4'>Mortalitas</h2>
<Card
title='Mortalitas'
className={{
wrapper: 'w-full mb-4 shadow',
title: 'mb-4',
}}
>
<div className='overflow-x-auto'>
<table className='table'>
<thead>
@@ -1595,25 +1593,18 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
);
}}
isError={
isRepeaterInputError(
'mortality',
'condition',
idx
).isError
isRepeaterInputError('mortality', 'condition', idx)
.isError
}
errorMessage={
isRepeaterInputError(
'mortality',
'condition',
idx
).errorMessage
isRepeaterInputError('mortality', 'condition', idx)
.errorMessage
}
options={RECORDING_FLAG_OPTIONS}
isDisabled={type === 'detail'}
isClearable
className={{
wrapper:
'w-full min-w-52 md:min-w-72 lg:min-w-80',
wrapper: 'w-full min-w-52 md:min-w-72 lg:min-w-80',
}}
/>
</td>
@@ -1693,8 +1684,7 @@ const RecordingForm = ({ type = 'add', initialValues }: RecordingFormProps) => {
</Button>
</div>
)}
</div>
</div>
</Card>
{/* Action buttons */}
<FormActions<RecordingFormValues>