Browse Source

fix: load expnaded form row on cliking on bt, ltar cell chip (#8950)

* fix(nc-gui): load expnaded form row on cliking on bt, ltar cell chip

* fix(nc-gui): chip content alignment issue
pull/8952/head
Ramesh Mane 5 months ago committed by GitHub
parent
commit
b56c585572
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
  1. 4
      packages/nc-gui/components/virtual-cell/BelongsTo.vue
  2. 2
      packages/nc-gui/components/virtual-cell/HasMany.vue
  3. 2
      packages/nc-gui/components/virtual-cell/ManyToMany.vue
  4. 4
      packages/nc-gui/components/virtual-cell/OneToOne.vue
  5. 49
      packages/nc-gui/components/virtual-cell/components/ItemChip.vue

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

@ -87,8 +87,8 @@ watch(value, (next) => {
<template> <template>
<div class="flex w-full chips-wrapper items-center" :class="{ active }"> <div class="flex w-full chips-wrapper items-center" :class="{ active }">
<LazyVirtualCellComponentsLinkRecordDropdown v-model:is-open="isOpen"> <LazyVirtualCellComponentsLinkRecordDropdown v-model:is-open="isOpen">
<div class="flex items-center w-full"> <div class="nc-cell-field flex items-center w-full">
<div class="nc-cell-field chips flex items-center flex-1" :class="{ 'max-w-[calc(100%_-_16px)]': !isUnderLookup }"> <div class="chips flex items-center flex-1" :class="{ 'max-w-[calc(100%_-_16px)]': !isUnderLookup }">
<template v-if="value && (relatedTableDisplayValueProp || relatedTableDisplayValuePropId)"> <template v-if="value && (relatedTableDisplayValueProp || relatedTableDisplayValuePropId)">
<VirtualCellComponentsItemChip <VirtualCellComponentsItemChip
:item="value" :item="value"

2
packages/nc-gui/components/virtual-cell/HasMany.vue

@ -127,7 +127,7 @@ watch(
<template> <template>
<LazyVirtualCellComponentsLinkRecordDropdown v-model:is-open="isOpen"> <LazyVirtualCellComponentsLinkRecordDropdown v-model:is-open="isOpen">
<div class="flex items-center gap-1 w-full chips-wrapper min-h-4"> <div class="nc-cell-field flex items-center gap-1 w-full chips-wrapper min-h-4">
<div class="chips flex items-center img-container flex-1 hm-items flex-nowrap min-w-0 overflow-hidden"> <div class="chips flex items-center img-container flex-1 hm-items flex-nowrap min-w-0 overflow-hidden">
<template v-if="cells"> <template v-if="cells">
<VirtualCellComponentsItemChip <VirtualCellComponentsItemChip

2
packages/nc-gui/components/virtual-cell/ManyToMany.vue

@ -126,7 +126,7 @@ watch(
<template> <template>
<LazyVirtualCellComponentsLinkRecordDropdown v-model:is-open="isOpen"> <LazyVirtualCellComponentsLinkRecordDropdown v-model:is-open="isOpen">
<div class="flex items-center gap-1 w-full chips-wrapper min-h-4"> <div class="nc-cell-field flex items-center gap-1 w-full chips-wrapper min-h-4">
<div class="chips flex items-center img-container flex-1 hm-items flex-nowrap min-w-0 overflow-hidden"> <div class="chips flex items-center img-container flex-1 hm-items flex-nowrap min-w-0 overflow-hidden">
<template v-if="cells"> <template v-if="cells">
<VirtualCellComponentsItemChip <VirtualCellComponentsItemChip

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

@ -84,8 +84,8 @@ watch(
<template> <template>
<LazyVirtualCellComponentsLinkRecordDropdown v-model:is-open="isOpen"> <LazyVirtualCellComponentsLinkRecordDropdown v-model:is-open="isOpen">
<div class="flex w-full chips-wrapper items-center min-h-4" :class="{ active }"> <div class="nc-cell-field flex w-full chips-wrapper items-center min-h-4" :class="{ active }">
<div class="nc-cell-field chips flex items-center flex-1 max-w-[calc(100%_-_16px)]"> <div class="chips flex items-center flex-1 max-w-[calc(100%_-_16px)]">
<template v-if="value && (relatedTableDisplayValueProp || relatedTableDisplayValuePropId)"> <template v-if="value && (relatedTableDisplayValueProp || relatedTableDisplayValuePropId)">
<VirtualCellComponentsItemChip <VirtualCellComponentsItemChip
:item="value" :item="value"

49
packages/nc-gui/components/virtual-cell/components/ItemChip.vue

@ -27,6 +27,8 @@ const isForm = inject(IsFormInj)!
const isExpandedForm = inject(IsExpandedFormOpenInj, ref(false)) const isExpandedForm = inject(IsExpandedFormOpenInj, ref(false))
const isPublic = inject(IsPublicInj, ref(false))
const { open } = useExpandedFormDetached() const { open } = useExpandedFormDetached()
function openExpandedForm() { function openExpandedForm() {
@ -40,6 +42,7 @@ function openExpandedForm() {
meta: relatedTableMeta.value, meta: relatedTableMeta.value,
rowId, rowId,
useMetaFields: true, useMetaFields: true,
loadRow: !isPublic.value,
}) })
} }
} }
@ -58,7 +61,7 @@ export default {
:class="{ active, 'border-1 py-1 px-2': isAttachment(column) }" :class="{ active, 'border-1 py-1 px-2': isAttachment(column) }"
@click="openExpandedForm" @click="openExpandedForm"
> >
<div class="text-ellipsis overflow-hidden"> <div class="text-ellipsis overflow-hidden pointer-events-none">
<span class="name"> <span class="name">
<!-- Render virtual cell --> <!-- Render virtual cell -->
<div v-if="isVirtualCol(column)"> <div v-if="isVirtualCol(column)">
@ -112,5 +115,49 @@ export default {
white-space: nowrap; white-space: nowrap;
word-break: keep-all; word-break: keep-all;
} }
:deep(.nc-action-icon) {
@apply invisible;
}
:deep(.nc-cell) {
&.nc-cell-longtext {
.long-text-wrapper {
@apply min-h-1;
.nc-readonly-rich-text-wrapper {
@apply !min-h-1;
}
.nc-rich-text {
@apply pl-0;
.tiptap.ProseMirror {
@apply -ml-1 min-h-1;
}
}
}
}
&.nc-cell-checkbox {
@apply children:pl-0;
& > div {
@apply !h-auto;
}
}
&.nc-cell-singleselect .nc-cell-field > div {
@apply flex items-center;
}
&.nc-cell-multiselect .nc-cell-field > div {
@apply h-5;
}
&.nc-cell-email,
&.nc-cell-phonenumber {
@apply flex items-center;
}
&.nc-cell-email,
&.nc-cell-phonenumber,
&.nc-cell-url {
.nc-cell-field-link {
@apply py-0;
}
}
}
} }
</style> </style>

Loading…
Cancel
Save