- updated Users page;
This commit is contained in:
Vitalii Kiiko
@@ -1,6 +1,17 @@
|
||||
import React, { useState, useEffect } from 'react';
|
||||
import { __ } from '@wordpress/i18n';
|
||||
import { isEmpty, isNil } from 'ramda';
|
||||
import { klona } from 'klona';
|
||||
|
||||
// api
|
||||
import UserService from '../../service/user-service';
|
||||
|
||||
// tools
|
||||
import set404FromErrorResponse from '../../helpers/set404FromErrorResponse';
|
||||
import { isEmail } from '../../helpers/validators';
|
||||
|
||||
// store
|
||||
import { storeSet } from '../../store';
|
||||
|
||||
// components
|
||||
import AllUsersTable from './components/AllUsersTable';
|
||||
@@ -8,21 +19,19 @@ import { Button } from 'primereact/button';
|
||||
import { InputText } from 'primereact/inputtext';
|
||||
import { Dropdown } from 'primereact/dropdown';
|
||||
import { Dialog } from 'primereact/dialog';
|
||||
import UserService from '../../service/user-service';
|
||||
import set404FromErrorResponse from '../../helpers/set404FromErrorResponse';
|
||||
import { storeSet } from '../../store';
|
||||
import { klona } from 'klona';
|
||||
import { classNames } from 'primereact/utils';
|
||||
import { isEmail } from '../../helpers/validators';
|
||||
|
||||
const Users = () => {
|
||||
const [isVisibleEditDialog, setIsVisibleEditDialog] = useState(false);
|
||||
const [isCreatingUserRequest, setIsCreatingUserRequest] = useState(false);
|
||||
const [newUserData, setNewUserData] = useState({
|
||||
firstName: '',
|
||||
lastName: '',
|
||||
email: '',
|
||||
phoneNumber: '',
|
||||
role: ''
|
||||
password: '',
|
||||
confPassword: '',
|
||||
roleId: 0
|
||||
});
|
||||
const [roles, setRoles] = useState([]);
|
||||
|
||||
@@ -41,14 +50,18 @@ const Users = () => {
|
||||
lastName: '',
|
||||
email: '',
|
||||
phoneNumber: '',
|
||||
role: ''
|
||||
password: '',
|
||||
confPassword: '',
|
||||
roleId: 0
|
||||
});
|
||||
}
|
||||
|
||||
const saveEditDialog = () => {
|
||||
const emptyValues = Object.values(newUserData).filter(v => isEmpty(v));
|
||||
if (isEmpty(emptyValues)) {
|
||||
console.log(newUserData)
|
||||
console.log(isEmpty(emptyValues), newUserData.password === newUserData.confPassword, !isCreatingUserRequest)
|
||||
if (isEmpty(emptyValues) && newUserData.password === newUserData.confPassword && !isCreatingUserRequest) {
|
||||
setIsCreatingUserRequest(true);
|
||||
UserService.createUser(newUserData, createUserCallback, errCreateUserCallback);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -70,7 +83,9 @@ const Users = () => {
|
||||
|
||||
const getRolesCallback = (data) => {
|
||||
if (data.status === 'SUCCESS') {
|
||||
const roles = data.data.map(o => ({
|
||||
const roles = data.data
|
||||
.filter(o => ['ROLE_SUPER_ADMIN', 'ROLE_PRE_INSTRUCTOR'].includes(o.roleType))
|
||||
.map(o => ({
|
||||
name: o.roleName,
|
||||
value: o.id
|
||||
}));
|
||||
@@ -84,6 +99,19 @@ const Users = () => {
|
||||
storeSet.main.unsetAsyncRequest();
|
||||
}
|
||||
|
||||
const createUserCallback = (data) => {
|
||||
if (data.status === 'SUCCESS') {
|
||||
console.log('data.data', data.data)
|
||||
}
|
||||
setIsCreatingUserRequest(false);
|
||||
}
|
||||
|
||||
const errCreateUserCallback = (data) => {
|
||||
setIsCreatingUserRequest(false);
|
||||
}
|
||||
|
||||
const isInvalidField = (data, key) => isEmpty(data[key]) || isNil(data[key])
|
||||
|
||||
useEffect(() => {
|
||||
if (isVisibleEditDialog) {
|
||||
UserService.getRoles(getRolesCallback, errGetRolesCallback)
|
||||
@@ -117,39 +145,74 @@ const Users = () => {
|
||||
<div className="appPage__spacer"></div>
|
||||
<div className="appForm__cols">
|
||||
<div className="appForm__field">
|
||||
<label className={classNames({ 'p-error': isEmpty(newUserData.firstName) || isNil(newUserData.firstName) })}>{__('Nome', 'gepafin')}*</label>
|
||||
<label
|
||||
className={classNames({ 'p-error': isInvalidField(newUserData, 'firstName') })}>
|
||||
{__('Nome', 'gepafin')}*
|
||||
</label>
|
||||
<InputText value={newUserData.firstName}
|
||||
invalid={isEmpty(newUserData.firstName) || isNil(newUserData.firstName)}
|
||||
invalid={isInvalidField(newUserData, 'firstName')}
|
||||
onChange={(e) => onChangeEditItem(e.target.value, 'firstName')}/>
|
||||
</div>
|
||||
<div className="appForm__field">
|
||||
<label className={classNames({ 'p-error': isEmpty(newUserData.lastName) || isNil(newUserData.lastName) })}>{__('Cognome', 'gepafin')}*</label>
|
||||
<label
|
||||
className={classNames({ 'p-error': isInvalidField(newUserData, 'lastName') })}>
|
||||
{__('Cognome', 'gepafin')}*
|
||||
</label>
|
||||
<InputText value={newUserData.lastName}
|
||||
invalid={isEmpty(newUserData.lastName) || isNil(newUserData.lastName)}
|
||||
invalid={isInvalidField(newUserData, 'lastName')}
|
||||
onChange={(e) => onChangeEditItem(e.target.value, 'lastName')}/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="appForm__cols">
|
||||
<div className="appForm__field">
|
||||
<label className={classNames({ 'p-error': isEmpty(newUserData.email) || isNil(newUserData.email) })}>{__('Email', 'gepafin')}*</label>
|
||||
<label
|
||||
className={classNames({ 'p-error': isEmpty(newUserData.email) || isNil(newUserData.email) || !isEmail(newUserData.email) })}>
|
||||
{__('Email', 'gepafin')}*
|
||||
</label>
|
||||
<InputText value={newUserData.email}
|
||||
invalid={isEmpty(newUserData.email) || isNil(newUserData.email) || !isEmail(newUserData.email)}
|
||||
onChange={(e) => onChangeEditItem(e.target.value, 'email')}/>
|
||||
</div>
|
||||
<div className="appForm__field">
|
||||
<label className={classNames({ 'p-error': isEmpty(newUserData.phoneNumber) || isNil(newUserData.phoneNumber) })}>{__('Telefono', 'gepafin')}</label>
|
||||
<label
|
||||
className={classNames({ 'p-error': isInvalidField(newUserData, 'phoneNumber') })}>
|
||||
{__('Telefono', 'gepafin')}
|
||||
</label>
|
||||
<InputText value={newUserData.phoneNumber}
|
||||
keyfilter="int"
|
||||
invalid={isEmpty(newUserData.phoneNumber) || isNil(newUserData.phoneNumber)}
|
||||
invalid={isInvalidField(newUserData, 'phoneNumber')}
|
||||
onChange={(e) => onChangeEditItem(e.target.value, 'phoneNumber')}/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="appForm__cols">
|
||||
<div className="appForm__field">
|
||||
<label
|
||||
className={classNames({ 'p-error': isEmpty(newUserData.password) || isNil(newUserData.password) || newUserData.password !== newUserData.confPassword })}>
|
||||
{__('Password', 'gepafin')}*
|
||||
</label>
|
||||
<InputText value={newUserData.password}
|
||||
invalid={isEmpty(newUserData.password) || isNil(newUserData.password) || newUserData.password !== newUserData.confPassword}
|
||||
onChange={(e) => onChangeEditItem(e.target.value, 'password')}/>
|
||||
</div>
|
||||
<div className="appForm__field">
|
||||
<label
|
||||
className={classNames({ 'p-error': isEmpty(newUserData.confPassword) || isNil(newUserData.confPassword) || newUserData.password !== newUserData.confPassword })}>
|
||||
{__('Conferma password', 'gepafin')}*
|
||||
</label>
|
||||
<InputText value={newUserData.confPassword}
|
||||
invalid={isEmpty(newUserData.confPassword) || isNil(newUserData.confPassword) || newUserData.password !== newUserData.confPassword}
|
||||
onChange={(e) => onChangeEditItem(e.target.value, 'confPassword')}/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="appForm__field">
|
||||
<label className={classNames({ 'p-error': isEmpty(newUserData.role) || isNil(newUserData.role) })}>{__('Ruolo', 'gepafin')}</label>
|
||||
<label
|
||||
className={classNames({ 'p-error': isEmpty(newUserData.roleId) || isNil(newUserData.roleId) || newUserData.roleId === 0 })}>
|
||||
{__('Ruolo', 'gepafin')}*
|
||||
</label>
|
||||
<Dropdown
|
||||
value={newUserData.role}
|
||||
invalid={isEmpty(newUserData.role) || isNil(newUserData.role)}
|
||||
onChange={(e) => onChangeEditItem(e.value, 'role')}
|
||||
value={newUserData.roleId}
|
||||
invalid={isEmpty(newUserData.roleId) || isNil(newUserData.roleId) || newUserData.roleId === 0}
|
||||
onChange={(e) => onChangeEditItem(e.value, 'roleId')}
|
||||
options={roles}
|
||||
optionLabel="name"
|
||||
optionValue="value"/>
|
||||
|
||||
Reference in New Issue
Block a user