diff --git a/products/ASC.People/Client/src/components/pages/AvatarEditor/Section/Body/index.js b/products/ASC.People/Client/src/components/pages/AvatarEditor/Section/Body/index.js
index e2190067a0..65289169a2 100644
--- a/products/ASC.People/Client/src/components/pages/AvatarEditor/Section/Body/index.js
+++ b/products/ASC.People/Client/src/components/pages/AvatarEditor/Section/Body/index.js
@@ -3,26 +3,73 @@ import { withRouter } from "react-router";
import { connect } from "react-redux";
import styled from 'styled-components';
import { withTranslation } from "react-i18next";
+import { Button } from "asc-web-components";
+import { fetchProfile } from "../../../../../store/profile/actions";
+import { setDocumentTitle } from "../../../../../helpers/utils";
const InfoContainer = styled.div`
margin-bottom: 24px;
`;
-const SectionBodyContent = props => {
+class SectionBodyContent extends React.PureComponent{
+ constructor(props) {
+ super(props);
+ }
- const {t} = props
+ componentDidMount() {
+ const { match, fetchProfile, t } = this.props;
+ const { userId } = match.params;
- return (
-
+ setDocumentTitle(t("ProfileAction"));
+
+ if (userId) {
+ fetchProfile(userId);
+ }
+ }
+
+ componentDidUpdate(prevProps) {
+ const { match, fetchProfile } = this.props;
+ const { userId } = match.params;
+ const prevUserId = prevProps.match.params.userId;
+
+ if (userId !== undefined && userId !== prevUserId) {
+ fetchProfile(userId);
+ }
+ }
+
+ onBackClick = () => {
+ const {profile, settings} = this.props
+
+ debugger
+
+ this.props.history.push(`${settings.homepage}/edit/${profile.userName}`)
+ }
+
+ render(){
+
+ const {t, profile} = this.props
+
+ return(
+
{t("UploadNewPhoto")}
-
- );
-};
+
+
+
+ )
+ }
+}
function mapStateToProps(state) {
return {
+ profile: state.profile.targetUser,
+ settings: state.auth.settings
};
}
-export default connect(mapStateToProps)(withTranslation()(withRouter(SectionBodyContent)));
+export default connect(mapStateToProps, { fetchProfile })(withTranslation()(withRouter(SectionBodyContent)));
diff --git a/products/ASC.People/Client/src/components/pages/AvatarEditor/Section/Header/index.js b/products/ASC.People/Client/src/components/pages/AvatarEditor/Section/Header/index.js
index a7c654bf8d..a4776ebd90 100644
--- a/products/ASC.People/Client/src/components/pages/AvatarEditor/Section/Header/index.js
+++ b/products/ASC.People/Client/src/components/pages/AvatarEditor/Section/Header/index.js
@@ -24,12 +24,12 @@ const textStyle = {
};
const SectionHeaderContent = props => {
- const { history, settings } = props;
+ const { history, settings, profile } = props;
const { t } = useTranslation();
const onClickBack = useCallback(() => {
- history.push(settings.homepage);
- }, [history, settings]);
+ history.push(`${settings.homepage}/edit/${profile.userName}`);
+ }, [history, settings, profile]);
return (
diff --git a/products/ASC.People/Client/src/components/pages/ProfileAction/Section/Body/createUserForm.js b/products/ASC.People/Client/src/components/pages/ProfileAction/Section/Body/createUserForm.js
index 793d970e89..d64827a320 100644
--- a/products/ASC.People/Client/src/components/pages/ProfileAction/Section/Body/createUserForm.js
+++ b/products/ASC.People/Client/src/components/pages/ProfileAction/Section/Body/createUserForm.js
@@ -6,7 +6,8 @@ import {
Button,
Textarea,
AvatarEditor,
- Text
+ Text,
+ utils
} from "asc-web-components";
import { withTranslation, Trans } from "react-i18next";
import {
@@ -33,7 +34,9 @@ import DepartmentField from "./FormFields/DepartmentField";
import ContactsField from "./FormFields/ContactsField";
import InfoFieldContainer from "./FormFields/InfoFieldContainer";
import { api, toastr } from "asc-web-common";
+import { isMobile } from "react-device-detect";
const { createThumbnailsAvatar, loadAvatar } = api.people;
+const { isTablet } = utils.device;
class CreateUserForm extends React.Component {
constructor(props) {
@@ -60,6 +63,7 @@ class CreateUserForm extends React.Component {
this.onRemoveGroup = this.onRemoveGroup.bind(this);
this.openAvatarEditor = this.openAvatarEditor.bind(this);
+ this.openAvatarEditorPage = this.openAvatarEditorPage.bind(this);
this.onSaveAvatar = this.onSaveAvatar.bind(this);
this.onCloseAvatarEditor = this.onCloseAvatarEditor.bind(this);
this.createAvatar = this.createAvatar.bind(this);
@@ -109,6 +113,10 @@ class CreateUserForm extends React.Component {
});
}
+ openAvatarEditorPage() {
+ this.props.history.push(`${this.props.settings.homepage}/edit-avatar/${this.props.profile.userName}`);
+ }
+
onLoadFileAvatar(file) {
let data = new FormData();
let _this = this;
@@ -165,6 +173,12 @@ class CreateUserForm extends React.Component {
if (this.props.match.params.type !== prevProps.match.params.type) {
this.setState(this.mapPropsToState(this.props));
}
+
+ const isMobileDevice = isMobile || isTablet()
+
+ if(prevState.isMobile !== isMobileDevice){
+ this.setState({ isMobile: isMobileDevice });
+ }
}
mapPropsToState = props => {
@@ -200,7 +214,8 @@ class CreateUserForm extends React.Component {
y: 0,
width: 0,
height: 0
- }
+ },
+ isMobile: isMobile || isTablet
};
};
@@ -352,7 +367,7 @@ class CreateUserForm extends React.Component {
this.setState({ errors: { ...this.state.errors, email: !value.isValid } });
render() {
- const { isLoading, errors, profile, selector } = this.state;
+ const { isLoading, errors, profile, selector, isMobile } = this.state;
const { t, settings, i18n } = this.props;
const {
regDateCaption,
@@ -373,7 +388,7 @@ class CreateUserForm extends React.Component {
editing={true}
source={this.state.croppedAvatarImage}
editLabel={t("AddButton")}
- editAction={this.openAvatarEditor}
+ editAction={isMobile ? this.openAvatarEditorPage : this.openAvatarEditor}
/>
{
@@ -152,7 +162,8 @@ class UpdateUserForm extends React.Component {
[dialogsDataset.changePhone]: false,
[dialogsDataset.changeEmail]: false,
currentDialog: ""
- }
+ },
+ isMobile: isMobile || isTablet
};
//Set unique contacts id
@@ -305,6 +316,10 @@ class UpdateUserForm extends React.Component {
});
}
+ openAvatarEditorPage() {
+ this.props.history.push(`${this.props.settings.homepage}/edit-avatar/${this.props.profile.userName}`);
+ }
+
onLoadFileAvatar(file, callback) {
this.setState({ isLoading: true });
let data = new FormData();
@@ -426,7 +441,7 @@ class UpdateUserForm extends React.Component {
}
render() {
- const { isLoading, errors, profile, selector, dialogsVisible } = this.state;
+ const { isLoading, errors, profile, selector, dialogsVisible, isMobile } = this.state;
const { t, i18n, settings } = this.props;
const {
guestCaption,
@@ -525,7 +540,7 @@ class UpdateUserForm extends React.Component {
userName={profile.displayName}
editing={true}
editLabel={t("editAvatar")}
- editAction={this.openAvatarEditor}
+ editAction={isMobile ? this.openAvatarEditorPage : this.openAvatarEditor}
/>