From 363df2aa62900da4d60d3a8e8606a3b4420c1e44 Mon Sep 17 00:00:00 2001
From: Remi PLANEL <rplanel@pasteur.fr>
Date: Thu, 30 Nov 2023 22:56:48 +0100
Subject: [PATCH] predicted structures use ServerDbTable
---
components/ServerDbTable.vue | 54 ++++++++++---------
components/content/StructureDb.vue | 22 ++++++++
content/5.predicted-structure.md | 5 ++
...cture.vue => _predicted-structure-bak.vue} | 0
4 files changed, 57 insertions(+), 24 deletions(-)
create mode 100644 components/content/StructureDb.vue
rename pages/{predicted-structure.vue => _predicted-structure-bak.vue} (100%)
diff --git a/components/ServerDbTable.vue b/components/ServerDbTable.vue
index 6cd032e8..c0726879 100644
--- a/components/ServerDbTable.vue
+++ b/components/ServerDbTable.vue
@@ -206,7 +206,8 @@ const operatorItems = ref([
type: "operator",
deletable: false
}
- }
+ },
+
])
const autocompleteItems = computed(() => {
@@ -314,8 +315,6 @@ function runTextSearch() {
filterOrSearch.value = [item]
}
search.value = ""
- console.log(filterOrSearch.value.length)
- console.log(filterOrSearch.value)
searchOrFilter()
}
}
@@ -323,32 +322,39 @@ function runTextSearch() {
</script>
<template>
<v-card flat>
- <v-toolbar>
- <v-autocomplete ref="autocompleteInput" v-model:search="search" v-model:model-value="filterOrSearch"
- auto-select-first chips clearable label="Search or filter results..." :items="autocompleteItems"
- item-value="value" item-title="title" multiple return-object append-inner-icon="md:search"
- @click:appendInner="searchOrFilter" @click:clear="clearFilterOrSearch"
- @update:modelValue="() => clearSearch()">
- <template #chip="{ props, item, index }">
-
-
- <v-chip v-bind="props" :text="item.raw.title" :closable="item.props.deletable"
- @click:close="item.props.type === 'text' ? deleteTextFilter(index) : deleteOneFilter(index)"></v-chip>
- <!-- <v-chip v-if="(index + 1) % 3 === 0" v-bind="props" :text="item.raw.title" closable
+ <v-toolbar floating color="transparent">
+
+ <v-col cols="5">
+ <v-text-field label="Search..." hide-details prepend-inner-icon="mdi-magnify" single-line></v-text-field>
+ </v-col>
+ <v-col>
+ <v-autocomplete ref="autocompleteInput" hide-details single-line v-model:search="search"
+ v-model:model-value="filterOrSearch" auto-select-first chips clearable label="Filter results..."
+ :items="autocompleteItems" item-value="value" item-title="title" multiple return-object
+ append-inner-icon="md:search" @click:appendInner="searchOrFilter" @click:clear="clearFilterOrSearch"
+ @update:modelValue="() => clearSearch()">
+ <template #chip="{ props, item, index }">
+
+
+ <v-chip v-bind="props" :text="item.raw.title" :closable="item.props.deletable"
+ @click:close="item.props.type === 'text' ? deleteTextFilter(index) : deleteOneFilter(index)"></v-chip>
+ <!-- <v-chip v-if="(index + 1) % 3 === 0" v-bind="props" :text="item.raw.title" closable
@click:close="deleteOneFilter(index)"></v-chip>
<v-chip v-else v-bind="props" :text="item.raw.title"></v-chip> -->
- </template>
- <template #item="{ props, item }">
- <v-list-item v-bind="{ ...props, active: false, onClick: () => selectItem(item) }" :title="item.title"
- :subtitle="item.raw?.count ? item.raw.count : ''" :value="props.value">
-
- </v-list-item>
- </template>
- <!-- <template #no-data></template>
+ </template>
+ <template #item="{ props, item }">
+ <v-list-item v-bind="{ ...props, active: false, onClick: () => selectItem(item) }"
+ :title="item.title" :subtitle="item.raw?.count ? item.raw.count : ''" :value="props.value">
+
+ </v-list-item>
+ </template>
+ <!-- <template #no-data></template>
<template #prepend-item>
<v-list-item v-if="canAddTextSearch" :title="`Text search: ${search}`" @click="runTextSearch"> </v-list-item>
</template> -->
- </v-autocomplete>
+ </v-autocomplete>
+ </v-col>
+
</v-toolbar>
<v-data-table-server v-if="!msError" v-model:page="reactiveParams.page"
v-model:items-per-page="reactiveParams.hitsPerPage" v-model:sortBy="sortByRef" fixed-header :loading="loading"
diff --git a/components/content/StructureDb.vue b/components/content/StructureDb.vue
new file mode 100644
index 00000000..986fdb8a
--- /dev/null
+++ b/components/content/StructureDb.vue
@@ -0,0 +1,22 @@
+<script setup lang="ts">
+
+import { useFacetsStore } from '~~/stores/facets'
+const sortBy: Ref<{ key: string, order: string }[]> = ref([{ key: 'system', order: "asc" }])
+const itemValue = ref("id");
+const facets = ref(["system", "completed",
+ "plddts",])
+const headers: Ref<Object[]> = ref([
+ { title: "System", key: "system" },
+ { title: "Completed", key: "completed" },
+ { title: "Predition type", key: "prediction_type" },
+ { title: "Num of genes", key: "system_number_of_genes" },
+ { title: "pLDDT", key: "plddts" },
+ { title: "Type", key: "type" }
+])
+
+</script>
+<template>
+ <ServerDbTable title="Predicted Strucutres" db="structure" :sortBy="sortBy" :headers="computedHeaders"
+ :item-value="itemValue" :facets="facets">
+ </ServerDbTable>
+</template>
\ No newline at end of file
diff --git a/content/5.predicted-structure.md b/content/5.predicted-structure.md
index 6fd0e7b6..40299d4a 100644
--- a/content/5.predicted-structure.md
+++ b/content/5.predicted-structure.md
@@ -3,3 +3,8 @@ layout: db
navigation: false
---
+# Predicted Structures
+
+
+::structure-db
+::
\ No newline at end of file
diff --git a/pages/predicted-structure.vue b/pages/_predicted-structure-bak.vue
similarity index 100%
rename from pages/predicted-structure.vue
rename to pages/_predicted-structure-bak.vue
--
GitLab