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

99
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 });
@ -67,56 +69,53 @@ const ListToolbar = () => {
table.setPageIndex(0); table.setPageIndex(0);
}, [trxDate, typeValue, typeSearchValue, searchValue, status, table]); }, [trxDate, typeValue, typeSearchValue, searchValue, status, table]);
const exporDataToExcel = async ( const exporDataToExcel = async (
typeSearchValue: string, typeSearchValue: string,
searchValue: string, searchValue: string,
trxDate: any, trxDate: any,
typeValue: string, typeValue: string,
status: string status: string
) => { ) => {
try { try {
const formattedFilter: any = {}; const formattedFilter: any = {};
// 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`
}; };
}
// Tambahkan filter berdasarkan searchType (sama seperti di search)
if (typeSearchValue && searchValue) {
if (typeSearchValue === 'msisdn') {
formattedFilter['origin_customer.msisdn'] = { like: `%${searchValue}%` };
} else if (typeSearchValue === 'fullname') {
formattedFilter['origin_customer.fullname'] = { like: `%${searchValue}%` };
} else if (typeSearchValue === 'trxid') {
formattedFilter['Transactions.code'] = { like: `%${searchValue}%` };
} }
}
// Tambahkan filter jenis transaksi jika ada // Tambahkan filter berdasarkan searchType (sama seperti di search)
if (typeValue) { if (typeSearchValue && searchValue) {
formattedFilter['Transactions.kind'] = typeValue; if (typeSearchValue === 'msisdn') {
} formattedFilter['origin_customer.msisdn'] = { like: `%${searchValue}%` };
} else if (typeSearchValue === 'fullname') {
formattedFilter['origin_customer.fullname'] = { like: `%${searchValue}%` };
} else if (typeSearchValue === 'trxid') {
formattedFilter['Transactions.code'] = { like: `%${searchValue}%` };
}
}
// Tambahkan filter status jika ada // Tambahkan filter jenis transaksi jika ada
if (status) { if (typeValue) {
formattedFilter['Transactions.status'] = status; formattedFilter['Transactions.kind'] = typeValue;
} }
// Tambahkan filter status jika ada
if (status) {
formattedFilter['Transactions.status'] = status;
}
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',
{ headers: {
method: 'GET', Authorization: `Bearer ${getAuth()?.access_token}`
headers: {
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>