8c55f9f376
主要更新: - 修复了所有主要的代码逻辑错误 - 实现了完整的任务清理系统 - 添加了系统设置页面的任务清理管理功能 - 修复了API调用认证问题 - 优化了密码加密和验证机制 - 统一了错误处理模式 - 添加了详细的文档和测试工具 新增功能: - 任务清理管理界面 - 任务归档和清理日志 - API监控和诊断工具 - 完整的测试套件 技术改进: - 修复了Repository方法调用错误 - 统一了模型方法调用 - 改进了类型安全性 - 优化了代码结构和可维护性
372 lines
9.1 KiB
Vue
372 lines
9.1 KiB
Vue
<template>
|
||
<div class="cleanup-test-page">
|
||
<div class="page-header">
|
||
<h1>任务清理功能测试</h1>
|
||
<p>测试任务清理系统的各项功能</p>
|
||
</div>
|
||
|
||
<div class="test-sections">
|
||
<!-- 统计信息测试 -->
|
||
<el-card class="test-section">
|
||
<template #header>
|
||
<div class="section-header">
|
||
<h3>统计信息测试</h3>
|
||
<el-button type="primary" @click="testGetStats" :loading="loadingStats">
|
||
获取统计信息
|
||
</el-button>
|
||
</div>
|
||
</template>
|
||
<div class="test-content">
|
||
<div v-if="statsResult" class="result-display">
|
||
<h4>统计结果:</h4>
|
||
<pre>{{ JSON.stringify(statsResult, null, 2) }}</pre>
|
||
</div>
|
||
<div v-if="statsError" class="error-display">
|
||
<h4>错误信息:</h4>
|
||
<p>{{ statsError }}</p>
|
||
</div>
|
||
</div>
|
||
</el-card>
|
||
|
||
<!-- 完整清理测试 -->
|
||
<el-card class="test-section">
|
||
<template #header>
|
||
<div class="section-header">
|
||
<h3>完整清理测试</h3>
|
||
<el-button type="danger" @click="testFullCleanup" :loading="loadingCleanup">
|
||
执行完整清理
|
||
</el-button>
|
||
</div>
|
||
</template>
|
||
<div class="test-content">
|
||
<div class="warning-box">
|
||
<el-alert
|
||
title="警告"
|
||
type="warning"
|
||
:closable="false"
|
||
show-icon
|
||
>
|
||
<template #default>
|
||
<p>此操作将清理所有已完成和失败的任务，请谨慎操作！</p>
|
||
</template>
|
||
</el-alert>
|
||
</div>
|
||
<div v-if="cleanupResult" class="result-display">
|
||
<h4>清理结果:</h4>
|
||
<pre>{{ JSON.stringify(cleanupResult, null, 2) }}</pre>
|
||
</div>
|
||
<div v-if="cleanupError" class="error-display">
|
||
<h4>错误信息:</h4>
|
||
<p>{{ cleanupError }}</p>
|
||
</div>
|
||
</div>
|
||
</el-card>
|
||
|
||
<!-- 用户清理测试 -->
|
||
<el-card class="test-section">
|
||
<template #header>
|
||
<div class="section-header">
|
||
<h3>用户清理测试</h3>
|
||
</div>
|
||
</template>
|
||
<div class="test-content">
|
||
<el-form :model="userCleanupForm" :rules="userCleanupRules" ref="userCleanupFormRef">
|
||
<el-form-item label="用户名" prop="username">
|
||
<el-input
|
||
v-model="userCleanupForm.username"
|
||
placeholder="请输入要清理的用户名"
|
||
clearable
|
||
/>
|
||
</el-form-item>
|
||
<el-form-item>
|
||
<el-button
|
||
type="warning"
|
||
@click="testUserCleanup"
|
||
:loading="loadingUserCleanup"
|
||
>
|
||
清理用户任务
|
||
</el-button>
|
||
</el-form-item>
|
||
</el-form>
|
||
<div v-if="userCleanupResult" class="result-display">
|
||
<h4>用户清理结果:</h4>
|
||
<pre>{{ JSON.stringify(userCleanupResult, null, 2) }}</pre>
|
||
</div>
|
||
<div v-if="userCleanupError" class="error-display">
|
||
<h4>错误信息:</h4>
|
||
<p>{{ userCleanupError }}</p>
|
||
</div>
|
||
</div>
|
||
</el-card>
|
||
|
||
<!-- 队列状态测试 -->
|
||
<el-card class="test-section">
|
||
<template #header>
|
||
<div class="section-header">
|
||
<h3>队列状态测试</h3>
|
||
<el-button type="info" @click="testQueueStatus" :loading="loadingQueue">
|
||
获取队列状态
|
||
</el-button>
|
||
</div>
|
||
</template>
|
||
<div class="test-content">
|
||
<div v-if="queueResult" class="result-display">
|
||
<h4>队列状态:</h4>
|
||
<pre>{{ JSON.stringify(queueResult, null, 2) }}</pre>
|
||
</div>
|
||
<div v-if="queueError" class="error-display">
|
||
<h4>错误信息:</h4>
|
||
<p>{{ queueError }}</p>
|
||
</div>
|
||
</div>
|
||
</el-card>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script setup>
|
||
import { ref, reactive } from 'vue'
|
||
import { ElMessage } from 'element-plus'
|
||
|
||
// 响应式数据
|
||
const loadingStats = ref(false)
|
||
const loadingCleanup = ref(false)
|
||
const loadingUserCleanup = ref(false)
|
||
const loadingQueue = ref(false)
|
||
|
||
const statsResult = ref(null)
|
||
const statsError = ref(null)
|
||
const cleanupResult = ref(null)
|
||
const cleanupError = ref(null)
|
||
const userCleanupResult = ref(null)
|
||
const userCleanupError = ref(null)
|
||
const queueResult = ref(null)
|
||
const queueError = ref(null)
|
||
|
||
const userCleanupFormRef = ref(null)
|
||
const userCleanupForm = reactive({
|
||
username: ''
|
||
})
|
||
|
||
const userCleanupRules = reactive({
|
||
username: [
|
||
{ required: true, message: '请输入用户名', trigger: 'blur' },
|
||
{ min: 2, max: 50, message: '用户名长度在2到50个字符', trigger: 'blur' }
|
||
]
|
||
})
|
||
|
||
// 测试方法
|
||
const getAuthHeaders = () => {
|
||
const token = sessionStorage.getItem('token')
|
||
return token ? { 'Authorization': `Bearer ${token}` } : {}
|
||
}
|
||
|
||
const testGetStats = async () => {
|
||
loadingStats.value = true
|
||
statsResult.value = null
|
||
statsError.value = null
|
||
|
||
try {
|
||
const response = await fetch('/api/cleanup/cleanup-stats', {
|
||
headers: {
|
||
'Content-Type': 'application/json',
|
||
...getAuthHeaders()
|
||
}
|
||
})
|
||
if (response.ok) {
|
||
statsResult.value = await response.json()
|
||
ElMessage.success('获取统计信息成功')
|
||
} else {
|
||
statsError.value = `HTTP ${response.status}: ${response.statusText}`
|
||
}
|
||
} catch (error) {
|
||
statsError.value = error.message
|
||
ElMessage.error('获取统计信息失败')
|
||
} finally {
|
||
loadingStats.value = false
|
||
}
|
||
}
|
||
|
||
const testFullCleanup = async () => {
|
||
loadingCleanup.value = true
|
||
cleanupResult.value = null
|
||
cleanupError.value = null
|
||
|
||
try {
|
||
const response = await fetch('/api/cleanup/full-cleanup', {
|
||
method: 'POST',
|
||
headers: {
|
||
'Content-Type': 'application/json',
|
||
...getAuthHeaders()
|
||
}
|
||
})
|
||
|
||
if (response.ok) {
|
||
cleanupResult.value = await response.json()
|
||
ElMessage.success('完整清理执行成功')
|
||
} else {
|
||
cleanupError.value = `HTTP ${response.status}: ${response.statusText}`
|
||
}
|
||
} catch (error) {
|
||
cleanupError.value = error.message
|
||
ElMessage.error('执行完整清理失败')
|
||
} finally {
|
||
loadingCleanup.value = false
|
||
}
|
||
}
|
||
|
||
const testUserCleanup = async () => {
|
||
const valid = await userCleanupFormRef.value.validate()
|
||
if (!valid) return
|
||
|
||
loadingUserCleanup.value = true
|
||
userCleanupResult.value = null
|
||
userCleanupError.value = null
|
||
|
||
try {
|
||
const response = await fetch(`/api/cleanup/user-tasks/${userCleanupForm.username}`, {
|
||
method: 'POST',
|
||
headers: {
|
||
'Content-Type': 'application/json',
|
||
...getAuthHeaders()
|
||
}
|
||
})
|
||
|
||
if (response.ok) {
|
||
userCleanupResult.value = await response.json()
|
||
ElMessage.success(`用户 ${userCleanupForm.username} 的任务清理完成`)
|
||
} else {
|
||
userCleanupError.value = `HTTP ${response.status}: ${response.statusText}`
|
||
}
|
||
} catch (error) {
|
||
userCleanupError.value = error.message
|
||
ElMessage.error('清理用户任务失败')
|
||
} finally {
|
||
loadingUserCleanup.value = false
|
||
}
|
||
}
|
||
|
||
const testQueueStatus = async () => {
|
||
loadingQueue.value = true
|
||
queueResult.value = null
|
||
queueError.value = null
|
||
|
||
try {
|
||
const response = await fetch('/api/diagnostic/queue-status')
|
||
if (response.ok) {
|
||
queueResult.value = await response.json()
|
||
ElMessage.success('获取队列状态成功')
|
||
} else {
|
||
queueError.value = `HTTP ${response.status}: ${response.statusText}`
|
||
}
|
||
} catch (error) {
|
||
queueError.value = error.message
|
||
ElMessage.error('获取队列状态失败')
|
||
} finally {
|
||
loadingQueue.value = false
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style scoped>
|
||
.cleanup-test-page {
|
||
padding: 20px;
|
||
max-width: 1200px;
|
||
margin: 0 auto;
|
||
}
|
||
|
||
.page-header {
|
||
text-align: center;
|
||
margin-bottom: 30px;
|
||
}
|
||
|
||
.page-header h1 {
|
||
color: #1e293b;
|
||
margin-bottom: 10px;
|
||
}
|
||
|
||
.page-header p {
|
||
color: #64748b;
|
||
font-size: 16px;
|
||
}
|
||
|
||
.test-sections {
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 20px;
|
||
}
|
||
|
||
.test-section {
|
||
border-radius: 12px;
|
||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
|
||
}
|
||
|
||
.section-header {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
}
|
||
|
||
.section-header h3 {
|
||
margin: 0;
|
||
color: #1e293b;
|
||
}
|
||
|
||
.test-content {
|
||
padding: 20px 0;
|
||
}
|
||
|
||
.warning-box {
|
||
margin-bottom: 20px;
|
||
}
|
||
|
||
.result-display,
|
||
.error-display {
|
||
margin-top: 20px;
|
||
padding: 16px;
|
||
border-radius: 8px;
|
||
}
|
||
|
||
.result-display {
|
||
background: #f0f9ff;
|
||
border: 1px solid #0ea5e9;
|
||
}
|
||
|
||
.error-display {
|
||
background: #fef2f2;
|
||
border: 1px solid #ef4444;
|
||
}
|
||
|
||
.result-display h4,
|
||
.error-display h4 {
|
||
margin: 0 0 12px 0;
|
||
color: #1e293b;
|
||
}
|
||
|
||
.result-display pre {
|
||
margin: 0;
|
||
font-size: 12px;
|
||
color: #1e293b;
|
||
white-space: pre-wrap;
|
||
word-break: break-all;
|
||
}
|
||
|
||
.error-display p {
|
||
margin: 0;
|
||
color: #dc2626;
|
||
font-weight: 500;
|
||
}
|
||
|
||
@media (max-width: 768px) {
|
||
.cleanup-test-page {
|
||
padding: 10px;
|
||
}
|
||
|
||
.section-header {
|
||
flex-direction: column;
|
||
gap: 10px;
|
||
align-items: flex-start;
|
||
}
|
||
}
|
||
</style>
|