ドラッグ中ずっとAPIを更新し続けるのを修正

This commit is contained in:
kakkokari-gtyih 2024-10-08 10:05:28 +09:00
parent 771bf9a0f6
commit dfdf714cf9
1 changed files with 19 additions and 0 deletions

View File

@ -123,7 +123,10 @@ import MkEmoji from '@/components/global/MkEmoji.vue';
import MkFolder from '@/components/MkFolder.vue'; import MkFolder from '@/components/MkFolder.vue';
const pinnedEmojisForReaction = ref<string[]>(deepClone(defaultStore.state.reactions)); const pinnedEmojisForReaction = ref<string[]>(deepClone(defaultStore.state.reactions));
const isPinnedEmojisForReactionDragging = ref(false);
const pinnedEmojis = ref<string[]>(deepClone(defaultStore.state.pinnedEmojis)); const pinnedEmojis = ref<string[]>(deepClone(defaultStore.state.pinnedEmojis));
const isPinnedEmojisDragging = ref(false);
const emojiPickerScale = computed(defaultStore.makeGetterSetter('emojiPickerScale')); const emojiPickerScale = computed(defaultStore.makeGetterSetter('emojiPickerScale'));
const emojiPickerWidth = computed(defaultStore.makeGetterSetter('emojiPickerWidth')); const emojiPickerWidth = computed(defaultStore.makeGetterSetter('emojiPickerWidth'));
@ -140,6 +143,13 @@ dragAndDrop({
draggable: (el: HTMLElement) => { draggable: (el: HTMLElement) => {
return !el.classList.contains('no-drag'); return !el.classList.contains('no-drag');
}, },
onDragstart: () => {
isPinnedEmojisForReactionDragging.value = true;
},
onDragend: () => {
isPinnedEmojisForReactionDragging.value = false;
defaultStore.set('reactions', pinnedEmojisForReaction.value);
},
}); });
dragAndDrop({ dragAndDrop({
@ -149,6 +159,13 @@ dragAndDrop({
draggable: (el: HTMLElement) => { draggable: (el: HTMLElement) => {
return !el.classList.contains('no-drag'); return !el.classList.contains('no-drag');
}, },
onDragstart: () => {
isPinnedEmojisDragging.value = true;
},
onDragend: () => {
isPinnedEmojisDragging.value = false;
defaultStore.set('pinnedEmojis', pinnedEmojis.value);
},
}); });
const removeReaction = (reaction: string, ev: MouseEvent) => remove(pinnedEmojisForReaction, reaction, ev); const removeReaction = (reaction: string, ev: MouseEvent) => remove(pinnedEmojisForReaction, reaction, ev);
@ -229,12 +246,14 @@ function getHTMLElement(ev: MouseEvent): HTMLElement {
} }
watch(pinnedEmojisForReaction, () => { watch(pinnedEmojisForReaction, () => {
if (isPinnedEmojisForReactionDragging.value) return;
defaultStore.set('reactions', pinnedEmojisForReaction.value); defaultStore.set('reactions', pinnedEmojisForReaction.value);
}, { }, {
deep: true, deep: true,
}); });
watch(pinnedEmojis, () => { watch(pinnedEmojis, () => {
if (isPinnedEmojisDragging.value) return;
defaultStore.set('pinnedEmojis', pinnedEmojis.value); defaultStore.set('pinnedEmojis', pinnedEmojis.value);
}, { }, {
deep: true, deep: true,