fix: make requests table filter case-insensitive
This commit is contained in:
parent
2aa2ef50f2
commit
cec2289105
@ -137,13 +137,13 @@ $canUnval = $userLevel <= 1;
|
|||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
</template>
|
</template>
|
||||||
<template x-if="!isLoading && !rows.length">
|
<template x-if="!isLoading && !filteredRows.length">
|
||||||
<div class="text-center py-10">
|
<div class="text-center py-10">
|
||||||
<i class="fa fa-inbox text-4xl mb-2 opacity-50"></i>
|
<i class="fa fa-inbox text-4xl mb-2 opacity-50"></i>
|
||||||
<p>No records found</p>
|
<p>No records found</p>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<template x-if="!isLoading && rows.length">
|
<template x-if="!isLoading && filteredRows.length">
|
||||||
<table class="table table-xs table-zebra w-full">
|
<table class="table table-xs table-zebra w-full">
|
||||||
<thead class="bg-base-100 sticky top-0 z-10">
|
<thead class="bg-base-100 sticky top-0 z-10">
|
||||||
<tr>
|
<tr>
|
||||||
@ -204,7 +204,7 @@ $canUnval = $userLevel <= 1;
|
|||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
<template x-for="req in rows" :key="req.SP_ACCESSNUMBER">
|
<template x-for="req in filteredRows" :key="req.SP_ACCESSNUMBER">
|
||||||
<tr class="hover:bg-base-300">
|
<tr class="hover:bg-base-300">
|
||||||
<td x-text="req.REQDATE" :class="statusRowBg[req.STATS]"></td>
|
<td x-text="req.REQDATE" :class="statusRowBg[req.STATS]"></td>
|
||||||
<td x-text="req.Name" :class="statusRowBg[req.STATS]"></td>
|
<td x-text="req.Name" :class="statusRowBg[req.STATS]"></td>
|
||||||
|
|||||||
@ -4,6 +4,7 @@ document.addEventListener('alpine:init', () => {
|
|||||||
today: "",
|
today: "",
|
||||||
filter: { date1: "", date2: "" },
|
filter: { date1: "", date2: "" },
|
||||||
rows: [],
|
rows: [],
|
||||||
|
filteredRows: [],
|
||||||
isLoading: false,
|
isLoading: false,
|
||||||
counters: { Pend: 0, Coll: 0, Recv: 0, Inc: 0, Fin: 0, Total: 0 },
|
counters: { Pend: 0, Coll: 0, Recv: 0, Inc: 0, Fin: 0, Total: 0 },
|
||||||
totalRows: 0,
|
totalRows: 0,
|
||||||
@ -91,6 +92,19 @@ document.addEventListener('alpine:init', () => {
|
|||||||
this.fetchList();
|
this.fetchList();
|
||||||
},
|
},
|
||||||
|
|
||||||
|
computeFilteredRows() {
|
||||||
|
const searchTerm = this.filterTable.trim().toLowerCase();
|
||||||
|
if (!searchTerm) {
|
||||||
|
this.filteredRows = this.rows;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
this.filteredRows = this.rows.filter(item =>
|
||||||
|
Object.values(item).some(value =>
|
||||||
|
String(value).toLowerCase().includes(searchTerm)
|
||||||
|
)
|
||||||
|
);
|
||||||
|
},
|
||||||
|
|
||||||
init() {
|
init() {
|
||||||
this.today = new Date().toISOString().slice(0, 10);
|
this.today = new Date().toISOString().slice(0, 10);
|
||||||
this.filter.date1 = this.today;
|
this.filter.date1 = this.today;
|
||||||
@ -129,6 +143,7 @@ document.addEventListener('alpine:init', () => {
|
|||||||
if (token !== this._fetchToken) return;
|
if (token !== this._fetchToken) return;
|
||||||
|
|
||||||
this.rows = data.data ?? [];
|
this.rows = data.data ?? [];
|
||||||
|
this.computeFilteredRows();
|
||||||
this.counters = data.counters ?? { Pend: 0, Coll: 0, Recv: 0, Inc: 0, Fin: 0, Total: 0 };
|
this.counters = data.counters ?? { Pend: 0, Coll: 0, Recv: 0, Inc: 0, Fin: 0, Total: 0 };
|
||||||
this.validatedCount = Number(data.validatedCount ?? 0);
|
this.validatedCount = Number(data.validatedCount ?? 0);
|
||||||
const pagination = data.pagination ?? {};
|
const pagination = data.pagination ?? {};
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user