fixed node selection when switching between TreeSettings and TreeFolders
This commit is contained in:
parent
5a494b3c2c
commit
c584f75c4e
@ -7,7 +7,7 @@ import { history, utils } from "asc-web-common";
|
||||
import { withTranslation, I18nextProvider } from "react-i18next";
|
||||
import { createI18N } from "../../../helpers/i18n";
|
||||
|
||||
import { setSelectedSetting, setExpandSettingsTree } from '../../../store/files/actions';
|
||||
import { setSelectedNode, setExpandSettingsTree } from '../../../store/files/actions';
|
||||
|
||||
const i18n = createI18N({
|
||||
page: "Settings",
|
||||
@ -34,9 +34,9 @@ class PureTreeSettings extends React.Component {
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
const { match, setSelectedSetting, setExpandSettingsTree } = this.props;
|
||||
const { match, setSelectedNode, setExpandSettingsTree } = this.props;
|
||||
const { setting } = match.params;
|
||||
setSelectedSetting([setting]);
|
||||
setSelectedNode([setting]);
|
||||
if (setting)
|
||||
setExpandSettingsTree(['settings']);
|
||||
}
|
||||
@ -53,22 +53,21 @@ class PureTreeSettings extends React.Component {
|
||||
}
|
||||
|
||||
onSelect = (section) => {
|
||||
const { setSelectedSetting, setExpandSettingsTree } = this.props;
|
||||
const { setSelectedNode, setExpandSettingsTree } = this.props;
|
||||
const path = section[0];
|
||||
|
||||
if(path === 'settings') {
|
||||
setSelectedSetting(['common']);
|
||||
setSelectedNode(['common']);
|
||||
setExpandSettingsTree(section);
|
||||
return history.push('/products/files/settings/common');
|
||||
}
|
||||
|
||||
setSelectedSetting(section);
|
||||
setSelectedNode(section);
|
||||
return history.push(`/products/files/settings/${path}`);
|
||||
}
|
||||
|
||||
onExpand = (data) => {
|
||||
const { setExpandSettingsTree, setSelectedSetting } = this.props;
|
||||
setSelectedSetting(['common']);
|
||||
const { setExpandSettingsTree } = this.props;
|
||||
setExpandSettingsTree(data);
|
||||
}
|
||||
|
||||
@ -110,7 +109,7 @@ class PureTreeSettings extends React.Component {
|
||||
|
||||
render() {
|
||||
const {
|
||||
selectedSetting,
|
||||
selectedTreeNode,
|
||||
expandedSetting
|
||||
} = this.props;
|
||||
const nodes = this.renderTreeNode();
|
||||
@ -118,7 +117,7 @@ class PureTreeSettings extends React.Component {
|
||||
return (
|
||||
<StyledTreeMenu
|
||||
expandedKeys={expandedSetting}
|
||||
selectedKeys={selectedSetting}
|
||||
selectedKeys={selectedTreeNode}
|
||||
defaultExpandParent={false}
|
||||
className="settings-tree-menu"
|
||||
switcherIcon={this.switcherIcon}
|
||||
@ -145,17 +144,17 @@ const TreeSettings = props => {
|
||||
|
||||
function mapStateToProps(state) {
|
||||
const {
|
||||
selectedSetting,
|
||||
selectedTreeNode,
|
||||
expandedSetting
|
||||
} = state.files;
|
||||
return {
|
||||
selectedSetting,
|
||||
selectedTreeNode,
|
||||
expandedSetting
|
||||
}
|
||||
}
|
||||
|
||||
export default connect(
|
||||
mapStateToProps, {
|
||||
setSelectedSetting,
|
||||
setSelectedNode,
|
||||
setExpandSettingsTree
|
||||
})(withRouter(TreeSettings));
|
@ -10,7 +10,8 @@ import {
|
||||
setDragItem,
|
||||
setDragging,
|
||||
setNewTreeFilesBadge,
|
||||
setIsLoading
|
||||
setIsLoading,
|
||||
setSelectedNode
|
||||
} from "../../../store/files/actions";
|
||||
import store from "../../../store/store";
|
||||
import isEqual from "lodash/isEqual";
|
||||
@ -55,8 +56,9 @@ class ArticleBodyContent extends React.Component {
|
||||
}
|
||||
|
||||
onSelect = data => {
|
||||
const { selectedKeys, filter, setIsLoading } = this.props;
|
||||
if (selectedKeys[0] !== data[0]) {
|
||||
const { filter, setIsLoading, selectedTreeNode, setSelectedNode } = this.props;
|
||||
if (selectedTreeNode[0] !== data[0]) {
|
||||
setSelectedNode(data)
|
||||
setIsLoading(true);
|
||||
const newFilter = filter.clone();
|
||||
newFilter.page = 0;
|
||||
@ -83,7 +85,6 @@ class ArticleBodyContent extends React.Component {
|
||||
render() {
|
||||
const {
|
||||
data,
|
||||
selectedKeys,
|
||||
filter,
|
||||
setFilter,
|
||||
setTreeFolders,
|
||||
@ -100,6 +101,7 @@ class ArticleBodyContent extends React.Component {
|
||||
isShare,
|
||||
setDragging,
|
||||
onTreeDrop,
|
||||
selectedTreeNode
|
||||
} = this.props;
|
||||
|
||||
const { showNewFilesPanel, expandedKeys, newFolderId } = this.state;
|
||||
@ -121,7 +123,7 @@ class ArticleBodyContent extends React.Component {
|
||||
/>
|
||||
)}
|
||||
<TreeFolders
|
||||
selectedKeys={selectedKeys}
|
||||
selectedKeys={selectedTreeNode}
|
||||
onSelect={this.onSelect}
|
||||
data={data}
|
||||
filter={filter}
|
||||
@ -150,7 +152,7 @@ class ArticleBodyContent extends React.Component {
|
||||
}
|
||||
|
||||
function mapStateToProps(state) {
|
||||
const { treeFolders, selectedFolder, filter, selection, dragging, updateTreeNew, isLoading } = state.files;
|
||||
const { treeFolders, selectedFolder, filter, selection, dragging, updateTreeNew, isLoading, selectedTreeNode } = state.files;
|
||||
const currentFolderId = selectedFolder.id.toString();
|
||||
const myFolderIndex = 0;
|
||||
const shareFolderIndex = 1;
|
||||
@ -172,6 +174,8 @@ function mapStateToProps(state) {
|
||||
selectedFolder.pathParts &&
|
||||
selectedFolder.pathParts[0] === commonId;
|
||||
|
||||
const selected = selectedTreeNode.length>0 ? selectedTreeNode : [ selectedFolder.id.toString() ];
|
||||
|
||||
return {
|
||||
data: treeFolders,
|
||||
selectedKeys: selectedFolder ? [currentFolderId] : [""],
|
||||
@ -186,10 +190,11 @@ function mapStateToProps(state) {
|
||||
selection,
|
||||
dragging,
|
||||
updateTreeNew,
|
||||
isLoading
|
||||
isLoading,
|
||||
selectedTreeNode: selected
|
||||
};
|
||||
}
|
||||
|
||||
export default connect(mapStateToProps, { setFilter, setTreeFolders, setDragItem, setDragging, setNewTreeFilesBadge, setIsLoading })(
|
||||
export default connect(mapStateToProps, { setFilter, setTreeFolders, setDragItem, setDragging, setNewTreeFilesBadge, setIsLoading, setSelectedNode })(
|
||||
ArticleBodyContent
|
||||
);
|
@ -36,6 +36,10 @@ class SectionBodyContent extends React.Component {
|
||||
document.title = t(`${setting}`);
|
||||
}
|
||||
|
||||
componentWillUnmount() {
|
||||
document.title = 'ASC.Files';
|
||||
}
|
||||
|
||||
renderAdminSettings = () => {
|
||||
const {
|
||||
intermediateVersion,
|
||||
|
@ -2,6 +2,7 @@ import React from 'react';
|
||||
import { connect } from 'react-redux';
|
||||
import { withRouter } from "react-router";
|
||||
import { PageLayout, utils } from "asc-web-common";
|
||||
import { RequestLoader } from "asc-web-components";
|
||||
import {
|
||||
ArticleHeaderContent,
|
||||
ArticleBodyContent,
|
||||
@ -52,9 +53,18 @@ class PureSettings extends React.Component {
|
||||
} = this.state;
|
||||
const { match, t, isLoading, setIsLoading } = this.props;
|
||||
const { setting } = match.params;
|
||||
console.log(setting)
|
||||
|
||||
return (
|
||||
<>
|
||||
<RequestLoader
|
||||
visible={isLoading}
|
||||
zIndex={256}
|
||||
loaderSize="16px"
|
||||
loaderColor={"#999"}
|
||||
label={`${t("LoadingProcessing")} ${t("LoadingDescription")}`}
|
||||
fontSize="12px"
|
||||
fontColor={"#999"}
|
||||
/>
|
||||
<PageLayout>
|
||||
<PageLayout.ArticleHeader>
|
||||
<ArticleHeaderContent />
|
||||
@ -95,6 +105,7 @@ class PureSettings extends React.Component {
|
||||
/>
|
||||
</PageLayout.SectionBody>
|
||||
</PageLayout>
|
||||
</>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
@ -19,5 +19,8 @@
|
||||
|
||||
"storingFileVersion": "Storing file versions",
|
||||
"updateOrCreate": "Update the file version for the existing file with the same name. Otherwise, a copy of the file will be created.",
|
||||
"keepIntermediateVersion": "Keep intermediate versions when editing"
|
||||
"keepIntermediateVersion": "Keep intermediate versions when editing",
|
||||
|
||||
"LoadingProcessing": "Loading...",
|
||||
"LoadingDescription": "Please wait..."
|
||||
}
|
@ -19,5 +19,8 @@
|
||||
|
||||
"storingFileVersion": "Хранение версий файлов",
|
||||
"updateOrCreate": "Обновлять версию файла для существующего файла с таким же именем. В противном случае будет создаваться копия файла.",
|
||||
"keepIntermediateVersion": "Хранить промежуточные версии при редактировании"
|
||||
"keepIntermediateVersion": "Хранить промежуточные версии при редактировании",
|
||||
|
||||
"LoadingProcessing": "Загрузка...",
|
||||
"LoadingDescription": "Пожалуйста, подождите..."
|
||||
}
|
@ -39,7 +39,7 @@ export const SET_VIEW_AS = "SET_VIEW_AS";
|
||||
export const SET_CONVERT_DIALOG_VISIBLE = "SET_CONVERT_DIALOG_VISIBLE";
|
||||
export const SET_NEW_TREE_FILES = "SET_NEW_TREE_FILES";
|
||||
export const SET_NEW_ROW_ITEMS = "SET_NEW_ROW_ITEMS";
|
||||
export const SET_SELECTED_SETTING = "SET_SELECTED_SETTING";
|
||||
export const SET_SELECTED_NODE = "SET_SELECTED_NODE";
|
||||
export const SET_EXPAND_SETTINGS_TREE = "SET_EXPAND_SETTINGS_TREE";
|
||||
export const SET_IS_LOADING = "SET_IS_LOADING";
|
||||
|
||||
@ -190,10 +190,10 @@ export function setNewRowItems(newRowItems) {
|
||||
};
|
||||
}
|
||||
|
||||
export function setSelectedSetting(setting) {
|
||||
export function setSelectedNode(node) {
|
||||
return {
|
||||
type: SET_SELECTED_SETTING,
|
||||
setting
|
||||
type: SET_SELECTED_NODE,
|
||||
node
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -20,7 +20,7 @@ import {
|
||||
SET_CONVERT_DIALOG_VISIBLE,
|
||||
SET_NEW_TREE_FILES,
|
||||
SET_NEW_ROW_ITEMS,
|
||||
SET_SELECTED_SETTING,
|
||||
SET_SELECTED_NODE,
|
||||
SET_EXPAND_SETTINGS_TREE,
|
||||
SET_IS_LOADING
|
||||
} from "./actions";
|
||||
@ -47,7 +47,7 @@ const initialState = {
|
||||
convertDialogVisible: false,
|
||||
updateTreeNew: false,
|
||||
newRowItems: [],
|
||||
selectedSetting: [],
|
||||
selectedTreeNode: [],
|
||||
expandedSetting: [],
|
||||
isLoading: false
|
||||
};
|
||||
@ -147,10 +147,14 @@ const filesReducer = (state = initialState, action) => {
|
||||
return Object.assign({}, state, {
|
||||
newRowItems: action.newRowItems
|
||||
});
|
||||
case SET_SELECTED_SETTING:
|
||||
return Object.assign({}, state, {
|
||||
selectedSetting: action.setting
|
||||
})
|
||||
case SET_SELECTED_NODE:
|
||||
if ( action.node[0] ) {
|
||||
return Object.assign({}, state, {
|
||||
selectedTreeNode: action.node
|
||||
})
|
||||
} else {
|
||||
return state;
|
||||
}
|
||||
case SET_EXPAND_SETTINGS_TREE:
|
||||
return Object.assign({}, state, {
|
||||
expandedSetting: action.setting
|
||||
|
Loading…
Reference in New Issue
Block a user