cilog-lib 1.11.15 → 1.12.0

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.
@@ -1,24 +1,23 @@
1
1
  import * as i0 from '@angular/core';
2
- import { Component, Injectable, Pipe, EventEmitter, HostListener, ViewChild, Output, Input } from '@angular/core';
3
- import * as i2 from 'primeng/dialog';
2
+ import { Component, signal, Injectable, inject, Pipe, EventEmitter, HostListener, ViewChild, Output, Input } from '@angular/core';
3
+ import * as i1 from 'primeng/dialog';
4
4
  import { DialogModule } from 'primeng/dialog';
5
- import * as i4 from 'primeng/button';
5
+ import * as i3 from 'primeng/button';
6
6
  import { ButtonModule } from 'primeng/button';
7
- import { BehaviorSubject, filter, map, distinctUntilChanged } from 'rxjs';
8
- import * as i1 from 'primeng/api';
7
+ import * as i1$1 from 'primeng/api';
9
8
  import * as i7 from 'primeng/table';
10
9
  import { TableModule } from 'primeng/table';
11
10
  import * as i8 from 'primeng/contextmenu';
12
11
  import { ContextMenuModule } from 'primeng/contextmenu';
13
12
  import * as i16 from 'primeng/inputnumber';
14
13
  import { InputNumberModule } from 'primeng/inputnumber';
15
- import * as i3 from '@angular/common';
14
+ import * as i3$1 from '@angular/common';
16
15
  import { CommonModule } from '@angular/common';
17
16
  import * as i5 from 'primeng/tag';
18
17
  import { TagModule } from 'primeng/tag';
19
18
  import * as i9 from 'primeng/tooltip';
20
19
  import { TooltipModule } from 'primeng/tooltip';
21
- import * as i4$1 from '@angular/forms';
20
+ import * as i4 from '@angular/forms';
22
21
  import { FormsModule } from '@angular/forms';
23
22
  import * as i10 from 'primeng/multiselect';
24
23
  import { MultiSelectModule } from 'primeng/multiselect';
@@ -26,7 +25,7 @@ import * as i11 from 'primeng/datepicker';
26
25
  import { DatePickerModule } from 'primeng/datepicker';
27
26
  import * as i12 from 'primeng/select';
28
27
  import { SelectModule } from 'primeng/select';
29
- import * as i2$1 from 'primeng/inputtext';
28
+ import * as i2 from 'primeng/inputtext';
30
29
  import { InputTextModule } from 'primeng/inputtext';
31
30
  import * as i13 from 'primeng/selectbutton';
32
31
  import { SelectButtonModule } from 'primeng/selectbutton';
@@ -34,16 +33,17 @@ import * as i6 from 'primeng/toggleswitch';
34
33
  import { ToggleSwitchModule } from 'primeng/toggleswitch';
35
34
  import * as Excel from 'exceljs';
36
35
  import * as FileSaver from 'file-saver';
37
- import * as i2$2 from 'primeng/editor';
36
+ import * as i2$1 from 'primeng/editor';
38
37
  import { EditorModule } from 'primeng/editor';
39
- import * as i2$3 from '@angular/router';
38
+ import * as i2$2 from '@angular/router';
40
39
  import { NavigationEnd } from '@angular/router';
40
+ import { filter, map, distinctUntilChanged } from 'rxjs';
41
41
  import * as i5$1 from 'primeng/progressspinner';
42
42
  import { ProgressSpinnerModule } from 'primeng/progressspinner';
43
43
  import * as i6$1 from 'primeng/tabs';
44
44
  import { TabsModule } from 'primeng/tabs';
45
45
  import { MarkdownComponent, provideMarkdown } from 'ngx-markdown';
46
- import * as i1$1 from '@angular/common/http';
46
+ import * as i1$2 from '@angular/common/http';
47
47
 
48
48
  class CilogLibComponent {
49
49
  constructor() { }
@@ -66,23 +66,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
66
66
  }], ctorParameters: () => [] });
67
67
 
68
68
  class CilogMessageService {
69
- display;
70
- message;
71
- constructor() {
72
- this.message = new BehaviorSubject(null);
73
- this.display = new BehaviorSubject(null);
74
- }
69
+ display = signal(false, ...(ngDevMode ? [{ debugName: "display" }] : []));
70
+ message = signal(null, ...(ngDevMode ? [{ debugName: "message" }] : []));
75
71
  showDialog(pContent, pSeverity, pClosable = true, pRefresh = false) {
76
- this.message.next({
72
+ this.message.set({
77
73
  content: pContent,
78
74
  severity: pSeverity,
79
75
  closable: pClosable,
80
76
  refresh: pRefresh
81
77
  });
82
- this.display.next(true);
78
+ this.display.set(true);
83
79
  }
84
80
  closeDialog() {
85
- this.display.next(false);
81
+ this.display.set(false);
86
82
  }
87
83
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: CilogMessageService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
88
84
  static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: CilogMessageService, providedIn: 'root' });
@@ -92,31 +88,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
92
88
  args: [{
93
89
  providedIn: 'root'
94
90
  }]
95
- }], ctorParameters: () => [] });
91
+ }] });
96
92
 
97
93
  class CilogMessageComponent {
98
- messageService;
99
- display;
100
- message;
101
- constructor(messageService) {
102
- this.messageService = messageService;
103
- }
104
- ngOnInit() {
105
- this.display = false;
106
- this.messageService.message.subscribe(message => {
107
- if (message != null) {
108
- this.message = message;
109
- }
110
- });
111
- this.messageService.display.subscribe(display => {
112
- if (display != null) {
113
- this.display = display;
114
- }
115
- });
116
- }
94
+ messageService = inject(CilogMessageService);
117
95
  headerBySeverity() {
118
- if (this.message != null) {
119
- switch (this.message.severity) {
96
+ if (this.messageService.message() != null) {
97
+ switch (this.messageService.message().severity) {
120
98
  case 'warn':
121
99
  return 'Attention';
122
100
  case 'error':
@@ -129,8 +107,8 @@ class CilogMessageComponent {
129
107
  }
130
108
  }
131
109
  iconBySeverity() {
132
- if (this.message != null) {
133
- switch (this.message.severity) {
110
+ if (this.messageService.message() != null) {
111
+ switch (this.messageService.message().severity) {
134
112
  case 'warn':
135
113
  return 'pi-exclamation-triangle';
136
114
  case 'error':
@@ -143,8 +121,8 @@ class CilogMessageComponent {
143
121
  }
144
122
  }
145
123
  classBySeverity() {
146
- if (this.message != null) {
147
- switch (this.message.severity) {
124
+ if (this.messageService.message() != null) {
125
+ switch (this.messageService.message().severity) {
148
126
  case 'warn':
149
127
  return 'message_warn';
150
128
  case 'error':
@@ -159,16 +137,16 @@ class CilogMessageComponent {
159
137
  refreshPage() {
160
138
  window.location.reload();
161
139
  }
162
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: CilogMessageComponent, deps: [{ token: CilogMessageService }], target: i0.ɵɵFactoryTarget.Component });
163
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: CilogMessageComponent, isStandalone: true, selector: "cilog-message", ngImport: i0, template: "<p-dialog [styleClass]=\"classBySeverity()\"\r\n [(visible)]=\"display\"\r\n [modal]=\"true\"\r\n [baseZIndex]=\"10000\"\r\n [closable]=\"false\"\r\n [resizable]=\"false\"\r\n [draggable]=\"false\">\r\n\r\n <!-- Header -->\r\n <ng-template pTemplate=\"header\">\r\n <i class=\"pi {{ iconBySeverity() }} header_icon\"></i>\r\n <span class=\"header_text\">{{ headerBySeverity() }}</span>\r\n </ng-template>\r\n\r\n <!-- Content -->\r\n <p class=\"content mb-4\"\r\n [innerHTML]=\"message?.content\">\r\n </p>\r\n\r\n <!-- Boutons -->\r\n @if (message?.closable == true && message?.refresh == false) {\r\n <button pButton\r\n icon=\"pi pi-check\"\r\n (click)=\"display=false\"\r\n label=\"Ok\"\r\n style=\"float:right;\"\r\n class=\"p-button-text\">\r\n </button>\r\n }\r\n @if (message?.refresh == true) {\r\n <button pButton\r\n icon=\"pi pi-refresh\"\r\n (click)=\"refreshPage()\"\r\n label=\"Rafra\u00EEchir\"\r\n style=\"float:right;\"\r\n class=\"p-button-text\">\r\n </button>\r\n }\r\n\r\n</p-dialog>\r\n", styles: [":host ::ng-deep .message_success>div{background-color:#b7fdc0}:host ::ng-deep .message_error>div{background-color:#fdb8b7}:host ::ng-deep .message_warn>div{background-color:#fff5ba}:host ::ng-deep .message_info>div{background-color:#b7eefd}:host ::ng-deep .p-dialog-content,:host ::ng-deep .p-dialog-footer,:host ::ng-deep .p-dialog-header{padding:10px}:host ::ng-deep .content{margin:4px;white-space:pre}:host ::ng-deep .p-button-text{padding-top:0;padding-bottom:3px}:host ::ng-deep .header_text{font-weight:500;font-size:1.25rem;margin-left:10px}:host ::ng-deep .header_icon{font-size:1.5rem}:host ::ng-deep .p-dialog-header{justify-content:inherit}\n"], dependencies: [{ kind: "ngmodule", type: DialogModule }, { kind: "component", type: i2.Dialog, selector: "p-dialog", inputs: ["hostName", "header", "draggable", "resizable", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "maskMotionOptions", "motionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "closeButtonProps", "maximizeButtonProps", "visible", "style", "position", "role", "appendTo", "content", "contentTemplate", "footerTemplate", "closeIconTemplate", "maximizeIconTemplate", "minimizeIconTemplate", "headlessTemplate"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "directive", type: i1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i4.ButtonDirective, selector: "[pButton]", inputs: ["ptButtonDirective", "pButtonPT", "pButtonUnstyled", "hostName", "text", "plain", "raised", "size", "outlined", "rounded", "iconPos", "loadingIcon", "fluid", "label", "icon", "loading", "buttonProps", "severity"] }] });
140
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: CilogMessageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
141
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: CilogMessageComponent, isStandalone: true, selector: "cilog-message", ngImport: i0, template: "<p-dialog [styleClass]=\"classBySeverity()\"\n [visible]=\"messageService.display()\"\n [modal]=\"true\"\n [baseZIndex]=\"10000\"\n [closable]=\"false\"\n [resizable]=\"false\"\n [draggable]=\"false\">\n\n <!-- Header -->\n <ng-template pTemplate=\"header\">\n <i class=\"pi {{ iconBySeverity() }} header_icon\"></i>\n <span class=\"header_text\">{{ headerBySeverity() }}</span>\n </ng-template>\n\n <!-- Content -->\n <p class=\"content mb-4\"\n [innerHTML]=\"messageService.message()?.content\">\n </p>\n\n <!-- Boutons -->\n @if (messageService.message()?.closable == true && messageService.message()?.refresh == false) {\n <button pButton\n icon=\"pi pi-check\"\n (click)=\"messageService.display.set(false)\"\n label=\"Ok\"\n style=\"float:right;\"\n class=\"p-button-text\">\n </button>\n }\n @if (messageService.message()?.refresh == true) {\n <button pButton\n icon=\"pi pi-refresh\"\n (click)=\"refreshPage()\"\n label=\"Rafra\u00EEchir\"\n style=\"float:right;\"\n class=\"p-button-text\">\n </button>\n }\n\n</p-dialog>\n", styles: [":host ::ng-deep button{color:#000!important}:host ::ng-deep .message_success{background-color:#b7fdc0!important}:host ::ng-deep .message_error{background-color:#fdb8b7!important}:host ::ng-deep .message_warn{background-color:#fff5ba!important}:host ::ng-deep .message_info{background-color:#b7eefd!important}:host ::ng-deep .p-dialog{border:none!important}:host ::ng-deep .p-dialog-content,:host ::ng-deep .p-dialog-footer,:host ::ng-deep .p-dialog-header{padding:10px}:host ::ng-deep .content{margin:4px;white-space:pre}:host ::ng-deep .p-button-text{padding-top:0;padding-bottom:3px}:host ::ng-deep .header_text{font-weight:500;font-size:1.25rem;margin-left:10px}:host ::ng-deep .header_icon{font-size:1.5rem}:host ::ng-deep .p-dialog-header{justify-content:inherit}\n"], dependencies: [{ kind: "ngmodule", type: DialogModule }, { kind: "component", type: i1.Dialog, selector: "p-dialog", inputs: ["hostName", "header", "draggable", "resizable", "contentStyle", "contentStyleClass", "modal", "closeOnEscape", "dismissableMask", "rtl", "closable", "breakpoints", "styleClass", "maskStyleClass", "maskStyle", "showHeader", "blockScroll", "autoZIndex", "baseZIndex", "minX", "minY", "focusOnShow", "maximizable", "keepInViewport", "focusTrap", "transitionOptions", "maskMotionOptions", "motionOptions", "closeIcon", "closeAriaLabel", "closeTabindex", "minimizeIcon", "maximizeIcon", "closeButtonProps", "maximizeButtonProps", "visible", "style", "position", "role", "appendTo", "content", "contentTemplate", "footerTemplate", "closeIconTemplate", "maximizeIconTemplate", "minimizeIconTemplate", "headlessTemplate"], outputs: ["onShow", "onHide", "visibleChange", "onResizeInit", "onResizeEnd", "onDragEnd", "onMaximize"] }, { kind: "directive", type: i1$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i3.ButtonDirective, selector: "[pButton]", inputs: ["ptButtonDirective", "pButtonPT", "pButtonUnstyled", "hostName", "text", "plain", "raised", "size", "outlined", "rounded", "iconPos", "loadingIcon", "fluid", "label", "icon", "loading", "buttonProps", "severity"] }] });
164
142
  }
165
143
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: CilogMessageComponent, decorators: [{
166
144
  type: Component,
167
145
  args: [{ selector: 'cilog-message', imports: [
168
146
  DialogModule,
169
147
  ButtonModule
170
- ], template: "<p-dialog [styleClass]=\"classBySeverity()\"\r\n [(visible)]=\"display\"\r\n [modal]=\"true\"\r\n [baseZIndex]=\"10000\"\r\n [closable]=\"false\"\r\n [resizable]=\"false\"\r\n [draggable]=\"false\">\r\n\r\n <!-- Header -->\r\n <ng-template pTemplate=\"header\">\r\n <i class=\"pi {{ iconBySeverity() }} header_icon\"></i>\r\n <span class=\"header_text\">{{ headerBySeverity() }}</span>\r\n </ng-template>\r\n\r\n <!-- Content -->\r\n <p class=\"content mb-4\"\r\n [innerHTML]=\"message?.content\">\r\n </p>\r\n\r\n <!-- Boutons -->\r\n @if (message?.closable == true && message?.refresh == false) {\r\n <button pButton\r\n icon=\"pi pi-check\"\r\n (click)=\"display=false\"\r\n label=\"Ok\"\r\n style=\"float:right;\"\r\n class=\"p-button-text\">\r\n </button>\r\n }\r\n @if (message?.refresh == true) {\r\n <button pButton\r\n icon=\"pi pi-refresh\"\r\n (click)=\"refreshPage()\"\r\n label=\"Rafra\u00EEchir\"\r\n style=\"float:right;\"\r\n class=\"p-button-text\">\r\n </button>\r\n }\r\n\r\n</p-dialog>\r\n", styles: [":host ::ng-deep .message_success>div{background-color:#b7fdc0}:host ::ng-deep .message_error>div{background-color:#fdb8b7}:host ::ng-deep .message_warn>div{background-color:#fff5ba}:host ::ng-deep .message_info>div{background-color:#b7eefd}:host ::ng-deep .p-dialog-content,:host ::ng-deep .p-dialog-footer,:host ::ng-deep .p-dialog-header{padding:10px}:host ::ng-deep .content{margin:4px;white-space:pre}:host ::ng-deep .p-button-text{padding-top:0;padding-bottom:3px}:host ::ng-deep .header_text{font-weight:500;font-size:1.25rem;margin-left:10px}:host ::ng-deep .header_icon{font-size:1.5rem}:host ::ng-deep .p-dialog-header{justify-content:inherit}\n"] }]
171
- }], ctorParameters: () => [{ type: CilogMessageService }] });
148
+ ], template: "<p-dialog [styleClass]=\"classBySeverity()\"\n [visible]=\"messageService.display()\"\n [modal]=\"true\"\n [baseZIndex]=\"10000\"\n [closable]=\"false\"\n [resizable]=\"false\"\n [draggable]=\"false\">\n\n <!-- Header -->\n <ng-template pTemplate=\"header\">\n <i class=\"pi {{ iconBySeverity() }} header_icon\"></i>\n <span class=\"header_text\">{{ headerBySeverity() }}</span>\n </ng-template>\n\n <!-- Content -->\n <p class=\"content mb-4\"\n [innerHTML]=\"messageService.message()?.content\">\n </p>\n\n <!-- Boutons -->\n @if (messageService.message()?.closable == true && messageService.message()?.refresh == false) {\n <button pButton\n icon=\"pi pi-check\"\n (click)=\"messageService.display.set(false)\"\n label=\"Ok\"\n style=\"float:right;\"\n class=\"p-button-text\">\n </button>\n }\n @if (messageService.message()?.refresh == true) {\n <button pButton\n icon=\"pi pi-refresh\"\n (click)=\"refreshPage()\"\n label=\"Rafra\u00EEchir\"\n style=\"float:right;\"\n class=\"p-button-text\">\n </button>\n }\n\n</p-dialog>\n", styles: [":host ::ng-deep button{color:#000!important}:host ::ng-deep .message_success{background-color:#b7fdc0!important}:host ::ng-deep .message_error{background-color:#fdb8b7!important}:host ::ng-deep .message_warn{background-color:#fff5ba!important}:host ::ng-deep .message_info{background-color:#b7eefd!important}:host ::ng-deep .p-dialog{border:none!important}:host ::ng-deep .p-dialog-content,:host ::ng-deep .p-dialog-footer,:host ::ng-deep .p-dialog-header{padding:10px}:host ::ng-deep .content{margin:4px;white-space:pre}:host ::ng-deep .p-button-text{padding-top:0;padding-bottom:3px}:host ::ng-deep .header_text{font-weight:500;font-size:1.25rem;margin-left:10px}:host ::ng-deep .header_icon{font-size:1.5rem}:host ::ng-deep .p-dialog-header{justify-content:inherit}\n"] }]
149
+ }] });
172
150
 
173
151
  var Position;
174
152
  (function (Position) {
@@ -449,14 +427,14 @@ class CilogInputNumberComponent {
449
427
  this.onTouchedInput = fn;
450
428
  }
451
429
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: CilogInputNumberComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
452
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: CilogInputNumberComponent, isStandalone: true, selector: "cilog-input-number", inputs: { min: "min", max: "max", maxDecimals: "maxDecimals", prefixe: "prefixe", suffixe: "suffixe", inputStyleClass: "inputStyleClass", disabled: "disabled", readonly: "readonly", textColor: "textColor", bold: "bold", italic: "italic", floatLabel: "floatLabel" }, outputs: { onInput: "onInput", onChange: "onChange", onFocus: "onFocus", onBlur: "onBlur" }, host: { listeners: { "keydown": "onKeyDownEvent($event)" } }, viewQueries: [{ propertyName: "cilogInputNumber", first: true, predicate: ["cilogInputNumber"], descendants: true }], ngImport: i0, template: "<div class=\"input-group w-full\">\r\n\r\n @if (prefixe != null) {\r\n <span class=\"input-group-addon prefixe\">\r\n {{ prefixe }}\r\n </span>\r\n }\r\n\r\n <div [ngClass]=\"{ 'p-float-label' : floatLabel != null }\">\r\n <input #cilogInputNumber\r\n pInputText\r\n type=\"text\"\r\n [disabled]=\"disabled\"\r\n [readonly]=\"readonly\"\r\n [value]=\"valueStr\"\r\n (focus)=\"onFocusEvent($event)\"\r\n (blur)=\"onBlurEvent($event)\"\r\n [class]=\"'w-full z-1' + (inputStyleClass == null ? '' : ' ' + inputStyleClass)\"\r\n [ngClass]=\"suffixe != null && prefixe != null ? 'border-noround' : prefixe != null ? 'border-noround-left' : suffixe != null ? 'border-noround-right' : null\"\r\n [ngStyle]=\"{ 'color' : textColor ? textColor : null }\" />\r\n\r\n @if (floatLabel != null) {\r\n <label>{{ floatLabel }}</label>\r\n }\r\n </div>\r\n\r\n @if (suffixe != null) {\r\n <span class=\"input-group-addon suffixe\">\r\n {{ suffixe }}\r\n </span>\r\n }\r\n\r\n</div>\r\n", styles: [":host ::ng-deep .input-group{display:flex!important}:host ::ng-deep .input-group-addon{background-color:#fff!important;border:1px solid #ccc!important;padding:0 12px!important;max-width:5rem!important;overflow:hidden!important;font-weight:700!important}:host ::ng-deep .prefixe{border-radius:4px 0 0 4px!important;border-right:none!important;display:flex;align-items:center}:host ::ng-deep .suffixe{border-radius:0 4px 4px 0!important;border-left:none!important;display:flex;align-items:center}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i2$1.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pInputTextPT", "pInputTextUnstyled", "pSize", "variant", "fluid", "invalid"] }] });
430
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: CilogInputNumberComponent, isStandalone: true, selector: "cilog-input-number", inputs: { min: "min", max: "max", maxDecimals: "maxDecimals", prefixe: "prefixe", suffixe: "suffixe", inputStyleClass: "inputStyleClass", disabled: "disabled", readonly: "readonly", textColor: "textColor", bold: "bold", italic: "italic", floatLabel: "floatLabel" }, outputs: { onInput: "onInput", onChange: "onChange", onFocus: "onFocus", onBlur: "onBlur" }, host: { listeners: { "keydown": "onKeyDownEvent($event)" } }, viewQueries: [{ propertyName: "cilogInputNumber", first: true, predicate: ["cilogInputNumber"], descendants: true }], ngImport: i0, template: "<div class=\"input-group w-full\">\n\n @if (prefixe != null) {\n <span class=\"input-group-addon prefixe\">\n {{ prefixe }}\n </span>\n }\n\n <div [ngClass]=\"{ 'p-float-label' : floatLabel != null }\">\n <input #cilogInputNumber\n pInputText\n type=\"text\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [value]=\"valueStr\"\n (focus)=\"onFocusEvent($event)\"\n (blur)=\"onBlurEvent($event)\"\n [class]=\"'w-full z-1' + (inputStyleClass == null ? '' : ' ' + inputStyleClass)\"\n [ngClass]=\"suffixe != null && prefixe != null ? 'border-noround' : prefixe != null ? 'border-noround-left' : suffixe != null ? 'border-noround-right' : null\"\n [ngStyle]=\"{ 'color' : textColor ? textColor : null }\" />\n\n @if (floatLabel != null) {\n <label>{{ floatLabel }}</label>\n }\n </div>\n\n @if (suffixe != null) {\n <span class=\"input-group-addon suffixe\">\n {{ suffixe }}\n </span>\n }\n\n</div>\n", styles: [":host ::ng-deep .input-group{display:flex!important}:host ::ng-deep .input-group-addon{background-color:#fff!important;border:1px solid #ccc!important;padding:0 12px!important;max-width:5rem!important;overflow:hidden!important;font-weight:700!important}:host ::ng-deep .prefixe{border-radius:4px 0 0 4px!important;border-right:none!important;display:flex;align-items:center}:host ::ng-deep .suffixe{border-radius:0 4px 4px 0!important;border-left:none!important;display:flex;align-items:center}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i2.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pInputTextPT", "pInputTextUnstyled", "pSize", "variant", "fluid", "invalid"] }] });
453
431
  }
