diff --git a/src/types/components.d.ts b/src/types/components.d.ts
index 27e79ae6..545c6097 100644
--- a/src/types/components.d.ts
+++ b/src/types/components.d.ts
@@ -11,6 +11,7 @@ declare module '@vue/runtime-core' {
     ElCollapse: typeof import('element-plus/es')['ElCollapse']
     ElCollapseItem: typeof import('element-plus/es')['ElCollapseItem']
     ElDialog: typeof import('element-plus/es')['ElDialog']
+    ElDivider: typeof import('element-plus/es')['ElDivider']
     ElDropdown: typeof import('element-plus/es')['ElDropdown']
     ElDropdownItem: typeof import('element-plus/es')['ElDropdownItem']
     ElDropdownMenu: typeof import('element-plus/es')['ElDropdownMenu']
diff --git a/src/views/dashboard/related/log/Header.vue b/src/views/dashboard/related/log/Header.vue
index d31c7e9c..2bbf8fe9 100644
--- a/src/views/dashboard/related/log/Header.vue
+++ b/src/views/dashboard/related/log/Header.vue
@@ -15,7 +15,6 @@ limitations under the License. -->
 <template>
   <div class="flex-h log-wrapper">
     <div v-if="currentSearchTerm === 'column'" class="flex-h items-center mr-5">
-      <!-- <p style="margin-right: 10px">Select visible columns</p> -->
       <el-dropdown class="dark" :hide-on-click="false">
         <span class="cursor-pointer">
           Select visible columns<el-icon class="el-icon--right"
@@ -28,7 +27,7 @@ limitations under the License. -->
               <div
                 style="width: 100%"
                 class="flex-h items-center justify-between"
-                @click="showAllColumns = true"
+                @click="logStore.toggleAllColumns(true)"
               >
                 <el-icon><View /></el-icon>
                 <span style="margin-right: 10px">Show All</span>
@@ -38,13 +37,13 @@ limitations under the License. -->
               <div
                 style="width: 100%"
                 class="flex-h items-center justify-between"
-                @click="showAllColumns = false"
+                @click="logStore.toggleAllColumns(false)"
               >
                 <el-icon><Hide /></el-icon>
                 <span style="margin-right: 10px">Hide All</span>
               </div>
             </el-dropdown-item>
-            <el-dropdown-item divided></el-dropdown-item>
+            <el-divider />
             <el-dropdown-item
               v-for="item in logStore.serviceLogColumn"
               :key="item.value"
@@ -52,13 +51,6 @@ limitations under the License. -->
               <el-checkbox class="custom-checkbox" v-model="item.isVisible">
                 <span>{{ item.value }}</span>
               </el-checkbox>
-              <!-- <div
-                style="width: 100%"
-                class="flex-h items-center justify-between"
-              >
-                <span style="margin-right: 10px">{{ t(item.value) }}</span>
-                <el-checkbox v-model="item.isVisible" size="large" />
-              </div> -->
             </el-dropdown-item>
           </el-dropdown-menu>
         </template>
@@ -289,9 +281,7 @@ const selectorStore = useSelectorStore();
 const dashboardStore = useDashboardStore();
 const { portal } = useRoute().query;
 const logStore = useLogStore();
-const selectedColumns = ref<any[]>([]);
 const showColumList = ref<boolean>(false);
-const showAllColumns = ref<boolean | null>(null);
 const traceId = ref<string>("");
 const keywordsOfContent = ref<string[]>([]);
 const excludingKeywordsOfContent = ref<string[]>([]);
@@ -628,12 +618,6 @@ watch(
     }
   }
 );
-watch(
-  () => showAllColumns.value,
-  (newVal, oldVal) => {
-    logStore.toggleAllColumns(newVal);
-  }
-);
 </script>
 <style lang="scss" scoped>
 .dropdownSelector {
@@ -645,6 +629,9 @@ watch(
   display: flex;
   align-items: center;
 }
+.el-divider--horizontal{
+  margin: 10px 0 0 0 !important;
+}
 .cursor-pointer {
   cursor: pointer;
 }