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

fixing styling clear filter

Browse Source
This commit is contained in:
bagusajisaputroo
2025-05-05 12:53:19 +07:00
parent fef07ae632
commit 545e7016f9
2 changed files with 70 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files

115
src/pages/transfer/transfertype/blocks/ListToolBar.tsx
View File

@ -111,24 +111,71 @@ const ListToolbar = () => {
return (
<div className="card-header flex-wrap border-b-0 px-5">
<div className="flex flex-wrap gap-1 w-full">
<div className="flex flex-wrap gap-1 w-full">
<div className="flex justify-between w-full items-center mb-3">
<div className="flex w-[34%] gap-1 items-center">
<label className="input input-sm w-full text-sm">
<KeenIcon icon="magnifier" />
<input
type="text"
placeholder="Search Transaction Type Name"
value={searchValue}
onChange={(e) => setSearchValue(e.target.value)}
/>
</label>
<div className="flex flex-nowrap items-end gap-3 w-full overflow-x-auto">
<div className="w-48 shrink-0">
<label className="input input-sm w-full text-sm">
<KeenIcon icon="magnifier" />
<input
type="text"
placeholder="Search Name"
value={searchValue}
onChange={(e) => setSearchValue(e.target.value)}
/>
</label>
</div>
<div className="min-w-[220px] shrink-0">
<Select
key={`type-filter-${statusTypes}`}
value={statusTypes}
onValueChange={setStatusTypes}
>
<SelectTrigger className="h-8 text-sm">
<SelectValue placeholder="Select Status Transaction Type" />
</SelectTrigger>
<SelectContent className="max-h-64 overflow-y-auto">
{types.map((opt) => (
<SelectItem key={opt} value={opt} className="truncate">
{typeLabelMap[opt] ?? opt}
</SelectItem>
))}
</SelectContent>
</Select>
</div>
<div className="min-w-[220px] shrink-0">
<Select
key={`approval-filter-${approval}`}
value={approval}
onValueChange={setApproval}
>
<SelectTrigger className="h-8 text-sm">
<SelectValue placeholder="Select Status Approval" />
</SelectTrigger>
<SelectContent className="max-h-64 overflow-y-auto">
<SelectItem value="Y" className="truncate">
Yes
</SelectItem>
<SelectItem value="N" className="truncate">
No
</SelectItem>
</SelectContent>
</Select>
</div>
<DefaultTooltip title={'Reset Filter'} placement={'top'}>
<Button
variant="outline"
className="h-7.5 disabled:bg-gray-400"
onClick={handleClearFilter}
>
<KeenIcon icon="arrow-circle-left" />
</Button>
</DefaultTooltip>
</div>
<div className="flex gap-2 items-center">
<Button variant="outline" className="h-8 px-3 text-xs" onClick={handleClearFilter}>
Clear
</Button>
<Button
variant="outline"
className="h-8 px-3 text-xs"
@ -144,46 +191,6 @@ const ListToolbar = () => {
</div>
</div>
<div className="flex flex-wrap gap-2 w-full">
<div className="min-w-[220px]">
<Select
key={`type-filter-${statusTypes}`}
value={statusTypes}
onValueChange={setStatusTypes}
>
<SelectTrigger className="h-8 text-sm">
<SelectValue placeholder="Select Status Transaction Type" />
</SelectTrigger>
<SelectContent className="w-[var(--radix-select-trigger-width)] max-h-64 overflow-y-auto">
{types.map((opt) => (
<SelectItem key={opt} value={opt} className="truncate">
{typeLabelMap[opt] ?? opt}
</SelectItem>
))}
</SelectContent>
</Select>
</div>
<div className="min-w-[220px]">
<Select
key={`approval-filter-${approval}`}
value={approval}
onValueChange={setApproval}
>
<SelectTrigger className="h-8 text-sm">
<SelectValue placeholder="Select Status Approval" />
</SelectTrigger>
<SelectContent className="w-[var(--radix-select-trigger-width)] max-h-64 overflow-y-auto">
<SelectItem value="Y" className="truncate">
Yes
</SelectItem>
<SelectItem value="N" className="truncate">
No
</SelectItem>
</SelectContent>
</Select>
</div>
</div>
</div>
</div>
);

12
src/pages/wallet/wallet-history/blocks/ListToolbar.tsx
View File

@ -182,9 +182,15 @@ const ListToolbar = () => {
</div>
<div className="flex gap-3 items-center">
<Button variant="outline" size="sm" onClick={handleClearAllFilters}>
Clear
</Button>
<DefaultTooltip title={'Reset Filter'} placement={'top'}>
<Button
variant="outline"
className="h-7.5 disabled:bg-gray-400"
onClick={handleClearAllFilters}
>
<KeenIcon icon="arrow-circle-left" />
</Button>
</DefaultTooltip>
<DefaultTooltip title={'Refresh'} placement={'top'}>
<Button variant="outline" className="h-7.5" onClick={handleRefresh}>
<KeenIcon icon="arrows-circle" />