List system ms

components/content/SystemDb.vue

+<script setup lang="ts">
+import type { SortItem } 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", "Activator"])
+const headers: Ref<Object[]> = ref([
+    { title: "System", key: "title", removable: false },
+    { title: "Article", key: "doi", removable: false },
+    { title: "Sensor", key: "Sensor", removable: false },
+    { title: "Activator", key: "Activator", removable: false },
+    { title: "Effector", key: "Effector", removable: false },
+
+    { title: "PFAM", key: "PFAM", removable: false },
+    { title: "Contributors", key: "contributors", removable: false },
+
+
+])
+const { search: msSearch, result: msResult } = useMeiliSearch('systems')
+
+const defaultDataTableServerProps = ref({
+    showExpand: false
+})
+
+const dataTableServerProps = computed(() => {
+    return {
+        ...toValue(defaultDataTableServerProps),
+        headers: toValue(headers),
+        itemValue: toValue(itemValue)
+    }
+})
+
+</script>
+<template>
+    <ServerDbTable title="systems" db="systems" :sortBy="sortBy" :facets="facets"
+        :data-table-server-props="dataTableServerProps">
+
+        <template #top>
+            <v-toolbar><v-toolbar-title class="text-capitalize">
+                    List Systems </v-toolbar-title><v-spacer></v-spacer>
+            </v-toolbar>
+        </template>
+
+        <template #[`item.title`]="{ item }">
+            <v-chip color="info" link :to="`/defense-systems/${item.title.toLowerCase()}`">{{
+                item.title
+            }}</v-chip>
+        </template>
+
+        <template #[`item.doi`]="{ item }">
+            <ArticleDoi v-if="item?.doi" :doi="item.doi" :abstract="item?.abstract" :divider="false" :enumerate="false" />
+        </template>
+        <template #[`item.PFAM`]="{ item }">
+
+            <pfam-chips v-if="item?.PFAM" :pfams="item.PFAM"></pfam-chips>
+        </template>
+    </ServerDbTable>
+</template>
\ No newline at end of file