@adins/ucsearch 2.0.54 → 2.0.55

package/adins-ucsearch.metadata.json

@@ -1 +1 @@
-{"__symbolic":"module","version":4,"metadata":{"UCSearchService":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":2,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor"}]},"statics":{"ngInjectableDef":{}}},"UCSearchComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":13,"character":1},"arguments":[{"selector":"lib-UCSearch","providers":[{"__symbolic":"reference","name":"ɵa"}],"animations":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"trigger","line":19,"character":4},"arguments":["changeDivSize",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"state","line":20,"character":6},"arguments":["initial",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":20,"character":23},"arguments":[{"height":"*","opacity":"1"}]}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"state","line":24,"character":6},"arguments":["final",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":24,"character":21},"arguments":[{"height":"0px","opacity":"0","overflow":"hidden"}]}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition","line":29,"character":6},"arguments":["initial=>final",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animate","line":29,"character":35},"arguments":["300ms"]}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition","line":30,"character":6},"arguments":["final=>initial",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animate","line":30,"character":35},"arguments":["300ms"]}]}]]}],"template":"<!-- Basic form layout section start -->\r\n<section id=\"horizontal-form-layouts\">\r\n  <div class=\"row text-left\">\r\n    <div class=\"col-md-12\">\r\n      <div class=\"card\">\r\n        <div class=\"pl-3 mb-2 mt-2\" *ngIf=\"configuration?.title != undefined && configuration?.title != ''\">\r\n          <h4 class=\"card-title ucSearch-title\" translate> {{ configuration.title }} </h4>\r\n        </div>\r\n        <div class=\"card-body\">\r\n          <div class=\"px-3\">\r\n            <form class=\"form form-horizontal\" id=\"formSearch\" #formIdSearch #enjiForm=\"ngForm\" (ngSubmit)=\"false\">\r\n              <div class=\"form-body\">\r\n                <h4 class=\"form-section font-weight-bold\">\r\n                  <div (click)=\"changeState()\" class=\"btn no-padding cursor-pointer flip\">\r\n                    <i class=\"fa\" style=\"font-size: 15px; margin: 0px 0px 5px -15px;\"\r\n                      [ngClass]=\"isHidden ? 'fa-chevron-right' : 'fa-chevron-down'\"></i>\r\n                  </div>\r\n                  <span\r\n                    *ngIf=\"configuration?.sectionTitle != undefined && configuration?.sectionTitle != ''; then inputSectionTitle else defaultSectionTitle\"></span>\r\n                  <ng-template #inputSectionTitle>\r\n                    {{configuration?.sectionTitle}}\r\n                  </ng-template>\r\n                  <ng-template #defaultSectionTitle>\r\n                    Paging\r\n                  </ng-template>\r\n                </h4>\r\n                <!-- Ini Digunakan untuk Generate Dynamic Component -->\r\n                <!-- [hidden]=\"isHidden\" -->\r\n                <div class=\"panel-active\" [@changeDivSize]=currentState>\r\n                  <div class=\"row\">\r\n                    <div class=\"col-md-6 form-group\" *ngFor=\"let question of configuration?.component\">\r\n                      <div class=\"col-md-12\">\r\n                        <div class=\"row\">\r\n                          <label class=\"col-md-5 no-padding\" for=\"{{question.id}}\" translate>{{question.label}}</label>\r\n                          <div class=\"col-md-7 no-padding\">\r\n                            <div *ngIf=\"question.type=='textbox'\">\r\n                              <input type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                attr.data-type=\"{{question.datatype}}\" attr.data-restriction=\"{{question.restriction}}\">\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='textarea'\">\r\n                              <textarea type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                name=\"{{question.name}}\" attr.data-type=\"{{question.datatype}}\"\r\n                                value=\"{{question.value}}\"></textarea>\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='numeric'\">\r\n                              <input type=\"text\" id=\"{{question.id}}\" (focus)=\"transformToDecimal($event)\"\r\n                                (blur)=\"transformAmount($event)\" class=\"form-control search-form-control\"\r\n                                name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                attr.data-restriction=\"{{question.restriction}}\" attr.data-type=\"{{question.datatype}}\">\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='currency'\">\r\n                              <span\r\n                                *ngIf=\"question?.isCustom != undefined && question?.isCustom; then customTypeCurrency else defaultTypeCurrency\"></span>\r\n                              <ng-template #customTypeCurrency>\r\n                                <input type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                  name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                  attr.data-restriction=\"{{question.restriction}}\"\r\n                                  attr.data-type=\"{{question.datatype}}\" currencyMask\r\n                                  [options]=\"{ thousands: 'question.thousands', decimal: '.', align: 'right', allowNegative: false, allowZero:true, precision: 2, nullable: false }\">\r\n                              </ng-template>\r\n                              <ng-template #defaultTypeCurrency>\r\n                                <input type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                  name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                  attr.data-restriction=\"{{question.restriction}}\"\r\n                                  attr.data-type=\"{{question.datatype}}\" currencyMask\r\n                                  [options]=\"{ thousands: question.thousands, decimal: question.decimal, align: question.align, allowNegative: question.allowNegative, allowZero: question.allowZero, precision: question.precision, nullable: question.nullable }\">\r\n                              </ng-template>\r\n                            </div>\r\n\r\n                            <!-- End Hardcode Lookup didalem-->\r\n                            <div *ngIf=\"question.type=='datepicker'\">\r\n                              <input type=\"date\" id=\"{{question.id}}\"\r\n                                class=\"form-control search-form-control btn-lookup\" name=\"{{question.name}}\"\r\n                                value=\"{{question.value}}\" attr.data-type=\"{{question.datatype}}\"\r\n                                (keyup.enter)=\"searchClick()\" attr.data-restriction=\"{{question.restriction}}\">\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='dropdown'\">\r\n                              <!-- Ini kalau datanya tidak di load dari URL -->\r\n                              <div *ngIf=\"!question.isFromURL\">\r\n                                <select name=\"{{question.name}}\" class=\"form-control search-form-control\"\r\n                                  attr.query-in=\"{{question.isQueryIn}}\" attr.data-type=\"{{question.datatype}}\">\r\n                                  <option *ngIf=\"!question.isSelectOne\" value=\"All\">\r\n                                    All\r\n                                  </option>\r\n                                  <option *ngFor=\"let item of question?.items\" value=\"{{item.key}}\">\r\n                                    {{item.value}}\r\n                                  </option>\r\n                                </select>\r\n                              </div>\r\n                              <!-- Ini kalau datanya di load dari URL -->\r\n                              <div *ngIf=\"question.isFromURL\">\r\n                                <div *ngIf=\"question.isEvent\">\r\n                                  <select name=\"{{question.name}}\"\r\n                                    (change)=\"onChangeEvent($event.target.value, question)\"\r\n                                    class=\"form-control search-form-control\" attr.query-in=\"{{question.isQueryIn}}\"\r\n                                    attr.data-type=\"{{question.datatype}}\">\r\n                                    <option *ngIf=\"!question.isSelectOne\" value=\"All\">\r\n                                      All\r\n                                    </option>\r\n                                    <option *ngFor=\"let item of question?.itemsUrl\" value=\"{{item.Key}}\">\r\n                                      {{item.Value}}\r\n                                    </option>\r\n                                  </select>\r\n                                </div>\r\n                                <div *ngIf=\"!question.isEvent\">\r\n                                  <select name=\"{{question.name}}\" class=\"form-control search-form-control\"\r\n                                    attr.query-in=\"{{question.isQueryIn}}\" attr.data-type=\"{{question.datatype}}\">\r\n                                    <option *ngIf=\"!question.isSelectOne\" value=\"All\">\r\n                                      All\r\n                                    </option>\r\n                                    <option *ngFor=\"let item of question?.itemsUrl\" value=\"{{item.Key}}\">\r\n                                      {{item.Value}}\r\n                                    </option>\r\n                                  </select>\r\n                                </div>\r\n                              </div>\r\n                            </div>\r\n                          </div>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                  <div class=\"col-md-12 no-padding\">\r\n                    <form>\r\n                      <div class=\"form-actions right\">\r\n                        <button *ngIf=\"exportData == true\" type=\"button\" (click)=\"exportAsXLSX()\"\r\n                          class=\"btn btn-raised btn-success mr-1\" translate>\r\n                          <i class=\"fa ft-download\"></i> Export Excel\r\n                        </button>\r\n                        <button type=\"button\" (click)=\"reset()\" class=\"btn btn-raised btn-warning mr-1\" translate>\r\n                          <i class=\"fa fa-times\"></i> Reset\r\n                        </button>\r\n                        <button type=\"button\" (click)=\"searchClick()\" class=\"btn btn-raised btn-primary\" #UCSearchClick\r\n                          translate>\r\n                          <i class=\"fa fa-search\"></i> Search\r\n                        </button>\r\n                      </div>\r\n                    </form>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n            </form>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</section>\r\n<br>\r\n<!-- // Basic form layout section end -->","styles":[".ucSearch-title{margin:3px}"]}]}],"members":{"myForm":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":36,"character":3},"arguments":["formIdSearch"]}]}],"searchInput":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":37,"character":3}}]}],"pageSize":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":38,"character":3}}]}],"result":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":39,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,null,null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":55,"character":108},"arguments":[{"__symbolic":"reference","module":"@angular/platform-browser","name":"DOCUMENT","line":55,"character":115}]}]],"parameters":[{"__symbolic":"reference","module":"@angular/common/http","name":"HttpClient","line":55,"character":28},{"__symbolic":"reference","name":"ɵa"},{"__symbolic":"reference","module":"@angular/core","name":"Renderer2","line":55,"character":96},null]}],"changeState":[{"__symbolic":"method"}],"ngOnInit":[{"__symbolic":"method"}],"initiateForm":[{"__symbolic":"method"}],"getJSON":[{"__symbolic":"method"}],"postJSON":[{"__symbolic":"method"}],"searchClick":[{"__symbolic":"method"}],"reset":[{"__symbolic":"method"}],"search":[{"__symbolic":"method"}],"lessThanFour":[{"__symbolic":"method"}],"resolveObject":[{"__symbolic":"method"}],"transformAmount":[{"__symbolic":"method"}],"transformToDecimal":[{"__symbolic":"method"}],"exportAsXLSX":[{"__symbolic":"method"}],"onChangeEvent":[{"__symbolic":"method"}],"switchCase":[{"__symbolic":"method"}]}},"customCurrencyMaskConfig":{"align":"right","allowNegative":false,"allowZero":true,"decimal":".","precision":2,"prefix":"","suffix":"","thousands":",","nullable":false,"inputMode":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"ngx-currency","name":"CurrencyMaskInputMode","line":16,"character":13},"member":"NATURAL"}},"UCSearchModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":18,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"UCSearchComponent"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":21,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":22,"character":4},{"__symbolic":"call","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"ngx-currency","name":"NgxCurrencyModule","line":23,"character":4},"member":"forRoot"},"arguments":[{"__symbolic":"reference","name":"customCurrencyMaskConfig"}]}],"exports":[{"__symbolic":"reference","name":"UCSearchComponent"}]}]}],"members":{}},"ɵa":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":7,"character":1}}],"members":{"__ctor__":[{"__symbolic":"constructor"}],"exportAsExcelFile":[{"__symbolic":"method"}],"saveAsExcelFile":[{"__symbolic":"method"}]}}},"origins":{"UCSearchService":"./lib/ucsearch.service","UCSearchComponent":"./lib/ucsearch.component","customCurrencyMaskConfig":"./lib/ucsearch.module","UCSearchModule":"./lib/ucsearch.module","ɵa":"./lib/services/excel-service/excel-service"},"importAs":"@adins/ucsearch"}
+{"__symbolic":"module","version":4,"metadata":{"UCSearchService":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":2,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor"}]},"statics":{"ngInjectableDef":{}}},"UCSearchComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":13,"character":1},"arguments":[{"selector":"lib-UCSearch","providers":[{"__symbolic":"reference","name":"ɵa"}],"animations":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"trigger","line":19,"character":4},"arguments":["changeDivSize",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"state","line":20,"character":6},"arguments":["initial",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":20,"character":23},"arguments":[{"height":"*","opacity":"1"}]}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"state","line":24,"character":6},"arguments":["final",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":24,"character":21},"arguments":[{"height":"0px","opacity":"0","overflow":"hidden"}]}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition","line":29,"character":6},"arguments":["initial=>final",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animate","line":29,"character":35},"arguments":["300ms"]}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition","line":30,"character":6},"arguments":["final=>initial",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animate","line":30,"character":35},"arguments":["300ms"]}]}]]}],"template":"<!-- Basic form layout section start -->\r\n<section id=\"horizontal-form-layouts\">\r\n  <div class=\"row text-left\">\r\n    <div class=\"col-md-12\">\r\n      <div class=\"card\">\r\n        <div class=\"pl-3 mb-2 mt-2\" *ngIf=\"configuration?.title != undefined && configuration?.title != ''\">\r\n          <h4 class=\"card-title ucSearch-title\" translate> {{ configuration.title }} </h4>\r\n        </div>\r\n        <div class=\"card-body\">\r\n          <div class=\"px-3\">\r\n            <form class=\"form form-horizontal\" id=\"formSearch\" #formIdSearch #enjiForm=\"ngForm\" (ngSubmit)=\"false\">\r\n              <div class=\"form-body\">\r\n                <h4 class=\"form-section font-weight-bold\">\r\n                  <div (click)=\"changeState()\" class=\"btn no-padding cursor-pointer flip\">\r\n                    <i class=\"fa\" style=\"font-size: 15px; margin: 0px 0px 5px -15px;\"\r\n                      [ngClass]=\"isHidden ? 'fa-chevron-right' : 'fa-chevron-down'\"></i>\r\n                  </div>\r\n                  <span\r\n                    *ngIf=\"configuration?.sectionTitle != undefined && configuration?.sectionTitle != ''; then inputSectionTitle else defaultSectionTitle\"></span>\r\n                  <ng-template #inputSectionTitle>\r\n                    {{configuration?.sectionTitle}}\r\n                  </ng-template>\r\n                  <ng-template #defaultSectionTitle>\r\n                    Paging\r\n                  </ng-template>\r\n                </h4>\r\n                <!-- Ini Digunakan untuk Generate Dynamic Component -->\r\n                <!-- [hidden]=\"isHidden\" -->\r\n                <div class=\"panel-active\" [@changeDivSize]=currentState>\r\n                  <div class=\"row\">\r\n                    <div class=\"col-md-6 form-group\" *ngFor=\"let question of configuration?.component\">\r\n                      <div class=\"col-md-12\">\r\n                        <div class=\"row\">\r\n                          <label class=\"col-md-5 no-padding\" for=\"{{question.id}}\" translate>{{question.label}}</label>\r\n                          <div class=\"col-md-7 no-padding\">\r\n                            <div *ngIf=\"question.type=='textbox'\">\r\n                              <input type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                attr.data-type=\"{{question.datatype}}\" attr.data-restriction=\"{{question.restriction}}\">\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='textarea'\">\r\n                              <textarea type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                name=\"{{question.name}}\" attr.data-type=\"{{question.datatype}}\"\r\n                                value=\"{{question.value}}\"></textarea>\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='numeric'\">\r\n                              <input type=\"text\" id=\"{{question.id}}\" (focus)=\"transformToDecimal($event)\"\r\n                                (blur)=\"transformAmount($event)\" class=\"form-control search-form-control\"\r\n                                name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                attr.data-restriction=\"{{question.restriction}}\" attr.data-type=\"{{question.datatype}}\">\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='currency'\">\r\n                              <span\r\n                                *ngIf=\"question?.isCustom != undefined && question?.isCustom; then customTypeCurrency else defaultTypeCurrency\"></span>\r\n                              <ng-template #customTypeCurrency>\r\n                                <input type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                  name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                  attr.data-restriction=\"{{question.restriction}}\"\r\n                                  attr.data-type=\"{{question.datatype}}\" currencyMask\r\n                                  [options]=\"{ thousands: question.thousands, decimal: question.decimal, align: question.align, allowNegative: question.allowNegative, allowZero: question.allowZero, precision: question.precision, nullable: question.nullable }\">\r\n                              </ng-template>\r\n                              <ng-template #defaultTypeCurrency>\r\n                                <input type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                  name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                  attr.data-restriction=\"{{question.restriction}}\"\r\n                                  attr.data-type=\"{{question.datatype}}\" currencyMask\r\n                                  [options]=\"{ thousands: 'question.thousands', decimal: '.', align: 'right', allowNegative: false, allowZero:true, precision: 2, nullable: false }\">\r\n                              </ng-template>\r\n                            </div>\r\n\r\n                            <!-- End Hardcode Lookup didalem-->\r\n                            <div *ngIf=\"question.type=='datepicker'\">\r\n                              <input type=\"date\" id=\"{{question.id}}\"\r\n                                class=\"form-control search-form-control btn-lookup\" name=\"{{question.name}}\"\r\n                                value=\"{{question.value}}\" attr.data-type=\"{{question.datatype}}\"\r\n                                (keyup.enter)=\"searchClick()\" attr.data-restriction=\"{{question.restriction}}\">\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='dropdown'\">\r\n                              <!-- Ini kalau datanya tidak di load dari URL -->\r\n                              <div *ngIf=\"!question.isFromURL\">\r\n                                <select name=\"{{question.name}}\" class=\"form-control search-form-control\"\r\n                                  attr.query-in=\"{{question.isQueryIn}}\" attr.data-type=\"{{question.datatype}}\">\r\n                                  <option *ngIf=\"!question.isSelectOne\" value=\"All\">\r\n                                    All\r\n                                  </option>\r\n                                  <option *ngFor=\"let item of question?.items\" value=\"{{item.key}}\">\r\n                                    {{item.value}}\r\n                                  </option>\r\n                                </select>\r\n                              </div>\r\n                              <!-- Ini kalau datanya di load dari URL -->\r\n                              <div *ngIf=\"question.isFromURL\">\r\n                                <div *ngIf=\"question.isEvent\">\r\n                                  <select name=\"{{question.name}}\"\r\n                                    (change)=\"onChangeEvent($event.target.value, question)\"\r\n                                    class=\"form-control search-form-control\" attr.query-in=\"{{question.isQueryIn}}\"\r\n                                    attr.data-type=\"{{question.datatype}}\">\r\n                                    <option *ngIf=\"!question.isSelectOne\" value=\"All\">\r\n                                      All\r\n                                    </option>\r\n                                    <option *ngFor=\"let item of question?.itemsUrl\" value=\"{{item.Key}}\">\r\n                                      {{item.Value}}\r\n                                    </option>\r\n                                  </select>\r\n                                </div>\r\n                                <div *ngIf=\"!question.isEvent\">\r\n                                  <select name=\"{{question.name}}\" class=\"form-control search-form-control\"\r\n                                    attr.query-in=\"{{question.isQueryIn}}\" attr.data-type=\"{{question.datatype}}\">\r\n                                    <option *ngIf=\"!question.isSelectOne\" value=\"All\">\r\n                                      All\r\n                                    </option>\r\n                                    <option *ngFor=\"let item of question?.itemsUrl\" value=\"{{item.Key}}\">\r\n                                      {{item.Value}}\r\n                                    </option>\r\n                                  </select>\r\n                                </div>\r\n                              </div>\r\n                            </div>\r\n                          </div>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                  <div class=\"col-md-12 no-padding\">\r\n                    <form>\r\n                      <div class=\"form-actions right\">\r\n                        <button *ngIf=\"exportData == true\" type=\"button\" (click)=\"exportAsXLSX()\"\r\n                          class=\"btn btn-raised btn-success mr-1\" translate>\r\n                          <i class=\"fa ft-download\"></i> Export Excel\r\n                        </button>\r\n                        <button type=\"button\" (click)=\"reset()\" class=\"btn btn-raised btn-warning mr-1\" translate>\r\n                          <i class=\"fa fa-times\"></i> Reset\r\n                        </button>\r\n                        <button type=\"button\" (click)=\"searchClick()\" class=\"btn btn-raised btn-primary\" #UCSearchClick\r\n                          translate>\r\n                          <i class=\"fa fa-search\"></i> Search\r\n                        </button>\r\n                      </div>\r\n                    </form>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n            </form>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</section>\r\n<br>\r\n<!-- // Basic form layout section end -->","styles":[".ucSearch-title{margin:3px}"]}]}],"members":{"myForm":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":36,"character":3},"arguments":["formIdSearch"]}]}],"searchInput":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":37,"character":3}}]}],"pageSize":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":38,"character":3}}]}],"result":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":39,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[null,null,null,[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":55,"character":108},"arguments":[{"__symbolic":"reference","module":"@angular/platform-browser","name":"DOCUMENT","line":55,"character":115}]}]],"parameters":[{"__symbolic":"reference","module":"@angular/common/http","name":"HttpClient","line":55,"character":28},{"__symbolic":"reference","name":"ɵa"},{"__symbolic":"reference","module":"@angular/core","name":"Renderer2","line":55,"character":96},null]}],"changeState":[{"__symbolic":"method"}],"ngOnInit":[{"__symbolic":"method"}],"initiateForm":[{"__symbolic":"method"}],"getJSON":[{"__symbolic":"method"}],"postJSON":[{"__symbolic":"method"}],"searchClick":[{"__symbolic":"method"}],"reset":[{"__symbolic":"method"}],"search":[{"__symbolic":"method"}],"lessThanFour":[{"__symbolic":"method"}],"resolveObject":[{"__symbolic":"method"}],"transformAmount":[{"__symbolic":"method"}],"transformToDecimal":[{"__symbolic":"method"}],"exportAsXLSX":[{"__symbolic":"method"}],"onChangeEvent":[{"__symbolic":"method"}],"switchCase":[{"__symbolic":"method"}]}},"customCurrencyMaskConfig":{"align":"right","allowNegative":false,"allowZero":true,"decimal":".","precision":2,"prefix":"","suffix":"","thousands":",","nullable":false,"inputMode":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"ngx-currency","name":"CurrencyMaskInputMode","line":16,"character":13},"member":"NATURAL"}},"UCSearchModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":18,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"UCSearchComponent"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":21,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":22,"character":4},{"__symbolic":"call","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"ngx-currency","name":"NgxCurrencyModule","line":23,"character":4},"member":"forRoot"},"arguments":[{"__symbolic":"reference","name":"customCurrencyMaskConfig"}]}],"exports":[{"__symbolic":"reference","name":"UCSearchComponent"}]}]}],"members":{}},"ɵa":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":7,"character":1}}],"members":{"__ctor__":[{"__symbolic":"constructor"}],"exportAsExcelFile":[{"__symbolic":"method"}],"saveAsExcelFile":[{"__symbolic":"method"}]}}},"origins":{"UCSearchService":"./lib/ucsearch.service","UCSearchComponent":"./lib/ucsearch.component","customCurrencyMaskConfig":"./lib/ucsearch.module","UCSearchModule":"./lib/ucsearch.module","ɵa":"./lib/services/excel-service/excel-service"},"importAs":"@adins/ucsearch"}

