From 30fed5c83fb0315075b15102394322f3dcd04d95 Mon Sep 17 00:00:00 2001
From: Qiuxia Fan <fine0830@outlook.com>
Date: Tue, 15 Mar 2022 00:14:47 +0800
Subject: [PATCH] search dashboards

---
 src/views/dashboard/List.vue | 9 ++++++++-
 src/views/dashboard/New.vue  | 4 ++--
 2 files changed, 10 insertions(+), 3 deletions(-)

diff --git a/src/views/dashboard/List.vue b/src/views/dashboard/List.vue
index e1976911..5308da8e 100644
--- a/src/views/dashboard/List.vue
+++ b/src/views/dashboard/List.vue
@@ -20,6 +20,7 @@ limitations under the License. -->
         placeholder="Please input"
         class="input-with-search"
         size="small"
+        @change="searchDashboards"
       >
         <template #append>
           <el-button size="small">
@@ -108,7 +109,7 @@ async function setList() {
       return;
     }
   }
-  dashboards.value = JSON.parse(sessionStorage.getItem("dashboards") || "");
+  dashboards.value = JSON.parse(sessionStorage.getItem("dashboards") || "[]");
 }
 const handleEdit = (row: { name: string; layer: string; entity: string }) => {
   router.push(
@@ -125,6 +126,12 @@ const handleDelete = (
     `${row.layer}_${row.entity}_${row.name.split(" ").join("-")}`
   );
 };
+function searchDashboards() {
+  const list = JSON.parse(sessionStorage.getItem("dashboards") || "[]");
+  dashboards.value = list.filter((d: { name: string }) =>
+    d.name.includes(searchText.value)
+  );
+}
 </script>
 <style lang="scss" scoped>
 .header {
diff --git a/src/views/dashboard/New.vue b/src/views/dashboard/New.vue
index 286db407..e4081226 100644
--- a/src/views/dashboard/New.vue
+++ b/src/views/dashboard/New.vue
@@ -84,10 +84,10 @@ onBeforeMount(async () => {
     return { label: d, value: d };
   });
 });
-function changeLayer(opt: { label: string; value: string }[]) {
+function changeLayer(opt: { label: string; value: string }[] | any) {
   states.selectedLayer = opt[0].value;
 }
-function changeEntity(opt: { label: string; value: string }[]) {
+function changeEntity(opt: { label: string; value: string }[] | any) {
   states.entity = opt[0].value;
 }
 </script>