@farris/ui-list-filter 0.1.11 → 0.1.13

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -4231,6 +4231,7 @@
4231
4231
  this.disabled = false;
4232
4232
  this.filterPaddingNone = false;
4233
4233
  this.query = new i0.EventEmitter();
4234
+ this.clear = new i0.EventEmitter();
4234
4235
  this.searchChange = new i0.EventEmitter();
4235
4236
  // filterWidth:number = 1000;
4236
4237
  // 标记是否有滚动条
@@ -4923,6 +4924,7 @@
4923
4924
  this.requiredListInit();
4924
4925
  // this.cd.markForCheck();
4925
4926
  }
4927
+ this.clear.emit();
4926
4928
  };
4927
4929
  // 设置默认值
4928
4930
  // 设置默认值
@@ -5106,7 +5108,7 @@
5106
5108
  ListFilterComponent.decorators = [
5107
5109
  { type: i0.Component, args: [{
5108
5110
  selector: 'farris-list-filter',
5109
- template: "<app-filter-common></app-filter-common>\r\n<div class=\"f-list-filter position-relative\"\r\n [ngClass]=\"{'list-filter-padding': showMoreIcon,'list-filter-autoWidth': autoWidth,'list-filter-paddingnone': filterPaddingNone}\">\r\n <ng-container *ngIf=\"filterType === 'list';else filterLayout\">\r\n <div class=\"filter-inputs-main filter-inputs-main-list f-form-layout farris-form farris-form-controls-inline\">\r\n <ng-container *ngFor=\"let formItem of listFilterConditions;let last = last;\">\r\n <div class=\"col-12\"\r\n [ngClass]=\"{'filter-list-item': showFilterList && showFilterList.length && showFilterList[showFilterList.length-1]['id'] == formItem.id}\"\r\n *ngIf=\"!formItem.control.isExtend\">\r\n <div class=\"filter-input-list farris-group-wrap\"\r\n [ngClass]=\"{'filter-input-list-autolabel': autoLabel,'filter-input-list-checkbox': getControlType(formItem) === 'checkboxgroup'}\"\r\n [id]=\"'filter-'+formItem.id\">\r\n <ng-container [ngTemplateOutlet]=\"filterInputTemplate\"\r\n [ngTemplateOutletContext]=\"{ item: formItem }\"></ng-container>\r\n <div class=\"filter-search-btn\"\r\n *ngIf=\"!liveSearch && showFilterList && showFilterList.length && showFilterList[showFilterList.length-1]['id'] == formItem.id\">\r\n <button class=\"btn btn-primary\" [ngClass]=\"{'disabled': disabled || !canSubmit}\"\r\n (click)=\"filterClick()\">{{ 'listFilter.filter' | locale }}</button>\r\n <button class=\"btn btn-secondary filter-search-btn-reset\" *ngIf=\"!showMoreIcon\"\r\n (click)=\"resetSearch()\">\r\n <span class=\"f-icon f-icon-remove\"></span>\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n <ng-template #filterLayout>\r\n <ng-container *ngIf=\"autoWidth;else gridLayout\">\r\n <div class=\"filter-inputs-main-basis-wrapper\"\r\n [ngClass]=\"{'list-filter-wrapper-show-btn': !liveSearch,'list-filter-wrapper-show-btn-remove': !liveSearch && !showMoreIcon}\">\r\n <div class=\"filter-inputs-main-basis-wrapper-inner\">\r\n <div class=\"filter-inputs-main filter-inputs-main-basis farris-form d-flex\"\r\n [ngClass]=\"{'justify-content-end': !alLeft,'farris-form-controls-inline':isControlInline}\"\r\n #filterMainBasis>\r\n <ng-container *ngFor=\"let formItem of listFilterConditions\">\r\n <div *ngIf=\"!formItem.control.isExtend\" class=\"filter-input-list farris-group-wrap\"\r\n [ngClass]=\"{'filter-input-list-autolabel': autoLabel,'filter-input-list-checkbox': getControlType(formItem) === 'checkboxgroup', 'filter-input-list-expand':formExpand,'filter-input-list-left': alLeft}\"\r\n [id]=\"'filter-'+formItem.id\">\r\n <ng-container [ngTemplateOutlet]=\"filterInputTemplate\"\r\n [ngTemplateOutletContext]=\"{ item: formItem }\"></ng-container>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </div>\r\n <div class=\"filter-search-btn\" [ngClass]=\"{'filter-search-btn-remove': !showMoreIcon}\"\r\n *ngIf=\"!liveSearch\">\r\n <button class=\"btn btn-primary\" [ngClass]=\"{'disabled': disabled || !canSubmit}\"\r\n (click)=\"filterClick()\">{{ 'listFilter.filter' | locale }}</button>\r\n <button class=\"btn btn-secondary filter-search-btn-reset\" *ngIf=\"!showMoreIcon\"\r\n (click)=\"resetSearch()\">\r\n <span class=\"f-icon f-icon-remove\"></span>\r\n </button>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <ng-template #gridLayout>\r\n <div class=\"filter-inputs-main f-form-layout farris-form\" [ngClass]=\"\r\n {'list-filter-type-1': getShowLength() === 1,\r\n 'list-filter-type-2': getShowLength() === 2,\r\n 'list-filter-type-3': getShowLength() === 3,\r\n 'list-filter-type-4': getShowLength() === 4,\r\n 'list-filter-type-5': getShowLength() === 5,\r\n 'list-filter-type-6': getShowLength() >= 6,\r\n 'list-filter-custom-type': this.filterClass,\r\n 'list-filter-show-reset': !showMoreIcon,\r\n 'list-filter-padding-none': liveSearch,\r\n 'farris-form-controls-inline':isControlInline}\">\r\n <ng-container *ngFor=\"let formItem of listFilterConditions\">\r\n <div [ngClass]=\"getStyle(formItem)\" *ngIf=\"!formItem.control.isExtend\">\r\n <div class=\"filter-input-list farris-group-wrap\"\r\n [ngClass]=\"{'filter-input-list-autolabel': autoLabel,'filter-input-list-checkbox': getControlType(formItem) === 'checkboxgroup'}\"\r\n [id]=\"'filter-'+formItem.id\">\r\n <ng-container [ngTemplateOutlet]=\"filterInputTemplate\"\r\n [ngTemplateOutletContext]=\"{ item: formItem }\"></ng-container>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <div class=\"filter-search-btn\" [ngClass]=\"{\r\n 'filter-search-btn-type-1': getShowLength() === 1,\r\n 'filter-search-btn-type-2': getShowLength() === 2,\r\n 'filter-search-btn-type-3': getShowLength() === 3,\r\n 'filter-search-btn-type-4': getShowLength() === 4,\r\n 'filter-search-btn-type-5': getShowLength() === 5,\r\n 'filter-search-custom-type': this.filterClass,\r\n 'filter-search-btn-type-6': getShowLength() >= 6}\" *ngIf=\"!liveSearch\">\r\n <button class=\"btn btn-primary\" [ngClass]=\"{'disabled': disabled || !canSubmit}\"\r\n (click)=\"filterClick()\">{{ 'listFilter.filter' | locale }}</button>\r\n <button class=\"btn btn-secondary filter-search-btn-reset\" *ngIf=\"!showMoreIcon\"\r\n (click)=\"resetSearch()\">\r\n <span class=\"f-icon f-icon-remove\"></span>\r\n </button>\r\n </div>\r\n </div>\r\n </ng-template>\r\n </ng-template>\r\n <div class=\"filter-expand position-absolute\" [class.active]=\"showFilter\" (click)=\"showFilter = !showFilter\"\r\n *ngIf=\"showMoreIcon\">\r\n <span class=\"f-icon f-icon-filtrate\"></span>\r\n <span class=\"filter-expand-tag\" *ngIf=\"showExpandTag\"></span>\r\n </div>\r\n <div class=\"filter-inputs-extend position-absolute\" [hidden]=\"!showFilter\" *ngIf=\"showMoreIcon\">\r\n <div class=\"filter-typelist-arrow\"></div>\r\n <div class=\"farris-form farris-form-auto\" [ngClass]=\"{'farris-form-controls-inline':isControlInline}\">\r\n <fieldset class=\"f-section-formgroup\">\r\n <div class=\"f-section-formgroup-inputs\">\r\n <div class=\"col-12\">\r\n <ng-container *ngFor=\"let formItem of listFilterConditions\">\r\n <div class=\"filter-input-list farris-group-wrap\" *ngIf=\"formItem.control.isExtend\">\r\n <ng-container [ngTemplateOutlet]=\"filterInputTemplate\"\r\n [ngTemplateOutletContext]=\"{ item: formItem }\"></ng-container>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </div>\r\n </fieldset>\r\n <div class=\"filter-form-btns text-right\">\r\n <button class=\"btn btn-link filter-form-btn-reset\"\r\n (click)=\"resetSearch()\">{{ 'listFilter.reset' | locale }}</button>\r\n <button class=\"btn btn-primary\" [ngClass]=\"{'disabled': disabled || !canSubmit}\"\r\n (click)=\"listSearch()\">{{ 'listFilter.confirm' | locale }}</button>\r\n <button class=\"btn btn-secondary\"\r\n (click)=\"listSearchCancel()\">{{ 'listFilter.cancel' | locale }}</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<ng-template #filterInputTemplate let-item=\"item\">\r\n <ng-container [ngSwitch]=\"item | controlType\">\r\n <div class=\"filter-input-item filter-type-input\" *ngSwitchCase=\"'input'\">\r\n <app-filter-input [item]=\"item\" [autoLabel]=\"autoLabel\" [disabled]=\"disabled\"\r\n (searchHandle)=\"onSearch($event,item)\" class=\"form-group farris-form-group\"></app-filter-input>\r\n </div>\r\n <div class=\"filter-input-item filter-type-search\" *ngSwitchCase=\"'search'\">\r\n <app-filter-search [item]=\"item\" [autoLabel]=\"autoLabel\" [disabled]=\"disabled\"\r\n (searchHandle)=\"onSearch($event,item)\" class=\"form-group farris-form-group\"></app-filter-search>\r\n </div>\r\n <div class=\"filter-input-item filter-type-date\" *ngSwitchCase=\"'date'\">\r\n <app-filter-date [changeFields]=\"fieldCodeOfClearFields\" [item]=\"item\" [autoLabel]=\"autoLabel\"\r\n [disabled]=\"disabled\" (searchHandle)=\"onSearch($event,item)\" class=\"form-group farris-form-group\">\r\n </app-filter-date>\r\n </div>\r\n <div class=\"filter-input-item filter-type-year\" *ngSwitchCase=\"'year'\">\r\n <app-filter-date [changeFields]=\"fieldCodeOfClearFields\" [item]=\"item\" [autoLabel]=\"autoLabel\"\r\n [disabled]=\"disabled\" [showType]=\"'3'\" (searchHandle)=\"onSearch($event,item)\"\r\n class=\"form-group farris-form-group\"></app-filter-date>\r\n </div>\r\n <div class=\"filter-input-item filter-type-month\" *ngSwitchCase=\"'month'\">\r\n <app-filter-date [changeFields]=\"fieldCodeOfClearFields\" [item]=\"item\" [autoLabel]=\"autoLabel\"\r\n [disabled]=\"disabled\" [showType]=\"'2'\" (searchHandle)=\"onSearch($event,item)\"\r\n class=\"form-group farris-form-group\"></app-filter-date>\r\n </div>\r\n <div class=\"filter-input-item filter-type-date\" *ngSwitchCase=\"'daterange'\">\r\n <app-filter-daterange [changeFields]=\"fieldCodeOfClearFields\" [item]=\"item\" [autoLabel]=\"autoLabel\"\r\n [disabled]=\"disabled\" (searchHandle)=\"onSearch($event,item)\" class=\"form-group farris-form-group\">\r\n </app-filter-daterange>\r\n </div>\r\n <div class=\"filter-input-item filter-type-date\" *ngSwitchCase=\"'daterangetime'\">\r\n <app-filter-daterange [changeFields]=\"fieldCodeOfClearFields\" [item]=\"item\" [autoLabel]=\"autoLabel\"\r\n [disabled]=\"disabled\" [showTime]=\"true\" (searchHandle)=\"onSearch($event,item)\"\r\n class=\"form-group farris-form-group\"></app-filter-daterange>\r\n </div>\r\n <div class=\"filter-input-item filter-type-monthrange\" *ngSwitchCase=\"'monthrange'\">\r\n <app-filter-daterange [changeFields]=\"fieldCodeOfClearFields\" [item]=\"item\" [autoLabel]=\"autoLabel\"\r\n [disabled]=\"disabled\" [showType]=\"'2'\" (searchHandle)=\"onSearch($event,item)\"\r\n class=\"form-group farris-form-group\"></app-filter-daterange>\r\n </div>\r\n <div class=\"filter-input-item filter-type-yearrange\" *ngSwitchCase=\"'yearrange'\">\r\n <app-filter-daterange [changeFields]=\"fieldCodeOfClearFields\" [item]=\"item\" [autoLabel]=\"autoLabel\"\r\n [disabled]=\"disabled\" [showType]=\"'3'\" (searchHandle)=\"onSearch($event,item)\"\r\n class=\"form-group farris-form-group\"></app-filter-daterange>\r\n </div>\r\n <div class=\"filter-input-item filter-type-dropdown\" *ngSwitchCase=\"'dropdown'\">\r\n <app-filter-dropdown [changeFields]=\"fieldCodeOfClearFields\" [item]=\"item\" [autoLabel]=\"autoLabel\"\r\n [disabled]=\"disabled\" (searchHandle)=\"onSearch($event,item)\" class=\"form-group farris-form-group\">\r\n </app-filter-dropdown>\r\n </div>\r\n <div class=\"filter-input-item filter-type-number\" *ngSwitchCase=\"'number'\">\r\n <app-filter-number [changeFields]=\"fieldCodeOfClearFields\" [item]=\"item\" [autoLabel]=\"autoLabel\"\r\n [disabled]=\"disabled\" (searchHandle)=\"onSearch($event,item)\" class=\"form-group farris-form-group\">\r\n </app-filter-number>\r\n </div>\r\n <div class=\"filter-input-item filter-type-help\" *ngSwitchCase=\"'help'\">\r\n <app-filter-help [changeFields]=\"fieldCodeOfClearFields\" [item]=\"item\" [autoLabel]=\"autoLabel\"\r\n [disabled]=\"disabled\" [hostRef]=\"this\" (searchHandle)=\"onSearch($event,item)\"\r\n class=\"form-group farris-form-group\"></app-filter-help>\r\n </div>\r\n <div class=\"filter-input-item filter-type-checkboxgroup\" *ngSwitchCase=\"'checkboxgroup'\">\r\n <app-filter-checkbox [changeFields]=\"fieldCodeOfClearFields\" [item]=\"item\" [autoLabel]=\"autoLabel\"\r\n [disabled]=\"disabled\" (searchHandle)=\"onSearch($event,item)\" class=\"form-group farris-form-group\"\r\n style=\"white-space: nowrap;\"></app-filter-checkbox>\r\n </div>\r\n <div class=\"filter-input-item filter-type-radio\" *ngSwitchCase=\"'radio'\">\r\n <app-filter-radio [changeFields]=\"fieldCodeOfClearFields\" [item]=\"item\" [autoLabel]=\"autoLabel\"\r\n [disabled]=\"disabled\" (searchHandle)=\"onSearch($event,item)\" class=\"form-group farris-form-group\"\r\n style=\"white-space: nowrap;\"></app-filter-radio>\r\n </div>\r\n <div class=\"filter-input-item filter-type-input-group\" *ngSwitchCase=\"'input-group'\">\r\n <app-filter-inputgroup [item]=\"item\" [autoLabel]=\"autoLabel\"\r\n [disabled]=\"disabled\" (searchHandle)=\"onSearch($event,item)\" class=\"form-group farris-form-group\">\r\n </app-filter-inputgroup>\r\n </div>\r\n <div class=\"filter-input-item filter-type-default\" *ngSwitchDefault>\r\n <app-filter-input [item]=\"item\" [autoLabel]=\"autoLabel\" [disabled]=\"disabled\"\r\n (searchHandle)=\"onSearch($event,item)\" class=\"form-group farris-form-group\"></app-filter-input>\r\n </div>\r\n </ng-container>\r\n</ng-template>",
5111
+ template: "<app-filter-common></app-filter-common>\r\n<div class=\"f-list-filter position-relative\"\r\n [ngClass]=\"{'list-filter-padding': showMoreIcon,'list-filter-autoWidth': autoWidth,'list-filter-paddingnone': filterPaddingNone}\">\r\n <ng-container *ngIf=\"filterType === 'list';else filterLayout\">\r\n <div class=\"filter-inputs-main filter-inputs-main-list f-form-layout farris-form farris-form-controls-inline\">\r\n <ng-container *ngFor=\"let formItem of listFilterConditions;let last = last;\">\r\n <div class=\"col-12\"\r\n [ngClass]=\"{'filter-list-item': showFilterList && showFilterList.length && showFilterList[showFilterList.length-1]['id'] == formItem.id}\"\r\n *ngIf=\"!formItem.control.isExtend\">\r\n <div class=\"filter-input-list farris-group-wrap\"\r\n [ngClass]=\"{'filter-input-list-autolabel': autoLabel,'filter-input-list-checkbox': getControlType(formItem) === 'checkboxgroup'}\"\r\n [id]=\"'filter-'+formItem.id\">\r\n <ng-container [ngTemplateOutlet]=\"filterInputTemplate\"\r\n [ngTemplateOutletContext]=\"{ item: formItem }\"></ng-container>\r\n <div class=\"filter-search-btn\"\r\n *ngIf=\"!liveSearch && showFilterList && showFilterList.length && showFilterList[showFilterList.length-1]['id'] == formItem.id\">\r\n <button class=\"btn btn-primary\" [ngClass]=\"{'disabled': disabled || !canSubmit}\"\r\n (click)=\"filterClick()\">{{ 'listFilter.filter' | locale }}</button>\r\n <button class=\"btn btn-secondary filter-search-btn-reset\" *ngIf=\"!showMoreIcon\"\r\n (click)=\"resetSearch()\">\r\n <span class=\"f-icon f-icon-remove\"></span>\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n <ng-template #filterLayout>\r\n <ng-container *ngIf=\"autoWidth;else gridLayout\">\r\n <div class=\"filter-inputs-main-basis-wrapper\"\r\n [ngClass]=\"{'list-filter-wrapper-show-btn': !liveSearch,'list-filter-wrapper-show-btn-remove': !liveSearch && !showMoreIcon}\">\r\n <div class=\"filter-inputs-main-basis-wrapper-inner\">\r\n <div class=\"filter-inputs-main filter-inputs-main-basis farris-form d-flex\"\r\n [ngClass]=\"{'justify-content-end': !alLeft,'farris-form-controls-inline':isControlInline}\"\r\n #filterMainBasis>\r\n <ng-container *ngFor=\"let formItem of listFilterConditions\">\r\n <div *ngIf=\"!formItem.control.isExtend\" class=\"filter-input-list farris-group-wrap\"\r\n [ngClass]=\"{'filter-input-list-autolabel': autoLabel,'filter-input-list-checkbox': getControlType(formItem) === 'checkboxgroup', 'filter-input-list-expand':formExpand,'filter-input-list-left': alLeft}\"\r\n [id]=\"'filter-'+formItem.id\">\r\n <ng-container [ngTemplateOutlet]=\"filterInputTemplate\"\r\n [ngTemplateOutletContext]=\"{ item: formItem }\"></ng-container>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </div>\r\n <div class=\"filter-search-btn\" [ngClass]=\"{'filter-search-btn-remove': !showMoreIcon}\"\r\n *ngIf=\"!liveSearch\">\r\n <button class=\"btn btn-primary\" [ngClass]=\"{'disabled': disabled || !canSubmit}\"\r\n (click)=\"filterClick()\">{{ 'listFilter.filter' | locale }}</button>\r\n <button class=\"btn btn-secondary filter-search-btn-reset\" *ngIf=\"!showMoreIcon\"\r\n (click)=\"resetSearch()\">\r\n <span class=\"f-icon f-icon-remove\"></span>\r\n </button>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <ng-template #gridLayout>\r\n <div class=\"filter-inputs-main f-form-layout farris-form\" [ngClass]=\"\r\n {'list-filter-type-1': getShowLength() === 1,\r\n 'list-filter-type-2': getShowLength() === 2,\r\n 'list-filter-type-3': getShowLength() === 3,\r\n 'list-filter-type-4': getShowLength() === 4,\r\n 'list-filter-type-5': getShowLength() === 5,\r\n 'list-filter-type-6': getShowLength() >= 6,\r\n 'list-filter-custom-type': this.filterClass,\r\n 'list-filter-show-reset': !showMoreIcon,\r\n 'list-filter-padding-none': liveSearch,\r\n 'farris-form-controls-inline':isControlInline}\">\r\n <ng-container *ngFor=\"let formItem of listFilterConditions\">\r\n <div [ngClass]=\"getStyle(formItem)\" *ngIf=\"!formItem.control.isExtend\">\r\n <div class=\"filter-input-list farris-group-wrap\"\r\n [ngClass]=\"{'filter-input-list-autolabel': autoLabel,'filter-input-list-checkbox': getControlType(formItem) === 'checkboxgroup'}\"\r\n [id]=\"'filter-'+formItem.id\">\r\n <ng-container [ngTemplateOutlet]=\"filterInputTemplate\"\r\n [ngTemplateOutletContext]=\"{ item: formItem }\"></ng-container>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <div class=\"filter-search-btn\" [ngClass]=\"{\r\n 'filter-search-btn-type-1': getShowLength() === 1,\r\n 'filter-search-btn-type-2': getShowLength() === 2,\r\n 'filter-search-btn-type-3': getShowLength() === 3,\r\n 'filter-search-btn-type-4': getShowLength() === 4,\r\n 'filter-search-btn-type-5': getShowLength() === 5,\r\n 'filter-search-custom-type': this.filterClass,\r\n 'filter-search-btn-type-6': getShowLength() >= 6}\" *ngIf=\"!liveSearch\">\r\n <button class=\"btn btn-primary\" [ngClass]=\"{'disabled': disabled || !canSubmit}\"\r\n (click)=\"filterClick()\">{{ 'listFilter.filter' | locale }}</button>\r\n <button class=\"btn btn-secondary filter-search-btn-reset\" *ngIf=\"!showMoreIcon\"\r\n (click)=\"resetSearch()\">\r\n <span class=\"f-icon f-icon-remove\"></span>\r\n </button>\r\n </div>\r\n </div>\r\n </ng-template>\r\n </ng-template>\r\n <div class=\"filter-expand position-absolute\" [class.active]=\"showFilter\" (click)=\"showFilter = !showFilter\"\r\n *ngIf=\"showMoreIcon\">\r\n <span class=\"f-icon f-icon-filtrate\"></span>\r\n <span class=\"filter-expand-tag\" *ngIf=\"showExpandTag\"></span>\r\n </div>\r\n <div class=\"filter-inputs-extend position-absolute\" [hidden]=\"!showFilter\" *ngIf=\"showMoreIcon\">\r\n <div class=\"filter-typelist-arrow\"></div>\r\n <div class=\"farris-form farris-form-auto\" [ngClass]=\"{'farris-form-controls-inline':isControlInline}\">\r\n <fieldset class=\"f-section-formgroup\">\r\n <div class=\"f-section-formgroup-inputs\">\r\n <div class=\"col-12\">\r\n <ng-container *ngFor=\"let formItem of listFilterConditions\">\r\n <div class=\"filter-input-list farris-group-wrap\" *ngIf=\"formItem.control.isExtend\">\r\n <ng-container [ngTemplateOutlet]=\"filterInputTemplate\"\r\n [ngTemplateOutletContext]=\"{ item: formItem }\"></ng-container>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </div>\r\n </fieldset>\r\n <!-- bugNum:456508 -->\r\n <div class=\"filter-form-btns text-right\">\r\n <button class=\"btn btn-link filter-form-btn-reset\" (click)=\"resetSearch()\">{{ 'listFilter.reset' |\r\n locale }}</button>\r\n <button class=\"btn btn-secondary\" (click)=\"listSearchCancel()\">{{ 'listFilter.cancel' | locale\r\n }}</button>\r\n <button class=\"btn btn-primary\" [ngClass]=\"{'disabled': disabled || !canSubmit}\"\r\n (click)=\"listSearch()\">{{ 'listFilter.confirm' | locale }}</button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<ng-template #filterInputTemplate let-item=\"item\">\r\n <ng-container [ngSwitch]=\"item | controlType\">\r\n <div class=\"filter-input-item filter-type-input\" *ngSwitchCase=\"'input'\">\r\n <app-filter-input [item]=\"item\" [autoLabel]=\"autoLabel\" [disabled]=\"disabled\"\r\n (searchHandle)=\"onSearch($event,item)\" class=\"form-group farris-form-group\"></app-filter-input>\r\n </div>\r\n <div class=\"filter-input-item filter-type-search\" *ngSwitchCase=\"'search'\">\r\n <app-filter-search [item]=\"item\" [autoLabel]=\"autoLabel\" [disabled]=\"disabled\"\r\n (searchHandle)=\"onSearch($event,item)\" class=\"form-group farris-form-group\"></app-filter-search>\r\n </div>\r\n <div class=\"filter-input-item filter-type-date\" *ngSwitchCase=\"'date'\">\r\n <app-filter-date [changeFields]=\"fieldCodeOfClearFields\" [item]=\"item\" [autoLabel]=\"autoLabel\"\r\n [disabled]=\"disabled\" (searchHandle)=\"onSearch($event,item)\" class=\"form-group farris-form-group\">\r\n </app-filter-date>\r\n </div>\r\n <div class=\"filter-input-item filter-type-year\" *ngSwitchCase=\"'year'\">\r\n <app-filter-date [changeFields]=\"fieldCodeOfClearFields\" [item]=\"item\" [autoLabel]=\"autoLabel\"\r\n [disabled]=\"disabled\" [showType]=\"'3'\" (searchHandle)=\"onSearch($event,item)\"\r\n class=\"form-group farris-form-group\"></app-filter-date>\r\n </div>\r\n <div class=\"filter-input-item filter-type-month\" *ngSwitchCase=\"'month'\">\r\n <app-filter-date [changeFields]=\"fieldCodeOfClearFields\" [item]=\"item\" [autoLabel]=\"autoLabel\"\r\n [disabled]=\"disabled\" [showType]=\"'2'\" (searchHandle)=\"onSearch($event,item)\"\r\n class=\"form-group farris-form-group\"></app-filter-date>\r\n </div>\r\n <div class=\"filter-input-item filter-type-date\" *ngSwitchCase=\"'daterange'\">\r\n <app-filter-daterange [changeFields]=\"fieldCodeOfClearFields\" [item]=\"item\" [autoLabel]=\"autoLabel\"\r\n [disabled]=\"disabled\" (searchHandle)=\"onSearch($event,item)\" class=\"form-group farris-form-group\">\r\n </app-filter-daterange>\r\n </div>\r\n <div class=\"filter-input-item filter-type-date\" *ngSwitchCase=\"'daterangetime'\">\r\n <app-filter-daterange [changeFields]=\"fieldCodeOfClearFields\" [item]=\"item\" [autoLabel]=\"autoLabel\"\r\n [disabled]=\"disabled\" [showTime]=\"true\" (searchHandle)=\"onSearch($event,item)\"\r\n class=\"form-group farris-form-group\"></app-filter-daterange>\r\n </div>\r\n <div class=\"filter-input-item filter-type-monthrange\" *ngSwitchCase=\"'monthrange'\">\r\n <app-filter-daterange [changeFields]=\"fieldCodeOfClearFields\" [item]=\"item\" [autoLabel]=\"autoLabel\"\r\n [disabled]=\"disabled\" [showType]=\"'2'\" (searchHandle)=\"onSearch($event,item)\"\r\n class=\"form-group farris-form-group\"></app-filter-daterange>\r\n </div>\r\n <div class=\"filter-input-item filter-type-yearrange\" *ngSwitchCase=\"'yearrange'\">\r\n <app-filter-daterange [changeFields]=\"fieldCodeOfClearFields\" [item]=\"item\" [autoLabel]=\"autoLabel\"\r\n [disabled]=\"disabled\" [showType]=\"'3'\" (searchHandle)=\"onSearch($event,item)\"\r\n class=\"form-group farris-form-group\"></app-filter-daterange>\r\n </div>\r\n <div class=\"filter-input-item filter-type-dropdown\" *ngSwitchCase=\"'dropdown'\">\r\n <app-filter-dropdown [changeFields]=\"fieldCodeOfClearFields\" [item]=\"item\" [autoLabel]=\"autoLabel\"\r\n [disabled]=\"disabled\" (searchHandle)=\"onSearch($event,item)\" class=\"form-group farris-form-group\">\r\n </app-filter-dropdown>\r\n </div>\r\n <div class=\"filter-input-item filter-type-number\" *ngSwitchCase=\"'number'\">\r\n <app-filter-number [changeFields]=\"fieldCodeOfClearFields\" [item]=\"item\" [autoLabel]=\"autoLabel\"\r\n [disabled]=\"disabled\" (searchHandle)=\"onSearch($event,item)\" class=\"form-group farris-form-group\">\r\n </app-filter-number>\r\n </div>\r\n <div class=\"filter-input-item filter-type-help\" *ngSwitchCase=\"'help'\">\r\n <app-filter-help [changeFields]=\"fieldCodeOfClearFields\" [item]=\"item\" [autoLabel]=\"autoLabel\"\r\n [disabled]=\"disabled\" [hostRef]=\"this\" (searchHandle)=\"onSearch($event,item)\"\r\n class=\"form-group farris-form-group\"></app-filter-help>\r\n </div>\r\n <div class=\"filter-input-item filter-type-checkboxgroup\" *ngSwitchCase=\"'checkboxgroup'\">\r\n <app-filter-checkbox [changeFields]=\"fieldCodeOfClearFields\" [item]=\"item\" [autoLabel]=\"autoLabel\"\r\n [disabled]=\"disabled\" (searchHandle)=\"onSearch($event,item)\" class=\"form-group farris-form-group\"\r\n style=\"white-space: nowrap;\"></app-filter-checkbox>\r\n </div>\r\n <div class=\"filter-input-item filter-type-radio\" *ngSwitchCase=\"'radio'\">\r\n <app-filter-radio [changeFields]=\"fieldCodeOfClearFields\" [item]=\"item\" [autoLabel]=\"autoLabel\"\r\n [disabled]=\"disabled\" (searchHandle)=\"onSearch($event,item)\" class=\"form-group farris-form-group\"\r\n style=\"white-space: nowrap;\"></app-filter-radio>\r\n </div>\r\n <div class=\"filter-input-item filter-type-input-group\" *ngSwitchCase=\"'input-group'\">\r\n <app-filter-inputgroup [item]=\"item\" [autoLabel]=\"autoLabel\" [disabled]=\"disabled\"\r\n (searchHandle)=\"onSearch($event,item)\" class=\"form-group farris-form-group\">\r\n </app-filter-inputgroup>\r\n </div>\r\n <div class=\"filter-input-item filter-type-default\" *ngSwitchDefault>\r\n <app-filter-input [item]=\"item\" [autoLabel]=\"autoLabel\" [disabled]=\"disabled\"\r\n (searchHandle)=\"onSearch($event,item)\" class=\"form-group farris-form-group\"></app-filter-input>\r\n </div>\r\n </ng-container>\r\n</ng-template>",
5110
5112
  changeDetection: i0.ChangeDetectionStrategy.OnPush,
5111
5113
  styles: ["::-webkit-scrollbar{width:6px;height:6px;background-color:#eee}::-webkit-scrollbar-track{border-radius:0}::-webkit-scrollbar-thumb{background-color:rgba(0,0,0,.15);-webkit-transition:.2s;transition:.2s;border-radius:6px}::-webkit-scrollbar-thumb:hover{background-color:rgba(0,0,0,.45)}.filter-search-btn-col{flex-basis:0;-webkit-box-flex:1;flex-grow:1;max-width:100%}.filter-search-btn-absoulte{position:absolute;right:0;top:0}.f-list-filter .filter-inputs-main-basis-wrapper{width:100%;overflow:hidden}.f-list-filter .filter-inputs-main-basis-wrapper.list-filter-wrapper-show-btn{position:relative;padding-right:84px}.f-list-filter .filter-inputs-main-basis-wrapper.list-filter-wrapper-show-btn.list-filter-wrapper-show-btn-remove{padding-right:124px}.f-list-filter .filter-inputs-main-basis-wrapper.list-filter-wrapper-show-btn .filter-search-btn{position:absolute;right:0;top:0}.f-list-filter .filter-inputs-main-basis-wrapper.list-filter-wrapper-show-btn .filter-search-btn .btn{margin-left:6px}.f-list-filter .filter-inputs-main-basis-wrapper.list-filter-wrapper-show-btn .filter-search-btn .btn:first-child{margin-left:0}.f-list-filter .filter-inputs-main-basis-wrapper .filter-inputs-main-basis-wrapper-inner{width:100%;overflow:auto}.f-list-filter .filter-inputs-main-basis-wrapper .filter-inputs-main-basis-wrapper-inner .filter-inputs-main-basis.justify-content-end{margin-left:auto}.f-list-filter.list-filter-padding{padding-right:45px}.f-list-filter.list-filter-autoWidth{padding-bottom:8px}.f-list-filter.list-filter-autoWidth.list-filter-paddingnone{padding-bottom:0}@media (min-width:768px){.f-list-filter .list-filter-type-1{position:static;padding-right:0}.f-list-filter .list-filter-type-2,.f-list-filter .list-filter-type-3{position:relative;padding-right:70px}}@media (max-width:767px){.f-list-filter .list-filter-type-1{position:relative;padding-right:70px}.f-list-filter .list-filter-type-1.list-filter-show-reset{padding-right:110px}.f-list-filter .list-filter-type-2,.f-list-filter .list-filter-type-3{position:relative;padding-right:70px}.f-list-filter .list-filter-type-2.list-filter-show-reset,.f-list-filter .list-filter-type-3.list-filter-show-reset{position:relative;padding-right:110px}}@media (min-width:1200px){.f-list-filter .list-filter-type-2,.f-list-filter .list-filter-type-3{position:static;padding-right:0}.f-list-filter .list-filter-type-4,.f-list-filter .list-filter-type-5{position:relative;padding-right:70px}}@media (max-width:767px){.f-list-filter .list-filter-type-4,.f-list-filter .list-filter-type-5{position:relative;padding-right:70px}.f-list-filter .list-filter-type-4.list-filter-show-reset,.f-list-filter .list-filter-type-5.list-filter-show-reset{position:relative;padding-right:110px}}@media (min-width:768px){.f-list-filter .list-filter-type-2.list-filter-show-reset,.f-list-filter .list-filter-type-3.list-filter-show-reset{position:relative;padding-right:110px}.f-list-filter .list-filter-type-4,.f-list-filter .list-filter-type-5{position:relative;padding-right:70px}.f-list-filter .list-filter-type-4.list-filter-show-reset,.f-list-filter .list-filter-type-5.list-filter-show-reset{position:relative;padding-right:110px}}@media (min-width:1690px){.f-list-filter .list-filter-type-4,.f-list-filter .list-filter-type-5{position:static;padding-right:0}}@media (min-width:1200px){.f-list-filter .list-filter-type-4.list-filter-show-reset,.f-list-filter .list-filter-type-5.list-filter-show-reset{position:relative;padding-right:110px}}.f-list-filter .list-filter-custom-type,.f-list-filter .list-filter-type-6{position:relative;padding-right:70px}.f-list-filter .list-filter-custom-type.list-filter-show-reset,.f-list-filter .list-filter-type-6.list-filter-show-reset{padding-right:110px}.f-list-filter .list-filter-padding-none{padding-right:0}.f-list-filter .filter-inputs-main{width:100%;overflow:hidden}.f-list-filter .filter-inputs-main .col-12{padding-left:0}.f-list-filter .filter-inputs-main.filter-inputs-main-padding{padding-right:70px;position:relative}.f-list-filter .filter-inputs-main .filter-input-list.filter-input-list-autolabel{padding-right:14px}.f-list-filter .filter-inputs-main .filter-input-list.filter-input-list-autolabel:last-child{padding-right:0}.f-list-filter .filter-inputs-main .filter-input-list.filter-input-list-checkbox{max-width:none;-webkit-box-flex:inherit;flex:inherit}@media (max-width:767px){.f-list-filter .filter-inputs-main .filter-search-btn.filter-search-btn-type-1{position:absolute;right:0;top:0}}@media (min-width:768px){.f-list-filter .filter-inputs-main .filter-search-btn.filter-search-btn-type-1{flex-basis:0;-webkit-box-flex:1;flex-grow:1;max-width:100%;position:static}.f-list-filter .filter-inputs-main .filter-search-btn.filter-search-btn-type-2,.f-list-filter .filter-inputs-main .filter-search-btn.filter-search-btn-type-3{position:absolute;right:0;top:0}}@media (max-width:767px){.f-list-filter .filter-inputs-main .filter-search-btn.filter-search-btn-type-2,.f-list-filter .filter-inputs-main .filter-search-btn.filter-search-btn-type-3{position:absolute;right:0;top:0}}@media (min-width:1200px){.f-list-filter .filter-inputs-main .filter-search-btn.filter-search-btn-type-2,.f-list-filter .filter-inputs-main .filter-search-btn.filter-search-btn-type-3{flex-basis:0;-webkit-box-flex:1;flex-grow:1;max-width:100%;position:static}.f-list-filter .filter-inputs-main .filter-search-btn.filter-search-btn-type-4,.f-list-filter .filter-inputs-main .filter-search-btn.filter-search-btn-type-5{position:absolute;right:0;top:0}}@media (max-width:767px){.f-list-filter .filter-inputs-main .filter-search-btn.filter-search-btn-type-4,.f-list-filter .filter-inputs-main .filter-search-btn.filter-search-btn-type-5{position:absolute;right:0;top:0}}@media (min-width:768px){.f-list-filter .filter-inputs-main .filter-search-btn.filter-search-btn-type-4,.f-list-filter .filter-inputs-main .filter-search-btn.filter-search-btn-type-5{position:absolute;right:0;top:0}}@media (min-width:1690px){.f-list-filter .filter-inputs-main .filter-search-btn.filter-search-btn-type-4,.f-list-filter .filter-inputs-main .filter-search-btn.filter-search-btn-type-5{flex-basis:0;-webkit-box-flex:1;flex-grow:1;max-width:100%;position:static}}.f-list-filter .filter-inputs-main .filter-search-btn.filter-search-btn-type-6,.f-list-filter .filter-inputs-main .filter-search-btn.filter-search-custom-type{position:absolute;right:0;top:0}.f-list-filter .filter-inputs-main .filter-search-btn .btn{margin-left:6px}.f-list-filter .filter-inputs-main .filter-search-btn .btn:first-child{margin-left:0}.f-list-filter .filter-inputs-main.filter-inputs-main-basis .filter-input-list{min-width:200px}.f-list-filter .filter-inputs-main.filter-inputs-main-basis .filter-input-list .filter-input-item .form-group{margin-bottom:0}.f-list-filter .filter-inputs-main.filter-inputs-main-basis .filter-input-list.filter-input-list-left{-webkit-box-flex:1;flex:1 1 auto}.f-list-filter .filter-inputs-main.filter-inputs-main-basis .filter-input-list.filter-input-list-expand{max-width:none}.f-list-filter .filter-inputs-main.filter-inputs-main-basis.justify-content-end .filter-input-list:not(.filter-input-list-checkbox){-webkit-box-flex:1;flex:auto}.f-list-filter .filter-expand{right:0;top:0;width:24px;margin-left:21px;height:24px;line-height:24px;cursor:pointer}.f-list-filter .filter-expand.active{border-radius:2px}.f-list-filter .filter-expand .f-icon{display:block;line-height:24px;margin:0 auto;font-size:18px}.f-list-filter .filter-expand .filter-expand-tag{position:absolute;right:0;top:0;display:block;width:6px;height:6px;border-radius:50%}.f-list-filter .filter-inputs-extend{width:429px;right:0;top:34px;background-color:#fff;box-shadow:0 2px 3px 0 rgba(0,0,0,.15);z-index:900;padding:20px 0}.f-list-filter .filter-inputs-extend .filter-typelist-arrow{display:block;position:absolute;right:7px;top:-4px;width:8.48528137px;height:8.48528137px;background:0 0;border-style:solid;border-width:4.24264069px;box-shadow:-2px -2px 5px rgba(0,0,0,.08);-webkit-transform:translateX(-50%) rotate(45deg);transform:translateX(-50%) rotate(45deg);border-color:#fff transparent transparent #fff}.f-list-filter .filter-inputs-extend .filter-form-btns{margin-top:6px;padding:0 14px}.f-list-filter .filter-inputs-extend .filter-form-btns .btn{margin-left:6px}.f-list-filter .filter-inputs-extend .filter-form-btns .filter-form-btn-reset{position:relative;padding-right:10px;margin-right:4px}.f-list-filter .filter-inputs-extend .filter-form-btns .filter-form-btn-reset::after{content:'';position:absolute;right:0;top:50%;width:1px;height:16px;margin-top:-8px;background:#d9d9d9}.f-list-filter .filter-search-btn-reset{padding-left:4px;padding-right:4px;color:rgba(0,0,0,.65)}.f-list-filter .filter-input-list .form-group{display:block}.f-list-filter .farris-form-controls-inline .filter-input-list .form-group{display:-webkit-box;display:flex}.f-list-filter .filter-inputs-main-list .filter-input-item .farris-form-group{display:-webkit-box;display:flex;-webkit-box-align:center;align-items:center;-webkit-box-orient:horizontal;-webkit-box-direction:normal;flex-direction:row}.f-list-filter .filter-inputs-main-list .filter-list-item{padding-right:100px}.f-list-filter .filter-inputs-main-list .filter-list-item .filter-input-list{position:relative}.f-list-filter .filter-inputs-main-list .filter-list-item .filter-search-btn{display:-webkit-box;display:flex;-webkit-box-align:center;align-items:center;position:absolute;top:50%;left:calc(100% + 20px);-webkit-transform:translateY(-50%);transform:translateY(-50%)}.filter-expand-simulate{opacity:0;display:inline-block;width:24px;height:24px;padding-left:21px}.filter-expand-simulate .f-icon{font-size:24px}"]
5112
5114
  }] }
@@ -5134,6 +5136,7 @@
5134
5136
  filterType: [{ type: i0.Input }],
5135
5137
  defaultValue: [{ type: i0.Input }],
5136
5138
  query: [{ type: i0.Output }],
5139
+ clear: [{ type: i0.Output }],
5137
5140
  searchChange: [{ type: i0.Output }],
5138
5141
  filterList: [{ type: i0.Input }]
5139
5142
  };
