Browse Source

fix: group by for small tables

pull/6633/head
mertmit 1 year ago
parent
commit
989441c0f9
  1. 15
      packages/nc-gui/components/smartsheet/grid/GroupBy.vue

15
packages/nc-gui/components/smartsheet/grid/GroupBy.vue

@ -18,6 +18,7 @@ const props = defineProps<{
viewWidth?: number
scrollLeft?: number
fullPage?: boolean
depth?: number
maxDepth?: number
@ -40,6 +41,12 @@ const wrapper = ref<HTMLElement | undefined>()
const scrollable = ref<HTMLElement | undefined>()
const tableHeader = ref<HTMLElement | undefined>()
const fullPage = computed<boolean>(() => {
return props.fullPage ?? (tableHeader.value?.offsetWidth ?? 0) > (props.viewWidth ?? 0)
})
const _activeGroupKeys = ref<string[] | string>()
const activeGroups = computed<string[]>(() => {
@ -149,7 +156,7 @@ const onScroll = (e: Event) => {
style="background-color: #f9f9fa; border-color: #e7e7e9; border-bottom-width: 1px"
:style="{ 'padding-left': `${(maxDepth || 1) * 13}px` }"
></div>
<Table class="mb-2" :data="[]" :header-only="true" />
<Table ref="tableHeader" class="mb-2" :data="[]" :header-only="true" />
</div>
<div :class="{ 'px-[12px]': vGroup.root === true }">
<a-collapse
@ -258,11 +265,12 @@ const onScroll = (e: Event) => {
:row-height="rowHeight"
:redistribute-rows="redistributeRows"
:expand-form="expandForm"
:pagination-fixed-size="props.viewWidth"
:pagination-fixed-size="fullPage ? props.viewWidth : undefined"
:pagination-hide-sidebars="true"
:scroll-left="props.scrollLeft || _scrollLeft"
:view-width="viewWidth"
:scrollable="scrollable"
:full-page="fullPage"
/>
<GroupBy
v-else
@ -277,6 +285,7 @@ const onScroll = (e: Event) => {
:view-width="viewWidth"
:depth="_depth + 1"
:scroll-left="scrollBump"
:full-page="fullPage"
/>
</a-collapse-panel>
</a-collapse>
@ -299,7 +308,7 @@ const onScroll = (e: Event) => {
:change-page="(p: number) => groupWrapperChangePage(p, vGroup)"
:hide-sidebars="true"
:style="`${props.depth && props.depth > 0 ? 'border-radius: 0 0 12px 12px !important;' : ''}margin-left: ${scrollBump}px;`"
:fixed-size="props.viewWidth"
:fixed-size="fullPage ? props.viewWidth : undefined"
></LazySmartsheetPagination>
</div>
</template>

Loading…
Cancel
Save