@colijnit/corecomponents_v12 12.2.27 → 12.2.29
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bundles/colijnit-corecomponents_v12.umd.js +120 -9
- package/bundles/colijnit-corecomponents_v12.umd.js.map +1 -1
- package/colijnit-corecomponents_v12.metadata.json +1 -1
- package/esm2015/lib/components/input-text/input-text.component.js +7 -3
- package/esm2015/lib/components/simple-grid/base-simple-grid.component.js +3 -1
- package/esm2015/lib/components/simple-grid/simple-grid-column.directive.js +3 -1
- package/esm2015/lib/components/simple-grid/simple-grid.component.js +182 -35
- package/esm2015/lib/components/simple-grid/simple-grid.module.js +6 -2
- package/fesm2015/colijnit-corecomponents_v12.js +192 -37
- package/fesm2015/colijnit-corecomponents_v12.js.map +1 -1
- package/lib/components/input-text/input-text.component.d.ts +1 -0
- package/lib/components/simple-grid/base-simple-grid.component.d.ts +1 -0
- package/lib/components/simple-grid/simple-grid-column.directive.d.ts +1 -0
- package/lib/components/simple-grid/simple-grid.component.d.ts +15 -1
- package/lib/components/simple-grid/style/_layout.scss +68 -0
- package/package.json +1 -1
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
(function (global, factory) {
|
|
2
|
-
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/forms'), require('rxjs'), require('@angular/platform-browser'), require('@angular/animations'), require('@angular/common'), require('@angular/common/http'), require('rxjs/operators'), require('three'), require('three/examples/jsm/renderers/CSS3DRenderer'), require('@tweenjs/tween.js'), require('hammerjs'), require('@angular/cdk/drag-drop'), require('@angular/cdk/overlay'), require('@angular/cdk/portal'), require('@angular/cdk/scrolling'), require('@colijnit/ioneconnector/build/utils/array-utils'), require('@colijnit/ioneconnector/build/model/default-get-object-configurations-params'), require('@colijnit/ioneconnector/build/model/object-configuration')) :
|
|
3
|
-
typeof define === 'function' && define.amd ? define('@colijnit/corecomponents_v12', ['exports', '@angular/core', '@angular/forms', 'rxjs', '@angular/platform-browser', '@angular/animations', '@angular/common', '@angular/common/http', 'rxjs/operators', 'three', 'three/examples/jsm/renderers/CSS3DRenderer', '@tweenjs/tween.js', 'hammerjs', '@angular/cdk/drag-drop', '@angular/cdk/overlay', '@angular/cdk/portal', '@angular/cdk/scrolling', '@colijnit/ioneconnector/build/utils/array-utils', '@colijnit/ioneconnector/build/model/default-get-object-configurations-params', '@colijnit/ioneconnector/build/model/object-configuration'], factory) :
|
|
4
|
-
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.colijnit = global.colijnit || {}, global.colijnit.corecomponents_v12 = {}), global.ng.core, global.ng.forms, global.rxjs, global.ng.platformBrowser, global.ng.animations, global.ng.common, global.ng.common.http, global.rxjs.operators, global.three, global.CSS3DRenderer, global.TWEEN, null, global.ng.cdk.dragDrop, global.ng.cdk.overlay, global.ng.cdk.portal, global.ng.cdk.scrolling, global.arrayUtils, global.defaultGetObjectConfigurationsParams, global.objectConfiguration));
|
|
5
|
-
})(this, (function (exports, i0, forms, rxjs, platformBrowser, animations, common, http, operators, three, CSS3DRenderer, TWEEN, hammerjs, dragDrop, i1, portal, scrolling, arrayUtils, defaultGetObjectConfigurationsParams, objectConfiguration) { 'use strict';
|
|
2
|
+
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/forms'), require('rxjs'), require('@angular/platform-browser'), require('@angular/animations'), require('@angular/common'), require('@angular/common/http'), require('rxjs/operators'), require('three'), require('three/examples/jsm/renderers/CSS3DRenderer'), require('@tweenjs/tween.js'), require('hammerjs'), require('@angular/cdk/drag-drop'), require('@angular/cdk/overlay'), require('@angular/cdk/portal'), require('xlsx'), require('@angular/cdk/scrolling'), require('@colijnit/ioneconnector/build/utils/array-utils'), require('@colijnit/ioneconnector/build/model/default-get-object-configurations-params'), require('@colijnit/ioneconnector/build/model/object-configuration')) :
|
|
3
|
+
typeof define === 'function' && define.amd ? define('@colijnit/corecomponents_v12', ['exports', '@angular/core', '@angular/forms', 'rxjs', '@angular/platform-browser', '@angular/animations', '@angular/common', '@angular/common/http', 'rxjs/operators', 'three', 'three/examples/jsm/renderers/CSS3DRenderer', '@tweenjs/tween.js', 'hammerjs', '@angular/cdk/drag-drop', '@angular/cdk/overlay', '@angular/cdk/portal', 'xlsx', '@angular/cdk/scrolling', '@colijnit/ioneconnector/build/utils/array-utils', '@colijnit/ioneconnector/build/model/default-get-object-configurations-params', '@colijnit/ioneconnector/build/model/object-configuration'], factory) :
|
|
4
|
+
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.colijnit = global.colijnit || {}, global.colijnit.corecomponents_v12 = {}), global.ng.core, global.ng.forms, global.rxjs, global.ng.platformBrowser, global.ng.animations, global.ng.common, global.ng.common.http, global.rxjs.operators, global.three, global.CSS3DRenderer, global.TWEEN, null, global.ng.cdk.dragDrop, global.ng.cdk.overlay, global.ng.cdk.portal, global.XLSX, global.ng.cdk.scrolling, global.arrayUtils, global.defaultGetObjectConfigurationsParams, global.objectConfiguration));
|
|
5
|
+
})(this, (function (exports, i0, forms, rxjs, platformBrowser, animations, common, http, operators, three, CSS3DRenderer, TWEEN, hammerjs, dragDrop, i1, portal, XLSX, scrolling, arrayUtils, defaultGetObjectConfigurationsParams, objectConfiguration) { 'use strict';
|
|
6
6
|
|
|
7
7
|
function _interopNamespace(e) {
|
|
8
8
|
if (e && e.__esModule) return e;
|
|
@@ -25,6 +25,7 @@
|
|
|
25
25
|
var i0__namespace = /*#__PURE__*/_interopNamespace(i0);
|
|
26
26
|
var TWEEN__namespace = /*#__PURE__*/_interopNamespace(TWEEN);
|
|
27
27
|
var i1__namespace = /*#__PURE__*/_interopNamespace(i1);
|
|
28
|
+
var XLSX__namespace = /*#__PURE__*/_interopNamespace(XLSX);
|
|
28
29
|
|
|
29
30
|
/******************************************************************************
|
|
30
31
|
Copyright (c) Microsoft Corporation.
|
|
@@ -6208,6 +6209,7 @@
|
|
|
6208
6209
|
_this.excludePlusMinus = true;
|
|
6209
6210
|
_this.showClearButton = true;
|
|
6210
6211
|
_this.showPlaceholderOnFocus = true;
|
|
6212
|
+
_this.selectOnFocus = false;
|
|
6211
6213
|
_this.noStyle = false;
|
|
6212
6214
|
_this.hideArrowButtons = false;
|
|
6213
6215
|
_this.leftIconClick = new i0.EventEmitter();
|
|
@@ -6318,12 +6320,14 @@
|
|
|
6318
6320
|
InputTextComponent.prototype.handleInputFocus = function (event) {
|
|
6319
6321
|
event.preventDefault();
|
|
6320
6322
|
event.stopPropagation();
|
|
6323
|
+
if (this.selectOnFocus) {
|
|
6324
|
+
this.input.select();
|
|
6325
|
+
}
|
|
6321
6326
|
this.isFocused.emit(this.focused);
|
|
6322
6327
|
};
|
|
6323
6328
|
InputTextComponent.prototype.handleBlur = function (event) {
|
|
6324
6329
|
event.preventDefault();
|
|
6325
6330
|
event.stopPropagation();
|
|
6326
|
-
this.focused = false;
|
|
6327
6331
|
this.isFocused.emit(false);
|
|
6328
6332
|
};
|
|
6329
6333
|
InputTextComponent.prototype.clearInput = function (event) {
|
|
@@ -6335,7 +6339,7 @@
|
|
|
6335
6339
|
InputTextComponent.decorators = [
|
|
6336
6340
|
{ type: i0.Component, args: [{
|
|
6337
6341
|
selector: 'co-input-text',
|
|
6338
|
-
template: "\n <div class=\"input-text-wrapper\" overlayParent #parentForOverlay=\"overlayParent\">\n <co-icon *ngIf=\"leftIcon || leftIconData\" class=\"input-text-left-icon\" [icon]=\"leftIcon\" [iconData]=\"leftIconData\"\n (click)=\"handleLeftIconClick($event)\" (mousedown)=\"handleLeftIconMouseDown($event)\"\n (mouseup)=\"handleLeftIconMouseUp($event)\"></co-icon>\n <div *ngIf=\"leftIcon || leftIconData\" class=\"spacer left-icon\"></div>\n <div class=\"input-wrapper\">\n <label *ngIf=\"showPlaceholderOnFocus || (!showPlaceholderOnFocus && !hasValue && !focused)\"\n [textContent]=\"placeholder\"></label>\n <input #input\n [class.input-input-hidden]=\"useContent\"\n [ngClass]=\"align\"\n [type]=\"digitsOnly ? 'number' : type\"\n [pattern]=\"type === 'date' ? pattern : undefined\"\n [ngModel]=\"model\"\n [min]=\"(type === 'number' || type === 'date') && this.min ? this.min : undefined\"\n [max]=\"(type === 'number' || type === 'date') && this.max ? this.max : undefined\"\n [readonly]=\"readonly\"\n [required]=\"required\"\n (ngModelChange)=\"modelChange.emit($event)\"\n (keydown)=\"digitsOnly ? excludeNonDigitChars($event) : true\"\n (keyup)=\"keyUp.emit($event)\"\n (focusin)=\"handleInputFocus($event)\"\n (focusout)=\"handleBlur($event)\"\n >\n <ng-container *ngIf=\"useContent\">\n <div class=\"input-content-wrapper\">\n <ng-content></ng-content>\n </div>\n </ng-container>\n <co-icon [class.show]=\"showClearButton && hasValue &&
|
|
6342
|
+
template: "\n <div class=\"input-text-wrapper\" overlayParent #parentForOverlay=\"overlayParent\">\n <co-icon *ngIf=\"leftIcon || leftIconData\" class=\"input-text-left-icon\" [icon]=\"leftIcon\" [iconData]=\"leftIconData\"\n (click)=\"handleLeftIconClick($event)\" (mousedown)=\"handleLeftIconMouseDown($event)\"\n (mouseup)=\"handleLeftIconMouseUp($event)\"></co-icon>\n <div *ngIf=\"leftIcon || leftIconData\" class=\"spacer left-icon\"></div>\n <div class=\"input-wrapper\">\n <label *ngIf=\"showPlaceholderOnFocus || (!showPlaceholderOnFocus && !hasValue && !focused)\"\n [textContent]=\"placeholder\"></label>\n <input #input\n [class.input-input-hidden]=\"useContent\"\n [ngClass]=\"align\"\n [type]=\"digitsOnly ? 'number' : type\"\n [pattern]=\"type === 'date' ? pattern : undefined\"\n [ngModel]=\"model\"\n [min]=\"(type === 'number' || type === 'date') && this.min ? this.min : undefined\"\n [max]=\"(type === 'number' || type === 'date') && this.max ? this.max : undefined\"\n [readonly]=\"readonly\"\n [required]=\"required\"\n (ngModelChange)=\"modelChange.emit($event)\"\n (keydown)=\"digitsOnly ? excludeNonDigitChars($event) : true\"\n (keyup)=\"keyUp.emit($event)\"\n (focusin)=\"handleInputFocus($event)\"\n (focusout)=\"handleBlur($event)\"\n >\n <ng-container *ngIf=\"useContent\">\n <div class=\"input-content-wrapper\">\n <ng-content></ng-content>\n </div>\n </ng-container>\n <co-icon [class.show]=\"showClearButton && hasValue && !readonly\" class=\"input-text-clear-button\" [icon]=\"icons.CrossSkinny\" (click)=\"clearInput($event)\"></co-icon>\n <div class=\"required-indicator\"></div>\n </div>\n <div *ngIf=\"rightIcon || rightIconData\" class=\"spacer right-icon\"></div>\n <co-icon *ngIf=\"rightIcon || rightIconData\" class=\"input-text-right-icon\" [icon]=\"rightIcon\" [iconData]=\"rightIconData\"\n (click)=\"handleRightIconClick($event)\" (mousedown)=\"handleRightIconMouseDown($event)\" (mouseup)=\"handleRightIconMouseUp($event)\"></co-icon>\n </div>\n <!--\n <co-commit-buttons *ngIf=\"showSaveCancel && focused && canSaveOrCancel\"\n [committing]=\"committing\"\n [commitFinished]=\"commitFinished\"\n (commitClick)=\"commitClick($event)\"\n (cancelClick)=\"cancelClick($event)\"\n >\n </co-commit-buttons>\n -->\n ",
|
|
6339
6343
|
providers: [
|
|
6340
6344
|
OverlayService, {
|
|
6341
6345
|
provide: SCREEN_CONFIG_ADAPTER_COMPONENT_INTERFACE_NAME,
|
|
@@ -6374,6 +6378,7 @@
|
|
|
6374
6378
|
rightIcon: [{ type: i0.Input }],
|
|
6375
6379
|
leftIconData: [{ type: i0.Input }],
|
|
6376
6380
|
rightIconData: [{ type: i0.Input }],
|
|
6381
|
+
selectOnFocus: [{ type: i0.Input }],
|
|
6377
6382
|
noStyle: [{ type: i0.HostBinding, args: ['class.no-style',] }, { type: i0.Input }],
|
|
6378
6383
|
hideArrowButtons: [{ type: i0.Input }, { type: i0.HostBinding, args: ['class.hide-arrows',] }],
|
|
6379
6384
|
isDate: [{ type: i0.HostBinding, args: ["class.isDate",] }],
|
|
@@ -9589,6 +9594,7 @@
|
|
|
9589
9594
|
this.resizable = true;
|
|
9590
9595
|
this.required = false;
|
|
9591
9596
|
this.autoFit = false;
|
|
9597
|
+
this.isSelected = false;
|
|
9592
9598
|
this.readonly = false;
|
|
9593
9599
|
this.order = 0;
|
|
9594
9600
|
this.singleColumn = false;
|
|
@@ -9698,6 +9704,7 @@
|
|
|
9698
9704
|
resizable: [{ type: i0.Input }],
|
|
9699
9705
|
required: [{ type: i0.Input }],
|
|
9700
9706
|
autoFit: [{ type: i0.Input }],
|
|
9707
|
+
isSelected: [{ type: i0.Input }],
|
|
9701
9708
|
width: [{ type: i0.Input }],
|
|
9702
9709
|
readonly: [{ type: i0.Input }],
|
|
9703
9710
|
collection: [{ type: i0.Input }],
|
|
@@ -9729,6 +9736,7 @@
|
|
|
9729
9736
|
this.rowVisible = new i0.EventEmitter();
|
|
9730
9737
|
this.columns = [];
|
|
9731
9738
|
this.headerColumns = [];
|
|
9739
|
+
this.headerColumnsCopy = [];
|
|
9732
9740
|
this._data = [];
|
|
9733
9741
|
this.disabledRows = [];
|
|
9734
9742
|
this._prepared = false;
|
|
@@ -9816,6 +9824,7 @@
|
|
|
9816
9824
|
this.disabledRows.length = 0;
|
|
9817
9825
|
if (this.columns && this.columns.length > 0) {
|
|
9818
9826
|
this.headerColumns = this.columns.filter(function (c) { return !c.singleColumn; });
|
|
9827
|
+
this.headerColumnsCopy = this.headerColumns;
|
|
9819
9828
|
var singleColumnIndex = -1;
|
|
9820
9829
|
for (var i = 0; i < this.columns.length; i++) {
|
|
9821
9830
|
if (this.columns[i].singleColumn) {
|
|
@@ -9881,8 +9890,9 @@
|
|
|
9881
9890
|
|
|
9882
9891
|
var SimpleGridComponent = /** @class */ (function (_super) {
|
|
9883
9892
|
__extends(SimpleGridComponent, _super);
|
|
9884
|
-
function SimpleGridComponent(_changeDetection, _formMaster) {
|
|
9893
|
+
function SimpleGridComponent(icons, _changeDetection, _formMaster) {
|
|
9885
9894
|
var _this = _super.call(this) || this;
|
|
9895
|
+
_this.icons = icons;
|
|
9886
9896
|
_this._changeDetection = _changeDetection;
|
|
9887
9897
|
_this._formMaster = _formMaster;
|
|
9888
9898
|
_this.defaultTextAlign = exports.ColumnAlign.Left;
|
|
@@ -9890,12 +9900,16 @@
|
|
|
9890
9900
|
_this.showDelete = false;
|
|
9891
9901
|
_this.editOnCellClick = true;
|
|
9892
9902
|
_this.rightToolbar = false;
|
|
9903
|
+
_this.showGridSettings = false;
|
|
9893
9904
|
_this.rowsPerPage = 1000;
|
|
9894
9905
|
_this.editing = false;
|
|
9906
|
+
_this.isSettingsMenuOpen = false;
|
|
9895
9907
|
_this.editRowIndex = -1;
|
|
9896
9908
|
_this.editCellIndex = -1;
|
|
9897
9909
|
_this.selectedRowIndex = -1;
|
|
9898
9910
|
_this.currentPage = 1;
|
|
9911
|
+
_this.sortDirection = 'asc';
|
|
9912
|
+
_this.Icons = exports.CoreComponentsIcon;
|
|
9899
9913
|
_this._doubleClicked = false;
|
|
9900
9914
|
_this._newRow = false;
|
|
9901
9915
|
_this.dataChanged.subscribe(function () {
|
|
@@ -10131,6 +10145,99 @@
|
|
|
10131
10145
|
});
|
|
10132
10146
|
});
|
|
10133
10147
|
};
|
|
10148
|
+
SimpleGridComponent.prototype.toggleSettingsMenu = function () {
|
|
10149
|
+
this.headerColumnsCopy.forEach(function (i) { return i.isSelected = false; });
|
|
10150
|
+
this.isSettingsMenuOpen = !this.isSettingsMenuOpen;
|
|
10151
|
+
};
|
|
10152
|
+
SimpleGridComponent.prototype.toggleColumnMenu = function (col) {
|
|
10153
|
+
if (!this.showGridSettings) {
|
|
10154
|
+
return;
|
|
10155
|
+
}
|
|
10156
|
+
this.isSettingsMenuOpen = false;
|
|
10157
|
+
if (col.isSelected) {
|
|
10158
|
+
col.isSelected = false;
|
|
10159
|
+
}
|
|
10160
|
+
else {
|
|
10161
|
+
this.headerColumnsCopy.forEach(function (i) { return i.isSelected = false; });
|
|
10162
|
+
col.isSelected = true;
|
|
10163
|
+
}
|
|
10164
|
+
};
|
|
10165
|
+
SimpleGridComponent.prototype.hideColumn = function (col) {
|
|
10166
|
+
col.isSelected = false;
|
|
10167
|
+
this.headerColumnsCopy = this.headerColumnsCopy.filter(function (obj) {
|
|
10168
|
+
return obj !== col;
|
|
10169
|
+
});
|
|
10170
|
+
};
|
|
10171
|
+
// TODO Fix this sort method
|
|
10172
|
+
// public sortColumn(col: any, columnValue: string): void {
|
|
10173
|
+
// console.log(col);
|
|
10174
|
+
// console.log("columnValue " + columnValue);
|
|
10175
|
+
// col.isSelected = false;
|
|
10176
|
+
//
|
|
10177
|
+
// if (this.sortColumnValue === columnValue) {
|
|
10178
|
+
// this.sortDirection = this.sortDirection === 'asc' ? 'desc' : 'asc';
|
|
10179
|
+
// } else {
|
|
10180
|
+
// this.sortColumnValue = columnValue;
|
|
10181
|
+
// this.sortDirection = 'asc';
|
|
10182
|
+
// }
|
|
10183
|
+
//
|
|
10184
|
+
// console.log(this.data);
|
|
10185
|
+
// // this.data = this._sortData(this.data);
|
|
10186
|
+
//
|
|
10187
|
+
//
|
|
10188
|
+
// this.data.sort((a, b) => {
|
|
10189
|
+
// const sign = this.sortDirection === 'asc' ? 1 : -1;
|
|
10190
|
+
//
|
|
10191
|
+
// console.log("a " + a);
|
|
10192
|
+
// console.log("b " + b);
|
|
10193
|
+
// console.log(a[this.sortColumnValue]);
|
|
10194
|
+
// console.log(b[this.sortColumnValue]);
|
|
10195
|
+
// console.log("sign " + sign);
|
|
10196
|
+
//
|
|
10197
|
+
// if (a[this.sortColumnValue] < b[this.sortColumnValue]) {
|
|
10198
|
+
// return -1 * sign;
|
|
10199
|
+
// } else if (a[this.sortColumnValue] > b[this.sortColumnValue]) {
|
|
10200
|
+
// return 1 * sign;
|
|
10201
|
+
// }
|
|
10202
|
+
// return 0;
|
|
10203
|
+
// });
|
|
10204
|
+
//
|
|
10205
|
+
//
|
|
10206
|
+
//
|
|
10207
|
+
// this._detectChanges();
|
|
10208
|
+
// // this.data.sort((a, b) => a[this.sortColumnValue] - b[this.sortColumnValue]);
|
|
10209
|
+
// console.log(this.data);
|
|
10210
|
+
// }
|
|
10211
|
+
SimpleGridComponent.prototype._sortData = function (tableData) {
|
|
10212
|
+
var _this = this;
|
|
10213
|
+
return tableData.sort(function (a, b) {
|
|
10214
|
+
var sign = _this.sortDirection === 'asc' ? 1 : -1;
|
|
10215
|
+
console.log("a " + a);
|
|
10216
|
+
console.log("b " + b);
|
|
10217
|
+
console.log(a[_this.sortColumnValue]);
|
|
10218
|
+
console.log(b[_this.sortColumnValue]);
|
|
10219
|
+
console.log("sign " + sign);
|
|
10220
|
+
if (a[_this.sortColumnValue] < b[_this.sortColumnValue]) {
|
|
10221
|
+
return -1 * sign;
|
|
10222
|
+
}
|
|
10223
|
+
else if (a[_this.sortColumnValue] > b[_this.sortColumnValue]) {
|
|
10224
|
+
return 1 * sign;
|
|
10225
|
+
}
|
|
10226
|
+
return 0;
|
|
10227
|
+
});
|
|
10228
|
+
};
|
|
10229
|
+
SimpleGridComponent.prototype.showAllColumns = function () {
|
|
10230
|
+
this.isSettingsMenuOpen = false;
|
|
10231
|
+
this.headerColumnsCopy = this.headerColumns;
|
|
10232
|
+
};
|
|
10233
|
+
SimpleGridComponent.prototype.exportToExcel = function () {
|
|
10234
|
+
this.isSettingsMenuOpen = false;
|
|
10235
|
+
var element = document.getElementById('simple-grid-table');
|
|
10236
|
+
var ws = XLSX__namespace.utils.table_to_sheet(element);
|
|
10237
|
+
var wb = XLSX__namespace.utils.book_new();
|
|
10238
|
+
XLSX__namespace.utils.book_append_sheet(wb, ws, 'Sheet1');
|
|
10239
|
+
XLSX__namespace.writeFile(wb, 'ExcelSheet.xlsx');
|
|
10240
|
+
};
|
|
10134
10241
|
SimpleGridComponent.prototype.prepareDataRow = function (row, index) {
|
|
10135
10242
|
this.isRowDisabled(row, index);
|
|
10136
10243
|
};
|
|
@@ -10282,7 +10389,7 @@
|
|
|
10282
10389
|
SimpleGridComponent.decorators = [
|
|
10283
10390
|
{ type: i0.Component, args: [{
|
|
10284
10391
|
selector: 'co-simple-grid',
|
|
10285
|
-
template: "\n <co-grid-toolbar *ngIf=\"showToolbar\" [class.right]=\"rightToolbar\"\n [showEdit]=\"showEdit\"\n [showAdd]=\"showAdd\"\n [showDelete]=\"showDelete\"\n [deleteEnabled]=\"selectedRowIndex > -1\"\n (addClick)=\"addNewRow()\"\n (editClick)=\"editRow($event)\"\n (saveClick)=\"validateAndSave()\"\n (cancelClick)=\"cancelEditRow()\"\n (deleteClick)=\"removeRow()\"\n ></co-grid-toolbar>\n <table
|
|
10392
|
+
template: "\n <co-grid-toolbar *ngIf=\"showToolbar\" [class.right]=\"rightToolbar\"\n [showEdit]=\"showEdit\"\n [showAdd]=\"showAdd\"\n [showDelete]=\"showDelete\"\n [deleteEnabled]=\"selectedRowIndex > -1\"\n (addClick)=\"addNewRow()\"\n (editClick)=\"editRow($event)\"\n (saveClick)=\"validateAndSave()\"\n (cancelClick)=\"cancelEditRow()\"\n (deleteClick)=\"removeRow()\"\n ></co-grid-toolbar>\n <table\n id=\"simple-grid-table\"\n class=\"simple-grid-table\"\n [clickOutside]=\"editing\"\n (clickOutside)=\"handleClickOutsideRow()\">\n <colgroup>\n <col *ngFor=\"let column of headerColumnsCopy; let index = index\"\n [class.simple-grid-column-auto-fit]=\"column.autoFit\"\n [style.width.px]=\"column.width\"\n [style.min-width.px]=\"MIN_COLUMN_WIDTH\">\n </colgroup>\n <thead>\n <tr>\n <th\n scope=\"col\"\n #headerCell\n class=\"simple-grid-column-header\"\n *ngFor=\"let column of headerColumnsCopy; let index = index\">\n <div\n class=\"simple-grid-column-header-wrapper\"\n [class.resizable]=\"resizable\"\n [class.selected]=\"column.isSelected\"\n [ngClass]=\"column.textAlign ? column.textAlign : defaultTextAlign\">\n <ng-container *ngIf=\"column.headerTemplate; else noHeaderTemplate\">\n <ng-container [ngTemplateOutlet]=\"column.headerTemplate\"></ng-container>\n </ng-container>\n <ng-template #noHeaderTemplate>\n <div class=\"simple-grid-column-header-label\"\n [ngClass]=\"column.textAlign ? column.textAlign : defaultTextAlign\"\n [class.with-menu]=\"showGridSettings\"\n [textContent]=\"column.headerText || ' '\"\n (click)=\"toggleColumnMenu(column)\">\n </div>\n\n <div class=\"column-menu\" *ngIf=\"column.isSelected\">\n <h3 [textContent]=\"'COLUMN_OPTIONS' | coreLocalize\"></h3>\n <ul>\n <li (click)=\"hideColumn(column)\">Hide Column</li>\n<!-- <li (click)=\"sortColumn(column, column.field)\">Sort Column</li>-->\n </ul>\n </div>\n </ng-template>\n <div *ngIf=\"resizable && column.resizable\" class=\"simple-grid-column-sizer\"\n (mousedown)=\"handleSizerMouseDown($event, column)\"\n ></div>\n </div>\n </th>\n <th *ngIf=\"showGridSettings\" class=\"simple-grid-column-header grid-settings\">\n <co-button\n [class.selected]=\"isSettingsMenuOpen\"\n [iconData]=\"icons.getIcon(Icons.CogWheels)\"\n (click)=\"toggleSettingsMenu()\">\n </co-button>\n\n <div class=\"settings-menu\" *ngIf=\"isSettingsMenuOpen\">\n <h3 [textContent]=\"'GRID_OPTIONS' | coreLocalize\"></h3>\n <ul>\n <li (click)=\"exportToExcel()\">Export to Excel</li>\n <li *ngIf=\"headerColumnsCopy.length !== headerColumns.length\" (click)=\"showAllColumns()\">Show All\n Columns\n </li>\n </ul>\n </div>\n </th>\n </tr>\n </thead>\n <tbody #dropList cdkDropList cdkDropListOrientation=\"vertical\"\n class=\"simple-grid-drag-drop-list\"\n [cdkDropListDisabled]=\"!dragDropEnabled || editing\"\n [cdkDropListData]=\"data\"\n [cdkDropListEnterPredicate]=\"handleCanDragDrop\"\n (cdkDropListDropped)=\"handleDrop($event)\">\n <tr\n class=\"simple-grid-row\"\n [class.selected]=\"rowIndex === selectedRowIndex && !editing\" observeVisibility\n [class.disabled]=\"getIsRowDisabled(rowIndex)\"\n [class.editing]=\"rowIndex === editRowIndex\"\n *ngFor=\"let row of (!!rowsPerPage ? (data | paginate: {itemsPerPage: rowsPerPage, currentPage: currentPage}) : data); last as last; let rowIndex = index\"\n cdkDrag\n (click)=\"handleClickRow($event, rowIndex, row)\" (dblclick)=\"handleDblClickRow($event, rowIndex, row)\"\n (visibilityChange)=\"rowVisible.next(row)\">\n <co-form class=\"simple-grid-row-form\">\n <ng-container *ngIf=\"isSingleColumnRow(row)\">\n <td class=\"simple-grid-single-column-cell\" [attr.colspan]=\"headerColumnsCopy.length\">\n <co-simple-grid-cell\n [column]=\"columns[singleColumnIndex(row)]\"\n [row]=\"row\"\n [editMode]=\"false\"\n ></co-simple-grid-cell>\n </td>\n </ng-container>\n <ng-container *ngIf=\"!isSingleColumnRow(row)\">\n <ng-container *ngFor=\"let column of headerColumnsCopy; let columnIndex = index\">\n <td class=\"simple-grid-column-cell\" *ngIf=\"columnIndex !== singleColumnIndex(row)\">\n <co-simple-grid-cell\n [column]=\"column\"\n [row]=\"row\"\n [editMode]=\"inlineEdit && editing && rowIndex === editRowIndex\"\n [fieldEditMode]=\"editCellIndex === columnIndex && rowIndex === editRowIndex\"\n (cellClick)=\"handleCellClick($event, row, rowIndex, columnIndex)\"\n ></co-simple-grid-cell>\n <div *ngIf=\"column.resizable\" class=\"simple-grid-column-sizer-placeholder\"></div>\n </td>\n </ng-container>\n </ng-container>\n <td *ngIf=\"showGridSettings\"></td>\n </co-form>\n </tr>\n </tbody>\n </table>\n <co-pagination-bar *ngIf=\"data?.length > rowsPerPage\" class=\"pagination-bar\"\n [itemsPerPage]=\"rowsPerPage\"\n [currentPage]=\"currentPage\"\n [totalItems]=\"data.length\"\n [autoHide]=\"true\"\n (previousClick)=\"goToPreviousPage()\"\n (nextClick)=\"goToNextPage()\"\n (pageClick)=\"setCurrentPage($event)\"\n ></co-pagination-bar>\n ",
|
|
10286
10393
|
providers: [
|
|
10287
10394
|
FormMasterService
|
|
10288
10395
|
],
|
|
@@ -10291,6 +10398,7 @@
|
|
|
10291
10398
|
},] }
|
|
10292
10399
|
];
|
|
10293
10400
|
SimpleGridComponent.ctorParameters = function () { return [
|
|
10401
|
+
{ type: IconCacheService },
|
|
10294
10402
|
{ type: i0.ChangeDetectorRef },
|
|
10295
10403
|
{ type: FormMasterService }
|
|
10296
10404
|
]; };
|
|
@@ -10300,6 +10408,7 @@
|
|
|
10300
10408
|
showDelete: [{ type: i0.Input }],
|
|
10301
10409
|
editOnCellClick: [{ type: i0.Input }],
|
|
10302
10410
|
rightToolbar: [{ type: i0.Input }],
|
|
10411
|
+
showGridSettings: [{ type: i0.Input }],
|
|
10303
10412
|
rowsPerPage: [{ type: i0.Input }],
|
|
10304
10413
|
rowDisabledFn: [{ type: i0.Input }],
|
|
10305
10414
|
canRowBeEdittedFn: [{ type: i0.Input }],
|
|
@@ -11036,7 +11145,9 @@
|
|
|
11036
11145
|
ObserveVisibilityModule,
|
|
11037
11146
|
PaginationModule,
|
|
11038
11147
|
PaginationBarModule,
|
|
11039
|
-
ClickoutsideModule
|
|
11148
|
+
ClickoutsideModule,
|
|
11149
|
+
ButtonModule,
|
|
11150
|
+
CoreComponentsTranslationModule
|
|
11040
11151
|
],
|
|
11041
11152
|
declarations: [
|
|
11042
11153
|
SimpleGridComponent,
|