@@ -6929,7 +6932,7 @@
6929
6932
  DateRangeComponent.decorators = [
6930
6933
  { type: i0.Component, args: [{
6931
6934
  selector: 'app-filter-daterange',
6932
- template: "<label class=\"col-form-label\" *ngIf=\"item && showlabel\" title=\"{{getConditionItemTitle(item)}}\">\r\n <span class=\"farris-label-info text-danger\" *ngIf=\"item.control.required\">*</span>\r\n <span class=\"farris-label-text\">{{item.fieldName}}</span>\r\n</label>\r\n<div class=\"farris-input-wrap\" *ngIf=\"item\">\r\n <ng-container *ngIf=\"showTime;else defaultdate\">\r\n <farris-datepicker [(ngModel)]=\"rangeDate\" [dateRange]=\"true\" [readonly]=\"disabled\" [editable]=\"false\" [returnFormat]=\"showTime ? 'yyyy-MM-dd HH:mm:ss' : 'yyyy-MM-dd'\" [dateFormat]=\"dateFormat\" (valueChange)=\"onDateChange($event)\" [beginPlaceholder]=\"beginPlaceHolder\" [endPlaceholder]=\"endPlaceHolder\" [placeholder]=\"placeholder\" [showTime]=\"showTime\"></farris-datepicker>\r\n </ng-container>\r\n <ng-template #defaultdate>\r\n <farris-datepicker [(ngModel)]=\"rangeDate\" [dateRange]=\"true\" [readonly]=\"disabled\" [editable]=\"false\" [returnFormat]=\"showTime ? 'yyyy-MM-dd HH:mm:ss': (showType == '2'? 'yyyy-MM': (showType == '3'? 'yyyy':'yyyy-MM-dd'))\" [dateFormat]=\"dateFormat\" (valueChange)=\"onDateChange($event)\" [beginPlaceholder]=\"beginPlaceHolder\" [endPlaceholder]=\"endPlaceHolder\" [placeholder]=\"placeholder\" [showType]=\"showType\"></farris-datepicker>\r\n </ng-template>\r\n \r\n\r\n <!-- <farris-datepicker [ngModel]=\"rangeDate\" [dateRange]=\"true\" [returnFormat]=\"'yyyy-MM-dd'\" [dateFormat]=\"item.control.format\" (ngModelChange)=\"onDateChange($event)\"></farris-datepicker> -->\r\n</div>\r\n<!-- [(ngModel)]=\"rangeDate\" -->"
6935
+ template: "<label class=\"col-form-label\" *ngIf=\"item && showlabel\" title=\"{{getConditionItemTitle(item)}}\">\r\n <span class=\"farris-label-info text-danger\" *ngIf=\"item.control.required\">*</span>\r\n <span class=\"farris-label-text\">{{item.fieldName}}</span>\r\n</label>\r\n<div class=\"farris-input-wrap\" *ngIf=\"item\">\r\n <ng-container *ngIf=\"showTime;else defaultdate\">\r\n <farris-datepicker [(ngModel)]=\"rangeDate\" [dateRange]=\"true\" [readonly]=\"disabled\"\r\n [editable]=\"false\" [returnFormat]=\"showTime ? 'yyyy-MM-dd HH:mm:ss' : 'yyyy-MM-dd'\"\r\n [dateFormat]=\"dateFormat\" (valueChange)=\"onDateChange($event)\" [beginPlaceholder]=\"beginPlaceHolder\"\r\n [endPlaceholder]=\"endPlaceHolder\" [placeholder]=\"placeholder\" [showTime]=\"showTime\"></farris-datepicker>\r\n </ng-container>\r\n <ng-template #defaultdate>\r\n <farris-datepicker [(ngModel)]=\"rangeDate\" [dateRange]=\"true\" [readonly]=\"disabled\"\r\n [editable]=\"false\" [returnFormat]=\"showTime ? 'yyyy-MM-dd HH:mm:ss': (showType == '2'? 'yyyy-MM': (showType == '3'? 'yyyy':'yyyy-MM-dd'))\"\r\n [dateFormat]=\"dateFormat\" (valueChange)=\"onDateChange($event)\" [beginPlaceholder]=\"beginPlaceHolder\" [endPlaceholder]=\"endPlaceHolder\" [placeholder]=\"placeholder\" [showType]=\"showType\"></farris-datepicker>\r\n </ng-template>\r\n \r\n\r\n <!-- <farris-datepicker [ngModel]=\"rangeDate\" [dateRange]=\"true\" [returnFormat]=\"'yyyy-MM-dd'\" [dateFormat]=\"item.control.format\" (ngModelChange)=\"onDateChange($event)\"></farris-datepicker> -->\r\n</div>\r\n<!-- [(ngModel)]=\"rangeDate\" -->"
6933
6936
  }] }
6934
6937
  ];
6935
6938
  /** @nocollapse */