@ -23,29 +23,30 @@ import {
Inject ,
InjectionToken ,
Input ,
OnDestroy ,
OnInit ,
Optional ,
TemplateRef ,
ViewChild ,
ViewContainerRef
} from '@angular/core' ;
import { ControlValueAccessor , NG_VALUE_ACCESSOR , UntypedFormBuilder , UntypedFormGroup } from '@angular/forms' ;
import { ControlValueAccessor , FormBuilder , FormGroup , NG_VALUE_ACCESSOR } from '@angular/forms' ;
import { coerceBoolean } from '@shared/decorators/coercion' ;
import { ConnectedPosition , Overlay , OverlayConfig , OverlayRef } from '@angular/cdk/overlay' ;
import { TemplatePortal } from '@angular/cdk/portal' ;
import { TranslateService } from '@ngx-translate/core' ;
import { DeviceInfoFilter } from '@shared/models/device.models' ;
import { isDefinedAndNotNull } from '@core/utils' ;
import { deepClone , isDefinedAndNotNull , isEmpty , isUndefinedOr Null } from '@core/utils' ;
import { EntityInfoData } from '@shared/models/entity.models' ;
import { DeviceProfileService } from '@core/http/device-profile.service' ;
import { takeUntilDestroyed } from '@angular/core/rxjs-interop' ;
import { fromEvent , Subscription } from 'rxjs' ;
export const DEVICE_FILTER_CONFIG_DATA = new InjectionToken < any > ( 'DeviceFilterConfigData' ) ;
export interface DeviceFilterConfigData {
panelMode : boolean ;
deviceInfoFilter : DeviceInfoFilter ;
initialFilterConfig? : DeviceInfoFilter ;
}
// @dynamic
@ -61,7 +62,7 @@ export interface DeviceFilterConfigData {
}
]
} )
export class DeviceInfoFilterComponent implements OnInit , OnDestroy , ControlValueAccessor {
export class DeviceInfoFilterComponent implements OnInit , ControlValueAccessor {
@ViewChild ( 'deviceFilterPanel' )
deviceFilterPanel : TemplateRef < any > ;
@ -72,19 +73,25 @@ export class DeviceInfoFilterComponent implements OnInit, OnDestroy, ControlValu
@Input ( )
buttonMode = true ;
@Input ( )
initialDeviceFilterConfig : DeviceInfoFilter = {
deviceProfileId : null ,
active : null
} ;
panelMode = false ;
buttonDisplayValue = this . translate . instant ( 'device.device-filter' ) ;
buttonDisplayValue = this . translate . instant ( 'device.device-filter-title ' ) ;
deviceInfoFilterForm : UntypedFormGroup ;
deviceInfoFilterForm : FormGroup ;
deviceFilterOverlayRef : OverlayRef ;
panelResult : DeviceInfoFilter = null ;
private deviceProfileInfo : EntityInfoData ;
private deviceInfoFilter : DeviceInfoFilter ;
private resizeWindows : Subscription ;
private propagateChange = ( _ : any ) = > { } ;
@ -92,7 +99,7 @@ export class DeviceInfoFilterComponent implements OnInit, OnDestroy, ControlValu
private data : DeviceFilterConfigData | undefined ,
@Optional ( )
private overlayRef : OverlayRef ,
private fb : Untyped FormBuilder,
private fb : FormBuilder ,
private translate : TranslateService ,
private overlay : Overlay ,
private nativeElement : ElementRef ,
@ -106,6 +113,10 @@ export class DeviceInfoFilterComponent implements OnInit, OnDestroy, ControlValu
if ( this . data ) {
this . panelMode = this . data . panelMode ;
this . deviceInfoFilter = this . data . deviceInfoFilter ;
this . initialDeviceFilterConfig = this . data . initialFilterConfig ;
if ( this . panelMode && ! this . initialDeviceFilterConfig ) {
this . initialDeviceFilterConfig = deepClone ( this . deviceInfoFilter ) ;
}
}
this . deviceInfoFilterForm = this . fb . group ( {
deviceProfileId : [ null , [ ] ] ,
@ -115,7 +126,6 @@ export class DeviceInfoFilterComponent implements OnInit, OnDestroy, ControlValu
takeUntilDestroyed ( this . destroyRef )
) . subscribe (
( ) = > {
this . updateValidators ( ) ;
if ( ! this . buttonMode ) {
this . deviceFilterUpdated ( this . deviceInfoFilterForm . value ) ;
}
@ -126,14 +136,11 @@ export class DeviceInfoFilterComponent implements OnInit, OnDestroy, ControlValu
}
}
ngOnDestroy ( ) : void {
}
registerOnChange ( fn : any ) : void {
this . propagateChange = fn ;
}
registerOnTouched ( fn : any ) : void {
registerOnTouched ( _ fnany ) : void {
}
setDisabledState ( isDisabled : boolean ) : void {
@ -142,19 +149,18 @@ export class DeviceInfoFilterComponent implements OnInit, OnDestroy, ControlValu
this . deviceInfoFilterForm . disable ( { emitEvent : false } ) ;
} else {
this . deviceInfoFilterForm . enable ( { emitEvent : false } ) ;
this . updateValidators ( ) ;
}
}
writeValue ( deviceInfoFilter? : DeviceInfoFilter ) : void {
this . deviceInfoFilter = deviceInfoFilter ;
if ( ! this . initialDeviceFilterConfig && deviceInfoFilter ) {
this . initialDeviceFilterConfig = deepClone ( deviceInfoFilter ) ;
}
this . updateButtonDisplayValue ( ) ;
this . updateDeviceInfoFilterForm ( deviceInfoFilter ) ;
}
private updateValidators() {
}
toggleDeviceFilterPanel ( $event : Event ) {
if ( $event ) {
$event . stopPropagation ( ) ;
@ -183,6 +189,9 @@ export class DeviceInfoFilterComponent implements OnInit, OnDestroy, ControlValu
} ) ;
this . deviceFilterOverlayRef . attach ( new TemplatePortal ( this . deviceFilterPanel ,
this . viewContainerRef ) ) ;
this . resizeWindows = fromEvent ( window , 'resize' ) . subscribe ( ( ) = > {
this . deviceFilterOverlayRef . updatePosition ( ) ;
} ) ;
}
cancel() {
@ -190,40 +199,62 @@ export class DeviceInfoFilterComponent implements OnInit, OnDestroy, ControlValu
if ( this . overlayRef ) {
this . overlayRef . dispose ( ) ;
} else {
this . resizeWindows . unsubscribe ( ) ;
this . deviceFilterOverlayRef . dispose ( ) ;
}
}
update() {
this . deviceFilterUpdated ( this . deviceInfoFilterForm . value ) ;
this . deviceInfoFilterForm . markAsPristine ( ) ;
if ( this . panelMode ) {
this . panelResult = this . deviceInfoFilter ;
}
if ( this . overlayRef ) {
this . overlayRef . dispose ( ) ;
} else {
this . resizeWindows . unsubscribe ( ) ;
this . deviceFilterOverlayRef . dispose ( ) ;
}
}
reset() {
const deviceInfoFilter = this . deviceFilterFromFormValue ( this . deviceInfoFilterForm . value ) ;
if ( ! this . deviceInfoFilterConfigEquals ( deviceInfoFilter , this . initialDeviceFilterConfig ) ) {
this . updateDeviceInfoFilterForm ( this . initialDeviceFilterConfig ) ;
this . deviceInfoFilterForm . markAsDirty ( ) ;
}
}
deviceProfileChanged ( deviceProfileInfo : EntityInfoData ) {
this . deviceProfileInfo = deviceProfileInfo ;
this . updateButtonDisplayValue ( ) ;
}
private deviceInfoFilterConfigEquals = ( filter1? : DeviceInfoFilter , filter2? : DeviceInfoFilter ) : boolean = > {
if ( filter1 === filter2 ) {
return true ;
}
if ( ( isUndefinedOrNull ( filter1 ) || isEmpty ( filter1 ) ) && ( isUndefinedOrNull ( filter2 ) || isEmpty ( filter2 ) ) ) {
return true ;
} else if ( isDefinedAndNotNull ( filter1 ) && isDefinedAndNotNull ( filter2 ) ) {
if ( filter1 . active !== filter2 . active ) {
return false ;
}
return filter1 . deviceProfileId === filter2 . deviceProfileId ;
}
return false ;
} ;
private updateDeviceInfoFilterForm ( deviceInfoFilter? : DeviceInfoFilter ) {
this . deviceInfoFilterForm . patchValue ( {
deviceProfileId : deviceInfoFilter?.deviceProfileId ,
active : isDefinedAndNotNull ( deviceInfoFilter ? . active ) ? deviceInfoFilter ? . active : ''
deviceProfileId : deviceInfoFilter?.deviceProfileId ? ? null ,
active : deviceInfoFilter?.active ? ? null
} , { emitEvent : false } ) ;
this . updateValidators ( ) ;
}
private deviceFilterUpdated ( deviceInfoFilter : DeviceInfoFilter ) {
this . deviceInfoFilter = deviceInfoFilter ;
if ( ( this . deviceInfoFilter . active as any ) === '' ) {
this . deviceInfoFilter . active = null ;
}
this . deviceInfoFilter = this . deviceFilterFromFormValue ( deviceInfoFilter ) ;
this . updateButtonDisplayValue ( ) ;
this . propagateChange ( this . deviceInfoFilter ) ;
}
@ -256,4 +287,10 @@ export class DeviceInfoFilterComponent implements OnInit, OnDestroy, ControlValu
}
}
private deviceFilterFromFormValue ( formValue : any ) : DeviceInfoFilter {
return {
deviceProfileId : formValue?.deviceProfileId ? ? null ,
active : formValue?.active ? ? null
} ;
}
}
Mazurenko Nikita
9 months ago
GitHub