Update navigation menu

eclipse-slm · Oct 30, 2024 · 0470597 · 0470597
1 parent be63b19
commit 0470597
Show file tree

Hide file tree

Showing 3 changed files with 50 additions and 46 deletions.
diff --git a/ui/src/components/base/ItemGroup.vue b/ui/src/components/base/ItemGroup.vue
@@ -7,9 +7,10 @@
     :color="store.barColor !== 'rgba(255, 255, 255, 1), rgba(255, 255, 255, 0.7)' ? 'white' : 'grey darken-1'"
   >
     <template #activator="{ props }">
-      <v-list-item v-if="text"
-                   v-bind="props"
-                   :tile="item.title"
+      <v-list-item
+        v-if="text"
+        v-bind="props"
+        :tile="item.title"
       >
         {{ item.title }}
       </v-list-item>
@@ -22,8 +23,7 @@
         class="align-self-center"
         color="white"
         contain
-      >
-      </v-list-item>
+      />
     </template>
 
     <template v-for="(child, i) in children">
@@ -43,7 +43,6 @@
           :item="child"
         />
       </div>
-
     </template>
   </v-list-group>
 </template>
@@ -130,7 +129,7 @@ export default {
 }
 
 .v-list-group {
-  --list-indent-size: 0px;
+  --list-indent-size: 16px;
   --prepend-width: 0px;
 }
 

diff --git a/ui/src/components/core/Drawer.vue b/ui/src/components/core/Drawer.vue
@@ -54,22 +54,26 @@
             v-if="item.children"
             :key="`group-${i}`"
             :item="item"
-            :subGroup="item.subGroup"
+            :sub-group="item.subGroup"
             :text="item.text"
           >
           <!--  -->
           </base-item-group>
 
           <div
             v-else-if="item.divider && !item.title"
+            class="mt-4"
           >
             <v-divider />
           </div>
 
           <div
             v-else-if="item.divider && item.title"
+            class="mt-4"
           >
-            <v-divider>{{ item.title }}</v-divider>
+            <v-divider>
+              {{ item.title }}
+            </v-divider>
           </div>
 
           <base-item
@@ -144,58 +148,55 @@ export default {
             to: '/jobs',
             visible: true,
           },
+          {
+            id: 'main-menu-divider-resources',
+            title: this.$t('drawer.section.resources.title'),
+            divider: true,
+            visible: true
+          },
           {
             id: 'main-menu-button-resources',
             icon: 'mdi-desktop-classic',
-            title: this.$t('drawer.section.resources.title'),
+            title: this.$t('drawer.section.resources.devices.title'),
             to: '/resources',
             visible: true,
           },
           {
             id: 'main-menu-button-clusters',
             icon: 'mdi-server',
-            title: this.$t('drawer.section.clusters.title'),
+            title: this.$t('drawer.section.resources.clusters.title'),
             to: '/clusters',
             visible: true,
           },
-          // {
-          //   id: 'main-menu-button-provider',
-          //   icon: 'mdi-usb',
-          //   title: this.$t('drawer.section.provider.title'),
-          //   to: '/provider',
-          //   visible: true,
-          // },
+          {
+            id: 'main-menu-divider-services',
+            title: this.$t('drawer.section.services.title'),
+            divider: true,
+            visible: true
+          },
           {
             id: 'main-menu-button-service-offering',
-            title: this.$t('drawer.section.serviceOfferings.title'),
+            title: this.$t('drawer.section.services.serviceOfferings.title'),
             icon: 'mdi-offer',
             to: '/services/offerings',
             visible: true,
           },
           {
             id: 'main-menu-button-service-instances',
-            title: this.$t('drawer.section.services.title'),
+            title: this.$t('drawer.section.services.services.title'),
             icon: 'mdi-apps',
             to: '/services/instances',
             visible: true,
           },
           {
             id: 'main-menu-button-service-vendors',
-            title: this.$t('drawer.section.serviceVendor.title'),
+            title: this.$t('drawer.section.services.serviceVendor.title'),
             icon: 'mdi-toolbox',
             to: '/services/vendors',
             visible: this.userStore.isUserDeveloper,
           },
-          // {
-          //   id: 'main-menu-button-admin',
-          //   title: this.$t('drawer.section.admin.title'),
-          //   icon: 'mdi-shield-account-variant-outline',
-          //   to: '/admin',
-          //   visible: this.userStore.userRoles.includes('slm-admin'),
-          // },
           {
             id: 'main-menu-divider-admin',
-            title: this.$t('drawer.section.admin.title'),
             divider: true,
             visible: true
           },
@@ -211,21 +212,21 @@ export default {
               {
                 id: 'main-menu-button-admin-components',
                 title: this.$t('drawer.section.admin.components.title'),
-                icon: 'mdi-shield-account-variant-outline',
+                icon: 'mdi-view-module',
                 to: 'components',
                 visible: this.userStore.userRoles.includes('slm-admin'),
               },
               {
                 id: 'main-menu-button-admin-service-categories',
                 title: this.$t('drawer.section.admin.service-categories.title'),
-                icon: 'mdi-shield-account-variant-outline',
+                icon: 'mdi-shape-outline',
                 to: 'service-categories',
                 visible: this.userStore.userRoles.includes('slm-admin'),
               },
               {
                 id: 'main-menu-button-admin-service-vendors',
                 title: this.$t('drawer.section.admin.service-vendors.title'),
-                icon: 'mdi-shield-account-variant-outline',
+                icon: 'mdi-treasure-chest',
                 to: 'service-vendors',
                 visible: this.userStore.userRoles.includes('slm-admin'),
               }

diff --git a/ui/src/localisation/en.json b/ui/src/localisation/en.json
@@ -8,23 +8,27 @@
         "title": "Jobs"
       },
       "resources": {
-        "title": "Resources"
-      },
-      "clusters": {
-        "title": "Clusters"
-      },
-      "provider": {
-        "title": "Provider"
-      },
-      "serviceOfferings": {
-        "title": "Service Offerings"
-      },
-      "serviceVendor": {
-        "title": "Service Vendor"
+        "title": "Resources",
+        "devices": {
+          "title": "Devices"
+        },
+        "clusters": {
+          "title": "Clusters"
+        }
       },
       "services": {
-        "title": "Services"
+        "title": "Services",
+        "serviceOfferings": {
+          "title": "Service Offerings"
+        },
+        "serviceVendor": {
+          "title": "Service Vendor"
+        },
+        "services": {
+          "title": "Services"
+        }
       },
+
       "admin": {
         "title": "Admin",
         "components":{