1 | import * as i0 from '@angular/core';
|
---|
2 | import { EventEmitter, Component, ChangeDetectionStrategy, ViewEncapsulation, Input, Output, ContentChild, ContentChildren, NgModule } from '@angular/core';
|
---|
3 | import * as i3 from '@angular/common';
|
---|
4 | import { CommonModule } from '@angular/common';
|
---|
5 | import { ObjectUtils } from 'primeng/utils';
|
---|
6 | import * as i1 from 'primeng/api';
|
---|
7 | import { TranslationKeys, Header, Footer, PrimeTemplate, SharedModule } from 'primeng/api';
|
---|
8 | import * as i2 from 'primeng/paginator';
|
---|
9 | import { PaginatorModule } from 'primeng/paginator';
|
---|
10 |
|
---|
11 | class DataView {
|
---|
12 | constructor(el, cd, filterService, config) {
|
---|
13 | this.el = el;
|
---|
14 | this.cd = cd;
|
---|
15 | this.filterService = filterService;
|
---|
16 | this.config = config;
|
---|
17 | this.pageLinks = 5;
|
---|
18 | this.paginatorPosition = 'bottom';
|
---|
19 | this.alwaysShowPaginator = true;
|
---|
20 | this.paginatorDropdownScrollHeight = '200px';
|
---|
21 | this.currentPageReportTemplate = '{currentPage} of {totalPages}';
|
---|
22 | this.showFirstLastIcon = true;
|
---|
23 | this.showPageLinks = true;
|
---|
24 | this.emptyMessage = '';
|
---|
25 | this.onLazyLoad = new EventEmitter();
|
---|
26 | this.trackBy = (index, item) => item;
|
---|
27 | this.loadingIcon = 'pi pi-spinner';
|
---|
28 | this.first = 0;
|
---|
29 | this.onPage = new EventEmitter();
|
---|
30 | this.onSort = new EventEmitter();
|
---|
31 | this.onChangeLayout = new EventEmitter();
|
---|
32 | this._layout = 'list';
|
---|
33 | }
|
---|
34 | get layout() {
|
---|
35 | return this._layout;
|
---|
36 | }
|
---|
37 | set layout(layout) {
|
---|
38 | this._layout = layout;
|
---|
39 | if (this.initialized) {
|
---|
40 | this.changeLayout(layout);
|
---|
41 | }
|
---|
42 | }
|
---|
43 | ngOnInit() {
|
---|
44 | if (this.lazy) {
|
---|
45 | this.onLazyLoad.emit(this.createLazyLoadMetadata());
|
---|
46 | }
|
---|
47 | this.translationSubscription = this.config.translationObserver.subscribe(() => {
|
---|
48 | this.cd.markForCheck();
|
---|
49 | });
|
---|
50 | this.initialized = true;
|
---|
51 | }
|
---|
52 | ngOnChanges(simpleChanges) {
|
---|
53 | if (simpleChanges.value) {
|
---|
54 | this._value = simpleChanges.value.currentValue;
|
---|
55 | this.updateTotalRecords();
|
---|
56 | if (!this.lazy && this.hasFilter()) {
|
---|
57 | this.filter(this.filterValue);
|
---|
58 | }
|
---|
59 | }
|
---|
60 | if (simpleChanges.sortField || simpleChanges.sortOrder) {
|
---|
61 | //avoid triggering lazy load prior to lazy initialization at onInit
|
---|
62 | if (!this.lazy || this.initialized) {
|
---|
63 | this.sort();
|
---|
64 | }
|
---|
65 | }
|
---|
66 | }
|
---|
67 | ngAfterContentInit() {
|
---|
68 | this.templates.forEach((item) => {
|
---|
69 | switch (item.getType()) {
|
---|
70 | case 'listItem':
|
---|
71 | this.listItemTemplate = item.template;
|
---|
72 | break;
|
---|
73 | case 'gridItem':
|
---|
74 | this.gridItemTemplate = item.template;
|
---|
75 | break;
|
---|
76 | case 'paginatorleft':
|
---|
77 | this.paginatorLeftTemplate = item.template;
|
---|
78 | break;
|
---|
79 | case 'paginatorright':
|
---|
80 | this.paginatorRightTemplate = item.template;
|
---|
81 | break;
|
---|
82 | case 'paginatordropdownitem':
|
---|
83 | this.paginatorDropdownItemTemplate = item.template;
|
---|
84 | break;
|
---|
85 | case 'empty':
|
---|
86 | this.emptyMessageTemplate = item.template;
|
---|
87 | break;
|
---|
88 | case 'header':
|
---|
89 | this.headerTemplate = item.template;
|
---|
90 | break;
|
---|
91 | case 'footer':
|
---|
92 | this.footerTemplate = item.template;
|
---|
93 | break;
|
---|
94 | }
|
---|
95 | });
|
---|
96 | this.updateItemTemplate();
|
---|
97 | }
|
---|
98 | updateItemTemplate() {
|
---|
99 | switch (this.layout) {
|
---|
100 | case 'list':
|
---|
101 | this.itemTemplate = this.listItemTemplate;
|
---|
102 | break;
|
---|
103 | case 'grid':
|
---|
104 | this.itemTemplate = this.gridItemTemplate;
|
---|
105 | break;
|
---|
106 | }
|
---|
107 | }
|
---|
108 | changeLayout(layout) {
|
---|
109 | this._layout = layout;
|
---|
110 | this.onChangeLayout.emit({
|
---|
111 | layout: this.layout
|
---|
112 | });
|
---|
113 | this.updateItemTemplate();
|
---|
114 | this.cd.markForCheck();
|
---|
115 | }
|
---|
116 | updateTotalRecords() {
|
---|
117 | this.totalRecords = this.lazy ? this.totalRecords : (this._value ? this._value.length : 0);
|
---|
118 | }
|
---|
119 | paginate(event) {
|
---|
120 | this.first = event.first;
|
---|
121 | this.rows = event.rows;
|
---|
122 | if (this.lazy) {
|
---|
123 | this.onLazyLoad.emit(this.createLazyLoadMetadata());
|
---|
124 | }
|
---|
125 | this.onPage.emit({
|
---|
126 | first: this.first,
|
---|
127 | rows: this.rows
|
---|
128 | });
|
---|
129 | }
|
---|
130 | sort() {
|
---|
131 | this.first = 0;
|
---|
132 | if (this.lazy) {
|
---|
133 | this.onLazyLoad.emit(this.createLazyLoadMetadata());
|
---|
134 | }
|
---|
135 | else if (this.value) {
|
---|
136 | this.value.sort((data1, data2) => {
|
---|
137 | let value1 = ObjectUtils.resolveFieldData(data1, this.sortField);
|
---|
138 | let value2 = ObjectUtils.resolveFieldData(data2, this.sortField);
|
---|
139 | let result = null;
|
---|
140 | if (value1 == null && value2 != null)
|
---|
141 | result = -1;
|
---|
142 | else if (value1 != null && value2 == null)
|
---|
143 | result = 1;
|
---|
144 | else if (value1 == null && value2 == null)
|
---|
145 | result = 0;
|
---|
146 | else if (typeof value1 === 'string' && typeof value2 === 'string')
|
---|
147 | result = value1.localeCompare(value2);
|
---|
148 | else
|
---|
149 | result = (value1 < value2) ? -1 : (value1 > value2) ? 1 : 0;
|
---|
150 | return (this.sortOrder * result);
|
---|
151 | });
|
---|
152 | if (this.hasFilter()) {
|
---|
153 | this.filter(this.filterValue);
|
---|
154 | }
|
---|
155 | }
|
---|
156 | this.onSort.emit({
|
---|
157 | sortField: this.sortField,
|
---|
158 | sortOrder: this.sortOrder
|
---|
159 | });
|
---|
160 | }
|
---|
161 | isEmpty() {
|
---|
162 | let data = this.filteredValue || this.value;
|
---|
163 | return data == null || data.length == 0;
|
---|
164 | }
|
---|
165 | createLazyLoadMetadata() {
|
---|
166 | return {
|
---|
167 | first: this.first,
|
---|
168 | rows: this.rows,
|
---|
169 | sortField: this.sortField,
|
---|
170 | sortOrder: this.sortOrder
|
---|
171 | };
|
---|
172 | }
|
---|
173 | getBlockableElement() {
|
---|
174 | return this.el.nativeElement.children[0];
|
---|
175 | }
|
---|
176 | get emptyMessageLabel() {
|
---|
177 | return this.emptyMessage || this.config.getTranslation(TranslationKeys.EMPTY_MESSAGE);
|
---|
178 | }
|
---|
179 | filter(filter, filterMatchMode = "contains") {
|
---|
180 | this.filterValue = filter;
|
---|
181 | if (this.value && this.value.length) {
|
---|
182 | let searchFields = this.filterBy.split(',');
|
---|
183 | this.filteredValue = this.filterService.filter(this.value, searchFields, filter, filterMatchMode, this.filterLocale);
|
---|
184 | if (this.filteredValue.length === this.value.length) {
|
---|
185 | this.filteredValue = null;
|
---|
186 | }
|
---|
187 | if (this.paginator) {
|
---|
188 | this.first = 0;
|
---|
189 | this.totalRecords = this.filteredValue ? this.filteredValue.length : this.value ? this.value.length : 0;
|
---|
190 | }
|
---|
191 | this.cd.markForCheck();
|
---|
192 | }
|
---|
193 | }
|
---|
194 | hasFilter() {
|
---|
195 | return this.filterValue && this.filterValue.trim().length > 0;
|
---|
196 | }
|
---|
197 | ngOnDestroy() {
|
---|
198 | if (this.translationSubscription) {
|
---|
199 | this.translationSubscription.unsubscribe();
|
---|
200 | }
|
---|
201 | }
|
---|
202 | }
|
---|
203 | DataView.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: DataView, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1.FilterService }, { token: i1.PrimeNGConfig }], target: i0.ɵɵFactoryTarget.Component });
|
---|
204 | DataView.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.0", type: DataView, selector: "p-dataView", inputs: { paginator: "paginator", rows: "rows", totalRecords: "totalRecords", pageLinks: "pageLinks", rowsPerPageOptions: "rowsPerPageOptions", paginatorPosition: "paginatorPosition", alwaysShowPaginator: "alwaysShowPaginator", paginatorDropdownAppendTo: "paginatorDropdownAppendTo", paginatorDropdownScrollHeight: "paginatorDropdownScrollHeight", currentPageReportTemplate: "currentPageReportTemplate", showCurrentPageReport: "showCurrentPageReport", showJumpToPageDropdown: "showJumpToPageDropdown", showFirstLastIcon: "showFirstLastIcon", showPageLinks: "showPageLinks", lazy: "lazy", emptyMessage: "emptyMessage", style: "style", styleClass: "styleClass", trackBy: "trackBy", filterBy: "filterBy", filterLocale: "filterLocale", loading: "loading", loadingIcon: "loadingIcon", first: "first", sortField: "sortField", sortOrder: "sortOrder", value: "value", layout: "layout" }, outputs: { onLazyLoad: "onLazyLoad", onPage: "onPage", onSort: "onSort", onChangeLayout: "onChangeLayout" }, host: { classAttribute: "p-element" }, queries: [{ propertyName: "header", first: true, predicate: Header, descendants: true }, { propertyName: "footer", first: true, predicate: Footer, descendants: true }, { propertyName: "templates", predicate: PrimeTemplate }], usesOnChanges: true, ngImport: i0, template: `
|
---|
205 | <div [ngClass]="{'p-dataview p-component': true, 'p-dataview-list': (layout === 'list'), 'p-dataview-grid': (layout === 'grid')}" [ngStyle]="style" [class]="styleClass">
|
---|
206 | <div class="p-dataview-loading" *ngIf="loading">
|
---|
207 | <div class="p-dataview-loading-overlay p-component-overlay">
|
---|
208 | <i [class]="'p-dataview-loading-icon pi-spin ' + loadingIcon"></i>
|
---|
209 | </div>
|
---|
210 | </div>
|
---|
211 | <div class="p-dataview-header" *ngIf="header || headerTemplate">
|
---|
212 | <ng-content select="p-header"></ng-content>
|
---|
213 | <ng-container *ngTemplateOutlet="headerTemplate"></ng-container>
|
---|
214 | </div>
|
---|
215 | <p-paginator [rows]="rows" [first]="first" [totalRecords]="totalRecords" [pageLinkSize]="pageLinks" [alwaysShow]="alwaysShowPaginator"
|
---|
216 | (onPageChange)="paginate($event)" styleClass="p-paginator-top" [rowsPerPageOptions]="rowsPerPageOptions" *ngIf="paginator && (paginatorPosition === 'top' || paginatorPosition =='both')"
|
---|
217 | [dropdownAppendTo]="paginatorDropdownAppendTo" [dropdownScrollHeight]="paginatorDropdownScrollHeight" [templateLeft]="paginatorLeftTemplate" [templateRight]="paginatorRightTemplate"
|
---|
218 | [currentPageReportTemplate]="currentPageReportTemplate" [showFirstLastIcon]="showFirstLastIcon" [dropdownItemTemplate]="paginatorDropdownItemTemplate" [showCurrentPageReport]="showCurrentPageReport" [showJumpToPageDropdown]="showJumpToPageDropdown" [showPageLinks]="showPageLinks"></p-paginator>
|
---|
219 | <div class="p-dataview-content">
|
---|
220 | <div class="p-grid p-nogutter grid grid-nogutter">
|
---|
221 | <ng-template ngFor let-rowData let-rowIndex="index" [ngForOf]="paginator ? ((filteredValue||value) | slice:(lazy ? 0 : first):((lazy ? 0 : first) + rows)) : (filteredValue||value)" [ngForTrackBy]="trackBy">
|
---|
222 | <ng-container *ngTemplateOutlet="itemTemplate; context: {$implicit: rowData, rowIndex: rowIndex}"></ng-container>
|
---|
223 | </ng-template>
|
---|
224 | <div *ngIf="isEmpty()" class="p-col col">
|
---|
225 | <div class="p-dataview-emptymessage">
|
---|
226 | <ng-container *ngIf="!emptyMessageTemplate; else emptyFilter">
|
---|
227 | {{emptyMessageLabel}}
|
---|
228 | </ng-container>
|
---|
229 | <ng-container #emptyFilter *ngTemplateOutlet="emptyMessageTemplate"></ng-container>
|
---|
230 | </div>
|
---|
231 | </div>
|
---|
232 | </div>
|
---|
233 | </div>
|
---|
234 | <p-paginator [rows]="rows" [first]="first" [totalRecords]="totalRecords" [pageLinkSize]="pageLinks" [alwaysShow]="alwaysShowPaginator"
|
---|
235 | (onPageChange)="paginate($event)" styleClass="p-paginator-bottom" [rowsPerPageOptions]="rowsPerPageOptions" *ngIf="paginator && (paginatorPosition === 'bottom' || paginatorPosition =='both')"
|
---|
236 | [dropdownAppendTo]="paginatorDropdownAppendTo" [dropdownScrollHeight]="paginatorDropdownScrollHeight" [templateLeft]="paginatorLeftTemplate" [templateRight]="paginatorRightTemplate"
|
---|
237 | [currentPageReportTemplate]="currentPageReportTemplate" [showFirstLastIcon]="showFirstLastIcon" [dropdownItemTemplate]="paginatorDropdownItemTemplate" [showCurrentPageReport]="showCurrentPageReport" [showJumpToPageDropdown]="showJumpToPageDropdown" [showPageLinks]="showPageLinks"></p-paginator>
|
---|
238 | <div class="p-dataview-footer" *ngIf="footer || footerTemplate">
|
---|
239 | <ng-content select="p-footer"></ng-content>
|
---|
240 | <ng-container *ngTemplateOutlet="footerTemplate"></ng-container>
|
---|
241 | </div>
|
---|
242 | </div>
|
---|
243 | `, isInline: true, styles: [".p-dataview{position:relative}.p-dataview .p-dataview-loading-overlay{position:absolute;display:flex;align-items:center;justify-content:center;z-index:2}\n"], components: [{ type: i2.Paginator, selector: "p-paginator", inputs: ["pageLinkSize", "style", "styleClass", "alwaysShow", "templateLeft", "templateRight", "dropdownAppendTo", "dropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showFirstLastIcon", "totalRecords", "rows", "rowsPerPageOptions", "showJumpToPageDropdown", "showJumpToPageInput", "showPageLinks", "dropdownItemTemplate", "first"], outputs: ["onPageChange"] }], directives: [{ type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "slice": i3.SlicePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
---|
244 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: DataView, decorators: [{
|
---|
245 | type: Component,
|
---|
246 | args: [{ selector: 'p-dataView', template: `
|
---|
247 | <div [ngClass]="{'p-dataview p-component': true, 'p-dataview-list': (layout === 'list'), 'p-dataview-grid': (layout === 'grid')}" [ngStyle]="style" [class]="styleClass">
|
---|
248 | <div class="p-dataview-loading" *ngIf="loading">
|
---|
249 | <div class="p-dataview-loading-overlay p-component-overlay">
|
---|
250 | <i [class]="'p-dataview-loading-icon pi-spin ' + loadingIcon"></i>
|
---|
251 | </div>
|
---|
252 | </div>
|
---|
253 | <div class="p-dataview-header" *ngIf="header || headerTemplate">
|
---|
254 | <ng-content select="p-header"></ng-content>
|
---|
255 | <ng-container *ngTemplateOutlet="headerTemplate"></ng-container>
|
---|
256 | </div>
|
---|
257 | <p-paginator [rows]="rows" [first]="first" [totalRecords]="totalRecords" [pageLinkSize]="pageLinks" [alwaysShow]="alwaysShowPaginator"
|
---|
258 | (onPageChange)="paginate($event)" styleClass="p-paginator-top" [rowsPerPageOptions]="rowsPerPageOptions" *ngIf="paginator && (paginatorPosition === 'top' || paginatorPosition =='both')"
|
---|
259 | [dropdownAppendTo]="paginatorDropdownAppendTo" [dropdownScrollHeight]="paginatorDropdownScrollHeight" [templateLeft]="paginatorLeftTemplate" [templateRight]="paginatorRightTemplate"
|
---|
260 | [currentPageReportTemplate]="currentPageReportTemplate" [showFirstLastIcon]="showFirstLastIcon" [dropdownItemTemplate]="paginatorDropdownItemTemplate" [showCurrentPageReport]="showCurrentPageReport" [showJumpToPageDropdown]="showJumpToPageDropdown" [showPageLinks]="showPageLinks"></p-paginator>
|
---|
261 | <div class="p-dataview-content">
|
---|
262 | <div class="p-grid p-nogutter grid grid-nogutter">
|
---|
263 | <ng-template ngFor let-rowData let-rowIndex="index" [ngForOf]="paginator ? ((filteredValue||value) | slice:(lazy ? 0 : first):((lazy ? 0 : first) + rows)) : (filteredValue||value)" [ngForTrackBy]="trackBy">
|
---|
264 | <ng-container *ngTemplateOutlet="itemTemplate; context: {$implicit: rowData, rowIndex: rowIndex}"></ng-container>
|
---|
265 | </ng-template>
|
---|
266 | <div *ngIf="isEmpty()" class="p-col col">
|
---|
267 | <div class="p-dataview-emptymessage">
|
---|
268 | <ng-container *ngIf="!emptyMessageTemplate; else emptyFilter">
|
---|
269 | {{emptyMessageLabel}}
|
---|
270 | </ng-container>
|
---|
271 | <ng-container #emptyFilter *ngTemplateOutlet="emptyMessageTemplate"></ng-container>
|
---|
272 | </div>
|
---|
273 | </div>
|
---|
274 | </div>
|
---|
275 | </div>
|
---|
276 | <p-paginator [rows]="rows" [first]="first" [totalRecords]="totalRecords" [pageLinkSize]="pageLinks" [alwaysShow]="alwaysShowPaginator"
|
---|
277 | (onPageChange)="paginate($event)" styleClass="p-paginator-bottom" [rowsPerPageOptions]="rowsPerPageOptions" *ngIf="paginator && (paginatorPosition === 'bottom' || paginatorPosition =='both')"
|
---|
278 | [dropdownAppendTo]="paginatorDropdownAppendTo" [dropdownScrollHeight]="paginatorDropdownScrollHeight" [templateLeft]="paginatorLeftTemplate" [templateRight]="paginatorRightTemplate"
|
---|
279 | [currentPageReportTemplate]="currentPageReportTemplate" [showFirstLastIcon]="showFirstLastIcon" [dropdownItemTemplate]="paginatorDropdownItemTemplate" [showCurrentPageReport]="showCurrentPageReport" [showJumpToPageDropdown]="showJumpToPageDropdown" [showPageLinks]="showPageLinks"></p-paginator>
|
---|
280 | <div class="p-dataview-footer" *ngIf="footer || footerTemplate">
|
---|
281 | <ng-content select="p-footer"></ng-content>
|
---|
282 | <ng-container *ngTemplateOutlet="footerTemplate"></ng-container>
|
---|
283 | </div>
|
---|
284 | </div>
|
---|
285 | `, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
|
---|
286 | 'class': 'p-element'
|
---|
287 | }, styles: [".p-dataview{position:relative}.p-dataview .p-dataview-loading-overlay{position:absolute;display:flex;align-items:center;justify-content:center;z-index:2}\n"] }]
|
---|
288 | }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i1.FilterService }, { type: i1.PrimeNGConfig }]; }, propDecorators: { paginator: [{
|
---|
289 | type: Input
|
---|
290 | }], rows: [{
|
---|
291 | type: Input
|
---|
292 | }], totalRecords: [{
|
---|
293 | type: Input
|
---|
294 | }], pageLinks: [{
|
---|
295 | type: Input
|
---|
296 | }], rowsPerPageOptions: [{
|
---|
297 | type: Input
|
---|
298 | }], paginatorPosition: [{
|
---|
299 | type: Input
|
---|
300 | }], alwaysShowPaginator: [{
|
---|
301 | type: Input
|
---|
302 | }], paginatorDropdownAppendTo: [{
|
---|
303 | type: Input
|
---|
304 | }], paginatorDropdownScrollHeight: [{
|
---|
305 | type: Input
|
---|
306 | }], currentPageReportTemplate: [{
|
---|
307 | type: Input
|
---|
308 | }], showCurrentPageReport: [{
|
---|
309 | type: Input
|
---|
310 | }], showJumpToPageDropdown: [{
|
---|
311 | type: Input
|
---|
312 | }], showFirstLastIcon: [{
|
---|
313 | type: Input
|
---|
314 | }], showPageLinks: [{
|
---|
315 | type: Input
|
---|
316 | }], lazy: [{
|
---|
317 | type: Input
|
---|
318 | }], emptyMessage: [{
|
---|
319 | type: Input
|
---|
320 | }], onLazyLoad: [{
|
---|
321 | type: Output
|
---|
322 | }], style: [{
|
---|
323 | type: Input
|
---|
324 | }], styleClass: [{
|
---|
325 | type: Input
|
---|
326 | }], trackBy: [{
|
---|
327 | type: Input
|
---|
328 | }], filterBy: [{
|
---|
329 | type: Input
|
---|
330 | }], filterLocale: [{
|
---|
331 | type: Input
|
---|
332 | }], loading: [{
|
---|
333 | type: Input
|
---|
334 | }], loadingIcon: [{
|
---|
335 | type: Input
|
---|
336 | }], first: [{
|
---|
337 | type: Input
|
---|
338 | }], sortField: [{
|
---|
339 | type: Input
|
---|
340 | }], sortOrder: [{
|
---|
341 | type: Input
|
---|
342 | }], value: [{
|
---|
343 | type: Input
|
---|
344 | }], onPage: [{
|
---|
345 | type: Output
|
---|
346 | }], onSort: [{
|
---|
347 | type: Output
|
---|
348 | }], onChangeLayout: [{
|
---|
349 | type: Output
|
---|
350 | }], header: [{
|
---|
351 | type: ContentChild,
|
---|
352 | args: [Header]
|
---|
353 | }], footer: [{
|
---|
354 | type: ContentChild,
|
---|
355 | args: [Footer]
|
---|
356 | }], templates: [{
|
---|
357 | type: ContentChildren,
|
---|
358 | args: [PrimeTemplate]
|
---|
359 | }], layout: [{
|
---|
360 | type: Input
|
---|
361 | }] } });
|
---|
362 | class DataViewLayoutOptions {
|
---|
363 | constructor(dv) {
|
---|
364 | this.dv = dv;
|
---|
365 | }
|
---|
366 | changeLayout(event, layout) {
|
---|
367 | this.dv.changeLayout(layout);
|
---|
368 | event.preventDefault();
|
---|
369 | }
|
---|
370 | }
|
---|
371 | DataViewLayoutOptions.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: DataViewLayoutOptions, deps: [{ token: DataView }], target: i0.ɵɵFactoryTarget.Component });
|
---|
372 | DataViewLayoutOptions.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.0", type: DataViewLayoutOptions, selector: "p-dataViewLayoutOptions", inputs: { style: "style", styleClass: "styleClass" }, host: { classAttribute: "p-element" }, ngImport: i0, template: `
|
---|
373 | <div [ngClass]="'p-dataview-layout-options p-selectbutton p-buttonset'" [ngStyle]="style" [class]="styleClass">
|
---|
374 | <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')">
|
---|
375 | <i class="pi pi-bars"></i>
|
---|
376 | </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')">
|
---|
377 | <i class="pi pi-th-large"></i>
|
---|
378 | </button>
|
---|
379 | </div>
|
---|
380 | `, isInline: true, directives: [{ type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], encapsulation: i0.ViewEncapsulation.None });
|
---|
381 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: DataViewLayoutOptions, decorators: [{
|
---|
382 | type: Component,
|
---|
383 | args: [{
|
---|
384 | selector: 'p-dataViewLayoutOptions',
|
---|
385 | template: `
|
---|
386 | <div [ngClass]="'p-dataview-layout-options p-selectbutton p-buttonset'" [ngStyle]="style" [class]="styleClass">
|
---|
387 | <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')">
|
---|
388 | <i class="pi pi-bars"></i>
|
---|
389 | </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')">
|
---|
390 | <i class="pi pi-th-large"></i>
|
---|
391 | </button>
|
---|
392 | </div>
|
---|
393 | `,
|
---|
394 | encapsulation: ViewEncapsulation.None,
|
---|
395 | host: {
|
---|
396 | 'class': 'p-element'
|
---|
397 | }
|
---|
398 | }]
|
---|
399 | }], ctorParameters: function () { return [{ type: DataView }]; }, propDecorators: { style: [{
|
---|
400 | type: Input
|
---|
401 | }], styleClass: [{
|
---|
402 | type: Input
|
---|
403 | }] } });
|
---|
404 | class DataViewModule {
|
---|
405 | }
|
---|
406 | DataViewModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: DataViewModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
---|
407 | DataViewModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: DataViewModule, declarations: [DataView, DataViewLayoutOptions], imports: [CommonModule, SharedModule, PaginatorModule], exports: [DataView, SharedModule, DataViewLayoutOptions] });
|
---|
408 | DataViewModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: DataViewModule, imports: [[CommonModule, SharedModule, PaginatorModule], SharedModule] });
|
---|
409 | i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.0", ngImport: i0, type: DataViewModule, decorators: [{
|
---|
410 | type: NgModule,
|
---|
411 | args: [{
|
---|
412 | imports: [CommonModule, SharedModule, PaginatorModule],
|
---|
413 | exports: [DataView, SharedModule, DataViewLayoutOptions],
|
---|
414 | declarations: [DataView, DataViewLayoutOptions]
|
---|
415 | }]
|
---|
416 | }] });
|
---|
417 |
|
---|
418 | /**
|
---|
419 | * Generated bundle index. Do not edit.
|
---|
420 | */
|
---|
421 |
|
---|
422 | export { DataView, DataViewLayoutOptions, DataViewModule };
|
---|