mirror of
https://github.com/scinote-eln/scinote-web.git
synced 2024-11-16 14:17:00 +08:00
110 lines
3.4 KiB
Vue
110 lines
3.4 KiB
Vue
<template>
|
|
<div class="sn-open-locally-menu" @mouseenter="fetchLocalAppInfo">
|
|
<div v-if="!canOpenLocally && (attachment.attributes.wopi && attachment.attributes.urls.edit_asset)">
|
|
<a :href="`${attachment.attributes.urls.edit_asset}`" target="_blank"
|
|
class="block whitespace-nowrap rounded px-3 py-2.5
|
|
hover:!text-sn-blue hover:no-underline cursor-pointer hover:bg-sn-super-light-grey">
|
|
{{ attachment.attributes.wopi_context.button_text }}
|
|
</a>
|
|
</div>
|
|
<div v-else-if="!usesWebIntegration">
|
|
<MenuDropdown
|
|
v-if="this.menu.length > 1"
|
|
class="ml-auto"
|
|
:listItems="this.menu"
|
|
:btnClasses="`btn btn-light icon-btn`"
|
|
:position="'right'"
|
|
:btnText="i18n.t('attachments.open_in')"
|
|
:caret="true"
|
|
@open-locally="openLocally"
|
|
@open-image-editor="openImageEditor"
|
|
></MenuDropdown>
|
|
<a v-else-if="menu.length === 1" class="btn btn-light" :href="menu[0].url" :target="menu[0].target" @click="this[this.menu[0].emit]()">
|
|
{{ menu[0].text }}
|
|
</a>
|
|
</div>
|
|
|
|
<Teleport to="body">
|
|
<NoPredefinedAppModal
|
|
v-if="showNoPredefinedAppModal"
|
|
:fileName="attachment.attributes.file_name"
|
|
@confirm="showNoPredefinedAppModal = false"
|
|
/>
|
|
<editLaunchingApplicationModal
|
|
v-if="editAppModal"
|
|
:fileName="attachment.attributes.file_name"
|
|
:application="this.localAppName"
|
|
@close="editAppModal = false"
|
|
/>
|
|
<UpdateVersionModal
|
|
v-if="showUpdateVersionModal"
|
|
@cancel="showUpdateVersionModal = false"
|
|
/>
|
|
</Teleport>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import OpenLocallyMixin from './mixins/open_locally.js';
|
|
import MenuDropdown from '../../menu_dropdown.vue';
|
|
import UpdateVersionModal from '../modal/update_version_modal.vue';
|
|
|
|
export default {
|
|
name: 'OpenLocallyMenu',
|
|
mixins: [OpenLocallyMixin],
|
|
components: { MenuDropdown, UpdateVersionModal },
|
|
props: {
|
|
attachment: { type: Object, required: true },
|
|
disableLocalOpen: { type: Boolean, default: false }
|
|
},
|
|
created() {
|
|
this.fetchLocalAppInfo();
|
|
window.openLocallyMenu = this;
|
|
},
|
|
beforeUnmount() {
|
|
delete window.openLocallyMenuComponent;
|
|
},
|
|
computed: {
|
|
menu() {
|
|
const menu = [];
|
|
|
|
if (this.attachment.attributes.wopi && this.attachment.attributes.urls.edit_asset) {
|
|
menu.push({
|
|
text: this.attachment.attributes.wopi_context.button_text,
|
|
url: this.attachment.attributes.urls.edit_asset,
|
|
url_target: '_blank'
|
|
});
|
|
}
|
|
|
|
if (this.attachment.attributes.image_editable) {
|
|
menu.push({
|
|
text: this.i18n.t('assets.file_preview.edit_in_scinote'),
|
|
emit: 'openImageEditor'
|
|
});
|
|
}
|
|
|
|
if (this.canOpenLocally && !this.disableLocalOpen) {
|
|
const text = this.localAppName
|
|
? this.i18n.t('attachments.open_locally_in', { application: this.localAppName })
|
|
: this.i18n.t('attachments.open_locally');
|
|
|
|
menu.push({
|
|
text,
|
|
emit: 'openLocally'
|
|
});
|
|
}
|
|
|
|
return menu;
|
|
},
|
|
usesWebIntegration() {
|
|
return this.attachment.attributes.asset_type === 'gene_sequence'
|
|
|| this.attachment.attributes.asset_type === 'marvinjs';
|
|
}
|
|
},
|
|
methods: {
|
|
openImageEditor() {
|
|
document.getElementById('editImageButton').click();
|
|
}
|
|
}
|
|
};
|
|
</script>
|