数据导出

frontend/components/common/settings/info-tab.tsx

@@ -1,9 +1,14 @@
 "use client"
 
-import {Info, Server} from "lucide-react"
+import {useState} from "react"
+import {Database, Download, Info, Loader2, Server} from "lucide-react"
 import packageJson from "../../../package.json"
-import {apiConfig} from "@/lib/services"
+import {AdminService, apiConfig} from "@/lib/services"
 import {Card, CardContent, CardDescription, CardHeader, CardTitle} from "@/components/ui/card"
+import {Button} from "@/components/ui/button"
+import {Badge} from "@/components/ui/badge"
+import {useQuery} from "@tanstack/react-query"
+import {toast} from "sonner"
 
 function InfoRow({ label, value }: { label: string; value: React.ReactNode }) {
   return (
@@ -20,6 +25,37 @@ interface InfoTabProps {
 }
 
 export function InfoTab({ systemConfigsLength, authSourcesLength }: InfoTabProps) {
+  const [exporting, setExporting] = useState(false)
+
+  const dbInfoQuery = useQuery({
+    queryKey: ["admin", "db-info"],
+    queryFn: () => AdminService.getDatabaseInfo(),
+  })
+
+  const dbInfo = dbInfoQuery.data
+
+  const handleExport = async () => {
+    setExporting(true)
+    try {
+      const { blob, filename } = await AdminService.exportDatabase()
+      const url = URL.createObjectURL(blob)
+      const a = document.createElement("a")
+      a.href = url
+      a.download = filename
+      document.body.appendChild(a)
+      a.click()
+      a.remove()
+      URL.revokeObjectURL(url)
+      toast.success("数据库导出成功", { description: `文件已下载：${filename}` })
+    } catch (err) {
+      toast.error("数据库导出失败", {
+        description: err instanceof Error ? err.message : "请求时发生未知错误",
+      })
+    } finally {
+      setExporting(false)
+    }
+  }
+
   return (
     <div className="grid grid-cols-1 gap-4 lg:grid-cols-2">
       <Card className="border border-dashed shadow-sm">
@@ -63,6 +99,69 @@ export function InfoTab({ systemConfigsLength, authSourcesLength }: InfoTabProps
           <InfoRow label="认证源数量" value={`${authSourcesLength} 个`} />
         </CardContent>
       </Card>
+
+      {/* 数据库信息卡片 */}
+      <Card className="border border-dashed shadow-sm lg:col-span-2">
+        <CardHeader className="border-b border-dashed pb-4">
+          <div className="flex items-center justify-between">
+            <div className="flex items-center gap-2">
+              <div className="p-1.5 rounded-lg bg-muted text-muted-foreground">
+                <Database className="size-4" />
+              </div>
+              <div>
+                <CardTitle className="text-base font-semibold">数据库信息</CardTitle>
+                <CardDescription className="text-xs">当前使用的数据库类型及连接信息</CardDescription>
+              </div>
+            </div>
+            <Button
+              id="db-export-btn"
+              size="sm"
+              variant="outline"
+              className="h-8 text-xs gap-1.5"
+              onClick={handleExport}
+              disabled={exporting || dbInfoQuery.isLoading}
+            >
+              {exporting ? (
+                <Loader2 className="size-3 animate-spin" />
+              ) : (
+                <Download className="size-3" />
+              )}
+              {exporting ? "导出中..." : "数据导出"}
+            </Button>
+          </div>
+        </CardHeader>
+        <CardContent className="pt-4">
+          {dbInfoQuery.isLoading ? (
+            <div className="flex items-center gap-2 py-2 text-xs text-muted-foreground">
+              <Loader2 className="size-3 animate-spin" />
+              加载数据库信息中...
+            </div>
+          ) : dbInfoQuery.isError ? (
+            <p className="text-xs text-destructive py-2">获取数据库信息失败</p>
+          ) : (
+            <>
+              <div className="flex items-center justify-between gap-4 border-b border-dashed py-2">
+                <span className="text-xs text-muted-foreground">数据库类型</span>
+                <Badge
+                  variant="secondary"
+                  className={
+                    dbInfo?.type === "postgres"
+                      ? "bg-blue-500/10 text-blue-600 dark:bg-blue-500/20 dark:text-blue-400 border-none text-[11px]"
+                      : "bg-amber-500/10 text-amber-600 dark:bg-amber-500/20 dark:text-amber-400 border-none text-[11px]"
+                  }
+                >
+                  {dbInfo?.type === "postgres" ? "PostgreSQL" : "SQLite"}
+                </Badge>
+              </div>
+              <InfoRow
+                label={dbInfo?.type === "postgres" ? "数据库名称" : "数据库文件"}
+                value={dbInfo?.name}
+              />
+              <InfoRow label="版本信息" value={dbInfo?.version} />
+            </>
+          )}
+        </CardContent>
+      </Card>
     </div>
   )
 }

frontend/lib/services/admin/admin.service.ts

@@ -6,6 +6,7 @@ import type {
   CreateSystemConfigRequest,
   CreateTemplateRequest,
   CreateUserRequest,
+  DatabaseInfo,
   DispatchTaskRequest,
   ListTaskExecutionsRequest,
   ListTaskExecutionsResponse,
@@ -330,6 +331,40 @@ export class AdminService extends BaseService {
     return this.get<SystemStatus>('/status');
   }
 
+  /**
+   * 获取数据库信息
+   * @returns 数据库类型、名称、版本信息
+   * @throws {UnauthorizedError} 当未登录时
+   * @throws {ForbiddenError} 当无管理员权限时
+   */
+  static async getDatabaseInfo(): Promise<DatabaseInfo> {
+    return this.get<DatabaseInfo>('/db-info');
+  }
+
+  /**
+   * 导出数据库
+   * SQLite 返回 .db 二进制，PostgreSQL 返回 pg_dump .sql 文本
+   * @returns 包含文件 Blob 和建议文件名的对象
+   * @throws {UnauthorizedError} 当未登录时
+   * @throws {ForbiddenError} 当无管理员权限时
+   */
+  static async exportDatabase(): Promise<{ blob: Blob; filename: string }> {
+    const response = await import('axios').then(({ default: axios }) =>
+      axios.get<Blob>(this.getFullPath('/db-export'), {
+        withCredentials: true,
+        responseType: 'blob',
+      })
+    );
+    // 从 Content-Disposition 提取文件名
+    const disposition = response.headers['content-disposition'] as string | undefined;
+    let filename = 'wavelet_export';
+    if (disposition) {
+      const match = disposition.match(/filename="?([^";]+)"?/);
+      if (match) filename = match[1];
+    }
+    return { blob: response.data, filename };
+  }
+
   // ==================== 系统日志 ====================
 
   /**

frontend/lib/services/admin/index.ts

@@ -39,4 +39,5 @@ export type {
   ListUsersResponse,
   UpdateUserStatusRequest,
   SystemStatus,
+  DatabaseInfo,
 } from './types';

frontend/lib/services/admin/types.ts

@@ -381,3 +381,15 @@ export interface UpdateTemplateRequest {
   content: string;
   description: string;
 }
+
+/**
+ * 数据库信息
+ */
+export interface DatabaseInfo {
+  /** 数据库类型：'sqlite' | 'postgres' */
+  type: 'sqlite' | 'postgres';
+  /** 数据库名称或文件路径 */
+  name: string;
+  /** 数据库版本字符串 */
+  version: string;
+}

frontend/lib/services/index.ts

@@ -106,6 +106,7 @@ export type {
   ListUsersResponse,
   UpdateUserStatusRequest,
   SystemStatus,
+  DatabaseInfo,
 } from './admin';
 
 // 用户服务