@agentsmith.bgd/as-lib-generic-table 22.0.8 → 22.0.9
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.
|
@@ -706,7 +706,7 @@ class AsLibGenericTableComponent {
|
|
|
706
706
|
.map(([k, v]) => `${k}-${v}`);
|
|
707
707
|
}
|
|
708
708
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: AsLibGenericTableComponent, deps: [{ token: LANG_TABLE, optional: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
709
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.2", type: AsLibGenericTableComponent, isStandalone: true, selector: "as-lib-generic-table", inputs: { loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, striped: { classPropertyName: "striped", publicName: "striped", isSignal: true, isRequired: false, transformFunction: null }, bordered: { classPropertyName: "bordered", publicName: "bordered", isSignal: true, isRequired: false, transformFunction: null }, hovered: { classPropertyName: "hovered", publicName: "hovered", isSignal: true, isRequired: false, transformFunction: null }, enableSearch: { classPropertyName: "enableSearch", publicName: "enableSearch", isSignal: true, isRequired: false, transformFunction: null }, rowCounter: { classPropertyName: "rowCounter", publicName: "rowCounter", isSignal: true, isRequired: false, transformFunction: null }, enableLog: { classPropertyName: "enableLog", publicName: "enableLog", isSignal: true, isRequired: false, transformFunction: null }, perPage: { classPropertyName: "perPage", publicName: "perPage", isSignal: true, isRequired: false, transformFunction: null }, tableHead: { classPropertyName: "tableHead", publicName: "tableHead", isSignal: true, isRequired: false, transformFunction: null }, tableData: { classPropertyName: "tableData", publicName: "tableData", isSignal: true, isRequired: false, transformFunction: null }, tableHeadStorage: { classPropertyName: "tableHeadStorage", publicName: "tableHeadStorage", isSignal: true, isRequired: false, transformFunction: null }, perPageValues: { classPropertyName: "perPageValues", publicName: "perPageValues", isSignal: true, isRequired: false, transformFunction: null }, headerActions: { classPropertyName: "headerActions", publicName: "headerActions", isSignal: true, isRequired: false, transformFunction: null }, rowActions: { classPropertyName: "rowActions", publicName: "rowActions", isSignal: true, isRequired: false, transformFunction: null }, tableStyle: { classPropertyName: "tableStyle", publicName: "tableStyle", isSignal: true, isRequired: false, transformFunction: null }, headStyle: { classPropertyName: "headStyle", publicName: "headStyle", isSignal: true, isRequired: false, transformFunction: null }, paginationAlignment: { classPropertyName: "paginationAlignment", publicName: "paginationAlignment", isSignal: true, isRequired: false, transformFunction: null }, totalItems: { classPropertyName: "totalItems", publicName: "totalItems", isSignal: true, isRequired: false, transformFunction: null }, page: { classPropertyName: "page", publicName: "page", isSignal: true, isRequired: false, transformFunction: null }, selectableKey: { classPropertyName: "selectableKey", publicName: "selectableKey", isSignal: true, isRequired: false, transformFunction: null }, selectableClass: { classPropertyName: "selectableClass", publicName: "selectableClass", isSignal: true, isRequired: false, transformFunction: null }, searchString: { classPropertyName: "searchString", publicName: "searchString", isSignal: true, isRequired: false, transformFunction: null }, sort: { classPropertyName: "sort", publicName: "sort", isSignal: true, isRequired: false, transformFunction: null }, order: { classPropertyName: "order", publicName: "order", isSignal: true, isRequired: false, transformFunction: null }, formSubmitLabel: { classPropertyName: "formSubmitLabel", publicName: "formSubmitLabel", isSignal: true, isRequired: false, transformFunction: null }, icons: { classPropertyName: "icons", publicName: "icons", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { filterParamsChanged: "filterParamsChanged", editRow: "editRow", sliderClicked: "sliderClicked", headerActionClicked: "headerActionClicked", rowActionClicked: "rowActionClicked", tableHeadChanged: "tableHeadChanged", pushedInputValues: "pushedInputValues" }, providers: [], ngImport: i0, template: "<div class=\"dynamic-table position-relative\">\n\t@if (loading()) {\n\t\t<div class=\"position-absolute text-center d-block w-100 opacity-100\">\n <div class=\"spinner-border\" role=\"status\">\n <span class=\"visually-hidden\">Loading...</span>\n </div>\n\t\t</div>\n\t}\n\t<div\n\t\tclass=\"row mb-3 mx-0\"\n\t\t[appUnwraptag]=\"(!perPageValues() || perPageValues().length < 2) && (!headerActions() || !headerActions().length) && !enableSearch()\"\n\t\t[ngClass]=\"{\n\t\t\tloading: loading(),\n\t\t}\"\n\t>\n\t\t<div\n\t\t\tclass=\"col-md-7 d-flex d-sm-flex d-md-block justify-content-center mb-2\"\n\t\t\t[appUnwraptag]=\"(!perPageValues() || perPageValues().length < 2) && (!headerActions() || !headerActions().length) && !enableSearch()\"\n\t\t>\n\t\t\t@if (perPageValues() && perPageValues().length > 1) {\n\t\t\t\t<div class=\"d-block d-md-inline-flex me-0 me-md-3\">\n\t\t\t\t\t<div class=\"table-length\">\n\t\t\t\t\t\t<label\n\t\t\t\t\t\t\t>{{ translate(\"SHOW\") }}\n\t\t\t\t\t\t\t<select\n\t\t\t\t\t\t\t\t(change)=\"changePerPage($event)\"\n\t\t\t\t\t\t\t\taria-controls=\"data-table-combine\"\n\t\t\t\t\t\t\t\tclass=\"form-select form-select-sm\"\n\t\t\t\t\t\t\t\tname=\"data-table-combine_length\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t@for (perp of perPageValues(); track perp) {\n\t\t\t\t\t\t\t\t\t<option [selected]=\"perPage() === perp\" value=\"{{ perp }}\">{{ perp }} </option>\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t</select>\n\t\t\t\t\t\t\t{{ translate(\"ENTRIES\") }}</label\n\t\t\t\t\t\t>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t}\n\t\t\t@if (headerActions() && headerActions().length) {\n\t\t\t\t<div\n\t\t\t\t\tclass=\"d-block d-inline-flex\"\n\t\t\t\t\t[ngClass]=\"{\n\t\t\t\t\t\t'mb-2': (!perPageValues() || perPageValues().length < 2) && !enableSearch(),\n\t\t\t\t\t}\"\n\t\t\t\t>\n\t\t\t\t\t<div class=\"dt-buttons btn-group flex-wrap\">\n\t\t\t\t\t\t@for (action of headerActions(); track action.actionName + $index) {\n\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t(click)=\"headerAction(action.actionName)\"\n\t\t\t\t\t\t\t\t[ngClass]=\"{ 'btn-secondary': !action.btnColor }\"\n\t\t\t\t\t\t\t\tclass=\"btn buttons-copy buttons-html5 btn-sm {{ action.actionName }} {{ action.btnColor }}\"\n\t\t\t\t\t\t\t\tid=\"header-action-{{ action.actionName }}\"\n\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t\t\t@if (action.faIcon) {\n\t\t\t\t\t\t\t\t\t\t<i class=\"fa {{ action.faIcon }}\"></i>\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t{{ action.label }}\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t}\n\t\t</div>\n\t\t@if (enableSearch()) {\n\t\t\t<div class=\"col-md-5 d-flex d-xl-block justify-content-center\">\n\t\t\t\t<div class=\"table-search\">\n\t\t\t\t\t<label>\n\t\t\t\t\t\t{{ translate(\"SEARCH\") }}:\n\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t(ngModelChange)=\"this.searchUpdate.next($event)\"\n\t\t\t\t\t\t\t[(ngModel)]=\"search\"\n\t\t\t\t\t\t\taria-controls=\"data-table-combine\"\n\t\t\t\t\t\t\tclass=\"form-control form-control-sm\"\n\t\t\t\t\t\t\tid=\"table-search\"\n\t\t\t\t\t\t\tplaceholder=\"\"\n\t\t\t\t\t\t\ttype=\"search\"\n\t\t\t\t\t/></label>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t}\n\t</div>\n\t<div\n\t\tclass=\"table-responsive\"\n\t\t[ngClass]=\"{\n\t\t\tloading: loading(),\n\t\t}\"\n\t>\n\t\t<table\n\t\t\t[ngClass]=\"{\n\t\t\t\t'table-striped': striped(),\n\t\t\t\t'table-bordered': bordered(),\n\t\t\t\t'table-hover': hovered(),\n\t\t\t}\"\n\t\t\tclass=\"table table-fixed align-middle {{ tableStyle() }} icons-{{ icons() }}\"\n\t\t>\n\t\t\t<thead [class]=\"headStyle()\">\n\t\t\t\t<tr>\n\t\t\t\t\t@if (rowCounter()) {\n\t\t\t\t\t\t<th class=\"text-end small-column\"> {{ translate(\"NR\") }}</th>\n\t\t\t\t\t}\n\t\t\t\t\t@for (head of tableHead(); track head.key) {\n\t\t\t\t\t\t@if (!head.hidden) {\n\t\t\t\t\t\t\t<th\n\t\t\t\t\t\t\t\t(click)=\"head.type !== 'checkbox' && !head.notSortable && tableSort(head.key)\"\n\t\t\t\t\t\t\t\t[ngClass]=\"head.sort\"\n\t\t\t\t\t\t\t\tclass=\"header {{ head.notSortable ? '' : 'sortable' }} {{ head.cellAlign }}\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t\t\t@if (head.type === \"checkbox\") {\n\t\t\t\t\t\t\t\t\t\t<input type=\"checkbox\" (change)=\"toggleAllCheckboxes($event, head.key)\" (click)=\"$event.stopPropagation()\" />\n\t\t\t\t\t\t\t\t\t} @else {\n\t\t\t\t\t\t\t\t\t\t<span [translate]=\"head.key.toUpperCase()\">{{ head.label || head.key }}</span>\n\t\t\t\t\t\t\t\t\t\t@if (!head.notSortable) {\n\t\t\t\t\t\t\t\t\t\t\t@if (icons() === 'fa') {\n\t\t\t\t\t\t\t\t\t\t\t\t@if (head.sort === 'headerSortDown') {\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"fa fa-sort-down\"></span>\n\t\t\t\t\t\t\t\t\t\t\t\t} @else if (head.sort === 'headerSortUp') {\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"fa fa-sort-up\"></span>\n\t\t\t\t\t\t\t\t\t\t\t\t} @else {\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"fa fa-sort\"></span>\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t} @else {\n\t\t\t\t\t\t\t\t\t\t\t\t@if (head.sort === 'headerSortDown') {\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"bi bi-arrow-down\"></span>\n\t\t\t\t\t\t\t\t\t\t\t\t} @else if (head.sort === 'headerSortUp') {\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"bi bi-arrow-up\"></span>\n\t\t\t\t\t\t\t\t\t\t\t\t} @else {\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"bi bi-arrow-down-up\"></span>\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</th>\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\t@if (tableHeadStorage() || (rowActions() && rowActions().length)) {\n\t\t\t\t\t\t<th class=\"header small-column text-center p-0\" data-width=\"50\">\n\t\t\t\t\t\t\t@if (tableHeadStorage()) {\n\t\t\t\t\t\t\t\t<a\n\t\t\t\t\t\t\t\t\t(click)=\"openTableLayoutModal()\"\n\t\t\t\t\t\t\t\t\taria-controls=\"basic-link-dropdown\"\n\t\t\t\t\t\t\t\t\tclass=\"menu-button toggle-white big-toggle dropdown-menu-link\"\n\t\t\t\t\t\t\t\t></a>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t</th>\n\t\t\t\t\t}\n\t\t\t\t</tr>\n\t\t\t</thead>\n\n\t\t\t@if (tableData().length) {\n\t\t\t\t<tbody>\n\t\t\t\t\t@for (row of tableData(); track row[\"id\"] || $index) {\n\t\t\t\t\t\t<tr\n\t\t\t\t\t\t\tclass=\"{{ row['rowClass'] || '' }}\"\n\t\t\t\t\t\t\t(click)=\"onRowClick(row, $event)\"\n\t\t\t\t\t\t\t[className]=\"selectableClickedValue === row[selectableKey()] ? selectableClass() : ''\"\n\t\t\t\t\t\t\t[attr.data-id]=\"row['id']\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t@if (rowCounter()) {\n\t\t\t\t\t\t\t\t<th class=\"text-end\"> {{ $index + counter }}.</th>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t@for (head of tableHead(); track head.key) {\n\t\t\t\t\t\t\t\t@if (!head.hidden) {\n\t\t\t\t\t\t\t\t\t<td [attr.data-column]=\"head.key\" class=\"header text-nowrap {{ head.cellAlign }}\">\n\t\t\t\t\t\t\t\t\t\t@if (head.type === \"checkbox\") {\n\t\t\t\t\t\t\t\t\t\t\t@if (row | visibleRowAction: head.visibilityFieldRule : enableLog()) {\n\t\t\t\t\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"select\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[(ngModel)]=\"row[head.key]\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tname=\"checkbox_{{ row['id'] }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tid=\"checkbox_{{ row['id'] }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t} @else if (head.visibilityFieldRule?.disabled) {\n\t\t\t\t\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"select\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[(ngModel)]=\"row[head.key]\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[disabled]=\"true\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tname=\"checkbox_{{ row['id'] }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t@if (!head.type) {\n\t\t\t\t\t\t\t\t\t\t\t{{ row[head.key] }}\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t@if (head.type === \"html\") {\n\t\t\t\t\t\t\t\t\t\t\t<span [innerHTML]=\"row[head.key] | safeLimitedHtml\"></span>\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t@if (head.type === \"badge\") {\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"badge {{ row[head.key + 'Badge'] }}\">{{ row[head.key] }}</span>\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t@if (head.type === \"date\") {\n\t\t\t\t\t\t\t\t\t\t\t{{ row[head.key] | date: (head.dateFormat ? head.dateFormat : \"dd.MM.yyyy\") }}\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t@if (head.type === \"datetime\") {\n\t\t\t\t\t\t\t\t\t\t\t{{ row[head.key] | date: (head.dateFormat ? head.dateFormat : \"dd.MM.yyyy HH:mm:ss\") }}\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t@if (head.type === \"image\") {\n\t\t\t\t\t\t\t\t\t\t\t@if (row[head.key] && row[head.key] !== \"\") {\n\t\t\t\t\t\t\t\t\t\t\t\t<img\n\t\t\t\t\t\t\t\t\t\t\t\t\talt=\"img\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[attr.src]=\"row[head.key]\"\n\t\t\t\t\t\t\t\t\t\t\t\t\twidth=\"{{ head?.imageSize?.width || 50 }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t\theight=\"{{ head?.imageSize?.height || 50 }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t@if (head.type === \"url\") {\n @if (row[head.key]) {\n <a\n [href]=\"row[head.key]\"\n [target]=\"head?.urlTarget || '_blank'\"\n [innerHTML]=\"head?.urlArea ? (head.urlArea || '' | safeLimitedHtml) : row[head.key]\">\n </a>\n } @else {\n {{ head?.urlMissing === undefined ? '-' : head.urlMissing }}\n }\n\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t@if (head.type === \"slider\") {\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"form-check form-switch\">\n\t\t\t\t\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\t\t\t\t\t(change)=\"sliderClicked.emit(row)\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[checked]=\"row[head.key]\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"switched\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tid=\"check-{{ row['id'] }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tvalue=\"true\"\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t<label for=\"check-{{ row['id'] }}\"></label>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t\t\t@if (head.type === \"input\") {\n\t\t\t\t\t\t\t\t\t\t\t<input [(ngModel)]=\"row[head.key]\" type=\"text\" name=\"input_{{ row['id'] }}\" />\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t</td>\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t@if (tableHeadStorage() || (rowActions() && rowActions().length)) {\n\t\t\t\t\t\t\t\t<td class=\"small-column\">\n\t\t\t\t\t\t\t\t\t<div class=\"menu text-end\">\n\t\t\t\t\t\t\t\t\t\t@for (action of rowActions(); track (action.label || \"\") + \"_\" + $index) {\n\t\t\t\t\t\t\t\t\t\t\t@if (row | visibleRowAction: action.visibilityRule : enableLog()) {\n\t\t\t\t\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\t\t\t\t\t(click)=\"rowAction(action.actionName, row, $event)\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[ngClass]=\"{ 'btn-secondary': !action.btnColor }\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"btn buttons-copy buttons-html5 btn-sm ms-2 {{ action.actionName }} {{ action.btnColor }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t\ttooltip=\"{{ action.label }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span><i class=\"fa {{ action.faIcon }}\"></i></span>\n\t\t\t\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t\t\t\t} @else if (action.visibilityRule?.disabled) {\n\t\t\t\t\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\t\t\t\t\t[disabled]=\"true\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[ngClass]=\"{ 'btn-secondary': !action.btnColor }\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"btn buttons-copy buttons-html5 btn-sm ms-2 {{ action.actionName }} {{ action.btnColor }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t\ttooltip=\"{{ action.label }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span><i class=\"fa {{ action.faIcon }}\"></i></span>\n\t\t\t\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</td>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t</tr>\n\t\t\t\t\t}\n\t\t\t\t\t@if (inputTypeKey || checkboxTypeKey) {\n\t\t\t\t\t\t<tr>\n\t\t\t\t\t\t\t<td\n\t\t\t\t\t\t\t\t[colSpan]=\"\n\t\t\t\t\t\t\t\t\ttableHead().length - 1 + (rowCounter() ? 1 : 0) + (tableHeadStorage() || (rowActions() && rowActions().length) ? 1 : 0)\n\t\t\t\t\t\t\t\t\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<button (click)=\"pushInputValues()\" class=\"btn buttons-copy buttons-html5 btn-sm ms-2 btn-secondary\">\n\t\t\t\t\t\t\t\t\t{{ translate(formSubmitLabel()) }}\n\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t</td>\n\t\t\t\t\t\t</tr>\n\t\t\t\t\t}\n\t\t\t\t</tbody>\n\t\t\t} @else {\n\t\t\t\t<tbody>\n\t\t\t\t\t<tr>\n\t\t\t\t\t\t<td\n\t\t\t\t\t\t\t[colSpan]=\"\n\t\t\t\t\t\t\t\ttableHead().length - 1 + (rowCounter() ? 1 : 0) + (tableHeadStorage() || (rowActions() && rowActions().length) ? 1 : 0)\n\t\t\t\t\t\t\t\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div class=\"alert alert-light\" role=\"alert\">\n @if (icons() === 'fa') {\n <i class=\"fa fa-exclamation-triangle\"></i>\n } @else {\n <i class=\"bi bi-exclamation-triangle\"></i>\n }\n {{ translate(\"NO_DATA_FOUND\") }}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</td>\n\t\t\t\t\t</tr>\n\t\t\t\t</tbody>\n\t\t\t}\n\t\t</table>\n\t</div>\n\t@if (totalPages > 1) {\n\t\t<as-lib-pagination\n\t\t\t(pageChange)=\"pageChange($event)\"\n\t\t\t[align]=\"paginationAlignment()\"\n\t\t\t[enableLog]=\"enableLog()\"\n\t\t\t[first]=\"page() === 0\"\n\t\t\t[last]=\"page() === totalPages - 1\"\n\t\t\t[page]=\"page()\"\n\t\t\t[totalPages]=\"totalPages\"\n\t\t></as-lib-pagination>\n\t}\n</div>\n", styles: [".dropdown-holder{min-height:20px}.dynamic-table,.dynamic-table button,span.badge{font-size:12px;font-weight:400}.table-length label{display:inline-block;white-space:nowrap}.table-length select{display:inline-block;width:auto}.table-search{text-align:right}.table-search label{display:inline-block;white-space:nowrap}.table-search input{display:inline-block;width:auto}th.sortable div{display:flex;align-items:center;cursor:pointer}th.sortable div span:not(.fa):not(.bi){flex:1}th.sortable div span.fa,th.sortable div span.bi{display:block}th.sortable span.fa,th.sortable span.bi{color:#348fe2;opacity:.25}th.sortable.headerSortDown span.fa,th.sortable.headerSortDown span.bi,th.sortable.headerSortUp span.fa,th.sortable.headerSortUp span.bi{opacity:1}.menu-button{border-radius:50%;width:24px;height:24px;display:inline-block;position:relative;cursor:pointer}.menu-button:after{content:\"\";background-image:radial-gradient(circle,black 2px,transparent 2px);background-size:100% 33.33%;width:18px;height:18px;display:block;top:3px;left:3px;position:absolute}.menu-button:hover{background:#4e4e4e26}.menu-button.menu-horizontal:after{background-size:33.33% 100%}.small-column{white-space:nowrap;width:1%}.loading{opacity:.3}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox]:not([ngNoCva])[formControlName],input[type=checkbox]:not([ngNoCva])[formControl],input[type=checkbox]:not([ngNoCva])[ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: TooltipDirective, selector: "[tooltip]", inputs: ["tooltip"] }, { kind: "component", type: AsLibPaginationComponent, selector: "as-lib-pagination", inputs: ["first", "last", "align", "enableLog", "totalPages", "page"], outputs: ["pageChange"] }, { kind: "directive", type: UnwrapTagDirective, selector: "[appUnwraptag]", inputs: ["appUnwraptag"] }, { kind: "pipe", type: i1$1.DatePipe, name: "date" }, { kind: "pipe", type: VisibleRowActionPipe, name: "visibleRowAction" }, { kind: "pipe", type: SafeLimitedHtmlPipe, name: "safeLimitedHtml" }] });
|
|
709
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.2", type: AsLibGenericTableComponent, isStandalone: true, selector: "as-lib-generic-table", inputs: { loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, striped: { classPropertyName: "striped", publicName: "striped", isSignal: true, isRequired: false, transformFunction: null }, bordered: { classPropertyName: "bordered", publicName: "bordered", isSignal: true, isRequired: false, transformFunction: null }, hovered: { classPropertyName: "hovered", publicName: "hovered", isSignal: true, isRequired: false, transformFunction: null }, enableSearch: { classPropertyName: "enableSearch", publicName: "enableSearch", isSignal: true, isRequired: false, transformFunction: null }, rowCounter: { classPropertyName: "rowCounter", publicName: "rowCounter", isSignal: true, isRequired: false, transformFunction: null }, enableLog: { classPropertyName: "enableLog", publicName: "enableLog", isSignal: true, isRequired: false, transformFunction: null }, perPage: { classPropertyName: "perPage", publicName: "perPage", isSignal: true, isRequired: false, transformFunction: null }, tableHead: { classPropertyName: "tableHead", publicName: "tableHead", isSignal: true, isRequired: false, transformFunction: null }, tableData: { classPropertyName: "tableData", publicName: "tableData", isSignal: true, isRequired: false, transformFunction: null }, tableHeadStorage: { classPropertyName: "tableHeadStorage", publicName: "tableHeadStorage", isSignal: true, isRequired: false, transformFunction: null }, perPageValues: { classPropertyName: "perPageValues", publicName: "perPageValues", isSignal: true, isRequired: false, transformFunction: null }, headerActions: { classPropertyName: "headerActions", publicName: "headerActions", isSignal: true, isRequired: false, transformFunction: null }, rowActions: { classPropertyName: "rowActions", publicName: "rowActions", isSignal: true, isRequired: false, transformFunction: null }, tableStyle: { classPropertyName: "tableStyle", publicName: "tableStyle", isSignal: true, isRequired: false, transformFunction: null }, headStyle: { classPropertyName: "headStyle", publicName: "headStyle", isSignal: true, isRequired: false, transformFunction: null }, paginationAlignment: { classPropertyName: "paginationAlignment", publicName: "paginationAlignment", isSignal: true, isRequired: false, transformFunction: null }, totalItems: { classPropertyName: "totalItems", publicName: "totalItems", isSignal: true, isRequired: false, transformFunction: null }, page: { classPropertyName: "page", publicName: "page", isSignal: true, isRequired: false, transformFunction: null }, selectableKey: { classPropertyName: "selectableKey", publicName: "selectableKey", isSignal: true, isRequired: false, transformFunction: null }, selectableClass: { classPropertyName: "selectableClass", publicName: "selectableClass", isSignal: true, isRequired: false, transformFunction: null }, searchString: { classPropertyName: "searchString", publicName: "searchString", isSignal: true, isRequired: false, transformFunction: null }, sort: { classPropertyName: "sort", publicName: "sort", isSignal: true, isRequired: false, transformFunction: null }, order: { classPropertyName: "order", publicName: "order", isSignal: true, isRequired: false, transformFunction: null }, formSubmitLabel: { classPropertyName: "formSubmitLabel", publicName: "formSubmitLabel", isSignal: true, isRequired: false, transformFunction: null }, icons: { classPropertyName: "icons", publicName: "icons", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { filterParamsChanged: "filterParamsChanged", editRow: "editRow", sliderClicked: "sliderClicked", headerActionClicked: "headerActionClicked", rowActionClicked: "rowActionClicked", tableHeadChanged: "tableHeadChanged", pushedInputValues: "pushedInputValues" }, providers: [], ngImport: i0, template: "<div class=\"dynamic-table position-relative\">\n\t@if (loading()) {\n\t\t<div class=\"position-absolute text-center d-block w-100 opacity-100\">\n <div class=\"spinner-border\" role=\"status\">\n <span class=\"visually-hidden\">Loading...</span>\n </div>\n\t\t</div>\n\t}\n\t<div\n\t\tclass=\"row mb-3 mx-0\"\n\t\t[appUnwraptag]=\"(!perPageValues() || perPageValues().length < 2) && (!headerActions() || !headerActions().length) && !enableSearch()\"\n\t\t[ngClass]=\"{\n\t\t\tloading: loading(),\n\t\t}\"\n\t>\n\t\t<div\n\t\t\tclass=\"col-md-7 d-flex d-sm-flex d-md-block justify-content-center mb-2\"\n\t\t\t[appUnwraptag]=\"(!perPageValues() || perPageValues().length < 2) && (!headerActions() || !headerActions().length) && !enableSearch()\"\n\t\t>\n\t\t\t@if (perPageValues() && perPageValues().length > 1) {\n\t\t\t\t<div class=\"d-block d-md-inline-flex me-0 me-md-3\">\n\t\t\t\t\t<div class=\"table-length\">\n\t\t\t\t\t\t<label\n\t\t\t\t\t\t\t>{{ translate(\"SHOW\") }}\n\t\t\t\t\t\t\t<select\n\t\t\t\t\t\t\t\t(change)=\"changePerPage($event)\"\n\t\t\t\t\t\t\t\taria-controls=\"data-table-combine\"\n\t\t\t\t\t\t\t\tclass=\"form-select form-select-sm\"\n\t\t\t\t\t\t\t\tname=\"data-table-combine_length\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t@for (perp of perPageValues(); track perp) {\n\t\t\t\t\t\t\t\t\t<option [selected]=\"perPage() === perp\" value=\"{{ perp }}\">{{ perp }} </option>\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t</select>\n\t\t\t\t\t\t\t{{ translate(\"ENTRIES\") }}</label\n\t\t\t\t\t\t>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t}\n\t\t\t@if (headerActions() && headerActions().length) {\n\t\t\t\t<div\n\t\t\t\t\tclass=\"d-block d-inline-flex\"\n\t\t\t\t\t[ngClass]=\"{\n\t\t\t\t\t\t'mb-2': (!perPageValues() || perPageValues().length < 2) && !enableSearch(),\n\t\t\t\t\t}\"\n\t\t\t\t>\n\t\t\t\t\t<div class=\"dt-buttons btn-group flex-wrap\">\n\t\t\t\t\t\t@for (action of headerActions(); track action.actionName + $index) {\n\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t(click)=\"headerAction(action.actionName)\"\n\t\t\t\t\t\t\t\t[ngClass]=\"{ 'btn-secondary': !action.btnColor }\"\n\t\t\t\t\t\t\t\tclass=\"btn buttons-copy buttons-html5 btn-sm {{ action.actionName }} {{ action.btnColor }}\"\n\t\t\t\t\t\t\t\tid=\"header-action-{{ action.actionName }}\"\n\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t\t\t@if (action.faIcon) {\n\t\t\t\t\t\t\t\t\t\t<i class=\"fa {{ action.faIcon }}\"></i>\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t{{ action.label }}\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t}\n\t\t</div>\n\t\t@if (enableSearch()) {\n\t\t\t<div class=\"col-md-5 d-flex d-xl-block justify-content-center\">\n\t\t\t\t<div class=\"table-search\">\n\t\t\t\t\t<label>\n\t\t\t\t\t\t{{ translate(\"SEARCH\") }}:\n\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t(ngModelChange)=\"this.searchUpdate.next($event)\"\n\t\t\t\t\t\t\t[(ngModel)]=\"search\"\n\t\t\t\t\t\t\taria-controls=\"data-table-combine\"\n\t\t\t\t\t\t\tclass=\"form-control form-control-sm\"\n\t\t\t\t\t\t\tid=\"table-search\"\n\t\t\t\t\t\t\tplaceholder=\"\"\n\t\t\t\t\t\t\ttype=\"search\"\n\t\t\t\t\t/></label>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t}\n\t</div>\n\t<div\n\t\tclass=\"table-responsive\"\n\t\t[ngClass]=\"{\n\t\t\tloading: loading(),\n\t\t}\"\n\t>\n\t\t<table\n\t\t\t[ngClass]=\"{\n\t\t\t\t'table-striped': striped(),\n\t\t\t\t'table-bordered': bordered(),\n\t\t\t\t'table-hover': hovered(),\n\t\t\t}\"\n\t\t\tclass=\"table table-fixed align-middle {{ tableStyle() }} icons-{{ icons() }}\"\n\t\t>\n\t\t\t<thead [class]=\"headStyle()\">\n\t\t\t\t<tr>\n\t\t\t\t\t@if (rowCounter()) {\n\t\t\t\t\t\t<th class=\"text-end small-column\"> {{ translate(\"NR\") }}</th>\n\t\t\t\t\t}\n\t\t\t\t\t@for (head of tableHead(); track head.key) {\n\t\t\t\t\t\t@if (!head.hidden) {\n\t\t\t\t\t\t\t<th\n\t\t\t\t\t\t\t\t(click)=\"head.type !== 'checkbox' && !head.notSortable && tableSort(head.key)\"\n\t\t\t\t\t\t\t\t[ngClass]=\"head.sort\"\n\t\t\t\t\t\t\t\tclass=\"header {{ head.notSortable ? '' : 'sortable' }} {{ head.cellAlign }}\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t\t\t@if (head.type === \"checkbox\") {\n\t\t\t\t\t\t\t\t\t\t<input type=\"checkbox\" (change)=\"toggleAllCheckboxes($event, head.key)\" (click)=\"$event.stopPropagation()\" />\n\t\t\t\t\t\t\t\t\t} @else {\n\t\t\t\t\t\t\t\t\t\t<span [translate]=\"head.key.toUpperCase()\">{{ head.label || head.key }}</span>\n\t\t\t\t\t\t\t\t\t\t@if (!head.notSortable) {\n\t\t\t\t\t\t\t\t\t\t\t@if (icons() === 'fa') {\n\t\t\t\t\t\t\t\t\t\t\t\t@if (head.sort === 'headerSortDown') {\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"fa fa-sort-down\"></span>\n\t\t\t\t\t\t\t\t\t\t\t\t} @else if (head.sort === 'headerSortUp') {\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"fa fa-sort-up\"></span>\n\t\t\t\t\t\t\t\t\t\t\t\t} @else {\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"fa fa-sort\"></span>\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t} @else {\n\t\t\t\t\t\t\t\t\t\t\t\t@if (head.sort === 'headerSortDown') {\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"bi bi-arrow-down\"></span>\n\t\t\t\t\t\t\t\t\t\t\t\t} @else if (head.sort === 'headerSortUp') {\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"bi bi-arrow-up\"></span>\n\t\t\t\t\t\t\t\t\t\t\t\t} @else {\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"bi bi-arrow-down-up\"></span>\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</th>\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\t@if (tableHeadStorage() || (rowActions() && rowActions().length)) {\n\t\t\t\t\t\t<th class=\"header small-column text-center p-0\" data-width=\"50\">\n\t\t\t\t\t\t\t@if (tableHeadStorage()) {\n\t\t\t\t\t\t\t\t<a\n\t\t\t\t\t\t\t\t\t(click)=\"openTableLayoutModal()\"\n\t\t\t\t\t\t\t\t\taria-controls=\"basic-link-dropdown\"\n\t\t\t\t\t\t\t\t\tclass=\"menu-button toggle-white big-toggle dropdown-menu-link\"\n\t\t\t\t\t\t\t\t></a>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t</th>\n\t\t\t\t\t}\n\t\t\t\t</tr>\n\t\t\t</thead>\n\n\t\t\t@if (tableData().length) {\n\t\t\t\t<tbody>\n\t\t\t\t\t@for (row of tableData(); track row[\"id\"] || $index) {\n\t\t\t\t\t\t<tr\n\t\t\t\t\t\t\tclass=\"{{ row['rowClass'] || '' }}\"\n\t\t\t\t\t\t\t(click)=\"onRowClick(row, $event)\"\n\t\t\t\t\t\t\t[className]=\"selectableClickedValue === row[selectableKey()] ? selectableClass() : ''\"\n\t\t\t\t\t\t\t[attr.data-id]=\"row['id']\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t@if (rowCounter()) {\n\t\t\t\t\t\t\t\t<th class=\"text-end\"> {{ $index + counter }}.</th>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t@for (head of tableHead(); track head.key) {\n\t\t\t\t\t\t\t\t@if (!head.hidden) {\n\t\t\t\t\t\t\t\t\t<td [attr.data-column]=\"head.key\" class=\"header text-nowrap {{ head.cellAlign }}\">\n\t\t\t\t\t\t\t\t\t\t@if (head.type === \"checkbox\") {\n\t\t\t\t\t\t\t\t\t\t\t@if (row | visibleRowAction: head.visibilityFieldRule : enableLog()) {\n\t\t\t\t\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"select\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[(ngModel)]=\"row[head.key]\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tname=\"checkbox_{{ row['id'] }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tid=\"checkbox_{{ row['id'] }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t} @else if (head.visibilityFieldRule?.disabled) {\n\t\t\t\t\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"select\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[(ngModel)]=\"row[head.key]\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[disabled]=\"true\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tname=\"checkbox_{{ row['id'] }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t@if (!head.type) {\n\t\t\t\t\t\t\t\t\t\t\t{{ row[head.key] }}\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t@if (head.type === \"html\") {\n\t\t\t\t\t\t\t\t\t\t\t<span [innerHTML]=\"row[head.key] | safeLimitedHtml\"></span>\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t@if (head.type === \"badge\") {\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"badge {{ row[head.key + 'Badge'] }}\">{{ row[head.key] }}</span>\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t@if (head.type === \"date\") {\n\t\t\t\t\t\t\t\t\t\t\t{{ row[head.key] | date: (head.dateFormat ? head.dateFormat : \"dd.MM.yyyy\") }}\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t@if (head.type === \"datetime\") {\n\t\t\t\t\t\t\t\t\t\t\t{{ row[head.key] | date: (head.dateFormat ? head.dateFormat : \"dd.MM.yyyy HH:mm:ss\") }}\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t@if (head.type === \"image\") {\n\t\t\t\t\t\t\t\t\t\t\t@if (row[head.key] && row[head.key] !== \"\") {\n\t\t\t\t\t\t\t\t\t\t\t\t<img\n\t\t\t\t\t\t\t\t\t\t\t\t\talt=\"img\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[attr.src]=\"row[head.key]\"\n\t\t\t\t\t\t\t\t\t\t\t\t\twidth=\"{{ head?.imageSize?.width || 50 }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t\theight=\"{{ head?.imageSize?.height || 50 }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t@if (head.type === \"url\") {\n @if (row[head.key]) {\n <a\n [href]=\"row[head.key]\"\n [target]=\"head?.urlTarget || '_blank'\"\n [innerHTML]=\"head?.urlArea ? (head.urlArea || '' | safeLimitedHtml) : row[head.key]\">\n </a>\n } @else {\n {{ head?.urlMissing === undefined ? '-' : head.urlMissing }}\n }\n\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t@if (head.type === \"slider\") {\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"form-check form-switch\">\n\t\t\t\t\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\t\t\t\t\t(change)=\"sliderClicked.emit(row)\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[checked]=\"row[head.key]\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"switched\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tid=\"check-{{ row['id'] }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tvalue=\"true\"\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t<label for=\"check-{{ row['id'] }}\"></label>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t\t\t@if (head.type === \"input\") {\n\t\t\t\t\t\t\t\t\t\t\t<input [(ngModel)]=\"row[head.key]\" type=\"text\" name=\"input_{{ row['id'] }}\" />\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t</td>\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t@if (tableHeadStorage() || (rowActions() && rowActions().length)) {\n\t\t\t\t\t\t\t\t<td class=\"small-column\">\n\t\t\t\t\t\t\t\t\t<div class=\"menu text-end\">\n\t\t\t\t\t\t\t\t\t\t@for (action of rowActions(); track (action.label || \"\") + \"_\" + $index) {\n\t\t\t\t\t\t\t\t\t\t\t@if (row | visibleRowAction: action.visibilityRule : enableLog()) {\n\t\t\t\t\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\t\t\t\t\t(click)=\"rowAction(action.actionName, row, $event)\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[ngClass]=\"{ 'btn-secondary': !action.btnColor }\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"btn buttons-copy buttons-html5 btn-sm ms-2 {{ action.actionName }} {{ action.btnColor }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t\ttooltip=\"{{ action.label }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span><i class=\"fa {{ action.faIcon }}\"></i></span>\n\t\t\t\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t\t\t\t} @else if (action.visibilityRule?.disabled) {\n\t\t\t\t\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\t\t\t\t\t[disabled]=\"true\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[ngClass]=\"{ 'btn-secondary': !action.btnColor }\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"btn buttons-copy buttons-html5 btn-sm ms-2 {{ action.actionName }} {{ action.btnColor }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t\ttooltip=\"{{ action.label }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span><i class=\"fa {{ action.faIcon }}\"></i></span>\n\t\t\t\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</td>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t</tr>\n\t\t\t\t\t}\n\t\t\t\t\t@if (inputTypeKey || checkboxTypeKey) {\n\t\t\t\t\t\t<tr>\n\t\t\t\t\t\t\t<td\n\t\t\t\t\t\t\t\t[colSpan]=\"\n\t\t\t\t\t\t\t\t\ttableHead().length - 1 + (rowCounter() ? 1 : 0) + (tableHeadStorage() || (rowActions() && rowActions().length) ? 1 : 0)\n\t\t\t\t\t\t\t\t\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<button (click)=\"pushInputValues()\" class=\"btn buttons-copy buttons-html5 btn-sm ms-2 btn-secondary\">\n\t\t\t\t\t\t\t\t\t{{ translate(formSubmitLabel()) }}\n\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t</td>\n\t\t\t\t\t\t</tr>\n\t\t\t\t\t}\n\t\t\t\t</tbody>\n\t\t\t} @else {\n\t\t\t\t<tbody>\n\t\t\t\t\t<tr>\n\t\t\t\t\t\t<td\n\t\t\t\t\t\t\t[colSpan]=\"\n\t\t\t\t\t\t\t\ttableHead().length - 1 + (rowCounter() ? 1 : 0) + (tableHeadStorage() || (rowActions() && rowActions().length) ? 1 : 0)\n\t\t\t\t\t\t\t\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div class=\"alert alert-light\" role=\"alert\">\n @if (icons() === 'fa') {\n <i class=\"fa fa-exclamation-triangle\"></i>\n } @else {\n <i class=\"bi bi-exclamation-triangle\"></i>\n }\n {{ translate(\"NO_DATA_FOUND\") }}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</td>\n\t\t\t\t\t</tr>\n\t\t\t\t</tbody>\n\t\t\t}\n\t\t</table>\n\t</div>\n\t@if (totalPages > 1) {\n\t\t<as-lib-pagination\n\t\t\t(pageChange)=\"pageChange($event)\"\n\t\t\t[align]=\"paginationAlignment()\"\n\t\t\t[enableLog]=\"enableLog()\"\n\t\t\t[first]=\"page() === 0\"\n\t\t\t[last]=\"page() === totalPages - 1\"\n\t\t\t[page]=\"page()\"\n\t\t\t[totalPages]=\"totalPages\"\n\t\t></as-lib-pagination>\n\t}\n</div>\n", styles: [".dropdown-holder{min-height:20px}.dynamic-table,.dynamic-table button,span.badge{font-size:12px;font-weight:400}.table-length label{display:inline-block;white-space:nowrap}.table-length select{display:inline-block;width:auto}.table-search{text-align:right}.table-search label{display:inline-block;white-space:nowrap}.table-search input{display:inline-block;width:auto}th.sortable div{display:flex;align-items:center;cursor:pointer}th.sortable div span:not(.fa):not(.bi){flex:1}th.sortable div span.fa,th.sortable div span.bi{display:block}th.sortable span.fa,th.sortable span.bi{color:#348fe2;opacity:.75}th.sortable.headerSortDown span.fa,th.sortable.headerSortDown span.bi,th.sortable.headerSortUp span.fa,th.sortable.headerSortUp span.bi{opacity:1}.menu-button{border-radius:50%;width:24px;height:24px;display:inline-block;position:relative;cursor:pointer}.menu-button:after{content:\"\";background-image:radial-gradient(circle,black 2px,transparent 2px);background-size:100% 33.33%;width:18px;height:18px;display:block;top:3px;left:3px;position:absolute}.menu-button:hover{background:#4e4e4e26}.menu-button.menu-horizontal:after{background-size:33.33% 100%}.small-column{white-space:nowrap;width:1%}.loading{opacity:.3}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox]):not([ngNoCva])[formControlName],textarea:not([ngNoCva])[formControlName],input:not([type=checkbox]):not([ngNoCva])[formControl],textarea:not([ngNoCva])[formControl],input:not([type=checkbox]):not([ngNoCva])[ngModel],textarea:not([ngNoCva])[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox]:not([ngNoCva])[formControlName],input[type=checkbox]:not([ngNoCva])[formControl],input[type=checkbox]:not([ngNoCva])[ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: TooltipDirective, selector: "[tooltip]", inputs: ["tooltip"] }, { kind: "component", type: AsLibPaginationComponent, selector: "as-lib-pagination", inputs: ["first", "last", "align", "enableLog", "totalPages", "page"], outputs: ["pageChange"] }, { kind: "directive", type: UnwrapTagDirective, selector: "[appUnwraptag]", inputs: ["appUnwraptag"] }, { kind: "pipe", type: i1$1.DatePipe, name: "date" }, { kind: "pipe", type: VisibleRowActionPipe, name: "visibleRowAction" }, { kind: "pipe", type: SafeLimitedHtmlPipe, name: "safeLimitedHtml" }] });
|
|
710
710
|
}
|
|
711
711
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImport: i0, type: AsLibGenericTableComponent, decorators: [{
|
|
712
712
|
type: Component,
|
|
@@ -718,7 +718,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.2", ngImpor
|
|
|
718
718
|
VisibleRowActionPipe,
|
|
719
719
|
SafeLimitedHtmlPipe,
|
|
720
720
|
UnwrapTagDirective,
|
|
721
|
-
], providers: [], standalone: true, template: "<div class=\"dynamic-table position-relative\">\n\t@if (loading()) {\n\t\t<div class=\"position-absolute text-center d-block w-100 opacity-100\">\n <div class=\"spinner-border\" role=\"status\">\n <span class=\"visually-hidden\">Loading...</span>\n </div>\n\t\t</div>\n\t}\n\t<div\n\t\tclass=\"row mb-3 mx-0\"\n\t\t[appUnwraptag]=\"(!perPageValues() || perPageValues().length < 2) && (!headerActions() || !headerActions().length) && !enableSearch()\"\n\t\t[ngClass]=\"{\n\t\t\tloading: loading(),\n\t\t}\"\n\t>\n\t\t<div\n\t\t\tclass=\"col-md-7 d-flex d-sm-flex d-md-block justify-content-center mb-2\"\n\t\t\t[appUnwraptag]=\"(!perPageValues() || perPageValues().length < 2) && (!headerActions() || !headerActions().length) && !enableSearch()\"\n\t\t>\n\t\t\t@if (perPageValues() && perPageValues().length > 1) {\n\t\t\t\t<div class=\"d-block d-md-inline-flex me-0 me-md-3\">\n\t\t\t\t\t<div class=\"table-length\">\n\t\t\t\t\t\t<label\n\t\t\t\t\t\t\t>{{ translate(\"SHOW\") }}\n\t\t\t\t\t\t\t<select\n\t\t\t\t\t\t\t\t(change)=\"changePerPage($event)\"\n\t\t\t\t\t\t\t\taria-controls=\"data-table-combine\"\n\t\t\t\t\t\t\t\tclass=\"form-select form-select-sm\"\n\t\t\t\t\t\t\t\tname=\"data-table-combine_length\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t@for (perp of perPageValues(); track perp) {\n\t\t\t\t\t\t\t\t\t<option [selected]=\"perPage() === perp\" value=\"{{ perp }}\">{{ perp }} </option>\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t</select>\n\t\t\t\t\t\t\t{{ translate(\"ENTRIES\") }}</label\n\t\t\t\t\t\t>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t}\n\t\t\t@if (headerActions() && headerActions().length) {\n\t\t\t\t<div\n\t\t\t\t\tclass=\"d-block d-inline-flex\"\n\t\t\t\t\t[ngClass]=\"{\n\t\t\t\t\t\t'mb-2': (!perPageValues() || perPageValues().length < 2) && !enableSearch(),\n\t\t\t\t\t}\"\n\t\t\t\t>\n\t\t\t\t\t<div class=\"dt-buttons btn-group flex-wrap\">\n\t\t\t\t\t\t@for (action of headerActions(); track action.actionName + $index) {\n\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t(click)=\"headerAction(action.actionName)\"\n\t\t\t\t\t\t\t\t[ngClass]=\"{ 'btn-secondary': !action.btnColor }\"\n\t\t\t\t\t\t\t\tclass=\"btn buttons-copy buttons-html5 btn-sm {{ action.actionName }} {{ action.btnColor }}\"\n\t\t\t\t\t\t\t\tid=\"header-action-{{ action.actionName }}\"\n\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t\t\t@if (action.faIcon) {\n\t\t\t\t\t\t\t\t\t\t<i class=\"fa {{ action.faIcon }}\"></i>\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t{{ action.label }}\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t}\n\t\t</div>\n\t\t@if (enableSearch()) {\n\t\t\t<div class=\"col-md-5 d-flex d-xl-block justify-content-center\">\n\t\t\t\t<div class=\"table-search\">\n\t\t\t\t\t<label>\n\t\t\t\t\t\t{{ translate(\"SEARCH\") }}:\n\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t(ngModelChange)=\"this.searchUpdate.next($event)\"\n\t\t\t\t\t\t\t[(ngModel)]=\"search\"\n\t\t\t\t\t\t\taria-controls=\"data-table-combine\"\n\t\t\t\t\t\t\tclass=\"form-control form-control-sm\"\n\t\t\t\t\t\t\tid=\"table-search\"\n\t\t\t\t\t\t\tplaceholder=\"\"\n\t\t\t\t\t\t\ttype=\"search\"\n\t\t\t\t\t/></label>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t}\n\t</div>\n\t<div\n\t\tclass=\"table-responsive\"\n\t\t[ngClass]=\"{\n\t\t\tloading: loading(),\n\t\t}\"\n\t>\n\t\t<table\n\t\t\t[ngClass]=\"{\n\t\t\t\t'table-striped': striped(),\n\t\t\t\t'table-bordered': bordered(),\n\t\t\t\t'table-hover': hovered(),\n\t\t\t}\"\n\t\t\tclass=\"table table-fixed align-middle {{ tableStyle() }} icons-{{ icons() }}\"\n\t\t>\n\t\t\t<thead [class]=\"headStyle()\">\n\t\t\t\t<tr>\n\t\t\t\t\t@if (rowCounter()) {\n\t\t\t\t\t\t<th class=\"text-end small-column\"> {{ translate(\"NR\") }}</th>\n\t\t\t\t\t}\n\t\t\t\t\t@for (head of tableHead(); track head.key) {\n\t\t\t\t\t\t@if (!head.hidden) {\n\t\t\t\t\t\t\t<th\n\t\t\t\t\t\t\t\t(click)=\"head.type !== 'checkbox' && !head.notSortable && tableSort(head.key)\"\n\t\t\t\t\t\t\t\t[ngClass]=\"head.sort\"\n\t\t\t\t\t\t\t\tclass=\"header {{ head.notSortable ? '' : 'sortable' }} {{ head.cellAlign }}\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t\t\t@if (head.type === \"checkbox\") {\n\t\t\t\t\t\t\t\t\t\t<input type=\"checkbox\" (change)=\"toggleAllCheckboxes($event, head.key)\" (click)=\"$event.stopPropagation()\" />\n\t\t\t\t\t\t\t\t\t} @else {\n\t\t\t\t\t\t\t\t\t\t<span [translate]=\"head.key.toUpperCase()\">{{ head.label || head.key }}</span>\n\t\t\t\t\t\t\t\t\t\t@if (!head.notSortable) {\n\t\t\t\t\t\t\t\t\t\t\t@if (icons() === 'fa') {\n\t\t\t\t\t\t\t\t\t\t\t\t@if (head.sort === 'headerSortDown') {\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"fa fa-sort-down\"></span>\n\t\t\t\t\t\t\t\t\t\t\t\t} @else if (head.sort === 'headerSortUp') {\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"fa fa-sort-up\"></span>\n\t\t\t\t\t\t\t\t\t\t\t\t} @else {\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"fa fa-sort\"></span>\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t} @else {\n\t\t\t\t\t\t\t\t\t\t\t\t@if (head.sort === 'headerSortDown') {\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"bi bi-arrow-down\"></span>\n\t\t\t\t\t\t\t\t\t\t\t\t} @else if (head.sort === 'headerSortUp') {\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"bi bi-arrow-up\"></span>\n\t\t\t\t\t\t\t\t\t\t\t\t} @else {\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"bi bi-arrow-down-up\"></span>\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</th>\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\t@if (tableHeadStorage() || (rowActions() && rowActions().length)) {\n\t\t\t\t\t\t<th class=\"header small-column text-center p-0\" data-width=\"50\">\n\t\t\t\t\t\t\t@if (tableHeadStorage()) {\n\t\t\t\t\t\t\t\t<a\n\t\t\t\t\t\t\t\t\t(click)=\"openTableLayoutModal()\"\n\t\t\t\t\t\t\t\t\taria-controls=\"basic-link-dropdown\"\n\t\t\t\t\t\t\t\t\tclass=\"menu-button toggle-white big-toggle dropdown-menu-link\"\n\t\t\t\t\t\t\t\t></a>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t</th>\n\t\t\t\t\t}\n\t\t\t\t</tr>\n\t\t\t</thead>\n\n\t\t\t@if (tableData().length) {\n\t\t\t\t<tbody>\n\t\t\t\t\t@for (row of tableData(); track row[\"id\"] || $index) {\n\t\t\t\t\t\t<tr\n\t\t\t\t\t\t\tclass=\"{{ row['rowClass'] || '' }}\"\n\t\t\t\t\t\t\t(click)=\"onRowClick(row, $event)\"\n\t\t\t\t\t\t\t[className]=\"selectableClickedValue === row[selectableKey()] ? selectableClass() : ''\"\n\t\t\t\t\t\t\t[attr.data-id]=\"row['id']\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t@if (rowCounter()) {\n\t\t\t\t\t\t\t\t<th class=\"text-end\"> {{ $index + counter }}.</th>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t@for (head of tableHead(); track head.key) {\n\t\t\t\t\t\t\t\t@if (!head.hidden) {\n\t\t\t\t\t\t\t\t\t<td [attr.data-column]=\"head.key\" class=\"header text-nowrap {{ head.cellAlign }}\">\n\t\t\t\t\t\t\t\t\t\t@if (head.type === \"checkbox\") {\n\t\t\t\t\t\t\t\t\t\t\t@if (row | visibleRowAction: head.visibilityFieldRule : enableLog()) {\n\t\t\t\t\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"select\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[(ngModel)]=\"row[head.key]\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tname=\"checkbox_{{ row['id'] }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tid=\"checkbox_{{ row['id'] }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t} @else if (head.visibilityFieldRule?.disabled) {\n\t\t\t\t\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"select\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[(ngModel)]=\"row[head.key]\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[disabled]=\"true\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tname=\"checkbox_{{ row['id'] }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t@if (!head.type) {\n\t\t\t\t\t\t\t\t\t\t\t{{ row[head.key] }}\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t@if (head.type === \"html\") {\n\t\t\t\t\t\t\t\t\t\t\t<span [innerHTML]=\"row[head.key] | safeLimitedHtml\"></span>\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t@if (head.type === \"badge\") {\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"badge {{ row[head.key + 'Badge'] }}\">{{ row[head.key] }}</span>\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t@if (head.type === \"date\") {\n\t\t\t\t\t\t\t\t\t\t\t{{ row[head.key] | date: (head.dateFormat ? head.dateFormat : \"dd.MM.yyyy\") }}\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t@if (head.type === \"datetime\") {\n\t\t\t\t\t\t\t\t\t\t\t{{ row[head.key] | date: (head.dateFormat ? head.dateFormat : \"dd.MM.yyyy HH:mm:ss\") }}\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t@if (head.type === \"image\") {\n\t\t\t\t\t\t\t\t\t\t\t@if (row[head.key] && row[head.key] !== \"\") {\n\t\t\t\t\t\t\t\t\t\t\t\t<img\n\t\t\t\t\t\t\t\t\t\t\t\t\talt=\"img\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[attr.src]=\"row[head.key]\"\n\t\t\t\t\t\t\t\t\t\t\t\t\twidth=\"{{ head?.imageSize?.width || 50 }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t\theight=\"{{ head?.imageSize?.height || 50 }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t@if (head.type === \"url\") {\n @if (row[head.key]) {\n <a\n [href]=\"row[head.key]\"\n [target]=\"head?.urlTarget || '_blank'\"\n [innerHTML]=\"head?.urlArea ? (head.urlArea || '' | safeLimitedHtml) : row[head.key]\">\n </a>\n } @else {\n {{ head?.urlMissing === undefined ? '-' : head.urlMissing }}\n }\n\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t@if (head.type === \"slider\") {\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"form-check form-switch\">\n\t\t\t\t\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\t\t\t\t\t(change)=\"sliderClicked.emit(row)\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[checked]=\"row[head.key]\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"switched\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tid=\"check-{{ row['id'] }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tvalue=\"true\"\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t<label for=\"check-{{ row['id'] }}\"></label>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t\t\t@if (head.type === \"input\") {\n\t\t\t\t\t\t\t\t\t\t\t<input [(ngModel)]=\"row[head.key]\" type=\"text\" name=\"input_{{ row['id'] }}\" />\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t</td>\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t@if (tableHeadStorage() || (rowActions() && rowActions().length)) {\n\t\t\t\t\t\t\t\t<td class=\"small-column\">\n\t\t\t\t\t\t\t\t\t<div class=\"menu text-end\">\n\t\t\t\t\t\t\t\t\t\t@for (action of rowActions(); track (action.label || \"\") + \"_\" + $index) {\n\t\t\t\t\t\t\t\t\t\t\t@if (row | visibleRowAction: action.visibilityRule : enableLog()) {\n\t\t\t\t\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\t\t\t\t\t(click)=\"rowAction(action.actionName, row, $event)\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[ngClass]=\"{ 'btn-secondary': !action.btnColor }\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"btn buttons-copy buttons-html5 btn-sm ms-2 {{ action.actionName }} {{ action.btnColor }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t\ttooltip=\"{{ action.label }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span><i class=\"fa {{ action.faIcon }}\"></i></span>\n\t\t\t\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t\t\t\t} @else if (action.visibilityRule?.disabled) {\n\t\t\t\t\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\t\t\t\t\t[disabled]=\"true\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[ngClass]=\"{ 'btn-secondary': !action.btnColor }\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"btn buttons-copy buttons-html5 btn-sm ms-2 {{ action.actionName }} {{ action.btnColor }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t\ttooltip=\"{{ action.label }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span><i class=\"fa {{ action.faIcon }}\"></i></span>\n\t\t\t\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</td>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t</tr>\n\t\t\t\t\t}\n\t\t\t\t\t@if (inputTypeKey || checkboxTypeKey) {\n\t\t\t\t\t\t<tr>\n\t\t\t\t\t\t\t<td\n\t\t\t\t\t\t\t\t[colSpan]=\"\n\t\t\t\t\t\t\t\t\ttableHead().length - 1 + (rowCounter() ? 1 : 0) + (tableHeadStorage() || (rowActions() && rowActions().length) ? 1 : 0)\n\t\t\t\t\t\t\t\t\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<button (click)=\"pushInputValues()\" class=\"btn buttons-copy buttons-html5 btn-sm ms-2 btn-secondary\">\n\t\t\t\t\t\t\t\t\t{{ translate(formSubmitLabel()) }}\n\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t</td>\n\t\t\t\t\t\t</tr>\n\t\t\t\t\t}\n\t\t\t\t</tbody>\n\t\t\t} @else {\n\t\t\t\t<tbody>\n\t\t\t\t\t<tr>\n\t\t\t\t\t\t<td\n\t\t\t\t\t\t\t[colSpan]=\"\n\t\t\t\t\t\t\t\ttableHead().length - 1 + (rowCounter() ? 1 : 0) + (tableHeadStorage() || (rowActions() && rowActions().length) ? 1 : 0)\n\t\t\t\t\t\t\t\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div class=\"alert alert-light\" role=\"alert\">\n @if (icons() === 'fa') {\n <i class=\"fa fa-exclamation-triangle\"></i>\n } @else {\n <i class=\"bi bi-exclamation-triangle\"></i>\n }\n {{ translate(\"NO_DATA_FOUND\") }}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</td>\n\t\t\t\t\t</tr>\n\t\t\t\t</tbody>\n\t\t\t}\n\t\t</table>\n\t</div>\n\t@if (totalPages > 1) {\n\t\t<as-lib-pagination\n\t\t\t(pageChange)=\"pageChange($event)\"\n\t\t\t[align]=\"paginationAlignment()\"\n\t\t\t[enableLog]=\"enableLog()\"\n\t\t\t[first]=\"page() === 0\"\n\t\t\t[last]=\"page() === totalPages - 1\"\n\t\t\t[page]=\"page()\"\n\t\t\t[totalPages]=\"totalPages\"\n\t\t></as-lib-pagination>\n\t}\n</div>\n", styles: [".dropdown-holder{min-height:20px}.dynamic-table,.dynamic-table button,span.badge{font-size:12px;font-weight:400}.table-length label{display:inline-block;white-space:nowrap}.table-length select{display:inline-block;width:auto}.table-search{text-align:right}.table-search label{display:inline-block;white-space:nowrap}.table-search input{display:inline-block;width:auto}th.sortable div{display:flex;align-items:center;cursor:pointer}th.sortable div span:not(.fa):not(.bi){flex:1}th.sortable div span.fa,th.sortable div span.bi{display:block}th.sortable span.fa,th.sortable span.bi{color:#348fe2;opacity:.25}th.sortable.headerSortDown span.fa,th.sortable.headerSortDown span.bi,th.sortable.headerSortUp span.fa,th.sortable.headerSortUp span.bi{opacity:1}.menu-button{border-radius:50%;width:24px;height:24px;display:inline-block;position:relative;cursor:pointer}.menu-button:after{content:\"\";background-image:radial-gradient(circle,black 2px,transparent 2px);background-size:100% 33.33%;width:18px;height:18px;display:block;top:3px;left:3px;position:absolute}.menu-button:hover{background:#4e4e4e26}.menu-button.menu-horizontal:after{background-size:33.33% 100%}.small-column{white-space:nowrap;width:1%}.loading{opacity:.3}\n"] }]
|
|
721
|
+
], providers: [], standalone: true, template: "<div class=\"dynamic-table position-relative\">\n\t@if (loading()) {\n\t\t<div class=\"position-absolute text-center d-block w-100 opacity-100\">\n <div class=\"spinner-border\" role=\"status\">\n <span class=\"visually-hidden\">Loading...</span>\n </div>\n\t\t</div>\n\t}\n\t<div\n\t\tclass=\"row mb-3 mx-0\"\n\t\t[appUnwraptag]=\"(!perPageValues() || perPageValues().length < 2) && (!headerActions() || !headerActions().length) && !enableSearch()\"\n\t\t[ngClass]=\"{\n\t\t\tloading: loading(),\n\t\t}\"\n\t>\n\t\t<div\n\t\t\tclass=\"col-md-7 d-flex d-sm-flex d-md-block justify-content-center mb-2\"\n\t\t\t[appUnwraptag]=\"(!perPageValues() || perPageValues().length < 2) && (!headerActions() || !headerActions().length) && !enableSearch()\"\n\t\t>\n\t\t\t@if (perPageValues() && perPageValues().length > 1) {\n\t\t\t\t<div class=\"d-block d-md-inline-flex me-0 me-md-3\">\n\t\t\t\t\t<div class=\"table-length\">\n\t\t\t\t\t\t<label\n\t\t\t\t\t\t\t>{{ translate(\"SHOW\") }}\n\t\t\t\t\t\t\t<select\n\t\t\t\t\t\t\t\t(change)=\"changePerPage($event)\"\n\t\t\t\t\t\t\t\taria-controls=\"data-table-combine\"\n\t\t\t\t\t\t\t\tclass=\"form-select form-select-sm\"\n\t\t\t\t\t\t\t\tname=\"data-table-combine_length\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t@for (perp of perPageValues(); track perp) {\n\t\t\t\t\t\t\t\t\t<option [selected]=\"perPage() === perp\" value=\"{{ perp }}\">{{ perp }} </option>\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t</select>\n\t\t\t\t\t\t\t{{ translate(\"ENTRIES\") }}</label\n\t\t\t\t\t\t>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t}\n\t\t\t@if (headerActions() && headerActions().length) {\n\t\t\t\t<div\n\t\t\t\t\tclass=\"d-block d-inline-flex\"\n\t\t\t\t\t[ngClass]=\"{\n\t\t\t\t\t\t'mb-2': (!perPageValues() || perPageValues().length < 2) && !enableSearch(),\n\t\t\t\t\t}\"\n\t\t\t\t>\n\t\t\t\t\t<div class=\"dt-buttons btn-group flex-wrap\">\n\t\t\t\t\t\t@for (action of headerActions(); track action.actionName + $index) {\n\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t(click)=\"headerAction(action.actionName)\"\n\t\t\t\t\t\t\t\t[ngClass]=\"{ 'btn-secondary': !action.btnColor }\"\n\t\t\t\t\t\t\t\tclass=\"btn buttons-copy buttons-html5 btn-sm {{ action.actionName }} {{ action.btnColor }}\"\n\t\t\t\t\t\t\t\tid=\"header-action-{{ action.actionName }}\"\n\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t\t\t@if (action.faIcon) {\n\t\t\t\t\t\t\t\t\t\t<i class=\"fa {{ action.faIcon }}\"></i>\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t{{ action.label }}\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t}\n\t\t</div>\n\t\t@if (enableSearch()) {\n\t\t\t<div class=\"col-md-5 d-flex d-xl-block justify-content-center\">\n\t\t\t\t<div class=\"table-search\">\n\t\t\t\t\t<label>\n\t\t\t\t\t\t{{ translate(\"SEARCH\") }}:\n\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t(ngModelChange)=\"this.searchUpdate.next($event)\"\n\t\t\t\t\t\t\t[(ngModel)]=\"search\"\n\t\t\t\t\t\t\taria-controls=\"data-table-combine\"\n\t\t\t\t\t\t\tclass=\"form-control form-control-sm\"\n\t\t\t\t\t\t\tid=\"table-search\"\n\t\t\t\t\t\t\tplaceholder=\"\"\n\t\t\t\t\t\t\ttype=\"search\"\n\t\t\t\t\t/></label>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t}\n\t</div>\n\t<div\n\t\tclass=\"table-responsive\"\n\t\t[ngClass]=\"{\n\t\t\tloading: loading(),\n\t\t}\"\n\t>\n\t\t<table\n\t\t\t[ngClass]=\"{\n\t\t\t\t'table-striped': striped(),\n\t\t\t\t'table-bordered': bordered(),\n\t\t\t\t'table-hover': hovered(),\n\t\t\t}\"\n\t\t\tclass=\"table table-fixed align-middle {{ tableStyle() }} icons-{{ icons() }}\"\n\t\t>\n\t\t\t<thead [class]=\"headStyle()\">\n\t\t\t\t<tr>\n\t\t\t\t\t@if (rowCounter()) {\n\t\t\t\t\t\t<th class=\"text-end small-column\"> {{ translate(\"NR\") }}</th>\n\t\t\t\t\t}\n\t\t\t\t\t@for (head of tableHead(); track head.key) {\n\t\t\t\t\t\t@if (!head.hidden) {\n\t\t\t\t\t\t\t<th\n\t\t\t\t\t\t\t\t(click)=\"head.type !== 'checkbox' && !head.notSortable && tableSort(head.key)\"\n\t\t\t\t\t\t\t\t[ngClass]=\"head.sort\"\n\t\t\t\t\t\t\t\tclass=\"header {{ head.notSortable ? '' : 'sortable' }} {{ head.cellAlign }}\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<div>\n\t\t\t\t\t\t\t\t\t@if (head.type === \"checkbox\") {\n\t\t\t\t\t\t\t\t\t\t<input type=\"checkbox\" (change)=\"toggleAllCheckboxes($event, head.key)\" (click)=\"$event.stopPropagation()\" />\n\t\t\t\t\t\t\t\t\t} @else {\n\t\t\t\t\t\t\t\t\t\t<span [translate]=\"head.key.toUpperCase()\">{{ head.label || head.key }}</span>\n\t\t\t\t\t\t\t\t\t\t@if (!head.notSortable) {\n\t\t\t\t\t\t\t\t\t\t\t@if (icons() === 'fa') {\n\t\t\t\t\t\t\t\t\t\t\t\t@if (head.sort === 'headerSortDown') {\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"fa fa-sort-down\"></span>\n\t\t\t\t\t\t\t\t\t\t\t\t} @else if (head.sort === 'headerSortUp') {\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"fa fa-sort-up\"></span>\n\t\t\t\t\t\t\t\t\t\t\t\t} @else {\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"fa fa-sort\"></span>\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t} @else {\n\t\t\t\t\t\t\t\t\t\t\t\t@if (head.sort === 'headerSortDown') {\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"bi bi-arrow-down\"></span>\n\t\t\t\t\t\t\t\t\t\t\t\t} @else if (head.sort === 'headerSortUp') {\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"bi bi-arrow-up\"></span>\n\t\t\t\t\t\t\t\t\t\t\t\t} @else {\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span class=\"bi bi-arrow-down-up\"></span>\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t</th>\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\t@if (tableHeadStorage() || (rowActions() && rowActions().length)) {\n\t\t\t\t\t\t<th class=\"header small-column text-center p-0\" data-width=\"50\">\n\t\t\t\t\t\t\t@if (tableHeadStorage()) {\n\t\t\t\t\t\t\t\t<a\n\t\t\t\t\t\t\t\t\t(click)=\"openTableLayoutModal()\"\n\t\t\t\t\t\t\t\t\taria-controls=\"basic-link-dropdown\"\n\t\t\t\t\t\t\t\t\tclass=\"menu-button toggle-white big-toggle dropdown-menu-link\"\n\t\t\t\t\t\t\t\t></a>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t</th>\n\t\t\t\t\t}\n\t\t\t\t</tr>\n\t\t\t</thead>\n\n\t\t\t@if (tableData().length) {\n\t\t\t\t<tbody>\n\t\t\t\t\t@for (row of tableData(); track row[\"id\"] || $index) {\n\t\t\t\t\t\t<tr\n\t\t\t\t\t\t\tclass=\"{{ row['rowClass'] || '' }}\"\n\t\t\t\t\t\t\t(click)=\"onRowClick(row, $event)\"\n\t\t\t\t\t\t\t[className]=\"selectableClickedValue === row[selectableKey()] ? selectableClass() : ''\"\n\t\t\t\t\t\t\t[attr.data-id]=\"row['id']\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t@if (rowCounter()) {\n\t\t\t\t\t\t\t\t<th class=\"text-end\"> {{ $index + counter }}.</th>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t@for (head of tableHead(); track head.key) {\n\t\t\t\t\t\t\t\t@if (!head.hidden) {\n\t\t\t\t\t\t\t\t\t<td [attr.data-column]=\"head.key\" class=\"header text-nowrap {{ head.cellAlign }}\">\n\t\t\t\t\t\t\t\t\t\t@if (head.type === \"checkbox\") {\n\t\t\t\t\t\t\t\t\t\t\t@if (row | visibleRowAction: head.visibilityFieldRule : enableLog()) {\n\t\t\t\t\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"select\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[(ngModel)]=\"row[head.key]\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tname=\"checkbox_{{ row['id'] }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tid=\"checkbox_{{ row['id'] }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t} @else if (head.visibilityFieldRule?.disabled) {\n\t\t\t\t\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"select\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[(ngModel)]=\"row[head.key]\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[disabled]=\"true\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tname=\"checkbox_{{ row['id'] }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t@if (!head.type) {\n\t\t\t\t\t\t\t\t\t\t\t{{ row[head.key] }}\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t@if (head.type === \"html\") {\n\t\t\t\t\t\t\t\t\t\t\t<span [innerHTML]=\"row[head.key] | safeLimitedHtml\"></span>\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t@if (head.type === \"badge\") {\n\t\t\t\t\t\t\t\t\t\t\t<span class=\"badge {{ row[head.key + 'Badge'] }}\">{{ row[head.key] }}</span>\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t@if (head.type === \"date\") {\n\t\t\t\t\t\t\t\t\t\t\t{{ row[head.key] | date: (head.dateFormat ? head.dateFormat : \"dd.MM.yyyy\") }}\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t@if (head.type === \"datetime\") {\n\t\t\t\t\t\t\t\t\t\t\t{{ row[head.key] | date: (head.dateFormat ? head.dateFormat : \"dd.MM.yyyy HH:mm:ss\") }}\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t@if (head.type === \"image\") {\n\t\t\t\t\t\t\t\t\t\t\t@if (row[head.key] && row[head.key] !== \"\") {\n\t\t\t\t\t\t\t\t\t\t\t\t<img\n\t\t\t\t\t\t\t\t\t\t\t\t\talt=\"img\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[attr.src]=\"row[head.key]\"\n\t\t\t\t\t\t\t\t\t\t\t\t\twidth=\"{{ head?.imageSize?.width || 50 }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t\theight=\"{{ head?.imageSize?.height || 50 }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t@if (head.type === \"url\") {\n @if (row[head.key]) {\n <a\n [href]=\"row[head.key]\"\n [target]=\"head?.urlTarget || '_blank'\"\n [innerHTML]=\"head?.urlArea ? (head.urlArea || '' | safeLimitedHtml) : row[head.key]\">\n </a>\n } @else {\n {{ head?.urlMissing === undefined ? '-' : head.urlMissing }}\n }\n\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t@if (head.type === \"slider\") {\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"form-check form-switch\">\n\t\t\t\t\t\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\t\t\t\t\t\t(change)=\"sliderClicked.emit(row)\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[checked]=\"row[head.key]\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"switched\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tid=\"check-{{ row['id'] }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tvalue=\"true\"\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t<label for=\"check-{{ row['id'] }}\"></label>\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\t\t\t@if (head.type === \"input\") {\n\t\t\t\t\t\t\t\t\t\t\t<input [(ngModel)]=\"row[head.key]\" type=\"text\" name=\"input_{{ row['id'] }}\" />\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t</td>\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t@if (tableHeadStorage() || (rowActions() && rowActions().length)) {\n\t\t\t\t\t\t\t\t<td class=\"small-column\">\n\t\t\t\t\t\t\t\t\t<div class=\"menu text-end\">\n\t\t\t\t\t\t\t\t\t\t@for (action of rowActions(); track (action.label || \"\") + \"_\" + $index) {\n\t\t\t\t\t\t\t\t\t\t\t@if (row | visibleRowAction: action.visibilityRule : enableLog()) {\n\t\t\t\t\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\t\t\t\t\t(click)=\"rowAction(action.actionName, row, $event)\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[ngClass]=\"{ 'btn-secondary': !action.btnColor }\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"btn buttons-copy buttons-html5 btn-sm ms-2 {{ action.actionName }} {{ action.btnColor }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t\ttooltip=\"{{ action.label }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span><i class=\"fa {{ action.faIcon }}\"></i></span>\n\t\t\t\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t\t\t\t} @else if (action.visibilityRule?.disabled) {\n\t\t\t\t\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\t\t\t\t\t[disabled]=\"true\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t[ngClass]=\"{ 'btn-secondary': !action.btnColor }\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tclass=\"btn buttons-copy buttons-html5 btn-sm ms-2 {{ action.actionName }} {{ action.btnColor }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t\ttooltip=\"{{ action.label }}\"\n\t\t\t\t\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<span><i class=\"fa {{ action.faIcon }}\"></i></span>\n\t\t\t\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</td>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t</tr>\n\t\t\t\t\t}\n\t\t\t\t\t@if (inputTypeKey || checkboxTypeKey) {\n\t\t\t\t\t\t<tr>\n\t\t\t\t\t\t\t<td\n\t\t\t\t\t\t\t\t[colSpan]=\"\n\t\t\t\t\t\t\t\t\ttableHead().length - 1 + (rowCounter() ? 1 : 0) + (tableHeadStorage() || (rowActions() && rowActions().length) ? 1 : 0)\n\t\t\t\t\t\t\t\t\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<button (click)=\"pushInputValues()\" class=\"btn buttons-copy buttons-html5 btn-sm ms-2 btn-secondary\">\n\t\t\t\t\t\t\t\t\t{{ translate(formSubmitLabel()) }}\n\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t</td>\n\t\t\t\t\t\t</tr>\n\t\t\t\t\t}\n\t\t\t\t</tbody>\n\t\t\t} @else {\n\t\t\t\t<tbody>\n\t\t\t\t\t<tr>\n\t\t\t\t\t\t<td\n\t\t\t\t\t\t\t[colSpan]=\"\n\t\t\t\t\t\t\t\ttableHead().length - 1 + (rowCounter() ? 1 : 0) + (tableHeadStorage() || (rowActions() && rowActions().length) ? 1 : 0)\n\t\t\t\t\t\t\t\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div class=\"alert alert-light\" role=\"alert\">\n @if (icons() === 'fa') {\n <i class=\"fa fa-exclamation-triangle\"></i>\n } @else {\n <i class=\"bi bi-exclamation-triangle\"></i>\n }\n {{ translate(\"NO_DATA_FOUND\") }}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</td>\n\t\t\t\t\t</tr>\n\t\t\t\t</tbody>\n\t\t\t}\n\t\t</table>\n\t</div>\n\t@if (totalPages > 1) {\n\t\t<as-lib-pagination\n\t\t\t(pageChange)=\"pageChange($event)\"\n\t\t\t[align]=\"paginationAlignment()\"\n\t\t\t[enableLog]=\"enableLog()\"\n\t\t\t[first]=\"page() === 0\"\n\t\t\t[last]=\"page() === totalPages - 1\"\n\t\t\t[page]=\"page()\"\n\t\t\t[totalPages]=\"totalPages\"\n\t\t></as-lib-pagination>\n\t}\n</div>\n", styles: [".dropdown-holder{min-height:20px}.dynamic-table,.dynamic-table button,span.badge{font-size:12px;font-weight:400}.table-length label{display:inline-block;white-space:nowrap}.table-length select{display:inline-block;width:auto}.table-search{text-align:right}.table-search label{display:inline-block;white-space:nowrap}.table-search input{display:inline-block;width:auto}th.sortable div{display:flex;align-items:center;cursor:pointer}th.sortable div span:not(.fa):not(.bi){flex:1}th.sortable div span.fa,th.sortable div span.bi{display:block}th.sortable span.fa,th.sortable span.bi{color:#348fe2;opacity:.75}th.sortable.headerSortDown span.fa,th.sortable.headerSortDown span.bi,th.sortable.headerSortUp span.fa,th.sortable.headerSortUp span.bi{opacity:1}.menu-button{border-radius:50%;width:24px;height:24px;display:inline-block;position:relative;cursor:pointer}.menu-button:after{content:\"\";background-image:radial-gradient(circle,black 2px,transparent 2px);background-size:100% 33.33%;width:18px;height:18px;display:block;top:3px;left:3px;position:absolute}.menu-button:hover{background:#4e4e4e26}.menu-button.menu-horizontal:after{background-size:33.33% 100%}.small-column{white-space:nowrap;width:1%}.loading{opacity:.3}\n"] }]
|
|
722
722
|
}], ctorParameters: () => [{ type: i3.Observable, decorators: [{
|
|
723
723
|
type: Optional
|
|
724
724
|
}, {
|