mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-05-12 17:04:57 +00:00
* [ADF-3282] Refactor Start Task Component * [ADF-3282] Fix e2e test * [ADF-3282] Remove maxTaskNameLength from start task doc
232 lines
7.6 KiB
TypeScript
232 lines
7.6 KiB
TypeScript
/*!
|
|
* @license
|
|
* Copyright 2016 Alfresco Software, Ltd.
|
|
*
|
|
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
* you may not use this file except in compliance with the License.
|
|
* You may obtain a copy of the License at
|
|
*
|
|
* http://www.apache.org/licenses/LICENSE-2.0
|
|
*
|
|
* Unless required by applicable law or agreed to in writing, software
|
|
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
* See the License for the specific language governing permissions and
|
|
* limitations under the License.
|
|
*/
|
|
|
|
import { LogService, UserPreferencesService, UserProcessModel, FormFieldModel, FormModel } from '@alfresco/adf-core';
|
|
import { Component, EventEmitter, Input, OnInit, Output, ViewEncapsulation } from '@angular/core';
|
|
import { DateAdapter, MAT_DATE_FORMATS } from '@angular/material/core';
|
|
import { MOMENT_DATE_FORMATS, MomentDateAdapter } from '@alfresco/adf-core';
|
|
import moment from 'moment-es6';
|
|
import { Moment } from 'moment';
|
|
import { Observable, of } from 'rxjs';
|
|
import { Form } from '../models/form.model';
|
|
import { TaskDetailsModel } from '../models/task-details.model';
|
|
import { TaskListService } from './../services/tasklist.service';
|
|
import { switchMap, defaultIfEmpty } from 'rxjs/operators';
|
|
import { FormBuilder, AbstractControl, Validators, FormGroup, FormControl } from '@angular/forms';
|
|
|
|
@Component({
|
|
selector: 'adf-start-task',
|
|
templateUrl: './start-task.component.html',
|
|
styleUrls: ['./start-task.component.scss'],
|
|
providers: [
|
|
{ provide: DateAdapter, useClass: MomentDateAdapter },
|
|
{ provide: MAT_DATE_FORMATS, useValue: MOMENT_DATE_FORMATS }],
|
|
encapsulation: ViewEncapsulation.None
|
|
})
|
|
export class StartTaskComponent implements OnInit {
|
|
|
|
public FORMAT_DATE: string = 'DD/MM/YYYY';
|
|
MAX_LENGTH: number = 255;
|
|
|
|
@Input()
|
|
appId: number;
|
|
|
|
@Input()
|
|
name: string = '';
|
|
|
|
@Output()
|
|
success: EventEmitter<any> = new EventEmitter<any>();
|
|
|
|
@Output()
|
|
cancel: EventEmitter<void> = new EventEmitter<void>();
|
|
|
|
@Output()
|
|
error: EventEmitter<any> = new EventEmitter<any>();
|
|
|
|
taskDetailsModel: TaskDetailsModel = new TaskDetailsModel();
|
|
forms$: Observable<Form[]>;
|
|
assigneeId: number;
|
|
field: FormFieldModel;
|
|
taskForm: FormGroup;
|
|
dateError: boolean = false;
|
|
maxTaskNameLength: number = this.MAX_LENGTH;
|
|
loading = false;
|
|
|
|
/**
|
|
* Constructor
|
|
* @param auth
|
|
* @param translate
|
|
* @param taskService
|
|
*/
|
|
constructor(private taskService: TaskListService,
|
|
private dateAdapter: DateAdapter<Moment>,
|
|
private preferences: UserPreferencesService,
|
|
private formBuilder: FormBuilder,
|
|
private logService: LogService) {
|
|
}
|
|
|
|
ngOnInit() {
|
|
if (this.name) {
|
|
this.taskDetailsModel.name = this.name;
|
|
}
|
|
|
|
this.validateMaxTaskNameLength();
|
|
|
|
this.field = new FormFieldModel(new FormModel(), { id: this.assigneeId, value: this.assigneeId, placeholder: 'Assignee' });
|
|
this.preferences.locale$.subscribe((locale) => {
|
|
this.dateAdapter.setLocale(locale);
|
|
});
|
|
|
|
this.loadFormsTask();
|
|
this.buildForm();
|
|
}
|
|
|
|
buildForm() {
|
|
this.taskForm = this.formBuilder.group({
|
|
name: new FormControl(this.taskDetailsModel.name, [Validators.required, Validators.maxLength(this.maxTaskNameLength)]),
|
|
description: new FormControl(''),
|
|
formKey: new FormControl('')
|
|
});
|
|
|
|
this.taskForm.valueChanges.subscribe((taskFormValues) => this.setTaskDetails(taskFormValues));
|
|
}
|
|
|
|
setTaskDetails(form) {
|
|
this.taskDetailsModel.name = form.name;
|
|
this.taskDetailsModel.description = form.description;
|
|
this.taskDetailsModel.formKey = form.formKey ? form.formKey.toString() : null;
|
|
}
|
|
|
|
isFormValid() {
|
|
return this.taskForm.valid && !this.dateError && !this.loading;
|
|
}
|
|
|
|
public saveTask(): void {
|
|
this.loading = true;
|
|
if (this.appId) {
|
|
this.taskDetailsModel.category = this.appId.toString();
|
|
}
|
|
this.taskService.createNewTask(this.taskDetailsModel)
|
|
.pipe(
|
|
switchMap((createRes: any) =>
|
|
this.attachForm(createRes.id, this.taskDetailsModel.formKey).pipe(
|
|
defaultIfEmpty(createRes),
|
|
switchMap((attachRes: any) =>
|
|
this.assignTaskByUserId(createRes.id, this.assigneeId).pipe(
|
|
defaultIfEmpty(attachRes ? attachRes : createRes)
|
|
)
|
|
)
|
|
)
|
|
)
|
|
)
|
|
.subscribe(
|
|
(res: any) => {
|
|
this.loading = false;
|
|
this.success.emit(res);
|
|
},
|
|
(err) => {
|
|
this.loading = false;
|
|
this.error.emit(err);
|
|
this.logService.error('An error occurred while creating new task');
|
|
});
|
|
}
|
|
|
|
getAssigneeId(userId) {
|
|
this.assigneeId = userId;
|
|
}
|
|
|
|
private attachForm(taskId: string, formKey: string): Observable<any> {
|
|
let response = of();
|
|
if (taskId && formKey) {
|
|
response = this.taskService.attachFormToATask(taskId, parseInt(formKey, 10));
|
|
}
|
|
return response;
|
|
}
|
|
|
|
private assignTaskByUserId(taskId: string, userId: any): Observable<any> {
|
|
let response = of();
|
|
if (taskId && userId) {
|
|
response = this.taskService.assignTaskByUserId(taskId, userId);
|
|
}
|
|
return response;
|
|
}
|
|
|
|
public onCancel(): void {
|
|
this.cancel.emit();
|
|
}
|
|
|
|
private loadFormsTask(): void {
|
|
this.forms$ = this.taskService.getFormList();
|
|
}
|
|
|
|
public isUserNameEmpty(user: UserProcessModel): boolean {
|
|
return !user || (this.isEmpty(user.firstName) && this.isEmpty(user.lastName));
|
|
}
|
|
|
|
private isEmpty(data: string): boolean {
|
|
return data === undefined || data === null || data.trim().length === 0;
|
|
}
|
|
|
|
public getDisplayUser(firstName: string, lastName: string, delimiter: string = '-'): string {
|
|
firstName = (firstName !== null ? firstName : '');
|
|
lastName = (lastName !== null ? lastName : '');
|
|
return firstName + delimiter + lastName;
|
|
}
|
|
|
|
onDateChanged(newDateValue: any) {
|
|
this.dateError = false;
|
|
|
|
if (newDateValue) {
|
|
let momentDate;
|
|
|
|
if (typeof newDateValue === 'string') {
|
|
momentDate = moment(newDateValue, this.FORMAT_DATE, true);
|
|
} else {
|
|
momentDate = newDateValue;
|
|
}
|
|
|
|
if (momentDate.isValid()) {
|
|
this.taskDetailsModel.dueDate = momentDate.toDate();
|
|
} else {
|
|
this.dateError = true;
|
|
this.taskDetailsModel.dueDate = null;
|
|
}
|
|
} else {
|
|
this.taskDetailsModel.dueDate = null;
|
|
}
|
|
}
|
|
|
|
private validateMaxTaskNameLength() {
|
|
if (this.maxTaskNameLength > this.MAX_LENGTH) {
|
|
this.maxTaskNameLength = this.MAX_LENGTH;
|
|
this.logService.log(`the task name length cannot be greater than ${this.MAX_LENGTH}`);
|
|
}
|
|
}
|
|
|
|
get nameController(): AbstractControl {
|
|
return this.taskForm.get('name');
|
|
}
|
|
|
|
get descriptionController(): AbstractControl {
|
|
return this.taskForm.get('description');
|
|
}
|
|
|
|
get formKeyController(): AbstractControl {
|
|
return this.taskForm.get('formKey');
|
|
}
|
|
}
|