import { Component, ViewChild, OnInit, AfterViewInit, ViewEncapsulation } from "@angular/core"; import { MatPaginator, MatSort, MatSnackBar } from "@angular/material"; import { Router, ActivatedRoute, Params } from "@angular/router"; import { TranslateService } from "@ngx-translate/core"; import { DataSource } from "@angular/cdk/table"; import { Observable } from "rxjs/Observable"; import { DataManagementPlanService } from "../../services/data-management-plan/data-management-plan.service"; import { ProjectModel, ProjectType } from "../../models/projects/ProjectModel"; import { ProjectService } from "../../services/project/project.service"; import { JsonSerializer } from "../../utilities/JsonSerializer"; import { FormGroup, AbstractControl, FormControl, FormArray } from "@angular/forms"; import { SnackBarNotificationComponent } from "../../shared/components/notificaiton/snack-bar-notification.component"; import { BaseErrorModel } from "../../models/error/BaseErrorModel"; import { TdDialogService } from "@covalent/core"; import { ProjectFileUploaderService } from "../../services/files/project-file-uploader.service"; import { HostConfiguration } from "../../app.constants"; import { LanguageResolverService } from "../../services/language-resolver/language-resolver.service"; import { THIS_EXPR } from "@angular/compiler/src/output/output_ast"; import { BaseHttpService } from "../../utilities/cite-http-service-module/base-http.service"; import { IBreadCrumbComponent } from "../../shared/components/breadcrumb/definition/IBreadCrumbComponent"; import { BreadcrumbItem } from "../../shared/components/breadcrumb/definition/breadcrumb-item"; @Component({ selector: 'app-project-editor-component', templateUrl: 'project-editor.component.html', styleUrls: ['./project-editor.component.scss'], encapsulation: ViewEncapsulation.None }) export class ProjectEditorComponent implements OnInit, IBreadCrumbComponent { breadCrumbs: Observable = Observable.of([]);; isNew = true; project: ProjectModel; formGroup: FormGroup = null; host = HostConfiguration.Server; editMode = false; constructor( private projectService: ProjectService, private route: ActivatedRoute, public snackBar: MatSnackBar, public router: Router, public language: TranslateService, private dialogService: TdDialogService, private uploaderService: ProjectFileUploaderService, private languageResolverService: LanguageResolverService ) { } ngOnInit() { this.route.params.subscribe((params: Params) => { const itemId = params['id']; if (itemId != null) { this.isNew = false; this.projectService.getSingle(itemId).map(data => data as ProjectModel) .subscribe(data => { this.project = JsonSerializer.fromJSONObject(data, ProjectModel); this.formGroup = this.project.buildForm(null, this.project.type == ProjectType.External || !this.editMode); this.breadCrumbs = Observable.of([{ parentComponentName: "ProjectListingComponent", label: 'Projects', url: "/projects" }, { parentComponentName: null, label: this.project.label, url: "/projects/edit/" + this.project.id }]) }); } else { this.breadCrumbs = Observable.of([{ parentComponentName: "ProjectListingComponent", label: 'Projects', url: "/projects" }, { parentComponentName: null, label: "Project New", url: "/projects/new" }]) this.project = new ProjectModel(); setTimeout(() => { this.formGroup = this.project.buildForm(); }); } }); } formSubmit(): void { this.touchAllFormFields(this.formGroup); if (!this.isFormValid()) { return; } this.onSubmit(); } public isFormValid() { return this.formGroup.valid; } onSubmit(): void { this.projectService.createProject(this.formGroup.value).subscribe( complete => this.onCallbackSuccess(), error => this.onCallbackError(error) ); } onCallbackSuccess(): void { this.snackBar.openFromComponent(SnackBarNotificationComponent, { data: { message: this.isNew ? 'GENERAL.SNACK-BAR.SUCCESSFUL-CREATION' : 'GENERAL.SNACK-BAR.SUCCESSFUL-UPDATE', language: this.language }, duration: 3000, }) this.router.navigate(['/projects']); } onCallbackError(errorResponse: any) { this.setErrorModel(errorResponse.error); this.validateAllFormFields(this.formGroup); } public setErrorModel(errorModel: BaseErrorModel) { Object.keys(errorModel).forEach(item => { (this.project.errorModel)[item] = (errorModel)[item]; }) } public cancel(): void { this.router.navigate(['/projects']); } public delete(): void { this.language.get('GENERAL.DELETE-CONFIRMATION').subscribe((messages: any) => { this.dialogService.openConfirm({ message: messages.MESSAGE, title: messages.TITLE, cancelButton: messages.NEGATIVE, acceptButton: messages.POSITIVE }).afterClosed().subscribe((accept: boolean) => { if (accept) { this.projectService.inactivate(this.project.id).subscribe( complete => { this.router.navigate(['/projects']); }, error => this.onCallbackError(error) ); } }); }); } public touchAllFormFields(formControl: AbstractControl) { if (formControl instanceof FormControl) { formControl.markAsTouched(); } else if (formControl instanceof FormGroup) { Object.keys(formControl.controls).forEach(item => { const control = formControl.get(item); this.touchAllFormFields(control); }) } else if (formControl instanceof FormArray) { formControl.controls.forEach(item => { this.touchAllFormFields(item); }) } } public validateAllFormFields(formControl: AbstractControl) { if (formControl instanceof FormControl) { formControl.updateValueAndValidity({ emitEvent: false }) } else if (formControl instanceof FormGroup) { Object.keys(formControl.controls).forEach(item => { const control = formControl.get(item); this.validateAllFormFields(control); }) } else if (formControl instanceof FormArray) { formControl.controls.forEach(item => { this.validateAllFormFields(item); }) } } public enableForm() { if (!this.isExternalProject()) { this.editMode = true; this.formGroup.enable() } } public disableForm() { this.editMode = false; this.formGroup.disable(); } public goToProjectDmps() { this.router.navigate(["dmps/project/" + this.project.id], { queryParams: { projectLabel: this.project.label } }) } public isExternalProject() { return this.project.type === ProjectType.External; } }