TIMOR-TELECOM/revenue-fe
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update filter on transaction history

Browse Source
This commit is contained in:
bagusajisaputroo
2025-07-14 11:32:54 +07:00
parent 6d7a1534eb
commit af497b595c
2 changed files with 48 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
src/pages/transaction/history-transaction/blocks/ListToolbar.tsx
View File

@ -8,7 +8,7 @@ import {
SelectContent, SelectContent,
SelectItem, SelectItem,
SelectTrigger, SelectTrigger,
SelectValue, SelectValue
} from '@/components/ui/select'; } from '@/components/ui/select';
import { apiConfig } from '@/config/api.config'; import { apiConfig } from '@/config/api.config';
import { useCallApi } from '@/hooks'; import { useCallApi } from '@/hooks';
@ -20,11 +20,11 @@ const ListToolbar = () => {
const [searchValue, setSearchValue] = useState<string>(''); const [searchValue, setSearchValue] = useState<string>('');
const [typeSearchValue, setSearchTypeValue] = useState<string>(''); const [typeSearchValue, setSearchTypeValue] = useState<string>('');
const [typeValue, setTypeValue] = useState<string>( const [typeValue, setTypeValue] = useState<string>(
(table.getState().columnFilters.find(f => f.id === 'kind')?.value as string) ?? '' (table.getState().columnFilters.find((f) => f.id === 'kind')?.value as string) ?? ''
); );
const [status, setStatus] = useState<string>( const [status, setStatus] = useState<string>(
(table.getState().columnFilters.find(f => f.id === 'status')?.value as string) ?? '' (table.getState().columnFilters.find((f) => f.id === 'status')?.value as string) ?? ''
); );
const { GetData } = useCallApi(); const { GetData } = useCallApi();
@ -54,7 +54,9 @@ const ListToolbar = () => {
table.getColumn('transaction_date')?.setFilterValue(trxDate); table.getColumn('transaction_date')?.setFilterValue(trxDate);
table.setColumnFilters((prev) => { table.setColumnFilters((prev) => {
const others = prev.filter(f => f.id !== 'kind' && f.id !== 'searchtype' && f.id !== 'code' && f.id !== 'status'); const others = prev.filter(
(f) => f.id !== 'kind' && f.id !== 'searchtype' && f.id !== 'code' && f.id !== 'status'
);
const filters: any[] = [...others]; const filters: any[] = [...others];
if (typeValue) filters.push({ id: 'kind', value: typeValue }); if (typeValue) filters.push({ id: 'kind', value: typeValue });
@ -79,9 +81,9 @@ const ListToolbar = () => {
// Tambahkan filter tanggal (selalu ada) // Tambahkan filter tanggal (selalu ada)
if (trxDate.from && trxDate.to) { if (trxDate.from && trxDate.to) {
formattedFilter["Transactions.transaction_date"] = { formattedFilter['Transactions.transaction_date'] = {
from: `${trxDate.from} 00:00:00`, from: `${trxDate.from} 00:00:00`,
to: `${trxDate.to} 23:59:59`, to: `${trxDate.to} 23:59:59`
}; };
} }
@ -108,15 +110,12 @@ const ListToolbar = () => {
const filterParam = encodeURIComponent(JSON.stringify(formattedFilter)); const filterParam = encodeURIComponent(JSON.stringify(formattedFilter));
const response = await fetch( const response = await fetch(`${API_URL}/transaction/export?filter=${filterParam}`, {
`${API_URL}/transaction/export?filter=${filterParam}`,
{
method: 'GET', method: 'GET',
headers: { headers: {
Authorization: `Bearer ${getAuth()?.access_token}`, Authorization: `Bearer ${getAuth()?.access_token}`
},
} }
); });
if (!response.ok) { if (!response.ok) {
throw new Error('Failed to fetch file'); throw new Error('Failed to fetch file');
@ -143,9 +142,7 @@ const ListToolbar = () => {
<input <input
type="date" type="date"
value={trxDate.from} value={trxDate.from}
onChange={(event) => onChange={(event) => settrxDate({ ...trxDate, from: event.target.value })}
settrxDate({ ...trxDate, from: event.target.value })
}
name="from" name="from"
/> />
</label> </label>
@ -155,9 +152,7 @@ const ListToolbar = () => {
<input <input
type="date" type="date"
value={trxDate.to} value={trxDate.to}
onChange={(event) => onChange={(event) => settrxDate({ ...trxDate, to: event.target.value })}
settrxDate({ ...trxDate, to: event.target.value })
}
name="to" name="to"
/> />
</label> </label>