fix: block copy action when double click refresh button inside #124

This commit is contained in:
Lykin 2024-01-19 11:36:47 +08:00
parent 6aca08de3e
commit a2336b4fc8
1 changed files with 17 additions and 2 deletions

View File

@ -10,7 +10,7 @@ import { useI18n } from 'vue-i18n'
import IconButton from '@/components/common/IconButton.vue' import IconButton from '@/components/common/IconButton.vue'
import Copy from '@/components/icons/Copy.vue' import Copy from '@/components/icons/Copy.vue'
import { ClipboardSetText } from 'wailsjs/runtime/runtime.js' import { ClipboardSetText } from 'wailsjs/runtime/runtime.js'
import { computed, onUnmounted, reactive, watch } from 'vue' import { computed, nextTick, onUnmounted, reactive, ref, watch } from 'vue'
import { NIcon, useThemeVars } from 'naive-ui' import { NIcon, useThemeVars } from 'naive-ui'
import { timeout } from '@/utils/promise.js' import { timeout } from '@/utils/promise.js'
import AutoRefreshForm from '@/components/common/AutoRefreshForm.vue' import AutoRefreshForm from '@/components/common/AutoRefreshForm.vue'
@ -107,7 +107,11 @@ const onToggleRefresh = (on) => {
} }
} }
const blockCopy = ref(false)
const onCopyKey = () => { const onCopyKey = () => {
if (blockCopy.value) {
return
}
ClipboardSetText(props.keyPath) ClipboardSetText(props.keyPath)
.then((succ) => { .then((succ) => {
if (succ) { if (succ) {
@ -119,6 +123,17 @@ const onCopyKey = () => {
}) })
} }
const onReload = () => {
blockCopy.value = true
emit('reload')
nextTick(() => {
setTimeout(() => {
blockCopy.value = false
}, 300)
})
}
const onTTL = () => { const onTTL = () => {
dialogStore.openTTLDialog({ dialogStore.openTTLDialog({
server: props.server, server: props.server,
@ -137,7 +152,7 @@ const onTTL = () => {
<template #suffix> <template #suffix>
<n-popover :delay="500" keep-alive-on-hover placement="bottom" trigger="hover"> <n-popover :delay="500" keep-alive-on-hover placement="bottom" trigger="hover">
<template #trigger> <template #trigger>
<icon-button :loading="props.loading" size="18" @click="emit('reload')"> <icon-button :loading="props.loading" size="18" @click="onReload">
<n-icon :size="props.size"> <n-icon :size="props.size">
<refresh <refresh
:class="{ 'auto-rotate': autoRefresh.on }" :class="{ 'auto-rotate': autoRefresh.on }"