454
432
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: CilogInputNumberComponent, decorators: [{
455
433
  type: Component,
456
434
  args: [{ selector: 'cilog-input-number', imports: [
457
435
  CommonModule,
458
436
  InputTextModule
459
- ], template: "<div class=\"input-group w-full\">\r\n\r\n @if (prefixe != null) {\r\n <span class=\"input-group-addon prefixe\">\r\n {{ prefixe }}\r\n </span>\r\n }\r\n\r\n <div [ngClass]=\"{ 'p-float-label' : floatLabel != null }\">\r\n <input #cilogInputNumber\r\n pInputText\r\n type=\"text\"\r\n [disabled]=\"disabled\"\r\n [readonly]=\"readonly\"\r\n [value]=\"valueStr\"\r\n (focus)=\"onFocusEvent($event)\"\r\n (blur)=\"onBlurEvent($event)\"\r\n [class]=\"'w-full z-1' + (inputStyleClass == null ? '' : ' ' + inputStyleClass)\"\r\n [ngClass]=\"suffixe != null && prefixe != null ? 'border-noround' : prefixe != null ? 'border-noround-left' : suffixe != null ? 'border-noround-right' : null\"\r\n [ngStyle]=\"{ 'color' : textColor ? textColor : null }\" />\r\n\r\n @if (floatLabel != null) {\r\n <label>{{ floatLabel }}</label>\r\n }\r\n </div>\r\n\r\n @if (suffixe != null) {\r\n <span class=\"input-group-addon suffixe\">\r\n {{ suffixe }}\r\n </span>\r\n }\r\n\r\n</div>\r\n", styles: [":host ::ng-deep .input-group{display:flex!important}:host ::ng-deep .input-group-addon{background-color:#fff!important;border:1px solid #ccc!important;padding:0 12px!important;max-width:5rem!important;overflow:hidden!important;font-weight:700!important}:host ::ng-deep .prefixe{border-radius:4px 0 0 4px!important;border-right:none!important;display:flex;align-items:center}:host ::ng-deep .suffixe{border-radius:0 4px 4px 0!important;border-left:none!important;display:flex;align-items:center}\n"] }]
437
+ ], template: "<div class=\"input-group w-full\">\n\n @if (prefixe != null) {\n <span class=\"input-group-addon prefixe\">\n {{ prefixe }}\n </span>\n }\n\n <div [ngClass]=\"{ 'p-float-label' : floatLabel != null }\">\n <input #cilogInputNumber\n pInputText\n type=\"text\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [value]=\"valueStr\"\n (focus)=\"onFocusEvent($event)\"\n (blur)=\"onBlurEvent($event)\"\n [class]=\"'w-full z-1' + (inputStyleClass == null ? '' : ' ' + inputStyleClass)\"\n [ngClass]=\"suffixe != null && prefixe != null ? 'border-noround' : prefixe != null ? 'border-noround-left' : suffixe != null ? 'border-noround-right' : null\"\n [ngStyle]=\"{ 'color' : textColor ? textColor : null }\" />\n\n @if (floatLabel != null) {\n <label>{{ floatLabel }}</label>\n }\n </div>\n\n @if (suffixe != null) {\n <span class=\"input-group-addon suffixe\">\n {{ suffixe }}\n </span>\n }\n\n</div>\n", styles: [":host ::ng-deep .input-group{display:flex!important}:host ::ng-deep .input-group-addon{background-color:#fff!important;border:1px solid #ccc!important;padding:0 12px!important;max-width:5rem!important;overflow:hidden!important;font-weight:700!important}:host ::ng-deep .prefixe{border-radius:4px 0 0 4px!important;border-right:none!important;display:flex;align-items:center}:host ::ng-deep .suffixe{border-radius:0 4px 4px 0!important;border-left:none!important;display:flex;align-items:center}\n"] }]
460
438
  }], ctorParameters: () => [], propDecorators: { min: [{
461
439
  type: Input
462
440
  }], max: [{
@@ -1295,8 +1273,8 @@ class CilogTableComponent {
1295
1273
  this.inputNumber.input.nativeElement.focus();
1296
1274
  });
1297
1275
  }
1298
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: CilogTableComponent, deps: [{ token: i1.ConfirmationService }, { token: i1.FilterService }, { token: i0.ChangeDetectorRef }, { token: ExportService }], target: i0.ɵɵFactoryTarget.Component });
1299
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: CilogTableComponent, isStandalone: true, selector: "cilog-table", inputs: { columns: "columns", values: "values", options: "options", loading: "loading" }, outputs: { columnsChange: "columnsChange", valuesChange: "valuesChange", onEdit: "onEdit", onEditInit: "onEditInit", onDelete: "onDelete", onSelect: "onSelect", onUnselect: "onUnselect", onFilter: "onFilter", onFilterInit: "onFilterInit", onSort: "onSort", onPage: "onPage", onRowDoubleClick: "onRowDoubleClick" }, viewQueries: [{ propertyName: "table", first: true, predicate: ["table"], descendants: true, static: true }, { propertyName: "cm", first: true, predicate: ["cm"], descendants: true }, { propertyName: "inputNumber", first: true, predicate: ["inputNumber"], descendants: true }], ngImport: i0, template: "<div class=\"!relative\"\r\n [ngStyle]=\"{ 'height': options.scrollHeight != null ? options.scrollHeight : '100%' }\">\r\n\r\n @if (options.exportExcel) {\r\n <button pButton\r\n icon=\"pi pi-file-excel\"\r\n class=\"p-button-success !z-5 !absolute !top-0 !left-0 !w-5 !h-5 !rounded-tl-none !rounded-tr-none !rounded-bl-none\"\r\n pTooltip=\"Exporter le contenu de la grille au format Excel\"\r\n tooltipPosition=\"right\"\r\n (click)=\"exportExcel(options.exportExcelByFiltre, !options.exportExcelNoColors)\">\r\n </button>\r\n }\r\n\r\n <p-contextMenu #cm [model]=\"options.contextMenuItems\" />\r\n\r\n <p-table #table\r\n [columns]=\"columns\"\r\n [value]=\"values\"\r\n dataKey=\"id\"\r\n [selectionMode]=\"getModeSelection()\"\r\n [metaKeySelection]=\"isModeMetakeySelection()\"\r\n [(selection)]=\"selectedRows\"\r\n (onRowSelect)=\"onSelectRow($event)\"\r\n (onRowUnselect)=\"onUnselectRow($event)\"\r\n (onHeaderCheckboxToggle)=\"onSelectAll($event)\"\r\n (sortFunction)=\"sortGrille($event)\"\r\n [customSort]=\"options.grouping == null ? true : false\"\r\n [scrollable]=\"true\"\r\n [loading]=\"loading\"\r\n [scrollHeight]=\"'flex'\"\r\n [rowGroupMode]=\"options.grouping != null ? 'subheader' : null\"\r\n [groupRowsBy]=\"options.grouping != null ? options.grouping.obj + '.' + options.grouping.id : null\"\r\n [groupRowsByOrder]=\"0\"\r\n [virtualScroll]=\"options.virtualScroll == true && options.scrollHeight != null ? true : false\"\r\n [virtualScrollItemSize]=\"options.virtualScrollItemSize != null ? options.virtualScrollItemSize : 35\"\r\n [paginator]=\"options.paginator == null ? false : true\"\r\n [rows]=\"options.paginatorRows\"\r\n (onPage)=\"onPageTable($event)\"\r\n [tableStyleClass]=\"!options.themeGrille ? 'grid_grey' : options.themeGrille\"\r\n [lazy]=\"options.lazy == true ? true : false\"\r\n (onFilter)=\"onFilterTable($event)\"\r\n [rowTrackBy]=\"trackByFunction\"\r\n [(contextMenuSelection)]=\"contextMenuSelectedItem\"\r\n [contextMenu]=\"cm\">\r\n\r\n <!-- HEADER -->\r\n <ng-template pTemplate=\"header\" let-columns>\r\n\r\n <!-- HEADERS -->\r\n <tr class=\"rowHeader\">\r\n @if (isModeCheckboxSelection()) {\r\n <th class=\"cellDelete\"\r\n pFrozenColumn>\r\n @if (!options.filterable && options.toggleAll) {\r\n <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\r\n }\r\n </th>\r\n }\r\n @for (col of columns; track col) {\r\n @if (!col.invisible) {\r\n <th [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': col.backgroundColor ? col.backgroundColor : null }\"\r\n [ngClass]=\"{ '!text-center' : options.centerHeaders, 'headerAffichageSimple': !options.headersAffichageEntier, 'headerAffichageEntier': options.headersAffichageEntier }\"\r\n [pSortableColumn]=\"col.id\"\r\n [pSortableColumnDisabled]=\"!options.sortable || options.grouping != null || col.libelle == null || col.libelle == ''\"\r\n id=\"{{ col.id }}\"\r\n (click)=\"refreshData()\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\"\r\n [pTooltip]=\"col.libelle\"\r\n [tooltipDisabled]=\"!col.tooltipHeader\"\r\n tooltipPosition=\"bottom\">\r\n <div [ngStyle]=\"{ 'color': col.textColor ? col.textColor : null }\">\r\n {{ col.libelle }}\r\n </div>\r\n @if (options.sortable && options.grouping == null && col.libelle != null && col.libelle != '') {\r\n <p-sortIcon [field]=\"col.id\">\r\n </p-sortIcon>\r\n }\r\n </th>\r\n }\r\n }\r\n @if (options.rowsDeletable) {\r\n <th class=\"cellDelete\"></th>\r\n }\r\n </tr>\r\n\r\n <!-- FILTRES -->\r\n @if (options.filterable) {\r\n <tr class=\"rowFilter\">\r\n @if (isModeCheckboxSelection()) {\r\n <th class=\"cellDelete\"\r\n pFrozenColumn>\r\n @if (options.toggleAll) {\r\n <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\r\n }\r\n </th>\r\n }\r\n @for (col of columns; track col) {\r\n <!-- Text -->\r\n @if (!col.invisible && ((checkType('Dropdown', col) && col.options.filterText)\r\n || (checkType('MultiSelect', col) && col.options.filterText)\r\n || checkType('Text', col)\r\n || checkType('File', col)\r\n || (checkType('Button', col) && col.options.filterCol))\r\n || checkType('Number', col)\r\n || checkType('CilogNumber', col)) {\r\n <th [ngStyle]=\"{ 'width' : col.width ? col.width : null }\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n @if (!col.disableFilter) {\r\n <input pInputText\r\n type=\"text\"\r\n (input)=\"onFilterCol($event, col)\"\r\n name=\"filterText\"\r\n [(ngModel)]=\"col.options.defaultFilters\">\r\n }\r\n </th>\r\n }\r\n <!-- Date -->\r\n @if (!col.invisible && checkType('Date', col)) {\r\n <th [ngStyle]=\"{ 'width' : col.width ? col.width : null }\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n @if (!col.disableFilter) {\r\n <p-datepicker [view]=\"col.options.mode == null ? 'date' : col.options.mode\"\r\n [dateFormat]=\"col.options.mode == 'year' ? 'yy' : col.options.mode == 'month' ? 'mm/yy' : 'dd/mm/yy'\"\r\n [inputId]=\"col.id + '_filter'\"\r\n [firstDayOfWeek]=\"1\"\r\n [readonlyInput]=\"true\"\r\n appendTo=\"body\"\r\n selectionMode=\"range\"\r\n (onSelect)=\"onFilterCol($event, col)\"\r\n showButtonBar=\"true\"\r\n (onClearClick)=\"onFilterCol($event, col)\"\r\n name=\"filterDate\"\r\n [(ngModel)]=\"col.options.defaultFilters\">\r\n </p-datepicker>\r\n }\r\n </th>\r\n }\r\n <!-- Liste -->\r\n @if (!col.invisible && ((checkType('Dropdown', col) && !col.options.filterText) || (checkType('MultiSelect', col) && !col.options.filterText) || checkType('SelectButton', col) || checkType('State', col))) {\r\n <th [ngStyle]=\"{ 'width' : col.width ? col.width : null }\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n @if (!col.disableFilter) {\r\n <p-multiSelect [options]=\"col.options?.options\"\r\n [filter]=\"true\"\r\n dataKey=\"ID\"\r\n [optionLabel]=\"col.options?.optionLabel\"\r\n appendTo=\"body\"\r\n emptyFilterMessage=\"Aucun r\u00E9sultat\"\r\n emptyMessage=\"Aucun r\u00E9sultat\"\r\n [virtualScroll]=\"true\"\r\n [virtualScrollItemSize]=\"35\"\r\n selectedItemsLabel=\"{0} selectionn\u00E9s\"\r\n (onChange)=\"onFilterCol($event, col)\"\r\n name=\"filterChoix\"\r\n [(ngModel)]=\"col.options.defaultFilters\"\r\n [group]=\"col.options.optionGroupChildren != null ? true : false\"\r\n [optionGroupLabel]=\"col.options.optionGroupLabel\"\r\n [optionGroupChildren]=\"col.options.optionGroupChildren\"\r\n [showToggleAll]=\"false\"\r\n [showClear]=\"true\"\r\n (onClear)=\"onFilterCol(null, col)\">\r\n <ng-template let-group pTemplate=\"group\">\r\n <div>{{group[col.options.optionGroupLabel]}}</div>\r\n </ng-template>\r\n </p-multiSelect>\r\n }\r\n </th>\r\n }\r\n <!-- Switch -->\r\n @if (!col.invisible && checkType('Switch', col)) {\r\n <th [ngStyle]=\"{ 'width' : col.width ? col.width : null }\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n @if (!col.disableFilter) {\r\n <p-multiSelect [options]=\"optionsSwitch\"\r\n [showHeader]=\"false\"\r\n optionLabel=\"label\"\r\n optionValue=\"value\"\r\n appendTo=\"body\"\r\n emptyFilterMessage=\"Aucun r\u00E9sultat\"\r\n emptyMessage=\"Aucun r\u00E9sultat\"\r\n [virtualScrollItemSize]=\"30\"\r\n selectedItemsLabel=\"{0} selectionn\u00E9s\"\r\n (onChange)=\"onFilterCol($event, col)\"\r\n name=\"filterChoix2\"\r\n [(ngModel)]=\"col.options.defaultFilters\">\r\n </p-multiSelect>\r\n }\r\n </th>\r\n }\r\n <!-- Non filtrable -->\r\n @if (!col.invisible && (checkType('Image', col) || (checkType('Button', col) && !col.options.filterCol))) {\r\n <th [ngStyle]=\"{ 'width' : col.width ? col.width : null }\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n </th>\r\n }\r\n }\r\n @if (options.rowsDeletable) {\r\n <th class=\"cellDelete\"></th>\r\n }\r\n </tr>\r\n }\r\n\r\n <!-- TOTAL -->\r\n @if (options.rowTotal) {\r\n <tr class=\"rowTotal\">\r\n @if (isModeCheckboxSelection()) {\r\n <th class=\"cellDelete\"\r\n pFrozenColumn>\r\n </th>\r\n }\r\n @for (col of columns; track col) {\r\n @if (!col.invisible) {\r\n <th [ngStyle]=\"{ 'width' : col.width ? col.width : null }\"\r\n [ngClass]=\"{ '!text-center' : true }\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n <div>{{ getTotalStr(col) }}</div>\r\n </th>\r\n }\r\n }\r\n @if (options.rowsDeletable) {\r\n <th class=\"cellDelete\"></th>\r\n }\r\n </tr>\r\n }\r\n </ng-template>\r\n\r\n <!--Groupheader-->\r\n <ng-template pTemplate=\"groupheader\" let-rowData>\r\n <tr pRowGroupHeader class=\"rowGrouping\">\r\n <td [attr.colspan]=\"columns.length\">\r\n <div class=\"text_bold\">{{ rowData[options.grouping.obj][options.grouping.libelle] }}</div>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n\r\n <!-- Body -->\r\n <ng-template pTemplate=\"body\" let-rowData let-columns=\"columns\">\r\n <tr id=\"{{ rowData.id }}\"\r\n [ngStyle]=\"{ 'background-color': rowData.color ? rowData.color : null }\"\r\n [pSelectableRow]=\"rowData\"\r\n [pSelectableRowDisabled]=\"!options.selectable || isModeCheckboxSelection() || isModeCellSelection()\"\r\n (dblclick)=\"onRowDoubleClickEvent(rowData)\"\r\n [pContextMenuRow]=\"rowData\"\r\n [pContextMenuRowDisabled]=\"options.contextMenuItems == null\">\r\n\r\n @if (isModeCheckboxSelection()) {\r\n <td class=\"cellDelete\"\r\n pFrozenColumn>\r\n <p-tableCheckbox [value]=\"rowData\" [disabled]=\"rowData.readonly\"></p-tableCheckbox>\r\n </td>\r\n }\r\n\r\n @for (col of columns; track col) {\r\n <!-- Text -->\r\n @if (!col.invisible && checkType('Text', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly) {\r\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [pEditableColumn]=\"rowData\"\r\n [pEditableColumnField]=\"col.id\"\r\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\"\r\n pFrozenColumn\r\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\r\n [frozen]=\"col.frozen\"\r\n [ngClass]=\"{\r\n '!text-left': col.position == 'left' || col.position == null,\r\n '!text-right': col.position == 'right',\r\n '!text-center': col.position == 'center',\r\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\r\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\">\r\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <input pInputText\r\n type=\"text\"\r\n [(ngModel)]=\"rowData[col.id].value\"\r\n name=\"text\"\r\n (blur)=\"onEditCell(rowData, col, rowData[col.id].value)\"\r\n (keydown.enter)=\"onEditCell(rowData, col, rowData[col.id].value)\"\r\n (keydown.tab)=\"onEditCell(rowData, col, rowData[col.id].value)\"\r\n (click)=\"onEditInitCell(rowData, col, rowData[col.id].value)\"\r\n [ngClass]=\"{\r\n '!text-left': col.position == 'left' || col.position == null,\r\n '!text-right': col.position == 'right',\r\n '!text-center': col.position == 'center',\r\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\r\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true\r\n }\" />\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n @if (rowData[col.id]) {\r\n <div style=\"white-space: pre;\">\r\n {{ getFormattedText(col, rowData) }}\r\n </div>\r\n }\r\n </ng-template>\r\n </p-cellEditor>\r\n </td>\r\n }\r\n @if (!col.invisible && checkType('Text', col) && (!isModeEdition() || rowData.readonly || rowData[col.id]?.readonly)) {\r\n <td [ngStyle]=\"{\r\n 'width' : col.width ? col.width : null,\r\n 'background-color' : rowData[col.id].color ? rowData[col.id].color : null,\r\n 'color' : rowData[col.id].textColor ? rowData[col.id].textColor : null\r\n }\"\r\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\"\r\n [ngClass]=\"{\r\n 'paddingCell': rowData[col.id] != null,\r\n '!text-left': col.position == 'left' || col.position == null,\r\n '!text-right': col.position == 'right',\r\n '!text-center': col.position == 'center',\r\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\r\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n <div class=\"p-column-title\">\r\n {{ col.libelle }} :\r\n </div>\r\n @if (rowData[col.id]) {\r\n <div style=\"white-space: pre;\">\r\n {{ getFormattedText(col, rowData) }}\r\n </div>\r\n }\r\n </td>\r\n }\r\n <!-- Dropdown -->\r\n @if (!col.invisible && checkType('Dropdown', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly) {\r\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\r\n [ngClass]=\"{\r\n '!text-left': col.position == 'left' || col.position == null,\r\n '!text-right': col.position == 'right',\r\n '!text-center': col.position == 'center',\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\"\r\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value != null ? rowData[col.id].value[getOption(col, rowData, 'optionLabel')] : ''\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\"\r\n class=\"paddingCell\">\r\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\r\n @if (rowData[col.id] != null) {\r\n <p-select dataKey=\"ID\"\r\n [options]=\"getOption(col, rowData, 'options')\"\r\n [filter]=\"getOption(col, rowData, 'filter')\"\r\n [optionLabel]=\"getOption(col, rowData, 'optionLabel')\"\r\n [(ngModel)]=\"rowData[col.id].value\"\r\n name=\"select\"\r\n appendTo=\"body\"\r\n [showClear]=\"getOption(col, rowData, 'deletable')\"\r\n emptyFilterMessage=\"Aucun r\u00E9sultat\"\r\n emptyMessage=\"Aucun r\u00E9sultat\"\r\n [virtualScroll]=\"getOption(col, rowData, 'virtualScroll')\"\r\n [readonly]=\"rowData.readonly || rowData[col.id]?.readonly\"\r\n [virtualScrollItemSize]=\"30\"\r\n (onChange)=\"onEditCell(rowData, col, rowData[col.id].value)\"\r\n (onClear)=\"onEditCell(rowData, col, rowData[col.id].value)\">\r\n <ng-template let-data pTemplate=\"selectedItem\">\r\n @if (data != null) {\r\n <span [ngClass]=\"{\r\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\r\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true\r\n }\">\r\n {{ data[getOption(col, rowData, 'optionLabel')] }}\r\n </span>\r\n }\r\n @if (data == null) {\r\n <span></span>\r\n }\r\n </ng-template>\r\n </p-select>\r\n }\r\n </td>\r\n }\r\n @if (!col.invisible && checkType('Dropdown', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())) {\r\n <td [ngStyle]=\"{\r\n 'width' : col.width ? col.width : null,\r\n 'background-color': rowData[col.id].color ? rowData[col.id].color : null,\r\n 'color' : rowData[col.id].textColor ? rowData[col.id].textColor : null\r\n }\"\r\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value != null ? rowData[col.id].value[getOption(col, rowData, 'optionLabel')] : ''\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\"\r\n [ngClass]=\"{\r\n 'paddingCell': rowData[col.id] != null,\r\n '!text-left': col.position == 'left' || col.position == null,\r\n '!text-right': col.position == 'right',\r\n '!text-center': col.position == 'center',\r\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\r\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\r\n @if (rowData[col.id]) {\r\n <div>{{ rowData[col.id].value != null ? rowData[col.id].value[getOption(col, rowData, 'optionLabel')] : '' }}</div>\r\n }\r\n </td>\r\n }\r\n <!-- Cilog Number -->\r\n @if (!col.invisible && checkType('CilogNumber', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly) {\r\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [ngClass]=\"{\r\n 'paddingCell': rowData[col.id] != null,\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\"\r\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\r\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value | value\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\r\n @if (rowData[col.id] && !rowData.readonly && !rowData[col.id]?.readonly) {\r\n <cilog-input-number (onInput)=\"onInputNumber($event)\"\r\n [(ngModel)]=\"rowData[col.id].value\"\r\n name=\"cilog-number\"\r\n ngDefaultControl\r\n [inputStyleClass]=\"col.position == null || col.position == 'right' ? '!text-right' : col.position == 'left' ? '!text-left' : '!text-center'\"\r\n [textColor]=\"rowData[col.id].textColor\"\r\n [bold]=\"rowData.bold == true || rowData[col.id].bold == true\"\r\n [italic]=\"rowData.italic == true || rowData[col.id].italic == true\"\r\n [suffixe]=\"getOption(col, rowData, 'suffix')\"\r\n [prefixe]=\"getOption(col, rowData, 'prefix') != null ? getOption(col, rowData, 'prefix') + ' ' : null\"\r\n [min]=\"getOption(col, rowData, 'min')\"\r\n [max]=\"getOption(col, rowData, 'max')\"\r\n [disabled]=\"rowData.readonly || rowData[col.id]?.readonly\"\r\n [maxDecimals]=\"getOption(col, rowData, 'modeInteger') != null && getOption(col, rowData, 'modeInteger') == true ? 0 : getOption(col, rowData, 'maxDecimales') != null ? getOption(col, rowData, 'maxDecimales') : 2 \"\r\n (onChange)=\"onEditCell(rowData, col, rowData[col.id].value)\"\r\n (onFocus)=\"onEditInitCell(rowData, col, rowData[col.id].value)\">\r\n </cilog-input-number>\r\n }\r\n </td>\r\n }\r\n @if (!col.invisible && checkType('CilogNumber', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())) {\r\n <td [ngStyle]=\"{\r\n 'width' : col.width ? col.width : null,\r\n 'background-color': rowData[col.id].color ? rowData[col.id].color : null,\r\n 'color' : rowData[col.id].textColor ? rowData[col.id].textColor : null\r\n }\"\r\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value | value\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\"\r\n [ngClass]=\"{\r\n 'paddingCell': rowData[col.id] != null,\r\n '!text-left': col.position == 'left' || col.position == null,\r\n '!text-right': col.position == 'right',\r\n '!text-center': col.position == 'center',\r\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\r\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\r\n @if (rowData[col.id]) {\r\n <div>{{ getFormattedNumber(col, rowData, rowData[col.id].value) }}</div>\r\n }\r\n </td>\r\n }\r\n <!-- Number -->\r\n @if (!col.invisible && checkType('Number', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly) {\r\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value | value\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n [ngClass]=\"{\r\n 'paddingCell': rowData[col.id] != null,\r\n '!text-left': col.position == 'left',\r\n '!text-right': col.position == 'right' || col.position == null,\r\n '!text-center': col.position == 'center',\r\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\r\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\"\r\n tooltipPosition=\"bottom\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\"\r\n (click)=\"onClickCellNumber(rowData, col)\">\r\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\r\n @if (rowData[col.id] && !rowData[col.id].focus) {\r\n <div>\r\n {{ getFormattedNumber(col, rowData, rowData[col.id].value) }}\r\n </div>\r\n }\r\n @if (rowData[col.id] && !rowData.readonly && !rowData[col.id]?.readonly && rowData[col.id].focus == true) {\r\n <p-inputNumber #inputNumber\r\n locale=\"fr-FR\"\r\n (onInput)=\"onInputNumber($event)\"\r\n [(ngModel)]=\"rowData[col.id].value\"\r\n name=\"input-number\"\r\n [showButtons]=\"getOption(col, rowData, 'showButtons')\"\r\n [inputStyleClass]=\"col.position == null || col.position == 'right' ? '!text-right' : col.position == 'left' ? '!text-left' : '!text-center'\"\r\n [inputStyle]=\"{ 'font-weight': rowData.bold == true || rowData[col.id].bold == true ? 'bold' : null, 'font-style': rowData.italic == true || rowData[col.id].italic == true ? 'italic' : null }\"\r\n [suffix]=\"getOption(col, rowData, 'suffix')\"\r\n [prefix]=\"getOption(col, rowData, 'prefix') != null ? getOption(col, rowData, 'prefix') + ' ' : null\"\r\n [min]=\"getOption(col, rowData, 'min')\"\r\n [max]=\"getOption(col, rowData, 'max')\"\r\n [minFractionDigits]=\"getOption(col, rowData, 'modeInteger') != null && getOption(col, rowData, 'modeInteger') == true ? 0 : getOption(col, rowData, 'minDecimales') != null ? getOption(col, rowData, 'minDecimales') : 0\"\r\n [maxFractionDigits]=\"getOption(col, rowData, 'modeInteger') != null && getOption(col, rowData, 'modeInteger') == true ? 0 : getOption(col, rowData, 'maxDecimales') != null ? getOption(col, rowData, 'maxDecimales') : 2 \"\r\n (onBlur)=\"onEditCell(rowData, col, rowData[col.id].value)\"\r\n (onKeyDown)=\"onKeyDown($event, rowData, col, rowData[col.id].value)\"\r\n (onFocus)=\"onEditInitCell(rowData, col, rowData[col.id].value)\">\r\n </p-inputNumber>\r\n }\r\n </td>\r\n }\r\n @if (!col.invisible && checkType('Number', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())) {\r\n <td [ngStyle]=\"{\r\n 'width' : col.width ? col.width : null,\r\n 'background-color': rowData[col.id].color ? rowData[col.id].color : null,\r\n 'color' : rowData[col.id].textColor ? rowData[col.id].textColor : null\r\n }\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value | value\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\"\r\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\r\n [ngClass]=\"{\r\n 'paddingCell': rowData[col.id] != null,\r\n '!text-left': col.position == 'left',\r\n '!text-right': col.position == 'right' || col.position == null,\r\n '!text-center': col.position == 'center',\r\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\r\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\r\n @if (rowData[col.id]) {\r\n <div>{{ getFormattedNumber(col, rowData, rowData[col.id].value) }}</div>\r\n }\r\n </td>\r\n }\r\n <!-- Date -->\r\n @if (!col.invisible && checkType('Date', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly) {\r\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [ngClass]=\"{\r\n 'paddingCell': rowData[col.id] != null,\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\"\r\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\r\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : getOption(col, rowData, 'mode') == 'year' ? (rowData[col.id].value | date: 'yyyy') : getOption(col, rowData, 'mode') == 'month' ? (rowData[col.id].value | date: 'MM/yy') : getOption(col, rowData, 'mode') == 'hour' ? (rowData[col.id].value | date: 'HH:mm') : getOption(col, rowData, 'mode') == 'datehour' ? (rowData[col.id].value | date: 'dd/MM/yy HH:mm') : (rowData[col.id].value | date: 'dd/MM/yyyy')\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\r\n <p-datepicker [(ngModel)]=\"rowData[col.id].value\"\r\n name=\"date-picker\"\r\n [view]=\"getOption(col, rowData, 'mode') == null || getOption(col, rowData, 'mode') == 'date' || getOption(col, rowData, 'mode') == 'hour' ? 'date' : getOption(col, rowData, 'mode') == 'datehour' ? 'date' : getOption(col, rowData, 'mode')\"\r\n [dateFormat]=\"getOption(col, rowData, 'mode') == 'year' ? 'yy' : getOption(col, rowData, 'mode') == 'month' ? 'mm/yy' : getOption(col, rowData, 'mode') == 'hour' || getOption(col, rowData, 'mode') == 'datehour' ? 'dd/mm/yy' : 'dd/mm/yy'\"\r\n [showTime]=\"getOption(col, rowData, 'mode') == 'datehour'\"\r\n [timeOnly]=\"getOption(col, rowData, 'mode') == 'hour'\"\r\n [hourFormat]=\"'24'\"\r\n [firstDayOfWeek]=\"1\"\r\n (onSelect)=\"onEditCell(rowData, col, rowData[col.id].value)\"\r\n (onBlur)=\"onEditCell(rowData, col, rowData[col.id].value)\"\r\n (onClear)=\"onEditCell(rowData, col, rowData[col.id].value)\"\r\n [inputStyleClass]=\"col.position == null || col.position == 'right' ? '!text-right' : col.position == 'left' ? '!text-left' : '!text-center'\"\r\n [inputStyle]=\"{ 'font-weight': rowData.bold == true || rowData[col.id].bold == true ? 'bold' : null, 'font-style': rowData.italic == true || rowData[col.id].italic == true ? 'italic' : null }\"\r\n [showClear]=\"getOption(col, rowData, 'clear')\"\r\n [minDate]=\"getOption(col, rowData, 'minDate')\"\r\n [maxDate]=\"getOption(col, rowData, 'maxDate')\"\r\n [defaultDate]=\"getOption(col, rowData, 'defaultDate')\"\r\n appendTo=\"body\">\r\n </p-datepicker>\r\n </td>\r\n }\r\n @if (!col.invisible && checkType('Date', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())) {\r\n <td [ngStyle]=\"{\r\n 'min-width' : col.width ? col.width : null,\r\n 'background-color': rowData[col.id].color ? rowData[col.id].color : null,\r\n 'color' : rowData[col.id].textColor ? rowData[col.id].textColor : null\r\n }\"\r\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value | date: 'dd/MM/yyyy'\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\"\r\n [ngClass]=\"{\r\n 'paddingCell': rowData[col.id] != null,\r\n '!text-left': col.position == 'left' || col.position == null,\r\n '!text-right': col.position == 'right',\r\n '!text-center': col.position == 'center',\r\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\r\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\r\n @if (rowData[col.id]) {\r\n <div>{{ rowData[col.id].value | date: (getOption(col, rowData, 'mode') == 'year' ? 'yyyy' : getOption(col, rowData, 'mode') == 'month' ? 'MM/yyyy' : 'dd/MM/yyyy') }}</div>\r\n }\r\n </td>\r\n }\r\n <!-- MultiSelect -->\r\n @if (!col.invisible && checkType('MultiSelect', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly) {\r\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [ngClass]=\"{\r\n '!text-left': col.position == 'left' || col.position == null,\r\n '!text-right': col.position == 'right',\r\n '!text-center': col.position == 'center',\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\"\r\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\r\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : getMultiSelectConcat(rowData[col.id].value, getOption(col, rowData, 'optionLabel'))\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\"\r\n class=\"paddingCell\">\r\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\r\n @if (rowData[col.id] != null) {\r\n <p-multiSelect [options]=\"getOption(col, rowData, 'options')\"\r\n [filter]=\"getOption(col, rowData, 'filter')\"\r\n [optionLabel]=\"getOption(col, rowData, 'optionLabel')\"\r\n [(ngModel)]=\"rowData[col.id].value\"\r\n name=\"multiselect\"\r\n appendTo=\"body\"\r\n dataKey=\"ID\"\r\n emptyFilterMessage=\"Aucun r\u00E9sultat\"\r\n emptyMessage=\"Aucun r\u00E9sultat\"\r\n [virtualScroll]=\"getOption(col, rowData, 'virtualScroll')\"\r\n [readonly]=\"rowData.readonly || rowData[col.id]?.readonly || !isModeEdition()\"\r\n [virtualScrollItemSize]=\"30\"\r\n selectedItemsLabel=\"{0} selectionn\u00E9s\"\r\n (onChange)=\"editMultiselect(rowData, col, $event)\"\r\n [showToggleAll]=\"false\"\r\n [showHeader]=\"getOption(col, rowData, 'filter')\"\r\n [group]=\"getOption(col, rowData, 'optionGroupChildren') != null ? true : false\"\r\n [optionGroupLabel]=\"getOption(col, rowData, 'optionGroupLabel')\"\r\n [optionGroupChildren]=\"getOption(col, rowData, 'optionGroupChildren')\"\r\n ngDefaultControl>\r\n <ng-template let-data pTemplate=\"selectedItems\">\r\n @for (option of data; track option; let i = $index) {\r\n <span [ngClass]=\"{\r\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\r\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true\r\n }\">\r\n {{ option[getOption(col, rowData, 'optionLabel')] + (i != data.length - 1 ? ',' : '') }}\r\n </span>\r\n }\r\n </ng-template>\r\n <ng-template let-group pTemplate=\"group\">\r\n <div>{{group[col.options.optionGroupLabel]}}</div>\r\n </ng-template>\r\n </p-multiSelect>\r\n }\r\n </td>\r\n }\r\n @if (!col.invisible && checkType('MultiSelect', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())) {\r\n <td [ngStyle]=\"{\r\n 'width' : col.width ? col.width : null,\r\n 'background-color': rowData[col.id].color ? rowData[col.id].color : null,\r\n 'color' : rowData[col.id].textColor ? rowData[col.id].textColor : null\r\n }\"\r\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : getMultiSelectConcat(rowData[col.id].value, getOption(col, rowData, 'optionLabel'))\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\"\r\n [ngClass]=\"{\r\n 'paddingCell': rowData[col.id] != null,\r\n '!text-left': col.position == 'left' || col.position == null,\r\n '!text-right': col.position == 'right',\r\n '!text-center': col.position == 'center',\r\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\r\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\r\n @if (rowData[col.id]) {\r\n <div>{{ getMultiSelectConcat(rowData[col.id].value, getOption(col, rowData, 'optionLabel')) }}</div>\r\n }\r\n </td>\r\n }\r\n <!-- Image -->\r\n @if (!col.invisible && checkType('Image', col)) {\r\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [ngClass]=\"{\r\n 'paddingCell': rowData[col.id] != null,\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\"\r\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\r\n class=\"!text-center\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\r\n @if (rowData[col.id]) {\r\n <img style=\"vertical-align: middle; width: 40px;\" src=\"{{ rowData[col.id].value }}\" />\r\n }\r\n </td>\r\n }\r\n <!-- Button -->\r\n @if (!col.invisible && checkType('Button', col)) {\r\n <td class=\"paddingCell !text-center\"\r\n [ngClass]=\"{\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\"\r\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\r\n [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\">\r\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\r\n @if (rowData[col.id].value != null && isValueButtonByType(rowData[col.id].value, 'function')) {\r\n <button pButton\r\n [disabled]=\"rowData.readonly || rowData[col.id]?.readonly\"\r\n [label]=\"getOption(col, rowData, 'label')\"\r\n [icon]=\"getOption(col, rowData, 'icon')\"\r\n (click)=\"rowData[col.id].value()\"\r\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : getOption(col, rowData, 'label')\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n [class]=\"'p-button-' + getOption(col, rowData, 'severity')\"\r\n [ngClass]=\"{\r\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\r\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true\r\n }\">\r\n </button>\r\n }\r\n @if (isValueButtonByType(rowData[col.id].value, 'string')) {\r\n <div [ngClass]=\"{\r\n 'paddingCell': rowData[col.id] != null,\r\n '!text-left': col.position == 'left' || col.position == null,\r\n '!text-right': col.position == 'right',\r\n '!text-center': col.position == 'center',\r\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\r\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true\r\n }\"\r\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value\"\r\n [tooltipDisabled]=\"!col.tooltip\">\r\n {{ rowData[col.id].value }}\r\n </div>\r\n }\r\n </td>\r\n }\r\n <!-- SelectButton -->\r\n @if (!col.invisible && checkType('SelectButton', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly) {\r\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [ngClass]=\"{\r\n 'paddingCell': rowData[col.id] != null,\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\"\r\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\r\n @if (rowData[col.id] != null) {\r\n <p-selectButton [options]=\"getOption(col, rowData, 'options')\"\r\n [optionLabel]=\"getOption(col, rowData, 'optionLabel')\"\r\n [optionValue]=\"getOption(col, rowData, 'optionValue') != null ? getOption(col, rowData, 'optionValue') : 'value'\"\r\n [(ngModel)]=\"rowData[col.id].value\"\r\n name=\"select-button\"\r\n [disabled]=\"rowData.readonly || rowData[col.id]?.readonly || !isModeEdition()\"\r\n (onChange)=\"onEditCell(rowData, col, rowData[col.id].value)\">\r\n <ng-template let-item pTemplate=\"item\">\r\n <span class=\"!text-center w-full\"\r\n [ngClass]=\"{\r\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\r\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true\r\n }\">\r\n {{ item.label }}\r\n </span>\r\n </ng-template>\r\n </p-selectButton>\r\n }\r\n </td>\r\n }\r\n @if (!col.invisible && checkType('SelectButton', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())) {\r\n <td [ngStyle]=\"{\r\n 'width' : col.width ? col.width : null,\r\n 'background-color': rowData[col.id].color ? rowData[col.id].color : null,\r\n 'color' : rowData[col.id].textColor ? rowData[col.id].textColor : null\r\n }\"\r\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\"\r\n class=\"!text-center\"\r\n [ngClass]=\"{\r\n 'paddingCell': rowData[col.id] != null,\r\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\r\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\">\r\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\r\n @if (rowData[col.id]) {\r\n <div>{{ getSelectLibelleByValue(rowData, col) }}</div>\r\n }\r\n </td>\r\n }\r\n <!-- Switch -->\r\n @if (!col.invisible && checkType('Switch', col)) {\r\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\r\n class=\"!text-center\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [ngClass]=\"{\r\n 'paddingCell': rowData[col.id] != null,\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\"\r\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\r\n @if (rowData[col.id] != null) {\r\n <p-toggleswitch [(ngModel)]=\"rowData[col.id].value\"\r\n name=\"toggle-switch\"\r\n [disabled]=\"rowData.readonly || rowData[col.id]?.readonly || (getOption(col, rowData, 'action') == null && !isModeEdition())\"\r\n (onChange)=\"onEditCell(rowData, col, rowData[col.id].value)\"\r\n ngDefaultControl>\r\n </p-toggleswitch>\r\n }\r\n </td>\r\n }\r\n <!-- File -->\r\n @if (!col.invisible && checkType('File', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly) {\r\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [ngClass]=\"{\r\n 'paddingCell': rowData[col.id] != null,\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\"\r\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\r\n @if (rowData[col.id] != null) {\r\n <div class=\"p-inputgroup\">\r\n <button type=\"button\"\r\n pButton\r\n pRipple\r\n icon=\"pi pi-upload\"\r\n (click)=\"clickById('input_' + rowData[col.id].id)\"\r\n [disabled]=\"rowData.readonly || rowData[col.id]?.readonly || !isModeEdition()\">\r\n </button>\r\n <input id=\"{{'output_' + rowData[col.id].id}}\"\r\n pInputText\r\n type=\"text\"\r\n [ngClass]=\"{\r\n '!text-left': col.position == 'left' || col.position == null,\r\n '!text-right': col.position == 'right',\r\n '!text-center': col.position == 'center',\r\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\r\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true\r\n }\"\r\n value=\"{{ rowData[col.id].value != null ? rowData[col.id].value : '' }}\"\r\n readonly\r\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value ? rowData[col.id].value : ''\"\r\n [tooltipDisabled]=\"!col.tooltip\">\r\n @if (getOption(col, rowData, 'downloadPath') && rowData[col.id].value != null) {\r\n <button type=\"button\"\r\n pButton\r\n pRipple\r\n icon=\"pi pi-download\"\r\n (click)=\"downloadFile(rowData[col.id])\"\r\n [disabled]=\"rowData.readonly || rowData[col.id]?.readonly || !isModeEdition()\">\r\n </button>\r\n }\r\n </div>\r\n }\r\n @if (rowData[col.id]) {\r\n <input id=\"{{'input_' + rowData[col.id].id}}\" #inputFile pInputText type=\"file\" hidden (change)=\"rowData[col.id].value = inputFile.files[0].name; onEditCell(rowData, col, inputFile.files[0])\">\r\n }\r\n </td>\r\n }\r\n @if (!col.invisible && checkType('File', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())) {\r\n <td [ngStyle]=\"{\r\n 'width' : col.width ? col.width : null,\r\n 'background-color': rowData[col.id].color ? rowData[col.id].color : null,\r\n 'color' : rowData[col.id].textColor ? rowData[col.id].textColor : null\r\n }\"\r\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value ? rowData[col.id].value : ''\"\r\n [ngClass]=\"{\r\n 'paddingCell': rowData[col.id] != null,\r\n '!text-left': col.position == 'left' || col.position == null,\r\n '!text-right': col.position == 'right',\r\n '!text-center': col.position == 'center',\r\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\r\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\r\n @if (rowData[col.id]) {\r\n <div>{{ rowData[col.id].value ? rowData[col.id].value : '' }}</div>\r\n }\r\n </td>\r\n }\r\n <!-- State -->\r\n @if (!col.invisible && checkType('State', col)) {\r\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [ngClass]=\"{\r\n 'paddingCell': rowData[col.id] != null,\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\"\r\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\r\n class=\"!text-center\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\r\n @if (rowData[col.id].value != null) {\r\n <p-tag [value]=\"rowData[col.id].value[getOption(col, rowData, 'optionLabel')]\"\r\n [severity]=\"rowData[col.id].value.severity\"\r\n [icon]=\"rowData[col.id].value.icon\"\r\n [style]=\"{\r\n 'background-color': rowData[col.id].value.backgroundColor,\r\n 'color': rowData[col.id].value.textColor,\r\n 'font-weight': rowData.bold == true || rowData[col.id].bold == true ? 'bold' : null,\r\n 'font-style': rowData.italic == true || rowData[col.id].italic == true ? 'italic' : null\r\n }\">\r\n </p-tag>\r\n }\r\n </td>\r\n }\r\n }\r\n\r\n <!-- Deletion -->\r\n @if (options.rowsDeletable) {\r\n <td class=\"cellDelete\"\r\n [ngClass]=\"rowData.deletable ? 'paddingCell' : null\">\r\n @if (rowData.deletable) {\r\n <button pButton\r\n type=\"button\"\r\n icon=\"pi pi-times\"\r\n class=\"p-button-danger buttonDelete p-button-text\"\r\n [disabled]=\"rowData.readonly\"\r\n (click)=\"onDeleteLine(rowData)\">\r\n </button>\r\n }\r\n </td>\r\n }\r\n\r\n </tr>\r\n </ng-template>\r\n </p-table>\r\n</div>\r\n", styles: ["::ng-deep .p-tooltip .p-tooltip-text{overflow-wrap:break-word!important}:host ::ng-deep .p-toggleswitch.p-toggleswitch-checked.p-disabled .p-toggleswitch-slider{background:#abd9ba!important}:host ::ng-deep .grid_brown .rowHeader>th{background-color:#795548}:host ::ng-deep .grid_brown .rowHeader>th div{color:#fff}:host ::ng-deep .grid_brown .rowHeader>th i{color:#fff}:host ::ng-deep .grid_brown .rowHeader .p-sortable-column:hover{background-color:#a47767}:host ::ng-deep .grid_brown .rowHeader .p-sortable-column:hover i{color:#fff}:host ::ng-deep .grid_brown .rowHeader .p-sortable-column.p-highlight div{color:#76c7ff}:host ::ng-deep .grid_brown .rowHeader .p-sortable-column.p-highlight .p-sortable-column-icon{color:#76c7ff}:host ::ng-deep .grid_brown .rowFilter th{background-color:#795548}:host ::ng-deep .grid_grey .rowHeader>th{background-color:#dedddd}:host ::ng-deep .grid_grey .rowHeader>th div{color:#495057}:host ::ng-deep .grid_grey .rowHeader>th i{color:#495057}:host ::ng-deep .grid_grey .rowHeader .p-sortable-column:hover{background-color:#e7e7e7}:host ::ng-deep .grid_grey .rowHeader .p-sortable-column:hover i{color:#495057}:host ::ng-deep .grid_grey .rowHeader .p-sortable-column.p-highlight div{color:#008bff}:host ::ng-deep .grid_grey .rowHeader .p-sortable-column.p-highlight .p-sortable-column-icon{color:#008bff}:host ::ng-deep .grid_grey .rowFilter th{background-color:#dedddd}:host ::ng-deep .selectable_cell:hover{background:#dcdcdc!important;cursor:pointer!important}:host ::ng-deep .p-frozen-column{z-index:2!important}:host ::ng-deep .p-datatable-thead{z-index:3!important}:host ::ng-deep .p-checkbox{border-radius:inherit!important}:host ::ng-deep p-inputnumber{width:100%}:host ::ng-deep .p-calendar,:host ::ng-deep .p-inputtext,:host ::ng-deep .p-inputnumber,:host ::ng-deep .p-inputnumber-input,:host ::ng-deep .p-dropdown,:host ::ng-deep .p-multiselect{width:100%}:host ::ng-deep .suffixe,:host ::ng-deep .prefixe{height:25px;padding-top:1px!important}:host ::ng-deep .p-multiselect-label-container,:host ::ng-deep .p-dropdown-label{width:1px!important}:host ::ng-deep .p-scroller-content{min-height:50%}:host ::ng-deep .rowTotal>th{background-color:#edcbaa!important}:host ::ng-deep .rowGrouping{background:#faeada!important}:host ::ng-deep .p-inputswitch.p-inputswitch-checked .p-inputswitch-slider{background:#30e130}:host ::ng-deep .p-inputswitch.p-inputswitch-checked:not(.p-disabled):hover .p-inputswitch-slider{background:#2bd12b}:host ::ng-deep .p-datatable-table{table-layout:fixed}:host ::ng-deep .p-datatable-thead>tr>th{border:1px solid rgba(0,0,0,.12)!important;padding:8px;font-weight:600;height:40px}:host ::ng-deep .headerAffichageSimple div{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host ::ng-deep .headerAffichageEntier{word-wrap:break-word}:host ::ng-deep .p-datatable-tbody>tr>td{border:1px solid rgba(0,0,0,.12)!important;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host ::ng-deep .p-datatable-tbody>tr>td div{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host ::ng-deep .p-tag{max-width:100%}:host ::ng-deep .p-tag .p-tag-value{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host ::ng-deep .p-button{padding:5px;max-width:100%}:host ::ng-deep .p-button .p-button-label{overflow:hidden!important;white-space:nowrap!important;text-overflow:ellipsis!important}:host ::ng-deep .text_bold{font-weight:700!important}:host ::ng-deep .cellDelete{flex:0 0 50px!important;width:50px;text-align:center!important;padding:0!important}:host ::ng-deep .p-tooltip .p-tooltip-text{background-color:red!important}:host ::ng-deep .p-skeleton{background-color:#dee2e6;border-radius:6px;padding:0}:host ::ng-deep .p-datatable-tbody>tr{height:35px}:host ::ng-deep .p-inputtext{height:25px!important;padding:4px 5px!important}:host ::ng-deep .p-inputnumber{height:25px;padding:0!important}:host ::ng-deep .p-inputnumber-input{padding:0 5px!important}:host ::ng-deep .p-inputgroup .p-inputtext{height:25px;padding:4px 5px!important}:host ::ng-deep .p-dropdown,:host ::ng-deep .p-multiselect{vertical-align:middle}:host ::ng-deep .p-dropdown-label{padding-top:2px;padding-bottom:2px}:host ::ng-deep .p-multiselect-label{padding-top:2px;padding-bottom:2px}:host ::ng-deep .p-editable-column{padding:3px 10px!important}:host ::ng-deep .paddingCell{padding:3px 10px!important}:host ::ng-deep .p-selectbutton>.p-button{width:50%;height:25px}:host ::ng-deep .p-inputgroup>.p-button{height:25px}:host ::ng-deep .buttonDelete{width:100%;height:20px}:host ::ng-deep .p-column-title{display:none}:host ::ng-deep .p-datatable-loading-icon{color:#fff}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: TagModule }, { kind: "component", type: i5.Tag, selector: "p-tag", inputs: ["styleClass", "severity", "value", "icon", "rounded"] }, { kind: "directive", type: i1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: ToggleSwitchModule }, { kind: "component", type: i6.ToggleSwitch, selector: "p-toggleswitch, p-toggleSwitch, p-toggle-switch", inputs: ["styleClass", "tabindex", "inputId", "readonly", "trueValue", "falseValue", "ariaLabel", "size", "ariaLabelledBy", "autofocus"], outputs: ["onChange"] }, { kind: "ngmodule", type: TableModule }, { kind: "component", type: i7.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i7.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "directive", type: i7.FrozenColumn, selector: "[pFrozenColumn]", inputs: ["frozen", "alignFrozen"] }, { kind: "directive", type: i7.RowGroupHeader, selector: "[pRowGroupHeader]" }, { kind: "directive", type: i7.SelectableRow, selector: "[pSelectableRow]", inputs: ["pSelectableRow", "pSelectableRowIndex", "pSelectableRowDisabled"] }, { kind: "directive", type: i7.ContextMenuRow, selector: "[pContextMenuRow]", inputs: ["pContextMenuRow", "pContextMenuRowIndex", "pContextMenuRowDisabled"] }, { kind: "directive", type: i7.EditableColumn, selector: "[pEditableColumn]", inputs: ["pEditableColumn", "pEditableColumnField", "pEditableColumnRowIndex", "pEditableColumnDisabled", "pFocusCellSelector"] }, { kind: "component", type: i7.CellEditor, selector: "p-cellEditor" }, { kind: "component", type: i7.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i7.TableCheckbox, selector: "p-tableCheckbox", inputs: ["value", "disabled", "required", "index", "inputId", "name", "ariaLabel"] }, { kind: "component", type: i7.TableHeaderCheckbox, selector: "p-tableHeaderCheckbox", inputs: ["disabled", "inputId", "name", "ariaLabel"] }, { kind: "ngmodule", type: ContextMenuModule }, { kind: "component", type: i8.ContextMenu, selector: "p-contextMenu, p-contextmenu, p-context-menu", inputs: ["model", "triggerEvent", "target", "global", "style", "styleClass", "autoZIndex", "baseZIndex", "id", "breakpoint", "ariaLabel", "ariaLabelledBy", "pressDelay", "appendTo", "motionOptions"], outputs: ["onShow", "onHide"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i9.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "showOnEllipsis", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo", "ptTooltip", "pTooltipPT", "pTooltipUnstyled"] }, { kind: "ngmodule", type: MultiSelectModule }, { kind: "component", type: i10.MultiSelect, selector: "p-multiSelect, p-multiselect, p-multi-select", inputs: ["id", "ariaLabel", "styleClass", "panelStyle", "panelStyleClass", "inputId", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "dataKey", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "chipIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "placeholder", "options", "filterValue", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus", "highlightOnSelect", "size", "variant", "fluid", "appendTo", "motionOptions"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "ngmodule", type: DatePickerModule }, { kind: "component", type: i11.DatePicker, selector: "p-datePicker, p-datepicker, p-date-picker", inputs: ["iconDisplay", "styleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "readonlyInput", "shortYearCutoff", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "minDate", "maxDate", "disabledDates", "disabledDays", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "view", "defaultDate", "appendTo", "motionOptions"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: i12.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "panelStyle", "styleClass", "panelStyleClass", "readonly", "editable", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "filterValue", "options", "appendTo", "motionOptions"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: CilogInputNumberComponent, selector: "cilog-input-number", inputs: ["min", "max", "maxDecimals", "prefixe", "suffixe", "inputStyleClass", "disabled", "readonly", "textColor", "bold", "italic", "floatLabel"], outputs: ["onInput", "onChange", "onFocus", "onBlur"] }, { kind: "ngmodule", type: SelectButtonModule }, { kind: "component", type: i13.SelectButton, selector: "p-selectButton, p-selectbutton, p-select-button", inputs: ["options", "optionLabel", "optionValue", "optionDisabled", "unselectable", "tabindex", "multiple", "allowEmpty", "styleClass", "ariaLabelledBy", "dataKey", "autofocus", "size", "fluid"], outputs: ["onOptionClick", "onChange"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i4.ButtonDirective, selector: "[pButton]", inputs: ["ptButtonDirective", "pButtonPT", "pButtonUnstyled", "hostName", "text", "plain", "raised", "size", "outlined", "rounded", "iconPos", "loadingIcon", "fluid", "label", "icon", "loading", "buttonProps", "severity"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i2$1.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pInputTextPT", "pInputTextUnstyled", "pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: InputNumberModule }, { kind: "component", type: i16.InputNumber, selector: "p-inputNumber, p-inputnumber, p-input-number", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "placeholder", "tabindex", "title", "ariaLabelledBy", "ariaDescribedBy", "ariaLabel", "ariaRequired", "autocomplete", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "readonly", "allowEmpty", "locale", "localeMatcher", "mode", "currency", "currencyDisplay", "useGrouping", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "inputStyle", "inputStyleClass", "showClear", "autofocus"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown", "onClear"] }, { kind: "pipe", type: i3.DatePipe, name: "date" }, { kind: "pipe", type: ValuePipe, name: "value" }] });
1276
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: CilogTableComponent, deps: [{ token: i1$1.ConfirmationService }, { token: i1$1.FilterService }, { token: i0.ChangeDetectorRef }, { token: ExportService }], target: i0.ɵɵFactoryTarget.Component });
1277
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: CilogTableComponent, isStandalone: true, selector: "cilog-table", inputs: { columns: "columns", values: "values", options: "options", loading: "loading" }, outputs: { columnsChange: "columnsChange", valuesChange: "valuesChange", onEdit: "onEdit", onEditInit: "onEditInit", onDelete: "onDelete", onSelect: "onSelect", onUnselect: "onUnselect", onFilter: "onFilter", onFilterInit: "onFilterInit", onSort: "onSort", onPage: "onPage", onRowDoubleClick: "onRowDoubleClick" }, viewQueries: [{ propertyName: "table", first: true, predicate: ["table"], descendants: true, static: true }, { propertyName: "cm", first: true, predicate: ["cm"], descendants: true }, { propertyName: "inputNumber", first: true, predicate: ["inputNumber"], descendants: true }], ngImport: i0, template: "<div class=\"!relative\"\n [ngStyle]=\"{ 'height': options.scrollHeight != null ? options.scrollHeight : '100%' }\">\n\n @if (options.exportExcel) {\n <button pButton\n icon=\"pi pi-file-excel\"\n class=\"p-button-success !z-5 !absolute !top-0 !left-0 !w-5 !h-5 !rounded-tl-none !rounded-tr-none !rounded-bl-none\"\n pTooltip=\"Exporter le contenu de la grille au format Excel\"\n tooltipPosition=\"right\"\n (click)=\"exportExcel(options.exportExcelByFiltre, !options.exportExcelNoColors)\">\n </button>\n }\n\n <p-contextMenu #cm [model]=\"options.contextMenuItems\" />\n\n <p-table #table\n [columns]=\"columns\"\n [value]=\"values\"\n dataKey=\"id\"\n [selectionMode]=\"getModeSelection()\"\n [metaKeySelection]=\"isModeMetakeySelection()\"\n [(selection)]=\"selectedRows\"\n (onRowSelect)=\"onSelectRow($event)\"\n (onRowUnselect)=\"onUnselectRow($event)\"\n (onHeaderCheckboxToggle)=\"onSelectAll($event)\"\n (sortFunction)=\"sortGrille($event)\"\n [customSort]=\"options.grouping == null ? true : false\"\n [scrollable]=\"true\"\n [loading]=\"loading\"\n [scrollHeight]=\"'flex'\"\n [rowGroupMode]=\"options.grouping != null ? 'subheader' : null\"\n [groupRowsBy]=\"options.grouping != null ? options.grouping.obj + '.' + options.grouping.id : null\"\n [groupRowsByOrder]=\"0\"\n [virtualScroll]=\"options.virtualScroll == true && options.scrollHeight != null ? true : false\"\n [virtualScrollItemSize]=\"options.virtualScrollItemSize != null ? options.virtualScrollItemSize : 35\"\n [paginator]=\"options.paginator == null ? false : true\"\n [rows]=\"options.paginatorRows\"\n (onPage)=\"onPageTable($event)\"\n [tableStyleClass]=\"!options.themeGrille ? 'grid_grey' : options.themeGrille\"\n [lazy]=\"options.lazy == true ? true : false\"\n (onFilter)=\"onFilterTable($event)\"\n [rowTrackBy]=\"trackByFunction\"\n [(contextMenuSelection)]=\"contextMenuSelectedItem\"\n [contextMenu]=\"cm\">\n\n <!-- HEADER -->\n <ng-template pTemplate=\"header\" let-columns>\n\n <!-- HEADERS -->\n <tr class=\"rowHeader\">\n @if (isModeCheckboxSelection()) {\n <th class=\"cellDelete\"\n pFrozenColumn>\n @if (!options.filterable && options.toggleAll) {\n <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\n }\n </th>\n }\n @for (col of columns; track col) {\n @if (!col.invisible) {\n <th [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': col.backgroundColor ? col.backgroundColor : null }\"\n [ngClass]=\"{ '!text-center' : options.centerHeaders, 'headerAffichageSimple': !options.headersAffichageEntier, 'headerAffichageEntier': options.headersAffichageEntier }\"\n [pSortableColumn]=\"col.id\"\n [pSortableColumnDisabled]=\"!options.sortable || options.grouping != null || col.libelle == null || col.libelle == ''\"\n id=\"{{ col.id }}\"\n (click)=\"refreshData()\"\n pFrozenColumn\n [frozen]=\"col.frozen\"\n [pTooltip]=\"col.libelle\"\n [tooltipDisabled]=\"!col.tooltipHeader\"\n tooltipPosition=\"bottom\">\n <div [ngStyle]=\"{ 'color': col.textColor ? col.textColor : null }\">\n {{ col.libelle }}\n </div>\n @if (options.sortable && options.grouping == null && col.libelle != null && col.libelle != '') {\n <p-sortIcon [field]=\"col.id\">\n </p-sortIcon>\n }\n </th>\n }\n }\n @if (options.rowsDeletable) {\n <th class=\"cellDelete\"></th>\n }\n </tr>\n\n <!-- FILTRES -->\n @if (options.filterable) {\n <tr class=\"rowFilter\">\n @if (isModeCheckboxSelection()) {\n <th class=\"cellDelete\"\n pFrozenColumn>\n @if (options.toggleAll) {\n <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\n }\n </th>\n }\n @for (col of columns; track col) {\n <!-- Text -->\n @if (!col.invisible && ((checkType('Dropdown', col) && col.options.filterText)\n || (checkType('MultiSelect', col) && col.options.filterText)\n || checkType('Text', col)\n || checkType('File', col)\n || (checkType('Button', col) && col.options.filterCol))\n || checkType('Number', col)\n || checkType('CilogNumber', col)) {\n <th [ngStyle]=\"{ 'width' : col.width ? col.width : null }\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n @if (!col.disableFilter) {\n <input pInputText\n type=\"text\"\n (input)=\"onFilterCol($event, col)\"\n name=\"filterText\"\n [(ngModel)]=\"col.options.defaultFilters\">\n }\n </th>\n }\n <!-- Date -->\n @if (!col.invisible && checkType('Date', col)) {\n <th [ngStyle]=\"{ 'width' : col.width ? col.width : null }\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n @if (!col.disableFilter) {\n <p-datepicker [view]=\"col.options.mode == null ? 'date' : col.options.mode\"\n [dateFormat]=\"col.options.mode == 'year' ? 'yy' : col.options.mode == 'month' ? 'mm/yy' : 'dd/mm/yy'\"\n [inputId]=\"col.id + '_filter'\"\n [firstDayOfWeek]=\"1\"\n [readonlyInput]=\"true\"\n appendTo=\"body\"\n selectionMode=\"range\"\n (onSelect)=\"onFilterCol($event, col)\"\n showButtonBar=\"true\"\n (onClearClick)=\"onFilterCol($event, col)\"\n name=\"filterDate\"\n [(ngModel)]=\"col.options.defaultFilters\">\n </p-datepicker>\n }\n </th>\n }\n <!-- Liste -->\n @if (!col.invisible && ((checkType('Dropdown', col) && !col.options.filterText) || (checkType('MultiSelect', col) && !col.options.filterText) || checkType('SelectButton', col) || checkType('State', col))) {\n <th [ngStyle]=\"{ 'width' : col.width ? col.width : null }\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n @if (!col.disableFilter) {\n <p-multiSelect [options]=\"col.options?.options\"\n [filter]=\"true\"\n dataKey=\"ID\"\n [optionLabel]=\"col.options?.optionLabel\"\n appendTo=\"body\"\n emptyFilterMessage=\"Aucun r\u00E9sultat\"\n emptyMessage=\"Aucun r\u00E9sultat\"\n [virtualScroll]=\"true\"\n [virtualScrollItemSize]=\"35\"\n selectedItemsLabel=\"{0} selectionn\u00E9s\"\n (onChange)=\"onFilterCol($event, col)\"\n name=\"filterChoix\"\n [(ngModel)]=\"col.options.defaultFilters\"\n [group]=\"col.options.optionGroupChildren != null ? true : false\"\n [optionGroupLabel]=\"col.options.optionGroupLabel\"\n [optionGroupChildren]=\"col.options.optionGroupChildren\"\n [showToggleAll]=\"false\"\n [showClear]=\"true\"\n (onClear)=\"onFilterCol(null, col)\">\n <ng-template let-group pTemplate=\"group\">\n <div>{{group[col.options.optionGroupLabel]}}</div>\n </ng-template>\n </p-multiSelect>\n }\n </th>\n }\n <!-- Switch -->\n @if (!col.invisible && checkType('Switch', col)) {\n <th [ngStyle]=\"{ 'width' : col.width ? col.width : null }\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n @if (!col.disableFilter) {\n <p-multiSelect [options]=\"optionsSwitch\"\n [showHeader]=\"false\"\n optionLabel=\"label\"\n optionValue=\"value\"\n appendTo=\"body\"\n emptyFilterMessage=\"Aucun r\u00E9sultat\"\n emptyMessage=\"Aucun r\u00E9sultat\"\n [virtualScrollItemSize]=\"30\"\n selectedItemsLabel=\"{0} selectionn\u00E9s\"\n (onChange)=\"onFilterCol($event, col)\"\n name=\"filterChoix2\"\n [(ngModel)]=\"col.options.defaultFilters\">\n </p-multiSelect>\n }\n </th>\n }\n <!-- Non filtrable -->\n @if (!col.invisible && (checkType('Image', col) || (checkType('Button', col) && !col.options.filterCol))) {\n <th [ngStyle]=\"{ 'width' : col.width ? col.width : null }\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n </th>\n }\n }\n @if (options.rowsDeletable) {\n <th class=\"cellDelete\"></th>\n }\n </tr>\n }\n\n <!-- TOTAL -->\n @if (options.rowTotal) {\n <tr class=\"rowTotal\">\n @if (isModeCheckboxSelection()) {\n <th class=\"cellDelete\"\n pFrozenColumn>\n </th>\n }\n @for (col of columns; track col) {\n @if (!col.invisible) {\n <th [ngStyle]=\"{ 'width' : col.width ? col.width : null }\"\n [ngClass]=\"{ '!text-center' : true }\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n <div>{{ getTotalStr(col) }}</div>\n </th>\n }\n }\n @if (options.rowsDeletable) {\n <th class=\"cellDelete\"></th>\n }\n </tr>\n }\n </ng-template>\n\n <!--Groupheader-->\n <ng-template pTemplate=\"groupheader\" let-rowData>\n <tr pRowGroupHeader class=\"rowGrouping\">\n <td [attr.colspan]=\"columns.length\">\n <div class=\"text_bold\">{{ rowData[options.grouping.obj][options.grouping.libelle] }}</div>\n </td>\n </tr>\n </ng-template>\n\n <!-- Body -->\n <ng-template pTemplate=\"body\" let-rowData let-columns=\"columns\">\n <tr id=\"{{ rowData.id }}\"\n [ngStyle]=\"{ 'background-color': rowData.color ? rowData.color : null }\"\n [pSelectableRow]=\"rowData\"\n [pSelectableRowDisabled]=\"!options.selectable || isModeCheckboxSelection() || isModeCellSelection()\"\n (dblclick)=\"onRowDoubleClickEvent(rowData)\"\n [pContextMenuRow]=\"rowData\"\n [pContextMenuRowDisabled]=\"options.contextMenuItems == null\">\n\n @if (isModeCheckboxSelection()) {\n <td class=\"cellDelete\"\n pFrozenColumn>\n <p-tableCheckbox [value]=\"rowData\" [disabled]=\"rowData.readonly\"></p-tableCheckbox>\n </td>\n }\n\n @for (col of columns; track col) {\n <!-- Text -->\n @if (!col.invisible && checkType('Text', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly) {\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\n [pEditableColumn]=\"rowData\"\n [pEditableColumnField]=\"col.id\"\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value\"\n [tooltipDisabled]=\"!col.tooltip\"\n tooltipPosition=\"bottom\"\n pFrozenColumn\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\n [frozen]=\"col.frozen\"\n [ngClass]=\"{\n '!text-left': col.position == 'left' || col.position == null,\n '!text-right': col.position == 'right',\n '!text-center': col.position == 'center',\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\">\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <input pInputText\n type=\"text\"\n [(ngModel)]=\"rowData[col.id].value\"\n name=\"text\"\n (blur)=\"onEditCell(rowData, col, rowData[col.id].value)\"\n (keydown.enter)=\"onEditCell(rowData, col, rowData[col.id].value)\"\n (keydown.tab)=\"onEditCell(rowData, col, rowData[col.id].value)\"\n (click)=\"onEditInitCell(rowData, col, rowData[col.id].value)\"\n [ngClass]=\"{\n '!text-left': col.position == 'left' || col.position == null,\n '!text-right': col.position == 'right',\n '!text-center': col.position == 'center',\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true\n }\" />\n </ng-template>\n <ng-template pTemplate=\"output\">\n @if (rowData[col.id]) {\n <div style=\"white-space: pre;\">\n {{ getFormattedText(col, rowData) }}\n </div>\n }\n </ng-template>\n </p-cellEditor>\n </td>\n }\n @if (!col.invisible && checkType('Text', col) && (!isModeEdition() || rowData.readonly || rowData[col.id]?.readonly)) {\n <td [ngStyle]=\"{\n 'width' : col.width ? col.width : null,\n 'background-color' : rowData[col.id].color ? rowData[col.id].color : null,\n 'color' : rowData[col.id].textColor ? rowData[col.id].textColor : null\n }\"\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value\"\n [tooltipDisabled]=\"!col.tooltip\"\n tooltipPosition=\"bottom\"\n [ngClass]=\"{\n 'paddingCell': rowData[col.id] != null,\n '!text-left': col.position == 'left' || col.position == null,\n '!text-right': col.position == 'right',\n '!text-center': col.position == 'center',\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n <div class=\"p-column-title\">\n {{ col.libelle }} :\n </div>\n @if (rowData[col.id]) {\n <div style=\"white-space: pre;\">\n {{ getFormattedText(col, rowData) }}\n </div>\n }\n </td>\n }\n <!-- Dropdown -->\n @if (!col.invisible && checkType('Dropdown', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly) {\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\n [ngClass]=\"{\n '!text-left': col.position == 'left' || col.position == null,\n '!text-right': col.position == 'right',\n '!text-center': col.position == 'center',\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\"\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value != null ? rowData[col.id].value[getOption(col, rowData, 'optionLabel')] : ''\"\n [tooltipDisabled]=\"!col.tooltip\"\n tooltipPosition=\"bottom\"\n pFrozenColumn\n [frozen]=\"col.frozen\"\n class=\"paddingCell\">\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\n @if (rowData[col.id] != null) {\n <p-select dataKey=\"ID\"\n [options]=\"getOption(col, rowData, 'options')\"\n [filter]=\"getOption(col, rowData, 'filter')\"\n [optionLabel]=\"getOption(col, rowData, 'optionLabel')\"\n [(ngModel)]=\"rowData[col.id].value\"\n name=\"select\"\n appendTo=\"body\"\n [showClear]=\"getOption(col, rowData, 'deletable')\"\n emptyFilterMessage=\"Aucun r\u00E9sultat\"\n emptyMessage=\"Aucun r\u00E9sultat\"\n [virtualScroll]=\"getOption(col, rowData, 'virtualScroll')\"\n [readonly]=\"rowData.readonly || rowData[col.id]?.readonly\"\n [virtualScrollItemSize]=\"30\"\n (onChange)=\"onEditCell(rowData, col, rowData[col.id].value)\"\n (onClear)=\"onEditCell(rowData, col, rowData[col.id].value)\">\n <ng-template let-data pTemplate=\"selectedItem\">\n @if (data != null) {\n <span [ngClass]=\"{\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true\n }\">\n {{ data[getOption(col, rowData, 'optionLabel')] }}\n </span>\n }\n @if (data == null) {\n <span></span>\n }\n </ng-template>\n </p-select>\n }\n </td>\n }\n @if (!col.invisible && checkType('Dropdown', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())) {\n <td [ngStyle]=\"{\n 'width' : col.width ? col.width : null,\n 'background-color': rowData[col.id].color ? rowData[col.id].color : null,\n 'color' : rowData[col.id].textColor ? rowData[col.id].textColor : null\n }\"\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value != null ? rowData[col.id].value[getOption(col, rowData, 'optionLabel')] : ''\"\n [tooltipDisabled]=\"!col.tooltip\"\n tooltipPosition=\"bottom\"\n [ngClass]=\"{\n 'paddingCell': rowData[col.id] != null,\n '!text-left': col.position == 'left' || col.position == null,\n '!text-right': col.position == 'right',\n '!text-center': col.position == 'center',\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\n @if (rowData[col.id]) {\n <div>{{ rowData[col.id].value != null ? rowData[col.id].value[getOption(col, rowData, 'optionLabel')] : '' }}</div>\n }\n </td>\n }\n <!-- Cilog Number -->\n @if (!col.invisible && checkType('CilogNumber', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly) {\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\n [ngClass]=\"{\n 'paddingCell': rowData[col.id] != null,\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\"\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value | value\"\n [tooltipDisabled]=\"!col.tooltip\"\n tooltipPosition=\"bottom\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\n @if (rowData[col.id] && !rowData.readonly && !rowData[col.id]?.readonly) {\n <cilog-input-number (onInput)=\"onInputNumber($event)\"\n [(ngModel)]=\"rowData[col.id].value\"\n name=\"cilog-number\"\n ngDefaultControl\n [inputStyleClass]=\"col.position == null || col.position == 'right' ? '!text-right' : col.position == 'left' ? '!text-left' : '!text-center'\"\n [textColor]=\"rowData[col.id].textColor\"\n [bold]=\"rowData.bold == true || rowData[col.id].bold == true\"\n [italic]=\"rowData.italic == true || rowData[col.id].italic == true\"\n [suffixe]=\"getOption(col, rowData, 'suffix')\"\n [prefixe]=\"getOption(col, rowData, 'prefix') != null ? getOption(col, rowData, 'prefix') + ' ' : null\"\n [min]=\"getOption(col, rowData, 'min')\"\n [max]=\"getOption(col, rowData, 'max')\"\n [disabled]=\"rowData.readonly || rowData[col.id]?.readonly\"\n [maxDecimals]=\"getOption(col, rowData, 'modeInteger') != null && getOption(col, rowData, 'modeInteger') == true ? 0 : getOption(col, rowData, 'maxDecimales') != null ? getOption(col, rowData, 'maxDecimales') : 2 \"\n (onChange)=\"onEditCell(rowData, col, rowData[col.id].value)\"\n (onFocus)=\"onEditInitCell(rowData, col, rowData[col.id].value)\">\n </cilog-input-number>\n }\n </td>\n }\n @if (!col.invisible && checkType('CilogNumber', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())) {\n <td [ngStyle]=\"{\n 'width' : col.width ? col.width : null,\n 'background-color': rowData[col.id].color ? rowData[col.id].color : null,\n 'color' : rowData[col.id].textColor ? rowData[col.id].textColor : null\n }\"\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value | value\"\n [tooltipDisabled]=\"!col.tooltip\"\n tooltipPosition=\"bottom\"\n [ngClass]=\"{\n 'paddingCell': rowData[col.id] != null,\n '!text-left': col.position == 'left' || col.position == null,\n '!text-right': col.position == 'right',\n '!text-center': col.position == 'center',\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\n @if (rowData[col.id]) {\n <div>{{ getFormattedNumber(col, rowData, rowData[col.id].value) }}</div>\n }\n </td>\n }\n <!-- Number -->\n @if (!col.invisible && checkType('Number', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly) {\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value | value\"\n [tooltipDisabled]=\"!col.tooltip\"\n [ngClass]=\"{\n 'paddingCell': rowData[col.id] != null,\n '!text-left': col.position == 'left',\n '!text-right': col.position == 'right' || col.position == null,\n '!text-center': col.position == 'center',\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\"\n tooltipPosition=\"bottom\"\n pFrozenColumn\n [frozen]=\"col.frozen\"\n (click)=\"onClickCellNumber(rowData, col)\">\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\n @if (rowData[col.id] && !rowData[col.id].focus) {\n <div>\n {{ getFormattedNumber(col, rowData, rowData[col.id].value) }}\n </div>\n }\n @if (rowData[col.id] && !rowData.readonly && !rowData[col.id]?.readonly && rowData[col.id].focus == true) {\n <p-inputNumber #inputNumber\n locale=\"fr-FR\"\n (onInput)=\"onInputNumber($event)\"\n [(ngModel)]=\"rowData[col.id].value\"\n name=\"input-number\"\n [showButtons]=\"getOption(col, rowData, 'showButtons')\"\n [inputStyleClass]=\"col.position == null || col.position == 'right' ? '!text-right' : col.position == 'left' ? '!text-left' : '!text-center'\"\n [inputStyle]=\"{ 'font-weight': rowData.bold == true || rowData[col.id].bold == true ? 'bold' : null, 'font-style': rowData.italic == true || rowData[col.id].italic == true ? 'italic' : null }\"\n [suffix]=\"getOption(col, rowData, 'suffix')\"\n [prefix]=\"getOption(col, rowData, 'prefix') != null ? getOption(col, rowData, 'prefix') + ' ' : null\"\n [min]=\"getOption(col, rowData, 'min')\"\n [max]=\"getOption(col, rowData, 'max')\"\n [minFractionDigits]=\"getOption(col, rowData, 'modeInteger') != null && getOption(col, rowData, 'modeInteger') == true ? 0 : getOption(col, rowData, 'minDecimales') != null ? getOption(col, rowData, 'minDecimales') : 0\"\n [maxFractionDigits]=\"getOption(col, rowData, 'modeInteger') != null && getOption(col, rowData, 'modeInteger') == true ? 0 : getOption(col, rowData, 'maxDecimales') != null ? getOption(col, rowData, 'maxDecimales') : 2 \"\n (onBlur)=\"onEditCell(rowData, col, rowData[col.id].value)\"\n (onKeyDown)=\"onKeyDown($event, rowData, col, rowData[col.id].value)\"\n (onFocus)=\"onEditInitCell(rowData, col, rowData[col.id].value)\">\n </p-inputNumber>\n }\n </td>\n }\n @if (!col.invisible && checkType('Number', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())) {\n <td [ngStyle]=\"{\n 'width' : col.width ? col.width : null,\n 'background-color': rowData[col.id].color ? rowData[col.id].color : null,\n 'color' : rowData[col.id].textColor ? rowData[col.id].textColor : null\n }\"\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value | value\"\n [tooltipDisabled]=\"!col.tooltip\"\n tooltipPosition=\"bottom\"\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\n [ngClass]=\"{\n 'paddingCell': rowData[col.id] != null,\n '!text-left': col.position == 'left',\n '!text-right': col.position == 'right' || col.position == null,\n '!text-center': col.position == 'center',\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\n @if (rowData[col.id]) {\n <div>{{ getFormattedNumber(col, rowData, rowData[col.id].value) }}</div>\n }\n </td>\n }\n <!-- Date -->\n @if (!col.invisible && checkType('Date', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly) {\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\n [ngClass]=\"{\n 'paddingCell': rowData[col.id] != null,\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\"\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : getOption(col, rowData, 'mode') == 'year' ? (rowData[col.id].value | date: 'yyyy') : getOption(col, rowData, 'mode') == 'month' ? (rowData[col.id].value | date: 'MM/yy') : getOption(col, rowData, 'mode') == 'hour' ? (rowData[col.id].value | date: 'HH:mm') : getOption(col, rowData, 'mode') == 'datehour' ? (rowData[col.id].value | date: 'dd/MM/yy HH:mm') : (rowData[col.id].value | date: 'dd/MM/yyyy')\"\n [tooltipDisabled]=\"!col.tooltip\"\n tooltipPosition=\"bottom\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\n <p-datepicker [(ngModel)]=\"rowData[col.id].value\"\n name=\"date-picker\"\n [view]=\"getOption(col, rowData, 'mode') == null || getOption(col, rowData, 'mode') == 'date' || getOption(col, rowData, 'mode') == 'hour' ? 'date' : getOption(col, rowData, 'mode') == 'datehour' ? 'date' : getOption(col, rowData, 'mode')\"\n [dateFormat]=\"getOption(col, rowData, 'mode') == 'year' ? 'yy' : getOption(col, rowData, 'mode') == 'month' ? 'mm/yy' : getOption(col, rowData, 'mode') == 'hour' || getOption(col, rowData, 'mode') == 'datehour' ? 'dd/mm/yy' : 'dd/mm/yy'\"\n [showTime]=\"getOption(col, rowData, 'mode') == 'datehour'\"\n [timeOnly]=\"getOption(col, rowData, 'mode') == 'hour'\"\n [hourFormat]=\"'24'\"\n [firstDayOfWeek]=\"1\"\n (onSelect)=\"onEditCell(rowData, col, rowData[col.id].value)\"\n (onBlur)=\"onEditCell(rowData, col, rowData[col.id].value)\"\n (onClear)=\"onEditCell(rowData, col, rowData[col.id].value)\"\n [inputStyleClass]=\"col.position == null || col.position == 'right' ? '!text-right' : col.position == 'left' ? '!text-left' : '!text-center'\"\n [inputStyle]=\"{ 'font-weight': rowData.bold == true || rowData[col.id].bold == true ? 'bold' : null, 'font-style': rowData.italic == true || rowData[col.id].italic == true ? 'italic' : null }\"\n [showClear]=\"getOption(col, rowData, 'clear')\"\n [minDate]=\"getOption(col, rowData, 'minDate')\"\n [maxDate]=\"getOption(col, rowData, 'maxDate')\"\n [defaultDate]=\"getOption(col, rowData, 'defaultDate')\"\n appendTo=\"body\">\n </p-datepicker>\n </td>\n }\n @if (!col.invisible && checkType('Date', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())) {\n <td [ngStyle]=\"{\n 'min-width' : col.width ? col.width : null,\n 'background-color': rowData[col.id].color ? rowData[col.id].color : null,\n 'color' : rowData[col.id].textColor ? rowData[col.id].textColor : null\n }\"\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value | date: 'dd/MM/yyyy'\"\n [tooltipDisabled]=\"!col.tooltip\"\n tooltipPosition=\"bottom\"\n [ngClass]=\"{\n 'paddingCell': rowData[col.id] != null,\n '!text-left': col.position == 'left' || col.position == null,\n '!text-right': col.position == 'right',\n '!text-center': col.position == 'center',\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\n @if (rowData[col.id]) {\n <div>{{ rowData[col.id].value | date: (getOption(col, rowData, 'mode') == 'year' ? 'yyyy' : getOption(col, rowData, 'mode') == 'month' ? 'MM/yyyy' : 'dd/MM/yyyy') }}</div>\n }\n </td>\n }\n <!-- MultiSelect -->\n @if (!col.invisible && checkType('MultiSelect', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly) {\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\n [ngClass]=\"{\n '!text-left': col.position == 'left' || col.position == null,\n '!text-right': col.position == 'right',\n '!text-center': col.position == 'center',\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\"\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : getMultiSelectConcat(rowData[col.id].value, getOption(col, rowData, 'optionLabel'))\"\n [tooltipDisabled]=\"!col.tooltip\"\n tooltipPosition=\"bottom\"\n pFrozenColumn\n [frozen]=\"col.frozen\"\n class=\"paddingCell\">\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\n @if (rowData[col.id] != null) {\n <p-multiSelect [options]=\"getOption(col, rowData, 'options')\"\n [filter]=\"getOption(col, rowData, 'filter')\"\n [optionLabel]=\"getOption(col, rowData, 'optionLabel')\"\n [(ngModel)]=\"rowData[col.id].value\"\n name=\"multiselect\"\n appendTo=\"body\"\n dataKey=\"ID\"\n emptyFilterMessage=\"Aucun r\u00E9sultat\"\n emptyMessage=\"Aucun r\u00E9sultat\"\n [virtualScroll]=\"getOption(col, rowData, 'virtualScroll')\"\n [readonly]=\"rowData.readonly || rowData[col.id]?.readonly || !isModeEdition()\"\n [virtualScrollItemSize]=\"30\"\n selectedItemsLabel=\"{0} selectionn\u00E9s\"\n (onChange)=\"editMultiselect(rowData, col, $event)\"\n [showToggleAll]=\"false\"\n [showHeader]=\"getOption(col, rowData, 'filter')\"\n [group]=\"getOption(col, rowData, 'optionGroupChildren') != null ? true : false\"\n [optionGroupLabel]=\"getOption(col, rowData, 'optionGroupLabel')\"\n [optionGroupChildren]=\"getOption(col, rowData, 'optionGroupChildren')\"\n ngDefaultControl>\n <ng-template let-data pTemplate=\"selectedItems\">\n @for (option of data; track option; let i = $index) {\n <span [ngClass]=\"{\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true\n }\">\n {{ option[getOption(col, rowData, 'optionLabel')] + (i != data.length - 1 ? ',' : '') }}\n </span>\n }\n </ng-template>\n <ng-template let-group pTemplate=\"group\">\n <div>{{group[col.options.optionGroupLabel]}}</div>\n </ng-template>\n </p-multiSelect>\n }\n </td>\n }\n @if (!col.invisible && checkType('MultiSelect', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())) {\n <td [ngStyle]=\"{\n 'width' : col.width ? col.width : null,\n 'background-color': rowData[col.id].color ? rowData[col.id].color : null,\n 'color' : rowData[col.id].textColor ? rowData[col.id].textColor : null\n }\"\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : getMultiSelectConcat(rowData[col.id].value, getOption(col, rowData, 'optionLabel'))\"\n [tooltipDisabled]=\"!col.tooltip\"\n tooltipPosition=\"bottom\"\n [ngClass]=\"{\n 'paddingCell': rowData[col.id] != null,\n '!text-left': col.position == 'left' || col.position == null,\n '!text-right': col.position == 'right',\n '!text-center': col.position == 'center',\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\n @if (rowData[col.id]) {\n <div>{{ getMultiSelectConcat(rowData[col.id].value, getOption(col, rowData, 'optionLabel')) }}</div>\n }\n </td>\n }\n <!-- Image -->\n @if (!col.invisible && checkType('Image', col)) {\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\n [ngClass]=\"{\n 'paddingCell': rowData[col.id] != null,\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\"\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\n class=\"!text-center\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\n @if (rowData[col.id]) {\n <img style=\"vertical-align: middle; width: 40px;\" src=\"{{ rowData[col.id].value }}\" />\n }\n </td>\n }\n <!-- Button -->\n @if (!col.invisible && checkType('Button', col)) {\n <td class=\"paddingCell !text-center\"\n [ngClass]=\"{\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\"\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\n [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\">\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\n @if (rowData[col.id].value != null && isValueButtonByType(rowData[col.id].value, 'function')) {\n <button pButton\n [disabled]=\"rowData.readonly || rowData[col.id]?.readonly\"\n [label]=\"getOption(col, rowData, 'label')\"\n [icon]=\"getOption(col, rowData, 'icon')\"\n (click)=\"rowData[col.id].value()\"\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : getOption(col, rowData, 'label')\"\n [tooltipDisabled]=\"!col.tooltip\"\n [class]=\"'p-button-' + getOption(col, rowData, 'severity')\"\n [ngClass]=\"{\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true\n }\">\n </button>\n }\n @if (isValueButtonByType(rowData[col.id].value, 'string')) {\n <div [ngClass]=\"{\n 'paddingCell': rowData[col.id] != null,\n '!text-left': col.position == 'left' || col.position == null,\n '!text-right': col.position == 'right',\n '!text-center': col.position == 'center',\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true\n }\"\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value\"\n [tooltipDisabled]=\"!col.tooltip\">\n {{ rowData[col.id].value }}\n </div>\n }\n </td>\n }\n <!-- SelectButton -->\n @if (!col.invisible && checkType('SelectButton', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly) {\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\n [ngClass]=\"{\n 'paddingCell': rowData[col.id] != null,\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\"\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\n @if (rowData[col.id] != null) {\n <p-selectButton [options]=\"getOption(col, rowData, 'options')\"\n [optionLabel]=\"getOption(col, rowData, 'optionLabel')\"\n [optionValue]=\"getOption(col, rowData, 'optionValue') != null ? getOption(col, rowData, 'optionValue') : 'value'\"\n [(ngModel)]=\"rowData[col.id].value\"\n name=\"select-button\"\n [disabled]=\"rowData.readonly || rowData[col.id]?.readonly || !isModeEdition()\"\n (onChange)=\"onEditCell(rowData, col, rowData[col.id].value)\">\n <ng-template let-item pTemplate=\"item\">\n <span class=\"!text-center w-full\"\n [ngClass]=\"{\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true\n }\">\n {{ item.label }}\n </span>\n </ng-template>\n </p-selectButton>\n }\n </td>\n }\n @if (!col.invisible && checkType('SelectButton', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())) {\n <td [ngStyle]=\"{\n 'width' : col.width ? col.width : null,\n 'background-color': rowData[col.id].color ? rowData[col.id].color : null,\n 'color' : rowData[col.id].textColor ? rowData[col.id].textColor : null\n }\"\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\n pFrozenColumn\n [frozen]=\"col.frozen\"\n class=\"!text-center\"\n [ngClass]=\"{\n 'paddingCell': rowData[col.id] != null,\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\">\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\n @if (rowData[col.id]) {\n <div>{{ getSelectLibelleByValue(rowData, col) }}</div>\n }\n </td>\n }\n <!-- Switch -->\n @if (!col.invisible && checkType('Switch', col)) {\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\n class=\"!text-center\"\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\n [ngClass]=\"{\n 'paddingCell': rowData[col.id] != null,\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\"\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\n @if (rowData[col.id] != null) {\n <p-toggleswitch [(ngModel)]=\"rowData[col.id].value\"\n name=\"toggle-switch\"\n [disabled]=\"rowData.readonly || rowData[col.id]?.readonly || (getOption(col, rowData, 'action') == null && !isModeEdition())\"\n (onChange)=\"onEditCell(rowData, col, rowData[col.id].value)\"\n ngDefaultControl>\n </p-toggleswitch>\n }\n </td>\n }\n <!-- File -->\n @if (!col.invisible && checkType('File', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly) {\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\n [ngClass]=\"{\n 'paddingCell': rowData[col.id] != null,\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\"\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\n @if (rowData[col.id] != null) {\n <div class=\"p-inputgroup\">\n <button type=\"button\"\n pButton\n pRipple\n icon=\"pi pi-upload\"\n (click)=\"clickById('input_' + rowData[col.id].id)\"\n [disabled]=\"rowData.readonly || rowData[col.id]?.readonly || !isModeEdition()\">\n </button>\n <input id=\"{{'output_' + rowData[col.id].id}}\"\n pInputText\n type=\"text\"\n [ngClass]=\"{\n '!text-left': col.position == 'left' || col.position == null,\n '!text-right': col.position == 'right',\n '!text-center': col.position == 'center',\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true\n }\"\n value=\"{{ rowData[col.id].value != null ? rowData[col.id].value : '' }}\"\n readonly\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value ? rowData[col.id].value : ''\"\n [tooltipDisabled]=\"!col.tooltip\">\n @if (getOption(col, rowData, 'downloadPath') && rowData[col.id].value != null) {\n <button type=\"button\"\n pButton\n pRipple\n icon=\"pi pi-download\"\n (click)=\"downloadFile(rowData[col.id])\"\n [disabled]=\"rowData.readonly || rowData[col.id]?.readonly || !isModeEdition()\">\n </button>\n }\n </div>\n }\n @if (rowData[col.id]) {\n <input id=\"{{'input_' + rowData[col.id].id}}\" #inputFile pInputText type=\"file\" hidden (change)=\"rowData[col.id].value = inputFile.files[0].name; onEditCell(rowData, col, inputFile.files[0])\">\n }\n </td>\n }\n @if (!col.invisible && checkType('File', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())) {\n <td [ngStyle]=\"{\n 'width' : col.width ? col.width : null,\n 'background-color': rowData[col.id].color ? rowData[col.id].color : null,\n 'color' : rowData[col.id].textColor ? rowData[col.id].textColor : null\n }\"\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value ? rowData[col.id].value : ''\"\n [ngClass]=\"{\n 'paddingCell': rowData[col.id] != null,\n '!text-left': col.position == 'left' || col.position == null,\n '!text-right': col.position == 'right',\n '!text-center': col.position == 'center',\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\"\n [tooltipDisabled]=\"!col.tooltip\"\n tooltipPosition=\"bottom\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\n @if (rowData[col.id]) {\n <div>{{ rowData[col.id].value ? rowData[col.id].value : '' }}</div>\n }\n </td>\n }\n <!-- State -->\n @if (!col.invisible && checkType('State', col)) {\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\n [ngClass]=\"{\n 'paddingCell': rowData[col.id] != null,\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\"\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\n class=\"!text-center\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\n @if (rowData[col.id].value != null) {\n <p-tag [value]=\"rowData[col.id].value[getOption(col, rowData, 'optionLabel')]\"\n [severity]=\"rowData[col.id].value.severity\"\n [icon]=\"rowData[col.id].value.icon\"\n [style]=\"{\n 'background-color': rowData[col.id].value.backgroundColor,\n 'color': rowData[col.id].value.textColor,\n 'font-weight': rowData.bold == true || rowData[col.id].bold == true ? 'bold' : null,\n 'font-style': rowData.italic == true || rowData[col.id].italic == true ? 'italic' : null\n }\">\n </p-tag>\n }\n </td>\n }\n }\n\n <!-- Deletion -->\n @if (options.rowsDeletable) {\n <td class=\"cellDelete\"\n [ngClass]=\"rowData.deletable ? 'paddingCell' : null\">\n @if (rowData.deletable) {\n <button pButton\n type=\"button\"\n icon=\"pi pi-times\"\n class=\"p-button-danger buttonDelete p-button-text\"\n [disabled]=\"rowData.readonly\"\n (click)=\"onDeleteLine(rowData)\">\n </button>\n }\n </td>\n }\n\n </tr>\n </ng-template>\n </p-table>\n</div>\n", styles: ["::ng-deep .p-tooltip .p-tooltip-text{overflow-wrap:break-word!important}:host ::ng-deep .p-toggleswitch.p-toggleswitch-checked.p-disabled .p-toggleswitch-slider{background:#abd9ba!important}:host ::ng-deep .grid_brown .rowHeader>th{background-color:#795548}:host ::ng-deep .grid_brown .rowHeader>th div{color:#fff}:host ::ng-deep .grid_brown .rowHeader>th i{color:#fff}:host ::ng-deep .grid_brown .rowHeader .p-sortable-column:hover{background-color:#a47767}:host ::ng-deep .grid_brown .rowHeader .p-sortable-column:hover i{color:#fff}:host ::ng-deep .grid_brown .rowHeader .p-sortable-column.p-highlight div{color:#76c7ff}:host ::ng-deep .grid_brown .rowHeader .p-sortable-column.p-highlight .p-sortable-column-icon{color:#76c7ff}:host ::ng-deep .grid_brown .rowFilter th{background-color:#795548}:host ::ng-deep .grid_grey .rowHeader>th{background-color:#dedddd}:host ::ng-deep .grid_grey .rowHeader>th div{color:#495057}:host ::ng-deep .grid_grey .rowHeader>th i{color:#495057}:host ::ng-deep .grid_grey .rowHeader .p-sortable-column:hover{background-color:#e7e7e7}:host ::ng-deep .grid_grey .rowHeader .p-sortable-column:hover i{color:#495057}:host ::ng-deep .grid_grey .rowHeader .p-sortable-column.p-highlight div{color:#008bff}:host ::ng-deep .grid_grey .rowHeader .p-sortable-column.p-highlight .p-sortable-column-icon{color:#008bff}:host ::ng-deep .grid_grey .rowFilter th{background-color:#dedddd}:host ::ng-deep .selectable_cell:hover{background:#dcdcdc!important;cursor:pointer!important}:host ::ng-deep .p-frozen-column{z-index:2!important}:host ::ng-deep .p-datatable-thead{z-index:3!important}:host ::ng-deep .p-checkbox{border-radius:inherit!important}:host ::ng-deep p-inputnumber{width:100%}:host ::ng-deep .p-calendar,:host ::ng-deep .p-inputtext,:host ::ng-deep .p-inputnumber,:host ::ng-deep .p-inputnumber-input,:host ::ng-deep .p-dropdown,:host ::ng-deep .p-multiselect{width:100%}:host ::ng-deep .suffixe,:host ::ng-deep .prefixe{height:25px;padding-top:1px!important}:host ::ng-deep .p-multiselect-label-container,:host ::ng-deep .p-dropdown-label{width:1px!important}:host ::ng-deep .p-scroller-content{min-height:50%}:host ::ng-deep .rowTotal>th{background-color:#edcbaa!important}:host ::ng-deep .rowGrouping{background:#faeada!important}:host ::ng-deep .p-inputswitch.p-inputswitch-checked .p-inputswitch-slider{background:#30e130}:host ::ng-deep .p-inputswitch.p-inputswitch-checked:not(.p-disabled):hover .p-inputswitch-slider{background:#2bd12b}:host ::ng-deep .p-datatable-table{table-layout:fixed}:host ::ng-deep .p-datatable-thead>tr>th{border:1px solid rgba(0,0,0,.12)!important;padding:8px;font-weight:600;height:40px}:host ::ng-deep .headerAffichageSimple div{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host ::ng-deep .headerAffichageEntier{word-wrap:break-word}:host ::ng-deep .p-datatable-tbody>tr>td{border:1px solid rgba(0,0,0,.12)!important;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host ::ng-deep .p-datatable-tbody>tr>td div{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host ::ng-deep .p-tag{max-width:100%}:host ::ng-deep .p-tag .p-tag-value{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host ::ng-deep .p-button{padding:5px;max-width:100%}:host ::ng-deep .p-button .p-button-label{overflow:hidden!important;white-space:nowrap!important;text-overflow:ellipsis!important}:host ::ng-deep .text_bold{font-weight:700!important}:host ::ng-deep .cellDelete{flex:0 0 50px!important;width:50px;text-align:center!important;padding:0!important}:host ::ng-deep .p-tooltip .p-tooltip-text{background-color:red!important}:host ::ng-deep .p-skeleton{background-color:#dee2e6;border-radius:6px;padding:0}:host ::ng-deep .p-datatable-tbody>tr{height:35px}:host ::ng-deep .p-inputtext{height:25px!important;padding:4px 5px!important}:host ::ng-deep .p-inputnumber{height:25px;padding:0!important}:host ::ng-deep .p-inputnumber-input{padding:0 5px!important}:host ::ng-deep .p-inputgroup .p-inputtext{height:25px;padding:4px 5px!important}:host ::ng-deep .p-dropdown,:host ::ng-deep .p-multiselect{vertical-align:middle}:host ::ng-deep .p-dropdown-label{padding-top:2px;padding-bottom:2px}:host ::ng-deep .p-multiselect-label{padding-top:2px;padding-bottom:2px}:host ::ng-deep .p-editable-column{padding:3px 10px!important}:host ::ng-deep .paddingCell{padding:3px 10px!important}:host ::ng-deep .p-selectbutton>.p-button{width:50%;height:25px}:host ::ng-deep .p-inputgroup>.p-button{height:25px}:host ::ng-deep .buttonDelete{width:100%;height:20px}:host ::ng-deep .p-column-title{display:none}:host ::ng-deep .p-datatable-loading-icon{color:#fff}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: TagModule }, { kind: "component", type: i5.Tag, selector: "p-tag", inputs: ["styleClass", "severity", "value", "icon", "rounded"] }, { kind: "directive", type: i1$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "ngmodule", type: ToggleSwitchModule }, { kind: "component", type: i6.ToggleSwitch, selector: "p-toggleswitch, p-toggleSwitch, p-toggle-switch", inputs: ["styleClass", "tabindex", "inputId", "readonly", "trueValue", "falseValue", "ariaLabel", "size", "ariaLabelledBy", "autofocus"], outputs: ["onChange"] }, { kind: "ngmodule", type: TableModule }, { kind: "component", type: i7.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i7.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "directive", type: i7.FrozenColumn, selector: "[pFrozenColumn]", inputs: ["frozen", "alignFrozen"] }, { kind: "directive", type: i7.RowGroupHeader, selector: "[pRowGroupHeader]" }, { kind: "directive", type: i7.SelectableRow, selector: "[pSelectableRow]", inputs: ["pSelectableRow", "pSelectableRowIndex", "pSelectableRowDisabled"] }, { kind: "directive", type: i7.ContextMenuRow, selector: "[pContextMenuRow]", inputs: ["pContextMenuRow", "pContextMenuRowIndex", "pContextMenuRowDisabled"] }, { kind: "directive", type: i7.EditableColumn, selector: "[pEditableColumn]", inputs: ["pEditableColumn", "pEditableColumnField", "pEditableColumnRowIndex", "pEditableColumnDisabled", "pFocusCellSelector"] }, { kind: "component", type: i7.CellEditor, selector: "p-cellEditor" }, { kind: "component", type: i7.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i7.TableCheckbox, selector: "p-tableCheckbox", inputs: ["value", "disabled", "required", "index", "inputId", "name", "ariaLabel"] }, { kind: "component", type: i7.TableHeaderCheckbox, selector: "p-tableHeaderCheckbox", inputs: ["disabled", "inputId", "name", "ariaLabel"] }, { kind: "ngmodule", type: ContextMenuModule }, { kind: "component", type: i8.ContextMenu, selector: "p-contextMenu, p-contextmenu, p-context-menu", inputs: ["model", "triggerEvent", "target", "global", "style", "styleClass", "autoZIndex", "baseZIndex", "id", "breakpoint", "ariaLabel", "ariaLabelledBy", "pressDelay", "appendTo", "motionOptions"], outputs: ["onShow", "onHide"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i9.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo", "ptTooltip", "pTooltipPT", "pTooltipUnstyled"] }, { kind: "ngmodule", type: MultiSelectModule }, { kind: "component", type: i10.MultiSelect, selector: "p-multiSelect, p-multiselect, p-multi-select", inputs: ["id", "ariaLabel", "styleClass", "panelStyle", "panelStyleClass", "inputId", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "dataKey", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "chipIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "placeholder", "options", "filterValue", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus", "highlightOnSelect", "size", "variant", "fluid", "appendTo", "motionOptions"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "ngmodule", type: DatePickerModule }, { kind: "component", type: i11.DatePicker, selector: "p-datePicker, p-datepicker, p-date-picker", inputs: ["iconDisplay", "styleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "readonlyInput", "shortYearCutoff", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "minDate", "maxDate", "disabledDates", "disabledDays", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "view", "defaultDate", "appendTo", "motionOptions"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: i12.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "panelStyle", "styleClass", "panelStyleClass", "readonly", "editable", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "filterValue", "options", "appendTo", "motionOptions"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: CilogInputNumberComponent, selector: "cilog-input-number", inputs: ["min", "max", "maxDecimals", "prefixe", "suffixe", "inputStyleClass", "disabled", "readonly", "textColor", "bold", "italic", "floatLabel"], outputs: ["onInput", "onChange", "onFocus", "onBlur"] }, { kind: "ngmodule", type: SelectButtonModule }, { kind: "component", type: i13.SelectButton, selector: "p-selectButton, p-selectbutton, p-select-button", inputs: ["options", "optionLabel", "optionValue", "optionDisabled", "unselectable", "tabindex", "multiple", "allowEmpty", "styleClass", "ariaLabelledBy", "dataKey", "autofocus", "size", "fluid"], outputs: ["onOptionClick", "onChange"] }, { kind: "ngmodule", type: ButtonModule }, { kind: "directive", type: i3.ButtonDirective, selector: "[pButton]", inputs: ["ptButtonDirective", "pButtonPT", "pButtonUnstyled", "hostName", "text", "plain", "raised", "size", "outlined", "rounded", "iconPos", "loadingIcon", "fluid", "label", "icon", "loading", "buttonProps", "severity"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "directive", type: i2.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pInputTextPT", "pInputTextUnstyled", "pSize", "variant", "fluid", "invalid"] }, { kind: "ngmodule", type: InputNumberModule }, { kind: "component", type: i16.InputNumber, selector: "p-inputNumber, p-inputnumber, p-input-number", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "placeholder", "tabindex", "title", "ariaLabelledBy", "ariaDescribedBy", "ariaLabel", "ariaRequired", "autocomplete", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "readonly", "allowEmpty", "locale", "localeMatcher", "mode", "currency", "currencyDisplay", "useGrouping", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "inputStyle", "inputStyleClass", "showClear", "autofocus"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown", "onClear"] }, { kind: "pipe", type: i3$1.DatePipe, name: "date" }, { kind: "pipe", type: ValuePipe, name: "value" }] });
1300
1278
  }
1301
1279
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: CilogTableComponent, decorators: [{
1302
1280
  type: Component,
@@ -1317,8 +1295,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
1317
1295
  ButtonModule,
1318
1296
  InputTextModule,
1319
1297
  InputNumberModule
1320
- ], template: "<div class=\"!relative\"\r\n [ngStyle]=\"{ 'height': options.scrollHeight != null ? options.scrollHeight : '100%' }\">\r\n\r\n @if (options.exportExcel) {\r\n <button pButton\r\n icon=\"pi pi-file-excel\"\r\n class=\"p-button-success !z-5 !absolute !top-0 !left-0 !w-5 !h-5 !rounded-tl-none !rounded-tr-none !rounded-bl-none\"\r\n pTooltip=\"Exporter le contenu de la grille au format Excel\"\r\n tooltipPosition=\"right\"\r\n (click)=\"exportExcel(options.exportExcelByFiltre, !options.exportExcelNoColors)\">\r\n </button>\r\n }\r\n\r\n <p-contextMenu #cm [model]=\"options.contextMenuItems\" />\r\n\r\n <p-table #table\r\n [columns]=\"columns\"\r\n [value]=\"values\"\r\n dataKey=\"id\"\r\n [selectionMode]=\"getModeSelection()\"\r\n [metaKeySelection]=\"isModeMetakeySelection()\"\r\n [(selection)]=\"selectedRows\"\r\n (onRowSelect)=\"onSelectRow($event)\"\r\n (onRowUnselect)=\"onUnselectRow($event)\"\r\n (onHeaderCheckboxToggle)=\"onSelectAll($event)\"\r\n (sortFunction)=\"sortGrille($event)\"\r\n [customSort]=\"options.grouping == null ? true : false\"\r\n [scrollable]=\"true\"\r\n [loading]=\"loading\"\r\n [scrollHeight]=\"'flex'\"\r\n [rowGroupMode]=\"options.grouping != null ? 'subheader' : null\"\r\n [groupRowsBy]=\"options.grouping != null ? options.grouping.obj + '.' + options.grouping.id : null\"\r\n [groupRowsByOrder]=\"0\"\r\n [virtualScroll]=\"options.virtualScroll == true && options.scrollHeight != null ? true : false\"\r\n [virtualScrollItemSize]=\"options.virtualScrollItemSize != null ? options.virtualScrollItemSize : 35\"\r\n [paginator]=\"options.paginator == null ? false : true\"\r\n [rows]=\"options.paginatorRows\"\r\n (onPage)=\"onPageTable($event)\"\r\n [tableStyleClass]=\"!options.themeGrille ? 'grid_grey' : options.themeGrille\"\r\n [lazy]=\"options.lazy == true ? true : false\"\r\n (onFilter)=\"onFilterTable($event)\"\r\n [rowTrackBy]=\"trackByFunction\"\r\n [(contextMenuSelection)]=\"contextMenuSelectedItem\"\r\n [contextMenu]=\"cm\">\r\n\r\n <!-- HEADER -->\r\n <ng-template pTemplate=\"header\" let-columns>\r\n\r\n <!-- HEADERS -->\r\n <tr class=\"rowHeader\">\r\n @if (isModeCheckboxSelection()) {\r\n <th class=\"cellDelete\"\r\n pFrozenColumn>\r\n @if (!options.filterable && options.toggleAll) {\r\n <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\r\n }\r\n </th>\r\n }\r\n @for (col of columns; track col) {\r\n @if (!col.invisible) {\r\n <th [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': col.backgroundColor ? col.backgroundColor : null }\"\r\n [ngClass]=\"{ '!text-center' : options.centerHeaders, 'headerAffichageSimple': !options.headersAffichageEntier, 'headerAffichageEntier': options.headersAffichageEntier }\"\r\n [pSortableColumn]=\"col.id\"\r\n [pSortableColumnDisabled]=\"!options.sortable || options.grouping != null || col.libelle == null || col.libelle == ''\"\r\n id=\"{{ col.id }}\"\r\n (click)=\"refreshData()\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\"\r\n [pTooltip]=\"col.libelle\"\r\n [tooltipDisabled]=\"!col.tooltipHeader\"\r\n tooltipPosition=\"bottom\">\r\n <div [ngStyle]=\"{ 'color': col.textColor ? col.textColor : null }\">\r\n {{ col.libelle }}\r\n </div>\r\n @if (options.sortable && options.grouping == null && col.libelle != null && col.libelle != '') {\r\n <p-sortIcon [field]=\"col.id\">\r\n </p-sortIcon>\r\n }\r\n </th>\r\n }\r\n }\r\n @if (options.rowsDeletable) {\r\n <th class=\"cellDelete\"></th>\r\n }\r\n </tr>\r\n\r\n <!-- FILTRES -->\r\n @if (options.filterable) {\r\n <tr class=\"rowFilter\">\r\n @if (isModeCheckboxSelection()) {\r\n <th class=\"cellDelete\"\r\n pFrozenColumn>\r\n @if (options.toggleAll) {\r\n <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\r\n }\r\n </th>\r\n }\r\n @for (col of columns; track col) {\r\n <!-- Text -->\r\n @if (!col.invisible && ((checkType('Dropdown', col) && col.options.filterText)\r\n || (checkType('MultiSelect', col) && col.options.filterText)\r\n || checkType('Text', col)\r\n || checkType('File', col)\r\n || (checkType('Button', col) && col.options.filterCol))\r\n || checkType('Number', col)\r\n || checkType('CilogNumber', col)) {\r\n <th [ngStyle]=\"{ 'width' : col.width ? col.width : null }\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n @if (!col.disableFilter) {\r\n <input pInputText\r\n type=\"text\"\r\n (input)=\"onFilterCol($event, col)\"\r\n name=\"filterText\"\r\n [(ngModel)]=\"col.options.defaultFilters\">\r\n }\r\n </th>\r\n }\r\n <!-- Date -->\r\n @if (!col.invisible && checkType('Date', col)) {\r\n <th [ngStyle]=\"{ 'width' : col.width ? col.width : null }\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n @if (!col.disableFilter) {\r\n <p-datepicker [view]=\"col.options.mode == null ? 'date' : col.options.mode\"\r\n [dateFormat]=\"col.options.mode == 'year' ? 'yy' : col.options.mode == 'month' ? 'mm/yy' : 'dd/mm/yy'\"\r\n [inputId]=\"col.id + '_filter'\"\r\n [firstDayOfWeek]=\"1\"\r\n [readonlyInput]=\"true\"\r\n appendTo=\"body\"\r\n selectionMode=\"range\"\r\n (onSelect)=\"onFilterCol($event, col)\"\r\n showButtonBar=\"true\"\r\n (onClearClick)=\"onFilterCol($event, col)\"\r\n name=\"filterDate\"\r\n [(ngModel)]=\"col.options.defaultFilters\">\r\n </p-datepicker>\r\n }\r\n </th>\r\n }\r\n <!-- Liste -->\r\n @if (!col.invisible && ((checkType('Dropdown', col) && !col.options.filterText) || (checkType('MultiSelect', col) && !col.options.filterText) || checkType('SelectButton', col) || checkType('State', col))) {\r\n <th [ngStyle]=\"{ 'width' : col.width ? col.width : null }\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n @if (!col.disableFilter) {\r\n <p-multiSelect [options]=\"col.options?.options\"\r\n [filter]=\"true\"\r\n dataKey=\"ID\"\r\n [optionLabel]=\"col.options?.optionLabel\"\r\n appendTo=\"body\"\r\n emptyFilterMessage=\"Aucun r\u00E9sultat\"\r\n emptyMessage=\"Aucun r\u00E9sultat\"\r\n [virtualScroll]=\"true\"\r\n [virtualScrollItemSize]=\"35\"\r\n selectedItemsLabel=\"{0} selectionn\u00E9s\"\r\n (onChange)=\"onFilterCol($event, col)\"\r\n name=\"filterChoix\"\r\n [(ngModel)]=\"col.options.defaultFilters\"\r\n [group]=\"col.options.optionGroupChildren != null ? true : false\"\r\n [optionGroupLabel]=\"col.options.optionGroupLabel\"\r\n [optionGroupChildren]=\"col.options.optionGroupChildren\"\r\n [showToggleAll]=\"false\"\r\n [showClear]=\"true\"\r\n (onClear)=\"onFilterCol(null, col)\">\r\n <ng-template let-group pTemplate=\"group\">\r\n <div>{{group[col.options.optionGroupLabel]}}</div>\r\n </ng-template>\r\n </p-multiSelect>\r\n }\r\n </th>\r\n }\r\n <!-- Switch -->\r\n @if (!col.invisible && checkType('Switch', col)) {\r\n <th [ngStyle]=\"{ 'width' : col.width ? col.width : null }\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n @if (!col.disableFilter) {\r\n <p-multiSelect [options]=\"optionsSwitch\"\r\n [showHeader]=\"false\"\r\n optionLabel=\"label\"\r\n optionValue=\"value\"\r\n appendTo=\"body\"\r\n emptyFilterMessage=\"Aucun r\u00E9sultat\"\r\n emptyMessage=\"Aucun r\u00E9sultat\"\r\n [virtualScrollItemSize]=\"30\"\r\n selectedItemsLabel=\"{0} selectionn\u00E9s\"\r\n (onChange)=\"onFilterCol($event, col)\"\r\n name=\"filterChoix2\"\r\n [(ngModel)]=\"col.options.defaultFilters\">\r\n </p-multiSelect>\r\n }\r\n </th>\r\n }\r\n <!-- Non filtrable -->\r\n @if (!col.invisible && (checkType('Image', col) || (checkType('Button', col) && !col.options.filterCol))) {\r\n <th [ngStyle]=\"{ 'width' : col.width ? col.width : null }\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n </th>\r\n }\r\n }\r\n @if (options.rowsDeletable) {\r\n <th class=\"cellDelete\"></th>\r\n }\r\n </tr>\r\n }\r\n\r\n <!-- TOTAL -->\r\n @if (options.rowTotal) {\r\n <tr class=\"rowTotal\">\r\n @if (isModeCheckboxSelection()) {\r\n <th class=\"cellDelete\"\r\n pFrozenColumn>\r\n </th>\r\n }\r\n @for (col of columns; track col) {\r\n @if (!col.invisible) {\r\n <th [ngStyle]=\"{ 'width' : col.width ? col.width : null }\"\r\n [ngClass]=\"{ '!text-center' : true }\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n <div>{{ getTotalStr(col) }}</div>\r\n </th>\r\n }\r\n }\r\n @if (options.rowsDeletable) {\r\n <th class=\"cellDelete\"></th>\r\n }\r\n </tr>\r\n }\r\n </ng-template>\r\n\r\n <!--Groupheader-->\r\n <ng-template pTemplate=\"groupheader\" let-rowData>\r\n <tr pRowGroupHeader class=\"rowGrouping\">\r\n <td [attr.colspan]=\"columns.length\">\r\n <div class=\"text_bold\">{{ rowData[options.grouping.obj][options.grouping.libelle] }}</div>\r\n </td>\r\n </tr>\r\n </ng-template>\r\n\r\n <!-- Body -->\r\n <ng-template pTemplate=\"body\" let-rowData let-columns=\"columns\">\r\n <tr id=\"{{ rowData.id }}\"\r\n [ngStyle]=\"{ 'background-color': rowData.color ? rowData.color : null }\"\r\n [pSelectableRow]=\"rowData\"\r\n [pSelectableRowDisabled]=\"!options.selectable || isModeCheckboxSelection() || isModeCellSelection()\"\r\n (dblclick)=\"onRowDoubleClickEvent(rowData)\"\r\n [pContextMenuRow]=\"rowData\"\r\n [pContextMenuRowDisabled]=\"options.contextMenuItems == null\">\r\n\r\n @if (isModeCheckboxSelection()) {\r\n <td class=\"cellDelete\"\r\n pFrozenColumn>\r\n <p-tableCheckbox [value]=\"rowData\" [disabled]=\"rowData.readonly\"></p-tableCheckbox>\r\n </td>\r\n }\r\n\r\n @for (col of columns; track col) {\r\n <!-- Text -->\r\n @if (!col.invisible && checkType('Text', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly) {\r\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [pEditableColumn]=\"rowData\"\r\n [pEditableColumnField]=\"col.id\"\r\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\"\r\n pFrozenColumn\r\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\r\n [frozen]=\"col.frozen\"\r\n [ngClass]=\"{\r\n '!text-left': col.position == 'left' || col.position == null,\r\n '!text-right': col.position == 'right',\r\n '!text-center': col.position == 'center',\r\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\r\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\">\r\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\r\n <p-cellEditor>\r\n <ng-template pTemplate=\"input\">\r\n <input pInputText\r\n type=\"text\"\r\n [(ngModel)]=\"rowData[col.id].value\"\r\n name=\"text\"\r\n (blur)=\"onEditCell(rowData, col, rowData[col.id].value)\"\r\n (keydown.enter)=\"onEditCell(rowData, col, rowData[col.id].value)\"\r\n (keydown.tab)=\"onEditCell(rowData, col, rowData[col.id].value)\"\r\n (click)=\"onEditInitCell(rowData, col, rowData[col.id].value)\"\r\n [ngClass]=\"{\r\n '!text-left': col.position == 'left' || col.position == null,\r\n '!text-right': col.position == 'right',\r\n '!text-center': col.position == 'center',\r\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\r\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true\r\n }\" />\r\n </ng-template>\r\n <ng-template pTemplate=\"output\">\r\n @if (rowData[col.id]) {\r\n <div style=\"white-space: pre;\">\r\n {{ getFormattedText(col, rowData) }}\r\n </div>\r\n }\r\n </ng-template>\r\n </p-cellEditor>\r\n </td>\r\n }\r\n @if (!col.invisible && checkType('Text', col) && (!isModeEdition() || rowData.readonly || rowData[col.id]?.readonly)) {\r\n <td [ngStyle]=\"{\r\n 'width' : col.width ? col.width : null,\r\n 'background-color' : rowData[col.id].color ? rowData[col.id].color : null,\r\n 'color' : rowData[col.id].textColor ? rowData[col.id].textColor : null\r\n }\"\r\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\"\r\n [ngClass]=\"{\r\n 'paddingCell': rowData[col.id] != null,\r\n '!text-left': col.position == 'left' || col.position == null,\r\n '!text-right': col.position == 'right',\r\n '!text-center': col.position == 'center',\r\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\r\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n <div class=\"p-column-title\">\r\n {{ col.libelle }} :\r\n </div>\r\n @if (rowData[col.id]) {\r\n <div style=\"white-space: pre;\">\r\n {{ getFormattedText(col, rowData) }}\r\n </div>\r\n }\r\n </td>\r\n }\r\n <!-- Dropdown -->\r\n @if (!col.invisible && checkType('Dropdown', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly) {\r\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\r\n [ngClass]=\"{\r\n '!text-left': col.position == 'left' || col.position == null,\r\n '!text-right': col.position == 'right',\r\n '!text-center': col.position == 'center',\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\"\r\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value != null ? rowData[col.id].value[getOption(col, rowData, 'optionLabel')] : ''\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\"\r\n class=\"paddingCell\">\r\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\r\n @if (rowData[col.id] != null) {\r\n <p-select dataKey=\"ID\"\r\n [options]=\"getOption(col, rowData, 'options')\"\r\n [filter]=\"getOption(col, rowData, 'filter')\"\r\n [optionLabel]=\"getOption(col, rowData, 'optionLabel')\"\r\n [(ngModel)]=\"rowData[col.id].value\"\r\n name=\"select\"\r\n appendTo=\"body\"\r\n [showClear]=\"getOption(col, rowData, 'deletable')\"\r\n emptyFilterMessage=\"Aucun r\u00E9sultat\"\r\n emptyMessage=\"Aucun r\u00E9sultat\"\r\n [virtualScroll]=\"getOption(col, rowData, 'virtualScroll')\"\r\n [readonly]=\"rowData.readonly || rowData[col.id]?.readonly\"\r\n [virtualScrollItemSize]=\"30\"\r\n (onChange)=\"onEditCell(rowData, col, rowData[col.id].value)\"\r\n (onClear)=\"onEditCell(rowData, col, rowData[col.id].value)\">\r\n <ng-template let-data pTemplate=\"selectedItem\">\r\n @if (data != null) {\r\n <span [ngClass]=\"{\r\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\r\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true\r\n }\">\r\n {{ data[getOption(col, rowData, 'optionLabel')] }}\r\n </span>\r\n }\r\n @if (data == null) {\r\n <span></span>\r\n }\r\n </ng-template>\r\n </p-select>\r\n }\r\n </td>\r\n }\r\n @if (!col.invisible && checkType('Dropdown', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())) {\r\n <td [ngStyle]=\"{\r\n 'width' : col.width ? col.width : null,\r\n 'background-color': rowData[col.id].color ? rowData[col.id].color : null,\r\n 'color' : rowData[col.id].textColor ? rowData[col.id].textColor : null\r\n }\"\r\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value != null ? rowData[col.id].value[getOption(col, rowData, 'optionLabel')] : ''\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\"\r\n [ngClass]=\"{\r\n 'paddingCell': rowData[col.id] != null,\r\n '!text-left': col.position == 'left' || col.position == null,\r\n '!text-right': col.position == 'right',\r\n '!text-center': col.position == 'center',\r\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\r\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\r\n @if (rowData[col.id]) {\r\n <div>{{ rowData[col.id].value != null ? rowData[col.id].value[getOption(col, rowData, 'optionLabel')] : '' }}</div>\r\n }\r\n </td>\r\n }\r\n <!-- Cilog Number -->\r\n @if (!col.invisible && checkType('CilogNumber', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly) {\r\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [ngClass]=\"{\r\n 'paddingCell': rowData[col.id] != null,\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\"\r\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\r\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value | value\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\r\n @if (rowData[col.id] && !rowData.readonly && !rowData[col.id]?.readonly) {\r\n <cilog-input-number (onInput)=\"onInputNumber($event)\"\r\n [(ngModel)]=\"rowData[col.id].value\"\r\n name=\"cilog-number\"\r\n ngDefaultControl\r\n [inputStyleClass]=\"col.position == null || col.position == 'right' ? '!text-right' : col.position == 'left' ? '!text-left' : '!text-center'\"\r\n [textColor]=\"rowData[col.id].textColor\"\r\n [bold]=\"rowData.bold == true || rowData[col.id].bold == true\"\r\n [italic]=\"rowData.italic == true || rowData[col.id].italic == true\"\r\n [suffixe]=\"getOption(col, rowData, 'suffix')\"\r\n [prefixe]=\"getOption(col, rowData, 'prefix') != null ? getOption(col, rowData, 'prefix') + ' ' : null\"\r\n [min]=\"getOption(col, rowData, 'min')\"\r\n [max]=\"getOption(col, rowData, 'max')\"\r\n [disabled]=\"rowData.readonly || rowData[col.id]?.readonly\"\r\n [maxDecimals]=\"getOption(col, rowData, 'modeInteger') != null && getOption(col, rowData, 'modeInteger') == true ? 0 : getOption(col, rowData, 'maxDecimales') != null ? getOption(col, rowData, 'maxDecimales') : 2 \"\r\n (onChange)=\"onEditCell(rowData, col, rowData[col.id].value)\"\r\n (onFocus)=\"onEditInitCell(rowData, col, rowData[col.id].value)\">\r\n </cilog-input-number>\r\n }\r\n </td>\r\n }\r\n @if (!col.invisible && checkType('CilogNumber', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())) {\r\n <td [ngStyle]=\"{\r\n 'width' : col.width ? col.width : null,\r\n 'background-color': rowData[col.id].color ? rowData[col.id].color : null,\r\n 'color' : rowData[col.id].textColor ? rowData[col.id].textColor : null\r\n }\"\r\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value | value\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\"\r\n [ngClass]=\"{\r\n 'paddingCell': rowData[col.id] != null,\r\n '!text-left': col.position == 'left' || col.position == null,\r\n '!text-right': col.position == 'right',\r\n '!text-center': col.position == 'center',\r\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\r\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\r\n @if (rowData[col.id]) {\r\n <div>{{ getFormattedNumber(col, rowData, rowData[col.id].value) }}</div>\r\n }\r\n </td>\r\n }\r\n <!-- Number -->\r\n @if (!col.invisible && checkType('Number', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly) {\r\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value | value\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n [ngClass]=\"{\r\n 'paddingCell': rowData[col.id] != null,\r\n '!text-left': col.position == 'left',\r\n '!text-right': col.position == 'right' || col.position == null,\r\n '!text-center': col.position == 'center',\r\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\r\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\"\r\n tooltipPosition=\"bottom\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\"\r\n (click)=\"onClickCellNumber(rowData, col)\">\r\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\r\n @if (rowData[col.id] && !rowData[col.id].focus) {\r\n <div>\r\n {{ getFormattedNumber(col, rowData, rowData[col.id].value) }}\r\n </div>\r\n }\r\n @if (rowData[col.id] && !rowData.readonly && !rowData[col.id]?.readonly && rowData[col.id].focus == true) {\r\n <p-inputNumber #inputNumber\r\n locale=\"fr-FR\"\r\n (onInput)=\"onInputNumber($event)\"\r\n [(ngModel)]=\"rowData[col.id].value\"\r\n name=\"input-number\"\r\n [showButtons]=\"getOption(col, rowData, 'showButtons')\"\r\n [inputStyleClass]=\"col.position == null || col.position == 'right' ? '!text-right' : col.position == 'left' ? '!text-left' : '!text-center'\"\r\n [inputStyle]=\"{ 'font-weight': rowData.bold == true || rowData[col.id].bold == true ? 'bold' : null, 'font-style': rowData.italic == true || rowData[col.id].italic == true ? 'italic' : null }\"\r\n [suffix]=\"getOption(col, rowData, 'suffix')\"\r\n [prefix]=\"getOption(col, rowData, 'prefix') != null ? getOption(col, rowData, 'prefix') + ' ' : null\"\r\n [min]=\"getOption(col, rowData, 'min')\"\r\n [max]=\"getOption(col, rowData, 'max')\"\r\n [minFractionDigits]=\"getOption(col, rowData, 'modeInteger') != null && getOption(col, rowData, 'modeInteger') == true ? 0 : getOption(col, rowData, 'minDecimales') != null ? getOption(col, rowData, 'minDecimales') : 0\"\r\n [maxFractionDigits]=\"getOption(col, rowData, 'modeInteger') != null && getOption(col, rowData, 'modeInteger') == true ? 0 : getOption(col, rowData, 'maxDecimales') != null ? getOption(col, rowData, 'maxDecimales') : 2 \"\r\n (onBlur)=\"onEditCell(rowData, col, rowData[col.id].value)\"\r\n (onKeyDown)=\"onKeyDown($event, rowData, col, rowData[col.id].value)\"\r\n (onFocus)=\"onEditInitCell(rowData, col, rowData[col.id].value)\">\r\n </p-inputNumber>\r\n }\r\n </td>\r\n }\r\n @if (!col.invisible && checkType('Number', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())) {\r\n <td [ngStyle]=\"{\r\n 'width' : col.width ? col.width : null,\r\n 'background-color': rowData[col.id].color ? rowData[col.id].color : null,\r\n 'color' : rowData[col.id].textColor ? rowData[col.id].textColor : null\r\n }\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value | value\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\"\r\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\r\n [ngClass]=\"{\r\n 'paddingCell': rowData[col.id] != null,\r\n '!text-left': col.position == 'left',\r\n '!text-right': col.position == 'right' || col.position == null,\r\n '!text-center': col.position == 'center',\r\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\r\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\r\n @if (rowData[col.id]) {\r\n <div>{{ getFormattedNumber(col, rowData, rowData[col.id].value) }}</div>\r\n }\r\n </td>\r\n }\r\n <!-- Date -->\r\n @if (!col.invisible && checkType('Date', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly) {\r\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [ngClass]=\"{\r\n 'paddingCell': rowData[col.id] != null,\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\"\r\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\r\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : getOption(col, rowData, 'mode') == 'year' ? (rowData[col.id].value | date: 'yyyy') : getOption(col, rowData, 'mode') == 'month' ? (rowData[col.id].value | date: 'MM/yy') : getOption(col, rowData, 'mode') == 'hour' ? (rowData[col.id].value | date: 'HH:mm') : getOption(col, rowData, 'mode') == 'datehour' ? (rowData[col.id].value | date: 'dd/MM/yy HH:mm') : (rowData[col.id].value | date: 'dd/MM/yyyy')\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\r\n <p-datepicker [(ngModel)]=\"rowData[col.id].value\"\r\n name=\"date-picker\"\r\n [view]=\"getOption(col, rowData, 'mode') == null || getOption(col, rowData, 'mode') == 'date' || getOption(col, rowData, 'mode') == 'hour' ? 'date' : getOption(col, rowData, 'mode') == 'datehour' ? 'date' : getOption(col, rowData, 'mode')\"\r\n [dateFormat]=\"getOption(col, rowData, 'mode') == 'year' ? 'yy' : getOption(col, rowData, 'mode') == 'month' ? 'mm/yy' : getOption(col, rowData, 'mode') == 'hour' || getOption(col, rowData, 'mode') == 'datehour' ? 'dd/mm/yy' : 'dd/mm/yy'\"\r\n [showTime]=\"getOption(col, rowData, 'mode') == 'datehour'\"\r\n [timeOnly]=\"getOption(col, rowData, 'mode') == 'hour'\"\r\n [hourFormat]=\"'24'\"\r\n [firstDayOfWeek]=\"1\"\r\n (onSelect)=\"onEditCell(rowData, col, rowData[col.id].value)\"\r\n (onBlur)=\"onEditCell(rowData, col, rowData[col.id].value)\"\r\n (onClear)=\"onEditCell(rowData, col, rowData[col.id].value)\"\r\n [inputStyleClass]=\"col.position == null || col.position == 'right' ? '!text-right' : col.position == 'left' ? '!text-left' : '!text-center'\"\r\n [inputStyle]=\"{ 'font-weight': rowData.bold == true || rowData[col.id].bold == true ? 'bold' : null, 'font-style': rowData.italic == true || rowData[col.id].italic == true ? 'italic' : null }\"\r\n [showClear]=\"getOption(col, rowData, 'clear')\"\r\n [minDate]=\"getOption(col, rowData, 'minDate')\"\r\n [maxDate]=\"getOption(col, rowData, 'maxDate')\"\r\n [defaultDate]=\"getOption(col, rowData, 'defaultDate')\"\r\n appendTo=\"body\">\r\n </p-datepicker>\r\n </td>\r\n }\r\n @if (!col.invisible && checkType('Date', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())) {\r\n <td [ngStyle]=\"{\r\n 'min-width' : col.width ? col.width : null,\r\n 'background-color': rowData[col.id].color ? rowData[col.id].color : null,\r\n 'color' : rowData[col.id].textColor ? rowData[col.id].textColor : null\r\n }\"\r\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value | date: 'dd/MM/yyyy'\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\"\r\n [ngClass]=\"{\r\n 'paddingCell': rowData[col.id] != null,\r\n '!text-left': col.position == 'left' || col.position == null,\r\n '!text-right': col.position == 'right',\r\n '!text-center': col.position == 'center',\r\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\r\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\r\n @if (rowData[col.id]) {\r\n <div>{{ rowData[col.id].value | date: (getOption(col, rowData, 'mode') == 'year' ? 'yyyy' : getOption(col, rowData, 'mode') == 'month' ? 'MM/yyyy' : 'dd/MM/yyyy') }}</div>\r\n }\r\n </td>\r\n }\r\n <!-- MultiSelect -->\r\n @if (!col.invisible && checkType('MultiSelect', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly) {\r\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [ngClass]=\"{\r\n '!text-left': col.position == 'left' || col.position == null,\r\n '!text-right': col.position == 'right',\r\n '!text-center': col.position == 'center',\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\"\r\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\r\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : getMultiSelectConcat(rowData[col.id].value, getOption(col, rowData, 'optionLabel'))\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\"\r\n class=\"paddingCell\">\r\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\r\n @if (rowData[col.id] != null) {\r\n <p-multiSelect [options]=\"getOption(col, rowData, 'options')\"\r\n [filter]=\"getOption(col, rowData, 'filter')\"\r\n [optionLabel]=\"getOption(col, rowData, 'optionLabel')\"\r\n [(ngModel)]=\"rowData[col.id].value\"\r\n name=\"multiselect\"\r\n appendTo=\"body\"\r\n dataKey=\"ID\"\r\n emptyFilterMessage=\"Aucun r\u00E9sultat\"\r\n emptyMessage=\"Aucun r\u00E9sultat\"\r\n [virtualScroll]=\"getOption(col, rowData, 'virtualScroll')\"\r\n [readonly]=\"rowData.readonly || rowData[col.id]?.readonly || !isModeEdition()\"\r\n [virtualScrollItemSize]=\"30\"\r\n selectedItemsLabel=\"{0} selectionn\u00E9s\"\r\n (onChange)=\"editMultiselect(rowData, col, $event)\"\r\n [showToggleAll]=\"false\"\r\n [showHeader]=\"getOption(col, rowData, 'filter')\"\r\n [group]=\"getOption(col, rowData, 'optionGroupChildren') != null ? true : false\"\r\n [optionGroupLabel]=\"getOption(col, rowData, 'optionGroupLabel')\"\r\n [optionGroupChildren]=\"getOption(col, rowData, 'optionGroupChildren')\"\r\n ngDefaultControl>\r\n <ng-template let-data pTemplate=\"selectedItems\">\r\n @for (option of data; track option; let i = $index) {\r\n <span [ngClass]=\"{\r\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\r\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true\r\n }\">\r\n {{ option[getOption(col, rowData, 'optionLabel')] + (i != data.length - 1 ? ',' : '') }}\r\n </span>\r\n }\r\n </ng-template>\r\n <ng-template let-group pTemplate=\"group\">\r\n <div>{{group[col.options.optionGroupLabel]}}</div>\r\n </ng-template>\r\n </p-multiSelect>\r\n }\r\n </td>\r\n }\r\n @if (!col.invisible && checkType('MultiSelect', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())) {\r\n <td [ngStyle]=\"{\r\n 'width' : col.width ? col.width : null,\r\n 'background-color': rowData[col.id].color ? rowData[col.id].color : null,\r\n 'color' : rowData[col.id].textColor ? rowData[col.id].textColor : null\r\n }\"\r\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : getMultiSelectConcat(rowData[col.id].value, getOption(col, rowData, 'optionLabel'))\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\"\r\n [ngClass]=\"{\r\n 'paddingCell': rowData[col.id] != null,\r\n '!text-left': col.position == 'left' || col.position == null,\r\n '!text-right': col.position == 'right',\r\n '!text-center': col.position == 'center',\r\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\r\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\r\n @if (rowData[col.id]) {\r\n <div>{{ getMultiSelectConcat(rowData[col.id].value, getOption(col, rowData, 'optionLabel')) }}</div>\r\n }\r\n </td>\r\n }\r\n <!-- Image -->\r\n @if (!col.invisible && checkType('Image', col)) {\r\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [ngClass]=\"{\r\n 'paddingCell': rowData[col.id] != null,\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\"\r\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\r\n class=\"!text-center\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\r\n @if (rowData[col.id]) {\r\n <img style=\"vertical-align: middle; width: 40px;\" src=\"{{ rowData[col.id].value }}\" />\r\n }\r\n </td>\r\n }\r\n <!-- Button -->\r\n @if (!col.invisible && checkType('Button', col)) {\r\n <td class=\"paddingCell !text-center\"\r\n [ngClass]=\"{\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\"\r\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\r\n [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\">\r\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\r\n @if (rowData[col.id].value != null && isValueButtonByType(rowData[col.id].value, 'function')) {\r\n <button pButton\r\n [disabled]=\"rowData.readonly || rowData[col.id]?.readonly\"\r\n [label]=\"getOption(col, rowData, 'label')\"\r\n [icon]=\"getOption(col, rowData, 'icon')\"\r\n (click)=\"rowData[col.id].value()\"\r\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : getOption(col, rowData, 'label')\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n [class]=\"'p-button-' + getOption(col, rowData, 'severity')\"\r\n [ngClass]=\"{\r\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\r\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true\r\n }\">\r\n </button>\r\n }\r\n @if (isValueButtonByType(rowData[col.id].value, 'string')) {\r\n <div [ngClass]=\"{\r\n 'paddingCell': rowData[col.id] != null,\r\n '!text-left': col.position == 'left' || col.position == null,\r\n '!text-right': col.position == 'right',\r\n '!text-center': col.position == 'center',\r\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\r\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true\r\n }\"\r\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value\"\r\n [tooltipDisabled]=\"!col.tooltip\">\r\n {{ rowData[col.id].value }}\r\n </div>\r\n }\r\n </td>\r\n }\r\n <!-- SelectButton -->\r\n @if (!col.invisible && checkType('SelectButton', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly) {\r\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [ngClass]=\"{\r\n 'paddingCell': rowData[col.id] != null,\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\"\r\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\r\n @if (rowData[col.id] != null) {\r\n <p-selectButton [options]=\"getOption(col, rowData, 'options')\"\r\n [optionLabel]=\"getOption(col, rowData, 'optionLabel')\"\r\n [optionValue]=\"getOption(col, rowData, 'optionValue') != null ? getOption(col, rowData, 'optionValue') : 'value'\"\r\n [(ngModel)]=\"rowData[col.id].value\"\r\n name=\"select-button\"\r\n [disabled]=\"rowData.readonly || rowData[col.id]?.readonly || !isModeEdition()\"\r\n (onChange)=\"onEditCell(rowData, col, rowData[col.id].value)\">\r\n <ng-template let-item pTemplate=\"item\">\r\n <span class=\"!text-center w-full\"\r\n [ngClass]=\"{\r\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\r\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true\r\n }\">\r\n {{ item.label }}\r\n </span>\r\n </ng-template>\r\n </p-selectButton>\r\n }\r\n </td>\r\n }\r\n @if (!col.invisible && checkType('SelectButton', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())) {\r\n <td [ngStyle]=\"{\r\n 'width' : col.width ? col.width : null,\r\n 'background-color': rowData[col.id].color ? rowData[col.id].color : null,\r\n 'color' : rowData[col.id].textColor ? rowData[col.id].textColor : null\r\n }\"\r\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\"\r\n class=\"!text-center\"\r\n [ngClass]=\"{\r\n 'paddingCell': rowData[col.id] != null,\r\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\r\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\">\r\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\r\n @if (rowData[col.id]) {\r\n <div>{{ getSelectLibelleByValue(rowData, col) }}</div>\r\n }\r\n </td>\r\n }\r\n <!-- Switch -->\r\n @if (!col.invisible && checkType('Switch', col)) {\r\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\r\n class=\"!text-center\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [ngClass]=\"{\r\n 'paddingCell': rowData[col.id] != null,\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\"\r\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\r\n @if (rowData[col.id] != null) {\r\n <p-toggleswitch [(ngModel)]=\"rowData[col.id].value\"\r\n name=\"toggle-switch\"\r\n [disabled]=\"rowData.readonly || rowData[col.id]?.readonly || (getOption(col, rowData, 'action') == null && !isModeEdition())\"\r\n (onChange)=\"onEditCell(rowData, col, rowData[col.id].value)\"\r\n ngDefaultControl>\r\n </p-toggleswitch>\r\n }\r\n </td>\r\n }\r\n <!-- File -->\r\n @if (!col.invisible && checkType('File', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly) {\r\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [ngClass]=\"{\r\n 'paddingCell': rowData[col.id] != null,\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\"\r\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\r\n @if (rowData[col.id] != null) {\r\n <div class=\"p-inputgroup\">\r\n <button type=\"button\"\r\n pButton\r\n pRipple\r\n icon=\"pi pi-upload\"\r\n (click)=\"clickById('input_' + rowData[col.id].id)\"\r\n [disabled]=\"rowData.readonly || rowData[col.id]?.readonly || !isModeEdition()\">\r\n </button>\r\n <input id=\"{{'output_' + rowData[col.id].id}}\"\r\n pInputText\r\n type=\"text\"\r\n [ngClass]=\"{\r\n '!text-left': col.position == 'left' || col.position == null,\r\n '!text-right': col.position == 'right',\r\n '!text-center': col.position == 'center',\r\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\r\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true\r\n }\"\r\n value=\"{{ rowData[col.id].value != null ? rowData[col.id].value : '' }}\"\r\n readonly\r\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value ? rowData[col.id].value : ''\"\r\n [tooltipDisabled]=\"!col.tooltip\">\r\n @if (getOption(col, rowData, 'downloadPath') && rowData[col.id].value != null) {\r\n <button type=\"button\"\r\n pButton\r\n pRipple\r\n icon=\"pi pi-download\"\r\n (click)=\"downloadFile(rowData[col.id])\"\r\n [disabled]=\"rowData.readonly || rowData[col.id]?.readonly || !isModeEdition()\">\r\n </button>\r\n }\r\n </div>\r\n }\r\n @if (rowData[col.id]) {\r\n <input id=\"{{'input_' + rowData[col.id].id}}\" #inputFile pInputText type=\"file\" hidden (change)=\"rowData[col.id].value = inputFile.files[0].name; onEditCell(rowData, col, inputFile.files[0])\">\r\n }\r\n </td>\r\n }\r\n @if (!col.invisible && checkType('File', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())) {\r\n <td [ngStyle]=\"{\r\n 'width' : col.width ? col.width : null,\r\n 'background-color': rowData[col.id].color ? rowData[col.id].color : null,\r\n 'color' : rowData[col.id].textColor ? rowData[col.id].textColor : null\r\n }\"\r\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value ? rowData[col.id].value : ''\"\r\n [ngClass]=\"{\r\n 'paddingCell': rowData[col.id] != null,\r\n '!text-left': col.position == 'left' || col.position == null,\r\n '!text-right': col.position == 'right',\r\n '!text-center': col.position == 'center',\r\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\r\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\r\n @if (rowData[col.id]) {\r\n <div>{{ rowData[col.id].value ? rowData[col.id].value : '' }}</div>\r\n }\r\n </td>\r\n }\r\n <!-- State -->\r\n @if (!col.invisible && checkType('State', col)) {\r\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [ngClass]=\"{\r\n 'paddingCell': rowData[col.id] != null,\r\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\r\n }\"\r\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\r\n class=\"!text-center\"\r\n pFrozenColumn\r\n [frozen]=\"col.frozen\">\r\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\r\n @if (rowData[col.id].value != null) {\r\n <p-tag [value]=\"rowData[col.id].value[getOption(col, rowData, 'optionLabel')]\"\r\n [severity]=\"rowData[col.id].value.severity\"\r\n [icon]=\"rowData[col.id].value.icon\"\r\n [style]=\"{\r\n 'background-color': rowData[col.id].value.backgroundColor,\r\n 'color': rowData[col.id].value.textColor,\r\n 'font-weight': rowData.bold == true || rowData[col.id].bold == true ? 'bold' : null,\r\n 'font-style': rowData.italic == true || rowData[col.id].italic == true ? 'italic' : null\r\n }\">\r\n </p-tag>\r\n }\r\n </td>\r\n }\r\n }\r\n\r\n <!-- Deletion -->\r\n @if (options.rowsDeletable) {\r\n <td class=\"cellDelete\"\r\n [ngClass]=\"rowData.deletable ? 'paddingCell' : null\">\r\n @if (rowData.deletable) {\r\n <button pButton\r\n type=\"button\"\r\n icon=\"pi pi-times\"\r\n class=\"p-button-danger buttonDelete p-button-text\"\r\n [disabled]=\"rowData.readonly\"\r\n (click)=\"onDeleteLine(rowData)\">\r\n </button>\r\n }\r\n </td>\r\n }\r\n\r\n </tr>\r\n </ng-template>\r\n </p-table>\r\n</div>\r\n", styles: ["::ng-deep .p-tooltip .p-tooltip-text{overflow-wrap:break-word!important}:host ::ng-deep .p-toggleswitch.p-toggleswitch-checked.p-disabled .p-toggleswitch-slider{background:#abd9ba!important}:host ::ng-deep .grid_brown .rowHeader>th{background-color:#795548}:host ::ng-deep .grid_brown .rowHeader>th div{color:#fff}:host ::ng-deep .grid_brown .rowHeader>th i{color:#fff}:host ::ng-deep .grid_brown .rowHeader .p-sortable-column:hover{background-color:#a47767}:host ::ng-deep .grid_brown .rowHeader .p-sortable-column:hover i{color:#fff}:host ::ng-deep .grid_brown .rowHeader .p-sortable-column.p-highlight div{color:#76c7ff}:host ::ng-deep .grid_brown .rowHeader .p-sortable-column.p-highlight .p-sortable-column-icon{color:#76c7ff}:host ::ng-deep .grid_brown .rowFilter th{background-color:#795548}:host ::ng-deep .grid_grey .rowHeader>th{background-color:#dedddd}:host ::ng-deep .grid_grey .rowHeader>th div{color:#495057}:host ::ng-deep .grid_grey .rowHeader>th i{color:#495057}:host ::ng-deep .grid_grey .rowHeader .p-sortable-column:hover{background-color:#e7e7e7}:host ::ng-deep .grid_grey .rowHeader .p-sortable-column:hover i{color:#495057}:host ::ng-deep .grid_grey .rowHeader .p-sortable-column.p-highlight div{color:#008bff}:host ::ng-deep .grid_grey .rowHeader .p-sortable-column.p-highlight .p-sortable-column-icon{color:#008bff}:host ::ng-deep .grid_grey .rowFilter th{background-color:#dedddd}:host ::ng-deep .selectable_cell:hover{background:#dcdcdc!important;cursor:pointer!important}:host ::ng-deep .p-frozen-column{z-index:2!important}:host ::ng-deep .p-datatable-thead{z-index:3!important}:host ::ng-deep .p-checkbox{border-radius:inherit!important}:host ::ng-deep p-inputnumber{width:100%}:host ::ng-deep .p-calendar,:host ::ng-deep .p-inputtext,:host ::ng-deep .p-inputnumber,:host ::ng-deep .p-inputnumber-input,:host ::ng-deep .p-dropdown,:host ::ng-deep .p-multiselect{width:100%}:host ::ng-deep .suffixe,:host ::ng-deep .prefixe{height:25px;padding-top:1px!important}:host ::ng-deep .p-multiselect-label-container,:host ::ng-deep .p-dropdown-label{width:1px!important}:host ::ng-deep .p-scroller-content{min-height:50%}:host ::ng-deep .rowTotal>th{background-color:#edcbaa!important}:host ::ng-deep .rowGrouping{background:#faeada!important}:host ::ng-deep .p-inputswitch.p-inputswitch-checked .p-inputswitch-slider{background:#30e130}:host ::ng-deep .p-inputswitch.p-inputswitch-checked:not(.p-disabled):hover .p-inputswitch-slider{background:#2bd12b}:host ::ng-deep .p-datatable-table{table-layout:fixed}:host ::ng-deep .p-datatable-thead>tr>th{border:1px solid rgba(0,0,0,.12)!important;padding:8px;font-weight:600;height:40px}:host ::ng-deep .headerAffichageSimple div{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host ::ng-deep .headerAffichageEntier{word-wrap:break-word}:host ::ng-deep .p-datatable-tbody>tr>td{border:1px solid rgba(0,0,0,.12)!important;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host ::ng-deep .p-datatable-tbody>tr>td div{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host ::ng-deep .p-tag{max-width:100%}:host ::ng-deep .p-tag .p-tag-value{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host ::ng-deep .p-button{padding:5px;max-width:100%}:host ::ng-deep .p-button .p-button-label{overflow:hidden!important;white-space:nowrap!important;text-overflow:ellipsis!important}:host ::ng-deep .text_bold{font-weight:700!important}:host ::ng-deep .cellDelete{flex:0 0 50px!important;width:50px;text-align:center!important;padding:0!important}:host ::ng-deep .p-tooltip .p-tooltip-text{background-color:red!important}:host ::ng-deep .p-skeleton{background-color:#dee2e6;border-radius:6px;padding:0}:host ::ng-deep .p-datatable-tbody>tr{height:35px}:host ::ng-deep .p-inputtext{height:25px!important;padding:4px 5px!important}:host ::ng-deep .p-inputnumber{height:25px;padding:0!important}:host ::ng-deep .p-inputnumber-input{padding:0 5px!important}:host ::ng-deep .p-inputgroup .p-inputtext{height:25px;padding:4px 5px!important}:host ::ng-deep .p-dropdown,:host ::ng-deep .p-multiselect{vertical-align:middle}:host ::ng-deep .p-dropdown-label{padding-top:2px;padding-bottom:2px}:host ::ng-deep .p-multiselect-label{padding-top:2px;padding-bottom:2px}:host ::ng-deep .p-editable-column{padding:3px 10px!important}:host ::ng-deep .paddingCell{padding:3px 10px!important}:host ::ng-deep .p-selectbutton>.p-button{width:50%;height:25px}:host ::ng-deep .p-inputgroup>.p-button{height:25px}:host ::ng-deep .buttonDelete{width:100%;height:20px}:host ::ng-deep .p-column-title{display:none}:host ::ng-deep .p-datatable-loading-icon{color:#fff}\n"] }]
1321
- }], ctorParameters: () => [{ type: i1.ConfirmationService }, { type: i1.FilterService }, { type: i0.ChangeDetectorRef }, { type: ExportService }], propDecorators: { columns: [{
1298
+ ], template: "<div class=\"!relative\"\n [ngStyle]=\"{ 'height': options.scrollHeight != null ? options.scrollHeight : '100%' }\">\n\n @if (options.exportExcel) {\n <button pButton\n icon=\"pi pi-file-excel\"\n class=\"p-button-success !z-5 !absolute !top-0 !left-0 !w-5 !h-5 !rounded-tl-none !rounded-tr-none !rounded-bl-none\"\n pTooltip=\"Exporter le contenu de la grille au format Excel\"\n tooltipPosition=\"right\"\n (click)=\"exportExcel(options.exportExcelByFiltre, !options.exportExcelNoColors)\">\n </button>\n }\n\n <p-contextMenu #cm [model]=\"options.contextMenuItems\" />\n\n <p-table #table\n [columns]=\"columns\"\n [value]=\"values\"\n dataKey=\"id\"\n [selectionMode]=\"getModeSelection()\"\n [metaKeySelection]=\"isModeMetakeySelection()\"\n [(selection)]=\"selectedRows\"\n (onRowSelect)=\"onSelectRow($event)\"\n (onRowUnselect)=\"onUnselectRow($event)\"\n (onHeaderCheckboxToggle)=\"onSelectAll($event)\"\n (sortFunction)=\"sortGrille($event)\"\n [customSort]=\"options.grouping == null ? true : false\"\n [scrollable]=\"true\"\n [loading]=\"loading\"\n [scrollHeight]=\"'flex'\"\n [rowGroupMode]=\"options.grouping != null ? 'subheader' : null\"\n [groupRowsBy]=\"options.grouping != null ? options.grouping.obj + '.' + options.grouping.id : null\"\n [groupRowsByOrder]=\"0\"\n [virtualScroll]=\"options.virtualScroll == true && options.scrollHeight != null ? true : false\"\n [virtualScrollItemSize]=\"options.virtualScrollItemSize != null ? options.virtualScrollItemSize : 35\"\n [paginator]=\"options.paginator == null ? false : true\"\n [rows]=\"options.paginatorRows\"\n (onPage)=\"onPageTable($event)\"\n [tableStyleClass]=\"!options.themeGrille ? 'grid_grey' : options.themeGrille\"\n [lazy]=\"options.lazy == true ? true : false\"\n (onFilter)=\"onFilterTable($event)\"\n [rowTrackBy]=\"trackByFunction\"\n [(contextMenuSelection)]=\"contextMenuSelectedItem\"\n [contextMenu]=\"cm\">\n\n <!-- HEADER -->\n <ng-template pTemplate=\"header\" let-columns>\n\n <!-- HEADERS -->\n <tr class=\"rowHeader\">\n @if (isModeCheckboxSelection()) {\n <th class=\"cellDelete\"\n pFrozenColumn>\n @if (!options.filterable && options.toggleAll) {\n <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\n }\n </th>\n }\n @for (col of columns; track col) {\n @if (!col.invisible) {\n <th [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': col.backgroundColor ? col.backgroundColor : null }\"\n [ngClass]=\"{ '!text-center' : options.centerHeaders, 'headerAffichageSimple': !options.headersAffichageEntier, 'headerAffichageEntier': options.headersAffichageEntier }\"\n [pSortableColumn]=\"col.id\"\n [pSortableColumnDisabled]=\"!options.sortable || options.grouping != null || col.libelle == null || col.libelle == ''\"\n id=\"{{ col.id }}\"\n (click)=\"refreshData()\"\n pFrozenColumn\n [frozen]=\"col.frozen\"\n [pTooltip]=\"col.libelle\"\n [tooltipDisabled]=\"!col.tooltipHeader\"\n tooltipPosition=\"bottom\">\n <div [ngStyle]=\"{ 'color': col.textColor ? col.textColor : null }\">\n {{ col.libelle }}\n </div>\n @if (options.sortable && options.grouping == null && col.libelle != null && col.libelle != '') {\n <p-sortIcon [field]=\"col.id\">\n </p-sortIcon>\n }\n </th>\n }\n }\n @if (options.rowsDeletable) {\n <th class=\"cellDelete\"></th>\n }\n </tr>\n\n <!-- FILTRES -->\n @if (options.filterable) {\n <tr class=\"rowFilter\">\n @if (isModeCheckboxSelection()) {\n <th class=\"cellDelete\"\n pFrozenColumn>\n @if (options.toggleAll) {\n <p-tableHeaderCheckbox></p-tableHeaderCheckbox>\n }\n </th>\n }\n @for (col of columns; track col) {\n <!-- Text -->\n @if (!col.invisible && ((checkType('Dropdown', col) && col.options.filterText)\n || (checkType('MultiSelect', col) && col.options.filterText)\n || checkType('Text', col)\n || checkType('File', col)\n || (checkType('Button', col) && col.options.filterCol))\n || checkType('Number', col)\n || checkType('CilogNumber', col)) {\n <th [ngStyle]=\"{ 'width' : col.width ? col.width : null }\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n @if (!col.disableFilter) {\n <input pInputText\n type=\"text\"\n (input)=\"onFilterCol($event, col)\"\n name=\"filterText\"\n [(ngModel)]=\"col.options.defaultFilters\">\n }\n </th>\n }\n <!-- Date -->\n @if (!col.invisible && checkType('Date', col)) {\n <th [ngStyle]=\"{ 'width' : col.width ? col.width : null }\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n @if (!col.disableFilter) {\n <p-datepicker [view]=\"col.options.mode == null ? 'date' : col.options.mode\"\n [dateFormat]=\"col.options.mode == 'year' ? 'yy' : col.options.mode == 'month' ? 'mm/yy' : 'dd/mm/yy'\"\n [inputId]=\"col.id + '_filter'\"\n [firstDayOfWeek]=\"1\"\n [readonlyInput]=\"true\"\n appendTo=\"body\"\n selectionMode=\"range\"\n (onSelect)=\"onFilterCol($event, col)\"\n showButtonBar=\"true\"\n (onClearClick)=\"onFilterCol($event, col)\"\n name=\"filterDate\"\n [(ngModel)]=\"col.options.defaultFilters\">\n </p-datepicker>\n }\n </th>\n }\n <!-- Liste -->\n @if (!col.invisible && ((checkType('Dropdown', col) && !col.options.filterText) || (checkType('MultiSelect', col) && !col.options.filterText) || checkType('SelectButton', col) || checkType('State', col))) {\n <th [ngStyle]=\"{ 'width' : col.width ? col.width : null }\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n @if (!col.disableFilter) {\n <p-multiSelect [options]=\"col.options?.options\"\n [filter]=\"true\"\n dataKey=\"ID\"\n [optionLabel]=\"col.options?.optionLabel\"\n appendTo=\"body\"\n emptyFilterMessage=\"Aucun r\u00E9sultat\"\n emptyMessage=\"Aucun r\u00E9sultat\"\n [virtualScroll]=\"true\"\n [virtualScrollItemSize]=\"35\"\n selectedItemsLabel=\"{0} selectionn\u00E9s\"\n (onChange)=\"onFilterCol($event, col)\"\n name=\"filterChoix\"\n [(ngModel)]=\"col.options.defaultFilters\"\n [group]=\"col.options.optionGroupChildren != null ? true : false\"\n [optionGroupLabel]=\"col.options.optionGroupLabel\"\n [optionGroupChildren]=\"col.options.optionGroupChildren\"\n [showToggleAll]=\"false\"\n [showClear]=\"true\"\n (onClear)=\"onFilterCol(null, col)\">\n <ng-template let-group pTemplate=\"group\">\n <div>{{group[col.options.optionGroupLabel]}}</div>\n </ng-template>\n </p-multiSelect>\n }\n </th>\n }\n <!-- Switch -->\n @if (!col.invisible && checkType('Switch', col)) {\n <th [ngStyle]=\"{ 'width' : col.width ? col.width : null }\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n @if (!col.disableFilter) {\n <p-multiSelect [options]=\"optionsSwitch\"\n [showHeader]=\"false\"\n optionLabel=\"label\"\n optionValue=\"value\"\n appendTo=\"body\"\n emptyFilterMessage=\"Aucun r\u00E9sultat\"\n emptyMessage=\"Aucun r\u00E9sultat\"\n [virtualScrollItemSize]=\"30\"\n selectedItemsLabel=\"{0} selectionn\u00E9s\"\n (onChange)=\"onFilterCol($event, col)\"\n name=\"filterChoix2\"\n [(ngModel)]=\"col.options.defaultFilters\">\n </p-multiSelect>\n }\n </th>\n }\n <!-- Non filtrable -->\n @if (!col.invisible && (checkType('Image', col) || (checkType('Button', col) && !col.options.filterCol))) {\n <th [ngStyle]=\"{ 'width' : col.width ? col.width : null }\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n </th>\n }\n }\n @if (options.rowsDeletable) {\n <th class=\"cellDelete\"></th>\n }\n </tr>\n }\n\n <!-- TOTAL -->\n @if (options.rowTotal) {\n <tr class=\"rowTotal\">\n @if (isModeCheckboxSelection()) {\n <th class=\"cellDelete\"\n pFrozenColumn>\n </th>\n }\n @for (col of columns; track col) {\n @if (!col.invisible) {\n <th [ngStyle]=\"{ 'width' : col.width ? col.width : null }\"\n [ngClass]=\"{ '!text-center' : true }\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n <div>{{ getTotalStr(col) }}</div>\n </th>\n }\n }\n @if (options.rowsDeletable) {\n <th class=\"cellDelete\"></th>\n }\n </tr>\n }\n </ng-template>\n\n <!--Groupheader-->\n <ng-template pTemplate=\"groupheader\" let-rowData>\n <tr pRowGroupHeader class=\"rowGrouping\">\n <td [attr.colspan]=\"columns.length\">\n <div class=\"text_bold\">{{ rowData[options.grouping.obj][options.grouping.libelle] }}</div>\n </td>\n </tr>\n </ng-template>\n\n <!-- Body -->\n <ng-template pTemplate=\"body\" let-rowData let-columns=\"columns\">\n <tr id=\"{{ rowData.id }}\"\n [ngStyle]=\"{ 'background-color': rowData.color ? rowData.color : null }\"\n [pSelectableRow]=\"rowData\"\n [pSelectableRowDisabled]=\"!options.selectable || isModeCheckboxSelection() || isModeCellSelection()\"\n (dblclick)=\"onRowDoubleClickEvent(rowData)\"\n [pContextMenuRow]=\"rowData\"\n [pContextMenuRowDisabled]=\"options.contextMenuItems == null\">\n\n @if (isModeCheckboxSelection()) {\n <td class=\"cellDelete\"\n pFrozenColumn>\n <p-tableCheckbox [value]=\"rowData\" [disabled]=\"rowData.readonly\"></p-tableCheckbox>\n </td>\n }\n\n @for (col of columns; track col) {\n <!-- Text -->\n @if (!col.invisible && checkType('Text', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly) {\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\n [pEditableColumn]=\"rowData\"\n [pEditableColumnField]=\"col.id\"\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value\"\n [tooltipDisabled]=\"!col.tooltip\"\n tooltipPosition=\"bottom\"\n pFrozenColumn\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\n [frozen]=\"col.frozen\"\n [ngClass]=\"{\n '!text-left': col.position == 'left' || col.position == null,\n '!text-right': col.position == 'right',\n '!text-center': col.position == 'center',\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\">\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\n <p-cellEditor>\n <ng-template pTemplate=\"input\">\n <input pInputText\n type=\"text\"\n [(ngModel)]=\"rowData[col.id].value\"\n name=\"text\"\n (blur)=\"onEditCell(rowData, col, rowData[col.id].value)\"\n (keydown.enter)=\"onEditCell(rowData, col, rowData[col.id].value)\"\n (keydown.tab)=\"onEditCell(rowData, col, rowData[col.id].value)\"\n (click)=\"onEditInitCell(rowData, col, rowData[col.id].value)\"\n [ngClass]=\"{\n '!text-left': col.position == 'left' || col.position == null,\n '!text-right': col.position == 'right',\n '!text-center': col.position == 'center',\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true\n }\" />\n </ng-template>\n <ng-template pTemplate=\"output\">\n @if (rowData[col.id]) {\n <div style=\"white-space: pre;\">\n {{ getFormattedText(col, rowData) }}\n </div>\n }\n </ng-template>\n </p-cellEditor>\n </td>\n }\n @if (!col.invisible && checkType('Text', col) && (!isModeEdition() || rowData.readonly || rowData[col.id]?.readonly)) {\n <td [ngStyle]=\"{\n 'width' : col.width ? col.width : null,\n 'background-color' : rowData[col.id].color ? rowData[col.id].color : null,\n 'color' : rowData[col.id].textColor ? rowData[col.id].textColor : null\n }\"\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value\"\n [tooltipDisabled]=\"!col.tooltip\"\n tooltipPosition=\"bottom\"\n [ngClass]=\"{\n 'paddingCell': rowData[col.id] != null,\n '!text-left': col.position == 'left' || col.position == null,\n '!text-right': col.position == 'right',\n '!text-center': col.position == 'center',\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n <div class=\"p-column-title\">\n {{ col.libelle }} :\n </div>\n @if (rowData[col.id]) {\n <div style=\"white-space: pre;\">\n {{ getFormattedText(col, rowData) }}\n </div>\n }\n </td>\n }\n <!-- Dropdown -->\n @if (!col.invisible && checkType('Dropdown', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly) {\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\n [ngClass]=\"{\n '!text-left': col.position == 'left' || col.position == null,\n '!text-right': col.position == 'right',\n '!text-center': col.position == 'center',\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\"\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value != null ? rowData[col.id].value[getOption(col, rowData, 'optionLabel')] : ''\"\n [tooltipDisabled]=\"!col.tooltip\"\n tooltipPosition=\"bottom\"\n pFrozenColumn\n [frozen]=\"col.frozen\"\n class=\"paddingCell\">\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\n @if (rowData[col.id] != null) {\n <p-select dataKey=\"ID\"\n [options]=\"getOption(col, rowData, 'options')\"\n [filter]=\"getOption(col, rowData, 'filter')\"\n [optionLabel]=\"getOption(col, rowData, 'optionLabel')\"\n [(ngModel)]=\"rowData[col.id].value\"\n name=\"select\"\n appendTo=\"body\"\n [showClear]=\"getOption(col, rowData, 'deletable')\"\n emptyFilterMessage=\"Aucun r\u00E9sultat\"\n emptyMessage=\"Aucun r\u00E9sultat\"\n [virtualScroll]=\"getOption(col, rowData, 'virtualScroll')\"\n [readonly]=\"rowData.readonly || rowData[col.id]?.readonly\"\n [virtualScrollItemSize]=\"30\"\n (onChange)=\"onEditCell(rowData, col, rowData[col.id].value)\"\n (onClear)=\"onEditCell(rowData, col, rowData[col.id].value)\">\n <ng-template let-data pTemplate=\"selectedItem\">\n @if (data != null) {\n <span [ngClass]=\"{\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true\n }\">\n {{ data[getOption(col, rowData, 'optionLabel')] }}\n </span>\n }\n @if (data == null) {\n <span></span>\n }\n </ng-template>\n </p-select>\n }\n </td>\n }\n @if (!col.invisible && checkType('Dropdown', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())) {\n <td [ngStyle]=\"{\n 'width' : col.width ? col.width : null,\n 'background-color': rowData[col.id].color ? rowData[col.id].color : null,\n 'color' : rowData[col.id].textColor ? rowData[col.id].textColor : null\n }\"\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value != null ? rowData[col.id].value[getOption(col, rowData, 'optionLabel')] : ''\"\n [tooltipDisabled]=\"!col.tooltip\"\n tooltipPosition=\"bottom\"\n [ngClass]=\"{\n 'paddingCell': rowData[col.id] != null,\n '!text-left': col.position == 'left' || col.position == null,\n '!text-right': col.position == 'right',\n '!text-center': col.position == 'center',\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\n @if (rowData[col.id]) {\n <div>{{ rowData[col.id].value != null ? rowData[col.id].value[getOption(col, rowData, 'optionLabel')] : '' }}</div>\n }\n </td>\n }\n <!-- Cilog Number -->\n @if (!col.invisible && checkType('CilogNumber', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly) {\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\n [ngClass]=\"{\n 'paddingCell': rowData[col.id] != null,\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\"\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value | value\"\n [tooltipDisabled]=\"!col.tooltip\"\n tooltipPosition=\"bottom\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\n @if (rowData[col.id] && !rowData.readonly && !rowData[col.id]?.readonly) {\n <cilog-input-number (onInput)=\"onInputNumber($event)\"\n [(ngModel)]=\"rowData[col.id].value\"\n name=\"cilog-number\"\n ngDefaultControl\n [inputStyleClass]=\"col.position == null || col.position == 'right' ? '!text-right' : col.position == 'left' ? '!text-left' : '!text-center'\"\n [textColor]=\"rowData[col.id].textColor\"\n [bold]=\"rowData.bold == true || rowData[col.id].bold == true\"\n [italic]=\"rowData.italic == true || rowData[col.id].italic == true\"\n [suffixe]=\"getOption(col, rowData, 'suffix')\"\n [prefixe]=\"getOption(col, rowData, 'prefix') != null ? getOption(col, rowData, 'prefix') + ' ' : null\"\n [min]=\"getOption(col, rowData, 'min')\"\n [max]=\"getOption(col, rowData, 'max')\"\n [disabled]=\"rowData.readonly || rowData[col.id]?.readonly\"\n [maxDecimals]=\"getOption(col, rowData, 'modeInteger') != null && getOption(col, rowData, 'modeInteger') == true ? 0 : getOption(col, rowData, 'maxDecimales') != null ? getOption(col, rowData, 'maxDecimales') : 2 \"\n (onChange)=\"onEditCell(rowData, col, rowData[col.id].value)\"\n (onFocus)=\"onEditInitCell(rowData, col, rowData[col.id].value)\">\n </cilog-input-number>\n }\n </td>\n }\n @if (!col.invisible && checkType('CilogNumber', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())) {\n <td [ngStyle]=\"{\n 'width' : col.width ? col.width : null,\n 'background-color': rowData[col.id].color ? rowData[col.id].color : null,\n 'color' : rowData[col.id].textColor ? rowData[col.id].textColor : null\n }\"\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value | value\"\n [tooltipDisabled]=\"!col.tooltip\"\n tooltipPosition=\"bottom\"\n [ngClass]=\"{\n 'paddingCell': rowData[col.id] != null,\n '!text-left': col.position == 'left' || col.position == null,\n '!text-right': col.position == 'right',\n '!text-center': col.position == 'center',\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\n @if (rowData[col.id]) {\n <div>{{ getFormattedNumber(col, rowData, rowData[col.id].value) }}</div>\n }\n </td>\n }\n <!-- Number -->\n @if (!col.invisible && checkType('Number', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly) {\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value | value\"\n [tooltipDisabled]=\"!col.tooltip\"\n [ngClass]=\"{\n 'paddingCell': rowData[col.id] != null,\n '!text-left': col.position == 'left',\n '!text-right': col.position == 'right' || col.position == null,\n '!text-center': col.position == 'center',\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\"\n tooltipPosition=\"bottom\"\n pFrozenColumn\n [frozen]=\"col.frozen\"\n (click)=\"onClickCellNumber(rowData, col)\">\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\n @if (rowData[col.id] && !rowData[col.id].focus) {\n <div>\n {{ getFormattedNumber(col, rowData, rowData[col.id].value) }}\n </div>\n }\n @if (rowData[col.id] && !rowData.readonly && !rowData[col.id]?.readonly && rowData[col.id].focus == true) {\n <p-inputNumber #inputNumber\n locale=\"fr-FR\"\n (onInput)=\"onInputNumber($event)\"\n [(ngModel)]=\"rowData[col.id].value\"\n name=\"input-number\"\n [showButtons]=\"getOption(col, rowData, 'showButtons')\"\n [inputStyleClass]=\"col.position == null || col.position == 'right' ? '!text-right' : col.position == 'left' ? '!text-left' : '!text-center'\"\n [inputStyle]=\"{ 'font-weight': rowData.bold == true || rowData[col.id].bold == true ? 'bold' : null, 'font-style': rowData.italic == true || rowData[col.id].italic == true ? 'italic' : null }\"\n [suffix]=\"getOption(col, rowData, 'suffix')\"\n [prefix]=\"getOption(col, rowData, 'prefix') != null ? getOption(col, rowData, 'prefix') + ' ' : null\"\n [min]=\"getOption(col, rowData, 'min')\"\n [max]=\"getOption(col, rowData, 'max')\"\n [minFractionDigits]=\"getOption(col, rowData, 'modeInteger') != null && getOption(col, rowData, 'modeInteger') == true ? 0 : getOption(col, rowData, 'minDecimales') != null ? getOption(col, rowData, 'minDecimales') : 0\"\n [maxFractionDigits]=\"getOption(col, rowData, 'modeInteger') != null && getOption(col, rowData, 'modeInteger') == true ? 0 : getOption(col, rowData, 'maxDecimales') != null ? getOption(col, rowData, 'maxDecimales') : 2 \"\n (onBlur)=\"onEditCell(rowData, col, rowData[col.id].value)\"\n (onKeyDown)=\"onKeyDown($event, rowData, col, rowData[col.id].value)\"\n (onFocus)=\"onEditInitCell(rowData, col, rowData[col.id].value)\">\n </p-inputNumber>\n }\n </td>\n }\n @if (!col.invisible && checkType('Number', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())) {\n <td [ngStyle]=\"{\n 'width' : col.width ? col.width : null,\n 'background-color': rowData[col.id].color ? rowData[col.id].color : null,\n 'color' : rowData[col.id].textColor ? rowData[col.id].textColor : null\n }\"\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value | value\"\n [tooltipDisabled]=\"!col.tooltip\"\n tooltipPosition=\"bottom\"\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\n [ngClass]=\"{\n 'paddingCell': rowData[col.id] != null,\n '!text-left': col.position == 'left',\n '!text-right': col.position == 'right' || col.position == null,\n '!text-center': col.position == 'center',\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\n @if (rowData[col.id]) {\n <div>{{ getFormattedNumber(col, rowData, rowData[col.id].value) }}</div>\n }\n </td>\n }\n <!-- Date -->\n @if (!col.invisible && checkType('Date', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly) {\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\n [ngClass]=\"{\n 'paddingCell': rowData[col.id] != null,\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\"\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : getOption(col, rowData, 'mode') == 'year' ? (rowData[col.id].value | date: 'yyyy') : getOption(col, rowData, 'mode') == 'month' ? (rowData[col.id].value | date: 'MM/yy') : getOption(col, rowData, 'mode') == 'hour' ? (rowData[col.id].value | date: 'HH:mm') : getOption(col, rowData, 'mode') == 'datehour' ? (rowData[col.id].value | date: 'dd/MM/yy HH:mm') : (rowData[col.id].value | date: 'dd/MM/yyyy')\"\n [tooltipDisabled]=\"!col.tooltip\"\n tooltipPosition=\"bottom\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\n <p-datepicker [(ngModel)]=\"rowData[col.id].value\"\n name=\"date-picker\"\n [view]=\"getOption(col, rowData, 'mode') == null || getOption(col, rowData, 'mode') == 'date' || getOption(col, rowData, 'mode') == 'hour' ? 'date' : getOption(col, rowData, 'mode') == 'datehour' ? 'date' : getOption(col, rowData, 'mode')\"\n [dateFormat]=\"getOption(col, rowData, 'mode') == 'year' ? 'yy' : getOption(col, rowData, 'mode') == 'month' ? 'mm/yy' : getOption(col, rowData, 'mode') == 'hour' || getOption(col, rowData, 'mode') == 'datehour' ? 'dd/mm/yy' : 'dd/mm/yy'\"\n [showTime]=\"getOption(col, rowData, 'mode') == 'datehour'\"\n [timeOnly]=\"getOption(col, rowData, 'mode') == 'hour'\"\n [hourFormat]=\"'24'\"\n [firstDayOfWeek]=\"1\"\n (onSelect)=\"onEditCell(rowData, col, rowData[col.id].value)\"\n (onBlur)=\"onEditCell(rowData, col, rowData[col.id].value)\"\n (onClear)=\"onEditCell(rowData, col, rowData[col.id].value)\"\n [inputStyleClass]=\"col.position == null || col.position == 'right' ? '!text-right' : col.position == 'left' ? '!text-left' : '!text-center'\"\n [inputStyle]=\"{ 'font-weight': rowData.bold == true || rowData[col.id].bold == true ? 'bold' : null, 'font-style': rowData.italic == true || rowData[col.id].italic == true ? 'italic' : null }\"\n [showClear]=\"getOption(col, rowData, 'clear')\"\n [minDate]=\"getOption(col, rowData, 'minDate')\"\n [maxDate]=\"getOption(col, rowData, 'maxDate')\"\n [defaultDate]=\"getOption(col, rowData, 'defaultDate')\"\n appendTo=\"body\">\n </p-datepicker>\n </td>\n }\n @if (!col.invisible && checkType('Date', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())) {\n <td [ngStyle]=\"{\n 'min-width' : col.width ? col.width : null,\n 'background-color': rowData[col.id].color ? rowData[col.id].color : null,\n 'color' : rowData[col.id].textColor ? rowData[col.id].textColor : null\n }\"\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value | date: 'dd/MM/yyyy'\"\n [tooltipDisabled]=\"!col.tooltip\"\n tooltipPosition=\"bottom\"\n [ngClass]=\"{\n 'paddingCell': rowData[col.id] != null,\n '!text-left': col.position == 'left' || col.position == null,\n '!text-right': col.position == 'right',\n '!text-center': col.position == 'center',\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\n @if (rowData[col.id]) {\n <div>{{ rowData[col.id].value | date: (getOption(col, rowData, 'mode') == 'year' ? 'yyyy' : getOption(col, rowData, 'mode') == 'month' ? 'MM/yyyy' : 'dd/MM/yyyy') }}</div>\n }\n </td>\n }\n <!-- MultiSelect -->\n @if (!col.invisible && checkType('MultiSelect', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly) {\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\n [ngClass]=\"{\n '!text-left': col.position == 'left' || col.position == null,\n '!text-right': col.position == 'right',\n '!text-center': col.position == 'center',\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\"\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : getMultiSelectConcat(rowData[col.id].value, getOption(col, rowData, 'optionLabel'))\"\n [tooltipDisabled]=\"!col.tooltip\"\n tooltipPosition=\"bottom\"\n pFrozenColumn\n [frozen]=\"col.frozen\"\n class=\"paddingCell\">\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\n @if (rowData[col.id] != null) {\n <p-multiSelect [options]=\"getOption(col, rowData, 'options')\"\n [filter]=\"getOption(col, rowData, 'filter')\"\n [optionLabel]=\"getOption(col, rowData, 'optionLabel')\"\n [(ngModel)]=\"rowData[col.id].value\"\n name=\"multiselect\"\n appendTo=\"body\"\n dataKey=\"ID\"\n emptyFilterMessage=\"Aucun r\u00E9sultat\"\n emptyMessage=\"Aucun r\u00E9sultat\"\n [virtualScroll]=\"getOption(col, rowData, 'virtualScroll')\"\n [readonly]=\"rowData.readonly || rowData[col.id]?.readonly || !isModeEdition()\"\n [virtualScrollItemSize]=\"30\"\n selectedItemsLabel=\"{0} selectionn\u00E9s\"\n (onChange)=\"editMultiselect(rowData, col, $event)\"\n [showToggleAll]=\"false\"\n [showHeader]=\"getOption(col, rowData, 'filter')\"\n [group]=\"getOption(col, rowData, 'optionGroupChildren') != null ? true : false\"\n [optionGroupLabel]=\"getOption(col, rowData, 'optionGroupLabel')\"\n [optionGroupChildren]=\"getOption(col, rowData, 'optionGroupChildren')\"\n ngDefaultControl>\n <ng-template let-data pTemplate=\"selectedItems\">\n @for (option of data; track option; let i = $index) {\n <span [ngClass]=\"{\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true\n }\">\n {{ option[getOption(col, rowData, 'optionLabel')] + (i != data.length - 1 ? ',' : '') }}\n </span>\n }\n </ng-template>\n <ng-template let-group pTemplate=\"group\">\n <div>{{group[col.options.optionGroupLabel]}}</div>\n </ng-template>\n </p-multiSelect>\n }\n </td>\n }\n @if (!col.invisible && checkType('MultiSelect', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())) {\n <td [ngStyle]=\"{\n 'width' : col.width ? col.width : null,\n 'background-color': rowData[col.id].color ? rowData[col.id].color : null,\n 'color' : rowData[col.id].textColor ? rowData[col.id].textColor : null\n }\"\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : getMultiSelectConcat(rowData[col.id].value, getOption(col, rowData, 'optionLabel'))\"\n [tooltipDisabled]=\"!col.tooltip\"\n tooltipPosition=\"bottom\"\n [ngClass]=\"{\n 'paddingCell': rowData[col.id] != null,\n '!text-left': col.position == 'left' || col.position == null,\n '!text-right': col.position == 'right',\n '!text-center': col.position == 'center',\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\n @if (rowData[col.id]) {\n <div>{{ getMultiSelectConcat(rowData[col.id].value, getOption(col, rowData, 'optionLabel')) }}</div>\n }\n </td>\n }\n <!-- Image -->\n @if (!col.invisible && checkType('Image', col)) {\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\n [ngClass]=\"{\n 'paddingCell': rowData[col.id] != null,\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\"\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\n class=\"!text-center\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\n @if (rowData[col.id]) {\n <img style=\"vertical-align: middle; width: 40px;\" src=\"{{ rowData[col.id].value }}\" />\n }\n </td>\n }\n <!-- Button -->\n @if (!col.invisible && checkType('Button', col)) {\n <td class=\"paddingCell !text-center\"\n [ngClass]=\"{\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\"\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\n [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\">\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\n @if (rowData[col.id].value != null && isValueButtonByType(rowData[col.id].value, 'function')) {\n <button pButton\n [disabled]=\"rowData.readonly || rowData[col.id]?.readonly\"\n [label]=\"getOption(col, rowData, 'label')\"\n [icon]=\"getOption(col, rowData, 'icon')\"\n (click)=\"rowData[col.id].value()\"\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : getOption(col, rowData, 'label')\"\n [tooltipDisabled]=\"!col.tooltip\"\n [class]=\"'p-button-' + getOption(col, rowData, 'severity')\"\n [ngClass]=\"{\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true\n }\">\n </button>\n }\n @if (isValueButtonByType(rowData[col.id].value, 'string')) {\n <div [ngClass]=\"{\n 'paddingCell': rowData[col.id] != null,\n '!text-left': col.position == 'left' || col.position == null,\n '!text-right': col.position == 'right',\n '!text-center': col.position == 'center',\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true\n }\"\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value\"\n [tooltipDisabled]=\"!col.tooltip\">\n {{ rowData[col.id].value }}\n </div>\n }\n </td>\n }\n <!-- SelectButton -->\n @if (!col.invisible && checkType('SelectButton', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly) {\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\n [ngClass]=\"{\n 'paddingCell': rowData[col.id] != null,\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\"\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\n @if (rowData[col.id] != null) {\n <p-selectButton [options]=\"getOption(col, rowData, 'options')\"\n [optionLabel]=\"getOption(col, rowData, 'optionLabel')\"\n [optionValue]=\"getOption(col, rowData, 'optionValue') != null ? getOption(col, rowData, 'optionValue') : 'value'\"\n [(ngModel)]=\"rowData[col.id].value\"\n name=\"select-button\"\n [disabled]=\"rowData.readonly || rowData[col.id]?.readonly || !isModeEdition()\"\n (onChange)=\"onEditCell(rowData, col, rowData[col.id].value)\">\n <ng-template let-item pTemplate=\"item\">\n <span class=\"!text-center w-full\"\n [ngClass]=\"{\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true\n }\">\n {{ item.label }}\n </span>\n </ng-template>\n </p-selectButton>\n }\n </td>\n }\n @if (!col.invisible && checkType('SelectButton', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())) {\n <td [ngStyle]=\"{\n 'width' : col.width ? col.width : null,\n 'background-color': rowData[col.id].color ? rowData[col.id].color : null,\n 'color' : rowData[col.id].textColor ? rowData[col.id].textColor : null\n }\"\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\n pFrozenColumn\n [frozen]=\"col.frozen\"\n class=\"!text-center\"\n [ngClass]=\"{\n 'paddingCell': rowData[col.id] != null,\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\">\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\n @if (rowData[col.id]) {\n <div>{{ getSelectLibelleByValue(rowData, col) }}</div>\n }\n </td>\n }\n <!-- Switch -->\n @if (!col.invisible && checkType('Switch', col)) {\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\n class=\"!text-center\"\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\n [ngClass]=\"{\n 'paddingCell': rowData[col.id] != null,\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\"\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\n @if (rowData[col.id] != null) {\n <p-toggleswitch [(ngModel)]=\"rowData[col.id].value\"\n name=\"toggle-switch\"\n [disabled]=\"rowData.readonly || rowData[col.id]?.readonly || (getOption(col, rowData, 'action') == null && !isModeEdition())\"\n (onChange)=\"onEditCell(rowData, col, rowData[col.id].value)\"\n ngDefaultControl>\n </p-toggleswitch>\n }\n </td>\n }\n <!-- File -->\n @if (!col.invisible && checkType('File', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly) {\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\n [ngClass]=\"{\n 'paddingCell': rowData[col.id] != null,\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\"\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\n @if (rowData[col.id] != null) {\n <div class=\"p-inputgroup\">\n <button type=\"button\"\n pButton\n pRipple\n icon=\"pi pi-upload\"\n (click)=\"clickById('input_' + rowData[col.id].id)\"\n [disabled]=\"rowData.readonly || rowData[col.id]?.readonly || !isModeEdition()\">\n </button>\n <input id=\"{{'output_' + rowData[col.id].id}}\"\n pInputText\n type=\"text\"\n [ngClass]=\"{\n '!text-left': col.position == 'left' || col.position == null,\n '!text-right': col.position == 'right',\n '!text-center': col.position == 'center',\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true\n }\"\n value=\"{{ rowData[col.id].value != null ? rowData[col.id].value : '' }}\"\n readonly\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value ? rowData[col.id].value : ''\"\n [tooltipDisabled]=\"!col.tooltip\">\n @if (getOption(col, rowData, 'downloadPath') && rowData[col.id].value != null) {\n <button type=\"button\"\n pButton\n pRipple\n icon=\"pi pi-download\"\n (click)=\"downloadFile(rowData[col.id])\"\n [disabled]=\"rowData.readonly || rowData[col.id]?.readonly || !isModeEdition()\">\n </button>\n }\n </div>\n }\n @if (rowData[col.id]) {\n <input id=\"{{'input_' + rowData[col.id].id}}\" #inputFile pInputText type=\"file\" hidden (change)=\"rowData[col.id].value = inputFile.files[0].name; onEditCell(rowData, col, inputFile.files[0])\">\n }\n </td>\n }\n @if (!col.invisible && checkType('File', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())) {\n <td [ngStyle]=\"{\n 'width' : col.width ? col.width : null,\n 'background-color': rowData[col.id].color ? rowData[col.id].color : null,\n 'color' : rowData[col.id].textColor ? rowData[col.id].textColor : null\n }\"\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\n [pTooltip]=\"rowData[col.id].tooltip != null ? rowData[col.id].tooltip : rowData[col.id].value ? rowData[col.id].value : ''\"\n [ngClass]=\"{\n 'paddingCell': rowData[col.id] != null,\n '!text-left': col.position == 'left' || col.position == null,\n '!text-right': col.position == 'right',\n '!text-center': col.position == 'center',\n '!font-bold': rowData.bold == true || rowData[col.id].bold == true,\n '!font-italic': rowData.italic == true || rowData[col.id].italic == true,\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\"\n [tooltipDisabled]=\"!col.tooltip\"\n tooltipPosition=\"bottom\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\n @if (rowData[col.id]) {\n <div>{{ rowData[col.id].value ? rowData[col.id].value : '' }}</div>\n }\n </td>\n }\n <!-- State -->\n @if (!col.invisible && checkType('State', col)) {\n <td [ngStyle]=\"{ 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\n [ngClass]=\"{\n 'paddingCell': rowData[col.id] != null,\n 'selectable_cell' : options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection\n }\"\n (click)=\"options.selectable && isModeCellSelection() && !rowData[col.id].disableSelection && onSelectCell(rowData[col.id])\"\n class=\"!text-center\"\n pFrozenColumn\n [frozen]=\"col.frozen\">\n <div class=\"p-column-title\">{{ col.libelle }} : </div>\n @if (rowData[col.id].value != null) {\n <p-tag [value]=\"rowData[col.id].value[getOption(col, rowData, 'optionLabel')]\"\n [severity]=\"rowData[col.id].value.severity\"\n [icon]=\"rowData[col.id].value.icon\"\n [style]=\"{\n 'background-color': rowData[col.id].value.backgroundColor,\n 'color': rowData[col.id].value.textColor,\n 'font-weight': rowData.bold == true || rowData[col.id].bold == true ? 'bold' : null,\n 'font-style': rowData.italic == true || rowData[col.id].italic == true ? 'italic' : null\n }\">\n </p-tag>\n }\n </td>\n }\n }\n\n <!-- Deletion -->\n @if (options.rowsDeletable) {\n <td class=\"cellDelete\"\n [ngClass]=\"rowData.deletable ? 'paddingCell' : null\">\n @if (rowData.deletable) {\n <button pButton\n type=\"button\"\n icon=\"pi pi-times\"\n class=\"p-button-danger buttonDelete p-button-text\"\n [disabled]=\"rowData.readonly\"\n (click)=\"onDeleteLine(rowData)\">\n </button>\n }\n </td>\n }\n\n </tr>\n </ng-template>\n </p-table>\n</div>\n", styles: ["::ng-deep .p-tooltip .p-tooltip-text{overflow-wrap:break-word!important}:host ::ng-deep .p-toggleswitch.p-toggleswitch-checked.p-disabled .p-toggleswitch-slider{background:#abd9ba!important}:host ::ng-deep .grid_brown .rowHeader>th{background-color:#795548}:host ::ng-deep .grid_brown .rowHeader>th div{color:#fff}:host ::ng-deep .grid_brown .rowHeader>th i{color:#fff}:host ::ng-deep .grid_brown .rowHeader .p-sortable-column:hover{background-color:#a47767}:host ::ng-deep .grid_brown .rowHeader .p-sortable-column:hover i{color:#fff}:host ::ng-deep .grid_brown .rowHeader .p-sortable-column.p-highlight div{color:#76c7ff}:host ::ng-deep .grid_brown .rowHeader .p-sortable-column.p-highlight .p-sortable-column-icon{color:#76c7ff}:host ::ng-deep .grid_brown .rowFilter th{background-color:#795548}:host ::ng-deep .grid_grey .rowHeader>th{background-color:#dedddd}:host ::ng-deep .grid_grey .rowHeader>th div{color:#495057}:host ::ng-deep .grid_grey .rowHeader>th i{color:#495057}:host ::ng-deep .grid_grey .rowHeader .p-sortable-column:hover{background-color:#e7e7e7}:host ::ng-deep .grid_grey .rowHeader .p-sortable-column:hover i{color:#495057}:host ::ng-deep .grid_grey .rowHeader .p-sortable-column.p-highlight div{color:#008bff}:host ::ng-deep .grid_grey .rowHeader .p-sortable-column.p-highlight .p-sortable-column-icon{color:#008bff}:host ::ng-deep .grid_grey .rowFilter th{background-color:#dedddd}:host ::ng-deep .selectable_cell:hover{background:#dcdcdc!important;cursor:pointer!important}:host ::ng-deep .p-frozen-column{z-index:2!important}:host ::ng-deep .p-datatable-thead{z-index:3!important}:host ::ng-deep .p-checkbox{border-radius:inherit!important}:host ::ng-deep p-inputnumber{width:100%}:host ::ng-deep .p-calendar,:host ::ng-deep .p-inputtext,:host ::ng-deep .p-inputnumber,:host ::ng-deep .p-inputnumber-input,:host ::ng-deep .p-dropdown,:host ::ng-deep .p-multiselect{width:100%}:host ::ng-deep .suffixe,:host ::ng-deep .prefixe{height:25px;padding-top:1px!important}:host ::ng-deep .p-multiselect-label-container,:host ::ng-deep .p-dropdown-label{width:1px!important}:host ::ng-deep .p-scroller-content{min-height:50%}:host ::ng-deep .rowTotal>th{background-color:#edcbaa!important}:host ::ng-deep .rowGrouping{background:#faeada!important}:host ::ng-deep .p-inputswitch.p-inputswitch-checked .p-inputswitch-slider{background:#30e130}:host ::ng-deep .p-inputswitch.p-inputswitch-checked:not(.p-disabled):hover .p-inputswitch-slider{background:#2bd12b}:host ::ng-deep .p-datatable-table{table-layout:fixed}:host ::ng-deep .p-datatable-thead>tr>th{border:1px solid rgba(0,0,0,.12)!important;padding:8px;font-weight:600;height:40px}:host ::ng-deep .headerAffichageSimple div{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host ::ng-deep .headerAffichageEntier{word-wrap:break-word}:host ::ng-deep .p-datatable-tbody>tr>td{border:1px solid rgba(0,0,0,.12)!important;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host ::ng-deep .p-datatable-tbody>tr>td div{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host ::ng-deep .p-tag{max-width:100%}:host ::ng-deep .p-tag .p-tag-value{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host ::ng-deep .p-button{padding:5px;max-width:100%}:host ::ng-deep .p-button .p-button-label{overflow:hidden!important;white-space:nowrap!important;text-overflow:ellipsis!important}:host ::ng-deep .text_bold{font-weight:700!important}:host ::ng-deep .cellDelete{flex:0 0 50px!important;width:50px;text-align:center!important;padding:0!important}:host ::ng-deep .p-tooltip .p-tooltip-text{background-color:red!important}:host ::ng-deep .p-skeleton{background-color:#dee2e6;border-radius:6px;padding:0}:host ::ng-deep .p-datatable-tbody>tr{height:35px}:host ::ng-deep .p-inputtext{height:25px!important;padding:4px 5px!important}:host ::ng-deep .p-inputnumber{height:25px;padding:0!important}:host ::ng-deep .p-inputnumber-input{padding:0 5px!important}:host ::ng-deep .p-inputgroup .p-inputtext{height:25px;padding:4px 5px!important}:host ::ng-deep .p-dropdown,:host ::ng-deep .p-multiselect{vertical-align:middle}:host ::ng-deep .p-dropdown-label{padding-top:2px;padding-bottom:2px}:host ::ng-deep .p-multiselect-label{padding-top:2px;padding-bottom:2px}:host ::ng-deep .p-editable-column{padding:3px 10px!important}:host ::ng-deep .paddingCell{padding:3px 10px!important}:host ::ng-deep .p-selectbutton>.p-button{width:50%;height:25px}:host ::ng-deep .p-inputgroup>.p-button{height:25px}:host ::ng-deep .buttonDelete{width:100%;height:20px}:host ::ng-deep .p-column-title{display:none}:host ::ng-deep .p-datatable-loading-icon{color:#fff}\n"] }]
1299
+ }], ctorParameters: () => [{ type: i1$1.ConfirmationService }, { type: i1$1.FilterService }, { type: i0.ChangeDetectorRef }, { type: ExportService }], propDecorators: { columns: [{
1322
1300
  type: Input
1323
1301
  }], columnsChange: [{
1324
1302
  type: Output
@@ -1377,7 +1355,7 @@ class CilogEditorComponent {
1377
1355
  // NOTHING
1378
1356
  }
1379
1357
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: CilogEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
1380
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: CilogEditorComponent, isStandalone: true, selector: "cilog-editor", inputs: { text: "text" }, outputs: { textChange: "textChange", onTextChange: "onTextChange" }, viewQueries: [{ propertyName: "editor", first: true, predicate: ["editor"], descendants: true }], ngImport: i0, template: "<p-editor #editor\r\n [(ngModel)]=\"text\"\r\n (onTextChange)=\"change($event)\">\r\n</p-editor>\r\n", styles: [""], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: EditorModule }, { kind: "component", type: i2$2.Editor, selector: "p-editor", inputs: ["style", "styleClass", "placeholder", "formats", "modules", "bounds", "scrollingContainer", "debug", "readonly"], outputs: ["onInit", "onTextChange", "onSelectionChange", "onEditorChange", "onFocus", "onBlur"] }] });
1358
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.6", type: CilogEditorComponent, isStandalone: true, selector: "cilog-editor", inputs: { text: "text" }, outputs: { textChange: "textChange", onTextChange: "onTextChange" }, viewQueries: [{ propertyName: "editor", first: true, predicate: ["editor"], descendants: true }], ngImport: i0, template: "<p-editor #editor\r\n [(ngModel)]=\"text\"\r\n (onTextChange)=\"change($event)\">\r\n</p-editor>\r\n", styles: [""], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: EditorModule }, { kind: "component", type: i2$1.Editor, selector: "p-editor", inputs: ["style", "styleClass", "placeholder", "formats", "modules", "bounds", "scrollingContainer", "debug", "readonly"], outputs: ["onInit", "onTextChange", "onSelectionChange", "onEditorChange", "onFocus", "onBlur"] }] });
1381
1359
  }
