From 027cc68d10e6bdbef7b7a2aaad3f29e0d5265c05 Mon Sep 17 00:00:00 2001
From: zprobot <1727697083@qq.com>
Date: Fri, 15 Dec 2023 19:47:57 +0800
Subject: [PATCH] search

---
 src/components/Table/index.vue  |  5 ++---
 src/views/information/index.vue | 16 +++++++++++-----
 2 files changed, 13 insertions(+), 8 deletions(-)

diff --git a/src/components/Table/index.vue b/src/components/Table/index.vue
index a6548fd..228a0f0 100644
--- a/src/components/Table/index.vue
+++ b/src/components/Table/index.vue
@@ -19,14 +19,14 @@
       <el-table-column prop="msruns" label="Msruns" width="100" />
       <el-table-column prop="peptides" label="Peptides" min-width="100" sortable="custom">
         <template #default="scope">
-          <el-tooltip effect="light" :content="scope.row.peptides" :offset="-50" placement="right-start">
+          <el-tooltip effect="light" :content="scope.row.peptides.toString()" :offset="-50" placement="right-start">
             <el-progress :percentage="(100 * scope.row.peptides) / maxPeptides" :stroke-width="12" :show-text="false" />
           </el-tooltip>
         </template>
       </el-table-column>
       <el-table-column prop="proteins" label="Proteins" min-width="100" sortable="custom">
         <template #default="scope">
-          <el-tooltip effect="light" :content="scope.row.proteins" :offset="-50" placement="right-start">
+          <el-tooltip effect="light" :content="scope.row.proteins.toString()" :offset="-50" placement="right-start">
             <el-progress :percentage="(100 * scope.row.proteins) / maxProteins" :stroke-width="12" :show-text="false" />
           </el-tooltip>
         </template>
@@ -89,7 +89,6 @@ watch(
     maxPeptides.value = Math.max(...val.map((o) => o.peptides));
     maxProteins.value = Math.max(...val.map((o) => o.proteins));
     sortedData.value = [...val];
-    console.log(maxPeptides.value, maxProteins.value);
   }
 );
 
diff --git a/src/views/information/index.vue b/src/views/information/index.vue
index b88f0cb..f4a44f2 100644
--- a/src/views/information/index.vue
+++ b/src/views/information/index.vue
@@ -30,7 +30,7 @@
       >
         <div style="font-size: 1.5rem; color: rgb(75, 85, 99)"> Datasets Reanalyzed </div>
         <el-input
-          v-model="search1"
+          v-model="searchProject"
           size="large"
           style="width: 30%; margin: 1.5rem 0"
           placeholder="Search"
@@ -38,7 +38,7 @@
         />
       </div>
       <Table
-        :modelValue="fullTable" @update:modelValue="fullTable = $event"
+        :modelValue="filterTable" @update:modelValue="fullTable = $event"
       ></Table>
     </div>
 
@@ -75,7 +75,7 @@
 <script setup>
 import { Search } from "@element-plus/icons-vue";
 import Table from "@/components/Table/index.vue";
-import { ref, onMounted } from "vue";
+import { ref, onMounted,computed } from "vue";
 import {
   getAbsolueExpression,
   getDifferentialExpression,
@@ -100,8 +100,14 @@ const initTable = async () => {
 
 
 
-const search1 = ref();
-// const search2 = ref();
+const searchProject = ref('');
+const filterTable = computed(() =>
+  fullTable.value.filter(
+    (data) =>
+      !searchProject.value ||
+      data.accession.id.toLowerCase().includes(searchProject.value.toLowerCase())
+  )
+)
 
 onMounted(() => {
   initTable();