import { Component , OnDestroy , OnInit , ViewChild } from '@angular/core' ; import { RenderFieldComponent } from '../components.fields' ; import { ObjectService } from '../../../services/object.service' ; import { CollectionParameters } from '../../../../services/models/api-parameter' ; import { CmdbMode } from '../../../modes.enum' ; import { takeUntil } from 'rxjs/operators' ; import { BehaviorSubject , ReplaySubject } from 'rxjs' ; import { APIGetMultiResponse } from '../../../../services/models/api-response' ; import { RenderResult } from '../../../models/cmdb-render' ; import { NgSelectComponent } from '@ng-select/ng-select' ; @ Component ( { selector : 'cmdb-ref-section' , templateUrl : './ref-section.component.html' , styleUrls : [ './ref-section.component.scss' ] } ) export class RefSectionComponent extends RenderFieldComponent implements OnInit , OnDestroy { private subscriber : ReplaySubject < void > = new ReplaySubject < void > ( ) ; public selected : BehaviorSubject < RenderResult > = new BehaviorSubject ( null ) ; public objects : Array < RenderResult > = [ ] ; public loading : boolean = false ; public totalObjects : number = 0 ; private currentPage : number = 1 ; private maxPage : number = 1 ; @ ViewChild ( 'selection' , { static : false } ) refSelector : NgSelectComponent ; constructor ( private objectService ) { super ( ) ; } private getApiParameters ( page = 1 ) { return { filter : { type_id : this . section . reference . type_id } , limit : 10 , sort : 'public_id' , order : 1 , page , projection : { object_information : 1 , type_information : 1 , sections : 1 , summary_line : 1 , summaries : 1 , fields : 1 } } as CollectionParameters ; } private loadObjectsFromApi ( ) { this . loading = true ; this . objectService . getObjects ( this . getApiParameters ( this . currentPage ) ) . pipe ( takeUntil ( this . subscriber ) ) . subscribe ( ( apiResponse ) => { this . objects = [ ... this . objects , ... apiResponse . results as Array < RenderResult > ] ; this . totalObjects = apiResponse . total ; this . maxPage = apiResponse . pager . total_pages ; } ) . add ( ( ) => this . loading = false ) ; } private triggerAPICall ( ) { if ( this . section && this . section ?. reference ) { if ( this . maxPage && ( this . currentPage <= this . maxPage ) ) { this . loadObjectsFromApi ( ) ; this . currentPage += 1 ; } } } param publicID public loadDisplayObject ( publicID ) { const foundObject = this . objects . find ( f => f . object_information . object_id === publicID ) ; if ( foundObject ) { this . selected . next ( foundObject ) ; } if ( publicID ) { this . objectService . getObject < RenderResult > ( publicID ) . pipe ( takeUntil ( this . subscriber ) ) . subscribe ( found => this . selected . next ( found ) ) ; } this . prepareReferencesData ( ) ; } private private prepareReferencesData ( ) { if ( this . mode === CmdbMode . Bulk && this . selected && this . selected . value ) { const { value } = this . selected ; const section = value . sections . find ( s => s . name === this . section . reference . section_name ) ; const fields = [ ] ; for ( const name of section . fields ) { const temp = this . selected . value . fields . find ( f => f . name === name ) ; if ( temp ) { fields . push ( temp ) ; } } const { type_id , type_name , type_label , icon } = value . type_information ; this . data . references = { type_id , type_name , type_label , type_icon : icon , fields } ; } } param value param item public searchRef ( value , item ) { const term = value . toLocaleLowerCase ( ) ; const line = item . object_information . object_id + item . summary_line ; const has_line = line . toLocaleLowerCase ( ) . indexOf ( term ) > - 1 || line . toLocaleLowerCase ( ) . includes ( term ) ; return item . fields . find ( f => has_line || ( ( typeof f . value === 'string' || f . value instanceof String ) && f . value . toLocaleLowerCase ( ) . includes ( term ) ) ) ; } param term param items public onCustomSearch ( term , items ) { for ( const obj of this . objects ) { if ( this . searchRef ( term , obj ) ) { items = [ ... items , ... [ obj ] ] ; } else { this . triggerAPICall ( ) ; } } return items ; } /**
     * Infinite Scrolling
     */ public onScrollToEnd ( ) { this . triggerAPICall ( ) ; } public ngOnInit ( ) { switch ( this . mode ) { case CmdbMode . Create : case CmdbMode . Edit : case CmdbMode . Bulk : { this . triggerAPICall ( ) ; this . loadDisplayObject ( this . controller . value ) ; break ; } case CmdbMode . View : { break ; } } } public ngOnDestroy ( ) { this . subscriber . next ( ) ; this . subscriber . complete ( ) ; } }