mirror of
https://github.com/scinote-eln/scinote-web.git
synced 2024-09-21 15:36:22 +08:00
Merge pull request #6973 from ivanscinote/SCI-9993-ik
Fix status API request and thumbnail buttons in SciNote Edit [SCI-9993]
This commit is contained in:
commit
a21fc9c95b
|
@ -1,5 +1,8 @@
|
|||
<template>
|
||||
<div class="asset-context-menu" ref="menu">
|
||||
<div class="asset-context-menu"
|
||||
ref="menu"
|
||||
@mouseenter="fetchLocalAppInfo"
|
||||
>
|
||||
<a class="marvinjs-edit-button hidden"
|
||||
v-if="attachment.attributes.asset_type == 'marvinjs' && attachment.attributes.urls.marvin_js_start_edit"
|
||||
ref="marvinjsEditButton"
|
||||
|
|
|
@ -15,11 +15,6 @@ export default {
|
|||
this.attachment.attributes.asset_type !== 'marvinjs'
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.$nextTick(() => {
|
||||
this.fetchLocalAppInfo();
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
async fetchLocalAppInfo() {
|
||||
try {
|
||||
|
|
|
@ -1,8 +1,9 @@
|
|||
<template>
|
||||
<div class="attachment-container asset"
|
||||
:data-asset-id="attachment.id"
|
||||
@mouseover="showOptions = true"
|
||||
@mouseenter="handleMouseEnter"
|
||||
@mouseleave="handleMouseLeave"
|
||||
v-click-outside="handleClickOutsideThumbnail"
|
||||
>
|
||||
<a :class="{ hidden: showOptions }"
|
||||
:href="attachment.attributes.urls.blob"
|
||||
|
@ -44,14 +45,15 @@
|
|||
</div>
|
||||
<div class="absolute bottom-4 w-[184px] grid grid-cols-[repeat(4,_2.5rem)] justify-between">
|
||||
<MenuDropdown
|
||||
v-if="showOptions && multipleOpenOptions.length > 1"
|
||||
@open_locally="openLocally"
|
||||
@open_scinote_editor="openScinoteEditor"
|
||||
v-if="multipleOpenOptions.length > 1"
|
||||
:listItems="multipleOpenOptions"
|
||||
:btnClasses="'btn btn-light icon-btn thumbnail-action-btn'"
|
||||
:position="'left'"
|
||||
:btnIcon="'sn-icon sn-icon-open'"
|
||||
:title="i18n.t('attachments.thumbnail.buttons.open')"
|
||||
@menu-visibility-changed="handleMenuVisibilityChange"
|
||||
@open_locally="openLocally"
|
||||
@open_scinote_editor="openScinoteEditor"
|
||||
></MenuDropdown>
|
||||
<a class="btn btn-light icon-btn thumbnail-action-btn"
|
||||
v-else-if="canOpenLocally"
|
||||
|
@ -167,6 +169,7 @@ import MoveAssetModal from '../modal/move.vue';
|
|||
import NoPredefinedAppModal from '../modal/no_predefined_app_modal.vue';
|
||||
import MoveMixin from './mixins/move.js';
|
||||
import OpenLocallyMixin from './mixins/open_locally.js';
|
||||
import { vOnClickOutside } from '@vueuse/components';
|
||||
|
||||
export default {
|
||||
name: 'thumbnailAttachment',
|
||||
|
@ -196,6 +199,9 @@ export default {
|
|||
showNoPredefinedAppModal: false
|
||||
};
|
||||
},
|
||||
directives: {
|
||||
'click-outside': vOnClickOutside
|
||||
},
|
||||
computed: {
|
||||
multipleOpenOptions() {
|
||||
const options = [];
|
||||
|
@ -258,10 +264,25 @@ export default {
|
|||
this.showOptions = false;
|
||||
}
|
||||
},
|
||||
handleMenuVisibilityChange(newValue) {
|
||||
this.isMenuOpen = newValue;
|
||||
this.showOptions = newValue;
|
||||
}
|
||||
async handleMouseEnter() {
|
||||
await this.fetchLocalAppInfo();
|
||||
this.showOptions = true;
|
||||
},
|
||||
handleMenuVisibilityChange({ isMenuOpen, showOptions }) {
|
||||
if (isMenuOpen !== null) {
|
||||
this.isMenuOpen = isMenuOpen;
|
||||
}
|
||||
if (showOptions !== null) {
|
||||
this.showOptions = showOptions;
|
||||
}
|
||||
},
|
||||
handleClickOutsideThumbnail(event) {
|
||||
const isClickInsideModal = event.target.closest('.modal');
|
||||
if (!isClickInsideModal) {
|
||||
this.showOptions = false;
|
||||
this.isMenuOpen = false;
|
||||
}
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<div class="relative" v-if="listItems.length > 0" v-click-outside="closeMenuAndEmit">
|
||||
<div class="relative" v-if="listItems.length > 0" v-click-outside="closeMenu">
|
||||
<button
|
||||
ref="openBtn"
|
||||
:class="btnClasses"
|
||||
|
@ -93,9 +93,10 @@ export default {
|
|||
},
|
||||
watch: {
|
||||
showMenu(newValue) {
|
||||
if (newValue) {
|
||||
this.$emit('menu-visibility-changed', newValue);
|
||||
}
|
||||
this.$emit('menu-visibility-changed', {
|
||||
isMenuOpen: newValue,
|
||||
showOptions: newValue ? true : null
|
||||
});
|
||||
|
||||
if (this.showMenu) {
|
||||
this.openUp = false;
|
||||
|
@ -116,14 +117,6 @@ export default {
|
|||
closeMenu() {
|
||||
this.showMenu = false;
|
||||
},
|
||||
closeMenuAndEmit(event) {
|
||||
const isClickInsideModal = event.target.closest('.modal');
|
||||
|
||||
if (!isClickInsideModal) {
|
||||
this.showMenu = false;
|
||||
this.$emit('menu-visibility-changed', false);
|
||||
}
|
||||
},
|
||||
handleClick(event, item) {
|
||||
if (!item.url) {
|
||||
event.preventDefault();
|
||||
|
|
Loading…
Reference in a new issue