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

Web: Client: Settings: Updated section header, refactoring

Browse Source
This commit is contained in:
Alexey 2020-07-23 18:56:57 +03:00
parent e067346d2c
commit b35af29ec8
6 changed files with 54 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
web/ASC.Web.Client/src/components/pages/Settings/Layout/Article/Body/index.js
View File

@ -33,7 +33,6 @@ const StyledTreeMenu = styled(TreeMenu)`
const getTreeItems = (data, path, t) => {
return data.map(item => {
if (item.children && item.children.length && !item.isCategory) {
const link = path + getSelectedLinkByKey(item.key, settingsTree);
return (
<TreeNode
title={<Text className='inherit-title-link header'>{t(item.tKey)}</Text>}
@ -113,7 +112,7 @@ class ArticleBodyContent extends React.Component {
if (utils.array.isArrayEqual(value, selectedKeys)) {
return;
}
this.setState({ selectedKeys: value });
};

44
web/ASC.Web.Client/src/components/pages/Settings/Layout/Section/Header/index.js
View File

@ -4,7 +4,7 @@ import { withRouter } from "react-router";
import { Headline } from 'asc-web-common';
import { IconButton, utils } from "asc-web-components";
import { withTranslation } from 'react-i18next';
import { getKeyByLink, settingsTree, getTKeyByKey } from '../../../utils';
import { getKeyByLink, settingsTree, getTKeyByKey, checkPropertyByLink } from '../../../utils';
const { tablet } = utils.device;
@ -40,13 +40,36 @@ class SectionHeaderContent extends React.Component {
const key = getKeyByLink(arrayOfParams, settingsTree);
const header = getTKeyByKey(key, settingsTree);
const isCategory = checkPropertyByLink(arrayOfParams, settingsTree, "isCategory");
const isHeader = checkPropertyByLink(arrayOfParams, settingsTree, "isHeader");
this.state = {
header
header,
isCategoryOrHeader: isCategory || isHeader,
};
}
componentDidUpdate() {
const arrayOfParams = this.getArrayOfParams()
const key = getKeyByLink(arrayOfParams, settingsTree);
const header = getTKeyByKey(key, settingsTree);
const isCategory = checkPropertyByLink(arrayOfParams,settingsTree, "isCategory");
const isHeader = checkPropertyByLink(arrayOfParams, settingsTree, "isHeader");
const isCategoryOrHeader = isCategory || isHeader;
header !== this.state.header && this.setState({ header });
isCategoryOrHeader !== this.state.isCategoryOrHeader && this.setState({ isCategoryOrHeader });
}
onBackToParent = () => {
let newArrayOfParams = this.getArrayOfParams();
newArrayOfParams.splice(-1, 1);
const newPath = "/settings/" + newArrayOfParams.join("/");
this.props.history.push(newPath);
}
getArrayOfParams = () => {
const { match, location } = this.props;
const fullSettingsUrl = match.url;
const locationPathname = location.pathname;
@ -55,24 +78,17 @@ class SectionHeaderContent extends React.Component {
const fullSettingsUrlLength = fullSettingsUrl.length;
const resultPath = locationPathname.slice(fullSettingsUrlLength + 1);
const arrayOfParams = resultPath.split('/');
const key = getKeyByLink(arrayOfParams, settingsTree);
const header = getTKeyByKey(key, settingsTree);
header !== this.state.header && this.setState({ header });
}
onBackToParent = () => {
console.log("clickToParent")
return arrayOfParams;
}
render() {
const { t } = this.props;
const { header } = this.state;
const { header, isCategoryOrHeader } = this.state;
const arrayOfParams = this.getArrayOfParams();
return (
<HeaderContainer>
{true && (
{!isCategoryOrHeader && arrayOfParams[0] &&(
<IconButton
iconName="ArrowPathIcon"
size="17"

4
web/ASC.Web.Client/src/components/pages/Settings/categories/common/customization.js
View File

@ -167,13 +167,13 @@ class Customization extends React.Component {
onClickLink = (e) => {
e.preventDefault();
const { match, history } = this.props;
const { history } = this.props;
history.push("/settings/common/customization/language-and-time-zone");
}
render() {
const { t, i18n } = this.props;
const { isLoadedData, languages, language, isLoading, timezones, timezone, greetingTitle, isLoadingGreetingSave, isLoadingGreetingRestore, basePath } = this.state;
const { isLoadedData, languages, language, isLoading, timezones, timezone, greetingTitle, isLoadingGreetingSave, isLoadingGreetingRestore } = this.state;
const supportEmail = "documentation@onlyoffice.com";
const tooltipLanguage =
<Text fontSize='13px'>

16
web/ASC.Web.Client/src/components/pages/Settings/utils/checkPropertyByLink.js Normal file
View File

@ -0,0 +1,16 @@
export const checkPropertyByLink = (linkArr, data, property, index = 0) => {
const length = linkArr.length;
const currentElement = linkArr[index];
const item = data.find(item => item.link === currentElement);
if ((index === length - 1 || !item.children) && item) {
return item[property];
}
else if (!item) {
return false;
}
else {
const newIndex = index + 1;
return checkPropertyByLink(linkArr, item.children, property, newIndex);
}
}

3
web/ASC.Web.Client/src/components/pages/Settings/utils/index.js
View File

@ -3,4 +3,5 @@ export { settingsTree } from './settingsTree';
export { getTKeyByKey } from './getTKeyByKey';
export { getSelectedLinkByKey } from './getSelectedLinkByKey';
export { selectKeyOfTreeElement } from './selectKeyOfTreeElement';
export { getCurrentSettingsCategory } from './getCurrentSettingsCategory';
export { getCurrentSettingsCategory } from './getCurrentSettingsCategory';
export { checkPropertyByLink } from './checkPropertyByLink';

3
web/ASC.Web.Client/src/components/pages/Settings/utils/settingsTree.js
View File

@ -7,6 +7,7 @@ export const settingsTree = [
icon: 'SettingsIcon',
link: 'common',
tKey: 'ManagementCategoryCommon',
isHeader: true,
children: [
{
key: '0-0',
@ -37,12 +38,14 @@ export const settingsTree = [
icon: 'SecurityIcon',
link: 'security',
tKey: 'ManagementCategorySecurity',
isHeader: true,
children: [
{
key: '1-0',
icon: '',
link: 'accessrights',
tKey: 'AccessRights',
isCategory: true,
},
]
},