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

ASC.People: ProfileAction: add department button added

Browse Source
This commit is contained in:
Andrey Savihin 2019-09-10 15:17:38 +03:00
parent b1bc98b41c
commit a45e348b61
4 changed files with 39 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
products/ASC.People/Client/src/components/pages/ProfileAction/Section/Body/FormFields/DepartmentField.js
View File

@ -1,13 +1,15 @@
import React from 'react'
import { FieldContainer, SelectedItem } from 'asc-web-components'
import { FieldContainer, SelectorAddButton, SelectedItem } from 'asc-web-components'
const DepartmentField = React.memo((props) => {
const {
isRequired,
isDisabled,
hasError,
labelText,
addButtonTitle,
departments,
onAddDepartment,
onRemoveDepartment
} = props;
@ -16,14 +18,20 @@ const DepartmentField = React.memo((props) => {
isRequired={isRequired}
hasError={hasError}
labelText={labelText}
className="departments-field"
>
<SelectorAddButton
isDisabled={isDisabled}
title={addButtonTitle}
onClick={onAddDepartment}
/>
{departments && departments.map((department) => (
<SelectedItem
key={`department_${department.id}`}
text={department.name}
onClose={() => { onRemoveDepartment(department.id) }}
isInline={true}
className={"department-item"}
className="department-item"
/>
))}
</FieldContainer>

10
products/ASC.People/Client/src/components/pages/ProfileAction/Section/Body/FormFields/Form.js
View File

@ -19,6 +19,16 @@ const MainContainer = styled.div`
}
}
.departments-field {
.field-body {
display: flex;
align-items: center;
}
.department-item {
margin: 0 0 0 8px;
}
}
@media ${utils.device.tablet} {
flex-direction: column;
}

10
products/ASC.People/Client/src/components/pages/ProfileAction/Section/Body/createUserForm.js
View File

@ -27,6 +27,7 @@ class CreateUserForm extends React.Component {
this.onInputChange = this.onInputChange.bind(this);
this.onBirthdayDateChange = this.onBirthdayDateChange.bind(this);
this.onWorkFromDateChange = this.onWorkFromDateChange.bind(this);
this.onAddGroup = this.onAddGroup.bind(this);
this.onGroupClose = this.onGroupClose.bind(this);
this.onCancel = this.onCancel.bind(this);
@ -75,9 +76,13 @@ class CreateUserForm extends React.Component {
this.setState(stateCopy)
}
onAddGroup() {
console.log("onAddGroup")
}
onGroupClose(id) {
var stateCopy = Object.assign({}, this.state);
stateCopy.profile.groups = this.state.groups.filter((group) => group.id !== id);
stateCopy.profile.groups = this.state.profile.groups.filter((group) => group.id !== id);
this.setState(stateCopy)
}
@ -262,7 +267,10 @@ class CreateUserForm extends React.Component {
/>
<DepartmentField
labelText={`${t("CustomDepartment", { department })}:`}
isDisabled={isLoading}
departments={profile.groups}
addButtonTitle={t("Add")}
onAddDepartment={this.onAddGroup}
onRemoveDepartment={this.onGroupClose}
/>
</MainFieldsContainer>

10
products/ASC.People/Client/src/components/pages/ProfileAction/Section/Body/updateUserForm.js
View File

@ -28,6 +28,7 @@ class UpdateUserForm extends React.Component {
this.onUserTypeChange = this.onUserTypeChange.bind(this);
this.onBirthdayDateChange = this.onBirthdayDateChange.bind(this);
this.onWorkFromDateChange = this.onWorkFromDateChange.bind(this);
this.onAddGroup = this.onAddGroup.bind(this);
this.onGroupClose = this.onGroupClose.bind(this);
this.onCancel = this.onCancel.bind(this);
@ -101,9 +102,13 @@ class UpdateUserForm extends React.Component {
this.setState(stateCopy)
}
onAddGroup() {
console.log("onAddGroup")
}
onGroupClose(id) {
var stateCopy = Object.assign({}, this.state);
stateCopy.profile.groups = this.state.groups.filter((group) => group.id !== id);
stateCopy.profile.groups = this.state.profile.groups.filter((group) => group.id !== id);
this.setState(stateCopy)
}
@ -388,7 +393,10 @@ class UpdateUserForm extends React.Component {
/>
<DepartmentField
labelText={`${t("CustomDepartment", { department })}:`}
isDisabled={isLoading}
departments={profile.groups}
addButtonTitle={t("Add")}
onAddDepartment={this.onAddGroup}
onRemoveDepartment={this.onGroupClose}
/>
</MainFieldsContainer>