From f859d1b983adcbaaaf01b07ec318c2f1ce328116 Mon Sep 17 00:00:00 2001
From: Remi PLANEL <rplanel@pasteur.fr>
Date: Tue, 9 Jan 2024 09:18:03 +0100
Subject: [PATCH] Update systemDb to work with new serverDbTable api
---
components/content/SystemDb.vue | 68 +++++++++++++++++++++++++++++++--
1 file changed, 64 insertions(+), 4 deletions(-)
diff --git a/components/content/SystemDb.vue b/components/content/SystemDb.vue
index 65e3c152..2ca3d8c3 100644
--- a/components/content/SystemDb.vue
+++ b/components/content/SystemDb.vue
@@ -1,9 +1,70 @@
<script setup lang="ts">
-import type { SortItem } from "@/components/ServerDbTable.vue"
+import type { SortItem, AutocompleteMeiliFacetProps } from "@/components/ServerDbTable.vue"
import { ServerDbTable } from "#components"
const sortBy: Ref<SortItem[]> = ref([{ key: 'title', order: "asc" }])
const itemValue = ref("title");
-const facets: Ref<string[]> = ref(["title", "Sensor", "Effector", "Activator", "PFAM.AC", "PFAM.DE"])
+const dbName = ref("systems")
+
+onBeforeMount(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: [
+ { title: "Defense System", type: "subheader" },
+ { title: 'System', value: "title", type: "facet", icon: "" },
+
+ { type: "divider" },
+ { title: "Mechanism", type: "subheader" },
+ { title: 'Sensor', value: "Sensor", type: "facet", icon: "" },
+ { title: 'Effector', value: "Effector", type: "facet", icon: "" },
+ { title: 'Activator', value: "Activator", type: "facet", icon: "" },
+
+
+ { type: "divider" },
+ { title: "PFAM", type: "subheader" },
+ { title: 'Acession', value: "PFAM.AC", type: "facet", icon: "" },
+ { title: 'Description', value: "PFAM.DE", type: "facet", icon: "" }
+ ],
+ facetDistribution: undefined
+})
+
+
+const computedAutocompleteMeiliFacetsProps = computed(() => {
+ const toValFacetDistribution = toValue(autocompleteMeiliFacetsProps).facetDistribution
+ const toValFacets = toValue(autocompleteMeiliFacetsProps).facets
+ if (toValFacetDistribution !== undefined && toValFacets !== undefined) {
+ return {
+ ...toValue(autocompleteMeiliFacetsProps), facets: toValFacets.map(facet => {
+ if (facet.type === "facet") {
+ const count = toValFacetDistribution?.[facet.value] ? Object.keys(toValFacetDistribution[facet.value]).length : undefined
+
+ return count ? { ...facet, count } : { ...facet }
+ }
+ else {
+ return { ...facet }
+ }
+ })
+ }
+ }
+ else {
+ return toValue(autocompleteMeiliFacetsProps)
+ }
+
+
+})
+
const headers: Ref<Object[]> = ref([
{ title: "System", key: "title", removable: false },
{ title: "Article", key: "doi", removable: false },
@@ -16,7 +77,6 @@ const headers: Ref<Object[]> = ref([
])
-const { search: msSearch, result: msResult } = useMeiliSearch('systems')
const defaultDataTableServerProps = ref({
showExpand: false
@@ -34,7 +94,7 @@ const columnsToDownload = ref(['title', 'doi', 'Sensor', 'Activator', 'Effector'
</script>
<template>
- <ServerDbTable title="List Systems" db="systems" :sortBy="sortBy" :facets="facets"
+ <ServerDbTable title="List Systems" :db="dbName" :sortBy="sortBy" :autocomplete-meili-facets-props="computedAutocompleteMeiliFacetsProps"
:data-table-server-props="dataTableServerProps" :columns-to-download="columnsToDownload">
--
GitLab