Browse Source

fix: group by lookup groupHeaderLabel height changes as row height change

pull/7361/head
Ramesh Mane 8 months ago
parent
commit
53a31efc96
  1. 12
      packages/nc-gui/components/smartsheet/grid/GroupByLabel.vue
  2. 4
      packages/nc-gui/components/virtual-cell/Lookup.vue
  3. 1
      packages/nc-gui/context/index.ts

12
packages/nc-gui/components/smartsheet/grid/GroupByLabel.vue

@ -1,19 +1,27 @@
<script setup lang="ts"> <script setup lang="ts">
import type { ColumnType } from 'nocodb-sdk' import type { ColumnType } from 'nocodb-sdk'
import { isVirtualCol } from 'nocodb-sdk' import { isVirtualCol } from 'nocodb-sdk'
import { ReadonlyInj, IsGroupByLabelInj } from '#imports'
defineProps<{ defineProps<{
column: ColumnType column: ColumnType
modelValue: any modelValue: any
}>() }>()
provide(ReadonlyInj, true) provide(ReadonlyInj, ref(true))
provide(IsGroupByLabelInj, ref(true))
</script> </script>
<template> <template>
<div class="pointer-events-none"> <div class="pointer-events-none">
<LazySmartsheetRow :row="{ row: { [column.title]: modelValue }, rowMeta: {} }"> <LazySmartsheetRow :row="{ row: { [column.title]: modelValue }, rowMeta: {} }">
<LazySmartsheetVirtualCell v-if="isVirtualCol(column)" :model-value="modelValue" class="!text-gray-600" :column="column" /> <LazySmartsheetVirtualCell
v-if="isVirtualCol(column)"
:model-value="modelValue"
class="!text-gray-600"
:column="column"
:read-only="true"
/>
<LazySmartsheetCell <LazySmartsheetCell
v-else v-else

4
packages/nc-gui/components/virtual-cell/Lookup.vue

@ -25,6 +25,8 @@ const meta = inject(MetaInj, ref())
const cellValue = inject(CellValueInj, ref()) const cellValue = inject(CellValueInj, ref())
const isGroupByLabel = inject(IsGroupByLabelInj, ref(false))
// Change the row height of the child cell under lookup // Change the row height of the child cell under lookup
// Other wise things like text will can take multi line tag // Other wise things like text will can take multi line tag
const providedHeightRef = ref(1) as any const providedHeightRef = ref(1) as any
@ -100,7 +102,7 @@ const { showEditNonEditableFieldWarning, showClearNonEditableFieldWarning, activ
<div <div
class="h-full w-full nc-lookup-cell" class="h-full w-full nc-lookup-cell"
tabindex="-1" tabindex="-1"
:style="{ height: rowHeight && rowHeight !== 1 ? `${rowHeight * 2}rem` : `2.85rem` }" :style="{ height: isGroupByLabel ? undefined : rowHeight && rowHeight !== 1 ? `${rowHeight * 2}rem` : `2.85rem` }"
@dblclick="activateShowEditNonEditableFieldWarning" @dblclick="activateShowEditNonEditableFieldWarning"
> >
<div <div

1
packages/nc-gui/context/index.ts

@ -13,6 +13,7 @@ export const IsFormInj: InjectionKey<Ref<boolean>> = Symbol('is-form-injection')
export const IsSurveyFormInj: InjectionKey<Ref<boolean>> = Symbol('is-survey-form-injection') export const IsSurveyFormInj: InjectionKey<Ref<boolean>> = Symbol('is-survey-form-injection')
export const IsGridInj: InjectionKey<Ref<boolean>> = Symbol('is-grid-injection') export const IsGridInj: InjectionKey<Ref<boolean>> = Symbol('is-grid-injection')
export const IsGroupByInj: InjectionKey<Ref<boolean>> = Symbol('is-group-by-injection') export const IsGroupByInj: InjectionKey<Ref<boolean>> = Symbol('is-group-by-injection')
export const IsGroupByLabelInj: InjectionKey<Ref<boolean>> = Symbol('is-group-by-label-injection')
export const IsGalleryInj: InjectionKey<Ref<boolean>> = Symbol('is-gallery-injection') export const IsGalleryInj: InjectionKey<Ref<boolean>> = Symbol('is-gallery-injection')
export const IsKanbanInj: InjectionKey<Ref<boolean>> = Symbol('is-kanban-injection') export const IsKanbanInj: InjectionKey<Ref<boolean>> = Symbol('is-kanban-injection')
export const IsLockedInj: InjectionKey<Ref<boolean>> = Symbol('is-locked-injection') export const IsLockedInj: InjectionKey<Ref<boolean>> = Symbol('is-locked-injection')

Loading…
Cancel
Save