|
|
|
@ -1,6 +1,19 @@
|
|
|
|
|
<script lang="ts" setup> |
|
|
|
|
import { isVirtualCol } from 'nocodb-sdk' |
|
|
|
|
import { IsFormInj, isImage, useAttachment } from '#imports' |
|
|
|
|
import { |
|
|
|
|
type ComputedRef, |
|
|
|
|
IsExpandedFormOpenInj, |
|
|
|
|
IsFormInj, |
|
|
|
|
IsPublicInj, |
|
|
|
|
RowHeightInj, |
|
|
|
|
computed, |
|
|
|
|
inject, |
|
|
|
|
isImage, |
|
|
|
|
provide, |
|
|
|
|
ref, |
|
|
|
|
useAttachment, |
|
|
|
|
useVModel, |
|
|
|
|
} from '#imports' |
|
|
|
|
import MaximizeIcon from '~icons/nc-icons/maximize' |
|
|
|
|
import LinkIcon from '~icons/nc-icons/link' |
|
|
|
|
|
|
|
|
@ -12,14 +25,15 @@ const props = defineProps<{
|
|
|
|
|
isLoading: boolean |
|
|
|
|
isLinked: boolean |
|
|
|
|
}>() |
|
|
|
|
|
|
|
|
|
defineEmits(['expand']) |
|
|
|
|
|
|
|
|
|
provide(IsExpandedFormOpenInj, ref(true)) |
|
|
|
|
|
|
|
|
|
const isForm = inject(IsFormInj, ref(false)) |
|
|
|
|
|
|
|
|
|
provide(RowHeightInj, ref(1 as const)) |
|
|
|
|
|
|
|
|
|
const isForm = inject(IsFormInj, ref(false)) |
|
|
|
|
|
|
|
|
|
const row = useVModel(props, 'row') |
|
|
|
|
|
|
|
|
|
const isPublic = inject(IsPublicInj, ref(false)) |
|
|
|
@ -35,7 +49,7 @@ interface Attachment {
|
|
|
|
|
|
|
|
|
|
const attachments: ComputedRef<Attachment[]> = computed(() => { |
|
|
|
|
try { |
|
|
|
|
if (props.attachment && props.row[props.attachment.title]) { |
|
|
|
|
if (props.attachment && row.value[props.attachment.title]) { |
|
|
|
|
return typeof row.value[props.attachment.title] === 'string' |
|
|
|
|
? JSON.parse(row.value[props.attachment.title]) |
|
|
|
|
: row.value[props.attachment.title] |
|
|
|
@ -61,12 +75,12 @@ const attachments: ComputedRef<Attachment[]> = computed(() => {
|
|
|
|
|
<div class="flex flex-row items-center justify-start w-full"> |
|
|
|
|
<a-carousel v-if="attachment && attachments && attachments.length" autoplay class="!w-24 !h-24"> |
|
|
|
|
<template #customPaging> </template> |
|
|
|
|
<template v-for="(attachmen, index) in attachments"> |
|
|
|
|
<template v-for="(attachmentObj, index) in attachments"> |
|
|
|
|
<LazyCellAttachmentImage |
|
|
|
|
v-if="isImage(attachmen.title, attachmen.mimetype ?? attachmen.type)" |
|
|
|
|
:key="`carousel-${attachmen.title}-${index}`" |
|
|
|
|
v-if="isImage(attachmentObj.title, attachmentObj.mimetype ?? attachmentObj.type)" |
|
|
|
|
:key="`carousel-${attachmentObj.title}-${index}`" |
|
|
|
|
class="!h-24 !w-24 object-cover !rounded-l-xl" |
|
|
|
|
:srcs="getPossibleAttachmentSrc(attachmen)" |
|
|
|
|
:srcs="getPossibleAttachmentSrc(attachmentObj)" |
|
|
|
|
/> |
|
|
|
|
</template> |
|
|
|
|
</a-carousel> |
|
|
|
|