fix: Correction recherche et page

This commit is contained in:
Kazhnuz 2023-02-19 21:29:00 +01:00
parent 6d338bbacb
commit 4febea92db
3 changed files with 40 additions and 10 deletions

View file

@ -1,5 +1,5 @@
<script lang="ts" setup>
import { computed, reactive, onMounted, ref } from "vue";
import { computed, reactive, onMounted } from "vue";
import PaginatedFilteredTable from "@/utils/tables/PaginatedFilteredTable";
import type { TableField, TableItem } from "@/utils/tables/types";
import type { PropType } from "vue";
@ -21,8 +21,6 @@ const DEFAULT_MAX_ITEM_BY_PAGE = 10;
const table = reactive(new PaginatedFilteredTable(DEFAULT_MAX_ITEM_BY_PAGE));
const textSearch = ref("");
const filtersFieldMap = computed(() => {
return table?.filteredTable?.filtersFieldMap;
});
@ -32,11 +30,7 @@ const displayedFieldKeys = computed(() => {
});
const paginatedList = computed(() => {
if (textSearch.value !== "") {
return table?.search(textSearch.value);
} else {
return table?.items;
}
});
onMounted(() => {
@ -69,7 +63,11 @@ function goTo(page: number) {
<template>
<div class="d-flex f-between">
<div>
<input v-model="textSearch" class="btn-small" placeholder="Rechercher" />
<input
v-model="table.textSearch"
class="btn-small"
placeholder="Rechercher"
/>
</div>
<div class="d-flex f-end">
<TagList

View file

@ -5,6 +5,7 @@ import type { FilterFieldsMap, Filters, TableField, TableItem } from "./types";
export default class FilteredHtmlTable {
table: SimpleHtmlTable;
filtersFieldMap: FilterFieldsMap = {};
textSearch = "";
constructor() {
this.table = new SimpleHtmlTable();
@ -48,6 +49,19 @@ export default class FilteredHtmlTable {
}
}
if (this.textSearch !== "") {
filteredItem = filteredItem.filter((row) => {
for (const field of this.table.fields) {
if (field.canBeSearched) {
if ((row[field.key] as string).includes(this.textSearch)) {
return true;
}
}
}
return false;
});
}
return filteredItem;
}

View file

@ -1,7 +1,16 @@
import FilteredHtmlTable from "./FilteredHtmlTable";
import type { TableField, TableItem } from "./types";
export default class PaginatedFilteredTable {
export interface PaginatedTable {
filteredTable: FilteredHtmlTable;
pageLenght: number;
currentPage: number;
pageNumber: number;
items: TableItem[];
textSearch: string;
}
export default class PaginatedFilteredTable implements PaginatedTable {
filteredTable: FilteredHtmlTable;
pageLenght: number;
currentPage = 0;
@ -30,6 +39,15 @@ export default class PaginatedFilteredTable {
this.filteredTable.fields = fields;
}
set textSearch(textSearch: string) {
this.currentPage = 0;
this.filteredTable.textSearch = textSearch;
}
get textSearch() {
return this.filteredTable.textSearch;
}
public addItems(items: TableItem[]) {
this.filteredTable.addItems(items);
}