mirror of
https://gitlab.com/mbugroup/lti-web-client.git
synced 2026-05-20 05:22:02 +00:00
refactor(FE): Make filter type nullable and use applied filters
This commit is contained in:
@@ -56,8 +56,8 @@ const CustomerPaymentTab = ({ tabId }: CustomerPaymentTabProps) => {
|
||||
// typeof salesOptions
|
||||
// >([]);
|
||||
const [appliedFilterByType, setAppliedFilterByType] = useState<
|
||||
(typeof dataTypeOptions)[0]
|
||||
>({ value: 'trans_date', label: 'Tanggal Jual/Bayar' });
|
||||
(typeof dataTypeOptions)[0] | null
|
||||
>(null);
|
||||
const [appliedFilterStartDate, setAppliedFilterStartDate] = useState('');
|
||||
const [appliedFilterEndDate, setAppliedFilterEndDate] = useState('');
|
||||
|
||||
@@ -79,9 +79,9 @@ const CustomerPaymentTab = ({ tabId }: CustomerPaymentTabProps) => {
|
||||
[]
|
||||
);
|
||||
|
||||
const [filterByType, setFilterByType] = useState<(typeof dataTypeOptions)[0]>(
|
||||
dataTypeOptions[0]
|
||||
);
|
||||
const [filterByType, setFilterByType] = useState<
|
||||
(typeof dataTypeOptions)[0] | null
|
||||
>(null);
|
||||
|
||||
const {
|
||||
options: customerOptions,
|
||||
@@ -154,14 +154,14 @@ const CustomerPaymentTab = ({ tabId }: CustomerPaymentTabProps) => {
|
||||
const handleResetFilters = useCallback(() => {
|
||||
setIsSubmitted(false);
|
||||
setFilterCustomer([]);
|
||||
setFilterByType(dataTypeOptions[0]);
|
||||
setFilterByType(null);
|
||||
setFilterStartDate('');
|
||||
setFilterEndDate('');
|
||||
setAppliedFilterCustomer([]);
|
||||
setAppliedFilterByType(dataTypeOptions[0]);
|
||||
setAppliedFilterByType(null);
|
||||
setAppliedFilterStartDate('');
|
||||
setAppliedFilterEndDate('');
|
||||
}, [dataTypeOptions]);
|
||||
}, []);
|
||||
|
||||
const handleApplyFilters = useCallback(() => {
|
||||
setAppliedFilterCustomer(filterCustomer);
|
||||
@@ -184,23 +184,33 @@ const CustomerPaymentTab = ({ tabId }: CustomerPaymentTabProps) => {
|
||||
let count = 0;
|
||||
|
||||
// Date filter (start_date + end_date = 1 filter)
|
||||
if (filterStartDate || filterEndDate) {
|
||||
if (appliedFilterStartDate || appliedFilterEndDate) {
|
||||
count += 1;
|
||||
}
|
||||
|
||||
// Customer filter
|
||||
if (filterCustomer.length > 0) {
|
||||
if (appliedFilterCustomer.length > 0) {
|
||||
count += 1;
|
||||
}
|
||||
|
||||
// Filter by type filter (hanya dihitung jika ada nilai yang dipilih)
|
||||
if (appliedFilterByType) {
|
||||
count += 1;
|
||||
}
|
||||
|
||||
// TODO: Uncomment when BE is ready
|
||||
// // Sales filter
|
||||
// if (filterSales.length > 0) {
|
||||
// if (appliedFilterSales.length > 0) {
|
||||
// count += 1;
|
||||
// }
|
||||
|
||||
return count;
|
||||
}, [appliedFilterStartDate, appliedFilterEndDate, appliedFilterCustomer]);
|
||||
}, [
|
||||
appliedFilterStartDate,
|
||||
appliedFilterEndDate,
|
||||
appliedFilterCustomer,
|
||||
appliedFilterByType,
|
||||
]);
|
||||
|
||||
const hasFilters = activeFiltersCount > 0;
|
||||
|
||||
@@ -218,9 +228,10 @@ const CustomerPaymentTab = ({ tabId }: CustomerPaymentTabProps) => {
|
||||
// appliedFilterSales.length > 0
|
||||
// ? appliedFilterSales.map((v) => String(v.value)).join(',')
|
||||
// : undefined,
|
||||
filter_by: appliedFilterByType.value as
|
||||
filter_by: appliedFilterByType?.value as
|
||||
| 'trans_date'
|
||||
| 'realization_date',
|
||||
| 'realization_date'
|
||||
| undefined,
|
||||
start_date: appliedFilterStartDate || undefined,
|
||||
end_date: appliedFilterEndDate || undefined,
|
||||
page: currentPage,
|
||||
@@ -263,7 +274,10 @@ const CustomerPaymentTab = ({ tabId }: CustomerPaymentTabProps) => {
|
||||
// appliedFilterSales.length > 0
|
||||
// ? appliedFilterSales.map((v) => String(v.value)).join(',')
|
||||
// : undefined,
|
||||
filter_by: appliedFilterByType.value as 'trans_date' | 'realization_date',
|
||||
filter_by: appliedFilterByType?.value as
|
||||
| 'trans_date'
|
||||
| 'realization_date'
|
||||
| undefined,
|
||||
start_date: appliedFilterStartDate || undefined,
|
||||
end_date: appliedFilterEndDate || undefined,
|
||||
limit: 100,
|
||||
@@ -342,9 +356,10 @@ const CustomerPaymentTab = ({ tabId }: CustomerPaymentTabProps) => {
|
||||
// : undefined,
|
||||
start_date: appliedFilterStartDate || undefined,
|
||||
end_date: appliedFilterEndDate || undefined,
|
||||
filter_by: appliedFilterByType.value as
|
||||
filter_by: appliedFilterByType?.value as
|
||||
| 'trans_date'
|
||||
| 'realization_date',
|
||||
| 'realization_date'
|
||||
| undefined,
|
||||
},
|
||||
});
|
||||
toast.success('PDF berhasil dibuat dan diunduh.');
|
||||
|
||||
Reference in New Issue
Block a user