UNPKG

angular-easy-form

Version:
16 lines (14 loc) 15.8 kB
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@angular/core"),require("@ngx-translate/http-loader"),require("@angular/forms"),require("moment"),require("@ngx-translate/core"),require("@angular/material/input"),require("@angular/common"),require("@angular/platform-browser"),require("@angular/material/form-field"),require("@angular/platform-browser/animations"),require("@angular/cdk/text-field"),require("@angular/material/autocomplete"),require("@angular/material/select"),require("@angular/common/http")):"function"==typeof define&&define.amd?define("angular-easy-form",["exports","@angular/core","@ngx-translate/http-loader","@angular/forms","moment","@ngx-translate/core","@angular/material/input","@angular/common","@angular/platform-browser","@angular/material/form-field","@angular/platform-browser/animations","@angular/cdk/text-field","@angular/material/autocomplete","@angular/material/select","@angular/common/http"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self)["angular-easy-form"]={},e.ng.core,e.httpLoader,e.ng.forms,e.moment,e.core,e.ng.material.input,e.ng.common,e.ng.platformBrowser,e.ng.material.formField,e.ng.platformBrowser.animations,e.ng.cdk.textField,e.ng.material.autocomplete,e.ng.material.select,e.ng.common.http)}(this,(function(e,t,n,o,i,r,a,l,s,u,p,c,f,m,d){"use strict";function g(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(n){if("default"!==n){var o=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,o.get?o:{enumerable:!0,get:function(){return e[n]}})}})),t.default=e,Object.freeze(t)}var h=g(i); /*! ***************************************************************************** Copyright (c) Microsoft Corporation. Permission to use, copy, modify, and/or distribute this software for any purpose with or without fee is hereby granted. THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE. ***************************************************************************** */Object.create;function y(e,t){var n="function"==typeof Symbol&&e[Symbol.iterator];if(!n)return e;var o,i,r=n.call(e),a=[];try{for(;(void 0===t||t-- >0)&&!(o=r.next()).done;)a.push(o.value)}catch(e){i={error:e}}finally{try{o&&!o.done&&(n=r.return)&&n.call(r)}finally{if(i)throw i.error}}return a}Object.create;var v=function(){function e(){this.allFields=[]}return e.prototype.text=function(e){e.type="text",this.allFields.push(e)},e.prototype.number=function(e){e.type="number",this.allFields.push(e)},e.prototype.textArea=function(e){e.type="textArea",this.allFields.push(e)},e.prototype.date=function(e){e.type="date",this.allFields.push(e)},e.prototype.select=function(e){e.type="select",this.allFields.push(e)},e.prototype.checkbox=function(e){e.type="checkbox",this.allFields.push(e)},e.prototype.searchInput=function(e){e.type="searchInput",this.allFields.push(e)},e.prototype.getFields=function(){return this.allFields},e}();v.ɵprov=t.ɵɵdefineInjectable({factory:function(){return new v},token:v,providedIn:"root"}),v.decorators=[{type:t.Injectable,args:[{providedIn:"root"}]}];var I=function(){function e(e){this.fields=e,this.fieldsBuilded=[],this.fieldsClass=e,this.config={style:this.styleGlobal}}return e.prototype.generateMatriz=function(){var e=this;this.decreaseFields(),this.matriz.map((function(t){e.fieldsBuilded.push(e.buildingFields(t)),e.fieldsIteration=e.fieldsIteration.slice(t,e.fieldsIteration.length)}))},e.prototype.decreaseFields=function(){return this.fieldsIteration=function(){for(var e=[],t=0;t<arguments.length;t++)e=e.concat(y(arguments[t]));return e}(this.fieldsClass.getFields())},e.prototype.buildingFields=function(e){for(var t=[],n=this.fieldsIteration,o=0;o<n.length;)e>o&&t.push(n[o]),o++;return t},e.prototype.field=function(){return this.fieldsClass},e.prototype.build=function(){return this.generateMatriz(),this.fieldsBuilded||this.fieldsClass.getFields()},e}();I.ɵprov=t.ɵɵdefineInjectable({factory:function(){return new I(t.ɵɵinject(v))},token:I,providedIn:"root"}),I.decorators=[{type:t.Injectable,args:[{providedIn:"root"}]}],I.ctorParameters=function(){return[{type:v}]};var b=function(){function e(e){this.themConfig=e,this.eventsForm=new t.EventEmitter,this.allFields={},this.valueEvent={},this.otherEvents={},this.masterConfig={},this.showGroups=!1,this.setFieldsConfig=[],this.masterConfig={}}return e.prototype.setLanguage=function(e){this.lang=e},e.prototype.ngOnInit=function(){console.log("testeappa"),this.populateGroup()},e.prototype.formOptions=function(){return this.themConfig},e.prototype.eventGroupFields=function(e){this.agregateResult(e),this.valueEvent={otherEvents:this.allFields,values:Object.assign(this.otherEvents,e[Object.keys(e)[0].toString()][0])},this.eventsForm.emit(this.valueEvent)},e.prototype.agregateResult=function(e){this.allFields=Object.assign(this.allFields,e)},e.prototype.populateGroup=function(){this.masterConfig.fields=this.setFieldsConfig,this.masterConfig.lang=this.lang,this.showGroups=!!this.setFieldsConfig},e}();b.decorators=[{type:t.Component,args:[{selector:"lib-angular-easy-form",template:"<div *ngIf=\"showGroups\">\r\n <lib-group-fields *ngFor=\"let horizontalFields of masterConfig.fields\"\r\n [style]='masterConfig.style' \r\n [configGroup]='horizontalFields'\r\n [setLang]=' masterConfig.lang'\r\n (eventGroupInput) ='eventGroupFields($event)'\r\n ></lib-group-fields>\r\n</div>\r\n",styles:["./angular-easy-form.component.css"]}]}],b.ctorParameters=function(){return[{type:I}]},b.propDecorators={eventsForm:[{type:t.Output}],setFieldsConfig:[{type:t.Input}]};var F=new b(new I(new v)),C=function(){function e(e){this.fb=e,this.eventInput=new t.EventEmitter}return e.prototype.ngOnInit=function(){this.initiFb(),this.getFormChanges()},e.prototype.initiFb=function(){var e={};this.setFormatDateField(),e[this.configInput.alias.toString()]=[{value:this.configInput.value||"",disabled:this.configInput.disable||!1}],this.inputForm=this.fb.group(e),this.eventInput.emit(this.inputForm)},e.prototype.setFormatDateField=function(){"date"===this.configInput.type&&(this.configInput.value=h(this.configInput.value).format(this.configInput.format||"YYYY-MM-DD"))},e.prototype.getFormChanges=function(){var e=this;this.inputForm.valueChanges.subscribe((function(){e.eventInput.emit(e.inputForm)}))},e.prototype.eventValue=function(e){this.eventInput.emit({alias:this.configInput.alias,type:"searchForm",value:e})},e}();C.decorators=[{type:t.Component,args:[{selector:"lib-input",template:'<mat-form-field \n*ngIf="configInput.type !== \'textarea\' &&\n configInput.type !== \'select\' &&\n configInput.type !== \'checkbox\' && \n configInput.type !== \'searchInput\'"\n \n [style]="configInput?.style" [formGroup]="inputForm">\n <mat-label>{{configInput.label || \'\' | translate}}</mat-label>\n <input [type]="configInput.type"\n matInput [placeholder]=\'configInput?.placeholder || "" \'\n [value]=\'configInput?.value || "" \'\n [minlength]=\'configInput?.miniLength || "" \'\n [maxlength]=\'configInput?.maxLength || "" \'\n [pattern] = \'configInput?.pattern || "" \'\n [required]= \'configInput?.required || false \'\n [formControlName]=\'configInput?.alias || "" \' >\n</mat-form-field>\n\n<mat-form-field *ngIf="configInput.type === \'textarea\'" [style]="configInput?.style" [formGroup]="inputForm">\n <mat-label>{{configInput.label || \'\' | translate}}</mat-label>\n <textarea matInput [value]=\'configInput.value || "" \'\n [required]= \'configInput?.required || false\'\n [formControlName]=\'configInput?.alias || "" \'\n [pattern] = \'configInput?.pattern || "" \'\n [minlength]=\'configInput?.miniLength || "" \'\n [maxlength]=\'configInput?.maxLength || "" \'\n resizetofitcontent\n cdkTextareaAutosize\n ></textarea>\n</mat-form-field>\n\n<mat-form-field *ngIf="configInput.type === \'select\'" [style]=\'configInput?.style || "" \' [formGroup]="inputForm">\n <mat-label>{{configInput.label || \'\' | translate}}</mat-label>\n <select matNativeControl [required]=\'configInput?.required || false \' [formControlName]=\'configInput?.alias || "" \'>\n <option *ngIf=\'configInput.startEmpty || false\' value=""> ----- </option>\n <option *ngFor="let option of configInput.setOptions" [value]="option.id"> {{option.value}}</option>\n </select>\n</mat-form-field>\n\n<div class="check-default" [style]=\'configInput?.style || "" \' *ngIf="configInput.type === \'checkbox\'" [formGroup]="inputForm">\n <input type="checkbox" [checked]=\'configInput?.checked || false \' [formControlName]=\'configInput?.alias || "" \'>\n <label class="check-label" for="scales">{{configInput.label || \'\' | translate}}</label>\n</div>\n\n<div class="check-form" *ngIf="configInput.type === \'searchInput\'" [style]="configInput?.style">\n <app-inputsearch\n [label]=\'configInput?.label || " " | translate\'\n [validate]=\'configInput.validated || false \'\n [preSelected]=\'configInput?.valuePreselected || "" \'\n [preSelectedComparer]=\'\'\n [allData]=\'configInput?.dataOptions || "" \'\n [itemValue]=\'configInput?.valueData || "" \'\n [itemResult]=\'configInput?.showedData || "" \'\n (sendValue)="eventValue($event)">\n </app-inputsearch>\n</div>\n\n\n',styles:[".check-default{align-items:baseline;display:flex;margin:18px 0 0}.check-label{margin-left:4%}.mat-form-field,.mat-form-field-infix{width:100%}"]}]}],C.ctorParameters=function(){return[{type:o.FormBuilder}]},C.propDecorators={configInput:[{type:t.Input}],eventInput:[{type:t.Output}],applyLang:[{type:t.Input}]};var x=function(){function e(e){this.translate=e,this.eventGroupInput=new t.EventEmitter,this.fieldsGroup={},this.translate.addLangs(["en","pt"]),e.setDefaultLang("pt"),e.use(this.setLang||localStorage.getItem("locale")||"pt")}return e.prototype.ngOnInit=function(){},e.prototype.eventFields=function(e){"searchForm"===e.type?(this.fieldsGroup[e.alias]={value:e.value,isValid:e.valid},this.eventGroupInput.emit(this.fieldsGroup)):(this.fieldsGroup[Object.keys(e.value)[0]||Object.keys(e)[0]]=[e.value,e.valid,e],this.eventGroupInput.emit(this.fieldsGroup))},e}();x.decorators=[{type:t.Component,args:[{selector:"lib-group-fields",template:'<div class="horizontal-group" *ngIf="configGroup && configGroup.length > 0">\n <lib-input *ngFor="let field of configGroup" class="input-dyn" [applyLang]=\'setLang\' [style]="field?.styleHorizontal || \'width:100%;\'" [configInput]=\'field\' (eventInput)="eventFields($event)"></lib-input>\n</div>\n\n\n',styles:[".horizontal-group{display:flex;flex-direction:row}.input-dyn{margin-left:1%}"]}]}],x.ctorParameters=function(){return[{type:r.TranslateService}]},x.propDecorators={configGroup:[{type:t.Input}],eventGroupInput:[{type:t.Output}],setLang:[{type:t.Input}]};var w=function(){function e(){this.allData=[],this.preSelected="",this.sendValue=new t.EventEmitter,this.sendKeyEvent=new t.EventEmitter,this.focusField=!1,this.myControl=new o.FormControl,this.allComplete=[],this.callNumber=0,this.callOne=0}return e.prototype.ngOnInit=function(){var e=this;this.allComplete=this.allData||[],this.allComplete.map((function(t){var n=t[e.itemResult].toLowerCase();if(t[e.preSelectedComparer]===e.preSelected)return e.myControl.setValue(n.toUpperCase()),void e.filter(e.preSelected)})),this.myControl.valueChanges.subscribe((function(t){e.globalTrigger&&e.globalTrigger.openPanel(),""===t&&e.sendValue.emit({id:"",name:e.label}),""===t&&0===e.callNumber&&(e.allComplete=e.allData,e.callNumber=1),e.filter(t)}))},e.prototype.ngOnChanges=function(e){this.allComplete=e.allData.currentValue},e.prototype.onKey=function(e){this.sendKeyEvent.emit({eventSent:e,field:this.myControl})},e.prototype.filter=function(e){var t=this,n="string"==typeof e?e.toLowerCase():e,o=[];this.allData.map((function(e){("string"==typeof e[t.itemResult]?e[t.itemResult].toLowerCase():e[t.itemResult]).includes(n)&&(t.valuSelectedInit=e.id,o.push(e))})),o.length>1&&0===this.callNumber?(setTimeout((function(){t.autoTrigger.openPanel()}),200),this.callNumber=1):"Delivery Address"===this.label&&0===this.callOne&&(this.selected(this.valuSelectedInit,this.label),this.callOne=1),this.allComplete=o},e.prototype.eventClick=function(e,t){this.globalTrigger=t,t.openPanel()},e.prototype.selected=function(e,t){e&&this.sendValue.emit({id:e,name:this.label})},e}();w.decorators=[{type:t.Component,args:[{changeDetection:t.ChangeDetectionStrategy.OnPush,selector:"app-inputsearch",template:'<div class=\'group-input\'>\n <label *ngIf="label" >{{label}}</label>\n <mat-form-field class="form-group" [style.background-color]="myControl.status === \'INVALID\' && validate ? \'rgb(232, 154, 154)\' : \'\'">\n <input class="multipleSelect" type="text" [matAutocomplete]="auto" required\n (keyup)="onKey($event)"\n aria-label="Number"\n matInput\n #trigger="matAutocompleteTrigger"\n (click)=\'eventClick($event,trigger)\'\n [formControl]="myControl"\n [matAutocomplete]="auto">\n <mat-autocomplete #auto="matAutocomplete" showPanel="true" #selectInp\n >\n <mat-option *ngFor="let item of allComplete" style="display: block" (click)=\'selected(item[itemValue], label); $event.stopPropagation()\' [value]="item[itemResult]">\n {{item[itemResult]}}\n </mat-option>\n </mat-autocomplete>\n </mat-form-field>\n</div>\n',encapsulation:t.ViewEncapsulation.ShadowDom,styles:[".border-input{border:1px solid grey!important}.group-input{display:flex;flex-direction:column}label{margin-bottom:8px}.mat-form-field-appearance-legacy .mat-form-field-underline{height:0!important}.mat-input-element{padding-left:0}.mat-form-field-appearance-legacy .mat-form-field-infix{border:1px solid #dcdcdc;border-radius:4px 5px;margin-top:0;padding:8px 0 8px 9px}.mat-form-field-infix{width:100%}"]}]}],w.ctorParameters=function(){return[]},w.propDecorators={nameField:[{type:t.ViewChild,args:["selectInp"]}],autoTrigger:[{type:t.ViewChild,args:[f.MatAutocompleteTrigger,{static:!0}]}],allData:[{type:t.Input}],searchDefault:[{type:t.Input}],preSelected:[{type:t.Input}],preSelectedComparer:[{type:t.Input}],label:[{type:t.Input}],itemValue:[{type:t.Input}],itemResult:[{type:t.Input}],sendValue:[{type:t.Output}],sendKeyEvent:[{type:t.Output}],validate:[{type:t.Input}],readOnly:[{type:t.Input}]};var O=function(e){return new n.TranslateHttpLoader(e,"../src/assets/i18n/",".json")},k=function(){};k.decorators=[{type:t.NgModule,args:[{declarations:[b,C,x,w],imports:[l.CommonModule,s.BrowserModule,p.BrowserAnimationsModule,a.MatInputModule,c.TextFieldModule,o.ReactiveFormsModule,u.MatFormFieldModule,f.MatAutocompleteModule,m.MatSelectModule,u.MatFormFieldModule,r.TranslateModule.forRoot({loader:{provide:r.TranslateLoader,useFactory:O,deps:[d.HttpClient]}})],exports:[b]}]}],e.AngularEasyFormComponent=b,e.AngularEasyFormModule=k,e.HttpLoaderFactory=function(e){return new n.TranslateHttpLoader(e,"./src/assets/i18n/",".json")},e.createTranslateLoader=O,e.options=F,e.ɵa=I,e.ɵb=v,e.ɵc=C,e.ɵd=x,e.ɵe=w,Object.defineProperty(e,"__esModule",{value:!0})})); //# sourceMappingURL=angular-easy-form.umd.min.js.map