diff --git a/components/ServerDbTable.vue b/components/ServerDbTable.vue
index da65a1c93cdfa45b8fe7dc15e42c0d5899c313a3..d04b4c6cc4df9bc26ced84dfa7516ba4629646cf 100644
--- a/components/ServerDbTable.vue
+++ b/components/ServerDbTable.vue
@@ -267,15 +267,15 @@ function focusedOrBlur(isFocused: boolean) {
</script>
<template>
- <v-card flat color="transparent">
+ <v-card variant="flat" color="transparent">
<slot name="numerical-filters" :search="throttleSearch"></slot>
<v-data-table-server v-if="!msError" v-model:page="page" color="primary" v-bind="dataTableServerProps"
v-model:items-per-page="hitsPerPage" v-model:sortBy="sortByRef" v-model:expanded="expanded" fixed-header
:loading="loading" :items="msResult?.hits ?? []" :items-length="totalHits" density="compact"
- :items-per-page-options="itemsPerPage" :height="computedTableHeight" class="elevation-1 mt-2">
+ :items-per-page-options="itemsPerPage" :height="computedTableHeight" class="elevation-0 mt-2">
<template #top>
- <v-card variant="flat" color="transparent">
+ <v-card 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"
diff --git a/components/content/RefseqDb.vue b/components/content/RefseqDb.vue
index 3738334770f379ba0b33beaeedcb389bb1bc0e73..b287ba8713eba28132b06f7159592565ef6962a5 100644
--- a/components/content/RefseqDb.vue
+++ b/components/content/RefseqDb.vue
@@ -456,181 +456,176 @@ async function downloadPng(component: ComponentPublicInstance | null, filename:
</script>
<template>
- <v-card flat class="mb-2" color="transparent">
- <v-card color="transparent" flat>
- <v-expansion-panels v-model="systemPanel" class="my-2" density="compact" multiple>
- <v-expansion-panel elevation="3" value="barplot">
- <v-expansion-panel-title color="grey-lighten-4"><v-icon color="primary"
- class="mr-2">mdi-chart-bar</v-icon>Systems - Taxonomic</v-expansion-panel-title>
- <v-expansion-panel-text>
- <v-card flat color="transparent">
- <v-toolbar flat color="transparent" density="compact">
- <v-btn-toggle v-model="layoutPlot" density="compact" rounded="false" variant="text"
- color="primary" mandatory class="mx-2">
- <v-btn icon="md:grid_view" value="grid"></v-btn>
- <v-btn icon="md:view_agenda" value="fullwidth"></v-btn>
- </v-btn-toggle>
- <v-select v-model="scaleType" class="mx-2" density="compact" :items="scaleTypes"
- label="Scale Type" hide-details="auto"></v-select>
- <v-select v-model="selectedTaxoRank" :items="availableTaxo" density="compact"
- label="Select taxonomic rank" hide-details="auto" class="mx-2"></v-select>
-
+ <v-card class="mb-2">
+ <v-expansion-panels v-model="systemPanel" density="compact" multiple>
+ <v-expansion-panel elevation="3" value="barplot">
+ <v-expansion-panel-title color="grey-lighten-4"><v-icon color="primary"
+ class="mr-2">mdi-chart-bar</v-icon>Systems - Taxonomic</v-expansion-panel-title>
+ <v-expansion-panel-text>
+ <v-card flat color="transparent">
+ <v-toolbar flat color="transparent" density="compact">
+ <v-btn-toggle v-model="layoutPlot" density="compact" rounded="false" variant="text"
+ color="primary" mandatory class="mx-2">
+ <v-btn icon="md:grid_view" value="grid"></v-btn>
+ <v-btn icon="md:view_agenda" value="fullwidth"></v-btn>
+ </v-btn-toggle>
+ <v-select v-model="scaleType" class="mx-2" density="compact" :items="scaleTypes"
+ label="Scale Type" hide-details="auto"></v-select>
+ <v-select v-model="selectedTaxoRank" :items="availableTaxo" density="compact"
+ label="Select taxonomic rank" hide-details="auto" class="mx-2"></v-select>
+
+ </v-toolbar>
+ <v-row align="start">
+ <v-col :cols="fullWidth ? 12 : 6">
+ <v-card variant="flat">
+ <v-toolbar density="compact" color="transparent">
+ <v-spacer></v-spacer>
+
+ <v-menu>
+ <template v-slot:activator="{ props }">
+ <v-btn color="primary" prepend-icon="md:download" v-bind="props">
+ export
+ </v-btn>
+ </template>
+ <v-list>
+ <v-list-item value="svg">
+ <v-list-item-title
+ @click="downloadSvg(systemsDistributionPlot, 'df-systems-distribution.svg')">to
+ svg</v-list-item-title>
+
+ </v-list-item>
+ <v-list-item value="png">
+ <v-list-item-title
+ @click="downloadPng(systemsDistributionPlot, 'df-systems-distribution.png')">to
+ png</v-list-item-title>
+ </v-list-item>
+ </v-list>
+ </v-menu>
+ </v-toolbar>
+
+ <PlotFigure ref="systemsDistributionPlot"
+ :options="unref(computedDistriSystemOptions)" defer></PlotFigure>
+ </v-card>
+ </v-col>
+ <v-col :cols="fullWidth ? 12 : 6">
+ <v-card variant="flat">
+ <v-toolbar density="compact" color="transparent">
+ <v-spacer></v-spacer>
+ <v-menu>
+ <template v-slot:activator="{ props }">
+ <v-btn color="primary" prepend-icon="md:download" v-bind="props">
+ export
+ </v-btn>
+ </template>
+ <v-list>
+ <v-list-item value="svg">
+ <v-list-item-title
+ @click="downloadSvg(taxonomicDistributionPlot, 'df-taxonomic-distribution.svg')">to
+ svg</v-list-item-title>
+
+ </v-list-item>
+ <v-list-item value="png">
+ <v-list-item-title
+ @click="downloadPng(taxonomicDistributionPlot, 'df-taxonomic-distribution.png')">to
+ png</v-list-item-title>
+ </v-list-item>
+ </v-list>
+ </v-menu>
+ </v-toolbar>
+ <PlotFigure ref="taxonomicDistributionPlot" defer
+ :options="unref(computedDistriTaxoOptions)"></PlotFigure>
+ </v-card>
+ </v-col>
+ </v-row>
+ </v-card>
+
+ </v-expansion-panel-text>
+ </v-expansion-panel>
+ <v-expansion-panel elevation="3" value="matrix">
+ <v-expansion-panel-title color="grey-lighten-4">
+
+ <v-icon v-if="pendingAllHits === false" color="primary" class="mr-2">mdi-data-matrix
+ </v-icon>
+ <v-progress-circular v-else indeterminate color="primary" :size="22" class="mr-2"
+ :width="3"></v-progress-circular>
+ Heatmap </v-expansion-panel-title>
+ <v-expansion-panel-text>
+ <v-card v-if="pendingAllHits === false" flat color="transparent">
+ <v-toolbar flat color="transparent" density="compact">
+ <v-select v-model="scaleType" class="mx-2" density="compact" :items="scaleTypes"
+ label="Scale Type" hide-details="auto"></v-select>
+ <v-select v-model="selectedTaxoRank" :items="availableTaxo" density="compact"
+ label="Select taxonomic rank" hide-details="auto" class="mx-2"></v-select>
+
+ </v-toolbar>
+ <v-card v-if="toValue(binPlotDataOptions) !== null" variant="flat">
+ <v-toolbar density="compact" color="transparent">
+ <v-spacer></v-spacer>
+ <v-menu>
+ <template v-slot:activator="{ props }">
+ <v-btn color="primary" prepend-icon="md:download" v-bind="props">
+ export
+ </v-btn>
+ </template>
+ <v-list>
+ <v-list-item value="svg">
+ <v-list-item-title
+ @click="downloadSvg(heatmapPlot, 'df-heatmap-systems-taxonomy.svg')">to
+ svg</v-list-item-title>
+
+ </v-list-item>
+ <v-list-item value="png">
+ <v-list-item-title
+ @click="downloadPng(heatmapPlot, 'df-heatmap-systems-taxonomy.png')">to
+ png</v-list-item-title>
+ </v-list-item>
+ </v-list>
+ </v-menu>
</v-toolbar>
- <v-row align="start">
- <v-col :cols="fullWidth ? 12 : 6">
- <v-card variant="flat">
- <v-toolbar density="compact" color="transparent">
- <v-spacer></v-spacer>
-
- <v-menu>
- <template v-slot:activator="{ props }">
- <v-btn color="primary" prepend-icon="md:download" v-bind="props">
- export
- </v-btn>
- </template>
- <v-list>
- <v-list-item value="svg">
- <v-list-item-title
- @click="downloadSvg(systemsDistributionPlot, 'df-systems-distribution.svg')">to
- svg</v-list-item-title>
-
- </v-list-item>
- <v-list-item value="png">
- <v-list-item-title
- @click="downloadPng(systemsDistributionPlot, 'df-systems-distribution.png')">to
- png</v-list-item-title>
- </v-list-item>
- </v-list>
- </v-menu>
- </v-toolbar>
-
- <PlotFigure ref="systemsDistributionPlot"
- :options="unref(computedDistriSystemOptions)" defer></PlotFigure>
- </v-card>
- </v-col>
- <v-col :cols="fullWidth ? 12 : 6">
- <v-card variant="flat">
- <v-toolbar density="compact" color="transparent">
- <v-spacer></v-spacer>
- <v-menu>
- <template v-slot:activator="{ props }">
- <v-btn color="primary" prepend-icon="md:download" v-bind="props">
- export
- </v-btn>
- </template>
- <v-list>
- <v-list-item value="svg">
- <v-list-item-title
- @click="downloadSvg(taxonomicDistributionPlot, 'df-taxonomic-distribution.svg')">to
- svg</v-list-item-title>
-
- </v-list-item>
- <v-list-item value="png">
- <v-list-item-title
- @click="downloadPng(taxonomicDistributionPlot, 'df-taxonomic-distribution.png')">to
- png</v-list-item-title>
- </v-list-item>
- </v-list>
- </v-menu>
- </v-toolbar>
- <PlotFigure ref="taxonomicDistributionPlot" defer
- :options="unref(computedDistriTaxoOptions)"></PlotFigure>
- </v-card>
- </v-col>
- </v-row>
+ <PlotFigure ref="heatmapPlot" :options="unref(binPlotDataOptions)" defer>
+ </PlotFigure>
</v-card>
-
- </v-expansion-panel-text>
- </v-expansion-panel>
- <v-expansion-panel elevation="3" value="matrix">
- <v-expansion-panel-title color="grey-lighten-4">
-
- <v-icon v-if="pendingAllHits === false" color="primary" class="mr-2">mdi-data-matrix
- </v-icon>
- <v-progress-circular v-else indeterminate color="primary" :size="22" class="mr-2"
- :width="3"></v-progress-circular>
- Heatmap </v-expansion-panel-title>
- <v-expansion-panel-text>
- <v-card v-if="pendingAllHits === false" flat color="transparent">
- <v-toolbar flat color="transparent" density="compact">
- <v-select v-model="scaleType" class="mx-2" density="compact" :items="scaleTypes"
- label="Scale Type" hide-details="auto"></v-select>
- <v-select v-model="selectedTaxoRank" :items="availableTaxo" density="compact"
- label="Select taxonomic rank" hide-details="auto" class="mx-2"></v-select>
-
- </v-toolbar>
- <v-card v-if="toValue(binPlotDataOptions) !== null" variant="flat">
- <v-toolbar density="compact" color="transparent">
- <v-spacer></v-spacer>
- <v-menu>
- <template v-slot:activator="{ props }">
- <v-btn color="primary" prepend-icon="md:download" v-bind="props">
- export
- </v-btn>
- </template>
- <v-list>
- <v-list-item value="svg">
- <v-list-item-title
- @click="downloadSvg(heatmapPlot, 'df-heatmap-systems-taxonomy.svg')">to
- svg</v-list-item-title>
-
- </v-list-item>
- <v-list-item value="png">
- <v-list-item-title
- @click="downloadPng(heatmapPlot, 'df-heatmap-systems-taxonomy.png')">to
- png</v-list-item-title>
- </v-list-item>
- </v-list>
- </v-menu>
- </v-toolbar>
- <PlotFigure ref="heatmapPlot" :options="unref(binPlotDataOptions)" defer>
- </PlotFigure>
- </v-card>
- </v-card>
- <v-card v-else flat color="transparent">
- <v-skeleton-loader type="card" :loading="pendingAllHits" height="400"></v-skeleton-loader>
- </v-card>
- </v-expansion-panel-text>
- </v-expansion-panel>
- </v-expansion-panels>
- <ServerDbTable title="RefSeq" :sortBy="sortBy"
- :autocomplete-meili-facets-props="computedAutocompleteMeiliFacetsProps"
- :data-table-server-props="dataTableServerProps" @refresh:search="(params) => getAllHits(params)">
-
- <template #[`item.accession_in_sys`]="{ item }">
- <CollapsibleChips :items="namesToAccessionChips(item.accession_in_sys)">
- </CollapsibleChips>
- </template>
- <template #[`item.type`]="{ item }">
- <v-chip color="info" link size="small" :to="`/defense-systems/${item.type.toLowerCase()}`"
- target="_blank"> {{
- item.type }}
- </v-chip>
- </template>
- <template #[`item.Assembly`]="{ item }">
- <v-chip color="info" link size="small"
- :href="`https://www.ncbi.nlm.nih.gov/datasets/genome/${item.Assembly}`" target="_blank"> {{
- item.Assembly }}
- </v-chip>
- </template>
- <template #[`item.replicon`]="{ item }">
- <v-chip color="info" link size="small"
- :href="`https://www.ncbi.nlm.nih.gov/nuccore/${item.replicon}`" target="_blank"> {{
- item.replicon }}
- </v-chip>
- </template>
-
- <!-- -->
- <template #[`item.subtype`]="{ item }">
- <v-chip color="info" link size="small" :to="`/defense-systems/${item.type.toLowerCase()}`"
- target="_blank"> {{
- item.subtype }}
- </v-chip>
- </template>
- </ServerDbTable>
-
-
- </v-card>
-
+ </v-card>
+ <v-card v-else flat color="transparent">
+ <v-skeleton-loader type="card" :loading="pendingAllHits" height="400"></v-skeleton-loader>
+ </v-card>
+ </v-expansion-panel-text>
+ </v-expansion-panel>
+ </v-expansion-panels>
+ <ServerDbTable title="RefSeq" :sortBy="sortBy"
+ :autocomplete-meili-facets-props="computedAutocompleteMeiliFacetsProps"
+ :data-table-server-props="dataTableServerProps" @refresh:search="(params) => getAllHits(params)">
+
+ <template #[`item.accession_in_sys`]="{ item }">
+ <CollapsibleChips :items="namesToAccessionChips(item.accession_in_sys)">
+ </CollapsibleChips>
+ </template>
+ <template #[`item.type`]="{ item }">
+ <v-chip color="info" link size="small" :to="`/defense-systems/${item.type.toLowerCase()}`"
+ target="_blank"> {{
+ item.type }}
+ </v-chip>
+ </template>
+ <template #[`item.Assembly`]="{ item }">
+ <v-chip color="info" link size="small"
+ :href="`https://www.ncbi.nlm.nih.gov/datasets/genome/${item.Assembly}`" target="_blank"> {{
+ item.Assembly }}
+ </v-chip>
+ </template>
+ <template #[`item.replicon`]="{ item }">
+ <v-chip color="info" link size="small" :href="`https://www.ncbi.nlm.nih.gov/nuccore/${item.replicon}`"
+ target="_blank"> {{
+ item.replicon }}
+ </v-chip>
+ </template>
+
+ <!-- -->
+ <template #[`item.subtype`]="{ item }">
+ <v-chip color="info" link size="small" :to="`/defense-systems/${item.type.toLowerCase()}`"
+ target="_blank"> {{
+ item.subtype }}
+ </v-chip>
+ </template>
+ </ServerDbTable>
</v-card>
</template>
\ No newline at end of file
diff --git a/components/content/StructureDb.vue b/components/content/StructureDb.vue
index 1fa0667b56c85e5efb21c8dcf6fde38c675a520b..28232eb72212f856a074884089288b0196d6a1a9 100644
--- a/components/content/StructureDb.vue
+++ b/components/content/StructureDb.vue
@@ -173,61 +173,63 @@ const { refinedUrl: downloadAllCifUrl } = useRefinedUrl("/df-all-cifs.tar.gz")
:autocomplete-meili-facets-props="computedAutocompleteMeiliFacetsProps"
:numerical-filters="toRef(numericalFilters)">
<template #numerical-filters="{ search }">
- <v-row>
- <v-col cols="12" md="4">
- <v-card flat variant="tonal">
- <v-card-item class="mb-4">
- <v-card-title> pLDDT
- </v-card-title>
- </v-card-item>
- <v-card-text class="pr-0">
- <v-range-slider v-model="plddtsRange" strict density="compact" hide-details="auto"
- class="" step="0.5" :min="0" :max="100" thumb-label="always"
- @update:modelValue="search()">
- <template #append>
- <v-btn variant="text" density="compact" icon="md:restart_alt"
- @click="plddtsReset()"></v-btn>
- </template>
-
- </v-range-slider>
- </v-card-text>
- </v-card>
- </v-col>
- <v-col cols="12" md="4">
- <v-card flat variant="tonal">
- <v-card-item class="mb-4">
- <v-card-title> iptm+ptm
- </v-card-title>
- </v-card-item>
- <v-card-text class="pr-0">
- <v-range-slider v-model="iptmRange" strict density="compact" hide-details="auto"
- step="0.1" :min="0" :max="1" thumb-label="always" @update:modelValue="search()">
- <template #append>
- <v-btn variant="text" density="compact" icon="md:restart_alt"
- @click="iptmReset()"></v-btn>
- </template>
- </v-range-slider>
- </v-card-text></v-card>
- </v-col>
-
- <v-col cols="12" md="4">
- <v-card flat variant="tonal">
- <v-card-item class="mb-4">
- <v-card-title> pDockQ
- </v-card-title>
- </v-card-item>
- <v-card-text class="pr-0">
- <v-range-slider v-model="pdockqRange" density="compact" strict hide-details="auto"
- step="0.1" :min="0" :max="1" thumb-label="always" @update:modelValue="search()">
- <template #append>
- <v-btn variant="text" density="compact" icon="md:restart_alt"
- @click="pdockqReset()"></v-btn>
- </template>
- </v-range-slider>
- </v-card-text>
- </v-card>
- </v-col>
- </v-row>
+ <v-card-text>
+ <v-row>
+ <v-col cols="12" md="4">
+ <v-card flat variant="tonal">
+ <v-card-item class="mb-4">
+ <v-card-title> pLDDT
+ </v-card-title>
+ </v-card-item>
+ <v-card-text class="pr-0">
+ <v-range-slider v-model="plddtsRange" strict density="compact" hide-details="auto"
+ class="" step="0.5" :min="0" :max="100" thumb-label="always"
+ @update:modelValue="search()">
+ <template #append>
+ <v-btn variant="text" density="compact" icon="md:restart_alt"
+ @click="plddtsReset()"></v-btn>
+ </template>
+
+ </v-range-slider>
+ </v-card-text>
+ </v-card>
+ </v-col>
+ <v-col cols="12" md="4">
+ <v-card flat variant="tonal">
+ <v-card-item class="mb-4">
+ <v-card-title> iptm+ptm
+ </v-card-title>
+ </v-card-item>
+ <v-card-text class="pr-0">
+ <v-range-slider v-model="iptmRange" strict density="compact" hide-details="auto"
+ step="0.1" :min="0" :max="1" thumb-label="always" @update:modelValue="search()">
+ <template #append>
+ <v-btn variant="text" density="compact" icon="md:restart_alt"
+ @click="iptmReset()"></v-btn>
+ </template>
+ </v-range-slider>
+ </v-card-text></v-card>
+ </v-col>
+
+ <v-col cols="12" md="4">
+ <v-card flat variant="tonal">
+ <v-card-item class="mb-4">
+ <v-card-title> pDockQ
+ </v-card-title>
+ </v-card-item>
+ <v-card-text class="pr-0">
+ <v-range-slider v-model="pdockqRange" density="compact" strict hide-details="auto"
+ step="0.1" :min="0" :max="1" thumb-label="always" @update:modelValue="search()">
+ <template #append>
+ <v-btn variant="text" density="compact" icon="md:restart_alt"
+ @click="pdockqReset()"></v-btn>
+ </template>
+ </v-range-slider>
+ </v-card-text>
+ </v-card>
+ </v-col>
+ </v-row>
+ </v-card-text>
</template>
<template #[`item.Foldseek_name`]="{ item }">
<FoldseekDialog v-if="item.Foldseek_name !== 'na'" :foldseek-path="toFolseekUrl(item)"></FoldseekDialog>