feat(clients): advanced filter drawer with multi-select state/protocol/inbound + expiry/usage ranges + auto-renew/tg/comment

The old toolbar exposed a single-value Search box, a single bucket
radio, and one Protocol + Inbound dropdown. Real panels with hundreds
of clients across mixed protocols need to slice by combinations
(active + expiring, two specific inbounds, expiring within a window,
high-usage subset, etc.), which the old shape couldn't express.

Backend ClientPageParams now accepts comma-separated multi values for
Filter / Protocol / Inbound and three new structured fields each:
expiry/usage ranges (ms / bytes), and three trinary toggles
(AutoRenew / HasTgID / HasComment with on/off, yes/no). The free-text
search predicate also picks up UUID / Password / Auth, which were
previously invisible to search.

Frontend introduces a dedicated FilterDrawer (multi-select for
state/protocol/inbound, DatePicker.RangePicker for expiry, paired
InputNumbers for usage, radio buttons for the trinary toggles) opened
from a single Filter button with a badge for the active count. Active
filters render as closable chips above the table so the user can drop
them one at a time, with a Clear-all next to the Filter button. The
search box stays inline and always visible.
This commit is contained in:
MHSanaei
2026-05-27 12:54:06 +02:00
parent 5eb80eca8e
commit 3675f88caf
7 changed files with 642 additions and 122 deletions
+9
View File
@@ -18,6 +18,10 @@
"protocol": "Protocol",
"search": "Search",
"filter": "Filter",
"all": "All",
"from": "From",
"to": "To",
"done": "Done",
"loading": "Loading...",
"refresh": "Refresh",
"clear": "Clear",
@@ -454,6 +458,11 @@
"days": "Day(s)",
"renew": "Auto Renew",
"renewDesc": "Auto-renewal after expiration. (0 = disable)(unit: day)",
"searchPlaceholder": "Search email, comment, sub ID, UUID, password, auth…",
"filterTitle": "Filter clients",
"clearAllFilters": "Clear all",
"has": "Has",
"hasNot": "Doesn't have",
"title": "Clients",
"actions": "Actions",
"totalGB": "Total Sent/Received (GB)",