Web: Refactoring & optimization.
This commit is contained in:
parent
d3eac61e1e
commit
a9a13d1346
@ -99,3 +99,46 @@ export function deleteBackupSchedule() {
|
||||
};
|
||||
return request(options);
|
||||
}
|
||||
|
||||
export function getBackupSchedule() {
|
||||
const options = {
|
||||
method: "get",
|
||||
url: "/portal/getbackupschedule",
|
||||
};
|
||||
return request(options);
|
||||
}
|
||||
|
||||
export function createBackupSchedule(
|
||||
storageType,
|
||||
key = null,
|
||||
value = null,
|
||||
backupsStored,
|
||||
Period,
|
||||
Hour,
|
||||
Day,
|
||||
backupMail = false
|
||||
) {
|
||||
const storageParams = [
|
||||
{
|
||||
key,
|
||||
value,
|
||||
},
|
||||
];
|
||||
const cronParams = {
|
||||
Period: Period,
|
||||
Hour: Hour,
|
||||
Day: Day,
|
||||
};
|
||||
const options = {
|
||||
method: "post",
|
||||
url: "/portal/createbackupschedule",
|
||||
data: {
|
||||
storageType,
|
||||
storageParams: storageParams,
|
||||
backupsStored,
|
||||
cronParams: cronParams,
|
||||
backupMail,
|
||||
},
|
||||
};
|
||||
return request(options);
|
||||
}
|
||||
|
||||
@ -5,56 +5,68 @@ import IconButton from "../icon-button";
|
||||
import TextInput from "../text-input";
|
||||
import StyledFileInput from "../file-input/styled-file-input";
|
||||
|
||||
import { inject, observer } from "mobx-react";
|
||||
|
||||
let path = "";
|
||||
|
||||
class FileInputWithFolderPath extends Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
|
||||
this.inputRef = React.createRef();
|
||||
this.state = {
|
||||
fullFolderPath: "",
|
||||
iconSize: 0,
|
||||
thirdParty: "",
|
||||
selectedInput: "",
|
||||
};
|
||||
}
|
||||
|
||||
componentDidUpdate(prevProps) {
|
||||
const { folderPath } = this.props;
|
||||
if (folderPath !== prevProps.folderPath) {
|
||||
this.getTitlesFolders();
|
||||
}
|
||||
// componentDidUpdate(prevProps) {
|
||||
// const { folderPath, selectedInput } = this.props;
|
||||
// if (folderPath !== prevProps.folderPath) {
|
||||
// //this.getTitlesFolders();
|
||||
// }
|
||||
// }
|
||||
|
||||
// getTitlesFolders = () => {
|
||||
// const { folderPath, selectedInput } = this.props;
|
||||
// //debugger;
|
||||
// console.log("selectedInput", selectedInput);
|
||||
|
||||
// path = "";
|
||||
// if (folderPath.length > 1) {
|
||||
// for (let item of folderPath) {
|
||||
// if (!path) {
|
||||
// path = path + `${item.title}`;
|
||||
// } else path = path + " " + "/" + " " + `${item.title}`;
|
||||
// }
|
||||
// this.setState({
|
||||
// //fullFolderPath: path,
|
||||
// [selectedInput]: path,
|
||||
// });
|
||||
// } else {
|
||||
// for (let item of folderPath) {
|
||||
// path = `${item.title}`;
|
||||
// }
|
||||
// this.setState({
|
||||
// //fullFolderPath: path,
|
||||
// });
|
||||
// }
|
||||
// };
|
||||
|
||||
handleOptionChange(e) {
|
||||
console.log("e.target.value", e.target.name);
|
||||
//console.log("this.inputRef.current", this.inputRef.current);
|
||||
const { curRef } = this.props;
|
||||
this.setState({
|
||||
//fullFolderPath: path,
|
||||
//[e.target.name]: "HELLO",
|
||||
selectedInput: this.inputRef.current,
|
||||
});
|
||||
}
|
||||
|
||||
getTitlesFolders = () => {
|
||||
const { folderPath } = this.props;
|
||||
path = "";
|
||||
if (folderPath.length > 1) {
|
||||
for (let item of folderPath) {
|
||||
if (!path) {
|
||||
path = path + `${item.title}`;
|
||||
} else path = path + " " + "/" + " " + `${item.title}`;
|
||||
}
|
||||
this.setState({
|
||||
fullFolderPath: path,
|
||||
});
|
||||
} else {
|
||||
for (let item of folderPath) {
|
||||
path = `${item.title}`;
|
||||
}
|
||||
this.setState({
|
||||
fullFolderPath: path,
|
||||
});
|
||||
}
|
||||
onChange = () => {
|
||||
console.log("on change!!!!");
|
||||
};
|
||||
|
||||
onClickInput = () => {
|
||||
const { setPanelVisible } = this.props;
|
||||
setPanelVisible(true);
|
||||
};
|
||||
|
||||
render() {
|
||||
const { fullFolderPath } = this.state;
|
||||
const { fullFolderPath, selectedInput } = this.state;
|
||||
const {
|
||||
folderPath,
|
||||
onClick,
|
||||
@ -66,6 +78,10 @@ class FileInputWithFolderPath extends Component {
|
||||
hasWarning,
|
||||
accept,
|
||||
id,
|
||||
baseFolder,
|
||||
onClickInput,
|
||||
name,
|
||||
onSelect,
|
||||
...rest
|
||||
} = this.props;
|
||||
|
||||
@ -79,19 +95,27 @@ class FileInputWithFolderPath extends Component {
|
||||
{...rest}
|
||||
>
|
||||
<TextInput
|
||||
ref={this.inputRef}
|
||||
id={id}
|
||||
className="text-input"
|
||||
placeholder={placeholder}
|
||||
value={fullFolderPath}
|
||||
value={folderPath || baseFolder}
|
||||
size={size}
|
||||
isDisabled={isDisabled}
|
||||
hasError={hasError}
|
||||
hasWarning={hasWarning}
|
||||
scale={scale}
|
||||
onClick={this.onClickInput}
|
||||
//onClick={onClickInput}
|
||||
onClick={(e) => {
|
||||
this.handleOptionChange(e);
|
||||
onClickInput && onClickInput(e);
|
||||
}}
|
||||
isReadOnly
|
||||
name={name}
|
||||
onChange={this.onChange}
|
||||
/>
|
||||
|
||||
<div className="icon" onClick={!isDisabled ? this.onClickInput : null}>
|
||||
<div className="icon" onClick={!isDisabled ? onClickInput : null}>
|
||||
<IconButton
|
||||
className="icon-button"
|
||||
iconName={"/static/images/catalog.folder.react.svg"}
|
||||
@ -135,14 +159,8 @@ FileInputWithFolderPath.defaultProps = {
|
||||
hasWarning: false,
|
||||
hasError: false,
|
||||
isDisabled: false,
|
||||
baseFolder: "",
|
||||
accept: "",
|
||||
};
|
||||
|
||||
export default inject(({ auth }) => {
|
||||
const { setPanelVisible } = auth;
|
||||
const { folderPath } = auth.settingsStore;
|
||||
return {
|
||||
folderPath,
|
||||
setPanelVisible,
|
||||
};
|
||||
})(observer(FileInputWithFolderPath));
|
||||
export default FileInputWithFolderPath;
|
||||
|
||||
@ -262,6 +262,7 @@ class TreeFolders extends React.Component {
|
||||
};
|
||||
|
||||
getCommonItems = (data) => {
|
||||
//debugger;
|
||||
return data.map((item) => {
|
||||
const dragging = this.props.dragging ? this.showDragItems(item) : false;
|
||||
|
||||
@ -272,6 +273,8 @@ class TreeFolders extends React.Component {
|
||||
const serviceFolder = !!item.providerKey;
|
||||
let className = `tree-drag tree-id_${item.id}`;
|
||||
if (dragging) className += " dragging";
|
||||
|
||||
if (provider) return;
|
||||
if ((item.folders && item.folders.length > 0) || serviceFolder) {
|
||||
return !provider ? (
|
||||
<TreeNode
|
||||
@ -506,7 +509,7 @@ class TreeFolders extends React.Component {
|
||||
data,
|
||||
isCommonWithoutProvider,
|
||||
} = this.props;
|
||||
|
||||
//debugger;
|
||||
return (
|
||||
<StyledTreeMenu
|
||||
className="files-tree-menu"
|
||||
|
||||
@ -1,90 +1,171 @@
|
||||
import React, { useEffect } from "react";
|
||||
import React from "react";
|
||||
import { Provider as MobxProvider } from "mobx-react";
|
||||
import { inject, observer } from "mobx-react";
|
||||
import { getShareFiles } from "@appserver/common/api/files";
|
||||
import OperationsPanel from "../OperationsPanel";
|
||||
import { getFolderPath } from "@appserver/common/api/files";
|
||||
import TreeFolders from "../../Article/Body/TreeFolders";
|
||||
import stores from "../../../store/index";
|
||||
import store from "studio/store";
|
||||
import ModalDialog from "@appserver/components/modal-dialog";
|
||||
import { StyledAsidePanel } from "../StyledPanels";
|
||||
import { useTranslation, withTranslation } from "react-i18next";
|
||||
import FileInputWithFolderPath from "@appserver/components/file-input-with-folder-path";
|
||||
|
||||
const { auth: authStore } = store;
|
||||
|
||||
const OperationsDialog = ({
|
||||
commonFolder,
|
||||
operationsFolders,
|
||||
treeFolders,
|
||||
fetchTreeFolders,
|
||||
expandedKeys,
|
||||
filter,
|
||||
commonTreeFolder,
|
||||
getCommonFolder,
|
||||
setPanelVisible,
|
||||
getFolderPath,
|
||||
onSelectFolder,
|
||||
}) => {
|
||||
useEffect(() => {
|
||||
fetchTreeFolders().then(() => getCommonFolder());
|
||||
}, []);
|
||||
let path = "";
|
||||
class OperationsDialog extends React.PureComponent {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.inputRef = React.createRef();
|
||||
this.state = {
|
||||
isLoading: false,
|
||||
selectedInput: "",
|
||||
fullFolderPath: "",
|
||||
thirdParty: "",
|
||||
common: "",
|
||||
};
|
||||
}
|
||||
componentDidMount() {
|
||||
const { fetchTreeFolders, getCommonFolder } = this.props;
|
||||
this.setState({ isLoading: true }, function () {
|
||||
fetchTreeFolders()
|
||||
.then(() => getCommonFolder())
|
||||
.finally(() => this.setState({ isLoading: false }));
|
||||
});
|
||||
}
|
||||
|
||||
const { t } = useTranslation("OperationsPanel");
|
||||
componentDidUpdate(prevProps) {
|
||||
const { commonTreeFolder, onSelectFolder } = this.props;
|
||||
|
||||
if (commonTreeFolder.length !== prevProps.commonTreeFolder.length) {
|
||||
onSelectFolder(commonTreeFolder.id);
|
||||
}
|
||||
}
|
||||
|
||||
// onClose = () => {
|
||||
// const { setPanelVisible } = this.props;
|
||||
// setPanelVisible(false);
|
||||
// };
|
||||
onSelect = (folder, treeNode) => {
|
||||
const { onSelectFolder, onClose } = this.props;
|
||||
|
||||
getFolderPath(folder).then((res) =>
|
||||
this.setState(
|
||||
{
|
||||
selectedInput: this.inputRef.current.props.name,
|
||||
},
|
||||
function () {
|
||||
this.getTitlesFolders(res);
|
||||
}
|
||||
)
|
||||
);
|
||||
|
||||
const visible = true;
|
||||
const zIndex = 310;
|
||||
const onClose = () => {
|
||||
setPanelVisible(false);
|
||||
};
|
||||
const onSelect = (folder, treeNode) => {
|
||||
//debugger;
|
||||
console.log("folder", folder);
|
||||
getFolderPath(folder);
|
||||
onSelectFolder(folder);
|
||||
// if (currentFolderId === destFolderId) {
|
||||
// return onClose();
|
||||
// }
|
||||
|
||||
onClose();
|
||||
};
|
||||
getTitlesFolders = (folderPath) => {
|
||||
const { selectedInput } = this.state;
|
||||
//debugger;
|
||||
//console.log("selectedInput", selectedInput);
|
||||
|
||||
return (
|
||||
<>
|
||||
<StyledAsidePanel visible={visible}>
|
||||
<ModalDialog
|
||||
visible={visible}
|
||||
displayType="aside"
|
||||
zIndex={zIndex}
|
||||
onClose={onClose}
|
||||
>
|
||||
<ModalDialog.Header>{t("ChooseFolder")}</ModalDialog.Header>
|
||||
<ModalDialog.Body>
|
||||
{commonTreeFolder && (
|
||||
<TreeFolders
|
||||
expandedPanelKeys={expandedKeys}
|
||||
data={[commonTreeFolder]}
|
||||
filter={filter}
|
||||
onSelect={onSelect}
|
||||
needUpdate={false}
|
||||
isCommonWithoutProvider
|
||||
/>
|
||||
)}
|
||||
</ModalDialog.Body>
|
||||
</ModalDialog>
|
||||
</StyledAsidePanel>
|
||||
</>
|
||||
);
|
||||
//debugger;
|
||||
path = "";
|
||||
if (folderPath.length > 1) {
|
||||
for (let item of folderPath) {
|
||||
if (!path) {
|
||||
path = path + `${item.title}`;
|
||||
} else path = path + " " + "/" + " " + `${item.title}`;
|
||||
}
|
||||
this.setState({
|
||||
//fullFolderPath: path,
|
||||
[selectedInput]: path,
|
||||
});
|
||||
} else {
|
||||
for (let item of folderPath) {
|
||||
path = `${item.title}`;
|
||||
}
|
||||
this.setState({
|
||||
//fullFolderPath: path,
|
||||
[selectedInput]: path,
|
||||
});
|
||||
}
|
||||
};
|
||||
// onClickInput = (e) => {
|
||||
// const { setPanelVisible } = this.props;
|
||||
// setPanelVisible(true);
|
||||
// };
|
||||
|
||||
render() {
|
||||
const {
|
||||
expandedKeys,
|
||||
filter,
|
||||
commonTreeFolder,
|
||||
|
||||
t,
|
||||
name,
|
||||
onClickInput,
|
||||
isPanelVisible,
|
||||
folderList,
|
||||
isCommonWithoutProvider,
|
||||
onClose,
|
||||
} = this.props;
|
||||
const { isLoading, selectedInput } = this.state;
|
||||
const zIndex = 310;
|
||||
// console.log("selectedInput ", selectedInput);
|
||||
|
||||
return (
|
||||
<>
|
||||
<FileInputWithFolderPath
|
||||
name={name}
|
||||
id={name}
|
||||
scale
|
||||
className="folder_path"
|
||||
baseFolder={commonTreeFolder.title}
|
||||
isDisabled={isLoading}
|
||||
folderPath={this.state[selectedInput]}
|
||||
onClickInput={onClickInput}
|
||||
ref={this.inputRef}
|
||||
selectedInput={selectedInput}
|
||||
/>
|
||||
|
||||
{!isLoading && commonTreeFolder.length !== 0 && isPanelVisible && (
|
||||
<StyledAsidePanel visible={isPanelVisible}>
|
||||
<ModalDialog
|
||||
visible={isPanelVisible}
|
||||
displayType="aside"
|
||||
zIndex={zIndex}
|
||||
onClose={onClose}
|
||||
>
|
||||
<ModalDialog.Header>{t("ChooseFolder")}</ModalDialog.Header>
|
||||
<ModalDialog.Body>
|
||||
<TreeFolders
|
||||
expandedPanelKeys={expandedKeys}
|
||||
data={folderList ? folderList : [commonTreeFolder]}
|
||||
filter={filter}
|
||||
onSelect={this.onSelect}
|
||||
needUpdate={false}
|
||||
isCommonWithoutProvider={isCommonWithoutProvider}
|
||||
/>
|
||||
</ModalDialog.Body>
|
||||
</ModalDialog>
|
||||
</StyledAsidePanel>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
OperationsDialog.defaultProps = {
|
||||
isCommonWithoutProvider: false,
|
||||
folderList: "",
|
||||
};
|
||||
|
||||
const OperationsDialogWrapper = inject(
|
||||
({ auth, filesStore, treeFoldersStore, selectedFolderStore }) => {
|
||||
const { filter } = filesStore;
|
||||
const { setPanelVisible } = auth;
|
||||
const { getFolderPath } = auth.settingsStore;
|
||||
const { setPanelVisible, panelVisible } = auth;
|
||||
const { getFolderPath, folderPath } = auth.settingsStore;
|
||||
const {
|
||||
commonFolder,
|
||||
operationsFolders,
|
||||
treeFolders,
|
||||
fetchTreeFolders,
|
||||
expandedPanelKeys,
|
||||
commonTreeFolder,
|
||||
@ -98,23 +179,17 @@ const OperationsDialogWrapper = inject(
|
||||
: selectedFolderStore.pathParts,
|
||||
filter,
|
||||
|
||||
commonFolder,
|
||||
operationsFolders,
|
||||
treeFolders,
|
||||
fetchTreeFolders,
|
||||
commonTreeFolder,
|
||||
getCommonFolder,
|
||||
panelVisible,
|
||||
|
||||
folderPath,
|
||||
};
|
||||
}
|
||||
)(observer(withTranslation("OperationsPanel")(OperationsDialog)));
|
||||
|
||||
class OperationsModal extends React.Component {
|
||||
static getSharingSettings = (fileId) => {
|
||||
return getShareFiles([+fileId], []).then((users) =>
|
||||
SharingPanel.convertSharingUsers(users)
|
||||
);
|
||||
};
|
||||
|
||||
render() {
|
||||
return (
|
||||
<MobxProvider auth={authStore} {...stores}>
|
||||
|
||||
@ -152,18 +152,6 @@ class TreeFoldersStore {
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
// get commonFolder() {
|
||||
// if (this.isPrivacyFolder) {
|
||||
// return this.treeFolders.filter(
|
||||
// (folder) => folder.rootFolderType === FolderType.Privacy && folder
|
||||
// );
|
||||
// } else {
|
||||
// return this.treeFolders.filter(
|
||||
// (folder) => folder.rootFolderType === FolderType.COMMON
|
||||
// );
|
||||
// }
|
||||
// }
|
||||
}
|
||||
|
||||
export default TreeFoldersStore;
|
||||
|
||||
@ -8,11 +8,12 @@ import Checkbox from "@appserver/components/checkbox";
|
||||
import { inject, observer } from "mobx-react";
|
||||
|
||||
import FileInputWithFolderPath from "@appserver/components/file-input-with-folder-path";
|
||||
|
||||
import ThirdPartyModule from "./sub-components/thirdPartyModule";
|
||||
import OperationsDialog from "files/OperationsDialog";
|
||||
import { getBackupProgress, startBackup } from "@appserver/common/api/portal";
|
||||
import toastr from "@appserver/components/toast/toastr";
|
||||
import { toast } from "react-toastify";
|
||||
import DocumentsModule from "./sub-components/documentsModule";
|
||||
|
||||
const StyledComponent = styled.div`
|
||||
${commonSettingsStyles}
|
||||
@ -49,23 +50,36 @@ class ManualBackup extends React.Component {
|
||||
downloadingProgress: 100,
|
||||
link: "",
|
||||
selectedFolder: "",
|
||||
isPanelVisible: false,
|
||||
isLoading: true,
|
||||
};
|
||||
}
|
||||
componentDidMount() {
|
||||
const { getCommonThirdPartyList } = this.props;
|
||||
|
||||
getCommonThirdPartyList()
|
||||
.then(() => getBackupProgress())
|
||||
.then((res) => {
|
||||
if (res) {
|
||||
this.setState({
|
||||
downloadingProgress: res.progress,
|
||||
link: res.link,
|
||||
});
|
||||
if (res.progress !== 100)
|
||||
this.timerId = setInterval(() => this.getProgress(), 1000);
|
||||
}
|
||||
});
|
||||
this.setState(
|
||||
{
|
||||
isLoading: true,
|
||||
},
|
||||
function () {
|
||||
getCommonThirdPartyList()
|
||||
.then(() => getBackupProgress())
|
||||
.then((res) => {
|
||||
if (res) {
|
||||
this.setState({
|
||||
downloadingProgress: res.progress,
|
||||
link: res.link,
|
||||
});
|
||||
if (res.progress !== 100)
|
||||
this.timerId = setInterval(() => this.getProgress(), 1000);
|
||||
}
|
||||
})
|
||||
.finally(() =>
|
||||
this.setState({
|
||||
isLoading: false,
|
||||
})
|
||||
);
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
// onClickCheckbox = (e) => {
|
||||
@ -86,28 +100,37 @@ class ManualBackup extends React.Component {
|
||||
const { downloadingProgress } = this.state;
|
||||
const { t } = this.props;
|
||||
console.log("downloadingProgress", downloadingProgress);
|
||||
getBackupProgress().then((res) => {
|
||||
if (res.error.length > 0 && res.progress !== 100) {
|
||||
clearInterval(this.timerId);
|
||||
toastr.error(`${res.error}`);
|
||||
console.log("error", res.error);
|
||||
getBackupProgress()
|
||||
.then((res) => {
|
||||
if (res.error.length > 0 && res.progress !== 100) {
|
||||
clearInterval(this.timerId);
|
||||
toastr.error(`${res.error}`);
|
||||
console.log("error", res.error);
|
||||
this.setState({
|
||||
downloadingProgress: 100,
|
||||
});
|
||||
return;
|
||||
}
|
||||
this.setState({
|
||||
downloadingProgress: 100,
|
||||
downloadingProgress: res.progress,
|
||||
});
|
||||
return;
|
||||
}
|
||||
this.setState({
|
||||
downloadingProgress: res.progress,
|
||||
});
|
||||
|
||||
if (res.progress === 100) {
|
||||
if (res.progress === 100) {
|
||||
clearInterval(this.timerId);
|
||||
this.setState({
|
||||
link: res.link,
|
||||
});
|
||||
toastr.success(`${t("SuccessCopied")}`);
|
||||
}
|
||||
})
|
||||
.catch(() => {
|
||||
toastr.error();
|
||||
clearInterval(this.timerId);
|
||||
this.setState({
|
||||
link: res.link,
|
||||
});
|
||||
toastr.success(`${t("SuccessCopied")}`);
|
||||
}
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
setInterval = () => {
|
||||
this.timerId = setInterval(() => this.getProgress(), 1000);
|
||||
};
|
||||
|
||||
onClickDownload = () => {
|
||||
@ -117,18 +140,6 @@ class ManualBackup extends React.Component {
|
||||
window.open(downloadUrl, "_blank");
|
||||
};
|
||||
|
||||
onClickCopiedDocModules = () => {
|
||||
const { selectedFolder } = this.state;
|
||||
console.log("selectedFolder", selectedFolder);
|
||||
startBackup("0", "folderId", selectedFolder[0]);
|
||||
this.timerId = setInterval(() => this.getProgress(), 1000);
|
||||
};
|
||||
|
||||
onSelectFolder = (folderId) => {
|
||||
this.setState({
|
||||
selectedFolder: folderId,
|
||||
});
|
||||
};
|
||||
render() {
|
||||
const {
|
||||
t,
|
||||
@ -137,7 +148,7 @@ class ManualBackup extends React.Component {
|
||||
folderPath,
|
||||
commonThirdPartyList,
|
||||
} = this.props;
|
||||
const { downloadingProgress, link } = this.state;
|
||||
const { downloadingProgress, link, isPanelVisible, isLoading } = this.state;
|
||||
const maxProgress = downloadingProgress === 100;
|
||||
// const {
|
||||
// backupMailTemporaryStorage,
|
||||
@ -145,8 +156,11 @@ class ManualBackup extends React.Component {
|
||||
// backupMailThirdParty,
|
||||
// backupMailThirdPartyStorage,
|
||||
// } = this.state;
|
||||
|
||||
return (
|
||||
// console.log("isLoading", isLoading);
|
||||
// console.log("commonThirdPartyList", commonThirdPartyList);
|
||||
return isLoading ? (
|
||||
<></>
|
||||
) : (
|
||||
<StyledComponent>
|
||||
<div className="category-item-wrapper temporary-storage">
|
||||
<div className="category-item-heading">
|
||||
@ -198,81 +212,15 @@ class ManualBackup extends React.Component {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="category-item-wrapper">
|
||||
<div className="category-item-heading">
|
||||
<Text className="inherit-title-link header">
|
||||
{t("DocumentsModule")}
|
||||
</Text>
|
||||
</div>
|
||||
<DocumentsModule
|
||||
maxProgress={maxProgress}
|
||||
setInterval={this.setInterval}
|
||||
/>
|
||||
|
||||
<Text className="category-item-description">
|
||||
{t("DocumentsModuleDescription")}
|
||||
</Text>
|
||||
|
||||
{/* <div className="backup-include_mail">
|
||||
<Checkbox
|
||||
name={"backupMailDocuments"}
|
||||
isChecked={backupMailDocuments}
|
||||
label={t("IncludeMail")}
|
||||
onChange={onClickCheckbox}
|
||||
/>
|
||||
</div> */}
|
||||
|
||||
<FileInputWithFolderPath scale className="backup-folder_path" />
|
||||
{panelVisible && (
|
||||
<OperationsDialog onSelectFolder={this.onSelectFolder} />
|
||||
)}
|
||||
<div className="manual-backup_buttons">
|
||||
<Button
|
||||
label={t("MakeCopy")}
|
||||
onClick={this.onClickCopiedDocModules}
|
||||
primary
|
||||
isDisabled={!maxProgress}
|
||||
size="medium"
|
||||
tabIndex={10}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="category-item-wrapper temporary-storage">
|
||||
<div className="category-item-heading">
|
||||
<Text className="inherit-title-link header">
|
||||
{t("ThirdPartyResource")}
|
||||
</Text>
|
||||
</div>
|
||||
<Text className="category-item-description">
|
||||
{t("ThirdPartyResourceDescription")}
|
||||
</Text>
|
||||
<Text className="category-item-description note_description">
|
||||
{t("ThirdPartyResourceNoteDescription")}
|
||||
</Text>
|
||||
|
||||
{/* <div className="backup-include_mail">
|
||||
<Checkbox
|
||||
name={"backupMailThirdParty"}
|
||||
isChecked={backupMailThirdParty}
|
||||
label={t("IncludeMail")}
|
||||
onChange={this.onClickCheckbox}
|
||||
/>
|
||||
</div> */}
|
||||
<FileInputWithFolderPath
|
||||
scale
|
||||
className="backup-folder_path"
|
||||
isDisabled={commonThirdPartyList.length === 0}
|
||||
/>
|
||||
{panelVisible && (
|
||||
<OperationsDialog onSelectFolder={this.onSelectFolder} />
|
||||
)}
|
||||
<div className="manual-backup_buttons">
|
||||
<Button
|
||||
label={t("MakeCopy")}
|
||||
onClick={() => console.log("click")}
|
||||
primary
|
||||
isDisabled={!maxProgress || commonThirdPartyList.length === 0}
|
||||
size="medium"
|
||||
tabIndex={10}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<ThirdPartyModule
|
||||
maxProgress={maxProgress}
|
||||
commonThirdPartyList={commonThirdPartyList}
|
||||
/>
|
||||
|
||||
<div className="category-item-wrapper temporary-storage">
|
||||
<div className="category-item-heading">
|
||||
|
||||
@ -1,122 +1,67 @@
|
||||
import { useState } from "react";
|
||||
import React from "react";
|
||||
import Text from "@appserver/components/text";
|
||||
import { useTranslation, withTranslation } from "react-i18next";
|
||||
import ComboBox from "@appserver/components/combobox";
|
||||
import styled from "styled-components";
|
||||
import Button from "@appserver/components/button";
|
||||
import Checkbox from "@appserver/components/checkbox";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import OperationsDialog from "files/OperationsDialog";
|
||||
class DocumentsModule extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
const { t } = props;
|
||||
import Button from "@appserver/components/button";
|
||||
import Text from "@appserver/components/text";
|
||||
import { useEffect } from "react";
|
||||
import { startBackup } from "@appserver/common/api/portal";
|
||||
const DocumentsModule = ({ maxProgress, setInterval }) => {
|
||||
const [selectedFolder, setSelectedFolder] = useState("");
|
||||
const [isPanelVisible, setPanelVisible] = useState(false);
|
||||
const { t } = useTranslation("Settings");
|
||||
|
||||
this.periodOptions = [
|
||||
{
|
||||
key: "1",
|
||||
label: t("DailyPeriodSchedule"),
|
||||
},
|
||||
{
|
||||
key: "2",
|
||||
label: t("WeeklyPeriodSchedule"),
|
||||
},
|
||||
{
|
||||
key: "3",
|
||||
label: t("MonthlyPeriodSchedule"),
|
||||
},
|
||||
];
|
||||
const onSelectFolder = (folderId) => {
|
||||
setSelectedFolder(folderId);
|
||||
};
|
||||
|
||||
this.timeOptionsArray = [];
|
||||
for (let item = 0; item < 24; item++) {
|
||||
let obj = {
|
||||
key: item,
|
||||
label: `${item}:00`,
|
||||
};
|
||||
this.timeOptionsArray.push(obj);
|
||||
}
|
||||
}
|
||||
render() {
|
||||
const {
|
||||
t,
|
||||
isManualBackup,
|
||||
backupMailDocuments,
|
||||
onClickCheckbox,
|
||||
onSelect,
|
||||
} = this.props;
|
||||
return (
|
||||
<>
|
||||
<div className="category-item-wrapper">
|
||||
{isManualBackup && (
|
||||
<div className="category-item-heading">
|
||||
<Text className="inherit-title-link header">
|
||||
{t("DocumentsModule")}
|
||||
</Text>
|
||||
</div>
|
||||
)}
|
||||
<Text className="category-item-description">
|
||||
{t("DocumentsModuleDescription")}
|
||||
</Text>
|
||||
const onClickInput = (e) => {
|
||||
setPanelVisible(true);
|
||||
};
|
||||
|
||||
{!isManualBackup && (
|
||||
<>
|
||||
<ComboBox
|
||||
options={this.periodOptions}
|
||||
selectedOption={{
|
||||
key: 0,
|
||||
label: `${t("DailyPeriodSchedule")}`,
|
||||
}}
|
||||
onSelect={onSelect}
|
||||
isDisabled={false}
|
||||
noBorder={false}
|
||||
scaled={false}
|
||||
scaledOptions={false}
|
||||
dropDownMaxHeight={300}
|
||||
size="base"
|
||||
className="backup_combobox"
|
||||
/>
|
||||
<ComboBox
|
||||
options={this.timeOptionsArray}
|
||||
selectedOption={{
|
||||
key: 0,
|
||||
label: `12:00`,
|
||||
}}
|
||||
onSelect={onSelect}
|
||||
isDisabled={false}
|
||||
noBorder={false}
|
||||
scaled={false}
|
||||
scaledOptions={false}
|
||||
dropDownMaxHeight={300}
|
||||
size="base"
|
||||
className="backup_combobox"
|
||||
/>
|
||||
</>
|
||||
)}
|
||||
const onClose = () => {
|
||||
setPanelVisible(false);
|
||||
};
|
||||
|
||||
{/* <div className="backup-include_mail">
|
||||
<Checkbox
|
||||
name={"backupMailDocuments"}
|
||||
isChecked={backupMailDocuments}
|
||||
label={t("IncludeMail")}
|
||||
onChange={onClickCheckbox}
|
||||
/>
|
||||
</div> */}
|
||||
const onClickButton = () => {
|
||||
console.log("selectedFolder", selectedFolder);
|
||||
startBackup("0", "folderId", selectedFolder);
|
||||
setInterval();
|
||||
};
|
||||
//console.log("thirdparty!!! commonThirdPartyList", commonThirdPartyList);
|
||||
return (
|
||||
<div className="category-item-wrapper">
|
||||
<div className="category-item-heading">
|
||||
<Text className="inherit-title-link header">
|
||||
{t("DocumentsModule")}
|
||||
</Text>
|
||||
</div>
|
||||
|
||||
{isManualBackup && (
|
||||
<div className="manual-backup_buttons">
|
||||
<Button
|
||||
label={t("MakeCopy")}
|
||||
onClick={() => console.log("click")}
|
||||
primary
|
||||
isDisabled={false}
|
||||
size="medium"
|
||||
tabIndex={10}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
}
|
||||
<Text className="category-item-description">
|
||||
{t("DocumentsModuleDescription")}
|
||||
</Text>
|
||||
|
||||
export default withTranslation("Settings")(DocumentsModule);
|
||||
<OperationsDialog
|
||||
onSelectFolder={onSelectFolder}
|
||||
name={"common"}
|
||||
onClose={onClose}
|
||||
onClickInput={onClickInput}
|
||||
isPanelVisible={isPanelVisible}
|
||||
isCommonWithoutProvider
|
||||
/>
|
||||
|
||||
<div className="manual-backup_buttons">
|
||||
<Button
|
||||
label={t("MakeCopy")}
|
||||
onClick={onClickButton}
|
||||
primary
|
||||
isDisabled={!maxProgress}
|
||||
size="medium"
|
||||
tabIndex={10}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default DocumentsModule;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user