Răsfoiți Sursa

actor(logref 合并定时):任务和队列任务日志页面

- 移除 CronJobLog 和 QueueJobLog 的独立路由配置
- 创建统一的 JobLog 页面组件用于管理两种日志类型
- 添加标签页切换功能支持定时任务和队列任务日志查看
- 简化路由结构将两个日志页面合并为单一入口
- 移除原来页面中的注释代码保持代码简洁
- 更新导航菜单链接指向新的统一日志页面
runphp 11 ore în urmă
părinte
comite
6ea3888a1b

+ 6 - 20
frontend/admin/index.js

@@ -19,23 +19,14 @@ export default {
                 }
             },
             {
-                path: 'cron-job-log',
-                name: 'CronJobLog',
-                component: () => import('./views/CronJobLog.vue'),
+                path: 'job-log',
+                name: 'JobLog',
+                component: () => import('./views/JobLog.vue'),
                 meta: {
-                    title: '定时任务日志',
+                    title: '任务日志',
                     icon: 'Timer'
                 }
             },
-            {
-                path: 'queue-job-log',
-                name: 'QueueJobLog',
-                component: () => import('./views/QueueJobLog.vue'),
-                meta: {
-                    title: '队列任务日志',
-                    icon: 'List'
-                }
-            },
             {
                 path: 'plugin-config',
                 name: 'PluginConfig',
@@ -62,14 +53,9 @@ export default {
                     icon: 'Tools'
                 },
                 {
-                    path: '/system/cron-job-log',
-                    title: '定时任务日志',
+                    path: '/system/job-log',
+                    title: '任务日志',
                     icon: 'Timer'
-                },
-                {
-                    path: '/system/queue-job-log',
-                    title: '队列任务日志',
-                    icon: 'List'
                 }
             ]
         }

+ 0 - 20
frontend/admin/views/CronJobLog.vue

@@ -191,7 +191,6 @@ const stats = reactive({
   success_rate: 0
 })
 
-// 获取列表
 const getList = async () => {
   loading.value = true
   try {
@@ -211,7 +210,6 @@ const getList = async () => {
     if (res.code === 200) {
       tableData.value = res.page?.data || []
       pagination.total = res.page?.total || 0
-      // 统计数据
       const s = res.data || {}
       stats.total = s.total || 0
       stats.success_count = s.success_count || 0
@@ -225,13 +223,11 @@ const getList = async () => {
   }
 }
 
-// 搜索
 const handleSearch = () => {
   pagination.page = 1
   getList()
 }
 
-// 重置
 const handleReset = () => {
   searchForm.name = ''
   searchForm.success = null
@@ -240,7 +236,6 @@ const handleReset = () => {
   getList()
 }
 
-// 分页
 const handlePageChange = () => {
   getList()
 }
@@ -250,12 +245,10 @@ const handleSizeChange = () => {
   getList()
 }
 
-// 选择变化
 const handleSelectionChange = (selection) => {
   selectedIds.value = selection.map(item => item.id)
 }
 
-// 删除单条
 const handleDelete = (row) => {
   ElMessageBox.confirm(
     `确定要删除任务「${row.name}」的这条执行日志吗?`,
@@ -278,7 +271,6 @@ const handleDelete = (row) => {
   }).catch(() => {})
 }
 
-// 批量删除
 const handleBatchDelete = () => {
   if (selectedIds.value.length === 0) return
   ElMessageBox.confirm(
@@ -303,7 +295,6 @@ const handleBatchDelete = () => {
   }).catch(() => {})
 }
 
-// 清空所有
 const handleClearAll = () => {
   ElMessageBox.confirm(
     '确定要清空所有定时任务执行日志吗?此操作不可恢复!',
@@ -338,17 +329,6 @@ onMounted(() => {
   padding: 0;
 }
 
-.page-header {
-  margin-bottom: 16px;
-
-  h2 {
-    margin: 0;
-    font-size: 20px;
-    font-weight: 600;
-    color: #303133;
-  }
-}
-
 .stats-row {
   margin-bottom: 16px;
 

+ 47 - 0
frontend/admin/views/JobLog.vue

@@ -0,0 +1,47 @@
+<template>
+  <div class="job-log-container">
+    <el-tabs v-model="activeTab" @tab-change="handleTabChange">
+      <el-tab-pane label="定时任务日志" name="cron">
+        <template #label>
+          <el-icon><Timer /></el-icon>
+          <span style="margin-left: 4px">定时任务日志</span>
+        </template>
+        <CronJobLog v-if="activeTab === 'cron'" />
+      </el-tab-pane>
+      <el-tab-pane label="队列任务日志" name="queue">
+        <template #label>
+          <el-icon><List /></el-icon>
+          <span style="margin-left: 4px">队列任务日志</span>
+        </template>
+        <QueueJobLog v-if="activeTab === 'queue'" />
+      </el-tab-pane>
+    </el-tabs>
+  </div>
+</template>
+
+<script setup>
+import { ref } from 'vue'
+import { Timer, List } from '@element-plus/icons-vue'
+import CronJobLog from './CronJobLog.vue'
+import QueueJobLog from './QueueJobLog.vue'
+
+const activeTab = ref('cron')
+
+const handleTabChange = (tab) => {
+  // Tab changed - components will mount/unmount due to v-if
+}
+</script>
+
+<style scoped lang="scss">
+.job-log-container {
+  padding: 0;
+
+  :deep(.el-tabs__header) {
+    margin-bottom: 16px;
+  }
+
+  :deep(.el-tabs__item) {
+    font-size: 14px;
+  }
+}
+</style>

+ 0 - 9
frontend/admin/views/QueueJobLog.vue

@@ -199,7 +199,6 @@ const stats = reactive({
   success_rate: 0
 })
 
-// 获取列表
 const getList = async () => {
   loading.value = true
   try {
@@ -219,7 +218,6 @@ const getList = async () => {
     if (res.code === 200) {
       tableData.value = res.page?.data || []
       pagination.total = res.page?.total || 0
-      // 统计数据
       const s = res.data || {}
       stats.total = s.total || 0
       stats.success_count = s.success_count || 0
@@ -233,13 +231,11 @@ const getList = async () => {
   }
 }
 
-// 搜索
 const handleSearch = () => {
   pagination.page = 1
   getList()
 }
 
-// 重置
 const handleReset = () => {
   searchForm.name = ''
   searchForm.success = null
@@ -248,7 +244,6 @@ const handleReset = () => {
   getList()
 }
 
-// 分页
 const handlePageChange = () => {
   getList()
 }
@@ -258,12 +253,10 @@ const handleSizeChange = () => {
   getList()
 }
 
-// 选择变化
 const handleSelectionChange = (selection) => {
   selectedIds.value = selection.map(item => item.id)
 }
 
-// 删除单条
 const handleDelete = (row) => {
   ElMessageBox.confirm(
     `确定要删除任务「${row.name}」的这条执行日志吗?`,
@@ -286,7 +279,6 @@ const handleDelete = (row) => {
   }).catch(() => {})
 }
 
-// 批量删除
 const handleBatchDelete = () => {
   if (selectedIds.value.length === 0) return
   ElMessageBox.confirm(
@@ -311,7 +303,6 @@ const handleBatchDelete = () => {
   }).catch(() => {})
 }
 
-// 清空所有
 const handleClearAll = () => {
   ElMessageBox.confirm(
     '确定要清空所有队列任务执行日志吗?此操作不可恢复!',