package/bundles/adins-ucsearch.umd.js

@@ -791,7 +791,7 @@
         UCSearchComponent.decorators = [
             { type: i0.Component, args: [{
                         selector: 'lib-UCSearch',
-                        template: "<!-- Basic form layout section start -->\r\n<section id=\"horizontal-form-layouts\">\r\n  <div class=\"row text-left\">\r\n    <div class=\"col-md-12\">\r\n      <div class=\"card\">\r\n        <div class=\"pl-3 mb-2 mt-2\" *ngIf=\"configuration?.title != undefined && configuration?.title != ''\">\r\n          <h4 class=\"card-title ucSearch-title\" translate> {{ configuration.title }} </h4>\r\n        </div>\r\n        <div class=\"card-body\">\r\n          <div class=\"px-3\">\r\n            <form class=\"form form-horizontal\" id=\"formSearch\" #formIdSearch #enjiForm=\"ngForm\" (ngSubmit)=\"false\">\r\n              <div class=\"form-body\">\r\n                <h4 class=\"form-section font-weight-bold\">\r\n                  <div (click)=\"changeState()\" class=\"btn no-padding cursor-pointer flip\">\r\n                    <i class=\"fa\" style=\"font-size: 15px; margin: 0px 0px 5px -15px;\"\r\n                      [ngClass]=\"isHidden ? 'fa-chevron-right' : 'fa-chevron-down'\"></i>\r\n                  </div>\r\n                  <span\r\n                    *ngIf=\"configuration?.sectionTitle != undefined && configuration?.sectionTitle != ''; then inputSectionTitle else defaultSectionTitle\"></span>\r\n                  <ng-template #inputSectionTitle>\r\n                    {{configuration?.sectionTitle}}\r\n                  </ng-template>\r\n                  <ng-template #defaultSectionTitle>\r\n                    Paging\r\n                  </ng-template>\r\n                </h4>\r\n                <!-- Ini Digunakan untuk Generate Dynamic Component -->\r\n                <!-- [hidden]=\"isHidden\" -->\r\n                <div class=\"panel-active\" [@changeDivSize]=currentState>\r\n                  <div class=\"row\">\r\n                    <div class=\"col-md-6 form-group\" *ngFor=\"let question of configuration?.component\">\r\n                      <div class=\"col-md-12\">\r\n                        <div class=\"row\">\r\n                          <label class=\"col-md-5 no-padding\" for=\"{{question.id}}\" translate>{{question.label}}</label>\r\n                          <div class=\"col-md-7 no-padding\">\r\n                            <div *ngIf=\"question.type=='textbox'\">\r\n                              <input type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                attr.data-type=\"{{question.datatype}}\" attr.data-restriction=\"{{question.restriction}}\">\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='textarea'\">\r\n                              <textarea type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                name=\"{{question.name}}\" attr.data-type=\"{{question.datatype}}\"\r\n                                value=\"{{question.value}}\"></textarea>\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='numeric'\">\r\n                              <input type=\"text\" id=\"{{question.id}}\" (focus)=\"transformToDecimal($event)\"\r\n                                (blur)=\"transformAmount($event)\" class=\"form-control search-form-control\"\r\n                                name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                attr.data-restriction=\"{{question.restriction}}\" attr.data-type=\"{{question.datatype}}\">\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='currency'\">\r\n                              <span\r\n                                *ngIf=\"question?.isCustom != undefined && question?.isCustom; then customTypeCurrency else defaultTypeCurrency\"></span>\r\n                              <ng-template #customTypeCurrency>\r\n                                <input type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                  name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                  attr.data-restriction=\"{{question.restriction}}\"\r\n                                  attr.data-type=\"{{question.datatype}}\" currencyMask\r\n                                  [options]=\"{ thousands: 'question.thousands', decimal: '.', align: 'right', allowNegative: false, allowZero:true, precision: 2, nullable: false }\">\r\n                              </ng-template>\r\n                              <ng-template #defaultTypeCurrency>\r\n                                <input type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                  name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                  attr.data-restriction=\"{{question.restriction}}\"\r\n                                  attr.data-type=\"{{question.datatype}}\" currencyMask\r\n                                  [options]=\"{ thousands: question.thousands, decimal: question.decimal, align: question.align, allowNegative: question.allowNegative, allowZero: question.allowZero, precision: question.precision, nullable: question.nullable }\">\r\n                              </ng-template>\r\n                            </div>\r\n\r\n                            <!-- End Hardcode Lookup didalem-->\r\n                            <div *ngIf=\"question.type=='datepicker'\">\r\n                              <input type=\"date\" id=\"{{question.id}}\"\r\n                                class=\"form-control search-form-control btn-lookup\" name=\"{{question.name}}\"\r\n                                value=\"{{question.value}}\" attr.data-type=\"{{question.datatype}}\"\r\n                                (keyup.enter)=\"searchClick()\" attr.data-restriction=\"{{question.restriction}}\">\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='dropdown'\">\r\n                              <!-- Ini kalau datanya tidak di load dari URL -->\r\n                              <div *ngIf=\"!question.isFromURL\">\r\n                                <select name=\"{{question.name}}\" class=\"form-control search-form-control\"\r\n                                  attr.query-in=\"{{question.isQueryIn}}\" attr.data-type=\"{{question.datatype}}\">\r\n                                  <option *ngIf=\"!question.isSelectOne\" value=\"All\">\r\n                                    All\r\n                                  </option>\r\n                                  <option *ngFor=\"let item of question?.items\" value=\"{{item.key}}\">\r\n                                    {{item.value}}\r\n                                  </option>\r\n                                </select>\r\n                              </div>\r\n                              <!-- Ini kalau datanya di load dari URL -->\r\n                              <div *ngIf=\"question.isFromURL\">\r\n                                <div *ngIf=\"question.isEvent\">\r\n                                  <select name=\"{{question.name}}\"\r\n                                    (change)=\"onChangeEvent($event.target.value, question)\"\r\n                                    class=\"form-control search-form-control\" attr.query-in=\"{{question.isQueryIn}}\"\r\n                                    attr.data-type=\"{{question.datatype}}\">\r\n                                    <option *ngIf=\"!question.isSelectOne\" value=\"All\">\r\n                                      All\r\n                                    </option>\r\n                                    <option *ngFor=\"let item of question?.itemsUrl\" value=\"{{item.Key}}\">\r\n                                      {{item.Value}}\r\n                                    </option>\r\n                                  </select>\r\n                                </div>\r\n                                <div *ngIf=\"!question.isEvent\">\r\n                                  <select name=\"{{question.name}}\" class=\"form-control search-form-control\"\r\n                                    attr.query-in=\"{{question.isQueryIn}}\" attr.data-type=\"{{question.datatype}}\">\r\n                                    <option *ngIf=\"!question.isSelectOne\" value=\"All\">\r\n                                      All\r\n                                    </option>\r\n                                    <option *ngFor=\"let item of question?.itemsUrl\" value=\"{{item.Key}}\">\r\n                                      {{item.Value}}\r\n                                    </option>\r\n                                  </select>\r\n                                </div>\r\n                              </div>\r\n                            </div>\r\n                          </div>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                  <div class=\"col-md-12 no-padding\">\r\n                    <form>\r\n                      <div class=\"form-actions right\">\r\n                        <button *ngIf=\"exportData == true\" type=\"button\" (click)=\"exportAsXLSX()\"\r\n                          class=\"btn btn-raised btn-success mr-1\" translate>\r\n                          <i class=\"fa ft-download\"></i> Export Excel\r\n                        </button>\r\n                        <button type=\"button\" (click)=\"reset()\" class=\"btn btn-raised btn-warning mr-1\" translate>\r\n                          <i class=\"fa fa-times\"></i> Reset\r\n                        </button>\r\n                        <button type=\"button\" (click)=\"searchClick()\" class=\"btn btn-raised btn-primary\" #UCSearchClick\r\n                          translate>\r\n                          <i class=\"fa fa-search\"></i> Search\r\n                        </button>\r\n                      </div>\r\n                    </form>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n            </form>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</section>\r\n<br>\r\n<!-- // Basic form layout section end -->",
+                        template: "<!-- Basic form layout section start -->\r\n<section id=\"horizontal-form-layouts\">\r\n  <div class=\"row text-left\">\r\n    <div class=\"col-md-12\">\r\n      <div class=\"card\">\r\n        <div class=\"pl-3 mb-2 mt-2\" *ngIf=\"configuration?.title != undefined && configuration?.title != ''\">\r\n          <h4 class=\"card-title ucSearch-title\" translate> {{ configuration.title }} </h4>\r\n        </div>\r\n        <div class=\"card-body\">\r\n          <div class=\"px-3\">\r\n            <form class=\"form form-horizontal\" id=\"formSearch\" #formIdSearch #enjiForm=\"ngForm\" (ngSubmit)=\"false\">\r\n              <div class=\"form-body\">\r\n                <h4 class=\"form-section font-weight-bold\">\r\n                  <div (click)=\"changeState()\" class=\"btn no-padding cursor-pointer flip\">\r\n                    <i class=\"fa\" style=\"font-size: 15px; margin: 0px 0px 5px -15px;\"\r\n                      [ngClass]=\"isHidden ? 'fa-chevron-right' : 'fa-chevron-down'\"></i>\r\n                  </div>\r\n                  <span\r\n                    *ngIf=\"configuration?.sectionTitle != undefined && configuration?.sectionTitle != ''; then inputSectionTitle else defaultSectionTitle\"></span>\r\n                  <ng-template #inputSectionTitle>\r\n                    {{configuration?.sectionTitle}}\r\n                  </ng-template>\r\n                  <ng-template #defaultSectionTitle>\r\n                    Paging\r\n                  </ng-template>\r\n                </h4>\r\n                <!-- Ini Digunakan untuk Generate Dynamic Component -->\r\n                <!-- [hidden]=\"isHidden\" -->\r\n                <div class=\"panel-active\" [@changeDivSize]=currentState>\r\n                  <div class=\"row\">\r\n                    <div class=\"col-md-6 form-group\" *ngFor=\"let question of configuration?.component\">\r\n                      <div class=\"col-md-12\">\r\n                        <div class=\"row\">\r\n                          <label class=\"col-md-5 no-padding\" for=\"{{question.id}}\" translate>{{question.label}}</label>\r\n                          <div class=\"col-md-7 no-padding\">\r\n                            <div *ngIf=\"question.type=='textbox'\">\r\n                              <input type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                attr.data-type=\"{{question.datatype}}\" attr.data-restriction=\"{{question.restriction}}\">\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='textarea'\">\r\n                              <textarea type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                name=\"{{question.name}}\" attr.data-type=\"{{question.datatype}}\"\r\n                                value=\"{{question.value}}\"></textarea>\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='numeric'\">\r\n                              <input type=\"text\" id=\"{{question.id}}\" (focus)=\"transformToDecimal($event)\"\r\n                                (blur)=\"transformAmount($event)\" class=\"form-control search-form-control\"\r\n                                name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                attr.data-restriction=\"{{question.restriction}}\" attr.data-type=\"{{question.datatype}}\">\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='currency'\">\r\n                              <span\r\n                                *ngIf=\"question?.isCustom != undefined && question?.isCustom; then customTypeCurrency else defaultTypeCurrency\"></span>\r\n                              <ng-template #customTypeCurrency>\r\n                                <input type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                  name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                  attr.data-restriction=\"{{question.restriction}}\"\r\n                                  attr.data-type=\"{{question.datatype}}\" currencyMask\r\n                                  [options]=\"{ thousands: question.thousands, decimal: question.decimal, align: question.align, allowNegative: question.allowNegative, allowZero: question.allowZero, precision: question.precision, nullable: question.nullable }\">\r\n                              </ng-template>\r\n                              <ng-template #defaultTypeCurrency>\r\n                                <input type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                  name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                  attr.data-restriction=\"{{question.restriction}}\"\r\n                                  attr.data-type=\"{{question.datatype}}\" currencyMask\r\n                                  [options]=\"{ thousands: 'question.thousands', decimal: '.', align: 'right', allowNegative: false, allowZero:true, precision: 2, nullable: false }\">\r\n                              </ng-template>\r\n                            </div>\r\n\r\n                            <!-- End Hardcode Lookup didalem-->\r\n                            <div *ngIf=\"question.type=='datepicker'\">\r\n                              <input type=\"date\" id=\"{{question.id}}\"\r\n                                class=\"form-control search-form-control btn-lookup\" name=\"{{question.name}}\"\r\n                                value=\"{{question.value}}\" attr.data-type=\"{{question.datatype}}\"\r\n                                (keyup.enter)=\"searchClick()\" attr.data-restriction=\"{{question.restriction}}\">\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='dropdown'\">\r\n                              <!-- Ini kalau datanya tidak di load dari URL -->\r\n                              <div *ngIf=\"!question.isFromURL\">\r\n                                <select name=\"{{question.name}}\" class=\"form-control search-form-control\"\r\n                                  attr.query-in=\"{{question.isQueryIn}}\" attr.data-type=\"{{question.datatype}}\">\r\n                                  <option *ngIf=\"!question.isSelectOne\" value=\"All\">\r\n                                    All\r\n                                  </option>\r\n                                  <option *ngFor=\"let item of question?.items\" value=\"{{item.key}}\">\r\n                                    {{item.value}}\r\n                                  </option>\r\n                                </select>\r\n                              </div>\r\n                              <!-- Ini kalau datanya di load dari URL -->\r\n                              <div *ngIf=\"question.isFromURL\">\r\n                                <div *ngIf=\"question.isEvent\">\r\n                                  <select name=\"{{question.name}}\"\r\n                                    (change)=\"onChangeEvent($event.target.value, question)\"\r\n                                    class=\"form-control search-form-control\" attr.query-in=\"{{question.isQueryIn}}\"\r\n                                    attr.data-type=\"{{question.datatype}}\">\r\n                                    <option *ngIf=\"!question.isSelectOne\" value=\"All\">\r\n                                      All\r\n                                    </option>\r\n                                    <option *ngFor=\"let item of question?.itemsUrl\" value=\"{{item.Key}}\">\r\n                                      {{item.Value}}\r\n                                    </option>\r\n                                  </select>\r\n                                </div>\r\n                                <div *ngIf=\"!question.isEvent\">\r\n                                  <select name=\"{{question.name}}\" class=\"form-control search-form-control\"\r\n                                    attr.query-in=\"{{question.isQueryIn}}\" attr.data-type=\"{{question.datatype}}\">\r\n                                    <option *ngIf=\"!question.isSelectOne\" value=\"All\">\r\n                                      All\r\n                                    </option>\r\n                                    <option *ngFor=\"let item of question?.itemsUrl\" value=\"{{item.Key}}\">\r\n                                      {{item.Value}}\r\n                                    </option>\r\n                                  </select>\r\n                                </div>\r\n                              </div>\r\n                            </div>\r\n                          </div>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                  <div class=\"col-md-12 no-padding\">\r\n                    <form>\r\n                      <div class=\"form-actions right\">\r\n                        <button *ngIf=\"exportData == true\" type=\"button\" (click)=\"exportAsXLSX()\"\r\n                          class=\"btn btn-raised btn-success mr-1\" translate>\r\n                          <i class=\"fa ft-download\"></i> Export Excel\r\n                        </button>\r\n                        <button type=\"button\" (click)=\"reset()\" class=\"btn btn-raised btn-warning mr-1\" translate>\r\n                          <i class=\"fa fa-times\"></i> Reset\r\n                        </button>\r\n                        <button type=\"button\" (click)=\"searchClick()\" class=\"btn btn-raised btn-primary\" #UCSearchClick\r\n                          translate>\r\n                          <i class=\"fa fa-search\"></i> Search\r\n                        </button>\r\n                      </div>\r\n                    </form>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n            </form>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</section>\r\n<br>\r\n<!-- // Basic form layout section end -->",
                         providers: [ExcelService],
                         animations: [
                             animations.trigger('changeDivSize', [

package/bundles/adins-ucsearch.umd.min.js

@@ -1,2 +1,2 @@
-!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@angular/common/http"),require("@angular/platform-browser"),require("file-saver"),require("xlsx"),require("@angular/animations"),require("@angular/core"),require("@angular/common"),require("@angular/forms"),require("ngx-currency")):"function"==typeof define&&define.amd?define("@adins/ucsearch",["exports","@angular/common/http","@angular/platform-browser","file-saver","xlsx","@angular/animations","@angular/core","@angular/common","@angular/forms","ngx-currency"],e):e((t.adins=t.adins||{},t.adins.ucsearch={}),t.ng.common.http,t.ng.platformBrowser,t.FileSaver,t.XLSX,t.ng.animations,t.ng.core,t.ng.common,t.ng.forms,t.ngxCurrency)}(this,function(t,e,n,r,o,i,a,m,s,l){"use strict";var c=(u.decorators=[{type:a.Injectable,args:[{providedIn:"root"}]}],u.ctorParameters=function(){return[]},u.ngInjectableDef=a.defineInjectable({factory:function(){return new u},token:u,providedIn:"root"}),u);function u(){}var p=function S(){this._url="",this.enviromentUrl="",this.title="",this.apiQryPaging="",this.arrCritObj=null,this.addCritInput=new Array,this.ddlEnvironments=new Array,this.whereValue=new Array,this.switchValue=new Array},v=function k(){this.low=0,this.high=0,this.DataType="Text"},g=function C(){this.includeCount=!0,this.includeData=!0,this.isLoading=!0,this.queryString="",this.rowVersion=""},y=(d.RestrictionBetween="Between",d.RestrictionLike="Like",d.RestrictionEq="Eq",d.RestrictionNeq="NEQ",d.RestrictionGt="GT",d.RestrictionGte="GTE",d.RestrictionLt="LT",d.RestrictionLte="LTE",d.RestrictionIn="IN",d.RestrictionNotIn="NotIn",d.RestrictionOr="Or",d.RestrictionOrNeq="OrNeq",d.RestrictionIsNull="isnull",d.RestrictionIsNotNull="isnotnull",d.RestrictionGTE="GTE",d.RestrictionLTE="LTE",d.showData="10,50,100",d);function d(){}var h=(f.prototype.exportAsExcelFile=function(t,e){var n=o.utils.json_to_sheet(t);console.log("worksheet",n);var r={Sheets:{data:n},SheetNames:["data"]},i=o.write(r,{bookType:"xlsx",type:"array"});this.saveAsExcelFile(i,e)},f.prototype.saveAsExcelFile=function(t,e){var n=new Blob([t],{type:"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=UTF-8"});r.saveAs(n,e+"_export_"+(new Date).getTime()+".xlsx")},f.decorators=[{type:a.Injectable}],f.ctorParameters=function(){return[]},f);function f(){}var I=(q.prototype.changeState=function(){this.currentState="initial"===this.currentState?"final":"initial",this.isHidden=!1===this.isHidden},q.prototype.ngOnInit=function(){console.log("ucsearch"),this.apiUrl=this.searchInput.enviromentUrl+this.searchInput.apiQryPaging,this.arrCrit=this.searchInput.arrCritObj;var t=this._renderer2.createElement("script");t.text='\n          $(document).ready(function(){\n            $("#flip").click(function(){\n              $("#panel").slideToggle("slow");\n            });\n          });\n        ',this._renderer2.appendChild(this._document.body,t),this.initiateForm()},q.prototype.initiateForm=function(){var h=this;this.getJSON(this.searchInput._url).subscribe(function(t){h.configuration=t,h.exportData=t.exportExcel,h.countForm=t.component.length,h.isDataLoaded=!0,h.searchInput.title!=undefined&&""!=h.searchInput.title&&(h.configuration.title=h.searchInput.title);for(var e=0;e<h.countForm;e++){if(1==t.component[e].isFromURL){var n=new g,r=new Array,i=new v;if(i.DataType="text",i.propName=t.component[e].criteriaPropName,i.value=t.component[e].criteriaPropValue,i.restriction="eq",r.push(i),n.criteria=r,n[t.component[e].criteriaPropName]=t.component[e].criteriaPropValue,t.component[e].path!=undefined&&""!=t.component[e].path)if(h.searchInput.ddlEnvironments!=undefined&&0!=h.searchInput.ddlEnvironments.length){for(var o=0;o<h.searchInput.ddlEnvironments.length;o++)if(t.component[e].name==h.searchInput.ddlEnvironments[o].name){t.component[e].fullpath=h.searchInput.ddlEnvironments[o].environment+t.component[e].path;break}}else t.component[e].fullpath=t.component[e].url;else t.component[e].fullpath=t.component[e].url;h.resolveObject(t.component[e],t.component[e].fullpath,n)}if("numeric"==t.component[e].type&&(t.component[e].value=parseFloat(t.component[e].value).toLocaleString("en")),"datepicker"==t.component[e].type&&t.component[e].value.includes("BD")){var a=localStorage.getItem("BusinessDateRaw"),s=new Date;null!=a&&(s=new Date(a));var l=t.component[e].value.charAt(2),c=new Date;if("-"==l){var u=t.component[e].value.split("-",2),p=parseInt(u[1]);c.setDate(s.getDate()-p)}else"+"==l?(u=t.component[e].value.split("+",2),p=parseInt(u[1]),c.setDate(s.getDate()+p)):c=s;var d=m.formatDate(c,"yyyy-MM-dd","en-US");t.component[e].value=d}}})},q.prototype.getJSON=function(t){return this.http.get(t)},q.prototype.postJSON=function(t,e){return void 0===e&&(e=null),this.http.post(t,e)},q.prototype.searchClick=function(){var t=null;null!=this.configuration.orderby&&(t={key:this.configuration.orderby.key,value:this.configuration.orderby.value}),this.pageNow=1,this.search(this.apiUrl,this.pageNow,this.pageSize,t,this.arrCrit)},q.prototype.reset=function(){this.initiateForm()},q.prototype.search=function(t,n,e,r,i){var o=this;void 0===i&&(i=new Array);var a=new g,s=new Array,l=!1;if(this.searchInput.whereValue!=undefined&&0!=this.searchInput.whereValue.length){this.configuration.querystring.whereQuery=new Array;for(var c=0;c<this.searchInput.whereValue.length;c++)this.configuration.querystring.whereQuery.push(this.searchInput.whereValue[c].value)}a.pageNo=n,a.rowPerPage=e,a.orderBy=r,a.queryString=this.configuration.querystring;for(var u=0;u<this.countForm;u++){var p=new v,d=this.myForm.nativeElement[u];if(p.DataType=d.getAttribute("data-type"),l=null!=d.getAttribute("query-in")&&"true"==d.getAttribute("query-in"),""!=d.value)if("SELECT"==d.nodeName){var h=d.options,m=h[h.selectedIndex].value.trim();if("All"!=m)p.restriction=y.RestrictionEq,p.propName=d.name,p.value=m,s.push(p);else if("All"==m&&1==l&&0!=d.options.length){var f=new Array;for(c=0;c<d.options.length;c++)0!=c&&f.push(d.options[c].value);0!=f.length&&(p.restriction=y.RestrictionIn,p.propName=d.name,p.listValue=f,s.push(p))}}else p.propName=d.name,p.value=d.value.trim(),d.value.includes("%")?p.restriction=y.RestrictionLike:""!=d.getAttribute("data-restriction")&&null!=d.getAttribute("data-restriction")?(p.restriction=d.getAttribute("data-restriction"),"numeric"==d.getAttribute("data-type")&&(d.value=parseFloat(d.value.replace(/,/g,""))),"LIKE"==p.restriction.toUpperCase()&&(p.value="%"+d.value.trim()+"%",p.restriction=y.RestrictionLike)):p.restriction=y.RestrictionEq,s.push(p)}if(null!=i&&i!=undefined){if(0!=i.length)for(u=0;u<i.length;u++)s.push(i[u]);else if(null!=this.searchInput.addCritInput||this.searchInput.addCritInput!=undefined)for(u=0;u<this.searchInput.addCritInput.length;u++)s.push(this.searchInput.addCritInput[u])}else if(null!=this.searchInput.addCritInput||this.searchInput.addCritInput!=undefined)for(u=0;u<this.searchInput.addCritInput.length;u++)s.push(this.searchInput.addCritInput[u]);a.criteria=s,this.http.post(t,a).subscribe(function(t){var e={response:t,pageNow:n};return console.log(e),o.result.emit(e),t})},q.prototype.lessThanFour=function(){return!(3<this.countForm)},q.prototype.resolveObject=function(e,t,n){void 0===n&&(n=null),this.postJSON(t,n).subscribe(function(t){e.itemsUrl=new Array,e.itemsUrl=t.ReturnObject})},q.prototype.transformAmount=function(t){this.formattedAmount=parseFloat(t.target.value).toLocaleString("en"),t.target.value=this.formattedAmount},q.prototype.transformToDecimal=function(t){t.target.value=parseFloat(t.target.value.toString().replace(/,/g,""))},q.prototype.exportAsXLSX=function(){var e=this,t=new g;t.pageNo=1,t.rowPerPage=9999,t.orderBy=null,t.criteria=[],t.queryString=this.configuration.querystring,this.http.post(this.apiUrl,t).subscribe(function(t){e.ExcelData=t.Data,e.excelService.exportAsExcelFile(e.ExcelData,"sample")},function(t){console.log(t)})},q.prototype.onChangeEvent=function(t,e){for(var n=this.configuration.component,r=0;r<e.affectedFilter.length;r++)for(var i=0;i<n.length;i++)if(n[i].name==e.affectedFilter[r]){var o=new g,a=new Array;if("All"!=t){var s=new v;s.DataType=e.datatype,s.propName=e.name,s.value=t,s.restriction=y.RestrictionEq,a.push(s)}if(o.criteria=a,n[i].path!=undefined&&""!=n[i].path)if(this.searchInput.ddlEnvironments!=undefined&&0!=this.searchInput.ddlEnvironments.length){for(var l=0;l<this.searchInput.ddlEnvironments.length;l++)if(n[i].name==this.searchInput.ddlEnvironments[l].name){n[i].fullpath=this.searchInput.ddlEnvironments[l].environment+n[i].path;break}}else n[i].fullpath=n[i].url;else n[i].fullpath=n[i].url;this.resolveObject(n[i],n[i].fullpath,o)}},q.prototype.switchCase=function(e){for(var t=!1,n=0;n<e.conditions.length;n++){var r=this.searchInput.switchValue.findIndex(function(t){return t.property==e.conditions[n].property});if("EQ"==e.conditions[n].restriction)if(1!=e.conditions[n].isUser){if(this.searchInput.switchValue[r].value!=e.conditions[n].value){t=!1;break}t=!0}else{var i=localStorage.getItem("Username");if(this.searchInput.switchValue[r].value!=i){t=!1;break}t=!0}else if("NEQ"==e.conditions[n].restriction)if(1!=e.conditions[n].isUser){if(this.searchInput.switchValue[r].value==e.conditions[n].value){t=!1;break}t=!0}else{if(i=localStorage.getItem("Username"),this.searchInput.switchValue[r].value==i){t=!1;break}t=!0}else if("GT"==e.conditions[n].restriction)if(1!=e.conditions[n].isUser){if(!(this.searchInput.switchValue[r].value>e.conditions[n].value)){t=!1;break}t=!0}else{if(i=localStorage.getItem("Username"),!(this.searchInput.switchValue[r].value>i)){t=!1;break}t=!0}else if("GTE"==e.conditions[n].restriction)if(1!=e.conditions[n].isUser){if(!(this.searchInput.switchValue[r].value>=e.conditions[n].value)){t=!1;break}t=!0}else{if(i=localStorage.getItem("Username"),!(this.searchInput.switchValue[r].value>=i)){t=!1;break}t=!0}else if("LT"==e.conditions[n].restriction)if(1!=e.conditions[n].isUser){if(!(this.searchInput.switchValue[r].value<e.conditions[n].value)){t=!1;break}t=!0}else{if(i=localStorage.getItem("Username"),!(this.searchInput.switchValue[r].value<i)){t=!1;break}t=!0}else if("LTE"==e.conditions[n].restriction)if(1!=e.conditions[n].isUser){if(!(this.searchInput.switchValue[r].value<=e.conditions[n].value)){t=!1;break}t=!0}else{if(i=localStorage.getItem("Username"),!(this.searchInput.switchValue[r].value<=i)){t=!1;break}t=!0}}return t},q.decorators=[{type:a.Component,args:[{selector:"lib-UCSearch",template:'\x3c!-- Basic form layout section start --\x3e\r\n<section id="horizontal-form-layouts">\r\n  <div class="row text-left">\r\n    <div class="col-md-12">\r\n      <div class="card">\r\n        <div class="pl-3 mb-2 mt-2" *ngIf="configuration?.title != undefined && configuration?.title != \'\'">\r\n          <h4 class="card-title ucSearch-title" translate> {{ configuration.title }} </h4>\r\n        </div>\r\n        <div class="card-body">\r\n          <div class="px-3">\r\n            <form class="form form-horizontal" id="formSearch" #formIdSearch #enjiForm="ngForm" (ngSubmit)="false">\r\n              <div class="form-body">\r\n                <h4 class="form-section font-weight-bold">\r\n                  <div (click)="changeState()" class="btn no-padding cursor-pointer flip">\r\n                    <i class="fa" style="font-size: 15px; margin: 0px 0px 5px -15px;"\r\n                      [ngClass]="isHidden ? \'fa-chevron-right\' : \'fa-chevron-down\'"></i>\r\n                  </div>\r\n                  <span\r\n                    *ngIf="configuration?.sectionTitle != undefined && configuration?.sectionTitle != \'\'; then inputSectionTitle else defaultSectionTitle"></span>\r\n                  <ng-template #inputSectionTitle>\r\n                    {{configuration?.sectionTitle}}\r\n                  </ng-template>\r\n                  <ng-template #defaultSectionTitle>\r\n                    Paging\r\n                  </ng-template>\r\n                </h4>\r\n                \x3c!-- Ini Digunakan untuk Generate Dynamic Component --\x3e\r\n                \x3c!-- [hidden]="isHidden" --\x3e\r\n                <div class="panel-active" [@changeDivSize]=currentState>\r\n                  <div class="row">\r\n                    <div class="col-md-6 form-group" *ngFor="let question of configuration?.component">\r\n                      <div class="col-md-12">\r\n                        <div class="row">\r\n                          <label class="col-md-5 no-padding" for="{{question.id}}" translate>{{question.label}}</label>\r\n                          <div class="col-md-7 no-padding">\r\n                            <div *ngIf="question.type==\'textbox\'">\r\n                              <input type="text" id="{{question.id}}" class="form-control search-form-control"\r\n                                name="{{question.name}}" value="{{question.value}}" (keyup.enter)="searchClick()"\r\n                                attr.data-type="{{question.datatype}}" attr.data-restriction="{{question.restriction}}">\r\n                            </div>\r\n                            <div *ngIf="question.type==\'textarea\'">\r\n                              <textarea type="text" id="{{question.id}}" class="form-control search-form-control"\r\n                                name="{{question.name}}" attr.data-type="{{question.datatype}}"\r\n                                value="{{question.value}}"></textarea>\r\n                            </div>\r\n                            <div *ngIf="question.type==\'numeric\'">\r\n                              <input type="text" id="{{question.id}}" (focus)="transformToDecimal($event)"\r\n                                (blur)="transformAmount($event)" class="form-control search-form-control"\r\n                                name="{{question.name}}" value="{{question.value}}" (keyup.enter)="searchClick()"\r\n                                attr.data-restriction="{{question.restriction}}" attr.data-type="{{question.datatype}}">\r\n                            </div>\r\n                            <div *ngIf="question.type==\'currency\'">\r\n                              <span\r\n                                *ngIf="question?.isCustom != undefined && question?.isCustom; then customTypeCurrency else defaultTypeCurrency"></span>\r\n                              <ng-template #customTypeCurrency>\r\n                                <input type="text" id="{{question.id}}" class="form-control search-form-control"\r\n                                  name="{{question.name}}" value="{{question.value}}" (keyup.enter)="searchClick()"\r\n                                  attr.data-restriction="{{question.restriction}}"\r\n                                  attr.data-type="{{question.datatype}}" currencyMask\r\n                                  [options]="{ thousands: \'question.thousands\', decimal: \'.\', align: \'right\', allowNegative: false, allowZero:true, precision: 2, nullable: false }">\r\n                              </ng-template>\r\n                              <ng-template #defaultTypeCurrency>\r\n                                <input type="text" id="{{question.id}}" class="form-control search-form-control"\r\n                                  name="{{question.name}}" value="{{question.value}}" (keyup.enter)="searchClick()"\r\n                                  attr.data-restriction="{{question.restriction}}"\r\n                                  attr.data-type="{{question.datatype}}" currencyMask\r\n                                  [options]="{ thousands: question.thousands, decimal: question.decimal, align: question.align, allowNegative: question.allowNegative, allowZero: question.allowZero, precision: question.precision, nullable: question.nullable }">\r\n                              </ng-template>\r\n                            </div>\r\n\r\n                            \x3c!-- End Hardcode Lookup didalem--\x3e\r\n                            <div *ngIf="question.type==\'datepicker\'">\r\n                              <input type="date" id="{{question.id}}"\r\n                                class="form-control search-form-control btn-lookup" name="{{question.name}}"\r\n                                value="{{question.value}}" attr.data-type="{{question.datatype}}"\r\n                                (keyup.enter)="searchClick()" attr.data-restriction="{{question.restriction}}">\r\n                            </div>\r\n                            <div *ngIf="question.type==\'dropdown\'">\r\n                              \x3c!-- Ini kalau datanya tidak di load dari URL --\x3e\r\n                              <div *ngIf="!question.isFromURL">\r\n                                <select name="{{question.name}}" class="form-control search-form-control"\r\n                                  attr.query-in="{{question.isQueryIn}}" attr.data-type="{{question.datatype}}">\r\n                                  <option *ngIf="!question.isSelectOne" value="All">\r\n                                    All\r\n                                  </option>\r\n                                  <option *ngFor="let item of question?.items" value="{{item.key}}">\r\n                                    {{item.value}}\r\n                                  </option>\r\n                                </select>\r\n                              </div>\r\n                              \x3c!-- Ini kalau datanya di load dari URL --\x3e\r\n                              <div *ngIf="question.isFromURL">\r\n                                <div *ngIf="question.isEvent">\r\n                                  <select name="{{question.name}}"\r\n                                    (change)="onChangeEvent($event.target.value, question)"\r\n                                    class="form-control search-form-control" attr.query-in="{{question.isQueryIn}}"\r\n                                    attr.data-type="{{question.datatype}}">\r\n                                    <option *ngIf="!question.isSelectOne" value="All">\r\n                                      All\r\n                                    </option>\r\n                                    <option *ngFor="let item of question?.itemsUrl" value="{{item.Key}}">\r\n                                      {{item.Value}}\r\n                                    </option>\r\n                                  </select>\r\n                                </div>\r\n                                <div *ngIf="!question.isEvent">\r\n                                  <select name="{{question.name}}" class="form-control search-form-control"\r\n                                    attr.query-in="{{question.isQueryIn}}" attr.data-type="{{question.datatype}}">\r\n                                    <option *ngIf="!question.isSelectOne" value="All">\r\n                                      All\r\n                                    </option>\r\n                                    <option *ngFor="let item of question?.itemsUrl" value="{{item.Key}}">\r\n                                      {{item.Value}}\r\n                                    </option>\r\n                                  </select>\r\n                                </div>\r\n                              </div>\r\n                            </div>\r\n                          </div>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                  <div class="col-md-12 no-padding">\r\n                    <form>\r\n                      <div class="form-actions right">\r\n                        <button *ngIf="exportData == true" type="button" (click)="exportAsXLSX()"\r\n                          class="btn btn-raised btn-success mr-1" translate>\r\n                          <i class="fa ft-download"></i> Export Excel\r\n                        </button>\r\n                        <button type="button" (click)="reset()" class="btn btn-raised btn-warning mr-1" translate>\r\n                          <i class="fa fa-times"></i> Reset\r\n                        </button>\r\n                        <button type="button" (click)="searchClick()" class="btn btn-raised btn-primary" #UCSearchClick\r\n                          translate>\r\n                          <i class="fa fa-search"></i> Search\r\n                        </button>\r\n                      </div>\r\n                    </form>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n            </form>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</section>\r\n<br>\r\n\x3c!-- // Basic form layout section end --\x3e',providers:[h],animations:[i.trigger("changeDivSize",[i.state("initial",i.style({height:"*",opacity:"1"})),i.state("final",i.style({height:"0px",opacity:"0",overflow:"hidden"})),i.transition("initial=>final",i.animate("300ms")),i.transition("final=>initial",i.animate("300ms"))])],styles:[".ucSearch-title{margin:3px}"]}]}],q.ctorParameters=function(){return[{type:e.HttpClient},{type:h},{type:a.Renderer2},{type:undefined,decorators:[{type:a.Inject,args:[n.DOCUMENT]}]}]},q.propDecorators={myForm:[{type:a.ViewChild,args:["formIdSearch"]}],searchInput:[{type:a.Input}],pageSize:[{type:a.Input}],result:[{type:a.Output}]},q);function q(t,e,n,r){this.http=t,this.excelService=e,this._renderer2=n,this._document=r,this.searchInput=new p,this.pageSize=10,this.result=new a.EventEmitter,this.pageNow=1,this.isDataLoaded=!1,this.isHidden=!1,this.currentState="initial",this.countForm=0,this.formattedAmount="",this.amount=0}var b={align:"right",allowNegative:!1,allowZero:!0,decimal:".",precision:2,prefix:"",suffix:"",thousands:",",nullable:!1,inputMode:l.CurrencyMaskInputMode.NATURAL},w=(x.decorators=[{type:a.NgModule,args:[{declarations:[I],imports:[m.CommonModule,s.FormsModule,l.NgxCurrencyModule.forRoot(b)],exports:[I]}]}],x);function x(){}t.UCSearchService=c,t.UCSearchComponent=I,t.customCurrencyMaskConfig=b,t.UCSearchModule=w,t.ɵa=h,Object.defineProperty(t,"__esModule",{value:!0})});
+!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@angular/common/http"),require("@angular/platform-browser"),require("file-saver"),require("xlsx"),require("@angular/animations"),require("@angular/core"),require("@angular/common"),require("@angular/forms"),require("ngx-currency")):"function"==typeof define&&define.amd?define("@adins/ucsearch",["exports","@angular/common/http","@angular/platform-browser","file-saver","xlsx","@angular/animations","@angular/core","@angular/common","@angular/forms","ngx-currency"],e):e((t.adins=t.adins||{},t.adins.ucsearch={}),t.ng.common.http,t.ng.platformBrowser,t.FileSaver,t.XLSX,t.ng.animations,t.ng.core,t.ng.common,t.ng.forms,t.ngxCurrency)}(this,function(t,e,n,r,o,i,a,m,s,l){"use strict";var c=(u.decorators=[{type:a.Injectable,args:[{providedIn:"root"}]}],u.ctorParameters=function(){return[]},u.ngInjectableDef=a.defineInjectable({factory:function(){return new u},token:u,providedIn:"root"}),u);function u(){}var p=function S(){this._url="",this.enviromentUrl="",this.title="",this.apiQryPaging="",this.arrCritObj=null,this.addCritInput=new Array,this.ddlEnvironments=new Array,this.whereValue=new Array,this.switchValue=new Array},v=function k(){this.low=0,this.high=0,this.DataType="Text"},g=function C(){this.includeCount=!0,this.includeData=!0,this.isLoading=!0,this.queryString="",this.rowVersion=""},y=(d.RestrictionBetween="Between",d.RestrictionLike="Like",d.RestrictionEq="Eq",d.RestrictionNeq="NEQ",d.RestrictionGt="GT",d.RestrictionGte="GTE",d.RestrictionLt="LT",d.RestrictionLte="LTE",d.RestrictionIn="IN",d.RestrictionNotIn="NotIn",d.RestrictionOr="Or",d.RestrictionOrNeq="OrNeq",d.RestrictionIsNull="isnull",d.RestrictionIsNotNull="isnotnull",d.RestrictionGTE="GTE",d.RestrictionLTE="LTE",d.showData="10,50,100",d);function d(){}var h=(f.prototype.exportAsExcelFile=function(t,e){var n=o.utils.json_to_sheet(t);console.log("worksheet",n);var r={Sheets:{data:n},SheetNames:["data"]},i=o.write(r,{bookType:"xlsx",type:"array"});this.saveAsExcelFile(i,e)},f.prototype.saveAsExcelFile=function(t,e){var n=new Blob([t],{type:"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=UTF-8"});r.saveAs(n,e+"_export_"+(new Date).getTime()+".xlsx")},f.decorators=[{type:a.Injectable}],f.ctorParameters=function(){return[]},f);function f(){}var I=(q.prototype.changeState=function(){this.currentState="initial"===this.currentState?"final":"initial",this.isHidden=!1===this.isHidden},q.prototype.ngOnInit=function(){console.log("ucsearch"),this.apiUrl=this.searchInput.enviromentUrl+this.searchInput.apiQryPaging,this.arrCrit=this.searchInput.arrCritObj;var t=this._renderer2.createElement("script");t.text='\n          $(document).ready(function(){\n            $("#flip").click(function(){\n              $("#panel").slideToggle("slow");\n            });\n          });\n        ',this._renderer2.appendChild(this._document.body,t),this.initiateForm()},q.prototype.initiateForm=function(){var h=this;this.getJSON(this.searchInput._url).subscribe(function(t){h.configuration=t,h.exportData=t.exportExcel,h.countForm=t.component.length,h.isDataLoaded=!0,h.searchInput.title!=undefined&&""!=h.searchInput.title&&(h.configuration.title=h.searchInput.title);for(var e=0;e<h.countForm;e++){if(1==t.component[e].isFromURL){var n=new g,r=new Array,i=new v;if(i.DataType="text",i.propName=t.component[e].criteriaPropName,i.value=t.component[e].criteriaPropValue,i.restriction="eq",r.push(i),n.criteria=r,n[t.component[e].criteriaPropName]=t.component[e].criteriaPropValue,t.component[e].path!=undefined&&""!=t.component[e].path)if(h.searchInput.ddlEnvironments!=undefined&&0!=h.searchInput.ddlEnvironments.length){for(var o=0;o<h.searchInput.ddlEnvironments.length;o++)if(t.component[e].name==h.searchInput.ddlEnvironments[o].name){t.component[e].fullpath=h.searchInput.ddlEnvironments[o].environment+t.component[e].path;break}}else t.component[e].fullpath=t.component[e].url;else t.component[e].fullpath=t.component[e].url;h.resolveObject(t.component[e],t.component[e].fullpath,n)}if("numeric"==t.component[e].type&&(t.component[e].value=parseFloat(t.component[e].value).toLocaleString("en")),"datepicker"==t.component[e].type&&t.component[e].value.includes("BD")){var a=localStorage.getItem("BusinessDateRaw"),s=new Date;null!=a&&(s=new Date(a));var l=t.component[e].value.charAt(2),c=new Date;if("-"==l){var u=t.component[e].value.split("-",2),p=parseInt(u[1]);c.setDate(s.getDate()-p)}else"+"==l?(u=t.component[e].value.split("+",2),p=parseInt(u[1]),c.setDate(s.getDate()+p)):c=s;var d=m.formatDate(c,"yyyy-MM-dd","en-US");t.component[e].value=d}}})},q.prototype.getJSON=function(t){return this.http.get(t)},q.prototype.postJSON=function(t,e){return void 0===e&&(e=null),this.http.post(t,e)},q.prototype.searchClick=function(){var t=null;null!=this.configuration.orderby&&(t={key:this.configuration.orderby.key,value:this.configuration.orderby.value}),this.pageNow=1,this.search(this.apiUrl,this.pageNow,this.pageSize,t,this.arrCrit)},q.prototype.reset=function(){this.initiateForm()},q.prototype.search=function(t,n,e,r,i){var o=this;void 0===i&&(i=new Array);var a=new g,s=new Array,l=!1;if(this.searchInput.whereValue!=undefined&&0!=this.searchInput.whereValue.length){this.configuration.querystring.whereQuery=new Array;for(var c=0;c<this.searchInput.whereValue.length;c++)this.configuration.querystring.whereQuery.push(this.searchInput.whereValue[c].value)}a.pageNo=n,a.rowPerPage=e,a.orderBy=r,a.queryString=this.configuration.querystring;for(var u=0;u<this.countForm;u++){var p=new v,d=this.myForm.nativeElement[u];if(p.DataType=d.getAttribute("data-type"),l=null!=d.getAttribute("query-in")&&"true"==d.getAttribute("query-in"),""!=d.value)if("SELECT"==d.nodeName){var h=d.options,m=h[h.selectedIndex].value.trim();if("All"!=m)p.restriction=y.RestrictionEq,p.propName=d.name,p.value=m,s.push(p);else if("All"==m&&1==l&&0!=d.options.length){var f=new Array;for(c=0;c<d.options.length;c++)0!=c&&f.push(d.options[c].value);0!=f.length&&(p.restriction=y.RestrictionIn,p.propName=d.name,p.listValue=f,s.push(p))}}else p.propName=d.name,p.value=d.value.trim(),d.value.includes("%")?p.restriction=y.RestrictionLike:""!=d.getAttribute("data-restriction")&&null!=d.getAttribute("data-restriction")?(p.restriction=d.getAttribute("data-restriction"),"numeric"==d.getAttribute("data-type")&&(d.value=parseFloat(d.value.replace(/,/g,""))),"LIKE"==p.restriction.toUpperCase()&&(p.value="%"+d.value.trim()+"%",p.restriction=y.RestrictionLike)):p.restriction=y.RestrictionEq,s.push(p)}if(null!=i&&i!=undefined){if(0!=i.length)for(u=0;u<i.length;u++)s.push(i[u]);else if(null!=this.searchInput.addCritInput||this.searchInput.addCritInput!=undefined)for(u=0;u<this.searchInput.addCritInput.length;u++)s.push(this.searchInput.addCritInput[u])}else if(null!=this.searchInput.addCritInput||this.searchInput.addCritInput!=undefined)for(u=0;u<this.searchInput.addCritInput.length;u++)s.push(this.searchInput.addCritInput[u]);a.criteria=s,this.http.post(t,a).subscribe(function(t){var e={response:t,pageNow:n};return console.log(e),o.result.emit(e),t})},q.prototype.lessThanFour=function(){return!(3<this.countForm)},q.prototype.resolveObject=function(e,t,n){void 0===n&&(n=null),this.postJSON(t,n).subscribe(function(t){e.itemsUrl=new Array,e.itemsUrl=t.ReturnObject})},q.prototype.transformAmount=function(t){this.formattedAmount=parseFloat(t.target.value).toLocaleString("en"),t.target.value=this.formattedAmount},q.prototype.transformToDecimal=function(t){t.target.value=parseFloat(t.target.value.toString().replace(/,/g,""))},q.prototype.exportAsXLSX=function(){var e=this,t=new g;t.pageNo=1,t.rowPerPage=9999,t.orderBy=null,t.criteria=[],t.queryString=this.configuration.querystring,this.http.post(this.apiUrl,t).subscribe(function(t){e.ExcelData=t.Data,e.excelService.exportAsExcelFile(e.ExcelData,"sample")},function(t){console.log(t)})},q.prototype.onChangeEvent=function(t,e){for(var n=this.configuration.component,r=0;r<e.affectedFilter.length;r++)for(var i=0;i<n.length;i++)if(n[i].name==e.affectedFilter[r]){var o=new g,a=new Array;if("All"!=t){var s=new v;s.DataType=e.datatype,s.propName=e.name,s.value=t,s.restriction=y.RestrictionEq,a.push(s)}if(o.criteria=a,n[i].path!=undefined&&""!=n[i].path)if(this.searchInput.ddlEnvironments!=undefined&&0!=this.searchInput.ddlEnvironments.length){for(var l=0;l<this.searchInput.ddlEnvironments.length;l++)if(n[i].name==this.searchInput.ddlEnvironments[l].name){n[i].fullpath=this.searchInput.ddlEnvironments[l].environment+n[i].path;break}}else n[i].fullpath=n[i].url;else n[i].fullpath=n[i].url;this.resolveObject(n[i],n[i].fullpath,o)}},q.prototype.switchCase=function(e){for(var t=!1,n=0;n<e.conditions.length;n++){var r=this.searchInput.switchValue.findIndex(function(t){return t.property==e.conditions[n].property});if("EQ"==e.conditions[n].restriction)if(1!=e.conditions[n].isUser){if(this.searchInput.switchValue[r].value!=e.conditions[n].value){t=!1;break}t=!0}else{var i=localStorage.getItem("Username");if(this.searchInput.switchValue[r].value!=i){t=!1;break}t=!0}else if("NEQ"==e.conditions[n].restriction)if(1!=e.conditions[n].isUser){if(this.searchInput.switchValue[r].value==e.conditions[n].value){t=!1;break}t=!0}else{if(i=localStorage.getItem("Username"),this.searchInput.switchValue[r].value==i){t=!1;break}t=!0}else if("GT"==e.conditions[n].restriction)if(1!=e.conditions[n].isUser){if(!(this.searchInput.switchValue[r].value>e.conditions[n].value)){t=!1;break}t=!0}else{if(i=localStorage.getItem("Username"),!(this.searchInput.switchValue[r].value>i)){t=!1;break}t=!0}else if("GTE"==e.conditions[n].restriction)if(1!=e.conditions[n].isUser){if(!(this.searchInput.switchValue[r].value>=e.conditions[n].value)){t=!1;break}t=!0}else{if(i=localStorage.getItem("Username"),!(this.searchInput.switchValue[r].value>=i)){t=!1;break}t=!0}else if("LT"==e.conditions[n].restriction)if(1!=e.conditions[n].isUser){if(!(this.searchInput.switchValue[r].value<e.conditions[n].value)){t=!1;break}t=!0}else{if(i=localStorage.getItem("Username"),!(this.searchInput.switchValue[r].value<i)){t=!1;break}t=!0}else if("LTE"==e.conditions[n].restriction)if(1!=e.conditions[n].isUser){if(!(this.searchInput.switchValue[r].value<=e.conditions[n].value)){t=!1;break}t=!0}else{if(i=localStorage.getItem("Username"),!(this.searchInput.switchValue[r].value<=i)){t=!1;break}t=!0}}return t},q.decorators=[{type:a.Component,args:[{selector:"lib-UCSearch",template:'\x3c!-- Basic form layout section start --\x3e\r\n<section id="horizontal-form-layouts">\r\n  <div class="row text-left">\r\n    <div class="col-md-12">\r\n      <div class="card">\r\n        <div class="pl-3 mb-2 mt-2" *ngIf="configuration?.title != undefined && configuration?.title != \'\'">\r\n          <h4 class="card-title ucSearch-title" translate> {{ configuration.title }} </h4>\r\n        </div>\r\n        <div class="card-body">\r\n          <div class="px-3">\r\n            <form class="form form-horizontal" id="formSearch" #formIdSearch #enjiForm="ngForm" (ngSubmit)="false">\r\n              <div class="form-body">\r\n                <h4 class="form-section font-weight-bold">\r\n                  <div (click)="changeState()" class="btn no-padding cursor-pointer flip">\r\n                    <i class="fa" style="font-size: 15px; margin: 0px 0px 5px -15px;"\r\n                      [ngClass]="isHidden ? \'fa-chevron-right\' : \'fa-chevron-down\'"></i>\r\n                  </div>\r\n                  <span\r\n                    *ngIf="configuration?.sectionTitle != undefined && configuration?.sectionTitle != \'\'; then inputSectionTitle else defaultSectionTitle"></span>\r\n                  <ng-template #inputSectionTitle>\r\n                    {{configuration?.sectionTitle}}\r\n                  </ng-template>\r\n                  <ng-template #defaultSectionTitle>\r\n                    Paging\r\n                  </ng-template>\r\n                </h4>\r\n                \x3c!-- Ini Digunakan untuk Generate Dynamic Component --\x3e\r\n                \x3c!-- [hidden]="isHidden" --\x3e\r\n                <div class="panel-active" [@changeDivSize]=currentState>\r\n                  <div class="row">\r\n                    <div class="col-md-6 form-group" *ngFor="let question of configuration?.component">\r\n                      <div class="col-md-12">\r\n                        <div class="row">\r\n                          <label class="col-md-5 no-padding" for="{{question.id}}" translate>{{question.label}}</label>\r\n                          <div class="col-md-7 no-padding">\r\n                            <div *ngIf="question.type==\'textbox\'">\r\n                              <input type="text" id="{{question.id}}" class="form-control search-form-control"\r\n                                name="{{question.name}}" value="{{question.value}}" (keyup.enter)="searchClick()"\r\n                                attr.data-type="{{question.datatype}}" attr.data-restriction="{{question.restriction}}">\r\n                            </div>\r\n                            <div *ngIf="question.type==\'textarea\'">\r\n                              <textarea type="text" id="{{question.id}}" class="form-control search-form-control"\r\n                                name="{{question.name}}" attr.data-type="{{question.datatype}}"\r\n                                value="{{question.value}}"></textarea>\r\n                            </div>\r\n                            <div *ngIf="question.type==\'numeric\'">\r\n                              <input type="text" id="{{question.id}}" (focus)="transformToDecimal($event)"\r\n                                (blur)="transformAmount($event)" class="form-control search-form-control"\r\n                                name="{{question.name}}" value="{{question.value}}" (keyup.enter)="searchClick()"\r\n                                attr.data-restriction="{{question.restriction}}" attr.data-type="{{question.datatype}}">\r\n                            </div>\r\n                            <div *ngIf="question.type==\'currency\'">\r\n                              <span\r\n                                *ngIf="question?.isCustom != undefined && question?.isCustom; then customTypeCurrency else defaultTypeCurrency"></span>\r\n                              <ng-template #customTypeCurrency>\r\n                                <input type="text" id="{{question.id}}" class="form-control search-form-control"\r\n                                  name="{{question.name}}" value="{{question.value}}" (keyup.enter)="searchClick()"\r\n                                  attr.data-restriction="{{question.restriction}}"\r\n                                  attr.data-type="{{question.datatype}}" currencyMask\r\n                                  [options]="{ thousands: question.thousands, decimal: question.decimal, align: question.align, allowNegative: question.allowNegative, allowZero: question.allowZero, precision: question.precision, nullable: question.nullable }">\r\n                              </ng-template>\r\n                              <ng-template #defaultTypeCurrency>\r\n                                <input type="text" id="{{question.id}}" class="form-control search-form-control"\r\n                                  name="{{question.name}}" value="{{question.value}}" (keyup.enter)="searchClick()"\r\n                                  attr.data-restriction="{{question.restriction}}"\r\n                                  attr.data-type="{{question.datatype}}" currencyMask\r\n                                  [options]="{ thousands: \'question.thousands\', decimal: \'.\', align: \'right\', allowNegative: false, allowZero:true, precision: 2, nullable: false }">\r\n                              </ng-template>\r\n                            </div>\r\n\r\n                            \x3c!-- End Hardcode Lookup didalem--\x3e\r\n                            <div *ngIf="question.type==\'datepicker\'">\r\n                              <input type="date" id="{{question.id}}"\r\n                                class="form-control search-form-control btn-lookup" name="{{question.name}}"\r\n                                value="{{question.value}}" attr.data-type="{{question.datatype}}"\r\n                                (keyup.enter)="searchClick()" attr.data-restriction="{{question.restriction}}">\r\n                            </div>\r\n                            <div *ngIf="question.type==\'dropdown\'">\r\n                              \x3c!-- Ini kalau datanya tidak di load dari URL --\x3e\r\n                              <div *ngIf="!question.isFromURL">\r\n                                <select name="{{question.name}}" class="form-control search-form-control"\r\n                                  attr.query-in="{{question.isQueryIn}}" attr.data-type="{{question.datatype}}">\r\n                                  <option *ngIf="!question.isSelectOne" value="All">\r\n                                    All\r\n                                  </option>\r\n                                  <option *ngFor="let item of question?.items" value="{{item.key}}">\r\n                                    {{item.value}}\r\n                                  </option>\r\n                                </select>\r\n                              </div>\r\n                              \x3c!-- Ini kalau datanya di load dari URL --\x3e\r\n                              <div *ngIf="question.isFromURL">\r\n                                <div *ngIf="question.isEvent">\r\n                                  <select name="{{question.name}}"\r\n                                    (change)="onChangeEvent($event.target.value, question)"\r\n                                    class="form-control search-form-control" attr.query-in="{{question.isQueryIn}}"\r\n                                    attr.data-type="{{question.datatype}}">\r\n                                    <option *ngIf="!question.isSelectOne" value="All">\r\n                                      All\r\n                                    </option>\r\n                                    <option *ngFor="let item of question?.itemsUrl" value="{{item.Key}}">\r\n                                      {{item.Value}}\r\n                                    </option>\r\n                                  </select>\r\n                                </div>\r\n                                <div *ngIf="!question.isEvent">\r\n                                  <select name="{{question.name}}" class="form-control search-form-control"\r\n                                    attr.query-in="{{question.isQueryIn}}" attr.data-type="{{question.datatype}}">\r\n                                    <option *ngIf="!question.isSelectOne" value="All">\r\n                                      All\r\n                                    </option>\r\n                                    <option *ngFor="let item of question?.itemsUrl" value="{{item.Key}}">\r\n                                      {{item.Value}}\r\n                                    </option>\r\n                                  </select>\r\n                                </div>\r\n                              </div>\r\n                            </div>\r\n                          </div>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                  <div class="col-md-12 no-padding">\r\n                    <form>\r\n                      <div class="form-actions right">\r\n                        <button *ngIf="exportData == true" type="button" (click)="exportAsXLSX()"\r\n                          class="btn btn-raised btn-success mr-1" translate>\r\n                          <i class="fa ft-download"></i> Export Excel\r\n                        </button>\r\n                        <button type="button" (click)="reset()" class="btn btn-raised btn-warning mr-1" translate>\r\n                          <i class="fa fa-times"></i> Reset\r\n                        </button>\r\n                        <button type="button" (click)="searchClick()" class="btn btn-raised btn-primary" #UCSearchClick\r\n                          translate>\r\n                          <i class="fa fa-search"></i> Search\r\n                        </button>\r\n                      </div>\r\n                    </form>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n            </form>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</section>\r\n<br>\r\n\x3c!-- // Basic form layout section end --\x3e',providers:[h],animations:[i.trigger("changeDivSize",[i.state("initial",i.style({height:"*",opacity:"1"})),i.state("final",i.style({height:"0px",opacity:"0",overflow:"hidden"})),i.transition("initial=>final",i.animate("300ms")),i.transition("final=>initial",i.animate("300ms"))])],styles:[".ucSearch-title{margin:3px}"]}]}],q.ctorParameters=function(){return[{type:e.HttpClient},{type:h},{type:a.Renderer2},{type:undefined,decorators:[{type:a.Inject,args:[n.DOCUMENT]}]}]},q.propDecorators={myForm:[{type:a.ViewChild,args:["formIdSearch"]}],searchInput:[{type:a.Input}],pageSize:[{type:a.Input}],result:[{type:a.Output}]},q);function q(t,e,n,r){this.http=t,this.excelService=e,this._renderer2=n,this._document=r,this.searchInput=new p,this.pageSize=10,this.result=new a.EventEmitter,this.pageNow=1,this.isDataLoaded=!1,this.isHidden=!1,this.currentState="initial",this.countForm=0,this.formattedAmount="",this.amount=0}var b={align:"right",allowNegative:!1,allowZero:!0,decimal:".",precision:2,prefix:"",suffix:"",thousands:",",nullable:!1,inputMode:l.CurrencyMaskInputMode.NATURAL},w=(x.decorators=[{type:a.NgModule,args:[{declarations:[I],imports:[m.CommonModule,s.FormsModule,l.NgxCurrencyModule.forRoot(b)],exports:[I]}]}],x);function x(){}t.UCSearchService=c,t.UCSearchComponent=I,t.customCurrencyMaskConfig=b,t.UCSearchModule=w,t.ɵa=h,Object.defineProperty(t,"__esModule",{value:!0})});
 //# sourceMappingURL=adins-ucsearch.umd.min.js.map

package/esm2015/lib/ucsearch.component.js

@@ -588,7 +588,7 @@ export class UCSearchComponent {
 UCSearchComponent.decorators = [
     { type: Component, args: [{
                 selector: 'lib-UCSearch',
-                template: "<!-- Basic form layout section start -->\r\n<section id=\"horizontal-form-layouts\">\r\n  <div class=\"row text-left\">\r\n    <div class=\"col-md-12\">\r\n      <div class=\"card\">\r\n        <div class=\"pl-3 mb-2 mt-2\" *ngIf=\"configuration?.title != undefined && configuration?.title != ''\">\r\n          <h4 class=\"card-title ucSearch-title\" translate> {{ configuration.title }} </h4>\r\n        </div>\r\n        <div class=\"card-body\">\r\n          <div class=\"px-3\">\r\n            <form class=\"form form-horizontal\" id=\"formSearch\" #formIdSearch #enjiForm=\"ngForm\" (ngSubmit)=\"false\">\r\n              <div class=\"form-body\">\r\n                <h4 class=\"form-section font-weight-bold\">\r\n                  <div (click)=\"changeState()\" class=\"btn no-padding cursor-pointer flip\">\r\n                    <i class=\"fa\" style=\"font-size: 15px; margin: 0px 0px 5px -15px;\"\r\n                      [ngClass]=\"isHidden ? 'fa-chevron-right' : 'fa-chevron-down'\"></i>\r\n                  </div>\r\n                  <span\r\n                    *ngIf=\"configuration?.sectionTitle != undefined && configuration?.sectionTitle != ''; then inputSectionTitle else defaultSectionTitle\"></span>\r\n                  <ng-template #inputSectionTitle>\r\n                    {{configuration?.sectionTitle}}\r\n                  </ng-template>\r\n                  <ng-template #defaultSectionTitle>\r\n                    Paging\r\n                  </ng-template>\r\n                </h4>\r\n                <!-- Ini Digunakan untuk Generate Dynamic Component -->\r\n                <!-- [hidden]=\"isHidden\" -->\r\n                <div class=\"panel-active\" [@changeDivSize]=currentState>\r\n                  <div class=\"row\">\r\n                    <div class=\"col-md-6 form-group\" *ngFor=\"let question of configuration?.component\">\r\n                      <div class=\"col-md-12\">\r\n                        <div class=\"row\">\r\n                          <label class=\"col-md-5 no-padding\" for=\"{{question.id}}\" translate>{{question.label}}</label>\r\n                          <div class=\"col-md-7 no-padding\">\r\n                            <div *ngIf=\"question.type=='textbox'\">\r\n                              <input type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                attr.data-type=\"{{question.datatype}}\" attr.data-restriction=\"{{question.restriction}}\">\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='textarea'\">\r\n                              <textarea type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                name=\"{{question.name}}\" attr.data-type=\"{{question.datatype}}\"\r\n                                value=\"{{question.value}}\"></textarea>\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='numeric'\">\r\n                              <input type=\"text\" id=\"{{question.id}}\" (focus)=\"transformToDecimal($event)\"\r\n                                (blur)=\"transformAmount($event)\" class=\"form-control search-form-control\"\r\n                                name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                attr.data-restriction=\"{{question.restriction}}\" attr.data-type=\"{{question.datatype}}\">\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='currency'\">\r\n                              <span\r\n                                *ngIf=\"question?.isCustom != undefined && question?.isCustom; then customTypeCurrency else defaultTypeCurrency\"></span>\r\n                              <ng-template #customTypeCurrency>\r\n                                <input type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                  name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                  attr.data-restriction=\"{{question.restriction}}\"\r\n                                  attr.data-type=\"{{question.datatype}}\" currencyMask\r\n                                  [options]=\"{ thousands: 'question.thousands', decimal: '.', align: 'right', allowNegative: false, allowZero:true, precision: 2, nullable: false }\">\r\n                              </ng-template>\r\n                              <ng-template #defaultTypeCurrency>\r\n                                <input type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                  name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                  attr.data-restriction=\"{{question.restriction}}\"\r\n                                  attr.data-type=\"{{question.datatype}}\" currencyMask\r\n                                  [options]=\"{ thousands: question.thousands, decimal: question.decimal, align: question.align, allowNegative: question.allowNegative, allowZero: question.allowZero, precision: question.precision, nullable: question.nullable }\">\r\n                              </ng-template>\r\n                            </div>\r\n\r\n                            <!-- End Hardcode Lookup didalem-->\r\n                            <div *ngIf=\"question.type=='datepicker'\">\r\n                              <input type=\"date\" id=\"{{question.id}}\"\r\n                                class=\"form-control search-form-control btn-lookup\" name=\"{{question.name}}\"\r\n                                value=\"{{question.value}}\" attr.data-type=\"{{question.datatype}}\"\r\n                                (keyup.enter)=\"searchClick()\" attr.data-restriction=\"{{question.restriction}}\">\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='dropdown'\">\r\n                              <!-- Ini kalau datanya tidak di load dari URL -->\r\n                              <div *ngIf=\"!question.isFromURL\">\r\n                                <select name=\"{{question.name}}\" class=\"form-control search-form-control\"\r\n                                  attr.query-in=\"{{question.isQueryIn}}\" attr.data-type=\"{{question.datatype}}\">\r\n                                  <option *ngIf=\"!question.isSelectOne\" value=\"All\">\r\n                                    All\r\n                                  </option>\r\n                                  <option *ngFor=\"let item of question?.items\" value=\"{{item.key}}\">\r\n                                    {{item.value}}\r\n                                  </option>\r\n                                </select>\r\n                              </div>\r\n                              <!-- Ini kalau datanya di load dari URL -->\r\n                              <div *ngIf=\"question.isFromURL\">\r\n                                <div *ngIf=\"question.isEvent\">\r\n                                  <select name=\"{{question.name}}\"\r\n                                    (change)=\"onChangeEvent($event.target.value, question)\"\r\n                                    class=\"form-control search-form-control\" attr.query-in=\"{{question.isQueryIn}}\"\r\n                                    attr.data-type=\"{{question.datatype}}\">\r\n                                    <option *ngIf=\"!question.isSelectOne\" value=\"All\">\r\n                                      All\r\n                                    </option>\r\n                                    <option *ngFor=\"let item of question?.itemsUrl\" value=\"{{item.Key}}\">\r\n                                      {{item.Value}}\r\n                                    </option>\r\n                                  </select>\r\n                                </div>\r\n                                <div *ngIf=\"!question.isEvent\">\r\n                                  <select name=\"{{question.name}}\" class=\"form-control search-form-control\"\r\n                                    attr.query-in=\"{{question.isQueryIn}}\" attr.data-type=\"{{question.datatype}}\">\r\n                                    <option *ngIf=\"!question.isSelectOne\" value=\"All\">\r\n                                      All\r\n                                    </option>\r\n                                    <option *ngFor=\"let item of question?.itemsUrl\" value=\"{{item.Key}}\">\r\n                                      {{item.Value}}\r\n                                    </option>\r\n                                  </select>\r\n                                </div>\r\n                              </div>\r\n                            </div>\r\n                          </div>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                  <div class=\"col-md-12 no-padding\">\r\n                    <form>\r\n                      <div class=\"form-actions right\">\r\n                        <button *ngIf=\"exportData == true\" type=\"button\" (click)=\"exportAsXLSX()\"\r\n                          class=\"btn btn-raised btn-success mr-1\" translate>\r\n                          <i class=\"fa ft-download\"></i> Export Excel\r\n                        </button>\r\n                        <button type=\"button\" (click)=\"reset()\" class=\"btn btn-raised btn-warning mr-1\" translate>\r\n                          <i class=\"fa fa-times\"></i> Reset\r\n                        </button>\r\n                        <button type=\"button\" (click)=\"searchClick()\" class=\"btn btn-raised btn-primary\" #UCSearchClick\r\n                          translate>\r\n                          <i class=\"fa fa-search\"></i> Search\r\n                        </button>\r\n                      </div>\r\n                    </form>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n            </form>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</section>\r\n<br>\r\n<!-- // Basic form layout section end -->",
+                template: "<!-- Basic form layout section start -->\r\n<section id=\"horizontal-form-layouts\">\r\n  <div class=\"row text-left\">\r\n    <div class=\"col-md-12\">\r\n      <div class=\"card\">\r\n        <div class=\"pl-3 mb-2 mt-2\" *ngIf=\"configuration?.title != undefined && configuration?.title != ''\">\r\n          <h4 class=\"card-title ucSearch-title\" translate> {{ configuration.title }} </h4>\r\n        </div>\r\n        <div class=\"card-body\">\r\n          <div class=\"px-3\">\r\n            <form class=\"form form-horizontal\" id=\"formSearch\" #formIdSearch #enjiForm=\"ngForm\" (ngSubmit)=\"false\">\r\n              <div class=\"form-body\">\r\n                <h4 class=\"form-section font-weight-bold\">\r\n                  <div (click)=\"changeState()\" class=\"btn no-padding cursor-pointer flip\">\r\n                    <i class=\"fa\" style=\"font-size: 15px; margin: 0px 0px 5px -15px;\"\r\n                      [ngClass]=\"isHidden ? 'fa-chevron-right' : 'fa-chevron-down'\"></i>\r\n                  </div>\r\n                  <span\r\n                    *ngIf=\"configuration?.sectionTitle != undefined && configuration?.sectionTitle != ''; then inputSectionTitle else defaultSectionTitle\"></span>\r\n                  <ng-template #inputSectionTitle>\r\n                    {{configuration?.sectionTitle}}\r\n                  </ng-template>\r\n                  <ng-template #defaultSectionTitle>\r\n                    Paging\r\n                  </ng-template>\r\n                </h4>\r\n                <!-- Ini Digunakan untuk Generate Dynamic Component -->\r\n                <!-- [hidden]=\"isHidden\" -->\r\n                <div class=\"panel-active\" [@changeDivSize]=currentState>\r\n                  <div class=\"row\">\r\n                    <div class=\"col-md-6 form-group\" *ngFor=\"let question of configuration?.component\">\r\n                      <div class=\"col-md-12\">\r\n                        <div class=\"row\">\r\n                          <label class=\"col-md-5 no-padding\" for=\"{{question.id}}\" translate>{{question.label}}</label>\r\n                          <div class=\"col-md-7 no-padding\">\r\n                            <div *ngIf=\"question.type=='textbox'\">\r\n                              <input type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                attr.data-type=\"{{question.datatype}}\" attr.data-restriction=\"{{question.restriction}}\">\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='textarea'\">\r\n                              <textarea type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                name=\"{{question.name}}\" attr.data-type=\"{{question.datatype}}\"\r\n                                value=\"{{question.value}}\"></textarea>\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='numeric'\">\r\n                              <input type=\"text\" id=\"{{question.id}}\" (focus)=\"transformToDecimal($event)\"\r\n                                (blur)=\"transformAmount($event)\" class=\"form-control search-form-control\"\r\n                                name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                attr.data-restriction=\"{{question.restriction}}\" attr.data-type=\"{{question.datatype}}\">\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='currency'\">\r\n                              <span\r\n                                *ngIf=\"question?.isCustom != undefined && question?.isCustom; then customTypeCurrency else defaultTypeCurrency\"></span>\r\n                              <ng-template #customTypeCurrency>\r\n                                <input type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                  name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                  attr.data-restriction=\"{{question.restriction}}\"\r\n                                  attr.data-type=\"{{question.datatype}}\" currencyMask\r\n                                  [options]=\"{ thousands: question.thousands, decimal: question.decimal, align: question.align, allowNegative: question.allowNegative, allowZero: question.allowZero, precision: question.precision, nullable: question.nullable }\">\r\n                              </ng-template>\r\n                              <ng-template #defaultTypeCurrency>\r\n                                <input type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                  name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                  attr.data-restriction=\"{{question.restriction}}\"\r\n                                  attr.data-type=\"{{question.datatype}}\" currencyMask\r\n                                  [options]=\"{ thousands: 'question.thousands', decimal: '.', align: 'right', allowNegative: false, allowZero:true, precision: 2, nullable: false }\">\r\n                              </ng-template>\r\n                            </div>\r\n\r\n                            <!-- End Hardcode Lookup didalem-->\r\n                            <div *ngIf=\"question.type=='datepicker'\">\r\n                              <input type=\"date\" id=\"{{question.id}}\"\r\n                                class=\"form-control search-form-control btn-lookup\" name=\"{{question.name}}\"\r\n                                value=\"{{question.value}}\" attr.data-type=\"{{question.datatype}}\"\r\n                                (keyup.enter)=\"searchClick()\" attr.data-restriction=\"{{question.restriction}}\">\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='dropdown'\">\r\n                              <!-- Ini kalau datanya tidak di load dari URL -->\r\n                              <div *ngIf=\"!question.isFromURL\">\r\n                                <select name=\"{{question.name}}\" class=\"form-control search-form-control\"\r\n                                  attr.query-in=\"{{question.isQueryIn}}\" attr.data-type=\"{{question.datatype}}\">\r\n                                  <option *ngIf=\"!question.isSelectOne\" value=\"All\">\r\n                                    All\r\n                                  </option>\r\n                                  <option *ngFor=\"let item of question?.items\" value=\"{{item.key}}\">\r\n                                    {{item.value}}\r\n                                  </option>\r\n                                </select>\r\n                              </div>\r\n                              <!-- Ini kalau datanya di load dari URL -->\r\n                              <div *ngIf=\"question.isFromURL\">\r\n                                <div *ngIf=\"question.isEvent\">\r\n                                  <select name=\"{{question.name}}\"\r\n                                    (change)=\"onChangeEvent($event.target.value, question)\"\r\n                                    class=\"form-control search-form-control\" attr.query-in=\"{{question.isQueryIn}}\"\r\n                                    attr.data-type=\"{{question.datatype}}\">\r\n                                    <option *ngIf=\"!question.isSelectOne\" value=\"All\">\r\n                                      All\r\n                                    </option>\r\n                                    <option *ngFor=\"let item of question?.itemsUrl\" value=\"{{item.Key}}\">\r\n                                      {{item.Value}}\r\n                                    </option>\r\n                                  </select>\r\n                                </div>\r\n                                <div *ngIf=\"!question.isEvent\">\r\n                                  <select name=\"{{question.name}}\" class=\"form-control search-form-control\"\r\n                                    attr.query-in=\"{{question.isQueryIn}}\" attr.data-type=\"{{question.datatype}}\">\r\n                                    <option *ngIf=\"!question.isSelectOne\" value=\"All\">\r\n                                      All\r\n                                    </option>\r\n                                    <option *ngFor=\"let item of question?.itemsUrl\" value=\"{{item.Key}}\">\r\n                                      {{item.Value}}\r\n                                    </option>\r\n                                  </select>\r\n                                </div>\r\n                              </div>\r\n                            </div>\r\n                          </div>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                  <div class=\"col-md-12 no-padding\">\r\n                    <form>\r\n                      <div class=\"form-actions right\">\r\n                        <button *ngIf=\"exportData == true\" type=\"button\" (click)=\"exportAsXLSX()\"\r\n                          class=\"btn btn-raised btn-success mr-1\" translate>\r\n                          <i class=\"fa ft-download\"></i> Export Excel\r\n                        </button>\r\n                        <button type=\"button\" (click)=\"reset()\" class=\"btn btn-raised btn-warning mr-1\" translate>\r\n                          <i class=\"fa fa-times\"></i> Reset\r\n                        </button>\r\n                        <button type=\"button\" (click)=\"searchClick()\" class=\"btn btn-raised btn-primary\" #UCSearchClick\r\n                          translate>\r\n                          <i class=\"fa fa-search\"></i> Search\r\n                        </button>\r\n                      </div>\r\n                    </form>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n            </form>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</section>\r\n<br>\r\n<!-- // Basic form layout section end -->",
                 providers: [ExcelService],
                 animations: [
                     trigger('changeDivSize', [

package/esm5/lib/ucsearch.component.js

@@ -642,7 +642,7 @@ var UCSearchComponent = /** @class */ (function () {
     UCSearchComponent.decorators = [
         { type: Component, args: [{
                     selector: 'lib-UCSearch',
-                    template: "<!-- Basic form layout section start -->\r\n<section id=\"horizontal-form-layouts\">\r\n  <div class=\"row text-left\">\r\n    <div class=\"col-md-12\">\r\n      <div class=\"card\">\r\n        <div class=\"pl-3 mb-2 mt-2\" *ngIf=\"configuration?.title != undefined && configuration?.title != ''\">\r\n          <h4 class=\"card-title ucSearch-title\" translate> {{ configuration.title }} </h4>\r\n        </div>\r\n        <div class=\"card-body\">\r\n          <div class=\"px-3\">\r\n            <form class=\"form form-horizontal\" id=\"formSearch\" #formIdSearch #enjiForm=\"ngForm\" (ngSubmit)=\"false\">\r\n              <div class=\"form-body\">\r\n                <h4 class=\"form-section font-weight-bold\">\r\n                  <div (click)=\"changeState()\" class=\"btn no-padding cursor-pointer flip\">\r\n                    <i class=\"fa\" style=\"font-size: 15px; margin: 0px 0px 5px -15px;\"\r\n                      [ngClass]=\"isHidden ? 'fa-chevron-right' : 'fa-chevron-down'\"></i>\r\n                  </div>\r\n                  <span\r\n                    *ngIf=\"configuration?.sectionTitle != undefined && configuration?.sectionTitle != ''; then inputSectionTitle else defaultSectionTitle\"></span>\r\n                  <ng-template #inputSectionTitle>\r\n                    {{configuration?.sectionTitle}}\r\n                  </ng-template>\r\n                  <ng-template #defaultSectionTitle>\r\n                    Paging\r\n                  </ng-template>\r\n                </h4>\r\n                <!-- Ini Digunakan untuk Generate Dynamic Component -->\r\n                <!-- [hidden]=\"isHidden\" -->\r\n                <div class=\"panel-active\" [@changeDivSize]=currentState>\r\n                  <div class=\"row\">\r\n                    <div class=\"col-md-6 form-group\" *ngFor=\"let question of configuration?.component\">\r\n                      <div class=\"col-md-12\">\r\n                        <div class=\"row\">\r\n                          <label class=\"col-md-5 no-padding\" for=\"{{question.id}}\" translate>{{question.label}}</label>\r\n                          <div class=\"col-md-7 no-padding\">\r\n                            <div *ngIf=\"question.type=='textbox'\">\r\n                              <input type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                attr.data-type=\"{{question.datatype}}\" attr.data-restriction=\"{{question.restriction}}\">\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='textarea'\">\r\n                              <textarea type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                name=\"{{question.name}}\" attr.data-type=\"{{question.datatype}}\"\r\n                                value=\"{{question.value}}\"></textarea>\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='numeric'\">\r\n                              <input type=\"text\" id=\"{{question.id}}\" (focus)=\"transformToDecimal($event)\"\r\n                                (blur)=\"transformAmount($event)\" class=\"form-control search-form-control\"\r\n                                name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                attr.data-restriction=\"{{question.restriction}}\" attr.data-type=\"{{question.datatype}}\">\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='currency'\">\r\n                              <span\r\n                                *ngIf=\"question?.isCustom != undefined && question?.isCustom; then customTypeCurrency else defaultTypeCurrency\"></span>\r\n                              <ng-template #customTypeCurrency>\r\n                                <input type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                  name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                  attr.data-restriction=\"{{question.restriction}}\"\r\n                                  attr.data-type=\"{{question.datatype}}\" currencyMask\r\n                                  [options]=\"{ thousands: 'question.thousands', decimal: '.', align: 'right', allowNegative: false, allowZero:true, precision: 2, nullable: false }\">\r\n                              </ng-template>\r\n                              <ng-template #defaultTypeCurrency>\r\n                                <input type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                  name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                  attr.data-restriction=\"{{question.restriction}}\"\r\n                                  attr.data-type=\"{{question.datatype}}\" currencyMask\r\n                                  [options]=\"{ thousands: question.thousands, decimal: question.decimal, align: question.align, allowNegative: question.allowNegative, allowZero: question.allowZero, precision: question.precision, nullable: question.nullable }\">\r\n                              </ng-template>\r\n                            </div>\r\n\r\n                            <!-- End Hardcode Lookup didalem-->\r\n                            <div *ngIf=\"question.type=='datepicker'\">\r\n                              <input type=\"date\" id=\"{{question.id}}\"\r\n                                class=\"form-control search-form-control btn-lookup\" name=\"{{question.name}}\"\r\n                                value=\"{{question.value}}\" attr.data-type=\"{{question.datatype}}\"\r\n                                (keyup.enter)=\"searchClick()\" attr.data-restriction=\"{{question.restriction}}\">\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='dropdown'\">\r\n                              <!-- Ini kalau datanya tidak di load dari URL -->\r\n                              <div *ngIf=\"!question.isFromURL\">\r\n                                <select name=\"{{question.name}}\" class=\"form-control search-form-control\"\r\n                                  attr.query-in=\"{{question.isQueryIn}}\" attr.data-type=\"{{question.datatype}}\">\r\n                                  <option *ngIf=\"!question.isSelectOne\" value=\"All\">\r\n                                    All\r\n                                  </option>\r\n                                  <option *ngFor=\"let item of question?.items\" value=\"{{item.key}}\">\r\n                                    {{item.value}}\r\n                                  </option>\r\n                                </select>\r\n                              </div>\r\n                              <!-- Ini kalau datanya di load dari URL -->\r\n                              <div *ngIf=\"question.isFromURL\">\r\n                                <div *ngIf=\"question.isEvent\">\r\n                                  <select name=\"{{question.name}}\"\r\n                                    (change)=\"onChangeEvent($event.target.value, question)\"\r\n                                    class=\"form-control search-form-control\" attr.query-in=\"{{question.isQueryIn}}\"\r\n                                    attr.data-type=\"{{question.datatype}}\">\r\n                                    <option *ngIf=\"!question.isSelectOne\" value=\"All\">\r\n                                      All\r\n                                    </option>\r\n                                    <option *ngFor=\"let item of question?.itemsUrl\" value=\"{{item.Key}}\">\r\n                                      {{item.Value}}\r\n                                    </option>\r\n                                  </select>\r\n                                </div>\r\n                                <div *ngIf=\"!question.isEvent\">\r\n                                  <select name=\"{{question.name}}\" class=\"form-control search-form-control\"\r\n                                    attr.query-in=\"{{question.isQueryIn}}\" attr.data-type=\"{{question.datatype}}\">\r\n                                    <option *ngIf=\"!question.isSelectOne\" value=\"All\">\r\n                                      All\r\n                                    </option>\r\n                                    <option *ngFor=\"let item of question?.itemsUrl\" value=\"{{item.Key}}\">\r\n                                      {{item.Value}}\r\n                                    </option>\r\n                                  </select>\r\n                                </div>\r\n                              </div>\r\n                            </div>\r\n                          </div>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                  <div class=\"col-md-12 no-padding\">\r\n                    <form>\r\n                      <div class=\"form-actions right\">\r\n                        <button *ngIf=\"exportData == true\" type=\"button\" (click)=\"exportAsXLSX()\"\r\n                          class=\"btn btn-raised btn-success mr-1\" translate>\r\n                          <i class=\"fa ft-download\"></i> Export Excel\r\n                        </button>\r\n                        <button type=\"button\" (click)=\"reset()\" class=\"btn btn-raised btn-warning mr-1\" translate>\r\n                          <i class=\"fa fa-times\"></i> Reset\r\n                        </button>\r\n                        <button type=\"button\" (click)=\"searchClick()\" class=\"btn btn-raised btn-primary\" #UCSearchClick\r\n                          translate>\r\n                          <i class=\"fa fa-search\"></i> Search\r\n                        </button>\r\n                      </div>\r\n                    </form>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n            </form>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</section>\r\n<br>\r\n<!-- // Basic form layout section end -->",
+                    template: "<!-- Basic form layout section start -->\r\n<section id=\"horizontal-form-layouts\">\r\n  <div class=\"row text-left\">\r\n    <div class=\"col-md-12\">\r\n      <div class=\"card\">\r\n        <div class=\"pl-3 mb-2 mt-2\" *ngIf=\"configuration?.title != undefined && configuration?.title != ''\">\r\n          <h4 class=\"card-title ucSearch-title\" translate> {{ configuration.title }} </h4>\r\n        </div>\r\n        <div class=\"card-body\">\r\n          <div class=\"px-3\">\r\n            <form class=\"form form-horizontal\" id=\"formSearch\" #formIdSearch #enjiForm=\"ngForm\" (ngSubmit)=\"false\">\r\n              <div class=\"form-body\">\r\n                <h4 class=\"form-section font-weight-bold\">\r\n                  <div (click)=\"changeState()\" class=\"btn no-padding cursor-pointer flip\">\r\n                    <i class=\"fa\" style=\"font-size: 15px; margin: 0px 0px 5px -15px;\"\r\n                      [ngClass]=\"isHidden ? 'fa-chevron-right' : 'fa-chevron-down'\"></i>\r\n                  </div>\r\n                  <span\r\n                    *ngIf=\"configuration?.sectionTitle != undefined && configuration?.sectionTitle != ''; then inputSectionTitle else defaultSectionTitle\"></span>\r\n                  <ng-template #inputSectionTitle>\r\n                    {{configuration?.sectionTitle}}\r\n                  </ng-template>\r\n                  <ng-template #defaultSectionTitle>\r\n                    Paging\r\n                  </ng-template>\r\n                </h4>\r\n                <!-- Ini Digunakan untuk Generate Dynamic Component -->\r\n                <!-- [hidden]=\"isHidden\" -->\r\n                <div class=\"panel-active\" [@changeDivSize]=currentState>\r\n                  <div class=\"row\">\r\n                    <div class=\"col-md-6 form-group\" *ngFor=\"let question of configuration?.component\">\r\n                      <div class=\"col-md-12\">\r\n                        <div class=\"row\">\r\n                          <label class=\"col-md-5 no-padding\" for=\"{{question.id}}\" translate>{{question.label}}</label>\r\n                          <div class=\"col-md-7 no-padding\">\r\n                            <div *ngIf=\"question.type=='textbox'\">\r\n                              <input type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                attr.data-type=\"{{question.datatype}}\" attr.data-restriction=\"{{question.restriction}}\">\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='textarea'\">\r\n                              <textarea type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                name=\"{{question.name}}\" attr.data-type=\"{{question.datatype}}\"\r\n                                value=\"{{question.value}}\"></textarea>\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='numeric'\">\r\n                              <input type=\"text\" id=\"{{question.id}}\" (focus)=\"transformToDecimal($event)\"\r\n                                (blur)=\"transformAmount($event)\" class=\"form-control search-form-control\"\r\n                                name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                attr.data-restriction=\"{{question.restriction}}\" attr.data-type=\"{{question.datatype}}\">\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='currency'\">\r\n                              <span\r\n                                *ngIf=\"question?.isCustom != undefined && question?.isCustom; then customTypeCurrency else defaultTypeCurrency\"></span>\r\n                              <ng-template #customTypeCurrency>\r\n                                <input type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                  name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                  attr.data-restriction=\"{{question.restriction}}\"\r\n                                  attr.data-type=\"{{question.datatype}}\" currencyMask\r\n                                  [options]=\"{ thousands: question.thousands, decimal: question.decimal, align: question.align, allowNegative: question.allowNegative, allowZero: question.allowZero, precision: question.precision, nullable: question.nullable }\">\r\n                              </ng-template>\r\n                              <ng-template #defaultTypeCurrency>\r\n                                <input type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                  name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                  attr.data-restriction=\"{{question.restriction}}\"\r\n                                  attr.data-type=\"{{question.datatype}}\" currencyMask\r\n                                  [options]=\"{ thousands: 'question.thousands', decimal: '.', align: 'right', allowNegative: false, allowZero:true, precision: 2, nullable: false }\">\r\n                              </ng-template>\r\n                            </div>\r\n\r\n                            <!-- End Hardcode Lookup didalem-->\r\n                            <div *ngIf=\"question.type=='datepicker'\">\r\n                              <input type=\"date\" id=\"{{question.id}}\"\r\n                                class=\"form-control search-form-control btn-lookup\" name=\"{{question.name}}\"\r\n                                value=\"{{question.value}}\" attr.data-type=\"{{question.datatype}}\"\r\n                                (keyup.enter)=\"searchClick()\" attr.data-restriction=\"{{question.restriction}}\">\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='dropdown'\">\r\n                              <!-- Ini kalau datanya tidak di load dari URL -->\r\n                              <div *ngIf=\"!question.isFromURL\">\r\n                                <select name=\"{{question.name}}\" class=\"form-control search-form-control\"\r\n                                  attr.query-in=\"{{question.isQueryIn}}\" attr.data-type=\"{{question.datatype}}\">\r\n                                  <option *ngIf=\"!question.isSelectOne\" value=\"All\">\r\n                                    All\r\n                                  </option>\r\n                                  <option *ngFor=\"let item of question?.items\" value=\"{{item.key}}\">\r\n                                    {{item.value}}\r\n                                  </option>\r\n                                </select>\r\n                              </div>\r\n                              <!-- Ini kalau datanya di load dari URL -->\r\n                              <div *ngIf=\"question.isFromURL\">\r\n                                <div *ngIf=\"question.isEvent\">\r\n                                  <select name=\"{{question.name}}\"\r\n                                    (change)=\"onChangeEvent($event.target.value, question)\"\r\n                                    class=\"form-control search-form-control\" attr.query-in=\"{{question.isQueryIn}}\"\r\n                                    attr.data-type=\"{{question.datatype}}\">\r\n                                    <option *ngIf=\"!question.isSelectOne\" value=\"All\">\r\n                                      All\r\n                                    </option>\r\n                                    <option *ngFor=\"let item of question?.itemsUrl\" value=\"{{item.Key}}\">\r\n                                      {{item.Value}}\r\n                                    </option>\r\n                                  </select>\r\n                                </div>\r\n                                <div *ngIf=\"!question.isEvent\">\r\n                                  <select name=\"{{question.name}}\" class=\"form-control search-form-control\"\r\n                                    attr.query-in=\"{{question.isQueryIn}}\" attr.data-type=\"{{question.datatype}}\">\r\n                                    <option *ngIf=\"!question.isSelectOne\" value=\"All\">\r\n                                      All\r\n                                    </option>\r\n                                    <option *ngFor=\"let item of question?.itemsUrl\" value=\"{{item.Key}}\">\r\n                                      {{item.Value}}\r\n                                    </option>\r\n                                  </select>\r\n                                </div>\r\n                              </div>\r\n                            </div>\r\n                          </div>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                  <div class=\"col-md-12 no-padding\">\r\n                    <form>\r\n                      <div class=\"form-actions right\">\r\n                        <button *ngIf=\"exportData == true\" type=\"button\" (click)=\"exportAsXLSX()\"\r\n                          class=\"btn btn-raised btn-success mr-1\" translate>\r\n                          <i class=\"fa ft-download\"></i> Export Excel\r\n                        </button>\r\n                        <button type=\"button\" (click)=\"reset()\" class=\"btn btn-raised btn-warning mr-1\" translate>\r\n                          <i class=\"fa fa-times\"></i> Reset\r\n                        </button>\r\n                        <button type=\"button\" (click)=\"searchClick()\" class=\"btn btn-raised btn-primary\" #UCSearchClick\r\n                          translate>\r\n                          <i class=\"fa fa-search\"></i> Search\r\n                        </button>\r\n                      </div>\r\n                    </form>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n            </form>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</section>\r\n<br>\r\n<!-- // Basic form layout section end -->",
                     providers: [ExcelService],
                     animations: [
                         trigger('changeDivSize', [

package/fesm2015/adins-ucsearch.js

@@ -720,7 +720,7 @@ class UCSearchComponent {
 UCSearchComponent.decorators = [
     { type: Component, args: [{
                 selector: 'lib-UCSearch',
-                template: "<!-- Basic form layout section start -->\r\n<section id=\"horizontal-form-layouts\">\r\n  <div class=\"row text-left\">\r\n    <div class=\"col-md-12\">\r\n      <div class=\"card\">\r\n        <div class=\"pl-3 mb-2 mt-2\" *ngIf=\"configuration?.title != undefined && configuration?.title != ''\">\r\n          <h4 class=\"card-title ucSearch-title\" translate> {{ configuration.title }} </h4>\r\n        </div>\r\n        <div class=\"card-body\">\r\n          <div class=\"px-3\">\r\n            <form class=\"form form-horizontal\" id=\"formSearch\" #formIdSearch #enjiForm=\"ngForm\" (ngSubmit)=\"false\">\r\n              <div class=\"form-body\">\r\n                <h4 class=\"form-section font-weight-bold\">\r\n                  <div (click)=\"changeState()\" class=\"btn no-padding cursor-pointer flip\">\r\n                    <i class=\"fa\" style=\"font-size: 15px; margin: 0px 0px 5px -15px;\"\r\n                      [ngClass]=\"isHidden ? 'fa-chevron-right' : 'fa-chevron-down'\"></i>\r\n                  </div>\r\n                  <span\r\n                    *ngIf=\"configuration?.sectionTitle != undefined && configuration?.sectionTitle != ''; then inputSectionTitle else defaultSectionTitle\"></span>\r\n                  <ng-template #inputSectionTitle>\r\n                    {{configuration?.sectionTitle}}\r\n                  </ng-template>\r\n                  <ng-template #defaultSectionTitle>\r\n                    Paging\r\n                  </ng-template>\r\n                </h4>\r\n                <!-- Ini Digunakan untuk Generate Dynamic Component -->\r\n                <!-- [hidden]=\"isHidden\" -->\r\n                <div class=\"panel-active\" [@changeDivSize]=currentState>\r\n                  <div class=\"row\">\r\n                    <div class=\"col-md-6 form-group\" *ngFor=\"let question of configuration?.component\">\r\n                      <div class=\"col-md-12\">\r\n                        <div class=\"row\">\r\n                          <label class=\"col-md-5 no-padding\" for=\"{{question.id}}\" translate>{{question.label}}</label>\r\n                          <div class=\"col-md-7 no-padding\">\r\n                            <div *ngIf=\"question.type=='textbox'\">\r\n                              <input type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                attr.data-type=\"{{question.datatype}}\" attr.data-restriction=\"{{question.restriction}}\">\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='textarea'\">\r\n                              <textarea type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                name=\"{{question.name}}\" attr.data-type=\"{{question.datatype}}\"\r\n                                value=\"{{question.value}}\"></textarea>\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='numeric'\">\r\n                              <input type=\"text\" id=\"{{question.id}}\" (focus)=\"transformToDecimal($event)\"\r\n                                (blur)=\"transformAmount($event)\" class=\"form-control search-form-control\"\r\n                                name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                attr.data-restriction=\"{{question.restriction}}\" attr.data-type=\"{{question.datatype}}\">\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='currency'\">\r\n                              <span\r\n                                *ngIf=\"question?.isCustom != undefined && question?.isCustom; then customTypeCurrency else defaultTypeCurrency\"></span>\r\n                              <ng-template #customTypeCurrency>\r\n                                <input type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                  name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                  attr.data-restriction=\"{{question.restriction}}\"\r\n                                  attr.data-type=\"{{question.datatype}}\" currencyMask\r\n                                  [options]=\"{ thousands: 'question.thousands', decimal: '.', align: 'right', allowNegative: false, allowZero:true, precision: 2, nullable: false }\">\r\n                              </ng-template>\r\n                              <ng-template #defaultTypeCurrency>\r\n                                <input type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                  name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                  attr.data-restriction=\"{{question.restriction}}\"\r\n                                  attr.data-type=\"{{question.datatype}}\" currencyMask\r\n                                  [options]=\"{ thousands: question.thousands, decimal: question.decimal, align: question.align, allowNegative: question.allowNegative, allowZero: question.allowZero, precision: question.precision, nullable: question.nullable }\">\r\n                              </ng-template>\r\n                            </div>\r\n\r\n                            <!-- End Hardcode Lookup didalem-->\r\n                            <div *ngIf=\"question.type=='datepicker'\">\r\n                              <input type=\"date\" id=\"{{question.id}}\"\r\n                                class=\"form-control search-form-control btn-lookup\" name=\"{{question.name}}\"\r\n                                value=\"{{question.value}}\" attr.data-type=\"{{question.datatype}}\"\r\n                                (keyup.enter)=\"searchClick()\" attr.data-restriction=\"{{question.restriction}}\">\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='dropdown'\">\r\n                              <!-- Ini kalau datanya tidak di load dari URL -->\r\n                              <div *ngIf=\"!question.isFromURL\">\r\n                                <select name=\"{{question.name}}\" class=\"form-control search-form-control\"\r\n                                  attr.query-in=\"{{question.isQueryIn}}\" attr.data-type=\"{{question.datatype}}\">\r\n                                  <option *ngIf=\"!question.isSelectOne\" value=\"All\">\r\n                                    All\r\n                                  </option>\r\n                                  <option *ngFor=\"let item of question?.items\" value=\"{{item.key}}\">\r\n                                    {{item.value}}\r\n                                  </option>\r\n                                </select>\r\n                              </div>\r\n                              <!-- Ini kalau datanya di load dari URL -->\r\n                              <div *ngIf=\"question.isFromURL\">\r\n                                <div *ngIf=\"question.isEvent\">\r\n                                  <select name=\"{{question.name}}\"\r\n                                    (change)=\"onChangeEvent($event.target.value, question)\"\r\n                                    class=\"form-control search-form-control\" attr.query-in=\"{{question.isQueryIn}}\"\r\n                                    attr.data-type=\"{{question.datatype}}\">\r\n                                    <option *ngIf=\"!question.isSelectOne\" value=\"All\">\r\n                                      All\r\n                                    </option>\r\n                                    <option *ngFor=\"let item of question?.itemsUrl\" value=\"{{item.Key}}\">\r\n                                      {{item.Value}}\r\n                                    </option>\r\n                                  </select>\r\n                                </div>\r\n                                <div *ngIf=\"!question.isEvent\">\r\n                                  <select name=\"{{question.name}}\" class=\"form-control search-form-control\"\r\n                                    attr.query-in=\"{{question.isQueryIn}}\" attr.data-type=\"{{question.datatype}}\">\r\n                                    <option *ngIf=\"!question.isSelectOne\" value=\"All\">\r\n                                      All\r\n                                    </option>\r\n                                    <option *ngFor=\"let item of question?.itemsUrl\" value=\"{{item.Key}}\">\r\n                                      {{item.Value}}\r\n                                    </option>\r\n                                  </select>\r\n                                </div>\r\n                              </div>\r\n                            </div>\r\n                          </div>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                  <div class=\"col-md-12 no-padding\">\r\n                    <form>\r\n                      <div class=\"form-actions right\">\r\n                        <button *ngIf=\"exportData == true\" type=\"button\" (click)=\"exportAsXLSX()\"\r\n                          class=\"btn btn-raised btn-success mr-1\" translate>\r\n                          <i class=\"fa ft-download\"></i> Export Excel\r\n                        </button>\r\n                        <button type=\"button\" (click)=\"reset()\" class=\"btn btn-raised btn-warning mr-1\" translate>\r\n                          <i class=\"fa fa-times\"></i> Reset\r\n                        </button>\r\n                        <button type=\"button\" (click)=\"searchClick()\" class=\"btn btn-raised btn-primary\" #UCSearchClick\r\n                          translate>\r\n                          <i class=\"fa fa-search\"></i> Search\r\n                        </button>\r\n                      </div>\r\n                    </form>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n            </form>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</section>\r\n<br>\r\n<!-- // Basic form layout section end -->",
+                template: "<!-- Basic form layout section start -->\r\n<section id=\"horizontal-form-layouts\">\r\n  <div class=\"row text-left\">\r\n    <div class=\"col-md-12\">\r\n      <div class=\"card\">\r\n        <div class=\"pl-3 mb-2 mt-2\" *ngIf=\"configuration?.title != undefined && configuration?.title != ''\">\r\n          <h4 class=\"card-title ucSearch-title\" translate> {{ configuration.title }} </h4>\r\n        </div>\r\n        <div class=\"card-body\">\r\n          <div class=\"px-3\">\r\n            <form class=\"form form-horizontal\" id=\"formSearch\" #formIdSearch #enjiForm=\"ngForm\" (ngSubmit)=\"false\">\r\n              <div class=\"form-body\">\r\n                <h4 class=\"form-section font-weight-bold\">\r\n                  <div (click)=\"changeState()\" class=\"btn no-padding cursor-pointer flip\">\r\n                    <i class=\"fa\" style=\"font-size: 15px; margin: 0px 0px 5px -15px;\"\r\n                      [ngClass]=\"isHidden ? 'fa-chevron-right' : 'fa-chevron-down'\"></i>\r\n                  </div>\r\n                  <span\r\n                    *ngIf=\"configuration?.sectionTitle != undefined && configuration?.sectionTitle != ''; then inputSectionTitle else defaultSectionTitle\"></span>\r\n                  <ng-template #inputSectionTitle>\r\n                    {{configuration?.sectionTitle}}\r\n                  </ng-template>\r\n                  <ng-template #defaultSectionTitle>\r\n                    Paging\r\n                  </ng-template>\r\n                </h4>\r\n                <!-- Ini Digunakan untuk Generate Dynamic Component -->\r\n                <!-- [hidden]=\"isHidden\" -->\r\n                <div class=\"panel-active\" [@changeDivSize]=currentState>\r\n                  <div class=\"row\">\r\n                    <div class=\"col-md-6 form-group\" *ngFor=\"let question of configuration?.component\">\r\n                      <div class=\"col-md-12\">\r\n                        <div class=\"row\">\r\n                          <label class=\"col-md-5 no-padding\" for=\"{{question.id}}\" translate>{{question.label}}</label>\r\n                          <div class=\"col-md-7 no-padding\">\r\n                            <div *ngIf=\"question.type=='textbox'\">\r\n                              <input type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                attr.data-type=\"{{question.datatype}}\" attr.data-restriction=\"{{question.restriction}}\">\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='textarea'\">\r\n                              <textarea type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                name=\"{{question.name}}\" attr.data-type=\"{{question.datatype}}\"\r\n                                value=\"{{question.value}}\"></textarea>\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='numeric'\">\r\n                              <input type=\"text\" id=\"{{question.id}}\" (focus)=\"transformToDecimal($event)\"\r\n                                (blur)=\"transformAmount($event)\" class=\"form-control search-form-control\"\r\n                                name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                attr.data-restriction=\"{{question.restriction}}\" attr.data-type=\"{{question.datatype}}\">\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='currency'\">\r\n                              <span\r\n                                *ngIf=\"question?.isCustom != undefined && question?.isCustom; then customTypeCurrency else defaultTypeCurrency\"></span>\r\n                              <ng-template #customTypeCurrency>\r\n                                <input type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                  name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                  attr.data-restriction=\"{{question.restriction}}\"\r\n                                  attr.data-type=\"{{question.datatype}}\" currencyMask\r\n                                  [options]=\"{ thousands: question.thousands, decimal: question.decimal, align: question.align, allowNegative: question.allowNegative, allowZero: question.allowZero, precision: question.precision, nullable: question.nullable }\">\r\n                              </ng-template>\r\n                              <ng-template #defaultTypeCurrency>\r\n                                <input type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                  name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                  attr.data-restriction=\"{{question.restriction}}\"\r\n                                  attr.data-type=\"{{question.datatype}}\" currencyMask\r\n                                  [options]=\"{ thousands: 'question.thousands', decimal: '.', align: 'right', allowNegative: false, allowZero:true, precision: 2, nullable: false }\">\r\n                              </ng-template>\r\n                            </div>\r\n\r\n                            <!-- End Hardcode Lookup didalem-->\r\n                            <div *ngIf=\"question.type=='datepicker'\">\r\n                              <input type=\"date\" id=\"{{question.id}}\"\r\n                                class=\"form-control search-form-control btn-lookup\" name=\"{{question.name}}\"\r\n                                value=\"{{question.value}}\" attr.data-type=\"{{question.datatype}}\"\r\n                                (keyup.enter)=\"searchClick()\" attr.data-restriction=\"{{question.restriction}}\">\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='dropdown'\">\r\n                              <!-- Ini kalau datanya tidak di load dari URL -->\r\n                              <div *ngIf=\"!question.isFromURL\">\r\n                                <select name=\"{{question.name}}\" class=\"form-control search-form-control\"\r\n                                  attr.query-in=\"{{question.isQueryIn}}\" attr.data-type=\"{{question.datatype}}\">\r\n                                  <option *ngIf=\"!question.isSelectOne\" value=\"All\">\r\n                                    All\r\n                                  </option>\r\n                                  <option *ngFor=\"let item of question?.items\" value=\"{{item.key}}\">\r\n                                    {{item.value}}\r\n                                  </option>\r\n                                </select>\r\n                              </div>\r\n                              <!-- Ini kalau datanya di load dari URL -->\r\n                              <div *ngIf=\"question.isFromURL\">\r\n                                <div *ngIf=\"question.isEvent\">\r\n                                  <select name=\"{{question.name}}\"\r\n                                    (change)=\"onChangeEvent($event.target.value, question)\"\r\n                                    class=\"form-control search-form-control\" attr.query-in=\"{{question.isQueryIn}}\"\r\n                                    attr.data-type=\"{{question.datatype}}\">\r\n                                    <option *ngIf=\"!question.isSelectOne\" value=\"All\">\r\n                                      All\r\n                                    </option>\r\n                                    <option *ngFor=\"let item of question?.itemsUrl\" value=\"{{item.Key}}\">\r\n                                      {{item.Value}}\r\n                                    </option>\r\n                                  </select>\r\n                                </div>\r\n                                <div *ngIf=\"!question.isEvent\">\r\n                                  <select name=\"{{question.name}}\" class=\"form-control search-form-control\"\r\n                                    attr.query-in=\"{{question.isQueryIn}}\" attr.data-type=\"{{question.datatype}}\">\r\n                                    <option *ngIf=\"!question.isSelectOne\" value=\"All\">\r\n                                      All\r\n                                    </option>\r\n                                    <option *ngFor=\"let item of question?.itemsUrl\" value=\"{{item.Key}}\">\r\n                                      {{item.Value}}\r\n                                    </option>\r\n                                  </select>\r\n                                </div>\r\n                              </div>\r\n                            </div>\r\n                          </div>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                  <div class=\"col-md-12 no-padding\">\r\n                    <form>\r\n                      <div class=\"form-actions right\">\r\n                        <button *ngIf=\"exportData == true\" type=\"button\" (click)=\"exportAsXLSX()\"\r\n                          class=\"btn btn-raised btn-success mr-1\" translate>\r\n                          <i class=\"fa ft-download\"></i> Export Excel\r\n                        </button>\r\n                        <button type=\"button\" (click)=\"reset()\" class=\"btn btn-raised btn-warning mr-1\" translate>\r\n                          <i class=\"fa fa-times\"></i> Reset\r\n                        </button>\r\n                        <button type=\"button\" (click)=\"searchClick()\" class=\"btn btn-raised btn-primary\" #UCSearchClick\r\n                          translate>\r\n                          <i class=\"fa fa-search\"></i> Search\r\n                        </button>\r\n                      </div>\r\n                    </form>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n            </form>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</section>\r\n<br>\r\n<!-- // Basic form layout section end -->",
                 providers: [ExcelService],
                 animations: [
                     trigger('changeDivSize', [

package/fesm5/adins-ucsearch.js

@@ -795,7 +795,7 @@ var UCSearchComponent = /** @class */ (function () {
     UCSearchComponent.decorators = [
         { type: Component, args: [{
                     selector: 'lib-UCSearch',
-                    template: "<!-- Basic form layout section start -->\r\n<section id=\"horizontal-form-layouts\">\r\n  <div class=\"row text-left\">\r\n    <div class=\"col-md-12\">\r\n      <div class=\"card\">\r\n        <div class=\"pl-3 mb-2 mt-2\" *ngIf=\"configuration?.title != undefined && configuration?.title != ''\">\r\n          <h4 class=\"card-title ucSearch-title\" translate> {{ configuration.title }} </h4>\r\n        </div>\r\n        <div class=\"card-body\">\r\n          <div class=\"px-3\">\r\n            <form class=\"form form-horizontal\" id=\"formSearch\" #formIdSearch #enjiForm=\"ngForm\" (ngSubmit)=\"false\">\r\n              <div class=\"form-body\">\r\n                <h4 class=\"form-section font-weight-bold\">\r\n                  <div (click)=\"changeState()\" class=\"btn no-padding cursor-pointer flip\">\r\n                    <i class=\"fa\" style=\"font-size: 15px; margin: 0px 0px 5px -15px;\"\r\n                      [ngClass]=\"isHidden ? 'fa-chevron-right' : 'fa-chevron-down'\"></i>\r\n                  </div>\r\n                  <span\r\n                    *ngIf=\"configuration?.sectionTitle != undefined && configuration?.sectionTitle != ''; then inputSectionTitle else defaultSectionTitle\"></span>\r\n                  <ng-template #inputSectionTitle>\r\n                    {{configuration?.sectionTitle}}\r\n                  </ng-template>\r\n                  <ng-template #defaultSectionTitle>\r\n                    Paging\r\n                  </ng-template>\r\n                </h4>\r\n                <!-- Ini Digunakan untuk Generate Dynamic Component -->\r\n                <!-- [hidden]=\"isHidden\" -->\r\n                <div class=\"panel-active\" [@changeDivSize]=currentState>\r\n                  <div class=\"row\">\r\n                    <div class=\"col-md-6 form-group\" *ngFor=\"let question of configuration?.component\">\r\n                      <div class=\"col-md-12\">\r\n                        <div class=\"row\">\r\n                          <label class=\"col-md-5 no-padding\" for=\"{{question.id}}\" translate>{{question.label}}</label>\r\n                          <div class=\"col-md-7 no-padding\">\r\n                            <div *ngIf=\"question.type=='textbox'\">\r\n                              <input type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                attr.data-type=\"{{question.datatype}}\" attr.data-restriction=\"{{question.restriction}}\">\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='textarea'\">\r\n                              <textarea type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                name=\"{{question.name}}\" attr.data-type=\"{{question.datatype}}\"\r\n                                value=\"{{question.value}}\"></textarea>\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='numeric'\">\r\n                              <input type=\"text\" id=\"{{question.id}}\" (focus)=\"transformToDecimal($event)\"\r\n                                (blur)=\"transformAmount($event)\" class=\"form-control search-form-control\"\r\n                                name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                attr.data-restriction=\"{{question.restriction}}\" attr.data-type=\"{{question.datatype}}\">\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='currency'\">\r\n                              <span\r\n                                *ngIf=\"question?.isCustom != undefined && question?.isCustom; then customTypeCurrency else defaultTypeCurrency\"></span>\r\n                              <ng-template #customTypeCurrency>\r\n                                <input type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                  name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                  attr.data-restriction=\"{{question.restriction}}\"\r\n                                  attr.data-type=\"{{question.datatype}}\" currencyMask\r\n                                  [options]=\"{ thousands: 'question.thousands', decimal: '.', align: 'right', allowNegative: false, allowZero:true, precision: 2, nullable: false }\">\r\n                              </ng-template>\r\n                              <ng-template #defaultTypeCurrency>\r\n                                <input type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                  name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                  attr.data-restriction=\"{{question.restriction}}\"\r\n                                  attr.data-type=\"{{question.datatype}}\" currencyMask\r\n                                  [options]=\"{ thousands: question.thousands, decimal: question.decimal, align: question.align, allowNegative: question.allowNegative, allowZero: question.allowZero, precision: question.precision, nullable: question.nullable }\">\r\n                              </ng-template>\r\n                            </div>\r\n\r\n                            <!-- End Hardcode Lookup didalem-->\r\n                            <div *ngIf=\"question.type=='datepicker'\">\r\n                              <input type=\"date\" id=\"{{question.id}}\"\r\n                                class=\"form-control search-form-control btn-lookup\" name=\"{{question.name}}\"\r\n                                value=\"{{question.value}}\" attr.data-type=\"{{question.datatype}}\"\r\n                                (keyup.enter)=\"searchClick()\" attr.data-restriction=\"{{question.restriction}}\">\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='dropdown'\">\r\n                              <!-- Ini kalau datanya tidak di load dari URL -->\r\n                              <div *ngIf=\"!question.isFromURL\">\r\n                                <select name=\"{{question.name}}\" class=\"form-control search-form-control\"\r\n                                  attr.query-in=\"{{question.isQueryIn}}\" attr.data-type=\"{{question.datatype}}\">\r\n                                  <option *ngIf=\"!question.isSelectOne\" value=\"All\">\r\n                                    All\r\n                                  </option>\r\n                                  <option *ngFor=\"let item of question?.items\" value=\"{{item.key}}\">\r\n                                    {{item.value}}\r\n                                  </option>\r\n                                </select>\r\n                              </div>\r\n                              <!-- Ini kalau datanya di load dari URL -->\r\n                              <div *ngIf=\"question.isFromURL\">\r\n                                <div *ngIf=\"question.isEvent\">\r\n                                  <select name=\"{{question.name}}\"\r\n                                    (change)=\"onChangeEvent($event.target.value, question)\"\r\n                                    class=\"form-control search-form-control\" attr.query-in=\"{{question.isQueryIn}}\"\r\n                                    attr.data-type=\"{{question.datatype}}\">\r\n                                    <option *ngIf=\"!question.isSelectOne\" value=\"All\">\r\n                                      All\r\n                                    </option>\r\n                                    <option *ngFor=\"let item of question?.itemsUrl\" value=\"{{item.Key}}\">\r\n                                      {{item.Value}}\r\n                                    </option>\r\n                                  </select>\r\n                                </div>\r\n                                <div *ngIf=\"!question.isEvent\">\r\n                                  <select name=\"{{question.name}}\" class=\"form-control search-form-control\"\r\n                                    attr.query-in=\"{{question.isQueryIn}}\" attr.data-type=\"{{question.datatype}}\">\r\n                                    <option *ngIf=\"!question.isSelectOne\" value=\"All\">\r\n                                      All\r\n                                    </option>\r\n                                    <option *ngFor=\"let item of question?.itemsUrl\" value=\"{{item.Key}}\">\r\n                                      {{item.Value}}\r\n                                    </option>\r\n                                  </select>\r\n                                </div>\r\n                              </div>\r\n                            </div>\r\n                          </div>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                  <div class=\"col-md-12 no-padding\">\r\n                    <form>\r\n                      <div class=\"form-actions right\">\r\n                        <button *ngIf=\"exportData == true\" type=\"button\" (click)=\"exportAsXLSX()\"\r\n                          class=\"btn btn-raised btn-success mr-1\" translate>\r\n                          <i class=\"fa ft-download\"></i> Export Excel\r\n                        </button>\r\n                        <button type=\"button\" (click)=\"reset()\" class=\"btn btn-raised btn-warning mr-1\" translate>\r\n                          <i class=\"fa fa-times\"></i> Reset\r\n                        </button>\r\n                        <button type=\"button\" (click)=\"searchClick()\" class=\"btn btn-raised btn-primary\" #UCSearchClick\r\n                          translate>\r\n                          <i class=\"fa fa-search\"></i> Search\r\n                        </button>\r\n                      </div>\r\n                    </form>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n            </form>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</section>\r\n<br>\r\n<!-- // Basic form layout section end -->",
+                    template: "<!-- Basic form layout section start -->\r\n<section id=\"horizontal-form-layouts\">\r\n  <div class=\"row text-left\">\r\n    <div class=\"col-md-12\">\r\n      <div class=\"card\">\r\n        <div class=\"pl-3 mb-2 mt-2\" *ngIf=\"configuration?.title != undefined && configuration?.title != ''\">\r\n          <h4 class=\"card-title ucSearch-title\" translate> {{ configuration.title }} </h4>\r\n        </div>\r\n        <div class=\"card-body\">\r\n          <div class=\"px-3\">\r\n            <form class=\"form form-horizontal\" id=\"formSearch\" #formIdSearch #enjiForm=\"ngForm\" (ngSubmit)=\"false\">\r\n              <div class=\"form-body\">\r\n                <h4 class=\"form-section font-weight-bold\">\r\n                  <div (click)=\"changeState()\" class=\"btn no-padding cursor-pointer flip\">\r\n                    <i class=\"fa\" style=\"font-size: 15px; margin: 0px 0px 5px -15px;\"\r\n                      [ngClass]=\"isHidden ? 'fa-chevron-right' : 'fa-chevron-down'\"></i>\r\n                  </div>\r\n                  <span\r\n                    *ngIf=\"configuration?.sectionTitle != undefined && configuration?.sectionTitle != ''; then inputSectionTitle else defaultSectionTitle\"></span>\r\n                  <ng-template #inputSectionTitle>\r\n                    {{configuration?.sectionTitle}}\r\n                  </ng-template>\r\n                  <ng-template #defaultSectionTitle>\r\n                    Paging\r\n                  </ng-template>\r\n                </h4>\r\n                <!-- Ini Digunakan untuk Generate Dynamic Component -->\r\n                <!-- [hidden]=\"isHidden\" -->\r\n                <div class=\"panel-active\" [@changeDivSize]=currentState>\r\n                  <div class=\"row\">\r\n                    <div class=\"col-md-6 form-group\" *ngFor=\"let question of configuration?.component\">\r\n                      <div class=\"col-md-12\">\r\n                        <div class=\"row\">\r\n                          <label class=\"col-md-5 no-padding\" for=\"{{question.id}}\" translate>{{question.label}}</label>\r\n                          <div class=\"col-md-7 no-padding\">\r\n                            <div *ngIf=\"question.type=='textbox'\">\r\n                              <input type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                attr.data-type=\"{{question.datatype}}\" attr.data-restriction=\"{{question.restriction}}\">\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='textarea'\">\r\n                              <textarea type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                name=\"{{question.name}}\" attr.data-type=\"{{question.datatype}}\"\r\n                                value=\"{{question.value}}\"></textarea>\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='numeric'\">\r\n                              <input type=\"text\" id=\"{{question.id}}\" (focus)=\"transformToDecimal($event)\"\r\n                                (blur)=\"transformAmount($event)\" class=\"form-control search-form-control\"\r\n                                name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                attr.data-restriction=\"{{question.restriction}}\" attr.data-type=\"{{question.datatype}}\">\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='currency'\">\r\n                              <span\r\n                                *ngIf=\"question?.isCustom != undefined && question?.isCustom; then customTypeCurrency else defaultTypeCurrency\"></span>\r\n                              <ng-template #customTypeCurrency>\r\n                                <input type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                  name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                  attr.data-restriction=\"{{question.restriction}}\"\r\n                                  attr.data-type=\"{{question.datatype}}\" currencyMask\r\n                                  [options]=\"{ thousands: question.thousands, decimal: question.decimal, align: question.align, allowNegative: question.allowNegative, allowZero: question.allowZero, precision: question.precision, nullable: question.nullable }\">\r\n                              </ng-template>\r\n                              <ng-template #defaultTypeCurrency>\r\n                                <input type=\"text\" id=\"{{question.id}}\" class=\"form-control search-form-control\"\r\n                                  name=\"{{question.name}}\" value=\"{{question.value}}\" (keyup.enter)=\"searchClick()\"\r\n                                  attr.data-restriction=\"{{question.restriction}}\"\r\n                                  attr.data-type=\"{{question.datatype}}\" currencyMask\r\n                                  [options]=\"{ thousands: 'question.thousands', decimal: '.', align: 'right', allowNegative: false, allowZero:true, precision: 2, nullable: false }\">\r\n                              </ng-template>\r\n                            </div>\r\n\r\n                            <!-- End Hardcode Lookup didalem-->\r\n                            <div *ngIf=\"question.type=='datepicker'\">\r\n                              <input type=\"date\" id=\"{{question.id}}\"\r\n                                class=\"form-control search-form-control btn-lookup\" name=\"{{question.name}}\"\r\n                                value=\"{{question.value}}\" attr.data-type=\"{{question.datatype}}\"\r\n                                (keyup.enter)=\"searchClick()\" attr.data-restriction=\"{{question.restriction}}\">\r\n                            </div>\r\n                            <div *ngIf=\"question.type=='dropdown'\">\r\n                              <!-- Ini kalau datanya tidak di load dari URL -->\r\n                              <div *ngIf=\"!question.isFromURL\">\r\n                                <select name=\"{{question.name}}\" class=\"form-control search-form-control\"\r\n                                  attr.query-in=\"{{question.isQueryIn}}\" attr.data-type=\"{{question.datatype}}\">\r\n                                  <option *ngIf=\"!question.isSelectOne\" value=\"All\">\r\n                                    All\r\n                                  </option>\r\n                                  <option *ngFor=\"let item of question?.items\" value=\"{{item.key}}\">\r\n                                    {{item.value}}\r\n                                  </option>\r\n                                </select>\r\n                              </div>\r\n                              <!-- Ini kalau datanya di load dari URL -->\r\n                              <div *ngIf=\"question.isFromURL\">\r\n                                <div *ngIf=\"question.isEvent\">\r\n                                  <select name=\"{{question.name}}\"\r\n                                    (change)=\"onChangeEvent($event.target.value, question)\"\r\n                                    class=\"form-control search-form-control\" attr.query-in=\"{{question.isQueryIn}}\"\r\n                                    attr.data-type=\"{{question.datatype}}\">\r\n                                    <option *ngIf=\"!question.isSelectOne\" value=\"All\">\r\n                                      All\r\n                                    </option>\r\n                                    <option *ngFor=\"let item of question?.itemsUrl\" value=\"{{item.Key}}\">\r\n                                      {{item.Value}}\r\n                                    </option>\r\n                                  </select>\r\n                                </div>\r\n                                <div *ngIf=\"!question.isEvent\">\r\n                                  <select name=\"{{question.name}}\" class=\"form-control search-form-control\"\r\n                                    attr.query-in=\"{{question.isQueryIn}}\" attr.data-type=\"{{question.datatype}}\">\r\n                                    <option *ngIf=\"!question.isSelectOne\" value=\"All\">\r\n                                      All\r\n                                    </option>\r\n                                    <option *ngFor=\"let item of question?.itemsUrl\" value=\"{{item.Key}}\">\r\n                                      {{item.Value}}\r\n                                    </option>\r\n                                  </select>\r\n                                </div>\r\n                              </div>\r\n                            </div>\r\n                          </div>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                  <div class=\"col-md-12 no-padding\">\r\n                    <form>\r\n                      <div class=\"form-actions right\">\r\n                        <button *ngIf=\"exportData == true\" type=\"button\" (click)=\"exportAsXLSX()\"\r\n                          class=\"btn btn-raised btn-success mr-1\" translate>\r\n                          <i class=\"fa ft-download\"></i> Export Excel\r\n                        </button>\r\n                        <button type=\"button\" (click)=\"reset()\" class=\"btn btn-raised btn-warning mr-1\" translate>\r\n                          <i class=\"fa fa-times\"></i> Reset\r\n                        </button>\r\n                        <button type=\"button\" (click)=\"searchClick()\" class=\"btn btn-raised btn-primary\" #UCSearchClick\r\n                          translate>\r\n                          <i class=\"fa fa-search\"></i> Search\r\n                        </button>\r\n                      </div>\r\n                    </form>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n            </form>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</section>\r\n<br>\r\n<!-- // Basic form layout section end -->",
                     providers: [ExcelService],
                     animations: [
                         trigger('changeDivSize', [

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adins/ucsearch",
-  "version": "2.0.54",
+  "version": "2.0.55",
   "peerDependencies": {
     "@angular/common": "^7.2.0",
     "@angular/core": "^7.2.0"
@@ -25,6 +25,6 @@
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1"
   },
-  "author": "Reynard",
+  "author": "",
   "license": "ISC"
 }