From e65380fe3b57334f4a48100582a66f5b0c2e7068 Mon Sep 17 00:00:00 2001
From: Marvin Zhang <tikazyq@163.com>
Date: Sun, 24 Nov 2024 17:46:50 +0800
Subject: [PATCH] fix: sidebar menu items issue

---
 src/layouts/components/Sidebar.vue  |  3 ++-
 src/layouts/components/TabsView.vue |  1 +
 src/router/index.ts                 |  9 ++++----
 src/store/modules/layout.ts         | 34 ++++++++++++++++-------------
 4 files changed, 27 insertions(+), 20 deletions(-)

diff --git a/src/layouts/components/Sidebar.vue b/src/layouts/components/Sidebar.vue
index dac0c74a0924d..4a8c4f0caefe5 100644
--- a/src/layouts/components/Sidebar.vue
+++ b/src/layouts/components/Sidebar.vue
@@ -89,6 +89,7 @@ onBeforeMount(async () => {
   if (isPro()) {
     await store.dispatch('system/getCustomize');
   }
+  console.debug(menuItems.value);
 });
 
 defineOptions({ name: 'ClSidebar' });
@@ -146,7 +147,7 @@ defineOptions({ name: 'ClSidebar' });
         :default-openeds="openedIndexes"
         @select="onMenuItemClick"
       >
-        <template v-for="(item, index) in menuItems" :key="index">
+        <template v-for="item in menuItems">
           <cl-sidebar-item :item="item" />
         </template>
       </el-menu>
diff --git a/src/layouts/components/TabsView.vue b/src/layouts/components/TabsView.vue
index 21f4e75fa5eda..1887ba6f29676 100644
--- a/src/layouts/components/TabsView.vue
+++ b/src/layouts/components/TabsView.vue
@@ -193,6 +193,7 @@ defineOptions({ name: 'ClTabsView' });
 
     &:deep(.el-tabs__header.is-top) {
       border-bottom: none;
+      margin: 0;
     }
 
     &:deep(.el-tabs__new-tab) {
diff --git a/src/router/index.ts b/src/router/index.ts
index d5937dc18bcf2..089e0684d9d9c 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -130,6 +130,11 @@ export function getDefaultSidebarMenuItems(): MenuItem[] {
         },
       ],
     },
+    {
+      path: '/users',
+      title: 'router.menuItems.users',
+      icon: getIconByRouteConcept('user'),
+    },
     {
       path: '/users',
       title: 'router.menuItems.usersManagement.title',
@@ -184,10 +189,6 @@ export function getDefaultHiddenMenuItems(): MenuItem[] {
   });
 }
 
-export function getDefaultMenuItems(): MenuItem[] {
-  return [...getDefaultSidebarMenuItems(), ...getDefaultHiddenMenuItems()];
-}
-
 export function getRootRoute(
   routes: Array<ExtendedRouterRecord>
 ): ExtendedRouterRecord | undefined {
diff --git a/src/store/modules/layout.ts b/src/store/modules/layout.ts
index 63f67bf325847..9f4b220d595a7 100644
--- a/src/store/modules/layout.ts
+++ b/src/store/modules/layout.ts
@@ -1,6 +1,6 @@
 import { plainClone } from '@/utils/object';
 import { normalizeTree } from '@/utils/tree';
-import { getDefaultMenuItems } from '@/router';
+import { getDefaultSidebarMenuItems } from '@/router';
 import { isAllowedRoutePath, isPro } from '@/utils';
 import { saveLocalStorage } from '@/utils/storage';
 
@@ -45,7 +45,7 @@ export default {
   state: {
     // sidebar
     sidebarCollapsed: getDefaultSidebarCollapsed(),
-    menuItems: getDefaultMenuItems(),
+    menuItems: getDefaultSidebarMenuItems(),
 
     // tabs view
     activeTabId: getDefaultActiveTabId(),
@@ -91,22 +91,26 @@ export default {
             // skip if no path
             if (!d.path) return false;
 
-            // skip some items if pro
             if (isPro()) {
+              // skip some items if pro
               return !['router.menuItems.users'].includes(d.title);
+            } else {
+              // skip some items if not pro
+              switch (d.path) {
+                case '/notifications':
+                case '/environments':
+                case '/system':
+                case '/deps':
+                case '/gits':
+                case '/databases':
+                case '/dependencies':
+                  return false;
+                default:
+                  return ['usersManagement'].every(
+                    key => !d.title.includes(key)
+                  );
+              }
             }
-
-            // skip some items if not pro
-            return (
-              ![
-                '/notifications',
-                '/environments',
-                '/system',
-                '/deps',
-                '/gits',
-                '/databases',
-              ].includes(d.path) || !['userManagement'].includes(d.title)
-            );
           })
           // filter items by navVisibleFn
           .filter(d => {