Merge branch 'feature/files' of https://github.com/ONLYOFFICE/CommunityServer-AspNetCore into feature/files
This commit is contained in:
commit
6a241f7f93
@ -6,24 +6,25 @@ import Home from "./components/pages/Home";
|
||||
import DocEditor from "./components/pages/DocEditor";
|
||||
import { history, PrivateRoute, PublicRoute, Login, Error404, StudioLayout, Offline } from "asc-web-common";
|
||||
|
||||
const withStudioLayout = Component => props => <StudioLayout><Component {...props} /></StudioLayout>;
|
||||
|
||||
const App = ({ settings }) => {
|
||||
const { homepage } = settings;
|
||||
|
||||
return (
|
||||
navigator.onLine ?
|
||||
<Router history={history}>
|
||||
<StudioLayout>
|
||||
<Suspense
|
||||
fallback={<Loader className="pageLoader" type="rombs" size='40px' />}
|
||||
>
|
||||
<Switch>
|
||||
<Redirect exact from="/" to={`${homepage}`} />
|
||||
<PrivateRoute exact path={[homepage, `${homepage}/filter`]} component={Home} />
|
||||
<PrivateRoute exact path={[homepage, `${homepage}/filter`]} component={withStudioLayout(Home)} />
|
||||
<PrivateRoute exact path={`${homepage}/doceditor`} component={DocEditor} />
|
||||
<PublicRoute exact path={["/login","/login/error=:error", "/login/confirmed-email=:confirmedEmail"]} component={Login} />
|
||||
<PrivateRoute component={Error404} />
|
||||
<PrivateRoute component={withStudioLayout(Error404)} />
|
||||
</Switch>
|
||||
</Suspense>
|
||||
</StudioLayout>
|
||||
</Router>
|
||||
: <Offline/>
|
||||
);
|
||||
|
@ -11,6 +11,27 @@ class TreeFolders extends React.Component {
|
||||
this.state = { treeData, expandedKeys: props.expandedKeys, loaded: true };
|
||||
}
|
||||
|
||||
getFolderIcon = key => {
|
||||
switch (key) {
|
||||
case "0-0":
|
||||
return <Icons.CatalogUserIcon size="scale" isfill color="#657077" />;
|
||||
|
||||
case "0-1":
|
||||
return <Icons.CatalogSharedIcon size="scale" isfill color="#657077" />;
|
||||
|
||||
case "0-2":
|
||||
return (
|
||||
<Icons.CatalogPortfolioIcon size="scale" isfill color="#657077" />
|
||||
);
|
||||
|
||||
case "0-3":
|
||||
return <Icons.CatalogTrashIcon size="scale" isfill color="#657077" />;
|
||||
|
||||
default:
|
||||
return <Icons.CatalogFolderIcon size="scale" isfill color="#657077" />;
|
||||
}
|
||||
};
|
||||
|
||||
getItems = data => {
|
||||
return data.map(item => {
|
||||
if (item.folders && item.folders.length > 0) {
|
||||
@ -19,9 +40,7 @@ class TreeFolders extends React.Component {
|
||||
id={item.id}
|
||||
key={item.id}
|
||||
title={item.title}
|
||||
icon={
|
||||
<Icons.CatalogFolderIcon size="scale" isfill color="#657077" />
|
||||
}
|
||||
icon={this.getFolderIcon(item.key)}
|
||||
>
|
||||
{this.getItems(item.folders)}
|
||||
</TreeNode>
|
||||
@ -33,7 +52,7 @@ class TreeFolders extends React.Component {
|
||||
key={item.id}
|
||||
title={item.title}
|
||||
isLeaf={item.foldersCount ? false : true}
|
||||
icon={<Icons.CatalogFolderIcon size="scale" isfill color="#657077" />}
|
||||
icon={this.getFolderIcon(item.key)}
|
||||
/>
|
||||
);
|
||||
});
|
||||
@ -147,12 +166,12 @@ class TreeFolders extends React.Component {
|
||||
};
|
||||
|
||||
onExpand = (data, treeNode) => {
|
||||
if(treeNode.node && !treeNode.node.props.children) {
|
||||
if(treeNode.expanded) {
|
||||
if (treeNode.node && !treeNode.node.props.children) {
|
||||
if (treeNode.expanded) {
|
||||
this.onLoadData(treeNode.node);
|
||||
}
|
||||
}
|
||||
if(this.props.needUpdate) {
|
||||
if (this.props.needUpdate) {
|
||||
const newFilter = this.props.filter.clone();
|
||||
newFilter.treeFolders = data;
|
||||
this.props.setFilter(newFilter);
|
||||
@ -163,7 +182,11 @@ class TreeFolders extends React.Component {
|
||||
|
||||
componentDidUpdate(prevProps) {
|
||||
const { expandedKeys, data, needUpdate } = this.props;
|
||||
if (needUpdate && expandedKeys && this.state.expandedKeys.length !== expandedKeys.length) {
|
||||
if (
|
||||
needUpdate &&
|
||||
expandedKeys &&
|
||||
this.state.expandedKeys.length !== expandedKeys.length
|
||||
) {
|
||||
this.setState({ expandedKeys });
|
||||
}
|
||||
|
||||
@ -173,7 +196,13 @@ class TreeFolders extends React.Component {
|
||||
}
|
||||
|
||||
render() {
|
||||
const { selectedKeys, fakeNewDocuments, isLoading, onSelect, needUpdate } = this.props;
|
||||
const {
|
||||
selectedKeys,
|
||||
fakeNewDocuments,
|
||||
isLoading,
|
||||
onSelect,
|
||||
needUpdate
|
||||
} = this.props;
|
||||
const { treeData, expandedKeys, loaded } = this.state;
|
||||
|
||||
const loadProp = loaded && needUpdate ? { loadData: this.onLoadData } : {};
|
||||
|
@ -29,18 +29,21 @@ class PureEditor extends React.Component {
|
||||
|
||||
const urlParams = getObjectByLocation(window.location);
|
||||
const fileId = urlParams.fileId || null;
|
||||
const wrapperStyle = {
|
||||
height: '100vh'
|
||||
}
|
||||
|
||||
files.openEdit(fileId)
|
||||
.then(config => {
|
||||
if (window.innerWidth < 600) {
|
||||
if (window.innerWidth < 720) {
|
||||
config.type = 'mobile';
|
||||
}
|
||||
|
||||
window.DocsAPI.DocEditor("editor", config)
|
||||
window.DocsAPI.DocEditor("editor", config);
|
||||
});
|
||||
|
||||
return (
|
||||
<>
|
||||
<div style={wrapperStyle}>
|
||||
<RequestLoader
|
||||
visible={isLoading}
|
||||
zIndex={256}
|
||||
@ -51,7 +54,7 @@ class PureEditor extends React.Component {
|
||||
fontColor={"#999"}
|
||||
/>
|
||||
<div id="editor"></div>
|
||||
</>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
@ -439,7 +439,7 @@ class SectionHeaderContent extends React.Component {
|
||||
{folder && (
|
||||
<IconButton
|
||||
iconName="ArrowPathIcon"
|
||||
size="16"
|
||||
size="17"
|
||||
color="#A3A9AE"
|
||||
hoverColor="#657077"
|
||||
isFill={true}
|
||||
@ -460,7 +460,7 @@ class SectionHeaderContent extends React.Component {
|
||||
className="add-button"
|
||||
directionX="right"
|
||||
iconName="PlusIcon"
|
||||
size={16}
|
||||
size={17}
|
||||
color="#657077"
|
||||
getData={this.getContextOptionsPlus}
|
||||
isDisabled={false}
|
||||
@ -469,7 +469,7 @@ class SectionHeaderContent extends React.Component {
|
||||
className="option-button"
|
||||
directionX="right"
|
||||
iconName="VerticalDotsIcon"
|
||||
size={16}
|
||||
size={17}
|
||||
color="#A3A9AE"
|
||||
getData={this.getContextOptionsFolder}
|
||||
isDisabled={false}
|
||||
@ -480,7 +480,7 @@ class SectionHeaderContent extends React.Component {
|
||||
className="add-button"
|
||||
directionX="right"
|
||||
iconName="PlusIcon"
|
||||
size={16}
|
||||
size={17}
|
||||
color="#657077"
|
||||
getData={this.getContextOptionsPlus}
|
||||
isDisabled={false}
|
||||
|
@ -410,6 +410,7 @@ class PureHome extends React.Component {
|
||||
err && toastr.error(err);
|
||||
this.onLoading(false);
|
||||
this.setProgressVisible(false, timeout);
|
||||
this.onClose();
|
||||
};
|
||||
|
||||
setNewFilter = () => {
|
||||
|
@ -164,7 +164,7 @@ export function fetchFiles(folderId, filter, dispatch) {
|
||||
dispatch(setFilesFilter(filterData));
|
||||
dispatch(setFolders(data.folders));
|
||||
dispatch(setFiles(data.files));
|
||||
dispatch(setSelected("close"));
|
||||
//dispatch(setSelected("close")); //TODO: need close but it`s crash first select, need new logic
|
||||
return dispatch(setSelectedFolder({ folders: data.folders, ...data.current, pathParts: data.pathParts }));
|
||||
})
|
||||
}
|
||||
|
@ -48,7 +48,7 @@ class SectionHeaderContent extends React.Component {
|
||||
<Wrapper>
|
||||
<IconButton
|
||||
iconName="ArrowPathIcon"
|
||||
size="16"
|
||||
size="17"
|
||||
color="#A3A9AE"
|
||||
hoverColor="#657077"
|
||||
isFill={true}
|
||||
|
@ -400,7 +400,7 @@ const SectionHeaderContent = props => {
|
||||
directionX="right"
|
||||
title={t("Actions")}
|
||||
iconName="VerticalDotsIcon"
|
||||
size={16}
|
||||
size={17}
|
||||
color="#A3A9AE"
|
||||
getData={getContextOptionsGroup}
|
||||
isDisabled={false}
|
||||
@ -423,7 +423,7 @@ const SectionHeaderContent = props => {
|
||||
directionX="right"
|
||||
title={t("Actions")}
|
||||
iconName="PlusIcon"
|
||||
size={16}
|
||||
size={17}
|
||||
color="#657077"
|
||||
getData={getContextOptionsPlus}
|
||||
isDisabled={false}
|
||||
|
@ -37,7 +37,7 @@ const SectionHeaderContent = props => {
|
||||
<IconButton
|
||||
iconName="ArrowPathIcon"
|
||||
color="#A3A9AE"
|
||||
size="16"
|
||||
size="17"
|
||||
hoverColor="#657077"
|
||||
isFill={true}
|
||||
onClick={onClickBack}
|
||||
|
@ -389,7 +389,7 @@ class SectionHeaderContent extends React.PureComponent {
|
||||
<IconButton
|
||||
iconName="ArrowPathIcon"
|
||||
color="#A3A9AE"
|
||||
size="16"
|
||||
size="17"
|
||||
hoverColor="#657077"
|
||||
isFill={true}
|
||||
onClick={this.onClickBack}
|
||||
@ -405,7 +405,7 @@ class SectionHeaderContent extends React.PureComponent {
|
||||
directionX="right"
|
||||
title={t("Actions")}
|
||||
iconName="VerticalDotsIcon"
|
||||
size={16}
|
||||
size={17}
|
||||
color="#A3A9AE"
|
||||
getData={contextOptions}
|
||||
isDisabled={false}
|
||||
|
@ -45,7 +45,7 @@ const SectionHeaderContent = (props) => {
|
||||
<IconButton
|
||||
iconName='ArrowPathIcon'
|
||||
color="#A3A9AE"
|
||||
size="16"
|
||||
size="17"
|
||||
hoverColor="#657077"
|
||||
isFill={true}
|
||||
onClick={onClickBack}
|
||||
|
@ -33,11 +33,11 @@ const SectionHeaderContent = props => {
|
||||
|
||||
return (
|
||||
<Wrapper>
|
||||
<div style={{ width: "16px" }}>
|
||||
<div style={{ width: "17px" }}>
|
||||
<IconButton
|
||||
iconName={"ArrowPathIcon"}
|
||||
color="#A3A9AE"
|
||||
size="16"
|
||||
size="17"
|
||||
hoverColor="#657077"
|
||||
isFill={true}
|
||||
onClick={onClickBack}
|
||||
|
Loading…
Reference in New Issue
Block a user