@igo2/common 21.0.0-next.1 → 21.0.0-next.2
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.
|
@@ -216,7 +216,9 @@ class EntityService {
|
|
|
216
216
|
? ObjectUtils.resolve(options, path.list)
|
|
217
217
|
: options;
|
|
218
218
|
return items.map((item) => {
|
|
219
|
-
const id = path?.id
|
|
219
|
+
const id = path?.id
|
|
220
|
+
? ObjectUtils.resolve(item, path.id)
|
|
221
|
+
: item.id;
|
|
220
222
|
const value = path?.value
|
|
221
223
|
? ObjectUtils.resolve(item, path.value)
|
|
222
224
|
: item.value;
|
|
@@ -2960,7 +2962,7 @@ class EntityTableComponent {
|
|
|
2960
2962
|
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: EntityTableComponent, isStandalone: true, selector: "igo-entity-table", inputs: { store: { classPropertyName: "store", publicName: "store", isSignal: true, isRequired: false, transformFunction: null }, paginator: { classPropertyName: "paginator", publicName: "paginator", isSignal: false, isRequired: false, transformFunction: null }, template: { classPropertyName: "template", publicName: "template", isSignal: true, isRequired: false, transformFunction: null }, scrollBehavior: { classPropertyName: "scrollBehavior", publicName: "scrollBehavior", isSignal: true, isRequired: false, transformFunction: null }, sortNullsFirst: { classPropertyName: "sortNullsFirst", publicName: "sortNullsFirst", isSignal: true, isRequired: false, transformFunction: null }, withPaginator: { classPropertyName: "withPaginator", publicName: "withPaginator", isSignal: true, isRequired: false, transformFunction: null }, paginatorOptions: { classPropertyName: "paginatorOptions", publicName: "paginatorOptions", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { entityClick: "entityClick", entitySelectChange: "entitySelectChange", entitySortChange: "entitySortChange" }, providers: [
|
|
2961
2963
|
{ provide: MatFormFieldControl, useExisting: EntityTableComponent },
|
|
2962
2964
|
provideMomentDateAdapter()
|
|
2963
|
-
], usesOnChanges: true, ngImport: i0, template: "<div class=\"table-container\" [style.height]=\"tableHeight\">\n <table\n id=\"currentWorkspaceTable\"\n mat-table\n matSort\n [ngClass]=\"getTableClass()\"\n [dataSource]=\"dataSource\"\n [trackBy]=\"getTrackByFunction()\"\n (matSortChange)=\"onSort($event)\"\n >\n <ng-container matColumnDef=\"selectionCheckbox\" class=\"mat-cell-checkbox\">\n <th mat-header-cell *matHeaderCellDef>\n @if (selectMany) {\n @let selectionState = selectionState$ | async;\n @if (selectionState) {\n <mat-checkbox\n (change)=\"onToggleRows($event.checked)\"\n [checked]=\"selectionState === entityTableSelectionState.All\"\n [indeterminate]=\"\n selectionState === entityTableSelectionState.Some\n \"\n />\n }\n }\n </th>\n <td mat-cell *matCellDef=\"let row\">\n <mat-checkbox\n (mousedown)=\"$event.shiftKey ? $event.preventDefault() : null\"\n (click)=\"\n $event.shiftKey\n ? onShiftToggleRow(!rowIsSelected(row.record), row.record, $event)\n : $event.stopPropagation()\n \"\n (change)=\"onToggleRow($event.checked, row.record)\"\n [checked]=\"rowIsSelected(row.record)\"\n />\n </td>\n </ng-container>\n\n @for (column of template().columns; track column) {\n <ng-container [matColumnDef]=\"column.name\">\n @if (columnIsSortable(column)) {\n <th\n mat-header-cell\n *matHeaderCellDef\n mat-sort-header\n [matTooltip]=\"column.tooltip ? column.tooltip : undefined\"\n >\n {{ column.title }}\n </th>\n } @else {\n <th\n mat-header-cell\n *matHeaderCellDef\n [matTooltip]=\"column.tooltip ? column.tooltip : undefined\"\n >\n {{ column.title }}\n </th>\n }\n\n @let columnRenderer = getColumnRenderer(column);\n @if (columnRenderer) {\n @switch (columnRenderer) {\n @case (entityTableColumnRenderer.HTML) {\n <ng-container *matCellDef=\"let row\">\n @if (!row.cellData[column.name].isUrl) {\n <td\n mat-cell\n class=\"mat-cell-text\"\n [ngClass]=\"row.cellData[column.name].class\"\n [innerHTML]=\"row.cellData[column.name].value\"\n ></td>\n } @else {\n <td\n mat-cell\n class=\"mat-cell-text\"\n [ngClass]=\"row.cellData[column.name].class\"\n >\n <a\n href=\"{{ row.cellData[column.name].value }}\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n (click)=\"$event.stopPropagation()\"\n >\n @if (row.cellData[column.name].isImg) {\n <img\n igoImageError\n src=\"{{\n row.cellData[column.name].value\n | secureImage\n | async\n }}\"\n width=\"50\"\n heigth=\"auto\"\n />\n } @else {\n <span>{{ 'igo.geo.targetHtmlUrl' | translate }} </span>\n }\n >\n </a>\n </td>\n }\n </ng-container>\n }\n @case (entityTableColumnRenderer.UnsanitizedHTML) {\n <ng-container *matCellDef=\"let row\">\n @if (isEdition(row.record)) {\n <td\n mat-cell\n class=\"mat-cell-text edition\"\n [formGroup]=\"formGroup\"\n [ngClass]=\"row.cellData[column.name].class\"\n >\n @switch (column.type) {\n @case ('date') {\n <div class=\"date-picker\">\n <mat-datepicker-toggle matSuffix [for]=\"picker\" />\n <input\n matInput\n [matDatepicker]=\"picker\"\n [formControlName]=\"column.name\"\n value=\"{{ row.cellData[column.name].value }}\"\n (dateChange)=\"\n onDateChange(column.name, row.record, $event)\n \"\n />\n <mat-datepicker #picker />\n </div>\n }\n @case ('time') {\n <input\n matInput\n type=\"time\"\n [formControlName]=\"column.name\"\n step=\"900\"\n (focus)=\"column.onFocus($event)\"\n (keypress)=\"column.onChange($event)\"\n (blur)=\"column.onBlur($event)\"\n />\n }\n @case ('number') {\n <input\n matInput\n type=\"number\"\n class=\"class_number_edition\"\n [formControlName]=\"column.name\"\n step=\"{{ column.step }}\"\n value=\"{{ row.cellData[column.name].value }}\"\n (input)=\"\n onValueChange(column.name, row.record, $event)\n \"\n readonly=\"{{\n getValidationAttributeValue(column, 'readonly')\n }}\"\n required=\"{{\n getValidationAttributeValue(column, 'mandatory')\n }}\"\n min=\"{{\n getValidationAttributeValue(column, 'minValue')\n }}\"\n max=\"{{\n getValidationAttributeValue(column, 'maxValue')\n }}\"\n />\n }\n @case ('boolean') {\n <mat-checkbox\n [formControlName]=\"column.name\"\n [checked]=\"row.cellData[column.name].value\"\n (change)=\"\n onBooleanValueChange(\n column.name,\n row.record,\n $event\n )\n \"\n />\n }\n @case ('list') {\n <mat-select\n required=\"{{\n getValidationAttributeValue(column, 'mandatory')\n }}\"\n [formControlName]=\"column.name\"\n [multiple]=\"column.multiple\"\n (selectionChange)=\"\n onSelectValueChange(column.name, row.record, $event)\n \"\n [value]=\"row.cellData[column.name].value\"\n >\n @for (\n option of $any(column).domainValues;\n track option\n ) {\n <mat-option\n [value]=\"option.id\"\n [disabled]=\"option.disabled\"\n >\n {{ option.value }}\n </mat-option>\n }\n </mat-select>\n }\n @case ('autocomplete') {\n <input\n matInput\n type=\"text\"\n [formControlName]=\"column.name\"\n [matAutocomplete]=\"auto\"\n required=\"{{\n getValidationAttributeValue(column, 'mandatory')\n }}\"\n value=\"{{ row.cellData[column.name].value }}\"\n readonly=\"{{\n getValidationAttributeValue(column, 'readonly')\n }}\"\n />\n <mat-autocomplete\n #auto=\"matAutocomplete\"\n (optionSelected)=\"\n onAutocompleteValueChange(\n column,\n row.record,\n $event\n )\n \"\n panelWidth=\"430px\"\n >\n @for (\n option of filteredOptions[column.name] | async;\n track option\n ) {\n <mat-option [value]=\"option.id\">\n {{ option.value }}\n </mat-option>\n }\n </mat-autocomplete>\n }\n @default {\n <input\n matInput\n type=\"text\"\n [formControlName]=\"column.name\"\n value=\"{{ row.cellData[column.name].value }}\"\n (input)=\"\n onValueChange(column.name, row.record, $event)\n \"\n readonly=\"{{\n getValidationAttributeValue(column, 'readonly')\n }}\"\n required=\"{{\n getValidationAttributeValue(column, 'mandatory')\n }}\"\n />\n }\n }\n </td>\n } @else {\n @if (!row.cellData[column.name].isUrl) {\n <td\n mat-cell\n class=\"mat-cell-text\"\n [ngClass]=\"row.cellData[column.name].class\"\n [innerHTML]=\"\n row.cellData[column.name].value | sanitizeHtml\n \"\n ></td>\n } @else {\n <td\n mat-cell\n class=\"mat-cell-text\"\n [ngClass]=\"row.cellData[column.name].class\"\n >\n <a\n href=\"{{ row.cellData[column.name].value }}\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n (click)=\"$event.stopPropagation()\"\n >\n @if (row.cellData[column.name].isImg) {\n <img\n igoImageError\n src=\"{{\n row.cellData[column.name].value\n | secureImage\n | async\n }}\"\n width=\"50\"\n heigth=\"auto\"\n />\n } @else {\n ><span\n >{{ 'igo.geo.targetHtmlUrl' | translate }}\n </span>\n }\n >\n </a>\n </td>\n }\n }\n </ng-container>\n }\n @case (entityTableColumnRenderer.Icon) {\n <td\n mat-cell\n *matCellDef=\"let row\"\n class=\"mat-cell-text\"\n [ngClass]=\"row.cellData[column.name].class\"\n >\n @if (column.onClick) {\n <mat-icon (click)=\"column.onClick($event)\">{{\n row.cellData[column.name].value || column.icon\n }}</mat-icon>\n } @else {\n <mat-icon>{{\n row.cellData[column.name].value || column.icon\n }}</mat-icon>\n }\n </td>\n }\n @case (entityTableColumnRenderer.ButtonGroup) {\n <ng-container *matCellDef=\"let row\">\n <td\n mat-cell\n class=\"mat-cell-text\"\n [ngClass]=\"row.cellData[column.name].class\"\n >\n @for (\n button of row.cellData[column.name].value;\n track button\n ) {\n @if (\n isEdition(row.record) === button.editMode ||\n button.editMode === undefined\n ) {\n <span>\n @if (button.style === 'mat-icon-button') {\n <button\n igoStopPropagation\n mat-icon-button\n [color]=\"button.color\"\n (mousedown)=\"\n onButtonClick(button.click, row.record)\n \"\n [disabled]=\"button.disabled\"\n >\n <mat-icon>{{ button.icon }}</mat-icon>\n </button>\n } @else {\n <button\n igoStopPropagation\n mat-mini-fab\n [color]=\"button.color\"\n (mousedown)=\"\n onButtonClick(button.click, row.record)\n \"\n [disabled]=\"button.disabled\"\n >\n <mat-icon>{{ button.icon }}</mat-icon>\n </button>\n }\n </span>\n }\n }\n </td>\n </ng-container>\n }\n @default {\n <ng-container *matCellDef=\"let row\">\n @if (!row.cellData[column.name].isUrl) {\n <td\n mat-cell\n class=\"mat-cell-text\"\n [ngClass]=\"row.cellData[column.name].class\"\n >\n {{ row.cellData[column.name].value }}\n </td>\n } @else {\n <td\n mat-cell\n class=\"mat-cell-text\"\n [ngClass]=\"row.cellData[column.name].class\"\n >\n <a\n href=\"{{ row.cellData[column.name].value }}\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n (click)=\"$event.stopPropagation()\"\n >\n @if (row.cellData[column.name].isImg) {\n <img\n igoImageError\n src=\"{{\n row.cellData[column.name].value\n | secureImage\n | async\n }}\"\n width=\"50\"\n heigth=\"auto\"\n />\n } @else {\n <span>{{\n 'igo.common.entity-table.targetHtmlUrl' | translate\n }}</span>\n }\n >\n </a>\n </td>\n }\n </ng-container>\n }\n }\n }\n </ng-container>\n }\n\n <tr\n mat-header-row\n *matHeaderRowDef=\"headers; sticky: fixedHeader\"\n [ngClass]=\"getHeaderClass()\"\n ></tr>\n <tr\n mat-row\n igoEntityTableRow\n *matRowDef=\"let row; columns: headers\"\n [scrollBehavior]=\"scrollBehavior()\"\n [ngClass]=\"getRowClass(row.record)\"\n [selection]=\"selection\"\n [selected]=\"rowIsSelected(row.record)\"\n (select)=\"onRowSelect(row.record)\"\n (click)=\"onRowClick(row.record)\"\n ></tr>\n </table>\n @if (withPaginator()) {\n <igo-entity-table-paginator\n [store]=\"store()\"\n [paginatorOptions]=\"paginatorOptions()\"\n [entitySortChange$]=\"entitySortChange$\"\n (paginatorChange)=\"paginatorChange($event)\"\n />\n }\n</div>\n", styles: [":host{width:100%;height:100%;display:block;--mat-table-header-container-height: 52px}:host.table-compact tr.mat-mdc-header-row,:host.table-compact ::ng-deep mat-checkbox .mat-ripple{height:36px}:host.table-compact tr.mat-mdc-row,:host.table-compact ::ng-deep mat-checkbox .mat-ripple{height:28px}.table-container{display:flex;flex-direction:column;height:100%;overflow:auto;flex:1 1 auto}.mat-cell-text{overflow:hidden;word-wrap:break-word}table.igo-entity-table-with-selection tr:hover{-moz-box-shadow:2px 0px 2px 0px #dddddd;-webkit-box-shadow:2px 0px 2px 0px #dddddd;-o-box-shadow:2px 0px 2px 0px #dddddd;box-shadow:2px 0 2px #ddd;cursor:pointer}table button{margin:7px}.class_hidden{visibility:hidden}.class_display_none{display:none}.class_boolean,.class_icon,.class_number{text-align:center;padding-right:35px!important}.class_string,.class_text,.class_number_edition{text-align:left}td.edition{background:#a6a6a633}input{border-bottom:1px solid darkgrey}table.igo-entity-table-with-selection tr.igo-entity-table-row-highlighted{background-color:var(--mat-sys-primary-container);color:var(--mat-sys-on-primary-container)}\n"], dependencies: [{ kind: "component", type: EntityTablePaginatorComponent, selector: "igo-entity-table-paginator", inputs: ["entitySortChange$", "store", "paginatorOptions"], outputs: ["paginatorChange"] }, { kind: "directive", type: EntityTableRowDirective, selector: "[igoEntityTableRow]", inputs: ["selection", "selectOnClick", "highlightSelection", "selected", "scrollBehavior"], outputs: ["select"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i1$2.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { kind: "directive", type: ImageErrorDirective, selector: "[igoImageError]", inputs: ["errorImageUrl", "hideError"] }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i2$1.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i2$1.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatMiniFabButton, selector: "button[mat-mini-fab], a[mat-mini-fab], button[matMiniFab], a[matMiniFab]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i5.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i6.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i6.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i6.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "directive", type: i1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i8.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i9.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatNativeDateModule }, { kind: "ngmodule", type: // For the DateAdapter provider
|
|
2965
|
+
], usesOnChanges: true, ngImport: i0, template: "<div class=\"table-container\" [style.height]=\"tableHeight\">\n <table\n id=\"currentWorkspaceTable\"\n mat-table\n matSort\n [ngClass]=\"getTableClass()\"\n [dataSource]=\"dataSource\"\n [trackBy]=\"getTrackByFunction()\"\n (matSortChange)=\"onSort($event)\"\n >\n <ng-container matColumnDef=\"selectionCheckbox\" class=\"mat-cell-checkbox\">\n <th mat-header-cell *matHeaderCellDef>\n @if (selectMany) {\n @let selectionState = selectionState$ | async;\n @if (selectionState) {\n <mat-checkbox\n (change)=\"onToggleRows($event.checked)\"\n [checked]=\"selectionState === entityTableSelectionState.All\"\n [indeterminate]=\"\n selectionState === entityTableSelectionState.Some\n \"\n />\n }\n }\n </th>\n <td mat-cell *matCellDef=\"let row\">\n <mat-checkbox\n (mousedown)=\"$event.shiftKey ? $event.preventDefault() : null\"\n (click)=\"\n $event.shiftKey\n ? onShiftToggleRow(!rowIsSelected(row.record), row.record, $event)\n : $event.stopPropagation()\n \"\n (change)=\"onToggleRow($event.checked, row.record)\"\n [checked]=\"rowIsSelected(row.record)\"\n />\n </td>\n </ng-container>\n\n @for (column of template().columns; track column) {\n <ng-container [matColumnDef]=\"column.name\">\n @if (columnIsSortable(column)) {\n <th\n mat-header-cell\n *matHeaderCellDef\n mat-sort-header\n [matTooltip]=\"column.tooltip ? column.tooltip : undefined\"\n >\n {{ column.title }}\n </th>\n } @else {\n <th\n mat-header-cell\n *matHeaderCellDef\n [matTooltip]=\"column.tooltip ? column.tooltip : undefined\"\n >\n {{ column.title }}\n </th>\n }\n\n @let columnRenderer = getColumnRenderer(column);\n @if (columnRenderer) {\n @switch (columnRenderer) {\n @case (entityTableColumnRenderer.HTML) {\n <ng-container *matCellDef=\"let row\">\n @if (!row.cellData[column.name].isUrl) {\n <td\n mat-cell\n class=\"mat-cell-text\"\n [ngClass]=\"row.cellData[column.name].class\"\n [innerHTML]=\"row.cellData[column.name].value\"\n ></td>\n } @else {\n <td\n mat-cell\n class=\"mat-cell-text\"\n [ngClass]=\"row.cellData[column.name].class\"\n >\n <a\n href=\"{{ row.cellData[column.name].value }}\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n (click)=\"$event.stopPropagation()\"\n >\n @if (row.cellData[column.name].isImg) {\n <img\n igoImageError\n src=\"{{\n row.cellData[column.name].value\n | secureImage\n | async\n }}\"\n width=\"50\"\n heigth=\"auto\"\n />\n } @else {\n <span>{{ 'igo.geo.targetHtmlUrl' | translate }} </span>\n }\n </a>\n </td>\n }\n </ng-container>\n }\n @case (entityTableColumnRenderer.UnsanitizedHTML) {\n <ng-container *matCellDef=\"let row\">\n @if (isEdition(row.record)) {\n <td\n mat-cell\n class=\"mat-cell-text edition\"\n [formGroup]=\"formGroup\"\n [ngClass]=\"row.cellData[column.name].class\"\n >\n @switch (column.type) {\n @case ('date') {\n <div class=\"date-picker\">\n <mat-datepicker-toggle matSuffix [for]=\"picker\" />\n <input\n matInput\n [matDatepicker]=\"picker\"\n [formControlName]=\"column.name\"\n value=\"{{ row.cellData[column.name].value }}\"\n (dateChange)=\"\n onDateChange(column.name, row.record, $event)\n \"\n />\n <mat-datepicker #picker />\n </div>\n }\n @case ('time') {\n <input\n matInput\n type=\"time\"\n [formControlName]=\"column.name\"\n step=\"900\"\n (focus)=\"column.onFocus($event)\"\n (keypress)=\"column.onChange($event)\"\n (blur)=\"column.onBlur($event)\"\n />\n }\n @case ('number') {\n <input\n matInput\n type=\"number\"\n class=\"class_number_edition\"\n [formControlName]=\"column.name\"\n step=\"{{ column.step }}\"\n value=\"{{ row.cellData[column.name].value }}\"\n (input)=\"\n onValueChange(column.name, row.record, $event)\n \"\n readonly=\"{{\n getValidationAttributeValue(column, 'readonly')\n }}\"\n required=\"{{\n getValidationAttributeValue(column, 'mandatory')\n }}\"\n min=\"{{\n getValidationAttributeValue(column, 'minValue')\n }}\"\n max=\"{{\n getValidationAttributeValue(column, 'maxValue')\n }}\"\n />\n }\n @case ('boolean') {\n <mat-checkbox\n [formControlName]=\"column.name\"\n [checked]=\"row.cellData[column.name].value\"\n (change)=\"\n onBooleanValueChange(\n column.name,\n row.record,\n $event\n )\n \"\n />\n }\n @case ('list') {\n <mat-select\n required=\"{{\n getValidationAttributeValue(column, 'mandatory')\n }}\"\n [formControlName]=\"column.name\"\n [multiple]=\"column.multiple\"\n (selectionChange)=\"\n onSelectValueChange(column.name, row.record, $event)\n \"\n [value]=\"row.cellData[column.name].value\"\n >\n @for (\n option of $any(column).domainValues;\n track option\n ) {\n <mat-option\n [value]=\"option.id\"\n [disabled]=\"option.disabled\"\n >\n {{ option.value }}\n </mat-option>\n }\n </mat-select>\n }\n @case ('autocomplete') {\n <input\n matInput\n type=\"text\"\n [formControlName]=\"column.name\"\n [matAutocomplete]=\"auto\"\n required=\"{{\n getValidationAttributeValue(column, 'mandatory')\n }}\"\n value=\"{{ row.cellData[column.name].value }}\"\n readonly=\"{{\n getValidationAttributeValue(column, 'readonly')\n }}\"\n />\n <mat-autocomplete\n #auto=\"matAutocomplete\"\n (optionSelected)=\"\n onAutocompleteValueChange(\n column,\n row.record,\n $event\n )\n \"\n panelWidth=\"430px\"\n >\n @for (\n option of filteredOptions[column.name] | async;\n track option\n ) {\n <mat-option [value]=\"option.id\">\n {{ option.value }}\n </mat-option>\n }\n </mat-autocomplete>\n }\n @default {\n <input\n matInput\n type=\"text\"\n [formControlName]=\"column.name\"\n value=\"{{ row.cellData[column.name].value }}\"\n (input)=\"\n onValueChange(column.name, row.record, $event)\n \"\n readonly=\"{{\n getValidationAttributeValue(column, 'readonly')\n }}\"\n required=\"{{\n getValidationAttributeValue(column, 'mandatory')\n }}\"\n />\n }\n }\n </td>\n } @else {\n @if (!row.cellData[column.name].isUrl) {\n <td\n mat-cell\n class=\"mat-cell-text\"\n [ngClass]=\"row.cellData[column.name].class\"\n [innerHTML]=\"\n row.cellData[column.name].value | sanitizeHtml\n \"\n ></td>\n } @else {\n <td\n mat-cell\n class=\"mat-cell-text\"\n [ngClass]=\"row.cellData[column.name].class\"\n >\n <a\n href=\"{{ row.cellData[column.name].value }}\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n (click)=\"$event.stopPropagation()\"\n >\n @if (row.cellData[column.name].isImg) {\n <img\n igoImageError\n src=\"{{\n row.cellData[column.name].value\n | secureImage\n | async\n }}\"\n width=\"50\"\n heigth=\"auto\"\n />\n } @else {\n ><span\n >{{ 'igo.geo.targetHtmlUrl' | translate }}\n </span>\n }\n </a>\n </td>\n }\n }\n </ng-container>\n }\n @case (entityTableColumnRenderer.Icon) {\n <td\n mat-cell\n *matCellDef=\"let row\"\n class=\"mat-cell-text\"\n [ngClass]=\"row.cellData[column.name].class\"\n >\n @if (column.onClick) {\n <mat-icon (click)=\"column.onClick($event)\">{{\n row.cellData[column.name].value || column.icon\n }}</mat-icon>\n } @else {\n <mat-icon>{{\n row.cellData[column.name].value || column.icon\n }}</mat-icon>\n }\n </td>\n }\n @case (entityTableColumnRenderer.ButtonGroup) {\n <ng-container *matCellDef=\"let row\">\n <td\n mat-cell\n class=\"mat-cell-text\"\n [ngClass]=\"row.cellData[column.name].class\"\n >\n @for (\n button of row.cellData[column.name].value;\n track button\n ) {\n @if (\n isEdition(row.record) === button.editMode ||\n button.editMode === undefined\n ) {\n <span>\n @if (button.style === 'mat-icon-button') {\n <button\n igoStopPropagation\n mat-icon-button\n [color]=\"button.color\"\n (mousedown)=\"\n onButtonClick(button.click, row.record)\n \"\n [disabled]=\"button.disabled\"\n >\n <mat-icon>{{ button.icon }}</mat-icon>\n </button>\n } @else {\n <button\n igoStopPropagation\n mat-mini-fab\n [color]=\"button.color\"\n (mousedown)=\"\n onButtonClick(button.click, row.record)\n \"\n [disabled]=\"button.disabled\"\n >\n <mat-icon>{{ button.icon }}</mat-icon>\n </button>\n }\n </span>\n }\n }\n </td>\n </ng-container>\n }\n @default {\n <ng-container *matCellDef=\"let row\">\n @if (!row.cellData[column.name].isUrl) {\n <td\n mat-cell\n class=\"mat-cell-text\"\n [ngClass]=\"row.cellData[column.name].class\"\n >\n {{ row.cellData[column.name].value }}\n </td>\n } @else {\n <td\n mat-cell\n class=\"mat-cell-text\"\n [ngClass]=\"row.cellData[column.name].class\"\n >\n <a\n href=\"{{ row.cellData[column.name].value }}\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n (click)=\"$event.stopPropagation()\"\n >\n @if (row.cellData[column.name].isImg) {\n <img\n igoImageError\n src=\"{{\n row.cellData[column.name].value\n | secureImage\n | async\n }}\"\n width=\"50\"\n heigth=\"auto\"\n />\n } @else {\n <span>{{\n 'igo.common.entity-table.targetHtmlUrl' | translate\n }}</span>\n }\n </a>\n </td>\n }\n </ng-container>\n }\n }\n }\n </ng-container>\n }\n\n <tr\n mat-header-row\n *matHeaderRowDef=\"headers; sticky: fixedHeader\"\n [ngClass]=\"getHeaderClass()\"\n ></tr>\n <tr\n mat-row\n igoEntityTableRow\n *matRowDef=\"let row; columns: headers\"\n [scrollBehavior]=\"scrollBehavior()\"\n [ngClass]=\"getRowClass(row.record)\"\n [selection]=\"selection\"\n [selected]=\"rowIsSelected(row.record)\"\n (select)=\"onRowSelect(row.record)\"\n (click)=\"onRowClick(row.record)\"\n ></tr>\n </table>\n @if (withPaginator()) {\n <igo-entity-table-paginator\n [store]=\"store()\"\n [paginatorOptions]=\"paginatorOptions()\"\n [entitySortChange$]=\"entitySortChange$\"\n (paginatorChange)=\"paginatorChange($event)\"\n />\n }\n</div>\n", styles: [":host{width:100%;height:100%;display:block;--mat-table-header-container-height: 52px}:host.table-compact tr.mat-mdc-header-row,:host.table-compact ::ng-deep mat-checkbox .mat-ripple{height:36px}:host.table-compact tr.mat-mdc-row,:host.table-compact ::ng-deep mat-checkbox .mat-ripple{height:28px}.table-container{display:flex;flex-direction:column;height:100%;overflow:auto;flex:1 1 auto}.mat-cell-text{overflow:hidden;word-wrap:break-word}table.igo-entity-table-with-selection tr:hover{-moz-box-shadow:2px 0px 2px 0px #dddddd;-webkit-box-shadow:2px 0px 2px 0px #dddddd;-o-box-shadow:2px 0px 2px 0px #dddddd;box-shadow:2px 0 2px #ddd;cursor:pointer}table button{margin:7px}.class_hidden{visibility:hidden}.class_display_none{display:none}.class_boolean,.class_icon,.class_number{text-align:center;padding-right:35px!important}.class_string,.class_text,.class_number_edition{text-align:left}td.edition{background:#a6a6a633}input{border-bottom:1px solid darkgrey}table.igo-entity-table-with-selection tr.igo-entity-table-row-highlighted{background-color:var(--mat-sys-primary-container);color:var(--mat-sys-on-primary-container)}\n"], dependencies: [{ kind: "component", type: EntityTablePaginatorComponent, selector: "igo-entity-table-paginator", inputs: ["entitySortChange$", "store", "paginatorOptions"], outputs: ["paginatorChange"] }, { kind: "directive", type: EntityTableRowDirective, selector: "[igoEntityTableRow]", inputs: ["selection", "selectOnClick", "highlightSelection", "selected", "scrollBehavior"], outputs: ["select"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1$2.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i1$2.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { kind: "directive", type: ImageErrorDirective, selector: "[igoImageError]", inputs: ["errorImageUrl", "hideError"] }, { kind: "ngmodule", type: MatAutocompleteModule }, { kind: "component", type: i2$1.MatAutocomplete, selector: "mat-autocomplete", inputs: ["aria-label", "aria-labelledby", "displayWith", "autoActiveFirstOption", "autoSelectActiveOption", "requireSelection", "panelWidth", "disableRipple", "class", "hideSingleSelectionIndicator"], outputs: ["optionSelected", "opened", "closed", "optionActivated"], exportAs: ["matAutocomplete"] }, { kind: "component", type: i2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "directive", type: i2$1.MatAutocompleteTrigger, selector: "input[matAutocomplete], textarea[matAutocomplete]", inputs: ["matAutocomplete", "matAutocompletePosition", "matAutocompleteConnectedTo", "autocomplete", "matAutocompleteDisabled"], exportAs: ["matAutocompleteTrigger"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i4.MatMiniFabButton, selector: "button[mat-mini-fab], a[mat-mini-fab], button[matMiniFab], a[matMiniFab]", exportAs: ["matButton", "matAnchor"] }, { kind: "component", type: i4.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i5.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: MatDatepickerModule }, { kind: "component", type: i6.MatDatepicker, selector: "mat-datepicker", exportAs: ["matDatepicker"] }, { kind: "directive", type: i6.MatDatepickerInput, selector: "input[matDatepicker]", inputs: ["matDatepicker", "min", "max", "matDatepickerFilter"], exportAs: ["matDatepickerInput"] }, { kind: "component", type: i6.MatDatepickerToggle, selector: "mat-datepicker-toggle", inputs: ["for", "tabIndex", "aria-label", "disabled", "disableRipple"], exportAs: ["matDatepickerToggle"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "directive", type: i1.MatSuffix, selector: "[matSuffix], [matIconSuffix], [matTextSuffix]", inputs: ["matTextSuffix"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i8.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i9.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatNativeDateModule }, { kind: "ngmodule", type: // For the DateAdapter provider
|
|
2964
2966
|
MatOptionModule }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i2.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "ngmodule", type: MatSortModule }, { kind: "directive", type: i10.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i10.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i11.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i11.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i11.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i11.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i11.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i11.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i11.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i11.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i11.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i11.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i12.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: StopPropagationDirective, selector: "[igoStopPropagation]" }, { kind: "ngmodule", type: IgoLanguageModule }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: SanitizeHtmlPipe, name: "sanitizeHtml" }, { kind: "pipe", type: SecureImagePipe, name: "secureImage" }, { kind: "pipe", type: i13.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2965
2967
|
}
|
|
2966
2968
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: EntityTableComponent, decorators: [{
|
|
@@ -2993,7 +2995,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImpo
|
|
|
2993
2995
|
SecureImagePipe,
|
|
2994
2996
|
StopPropagationDirective,
|
|
2995
2997
|
IgoLanguageModule
|
|
2996
|
-
], template: "<div class=\"table-container\" [style.height]=\"tableHeight\">\n <table\n id=\"currentWorkspaceTable\"\n mat-table\n matSort\n [ngClass]=\"getTableClass()\"\n [dataSource]=\"dataSource\"\n [trackBy]=\"getTrackByFunction()\"\n (matSortChange)=\"onSort($event)\"\n >\n <ng-container matColumnDef=\"selectionCheckbox\" class=\"mat-cell-checkbox\">\n <th mat-header-cell *matHeaderCellDef>\n @if (selectMany) {\n @let selectionState = selectionState$ | async;\n @if (selectionState) {\n <mat-checkbox\n (change)=\"onToggleRows($event.checked)\"\n [checked]=\"selectionState === entityTableSelectionState.All\"\n [indeterminate]=\"\n selectionState === entityTableSelectionState.Some\n \"\n />\n }\n }\n </th>\n <td mat-cell *matCellDef=\"let row\">\n <mat-checkbox\n (mousedown)=\"$event.shiftKey ? $event.preventDefault() : null\"\n (click)=\"\n $event.shiftKey\n ? onShiftToggleRow(!rowIsSelected(row.record), row.record, $event)\n : $event.stopPropagation()\n \"\n (change)=\"onToggleRow($event.checked, row.record)\"\n [checked]=\"rowIsSelected(row.record)\"\n />\n </td>\n </ng-container>\n\n @for (column of template().columns; track column) {\n <ng-container [matColumnDef]=\"column.name\">\n @if (columnIsSortable(column)) {\n <th\n mat-header-cell\n *matHeaderCellDef\n mat-sort-header\n [matTooltip]=\"column.tooltip ? column.tooltip : undefined\"\n >\n {{ column.title }}\n </th>\n } @else {\n <th\n mat-header-cell\n *matHeaderCellDef\n [matTooltip]=\"column.tooltip ? column.tooltip : undefined\"\n >\n {{ column.title }}\n </th>\n }\n\n @let columnRenderer = getColumnRenderer(column);\n @if (columnRenderer) {\n @switch (columnRenderer) {\n @case (entityTableColumnRenderer.HTML) {\n <ng-container *matCellDef=\"let row\">\n @if (!row.cellData[column.name].isUrl) {\n <td\n mat-cell\n class=\"mat-cell-text\"\n [ngClass]=\"row.cellData[column.name].class\"\n [innerHTML]=\"row.cellData[column.name].value\"\n ></td>\n } @else {\n <td\n mat-cell\n class=\"mat-cell-text\"\n [ngClass]=\"row.cellData[column.name].class\"\n >\n <a\n href=\"{{ row.cellData[column.name].value }}\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n (click)=\"$event.stopPropagation()\"\n >\n @if (row.cellData[column.name].isImg) {\n <img\n igoImageError\n src=\"{{\n row.cellData[column.name].value\n | secureImage\n | async\n }}\"\n width=\"50\"\n heigth=\"auto\"\n />\n } @else {\n <span>{{ 'igo.geo.targetHtmlUrl' | translate }} </span>\n }\n >\n </a>\n </td>\n }\n </ng-container>\n }\n @case (entityTableColumnRenderer.UnsanitizedHTML) {\n <ng-container *matCellDef=\"let row\">\n @if (isEdition(row.record)) {\n <td\n mat-cell\n class=\"mat-cell-text edition\"\n [formGroup]=\"formGroup\"\n [ngClass]=\"row.cellData[column.name].class\"\n >\n @switch (column.type) {\n @case ('date') {\n <div class=\"date-picker\">\n <mat-datepicker-toggle matSuffix [for]=\"picker\" />\n <input\n matInput\n [matDatepicker]=\"picker\"\n [formControlName]=\"column.name\"\n value=\"{{ row.cellData[column.name].value }}\"\n (dateChange)=\"\n onDateChange(column.name, row.record, $event)\n \"\n />\n <mat-datepicker #picker />\n </div>\n }\n @case ('time') {\n <input\n matInput\n type=\"time\"\n [formControlName]=\"column.name\"\n step=\"900\"\n (focus)=\"column.onFocus($event)\"\n (keypress)=\"column.onChange($event)\"\n (blur)=\"column.onBlur($event)\"\n />\n }\n @case ('number') {\n <input\n matInput\n type=\"number\"\n class=\"class_number_edition\"\n [formControlName]=\"column.name\"\n step=\"{{ column.step }}\"\n value=\"{{ row.cellData[column.name].value }}\"\n (input)=\"\n onValueChange(column.name, row.record, $event)\n \"\n readonly=\"{{\n getValidationAttributeValue(column, 'readonly')\n }}\"\n required=\"{{\n getValidationAttributeValue(column, 'mandatory')\n }}\"\n min=\"{{\n getValidationAttributeValue(column, 'minValue')\n }}\"\n max=\"{{\n getValidationAttributeValue(column, 'maxValue')\n }}\"\n />\n }\n @case ('boolean') {\n <mat-checkbox\n [formControlName]=\"column.name\"\n [checked]=\"row.cellData[column.name].value\"\n (change)=\"\n onBooleanValueChange(\n column.name,\n row.record,\n $event\n )\n \"\n />\n }\n @case ('list') {\n <mat-select\n required=\"{{\n getValidationAttributeValue(column, 'mandatory')\n }}\"\n [formControlName]=\"column.name\"\n [multiple]=\"column.multiple\"\n (selectionChange)=\"\n onSelectValueChange(column.name, row.record, $event)\n \"\n [value]=\"row.cellData[column.name].value\"\n >\n @for (\n option of $any(column).domainValues;\n track option\n ) {\n <mat-option\n [value]=\"option.id\"\n [disabled]=\"option.disabled\"\n >\n {{ option.value }}\n </mat-option>\n }\n </mat-select>\n }\n @case ('autocomplete') {\n <input\n matInput\n type=\"text\"\n [formControlName]=\"column.name\"\n [matAutocomplete]=\"auto\"\n required=\"{{\n getValidationAttributeValue(column, 'mandatory')\n }}\"\n value=\"{{ row.cellData[column.name].value }}\"\n readonly=\"{{\n getValidationAttributeValue(column, 'readonly')\n }}\"\n />\n <mat-autocomplete\n #auto=\"matAutocomplete\"\n (optionSelected)=\"\n onAutocompleteValueChange(\n column,\n row.record,\n $event\n )\n \"\n panelWidth=\"430px\"\n >\n @for (\n option of filteredOptions[column.name] | async;\n track option\n ) {\n <mat-option [value]=\"option.id\">\n {{ option.value }}\n </mat-option>\n }\n </mat-autocomplete>\n }\n @default {\n <input\n matInput\n type=\"text\"\n [formControlName]=\"column.name\"\n value=\"{{ row.cellData[column.name].value }}\"\n (input)=\"\n onValueChange(column.name, row.record, $event)\n \"\n readonly=\"{{\n getValidationAttributeValue(column, 'readonly')\n }}\"\n required=\"{{\n getValidationAttributeValue(column, 'mandatory')\n }}\"\n />\n }\n }\n </td>\n } @else {\n @if (!row.cellData[column.name].isUrl) {\n <td\n mat-cell\n class=\"mat-cell-text\"\n [ngClass]=\"row.cellData[column.name].class\"\n [innerHTML]=\"\n row.cellData[column.name].value | sanitizeHtml\n \"\n ></td>\n } @else {\n <td\n mat-cell\n class=\"mat-cell-text\"\n [ngClass]=\"row.cellData[column.name].class\"\n >\n <a\n href=\"{{ row.cellData[column.name].value }}\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n (click)=\"$event.stopPropagation()\"\n >\n @if (row.cellData[column.name].isImg) {\n <img\n igoImageError\n src=\"{{\n row.cellData[column.name].value\n | secureImage\n | async\n }}\"\n width=\"50\"\n heigth=\"auto\"\n />\n } @else {\n ><span\n >{{ 'igo.geo.targetHtmlUrl' | translate }}\n </span>\n }\n >\n </a>\n </td>\n }\n }\n </ng-container>\n }\n @case (entityTableColumnRenderer.Icon) {\n <td\n mat-cell\n *matCellDef=\"let row\"\n class=\"mat-cell-text\"\n [ngClass]=\"row.cellData[column.name].class\"\n >\n @if (column.onClick) {\n <mat-icon (click)=\"column.onClick($event)\">{{\n row.cellData[column.name].value || column.icon\n }}</mat-icon>\n } @else {\n <mat-icon>{{\n row.cellData[column.name].value || column.icon\n }}</mat-icon>\n }\n </td>\n }\n @case (entityTableColumnRenderer.ButtonGroup) {\n <ng-container *matCellDef=\"let row\">\n <td\n mat-cell\n class=\"mat-cell-text\"\n [ngClass]=\"row.cellData[column.name].class\"\n >\n @for (\n button of row.cellData[column.name].value;\n track button\n ) {\n @if (\n isEdition(row.record) === button.editMode ||\n button.editMode === undefined\n ) {\n <span>\n @if (button.style === 'mat-icon-button') {\n <button\n igoStopPropagation\n mat-icon-button\n [color]=\"button.color\"\n (mousedown)=\"\n onButtonClick(button.click, row.record)\n \"\n [disabled]=\"button.disabled\"\n >\n <mat-icon>{{ button.icon }}</mat-icon>\n </button>\n } @else {\n <button\n igoStopPropagation\n mat-mini-fab\n [color]=\"button.color\"\n (mousedown)=\"\n onButtonClick(button.click, row.record)\n \"\n [disabled]=\"button.disabled\"\n >\n <mat-icon>{{ button.icon }}</mat-icon>\n </button>\n }\n </span>\n }\n }\n </td>\n </ng-container>\n }\n @default {\n <ng-container *matCellDef=\"let row\">\n @if (!row.cellData[column.name].isUrl) {\n <td\n mat-cell\n class=\"mat-cell-text\"\n [ngClass]=\"row.cellData[column.name].class\"\n >\n {{ row.cellData[column.name].value }}\n </td>\n } @else {\n <td\n mat-cell\n class=\"mat-cell-text\"\n [ngClass]=\"row.cellData[column.name].class\"\n >\n <a\n href=\"{{ row.cellData[column.name].value }}\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n (click)=\"$event.stopPropagation()\"\n >\n @if (row.cellData[column.name].isImg) {\n <img\n igoImageError\n src=\"{{\n row.cellData[column.name].value\n | secureImage\n | async\n }}\"\n width=\"50\"\n heigth=\"auto\"\n />\n } @else {\n <span>{{\n 'igo.common.entity-table.targetHtmlUrl' | translate\n }}</span>\n }\n >\n </a>\n </td>\n }\n </ng-container>\n }\n }\n }\n </ng-container>\n }\n\n <tr\n mat-header-row\n *matHeaderRowDef=\"headers; sticky: fixedHeader\"\n [ngClass]=\"getHeaderClass()\"\n ></tr>\n <tr\n mat-row\n igoEntityTableRow\n *matRowDef=\"let row; columns: headers\"\n [scrollBehavior]=\"scrollBehavior()\"\n [ngClass]=\"getRowClass(row.record)\"\n [selection]=\"selection\"\n [selected]=\"rowIsSelected(row.record)\"\n (select)=\"onRowSelect(row.record)\"\n (click)=\"onRowClick(row.record)\"\n ></tr>\n </table>\n @if (withPaginator()) {\n <igo-entity-table-paginator\n [store]=\"store()\"\n [paginatorOptions]=\"paginatorOptions()\"\n [entitySortChange$]=\"entitySortChange$\"\n (paginatorChange)=\"paginatorChange($event)\"\n />\n }\n</div>\n", styles: [":host{width:100%;height:100%;display:block;--mat-table-header-container-height: 52px}:host.table-compact tr.mat-mdc-header-row,:host.table-compact ::ng-deep mat-checkbox .mat-ripple{height:36px}:host.table-compact tr.mat-mdc-row,:host.table-compact ::ng-deep mat-checkbox .mat-ripple{height:28px}.table-container{display:flex;flex-direction:column;height:100%;overflow:auto;flex:1 1 auto}.mat-cell-text{overflow:hidden;word-wrap:break-word}table.igo-entity-table-with-selection tr:hover{-moz-box-shadow:2px 0px 2px 0px #dddddd;-webkit-box-shadow:2px 0px 2px 0px #dddddd;-o-box-shadow:2px 0px 2px 0px #dddddd;box-shadow:2px 0 2px #ddd;cursor:pointer}table button{margin:7px}.class_hidden{visibility:hidden}.class_display_none{display:none}.class_boolean,.class_icon,.class_number{text-align:center;padding-right:35px!important}.class_string,.class_text,.class_number_edition{text-align:left}td.edition{background:#a6a6a633}input{border-bottom:1px solid darkgrey}table.igo-entity-table-with-selection tr.igo-entity-table-row-highlighted{background-color:var(--mat-sys-primary-container);color:var(--mat-sys-on-primary-container)}\n"] }]
|
|
2998
|
+
], template: "<div class=\"table-container\" [style.height]=\"tableHeight\">\n <table\n id=\"currentWorkspaceTable\"\n mat-table\n matSort\n [ngClass]=\"getTableClass()\"\n [dataSource]=\"dataSource\"\n [trackBy]=\"getTrackByFunction()\"\n (matSortChange)=\"onSort($event)\"\n >\n <ng-container matColumnDef=\"selectionCheckbox\" class=\"mat-cell-checkbox\">\n <th mat-header-cell *matHeaderCellDef>\n @if (selectMany) {\n @let selectionState = selectionState$ | async;\n @if (selectionState) {\n <mat-checkbox\n (change)=\"onToggleRows($event.checked)\"\n [checked]=\"selectionState === entityTableSelectionState.All\"\n [indeterminate]=\"\n selectionState === entityTableSelectionState.Some\n \"\n />\n }\n }\n </th>\n <td mat-cell *matCellDef=\"let row\">\n <mat-checkbox\n (mousedown)=\"$event.shiftKey ? $event.preventDefault() : null\"\n (click)=\"\n $event.shiftKey\n ? onShiftToggleRow(!rowIsSelected(row.record), row.record, $event)\n : $event.stopPropagation()\n \"\n (change)=\"onToggleRow($event.checked, row.record)\"\n [checked]=\"rowIsSelected(row.record)\"\n />\n </td>\n </ng-container>\n\n @for (column of template().columns; track column) {\n <ng-container [matColumnDef]=\"column.name\">\n @if (columnIsSortable(column)) {\n <th\n mat-header-cell\n *matHeaderCellDef\n mat-sort-header\n [matTooltip]=\"column.tooltip ? column.tooltip : undefined\"\n >\n {{ column.title }}\n </th>\n } @else {\n <th\n mat-header-cell\n *matHeaderCellDef\n [matTooltip]=\"column.tooltip ? column.tooltip : undefined\"\n >\n {{ column.title }}\n </th>\n }\n\n @let columnRenderer = getColumnRenderer(column);\n @if (columnRenderer) {\n @switch (columnRenderer) {\n @case (entityTableColumnRenderer.HTML) {\n <ng-container *matCellDef=\"let row\">\n @if (!row.cellData[column.name].isUrl) {\n <td\n mat-cell\n class=\"mat-cell-text\"\n [ngClass]=\"row.cellData[column.name].class\"\n [innerHTML]=\"row.cellData[column.name].value\"\n ></td>\n } @else {\n <td\n mat-cell\n class=\"mat-cell-text\"\n [ngClass]=\"row.cellData[column.name].class\"\n >\n <a\n href=\"{{ row.cellData[column.name].value }}\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n (click)=\"$event.stopPropagation()\"\n >\n @if (row.cellData[column.name].isImg) {\n <img\n igoImageError\n src=\"{{\n row.cellData[column.name].value\n | secureImage\n | async\n }}\"\n width=\"50\"\n heigth=\"auto\"\n />\n } @else {\n <span>{{ 'igo.geo.targetHtmlUrl' | translate }} </span>\n }\n </a>\n </td>\n }\n </ng-container>\n }\n @case (entityTableColumnRenderer.UnsanitizedHTML) {\n <ng-container *matCellDef=\"let row\">\n @if (isEdition(row.record)) {\n <td\n mat-cell\n class=\"mat-cell-text edition\"\n [formGroup]=\"formGroup\"\n [ngClass]=\"row.cellData[column.name].class\"\n >\n @switch (column.type) {\n @case ('date') {\n <div class=\"date-picker\">\n <mat-datepicker-toggle matSuffix [for]=\"picker\" />\n <input\n matInput\n [matDatepicker]=\"picker\"\n [formControlName]=\"column.name\"\n value=\"{{ row.cellData[column.name].value }}\"\n (dateChange)=\"\n onDateChange(column.name, row.record, $event)\n \"\n />\n <mat-datepicker #picker />\n </div>\n }\n @case ('time') {\n <input\n matInput\n type=\"time\"\n [formControlName]=\"column.name\"\n step=\"900\"\n (focus)=\"column.onFocus($event)\"\n (keypress)=\"column.onChange($event)\"\n (blur)=\"column.onBlur($event)\"\n />\n }\n @case ('number') {\n <input\n matInput\n type=\"number\"\n class=\"class_number_edition\"\n [formControlName]=\"column.name\"\n step=\"{{ column.step }}\"\n value=\"{{ row.cellData[column.name].value }}\"\n (input)=\"\n onValueChange(column.name, row.record, $event)\n \"\n readonly=\"{{\n getValidationAttributeValue(column, 'readonly')\n }}\"\n required=\"{{\n getValidationAttributeValue(column, 'mandatory')\n }}\"\n min=\"{{\n getValidationAttributeValue(column, 'minValue')\n }}\"\n max=\"{{\n getValidationAttributeValue(column, 'maxValue')\n }}\"\n />\n }\n @case ('boolean') {\n <mat-checkbox\n [formControlName]=\"column.name\"\n [checked]=\"row.cellData[column.name].value\"\n (change)=\"\n onBooleanValueChange(\n column.name,\n row.record,\n $event\n )\n \"\n />\n }\n @case ('list') {\n <mat-select\n required=\"{{\n getValidationAttributeValue(column, 'mandatory')\n }}\"\n [formControlName]=\"column.name\"\n [multiple]=\"column.multiple\"\n (selectionChange)=\"\n onSelectValueChange(column.name, row.record, $event)\n \"\n [value]=\"row.cellData[column.name].value\"\n >\n @for (\n option of $any(column).domainValues;\n track option\n ) {\n <mat-option\n [value]=\"option.id\"\n [disabled]=\"option.disabled\"\n >\n {{ option.value }}\n </mat-option>\n }\n </mat-select>\n }\n @case ('autocomplete') {\n <input\n matInput\n type=\"text\"\n [formControlName]=\"column.name\"\n [matAutocomplete]=\"auto\"\n required=\"{{\n getValidationAttributeValue(column, 'mandatory')\n }}\"\n value=\"{{ row.cellData[column.name].value }}\"\n readonly=\"{{\n getValidationAttributeValue(column, 'readonly')\n }}\"\n />\n <mat-autocomplete\n #auto=\"matAutocomplete\"\n (optionSelected)=\"\n onAutocompleteValueChange(\n column,\n row.record,\n $event\n )\n \"\n panelWidth=\"430px\"\n >\n @for (\n option of filteredOptions[column.name] | async;\n track option\n ) {\n <mat-option [value]=\"option.id\">\n {{ option.value }}\n </mat-option>\n }\n </mat-autocomplete>\n }\n @default {\n <input\n matInput\n type=\"text\"\n [formControlName]=\"column.name\"\n value=\"{{ row.cellData[column.name].value }}\"\n (input)=\"\n onValueChange(column.name, row.record, $event)\n \"\n readonly=\"{{\n getValidationAttributeValue(column, 'readonly')\n }}\"\n required=\"{{\n getValidationAttributeValue(column, 'mandatory')\n }}\"\n />\n }\n }\n </td>\n } @else {\n @if (!row.cellData[column.name].isUrl) {\n <td\n mat-cell\n class=\"mat-cell-text\"\n [ngClass]=\"row.cellData[column.name].class\"\n [innerHTML]=\"\n row.cellData[column.name].value | sanitizeHtml\n \"\n ></td>\n } @else {\n <td\n mat-cell\n class=\"mat-cell-text\"\n [ngClass]=\"row.cellData[column.name].class\"\n >\n <a\n href=\"{{ row.cellData[column.name].value }}\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n (click)=\"$event.stopPropagation()\"\n >\n @if (row.cellData[column.name].isImg) {\n <img\n igoImageError\n src=\"{{\n row.cellData[column.name].value\n | secureImage\n | async\n }}\"\n width=\"50\"\n heigth=\"auto\"\n />\n } @else {\n ><span\n >{{ 'igo.geo.targetHtmlUrl' | translate }}\n </span>\n }\n </a>\n </td>\n }\n }\n </ng-container>\n }\n @case (entityTableColumnRenderer.Icon) {\n <td\n mat-cell\n *matCellDef=\"let row\"\n class=\"mat-cell-text\"\n [ngClass]=\"row.cellData[column.name].class\"\n >\n @if (column.onClick) {\n <mat-icon (click)=\"column.onClick($event)\">{{\n row.cellData[column.name].value || column.icon\n }}</mat-icon>\n } @else {\n <mat-icon>{{\n row.cellData[column.name].value || column.icon\n }}</mat-icon>\n }\n </td>\n }\n @case (entityTableColumnRenderer.ButtonGroup) {\n <ng-container *matCellDef=\"let row\">\n <td\n mat-cell\n class=\"mat-cell-text\"\n [ngClass]=\"row.cellData[column.name].class\"\n >\n @for (\n button of row.cellData[column.name].value;\n track button\n ) {\n @if (\n isEdition(row.record) === button.editMode ||\n button.editMode === undefined\n ) {\n <span>\n @if (button.style === 'mat-icon-button') {\n <button\n igoStopPropagation\n mat-icon-button\n [color]=\"button.color\"\n (mousedown)=\"\n onButtonClick(button.click, row.record)\n \"\n [disabled]=\"button.disabled\"\n >\n <mat-icon>{{ button.icon }}</mat-icon>\n </button>\n } @else {\n <button\n igoStopPropagation\n mat-mini-fab\n [color]=\"button.color\"\n (mousedown)=\"\n onButtonClick(button.click, row.record)\n \"\n [disabled]=\"button.disabled\"\n >\n <mat-icon>{{ button.icon }}</mat-icon>\n </button>\n }\n </span>\n }\n }\n </td>\n </ng-container>\n }\n @default {\n <ng-container *matCellDef=\"let row\">\n @if (!row.cellData[column.name].isUrl) {\n <td\n mat-cell\n class=\"mat-cell-text\"\n [ngClass]=\"row.cellData[column.name].class\"\n >\n {{ row.cellData[column.name].value }}\n </td>\n } @else {\n <td\n mat-cell\n class=\"mat-cell-text\"\n [ngClass]=\"row.cellData[column.name].class\"\n >\n <a\n href=\"{{ row.cellData[column.name].value }}\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n (click)=\"$event.stopPropagation()\"\n >\n @if (row.cellData[column.name].isImg) {\n <img\n igoImageError\n src=\"{{\n row.cellData[column.name].value\n | secureImage\n | async\n }}\"\n width=\"50\"\n heigth=\"auto\"\n />\n } @else {\n <span>{{\n 'igo.common.entity-table.targetHtmlUrl' | translate\n }}</span>\n }\n </a>\n </td>\n }\n </ng-container>\n }\n }\n }\n </ng-container>\n }\n\n <tr\n mat-header-row\n *matHeaderRowDef=\"headers; sticky: fixedHeader\"\n [ngClass]=\"getHeaderClass()\"\n ></tr>\n <tr\n mat-row\n igoEntityTableRow\n *matRowDef=\"let row; columns: headers\"\n [scrollBehavior]=\"scrollBehavior()\"\n [ngClass]=\"getRowClass(row.record)\"\n [selection]=\"selection\"\n [selected]=\"rowIsSelected(row.record)\"\n (select)=\"onRowSelect(row.record)\"\n (click)=\"onRowClick(row.record)\"\n ></tr>\n </table>\n @if (withPaginator()) {\n <igo-entity-table-paginator\n [store]=\"store()\"\n [paginatorOptions]=\"paginatorOptions()\"\n [entitySortChange$]=\"entitySortChange$\"\n (paginatorChange)=\"paginatorChange($event)\"\n />\n }\n</div>\n", styles: [":host{width:100%;height:100%;display:block;--mat-table-header-container-height: 52px}:host.table-compact tr.mat-mdc-header-row,:host.table-compact ::ng-deep mat-checkbox .mat-ripple{height:36px}:host.table-compact tr.mat-mdc-row,:host.table-compact ::ng-deep mat-checkbox .mat-ripple{height:28px}.table-container{display:flex;flex-direction:column;height:100%;overflow:auto;flex:1 1 auto}.mat-cell-text{overflow:hidden;word-wrap:break-word}table.igo-entity-table-with-selection tr:hover{-moz-box-shadow:2px 0px 2px 0px #dddddd;-webkit-box-shadow:2px 0px 2px 0px #dddddd;-o-box-shadow:2px 0px 2px 0px #dddddd;box-shadow:2px 0 2px #ddd;cursor:pointer}table button{margin:7px}.class_hidden{visibility:hidden}.class_display_none{display:none}.class_boolean,.class_icon,.class_number{text-align:center;padding-right:35px!important}.class_string,.class_text,.class_number_edition{text-align:left}td.edition{background:#a6a6a633}input{border-bottom:1px solid darkgrey}table.igo-entity-table-with-selection tr.igo-entity-table-row-highlighted{background-color:var(--mat-sys-primary-container);color:var(--mat-sys-on-primary-container)}\n"] }]
|
|
2997
2999
|
}], ctorParameters: () => [], propDecorators: { store: [{ type: i0.Input, args: [{ isSignal: true, alias: "store", required: false }] }], paginator: [{
|
|
2998
3000
|
type: Input
|
|
2999
3001
|
}], template: [{ type: i0.Input, args: [{ isSignal: true, alias: "template", required: false }] }], scrollBehavior: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollBehavior", required: false }] }], sortNullsFirst: [{ type: i0.Input, args: [{ isSignal: true, alias: "sortNullsFirst", required: false }] }], withPaginator: [{ type: i0.Input, args: [{ isSignal: true, alias: "withPaginator", required: false }] }], paginatorOptions: [{ type: i0.Input, args: [{ isSignal: true, alias: "paginatorOptions", required: false }] }], entityClick: [{ type: i0.Output, args: ["entityClick"] }], entitySelectChange: [{ type: i0.Output, args: ["entitySelectChange"] }], entitySortChange: [{ type: i0.Output, args: ["entitySortChange"] }] } });
|