@churchillliving/se-ui-toolkit 6.53.3 → 6.53.5
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/churchillliving-se-ui-toolkit.umd.js +24 -6
- package/bundles/churchillliving-se-ui-toolkit.umd.js.map +1 -1
- package/churchillliving-se-ui-toolkit.metadata.json +1 -1
- package/esm2015/lib/components/base/grid/grid.component.js +23 -5
- package/esm2015/lib/components/base/grid/grid.component.ngfactory.js +1 -1
- package/esm2015/lib/components/base/grid/grid.component.ngsummary.json +1 -1
- package/esm2015/lib/components/shared/global-filters/global-filters.component.js +2 -2
- package/esm2015/lib/components/shared/global-filters/global-filters.component.ngfactory.js +4 -1
- package/esm2015/lib/se-ui-toolkit.module.ngfactory.js +1 -1
- package/esm2015/lib/services/grid.service.js +2 -2
- package/fesm2015/churchillliving-se-ui-toolkit.js +24 -6
- package/fesm2015/churchillliving-se-ui-toolkit.js.map +1 -1
- package/lib/components/base/grid/grid.component.d.ts +2 -0
- package/package.json +1 -1
|
@@ -3052,7 +3052,7 @@
|
|
|
3052
3052
|
props === null || props === void 0 ? void 0 : props.forEach(function (prop) {
|
|
3053
3053
|
var _g, _h, _j;
|
|
3054
3054
|
var _a, _b, _c, _d;
|
|
3055
|
-
if (prop.propName && (prop.propValue || prop.propValue === false) && prop.field) {
|
|
3055
|
+
if (prop.propName && (prop.propValue || prop.propValue === false || prop.propValue === '') && prop.field) {
|
|
3056
3056
|
var fieldName = (_a = Object.keys(row)) === null || _a === void 0 ? void 0 : _a.find(function (key) { var _a; return (key === null || key === void 0 ? void 0 : key.toLowerCase()) === ((_a = prop === null || prop === void 0 ? void 0 : prop.field) === null || _a === void 0 ? void 0 : _a.toLowerCase()); });
|
|
3057
3057
|
if (fieldName) {
|
|
3058
3058
|
if ((_b = row[fieldName]) === null || _b === void 0 ? void 0 : _b.action) {
|
|
@@ -3270,6 +3270,7 @@
|
|
|
3270
3270
|
this.editModeChecked = true;
|
|
3271
3271
|
this.editModeunCkecked = false;
|
|
3272
3272
|
this.calendarFormat = 'mm/dd/y';
|
|
3273
|
+
this.setDropdownFilter = true;
|
|
3273
3274
|
// apply checked/unChecked prop for CheckBox of the Table
|
|
3274
3275
|
this.checked = true;
|
|
3275
3276
|
this.unChecked = false;
|
|
@@ -3357,6 +3358,8 @@
|
|
|
3357
3358
|
this.useServerSideEvents = false;
|
|
3358
3359
|
// Output event to handle row click
|
|
3359
3360
|
this.onRowClick = new i0.EventEmitter();
|
|
3361
|
+
// Output event emit when click on grid checkbox filter
|
|
3362
|
+
this.onCheckBoxFilterClick = new i0.EventEmitter();
|
|
3360
3363
|
// Output event to handle row CheckBox
|
|
3361
3364
|
this.onRowCheckBox = new i0.EventEmitter();
|
|
3362
3365
|
// Output event to trigger on sort change
|
|
@@ -4279,7 +4282,10 @@
|
|
|
4279
4282
|
var _4 = __read(_3, 2), key = _4[0], value = _4[1];
|
|
4280
4283
|
_this.columns.forEach(function (col) {
|
|
4281
4284
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
4282
|
-
_this.
|
|
4285
|
+
if (_this.setDropdownFilter) {
|
|
4286
|
+
_this.setDropdownFilterValue(col, row, key);
|
|
4287
|
+
_this.setDropdownFilter = false;
|
|
4288
|
+
}
|
|
4283
4289
|
// set the autoComplete Value in edit mode
|
|
4284
4290
|
if (col.type === exports.EGridColumnType.AUTOCOMPLETE &&
|
|
4285
4291
|
((_a = col.field) === null || _a === void 0 ? void 0 : _a.toLowerCase()) === (key === null || key === void 0 ? void 0 : key.toLowerCase()) &&
|
|
@@ -4389,7 +4395,14 @@
|
|
|
4389
4395
|
newFilters_1.push(newFilter);
|
|
4390
4396
|
});
|
|
4391
4397
|
}
|
|
4392
|
-
this.gridService.setDropdownData(
|
|
4398
|
+
// this.gridService.setDropdownData(
|
|
4399
|
+
// col,
|
|
4400
|
+
// obj.uniqueKey,
|
|
4401
|
+
// obj.valueProp,
|
|
4402
|
+
// obj.labelProp,
|
|
4403
|
+
// newFilters,
|
|
4404
|
+
// row
|
|
4405
|
+
// );
|
|
4393
4406
|
var option = col.data.find(function (x) { var _a; return x.label === ((_a = row[col.field]) === null || _a === void 0 ? void 0 : _a.toString()); });
|
|
4394
4407
|
if (option) {
|
|
4395
4408
|
row[col.field] = option.value;
|
|
@@ -5377,13 +5390,17 @@
|
|
|
5377
5390
|
GridComponent.prototype.clickCheckBoxFilter = function (column) {
|
|
5378
5391
|
var _a;
|
|
5379
5392
|
if (this.editAllRecord) {
|
|
5380
|
-
if (column.type === exports.EGridColumnType.BOOLEAN
|
|
5381
|
-
|
|
5393
|
+
if (column.type === exports.EGridColumnType.BOOLEAN
|
|
5394
|
+
&&
|
|
5395
|
+
((_a = column === null || column === void 0 ? void 0 : column.filter) === null || _a === void 0 ? void 0 : _a.type) === 'checkbox' && column.filtering != false) {
|
|
5382
5396
|
this.rowsData.forEach(function (row) {
|
|
5383
5397
|
row[column.field] = column.value;
|
|
5384
5398
|
});
|
|
5399
|
+
//this.onCheckBoxFilterClick.emit(column);
|
|
5385
5400
|
}
|
|
5401
|
+
//this.onCheckBoxFilterClick.emit(column);
|
|
5386
5402
|
}
|
|
5403
|
+
this.onCheckBoxFilterClick.emit(column);
|
|
5387
5404
|
};
|
|
5388
5405
|
//set header checkbox value for getting all columns on stay admin
|
|
5389
5406
|
GridComponent.prototype.setHeaderCheckBoxValue = function (value) {
|
|
@@ -5474,6 +5491,7 @@
|
|
|
5474
5491
|
columnActions: [{ type: i0.Input }],
|
|
5475
5492
|
useServerSideEvents: [{ type: i0.Input }],
|
|
5476
5493
|
onRowClick: [{ type: i0.Output }],
|
|
5494
|
+
onCheckBoxFilterClick: [{ type: i0.Output }],
|
|
5477
5495
|
onRowCheckBox: [{ type: i0.Output }],
|
|
5478
5496
|
onSortChange: [{ type: i0.Output }],
|
|
5479
5497
|
onFilterChange: [{ type: i0.Output }],
|
|
@@ -8659,7 +8677,7 @@
|
|
|
8659
8677
|
SeGlobalFilterComponent.decorators = [
|
|
8660
8678
|
{ type: i0.Component, args: [{
|
|
8661
8679
|
selector: 'se-global-filters',
|
|
8662
|
-
template: "<div class=\"p-d-flex p-flex-wrap p-flex-row row\">\r\n <div\r\n [class]=\"globalFilter.hidden ? '' : globalFilter.column ? 'p-col-' + globalFilter.column : 'p-col-3'\"\r\n *ngFor=\"let globalFilter of globalFilters\"\r\n >\r\n <div [ngSwitch]=\"globalFilter.type\">\r\n <!-- Calender control -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div class=\"p-d-flex p-flex-column\" *ngSwitchCase=\"fiterTypes.CALENDAR\">\r\n <label class=\"size-10\" for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <div class=\"p-d-flex p-ai-center\">\r\n <p-calendar\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty ' + globalFilter.displayText: 'p-flex-grow-1 p-mr-2 grow-1 ' + globalFilter.displayText\"\r\n [placeholder]=\"'Select-Date'\"\r\n [(ngModel)]=\"globalFilter.value\"\r\n (keyup.enter)=\"applyFilters()\"\r\n (onSelect)=\"selectDate(globalFilter, true)\"\r\n [inputId]=\"globalFilter.field\"\r\n [dateFormat]=\"calendarFormat\"\r\n (onClose)=\"onFocusOutEvent(globalFilter)\"\r\n appendTo=\"body\"\r\n [showButtonBar]=\"true\"\r\n [disabled]=\"globalFilter.disabled\"\r\n (keyup)=\"calendarFocusEvent(globalFilter)\"\r\n >\r\n </p-calendar>\r\n <span *ngIf=\"globalFilter.filtering\">\r\n <se-filter-menu [globalFilter]=\"globalFilter\"></se-filter-menu>\r\n </span>\r\n </div>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n\r\n <!-- Calender Range -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div\r\n class=\"p-d-flex p-flex-column\"\r\n *ngSwitchCase=\"fiterTypes.CALENDAR_RANGE\"\r\n >\r\n <label class=\"size-10\" for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <div class=\"p-d-flex p-ai-center\">\r\n <button\r\n pButton\r\n type=\"button\"\r\n [disabled]=\"globalFilter.disabled\"\r\n [ngStyle]=\"{ background: globalFilter.color ? globalFilter.color : ''}\"\r\n class=\"custom-btn\"\r\n (click)=\"showPrevious(globalFilter)\"\r\n label=\"Previous {{\r\n globalFilter.dayRange ? globalFilter.dayRange : 'Week'\r\n }} <<\"\r\n ></button>\r\n <label class=\"size-10\"\r\n >\r\n <span [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty' : ''\"></span>\r\n <span *ngIf=\"globalFilter.prefix===true || globalFilter.prefix===undefined\">\r\n {{ globalFilter.labelText ? globalFilter.labelText : '' }}\r\n </span>\r\n {{\r\n startDate\r\n | date\r\n : (globalFilter.format ? globalFilter.format : 'MM/dd/yyyy')\r\n }}\r\n to\r\n {{\r\n endDate\r\n | date\r\n : (globalFilter.format ? globalFilter.format : 'MM/dd/yyyy')\r\n }}\r\n <span *ngIf=\"globalFilter.prefix===false\">\r\n {{ globalFilter.labelText ? globalFilter.labelText : ''}}\r\n </span></label\r\n >\r\n <button\r\n pButton\r\n type=\"button\"\r\n [disabled]=\"globalFilter.disabled\"\r\n [ngStyle]=\"{ background: globalFilter.color ? globalFilter.color : ''}\"\r\n class=\"custom-btn\"\r\n (click)=\"showNext(globalFilter)\"\r\n label=\"Next {{\r\n globalFilter.dayRange ? globalFilter.dayRange : 'Week'\r\n }} >>\"\r\n ></button>\r\n </div>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n\r\n <!-- Checkbox Control -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div class=\"p-d-flex p-flex-column\" *ngSwitchCase=\"fiterTypes.CHECKBOX\">\r\n <label class=\"size-10\" for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <p-checkbox\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty': 'p-d-flex p-ai-center'\"\r\n [binary]=\"true\"\r\n (keyup.enter)=\"applyFilters()\"\r\n [(ngModel)]=\"globalFilter.value\"\r\n [disabled]=\"globalFilter.disabled\"\r\n (onChange)=\"onFocusOutEvent(globalFilter)\"\r\n ></p-checkbox>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n\r\n <!-- Spacer Control -->\r\n <span *ngIf=\"!globalFilter.hidden\">\r\n <div\r\n class=\"p-d-flex p-flex-column\"\r\n *ngSwitchCase=\"fiterTypes.SPACER\"\r\n >\r\n <span\r\n [class]=\"\r\n globalFilter.column\r\n ? 'p-col-' + globalFilter.column\r\n : ''\r\n \"\r\n ></span>\r\n </div>\r\n </span>\r\n\r\n <!-- Dropdown Control -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div class=\"p-d-flex p-flex-column\" *ngSwitchCase=\"fiterTypes.DROPDOWN\">\r\n <label class=\"size-10\" for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <p-dropdown\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty' : ''\"\r\n [(ngModel)]=\"globalFilter.value\"\r\n [name]=\"globalFilter.displayText\"\r\n [showClear]=\"true\"\r\n [styleClass]=\"globalFilter.field\"\r\n (keyup.Tab)=\"tabFocusEvent(globalFilter)\"\r\n [placeholder]=\"globalFilter.displayText\"\r\n [options]=\"globalFilter.data || []\"\r\n [optionLabel]=\"globalFilter.optionLabel\"\r\n [optionValue]=\"globalFilter.optionValue\"\r\n [filter]=\"globalFilter.allowSearch\"\r\n (onChange)=\"onFocusOutEvent(globalFilter)\"\r\n (keyup.enter)=\"applyFilters()\"\r\n [disabled]=\"globalFilter.disabled\"\r\n ></p-dropdown>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n\r\n <!-- Input control -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div class=\"p-d-flex p-flex-column\" *ngSwitchCase=\"fiterTypes.INPUT\">\r\n <label class=\"size-10\" for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <div class=\"p-d-flex p-flex-nowrap align-items-center\">\r\n <input\r\n type=\"text\"\r\n pInputText\r\n [(ngModel)]=\"globalFilter.value\"\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty' : 'flex-grow-1 p-mr-2 grow-1'\"\r\n (keyup.enter)=\"applyFilters()\"\r\n (blur)=\"onFocusOutEvent(globalFilter)\"\r\n [disabled]=\"globalFilter.disabled\"\r\n class=\"form-control\"\r\n />\r\n <span *ngIf=\"globalFilter.filtering\">\r\n <se-filter-menu [globalFilter]=\"globalFilter\"></se-filter-menu>\r\n </span>\r\n </div>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n\r\n <!-- NumericInput control -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div\r\n class=\"p-d-flex p-flex-column\"\r\n *ngSwitchCase=\"fiterTypes.NUMERICINPUT\"\r\n >\r\n <label class=\"size-10\" for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <div class=\"p-d-flex flex-nowrap align-items-center\">\r\n <input\r\n type=\"number\"\r\n pInputText\r\n [(ngModel)]=\"globalFilter.value\"\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty' : ''\"\r\n (keyup.enter)=\"applyFilters()\"\r\n (blur)=\"onFocusOutEvent(globalFilter)\"\r\n [disabled]=\"globalFilter.disabled\"\r\n class=\"form-control\"\r\n />\r\n <span *ngIf=\"globalFilter.filtering\">\r\n <se-filter-menu [globalFilter]=\"globalFilter\"></se-filter-menu>\r\n </span>\r\n </div>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n \r\n <!-- Date Range Control -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div class=\"p-d-flex p-flex-column\" *ngSwitchCase=\"fiterTypes.DATE_RANGE\">\r\n <label for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <div class=\"p-d-flex p-ai-center\">\r\n <p-calendar \r\n #rangeCalendar\r\n [showButtonBar]=\"true\"\r\n todayButtonStyleClass=\"p-d-none\"\r\n clearButtonStyleClass=\"p-ml-auto\"\r\n [inputId]=\"globalFilter.displayText\"\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty ' + globalFilter.displayText : 'p-flex-grow-1 p-mr-2 grow-1 ' + globalFilter.displayText\"\r\n [(ngModel)]=\"globalFilter.value\" \r\n selectionMode=\"range\" \r\n appendTo=\"body\"\r\n (onSelect)=\"selectDate(globalFilter, true)\"\r\n [dateFormat]=\"calendarFormat\"\r\n (onClickOutside)=\"setDateRangeFilterValue(globalFilter)\"\r\n (onBlur)=\"setDateRangeFilterValue(globalFilter)\"\r\n (keyup)=\"calendarFocusEvent(globalFilter)\"\r\n (onClearClick)=\"clearDateRangeValue(globalFilter)\"\r\n [disabled]=\"globalFilter.disabled\"\r\n (keyup.enter)=\"applyFilters(true, globalFilter)\"\r\n ></p-calendar>\r\n <span *ngIf=\"globalFilter.filtering\">\r\n <se-filter-menu [globalFilter]=\"globalFilter\"></se-filter-menu>\r\n </span>\r\n </div>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n\r\n <!-- Numeric Range control -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div\r\n class=\"p-d-flex p-flex-column\"\r\n *ngSwitchCase=\"fiterTypes.NUMERIC_RANGE\"\r\n >\r\n <label for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <div class=\"p-d-flex\">\r\n <div class=\"p-d-flex flex-nowrap align-items-center p-mr-2\">\r\n <p-inputNumber\r\n [showButtons]=\"false\"\r\n [(ngModel)]=\"globalFilter.value\"\r\n [minFractionDigits]=\"globalFilter?.format?.type === 'decimal' ? globalFilter.format?.formatParams?.digitsInfo ? globalFilter.format?.formatParams?.digitsInfo : '2' : '0'\"\r\n [maxFractionDigits]=\"globalFilter?.format?.type === 'decimal' ? globalFilter.format?.formatParams?.digitsInfo ? globalFilter.format?.formatParams?.digitsInfo : '2' : '0'\"\r\n (onBlur)=\"setNumericRangeValueFrom(globalFilter)\"\r\n (keyup.enter)=\"setNumericRangeValueFrom(globalFilter,true)\"\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty' : 'flex-grow-1 grow-1 input-number'\"\r\n [disabled]=\"globalFilter.disabled\"\r\n >\r\n </p-inputNumber>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n <span class=\"to-numeric\">To</span>\r\n <div class=\"p-d-flex flex-nowrap align-items-center\">\r\n <p-inputNumber\r\n [showButtons]=\"false\"\r\n [(ngModel)]=\"globalFilter.valueTwo\"\r\n [minFractionDigits]=\"globalFilter?.format?.type === 'decimal' ? globalFilter.format?.formatParams?.digitsInfo ? globalFilter.format?.formatParams?.digitsInfo : '2' : '0'\"\r\n [maxFractionDigits]=\"globalFilter?.format?.type === 'decimal' ? globalFilter.format?.formatParams?.digitsInfo ? globalFilter.format?.formatParams?.digitsInfo : '2' : '0'\"\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty' : 'flex-grow-1 p-mr-2 grow-1 input-number'\"\r\n (onBlur)=\"setNumericRangeValueTwo(globalFilter)\"\r\n (keyup.enter)=\"setNumericRangeValueTwo(globalFilter,true)\"\r\n [disabled]=\"globalFilter.disabled\"\r\n >\r\n </p-inputNumber>\r\n <span *ngIf=\"globalFilter.filtering\">\r\n <se-filter-menu [globalFilter]=\"globalFilter\"></se-filter-menu>\r\n </span>\r\n </div>\r\n </div>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n\r\n <!-- MultiSelect control -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div\r\n class=\"p-d-flex p-flex-column\"\r\n *ngSwitchCase=\"fiterTypes.MULTISELECT\"\r\n >\r\n <label class=\"size-10\" for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <p-multiSelect\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty' : ''\"\r\n [(ngModel)]=\"globalFilter.value\"\r\n [options]=\"globalFilter.data\"\r\n optionLabel=\"label\"\r\n (keyup.enter)=\"applyFilters()\"\r\n optionValue=\"value\"\r\n (onChange)=\"onFocusOutEvent(globalFilter)\"\r\n [appendTo]=\"'body'\"\r\n [disabled]=\"globalFilter.disabled\"\r\n ></p-multiSelect>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n\r\n <!-- Lookup Control Field -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div\r\n class=\"p-d-flex p-flex-column\"\r\n *ngSwitchCase=\"fiterTypes.LOOKUP_INPUT\"\r\n >\r\n <label class=\"size-10\" for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <input\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty' : ''\"\r\n [id]=\"globalFilter.field\"\r\n type=\"text\"\r\n pInputText\r\n [(ngModel)]=\"globalFilter.value\"\r\n (blur)=\"onFocusOutEvent(globalFilter)\"\r\n [name]=\"globalFilter.field\"\r\n (keyup.enter)=\"applyFilters()\"\r\n (click)=\"selectLookupField(globalFilter)\"\r\n [disabled]=\"globalFilter.disabled\"\r\n class=\"form-control\"\r\n />\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- Apply button -->\r\n\r\n<button\r\n*ngIf=\"searchGlobalFilterBtn\"\r\npButton\r\ntype=\"button\"\r\nicon=\"pi pi-search\"\r\nid=\"globalSearchbtn\"\r\n(click)=\"applyFilters()\"\r\nclass=\"p-button-success align-globalFilter-btn p-mb-2\"\r\n></button>\r\n\r\n<!-- Close button -->\r\n<button\r\n*ngIf=\"clearGlobalFilterBtn\"\r\npButton\r\nid=\"clearGlobalFilterBtn\"\r\ntype=\"button\"\r\nicon=\"pi pi-refresh\"\r\n(click)=\"clearFilters()\"\r\n[class]=\"hideClearFilterBtn ? 'p-button-success p-mb-2 p-ml-3 align-globalFilter-btn' : 'hide-Global-clear-filter-button'\"\r\n></button>\r\n",
|
|
8680
|
+
template: "<div class=\"p-d-flex p-flex-wrap p-flex-row row\">\r\n <div\r\n [class]=\"globalFilter.hidden ? '' : globalFilter.column ? 'p-col-' + globalFilter.column : 'p-col-3'\"\r\n *ngFor=\"let globalFilter of globalFilters\"\r\n >\r\n <div [ngSwitch]=\"globalFilter.type\">\r\n <!-- Calender control -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div class=\"p-d-flex p-flex-column\" *ngSwitchCase=\"fiterTypes.CALENDAR\">\r\n <label class=\"size-10\" for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <div class=\"p-d-flex p-ai-center\">\r\n <p-calendar\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty ' + globalFilter.displayText: 'p-flex-grow-1 p-mr-2 grow-1 ' + globalFilter.displayText\"\r\n [placeholder]=\"'Select-Date'\"\r\n [(ngModel)]=\"globalFilter.value\"\r\n (keyup.enter)=\"applyFilters()\"\r\n (onSelect)=\"selectDate(globalFilter, true)\"\r\n [inputId]=\"globalFilter.field\"\r\n [dateFormat]=\"calendarFormat\"\r\n (onClose)=\"onFocusOutEvent(globalFilter)\"\r\n appendTo=\"body\"\r\n [showButtonBar]=\"true\"\r\n [disabled]=\"globalFilter.disabled\"\r\n (keyup)=\"calendarFocusEvent(globalFilter)\"\r\n >\r\n </p-calendar>\r\n <span *ngIf=\"globalFilter.filtering\">\r\n <se-filter-menu [globalFilter]=\"globalFilter\"></se-filter-menu>\r\n </span>\r\n </div>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n\r\n <!-- Calender Range -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div\r\n class=\"p-d-flex p-flex-column\"\r\n *ngSwitchCase=\"fiterTypes.CALENDAR_RANGE\"\r\n >\r\n <label class=\"size-10\" for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <div class=\"p-d-flex p-ai-center\">\r\n <button\r\n pButton\r\n type=\"button\"\r\n [disabled]=\"globalFilter.disabled\"\r\n [ngStyle]=\"{ background: globalFilter.color ? globalFilter.color : ''}\"\r\n class=\"custom-btn\"\r\n (click)=\"showPrevious(globalFilter)\"\r\n label=\"Previous {{\r\n globalFilter.dayRange ? globalFilter.dayRange : 'Week'\r\n }} <<\"\r\n ></button>\r\n <label class=\"size-10\"\r\n >\r\n <span [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty' : ''\"></span>\r\n <span *ngIf=\"globalFilter.prefix===true || globalFilter.prefix===undefined\">\r\n {{ globalFilter.labelText ? globalFilter.labelText : '' }}\r\n </span>\r\n {{\r\n startDate\r\n | date\r\n : (globalFilter.format ? globalFilter.format : 'MM/dd/yyyy')\r\n }}\r\n to\r\n {{\r\n endDate\r\n | date\r\n : (globalFilter.format ? globalFilter.format : 'MM/dd/yyyy')\r\n }}\r\n <span *ngIf=\"globalFilter.prefix===false\">\r\n {{ globalFilter.labelText ? globalFilter.labelText : ''}}\r\n </span></label\r\n >\r\n <button\r\n pButton\r\n type=\"button\"\r\n [disabled]=\"globalFilter.disabled\"\r\n [ngStyle]=\"{ background: globalFilter.color ? globalFilter.color : ''}\"\r\n class=\"custom-btn\"\r\n (click)=\"showNext(globalFilter)\"\r\n label=\"Next {{\r\n globalFilter.dayRange ? globalFilter.dayRange : 'Week'\r\n }} >>\"\r\n ></button>\r\n </div>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n\r\n <!-- Checkbox Control -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div class=\"p-d-flex p-flex-column\" *ngSwitchCase=\"fiterTypes.CHECKBOX\">\r\n <label class=\"size-10\" for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <p-checkbox\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty': 'p-d-flex p-ai-center'\"\r\n [binary]=\"true\"\r\n (keyup.enter)=\"applyFilters()\"\r\n [(ngModel)]=\"globalFilter.value\"\r\n [disabled]=\"globalFilter.disabled\"\r\n (onChange)=\"onFocusOutEvent(globalFilter)\"\r\n ></p-checkbox>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n\r\n <!-- Spacer Control -->\r\n <span *ngIf=\"!globalFilter.hidden\">\r\n <div\r\n class=\"p-d-flex p-flex-column\"\r\n *ngSwitchCase=\"fiterTypes.SPACER\"\r\n >\r\n <span\r\n [class]=\"\r\n globalFilter.column\r\n ? 'p-col-' + globalFilter.column\r\n : ''\r\n \"\r\n ></span>\r\n </div>\r\n </span>\r\n\r\n <!-- Dropdown Control -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div class=\"p-d-flex p-flex-column\" *ngSwitchCase=\"fiterTypes.DROPDOWN\">\r\n <label class=\"size-10\" for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <p-dropdown\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty' : ''\"\r\n [(ngModel)]=\"globalFilter.value\"\r\n [name]=\"globalFilter.displayText\"\r\n [showClear]=\"true\"\r\n [styleClass]=\"globalFilter.field\"\r\n (keyup.Tab)=\"tabFocusEvent(globalFilter)\"\r\n [placeholder]=\"globalFilter.displayText\"\r\n [options]=\"globalFilter.data || []\"\r\n [optionLabel]=\"globalFilter.optionLabel\"\r\n [optionValue]=\"globalFilter.optionValue\"\r\n [filter]=\"globalFilter.allowSearch\"\r\n (onChange)=\"onFocusOutEvent(globalFilter)\"\r\n (keyup.enter)=\"applyFilters()\"\r\n [disabled]=\"globalFilter.disabled\"\r\n ></p-dropdown>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n\r\n <!-- Input control -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div class=\"p-d-flex p-flex-column\" *ngSwitchCase=\"fiterTypes.INPUT\">\r\n <label class=\"size-10\" for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <div class=\"p-d-flex p-flex-nowrap align-items-center\">\r\n <input\r\n type=\"text\"\r\n pInputText\r\n [(ngModel)]=\"globalFilter.value\"\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty' : 'flex-grow-1 p-mr-2 grow-1'\"\r\n (keyup.enter)=\"applyFilters()\"\r\n (blur)=\"onFocusOutEvent(globalFilter)\"\r\n [disabled]=\"globalFilter.disabled\"\r\n class=\"form-control\"\r\n />\r\n <span *ngIf=\"globalFilter.filtering\">\r\n <se-filter-menu [globalFilter]=\"globalFilter\"></se-filter-menu>\r\n </span>\r\n </div>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n\r\n <!-- NumericInput control -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div\r\n class=\"p-d-flex p-flex-column\"\r\n *ngSwitchCase=\"fiterTypes.NUMERICINPUT\"\r\n >\r\n <label class=\"size-10\" for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <div class=\"p-d-flex flex-nowrap align-items-center\">\r\n <input\r\n type=\"number\"\r\n pInputText\r\n [(ngModel)]=\"globalFilter.value\"\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty' : ''\"\r\n (keyup.enter)=\"applyFilters()\"\r\n (blur)=\"onFocusOutEvent(globalFilter)\"\r\n [disabled]=\"globalFilter.disabled\"\r\n class=\"form-control\"\r\n />\r\n <span *ngIf=\"globalFilter.filtering\">\r\n <se-filter-menu [globalFilter]=\"globalFilter\"></se-filter-menu>\r\n </span>\r\n </div>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n \r\n <!-- Date Range Control -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div class=\"p-d-flex p-flex-column\" *ngSwitchCase=\"fiterTypes.DATE_RANGE\">\r\n <label for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <div class=\"p-d-flex p-ai-center\">\r\n <p-calendar \r\n #rangeCalendar\r\n [showButtonBar]=\"true\"\r\n todayButtonStyleClass=\"p-d-none\"\r\n clearButtonStyleClass=\"p-ml-auto\"\r\n [inputId]=\"globalFilter.displayText\"\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty ' + globalFilter.displayText : 'p-flex-grow-1 p-mr-2 grow-1 ' + globalFilter.displayText\"\r\n [(ngModel)]=\"globalFilter.value\" \r\n selectionMode=\"range\" \r\n appendTo=\"body\"\r\n (onSelect)=\"selectDate(globalFilter, true)\"\r\n [dateFormat]=\"calendarFormat\"\r\n (onClickOutside)=\"setDateRangeFilterValue(globalFilter)\"\r\n (onBlur)=\"setDateRangeFilterValue(globalFilter)\"\r\n (keyup)=\"calendarFocusEvent(globalFilter)\"\r\n (onClearClick)=\"clearDateRangeValue(globalFilter)\"\r\n [disabled]=\"globalFilter.disabled\"\r\n (keyup.enter)=\"applyFilters(true, globalFilter)\"\r\n ></p-calendar>\r\n <span *ngIf=\"globalFilter.filtering\">\r\n <se-filter-menu [globalFilter]=\"globalFilter\"></se-filter-menu>\r\n </span>\r\n </div>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n\r\n <!-- Numeric Range control -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div\r\n class=\"p-d-flex p-flex-column\"\r\n *ngSwitchCase=\"fiterTypes.NUMERIC_RANGE\"\r\n >\r\n <label for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <div class=\"p-d-flex\">\r\n <div class=\"p-d-flex flex-nowrap align-items-center p-mr-2\">\r\n <p-inputNumber\r\n [showButtons]=\"false\"\r\n [(ngModel)]=\"globalFilter.value\"\r\n [minFractionDigits]=\"globalFilter?.format?.type === 'decimal' ? globalFilter.format?.formatParams?.digitsInfo ? globalFilter.format?.formatParams?.digitsInfo : '2' : '0'\"\r\n [maxFractionDigits]=\"globalFilter?.format?.type === 'decimal' ? globalFilter.format?.formatParams?.digitsInfo ? globalFilter.format?.formatParams?.digitsInfo : '2' : '0'\"\r\n (onBlur)=\"setNumericRangeValueFrom(globalFilter)\"\r\n (keyup.enter)=\"setNumericRangeValueFrom(globalFilter,true)\"\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty' : 'flex-grow-1 grow-1 input-number'\"\r\n [disabled]=\"globalFilter.disabled\"\r\n >\r\n </p-inputNumber>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n <span class=\"to-numeric\">To</span>\r\n <div class=\"p-d-flex flex-nowrap align-items-center\">\r\n <p-inputNumber\r\n [showButtons]=\"false\"\r\n [(ngModel)]=\"globalFilter.valueTwo\"\r\n [minFractionDigits]=\"globalFilter?.format?.type === 'decimal' ? globalFilter.format?.formatParams?.digitsInfo ? globalFilter.format?.formatParams?.digitsInfo : '2' : '0'\"\r\n [maxFractionDigits]=\"globalFilter?.format?.type === 'decimal' ? globalFilter.format?.formatParams?.digitsInfo ? globalFilter.format?.formatParams?.digitsInfo : '2' : '0'\"\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty' : 'flex-grow-1 p-mr-2 grow-1 input-number'\"\r\n (onBlur)=\"setNumericRangeValueTwo(globalFilter)\"\r\n (keyup.enter)=\"setNumericRangeValueTwo(globalFilter,true)\"\r\n [disabled]=\"globalFilter.disabled\"\r\n >\r\n </p-inputNumber>\r\n <span *ngIf=\"globalFilter.filtering\">\r\n <se-filter-menu [globalFilter]=\"globalFilter\"></se-filter-menu>\r\n </span>\r\n </div>\r\n </div>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n\r\n <!-- MultiSelect control -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div\r\n class=\"p-d-flex p-flex-column\"\r\n *ngSwitchCase=\"fiterTypes.MULTISELECT\"\r\n >\r\n <label class=\"size-10\" for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <p-multiSelect\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty' : ''\"\r\n [(ngModel)]=\"globalFilter.value\"\r\n [options]=\"globalFilter.data\"\r\n optionLabel=\"label\"\r\n (keyup.enter)=\"applyFilters()\"\r\n (onChange)=\"onFocusOutEvent(globalFilter)\"\r\n optionValue=\"value\"\r\n (onChange)=\"onFocusOutEvent(globalFilter)\"\r\n [appendTo]=\"'body'\"\r\n [disabled]=\"globalFilter.disabled\"\r\n ></p-multiSelect>\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n\r\n <!-- Lookup Control Field -->\r\n <span [hidden]=\"globalFilter.hidden\">\r\n <div\r\n class=\"p-d-flex p-flex-column\"\r\n *ngSwitchCase=\"fiterTypes.LOOKUP_INPUT\"\r\n >\r\n <label class=\"size-10\" for=\"basic\">{{ globalFilter.displayText }}\r\n <span *ngIf=\"globalFilter.requiredField\">*</span>\r\n </label>\r\n <input\r\n [class]=\"globalFilter.errorMessage ? 'ng-invalid ng-dirty' : ''\"\r\n [id]=\"globalFilter.field\"\r\n type=\"text\"\r\n pInputText\r\n [(ngModel)]=\"globalFilter.value\"\r\n (blur)=\"onFocusOutEvent(globalFilter)\"\r\n [name]=\"globalFilter.field\"\r\n (keyup.enter)=\"applyFilters()\"\r\n (click)=\"selectLookupField(globalFilter)\"\r\n [disabled]=\"globalFilter.disabled\"\r\n class=\"form-control\"\r\n />\r\n <span *ngIf=\"globalFilter.errorMessage && globalFilter.errorMessage.length > 0\" class=\"error\">{{\r\n globalFilter.errorMessage\r\n }}</span>\r\n </div>\r\n </span>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- Apply button -->\r\n\r\n<button\r\n*ngIf=\"searchGlobalFilterBtn\"\r\npButton\r\ntype=\"button\"\r\nicon=\"pi pi-search\"\r\nid=\"globalSearchbtn\"\r\n(click)=\"applyFilters()\"\r\nclass=\"p-button-success align-globalFilter-btn p-mb-2\"\r\n></button>\r\n\r\n<!-- Close button -->\r\n<button\r\n*ngIf=\"clearGlobalFilterBtn\"\r\npButton\r\nid=\"clearGlobalFilterBtn\"\r\ntype=\"button\"\r\nicon=\"pi pi-refresh\"\r\n(click)=\"clearFilters()\"\r\n[class]=\"hideClearFilterBtn ? 'p-button-success p-mb-2 p-ml-3 align-globalFilter-btn' : 'hide-Global-clear-filter-button'\"\r\n></button>\r\n",
|
|
8663
8681
|
styles: ["*{font-family:\"Lato\",sans-serif}.pi{font-family:\"primeicons\"}#toast-container{background:black}.grow-1{flex-grow:1}.w-100{width:100%}.size-10{font-size:10px}.center-content{width:100%!important}.custom-link{color:#4e87f1;cursor:pointer;text-decoration:none}.center-content+app-sidebar{position:relative}.row{margin-left:-.5rem;margin-right:-.5rem}p-calendar{display:flex;justify-content:stretch}p-checkbox{height:42px}.p-dialog .p-dialog-content{overflow:visible!important}:host ::ng-deep input,:host ::ng-deep p-calendar,:host ::ng-deep .p-calendar,:host ::ng-deep .p-dropdown,:host ::ng-deep .p-multiselect{width:100%}:host ::ng-deep .custom-btn button{background:#efefef;border:#eee;border-radius:0;padding:5px 15px;font-size:12px;color:#585858;margin:0 5px}:host ::ng-deep .custom-btn button:hover{background-color:#dad5d5;color:#000}:host ::ng-deep .input-number{border:0;border-radius:2px;padding:5px 6px}:host ::ng-deep .input-number input{margin:-8px -23px -8px -8px;border:0;padding-right:10px;border-radius:3px}:host ::ng-deep .input-number button{color:#2d2d2d;width:15px;height:6;border:0;background-color:#fff}:host ::ng-deep .input-number button:hover{color:#2d2d2d;background-color:#ddd}:host ::ng-deep .input-number button span{font-size:12px}:host ::ng-deep .input-number .p-inputnumber-button-group{visibility:hidden}:host ::ng-deep .input-number:hover .p-inputnumber-button-group{visibility:visible}:host ::ng-deep .to-numeric{font-size:13px;margin:3px;color:#636363;padding-top:4px}.error{color:red}.hide-Global-clear-filter-button{display:none}.align-globalFilter-btn{float:left;margin:10px 5px 0 0}\n"]
|
|
8664
8682
|
},] }
|
|
8665
8683
|
];
|