From 22e8f24e7f7574915e4c75d3c6a5498f6e621ee8 Mon Sep 17 00:00:00 2001
From: crupest <crupest@outlook.com>
Date: Sat, 29 Jul 2023 22:00:59 +0800
Subject: ...

---
 .../src/views/common/dialog/OperationDialog.tsx    | 22 ++++++++++++----------
 1 file changed, 12 insertions(+), 10 deletions(-)

(limited to 'FrontEnd/src/views/common/dialog/OperationDialog.tsx')

diff --git a/FrontEnd/src/views/common/dialog/OperationDialog.tsx b/FrontEnd/src/views/common/dialog/OperationDialog.tsx
index be3f7158..74b4a5fa 100644
--- a/FrontEnd/src/views/common/dialog/OperationDialog.tsx
+++ b/FrontEnd/src/views/common/dialog/OperationDialog.tsx
@@ -39,7 +39,7 @@ function OperationDialogPrompt(props: OperationDialogPromptProps) {
 
 export interface OperationDialogProps<TData> {
   open: boolean;
-  close: () => void;
+  onClose: () => void;
 
   color?: ThemeColor;
   inputColor?: ThemeColor;
@@ -57,7 +57,7 @@ export interface OperationDialogProps<TData> {
 function OperationDialog<TData>(props: OperationDialogProps<TData>) {
   const {
     open,
-    close,
+    onClose,
     color,
     inputColor,
     title,
@@ -85,13 +85,14 @@ function OperationDialog<TData>(props: OperationDialogProps<TData>) {
 
   const [step, setStep] = useState<Step>({ type: "input" });
 
-  const { inputGroupProps, hasError, setAllDisabled, confirm } = useInputs({
-    init: inputs,
-  });
+  const { inputGroupProps, hasErrorAndDirty, setAllDisabled, confirm } =
+    useInputs({
+      init: inputs,
+    });
 
-  function onClose() {
+  function close() {
     if (step.type !== "process") {
-      close();
+      onClose();
       if (step.type === "success" && onSuccessAndClose) {
         onSuccessAndClose?.(step.data);
       }
@@ -142,12 +143,13 @@ function OperationDialog<TData>(props: OperationDialogProps<TData>) {
             text="operationDialog.cancel"
             color="secondary"
             outline
-            onClick={onClose}
+            onClick={close}
             disabled={isProcessing}
           />
           <LoadingButton
             color={color}
             loading={isProcessing}
+            disabled={hasErrorAndDirty}
             onClick={onConfirm}
           >
             {c("operationDialog.confirm")}
@@ -173,14 +175,14 @@ function OperationDialog<TData>(props: OperationDialogProps<TData>) {
         <OperationDialogPrompt {...promptProps} />
         <hr />
         <div className="cru-dialog-bottom-area">
-          <Button text="operationDialog.ok" color="primary" onClick={onClose} />
+          <Button text="operationDialog.ok" color="primary" onClick={close} />
         </div>
       </div>
     );
   }
 
   return (
-    <Dialog open={open} onClose={onClose}>
+    <Dialog open={open} onClose={close}>
       <div
         className={classNames(
           "cru-operation-dialog-container",
-- 
cgit v1.2.3