Web: Settings: Backup: Added third party storage component.
This commit is contained in:
parent
2ecf3c8f9f
commit
6aca6e9944
@ -250,3 +250,11 @@ export function getCommonThirdPartyList() {
|
||||
};
|
||||
return request(options);
|
||||
}
|
||||
|
||||
export function getBackupStorage() {
|
||||
const options = {
|
||||
method: "get",
|
||||
url: "/settings/storage/backup",
|
||||
};
|
||||
return request(options);
|
||||
}
|
||||
|
@ -7,13 +7,12 @@ import Button from "@appserver/components/button";
|
||||
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 ThirdPartyModule from "./sub-components/thirdPartyModule";
|
||||
import DocumentsModule from "./sub-components/documentsModule";
|
||||
import ThirdPartyStorageModule from "./sub-components/thirdPartyStorageModule";
|
||||
|
||||
const StyledComponent = styled.div`
|
||||
${commonSettingsStyles}
|
||||
@ -223,38 +222,7 @@ class ManualBackup extends React.Component {
|
||||
setInterval={this.setInterval}
|
||||
/>
|
||||
|
||||
<div className="category-item-wrapper temporary-storage">
|
||||
<div className="category-item-heading">
|
||||
<Text className="inherit-title-link header">
|
||||
{t("ThirdPartyStorage")}
|
||||
</Text>
|
||||
</div>
|
||||
<Text className="category-item-description">
|
||||
{t("ThirdPartyStorageDescription")}
|
||||
</Text>
|
||||
<Text className="category-item-description note_description">
|
||||
{t("ThirdPartyStorageNoteDescription")}
|
||||
</Text>
|
||||
|
||||
{/* <div className="backup-include_mail">
|
||||
<Checkbox
|
||||
name={"backupMailThirdPartyStorage"}
|
||||
isChecked={backupMailThirdPartyStorage}
|
||||
label={t("IncludeMail")}
|
||||
onChange={this.onClickCheckbox}
|
||||
/>
|
||||
</div> */}
|
||||
<div className="manual-backup_buttons">
|
||||
<Button
|
||||
label={t("MakeCopy")}
|
||||
onClick={() => console.log("click")}
|
||||
primary
|
||||
isDisabled={!maxProgress}
|
||||
size="medium"
|
||||
tabIndex={10}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<ThirdPartyStorageModule maxProgress={maxProgress} />
|
||||
</StyledComponent>
|
||||
);
|
||||
}
|
||||
|
@ -0,0 +1,129 @@
|
||||
import React from "react";
|
||||
import { withTranslation } from "react-i18next";
|
||||
|
||||
import Button from "@appserver/components/button";
|
||||
import Text from "@appserver/components/text";
|
||||
|
||||
import { inject, observer } from "mobx-react";
|
||||
import Box from "@appserver/components/box";
|
||||
import Link from "@appserver/components/link";
|
||||
import ComboBox from "@appserver/components/combobox";
|
||||
import { getBackupStorage } from "@appserver/common/api/settings";
|
||||
|
||||
class ThirdPartyStorageModule extends React.PureComponent {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
availableOptions: [],
|
||||
availableStorage: [],
|
||||
selectedOption: "",
|
||||
isLoading: false,
|
||||
};
|
||||
}
|
||||
componentDidMount() {
|
||||
this.setState(
|
||||
{
|
||||
isLoading: true,
|
||||
},
|
||||
function () {
|
||||
getBackupStorage()
|
||||
.then((storageBackup) => this.getOptions(storageBackup))
|
||||
.finally(() => this.setState({ isLoading: false }));
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
getOptions = (storageBackup) => {
|
||||
let options = [];
|
||||
let availableStorage = [];
|
||||
//debugger;
|
||||
for (let item = 0; item < storageBackup.length; item++) {
|
||||
let obj = {
|
||||
[storageBackup[item].title]: storageBackup[item].isSet,
|
||||
};
|
||||
let titleObj = {
|
||||
key: item,
|
||||
label: storageBackup[item].title,
|
||||
disabled: false,
|
||||
};
|
||||
options.push(titleObj);
|
||||
availableStorage.push(obj);
|
||||
if (storageBackup[item].id === "GoogleCloud") {
|
||||
this.setState({
|
||||
selectedOption: storageBackup[item].title,
|
||||
});
|
||||
}
|
||||
}
|
||||
this.setState({
|
||||
availableOptions: options,
|
||||
availableStorage: availableStorage,
|
||||
});
|
||||
};
|
||||
|
||||
render() {
|
||||
const { maxProgress, t, helpUrlCreatingBackup, storageBackup } = this.props;
|
||||
const {
|
||||
availableOptions,
|
||||
availableStorage,
|
||||
selectedOption,
|
||||
isLoading,
|
||||
} = this.state;
|
||||
console.log("availableOptions", availableOptions);
|
||||
console.log("availableStorage", availableStorage);
|
||||
return isLoading ? (
|
||||
<></>
|
||||
) : (
|
||||
<div className="category-item-wrapper temporary-storage">
|
||||
<div className="category-item-heading">
|
||||
<Text className="inherit-title-link header">
|
||||
{t("ThirdPartyStorage")}
|
||||
</Text>
|
||||
</div>
|
||||
<Text className="category-item-description">
|
||||
{t("ThirdPartyStorageDescription")}
|
||||
</Text>
|
||||
<Text className="category-item-description note_description">
|
||||
{t("ThirdPartyStorageNoteDescription")}
|
||||
</Text>
|
||||
<ComboBox
|
||||
options={availableOptions}
|
||||
selectedOption={{ key: 0, label: selectedOption }}
|
||||
onSelect={() => ""}
|
||||
isDisabled={false}
|
||||
noBorder={false}
|
||||
scaled={true}
|
||||
scaledOptions={true}
|
||||
dropDownMaxHeight={300}
|
||||
className="team-template_text-input"
|
||||
/>
|
||||
<Box marginProp="16px 0 16px 0">
|
||||
<Link
|
||||
color="#316DAA"
|
||||
target="_blank"
|
||||
isHovered={true}
|
||||
href={helpUrlCreatingBackup}
|
||||
>
|
||||
{t("LearnMore")}
|
||||
</Link>
|
||||
</Box>
|
||||
<div className="manual-backup_buttons">
|
||||
<Button
|
||||
label={t("MakeCopy")}
|
||||
onClick={() => console.log("click")}
|
||||
primary
|
||||
isDisabled={!maxProgress}
|
||||
size="medium"
|
||||
tabIndex={10}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
export default inject(({ auth }) => {
|
||||
const { helpUrlCreatingBackup } = auth.settingsStore;
|
||||
|
||||
return {
|
||||
helpUrlCreatingBackup,
|
||||
};
|
||||
})(withTranslation("Settings")(observer(ThirdPartyStorageModule)));
|
Loading…
Reference in New Issue
Block a user