@universis/ngx-tables 6.13.4 → 6.13.6
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.
- package/bundles/universis-ngx-tables.umd.js +88 -8
- package/bundles/universis-ngx-tables.umd.js.map +1 -1
- package/bundles/universis-ngx-tables.umd.min.js +1 -1
- package/bundles/universis-ngx-tables.umd.min.js.map +1 -1
- package/esm2015/lib/components/advanced-aggregator/advanced-aggregator.component.js +6 -3
- package/esm2015/lib/components/advanced-aggregator-list/advanced-aggregator-list.component.js +6 -3
- package/esm2015/lib/components/advanced-table/advanced-table.component.js +31 -4
- package/esm2015/lib/components/advanced-table/advanced-table.formatters.interface.js +6 -31
- package/esm2015/lib/components/advanced-table/custom-button.formatter.js +45 -0
- package/esm2015/universis-ngx-tables.js +5 -4
- package/esm5/lib/components/advanced-aggregator/advanced-aggregator.component.js +6 -3
- package/esm5/lib/components/advanced-aggregator-list/advanced-aggregator-list.component.js +6 -3
- package/esm5/lib/components/advanced-table/advanced-table.component.js +31 -4
- package/esm5/lib/components/advanced-table/advanced-table.formatters.interface.js +6 -31
- package/esm5/lib/components/advanced-table/custom-button.formatter.js +56 -0
- package/esm5/universis-ngx-tables.js +5 -4
- package/fesm2015/universis-ngx-tables.js +77 -7
- package/fesm2015/universis-ngx-tables.js.map +1 -1
- package/fesm5/universis-ngx-tables.js +87 -8
- package/fesm5/universis-ngx-tables.js.map +1 -1
- package/lib/components/advanced-aggregator/advanced-aggregator.component.d.ts +2 -1
- package/lib/components/advanced-aggregator-list/advanced-aggregator-list.component.d.ts +2 -1
- package/lib/components/advanced-table/advanced-table.component.d.ts +3 -2
- package/lib/components/advanced-table/advanced-table.formatters.interface.d.ts +5 -17
- package/lib/components/advanced-table/custom-button.formatter.d.ts +11 -0
- package/package.json +2 -2
- package/universis-ngx-tables.d.ts +5 -4
- package/universis-ngx-tables.metadata.json +1 -1
|
@@ -22,8 +22,8 @@ import { BsModalRef, BsModalService, ModalModule } from 'ngx-bootstrap/modal';
|
|
|
22
22
|
import { ProgressbarModule } from 'ngx-bootstrap/progressbar';
|
|
23
23
|
import { GroupByPipe, NgPipesModule } from 'ngx-pipes';
|
|
24
24
|
import { template, at, cloneDeep, isEmpty } from 'lodash';
|
|
25
|
-
import { __extends, __awaiter, __generator, __values,
|
|
26
|
-
import { Injectable, Directive, Optional, Input,
|
|
25
|
+
import { __extends, __awaiter, __generator, __values, __spread, __assign } from 'tslib';
|
|
26
|
+
import { Injectable, Directive, Optional, Input, Component, ElementRef, ViewChild, ViewEncapsulation, EventEmitter, Output, Pipe, NgModule, CUSTOM_ELEMENTS_SCHEMA, defineInjectable, inject, HostListener, ChangeDetectorRef, InjectionToken, Inject, Injector, ViewContainerRef, ChangeDetectionStrategy } from '@angular/core';
|
|
27
27
|
import { ActivatedRoute, Router, NavigationStart, NavigationEnd, RouterModule } from '@angular/router';
|
|
28
28
|
import { createFeatureSelector, createSelector, select, Store } from '@ngrx/store';
|
|
29
29
|
import { skip, first, filter } from 'rxjs/operators';
|
|
@@ -1860,6 +1860,7 @@ var AdvancedTableComponent = /** @class */ (function () {
|
|
|
1860
1860
|
this.height = 800;
|
|
1861
1861
|
this.showActions = true;
|
|
1862
1862
|
this.autoLoad = true;
|
|
1863
|
+
this.customEvent = new EventEmitter();
|
|
1863
1864
|
this.load = new EventEmitter();
|
|
1864
1865
|
this.init = new EventEmitter();
|
|
1865
1866
|
this.reload = new EventEmitter();
|
|
@@ -2522,7 +2523,7 @@ var AdvancedTableComponent = /** @class */ (function () {
|
|
|
2522
2523
|
function (cell, cellData, rowData, rowIndex, colIndex) {
|
|
2523
2524
|
items_1.forEach(function (columnFormatter) {
|
|
2524
2525
|
/** @type {?} */
|
|
2525
|
-
var formatter = self._columnFormatters[columnFormatter.formatter];
|
|
2526
|
+
var formatter = /** @type {?} */ ((self._columnFormatters[columnFormatter.formatter]));
|
|
2526
2527
|
if (formatter && typeof formatter.afterRender === 'function') {
|
|
2527
2528
|
formatter.afterRender.bind(column)(cell, cellData, rowData, rowIndex, colIndex);
|
|
2528
2529
|
}
|
|
@@ -2539,12 +2540,14 @@ var AdvancedTableComponent = /** @class */ (function () {
|
|
|
2539
2540
|
render: formatter.render.bind(column),
|
|
2540
2541
|
});
|
|
2541
2542
|
}
|
|
2542
|
-
|
|
2543
|
+
/** @type {?} */
|
|
2544
|
+
var afterRenderFormatter = /** @type {?} */ ((formatter));
|
|
2545
|
+
if (afterRenderFormatter && typeof afterRenderFormatter.afterRender === 'function') {
|
|
2543
2546
|
Object.assign(columnDefinition, {
|
|
2544
2547
|
render: formatter.render.bind(column),
|
|
2545
2548
|
});
|
|
2546
2549
|
Object.assign(columnDefinition, {
|
|
2547
|
-
createdCell:
|
|
2550
|
+
createdCell: afterRenderFormatter.afterRender.bind(column),
|
|
2548
2551
|
});
|
|
2549
2552
|
}
|
|
2550
2553
|
}
|
|
@@ -3109,6 +3112,9 @@ var AdvancedTableComponent = /** @class */ (function () {
|
|
|
3109
3112
|
});
|
|
3110
3113
|
}
|
|
3111
3114
|
if (this.selectable) ;
|
|
3115
|
+
if (this.dataTable) {
|
|
3116
|
+
this.dataTable.destroy();
|
|
3117
|
+
}
|
|
3112
3118
|
// handle init.dt event and emit local event
|
|
3113
3119
|
this.dataTable = tableElement_1.on('init.dt', function (event) {
|
|
3114
3120
|
/** @type {?} */
|
|
@@ -3154,6 +3160,24 @@ var AdvancedTableComponent = /** @class */ (function () {
|
|
|
3154
3160
|
infoSelector.classList.add('d-none');
|
|
3155
3161
|
}
|
|
3156
3162
|
}
|
|
3163
|
+
/** @type {?} */
|
|
3164
|
+
var onCustomEvent = function (event) {
|
|
3165
|
+
/** @type {?} */
|
|
3166
|
+
var target = /** @type {?} */ (event.currentTarget);
|
|
3167
|
+
/** @type {?} */
|
|
3168
|
+
var customEvent = target.dataset["event"] || 'event';
|
|
3169
|
+
/** @type {?} */
|
|
3170
|
+
var row = _this.dataTable.row(target.closest('tr'));
|
|
3171
|
+
/** @type {?} */
|
|
3172
|
+
var data = row.data();
|
|
3173
|
+
_this.customEvent.emit({
|
|
3174
|
+
name: customEvent,
|
|
3175
|
+
data: data,
|
|
3176
|
+
row: row.index()
|
|
3177
|
+
});
|
|
3178
|
+
};
|
|
3179
|
+
this.dataTable.off('click', '.dt-custom');
|
|
3180
|
+
this.dataTable.on('click', '.dt-custom', onCustomEvent);
|
|
3157
3181
|
// show or hide pager
|
|
3158
3182
|
if (this.showPaging) {
|
|
3159
3183
|
this.showPaging = true;
|
|
@@ -3771,6 +3795,7 @@ var AdvancedTableComponent = /** @class */ (function () {
|
|
|
3771
3795
|
height: [{ type: Input }],
|
|
3772
3796
|
showActions: [{ type: Input }],
|
|
3773
3797
|
autoLoad: [{ type: Input }],
|
|
3798
|
+
customEvent: [{ type: Output, args: ['customEvent',] }],
|
|
3774
3799
|
load: [{ type: Output, args: ['load',] }],
|
|
3775
3800
|
init: [{ type: Output, args: ['init',] }],
|
|
3776
3801
|
reload: [{ type: Input, args: ['reload',] }],
|
|
@@ -6139,6 +6164,57 @@ var AdvancedTableSearchComponent = /** @class */ (function (_super) {
|
|
|
6139
6164
|
return AdvancedTableSearchComponent;
|
|
6140
6165
|
}(AdvancedTableSearchBaseComponent));
|
|
6141
6166
|
|
|
6167
|
+
/**
|
|
6168
|
+
* @fileoverview added by tsickle
|
|
6169
|
+
* @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
|
|
6170
|
+
*/
|
|
6171
|
+
var CustomButtonFormatter = /** @class */ (function (_super) {
|
|
6172
|
+
__extends(CustomButtonFormatter, _super);
|
|
6173
|
+
function CustomButtonFormatter() {
|
|
6174
|
+
return _super.call(this) || this;
|
|
6175
|
+
}
|
|
6176
|
+
/**
|
|
6177
|
+
* @param {?} data
|
|
6178
|
+
* @param {?} type
|
|
6179
|
+
* @param {?} row
|
|
6180
|
+
* @param {?} meta
|
|
6181
|
+
* @return {?}
|
|
6182
|
+
*/
|
|
6183
|
+
CustomButtonFormatter.prototype.render = /**
|
|
6184
|
+
* @param {?} data
|
|
6185
|
+
* @param {?} type
|
|
6186
|
+
* @param {?} row
|
|
6187
|
+
* @param {?} meta
|
|
6188
|
+
* @return {?}
|
|
6189
|
+
*/
|
|
6190
|
+
function (data, type, row, meta) {
|
|
6191
|
+
if (data == null || this.injector == null) {
|
|
6192
|
+
return '';
|
|
6193
|
+
}
|
|
6194
|
+
/** @type {?} */
|
|
6195
|
+
var formatOptions = Object.assign({
|
|
6196
|
+
buttonClass: 'btn btn-default',
|
|
6197
|
+
}, this.formatOptions);
|
|
6198
|
+
/** @type {?} */
|
|
6199
|
+
var buttonText;
|
|
6200
|
+
/** @type {?} */
|
|
6201
|
+
var buttonTitle = '';
|
|
6202
|
+
if (formatOptions.buttonText) {
|
|
6203
|
+
buttonText = this.injector.get(TranslateService).instant(formatOptions.buttonText);
|
|
6204
|
+
}
|
|
6205
|
+
else {
|
|
6206
|
+
buttonText = formatOptions.buttonContent;
|
|
6207
|
+
}
|
|
6208
|
+
if (formatOptions.buttonTitle) {
|
|
6209
|
+
buttonTitle = this.injector.get(TranslateService).instant(formatOptions.buttonTitle);
|
|
6210
|
+
}
|
|
6211
|
+
/** @type {?} */
|
|
6212
|
+
var customEvent = formatOptions.event || 'event';
|
|
6213
|
+
return "<button style=\"cursor:pointer\" data-event=\"" + customEvent + "\" class=\"dt-custom " + formatOptions.buttonClass + "\" title=\"" + buttonTitle + "\">" + buttonText + "</button>";
|
|
6214
|
+
};
|
|
6215
|
+
return CustomButtonFormatter;
|
|
6216
|
+
}(ButtonFormatter));
|
|
6217
|
+
|
|
6142
6218
|
/**
|
|
6143
6219
|
* @fileoverview added by tsickle
|
|
6144
6220
|
* @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
|
|
@@ -6158,6 +6234,7 @@ var FORMATTERS = {
|
|
|
6158
6234
|
TrueFalseFormatter: new TrueFalseFormatter(),
|
|
6159
6235
|
ActionButtonFormatter: new ActionButtonFormatter(),
|
|
6160
6236
|
ActionSplitButtonFormatter: new ActionSplitButtonFormatter(),
|
|
6237
|
+
CustomButtonFormatter: new CustomButtonFormatter(),
|
|
6161
6238
|
};
|
|
6162
6239
|
|
|
6163
6240
|
/**
|
|
@@ -6858,7 +6935,7 @@ var AdvancedAggregatorComponent = /** @class */ (function () {
|
|
|
6858
6935
|
{ type: Component, args: [{
|
|
6859
6936
|
// tslint:disable-next-line:component-selector
|
|
6860
6937
|
selector: 'app-advanced-aggregator',
|
|
6861
|
-
template: "<ng-container *ngIf=\"config && body\">\n <div class=\"w-100 text-center\" *ngIf=\"body && body.length === 0\">\n <div>\n <div class=\"mt-4\">\n <div class=\"icon-circle bg-gray-300 border-gray-100\"></div>\n </div>\n <div class=\"mt-4\">\n <h4 class=\"font-3xl text-dark\" [translate]=\"'Tables.EmptyTableTitle'\"></h4>\n <p class=\"font-lg text-dark\" [translate]=\"'Tables.EmptyTableMessage'\"></p>\n </div>\n </div>\n </div>\n <ng-container *ngIf=\"groups.length === 0\">\n <div class=\"row mt-4\">\n <app-advanced-aggregator-list [body]=\"body\" [config]=\"config\" (clickEvent)=\"onActionEvent($event)\" class=\"col-12\">\n </app-advanced-aggregator-list>\n <div *ngIf=\"config.aggregators && config.aggregators.length > 0\"\n class=\"footer-text text-dark font-weight-normal text-right font-sm mt-3 mr-2 w-100\">\n <div *ngFor=\"let aggregator of config.aggregators\">\n <span *ngIf=\"aggregator.label\"> {{ aggregator.label | translate }} </span>:\n <span class=\"font-weight-bold\"> {{ body | callAggregator: aggregators: aggregator.name }}\n </span>\n </div>\n </div>\n </div>\n </ng-container>\n <ng-container *ngIf=\"groups.length === 1\">\n <ng-container *ngFor=\"let group of body | groupBy: groups[0].name | keyvalue\">\n <div class=\"row mt-4\">\n <h4 class=\"col text-secondary\"> {{ groups[0].title | aggregatorListTitle: group.key }} </h4>\n <app-advanced-aggregator-list [body]=\"group.value\" [config]=\"config\" (clickEvent)=\"onActionEvent($event)\"\n class=\"col-12\">\n </app-advanced-aggregator-list>\n </div>\n\n <!-- Footer for the group -->\n <div *ngIf=\"config.aggregators && config.aggregators.length > 0\"\n class=\"footer-text text-dark font-weight-normal text-right font-sm mt-3 mr-2 w-100\">\n <div *ngFor=\"let aggregator of config.aggregators\">\n <span *ngIf=\"aggregator.label\"> {{ aggregator.label | translate }} </span>:\n <span class=\"font-weight-bold\"> {{ group.value | callAggregator: aggregators: aggregator.name }} </span>\n </div>\n </div>\n </ng-container>\n </ng-container>\n <ng-container *ngIf=\"groups.length > 1\">\n <ng-container *ngFor=\"let group of body | groupBy: groups[0].name | keyvalue\">\n <div class=\"row mt-4\">\n <h4 class=\"col text-secondary\"> {{ groups[0].title | aggregatorListTitle: group.key }} </h4>\n <div *ngFor=\"let subgroup of group.value | groupBy: groups[1].name | keyvalue\" class=\"col-12 ml-4 pl-4\">\n <div class=\"row mt-4\">\n <h6 class=\"col-12 text-secondary\"> {{ groups[1].title | aggregatorListTitle: subgroup.key }} </h6>\n <app-advanced-aggregator-list [body]=\"subgroup.value\" [config]=\"config\" (clickEvent)=\"onActionEvent($event)\"\n class=\"col-12\">\n </app-advanced-aggregator-list>\n </div>\n\n <!-- Footer for each subgroup -->\n <div *ngIf=\"config.aggregators && config.aggregators.length > 0\"\n class=\"footer-text text-dark font-weight-normal text-right font-sm mt-3 mr-2 w-100\">\n <div *ngFor=\"let aggregator of config.aggregators\">\n <span *ngIf=\"aggregator.label\"> {{ aggregator.label | translate }} </span>:\n <span class=\"font-weight-bold\"> {{ subgroup.value | callAggregator: aggregators: aggregator.name }}\n </span>\n </div>\n </div>\n </div>\n </div>\n </ng-container>\n </ng-container>\n</ng-container>",
|
|
6938
|
+
template: "<ng-container *ngIf=\"config && body\">\n <div class=\"w-100 text-center\" *ngIf=\"body && body.length === 0\">\n <div>\n <div class=\"mt-4\">\n <div class=\"icon-circle bg-gray-300 border-gray-100\"></div>\n </div>\n <div class=\"mt-4\">\n <h4 class=\"font-3xl text-dark\" [translate]=\"'Tables.EmptyTableTitle'\"></h4>\n <p class=\"font-lg text-dark\" [translate]=\"'Tables.EmptyTableMessage'\"></p>\n </div>\n </div>\n </div>\n <ng-container *ngIf=\"groups.length === 0\">\n <div class=\"row mt-4\">\n <app-advanced-aggregator-list [detailTemplate]=\"detailTemplate\" [body]=\"body\" [config]=\"config\" (clickEvent)=\"onActionEvent($event)\" class=\"col-12\">\n </app-advanced-aggregator-list>\n <div *ngIf=\"config.aggregators && config.aggregators.length > 0\"\n class=\"footer-text text-dark font-weight-normal text-right font-sm mt-3 mr-2 w-100\">\n <div *ngFor=\"let aggregator of config.aggregators\">\n <span *ngIf=\"aggregator.label\"> {{ aggregator.label | translate }} </span>:\n <span class=\"font-weight-bold\"> {{ body | callAggregator: aggregators: aggregator.name }}\n </span>\n </div>\n </div>\n </div>\n </ng-container>\n <ng-container *ngIf=\"groups.length === 1\">\n <ng-container *ngFor=\"let group of body | groupBy: groups[0].name | keyvalue\">\n <div class=\"row mt-4\">\n <h4 class=\"col text-secondary\"> {{ groups[0].title | aggregatorListTitle: group.key }} </h4>\n <app-advanced-aggregator-list [detailTemplate]=\"detailTemplate\" [body]=\"group.value\" [config]=\"config\" (clickEvent)=\"onActionEvent($event)\"\n class=\"col-12\">\n </app-advanced-aggregator-list>\n </div>\n\n <!-- Footer for the group -->\n <div *ngIf=\"config.aggregators && config.aggregators.length > 0\"\n class=\"footer-text text-dark font-weight-normal text-right font-sm mt-3 mr-2 w-100\">\n <div *ngFor=\"let aggregator of config.aggregators\">\n <span *ngIf=\"aggregator.label\"> {{ aggregator.label | translate }} </span>:\n <span class=\"font-weight-bold\"> {{ group.value | callAggregator: aggregators: aggregator.name }} </span>\n </div>\n </div>\n </ng-container>\n </ng-container>\n <ng-container *ngIf=\"groups.length > 1\">\n <ng-container *ngFor=\"let group of body | groupBy: groups[0].name | keyvalue\">\n <div class=\"row mt-4\">\n <h4 class=\"col text-secondary\"> {{ groups[0].title | aggregatorListTitle: group.key }} </h4>\n <div *ngFor=\"let subgroup of group.value | groupBy: groups[1].name | keyvalue\" class=\"col-12 ml-4 pl-4\">\n <div class=\"row mt-4\">\n <h6 class=\"col-12 text-secondary\"> {{ groups[1].title | aggregatorListTitle: subgroup.key }} </h6>\n <app-advanced-aggregator-list [detailTemplate]=\"detailTemplate\" [body]=\"subgroup.value\" [config]=\"config\" (clickEvent)=\"onActionEvent($event)\"\n class=\"col-12\">\n </app-advanced-aggregator-list>\n </div>\n\n <!-- Footer for each subgroup -->\n <div *ngIf=\"config.aggregators && config.aggregators.length > 0\"\n class=\"footer-text text-dark font-weight-normal text-right font-sm mt-3 mr-2 w-100\">\n <div *ngFor=\"let aggregator of config.aggregators\">\n <span *ngIf=\"aggregator.label\"> {{ aggregator.label | translate }} </span>:\n <span class=\"font-weight-bold\"> {{ subgroup.value | callAggregator: aggregators: aggregator.name }}\n </span>\n </div>\n </div>\n </div>\n </div>\n </ng-container>\n </ng-container>\n</ng-container>",
|
|
6862
6939
|
changeDetection: ChangeDetectionStrategy.OnPush
|
|
6863
6940
|
}] }
|
|
6864
6941
|
];
|
|
@@ -6876,6 +6953,7 @@ var AdvancedAggregatorComponent = /** @class */ (function () {
|
|
|
6876
6953
|
selectedGroups$: [{ type: Input, args: ['selectedGroups',] }],
|
|
6877
6954
|
filters$: [{ type: Input, args: ['filters',] }],
|
|
6878
6955
|
searchExpression: [{ type: Input, args: ['searchExpression',] }],
|
|
6956
|
+
detailTemplate: [{ type: Input, args: ['detailTemplate',] }],
|
|
6879
6957
|
eventHandler: [{ type: Output }]
|
|
6880
6958
|
};
|
|
6881
6959
|
return AdvancedAggregatorComponent;
|
|
@@ -6945,7 +7023,7 @@ var AdvancedAggregatorListComponent = /** @class */ (function () {
|
|
|
6945
7023
|
{ type: Component, args: [{
|
|
6946
7024
|
// tslint:disable-next-line:component-selector
|
|
6947
7025
|
selector: 'app-advanced-aggregator-list',
|
|
6948
|
-
template: "<div id=\"group-list\" class=\"flex-column\" *ngIf=\"config && config.columns\">\n <ul class=\"sis--list-group sis--list-group-header\">\n <li class=\"sis--list-group-item text-wrap\">\n <div class=\"d-flex justify-content-center align-items-center\" *ngIf=\"body && body.length > 0\">\n <div *ngIf=\"config.actions && config.actions.length > 0\" class=\"sis--list-group-item_sm_column\"></div>\n <div *ngFor=\"let column of config.columns; let i = index\" class=\"text-left\" [class]=\"config.columns[i].length\"\n [translate]=\"config.columns[i].type === 'action' ? '' : column.title\" [ngClass]=\"{\n 'd-none': config.columns[i].hidden\n }\"></div>\n </div>\n </li>\n </ul>\n\n <!-- The list of entries -->\n <ul class=\"sis--list-group sis--list-group-body\" *ngIf=\"body && body.length > 0\">\n <li class=\"sis--list-group-item text-wrap\" *ngFor=\"let entry of body | orderBy: config.orderBy\">\n <div class=\"d-flex justify-content-center align-items-center list-color\">\n <!-- The list of actions -->\n <div *ngIf=\"config.actions && config.actions.length > 0\" class=\"sis--list-group-item_sm_column text-left pr-0\">\n <button *ngFor=\"let action of config.actions\" (click)=\"callCallback(action.identifier, entry)\"\n [title]=\"(action.title ? action.title : '') | translate \" class=\"btn btn-default px-0\">\n <i class=\"\" [class]=\"'fas text-indigo ml-2 ' + 'fa-' + action.icon\"></i>\n </button>\n <span class=\"px-0\">\n <i class=\"fa fa-fw\"> </i>\n </span>\n\n </div>\n <!-- The list of data -->\n <div *ngFor=\"let column of config.columns; let i=index\" [class]=\"config.columns[i].length\" class=\"text-left\"\n [ngClass]=\"{\n 'text-truncate': config.columns[i].hasOwnProperty('truncate') && config.columns[i].truncate,\n 'd-none': config.columns[i].hidden,\n 'd-md-block': !config.columns[i].hidden\n }\"\n [title]=\"config.columns[i].hasOwnProperty('truncate') && config.columns[i].truncate ? entry[column.name] : ''\">\n <span class=\"text-secondary\"\n *ngIf=\"!config.columns[i].hasOwnProperty('type') || (config.columns[i].hasOwnProperty('type') && config.columns[i].type === 'text')\"\n [ngClass]=\"{\n 'font-xs': config.columns[i].variant !== 'primary',\n 'text-body': config.columns[i].variant === 'primary',\n 'text-success': config.columns[i].variant === 'redGreen' && config.columns[i].hasOwnProperty('condition') && entry[config.columns[i].condition],\n 'text-danger': config.columns[i].variant === 'redGreen' && config.columns[i].hasOwnProperty('condition') && !entry[config.columns[i].condition],\n 'font-lg': config.columns[i].variant === 'redGreen' && entry[column.name] && entry[column.name].length > 3,\n 'font-2xl': config.columns[i].variant === 'redGreen' && entry[column.name] && entry[column.name].length <= 3\n }\">\n {{entry[column.name] || '-'}}\n </span>\n\n <span *ngIf=\"config.columns[i].type === 'boolean'\">\n <i class=\"fa font-lg\" [ngClass]=\"{\n 'fa-check text-success': !!entry[column.name],\n 'fa-times text-danger': !!entry[column.name] === false && config.columns[i].variant !== 'checkOrDash'\n }\"></i>\n <span\n *ngIf=\"entry[column.name].toString() !== config.columns[i].trueValue && config.columns[i].variant === 'checkOrDash'\"\n class=\"text-secondary font-xs\">-</span>\n </span>\n </div>\n </div>\n <div *ngIf=\"entry && entry.subitems\">\n <
|
|
7026
|
+
template: "<div id=\"group-list\" class=\"flex-column\" *ngIf=\"config && config.columns\">\n <ul class=\"sis--list-group sis--list-group-header\">\n <li class=\"sis--list-group-item text-wrap\">\n <div class=\"d-flex justify-content-center align-items-center\" *ngIf=\"body && body.length > 0\">\n <div *ngIf=\"config.actions && config.actions.length > 0\" class=\"sis--list-group-item_sm_column\"></div>\n <div *ngFor=\"let column of config.columns; let i = index\" class=\"text-left\" [class]=\"config.columns[i].length\"\n [translate]=\"config.columns[i].type === 'action' ? '' : column.title\" [ngClass]=\"{\n 'd-none': config.columns[i].hidden\n }\"></div>\n </div>\n </li>\n </ul>\n\n <!-- The list of entries -->\n <ul class=\"sis--list-group sis--list-group-body\" *ngIf=\"body && body.length > 0\">\n <li class=\"sis--list-group-item text-wrap\" *ngFor=\"let entry of body | orderBy: config.orderBy\">\n <div class=\"d-flex justify-content-center align-items-center list-color\">\n <!-- The list of actions -->\n <div *ngIf=\"config.actions && config.actions.length > 0\" class=\"sis--list-group-item_sm_column text-left pr-0\">\n <button *ngFor=\"let action of config.actions\" (click)=\"callCallback(action.identifier, entry)\"\n [title]=\"(action.title ? action.title : '') | translate \" class=\"btn btn-default px-0\">\n <i class=\"\" [class]=\"'fas text-indigo ml-2 ' + 'fa-' + action.icon\"></i>\n </button>\n <span class=\"px-0\">\n <i class=\"fa fa-fw\"> </i>\n </span>\n\n </div>\n <!-- The list of data -->\n <div *ngFor=\"let column of config.columns; let i=index\" [class]=\"config.columns[i].length\" class=\"text-left\"\n [ngClass]=\"{\n 'text-truncate': config.columns[i].hasOwnProperty('truncate') && config.columns[i].truncate,\n 'd-none': config.columns[i].hidden,\n 'd-md-block': !config.columns[i].hidden\n }\"\n [title]=\"config.columns[i].hasOwnProperty('truncate') && config.columns[i].truncate ? entry[column.name] : ''\">\n <span class=\"text-secondary\"\n *ngIf=\"!config.columns[i].hasOwnProperty('type') || (config.columns[i].hasOwnProperty('type') && config.columns[i].type === 'text')\"\n [ngClass]=\"{\n 'font-xs': config.columns[i].variant !== 'primary',\n 'text-body': config.columns[i].variant === 'primary',\n 'text-success': config.columns[i].variant === 'redGreen' && config.columns[i].hasOwnProperty('condition') && entry[config.columns[i].condition],\n 'text-danger': config.columns[i].variant === 'redGreen' && config.columns[i].hasOwnProperty('condition') && !entry[config.columns[i].condition],\n 'font-lg': config.columns[i].variant === 'redGreen' && entry[column.name] && entry[column.name].length > 3,\n 'font-2xl': config.columns[i].variant === 'redGreen' && entry[column.name] && entry[column.name].length <= 3\n }\">\n {{entry[column.name] || '-'}}\n </span>\n\n <span *ngIf=\"config.columns[i].type === 'boolean'\">\n <i class=\"fa font-lg\" [ngClass]=\"{\n 'fa-check text-success': !!entry[column.name],\n 'fa-times text-danger': !!entry[column.name] === false && config.columns[i].variant !== 'checkOrDash'\n }\"></i>\n <span\n *ngIf=\"entry[column.name].toString() !== config.columns[i].trueValue && config.columns[i].variant === 'checkOrDash'\"\n class=\"text-secondary font-xs\">-</span>\n </span>\n </div>\n </div>\n <ng-container *ngIf=\"detailTemplate\">\n <ng-container *ngTemplateOutlet=\"detailTemplate; context: { row: entry }\"></ng-container>\n </ng-container>\n <div *ngIf=\"entry && entry.subitems\">\n <ng-container *ngFor=\"let subitem of entry.subitems\">\n <div class=\"d-flex d-debug justify-content-center align-items-center list-color\">\n <div *ngIf=\"config.actions && config.actions.length > 0\" class=\"sis--list-group-item_sm_column text-left pr-0\">\n <span class=\"px-0\">\n <i class=\"fa fa-fw\"> </i>\n </span>\n <button *ngFor=\"let action of config.actions\" (click)=\"callCallback(action.identifier, subitem)\"\n [title]=\"(action.title ? action.title : '') | translate \" class=\"btn btn-default px-0\">\n <i *ngIf=\"action.type === 'edit'\" class=\"fas fa-edit text-indigo\"></i>\n </button>\n </div>\n <div class=\"text-left\"></div>\n <div *ngFor=\"let column of config.columns; let i=index\" [class]=\"config.columns[i].length\" class=\"text-left\"\n [ngClass]=\"{\n 'text-truncate': config.columns[i].hasOwnProperty('truncate') && config.columns[i].truncate,\n 'd-none': config.columns[i].hidden,\n 'd-md-block': !config.columns[i].hidden\n }\"\n [title]=\"config.columns[i].hasOwnProperty('truncate') && config.columns[i].truncate ? entry[column.name] : ''\">\n <span class=\"text-secondary\"\n *ngIf=\"!config.columns[i].hasOwnProperty('type') || (config.columns[i].hasOwnProperty('type') && config.columns[i].type === 'text')\"\n [ngClass]=\"{\n 'font-xs': config.columns[i].variant !== 'primary',\n 'text-body': config.columns[i].variant === 'primary',\n 'text-success': config.columns[i].variant === 'redGreen' && config.columns[i].hasOwnProperty('condition') && subitem[config.columns[i].condition],\n 'text-danger': config.columns[i].variant === 'redGreen' && config.columns[i].hasOwnProperty('condition') && !subitem[config.columns[i].condition],\n 'font-lg': config.columns[i].variant === 'redGreen' && subitem[column.name] && subitem[column.name].length > 3,\n 'font-2xl': config.columns[i].variant === 'redGreen' && subitem[column.name] && subitem[column.name].length <= 3\n }\">\n {{subitem[column.name] || '-'}}\n </span>\n <span *ngIf=\"config.columns[i].type === 'boolean'\">\n <i class=\"fa font-lg\" [ngClass]=\"{\n 'fa-check text-success': !!subitem[column.name],\n 'fa-times text-danger': !!subitem[column.name] === false && config.columns[i].variant !== 'checkOrDash'\n }\"></i>\n <span\n *ngIf=\"subitem[column.name].toString() !== config.columns[i].trueValue && config.columns[i].variant === 'checkOrDash'\"\n class=\"text-secondary font-xs\">-</span>\n </span>\n </div>\n </div>\n </ng-container>\n </div>\n </li>\n </ul>\n</div>"
|
|
6949
7027
|
}] }
|
|
6950
7028
|
];
|
|
6951
7029
|
/** @nocollapse */
|
|
@@ -6955,6 +7033,7 @@ var AdvancedAggregatorListComponent = /** @class */ (function () {
|
|
|
6955
7033
|
AdvancedAggregatorListComponent.propDecorators = {
|
|
6956
7034
|
config: [{ type: Input }],
|
|
6957
7035
|
body: [{ type: Input }],
|
|
7036
|
+
detailTemplate: [{ type: Input, args: ['detailTemplate',] }],
|
|
6958
7037
|
clickEvent: [{ type: Output }]
|
|
6959
7038
|
};
|
|
6960
7039
|
return AdvancedAggregatorListComponent;
|
|
@@ -8062,6 +8141,6 @@ var TablesModule = /** @class */ (function () {
|
|
|
8062
8141
|
* @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
|
|
8063
8142
|
*/
|
|
8064
8143
|
|
|
8065
|
-
export { AdvancedListComponent, AdvancedRowActionComponent, AdvancedSearchFormComponent, AdvancedSelectComponent, AdvancedSelectService, AdvancedTableConfigurationResolver, AdvancedSearchConfigurationResolver, AdvancedColumnFormatter, NestedPropertyFormatter, ButtonFormatter, LinkFormatter, ActionLinkFormatter, ActionButtonFormatter, ActionSplitButtonFormatter, SelectRowFormatter, TemplateFormatter, TrueFalseFormatter, TranslationFormatter, DateTimeFormatter, NgClassFormatter, LanguageFormatter, COLUMN_FORMATTERS, ExportLimitExceededError, AdvancedTableConfiguration, AdvancedTableComponent, AdvancedTableSettingsComponent, AdvancedTableSearchBaseComponent, AdvancedTableSearchComponent, FORMATTERS, AdvancedFilterValueProvider, AdvancedTableModalBaseTemplate, AdvancedTableModalBaseComponent, SimpleHeaderToolsComponent, TableSimpleHeaderComponent, AdvancedTableNotNullError, AdvancedTableEditorDirective, MAX_EXPORT_ITEMS, BtnExpDirective, AdvancedAggregatorComponent, AdvancedAggregatorListComponent, AddItemsComponent, AdvancedAggregatorPipe, ParseTitlePipe, AdvancedAggregatorService, TablesModule, ActivatedTableService, ColumnSelectorService, ColumnSelectorComponent, tableReducer, initialState, tableInitialState, tableReducers, featureName, getTablesState, selectTable,
|
|
8144
|
+
export { AdvancedListComponent, AdvancedRowActionComponent, AdvancedSearchFormComponent, AdvancedSelectComponent, AdvancedSelectService, AdvancedTableConfigurationResolver, AdvancedSearchConfigurationResolver, AdvancedColumnFormatter, NestedPropertyFormatter, ButtonFormatter, LinkFormatter, ActionLinkFormatter, ActionButtonFormatter, ActionSplitButtonFormatter, SelectRowFormatter, TemplateFormatter, TrueFalseFormatter, TranslationFormatter, DateTimeFormatter, NgClassFormatter, LanguageFormatter, COLUMN_FORMATTERS, ExportLimitExceededError, AdvancedTableConfiguration, AdvancedTableComponent, AdvancedTableSettingsComponent, AdvancedTableSearchBaseComponent, AdvancedTableSearchComponent, FORMATTERS, AdvancedFilterValueProvider, AdvancedTableModalBaseTemplate, AdvancedTableModalBaseComponent, SimpleHeaderToolsComponent, TableSimpleHeaderComponent, AdvancedTableNotNullError, AdvancedTableEditorDirective, MAX_EXPORT_ITEMS, BtnExpDirective, AdvancedAggregatorComponent, AdvancedAggregatorListComponent, AddItemsComponent, AdvancedAggregatorPipe, ParseTitlePipe, AdvancedAggregatorService, TablesModule, ActivatedTableService, ColumnSelectorService, ColumnSelectorComponent, tableReducer, initialState, tableInitialState, tableReducers, featureName, getTablesState, selectTable, CustomButtonFormatter as ɵa, AdvancedSearchState as ɵb, AdvancedTableState as ɵd, AdvancedSearchRouterState as ɵe };
|
|
8066
8145
|
|
|
8067
8146
|
//# sourceMappingURL=universis-ngx-tables.js.map
|