mirror of
https://github.com/scinote-eln/scinote-web.git
synced 2024-09-25 09:26:15 +08:00
ccf95fea24
* Fix bugs for step attachments [SCI-6966] * Fix flickering on fast drag over of file [SCI-6966] * Fix flickering on fast drag over of file [SCI-6966] * CSS fixes, rearrange steps button hiding [SCI-6940][SCI-6934] (#4234) * Hide rearange steps button when less than 2 steps [SCI-6934] * Task status buttons CSS fix [SCI-6940] * Fix microinteraction for table editing [SCI-6957] (#4236) * Fix protocol elements allignments [SCI-6932] * DOCX layout improvements [SCI-6857] (#4160) * Fix edit step button [SCI-6938] (#4232) * Clean storage usage check [SCI-6966] Co-authored-by: artoscinote <85488244+artoscinote@users.noreply.github.com> Co-authored-by: Anton <anton@scinote.net>
60 lines
1.9 KiB
Vue
60 lines
1.9 KiB
Vue
<template>
|
|
<div class="attachment-container asset"
|
|
:data-asset-id="attachment.id"
|
|
>
|
|
<a :href="attachment.attributes.urls.blob"
|
|
class="file-preview-link file-name"
|
|
:id="`modal_link${attachment.id}`"
|
|
data-no-turbolink="true"
|
|
:data-id="attachment.id"
|
|
:data-gallery-view-id="stepId"
|
|
:data-preview-url="attachment.attributes.urls.preview"
|
|
>
|
|
<div class="attachment-preview" :class= "attachment.attributes.asset_type">
|
|
<img v-if="attachment.attributes.medium_preview !== null"
|
|
:src="attachment.attributes.medium_preview"
|
|
@error="ActiveStoragePreviews.reCheckPreview"
|
|
@load="ActiveStoragePreviews.showPreview"
|
|
style='opacity: 0' />
|
|
<i v-else class="fas" :class="attachment.attributes.icon"></i>
|
|
</div>
|
|
<div class="attachment-label">
|
|
{{ attachment.attributes.file_name }}
|
|
<span v-if="attachment.isNewUpload" class="attachment-label-new">
|
|
{{ i18n.t('protocols.steps.attachments.new.description') }}
|
|
</span>
|
|
</div>
|
|
<div class="attachment-metadata">
|
|
{{ i18n.t('assets.placeholder.modified_label') }} {{ attachment.attributes.updated_at_formatted }}<br>
|
|
{{ attachment.attributes.file_size_formatted }}
|
|
</div>
|
|
</a>
|
|
<ContextMenu
|
|
:attachment="attachment"
|
|
@attachment:viewMode="updateViewMode"
|
|
@attachment:delete="deleteAttachment"
|
|
/>
|
|
</div>
|
|
|
|
</template>
|
|
|
|
<script>
|
|
import ContextMenuMixin from './mixins/context_menu.js'
|
|
import ContextMenu from './context_menu.vue'
|
|
export default {
|
|
name: 'thumbnailAttachment',
|
|
mixins: [ContextMenuMixin],
|
|
components: { ContextMenu },
|
|
props: {
|
|
attachment: {
|
|
type: Object,
|
|
required: true
|
|
},
|
|
stepId: {
|
|
type: Number,
|
|
required: true
|
|
}
|
|
}
|
|
}
|
|
</script>
|