mirror of
https://github.com/Rain-kl/OpenFlare.git
synced 2026-10-13 18:36:37 +08:00
migrate frontend
This commit is contained in:
ryan
@@ -0,0 +1,25 @@
|
||||
'use client';
|
||||
|
||||
import {Card, CardContent, CardDescription, CardHeader, CardTitle} from '@/components/ui/card';
|
||||
import type {ProxyRouteItem} from '@/lib/services/openflare';
|
||||
|
||||
interface AuthSectionProps {
|
||||
route: ProxyRouteItem;
|
||||
}
|
||||
|
||||
export function AuthSection({ route }: AuthSectionProps) {
|
||||
return (
|
||||
<Card className="border-dashed shadow-none">
|
||||
<CardHeader>
|
||||
<CardTitle className="text-sm font-semibold">认证配置</CardTitle>
|
||||
<CardDescription>配置基础鉴权访问，需要输入账号密码才能访问网站。</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-3 text-sm text-muted-foreground">
|
||||
<p>待实现</p>
|
||||
<p className="text-xs">
|
||||
基础认证：{route.basic_auth_enabled ? '已启用' : '未启用'}；PoW：{route.pow_enabled ? '已启用' : '未启用'}
|
||||
</p>
|
||||
</CardContent>
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
+25
@@ -0,0 +1,25 @@
|
||||
'use client';
|
||||
|
||||
import {Card, CardContent, CardDescription, CardHeader, CardTitle} from '@/components/ui/card';
|
||||
import type {ProxyRouteItem} from '@/lib/services/openflare';
|
||||
|
||||
interface CacheSectionProps {
|
||||
route: ProxyRouteItem;
|
||||
}
|
||||
|
||||
export function CacheSection({ route }: CacheSectionProps) {
|
||||
return (
|
||||
<Card className="border-dashed shadow-none">
|
||||
<CardHeader>
|
||||
<CardTitle className="text-sm font-semibold">缓存</CardTitle>
|
||||
<CardDescription>配置站点缓存策略。</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-3 text-sm text-muted-foreground">
|
||||
<p>待实现</p>
|
||||
<p className="text-xs">
|
||||
缓存状态：{route.cache_enabled ? '已启用' : '未启用'}；策略：{route.cache_policy || 'url'}
|
||||
</p>
|
||||
</CardContent>
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
+26
@@ -0,0 +1,26 @@
|
||||
'use client';
|
||||
|
||||
import {Card, CardContent, CardDescription, CardHeader, CardTitle} from '@/components/ui/card';
|
||||
import type {ProxyRouteItem} from '@/lib/services/openflare';
|
||||
|
||||
interface DomainSectionProps {
|
||||
route: ProxyRouteItem;
|
||||
}
|
||||
|
||||
export function DomainSection({ route }: DomainSectionProps) {
|
||||
return (
|
||||
<Card className="border-dashed shadow-none">
|
||||
<CardHeader>
|
||||
<CardTitle className="text-sm font-semibold">域名设置</CardTitle>
|
||||
<CardDescription>维护站点标识、域名列表和证书绑定。</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-3 text-sm text-muted-foreground">
|
||||
<p>待实现</p>
|
||||
<p className="text-xs">
|
||||
当前主域名：{route.primary_domain || route.domain}
|
||||
{route.domains.length > 1 ? `（共 ${route.domains.length} 个域名）` : ''}
|
||||
</p>
|
||||
</CardContent>
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
+26
@@ -0,0 +1,26 @@
|
||||
'use client';
|
||||
|
||||
import {Card, CardContent, CardDescription, CardHeader, CardTitle} from '@/components/ui/card';
|
||||
import type {ProxyRouteItem} from '@/lib/services/openflare';
|
||||
|
||||
interface LimitsSectionProps {
|
||||
route: ProxyRouteItem;
|
||||
}
|
||||
|
||||
export function LimitsSection({ route }: LimitsSectionProps) {
|
||||
return (
|
||||
<Card className="border-dashed shadow-none">
|
||||
<CardHeader>
|
||||
<CardTitle className="text-sm font-semibold">流量限制</CardTitle>
|
||||
<CardDescription>设置连接数和限速。</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-3 text-sm text-muted-foreground">
|
||||
<p>待实现</p>
|
||||
<p className="text-xs">
|
||||
当前限速：{route.limit_rate || '未配置'}；单 IP 连接数：{route.limit_conn_per_ip}；单 Server
|
||||
连接数：{route.limit_conn_per_server}
|
||||
</p>
|
||||
</CardContent>
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
+25
@@ -0,0 +1,25 @@
|
||||
'use client';
|
||||
|
||||
import {Card, CardContent, CardDescription, CardHeader, CardTitle} from '@/components/ui/card';
|
||||
import type {ProxyRouteItem} from '@/lib/services/openflare';
|
||||
|
||||
import {getUpstreamSummary} from '../../components/helpers';
|
||||
|
||||
interface ProxySectionProps {
|
||||
route: ProxyRouteItem;
|
||||
}
|
||||
|
||||
export function ProxySection({ route }: ProxySectionProps) {
|
||||
return (
|
||||
<Card className="border-dashed shadow-none">
|
||||
<CardHeader>
|
||||
<CardTitle className="text-sm font-semibold">反向代理</CardTitle>
|
||||
<CardDescription>配置主回源和上游地址。</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-3 text-sm text-muted-foreground">
|
||||
<p>待实现</p>
|
||||
<p className="text-xs">当前上游：{getUpstreamSummary(route)}</p>
|
||||
</CardContent>
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,48 @@
|
||||
'use client';
|
||||
|
||||
import Link from 'next/link';
|
||||
import {ArrowLeft, Route, Save, Upload} from 'lucide-react';
|
||||
|
||||
import {Badge} from '@/components/ui/badge';
|
||||
import {Button} from '@/components/ui/button';
|
||||
import type {ProxyRouteItem} from '@/lib/services/openflare';
|
||||
|
||||
interface RouteHeaderProps {
|
||||
route: ProxyRouteItem;
|
||||
}
|
||||
|
||||
export function RouteHeader({ route }: RouteHeaderProps) {
|
||||
return (
|
||||
<div className="space-y-4">
|
||||
<Button variant="ghost" size="sm" className="h-8 gap-1.5 px-0 text-xs" asChild>
|
||||
<Link href="/openflare/proxy-routes">
|
||||
<ArrowLeft className="size-3.5" />
|
||||
返回规则列表
|
||||
</Link>
|
||||
</Button>
|
||||
|
||||
<div className="flex flex-col gap-4 sm:flex-row sm:items-center sm:justify-between">
|
||||
<div className="flex items-center gap-2">
|
||||
<Route className="size-5 text-primary" />
|
||||
<div className="flex flex-wrap items-center gap-2">
|
||||
<h1 className="text-2xl font-semibold tracking-tight">{route.site_name}</h1>
|
||||
<Badge variant={route.enabled ? 'default' : 'secondary'}>
|
||||
{route.enabled ? '已启用' : '已停用'}
|
||||
</Badge>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex flex-wrap gap-2">
|
||||
<Button size="sm" variant="secondary" className="h-8 gap-1.5 text-xs" disabled>
|
||||
<Save className="size-3.5" />
|
||||
保存（待实现）
|
||||
</Button>
|
||||
<Button size="sm" className="h-8 gap-1.5 text-xs" disabled>
|
||||
<Upload className="size-3.5" />
|
||||
发布配置（待实现）
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,23 @@
|
||||
'use client';
|
||||
|
||||
import {Card, CardContent, CardDescription, CardHeader, CardTitle} from '@/components/ui/card';
|
||||
import type {ProxyRouteItem} from '@/lib/services/openflare';
|
||||
|
||||
interface WafSectionProps {
|
||||
route: ProxyRouteItem;
|
||||
}
|
||||
|
||||
export function WafSection({ route }: WafSectionProps) {
|
||||
return (
|
||||
<Card className="border-dashed shadow-none">
|
||||
<CardHeader>
|
||||
<CardTitle className="text-sm font-semibold">WAF</CardTitle>
|
||||
<CardDescription>绑定 WAF 规则组，并查看当前站点生效策略。</CardDescription>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-3 text-sm text-muted-foreground">
|
||||
<p>待实现</p>
|
||||
<p className="text-xs">站点 ID：{route.id}</p>
|
||||
</CardContent>
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user