@churchillliving/se-ui-toolkit 6.53.187 → 6.53.188

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.
Files changed (17) hide show
  1. package/bundles/churchillliving-se-ui-toolkit.umd.js +215 -56
  2. package/bundles/churchillliving-se-ui-toolkit.umd.js.map +1 -1
  3. package/churchillliving-se-ui-toolkit.metadata.json +1 -1
  4. package/esm2015/lib/components/base/form/form.component.js +1 -1
  5. package/esm2015/lib/components/base/grid/grid.component.js +35 -12
  6. package/esm2015/lib/models/form.model.js +1 -1
  7. package/esm2015/lib/models/grid.model.js +1 -1
  8. package/esm2015/lib/services/grid.service.js +161 -41
  9. package/esm2015/lib/services/request.service.js +3 -3
  10. package/fesm2015/churchillliving-se-ui-toolkit.js +198 -55
  11. package/fesm2015/churchillliving-se-ui-toolkit.js.map +1 -1
  12. package/lib/components/base/grid/grid.component.d.ts +1 -0
  13. package/lib/models/form.model.d.ts +10 -2
  14. package/lib/models/grid.model.d.ts +5 -1
  15. package/lib/services/grid.service.d.ts +2 -1
  16. package/lib/services/request.service.d.ts +1 -1
  17. package/package.json +1 -1
package/bundles/churchillliving-se-ui-toolkit.umd.js CHANGED
@@ -100,7 +100,7 @@
100
100
  if (typeof Reflect === "object" && typeof Reflect.metadata === "function")
101
101
  return Reflect.metadata(metadataKey, metadataValue);
102
102
  }
