From 8a15b9882db792dba23d26a2c8fbca4559a80bb5 Mon Sep 17 00:00:00 2001
From: Peter Olu <pemeraldy@gmail.com>
Date: Sat, 21 May 2022 15:06:52 +0100
Subject: [PATCH] can show columns from selected input

---
 src/store/modules/log.ts                   |  8 ++++++++
 src/views/dashboard/related/log/Header.vue | 10 +++++++---
 2 files changed, 15 insertions(+), 3 deletions(-)

diff --git a/src/store/modules/log.ts b/src/store/modules/log.ts
index cc3e6ef0..491fcd71 100644
--- a/src/store/modules/log.ts
+++ b/src/store/modules/log.ts
@@ -61,6 +61,14 @@ export const logStore = defineStore({
     loadLogs: false,
   }),
   actions: {
+    showColumns(columnsLabel: string[]) {
+      // TODO: add a parameter column type too
+      this.serviceLogColumn.forEach((col: any) => {
+        if (columnsLabel.includes(col.value)) {
+          col.isVisible = true
+        }
+      })
+    },
     hideColumns(columnsLabel: string[]) {
       // TODO: add a parameter column type too
       this.serviceLogColumn.forEach((col: any) => {
diff --git a/src/views/dashboard/related/log/Header.vue b/src/views/dashboard/related/log/Header.vue
index 1c8156c9..7bb0f428 100644
--- a/src/views/dashboard/related/log/Header.vue
+++ b/src/views/dashboard/related/log/Header.vue
@@ -42,7 +42,7 @@ limitations under the License. -->
           content="Add selected columns"
           placement="bottom-start"
         >
-          <el-button class="toggle-btn mx-3" @click="setVisbleColumn">
+          <el-button class="toggle-btn mx-3" @click="showColumns">
             <Icon iconSize="sm" iconName="save" />
           </el-button>
         </el-tooltip>
@@ -53,7 +53,7 @@ limitations under the License. -->
           content="Remove selected columns"
           placement="bottom-start"
         >
-          <el-button class="toggle-btn mx-3" @click="hideColumn">
+          <el-button class="toggle-btn mx-3" @click="hideColumns">
             <Icon iconSize="sm" iconName="cancel" />
           </el-button>
         </el-tooltip>
@@ -341,10 +341,14 @@ function setVisbleColumn() {
   });
   console.log(cols, [...logStore.serviceLogColumn]);
 }
-function hideColumn() {
+function hideColumns() {
   logStore.hideColumns(selectedColumns.value)
   selectedColumns.value = []
 }
+function showColumns() {
+  logStore.showColumns(selectedColumns.value)
+  selectedColumns.value = []
+}
 async function init() {
   const resp = await logStore.getLogsByKeywords();