feat: 前端界面优化

platform_web/components/OperationControls.test.tsx

@@ -22,7 +22,9 @@ describe("shared operation dialogs", () => {
     expect(html).toContain('aria-labelledby=');
     expect(html).toContain('aria-describedby=');
     expect(html).toContain('aria-busy="true"');
+    expect(html).toContain("关闭确认停用");
     expect(operationControlsSource).toContain('event.key === "Escape"');
+    expect(operationControlsSource).toContain('document.body.style.overflow = "hidden"');
     expect(operationControlsSource).toContain("previousFocus?.focus()");
   });
 

platform_web/components/OperationControls.tsx

@@ -32,7 +32,13 @@ export function ConfirmDialog({ open, title, description, confirmLabel, danger,
         aria-busy={busy}
         onClick={(event) => event.stopPropagation()}
       >
-        <h2 id={titleId}>{title}</h2>
+        <div className="panel-header dialog-panel-header">
+          <h2 id={titleId}>{title}</h2>
+          <button type="button" className="theme-upload drawer-close" aria-label={`关闭${title}`} onClick={onCancel} disabled={busy}>
+            <X size={14} />
+            <span>关闭</span>
+          </button>
+        </div>
         <p id={descriptionId}>{description}</p>
         {children}
         <div className="confirm-actions">
@@ -75,7 +81,7 @@ export function ManagementDialog({ open, title, description, wide, onClose, chil
         aria-describedby={description ? descriptionId : undefined}
         onClick={(event) => event.stopPropagation()}
       >
-        <div className="panel-header">
+        <div className="panel-header dialog-panel-header">
           <h2 id={titleId}>{title}</h2>
           <button type="button" className="theme-upload drawer-close" aria-label={`关闭${title}`} onClick={onClose}>
             <X size={14} />
@@ -109,8 +115,11 @@ function useDialogLifecycle(open: boolean, onClose: () => void, canClose: boolea
     }
 
     document.addEventListener("keydown", handleKeyDown);
+    const previousBodyOverflow = document.body.style.overflow;
+    document.body.style.overflow = "hidden";
     return () => {
       document.removeEventListener("keydown", handleKeyDown);
+      document.body.style.overflow = previousBodyOverflow;
       previousFocus?.focus();
     };
   }, [canClose, onClose, open]);