From a4ef50a3a574b49a10f6ca0e0f5cd4c39ebc0d40 Mon Sep 17 00:00:00 2001
From: setthawutttty <trx.setthawut@gmail.com>
Date: Thu, 14 Nov 2024 11:31:24 +0700
Subject: [PATCH] layout

---
 public/toc.json                    |  2 ++
 src/interface/request/main/type.ts |  5 +---
 src/views/MainLayout.vue           | 48 ++++++++++++++++++++++++++++--
 3 files changed, 49 insertions(+), 6 deletions(-)

diff --git a/public/toc.json b/public/toc.json
index 9103e75b..82d36b51 100644
--- a/public/toc.json
+++ b/public/toc.json
@@ -9,9 +9,11 @@
         "activeIcon": "mdi-file",
         "label": "คู่มือการใช้งานระบบแอดมิน",
         "children": [
+          
             {
                 "label": "การใช้งานผู้ดูแลระบบ",
                 "path": "/manual/chapter-1-superadmin-maintenance"
+                
             },
             {
                 "label": "การใช้งานผู้ดูแลระบบระดับสูง",
diff --git a/src/interface/request/main/type.ts b/src/interface/request/main/type.ts
index 5231b6ef..3fc7ebd4 100644
--- a/src/interface/request/main/type.ts
+++ b/src/interface/request/main/type.ts
@@ -3,8 +3,5 @@ export interface MenuItem {
   activeIcon: string;
   label: string;
   path?: string;
-  children?: {
-    label: string;
-    path: string;
-  }[];
+  children?: MenuItem[];
 }
diff --git a/src/views/MainLayout.vue b/src/views/MainLayout.vue
index a945202e..3ecb6e66 100644
--- a/src/views/MainLayout.vue
+++ b/src/views/MainLayout.vue
@@ -313,7 +313,7 @@ function defaultOpen(index: number) {
           <div v-for="(menuItem, index) in menuList" :key="index">
             <!-- เมนูย่อย -->
             <q-expansion-item
-              v-if="menuItem.children && menuItem.children.length > 0"
+              v-if="menuItem.children && menuItem.children.length !== 0"
               class="menuSub"
               expand-icon="mdi-chevron-down"
               expanded-icon="mdi-chevron-up"
@@ -327,7 +327,51 @@ function defaultOpen(index: number) {
               </template>
 
               <!-- เมนูย่อย 1 ชั้น -->
+              <div v-if="menuItem.children && menuItem.children.length > 0">
+                <div v-for="(subMenu, i) in menuItem.children" :key="i">
+                  <q-expansion-item
+                    switch-toggle-side
+                    dense-toggle
+                    :label="subMenu.label"
+                    v-if="subMenu.children && subMenu.children.length > 0"
+                    class="expan2"
+                    dense
+                  >
+                    <q-item
+                      dense
+                      class="menuSubHover"
+                      active-class="text-primary active-item text-weight-bold menuSubAct"
+                      clickable
+                      v-for="subMenu2 in subMenu.children"
+                      :key="subMenu2.path"
+                      :to="subMenu2.path"
+                    >
+                      <q-item-section>
+                        <q-item-label class="font-400 subLabel"
+                          >{{ subMenu2.label }}
+                        </q-item-label>
+                      </q-item-section>
+                    </q-item>
+                  </q-expansion-item>
+                  <q-item
+                    v-else
+                    dense
+                    class="menuSubHover"
+                    active-class="text-primary active-item text-weight-bold menuSubAct"
+                    clickable
+                    :key="subMenu.path"
+                    :to="subMenu.path"
+                  >
+                    <q-item-section>
+                      <q-item-label class="font-400">
+                        {{ subMenu.label }}
+                      </q-item-label>
+                    </q-item-section>
+                  </q-item>
+                </div>
+              </div>
               <q-item
+                v-else
                 dense
                 class="menuSubHover"
                 active-class="text-primary active-item text-weight-bold menuSubAct"
@@ -413,7 +457,7 @@ function defaultOpen(index: number) {
   font-weight: 500;
 }
 .expan2 .q-item {
-  padding-left: 10%;
+  padding-left: 11%;
 }
 .subLabel {
   white-space: nowrap;