From 09cba46485d192f65f2786e604a852a797058364 Mon Sep 17 00:00:00 2001
From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" <nicey2t1096@gmail.com>
Date: Thu, 7 Aug 2025 11:12:22 +0700
Subject: [PATCH 1/2] fix skeleton

---
 src/modules/05_leave/components/Calendar.vue  | 13 ++++++++++-
 .../05_leave/components/DialogDetail.vue      | 23 +++++++++++++------
 2 files changed, 28 insertions(+), 8 deletions(-)

diff --git a/src/modules/05_leave/components/Calendar.vue b/src/modules/05_leave/components/Calendar.vue
index e92bb73..572fded 100644
--- a/src/modules/05_leave/components/Calendar.vue
+++ b/src/modules/05_leave/components/Calendar.vue
@@ -267,7 +267,18 @@ onMounted(async () => {
   <div class="row">
     <div class="col-xs-12 col-md-3 q-mt-sm q-pr-sm row">
       <q-card class="col-12" flat bordered>
-        <q-skeleton height="100%" square v-if="isLoading" />
+        <q-card-section v-if="isLoading">
+          <q-item>
+            <q-item-section avatar>
+              <q-skeleton type="QToggle" height="20px" width="25px" />
+            </q-item-section>
+
+            <q-item-section>
+              <q-skeleton type="text" class="text-subtitle1" />
+            </q-item-section>
+          </q-item>
+        </q-card-section>
+
         <q-scroll-area style="height: 38vw" v-else>
           <div class="q-gutter-sm col-12">
             <q-list class="rounded-borders q-pt-sm" dense>
diff --git a/src/modules/05_leave/components/DialogDetail.vue b/src/modules/05_leave/components/DialogDetail.vue
index 8c04469..fb12eb2 100644
--- a/src/modules/05_leave/components/DialogDetail.vue
+++ b/src/modules/05_leave/components/DialogDetail.vue
@@ -441,11 +441,15 @@ watch(
       />
 
       <q-separator />
+      <q-card-section v-if="isLoading">
+        <div v-for="i in 5" :key="i">
+          <q-skeleton type="text" class="text-subtitle1" />
+          <q-skeleton type="text" class="text-subtitle1" />
+        </div>
+      </q-card-section>
 
-      <q-card-section class="scroll" style="max-height: 60vh">
-        <q-skeleton height="400px" square v-if="isLoading" />
-
-        <div class="row" v-else>
+      <q-card-section v-else class="scroll" style="max-height: 60vh">
+        <div class="row">
           <div
             flat
             :class="
@@ -584,9 +588,14 @@ watch(
       />
 
       <q-separator />
-      <q-card-section class="q-p-md row q-gutter-y-md">
-        <q-skeleton height="400px" width="100%" square v-if="isLoading" />
-        <div flat class="col-12" v-else>
+      <q-card-section v-if="isLoading">
+        <div v-for="i in 5" :key="i">
+          <q-skeleton type="text" class="text-subtitle1" />
+          <q-skeleton type="text" class="text-subtitle1" />
+        </div>
+      </q-card-section>
+      <q-card-section class="q-p-md row q-gutter-y-md" v-else>
+        <div flat class="col-12">
           <div class="col-12 q-col-gutter-sm row items-center"></div>
           <FormCancel :data="formDataCancle" />
         </div>

From 4c4d9737b7ffff5ec09a80f95c087d48a51f90de Mon Sep 17 00:00:00 2001
From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" <nicey2t1096@gmail.com>
Date: Thu, 7 Aug 2025 11:12:28 +0700
Subject: [PATCH 2/2] no message

---
 src/modules/05_leave/components/DialogDetail.vue | 6 ++----
 1 file changed, 2 insertions(+), 4 deletions(-)

diff --git a/src/modules/05_leave/components/DialogDetail.vue b/src/modules/05_leave/components/DialogDetail.vue
index fb12eb2..2c05ebd 100644
--- a/src/modules/05_leave/components/DialogDetail.vue
+++ b/src/modules/05_leave/components/DialogDetail.vue
@@ -442,8 +442,7 @@ watch(
 
       <q-separator />
       <q-card-section v-if="isLoading">
-        <div v-for="i in 5" :key="i">
-          <q-skeleton type="text" class="text-subtitle1" />
+        <div v-for="i in 10" :key="i">
           <q-skeleton type="text" class="text-subtitle1" />
         </div>
       </q-card-section>
@@ -589,8 +588,7 @@ watch(
 
       <q-separator />
       <q-card-section v-if="isLoading">
-        <div v-for="i in 5" :key="i">
-          <q-skeleton type="text" class="text-subtitle1" />
+        <div v-for="i in 10" :key="i">
           <q-skeleton type="text" class="text-subtitle1" />
         </div>
       </q-card-section>