From d3f526a7fe9dd05cfc4a224412b8fb7103b51fa8 Mon Sep 17 00:00:00 2001
From: Remi PLANEL <rplanel@pasteur.fr>
Date: Tue, 12 Mar 2024 13:56:20 +0100
Subject: [PATCH] make some request client side
---
components/ServerDbTable.vue | 29 +++++------------------------
components/content/StructureDb.vue | 13 +++++++++++++
components/content/SystemDb.vue | 14 ++++++++++++++
3 files changed, 32 insertions(+), 24 deletions(-)
diff --git a/components/ServerDbTable.vue b/components/ServerDbTable.vue
index bb510c49..72ad689a 100644
--- a/components/ServerDbTable.vue
+++ b/components/ServerDbTable.vue
@@ -7,7 +7,6 @@ import { useDisplay } from "vuetify";
import { useThrottleFn } from '@vueuse/core'
import type { FacetInputItem, FilterItem } from '@/components/AutocompleteMeiliFacets.vue'
import { useMeiliSearch } from "#imports"
-import type { Filter } from "meilisearch";
// import { saveAs } from "file-saver";
export interface SortItem {
key: string,
@@ -25,9 +24,6 @@ export interface NumericalFilterModel extends NumericalFilter {
}
-
-
-
export interface AutocompleteMeiliFacetProps {
db: string
facets: FacetInputItem[] | undefined
@@ -58,12 +54,6 @@ const props = withDefaults(defineProps<Props>(), {
}
}
});
-
-
-
-// const facetDistribution: Ref<Record<string, Record<string, number>> | undefined> = useState(`refseqFacetDistribution`)
-
-
const slots = useSlots()
const sortByRef = toRef(props.sortBy)
const emit = defineEmits(["refresh:search"])
@@ -73,7 +63,6 @@ const filterOrSearch: Ref<FilterItem[] | null> = ref(null)
const hitsPerPage: Ref<number> = ref(25)
const itemsPerPage: Ref<number[]> = ref([25, 50, 100])
const filterError: Ref<string | null> = ref(null)
-// const msFilter: Ref<string | undefined> = ref(undefined)
const page = ref(1)
let loading = ref(false)
const expanded = ref([])
@@ -85,7 +74,6 @@ const computedTableHeight = computed(() => {
})
const pendingDownloadData = ref(false)
-
const toRefNumericalFilters = toRef(props.numericalFilters)
// const meiliFilters = ref<string | undefined>(undefined)
@@ -130,13 +118,9 @@ watch([paginationParams, msSortBy, page], ([newParams, newSort, newPage]) => {
}
})
-
-
onBeforeMount(async () => {
searchOrFilter()
emitRefreshRes()
-
-
})
const msFilterCompo = ref<FilterItem[] | undefined>(undefined)
@@ -181,7 +165,6 @@ const { arrayFilters: computedFilter } = useMeiliFilters(msFilterCompo, computed
watch(computedFilter, () => {
- console.log(toValue(computedFilter))
if (toValue(isValidFilters) && (toValue(computedFilter) !== undefined || toValue(filterInputValues) === null)) {
searchOrFilter()
emitRefreshRes()
@@ -311,25 +294,23 @@ function focusedOrBlur(isFocused: boolean) {
<v-card variant="flat" color="transparent">
<v-card-text class="d-flex flex-row">
<v-badge :content="totalHits" color="primary" class="me-auto">
- <v-btn prepend-icon="md:download" :loading="pendingDownloadData" variant="text" color="primary"
- @click="downloadData()">{{
- props.title }}
+ <v-btn prepend-icon="md:download" :loading="pendingDownloadData" variant="text"
+ color="primary" @click="downloadData()">{{
+ props.title }}
</v-btn>
</v-badge>
<slot name="toolbar-items"></slot>
</v-card-text>
<v-card-text>
- <v-text-field v-model="search" label="Search..." hide-details="auto" :disabled="pendingDownloadData"
- prepend-inner-icon="mdi-magnify" single-line clearable
+ <v-text-field v-model="search" label="Search..." hide-details="auto"
+ :disabled="pendingDownloadData" prepend-inner-icon="mdi-magnify" single-line clearable
@update:focused="focusedOrBlur"></v-text-field>
</v-card-text>
<v-card-text>
<AutocompleteMeiliFacets v-model="msFilterCompo" v-bind="props.autocompleteMeiliFacetsProps"
:is-valid-filters="isValidFilters">
</AutocompleteMeiliFacets>
-
-
</v-card-text>
diff --git a/components/content/StructureDb.vue b/components/content/StructureDb.vue
index c5d01dcc..59db42f0 100644
--- a/components/content/StructureDb.vue
+++ b/components/content/StructureDb.vue
@@ -31,6 +31,19 @@ onBeforeMount(async () => {
})
+onMounted(async () => {
+ const { data } = await useAsyncMeiliSearch({
+ index: toValue(dbName), query: "", params: {
+ facets: ["*"],
+ filter: [],
+ page: 1,
+ hitsPerPage: 25,
+ }
+ })
+ autocompleteMeiliFacetsProps.value.facetDistribution = toValue(data)?.facetDistribution
+
+})
+
const autocompleteMeiliFacetsProps = ref<AutocompleteMeiliFacetProps>({
db: toValue(dbName),
facets: [
diff --git a/components/content/SystemDb.vue b/components/content/SystemDb.vue
index 5510aa34..81f591a2 100644
--- a/components/content/SystemDb.vue
+++ b/components/content/SystemDb.vue
@@ -18,6 +18,20 @@ onBeforeMount(async () => {
autocompleteMeiliFacetsProps.value.facetDistribution = toValue(data)?.facetDistribution
})
+onMounted(async () => {
+ const { data } = await useAsyncMeiliSearch({
+ index: toValue(dbName), query: "", params: {
+ facets: ["*"],
+ filter: [],
+ page: 1,
+ hitsPerPage: 25,
+ }
+ })
+
+ autocompleteMeiliFacetsProps.value.facetDistribution = toValue(data)?.facetDistribution
+
+})
+
const autocompleteMeiliFacetsProps = ref<AutocompleteMeiliFacetProps>({
db: toValue(dbName),
--
GitLab