quasar-factory-lib 0.1.1 → 0.1.2

package/package.json

@@ -98,6 +98,6 @@
     "release": "standard-version"
   },
   "type": "module",
-  "version": "0.1.1",
+  "version": "0.1.2",
   "author": ""
 }

package/src/components/Table/Table.vue

@@ -527,6 +527,7 @@ export default defineComponent({
         }, {} as { [key: string]: string })
     },
     handleInfiniteScrollTableCompositionAPi () {
+      const offSet = this.showAdvancedFilter   && this.smallDevice ? document.getElementsByClassName('q-table__control')[0].offsetHeight : 0
       this.$nextTick(() => {
         const elemClass = this.smallDevice ? 'q-table__grid-content' : 'q-table__middle scroll'
         const tableType = this.smallDevice ? 'Grid' : 'Table'
@@ -535,7 +536,7 @@ export default defineComponent({
           qtableScrollElem.length > 0 ? qtableScrollElem[0] : window
         const fnAddScroll = (event: Event) => {
           const { scrollHeight, scrollTop, clientHeight } = event.target as HTMLElement
-          if (Math.abs(scrollHeight - clientHeight - scrollTop) < 1) {
+          if (Math.abs(scrollHeight - clientHeight - scrollTop - offSet) < 1) {
             console.log(`[${tableType}] You are at the bottom!`, this.totalPage)
             this.totalPage++
           }

package/src/layouts/PdaLayoutVueCompositionApi.vue

@@ -35,7 +35,7 @@
       <q-page-container>
         <q-page>
         <Table
-          ref="table"
+          ref="tableRef"
           :rows="rows"
           :columns="columns"
           :visible-columns="tableStoreObj.visiblecolumns"
@@ -90,6 +90,19 @@ import setTableHeight from '../components/Table/utils/setTableHeight'
 import { tableStore } from '../store/table.js'
 import { ref, computed, onMounted, watch } from 'vue'
 
+  interface TableInterface {
+    toggleSearchVisibility: (obj: object)=> void
+    filterInputFocus: () => void
+    toogleColumnsSelectorVisibility: () => void
+    clearTableSelection: () => void
+    handleInfiniteScrollTableCompositionAPi: () => void
+    toogleLoading: (val: boolean) => void
+    selected: object[] | []
+    forceRender: boolean
+    enableDragAndDrop: boolean
+    totalPage: number
+  }
+  
     const q = useQuasar()
     const tableStoreObj = tableStore()
     const tabletMaxWidth = ref<number> (1100)
@@ -538,7 +551,7 @@ import { ref, computed, onMounted, watch } from 'vue'
     }
     ]
     const showSkeleton = ref<boolean>(false)
-
+  const tableRef = ref<TableInterface | null>(null)
     const smallDevice = computed(() => {
     return q.screen.width <= tabletMaxWidth.value
     })
@@ -553,6 +566,7 @@ import { ref, computed, onMounted, watch } from 'vue'
             if (!val) {
             setTimeout(() => {
             tableStyle.value = setTableHeight.setTableHeight()
+            tableRef.value?.handleInfiniteScrollTableCompositionAPi()
             }, 500)
         }
     }

package/src/router/routes.ts

@@ -31,7 +31,7 @@ const routes: RouteRecordRaw[] = [
   },
   {
     path: '/pdaLayout',
-    component: () => import('../layouts/PdaLayout.vue')
+    component: () => import('../layouts/PdaLayoutVueCompositionApi.vue')
   }
 ]