103
- function __awaiter$1(thisArg, _arguments, P, generator) {
103
+ function __awaiter$2(thisArg, _arguments, P, generator) {
104
104
  function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
105
105
  return new (P || (P = Promise))(function (resolve, reject) {
106
106
  function fulfilled(value) { try {
@@ -606,8 +606,9 @@
606
606
  if (baseUrl === void 0) { baseUrl = this.env.baseUrl; }
607
607
  return this.http.post("" + baseUrl + endpoint, data, { responseType: 'blob' });
608
608
  };
609
- RequestService.prototype.get = function (endpoint, data) {
610
- return this.http.post("" + this.env.baseUrl + endpoint + this.getCurrentRoute(), data);
609
+ RequestService.prototype.get = function (endpoint, data, baseUrl) {
610
+ if (baseUrl === void 0) { baseUrl = this.env.baseUrl; }
611
+ return this.http.post("" + baseUrl + endpoint + this.getCurrentRoute(), data);
611
612
  };
612
613
  RequestService.prototype.getRequest = function (endpoint) {
613
614
  return this.http.get("" + this.env.baseUrl + endpoint + this.getCurrentRoute());
@@ -720,7 +721,7 @@
720
721
  { type: RequestService }
721
722
  ]; };
722
723
 
723
- var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
724
+ var __awaiter$1 = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
724
725
  function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
725
726
  return new (P || (P = Promise))(function (resolve, reject) {
726
727
  function fulfilled(value) { try {
@@ -794,7 +795,7 @@
794
795
  return url;
795
796
  };
796
797
  HyperlinkService.prototype.addHyperlinks = function (columns) {
797
- return __awaiter(this, void 0, void 0, function () {
798
+ return __awaiter$1(this, void 0, void 0, function () {
798
799
  var linkIds, params;
799
800
  return __generator(this, function (_h) {
800
801
  switch (_h.label) {
@@ -2060,6 +2061,25 @@
2060
2061
  }
2061
2062
  /* #endregion */
2062
2063
 
2064
+ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
2065
+ function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
2066
+ return new (P || (P = Promise))(function (resolve, reject) {
2067
+ function fulfilled(value) { try {
2068
+ step(generator.next(value));
2069
+ }
2070
+ catch (e) {
2071
+ reject(e);
2072
+ } }
2073
+ function rejected(value) { try {
2074
+ step(generator["throw"](value));
2075
+ }
2076
+ catch (e) {
2077
+ reject(e);
2078
+ } }
2079
+ function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
2080
+ step((generator = generator.apply(thisArg, _arguments || [])).next());
2081
+ });
2082
+ };
2063
2083
  var GridService = /** @class */ (function () {
2064
2084
  function GridService(datepipe, hyperlinkService, dropdownService, alertService, requestService) {
2065
2085
  this.datepipe = datepipe;
@@ -2113,7 +2133,8 @@
2113
2133
  filter.value) ||
2114
2134
  (typeof filter.value === 'boolean' && filter.value !== null) ||
2115
2135
  filter.type === exports.GridFilterControlType.CALENDAR_RANGE) {
2116
- if (filter.type === exports.GridFilterControlType.CALENDAR_RANGE && ((_b = (_a = filter.value) === null || _a === void 0 ? void 0 : _a.toString()) === null || _b === void 0 ? void 0 : _b.includes('|'))) {
2136
+ if (filter.type === exports.GridFilterControlType.CALENDAR_RANGE &&
2137
+ ((_b = (_a = filter.value) === null || _a === void 0 ? void 0 : _a.toString()) === null || _b === void 0 ? void 0 : _b.includes('|'))) {
2117
2138
  // add filter for start date
2118
2139
  globalData.push({
2119
2140
  field: _this.setGlobalFilterField(filter),
@@ -2211,7 +2232,8 @@
2211
2232
  item.validations[i].type == exports.EGridValidator.MINLENGTH &&
2212
2233
  row[item.field].length < item.validations[i].expression) {
2213
2234
  isValid =
2214
- row[item.field] && row[item.field].length > item.validations[i].expression
2235
+ row[item.field] &&
2236
+ row[item.field].length > item.validations[i].expression
2215
2237
  ? true
2216
2238
  : _this.setErrorMessage(item, item.header + " Minimum " + item.validations[i].expression + " characters");
2217
2239
  break;
@@ -2220,7 +2242,8 @@
2220
2242
  item.validations[i].type == exports.EGridValidator.MAXLENGTH &&
2221
2243
  row[item.field].length > item.validations[i].expression) {
2222
2244
  isValid =
2223
- row[item.field] && row[item.field].length < item.validations[i].expression
2245
+ row[item.field] &&
2246
+ row[item.field].length < item.validations[i].expression
2224
2247
  ? true
2225
2248
  : _this.setErrorMessage(item, item.header + " Maximum " + item.validations[i].expression + " characters");
2226
2249
  break;
@@ -2229,11 +2252,15 @@
2229
2252
  item.validations[i].type == exports.EGridValidator.MINIMUM &&
2230
2253
  isValid) {
2231
2254
  if (item.type === exports.EGridColumnType.DATE) {
2232
- isValid = minMaxValidDate === 'minimum' ? _this.setErrorMessage(item, "Minimum " + valid + " " + item.validations[i].expression) : true;
2255
+ isValid =
2256
+ minMaxValidDate === 'minimum'
2257
+ ? _this.setErrorMessage(item, "Minimum " + valid + " " + item.validations[i].expression)
2258
+ : true;
2233
2259
  }
2234
2260
  else if (row[item.field] < item.validations[i].expression) {
2235
2261
  isValid =
2236
- row[item.field] && row[item.field].length > item.validations[i].expression
2262
+ row[item.field] &&
2263
+ row[item.field].length > item.validations[i].expression
2237
2264
  ? true
2238
2265
  : _this.setErrorMessage(item, item.header + " Minimum " + valid + " " + item.validations[i].expression);
2239
2266
  }
@@ -2242,11 +2269,15 @@
2242
2269
  item.validations[i].type == exports.EGridValidator.MAXIMUM &&
2243
2270
  isValid) {
2244
2271
  if (item.type === exports.EGridColumnType.DATE) {
2245
- isValid = minMaxValidDate === 'greater' ? _this.setErrorMessage(item, "Maximum " + valid + " " + item.validations[i].expression) : true;
2272
+ isValid =
2273
+ minMaxValidDate === 'greater'
2274
+ ? _this.setErrorMessage(item, "Maximum " + valid + " " + item.validations[i].expression)
2275
+ : true;
2246
2276
  }
2247
2277
  else if (row[item.field] > item.validations[i].expression) {
2248
2278
  isValid =
2249
- row[item.field] && row[item.field].length < item.validations[i].expression
2279
+ row[item.field] &&
2280
+ row[item.field].length < item.validations[i].expression
2250
2281
  ? true
2251
2282
  : _this.setErrorMessage(item, item.header + " Maximum " + valid + " " + item.validations[i].expression);
2252
2283
  }
@@ -2255,7 +2286,8 @@
2255
2286
  item.validations[i].type == exports.EGridValidator.PATTERN &&
2256
2287
  !row[item.field].match(item.validations[i].expression)) {
2257
2288
  isValid =
2258
- row[item.field] && row[item.field].match(item.validations[i].expression)
2289
+ row[item.field] &&
2290
+ row[item.field].match(item.validations[i].expression)
2259
2291
  ? true
2260
2292
  : _this.setErrorMessage(item, "Enter valid " + valid);
2261
2293
  break;
@@ -2273,7 +2305,8 @@
2273
2305
  item.validations[i].type == exports.EGridValidator.PHONE &&
2274
2306
  !((_a = row[item.field]) === null || _a === void 0 ? void 0 : _a.toString().match(/^(?=.*[0-9])[-()0-9\s]+$/))) {
2275
2307
  isValid =
2276
- row[item.field] && ((_b = row[item.field]) === null || _b === void 0 ? void 0 : _b.toString().match(/^(?=.*[0-9])[-()0-9\s]+$/))
2308
+ row[item.field] &&
2309
+ ((_b = row[item.field]) === null || _b === void 0 ? void 0 : _b.toString().match(/^(?=.*[0-9])[-()0-9\s]+$/))
2277
2310
  ? true
2278
2311
  : _this.setErrorMessage(item, "Enter valid " + valid);
2279
2312
  break;
@@ -2282,7 +2315,8 @@
2282
2315
  item.validations[i].type == exports.EGridValidator.DECIMAL &&
2283
2316
  !((_c = row[item.field]) === null || _c === void 0 ? void 0 : _c.toString().match(/^(0|[-()1-9]\d*)(\.\d+)?$/))) {
2284
2317
  isValid =
2285
- row[item.field] && ((_d = row[item.field]) === null || _d === void 0 ? void 0 : _d.toString().match(/^(0|[1-9]\d*)(\.\d+)?$/))
2318
+ row[item.field] &&
2319
+ ((_d = row[item.field]) === null || _d === void 0 ? void 0 : _d.toString().match(/^(0|[1-9]\d*)(\.\d+)?$/))
2286
2320
  ? true
2287
2321
  : _this.setErrorMessage(item, "Enter " + item.validations[i].type + " for " + valid);
2288
2322
  break;
@@ -2465,8 +2499,12 @@
2465
2499
  // add simple grid column without
2466
2500
  GridService.prototype.addColumn = function (columnInfo) {
2467
2501
  if (columnInfo.type === exports.EGridColumnType.DROPDOWN) {
2468
- columnInfo.optionLabel = columnInfo.optionLabel ? columnInfo.optionLabel : 'label';
2469
- columnInfo.optionValue = columnInfo.optionValue ? columnInfo.optionValue : 'value';
2502
+ columnInfo.optionLabel = columnInfo.optionLabel
2503
+ ? columnInfo.optionLabel
2504
+ : 'label';
2505
+ columnInfo.optionValue = columnInfo.optionValue
2506
+ ? columnInfo.optionValue
2507
+ : 'value';
2470
2508
  }
2471
2509
  else if (columnInfo.type === exports.EGridColumnType.DIALOG) {
2472
2510
  if (!columnInfo.filtering && !columnInfo.filter) {
@@ -2478,6 +2516,8 @@
2478
2516
  }
2479
2517
  var column = {
2480
2518
  allowSearch: columnInfo.allowSearch,
2519
+ allowAutoCompleteSave: columnInfo.allowAutoCompleteSave,
2520
+ uniqueKey: columnInfo.uniqueKey,
2481
2521
  field: columnInfo.field,
2482
2522
  header: columnInfo.header,
2483
2523
  style: columnInfo.style,
@@ -2533,7 +2573,10 @@
2533
2573
  GridService.prototype.addInputColumn = function (filterColumnInfo, showFilter) {
2534
2574
  if (showFilter === void 0) { showFilter = true; }
2535
2575
  if (showFilter) {
2536
- filterColumnInfo.filter = { type: exports.GridFilterControlType.INPUT, showFilter: this.showFilterIcon(filterColumnInfo) };
2576
+ filterColumnInfo.filter = {
2577
+ type: exports.GridFilterControlType.INPUT,
2578
+ showFilter: this.showFilterIcon(filterColumnInfo),
2579
+ };
2537
2580
  }
2538
2581
  return this.addColumn(filterColumnInfo);
2539
2582
  };
@@ -2541,7 +2584,10 @@
2541
2584
  GridService.prototype.addNumericColumn = function (columnInfo, showFilter) {
2542
2585
  if (showFilter === void 0) { showFilter = true; }
2543
2586
  if (showFilter) {
2544
- columnInfo.filter = { type: exports.GridFilterControlType.NUMERICINPUT, showFilter: this.showFilterIcon(columnInfo) };
2587
+ columnInfo.filter = {
2588
+ type: exports.GridFilterControlType.NUMERICINPUT,
2589
+ showFilter: this.showFilterIcon(columnInfo),
2590
+ };
2545
2591
  }
2546
2592
  columnInfo.type = exports.EGridColumnType.NUMERIC;
2547
2593
  return this.addColumn(columnInfo);
@@ -2550,7 +2596,10 @@
2550
2596
  GridService.prototype.addCalendarColumn = function (columnInfo, showFilter) {
2551
2597
  if (showFilter === void 0) { showFilter = true; }
2552
2598
  if (showFilter) {
2553
- columnInfo.filter = { type: exports.GridFilterControlType.CALENDAR, showFilter: this.showFilterIcon(columnInfo) };
2599
+ columnInfo.filter = {
2600
+ type: exports.GridFilterControlType.CALENDAR,
2601
+ showFilter: this.showFilterIcon(columnInfo),
2602
+ };
2554
2603
  }
2555
2604
  columnInfo.type = columnInfo.type ? columnInfo.type : exports.EGridColumnType.DATE;
2556
2605
  return this.addColumn(columnInfo);
@@ -2559,8 +2608,11 @@
2559
2608
  GridService.prototype.addBooleanColumn = function (columnInfo, showFilter) {
2560
2609
  if (showFilter === void 0) { showFilter = true; }
2561
2610
  if (showFilter) {
2562
- columnInfo.type = exports.EGridColumnType.BOOLEAN,
2563
- columnInfo.filter = { type: exports.GridFilterControlType.CHECKBOX, showFilter: this.showFilterIcon(columnInfo) };
2611
+ (columnInfo.type = exports.EGridColumnType.BOOLEAN),
2612
+ (columnInfo.filter = {
2613
+ type: exports.GridFilterControlType.CHECKBOX,
2614
+ showFilter: this.showFilterIcon(columnInfo),
2615
+ });
2564
2616
  }
2565
2617
  return this.addColumn(columnInfo);
2566
2618
  };
@@ -2568,7 +2620,10 @@
2568
2620
  GridService.prototype.addLookUpColumn = function (columnInfo, showFilter) {
2569
2621
  if (showFilter === void 0) { showFilter = true; }
2570
2622
  if (showFilter) {
2571
- columnInfo.filter = { type: exports.GridFilterControlType.LOOKUP_INPUT, showFilter: this.showFilterIcon(columnInfo) };
2623
+ columnInfo.filter = {
2624
+ type: exports.GridFilterControlType.LOOKUP_INPUT,
2625
+ showFilter: this.showFilterIcon(columnInfo),
2626
+ };
2572
2627
  }
2573
2628
  columnInfo.type = exports.EGridColumnType.LOOKUP_INPUT;
2574
2629
  return this.addColumn(columnInfo);
@@ -2590,11 +2645,19 @@
2590
2645
  GridService.prototype.getAutoCompleteData = function (column, uniqueKey, filters, search) {
2591
2646
  var _this = this;
2592
2647
  if (search === void 0) { search = ''; }
2593
- this.requestService.get('/Data/Fetch', { uniqueKey: uniqueKey, filters: filters }).subscribe(function (response) {
2648
+ this.requestService
2649
+ .get('/Data/Fetch', { uniqueKey: uniqueKey, filters: filters })
2650
+ .subscribe(function (response) {
2594
2651
  var _g;
2595
2652
  var _a;
2653
+ // console.log('get response', response, 'search was', search)
2596
2654
  if (search) {
2597
- var existInRecord = (_a = response.records) === null || _a === void 0 ? void 0 : _a.some(function (record) { var _a, _b; return record[column.displayField] && ((_b = (_a = record[column.displayField]) === null || _a === void 0 ? void 0 : _a.toString()) === null || _b === void 0 ? void 0 : _b.toLowerCase()) === (search === null || search === void 0 ? void 0 : search.toLowerCase()); });
2655
+ var existInRecord = (_a = response.records) === null || _a === void 0 ? void 0 : _a.some(function (record) {
2656
+ var _a, _b;
2657
+ return record[column.displayField] &&
2658
+ ((_b = (_a = record[column.displayField]) === null || _a === void 0 ? void 0 : _a.toString()) === null || _b === void 0 ? void 0 : _b.toLowerCase()) ===
2659
+ (search === null || search === void 0 ? void 0 : search.toLowerCase());
2660
+ });
2598
2661
  if (!existInRecord) {
2599
2662
  response.records.unshift((_g = {}, _g[column.displayField] = search, _g));
2600
2663
  }
@@ -2602,15 +2665,55 @@
2602
2665
  column.data = _this.setDataFields(response.records);
2603
2666
  });
2604
2667
  };
2668
+ GridService.prototype.addAutoCompleteValue = function (uniqueKey, value, column) {
2669
+ var _a, _b;
2670
+ return __awaiter(this, void 0, void 0, function () {
2671
+ var newValue, i;
2672
+ return __generator(this, function (_g) {
2673
+ newValue = {};
2674
+ for (i = 0; i < uniqueKey.values.length; i++) {
2675
+ if (uniqueKey.values[i].name.toLowerCase() == ((_a = column.field) === null || _a === void 0 ? void 0 : _a.toLowerCase()) || uniqueKey.values[i].name.toLowerCase() == ((_b = column.displayField) === null || _b === void 0 ? void 0 : _b.toLowerCase())) {
2676
+ // console.log('matching Name', column.field, column.displayField, uniqueKey.values[i].name.toLowerCase())
2677
+ newValue[uniqueKey.values[i].name] = value;
2678
+ }
2679
+ else {
2680
+ newValue[uniqueKey.values[i].name] = uniqueKey.values[i].value;
2681
+ }
2682
+ }
2683
+ this.requestService
2684
+ .get('/Data/Save', { uniqueKey: uniqueKey.name, values: newValue })
2685
+ .subscribe(function (response) {
2686
+ (function (_g) {
2687
+ var error = _g.error;
2688
+ return error;
2689
+ });
2690
+ return 'success';
2691
+ });
2692
+ return [2 /*return*/];
2693
+ });
2694
+ });
2695
+ };
2605
2696
  // add simple dropdown grid column without
2606
2697
  GridService.prototype.addDropdownColumn = function (columnInfo, showFilter, dropDownProp) {
2607
2698
  if (showFilter === void 0) { showFilter = true; }
2608
2699
  var _a, _b, _c;
2609
2700
  columnInfo.type = exports.EGridColumnType.DROPDOWN;
2610
- columnInfo.optionLabel = columnInfo.optionLabel ? columnInfo.optionLabel : 'label';
2611
- columnInfo.optionValue = columnInfo.optionValue ? columnInfo.optionValue : 'value';
2701
+ columnInfo.optionLabel = columnInfo.optionLabel
2702
+ ? columnInfo.optionLabel
2703
+ : 'label';
2704
+ columnInfo.optionValue = columnInfo.optionValue
2705
+ ? columnInfo.optionValue
2706
+ : 'value';
2612
2707
  if (showFilter) {
2613
- columnInfo.filter = { type: exports.GridFilterControlType.DROPDOWN, data: !((_a = columnInfo === null || columnInfo === void 0 ? void 0 : columnInfo.filter) === null || _a === void 0 ? void 0 : _a.data) && !dropDownProp && columnInfo.data ? columnInfo.data : ((_b = columnInfo === null || columnInfo === void 0 ? void 0 : columnInfo.filter) === null || _b === void 0 ? void 0 : _b.data) ? (_c = columnInfo === null || columnInfo === void 0 ? void 0 : columnInfo.filter) === null || _c === void 0 ? void 0 : _c.data : [], showFilter: this.showFilterIcon(columnInfo) };
2708
+ columnInfo.filter = {
2709
+ type: exports.GridFilterControlType.DROPDOWN,
2710
+ data: !((_a = columnInfo === null || columnInfo === void 0 ? void 0 : columnInfo.filter) === null || _a === void 0 ? void 0 : _a.data) && !dropDownProp && columnInfo.data
2711
+ ? columnInfo.data
2712
+ : ((_b = columnInfo === null || columnInfo === void 0 ? void 0 : columnInfo.filter) === null || _b === void 0 ? void 0 : _b.data)
2713
+ ? (_c = columnInfo === null || columnInfo === void 0 ? void 0 : columnInfo.filter) === null || _c === void 0 ? void 0 : _c.data
2714
+ : [],
2715
+ showFilter: this.showFilterIcon(columnInfo),
2716
+ };
2614
2717
  }
2615
2718
  if (dropDownProp) {
2616
2719
  columnInfo.dropDownProp = dropDownProp;
@@ -2630,11 +2733,23 @@
2630
2733
  GridService.prototype.addMultiSelectDropDownColumn = function (columnInfo, showFilter, multiSelectProp) {
2631
2734
  if (showFilter === void 0) { showFilter = true; }
2632
2735
  var _a, _b, _c;
2633
- columnInfo.optionLabel = columnInfo.optionLabel ? columnInfo.optionLabel : 'label';
2634
- columnInfo.optionValue = columnInfo.optionValue ? columnInfo.optionValue : 'value';
2736
+ columnInfo.optionLabel = columnInfo.optionLabel
2737
+ ? columnInfo.optionLabel
2738
+ : 'label';
2739
+ columnInfo.optionValue = columnInfo.optionValue
2740
+ ? columnInfo.optionValue
2741
+ : 'value';
2635
2742
  columnInfo.type = exports.EGridColumnType.MULTISELECT;
2636
2743
  if (showFilter) {
2637
- columnInfo.filter = { type: exports.GridFilterControlType.MULTISELECT, data: !((_a = columnInfo === null || columnInfo === void 0 ? void 0 : columnInfo.filter) === null || _a === void 0 ? void 0 : _a.data) && !multiSelectProp && columnInfo.data ? columnInfo.data : ((_b = columnInfo === null || columnInfo === void 0 ? void 0 : columnInfo.filter) === null || _b === void 0 ? void 0 : _b.data) ? (_c = columnInfo === null || columnInfo === void 0 ? void 0 : columnInfo.filter) === null || _c === void 0 ? void 0 : _c.data : [], showFilter: this.showFilterIcon(columnInfo) };
2744
+ columnInfo.filter = {
2745
+ type: exports.GridFilterControlType.MULTISELECT,
2746
+ data: !((_a = columnInfo === null || columnInfo === void 0 ? void 0 : columnInfo.filter) === null || _a === void 0 ? void 0 : _a.data) && !multiSelectProp && columnInfo.data
2747
+ ? columnInfo.data
2748
+ : ((_b = columnInfo === null || columnInfo === void 0 ? void 0 : columnInfo.filter) === null || _b === void 0 ? void 0 : _b.data)
2749
+ ? (_c = columnInfo === null || columnInfo === void 0 ? void 0 : columnInfo.filter) === null || _c === void 0 ? void 0 : _c.data
2750
+ : [],
2751
+ showFilter: this.showFilterIcon(columnInfo),
2752
+ };
2638
2753
  }
2639
2754
  if (multiSelectProp) {
2640
2755
  columnInfo.dropDownProp = multiSelectProp;
@@ -2668,7 +2783,7 @@
2668
2783
  }
2669
2784
  else {
2670
2785
  column.data = res;
2671
- if (column.filter && column.filter.type === "dropdown") {
2786
+ if (column.filter && column.filter.type === 'dropdown') {
2672
2787
  column.filter.data = res;
2673
2788
  }
2674
2789
  }
@@ -2688,7 +2803,7 @@
2688
2803
  hidden: filterColumnInfo.hidden,
2689
2804
  style: filterColumnInfo.style,
2690
2805
  tableAlias: filterColumnInfo.tableAlias,
2691
- permissions: filterColumnInfo.permissions
2806
+ permissions: filterColumnInfo.permissions,
2692
2807
  };
2693
2808
  return column;
2694
2809
  };
@@ -2750,7 +2865,9 @@
2750
2865
  (_a = document.getElementById('lookUp_filter')) === null || _a === void 0 ? void 0 : _a.focus();
2751
2866
  var field = column.field;
2752
2867
  var value = setDialogResponse(column, column === null || column === void 0 ? void 0 : column.lookupControl, res);
2753
- column.value = (value === null || value === void 0 ? void 0 : value.value) ? value.value : res[field.toLowerCase()];
2868
+ column.value = (value === null || value === void 0 ? void 0 : value.value)
2869
+ ? value.value
2870
+ : res[field.toLowerCase()];
2754
2871
  }
2755
2872
  }, function (_g) {
2756
2873
  var error = _g.error;
@@ -2760,14 +2877,21 @@
2760
2877
  };
2761
2878
  // Set Hyperlink field as a param Value
2762
2879
  GridService.prototype.setFieldAsLinkParam = function (columns, field, response) {
2763
- if (columns && columns.length > 0 && field && response.records && response.records.length > 0) {
2880
+ if (columns &&
2881
+ columns.length > 0 &&
2882
+ field &&
2883
+ response.records &&
2884
+ response.records.length > 0) {
2764
2885
  this.setDataFields(response.records).forEach(function (res) {
2765
2886
  var obj = columns.find(function (x) { return x.field === field; });
2766
2887
  if (obj && obj.params) {
2767
2888
  var keys = Object.keys(obj.params);
2768
2889
  keys.forEach(function (key) {
2769
2890
  if (obj.params[key] && obj.params[key].toString().includes('{')) {
2770
- var value = obj.params[key].replace('{', '').replace('}', '').toLowerCase();
2891
+ var value = obj.params[key]
2892
+ .replace('{', '')
2893
+ .replace('}', '')
2894
+ .toLowerCase();
2771
2895
  obj.params[key] = res[value];
2772
2896
  }
2773
2897
  });
@@ -2776,16 +2900,22 @@
2776
2900
  }
2777
2901
  };
2778
2902
  GridService.prototype.hasAnyLinkColumn = function (columns) {
2779
- return columns && columns.some(function (x) { return x.type == exports.EGridColumnType.LINK || x.type == exports.EGridColumnType.IFRAME || x.type == exports.EGridColumnType.DIALOG ||
2780
- (x.linkId && x.type == exports.EGridColumnType.LOOKUP_INPUT); });
2903
+ return (columns &&
2904
+ columns.some(function (x) { return x.type == exports.EGridColumnType.LINK ||
2905
+ x.type == exports.EGridColumnType.IFRAME ||
2906
+ x.type == exports.EGridColumnType.DIALOG ||
2907
+ (x.linkId && x.type == exports.EGridColumnType.LOOKUP_INPUT); }));
2781
2908
  };
2782
2909
  GridService.prototype.setHyperlinks = function (fetchResponse, columns) {
2783
2910
  var _this = this;
2784
2911
  var records = [];
2785
- var data = fetchResponse && fetchResponse.records.length > 0 ? this.setDataFields(fetchResponse.records) : [];
2912
+ var data = fetchResponse && fetchResponse.records.length > 0
2913
+ ? this.setDataFields(fetchResponse.records)
2914
+ : [];
2786
2915
  var newRow;
2787
2916
  return this.hyperlinkService
2788
- .addHyperlinks(columns).then(function (linksResponse) {
2917
+ .addHyperlinks(columns)
2918
+ .then(function (linksResponse) {
2789
2919
  data.forEach(function (row) {
2790
2920
  newRow = Object.assign({}, row);
2791
2921
  columns.forEach(function (col) {
@@ -2805,7 +2935,8 @@
2805
2935
  }
2806
2936
  linksResponse.forEach(function (linkResponse) {
2807
2937
  if ((col.type === exports.EGridColumnType.LINK ||
2808
- col.type === exports.EGridColumnType.IFRAME || col.type === exports.EGridColumnType.LOOKUP_INPUT) &&
2938
+ col.type === exports.EGridColumnType.IFRAME ||
2939
+ col.type === exports.EGridColumnType.LOOKUP_INPUT) &&
2809
2940
  col.linkId &&
2810
2941
  col.params &&
2811
2942
  col.linkId === linkResponse.linkId) {
@@ -2961,7 +3092,9 @@
2961
3092
  var _g;
2962
3093
  return (Object.assign(Object.assign({}, prev), (_g = {}, _g[current.toLowerCase()] = x[current], _g)));
2963
3094
  }, {});
2964
- if (dataKey && dataKey.length > 0 && !((_c = Object.keys(result)) === null || _c === void 0 ? void 0 : _c.includes(dataKey))) {
3095
+ if (dataKey &&
3096
+ dataKey.length > 0 &&
3097
+ !((_c = Object.keys(result)) === null || _c === void 0 ? void 0 : _c.includes(dataKey))) {
2965
3098
  result[dataKey] = index;
2966
3099
  }
2967
3100
  data.push(result);
@@ -3001,7 +3134,8 @@
3001
3134
  var index = users.findIndex(function (i) { return i[field.toLowerCase()] === record[field.toLowerCase()]; });
3002
3135
  if (index !== -1) {
3003
3136
  if (users[index][field + '_obj']) {
3004
- users[index][field + '_obj'].hyperlink = res[0][field + '_obj'].hyperlink;
3137
+ users[index][field + '_obj'].hyperlink =
3138
+ res[0][field + '_obj'].hyperlink;
3005
3139
  }
3006
3140
  }
3007
3141
  }
@@ -3014,7 +3148,8 @@
3014
3148
  var _a;
3015
3149
  (_a = Object.keys(record)) === null || _a === void 0 ? void 0 : _a.forEach(function (key) {
3016
3150
  if (key.toLowerCase() === configData.selectedValue.toLowerCase()) {
3017
- if (configData.data.value && record[key] === configData.data.value) {
3151
+ if (configData.data.value &&
3152
+ record[key] === configData.data.value) {
3018
3153
  record['highlightRow'] = true;
3019
3154
  }
3020
3155
  else if (record[key] === configData.data.selection) {
@@ -3039,7 +3174,8 @@
3039
3174
  if (columns && columns.length > 0 && props && props.length > 0) {
3040
3175
  var isMatched_1 = false;
3041
3176
  if (filter && filter.field && records && records.length > 0) {
3042
- isMatched_1 = records.some(function (x) { return objConvertToLower(x)[filter.field.toLowerCase()] === filter.value; });
3177
+ isMatched_1 = records.some(function (x) { return objConvertToLower(x)[filter.field.toLowerCase()] ===
3178
+ filter.value; });
3043
3179
  }
3044
3180
  props.map(function (prop) {
3045
3181
  var col = {};
@@ -5173,17 +5309,40 @@
5173
5309
  }
5174
5310
  this.calenderPreviousValue = '';
5175
5311
  };
5176
- GridComponent.prototype.onFocusOutEvent = function (column, row) {
5177
- this.gridService.checkValidity([column], row);
5178
- if (column.type === exports.EGridColumnType.DATE) {
5179
- this.calenderChangeEvent(column, row);
5180
- }
5181
- if (column.onFocusOut) {
5182
- column.onFocusOut(row);
5312
+ GridComponent.prototype.onAutoCompleteFocusOut = function (e, column) {
5313
+ if (column.type == exports.EGridColumnType.AUTOCOMPLETE) {
5314
+ if (column.allowAutoCompleteSave && e.target.value && !column.data.length) {
5315
+ ///check the correct format if data.contains cuz its an array of arrays with objects.
5316
+ if (confirm("Do you want to add " + e.target.value + " to the selection?")) {
5317
+ if (column.uniqueKey) {
5318
+ var message = this.gridService
5319
+ .addAutoCompleteValue(column.uniqueKey, e.target.value, column)
5320
+ .then(function () {
5321
+ console.log('after save', message);
5322
+ setTimeout(function () {
5323
+ if (column.onReturn) {
5324
+ column.onReturn(e.target.value, column);
5325
+ }
5326
+ }, 500);
5327
+ });
5328
+ }
5329
+ }
5330
+ }
5183
5331
  }
5184
- else if (column.onReturn &&
5185
- column.type !== exports.EGridColumnType.LOOKUP_INPUT) {
5186
- column.onReturn(row);
5332
+ };
5333
+ GridComponent.prototype.onFocusOutEvent = function (column, row) {
5334
+ if (column.type !== exports.EGridColumnType.AUTOCOMPLETE || (!column.allowAutoCompleteSave)) {
5335
+ this.gridService.checkValidity([column], row);
5336
+ if (column.type === exports.EGridColumnType.DATE) {
5337
+ this.calenderChangeEvent(column, row);
5338
+ }
5339
+ if (column.onFocusOut) {
5340
+ column.onFocusOut(row);
5341
+ }
5342
+ else if (column.onReturn &&
5343
+ column.type !== exports.EGridColumnType.LOOKUP_INPUT) {
5344
+ column.onReturn(row);
5345
+ }
5187
5346
  }
5188
5347
  };
5189
5348
  GridComponent.prototype.setFilterFocusOut = function (col, filter, event) {
@@ -5598,7 +5757,7 @@
5598
5757
  GridComponent.decorators = [
5599
5758
  { type: i0.Component, args: [{
5600
5759
  selector: 'se-grid',
5601
- template: "<p-confirmDialog\n [style]=\"{ width: '50vw' }\"\n *ngIf=\"useInlineCRUD\"\n key=\"handleInlineCRUD\"\n></p-confirmDialog>\n<p-confirmDialog\n [style]=\"{ width: '50vw' }\"\n *ngIf=\"columnActions.length > 0\"\n key=\"handlecolumnActions\"\n></p-confirmDialog>\n<div class=\"p-mb-2 p-d-flex p-ai-center\"\n *ngIf=\"\n allowColumnToggle ||\n rowActions.length > 0 ||\n useInlineCRUD ||\n allowExportToExcel ||\n allowExportToPdf ||\n clearGridFilter\n \"\n>\n<!-- button for apply filterValue on Grid -->\n <button\n *ngIf=\"filtering && !hideFilter\"\n pButton\n type=\"button\"\n icon=\"pi pi-search\"\n (click)=\"applyGirdFilterBtn()\"\n [class]=\"\n searchGridFilter ? 'p-button-success p-mr-2 p-ml-1' : 'hide-clear-filter-button'\n \"\n></button>\n\n<!-- button for clear filterValue on Grid -->\n <button\n *ngIf=\"filtering && !hideFilter\"\n pButton\n id=\"clearGridFilterValuesButton\"\n type=\"button\"\n icon=\"pi pi-replay\"\n (click)=\"cleargridFiltersValue()\"\n [class]=\"\n clearGridFilter ? 'p-button-danger p-mr-2 p-ml-1' : 'hide-clear-filter-button'\n \"\n></button>\n\n<!-- button for edit all grid at once -->\n<!-- <button\n pButton\n *ngIf=\"hideEditAllRowsBtn && editAllRows\"\n id=\"editBtnGlobalvalues\"\n type=\"button\"\n [label]=\"'Edit'\"\n class=\"p-mr-2 ui-button-info\"\n icon=\"pi pi-pencil\"\n [class]=\"editRowPermission ? '' : 'p-disabled'\"\n (click)=\"editAllRowsAtOnce()\"\n ></button> -->\n\n <!-- button for save all grid at once -->\n <button\n pButton\n *ngIf=\"editAllRows && editRowPermission\"\n id=\"saveAllGridValues\"\n icon=\"pi pi-check\"\n [label]=\"'Save'\"\n [class]=\"hideGridSaveButton ? 'hide-clear-filter-button' : 'p-mr-2 ui-button-info'\"\n type=\"button\"\n (click)=\"saveAllRowsAtOnce()\"\n ></button>\n\n <!-- button for cancel all grid at once -->\n <button\n pButton\n *ngIf=\"editAllRows\"\n id=\"editBtnGlobalvalues\"\n type=\"button\"\n [label]=\"'Cancel'\"\n icon=\"pi pi-times\"\n class=\"p-mr-2 ui-button-info\"\n (click)=\"cancelAllRowsAtOnce()\"\n ></button>\n\n <!-- header Button for multiSelect on Grid -->\n <span *ngIf=\"allowColumnToggle\">\n <p-multiSelect\n [showToggleAll]=\"false\"\n [options]=\"columns\"\n [(ngModel)]=\"selectedColumns\"\n optionLabel=\"header\"\n selectedItemsLabel=\"{0} columns selected\"\n [style]=\"{ minWidth: '200px' }\"\n placeholder=\"Choose Columns\"\n >\n </p-multiSelect>\n </span>\n\n <!-- <button\n pButton\n *ngIf=\"showRefreshBtn\"\n type=\"button\"\n [label]=\"'Refresh'\"\n icon=\"pi pi-refresh\"\n (click)=\"refresh()\"\n class=\"ui-button-info p-mr-2\"\n></button> -->\n\n <!-- header Button for Adding new Row on Grid -->\n <button\n pButton\n *ngIf=\"useInlineCRUD && addRowPermission && !hideAddBtn\"\n type=\"button\"\n [label]=\"'Add'\"\n pAddRow\n [table]=\"componentTableRef\"\n [newRow]=\"newGridRow\"\n [id]=\"dataKey\"\n pTooltip=\"Add New Row\"\n tooltipPosition=\"bottom\"\n icon=\"pi pi-plus\"\n class=\"ui-button-info p-mr-2 p-ml-2\"\n (click)=\"addNewRow(newGridRow, true)\"\n pRipple\n ></button>\n \n<!-- header Button for Excel File on Grid -->\n<button\n *ngIf=\"allowExportToExcel\"\n type=\"button\"\n pButton\n icon=\"pi pi-file-excel\"\n (click)=\"exportExcel()\"\n class=\"p-button-success p-mt-0 p-mx-2\"\n pTooltip=\"Export to Excel\"\n tooltipPosition=\"bottom\"\n pRipple\n></button>\n\n<!-- header Button for PDF File on Grid -->\n<button\n *ngIf=\"allowExportToPdf\"\n type=\"button\"\n pButton\n icon=\"pi pi-file-pdf\"\n (click)=\"exportPdf()\"\n class=\"p-button-warning p-mr-2\"\n pTooltip=\"Export to Pdf\"\n tooltipPosition=\"bottom\"\n pRipple\n></button>\n</div>\n\n<p-table\n *ngIf=\"!isGridHidden\"\n id=\"my-table\"\n [value]=\"rowsData\"\n [columns]=\"selectedColumns\"\n sortMode=\"multiple\"\n [lazy]=\"useServerSideEvents\"\n [paginator]=\"pagination\"\n [class]=\"pagination || !rowsData.length ? 'pagination' : ''\"\n [rows]=\"defaultRows\"\n [totalRecords]=\"totalRecords\"\n [rowsPerPageOptions]=\"setPaginationLength\"\n [showCurrentPageReport]=\"showCurrentPageReport\"\n currentPageReportTemplate=\"Showing {first} to {last} of {{\n totalRecords\n }} entries\"\n [loading]=\"autoLoadData && !setGridRefreshTime ? loading : false\"\n (onSort)=\"sortDisabled ?? handleSortChange($event)\"\n (onFilter)=\"handleFilterChange($event)\"\n (onLazyLoad)=\"autoLoadData ? handleServerSideEvents($event) : ''\"\n (onPage)=\"handleServerSidePagination($event)\"\n #dt\n [dataKey]=\"dataKey\"\n [(selection)]=\"selectedRows\"\n [scrollable]=\"scrollable\"\n [scrollHeight]=\"scrollHeight\"\n editMode=\"row\"\n [editingRowKeys]=\"editingRowKeys\"\n [autoLayout]=\"true\"\n [rowHover]=\"rowHover\"\n [ngClass]=\"{'horizontal-scroll': horizontalScroll === true ? true : false}\"\n>\n <!-- header Button for Action on Grid -->\n <div\n *ngIf=\"rowActions.length > 0 && rowActions.length > 0\"\n class=\"p-d-flex p-jc-end\"\n >\n <span *ngFor=\"let rowAction of rowActions\">\n <button\n pButton\n type=\"button\"\n [label]=\"rowAction.title\"\n [class]=\"rowAction.class\"\n (click)=\"rowAction.onClick(selectedRows)\"\n ></button>\n </span>\n </div>\n\n <!-- header columns on Grid -->\n <ng-template pTemplate=\"header\" let-cols>\n <tr>\n <th *ngIf=\"allowSelection\" [ngStyle]=\"{ width: selectionColumnWidth }\" style=\"justify-content: center\">\n\n <div style=\"display: flex;align-items: center;white-space: nowrap;\">\n <span class=\"flex-grow-1 p-mr-2\"> {{allowSelectionHeader}} </span>\n <p-tableHeaderCheckbox\n *ngIf=\"selectionType === 'multiple'\"\n binary=\"true\"\n (click)=\"multiCheckBoxOnclick(rowsData, $event)\"\n ></p-tableHeaderCheckbox>\n </div>\n </th>\n <!-- <th *ngIf=\"allowSelection\" [ngStyle]=\"{ width: selectionColumnWidth }\">\n Select\n </th> -->\n <th\n *ngIf=\"setActionColumnAsFirst && !disabledSaveBtn && columns?.length > 0 && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"\n >\n Actions\n </th>\n <th\n *ngFor=\"let column of cols\"\n [pSortableColumn]=\"column.field\"\n [style]=\"column.style\"\n [pSortableColumnDisabled]=\"sortDisabled && useServerSideEvents ? true : column.sorting === false\"\n >\n <div style=\"display: flex;align-items: center;white-space: nowrap;\">\n <span class=\"flex-grow-1\">{{ column.header }}</span>\n <span *ngIf=\"column.isRequired\">*</span>\n <p-sortIcon\n *ngIf=\"column.sorting !== false\"\n [field]=\"column.field\"\n ></p-sortIcon>\n </div>\n </th>\n <th *ngIf=\"!setActionColumnAsFirst && !disabledSaveBtn && columns?.length > 0 && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">Actions</th>\n </tr>\n <tr *ngIf=\"filtering && !hideFilter\">\n <!-- <th *ngIf=\"allowSelection\">\n <p-tableHeaderCheckbox\n *ngIf=\"selectionType === 'multiple'\"\n (click)=\"multiCheckBoxOnclick(rowsData)\"\n ></p-tableHeaderCheckbox>\n </th> -->\n <th *ngIf=\"allowSelection\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></th>\n <th *ngIf=\"setActionColumnAsFirst && !disabledSaveBtn\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">\n </th>\n <th\n *ngFor=\"let column of cols\"\n [ngSwitch]=\"column?.filter?.type\"\n [style]=\"column.style\"\n [class]=\"hideFilterOptions ? 'hide-table-filter' : ''\"\n >\n <span *ngIf=\"column.filtering !== false\" [class]=\"column.filter?.showFilter ? '' : 'hide-filter-icon'\">\n <!-- Text input on Header For Filter-->\n <p-columnFilter\n [type]=\"'text'\"\n [field]=\"column.field\"\n *ngSwitchCase=\"'input'\"\n >\n <ng-template\n pTemplate=\"filter\"\n let-value\n let-filter=\"filterCallback\"\n >\n <input\n type=\"text\"\n [(ngModel)]=\"column.value\"\n (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n (blur)=\"setFilterFocusOut(column, filter, $event)\"\n (keydown)=\"backspaceEvent($event, column)\"\n (keyup)=\"removingFilters($event, column)\"\n pInputText\n />\n </ng-template>\n </p-columnFilter>\n\n <!-- Numeric input on Header For Filter-->\n <p-columnFilter\n [type]=\"'numeric'\"\n [field]=\"column.field\"\n *ngSwitchCase=\"'numeric_input'\"\n >\n <ng-template\n pTemplate=\"filter\"\n let-value\n let-filter=\"filterCallback\"\n >\n <p-inputNumber\n [(ngModel)]=\"column.value\"\n (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n (onBlur)=\"setFilterFocusOut(column, filter, $event)\"\n (keydown)=\"backspaceEvent($event, column)\"\n (keyup)=\"removingFilters($event, column)\"\n ></p-inputNumber>\n </ng-template>\n </p-columnFilter>\n\n <!-- lookup input on Header For Filter-->\n <p-columnFilter\n [type]=\"'text'\"\n [field]=\"column.field\"\n *ngSwitchCase=\"'lookup_input'\"\n >\n <ng-template\n pTemplate=\"filter\"\n let-value\n let-filter=\"filterCallback\"\n >\n <div class=\"close-icon-wrapper\">\n <input\n id=\"lookUp_filter\"\n autocomplete=\"off\"\n type=\"text\"\n [(ngModel)]=\"column.value\"\n (click)=\"setFilterLookup(column)\"\n (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n (blur)=\"setFilterFocusOut(column, filter, $event)\"\n (keydown)=\"backspaceEvent($event, column)\"\n (keyup)=\"removingFilters($event, column)\"\n pInputText\n />\n <div><button *ngIf=\"column.value\" icon=\"pi pi-times\" pButton type=\"button\" (click)=\"lookupClearValue(column)\"></button></div>\n </div>\n </ng-template>\n </p-columnFilter>\n\n <!-- checkbox on Header For Filter-->\n <p-columnFilter\n type=\"boolean\"\n [field]=\"column.field\"\n *ngSwitchCase=\"'checkbox'\"\n >\n <ng-template\n pTemplate=\"filter\"\n let-value\n let-filter=\"filterCallback\"\n >\n <p-checkbox\n [binary]=\"true\"\n [(ngModel)]=\"column.value\"\n (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n (onChange)=\"setFilterFocusOut(column, filter, $event)\"\n (click)=\"clickCheckBoxFilter(column)\"\n (keydown)=\"backspaceEvent($event, column)\"\n >\n </p-checkbox>\n </ng-template>\n </p-columnFilter>\n\n <!-- multiSelect on Header For Filter-->\n <p-columnFilter\n [field]=\"column.field\"\n matchMode=\"in\"\n [showMenu]=\"false\"\n *ngSwitchCase=\"'multi-select'\"\n >\n <ng-template\n pTemplate=\"filter\"\n let-value\n let-filter=\"filterCallback\"\n >\n <p-multiSelect\n [ngModel]=\"value\"\n [options]=\"column.filter.data || []\"\n (onChange)=\"filter($event.value)\"\n (blur)=\"setFilterFocusOut(column, filter, $event)\"\n (keydown)=\"backspaceEvent($event, column)\"\n placeholder=\"Any\"\n optionLabel=\"label\"\n >\n </p-multiSelect>\n </ng-template>\n </p-columnFilter>\n\n <!-- dropdown on Header For Filter-->\n <p-columnFilter\n [field]=\"column.field\"\n matchMode=\"in\"\n [showMenu]=\"false\"\n *ngSwitchCase=\"'dropdown'\"\n >\n <ng-template\n pTemplate=\"filter\"\n let-value\n let-filter=\"filterCallback\"\n >\n <p-dropdown\n [showClear]=\"true\"\n [placeholder]=\"'Select'\"\n [filter]=\"column.allowSearch\"\n [(ngModel)]=\"column.value\"\n (keyup.enter)=\"applyDropdownFilter(filter, $event)\"\n [options]=\"column.filter.data || []\"\n (onChange)=\"searchDropdownFilter(filter, $event, column)\"\n ></p-dropdown>\n </ng-template>\n </p-columnFilter>\n\n <!-- calendar on Header For Filter-->\n <p-columnFilter\n [field]=\"column.field\"\n matchMode=\"in\"\n [showMenu]=\"false\"\n *ngSwitchCase=\"'calendar'\"\n >\n <ng-template\n pTemplate=\"filter\"\n let-value\n let-filter=\"filterCallback\"\n >\n <p-calendar\n [placeholder]=\"'Select-Date'\"\n [(ngModel)]=\"column.value\"\n (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n appendTo=\"body\"\n (onSelect)=\"selectDate(column)\"\n [inputId]=\"column.field\"\n hourFormat=\"12\"\n (keyup.backspace)=\"removeNullCalendar(column, filter, $event)\"\n [showButtonBar]=\"true\"\n (onClose)=\"setFilterFocusOut(column, filter, $event)\"\n (keydown)=\"backspaceEvent($event, column)\"\n (onClearClick)=\"backspaceEvent($event, column)\"\n >\n </p-calendar>\n </ng-template>\n </p-columnFilter>\n\n <!-- Default Filter For Header -->\n <p-columnFilter\n [type]=\"\n column.type && column.type !== 'link' ? column.type : 'text'\n \"\n [field]=\"column.field\"\n display=\"menu\"\n *ngSwitchDefault\n >\n </p-columnFilter>\n </span>\n </th>\n <th *ngIf=\"!setActionColumnAsFirst && !disabledSaveBtn && columns?.length > 0 && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></th>\n </tr>\n </ng-template>\n\n <!-- Body columns on Grid -->\n <ng-template pTemplate=\"body\" let-row let-editing=\"editing\" let-ri=\"rowIndex\">\n <tr\n [ngClass]=\"row.highlightrow ? 'highlighted-row' : ''\"\n [class]=\"wordWrap ? '' : 'noWrap'\"\n (click)=\"!editing && handleRowClick(row)\"\n [pEditableRow]=\"row\"\n #gridRow\n [id]=\"row[dataKey]\"\n >\n <td *ngIf=\"allowSelection\" [ngStyle]=\"{ width: selectionColumnWidth }\">\n <p-tableRadioButton\n [value]=\"row\"\n *ngIf=\"selectionType === 'single'\"\n (click)=\"multiCheckBoxOnclick(row, $event, true)\"\n ></p-tableRadioButton>\n <p-tableCheckbox\n [value]=\"row\"\n *ngIf=\"selectionType === 'multiple'\"\n (click)=\"multiCheckBoxOnclick(row, $event)\"\n ></p-tableCheckbox>\n </td>\n\n <!-- first actions column -->\n <td *ngIf=\"setActionColumnAsFirst && columnActions.length > 0\">\n <span class=\"action-btn\" *ngFor=\"let action of columnActions\">\n <i\n [title]=\"action.tooltip\"\n [class]=\"action.icon\"\n (click)=\"handleActionClick($event, action, row)\"\n ></i>\n </span>\n </td>\n <td *ngIf=\"setActionColumnAsFirst && useInlineCRUD && (deleteRowPermission || editRowPermission)\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\" [ngClass]=\"disabledSaveBtn ? 'hide-clear-filter-button' : ''\">\n <span class=\"setActionColumnWidth\">\n <se-grid-row-actions\n [editing]=\"editing\"\n [editRowPermission]=\"editRowPermission\"\n [deleteRowPermission]=\"deleteRowPermission\"\n [hideDeleteBtn]=\"hideDeleteBtn\"\n [hideEditBtn]=\"hideEditBtn\"\n [row]=\"row\"\n (onRowEditInitBtn)=\"onRowEditInit($event)\"\n (deleteRecordBtn)=\"deleteRecord($event)\"\n (onRowEditSaveBtn)=\"onRowEditSave($event)\"\n (onRowEditCancelBtn)=\"onRowEditCancel($event, ri)\"\n [editAllRows]=\"editAllRows\"\n >\n </se-grid-row-actions>\n </span>\n </td>\n\n <!-- Grid Rows Data Bindings Start -->\n <td\n *ngFor=\"let column of selectedColumns\"\n [ngSwitch]=\"column.type\"\n [style]=\"column.style\"\n >\n\n <!-- Boolean column on Grid -->\n <span *ngSwitchCase=\"'boolean'\">\n <td *ngIf=\"!editing\">\n <p-checkbox\n [disabled]=\"true\"\n [binary]=\"true\"\n (click)=\"selectedRow(row)\"\n (blur)=\"onFocusOutEvent(column, row)\"\n [(ngModel)]=\"\n row[column.field] &&\n (row[column.field].toString() === '1' ||\n row[column.field].toString().toLowerCase() === 'true' ||\n row[column.field].toString().toLowerCase() === 'y')\n ? checked\n : unChecked\n \"\n >\n </p-checkbox>\n </td>\n <td *ngIf=\"editing\">\n <span *ngSwitchCase=\"'boolean'\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <!-- for edit checkBox -->\n <p-checkbox\n (click)=\"onClickEvent(column, row)\"\n (ngModelChange)=\"checkBoxChangeEvent($event, column, row)\"\n [disabled]=\"allowDisabled(column,row)\"\n [binary]=\"true\"\n [(ngModel)]=\"\n row[column.field] &&\n (row[column.field].toString() === '1' ||\n row[column.field].toString().toLowerCase() === 'true' ||\n row[column.field].toString().toLowerCase() === 'y')\n ? editModeChecked\n : editModeunCkecked\n \"\n (blur)=\"onFocusOutEvent(column, row)\"\n ></p-checkbox>\n </ng-template>\n <ng-template pTemplate=\"output\">\n {{ row[column.field] }}\n </ng-template>\n </p-cellEditor>\n </span>\n </td>\n </span>\n\n <!-- link column on Grid -->\n <span *ngSwitchCase=\"'link'\">\n <!-- link column for HyperLink Case -->\n <span *ngIf=\"column.allowSave === false\">\n <span\n *ngIf=\"column.target !== '_self'\"\n (click)=\"onClickEvent(column, row)\"\n [title]=\"setConditionBaseValue(row, column)\"\n [class]=\"column.editable === false ? '' : allowDisabled(column,row) ? 'disable-link' : ''\"\n >\n <a [href]=\"row[column.field + '_obj']?.hyperlink\" target=\"_blank\">\n {{\n setConditionBaseValue(row, column)\n }}\n </a>\n </span>\n <span\n *ngIf=\"column.target === '_self'\"\n (click)=\"onClickEvent(column, row)\"\n [title]=\"setConditionBaseValue(row, column)\"\n [class]=\"column.editable === false ? '' : allowDisabled(column,row) ? 'disable-link' : ''\"\n >\n <a [href]=\"row[column.field + '_obj']?.hyperlink\">\n {{\n setConditionBaseValue(row, column)\n }}\n </a>\n </span>\n </span>\n <!-- link column for Edit Case -->\n <span *ngIf=\"column.allowSave || column.allowSave === undefined\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <span *ngIf=\"(column.editable === true || column.editable === undefined) && (column.editLink === true || column.editLink === undefined)\">\n <input\n *ngIf=\"!row.isNew\"\n pInputText\n (click)=\"onClickEvent(column, row)\"\n type=\"text\"\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [(ngModel)]=\"typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.action?.displayField?.toLowerCase() ?\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\n (blur)=\"onFocusOutEvent(column, row)\"\n (change)=\"onChangeEvent(column, row)\"\n />\n <input\n pInputText\n *ngIf=\"row.isNew\"\n type=\"text\"\n (click)=\"onClickEvent(column, row)\"\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [(ngModel)]=\"typeOf(row[column.field]) === 'object' ? row[column.field]?.action?.displayField?.toLowerCase() ?\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\n (blur)=\"onFocusOutEvent(column, row)\"\n (change)=\"onChangeEvent(column, row)\"\n />\n </span>\n <span *ngIf=\"column.editable === false\" \n [class]=\"allowDisabled(column,row) ? 'disable-link' : 'hyperlink'\">\n {{\n setConditionBaseValue(row, column)\n }}\n </span>\n <span *ngIf=\"column.editLink === false\">\n <a (click)=\"onClickEvent(column, row)\" [href]=\"row[column.field + '_obj']?.hyperlink\" target=\"_blank\" \n [class]=\"column.editable === false ? '' : allowDisabled(column,row) ? 'disable-link' : ''\">\n {{\n setConditionBaseValue(row, column)\n }}\n </a>\n </span>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span>\n <a (click)=\"onClickEvent(column, row)\" [href]=\"row[column.field + '_obj']?.hyperlink\" target=\"_blank\" \n [class]=\"column.editable === false ? '' : allowDisabled(column,row) ? 'disable-link' : ''\">\n {{\n setConditionBaseValue(row, column)\n }}\n </a>\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n </span>\n\n <!-- Iframe column on Grid -->\n <span *ngSwitchCase=\"'iframe'\">\n <span\n class=\"custom-link\"\n (click)=\"\n gridIFrame(column, row[column.field + '_obj'].hyperlink, row)\n \"\n [title]=\"\n row[column.field + '_obj'] &&\n (row[column.field + '_obj'].displayText === null || row[column.field + '_obj'].displayText === '')\n ? row[column.field] : row[column.field + '_obj']?.displayText\n ? row[column.field + '_obj'].displayText\n : column.displayText\n ? column.displayText\n : row[column.field]\n \"\n >\n {{\n row[column.field + '_obj'] &&\n (row[column.field + '_obj'].displayText === null || row[column.field + '_obj'].displayText === '')\n ? row[column.field] : row[column.field + '_obj']?.displayText\n ? row[column.field + '_obj'].displayText\n : column.displayText ? column.displayText : row[column.field]\n }}\n </span>\n </span>\n\n <!-- dialog column on Grid -->\n <span *ngSwitchCase=\"'dialog'\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <span\n *ngIf=\"row[column.field + '_secondType'] !== 'date' && !row.hidegridbtn\"\n [title]=\"setConditionBaseValue(row, column)\"\n >\n <span *ngIf=\"column.editable === true\">\n <input\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\n type=\"text\"\n pInputText\n [(ngModel)]=\"typeOf(row[column.field]) === 'object' ? row[column.field]?.action?.displayField?.toLowerCase() ?\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\n [name]=\"row[column.field]\"\n [disabled]=\"allowDisabled(column,row)\"\n (blur)=\"onFocusOutEvent(column, row)\"\n />\n </span>\n <span\n *ngIf=\"\n column.editable === false || column.editable === undefined\n \"\n [class]=\"\n allowDisabled(column,row) ? 'disable-link custom-link' : 'custom-link'\n \"\n (click)=\"openGridDialog(column, row)\"\n >\n {{ !column.displayText && row.isNew ? '' : setConditionBaseValue(row, column) }}\n </span>\n </span>\n\n <span\n *ngIf=\"row[column.field + '_secondType'] === 'date'\"\n [title]=\"\n row[column.field]\n | date: (column.format ? column.format : 'MM/dd/YY')\n \"\n >\n <p-calendar\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\n (onClose)=\"onFocusOutEvent(column, row)\"\n [appendTo]=\"'body'\"\n hourFormat=\"12\"\n [showTime]=\"column.showTime\"\n (click)=\"onClickEvent(column, row)\"\n [timeOnly]=\"column.timeOnly\"\n [(ngModel)]=\"typeOf(row[column.field]) === 'object' ? row[column.field]?.action?.displayField?.toLowerCase() ?\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\n [disabled]=\"allowDisabled(column,row)\"\n ></p-calendar>\n </span>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span\n [class]=\"row.disabled == false ? 'custom-link' : column.editable === false ? 'custom-link' : allowDisabled(column,row) ? 'disable-link custom-link' : 'custom-link'\"\n (click)=\"openGridDialog(column, row)\"\n *ngIf=\"!row[column.field + '_secondType'] && !row.hidegridbtn\"\n [title]=\"setConditionBaseValue(row, column)\"\n >\n {{ setConditionBaseValue(row, column) }}\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n\n <!-- lookup Input column on Grid -->\n <span *ngSwitchCase=\"'lookup_input'\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <div class=\"close-icon-wrapper\">\n <input\n readonly\n type=\"text\"\n pInputText\n [(ngModel)]=\"(column.disabled || column.editable === false) && column.displayField ? row[column.displayField] : typeOf(row[column.field]) === 'object' ?\n row[column.field]?.action?.displayField?.toLowerCase() ?\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\n [name]=\"row[column.field]\"\n (keyup.tab)=\"selectLookupField(column, row)\"\n [disabled]=\"allowDisabled(column,row)\"\n (click)=\"selectLookupField(column, row)\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n \t(blur)=\"onFocusOutEvent(column, row)\"\n />\n <div *ngIf=\"!allowDisabled(column,row)\"><button *ngIf=\"row[column.field] && typeOf(row[column.field]) === 'object'\n ? row[column.field].text\n : row[column.field] && !column.disabled\" icon=\"pi pi-times\" pButton type=\"button\" (click)=\"lookupClearValue(column,row)\"></button></div>\n </div>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span *ngIf=\"column.linkId\">\n <a [href]=\"row[column.field + '_obj']?.hyperlink\" [target]=\"column.target === '_self' ? '' : '_blank'\"> \n {{\n typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.text : row[column.displayField]\n ? row[column.displayField]\n : row[column.field]\n }}\n </a>\n </span>\n <span\n *ngIf=\"!column.linkId\"\n [class]=\"column.component && column.editLink === true ? 'custom-link' : ''\"\n (click)=\"openLookupHyperlink(column, row)\"\n >\n {{\n typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.text : row[column.displayField]\n ? row[column.displayField]\n : row[column.field]\n }}\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n\n <!-- Numeric Input column on Grid -->\n <span *ngSwitchCase=\"'numeric'\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <!-- for Currency && Decimal && Percent -->\n <span class=\"input-number\">\n <p-inputNumber\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\n [class]=\"\n column.errorMessage\n ? 'ng-invalid ng-dirty'\n : 'form-control'\n \"\n [showButtons]=\"!column.format ? true : false\"\n [(ngModel)]=\"typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.action?.displayField?.toLowerCase() ?\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\n [name]=\"column.field\"\n [disabled]=\"allowDisabled(column,row)\"\n (ngModelChange)=\"onChangeEvent(column, row)\"\n (onBlur)=\"onFocusOutEvent(column, row)\"\n [mode]=\"\n column.format &&\n column.format.type === 'currency'\n ? 'currency'\n : 'decimal'\n \"\n [currency]=\"\n column.format &&\n column.format.type === 'currency' &&\n column.format.formatParams &&\n column.format.formatParams.currency\n ? column.format.formatParams.currency\n : 'USD'\n \"\n [locale]=\"\n column.format &&\n column.format.type === 'currency' &&\n column.format.formatParams &&\n column.format.formatParams.locale\n ? column.format.formatParams.locale\n : 'en-US'\n \"\n [minFractionDigits]=\"column.format ? setNumericMinMxFraction(column) : '0'\"\n [maxFractionDigits]=\"column.format ? setNumericMinMxFraction(column) : '0'\"\n [suffix]=\"\n column.format &&\n column.format.type === 'percent' && !column?.format?.formatParams?.allowCalculate \n ? '%'\n : ''\n \"\n >\n </p-inputNumber>\n </span>\n <ng-template #locked_field\n ><span *ngIf=\"!row.isNew\" [title]=\"row[column.field]\">\n {{ row[column.field] }}\n </span></ng-template\n >\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span\n [title]=\"setNumericFormat(column, row)\">\n {{\n setNumericFormat(column, row)\n }}\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n \n <!-- Button column on Grid -->\n <span [title]=\"column.value ? column.value : column.icon\">\n <div *ngSwitchCase=\"'add_button'\">\n <button *ngIf=\"!row.hidegridbtn\"\n pButton\n type=\"button\"\n [icon]=\"row[column.field]?.action?.icon ? row[column.field]?.action?.icon : column.icon\"\n [name]=\"column.header\"\n class=\"merge-btn\"\n [disabled]=\"allowDisabled(column,row)\"\n [label]=\"row[column.field]?.action?.displayText ? row[column.field]?.action?.displayText : column.value\"\n [ngStyle]=\"{\n background: column.color ? column.color : ''\n }\"\n (click)=\"onClickButton(column, row)\"\n ></button>\n </div>\n </span>\n\n <!-- Date column on Grid -->\n <span\n *ngSwitchCase=\"'date'\"\n [title]=\"setConditionBaseValue(row,column)\"\n >\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <p-calendar\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty ' + column.field + row[dataKey] : column.field + row[dataKey]\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\n (onClose)=\"onFocusOutEvent(column, row)\"\n [appendTo]=\"'body'\"\n hourFormat=\"12\"\n [defaultDate]=\"defaultDate\"\n [stepMinute] = \"column.minutesInterval ? column.minutesInterval : 1\"\n [showTime]=\"column.showTime\"\n [timeOnly]=\"column.timeOnly\"\n [dateFormat]=\"column.format ? column.format : calendarFormat\"\n (keyup)=\"calenderInputValue(column, row)\"\n (onShow)=\"onClickEvent(column, row)\"\n [(ngModel)]=\"typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.action?.displayField?.toLowerCase() ?\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\n [disabled]=\"allowDisabled(column,row)\"\n ></p-calendar>\n </ng-template>\n <ng-template pTemplate=\"output\">\n {{ setConditionBaseValue(row,column) }}\n </ng-template>\n </p-cellEditor>\n </span>\n <span *ngSwitchDefault>\n <span [ngSwitch]=\"column.type\">\n <!-- Dropdown column on Grid -->\n <span\n *ngSwitchCase=\"'dropdown'\"\n [class]=\"dropdownInput ? '' : 'output-dropdown'\"\n [title]=\"\n setDropdwonReadOnlyValue(row, column)\n \"\n >\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <p-dropdown\n *ngIf=\"!row[column.field]?.action?.hidden\"\n [options]=\"\n row[column.field+'_data']\n ? row[column.field+'_data']\n : column.data\n \"\n [(ngModel)]=\"typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.action?.displayField?.toLowerCase() ?\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\n [disabled]=\"allowDisabled(column,row)\"\n [placeholder]=\"row[column.displayField]\n ? row[column.displayField]\n : row[column.field] ? row[column.field] : 'Select'\"\n [showClear]=\"row[column.field] ? true : false\"\n [optionLabel]=\"column.optionLabel\"\n (click)=\"onClickEvent(column, row)\"\n [optionValue]=\"column.optionValue\"\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\n (blur)=\"onFocusOutEvent(column, row)\"\n (onChange)=\"onChangeEvent(column, row)\"\n [filter]=\"column.allowSearch\"\n ></p-dropdown>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span *ngIf=\"!row[column.field]?.action?.hidden\">\n {{\n setDropdwonReadOnlyValue(row, column)\n }}\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n\n <!-- MultiSelect column on Grid -->\n <span *ngSwitchCase=\"'multi-select'\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <p-multiSelect\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\n type=\"text\"\n [(ngModel)]=\"typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.action?.displayField?.toLowerCase() ?\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\n [disabled]=\"allowDisabled(column,row)\"\n [options]=\"column.data\"\n [optionLabel]=\"column.optionLabel\"\n [optionValue]=\"column.optionValue\"\n (onChange)=\"onChangeEvent(column, row)\"\n (onPanelShow)=\"showOption(column, row)\"\n (click)=\"onClickEvent(column, row)\"\n [appendTo]=\"'body'\"\n (blur)=\"onFocusOutEvent(column, row)\"\n >\n </p-multiSelect>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span\n [title]=\"\n row[column.displayField]\n ? row[column.displayField]\n : setMultiSelectData(column, row[column.field])\n \"\n >\n {{\n row[column.displayField]\n ? row[column.displayField] :\n setMultiSelectData(column, row[column.field])\n }}\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n\n <!-- AutoComplete Search -->\n <span\n *ngSwitchCase=\"'AutoComplete'\"\n >\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <p-autoComplete\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\n [name]=\"column.header\"\n [suggestions]=\"column.data\"\n [field]=\"column.displayField\"\n [(ngModel)]=\"row[column.field]?.action && row[column.field]?.action?.displayField?.toLowerCase() ?\n row[row[column.field]?.action?.displayField.toLowerCase()] : typeOf(row[column.field]) === 'object' && row[column.field]?.text ? row[column.field]?.text : row[column.field]\" \n [dropdown]=\"column.showOption\"\n (onChange)=\"onChangeEvent(column, row)\"\n (click)=\"onClickEvent(column, row)\"\n (completeMethod)=\"autoSearch($event, column, row)\"\n (onBlur)=\"onFocusOutEvent(column, row)\"\n [disabled]=\"allowDisabled(column,row)\"\n [multiple]=\"true\"\n >\n </p-autoComplete>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span *ngIf=\"row[column.field] && row[column.field][0] && row[column.field][0][column.displayField]\">\n <span *ngFor=\"let value of row[column.field]; let i = index\">\n {{ row[column.field] && row[column.field].length > 1 ? row[column.field].length -1 === i ? value[column.displayField] : value[column.displayField] + ';' : value[column.displayField] }}\n </span>\n </span>\n </ng-template>\n </p-cellEditor>\n </span> \n <!-- Add Generate Report Button -->\n <span *ngSwitchCase=\"'report'\"> \n <p-cellEditor> \n <ng-template pTemplate=\"output\">\n <se-generate-report-btn [repId]=\"column.reportId\" [params]=\"column.params\" [showDialog]=\"column.showDialog\"></se-generate-report-btn>\n </ng-template>\n </p-cellEditor>\n </span>\n\n <span *ngSwitchDefault>\n <!-- Input column on Grid -->\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <input\n pInputText\n type=\"text\"\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\n [(ngModel)]=\"row.undefined ? '' : allowDisabled(column,row) && row[column.displayField] ? row[column.displayField] : typeOf(row[column.field]) === 'object' && (row[column.field]?.action || row[column.field]?.text) ? row[column.field]?.action?.displayField?.toLowerCase() ?\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\n [disabled]=\"allowDisabled(column,row)\"\n (blur)=\"onFocusOutEvent(column, row)\"\n (change)=\"onChangeEvent(column, row)\"\n (click)=\"onClickButton(column, row)\"\n *ngIf=\"column.field !== dataKey; else locked_field\"\n />\n <ng-template #locked_field\n ><span *ngIf=\"!row.isNew\" [title]=\"row[column.field]\">\n {{ row[column.field] }}\n </span></ng-template\n >\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span\n (click)=\"onClickEvent(column, row)\"\n [title]=\"\n column.displayText ? column.displayText : \n row[column.displayField]\n ? row[column.displayField]\n : row[column.field]\n \"\n >\n {{\n row[column.field]?.action ? row[column.field]?.text : column.displayText ? column.displayText : \n row[column.displayField]\n ? row[column.displayField]\n : row[column.field]\n }}\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n </span>\n </span>\n </td>\n <!-- Grid Rows Data Bindings End -->\n\n <!-- Action column on Grid -->\n <td *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && columnActions.length > 0\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">\n <span class=\"action-btn\" *ngFor=\"let action of columnActions\">\n <i\n [title]=\"action.tooltip\"\n [class]=\"action.icon\"\n (click)=\"handleActionClick($event, action, row)\"\n ></i>\n </span>\n </td>\n <td *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && useInlineCRUD && (deleteRowPermission || editRowPermission)\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\" [ngClass]=\"disabledSaveBtn ? 'hide-clear-filter-button' : ''\">\n <span class='setActionColumnWidth'>\n <se-grid-row-actions\n [editing]=\"editing\"\n [editRowPermission]=\"editRowPermission\"\n [deleteRowPermission]=\"deleteRowPermission\"\n [hideDeleteBtn]=\"hideDeleteBtn\"\n [hideEditBtn]=\"hideEditBtn\"\n [row]=\"row\"\n (onRowEditInitBtn)=\"onRowEditInit($event)\"\n (deleteRecordBtn)=\"deleteRecord($event)\"\n (onRowEditSaveBtn)=\"onRowEditSave($event)\"\n (onRowEditCancelBtn)=\"onRowEditCancel($event, ri)\"\n [editAllRows]=\"editAllRows\"\n >\n </se-grid-row-actions>\n </span>\n </td>\n </tr>\n </ng-template>\n\n <!-- Footer columns on Grid -->\n <ng-template pTemplate=\"footer\">\n <tr *ngIf=\"aggregateFooter\">\n <td *ngIf=\"setActionColumnAsFirst && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></td>\n <td *ngFor=\"let outerColumn of selectedColumns\" [style]=\"outerColumn.style\">\n <div *ngFor=\"let innerColumn of selectedColumns\">\n <div *ngFor=\"let aggr of innerColumn?.aggregate\">\n <div *ngIf=\"aggr.aggrValue?.length && ((!aggr.displayField && innerColumn.field.toLowerCase() === outerColumn.field.toLowerCase()) || aggr.displayField && aggr.displayField.toLowerCase() === outerColumn.field.toLowerCase())\">\n <div [innerHTML]=\"aggr.aggrValue\">\n </div>\n </div>\n </div>\n </div>\n </td>\n <td *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></td>\n </tr>\n </ng-template>\n\n <!-- Footer for Empty Message columns on Grid -->\n <ng-template pTemplate=\"emptymessage\">\n <tr>\n <td [attr.colspan]=\"selectedColumns?.length + 1\">No records found.</td>\n </tr>\n </ng-template>\n</p-table>\n",
5760
+ template: "<p-confirmDialog\n [style]=\"{ width: '50vw' }\"\n *ngIf=\"useInlineCRUD\"\n key=\"handleInlineCRUD\"\n></p-confirmDialog>\n<p-confirmDialog\n [style]=\"{ width: '50vw' }\"\n *ngIf=\"columnActions.length > 0\"\n key=\"handlecolumnActions\"\n></p-confirmDialog>\n<div class=\"p-mb-2 p-d-flex p-ai-center\"\n *ngIf=\"\n allowColumnToggle ||\n rowActions.length > 0 ||\n useInlineCRUD ||\n allowExportToExcel ||\n allowExportToPdf ||\n clearGridFilter\n \"\n>\n<!-- button for apply filterValue on Grid -->\n <button\n *ngIf=\"filtering && !hideFilter\"\n pButton\n type=\"button\"\n icon=\"pi pi-search\"\n (click)=\"applyGirdFilterBtn()\"\n [class]=\"\n searchGridFilter ? 'p-button-success p-mr-2 p-ml-1' : 'hide-clear-filter-button'\n \"\n></button>\n\n<!-- button for clear filterValue on Grid -->\n <button\n *ngIf=\"filtering && !hideFilter\"\n pButton\n id=\"clearGridFilterValuesButton\"\n type=\"button\"\n icon=\"pi pi-replay\"\n (click)=\"cleargridFiltersValue()\"\n [class]=\"\n clearGridFilter ? 'p-button-danger p-mr-2 p-ml-1' : 'hide-clear-filter-button'\n \"\n></button>\n\n<!-- button for edit all grid at once -->\n<!-- <button\n pButton\n *ngIf=\"hideEditAllRowsBtn && editAllRows\"\n id=\"editBtnGlobalvalues\"\n type=\"button\"\n [label]=\"'Edit'\"\n class=\"p-mr-2 ui-button-info\"\n icon=\"pi pi-pencil\"\n [class]=\"editRowPermission ? '' : 'p-disabled'\"\n (click)=\"editAllRowsAtOnce()\"\n ></button> -->\n\n <!-- button for save all grid at once -->\n <button\n pButton\n *ngIf=\"editAllRows && editRowPermission\"\n id=\"saveAllGridValues\"\n icon=\"pi pi-check\"\n [label]=\"'Save'\"\n [class]=\"hideGridSaveButton ? 'hide-clear-filter-button' : 'p-mr-2 ui-button-info'\"\n type=\"button\"\n (click)=\"saveAllRowsAtOnce()\"\n ></button>\n\n <!-- button for cancel all grid at once -->\n <button\n pButton\n *ngIf=\"editAllRows\"\n id=\"editBtnGlobalvalues\"\n type=\"button\"\n [label]=\"'Cancel'\"\n icon=\"pi pi-times\"\n class=\"p-mr-2 ui-button-info\"\n (click)=\"cancelAllRowsAtOnce()\"\n ></button>\n\n <!-- header Button for multiSelect on Grid -->\n <span *ngIf=\"allowColumnToggle\">\n <p-multiSelect\n [showToggleAll]=\"false\"\n [options]=\"columns\"\n [(ngModel)]=\"selectedColumns\"\n optionLabel=\"header\"\n selectedItemsLabel=\"{0} columns selected\"\n [style]=\"{ minWidth: '200px' }\"\n placeholder=\"Choose Columns\"\n >\n </p-multiSelect>\n </span>\n\n <!-- <button\n pButton\n *ngIf=\"showRefreshBtn\"\n type=\"button\"\n [label]=\"'Refresh'\"\n icon=\"pi pi-refresh\"\n (click)=\"refresh()\"\n class=\"ui-button-info p-mr-2\"\n></button> -->\n\n <!-- header Button for Adding new Row on Grid -->\n <button\n pButton\n *ngIf=\"useInlineCRUD && addRowPermission && !hideAddBtn\"\n type=\"button\"\n [label]=\"'Add'\"\n pAddRow\n [table]=\"componentTableRef\"\n [newRow]=\"newGridRow\"\n [id]=\"dataKey\"\n pTooltip=\"Add New Row\"\n tooltipPosition=\"bottom\"\n icon=\"pi pi-plus\"\n class=\"ui-button-info p-mr-2 p-ml-2\"\n (click)=\"addNewRow(newGridRow, true)\"\n pRipple\n ></button>\n \n<!-- header Button for Excel File on Grid -->\n<button\n *ngIf=\"allowExportToExcel\"\n type=\"button\"\n pButton\n icon=\"pi pi-file-excel\"\n (click)=\"exportExcel()\"\n class=\"p-button-success p-mt-0 p-mx-2\"\n pTooltip=\"Export to Excel\"\n tooltipPosition=\"bottom\"\n pRipple\n></button>\n\n<!-- header Button for PDF File on Grid -->\n<button\n *ngIf=\"allowExportToPdf\"\n type=\"button\"\n pButton\n icon=\"pi pi-file-pdf\"\n (click)=\"exportPdf()\"\n class=\"p-button-warning p-mr-2\"\n pTooltip=\"Export to Pdf\"\n tooltipPosition=\"bottom\"\n pRipple\n></button>\n</div>\n\n<p-table\n *ngIf=\"!isGridHidden\"\n id=\"my-table\"\n [value]=\"rowsData\"\n [columns]=\"selectedColumns\"\n sortMode=\"multiple\"\n [lazy]=\"useServerSideEvents\"\n [paginator]=\"pagination\"\n [class]=\"pagination || !rowsData.length ? 'pagination' : ''\"\n [rows]=\"defaultRows\"\n [totalRecords]=\"totalRecords\"\n [rowsPerPageOptions]=\"setPaginationLength\"\n [showCurrentPageReport]=\"showCurrentPageReport\"\n currentPageReportTemplate=\"Showing {first} to {last} of {{\n totalRecords\n }} entries\"\n [loading]=\"autoLoadData && !setGridRefreshTime ? loading : false\"\n (onSort)=\"sortDisabled ?? handleSortChange($event)\"\n (onFilter)=\"handleFilterChange($event)\"\n (onLazyLoad)=\"autoLoadData ? handleServerSideEvents($event) : ''\"\n (onPage)=\"handleServerSidePagination($event)\"\n #dt\n [dataKey]=\"dataKey\"\n [(selection)]=\"selectedRows\"\n [scrollable]=\"scrollable\"\n [scrollHeight]=\"scrollHeight\"\n editMode=\"row\"\n [editingRowKeys]=\"editingRowKeys\"\n [autoLayout]=\"true\"\n [rowHover]=\"rowHover\"\n [ngClass]=\"{'horizontal-scroll': horizontalScroll === true ? true : false}\"\n>\n <!-- header Button for Action on Grid -->\n <div\n *ngIf=\"rowActions.length > 0 && rowActions.length > 0\"\n class=\"p-d-flex p-jc-end\"\n >\n <span *ngFor=\"let rowAction of rowActions\">\n <button\n pButton\n type=\"button\"\n [label]=\"rowAction.title\"\n [class]=\"rowAction.class\"\n (click)=\"rowAction.onClick(selectedRows)\"\n ></button>\n </span>\n </div>\n\n <!-- header columns on Grid -->\n <ng-template pTemplate=\"header\" let-cols>\n <tr>\n <th *ngIf=\"allowSelection\" [ngStyle]=\"{ width: selectionColumnWidth }\" style=\"justify-content: center\">\n\n <div style=\"display: flex;align-items: center;white-space: nowrap;\">\n <span class=\"flex-grow-1 p-mr-2\"> {{allowSelectionHeader}} </span>\n <p-tableHeaderCheckbox\n *ngIf=\"selectionType === 'multiple'\"\n binary=\"true\"\n (click)=\"multiCheckBoxOnclick(rowsData, $event)\"\n ></p-tableHeaderCheckbox>\n </div>\n </th>\n <!-- <th *ngIf=\"allowSelection\" [ngStyle]=\"{ width: selectionColumnWidth }\">\n Select\n </th> -->\n <th\n *ngIf=\"setActionColumnAsFirst && !disabledSaveBtn && columns?.length > 0 && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"\n >\n Actions\n </th>\n <th\n *ngFor=\"let column of cols\"\n [pSortableColumn]=\"column.field\"\n [style]=\"column.style\"\n [pSortableColumnDisabled]=\"sortDisabled && useServerSideEvents ? true : column.sorting === false\"\n >\n <div style=\"display: flex;align-items: center;white-space: nowrap;\">\n <span class=\"flex-grow-1\">{{ column.header }}</span>\n <span *ngIf=\"column.isRequired\">*</span>\n <p-sortIcon\n *ngIf=\"column.sorting !== false\"\n [field]=\"column.field\"\n ></p-sortIcon>\n </div>\n </th>\n <th *ngIf=\"!setActionColumnAsFirst && !disabledSaveBtn && columns?.length > 0 && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">Actions</th>\n </tr>\n <tr *ngIf=\"filtering && !hideFilter\">\n <!-- <th *ngIf=\"allowSelection\">\n <p-tableHeaderCheckbox\n *ngIf=\"selectionType === 'multiple'\"\n (click)=\"multiCheckBoxOnclick(rowsData)\"\n ></p-tableHeaderCheckbox>\n </th> -->\n <th *ngIf=\"allowSelection\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></th>\n <th *ngIf=\"setActionColumnAsFirst && !disabledSaveBtn\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">\n </th>\n <th\n *ngFor=\"let column of cols\"\n [ngSwitch]=\"column?.filter?.type\"\n [style]=\"column.style\"\n [class]=\"hideFilterOptions ? 'hide-table-filter' : ''\"\n >\n <span *ngIf=\"column.filtering !== false\" [class]=\"column.filter?.showFilter ? '' : 'hide-filter-icon'\">\n <!-- Text input on Header For Filter-->\n <p-columnFilter\n [type]=\"'text'\"\n [field]=\"column.field\"\n *ngSwitchCase=\"'input'\"\n >\n <ng-template\n pTemplate=\"filter\"\n let-value\n let-filter=\"filterCallback\"\n >\n <input\n type=\"text\"\n [(ngModel)]=\"column.value\"\n (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n (blur)=\"setFilterFocusOut(column, filter, $event)\"\n (keydown)=\"backspaceEvent($event, column)\"\n (keyup)=\"removingFilters($event, column)\"\n pInputText\n />\n </ng-template>\n </p-columnFilter>\n\n <!-- Numeric input on Header For Filter-->\n <p-columnFilter\n [type]=\"'numeric'\"\n [field]=\"column.field\"\n *ngSwitchCase=\"'numeric_input'\"\n >\n <ng-template\n pTemplate=\"filter\"\n let-value\n let-filter=\"filterCallback\"\n >\n <p-inputNumber\n [(ngModel)]=\"column.value\"\n (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n (onBlur)=\"setFilterFocusOut(column, filter, $event)\"\n (keydown)=\"backspaceEvent($event, column)\"\n (keyup)=\"removingFilters($event, column)\"\n ></p-inputNumber>\n </ng-template>\n </p-columnFilter>\n\n <!-- lookup input on Header For Filter-->\n <p-columnFilter\n [type]=\"'text'\"\n [field]=\"column.field\"\n *ngSwitchCase=\"'lookup_input'\"\n >\n <ng-template\n pTemplate=\"filter\"\n let-value\n let-filter=\"filterCallback\"\n >\n <div class=\"close-icon-wrapper\">\n <input\n id=\"lookUp_filter\"\n autocomplete=\"off\"\n type=\"text\"\n [(ngModel)]=\"column.value\"\n (click)=\"setFilterLookup(column)\"\n (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n (blur)=\"setFilterFocusOut(column, filter, $event)\"\n (keydown)=\"backspaceEvent($event, column)\"\n (keyup)=\"removingFilters($event, column)\"\n pInputText\n />\n <div><button *ngIf=\"column.value\" icon=\"pi pi-times\" pButton type=\"button\" (click)=\"lookupClearValue(column)\"></button></div>\n </div>\n </ng-template>\n </p-columnFilter>\n\n <!-- checkbox on Header For Filter-->\n <p-columnFilter\n type=\"boolean\"\n [field]=\"column.field\"\n *ngSwitchCase=\"'checkbox'\"\n >\n <ng-template\n pTemplate=\"filter\"\n let-value\n let-filter=\"filterCallback\"\n >\n <p-checkbox\n [binary]=\"true\"\n [(ngModel)]=\"column.value\"\n (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n (onChange)=\"setFilterFocusOut(column, filter, $event)\"\n (click)=\"clickCheckBoxFilter(column)\"\n (keydown)=\"backspaceEvent($event, column)\"\n >\n </p-checkbox>\n </ng-template>\n </p-columnFilter>\n\n <!-- multiSelect on Header For Filter-->\n <p-columnFilter\n [field]=\"column.field\"\n matchMode=\"in\"\n [showMenu]=\"false\"\n *ngSwitchCase=\"'multi-select'\"\n >\n <ng-template\n pTemplate=\"filter\"\n let-value\n let-filter=\"filterCallback\"\n >\n <p-multiSelect\n [ngModel]=\"value\"\n [options]=\"column.filter.data || []\"\n (onChange)=\"filter($event.value)\"\n (blur)=\"setFilterFocusOut(column, filter, $event)\"\n (keydown)=\"backspaceEvent($event, column)\"\n placeholder=\"Any\"\n optionLabel=\"label\"\n >\n </p-multiSelect>\n </ng-template>\n </p-columnFilter>\n\n <!-- dropdown on Header For Filter-->\n <p-columnFilter\n [field]=\"column.field\"\n matchMode=\"in\"\n [showMenu]=\"false\"\n *ngSwitchCase=\"'dropdown'\"\n >\n <ng-template\n pTemplate=\"filter\"\n let-value\n let-filter=\"filterCallback\"\n >\n <p-dropdown\n [showClear]=\"true\"\n [placeholder]=\"'Select'\"\n [filter]=\"column.allowSearch\"\n [(ngModel)]=\"column.value\"\n (keyup.enter)=\"applyDropdownFilter(filter, $event)\"\n [options]=\"column.filter.data || []\"\n (onChange)=\"searchDropdownFilter(filter, $event, column)\"\n ></p-dropdown>\n </ng-template>\n </p-columnFilter>\n\n <!-- calendar on Header For Filter-->\n <p-columnFilter\n [field]=\"column.field\"\n matchMode=\"in\"\n [showMenu]=\"false\"\n *ngSwitchCase=\"'calendar'\"\n >\n <ng-template\n pTemplate=\"filter\"\n let-value\n let-filter=\"filterCallback\"\n >\n <p-calendar\n [placeholder]=\"'Select-Date'\"\n [(ngModel)]=\"column.value\"\n (keyup.enter)=\"applyEnterEvent(filter, $event, column)\"\n appendTo=\"body\"\n (onSelect)=\"selectDate(column)\"\n [inputId]=\"column.field\"\n hourFormat=\"12\"\n (keyup.backspace)=\"removeNullCalendar(column, filter, $event)\"\n [showButtonBar]=\"true\"\n (onClose)=\"setFilterFocusOut(column, filter, $event)\"\n (keydown)=\"backspaceEvent($event, column)\"\n (onClearClick)=\"backspaceEvent($event, column)\"\n >\n </p-calendar>\n </ng-template>\n </p-columnFilter>\n\n <!-- Default Filter For Header -->\n <p-columnFilter\n [type]=\"\n column.type && column.type !== 'link' ? column.type : 'text'\n \"\n [field]=\"column.field\"\n display=\"menu\"\n *ngSwitchDefault\n >\n </p-columnFilter>\n </span>\n </th>\n <th *ngIf=\"!setActionColumnAsFirst && !disabledSaveBtn && columns?.length > 0 && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></th>\n </tr>\n </ng-template>\n\n <!-- Body columns on Grid -->\n <ng-template pTemplate=\"body\" let-row let-editing=\"editing\" let-ri=\"rowIndex\">\n <tr\n [ngClass]=\"row.highlightrow ? 'highlighted-row' : ''\"\n [class]=\"wordWrap ? '' : 'noWrap'\"\n (click)=\"!editing && handleRowClick(row)\"\n [pEditableRow]=\"row\"\n #gridRow\n [id]=\"row[dataKey]\"\n >\n <td *ngIf=\"allowSelection\" [ngStyle]=\"{ width: selectionColumnWidth }\">\n <p-tableRadioButton\n [value]=\"row\"\n *ngIf=\"selectionType === 'single'\"\n (click)=\"multiCheckBoxOnclick(row, $event, true)\"\n ></p-tableRadioButton>\n <p-tableCheckbox\n [value]=\"row\"\n *ngIf=\"selectionType === 'multiple'\"\n (click)=\"multiCheckBoxOnclick(row, $event)\"\n ></p-tableCheckbox>\n </td>\n\n <!-- first actions column -->\n <td *ngIf=\"setActionColumnAsFirst && columnActions.length > 0\">\n <span class=\"action-btn\" *ngFor=\"let action of columnActions\">\n <i\n [title]=\"action.tooltip\"\n [class]=\"action.icon\"\n (click)=\"handleActionClick($event, action, row)\"\n ></i>\n </span>\n </td>\n <td *ngIf=\"setActionColumnAsFirst && useInlineCRUD && (deleteRowPermission || editRowPermission)\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\" [ngClass]=\"disabledSaveBtn ? 'hide-clear-filter-button' : ''\">\n <span class=\"setActionColumnWidth\">\n <se-grid-row-actions\n [editing]=\"editing\"\n [editRowPermission]=\"editRowPermission\"\n [deleteRowPermission]=\"deleteRowPermission\"\n [hideDeleteBtn]=\"hideDeleteBtn\"\n [hideEditBtn]=\"hideEditBtn\"\n [row]=\"row\"\n (onRowEditInitBtn)=\"onRowEditInit($event)\"\n (deleteRecordBtn)=\"deleteRecord($event)\"\n (onRowEditSaveBtn)=\"onRowEditSave($event)\"\n (onRowEditCancelBtn)=\"onRowEditCancel($event, ri)\"\n [editAllRows]=\"editAllRows\"\n >\n </se-grid-row-actions>\n </span>\n </td>\n\n <!-- Grid Rows Data Bindings Start -->\n <td\n *ngFor=\"let column of selectedColumns\"\n [ngSwitch]=\"column.type\"\n [style]=\"column.style\"\n >\n\n <!-- Boolean column on Grid -->\n <span *ngSwitchCase=\"'boolean'\">\n <td *ngIf=\"!editing\">\n <p-checkbox\n [disabled]=\"true\"\n [binary]=\"true\"\n (click)=\"selectedRow(row)\"\n (blur)=\"onFocusOutEvent(column, row)\"\n [(ngModel)]=\"\n row[column.field] &&\n (row[column.field].toString() === '1' ||\n row[column.field].toString().toLowerCase() === 'true' ||\n row[column.field].toString().toLowerCase() === 'y')\n ? checked\n : unChecked\n \"\n >\n </p-checkbox>\n </td>\n <td *ngIf=\"editing\">\n <span *ngSwitchCase=\"'boolean'\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <!-- for edit checkBox -->\n <p-checkbox\n (click)=\"onClickEvent(column, row)\"\n (ngModelChange)=\"checkBoxChangeEvent($event, column, row)\"\n [disabled]=\"allowDisabled(column,row)\"\n [binary]=\"true\"\n [(ngModel)]=\"\n row[column.field] &&\n (row[column.field].toString() === '1' ||\n row[column.field].toString().toLowerCase() === 'true' ||\n row[column.field].toString().toLowerCase() === 'y')\n ? editModeChecked\n : editModeunCkecked\n \"\n (blur)=\"onFocusOutEvent(column, row)\"\n ></p-checkbox>\n </ng-template>\n <ng-template pTemplate=\"output\">\n {{ row[column.field] }}\n </ng-template>\n </p-cellEditor>\n </span>\n </td>\n </span>\n\n <!-- link column on Grid -->\n <span *ngSwitchCase=\"'link'\">\n <!-- link column for HyperLink Case -->\n <span *ngIf=\"column.allowSave === false\">\n <span\n *ngIf=\"column.target !== '_self'\"\n (click)=\"onClickEvent(column, row)\"\n [title]=\"setConditionBaseValue(row, column)\"\n [class]=\"column.editable === false ? '' : allowDisabled(column,row) ? 'disable-link' : ''\"\n >\n <a [href]=\"row[column.field + '_obj']?.hyperlink\" target=\"_blank\">\n {{\n setConditionBaseValue(row, column)\n }}\n </a>\n </span>\n <span\n *ngIf=\"column.target === '_self'\"\n (click)=\"onClickEvent(column, row)\"\n [title]=\"setConditionBaseValue(row, column)\"\n [class]=\"column.editable === false ? '' : allowDisabled(column,row) ? 'disable-link' : ''\"\n >\n <a [href]=\"row[column.field + '_obj']?.hyperlink\">\n {{\n setConditionBaseValue(row, column)\n }}\n </a>\n </span>\n </span>\n <!-- link column for Edit Case -->\n <span *ngIf=\"column.allowSave || column.allowSave === undefined\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <span *ngIf=\"(column.editable === true || column.editable === undefined) && (column.editLink === true || column.editLink === undefined)\">\n <input\n *ngIf=\"!row.isNew\"\n pInputText\n (click)=\"onClickEvent(column, row)\"\n type=\"text\"\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [(ngModel)]=\"typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.action?.displayField?.toLowerCase() ?\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\n (blur)=\"onFocusOutEvent(column, row)\"\n (change)=\"onChangeEvent(column, row)\"\n />\n <input\n pInputText\n *ngIf=\"row.isNew\"\n type=\"text\"\n (click)=\"onClickEvent(column, row)\"\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [(ngModel)]=\"typeOf(row[column.field]) === 'object' ? row[column.field]?.action?.displayField?.toLowerCase() ?\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\n (blur)=\"onFocusOutEvent(column, row)\"\n (change)=\"onChangeEvent(column, row)\"\n />\n </span>\n <span *ngIf=\"column.editable === false\" \n [class]=\"allowDisabled(column,row) ? 'disable-link' : 'hyperlink'\">\n {{\n setConditionBaseValue(row, column)\n }}\n </span>\n <span *ngIf=\"column.editLink === false\">\n <a (click)=\"onClickEvent(column, row)\" [href]=\"row[column.field + '_obj']?.hyperlink\" target=\"_blank\" \n [class]=\"column.editable === false ? '' : allowDisabled(column,row) ? 'disable-link' : ''\">\n {{\n setConditionBaseValue(row, column)\n }}\n </a>\n </span>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span>\n <a (click)=\"onClickEvent(column, row)\" [href]=\"row[column.field + '_obj']?.hyperlink\" target=\"_blank\" \n [class]=\"column.editable === false ? '' : allowDisabled(column,row) ? 'disable-link' : ''\">\n {{\n setConditionBaseValue(row, column)\n }}\n </a>\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n </span>\n\n <!-- Iframe column on Grid -->\n <span *ngSwitchCase=\"'iframe'\">\n <span\n class=\"custom-link\"\n (click)=\"\n gridIFrame(column, row[column.field + '_obj'].hyperlink, row)\n \"\n [title]=\"\n row[column.field + '_obj'] &&\n (row[column.field + '_obj'].displayText === null || row[column.field + '_obj'].displayText === '')\n ? row[column.field] : row[column.field + '_obj']?.displayText\n ? row[column.field + '_obj'].displayText\n : column.displayText\n ? column.displayText\n : row[column.field]\n \"\n >\n {{\n row[column.field + '_obj'] &&\n (row[column.field + '_obj'].displayText === null || row[column.field + '_obj'].displayText === '')\n ? row[column.field] : row[column.field + '_obj']?.displayText\n ? row[column.field + '_obj'].displayText\n : column.displayText ? column.displayText : row[column.field]\n }}\n </span>\n </span>\n\n <!-- dialog column on Grid -->\n <span *ngSwitchCase=\"'dialog'\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <span\n *ngIf=\"row[column.field + '_secondType'] !== 'date' && !row.hidegridbtn\"\n [title]=\"setConditionBaseValue(row, column)\"\n >\n <span *ngIf=\"column.editable === true\">\n <input\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\n type=\"text\"\n pInputText\n [(ngModel)]=\"typeOf(row[column.field]) === 'object' ? row[column.field]?.action?.displayField?.toLowerCase() ?\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\n [name]=\"row[column.field]\"\n [disabled]=\"allowDisabled(column,row)\"\n (blur)=\"onFocusOutEvent(column, row)\"\n />\n </span>\n <span\n *ngIf=\"\n column.editable === false || column.editable === undefined\n \"\n [class]=\"\n allowDisabled(column,row) ? 'disable-link custom-link' : 'custom-link'\n \"\n (click)=\"openGridDialog(column, row)\"\n >\n {{ !column.displayText && row.isNew ? '' : setConditionBaseValue(row, column) }}\n </span>\n </span>\n\n <span\n *ngIf=\"row[column.field + '_secondType'] === 'date'\"\n [title]=\"\n row[column.field]\n | date: (column.format ? column.format : 'MM/dd/YY')\n \"\n >\n <p-calendar\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\n (onClose)=\"onFocusOutEvent(column, row)\"\n [appendTo]=\"'body'\"\n hourFormat=\"12\"\n [showTime]=\"column.showTime\"\n (click)=\"onClickEvent(column, row)\"\n [timeOnly]=\"column.timeOnly\"\n [(ngModel)]=\"typeOf(row[column.field]) === 'object' ? row[column.field]?.action?.displayField?.toLowerCase() ?\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\n [disabled]=\"allowDisabled(column,row)\"\n ></p-calendar>\n </span>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span\n [class]=\"row.disabled == false ? 'custom-link' : column.editable === false ? 'custom-link' : allowDisabled(column,row) ? 'disable-link custom-link' : 'custom-link'\"\n (click)=\"openGridDialog(column, row)\"\n *ngIf=\"!row[column.field + '_secondType'] && !row.hidegridbtn\"\n [title]=\"setConditionBaseValue(row, column)\"\n >\n {{ setConditionBaseValue(row, column) }}\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n\n <!-- lookup Input column on Grid -->\n <span *ngSwitchCase=\"'lookup_input'\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <div class=\"close-icon-wrapper\">\n <input\n readonly\n type=\"text\"\n pInputText\n [(ngModel)]=\"(column.disabled || column.editable === false) && column.displayField ? row[column.displayField] : typeOf(row[column.field]) === 'object' ?\n row[column.field]?.action?.displayField?.toLowerCase() ?\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\n [name]=\"row[column.field]\"\n (keyup.tab)=\"selectLookupField(column, row)\"\n [disabled]=\"allowDisabled(column,row)\"\n (click)=\"selectLookupField(column, row)\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n \t(blur)=\"onFocusOutEvent(column, row)\"\n />\n <div *ngIf=\"!allowDisabled(column,row)\"><button *ngIf=\"row[column.field] && typeOf(row[column.field]) === 'object'\n ? row[column.field].text\n : row[column.field] && !column.disabled\" icon=\"pi pi-times\" pButton type=\"button\" (click)=\"lookupClearValue(column,row)\"></button></div>\n </div>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span *ngIf=\"column.linkId\">\n <a [href]=\"row[column.field + '_obj']?.hyperlink\" [target]=\"column.target === '_self' ? '' : '_blank'\"> \n {{\n typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.text : row[column.displayField]\n ? row[column.displayField]\n : row[column.field]\n }}\n </a>\n </span>\n <span\n *ngIf=\"!column.linkId\"\n [class]=\"column.component && column.editLink === true ? 'custom-link' : ''\"\n (click)=\"openLookupHyperlink(column, row)\"\n >\n {{\n typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.text : row[column.displayField]\n ? row[column.displayField]\n : row[column.field]\n }}\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n\n <!-- Numeric Input column on Grid -->\n <span *ngSwitchCase=\"'numeric'\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <!-- for Currency && Decimal && Percent -->\n <span class=\"input-number\">\n <p-inputNumber\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\n [class]=\"\n column.errorMessage\n ? 'ng-invalid ng-dirty'\n : 'form-control'\n \"\n [showButtons]=\"!column.format ? true : false\"\n [(ngModel)]=\"typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.action?.displayField?.toLowerCase() ?\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\n [name]=\"column.field\"\n [disabled]=\"allowDisabled(column,row)\"\n (ngModelChange)=\"onChangeEvent(column, row)\"\n (onBlur)=\"onFocusOutEvent(column, row)\"\n [mode]=\"\n column.format &&\n column.format.type === 'currency'\n ? 'currency'\n : 'decimal'\n \"\n [currency]=\"\n column.format &&\n column.format.type === 'currency' &&\n column.format.formatParams &&\n column.format.formatParams.currency\n ? column.format.formatParams.currency\n : 'USD'\n \"\n [locale]=\"\n column.format &&\n column.format.type === 'currency' &&\n column.format.formatParams &&\n column.format.formatParams.locale\n ? column.format.formatParams.locale\n : 'en-US'\n \"\n [minFractionDigits]=\"column.format ? setNumericMinMxFraction(column) : '0'\"\n [maxFractionDigits]=\"column.format ? setNumericMinMxFraction(column) : '0'\"\n [suffix]=\"\n column.format &&\n column.format.type === 'percent' && !column?.format?.formatParams?.allowCalculate \n ? '%'\n : ''\n \"\n >\n </p-inputNumber>\n </span>\n <ng-template #locked_field\n ><span *ngIf=\"!row.isNew\" [title]=\"row[column.field]\">\n {{ row[column.field] }}\n </span></ng-template\n >\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span\n [title]=\"setNumericFormat(column, row)\">\n {{\n setNumericFormat(column, row)\n }}\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n \n <!-- Button column on Grid -->\n <span [title]=\"column.value ? column.value : column.icon\">\n <div *ngSwitchCase=\"'add_button'\">\n <button *ngIf=\"!row.hidegridbtn\"\n pButton\n type=\"button\"\n [icon]=\"row[column.field]?.action?.icon ? row[column.field]?.action?.icon : column.icon\"\n [name]=\"column.header\"\n class=\"merge-btn\"\n [disabled]=\"allowDisabled(column,row)\"\n [label]=\"row[column.field]?.action?.displayText ? row[column.field]?.action?.displayText : column.value\"\n [ngStyle]=\"{\n background: column.color ? column.color : ''\n }\"\n (click)=\"onClickButton(column, row)\"\n ></button>\n </div>\n </span>\n\n <!-- Date column on Grid -->\n <span\n *ngSwitchCase=\"'date'\"\n [title]=\"setConditionBaseValue(row,column)\"\n >\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <p-calendar\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty ' + column.field + row[dataKey] : column.field + row[dataKey]\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\n (onClose)=\"onFocusOutEvent(column, row)\"\n [appendTo]=\"'body'\"\n hourFormat=\"12\"\n [defaultDate]=\"defaultDate\"\n [stepMinute] = \"column.minutesInterval ? column.minutesInterval : 1\"\n [showTime]=\"column.showTime\"\n [timeOnly]=\"column.timeOnly\"\n [dateFormat]=\"column.format ? column.format : calendarFormat\"\n (keyup)=\"calenderInputValue(column, row)\"\n (onShow)=\"onClickEvent(column, row)\"\n [(ngModel)]=\"typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.action?.displayField?.toLowerCase() ?\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\n [disabled]=\"allowDisabled(column,row)\"\n ></p-calendar>\n </ng-template>\n <ng-template pTemplate=\"output\">\n {{ setConditionBaseValue(row,column) }}\n </ng-template>\n </p-cellEditor>\n </span>\n <span *ngSwitchDefault>\n <span [ngSwitch]=\"column.type\">\n <!-- Dropdown column on Grid -->\n <span\n *ngSwitchCase=\"'dropdown'\"\n [class]=\"dropdownInput ? '' : 'output-dropdown'\"\n [title]=\"\n setDropdwonReadOnlyValue(row, column)\n \"\n >\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <p-dropdown\n *ngIf=\"!row[column.field]?.action?.hidden\"\n [options]=\"\n row[column.field+'_data']\n ? row[column.field+'_data']\n : column.data\n \"\n [(ngModel)]=\"typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.action?.displayField?.toLowerCase() ?\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\n [disabled]=\"allowDisabled(column,row)\"\n [placeholder]=\"row[column.displayField]\n ? row[column.displayField]\n : row[column.field] ? row[column.field] : 'Select'\"\n [showClear]=\"row[column.field] ? true : false\"\n [optionLabel]=\"column.optionLabel\"\n (click)=\"onClickEvent(column, row)\"\n [optionValue]=\"column.optionValue\"\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\n (blur)=\"onFocusOutEvent(column, row)\"\n (onChange)=\"onChangeEvent(column, row)\"\n [filter]=\"column.allowSearch\"\n ></p-dropdown>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span *ngIf=\"!row[column.field]?.action?.hidden\">\n {{\n setDropdwonReadOnlyValue(row, column)\n }}\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n\n <!-- MultiSelect column on Grid -->\n <span *ngSwitchCase=\"'multi-select'\">\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <p-multiSelect\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\n type=\"text\"\n [(ngModel)]=\"typeOf(row[column.field]) === 'object' && row[column.field]?.action ? row[column.field]?.action?.displayField?.toLowerCase() ?\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\n [disabled]=\"allowDisabled(column,row)\"\n [options]=\"column.data\"\n [optionLabel]=\"column.optionLabel\"\n [optionValue]=\"column.optionValue\"\n (onChange)=\"onChangeEvent(column, row)\"\n (onPanelShow)=\"showOption(column, row)\"\n (click)=\"onClickEvent(column, row)\"\n [appendTo]=\"'body'\"\n (blur)=\"onFocusOutEvent(column, row)\"\n >\n </p-multiSelect>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span\n [title]=\"\n row[column.displayField]\n ? row[column.displayField]\n : setMultiSelectData(column, row[column.field])\n \"\n >\n {{\n row[column.displayField]\n ? row[column.displayField] :\n setMultiSelectData(column, row[column.field])\n }}\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n\n <!-- AutoComplete Search -->\n <span\n *ngSwitchCase=\"'AutoComplete'\"\n >\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <p-autoComplete\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\n [name]=\"column.header\"\n [suggestions]=\"column.data\"\n [field]=\"column.displayField\"\n [(ngModel)]=\"row[column.field]?.action && row[column.field]?.action?.displayField?.toLowerCase() ?\n row[row[column.field]?.action?.displayField.toLowerCase()] : typeOf(row[column.field]) === 'object' && row[column.field]?.text ? row[column.field]?.text : row[column.field]\" \n [dropdown]=\"column.showOption\"\n (onChange)=\"onChangeEvent(column, row)\"\n (click)=\"onClickEvent(column, row)\"\n (completeMethod)=\"autoSearch($event, column, row)\"\n (onBlur)=\"onFocusOutEvent(column, row)\"\n [disabled]=\"allowDisabled(column,row)\"\n [multiple]=\"true\"\n (keydown.enter)=\"onAutoCompleteFocusOut($event, column)\"\n >\n </p-autoComplete>\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span *ngIf=\"row[column.field] && row[column.field][0] && row[column.field][0][column.displayField]\">\n <span *ngFor=\"let value of row[column.field]; let i = index\">\n {{ row[column.field] && row[column.field].length > 1 ? row[column.field].length -1 === i ? value[column.displayField] : value[column.displayField] + ';' : value[column.displayField] }}\n </span>\n </span>\n </ng-template>\n </p-cellEditor>\n </span> \n <!-- Add Generate Report Button -->\n <span *ngSwitchCase=\"'report'\"> \n <p-cellEditor> \n <ng-template pTemplate=\"output\">\n <se-generate-report-btn [repId]=\"column.reportId\" [params]=\"column.params\" [showDialog]=\"column.showDialog\"></se-generate-report-btn>\n </ng-template>\n </p-cellEditor>\n </span>\n\n <span *ngSwitchDefault>\n <!-- Input column on Grid -->\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <input\n pInputText\n type=\"text\"\n [class]=\"column.errorMessage ? 'ng-invalid ng-dirty' : ''\"\n [id]=\"allowDisabled(column,row) ? 'hide-border' : ''\"\n [(ngModel)]=\"row.undefined ? '' : allowDisabled(column,row) && row[column.displayField] ? row[column.displayField] : typeOf(row[column.field]) === 'object' && (row[column.field]?.action || row[column.field]?.text) ? row[column.field]?.action?.displayField?.toLowerCase() ?\n row[row[column.field]?.action?.displayField.toLowerCase()] : row[column.field]?.text : row[column.field]\"\n [disabled]=\"allowDisabled(column,row)\"\n (blur)=\"onFocusOutEvent(column, row)\"\n (change)=\"onChangeEvent(column, row)\"\n (click)=\"onClickButton(column, row)\"\n *ngIf=\"column.field !== dataKey; else locked_field\"\n />\n <ng-template #locked_field\n ><span *ngIf=\"!row.isNew\" [title]=\"row[column.field]\">\n {{ row[column.field] }}\n </span></ng-template\n >\n </ng-template>\n <ng-template pTemplate=\"output\">\n <span\n (click)=\"onClickEvent(column, row)\"\n [title]=\"\n column.displayText ? column.displayText : \n row[column.displayField]\n ? row[column.displayField]\n : row[column.field]\n \"\n >\n {{\n row[column.field]?.action ? row[column.field]?.text : column.displayText ? column.displayText : \n row[column.displayField]\n ? row[column.displayField]\n : row[column.field]\n }}\n </span>\n </ng-template>\n </p-cellEditor>\n </span>\n </span>\n </span>\n </td>\n <!-- Grid Rows Data Bindings End -->\n\n <!-- Action column on Grid -->\n <td *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && columnActions.length > 0\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\">\n <span class=\"action-btn\" *ngFor=\"let action of columnActions\">\n <i\n [title]=\"action.tooltip\"\n [class]=\"action.icon\"\n (click)=\"handleActionClick($event, action, row)\"\n ></i>\n </span>\n </td>\n <td *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && useInlineCRUD && (deleteRowPermission || editRowPermission)\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\" [ngClass]=\"disabledSaveBtn ? 'hide-clear-filter-button' : ''\">\n <span class='setActionColumnWidth'>\n <se-grid-row-actions\n [editing]=\"editing\"\n [editRowPermission]=\"editRowPermission\"\n [deleteRowPermission]=\"deleteRowPermission\"\n [hideDeleteBtn]=\"hideDeleteBtn\"\n [hideEditBtn]=\"hideEditBtn\"\n [row]=\"row\"\n (onRowEditInitBtn)=\"onRowEditInit($event)\"\n (deleteRecordBtn)=\"deleteRecord($event)\"\n (onRowEditSaveBtn)=\"onRowEditSave($event)\"\n (onRowEditCancelBtn)=\"onRowEditCancel($event, ri)\"\n [editAllRows]=\"editAllRows\"\n >\n </se-grid-row-actions>\n </span>\n </td>\n </tr>\n </ng-template>\n\n <!-- Footer columns on Grid -->\n <ng-template pTemplate=\"footer\">\n <tr *ngIf=\"aggregateFooter\">\n <td *ngIf=\"setActionColumnAsFirst && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></td>\n <td *ngFor=\"let outerColumn of selectedColumns\" [style]=\"outerColumn.style\">\n <div *ngFor=\"let innerColumn of selectedColumns\">\n <div *ngFor=\"let aggr of innerColumn?.aggregate\">\n <div *ngIf=\"aggr.aggrValue?.length && ((!aggr.displayField && innerColumn.field.toLowerCase() === outerColumn.field.toLowerCase()) || aggr.displayField && aggr.displayField.toLowerCase() === outerColumn.field.toLowerCase())\">\n <div [innerHTML]=\"aggr.aggrValue\">\n </div>\n </div>\n </div>\n </div>\n </td>\n <td *ngIf=\"!setActionColumnAsFirst && columns?.length > 0 && (columnActions.length > 0 || (useInlineCRUD && (deleteRowPermission || editRowPermission)))\" [class]=\"inEditMode ? 'three-action-btn' : 'two-action-btn'\"></td>\n </tr>\n </ng-template>\n\n <!-- Footer for Empty Message columns on Grid -->\n <ng-template pTemplate=\"emptymessage\">\n <tr>\n <td [attr.colspan]=\"selectedColumns?.length + 1\">No records found.</td>\n </tr>\n </ng-template>\n</p-table>\n",
5602
5761
  styles: [".action-btn{margin-right:10px;cursor:pointer}:host ::ng-deep .two-action-btn{flex:0!important;flex-basis:6%!important}:host ::ng-deep .three-action-btn{flex:0!important;flex-basis:8%!important}:host ::ng-deep .p-column-filter-clear-button{display:none}:host ::ng-deep .hide-table-filter .pi-filter:before{display:none}:host ::ng-deep .horizontal-scroll .p-datatable{position:relative;width:calc(100vw - 263px);overflow:auto;height:calc(100vh - 134px)}:host ::ng-deep .horizontal-scroll .p-datatable th,:host ::ng-deep .horizontal-scroll .p-datatable td{min-width:150px}:host ::ng-deep .p-datatable .p-datatable-tbody>tr>td{padding:0 1rem!important}:host ::ng-deep .p-datatable .p-datatable-tbody>tr>td span{vertical-align:middle}:host ::ng-deep td[ng-reflect-ng-switch=multi-select] span{overflow:visible!important}:host ::ng-deep td[ng-reflect-ng-switch=dropdown] span{overflow:visible!important}:host ::ng-deep .input-number{border:0;border-radius:2px;padding:5px 0}:host ::ng-deep .input-number input{border:0;padding:0 10px 0 0;outline:none!important;box-shadow:none!important}:host ::ng-deep .input-number button{color:#2d2d2d;width:15px;height:12px;border:0;background-color:#eee}: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 .hide-filter-icon .p-column-filter-menu-button{display:none}.disable-link{color:#e4b7b8;pointer-events:none;text-decoration:underline;opacity:.5}.hyperlink{color:#cc7272;text-decoration:underline;cursor:pointer}.custom-link{color:#205dcf;cursor:pointer;font-size:12px}.setActionColumnWidth{display:flex}.noWrap td span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:inline-block;max-width:100%}.highlighted-row{background-color:#dee2e6!important}td[ng-reflect-ng-switch=AutoComplete] span{overflow:visible!important}.hide-clear-filter-button{display:none!important}#hide-border{border-bottom:0!important}p-celleditor p-inputnumber{border:0}.merge-btn{margin-top:2px;line-height:14px}.close-icon-wrapper{position:relative}.close-icon-wrapper input{width:100%}.close-icon-wrapper button{position:absolute;right:5px;top:6px;width:25px;height:25px;background:unset;color:#777;border:0}\n"]
5603
5762
  },] }
5604
5763
  ];