From c677511faac578d9b4ab34b101bec955d2af9b41 Mon Sep 17 00:00:00 2001
From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" <nicey2t1096@gmail.com>
Date: Thu, 8 Aug 2024 13:38:38 +0700
Subject: [PATCH] =?UTF-8?q?=E0=B8=9E=E0=B8=B1=E0=B8=92=E0=B8=99=E0=B8=B2?=
 =?UTF-8?q?=20=3D>=20=E0=B9=82=E0=B8=84=E0=B8=A3=E0=B8=87=E0=B8=81?=
 =?UTF-8?q?=E0=B8=B2=E0=B8=A3/=E0=B8=AB=E0=B8=A5=E0=B8=B1=E0=B8=81?=
 =?UTF-8?q?=E0=B8=AA=E0=B8=B9=E0=B8=95=E0=B8=A3=E0=B8=81=E0=B8=B2=E0=B8=A3?=
 =?UTF-8?q?=E0=B8=9D=E0=B8=B6=E0=B8=81=E0=B8=AD=E0=B8=9A=E0=B8=A3=E0=B8=A1?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../02_users/views/permissionDetail.vue       | 38 +++++++++++++++++++
 1 file changed, 38 insertions(+)

diff --git a/src/modules/02_users/views/permissionDetail.vue b/src/modules/02_users/views/permissionDetail.vue
index 10327662..eb9a4d96 100644
--- a/src/modules/02_users/views/permissionDetail.vue
+++ b/src/modules/02_users/views/permissionDetail.vue
@@ -259,6 +259,8 @@ onMounted(() => {
 
       <div class="col-12">
         <q-table
+          class="my-sticky-dynamic"
+          virtual-scroll
           flat
           bordered
           :rows="systemLists"
@@ -701,4 +703,40 @@ onMounted(() => {
   top: -2px;
   right: -2px;
 }
+
+.my-sticky-dynamic {
+  /* Large screens and up */
+
+  height: 65vh;
+
+  .q-table__top,
+  .q-table__bottom,
+  thead tr:first-child th {
+    /* bg color is important for th; just specify one */
+    background-color: #fff; /* Replace with your desired color */
+  }
+
+  thead tr th {
+    position: sticky;
+    z-index: 1;
+    top: 0; /* Default top position for all th elements */
+    background-color: #fff; /* Replace with your desired color */
+  }
+
+  /* this will be the loading indicator */
+  thead tr:last-child th {
+    /* height of all previous header rows */
+    top: 48px; /* Adjust this value based on the cumulative height of previous header rows */
+  }
+
+  thead tr:first-child th {
+    top: 0;
+  }
+
+  /* prevent scrolling behind sticky top row on focus */
+  tbody {
+    /* height of all previous header rows */
+    scroll-margin-top: 48px; /* Adjust this value based on the cumulative height of previous header rows */
+  }
+}
 </style>