94
handleSubmit = () => {
this.props.onSubmit(this.state.user);
}
/**
* Рендерит футер модального окна.
*/
renderModalFooter = () => {
const {onClose} = this.props;
return (
<SimpleButton label=" Создать" onClick={this.handleSubmit}
iconClass="fa-check"/>
<SimpleButton label=" Отмена"
btnStyle={EButtonStyle.WARNING} onClick={onClose} iconClass="fa-ban"/>
</React.Fragment>
)
}
render () {
const {onClose} = this.props;
return (
<ModalWindow
show
dialogClassN ame=""
header="Добавление нового пользователя"
body={this.renderModalBody()}
footer={this.renderModalFooter()}
onClose={onClose}
95
)
}
}
import * as React from 'react';
import {map, filter} from 'lodash';
import {ExpandingPanel} from '../../Core/ExpandingPanel';
import {EExpandingPanelType} from '../../Core/Enums';
import {LayoutHeader} from '../Header/LayoutHeader';
import {ITask, IUser, ETaskType, ERole} from '../../../models/Common';
import {ChairPie} from '../../../Components/Core/Chairs/ChairPie';
import {IChartData} from '../../../Components/Core/Chairs/ChairModels';
/**
* Параметры компонента.
*/
interface IProps {
tasks: ITask[];
users: IUser[];
}
/>
/**
* Отображает вопросы по выбранному типу.
*/
export class Statistics extends React.PureComponent<IProps> {
getProductivityTotal = (): IChartData[] => {
const {tasks, users} = this.props;
return map (users, (user: IUser) => {
const total = filter(tasks, (task: ITask) => {return task.userId ===
user._id});
const result: IChartData = {
96
label: user.name,
value: total ? total.length : 0
}
return result
})
}
/**
* Получение продуктивности
*/
getProductivityActivity = (): IChartData[] => {
const {tasks} = this.props;
const total = filter(tasks, (task: ITask) => {return task.type !==
ETaskType.FREE});
const activeTime = total ? total.length : 0;
return [
{
label: 'Активное время',
value: activeTime
},
{
label: 'Время простоя',
value: tasks.length - activeTime
}
]
}
/**
* Получение продуктивности
*/
97
getProductivityUser = (user: IUser): IChartData[] => {
const {tasks} = this.props;
const userTasks = filter(tasks, (task: ITask) => {return user._id ===
task.userId});
const free = filter(userTasks, (task: ITask) => {return task.type ===
ETaskType.FREE});
const calls = filter(userTasks, (task: ITask) => {return task.type ===
ETaskType. CALL});
const docs = filter(userTasks, (task: ITask) => {return task.type ===
ETaskType.DOC});
const freeTime = free ? free.length : 0;
const callsTime = calls ? calls.length : 0;
const docsTime = docs ? docs.length : 0;
return [
{
label: 'Звонки',
value: freeTime
},
{
label: 'Сделки',
value: callsTime
},
{
label: 'Не рабочее время',
value: docsTime
}
]
}
98
render () {
const {users} = this.props;
return (
<div className="tasks">
<LayoutHeader label={'CTaracraKa предприятия'}/>
collapsed
className="col-xs-12 question"
headerClassName="pb-0"
collapsedIconQassName="fa-plus"
expandedIconClassName-'fa-minus"
panelType={EExpandingPanelType.EXPANDING_BLOCK}
header="Продуктивность предприятия по активности"
>
data={this.getProductivityT otal()}
/>
</ExpandingPanel>
collapsed
className="col-xs-12 question"
headerClassName="pb-0"
collapsedIconQassName="fa-plus"
expandedIconClassName-'fa-minus"
panelType={EExpandingPanelType.EXPANDING_BLOCK}
header="Продуктивность предприятия по занятости"
>
data={this.getProductivityActivity()}
99
/>
</ExpandingPanel>
collapsed
className="col-xs-12 question"
headerClassName="pb-0"
collapsedIconClassName="fa-plus"
expandedIconClassName="fa-minus"
panelType={EExpandingPanelType.EXPANDING_BLOCK}
header="Статистика пользователей"
>
{map(users, (user: IUser) => {
if (user.role === ERole.USER) {
return (
<div>{user.name}</div>
data={this.getProductivityUser(user)}
/>
</React.Fragment>
)
} else {
return eact.Fragment></React.Fragment>
}
})}
</ExpandingPanel>
)
}
100
}
Задачи
import * as React from 'react';
import {find, capitalize, filter} from 'lodash';
import {LayoutHeader} from '../Header/LayoutHeader';
import {ITask, IUser, ETaskType, DATE_FORMAT, ERole} from
'../../../models/Common';
import moment = require('moment');
import { updateTask, addClient } from '../../../services/services';
import Table from '../../Core/Table/Table';
import {ITableColumns} from '../../Core/Models';
import {SimpleButton} from '../../Core/SimpleButton';
import {EButtonStyle} from '../../Core/Enums';
import {FormGroup} from '../../Core/FormGroup';
/**
* Параметры компонента.
*/
interface IProps {
tasks: ITask[];
users: IUser[];
user: IUser;
isExpert: boolean;
onReloadTasks: () => void;
onDeleteTask: (id: string) => void;
}
/**
* Отображает вопросы по выбранному типу.
*/
export class Tasks extends React.PureComponent<IProps> {
101
getHeader = (task: ITask) => {
const {isExpert, users} = this.props;
let userName = 'Вы';
let taskName = 'Отсутствовал';
switch (task.type) {
case ETaskType.CALL:
taskName = 'Звонок клиенту'
break;
case ETaskType.DOC:
taskName = 'Сделка'
break;
}
if (isExpert) {
const user: IUser = find(users, (userEntity: IUser) => {return
userEntity._id === task.userId});
if (!!user) {
userName = user.name;
} else {
userName = 'Неизвестно';
}
}
return '${capitalize(userName)}: ${taskName}';
}
/**
* Флажок завершить задачу.
*/
handleCheck = (task: ITask) => () => {
updateTask({...task, checked: true}).then(() => {
102
if (task.type === ETaskType.CALL) {
addClient(this.props.user).then(this.props.onReloadTasks);
} else {
this.props.onReloadTasks();
}
});
}
/**
* Конфигурация столбцов таблицы с версиями типологизатора.
*/
static TypologyVersionListTableConfig: ITableColumns = {
version: {
label: 'Статус'
},
status: {
label: 'Заголовок'
},
time: {
label: 'Время'
},
actualizeDate: {
label: 'Описание'
}
}
handleDeleteTask = (id: string) => () => {
this.props.onDeleteTask(id);
}
/**
* Обработчик отображения компонента списка задач.
103
*/
getTasksListComponent = (isToday: boolean = true) => {
const {user} = this.props;
const tasks: ITask[] = this.getTasks(isToday);
const customRowsRender = (data: ITask[]): JSX.Element[] => {
const rows: JSX.Element[] = [];
data.forEach((task: ITask) => {
rows.push(
key={task._id}
>
'red'}'}>
<td className={'${task.checked ? 'green' : isToday ? 'yellow' :
{
task.checked ?
<div><i className="fa fa-check" /> Завершён</div> :
label-'Завершить" iconClass="fa-plus" btnStyle={EButtonStyle.QUESTION}/>
}
<td>{thi s.getHeader(task)}</td>
<td>{task.time}</td>
<td>{task.label}</td>
{user.role === ERole.MANAGER &&
<td><SimpleButton
onClick={this.handleDeleteTask(task._id)} label-'Удалить" iconClass="fa-ban"
btnStyle={EButtonStyle.DANGER}/></td>
}