import { Component , EventEmitter , HostListener , Input , OnChanges , OnInit , Output , SimpleChanges } from '@angular/core' ; import { ToastService } from '../../../layout/toast/toast.service' ; import { SearchResultList } from '../../models/search-result' ; import { Router } from '@angular/router' ; @ Component ( { selector : 'cmdb-search-result-bar' , templateUrl : './search-result-bar.component.html' , styleUrls : [ './search-result-bar.component.scss' ] } ) export class SearchResultBarComponent implements OnInit , OnChanges { @ Input ( ) queryParameters : any ; @ Input ( ) searchResultList : SearchResultList ; @ Input ( ) referenceResultList : SearchResultList ; @ Input ( ) filterResultList : any [ ] ; public preSelectedFilterList : any [ ] = [ ] ; constructor ( private toast , private router ) { } public ngOnInit ( ) { this . addPreSelectedFilterItem ( this . queryParameters ) ; } public ngOnChanges ( changes ) { this . preSelectedFilterList = [ ] ; this . addPreSelectedFilterItem ( this . queryParameters ) ; } @ HostListener ( 'window:scroll' ) onWindowScroll ( ) { const dialog = document . getElementsByClassName ( 'object-view-navbar' ) as HTMLCollectionOf < any > ; dialog [ 0 ] . id = 'result-bar-action' ; if ( document . body . scrollTop > 20 || document . documentElement . scrollTop > 20 ) { dialog [ 0 ] . style . visibility = 'visible' ; dialog [ 0 ] . classList . add ( 'shadow' ) ; } else { dialog [ 0 ] . classList . remove ( 'shadow' ) ; dialog [ 0 ] . id = '' ; } } private addPreSelectedFilterItem ( value ) { JSON . parse ( value ) . filter ( f => { if ( f . hasOwnProperty ( 'settings' ) ) { this . preSelectedFilterList = [ ... this . preSelectedFilterList , { total : 0 , searchText : f . searchLabel , searchForm : 'type' , searchLabel : f . searchLabel , settings : f . settings . types } ] ; } } ) ; } public rollbackQueryParametersIfNeeded ( ) { this . reSearch ( JSON . parse ( this . queryParameters ) . filter ( x => x . searchForm === 'text' ) , true , true ) ; } private reSearch ( value , replaceUrl = false , state = false ) { this . router . navigate ( [ '/search' ] , { queryParams : { query : JSON . stringify ( value ) } , replaceUrl : true , state : { load : state } } ) ; } public async delFilterItem ( value ) { const results = await this . filter ( JSON . parse ( this . queryParameters ) , value , async ( f ) => { await Promise . resolve ( ) ; return f ; } ) ; this . reSearch ( results ) ; } public async addFilterItem ( value ) { let queryJson = await this . filter ( JSON . parse ( this . queryParameters ) , value , async ( f ) => { await Promise . resolve ( ) ; return f ; } ) ; queryJson = queryJson . concat ( { searchText : value . searchLabel , searchForm : 'type' , searchLabel : value . searchLabel , settings : value . settings } ) ; queryJson = queryJson . filter ( f => ! f . hasOwnProperty ( 'disjunction' ) ) . concat ( { searchText : 'or' , searchForm : 'disjunction' , searchLabel : 'or' , disjunction : true } ) ; this . reSearch ( queryJson ) ; } async filter ( arr , value , callback ) { const fail = Symbol ( ) ; return ( await Promise . all ( arr . map ( async ( item ) => ( await callback ( item ) ) ? item : fail ) ) ) . filter ( f => f . searchLabel !== value . searchLabel ) ; } public copyToClipboard ( ) { const parsedUrl = new URL ( window . location . href ) ; const baseUrl = parsedUrl . origin ; const selBox = document . createElement ( 'textarea' ) ; selBox . value = `${ baseUrl }/search?query=${ this . queryParameters }` ; this . generateDataForClipboard ( selBox ) ; } protected generateDataForClipboard ( selBox ) { selBox . style . position = 'fixed' ; selBox . style . left = '0' ; selBox . style . top = '0' ; selBox . style . opacity = '0' ; document . body . appendChild ( selBox ) ; selBox . focus ( ) ; selBox . select ( ) ; this . showToast ( selBox ) ; } protected showToast ( selBox ) { document . execCommand ( 'copy' ) ; document . body . removeChild ( selBox ) ; this . toast . info ( 'Content was copied to clipboard' ) ; } }