feat(admin): 添加临时不可调度功能
当账号触发特定错误码和关键词匹配时，自动临时禁用调度： 后端： - 新增 TempUnschedCache Redis 缓存层 - RateLimitService 支持规则匹配和状态管理 - 添加 GET/DELETE /accounts/:id/temp-unschedulable API - 数据库迁移添加 temp_unschedulable_until/reason 字段 前端： - 账号状态指示器显示临时不可调度状态 - 新增 TempUnschedStatusModal 详情弹窗 - 创建/编辑账号时支持配置规则和预设模板 - 完整的中英文国际化支持
This commit is contained in:
ianshaw
249
frontend/src/components/account/TempUnschedStatusModal.vue
Normal file
249
frontend/src/components/account/TempUnschedStatusModal.vue
Normal file
@@ -0,0 +1,249 @@
|
||||
<template>
|
||||
<BaseDialog
|
||||
:show="show"
|
||||
:title="t('admin.accounts.tempUnschedulable.statusTitle')"
|
||||
width="normal"
|
||||
@close="handleClose"
|
||||
>
|
||||
<div class="space-y-4">
|
||||
<div v-if="loading" class="flex items-center justify-center py-8">
|
||||
<svg class="h-6 w-6 animate-spin text-gray-400" fill="none" viewBox="0 0 24 24">
|
||||
<circle
|
||||
class="opacity-25"
|
||||
cx="12"
|
||||
cy="12"
|
||||
r="10"
|
||||
stroke="currentColor"
|
||||
stroke-width="4"
|
||||
></circle>
|
||||
<path
|
||||
class="opacity-75"
|
||||
fill="currentColor"
|
||||
d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
|
||||
></path>
|
||||
</svg>
|
||||
</div>
|
||||
|
||||
<div v-else-if="!isActive" class="rounded-lg border border-gray-200 p-4 text-sm text-gray-500 dark:border-dark-600 dark:text-gray-400">
|
||||
{{ t('admin.accounts.tempUnschedulable.notActive') }}
|
||||
</div>
|
||||
|
||||
<div v-else class="space-y-4">
|
||||
<div class="rounded-lg border border-gray-200 p-4 dark:border-dark-600">
|
||||
<p class="text-xs text-gray-500 dark:text-gray-400">
|
||||
{{ t('admin.accounts.tempUnschedulable.accountName') }}
|
||||
</p>
|
||||
<p class="mt-1 text-sm font-medium text-gray-900 dark:text-gray-100">
|
||||
{{ account?.name || '-' }}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-1 gap-3 sm:grid-cols-2">
|
||||
<div class="rounded-lg border border-gray-200 p-3 dark:border-dark-600">
|
||||
<p class="text-xs text-gray-500 dark:text-gray-400">
|
||||
{{ t('admin.accounts.tempUnschedulable.triggeredAt') }}
|
||||
</p>
|
||||
<p class="mt-1 text-sm font-medium text-gray-900 dark:text-gray-100">
|
||||
{{ triggeredAtText }}
|
||||
</p>
|
||||
</div>
|
||||
<div class="rounded-lg border border-gray-200 p-3 dark:border-dark-600">
|
||||
<p class="text-xs text-gray-500 dark:text-gray-400">
|
||||
{{ t('admin.accounts.tempUnschedulable.until') }}
|
||||
</p>
|
||||
<p class="mt-1 text-sm font-medium text-gray-900 dark:text-gray-100">
|
||||
{{ untilText }}
|
||||
</p>
|
||||
</div>
|
||||
<div class="rounded-lg border border-gray-200 p-3 dark:border-dark-600">
|
||||
<p class="text-xs text-gray-500 dark:text-gray-400">
|
||||
{{ t('admin.accounts.tempUnschedulable.remaining') }}
|
||||
</p>
|
||||
<p class="mt-1 text-sm font-medium text-gray-900 dark:text-gray-100">
|
||||
{{ remainingText }}
|
||||
</p>
|
||||
</div>
|
||||
<div class="rounded-lg border border-gray-200 p-3 dark:border-dark-600">
|
||||
<p class="text-xs text-gray-500 dark:text-gray-400">
|
||||
{{ t('admin.accounts.tempUnschedulable.errorCode') }}
|
||||
</p>
|
||||
<p class="mt-1 text-sm font-medium text-gray-900 dark:text-gray-100">
|
||||
{{ state?.status_code || '-' }}
|
||||
</p>
|
||||
</div>
|
||||
<div class="rounded-lg border border-gray-200 p-3 dark:border-dark-600">
|
||||
<p class="text-xs text-gray-500 dark:text-gray-400">
|
||||
{{ t('admin.accounts.tempUnschedulable.matchedKeyword') }}
|
||||
</p>
|
||||
<p class="mt-1 text-sm font-medium text-gray-900 dark:text-gray-100">
|
||||
{{ state?.matched_keyword || '-' }}
|
||||
</p>
|
||||
</div>
|
||||
<div class="rounded-lg border border-gray-200 p-3 dark:border-dark-600">
|
||||
<p class="text-xs text-gray-500 dark:text-gray-400">
|
||||
{{ t('admin.accounts.tempUnschedulable.ruleOrder') }}
|
||||
</p>
|
||||
<p class="mt-1 text-sm font-medium text-gray-900 dark:text-gray-100">
|
||||
{{ ruleIndexDisplay }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="rounded-lg border border-gray-200 p-3 dark:border-dark-600">
|
||||
<p class="text-xs text-gray-500 dark:text-gray-400">
|
||||
{{ t('admin.accounts.tempUnschedulable.errorMessage') }}
|
||||
</p>
|
||||
<div class="mt-2 rounded bg-gray-50 p-2 text-xs text-gray-700 dark:bg-dark-700 dark:text-gray-300">
|
||||
{{ state?.error_message || '-' }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<template #footer>
|
||||
<div class="flex justify-end gap-3">
|
||||
<button type="button" class="btn btn-secondary" @click="handleClose">
|
||||
{{ t('common.close') }}
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-primary"
|
||||
:disabled="!isActive || resetting"
|
||||
@click="handleReset"
|
||||
>
|
||||
<svg
|
||||
v-if="resetting"
|
||||
class="-ml-1 mr-2 h-4 w-4 animate-spin"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
<circle
|
||||
class="opacity-25"
|
||||
cx="12"
|
||||
cy="12"
|
||||
r="10"
|
||||
stroke="currentColor"
|
||||
stroke-width="4"
|
||||
></circle>
|
||||
<path
|
||||
class="opacity-75"
|
||||
fill="currentColor"
|
||||
d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
|
||||
></path>
|
||||
</svg>
|
||||
{{ t('admin.accounts.tempUnschedulable.reset') }}
|
||||
</button>
|
||||
</div>
|
||||
</template>
|
||||
</BaseDialog>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { computed, ref, watch } from 'vue'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
import { useAppStore } from '@/stores/app'
|
||||
import { adminAPI } from '@/api/admin'
|
||||
import type { Account, TempUnschedulableStatus } from '@/types'
|
||||
import BaseDialog from '@/components/common/BaseDialog.vue'
|
||||
import { formatDateTime } from '@/utils/format'
|
||||
|
||||
const props = defineProps<{
|
||||
show: boolean
|
||||
account: Account | null
|
||||
}>()
|
||||
|
||||
const emit = defineEmits<{
|
||||
close: []
|
||||
reset: []
|
||||
}>()
|
||||
|
||||
const { t } = useI18n()
|
||||
const appStore = useAppStore()
|
||||
|
||||
const loading = ref(false)
|
||||
const resetting = ref(false)
|
||||
const status = ref<TempUnschedulableStatus | null>(null)
|
||||
|
||||
const state = computed(() => status.value?.state || null)
|
||||
|
||||
const isActive = computed(() => {
|
||||
if (!status.value?.active || !state.value) return false
|
||||
return state.value.until_unix * 1000 > Date.now()
|
||||
})
|
||||
|
||||
const ruleIndexDisplay = computed(() => {
|
||||
if (!state.value) return '-'
|
||||
return state.value.rule_index + 1
|
||||
})
|
||||
|
||||
const triggeredAtText = computed(() => {
|
||||
if (!state.value?.triggered_at_unix) return '-'
|
||||
return formatDateTime(new Date(state.value.triggered_at_unix * 1000))
|
||||
})
|
||||
|
||||
const untilText = computed(() => {
|
||||
if (!state.value?.until_unix) return '-'
|
||||
return formatDateTime(new Date(state.value.until_unix * 1000))
|
||||
})
|
||||
|
||||
const remainingText = computed(() => {
|
||||
if (!state.value) return '-'
|
||||
const remainingMs = state.value.until_unix * 1000 - Date.now()
|
||||
if (remainingMs <= 0) {
|
||||
return t('admin.accounts.tempUnschedulable.expired')
|
||||
}
|
||||
const minutes = Math.ceil(remainingMs / 60000)
|
||||
if (minutes < 60) {
|
||||
return t('admin.accounts.tempUnschedulable.remainingMinutes', { minutes })
|
||||
}
|
||||
const hours = Math.floor(minutes / 60)
|
||||
const rest = minutes % 60
|
||||
if (rest === 0) {
|
||||
return t('admin.accounts.tempUnschedulable.remainingHours', { hours })
|
||||
}
|
||||
return t('admin.accounts.tempUnschedulable.remainingHoursMinutes', { hours, minutes: rest })
|
||||
})
|
||||
|
||||
const loadStatus = async () => {
|
||||
if (!props.account) return
|
||||
loading.value = true
|
||||
try {
|
||||
status.value = await adminAPI.accounts.getTempUnschedulableStatus(props.account.id)
|
||||
} catch (error: any) {
|
||||
appStore.showError(error.response?.data?.detail || t('admin.accounts.tempUnschedulable.failedToLoad'))
|
||||
status.value = null
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
}
|
||||
|
||||
const handleClose = () => {
|
||||
emit('close')
|
||||
}
|
||||
|
||||
const handleReset = async () => {
|
||||
if (!props.account) return
|
||||
resetting.value = true
|
||||
try {
|
||||
await adminAPI.accounts.resetTempUnschedulable(props.account.id)
|
||||
appStore.showSuccess(t('admin.accounts.tempUnschedulable.resetSuccess'))
|
||||
emit('reset')
|
||||
handleClose()
|
||||
} catch (error: any) {
|
||||
appStore.showError(error.response?.data?.detail || t('admin.accounts.tempUnschedulable.resetFailed'))
|
||||
} finally {
|
||||
resetting.value = false
|
||||
}
|
||||
}
|
||||
|
||||
watch(
|
||||
() => [props.show, props.account?.id],
|
||||
([visible]) => {
|
||||
if (visible && props.account) {
|
||||
loadStatus()
|
||||
return
|
||||
}
|
||||
status.value = null
|
||||
}
|
||||
)
|
||||
</script>
|
||||
Reference in New Issue
Block a user