UNPKG

@pepperi/components

Version:

This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 10.0.1.

109 lines (93 loc) 4.46 kB
import { Component, OnInit, OnChanges, Input, Output, EventEmitter, ChangeDetectionStrategy, Renderer2, ElementRef, OnDestroy } from '@angular/core'; import { FormGroup } from '@angular/forms'; import { SessionService, LAYOUT_TYPE, CustomizationService } from '@pepperi/lib'; import { GROUP_BUTTONS_VIEW_TYPE } from '@pepperi/lib/group-buttons'; @Component({ selector: 'pepperi-internal-button', templateUrl: './internal-button.component.html', styleUrls: ['./internal-button.component.scss'], changeDetection: ChangeDetectionStrategy.OnPush, }) export class PepperiInternalButtonComponent implements OnInit, OnChanges, OnDestroy { @Input() key: string = ''; @Input() value: string = ''; @Input() formattedValue: string = ''; @Input() label: string = ''; @Input() referenceObjectInternalType: any; @Input() type: string = 'button'; // || 'reference' || 'listofobjects' || 'Agents' || 'ContactPersons' || 'Buyers', etc @Input() required: boolean = false; @Input() disabled: boolean = false; @Input() readonly: boolean = false; @Input() xAlignment: string = '0'; @Input() rowSpan: number = 1; controlType = 'button'; @Input() form: FormGroup = null; @Input() showTitle: boolean = true; @Input() layoutType: LAYOUT_TYPE = LAYOUT_TYPE.PepperiForm; @Output() elementClicked: EventEmitter<any> = new EventEmitter<any>(); @Output() valueChanged: EventEmitter<any> = new EventEmitter<any>(); LAYOUT_TYPE = LAYOUT_TYPE; GROUP_BUTTONS_VIEW_TYPE = GROUP_BUTTONS_VIEW_TYPE; standAlone = false; createNewReference: boolean = false; referenceButtons = [ { Value: '', Class: '', Callback: () => this.onButtonClicked(event), Icon: null }, { Value: '', Class: 'caution', Callback: () => this.remove(event), Icon: 'system-bin' }, ]; constructor(public sessionService: SessionService, private customizationService: CustomizationService, private renderer: Renderer2, public hostElement: ElementRef) { } ngOnInit() { if (this.form === null) { this.standAlone = true; this.form = this.customizationService.getDefaultFromGroup(this.key, this.value, this.required, this.readonly, this.disabled); this.formattedValue = this.formattedValue || this.value; this.renderer.addClass(this.hostElement.nativeElement, CustomizationService.STAND_ALONE_FIELD_CLASS_NAME); } } ngOnChanges(changes: any) { if (this.type === 'reference') { this.createNewReference = this.value.length === 0; this.referenceButtons[0].Value = this.formattedValue; } } ngOnDestroy() { if (this.elementClicked) { this.elementClicked.unsubscribe(); } } onButtonClicked(event) { if (this.type === 'reference') { let valueArr = this.value.split('/'); this.elementClicked.emit({ apiName: this.key, eventWhich: event.which, value: valueArr[valueArr.length - 1], //.replace(/[^a-zA-Z0-9 ]/g, ''), referenceObjectInternalType: this.referenceObjectInternalType, }); } // TODO: Uncomment - this is a feature for 16.5 // else if (this.type === 'button' && true) { // need to check if has program to run // this.elementClicked.emit({ // apiName: this.key, // eventWhich: event.which, // value: this.value // should contain the program name // // value: this.value.replace(/[^a-zA-Z0-9 ]/g, ''), // // referenceObjectInternalType: this.referenceObjectInternalType // }); // } else { this.elementClicked.emit({ apiName: this.key, eventWhich: event.which }); } } hrefFunction(event) { if (event.which === 1 /*|| event.which === 2*/) { this.onButtonClicked(event); } } openReferenceObjectInternal(event) { this.elementClicked.emit({ apiName: this.key, eventWhich: event.which, value: this.value, referenceObjectInternalType: this.referenceObjectInternalType }); } remove(event) { this.value = ''; this.valueChanged.emit({ apiName: this.key, value: this.value }); } }