fix: add default value for auto refresh interval #116

This commit is contained in:
Lykin 2024-01-12 14:49:01 +08:00
parent 4bf35e736e
commit a3f9c62f4e
1 changed files with 6 additions and 17 deletions

View File

@ -11,7 +11,7 @@ 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, onUnmounted, reactive, watch } from 'vue'
import { padStart } from 'lodash' import { isNumber, padStart } from 'lodash'
import { NIcon, useThemeVars } from 'naive-ui' import { NIcon, useThemeVars } from 'naive-ui'
import { timeout } from '@/utils/promise.js' import { timeout } from '@/utils/promise.js'
@ -74,10 +74,10 @@ const startAutoRefresh = async () => {
return return
} }
autoRefresh.on = true autoRefresh.on = true
if (!isNaN(autoRefresh.interval)) { if (!isNumber(autoRefresh.interval)) {
autoRefresh.interval = 2 autoRefresh.interval = 2
} }
autoRefresh.interval = Math.min(autoRefresh.interval, 1) autoRefresh.interval = Math.max(autoRefresh.interval, 1)
let lastExec = Date.now() let lastExec = Date.now()
do { do {
if (!autoRefresh.on) { if (!autoRefresh.on) {
@ -147,11 +147,10 @@ const onTTL = () => {
<template #trigger> <template #trigger>
<icon-button :loading="props.loading" size="18" @click="emit('reload')"> <icon-button :loading="props.loading" size="18" @click="emit('reload')">
<n-icon :size="props.size"> <n-icon :size="props.size">
<component <refresh
:is="Refresh" :class="{ 'auto-rotate': autoRefresh.on }"
:class="{ 'auto-refreshing': autoRefresh.on }"
:color="autoRefresh.on ? themeVars.primaryColor : undefined" :color="autoRefresh.on ? themeVars.primaryColor : undefined"
:stroke-width="autoRefresh.on ? 5 : 3" /> :stroke-width="autoRefresh.on ? 6 : 3" />
</n-icon> </n-icon>
</icon-button> </icon-button>
</template> </template>
@ -226,14 +225,4 @@ const onTTL = () => {
align-items: center; align-items: center;
gap: 5px; gap: 5px;
} }
.auto-refreshing {
animation: rotate 2s linear infinite;
}
@keyframes rotate {
100% {
transform: rotate(360deg);
}
}
</style> </style>