1382
1360
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: CilogEditorComponent, decorators: [{
1383
1361
  type: Component,
@@ -1592,8 +1570,8 @@ class DocumentationContextuelleComponent {
1592
1570
  return urlKey.includes(docKey) || docKey.includes(urlKey);
1593
1571
  });
1594
1572
  }
1595
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: DocumentationContextuelleComponent, deps: [{ token: i1$1.HttpClient }, { token: i2$3.Router }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
1596
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: DocumentationContextuelleComponent, isStandalone: true, selector: "cilog-documentation-contextuelle", providers: [provideMarkdown()], ngImport: i0, template: "<div class=\"documentation-container\">\r\n <!-- Menu sup\u00E9rieur -->\r\n <div class=\"documentation-menu\">\r\n <button pButton\r\n type=\"button\"\r\n icon=\"pi pi-list\"\r\n label=\"Sommaire des documentations\"\r\n class=\"p-button-sm p-button-outlined\"\r\n (click)=\"openDocumentationList()\"\r\n title=\"Voir toutes les documentations disponibles\">\r\n </button>\r\n <button pButton\r\n type=\"button\"\r\n icon=\"pi pi-home\"\r\n label=\"Documentation courante\"\r\n class=\"p-button-sm p-button-outlined\"\r\n (click)=\"openCurrentPageDoc()\"\r\n title=\"Documentation de la page actuelle\">\r\n </button>\r\n </div>\r\n\r\n <!-- Syst\u00E8me d'onglets -->\r\n <p-tabs [(value)]=\"activeTabValue\"\r\n (onClose)=\"closeTab($event)\"\r\n styleClass=\"documentation-tabs\">\r\n <p-tablist>\r\n @for (tab of tabs; track tab.value) {\r\n <p-tab [value]=\"tab.value\">{{ tab.title }}</p-tab>\r\n }\r\n </p-tablist>\r\n <p-tabpanels>\r\n @for (tab of tabs; track tab.value; let i = $index) {\r\n <p-tabpanel [value]=\"tab.value\">\r\n <!-- Contenu pour onglet de liste - Version am\u00E9lior\u00E9e -->\r\n @if (tab.type === 'list') {\r\n <div class=\"docs-list-container\">\r\n <div class=\"docs-header\">\r\n <h2>\uD83D\uDCDA Sommaire de la Documentation</h2>\r\n <p class=\"docs-subtitle\">Explorez toutes les fonctionnalit\u00E9s disponibles dans LogeProj</p>\r\n </div>\r\n <!-- Barre de recherche -->\r\n <div class=\"search-bar\">\r\n <span class=\"p-input-icon-left\" style=\"width: 100%; max-width: 800px;\">\r\n <i class=\"pi pi-search\"></i>\r\n <input type=\"text\"\r\n pInputText\r\n placeholder=\"Rechercher dans les documentations...\"\r\n name=\"recherche\"\r\n [(ngModel)]=\"searchQuery\"\r\n ngDefaultControl\r\n (input)=\"filterDocumentation()\"\r\n style=\"width: 100% !important; padding: 12px 20px 12px 40px !important; border-radius: 25px !important;\">\r\n </span>\r\n </div>\r\n <!-- Liste des cat\u00E9gories -->\r\n <div class=\"categories-container\">\r\n @for (category of filteredCategories; track category.key) {\r\n <div class=\"category-section\">\r\n <div class=\"category-header\" (click)=\"toggleCategory(category.key)\">\r\n <i class=\"pi\" [ngClass]=\"category.expanded ? 'pi-chevron-down' : 'pi-chevron-right'\"></i>\r\n <span class=\"category-icon\">{{ category.icon }}</span>\r\n <h3 class=\"category-title\">{{ category.name }}</h3>\r\n <span class=\"category-count\">({{ category.docs.length }})</span>\r\n </div>\r\n <div class=\"category-content\" [ngClass]=\"{ 'expanded': category.expanded }\">\r\n <div class=\"docs-grid\">\r\n @for (doc of category.docs; track doc.fileName) {\r\n <div class=\"doc-card\"\r\n (click)=\"openDocumentationAndSwitch(doc)\"\r\n [title]=\"doc.description\">\r\n <div class=\"doc-card-content\">\r\n <h4 class=\"doc-name\">{{ doc.displayName }}</h4>\r\n <markdown class=\"doc-description\" [data]=\"doc.description\"\r\n (click)=\"onMarkdownClick($event)\"></markdown>\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n <!-- Stats en bas -->\r\n <div class=\"docs-stats\">\r\n <div class=\"stat-item\">\r\n <strong>{{ getTotalDocsCount() }}</strong> documentations disponibles\r\n </div>\r\n <div class=\"stat-item\">\r\n <strong>{{ getOpenTabsCount() }}</strong> onglets ouverts\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n <!-- Contenu pour onglet de documentation -->\r\n @if (tab.type === 'doc') {\r\n <div class=\"markdown-container\">\r\n <!-- Breadcrumb pour navigation -->\r\n @if (tab.category) {\r\n <div class=\"doc-breadcrumb\">\r\n <span class=\"breadcrumb-item\">{{ tab.category }}</span>\r\n <i class=\"pi pi-angle-right\"></i>\r\n <span class=\"breadcrumb-current\">{{ tab.title }}</span>\r\n </div>\r\n }\r\n @if (tab.loading) {\r\n <div class=\"loading-container\">\r\n <p-progressSpinner strokeWidth=\"4\"></p-progressSpinner>\r\n <span>Chargement de la documentation...</span>\r\n </div>\r\n }\r\n @if (!tab.loading) {\r\n <markdown [data]=\"tab.content || 'Aucun contenu disponible'\"\r\n (click)=\"onMarkdownClick($event)\">\r\n </markdown>\r\n }\r\n </div>\r\n }\r\n </p-tabpanel>\r\n }\r\n </p-tabpanels>\r\n </p-tabs>\r\n</div>\r\n", styles: [".documentation-container{display:flex;flex-direction:column;height:100%;width:100%}.documentation-menu{padding:15px;background:linear-gradient(135deg,#667eea,#764ba2);border-bottom:1px solid #e9ecef;display:flex;gap:10px;flex-shrink:0}.documentation-menu .p-button{background:#fff3;border:1px solid rgba(255,255,255,.3);color:#fff}.documentation-menu .p-button:hover{background:#ffffff4d}.docs-list-container{padding:20px;flex:1;overflow-y:auto;background:#f8f9fa}.docs-header{text-align:center;margin-bottom:30px}.docs-header h2{margin:0 0 10px;color:#2c3e50;font-size:2rem}.docs-header .docs-subtitle{color:#7f8c8d;font-size:1.1rem;margin:0}.search-bar{margin-bottom:30px;display:flex;justify-content:center}.search-bar .search-input{width:100%;padding:12px 20px 12px 40px;border-radius:25px;border:2px solid #e9ecef;font-size:1rem}.search-bar .search-input:focus{border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.categories-container{max-width:1200px;margin:0 auto}.category-section{margin-bottom:25px;background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a;overflow:hidden}.category-section .category-header{padding:20px;background:linear-gradient(135deg,#f5f7fa,#c3cfe2);cursor:pointer;display:flex;align-items:center;gap:15px;transition:all .3s ease}.category-section .category-header:hover{background:linear-gradient(135deg,#e8eaf6,#b39ddb)}.category-section .category-header .pi{color:#667eea;font-size:1rem;transition:transform .3s ease}.category-section .category-header .category-icon{font-size:1.5rem}.category-section .category-header .category-title{margin:0;color:#2c3e50;font-size:1.3rem;flex:1}.category-section .category-header .category-count{color:#7f8c8d;font-size:.9rem;background:#677eea1a;padding:4px 12px;border-radius:15px}.category-section .category-content{max-height:0;overflow:hidden;transition:max-height .4s ease-out}.category-section .category-content.expanded{max-height:2000px;transition:max-height .6s ease-in}.docs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:20px;padding:25px}.doc-card{border:1px solid #e9ecef;border-radius:12px;padding:20px;cursor:pointer;transition:all .3s ease;background:#fff;position:relative;overflow:hidden}.doc-card:before{content:\"\";position:absolute;top:0;left:0;width:100%;height:4px;background:linear-gradient(90deg,#667eea,#764ba2);transform:scaleX(0);transition:transform .3s ease}.doc-card:hover{border-color:#667eea;box-shadow:0 8px 25px #667eea26;transform:translateY(-4px)}.doc-card:hover:before{transform:scaleX(1)}.doc-card .doc-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.doc-card .doc-card-header .doc-icon{font-size:2rem}.doc-card .doc-card-header .doc-badge{padding:4px 8px;border-radius:12px;font-size:.75rem;font-weight:600;text-transform:uppercase}.doc-card .doc-card-header .doc-badge.doc-badge-high{background:#e8f5e8;color:#2e7d2e}.doc-card .doc-card-header .doc-badge.doc-badge-medium{background:#fff3cd;color:#856404}.doc-card .doc-card-header .doc-badge.doc-badge-low{background:#f8f9fa;color:#6c757d}.doc-card .doc-card-content .doc-name{margin:0 0 10px;color:#2c3e50;font-size:1.1rem;font-weight:600;line-height:1.3}.doc-card .doc-card-content .doc-description{color:#6c757d;font-size:.9rem;line-height:1.4;margin:0 0 10px}.doc-card .doc-card-content .doc-description ::ng-deep p{margin:0;display:inline}.doc-card .doc-card-content .doc-description ::ng-deep a{color:#667eea;text-decoration:none;pointer-events:auto}.doc-card .doc-card-content .doc-description ::ng-deep a:hover{text-decoration:underline}.doc-card .doc-card-content .doc-filename{color:#adb5bd;font-size:.8rem;font-family:Courier New,monospace}.docs-stats{display:flex;justify-content:center;gap:40px;margin-top:40px;padding:20px;background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a}.docs-stats .stat-item{text-align:center;color:#6c757d}.docs-stats .stat-item strong{color:#667eea;font-size:1.2rem}.markdown-container{flex:1;overflow-y:auto;padding:20px;background:#fff}.markdown-container .doc-breadcrumb{display:flex;align-items:center;gap:8px;margin-bottom:20px;padding:10px 0;border-bottom:1px solid #e9ecef;color:#6c757d;font-size:.9rem}.markdown-container .doc-breadcrumb .breadcrumb-current{color:#2c3e50;font-weight:600}.markdown-container markdown{display:block;line-height:1.6}.markdown-container markdown ::ng-deep a[href$=\".md\"]{color:#667eea;text-decoration:none;cursor:pointer;border-bottom:1px dashed #667eea}.markdown-container markdown ::ng-deep a[href$=\".md\"]:hover{text-decoration:none;border-bottom-style:solid}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px;color:#6c757d;gap:20px}.loading-container span{font-size:1.1rem}.documentation-tabs{flex:1;display:flex;flex-direction:column}.documentation-tabs ::ng-deep .p-tabview-panels{flex:1;display:flex}.documentation-tabs ::ng-deep .p-tabview-panels .p-tabview-panel{flex:1;display:flex;flex-direction:column}.documentation-tabs ::ng-deep .p-tabview-nav{background:#f8f9fa;border-bottom:2px solid #e9ecef}.documentation-tabs ::ng-deep .p-tabview-nav .p-tabview-nav-link{background:transparent;border:none;color:#6c757d;font-weight:500}.documentation-tabs ::ng-deep .p-tabview-nav .p-tabview-nav-link:not(.p-disabled):focus{box-shadow:0 0 0 2px #667eea33}.documentation-tabs ::ng-deep .p-tabview-nav .p-highlight .p-tabview-nav-link{background:#fff;color:#667eea;border-bottom:2px solid #667eea}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ProgressSpinnerModule }, { kind: "component", type: i5$1.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "ngmodule", type: TabsModule }, { kind: "component", type: i6$1.Tabs, selector: "p-tabs", inputs: ["value", "scrollable", "lazy", "selectOnFocus", "showNavigators", "tabindex"], outputs: ["valueChange"] }, { kind: "component", type: i6$1.TabPanels, selector: "p-tabpanels" }, { kind: "component", type: i6$1.TabPanel, selector: "p-tabpanel", inputs: ["lazy", "value"], outputs: ["valueChange"] }, { kind: "component", type: i6$1.TabList, selector: "p-tablist" }, { kind: "component", type: i6$1.Tab, selector: "p-tab", inputs: ["value", "disabled"], outputs: ["valueChange"] }, { kind: "ngmodule", type: EditorModule }, { kind: "component", type: MarkdownComponent, selector: "markdown, [markdown]", inputs: ["data", "src", "disableSanitizer", "inline", "clipboard", "clipboardButtonComponent", "clipboardButtonTemplate", "emoji", "katex", "katexOptions", "mermaid", "mermaidOptions", "lineHighlight", "line", "lineOffset", "lineNumbers", "start", "commandLine", "filterOutput", "host", "prompt", "output", "user"], outputs: ["error", "load", "ready"] }] });
1573
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: DocumentationContextuelleComponent, deps: [{ token: i1$2.HttpClient }, { token: i2$2.Router }, { token: i0.NgZone }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
1574
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: DocumentationContextuelleComponent, isStandalone: true, selector: "cilog-documentation-contextuelle", providers: [provideMarkdown()], ngImport: i0, template: "<div class=\"documentation-container\">\r\n <!-- Menu sup\u00E9rieur -->\r\n <div class=\"documentation-menu\">\r\n <button pButton\r\n type=\"button\"\r\n icon=\"pi pi-list\"\r\n label=\"Sommaire des documentations\"\r\n class=\"p-button-sm p-button-outlined\"\r\n (click)=\"openDocumentationList()\"\r\n title=\"Voir toutes les documentations disponibles\">\r\n </button>\r\n <button pButton\r\n type=\"button\"\r\n icon=\"pi pi-home\"\r\n label=\"Documentation courante\"\r\n class=\"p-button-sm p-button-outlined\"\r\n (click)=\"openCurrentPageDoc()\"\r\n title=\"Documentation de la page actuelle\">\r\n </button>\r\n </div>\r\n\r\n <!-- Syst\u00E8me d'onglets -->\r\n <p-tabs [(value)]=\"activeTabValue\"\r\n (onClose)=\"closeTab($event)\"\r\n styleClass=\"documentation-tabs\">\r\n <p-tablist>\r\n @for (tab of tabs; track tab.value) {\r\n <p-tab [value]=\"tab.value\">{{ tab.title }}</p-tab>\r\n }\r\n </p-tablist>\r\n <p-tabpanels>\r\n @for (tab of tabs; track tab.value; let i = $index) {\r\n <p-tabpanel [value]=\"tab.value\">\r\n <!-- Contenu pour onglet de liste - Version am\u00E9lior\u00E9e -->\r\n @if (tab.type === 'list') {\r\n <div class=\"docs-list-container\">\r\n <div class=\"docs-header\">\r\n <h2>\uD83D\uDCDA Sommaire de la Documentation</h2>\r\n <p class=\"docs-subtitle\">Explorez toutes les fonctionnalit\u00E9s disponibles dans LogeProj</p>\r\n </div>\r\n <!-- Barre de recherche -->\r\n <div class=\"search-bar\">\r\n <span class=\"p-input-icon-left\" style=\"width: 100%; max-width: 800px;\">\r\n <i class=\"pi pi-search\"></i>\r\n <input type=\"text\"\r\n pInputText\r\n placeholder=\"Rechercher dans les documentations...\"\r\n name=\"recherche\"\r\n [(ngModel)]=\"searchQuery\"\r\n ngDefaultControl\r\n (input)=\"filterDocumentation()\"\r\n style=\"width: 100% !important; padding: 12px 20px 12px 40px !important; border-radius: 25px !important;\">\r\n </span>\r\n </div>\r\n <!-- Liste des cat\u00E9gories -->\r\n <div class=\"categories-container\">\r\n @for (category of filteredCategories; track category.key) {\r\n <div class=\"category-section\">\r\n <div class=\"category-header\" (click)=\"toggleCategory(category.key)\">\r\n <i class=\"pi\" [ngClass]=\"category.expanded ? 'pi-chevron-down' : 'pi-chevron-right'\"></i>\r\n <span class=\"category-icon\">{{ category.icon }}</span>\r\n <h3 class=\"category-title\">{{ category.name }}</h3>\r\n <span class=\"category-count\">({{ category.docs.length }})</span>\r\n </div>\r\n <div class=\"category-content\" [ngClass]=\"{ 'expanded': category.expanded }\">\r\n <div class=\"docs-grid\">\r\n @for (doc of category.docs; track doc.fileName) {\r\n <div class=\"doc-card\"\r\n (click)=\"openDocumentationAndSwitch(doc)\"\r\n [title]=\"doc.description\">\r\n <div class=\"doc-card-content\">\r\n <h4 class=\"doc-name\">{{ doc.displayName }}</h4>\r\n <markdown class=\"doc-description\" [data]=\"doc.description\"\r\n (click)=\"onMarkdownClick($event)\"></markdown>\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n <!-- Stats en bas -->\r\n <div class=\"docs-stats\">\r\n <div class=\"stat-item\">\r\n <strong>{{ getTotalDocsCount() }}</strong> documentations disponibles\r\n </div>\r\n <div class=\"stat-item\">\r\n <strong>{{ getOpenTabsCount() }}</strong> onglets ouverts\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n <!-- Contenu pour onglet de documentation -->\r\n @if (tab.type === 'doc') {\r\n <div class=\"markdown-container\">\r\n <!-- Breadcrumb pour navigation -->\r\n @if (tab.category) {\r\n <div class=\"doc-breadcrumb\">\r\n <span class=\"breadcrumb-item\">{{ tab.category }}</span>\r\n <i class=\"pi pi-angle-right\"></i>\r\n <span class=\"breadcrumb-current\">{{ tab.title }}</span>\r\n </div>\r\n }\r\n @if (tab.loading) {\r\n <div class=\"loading-container\">\r\n <p-progressSpinner strokeWidth=\"4\"></p-progressSpinner>\r\n <span>Chargement de la documentation...</span>\r\n </div>\r\n }\r\n @if (!tab.loading) {\r\n <markdown [data]=\"tab.content || 'Aucun contenu disponible'\"\r\n (click)=\"onMarkdownClick($event)\">\r\n </markdown>\r\n }\r\n </div>\r\n }\r\n </p-tabpanel>\r\n }\r\n </p-tabpanels>\r\n </p-tabs>\r\n</div>\r\n", styles: [".documentation-container{display:flex;flex-direction:column;height:100%;width:100%}.documentation-menu{padding:15px;background:linear-gradient(135deg,#667eea,#764ba2);border-bottom:1px solid #e9ecef;display:flex;gap:10px;flex-shrink:0}.documentation-menu .p-button{background:#fff3;border:1px solid rgba(255,255,255,.3);color:#fff}.documentation-menu .p-button:hover{background:#ffffff4d}.docs-list-container{padding:20px;flex:1;overflow-y:auto;background:#f8f9fa}.docs-header{text-align:center;margin-bottom:30px}.docs-header h2{margin:0 0 10px;color:#2c3e50;font-size:2rem}.docs-header .docs-subtitle{color:#7f8c8d;font-size:1.1rem;margin:0}.search-bar{margin-bottom:30px;display:flex;justify-content:center}.search-bar .search-input{width:100%;padding:12px 20px 12px 40px;border-radius:25px;border:2px solid #e9ecef;font-size:1rem}.search-bar .search-input:focus{border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.categories-container{max-width:1200px;margin:0 auto}.category-section{margin-bottom:25px;background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a;overflow:hidden}.category-section .category-header{padding:20px;background:linear-gradient(135deg,#f5f7fa,#c3cfe2);cursor:pointer;display:flex;align-items:center;gap:15px;transition:all .3s ease}.category-section .category-header:hover{background:linear-gradient(135deg,#e8eaf6,#b39ddb)}.category-section .category-header .pi{color:#667eea;font-size:1rem;transition:transform .3s ease}.category-section .category-header .category-icon{font-size:1.5rem}.category-section .category-header .category-title{margin:0;color:#2c3e50;font-size:1.3rem;flex:1}.category-section .category-header .category-count{color:#7f8c8d;font-size:.9rem;background:#677eea1a;padding:4px 12px;border-radius:15px}.category-section .category-content{max-height:0;overflow:hidden;transition:max-height .4s ease-out}.category-section .category-content.expanded{max-height:2000px;transition:max-height .6s ease-in}.docs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:20px;padding:25px}.doc-card{border:1px solid #e9ecef;border-radius:12px;padding:20px;cursor:pointer;transition:all .3s ease;background:#fff;position:relative;overflow:hidden}.doc-card:before{content:\"\";position:absolute;top:0;left:0;width:100%;height:4px;background:linear-gradient(90deg,#667eea,#764ba2);transform:scaleX(0);transition:transform .3s ease}.doc-card:hover{border-color:#667eea;box-shadow:0 8px 25px #667eea26;transform:translateY(-4px)}.doc-card:hover:before{transform:scaleX(1)}.doc-card .doc-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.doc-card .doc-card-header .doc-icon{font-size:2rem}.doc-card .doc-card-header .doc-badge{padding:4px 8px;border-radius:12px;font-size:.75rem;font-weight:600;text-transform:uppercase}.doc-card .doc-card-header .doc-badge.doc-badge-high{background:#e8f5e8;color:#2e7d2e}.doc-card .doc-card-header .doc-badge.doc-badge-medium{background:#fff3cd;color:#856404}.doc-card .doc-card-header .doc-badge.doc-badge-low{background:#f8f9fa;color:#6c757d}.doc-card .doc-card-content .doc-name{margin:0 0 10px;color:#2c3e50;font-size:1.1rem;font-weight:600;line-height:1.3}.doc-card .doc-card-content .doc-description{color:#6c757d;font-size:.9rem;line-height:1.4;margin:0 0 10px}.doc-card .doc-card-content .doc-description ::ng-deep p{margin:0;display:inline}.doc-card .doc-card-content .doc-description ::ng-deep a{color:#667eea;text-decoration:none;pointer-events:auto}.doc-card .doc-card-content .doc-description ::ng-deep a:hover{text-decoration:underline}.doc-card .doc-card-content .doc-filename{color:#adb5bd;font-size:.8rem;font-family:Courier New,monospace}.docs-stats{display:flex;justify-content:center;gap:40px;margin-top:40px;padding:20px;background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a}.docs-stats .stat-item{text-align:center;color:#6c757d}.docs-stats .stat-item strong{color:#667eea;font-size:1.2rem}.markdown-container{flex:1;overflow-y:auto;padding:20px;background:#fff}.markdown-container .doc-breadcrumb{display:flex;align-items:center;gap:8px;margin-bottom:20px;padding:10px 0;border-bottom:1px solid #e9ecef;color:#6c757d;font-size:.9rem}.markdown-container .doc-breadcrumb .breadcrumb-current{color:#2c3e50;font-weight:600}.markdown-container markdown{display:block;line-height:1.6}.markdown-container markdown ::ng-deep a[href$=\".md\"]{color:#667eea;text-decoration:none;cursor:pointer;border-bottom:1px dashed #667eea}.markdown-container markdown ::ng-deep a[href$=\".md\"]:hover{text-decoration:none;border-bottom-style:solid}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px;color:#6c757d;gap:20px}.loading-container span{font-size:1.1rem}.documentation-tabs{flex:1;display:flex;flex-direction:column}.documentation-tabs ::ng-deep .p-tabview-panels{flex:1;display:flex}.documentation-tabs ::ng-deep .p-tabview-panels .p-tabview-panel{flex:1;display:flex;flex-direction:column}.documentation-tabs ::ng-deep .p-tabview-nav{background:#f8f9fa;border-bottom:2px solid #e9ecef}.documentation-tabs ::ng-deep .p-tabview-nav .p-tabview-nav-link{background:transparent;border:none;color:#6c757d;font-weight:500}.documentation-tabs ::ng-deep .p-tabview-nav .p-tabview-nav-link:not(.p-disabled):focus{box-shadow:0 0 0 2px #667eea33}.documentation-tabs ::ng-deep .p-tabview-nav .p-highlight .p-tabview-nav-link{background:#fff;color:#667eea;border-bottom:2px solid #667eea}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ProgressSpinnerModule }, { kind: "component", type: i5$1.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "ngmodule", type: TabsModule }, { kind: "component", type: i6$1.Tabs, selector: "p-tabs", inputs: ["value", "scrollable", "lazy", "selectOnFocus", "showNavigators", "tabindex"], outputs: ["valueChange"] }, { kind: "component", type: i6$1.TabPanels, selector: "p-tabpanels" }, { kind: "component", type: i6$1.TabPanel, selector: "p-tabpanel", inputs: ["lazy", "value"], outputs: ["valueChange"] }, { kind: "component", type: i6$1.TabList, selector: "p-tablist" }, { kind: "component", type: i6$1.Tab, selector: "p-tab", inputs: ["value", "disabled"], outputs: ["valueChange"] }, { kind: "ngmodule", type: EditorModule }, { kind: "component", type: MarkdownComponent, selector: "markdown, [markdown]", inputs: ["data", "src", "disableSanitizer", "inline", "clipboard", "clipboardButtonComponent", "clipboardButtonTemplate", "emoji", "katex", "katexOptions", "mermaid", "mermaidOptions", "lineHighlight", "line", "lineOffset", "lineNumbers", "start", "commandLine", "filterOutput", "host", "prompt", "output", "user"], outputs: ["error", "load", "ready"] }] });
1597
1575
  }
1598
1576
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: DocumentationContextuelleComponent, decorators: [{
1599
1577
  type: Component,
@@ -1605,7 +1583,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
1605
1583
  EditorModule,
1606
1584
  MarkdownComponent
1607
1585
  ], template: "<div class=\"documentation-container\">\r\n <!-- Menu sup\u00E9rieur -->\r\n <div class=\"documentation-menu\">\r\n <button pButton\r\n type=\"button\"\r\n icon=\"pi pi-list\"\r\n label=\"Sommaire des documentations\"\r\n class=\"p-button-sm p-button-outlined\"\r\n (click)=\"openDocumentationList()\"\r\n title=\"Voir toutes les documentations disponibles\">\r\n </button>\r\n <button pButton\r\n type=\"button\"\r\n icon=\"pi pi-home\"\r\n label=\"Documentation courante\"\r\n class=\"p-button-sm p-button-outlined\"\r\n (click)=\"openCurrentPageDoc()\"\r\n title=\"Documentation de la page actuelle\">\r\n </button>\r\n </div>\r\n\r\n <!-- Syst\u00E8me d'onglets -->\r\n <p-tabs [(value)]=\"activeTabValue\"\r\n (onClose)=\"closeTab($event)\"\r\n styleClass=\"documentation-tabs\">\r\n <p-tablist>\r\n @for (tab of tabs; track tab.value) {\r\n <p-tab [value]=\"tab.value\">{{ tab.title }}</p-tab>\r\n }\r\n </p-tablist>\r\n <p-tabpanels>\r\n @for (tab of tabs; track tab.value; let i = $index) {\r\n <p-tabpanel [value]=\"tab.value\">\r\n <!-- Contenu pour onglet de liste - Version am\u00E9lior\u00E9e -->\r\n @if (tab.type === 'list') {\r\n <div class=\"docs-list-container\">\r\n <div class=\"docs-header\">\r\n <h2>\uD83D\uDCDA Sommaire de la Documentation</h2>\r\n <p class=\"docs-subtitle\">Explorez toutes les fonctionnalit\u00E9s disponibles dans LogeProj</p>\r\n </div>\r\n <!-- Barre de recherche -->\r\n <div class=\"search-bar\">\r\n <span class=\"p-input-icon-left\" style=\"width: 100%; max-width: 800px;\">\r\n <i class=\"pi pi-search\"></i>\r\n <input type=\"text\"\r\n pInputText\r\n placeholder=\"Rechercher dans les documentations...\"\r\n name=\"recherche\"\r\n [(ngModel)]=\"searchQuery\"\r\n ngDefaultControl\r\n (input)=\"filterDocumentation()\"\r\n style=\"width: 100% !important; padding: 12px 20px 12px 40px !important; border-radius: 25px !important;\">\r\n </span>\r\n </div>\r\n <!-- Liste des cat\u00E9gories -->\r\n <div class=\"categories-container\">\r\n @for (category of filteredCategories; track category.key) {\r\n <div class=\"category-section\">\r\n <div class=\"category-header\" (click)=\"toggleCategory(category.key)\">\r\n <i class=\"pi\" [ngClass]=\"category.expanded ? 'pi-chevron-down' : 'pi-chevron-right'\"></i>\r\n <span class=\"category-icon\">{{ category.icon }}</span>\r\n <h3 class=\"category-title\">{{ category.name }}</h3>\r\n <span class=\"category-count\">({{ category.docs.length }})</span>\r\n </div>\r\n <div class=\"category-content\" [ngClass]=\"{ 'expanded': category.expanded }\">\r\n <div class=\"docs-grid\">\r\n @for (doc of category.docs; track doc.fileName) {\r\n <div class=\"doc-card\"\r\n (click)=\"openDocumentationAndSwitch(doc)\"\r\n [title]=\"doc.description\">\r\n <div class=\"doc-card-content\">\r\n <h4 class=\"doc-name\">{{ doc.displayName }}</h4>\r\n <markdown class=\"doc-description\" [data]=\"doc.description\"\r\n (click)=\"onMarkdownClick($event)\"></markdown>\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n <!-- Stats en bas -->\r\n <div class=\"docs-stats\">\r\n <div class=\"stat-item\">\r\n <strong>{{ getTotalDocsCount() }}</strong> documentations disponibles\r\n </div>\r\n <div class=\"stat-item\">\r\n <strong>{{ getOpenTabsCount() }}</strong> onglets ouverts\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n <!-- Contenu pour onglet de documentation -->\r\n @if (tab.type === 'doc') {\r\n <div class=\"markdown-container\">\r\n <!-- Breadcrumb pour navigation -->\r\n @if (tab.category) {\r\n <div class=\"doc-breadcrumb\">\r\n <span class=\"breadcrumb-item\">{{ tab.category }}</span>\r\n <i class=\"pi pi-angle-right\"></i>\r\n <span class=\"breadcrumb-current\">{{ tab.title }}</span>\r\n </div>\r\n }\r\n @if (tab.loading) {\r\n <div class=\"loading-container\">\r\n <p-progressSpinner strokeWidth=\"4\"></p-progressSpinner>\r\n <span>Chargement de la documentation...</span>\r\n </div>\r\n }\r\n @if (!tab.loading) {\r\n <markdown [data]=\"tab.content || 'Aucun contenu disponible'\"\r\n (click)=\"onMarkdownClick($event)\">\r\n </markdown>\r\n }\r\n </div>\r\n }\r\n </p-tabpanel>\r\n }\r\n </p-tabpanels>\r\n </p-tabs>\r\n</div>\r\n", styles: [".documentation-container{display:flex;flex-direction:column;height:100%;width:100%}.documentation-menu{padding:15px;background:linear-gradient(135deg,#667eea,#764ba2);border-bottom:1px solid #e9ecef;display:flex;gap:10px;flex-shrink:0}.documentation-menu .p-button{background:#fff3;border:1px solid rgba(255,255,255,.3);color:#fff}.documentation-menu .p-button:hover{background:#ffffff4d}.docs-list-container{padding:20px;flex:1;overflow-y:auto;background:#f8f9fa}.docs-header{text-align:center;margin-bottom:30px}.docs-header h2{margin:0 0 10px;color:#2c3e50;font-size:2rem}.docs-header .docs-subtitle{color:#7f8c8d;font-size:1.1rem;margin:0}.search-bar{margin-bottom:30px;display:flex;justify-content:center}.search-bar .search-input{width:100%;padding:12px 20px 12px 40px;border-radius:25px;border:2px solid #e9ecef;font-size:1rem}.search-bar .search-input:focus{border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.categories-container{max-width:1200px;margin:0 auto}.category-section{margin-bottom:25px;background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a;overflow:hidden}.category-section .category-header{padding:20px;background:linear-gradient(135deg,#f5f7fa,#c3cfe2);cursor:pointer;display:flex;align-items:center;gap:15px;transition:all .3s ease}.category-section .category-header:hover{background:linear-gradient(135deg,#e8eaf6,#b39ddb)}.category-section .category-header .pi{color:#667eea;font-size:1rem;transition:transform .3s ease}.category-section .category-header .category-icon{font-size:1.5rem}.category-section .category-header .category-title{margin:0;color:#2c3e50;font-size:1.3rem;flex:1}.category-section .category-header .category-count{color:#7f8c8d;font-size:.9rem;background:#677eea1a;padding:4px 12px;border-radius:15px}.category-section .category-content{max-height:0;overflow:hidden;transition:max-height .4s ease-out}.category-section .category-content.expanded{max-height:2000px;transition:max-height .6s ease-in}.docs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:20px;padding:25px}.doc-card{border:1px solid #e9ecef;border-radius:12px;padding:20px;cursor:pointer;transition:all .3s ease;background:#fff;position:relative;overflow:hidden}.doc-card:before{content:\"\";position:absolute;top:0;left:0;width:100%;height:4px;background:linear-gradient(90deg,#667eea,#764ba2);transform:scaleX(0);transition:transform .3s ease}.doc-card:hover{border-color:#667eea;box-shadow:0 8px 25px #667eea26;transform:translateY(-4px)}.doc-card:hover:before{transform:scaleX(1)}.doc-card .doc-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px}.doc-card .doc-card-header .doc-icon{font-size:2rem}.doc-card .doc-card-header .doc-badge{padding:4px 8px;border-radius:12px;font-size:.75rem;font-weight:600;text-transform:uppercase}.doc-card .doc-card-header .doc-badge.doc-badge-high{background:#e8f5e8;color:#2e7d2e}.doc-card .doc-card-header .doc-badge.doc-badge-medium{background:#fff3cd;color:#856404}.doc-card .doc-card-header .doc-badge.doc-badge-low{background:#f8f9fa;color:#6c757d}.doc-card .doc-card-content .doc-name{margin:0 0 10px;color:#2c3e50;font-size:1.1rem;font-weight:600;line-height:1.3}.doc-card .doc-card-content .doc-description{color:#6c757d;font-size:.9rem;line-height:1.4;margin:0 0 10px}.doc-card .doc-card-content .doc-description ::ng-deep p{margin:0;display:inline}.doc-card .doc-card-content .doc-description ::ng-deep a{color:#667eea;text-decoration:none;pointer-events:auto}.doc-card .doc-card-content .doc-description ::ng-deep a:hover{text-decoration:underline}.doc-card .doc-card-content .doc-filename{color:#adb5bd;font-size:.8rem;font-family:Courier New,monospace}.docs-stats{display:flex;justify-content:center;gap:40px;margin-top:40px;padding:20px;background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a}.docs-stats .stat-item{text-align:center;color:#6c757d}.docs-stats .stat-item strong{color:#667eea;font-size:1.2rem}.markdown-container{flex:1;overflow-y:auto;padding:20px;background:#fff}.markdown-container .doc-breadcrumb{display:flex;align-items:center;gap:8px;margin-bottom:20px;padding:10px 0;border-bottom:1px solid #e9ecef;color:#6c757d;font-size:.9rem}.markdown-container .doc-breadcrumb .breadcrumb-current{color:#2c3e50;font-weight:600}.markdown-container markdown{display:block;line-height:1.6}.markdown-container markdown ::ng-deep a[href$=\".md\"]{color:#667eea;text-decoration:none;cursor:pointer;border-bottom:1px dashed #667eea}.markdown-container markdown ::ng-deep a[href$=\".md\"]:hover{text-decoration:none;border-bottom-style:solid}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px;color:#6c757d;gap:20px}.loading-container span{font-size:1.1rem}.documentation-tabs{flex:1;display:flex;flex-direction:column}.documentation-tabs ::ng-deep .p-tabview-panels{flex:1;display:flex}.documentation-tabs ::ng-deep .p-tabview-panels .p-tabview-panel{flex:1;display:flex;flex-direction:column}.documentation-tabs ::ng-deep .p-tabview-nav{background:#f8f9fa;border-bottom:2px solid #e9ecef}.documentation-tabs ::ng-deep .p-tabview-nav .p-tabview-nav-link{background:transparent;border:none;color:#6c757d;font-weight:500}.documentation-tabs ::ng-deep .p-tabview-nav .p-tabview-nav-link:not(.p-disabled):focus{box-shadow:0 0 0 2px #667eea33}.documentation-tabs ::ng-deep .p-tabview-nav .p-highlight .p-tabview-nav-link{background:#fff;color:#667eea;border-bottom:2px solid #667eea}\n"] }]
1608
- }], ctorParameters: () => [{ type: i1$1.HttpClient }, { type: i2$3.Router }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }] });
1586
+ }], ctorParameters: () => [{ type: i1$2.HttpClient }, { type: i2$2.Router }, { type: i0.NgZone }, { type: i0.ChangeDetectorRef }] });
1609
1587
 
1610
1588
  class CilogLibService {
1611
1589
  constructor() { }