Browse Source

fix(nc-gui): ListItem

pull/6451/head
WK Wong 1 year ago
parent
commit
8e6f67c2e0
  1. 30
      packages/nc-gui/components/virtual-cell/components/ListItem.vue

30
packages/nc-gui/components/virtual-cell/components/ListItem.vue

@ -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>

Loading…
Cancel
Save