primeng/bundles/primeng-dataview.umd.min.js

[](https://opensource.org/licenses/MIT) [](https://badge.fury.io/js/primeng) [![Discord](https://img.shields.io/discord/557940238991753

!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@angular/core"),require("@angular/common"),require("primeng/utils"),require("primeng/api"),require("primeng/paginator")):"function"==typeof define&&define.amd?define("primeng/dataview",["exports","@angular/core","@angular/common","primeng/utils","primeng/api","primeng/paginator"],e):e(((t="undefined"!=typeof globalThis?globalThis:t||self).primeng=t.primeng||{},t.primeng.dataview={}),t.ng.core,t.ng.common,t.primeng.utils,t.primeng.api,t.primeng.paginator)}(this,(function(t,e,a,o,n,i){"use strict";var r=function(){function t(t,a,o){this.el=t,this.cd=a,this.filterService=o,this.layout="list",this.pageLinks=5,this.paginatorPosition="bottom",this.alwaysShowPaginator=!0,this.paginatorDropdownScrollHeight="200px",this.currentPageReportTemplate="{currentPage} of {totalPages}",this.showFirstLastIcon=!0,this.showPageLinks=!0,this.emptyMessage="No records found",this.onLazyLoad=new e.EventEmitter,this.trackBy=function(t,e){return e},this.loadingIcon="pi pi-spinner",this.first=0,this.onPage=new e.EventEmitter,this.onSort=new e.EventEmitter,this.onChangeLayout=new e.EventEmitter}return t.prototype.ngOnInit=function(){this.lazy&&this.onLazyLoad.emit(this.createLazyLoadMetadata()),this.initialized=!0},t.prototype.ngOnChanges=function(t){t.value&&(this._value=t.value.currentValue,this.updateTotalRecords(),!this.lazy&&this.hasFilter()&&this.filter(this.filterValue)),(t.sortField||t.sortOrder)&&(this.lazy&&!this.initialized||this.sort())},t.prototype.ngAfterContentInit=function(){var t=this;this.templates.forEach((function(e){switch(e.getType()){case"listItem":t.listItemTemplate=e.template;break;case"gridItem":t.gridItemTemplate=e.template;break;case"paginatorleft":t.paginatorLeftTemplate=e.template;break;case"paginatorright":t.paginatorRightTemplate=e.template;break;case"paginatordropdownitem":t.paginatorDropdownItemTemplate=e.template;break;case"header":t.headerTemplate=e.template;break;case"footer":t.footerTemplate=e.template}})),this.updateItemTemplate()},t.prototype.updateItemTemplate=function(){switch(this.layout){case"list":this.itemTemplate=this.listItemTemplate;break;case"grid":this.itemTemplate=this.gridItemTemplate}},t.prototype.changeLayout=function(t){this.layout=t,this.onChangeLayout.emit({layout:this.layout}),this.updateItemTemplate(),this.cd.markForCheck()},t.prototype.updateTotalRecords=function(){this.totalRecords=this.lazy?this.totalRecords:this._value?this._value.length:0},t.prototype.paginate=function(t){this.first=t.first,this.rows=t.rows,this.lazy&&this.onLazyLoad.emit(this.createLazyLoadMetadata()),this.onPage.emit({first:this.first,rows:this.rows})},t.prototype.sort=function(){var t=this;this.first=0,this.lazy?this.onLazyLoad.emit(this.createLazyLoadMetadata()):this.value&&(this.value.sort((function(e,a){var n=o.ObjectUtils.resolveFieldData(e,t.sortField),i=o.ObjectUtils.resolveFieldData(a,t.sortField),r=null;return r=null==n&&null!=i?-1:null!=n&&null==i?1:null==n&&null==i?0:"string"==typeof n&&"string"==typeof i?n.localeCompare(i):n<i?-1:n>i?1:0,t.sortOrder*r})),this.hasFilter()&&this.filter(this.filterValue)),this.onSort.emit({sortField:this.sortField,sortOrder:this.sortOrder})},t.prototype.isEmpty=function(){var t=this.filteredValue||this.value;return null==t||0==t.length},t.prototype.createLazyLoadMetadata=function(){return{first:this.first,rows:this.rows,sortField:this.sortField,sortOrder:this.sortOrder}},t.prototype.getBlockableElement=function(){return this.el.nativeElement.children[0]},t.prototype.filter=function(t,e){if(void 0===e&&(e="contains"),this.filterValue=t,this.value&&this.value.length){var a=this.filterBy.split(",");this.filteredValue=this.filterService.filter(this.value,a,t,e,this.filterLocale),this.filteredValue.length===this.value.length&&(this.filteredValue=null),this.paginator&&(this.first=0,this.totalRecords=this.filteredValue?this.filteredValue.length:this.value?this.value.length:0),this.cd.markForCheck()}},t.prototype.hasFilter=function(){return this.filterValue&&this.filterValue.trim().length>0},t}();r.decorators=[{type:e.Component,args:[{selector:"p-dataView",template:'\n        <div [ngClass]="{\'p-dataview p-component\': true, \'p-dataview-list\': (layout === \'list\'), \'p-dataview-grid\': (layout === \'grid\')}" [ngStyle]="style" [class]="styleClass">\n            <div class="p-dataview-loading" *ngIf="loading">\n                <div class="p-dataview-loading-overlay p-component-overlay">\n                    <i [class]="\'p-dataview-loading-icon pi-spin \' + loadingIcon"></i>\n                </div>\n            </div>\n            <div class="p-dataview-header" *ngIf="header || headerTemplate">\n                <ng-content select="p-header"></ng-content>\n                <ng-container *ngTemplateOutlet="headerTemplate"></ng-container>\n            </div>\n            <p-paginator [rows]="rows" [first]="first" [totalRecords]="totalRecords" [pageLinkSize]="pageLinks" [alwaysShow]="alwaysShowPaginator"\n                (onPageChange)="paginate($event)" styleClass="p-paginator-top" [rowsPerPageOptions]="rowsPerPageOptions" *ngIf="paginator && (paginatorPosition === \'top\' || paginatorPosition ==\'both\')"\n                [dropdownAppendTo]="paginatorDropdownAppendTo" [dropdownScrollHeight]="paginatorDropdownScrollHeight" [templateLeft]="paginatorLeftTemplate" [templateRight]="paginatorRightTemplate"\n                [currentPageReportTemplate]="currentPageReportTemplate" [showFirstLastIcon]="showFirstLastIcon" [dropdownItemTemplate]="paginatorDropdownItemTemplate" [showCurrentPageReport]="showCurrentPageReport" [showJumpToPageDropdown]="showJumpToPageDropdown" [showPageLinks]="showPageLinks"></p-paginator>\n            <div class="p-dataview-content">\n                <div class="p-grid p-nogutter">\n                    <ng-template ngFor let-rowData let-rowIndex="index" [ngForOf]="paginator ? ((filteredValue||value) | slice:(lazy ? 0 : first):((lazy ? 0 : first) + rows)) : (filteredValue||value)" [ngForTrackBy]="trackBy">\n                        <ng-container *ngTemplateOutlet="itemTemplate; context: {$implicit: rowData, rowIndex: rowIndex}"></ng-container>\n                    </ng-template>\n                    <div *ngIf="isEmpty()" class="p-col">\n                        <div class="p-dataview-emptymessage">{{emptyMessage}}</div>\n                    </div>\n                </div>\n            </div>\n            <p-paginator [rows]="rows" [first]="first" [totalRecords]="totalRecords" [pageLinkSize]="pageLinks" [alwaysShow]="alwaysShowPaginator"\n                (onPageChange)="paginate($event)" styleClass="p-paginator-bottom" [rowsPerPageOptions]="rowsPerPageOptions" *ngIf="paginator && (paginatorPosition === \'bottom\' || paginatorPosition ==\'both\')"\n                [dropdownAppendTo]="paginatorDropdownAppendTo" [dropdownScrollHeight]="paginatorDropdownScrollHeight" [templateLeft]="paginatorLeftTemplate" [templateRight]="paginatorRightTemplate"\n                [currentPageReportTemplate]="currentPageReportTemplate" [showFirstLastIcon]="showFirstLastIcon" [dropdownItemTemplate]="paginatorDropdownItemTemplate" [showCurrentPageReport]="showCurrentPageReport" [showJumpToPageDropdown]="showJumpToPageDropdown" [showPageLinks]="showPageLinks"></p-paginator>\n            <div class="p-dataview-footer" *ngIf="footer || footerTemplate">\n                <ng-content select="p-footer"></ng-content>\n                <ng-container *ngTemplateOutlet="footerTemplate"></ng-container>\n            </div>\n        </div>\n    ',changeDetection:e.ChangeDetectionStrategy.OnPush,encapsulation:e.ViewEncapsulation.None,styles:[".p-dataview{position:relative}.p-dataview .p-dataview-loading-overlay{align-items:center;display:flex;justify-content:center;position:absolute;z-index:2}"]}]}],r.ctorParameters=function(){return[{type:e.ElementRef},{type:e.ChangeDetectorRef},{type:n.FilterService}]},r.propDecorators={layout:[{type:e.Input}],paginator:[{type:e.Input}],rows:[{type:e.Input}],totalRecords:[{type:e.Input}],pageLinks:[{type:e.Input}],rowsPerPageOptions:[{type:e.Input}],paginatorPosition:[{type:e.Input}],alwaysShowPaginator:[{type:e.Input}],paginatorDropdownAppendTo:[{type:e.Input}],paginatorDropdownScrollHeight:[{type:e.Input}],currentPageReportTemplate:[{type:e.Input}],showCurrentPageReport:[{type:e.Input}],showJumpToPageDropdown:[{type:e.Input}],showFirstLastIcon:[{type:e.Input}],showPageLinks:[{type:e.Input}],lazy:[{type:e.Input}],emptyMessage:[{type:e.Input}],onLazyLoad:[{type:e.Output}],style:[{type:e.Input}],styleClass:[{type:e.Input}],trackBy:[{type:e.Input}],filterBy:[{type:e.Input}],filterLocale:[{type:e.Input}],loading:[{type:e.Input}],loadingIcon:[{type:e.Input}],first:[{type:e.Input}],sortField:[{type:e.Input}],sortOrder:[{type:e.Input}],value:[{type:e.Input}],onPage:[{type:e.Output}],onSort:[{type:e.Output}],onChangeLayout:[{type:e.Output}],header:[{type:e.ContentChild,args:[n.Header]}],footer:[{type:e.ContentChild,args:[n.Footer]}],templates:[{type:e.ContentChildren,args:[n.PrimeTemplate]}]};var s=function(){function t(t){this.dv=t}return t.prototype.changeLayout=function(t,e){this.dv.changeLayout(e),t.preventDefault()},t}();s.decorators=[{type:e.Component,args:[{selector:"p-dataViewLayoutOptions",template:'\n        <div [ngClass]="\'p-dataview-layout-options p-selectbutton p-buttonset\'" [ngStyle]="style" [class]="styleClass">\n            <button type="button" class="p-button p-button-icon-only" [ngClass]="{\'p-highlight\': dv.layout === \'list\'}" (click)="changeLayout($event, \'list\')" (keydown.enter)="changeLayout($event, \'list\')">\n                <i class="pi pi-bars"></i>\n            </button><button type="button" class="p-button p-button-icon-only" [ngClass]="{\'p-highlight\': dv.layout === \'grid\'}" (click)="changeLayout($event, \'grid\')" (keydown.enter)="changeLayout($event, \'grid\')">\n                <i class="pi pi-th-large"></i>\n            </button>\n        </div>\n    ',encapsulation:e.ViewEncapsulation.None}]}],s.ctorParameters=function(){return[{type:r}]},s.propDecorators={style:[{type:e.Input}],styleClass:[{type:e.Input}]};var p=function(){};p.decorators=[{type:e.NgModule,args:[{imports:[a.CommonModule,n.SharedModule,i.PaginatorModule],exports:[r,n.SharedModule,s],declarations:[r,s]}]}],t.DataView=r,t.DataViewLayoutOptions=s,t.DataViewModule=p,Object.defineProperty(t,"__esModule",{value:!0})}));
//# sourceMappingURL=primeng-dataview.umd.min.js.map