import { Component , EventEmitter , Input , OnInit , Output } from '@angular/core' ; import { FormBuilder , FormGroup , Validators } from '@angular/forms' ; import { IEmployee , IOrganization , IOrganizationDepartment , ITag } from '@gauzy/contracts' ; import { UntilDestroy , untilDestroyed } from '@ngneat/until-destroy' ; import { debounceTime , filter , tap } from 'rxjs/operators' ; import { Store } from '../../../@core/services' ; @ UntilDestroy ( { checkProperties : true } ) @ Component ( { selector : 'ga-departments-mutation' , templateUrl : './departments-mutation.component.html' , styleUrls : [ './departments-mutation.component.scss' ] } ) export class DepartmentsMutationComponent implements OnInit { _department : IOrganizationDepartment ; get department ( ) : IOrganizationDepartment { return this . _department ; } @ Input ( ) set department ( department ) { this . _department = department ; this . _syncDepartment ( ) ; } @ Output ( ) canceled = new EventEmitter ( ) ; @ Output ( ) addOrEditDepartment = new EventEmitter ( ) ; public form : FormGroup = DepartmentsMutationComponent . buildForm ( this . fb ) ; static buildForm ( fb ) { return fb . group ( { name : [ '' , Validators . required ] , members : [ [ ] , Validators . required ] , tags : [ [ ] ] } ) as FormGroup ; } employees : IEmployee [ ] = [ ] ; organization : IOrganization ; constructor ( private readonly fb , private readonly store ) { } ngOnInit ( ) { this . store . selectedOrganization$ . pipe ( debounceTime ( 200 ) , filter ( ( organization ) => ! ! organization ) , tap ( ( organization ) => this . organization = organization ) , untilDestroyed ( this ) ) . subscribe ( ) ; } /**
     * Sync department
     */ private _syncDepartment ( ) { if ( this . department ) { this . form . setValue ( { name : this . department . name , tags : this . department . tags , members : this . department . members . map ( ( member ) => member . id ) } ) ; } } param employees public onLoadEmployees ( employees ) { this . employees = employees ; } returns onSubmit ( ) { if ( this . form . invalid || ! this . organization ) { return ; } const { id : organizationId } = this . organization ; const { name , tags , members } = this . form . getRawValue ( ) ; this . addOrEditDepartment . emit ( { tags , name , organizationId , members : members . map ( ( id ) => this . employees . find ( ( e ) => e . id === id ) ) . filter ( ( e ) => ! ! e ) } ) ; } param members onMembersSelected ( members ) { this . form . get ( 'members' ) . setValue ( members ) ; this . form . get ( 'members' ) . updateValueAndValidity ( ) ; } param selectedTags selectedTagsEvent ( selectedTags ) { this . form . get ( 'tags' ) . setValue ( selectedTags ) ; this . form . get ( 'tags' ) . updateValueAndValidity ( ) ; } cancel ( ) { this . canceled . emit ( ) ; } }