Web: Settings: Backup: Added disable to save changes at Automatic backup when is copying to the temporary storage.

packages/asc-web-components/save-cancel-buttons/index.js

@@ -44,6 +44,7 @@ class SaveCancelButtons extends React.Component {
       cancelButtonLabel,
       className,
       id,
+      isDisabled,
     } = this.props;
     return (
       <StyledSaveCancelButtons className={className} id={id}>
@@ -51,7 +52,7 @@ class SaveCancelButtons extends React.Component {
           <Button
             className="save-button"
             size="big"
-            isDisabled={false}
+            isDisabled={isDisabled}
             primary
             onClick={onSaveClick}
             label={saveButtonLabel}
@@ -59,7 +60,7 @@ class SaveCancelButtons extends React.Component {
           <Button
             className="cancel-button"
             size="big"
-            isDisabled={false}
+            isDisabled={isDisabled}
             onClick={onCancelClick}
             label={cancelButtonLabel}
           />
@@ -94,6 +95,7 @@ SaveCancelButtons.propTypes = {
 SaveCancelButtons.defaultProps = {
   saveButtonLabel: "Save",
   cancelButtonLabel: "Cancel",
+  isDisabled: false,
 };
 
 export default SaveCancelButtons;

web/ASC.Web.Client/src/components/pages/Settings/categories/data-management/automatic-backup.js

@@ -10,6 +10,9 @@ import RadioButton from "@appserver/components/radio-button";
 import styled from "styled-components";
 import moment from "moment";
 import ScheduleComponent from "./sub-components/scheduleComponent";
+import { getBackupProgress } from "@appserver/common/api/portal";
+import SaveCancelButtons from "@appserver/components/save-cancel-buttons";
+
 const StyledComponent = styled.div`
   ${commonSettingsStyles}
   .manual-backup_buttons {
@@ -82,6 +85,8 @@ class AutomaticBackup extends React.Component {
       selectedMaxCopies: "10",
 
       weekOptions: [],
+
+      isCopyingToLocal: true,
     };
 
     this.periodOptions = [
@@ -113,8 +118,32 @@ class AutomaticBackup extends React.Component {
 
   componentDidMount() {
     this.getWeekdaysOptions();
+    getBackupProgress().then((res) => {
+      if (res) {
+        if (res.progress === 100)
+          this.setState({
+            isCopyingToLocal: false,
+          });
+        if (res.progress !== 100)
+          this.timerId = setInterval(() => this.getProgress(), 1000);
+      }
+    });
   }
-
+  componentWillUnmount() {
+    clearInterval(this.timerId);
+  }
+  getProgress = () => {
+    getBackupProgress().then((res) => {
+      if (res) {
+        if (res.progress === 100) {
+          clearInterval(this.timerId);
+          this.setState({
+            isCopyingToLocal: false,
+          });
+        }
+      }
+    });
+  };
   getTimeOptions = () => {
     for (let item = 0; item < 24; item++) {
       let obj = {
@@ -278,6 +307,7 @@ class AutomaticBackup extends React.Component {
       selectedTimeOption,
       selectedMonthOption,
       selectedMaxCopies,
+      isCopyingToLocal,
     } = this.state;
     console.log(" this.arrayWeekdays", this.arrayWeekdays);
     console.log("isCheckedDocuments", isCheckedDocuments);
@@ -426,6 +456,16 @@ class AutomaticBackup extends React.Component {
             </StyledModules>
           </>
         )}
+        <SaveCancelButtons
+          className="team-template_buttons"
+          onSaveClick={() => console.log("click")}
+          onCancelClick={() => console.log("cancel")}
+          showReminder={false}
+          reminderTest={t("YouHaveUnsavedChanges")}
+          saveButtonLabel={t("SaveButton")}
+          cancelButtonLabel={t("CancelButton")}
+          isDisabled={isCopyingToLocal}
+        />
       </StyledComponent>
     );
   }

web/ASC.Web.Client/src/components/pages/Settings/categories/data-management/manual-backup.js

@@ -54,12 +54,14 @@ class ManualBackup extends React.Component {
     getCommonThirdPartyList()
       .then(() => getBackupProgress())
       .then((res) => {
-        this.setState({
-          downloadingProgress: res.progress,
-          link: res.link,
-        });
-        if (res.progress !== 100)
-          this.timerId = setInterval(() => this.getProgress(), 1000);
+        if (res) {
+          this.setState({
+            downloadingProgress: res.progress,
+            link: res.link,
+          });
+          if (res.progress !== 100)
+            this.timerId = setInterval(() => this.getProgress(), 1000);
+        }
       });
   }
 
@@ -82,14 +84,16 @@ class ManualBackup extends React.Component {
     console.log("downloadingProgress", downloadingProgress);
 
     getBackupProgress().then((res) => {
-      this.setState({
-        downloadingProgress: res.progress,
-      });
-      if (res.progress === 100) {
-        clearInterval(this.timerId);
+      if (res) {
         this.setState({
-          link: res.link,
+          downloadingProgress: res.progress,
         });
+        if (res.progress === 100) {
+          clearInterval(this.timerId);
+          this.setState({
+            link: res.link,
+          });
+        }
       }
     });
   };