Browse Source

fix(nc-gui): Improved generic pagination

pull/6605/head
Muhammed Mustafa 1 year ago
parent
commit
4551ba51e5
  1. 15
      packages/nc-gui/components/nc/Pagination.vue

15
packages/nc-gui/components/nc/Pagination.vue

@ -70,8 +70,11 @@ const pagesList = computed(() => {
> >
<GeneralIcon icon="arrowLeft" /> <GeneralIcon icon="arrowLeft" />
</NcButton> </NcButton>
<div class="text-gray-600"> <div v-if="!isMobileMode" class="text-gray-600">
<a-select v-model:value="current" class="!mr-[2px]" virtual> <a-select v-model:value="current" class="!mr-[2px]" virtual>
<template #suffixIcon>
<GeneralIcon icon="arrowDown" class="text-gray-500 nc-select-expand-btn" />
</template>
<a-select-option v-for="p of pagesList" :key="`p-${p}`" @click="changePage({ set: p })">{{ p }}</a-select-option> <a-select-option v-for="p of pagesList" :key="`p-${p}`" @click="changePage({ set: p })">{{ p }}</a-select-option>
</a-select> </a-select>
<span class="mx-1"> {{ mode !== 'full' ? '/' : 'of' }} </span> <span class="mx-1"> {{ mode !== 'full' ? '/' : 'of' }} </span>
@ -104,3 +107,13 @@ const pagesList = computed(() => {
</NcButton> </NcButton>
</div> </div>
</template> </template>
<style lang="scss" scoped>
:deep(.ant-select-selector) {
@apply !border-gray-200 !rounded-lg;
}
:deep(.ant-select-dropdown) {
@apply !rounded-lg !overflow-hidden;
}
</style>

Loading…
Cancel
Save