diff --git a/packages/nc-gui/components/dlg/ViewCreate.vue b/packages/nc-gui/components/dlg/ViewCreate.vue index f913ebf301..56921ff787 100644 --- a/packages/nc-gui/components/dlg/ViewCreate.vue +++ b/packages/nc-gui/components/dlg/ViewCreate.vue @@ -2,7 +2,17 @@ import type { ComponentPublicInstance } from '@vue/runtime-core' import { capitalize } from '@vue/runtime-core' import type { Form as AntForm, SelectProps } from 'ant-design-vue' -import type { CalendarType, FormType, GalleryType, GridType, KanbanType, MapType, TableType } from 'nocodb-sdk' +import type { + CalendarType, + ColumnType, + FormType, + GalleryType, + GridType, + KanbanType, + LookupType, + MapType, + TableType, +} from 'nocodb-sdk' import { UITypes, ViewTypes, isSystemColumn } from 'nocodb-sdk' interface Props { @@ -52,7 +62,7 @@ const props = withDefaults(defineProps(), { const emits = defineEmits() -const { getMeta } = useMetas() +const { metas, getMeta } = useMetas() const { viewsByTable } = storeToRefs(useViewsStore()) @@ -266,8 +276,8 @@ onMounted(async () => { if (props.type === ViewTypes.GALLERY) { viewSelectFieldOptions.value = [ { value: null, label: 'No Image' }, - ...meta.value - .columns!.filter((el) => el.uidt === UITypes.Attachment) + ...(meta.value.columns || []) + .filter((el) => el.uidt === UITypes.Attachment) .map((field) => { return { value: field.id, @@ -276,6 +286,47 @@ onMounted(async () => { } }), ] + const lookupColumns = (meta.value.columns || [])?.filter((c) => c.uidt === UITypes.Lookup) + + const attLookupColumnIds: Set = new Set() + + const loadLookupMeta = async (originalCol: ColumnType, column: ColumnType, metaId?: string): Promise => { + const relationColumn = + metaId || meta.value?.id + ? metas.value[metaId || meta.value?.id]?.columns?.find( + (c: ColumnType) => c.id === (column?.colOptions as LookupType)?.fk_relation_column_id, + ) + : undefined + + if (relationColumn?.colOptions?.fk_related_model_id) { + await getMeta(relationColumn.colOptions.fk_related_model_id!) + + const lookupColumn = metas.value[relationColumn.colOptions.fk_related_model_id]?.columns?.find( + (c: any) => c.id === (column?.colOptions as LookupType)?.fk_lookup_column_id, + ) as ColumnType | undefined + + if (lookupColumn && isAttachment(lookupColumn)) { + attLookupColumnIds.add(originalCol.id) + return + } else if (lookupColumn && lookupColumn?.uidt === UITypes.Lookup) { + await loadLookupMeta(originalCol, lookupColumn, relationColumn.colOptions.fk_related_model_id) + } + } + } + + await Promise.allSettled(lookupColumns.map((col) => loadLookupMeta(col, col))) + + const lookupAttColumns = lookupColumns + .filter((column) => attLookupColumnIds.has(column?.id)) + .map((c) => { + return { + value: c.id, + label: c.title, + uidt: c.uidt, + } + }) + + viewSelectFieldOptions.value = [...viewSelectFieldOptions.value, ...lookupAttColumns] if (coverImageColumnId.value) { form.fk_cover_image_col_id = coverImageColumnId.value diff --git a/packages/nc-gui/components/smartsheet/Gallery.vue b/packages/nc-gui/components/smartsheet/Gallery.vue index 53260cc72e..52bced22c6 100644 --- a/packages/nc-gui/components/smartsheet/Gallery.vue +++ b/packages/nc-gui/components/smartsheet/Gallery.vue @@ -87,12 +87,21 @@ const showContextMenu = (e: MouseEvent, target?: { row: RowType; index: number } } const attachments = (record: any): Attachment[] => { + if (!coverImageColumn.value?.title || !record.row[coverImageColumn.value.title]) return [] + try { - if (coverImageColumn.value?.title && record.row[coverImageColumn.value.title]) { - return typeof record.row[coverImageColumn.value.title] === 'string' + const att = + typeof record.row[coverImageColumn.value.title] === 'string' ? JSON.parse(record.row[coverImageColumn.value.title]) : record.row[coverImageColumn.value.title] + + if (Array.isArray(att)) { + return att + .flat() + .map((a) => (typeof a === 'string' ? JSON.parse(a) : a)) + .filter((a) => a && !Array.isArray(a) && typeof a === 'object' && Object.keys(a).length) } + return [] } catch (e) { return [] diff --git a/packages/nc-gui/components/smartsheet/Kanban.vue b/packages/nc-gui/components/smartsheet/Kanban.vue index d9205cc5f9..e4d932b97e 100644 --- a/packages/nc-gui/components/smartsheet/Kanban.vue +++ b/packages/nc-gui/components/smartsheet/Kanban.vue @@ -118,12 +118,21 @@ reloadViewDataHook?.on(async () => { }) const attachments = (record: any): Attachment[] => { + if (!coverImageColumn.value?.title || !record.row[coverImageColumn.value.title]) return [] + try { - if (coverImageColumn.value?.title && record.row[coverImageColumn.value.title]) { - return typeof record.row[coverImageColumn.value.title] === 'string' + const att = + typeof record.row[coverImageColumn.value.title] === 'string' ? JSON.parse(record.row[coverImageColumn.value.title]) : record.row[coverImageColumn.value.title] + + if (Array.isArray(att)) { + return att + .flat() + .map((a) => (typeof a === 'string' ? JSON.parse(a) : a)) + .filter((a) => a && !Array.isArray(a) && typeof a === 'object' && Object.keys(a).length) } + return [] } catch (e) { return [] diff --git a/packages/nc-gui/components/smartsheet/toolbar/FieldsMenu.vue b/packages/nc-gui/components/smartsheet/toolbar/FieldsMenu.vue index fee716c912..e715d24c52 100644 --- a/packages/nc-gui/components/smartsheet/toolbar/FieldsMenu.vue +++ b/packages/nc-gui/components/smartsheet/toolbar/FieldsMenu.vue @@ -1,5 +1,5 @@ @@ -417,7 +476,7 @@ useMenuCloseOnEsc(open) >
{{ $t('labels.coverImageField') }}
@@ -427,7 +486,7 @@ useMenuCloseOnEsc(open) diff --git a/packages/nc-gui/components/virtual-cell/Lookup.vue b/packages/nc-gui/components/virtual-cell/Lookup.vue index 3f1012548a..f3b9b981d7 100644 --- a/packages/nc-gui/components/virtual-cell/Lookup.vue +++ b/packages/nc-gui/components/virtual-cell/Lookup.vue @@ -236,4 +236,10 @@ const { showEditNonEditableFieldWarning, showClearNonEditableFieldWarning, activ .nc-lookup-cell .nc-text-area-clamped-text { @apply !mr-1; } + +.nc-lookup-cell { + &:has(.nc-cell-attachment) { + height: auto !important; + } +}