cilog-lib 0.7.4 → 0.7.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -344,10 +344,10 @@ export class CilogTableComponent {
|
|
|
344
344
|
}
|
|
345
345
|
}
|
|
346
346
|
CilogTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.0", ngImport: i0, type: CilogTableComponent, deps: [{ token: i1.ConfirmationService }, { token: i1.FilterService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
347
|
-
CilogTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.0", type: CilogTableComponent, 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", onSort: "onSort", onPage: "onPage" }, viewQueries: [{ propertyName: "table", first: true, predicate: ["table"], descendants: true, static: true }], ngImport: i0, template: "<p-table #table\r\n [columns]=\"columns\"\r\n [value]=\"values\"\r\n dataKey=\"id\"\r\n [selectionMode]=\"options.selectable && !isModeEdition() && !isModeCheckboxSelection() ? 'single' : null\"\r\n [(selection)]=\"selectedRows\"\r\n (onRowSelect)=\"onSelectRow($event)\"\r\n (onRowUnselect)=\"onUnselectRow($event)\"\r\n (sortFunction)=\"customSort($event)\"\r\n [customSort]=\"options.grouping == null ? true : false\"\r\n [scrollable]=\"true\"\r\n [loading]=\"loading\"\r\n [scrollHeight]=\"options.scrollHeight != null ? options.scrollHeight : null\"\r\n [rowGroupMode]=\"options.grouping != null ? 'subheader' : null\"\r\n [groupRowsBy]=\"options.grouping != null ? options.grouping.obj + '.' + options.grouping.id : null\"\r\n [virtualScroll]=\"options.virtualScroll != null && options.scrollHeight != null ? true : false\"\r\n [virtualRowHeight]=\"35\"\r\n [paginator]=\"options.paginator == null ? false : true\"\r\n [rows]=\"options.paginatorRows\"\r\n (onPage)=\"onPageTable($event)\"\r\n (onFilter)=\"onFilterTable($event)\"\r\n [groupRowsByOrder]=\"0\"\r\n [tableStyleClass]=\"!options.themeGrille ? 'grid_grey' : options.themeGrille\">\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 <th class=\"cellDelete\" *ngIf=\"isModeCheckboxSelection()\">\r\n\r\n </th>\r\n <th *ngFor=\"let col of columns\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, 'width' : col.width ? col.width : null }\"\r\n [ngClass]=\"{ 'centerText' : options.centerHeaders }\"\r\n [pSortableColumn]=\"col.id\"\r\n [pSortableColumnDisabled]=\"!options.sortable || options.grouping != null\"\r\n id=\"{{ col.id }}\"\r\n (click)=\"refreshData()\">\r\n <span>{{ col.libelle }}</span>\r\n <p-sortIcon *ngIf=\"options.sortable && options.grouping == null\" [field]=\"col.id\"></p-sortIcon>\r\n </th>\r\n <th class=\"cellDelete\" *ngIf=\"options.rowsDeletable\"></th>\r\n </tr>\r\n\r\n <!-- FILTRES -->\r\n <tr *ngIf=\"options.filterable\" class=\"rowFilter\">\r\n\r\n <th class=\"cellDelete\" *ngIf=\"isModeCheckboxSelection()\"></th>\r\n\r\n <ng-container *ngFor=\"let col of columns\">\r\n <!-- Text -->\r\n <th *ngIf=\"checkType('Text', col) || checkType('File', col) || (checkType('Button', col) && col.options.filterCol)\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, 'width' : col.width ? col.width : null }\">\r\n <input pInputText\r\n type=\"text\"\r\n (input)=\"onFilterCol($event, col)\"\r\n [(ngModel)]=\"col.options.defaultFilters\">\r\n </th>\r\n\r\n <!-- Date -->\r\n <th *ngIf=\"checkType('Date', col)\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, 'width' : col.width ? col.width : null }\">\r\n <p-calendar dateFormat=\"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 [(ngModel)]=\"col.options.defaultFilters\">\r\n </p-calendar>\r\n </th>\r\n\r\n <!-- Number -->\r\n <th *ngIf=\"checkType('Number', col)\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, 'width' : col.width ? col.width : null }\">\r\n <p-inputNumber mode=\"decimal\"\r\n locale=\"fr-FR\"\r\n [minFractionDigits]=\"2\"\r\n [showButtons]=\"true\"\r\n (onInput)=\"onFilterCol($event, col)\"\r\n [(ngModel)]=\"col.options.defaultFilters\">\r\n </p-inputNumber>\r\n </th>\r\n\r\n <!-- Liste -->\r\n <th *ngIf=\"checkType('Dropdown', col) || checkType('MultiSelect', col) || checkType('SelectButton', col) || checkType('State', col)\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, 'width' : col.width ? col.width : null }\">\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 [virtualScroll]=\"true\"\r\n emptyFilterMessage=\"Aucun r\u00E9sultat\"\r\n emptyMessage=\"Aucun r\u00E9sultat\"\r\n itemSize=\"30\"\r\n selectedItemsLabel=\"{0} selectionn\u00E9s\"\r\n (onChange)=\"onFilterCol($event, col)\"\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 <ng-template let-group pTemplate=\"group\">\r\n <span>{{group[col.options.optionGroupLabel]}}</span>\r\n </ng-template>\r\n </p-multiSelect>\r\n </th>\r\n\r\n <!-- Switch -->\r\n <th *ngIf=\"checkType('Switch', col)\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, 'width' : col.width ? col.width : null }\">\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 itemSize=\"30\"\r\n selectedItemsLabel=\"{0} selectionn\u00E9s\"\r\n (onChange)=\"onFilterCol($event, col)\"\r\n [(ngModel)]=\"col.options.defaultFilters\">\r\n </p-multiSelect>\r\n </th>\r\n\r\n <!-- Non filtrable -->\r\n <th *ngIf=\"checkType('Image', col) || (checkType('Button', col) && !col.options.filterCol)\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, 'width' : col.width ? col.width : null }\">\r\n </th>\r\n </ng-container>\r\n <th class=\"cellDelete\" *ngIf=\"options.rowsDeletable\"></th>\r\n </tr>\r\n\r\n <!-- TOTAL -->\r\n <tr *ngIf=\"options.rowTotal\" class=\"rowTotal\">\r\n <th class=\"cellDelete\" *ngIf=\"isModeCheckboxSelection()\"></th>\r\n <th *ngFor=\"let col of columns\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, 'width' : col.width ? col.width : null }\"\r\n [ngClass]=\"{ 'centerText' : true }\">\r\n <span>{{ getTotal(col) }}</span>\r\n </th>\r\n <th class=\"cellDelete\" *ngIf=\"options.rowsDeletable\"></th>\r\n </tr>\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 + 1\">\r\n <span class=\"text_bold\">{{ rowData[options.grouping.obj][options.grouping.libelle] }}</span>\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 || isModeEdition()\">\r\n\r\n <td *ngIf=\"isModeCheckboxSelection()\" class=\"cellDelete\">\r\n <p-tableCheckbox [value]=\"rowData\"></p-tableCheckbox>\r\n </td>\r\n\r\n <ng-container *ngFor=\"let col of columns\">\r\n\r\n <!-- Text -->\r\n <td *ngIf=\"checkType('Text', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, '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].value\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <input pInputText\r\n type=\"text\"\r\n [(ngModel)]=\"rowData[col.id].value\"\r\n (change)=\"onEditCell(rowData, col, rowData[col.id].value)\"\r\n (keyup.enter)=\"onEditCell(rowData, col, rowData[col.id].value)\"\r\n (click)=\"onEditInitCell(rowData, col, rowData[col.id].value)\" />\r\n </td>\r\n <td *ngIf=\"checkType('Text', col) && (!isModeEdition() || rowData.readonly || rowData[col.id]?.readonly)\"\r\n [ngStyle]=\"{\r\n 'flex': col.width ? '0 0 auto' : null,\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 [ngClass]=\"{ 'paddingCell': rowData[col.id] != null }\"\r\n [pTooltip]=\"rowData[col.id].value\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <span *ngIf=\"rowData[col.id]\">{{ rowData[col.id].value }}</span>\r\n </td>\r\n\r\n <!-- Dropdown -->\r\n <td *ngIf=\"checkType('Dropdown', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, '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]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n [pTooltip]=\"rowData[col.id].value != null ? rowData[col.id].value[getOption(col, rowData, 'optionLabel')] : ''\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <p-dropdown *ngIf=\"rowData[col.id] != null\"\r\n 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 [autoDisplayFirst]=\"false\"\r\n appendTo=\"body\"\r\n emptyFilterMessage=\"Aucun r\u00E9sultat\"\r\n emptyMessage=\"Aucun r\u00E9sultat\"\r\n [baseZIndex]=\"getOption(col, rowData, 'baseZIndex')\"\r\n [virtualScroll]=\"getOption(col, rowData, 'virtualScroll')\"\r\n [readonly]=\"rowData.readonly || rowData[col.id]?.readonly\"\r\n itemSize=\"30\"\r\n (onChange)=\"onEditCell(rowData, col, rowData[col.id].value)\">\r\n </p-dropdown>\r\n </td>\r\n <td *ngIf=\"checkType('Dropdown', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())\"\r\n [ngStyle]=\"{\r\n 'flex': col.width ? '0 0 auto' : null,\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 [ngClass]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n [pTooltip]=\"rowData[col.id].value != null ? rowData[col.id].value[getOption(col, rowData, 'optionLabel')] : ''\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <span *ngIf=\"rowData[col.id]\">{{ rowData[col.id].value != null ? rowData[col.id].value[getOption(col, rowData, 'optionLabel')] : '' }}</span>\r\n </td>\r\n\r\n <!-- Number -->\r\n <td *ngIf=\"checkType('Number', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, '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]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n [pTooltip]=\"rowData[col.id].value | number\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <p-inputNumber *ngIf=\"rowData[col.id] && !rowData.readonly && !rowData[col.id]?.readonly\"\r\n locale=\"fr-FR\"\r\n (onInput)=\"onInputNumber($event)\"\r\n [(ngModel)]=\"rowData[col.id].value\"\r\n [showButtons]=\"getOption(col, rowData, 'showButtons')\"\r\n inputStyleClass=\"text-right\"\r\n [suffix]=\"getOption(col, rowData, 'suffix')\"\r\n [prefix]=\"getOption(col, rowData, 'prefix') != null ? getOption(col, rowData, 'prefix') + ' ' : null\"\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 (ngModelChange)=\"onEditCell(rowData, col, rowData[col.id].value)\"\r\n (onFocus)=\"onEditInitCell(rowData, col, rowData[col.id].value)\">\r\n </p-inputNumber>\r\n </td>\r\n <td *ngIf=\"checkType('Number', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())\"\r\n [ngStyle]=\"{\r\n 'flex': col.width ? '0 0 auto' : null,\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 [ngClass]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n [pTooltip]=\"rowData[col.id].value | number\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\"\r\n class=\"justify-content-end\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <span *ngIf=\"rowData[col.id]\">{{ getFormattedNumber(col, rowData, rowData[col.id].value | number) }}</span>\r\n </td>\r\n\r\n <!-- Date -->\r\n <td *ngIf=\"checkType('Date', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, '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]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n [pTooltip]=\"rowData[col.id].value | date: 'dd/MM/yyyy'\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <p-calendar [(ngModel)]=\"rowData[col.id].value\"\r\n dateFormat=\"dd/mm/yy\"\r\n firstDayOfWeek=\"1\"\r\n (onSelect)=\"onEditCell(rowData, col, rowData[col.id].value)\"\r\n [readonlyInput]=\"true\"\r\n appendTo=\"body\">\r\n </p-calendar>\r\n </td>\r\n <td *ngIf=\"checkType('Date', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())\"\r\n [ngStyle]=\"{\r\n 'flex': col.width ? '0 0 auto' : null,\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 [ngClass]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n [pTooltip]=\"rowData[col.id].value | date: 'dd/MM/yyyy'\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <span *ngIf=\"rowData[col.id]\">{{ rowData[col.id].value | date: 'dd/MM/yyyy' }}</span>\r\n </td>\r\n\r\n <!-- MultiSelect -->\r\n <td *ngIf=\"checkType('MultiSelect', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, '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]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n [pTooltip]=\"getMultiSelectConcat(rowData[col.id].value, getOption(col, rowData, 'optionLabel'))\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <p-multiSelect *ngIf=\"rowData[col.id] != null\"\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 appendTo=\"body\"\r\n dataKey=\"ID\"\r\n emptyFilterMessage=\"Aucun r\u00E9sultat\"\r\n emptyMessage=\"Aucun r\u00E9sultat\"\r\n [baseZIndex]=\"getOption(col, rowData, 'baseZIndex')\"\r\n [virtualScroll]=\"getOption(col, rowData, 'virtualScroll')\"\r\n [readonly]=\"rowData.readonly || rowData[col.id]?.readonly || !isModeEdition()\"\r\n itemSize=\"30\"\r\n selectedItemsLabel=\"{0} selectionn\u00E9s\"\r\n (onChange)=\"onEditCell(rowData, col, rowData[col.id].value)\"\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-group pTemplate=\"group\">\r\n <span>{{group[col.options.optionGroupLabel]}}</span>\r\n </ng-template>\r\n </p-multiSelect>\r\n </td>\r\n <td *ngIf=\"checkType('MultiSelect', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())\"\r\n [ngStyle]=\"{\r\n 'flex': col.width ? '0 0 auto' : null,\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 [ngClass]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n [pTooltip]=\"getMultiSelectConcat(rowData[col.id].value, getOption(col, rowData, 'optionLabel'))\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <span *ngIf=\"rowData[col.id]\">{{ getMultiSelectConcat(rowData[col.id].value, getOption(col, rowData, 'optionLabel')) }}</span>\r\n </td>\r\n\r\n <!-- Image -->\r\n <td *ngIf=\"checkType('Image', col)\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, '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]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n class=\"centerText\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <img *ngIf=\"rowData[col.id]\" style=\"vertical-align: middle; width: 40px;\" src=\"{{ rowData[col.id].value }}\" />\r\n </td>\r\n\r\n <!-- Button -->\r\n <td *ngIf=\"checkType('Button', col)\"\r\n class=\"paddingCell centerText\"\r\n [ngStyle]=\"{ 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <button pButton\r\n [disabled]=\"rowData.readonly || rowData[col.id]?.readonly\"\r\n [ngClass]=\"'p-button-' + getOption(col, rowData, 'severity')\"\r\n [label]=\"getOption(col, rowData, 'label')\"\r\n [icon]=\"getOption(col, rowData, 'icon')\"\r\n (click)=\"rowData[col.id].value()\"\r\n [pTooltip]=\"getOption(col, rowData, 'label')\"\r\n [tooltipDisabled]=\"!col.tooltip\">\r\n </button>\r\n </td>\r\n\r\n <!-- SelectButton -->\r\n <td *ngIf=\"checkType('SelectButton', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, '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]=\"rowData[col.id] != null ? 'paddingCell' : null\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <p-selectButton *ngIf=\"rowData[col.id] != null\"\r\n [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 [disabled]=\"rowData.readonly || rowData[col.id]?.readonly || !isModeEdition()\"\r\n (onChange)=\"onEditCell(rowData, col, rowData[col.id].value)\">\r\n </p-selectButton>\r\n </td>\r\n <td *ngIf=\"checkType('SelectButton', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())\"\r\n [ngStyle]=\"{\r\n 'flex': col.width ? '0 0 auto' : null,\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 [ngClass]=\"rowData[col.id] != null ? 'paddingCell' : null\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <span *ngIf=\"rowData[col.id]\">{{ getSelectLibelleByValue(rowData, col) }}</span>\r\n </td>\r\n\r\n <!-- Switch -->\r\n <td *ngIf=\"checkType('Switch', col)\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\r\n style=\"justify-content: center;\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [ngClass]=\"rowData[col.id] != null ? 'paddingCell' : null\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <p-inputSwitch *ngIf=\"rowData[col.id] != null\"\r\n [(ngModel)]=\"rowData[col.id].value\"\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-inputSwitch>\r\n </td>\r\n\r\n <!-- File -->\r\n <td *ngIf=\"checkType('File', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, '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]=\"rowData[col.id] != null ? 'paddingCell' : null\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <div class=\"p-inputgroup\" *ngIf=\"rowData[col.id] != null\">\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 value=\"{{ rowData[col.id].value != null ? rowData[col.id].value : '' }}\"\r\n readonly\r\n [pTooltip]=\"rowData[col.id].value ? rowData[col.id].value : ''\"\r\n [tooltipDisabled]=\"!col.tooltip\">\r\n <button *ngIf=\"getOption(col, rowData, 'downloadPath') && rowData[col.id].value != null\"\r\n 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 </div>\r\n <input *ngIf=\"rowData[col.id]\" 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 </td>\r\n <td *ngIf=\"checkType('File', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())\"\r\n [ngStyle]=\"{\r\n 'flex': col.width ? '0 0 auto' : null,\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 [ngClass]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n [pTooltip]=\"rowData[col.id].value ? rowData[col.id].value : ''\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <span *ngIf=\"rowData[col.id]\">{{ rowData[col.id].value ? rowData[col.id].value : '' }}</span>\r\n </td>\r\n\r\n <!-- State -->\r\n <td *ngIf=\"checkType('State', col)\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, '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]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n class=\"centerText\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\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 </p-tag>\r\n </td>\r\n\r\n </ng-container>\r\n\r\n <!-- Deletion -->\r\n <td *ngIf=\"options.rowsDeletable\"\r\n class=\"cellDelete\"\r\n [ngClass]=\"rowData.deletable ? 'paddingCell' : null\">\r\n <button *ngIf=\"rowData.deletable\"\r\n 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 </td>\r\n\r\n </tr>\r\n </ng-template>\r\n</p-table>\r\n", styles: ["::ng-deep .p-tooltip .p-tooltip-text{overflow-wrap:break-word!important}:host ::ng-deep .grid_brown .rowHeader>th{background-color:#795548}:host ::ng-deep .grid_brown .rowHeader>th span{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 span{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 .rowFilter th{background-color:#dedddd}: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-thead>tr>th>span{overflow:hidden!important;white-space:nowrap!important;text-overflow:ellipsis!important}:host ::ng-deep .p-datatable-tbody>tr>td>span{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}:host ::ng-deep .p-tooltip .p-tooltip-text{background-color:red!important}:host ::ng-deep .p-datatable-thead>tr>th{border:1px solid rgba(0,0,0,.12)!important;padding-bottom:8px!important;padding-top:8px!important;font-weight:600!important;overflow:hidden!important;white-space:nowrap!important;text-overflow:ellipsis!important;height:35px!important}:host ::ng-deep .p-datatable-tbody>tr{height:35px!important}:host ::ng-deep .p-datatable-tbody>tr>td{border:1px solid rgba(0,0,0,.12)!important;min-width:0!important;width:1px}:host ::ng-deep .centerText{justify-content:center!important}:host ::ng-deep .p-button{padding-top:1px;padding-bottom:1px}:host ::ng-deep .p-button-label{overflow:hidden!important;white-space:nowrap!important;text-overflow:ellipsis!important}:host ::ng-deep p-calendar,:host ::ng-deep p-inputNumber,:host ::ng-deep p-dropdown,:host ::ng-deep p-selectButton,:host ::ng-deep p-multiselect{width:100%!important}:host ::ng-deep .p-calendar{width:100%!important}:host ::ng-deep .p-inputtext{width:100%!important;height:25px!important;padding:4px 5px!important}:host ::ng-deep .p-inputnumber{width:100%;height:25px;padding:0!important}:host ::ng-deep .p-inputnumber-input{width:100%;padding:0 5px!important}:host ::ng-deep .p-inputgroup .p-inputtext{width:100%;height:25px;padding:4px 5px!important}:host ::ng-deep .p-dropdown{width:100%;vertical-align:middle}:host ::ng-deep .p-dropdown-label{padding-top:2px;padding-bottom:2px}:host ::ng-deep .p-multiselect{width:100%;vertical-align:middle}: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}@media screen and (max-width: 650px){:host ::ng-deep .p-datatable-thead>tr>th,:host ::ng-deep .p-datatable-tfoot>tr>td{display:none!important;width:inherit!important}:host ::ng-deep .p-datatable-tbody>tr{border:2px solid rgba(0,0,0,.12);flex-direction:column;height:inherit!important;padding-top:12px!important}:host ::ng-deep .p-datatable-tbody>tr>td{border:0!important;flex-basis:auto!important;width:100%!important}:host ::ng-deep td .p-column-title{padding:.4rem;min-width:35%;display:inline-block!important;margin:-.4rem 1rem -.4rem -.4rem;font-weight:700}:host ::ng-deep .centerText{justify-content:inherit!important}}\n"], components: [{ type: i2.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "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", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollDelay", "virtualRowHeight", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "minBufferPx", "maxBufferPx", "responsiveLayout", "breakpoint", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["selectAllChange", "selectionChange", "contextMenuSelectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { type: i2.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { type: i3.Calendar, selector: "p-calendar", inputs: ["style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "view", "defaultDate", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { type: i4.InputNumber, selector: "p-inputNumber", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "style", "placeholder", "size", "maxlength", "tabindex", "title", "ariaLabel", "ariaRequired", "name", "required", "autocomplete", "min", "max", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "readonly", "step", "allowEmpty", "locale", "localeMatcher", "mode", "currency", "currencyDisplay", "useGrouping", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "inputStyle", "inputStyleClass", "disabled"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown"] }, { type: i5.MultiSelect, selector: "p-multiSelect", inputs: ["style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "autoZIndex", "baseZIndex", "filterBy", "virtualScroll", "itemSize", "showTransitionOptions", "hideTransitionOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "scrollHeight", "defaultLabel", "placeholder", "options", "filterValue"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onPanelShow", "onPanelHide"] }, { type: i2.TableCheckbox, selector: "p-tableCheckbox", inputs: ["disabled", "value", "index", "inputId", "name", "required", "ariaLabel"] }, { type: i6.Dropdown, selector: "p-dropdown", inputs: ["scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "filterPlaceholder", "filterLocale", "inputId", "selectId", "dataKey", "filterBy", "autofocus", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "virtualScroll", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "ariaFilterLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "disabled", "options", "filterValue"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear"] }, { type: i7.SelectButton, selector: "p-selectButton", inputs: ["options", "optionLabel", "optionValue", "optionDisabled", "tabindex", "multiple", "style", "styleClass", "ariaLabelledBy", "disabled", "dataKey"], outputs: ["onOptionClick", "onChange"] }, { type: i8.InputSwitch, selector: "p-inputSwitch", inputs: ["style", "styleClass", "tabindex", "inputId", "name", "disabled", "readonly", "trueValue", "falseValue", "ariaLabelledBy"], outputs: ["onChange"] }, { type: i9.Tag, selector: "p-tag", inputs: ["styleClass", "style", "severity", "value", "icon", "rounded"] }], directives: [{ type: i1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i10.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i10.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { type: i11.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i12.InputText, selector: "[pInputText]" }, { type: i11.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i11.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i2.RowGroupHeader, selector: "[pRowGroupHeader]" }, { type: i2.SelectableRow, selector: "[pSelectableRow]", inputs: ["pSelectableRow", "pSelectableRowIndex", "pSelectableRowDisabled"] }, { type: i2.EditableColumn, selector: "[pEditableColumn]", inputs: ["pEditableColumn", "pEditableColumnField", "pEditableColumnRowIndex", "pEditableColumnDisabled", "pFocusCellSelector"] }, { type: i13.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { type: i14.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }], pipes: { "number": i10.DecimalPipe, "date": i10.DatePipe } });
|
|
347
|
+
CilogTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.0", type: CilogTableComponent, 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", onSort: "onSort", onPage: "onPage" }, viewQueries: [{ propertyName: "table", first: true, predicate: ["table"], descendants: true, static: true }], ngImport: i0, template: "<p-table #table\r\n [columns]=\"columns\"\r\n [value]=\"values\"\r\n dataKey=\"id\"\r\n [selectionMode]=\"options.selectable && !isModeEdition() && !isModeCheckboxSelection() ? 'single' : null\"\r\n [(selection)]=\"selectedRows\"\r\n (onRowSelect)=\"onSelectRow($event)\"\r\n (onRowUnselect)=\"onUnselectRow($event)\"\r\n (sortFunction)=\"customSort($event)\"\r\n [customSort]=\"options.grouping == null ? true : false\"\r\n [scrollable]=\"true\"\r\n [loading]=\"loading\"\r\n [scrollHeight]=\"options.scrollHeight != null ? options.scrollHeight : null\"\r\n [rowGroupMode]=\"options.grouping != null ? 'subheader' : null\"\r\n [groupRowsBy]=\"options.grouping != null ? options.grouping.obj + '.' + options.grouping.id : null\"\r\n [virtualScroll]=\"options.virtualScroll != null && options.scrollHeight != null ? true : false\"\r\n [virtualRowHeight]=\"35\"\r\n [paginator]=\"options.paginator == null ? false : true\"\r\n [rows]=\"options.paginatorRows\"\r\n (onPage)=\"onPageTable($event)\"\r\n (onFilter)=\"onFilterTable($event)\"\r\n [groupRowsByOrder]=\"0\"\r\n [tableStyleClass]=\"!options.themeGrille ? 'grid_grey' : options.themeGrille\">\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 <th class=\"cellDelete\" *ngIf=\"isModeCheckboxSelection()\">\r\n\r\n </th>\r\n <th *ngFor=\"let col of columns\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, 'width' : col.width ? col.width : null }\"\r\n [ngClass]=\"{ 'centerText' : options.centerHeaders }\"\r\n [pSortableColumn]=\"col.id\"\r\n [pSortableColumnDisabled]=\"!options.sortable || options.grouping != null\"\r\n id=\"{{ col.id }}\"\r\n (click)=\"refreshData()\">\r\n <span>{{ col.libelle }}</span>\r\n <p-sortIcon *ngIf=\"options.sortable && options.grouping == null\" [field]=\"col.id\"></p-sortIcon>\r\n </th>\r\n <th class=\"cellDelete\" *ngIf=\"options.rowsDeletable\"></th>\r\n </tr>\r\n\r\n <!-- FILTRES -->\r\n <tr *ngIf=\"options.filterable\" class=\"rowFilter\">\r\n\r\n <th class=\"cellDelete\" *ngIf=\"isModeCheckboxSelection()\"></th>\r\n\r\n <ng-container *ngFor=\"let col of columns\">\r\n <!-- Text -->\r\n <th *ngIf=\"checkType('Text', col) || checkType('File', col) || (checkType('Button', col) && col.options.filterCol)\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, 'width' : col.width ? col.width : null }\">\r\n <input pInputText\r\n type=\"text\"\r\n (input)=\"onFilterCol($event, col)\"\r\n [(ngModel)]=\"col.options.defaultFilters\">\r\n </th>\r\n\r\n <!-- Date -->\r\n <th *ngIf=\"checkType('Date', col)\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, 'width' : col.width ? col.width : null }\">\r\n <p-calendar dateFormat=\"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 [(ngModel)]=\"col.options.defaultFilters\">\r\n </p-calendar>\r\n </th>\r\n\r\n <!-- Number -->\r\n <th *ngIf=\"checkType('Number', col)\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, 'width' : col.width ? col.width : null }\">\r\n <p-inputNumber mode=\"decimal\"\r\n locale=\"fr-FR\"\r\n [minFractionDigits]=\"2\"\r\n [showButtons]=\"true\"\r\n (onInput)=\"onFilterCol($event, col)\"\r\n [(ngModel)]=\"col.options.defaultFilters\">\r\n </p-inputNumber>\r\n </th>\r\n\r\n <!-- Liste -->\r\n <th *ngIf=\"checkType('Dropdown', col) || checkType('MultiSelect', col) || checkType('SelectButton', col) || checkType('State', col)\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, 'width' : col.width ? col.width : null }\">\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 [virtualScroll]=\"true\"\r\n emptyFilterMessage=\"Aucun r\u00E9sultat\"\r\n emptyMessage=\"Aucun r\u00E9sultat\"\r\n itemSize=\"30\"\r\n selectedItemsLabel=\"{0} selectionn\u00E9s\"\r\n (onChange)=\"onFilterCol($event, col)\"\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 <ng-template let-group pTemplate=\"group\">\r\n <span>{{group[col.options.optionGroupLabel]}}</span>\r\n </ng-template>\r\n </p-multiSelect>\r\n </th>\r\n\r\n <!-- Switch -->\r\n <th *ngIf=\"checkType('Switch', col)\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, 'width' : col.width ? col.width : null }\">\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 itemSize=\"30\"\r\n selectedItemsLabel=\"{0} selectionn\u00E9s\"\r\n (onChange)=\"onFilterCol($event, col)\"\r\n [(ngModel)]=\"col.options.defaultFilters\">\r\n </p-multiSelect>\r\n </th>\r\n\r\n <!-- Non filtrable -->\r\n <th *ngIf=\"checkType('Image', col) || (checkType('Button', col) && !col.options.filterCol)\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, 'width' : col.width ? col.width : null }\">\r\n </th>\r\n </ng-container>\r\n <th class=\"cellDelete\" *ngIf=\"options.rowsDeletable\"></th>\r\n </tr>\r\n\r\n <!-- TOTAL -->\r\n <tr *ngIf=\"options.rowTotal\" class=\"rowTotal\">\r\n <th class=\"cellDelete\" *ngIf=\"isModeCheckboxSelection()\"></th>\r\n <th *ngFor=\"let col of columns\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, 'width' : col.width ? col.width : null }\"\r\n [ngClass]=\"{ 'centerText' : true }\">\r\n <span>{{ getTotal(col) }}</span>\r\n </th>\r\n <th class=\"cellDelete\" *ngIf=\"options.rowsDeletable\"></th>\r\n </tr>\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 + 1\">\r\n <span class=\"text_bold\">{{ rowData[options.grouping.obj][options.grouping.libelle] }}</span>\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 || isModeEdition()\">\r\n\r\n <td *ngIf=\"isModeCheckboxSelection()\" class=\"cellDelete\">\r\n <p-tableCheckbox [value]=\"rowData\"></p-tableCheckbox>\r\n </td>\r\n\r\n <ng-container *ngFor=\"let col of columns\">\r\n\r\n <!-- Text -->\r\n <td *ngIf=\"checkType('Text', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, '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].value\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <input pInputText\r\n type=\"text\"\r\n [(ngModel)]=\"rowData[col.id].value\"\r\n (change)=\"onEditCell(rowData, col, rowData[col.id].value)\"\r\n (keyup.enter)=\"onEditCell(rowData, col, rowData[col.id].value)\"\r\n (click)=\"onEditInitCell(rowData, col, rowData[col.id].value)\" />\r\n </td>\r\n <td *ngIf=\"checkType('Text', col) && (!isModeEdition() || rowData.readonly || rowData[col.id]?.readonly)\"\r\n [ngStyle]=\"{\r\n 'flex': col.width ? '0 0 auto' : null,\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 [ngClass]=\"{ 'paddingCell': rowData[col.id] != null }\"\r\n [pTooltip]=\"rowData[col.id].value\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <span *ngIf=\"rowData[col.id]\">{{ rowData[col.id].value }}</span>\r\n </td>\r\n\r\n <!-- Dropdown -->\r\n <td *ngIf=\"checkType('Dropdown', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, '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]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n [pTooltip]=\"rowData[col.id].value != null ? rowData[col.id].value[getOption(col, rowData, 'optionLabel')] : ''\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <p-dropdown *ngIf=\"rowData[col.id] != null\"\r\n 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 [autoDisplayFirst]=\"false\"\r\n appendTo=\"body\"\r\n emptyFilterMessage=\"Aucun r\u00E9sultat\"\r\n emptyMessage=\"Aucun r\u00E9sultat\"\r\n [baseZIndex]=\"getOption(col, rowData, 'baseZIndex')\"\r\n [virtualScroll]=\"getOption(col, rowData, 'virtualScroll')\"\r\n [readonly]=\"rowData.readonly || rowData[col.id]?.readonly\"\r\n itemSize=\"30\"\r\n (onChange)=\"onEditCell(rowData, col, rowData[col.id].value)\">\r\n </p-dropdown>\r\n </td>\r\n <td *ngIf=\"checkType('Dropdown', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())\"\r\n [ngStyle]=\"{\r\n 'flex': col.width ? '0 0 auto' : null,\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 [ngClass]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n [pTooltip]=\"rowData[col.id].value != null ? rowData[col.id].value[getOption(col, rowData, 'optionLabel')] : ''\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <span *ngIf=\"rowData[col.id]\">{{ rowData[col.id].value != null ? rowData[col.id].value[getOption(col, rowData, 'optionLabel')] : '' }}</span>\r\n </td>\r\n\r\n <!-- Number -->\r\n <td *ngIf=\"checkType('Number', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, '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]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n [pTooltip]=\"rowData[col.id].value | number\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <p-inputNumber *ngIf=\"rowData[col.id] && !rowData.readonly && !rowData[col.id]?.readonly\"\r\n locale=\"fr-FR\"\r\n (onInput)=\"onInputNumber($event)\"\r\n [(ngModel)]=\"rowData[col.id].value\"\r\n [showButtons]=\"getOption(col, rowData, 'showButtons')\"\r\n inputStyleClass=\"text-right\"\r\n [suffix]=\"getOption(col, rowData, 'suffix')\"\r\n [prefix]=\"getOption(col, rowData, 'prefix') != null ? getOption(col, rowData, 'prefix') + ' ' : null\"\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 (ngModelChange)=\"onEditCell(rowData, col, rowData[col.id].value)\"\r\n (onFocus)=\"onEditInitCell(rowData, col, rowData[col.id].value)\">\r\n </p-inputNumber>\r\n </td>\r\n <td *ngIf=\"checkType('Number', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())\"\r\n [ngStyle]=\"{\r\n 'flex': col.width ? '0 0 auto' : null,\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 [ngClass]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n [pTooltip]=\"rowData[col.id].value | number\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\"\r\n class=\"justify-content-end\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <span *ngIf=\"rowData[col.id]\">{{ getFormattedNumber(col, rowData, rowData[col.id].value | number) }}</span>\r\n </td>\r\n\r\n <!-- Date -->\r\n <td *ngIf=\"checkType('Date', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, '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]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n [pTooltip]=\"rowData[col.id].value | date: 'dd/MM/yyyy'\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <p-calendar [(ngModel)]=\"rowData[col.id].value\"\r\n dateFormat=\"dd/mm/yy\"\r\n firstDayOfWeek=\"1\"\r\n (onSelect)=\"onEditCell(rowData, col, rowData[col.id].value)\"\r\n [readonlyInput]=\"true\"\r\n appendTo=\"body\">\r\n </p-calendar>\r\n </td>\r\n <td *ngIf=\"checkType('Date', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())\"\r\n [ngStyle]=\"{\r\n 'flex': col.width ? '0 0 auto' : null,\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 [ngClass]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n [pTooltip]=\"rowData[col.id].value | date: 'dd/MM/yyyy'\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <span *ngIf=\"rowData[col.id]\">{{ rowData[col.id].value | date: 'dd/MM/yyyy' }}</span>\r\n </td>\r\n\r\n <!-- MultiSelect -->\r\n <td *ngIf=\"checkType('MultiSelect', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, '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]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n [pTooltip]=\"getMultiSelectConcat(rowData[col.id].value, getOption(col, rowData, 'optionLabel'))\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <p-multiSelect *ngIf=\"rowData[col.id] != null\"\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 appendTo=\"body\"\r\n dataKey=\"ID\"\r\n emptyFilterMessage=\"Aucun r\u00E9sultat\"\r\n emptyMessage=\"Aucun r\u00E9sultat\"\r\n [baseZIndex]=\"getOption(col, rowData, 'baseZIndex')\"\r\n [virtualScroll]=\"getOption(col, rowData, 'virtualScroll')\"\r\n [readonly]=\"rowData.readonly || rowData[col.id]?.readonly || !isModeEdition()\"\r\n itemSize=\"30\"\r\n selectedItemsLabel=\"{0} selectionn\u00E9s\"\r\n (onChange)=\"onEditCell(rowData, col, rowData[col.id].value)\"\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-group pTemplate=\"group\">\r\n <span>{{group[col.options.optionGroupLabel]}}</span>\r\n </ng-template>\r\n </p-multiSelect>\r\n </td>\r\n <td *ngIf=\"checkType('MultiSelect', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())\"\r\n [ngStyle]=\"{\r\n 'flex': col.width ? '0 0 auto' : null,\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 [ngClass]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n [pTooltip]=\"getMultiSelectConcat(rowData[col.id].value, getOption(col, rowData, 'optionLabel'))\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <span *ngIf=\"rowData[col.id]\">{{ getMultiSelectConcat(rowData[col.id].value, getOption(col, rowData, 'optionLabel')) }}</span>\r\n </td>\r\n\r\n <!-- Image -->\r\n <td *ngIf=\"checkType('Image', col)\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, '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]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n class=\"centerText\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <img *ngIf=\"rowData[col.id]\" style=\"vertical-align: middle; width: 40px;\" src=\"{{ rowData[col.id].value }}\" />\r\n </td>\r\n\r\n <!-- Button -->\r\n <td *ngIf=\"checkType('Button', col)\"\r\n class=\"paddingCell centerText\"\r\n [ngStyle]=\"{ 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <button pButton\r\n [disabled]=\"rowData.readonly || rowData[col.id]?.readonly\"\r\n [ngClass]=\"'p-button-' + getOption(col, rowData, 'severity')\"\r\n [label]=\"getOption(col, rowData, 'label')\"\r\n [icon]=\"getOption(col, rowData, 'icon')\"\r\n (click)=\"rowData[col.id].value()\"\r\n [pTooltip]=\"getOption(col, rowData, 'label')\"\r\n [tooltipDisabled]=\"!col.tooltip\">\r\n </button>\r\n </td>\r\n\r\n <!-- SelectButton -->\r\n <td *ngIf=\"checkType('SelectButton', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, '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]=\"rowData[col.id] != null ? 'paddingCell' : null\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <p-selectButton *ngIf=\"rowData[col.id] != null\"\r\n [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 [disabled]=\"rowData.readonly || rowData[col.id]?.readonly || !isModeEdition()\"\r\n (onChange)=\"onEditCell(rowData, col, rowData[col.id].value)\">\r\n </p-selectButton>\r\n </td>\r\n <td *ngIf=\"checkType('SelectButton', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())\"\r\n [ngStyle]=\"{\r\n 'flex': col.width ? '0 0 auto' : null,\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 [ngClass]=\"rowData[col.id] != null ? 'paddingCell' : null\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <span *ngIf=\"rowData[col.id]\">{{ getSelectLibelleByValue(rowData, col) }}</span>\r\n </td>\r\n\r\n <!-- Switch -->\r\n <td *ngIf=\"checkType('Switch', col)\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\r\n style=\"justify-content: center;\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [ngClass]=\"rowData[col.id] != null ? 'paddingCell' : null\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <p-inputSwitch *ngIf=\"rowData[col.id] != null\"\r\n [(ngModel)]=\"rowData[col.id].value\"\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-inputSwitch>\r\n </td>\r\n\r\n <!-- File -->\r\n <td *ngIf=\"checkType('File', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, '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]=\"rowData[col.id] != null ? 'paddingCell' : null\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <div class=\"p-inputgroup\" *ngIf=\"rowData[col.id] != null\">\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 value=\"{{ rowData[col.id].value != null ? rowData[col.id].value : '' }}\"\r\n readonly\r\n [pTooltip]=\"rowData[col.id].value ? rowData[col.id].value : ''\"\r\n [tooltipDisabled]=\"!col.tooltip\">\r\n <button *ngIf=\"getOption(col, rowData, 'downloadPath') && rowData[col.id].value != null\"\r\n 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 </div>\r\n <input *ngIf=\"rowData[col.id]\" 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 </td>\r\n <td *ngIf=\"checkType('File', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())\"\r\n [ngStyle]=\"{\r\n 'flex': col.width ? '0 0 auto' : null,\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 [ngClass]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n [pTooltip]=\"rowData[col.id].value ? rowData[col.id].value : ''\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <span *ngIf=\"rowData[col.id]\">{{ rowData[col.id].value ? rowData[col.id].value : '' }}</span>\r\n </td>\r\n\r\n <!-- State -->\r\n <td *ngIf=\"checkType('State', col)\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, '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]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n class=\"centerText\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\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 </p-tag>\r\n </td>\r\n\r\n </ng-container>\r\n\r\n <!-- Deletion -->\r\n <td *ngIf=\"options.rowsDeletable\"\r\n class=\"cellDelete\"\r\n [ngClass]=\"rowData.deletable ? 'paddingCell' : null\">\r\n <button *ngIf=\"rowData.deletable\"\r\n 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 </td>\r\n\r\n </tr>\r\n </ng-template>\r\n</p-table>\r\n", styles: ["::ng-deep .p-tooltip .p-tooltip-text{overflow-wrap:break-word!important}:host ::ng-deep .grid_brown .rowHeader>th{background-color:#795548}:host ::ng-deep .grid_brown .rowHeader>th span{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 span{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 span{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 span{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 .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-thead>tr>th>span{overflow:hidden!important;white-space:nowrap!important;text-overflow:ellipsis!important}:host ::ng-deep .p-datatable-tbody>tr>td>span{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}:host ::ng-deep .p-tooltip .p-tooltip-text{background-color:red!important}:host ::ng-deep .p-datatable-thead>tr>th{border:1px solid rgba(0,0,0,.12)!important;padding-bottom:8px!important;padding-top:8px!important;font-weight:600!important;overflow:hidden!important;white-space:nowrap!important;text-overflow:ellipsis!important;height:35px!important}:host ::ng-deep .p-datatable-tbody>tr{height:35px!important}:host ::ng-deep .p-datatable-tbody>tr>td{border:1px solid rgba(0,0,0,.12)!important;min-width:0!important;width:1px}:host ::ng-deep .centerText{justify-content:center!important}:host ::ng-deep .p-button{padding-top:1px;padding-bottom:1px}:host ::ng-deep .p-button-label{overflow:hidden!important;white-space:nowrap!important;text-overflow:ellipsis!important}:host ::ng-deep p-calendar,:host ::ng-deep p-inputNumber,:host ::ng-deep p-dropdown,:host ::ng-deep p-selectButton,:host ::ng-deep p-multiselect{width:100%!important}:host ::ng-deep .p-calendar{width:100%!important}:host ::ng-deep .p-inputtext{width:100%!important;height:25px!important;padding:4px 5px!important}:host ::ng-deep .p-inputnumber{width:100%;height:25px;padding:0!important}:host ::ng-deep .p-inputnumber-input{width:100%;padding:0 5px!important}:host ::ng-deep .p-inputgroup .p-inputtext{width:100%;height:25px;padding:4px 5px!important}:host ::ng-deep .p-dropdown{width:100%;vertical-align:middle}:host ::ng-deep .p-dropdown-label{padding-top:2px;padding-bottom:2px}:host ::ng-deep .p-multiselect{width:100%;vertical-align:middle}: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}@media screen and (max-width: 650px){:host ::ng-deep .p-datatable-thead>tr>th,:host ::ng-deep .p-datatable-tfoot>tr>td{display:none!important;width:inherit!important}:host ::ng-deep .p-datatable-tbody>tr{border:2px solid rgba(0,0,0,.12);flex-direction:column;height:inherit!important;padding-top:12px!important}:host ::ng-deep .p-datatable-tbody>tr>td{border:0!important;flex-basis:auto!important;width:100%!important}:host ::ng-deep td .p-column-title{padding:.4rem;min-width:35%;display:inline-block!important;margin:-.4rem 1rem -.4rem -.4rem;font-weight:700}:host ::ng-deep .centerText{justify-content:inherit!important}}\n"], components: [{ type: i2.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "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", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollDelay", "virtualRowHeight", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "minBufferPx", "maxBufferPx", "responsiveLayout", "breakpoint", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["selectAllChange", "selectionChange", "contextMenuSelectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { type: i2.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { type: i3.Calendar, selector: "p-calendar", inputs: ["style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "view", "defaultDate", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { type: i4.InputNumber, selector: "p-inputNumber", inputs: ["showButtons", "format", "buttonLayout", "inputId", "styleClass", "style", "placeholder", "size", "maxlength", "tabindex", "title", "ariaLabel", "ariaRequired", "name", "required", "autocomplete", "min", "max", "incrementButtonClass", "decrementButtonClass", "incrementButtonIcon", "decrementButtonIcon", "readonly", "step", "allowEmpty", "locale", "localeMatcher", "mode", "currency", "currencyDisplay", "useGrouping", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "inputStyle", "inputStyleClass", "disabled"], outputs: ["onInput", "onFocus", "onBlur", "onKeyDown"] }, { type: i5.MultiSelect, selector: "p-multiSelect", inputs: ["style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "autoZIndex", "baseZIndex", "filterBy", "virtualScroll", "itemSize", "showTransitionOptions", "hideTransitionOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "scrollHeight", "defaultLabel", "placeholder", "options", "filterValue"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onPanelShow", "onPanelHide"] }, { type: i2.TableCheckbox, selector: "p-tableCheckbox", inputs: ["disabled", "value", "index", "inputId", "name", "required", "ariaLabel"] }, { type: i6.Dropdown, selector: "p-dropdown", inputs: ["scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "filterPlaceholder", "filterLocale", "inputId", "selectId", "dataKey", "filterBy", "autofocus", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "virtualScroll", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "ariaFilterLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "disabled", "options", "filterValue"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear"] }, { type: i7.SelectButton, selector: "p-selectButton", inputs: ["options", "optionLabel", "optionValue", "optionDisabled", "tabindex", "multiple", "style", "styleClass", "ariaLabelledBy", "disabled", "dataKey"], outputs: ["onOptionClick", "onChange"] }, { type: i8.InputSwitch, selector: "p-inputSwitch", inputs: ["style", "styleClass", "tabindex", "inputId", "name", "disabled", "readonly", "trueValue", "falseValue", "ariaLabelledBy"], outputs: ["onChange"] }, { type: i9.Tag, selector: "p-tag", inputs: ["styleClass", "style", "severity", "value", "icon", "rounded"] }], directives: [{ type: i1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i10.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { type: i10.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { type: i11.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i12.InputText, selector: "[pInputText]" }, { type: i11.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i11.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i2.RowGroupHeader, selector: "[pRowGroupHeader]" }, { type: i2.SelectableRow, selector: "[pSelectableRow]", inputs: ["pSelectableRow", "pSelectableRowIndex", "pSelectableRowDisabled"] }, { type: i2.EditableColumn, selector: "[pEditableColumn]", inputs: ["pEditableColumn", "pEditableColumnField", "pEditableColumnRowIndex", "pEditableColumnDisabled", "pFocusCellSelector"] }, { type: i13.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { type: i14.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }], pipes: { "number": i10.DecimalPipe, "date": i10.DatePipe } });
|
|
348
348
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.0", ngImport: i0, type: CilogTableComponent, decorators: [{
|
|
349
349
|
type: Component,
|
|
350
|
-
args: [{ selector: 'cilog-table', template: "<p-table #table\r\n [columns]=\"columns\"\r\n [value]=\"values\"\r\n dataKey=\"id\"\r\n [selectionMode]=\"options.selectable && !isModeEdition() && !isModeCheckboxSelection() ? 'single' : null\"\r\n [(selection)]=\"selectedRows\"\r\n (onRowSelect)=\"onSelectRow($event)\"\r\n (onRowUnselect)=\"onUnselectRow($event)\"\r\n (sortFunction)=\"customSort($event)\"\r\n [customSort]=\"options.grouping == null ? true : false\"\r\n [scrollable]=\"true\"\r\n [loading]=\"loading\"\r\n [scrollHeight]=\"options.scrollHeight != null ? options.scrollHeight : null\"\r\n [rowGroupMode]=\"options.grouping != null ? 'subheader' : null\"\r\n [groupRowsBy]=\"options.grouping != null ? options.grouping.obj + '.' + options.grouping.id : null\"\r\n [virtualScroll]=\"options.virtualScroll != null && options.scrollHeight != null ? true : false\"\r\n [virtualRowHeight]=\"35\"\r\n [paginator]=\"options.paginator == null ? false : true\"\r\n [rows]=\"options.paginatorRows\"\r\n (onPage)=\"onPageTable($event)\"\r\n (onFilter)=\"onFilterTable($event)\"\r\n [groupRowsByOrder]=\"0\"\r\n [tableStyleClass]=\"!options.themeGrille ? 'grid_grey' : options.themeGrille\">\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 <th class=\"cellDelete\" *ngIf=\"isModeCheckboxSelection()\">\r\n\r\n </th>\r\n <th *ngFor=\"let col of columns\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, 'width' : col.width ? col.width : null }\"\r\n [ngClass]=\"{ 'centerText' : options.centerHeaders }\"\r\n [pSortableColumn]=\"col.id\"\r\n [pSortableColumnDisabled]=\"!options.sortable || options.grouping != null\"\r\n id=\"{{ col.id }}\"\r\n (click)=\"refreshData()\">\r\n <span>{{ col.libelle }}</span>\r\n <p-sortIcon *ngIf=\"options.sortable && options.grouping == null\" [field]=\"col.id\"></p-sortIcon>\r\n </th>\r\n <th class=\"cellDelete\" *ngIf=\"options.rowsDeletable\"></th>\r\n </tr>\r\n\r\n <!-- FILTRES -->\r\n <tr *ngIf=\"options.filterable\" class=\"rowFilter\">\r\n\r\n <th class=\"cellDelete\" *ngIf=\"isModeCheckboxSelection()\"></th>\r\n\r\n <ng-container *ngFor=\"let col of columns\">\r\n <!-- Text -->\r\n <th *ngIf=\"checkType('Text', col) || checkType('File', col) || (checkType('Button', col) && col.options.filterCol)\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, 'width' : col.width ? col.width : null }\">\r\n <input pInputText\r\n type=\"text\"\r\n (input)=\"onFilterCol($event, col)\"\r\n [(ngModel)]=\"col.options.defaultFilters\">\r\n </th>\r\n\r\n <!-- Date -->\r\n <th *ngIf=\"checkType('Date', col)\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, 'width' : col.width ? col.width : null }\">\r\n <p-calendar dateFormat=\"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 [(ngModel)]=\"col.options.defaultFilters\">\r\n </p-calendar>\r\n </th>\r\n\r\n <!-- Number -->\r\n <th *ngIf=\"checkType('Number', col)\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, 'width' : col.width ? col.width : null }\">\r\n <p-inputNumber mode=\"decimal\"\r\n locale=\"fr-FR\"\r\n [minFractionDigits]=\"2\"\r\n [showButtons]=\"true\"\r\n (onInput)=\"onFilterCol($event, col)\"\r\n [(ngModel)]=\"col.options.defaultFilters\">\r\n </p-inputNumber>\r\n </th>\r\n\r\n <!-- Liste -->\r\n <th *ngIf=\"checkType('Dropdown', col) || checkType('MultiSelect', col) || checkType('SelectButton', col) || checkType('State', col)\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, 'width' : col.width ? col.width : null }\">\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 [virtualScroll]=\"true\"\r\n emptyFilterMessage=\"Aucun r\u00E9sultat\"\r\n emptyMessage=\"Aucun r\u00E9sultat\"\r\n itemSize=\"30\"\r\n selectedItemsLabel=\"{0} selectionn\u00E9s\"\r\n (onChange)=\"onFilterCol($event, col)\"\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 <ng-template let-group pTemplate=\"group\">\r\n <span>{{group[col.options.optionGroupLabel]}}</span>\r\n </ng-template>\r\n </p-multiSelect>\r\n </th>\r\n\r\n <!-- Switch -->\r\n <th *ngIf=\"checkType('Switch', col)\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, 'width' : col.width ? col.width : null }\">\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 itemSize=\"30\"\r\n selectedItemsLabel=\"{0} selectionn\u00E9s\"\r\n (onChange)=\"onFilterCol($event, col)\"\r\n [(ngModel)]=\"col.options.defaultFilters\">\r\n </p-multiSelect>\r\n </th>\r\n\r\n <!-- Non filtrable -->\r\n <th *ngIf=\"checkType('Image', col) || (checkType('Button', col) && !col.options.filterCol)\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, 'width' : col.width ? col.width : null }\">\r\n </th>\r\n </ng-container>\r\n <th class=\"cellDelete\" *ngIf=\"options.rowsDeletable\"></th>\r\n </tr>\r\n\r\n <!-- TOTAL -->\r\n <tr *ngIf=\"options.rowTotal\" class=\"rowTotal\">\r\n <th class=\"cellDelete\" *ngIf=\"isModeCheckboxSelection()\"></th>\r\n <th *ngFor=\"let col of columns\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, 'width' : col.width ? col.width : null }\"\r\n [ngClass]=\"{ 'centerText' : true }\">\r\n <span>{{ getTotal(col) }}</span>\r\n </th>\r\n <th class=\"cellDelete\" *ngIf=\"options.rowsDeletable\"></th>\r\n </tr>\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 + 1\">\r\n <span class=\"text_bold\">{{ rowData[options.grouping.obj][options.grouping.libelle] }}</span>\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 || isModeEdition()\">\r\n\r\n <td *ngIf=\"isModeCheckboxSelection()\" class=\"cellDelete\">\r\n <p-tableCheckbox [value]=\"rowData\"></p-tableCheckbox>\r\n </td>\r\n\r\n <ng-container *ngFor=\"let col of columns\">\r\n\r\n <!-- Text -->\r\n <td *ngIf=\"checkType('Text', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, '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].value\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <input pInputText\r\n type=\"text\"\r\n [(ngModel)]=\"rowData[col.id].value\"\r\n (change)=\"onEditCell(rowData, col, rowData[col.id].value)\"\r\n (keyup.enter)=\"onEditCell(rowData, col, rowData[col.id].value)\"\r\n (click)=\"onEditInitCell(rowData, col, rowData[col.id].value)\" />\r\n </td>\r\n <td *ngIf=\"checkType('Text', col) && (!isModeEdition() || rowData.readonly || rowData[col.id]?.readonly)\"\r\n [ngStyle]=\"{\r\n 'flex': col.width ? '0 0 auto' : null,\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 [ngClass]=\"{ 'paddingCell': rowData[col.id] != null }\"\r\n [pTooltip]=\"rowData[col.id].value\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <span *ngIf=\"rowData[col.id]\">{{ rowData[col.id].value }}</span>\r\n </td>\r\n\r\n <!-- Dropdown -->\r\n <td *ngIf=\"checkType('Dropdown', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, '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]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n [pTooltip]=\"rowData[col.id].value != null ? rowData[col.id].value[getOption(col, rowData, 'optionLabel')] : ''\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <p-dropdown *ngIf=\"rowData[col.id] != null\"\r\n 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 [autoDisplayFirst]=\"false\"\r\n appendTo=\"body\"\r\n emptyFilterMessage=\"Aucun r\u00E9sultat\"\r\n emptyMessage=\"Aucun r\u00E9sultat\"\r\n [baseZIndex]=\"getOption(col, rowData, 'baseZIndex')\"\r\n [virtualScroll]=\"getOption(col, rowData, 'virtualScroll')\"\r\n [readonly]=\"rowData.readonly || rowData[col.id]?.readonly\"\r\n itemSize=\"30\"\r\n (onChange)=\"onEditCell(rowData, col, rowData[col.id].value)\">\r\n </p-dropdown>\r\n </td>\r\n <td *ngIf=\"checkType('Dropdown', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())\"\r\n [ngStyle]=\"{\r\n 'flex': col.width ? '0 0 auto' : null,\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 [ngClass]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n [pTooltip]=\"rowData[col.id].value != null ? rowData[col.id].value[getOption(col, rowData, 'optionLabel')] : ''\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <span *ngIf=\"rowData[col.id]\">{{ rowData[col.id].value != null ? rowData[col.id].value[getOption(col, rowData, 'optionLabel')] : '' }}</span>\r\n </td>\r\n\r\n <!-- Number -->\r\n <td *ngIf=\"checkType('Number', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, '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]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n [pTooltip]=\"rowData[col.id].value | number\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <p-inputNumber *ngIf=\"rowData[col.id] && !rowData.readonly && !rowData[col.id]?.readonly\"\r\n locale=\"fr-FR\"\r\n (onInput)=\"onInputNumber($event)\"\r\n [(ngModel)]=\"rowData[col.id].value\"\r\n [showButtons]=\"getOption(col, rowData, 'showButtons')\"\r\n inputStyleClass=\"text-right\"\r\n [suffix]=\"getOption(col, rowData, 'suffix')\"\r\n [prefix]=\"getOption(col, rowData, 'prefix') != null ? getOption(col, rowData, 'prefix') + ' ' : null\"\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 (ngModelChange)=\"onEditCell(rowData, col, rowData[col.id].value)\"\r\n (onFocus)=\"onEditInitCell(rowData, col, rowData[col.id].value)\">\r\n </p-inputNumber>\r\n </td>\r\n <td *ngIf=\"checkType('Number', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())\"\r\n [ngStyle]=\"{\r\n 'flex': col.width ? '0 0 auto' : null,\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 [ngClass]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n [pTooltip]=\"rowData[col.id].value | number\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\"\r\n class=\"justify-content-end\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <span *ngIf=\"rowData[col.id]\">{{ getFormattedNumber(col, rowData, rowData[col.id].value | number) }}</span>\r\n </td>\r\n\r\n <!-- Date -->\r\n <td *ngIf=\"checkType('Date', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, '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]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n [pTooltip]=\"rowData[col.id].value | date: 'dd/MM/yyyy'\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <p-calendar [(ngModel)]=\"rowData[col.id].value\"\r\n dateFormat=\"dd/mm/yy\"\r\n firstDayOfWeek=\"1\"\r\n (onSelect)=\"onEditCell(rowData, col, rowData[col.id].value)\"\r\n [readonlyInput]=\"true\"\r\n appendTo=\"body\">\r\n </p-calendar>\r\n </td>\r\n <td *ngIf=\"checkType('Date', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())\"\r\n [ngStyle]=\"{\r\n 'flex': col.width ? '0 0 auto' : null,\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 [ngClass]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n [pTooltip]=\"rowData[col.id].value | date: 'dd/MM/yyyy'\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <span *ngIf=\"rowData[col.id]\">{{ rowData[col.id].value | date: 'dd/MM/yyyy' }}</span>\r\n </td>\r\n\r\n <!-- MultiSelect -->\r\n <td *ngIf=\"checkType('MultiSelect', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, '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]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n [pTooltip]=\"getMultiSelectConcat(rowData[col.id].value, getOption(col, rowData, 'optionLabel'))\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <p-multiSelect *ngIf=\"rowData[col.id] != null\"\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 appendTo=\"body\"\r\n dataKey=\"ID\"\r\n emptyFilterMessage=\"Aucun r\u00E9sultat\"\r\n emptyMessage=\"Aucun r\u00E9sultat\"\r\n [baseZIndex]=\"getOption(col, rowData, 'baseZIndex')\"\r\n [virtualScroll]=\"getOption(col, rowData, 'virtualScroll')\"\r\n [readonly]=\"rowData.readonly || rowData[col.id]?.readonly || !isModeEdition()\"\r\n itemSize=\"30\"\r\n selectedItemsLabel=\"{0} selectionn\u00E9s\"\r\n (onChange)=\"onEditCell(rowData, col, rowData[col.id].value)\"\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-group pTemplate=\"group\">\r\n <span>{{group[col.options.optionGroupLabel]}}</span>\r\n </ng-template>\r\n </p-multiSelect>\r\n </td>\r\n <td *ngIf=\"checkType('MultiSelect', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())\"\r\n [ngStyle]=\"{\r\n 'flex': col.width ? '0 0 auto' : null,\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 [ngClass]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n [pTooltip]=\"getMultiSelectConcat(rowData[col.id].value, getOption(col, rowData, 'optionLabel'))\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <span *ngIf=\"rowData[col.id]\">{{ getMultiSelectConcat(rowData[col.id].value, getOption(col, rowData, 'optionLabel')) }}</span>\r\n </td>\r\n\r\n <!-- Image -->\r\n <td *ngIf=\"checkType('Image', col)\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, '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]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n class=\"centerText\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <img *ngIf=\"rowData[col.id]\" style=\"vertical-align: middle; width: 40px;\" src=\"{{ rowData[col.id].value }}\" />\r\n </td>\r\n\r\n <!-- Button -->\r\n <td *ngIf=\"checkType('Button', col)\"\r\n class=\"paddingCell centerText\"\r\n [ngStyle]=\"{ 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <button pButton\r\n [disabled]=\"rowData.readonly || rowData[col.id]?.readonly\"\r\n [ngClass]=\"'p-button-' + getOption(col, rowData, 'severity')\"\r\n [label]=\"getOption(col, rowData, 'label')\"\r\n [icon]=\"getOption(col, rowData, 'icon')\"\r\n (click)=\"rowData[col.id].value()\"\r\n [pTooltip]=\"getOption(col, rowData, 'label')\"\r\n [tooltipDisabled]=\"!col.tooltip\">\r\n </button>\r\n </td>\r\n\r\n <!-- SelectButton -->\r\n <td *ngIf=\"checkType('SelectButton', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, '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]=\"rowData[col.id] != null ? 'paddingCell' : null\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <p-selectButton *ngIf=\"rowData[col.id] != null\"\r\n [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 [disabled]=\"rowData.readonly || rowData[col.id]?.readonly || !isModeEdition()\"\r\n (onChange)=\"onEditCell(rowData, col, rowData[col.id].value)\">\r\n </p-selectButton>\r\n </td>\r\n <td *ngIf=\"checkType('SelectButton', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())\"\r\n [ngStyle]=\"{\r\n 'flex': col.width ? '0 0 auto' : null,\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 [ngClass]=\"rowData[col.id] != null ? 'paddingCell' : null\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <span *ngIf=\"rowData[col.id]\">{{ getSelectLibelleByValue(rowData, col) }}</span>\r\n </td>\r\n\r\n <!-- Switch -->\r\n <td *ngIf=\"checkType('Switch', col)\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\r\n style=\"justify-content: center;\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [ngClass]=\"rowData[col.id] != null ? 'paddingCell' : null\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <p-inputSwitch *ngIf=\"rowData[col.id] != null\"\r\n [(ngModel)]=\"rowData[col.id].value\"\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-inputSwitch>\r\n </td>\r\n\r\n <!-- File -->\r\n <td *ngIf=\"checkType('File', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, '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]=\"rowData[col.id] != null ? 'paddingCell' : null\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <div class=\"p-inputgroup\" *ngIf=\"rowData[col.id] != null\">\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 value=\"{{ rowData[col.id].value != null ? rowData[col.id].value : '' }}\"\r\n readonly\r\n [pTooltip]=\"rowData[col.id].value ? rowData[col.id].value : ''\"\r\n [tooltipDisabled]=\"!col.tooltip\">\r\n <button *ngIf=\"getOption(col, rowData, 'downloadPath') && rowData[col.id].value != null\"\r\n 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 </div>\r\n <input *ngIf=\"rowData[col.id]\" 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 </td>\r\n <td *ngIf=\"checkType('File', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())\"\r\n [ngStyle]=\"{\r\n 'flex': col.width ? '0 0 auto' : null,\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 [ngClass]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n [pTooltip]=\"rowData[col.id].value ? rowData[col.id].value : ''\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <span *ngIf=\"rowData[col.id]\">{{ rowData[col.id].value ? rowData[col.id].value : '' }}</span>\r\n </td>\r\n\r\n <!-- State -->\r\n <td *ngIf=\"checkType('State', col)\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, '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]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n class=\"centerText\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\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 </p-tag>\r\n </td>\r\n\r\n </ng-container>\r\n\r\n <!-- Deletion -->\r\n <td *ngIf=\"options.rowsDeletable\"\r\n class=\"cellDelete\"\r\n [ngClass]=\"rowData.deletable ? 'paddingCell' : null\">\r\n <button *ngIf=\"rowData.deletable\"\r\n 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 </td>\r\n\r\n </tr>\r\n </ng-template>\r\n</p-table>\r\n", styles: ["::ng-deep .p-tooltip .p-tooltip-text{overflow-wrap:break-word!important}:host ::ng-deep .grid_brown .rowHeader>th{background-color:#795548}:host ::ng-deep .grid_brown .rowHeader>th span{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 span{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 .rowFilter th{background-color:#dedddd}: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-thead>tr>th>span{overflow:hidden!important;white-space:nowrap!important;text-overflow:ellipsis!important}:host ::ng-deep .p-datatable-tbody>tr>td>span{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}:host ::ng-deep .p-tooltip .p-tooltip-text{background-color:red!important}:host ::ng-deep .p-datatable-thead>tr>th{border:1px solid rgba(0,0,0,.12)!important;padding-bottom:8px!important;padding-top:8px!important;font-weight:600!important;overflow:hidden!important;white-space:nowrap!important;text-overflow:ellipsis!important;height:35px!important}:host ::ng-deep .p-datatable-tbody>tr{height:35px!important}:host ::ng-deep .p-datatable-tbody>tr>td{border:1px solid rgba(0,0,0,.12)!important;min-width:0!important;width:1px}:host ::ng-deep .centerText{justify-content:center!important}:host ::ng-deep .p-button{padding-top:1px;padding-bottom:1px}:host ::ng-deep .p-button-label{overflow:hidden!important;white-space:nowrap!important;text-overflow:ellipsis!important}:host ::ng-deep p-calendar,:host ::ng-deep p-inputNumber,:host ::ng-deep p-dropdown,:host ::ng-deep p-selectButton,:host ::ng-deep p-multiselect{width:100%!important}:host ::ng-deep .p-calendar{width:100%!important}:host ::ng-deep .p-inputtext{width:100%!important;height:25px!important;padding:4px 5px!important}:host ::ng-deep .p-inputnumber{width:100%;height:25px;padding:0!important}:host ::ng-deep .p-inputnumber-input{width:100%;padding:0 5px!important}:host ::ng-deep .p-inputgroup .p-inputtext{width:100%;height:25px;padding:4px 5px!important}:host ::ng-deep .p-dropdown{width:100%;vertical-align:middle}:host ::ng-deep .p-dropdown-label{padding-top:2px;padding-bottom:2px}:host ::ng-deep .p-multiselect{width:100%;vertical-align:middle}: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}@media screen and (max-width: 650px){:host ::ng-deep .p-datatable-thead>tr>th,:host ::ng-deep .p-datatable-tfoot>tr>td{display:none!important;width:inherit!important}:host ::ng-deep .p-datatable-tbody>tr{border:2px solid rgba(0,0,0,.12);flex-direction:column;height:inherit!important;padding-top:12px!important}:host ::ng-deep .p-datatable-tbody>tr>td{border:0!important;flex-basis:auto!important;width:100%!important}:host ::ng-deep td .p-column-title{padding:.4rem;min-width:35%;display:inline-block!important;margin:-.4rem 1rem -.4rem -.4rem;font-weight:700}:host ::ng-deep .centerText{justify-content:inherit!important}}\n"] }]
|
|
350
|
+
args: [{ selector: 'cilog-table', template: "<p-table #table\r\n [columns]=\"columns\"\r\n [value]=\"values\"\r\n dataKey=\"id\"\r\n [selectionMode]=\"options.selectable && !isModeEdition() && !isModeCheckboxSelection() ? 'single' : null\"\r\n [(selection)]=\"selectedRows\"\r\n (onRowSelect)=\"onSelectRow($event)\"\r\n (onRowUnselect)=\"onUnselectRow($event)\"\r\n (sortFunction)=\"customSort($event)\"\r\n [customSort]=\"options.grouping == null ? true : false\"\r\n [scrollable]=\"true\"\r\n [loading]=\"loading\"\r\n [scrollHeight]=\"options.scrollHeight != null ? options.scrollHeight : null\"\r\n [rowGroupMode]=\"options.grouping != null ? 'subheader' : null\"\r\n [groupRowsBy]=\"options.grouping != null ? options.grouping.obj + '.' + options.grouping.id : null\"\r\n [virtualScroll]=\"options.virtualScroll != null && options.scrollHeight != null ? true : false\"\r\n [virtualRowHeight]=\"35\"\r\n [paginator]=\"options.paginator == null ? false : true\"\r\n [rows]=\"options.paginatorRows\"\r\n (onPage)=\"onPageTable($event)\"\r\n (onFilter)=\"onFilterTable($event)\"\r\n [groupRowsByOrder]=\"0\"\r\n [tableStyleClass]=\"!options.themeGrille ? 'grid_grey' : options.themeGrille\">\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 <th class=\"cellDelete\" *ngIf=\"isModeCheckboxSelection()\">\r\n\r\n </th>\r\n <th *ngFor=\"let col of columns\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, 'width' : col.width ? col.width : null }\"\r\n [ngClass]=\"{ 'centerText' : options.centerHeaders }\"\r\n [pSortableColumn]=\"col.id\"\r\n [pSortableColumnDisabled]=\"!options.sortable || options.grouping != null\"\r\n id=\"{{ col.id }}\"\r\n (click)=\"refreshData()\">\r\n <span>{{ col.libelle }}</span>\r\n <p-sortIcon *ngIf=\"options.sortable && options.grouping == null\" [field]=\"col.id\"></p-sortIcon>\r\n </th>\r\n <th class=\"cellDelete\" *ngIf=\"options.rowsDeletable\"></th>\r\n </tr>\r\n\r\n <!-- FILTRES -->\r\n <tr *ngIf=\"options.filterable\" class=\"rowFilter\">\r\n\r\n <th class=\"cellDelete\" *ngIf=\"isModeCheckboxSelection()\"></th>\r\n\r\n <ng-container *ngFor=\"let col of columns\">\r\n <!-- Text -->\r\n <th *ngIf=\"checkType('Text', col) || checkType('File', col) || (checkType('Button', col) && col.options.filterCol)\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, 'width' : col.width ? col.width : null }\">\r\n <input pInputText\r\n type=\"text\"\r\n (input)=\"onFilterCol($event, col)\"\r\n [(ngModel)]=\"col.options.defaultFilters\">\r\n </th>\r\n\r\n <!-- Date -->\r\n <th *ngIf=\"checkType('Date', col)\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, 'width' : col.width ? col.width : null }\">\r\n <p-calendar dateFormat=\"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 [(ngModel)]=\"col.options.defaultFilters\">\r\n </p-calendar>\r\n </th>\r\n\r\n <!-- Number -->\r\n <th *ngIf=\"checkType('Number', col)\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, 'width' : col.width ? col.width : null }\">\r\n <p-inputNumber mode=\"decimal\"\r\n locale=\"fr-FR\"\r\n [minFractionDigits]=\"2\"\r\n [showButtons]=\"true\"\r\n (onInput)=\"onFilterCol($event, col)\"\r\n [(ngModel)]=\"col.options.defaultFilters\">\r\n </p-inputNumber>\r\n </th>\r\n\r\n <!-- Liste -->\r\n <th *ngIf=\"checkType('Dropdown', col) || checkType('MultiSelect', col) || checkType('SelectButton', col) || checkType('State', col)\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, 'width' : col.width ? col.width : null }\">\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 [virtualScroll]=\"true\"\r\n emptyFilterMessage=\"Aucun r\u00E9sultat\"\r\n emptyMessage=\"Aucun r\u00E9sultat\"\r\n itemSize=\"30\"\r\n selectedItemsLabel=\"{0} selectionn\u00E9s\"\r\n (onChange)=\"onFilterCol($event, col)\"\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 <ng-template let-group pTemplate=\"group\">\r\n <span>{{group[col.options.optionGroupLabel]}}</span>\r\n </ng-template>\r\n </p-multiSelect>\r\n </th>\r\n\r\n <!-- Switch -->\r\n <th *ngIf=\"checkType('Switch', col)\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, 'width' : col.width ? col.width : null }\">\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 itemSize=\"30\"\r\n selectedItemsLabel=\"{0} selectionn\u00E9s\"\r\n (onChange)=\"onFilterCol($event, col)\"\r\n [(ngModel)]=\"col.options.defaultFilters\">\r\n </p-multiSelect>\r\n </th>\r\n\r\n <!-- Non filtrable -->\r\n <th *ngIf=\"checkType('Image', col) || (checkType('Button', col) && !col.options.filterCol)\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, 'width' : col.width ? col.width : null }\">\r\n </th>\r\n </ng-container>\r\n <th class=\"cellDelete\" *ngIf=\"options.rowsDeletable\"></th>\r\n </tr>\r\n\r\n <!-- TOTAL -->\r\n <tr *ngIf=\"options.rowTotal\" class=\"rowTotal\">\r\n <th class=\"cellDelete\" *ngIf=\"isModeCheckboxSelection()\"></th>\r\n <th *ngFor=\"let col of columns\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, 'width' : col.width ? col.width : null }\"\r\n [ngClass]=\"{ 'centerText' : true }\">\r\n <span>{{ getTotal(col) }}</span>\r\n </th>\r\n <th class=\"cellDelete\" *ngIf=\"options.rowsDeletable\"></th>\r\n </tr>\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 + 1\">\r\n <span class=\"text_bold\">{{ rowData[options.grouping.obj][options.grouping.libelle] }}</span>\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 || isModeEdition()\">\r\n\r\n <td *ngIf=\"isModeCheckboxSelection()\" class=\"cellDelete\">\r\n <p-tableCheckbox [value]=\"rowData\"></p-tableCheckbox>\r\n </td>\r\n\r\n <ng-container *ngFor=\"let col of columns\">\r\n\r\n <!-- Text -->\r\n <td *ngIf=\"checkType('Text', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, '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].value\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <input pInputText\r\n type=\"text\"\r\n [(ngModel)]=\"rowData[col.id].value\"\r\n (change)=\"onEditCell(rowData, col, rowData[col.id].value)\"\r\n (keyup.enter)=\"onEditCell(rowData, col, rowData[col.id].value)\"\r\n (click)=\"onEditInitCell(rowData, col, rowData[col.id].value)\" />\r\n </td>\r\n <td *ngIf=\"checkType('Text', col) && (!isModeEdition() || rowData.readonly || rowData[col.id]?.readonly)\"\r\n [ngStyle]=\"{\r\n 'flex': col.width ? '0 0 auto' : null,\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 [ngClass]=\"{ 'paddingCell': rowData[col.id] != null }\"\r\n [pTooltip]=\"rowData[col.id].value\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <span *ngIf=\"rowData[col.id]\">{{ rowData[col.id].value }}</span>\r\n </td>\r\n\r\n <!-- Dropdown -->\r\n <td *ngIf=\"checkType('Dropdown', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, '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]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n [pTooltip]=\"rowData[col.id].value != null ? rowData[col.id].value[getOption(col, rowData, 'optionLabel')] : ''\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <p-dropdown *ngIf=\"rowData[col.id] != null\"\r\n 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 [autoDisplayFirst]=\"false\"\r\n appendTo=\"body\"\r\n emptyFilterMessage=\"Aucun r\u00E9sultat\"\r\n emptyMessage=\"Aucun r\u00E9sultat\"\r\n [baseZIndex]=\"getOption(col, rowData, 'baseZIndex')\"\r\n [virtualScroll]=\"getOption(col, rowData, 'virtualScroll')\"\r\n [readonly]=\"rowData.readonly || rowData[col.id]?.readonly\"\r\n itemSize=\"30\"\r\n (onChange)=\"onEditCell(rowData, col, rowData[col.id].value)\">\r\n </p-dropdown>\r\n </td>\r\n <td *ngIf=\"checkType('Dropdown', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())\"\r\n [ngStyle]=\"{\r\n 'flex': col.width ? '0 0 auto' : null,\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 [ngClass]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n [pTooltip]=\"rowData[col.id].value != null ? rowData[col.id].value[getOption(col, rowData, 'optionLabel')] : ''\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <span *ngIf=\"rowData[col.id]\">{{ rowData[col.id].value != null ? rowData[col.id].value[getOption(col, rowData, 'optionLabel')] : '' }}</span>\r\n </td>\r\n\r\n <!-- Number -->\r\n <td *ngIf=\"checkType('Number', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, '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]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n [pTooltip]=\"rowData[col.id].value | number\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <p-inputNumber *ngIf=\"rowData[col.id] && !rowData.readonly && !rowData[col.id]?.readonly\"\r\n locale=\"fr-FR\"\r\n (onInput)=\"onInputNumber($event)\"\r\n [(ngModel)]=\"rowData[col.id].value\"\r\n [showButtons]=\"getOption(col, rowData, 'showButtons')\"\r\n inputStyleClass=\"text-right\"\r\n [suffix]=\"getOption(col, rowData, 'suffix')\"\r\n [prefix]=\"getOption(col, rowData, 'prefix') != null ? getOption(col, rowData, 'prefix') + ' ' : null\"\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 (ngModelChange)=\"onEditCell(rowData, col, rowData[col.id].value)\"\r\n (onFocus)=\"onEditInitCell(rowData, col, rowData[col.id].value)\">\r\n </p-inputNumber>\r\n </td>\r\n <td *ngIf=\"checkType('Number', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())\"\r\n [ngStyle]=\"{\r\n 'flex': col.width ? '0 0 auto' : null,\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 [ngClass]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n [pTooltip]=\"rowData[col.id].value | number\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\"\r\n class=\"justify-content-end\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <span *ngIf=\"rowData[col.id]\">{{ getFormattedNumber(col, rowData, rowData[col.id].value | number) }}</span>\r\n </td>\r\n\r\n <!-- Date -->\r\n <td *ngIf=\"checkType('Date', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, '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]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n [pTooltip]=\"rowData[col.id].value | date: 'dd/MM/yyyy'\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <p-calendar [(ngModel)]=\"rowData[col.id].value\"\r\n dateFormat=\"dd/mm/yy\"\r\n firstDayOfWeek=\"1\"\r\n (onSelect)=\"onEditCell(rowData, col, rowData[col.id].value)\"\r\n [readonlyInput]=\"true\"\r\n appendTo=\"body\">\r\n </p-calendar>\r\n </td>\r\n <td *ngIf=\"checkType('Date', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())\"\r\n [ngStyle]=\"{\r\n 'flex': col.width ? '0 0 auto' : null,\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 [ngClass]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n [pTooltip]=\"rowData[col.id].value | date: 'dd/MM/yyyy'\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <span *ngIf=\"rowData[col.id]\">{{ rowData[col.id].value | date: 'dd/MM/yyyy' }}</span>\r\n </td>\r\n\r\n <!-- MultiSelect -->\r\n <td *ngIf=\"checkType('MultiSelect', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, '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]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n [pTooltip]=\"getMultiSelectConcat(rowData[col.id].value, getOption(col, rowData, 'optionLabel'))\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <p-multiSelect *ngIf=\"rowData[col.id] != null\"\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 appendTo=\"body\"\r\n dataKey=\"ID\"\r\n emptyFilterMessage=\"Aucun r\u00E9sultat\"\r\n emptyMessage=\"Aucun r\u00E9sultat\"\r\n [baseZIndex]=\"getOption(col, rowData, 'baseZIndex')\"\r\n [virtualScroll]=\"getOption(col, rowData, 'virtualScroll')\"\r\n [readonly]=\"rowData.readonly || rowData[col.id]?.readonly || !isModeEdition()\"\r\n itemSize=\"30\"\r\n selectedItemsLabel=\"{0} selectionn\u00E9s\"\r\n (onChange)=\"onEditCell(rowData, col, rowData[col.id].value)\"\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-group pTemplate=\"group\">\r\n <span>{{group[col.options.optionGroupLabel]}}</span>\r\n </ng-template>\r\n </p-multiSelect>\r\n </td>\r\n <td *ngIf=\"checkType('MultiSelect', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())\"\r\n [ngStyle]=\"{\r\n 'flex': col.width ? '0 0 auto' : null,\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 [ngClass]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n [pTooltip]=\"getMultiSelectConcat(rowData[col.id].value, getOption(col, rowData, 'optionLabel'))\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <span *ngIf=\"rowData[col.id]\">{{ getMultiSelectConcat(rowData[col.id].value, getOption(col, rowData, 'optionLabel')) }}</span>\r\n </td>\r\n\r\n <!-- Image -->\r\n <td *ngIf=\"checkType('Image', col)\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, '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]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n class=\"centerText\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <img *ngIf=\"rowData[col.id]\" style=\"vertical-align: middle; width: 40px;\" src=\"{{ rowData[col.id].value }}\" />\r\n </td>\r\n\r\n <!-- Button -->\r\n <td *ngIf=\"checkType('Button', col)\"\r\n class=\"paddingCell centerText\"\r\n [ngStyle]=\"{ 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <button pButton\r\n [disabled]=\"rowData.readonly || rowData[col.id]?.readonly\"\r\n [ngClass]=\"'p-button-' + getOption(col, rowData, 'severity')\"\r\n [label]=\"getOption(col, rowData, 'label')\"\r\n [icon]=\"getOption(col, rowData, 'icon')\"\r\n (click)=\"rowData[col.id].value()\"\r\n [pTooltip]=\"getOption(col, rowData, 'label')\"\r\n [tooltipDisabled]=\"!col.tooltip\">\r\n </button>\r\n </td>\r\n\r\n <!-- SelectButton -->\r\n <td *ngIf=\"checkType('SelectButton', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, '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]=\"rowData[col.id] != null ? 'paddingCell' : null\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <p-selectButton *ngIf=\"rowData[col.id] != null\"\r\n [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 [disabled]=\"rowData.readonly || rowData[col.id]?.readonly || !isModeEdition()\"\r\n (onChange)=\"onEditCell(rowData, col, rowData[col.id].value)\">\r\n </p-selectButton>\r\n </td>\r\n <td *ngIf=\"checkType('SelectButton', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())\"\r\n [ngStyle]=\"{\r\n 'flex': col.width ? '0 0 auto' : null,\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 [ngClass]=\"rowData[col.id] != null ? 'paddingCell' : null\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <span *ngIf=\"rowData[col.id]\">{{ getSelectLibelleByValue(rowData, col) }}</span>\r\n </td>\r\n\r\n <!-- Switch -->\r\n <td *ngIf=\"checkType('Switch', col)\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, 'width' : col.width ? col.width : null, 'background-color': rowData[col.id].color ? rowData[col.id].color : null }\"\r\n style=\"justify-content: center;\"\r\n id=\"{{ rowData[col.id] != null ? rowData[col.id].id : '' }}\"\r\n [ngClass]=\"rowData[col.id] != null ? 'paddingCell' : null\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <p-inputSwitch *ngIf=\"rowData[col.id] != null\"\r\n [(ngModel)]=\"rowData[col.id].value\"\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-inputSwitch>\r\n </td>\r\n\r\n <!-- File -->\r\n <td *ngIf=\"checkType('File', col) && isModeEdition() && !rowData.readonly && !rowData[col.id]?.readonly\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, '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]=\"rowData[col.id] != null ? 'paddingCell' : null\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <div class=\"p-inputgroup\" *ngIf=\"rowData[col.id] != null\">\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 value=\"{{ rowData[col.id].value != null ? rowData[col.id].value : '' }}\"\r\n readonly\r\n [pTooltip]=\"rowData[col.id].value ? rowData[col.id].value : ''\"\r\n [tooltipDisabled]=\"!col.tooltip\">\r\n <button *ngIf=\"getOption(col, rowData, 'downloadPath') && rowData[col.id].value != null\"\r\n 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 </div>\r\n <input *ngIf=\"rowData[col.id]\" 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 </td>\r\n <td *ngIf=\"checkType('File', col) && (rowData.readonly || rowData[col.id]?.readonly || !isModeEdition())\"\r\n [ngStyle]=\"{\r\n 'flex': col.width ? '0 0 auto' : null,\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 [ngClass]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n [pTooltip]=\"rowData[col.id].value ? rowData[col.id].value : ''\"\r\n [tooltipDisabled]=\"!col.tooltip\"\r\n tooltipPosition=\"bottom\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\r\n <span *ngIf=\"rowData[col.id]\">{{ rowData[col.id].value ? rowData[col.id].value : '' }}</span>\r\n </td>\r\n\r\n <!-- State -->\r\n <td *ngIf=\"checkType('State', col)\"\r\n [ngStyle]=\"{ 'flex': col.width ? '0 0 auto' : null, '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]=\"rowData[col.id] != null ? 'paddingCell' : null\"\r\n class=\"centerText\">\r\n <span class=\"p-column-title\">{{ col.libelle }} : </span>\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 </p-tag>\r\n </td>\r\n\r\n </ng-container>\r\n\r\n <!-- Deletion -->\r\n <td *ngIf=\"options.rowsDeletable\"\r\n class=\"cellDelete\"\r\n [ngClass]=\"rowData.deletable ? 'paddingCell' : null\">\r\n <button *ngIf=\"rowData.deletable\"\r\n 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 </td>\r\n\r\n </tr>\r\n </ng-template>\r\n</p-table>\r\n", styles: ["::ng-deep .p-tooltip .p-tooltip-text{overflow-wrap:break-word!important}:host ::ng-deep .grid_brown .rowHeader>th{background-color:#795548}:host ::ng-deep .grid_brown .rowHeader>th span{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 span{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 span{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 span{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 .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-thead>tr>th>span{overflow:hidden!important;white-space:nowrap!important;text-overflow:ellipsis!important}:host ::ng-deep .p-datatable-tbody>tr>td>span{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}:host ::ng-deep .p-tooltip .p-tooltip-text{background-color:red!important}:host ::ng-deep .p-datatable-thead>tr>th{border:1px solid rgba(0,0,0,.12)!important;padding-bottom:8px!important;padding-top:8px!important;font-weight:600!important;overflow:hidden!important;white-space:nowrap!important;text-overflow:ellipsis!important;height:35px!important}:host ::ng-deep .p-datatable-tbody>tr{height:35px!important}:host ::ng-deep .p-datatable-tbody>tr>td{border:1px solid rgba(0,0,0,.12)!important;min-width:0!important;width:1px}:host ::ng-deep .centerText{justify-content:center!important}:host ::ng-deep .p-button{padding-top:1px;padding-bottom:1px}:host ::ng-deep .p-button-label{overflow:hidden!important;white-space:nowrap!important;text-overflow:ellipsis!important}:host ::ng-deep p-calendar,:host ::ng-deep p-inputNumber,:host ::ng-deep p-dropdown,:host ::ng-deep p-selectButton,:host ::ng-deep p-multiselect{width:100%!important}:host ::ng-deep .p-calendar{width:100%!important}:host ::ng-deep .p-inputtext{width:100%!important;height:25px!important;padding:4px 5px!important}:host ::ng-deep .p-inputnumber{width:100%;height:25px;padding:0!important}:host ::ng-deep .p-inputnumber-input{width:100%;padding:0 5px!important}:host ::ng-deep .p-inputgroup .p-inputtext{width:100%;height:25px;padding:4px 5px!important}:host ::ng-deep .p-dropdown{width:100%;vertical-align:middle}:host ::ng-deep .p-dropdown-label{padding-top:2px;padding-bottom:2px}:host ::ng-deep .p-multiselect{width:100%;vertical-align:middle}: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}@media screen and (max-width: 650px){:host ::ng-deep .p-datatable-thead>tr>th,:host ::ng-deep .p-datatable-tfoot>tr>td{display:none!important;width:inherit!important}:host ::ng-deep .p-datatable-tbody>tr{border:2px solid rgba(0,0,0,.12);flex-direction:column;height:inherit!important;padding-top:12px!important}:host ::ng-deep .p-datatable-tbody>tr>td{border:0!important;flex-basis:auto!important;width:100%!important}:host ::ng-deep td .p-column-title{padding:.4rem;min-width:35%;display:inline-block!important;margin:-.4rem 1rem -.4rem -.4rem;font-weight:700}:host ::ng-deep .centerText{justify-content:inherit!important}}\n"] }]
|
|
351
351
|
}], ctorParameters: function () { return [{ type: i1.ConfirmationService }, { type: i1.FilterService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { columns: [{
|
|
352
352
|
type: Input
|
|
353
353
|
}], columnsChange: [{
|