@ng-nest/ui 18.0.12 → 18.0.13
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/core/config/config.d.ts +1 -0
- package/esm2022/core/config/config.mjs +1 -1
- package/esm2022/table/table-body.component.mjs +8 -3
- package/esm2022/table/table.property.mjs +7 -2
- package/fesm2022/ng-nest-ui-core.mjs.map +1 -1
- package/fesm2022/ng-nest-ui-table.mjs +13 -3
- package/fesm2022/ng-nest-ui-table.mjs.map +1 -1
- package/package.json +107 -107
- package/table/table-body.component.d.ts +2 -0
- package/table/table.property.d.ts +11 -1
|
@@ -18,6 +18,7 @@ import * as i2$1 from '@angular/cdk/scrolling';
|
|
|
18
18
|
import { CdkVirtualScrollViewport, ScrollingModule } from '@angular/cdk/scrolling';
|
|
19
19
|
import { XEmptyComponent } from '@ng-nest/ui/empty';
|
|
20
20
|
import { XButtonComponent } from '@ng-nest/ui/button';
|
|
21
|
+
import { DomSanitizer } from '@angular/platform-browser';
|
|
21
22
|
|
|
22
23
|
/**
|
|
23
24
|
* Table
|
|
@@ -67,6 +68,11 @@ class XTableProperty extends XPropertyFunction(X_TABLE_CONFIG_NAME) {
|
|
|
67
68
|
* @en_US Whether to display the column headers
|
|
68
69
|
*/
|
|
69
70
|
this.headerPosition = input(this.config?.headerPosition ?? 'top');
|
|
71
|
+
/**
|
|
72
|
+
* @zh_CN 列内容支持 innerHTML 渲染 html 标签
|
|
73
|
+
* @en_US Column content supports innerHTML rendering of HTML tags
|
|
74
|
+
*/
|
|
75
|
+
this.bodyInnerHTML = input(this.config?.bodyInnerHTML ?? false, { transform: XToBoolean });
|
|
70
76
|
/**
|
|
71
77
|
* @zh_CN 当前选中行数据
|
|
72
78
|
* @en_US Currently selected row data
|
|
@@ -427,7 +433,7 @@ class XTableProperty extends XPropertyFunction(X_TABLE_CONFIG_NAME) {
|
|
|
427
433
|
this.columnDragWidthEnded = output();
|
|
428
434
|
}
|
|
429
435
|
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.2", ngImport: i0, type: XTableProperty, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
430
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.2", type: XTableProperty, selector: "x-table-property", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, rowHeight: { classPropertyName: "rowHeight", publicName: "rowHeight", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, bordered: { classPropertyName: "bordered", publicName: "bordered", isSignal: true, isRequired: false, transformFunction: null }, showHeader: { classPropertyName: "showHeader", publicName: "showHeader", isSignal: true, isRequired: false, transformFunction: null }, headerPosition: { classPropertyName: "headerPosition", publicName: "headerPosition", isSignal: true, isRequired: false, transformFunction: null }, activatedRow: { classPropertyName: "activatedRow", publicName: "activatedRow", isSignal: true, isRequired: false, transformFunction: null }, headColumnTpl: { classPropertyName: "headColumnTpl", publicName: "headColumnTpl", isSignal: true, isRequired: false, transformFunction: null }, headThTpl: { classPropertyName: "headThTpl", publicName: "headThTpl", isSignal: true, isRequired: false, transformFunction: null }, bodyColumnTpl: { classPropertyName: "bodyColumnTpl", publicName: "bodyColumnTpl", isSignal: true, isRequired: false, transformFunction: null }, bodyTdTpl: { classPropertyName: "bodyTdTpl", publicName: "bodyTdTpl", isSignal: true, isRequired: false, transformFunction: null }, rowClass: { classPropertyName: "rowClass", publicName: "rowClass", isSignal: true, isRequired: false, transformFunction: null }, headSearchTpl: { classPropertyName: "headSearchTpl", publicName: "headSearchTpl", isSignal: true, isRequired: false, transformFunction: null }, allowSelectRow: { classPropertyName: "allowSelectRow", publicName: "allowSelectRow", isSignal: true, isRequired: false, transformFunction: null }, allowCheckRow: { classPropertyName: "allowCheckRow", publicName: "allowCheckRow", isSignal: true, isRequired: false, transformFunction: null }, virtualScroll: { classPropertyName: "virtualScroll", publicName: "virtualScroll", isSignal: true, isRequired: false, transformFunction: null }, bodyHeight: { classPropertyName: "bodyHeight", publicName: "bodyHeight", isSignal: true, isRequired: false, transformFunction: null }, itemSize: { classPropertyName: "itemSize", publicName: "itemSize", isSignal: true, isRequired: false, transformFunction: null }, minBufferPx: { classPropertyName: "minBufferPx", publicName: "minBufferPx", isSignal: true, isRequired: false, transformFunction: null }, maxBufferPx: { classPropertyName: "maxBufferPx", publicName: "maxBufferPx", isSignal: true, isRequired: false, transformFunction: null }, adaptionHeight: { classPropertyName: "adaptionHeight", publicName: "adaptionHeight", isSignal: true, isRequired: false, transformFunction: null }, docPercent: { classPropertyName: "docPercent", publicName: "docPercent", isSignal: true, isRequired: false, transformFunction: null }, checkedRow: { classPropertyName: "checkedRow", publicName: "checkedRow", isSignal: true, isRequired: false, transformFunction: null }, manual: { classPropertyName: "manual", publicName: "manual", isSignal: true, isRequired: false, transformFunction: null }, scroll: { classPropertyName: "scroll", publicName: "scroll", isSignal: true, isRequired: false, transformFunction: null }, header: { classPropertyName: "header", publicName: "header", isSignal: true, isRequired: false, transformFunction: null }, footer: { classPropertyName: "footer", publicName: "footer", isSignal: true, isRequired: false, transformFunction: null }, cellConfig: { classPropertyName: "cellConfig", publicName: "cellConfig", isSignal: true, isRequired: false, transformFunction: null }, rowSize: { classPropertyName: "rowSize", publicName: "rowSize", isSignal: true, isRequired: false, transformFunction: null }, paginationPosition: { classPropertyName: "paginationPosition", publicName: "paginationPosition", isSignal: true, isRequired: false, transformFunction: null }, hiddenWrapBorder: { classPropertyName: "hiddenWrapBorder", publicName: "hiddenWrapBorder", isSignal: true, isRequired: false, transformFunction: null }, hiddenPaginationBorder: { classPropertyName: "hiddenPaginationBorder", publicName: "hiddenPaginationBorder", isSignal: true, isRequired: false, transformFunction: null }, showPagination: { classPropertyName: "showPagination", publicName: "showPagination", isSignal: true, isRequired: false, transformFunction: null }, treeTable: { classPropertyName: "treeTable", publicName: "treeTable", isSignal: true, isRequired: false, transformFunction: null }, expandedAll: { classPropertyName: "expandedAll", publicName: "expandedAll", isSignal: true, isRequired: false, transformFunction: null }, expandedLevel: { classPropertyName: "expandedLevel", publicName: "expandedLevel", isSignal: true, isRequired: false, transformFunction: null }, expanded: { classPropertyName: "expanded", publicName: "expanded", isSignal: true, isRequired: false, transformFunction: null }, expandTpl: { classPropertyName: "expandTpl", publicName: "expandTpl", isSignal: true, isRequired: false, transformFunction: null }, showEmpty: { classPropertyName: "showEmpty", publicName: "showEmpty", isSignal: true, isRequired: false, transformFunction: null }, emptyImg: { classPropertyName: "emptyImg", publicName: "emptyImg", isSignal: true, isRequired: false, transformFunction: null }, emptyContent: { classPropertyName: "emptyContent", publicName: "emptyContent", isSignal: true, isRequired: false, transformFunction: null }, index: { classPropertyName: "index", publicName: "index", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, total: { classPropertyName: "total", publicName: "total", isSignal: true, isRequired: false, transformFunction: null }, query: { classPropertyName: "query", publicName: "query", isSignal: true, isRequired: false, transformFunction: null }, pageLinkSize: { classPropertyName: "pageLinkSize", publicName: "pageLinkSize", isSignal: true, isRequired: false, transformFunction: null }, showEllipsis: { classPropertyName: "showEllipsis", publicName: "showEllipsis", isSignal: true, isRequired: false, transformFunction: null }, showTotal: { classPropertyName: "showTotal", publicName: "showTotal", isSignal: true, isRequired: false, transformFunction: null }, space: { classPropertyName: "space", publicName: "space", isSignal: true, isRequired: false, transformFunction: null }, showBackground: { classPropertyName: "showBackground", publicName: "showBackground", isSignal: true, isRequired: false, transformFunction: null }, showSize: { classPropertyName: "showSize", publicName: "showSize", isSignal: true, isRequired: false, transformFunction: null }, sizeWidth: { classPropertyName: "sizeWidth", publicName: "sizeWidth", isSignal: true, isRequired: false, transformFunction: null }, showInputSize: { classPropertyName: "showInputSize", publicName: "showInputSize", isSignal: true, isRequired: false, transformFunction: null }, inputSizeTooltipText: { classPropertyName: "inputSizeTooltipText", publicName: "inputSizeTooltipText", isSignal: true, isRequired: false, transformFunction: null }, inputSizeWidth: { classPropertyName: "inputSizeWidth", publicName: "inputSizeWidth", isSignal: true, isRequired: false, transformFunction: null }, sizeData: { classPropertyName: "sizeData", publicName: "sizeData", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, showJump: { classPropertyName: "showJump", publicName: "showJump", isSignal: true, isRequired: false, transformFunction: null }, jumpTooltipText: { classPropertyName: "jumpTooltipText", publicName: "jumpTooltipText", isSignal: true, isRequired: false, transformFunction: null }, jumpWidth: { classPropertyName: "jumpWidth", publicName: "jumpWidth", isSignal: true, isRequired: false, transformFunction: null }, totalTpl: { classPropertyName: "totalTpl", publicName: "totalTpl", isSignal: true, isRequired: false, transformFunction: null }, simple: { classPropertyName: "simple", publicName: "simple", isSignal: true, isRequired: false, transformFunction: null }, simpleIndexWidth: { classPropertyName: "simpleIndexWidth", publicName: "simpleIndexWidth", isSignal: true, isRequired: false, transformFunction: null }, inputIndexSizeSureType: { classPropertyName: "inputIndexSizeSureType", publicName: "inputIndexSizeSureType", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { activatedRow: "activatedRowChange", sortChange: "sortChange", headCheckboxChange: "headCheckboxChange", bodyCheckboxChange: "bodyCheckboxChange", manual: "manualChange", index: "indexChange", size: "sizeChange", total: "totalChange", query: "queryChange", rowClick: "rowClick", columnDragStarted: "columnDragStarted", columnDragEnded: "columnDragEnded", columnDropListDropped: "columnDropListDropped", columnDragWidthStarted: "columnDragWidthStarted", columnDragWidthMoved: "columnDragWidthMoved", columnDragWidthEnded: "columnDragWidthEnded" }, usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
|
|
436
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.2", type: XTableProperty, selector: "x-table-property", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, rowHeight: { classPropertyName: "rowHeight", publicName: "rowHeight", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, bordered: { classPropertyName: "bordered", publicName: "bordered", isSignal: true, isRequired: false, transformFunction: null }, showHeader: { classPropertyName: "showHeader", publicName: "showHeader", isSignal: true, isRequired: false, transformFunction: null }, headerPosition: { classPropertyName: "headerPosition", publicName: "headerPosition", isSignal: true, isRequired: false, transformFunction: null }, bodyInnerHTML: { classPropertyName: "bodyInnerHTML", publicName: "bodyInnerHTML", isSignal: true, isRequired: false, transformFunction: null }, activatedRow: { classPropertyName: "activatedRow", publicName: "activatedRow", isSignal: true, isRequired: false, transformFunction: null }, headColumnTpl: { classPropertyName: "headColumnTpl", publicName: "headColumnTpl", isSignal: true, isRequired: false, transformFunction: null }, headThTpl: { classPropertyName: "headThTpl", publicName: "headThTpl", isSignal: true, isRequired: false, transformFunction: null }, bodyColumnTpl: { classPropertyName: "bodyColumnTpl", publicName: "bodyColumnTpl", isSignal: true, isRequired: false, transformFunction: null }, bodyTdTpl: { classPropertyName: "bodyTdTpl", publicName: "bodyTdTpl", isSignal: true, isRequired: false, transformFunction: null }, rowClass: { classPropertyName: "rowClass", publicName: "rowClass", isSignal: true, isRequired: false, transformFunction: null }, headSearchTpl: { classPropertyName: "headSearchTpl", publicName: "headSearchTpl", isSignal: true, isRequired: false, transformFunction: null }, allowSelectRow: { classPropertyName: "allowSelectRow", publicName: "allowSelectRow", isSignal: true, isRequired: false, transformFunction: null }, allowCheckRow: { classPropertyName: "allowCheckRow", publicName: "allowCheckRow", isSignal: true, isRequired: false, transformFunction: null }, virtualScroll: { classPropertyName: "virtualScroll", publicName: "virtualScroll", isSignal: true, isRequired: false, transformFunction: null }, bodyHeight: { classPropertyName: "bodyHeight", publicName: "bodyHeight", isSignal: true, isRequired: false, transformFunction: null }, itemSize: { classPropertyName: "itemSize", publicName: "itemSize", isSignal: true, isRequired: false, transformFunction: null }, minBufferPx: { classPropertyName: "minBufferPx", publicName: "minBufferPx", isSignal: true, isRequired: false, transformFunction: null }, maxBufferPx: { classPropertyName: "maxBufferPx", publicName: "maxBufferPx", isSignal: true, isRequired: false, transformFunction: null }, adaptionHeight: { classPropertyName: "adaptionHeight", publicName: "adaptionHeight", isSignal: true, isRequired: false, transformFunction: null }, docPercent: { classPropertyName: "docPercent", publicName: "docPercent", isSignal: true, isRequired: false, transformFunction: null }, checkedRow: { classPropertyName: "checkedRow", publicName: "checkedRow", isSignal: true, isRequired: false, transformFunction: null }, manual: { classPropertyName: "manual", publicName: "manual", isSignal: true, isRequired: false, transformFunction: null }, scroll: { classPropertyName: "scroll", publicName: "scroll", isSignal: true, isRequired: false, transformFunction: null }, header: { classPropertyName: "header", publicName: "header", isSignal: true, isRequired: false, transformFunction: null }, footer: { classPropertyName: "footer", publicName: "footer", isSignal: true, isRequired: false, transformFunction: null }, cellConfig: { classPropertyName: "cellConfig", publicName: "cellConfig", isSignal: true, isRequired: false, transformFunction: null }, rowSize: { classPropertyName: "rowSize", publicName: "rowSize", isSignal: true, isRequired: false, transformFunction: null }, paginationPosition: { classPropertyName: "paginationPosition", publicName: "paginationPosition", isSignal: true, isRequired: false, transformFunction: null }, hiddenWrapBorder: { classPropertyName: "hiddenWrapBorder", publicName: "hiddenWrapBorder", isSignal: true, isRequired: false, transformFunction: null }, hiddenPaginationBorder: { classPropertyName: "hiddenPaginationBorder", publicName: "hiddenPaginationBorder", isSignal: true, isRequired: false, transformFunction: null }, showPagination: { classPropertyName: "showPagination", publicName: "showPagination", isSignal: true, isRequired: false, transformFunction: null }, treeTable: { classPropertyName: "treeTable", publicName: "treeTable", isSignal: true, isRequired: false, transformFunction: null }, expandedAll: { classPropertyName: "expandedAll", publicName: "expandedAll", isSignal: true, isRequired: false, transformFunction: null }, expandedLevel: { classPropertyName: "expandedLevel", publicName: "expandedLevel", isSignal: true, isRequired: false, transformFunction: null }, expanded: { classPropertyName: "expanded", publicName: "expanded", isSignal: true, isRequired: false, transformFunction: null }, expandTpl: { classPropertyName: "expandTpl", publicName: "expandTpl", isSignal: true, isRequired: false, transformFunction: null }, showEmpty: { classPropertyName: "showEmpty", publicName: "showEmpty", isSignal: true, isRequired: false, transformFunction: null }, emptyImg: { classPropertyName: "emptyImg", publicName: "emptyImg", isSignal: true, isRequired: false, transformFunction: null }, emptyContent: { classPropertyName: "emptyContent", publicName: "emptyContent", isSignal: true, isRequired: false, transformFunction: null }, index: { classPropertyName: "index", publicName: "index", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, total: { classPropertyName: "total", publicName: "total", isSignal: true, isRequired: false, transformFunction: null }, query: { classPropertyName: "query", publicName: "query", isSignal: true, isRequired: false, transformFunction: null }, pageLinkSize: { classPropertyName: "pageLinkSize", publicName: "pageLinkSize", isSignal: true, isRequired: false, transformFunction: null }, showEllipsis: { classPropertyName: "showEllipsis", publicName: "showEllipsis", isSignal: true, isRequired: false, transformFunction: null }, showTotal: { classPropertyName: "showTotal", publicName: "showTotal", isSignal: true, isRequired: false, transformFunction: null }, space: { classPropertyName: "space", publicName: "space", isSignal: true, isRequired: false, transformFunction: null }, showBackground: { classPropertyName: "showBackground", publicName: "showBackground", isSignal: true, isRequired: false, transformFunction: null }, showSize: { classPropertyName: "showSize", publicName: "showSize", isSignal: true, isRequired: false, transformFunction: null }, sizeWidth: { classPropertyName: "sizeWidth", publicName: "sizeWidth", isSignal: true, isRequired: false, transformFunction: null }, showInputSize: { classPropertyName: "showInputSize", publicName: "showInputSize", isSignal: true, isRequired: false, transformFunction: null }, inputSizeTooltipText: { classPropertyName: "inputSizeTooltipText", publicName: "inputSizeTooltipText", isSignal: true, isRequired: false, transformFunction: null }, inputSizeWidth: { classPropertyName: "inputSizeWidth", publicName: "inputSizeWidth", isSignal: true, isRequired: false, transformFunction: null }, sizeData: { classPropertyName: "sizeData", publicName: "sizeData", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, showJump: { classPropertyName: "showJump", publicName: "showJump", isSignal: true, isRequired: false, transformFunction: null }, jumpTooltipText: { classPropertyName: "jumpTooltipText", publicName: "jumpTooltipText", isSignal: true, isRequired: false, transformFunction: null }, jumpWidth: { classPropertyName: "jumpWidth", publicName: "jumpWidth", isSignal: true, isRequired: false, transformFunction: null }, totalTpl: { classPropertyName: "totalTpl", publicName: "totalTpl", isSignal: true, isRequired: false, transformFunction: null }, simple: { classPropertyName: "simple", publicName: "simple", isSignal: true, isRequired: false, transformFunction: null }, simpleIndexWidth: { classPropertyName: "simpleIndexWidth", publicName: "simpleIndexWidth", isSignal: true, isRequired: false, transformFunction: null }, inputIndexSizeSureType: { classPropertyName: "inputIndexSizeSureType", publicName: "inputIndexSizeSureType", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { activatedRow: "activatedRowChange", sortChange: "sortChange", headCheckboxChange: "headCheckboxChange", bodyCheckboxChange: "bodyCheckboxChange", manual: "manualChange", index: "indexChange", size: "sizeChange", total: "totalChange", query: "queryChange", rowClick: "rowClick", columnDragStarted: "columnDragStarted", columnDragEnded: "columnDragEnded", columnDropListDropped: "columnDropListDropped", columnDragWidthStarted: "columnDragWidthStarted", columnDragWidthMoved: "columnDragWidthMoved", columnDragWidthEnded: "columnDragWidthEnded" }, usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
|
|
431
437
|
}
|
|
432
438
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.2", ngImport: i0, type: XTableProperty, decorators: [{
|
|
433
439
|
type: Component,
|
|
@@ -828,6 +834,7 @@ class XTableBodyComponent extends XTableBodyProperty {
|
|
|
828
834
|
this.table = inject(XTableComponent, { optional: true });
|
|
829
835
|
this.doc = inject(DOCUMENT);
|
|
830
836
|
this.unSubject = new Subject();
|
|
837
|
+
this.domSanitizer = inject(DomSanitizer);
|
|
831
838
|
this.tbodyStyle = signal({});
|
|
832
839
|
this.isEmpty = computed(() => this.data().length === 0);
|
|
833
840
|
this.getRowHeight = computed(() => (this.rowHeight() == 0 ? '' : this.rowHeight()));
|
|
@@ -985,6 +992,9 @@ class XTableBodyComponent extends XTableBodyProperty {
|
|
|
985
992
|
height: `${height}px`
|
|
986
993
|
});
|
|
987
994
|
}
|
|
995
|
+
setDomSanitizer(str) {
|
|
996
|
+
return this.domSanitizer.bypassSecurityTrustHtml(str);
|
|
997
|
+
}
|
|
988
998
|
getIndex(index, item) {
|
|
989
999
|
if (!isNaN(index))
|
|
990
1000
|
return index;
|
|
@@ -1021,7 +1031,7 @@ class XTableBodyComponent extends XTableBodyProperty {
|
|
|
1021
1031
|
return item.id;
|
|
1022
1032
|
}
|
|
1023
1033
|
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.2", ngImport: i0, type: XTableBodyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1024
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.2", type: XTableBodyComponent, isStandalone: true, selector: "x-table-body", viewQueries: [{ propertyName: "tbody", first: true, predicate: ["tbody"], descendants: true, isSignal: true }, { propertyName: "virtualBody", first: true, predicate: CdkVirtualScrollViewport, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<tbody #tbody>\r\n @if (cellConfig()) {\r\n @for (row of data(); track row.id; let i = $index) {\r\n <tr [style.gridTemplateColumns]=\"cellConfig()!.gridTemplateColumns\">\r\n @for (column of cellConfig()!.cells; track column; let j = $index) {\r\n <td\r\n [title]=\"getTitle(row, column)\"\r\n [class.x-table-sticky]=\"table.getStickyLeft(column) || table.getStickyRight(column)\"\r\n [class.x-table-sticky-left]=\"table.getStickyLeft(column)\"\r\n [class.x-table-sticky-right]=\"table.getStickyRight(column)\"\r\n [class.x-table-sticky-left-last]=\"table.getStickyLeftLast(column)\"\r\n [class.x-table-sticky-right-first]=\"table.getStickyRightFirst(column)\"\r\n [style.left.px]=\"column.left\"\r\n [style.right.px]=\"column.right\"\r\n [style.grid-area]=\"column.gridArea\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"cellTpl; context: { column: column, row: row, i: i }\"></ng-container>\r\n </td>\r\n }\r\n </tr>\r\n }\r\n } @else {\r\n @if (virtualScroll()) {\r\n <cdk-virtual-scroll-viewport\r\n #virtualBody\r\n [itemSize]=\"getItemSize()\"\r\n [minBufferPx]=\"minBufferPxSignal()\"\r\n [maxBufferPx]=\"maxBufferPxSignal()\"\r\n [style.height.px]=\"bodyHeightSignal()\"\r\n >\r\n <tr\r\n *cdkVirtualFor=\"let row of data(); let index = index; trackBy: trackByItem\"\r\n [class.x-table-activated]=\"allowSelectRow() && activatedRow()?.id === row.id\"\r\n [style.height.px]=\"getRowHeight()\"\r\n [style.min-height.px]=\"getRowHeight()\"\r\n (click)=\"onRowClick($event, row)\"\r\n >\r\n <!-- rowHeight \u4E3A 0 \u7684\u65F6\u5019\uFF0Cindex \u4E0B\u6807\u83B7\u53D6\u4E0D\u5230 -->\r\n <ng-container *ngTemplateOutlet=\"rowTpl; context: { row: row, i: getIndex(index, row) }\"></ng-container>\r\n </tr>\r\n </cdk-virtual-scroll-viewport>\r\n } @else {\r\n @for (row of data(); track row.id; let i = $index) {\r\n <tr\r\n [class.x-table-activated]=\"allowSelectRow() && activatedRow()?.id === row.id\"\r\n [style.height.px]=\"getRowHeight()\"\r\n [style.min-height.px]=\"getRowHeight()\"\r\n (click)=\"onRowClick($event, row)\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"rowTpl; context: { row: row, i: i }\"></ng-container>\r\n </tr>\r\n @if (table.treeTable() && row.children && row.expanded) {\r\n <div class=\"x-table-children\" [class.x-table-expandTpl]=\"expandTpl()\">\r\n <x-table-body\r\n [data]=\"row.children\"\r\n [columns]=\"table.columns()\"\r\n [itemSize]=\"table.itemSize()\"\r\n [rowHeight]=\"table.rowHeight()\"\r\n [columnTpl]=\"table.bodyColumnTpl()\"\r\n [allowSelectRow]=\"table.allowSelectRow()\"\r\n [rowClass]=\"table.rowClass()\"\r\n [cellConfig]=\"table.cellConfig()?.tbody\"\r\n [(activatedRow)]=\"table.activatedRow\"\r\n [expandedAll]=\"expandedAll()\"\r\n [expandTpl]=\"expandTpl()\"\r\n [level]=\"row.level! + 1\"\r\n ></x-table-body>\r\n </div>\r\n }\r\n }\r\n }\r\n }\r\n @if (table.showEmpty() && isEmpty() && level() === 0) {\r\n <x-empty [img]=\"table.emptyImg()!\" [content]=\"table.emptyContent()!\"></x-empty>\r\n }\r\n</tbody>\r\n\r\n<ng-template #rowTpl let-row=\"row\" let-i=\"i\">\r\n @if (level() > 0 && expandTpl()) {\r\n <ng-container *xOutlet=\"expandTpl(); context: { $row: row, $index: i, $level: level() }\"></ng-container>\r\n } @else if (level() === 0 || !expandTpl()) {\r\n <ng-container *xOutlet=\"rowDefault; context: { row: row, i: i, level: level() }\"></ng-container>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #rowDefault let-row=\"row\" let-i=\"i\">\r\n @for (column of columns(); track column.id; let j = $index) {\r\n <td\r\n [style.width.px]=\"column.width\"\r\n [style.flex]=\"getFlex(column)\"\r\n [title]=\"getTitle(row, column)\"\r\n [class.x-table-dragging]=\"column.dragging\"\r\n [class.x-table-sticky]=\"table.getStickyLeft(column) || table.getStickyRight(column)\"\r\n [class.x-table-sticky-left]=\"table.getStickyLeft(column)\"\r\n [class.x-table-sticky-right]=\"table.getStickyRight(column)\"\r\n [class.x-table-sticky-left-last]=\"table.getStickyLeftLast(column)\"\r\n [class.x-table-sticky-right-first]=\"table.getStickyRightFirst(column)\"\r\n [style.left.px]=\"column.left\"\r\n [style.right.px]=\"column.right\"\r\n [ngClass]=\"!rowClass() ? {} : rowClass()!(row, i)\"\r\n >\r\n <ng-template *ngTemplateOutlet=\"cellTpl; context: { column: column, row: row, i: i }\"></ng-template>\r\n </td>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #cellTpl let-column=\"column\" let-row=\"row\" let-i=\"i\">\r\n @switch (column.type) {\r\n @case ('checkbox') {\r\n <x-checkbox\r\n [data]=\"[{ id: true, label: '' }]\"\r\n [(ngModel)]=\"row[column.id]\"\r\n [disabled]=\"row.disabled\"\r\n (ngModelChange)=\"table.bodyChecked($event, column, row)\"\r\n single\r\n ></x-checkbox>\r\n }\r\n @case ('index') {\r\n <div>{{ table.getIndex(i) }}</div>\r\n }\r\n @default {\r\n @if (table.isExpandColumn(column)) {\r\n <x-button\r\n [class.is-leaf]=\"!row.leaf\"\r\n [class.is-expanded]=\"row.expanded\"\r\n (click)=\"onExpanded($event, row)\"\r\n icon=\"fto-chevron-right\"\r\n size=\"mini\"\r\n onlyIcon\r\n flat\r\n plain\r\n class=\"x-table-expand\"\r\n [style.margin-left.rem]=\"row.level - 0.5\"\r\n ></x-button>\r\n }\r\n <ng-container\r\n *xOutlet=\"columnTpl()[column.id]; context: { $column: column, $row: row, $index: table.getIndex(i) }\"\r\n >\r\n <ng-container *xOutlet=\"table.bodyTdTpl(); context: { $column: column, $row: row, $index: table.getIndex(i) }\">\r\n <div [innerHTML]=\"row[column.id]\" [style.text-align]=\"column.textAlign\"></div>\r\n {{ table.rowExpand() && table.rowExpand()!.id === column.id ? 'x-table-body-level-' + row.level : '' }}\r\n </ng-container>\r\n </ng-container>\r\n }\r\n }\r\n</ng-template>\r\n", dependencies: [{ kind: "component", type: XTableBodyComponent, selector: "x-table-body" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: XEmptyComponent, selector: "x-empty" }, { kind: "ngmodule", type: ScrollingModule }, { kind: "directive", type: i2$1.CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i2$1.CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i2$1.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: XOutletDirective, selector: "[xOutlet]", inputs: ["xOutletContext", "xOutlet"] }, { kind: "component", type: XCheckboxComponent, selector: "x-checkbox" }, { kind: "component", type: XButtonComponent, selector: "x-button" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1034
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.2", type: XTableBodyComponent, isStandalone: true, selector: "x-table-body", viewQueries: [{ propertyName: "tbody", first: true, predicate: ["tbody"], descendants: true, isSignal: true }, { propertyName: "virtualBody", first: true, predicate: CdkVirtualScrollViewport, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<tbody #tbody>\r\n @if (cellConfig()) {\r\n @for (row of data(); track row.id; let i = $index) {\r\n <tr [style.gridTemplateColumns]=\"cellConfig()!.gridTemplateColumns\">\r\n @for (column of cellConfig()!.cells; track column; let j = $index) {\r\n <td\r\n [title]=\"getTitle(row, column)\"\r\n [class.x-table-sticky]=\"table.getStickyLeft(column) || table.getStickyRight(column)\"\r\n [class.x-table-sticky-left]=\"table.getStickyLeft(column)\"\r\n [class.x-table-sticky-right]=\"table.getStickyRight(column)\"\r\n [class.x-table-sticky-left-last]=\"table.getStickyLeftLast(column)\"\r\n [class.x-table-sticky-right-first]=\"table.getStickyRightFirst(column)\"\r\n [style.left.px]=\"column.left\"\r\n [style.right.px]=\"column.right\"\r\n [style.grid-area]=\"column.gridArea\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"cellTpl; context: { column: column, row: row, i: i }\"></ng-container>\r\n </td>\r\n }\r\n </tr>\r\n }\r\n } @else {\r\n @if (virtualScroll()) {\r\n <cdk-virtual-scroll-viewport\r\n #virtualBody\r\n [itemSize]=\"getItemSize()\"\r\n [minBufferPx]=\"minBufferPxSignal()\"\r\n [maxBufferPx]=\"maxBufferPxSignal()\"\r\n [style.height.px]=\"bodyHeightSignal()\"\r\n >\r\n <tr\r\n *cdkVirtualFor=\"let row of data(); let index = index; trackBy: trackByItem\"\r\n [class.x-table-activated]=\"allowSelectRow() && activatedRow()?.id === row.id\"\r\n [style.height.px]=\"getRowHeight()\"\r\n [style.min-height.px]=\"getRowHeight()\"\r\n (click)=\"onRowClick($event, row)\"\r\n >\r\n <!-- rowHeight \u4E3A 0 \u7684\u65F6\u5019\uFF0Cindex \u4E0B\u6807\u83B7\u53D6\u4E0D\u5230 -->\r\n <ng-container *ngTemplateOutlet=\"rowTpl; context: { row: row, i: getIndex(index, row) }\"></ng-container>\r\n </tr>\r\n </cdk-virtual-scroll-viewport>\r\n } @else {\r\n @for (row of data(); track row.id; let i = $index) {\r\n <tr\r\n [class.x-table-activated]=\"allowSelectRow() && activatedRow()?.id === row.id\"\r\n [style.height.px]=\"getRowHeight()\"\r\n [style.min-height.px]=\"getRowHeight()\"\r\n (click)=\"onRowClick($event, row)\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"rowTpl; context: { row: row, i: i }\"></ng-container>\r\n </tr>\r\n @if (table.treeTable() && row.children && row.expanded) {\r\n <div class=\"x-table-children\" [class.x-table-expandTpl]=\"expandTpl()\">\r\n <x-table-body\r\n [data]=\"row.children\"\r\n [columns]=\"table.columns()\"\r\n [itemSize]=\"table.itemSize()\"\r\n [rowHeight]=\"table.rowHeight()\"\r\n [columnTpl]=\"table.bodyColumnTpl()\"\r\n [allowSelectRow]=\"table.allowSelectRow()\"\r\n [rowClass]=\"table.rowClass()\"\r\n [cellConfig]=\"table.cellConfig()?.tbody\"\r\n [(activatedRow)]=\"table.activatedRow\"\r\n [expandedAll]=\"expandedAll()\"\r\n [expandTpl]=\"expandTpl()\"\r\n [level]=\"row.level! + 1\"\r\n ></x-table-body>\r\n </div>\r\n }\r\n }\r\n }\r\n }\r\n @if (table.showEmpty() && isEmpty() && level() === 0) {\r\n <x-empty [img]=\"table.emptyImg()!\" [content]=\"table.emptyContent()!\"></x-empty>\r\n }\r\n</tbody>\r\n\r\n<ng-template #rowTpl let-row=\"row\" let-i=\"i\">\r\n @if (level() > 0 && expandTpl()) {\r\n <ng-container *xOutlet=\"expandTpl(); context: { $row: row, $index: i, $level: level() }\"></ng-container>\r\n } @else if (level() === 0 || !expandTpl()) {\r\n <ng-container *xOutlet=\"rowDefault; context: { row: row, i: i, level: level() }\"></ng-container>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #rowDefault let-row=\"row\" let-i=\"i\">\r\n @for (column of columns(); track column.id; let j = $index) {\r\n <td\r\n [style.width.px]=\"column.width\"\r\n [style.flex]=\"getFlex(column)\"\r\n [title]=\"getTitle(row, column)\"\r\n [class.x-table-dragging]=\"column.dragging\"\r\n [class.x-table-sticky]=\"table.getStickyLeft(column) || table.getStickyRight(column)\"\r\n [class.x-table-sticky-left]=\"table.getStickyLeft(column)\"\r\n [class.x-table-sticky-right]=\"table.getStickyRight(column)\"\r\n [class.x-table-sticky-left-last]=\"table.getStickyLeftLast(column)\"\r\n [class.x-table-sticky-right-first]=\"table.getStickyRightFirst(column)\"\r\n [style.left.px]=\"column.left\"\r\n [style.right.px]=\"column.right\"\r\n [ngClass]=\"!rowClass() ? {} : rowClass()!(row, i)\"\r\n >\r\n <ng-template *ngTemplateOutlet=\"cellTpl; context: { column: column, row: row, i: i }\"></ng-template>\r\n </td>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #cellTpl let-column=\"column\" let-row=\"row\" let-i=\"i\">\r\n @switch (column.type) {\r\n @case ('checkbox') {\r\n <x-checkbox\r\n [data]=\"[{ id: true, label: '' }]\"\r\n [(ngModel)]=\"row[column.id]\"\r\n [disabled]=\"row.disabled\"\r\n (ngModelChange)=\"table.bodyChecked($event, column, row)\"\r\n single\r\n ></x-checkbox>\r\n }\r\n @case ('index') {\r\n <div>{{ table.getIndex(i) }}</div>\r\n }\r\n @default {\r\n @if (table.isExpandColumn(column)) {\r\n <x-button\r\n [class.is-leaf]=\"!row.leaf\"\r\n [class.is-expanded]=\"row.expanded\"\r\n (click)=\"onExpanded($event, row)\"\r\n icon=\"fto-chevron-right\"\r\n size=\"mini\"\r\n onlyIcon\r\n flat\r\n plain\r\n class=\"x-table-expand\"\r\n [style.margin-left.rem]=\"row.level - 0.5\"\r\n ></x-button>\r\n }\r\n <ng-container\r\n *xOutlet=\"columnTpl()[column.id]; context: { $column: column, $row: row, $index: table.getIndex(i) }\"\r\n >\r\n <ng-container *xOutlet=\"table.bodyTdTpl(); context: { $column: column, $row: row, $index: table.getIndex(i) }\">\r\n @if ((table.bodyInnerHTML() && column.innerHTML !== false) || column.innerHTML) {\r\n <div [innerHTML]=\"setDomSanitizer(row[column.id])\" [style.text-align]=\"column.textAlign\"></div>\r\n } @else {\r\n <div [style.text-align]=\"column.textAlign\">{{ row[column.id] }}</div>\r\n }\r\n {{ table.rowExpand() && table.rowExpand()!.id === column.id ? 'x-table-body-level-' + row.level : '' }}\r\n </ng-container>\r\n </ng-container>\r\n }\r\n }\r\n</ng-template>\r\n", dependencies: [{ kind: "component", type: XTableBodyComponent, selector: "x-table-body" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: XEmptyComponent, selector: "x-empty" }, { kind: "ngmodule", type: ScrollingModule }, { kind: "directive", type: i2$1.CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i2$1.CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i2$1.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "directive", type: XOutletDirective, selector: "[xOutlet]", inputs: ["xOutletContext", "xOutlet"] }, { kind: "component", type: XCheckboxComponent, selector: "x-checkbox" }, { kind: "component", type: XButtonComponent, selector: "x-button" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1025
1035
|
}
|
|
1026
1036
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.2", ngImport: i0, type: XTableBodyComponent, decorators: [{
|
|
1027
1037
|
type: Component,
|
|
@@ -1034,7 +1044,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.2", ngImpor
|
|
|
1034
1044
|
XOutletDirective,
|
|
1035
1045
|
XCheckboxComponent,
|
|
1036
1046
|
XButtonComponent
|
|
1037
|
-
], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<tbody #tbody>\r\n @if (cellConfig()) {\r\n @for (row of data(); track row.id; let i = $index) {\r\n <tr [style.gridTemplateColumns]=\"cellConfig()!.gridTemplateColumns\">\r\n @for (column of cellConfig()!.cells; track column; let j = $index) {\r\n <td\r\n [title]=\"getTitle(row, column)\"\r\n [class.x-table-sticky]=\"table.getStickyLeft(column) || table.getStickyRight(column)\"\r\n [class.x-table-sticky-left]=\"table.getStickyLeft(column)\"\r\n [class.x-table-sticky-right]=\"table.getStickyRight(column)\"\r\n [class.x-table-sticky-left-last]=\"table.getStickyLeftLast(column)\"\r\n [class.x-table-sticky-right-first]=\"table.getStickyRightFirst(column)\"\r\n [style.left.px]=\"column.left\"\r\n [style.right.px]=\"column.right\"\r\n [style.grid-area]=\"column.gridArea\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"cellTpl; context: { column: column, row: row, i: i }\"></ng-container>\r\n </td>\r\n }\r\n </tr>\r\n }\r\n } @else {\r\n @if (virtualScroll()) {\r\n <cdk-virtual-scroll-viewport\r\n #virtualBody\r\n [itemSize]=\"getItemSize()\"\r\n [minBufferPx]=\"minBufferPxSignal()\"\r\n [maxBufferPx]=\"maxBufferPxSignal()\"\r\n [style.height.px]=\"bodyHeightSignal()\"\r\n >\r\n <tr\r\n *cdkVirtualFor=\"let row of data(); let index = index; trackBy: trackByItem\"\r\n [class.x-table-activated]=\"allowSelectRow() && activatedRow()?.id === row.id\"\r\n [style.height.px]=\"getRowHeight()\"\r\n [style.min-height.px]=\"getRowHeight()\"\r\n (click)=\"onRowClick($event, row)\"\r\n >\r\n <!-- rowHeight \u4E3A 0 \u7684\u65F6\u5019\uFF0Cindex \u4E0B\u6807\u83B7\u53D6\u4E0D\u5230 -->\r\n <ng-container *ngTemplateOutlet=\"rowTpl; context: { row: row, i: getIndex(index, row) }\"></ng-container>\r\n </tr>\r\n </cdk-virtual-scroll-viewport>\r\n } @else {\r\n @for (row of data(); track row.id; let i = $index) {\r\n <tr\r\n [class.x-table-activated]=\"allowSelectRow() && activatedRow()?.id === row.id\"\r\n [style.height.px]=\"getRowHeight()\"\r\n [style.min-height.px]=\"getRowHeight()\"\r\n (click)=\"onRowClick($event, row)\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"rowTpl; context: { row: row, i: i }\"></ng-container>\r\n </tr>\r\n @if (table.treeTable() && row.children && row.expanded) {\r\n <div class=\"x-table-children\" [class.x-table-expandTpl]=\"expandTpl()\">\r\n <x-table-body\r\n [data]=\"row.children\"\r\n [columns]=\"table.columns()\"\r\n [itemSize]=\"table.itemSize()\"\r\n [rowHeight]=\"table.rowHeight()\"\r\n [columnTpl]=\"table.bodyColumnTpl()\"\r\n [allowSelectRow]=\"table.allowSelectRow()\"\r\n [rowClass]=\"table.rowClass()\"\r\n [cellConfig]=\"table.cellConfig()?.tbody\"\r\n [(activatedRow)]=\"table.activatedRow\"\r\n [expandedAll]=\"expandedAll()\"\r\n [expandTpl]=\"expandTpl()\"\r\n [level]=\"row.level! + 1\"\r\n ></x-table-body>\r\n </div>\r\n }\r\n }\r\n }\r\n }\r\n @if (table.showEmpty() && isEmpty() && level() === 0) {\r\n <x-empty [img]=\"table.emptyImg()!\" [content]=\"table.emptyContent()!\"></x-empty>\r\n }\r\n</tbody>\r\n\r\n<ng-template #rowTpl let-row=\"row\" let-i=\"i\">\r\n @if (level() > 0 && expandTpl()) {\r\n <ng-container *xOutlet=\"expandTpl(); context: { $row: row, $index: i, $level: level() }\"></ng-container>\r\n } @else if (level() === 0 || !expandTpl()) {\r\n <ng-container *xOutlet=\"rowDefault; context: { row: row, i: i, level: level() }\"></ng-container>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #rowDefault let-row=\"row\" let-i=\"i\">\r\n @for (column of columns(); track column.id; let j = $index) {\r\n <td\r\n [style.width.px]=\"column.width\"\r\n [style.flex]=\"getFlex(column)\"\r\n [title]=\"getTitle(row, column)\"\r\n [class.x-table-dragging]=\"column.dragging\"\r\n [class.x-table-sticky]=\"table.getStickyLeft(column) || table.getStickyRight(column)\"\r\n [class.x-table-sticky-left]=\"table.getStickyLeft(column)\"\r\n [class.x-table-sticky-right]=\"table.getStickyRight(column)\"\r\n [class.x-table-sticky-left-last]=\"table.getStickyLeftLast(column)\"\r\n [class.x-table-sticky-right-first]=\"table.getStickyRightFirst(column)\"\r\n [style.left.px]=\"column.left\"\r\n [style.right.px]=\"column.right\"\r\n [ngClass]=\"!rowClass() ? {} : rowClass()!(row, i)\"\r\n >\r\n <ng-template *ngTemplateOutlet=\"cellTpl; context: { column: column, row: row, i: i }\"></ng-template>\r\n </td>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #cellTpl let-column=\"column\" let-row=\"row\" let-i=\"i\">\r\n @switch (column.type) {\r\n @case ('checkbox') {\r\n <x-checkbox\r\n [data]=\"[{ id: true, label: '' }]\"\r\n [(ngModel)]=\"row[column.id]\"\r\n [disabled]=\"row.disabled\"\r\n (ngModelChange)=\"table.bodyChecked($event, column, row)\"\r\n single\r\n ></x-checkbox>\r\n }\r\n @case ('index') {\r\n <div>{{ table.getIndex(i) }}</div>\r\n }\r\n @default {\r\n @if (table.isExpandColumn(column)) {\r\n <x-button\r\n [class.is-leaf]=\"!row.leaf\"\r\n [class.is-expanded]=\"row.expanded\"\r\n (click)=\"onExpanded($event, row)\"\r\n icon=\"fto-chevron-right\"\r\n size=\"mini\"\r\n onlyIcon\r\n flat\r\n plain\r\n class=\"x-table-expand\"\r\n [style.margin-left.rem]=\"row.level - 0.5\"\r\n ></x-button>\r\n }\r\n <ng-container\r\n *xOutlet=\"columnTpl()[column.id]; context: { $column: column, $row: row, $index: table.getIndex(i) }\"\r\n >\r\n <ng-container *xOutlet=\"table.bodyTdTpl(); context: { $column: column, $row: row, $index: table.getIndex(i) }\">\r\n <div [innerHTML]=\"row[column.id]\" [style.text-align]=\"column.textAlign\"></div>\r\n {{ table.rowExpand() && table.rowExpand()!.id === column.id ? 'x-table-body-level-' + row.level : '' }}\r\n </ng-container>\r\n </ng-container>\r\n }\r\n }\r\n</ng-template>\r\n" }]
|
|
1047
|
+
], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<tbody #tbody>\r\n @if (cellConfig()) {\r\n @for (row of data(); track row.id; let i = $index) {\r\n <tr [style.gridTemplateColumns]=\"cellConfig()!.gridTemplateColumns\">\r\n @for (column of cellConfig()!.cells; track column; let j = $index) {\r\n <td\r\n [title]=\"getTitle(row, column)\"\r\n [class.x-table-sticky]=\"table.getStickyLeft(column) || table.getStickyRight(column)\"\r\n [class.x-table-sticky-left]=\"table.getStickyLeft(column)\"\r\n [class.x-table-sticky-right]=\"table.getStickyRight(column)\"\r\n [class.x-table-sticky-left-last]=\"table.getStickyLeftLast(column)\"\r\n [class.x-table-sticky-right-first]=\"table.getStickyRightFirst(column)\"\r\n [style.left.px]=\"column.left\"\r\n [style.right.px]=\"column.right\"\r\n [style.grid-area]=\"column.gridArea\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"cellTpl; context: { column: column, row: row, i: i }\"></ng-container>\r\n </td>\r\n }\r\n </tr>\r\n }\r\n } @else {\r\n @if (virtualScroll()) {\r\n <cdk-virtual-scroll-viewport\r\n #virtualBody\r\n [itemSize]=\"getItemSize()\"\r\n [minBufferPx]=\"minBufferPxSignal()\"\r\n [maxBufferPx]=\"maxBufferPxSignal()\"\r\n [style.height.px]=\"bodyHeightSignal()\"\r\n >\r\n <tr\r\n *cdkVirtualFor=\"let row of data(); let index = index; trackBy: trackByItem\"\r\n [class.x-table-activated]=\"allowSelectRow() && activatedRow()?.id === row.id\"\r\n [style.height.px]=\"getRowHeight()\"\r\n [style.min-height.px]=\"getRowHeight()\"\r\n (click)=\"onRowClick($event, row)\"\r\n >\r\n <!-- rowHeight \u4E3A 0 \u7684\u65F6\u5019\uFF0Cindex \u4E0B\u6807\u83B7\u53D6\u4E0D\u5230 -->\r\n <ng-container *ngTemplateOutlet=\"rowTpl; context: { row: row, i: getIndex(index, row) }\"></ng-container>\r\n </tr>\r\n </cdk-virtual-scroll-viewport>\r\n } @else {\r\n @for (row of data(); track row.id; let i = $index) {\r\n <tr\r\n [class.x-table-activated]=\"allowSelectRow() && activatedRow()?.id === row.id\"\r\n [style.height.px]=\"getRowHeight()\"\r\n [style.min-height.px]=\"getRowHeight()\"\r\n (click)=\"onRowClick($event, row)\"\r\n >\r\n <ng-container *ngTemplateOutlet=\"rowTpl; context: { row: row, i: i }\"></ng-container>\r\n </tr>\r\n @if (table.treeTable() && row.children && row.expanded) {\r\n <div class=\"x-table-children\" [class.x-table-expandTpl]=\"expandTpl()\">\r\n <x-table-body\r\n [data]=\"row.children\"\r\n [columns]=\"table.columns()\"\r\n [itemSize]=\"table.itemSize()\"\r\n [rowHeight]=\"table.rowHeight()\"\r\n [columnTpl]=\"table.bodyColumnTpl()\"\r\n [allowSelectRow]=\"table.allowSelectRow()\"\r\n [rowClass]=\"table.rowClass()\"\r\n [cellConfig]=\"table.cellConfig()?.tbody\"\r\n [(activatedRow)]=\"table.activatedRow\"\r\n [expandedAll]=\"expandedAll()\"\r\n [expandTpl]=\"expandTpl()\"\r\n [level]=\"row.level! + 1\"\r\n ></x-table-body>\r\n </div>\r\n }\r\n }\r\n }\r\n }\r\n @if (table.showEmpty() && isEmpty() && level() === 0) {\r\n <x-empty [img]=\"table.emptyImg()!\" [content]=\"table.emptyContent()!\"></x-empty>\r\n }\r\n</tbody>\r\n\r\n<ng-template #rowTpl let-row=\"row\" let-i=\"i\">\r\n @if (level() > 0 && expandTpl()) {\r\n <ng-container *xOutlet=\"expandTpl(); context: { $row: row, $index: i, $level: level() }\"></ng-container>\r\n } @else if (level() === 0 || !expandTpl()) {\r\n <ng-container *xOutlet=\"rowDefault; context: { row: row, i: i, level: level() }\"></ng-container>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #rowDefault let-row=\"row\" let-i=\"i\">\r\n @for (column of columns(); track column.id; let j = $index) {\r\n <td\r\n [style.width.px]=\"column.width\"\r\n [style.flex]=\"getFlex(column)\"\r\n [title]=\"getTitle(row, column)\"\r\n [class.x-table-dragging]=\"column.dragging\"\r\n [class.x-table-sticky]=\"table.getStickyLeft(column) || table.getStickyRight(column)\"\r\n [class.x-table-sticky-left]=\"table.getStickyLeft(column)\"\r\n [class.x-table-sticky-right]=\"table.getStickyRight(column)\"\r\n [class.x-table-sticky-left-last]=\"table.getStickyLeftLast(column)\"\r\n [class.x-table-sticky-right-first]=\"table.getStickyRightFirst(column)\"\r\n [style.left.px]=\"column.left\"\r\n [style.right.px]=\"column.right\"\r\n [ngClass]=\"!rowClass() ? {} : rowClass()!(row, i)\"\r\n >\r\n <ng-template *ngTemplateOutlet=\"cellTpl; context: { column: column, row: row, i: i }\"></ng-template>\r\n </td>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #cellTpl let-column=\"column\" let-row=\"row\" let-i=\"i\">\r\n @switch (column.type) {\r\n @case ('checkbox') {\r\n <x-checkbox\r\n [data]=\"[{ id: true, label: '' }]\"\r\n [(ngModel)]=\"row[column.id]\"\r\n [disabled]=\"row.disabled\"\r\n (ngModelChange)=\"table.bodyChecked($event, column, row)\"\r\n single\r\n ></x-checkbox>\r\n }\r\n @case ('index') {\r\n <div>{{ table.getIndex(i) }}</div>\r\n }\r\n @default {\r\n @if (table.isExpandColumn(column)) {\r\n <x-button\r\n [class.is-leaf]=\"!row.leaf\"\r\n [class.is-expanded]=\"row.expanded\"\r\n (click)=\"onExpanded($event, row)\"\r\n icon=\"fto-chevron-right\"\r\n size=\"mini\"\r\n onlyIcon\r\n flat\r\n plain\r\n class=\"x-table-expand\"\r\n [style.margin-left.rem]=\"row.level - 0.5\"\r\n ></x-button>\r\n }\r\n <ng-container\r\n *xOutlet=\"columnTpl()[column.id]; context: { $column: column, $row: row, $index: table.getIndex(i) }\"\r\n >\r\n <ng-container *xOutlet=\"table.bodyTdTpl(); context: { $column: column, $row: row, $index: table.getIndex(i) }\">\r\n @if ((table.bodyInnerHTML() && column.innerHTML !== false) || column.innerHTML) {\r\n <div [innerHTML]=\"setDomSanitizer(row[column.id])\" [style.text-align]=\"column.textAlign\"></div>\r\n } @else {\r\n <div [style.text-align]=\"column.textAlign\">{{ row[column.id] }}</div>\r\n }\r\n {{ table.rowExpand() && table.rowExpand()!.id === column.id ? 'x-table-body-level-' + row.level : '' }}\r\n </ng-container>\r\n </ng-container>\r\n }\r\n }\r\n</ng-template>\r\n" }]
|
|
1038
1048
|
}], ctorParameters: () => [] });
|
|
1039
1049
|
|
|
1040
1050
|
class XTableComponent extends XTableProperty {
|