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

refactor(FE-355): Use NumberInput and SelectInput for filters

Browse Source
This commit is contained in:
rstubryan
2025-12-17 13:33:51 +07:00
parent 530ef4982d
commit e515438312
1 changed files with 38 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/pages/report/sale/tab/HppPerKandangTab.tsx
+38 -36
View File
@@ -7,8 +7,7 @@ import SelectInput, {
OptionType, OptionType,
} from '@/components/input/SelectInput'; } from '@/components/input/SelectInput';
import DateInput from '@/components/input/DateInput'; import DateInput from '@/components/input/DateInput';
import TextInput from '@/components/input/TextInput'; import NumberInput from '@/components/input/NumberInput';
import CheckboxInput from '@/components/input/CheckboxInput';
import { AreaApi } from '@/services/api/master-data'; import { AreaApi } from '@/services/api/master-data';
import { LocationApi } from '@/services/api/master-data'; import { LocationApi } from '@/services/api/master-data';
import { KandangApi } from '@/services/api/master-data'; import { KandangApi } from '@/services/api/master-data';
@@ -34,9 +33,6 @@ interface Totals {
} }
const HppPerKandangTab = () => { const HppPerKandangTab = () => {
// ===== STATE MANAGEMENT =====
const [isPdfExportLoading, setIsPdfExportLoading] = useState(false);
// ===== SUBMISSION STATE ===== // ===== SUBMISSION STATE =====
const [isSubmitted, setIsSubmitted] = useState(false); const [isSubmitted, setIsSubmitted] = useState(false);
@@ -71,6 +67,11 @@ const HppPerKandangTab = () => {
const { options: kandangOptions, isLoadingOptions: isLoadingKandangs } = const { options: kandangOptions, isLoadingOptions: isLoadingKandangs } =
useSelect(KandangApi.basePath, 'id', 'name', 'search'); useSelect(KandangApi.basePath, 'id', 'name', 'search');
const showUnrecordedOptions: OptionType[] = [
{ value: 'false', label: 'Sembunyikan' },
{ value: 'true', label: 'Tampilkan' },
];
const areaChangeHandler = useCallback( const areaChangeHandler = useCallback(
(val: OptionType | OptionType[] | null) => { (val: OptionType | OptionType[] | null) => {
const newVal = val as OptionType; const newVal = val as OptionType;
@@ -103,7 +104,7 @@ const HppPerKandangTab = () => {
>( >(
(e) => { (e) => {
const val = e.target.value; const val = e.target.value;
updateFilter('weight_min', val || ''); updateFilter('weight_min', val ? String(parseInt(val, 10)) : '');
setIsSubmitted(false); setIsSubmitted(false);
}, },
[updateFilter] [updateFilter]
@@ -114,7 +115,7 @@ const HppPerKandangTab = () => {
>( >(
(e) => { (e) => {
const val = e.target.value; const val = e.target.value;
updateFilter('weight_max', val || ''); updateFilter('weight_max', val ? String(parseInt(val, 10)) : '');
setIsSubmitted(false); setIsSubmitted(false);
}, },
[updateFilter] [updateFilter]
@@ -129,12 +130,10 @@ const HppPerKandangTab = () => {
[updateFilter] [updateFilter]
); );
const showUnrecordedChangeHandler = useCallback< const showUnrecordedChangeHandler = useCallback(
ChangeEventHandler<HTMLInputElement> (val: OptionType | OptionType[] | null) => {
>( const newVal = val as OptionType;
(e) => { updateFilter('show_unrecorded', newVal?.value === 'true');
const checked = e.target.checked;
updateFilter('show_unrecorded', checked);
setIsSubmitted(false); setIsSubmitted(false);
}, },
[updateFilter] [updateFilter]
@@ -308,7 +307,6 @@ const HppPerKandangTab = () => {
} }
); );
// Calculate averages
const avgWeight = const avgWeight =
totals.total_remaining_chicken_birds > 0 totals.total_remaining_chicken_birds > 0
? totals.total_remaining_chicken_weight_kg / ? totals.total_remaining_chicken_weight_kg /
@@ -716,22 +714,22 @@ const HppPerKandangTab = () => {
</div> </div>
<div className='grid md:grid-cols-3 grid-cols-1 gap-4'> <div className='grid md:grid-cols-3 grid-cols-1 gap-4'>
<TextInput <div className='flex flex-row gap-4'>
label='Rentang Bobot Min (Kg)' <NumberInput
name='weight_min' label='Rentang Bobot Min (Kg)'
placeholder='Masukkan bobot minimum' name='weight_min'
value={tableFilterState.weight_min} placeholder='Masukkan bobot minimum'
onChange={weightMinChangeHandler} value={tableFilterState.weight_min}
type='number' onChange={weightMinChangeHandler}
/> />
<TextInput <NumberInput
label='Rentang Bobot Max (Kg)' label='Rentang Bobot Max (Kg)'
name='weight_max' name='weight_max'
placeholder='Masukkan bobot maximum' placeholder='Masukkan bobot maximum'
value={tableFilterState.weight_max} value={tableFilterState.weight_max}
onChange={weightMaxChangeHandler} onChange={weightMaxChangeHandler}
type='number' />
/> </div>
<DateInput <DateInput
label='Periode' label='Periode'
name='period' name='period'
@@ -740,13 +738,17 @@ const HppPerKandangTab = () => {
onChange={periodChangeHandler} onChange={periodChangeHandler}
required required
/> />
</div> <SelectInput
<div className='grid md:grid-cols-1 grid-cols-1 gap-4'>
<CheckboxInput
label='Tampilkan Kandang Tanpa Recording' label='Tampilkan Kandang Tanpa Recording'
name='show_unrecorded' placeholder='Pilih Opsi'
checked={tableFilterState.show_unrecorded} options={showUnrecordedOptions}
value={
tableFilterState.show_unrecorded
? showUnrecordedOptions.find((opt) => opt.value === 'true') ||
null
: showUnrecordedOptions.find((opt) => opt.value === 'false') ||
null
}
onChange={showUnrecordedChangeHandler} onChange={showUnrecordedChangeHandler}
/> />
</div> </div>