ngx-easy-table
Version:
Angular easy table
778 lines (777 loc) • 32.1 kB
JavaScript
import { BrowserModule } from '@angular/platform-browser';
import { ChangeDetectorRef, Component, ContentChild, EventEmitter, Injectable, Input, NgModule, Output, Pipe, TemplateRef } from '@angular/core';
import { Http, HttpModule } from '@angular/http';
import 'rxjs/add/operator/map';
import { Subject as Subject$1 } from 'rxjs/Subject';
var HttpService = (function () {
/**
* @param {?} http
*/
function HttpService(http$$1) {
this.http = http$$1;
}
/**
* @param {?} url
* @return {?}
*/
HttpService.prototype.getData = function (url) {
return this.http.get(url)
.map(function (responseData) {
return responseData.json();
});
};
return HttpService;
}());
HttpService.decorators = [
{ type: Injectable },
];
/**
* @nocollapse
*/
HttpService.ctorParameters = function () { return [
{ type: Http, },
]; };
var FiltersService = (function () {
function FiltersService() {
this.filters = [];
}
/**
* @param {?} k
* @param {?} v
* @return {?}
*/
FiltersService.prototype.update = function (k, v) {
this.filters[k] = v;
};
;
/**
* @return {?}
*/
FiltersService.prototype.get = function () {
return this.filters;
};
return FiltersService;
}());
FiltersService.decorators = [
{ type: Injectable },
];
/**
* @nocollapse
*/
FiltersService.ctorParameters = function () { return []; };
var ResourceService = (function () {
function ResourceService() {
this.data = [];
this.keys = [];
this.order = [];
this.previousData = [];
}
/**
* @return {?}
*/
ResourceService.getPipedData = function () {
if (!this._pipedDataEmitter) {
this._pipedDataEmitter = new EventEmitter();
}
return this._pipedDataEmitter;
};
/**
* @return {?}
*/
ResourceService.prototype.getOrder = function () {
return this.order[this.key];
};
;
/**
* @param {?} key
* @return {?}
*/
ResourceService.prototype.sortBy = function (key) {
var _this = this;
this.key = key;
if (Object.keys(this.order).length === 0) {
this.order[this.key] = 'asc';
}
if (this.order[this.key] === 'asc') {
this.order = [];
this.order[this.key] = 'desc';
this.data.sort(function (a, b) { return _this.compare(a, b); });
}
else {
this.order = [];
this.order[this.key] = 'asc';
this.data.sort(function (a, b) { return _this.compare(b, a); });
}
return this.data;
};
;
/**
* @param {?} a
* @param {?} b
* @return {?}
*/
ResourceService.prototype.compare = function (a, b) {
if ((isNaN(parseFloat(a[this.key])) || !isFinite(a[this.key])) || (isNaN(parseFloat(b[this.key])) || !isFinite(b[this.key]))) {
if (a[this.key] + ''.toLowerCase() < b[this.key] + ''.toLowerCase()) {
return -1;
}
if (a[this.key] + ''.toLowerCase() > b[this.key] + ''.toLowerCase()) {
return 1;
}
}
else {
if (parseFloat(a[this.key]) < parseFloat(b[this.key])) {
return -1;
}
if (parseFloat(a[this.key]) > parseFloat(b[this.key])) {
return 1;
}
}
return 0;
};
;
return ResourceService;
}());
ResourceService.decorators = [
{ type: Injectable },
];
/**
* @nocollapse
*/
ResourceService.ctorParameters = function () { return []; };
var ConfigService = (function () {
function ConfigService() {
this.searchEnabled = true;
this.orderEnabled = true;
this.globalSearchEnabled = true;
this.footerEnabled = false;
this.paginationEnabled = true;
this.exportEnabled = true;
this.editEnabled = false;
this.clickEvent = false;
this.selectRow = true;
this.selectCol = false;
this.selectCell = false;
this.resourceUrl = "https://www.json-generator.com/api/json/get/ceVvFoDEeq";
this.rows = 10;
this.columns = [];
this.hiddenColumns = new Set([]);
}
return ConfigService;
}());
ConfigService.decorators = [
{ type: Injectable },
];
/**
* @nocollapse
*/
ConfigService.ctorParameters = function () { return []; };
var TableComponent = (function () {
/**
* @param {?} filtersService
* @param {?} config
* @param {?} resource
* @param {?} httpService
* @param {?} cdr
*/
function TableComponent(filtersService, config, resource, httpService, cdr) {
this.filtersService = filtersService;
this.config = config;
this.resource = resource;
this.httpService = httpService;
this.cdr = cdr;
this.event = new EventEmitter();
}
/**
* @return {?}
*/
TableComponent.prototype.ngOnInit = function () {
var _this = this;
if (this.configuration) {
this.config = this.configuration;
}
this.numberOfItems = 0;
this.itemsObservables = this.httpService.getData(this.config.resourceUrl);
this.itemsObservables.subscribe(function (res) {
_this.data = res;
_this.numberOfItems = res.length;
_this.keys = Object.keys(_this.data[0]);
_this.resource.keys = _this.keys;
});
};
/**
* @return {?}
*/
TableComponent.prototype.ngAfterViewInit = function () {
this.cdr.detectChanges();
};
/**
* @param {?} key
* @return {?}
*/
TableComponent.prototype.orderBy = function (key) {
this.data = this.resource.sortBy(key);
};
/**
* @param {?} $event
* @param {?} row
* @param {?} key
* @param {?} colIndex
* @param {?} rowIndex
* @return {?}
*/
TableComponent.prototype.clickedCell = function ($event, row, key, colIndex, rowIndex) {
if (this.config.selectRow) {
this.selectedRow = rowIndex;
}
if (this.config.selectCol) {
this.selectedCol = colIndex;
}
if (this.config.selectCell) {
this.selectedRow = rowIndex;
this.selectedCol = colIndex;
}
if (this.config.clickEvent) {
this.event.emit({
event: $event,
row: row,
key: key,
rowId: rowIndex,
colId: colIndex,
});
}
};
/**
* @return {?}
*/
TableComponent.prototype.isColumnDefined = function () {
if (this.config.columns.length === 0) {
return false;
}
if (this.keys.length !== this.config.columns.length) {
console.error('columns count in the configuration is not equal to columns count from JSON');
return false;
}
return true;
};
/**
* @param {?} colIndex
* @return {?}
*/
TableComponent.prototype.showColumn = function (colIndex) {
return !this.config.hiddenColumns.has(colIndex);
};
/**
* @param {?} colIndex
* @return {?}
*/
TableComponent.prototype.toggleColumn = function (colIndex) {
if (this.config.hiddenColumns.has(colIndex)) {
this.config.hiddenColumns.delete(colIndex);
}
else {
this.config.hiddenColumns.add(colIndex);
}
};
return TableComponent;
}());
TableComponent.decorators = [
{ type: Component, args: [{
selector: 'ng2-table',
providers: [HttpService, FiltersService, ResourceService, ConfigService],
template: "\n <global-search\n *ngIf=\"config.globalSearchEnabled\"\n (globalUpdate)=\"globalSearchTerm = $event\">\n </global-search>\n <csv-export *ngIf=\"config.exportEnabled\"></csv-export>\n\n <table class=\"ng2-table__table--striped\">\n <thead>\n <tr>\n <ng-container *ngFor=\"let key of keys;let headerIndex = index\">\n <th [style.display]=\"config.orderEnabled?'':'none' \"\n *ngIf=\"showColumn(key)\"\n (click)=\"orderBy(key)\">\n <div *ngIf=\"isColumnDefined();then customHeader else defaultHeader\"></div>\n <ng-template #customHeader>{{config.columns[headerIndex]}}</ng-template>\n <ng-template #defaultHeader>{{ key }}</ng-template>\n <span *ngIf=\"resource.order[key]==='asc' \"\n class=\"icon-sort-alpha-desc\">\n </span>\n <span *ngIf=\"resource.order[key]==='desc' \"\n class=\"icon-sort-alpha-asc\">\n </span>\n </th>\n </ng-container>\n <ng-container *ngFor=\"let key of keys\">\n <th [style.display]=\"!config.orderEnabled?'':'none' \"\n *ngIf=\"showColumn(key)\">\n {{ key }}\n </th>\n </ng-container>\n <th *ngIf=\"config.editEnabled\">Actions</th>\n </tr>\n <tr *ngIf=\"config.searchEnabled\">\n <ng-container *ngFor=\"let key of keys\">\n <th *ngIf=\"showColumn(key)\">\n <table-header (update)=\"term = $event\" [key]=\"key\"></table-header>\n </th>\n </ng-container>\n <th *ngIf=\"config.editEnabled\"></th>\n </tr>\n </thead>\n <tbody *ngIf=\"data\">\n <ng-container *ngIf=\"tpl\">\n <tr *ngFor=\"let row of data | search : term | global : globalSearchTerm | pagination : range;\n let rowIndex = index\"\n [class.ng2-table__table-row--selected]=\"rowIndex == selectedRow && !config.selectCell\">\n <ng-container [ngTemplateOutlet]=\"tpl\"\n [ngOutletContext]=\"{ $implicit: row }\">\n </ng-container>\n </tr>\n </ng-container>\n <ng-container *ngIf=\"!tpl\">\n <tr *ngFor=\"let row of data | search : term | global : globalSearchTerm | pagination : range;\n let rowIndex = index\"\n [class.ng2-table__table-row--selected]=\"rowIndex == selectedRow && !config.selectCell\">\n <ng-container *ngFor=\"let key of keys; let colIndex = index\">\n <td *ngIf=\"showColumn(key)\"\n (click)=\"clickedCell($event, row, key, colIndex, rowIndex)\"\n [class.ng2-table__table-col--selected]=\"colIndex == selectedCol && !config.selectCell\"\n [class.ng2-table__table-cell--selected]=\"colIndex == selectedCol && rowIndex == selectedRow && !config.selectCol && !config.selectRow\"\n >\n <div>{{ row[key] }}</div>\n </td>\n </ng-container>\n <td *ngIf=\"config.editEnabled\">\n <button class=\"ng2-table__button\">Edit</button>\n </td>\n </tr>\n </ng-container>\n </tbody>\n <tbody *ngIf=\"!data\">\n <tr>\n <td>No results</td>\n </tr>\n </tbody>\n <tfoot *ngIf=\"config.footerEnabled\">\n <tr>\n <td *ngFor=\"let key of keys\"></td>\n <td></td>\n </tr>\n </tfoot>\n </table>\n\n <pagination\n *ngIf=\"config.paginationEnabled\"\n [numberOfItems]=\"numberOfItems\"\n (updateRange)=\"range = $event\">\n </pagination>\n ",
styles: ["\n @import url(\"../assets/fonts/style.css\");\n @import \"~lato-font\";\n\n * {\n font-family: Lato, serif;\n }\n\n .ng2-table__button, .ng2-table__csv-export-button {\n background: #f0f0f0;\n border: 1px solid #d7d7d7;\n font-size: .8em;\n padding: 6px;\n }\n\n .ng2-table__table, .ng2-table__table--striped {\n border-spacing: 0;\n width: 100%;\n }\n\n .ng2-table__table td,\n .ng2-table__table th, .ng2-table__table--striped td,\n .ng2-table__table--striped th {\n border-color: #f2f2f2;\n border-style: solid;\n border-width: 1px 1px 0 0;\n margin: 0;\n padding: 2px;\n }\n\n .ng2-table__table thead > th, .ng2-table__table--striped thead > th {\n cursor: pointer;\n font-weight: 700;\n text-align: left;\n }\n\n .ng2-table__table tr:last-child th, .ng2-table__table--striped tr:last-child th {\n border-bottom-color: #cacaca;\n }\n\n .ng2-table__table tr:last-child td, .ng2-table__table--striped tr:last-child td {\n border-bottom: 1px solid #f0f0f0;\n }\n\n .ng2-table__table tr td:first-child,\n .ng2-table__table tr th:first-child, .ng2-table__table--striped tr td:first-child,\n .ng2-table__table--striped tr th:first-child {\n border-left: 1px solid #f0f0f0;\n }\n\n .ng2-table__table--striped tbody tr:nth-child(odd) {\n background: #fafafa;\n }\n\n .ng2-table__table-row--selected {\n background: #66c6f0 !important;\n }\n\n .ng2-table__table-col--selected {\n background: #66c6f0 !important;\n }\n\n .ng2-table__table-cell--selected {\n background: #66c6f0 !important;\n }\n "]
},] },
];
/**
* @nocollapse
*/
TableComponent.ctorParameters = function () { return [
{ type: FiltersService, },
{ type: ConfigService, },
{ type: ResourceService, },
{ type: HttpService, },
{ type: ChangeDetectorRef, },
]; };
TableComponent.propDecorators = {
'configuration': [{ type: Input },],
'event': [{ type: Output },],
'tpl': [{ type: ContentChild, args: [TemplateRef,] },],
};
var GlobalSearch = (function () {
function GlobalSearch() {
this.globalUpdate = new EventEmitter();
}
return GlobalSearch;
}());
GlobalSearch.decorators = [
{ type: Component, args: [{
selector: 'global-search',
template: "\n <label class=\"ng2-table__global-search-label\" for=\"search\">\n <input type=\"text\"\n id=\"search\"\n class=\"ng2-table__input\"\n #input\n (input)=\"globalUpdate.emit({value: input.value})\"\n placeholder=\"Search\"/>\n </label>\n ",
styles: ["\n .ng2-table__input {\n border: 0;\n font-size: .9em;\n margin: 0;\n padding: 2px;\n width: 99%;\n }\n\n .ng2-table__global-search-label {\n border: 1px solid #f0f0f0;\n display: inline-block;\n margin: 6px 0;\n padding: 2px;\n width: 300px;\n }\n .ng2-table__global-search-label::before {\n color: #cacaca;\n left: 290px;\n position: absolute;\n top: 18px;\n z-index: 1;\n }\n "]
},] },
];
/**
* @nocollapse
*/
GlobalSearch.ctorParameters = function () { return []; };
GlobalSearch.propDecorators = {
'globalUpdate': [{ type: Output },],
};
var CsvExport = (function () {
/**
* @param {?} resource
* @param {?} config
*/
function CsvExport(resource, config) {
var _this = this;
this.resource = resource;
this.config = config;
this.exportCsv = function () {
var /** @type {?} */ data = _this.resource.data;
var /** @type {?} */ csvContent = "data:text/csv;charset=utf-8,";
var /** @type {?} */ dataString = "";
var /** @type {?} */ x = [];
var /** @type {?} */ keys = _this.resource.keys.slice().filter(function (key) {
return !_this.config.hiddenColumns.has(key);
});
data.forEach(function (row, index) {
x[index] = [];
keys.forEach(function (i) {
if (row.hasOwnProperty(i)) {
if (typeof row[i] === "object") {
row[i] = "Object"; // so far just change object to "Object" string
}
x[index].push(row[i]);
}
});
});
csvContent += keys + "\n";
x.forEach(function (row, index) {
dataString = row.join(",");
csvContent += index < data.length ? dataString + "\n" : dataString;
});
var /** @type {?} */ encodedUri = encodeURI(csvContent);
var /** @type {?} */ link = document.createElement("a");
link.setAttribute("href", encodedUri);
link.setAttribute("download", "my_data.csv");
link.click();
};
}
return CsvExport;
}());
CsvExport.decorators = [
{ type: Component, args: [{
selector: 'csv-export',
template: "\n <button class=\"ng2-table__csv-export-button\"\n (click)=\"exportCsv()\">Export to CSV\n </button>",
styles: ["\n /*TODO move this button to some imports */\n .ng2-table__csv-export-button {\n background: #f0f0f0;\n border: 1px solid #d7d7d7;\n font-size: .8em;\n padding: 6px;\n display: inline-block;\n float: right;\n margin: 6px 0;\n }\n "]
},] },
];
/**
* @nocollapse
*/
CsvExport.ctorParameters = function () { return [
{ type: ResourceService, },
{ type: ConfigService, },
]; };
var Header = (function () {
/**
* @param {?} filtersService
*/
function Header(filtersService) {
this.filtersService = filtersService;
this.update = new EventEmitter();
}
/**
* @return {?}
*/
Header.prototype.ngOnInit = function () {
this.update.emit({});
};
return Header;
}());
Header.decorators = [
{ type: Component, args: [{
selector: 'table-header',
template: "\n <label for=\"search_{{ key }}\">\n <input type=\"text\"\n id=\"search_{{ key }}\"\n aria-label=\"Search\"\n placeholder=\"Search for {{ key }}\"\n class=\"ng2-table__input\"\n #input\n (input)=\"update.emit({value: input.value, key: key})\"\n >\n </label>",
styles: ["\n .ng2-table__input {\n border: 0;\n font-size: .9em;\n margin: 0;\n padding: 2px;\n width: 99%;\n }\n "]
},] },
];
/**
* @nocollapse
*/
Header.ctorParameters = function () { return [
{ type: FiltersService, },
]; };
Header.propDecorators = {
'key': [{ type: Input },],
'update': [{ type: Output },],
};
var PaginationService = (function () {
/**
* @param {?} resource
* @param {?} config
*/
function PaginationService(resource, config) {
var _this = this;
this.resource = resource;
this.config = config;
this.updateRangeSource = new Subject$1();
this.updateRange$ = this.updateRangeSource.asObservable();
this.ranges = [5, 10, 25, 50, 100];
this.pageNumber = 1;
this.range = this.config.rows || 10;
this.pageNumbers = [];
ResourceService.getPipedData().subscribe(function (data) {
_this.numberOfItems = data;
_this.updateNumberPerPage();
});
}
/**
* @return {?}
*/
PaginationService.prototype.emitPaginationProperties = function () {
this.updateRangeSource.next({ range: this.range, page: this.pageNumber });
};
/**
* @return {?}
*/
PaginationService.prototype.updateNumberPerPage = function () {
// issue #5
// if (this.range > this.numberOfItems && this.numberOfItems > 0) {
// this.range = this.numberOfItems;
// }
this.pageNumbers = Array(this.paginationItemsCount)
.fill(this.paginationItemsCount, 0)
.map(function (_, i) { return i + 1; });
};
/**
* @return {?}
*/
PaginationService.prototype.updatePagination = function () {
this.updateNumberPerPage();
this.emitPaginationProperties();
};
/**
* @param {?} currentRange
* @return {?}
*/
PaginationService.prototype.isActiveRange = function (currentRange) {
return currentRange === this.range;
};
/**
* @param {?} currentPage
* @return {?}
*/
PaginationService.prototype.isActivePage = function (currentPage) {
return currentPage === this.pageNumber;
};
/**
* @param {?} event
* @return {?}
*/
PaginationService.prototype.nextPage = function (event) {
event.preventDefault();
if (!this.isLastPage()) {
this.pageNumber++;
this.updatePagination();
}
};
/**
* @param {?} event
* @return {?}
*/
PaginationService.prototype.previousPage = function (event) {
event.preventDefault();
if (!this.isFirstPage()) {
this.pageNumber--;
this.updatePagination();
}
};
/**
* @return {?}
*/
PaginationService.prototype.isLastPage = function () {
return this.pageNumber === this.pageNumbers.length;
};
/**
* @return {?}
*/
PaginationService.prototype.isFirstPage = function () {
return this.pageNumber === 1;
};
/**
* @return {?}
*/
PaginationService.prototype.ngOnChanges = function () {
this.updatePagination();
};
/**
* @param {?} event
* @param {?} number
* @return {?}
*/
PaginationService.prototype.changeRange = function (event, number) {
event.preventDefault();
this.range = number;
this.pageNumber = 1;
this.updatePagination();
};
/**
* @param {?} event
* @param {?} numberOfPage
* @return {?}
*/
PaginationService.prototype.changePage = function (event, numberOfPage) {
event.preventDefault();
this.pageNumber = numberOfPage;
this.updatePagination();
};
Object.defineProperty(PaginationService.prototype, "paginationItemsCount", {
/**
* @return {?}
*/
get: function () {
return Math.ceil(this.numberOfItems / this.range);
},
enumerable: true,
configurable: true
});
return PaginationService;
}());
PaginationService.decorators = [
{ type: Injectable },
];
/**
* @nocollapse
*/
PaginationService.ctorParameters = function () { return [
{ type: ResourceService, },
{ type: ConfigService, },
]; };
var Pagination = (function () {
/**
* @param {?} paginationService
*/
function Pagination(paginationService) {
var _this = this;
this.paginationService = paginationService;
this.numberOfItems = this.paginationService.numberOfItems;
this.updateRange = new EventEmitter();
paginationService.updateRange$.subscribe(function (ev) {
_this.updateRange.emit(ev);
});
}
return Pagination;
}());
Pagination.decorators = [
{ type: Component, args: [{
selector: 'pagination',
template: "\n <div class=\"ng2-table__pagination-wrapper\">\n <ul class=\"ng2-table__pagination\">\n <li [class.disabled]=\"paginationService.isFirstPage()\"\n (click)=\"paginationService.previousPage($event)\">\n <span class=\"icon-circle-left\"></span>\n </li>\n <li *ngFor=\"let page of paginationService.pageNumbers\"\n (click)=\"paginationService.changePage($event, page)\"\n [class.active]=\"paginationService.isActivePage(page)\">\n <a href=\"#\">{{page}}</a>\n </li>\n <li [class.disabled]=\"paginationService.isLastPage()\"\n (click)=\"paginationService.nextPage($event)\">\n <span class=\"icon-circle-right\"></span>\n </li>\n </ul>\n\n <ul class=\"ng2-table__items-per-page\">\n <li [class.active]=\"paginationService.isActiveRange(range)\"\n (click)=\"paginationService.changeRange($event, range)\"\n *ngFor=\"let range of paginationService.ranges\">\n <a href=\"#\">{{range}}</a>\n </li>\n </ul>\n </div>\n ",
styles: ["\n @import url(\"../../../assets/fonts/style.css\");\n\n .ng2-table__pagination, .ng2-table__items-per-page {\n display: inline-block;\n float: left;\n list-style-type: none;\n margin: 8px 0;\n padding: 0;\n }\n .ng2-table__pagination li, .ng2-table__items-per-page li {\n border: 1px solid #f0f0f0;\n float: left;\n margin: 0;\n padding: 6px;\n cursor: pointer;\n border-left: 0;\n border-right: 0;\n }\n .ng2-table__pagination li:first-child, .ng2-table__items-per-page li:first-child {\n border-left: 1px solid #f0f0f0;\n }\n .ng2-table__pagination li:last-child, .ng2-table__items-per-page li:last-child {\n border-right: 1px solid #f0f0f0;\n }\n .ng2-table__pagination a, .ng2-table__items-per-page a {\n color: inherit;\n text-decoration: none;\n }\n .ng2-table__pagination .active, .ng2-table__items-per-page .active {\n background: #3e71b4;\n border-color: #3e71b4;\n color: #fff;\n }\n\n .ng2-table__pagination .disabled, .ng2-table__items-per-page .disabled {\n background: #fff;\n border-color: #f0f0f0;\n color: #dddddd;\n cursor: default;\n }\n\n .ng2-table__items-per-page {\n float: right;\n }\n .ng2-table__pagination-wrapper::after {\n clear: both;\n content: '';\n display: block;\n height: 0;\n visibility: hidden;\n }\n "],
providers: [PaginationService],
},] },
];
/**
* @nocollapse
*/
Pagination.ctorParameters = function () { return [
{ type: PaginationService, },
]; };
Pagination.propDecorators = {
'numberOfItems': [{ type: Input },],
'updateRange': [{ type: Output },],
};
var SearchPipe = (function () {
/**
* @param {?} filtersService
* @param {?} resource
*/
function SearchPipe(filtersService, resource) {
this.filtersService = filtersService;
this.resource = resource;
}
/**
* @param {?} value
* @param {?} filters
* @return {?}
*/
SearchPipe.prototype.transform = function (value, filters) {
var _this = this;
if (typeof value === "undefined") {
return;
}
this.resource.data = value.slice();
if (typeof filters === 'undefined' || Object.keys(filters).length === 0) {
return this.resource.data;
}
this.filtersService.update(filters.key, filters.value);
var /** @type {?} */ filtersArr = this.filtersService.get();
value.forEach(function (item) {
for (var /** @type {?} */ filterKey in filtersArr) {
if (filtersArr.hasOwnProperty(filterKey)) {
var /** @type {?} */ element = void 0;
if (typeof item[filterKey] === "string") {
element = item[filterKey].toLocaleLowerCase();
}
if (typeof item[filterKey] === "object") {
element = JSON.stringify(item[filterKey]);
}
if (typeof item[filterKey] === "number") {
element = item[filterKey].toString();
}
if (element.indexOf(filtersArr[filterKey].toLocaleLowerCase()) === -1) {
_this.resource.data.splice(_this.resource.data.indexOf(item), 1);
return;
}
}
}
});
return this.resource.data;
};
return SearchPipe;
}());
SearchPipe.decorators = [
{ type: Pipe, args: [{
name: 'search'
},] },
];
/**
* @nocollapse
*/
SearchPipe.ctorParameters = function () { return [
{ type: FiltersService, },
{ type: ResourceService, },
]; };
var PaginationPipe = (function () {
/**
* @param {?} resource
*/
function PaginationPipe(resource) {
this.resource = resource;
}
/**
* @param {?} value
* @param {?} filters
* @return {?}
*/
PaginationPipe.prototype.transform = function (value, filters) {
var /** @type {?} */ range = 10;
if (typeof value === 'undefined') {
return;
}
ResourceService.getPipedData().emit(value.length);
var /** @type {?} */ copiedArr = value.slice();
if (typeof filters !== 'undefined') {
range = filters.range;
copiedArr = value.slice(range * (filters.page - 1));
}
return copiedArr.splice(0, range);
};
return PaginationPipe;
}());
PaginationPipe.decorators = [
{ type: Pipe, args: [{
name: 'pagination'
},] },
];
/**
* @nocollapse
*/
PaginationPipe.ctorParameters = function () { return [
{ type: ResourceService, },
]; };
var GlobalSearchPipe = (function () {
/**
* @param {?} resource
*/
function GlobalSearchPipe(resource) {
this.resource = resource;
}
/**
* @param {?} dataArr
* @param {?} filter
* @return {?}
*/
GlobalSearchPipe.prototype.transform = function (dataArr, filter) {
var _this = this;
if (typeof dataArr === "undefined") {
return;
}
if (typeof filter === 'undefined' || Object.keys(filter).length === 0 || filter === "") {
return dataArr;
}
this.resource.data = [];
dataArr.forEach(function (row) {
for (var /** @type {?} */ value in row) {
if (row.hasOwnProperty(value)) {
var /** @type {?} */ element = void 0;
if (typeof row[value] === "object") {
element = JSON.stringify(row[value]);
}
if (typeof row[value] === "boolean") {
element = "" + row[value];
}
if (typeof row[value] === "string") {
element = row[value].toLocaleLowerCase();
}
if (typeof row[value] === "number") {
element = "" + row[value];
}
if (element.indexOf(filter["value"].toLocaleLowerCase()) >= 0) {
_this.resource.data.push(row);
return;
}
}
}
});
return this.resource.data;
};
return GlobalSearchPipe;
}());
GlobalSearchPipe.decorators = [
{ type: Pipe, args: [{
name: 'global'
},] },
];
/**
* @nocollapse
*/
GlobalSearchPipe.ctorParameters = function () { return [
{ type: ResourceService, },
]; };
var TableModule = (function () {
function TableModule() {
}
return TableModule;
}());
TableModule.decorators = [
{ type: NgModule, args: [{
declarations: [
TableComponent,
GlobalSearch,
CsvExport,
Header,
Pagination,
SearchPipe,
PaginationPipe,
GlobalSearchPipe,
],
imports: [
BrowserModule,
HttpModule
],
exports: [TableComponent],
providers: [],
bootstrap: [TableComponent]
},] },
];
/**
* @nocollapse
*/
TableModule.ctorParameters = function () { return []; };
/**
* Generated bundle index. Do not edit.
*/
export { TableModule, TableComponent as ɵa, CsvExport as ɵg, GlobalSearch as ɵf, Header as ɵh, Pagination as ɵi, GlobalSearchPipe as ɵm, SearchPipe as ɵk, PaginationPipe as ɵl, ConfigService as ɵe, FiltersService as ɵc, HttpService as ɵb, PaginationService as ɵj, ResourceService as ɵd };
//# sourceMappingURL=ngx-easy-table.es5.js.map