[优化] 格式化

This commit is contained in:
ryan
2026-05-30 13:15:20 +08:00
parent 28b1305906
commit 9ec3d5b42d
110 changed files with 29155 additions and 7642 deletions
@@ -13,7 +13,10 @@ import {
getTlsCertificate,
getTlsCertificateContent,
} from '@/features/tls-certificates/api/tls-certificates';
import { getCertificateStatus, getErrorMessage } from '@/features/websites/utils';
import {
getCertificateStatus,
getErrorMessage,
} from '@/features/websites/utils';
import {
CodeBlock,
DangerButton,
@@ -81,11 +84,7 @@ export function CertificateDetailModal({
<SecondaryButton type="button" onClick={onClose}>
关闭
</SecondaryButton>
<PrimaryButton
type="button"
onClick={onEdit}
disabled={!certificate}
>
<PrimaryButton type="button" onClick={onEdit} disabled={!certificate}>
编辑证书
</PrimaryButton>
<DangerButton
@@ -112,15 +111,12 @@ export function CertificateDetailModal({
)}
/>
) : !certificate || !content ? (
<EmptyState
title="证书不存在"
description="当前证书可能已被删除。"
/>
<EmptyState title="证书不存在" description="当前证书可能已被删除。" />
) : (
<div className="space-y-6">
<div className="grid gap-4 md:grid-cols-2">
<div className="rounded-2xl border border-[var(--border-default)] bg-[var(--surface-elevated)] px-4 py-4">
<p className="text-xs uppercase tracking-[0.18em] text-[var(--foreground-muted)]">
<p className="text-xs tracking-[0.18em] text-[var(--foreground-muted)] uppercase">
证书名称
</p>
<p className="mt-2 text-sm text-[var(--foreground-primary)]">
@@ -128,7 +124,7 @@ export function CertificateDetailModal({
</p>
</div>
<div className="rounded-2xl border border-[var(--border-default)] bg-[var(--surface-elevated)] px-4 py-4">
<p className="text-xs uppercase tracking-[0.18em] text-[var(--foreground-muted)]">
<p className="text-xs tracking-[0.18em] text-[var(--foreground-muted)] uppercase">
状态
</p>
<div className="mt-2">
@@ -138,7 +134,7 @@ export function CertificateDetailModal({
</div>
</div>
<div className="rounded-2xl border border-[var(--border-default)] bg-[var(--surface-elevated)] px-4 py-4">
<p className="text-xs uppercase tracking-[0.18em] text-[var(--foreground-muted)]">
<p className="text-xs tracking-[0.18em] text-[var(--foreground-muted)] uppercase">
生效时间
</p>
<p className="mt-2 text-sm text-[var(--foreground-primary)]">
@@ -146,7 +142,7 @@ export function CertificateDetailModal({
</p>
</div>
<div className="rounded-2xl border border-[var(--border-default)] bg-[var(--surface-elevated)] px-4 py-4">
<p className="text-xs uppercase tracking-[0.18em] text-[var(--foreground-muted)]">
<p className="text-xs tracking-[0.18em] text-[var(--foreground-muted)] uppercase">
到期时间
</p>
<p className="mt-2 text-sm text-[var(--foreground-primary)]">
@@ -156,7 +152,7 @@ export function CertificateDetailModal({
</div>
<div className="rounded-2xl border border-[var(--border-default)] bg-[var(--surface-elevated)] px-4 py-4">
<p className="text-xs uppercase tracking-[0.18em] text-[var(--foreground-muted)]">
<p className="text-xs tracking-[0.18em] text-[var(--foreground-muted)] uppercase">
备注
</p>
<p className="mt-2 text-sm leading-6 text-[var(--foreground-primary)]">
@@ -180,7 +176,7 @@ export function CertificateDetailModal({
复制
</SecondaryButton>
</div>
<CodeBlock className="max-h-56 overflow-y-auto whitespace-pre-wrap break-all">
<CodeBlock className="max-h-56 overflow-y-auto break-all whitespace-pre-wrap">
{content.cert_pem}
</CodeBlock>
</div>
@@ -199,7 +195,7 @@ export function CertificateDetailModal({
复制
</SecondaryButton>
</div>
<CodeBlock className="max-h-56 overflow-y-auto whitespace-pre-wrap break-all">
<CodeBlock className="max-h-56 overflow-y-auto break-all whitespace-pre-wrap">
{content.key_pem}
</CodeBlock>
</div>
@@ -52,8 +52,9 @@ export function CertificateImportModal({
const queryClient = useQueryClient();
const [importMode, setImportMode] = useState<'manual' | 'file'>('manual');
const [feedback, setFeedback] = useState<FeedbackState | null>(null);
const [fileForm, setFileForm] =
useState<FileImportFormValues>(defaultFileImportValues);
const [fileForm, setFileForm] = useState<FileImportFormValues>(
defaultFileImportValues,
);
const [certFile, setCertFile] = useState<File | null>(null);
const [keyFile, setKeyFile] = useState<File | null>(null);
const [fileInputNonce, setFileInputNonce] = useState(0);
@@ -280,9 +281,7 @@ export function CertificateImportModal({
<ResourceField
label="私钥文件"
hint={
keyFile
? `已选择:${keyFile.name}`
: '请选择 KEY/PEM 文件'
keyFile ? `已选择:${keyFile.name}` : '请选择 KEY/PEM 文件'
}
>
<ResourceInput
@@ -143,13 +143,16 @@ export function WebsiteDetailPage({ websiteId }: { websiteId: string }) {
enabled: Boolean(wafRouteID),
});
const wafMutation = useMutation({
mutationFn: (ids: number[]) => replaceWAFSiteRuleGroups(wafRouteID ?? 0, ids),
mutationFn: (ids: number[]) =>
replaceWAFSiteRuleGroups(wafRouteID ?? 0, ids),
onSuccess: async (view) => {
setWafSelectedIDs(view.applied_ids);
setFeedback({ tone: 'success', message: '网站 WAF 规则组已更新。' });
await Promise.all([
queryClient.invalidateQueries({ queryKey: ['waf'] }),
queryClient.invalidateQueries({ queryKey: ['config-versions', 'diff'] }),
queryClient.invalidateQueries({
queryKey: ['config-versions', 'diff'],
}),
]);
},
onError: (error) => {
@@ -90,7 +90,7 @@ export function WebsiteEditorModal({
});
const currentCertificate = watchedCertId
? certificates.find((item) => item.id === Number(watchedCertId)) ?? null
? (certificates.find((item) => item.id === Number(watchedCertId)) ?? null)
: null;
const handleSubmit = form.handleSubmit((values) => {
@@ -215,7 +215,7 @@ export function WebsiteEditorModal({
<div className="grid gap-4 md:grid-cols-3">
<div className="rounded-2xl border border-[var(--border-default)] bg-[var(--surface-elevated)] px-4 py-4">
<p className="text-xs uppercase tracking-[0.2em] text-[var(--foreground-muted)]">
<p className="text-xs tracking-[0.2em] text-[var(--foreground-muted)] uppercase">
当前域名
</p>
<p className="mt-2 text-sm text-[var(--foreground-primary)]">
@@ -223,7 +223,7 @@ export function WebsiteEditorModal({
</p>
</div>
<div className="rounded-2xl border border-[var(--border-default)] bg-[var(--surface-elevated)] px-4 py-4">
<p className="text-xs uppercase tracking-[0.2em] text-[var(--foreground-muted)]">
<p className="text-xs tracking-[0.2em] text-[var(--foreground-muted)] uppercase">
匹配类型
</p>
<div className="mt-2">
@@ -235,12 +235,14 @@ export function WebsiteEditorModal({
</div>
</div>
<div className="rounded-2xl border border-[var(--border-default)] bg-[var(--surface-elevated)] px-4 py-4">
<p className="text-xs uppercase tracking-[0.2em] text-[var(--foreground-muted)]">
<p className="text-xs tracking-[0.2em] text-[var(--foreground-muted)] uppercase">
当前证书
</p>
<div className="mt-2">
<StatusBadge
label={currentCertificate ? currentCertificate.name : '未绑定证书'}
label={
currentCertificate ? currentCertificate.name : '未绑定证书'
}
variant={currentCertificate ? 'success' : 'warning'}
/>
</div>
@@ -136,7 +136,7 @@ export function WebsitesPage() {
<div className="grid gap-4 lg:grid-cols-2">
{domains.map((domain) => {
const certificate = domain.cert_id
? certificateMap.get(domain.cert_id) ?? null
? (certificateMap.get(domain.cert_id) ?? null)
: null;
const matchType = getMatchTypeMeta(domain.domain);
@@ -168,7 +168,7 @@ export function WebsitesPage() {
<div className="grid gap-3 md:grid-cols-1">
<div className="rounded-2xl border border-[var(--border-default)] bg-[var(--surface-panel)] px-4 py-3">
<p className="text-xs uppercase tracking-[0.18em] text-[var(--foreground-muted)]">
<p className="text-xs tracking-[0.18em] text-[var(--foreground-muted)] uppercase">
绑定证书
</p>
<p className="mt-2 text-sm text-[var(--foreground-primary)]">