优化仪表板页面，移除冗余组件，简化代码结构

2026-10-08 00:26:37 +08:00 · 2026-03-14 16:17:43 +08:00
parent ee104f0ad8
commit 590e1d7a8a
11 changed files with 150 additions and 188 deletions
@@ -196,48 +196,54 @@ export function TlsCertificatesPage() {
        </AppCard>
      </div>

-      <CertificateImportModal
-        isOpen={isImportOpen}
-        onClose={() => setIsImportOpen(false)}
-        onImported={(certificate) => {
-          setFeedback({
-            tone: 'success',
-            message: `证书 ${certificate.name} 已导入。`,
-          });
-        }}
-      />
+      {isImportOpen ? (
+        <CertificateImportModal
+          isOpen={isImportOpen}
+          onClose={() => setIsImportOpen(false)}
+          onImported={(certificate) => {
+            setFeedback({
+              tone: 'success',
+              message: `证书 ${certificate.name} 已导入。`,
+            });
+          }}
+        />
+      ) : null}

-      <CertificateDetailModal
-        certificateId={selectedCertificateId}
-        isOpen={isDetailOpen}
-        onClose={() => setIsDetailOpen(false)}
-        onEdit={() => {
-          setIsDetailOpen(false);
-          setIsEditorOpen(true);
-        }}
-        onDelete={() => {
-          const certificate = certificates.find(
-            (item) => item.id === selectedCertificateId,
-          );
-          if (certificate) {
+      {isDetailOpen ? (
+        <CertificateDetailModal
+          certificateId={selectedCertificateId}
+          isOpen={isDetailOpen}
+          onClose={() => setIsDetailOpen(false)}
+          onEdit={() => {
            setIsDetailOpen(false);
-            handleDeleteCertificate(certificate);
-          }
-        }}
-        deleting={deleteCertificateMutation.isPending}
-      />
+            setIsEditorOpen(true);
+          }}
+          onDelete={() => {
+            const certificate = certificates.find(
+              (item) => item.id === selectedCertificateId,
+            );
+            if (certificate) {
+              setIsDetailOpen(false);
+              handleDeleteCertificate(certificate);
+            }
+          }}
+          deleting={deleteCertificateMutation.isPending}
+        />
+      ) : null}

-      <CertificateEditorModal
-        certificateId={selectedCertificateId}
-        isOpen={isEditorOpen}
-        onClose={() => setIsEditorOpen(false)}
-        onSaved={(certificate) => {
-          setFeedback({
-            tone: 'success',
-            message: `证书 ${certificate.name} 已更新。`,
-          });
-        }}
-      />
+      {isEditorOpen ? (
+        <CertificateEditorModal
+          certificateId={selectedCertificateId}
+          isOpen={isEditorOpen}
+          onClose={() => setIsEditorOpen(false)}
+          onSaved={(certificate) => {
+            setFeedback({
+              tone: 'success',
+              message: `证书 ${certificate.name} 已更新。`,
+            });
+          }}
+        />
+      ) : null}
    </>
  );
 }