123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109 |
- import React from 'react'
- import { translate } from 'react-i18next'
-
- export class AddMemberForm extends React.Component {
- constructor (props) {
- super(props)
-
- this.state = {
- newUserEmail: '',
- newUserProfile: ''
- }
- }
-
- handleChangeNewUserEmail = e => this.setState({newUserEmail: e.target.value})
-
- handleChangeNewUserProfile = e => this.setState({newUserProfile: e.currentTarget.value})
-
- handleClickAddUser = () => {
- const { props, state } = this
-
- if (state.newUserEmail === '' || state.newUserProfile === '') {
- GLOBAL_dispatchEvent({
- type: 'addFlashMsg',
- data: {
- msg: props.t('Please type a name and select a profile'),
- type: 'warning',
- delay: undefined
- }
- })
- return
- }
-
- props.onClickAddUser(state.newUserEmail, state.newUserProfile)
- }
-
- render () {
- const { props, state } = this
-
- return (
- <form className='adminUserPage__adduser__form'>
- <div className='adminUserPage__adduser__form__username'>
- <label className='username__text' htmlFor='adduser'>
- {props.t('Add a user')}
- </label>
-
- <input
- type='text'
- className='username__input form-control'
- id='adduser'
- placeholder={props.t('Email')}
- value={state.newUserEmail}
- onChange={this.handleChangeNewUserEmail}
- />
-
- {/*
- <div className='username__createaccount'>
- <input type='radio' id='createuseraccount' />
- <label className='ml-2' htmlFor='createuseraccount'>Create an account for this member</label>
- </div>
- */}
- </div>
-
- <div className='adminUserPage__adduser__form__profile'>
- <div className='profile__text'>
- {props.t('Choose the profile of the user')}
- </div>
-
- <div className='profile__list'>
- {Object.keys(props.profile).map(p => props.profile[p]).map(p =>
- <label
- className='profile__list__item'
- htmlFor={p.slug}
- key={p.id}
- >
- <input
- type='radio'
- name='newUserProfile'
- id={p.slug}
- value={p.slug}
- checked={state.newUserProfile === p.slug}
- onChange={this.handleChangeNewUserProfile}
- />
-
- <div className='d-flex align-items-center'>
- <div className='userrole__role__icon mx-2' style={{color: p.hexcolor}}>
- <i className={`fa fa-fw fa-${p.faIcon}`} />
- </div>
- {p.label}
- </div>
- </label>
- )}
- </div>
- </div>
- <div className='adminUserPage__adduser__form__submit'>
- <button
- type='button'
- className='btn'
- onClick={this.handleClickAddUser}
- >
- {props.t('Add the user')}
- </button>
- </div>
- </form>
- )
- }
- }
-
- export default translate()(AddMemberForm)
|