Web: Files: Added copy method to save in 'oform' format.

packages/asc-web-common/api/files/index.js

@@ -800,7 +800,13 @@ export function checkFillFormDraft(fileId) {
   });
 }
 
-export function fileCopyAs(fileId, destTitle, destFolderId, enableExternalExt) {
+export function fileCopyAs(
+  fileId,
+  destTitle,
+  destFolderId,
+  enableExternalExt,
+  password
+) {
   return request({
     method: "post",
     url: `files/file/${fileId}/copyas`,
@@ -808,6 +814,7 @@ export function fileCopyAs(fileId, destTitle, destFolderId, enableExternalExt) {
       destTitle,
       destFolderId,
       enableExternalExt,
+      password,
     },
   });
 }

products/ASC.Files/Client/src/HOCs/withContextOptions.js

@@ -21,13 +21,28 @@ export default function withContextOptions(WrappedComponent) {
     };
 
     onClickMakeForm = () => {
-      const { copyAsAction, item, formfillingDocs } = this.props;
+      const {
+        copyAsAction,
+        item,
+        formfillingDocs,
+        setConvertPasswordDialogVisible,
+        setFormCreationInfo,
+      } = this.props;
       const { title, id, folderId, fileExst } = item;
 
       const newTitle =
         title.substring(0, title.length - fileExst.length) + formfillingDocs[0];
 
-      copyAsAction(id, newTitle, folderId).catch((err) => toastr.error(err));
+      copyAsAction(id, newTitle, folderId).catch((err) => {
+        console.log("err", err);
+        setFormCreationInfo({
+          newTitle,
+          fromExst: fileExst,
+          toExst: formfillingDocs[0],
+          fileInfo: item,
+        });
+        setConvertPasswordDialogVisible(true);
+      });
     };
 
     onOpenLocation = () => {
@@ -586,6 +601,8 @@ export default function withContextOptions(WrappedComponent) {
         setRemoveItem,
         setSharingPanelVisible,
         setUnsubscribe,
+        setConvertPasswordDialogVisible,
+        setFormCreationInfo,
       } = dialogsStore;
       const { isTabletView, isDesktopClient } = auth.settingsStore;
       const { setIsVerHistoryPanel, fetchFileVersions } = versionHistoryStore;
@@ -618,6 +635,7 @@ export default function withContextOptions(WrappedComponent) {
         setMediaViewerData,
         setRemoveItem,
         setDeleteThirdPartyDialogVisible,
+        setConvertPasswordDialogVisible,
         deleteItemAction,
         onSelectItem,
         setSharingPanelVisible,
@@ -633,6 +651,7 @@ export default function withContextOptions(WrappedComponent) {
         isDesktop: isDesktopClient,
         copyAsAction,
         formfillingDocs,
+        setFormCreationInfo,
       };
     }
   )(observer(WithContextOptions));

products/ASC.Files/Client/src/components/FilesPanels/index.js

@@ -21,6 +21,7 @@ import {
   ConflictResolveDialog,
   ConvertDialog,
 } from "../dialogs";
+import ConvertPasswordDialog from "../dialogs/ConvertPasswordDialog";
 
 const Panels = (props) => {
   const {
@@ -43,6 +44,7 @@ const Panels = (props) => {
     createMasterForm,
     selectFileDialogVisible,
     setSelectFileDialogVisible,
+    convertPasswordDialogVisible,
   } = props;
 
   const { t } = useTranslation(["Translations", "SelectFile"]);
@@ -98,6 +100,9 @@ const Panels = (props) => {
         withSubfolders={false}
       />
     ),
+    convertPasswordDialogVisible && (
+      <ConvertPasswordDialog key="convert-password-dialog" />
+    ),
   ];
 };
 
@@ -118,7 +123,7 @@ export default inject(
       newFilesPanelVisible,
       conflictResolveDialogVisible,
       convertDialogVisible,
-
+      convertPasswordDialogVisible,
       connectItem, //TODO:
 
       createMasterForm,
@@ -146,6 +151,7 @@ export default inject(
       newFilesPanelVisible,
       conflictResolveDialogVisible,
       convertDialogVisible,
+      convertPasswordDialogVisible,
       selectFileDialogVisible,
       createMasterForm,
       setSelectFileDialogVisible,

products/ASC.Files/Client/src/components/dialogs/ConvertPasswordDialog/index.js

@@ -1,4 +1,4 @@
-import React, { useState, useCallback } from "react";
+import React, { useState, useCallback, useEffect } from "react";
 import ModalDialog from "@appserver/components/modal-dialog";
 import Button from "@appserver/components/button";
 import Text from "@appserver/components/text";
@@ -8,12 +8,28 @@ import SimulatePassword from "../../SimulatePassword";
 import StyledComponent from "./StyledConvertPasswordDialog";
 
 const ConvertPasswordDialogComponent = (props) => {
-  const { t, visible, setConvertPasswordDialogVisible, isTabletView } = props;
+  const {
+    t,
+    visible,
+    setConvertPasswordDialogVisible,
+    isTabletView,
+    copyAsAction,
+    formCreationInfo,
+    setFormCreationInfo,
+  } = props;
 
   const [password, setPassword] = useState("");
+  const [isLoading, setIsLoading] = useState(false);
   const [passwordValid, setPasswordValid] = useState(true);
 
+  const dialogHeading =
+    formCreationInfo.fromExst === ".docxf" &&
+    formCreationInfo.toExst === ".oform"
+      ? t("Common:MakeForm")
+      : "";
+
   const onClose = () => {
+    setFormCreationInfo(null);
     setConvertPasswordDialogVisible(false);
   };
   const onConvert = () => {
@@ -26,7 +42,25 @@ const ConvertPasswordDialogComponent = (props) => {
     }
 
     if (hasError) return;
+
+    setIsLoading(true);
   };
+
+  useEffect(() => {
+    const { newTitle, fileInfo } = formCreationInfo;
+    const { id, folderId } = fileInfo;
+    console.log("formCreationInfo", formCreationInfo);
+
+    isLoading &&
+      copyAsAction(id, newTitle, folderId, false, password)
+        .then(() => setFormCreationInfo(null))
+        .catch((err) => {
+          console.log("err", err);
+          setPasswordValid(false);
+        })
+        .finally(() => setIsLoading(false));
+  }, [isLoading]);
+
   const onChangePassword = useCallback(
     (password) => {
       !passwordValid && setPasswordValid(true);
@@ -34,12 +68,10 @@ const ConvertPasswordDialogComponent = (props) => {
     },
     [onChangePassword, passwordValid]
   );
-  console.log("ConvertPasswordDialogComponent", !passwordValid);
+
   return (
     <ModalDialog visible={visible} onClose={onClose}>
-      <ModalDialog.Header>
-        {t("ConvertDialog:ConvertAndOpenTitle")}
-      </ModalDialog.Header>
+      <ModalDialog.Header>{dialogHeading}</ModalDialog.Header>
       <ModalDialog.Body>
         <StyledComponent>
           <div className="convert-password-dialog_content">
@@ -52,6 +84,7 @@ const ConvertPasswordDialogComponent = (props) => {
                 inputBlockMaxWidth={"536px"}
                 onChange={onChangePassword}
                 hasError={!passwordValid}
+                isDisabled={isLoading}
               />
             </div>
           </div>
@@ -65,7 +98,7 @@ const ConvertPasswordDialogComponent = (props) => {
               id="convert-password-dialog_button-accept"
               className="convert-password-dialog_button"
               key="ContinueButton"
-              label={t("Convert")}
+              label={t("Common:SaveButton")}
               size="medium"
               primary
               onClick={onConvert}
@@ -73,7 +106,7 @@ const ConvertPasswordDialogComponent = (props) => {
             <Button
               className="convert-password-dialog_button"
               key="CloseButton"
-              label={t("Common:Cancel")}
+              label={t("Common:CloseButton")}
               size="medium"
               onClick={onClose}
             />
@@ -86,24 +119,32 @@ const ConvertPasswordDialogComponent = (props) => {
 
 const ConvertPasswordDialog = withTranslation([
   "ConvertPasswordDialog",
-  "ConvertDialog",
-  "Home",
   "Common",
 ])(ConvertPasswordDialogComponent);
 
-export default inject(({ auth, dialogsStore, uploadDataStore }) => {
+export default inject(({ auth, dialogsStore, uploadDataStore, filesStore }) => {
   const {
     convertPasswordDialogVisible: visible,
     setConvertPasswordDialogVisible,
+    setFormCreationInfo,
+    formCreationInfo,
   } = dialogsStore;
   const { copyAsAction } = uploadDataStore;
 
   const { settingsStore } = auth;
   const { isTabletView } = settingsStore;
 
+  const { formatsStore } = filesStore;
+  const { formfillingDocs } = formatsStore.docserviceStore;
+
+  console.log("convertItem", formCreationInfo);
   return {
     visible,
     setConvertPasswordDialogVisible,
     isTabletView,
+    copyAsAction,
+    formCreationInfo,
+    setFormCreationInfo,
+    formfillingDocs,
   };
 })(observer(ConvertPasswordDialog));

products/ASC.Files/Client/src/store/DialogsStore.js

@@ -23,6 +23,7 @@ class DialogsStore {
   conflictResolveDialogVisible = false;
   convertDialogVisible = false;
   selectFileDialogVisible = false;
+  convertPasswordDialogVisible = false;
 
   removeItem = null;
   connectItem = null;
@@ -34,6 +35,7 @@ class DialogsStore {
   removeMediaItem = null;
   unsubscribe = null;
   convertItem = null;
+  formCreationInfo = null;
 
   constructor(authStore, treeFoldersStore, filesStore, selectedFolderStore) {
     makeAutoObservable(this);
@@ -172,6 +174,15 @@ class DialogsStore {
     this.convertDialogVisible = visible;
   };
 
+  setConvertPasswordDialogVisible = (visible) => {
+    console.log("setConvertPasswordDialogVisible");
+    this.convertPasswordDialogVisible = visible;
+  };
+
+  setFormCreationInfo = (item) => {
+    this.formCreationInfo = item;
+  };
+
   setConvertItem = (item) => {
     this.convertItem = item;
   };

products/ASC.Files/Client/src/store/UploadDataStore.js

@@ -981,10 +981,10 @@ class UploadDataStore {
       });
   };
 
-  copyAsAction = (fileId, title, folderId, enableExternalExt) => {
+  copyAsAction = (fileId, title, folderId, enableExternalExt, password) => {
     const { fetchFiles, filter } = this.filesStore;
 
-    return fileCopyAs(fileId, title, folderId, enableExternalExt)
+    return fileCopyAs(fileId, title, folderId, enableExternalExt, password)
       .then(() => {
         fetchFiles(folderId, filter, true, true);
       })