ngx-easy-table
Version:
Angular easy table
794 lines (785 loc) • 32.8 kB
JavaScript
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/platform-browser'), require('@angular/core'), require('@angular/http'), require('rxjs/add/operator/map'), require('rxjs/Subject')) :
typeof define === 'function' && define.amd ? define(['exports', '@angular/platform-browser', '@angular/core', '@angular/http', 'rxjs/add/operator/map', 'rxjs/Subject'], factory) :
(factory((global['ngx-easy-table'] = {}),global.ng.platformBrowser,global.ng.core,global.ng.http,global.Rx.Observable.prototype,global.Rx));
}(this, (function (exports,platformBrowser,core,http,map,Subject) { 'use strict';
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: core.Injectable },
];
/**
* @nocollapse
*/
HttpService.ctorParameters = function () { return [
{ type: http.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: core.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 core.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: core.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: core.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 core.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: core.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: core.ChangeDetectorRef, },
]; };
TableComponent.propDecorators = {
'configuration': [{ type: core.Input },],
'event': [{ type: core.Output },],
'tpl': [{ type: core.ContentChild, args: [core.TemplateRef,] },],
};
var GlobalSearch = (function () {
function GlobalSearch() {
this.globalUpdate = new core.EventEmitter();
}
return GlobalSearch;
}());
GlobalSearch.decorators = [
{ type: core.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: core.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: core.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 core.EventEmitter();
}
/**
* @return {?}
*/
Header.prototype.ngOnInit = function () {
this.update.emit({});
};
return Header;
}());
Header.decorators = [
{ type: core.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: core.Input },],
'update': [{ type: core.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.Subject();
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: core.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 core.EventEmitter();
paginationService.updateRange$.subscribe(function (ev) {
_this.updateRange.emit(ev);
});
}
return Pagination;
}());
Pagination.decorators = [
{ type: core.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: core.Input },],
'updateRange': [{ type: core.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: core.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: core.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: core.Pipe, args: [{
name: 'global'
},] },
];
/**
* @nocollapse
*/
GlobalSearchPipe.ctorParameters = function () { return [
{ type: ResourceService, },
]; };
var TableModule = (function () {
function TableModule() {
}
return TableModule;
}());
TableModule.decorators = [
{ type: core.NgModule, args: [{
declarations: [
TableComponent,
GlobalSearch,
CsvExport,
Header,
Pagination,
SearchPipe,
PaginationPipe,
GlobalSearchPipe,
],
imports: [
platformBrowser.BrowserModule,
http.HttpModule
],
exports: [TableComponent],
providers: [],
bootstrap: [TableComponent]
},] },
];
/**
* @nocollapse
*/
TableModule.ctorParameters = function () { return []; };
exports.TableModule = TableModule;
exports.ɵa = TableComponent;
exports.ɵg = CsvExport;
exports.ɵf = GlobalSearch;
exports.ɵh = Header;
exports.ɵi = Pagination;
exports.ɵm = GlobalSearchPipe;
exports.ɵk = SearchPipe;
exports.ɵl = PaginationPipe;
exports.ɵe = ConfigService;
exports.ɵc = FiltersService;
exports.ɵb = HttpService;
exports.ɵj = PaginationService;
exports.ɵd = ResourceService;
Object.defineProperty(exports, '__esModule', { value: true });
})));
//# sourceMappingURL=ngx-easy-table.umd.js.map