IlyaSobolev/DocSpace-buildtools
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Web: Files: added download files upload with progress

Browse Source
This commit is contained in:
Nikita Gopienko 2020-05-15 21:02:56 +03:00
parent f97e690773
commit 8c11f5364c
7 changed files with 136 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
products/ASC.Files/Client/src/components/dialogs/DownloadDialog/DownloadContent.js
View File

@ -18,38 +18,10 @@ const DownloadContent = (props) => {
onRowSelect,
getItemIcon,
titleFormat,
getTitleLabel,
type
} = props;
const getTitleLabel = (format) => {
switch (format) {
case 0:
return t("OriginalFormat");
case 1:
return ".txt";
case 2:
return ".docx";
case 3:
return ".odt";
case 4:
return ".ods";
case 5:
return ".odp";
case 6:
return ".pdf";
case 7:
return ".rtf";
case 8:
return ".xlsx";
case 9:
return ".pptx";
case 10:
return t("CustomFormat");
default:
return "";
}
};
const getFormats = item => {
const documentFormats = [

70
products/ASC.Files/Client/src/components/dialogs/DownloadDialog/index.js
View File

@ -14,7 +14,7 @@ import {
import { ReactSVG } from "react-svg";
import { withTranslation } from "react-i18next";
import i18n from "./i18n";
import { utils } from "asc-web-common";
import { utils, api } from "asc-web-common";
import {
getFileIcon,
getFolderIcon,
@ -92,35 +92,84 @@ class DownloadDialogComponent extends React.Component {
};
}
onDownload = () => {
getTitleLabel = (format) => {
switch (format) {
case 0:
return this.props.t("OriginalFormat");
case 1:
return ".txt";
case 2:
return ".docx";
case 3:
return ".odt";
case 4:
return ".ods";
case 5:
return ".odp";
case 6:
return ".pdf";
case 7:
return ".rtf";
case 8:
return ".xlsx";
case 9:
return ".pptx";
case 10:
return this.props.t("CustomFormat");
default:
return "";
}
};
getDownloadItems = () => {
const { documents, spreadsheets, presentations, other } = this.state;
const folderIds = [];
const fileIds = [];
const items = [];
for (let item of documents) {
if (item.checked) {
fileIds.push(item.id);
const format = item.format === 0 ? item.fileExst : this.getTitleLabel(item.format);
items.push({key: item.id, value: format});
}
}
for (let item of spreadsheets) {
if (item.checked) {
fileIds.push(item.id);
const format = item.format === 0 ? item.fileExst : this.getTitleLabel(item.format);
items.push({key: item.id, value: format});
}
}
for (let item of presentations) {
if (item.checked) {
fileIds.push(item.id);
const format = item.format === 0 ? item.fileExst : this.getTitleLabel(item.format);
items.push({key: item.id, value: format});
}
}
for (let item of other) {
if (item.checked) {
folderIds.push(item.id);
if(item.fileExst) {
const format = item.format === 0 ? item.fileExst : this.getTitleLabel(item.format);
items.push({key: item.id, value: format});
} else {
items.push({key: item.id});
}
}
}
toastr.success("onDownload click");
return items;
}
onDownload = () => {
const { startUploadSession, closeUploadSession, onDownloadProgress } = this.props;
const fileConvertIds = this.getDownloadItems();
startUploadSession();
api.files
.downloadFormatFiles(fileConvertIds)
.then(() => onDownloadProgress(false))
.catch(err => closeUploadSession(err));
};
getItemIcon = (item) => {
@ -411,6 +460,7 @@ class DownloadDialogComponent extends React.Component {
onSelectFormat={this.onSelectFormat}
onRowSelect={this.onRowSelect}
getItemIcon={this.getItemIcon}
getTitleLabel={this.getTitleLabel}
titleFormat={documentsTitleFormat}
type="document"
/>
@ -426,6 +476,7 @@ class DownloadDialogComponent extends React.Component {
onSelectFormat={this.onSelectFormat}
onRowSelect={this.onRowSelect}
getItemIcon={this.getItemIcon}
getTitleLabel={this.getTitleLabel}
titleFormat={spreadsheetsTitleFormat}
type="spreadsheet"
/>
@ -441,6 +492,7 @@ class DownloadDialogComponent extends React.Component {
onSelectFormat={this.onSelectFormat}
onRowSelect={this.onRowSelect}
getItemIcon={this.getItemIcon}
getTitleLabel={this.getTitleLabel}
titleFormat={presentationsTitleFormat}
type="presentation"
/>

55
products/ASC.Files/Client/src/components/pages/Home/Section/Header/index.js
View File

@ -1,7 +1,7 @@
import React from "react";
import styled, { css } from "styled-components";
import { withRouter } from "react-router";
import { constants, Headline, store } from "asc-web-common";
import { constants, Headline, store, api } from "asc-web-common";
import { connect } from "react-redux";
import { withTranslation } from "react-i18next";
import {
@ -166,7 +166,55 @@ class SectionHeaderContent extends React.Component {
copyAction = () => toastr.info("copyAction click");
downloadAction = () => toastr.info("downloadAction click");
startUploadSession = () => {
const { onLoading, t, setProgressLabel, setProgressVisible} = this.props;
onLoading(true);
setProgressLabel(t("ArchivingData"));
setProgressVisible(true);
}
closeUploadSession = (err) => {
err && toastr.error(err);
this.props.onLoading(false);
this.props.setProgressVisible(false);
}
loop = url => {
api.files.getProgress().then(res => {
if(!url) {
this.props.setProgressValue(res[0].progress);
setTimeout(() => this.loop(res[0].url), 1000);
} else {
this.closeUploadSession();
return window.open(url, "_blank");
}
}).catch((err) => this.closeUploadSession(err));
}
downloadAction = () => {
const fileIds = [];
const folderIds = [];
const items = [];
for(let item of this.props.selection) {
if(item.fileExst) {
fileIds.push(item.id);
items.push({id: item.id, fileExst: item.fileExst});
} else {
folderIds.push(item.id);
items.push({id: item.id});
}
}
this.startUploadSession();
api.files
.downloadFiles(fileIds, folderIds)
.then(() => {
this.loop(false);
})
.catch((err) => this.closeUploadSession(err));
}
downloadAsAction = () => this.setState({ showDownloadDialog: !this.state.showDownloadDialog });
@ -441,6 +489,9 @@ class SectionHeaderContent extends React.Component {
<DownloadDialog
visible={showDownloadDialog}
onClose={this.downloadAsAction}
startUploadSession={this.startUploadSession}
closeUploadSession={this.closeUploadSession}
onDownloadProgress={this.loop}
/>
)}
</StyledContainer>

4
products/ASC.Files/Client/src/components/pages/Home/index.js
View File

@ -171,7 +171,6 @@ class PureHome extends React.Component {
onLoading={this.onLoading}
setProgressVisible={this.setProgressVisible}
setProgressValue={this.setProgressValue}
setProgressContent={this.setProgressContent}
setProgressLabel={this.setProgressLabel}
/>}
articleBodyContent={<ArticleBodyContent onLoading={this.onLoading} isLoading={isLoading} />}
@ -184,6 +183,9 @@ class PureHome extends React.Component {
onSelect={this.onSectionHeaderContentSelect}
onClose={this.onClose}
onLoading={this.onLoading}
setProgressVisible={this.setProgressVisible}
setProgressValue={this.setProgressValue}
setProgressLabel={this.setProgressLabel}
/>
}
sectionFilterContent={<SectionFilterContent onLoading={this.onLoading} />}

3
products/ASC.Files/Client/src/components/pages/Home/locales/en/translation.json
View File

@ -71,5 +71,6 @@
"Filter": "Filter",
"OverwriteSetting": "Overwrite existing file with the same name",
"UploadOriginalFormatSetting": "Upload the documents in original format as well",
"HideWindowSetting": "Show this window minimized"
"HideWindowSetting": "Show this window minimized",
"ArchivingData": "Archiving data"
}

3
products/ASC.Files/Client/src/components/pages/Home/locales/ru/translation.json
View File

@ -71,5 +71,6 @@
"Filter": "Фильтр",
"OverwriteSetting": "Перезаписывать существующий файл с таким же именем",
"UploadOriginalFormatSetting": "Сохранять также копию файла в исходном формате",
"HideWindowSetting": "Показывать это окно минимизированным"
"HideWindowSetting": "Показывать это окно минимизированным",
"ArchivingData": "Архивирование данных"
}

14
web/ASC.Web.Common/src/api/files/index.js
View File

@ -322,3 +322,17 @@ export function startUploadSession(folderId, fileName, fileSize, relativePath) {
export function uploadFile(url, data) {
return axios.post(url, data);
}
export function downloadFiles(fileIds, folderIds) {
const data = { fileIds, folderIds };
return request({ method: "put", url: "/files/fileops/bulkdownload", data });
}
export function downloadFormatFiles(fileConvertIds) {
const data = { fileConvertIds };
return request({ method: "put", url: "/files/fileops/bulkdownload", data });
}
export function getProgress() {
return request({ method: "get", url: "/files/fileops" });
}