fix: infiniteScroll

src/modules/03_logs/components/LogTable.vue

@@ -147,10 +147,20 @@ const visibleColumns = ref<string[]>([
   "dataDiff",
 ]);
 
-function handleScroll(event: any) {
+function handleScroll() {
-  const element = event.target;
+  let scrollFlag = false;
-  if (element.scrollHeight - element.scrollTop === element.clientHeight) {
+  return async (e: Event) => {
-    storeData.fetchLog(
+    if (scrollFlag) return;
+
+    const element = e.target as HTMLElement;
+
+    if (
+      Math.abs(
+        element.scrollHeight - element.clientHeight - element.scrollTop
+      ) <= 1
+    ) {
+      scrollFlag = true;
+      await storeData.fetchLog(
         {
           size: size.value ?? undefined,
           search: inputSearch.value ?? undefined,
@@ -160,10 +170,13 @@ function handleScroll(event: any) {
         },
         true
       );
-    setTimeout(() => {}, 500);
+      scrollFlag = false;
     }
+  };
 }
 
+const infiniteScroll = handleScroll();
+
 function selectedDate() {
   logData.value = [];
   searchAfter.value = undefined;
@@ -277,7 +290,7 @@ onMounted(() => {
       </div>
     </div>
     <div class="q-pa-md">
-      <div style="max-height: 70vh; overflow: scroll" @scroll="handleScroll">
+      <div style="max-height: 70vh; overflow: scroll" @scroll="infiniteScroll">
         <d-table
           ref="table"
           :columns="columns"