Use thumbnail view when sending attachments

So we can preview videos etc.
This commit is contained in:
N-Pex 2025-07-03 10:54:31 +02:00
parent 2b2c736311
commit e5bb2d7202
4 changed files with 164 additions and 93 deletions

View file

@ -20,17 +20,14 @@
@dragleave.prevent="dropTarget = false"
@dragenter.prevent="dropTarget = true"
>
<v-img
v-if="currentAttachment && currentAttachment.src && currentAttachment.status === 'loaded'"
:src="currentAttachment.src"
/>
<div v-else-if="currentAttachment" class="filename">
<div v-if="currentAttachment && currentAttachment.status === 'loading'" class="filename">
<div>{{ currentAttachment.file.name }}</div>
<div v-if="currentAttachment.status === 'loading'" style="font-size: 0.7em; opacity: 0.7">
<div style="font-size: 0.7em; opacity: 0.7">
{{ $t("message.preparing_to_upload") }}
<v-progress-linear indeterminate class="mb-0"></v-progress-linear>
</div>
</div>
<ThumbnailView v-else :file="currentAttachment" />
<v-btn
class="info-button clickable"
icon="information"
@ -47,7 +44,7 @@
<template v-slot:badge><span v-bind="props">&nbsp;</span></template>
<div
:class="{ 'file-drop-thumbnail': true, clickable: true, current: index == currentItemIndex }"
@click="currentItemIndex = index"
@click="() => { currentItemIndex = index }"
>
<v-img v-if="attachment && attachment.src" :src="attachment.src" />
<div
@ -195,15 +192,15 @@
<script lang="ts">
import { defineComponent, reactive } from "vue";
import messageMixin from "../messages/messageMixin";
import prettyBytes from "pretty-bytes";
import { Attachment } from "../../models/attachment";
import C2PABadge from "../c2pa/C2PABadge.vue";
import { createUploadBatch } from "../../models/attachmentManager";
import AttachmentInfo from "./AttachmentInfo.vue";
import ThumbnailView from "./ThumbnailView.vue";
export default defineComponent({
mixins: [messageMixin],
components: { C2PABadge, AttachmentInfo },
components: { C2PABadge, AttachmentInfo, ThumbnailView },
emits: ["pick-file", "close"],
props: {
defaultRootMessageText: {