mirror of
https://github.com/Rain-kl/OpenFlare.git
synced 2026-10-12 10:16:37 +08:00
refactor(repo): consolidate openflare-server to root and move subprojects to internal/apps
- Merge all files inside openflare-server to the repository root directory. - Relocate agent, relay, and flared subprojects from internal/ to internal/apps/. - Combine docker-compose files and update build context paths to root. - Update GitHub workflows and Dockerfiles to refer to new directories and package names. - Rewrite Go package imports across all files. - Resolve database renew test race condition and clean up docs.
This commit is contained in:
ryan
@@ -0,0 +1,772 @@
|
||||
"use client"
|
||||
|
||||
import Link from "next/link"
|
||||
import {useEffect, useMemo, useState} from "react"
|
||||
import {useMutation, useQuery, useQueryClient} from "@tanstack/react-query"
|
||||
import {Copy, ExternalLink, Loader2, RefreshCw, RotateCw, Save, Server, Trash2,} from "lucide-react"
|
||||
import {toast} from "sonner"
|
||||
|
||||
import {
|
||||
AlertDialog,
|
||||
AlertDialogAction,
|
||||
AlertDialogCancel,
|
||||
AlertDialogContent,
|
||||
AlertDialogDescription,
|
||||
AlertDialogFooter,
|
||||
AlertDialogHeader,
|
||||
AlertDialogTitle,
|
||||
} from "@/components/ui/alert-dialog"
|
||||
import {Badge} from "@/components/ui/badge"
|
||||
import {Button} from "@/components/ui/button"
|
||||
import {Card, CardContent, CardDescription, CardHeader, CardTitle} from "@/components/ui/card"
|
||||
import {Input} from "@/components/ui/input"
|
||||
import {Label} from "@/components/ui/label"
|
||||
import {Select, SelectContent, SelectItem, SelectTrigger, SelectValue,} from "@/components/ui/select"
|
||||
import {Switch} from "@/components/ui/switch"
|
||||
import {Textarea} from "@/components/ui/textarea"
|
||||
import {ErrorInline} from "@/components/layout/error"
|
||||
import {LoadingStateWithBorder} from "@/components/layout/loading"
|
||||
import type {DatabaseCleanupTarget} from "@/lib/services/openflare"
|
||||
import {AdminStatusService} from "@/lib/services/admin"
|
||||
import {NodeService, OptionService, StatusService, UptimeKumaService,} from "@/lib/services/openflare"
|
||||
import {VersionUpgradeDialog} from "@/app/(main)/components/version-upgrade-dialog"
|
||||
import {adminUpdateStatusQueryKey, openflarePublicStatusQueryKey,} from "@/lib/hooks/use-openflare-server-upgrade"
|
||||
|
||||
import {
|
||||
agentOptionEntries,
|
||||
buildDiscoveryCommand,
|
||||
databaseAutoCleanupEntries,
|
||||
defaultOpenFlareOpsFields,
|
||||
formatDurationLabel,
|
||||
getBrowserOrigin,
|
||||
mapOptionsToOpsFields,
|
||||
type OpenFlareOpsFields,
|
||||
optionsToMap,
|
||||
uptimeKumaOptionEntries,
|
||||
} from "./openflare-ops-utils"
|
||||
import {UptimeKumaSiteSelectModal} from "./uptimekuma-site-modal"
|
||||
|
||||
const optionsQueryKey = ["openflare", "options"] as const
|
||||
|
||||
const cleanupTargets: Array<{
|
||||
target: DatabaseCleanupTarget
|
||||
label: string
|
||||
description: string
|
||||
}> = [
|
||||
{
|
||||
target: "node_access_logs",
|
||||
label: "访问日志",
|
||||
description: "清理 node_access_logs，影响访问明细与 IP 汇总。",
|
||||
},
|
||||
{
|
||||
target: "node_metric_snapshots",
|
||||
label: "性能快照",
|
||||
description: "清理 node_metric_snapshots，影响节点资源趋势。",
|
||||
},
|
||||
{
|
||||
target: "node_request_reports",
|
||||
label: "请求聚合",
|
||||
description: "清理 node_request_reports，影响请求量与错误量统计。",
|
||||
},
|
||||
]
|
||||
|
||||
async function copyText(value: string) {
|
||||
await navigator.clipboard.writeText(value)
|
||||
}
|
||||
|
||||
export function OpenFlareOpsSettings() {
|
||||
const queryClient = useQueryClient()
|
||||
const [fields, setFields] = useState<OpenFlareOpsFields>(defaultOpenFlareOpsFields)
|
||||
const [savingSection, setSavingSection] = useState<string | null>(null)
|
||||
const [geoIPTestIP, setGeoIPTestIP] = useState("8.8.8.8")
|
||||
const [uptimeKumaModalOpen, setUptimeKumaModalOpen] = useState(false)
|
||||
const [cleanupTarget, setCleanupTarget] = useState<{
|
||||
target: DatabaseCleanupTarget
|
||||
label: string
|
||||
} | null>(null)
|
||||
const [cleanupRetentionDays, setCleanupRetentionDays] = useState("")
|
||||
const [versionDialogOpen, setVersionDialogOpen] = useState(false)
|
||||
|
||||
const optionsQuery = useQuery({
|
||||
queryKey: optionsQueryKey,
|
||||
queryFn: () => OptionService.list(),
|
||||
})
|
||||
|
||||
const statusQuery = useQuery({
|
||||
queryKey: openflarePublicStatusQueryKey,
|
||||
queryFn: () => StatusService.getPublicStatus(),
|
||||
})
|
||||
|
||||
const bootstrapQuery = useQuery({
|
||||
queryKey: ["openflare", "bootstrap-token"],
|
||||
queryFn: () => NodeService.getBootstrapToken(),
|
||||
})
|
||||
|
||||
const releaseQuery = useQuery({
|
||||
queryKey: adminUpdateStatusQueryKey,
|
||||
queryFn: () => AdminStatusService.getUpdateStatus(),
|
||||
})
|
||||
|
||||
useEffect(() => {
|
||||
if (!optionsQuery.data) return
|
||||
const optionMap = optionsToMap(optionsQuery.data)
|
||||
const serverAddress =
|
||||
optionMap.ServerAddress ||
|
||||
statusQuery.data?.server_address ||
|
||||
getBrowserOrigin()
|
||||
setFields(mapOptionsToOpsFields(optionMap, serverAddress))
|
||||
}, [optionsQuery.data, statusQuery.data?.server_address])
|
||||
|
||||
const geoIPMutation = useMutation({
|
||||
mutationFn: () => OptionService.lookupGeoIP(fields.GeoIPProvider, geoIPTestIP.trim()),
|
||||
})
|
||||
|
||||
const saveMutation = useMutation({
|
||||
mutationFn: async ({
|
||||
section,
|
||||
entries,
|
||||
}: {
|
||||
section: string
|
||||
entries: Array<{ key: string; value: string }>
|
||||
}) => {
|
||||
setSavingSection(section)
|
||||
await OptionService.updateBatch(entries)
|
||||
},
|
||||
onSuccess: async () => {
|
||||
toast.success("OpenFlare 运维设置已保存")
|
||||
await queryClient.invalidateQueries({ queryKey: optionsQueryKey })
|
||||
setSavingSection(null)
|
||||
},
|
||||
onError: (error) => {
|
||||
setSavingSection(null)
|
||||
toast.error(error instanceof Error ? error.message : "保存失败")
|
||||
},
|
||||
})
|
||||
|
||||
const rotateTokenMutation = useMutation({
|
||||
mutationFn: () => NodeService.rotateBootstrapToken(),
|
||||
onSuccess: async (data) => {
|
||||
toast.success("Discovery Token 已重新生成")
|
||||
await queryClient.invalidateQueries({ queryKey: ["openflare", "bootstrap-token"] })
|
||||
if (data.discovery_token) {
|
||||
try {
|
||||
await copyText(data.discovery_token)
|
||||
} catch {
|
||||
// ignore clipboard errors
|
||||
}
|
||||
}
|
||||
},
|
||||
onError: (error) => {
|
||||
toast.error(error instanceof Error ? error.message : "Token 轮换失败")
|
||||
},
|
||||
})
|
||||
|
||||
const syncUptimeKumaMutation = useMutation({
|
||||
mutationFn: () => UptimeKumaService.sync(),
|
||||
onSuccess: () => toast.success("Uptime Kuma 同步任务已执行"),
|
||||
onError: (error) => toast.error(error instanceof Error ? error.message : "同步失败"),
|
||||
})
|
||||
|
||||
const cleanupMutation = useMutation({
|
||||
mutationFn: (payload: { target: DatabaseCleanupTarget; retention_days?: number }) =>
|
||||
OptionService.cleanupDatabase(payload),
|
||||
onSuccess: (result) => {
|
||||
setCleanupTarget(null)
|
||||
setCleanupRetentionDays("")
|
||||
toast.success(
|
||||
result.delete_all
|
||||
? `已清空${result.target_label}，共删除 ${result.deleted_count} 条。`
|
||||
: `已清理${result.target_label}，共删除 ${result.deleted_count} 条。`,
|
||||
)
|
||||
},
|
||||
onError: (error) => {
|
||||
toast.error(error instanceof Error ? error.message : "清理失败")
|
||||
},
|
||||
})
|
||||
|
||||
const discoveryToken = bootstrapQuery.data?.discovery_token ?? ""
|
||||
const discoveryCommand = useMemo(() => {
|
||||
if (!fields.ServerAddress || !discoveryToken) return ""
|
||||
return buildDiscoveryCommand(fields.ServerAddress, discoveryToken)
|
||||
}, [discoveryToken, fields.ServerAddress])
|
||||
|
||||
const updateField = <K extends keyof OpenFlareOpsFields>(
|
||||
key: K,
|
||||
value: OpenFlareOpsFields[K],
|
||||
) => {
|
||||
setFields((previous) => ({ ...previous, [key]: value }))
|
||||
}
|
||||
|
||||
const saveAgentSettings = () => {
|
||||
try {
|
||||
saveMutation.mutate({
|
||||
section: "agent",
|
||||
entries: agentOptionEntries(fields),
|
||||
})
|
||||
} catch (error) {
|
||||
toast.error(error instanceof Error ? error.message : "参数校验失败")
|
||||
}
|
||||
}
|
||||
|
||||
const saveUptimeKumaSettings = () => {
|
||||
try {
|
||||
saveMutation.mutate({
|
||||
section: "uptimekuma",
|
||||
entries: uptimeKumaOptionEntries(fields),
|
||||
})
|
||||
} catch (error) {
|
||||
toast.error(error instanceof Error ? error.message : "参数校验失败")
|
||||
}
|
||||
}
|
||||
|
||||
const saveDatabaseAutoCleanup = () => {
|
||||
try {
|
||||
saveMutation.mutate({
|
||||
section: "database-auto",
|
||||
entries: databaseAutoCleanupEntries(fields),
|
||||
})
|
||||
} catch (error) {
|
||||
toast.error(error instanceof Error ? error.message : "参数校验失败")
|
||||
}
|
||||
}
|
||||
|
||||
if (optionsQuery.isLoading) {
|
||||
return <LoadingStateWithBorder icon={Server} description="加载 OpenFlare 运维设置..." />
|
||||
}
|
||||
|
||||
if (optionsQuery.isError) {
|
||||
return (
|
||||
<ErrorInline
|
||||
message={
|
||||
optionsQuery.error instanceof Error ? optionsQuery.error.message : "加载失败"
|
||||
}
|
||||
onRetry={() => void optionsQuery.refetch()}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
<div className="grid gap-6 xl:grid-cols-2">
|
||||
<Card className="border-dashed shadow-none">
|
||||
<CardHeader className="flex flex-row items-center justify-between gap-4">
|
||||
<div>
|
||||
<CardTitle className="text-base">Agent 运行参数</CardTitle>
|
||||
<CardDescription>心跳间隔与离线阈值会在下个心跳周期同步到节点。</CardDescription>
|
||||
</div>
|
||||
<Button size="sm" disabled={savingSection === "agent"} onClick={saveAgentSettings}>
|
||||
{savingSection === "agent" ? (
|
||||
<Loader2 className="size-4 animate-spin mr-1" />
|
||||
) : (
|
||||
<Save className="size-3.5 mr-1" />
|
||||
)}
|
||||
保存
|
||||
</Button>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-4">
|
||||
<div className="grid gap-4 md:grid-cols-2">
|
||||
<FieldInput
|
||||
label={`心跳间隔 (${formatDurationLabel(fields.AgentHeartbeatInterval)})`}
|
||||
value={fields.AgentHeartbeatInterval}
|
||||
type="number"
|
||||
onChange={(value) => updateField("AgentHeartbeatInterval", value)}
|
||||
/>
|
||||
<FieldInput
|
||||
label={`离线阈值 (${formatDurationLabel(fields.NodeOfflineThreshold)})`}
|
||||
value={fields.NodeOfflineThreshold}
|
||||
type="number"
|
||||
onChange={(value) => updateField("NodeOfflineThreshold", value)}
|
||||
/>
|
||||
</div>
|
||||
<ToggleRow
|
||||
label="开启 WS 连接升级"
|
||||
description="HTTP 心跳成功后尝试升级为 WebSocket，配置发布可即时通知。"
|
||||
checked={fields.AgentWebsocketUpgradeEnabled}
|
||||
onChange={(value) => updateField("AgentWebsocketUpgradeEnabled", value)}
|
||||
/>
|
||||
<FieldInput
|
||||
label="Agent 更新仓库"
|
||||
value={fields.AgentUpdateRepo}
|
||||
placeholder="Rain-kl/OpenFlare"
|
||||
onChange={(value) => updateField("AgentUpdateRepo", value)}
|
||||
/>
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
<Card className="border-dashed shadow-none">
|
||||
<CardHeader className="flex flex-row items-center justify-between gap-4">
|
||||
<div>
|
||||
<CardTitle className="text-base">IP 归属解析</CardTitle>
|
||||
<CardDescription>
|
||||
控制节点地图等场景的 GeoIP 来源；访客访问记录归属地固定使用 MaxMind mmdb。
|
||||
</CardDescription>
|
||||
</div>
|
||||
<Button size="sm" disabled={savingSection === "agent"} onClick={saveAgentSettings}>
|
||||
{savingSection === "agent" ? (
|
||||
<Loader2 className="size-4 animate-spin mr-1" />
|
||||
) : (
|
||||
<Save className="size-3.5 mr-1" />
|
||||
)}
|
||||
保存
|
||||
</Button>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-4">
|
||||
<div className="space-y-1.5">
|
||||
<Label>归属方式</Label>
|
||||
<Select
|
||||
value={fields.GeoIPProvider}
|
||||
onValueChange={(value) => updateField("GeoIPProvider", value)}
|
||||
>
|
||||
<SelectTrigger>
|
||||
<SelectValue />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
<SelectItem value="disabled">关闭</SelectItem>
|
||||
<SelectItem value="mmdb">MaxMind mmdb</SelectItem>
|
||||
<SelectItem value="ip-api">ip-api.com</SelectItem>
|
||||
<SelectItem value="geojs">geojs.io</SelectItem>
|
||||
<SelectItem value="ipinfo">ipinfo.io</SelectItem>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
<div className="flex flex-col gap-3 rounded-lg border border-dashed p-3 sm:flex-row sm:items-end">
|
||||
<FieldInput
|
||||
label="测试 IP"
|
||||
value={geoIPTestIP}
|
||||
onChange={setGeoIPTestIP}
|
||||
placeholder="8.8.8.8"
|
||||
/>
|
||||
<Button
|
||||
type="button"
|
||||
variant="outline"
|
||||
disabled={geoIPMutation.isPending}
|
||||
onClick={() => geoIPMutation.mutate()}
|
||||
>
|
||||
{geoIPMutation.isPending ? "查询中..." : "查询归属"}
|
||||
</Button>
|
||||
</div>
|
||||
{geoIPMutation.data ? (
|
||||
<div className="grid gap-2 text-sm sm:grid-cols-2">
|
||||
<InfoCell label="国家/地区" value={geoIPMutation.data.name || "—"} />
|
||||
<InfoCell label="ISO Code" value={geoIPMutation.data.iso_code || "—"} />
|
||||
</div>
|
||||
) : null}
|
||||
</CardContent>
|
||||
</Card>
|
||||
</div>
|
||||
|
||||
<Card className="border-dashed shadow-none">
|
||||
<CardHeader className="flex flex-row items-center justify-between gap-4">
|
||||
<div>
|
||||
<CardTitle className="text-base">Discovery Token 与部署</CardTitle>
|
||||
<CardDescription>
|
||||
新节点首次接入使用 Discovery Token；轮换请前往节点管理或使用下方操作。
|
||||
</CardDescription>
|
||||
</div>
|
||||
<div className="flex flex-wrap gap-2">
|
||||
<Button variant="outline" size="sm" asChild>
|
||||
<Link href="/nodes">
|
||||
<ExternalLink className="size-3.5 mr-1" />
|
||||
节点管理
|
||||
</Link>
|
||||
</Button>
|
||||
<Button
|
||||
variant="outline"
|
||||
size="sm"
|
||||
disabled={rotateTokenMutation.isPending}
|
||||
onClick={() => rotateTokenMutation.mutate()}
|
||||
>
|
||||
<RotateCw className="size-3.5 mr-1" />
|
||||
轮换 Token
|
||||
</Button>
|
||||
</div>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-4">
|
||||
<FieldInput
|
||||
label="Server URL"
|
||||
value={fields.ServerAddress}
|
||||
onChange={(value) => updateField("ServerAddress", value)}
|
||||
placeholder="https://yourdomain.com"
|
||||
/>
|
||||
<div className="rounded-lg border border-dashed p-3">
|
||||
<p className="text-[10px] uppercase tracking-wider text-muted-foreground">
|
||||
Discovery Token（只读）
|
||||
</p>
|
||||
<p className="mt-2 break-all text-sm font-mono">
|
||||
{bootstrapQuery.isLoading ? "加载中..." : discoveryToken || "未生成"}
|
||||
</p>
|
||||
</div>
|
||||
<div className="space-y-1.5">
|
||||
<Label>一键部署命令</Label>
|
||||
<Textarea
|
||||
readOnly
|
||||
value={discoveryCommand || "请先填写可访问的 Server URL 并获取 Token。"}
|
||||
className="min-h-24 font-mono text-xs"
|
||||
/>
|
||||
{discoveryCommand ? (
|
||||
<Button
|
||||
type="button"
|
||||
variant="outline"
|
||||
size="sm"
|
||||
onClick={() => void copyText(discoveryCommand).then(() => toast.success("命令已复制"))}
|
||||
>
|
||||
<Copy className="size-3.5 mr-1" />
|
||||
复制命令
|
||||
</Button>
|
||||
) : null}
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
<Card className="border-dashed shadow-none">
|
||||
<CardHeader className="flex flex-row items-center justify-between gap-4">
|
||||
<div>
|
||||
<CardTitle className="text-base">Uptime Kuma 集成</CardTitle>
|
||||
<CardDescription>将反代站点差分同步至 Uptime Kuma 监控实例。</CardDescription>
|
||||
</div>
|
||||
<div className="flex flex-wrap gap-2">
|
||||
<Button
|
||||
variant="outline"
|
||||
size="sm"
|
||||
disabled={!fields.UptimeKumaEnabled || syncUptimeKumaMutation.isPending}
|
||||
onClick={() => syncUptimeKumaMutation.mutate()}
|
||||
>
|
||||
<RefreshCw className="size-3.5 mr-1" />
|
||||
立即同步
|
||||
</Button>
|
||||
<Button
|
||||
size="sm"
|
||||
disabled={savingSection === "uptimekuma"}
|
||||
onClick={saveUptimeKumaSettings}
|
||||
>
|
||||
保存
|
||||
</Button>
|
||||
</div>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-4">
|
||||
<ToggleRow
|
||||
label="开启 Uptime Kuma"
|
||||
checked={fields.UptimeKumaEnabled}
|
||||
onChange={(value) => updateField("UptimeKumaEnabled", value)}
|
||||
/>
|
||||
{fields.UptimeKumaEnabled ? (
|
||||
<>
|
||||
<div className="grid gap-4 md:grid-cols-2">
|
||||
<FieldInput
|
||||
label="Uptime Kuma 地址"
|
||||
value={fields.UptimeKumaUrl}
|
||||
onChange={(value) => updateField("UptimeKumaUrl", value)}
|
||||
placeholder="http://localhost:3001"
|
||||
/>
|
||||
<FieldInput
|
||||
label="用户名"
|
||||
value={fields.UptimeKumaUsername}
|
||||
onChange={(value) => updateField("UptimeKumaUsername", value)}
|
||||
/>
|
||||
<FieldInput
|
||||
label="密码"
|
||||
value={fields.UptimeKumaPassword}
|
||||
type="password"
|
||||
onChange={(value) => updateField("UptimeKumaPassword", value)}
|
||||
placeholder="留空表示不更新"
|
||||
/>
|
||||
<FieldInput
|
||||
label="同步间隔 (分钟)"
|
||||
value={fields.UptimeKumaSyncInterval}
|
||||
type="number"
|
||||
onChange={(value) => updateField("UptimeKumaSyncInterval", value)}
|
||||
/>
|
||||
<div className="space-y-1.5">
|
||||
<Label>监控范围</Label>
|
||||
<Select
|
||||
value={fields.UptimeKumaMonitorScope}
|
||||
onValueChange={(value) => updateField("UptimeKumaMonitorScope", value)}
|
||||
>
|
||||
<SelectTrigger>
|
||||
<SelectValue />
|
||||
</SelectTrigger>
|
||||
<SelectContent>
|
||||
<SelectItem value="all">全部站点</SelectItem>
|
||||
<SelectItem value="selected">选择站点</SelectItem>
|
||||
</SelectContent>
|
||||
</Select>
|
||||
</div>
|
||||
</div>
|
||||
{fields.UptimeKumaMonitorScope === "selected" ? (
|
||||
<div className="rounded-lg border border-dashed p-3">
|
||||
<div className="flex items-center justify-between gap-2">
|
||||
<p className="text-sm font-medium">已选站点</p>
|
||||
<Button
|
||||
type="button"
|
||||
variant="outline"
|
||||
size="sm"
|
||||
onClick={() => setUptimeKumaModalOpen(true)}
|
||||
>
|
||||
选择监控站点
|
||||
</Button>
|
||||
</div>
|
||||
<p className="mt-2 break-all text-xs text-muted-foreground">
|
||||
{fields.UptimeKumaSelectedSites
|
||||
? fields.UptimeKumaSelectedSites.split(",").join(", ")
|
||||
: "未选择任何站点"}
|
||||
</p>
|
||||
</div>
|
||||
) : null}
|
||||
<div className="grid gap-4 md:grid-cols-2">
|
||||
<FieldInput
|
||||
label="检测频率 (秒)"
|
||||
value={fields.UptimeKumaInterval}
|
||||
type="number"
|
||||
onChange={(value) => updateField("UptimeKumaInterval", value)}
|
||||
/>
|
||||
<FieldInput
|
||||
label="重试次数"
|
||||
value={fields.UptimeKumaRetry}
|
||||
type="number"
|
||||
onChange={(value) => updateField("UptimeKumaRetry", value)}
|
||||
/>
|
||||
<FieldInput
|
||||
label="重试间隔 (秒)"
|
||||
value={fields.UptimeKumaRetryInterval}
|
||||
type="number"
|
||||
onChange={(value) => updateField("UptimeKumaRetryInterval", value)}
|
||||
/>
|
||||
<FieldInput
|
||||
label="请求超时 (秒)"
|
||||
value={fields.UptimeKumaTimeout}
|
||||
type="number"
|
||||
onChange={(value) => updateField("UptimeKumaTimeout", value)}
|
||||
/>
|
||||
</div>
|
||||
</>
|
||||
) : null}
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
<div className="grid gap-6 xl:grid-cols-2">
|
||||
<Card className="border-dashed shadow-none">
|
||||
<CardHeader className="flex flex-row items-center justify-between gap-4">
|
||||
<div>
|
||||
<CardTitle className="text-base">数据库自动清理</CardTitle>
|
||||
<CardDescription>每天凌晨 3 点清理超出保留期的观测数据。</CardDescription>
|
||||
</div>
|
||||
<Button
|
||||
size="sm"
|
||||
disabled={savingSection === "database-auto"}
|
||||
onClick={saveDatabaseAutoCleanup}
|
||||
>
|
||||
保存
|
||||
</Button>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-4">
|
||||
<ToggleRow
|
||||
label="启用每日自动清理"
|
||||
checked={fields.DatabaseAutoCleanupEnabled}
|
||||
onChange={(value) => updateField("DatabaseAutoCleanupEnabled", value)}
|
||||
/>
|
||||
<FieldInput
|
||||
label="保留天数"
|
||||
value={fields.DatabaseAutoCleanupRetentionDays}
|
||||
type="number"
|
||||
onChange={(value) => updateField("DatabaseAutoCleanupRetentionDays", value)}
|
||||
/>
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
<Card className="border-dashed shadow-none">
|
||||
<CardHeader>
|
||||
<CardTitle className="text-base">手动数据清理</CardTitle>
|
||||
<CardDescription>保留天数留空时将删除该类数据的全部历史记录。</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-3">
|
||||
{cleanupTargets.map((item) => (
|
||||
<div
|
||||
key={item.target}
|
||||
className="flex items-start justify-between gap-3 rounded-lg border border-dashed p-3"
|
||||
>
|
||||
<div>
|
||||
<p className="text-sm font-medium">{item.label}</p>
|
||||
<p className="mt-1 text-xs text-muted-foreground">{item.description}</p>
|
||||
</div>
|
||||
<Button
|
||||
type="button"
|
||||
variant="destructive"
|
||||
size="sm"
|
||||
onClick={() =>
|
||||
setCleanupTarget({ target: item.target, label: item.label })
|
||||
}
|
||||
>
|
||||
<Trash2 className="size-3.5 mr-1" />
|
||||
清理
|
||||
</Button>
|
||||
</div>
|
||||
))}
|
||||
</CardContent>
|
||||
</Card>
|
||||
</div>
|
||||
|
||||
<Card className="border-dashed shadow-none">
|
||||
<CardHeader className="flex flex-row items-center justify-between gap-4">
|
||||
<div>
|
||||
<CardTitle className="text-base">版本信息</CardTitle>
|
||||
<CardDescription>
|
||||
检查上游 GitHub Release 并升级当前服务。
|
||||
</CardDescription>
|
||||
</div>
|
||||
<Button type="button" size="sm" onClick={() => setVersionDialogOpen(true)}>
|
||||
管理升级
|
||||
</Button>
|
||||
</CardHeader>
|
||||
<CardContent className="grid gap-3 sm:grid-cols-2 lg:grid-cols-4">
|
||||
<InfoCell label="当前版本" value={statusQuery.data?.version ?? releaseQuery.data?.current_version ?? "—"} />
|
||||
<InfoCell
|
||||
label="最新 Release"
|
||||
value={releaseQuery.data?.latest_version ?? "—"}
|
||||
/>
|
||||
<div className="rounded-lg border border-dashed px-3 py-2">
|
||||
<p className="text-[10px] uppercase tracking-wider text-muted-foreground">更新状态</p>
|
||||
<div className="mt-2">
|
||||
{releaseQuery.data?.update_available ? (
|
||||
<Badge variant="secondary">有新版本</Badge>
|
||||
) : (
|
||||
<Badge variant="outline">已是最新</Badge>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
<InfoCell
|
||||
label="启动时间"
|
||||
value={
|
||||
statusQuery.data?.start_time
|
||||
? new Date(statusQuery.data.start_time * 1000).toLocaleString()
|
||||
: "—"
|
||||
}
|
||||
/>
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
<VersionUpgradeDialog
|
||||
open={versionDialogOpen}
|
||||
onOpenChange={setVersionDialogOpen}
|
||||
canUpgrade
|
||||
/>
|
||||
|
||||
<UptimeKumaSiteSelectModal
|
||||
open={uptimeKumaModalOpen}
|
||||
selectedSites={
|
||||
fields.UptimeKumaSelectedSites
|
||||
? fields.UptimeKumaSelectedSites.split(",")
|
||||
: []
|
||||
}
|
||||
onOpenChange={setUptimeKumaModalOpen}
|
||||
onSave={(sites) => updateField("UptimeKumaSelectedSites", sites.join(","))}
|
||||
/>
|
||||
|
||||
<AlertDialog
|
||||
open={cleanupTarget !== null}
|
||||
onOpenChange={(open) => !open && setCleanupTarget(null)}
|
||||
>
|
||||
<AlertDialogContent>
|
||||
<AlertDialogHeader>
|
||||
<AlertDialogTitle>清理{cleanupTarget?.label}</AlertDialogTitle>
|
||||
<AlertDialogDescription>
|
||||
输入保留天数后仅删除超出范围的数据；留空则删除全部历史记录，操作不可恢复。
|
||||
</AlertDialogDescription>
|
||||
</AlertDialogHeader>
|
||||
<FieldInput
|
||||
label="保留天数"
|
||||
value={cleanupRetentionDays}
|
||||
type="number"
|
||||
onChange={setCleanupRetentionDays}
|
||||
placeholder="留空则全部删除"
|
||||
/>
|
||||
<AlertDialogFooter>
|
||||
<AlertDialogCancel disabled={cleanupMutation.isPending}>取消</AlertDialogCancel>
|
||||
<AlertDialogAction
|
||||
disabled={cleanupMutation.isPending}
|
||||
onClick={(event) => {
|
||||
event.preventDefault()
|
||||
if (!cleanupTarget) return
|
||||
const trimmed = cleanupRetentionDays.trim()
|
||||
if (trimmed !== "") {
|
||||
const retentionDays = Number.parseInt(trimmed, 10)
|
||||
if (Number.isNaN(retentionDays) || retentionDays < 1) {
|
||||
toast.error("保留天数至少为 1 天")
|
||||
return
|
||||
}
|
||||
cleanupMutation.mutate({
|
||||
target: cleanupTarget.target,
|
||||
retention_days: retentionDays,
|
||||
})
|
||||
return
|
||||
}
|
||||
cleanupMutation.mutate({ target: cleanupTarget.target })
|
||||
}}
|
||||
>
|
||||
{cleanupMutation.isPending ? "清理中..." : "确认清理"}
|
||||
</AlertDialogAction>
|
||||
</AlertDialogFooter>
|
||||
</AlertDialogContent>
|
||||
</AlertDialog>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
function FieldInput({
|
||||
label,
|
||||
value,
|
||||
onChange,
|
||||
type = "text",
|
||||
placeholder,
|
||||
}: {
|
||||
label: string
|
||||
value: string
|
||||
onChange: (value: string) => void
|
||||
type?: string
|
||||
placeholder?: string
|
||||
}) {
|
||||
return (
|
||||
<div className="space-y-1.5">
|
||||
<Label>{label}</Label>
|
||||
<Input
|
||||
type={type}
|
||||
value={value}
|
||||
placeholder={placeholder}
|
||||
onChange={(event) => onChange(event.target.value)}
|
||||
className="h-9 text-xs"
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
function ToggleRow({
|
||||
label,
|
||||
description,
|
||||
checked,
|
||||
onChange,
|
||||
}: {
|
||||
label: string
|
||||
description?: string
|
||||
checked: boolean
|
||||
onChange: (value: boolean) => void
|
||||
}) {
|
||||
return (
|
||||
<div className="flex items-center justify-between gap-3 rounded-lg border border-dashed px-3 py-2">
|
||||
<div>
|
||||
<Label className="text-xs">{label}</Label>
|
||||
{description ? (
|
||||
<p className="mt-0.5 text-[11px] text-muted-foreground">{description}</p>
|
||||
) : null}
|
||||
</div>
|
||||
<Switch checked={checked} onCheckedChange={onChange} />
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
function InfoCell({ label, value }: { label: string; value: string }) {
|
||||
return (
|
||||
<div className="rounded-lg border border-dashed px-3 py-2">
|
||||
<p className="text-[10px] uppercase tracking-wider text-muted-foreground">{label}</p>
|
||||
<p className="mt-2 text-sm font-medium break-all">{value}</p>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user