diff --git a/HISTORY.md b/HISTORY.md index e1b633e..3181900 100644 --- a/HISTORY.md +++ b/HISTORY.md @@ -1,2 +1,3 @@ 2025.05.13 0.1.0 -首页添加了迁移管理入口按钮, 无需登录即可访问 \ No newline at end of file +首页添加了迁移管理入口按钮, 无需登录即可访问 +打开迁移管理页面时,将迁移历史读取出来 \ No newline at end of file diff --git a/client/migrations/migrations_app.tsx b/client/migrations/migrations_app.tsx index 5afc548..8a98f46 100644 --- a/client/migrations/migrations_app.tsx +++ b/client/migrations/migrations_app.tsx @@ -1,10 +1,12 @@ import React, { useState } from 'react'; import { createRoot } from 'react-dom/client'; -import { Button, Space, Alert, Spin, Typography } from 'antd'; +import { Button, Space, Alert, Spin, Typography, Table } from 'antd'; import axios from 'axios'; +import dayjs from 'dayjs'; import { QueryClient, QueryClientProvider, + useQuery, } from '@tanstack/react-query'; const { Title } = Typography; @@ -18,10 +20,26 @@ interface MigrationResponse { failedResult?: any; } +interface MigrationHistory { + id: string; + name: string; + status: string; + timestamp: string; + batch: string; +} + const MigrationsApp: React.FC = () => { const [loading, setLoading] = useState(false); const [migrationResult, setMigrationResult] = useState(null); + const { data: historyData, isLoading: isHistoryLoading, error: historyError } = useQuery({ + queryKey: ['migrations-history'], + queryFn: async () => { + const response = await axios.get('/api/migrations/history'); + return response.data.history; + } + }); + const runMigrations = async () => { try { setLoading(true); @@ -40,13 +58,43 @@ const MigrationsApp: React.FC = () => { } }; + const columns = [ + { + title: '迁移名称', + dataIndex: 'name', + key: 'name', + sorter: (a: MigrationHistory, b: MigrationHistory) => a.name.localeCompare(b.name), + }, + { + title: '批次', + dataIndex: 'batch', + key: 'batch', + }, + { + title: '状态', + dataIndex: 'status', + key: 'status', + render: (status: string) => ( + + {status === 'completed' ? '已完成' : '失败'} + + ) + }, + { + title: '时间', + dataIndex: 'timestamp', + key: 'timestamp', + render: (timestamp: string) => dayjs(timestamp).format('YYYY-MM-DD HH:mm:ss') + }, + ]; + return (
数据库迁移管理 -