Browse Source

fix: pagination on previos page load

pull/6600/head
sreehari jayaraj 1 year ago
parent
commit
3f2efaa40e
  1. 10
      packages/nc-gui/components/smartsheet/expanded-form/index.vue
  2. 18
      packages/nc-gui/components/smartsheet/grid/index.vue
  3. 5
      packages/nc-gui/composables/useExpandedFormStore.ts
  4. 6
      packages/nc-gui/composables/useViewData.ts

10
packages/nc-gui/components/smartsheet/expanded-form/index.vue

@ -69,6 +69,8 @@ const meta = toRef(props, 'meta')
const islastRow = toRef(props, 'lastRow') const islastRow = toRef(props, 'lastRow')
const isFirstRow = toRef(props,'firstRow')
const route = useRoute() const route = useRoute()
const router = useRouter() const router = useRouter()
@ -122,6 +124,7 @@ const {
syncLTARRefs, syncLTARRefs,
save: _save, save: _save,
loadCommentsAndLogs, loadCommentsAndLogs,
clearColumns,
} = useProvideExpandedFormStore(meta, row) } = useProvideExpandedFormStore(meta, row)
const duplicatingRowInProgress = ref(false) const duplicatingRowInProgress = ref(false)
@ -189,15 +192,20 @@ const isPreventChangeModalOpen = ref(false)
const isCloseModalOpen = ref(false) const isCloseModalOpen = ref(false)
const discardPreventModal = () => { const discardPreventModal = () => {
// when user click on next or previous button
if (isPreventChangeModalOpen.value) { if (isPreventChangeModalOpen.value) {
emits('next') emits('next')
if (_row.value?.rowMeta?.new) emits('cancel')
isPreventChangeModalOpen.value = false isPreventChangeModalOpen.value = false
} }
// when user click on close button
if (isCloseModalOpen.value) { if (isCloseModalOpen.value) {
isCloseModalOpen.value = false isCloseModalOpen.value = false
if (_row.value?.rowMeta?.new) emits('cancel') if (_row.value?.rowMeta?.new) emits('cancel')
isExpanded.value = false isExpanded.value = false
} }
// clearing all new modifed change on close
clearColumns()
} }
const onNext = async () => { const onNext = async () => {
@ -419,7 +427,7 @@ export default {
<div class="flex gap-2"> <div class="flex gap-2">
<NcButton <NcButton
v-if="props.showNextPrevIcons" v-if="props.showNextPrevIcons"
:disabled="props.firstRow" :disabled="isFirstRow"
type="secondary" type="secondary"
class="nc-prev-arrow !w-10" class="nc-prev-arrow !w-10"
@click="$emit('prev')" @click="$emit('prev')"

18
packages/nc-gui/components/smartsheet/grid/index.vue

@ -69,6 +69,7 @@ const {
bulkUpdateView, bulkUpdateView,
optimisedQuery, optimisedQuery,
islastRow, islastRow,
isFirstRow,
} = useViewData(meta, view, xWhere) } = useViewData(meta, view, xWhere)
const rowHeight = computed(() => { const rowHeight = computed(() => {
@ -195,6 +196,19 @@ const goToNextRow = () => {
navigateToSiblingRow(NavigateDir.NEXT) navigateToSiblingRow(NavigateDir.NEXT)
} }
const goToPreviousRow = () => {
const currentIndex = getExpandedRowIndex()
/* when first index of current page is reached and then clicked back
previos page should be loaded
*/
if (!paginationData.value.isFirstPage && currentIndex === 1) {
const nextPage = paginationData.value?.page ? paginationData.value?.page - 1 : 1
changePage(nextPage)
}
navigateToSiblingRow(NavigateDir.PREV)
}
</script> </script>
<template> <template>
@ -258,10 +272,10 @@ const goToNextRow = () => {
:row-id="routeQuery.rowId" :row-id="routeQuery.rowId"
:view="view" :view="view"
show-next-prev-icons show-next-prev-icons
:first-row="getExpandedRowIndex() === 0" :first-row="isFirstRow"
:last-row="islastRow" :last-row="islastRow"
@next="goToNextRow()" @next="goToNextRow()"
@prev="navigateToSiblingRow(NavigateDir.PREV)" @prev="goToPreviousRow()"
/> />
<Suspense> <Suspense>

5
packages/nc-gui/composables/useExpandedFormStore.ts

@ -279,6 +279,10 @@ const [useProvideExpandedFormStore, useExpandedFormStore] = useInjectionState((m
return data return data
} }
const clearColumns = () => {
changedColumns.value = new Set()
}
const loadRow = async (rowId?: string) => { const loadRow = async (rowId?: string) => {
const record = await $api.dbTableRow.read( const record = await $api.dbTableRow.read(
NOCO, NOCO,
@ -344,6 +348,7 @@ const [useProvideExpandedFormStore, useExpandedFormStore] = useInjectionState((m
primaryKey, primaryKey,
saveRowAndStay, saveRowAndStay,
updateComment, updateComment,
clearColumns,
} }
}, 'expanded-form-store') }, 'expanded-form-store')

6
packages/nc-gui/composables/useViewData.ts

@ -104,6 +104,11 @@ export function useViewData(
return paginationData.value?.isLastPage && currentIndex === formattedData.value.length - 1 return paginationData.value?.isLastPage && currentIndex === formattedData.value.length - 1
}) })
const isFirstRow = computed(() => {
const currentIndex = getExpandedRowIndex()
return paginationData.value?.isFirstPage && currentIndex === 1
})
const queryParams = computed(() => ({ const queryParams = computed(() => ({
offset: ((paginationData.value.page ?? 0) - 1) * (paginationData.value.pageSize ?? appInfoDefaultLimit), offset: ((paginationData.value.page ?? 0) - 1) * (paginationData.value.pageSize ?? appInfoDefaultLimit),
limit: paginationData.value.pageSize ?? appInfoDefaultLimit, limit: paginationData.value.pageSize ?? appInfoDefaultLimit,
@ -386,5 +391,6 @@ export function useViewData(
getExpandedRowIndex, getExpandedRowIndex,
optimisedQuery, optimisedQuery,
islastRow, islastRow,
isFirstRow,
} }
} }

Loading…
Cancel
Save