From f4d93591c6969375103b7e44affb240f41a36893 Mon Sep 17 00:00:00 2001
From: Peter Olu <pemeraldy@gmail.com>
Date: Sat, 21 May 2022 00:06:02 +0100
Subject: [PATCH] log column state is properly setup and works fine

---
 .../related/components/LogTable/LogService.vue  | 17 +++++++++++++----
 .../related/components/LogTable/data.ts         | 14 +++++++++++---
 2 files changed, 24 insertions(+), 7 deletions(-)

diff --git a/src/views/dashboard/related/components/LogTable/LogService.vue b/src/views/dashboard/related/components/LogTable/LogService.vue
index bcaa41e0..9c72d7dc 100644
--- a/src/views/dashboard/related/components/LogTable/LogService.vue
+++ b/src/views/dashboard/related/components/LogTable/LogService.vue
@@ -15,7 +15,11 @@ limitations under the License. -->
 
 <template>
   <div @click="showSelectSpan" class="log-item">
-    <div v-for="(item, index) in visibleColumns" :key="index" :class="item.label">
+    <div
+      v-for="(item, index) in visibleColumns"
+      :key="index"
+      :class="item.label"
+    >
       <span v-if="item.label === 'timestamp'">
         {{ dateFormat(data.timestamp) }}
       </span>
@@ -33,17 +37,22 @@ limitations under the License. -->
   </div>
 </template>
 <script lang="ts" setup>
-import { computed } from "vue";
+import { computed, ref } from "vue";
 import dayjs from "dayjs";
 import { ServiceLogConstants } from "./data";
+import { logStore } from "@/store/modules/log";
 /*global defineProps, defineEmits */
 const props = defineProps({
   data: { type: Object as any, default: () => ({}) },
   noLink: { type: Boolean, default: true },
 });
+const useLogStore = logStore();
+const columns = ref<any[]>(useLogStore.serviceLogColumn);
 const emit = defineEmits(["select"]);
-const columns = ServiceLogConstants;
-const visibleColumns = computed(() => columns.filter(column => column.isVisible))
+// const columns = ServiceLogConstants;
+const visibleColumns = computed(() =>
+  columns.value.filter((column) => column.isVisible)
+);
 const tags = computed(() => {
   if (!props.data.tags) {
     return "";
diff --git a/src/views/dashboard/related/components/LogTable/data.ts b/src/views/dashboard/related/components/LogTable/data.ts
index 23da65e2..bbcd86ab 100644
--- a/src/views/dashboard/related/components/LogTable/data.ts
+++ b/src/views/dashboard/related/components/LogTable/data.ts
@@ -29,7 +29,7 @@ export const ServiceLogConstants = [
   {
     label: "endpointName",
     value: "endpoint",
-    isVisible: false
+    isVisible: true
   },
   {
     label: "timestamp",
@@ -44,7 +44,7 @@ export const ServiceLogConstants = [
   {
     label: "tags",
     value: "tags",
-    isVisible: false
+    isVisible: true
   },
   {
     label: "content",
@@ -54,7 +54,7 @@ export const ServiceLogConstants = [
   {
     label: "traceId",
     value: "traceID",
-    isVisible: false
+    isVisible: true
   },
 ];
 export const ServiceLogDetail = [
@@ -92,37 +92,45 @@ export const BrowserLogConstants = [
   {
     label: "service",
     value: "service",
+    isVisble: true,
   },
   {
     label: "serviceVersion",
     value: "serviceVersion",
+    isVisble: true,
   },
   {
     label: "errorUrl",
     value: "errorPage",
+    isVisble: true,
   },
   {
     label: "time",
     value: "time",
+    isVisble: true,
   },
   {
     label: "message",
     value: "message",
+    isVisble: true,
     // drag: true,
     method: 350,
   },
   {
     label: "stack",
     value: "stack",
+    isVisble: true,
     // drag: true,
     method: 350,
   },
   {
     label: "category",
     value: "category",
+    isVisble: true,
   },
   {
     label: "grade",
     value: "grade",
+    isVisble: true,
   },
 ];