@fuentis/phoenix-ui 0.0.9-alpha.75 → 0.0.9-alpha.77
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.
|
@@ -33,7 +33,6 @@ import * as i3$2 from 'primeng/divider';
|
|
|
33
33
|
import { DividerModule } from 'primeng/divider';
|
|
34
34
|
import * as i5$1 from 'primeng/image';
|
|
35
35
|
import { Image, ImageModule } from 'primeng/image';
|
|
36
|
-
import * as i3$a from 'primeng/panel';
|
|
37
36
|
import { PanelModule } from 'primeng/panel';
|
|
38
37
|
import { BehaviorSubject, Subject, combineLatestWith, debounceTime, switchMap, of, distinctUntilChanged, combineLatest } from 'rxjs';
|
|
39
38
|
import * as i2$3 from 'primeng/table';
|
|
@@ -77,8 +76,9 @@ import { PasswordModule } from 'primeng/password';
|
|
|
77
76
|
import { TextareaModule } from 'primeng/textarea';
|
|
78
77
|
import { FileUploadModule } from 'primeng/fileupload';
|
|
79
78
|
import * as i1$4 from '@angular/platform-browser';
|
|
80
|
-
import * as i4$5 from 'primeng/messages';
|
|
81
79
|
import { MessagesModule } from 'primeng/messages';
|
|
80
|
+
import * as i3$a from 'primeng/accordion';
|
|
81
|
+
import { AccordionModule } from 'primeng/accordion';
|
|
82
82
|
|
|
83
83
|
class SidebarItemComponent {
|
|
84
84
|
router;
|
|
@@ -1634,7 +1634,7 @@ class TableComponent {
|
|
|
1634
1634
|
this.tableDataSignal.set(filteredData);
|
|
1635
1635
|
}
|
|
1636
1636
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: TableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1637
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.3", type: TableComponent, isStandalone: true, selector: "phoenix-table", inputs: { data: "data", columns: "columns", tableConfiguration: "tableConfiguration" }, outputs: { actionClick: "actionClick", rowSelection: "rowSelection" }, ngImport: i0, template: "<div class=\"border-1 border-round-sm border-300 border-round-md m-2\">\n <table-caption\n [columns]=\"columns\"\n [tableConfiguration]=\"tableConfiguration\"\n [selectedItems]=\"selectedItems()\"\n (applyFiltersEvent)=\"applyFilters($event)\"\n (applyColumnsEvent)=\"applyColumns($event)\"\n (searchChange)=\"onSearch($event)\"\n (actionClick)=\"handleActionClick($event)\"\n >\n </table-caption>\n\n <p-table\n [columns]=\"selectedColumns()\"\n [value]=\"tableDataSignal()\"\n [size]=\"'small'\"\n scrollable=\"true\"\n scrollHeight=\"600px\"\n [virtualScroll]=\"true\"\n [virtualScrollItemSize]=\"50\"\n [rows]=\"100\"\n [lazy]=\"true\"\n [totalRecords]=\"totalRecords()\"\n (onLazyLoad)=\"loadLazyData($event)\"\n [selection]=\"selectedItems()\"\n (selectionChange)=\"onSelectionChange($event)\"\n [sortMode]=\"'multiple'\"\n [size]=\"'small'\"\n >\n <ng-template #header let-columns>\n <tr style=\"height: 40px\" class=\"dt-header\">\n <th class=\"custom-th\" style=\"width: 4rem\"><p-tableHeaderCheckbox /></th>\n <th\n class=\"custom-th font-bold\"\n *ngFor=\"let col of columns\"\n [pSortableColumn]=\"col.field\"\n >\n {{ col.header | translate }}\n <p-sortIcon [field]=\"col.field\"></p-sortIcon>\n </th>\n <!-- create empty th placeholders for actions -->\n <th class=\"custom-th\"></th>\n </tr>\n </ng-template>\n\n <ng-template #body let-rowData let-rowIndex=\"rowIndex\">\n <tr>\n <td>\n <p-tableCheckbox [value]=\"rowData\" />\n </td>\n <td\n *ngFor=\"let col of columns; let i = index\"\n (click)=\"\n i < 2 && tableConfiguration.hasCellClick\n ? onRowClick($event, rowData)\n : null\n \"\n [ngClass]=\"{\n 'text-blue-500 underline cursor-pointer':\n i < 2 && tableConfiguration.hasCellClick\n }\"\n >\n <ng-container [ngSwitch]=\"col.columnType\">\n \n <!-- TAG case -->\n <ng-container *ngSwitchCase=\"columnTypeEnum.TAG\">\n <ng-container *ngIf=\"rowData[col.field]; else emptyCell\">\n <p-tag\n styleClass=\"custom-tag\"\n [style]=\"{\n 'background-color': rowData[col.field + 'Color'] || '#ccc',\n 'font-weight': '200'\n }\"\n [value]=\"rowData[col.field]?.name || rowData[col.field]\"\n >\n </p-tag>\n </ng-container>\n </ng-container>\n \n <!-- PERSON case -->\n <ng-container *ngSwitchCase=\"columnTypeEnum.PERSON\">\n <ng-container *ngIf=\"rowData[col.field]; else emptyCell\">\n <p-avatar\n [label]=\"(rowData[col.field] | cell : col)?.avatar\"\n class=\"mr-1\"\n [style]=\"{ 'background-color': '#9c27b0', color: '#ffffff' }\"\n shape=\"circle\"\n >\n </p-avatar>\n {{ (rowData[col.field] | cell : col)?.name }}\n </ng-container>\n </ng-container>\n\n <!-- LIST case -->\n <ng-container *ngSwitchCase=\"columnTypeEnum.LIST\">\n <ng-container *ngIf=\"rowData[col.field]; else emptyCell\">\n <ul\n *ngFor=\"let item of rowData[col.field]\"\n [attr.data-cy]=\"'table-cell-' + (columnTypeEnum.LIST | lowercase)\"\n >\n <li>{{ item.name }}</li>\n </ul>\n </ng-container>\n </ng-container>\n \n <!-- DEFAULT case -->\n <ng-container *ngSwitchDefault>\n <span [innerHTML]=\"rowData[col.field] | cell : col : dateFormat\"></span>\n </ng-container>\n \n </ng-container>\n </td>\n\n <td class=\"p-0\">\n <ng-container *ngFor=\"let action of tableConfiguration.rowActions\">\n <phoenix-phoenix-data-table-action\n [actionConfig]=\"action\"\n [rowData]=\"rowData\"\n (actionClick)=\"handleActionClick({ $event, rowData })\"\n ></phoenix-phoenix-data-table-action\n ></ng-container>\n </td>\n </tr>\n </ng-template>\n\n <ng-template #emptyCell> -- </ng-template>\n\n <ng-template pTemplate=\"loadingbody\" let-columns>\n <tr style=\"height: 46px\">\n <td *ngFor=\"let col of columns; let even = even\">\n <tr>\n <td *ngFor=\"let col of columns; let even = even\">\n <p-skeleton\n [ngStyle]=\"{\n width: '60%',\n }\"\n ></p-skeleton>\n </td>\n\n <td>\n <p-skeleton\n [ngStyle]=\"{\n width: '20%',\n }\"\n ></p-skeleton>\n </td>\n </tr>\n </td>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"emptymessage\">\n <td class=\"p-2\" colspan=\"100\">\n <div class=\"flex align-items-center\">\n <i class=\"pi pi-info-circle mr-2\"></i>\n {{ \"NO_RESULTS_FOUND\" | translate }}\n </div>\n </td>\n </ng-template>\n </p-table>\n</div>\n", styles: [".custom-th{background-color:var(--surface-100)!important}.dt-header th:not(:last-child){border-right:1px solid #e4e4e4!important}:is() .p-avatar{border-radius:50%!important}::ng-deep .p-paginator button{scale:.7}::ng-deep .p-paginator-rpp-options{scale:.7}::ng-deep .p-datatable .p-datatable-header{border-radius:10px 10px 0 0}::ng-deep .p-tag{font-weight:200!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i1$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1$1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "pipe", type: i1$1.LowerCasePipe, name: "lowercase" }, { kind: "ngmodule", type: TableModule }, { kind: "component", type: i2$3.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "virtualRowHeight", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i3$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i2$3.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2$3.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i2$3.TableCheckbox, selector: "p-tableCheckbox", inputs: ["disabled", "value", "index", "inputId", "name", "required", "ariaLabel"] }, { kind: "component", type: i2$3.TableHeaderCheckbox, selector: "p-tableHeaderCheckbox", inputs: ["disabled", "inputId", "name", "ariaLabel"] }, { kind: "component", type: TableCaptionComponent, selector: "table-caption", inputs: ["tableConfiguration", "columns", "searchQuery", "selectedItems"], outputs: ["applyFiltersEvent", "applyColumnsEvent", "searchChange", "actionClick"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3$1.TranslatePipe, name: "translate" }, { kind: "component", type: PhoenixDataTableActionComponent, selector: "phoenix-phoenix-data-table-action", inputs: ["actionConfig", "rowData", "selectedData"], outputs: ["actionClick"] }, { kind: "ngmodule", type: TagModule }, { kind: "component", type: i7.Tag, selector: "p-tag", inputs: ["style", "styleClass", "severity", "value", "icon", "rounded"] }, { kind: "ngmodule", type: AvatarModule }, { kind: "component", type: i6.Avatar, selector: "p-avatar", inputs: ["label", "icon", "image", "size", "shape", "style", "styleClass", "ariaLabel", "ariaLabelledBy"], outputs: ["onImageError"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "pipe", type: TableCellPipe, name: "cell" }, { kind: "ngmodule", type: SkeletonModule }, { kind: "component", type: i9.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "style", "shape", "animation", "borderRadius", "size", "width", "height"] }] });
|
|
1637
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.3", type: TableComponent, isStandalone: true, selector: "phoenix-table", inputs: { data: "data", columns: "columns", tableConfiguration: "tableConfiguration" }, outputs: { actionClick: "actionClick", rowSelection: "rowSelection" }, ngImport: i0, template: "<div class=\"border-1 border-round-sm border-300 border-round-md m-2\">\n <table-caption\n [columns]=\"columns\"\n [tableConfiguration]=\"tableConfiguration\"\n [selectedItems]=\"selectedItems()\"\n (applyFiltersEvent)=\"applyFilters($event)\"\n (applyColumnsEvent)=\"applyColumns($event)\"\n (searchChange)=\"onSearch($event)\"\n (actionClick)=\"handleActionClick($event)\"\n >\n </table-caption>\n\n <p-table\n [columns]=\"selectedColumns()\"\n [value]=\"tableDataSignal()\"\n [size]=\"'small'\"\n scrollable=\"true\"\n [scrollHeight]=\"tableConfiguration.scrollHeight\"\n [virtualScroll]=\"true\"\n [virtualScrollItemSize]=\"50\"\n [rows]=\"100\"\n [lazy]=\"true\"\n [totalRecords]=\"totalRecords()\"\n (onLazyLoad)=\"loadLazyData($event)\"\n [selection]=\"selectedItems()\"\n (selectionChange)=\"onSelectionChange($event)\"\n [sortMode]=\"'multiple'\"\n [size]=\"'small'\"\n >\n <ng-template #header let-columns>\n <tr style=\"height: 40px\" class=\"dt-header\">\n <th class=\"custom-th\" style=\"width: 4rem\"><p-tableHeaderCheckbox /></th>\n <th\n class=\"custom-th font-bold\"\n *ngFor=\"let col of columns\"\n [pSortableColumn]=\"col.field\"\n >\n {{ col.header | translate }}\n <p-sortIcon [field]=\"col.field\"></p-sortIcon>\n </th>\n <!-- create empty th placeholders for actions -->\n <th class=\"custom-th\"></th>\n </tr>\n </ng-template>\n\n <ng-template #body let-rowData let-rowIndex=\"rowIndex\">\n <tr>\n <td>\n <p-tableCheckbox [value]=\"rowData\" />\n </td>\n <td\n *ngFor=\"let col of columns; let i = index\"\n (click)=\"\n i < 2 && tableConfiguration.hasCellClick\n ? onRowClick($event, rowData)\n : null\n \"\n [ngClass]=\"{\n 'text-blue-500 underline cursor-pointer':\n i < 2 && tableConfiguration.hasCellClick\n }\"\n >\n <ng-container [ngSwitch]=\"col.columnType\">\n <!-- TAG case -->\n <ng-container *ngSwitchCase=\"columnTypeEnum.TAG\">\n <ng-container *ngIf=\"rowData[col.field]; else emptyCell\">\n <p-tag\n styleClass=\"custom-tag\"\n [style]=\"{\n 'background-color': rowData[col.field + 'Color'] || '#ccc',\n \n }\"\n [value]=\"rowData[col.field]?.name || rowData[col.field]\"\n >\n </p-tag>\n </ng-container>\n </ng-container>\n\n <!-- PERSON case -->\n <ng-container *ngSwitchCase=\"columnTypeEnum.PERSON\">\n <ng-container *ngIf=\"rowData[col.field]; else emptyCell\">\n <p-avatar\n [label]=\"(rowData[col.field] | cell : col)?.avatar\"\n class=\"mr-1\"\n [style]=\"{ 'background-color': '#9c27b0', color: '#ffffff' }\"\n shape=\"circle\"\n >\n </p-avatar>\n {{ (rowData[col.field] | cell : col)?.name }}\n </ng-container>\n </ng-container>\n\n <!-- LIST case -->\n <ng-container *ngSwitchCase=\"columnTypeEnum.LIST\">\n <ng-container *ngIf=\"rowData[col.field]; else emptyCell\">\n <ul\n *ngFor=\"let item of rowData[col.field]\"\n [attr.data-cy]=\"\n 'table-cell-' + (columnTypeEnum.LIST | lowercase)\n \"\n >\n <li>{{ item.name }}</li>\n </ul>\n </ng-container>\n </ng-container>\n\n <!-- DEFAULT case -->\n <ng-container *ngSwitchDefault>\n <span\n [innerHTML]=\"rowData[col.field] | cell : col : dateFormat\"\n ></span>\n </ng-container>\n </ng-container>\n </td>\n\n <td class=\"p-0\">\n <ng-container *ngFor=\"let action of tableConfiguration.rowActions\">\n <phoenix-phoenix-data-table-action\n [actionConfig]=\"action\"\n [rowData]=\"rowData\"\n (actionClick)=\"handleActionClick({ $event, rowData })\"\n ></phoenix-phoenix-data-table-action\n ></ng-container>\n </td>\n </tr>\n </ng-template>\n\n <ng-template #emptyCell> -- </ng-template>\n\n <ng-template pTemplate=\"loadingbody\" let-columns>\n <tr style=\"height: 46px\">\n <td *ngFor=\"let col of columns; let even = even\">\n <tr>\n <td *ngFor=\"let col of columns; let even = even\">\n <p-skeleton\n [ngStyle]=\"{\n width: '60%',\n }\"\n ></p-skeleton>\n </td>\n\n <td>\n <p-skeleton\n [ngStyle]=\"{\n width: '20%',\n }\"\n ></p-skeleton>\n </td>\n </tr>\n </td>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"emptymessage\">\n <td class=\"p-2\" colspan=\"100\">\n <div class=\"flex align-items-center\">\n <i class=\"pi pi-info-circle mr-2\"></i>\n {{ \"NO_RESULTS_FOUND\" | translate }}\n </div>\n </td>\n </ng-template>\n </p-table>\n</div>\n", styles: [".custom-th{background-color:var(--surface-100)!important}.dt-header th:not(:last-child){border-right:1px solid #e4e4e4!important}:is() .p-avatar{border-radius:50%!important}::ng-deep .p-paginator button{scale:.7}::ng-deep .p-paginator-rpp-options{scale:.7}::ng-deep .p-datatable .p-datatable-header{border-radius:10px 10px 0 0}::ng-deep .p-tag{font-weight:400!important;font-size:.875rem!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i1$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i1$1.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "pipe", type: i1$1.LowerCasePipe, name: "lowercase" }, { kind: "ngmodule", type: TableModule }, { kind: "component", type: i2$3.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "virtualRowHeight", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i3$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i2$3.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2$3.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i2$3.TableCheckbox, selector: "p-tableCheckbox", inputs: ["disabled", "value", "index", "inputId", "name", "required", "ariaLabel"] }, { kind: "component", type: i2$3.TableHeaderCheckbox, selector: "p-tableHeaderCheckbox", inputs: ["disabled", "inputId", "name", "ariaLabel"] }, { kind: "component", type: TableCaptionComponent, selector: "table-caption", inputs: ["tableConfiguration", "columns", "searchQuery", "selectedItems"], outputs: ["applyFiltersEvent", "applyColumnsEvent", "searchChange", "actionClick"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3$1.TranslatePipe, name: "translate" }, { kind: "component", type: PhoenixDataTableActionComponent, selector: "phoenix-phoenix-data-table-action", inputs: ["actionConfig", "rowData", "selectedData"], outputs: ["actionClick"] }, { kind: "ngmodule", type: TagModule }, { kind: "component", type: i7.Tag, selector: "p-tag", inputs: ["style", "styleClass", "severity", "value", "icon", "rounded"] }, { kind: "ngmodule", type: AvatarModule }, { kind: "component", type: i6.Avatar, selector: "p-avatar", inputs: ["label", "icon", "image", "size", "shape", "style", "styleClass", "ariaLabel", "ariaLabelledBy"], outputs: ["onImageError"] }, { kind: "ngmodule", type: TooltipModule }, { kind: "pipe", type: TableCellPipe, name: "cell" }, { kind: "ngmodule", type: SkeletonModule }, { kind: "component", type: i9.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "style", "shape", "animation", "borderRadius", "size", "width", "height"] }] });
|
|
1638
1638
|
}
|
|
1639
1639
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: TableComponent, decorators: [{
|
|
1640
1640
|
type: Component,
|
|
@@ -1649,7 +1649,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
|
|
|
1649
1649
|
TooltipModule,
|
|
1650
1650
|
TableCellPipe,
|
|
1651
1651
|
SkeletonModule
|
|
1652
|
-
], template: "<div class=\"border-1 border-round-sm border-300 border-round-md m-2\">\n <table-caption\n [columns]=\"columns\"\n [tableConfiguration]=\"tableConfiguration\"\n [selectedItems]=\"selectedItems()\"\n (applyFiltersEvent)=\"applyFilters($event)\"\n (applyColumnsEvent)=\"applyColumns($event)\"\n (searchChange)=\"onSearch($event)\"\n (actionClick)=\"handleActionClick($event)\"\n >\n </table-caption>\n\n <p-table\n [columns]=\"selectedColumns()\"\n [value]=\"tableDataSignal()\"\n [size]=\"'small'\"\n scrollable=\"true\"\n scrollHeight=\"
|
|
1652
|
+
], template: "<div class=\"border-1 border-round-sm border-300 border-round-md m-2\">\n <table-caption\n [columns]=\"columns\"\n [tableConfiguration]=\"tableConfiguration\"\n [selectedItems]=\"selectedItems()\"\n (applyFiltersEvent)=\"applyFilters($event)\"\n (applyColumnsEvent)=\"applyColumns($event)\"\n (searchChange)=\"onSearch($event)\"\n (actionClick)=\"handleActionClick($event)\"\n >\n </table-caption>\n\n <p-table\n [columns]=\"selectedColumns()\"\n [value]=\"tableDataSignal()\"\n [size]=\"'small'\"\n scrollable=\"true\"\n [scrollHeight]=\"tableConfiguration.scrollHeight\"\n [virtualScroll]=\"true\"\n [virtualScrollItemSize]=\"50\"\n [rows]=\"100\"\n [lazy]=\"true\"\n [totalRecords]=\"totalRecords()\"\n (onLazyLoad)=\"loadLazyData($event)\"\n [selection]=\"selectedItems()\"\n (selectionChange)=\"onSelectionChange($event)\"\n [sortMode]=\"'multiple'\"\n [size]=\"'small'\"\n >\n <ng-template #header let-columns>\n <tr style=\"height: 40px\" class=\"dt-header\">\n <th class=\"custom-th\" style=\"width: 4rem\"><p-tableHeaderCheckbox /></th>\n <th\n class=\"custom-th font-bold\"\n *ngFor=\"let col of columns\"\n [pSortableColumn]=\"col.field\"\n >\n {{ col.header | translate }}\n <p-sortIcon [field]=\"col.field\"></p-sortIcon>\n </th>\n <!-- create empty th placeholders for actions -->\n <th class=\"custom-th\"></th>\n </tr>\n </ng-template>\n\n <ng-template #body let-rowData let-rowIndex=\"rowIndex\">\n <tr>\n <td>\n <p-tableCheckbox [value]=\"rowData\" />\n </td>\n <td\n *ngFor=\"let col of columns; let i = index\"\n (click)=\"\n i < 2 && tableConfiguration.hasCellClick\n ? onRowClick($event, rowData)\n : null\n \"\n [ngClass]=\"{\n 'text-blue-500 underline cursor-pointer':\n i < 2 && tableConfiguration.hasCellClick\n }\"\n >\n <ng-container [ngSwitch]=\"col.columnType\">\n <!-- TAG case -->\n <ng-container *ngSwitchCase=\"columnTypeEnum.TAG\">\n <ng-container *ngIf=\"rowData[col.field]; else emptyCell\">\n <p-tag\n styleClass=\"custom-tag\"\n [style]=\"{\n 'background-color': rowData[col.field + 'Color'] || '#ccc',\n \n }\"\n [value]=\"rowData[col.field]?.name || rowData[col.field]\"\n >\n </p-tag>\n </ng-container>\n </ng-container>\n\n <!-- PERSON case -->\n <ng-container *ngSwitchCase=\"columnTypeEnum.PERSON\">\n <ng-container *ngIf=\"rowData[col.field]; else emptyCell\">\n <p-avatar\n [label]=\"(rowData[col.field] | cell : col)?.avatar\"\n class=\"mr-1\"\n [style]=\"{ 'background-color': '#9c27b0', color: '#ffffff' }\"\n shape=\"circle\"\n >\n </p-avatar>\n {{ (rowData[col.field] | cell : col)?.name }}\n </ng-container>\n </ng-container>\n\n <!-- LIST case -->\n <ng-container *ngSwitchCase=\"columnTypeEnum.LIST\">\n <ng-container *ngIf=\"rowData[col.field]; else emptyCell\">\n <ul\n *ngFor=\"let item of rowData[col.field]\"\n [attr.data-cy]=\"\n 'table-cell-' + (columnTypeEnum.LIST | lowercase)\n \"\n >\n <li>{{ item.name }}</li>\n </ul>\n </ng-container>\n </ng-container>\n\n <!-- DEFAULT case -->\n <ng-container *ngSwitchDefault>\n <span\n [innerHTML]=\"rowData[col.field] | cell : col : dateFormat\"\n ></span>\n </ng-container>\n </ng-container>\n </td>\n\n <td class=\"p-0\">\n <ng-container *ngFor=\"let action of tableConfiguration.rowActions\">\n <phoenix-phoenix-data-table-action\n [actionConfig]=\"action\"\n [rowData]=\"rowData\"\n (actionClick)=\"handleActionClick({ $event, rowData })\"\n ></phoenix-phoenix-data-table-action\n ></ng-container>\n </td>\n </tr>\n </ng-template>\n\n <ng-template #emptyCell> -- </ng-template>\n\n <ng-template pTemplate=\"loadingbody\" let-columns>\n <tr style=\"height: 46px\">\n <td *ngFor=\"let col of columns; let even = even\">\n <tr>\n <td *ngFor=\"let col of columns; let even = even\">\n <p-skeleton\n [ngStyle]=\"{\n width: '60%',\n }\"\n ></p-skeleton>\n </td>\n\n <td>\n <p-skeleton\n [ngStyle]=\"{\n width: '20%',\n }\"\n ></p-skeleton>\n </td>\n </tr>\n </td>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"emptymessage\">\n <td class=\"p-2\" colspan=\"100\">\n <div class=\"flex align-items-center\">\n <i class=\"pi pi-info-circle mr-2\"></i>\n {{ \"NO_RESULTS_FOUND\" | translate }}\n </div>\n </td>\n </ng-template>\n </p-table>\n</div>\n", styles: [".custom-th{background-color:var(--surface-100)!important}.dt-header th:not(:last-child){border-right:1px solid #e4e4e4!important}:is() .p-avatar{border-radius:50%!important}::ng-deep .p-paginator button{scale:.7}::ng-deep .p-paginator-rpp-options{scale:.7}::ng-deep .p-datatable .p-datatable-header{border-radius:10px 10px 0 0}::ng-deep .p-tag{font-weight:400!important;font-size:.875rem!important}\n"] }]
|
|
1653
1653
|
}], ctorParameters: () => [], propDecorators: { data: [{
|
|
1654
1654
|
type: Input
|
|
1655
1655
|
}], columns: [{
|
|
@@ -4648,19 +4648,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
|
|
|
4648
4648
|
}] } });
|
|
4649
4649
|
|
|
4650
4650
|
class GroupsFormComponent extends MetaFormAbstract {
|
|
4651
|
+
activePanelsIndex = [0, 1, 2, 3];
|
|
4651
4652
|
ControlType = ControlType;
|
|
4652
4653
|
optionLabel;
|
|
4653
4654
|
notiffication;
|
|
4654
4655
|
trans = inject(TranslateService);
|
|
4655
|
-
ngOnInit() {
|
|
4656
|
-
this.notiffication = [
|
|
4657
|
-
{
|
|
4658
|
-
severity: 'info',
|
|
4659
|
-
summary: this.trans.instant('MESSAGE.NOTE'),
|
|
4660
|
-
detail: this.trans.instant('MESSAGE.THREAT_ASSESSMENT'),
|
|
4661
|
-
},
|
|
4662
|
-
];
|
|
4663
|
-
}
|
|
4664
4656
|
ngOnChanges(simpleChanges) {
|
|
4665
4657
|
if (simpleChanges?.['metaFormControls'] ||
|
|
4666
4658
|
simpleChanges?.['metaFormValues'] ||
|
|
@@ -4671,11 +4663,11 @@ class GroupsFormComponent extends MetaFormAbstract {
|
|
|
4671
4663
|
}
|
|
4672
4664
|
}
|
|
4673
4665
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: GroupsFormComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
4674
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.3", type: GroupsFormComponent, isStandalone: true, selector: "phoenix-groups-form", usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<form *ngIf=\"metaFormControls\" [formGroup]=\"metaForm\" (ngSubmit)=\"onSubmit()\">\n <div class=\"grid grid-nogutter\">\n <div\n *ngFor=\"let group of metaFormControls\"\n [style]=\"{ order: group.order }\"\n class=\"w-full\"\n >\n <p-messages\n *ngIf=\"group.key === 'RISK_ANALASYS_ASSESSMENT_ATH_ASSESSMENT'\"\n [(value)]=\"notiffication\"\n [enableService]=\"false\"\n ></p-messages>\n <p-panel\n styleClass=\"mb-3 border\"\n [header]=\"group.groupName\"\n [toggleable]=\"true\"\n [iconPos]=\"'start'\"\n [collapsed]=\"group?.collapsed\"\n >\n <div class=\"grid mt-2 align-items-end\">\n <ng-container *ngFor=\"let control of group.ctrl\">\n <ng-container [ngSwitch]=\"control.configuration.type\">\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.TEXT\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-text-input\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n >\n </phoenix-meta-text-input>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.NUMBER\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-number-input\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n >\n </phoenix-meta-number-input>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.TIMEPERIOD\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-timeperiod\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n >\n </phoenix-meta-timeperiod>\n </ng-template>\n </div>\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.CURRENCY\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-currency\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n >\n </phoenix-meta-currency>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.TEXT_AREA\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-text-area\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-text-area>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.SS_OPTION\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-single-select\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-single-select>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.SS_OPTION_OBJECT_BASED\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <!-- edit field & redonly field content -->\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n *ngIf=\"!control?.hidden\"\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-single-select-object-based\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-single-select-object-based>\n </ng-template>\n <!-- edit field & redonly field content end -->\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.MS_OPTION\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <phoenix-meta-multiple-select\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-multiple-select>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.START_DUE_DATE\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-start-due-date\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n >\n </phoenix-meta-start-due-date>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.DATE\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-calendar\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-calendar>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.TEXT_EDITOR\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-text-editor\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-text-editor>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.CHECKBOX\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <phoenix-meta-checkbox\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-checkbox>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.SWITCH\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-switch\n [disable]=\"true\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-switch>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.ASSIGN\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-assign-responsible\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n >\n </phoenix-meta-assign-responsible>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.LINKS_DATA\"\n [ngClass]=\"control | fieldCol\"\n class=\"flex flex-column\"\n >\n <!-- <phoenix-meta-object-links\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-object-links> -->\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.PASSWORD\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <phoenix-meta-password-feild\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-password-feild>\n </div>\n </ng-container>\n </ng-container>\n </div>\n </p-panel>\n </div>\n </div>\n</form>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "ngmodule", type:
|
|
4666
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.3", type: GroupsFormComponent, isStandalone: true, selector: "phoenix-groups-form", inputs: { activePanelsIndex: "activePanelsIndex" }, usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<p-accordion [multiple]=\"true\" [(value)]=\"activePanelsIndex\">\n <form *ngIf=\"metaFormControls\" [formGroup]=\"metaForm\" (ngSubmit)=\"onSubmit()\">\n @for ( group of metaFormControls; track group.groupName; let idx = $index){\n <div [style]=\"{ order: group.order }\" class=\"w-full\">\n <p-accordion-panel [value]=\"idx\">\n <p-accordion-header>\n <ng-template #toggleicon let-active=\"active\">\n @if (active) {\n <i class=\"pi pi-minus-circle\"></i>\n } @else {\n <i class=\"pi pi-plus-circle\"></i>\n\n }\n </ng-template>\n {{ group.groupName }}\n </p-accordion-header>\n <p-accordion-content>\n <div class=\"grid align-items-end\">\n <ng-container *ngFor=\"let control of group.ctrl\">\n <ng-container [ngSwitch]=\"control.configuration.type\">\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.TEXT\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-text-input\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n >\n </phoenix-meta-text-input>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.NUMBER\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-number-input\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n >\n </phoenix-meta-number-input>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.TIMEPERIOD\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-timeperiod\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n >\n </phoenix-meta-timeperiod>\n </ng-template>\n </div>\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.CURRENCY\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-currency\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n >\n </phoenix-meta-currency>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.TEXT_AREA\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-text-area\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-text-area>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.SS_OPTION\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-single-select\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-single-select>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.SS_OPTION_OBJECT_BASED\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <!-- edit field & redonly field content -->\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n *ngIf=\"!control?.hidden\"\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-single-select-object-based\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-single-select-object-based>\n </ng-template>\n <!-- edit field & redonly field content end -->\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.MS_OPTION\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <phoenix-meta-multiple-select\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-multiple-select>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.START_DUE_DATE\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-start-due-date\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n >\n </phoenix-meta-start-due-date>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.DATE\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-calendar\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-calendar>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.TEXT_EDITOR\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-text-editor\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-text-editor>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.CHECKBOX\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <phoenix-meta-checkbox\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-checkbox>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.SWITCH\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-switch\n [disable]=\"true\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-switch>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.ASSIGN\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-assign-responsible\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n >\n </phoenix-meta-assign-responsible>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.LINKS_DATA\"\n [ngClass]=\"control | fieldCol\"\n class=\"flex flex-column\"\n >\n <!-- <phoenix-meta-object-links\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-object-links> -->\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.PASSWORD\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <phoenix-meta-password-feild\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-password-feild>\n </div>\n </ng-container>\n </ng-container>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n </div>\n }\n </form>\n</p-accordion>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: InputTextModule }, { kind: "ngmodule", type:
|
|
4675
4667
|
// InputTextareaModule,
|
|
4676
|
-
CalendarModule }, { kind: "ngmodule", type: DropdownModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "ngmodule", type: MultiSelectModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "ngmodule", type: CheckboxModule }, { kind: "ngmodule", type: EditorModule }, { kind: "pipe", type: FieldColPipe, name: "fieldCol" }, { kind: "component", type: MetaTextEditorComponent, selector: "phoenix-meta-text-editor" }, { kind: "component", type: MetaCheckboxComponent, selector: "phoenix-meta-checkbox" }, { kind: "component", type: MetaTextInputComponent, selector: "phoenix-meta-text-input" }, { kind: "component", type: MetaSingleSelectComponent, selector: "phoenix-meta-single-select" }, { kind: "component", type: MetaStartDueDateComponent, selector: "phoenix-meta-start-due-date", inputs: ["control", "parentForm"] }, { kind: "component", type: MetaTextAreaComponent, selector: "phoenix-meta-text-area" }, { kind: "component", type: MetaMultipleSelectComponent, selector: "phoenix-meta-multiple-select" }, { kind: "component", type: MetaCalendarComponent, selector: "phoenix-meta-calendar" }, { kind: "component", type:
|
|
4668
|
+
CalendarModule }, { kind: "ngmodule", type: DropdownModule }, { kind: "ngmodule", type: ButtonModule }, { kind: "ngmodule", type: MultiSelectModule }, { kind: "ngmodule", type: TranslateModule }, { kind: "ngmodule", type: CheckboxModule }, { kind: "ngmodule", type: EditorModule }, { kind: "pipe", type: FieldColPipe, name: "fieldCol" }, { kind: "component", type: MetaTextEditorComponent, selector: "phoenix-meta-text-editor" }, { kind: "component", type: MetaCheckboxComponent, selector: "phoenix-meta-checkbox" }, { kind: "component", type: MetaTextInputComponent, selector: "phoenix-meta-text-input" }, { kind: "component", type: MetaSingleSelectComponent, selector: "phoenix-meta-single-select" }, { kind: "component", type: MetaStartDueDateComponent, selector: "phoenix-meta-start-due-date", inputs: ["control", "parentForm"] }, { kind: "component", type: MetaTextAreaComponent, selector: "phoenix-meta-text-area" }, { kind: "component", type: MetaMultipleSelectComponent, selector: "phoenix-meta-multiple-select" }, { kind: "component", type: MetaCalendarComponent, selector: "phoenix-meta-calendar" }, { kind: "ngmodule", type: AccordionModule }, { kind: "component", type: i3$a.Accordion, selector: "p-accordion", inputs: ["value", "multiple", "style", "styleClass", "expandIcon", "collapseIcon", "selectOnFocus", "transitionOptions", "activeIndex", "headerAriaLevel"], outputs: ["valueChange", "activeIndexChange", "onClose", "onOpen"] }, { kind: "component", type: i3$a.AccordionPanel, selector: "p-accordion-panel, p-accordionpanel", inputs: ["value", "disabled"], outputs: ["valueChange"] }, { kind: "component", type: i3$a.AccordionHeader, selector: "p-accordion-header, p-accordionheader" }, { kind: "component", type: i3$a.AccordionContent, selector: "p-accordion-content, p-accordioncontent" }, { kind: "component", type:
|
|
4677
4669
|
// MetaObjectLinksComponent,
|
|
4678
|
-
MetaSwitchComponent, selector: "phoenix-meta-switch" }, { kind: "component", type: MetaPasswordFeildComponent, selector: "phoenix-meta-password-feild" }, { kind: "component", type: MetaTimeperiodComponent, selector: "phoenix-meta-timeperiod", inputs: ["control", "parentForm"] }, { kind: "component", type: MetaCurrencyComponent, selector: "phoenix-meta-currency" }, { kind: "component", type: MetaNumberComponent, selector: "phoenix-meta-number-input" }, { kind: "component", type: MetaAssignResponsibleComponent, selector: "phoenix-meta-assign-responsible", inputs: ["control", "parentForm", "disable"] }, { kind: "ngmodule", type: PanelModule }, { kind: "component", type:
|
|
4670
|
+
MetaSwitchComponent, selector: "phoenix-meta-switch" }, { kind: "component", type: MetaPasswordFeildComponent, selector: "phoenix-meta-password-feild" }, { kind: "component", type: MetaTimeperiodComponent, selector: "phoenix-meta-timeperiod", inputs: ["control", "parentForm"] }, { kind: "component", type: MetaCurrencyComponent, selector: "phoenix-meta-currency" }, { kind: "component", type: MetaNumberComponent, selector: "phoenix-meta-number-input" }, { kind: "component", type: MetaAssignResponsibleComponent, selector: "phoenix-meta-assign-responsible", inputs: ["control", "parentForm", "disable"] }, { kind: "ngmodule", type: PanelModule }, { kind: "component", type: ReadOnlyInputComponent, selector: "phoenix-read-only-input", inputs: ["control", "metaform"] }, { kind: "ngmodule", type: MessagesModule }, { kind: "component", type: MetaSingleSelectObjectBasedComponent, selector: "phoenix-meta-single-select-object-based" }] });
|
|
4679
4671
|
}
|
|
4680
4672
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: GroupsFormComponent, decorators: [{
|
|
4681
4673
|
type: Component,
|
|
@@ -4702,6 +4694,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
|
|
|
4702
4694
|
MetaTextEditorComponent,
|
|
4703
4695
|
MetaMultipleSelectComponent,
|
|
4704
4696
|
MetaCalendarComponent,
|
|
4697
|
+
AccordionModule,
|
|
4705
4698
|
// MetaObjectLinksComponent,
|
|
4706
4699
|
MetaSwitchComponent,
|
|
4707
4700
|
MetaPasswordFeildComponent,
|
|
@@ -4713,8 +4706,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
|
|
|
4713
4706
|
ReadOnlyInputComponent,
|
|
4714
4707
|
MessagesModule,
|
|
4715
4708
|
MetaSingleSelectObjectBasedComponent,
|
|
4716
|
-
], template: "<form *ngIf=\"metaFormControls\" [formGroup]=\"metaForm\" (ngSubmit)=\"onSubmit()\">\n <div class=\"grid grid-nogutter\">\n <div\n *ngFor=\"let group of metaFormControls\"\n [style]=\"{ order: group.order }\"\n class=\"w-full\"\n >\n <p-messages\n *ngIf=\"group.key === 'RISK_ANALASYS_ASSESSMENT_ATH_ASSESSMENT'\"\n [(value)]=\"notiffication\"\n [enableService]=\"false\"\n ></p-messages>\n <p-panel\n styleClass=\"mb-3 border\"\n [header]=\"group.groupName\"\n [toggleable]=\"true\"\n [iconPos]=\"'start'\"\n [collapsed]=\"group?.collapsed\"\n >\n <div class=\"grid mt-2 align-items-end\">\n <ng-container *ngFor=\"let control of group.ctrl\">\n <ng-container [ngSwitch]=\"control.configuration.type\">\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.TEXT\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-text-input\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n >\n </phoenix-meta-text-input>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.NUMBER\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-number-input\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n >\n </phoenix-meta-number-input>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.TIMEPERIOD\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-timeperiod\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n >\n </phoenix-meta-timeperiod>\n </ng-template>\n </div>\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.CURRENCY\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-currency\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n >\n </phoenix-meta-currency>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.TEXT_AREA\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-text-area\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-text-area>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.SS_OPTION\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-single-select\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-single-select>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.SS_OPTION_OBJECT_BASED\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <!-- edit field & redonly field content -->\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n *ngIf=\"!control?.hidden\"\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-single-select-object-based\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-single-select-object-based>\n </ng-template>\n <!-- edit field & redonly field content end -->\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.MS_OPTION\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <phoenix-meta-multiple-select\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-multiple-select>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.START_DUE_DATE\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-start-due-date\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n >\n </phoenix-meta-start-due-date>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.DATE\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-calendar\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-calendar>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.TEXT_EDITOR\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-text-editor\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-text-editor>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.CHECKBOX\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <phoenix-meta-checkbox\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-checkbox>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.SWITCH\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-switch\n [disable]=\"true\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-switch>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.ASSIGN\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-assign-responsible\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n >\n </phoenix-meta-assign-responsible>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.LINKS_DATA\"\n [ngClass]=\"control | fieldCol\"\n class=\"flex flex-column\"\n >\n <!-- <phoenix-meta-object-links\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-object-links> -->\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.PASSWORD\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <phoenix-meta-password-feild\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-password-feild>\n </div>\n </ng-container>\n </ng-container>\n </div>\n </p-panel>\n </div>\n </div>\n</form>\n" }]
|
|
4717
|
-
}]
|
|
4709
|
+
], template: "<p-accordion [multiple]=\"true\" [(value)]=\"activePanelsIndex\">\n <form *ngIf=\"metaFormControls\" [formGroup]=\"metaForm\" (ngSubmit)=\"onSubmit()\">\n @for ( group of metaFormControls; track group.groupName; let idx = $index){\n <div [style]=\"{ order: group.order }\" class=\"w-full\">\n <p-accordion-panel [value]=\"idx\">\n <p-accordion-header>\n <ng-template #toggleicon let-active=\"active\">\n @if (active) {\n <i class=\"pi pi-minus-circle\"></i>\n } @else {\n <i class=\"pi pi-plus-circle\"></i>\n\n }\n </ng-template>\n {{ group.groupName }}\n </p-accordion-header>\n <p-accordion-content>\n <div class=\"grid align-items-end\">\n <ng-container *ngFor=\"let control of group.ctrl\">\n <ng-container [ngSwitch]=\"control.configuration.type\">\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.TEXT\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-text-input\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n >\n </phoenix-meta-text-input>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.NUMBER\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-number-input\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n >\n </phoenix-meta-number-input>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.TIMEPERIOD\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-timeperiod\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n >\n </phoenix-meta-timeperiod>\n </ng-template>\n </div>\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.CURRENCY\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-currency\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n >\n </phoenix-meta-currency>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.TEXT_AREA\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-text-area\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-text-area>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.SS_OPTION\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-single-select\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-single-select>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.SS_OPTION_OBJECT_BASED\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <!-- edit field & redonly field content -->\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n *ngIf=\"!control?.hidden\"\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-single-select-object-based\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-single-select-object-based>\n </ng-template>\n <!-- edit field & redonly field content end -->\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.MS_OPTION\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <phoenix-meta-multiple-select\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-multiple-select>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.START_DUE_DATE\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-start-due-date\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n >\n </phoenix-meta-start-due-date>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.DATE\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-calendar\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-calendar>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.TEXT_EDITOR\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-text-editor\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-text-editor>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.CHECKBOX\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <phoenix-meta-checkbox\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-checkbox>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.SWITCH\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-switch\n [disable]=\"true\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-switch>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.ASSIGN\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <ng-container *ngIf=\"control.readOnly; else readOnly\">\n <phoenix-read-only-input\n [control]=\"control\"\n [metaform]=\"metaForm\"\n ></phoenix-read-only-input>\n </ng-container>\n <ng-template #readOnly>\n <phoenix-meta-assign-responsible\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n >\n </phoenix-meta-assign-responsible>\n </ng-template>\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.LINKS_DATA\"\n [ngClass]=\"control | fieldCol\"\n class=\"flex flex-column\"\n >\n <!-- <phoenix-meta-object-links\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-object-links> -->\n </div>\n\n <div\n [style]=\"{ order: control.order }\"\n *ngSwitchCase=\"ControlType.PASSWORD\"\n [ngClass]=\"control?.hidden ? 'p-0' : (control | fieldCol)\"\n class=\"flex flex-column\"\n >\n <phoenix-meta-password-feild\n [disable]=\"disableForm\"\n [formControlName]=\"control.configuration.key\"\n [control]=\"control\"\n [parentForm]=\"metaForm\"\n ></phoenix-meta-password-feild>\n </div>\n </ng-container>\n </ng-container>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n </div>\n }\n </form>\n</p-accordion>\n" }]
|
|
4710
|
+
}], propDecorators: { activePanelsIndex: [{
|
|
4711
|
+
type: Input
|
|
4712
|
+
}] } });
|
|
4718
4713
|
|
|
4719
4714
|
/*
|
|
4720
4715
|
* Public API Surface of phoenix
|