Browse Source

chore(gui-v2): implement nuxt image in attachment components

pull/2972/head
braks 2 years ago
parent
commit
562c4da25f
  1. 2
      packages/nc-gui-v2/components/cell/attachment/Carousel.vue
  2. 5
      packages/nc-gui-v2/components/cell/attachment/index.vue

2
packages/nc-gui-v2/components/cell/attachment/Carousel.vue

@ -86,7 +86,7 @@ onClickOutside(carouselRef, () => {
<template #customPaging="props"> <template #customPaging="props">
<a> <a>
<img <nuxt-img
class="!block" class="!block"
:alt="imageItems[props.i].title || `#${props.i}`" :alt="imageItems[props.i].title || `#${props.i}`"
:src="imageItems[props.i].url || imageItems[props.i].data" :src="imageItems[props.i].url || imageItems[props.i].data"

5
packages/nc-gui-v2/components/cell/attachment/index.vue

@ -100,7 +100,7 @@ onMounted(() => {
</div> </div>
<template v-if="visibleItems.length"> <template v-if="visibleItems.length">
<div ref="sortableRef" :class="{ dragging }" class="flex flex-wrap gap-2 py-1 scrollbar-thin-primary"> <div ref="sortableRef" :class="{ dragging }" class="flex flex-wrap gap-2 p-1 scrollbar-thin-primary">
<div <div
v-for="(item, i) of visibleItems" v-for="(item, i) of visibleItems"
:id="item.url" :id="item.url"
@ -114,8 +114,9 @@ onMounted(() => {
<div class="text-center w-full">{{ item.title }}</div> <div class="text-center w-full">{{ item.title }}</div>
</template> </template>
<img <nuxt-img
v-if="isImage(item.title, item.mimetype)" v-if="isImage(item.title, item.mimetype)"
placeholder
width="150" width="150"
height="150" height="150"
:alt="item.title || `#${i}`" :alt="item.title || `#${i}`"

Loading…
Cancel
Save