@posiwise/admin-module 0.0.197 → 0.0.198
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.
|
@@ -439,11 +439,11 @@ class CredentialsComponent extends AppBaseComponent {
|
|
|
439
439
|
super.ngOnDestroy();
|
|
440
440
|
}
|
|
441
441
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: CredentialsComponent, deps: [{ token: i1.AdminService }, { token: i0.Injector }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
442
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: CredentialsComponent, isStandalone: false, selector: "pw-credentials", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12 d-flex justify-content-between align-items-center\">\n <h2 class=\"card-title p-0 float-start\">Credentials</h2>\n <button class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"create-role\"\n [routerLink]=\"[routers.adminCredentialsDetails + 'add']\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Add Credential\n </button>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container mt table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.credentials\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <label for=\"credentials-search\" class=\"visually-hidden\">Search Credentials</label>\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n id=\"credentials-search\"\n name=\"credentials-search\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search Credentials...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"name\">\n {{ 'Label.Name' | transloco }}\n <p-sortIcon field=\"name\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"field\">\n {{ 'Admin.Credentials.Field' | transloco }}\n <p-sortIcon field=\"field\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"is_required\">\n {{ 'Admin.Credentials.Required' | transloco }}\n <p-sortIcon field=\"is_required\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"active\">\n {{ 'Label.IsActive' | transloco }}\n <p-sortIcon field=\"active\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"is_visible\">\n {{ 'Label.IsVisible' | transloco }}\n <p-sortIcon field=\"is_visible\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n class=\"actions-list-two\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-credential>\n <tr>\n <td data-head=\"Name\">{{ credential.name }}</td>\n <td data-head=\"Field\">\n <ng-template [ngIf]=\"credential?.description\"\n [ngIfElse]=\"noDescription\">\n <span class=\"info-circle\">{{ credential.field\n }}<span class=\"tooltiptext gradient-custom-branding\">{{\n credential.description\n }}</span></span>\n </ng-template>\n <ng-template #noDescription>\n {{ credential.field }}\n </ng-template>\n </td>\n <td data-head=\"Required\">\n <span [appDynamicBadge]=\"{\n itemsArray: [true, false],\n item: credential?.is_required\n }\"\n color=\"success-danger\"\n class=\"badge\">\n {{ !!credential?.is_required }}\n </span>\n </td>\n <td data-head=\"Is Active\">\n <span [appDynamicBadge]=\"{ itemsArray: [true, false], item: credential?.active }\"\n color=\"success-danger\"\n class=\"badge\">{{ credential?.active ? 'Yes' : 'No' }}</span>\n </td>\n <td data-head=\"Is Visible\">\n <span [appDynamicBadge]=\"{\n itemsArray: [true, false],\n item: credential?.is_visible\n }\"\n color=\"success-danger\"\n class=\"badge\">{{ credential?.is_visible ? 'Yes' : 'No' }}</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[routers.adminCredentialsDetails + credential.id]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n (click)=\"onDelete(credential)\"\n (keydown.enter)=\"onDelete(credential)\"\n (keydown.space)=\"onDelete(credential)\"\n class=\"fa fa-trash delete-icon\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n<div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n</div>\n <span *ngIf=\"data.object_count !== 0\" class=\"total-records-count\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Credentials.NoDataMessage' | transloco\"> </pw-no-data>\n</div>\n", dependencies: [{ kind: "component", type: i2.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.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["variant", "fluid", "pSize"] }, { kind: "directive", type: i2$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i10.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color", "colorByName", "dataName"] }, { kind: "directive", type: i11.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
|
|
442
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: CredentialsComponent, isStandalone: false, selector: "pw-credentials", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12 d-flex justify-content-between align-items-center\">\n <h2 class=\"card-title p-0 float-start\">Credentials</h2>\n <button class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"create-role\"\n [routerLink]=\"[routers.adminCredentialsDetails + 'add']\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Add Credential\n </button>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container mt table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.credentials\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <label for=\"credentials-search\" class=\"visually-hidden\">Search Credentials</label>\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n id=\"credentials-search\"\n name=\"credentials-search\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n autocomplete=\"off\"\n placeholder=\"Search Credentials...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"name\">\n {{ 'Label.Name' | transloco }}\n <p-sortIcon field=\"name\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"field\">\n {{ 'Admin.Credentials.Field' | transloco }}\n <p-sortIcon field=\"field\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"is_required\">\n {{ 'Admin.Credentials.Required' | transloco }}\n <p-sortIcon field=\"is_required\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"active\">\n {{ 'Label.IsActive' | transloco }}\n <p-sortIcon field=\"active\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"is_visible\">\n {{ 'Label.IsVisible' | transloco }}\n <p-sortIcon field=\"is_visible\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n class=\"actions-list-two\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-credential>\n <tr>\n <td data-head=\"Name\">{{ credential.name }}</td>\n <td data-head=\"Field\">\n <ng-template [ngIf]=\"credential?.description\"\n [ngIfElse]=\"noDescription\">\n <span class=\"info-circle\">{{ credential.field\n }}<span class=\"tooltiptext gradient-custom-branding\">{{\n credential.description\n }}</span></span>\n </ng-template>\n <ng-template #noDescription>\n {{ credential.field }}\n </ng-template>\n </td>\n <td data-head=\"Required\">\n <span [appDynamicBadge]=\"{\n itemsArray: [true, false],\n item: credential?.is_required\n }\"\n color=\"success-danger\"\n class=\"badge\">\n {{ !!credential?.is_required }}\n </span>\n </td>\n <td data-head=\"Is Active\">\n <span [appDynamicBadge]=\"{ itemsArray: [true, false], item: credential?.active }\"\n color=\"success-danger\"\n class=\"badge\">{{ credential?.active ? 'Yes' : 'No' }}</span>\n </td>\n <td data-head=\"Is Visible\">\n <span [appDynamicBadge]=\"{\n itemsArray: [true, false],\n item: credential?.is_visible\n }\"\n color=\"success-danger\"\n class=\"badge\">{{ credential?.is_visible ? 'Yes' : 'No' }}</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[routers.adminCredentialsDetails + credential.id]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n (click)=\"onDelete(credential)\"\n (keydown.enter)=\"onDelete(credential)\"\n (keydown.space)=\"onDelete(credential)\"\n class=\"fa fa-trash delete-icon\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n<div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n</div>\n <span *ngIf=\"data.object_count !== 0\" class=\"total-records-count\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Credentials.NoDataMessage' | transloco\"> </pw-no-data>\n</div>\n", dependencies: [{ kind: "component", type: i2.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.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["variant", "fluid", "pSize"] }, { kind: "directive", type: i2$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i10.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color", "colorByName", "dataName"] }, { kind: "directive", type: i11.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
|
|
443
443
|
}
|
|
444
444
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: CredentialsComponent, decorators: [{
|
|
445
445
|
type: Component,
|
|
446
|
-
args: [{ selector: 'pw-credentials', standalone: false, template: "<div class=\"row\">\n <div class=\"col-12 d-flex justify-content-between align-items-center\">\n <h2 class=\"card-title p-0 float-start\">Credentials</h2>\n <button class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"create-role\"\n [routerLink]=\"[routers.adminCredentialsDetails + 'add']\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Add Credential\n </button>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container mt table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.credentials\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <label for=\"credentials-search\" class=\"visually-hidden\">Search Credentials</label>\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n id=\"credentials-search\"\n name=\"credentials-search\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search Credentials...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"name\">\n {{ 'Label.Name' | transloco }}\n <p-sortIcon field=\"name\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"field\">\n {{ 'Admin.Credentials.Field' | transloco }}\n <p-sortIcon field=\"field\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"is_required\">\n {{ 'Admin.Credentials.Required' | transloco }}\n <p-sortIcon field=\"is_required\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"active\">\n {{ 'Label.IsActive' | transloco }}\n <p-sortIcon field=\"active\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"is_visible\">\n {{ 'Label.IsVisible' | transloco }}\n <p-sortIcon field=\"is_visible\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n class=\"actions-list-two\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-credential>\n <tr>\n <td data-head=\"Name\">{{ credential.name }}</td>\n <td data-head=\"Field\">\n <ng-template [ngIf]=\"credential?.description\"\n [ngIfElse]=\"noDescription\">\n <span class=\"info-circle\">{{ credential.field\n }}<span class=\"tooltiptext gradient-custom-branding\">{{\n credential.description\n }}</span></span>\n </ng-template>\n <ng-template #noDescription>\n {{ credential.field }}\n </ng-template>\n </td>\n <td data-head=\"Required\">\n <span [appDynamicBadge]=\"{\n itemsArray: [true, false],\n item: credential?.is_required\n }\"\n color=\"success-danger\"\n class=\"badge\">\n {{ !!credential?.is_required }}\n </span>\n </td>\n <td data-head=\"Is Active\">\n <span [appDynamicBadge]=\"{ itemsArray: [true, false], item: credential?.active }\"\n color=\"success-danger\"\n class=\"badge\">{{ credential?.active ? 'Yes' : 'No' }}</span>\n </td>\n <td data-head=\"Is Visible\">\n <span [appDynamicBadge]=\"{\n itemsArray: [true, false],\n item: credential?.is_visible\n }\"\n color=\"success-danger\"\n class=\"badge\">{{ credential?.is_visible ? 'Yes' : 'No' }}</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[routers.adminCredentialsDetails + credential.id]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n (click)=\"onDelete(credential)\"\n (keydown.enter)=\"onDelete(credential)\"\n (keydown.space)=\"onDelete(credential)\"\n class=\"fa fa-trash delete-icon\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n<div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n</div>\n <span *ngIf=\"data.object_count !== 0\" class=\"total-records-count\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Credentials.NoDataMessage' | transloco\"> </pw-no-data>\n</div>\n" }]
|
|
446
|
+
args: [{ selector: 'pw-credentials', standalone: false, template: "<div class=\"row\">\n <div class=\"col-12 d-flex justify-content-between align-items-center\">\n <h2 class=\"card-title p-0 float-start\">Credentials</h2>\n <button class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"create-role\"\n [routerLink]=\"[routers.adminCredentialsDetails + 'add']\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Add Credential\n </button>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container mt table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.credentials\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <label for=\"credentials-search\" class=\"visually-hidden\">Search Credentials</label>\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n id=\"credentials-search\"\n name=\"credentials-search\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n autocomplete=\"off\"\n placeholder=\"Search Credentials...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"name\">\n {{ 'Label.Name' | transloco }}\n <p-sortIcon field=\"name\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"field\">\n {{ 'Admin.Credentials.Field' | transloco }}\n <p-sortIcon field=\"field\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"is_required\">\n {{ 'Admin.Credentials.Required' | transloco }}\n <p-sortIcon field=\"is_required\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"active\">\n {{ 'Label.IsActive' | transloco }}\n <p-sortIcon field=\"active\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"is_visible\">\n {{ 'Label.IsVisible' | transloco }}\n <p-sortIcon field=\"is_visible\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n class=\"actions-list-two\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-credential>\n <tr>\n <td data-head=\"Name\">{{ credential.name }}</td>\n <td data-head=\"Field\">\n <ng-template [ngIf]=\"credential?.description\"\n [ngIfElse]=\"noDescription\">\n <span class=\"info-circle\">{{ credential.field\n }}<span class=\"tooltiptext gradient-custom-branding\">{{\n credential.description\n }}</span></span>\n </ng-template>\n <ng-template #noDescription>\n {{ credential.field }}\n </ng-template>\n </td>\n <td data-head=\"Required\">\n <span [appDynamicBadge]=\"{\n itemsArray: [true, false],\n item: credential?.is_required\n }\"\n color=\"success-danger\"\n class=\"badge\">\n {{ !!credential?.is_required }}\n </span>\n </td>\n <td data-head=\"Is Active\">\n <span [appDynamicBadge]=\"{ itemsArray: [true, false], item: credential?.active }\"\n color=\"success-danger\"\n class=\"badge\">{{ credential?.active ? 'Yes' : 'No' }}</span>\n </td>\n <td data-head=\"Is Visible\">\n <span [appDynamicBadge]=\"{\n itemsArray: [true, false],\n item: credential?.is_visible\n }\"\n color=\"success-danger\"\n class=\"badge\">{{ credential?.is_visible ? 'Yes' : 'No' }}</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[routers.adminCredentialsDetails + credential.id]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n (click)=\"onDelete(credential)\"\n (keydown.enter)=\"onDelete(credential)\"\n (keydown.space)=\"onDelete(credential)\"\n class=\"fa fa-trash delete-icon\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n<div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n</div>\n <span *ngIf=\"data.object_count !== 0\" class=\"total-records-count\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Credentials.NoDataMessage' | transloco\"> </pw-no-data>\n</div>\n" }]
|
|
447
447
|
}], ctorParameters: () => [{ type: i1.AdminService }, { type: i0.Injector }, { type: i0.ChangeDetectorRef }] });
|
|
448
448
|
|
|
449
449
|
class CredentialsDetailsComponent extends AppBaseComponent {
|
|
@@ -497,7 +497,7 @@ class CredentialsDetailsComponent extends AppBaseComponent {
|
|
|
497
497
|
super.ngOnDestroy();
|
|
498
498
|
}
|
|
499
499
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: CredentialsDetailsComponent, deps: [{ token: i1.AdminService }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
500
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: CredentialsDetailsComponent, isStandalone: false, selector: "pw-credentials-details", usesInheritance: true, ngImport: i0, template: "<div class=\"container-fluid pw-tab overflow-hidden\">\n <div class=\"dashboard\">\n <div class=\"dashboard-body\">\n <div class=\"me-auto col-xs-6 mt-4\">\n <a aria-label=\"Navigate to Target\"\n routerLink=\"../../credentials\"\n class=\"previous\">\n <i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h3 class=\"m-subheader__title m-subheader__title--separator\">\n <span>Credentials: {{ isLoading ? '' :( data?.name ? data?.name : 'Add New') }}</span>\n </h3>\n </div>\n\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"isLoading\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n\n <div class=\"p-2 mt-3\">\n <form [formGroup]=\"form\"\n *ngIf=\"!isLoading\"\n (ngSubmit)=\"onSaveForm()\">\n <div class=\"row\">\n <div class=\"col-12 col-md-3\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Credentials.Name' | transloco\"\n class=\"col-md-6 p-0\"\n name=\"name\" controlId=\"credentials-name\"\n [errorMsg]=\"'Admin.Credentials.Validation.Name' | transloco\">\n <input type=\"text\"\n id=\"credentials-name\"\n class=\"form-control\"\n formControlName=\"name\"\n [ngClass]=\"{ 'is-invalid': submitted && f['name'].errors }\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-3\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Credentials.Field' | transloco\"\n class=\"col-md-6 p-0\"\n name=\"field\" controlId=\"credentials-field\"\n [errorMsg]=\"'Admin.Credentials.Validation.Field' | transloco\">\n <input type=\"text\"\n id=\"credentials-field\"\n class=\"form-control\"\n formControlName=\"field\"\n [ngClass]=\"{ 'is-invalid': submitted && f['field'].errors }\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Credentials.Active' | transloco\"\n class=\"nowrap\"\n name=\"active\" controlId=\"credentials-active\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\"\n [attr.aria-labelledby]=\"'credentials-active-label'\"\n formControlName=\"active\"\n name=\"active\"\n [ngClass]=\"{ 'is-invalid': submitted && f['active'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Credentials.Visible' | transloco\"\n class=\"nowrap\"\n name=\"is_visible\" controlId=\"credentials-is_visible\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\"\n [attr.aria-labelledby]=\"'credentials-is_visible-label'\"\n formControlName=\"is_visible\"\n name=\"is_visible\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['is_visible'].errors\n }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n\n <div class=\"col\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Credentials.IsRequired' | transloco\"\n class=\"nowrap\"\n name=\"is_required\" controlId=\"credentials-is_required\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\"\n [attr.aria-labelledby]=\"'credentials-is_required-label'\"\n formControlName=\"is_required\"\n name=\"is_required\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['is_required'].errors\n }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n\n <div class=\"col-12\">\n <pw-input-container [label]=\"'Admin.Credentials.Description' | transloco\"\n name=\"description\" controlId=\"credentials-description\"\n [errorMsg]=\"'Admin.Credentials.Validation.Description' | transloco\">\n <textarea id=\"credentials-description\" type=\"text\"\n rows=\"3\"\n class=\"form-control\"\n formControlName=\"description\"></textarea>\n </pw-input-container>\n </div>\n\n <div class=\"col-12 text-end mt-3\">\n <button type=\"button\"\n class=\"btn btn-outline-default me-2\"\n (click)=\"back()\">\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n class=\"btn btn-primary\"\n *rbacAllow=\"'Pages.Admin.Credentials.Edit'\">\n {{ 'Button.Submit' | transloco }}\n </button>\n </div>\n </div>\n </form>\n </div>\n </div>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i4.UiSwitchComponent, selector: "ui-switch", inputs: ["size", "color", "switchOffColor", "switchColor", "defaultBgColor", "defaultBoColor", "checkedLabel", "uncheckedLabel", "checkedTextColor", "uncheckedTextColor", "beforeChange", "ariaLabel", "checked", "disabled", "reverse", "loading"], outputs: ["change", "changeEvent", "valueChange"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "controlId", "useAriaLabelledbyOnly", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i10.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i10.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i11.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
|
|
500
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: CredentialsDetailsComponent, isStandalone: false, selector: "pw-credentials-details", usesInheritance: true, ngImport: i0, template: "<div class=\"container-fluid pw-tab overflow-hidden\">\n <div class=\"dashboard\">\n <div class=\"dashboard-body\">\n <div class=\"me-auto col-xs-6 mt-4\">\n <a aria-label=\"Navigate to Target\"\n routerLink=\"../../credentials\"\n class=\"previous\">\n <i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h3 class=\"m-subheader__title m-subheader__title--separator\">\n <span>Credentials: {{ isLoading ? '' :( data?.name ? data?.name : 'Add New') }}</span>\n </h3>\n </div>\n\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"isLoading\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n\n <div class=\"p-2 mt-3\">\n <form [formGroup]=\"form\"\n *ngIf=\"!isLoading\"\n (ngSubmit)=\"onSaveForm()\">\n <div class=\"row\">\n <div class=\"col-12 col-md-3\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Credentials.Name' | transloco\"\n class=\"col-md-6 p-0\"\n name=\"name\" controlId=\"credentials-name\"\n [errorMsg]=\"'Admin.Credentials.Validation.Name' | transloco\">\n <input type=\"text\"\n id=\"credentials-name\"\n class=\"form-control\"\n formControlName=\"name\"\n autocomplete=\"organization\"\n [ngClass]=\"{ 'is-invalid': submitted && f['name'].errors }\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-3\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Credentials.Field' | transloco\"\n class=\"col-md-6 p-0\"\n name=\"field\" controlId=\"credentials-field\"\n [errorMsg]=\"'Admin.Credentials.Validation.Field' | transloco\">\n <input type=\"text\"\n id=\"credentials-field\"\n class=\"form-control\"\n formControlName=\"field\"\n autocomplete=\"off\"\n [ngClass]=\"{ 'is-invalid': submitted && f['field'].errors }\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Credentials.Active' | transloco\"\n class=\"nowrap\"\n name=\"active\" controlId=\"credentials-active\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\"\n [attr.aria-labelledby]=\"'credentials-active-label'\"\n formControlName=\"active\"\n name=\"active\"\n [ngClass]=\"{ 'is-invalid': submitted && f['active'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Credentials.Visible' | transloco\"\n class=\"nowrap\"\n name=\"is_visible\" controlId=\"credentials-is_visible\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\"\n [attr.aria-labelledby]=\"'credentials-is_visible-label'\"\n formControlName=\"is_visible\"\n name=\"is_visible\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['is_visible'].errors\n }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n\n <div class=\"col\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Credentials.IsRequired' | transloco\"\n class=\"nowrap\"\n name=\"is_required\" controlId=\"credentials-is_required\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\"\n [attr.aria-labelledby]=\"'credentials-is_required-label'\"\n formControlName=\"is_required\"\n name=\"is_required\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['is_required'].errors\n }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n\n <div class=\"col-12\">\n <pw-input-container [label]=\"'Admin.Credentials.Description' | transloco\"\n name=\"description\" controlId=\"credentials-description\"\n [errorMsg]=\"'Admin.Credentials.Validation.Description' | transloco\">\n <textarea id=\"credentials-description\" type=\"text\"\n rows=\"3\"\n class=\"form-control\"\n formControlName=\"description\"\n autocomplete=\"off\"></textarea>\n </pw-input-container>\n </div>\n\n <div class=\"col-12 text-end mt-3\">\n <button type=\"button\"\n class=\"btn btn-outline-default me-2\"\n (click)=\"back()\">\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n class=\"btn btn-primary\"\n *rbacAllow=\"'Pages.Admin.Credentials.Edit'\">\n {{ 'Button.Submit' | transloco }}\n </button>\n </div>\n </div>\n </form>\n </div>\n </div>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i4.UiSwitchComponent, selector: "ui-switch", inputs: ["size", "color", "switchOffColor", "switchColor", "defaultBgColor", "defaultBoColor", "checkedLabel", "uncheckedLabel", "checkedTextColor", "uncheckedTextColor", "beforeChange", "ariaLabel", "checked", "disabled", "reverse", "loading"], outputs: ["change", "changeEvent", "valueChange"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "controlId", "useAriaLabelledbyOnly", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i10.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i10.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i11.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
|
|
501
501
|
}
|
|
502
502
|
__decorate([
|
|
503
503
|
ValidateForm('form'),
|
|
@@ -507,7 +507,7 @@ __decorate([
|
|
|
507
507
|
], CredentialsDetailsComponent.prototype, "onSaveForm", null);
|
|
508
508
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: CredentialsDetailsComponent, decorators: [{
|
|
509
509
|
type: Component,
|
|
510
|
-
args: [{ selector: 'pw-credentials-details', standalone: false, template: "<div class=\"container-fluid pw-tab overflow-hidden\">\n <div class=\"dashboard\">\n <div class=\"dashboard-body\">\n <div class=\"me-auto col-xs-6 mt-4\">\n <a aria-label=\"Navigate to Target\"\n routerLink=\"../../credentials\"\n class=\"previous\">\n <i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h3 class=\"m-subheader__title m-subheader__title--separator\">\n <span>Credentials: {{ isLoading ? '' :( data?.name ? data?.name : 'Add New') }}</span>\n </h3>\n </div>\n\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"isLoading\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n\n <div class=\"p-2 mt-3\">\n <form [formGroup]=\"form\"\n *ngIf=\"!isLoading\"\n (ngSubmit)=\"onSaveForm()\">\n <div class=\"row\">\n <div class=\"col-12 col-md-3\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Credentials.Name' | transloco\"\n class=\"col-md-6 p-0\"\n name=\"name\" controlId=\"credentials-name\"\n [errorMsg]=\"'Admin.Credentials.Validation.Name' | transloco\">\n <input type=\"text\"\n id=\"credentials-name\"\n class=\"form-control\"\n formControlName=\"name\"\n [ngClass]=\"{ 'is-invalid': submitted && f['name'].errors }\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-3\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Credentials.Field' | transloco\"\n class=\"col-md-6 p-0\"\n name=\"field\" controlId=\"credentials-field\"\n [errorMsg]=\"'Admin.Credentials.Validation.Field' | transloco\">\n <input type=\"text\"\n id=\"credentials-field\"\n class=\"form-control\"\n formControlName=\"field\"\n [ngClass]=\"{ 'is-invalid': submitted && f['field'].errors }\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Credentials.Active' | transloco\"\n class=\"nowrap\"\n name=\"active\" controlId=\"credentials-active\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\"\n [attr.aria-labelledby]=\"'credentials-active-label'\"\n formControlName=\"active\"\n name=\"active\"\n [ngClass]=\"{ 'is-invalid': submitted && f['active'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Credentials.Visible' | transloco\"\n class=\"nowrap\"\n name=\"is_visible\" controlId=\"credentials-is_visible\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\"\n [attr.aria-labelledby]=\"'credentials-is_visible-label'\"\n formControlName=\"is_visible\"\n name=\"is_visible\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['is_visible'].errors\n }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n\n <div class=\"col\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Credentials.IsRequired' | transloco\"\n class=\"nowrap\"\n name=\"is_required\" controlId=\"credentials-is_required\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\"\n [attr.aria-labelledby]=\"'credentials-is_required-label'\"\n formControlName=\"is_required\"\n name=\"is_required\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['is_required'].errors\n }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n\n <div class=\"col-12\">\n <pw-input-container [label]=\"'Admin.Credentials.Description' | transloco\"\n name=\"description\" controlId=\"credentials-description\"\n [errorMsg]=\"'Admin.Credentials.Validation.Description' | transloco\">\n <textarea id=\"credentials-description\" type=\"text\"\n rows=\"3\"\n class=\"form-control\"\n formControlName=\"description\"></textarea>\n </pw-input-container>\n </div>\n\n <div class=\"col-12 text-end mt-3\">\n <button type=\"button\"\n class=\"btn btn-outline-default me-2\"\n (click)=\"back()\">\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n class=\"btn btn-primary\"\n *rbacAllow=\"'Pages.Admin.Credentials.Edit'\">\n {{ 'Button.Submit' | transloco }}\n </button>\n </div>\n </div>\n </form>\n </div>\n </div>\n </div>\n</div>\n" }]
|
|
510
|
+
args: [{ selector: 'pw-credentials-details', standalone: false, template: "<div class=\"container-fluid pw-tab overflow-hidden\">\n <div class=\"dashboard\">\n <div class=\"dashboard-body\">\n <div class=\"me-auto col-xs-6 mt-4\">\n <a aria-label=\"Navigate to Target\"\n routerLink=\"../../credentials\"\n class=\"previous\">\n <i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h3 class=\"m-subheader__title m-subheader__title--separator\">\n <span>Credentials: {{ isLoading ? '' :( data?.name ? data?.name : 'Add New') }}</span>\n </h3>\n </div>\n\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"isLoading\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n\n <div class=\"p-2 mt-3\">\n <form [formGroup]=\"form\"\n *ngIf=\"!isLoading\"\n (ngSubmit)=\"onSaveForm()\">\n <div class=\"row\">\n <div class=\"col-12 col-md-3\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Credentials.Name' | transloco\"\n class=\"col-md-6 p-0\"\n name=\"name\" controlId=\"credentials-name\"\n [errorMsg]=\"'Admin.Credentials.Validation.Name' | transloco\">\n <input type=\"text\"\n id=\"credentials-name\"\n class=\"form-control\"\n formControlName=\"name\"\n autocomplete=\"organization\"\n [ngClass]=\"{ 'is-invalid': submitted && f['name'].errors }\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-3\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Credentials.Field' | transloco\"\n class=\"col-md-6 p-0\"\n name=\"field\" controlId=\"credentials-field\"\n [errorMsg]=\"'Admin.Credentials.Validation.Field' | transloco\">\n <input type=\"text\"\n id=\"credentials-field\"\n class=\"form-control\"\n formControlName=\"field\"\n autocomplete=\"off\"\n [ngClass]=\"{ 'is-invalid': submitted && f['field'].errors }\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Credentials.Active' | transloco\"\n class=\"nowrap\"\n name=\"active\" controlId=\"credentials-active\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\"\n [attr.aria-labelledby]=\"'credentials-active-label'\"\n formControlName=\"active\"\n name=\"active\"\n [ngClass]=\"{ 'is-invalid': submitted && f['active'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Credentials.Visible' | transloco\"\n class=\"nowrap\"\n name=\"is_visible\" controlId=\"credentials-is_visible\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\"\n [attr.aria-labelledby]=\"'credentials-is_visible-label'\"\n formControlName=\"is_visible\"\n name=\"is_visible\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['is_visible'].errors\n }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n\n <div class=\"col\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Credentials.IsRequired' | transloco\"\n class=\"nowrap\"\n name=\"is_required\" controlId=\"credentials-is_required\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\"\n [attr.aria-labelledby]=\"'credentials-is_required-label'\"\n formControlName=\"is_required\"\n name=\"is_required\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['is_required'].errors\n }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n\n <div class=\"col-12\">\n <pw-input-container [label]=\"'Admin.Credentials.Description' | transloco\"\n name=\"description\" controlId=\"credentials-description\"\n [errorMsg]=\"'Admin.Credentials.Validation.Description' | transloco\">\n <textarea id=\"credentials-description\" type=\"text\"\n rows=\"3\"\n class=\"form-control\"\n formControlName=\"description\"\n autocomplete=\"off\"></textarea>\n </pw-input-container>\n </div>\n\n <div class=\"col-12 text-end mt-3\">\n <button type=\"button\"\n class=\"btn btn-outline-default me-2\"\n (click)=\"back()\">\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n class=\"btn btn-primary\"\n *rbacAllow=\"'Pages.Admin.Credentials.Edit'\">\n {{ 'Button.Submit' | transloco }}\n </button>\n </div>\n </div>\n </form>\n </div>\n </div>\n </div>\n</div>\n" }]
|
|
511
511
|
}], ctorParameters: () => [{ type: i1.AdminService }, { type: i0.Injector }], propDecorators: { onSaveForm: [] } });
|
|
512
512
|
|
|
513
513
|
class CredentialsTabComponent {
|
|
@@ -605,11 +605,11 @@ class SubscriptionCredentialsComponent extends AppBaseComponent {
|
|
|
605
605
|
super.ngOnDestroy();
|
|
606
606
|
}
|
|
607
607
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: SubscriptionCredentialsComponent, deps: [{ token: i1.AdminService }, { token: i0.Injector }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
608
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: SubscriptionCredentialsComponent, isStandalone: false, selector: "pw-subscription-credentials", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12 d-flex justify-content-between align-items-center\">\n <h2 class=\"card-title p-0 float-start\">Subscription Credentials</h2>\n <button class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"create-subscription-credential\"\n [routerLink]=\"[routers.subscriptionCredentialDetails + 'add']\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Admin.SubscriptionCredentialMessages.CreateSubscriptionCredential' | transloco }}\n </button>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container mt table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.subscription_credentials\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <label for=\"subscription-credentials-search\" class=\"visually-hidden\">Search Credentials</label>\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n id=\"subscription-credentials-search\"\n name=\"subscription-credentials-search\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search Credentials...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"subscription_id\">\n {{ 'Admin.SubscriptionCredentialMessages.SubscriptionOwner' | transloco }}\n <p-sortIcon field=\"subscription_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"credential_id\">\n {{ 'Admin.SubscriptionCredentialMessages.Credential' | transloco }}\n <p-sortIcon field=\"credential_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"field\">\n {{ 'Admin.SubscriptionCredentialMessages.Field' | transloco }}\n <p-sortIcon field=\"field\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"value\">\n {{ 'Admin.SubscriptionCredentialMessages.Value' | transloco }}\n <p-sortIcon field=\"value\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"is_visible\">\n {{ 'Admin.SubscriptionCredentialMessages.Visible' | transloco }}\n <p-sortIcon field=\"is_visible\"></p-sortIcon>\n </th>\n <th class=\"actions-list-two\"\n scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-credential>\n <tr>\n <td data-head=\"Name\">{{ credential?.subscription?.contact_name }}</td>\n <td data-head=\"Credential Name\">{{ credential?.credential?.name }}</td>\n <td data-head=\"Field\">{{ credential?.credential?.field }}</td>\n <td data-head=\"Value\">{{ credential.value }}</td>\n <td data-head=\"Is Active\">\n <span *ngIf=\"credential?.is_visible\"\n class=\"badge bg-success\">yes</span>\n <span *ngIf=\"!credential?.is_visible\"\n class=\"badge bg-danger\">No</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[routers.subscriptionCredentialDetails + credential.id]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n (click)=\"onDelete(credential.id)\"\n (keydown.enter)=\"onDelete(credential.id)\"\n (keydown.space)=\"onDelete(credential.id)\"\n class=\"fa fa-trash delete-icon\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n<div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n\n </pw-no-data>\n</div>\n <span *ngIf=\"data.object_count !== 0\" class=\"total-records-count\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Credentials.NoDataMessage' | transloco\"> </pw-no-data>\n</div>\n", dependencies: [{ kind: "component", type: i2.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.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["variant", "fluid", "pSize"] }, { kind: "directive", type: i2$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i11.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
|
|
608
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: SubscriptionCredentialsComponent, isStandalone: false, selector: "pw-subscription-credentials", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12 d-flex justify-content-between align-items-center\">\n <h2 class=\"card-title p-0 float-start\">Subscription Credentials</h2>\n <button class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"create-subscription-credential\"\n [routerLink]=\"[routers.subscriptionCredentialDetails + 'add']\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Admin.SubscriptionCredentialMessages.CreateSubscriptionCredential' | transloco }}\n </button>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container mt table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.subscription_credentials\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <label for=\"subscription-credentials-search\" class=\"visually-hidden\">Search Credentials</label>\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n id=\"subscription-credentials-search\"\n name=\"subscription-credentials-search\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search Credentials...\"\n autocomplete=\"off\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"subscription_id\">\n {{ 'Admin.SubscriptionCredentialMessages.SubscriptionOwner' | transloco }}\n <p-sortIcon field=\"subscription_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"credential_id\">\n {{ 'Admin.SubscriptionCredentialMessages.Credential' | transloco }}\n <p-sortIcon field=\"credential_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"field\">\n {{ 'Admin.SubscriptionCredentialMessages.Field' | transloco }}\n <p-sortIcon field=\"field\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"value\">\n {{ 'Admin.SubscriptionCredentialMessages.Value' | transloco }}\n <p-sortIcon field=\"value\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"is_visible\">\n {{ 'Admin.SubscriptionCredentialMessages.Visible' | transloco }}\n <p-sortIcon field=\"is_visible\"></p-sortIcon>\n </th>\n <th class=\"actions-list-two\"\n scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-credential>\n <tr>\n <td data-head=\"Name\">{{ credential?.subscription?.contact_name }}</td>\n <td data-head=\"Credential Name\">{{ credential?.credential?.name }}</td>\n <td data-head=\"Field\">{{ credential?.credential?.field }}</td>\n <td data-head=\"Value\">{{ credential.value }}</td>\n <td data-head=\"Is Active\">\n <span *ngIf=\"credential?.is_visible\"\n class=\"badge bg-success\">yes</span>\n <span *ngIf=\"!credential?.is_visible\"\n class=\"badge bg-danger\">No</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[routers.subscriptionCredentialDetails + credential.id]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n (click)=\"onDelete(credential.id)\"\n (keydown.enter)=\"onDelete(credential.id)\"\n (keydown.space)=\"onDelete(credential.id)\"\n class=\"fa fa-trash delete-icon\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n<div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n\n </pw-no-data>\n</div>\n <span *ngIf=\"data.object_count !== 0\" class=\"total-records-count\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Credentials.NoDataMessage' | transloco\"> </pw-no-data>\n</div>\n", dependencies: [{ kind: "component", type: i2.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.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["variant", "fluid", "pSize"] }, { kind: "directive", type: i2$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i11.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
|
|
609
609
|
}
|
|
610
610
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: SubscriptionCredentialsComponent, decorators: [{
|
|
611
611
|
type: Component,
|
|
612
|
-
args: [{ selector: 'pw-subscription-credentials', standalone: false, template: "<div class=\"row\">\n <div class=\"col-12 d-flex justify-content-between align-items-center\">\n <h2 class=\"card-title p-0 float-start\">Subscription Credentials</h2>\n <button class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"create-subscription-credential\"\n [routerLink]=\"[routers.subscriptionCredentialDetails + 'add']\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Admin.SubscriptionCredentialMessages.CreateSubscriptionCredential' | transloco }}\n </button>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container mt table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.subscription_credentials\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <label for=\"subscription-credentials-search\" class=\"visually-hidden\">Search Credentials</label>\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n id=\"subscription-credentials-search\"\n name=\"subscription-credentials-search\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search Credentials...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"subscription_id\">\n {{ 'Admin.SubscriptionCredentialMessages.SubscriptionOwner' | transloco }}\n <p-sortIcon field=\"subscription_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"credential_id\">\n {{ 'Admin.SubscriptionCredentialMessages.Credential' | transloco }}\n <p-sortIcon field=\"credential_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"field\">\n {{ 'Admin.SubscriptionCredentialMessages.Field' | transloco }}\n <p-sortIcon field=\"field\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"value\">\n {{ 'Admin.SubscriptionCredentialMessages.Value' | transloco }}\n <p-sortIcon field=\"value\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"is_visible\">\n {{ 'Admin.SubscriptionCredentialMessages.Visible' | transloco }}\n <p-sortIcon field=\"is_visible\"></p-sortIcon>\n </th>\n <th class=\"actions-list-two\"\n scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-credential>\n <tr>\n <td data-head=\"Name\">{{ credential?.subscription?.contact_name }}</td>\n <td data-head=\"Credential Name\">{{ credential?.credential?.name }}</td>\n <td data-head=\"Field\">{{ credential?.credential?.field }}</td>\n <td data-head=\"Value\">{{ credential.value }}</td>\n <td data-head=\"Is Active\">\n <span *ngIf=\"credential?.is_visible\"\n class=\"badge bg-success\">yes</span>\n <span *ngIf=\"!credential?.is_visible\"\n class=\"badge bg-danger\">No</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[routers.subscriptionCredentialDetails + credential.id]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n (click)=\"onDelete(credential.id)\"\n (keydown.enter)=\"onDelete(credential.id)\"\n (keydown.space)=\"onDelete(credential.id)\"\n class=\"fa fa-trash delete-icon\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n<div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n\n </pw-no-data>\n</div>\n <span *ngIf=\"data.object_count !== 0\" class=\"total-records-count\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Credentials.NoDataMessage' | transloco\"> </pw-no-data>\n</div>\n" }]
|
|
612
|
+
args: [{ selector: 'pw-subscription-credentials', standalone: false, template: "<div class=\"row\">\n <div class=\"col-12 d-flex justify-content-between align-items-center\">\n <h2 class=\"card-title p-0 float-start\">Subscription Credentials</h2>\n <button class=\"btn btn-sm btn-outline-primary float-end\"\n data-cy=\"create-subscription-credential\"\n [routerLink]=\"[routers.subscriptionCredentialDetails + 'add']\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i>\n {{ 'Admin.SubscriptionCredentialMessages.CreateSubscriptionCredential' | transloco }}\n </button>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container mt table-responsive\"\n [class.hideTable]=\"data.unfiltered_count === 0\">\n <p-table #dt\n [value]=\"data.subscription_credentials\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <label for=\"subscription-credentials-search\" class=\"visually-hidden\">Search Credentials</label>\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n id=\"subscription-credentials-search\"\n name=\"subscription-credentials-search\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search Credentials...\"\n autocomplete=\"off\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90\" />\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"subscription_id\">\n {{ 'Admin.SubscriptionCredentialMessages.SubscriptionOwner' | transloco }}\n <p-sortIcon field=\"subscription_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"credential_id\">\n {{ 'Admin.SubscriptionCredentialMessages.Credential' | transloco }}\n <p-sortIcon field=\"credential_id\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"field\">\n {{ 'Admin.SubscriptionCredentialMessages.Field' | transloco }}\n <p-sortIcon field=\"field\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"value\">\n {{ 'Admin.SubscriptionCredentialMessages.Value' | transloco }}\n <p-sortIcon field=\"value\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"is_visible\">\n {{ 'Admin.SubscriptionCredentialMessages.Visible' | transloco }}\n <p-sortIcon field=\"is_visible\"></p-sortIcon>\n </th>\n <th class=\"actions-list-two\"\n scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-credential>\n <tr>\n <td data-head=\"Name\">{{ credential?.subscription?.contact_name }}</td>\n <td data-head=\"Credential Name\">{{ credential?.credential?.name }}</td>\n <td data-head=\"Field\">{{ credential?.credential?.field }}</td>\n <td data-head=\"Value\">{{ credential.value }}</td>\n <td data-head=\"Is Active\">\n <span *ngIf=\"credential?.is_visible\"\n class=\"badge bg-success\">yes</span>\n <span *ngIf=\"!credential?.is_visible\"\n class=\"badge bg-danger\">No</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\"\n [routerLink]=\"[routers.subscriptionCredentialDetails + credential.id]\">\n <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n (click)=\"onDelete(credential.id)\"\n (keydown.enter)=\"onDelete(credential.id)\"\n (keydown.space)=\"onDelete(credential.id)\"\n class=\"fa fa-trash delete-icon\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n<div *ngIf=\"data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n\n </pw-no-data>\n</div>\n <span *ngIf=\"data.object_count !== 0\" class=\"total-records-count\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n</div>\n<div *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Credentials.NoDataMessage' | transloco\"> </pw-no-data>\n</div>\n" }]
|
|
613
613
|
}], ctorParameters: () => [{ type: i1.AdminService }, { type: i0.Injector }, { type: i0.ChangeDetectorRef }] });
|
|
614
614
|
|
|
615
615
|
class SubscriptionCredentialsDetailsComponent extends AppBaseComponent {
|
|
@@ -685,7 +685,7 @@ class SubscriptionCredentialsDetailsComponent extends AppBaseComponent {
|
|
|
685
685
|
super.ngOnDestroy();
|
|
686
686
|
}
|
|
687
687
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: SubscriptionCredentialsDetailsComponent, deps: [{ token: i1.AdminService }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
688
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: SubscriptionCredentialsDetailsComponent, isStandalone: false, selector: "pw-subscription-credentials-details", usesInheritance: true, ngImport: i0, template: "<div class=\"container-fluid pw-tab overflow-hidden\">\n <div class=\"dashboard\">\n <div class=\"dashboard-body\">\n <div class=\"me-auto col-xs-6 mt-4\">\n <a aria-label=\"Navigate to Target\"\n (click)=\"back()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h3 class=\"m-subheader__title m-subheader__title--separator\">\n <span>{{\n 'Admin.SubscriptionCredentialMessages.SubscriptionCredential'\n | transloco\n }}: {{ isLoading ? '' : (data?.name || 'Add New') }}</span>\n </h3>\n </div>\n\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"isLoading\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n\n <div class=\"p-2 mt-3\">\n <form [formGroup]=\"form\"\n *ngIf=\"!isLoading\"\n (ngSubmit)=\"onSaveForm()\">\n <div class=\"row\">\n <div class=\"col-12 col-sm-4\">\n <pw-input-container [label]=\"\n 'Admin.SubscriptionCredentialMessages.Credential' | transloco\n \"\n name=\"credential_id\" controlId=\"subscription-credential-credential_id\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"\n 'Admin.SubscriptionCredentialMessages.CredentialValidation'\n | transloco\n \">\n <p-select\n [attr.aria-labelledby]=\"'subscription-credential-credential_id-label'\"\n [options]=\"allCredentials\"\n formControlName=\"credential_id\"\n [ngClass]=\"{'is-invalid': submitted && f['credential_id'].errors}\"\n optionLabel=\"name\"\n optionValue=\"id\"\n [placeholder]=\"'Admin.SubscriptionCredentialMessages.SelectCredential' | transloco\">\n <ng-template pTemplate=\"selectedItem\">\n <div *ngIf=\"form.get('credential_id').value\">\n {{getSelectedCredentialName()}} - {{getSelectedCredentialField()}}\n </div>\n </ng-template>\n <ng-template pTemplate=\"item\" let-option>\n {{option.name}} - {{option.field}}\n </ng-template>\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-4\">\n <pw-input-container [label]=\"'Admin.SubscriptionCredentialMessages.Value' | transloco\"\n name=\"value\"\n controlId=\"subscription-credentials-details-value\"\n [errorMsg]=\"\n 'Admin.SubscriptionCredentialMessages.ValueValidation'\n | transloco\n \">\n <input type=\"text\"\n id=\"subscription-credentials-details-value\"\n class=\"form-control\"\n formControlName=\"value\"\n [ngClass]=\"{ 'is-invalid': submitted && f['value'].errors }\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12 text-end mt-3\">\n <button type=\"button\"\n class=\"btn btn-outline-default me-2\"\n (click)=\"back()\">\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n class=\"btn btn-primary\"\n *rbacAllow=\"'Pages.Admin.Credentials.Edit'\">\n {{ 'Button.Submit' | transloco }}\n </button>\n </div>\n </div>\n </form>\n </div>\n </div>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i3$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i3.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "size", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "fluid", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "controlId", "useAriaLabelledbyOnly", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i10.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i10.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
|
|
688
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: SubscriptionCredentialsDetailsComponent, isStandalone: false, selector: "pw-subscription-credentials-details", usesInheritance: true, ngImport: i0, template: "<div class=\"container-fluid pw-tab overflow-hidden\">\n <div class=\"dashboard\">\n <div class=\"dashboard-body\">\n <div class=\"me-auto col-xs-6 mt-4\">\n <a aria-label=\"Navigate to Target\"\n (click)=\"back()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h3 class=\"m-subheader__title m-subheader__title--separator\">\n <span>{{\n 'Admin.SubscriptionCredentialMessages.SubscriptionCredential'\n | transloco\n }}: {{ isLoading ? '' : (data?.name || 'Add New') }}</span>\n </h3>\n </div>\n\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"isLoading\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n\n <div class=\"p-2 mt-3\">\n <form [formGroup]=\"form\"\n *ngIf=\"!isLoading\"\n (ngSubmit)=\"onSaveForm()\">\n <div class=\"row\">\n <div class=\"col-12 col-sm-4\">\n <pw-input-container [label]=\"\n 'Admin.SubscriptionCredentialMessages.Credential' | transloco\n \"\n name=\"credential_id\" controlId=\"subscription-credential-credential_id\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"\n 'Admin.SubscriptionCredentialMessages.CredentialValidation'\n | transloco\n \">\n <p-select\n inputId=\"subscription-credential-credential_id\"\n [attr.aria-labelledby]=\"'subscription-credential-credential_id-label'\"\n [options]=\"allCredentials\"\n formControlName=\"credential_id\"\n [ngClass]=\"{'is-invalid': submitted && f['credential_id'].errors}\"\n optionLabel=\"name\"\n optionValue=\"id\"\n [placeholder]=\"'Admin.SubscriptionCredentialMessages.SelectCredential' | transloco\">\n <ng-template pTemplate=\"selectedItem\">\n <div *ngIf=\"form.get('credential_id').value\">\n {{getSelectedCredentialName()}} - {{getSelectedCredentialField()}}\n </div>\n </ng-template>\n <ng-template pTemplate=\"item\" let-option>\n {{option.name}} - {{option.field}}\n </ng-template>\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-4\">\n <pw-input-container [label]=\"'Admin.SubscriptionCredentialMessages.Value' | transloco\"\n name=\"value\"\n controlId=\"subscription-credentials-details-value\"\n [errorMsg]=\"\n 'Admin.SubscriptionCredentialMessages.ValueValidation'\n | transloco\n \">\n <input type=\"text\"\n id=\"subscription-credentials-details-value\"\n class=\"form-control\"\n formControlName=\"value\"\n autocomplete=\"off\"\n [ngClass]=\"{ 'is-invalid': submitted && f['value'].errors }\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12 text-end mt-3\">\n <button type=\"button\"\n class=\"btn btn-outline-default me-2\"\n (click)=\"back()\">\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n class=\"btn btn-primary\"\n *rbacAllow=\"'Pages.Admin.Credentials.Edit'\">\n {{ 'Button.Submit' | transloco }}\n </button>\n </div>\n </div>\n </form>\n </div>\n </div>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i3$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i3.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "size", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "fluid", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "controlId", "useAriaLabelledbyOnly", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i10.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i10.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
|
|
689
689
|
}
|
|
690
690
|
__decorate([
|
|
691
691
|
ValidateForm('form'),
|
|
@@ -695,7 +695,7 @@ __decorate([
|
|
|
695
695
|
], SubscriptionCredentialsDetailsComponent.prototype, "onSaveForm", null);
|
|
696
696
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: SubscriptionCredentialsDetailsComponent, decorators: [{
|
|
697
697
|
type: Component,
|
|
698
|
-
args: [{ selector: 'pw-subscription-credentials-details', standalone: false, template: "<div class=\"container-fluid pw-tab overflow-hidden\">\n <div class=\"dashboard\">\n <div class=\"dashboard-body\">\n <div class=\"me-auto col-xs-6 mt-4\">\n <a aria-label=\"Navigate to Target\"\n (click)=\"back()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h3 class=\"m-subheader__title m-subheader__title--separator\">\n <span>{{\n 'Admin.SubscriptionCredentialMessages.SubscriptionCredential'\n | transloco\n }}: {{ isLoading ? '' : (data?.name || 'Add New') }}</span>\n </h3>\n </div>\n\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"isLoading\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n\n <div class=\"p-2 mt-3\">\n <form [formGroup]=\"form\"\n *ngIf=\"!isLoading\"\n (ngSubmit)=\"onSaveForm()\">\n <div class=\"row\">\n <div class=\"col-12 col-sm-4\">\n <pw-input-container [label]=\"\n 'Admin.SubscriptionCredentialMessages.Credential' | transloco\n \"\n name=\"credential_id\" controlId=\"subscription-credential-credential_id\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"\n 'Admin.SubscriptionCredentialMessages.CredentialValidation'\n | transloco\n \">\n <p-select\n [attr.aria-labelledby]=\"'subscription-credential-credential_id-label'\"\n [options]=\"allCredentials\"\n formControlName=\"credential_id\"\n [ngClass]=\"{'is-invalid': submitted && f['credential_id'].errors}\"\n optionLabel=\"name\"\n optionValue=\"id\"\n [placeholder]=\"'Admin.SubscriptionCredentialMessages.SelectCredential' | transloco\">\n <ng-template pTemplate=\"selectedItem\">\n <div *ngIf=\"form.get('credential_id').value\">\n {{getSelectedCredentialName()}} - {{getSelectedCredentialField()}}\n </div>\n </ng-template>\n <ng-template pTemplate=\"item\" let-option>\n {{option.name}} - {{option.field}}\n </ng-template>\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-4\">\n <pw-input-container [label]=\"'Admin.SubscriptionCredentialMessages.Value' | transloco\"\n name=\"value\"\n controlId=\"subscription-credentials-details-value\"\n [errorMsg]=\"\n 'Admin.SubscriptionCredentialMessages.ValueValidation'\n | transloco\n \">\n <input type=\"text\"\n id=\"subscription-credentials-details-value\"\n class=\"form-control\"\n formControlName=\"value\"\n [ngClass]=\"{ 'is-invalid': submitted && f['value'].errors }\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12 text-end mt-3\">\n <button type=\"button\"\n class=\"btn btn-outline-default me-2\"\n (click)=\"back()\">\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n class=\"btn btn-primary\"\n *rbacAllow=\"'Pages.Admin.Credentials.Edit'\">\n {{ 'Button.Submit' | transloco }}\n </button>\n </div>\n </div>\n </form>\n </div>\n </div>\n </div>\n</div>\n" }]
|
|
698
|
+
args: [{ selector: 'pw-subscription-credentials-details', standalone: false, template: "<div class=\"container-fluid pw-tab overflow-hidden\">\n <div class=\"dashboard\">\n <div class=\"dashboard-body\">\n <div class=\"me-auto col-xs-6 mt-4\">\n <a aria-label=\"Navigate to Target\"\n (click)=\"back()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h3 class=\"m-subheader__title m-subheader__title--separator\">\n <span>{{\n 'Admin.SubscriptionCredentialMessages.SubscriptionCredential'\n | transloco\n }}: {{ isLoading ? '' : (data?.name || 'Add New') }}</span>\n </h3>\n </div>\n\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"isLoading\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n\n <div class=\"p-2 mt-3\">\n <form [formGroup]=\"form\"\n *ngIf=\"!isLoading\"\n (ngSubmit)=\"onSaveForm()\">\n <div class=\"row\">\n <div class=\"col-12 col-sm-4\">\n <pw-input-container [label]=\"\n 'Admin.SubscriptionCredentialMessages.Credential' | transloco\n \"\n name=\"credential_id\" controlId=\"subscription-credential-credential_id\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"\n 'Admin.SubscriptionCredentialMessages.CredentialValidation'\n | transloco\n \">\n <p-select\n inputId=\"subscription-credential-credential_id\"\n [attr.aria-labelledby]=\"'subscription-credential-credential_id-label'\"\n [options]=\"allCredentials\"\n formControlName=\"credential_id\"\n [ngClass]=\"{'is-invalid': submitted && f['credential_id'].errors}\"\n optionLabel=\"name\"\n optionValue=\"id\"\n [placeholder]=\"'Admin.SubscriptionCredentialMessages.SelectCredential' | transloco\">\n <ng-template pTemplate=\"selectedItem\">\n <div *ngIf=\"form.get('credential_id').value\">\n {{getSelectedCredentialName()}} - {{getSelectedCredentialField()}}\n </div>\n </ng-template>\n <ng-template pTemplate=\"item\" let-option>\n {{option.name}} - {{option.field}}\n </ng-template>\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-4\">\n <pw-input-container [label]=\"'Admin.SubscriptionCredentialMessages.Value' | transloco\"\n name=\"value\"\n controlId=\"subscription-credentials-details-value\"\n [errorMsg]=\"\n 'Admin.SubscriptionCredentialMessages.ValueValidation'\n | transloco\n \">\n <input type=\"text\"\n id=\"subscription-credentials-details-value\"\n class=\"form-control\"\n formControlName=\"value\"\n autocomplete=\"off\"\n [ngClass]=\"{ 'is-invalid': submitted && f['value'].errors }\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12 text-end mt-3\">\n <button type=\"button\"\n class=\"btn btn-outline-default me-2\"\n (click)=\"back()\">\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n class=\"btn btn-primary\"\n *rbacAllow=\"'Pages.Admin.Credentials.Edit'\">\n {{ 'Button.Submit' | transloco }}\n </button>\n </div>\n </div>\n </form>\n </div>\n </div>\n </div>\n</div>\n" }]
|
|
699
699
|
}], ctorParameters: () => [{ type: i1.AdminService }, { type: i0.Injector }], propDecorators: { onSaveForm: [] } });
|
|
700
700
|
|
|
701
701
|
class DomainConfigBuildComponent extends AppBaseComponent {
|
|
@@ -1383,7 +1383,7 @@ class DomainConfigBuildComponent extends AppBaseComponent {
|
|
|
1383
1383
|
});
|
|
1384
1384
|
}
|
|
1385
1385
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DomainConfigBuildComponent, deps: [{ token: i0.Injector }, { token: i1.AdminService }, { token: i1$2.ProductService }, { token: i2$1.NgbModal }, { token: i3$2.FormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1386
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: DomainConfigBuildComponent, isStandalone: false, selector: "pw-domain-config-build", viewQueries: [{ propertyName: "partnerCropper", first: true, predicate: ["partnerCropper"], descendants: true }, { propertyName: "uploader", predicate: CustomUploaderComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<h3>Public Pages Configuration</h3>\n<div class=\"mb-4\">\n <p> The following parameters and settings will be applied to all public pages of this domain. </p>\n</div>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"isLoading\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<ng-container *ngIf=\"!isLoading && data?.host_name\">\n <form [formGroup]=\"form\"\n (ngSubmit)=\"onSave()\">\n <div class=\"row\">\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.MasterSubscription' | transloco\"\n name=\"master_subscription_id\" controlId=\"domain-build-master_subscription_id\" [useAriaLabelledbyOnly]=\"true\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.MasterSubscription' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'domain-build-master_subscription_id-label'\"\n [options]=\"masterSubscriptionsList\"\n formControlName=\"master_subscription_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['master_subscription_id']?.errors }\"\n placeholder=\"Select Master Subscription\">\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.MasterSubscriptionProduct' | transloco\"\n [showTooltip]=\"true\"\n [tooltipText]=\"\n 'Admin.DomainConfig.Tooltip.MasterSubscriptionProduct' | transloco\n \"\n name=\"master_subscription_product_id\" controlId=\"domain-build-master_subscription_product_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'domain-build-master_subscription_product_id-label'\"\n [options]=\"masterSubscriptionProductList\"\n formControlName=\"master_subscription_product_id\"\n [ngClass]=\"{'is-invalid': submitted && f['master_subscription_product_id']?.errors}\"\n [placeholder]=\"'Select Master Product'\"\n optionValue=\"id\"\n optionLabel=\"name\"\n >\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.BlogFeatureKey' | transloco\"\n name=\"blog_feature_key\" controlId=\"domain-build-blog_feature_key\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.BlogFeatureKey' | transloco\">\n <input type=\"text\"\n id=\"domain-build-blog_feature_key\"\n class=\"form-control\"\n formControlName=\"blog_feature_key\"\n [ngClass]=\"{ 'is-invalid': submitted && f['blog_feature_key'].errors }\" />\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.MainTos' | transloco\"\n name=\"main_tos_id\" controlId=\"domain-build-main_tos_id\" [useAriaLabelledbyOnly]=\"true\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.MainTos' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'domain-build-main_tos_id-label'\"\n [options]=\"subscriptionTosList\"\n formControlName=\"main_tos_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['main_tos_id']?.errors }\"\n [placeholder]=\"'Select Main TOS'\"\n optionValue=\"id\">\n <ng-template pTemplate=\"selectedItem\" let-item>\n <span [innerHTML]=\"item.title\"></span>\n </ng-template>\n <ng-template pTemplate=\"item\" let-item>\n <span [innerHTML]=\"item.title\"></span>\n </ng-template>\n </p-select>\n\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CrmSubscription' | transloco\"\n name=\"crm_subscription_id\" controlId=\"domain-build-crm_subscription_id\" [useAriaLabelledbyOnly]=\"true\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.CrmSubscription' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'domain-build-crm_subscription_id-label'\"\n [options]=\"crmSubscriptionsList\"\n formControlName=\"crm_subscription_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['crm_subscription_id']?.errors }\"\n [placeholder]=\"'Select CRM Subscription'\"\n optionValue=\"id\">\n <ng-template pTemplate=\"selectedItem\" let-item>\n {{item?.organisation ? item?.organisation + ' - ' + item.contact_name : item?.contact_name}}\n </ng-template>\n <ng-template pTemplate=\"item\" let-item>\n {{item?.organisation ? item?.organisation + ' - ' + item.contact_name : item?.contact_name}}\n </ng-template>\n </p-select>\n\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CrmProduct' | transloco\"\n name=\"crm_product_id\" controlId=\"domain-build-crm_product_id\" [useAriaLabelledbyOnly]=\"true\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.CrmProduct' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'domain-build-crm_product_id-label'\"\n [options]=\"crmProductList\"\n formControlName=\"crm_product_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['crm_product_id']?.errors }\"\n [placeholder]=\"'Select CRM Product'\"\n optionValue=\"id\"\n >\n <ng-template pTemplate=\"selectedItem\" let-item>\n {{item?.subscription_id ? item?.name +' - SubscriptionID = '+ item.subscription_id : item?.name}}\n </ng-template>\n <ng-template pTemplate=\"item\" let-item>\n {{item?.subscription_id ? item?.name +' - SubscriptionID = '+ item.subscription_id : item?.name}}\n </ng-template>\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CrmSource' | transloco\"\n name=\"crm_source_id\" controlId=\"domain-build-crm_source_id\" [useAriaLabelledbyOnly]=\"true\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.CrmSource' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'domain-build-crm_source_id-label'\"\n [options]=\"crmSourcesList\"\n formControlName=\"crm_source_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['crm_source_id']?.errors }\"\n [placeholder]=\"'Select CRM Source'\"\n optionValue=\"id\"\n optionLabel=\"name\"\n >\n </p-select>\n </pw-input-container>\n </div>\n <!-- crm subscription fields end-->\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.Active' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.Active' | transloco\" name=\"active\" controlId=\"domain-build-active\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch size=\"small\" [attr.aria-labelledby]=\"'domain-build-active-label'\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"active\" name=\"active\"\n [ngClass]=\"{ 'is-invalid': submitted && f['active'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.IsProductDomain' | transloco\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.IsProductDomain' | transloco\"\n name=\"is_product_domain\" controlId=\"domain-build-is_product_domain\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch size=\"small\" [attr.aria-labelledby]=\"'domain-build-is_product_domain-label'\"\n uncheckedLabel=\"false\"\n checkedLabel=\"true\"\n formControlName=\"is_product_domain\"\n name=\"is_product_domain\"\n [ngClass]=\"{ 'is-invalid': submitted && f['is_product_domain'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CanRegisterOnMainPage' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.CanRegisterOnMainPage' | transloco\"\n name=\"can_register_through_main_page\" controlId=\"domain-build-can_register_through_main_page\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch size=\"small\" [attr.aria-labelledby]=\"'domain-build-can_register_through_main_page-label'\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"can_register_through_main_page\"\n name=\"can_register_through_main_page\" [ngClass]=\"{\n 'is-invalid': submitted && f['can_register_through_main_page'].errors\n }\">\n </ui-switch>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.SocialLoginEnabled' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.SocialLoginEnable' | transloco\" name=\"social_login_enabled\" controlId=\"domain-build-social_login_enabled\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch size=\"small\" [attr.aria-labelledby]=\"'domain-build-social_login_enabled-label'\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"social_login_enabled\"\n name=\"social_login_enabled\" [ngClass]=\"{ 'is-invalid': submitted && f['social_login_enabled'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.NotifyLogins' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.NotifyLogins' | transloco\" name=\"notify_logins\" controlId=\"domain-build-notify_logins\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch size=\"small\" [attr.aria-labelledby]=\"'domain-build-notify_logins-label'\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"notify_logins\"\n name=\"notify_logins\" [ngClass]=\"{ 'is-invalid': submitted && f['notify_logins'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n\n <div class=\"my-5\">\n <h3>Pre-Built Pages Config (Resources, Landing Pages, etc)</h3>\n\n <p-accordion class=\"mt-5\">\n <p-accordion-panel value=\"0\">\n <p-accordion-header>Instructions - README FIRST</p-accordion-header>\n <p-accordion-content>\n <div class=\"mb-3\">\n <p>We've built and maintain a collection of high-converting landing pages designed to help you quickly launch polished\n UIs for onboarding users.</p>\n <p><strong>Newsletter Subscription Pages:</strong><br> After configuring your domain, you can access pages like\n <strong>/join/cs1, /join/cs2, /join/cs3, etc.</strong>, specifically designed for newsletter sign-ups. <br>\n Subscribers from these pages will be listed in the <strong>SmartCRM module</strong>.</p>\n <p><strong>Trial Product Sign-Up Pages:</strong><br> For users interested in trial products, utilize pages such as\n <strong>/join/trial1, /join/trial2, /join/trial3, etc.</strong>.<br> Users registering through these pages will\n appear in the <strong>Admin > Users section</strong>.</p>\n <p>Once you've selected the landing page you want to use <strong>(e.g., /join/trial3)</strong>, make sure to update\n the <strong>Internal Path</strong> in the <strong>Core tab</strong> accordingly\u2014i.e., set it to\n <strong>/join/trial3</strong>.</p>\n <p>If you need assistance integrating these pages into your workflow or have further questions, feel free to reach\n out.</p>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n <p-accordion-panel value=\"1\">\n <p-accordion-header>Subscribe to Product/Newsletter Config</p-accordion-header>\n <p-accordion-content>\n <div class=\"mb-3\">\n <p>Trial Pages will enable users to sign up to real products and are accessible at the path /join/trial1,\n /join/trial2, etc.</p>\n <p>ComingSoon Pages will enable users to subscribe to Newsletters and are accessible at the internal paths\n /join/cs1, /join/cs2, etc.</p>\n </div>\n <!-- live page link -->\n <div class=\"text-end\" *ngIf=\"shardUrl\">\n <span>See the live page <span class=\"tooltip-wrap ms-1\" [appendTo]=\"'body'\"\n [pTooltip]=\"'Admin.DomainConfig.Tooltip.SeeLiveTrial' | transloco\" tooltipPosition=\"top\">\n <i class=\"fas fa-info-circle\"></i>\n </span> : <a [href]=\"shardUrl + '/join/trial1'\" target=\"_blank\">{{ shardUrl }}/join/trial1</a></span>\n </div>\n <div class=\"row\">\n <div class=\"col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.TrialProduct' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.TrialProduct' | transloco\" name=\"trial_product_id\" controlId=\"domain-build-trial_product_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-autoComplete [attr.aria-labelledby]=\"'domain-build-trial_product_id-label'\" [suggestions]=\"productsList\" formControlName=\"trial_product_id\" dataKey=\"id\" field=\"name\"\n [dropdown]=\"true\" [delay]=\"1000\" (completeMethod)=\"searchProduct($event)\" styleClass=\"w-100\"\n placeholder=\"Search Product\" [inputStyle]=\"\n form.get('trial_product_id').touched &&\n form.get('trial_product_id').invalid\n ? { border: '1px solid #ff586b' }\n : { border: '1px solid gray' }\n \" [multiple]=\"false\">\n </p-autoComplete>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.TrialCrmSourceId' | transloco\" name=\"trial_crm_source_id\" controlId=\"domain-build-trial_crm_source_id\" [useAriaLabelledbyOnly]=\"true\"\n [showTooltip]=\"true\" [tooltipText]=\"\n 'Admin.DomainConfig.Tooltip.TrialCrmSourceId' | transloco\n \">\n <p-select [options]=\"crmSourcesList\" [attr.aria-labelledby]=\"'domain-build-trial_crm_source_id-label'\" formControlName=\"trial_crm_source_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['trial_crm_source_id']?.errors }\"\n [placeholder]=\"'Select CRM Source'\" optionValue=\"id\" optionLabel=\"name\">\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.TrialPdfSourceId' | transloco\" name=\"trial_pdf_source_id\" controlId=\"domain-build-trial_pdf_source_id\" [useAriaLabelledbyOnly]=\"true\"\n [showTooltip]=\"true\" [tooltipText]=\"\n 'Admin.DomainConfig.Tooltip.TrialPdfSourceId' | transloco\n \">\n <p-select [options]=\"crmSourcesList\" [attr.aria-labelledby]=\"'domain-build-trial_pdf_source_id-label'\" formControlName=\"trial_pdf_source_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['trial_pdf_source_id']?.errors }\"\n [placeholder]=\"'Select CRM Source'\" optionValue=\"id\" optionLabel=\"name\">\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\"></div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.TrialVideoUrl' | transloco\" name=\"trial_video_url\" controlId=\"domain-build-trial_video_url\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.TrialVideoUrl' | transloco\">\n <input type=\"text\" id=\"domain-build-trial_video_url\" class=\"form-control\" formControlName=\"trial_video_url\"\n [ngClass]=\"{ 'is-invalid': submitted && f['trial_video_url'].errors }\" />\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.TrialBookDemoUrl' | transloco\" name=\"trial_book_demo_url\" controlId=\"domain-build-trial_book_demo_url\"\n [showTooltip]=\"true\" [tooltipText]=\"\n 'Admin.DomainConfig.Tooltip.TrialBookDemoUrl' | transloco\n \">\n <input type=\"text\" id=\"domain-build-trial_book_demo_url\" class=\"form-control\" formControlName=\"trial_book_demo_url\" [ngClass]=\"{\n 'is-invalid': submitted && f['trial_book_demo_url'].errors\n }\" />\n </pw-input-container>\n </div>\n <div class=\"col-12\">\n <pw-input-container [label]=\"'Admin.DomainConfig.TrialCtaIframe' | transloco\" name=\"trial_cta_iframe\" controlId=\"domain-build-trial_cta_iframe\"\n [showTooltip]=\"true\" [tooltipText]=\"\n 'Admin.DomainConfig.Tooltip.TrialCtaIframe' | transloco\n \">\n <textarea id=\"domain-build-trial_cta_iframe\" rows=\"3\" class=\"form-control\" formControlName=\"trial_cta_iframe\" [ngClass]=\"{\n 'is-invalid': submitted && f['trial_cta_iframe'].errors\n }\">\n </textarea>\n </pw-input-container>\n </div>\n <div class=\"col-12\">\n <pw-input-container [label]=\"'Admin.DomainConfig.TrialJoinMessage' | transloco\" name=\"trial_join_message\" controlId=\"domain-build-trial_join_message\"\n [showTooltip]=\"true\" [tooltipText]=\"\n 'Admin.DomainConfig.Tooltip.TrialJoinMessage' | transloco\n \">\n <textarea id=\"domain-build-trial_join_message\" rows=\"3\" class=\"form-control\" formControlName=\"trial_join_message\" [ngClass]=\"{\n 'is-invalid': submitted && f['trial_join_message'].errors\n }\">\n </textarea>\n </pw-input-container>\n </div>\n <div class=\"col-12\">\n <pw-input-container [label]=\"'Admin.DomainConfig.TrialPdfDownloadText' | transloco\" name=\"trial_pdf_download_text\" controlId=\"domain-build-trial_pdf_download_text\"\n [showTooltip]=\"true\" [tooltipText]=\"\n 'Admin.DomainConfig.Tooltip.TrialPdfDownloadText' | transloco\n \">\n <textarea id=\"domain-build-trial_pdf_download_text\" rows=\"3\" class=\"form-control\" formControlName=\"trial_pdf_download_text\" [ngClass]=\"{\n 'is-invalid': submitted && f['trial_pdf_download_text'].errors\n }\">\n </textarea>\n </pw-input-container>\n </div>\n </div>\n <div class=\"row\" matchHeight=\"card\">\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-trial_image-label\">{{ 'Admin.DomainConfig.TrialImage' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImage' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Trial Image'\"\n [controlName]=\"'trial_image'\" [previewData]=\"data['trial_image']\">\n </pw-custom-uploader>\n </div>\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-trial_image2-label\">{{ 'Admin.DomainConfig.TrialImage2' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImage2' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Image2'\" [aspectRatio]=\"'custom'\"\n [controlName]=\"'trial_image2'\" [previewData]=\"data['trial_image2']\">\n </pw-custom-uploader>\n </div>\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-trial_pdf_image-label\">{{ 'Admin.DomainConfig.TrialPdfImage' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialPdfImage' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Pdf Image'\" [aspectRatio]=\"'custom'\"\n [controlName]=\"'trial_pdf_image'\" [previewData]=\"data['trial_pdf_image']\">\n </pw-custom-uploader>\n </div>\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-trial_image_bg-label\">{{ 'Admin.DomainConfig.TrialImageBg' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImageBg' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Image Bg'\" [aspectRatio]=\"'custom'\"\n [controlName]=\"'trial_image_bg'\" [previewData]=\"data['trial_image_bg']\">\n </pw-custom-uploader>\n </div>\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-trial_image_bg2-label\">{{ 'Admin.DomainConfig.TrialImageBg2' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImageBg2' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Image Bg2'\" [aspectRatio]=\"'custom'\"\n [controlName]=\"'trial_image_bg2'\" [previewData]=\"data['trial_image_bg2']\">\n </pw-custom-uploader>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n <p-accordion-panel value=\"2\">\n <p-accordion-header>Header Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-4\" formGroupName=\"header\">\n <h4 class=\"mb-4\">Header Section</h4>\n\n <!-- Headline -->\n <div class=\"col-12 col-md-12\">\n <pw-input-container label=\"Header Headline\" name=\"headline\" controlId=\"domain-build-header-headline\">\n <input type=\"text\" id=\"domain-build-header-headline\" class=\"form-control\" formControlName=\"headline\" />\n </pw-input-container>\n </div>\n\n <!-- Video URL -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"Header Video URL\" name=\"video_url\" controlId=\"domain-build-header-video_url\">\n <input type=\"text\" id=\"domain-build-header-video_url\" class=\"form-control\" formControlName=\"video_url\" />\n </pw-input-container>\n </div>\n\n <!-- Background Image URL -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"Header Background Image URL\" name=\"bg_image_url\" controlId=\"domain-build-header-bg_image_url\">\n <input type=\"text\" id=\"domain-build-header-bg_image_url\" class=\"form-control\" formControlName=\"bg_image_url\" />\n </pw-input-container>\n </div>\n\n <!-- Description -->\n <div class=\"col-12\">\n <pw-input-container label=\"Header Description\" name=\"description\" controlId=\"domain-build-header-description\">\n <textarea\n id=\"domain-build-header-description\"\n class=\"form-control\"\n rows=\"5\"\n formControlName=\"description\"\n [ngClass]=\"{ 'is-invalid': submitted && f['description']?.errors }\"\n ></textarea>\n </pw-input-container>\n </div>\n\n <!-- Sub Headings -->\n <div formArrayName=\"sub_headings\" class=\"col-12\" cdkDropList (cdkDropListDropped)=\"dropItems(headerSubHeadings, $event)\">\n <div\n *ngFor=\"let sub of f['header'].get('sub_headings')['controls']; let i = index\"\n [formGroupName]=\"i\"\n class=\"row mb-3 align-items-center\"\n cdkDrag\n >\n <div class=\"col-md-10\">\n <pw-input-container label=\"Sub Header Description\" name=\"description\" [controlId]=\"'domain-build-header-sub_description-' + i\">\n <textarea\n [id]=\"'domain-build-header-sub_description-' + i\"\n class=\"form-control\"\n rows=\"3\"\n formControlName=\"description\"\n [ngClass]=\"{ 'is-invalid': submitted && f['description']?.errors }\"\n ></textarea>\n </pw-input-container>\n </div>\n\n <div class=\"col-md-1 d-flex justify-content-end mt-3\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeHeaderSubHeading(i)\"\n (keydown.enter)=\"removeHeaderSubHeading(i)\"\n (keydown.space)=\"removeHeaderSubHeading(i)\"\n ngbTooltip=\"Remove\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-md-1 d-flex justify-content-end mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addHeaderSubHeading()\">\n + Add Sub Heading\n </button>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n <p-accordion-panel value=\"3\">\n <p-accordion-header>Resources Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row row mt-4 mb-4\">\n <h4 class=\"mb-3\">Resources Section</h4>\n <div class=\"col-12 col-sm-6\">\n <pw-input-container [label]=\"'Admin.DomainConfig.ResourceTagline' | transloco\" name=\"resources_tagline\" controlId=\"domain-build-resources_tagline\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.ResourceTagline' | transloco\">\n <input type=\"text\" id=\"domain-build-resources_tagline\" class=\"form-control\" formControlName=\"resources_tagline\"\n [ngClass]=\"{ 'is-invalid': submitted && f['resources_tagline'].errors }\" />\n </pw-input-container>\n </div>\n <div class=\"col-12\">\n <pw-input-container [label]=\"'Admin.DomainConfig.ResourceDescription' | transloco\" name=\"resources_description\" controlId=\"domain-build-resources_description\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.ResourceDescription' | transloco\">\n <textarea id=\"domain-build-resources_description\" class=\"form-control\" rows=\"3\" formControlName=\"resources_description\"\n [ngClass]=\"{ 'is-invalid': submitted && f['resources_description'].errors }\">\n </textarea>\n </pw-input-container>\n </div>\n </div>\n <div class=\"row\" matchHeight=\"card\">\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-resource_image-label\">{{ 'Admin.DomainConfig.ResourceImage' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.ResourceImage' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Image'\"\n [controlName]=\"'resources_image'\" [previewData]=\"data['resources_image']\">\n </pw-custom-uploader>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n <p-accordion-panel value=\"4\">\n <p-accordion-header>Unique Selling Proposition Section (USP)</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-4 mb-4\" formGroupName=\"usps\">\n <h4 class=\"mb-4\">Unique Selling Proposition Section (USP)</h4>\n\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"USPs Title\" name=\"title\" controlId=\"domain-build-usps-title\">\n <input type=\"text\" id=\"domain-build-usps-title\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"USPs Video Url\" name=\"video_url\" controlId=\"domain-build-usps-video_url\">\n <input type=\"text\" id=\"domain-build-usps-video_url\" class=\"form-control\" formControlName=\"video_url\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12\">\n <pw-input-container label=\"USPs Description\" name=\"description\" controlId=\"domain-build-usps-description\">\n <textarea id=\"domain-build-usps-description\" class=\"form-control\" rows=\"3\" formControlName=\"description\"></textarea>\n </pw-input-container>\n </div>\n\n <!-- USP Items -->\n <div formArrayName=\"items\" class=\"col-12\" cdkDropList (cdkDropListDropped)=\"dropItems(uspsItems, $event)\">\n <div\n *ngFor=\"let item of f['usps'].get('items')['controls']; let i = index\"\n [formGroupName]=\"i\"\n class=\"row mb-3 align-items-center\"\n cdkDrag\n >\n <div class=\"col-sm-10\">\n <pw-input-container label=\"Item Description\" name=\"description\" [controlId]=\"'domain-build-usps-item-desc-' + i\">\n <textarea [id]=\"'domain-build-usps-item-desc-' + i\" class=\"form-control\" rows=\"3\" formControlName=\"description\"></textarea>\n </pw-input-container>\n </div>\n\n <div class=\"col-sm-1 d-flex justify-content-end mt-3\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeUspItem(i)\"\n (keydown.enter)=\"removeUspItem(i)\"\n (keydown.space)=\"removeUspItem(i)\"\n ngbTooltip=\"Remove\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-sm-1 d-flex justify-content-end mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addUspItem()\">\n + Add USP Item\n </button>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n <p-accordion-panel value=\"5\">\n <p-accordion-header>Partners (Clients) Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-4 mb-4\" formGroupName=\"partners\">\n <h4 class=\"mb-4\">Partners (Clients) Section</h4>\n\n <!-- Title -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"Partner Title\" name=\"title\" controlId=\"domain-build-partners-title\">\n <input type=\"text\" id=\"domain-build-partners-title\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n </div>\n\n <!-- Description -->\n <div class=\"col-12\">\n <pw-input-container label=\"Partners Description\" name=\"description\" controlId=\"domain-build-partners-description\">\n <textarea id=\"domain-build-partners-description\" class=\"form-control\" rows=\"3\" formControlName=\"description\"></textarea>\n </pw-input-container>\n </div>\n\n <!-- Partner Items with Drag Support -->\n <div formArrayName=\"items\" class=\"col-12\" cdkDropList (cdkDropListDropped)=\"dropItems(partnersItems, $event)\">\n <div\n *ngFor=\"let item of partnersItems.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row border p-3 mb-3 align-items-start\"\n cdkDrag\n >\n <!-- Name -->\n <div class=\"col-md-6\">\n <pw-input-container label=\"Name\" class=\"col-12\" name=\"name\" [controlId]=\"'domain-build-partner-name-' + i\">\n <input [id]=\"'domain-build-partner-name-' + i\" class=\"form-control\" formControlName=\"name\" />\n </pw-input-container>\n </div>\n\n <!-- Blog URL + Drag Handle -->\n <div class=\"col-md-5\">\n <pw-input-container label=\"Blog Url\" name=\"blog_url\" [controlId]=\"'domain-build-partner-blog_url-' + i\">\n <input [id]=\"'domain-build-partner-blog_url-' + i\" class=\"form-control\" formControlName=\"blog_url\" />\n </pw-input-container>\n </div>\n\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder question\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n\n <!-- Video URL -->\n <div class=\"col-md-6\">\n <pw-input-container label=\"Video Url\" name=\"video_url\" [controlId]=\"'domain-build-partner-video_url-' + i\">\n <input [id]=\"'domain-build-partner-video_url-' + i\" class=\"form-control\" formControlName=\"video_url\" />\n </pw-input-container>\n </div>\n\n <!-- Image URL -->\n <div class=\"col-md-6\">\n <pw-input-container label=\"Image Url\" name=\"image_url\" [controlId]=\"'domain-build-partner-image_url-' + i\">\n <input [id]=\"'domain-build-partner-image_url-' + i\" class=\"form-control\" formControlName=\"image_url\" />\n </pw-input-container>\n </div>\n\n <!-- Delete Icon -->\n <div class=\"col-md-12 text-end mt-2\">\n <i\n ngbTooltip=\"Remove\"\n (click)=\"removePartnerItem(i)\"\n (keydown.enter)=\"removePartnerItem(i)\"\n (keydown.space)=\"removePartnerItem(i)\"\n class=\"fa fa-trash delete-icon text-danger\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <!-- Add New Partner -->\n <div class=\"text-start mt-2\">\n <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addPartnerItem()\">+ Add Partner</button>\n </div>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n <p-accordion-panel value=\"6\">\n <p-accordion-header>Testimonials Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-3 mb-4\" formGroupName=\"testimonials\">\n <h4 class=\"mb-4\">Testimonials Section</h4>\n\n <pw-input-container label=\"Title\" class=\"col-12 col-md-6\" name=\"testimonials_title\" controlId=\"domain-build-testimonials-title\">\n <input type=\"text\" id=\"domain-build-testimonials-title\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n\n <pw-input-container label=\"Description\" class=\"col-12\" name=\"testimonials_description\" controlId=\"domain-build-testimonials-description\">\n <textarea id=\"domain-build-testimonials-description\" rows=\"3\" class=\"form-control\" formControlName=\"description\"></textarea>\n </pw-input-container>\n\n <!-- Items List -->\n <div formArrayName=\"items\" class=\"col-12 mt-3\" cdkDropList (cdkDropListDropped)=\"dropItems(testimonialsItems, $event)\">\n <div\n *ngFor=\"let item of testimonialsItems.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row border p-3 mb-3 align-items-start\"\n cdkDrag\n >\n <div class=\"col-md-6\">\n <pw-input-container label=\"Name\" name=\"name\" [controlId]=\"'domain-build-testimonial-name-' + i\">\n <input type=\"text\" [id]=\"'domain-build-testimonial-name-' + i\" class=\"form-control\" formControlName=\"name\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-md-5\">\n <pw-input-container label=\"Blog URL\" name=\"blog_url\" [controlId]=\"'domain-build-testimonial-blog_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-testimonial-blog_url-' + i\" class=\"form-control\" formControlName=\"blog_url\" />\n </pw-input-container>\n </div>\n\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder question\"\n aria-hidden=\"true\"\n ></i>\n </div>\n <pw-input-container label=\"Image URL\" class=\"col-md-6\" name=\"image_url\" [controlId]=\"'domain-build-testimonial-image_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-testimonial-image_url-' + i\" class=\"form-control\" formControlName=\"image_url\" />\n </pw-input-container>\n\n <pw-input-container label=\"Video URL\" class=\"col-md-6\" name=\"video_url\" [controlId]=\"'domain-build-testimonial-video_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-testimonial-video_url-' + i\" class=\"form-control\" formControlName=\"video_url\" />\n </pw-input-container>\n\n <pw-input-container label=\"Testimonial\" class=\"col-md-10\" name=\"testimonial\" [controlId]=\"'domain-build-testimonial-text-' + i\">\n <textarea [id]=\"'domain-build-testimonial-text-' + i\" class=\"form-control\" rows=\"3\" formControlName=\"testimonial\"></textarea>\n </pw-input-container>\n\n <div class=\"col-md-2 d-flex align-items-start mt-3\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n ngbTooltip=\"Remove\"\n (click)=\"removeTestimonialItem(i)\"\n (keydown.enter)=\"removeTestimonialItem(i)\"\n (keydown.space)=\"removeTestimonialItem(i)\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <div class=\"text-start mt-2\">\n <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addTestimonialItem()\">\n + Add Testimonial\n </button>\n </div>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n <p-accordion-panel value=\"7\">\n <p-accordion-header>Video Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-3 mb-4\" formGroupName=\"videos\">\n <h4 class=\"mb-3\">Video Section</h4>\n\n <pw-input-container label=\"Title\" class=\"col-12 col-md-6\" name=\"videos_title\" controlId=\"domain-build-videos-title\">\n <input type=\"text\" id=\"domain-build-videos-title\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n\n <pw-input-container label=\"Description\" class=\"col-12\" name=\"videos_description\" controlId=\"domain-build-videos-description\">\n <textarea id=\"domain-build-videos-description\" rows=\"3\" class=\"form-control\" formControlName=\"description\"></textarea>\n </pw-input-container>\n\n <!-- Video Items -->\n <div\n formArrayName=\"items\"\n class=\"col-12 mt-3\"\n cdkDropList\n (cdkDropListDropped)=\"dropItems(videosItems, $event)\"\n >\n <div\n *ngFor=\"let item of videosItems.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row border p-3 mb-3 align-items-start\"\n cdkDrag\n >\n <div class=\"col-md-6\">\n <pw-input-container label=\"Title\" name=\"title\" [controlId]=\"'domain-build-video-item-title-' + i\">\n <input type=\"text\" [id]=\"'domain-build-video-item-title-' + i\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-md-5\">\n <pw-input-container label=\"Blog URL\" name=\"blog_url\" [controlId]=\"'domain-build-video-item-blog_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-video-item-blog_url-' + i\" class=\"form-control\" formControlName=\"blog_url\" />\n </pw-input-container>\n </div>\n\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder question\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <pw-input-container label=\"Image URL\" class=\"col-md-6\" name=\"image_url\" [controlId]=\"'domain-build-video-item-image_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-video-item-image_url-' + i\" class=\"form-control\" formControlName=\"image_url\" />\n </pw-input-container>\n\n <pw-input-container label=\"Video URL\" class=\"col-md-6\" name=\"video_url\" [controlId]=\"'domain-build-video-item-video_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-video-item-video_url-' + i\" class=\"form-control\" formControlName=\"video_url\" />\n </pw-input-container>\n\n <pw-input-container label=\"Description\" class=\"col-md-10\" name=\"description\" [controlId]=\"'domain-build-video-item-description-' + i\">\n <textarea [id]=\"'domain-build-video-item-description-' + i\" class=\"form-control\" rows=\"3\" formControlName=\"description\"></textarea>\n </pw-input-container>\n\n <div class=\"col-md-2 d-flex align-items-start mt-3\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeVideoItem(i)\"\n (keydown.enter)=\"removeVideoItem(i)\"\n (keydown.space)=\"removeVideoItem(i)\"\n ngbTooltip=\"Remove\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <div class=\"text-start mt-2\">\n <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addVideoItem()\">\n + Add Video\n </button>\n </div>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n <p-accordion-panel value=\"8\">\n <p-accordion-header>Call to Actions Section (CTAs)</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-4 mb-4\" formGroupName=\"ctas\">\n <h4 class=\"mb-4\">CTAs Section</h4>\n\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"Title\" name=\"title\" controlId=\"domain-build-ctas-title\">\n <input type=\"text\" id=\"domain-build-ctas-title\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"Image URL\" name=\"image_url\" controlId=\"domain-build-ctas-image_url\">\n <input type=\"text\" id=\"domain-build-ctas-image_url\" class=\"form-control\" formControlName=\"image_url\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"Button Text\" name=\"button_text\" controlId=\"domain-build-ctas-button_text\">\n <input type=\"text\" id=\"domain-build-ctas-button_text\" class=\"form-control\" formControlName=\"button_text\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12\">\n <pw-input-container label=\"Description\" name=\"description\" controlId=\"domain-build-ctas-description\">\n <input type=\"text\" id=\"domain-build-ctas-description\" class=\"form-control\" formControlName=\"description\" />\n </pw-input-container>\n </div>\n\n <!-- CTA Items -->\n <div formArrayName=\"items\" class=\"col-12 mt-3\" cdkDropList (cdkDropListDropped)=\"dropItems(ctasItems, $event)\">\n <div\n *ngFor=\"let item of ctasItems.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row border p-3 mb-3 align-items-start\"\n cdkDrag\n >\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"Image URL\" name=\"image_url\" [controlId]=\"'domain-build-cta-item-image_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-cta-item-image_url-' + i\" class=\"form-control\" formControlName=\"image_url\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-md-5\">\n <pw-input-container label=\"Cta URL\" name=\"cta_url\" [controlId]=\"'domain-build-cta-item-cta_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-cta-item-cta_url-' + i\" class=\"form-control\" formControlName=\"cta_url\" />\n </pw-input-container>\n </div>\n\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder question\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"Video URL\" name=\"video_url\" [controlId]=\"'domain-build-cta-item-video_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-cta-item-video_url-' + i\" class=\"form-control\" formControlName=\"video_url\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"CTA Title\" name=\"title\" [controlId]=\"'domain-build-cta-item-title-' + i\">\n <input [id]=\"'domain-build-cta-item-title-' + i\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"CTA Description\" name=\"description\" [controlId]=\"'domain-build-cta-item-description-' + i\">\n <input [id]=\"'domain-build-cta-item-description-' + i\" class=\"form-control\" formControlName=\"description\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-5\">\n <pw-input-container label=\"Button Text\" name=\"button_text\" [controlId]=\"'domain-build-cta-item-button_text-' + i\">\n <input [id]=\"'domain-build-cta-item-button_text-' + i\" class=\"form-control\" formControlName=\"button_text\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-md-1 d-flex align-items-center mt-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"removeCtasItem(i)\"\n (keydown.enter)=\"removeCtasItem(i)\"\n (keydown.space)=\"removeCtasItem(i)\"\n ngbTooltip=\"Remove\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <div class=\"text-start mt-2\">\n <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addCtasItem()\">+ Add CTA Item</button>\n </div>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n <p-accordion-panel value=\"9\">\n <p-accordion-header>Integrations Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-3 mb-4\" formGroupName=\"integrations\">\n <h4 class=\"mb-3\">Integrations Section</h4>\n\n <pw-input-container label=\"Title\" class=\"col-12\" name=\"title\" controlId=\"domain-build-integrations-title\">\n <input type=\"text\" id=\"domain-build-integrations-title\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n\n <pw-input-container label=\"Description\" class=\"col-12\" name=\"description\" controlId=\"domain-build-integrations-description\">\n <textarea id=\"domain-build-integrations-description\" class=\"form-control\" formControlName=\"description\" rows=\"3\"></textarea>\n </pw-input-container>\n\n <div formArrayName=\"items\" class=\"col-12\" cdkDropList (cdkDropListDropped)=\"dropItems(integrationsItems, $event)\">\n <div\n *ngFor=\"let item of integrationsItems.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row border p-3 mb-3 rounded bg-light\"\n cdkDrag\n >\n <pw-input-container label=\"Title\" class=\"col-md-6\" name=\"title\" [controlId]=\"'domain-build-integration-title-' + i\">\n <input type=\"text\" [id]=\"'domain-build-integration-title-' + i\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n\n <div class=\"col-md-5\">\n <pw-input-container label=\"Description\" name=\"description\" [controlId]=\"'domain-build-integration-description-' + i\">\n <input type=\"text\" [id]=\"'domain-build-integration-description-' + i\" class=\"form-control\" formControlName=\"description\" />\n </pw-input-container>\n </div>\n\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder question\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <pw-input-container label=\"Blog URL\" class=\"col-md-6\" name=\"blog_url\" [controlId]=\"'domain-build-integration-blog_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-integration-blog_url-' + i\" class=\"form-control\" formControlName=\"blog_url\" />\n </pw-input-container>\n\n <pw-input-container label=\"Image URL\" class=\"col-md-6\" name=\"image_url\" [controlId]=\"'domain-build-integration-image_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-integration-image_url-' + i\" class=\"form-control\" formControlName=\"image_url\" />\n </pw-input-container>\n\n <pw-input-container label=\"Video URL\" class=\"col-md-6\" name=\"video_url\" [controlId]=\"'domain-build-integration-video_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-integration-video_url-' + i\" class=\"form-control\" formControlName=\"video_url\" />\n </pw-input-container>\n\n <div class=\"col-md-6 d-flex align-items-end justify-content-end\">\n <i\n class=\"fa fa-trash delete-icon align-self-center\"\n (click)=\"removeIntegrationItem(i)\"\n (keydown.enter)=\"removeIntegrationItem(i)\"\n (keydown.space)=\"removeIntegrationItem(i)\"\n ngbTooltip=\"Remove\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <div class=\"text-start mt-2\">\n <button type=\"button\" class=\"btn btn-primary\" (click)=\"addIntegrationItem()\">+ Add Integration</button>\n </div>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n <p-accordion-panel value=\"10\">\n <p-accordion-header>Contact Us Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-3 mb-4\" formGroupName=\"contact_us\">\n <h4 class=\"mb-3\">Contact Us Section</h4>\n\n <pw-input-container label=\"Url\" class=\"col-md-6\" name=\"url\" controlId=\"domain-build-contact_us-url\">\n <input type=\"text\" id=\"domain-build-contact_us-url\" class=\"form-control\" formControlName=\"url\" />\n </pw-input-container>\n <pw-input-container label=\"Description\" class=\"col-12\" name=\"contact_us_description\" controlId=\"domain-build-contact_us-description\">\n <textarea id=\"domain-build-contact_us-description\" rows=\"3\" class=\"form-control\" formControlName=\"description\"></textarea>\n </pw-input-container>\n\n <div formArrayName=\"questions\" class=\"col-12 mt-3\" cdkDropList (cdkDropListDropped)=\"dropItems(contactUsQuestions, $event)\">\n <div\n *ngFor=\"let questionGroup of contactUsQuestions.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row border p-3 mb-3\"\n cdkDrag\n >\n <pw-input-container label=\"Question\" class=\"col-md-10\" name=\"question\" [controlId]=\"'domain-build-contact_us-question-' + i\">\n <input type=\"text\" [id]=\"'domain-build-contact_us-question-' + i\" class=\"form-control\" formControlName=\"question\" />\n </pw-input-container>\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeContactUsQuestion(i)\"\n (keydown.enter)=\"removeContactUsQuestion(i)\"\n (keydown.space)=\"removeContactUsQuestion(i)\"\n ngbTooltip=\"Remove\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder question\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-12 mt-3\" formArrayName=\"options\" cdkDropList [cdkDropListData]=\"getQuestionOptions(i).controls\" (cdkDropListDropped)=\"dropContactUsOptions(i, $event)\">\n <div\n class=\"row align-items-center mb-2 border p-3\"\n *ngFor=\"let option of getQuestionOptions(i).controls; let j = index\"\n [formGroupName]=\"j\"\n cdkDrag\n >\n <pw-input-container label=\"Option\" class=\"col-md-10\" name=\"option\" [controlId]=\"'domain-build-contact_us-option-' + i + '-' + j\">\n <input type=\"text\" [id]=\"'domain-build-contact_us-option-' + i + '-' + j\" class=\"form-control\" formControlName=\"option\" />\n </pw-input-container>\n\n <div class=\"col-md-1 d-flex justify-content-end mt-3\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeContactUsOption(i, j)\"\n (keydown.enter)=\"removeContactUsOption(i, j)\"\n (keydown.space)=\"removeContactUsOption(i, j)\"\n ngbTooltip=\"Remove Option\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-md-1 d-flex justify-content-end mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder option\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <div class=\"text-start\">\n <button type=\"button\" class=\"btn btn-primary btn-sm\" (click)=\"addContactUsOption(i)\">\n + Add Option\n </button>\n </div>\n </div>\n </div>\n\n <div class=\"text-start mt-3\">\n <button type=\"button\" class=\"btn btn-primary\" (click)=\"addContactUsQuestion()\">\n + Add Question\n </button>\n </div>\n </div>\n\n <div formArrayName=\"hubspot\" class=\"col-12 mt-4\" cdkDropList (cdkDropListDropped)=\"dropItems(contactUsHubspotItems, $event)\">\n <h5 class=\"mb-4\">Hubspot Embeds</h5>\n\n <div\n *ngFor=\"let hub of contactUsHubspotItems.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row border p-3 mb-2\"\n cdkDrag\n >\n <pw-input-container label=\"ID\" class=\"col-md-5\" name=\"id\" [controlId]=\"'domain-build-hubspot-id-' + i\">\n <input type=\"text\" [id]=\"'domain-build-hubspot-id-' + i\" class=\"form-control\" formControlName=\"id\" />\n </pw-input-container>\n\n <pw-input-container label=\"Position\" class=\"col-md-6\" name=\"position\" [controlId]=\"'domain-build-hubspot-position-' + i\">\n <input type=\"text\" [id]=\"'domain-build-hubspot-position-' + i\" class=\"form-control\" formControlName=\"position\" />\n </pw-input-container>\n <div class=\"col-md-1 d-flex align-items-start justify-content-end mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <pw-input-container label=\"Div\" class=\"col-10\" name=\"div\" [controlId]=\"'domain-build-hubspot-div-' + i\">\n <textarea\n [id]=\"'domain-build-hubspot-div-' + i\"\n class=\"form-control\"\n rows=\"5\"\n formControlName=\"div\"\n [ngClass]=\"{ 'is-invalid': submitted && f['div']?.errors }\"\n ></textarea>\n </pw-input-container>\n\n <div class=\"col-md-2 d-flex align-items-center mt-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"removeHubspotItem(i)\"\n (keydown.enter)=\"removeHubspotItem(i)\"\n (keydown.space)=\"removeHubspotItem(i)\"\n ngbTooltip=\"Remove Hubspot Embed\"\n aria-hidden=\"true\">\n</i>\n </div>\n </div>\n\n <div class=\"text-start mt-2\">\n <button type=\"button\" class=\"btn btn-primary btn-sm\" (click)=\"addHubspotItem()\">\n + Add Hubspot Embed\n </button>\n </div>\n </div>\n\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n <p-accordion-panel value=\"11\">\n <p-accordion-header>Book a Demo Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-4\">\n <div class=\"col-12\">\n <h4 class=\"mb-3\">{{ 'Admin.DomainConfig.BookDemoLinks' | transloco }}</h4>\n <div formGroupName=\"book_demo\">\n <pw-input-container label=\"Title\" name=\"title\" controlId=\"domain-build-book_demo-title\">\n <input type=\"text\" id=\"domain-build-book_demo-title\" formControlName=\"title\" class=\"form-control\" />\n </pw-input-container>\n\n <pw-input-container label=\"Description\" name=\"description\" controlId=\"domain-build-book_demo-description\">\n <input type=\"text\" id=\"domain-build-book_demo-description\" formControlName=\"description\" class=\"form-control\" />\n </pw-input-container>\n\n <div formArrayName=\"items\" cdkDropList (cdkDropListDropped)=\"dropBookDemoLinks($event)\">\n <div\n *ngFor=\"let link of f['book_demo'].get('items')['controls']; let i = index\"\n [formGroupName]=\"i\"\n class=\"row mb-3 border p-3 align-items-center\"\n cdkDrag\n >\n <div class=\"col-sm-5\">\n <pw-input-container label=\"Link Title\" name=\"title\" [controlId]=\"'domain-build-book_demo-link-title-' + i\">\n <input type=\"text\" [id]=\"'domain-build-book_demo-link-title-' + i\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-sm-5\">\n <pw-input-container label=\"Link URL\" name=\"url\" [controlId]=\"'domain-build-book_demo-link-url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-book_demo-link-url-' + i\" class=\"form-control\" formControlName=\"url\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-sm-1 d-flex justify-content-end mt-3\">\n <i\n ngbTooltip=\"Remove\"\n (click)=\"removeBookDemoLink(i)\"\n (keydown.enter)=\"removeBookDemoLink(i)\"\n (keydown.space)=\"removeBookDemoLink(i)\"\n class=\"fa fa-trash delete-icon text-danger\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-sm-1 d-flex justify-content-end mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addBookDemoLink()\">\n + Add Book Demo Link\n </button>\n </div>\n </div>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n <p-accordion-panel value=\"12\">\n <p-accordion-header>Navbar Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-3 mb-4\" formGroupName=\"navbar\">\n <h4 class=\"mb-3\">Navbar Section</h4>\n\n <div formArrayName=\"items\" class=\"col-12\" cdkDropList (cdkDropListDropped)=\"dropItems(navbarItems, $event)\">\n <div\n *ngFor=\"let item of navbarItems.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row mb-3\"\n cdkDrag\n >\n <div class=\"row align-items-center\">\n <pw-input-container label=\"Title\" class=\"col-md-5\" name=\"title\" [controlId]=\"'domain-build-navbar-title-' + i\">\n <input type=\"text\" [id]=\"'domain-build-navbar-title-' + i\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n\n <pw-input-container label=\"Path\" class=\"col-md-5\" name=\"path\" [controlId]=\"'domain-build-navbar-path-' + i\">\n <input type=\"text\" [id]=\"'domain-build-navbar-path-' + i\" class=\"form-control\" formControlName=\"path\" />\n </pw-input-container>\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-1\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeNavbarItem(i)\"\n (keydown.enter)=\"removeNavbarItem(i)\"\n (keydown.space)=\"removeNavbarItem(i)\"\n ngbTooltip=\"Remove Navbar Item\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-1\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <div\n class=\"col-12 mt-3\"\n formArrayName=\"subtitles\"\n cdkDropList\n [cdkDropListData]=\"getNavbarSubtitles(i).controls\"\n (cdkDropListDropped)=\"dropNavbarSubtitles(i, $event)\"\n >\n <div\n *ngFor=\"let sub of getNavbarSubtitles(i).controls; let j = index\"\n [formGroupName]=\"j\"\n class=\"row border p-3 mb-2 align-items-center\"\n cdkDrag\n >\n <div class=\"col-md-5\">\n <pw-input-container label=\"Subtitle Title\" name=\"title\" [controlId]=\"'domain-build-navbar-subtitle-title-' + i + '-' + j\">\n <input type=\"text\" [id]=\"'domain-build-navbar-subtitle-title-' + i + '-' + j\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-md-5\">\n <pw-input-container label=\"Subtitle Path\" name=\"path\" [controlId]=\"'domain-build-navbar-subtitle-path-' + i + '-' + j\">\n <input type=\"text\" [id]=\"'domain-build-navbar-subtitle-path-' + i + '-' + j\" class=\"form-control\" formControlName=\"path\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-2\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeSubtitle(i, j)\"\n (keydown.enter)=\"removeSubtitle(i, j)\"\n (keydown.space)=\"removeSubtitle(i, j)\"\n ngbTooltip=\"Remove Subtitle\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-md-1 d-flex justify-content-end\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder subtitle\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <button type=\"button\" class=\"btn btn-sm btn-primary mt-2\" (click)=\"addSubtitle(i)\">\n + Add Subtitle\n </button>\n </div>\n </div>\n\n <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addNavbarItem()\">\n + Add Navbar Item\n </button>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n <p-accordion-panel value=\"13\">\n <p-accordion-header>Footer Links Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-3 mb-4\" formGroupName=\"footer_links\">\n <h4 class=\"mb-3\">Footer Links Section</h4>\n\n <div\n formArrayName=\"items\"\n class=\"col-12\"\n cdkDropList\n (cdkDropListDropped)=\"dropItems(footerLinksItems, $event)\"\n >\n <div\n *ngFor=\"let item of footerLinksItems.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row mb-3\"\n cdkDrag\n >\n <div class=\"row align-items-center\">\n\n <pw-input-container label=\"Title\" class=\"col-md-5\" name=\"title\" [controlId]=\"'domain-build-footer-title-' + i\">\n <input type=\"text\" [id]=\"'domain-build-footer-title-' + i\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n\n <pw-input-container label=\"Path\" class=\"col-md-5\" name=\"path\" [controlId]=\"'domain-build-footer-path-' + i\">\n <input type=\"text\" [id]=\"'domain-build-footer-path-' + i\" class=\"form-control\" formControlName=\"path\" />\n </pw-input-container>\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-1\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeFooterLinkItem(i)\"\n (keydown.enter)=\"removeFooterLinkItem(i)\"\n (keydown.space)=\"removeFooterLinkItem(i)\"\n ngbTooltip=\"Remove Footer Item\"\n aria-hidden=\"true\"\n ></i>\n </div>\n <div class=\"col-md-1 d-flex align-items-start justify-content-end mt-1\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n </div>\n\n <div\n class=\"col-12 mt-3\"\n formArrayName=\"subtitles\"\n cdkDropList\n [cdkDropListData]=\"getFooterSubtitles(i).controls\"\n (cdkDropListDropped)=\"dropFooterSubtitles(i, $event)\"\n >\n <div\n *ngFor=\"let sub of getFooterSubtitles(i).controls; let j = index\"\n [formGroupName]=\"j\"\n class=\"row border p-3 mb-2 align-items-center\"\n cdkDrag\n >\n\n <div class=\"col-md-5\">\n <pw-input-container label=\"Subtitle Title\" name=\"title\" [controlId]=\"'domain-build-footer-subtitle-title-' + i + '-' + j\">\n <input type=\"text\" [id]=\"'domain-build-footer-subtitle-title-' + i + '-' + j\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-md-5\">\n <pw-input-container label=\"Subtitle Path\" name=\"path\" [controlId]=\"'domain-build-footer-subtitle-path-' + i + '-' + j\">\n <input type=\"text\" [id]=\"'domain-build-footer-subtitle-path-' + i + '-' + j\" class=\"form-control\" formControlName=\"path\" />\n </pw-input-container>\n </div>\n\n\n\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-2\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeFooterSubtitle(i, j)\"\n (keydown.enter)=\"removeFooterSubtitle(i, j)\"\n (keydown.space)=\"removeFooterSubtitle(i, j)\"\n ngbTooltip=\"Remove Subtitle\"\n aria-hidden=\"true\"\n ></i>\n </div>\n <div class=\"col-md-1 d-flex justify-content-end\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder subtitle\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <button\n type=\"button\"\n class=\"btn btn-sm btn-primary mt-2\"\n (click)=\"addFooterSubtitle(i)\"\n >\n + Add Subtitle\n </button>\n </div>\n </div>\n\n <button\n type=\"button\"\n class=\"btn btn-primary mt-2 mb-2\"\n (click)=\"addFooterLinkItem()\"\n >\n + Add Footer Link\n </button>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n\n\n\n <p-accordion-panel value=\"14\">\n <p-accordion-header>Guides Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-3 mb-4\" formGroupName=\"guides\">\n <h4 class=\"mb-3\">Guides Section</h4>\n\n <div formArrayName=\"items\" class=\"col-12\">\n <div cdkDropList (cdkDropListDropped)=\"dropItems(guidesItems, $event)\">\n <div\n *ngFor=\"let item of guidesItems.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"border p-3 mb-3\"\n cdkDrag\n >\n <div class=\"row align-items-start\">\n\n <pw-input-container label=\"Title\" class=\"col-md-5\" name=\"title\" [controlId]=\"'domain-build-guide-title-' + i\">\n <input type=\"text\" [id]=\"'domain-build-guide-title-' + i\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n\n <pw-input-container label=\"Button Text\" class=\"col-md-6\" name=\"button_text\" [controlId]=\"'domain-build-guide-button_text-' + i\">\n <input type=\"text\" [id]=\"'domain-build-guide-button_text-' + i\" class=\"form-control\" formControlName=\"button_text\" />\n </pw-input-container>\n <div class=\"col-md-1 d-flex align-items-start justify-content-end mt-1\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <div class=\"row mt-2\">\n <pw-input-container label=\"Image URL\" class=\"col-md-6\" name=\"image_url\" [controlId]=\"'domain-build-guide-image_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-guide-image_url-' + i\" class=\"form-control\" formControlName=\"image_url\" />\n </pw-input-container>\n\n <pw-input-container label=\"Guide URL\" class=\"col-md-6\" name=\"guide_url\" [controlId]=\"'domain-build-guide-guide_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-guide-guide_url-' + i\" class=\"form-control\" formControlName=\"guide_url\" />\n </pw-input-container>\n </div>\n\n <div class=\"row mt-2\">\n <pw-input-container label=\"Description\" class=\"col-md-11\" name=\"description\" [controlId]=\"'domain-build-guide-description-' + i\">\n <textarea\n [id]=\"'domain-build-guide-description-' + i\"\n class=\"form-control\"\n rows=\"5\"\n formControlName=\"description\"\n [ngClass]=\"{ 'is-invalid': submitted && f['description']?.errors }\"\n ></textarea>\n </pw-input-container>\n\n <div class=\"col-md-1 d-flex align-items-start justify-content-center mt-3\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeGuideItem(i)\"\n (keydown.enter)=\"removeGuideItem(i)\"\n (keydown.space)=\"removeGuideItem(i)\"\n ngbTooltip=\"Remove Guide\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"text-start mt-2\">\n <button type=\"button\" class=\"btn btn-primary\" (click)=\"addGuideItem()\">\n + Add Guide\n </button>\n </div>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n\n <p-accordion-panel value=\"15\">\n <p-accordion-header>AB Tests Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-3 mb-4\">\n <h4 class=\"mb-3\">AB Tests</h4>\n <div formArrayName=\"ab_tests\" class=\"col-12\" cdkDropList (cdkDropListDropped)=\"dropItems(abTests, $event)\">\n <div\n *ngFor=\"let abTest of abTests.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row mb-3 border p-3\"\n cdkDrag\n >\n <pw-input-container label=\"Description\" class=\"col-md-5\" name=\"description\" [controlId]=\"'domain-build-ab_test-description-' + i\">\n <input type=\"text\" [id]=\"'domain-build-ab_test-description-' + i\" class=\"form-control\" formControlName=\"description\" />\n </pw-input-container>\n\n <pw-input-container label=\"Experiment Name\" class=\"col-md-6\" name=\"experiment_name\" [controlId]=\"'domain-build-ab_test-experiment_name-' + i\">\n <input type=\"text\" [id]=\"'domain-build-ab_test-experiment_name-' + i\" class=\"form-control\" formControlName=\"experiment_name\" />\n </pw-input-container>\n\n\n <div class=\"col-md-1 d-flex align-items-start justify-content-end mt-1\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <pw-input-container label=\"DB Shard\" class=\"col-md-6\" name=\"db_shard\" [controlId]=\"'domain-build-ab_test-db_shard-' + i\">\n <input type=\"text\" [id]=\"'domain-build-ab_test-db_shard-' + i\" class=\"form-control\" formControlName=\"db_shard\" />\n </pw-input-container>\n\n <pw-input-container label=\"Microservice Name\" class=\"col-md-6\" name=\"microservice_name\" [controlId]=\"'domain-build-ab_test-microservice_name-' + i\">\n <input type=\"text\" [id]=\"'domain-build-ab_test-microservice_name-' + i\" class=\"form-control\" formControlName=\"microservice_name\" />\n </pw-input-container>\n\n <div class=\"col-md-12 text-end mt-2\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeAbTest(i)\"\n (keydown.enter)=\"removeAbTest(i)\"\n (keydown.space)=\"removeAbTest(i)\"\n ngbTooltip=\"Remove AB Test\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <div class=\"text-start mt-2\">\n <button type=\"button\" class=\"btn btn-primary\" (click)=\"addAbTest()\">+ Add AB Test</button>\n </div>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n\n\n\n <p-accordion-panel value=\"16\">\n <p-accordion-header>Coming soon pages - Subscribe to newsletter (TO DISCONTINUE)</p-accordion-header>\n <p-accordion-content>\n <div class=\"mb-3\">\n <p>ComingSoon Pages will enable users to subscribe to Newsletters and are accessible at the internal paths\n /join/cs1, /join/cs2, etc.</p>\n </div>\n <div class=\"text-end\" *ngIf=\"shardUrl\">\n <span>See the live page <span class=\"tooltip-wrap ms-1\" [appendTo]=\"'body'\"\n [pTooltip]=\"'Admin.DomainConfig.Tooltip.SeeLiveCs' | transloco\" tooltipPosition=\"top\">\n <i class=\"fas fa-info-circle\"></i>\n </span> : <a [href]=\"shardUrl + '/join/cs1'\" target=\"_blank\">{{ shardUrl }}/join/cs1</a></span>\n </div>\n <div class=\"row\">\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CsProduct' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsProduct' | transloco\" name=\"cs_product_id\" controlId=\"domain-build-cs_product_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-autoComplete [attr.aria-labelledby]=\"'domain-build-cs_product_id-label'\" [suggestions]=\"productsList\" formControlName=\"cs_product_id\" dataKey=\"id\" field=\"name\"\n [dropdown]=\"true\" [delay]=\"1000\" (completeMethod)=\"searchProduct($event)\" styleClass=\"w-100\"\n placeholder=\"Search Product\" [inputStyle]=\"\n form.get('cs_product_id').touched &&\n form.get('cs_product_id').invalid\n ? { border: '1px solid #ff586b' }\n : { border: '1px solid gray' }\n \" [multiple]=\"false\">\n </p-autoComplete>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CsCrmSourceId' | transloco\" name=\"cs_crm_source_id\" controlId=\"domain-build-cs_crm_source_id\" [useAriaLabelledbyOnly]=\"true\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsCrmSourceId' | transloco\">\n <p-select [options]=\"crmSourcesList\" [attr.aria-labelledby]=\"'domain-build-cs_crm_source_id-label'\" formControlName=\"cs_crm_source_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['cs_crm_source_id']?.errors }\" [placeholder]=\"'Select CRM Source'\"\n optionValue=\"id\" optionLabel=\"name\">\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CsPdfSourceId' | transloco\" name=\"cs_pdf_source_id\" controlId=\"domain-build-cs_pdf_source_id\" [useAriaLabelledbyOnly]=\"true\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsPdfSourceId' | transloco\">\n <p-select [options]=\"crmSourcesList\" [attr.aria-labelledby]=\"'domain-build-cs_pdf_source_id-label'\" formControlName=\"cs_pdf_source_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['cs_pdf_source_id']?.errors }\" [placeholder]=\"'Select CRM Source'\"\n optionValue=\"id\" optionLabel=\"name\">\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\"></div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CsVideoUrl' | transloco\" name=\"cs_video_url\" controlId=\"domain-build-cs_video_url\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsVideoUrl' | transloco\">\n <input type=\"text\" id=\"domain-build-cs_video_url\" class=\"form-control\" formControlName=\"cs_video_url\"\n [ngClass]=\"{ 'is-invalid': submitted && f['cs_video_url'].errors }\" />\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CsBookDemoUrl' | transloco\" name=\"cs_book_demo_url\" controlId=\"domain-build-cs_book_demo_url\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsBookDemoUrl' | transloco\">\n <input type=\"text\" id=\"domain-build-cs_book_demo_url\" class=\"form-control\" formControlName=\"cs_book_demo_url\"\n [ngClass]=\"{ 'is-invalid': submitted && f['cs_book_demo_url'].errors }\" />\n </pw-input-container>\n </div>\n <div class=\"col-12\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CsCtaIframe' | transloco\" name=\"cs_cta_iframe\" controlId=\"domain-build-cs_cta_iframe\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsCtaIframe' | transloco\">\n <textarea id=\"domain-build-cs_cta_iframe\" class=\"form-control\" rows=\"3\" formControlName=\"cs_cta_iframe\"\n [ngClass]=\"{ 'is-invalid': submitted && f['cs_cta_iframe'].errors }\">\n </textarea>\n </pw-input-container>\n </div>\n <div class=\"col-12\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CsJoinMessage' | transloco\" name=\"cs_join_message\" controlId=\"domain-build-cs_join_message\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsJoinMessage' | transloco\">\n <textarea id=\"domain-build-cs_join_message\" class=\"form-control\" rows=\"3\" formControlName=\"cs_join_message\"\n [ngClass]=\"{ 'is-invalid': submitted && f['cs_join_message'].errors }\">\n </textarea>\n </pw-input-container>\n </div>\n <div class=\"col-12\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CsPdfDownloadText' | transloco\" name=\"cs_pdf_download_text\" controlId=\"domain-build-cs_pdf_download_text\"\n [showTooltip]=\"true\" [tooltipText]=\"\n 'Admin.DomainConfig.Tooltip.CsPdfDownloadText' | transloco\n \">\n <textarea id=\"domain-build-cs_pdf_download_text\" class=\"form-control\" rows=\"3\" formControlName=\"cs_pdf_download_text\" [ngClass]=\"{\n 'is-invalid': submitted && f['cs_pdf_download_text'].errors\n }\">\n </textarea>\n </pw-input-container>\n </div>\n </div>\n <div class=\"row\" matchHeight=\"card\">\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-cs_image-label\">{{ 'Admin.DomainConfig.CsImage' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImage' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Image'\"\n [controlName]=\"'cs_image'\" [previewData]=\"data['cs_image']\">\n </pw-custom-uploader>\n </div>\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-cs_image2-label\">{{ 'Admin.DomainConfig.CsImage2' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImage2' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Image2'\"\n [controlName]=\"'cs_image2'\" [previewData]=\"data['cs_image2']\">\n </pw-custom-uploader>\n </div>\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-cs_pdf_image-label\">{{ 'Admin.DomainConfig.CsPdfImage' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsPdfImage' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Pdf Image'\"\n [controlName]=\"'cs_pdf_image'\" [previewData]=\"data['cs_pdf_image']\">\n </pw-custom-uploader>\n </div>\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-cs_image_bg-label\">{{ 'Admin.DomainConfig.CsImageBg' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImageBg' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Pdf Image Bg'\"\n [controlName]=\"'cs_image_bg'\" [previewData]=\"data['cs_image_bg']\">\n </pw-custom-uploader>\n </div>\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-cs_image_bg2-label\">{{ 'Admin.DomainConfig.CsImageBg2' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImageBg2' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Pdf Image Bg2'\"\n [controlName]=\"'cs_image_bg2'\" [previewData]=\"data['cs_image_bg2']\">\n </pw-custom-uploader>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n </p-accordion>\n </div>\n\n <div class=\"col-12 text-end mt-3\">\n <button type=\"button\"\n class=\"btn btn-outline-default me-2\"\n (click)=\"back()\">\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button type=\"submit\" [buttonBusy]=\"buttonBusy\"\n class=\"btn btn-primary\">{{ 'Button.Submit' | transloco }}</button>\n </div>\n </form>\n</ng-container>\n<div *ngIf=\"!data?.host_name && !isLoading\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Admin.DomainConfig.EnableConfigTab' | transloco\"> </pw-no-data>\n</div>\n\n\n<ng-template #partnerCropper let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Upload Partner Image</h5>\n <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n </div>\n <div class=\"modal-body\">\n <small>You can upload JPG, PNG, or GIF files. Avoid images with celebrities, nudity, or artwork.</small>\n <pw-image-cropper\n aspectRatio=\"auto\"\n (imageSelectionEvent)=\"onPartnerImageSelected($event)\"\n (closeEvent)=\"onClosePartnerModal()\"\n ></pw-image-cropper>\n </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i3$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i4$2.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: i7.Accordion, selector: "p-accordion", inputs: ["value", "multiple", "style", "styleClass", "expandIcon", "collapseIcon", "selectOnFocus", "transitionOptions", "activeIndex", "headerAriaLevel"], outputs: ["valueChange", "activeIndexChange", "onClose", "onOpen"] }, { kind: "component", type: i7.AccordionPanel, selector: "p-accordion-panel, p-accordionpanel", inputs: ["value", "disabled"], outputs: ["valueChange"] }, { kind: "component", type: i7.AccordionHeader, selector: "p-accordion-header, p-accordionheader" }, { kind: "component", type: i7.AccordionContent, selector: "p-accordion-content, p-accordioncontent" }, { kind: "component", type: i5$1.AutoComplete, selector: "p-autoComplete, p-autocomplete, p-auto-complete", inputs: ["minLength", "delay", "style", "panelStyle", "styleClass", "panelStyleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "readonly", "disabled", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "maxlength", "name", "required", "size", "appendTo", "autoHighlight", "forceSelection", "type", "autoZIndex", "baseZIndex", "ariaLabel", "dropdownAriaLabel", "ariaLabelledBy", "dropdownIcon", "unique", "group", "completeOnFocus", "showClear", "field", "dropdown", "showEmptyMessage", "dropdownMode", "multiple", "tabindex", "dataKey", "emptyMessage", "showTransitionOptions", "hideTransitionOptions", "autofocus", "autocomplete", "optionGroupChildren", "optionGroupLabel", "overlayOptions", "suggestions", "itemSize", "optionLabel", "optionValue", "id", "searchMessage", "emptySelectionMessage", "selectionMessage", "autoOptionFocus", "selectOnFocus", "searchLocale", "optionDisabled", "focusOnHover", "typeahead", "variant", "fluid"], outputs: ["completeMethod", "onSelect", "onUnselect", "onFocus", "onBlur", "onDropdownClick", "onClear", "onKeyUp", "onShow", "onHide", "onLazyLoad"] }, { kind: "component", type: i3.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "size", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "fluid", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: i2$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i4.UiSwitchComponent, selector: "ui-switch", inputs: ["size", "color", "switchOffColor", "switchColor", "defaultBgColor", "defaultBoColor", "checkedLabel", "uncheckedLabel", "checkedTextColor", "uncheckedTextColor", "beforeChange", "ariaLabel", "checked", "disabled", "reverse", "loading"], outputs: ["change", "changeEvent", "valueChange"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i13.ProfileImageCropperComponent, selector: "pw-image-cropper", inputs: ["aspectRatio", "dynamicData"], outputs: ["imageSelectionEvent", "closeEvent", "fileChangeEvent"] }, { kind: "component", type: i13.CustomUploaderComponent, selector: "pw-custom-uploader", inputs: ["controlName", "previewData", "aspectRatio", "title"], outputs: ["saveEvent"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "controlId", "useAriaLabelledbyOnly", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "component", type: i1$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i15.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i15.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i15.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "directive", type: i10.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i3$2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i3$2.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
|
|
1386
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: DomainConfigBuildComponent, isStandalone: false, selector: "pw-domain-config-build", viewQueries: [{ propertyName: "partnerCropper", first: true, predicate: ["partnerCropper"], descendants: true }, { propertyName: "uploader", predicate: CustomUploaderComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<h3>Public Pages Configuration</h3>\n<div class=\"mb-4\">\n <p> The following parameters and settings will be applied to all public pages of this domain. </p>\n</div>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"isLoading\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<ng-container *ngIf=\"!isLoading && data?.host_name\">\n <form [formGroup]=\"form\"\n (ngSubmit)=\"onSave()\">\n <div class=\"row\">\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.MasterSubscription' | transloco\"\n name=\"master_subscription_id\" controlId=\"domain-build-master_subscription_id\" [useAriaLabelledbyOnly]=\"true\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.MasterSubscription' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'domain-build-master_subscription_id-label'\"\n [options]=\"masterSubscriptionsList\"\n formControlName=\"master_subscription_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['master_subscription_id']?.errors }\"\n placeholder=\"Select Master Subscription\">\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.MasterSubscriptionProduct' | transloco\"\n [showTooltip]=\"true\"\n [tooltipText]=\"\n 'Admin.DomainConfig.Tooltip.MasterSubscriptionProduct' | transloco\n \"\n name=\"master_subscription_product_id\" controlId=\"domain-build-master_subscription_product_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'domain-build-master_subscription_product_id-label'\"\n [options]=\"masterSubscriptionProductList\"\n formControlName=\"master_subscription_product_id\"\n [ngClass]=\"{'is-invalid': submitted && f['master_subscription_product_id']?.errors}\"\n [placeholder]=\"'Select Master Product'\"\n optionValue=\"id\"\n optionLabel=\"name\"\n >\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.BlogFeatureKey' | transloco\"\n name=\"blog_feature_key\" controlId=\"domain-build-blog_feature_key\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.BlogFeatureKey' | transloco\">\n <input type=\"text\"\n id=\"domain-build-blog_feature_key\"\n class=\"form-control\"\n formControlName=\"blog_feature_key\"\n [ngClass]=\"{ 'is-invalid': submitted && f['blog_feature_key'].errors }\" />\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.MainTos' | transloco\"\n name=\"main_tos_id\" controlId=\"domain-build-main_tos_id\" [useAriaLabelledbyOnly]=\"true\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.MainTos' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'domain-build-main_tos_id-label'\"\n [options]=\"subscriptionTosList\"\n formControlName=\"main_tos_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['main_tos_id']?.errors }\"\n [placeholder]=\"'Select Main TOS'\"\n optionValue=\"id\">\n <ng-template pTemplate=\"selectedItem\" let-item>\n <span [innerHTML]=\"item.title\"></span>\n </ng-template>\n <ng-template pTemplate=\"item\" let-item>\n <span [innerHTML]=\"item.title\"></span>\n </ng-template>\n </p-select>\n\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CrmSubscription' | transloco\"\n name=\"crm_subscription_id\" controlId=\"domain-build-crm_subscription_id\" [useAriaLabelledbyOnly]=\"true\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.CrmSubscription' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'domain-build-crm_subscription_id-label'\"\n [options]=\"crmSubscriptionsList\"\n formControlName=\"crm_subscription_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['crm_subscription_id']?.errors }\"\n [placeholder]=\"'Select CRM Subscription'\"\n optionValue=\"id\">\n <ng-template pTemplate=\"selectedItem\" let-item>\n {{item?.organisation ? item?.organisation + ' - ' + item.contact_name : item?.contact_name}}\n </ng-template>\n <ng-template pTemplate=\"item\" let-item>\n {{item?.organisation ? item?.organisation + ' - ' + item.contact_name : item?.contact_name}}\n </ng-template>\n </p-select>\n\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CrmProduct' | transloco\"\n name=\"crm_product_id\" controlId=\"domain-build-crm_product_id\" [useAriaLabelledbyOnly]=\"true\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.CrmProduct' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'domain-build-crm_product_id-label'\"\n [options]=\"crmProductList\"\n formControlName=\"crm_product_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['crm_product_id']?.errors }\"\n [placeholder]=\"'Select CRM Product'\"\n optionValue=\"id\"\n >\n <ng-template pTemplate=\"selectedItem\" let-item>\n {{item?.subscription_id ? item?.name +' - SubscriptionID = '+ item.subscription_id : item?.name}}\n </ng-template>\n <ng-template pTemplate=\"item\" let-item>\n {{item?.subscription_id ? item?.name +' - SubscriptionID = '+ item.subscription_id : item?.name}}\n </ng-template>\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CrmSource' | transloco\"\n name=\"crm_source_id\" controlId=\"domain-build-crm_source_id\" [useAriaLabelledbyOnly]=\"true\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.CrmSource' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'domain-build-crm_source_id-label'\"\n [options]=\"crmSourcesList\"\n formControlName=\"crm_source_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['crm_source_id']?.errors }\"\n [placeholder]=\"'Select CRM Source'\"\n optionValue=\"id\"\n optionLabel=\"name\"\n >\n </p-select>\n </pw-input-container>\n </div>\n <!-- crm subscription fields end-->\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.Active' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.Active' | transloco\" name=\"active\" controlId=\"domain-build-active\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch size=\"small\" [attr.aria-labelledby]=\"'domain-build-active-label'\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"active\" name=\"active\"\n [ngClass]=\"{ 'is-invalid': submitted && f['active'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.IsProductDomain' | transloco\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.IsProductDomain' | transloco\"\n name=\"is_product_domain\" controlId=\"domain-build-is_product_domain\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch size=\"small\" [attr.aria-labelledby]=\"'domain-build-is_product_domain-label'\"\n uncheckedLabel=\"false\"\n checkedLabel=\"true\"\n formControlName=\"is_product_domain\"\n name=\"is_product_domain\"\n [ngClass]=\"{ 'is-invalid': submitted && f['is_product_domain'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CanRegisterOnMainPage' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.CanRegisterOnMainPage' | transloco\"\n name=\"can_register_through_main_page\" controlId=\"domain-build-can_register_through_main_page\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch size=\"small\" [attr.aria-labelledby]=\"'domain-build-can_register_through_main_page-label'\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"can_register_through_main_page\"\n name=\"can_register_through_main_page\" [ngClass]=\"{\n 'is-invalid': submitted && f['can_register_through_main_page'].errors\n }\">\n </ui-switch>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.SocialLoginEnabled' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.SocialLoginEnable' | transloco\" name=\"social_login_enabled\" controlId=\"domain-build-social_login_enabled\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch size=\"small\" [attr.aria-labelledby]=\"'domain-build-social_login_enabled-label'\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"social_login_enabled\"\n name=\"social_login_enabled\" [ngClass]=\"{ 'is-invalid': submitted && f['social_login_enabled'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.NotifyLogins' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.NotifyLogins' | transloco\" name=\"notify_logins\" controlId=\"domain-build-notify_logins\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch size=\"small\" [attr.aria-labelledby]=\"'domain-build-notify_logins-label'\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"notify_logins\"\n name=\"notify_logins\" [ngClass]=\"{ 'is-invalid': submitted && f['notify_logins'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n\n <div class=\"my-5\">\n <h3>Pre-Built Pages Config (Resources, Landing Pages, etc)</h3>\n\n <p-accordion class=\"mt-5\">\n <p-accordion-panel value=\"0\">\n <p-accordion-header>Instructions - README FIRST</p-accordion-header>\n <p-accordion-content>\n <div class=\"mb-3\">\n <p>We've built and maintain a collection of high-converting landing pages designed to help you quickly launch polished\n UIs for onboarding users.</p>\n <p><strong>Newsletter Subscription Pages:</strong><br> After configuring your domain, you can access pages like\n <strong>/join/cs1, /join/cs2, /join/cs3, etc.</strong>, specifically designed for newsletter sign-ups. <br>\n Subscribers from these pages will be listed in the <strong>SmartCRM module</strong>.</p>\n <p><strong>Trial Product Sign-Up Pages:</strong><br> For users interested in trial products, utilize pages such as\n <strong>/join/trial1, /join/trial2, /join/trial3, etc.</strong>.<br> Users registering through these pages will\n appear in the <strong>Admin > Users section</strong>.</p>\n <p>Once you've selected the landing page you want to use <strong>(e.g., /join/trial3)</strong>, make sure to update\n the <strong>Internal Path</strong> in the <strong>Core tab</strong> accordingly\u2014i.e., set it to\n <strong>/join/trial3</strong>.</p>\n <p>If you need assistance integrating these pages into your workflow or have further questions, feel free to reach\n out.</p>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n <p-accordion-panel value=\"1\">\n <p-accordion-header>Subscribe to Product/Newsletter Config</p-accordion-header>\n <p-accordion-content>\n <div class=\"mb-3\">\n <p>Trial Pages will enable users to sign up to real products and are accessible at the path /join/trial1,\n /join/trial2, etc.</p>\n <p>ComingSoon Pages will enable users to subscribe to Newsletters and are accessible at the internal paths\n /join/cs1, /join/cs2, etc.</p>\n </div>\n <!-- live page link -->\n <div class=\"text-end\" *ngIf=\"shardUrl\">\n <span>See the live page <span class=\"tooltip-wrap ms-1\" [appendTo]=\"'body'\"\n [pTooltip]=\"'Admin.DomainConfig.Tooltip.SeeLiveTrial' | transloco\" tooltipPosition=\"top\">\n <i class=\"fas fa-info-circle\"></i>\n </span> : <a [href]=\"shardUrl + '/join/trial1'\" target=\"_blank\">{{ shardUrl }}/join/trial1</a></span>\n </div>\n <div class=\"row\">\n <div class=\"col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.TrialProduct' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.TrialProduct' | transloco\" name=\"trial_product_id\" controlId=\"domain-build-trial_product_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-autoComplete [attr.aria-labelledby]=\"'domain-build-trial_product_id-label'\" [suggestions]=\"productsList\" formControlName=\"trial_product_id\" dataKey=\"id\" field=\"name\"\n [dropdown]=\"true\" [delay]=\"1000\" (completeMethod)=\"searchProduct($event)\" styleClass=\"w-100\"\n placeholder=\"Search Product\" [inputStyle]=\"\n form.get('trial_product_id').touched &&\n form.get('trial_product_id').invalid\n ? { border: '1px solid #ff586b' }\n : { border: '1px solid gray' }\n \" [multiple]=\"false\">\n </p-autoComplete>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.TrialCrmSourceId' | transloco\" name=\"trial_crm_source_id\" controlId=\"domain-build-trial_crm_source_id\" [useAriaLabelledbyOnly]=\"true\"\n [showTooltip]=\"true\" [tooltipText]=\"\n 'Admin.DomainConfig.Tooltip.TrialCrmSourceId' | transloco\n \">\n <p-select inputId=\"domain-build-trial_crm_source_id\"\n [options]=\"crmSourcesList\" [attr.aria-labelledby]=\"'domain-build-trial_crm_source_id-label'\" formControlName=\"trial_crm_source_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['trial_crm_source_id']?.errors }\"\n [placeholder]=\"'Select CRM Source'\" optionValue=\"id\" optionLabel=\"name\">\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.TrialPdfSourceId' | transloco\" name=\"trial_pdf_source_id\" controlId=\"domain-build-trial_pdf_source_id\" [useAriaLabelledbyOnly]=\"true\"\n [showTooltip]=\"true\" [tooltipText]=\"\n 'Admin.DomainConfig.Tooltip.TrialPdfSourceId' | transloco\n \">\n <p-select inputId=\"domain-build-trial_pdf_source_id\"\n [options]=\"crmSourcesList\" [attr.aria-labelledby]=\"'domain-build-trial_pdf_source_id-label'\" formControlName=\"trial_pdf_source_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['trial_pdf_source_id']?.errors }\"\n [placeholder]=\"'Select CRM Source'\" optionValue=\"id\" optionLabel=\"name\">\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\"></div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.TrialVideoUrl' | transloco\" name=\"trial_video_url\" controlId=\"domain-build-trial_video_url\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.TrialVideoUrl' | transloco\">\n <input type=\"text\" id=\"domain-build-trial_video_url\" class=\"form-control\" formControlName=\"trial_video_url\"\n [ngClass]=\"{ 'is-invalid': submitted && f['trial_video_url'].errors }\" />\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.TrialBookDemoUrl' | transloco\" name=\"trial_book_demo_url\" controlId=\"domain-build-trial_book_demo_url\"\n [showTooltip]=\"true\" [tooltipText]=\"\n 'Admin.DomainConfig.Tooltip.TrialBookDemoUrl' | transloco\n \">\n <input type=\"text\" id=\"domain-build-trial_book_demo_url\" class=\"form-control\" formControlName=\"trial_book_demo_url\" [ngClass]=\"{\n 'is-invalid': submitted && f['trial_book_demo_url'].errors\n }\" />\n </pw-input-container>\n </div>\n <div class=\"col-12\">\n <pw-input-container [label]=\"'Admin.DomainConfig.TrialCtaIframe' | transloco\" name=\"trial_cta_iframe\" controlId=\"domain-build-trial_cta_iframe\"\n [showTooltip]=\"true\" [tooltipText]=\"\n 'Admin.DomainConfig.Tooltip.TrialCtaIframe' | transloco\n \">\n <textarea id=\"domain-build-trial_cta_iframe\" rows=\"3\" class=\"form-control\" formControlName=\"trial_cta_iframe\" [ngClass]=\"{\n 'is-invalid': submitted && f['trial_cta_iframe'].errors\n }\">\n </textarea>\n </pw-input-container>\n </div>\n <div class=\"col-12\">\n <pw-input-container [label]=\"'Admin.DomainConfig.TrialJoinMessage' | transloco\" name=\"trial_join_message\" controlId=\"domain-build-trial_join_message\"\n [showTooltip]=\"true\" [tooltipText]=\"\n 'Admin.DomainConfig.Tooltip.TrialJoinMessage' | transloco\n \">\n <textarea id=\"domain-build-trial_join_message\" rows=\"3\" class=\"form-control\" formControlName=\"trial_join_message\" [ngClass]=\"{\n 'is-invalid': submitted && f['trial_join_message'].errors\n }\">\n </textarea>\n </pw-input-container>\n </div>\n <div class=\"col-12\">\n <pw-input-container [label]=\"'Admin.DomainConfig.TrialPdfDownloadText' | transloco\" name=\"trial_pdf_download_text\" controlId=\"domain-build-trial_pdf_download_text\"\n [showTooltip]=\"true\" [tooltipText]=\"\n 'Admin.DomainConfig.Tooltip.TrialPdfDownloadText' | transloco\n \">\n <textarea id=\"domain-build-trial_pdf_download_text\" rows=\"3\" class=\"form-control\" formControlName=\"trial_pdf_download_text\" [ngClass]=\"{\n 'is-invalid': submitted && f['trial_pdf_download_text'].errors\n }\">\n </textarea>\n </pw-input-container>\n </div>\n </div>\n <div class=\"row\" matchHeight=\"card\">\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-trial_image-label\">{{ 'Admin.DomainConfig.TrialImage' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImage' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Trial Image'\"\n [controlName]=\"'trial_image'\" [previewData]=\"data['trial_image']\">\n </pw-custom-uploader>\n </div>\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-trial_image2-label\">{{ 'Admin.DomainConfig.TrialImage2' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImage2' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Image2'\" [aspectRatio]=\"'custom'\"\n [controlName]=\"'trial_image2'\" [previewData]=\"data['trial_image2']\">\n </pw-custom-uploader>\n </div>\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-trial_pdf_image-label\">{{ 'Admin.DomainConfig.TrialPdfImage' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialPdfImage' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Pdf Image'\" [aspectRatio]=\"'custom'\"\n [controlName]=\"'trial_pdf_image'\" [previewData]=\"data['trial_pdf_image']\">\n </pw-custom-uploader>\n </div>\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-trial_image_bg-label\">{{ 'Admin.DomainConfig.TrialImageBg' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImageBg' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Image Bg'\" [aspectRatio]=\"'custom'\"\n [controlName]=\"'trial_image_bg'\" [previewData]=\"data['trial_image_bg']\">\n </pw-custom-uploader>\n </div>\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-trial_image_bg2-label\">{{ 'Admin.DomainConfig.TrialImageBg2' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImageBg2' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Image Bg2'\" [aspectRatio]=\"'custom'\"\n [controlName]=\"'trial_image_bg2'\" [previewData]=\"data['trial_image_bg2']\">\n </pw-custom-uploader>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n <p-accordion-panel value=\"2\">\n <p-accordion-header>Header Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-4\" formGroupName=\"header\">\n <h4 class=\"mb-4\">Header Section</h4>\n\n <!-- Headline -->\n <div class=\"col-12 col-md-12\">\n <pw-input-container label=\"Header Headline\" name=\"headline\" controlId=\"domain-build-header-headline\">\n <input type=\"text\" id=\"domain-build-header-headline\" class=\"form-control\" formControlName=\"headline\" />\n </pw-input-container>\n </div>\n\n <!-- Video URL -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"Header Video URL\" name=\"video_url\" controlId=\"domain-build-header-video_url\">\n <input type=\"text\" id=\"domain-build-header-video_url\" class=\"form-control\" formControlName=\"video_url\" />\n </pw-input-container>\n </div>\n\n <!-- Background Image URL -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"Header Background Image URL\" name=\"bg_image_url\" controlId=\"domain-build-header-bg_image_url\">\n <input type=\"text\" id=\"domain-build-header-bg_image_url\" class=\"form-control\" formControlName=\"bg_image_url\" />\n </pw-input-container>\n </div>\n\n <!-- Description -->\n <div class=\"col-12\">\n <pw-input-container label=\"Header Description\" name=\"description\" controlId=\"domain-build-header-description\">\n <textarea\n id=\"domain-build-header-description\"\n class=\"form-control\"\n rows=\"5\"\n formControlName=\"description\"\n [ngClass]=\"{ 'is-invalid': submitted && f['description']?.errors }\"\n ></textarea>\n </pw-input-container>\n </div>\n\n <!-- Sub Headings -->\n <div formArrayName=\"sub_headings\" class=\"col-12\" cdkDropList (cdkDropListDropped)=\"dropItems(headerSubHeadings, $event)\">\n <div\n *ngFor=\"let sub of f['header'].get('sub_headings')['controls']; let i = index\"\n [formGroupName]=\"i\"\n class=\"row mb-3 align-items-center\"\n cdkDrag\n >\n <div class=\"col-md-10\">\n <pw-input-container label=\"Sub Header Description\" name=\"description\" [controlId]=\"'domain-build-header-sub_description-' + i\">\n <textarea\n [id]=\"'domain-build-header-sub_description-' + i\"\n class=\"form-control\"\n rows=\"3\"\n formControlName=\"description\"\n [ngClass]=\"{ 'is-invalid': submitted && f['description']?.errors }\"\n ></textarea>\n </pw-input-container>\n </div>\n\n <div class=\"col-md-1 d-flex justify-content-end mt-3\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeHeaderSubHeading(i)\"\n (keydown.enter)=\"removeHeaderSubHeading(i)\"\n (keydown.space)=\"removeHeaderSubHeading(i)\"\n ngbTooltip=\"Remove\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-md-1 d-flex justify-content-end mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addHeaderSubHeading()\">\n + Add Sub Heading\n </button>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n <p-accordion-panel value=\"3\">\n <p-accordion-header>Resources Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row row mt-4 mb-4\">\n <h4 class=\"mb-3\">Resources Section</h4>\n <div class=\"col-12 col-sm-6\">\n <pw-input-container [label]=\"'Admin.DomainConfig.ResourceTagline' | transloco\" name=\"resources_tagline\" controlId=\"domain-build-resources_tagline\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.ResourceTagline' | transloco\">\n <input type=\"text\" id=\"domain-build-resources_tagline\" class=\"form-control\" formControlName=\"resources_tagline\"\n [ngClass]=\"{ 'is-invalid': submitted && f['resources_tagline'].errors }\" />\n </pw-input-container>\n </div>\n <div class=\"col-12\">\n <pw-input-container [label]=\"'Admin.DomainConfig.ResourceDescription' | transloco\" name=\"resources_description\" controlId=\"domain-build-resources_description\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.ResourceDescription' | transloco\">\n <textarea id=\"domain-build-resources_description\" class=\"form-control\" rows=\"3\" formControlName=\"resources_description\"\n [ngClass]=\"{ 'is-invalid': submitted && f['resources_description'].errors }\">\n </textarea>\n </pw-input-container>\n </div>\n </div>\n <div class=\"row\" matchHeight=\"card\">\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-resource_image-label\">{{ 'Admin.DomainConfig.ResourceImage' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.ResourceImage' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Image'\"\n [controlName]=\"'resources_image'\" [previewData]=\"data['resources_image']\">\n </pw-custom-uploader>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n <p-accordion-panel value=\"4\">\n <p-accordion-header>Unique Selling Proposition Section (USP)</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-4 mb-4\" formGroupName=\"usps\">\n <h4 class=\"mb-4\">Unique Selling Proposition Section (USP)</h4>\n\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"USPs Title\" name=\"title\" controlId=\"domain-build-usps-title\">\n <input type=\"text\" id=\"domain-build-usps-title\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"USPs Video Url\" name=\"video_url\" controlId=\"domain-build-usps-video_url\">\n <input type=\"text\" id=\"domain-build-usps-video_url\" class=\"form-control\" formControlName=\"video_url\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12\">\n <pw-input-container label=\"USPs Description\" name=\"description\" controlId=\"domain-build-usps-description\">\n <textarea id=\"domain-build-usps-description\" class=\"form-control\" rows=\"3\" formControlName=\"description\"></textarea>\n </pw-input-container>\n </div>\n\n <!-- USP Items -->\n <div formArrayName=\"items\" class=\"col-12\" cdkDropList (cdkDropListDropped)=\"dropItems(uspsItems, $event)\">\n <div\n *ngFor=\"let item of f['usps'].get('items')['controls']; let i = index\"\n [formGroupName]=\"i\"\n class=\"row mb-3 align-items-center\"\n cdkDrag\n >\n <div class=\"col-sm-10\">\n <pw-input-container label=\"Item Description\" name=\"description\" [controlId]=\"'domain-build-usps-item-desc-' + i\">\n <textarea [id]=\"'domain-build-usps-item-desc-' + i\" class=\"form-control\" rows=\"3\" formControlName=\"description\"></textarea>\n </pw-input-container>\n </div>\n\n <div class=\"col-sm-1 d-flex justify-content-end mt-3\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeUspItem(i)\"\n (keydown.enter)=\"removeUspItem(i)\"\n (keydown.space)=\"removeUspItem(i)\"\n ngbTooltip=\"Remove\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-sm-1 d-flex justify-content-end mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addUspItem()\">\n + Add USP Item\n </button>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n <p-accordion-panel value=\"5\">\n <p-accordion-header>Partners (Clients) Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-4 mb-4\" formGroupName=\"partners\">\n <h4 class=\"mb-4\">Partners (Clients) Section</h4>\n\n <!-- Title -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"Partner Title\" name=\"title\" controlId=\"domain-build-partners-title\">\n <input type=\"text\" id=\"domain-build-partners-title\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n </div>\n\n <!-- Description -->\n <div class=\"col-12\">\n <pw-input-container label=\"Partners Description\" name=\"description\" controlId=\"domain-build-partners-description\">\n <textarea id=\"domain-build-partners-description\" class=\"form-control\" rows=\"3\" formControlName=\"description\"></textarea>\n </pw-input-container>\n </div>\n\n <!-- Partner Items with Drag Support -->\n <div formArrayName=\"items\" class=\"col-12\" cdkDropList (cdkDropListDropped)=\"dropItems(partnersItems, $event)\">\n <div\n *ngFor=\"let item of partnersItems.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row border p-3 mb-3 align-items-start\"\n cdkDrag\n >\n <!-- Name -->\n <div class=\"col-md-6\">\n <pw-input-container label=\"Name\" class=\"col-12\" name=\"name\" [controlId]=\"'domain-build-partner-name-' + i\">\n <input [id]=\"'domain-build-partner-name-' + i\" class=\"form-control\" formControlName=\"name\" />\n </pw-input-container>\n </div>\n\n <!-- Blog URL + Drag Handle -->\n <div class=\"col-md-5\">\n <pw-input-container label=\"Blog Url\" name=\"blog_url\" [controlId]=\"'domain-build-partner-blog_url-' + i\">\n <input [id]=\"'domain-build-partner-blog_url-' + i\" class=\"form-control\" formControlName=\"blog_url\" />\n </pw-input-container>\n </div>\n\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder question\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n\n <!-- Video URL -->\n <div class=\"col-md-6\">\n <pw-input-container label=\"Video Url\" name=\"video_url\" [controlId]=\"'domain-build-partner-video_url-' + i\">\n <input [id]=\"'domain-build-partner-video_url-' + i\" class=\"form-control\" formControlName=\"video_url\" />\n </pw-input-container>\n </div>\n\n <!-- Image URL -->\n <div class=\"col-md-6\">\n <pw-input-container label=\"Image Url\" name=\"image_url\" [controlId]=\"'domain-build-partner-image_url-' + i\">\n <input [id]=\"'domain-build-partner-image_url-' + i\" class=\"form-control\" formControlName=\"image_url\" />\n </pw-input-container>\n </div>\n\n <!-- Delete Icon -->\n <div class=\"col-md-12 text-end mt-2\">\n <i\n ngbTooltip=\"Remove\"\n (click)=\"removePartnerItem(i)\"\n (keydown.enter)=\"removePartnerItem(i)\"\n (keydown.space)=\"removePartnerItem(i)\"\n class=\"fa fa-trash delete-icon text-danger\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <!-- Add New Partner -->\n <div class=\"text-start mt-2\">\n <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addPartnerItem()\">+ Add Partner</button>\n </div>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n <p-accordion-panel value=\"6\">\n <p-accordion-header>Testimonials Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-3 mb-4\" formGroupName=\"testimonials\">\n <h4 class=\"mb-4\">Testimonials Section</h4>\n\n <pw-input-container label=\"Title\" class=\"col-12 col-md-6\" name=\"testimonials_title\" controlId=\"domain-build-testimonials-title\">\n <input type=\"text\" id=\"domain-build-testimonials-title\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n\n <pw-input-container label=\"Description\" class=\"col-12\" name=\"testimonials_description\" controlId=\"domain-build-testimonials-description\">\n <textarea id=\"domain-build-testimonials-description\" rows=\"3\" class=\"form-control\" formControlName=\"description\"></textarea>\n </pw-input-container>\n\n <!-- Items List -->\n <div formArrayName=\"items\" class=\"col-12 mt-3\" cdkDropList (cdkDropListDropped)=\"dropItems(testimonialsItems, $event)\">\n <div\n *ngFor=\"let item of testimonialsItems.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row border p-3 mb-3 align-items-start\"\n cdkDrag\n >\n <div class=\"col-md-6\">\n <pw-input-container label=\"Name\" name=\"name\" [controlId]=\"'domain-build-testimonial-name-' + i\">\n <input type=\"text\" [id]=\"'domain-build-testimonial-name-' + i\" class=\"form-control\" formControlName=\"name\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-md-5\">\n <pw-input-container label=\"Blog URL\" name=\"blog_url\" [controlId]=\"'domain-build-testimonial-blog_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-testimonial-blog_url-' + i\" class=\"form-control\" formControlName=\"blog_url\" />\n </pw-input-container>\n </div>\n\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder question\"\n aria-hidden=\"true\"\n ></i>\n </div>\n <pw-input-container label=\"Image URL\" class=\"col-md-6\" name=\"image_url\" [controlId]=\"'domain-build-testimonial-image_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-testimonial-image_url-' + i\" class=\"form-control\" formControlName=\"image_url\" />\n </pw-input-container>\n\n <pw-input-container label=\"Video URL\" class=\"col-md-6\" name=\"video_url\" [controlId]=\"'domain-build-testimonial-video_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-testimonial-video_url-' + i\" class=\"form-control\" formControlName=\"video_url\" />\n </pw-input-container>\n\n <pw-input-container label=\"Testimonial\" class=\"col-md-10\" name=\"testimonial\" [controlId]=\"'domain-build-testimonial-text-' + i\">\n <textarea [id]=\"'domain-build-testimonial-text-' + i\" class=\"form-control\" rows=\"3\" formControlName=\"testimonial\"></textarea>\n </pw-input-container>\n\n <div class=\"col-md-2 d-flex align-items-start mt-3\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n ngbTooltip=\"Remove\"\n (click)=\"removeTestimonialItem(i)\"\n (keydown.enter)=\"removeTestimonialItem(i)\"\n (keydown.space)=\"removeTestimonialItem(i)\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <div class=\"text-start mt-2\">\n <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addTestimonialItem()\">\n + Add Testimonial\n </button>\n </div>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n <p-accordion-panel value=\"7\">\n <p-accordion-header>Video Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-3 mb-4\" formGroupName=\"videos\">\n <h4 class=\"mb-3\">Video Section</h4>\n\n <pw-input-container label=\"Title\" class=\"col-12 col-md-6\" name=\"videos_title\" controlId=\"domain-build-videos-title\">\n <input type=\"text\" id=\"domain-build-videos-title\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n\n <pw-input-container label=\"Description\" class=\"col-12\" name=\"videos_description\" controlId=\"domain-build-videos-description\">\n <textarea id=\"domain-build-videos-description\" rows=\"3\" class=\"form-control\" formControlName=\"description\"></textarea>\n </pw-input-container>\n\n <!-- Video Items -->\n <div\n formArrayName=\"items\"\n class=\"col-12 mt-3\"\n cdkDropList\n (cdkDropListDropped)=\"dropItems(videosItems, $event)\"\n >\n <div\n *ngFor=\"let item of videosItems.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row border p-3 mb-3 align-items-start\"\n cdkDrag\n >\n <div class=\"col-md-6\">\n <pw-input-container label=\"Title\" name=\"title\" [controlId]=\"'domain-build-video-item-title-' + i\">\n <input type=\"text\" [id]=\"'domain-build-video-item-title-' + i\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-md-5\">\n <pw-input-container label=\"Blog URL\" name=\"blog_url\" [controlId]=\"'domain-build-video-item-blog_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-video-item-blog_url-' + i\" class=\"form-control\" formControlName=\"blog_url\" />\n </pw-input-container>\n </div>\n\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder question\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <pw-input-container label=\"Image URL\" class=\"col-md-6\" name=\"image_url\" [controlId]=\"'domain-build-video-item-image_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-video-item-image_url-' + i\" class=\"form-control\" formControlName=\"image_url\" />\n </pw-input-container>\n\n <pw-input-container label=\"Video URL\" class=\"col-md-6\" name=\"video_url\" [controlId]=\"'domain-build-video-item-video_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-video-item-video_url-' + i\" class=\"form-control\" formControlName=\"video_url\" />\n </pw-input-container>\n\n <pw-input-container label=\"Description\" class=\"col-md-10\" name=\"description\" [controlId]=\"'domain-build-video-item-description-' + i\">\n <textarea [id]=\"'domain-build-video-item-description-' + i\" class=\"form-control\" rows=\"3\" formControlName=\"description\"></textarea>\n </pw-input-container>\n\n <div class=\"col-md-2 d-flex align-items-start mt-3\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeVideoItem(i)\"\n (keydown.enter)=\"removeVideoItem(i)\"\n (keydown.space)=\"removeVideoItem(i)\"\n ngbTooltip=\"Remove\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <div class=\"text-start mt-2\">\n <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addVideoItem()\">\n + Add Video\n </button>\n </div>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n <p-accordion-panel value=\"8\">\n <p-accordion-header>Call to Actions Section (CTAs)</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-4 mb-4\" formGroupName=\"ctas\">\n <h4 class=\"mb-4\">CTAs Section</h4>\n\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"Title\" name=\"title\" controlId=\"domain-build-ctas-title\">\n <input type=\"text\" id=\"domain-build-ctas-title\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"Image URL\" name=\"image_url\" controlId=\"domain-build-ctas-image_url\">\n <input type=\"text\" id=\"domain-build-ctas-image_url\" class=\"form-control\" formControlName=\"image_url\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"Button Text\" name=\"button_text\" controlId=\"domain-build-ctas-button_text\">\n <input type=\"text\" id=\"domain-build-ctas-button_text\" class=\"form-control\" formControlName=\"button_text\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12\">\n <pw-input-container label=\"Description\" name=\"description\" controlId=\"domain-build-ctas-description\">\n <input type=\"text\" id=\"domain-build-ctas-description\" class=\"form-control\" formControlName=\"description\" />\n </pw-input-container>\n </div>\n\n <!-- CTA Items -->\n <div formArrayName=\"items\" class=\"col-12 mt-3\" cdkDropList (cdkDropListDropped)=\"dropItems(ctasItems, $event)\">\n <div\n *ngFor=\"let item of ctasItems.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row border p-3 mb-3 align-items-start\"\n cdkDrag\n >\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"Image URL\" name=\"image_url\" [controlId]=\"'domain-build-cta-item-image_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-cta-item-image_url-' + i\" class=\"form-control\" formControlName=\"image_url\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-md-5\">\n <pw-input-container label=\"Cta URL\" name=\"cta_url\" [controlId]=\"'domain-build-cta-item-cta_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-cta-item-cta_url-' + i\" class=\"form-control\" formControlName=\"cta_url\" />\n </pw-input-container>\n </div>\n\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder question\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"Video URL\" name=\"video_url\" [controlId]=\"'domain-build-cta-item-video_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-cta-item-video_url-' + i\" class=\"form-control\" formControlName=\"video_url\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"CTA Title\" name=\"title\" [controlId]=\"'domain-build-cta-item-title-' + i\">\n <input [id]=\"'domain-build-cta-item-title-' + i\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"CTA Description\" name=\"description\" [controlId]=\"'domain-build-cta-item-description-' + i\">\n <input [id]=\"'domain-build-cta-item-description-' + i\" class=\"form-control\" formControlName=\"description\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-5\">\n <pw-input-container label=\"Button Text\" name=\"button_text\" [controlId]=\"'domain-build-cta-item-button_text-' + i\">\n <input [id]=\"'domain-build-cta-item-button_text-' + i\" class=\"form-control\" formControlName=\"button_text\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-md-1 d-flex align-items-center mt-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"removeCtasItem(i)\"\n (keydown.enter)=\"removeCtasItem(i)\"\n (keydown.space)=\"removeCtasItem(i)\"\n ngbTooltip=\"Remove\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <div class=\"text-start mt-2\">\n <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addCtasItem()\">+ Add CTA Item</button>\n </div>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n <p-accordion-panel value=\"9\">\n <p-accordion-header>Integrations Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-3 mb-4\" formGroupName=\"integrations\">\n <h4 class=\"mb-3\">Integrations Section</h4>\n\n <pw-input-container label=\"Title\" class=\"col-12\" name=\"title\" controlId=\"domain-build-integrations-title\">\n <input type=\"text\" id=\"domain-build-integrations-title\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n\n <pw-input-container label=\"Description\" class=\"col-12\" name=\"description\" controlId=\"domain-build-integrations-description\">\n <textarea id=\"domain-build-integrations-description\" class=\"form-control\" formControlName=\"description\" rows=\"3\"></textarea>\n </pw-input-container>\n\n <div formArrayName=\"items\" class=\"col-12\" cdkDropList (cdkDropListDropped)=\"dropItems(integrationsItems, $event)\">\n <div\n *ngFor=\"let item of integrationsItems.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row border p-3 mb-3 rounded bg-light\"\n cdkDrag\n >\n <pw-input-container label=\"Title\" class=\"col-md-6\" name=\"title\" [controlId]=\"'domain-build-integration-title-' + i\">\n <input type=\"text\" [id]=\"'domain-build-integration-title-' + i\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n\n <div class=\"col-md-5\">\n <pw-input-container label=\"Description\" name=\"description\" [controlId]=\"'domain-build-integration-description-' + i\">\n <input type=\"text\" [id]=\"'domain-build-integration-description-' + i\" class=\"form-control\" formControlName=\"description\" />\n </pw-input-container>\n </div>\n\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder question\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <pw-input-container label=\"Blog URL\" class=\"col-md-6\" name=\"blog_url\" [controlId]=\"'domain-build-integration-blog_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-integration-blog_url-' + i\" class=\"form-control\" formControlName=\"blog_url\" />\n </pw-input-container>\n\n <pw-input-container label=\"Image URL\" class=\"col-md-6\" name=\"image_url\" [controlId]=\"'domain-build-integration-image_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-integration-image_url-' + i\" class=\"form-control\" formControlName=\"image_url\" />\n </pw-input-container>\n\n <pw-input-container label=\"Video URL\" class=\"col-md-6\" name=\"video_url\" [controlId]=\"'domain-build-integration-video_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-integration-video_url-' + i\" class=\"form-control\" formControlName=\"video_url\" />\n </pw-input-container>\n\n <div class=\"col-md-6 d-flex align-items-end justify-content-end\">\n <i\n class=\"fa fa-trash delete-icon align-self-center\"\n (click)=\"removeIntegrationItem(i)\"\n (keydown.enter)=\"removeIntegrationItem(i)\"\n (keydown.space)=\"removeIntegrationItem(i)\"\n ngbTooltip=\"Remove\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <div class=\"text-start mt-2\">\n <button type=\"button\" class=\"btn btn-primary\" (click)=\"addIntegrationItem()\">+ Add Integration</button>\n </div>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n <p-accordion-panel value=\"10\">\n <p-accordion-header>Contact Us Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-3 mb-4\" formGroupName=\"contact_us\">\n <h4 class=\"mb-3\">Contact Us Section</h4>\n\n <pw-input-container label=\"Url\" class=\"col-md-6\" name=\"url\" controlId=\"domain-build-contact_us-url\">\n <input type=\"text\" id=\"domain-build-contact_us-url\" class=\"form-control\" formControlName=\"url\" />\n </pw-input-container>\n <pw-input-container label=\"Description\" class=\"col-12\" name=\"contact_us_description\" controlId=\"domain-build-contact_us-description\">\n <textarea id=\"domain-build-contact_us-description\" rows=\"3\" class=\"form-control\" formControlName=\"description\"></textarea>\n </pw-input-container>\n\n <div formArrayName=\"questions\" class=\"col-12 mt-3\" cdkDropList (cdkDropListDropped)=\"dropItems(contactUsQuestions, $event)\">\n <div\n *ngFor=\"let questionGroup of contactUsQuestions.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row border p-3 mb-3\"\n cdkDrag\n >\n <pw-input-container label=\"Question\" class=\"col-md-10\" name=\"question\" [controlId]=\"'domain-build-contact_us-question-' + i\">\n <input type=\"text\" [id]=\"'domain-build-contact_us-question-' + i\" class=\"form-control\" formControlName=\"question\" />\n </pw-input-container>\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeContactUsQuestion(i)\"\n (keydown.enter)=\"removeContactUsQuestion(i)\"\n (keydown.space)=\"removeContactUsQuestion(i)\"\n ngbTooltip=\"Remove\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder question\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-12 mt-3\" formArrayName=\"options\" cdkDropList [cdkDropListData]=\"getQuestionOptions(i).controls\" (cdkDropListDropped)=\"dropContactUsOptions(i, $event)\">\n <div\n class=\"row align-items-center mb-2 border p-3\"\n *ngFor=\"let option of getQuestionOptions(i).controls; let j = index\"\n [formGroupName]=\"j\"\n cdkDrag\n >\n <pw-input-container label=\"Option\" class=\"col-md-10\" name=\"option\" [controlId]=\"'domain-build-contact_us-option-' + i + '-' + j\">\n <input type=\"text\" [id]=\"'domain-build-contact_us-option-' + i + '-' + j\" class=\"form-control\" formControlName=\"option\" />\n </pw-input-container>\n\n <div class=\"col-md-1 d-flex justify-content-end mt-3\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeContactUsOption(i, j)\"\n (keydown.enter)=\"removeContactUsOption(i, j)\"\n (keydown.space)=\"removeContactUsOption(i, j)\"\n ngbTooltip=\"Remove Option\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-md-1 d-flex justify-content-end mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder option\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <div class=\"text-start\">\n <button type=\"button\" class=\"btn btn-primary btn-sm\" (click)=\"addContactUsOption(i)\">\n + Add Option\n </button>\n </div>\n </div>\n </div>\n\n <div class=\"text-start mt-3\">\n <button type=\"button\" class=\"btn btn-primary\" (click)=\"addContactUsQuestion()\">\n + Add Question\n </button>\n </div>\n </div>\n\n <div formArrayName=\"hubspot\" class=\"col-12 mt-4\" cdkDropList (cdkDropListDropped)=\"dropItems(contactUsHubspotItems, $event)\">\n <h5 class=\"mb-4\">Hubspot Embeds</h5>\n\n <div\n *ngFor=\"let hub of contactUsHubspotItems.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row border p-3 mb-2\"\n cdkDrag\n >\n <pw-input-container label=\"ID\" class=\"col-md-5\" name=\"id\" [controlId]=\"'domain-build-hubspot-id-' + i\">\n <input type=\"text\" [id]=\"'domain-build-hubspot-id-' + i\" class=\"form-control\" formControlName=\"id\" />\n </pw-input-container>\n\n <pw-input-container label=\"Position\" class=\"col-md-6\" name=\"position\" [controlId]=\"'domain-build-hubspot-position-' + i\">\n <input type=\"text\" [id]=\"'domain-build-hubspot-position-' + i\" class=\"form-control\" formControlName=\"position\" />\n </pw-input-container>\n <div class=\"col-md-1 d-flex align-items-start justify-content-end mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <pw-input-container label=\"Div\" class=\"col-10\" name=\"div\" [controlId]=\"'domain-build-hubspot-div-' + i\">\n <textarea\n [id]=\"'domain-build-hubspot-div-' + i\"\n class=\"form-control\"\n rows=\"5\"\n formControlName=\"div\"\n [ngClass]=\"{ 'is-invalid': submitted && f['div']?.errors }\"\n ></textarea>\n </pw-input-container>\n\n <div class=\"col-md-2 d-flex align-items-center mt-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"removeHubspotItem(i)\"\n (keydown.enter)=\"removeHubspotItem(i)\"\n (keydown.space)=\"removeHubspotItem(i)\"\n ngbTooltip=\"Remove Hubspot Embed\"\n aria-hidden=\"true\">\n</i>\n </div>\n </div>\n\n <div class=\"text-start mt-2\">\n <button type=\"button\" class=\"btn btn-primary btn-sm\" (click)=\"addHubspotItem()\">\n + Add Hubspot Embed\n </button>\n </div>\n </div>\n\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n <p-accordion-panel value=\"11\">\n <p-accordion-header>Book a Demo Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-4\">\n <div class=\"col-12\">\n <h4 class=\"mb-3\">{{ 'Admin.DomainConfig.BookDemoLinks' | transloco }}</h4>\n <div formGroupName=\"book_demo\">\n <pw-input-container label=\"Title\" name=\"title\" controlId=\"domain-build-book_demo-title\">\n <input type=\"text\" id=\"domain-build-book_demo-title\" formControlName=\"title\" class=\"form-control\" />\n </pw-input-container>\n\n <pw-input-container label=\"Description\" name=\"description\" controlId=\"domain-build-book_demo-description\">\n <input type=\"text\" id=\"domain-build-book_demo-description\" formControlName=\"description\" class=\"form-control\" />\n </pw-input-container>\n\n <div formArrayName=\"items\" cdkDropList (cdkDropListDropped)=\"dropBookDemoLinks($event)\">\n <div\n *ngFor=\"let link of f['book_demo'].get('items')['controls']; let i = index\"\n [formGroupName]=\"i\"\n class=\"row mb-3 border p-3 align-items-center\"\n cdkDrag\n >\n <div class=\"col-sm-5\">\n <pw-input-container label=\"Link Title\" name=\"title\" [controlId]=\"'domain-build-book_demo-link-title-' + i\">\n <input type=\"text\" [id]=\"'domain-build-book_demo-link-title-' + i\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-sm-5\">\n <pw-input-container label=\"Link URL\" name=\"url\" [controlId]=\"'domain-build-book_demo-link-url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-book_demo-link-url-' + i\" class=\"form-control\" formControlName=\"url\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-sm-1 d-flex justify-content-end mt-3\">\n <i\n ngbTooltip=\"Remove\"\n (click)=\"removeBookDemoLink(i)\"\n (keydown.enter)=\"removeBookDemoLink(i)\"\n (keydown.space)=\"removeBookDemoLink(i)\"\n class=\"fa fa-trash delete-icon text-danger\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-sm-1 d-flex justify-content-end mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addBookDemoLink()\">\n + Add Book Demo Link\n </button>\n </div>\n </div>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n <p-accordion-panel value=\"12\">\n <p-accordion-header>Navbar Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-3 mb-4\" formGroupName=\"navbar\">\n <h4 class=\"mb-3\">Navbar Section</h4>\n\n <div formArrayName=\"items\" class=\"col-12\" cdkDropList (cdkDropListDropped)=\"dropItems(navbarItems, $event)\">\n <div\n *ngFor=\"let item of navbarItems.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row mb-3\"\n cdkDrag\n >\n <div class=\"row align-items-center\">\n <pw-input-container label=\"Title\" class=\"col-md-5\" name=\"title\" [controlId]=\"'domain-build-navbar-title-' + i\">\n <input type=\"text\" [id]=\"'domain-build-navbar-title-' + i\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n\n <pw-input-container label=\"Path\" class=\"col-md-5\" name=\"path\" [controlId]=\"'domain-build-navbar-path-' + i\">\n <input type=\"text\" [id]=\"'domain-build-navbar-path-' + i\" class=\"form-control\" formControlName=\"path\" />\n </pw-input-container>\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-1\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeNavbarItem(i)\"\n (keydown.enter)=\"removeNavbarItem(i)\"\n (keydown.space)=\"removeNavbarItem(i)\"\n ngbTooltip=\"Remove Navbar Item\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-1\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <div\n class=\"col-12 mt-3\"\n formArrayName=\"subtitles\"\n cdkDropList\n [cdkDropListData]=\"getNavbarSubtitles(i).controls\"\n (cdkDropListDropped)=\"dropNavbarSubtitles(i, $event)\"\n >\n <div\n *ngFor=\"let sub of getNavbarSubtitles(i).controls; let j = index\"\n [formGroupName]=\"j\"\n class=\"row border p-3 mb-2 align-items-center\"\n cdkDrag\n >\n <div class=\"col-md-5\">\n <pw-input-container label=\"Subtitle Title\" name=\"title\" [controlId]=\"'domain-build-navbar-subtitle-title-' + i + '-' + j\">\n <input type=\"text\" [id]=\"'domain-build-navbar-subtitle-title-' + i + '-' + j\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-md-5\">\n <pw-input-container label=\"Subtitle Path\" name=\"path\" [controlId]=\"'domain-build-navbar-subtitle-path-' + i + '-' + j\">\n <input type=\"text\" [id]=\"'domain-build-navbar-subtitle-path-' + i + '-' + j\" class=\"form-control\" formControlName=\"path\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-2\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeSubtitle(i, j)\"\n (keydown.enter)=\"removeSubtitle(i, j)\"\n (keydown.space)=\"removeSubtitle(i, j)\"\n ngbTooltip=\"Remove Subtitle\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-md-1 d-flex justify-content-end\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder subtitle\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <button type=\"button\" class=\"btn btn-sm btn-primary mt-2\" (click)=\"addSubtitle(i)\">\n + Add Subtitle\n </button>\n </div>\n </div>\n\n <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addNavbarItem()\">\n + Add Navbar Item\n </button>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n <p-accordion-panel value=\"13\">\n <p-accordion-header>Footer Links Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-3 mb-4\" formGroupName=\"footer_links\">\n <h4 class=\"mb-3\">Footer Links Section</h4>\n\n <div\n formArrayName=\"items\"\n class=\"col-12\"\n cdkDropList\n (cdkDropListDropped)=\"dropItems(footerLinksItems, $event)\"\n >\n <div\n *ngFor=\"let item of footerLinksItems.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row mb-3\"\n cdkDrag\n >\n <div class=\"row align-items-center\">\n\n <pw-input-container label=\"Title\" class=\"col-md-5\" name=\"title\" [controlId]=\"'domain-build-footer-title-' + i\">\n <input type=\"text\" [id]=\"'domain-build-footer-title-' + i\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n\n <pw-input-container label=\"Path\" class=\"col-md-5\" name=\"path\" [controlId]=\"'domain-build-footer-path-' + i\">\n <input type=\"text\" [id]=\"'domain-build-footer-path-' + i\" class=\"form-control\" formControlName=\"path\" />\n </pw-input-container>\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-1\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeFooterLinkItem(i)\"\n (keydown.enter)=\"removeFooterLinkItem(i)\"\n (keydown.space)=\"removeFooterLinkItem(i)\"\n ngbTooltip=\"Remove Footer Item\"\n aria-hidden=\"true\"\n ></i>\n </div>\n <div class=\"col-md-1 d-flex align-items-start justify-content-end mt-1\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n </div>\n\n <div\n class=\"col-12 mt-3\"\n formArrayName=\"subtitles\"\n cdkDropList\n [cdkDropListData]=\"getFooterSubtitles(i).controls\"\n (cdkDropListDropped)=\"dropFooterSubtitles(i, $event)\"\n >\n <div\n *ngFor=\"let sub of getFooterSubtitles(i).controls; let j = index\"\n [formGroupName]=\"j\"\n class=\"row border p-3 mb-2 align-items-center\"\n cdkDrag\n >\n\n <div class=\"col-md-5\">\n <pw-input-container label=\"Subtitle Title\" name=\"title\" [controlId]=\"'domain-build-footer-subtitle-title-' + i + '-' + j\">\n <input type=\"text\" [id]=\"'domain-build-footer-subtitle-title-' + i + '-' + j\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-md-5\">\n <pw-input-container label=\"Subtitle Path\" name=\"path\" [controlId]=\"'domain-build-footer-subtitle-path-' + i + '-' + j\">\n <input type=\"text\" [id]=\"'domain-build-footer-subtitle-path-' + i + '-' + j\" class=\"form-control\" formControlName=\"path\" />\n </pw-input-container>\n </div>\n\n\n\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-2\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeFooterSubtitle(i, j)\"\n (keydown.enter)=\"removeFooterSubtitle(i, j)\"\n (keydown.space)=\"removeFooterSubtitle(i, j)\"\n ngbTooltip=\"Remove Subtitle\"\n aria-hidden=\"true\"\n ></i>\n </div>\n <div class=\"col-md-1 d-flex justify-content-end\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder subtitle\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <button\n type=\"button\"\n class=\"btn btn-sm btn-primary mt-2\"\n (click)=\"addFooterSubtitle(i)\"\n >\n + Add Subtitle\n </button>\n </div>\n </div>\n\n <button\n type=\"button\"\n class=\"btn btn-primary mt-2 mb-2\"\n (click)=\"addFooterLinkItem()\"\n >\n + Add Footer Link\n </button>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n\n\n\n <p-accordion-panel value=\"14\">\n <p-accordion-header>Guides Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-3 mb-4\" formGroupName=\"guides\">\n <h4 class=\"mb-3\">Guides Section</h4>\n\n <div formArrayName=\"items\" class=\"col-12\">\n <div cdkDropList (cdkDropListDropped)=\"dropItems(guidesItems, $event)\">\n <div\n *ngFor=\"let item of guidesItems.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"border p-3 mb-3\"\n cdkDrag\n >\n <div class=\"row align-items-start\">\n\n <pw-input-container label=\"Title\" class=\"col-md-5\" name=\"title\" [controlId]=\"'domain-build-guide-title-' + i\">\n <input type=\"text\" [id]=\"'domain-build-guide-title-' + i\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n\n <pw-input-container label=\"Button Text\" class=\"col-md-6\" name=\"button_text\" [controlId]=\"'domain-build-guide-button_text-' + i\">\n <input type=\"text\" [id]=\"'domain-build-guide-button_text-' + i\" class=\"form-control\" formControlName=\"button_text\" />\n </pw-input-container>\n <div class=\"col-md-1 d-flex align-items-start justify-content-end mt-1\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <div class=\"row mt-2\">\n <pw-input-container label=\"Image URL\" class=\"col-md-6\" name=\"image_url\" [controlId]=\"'domain-build-guide-image_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-guide-image_url-' + i\" class=\"form-control\" formControlName=\"image_url\" />\n </pw-input-container>\n\n <pw-input-container label=\"Guide URL\" class=\"col-md-6\" name=\"guide_url\" [controlId]=\"'domain-build-guide-guide_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-guide-guide_url-' + i\" class=\"form-control\" formControlName=\"guide_url\" />\n </pw-input-container>\n </div>\n\n <div class=\"row mt-2\">\n <pw-input-container label=\"Description\" class=\"col-md-11\" name=\"description\" [controlId]=\"'domain-build-guide-description-' + i\">\n <textarea\n [id]=\"'domain-build-guide-description-' + i\"\n class=\"form-control\"\n rows=\"5\"\n formControlName=\"description\"\n [ngClass]=\"{ 'is-invalid': submitted && f['description']?.errors }\"\n ></textarea>\n </pw-input-container>\n\n <div class=\"col-md-1 d-flex align-items-start justify-content-center mt-3\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeGuideItem(i)\"\n (keydown.enter)=\"removeGuideItem(i)\"\n (keydown.space)=\"removeGuideItem(i)\"\n ngbTooltip=\"Remove Guide\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"text-start mt-2\">\n <button type=\"button\" class=\"btn btn-primary\" (click)=\"addGuideItem()\">\n + Add Guide\n </button>\n </div>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n\n <p-accordion-panel value=\"15\">\n <p-accordion-header>AB Tests Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-3 mb-4\">\n <h4 class=\"mb-3\">AB Tests</h4>\n <div formArrayName=\"ab_tests\" class=\"col-12\" cdkDropList (cdkDropListDropped)=\"dropItems(abTests, $event)\">\n <div\n *ngFor=\"let abTest of abTests.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row mb-3 border p-3\"\n cdkDrag\n >\n <pw-input-container label=\"Description\" class=\"col-md-5\" name=\"description\" [controlId]=\"'domain-build-ab_test-description-' + i\">\n <input type=\"text\" [id]=\"'domain-build-ab_test-description-' + i\" class=\"form-control\" formControlName=\"description\" />\n </pw-input-container>\n\n <pw-input-container label=\"Experiment Name\" class=\"col-md-6\" name=\"experiment_name\" [controlId]=\"'domain-build-ab_test-experiment_name-' + i\">\n <input type=\"text\" [id]=\"'domain-build-ab_test-experiment_name-' + i\" class=\"form-control\" formControlName=\"experiment_name\" />\n </pw-input-container>\n\n\n <div class=\"col-md-1 d-flex align-items-start justify-content-end mt-1\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <pw-input-container label=\"DB Shard\" class=\"col-md-6\" name=\"db_shard\" [controlId]=\"'domain-build-ab_test-db_shard-' + i\">\n <input type=\"text\" [id]=\"'domain-build-ab_test-db_shard-' + i\" class=\"form-control\" formControlName=\"db_shard\" />\n </pw-input-container>\n\n <pw-input-container label=\"Microservice Name\" class=\"col-md-6\" name=\"microservice_name\" [controlId]=\"'domain-build-ab_test-microservice_name-' + i\">\n <input type=\"text\" [id]=\"'domain-build-ab_test-microservice_name-' + i\" class=\"form-control\" formControlName=\"microservice_name\" />\n </pw-input-container>\n\n <div class=\"col-md-12 text-end mt-2\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeAbTest(i)\"\n (keydown.enter)=\"removeAbTest(i)\"\n (keydown.space)=\"removeAbTest(i)\"\n ngbTooltip=\"Remove AB Test\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <div class=\"text-start mt-2\">\n <button type=\"button\" class=\"btn btn-primary\" (click)=\"addAbTest()\">+ Add AB Test</button>\n </div>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n\n\n\n <p-accordion-panel value=\"16\">\n <p-accordion-header>Coming soon pages - Subscribe to newsletter (TO DISCONTINUE)</p-accordion-header>\n <p-accordion-content>\n <div class=\"mb-3\">\n <p>ComingSoon Pages will enable users to subscribe to Newsletters and are accessible at the internal paths\n /join/cs1, /join/cs2, etc.</p>\n </div>\n <div class=\"text-end\" *ngIf=\"shardUrl\">\n <span>See the live page <span class=\"tooltip-wrap ms-1\" [appendTo]=\"'body'\"\n [pTooltip]=\"'Admin.DomainConfig.Tooltip.SeeLiveCs' | transloco\" tooltipPosition=\"top\">\n <i class=\"fas fa-info-circle\"></i>\n </span> : <a [href]=\"shardUrl + '/join/cs1'\" target=\"_blank\">{{ shardUrl }}/join/cs1</a></span>\n </div>\n <div class=\"row\">\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CsProduct' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsProduct' | transloco\" name=\"cs_product_id\" controlId=\"domain-build-cs_product_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-autoComplete [attr.aria-labelledby]=\"'domain-build-cs_product_id-label'\" [suggestions]=\"productsList\" formControlName=\"cs_product_id\" dataKey=\"id\" field=\"name\"\n [dropdown]=\"true\" [delay]=\"1000\" (completeMethod)=\"searchProduct($event)\" styleClass=\"w-100\"\n placeholder=\"Search Product\" [inputStyle]=\"\n form.get('cs_product_id').touched &&\n form.get('cs_product_id').invalid\n ? { border: '1px solid #ff586b' }\n : { border: '1px solid gray' }\n \" [multiple]=\"false\">\n </p-autoComplete>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CsCrmSourceId' | transloco\" name=\"cs_crm_source_id\" controlId=\"domain-build-cs_crm_source_id\" [useAriaLabelledbyOnly]=\"true\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsCrmSourceId' | transloco\">\n <p-select inputId=\"domain-build-cs_crm_source_id\"\n [options]=\"crmSourcesList\" [attr.aria-labelledby]=\"'domain-build-cs_crm_source_id-label'\" formControlName=\"cs_crm_source_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['cs_crm_source_id']?.errors }\" [placeholder]=\"'Select CRM Source'\"\n optionValue=\"id\" optionLabel=\"name\">\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CsPdfSourceId' | transloco\" name=\"cs_pdf_source_id\" controlId=\"domain-build-cs_pdf_source_id\" [useAriaLabelledbyOnly]=\"true\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsPdfSourceId' | transloco\">\n <p-select inputId=\"domain-build-cs_pdf_source_id\"\n [options]=\"crmSourcesList\" [attr.aria-labelledby]=\"'domain-build-cs_pdf_source_id-label'\" formControlName=\"cs_pdf_source_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['cs_pdf_source_id']?.errors }\" [placeholder]=\"'Select CRM Source'\"\n optionValue=\"id\" optionLabel=\"name\">\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\"></div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CsVideoUrl' | transloco\" name=\"cs_video_url\" controlId=\"domain-build-cs_video_url\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsVideoUrl' | transloco\">\n <input type=\"text\" id=\"domain-build-cs_video_url\" class=\"form-control\" formControlName=\"cs_video_url\"\n [ngClass]=\"{ 'is-invalid': submitted && f['cs_video_url'].errors }\" />\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CsBookDemoUrl' | transloco\" name=\"cs_book_demo_url\" controlId=\"domain-build-cs_book_demo_url\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsBookDemoUrl' | transloco\">\n <input type=\"text\" id=\"domain-build-cs_book_demo_url\" class=\"form-control\" formControlName=\"cs_book_demo_url\"\n [ngClass]=\"{ 'is-invalid': submitted && f['cs_book_demo_url'].errors }\" />\n </pw-input-container>\n </div>\n <div class=\"col-12\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CsCtaIframe' | transloco\" name=\"cs_cta_iframe\" controlId=\"domain-build-cs_cta_iframe\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsCtaIframe' | transloco\">\n <textarea id=\"domain-build-cs_cta_iframe\" class=\"form-control\" rows=\"3\" formControlName=\"cs_cta_iframe\"\n [ngClass]=\"{ 'is-invalid': submitted && f['cs_cta_iframe'].errors }\">\n </textarea>\n </pw-input-container>\n </div>\n <div class=\"col-12\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CsJoinMessage' | transloco\" name=\"cs_join_message\" controlId=\"domain-build-cs_join_message\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsJoinMessage' | transloco\">\n <textarea id=\"domain-build-cs_join_message\" class=\"form-control\" rows=\"3\" formControlName=\"cs_join_message\"\n [ngClass]=\"{ 'is-invalid': submitted && f['cs_join_message'].errors }\">\n </textarea>\n </pw-input-container>\n </div>\n <div class=\"col-12\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CsPdfDownloadText' | transloco\" name=\"cs_pdf_download_text\" controlId=\"domain-build-cs_pdf_download_text\"\n [showTooltip]=\"true\" [tooltipText]=\"\n 'Admin.DomainConfig.Tooltip.CsPdfDownloadText' | transloco\n \">\n <textarea id=\"domain-build-cs_pdf_download_text\" class=\"form-control\" rows=\"3\" formControlName=\"cs_pdf_download_text\" [ngClass]=\"{\n 'is-invalid': submitted && f['cs_pdf_download_text'].errors\n }\">\n </textarea>\n </pw-input-container>\n </div>\n </div>\n <div class=\"row\" matchHeight=\"card\">\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-cs_image-label\">{{ 'Admin.DomainConfig.CsImage' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImage' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Image'\"\n [controlName]=\"'cs_image'\" [previewData]=\"data['cs_image']\">\n </pw-custom-uploader>\n </div>\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-cs_image2-label\">{{ 'Admin.DomainConfig.CsImage2' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImage2' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Image2'\"\n [controlName]=\"'cs_image2'\" [previewData]=\"data['cs_image2']\">\n </pw-custom-uploader>\n </div>\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-cs_pdf_image-label\">{{ 'Admin.DomainConfig.CsPdfImage' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsPdfImage' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Pdf Image'\"\n [controlName]=\"'cs_pdf_image'\" [previewData]=\"data['cs_pdf_image']\">\n </pw-custom-uploader>\n </div>\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-cs_image_bg-label\">{{ 'Admin.DomainConfig.CsImageBg' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImageBg' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Pdf Image Bg'\"\n [controlName]=\"'cs_image_bg'\" [previewData]=\"data['cs_image_bg']\">\n </pw-custom-uploader>\n </div>\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-cs_image_bg2-label\">{{ 'Admin.DomainConfig.CsImageBg2' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImageBg2' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Pdf Image Bg2'\"\n [controlName]=\"'cs_image_bg2'\" [previewData]=\"data['cs_image_bg2']\">\n </pw-custom-uploader>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n </p-accordion>\n </div>\n\n <div class=\"col-12 text-end mt-3\">\n <button type=\"button\"\n class=\"btn btn-outline-default me-2\"\n (click)=\"back()\">\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button type=\"submit\" [buttonBusy]=\"buttonBusy\"\n class=\"btn btn-primary\">{{ 'Button.Submit' | transloco }}</button>\n </div>\n </form>\n</ng-container>\n<div *ngIf=\"!data?.host_name && !isLoading\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Admin.DomainConfig.EnableConfigTab' | transloco\"> </pw-no-data>\n</div>\n\n\n<ng-template #partnerCropper let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Upload Partner Image</h5>\n <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n </div>\n <div class=\"modal-body\">\n <small>You can upload JPG, PNG, or GIF files. Avoid images with celebrities, nudity, or artwork.</small>\n <pw-image-cropper\n aspectRatio=\"auto\"\n (imageSelectionEvent)=\"onPartnerImageSelected($event)\"\n (closeEvent)=\"onClosePartnerModal()\"\n ></pw-image-cropper>\n </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i3$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i4$2.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: i7.Accordion, selector: "p-accordion", inputs: ["value", "multiple", "style", "styleClass", "expandIcon", "collapseIcon", "selectOnFocus", "transitionOptions", "activeIndex", "headerAriaLevel"], outputs: ["valueChange", "activeIndexChange", "onClose", "onOpen"] }, { kind: "component", type: i7.AccordionPanel, selector: "p-accordion-panel, p-accordionpanel", inputs: ["value", "disabled"], outputs: ["valueChange"] }, { kind: "component", type: i7.AccordionHeader, selector: "p-accordion-header, p-accordionheader" }, { kind: "component", type: i7.AccordionContent, selector: "p-accordion-content, p-accordioncontent" }, { kind: "component", type: i5$1.AutoComplete, selector: "p-autoComplete, p-autocomplete, p-auto-complete", inputs: ["minLength", "delay", "style", "panelStyle", "styleClass", "panelStyleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "readonly", "disabled", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "maxlength", "name", "required", "size", "appendTo", "autoHighlight", "forceSelection", "type", "autoZIndex", "baseZIndex", "ariaLabel", "dropdownAriaLabel", "ariaLabelledBy", "dropdownIcon", "unique", "group", "completeOnFocus", "showClear", "field", "dropdown", "showEmptyMessage", "dropdownMode", "multiple", "tabindex", "dataKey", "emptyMessage", "showTransitionOptions", "hideTransitionOptions", "autofocus", "autocomplete", "optionGroupChildren", "optionGroupLabel", "overlayOptions", "suggestions", "itemSize", "optionLabel", "optionValue", "id", "searchMessage", "emptySelectionMessage", "selectionMessage", "autoOptionFocus", "selectOnFocus", "searchLocale", "optionDisabled", "focusOnHover", "typeahead", "variant", "fluid"], outputs: ["completeMethod", "onSelect", "onUnselect", "onFocus", "onBlur", "onDropdownClick", "onClear", "onKeyUp", "onShow", "onHide", "onLazyLoad"] }, { kind: "component", type: i3.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "size", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "fluid", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: i2$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i4.UiSwitchComponent, selector: "ui-switch", inputs: ["size", "color", "switchOffColor", "switchColor", "defaultBgColor", "defaultBoColor", "checkedLabel", "uncheckedLabel", "checkedTextColor", "uncheckedTextColor", "beforeChange", "ariaLabel", "checked", "disabled", "reverse", "loading"], outputs: ["change", "changeEvent", "valueChange"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i13.ProfileImageCropperComponent, selector: "pw-image-cropper", inputs: ["aspectRatio", "dynamicData"], outputs: ["imageSelectionEvent", "closeEvent", "fileChangeEvent"] }, { kind: "component", type: i13.CustomUploaderComponent, selector: "pw-custom-uploader", inputs: ["controlName", "previewData", "aspectRatio", "title"], outputs: ["saveEvent"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "controlId", "useAriaLabelledbyOnly", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "component", type: i1$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i15.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep", "cdkDropListElementContainer"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i15.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer", "cdkDragScale"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "directive", type: i15.CdkDragHandle, selector: "[cdkDragHandle]", inputs: ["cdkDragHandleDisabled"] }, { kind: "directive", type: i10.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i3$2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i3$2.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
|
|
1387
1387
|
}
|
|
1388
1388
|
__decorate([
|
|
1389
1389
|
ValidateForm('form'),
|
|
@@ -1393,7 +1393,7 @@ __decorate([
|
|
|
1393
1393
|
], DomainConfigBuildComponent.prototype, "onSave", null);
|
|
1394
1394
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: DomainConfigBuildComponent, decorators: [{
|
|
1395
1395
|
type: Component,
|
|
1396
|
-
args: [{ selector: 'pw-domain-config-build', standalone: false, template: "<h3>Public Pages Configuration</h3>\n<div class=\"mb-4\">\n <p> The following parameters and settings will be applied to all public pages of this domain. </p>\n</div>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"isLoading\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<ng-container *ngIf=\"!isLoading && data?.host_name\">\n <form [formGroup]=\"form\"\n (ngSubmit)=\"onSave()\">\n <div class=\"row\">\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.MasterSubscription' | transloco\"\n name=\"master_subscription_id\" controlId=\"domain-build-master_subscription_id\" [useAriaLabelledbyOnly]=\"true\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.MasterSubscription' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'domain-build-master_subscription_id-label'\"\n [options]=\"masterSubscriptionsList\"\n formControlName=\"master_subscription_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['master_subscription_id']?.errors }\"\n placeholder=\"Select Master Subscription\">\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.MasterSubscriptionProduct' | transloco\"\n [showTooltip]=\"true\"\n [tooltipText]=\"\n 'Admin.DomainConfig.Tooltip.MasterSubscriptionProduct' | transloco\n \"\n name=\"master_subscription_product_id\" controlId=\"domain-build-master_subscription_product_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'domain-build-master_subscription_product_id-label'\"\n [options]=\"masterSubscriptionProductList\"\n formControlName=\"master_subscription_product_id\"\n [ngClass]=\"{'is-invalid': submitted && f['master_subscription_product_id']?.errors}\"\n [placeholder]=\"'Select Master Product'\"\n optionValue=\"id\"\n optionLabel=\"name\"\n >\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.BlogFeatureKey' | transloco\"\n name=\"blog_feature_key\" controlId=\"domain-build-blog_feature_key\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.BlogFeatureKey' | transloco\">\n <input type=\"text\"\n id=\"domain-build-blog_feature_key\"\n class=\"form-control\"\n formControlName=\"blog_feature_key\"\n [ngClass]=\"{ 'is-invalid': submitted && f['blog_feature_key'].errors }\" />\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.MainTos' | transloco\"\n name=\"main_tos_id\" controlId=\"domain-build-main_tos_id\" [useAriaLabelledbyOnly]=\"true\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.MainTos' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'domain-build-main_tos_id-label'\"\n [options]=\"subscriptionTosList\"\n formControlName=\"main_tos_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['main_tos_id']?.errors }\"\n [placeholder]=\"'Select Main TOS'\"\n optionValue=\"id\">\n <ng-template pTemplate=\"selectedItem\" let-item>\n <span [innerHTML]=\"item.title\"></span>\n </ng-template>\n <ng-template pTemplate=\"item\" let-item>\n <span [innerHTML]=\"item.title\"></span>\n </ng-template>\n </p-select>\n\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CrmSubscription' | transloco\"\n name=\"crm_subscription_id\" controlId=\"domain-build-crm_subscription_id\" [useAriaLabelledbyOnly]=\"true\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.CrmSubscription' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'domain-build-crm_subscription_id-label'\"\n [options]=\"crmSubscriptionsList\"\n formControlName=\"crm_subscription_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['crm_subscription_id']?.errors }\"\n [placeholder]=\"'Select CRM Subscription'\"\n optionValue=\"id\">\n <ng-template pTemplate=\"selectedItem\" let-item>\n {{item?.organisation ? item?.organisation + ' - ' + item.contact_name : item?.contact_name}}\n </ng-template>\n <ng-template pTemplate=\"item\" let-item>\n {{item?.organisation ? item?.organisation + ' - ' + item.contact_name : item?.contact_name}}\n </ng-template>\n </p-select>\n\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CrmProduct' | transloco\"\n name=\"crm_product_id\" controlId=\"domain-build-crm_product_id\" [useAriaLabelledbyOnly]=\"true\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.CrmProduct' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'domain-build-crm_product_id-label'\"\n [options]=\"crmProductList\"\n formControlName=\"crm_product_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['crm_product_id']?.errors }\"\n [placeholder]=\"'Select CRM Product'\"\n optionValue=\"id\"\n >\n <ng-template pTemplate=\"selectedItem\" let-item>\n {{item?.subscription_id ? item?.name +' - SubscriptionID = '+ item.subscription_id : item?.name}}\n </ng-template>\n <ng-template pTemplate=\"item\" let-item>\n {{item?.subscription_id ? item?.name +' - SubscriptionID = '+ item.subscription_id : item?.name}}\n </ng-template>\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CrmSource' | transloco\"\n name=\"crm_source_id\" controlId=\"domain-build-crm_source_id\" [useAriaLabelledbyOnly]=\"true\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.CrmSource' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'domain-build-crm_source_id-label'\"\n [options]=\"crmSourcesList\"\n formControlName=\"crm_source_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['crm_source_id']?.errors }\"\n [placeholder]=\"'Select CRM Source'\"\n optionValue=\"id\"\n optionLabel=\"name\"\n >\n </p-select>\n </pw-input-container>\n </div>\n <!-- crm subscription fields end-->\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.Active' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.Active' | transloco\" name=\"active\" controlId=\"domain-build-active\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch size=\"small\" [attr.aria-labelledby]=\"'domain-build-active-label'\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"active\" name=\"active\"\n [ngClass]=\"{ 'is-invalid': submitted && f['active'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.IsProductDomain' | transloco\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.IsProductDomain' | transloco\"\n name=\"is_product_domain\" controlId=\"domain-build-is_product_domain\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch size=\"small\" [attr.aria-labelledby]=\"'domain-build-is_product_domain-label'\"\n uncheckedLabel=\"false\"\n checkedLabel=\"true\"\n formControlName=\"is_product_domain\"\n name=\"is_product_domain\"\n [ngClass]=\"{ 'is-invalid': submitted && f['is_product_domain'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CanRegisterOnMainPage' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.CanRegisterOnMainPage' | transloco\"\n name=\"can_register_through_main_page\" controlId=\"domain-build-can_register_through_main_page\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch size=\"small\" [attr.aria-labelledby]=\"'domain-build-can_register_through_main_page-label'\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"can_register_through_main_page\"\n name=\"can_register_through_main_page\" [ngClass]=\"{\n 'is-invalid': submitted && f['can_register_through_main_page'].errors\n }\">\n </ui-switch>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.SocialLoginEnabled' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.SocialLoginEnable' | transloco\" name=\"social_login_enabled\" controlId=\"domain-build-social_login_enabled\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch size=\"small\" [attr.aria-labelledby]=\"'domain-build-social_login_enabled-label'\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"social_login_enabled\"\n name=\"social_login_enabled\" [ngClass]=\"{ 'is-invalid': submitted && f['social_login_enabled'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.NotifyLogins' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.NotifyLogins' | transloco\" name=\"notify_logins\" controlId=\"domain-build-notify_logins\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch size=\"small\" [attr.aria-labelledby]=\"'domain-build-notify_logins-label'\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"notify_logins\"\n name=\"notify_logins\" [ngClass]=\"{ 'is-invalid': submitted && f['notify_logins'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n\n <div class=\"my-5\">\n <h3>Pre-Built Pages Config (Resources, Landing Pages, etc)</h3>\n\n <p-accordion class=\"mt-5\">\n <p-accordion-panel value=\"0\">\n <p-accordion-header>Instructions - README FIRST</p-accordion-header>\n <p-accordion-content>\n <div class=\"mb-3\">\n <p>We've built and maintain a collection of high-converting landing pages designed to help you quickly launch polished\n UIs for onboarding users.</p>\n <p><strong>Newsletter Subscription Pages:</strong><br> After configuring your domain, you can access pages like\n <strong>/join/cs1, /join/cs2, /join/cs3, etc.</strong>, specifically designed for newsletter sign-ups. <br>\n Subscribers from these pages will be listed in the <strong>SmartCRM module</strong>.</p>\n <p><strong>Trial Product Sign-Up Pages:</strong><br> For users interested in trial products, utilize pages such as\n <strong>/join/trial1, /join/trial2, /join/trial3, etc.</strong>.<br> Users registering through these pages will\n appear in the <strong>Admin > Users section</strong>.</p>\n <p>Once you've selected the landing page you want to use <strong>(e.g., /join/trial3)</strong>, make sure to update\n the <strong>Internal Path</strong> in the <strong>Core tab</strong> accordingly\u2014i.e., set it to\n <strong>/join/trial3</strong>.</p>\n <p>If you need assistance integrating these pages into your workflow or have further questions, feel free to reach\n out.</p>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n <p-accordion-panel value=\"1\">\n <p-accordion-header>Subscribe to Product/Newsletter Config</p-accordion-header>\n <p-accordion-content>\n <div class=\"mb-3\">\n <p>Trial Pages will enable users to sign up to real products and are accessible at the path /join/trial1,\n /join/trial2, etc.</p>\n <p>ComingSoon Pages will enable users to subscribe to Newsletters and are accessible at the internal paths\n /join/cs1, /join/cs2, etc.</p>\n </div>\n <!-- live page link -->\n <div class=\"text-end\" *ngIf=\"shardUrl\">\n <span>See the live page <span class=\"tooltip-wrap ms-1\" [appendTo]=\"'body'\"\n [pTooltip]=\"'Admin.DomainConfig.Tooltip.SeeLiveTrial' | transloco\" tooltipPosition=\"top\">\n <i class=\"fas fa-info-circle\"></i>\n </span> : <a [href]=\"shardUrl + '/join/trial1'\" target=\"_blank\">{{ shardUrl }}/join/trial1</a></span>\n </div>\n <div class=\"row\">\n <div class=\"col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.TrialProduct' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.TrialProduct' | transloco\" name=\"trial_product_id\" controlId=\"domain-build-trial_product_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-autoComplete [attr.aria-labelledby]=\"'domain-build-trial_product_id-label'\" [suggestions]=\"productsList\" formControlName=\"trial_product_id\" dataKey=\"id\" field=\"name\"\n [dropdown]=\"true\" [delay]=\"1000\" (completeMethod)=\"searchProduct($event)\" styleClass=\"w-100\"\n placeholder=\"Search Product\" [inputStyle]=\"\n form.get('trial_product_id').touched &&\n form.get('trial_product_id').invalid\n ? { border: '1px solid #ff586b' }\n : { border: '1px solid gray' }\n \" [multiple]=\"false\">\n </p-autoComplete>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.TrialCrmSourceId' | transloco\" name=\"trial_crm_source_id\" controlId=\"domain-build-trial_crm_source_id\" [useAriaLabelledbyOnly]=\"true\"\n [showTooltip]=\"true\" [tooltipText]=\"\n 'Admin.DomainConfig.Tooltip.TrialCrmSourceId' | transloco\n \">\n <p-select [options]=\"crmSourcesList\" [attr.aria-labelledby]=\"'domain-build-trial_crm_source_id-label'\" formControlName=\"trial_crm_source_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['trial_crm_source_id']?.errors }\"\n [placeholder]=\"'Select CRM Source'\" optionValue=\"id\" optionLabel=\"name\">\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.TrialPdfSourceId' | transloco\" name=\"trial_pdf_source_id\" controlId=\"domain-build-trial_pdf_source_id\" [useAriaLabelledbyOnly]=\"true\"\n [showTooltip]=\"true\" [tooltipText]=\"\n 'Admin.DomainConfig.Tooltip.TrialPdfSourceId' | transloco\n \">\n <p-select [options]=\"crmSourcesList\" [attr.aria-labelledby]=\"'domain-build-trial_pdf_source_id-label'\" formControlName=\"trial_pdf_source_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['trial_pdf_source_id']?.errors }\"\n [placeholder]=\"'Select CRM Source'\" optionValue=\"id\" optionLabel=\"name\">\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\"></div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.TrialVideoUrl' | transloco\" name=\"trial_video_url\" controlId=\"domain-build-trial_video_url\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.TrialVideoUrl' | transloco\">\n <input type=\"text\" id=\"domain-build-trial_video_url\" class=\"form-control\" formControlName=\"trial_video_url\"\n [ngClass]=\"{ 'is-invalid': submitted && f['trial_video_url'].errors }\" />\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.TrialBookDemoUrl' | transloco\" name=\"trial_book_demo_url\" controlId=\"domain-build-trial_book_demo_url\"\n [showTooltip]=\"true\" [tooltipText]=\"\n 'Admin.DomainConfig.Tooltip.TrialBookDemoUrl' | transloco\n \">\n <input type=\"text\" id=\"domain-build-trial_book_demo_url\" class=\"form-control\" formControlName=\"trial_book_demo_url\" [ngClass]=\"{\n 'is-invalid': submitted && f['trial_book_demo_url'].errors\n }\" />\n </pw-input-container>\n </div>\n <div class=\"col-12\">\n <pw-input-container [label]=\"'Admin.DomainConfig.TrialCtaIframe' | transloco\" name=\"trial_cta_iframe\" controlId=\"domain-build-trial_cta_iframe\"\n [showTooltip]=\"true\" [tooltipText]=\"\n 'Admin.DomainConfig.Tooltip.TrialCtaIframe' | transloco\n \">\n <textarea id=\"domain-build-trial_cta_iframe\" rows=\"3\" class=\"form-control\" formControlName=\"trial_cta_iframe\" [ngClass]=\"{\n 'is-invalid': submitted && f['trial_cta_iframe'].errors\n }\">\n </textarea>\n </pw-input-container>\n </div>\n <div class=\"col-12\">\n <pw-input-container [label]=\"'Admin.DomainConfig.TrialJoinMessage' | transloco\" name=\"trial_join_message\" controlId=\"domain-build-trial_join_message\"\n [showTooltip]=\"true\" [tooltipText]=\"\n 'Admin.DomainConfig.Tooltip.TrialJoinMessage' | transloco\n \">\n <textarea id=\"domain-build-trial_join_message\" rows=\"3\" class=\"form-control\" formControlName=\"trial_join_message\" [ngClass]=\"{\n 'is-invalid': submitted && f['trial_join_message'].errors\n }\">\n </textarea>\n </pw-input-container>\n </div>\n <div class=\"col-12\">\n <pw-input-container [label]=\"'Admin.DomainConfig.TrialPdfDownloadText' | transloco\" name=\"trial_pdf_download_text\" controlId=\"domain-build-trial_pdf_download_text\"\n [showTooltip]=\"true\" [tooltipText]=\"\n 'Admin.DomainConfig.Tooltip.TrialPdfDownloadText' | transloco\n \">\n <textarea id=\"domain-build-trial_pdf_download_text\" rows=\"3\" class=\"form-control\" formControlName=\"trial_pdf_download_text\" [ngClass]=\"{\n 'is-invalid': submitted && f['trial_pdf_download_text'].errors\n }\">\n </textarea>\n </pw-input-container>\n </div>\n </div>\n <div class=\"row\" matchHeight=\"card\">\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-trial_image-label\">{{ 'Admin.DomainConfig.TrialImage' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImage' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Trial Image'\"\n [controlName]=\"'trial_image'\" [previewData]=\"data['trial_image']\">\n </pw-custom-uploader>\n </div>\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-trial_image2-label\">{{ 'Admin.DomainConfig.TrialImage2' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImage2' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Image2'\" [aspectRatio]=\"'custom'\"\n [controlName]=\"'trial_image2'\" [previewData]=\"data['trial_image2']\">\n </pw-custom-uploader>\n </div>\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-trial_pdf_image-label\">{{ 'Admin.DomainConfig.TrialPdfImage' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialPdfImage' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Pdf Image'\" [aspectRatio]=\"'custom'\"\n [controlName]=\"'trial_pdf_image'\" [previewData]=\"data['trial_pdf_image']\">\n </pw-custom-uploader>\n </div>\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-trial_image_bg-label\">{{ 'Admin.DomainConfig.TrialImageBg' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImageBg' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Image Bg'\" [aspectRatio]=\"'custom'\"\n [controlName]=\"'trial_image_bg'\" [previewData]=\"data['trial_image_bg']\">\n </pw-custom-uploader>\n </div>\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-trial_image_bg2-label\">{{ 'Admin.DomainConfig.TrialImageBg2' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImageBg2' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Image Bg2'\" [aspectRatio]=\"'custom'\"\n [controlName]=\"'trial_image_bg2'\" [previewData]=\"data['trial_image_bg2']\">\n </pw-custom-uploader>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n <p-accordion-panel value=\"2\">\n <p-accordion-header>Header Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-4\" formGroupName=\"header\">\n <h4 class=\"mb-4\">Header Section</h4>\n\n <!-- Headline -->\n <div class=\"col-12 col-md-12\">\n <pw-input-container label=\"Header Headline\" name=\"headline\" controlId=\"domain-build-header-headline\">\n <input type=\"text\" id=\"domain-build-header-headline\" class=\"form-control\" formControlName=\"headline\" />\n </pw-input-container>\n </div>\n\n <!-- Video URL -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"Header Video URL\" name=\"video_url\" controlId=\"domain-build-header-video_url\">\n <input type=\"text\" id=\"domain-build-header-video_url\" class=\"form-control\" formControlName=\"video_url\" />\n </pw-input-container>\n </div>\n\n <!-- Background Image URL -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"Header Background Image URL\" name=\"bg_image_url\" controlId=\"domain-build-header-bg_image_url\">\n <input type=\"text\" id=\"domain-build-header-bg_image_url\" class=\"form-control\" formControlName=\"bg_image_url\" />\n </pw-input-container>\n </div>\n\n <!-- Description -->\n <div class=\"col-12\">\n <pw-input-container label=\"Header Description\" name=\"description\" controlId=\"domain-build-header-description\">\n <textarea\n id=\"domain-build-header-description\"\n class=\"form-control\"\n rows=\"5\"\n formControlName=\"description\"\n [ngClass]=\"{ 'is-invalid': submitted && f['description']?.errors }\"\n ></textarea>\n </pw-input-container>\n </div>\n\n <!-- Sub Headings -->\n <div formArrayName=\"sub_headings\" class=\"col-12\" cdkDropList (cdkDropListDropped)=\"dropItems(headerSubHeadings, $event)\">\n <div\n *ngFor=\"let sub of f['header'].get('sub_headings')['controls']; let i = index\"\n [formGroupName]=\"i\"\n class=\"row mb-3 align-items-center\"\n cdkDrag\n >\n <div class=\"col-md-10\">\n <pw-input-container label=\"Sub Header Description\" name=\"description\" [controlId]=\"'domain-build-header-sub_description-' + i\">\n <textarea\n [id]=\"'domain-build-header-sub_description-' + i\"\n class=\"form-control\"\n rows=\"3\"\n formControlName=\"description\"\n [ngClass]=\"{ 'is-invalid': submitted && f['description']?.errors }\"\n ></textarea>\n </pw-input-container>\n </div>\n\n <div class=\"col-md-1 d-flex justify-content-end mt-3\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeHeaderSubHeading(i)\"\n (keydown.enter)=\"removeHeaderSubHeading(i)\"\n (keydown.space)=\"removeHeaderSubHeading(i)\"\n ngbTooltip=\"Remove\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-md-1 d-flex justify-content-end mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addHeaderSubHeading()\">\n + Add Sub Heading\n </button>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n <p-accordion-panel value=\"3\">\n <p-accordion-header>Resources Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row row mt-4 mb-4\">\n <h4 class=\"mb-3\">Resources Section</h4>\n <div class=\"col-12 col-sm-6\">\n <pw-input-container [label]=\"'Admin.DomainConfig.ResourceTagline' | transloco\" name=\"resources_tagline\" controlId=\"domain-build-resources_tagline\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.ResourceTagline' | transloco\">\n <input type=\"text\" id=\"domain-build-resources_tagline\" class=\"form-control\" formControlName=\"resources_tagline\"\n [ngClass]=\"{ 'is-invalid': submitted && f['resources_tagline'].errors }\" />\n </pw-input-container>\n </div>\n <div class=\"col-12\">\n <pw-input-container [label]=\"'Admin.DomainConfig.ResourceDescription' | transloco\" name=\"resources_description\" controlId=\"domain-build-resources_description\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.ResourceDescription' | transloco\">\n <textarea id=\"domain-build-resources_description\" class=\"form-control\" rows=\"3\" formControlName=\"resources_description\"\n [ngClass]=\"{ 'is-invalid': submitted && f['resources_description'].errors }\">\n </textarea>\n </pw-input-container>\n </div>\n </div>\n <div class=\"row\" matchHeight=\"card\">\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-resource_image-label\">{{ 'Admin.DomainConfig.ResourceImage' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.ResourceImage' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Image'\"\n [controlName]=\"'resources_image'\" [previewData]=\"data['resources_image']\">\n </pw-custom-uploader>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n <p-accordion-panel value=\"4\">\n <p-accordion-header>Unique Selling Proposition Section (USP)</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-4 mb-4\" formGroupName=\"usps\">\n <h4 class=\"mb-4\">Unique Selling Proposition Section (USP)</h4>\n\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"USPs Title\" name=\"title\" controlId=\"domain-build-usps-title\">\n <input type=\"text\" id=\"domain-build-usps-title\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"USPs Video Url\" name=\"video_url\" controlId=\"domain-build-usps-video_url\">\n <input type=\"text\" id=\"domain-build-usps-video_url\" class=\"form-control\" formControlName=\"video_url\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12\">\n <pw-input-container label=\"USPs Description\" name=\"description\" controlId=\"domain-build-usps-description\">\n <textarea id=\"domain-build-usps-description\" class=\"form-control\" rows=\"3\" formControlName=\"description\"></textarea>\n </pw-input-container>\n </div>\n\n <!-- USP Items -->\n <div formArrayName=\"items\" class=\"col-12\" cdkDropList (cdkDropListDropped)=\"dropItems(uspsItems, $event)\">\n <div\n *ngFor=\"let item of f['usps'].get('items')['controls']; let i = index\"\n [formGroupName]=\"i\"\n class=\"row mb-3 align-items-center\"\n cdkDrag\n >\n <div class=\"col-sm-10\">\n <pw-input-container label=\"Item Description\" name=\"description\" [controlId]=\"'domain-build-usps-item-desc-' + i\">\n <textarea [id]=\"'domain-build-usps-item-desc-' + i\" class=\"form-control\" rows=\"3\" formControlName=\"description\"></textarea>\n </pw-input-container>\n </div>\n\n <div class=\"col-sm-1 d-flex justify-content-end mt-3\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeUspItem(i)\"\n (keydown.enter)=\"removeUspItem(i)\"\n (keydown.space)=\"removeUspItem(i)\"\n ngbTooltip=\"Remove\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-sm-1 d-flex justify-content-end mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addUspItem()\">\n + Add USP Item\n </button>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n <p-accordion-panel value=\"5\">\n <p-accordion-header>Partners (Clients) Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-4 mb-4\" formGroupName=\"partners\">\n <h4 class=\"mb-4\">Partners (Clients) Section</h4>\n\n <!-- Title -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"Partner Title\" name=\"title\" controlId=\"domain-build-partners-title\">\n <input type=\"text\" id=\"domain-build-partners-title\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n </div>\n\n <!-- Description -->\n <div class=\"col-12\">\n <pw-input-container label=\"Partners Description\" name=\"description\" controlId=\"domain-build-partners-description\">\n <textarea id=\"domain-build-partners-description\" class=\"form-control\" rows=\"3\" formControlName=\"description\"></textarea>\n </pw-input-container>\n </div>\n\n <!-- Partner Items with Drag Support -->\n <div formArrayName=\"items\" class=\"col-12\" cdkDropList (cdkDropListDropped)=\"dropItems(partnersItems, $event)\">\n <div\n *ngFor=\"let item of partnersItems.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row border p-3 mb-3 align-items-start\"\n cdkDrag\n >\n <!-- Name -->\n <div class=\"col-md-6\">\n <pw-input-container label=\"Name\" class=\"col-12\" name=\"name\" [controlId]=\"'domain-build-partner-name-' + i\">\n <input [id]=\"'domain-build-partner-name-' + i\" class=\"form-control\" formControlName=\"name\" />\n </pw-input-container>\n </div>\n\n <!-- Blog URL + Drag Handle -->\n <div class=\"col-md-5\">\n <pw-input-container label=\"Blog Url\" name=\"blog_url\" [controlId]=\"'domain-build-partner-blog_url-' + i\">\n <input [id]=\"'domain-build-partner-blog_url-' + i\" class=\"form-control\" formControlName=\"blog_url\" />\n </pw-input-container>\n </div>\n\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder question\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n\n <!-- Video URL -->\n <div class=\"col-md-6\">\n <pw-input-container label=\"Video Url\" name=\"video_url\" [controlId]=\"'domain-build-partner-video_url-' + i\">\n <input [id]=\"'domain-build-partner-video_url-' + i\" class=\"form-control\" formControlName=\"video_url\" />\n </pw-input-container>\n </div>\n\n <!-- Image URL -->\n <div class=\"col-md-6\">\n <pw-input-container label=\"Image Url\" name=\"image_url\" [controlId]=\"'domain-build-partner-image_url-' + i\">\n <input [id]=\"'domain-build-partner-image_url-' + i\" class=\"form-control\" formControlName=\"image_url\" />\n </pw-input-container>\n </div>\n\n <!-- Delete Icon -->\n <div class=\"col-md-12 text-end mt-2\">\n <i\n ngbTooltip=\"Remove\"\n (click)=\"removePartnerItem(i)\"\n (keydown.enter)=\"removePartnerItem(i)\"\n (keydown.space)=\"removePartnerItem(i)\"\n class=\"fa fa-trash delete-icon text-danger\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <!-- Add New Partner -->\n <div class=\"text-start mt-2\">\n <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addPartnerItem()\">+ Add Partner</button>\n </div>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n <p-accordion-panel value=\"6\">\n <p-accordion-header>Testimonials Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-3 mb-4\" formGroupName=\"testimonials\">\n <h4 class=\"mb-4\">Testimonials Section</h4>\n\n <pw-input-container label=\"Title\" class=\"col-12 col-md-6\" name=\"testimonials_title\" controlId=\"domain-build-testimonials-title\">\n <input type=\"text\" id=\"domain-build-testimonials-title\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n\n <pw-input-container label=\"Description\" class=\"col-12\" name=\"testimonials_description\" controlId=\"domain-build-testimonials-description\">\n <textarea id=\"domain-build-testimonials-description\" rows=\"3\" class=\"form-control\" formControlName=\"description\"></textarea>\n </pw-input-container>\n\n <!-- Items List -->\n <div formArrayName=\"items\" class=\"col-12 mt-3\" cdkDropList (cdkDropListDropped)=\"dropItems(testimonialsItems, $event)\">\n <div\n *ngFor=\"let item of testimonialsItems.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row border p-3 mb-3 align-items-start\"\n cdkDrag\n >\n <div class=\"col-md-6\">\n <pw-input-container label=\"Name\" name=\"name\" [controlId]=\"'domain-build-testimonial-name-' + i\">\n <input type=\"text\" [id]=\"'domain-build-testimonial-name-' + i\" class=\"form-control\" formControlName=\"name\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-md-5\">\n <pw-input-container label=\"Blog URL\" name=\"blog_url\" [controlId]=\"'domain-build-testimonial-blog_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-testimonial-blog_url-' + i\" class=\"form-control\" formControlName=\"blog_url\" />\n </pw-input-container>\n </div>\n\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder question\"\n aria-hidden=\"true\"\n ></i>\n </div>\n <pw-input-container label=\"Image URL\" class=\"col-md-6\" name=\"image_url\" [controlId]=\"'domain-build-testimonial-image_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-testimonial-image_url-' + i\" class=\"form-control\" formControlName=\"image_url\" />\n </pw-input-container>\n\n <pw-input-container label=\"Video URL\" class=\"col-md-6\" name=\"video_url\" [controlId]=\"'domain-build-testimonial-video_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-testimonial-video_url-' + i\" class=\"form-control\" formControlName=\"video_url\" />\n </pw-input-container>\n\n <pw-input-container label=\"Testimonial\" class=\"col-md-10\" name=\"testimonial\" [controlId]=\"'domain-build-testimonial-text-' + i\">\n <textarea [id]=\"'domain-build-testimonial-text-' + i\" class=\"form-control\" rows=\"3\" formControlName=\"testimonial\"></textarea>\n </pw-input-container>\n\n <div class=\"col-md-2 d-flex align-items-start mt-3\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n ngbTooltip=\"Remove\"\n (click)=\"removeTestimonialItem(i)\"\n (keydown.enter)=\"removeTestimonialItem(i)\"\n (keydown.space)=\"removeTestimonialItem(i)\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <div class=\"text-start mt-2\">\n <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addTestimonialItem()\">\n + Add Testimonial\n </button>\n </div>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n <p-accordion-panel value=\"7\">\n <p-accordion-header>Video Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-3 mb-4\" formGroupName=\"videos\">\n <h4 class=\"mb-3\">Video Section</h4>\n\n <pw-input-container label=\"Title\" class=\"col-12 col-md-6\" name=\"videos_title\" controlId=\"domain-build-videos-title\">\n <input type=\"text\" id=\"domain-build-videos-title\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n\n <pw-input-container label=\"Description\" class=\"col-12\" name=\"videos_description\" controlId=\"domain-build-videos-description\">\n <textarea id=\"domain-build-videos-description\" rows=\"3\" class=\"form-control\" formControlName=\"description\"></textarea>\n </pw-input-container>\n\n <!-- Video Items -->\n <div\n formArrayName=\"items\"\n class=\"col-12 mt-3\"\n cdkDropList\n (cdkDropListDropped)=\"dropItems(videosItems, $event)\"\n >\n <div\n *ngFor=\"let item of videosItems.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row border p-3 mb-3 align-items-start\"\n cdkDrag\n >\n <div class=\"col-md-6\">\n <pw-input-container label=\"Title\" name=\"title\" [controlId]=\"'domain-build-video-item-title-' + i\">\n <input type=\"text\" [id]=\"'domain-build-video-item-title-' + i\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-md-5\">\n <pw-input-container label=\"Blog URL\" name=\"blog_url\" [controlId]=\"'domain-build-video-item-blog_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-video-item-blog_url-' + i\" class=\"form-control\" formControlName=\"blog_url\" />\n </pw-input-container>\n </div>\n\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder question\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <pw-input-container label=\"Image URL\" class=\"col-md-6\" name=\"image_url\" [controlId]=\"'domain-build-video-item-image_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-video-item-image_url-' + i\" class=\"form-control\" formControlName=\"image_url\" />\n </pw-input-container>\n\n <pw-input-container label=\"Video URL\" class=\"col-md-6\" name=\"video_url\" [controlId]=\"'domain-build-video-item-video_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-video-item-video_url-' + i\" class=\"form-control\" formControlName=\"video_url\" />\n </pw-input-container>\n\n <pw-input-container label=\"Description\" class=\"col-md-10\" name=\"description\" [controlId]=\"'domain-build-video-item-description-' + i\">\n <textarea [id]=\"'domain-build-video-item-description-' + i\" class=\"form-control\" rows=\"3\" formControlName=\"description\"></textarea>\n </pw-input-container>\n\n <div class=\"col-md-2 d-flex align-items-start mt-3\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeVideoItem(i)\"\n (keydown.enter)=\"removeVideoItem(i)\"\n (keydown.space)=\"removeVideoItem(i)\"\n ngbTooltip=\"Remove\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <div class=\"text-start mt-2\">\n <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addVideoItem()\">\n + Add Video\n </button>\n </div>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n <p-accordion-panel value=\"8\">\n <p-accordion-header>Call to Actions Section (CTAs)</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-4 mb-4\" formGroupName=\"ctas\">\n <h4 class=\"mb-4\">CTAs Section</h4>\n\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"Title\" name=\"title\" controlId=\"domain-build-ctas-title\">\n <input type=\"text\" id=\"domain-build-ctas-title\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"Image URL\" name=\"image_url\" controlId=\"domain-build-ctas-image_url\">\n <input type=\"text\" id=\"domain-build-ctas-image_url\" class=\"form-control\" formControlName=\"image_url\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"Button Text\" name=\"button_text\" controlId=\"domain-build-ctas-button_text\">\n <input type=\"text\" id=\"domain-build-ctas-button_text\" class=\"form-control\" formControlName=\"button_text\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12\">\n <pw-input-container label=\"Description\" name=\"description\" controlId=\"domain-build-ctas-description\">\n <input type=\"text\" id=\"domain-build-ctas-description\" class=\"form-control\" formControlName=\"description\" />\n </pw-input-container>\n </div>\n\n <!-- CTA Items -->\n <div formArrayName=\"items\" class=\"col-12 mt-3\" cdkDropList (cdkDropListDropped)=\"dropItems(ctasItems, $event)\">\n <div\n *ngFor=\"let item of ctasItems.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row border p-3 mb-3 align-items-start\"\n cdkDrag\n >\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"Image URL\" name=\"image_url\" [controlId]=\"'domain-build-cta-item-image_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-cta-item-image_url-' + i\" class=\"form-control\" formControlName=\"image_url\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-md-5\">\n <pw-input-container label=\"Cta URL\" name=\"cta_url\" [controlId]=\"'domain-build-cta-item-cta_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-cta-item-cta_url-' + i\" class=\"form-control\" formControlName=\"cta_url\" />\n </pw-input-container>\n </div>\n\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder question\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"Video URL\" name=\"video_url\" [controlId]=\"'domain-build-cta-item-video_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-cta-item-video_url-' + i\" class=\"form-control\" formControlName=\"video_url\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"CTA Title\" name=\"title\" [controlId]=\"'domain-build-cta-item-title-' + i\">\n <input [id]=\"'domain-build-cta-item-title-' + i\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"CTA Description\" name=\"description\" [controlId]=\"'domain-build-cta-item-description-' + i\">\n <input [id]=\"'domain-build-cta-item-description-' + i\" class=\"form-control\" formControlName=\"description\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-5\">\n <pw-input-container label=\"Button Text\" name=\"button_text\" [controlId]=\"'domain-build-cta-item-button_text-' + i\">\n <input [id]=\"'domain-build-cta-item-button_text-' + i\" class=\"form-control\" formControlName=\"button_text\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-md-1 d-flex align-items-center mt-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"removeCtasItem(i)\"\n (keydown.enter)=\"removeCtasItem(i)\"\n (keydown.space)=\"removeCtasItem(i)\"\n ngbTooltip=\"Remove\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <div class=\"text-start mt-2\">\n <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addCtasItem()\">+ Add CTA Item</button>\n </div>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n <p-accordion-panel value=\"9\">\n <p-accordion-header>Integrations Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-3 mb-4\" formGroupName=\"integrations\">\n <h4 class=\"mb-3\">Integrations Section</h4>\n\n <pw-input-container label=\"Title\" class=\"col-12\" name=\"title\" controlId=\"domain-build-integrations-title\">\n <input type=\"text\" id=\"domain-build-integrations-title\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n\n <pw-input-container label=\"Description\" class=\"col-12\" name=\"description\" controlId=\"domain-build-integrations-description\">\n <textarea id=\"domain-build-integrations-description\" class=\"form-control\" formControlName=\"description\" rows=\"3\"></textarea>\n </pw-input-container>\n\n <div formArrayName=\"items\" class=\"col-12\" cdkDropList (cdkDropListDropped)=\"dropItems(integrationsItems, $event)\">\n <div\n *ngFor=\"let item of integrationsItems.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row border p-3 mb-3 rounded bg-light\"\n cdkDrag\n >\n <pw-input-container label=\"Title\" class=\"col-md-6\" name=\"title\" [controlId]=\"'domain-build-integration-title-' + i\">\n <input type=\"text\" [id]=\"'domain-build-integration-title-' + i\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n\n <div class=\"col-md-5\">\n <pw-input-container label=\"Description\" name=\"description\" [controlId]=\"'domain-build-integration-description-' + i\">\n <input type=\"text\" [id]=\"'domain-build-integration-description-' + i\" class=\"form-control\" formControlName=\"description\" />\n </pw-input-container>\n </div>\n\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder question\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <pw-input-container label=\"Blog URL\" class=\"col-md-6\" name=\"blog_url\" [controlId]=\"'domain-build-integration-blog_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-integration-blog_url-' + i\" class=\"form-control\" formControlName=\"blog_url\" />\n </pw-input-container>\n\n <pw-input-container label=\"Image URL\" class=\"col-md-6\" name=\"image_url\" [controlId]=\"'domain-build-integration-image_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-integration-image_url-' + i\" class=\"form-control\" formControlName=\"image_url\" />\n </pw-input-container>\n\n <pw-input-container label=\"Video URL\" class=\"col-md-6\" name=\"video_url\" [controlId]=\"'domain-build-integration-video_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-integration-video_url-' + i\" class=\"form-control\" formControlName=\"video_url\" />\n </pw-input-container>\n\n <div class=\"col-md-6 d-flex align-items-end justify-content-end\">\n <i\n class=\"fa fa-trash delete-icon align-self-center\"\n (click)=\"removeIntegrationItem(i)\"\n (keydown.enter)=\"removeIntegrationItem(i)\"\n (keydown.space)=\"removeIntegrationItem(i)\"\n ngbTooltip=\"Remove\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <div class=\"text-start mt-2\">\n <button type=\"button\" class=\"btn btn-primary\" (click)=\"addIntegrationItem()\">+ Add Integration</button>\n </div>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n <p-accordion-panel value=\"10\">\n <p-accordion-header>Contact Us Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-3 mb-4\" formGroupName=\"contact_us\">\n <h4 class=\"mb-3\">Contact Us Section</h4>\n\n <pw-input-container label=\"Url\" class=\"col-md-6\" name=\"url\" controlId=\"domain-build-contact_us-url\">\n <input type=\"text\" id=\"domain-build-contact_us-url\" class=\"form-control\" formControlName=\"url\" />\n </pw-input-container>\n <pw-input-container label=\"Description\" class=\"col-12\" name=\"contact_us_description\" controlId=\"domain-build-contact_us-description\">\n <textarea id=\"domain-build-contact_us-description\" rows=\"3\" class=\"form-control\" formControlName=\"description\"></textarea>\n </pw-input-container>\n\n <div formArrayName=\"questions\" class=\"col-12 mt-3\" cdkDropList (cdkDropListDropped)=\"dropItems(contactUsQuestions, $event)\">\n <div\n *ngFor=\"let questionGroup of contactUsQuestions.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row border p-3 mb-3\"\n cdkDrag\n >\n <pw-input-container label=\"Question\" class=\"col-md-10\" name=\"question\" [controlId]=\"'domain-build-contact_us-question-' + i\">\n <input type=\"text\" [id]=\"'domain-build-contact_us-question-' + i\" class=\"form-control\" formControlName=\"question\" />\n </pw-input-container>\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeContactUsQuestion(i)\"\n (keydown.enter)=\"removeContactUsQuestion(i)\"\n (keydown.space)=\"removeContactUsQuestion(i)\"\n ngbTooltip=\"Remove\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder question\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-12 mt-3\" formArrayName=\"options\" cdkDropList [cdkDropListData]=\"getQuestionOptions(i).controls\" (cdkDropListDropped)=\"dropContactUsOptions(i, $event)\">\n <div\n class=\"row align-items-center mb-2 border p-3\"\n *ngFor=\"let option of getQuestionOptions(i).controls; let j = index\"\n [formGroupName]=\"j\"\n cdkDrag\n >\n <pw-input-container label=\"Option\" class=\"col-md-10\" name=\"option\" [controlId]=\"'domain-build-contact_us-option-' + i + '-' + j\">\n <input type=\"text\" [id]=\"'domain-build-contact_us-option-' + i + '-' + j\" class=\"form-control\" formControlName=\"option\" />\n </pw-input-container>\n\n <div class=\"col-md-1 d-flex justify-content-end mt-3\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeContactUsOption(i, j)\"\n (keydown.enter)=\"removeContactUsOption(i, j)\"\n (keydown.space)=\"removeContactUsOption(i, j)\"\n ngbTooltip=\"Remove Option\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-md-1 d-flex justify-content-end mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder option\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <div class=\"text-start\">\n <button type=\"button\" class=\"btn btn-primary btn-sm\" (click)=\"addContactUsOption(i)\">\n + Add Option\n </button>\n </div>\n </div>\n </div>\n\n <div class=\"text-start mt-3\">\n <button type=\"button\" class=\"btn btn-primary\" (click)=\"addContactUsQuestion()\">\n + Add Question\n </button>\n </div>\n </div>\n\n <div formArrayName=\"hubspot\" class=\"col-12 mt-4\" cdkDropList (cdkDropListDropped)=\"dropItems(contactUsHubspotItems, $event)\">\n <h5 class=\"mb-4\">Hubspot Embeds</h5>\n\n <div\n *ngFor=\"let hub of contactUsHubspotItems.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row border p-3 mb-2\"\n cdkDrag\n >\n <pw-input-container label=\"ID\" class=\"col-md-5\" name=\"id\" [controlId]=\"'domain-build-hubspot-id-' + i\">\n <input type=\"text\" [id]=\"'domain-build-hubspot-id-' + i\" class=\"form-control\" formControlName=\"id\" />\n </pw-input-container>\n\n <pw-input-container label=\"Position\" class=\"col-md-6\" name=\"position\" [controlId]=\"'domain-build-hubspot-position-' + i\">\n <input type=\"text\" [id]=\"'domain-build-hubspot-position-' + i\" class=\"form-control\" formControlName=\"position\" />\n </pw-input-container>\n <div class=\"col-md-1 d-flex align-items-start justify-content-end mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <pw-input-container label=\"Div\" class=\"col-10\" name=\"div\" [controlId]=\"'domain-build-hubspot-div-' + i\">\n <textarea\n [id]=\"'domain-build-hubspot-div-' + i\"\n class=\"form-control\"\n rows=\"5\"\n formControlName=\"div\"\n [ngClass]=\"{ 'is-invalid': submitted && f['div']?.errors }\"\n ></textarea>\n </pw-input-container>\n\n <div class=\"col-md-2 d-flex align-items-center mt-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"removeHubspotItem(i)\"\n (keydown.enter)=\"removeHubspotItem(i)\"\n (keydown.space)=\"removeHubspotItem(i)\"\n ngbTooltip=\"Remove Hubspot Embed\"\n aria-hidden=\"true\">\n</i>\n </div>\n </div>\n\n <div class=\"text-start mt-2\">\n <button type=\"button\" class=\"btn btn-primary btn-sm\" (click)=\"addHubspotItem()\">\n + Add Hubspot Embed\n </button>\n </div>\n </div>\n\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n <p-accordion-panel value=\"11\">\n <p-accordion-header>Book a Demo Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-4\">\n <div class=\"col-12\">\n <h4 class=\"mb-3\">{{ 'Admin.DomainConfig.BookDemoLinks' | transloco }}</h4>\n <div formGroupName=\"book_demo\">\n <pw-input-container label=\"Title\" name=\"title\" controlId=\"domain-build-book_demo-title\">\n <input type=\"text\" id=\"domain-build-book_demo-title\" formControlName=\"title\" class=\"form-control\" />\n </pw-input-container>\n\n <pw-input-container label=\"Description\" name=\"description\" controlId=\"domain-build-book_demo-description\">\n <input type=\"text\" id=\"domain-build-book_demo-description\" formControlName=\"description\" class=\"form-control\" />\n </pw-input-container>\n\n <div formArrayName=\"items\" cdkDropList (cdkDropListDropped)=\"dropBookDemoLinks($event)\">\n <div\n *ngFor=\"let link of f['book_demo'].get('items')['controls']; let i = index\"\n [formGroupName]=\"i\"\n class=\"row mb-3 border p-3 align-items-center\"\n cdkDrag\n >\n <div class=\"col-sm-5\">\n <pw-input-container label=\"Link Title\" name=\"title\" [controlId]=\"'domain-build-book_demo-link-title-' + i\">\n <input type=\"text\" [id]=\"'domain-build-book_demo-link-title-' + i\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-sm-5\">\n <pw-input-container label=\"Link URL\" name=\"url\" [controlId]=\"'domain-build-book_demo-link-url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-book_demo-link-url-' + i\" class=\"form-control\" formControlName=\"url\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-sm-1 d-flex justify-content-end mt-3\">\n <i\n ngbTooltip=\"Remove\"\n (click)=\"removeBookDemoLink(i)\"\n (keydown.enter)=\"removeBookDemoLink(i)\"\n (keydown.space)=\"removeBookDemoLink(i)\"\n class=\"fa fa-trash delete-icon text-danger\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-sm-1 d-flex justify-content-end mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addBookDemoLink()\">\n + Add Book Demo Link\n </button>\n </div>\n </div>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n <p-accordion-panel value=\"12\">\n <p-accordion-header>Navbar Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-3 mb-4\" formGroupName=\"navbar\">\n <h4 class=\"mb-3\">Navbar Section</h4>\n\n <div formArrayName=\"items\" class=\"col-12\" cdkDropList (cdkDropListDropped)=\"dropItems(navbarItems, $event)\">\n <div\n *ngFor=\"let item of navbarItems.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row mb-3\"\n cdkDrag\n >\n <div class=\"row align-items-center\">\n <pw-input-container label=\"Title\" class=\"col-md-5\" name=\"title\" [controlId]=\"'domain-build-navbar-title-' + i\">\n <input type=\"text\" [id]=\"'domain-build-navbar-title-' + i\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n\n <pw-input-container label=\"Path\" class=\"col-md-5\" name=\"path\" [controlId]=\"'domain-build-navbar-path-' + i\">\n <input type=\"text\" [id]=\"'domain-build-navbar-path-' + i\" class=\"form-control\" formControlName=\"path\" />\n </pw-input-container>\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-1\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeNavbarItem(i)\"\n (keydown.enter)=\"removeNavbarItem(i)\"\n (keydown.space)=\"removeNavbarItem(i)\"\n ngbTooltip=\"Remove Navbar Item\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-1\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <div\n class=\"col-12 mt-3\"\n formArrayName=\"subtitles\"\n cdkDropList\n [cdkDropListData]=\"getNavbarSubtitles(i).controls\"\n (cdkDropListDropped)=\"dropNavbarSubtitles(i, $event)\"\n >\n <div\n *ngFor=\"let sub of getNavbarSubtitles(i).controls; let j = index\"\n [formGroupName]=\"j\"\n class=\"row border p-3 mb-2 align-items-center\"\n cdkDrag\n >\n <div class=\"col-md-5\">\n <pw-input-container label=\"Subtitle Title\" name=\"title\" [controlId]=\"'domain-build-navbar-subtitle-title-' + i + '-' + j\">\n <input type=\"text\" [id]=\"'domain-build-navbar-subtitle-title-' + i + '-' + j\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-md-5\">\n <pw-input-container label=\"Subtitle Path\" name=\"path\" [controlId]=\"'domain-build-navbar-subtitle-path-' + i + '-' + j\">\n <input type=\"text\" [id]=\"'domain-build-navbar-subtitle-path-' + i + '-' + j\" class=\"form-control\" formControlName=\"path\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-2\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeSubtitle(i, j)\"\n (keydown.enter)=\"removeSubtitle(i, j)\"\n (keydown.space)=\"removeSubtitle(i, j)\"\n ngbTooltip=\"Remove Subtitle\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-md-1 d-flex justify-content-end\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder subtitle\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <button type=\"button\" class=\"btn btn-sm btn-primary mt-2\" (click)=\"addSubtitle(i)\">\n + Add Subtitle\n </button>\n </div>\n </div>\n\n <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addNavbarItem()\">\n + Add Navbar Item\n </button>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n <p-accordion-panel value=\"13\">\n <p-accordion-header>Footer Links Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-3 mb-4\" formGroupName=\"footer_links\">\n <h4 class=\"mb-3\">Footer Links Section</h4>\n\n <div\n formArrayName=\"items\"\n class=\"col-12\"\n cdkDropList\n (cdkDropListDropped)=\"dropItems(footerLinksItems, $event)\"\n >\n <div\n *ngFor=\"let item of footerLinksItems.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row mb-3\"\n cdkDrag\n >\n <div class=\"row align-items-center\">\n\n <pw-input-container label=\"Title\" class=\"col-md-5\" name=\"title\" [controlId]=\"'domain-build-footer-title-' + i\">\n <input type=\"text\" [id]=\"'domain-build-footer-title-' + i\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n\n <pw-input-container label=\"Path\" class=\"col-md-5\" name=\"path\" [controlId]=\"'domain-build-footer-path-' + i\">\n <input type=\"text\" [id]=\"'domain-build-footer-path-' + i\" class=\"form-control\" formControlName=\"path\" />\n </pw-input-container>\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-1\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeFooterLinkItem(i)\"\n (keydown.enter)=\"removeFooterLinkItem(i)\"\n (keydown.space)=\"removeFooterLinkItem(i)\"\n ngbTooltip=\"Remove Footer Item\"\n aria-hidden=\"true\"\n ></i>\n </div>\n <div class=\"col-md-1 d-flex align-items-start justify-content-end mt-1\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n </div>\n\n <div\n class=\"col-12 mt-3\"\n formArrayName=\"subtitles\"\n cdkDropList\n [cdkDropListData]=\"getFooterSubtitles(i).controls\"\n (cdkDropListDropped)=\"dropFooterSubtitles(i, $event)\"\n >\n <div\n *ngFor=\"let sub of getFooterSubtitles(i).controls; let j = index\"\n [formGroupName]=\"j\"\n class=\"row border p-3 mb-2 align-items-center\"\n cdkDrag\n >\n\n <div class=\"col-md-5\">\n <pw-input-container label=\"Subtitle Title\" name=\"title\" [controlId]=\"'domain-build-footer-subtitle-title-' + i + '-' + j\">\n <input type=\"text\" [id]=\"'domain-build-footer-subtitle-title-' + i + '-' + j\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-md-5\">\n <pw-input-container label=\"Subtitle Path\" name=\"path\" [controlId]=\"'domain-build-footer-subtitle-path-' + i + '-' + j\">\n <input type=\"text\" [id]=\"'domain-build-footer-subtitle-path-' + i + '-' + j\" class=\"form-control\" formControlName=\"path\" />\n </pw-input-container>\n </div>\n\n\n\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-2\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeFooterSubtitle(i, j)\"\n (keydown.enter)=\"removeFooterSubtitle(i, j)\"\n (keydown.space)=\"removeFooterSubtitle(i, j)\"\n ngbTooltip=\"Remove Subtitle\"\n aria-hidden=\"true\"\n ></i>\n </div>\n <div class=\"col-md-1 d-flex justify-content-end\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder subtitle\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <button\n type=\"button\"\n class=\"btn btn-sm btn-primary mt-2\"\n (click)=\"addFooterSubtitle(i)\"\n >\n + Add Subtitle\n </button>\n </div>\n </div>\n\n <button\n type=\"button\"\n class=\"btn btn-primary mt-2 mb-2\"\n (click)=\"addFooterLinkItem()\"\n >\n + Add Footer Link\n </button>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n\n\n\n <p-accordion-panel value=\"14\">\n <p-accordion-header>Guides Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-3 mb-4\" formGroupName=\"guides\">\n <h4 class=\"mb-3\">Guides Section</h4>\n\n <div formArrayName=\"items\" class=\"col-12\">\n <div cdkDropList (cdkDropListDropped)=\"dropItems(guidesItems, $event)\">\n <div\n *ngFor=\"let item of guidesItems.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"border p-3 mb-3\"\n cdkDrag\n >\n <div class=\"row align-items-start\">\n\n <pw-input-container label=\"Title\" class=\"col-md-5\" name=\"title\" [controlId]=\"'domain-build-guide-title-' + i\">\n <input type=\"text\" [id]=\"'domain-build-guide-title-' + i\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n\n <pw-input-container label=\"Button Text\" class=\"col-md-6\" name=\"button_text\" [controlId]=\"'domain-build-guide-button_text-' + i\">\n <input type=\"text\" [id]=\"'domain-build-guide-button_text-' + i\" class=\"form-control\" formControlName=\"button_text\" />\n </pw-input-container>\n <div class=\"col-md-1 d-flex align-items-start justify-content-end mt-1\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <div class=\"row mt-2\">\n <pw-input-container label=\"Image URL\" class=\"col-md-6\" name=\"image_url\" [controlId]=\"'domain-build-guide-image_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-guide-image_url-' + i\" class=\"form-control\" formControlName=\"image_url\" />\n </pw-input-container>\n\n <pw-input-container label=\"Guide URL\" class=\"col-md-6\" name=\"guide_url\" [controlId]=\"'domain-build-guide-guide_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-guide-guide_url-' + i\" class=\"form-control\" formControlName=\"guide_url\" />\n </pw-input-container>\n </div>\n\n <div class=\"row mt-2\">\n <pw-input-container label=\"Description\" class=\"col-md-11\" name=\"description\" [controlId]=\"'domain-build-guide-description-' + i\">\n <textarea\n [id]=\"'domain-build-guide-description-' + i\"\n class=\"form-control\"\n rows=\"5\"\n formControlName=\"description\"\n [ngClass]=\"{ 'is-invalid': submitted && f['description']?.errors }\"\n ></textarea>\n </pw-input-container>\n\n <div class=\"col-md-1 d-flex align-items-start justify-content-center mt-3\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeGuideItem(i)\"\n (keydown.enter)=\"removeGuideItem(i)\"\n (keydown.space)=\"removeGuideItem(i)\"\n ngbTooltip=\"Remove Guide\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"text-start mt-2\">\n <button type=\"button\" class=\"btn btn-primary\" (click)=\"addGuideItem()\">\n + Add Guide\n </button>\n </div>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n\n <p-accordion-panel value=\"15\">\n <p-accordion-header>AB Tests Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-3 mb-4\">\n <h4 class=\"mb-3\">AB Tests</h4>\n <div formArrayName=\"ab_tests\" class=\"col-12\" cdkDropList (cdkDropListDropped)=\"dropItems(abTests, $event)\">\n <div\n *ngFor=\"let abTest of abTests.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row mb-3 border p-3\"\n cdkDrag\n >\n <pw-input-container label=\"Description\" class=\"col-md-5\" name=\"description\" [controlId]=\"'domain-build-ab_test-description-' + i\">\n <input type=\"text\" [id]=\"'domain-build-ab_test-description-' + i\" class=\"form-control\" formControlName=\"description\" />\n </pw-input-container>\n\n <pw-input-container label=\"Experiment Name\" class=\"col-md-6\" name=\"experiment_name\" [controlId]=\"'domain-build-ab_test-experiment_name-' + i\">\n <input type=\"text\" [id]=\"'domain-build-ab_test-experiment_name-' + i\" class=\"form-control\" formControlName=\"experiment_name\" />\n </pw-input-container>\n\n\n <div class=\"col-md-1 d-flex align-items-start justify-content-end mt-1\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <pw-input-container label=\"DB Shard\" class=\"col-md-6\" name=\"db_shard\" [controlId]=\"'domain-build-ab_test-db_shard-' + i\">\n <input type=\"text\" [id]=\"'domain-build-ab_test-db_shard-' + i\" class=\"form-control\" formControlName=\"db_shard\" />\n </pw-input-container>\n\n <pw-input-container label=\"Microservice Name\" class=\"col-md-6\" name=\"microservice_name\" [controlId]=\"'domain-build-ab_test-microservice_name-' + i\">\n <input type=\"text\" [id]=\"'domain-build-ab_test-microservice_name-' + i\" class=\"form-control\" formControlName=\"microservice_name\" />\n </pw-input-container>\n\n <div class=\"col-md-12 text-end mt-2\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeAbTest(i)\"\n (keydown.enter)=\"removeAbTest(i)\"\n (keydown.space)=\"removeAbTest(i)\"\n ngbTooltip=\"Remove AB Test\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <div class=\"text-start mt-2\">\n <button type=\"button\" class=\"btn btn-primary\" (click)=\"addAbTest()\">+ Add AB Test</button>\n </div>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n\n\n\n <p-accordion-panel value=\"16\">\n <p-accordion-header>Coming soon pages - Subscribe to newsletter (TO DISCONTINUE)</p-accordion-header>\n <p-accordion-content>\n <div class=\"mb-3\">\n <p>ComingSoon Pages will enable users to subscribe to Newsletters and are accessible at the internal paths\n /join/cs1, /join/cs2, etc.</p>\n </div>\n <div class=\"text-end\" *ngIf=\"shardUrl\">\n <span>See the live page <span class=\"tooltip-wrap ms-1\" [appendTo]=\"'body'\"\n [pTooltip]=\"'Admin.DomainConfig.Tooltip.SeeLiveCs' | transloco\" tooltipPosition=\"top\">\n <i class=\"fas fa-info-circle\"></i>\n </span> : <a [href]=\"shardUrl + '/join/cs1'\" target=\"_blank\">{{ shardUrl }}/join/cs1</a></span>\n </div>\n <div class=\"row\">\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CsProduct' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsProduct' | transloco\" name=\"cs_product_id\" controlId=\"domain-build-cs_product_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-autoComplete [attr.aria-labelledby]=\"'domain-build-cs_product_id-label'\" [suggestions]=\"productsList\" formControlName=\"cs_product_id\" dataKey=\"id\" field=\"name\"\n [dropdown]=\"true\" [delay]=\"1000\" (completeMethod)=\"searchProduct($event)\" styleClass=\"w-100\"\n placeholder=\"Search Product\" [inputStyle]=\"\n form.get('cs_product_id').touched &&\n form.get('cs_product_id').invalid\n ? { border: '1px solid #ff586b' }\n : { border: '1px solid gray' }\n \" [multiple]=\"false\">\n </p-autoComplete>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CsCrmSourceId' | transloco\" name=\"cs_crm_source_id\" controlId=\"domain-build-cs_crm_source_id\" [useAriaLabelledbyOnly]=\"true\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsCrmSourceId' | transloco\">\n <p-select [options]=\"crmSourcesList\" [attr.aria-labelledby]=\"'domain-build-cs_crm_source_id-label'\" formControlName=\"cs_crm_source_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['cs_crm_source_id']?.errors }\" [placeholder]=\"'Select CRM Source'\"\n optionValue=\"id\" optionLabel=\"name\">\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CsPdfSourceId' | transloco\" name=\"cs_pdf_source_id\" controlId=\"domain-build-cs_pdf_source_id\" [useAriaLabelledbyOnly]=\"true\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsPdfSourceId' | transloco\">\n <p-select [options]=\"crmSourcesList\" [attr.aria-labelledby]=\"'domain-build-cs_pdf_source_id-label'\" formControlName=\"cs_pdf_source_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['cs_pdf_source_id']?.errors }\" [placeholder]=\"'Select CRM Source'\"\n optionValue=\"id\" optionLabel=\"name\">\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\"></div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CsVideoUrl' | transloco\" name=\"cs_video_url\" controlId=\"domain-build-cs_video_url\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsVideoUrl' | transloco\">\n <input type=\"text\" id=\"domain-build-cs_video_url\" class=\"form-control\" formControlName=\"cs_video_url\"\n [ngClass]=\"{ 'is-invalid': submitted && f['cs_video_url'].errors }\" />\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CsBookDemoUrl' | transloco\" name=\"cs_book_demo_url\" controlId=\"domain-build-cs_book_demo_url\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsBookDemoUrl' | transloco\">\n <input type=\"text\" id=\"domain-build-cs_book_demo_url\" class=\"form-control\" formControlName=\"cs_book_demo_url\"\n [ngClass]=\"{ 'is-invalid': submitted && f['cs_book_demo_url'].errors }\" />\n </pw-input-container>\n </div>\n <div class=\"col-12\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CsCtaIframe' | transloco\" name=\"cs_cta_iframe\" controlId=\"domain-build-cs_cta_iframe\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsCtaIframe' | transloco\">\n <textarea id=\"domain-build-cs_cta_iframe\" class=\"form-control\" rows=\"3\" formControlName=\"cs_cta_iframe\"\n [ngClass]=\"{ 'is-invalid': submitted && f['cs_cta_iframe'].errors }\">\n </textarea>\n </pw-input-container>\n </div>\n <div class=\"col-12\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CsJoinMessage' | transloco\" name=\"cs_join_message\" controlId=\"domain-build-cs_join_message\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsJoinMessage' | transloco\">\n <textarea id=\"domain-build-cs_join_message\" class=\"form-control\" rows=\"3\" formControlName=\"cs_join_message\"\n [ngClass]=\"{ 'is-invalid': submitted && f['cs_join_message'].errors }\">\n </textarea>\n </pw-input-container>\n </div>\n <div class=\"col-12\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CsPdfDownloadText' | transloco\" name=\"cs_pdf_download_text\" controlId=\"domain-build-cs_pdf_download_text\"\n [showTooltip]=\"true\" [tooltipText]=\"\n 'Admin.DomainConfig.Tooltip.CsPdfDownloadText' | transloco\n \">\n <textarea id=\"domain-build-cs_pdf_download_text\" class=\"form-control\" rows=\"3\" formControlName=\"cs_pdf_download_text\" [ngClass]=\"{\n 'is-invalid': submitted && f['cs_pdf_download_text'].errors\n }\">\n </textarea>\n </pw-input-container>\n </div>\n </div>\n <div class=\"row\" matchHeight=\"card\">\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-cs_image-label\">{{ 'Admin.DomainConfig.CsImage' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImage' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Image'\"\n [controlName]=\"'cs_image'\" [previewData]=\"data['cs_image']\">\n </pw-custom-uploader>\n </div>\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-cs_image2-label\">{{ 'Admin.DomainConfig.CsImage2' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImage2' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Image2'\"\n [controlName]=\"'cs_image2'\" [previewData]=\"data['cs_image2']\">\n </pw-custom-uploader>\n </div>\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-cs_pdf_image-label\">{{ 'Admin.DomainConfig.CsPdfImage' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsPdfImage' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Pdf Image'\"\n [controlName]=\"'cs_pdf_image'\" [previewData]=\"data['cs_pdf_image']\">\n </pw-custom-uploader>\n </div>\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-cs_image_bg-label\">{{ 'Admin.DomainConfig.CsImageBg' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImageBg' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Pdf Image Bg'\"\n [controlName]=\"'cs_image_bg'\" [previewData]=\"data['cs_image_bg']\">\n </pw-custom-uploader>\n </div>\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-cs_image_bg2-label\">{{ 'Admin.DomainConfig.CsImageBg2' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImageBg2' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Pdf Image Bg2'\"\n [controlName]=\"'cs_image_bg2'\" [previewData]=\"data['cs_image_bg2']\">\n </pw-custom-uploader>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n </p-accordion>\n </div>\n\n <div class=\"col-12 text-end mt-3\">\n <button type=\"button\"\n class=\"btn btn-outline-default me-2\"\n (click)=\"back()\">\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button type=\"submit\" [buttonBusy]=\"buttonBusy\"\n class=\"btn btn-primary\">{{ 'Button.Submit' | transloco }}</button>\n </div>\n </form>\n</ng-container>\n<div *ngIf=\"!data?.host_name && !isLoading\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Admin.DomainConfig.EnableConfigTab' | transloco\"> </pw-no-data>\n</div>\n\n\n<ng-template #partnerCropper let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Upload Partner Image</h5>\n <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n </div>\n <div class=\"modal-body\">\n <small>You can upload JPG, PNG, or GIF files. Avoid images with celebrities, nudity, or artwork.</small>\n <pw-image-cropper\n aspectRatio=\"auto\"\n (imageSelectionEvent)=\"onPartnerImageSelected($event)\"\n (closeEvent)=\"onClosePartnerModal()\"\n ></pw-image-cropper>\n </div>\n</ng-template>\n" }]
|
|
1396
|
+
args: [{ selector: 'pw-domain-config-build', standalone: false, template: "<h3>Public Pages Configuration</h3>\n<div class=\"mb-4\">\n <p> The following parameters and settings will be applied to all public pages of this domain. </p>\n</div>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"isLoading\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<ng-container *ngIf=\"!isLoading && data?.host_name\">\n <form [formGroup]=\"form\"\n (ngSubmit)=\"onSave()\">\n <div class=\"row\">\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.MasterSubscription' | transloco\"\n name=\"master_subscription_id\" controlId=\"domain-build-master_subscription_id\" [useAriaLabelledbyOnly]=\"true\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.MasterSubscription' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'domain-build-master_subscription_id-label'\"\n [options]=\"masterSubscriptionsList\"\n formControlName=\"master_subscription_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['master_subscription_id']?.errors }\"\n placeholder=\"Select Master Subscription\">\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.MasterSubscriptionProduct' | transloco\"\n [showTooltip]=\"true\"\n [tooltipText]=\"\n 'Admin.DomainConfig.Tooltip.MasterSubscriptionProduct' | transloco\n \"\n name=\"master_subscription_product_id\" controlId=\"domain-build-master_subscription_product_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'domain-build-master_subscription_product_id-label'\"\n [options]=\"masterSubscriptionProductList\"\n formControlName=\"master_subscription_product_id\"\n [ngClass]=\"{'is-invalid': submitted && f['master_subscription_product_id']?.errors}\"\n [placeholder]=\"'Select Master Product'\"\n optionValue=\"id\"\n optionLabel=\"name\"\n >\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.BlogFeatureKey' | transloco\"\n name=\"blog_feature_key\" controlId=\"domain-build-blog_feature_key\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.BlogFeatureKey' | transloco\">\n <input type=\"text\"\n id=\"domain-build-blog_feature_key\"\n class=\"form-control\"\n formControlName=\"blog_feature_key\"\n [ngClass]=\"{ 'is-invalid': submitted && f['blog_feature_key'].errors }\" />\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.MainTos' | transloco\"\n name=\"main_tos_id\" controlId=\"domain-build-main_tos_id\" [useAriaLabelledbyOnly]=\"true\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.MainTos' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'domain-build-main_tos_id-label'\"\n [options]=\"subscriptionTosList\"\n formControlName=\"main_tos_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['main_tos_id']?.errors }\"\n [placeholder]=\"'Select Main TOS'\"\n optionValue=\"id\">\n <ng-template pTemplate=\"selectedItem\" let-item>\n <span [innerHTML]=\"item.title\"></span>\n </ng-template>\n <ng-template pTemplate=\"item\" let-item>\n <span [innerHTML]=\"item.title\"></span>\n </ng-template>\n </p-select>\n\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CrmSubscription' | transloco\"\n name=\"crm_subscription_id\" controlId=\"domain-build-crm_subscription_id\" [useAriaLabelledbyOnly]=\"true\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.CrmSubscription' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'domain-build-crm_subscription_id-label'\"\n [options]=\"crmSubscriptionsList\"\n formControlName=\"crm_subscription_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['crm_subscription_id']?.errors }\"\n [placeholder]=\"'Select CRM Subscription'\"\n optionValue=\"id\">\n <ng-template pTemplate=\"selectedItem\" let-item>\n {{item?.organisation ? item?.organisation + ' - ' + item.contact_name : item?.contact_name}}\n </ng-template>\n <ng-template pTemplate=\"item\" let-item>\n {{item?.organisation ? item?.organisation + ' - ' + item.contact_name : item?.contact_name}}\n </ng-template>\n </p-select>\n\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CrmProduct' | transloco\"\n name=\"crm_product_id\" controlId=\"domain-build-crm_product_id\" [useAriaLabelledbyOnly]=\"true\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.CrmProduct' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'domain-build-crm_product_id-label'\"\n [options]=\"crmProductList\"\n formControlName=\"crm_product_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['crm_product_id']?.errors }\"\n [placeholder]=\"'Select CRM Product'\"\n optionValue=\"id\"\n >\n <ng-template pTemplate=\"selectedItem\" let-item>\n {{item?.subscription_id ? item?.name +' - SubscriptionID = '+ item.subscription_id : item?.name}}\n </ng-template>\n <ng-template pTemplate=\"item\" let-item>\n {{item?.subscription_id ? item?.name +' - SubscriptionID = '+ item.subscription_id : item?.name}}\n </ng-template>\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CrmSource' | transloco\"\n name=\"crm_source_id\" controlId=\"domain-build-crm_source_id\" [useAriaLabelledbyOnly]=\"true\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.CrmSource' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'domain-build-crm_source_id-label'\"\n [options]=\"crmSourcesList\"\n formControlName=\"crm_source_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['crm_source_id']?.errors }\"\n [placeholder]=\"'Select CRM Source'\"\n optionValue=\"id\"\n optionLabel=\"name\"\n >\n </p-select>\n </pw-input-container>\n </div>\n <!-- crm subscription fields end-->\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.Active' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.Active' | transloco\" name=\"active\" controlId=\"domain-build-active\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch size=\"small\" [attr.aria-labelledby]=\"'domain-build-active-label'\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"active\" name=\"active\"\n [ngClass]=\"{ 'is-invalid': submitted && f['active'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.IsProductDomain' | transloco\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.IsProductDomain' | transloco\"\n name=\"is_product_domain\" controlId=\"domain-build-is_product_domain\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch size=\"small\" [attr.aria-labelledby]=\"'domain-build-is_product_domain-label'\"\n uncheckedLabel=\"false\"\n checkedLabel=\"true\"\n formControlName=\"is_product_domain\"\n name=\"is_product_domain\"\n [ngClass]=\"{ 'is-invalid': submitted && f['is_product_domain'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CanRegisterOnMainPage' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.CanRegisterOnMainPage' | transloco\"\n name=\"can_register_through_main_page\" controlId=\"domain-build-can_register_through_main_page\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch size=\"small\" [attr.aria-labelledby]=\"'domain-build-can_register_through_main_page-label'\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"can_register_through_main_page\"\n name=\"can_register_through_main_page\" [ngClass]=\"{\n 'is-invalid': submitted && f['can_register_through_main_page'].errors\n }\">\n </ui-switch>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.SocialLoginEnabled' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.SocialLoginEnable' | transloco\" name=\"social_login_enabled\" controlId=\"domain-build-social_login_enabled\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch size=\"small\" [attr.aria-labelledby]=\"'domain-build-social_login_enabled-label'\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"social_login_enabled\"\n name=\"social_login_enabled\" [ngClass]=\"{ 'is-invalid': submitted && f['social_login_enabled'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.NotifyLogins' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.NotifyLogins' | transloco\" name=\"notify_logins\" controlId=\"domain-build-notify_logins\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch size=\"small\" [attr.aria-labelledby]=\"'domain-build-notify_logins-label'\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"notify_logins\"\n name=\"notify_logins\" [ngClass]=\"{ 'is-invalid': submitted && f['notify_logins'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n\n <div class=\"my-5\">\n <h3>Pre-Built Pages Config (Resources, Landing Pages, etc)</h3>\n\n <p-accordion class=\"mt-5\">\n <p-accordion-panel value=\"0\">\n <p-accordion-header>Instructions - README FIRST</p-accordion-header>\n <p-accordion-content>\n <div class=\"mb-3\">\n <p>We've built and maintain a collection of high-converting landing pages designed to help you quickly launch polished\n UIs for onboarding users.</p>\n <p><strong>Newsletter Subscription Pages:</strong><br> After configuring your domain, you can access pages like\n <strong>/join/cs1, /join/cs2, /join/cs3, etc.</strong>, specifically designed for newsletter sign-ups. <br>\n Subscribers from these pages will be listed in the <strong>SmartCRM module</strong>.</p>\n <p><strong>Trial Product Sign-Up Pages:</strong><br> For users interested in trial products, utilize pages such as\n <strong>/join/trial1, /join/trial2, /join/trial3, etc.</strong>.<br> Users registering through these pages will\n appear in the <strong>Admin > Users section</strong>.</p>\n <p>Once you've selected the landing page you want to use <strong>(e.g., /join/trial3)</strong>, make sure to update\n the <strong>Internal Path</strong> in the <strong>Core tab</strong> accordingly\u2014i.e., set it to\n <strong>/join/trial3</strong>.</p>\n <p>If you need assistance integrating these pages into your workflow or have further questions, feel free to reach\n out.</p>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n <p-accordion-panel value=\"1\">\n <p-accordion-header>Subscribe to Product/Newsletter Config</p-accordion-header>\n <p-accordion-content>\n <div class=\"mb-3\">\n <p>Trial Pages will enable users to sign up to real products and are accessible at the path /join/trial1,\n /join/trial2, etc.</p>\n <p>ComingSoon Pages will enable users to subscribe to Newsletters and are accessible at the internal paths\n /join/cs1, /join/cs2, etc.</p>\n </div>\n <!-- live page link -->\n <div class=\"text-end\" *ngIf=\"shardUrl\">\n <span>See the live page <span class=\"tooltip-wrap ms-1\" [appendTo]=\"'body'\"\n [pTooltip]=\"'Admin.DomainConfig.Tooltip.SeeLiveTrial' | transloco\" tooltipPosition=\"top\">\n <i class=\"fas fa-info-circle\"></i>\n </span> : <a [href]=\"shardUrl + '/join/trial1'\" target=\"_blank\">{{ shardUrl }}/join/trial1</a></span>\n </div>\n <div class=\"row\">\n <div class=\"col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.TrialProduct' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.TrialProduct' | transloco\" name=\"trial_product_id\" controlId=\"domain-build-trial_product_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-autoComplete [attr.aria-labelledby]=\"'domain-build-trial_product_id-label'\" [suggestions]=\"productsList\" formControlName=\"trial_product_id\" dataKey=\"id\" field=\"name\"\n [dropdown]=\"true\" [delay]=\"1000\" (completeMethod)=\"searchProduct($event)\" styleClass=\"w-100\"\n placeholder=\"Search Product\" [inputStyle]=\"\n form.get('trial_product_id').touched &&\n form.get('trial_product_id').invalid\n ? { border: '1px solid #ff586b' }\n : { border: '1px solid gray' }\n \" [multiple]=\"false\">\n </p-autoComplete>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.TrialCrmSourceId' | transloco\" name=\"trial_crm_source_id\" controlId=\"domain-build-trial_crm_source_id\" [useAriaLabelledbyOnly]=\"true\"\n [showTooltip]=\"true\" [tooltipText]=\"\n 'Admin.DomainConfig.Tooltip.TrialCrmSourceId' | transloco\n \">\n <p-select inputId=\"domain-build-trial_crm_source_id\"\n [options]=\"crmSourcesList\" [attr.aria-labelledby]=\"'domain-build-trial_crm_source_id-label'\" formControlName=\"trial_crm_source_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['trial_crm_source_id']?.errors }\"\n [placeholder]=\"'Select CRM Source'\" optionValue=\"id\" optionLabel=\"name\">\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.TrialPdfSourceId' | transloco\" name=\"trial_pdf_source_id\" controlId=\"domain-build-trial_pdf_source_id\" [useAriaLabelledbyOnly]=\"true\"\n [showTooltip]=\"true\" [tooltipText]=\"\n 'Admin.DomainConfig.Tooltip.TrialPdfSourceId' | transloco\n \">\n <p-select inputId=\"domain-build-trial_pdf_source_id\"\n [options]=\"crmSourcesList\" [attr.aria-labelledby]=\"'domain-build-trial_pdf_source_id-label'\" formControlName=\"trial_pdf_source_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['trial_pdf_source_id']?.errors }\"\n [placeholder]=\"'Select CRM Source'\" optionValue=\"id\" optionLabel=\"name\">\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\"></div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.TrialVideoUrl' | transloco\" name=\"trial_video_url\" controlId=\"domain-build-trial_video_url\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.TrialVideoUrl' | transloco\">\n <input type=\"text\" id=\"domain-build-trial_video_url\" class=\"form-control\" formControlName=\"trial_video_url\"\n [ngClass]=\"{ 'is-invalid': submitted && f['trial_video_url'].errors }\" />\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.TrialBookDemoUrl' | transloco\" name=\"trial_book_demo_url\" controlId=\"domain-build-trial_book_demo_url\"\n [showTooltip]=\"true\" [tooltipText]=\"\n 'Admin.DomainConfig.Tooltip.TrialBookDemoUrl' | transloco\n \">\n <input type=\"text\" id=\"domain-build-trial_book_demo_url\" class=\"form-control\" formControlName=\"trial_book_demo_url\" [ngClass]=\"{\n 'is-invalid': submitted && f['trial_book_demo_url'].errors\n }\" />\n </pw-input-container>\n </div>\n <div class=\"col-12\">\n <pw-input-container [label]=\"'Admin.DomainConfig.TrialCtaIframe' | transloco\" name=\"trial_cta_iframe\" controlId=\"domain-build-trial_cta_iframe\"\n [showTooltip]=\"true\" [tooltipText]=\"\n 'Admin.DomainConfig.Tooltip.TrialCtaIframe' | transloco\n \">\n <textarea id=\"domain-build-trial_cta_iframe\" rows=\"3\" class=\"form-control\" formControlName=\"trial_cta_iframe\" [ngClass]=\"{\n 'is-invalid': submitted && f['trial_cta_iframe'].errors\n }\">\n </textarea>\n </pw-input-container>\n </div>\n <div class=\"col-12\">\n <pw-input-container [label]=\"'Admin.DomainConfig.TrialJoinMessage' | transloco\" name=\"trial_join_message\" controlId=\"domain-build-trial_join_message\"\n [showTooltip]=\"true\" [tooltipText]=\"\n 'Admin.DomainConfig.Tooltip.TrialJoinMessage' | transloco\n \">\n <textarea id=\"domain-build-trial_join_message\" rows=\"3\" class=\"form-control\" formControlName=\"trial_join_message\" [ngClass]=\"{\n 'is-invalid': submitted && f['trial_join_message'].errors\n }\">\n </textarea>\n </pw-input-container>\n </div>\n <div class=\"col-12\">\n <pw-input-container [label]=\"'Admin.DomainConfig.TrialPdfDownloadText' | transloco\" name=\"trial_pdf_download_text\" controlId=\"domain-build-trial_pdf_download_text\"\n [showTooltip]=\"true\" [tooltipText]=\"\n 'Admin.DomainConfig.Tooltip.TrialPdfDownloadText' | transloco\n \">\n <textarea id=\"domain-build-trial_pdf_download_text\" rows=\"3\" class=\"form-control\" formControlName=\"trial_pdf_download_text\" [ngClass]=\"{\n 'is-invalid': submitted && f['trial_pdf_download_text'].errors\n }\">\n </textarea>\n </pw-input-container>\n </div>\n </div>\n <div class=\"row\" matchHeight=\"card\">\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-trial_image-label\">{{ 'Admin.DomainConfig.TrialImage' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImage' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Trial Image'\"\n [controlName]=\"'trial_image'\" [previewData]=\"data['trial_image']\">\n </pw-custom-uploader>\n </div>\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-trial_image2-label\">{{ 'Admin.DomainConfig.TrialImage2' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImage2' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Image2'\" [aspectRatio]=\"'custom'\"\n [controlName]=\"'trial_image2'\" [previewData]=\"data['trial_image2']\">\n </pw-custom-uploader>\n </div>\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-trial_pdf_image-label\">{{ 'Admin.DomainConfig.TrialPdfImage' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialPdfImage' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Pdf Image'\" [aspectRatio]=\"'custom'\"\n [controlName]=\"'trial_pdf_image'\" [previewData]=\"data['trial_pdf_image']\">\n </pw-custom-uploader>\n </div>\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-trial_image_bg-label\">{{ 'Admin.DomainConfig.TrialImageBg' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImageBg' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Image Bg'\" [aspectRatio]=\"'custom'\"\n [controlName]=\"'trial_image_bg'\" [previewData]=\"data['trial_image_bg']\">\n </pw-custom-uploader>\n </div>\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-trial_image_bg2-label\">{{ 'Admin.DomainConfig.TrialImageBg2' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImageBg2' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Image Bg2'\" [aspectRatio]=\"'custom'\"\n [controlName]=\"'trial_image_bg2'\" [previewData]=\"data['trial_image_bg2']\">\n </pw-custom-uploader>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n <p-accordion-panel value=\"2\">\n <p-accordion-header>Header Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-4\" formGroupName=\"header\">\n <h4 class=\"mb-4\">Header Section</h4>\n\n <!-- Headline -->\n <div class=\"col-12 col-md-12\">\n <pw-input-container label=\"Header Headline\" name=\"headline\" controlId=\"domain-build-header-headline\">\n <input type=\"text\" id=\"domain-build-header-headline\" class=\"form-control\" formControlName=\"headline\" />\n </pw-input-container>\n </div>\n\n <!-- Video URL -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"Header Video URL\" name=\"video_url\" controlId=\"domain-build-header-video_url\">\n <input type=\"text\" id=\"domain-build-header-video_url\" class=\"form-control\" formControlName=\"video_url\" />\n </pw-input-container>\n </div>\n\n <!-- Background Image URL -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"Header Background Image URL\" name=\"bg_image_url\" controlId=\"domain-build-header-bg_image_url\">\n <input type=\"text\" id=\"domain-build-header-bg_image_url\" class=\"form-control\" formControlName=\"bg_image_url\" />\n </pw-input-container>\n </div>\n\n <!-- Description -->\n <div class=\"col-12\">\n <pw-input-container label=\"Header Description\" name=\"description\" controlId=\"domain-build-header-description\">\n <textarea\n id=\"domain-build-header-description\"\n class=\"form-control\"\n rows=\"5\"\n formControlName=\"description\"\n [ngClass]=\"{ 'is-invalid': submitted && f['description']?.errors }\"\n ></textarea>\n </pw-input-container>\n </div>\n\n <!-- Sub Headings -->\n <div formArrayName=\"sub_headings\" class=\"col-12\" cdkDropList (cdkDropListDropped)=\"dropItems(headerSubHeadings, $event)\">\n <div\n *ngFor=\"let sub of f['header'].get('sub_headings')['controls']; let i = index\"\n [formGroupName]=\"i\"\n class=\"row mb-3 align-items-center\"\n cdkDrag\n >\n <div class=\"col-md-10\">\n <pw-input-container label=\"Sub Header Description\" name=\"description\" [controlId]=\"'domain-build-header-sub_description-' + i\">\n <textarea\n [id]=\"'domain-build-header-sub_description-' + i\"\n class=\"form-control\"\n rows=\"3\"\n formControlName=\"description\"\n [ngClass]=\"{ 'is-invalid': submitted && f['description']?.errors }\"\n ></textarea>\n </pw-input-container>\n </div>\n\n <div class=\"col-md-1 d-flex justify-content-end mt-3\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeHeaderSubHeading(i)\"\n (keydown.enter)=\"removeHeaderSubHeading(i)\"\n (keydown.space)=\"removeHeaderSubHeading(i)\"\n ngbTooltip=\"Remove\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-md-1 d-flex justify-content-end mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addHeaderSubHeading()\">\n + Add Sub Heading\n </button>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n <p-accordion-panel value=\"3\">\n <p-accordion-header>Resources Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row row mt-4 mb-4\">\n <h4 class=\"mb-3\">Resources Section</h4>\n <div class=\"col-12 col-sm-6\">\n <pw-input-container [label]=\"'Admin.DomainConfig.ResourceTagline' | transloco\" name=\"resources_tagline\" controlId=\"domain-build-resources_tagline\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.ResourceTagline' | transloco\">\n <input type=\"text\" id=\"domain-build-resources_tagline\" class=\"form-control\" formControlName=\"resources_tagline\"\n [ngClass]=\"{ 'is-invalid': submitted && f['resources_tagline'].errors }\" />\n </pw-input-container>\n </div>\n <div class=\"col-12\">\n <pw-input-container [label]=\"'Admin.DomainConfig.ResourceDescription' | transloco\" name=\"resources_description\" controlId=\"domain-build-resources_description\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.ResourceDescription' | transloco\">\n <textarea id=\"domain-build-resources_description\" class=\"form-control\" rows=\"3\" formControlName=\"resources_description\"\n [ngClass]=\"{ 'is-invalid': submitted && f['resources_description'].errors }\">\n </textarea>\n </pw-input-container>\n </div>\n </div>\n <div class=\"row\" matchHeight=\"card\">\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-resource_image-label\">{{ 'Admin.DomainConfig.ResourceImage' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.ResourceImage' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Image'\"\n [controlName]=\"'resources_image'\" [previewData]=\"data['resources_image']\">\n </pw-custom-uploader>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n <p-accordion-panel value=\"4\">\n <p-accordion-header>Unique Selling Proposition Section (USP)</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-4 mb-4\" formGroupName=\"usps\">\n <h4 class=\"mb-4\">Unique Selling Proposition Section (USP)</h4>\n\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"USPs Title\" name=\"title\" controlId=\"domain-build-usps-title\">\n <input type=\"text\" id=\"domain-build-usps-title\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"USPs Video Url\" name=\"video_url\" controlId=\"domain-build-usps-video_url\">\n <input type=\"text\" id=\"domain-build-usps-video_url\" class=\"form-control\" formControlName=\"video_url\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12\">\n <pw-input-container label=\"USPs Description\" name=\"description\" controlId=\"domain-build-usps-description\">\n <textarea id=\"domain-build-usps-description\" class=\"form-control\" rows=\"3\" formControlName=\"description\"></textarea>\n </pw-input-container>\n </div>\n\n <!-- USP Items -->\n <div formArrayName=\"items\" class=\"col-12\" cdkDropList (cdkDropListDropped)=\"dropItems(uspsItems, $event)\">\n <div\n *ngFor=\"let item of f['usps'].get('items')['controls']; let i = index\"\n [formGroupName]=\"i\"\n class=\"row mb-3 align-items-center\"\n cdkDrag\n >\n <div class=\"col-sm-10\">\n <pw-input-container label=\"Item Description\" name=\"description\" [controlId]=\"'domain-build-usps-item-desc-' + i\">\n <textarea [id]=\"'domain-build-usps-item-desc-' + i\" class=\"form-control\" rows=\"3\" formControlName=\"description\"></textarea>\n </pw-input-container>\n </div>\n\n <div class=\"col-sm-1 d-flex justify-content-end mt-3\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeUspItem(i)\"\n (keydown.enter)=\"removeUspItem(i)\"\n (keydown.space)=\"removeUspItem(i)\"\n ngbTooltip=\"Remove\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-sm-1 d-flex justify-content-end mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addUspItem()\">\n + Add USP Item\n </button>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n <p-accordion-panel value=\"5\">\n <p-accordion-header>Partners (Clients) Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-4 mb-4\" formGroupName=\"partners\">\n <h4 class=\"mb-4\">Partners (Clients) Section</h4>\n\n <!-- Title -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"Partner Title\" name=\"title\" controlId=\"domain-build-partners-title\">\n <input type=\"text\" id=\"domain-build-partners-title\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n </div>\n\n <!-- Description -->\n <div class=\"col-12\">\n <pw-input-container label=\"Partners Description\" name=\"description\" controlId=\"domain-build-partners-description\">\n <textarea id=\"domain-build-partners-description\" class=\"form-control\" rows=\"3\" formControlName=\"description\"></textarea>\n </pw-input-container>\n </div>\n\n <!-- Partner Items with Drag Support -->\n <div formArrayName=\"items\" class=\"col-12\" cdkDropList (cdkDropListDropped)=\"dropItems(partnersItems, $event)\">\n <div\n *ngFor=\"let item of partnersItems.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row border p-3 mb-3 align-items-start\"\n cdkDrag\n >\n <!-- Name -->\n <div class=\"col-md-6\">\n <pw-input-container label=\"Name\" class=\"col-12\" name=\"name\" [controlId]=\"'domain-build-partner-name-' + i\">\n <input [id]=\"'domain-build-partner-name-' + i\" class=\"form-control\" formControlName=\"name\" />\n </pw-input-container>\n </div>\n\n <!-- Blog URL + Drag Handle -->\n <div class=\"col-md-5\">\n <pw-input-container label=\"Blog Url\" name=\"blog_url\" [controlId]=\"'domain-build-partner-blog_url-' + i\">\n <input [id]=\"'domain-build-partner-blog_url-' + i\" class=\"form-control\" formControlName=\"blog_url\" />\n </pw-input-container>\n </div>\n\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder question\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n\n <!-- Video URL -->\n <div class=\"col-md-6\">\n <pw-input-container label=\"Video Url\" name=\"video_url\" [controlId]=\"'domain-build-partner-video_url-' + i\">\n <input [id]=\"'domain-build-partner-video_url-' + i\" class=\"form-control\" formControlName=\"video_url\" />\n </pw-input-container>\n </div>\n\n <!-- Image URL -->\n <div class=\"col-md-6\">\n <pw-input-container label=\"Image Url\" name=\"image_url\" [controlId]=\"'domain-build-partner-image_url-' + i\">\n <input [id]=\"'domain-build-partner-image_url-' + i\" class=\"form-control\" formControlName=\"image_url\" />\n </pw-input-container>\n </div>\n\n <!-- Delete Icon -->\n <div class=\"col-md-12 text-end mt-2\">\n <i\n ngbTooltip=\"Remove\"\n (click)=\"removePartnerItem(i)\"\n (keydown.enter)=\"removePartnerItem(i)\"\n (keydown.space)=\"removePartnerItem(i)\"\n class=\"fa fa-trash delete-icon text-danger\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <!-- Add New Partner -->\n <div class=\"text-start mt-2\">\n <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addPartnerItem()\">+ Add Partner</button>\n </div>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n <p-accordion-panel value=\"6\">\n <p-accordion-header>Testimonials Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-3 mb-4\" formGroupName=\"testimonials\">\n <h4 class=\"mb-4\">Testimonials Section</h4>\n\n <pw-input-container label=\"Title\" class=\"col-12 col-md-6\" name=\"testimonials_title\" controlId=\"domain-build-testimonials-title\">\n <input type=\"text\" id=\"domain-build-testimonials-title\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n\n <pw-input-container label=\"Description\" class=\"col-12\" name=\"testimonials_description\" controlId=\"domain-build-testimonials-description\">\n <textarea id=\"domain-build-testimonials-description\" rows=\"3\" class=\"form-control\" formControlName=\"description\"></textarea>\n </pw-input-container>\n\n <!-- Items List -->\n <div formArrayName=\"items\" class=\"col-12 mt-3\" cdkDropList (cdkDropListDropped)=\"dropItems(testimonialsItems, $event)\">\n <div\n *ngFor=\"let item of testimonialsItems.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row border p-3 mb-3 align-items-start\"\n cdkDrag\n >\n <div class=\"col-md-6\">\n <pw-input-container label=\"Name\" name=\"name\" [controlId]=\"'domain-build-testimonial-name-' + i\">\n <input type=\"text\" [id]=\"'domain-build-testimonial-name-' + i\" class=\"form-control\" formControlName=\"name\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-md-5\">\n <pw-input-container label=\"Blog URL\" name=\"blog_url\" [controlId]=\"'domain-build-testimonial-blog_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-testimonial-blog_url-' + i\" class=\"form-control\" formControlName=\"blog_url\" />\n </pw-input-container>\n </div>\n\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder question\"\n aria-hidden=\"true\"\n ></i>\n </div>\n <pw-input-container label=\"Image URL\" class=\"col-md-6\" name=\"image_url\" [controlId]=\"'domain-build-testimonial-image_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-testimonial-image_url-' + i\" class=\"form-control\" formControlName=\"image_url\" />\n </pw-input-container>\n\n <pw-input-container label=\"Video URL\" class=\"col-md-6\" name=\"video_url\" [controlId]=\"'domain-build-testimonial-video_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-testimonial-video_url-' + i\" class=\"form-control\" formControlName=\"video_url\" />\n </pw-input-container>\n\n <pw-input-container label=\"Testimonial\" class=\"col-md-10\" name=\"testimonial\" [controlId]=\"'domain-build-testimonial-text-' + i\">\n <textarea [id]=\"'domain-build-testimonial-text-' + i\" class=\"form-control\" rows=\"3\" formControlName=\"testimonial\"></textarea>\n </pw-input-container>\n\n <div class=\"col-md-2 d-flex align-items-start mt-3\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n ngbTooltip=\"Remove\"\n (click)=\"removeTestimonialItem(i)\"\n (keydown.enter)=\"removeTestimonialItem(i)\"\n (keydown.space)=\"removeTestimonialItem(i)\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <div class=\"text-start mt-2\">\n <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addTestimonialItem()\">\n + Add Testimonial\n </button>\n </div>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n <p-accordion-panel value=\"7\">\n <p-accordion-header>Video Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-3 mb-4\" formGroupName=\"videos\">\n <h4 class=\"mb-3\">Video Section</h4>\n\n <pw-input-container label=\"Title\" class=\"col-12 col-md-6\" name=\"videos_title\" controlId=\"domain-build-videos-title\">\n <input type=\"text\" id=\"domain-build-videos-title\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n\n <pw-input-container label=\"Description\" class=\"col-12\" name=\"videos_description\" controlId=\"domain-build-videos-description\">\n <textarea id=\"domain-build-videos-description\" rows=\"3\" class=\"form-control\" formControlName=\"description\"></textarea>\n </pw-input-container>\n\n <!-- Video Items -->\n <div\n formArrayName=\"items\"\n class=\"col-12 mt-3\"\n cdkDropList\n (cdkDropListDropped)=\"dropItems(videosItems, $event)\"\n >\n <div\n *ngFor=\"let item of videosItems.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row border p-3 mb-3 align-items-start\"\n cdkDrag\n >\n <div class=\"col-md-6\">\n <pw-input-container label=\"Title\" name=\"title\" [controlId]=\"'domain-build-video-item-title-' + i\">\n <input type=\"text\" [id]=\"'domain-build-video-item-title-' + i\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-md-5\">\n <pw-input-container label=\"Blog URL\" name=\"blog_url\" [controlId]=\"'domain-build-video-item-blog_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-video-item-blog_url-' + i\" class=\"form-control\" formControlName=\"blog_url\" />\n </pw-input-container>\n </div>\n\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder question\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <pw-input-container label=\"Image URL\" class=\"col-md-6\" name=\"image_url\" [controlId]=\"'domain-build-video-item-image_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-video-item-image_url-' + i\" class=\"form-control\" formControlName=\"image_url\" />\n </pw-input-container>\n\n <pw-input-container label=\"Video URL\" class=\"col-md-6\" name=\"video_url\" [controlId]=\"'domain-build-video-item-video_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-video-item-video_url-' + i\" class=\"form-control\" formControlName=\"video_url\" />\n </pw-input-container>\n\n <pw-input-container label=\"Description\" class=\"col-md-10\" name=\"description\" [controlId]=\"'domain-build-video-item-description-' + i\">\n <textarea [id]=\"'domain-build-video-item-description-' + i\" class=\"form-control\" rows=\"3\" formControlName=\"description\"></textarea>\n </pw-input-container>\n\n <div class=\"col-md-2 d-flex align-items-start mt-3\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeVideoItem(i)\"\n (keydown.enter)=\"removeVideoItem(i)\"\n (keydown.space)=\"removeVideoItem(i)\"\n ngbTooltip=\"Remove\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <div class=\"text-start mt-2\">\n <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addVideoItem()\">\n + Add Video\n </button>\n </div>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n <p-accordion-panel value=\"8\">\n <p-accordion-header>Call to Actions Section (CTAs)</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-4 mb-4\" formGroupName=\"ctas\">\n <h4 class=\"mb-4\">CTAs Section</h4>\n\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"Title\" name=\"title\" controlId=\"domain-build-ctas-title\">\n <input type=\"text\" id=\"domain-build-ctas-title\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"Image URL\" name=\"image_url\" controlId=\"domain-build-ctas-image_url\">\n <input type=\"text\" id=\"domain-build-ctas-image_url\" class=\"form-control\" formControlName=\"image_url\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"Button Text\" name=\"button_text\" controlId=\"domain-build-ctas-button_text\">\n <input type=\"text\" id=\"domain-build-ctas-button_text\" class=\"form-control\" formControlName=\"button_text\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12\">\n <pw-input-container label=\"Description\" name=\"description\" controlId=\"domain-build-ctas-description\">\n <input type=\"text\" id=\"domain-build-ctas-description\" class=\"form-control\" formControlName=\"description\" />\n </pw-input-container>\n </div>\n\n <!-- CTA Items -->\n <div formArrayName=\"items\" class=\"col-12 mt-3\" cdkDropList (cdkDropListDropped)=\"dropItems(ctasItems, $event)\">\n <div\n *ngFor=\"let item of ctasItems.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row border p-3 mb-3 align-items-start\"\n cdkDrag\n >\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"Image URL\" name=\"image_url\" [controlId]=\"'domain-build-cta-item-image_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-cta-item-image_url-' + i\" class=\"form-control\" formControlName=\"image_url\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-md-5\">\n <pw-input-container label=\"Cta URL\" name=\"cta_url\" [controlId]=\"'domain-build-cta-item-cta_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-cta-item-cta_url-' + i\" class=\"form-control\" formControlName=\"cta_url\" />\n </pw-input-container>\n </div>\n\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder question\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"Video URL\" name=\"video_url\" [controlId]=\"'domain-build-cta-item-video_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-cta-item-video_url-' + i\" class=\"form-control\" formControlName=\"video_url\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"CTA Title\" name=\"title\" [controlId]=\"'domain-build-cta-item-title-' + i\">\n <input [id]=\"'domain-build-cta-item-title-' + i\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-6\">\n <pw-input-container label=\"CTA Description\" name=\"description\" [controlId]=\"'domain-build-cta-item-description-' + i\">\n <input [id]=\"'domain-build-cta-item-description-' + i\" class=\"form-control\" formControlName=\"description\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-5\">\n <pw-input-container label=\"Button Text\" name=\"button_text\" [controlId]=\"'domain-build-cta-item-button_text-' + i\">\n <input [id]=\"'domain-build-cta-item-button_text-' + i\" class=\"form-control\" formControlName=\"button_text\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-md-1 d-flex align-items-center mt-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"removeCtasItem(i)\"\n (keydown.enter)=\"removeCtasItem(i)\"\n (keydown.space)=\"removeCtasItem(i)\"\n ngbTooltip=\"Remove\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <div class=\"text-start mt-2\">\n <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addCtasItem()\">+ Add CTA Item</button>\n </div>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n <p-accordion-panel value=\"9\">\n <p-accordion-header>Integrations Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-3 mb-4\" formGroupName=\"integrations\">\n <h4 class=\"mb-3\">Integrations Section</h4>\n\n <pw-input-container label=\"Title\" class=\"col-12\" name=\"title\" controlId=\"domain-build-integrations-title\">\n <input type=\"text\" id=\"domain-build-integrations-title\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n\n <pw-input-container label=\"Description\" class=\"col-12\" name=\"description\" controlId=\"domain-build-integrations-description\">\n <textarea id=\"domain-build-integrations-description\" class=\"form-control\" formControlName=\"description\" rows=\"3\"></textarea>\n </pw-input-container>\n\n <div formArrayName=\"items\" class=\"col-12\" cdkDropList (cdkDropListDropped)=\"dropItems(integrationsItems, $event)\">\n <div\n *ngFor=\"let item of integrationsItems.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row border p-3 mb-3 rounded bg-light\"\n cdkDrag\n >\n <pw-input-container label=\"Title\" class=\"col-md-6\" name=\"title\" [controlId]=\"'domain-build-integration-title-' + i\">\n <input type=\"text\" [id]=\"'domain-build-integration-title-' + i\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n\n <div class=\"col-md-5\">\n <pw-input-container label=\"Description\" name=\"description\" [controlId]=\"'domain-build-integration-description-' + i\">\n <input type=\"text\" [id]=\"'domain-build-integration-description-' + i\" class=\"form-control\" formControlName=\"description\" />\n </pw-input-container>\n </div>\n\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder question\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <pw-input-container label=\"Blog URL\" class=\"col-md-6\" name=\"blog_url\" [controlId]=\"'domain-build-integration-blog_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-integration-blog_url-' + i\" class=\"form-control\" formControlName=\"blog_url\" />\n </pw-input-container>\n\n <pw-input-container label=\"Image URL\" class=\"col-md-6\" name=\"image_url\" [controlId]=\"'domain-build-integration-image_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-integration-image_url-' + i\" class=\"form-control\" formControlName=\"image_url\" />\n </pw-input-container>\n\n <pw-input-container label=\"Video URL\" class=\"col-md-6\" name=\"video_url\" [controlId]=\"'domain-build-integration-video_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-integration-video_url-' + i\" class=\"form-control\" formControlName=\"video_url\" />\n </pw-input-container>\n\n <div class=\"col-md-6 d-flex align-items-end justify-content-end\">\n <i\n class=\"fa fa-trash delete-icon align-self-center\"\n (click)=\"removeIntegrationItem(i)\"\n (keydown.enter)=\"removeIntegrationItem(i)\"\n (keydown.space)=\"removeIntegrationItem(i)\"\n ngbTooltip=\"Remove\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <div class=\"text-start mt-2\">\n <button type=\"button\" class=\"btn btn-primary\" (click)=\"addIntegrationItem()\">+ Add Integration</button>\n </div>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n <p-accordion-panel value=\"10\">\n <p-accordion-header>Contact Us Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-3 mb-4\" formGroupName=\"contact_us\">\n <h4 class=\"mb-3\">Contact Us Section</h4>\n\n <pw-input-container label=\"Url\" class=\"col-md-6\" name=\"url\" controlId=\"domain-build-contact_us-url\">\n <input type=\"text\" id=\"domain-build-contact_us-url\" class=\"form-control\" formControlName=\"url\" />\n </pw-input-container>\n <pw-input-container label=\"Description\" class=\"col-12\" name=\"contact_us_description\" controlId=\"domain-build-contact_us-description\">\n <textarea id=\"domain-build-contact_us-description\" rows=\"3\" class=\"form-control\" formControlName=\"description\"></textarea>\n </pw-input-container>\n\n <div formArrayName=\"questions\" class=\"col-12 mt-3\" cdkDropList (cdkDropListDropped)=\"dropItems(contactUsQuestions, $event)\">\n <div\n *ngFor=\"let questionGroup of contactUsQuestions.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row border p-3 mb-3\"\n cdkDrag\n >\n <pw-input-container label=\"Question\" class=\"col-md-10\" name=\"question\" [controlId]=\"'domain-build-contact_us-question-' + i\">\n <input type=\"text\" [id]=\"'domain-build-contact_us-question-' + i\" class=\"form-control\" formControlName=\"question\" />\n </pw-input-container>\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeContactUsQuestion(i)\"\n (keydown.enter)=\"removeContactUsQuestion(i)\"\n (keydown.space)=\"removeContactUsQuestion(i)\"\n ngbTooltip=\"Remove\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder question\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-12 mt-3\" formArrayName=\"options\" cdkDropList [cdkDropListData]=\"getQuestionOptions(i).controls\" (cdkDropListDropped)=\"dropContactUsOptions(i, $event)\">\n <div\n class=\"row align-items-center mb-2 border p-3\"\n *ngFor=\"let option of getQuestionOptions(i).controls; let j = index\"\n [formGroupName]=\"j\"\n cdkDrag\n >\n <pw-input-container label=\"Option\" class=\"col-md-10\" name=\"option\" [controlId]=\"'domain-build-contact_us-option-' + i + '-' + j\">\n <input type=\"text\" [id]=\"'domain-build-contact_us-option-' + i + '-' + j\" class=\"form-control\" formControlName=\"option\" />\n </pw-input-container>\n\n <div class=\"col-md-1 d-flex justify-content-end mt-3\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeContactUsOption(i, j)\"\n (keydown.enter)=\"removeContactUsOption(i, j)\"\n (keydown.space)=\"removeContactUsOption(i, j)\"\n ngbTooltip=\"Remove Option\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-md-1 d-flex justify-content-end mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder option\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <div class=\"text-start\">\n <button type=\"button\" class=\"btn btn-primary btn-sm\" (click)=\"addContactUsOption(i)\">\n + Add Option\n </button>\n </div>\n </div>\n </div>\n\n <div class=\"text-start mt-3\">\n <button type=\"button\" class=\"btn btn-primary\" (click)=\"addContactUsQuestion()\">\n + Add Question\n </button>\n </div>\n </div>\n\n <div formArrayName=\"hubspot\" class=\"col-12 mt-4\" cdkDropList (cdkDropListDropped)=\"dropItems(contactUsHubspotItems, $event)\">\n <h5 class=\"mb-4\">Hubspot Embeds</h5>\n\n <div\n *ngFor=\"let hub of contactUsHubspotItems.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row border p-3 mb-2\"\n cdkDrag\n >\n <pw-input-container label=\"ID\" class=\"col-md-5\" name=\"id\" [controlId]=\"'domain-build-hubspot-id-' + i\">\n <input type=\"text\" [id]=\"'domain-build-hubspot-id-' + i\" class=\"form-control\" formControlName=\"id\" />\n </pw-input-container>\n\n <pw-input-container label=\"Position\" class=\"col-md-6\" name=\"position\" [controlId]=\"'domain-build-hubspot-position-' + i\">\n <input type=\"text\" [id]=\"'domain-build-hubspot-position-' + i\" class=\"form-control\" formControlName=\"position\" />\n </pw-input-container>\n <div class=\"col-md-1 d-flex align-items-start justify-content-end mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <pw-input-container label=\"Div\" class=\"col-10\" name=\"div\" [controlId]=\"'domain-build-hubspot-div-' + i\">\n <textarea\n [id]=\"'domain-build-hubspot-div-' + i\"\n class=\"form-control\"\n rows=\"5\"\n formControlName=\"div\"\n [ngClass]=\"{ 'is-invalid': submitted && f['div']?.errors }\"\n ></textarea>\n </pw-input-container>\n\n <div class=\"col-md-2 d-flex align-items-center mt-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (click)=\"removeHubspotItem(i)\"\n (keydown.enter)=\"removeHubspotItem(i)\"\n (keydown.space)=\"removeHubspotItem(i)\"\n ngbTooltip=\"Remove Hubspot Embed\"\n aria-hidden=\"true\">\n</i>\n </div>\n </div>\n\n <div class=\"text-start mt-2\">\n <button type=\"button\" class=\"btn btn-primary btn-sm\" (click)=\"addHubspotItem()\">\n + Add Hubspot Embed\n </button>\n </div>\n </div>\n\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n <p-accordion-panel value=\"11\">\n <p-accordion-header>Book a Demo Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-4\">\n <div class=\"col-12\">\n <h4 class=\"mb-3\">{{ 'Admin.DomainConfig.BookDemoLinks' | transloco }}</h4>\n <div formGroupName=\"book_demo\">\n <pw-input-container label=\"Title\" name=\"title\" controlId=\"domain-build-book_demo-title\">\n <input type=\"text\" id=\"domain-build-book_demo-title\" formControlName=\"title\" class=\"form-control\" />\n </pw-input-container>\n\n <pw-input-container label=\"Description\" name=\"description\" controlId=\"domain-build-book_demo-description\">\n <input type=\"text\" id=\"domain-build-book_demo-description\" formControlName=\"description\" class=\"form-control\" />\n </pw-input-container>\n\n <div formArrayName=\"items\" cdkDropList (cdkDropListDropped)=\"dropBookDemoLinks($event)\">\n <div\n *ngFor=\"let link of f['book_demo'].get('items')['controls']; let i = index\"\n [formGroupName]=\"i\"\n class=\"row mb-3 border p-3 align-items-center\"\n cdkDrag\n >\n <div class=\"col-sm-5\">\n <pw-input-container label=\"Link Title\" name=\"title\" [controlId]=\"'domain-build-book_demo-link-title-' + i\">\n <input type=\"text\" [id]=\"'domain-build-book_demo-link-title-' + i\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-sm-5\">\n <pw-input-container label=\"Link URL\" name=\"url\" [controlId]=\"'domain-build-book_demo-link-url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-book_demo-link-url-' + i\" class=\"form-control\" formControlName=\"url\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-sm-1 d-flex justify-content-end mt-3\">\n <i\n ngbTooltip=\"Remove\"\n (click)=\"removeBookDemoLink(i)\"\n (keydown.enter)=\"removeBookDemoLink(i)\"\n (keydown.space)=\"removeBookDemoLink(i)\"\n class=\"fa fa-trash delete-icon text-danger\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-sm-1 d-flex justify-content-end mt-3\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addBookDemoLink()\">\n + Add Book Demo Link\n </button>\n </div>\n </div>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n <p-accordion-panel value=\"12\">\n <p-accordion-header>Navbar Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-3 mb-4\" formGroupName=\"navbar\">\n <h4 class=\"mb-3\">Navbar Section</h4>\n\n <div formArrayName=\"items\" class=\"col-12\" cdkDropList (cdkDropListDropped)=\"dropItems(navbarItems, $event)\">\n <div\n *ngFor=\"let item of navbarItems.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row mb-3\"\n cdkDrag\n >\n <div class=\"row align-items-center\">\n <pw-input-container label=\"Title\" class=\"col-md-5\" name=\"title\" [controlId]=\"'domain-build-navbar-title-' + i\">\n <input type=\"text\" [id]=\"'domain-build-navbar-title-' + i\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n\n <pw-input-container label=\"Path\" class=\"col-md-5\" name=\"path\" [controlId]=\"'domain-build-navbar-path-' + i\">\n <input type=\"text\" [id]=\"'domain-build-navbar-path-' + i\" class=\"form-control\" formControlName=\"path\" />\n </pw-input-container>\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-1\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeNavbarItem(i)\"\n (keydown.enter)=\"removeNavbarItem(i)\"\n (keydown.space)=\"removeNavbarItem(i)\"\n ngbTooltip=\"Remove Navbar Item\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-1\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <div\n class=\"col-12 mt-3\"\n formArrayName=\"subtitles\"\n cdkDropList\n [cdkDropListData]=\"getNavbarSubtitles(i).controls\"\n (cdkDropListDropped)=\"dropNavbarSubtitles(i, $event)\"\n >\n <div\n *ngFor=\"let sub of getNavbarSubtitles(i).controls; let j = index\"\n [formGroupName]=\"j\"\n class=\"row border p-3 mb-2 align-items-center\"\n cdkDrag\n >\n <div class=\"col-md-5\">\n <pw-input-container label=\"Subtitle Title\" name=\"title\" [controlId]=\"'domain-build-navbar-subtitle-title-' + i + '-' + j\">\n <input type=\"text\" [id]=\"'domain-build-navbar-subtitle-title-' + i + '-' + j\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-md-5\">\n <pw-input-container label=\"Subtitle Path\" name=\"path\" [controlId]=\"'domain-build-navbar-subtitle-path-' + i + '-' + j\">\n <input type=\"text\" [id]=\"'domain-build-navbar-subtitle-path-' + i + '-' + j\" class=\"form-control\" formControlName=\"path\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-2\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeSubtitle(i, j)\"\n (keydown.enter)=\"removeSubtitle(i, j)\"\n (keydown.space)=\"removeSubtitle(i, j)\"\n ngbTooltip=\"Remove Subtitle\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <div class=\"col-md-1 d-flex justify-content-end\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder subtitle\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <button type=\"button\" class=\"btn btn-sm btn-primary mt-2\" (click)=\"addSubtitle(i)\">\n + Add Subtitle\n </button>\n </div>\n </div>\n\n <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addNavbarItem()\">\n + Add Navbar Item\n </button>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n <p-accordion-panel value=\"13\">\n <p-accordion-header>Footer Links Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-3 mb-4\" formGroupName=\"footer_links\">\n <h4 class=\"mb-3\">Footer Links Section</h4>\n\n <div\n formArrayName=\"items\"\n class=\"col-12\"\n cdkDropList\n (cdkDropListDropped)=\"dropItems(footerLinksItems, $event)\"\n >\n <div\n *ngFor=\"let item of footerLinksItems.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row mb-3\"\n cdkDrag\n >\n <div class=\"row align-items-center\">\n\n <pw-input-container label=\"Title\" class=\"col-md-5\" name=\"title\" [controlId]=\"'domain-build-footer-title-' + i\">\n <input type=\"text\" [id]=\"'domain-build-footer-title-' + i\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n\n <pw-input-container label=\"Path\" class=\"col-md-5\" name=\"path\" [controlId]=\"'domain-build-footer-path-' + i\">\n <input type=\"text\" [id]=\"'domain-build-footer-path-' + i\" class=\"form-control\" formControlName=\"path\" />\n </pw-input-container>\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-1\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeFooterLinkItem(i)\"\n (keydown.enter)=\"removeFooterLinkItem(i)\"\n (keydown.space)=\"removeFooterLinkItem(i)\"\n ngbTooltip=\"Remove Footer Item\"\n aria-hidden=\"true\"\n ></i>\n </div>\n <div class=\"col-md-1 d-flex align-items-start justify-content-end mt-1\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n </div>\n\n <div\n class=\"col-12 mt-3\"\n formArrayName=\"subtitles\"\n cdkDropList\n [cdkDropListData]=\"getFooterSubtitles(i).controls\"\n (cdkDropListDropped)=\"dropFooterSubtitles(i, $event)\"\n >\n <div\n *ngFor=\"let sub of getFooterSubtitles(i).controls; let j = index\"\n [formGroupName]=\"j\"\n class=\"row border p-3 mb-2 align-items-center\"\n cdkDrag\n >\n\n <div class=\"col-md-5\">\n <pw-input-container label=\"Subtitle Title\" name=\"title\" [controlId]=\"'domain-build-footer-subtitle-title-' + i + '-' + j\">\n <input type=\"text\" [id]=\"'domain-build-footer-subtitle-title-' + i + '-' + j\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n </div>\n\n <div class=\"col-md-5\">\n <pw-input-container label=\"Subtitle Path\" name=\"path\" [controlId]=\"'domain-build-footer-subtitle-path-' + i + '-' + j\">\n <input type=\"text\" [id]=\"'domain-build-footer-subtitle-path-' + i + '-' + j\" class=\"form-control\" formControlName=\"path\" />\n </pw-input-container>\n </div>\n\n\n\n\n <div class=\"col-md-1 d-flex justify-content-end align-items-start mt-2\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeFooterSubtitle(i, j)\"\n (keydown.enter)=\"removeFooterSubtitle(i, j)\"\n (keydown.space)=\"removeFooterSubtitle(i, j)\"\n ngbTooltip=\"Remove Subtitle\"\n aria-hidden=\"true\"\n ></i>\n </div>\n <div class=\"col-md-1 d-flex justify-content-end\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder subtitle\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <button\n type=\"button\"\n class=\"btn btn-sm btn-primary mt-2\"\n (click)=\"addFooterSubtitle(i)\"\n >\n + Add Subtitle\n </button>\n </div>\n </div>\n\n <button\n type=\"button\"\n class=\"btn btn-primary mt-2 mb-2\"\n (click)=\"addFooterLinkItem()\"\n >\n + Add Footer Link\n </button>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n\n\n\n <p-accordion-panel value=\"14\">\n <p-accordion-header>Guides Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-3 mb-4\" formGroupName=\"guides\">\n <h4 class=\"mb-3\">Guides Section</h4>\n\n <div formArrayName=\"items\" class=\"col-12\">\n <div cdkDropList (cdkDropListDropped)=\"dropItems(guidesItems, $event)\">\n <div\n *ngFor=\"let item of guidesItems.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"border p-3 mb-3\"\n cdkDrag\n >\n <div class=\"row align-items-start\">\n\n <pw-input-container label=\"Title\" class=\"col-md-5\" name=\"title\" [controlId]=\"'domain-build-guide-title-' + i\">\n <input type=\"text\" [id]=\"'domain-build-guide-title-' + i\" class=\"form-control\" formControlName=\"title\" />\n </pw-input-container>\n\n <pw-input-container label=\"Button Text\" class=\"col-md-6\" name=\"button_text\" [controlId]=\"'domain-build-guide-button_text-' + i\">\n <input type=\"text\" [id]=\"'domain-build-guide-button_text-' + i\" class=\"form-control\" formControlName=\"button_text\" />\n </pw-input-container>\n <div class=\"col-md-1 d-flex align-items-start justify-content-end mt-1\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <div class=\"row mt-2\">\n <pw-input-container label=\"Image URL\" class=\"col-md-6\" name=\"image_url\" [controlId]=\"'domain-build-guide-image_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-guide-image_url-' + i\" class=\"form-control\" formControlName=\"image_url\" />\n </pw-input-container>\n\n <pw-input-container label=\"Guide URL\" class=\"col-md-6\" name=\"guide_url\" [controlId]=\"'domain-build-guide-guide_url-' + i\">\n <input type=\"text\" [id]=\"'domain-build-guide-guide_url-' + i\" class=\"form-control\" formControlName=\"guide_url\" />\n </pw-input-container>\n </div>\n\n <div class=\"row mt-2\">\n <pw-input-container label=\"Description\" class=\"col-md-11\" name=\"description\" [controlId]=\"'domain-build-guide-description-' + i\">\n <textarea\n [id]=\"'domain-build-guide-description-' + i\"\n class=\"form-control\"\n rows=\"5\"\n formControlName=\"description\"\n [ngClass]=\"{ 'is-invalid': submitted && f['description']?.errors }\"\n ></textarea>\n </pw-input-container>\n\n <div class=\"col-md-1 d-flex align-items-start justify-content-center mt-3\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeGuideItem(i)\"\n (keydown.enter)=\"removeGuideItem(i)\"\n (keydown.space)=\"removeGuideItem(i)\"\n ngbTooltip=\"Remove Guide\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"text-start mt-2\">\n <button type=\"button\" class=\"btn btn-primary\" (click)=\"addGuideItem()\">\n + Add Guide\n </button>\n </div>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n\n <p-accordion-panel value=\"15\">\n <p-accordion-header>AB Tests Section</p-accordion-header>\n <p-accordion-content>\n <div class=\"row mt-3 mb-4\">\n <h4 class=\"mb-3\">AB Tests</h4>\n <div formArrayName=\"ab_tests\" class=\"col-12\" cdkDropList (cdkDropListDropped)=\"dropItems(abTests, $event)\">\n <div\n *ngFor=\"let abTest of abTests.controls; let i = index\"\n [formGroupName]=\"i\"\n class=\"row mb-3 border p-3\"\n cdkDrag\n >\n <pw-input-container label=\"Description\" class=\"col-md-5\" name=\"description\" [controlId]=\"'domain-build-ab_test-description-' + i\">\n <input type=\"text\" [id]=\"'domain-build-ab_test-description-' + i\" class=\"form-control\" formControlName=\"description\" />\n </pw-input-container>\n\n <pw-input-container label=\"Experiment Name\" class=\"col-md-6\" name=\"experiment_name\" [controlId]=\"'domain-build-ab_test-experiment_name-' + i\">\n <input type=\"text\" [id]=\"'domain-build-ab_test-experiment_name-' + i\" class=\"form-control\" formControlName=\"experiment_name\" />\n </pw-input-container>\n\n\n <div class=\"col-md-1 d-flex align-items-start justify-content-end mt-1\">\n <i\n class=\"fa fa-bars cursor-move\"\n cdkDragHandle\n ngbTooltip=\"Drag to reorder\"\n aria-hidden=\"true\"\n ></i>\n </div>\n\n <pw-input-container label=\"DB Shard\" class=\"col-md-6\" name=\"db_shard\" [controlId]=\"'domain-build-ab_test-db_shard-' + i\">\n <input type=\"text\" [id]=\"'domain-build-ab_test-db_shard-' + i\" class=\"form-control\" formControlName=\"db_shard\" />\n </pw-input-container>\n\n <pw-input-container label=\"Microservice Name\" class=\"col-md-6\" name=\"microservice_name\" [controlId]=\"'domain-build-ab_test-microservice_name-' + i\">\n <input type=\"text\" [id]=\"'domain-build-ab_test-microservice_name-' + i\" class=\"form-control\" formControlName=\"microservice_name\" />\n </pw-input-container>\n\n <div class=\"col-md-12 text-end mt-2\">\n <i\n class=\"fa fa-trash delete-icon text-danger\"\n (click)=\"removeAbTest(i)\"\n (keydown.enter)=\"removeAbTest(i)\"\n (keydown.space)=\"removeAbTest(i)\"\n ngbTooltip=\"Remove AB Test\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <div class=\"text-start mt-2\">\n <button type=\"button\" class=\"btn btn-primary\" (click)=\"addAbTest()\">+ Add AB Test</button>\n </div>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n\n\n\n\n\n <p-accordion-panel value=\"16\">\n <p-accordion-header>Coming soon pages - Subscribe to newsletter (TO DISCONTINUE)</p-accordion-header>\n <p-accordion-content>\n <div class=\"mb-3\">\n <p>ComingSoon Pages will enable users to subscribe to Newsletters and are accessible at the internal paths\n /join/cs1, /join/cs2, etc.</p>\n </div>\n <div class=\"text-end\" *ngIf=\"shardUrl\">\n <span>See the live page <span class=\"tooltip-wrap ms-1\" [appendTo]=\"'body'\"\n [pTooltip]=\"'Admin.DomainConfig.Tooltip.SeeLiveCs' | transloco\" tooltipPosition=\"top\">\n <i class=\"fas fa-info-circle\"></i>\n </span> : <a [href]=\"shardUrl + '/join/cs1'\" target=\"_blank\">{{ shardUrl }}/join/cs1</a></span>\n </div>\n <div class=\"row\">\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CsProduct' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsProduct' | transloco\" name=\"cs_product_id\" controlId=\"domain-build-cs_product_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-autoComplete [attr.aria-labelledby]=\"'domain-build-cs_product_id-label'\" [suggestions]=\"productsList\" formControlName=\"cs_product_id\" dataKey=\"id\" field=\"name\"\n [dropdown]=\"true\" [delay]=\"1000\" (completeMethod)=\"searchProduct($event)\" styleClass=\"w-100\"\n placeholder=\"Search Product\" [inputStyle]=\"\n form.get('cs_product_id').touched &&\n form.get('cs_product_id').invalid\n ? { border: '1px solid #ff586b' }\n : { border: '1px solid gray' }\n \" [multiple]=\"false\">\n </p-autoComplete>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CsCrmSourceId' | transloco\" name=\"cs_crm_source_id\" controlId=\"domain-build-cs_crm_source_id\" [useAriaLabelledbyOnly]=\"true\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsCrmSourceId' | transloco\">\n <p-select inputId=\"domain-build-cs_crm_source_id\"\n [options]=\"crmSourcesList\" [attr.aria-labelledby]=\"'domain-build-cs_crm_source_id-label'\" formControlName=\"cs_crm_source_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['cs_crm_source_id']?.errors }\" [placeholder]=\"'Select CRM Source'\"\n optionValue=\"id\" optionLabel=\"name\">\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CsPdfSourceId' | transloco\" name=\"cs_pdf_source_id\" controlId=\"domain-build-cs_pdf_source_id\" [useAriaLabelledbyOnly]=\"true\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsPdfSourceId' | transloco\">\n <p-select inputId=\"domain-build-cs_pdf_source_id\"\n [options]=\"crmSourcesList\" [attr.aria-labelledby]=\"'domain-build-cs_pdf_source_id-label'\" formControlName=\"cs_pdf_source_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['cs_pdf_source_id']?.errors }\" [placeholder]=\"'Select CRM Source'\"\n optionValue=\"id\" optionLabel=\"name\">\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\"></div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CsVideoUrl' | transloco\" name=\"cs_video_url\" controlId=\"domain-build-cs_video_url\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsVideoUrl' | transloco\">\n <input type=\"text\" id=\"domain-build-cs_video_url\" class=\"form-control\" formControlName=\"cs_video_url\"\n [ngClass]=\"{ 'is-invalid': submitted && f['cs_video_url'].errors }\" />\n </pw-input-container>\n </div>\n <div class=\"col-12 col-sm-3\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CsBookDemoUrl' | transloco\" name=\"cs_book_demo_url\" controlId=\"domain-build-cs_book_demo_url\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsBookDemoUrl' | transloco\">\n <input type=\"text\" id=\"domain-build-cs_book_demo_url\" class=\"form-control\" formControlName=\"cs_book_demo_url\"\n [ngClass]=\"{ 'is-invalid': submitted && f['cs_book_demo_url'].errors }\" />\n </pw-input-container>\n </div>\n <div class=\"col-12\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CsCtaIframe' | transloco\" name=\"cs_cta_iframe\" controlId=\"domain-build-cs_cta_iframe\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsCtaIframe' | transloco\">\n <textarea id=\"domain-build-cs_cta_iframe\" class=\"form-control\" rows=\"3\" formControlName=\"cs_cta_iframe\"\n [ngClass]=\"{ 'is-invalid': submitted && f['cs_cta_iframe'].errors }\">\n </textarea>\n </pw-input-container>\n </div>\n <div class=\"col-12\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CsJoinMessage' | transloco\" name=\"cs_join_message\" controlId=\"domain-build-cs_join_message\"\n [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsJoinMessage' | transloco\">\n <textarea id=\"domain-build-cs_join_message\" class=\"form-control\" rows=\"3\" formControlName=\"cs_join_message\"\n [ngClass]=\"{ 'is-invalid': submitted && f['cs_join_message'].errors }\">\n </textarea>\n </pw-input-container>\n </div>\n <div class=\"col-12\">\n <pw-input-container [label]=\"'Admin.DomainConfig.CsPdfDownloadText' | transloco\" name=\"cs_pdf_download_text\" controlId=\"domain-build-cs_pdf_download_text\"\n [showTooltip]=\"true\" [tooltipText]=\"\n 'Admin.DomainConfig.Tooltip.CsPdfDownloadText' | transloco\n \">\n <textarea id=\"domain-build-cs_pdf_download_text\" class=\"form-control\" rows=\"3\" formControlName=\"cs_pdf_download_text\" [ngClass]=\"{\n 'is-invalid': submitted && f['cs_pdf_download_text'].errors\n }\">\n </textarea>\n </pw-input-container>\n </div>\n </div>\n <div class=\"row\" matchHeight=\"card\">\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-cs_image-label\">{{ 'Admin.DomainConfig.CsImage' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImage' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Image'\"\n [controlName]=\"'cs_image'\" [previewData]=\"data['cs_image']\">\n </pw-custom-uploader>\n </div>\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-cs_image2-label\">{{ 'Admin.DomainConfig.CsImage2' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImage2' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Image2'\"\n [controlName]=\"'cs_image2'\" [previewData]=\"data['cs_image2']\">\n </pw-custom-uploader>\n </div>\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-cs_pdf_image-label\">{{ 'Admin.DomainConfig.CsPdfImage' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsPdfImage' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Pdf Image'\"\n [controlName]=\"'cs_pdf_image'\" [previewData]=\"data['cs_pdf_image']\">\n </pw-custom-uploader>\n </div>\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-cs_image_bg-label\">{{ 'Admin.DomainConfig.CsImageBg' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImageBg' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Pdf Image Bg'\"\n [controlName]=\"'cs_image_bg'\" [previewData]=\"data['cs_image_bg']\">\n </pw-custom-uploader>\n </div>\n <div class=\"col-md-4\">\n <span class=\"pw-label-style\" id=\"domain-build-cs_image_bg2-label\">{{ 'Admin.DomainConfig.CsImageBg2' | transloco }} <span class=\"info-circle\">\n <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImageBg2' | transloco\n }}</span>\n </span>\n </span>\n <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Pdf Image Bg2'\"\n [controlName]=\"'cs_image_bg2'\" [previewData]=\"data['cs_image_bg2']\">\n </pw-custom-uploader>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n </p-accordion>\n </div>\n\n <div class=\"col-12 text-end mt-3\">\n <button type=\"button\"\n class=\"btn btn-outline-default me-2\"\n (click)=\"back()\">\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button type=\"submit\" [buttonBusy]=\"buttonBusy\"\n class=\"btn btn-primary\">{{ 'Button.Submit' | transloco }}</button>\n </div>\n </form>\n</ng-container>\n<div *ngIf=\"!data?.host_name && !isLoading\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Admin.DomainConfig.EnableConfigTab' | transloco\"> </pw-no-data>\n</div>\n\n\n<ng-template #partnerCropper let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Upload Partner Image</h5>\n <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n </div>\n <div class=\"modal-body\">\n <small>You can upload JPG, PNG, or GIF files. Avoid images with celebrities, nudity, or artwork.</small>\n <pw-image-cropper\n aspectRatio=\"auto\"\n (imageSelectionEvent)=\"onPartnerImageSelected($event)\"\n (closeEvent)=\"onClosePartnerModal()\"\n ></pw-image-cropper>\n </div>\n</ng-template>\n" }]
|
|
1397
1397
|
}], ctorParameters: () => [{ type: i0.Injector }, { type: i1.AdminService }, { type: i1$2.ProductService }, { type: i2$1.NgbModal }, { type: i3$2.FormBuilder }], propDecorators: { uploader: [{
|
|
1398
1398
|
type: ViewChildren,
|
|
1399
1399
|
args: [CustomUploaderComponent]
|
|
@@ -3887,7 +3887,7 @@ class NewsletterItemDetailsComponent extends AppBaseComponent {
|
|
|
3887
3887
|
super.ngOnDestroy();
|
|
3888
3888
|
}
|
|
3889
3889
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: NewsletterItemDetailsComponent, deps: [{ token: i1.AdminService }, { token: i1$2.TagService }, { token: i1$2.ProductService }, { token: i1$2.AuthService }, { token: i0.Injector }, { token: i3$4.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3890
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: NewsletterItemDetailsComponent, isStandalone: false, selector: "pw-newsletter-item-details", viewQueries: [{ propertyName: "placesRef", first: true, predicate: ["ngxPlaces"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"container-fluid pw-tab overflow-hidden\">\n <div class=\"dashboard\">\n <div class=\"dashboard-body\">\n <div class=\"me-auto col-xs-6 mt-4\">\n <a aria-label=\"Navigate to Target\"\n [routerLink]=\"[routers.newsletter]\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h3 class=\"\">Newsletter Item: {{ isLoading ? '' : (data?.title ? data?.title : 'Add New') }}</h3>\n </div>\n <div class=\"mt-1\">\n <p class=\"my-4\">\n To personalize the subject or body, use {{ userNameSyntax }} to insert the user\u2019s name.\n </p>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"isLoading\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <form [formGroup]=\"form\"\n *ngIf=\"!isLoading\"\n (ngSubmit)=\"onSave()\">\n <div class=\"row\">\n <!-- Title -->\n <pw-input-container [label]=\"'Admin.NewsletterItem.Title' | transloco\"\n class=\"col-md-6\"\n name=\"title\" controlId=\"newsletter-item-title\"\n [errorMsg]=\"'Admin.NewsletterItem.Validation.Title' | transloco\">\n <input type=\"text\"\n id=\"newsletter-item-title\"\n class=\"form-control\"\n formControlName=\"title\"\n [ngClass]=\"{ 'is-invalid': submitted && f['title'].errors }\" />\n </pw-input-container>\n <!-- Newsletter -->\n <pw-input-container [label]=\"'Admin.NewsletterItem.Newsletter' | transloco\"\n class=\"col-md-6\"\n name=\"newsletter_id\" controlId=\"newsletter-item-newsletter_id\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.NewsletterItem.Validation.Newsletter' | transloco\">\n <p-select [options]=\"newsletters\"\n [attr.aria-labelledby]=\"'newsletter-item-newsletter_id-label'\"\n formControlName=\"newsletter_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['newsletter_id'].errors }\">\n </p-select>\n </pw-input-container>\n <!-- Rich Text Editor -->\n <pw-input-container [label]=\"'Admin.NewsletterItem.Body' | transloco\"\n class=\"col-12\"\n name=\"body\" controlId=\"newsletter-item-body\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.NewsletterItem.Validation.Body' | transloco\">\n <quill-editor [attr.aria-labelledby]=\"'newsletter-item-body-label'\" [styles]=\"{ height: '450px' }\"\n class=\"quillEditor quill-editor\" [modules]=\"editorConfig\"\n formControlName=\"body\"\n [ngClass]=\"{ 'is-invalid': submitted && f['body'].errors, 'quill-container': true }\">\n </quill-editor>\n </pw-input-container>\n <!-- Location -->\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.NewsletterItem.Tooltip.Location' | transloco\"\n [label]=\"'Admin.NewsletterItem.Location' | transloco\"\n class=\"col-md-6\"\n name=\"location\" controlId=\"newsletter-item-location\" [useAriaLabelledbyOnly]=\"true\">\n <input ngx-gp-autocomplete\n id=\"newsletter-item-location\"\n name=\"location\"\n class=\"form-control\"\n [attr.aria-labelledby]=\"'newsletter-item-location-label'\"\n #places=\"ngx-places\"\n formControlName=\"location\"\n (onAddressChange)=\"handleAddressChange($event)\"\n [ngClass]=\"{ 'is-invalid': submitted && f['location'].errors }\" />\n </pw-input-container>\n <div class=\"ui-fluid skills-modal col-12 col-md-6 mt-1 mb-3\">\n <span id=\"newsletter-item-tags-label\" class=\"pw-label-style\">{{ 'Admin.NewsletterItem.Tags' | transloco }}\n <span class=\"ms-1 tooltip-wrap\"\n [pTooltip]=\"'Admin.NewsletterItem.Tooltip.Tags' | transloco\"\n [appendTo]=\"'body'\"\n [tooltipPosition]=\"'top'\">\n <i class=\"fas fa-info-circle\"></i>\n </span>\n </span>\n <p-autoComplete [(ngModel)]=\"selectedTags\"\n [attr.aria-labelledby]=\"'newsletter-item-tags-label'\"\n [suggestions]=\"tagsSuggestion\"\n dataKey=\"id\"\n field=\"name\"\n (completeMethod)=\"search($event)\"\n styleClass=\"w-100\"\n [minLength]=\"1\"\n [maxlength]=\"10\"\n [dropdown]=\"true\"\n [ngModelOptions]=\"{ standalone: true }\"\n placeholder=\"Tags\"\n [multiple]=\"true\"></p-autoComplete>\n </div>\n <!-- Products -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.NewsletterItem.Tooltip.Products' | transloco\"\n [label]=\"'Admin.NewsletterItem.Products' | transloco\"\n name=\"product_ids\" controlId=\"newsletter-item-product_ids\" [useAriaLabelledbyOnly]=\"true\">\n <p-multiSelect inputId=\"newsletter-item-product_ids\"\n [options]=\"products\"\n [attr.aria-labelledby]=\"'newsletter-item-product_ids-label'\"\n placeholder=\"Select Products\"\n [showHeader]=\"true\"\n [showToggleAll]=\"true\"\n formControlName=\"product_ids\"\n appendTo=\"body\"></p-multiSelect>\n </pw-input-container>\n </div>\n <!-- Features -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.NewsletterItem.Tooltip.Features' | transloco\"\n [label]=\"'Admin.NewsletterItem.Features' | transloco\"\n name=\"feature_keys\" controlId=\"newsletter-item-feature_keys\" [useAriaLabelledbyOnly]=\"true\">\n <p-multiSelect inputId=\"newsletter-item-feature_keys\"\n [options]=\"featureKeys\"\n [attr.aria-labelledby]=\"'newsletter-item-feature_keys-label'\"\n placeholder=\"Select feature keys\"\n [showHeader]=\"true\"\n [showToggleAll]=\"true\"\n formControlName=\"feature_keys\"\n appendTo=\"body\"></p-multiSelect>\n </pw-input-container>\n </div>\n <!-- Previous Newsletter Items -->\n <div class=\"col-12\"\n [ngClass]=\"f['main_tag_id'].value ? 'col-md-3' : 'col-md-6'\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.NewsletterItem.PreviousNewsletter' | transloco\"\n [showTooltip]=\"true\"\n [tooltipText]=\"\n 'Admin.NewsletterItem.Tooltip.PreviousNewsletter'\n | transloco\n \"\n name=\"main_tag_id\" controlId=\"newsletter-item-main_tag_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-select [options]=\"newsletterItems\"\n [attr.aria-labelledby]=\"'newsletter-item-main_tag_id-label'\"\n formControlName=\"main_tag_id\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['main_tag_id'].errors\n }\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <!-- DAYS TO WAIT -->\n <div class=\"col-md-3 col-xs-6\"\n *ngIf=\"form.get('main_tag_id').value\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.NewsletterItem.DaysToWait' | transloco\"\n [showTooltip]=\"true\"\n [tooltipText]=\"\n 'Admin.NewsletterItem.Tooltip.DaysToWaitFromPreviousNewsletter'\n | transloco\n \"\n name=\"days_to_wait_from_previous_newsletter\" controlId=\"newsletter-item-days_to_wait\">\n <input type=\"number\"\n id=\"newsletter-item-days_to_wait\"\n class=\"form-control\"\n formControlName=\"days_to_wait_from_previous_newsletter\"\n [ngClass]=\"{\n 'is-invalid':\n submitted &&\n f['days_to_wait_from_previous_newsletter'].errors\n }\" />\n </pw-input-container>\n </div>\n </div>\n <!-- IS SENT -->\n <div class=\"col-md-3 col-xs-6\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.NewsletterItem.SendDate' | transloco\"\n [showTooltip]=\"true\"\n [tooltipText]=\"\n 'Admin.NewsletterItem.Tooltip.SendDate' | transloco\n \"\n [errorMsg]=\"\n 'Admin.NewsletterItem.Validation.SendDate' | transloco\n \"\n name=\"send_at\" controlId=\"newsletter-item-send_at\" [useAriaLabelledbyOnly]=\"true\">\n <div>\n <p-calendar inputId=\"newsletter-item-send_at\" [attr.aria-labelledby]=\"'newsletter-item-send_at-label'\" formControlName=\"send_at\"\n [showIcon]=\"true\"\n dateFormat=\"dd-M-yy\"\n [placeholder]=\"'Send Date'\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['send_at'].errors\n }\">\n </p-calendar>\n </div>\n </pw-input-container>\n </div>\n </div>\n <!-- Expiry Date for Newsletter -->\n <div class=\"col-md-3 col-xs-6\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"\n 'Admin.NewsletterItem.Tooltip.SendUntil' | transloco\n \"\n [label]=\"'Admin.NewsletterItem.SendUntil' | transloco\"\n name=\"send_until\" controlId=\"newsletter-item-send_until\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"\n 'Admin.NewsletterItem.Validation.SendUntil' | transloco\n \">\n <div>\n <p-calendar inputId=\"newsletter-item-send_until\" [attr.aria-labelledby]=\"'newsletter-item-send_until-label'\" formControlName=\"send_until\"\n [showIcon]=\"true\"\n dateFormat=\"dd-M-yy\"\n [placeholder]=\"'Send Until Date'\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['send_until'].errors\n }\">\n </p-calendar>\n </div>\n </pw-input-container>\n </div>\n </div>\n <!-- Only new users -->\n <div class=\"col-md-3\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"\n 'Admin.NewsletterItem.Tooltip.OnlyNewUsers' | transloco\n \"\n [label]=\"'Admin.NewsletterItem.OnlyNewUsers' | transloco\"\n name=\"only_new_users\" controlId=\"newsletter-item-only_new_users\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch formControlName=\"only_new_users\"\n [attr.aria-labelledby]=\"'newsletter-item-only_new_users-label'\"\n name=\"only_new_users\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['only_new_users'].errors\n }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <!-- IS PUSHED -->\n <div class=\"col-md-3\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"\n 'Admin.NewsletterItem.Tooltip.ShouldDeliver' | transloco\n \"\n [label]=\"'Admin.NewsletterItem.ShouldDeliver' | transloco\"\n name=\"is_pushed\" controlId=\"newsletter-item-is_pushed\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch formControlName=\"is_pushed\"\n [attr.aria-labelledby]=\"'newsletter-item-is_pushed-label'\"\n name=\"is_pushed\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['is_pushed'].errors\n }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n </div>\n <div class=\"row\"></div>\n <div class=\"row text-end mt-3\">\n <div class=\"col-12\">\n <button type=\"button\"\n class=\"btn btn-outline-default me-2\"\n (click)=\"back()\">\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n class=\"btn btn-primary\">\n {{ 'Button.Save' | transloco }}\n </button>\n </div>\n </div>\n </form>\n </div>\n </div>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i4$2.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: i5$1.AutoComplete, selector: "p-autoComplete, p-autocomplete, p-auto-complete", inputs: ["minLength", "delay", "style", "panelStyle", "styleClass", "panelStyleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "readonly", "disabled", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "maxlength", "name", "required", "size", "appendTo", "autoHighlight", "forceSelection", "type", "autoZIndex", "baseZIndex", "ariaLabel", "dropdownAriaLabel", "ariaLabelledBy", "dropdownIcon", "unique", "group", "completeOnFocus", "showClear", "field", "dropdown", "showEmptyMessage", "dropdownMode", "multiple", "tabindex", "dataKey", "emptyMessage", "showTransitionOptions", "hideTransitionOptions", "autofocus", "autocomplete", "optionGroupChildren", "optionGroupLabel", "overlayOptions", "suggestions", "itemSize", "optionLabel", "optionValue", "id", "searchMessage", "emptySelectionMessage", "selectionMessage", "autoOptionFocus", "selectOnFocus", "searchLocale", "optionDisabled", "focusOnHover", "typeahead", "variant", "fluid"], outputs: ["completeMethod", "onSelect", "onUnselect", "onFocus", "onBlur", "onDropdownClick", "onClear", "onKeyUp", "onShow", "onHide", "onLazyLoad"] }, { kind: "component", type: i3.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "size", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "fluid", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i6.MultiSelect, selector: "p-multiSelect, p-multiselect, p-multi-select", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "fluid", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "chipIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "size", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus", "highlightOnSelect"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "component", type: i8.Calendar, selector: "p-calendar", inputs: ["iconDisplay", "style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "fluid", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "variant", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$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: i3$2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.UiSwitchComponent, selector: "ui-switch", inputs: ["size", "color", "switchOffColor", "switchColor", "defaultBgColor", "defaultBoColor", "checkedLabel", "uncheckedLabel", "checkedTextColor", "uncheckedTextColor", "beforeChange", "ariaLabel", "checked", "disabled", "reverse", "loading"], outputs: ["change", "changeEvent", "valueChange"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "controlId", "useAriaLabelledbyOnly", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i14.NgxGpAutocompleteDirective, selector: "[ngx-gp-autocomplete]", inputs: ["options"], outputs: ["onAddressChange"], exportAs: ["ngx-places"] }, { kind: "directive", type: i10.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i11.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i9.QuillEditorComponent, selector: "quill-editor" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
|
|
3890
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: NewsletterItemDetailsComponent, isStandalone: false, selector: "pw-newsletter-item-details", viewQueries: [{ propertyName: "placesRef", first: true, predicate: ["ngxPlaces"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"container-fluid pw-tab overflow-hidden\">\n <div class=\"dashboard\">\n <div class=\"dashboard-body\">\n <div class=\"me-auto col-xs-6 mt-4\">\n <a aria-label=\"Navigate to Target\"\n [routerLink]=\"[routers.newsletter]\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h3 class=\"\">Newsletter Item: {{ isLoading ? '' : (data?.title ? data?.title : 'Add New') }}</h3>\n </div>\n <div class=\"mt-1\">\n <p class=\"my-4\">\n To personalize the subject or body, use {{ userNameSyntax }} to insert the user\u2019s name.\n </p>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"isLoading\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <form [formGroup]=\"form\"\n *ngIf=\"!isLoading\"\n (ngSubmit)=\"onSave()\">\n <div class=\"row\">\n <!-- Title -->\n <pw-input-container [label]=\"'Admin.NewsletterItem.Title' | transloco\"\n class=\"col-md-6\"\n name=\"title\" controlId=\"newsletter-item-title\"\n [errorMsg]=\"'Admin.NewsletterItem.Validation.Title' | transloco\">\n <input type=\"text\"\n id=\"newsletter-item-title\"\n class=\"form-control\"\n formControlName=\"title\"\n [ngClass]=\"{ 'is-invalid': submitted && f['title'].errors }\" />\n </pw-input-container>\n <!-- Newsletter -->\n <pw-input-container [label]=\"'Admin.NewsletterItem.Newsletter' | transloco\"\n class=\"col-md-6\"\n name=\"newsletter_id\" controlId=\"newsletter-item-newsletter_id\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.NewsletterItem.Validation.Newsletter' | transloco\">\n <p-select inputId=\"newsletter-item-newsletter_id\"\n [options]=\"newsletters\"\n [attr.aria-labelledby]=\"'newsletter-item-newsletter_id-label'\"\n formControlName=\"newsletter_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['newsletter_id'].errors }\">\n </p-select>\n </pw-input-container>\n <!-- Rich Text Editor -->\n <pw-input-container [label]=\"'Admin.NewsletterItem.Body' | transloco\"\n class=\"col-12\"\n name=\"body\" controlId=\"newsletter-item-body\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.NewsletterItem.Validation.Body' | transloco\">\n <quill-editor [attr.aria-labelledby]=\"'newsletter-item-body-label'\" [styles]=\"{ height: '450px' }\"\n class=\"quillEditor quill-editor\" [modules]=\"editorConfig\"\n formControlName=\"body\"\n [ngClass]=\"{ 'is-invalid': submitted && f['body'].errors, 'quill-container': true }\">\n </quill-editor>\n </pw-input-container>\n <!-- Location -->\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.NewsletterItem.Tooltip.Location' | transloco\"\n [label]=\"'Admin.NewsletterItem.Location' | transloco\"\n class=\"col-md-6\"\n name=\"location\" controlId=\"newsletter-item-location\" [useAriaLabelledbyOnly]=\"true\">\n <input ngx-gp-autocomplete\n id=\"newsletter-item-location\"\n name=\"location\"\n class=\"form-control\"\n [attr.aria-labelledby]=\"'newsletter-item-location-label'\"\n #places=\"ngx-places\"\n formControlName=\"location\"\n (onAddressChange)=\"handleAddressChange($event)\"\n [ngClass]=\"{ 'is-invalid': submitted && f['location'].errors }\" />\n </pw-input-container>\n <div class=\"ui-fluid skills-modal col-12 col-md-6 mt-1 mb-3\">\n <span id=\"newsletter-item-tags-label\" class=\"pw-label-style\">{{ 'Admin.NewsletterItem.Tags' | transloco }}\n <span class=\"ms-1 tooltip-wrap\"\n [pTooltip]=\"'Admin.NewsletterItem.Tooltip.Tags' | transloco\"\n [appendTo]=\"'body'\"\n [tooltipPosition]=\"'top'\">\n <i class=\"fas fa-info-circle\"></i>\n </span>\n </span>\n <p-autoComplete [(ngModel)]=\"selectedTags\"\n [attr.aria-labelledby]=\"'newsletter-item-tags-label'\"\n [suggestions]=\"tagsSuggestion\"\n dataKey=\"id\"\n field=\"name\"\n (completeMethod)=\"search($event)\"\n styleClass=\"w-100\"\n [minLength]=\"1\"\n [maxlength]=\"10\"\n [dropdown]=\"true\"\n [ngModelOptions]=\"{ standalone: true }\"\n placeholder=\"Tags\"\n [multiple]=\"true\"></p-autoComplete>\n </div>\n <!-- Products -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.NewsletterItem.Tooltip.Products' | transloco\"\n [label]=\"'Admin.NewsletterItem.Products' | transloco\"\n name=\"product_ids\" controlId=\"newsletter-item-product_ids\" [useAriaLabelledbyOnly]=\"true\">\n <p-multiSelect inputId=\"newsletter-item-product_ids\"\n [options]=\"products\"\n [attr.aria-labelledby]=\"'newsletter-item-product_ids-label'\"\n placeholder=\"Select Products\"\n [showHeader]=\"true\"\n [showToggleAll]=\"true\"\n formControlName=\"product_ids\"\n appendTo=\"body\"></p-multiSelect>\n </pw-input-container>\n </div>\n <!-- Features -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.NewsletterItem.Tooltip.Features' | transloco\"\n [label]=\"'Admin.NewsletterItem.Features' | transloco\"\n name=\"feature_keys\" controlId=\"newsletter-item-feature_keys\" [useAriaLabelledbyOnly]=\"true\">\n <p-multiSelect inputId=\"newsletter-item-feature_keys\"\n [options]=\"featureKeys\"\n [attr.aria-labelledby]=\"'newsletter-item-feature_keys-label'\"\n placeholder=\"Select feature keys\"\n [showHeader]=\"true\"\n [showToggleAll]=\"true\"\n formControlName=\"feature_keys\"\n appendTo=\"body\"></p-multiSelect>\n </pw-input-container>\n </div>\n <!-- Previous Newsletter Items -->\n <div class=\"col-12\"\n [ngClass]=\"f['main_tag_id'].value ? 'col-md-3' : 'col-md-6'\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.NewsletterItem.PreviousNewsletter' | transloco\"\n [showTooltip]=\"true\"\n [tooltipText]=\"\n 'Admin.NewsletterItem.Tooltip.PreviousNewsletter'\n | transloco\n \"\n name=\"main_tag_id\" controlId=\"newsletter-item-main_tag_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-select inputId=\"newsletter-item-main_tag_id\"\n [options]=\"newsletterItems\"\n [attr.aria-labelledby]=\"'newsletter-item-main_tag_id-label'\"\n formControlName=\"main_tag_id\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['main_tag_id'].errors\n }\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <!-- DAYS TO WAIT -->\n <div class=\"col-md-3 col-xs-6\"\n *ngIf=\"form.get('main_tag_id').value\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.NewsletterItem.DaysToWait' | transloco\"\n [showTooltip]=\"true\"\n [tooltipText]=\"\n 'Admin.NewsletterItem.Tooltip.DaysToWaitFromPreviousNewsletter'\n | transloco\n \"\n name=\"days_to_wait_from_previous_newsletter\" controlId=\"newsletter-item-days_to_wait\">\n <input type=\"number\"\n id=\"newsletter-item-days_to_wait\"\n class=\"form-control\"\n formControlName=\"days_to_wait_from_previous_newsletter\"\n [ngClass]=\"{\n 'is-invalid':\n submitted &&\n f['days_to_wait_from_previous_newsletter'].errors\n }\" />\n </pw-input-container>\n </div>\n </div>\n <!-- IS SENT -->\n <div class=\"col-md-3 col-xs-6\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.NewsletterItem.SendDate' | transloco\"\n [showTooltip]=\"true\"\n [tooltipText]=\"\n 'Admin.NewsletterItem.Tooltip.SendDate' | transloco\n \"\n [errorMsg]=\"\n 'Admin.NewsletterItem.Validation.SendDate' | transloco\n \"\n name=\"send_at\" controlId=\"newsletter-item-send_at\" [useAriaLabelledbyOnly]=\"true\">\n <div>\n <p-calendar inputId=\"newsletter-item-send_at\" [attr.aria-labelledby]=\"'newsletter-item-send_at-label'\" formControlName=\"send_at\"\n [showIcon]=\"true\"\n dateFormat=\"dd-M-yy\"\n [placeholder]=\"'Send Date'\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['send_at'].errors\n }\">\n </p-calendar>\n </div>\n </pw-input-container>\n </div>\n </div>\n <!-- Expiry Date for Newsletter -->\n <div class=\"col-md-3 col-xs-6\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"\n 'Admin.NewsletterItem.Tooltip.SendUntil' | transloco\n \"\n [label]=\"'Admin.NewsletterItem.SendUntil' | transloco\"\n name=\"send_until\" controlId=\"newsletter-item-send_until\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"\n 'Admin.NewsletterItem.Validation.SendUntil' | transloco\n \">\n <div>\n <p-calendar inputId=\"newsletter-item-send_until\" [attr.aria-labelledby]=\"'newsletter-item-send_until-label'\" formControlName=\"send_until\"\n [showIcon]=\"true\"\n dateFormat=\"dd-M-yy\"\n [placeholder]=\"'Send Until Date'\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['send_until'].errors\n }\">\n </p-calendar>\n </div>\n </pw-input-container>\n </div>\n </div>\n <!-- Only new users -->\n <div class=\"col-md-3\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"\n 'Admin.NewsletterItem.Tooltip.OnlyNewUsers' | transloco\n \"\n [label]=\"'Admin.NewsletterItem.OnlyNewUsers' | transloco\"\n name=\"only_new_users\" controlId=\"newsletter-item-only_new_users\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch formControlName=\"only_new_users\"\n [attr.aria-labelledby]=\"'newsletter-item-only_new_users-label'\"\n name=\"only_new_users\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['only_new_users'].errors\n }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <!-- IS PUSHED -->\n <div class=\"col-md-3\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"\n 'Admin.NewsletterItem.Tooltip.ShouldDeliver' | transloco\n \"\n [label]=\"'Admin.NewsletterItem.ShouldDeliver' | transloco\"\n name=\"is_pushed\" controlId=\"newsletter-item-is_pushed\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch formControlName=\"is_pushed\"\n [attr.aria-labelledby]=\"'newsletter-item-is_pushed-label'\"\n name=\"is_pushed\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['is_pushed'].errors\n }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n </div>\n <div class=\"row\"></div>\n <div class=\"row text-end mt-3\">\n <div class=\"col-12\">\n <button type=\"button\"\n class=\"btn btn-outline-default me-2\"\n (click)=\"back()\">\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n class=\"btn btn-primary\">\n {{ 'Button.Save' | transloco }}\n </button>\n </div>\n </div>\n </form>\n </div>\n </div>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i4$2.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: i5$1.AutoComplete, selector: "p-autoComplete, p-autocomplete, p-auto-complete", inputs: ["minLength", "delay", "style", "panelStyle", "styleClass", "panelStyleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "readonly", "disabled", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "maxlength", "name", "required", "size", "appendTo", "autoHighlight", "forceSelection", "type", "autoZIndex", "baseZIndex", "ariaLabel", "dropdownAriaLabel", "ariaLabelledBy", "dropdownIcon", "unique", "group", "completeOnFocus", "showClear", "field", "dropdown", "showEmptyMessage", "dropdownMode", "multiple", "tabindex", "dataKey", "emptyMessage", "showTransitionOptions", "hideTransitionOptions", "autofocus", "autocomplete", "optionGroupChildren", "optionGroupLabel", "overlayOptions", "suggestions", "itemSize", "optionLabel", "optionValue", "id", "searchMessage", "emptySelectionMessage", "selectionMessage", "autoOptionFocus", "selectOnFocus", "searchLocale", "optionDisabled", "focusOnHover", "typeahead", "variant", "fluid"], outputs: ["completeMethod", "onSelect", "onUnselect", "onFocus", "onBlur", "onDropdownClick", "onClear", "onKeyUp", "onShow", "onHide", "onLazyLoad"] }, { kind: "component", type: i3.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "size", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "fluid", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i6.MultiSelect, selector: "p-multiSelect, p-multiselect, p-multi-select", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "fluid", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "chipIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "size", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus", "highlightOnSelect"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "component", type: i8.Calendar, selector: "p-calendar", inputs: ["iconDisplay", "style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "fluid", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "variant", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$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: i3$2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.UiSwitchComponent, selector: "ui-switch", inputs: ["size", "color", "switchOffColor", "switchColor", "defaultBgColor", "defaultBoColor", "checkedLabel", "uncheckedLabel", "checkedTextColor", "uncheckedTextColor", "beforeChange", "ariaLabel", "checked", "disabled", "reverse", "loading"], outputs: ["change", "changeEvent", "valueChange"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "controlId", "useAriaLabelledbyOnly", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i14.NgxGpAutocompleteDirective, selector: "[ngx-gp-autocomplete]", inputs: ["options"], outputs: ["onAddressChange"], exportAs: ["ngx-places"] }, { kind: "directive", type: i10.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i11.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i9.QuillEditorComponent, selector: "quill-editor" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
|
|
3891
3891
|
}
|
|
3892
3892
|
__decorate([
|
|
3893
3893
|
ValidateForm('form'),
|
|
@@ -3897,7 +3897,7 @@ __decorate([
|
|
|
3897
3897
|
], NewsletterItemDetailsComponent.prototype, "onSave", null);
|
|
3898
3898
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: NewsletterItemDetailsComponent, decorators: [{
|
|
3899
3899
|
type: Component,
|
|
3900
|
-
args: [{ selector: 'pw-newsletter-item-details', standalone: false, template: "<div class=\"container-fluid pw-tab overflow-hidden\">\n <div class=\"dashboard\">\n <div class=\"dashboard-body\">\n <div class=\"me-auto col-xs-6 mt-4\">\n <a aria-label=\"Navigate to Target\"\n [routerLink]=\"[routers.newsletter]\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h3 class=\"\">Newsletter Item: {{ isLoading ? '' : (data?.title ? data?.title : 'Add New') }}</h3>\n </div>\n <div class=\"mt-1\">\n <p class=\"my-4\">\n To personalize the subject or body, use {{ userNameSyntax }} to insert the user\u2019s name.\n </p>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"isLoading\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <form [formGroup]=\"form\"\n *ngIf=\"!isLoading\"\n (ngSubmit)=\"onSave()\">\n <div class=\"row\">\n <!-- Title -->\n <pw-input-container [label]=\"'Admin.NewsletterItem.Title' | transloco\"\n class=\"col-md-6\"\n name=\"title\" controlId=\"newsletter-item-title\"\n [errorMsg]=\"'Admin.NewsletterItem.Validation.Title' | transloco\">\n <input type=\"text\"\n id=\"newsletter-item-title\"\n class=\"form-control\"\n formControlName=\"title\"\n [ngClass]=\"{ 'is-invalid': submitted && f['title'].errors }\" />\n </pw-input-container>\n <!-- Newsletter -->\n <pw-input-container [label]=\"'Admin.NewsletterItem.Newsletter' | transloco\"\n class=\"col-md-6\"\n name=\"newsletter_id\" controlId=\"newsletter-item-newsletter_id\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.NewsletterItem.Validation.Newsletter' | transloco\">\n <p-select [options]=\"newsletters\"\n [attr.aria-labelledby]=\"'newsletter-item-newsletter_id-label'\"\n formControlName=\"newsletter_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['newsletter_id'].errors }\">\n </p-select>\n </pw-input-container>\n <!-- Rich Text Editor -->\n <pw-input-container [label]=\"'Admin.NewsletterItem.Body' | transloco\"\n class=\"col-12\"\n name=\"body\" controlId=\"newsletter-item-body\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.NewsletterItem.Validation.Body' | transloco\">\n <quill-editor [attr.aria-labelledby]=\"'newsletter-item-body-label'\" [styles]=\"{ height: '450px' }\"\n class=\"quillEditor quill-editor\" [modules]=\"editorConfig\"\n formControlName=\"body\"\n [ngClass]=\"{ 'is-invalid': submitted && f['body'].errors, 'quill-container': true }\">\n </quill-editor>\n </pw-input-container>\n <!-- Location -->\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.NewsletterItem.Tooltip.Location' | transloco\"\n [label]=\"'Admin.NewsletterItem.Location' | transloco\"\n class=\"col-md-6\"\n name=\"location\" controlId=\"newsletter-item-location\" [useAriaLabelledbyOnly]=\"true\">\n <input ngx-gp-autocomplete\n id=\"newsletter-item-location\"\n name=\"location\"\n class=\"form-control\"\n [attr.aria-labelledby]=\"'newsletter-item-location-label'\"\n #places=\"ngx-places\"\n formControlName=\"location\"\n (onAddressChange)=\"handleAddressChange($event)\"\n [ngClass]=\"{ 'is-invalid': submitted && f['location'].errors }\" />\n </pw-input-container>\n <div class=\"ui-fluid skills-modal col-12 col-md-6 mt-1 mb-3\">\n <span id=\"newsletter-item-tags-label\" class=\"pw-label-style\">{{ 'Admin.NewsletterItem.Tags' | transloco }}\n <span class=\"ms-1 tooltip-wrap\"\n [pTooltip]=\"'Admin.NewsletterItem.Tooltip.Tags' | transloco\"\n [appendTo]=\"'body'\"\n [tooltipPosition]=\"'top'\">\n <i class=\"fas fa-info-circle\"></i>\n </span>\n </span>\n <p-autoComplete [(ngModel)]=\"selectedTags\"\n [attr.aria-labelledby]=\"'newsletter-item-tags-label'\"\n [suggestions]=\"tagsSuggestion\"\n dataKey=\"id\"\n field=\"name\"\n (completeMethod)=\"search($event)\"\n styleClass=\"w-100\"\n [minLength]=\"1\"\n [maxlength]=\"10\"\n [dropdown]=\"true\"\n [ngModelOptions]=\"{ standalone: true }\"\n placeholder=\"Tags\"\n [multiple]=\"true\"></p-autoComplete>\n </div>\n <!-- Products -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.NewsletterItem.Tooltip.Products' | transloco\"\n [label]=\"'Admin.NewsletterItem.Products' | transloco\"\n name=\"product_ids\" controlId=\"newsletter-item-product_ids\" [useAriaLabelledbyOnly]=\"true\">\n <p-multiSelect inputId=\"newsletter-item-product_ids\"\n [options]=\"products\"\n [attr.aria-labelledby]=\"'newsletter-item-product_ids-label'\"\n placeholder=\"Select Products\"\n [showHeader]=\"true\"\n [showToggleAll]=\"true\"\n formControlName=\"product_ids\"\n appendTo=\"body\"></p-multiSelect>\n </pw-input-container>\n </div>\n <!-- Features -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.NewsletterItem.Tooltip.Features' | transloco\"\n [label]=\"'Admin.NewsletterItem.Features' | transloco\"\n name=\"feature_keys\" controlId=\"newsletter-item-feature_keys\" [useAriaLabelledbyOnly]=\"true\">\n <p-multiSelect inputId=\"newsletter-item-feature_keys\"\n [options]=\"featureKeys\"\n [attr.aria-labelledby]=\"'newsletter-item-feature_keys-label'\"\n placeholder=\"Select feature keys\"\n [showHeader]=\"true\"\n [showToggleAll]=\"true\"\n formControlName=\"feature_keys\"\n appendTo=\"body\"></p-multiSelect>\n </pw-input-container>\n </div>\n <!-- Previous Newsletter Items -->\n <div class=\"col-12\"\n [ngClass]=\"f['main_tag_id'].value ? 'col-md-3' : 'col-md-6'\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.NewsletterItem.PreviousNewsletter' | transloco\"\n [showTooltip]=\"true\"\n [tooltipText]=\"\n 'Admin.NewsletterItem.Tooltip.PreviousNewsletter'\n | transloco\n \"\n name=\"main_tag_id\" controlId=\"newsletter-item-main_tag_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-select [options]=\"newsletterItems\"\n [attr.aria-labelledby]=\"'newsletter-item-main_tag_id-label'\"\n formControlName=\"main_tag_id\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['main_tag_id'].errors\n }\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <!-- DAYS TO WAIT -->\n <div class=\"col-md-3 col-xs-6\"\n *ngIf=\"form.get('main_tag_id').value\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.NewsletterItem.DaysToWait' | transloco\"\n [showTooltip]=\"true\"\n [tooltipText]=\"\n 'Admin.NewsletterItem.Tooltip.DaysToWaitFromPreviousNewsletter'\n | transloco\n \"\n name=\"days_to_wait_from_previous_newsletter\" controlId=\"newsletter-item-days_to_wait\">\n <input type=\"number\"\n id=\"newsletter-item-days_to_wait\"\n class=\"form-control\"\n formControlName=\"days_to_wait_from_previous_newsletter\"\n [ngClass]=\"{\n 'is-invalid':\n submitted &&\n f['days_to_wait_from_previous_newsletter'].errors\n }\" />\n </pw-input-container>\n </div>\n </div>\n <!-- IS SENT -->\n <div class=\"col-md-3 col-xs-6\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.NewsletterItem.SendDate' | transloco\"\n [showTooltip]=\"true\"\n [tooltipText]=\"\n 'Admin.NewsletterItem.Tooltip.SendDate' | transloco\n \"\n [errorMsg]=\"\n 'Admin.NewsletterItem.Validation.SendDate' | transloco\n \"\n name=\"send_at\" controlId=\"newsletter-item-send_at\" [useAriaLabelledbyOnly]=\"true\">\n <div>\n <p-calendar inputId=\"newsletter-item-send_at\" [attr.aria-labelledby]=\"'newsletter-item-send_at-label'\" formControlName=\"send_at\"\n [showIcon]=\"true\"\n dateFormat=\"dd-M-yy\"\n [placeholder]=\"'Send Date'\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['send_at'].errors\n }\">\n </p-calendar>\n </div>\n </pw-input-container>\n </div>\n </div>\n <!-- Expiry Date for Newsletter -->\n <div class=\"col-md-3 col-xs-6\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"\n 'Admin.NewsletterItem.Tooltip.SendUntil' | transloco\n \"\n [label]=\"'Admin.NewsletterItem.SendUntil' | transloco\"\n name=\"send_until\" controlId=\"newsletter-item-send_until\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"\n 'Admin.NewsletterItem.Validation.SendUntil' | transloco\n \">\n <div>\n <p-calendar inputId=\"newsletter-item-send_until\" [attr.aria-labelledby]=\"'newsletter-item-send_until-label'\" formControlName=\"send_until\"\n [showIcon]=\"true\"\n dateFormat=\"dd-M-yy\"\n [placeholder]=\"'Send Until Date'\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['send_until'].errors\n }\">\n </p-calendar>\n </div>\n </pw-input-container>\n </div>\n </div>\n <!-- Only new users -->\n <div class=\"col-md-3\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"\n 'Admin.NewsletterItem.Tooltip.OnlyNewUsers' | transloco\n \"\n [label]=\"'Admin.NewsletterItem.OnlyNewUsers' | transloco\"\n name=\"only_new_users\" controlId=\"newsletter-item-only_new_users\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch formControlName=\"only_new_users\"\n [attr.aria-labelledby]=\"'newsletter-item-only_new_users-label'\"\n name=\"only_new_users\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['only_new_users'].errors\n }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <!-- IS PUSHED -->\n <div class=\"col-md-3\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"\n 'Admin.NewsletterItem.Tooltip.ShouldDeliver' | transloco\n \"\n [label]=\"'Admin.NewsletterItem.ShouldDeliver' | transloco\"\n name=\"is_pushed\" controlId=\"newsletter-item-is_pushed\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch formControlName=\"is_pushed\"\n [attr.aria-labelledby]=\"'newsletter-item-is_pushed-label'\"\n name=\"is_pushed\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['is_pushed'].errors\n }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n </div>\n <div class=\"row\"></div>\n <div class=\"row text-end mt-3\">\n <div class=\"col-12\">\n <button type=\"button\"\n class=\"btn btn-outline-default me-2\"\n (click)=\"back()\">\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n class=\"btn btn-primary\">\n {{ 'Button.Save' | transloco }}\n </button>\n </div>\n </div>\n </form>\n </div>\n </div>\n </div>\n</div>\n" }]
|
|
3900
|
+
args: [{ selector: 'pw-newsletter-item-details', standalone: false, template: "<div class=\"container-fluid pw-tab overflow-hidden\">\n <div class=\"dashboard\">\n <div class=\"dashboard-body\">\n <div class=\"me-auto col-xs-6 mt-4\">\n <a aria-label=\"Navigate to Target\"\n [routerLink]=\"[routers.newsletter]\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h3 class=\"\">Newsletter Item: {{ isLoading ? '' : (data?.title ? data?.title : 'Add New') }}</h3>\n </div>\n <div class=\"mt-1\">\n <p class=\"my-4\">\n To personalize the subject or body, use {{ userNameSyntax }} to insert the user\u2019s name.\n </p>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"isLoading\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <form [formGroup]=\"form\"\n *ngIf=\"!isLoading\"\n (ngSubmit)=\"onSave()\">\n <div class=\"row\">\n <!-- Title -->\n <pw-input-container [label]=\"'Admin.NewsletterItem.Title' | transloco\"\n class=\"col-md-6\"\n name=\"title\" controlId=\"newsletter-item-title\"\n [errorMsg]=\"'Admin.NewsletterItem.Validation.Title' | transloco\">\n <input type=\"text\"\n id=\"newsletter-item-title\"\n class=\"form-control\"\n formControlName=\"title\"\n [ngClass]=\"{ 'is-invalid': submitted && f['title'].errors }\" />\n </pw-input-container>\n <!-- Newsletter -->\n <pw-input-container [label]=\"'Admin.NewsletterItem.Newsletter' | transloco\"\n class=\"col-md-6\"\n name=\"newsletter_id\" controlId=\"newsletter-item-newsletter_id\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.NewsletterItem.Validation.Newsletter' | transloco\">\n <p-select inputId=\"newsletter-item-newsletter_id\"\n [options]=\"newsletters\"\n [attr.aria-labelledby]=\"'newsletter-item-newsletter_id-label'\"\n formControlName=\"newsletter_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['newsletter_id'].errors }\">\n </p-select>\n </pw-input-container>\n <!-- Rich Text Editor -->\n <pw-input-container [label]=\"'Admin.NewsletterItem.Body' | transloco\"\n class=\"col-12\"\n name=\"body\" controlId=\"newsletter-item-body\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.NewsletterItem.Validation.Body' | transloco\">\n <quill-editor [attr.aria-labelledby]=\"'newsletter-item-body-label'\" [styles]=\"{ height: '450px' }\"\n class=\"quillEditor quill-editor\" [modules]=\"editorConfig\"\n formControlName=\"body\"\n [ngClass]=\"{ 'is-invalid': submitted && f['body'].errors, 'quill-container': true }\">\n </quill-editor>\n </pw-input-container>\n <!-- Location -->\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.NewsletterItem.Tooltip.Location' | transloco\"\n [label]=\"'Admin.NewsletterItem.Location' | transloco\"\n class=\"col-md-6\"\n name=\"location\" controlId=\"newsletter-item-location\" [useAriaLabelledbyOnly]=\"true\">\n <input ngx-gp-autocomplete\n id=\"newsletter-item-location\"\n name=\"location\"\n class=\"form-control\"\n [attr.aria-labelledby]=\"'newsletter-item-location-label'\"\n #places=\"ngx-places\"\n formControlName=\"location\"\n (onAddressChange)=\"handleAddressChange($event)\"\n [ngClass]=\"{ 'is-invalid': submitted && f['location'].errors }\" />\n </pw-input-container>\n <div class=\"ui-fluid skills-modal col-12 col-md-6 mt-1 mb-3\">\n <span id=\"newsletter-item-tags-label\" class=\"pw-label-style\">{{ 'Admin.NewsletterItem.Tags' | transloco }}\n <span class=\"ms-1 tooltip-wrap\"\n [pTooltip]=\"'Admin.NewsletterItem.Tooltip.Tags' | transloco\"\n [appendTo]=\"'body'\"\n [tooltipPosition]=\"'top'\">\n <i class=\"fas fa-info-circle\"></i>\n </span>\n </span>\n <p-autoComplete [(ngModel)]=\"selectedTags\"\n [attr.aria-labelledby]=\"'newsletter-item-tags-label'\"\n [suggestions]=\"tagsSuggestion\"\n dataKey=\"id\"\n field=\"name\"\n (completeMethod)=\"search($event)\"\n styleClass=\"w-100\"\n [minLength]=\"1\"\n [maxlength]=\"10\"\n [dropdown]=\"true\"\n [ngModelOptions]=\"{ standalone: true }\"\n placeholder=\"Tags\"\n [multiple]=\"true\"></p-autoComplete>\n </div>\n <!-- Products -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.NewsletterItem.Tooltip.Products' | transloco\"\n [label]=\"'Admin.NewsletterItem.Products' | transloco\"\n name=\"product_ids\" controlId=\"newsletter-item-product_ids\" [useAriaLabelledbyOnly]=\"true\">\n <p-multiSelect inputId=\"newsletter-item-product_ids\"\n [options]=\"products\"\n [attr.aria-labelledby]=\"'newsletter-item-product_ids-label'\"\n placeholder=\"Select Products\"\n [showHeader]=\"true\"\n [showToggleAll]=\"true\"\n formControlName=\"product_ids\"\n appendTo=\"body\"></p-multiSelect>\n </pw-input-container>\n </div>\n <!-- Features -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.NewsletterItem.Tooltip.Features' | transloco\"\n [label]=\"'Admin.NewsletterItem.Features' | transloco\"\n name=\"feature_keys\" controlId=\"newsletter-item-feature_keys\" [useAriaLabelledbyOnly]=\"true\">\n <p-multiSelect inputId=\"newsletter-item-feature_keys\"\n [options]=\"featureKeys\"\n [attr.aria-labelledby]=\"'newsletter-item-feature_keys-label'\"\n placeholder=\"Select feature keys\"\n [showHeader]=\"true\"\n [showToggleAll]=\"true\"\n formControlName=\"feature_keys\"\n appendTo=\"body\"></p-multiSelect>\n </pw-input-container>\n </div>\n <!-- Previous Newsletter Items -->\n <div class=\"col-12\"\n [ngClass]=\"f['main_tag_id'].value ? 'col-md-3' : 'col-md-6'\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.NewsletterItem.PreviousNewsletter' | transloco\"\n [showTooltip]=\"true\"\n [tooltipText]=\"\n 'Admin.NewsletterItem.Tooltip.PreviousNewsletter'\n | transloco\n \"\n name=\"main_tag_id\" controlId=\"newsletter-item-main_tag_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-select inputId=\"newsletter-item-main_tag_id\"\n [options]=\"newsletterItems\"\n [attr.aria-labelledby]=\"'newsletter-item-main_tag_id-label'\"\n formControlName=\"main_tag_id\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['main_tag_id'].errors\n }\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <!-- DAYS TO WAIT -->\n <div class=\"col-md-3 col-xs-6\"\n *ngIf=\"form.get('main_tag_id').value\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.NewsletterItem.DaysToWait' | transloco\"\n [showTooltip]=\"true\"\n [tooltipText]=\"\n 'Admin.NewsletterItem.Tooltip.DaysToWaitFromPreviousNewsletter'\n | transloco\n \"\n name=\"days_to_wait_from_previous_newsletter\" controlId=\"newsletter-item-days_to_wait\">\n <input type=\"number\"\n id=\"newsletter-item-days_to_wait\"\n class=\"form-control\"\n formControlName=\"days_to_wait_from_previous_newsletter\"\n [ngClass]=\"{\n 'is-invalid':\n submitted &&\n f['days_to_wait_from_previous_newsletter'].errors\n }\" />\n </pw-input-container>\n </div>\n </div>\n <!-- IS SENT -->\n <div class=\"col-md-3 col-xs-6\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.NewsletterItem.SendDate' | transloco\"\n [showTooltip]=\"true\"\n [tooltipText]=\"\n 'Admin.NewsletterItem.Tooltip.SendDate' | transloco\n \"\n [errorMsg]=\"\n 'Admin.NewsletterItem.Validation.SendDate' | transloco\n \"\n name=\"send_at\" controlId=\"newsletter-item-send_at\" [useAriaLabelledbyOnly]=\"true\">\n <div>\n <p-calendar inputId=\"newsletter-item-send_at\" [attr.aria-labelledby]=\"'newsletter-item-send_at-label'\" formControlName=\"send_at\"\n [showIcon]=\"true\"\n dateFormat=\"dd-M-yy\"\n [placeholder]=\"'Send Date'\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['send_at'].errors\n }\">\n </p-calendar>\n </div>\n </pw-input-container>\n </div>\n </div>\n <!-- Expiry Date for Newsletter -->\n <div class=\"col-md-3 col-xs-6\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"\n 'Admin.NewsletterItem.Tooltip.SendUntil' | transloco\n \"\n [label]=\"'Admin.NewsletterItem.SendUntil' | transloco\"\n name=\"send_until\" controlId=\"newsletter-item-send_until\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"\n 'Admin.NewsletterItem.Validation.SendUntil' | transloco\n \">\n <div>\n <p-calendar inputId=\"newsletter-item-send_until\" [attr.aria-labelledby]=\"'newsletter-item-send_until-label'\" formControlName=\"send_until\"\n [showIcon]=\"true\"\n dateFormat=\"dd-M-yy\"\n [placeholder]=\"'Send Until Date'\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['send_until'].errors\n }\">\n </p-calendar>\n </div>\n </pw-input-container>\n </div>\n </div>\n <!-- Only new users -->\n <div class=\"col-md-3\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"\n 'Admin.NewsletterItem.Tooltip.OnlyNewUsers' | transloco\n \"\n [label]=\"'Admin.NewsletterItem.OnlyNewUsers' | transloco\"\n name=\"only_new_users\" controlId=\"newsletter-item-only_new_users\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch formControlName=\"only_new_users\"\n [attr.aria-labelledby]=\"'newsletter-item-only_new_users-label'\"\n name=\"only_new_users\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['only_new_users'].errors\n }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <!-- IS PUSHED -->\n <div class=\"col-md-3\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"\n 'Admin.NewsletterItem.Tooltip.ShouldDeliver' | transloco\n \"\n [label]=\"'Admin.NewsletterItem.ShouldDeliver' | transloco\"\n name=\"is_pushed\" controlId=\"newsletter-item-is_pushed\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch formControlName=\"is_pushed\"\n [attr.aria-labelledby]=\"'newsletter-item-is_pushed-label'\"\n name=\"is_pushed\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['is_pushed'].errors\n }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n </div>\n <div class=\"row\"></div>\n <div class=\"row text-end mt-3\">\n <div class=\"col-12\">\n <button type=\"button\"\n class=\"btn btn-outline-default me-2\"\n (click)=\"back()\">\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n class=\"btn btn-primary\">\n {{ 'Button.Save' | transloco }}\n </button>\n </div>\n </div>\n </form>\n </div>\n </div>\n </div>\n</div>\n" }]
|
|
3901
3901
|
}], ctorParameters: () => [{ type: i1.AdminService }, { type: i1$2.TagService }, { type: i1$2.ProductService }, { type: i1$2.AuthService }, { type: i0.Injector }, { type: i3$4.DomSanitizer }], propDecorators: { placesRef: [{
|
|
3902
3902
|
type: ViewChild,
|
|
3903
3903
|
args: ['ngxPlaces']
|
|
@@ -5041,7 +5041,7 @@ class ProductDetailsComponent extends AppBaseComponent {
|
|
|
5041
5041
|
super.ngOnDestroy();
|
|
5042
5042
|
}
|
|
5043
5043
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: ProductDetailsComponent, deps: [{ token: i0.Injector }, { token: i1$2.ProductService }, { token: i2$1.NgbModal }, { token: i1.AdminService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5044
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: ProductDetailsComponent, isStandalone: false, selector: "pw-product-details", usesInheritance: true, ngImport: i0, template: "<div class=\"container-fluid pw-tab product-form overflow-hidden\">\n <div class=\"dashboard\">\n <div class=\"dashboard-body\">\n <div class=\"me-auto col-xs-6 mt-4\">\n <a aria-label=\"Navigate to Target\" (click)=\"back()\" class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\"\n aria-hidden=\"true\"></i></a>\n <h3 class=\"\">Product: {{ data?.name ? data?.name : 'Add New' }}</h3>\n </div>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"isLoading\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div class=\"my-4\" *ngIf=\"!isLoading\">\n <div class=\"mb-5\">\n <p-accordion>\n <p-accordion-panel value=\"0\">\n <p-accordion-header>How To</p-accordion-header>\n <p-accordion-content>\n <div class=\"row\">\n <div class=\"col-12 col-md-6\">\n <h4>Product / Feature logic</h4>\n <p> Logic for back-end/front-end permissions binding:\n <br /> * product.category (these are features) => type of product, i.e., seat_pricing or item_pricing\n <br /> * product.feature_key => this describes the main feature\n <br /> * product.permission_key => users can be subscribed to only one product of same permission_key\n <br /> * product.product_key => this is unique to each product, it defines the permission for frontend binding\n <br /> * Example of permission => {{ 'Pages.Product.{permission_key}.{product_key}' }}\n <br /> * If it's a feature associated to an existing project, you can to set the \"dependency product\" accordingly. </p>\n </div>\n <div class=\"col-12 col-md-6\">\n <h4>If it's a Free Product</h4>\n <p> Stripe Plan needs to be nil. <br /> \"Price\" per Unit needs to be set as 0. <br /> \"Trial Days\" needs\n to be something like 99999. <br /> The product should be set as \"visible===false\". </p>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n </p-accordion>\n </div>\n <div class=\"row\" *ngIf=\"id\">\n <div class=\"col-md-6\">\n <div class=\"text-center mt-5\">\n <div class=\"image-container\">\n <h4 class=\"mb-2\"> {{ 'User.Subscriptions.FullLogo' | transloco }} <span class=\"tooltip-wrap ms-1\"\n [pTooltip]=\"'User.Subscriptions.Tooltip.FullLogo'|transloco\" [appendTo]=\"'body'\"\n [tooltipPosition]=\"'top'\">\n <i class=\"fas fa-info-circle\"></i>\n </span>\n </h4>\n <img [src]=\"fullLogo\" alt=\"Demo Logo\" class=\"image full-logo w-100 h-100\"\n (error)=\"handleImageError($event, 'assets/img/icons/demo_logo1.png')\" />\n <div class=\"overlay mt-2\" (click)=\"openModal(content)\" (keydown.enter)=\"openModal(content)\">\n <div class=\"overlay-text\">\n <a aria-label=\"Navigate to Target\">{{ 'User.Profile.Change' | transloco }}</a>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"col-md-6\">\n <div class=\"text-center mt-5\">\n <div class=\"image-container\">\n <h4 class=\"mb-2\"> {{ 'User.Subscriptions.SquaredLogo' | transloco }} <span class=\"tooltip-wrap ms-1\"\n [pTooltip]=\"'User.Subscriptions.Tooltip.SquaredLogo'|transloco\" [appendTo]=\"'body'\"\n [tooltipPosition]=\"'top'\">\n <i class=\"fas fa-info-circle\"></i>\n </span>\n </h4>\n <img [src]=\"squaredLogo\" alt=\"Company Logo\" width=\"70\" class=\"squared_logo\" height=\"70\"\n (error)=\"handleImageError($event, 'assets/img/icons/company.png')\" />\n <div class=\"overlay mt-2\" (keydown.enter)=\"openModal(squaredLogoContent)\" (click)=\"openModal(squaredLogoContent)\">\n <div class=\"overlay-text\">\n <a aria-label=\"Navigate to Target\">{{ 'User.Profile.Change' | transloco }}</a>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <form [formGroup]=\"form\" (ngSubmit)=\"onSave()\">\n <div class=\"row\">\n <div class=\"col-12 col-md-6\">\n <div class=\"row\">\n <div class=\"col-md-6\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Name' | transloco\"\n [label]=\"'Label.Name' | transloco\" class=\"col-md-6 p-0\" name=\"name\" controlId=\"product-name\"\n [isLeftTooltip]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.Name' | transloco\">\n <input type=\"text\" id=\"product-name\" class=\"form-control\" formControlName=\"name\"\n [ngClass]=\"{ 'is-invalid': submitted && f['name'].errors }\" />\n </pw-input-container>\n </div>\n <div class=\"col-md-6\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.NickName' | transloco\"\n [label]=\"'Admin.Products.NickName' | transloco\" class=\"col-md-6 p-0\" name=\"nickname\" controlId=\"product-nickname\" [errorMsg]=\"\n 'Admin.Products.Validation.NickName' | transloco\n \">\n <input type=\"text\" id=\"product-nickname\" class=\"form-control\" formControlName=\"nickname\" [ngClass]=\"{\n 'is-invalid': submitted && f['nickname'].errors\n }\" />\n </pw-input-container>\n </div>\n </div>\n </div>\n <div class=\"col-12 col-md-6\">\n <div class=\"row\">\n <div class=\"mb-3 col-12 col-md-6\">\n <pw-input-container [label]=\"'Admin.Products.MinUnit' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MinUnits' | transloco\" class=\"col-md-6 p-0\" name=\"min_units\" controlId=\"product-min_units\"\n [errorMsg]=\"'Admin.Products.Validation.MinUnit' | transloco\">\n <input type=\"number\" id=\"product-min_units\" min=\"1\" class=\"form-control\" formControlName=\"min_units\" [ngClass]=\"{\n 'is-invalid': submitted && f['min_units'].errors\n }\" />\n </pw-input-container>\n </div>\n <div class=\"mb-3 col-12 col-md-6\">\n <pw-input-container [label]=\"'Admin.Products.MaxUnit' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MaxUnits' | transloco\" class=\"col-md-6 p-0\" name=\"max_units\" controlId=\"product-max_units\"\n [errorMsg]=\"'Admin.Products.Validation.MaxUnit' | transloco\">\n <input type=\"number\" id=\"product-max_units\" min=\"1\" class=\"form-control\" formControlName=\"max_units\" [ngClass]=\"{\n 'is-invalid': submitted && f['max_units'].errors\n }\" />\n </pw-input-container>\n </div>\n </div>\n </div>\n <div class=\"col-12 col-md-6\">\n <span class=\"pw-label-style info-circle\" id=\"product-dependency_products-label\"> {{ 'Admin.Products.DependencyProducts' | transloco }}<span\n class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.Products.Tooltip.DependencyProducts' |\n transloco }}</span>\n </span>\n <p-multiSelect inputId=\"product-dependency_products\"\n [options]=\"productsList\" [(ngModel)]=\"selectedScopes\"\n [attr.aria-labelledby]=\"'product-dependency_products-label'\"\n [ngModelOptions]=\"{ standalone: true }\" (onChange)=\"onSearchCriteria($event)\" [showHeader]=\"false\"\n maxSelectedLabels=\"1\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <div class=\"col-12 col-md-6\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.StripePlan' | transloco\"\n [label]=\"'Admin.Products.StripePlan' | transloco\" class=\"col-md-6 p-0\" name=\"stripe_plan_id\" controlId=\"product-stripe_plan_id\">\n <input type=\"text\" id=\"product-stripe_plan_id\" class=\"form-control\" formControlName=\"stripe_plan_id\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-6\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Price' | transloco\"\n [isLeftTooltip]=\"true\"\n [label]=\"'Admin.Products.Price' | transloco\" class=\"col-md-6 p-0\" name=\"price_per_unit\" controlId=\"product-price_per_unit\"\n [errorMsg]=\"'Admin.Products.Validation.Name' | transloco\">\n <input type=\"text\" id=\"product-price_per_unit\" numbersOnly class=\"form-control\" formControlName=\"price_per_unit\" [ngClass]=\"{\n 'is-invalid': submitted && f['price_per_unit'].errors\n }\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-6\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.TrialDays' | transloco\"\n [label]=\"'Admin.Products.TrialDays' | transloco\" class=\"col-md-6 p-0\" name=\"trial_days\" controlId=\"product-trial_days\"\n [errorMsg]=\"'Admin.Products.Validation.TrialDays' | transloco\">\n <input type=\"number\" id=\"product-trial_days\" min=\"0\" class=\"form-control\" formControlName=\"trial_days\" [ngClass]=\"{\n 'is-invalid': submitted && f['trial_days'].errors\n }\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-6\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MaxTrialHits' | transloco\"\n [label]=\"'Admin.Products.MaxTrialHits' | transloco\" class=\"col-md-6 p-0\" name=\"max_hits_trial\" controlId=\"product-max_hits_trial\">\n <input type=\"number\" id=\"product-max_hits_trial\" min=\"0\" class=\"form-control\" formControlName=\"max_hits_trial\" [ngClass]=\"{\n 'is-invalid': submitted && f['max_hits_trial'].errors\n }\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-6\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.TrialHits' | transloco\"\n [label]=\"'Admin.Products.TrialHits' | transloco\" class=\"col-md-6 p-0\" name=\"max_hits\" controlId=\"product-max_hits\">\n <input type=\"number\" id=\"product-max_hits\" min=\"0\" class=\"form-control\" formControlName=\"max_hits\"\n [ngClass]=\"{ 'is-invalid': submitted && f['max_hits'].errors }\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-12\" id=\"descriptionEditor\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Description' | transloco\"\n [label]=\"'Admin.Products.Description' | transloco\" name=\"description\" controlId=\"product-description\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.Description' | transloco\">\n <quill-editor [attr.aria-labelledby]=\"'product-description-label'\" [styles]=\"{ height: '220px' }\" formControlName=\"description\" class=\"quillEditor\" [modules]=\"editorConfig\"\n [ngClass]=\"{ 'is-invalid': submitted && f['description'].errors, 'quill-container': true}\">\n </quill-editor>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-12\" id=\"signupInstructionsEditor\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.SignupInstructions' | transloco\"\n [label]=\"'Admin.Products.SignupInstructions' | transloco\" name=\"signup_instructions\" controlId=\"product-signup_instructions\" [useAriaLabelledbyOnly]=\"true\">\n <quill-editor [attr.aria-labelledby]=\"'product-signup_instructions-label'\" [styles]=\"{ height: '220px' }\" formControlName=\"signup_instructions\" class=\"quillEditor\" [modules]=\"editorConfig\" [ngClass]=\"{\n 'is-invalid': submitted && f['signup_instructions'].errors, 'quill-container': true\n }\">\n </quill-editor>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-12\" id=\"signupEmployeesEditor\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.SignupInstructionEmployees' | transloco\"\n [label]=\"'Admin.Products.SignupInstructionEmployees' | transloco\" name=\"signup_instruction_employees\" controlId=\"product-signup_instruction_employees\" [useAriaLabelledbyOnly]=\"true\">\n <quill-editor [attr.aria-labelledby]=\"'product-signup_instruction_employees-label'\" [styles]=\"{ height: '220px' }\" formControlName=\"signup_instruction_employees\" class=\"quillEditor\" [modules]=\"editorConfig\" [ngClass]=\"{\n 'is-invalid':\n submitted && f['signup_instruction_employees'].errors, 'quill-container': true\n }\">\n </quill-editor>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.PermissionKey' | transloco\"\n [label]=\"'Admin.Products.PermissionKey' | transloco\" name=\"permission_key\" controlId=\"product-permission_key\" [errorMsg]=\"\n 'Admin.Products.Validation.PermissionKey' | transloco\n \">\n <input type=\"text\" id=\"product-permission_key\" class=\"form-control\" [ngClass]=\"{\n 'is-invalid': submitted && f['permission_key'].errors\n }\" formControlName=\"permission_key\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.FeatureKey' | transloco\"\n [label]=\"'Admin.Products.FeatureKey' | transloco\" name=\"feature_key\" controlId=\"product-feature_key\"\n [errorMsg]=\"'Admin.Products.Validation.FeatureKey' | transloco\">\n <input type=\"text\" id=\"product-feature_key\" class=\"form-control\" [ngClass]=\"{\n 'is-invalid': submitted && f['feature_key'].errors\n }\" formControlName=\"feature_key\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Products.ProductKey' | transloco\" class=\"col-md-6 p-0\"\n [showTooltip]=\"true\" [tooltipText]=\"\n 'Admin.Products.Tooltip.PermissionKey' | transloco\n \" name=\"product_key\" controlId=\"product-product_key\"\n [errorMsg]=\"'Admin.Products.Validation.ProductKey' | transloco\">\n <input type=\"text\" id=\"product-product_key\" class=\"form-control\" formControlName=\"product_key\" [ngClass]=\"{\n 'is-invalid': submitted && f['product_key'].errors\n }\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Products.Category' | transloco\" class=\"col-md-6 p-0\"\n [showTooltip]=\"true\" [tooltipText]=\"\n 'Admin.Products.Tooltip.PermissionKey' | transloco\n \" name=\"category\" controlId=\"product-category\" [useAriaLabelledbyOnly]=\"true\" [errorMsg]=\"'Admin.Products.Validation.Category' | transloco\">\n <p-select [options]=\"categories\" class=\"dropdown-bg-transparent\" [attr.aria-labelledby]=\"'product-category-label'\" formControlName=\"category\"\n [ngClass]=\"{ 'is-invalid': submitted && f['category'].errors }\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.BillingFrequency' | transloco\"\n [label]=\"'Admin.Products.BillingFrequency' | transloco\" class=\"col-md-6 p-0\" name=\"billing_frequency\" controlId=\"product-billing_frequency\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.BillingFrequency' | transloco\">\n <p-select [options]=\"frequency\" class=\"dropdown-bg-transparent\" [attr.aria-labelledby]=\"'product-billing_frequency-label'\" formControlName=\"billing_frequency\"\n [required]=\"true\" [ngClass]=\"{\n 'is-invalid': submitted && f['billing_frequency'].errors\n }\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.DocumentationUrl' | transloco\"\n [label]=\"'Admin.Products.DocumentationUrl' | transloco\" class=\"col-md-6 p-0\" name=\"documentation_url\" controlId=\"product-documentation_url\">\n <input type=\"text\" id=\"product-documentation_url\" class=\"form-control\" formControlName=\"documentation_url\" [ngClass]=\"{\n 'is-invalid': submitted && f['documentation_url'].errors\n }\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.ProductPrivacyService' | transloco\"\n [label]=\"'Admin.Products.ProductPrivacyService' | transloco\" name=\"product_privacy_service_id\" controlId=\"product-product_privacy_service_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'product-product_privacy_service_id-label'\"\n [options]=\"allTos\"\n formControlName=\"product_privacy_service_id\"\n [placeholder]=\"'Select Privacy Service'\"\n optionValue=\"id\"\n optionLabel=\"title\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'SuperAdmin'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MasterProduct' | transloco\"\n [label]=\"'Admin.Products.MasterProduct' | transloco\" name=\"master_product_id\" controlId=\"product-master_product_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'product-master_product_id-label'\"\n [options]=\"productsList\"\n formControlName=\"master_product_id\"\n [placeholder]=\"'Select Master Product'\"\n optionValue=\"value\"\n optionLabel=\"label\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"mb-3 col-xs-12 col-sm-6 col-md-4\">\n <span class=\"pw-label-style info-circle\" id=\"product-roles-label\">{{ 'Admin.Products.AssignedRoles' | transloco }} <span\n class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.Subscriptions.Tooltip.AssignedRoles' |\n transloco }}</span>\n </span>\n <p-multiSelect inputId=\"product-roles\" [options]=\"allRoles\" formControlName=\"roles\" appendTo=\"body\"\n [attr.aria-labelledby]=\"'product-roles-label'\"></p-multiSelect>\n </div>\n <div class=\"col-12 col-md-4\" *ngIf=\"supportedCurrency$ | async as currency\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Currency' | transloco\"\n [label]=\"'Admin.Products.Currency' | transloco\" name=\"currency\" controlId=\"product-currency\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.Currency' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'product-currency-label'\"\n [options]=\"currency['regions']\"\n formControlName=\"currency\"\n [ngClass]=\"{ 'is-invalid': submitted && f['currency'].errors }\"\n [placeholder]=\"'Select Currency'\"\n [showClear]=\"false\">\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-4\" *ngIf=\"supportedRegions$ | async as region\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Region' | transloco\"\n [isLeftTooltip]=\"true\"\n [label]=\"'Admin.Products.Region' | transloco\" name=\"region\" controlId=\"product-region\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.Region' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'product-region-label'\"\n [options]=\"region['regions']\"\n formControlName=\"region\"\n [ngClass]=\"{ 'is-invalid': submitted && f['region'].errors }\"\n [placeholder]=\"'Select Region'\"\n [showClear]=\"false\">\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-4\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.GitLabServiceDeskEmail' | transloco\"\n [label]=\"'Admin.Products.GitLabServiceDeskEmail' | transloco\" name=\"gitlab_service_desk_email\" controlId=\"product-gitlab_service_desk_email\">\n <input type=\"text\" id=\"product-gitlab_service_desk_email\" class=\"form-control\" formControlName=\"gitlab_service_desk_email\" />\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'Pages.Alpha'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.PartnerProducts' | transloco\"\n [label]=\"'Admin.Products.PartnerProducts' | transloco\" name=\"partner_products\" controlId=\"product-partner_products\" [useAriaLabelledbyOnly]=\"true\">\n <p-multiSelect inputId=\"product-partner_products\"\n [options]=\"productsList\" (onChange)=\"onSearchPartnerProducts($event)\"\n [attr.aria-labelledby]=\"'product-partner_products-label'\"\n [ngModelOptions]=\"{ standalone: true }\" [showToggleAll]=\"true\" [(ngModel)]=\"selectedPartnerProducts\"\n [showHeader]=\"true\" maxSelectedLabels=\"1\" appendTo=\"body\">\n </p-multiSelect>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'Pages.Alpha'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.ProrationBehavior' | transloco\"\n [label]=\"'Admin.Products.ProrationBehavior' | transloco\" name=\"proration_behavior\" controlId=\"product-proration_behavior\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'product-proration_behavior-label'\"\n [options]=\"prorationBehaviors\"\n formControlName=\"proration_behavior\"\n [placeholder]=\"'Select Proration Behavior'\"\n optionValue=\"value\"\n optionLabel=\"label\"\n [showClear]=\"true\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'Pages.Alpha'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.UnsubscribeStripeBehavior' | transloco\"\n [label]=\"'Admin.Products.UnsubscribeStripeBehavior' | transloco\" name=\"unsubscribe_stripe_behavior\" controlId=\"product-unsubscribe_stripe_behavior\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'product-unsubscribe_stripe_behavior-label'\"\n [options]=\"unsubscribeBehaviors\"\n formControlName=\"unsubscribe_stripe_behavior\"\n [placeholder]=\"'Select Unsubscribe Stripe Behavior'\"\n optionValue=\"value\"\n optionLabel=\"label\"\n [showClear]=\"true\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <!--start toggles -->\n <div class=\"col-12 row mt-4\">\n <div class=\"col\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.IsActive' | transloco\"\n [label]=\"'Admin.Products.IsActive' | transloco\" name=\"active\" controlId=\"product-active\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"active\" name=\"active\"\n [attr.aria-labelledby]=\"'product-active-label'\"\n [ngClass]=\"{ 'is-invalid': submitted && f['active'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col\" *rbacAllow=\"'SuperAdmin'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MultipleAllowed' | transloco\"\n [label]=\"'Admin.Products.MultipleAllowed' | transloco\" class=\"nowrap\" name=\"multiple_allowed\" controlId=\"product-multiple_allowed\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"multiple_allowed\" name=\"multiple_allowed\"\n [attr.aria-labelledby]=\"'product-multiple_allowed-label'\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['multiple_allowed'].errors\n }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.IsVisible' | transloco\"\n [label]=\"'Admin.Products.IsVisible' | transloco\" name=\"visible\" controlId=\"product-visible\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"visible\" name=\"visible\"\n [attr.aria-labelledby]=\"'product-visible-label'\"\n [ngClass]=\"{ 'is-invalid': submitted && f['visible'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MembersVisible' | transloco\"\n [label]=\"'Admin.Products.MembersVisible' | transloco\" name=\"members_visible\" controlId=\"product-members_visible\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"members_visible\" name=\"members_visible\"\n [attr.aria-labelledby]=\"'product-members_visible-label'\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['members_visible'].errors\n }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.ChatVisible' | transloco\"\n [label]=\"'Admin.Products.ChatVisible' | transloco\" name=\"chat_visible\" controlId=\"product-chat_visible\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"chat_visible\" name=\"chat_visible\"\n [attr.aria-labelledby]=\"'product-chat_visible-label'\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['chat_visible'].errors\n }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col\" *rbacAllow=\"'SuperAdmin'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.IsMasterProduct' | transloco\"\n [label]=\"'Admin.Products.IsMasterProduct' | transloco\" name=\"is_master_product\" controlId=\"product-is_master_product\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"is_master_product\" name=\"is_master_product\"\n [attr.aria-labelledby]=\"'product-is_master_product-label'\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['is_master_product'].errors\n }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n </div>\n <!-- end toggles -->\n </div>\n <div class=\"row text-end mt-4\">\n <div class=\"col-12\">\n <button type=\"button\" class=\"btn btn-outline-default me-2\" (click)=\"back()\"> {{ 'Button.Cancel' |\n transloco }} </button>\n <button type=\"submit\" [buttonBusy]=\"submitted\" class=\"btn btn-primary\" *rbacAllow=\"'Pages.Admin.Product.Edit'\"> {{ 'Button.Submit'\n | transloco }} </button>\n </div>\n </div>\n </form>\n </div>\n </div>\n </div>\n</div>\n<ng-template #content let-modal>\n <div class=\"modal-header\">\n <h3 class=\"modal-title mb-0 p-0\">{{ 'User.Subscriptions.FullLogo' | transloco }}</h3>\n <button type=\"button\" class=\"btn-close float-end\" aria-label=\"Close\" (click)=\"modal.dismiss()\">\n </button>\n </div>\n <div class=\"modal-body\">\n <small> {{ 'User.Profile.PictureMessage' | transloco }}</small>\n <pw-image-cropper #profile (imageSelectionEvent)=\"onImageSelection($event)\" aspectRatio=\"fullLogo\"\n (closeEvent)=\"onClose()\">\n </pw-image-cropper>\n </div>\n</ng-template>\n<ng-template #squaredLogoContent let-modal>\n <div class=\"modal-header\">\n <h3 class=\"modal-title mb-0 p-0\">{{ 'User.Subscriptions.SquaredLogo' | transloco }}</h3>\n <button type=\"button\" class=\"btn-close float-end\" aria-label=\"Close\" (click)=\"modal.dismiss()\">\n </button>\n </div>\n <div class=\"modal-body\">\n <small> {{ 'User.Profile.PictureMessage' | transloco }}</small>\n <pw-image-cropper #profile (imageSelectionEvent)=\"uploadSquaredLogo($event)\" aspectRatio=\"auto\"\n (closeEvent)=\"onClose()\">\n </pw-image-cropper>\n </div>\n</ng-template>\n", styles: [".pw-label-style.info-circle{display:inline-block;line-height:1.5}.pw-label-style.info-circle:after{top:-7px}.nowrap{white-space:nowrap}textarea{height:180px}.full-logo{object-fit:cover;width:280px}\n"], dependencies: [{ kind: "directive", type: i4$2.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: i7.Accordion, selector: "p-accordion", inputs: ["value", "multiple", "style", "styleClass", "expandIcon", "collapseIcon", "selectOnFocus", "transitionOptions", "activeIndex", "headerAriaLevel"], outputs: ["valueChange", "activeIndexChange", "onClose", "onOpen"] }, { kind: "component", type: i7.AccordionPanel, selector: "p-accordion-panel, p-accordionpanel", inputs: ["value", "disabled"], outputs: ["valueChange"] }, { kind: "component", type: i7.AccordionHeader, selector: "p-accordion-header, p-accordionheader" }, { kind: "component", type: i7.AccordionContent, selector: "p-accordion-content, p-accordioncontent" }, { kind: "component", type: i3.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "size", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "fluid", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i6.MultiSelect, selector: "p-multiSelect, p-multiselect, p-multi-select", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "fluid", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "chipIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "size", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus", "highlightOnSelect"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$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: i3$2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3$2.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.UiSwitchComponent, selector: "ui-switch", inputs: ["size", "color", "switchOffColor", "switchColor", "defaultBgColor", "defaultBoColor", "checkedLabel", "uncheckedLabel", "checkedTextColor", "uncheckedTextColor", "beforeChange", "ariaLabel", "checked", "disabled", "reverse", "loading"], outputs: ["change", "changeEvent", "valueChange"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i13.ProfileImageCropperComponent, selector: "pw-image-cropper", inputs: ["aspectRatio", "dynamicData"], outputs: ["imageSelectionEvent", "closeEvent", "fileChangeEvent"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "controlId", "useAriaLabelledbyOnly", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i10.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i10.NumberDirective, selector: "input[numbersOnly]" }, { kind: "directive", type: i10.LazyImgDirective, selector: "img" }, { kind: "directive", type: i10.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i9.QuillEditorComponent, selector: "quill-editor" }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
|
|
5044
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: ProductDetailsComponent, isStandalone: false, selector: "pw-product-details", usesInheritance: true, ngImport: i0, template: "<div class=\"container-fluid pw-tab product-form overflow-hidden\">\n <div class=\"dashboard\">\n <div class=\"dashboard-body\">\n <div class=\"me-auto col-xs-6 mt-4\">\n <a aria-label=\"Navigate to Target\" (click)=\"back()\" class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\"\n aria-hidden=\"true\"></i></a>\n <h3 class=\"\">Product: {{ data?.name ? data?.name : 'Add New' }}</h3>\n </div>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"isLoading\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div class=\"my-4\" *ngIf=\"!isLoading\">\n <div class=\"mb-5\">\n <p-accordion>\n <p-accordion-panel value=\"0\">\n <p-accordion-header>How To</p-accordion-header>\n <p-accordion-content>\n <div class=\"row\">\n <div class=\"col-12 col-md-6\">\n <h4>Product / Feature logic</h4>\n <p> Logic for back-end/front-end permissions binding:\n <br /> * product.category (these are features) => type of product, i.e., seat_pricing or item_pricing\n <br /> * product.feature_key => this describes the main feature\n <br /> * product.permission_key => users can be subscribed to only one product of same permission_key\n <br /> * product.product_key => this is unique to each product, it defines the permission for frontend binding\n <br /> * Example of permission => {{ 'Pages.Product.{permission_key}.{product_key}' }}\n <br /> * If it's a feature associated to an existing project, you can to set the \"dependency product\" accordingly. </p>\n </div>\n <div class=\"col-12 col-md-6\">\n <h4>If it's a Free Product</h4>\n <p> Stripe Plan needs to be nil. <br /> \"Price\" per Unit needs to be set as 0. <br /> \"Trial Days\" needs\n to be something like 99999. <br /> The product should be set as \"visible===false\". </p>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n </p-accordion>\n </div>\n <div class=\"row\" *ngIf=\"id\">\n <div class=\"col-md-6\">\n <div class=\"text-center mt-5\">\n <div class=\"image-container\">\n <h4 class=\"mb-2\"> {{ 'User.Subscriptions.FullLogo' | transloco }} <span class=\"tooltip-wrap ms-1\"\n [pTooltip]=\"'User.Subscriptions.Tooltip.FullLogo'|transloco\" [appendTo]=\"'body'\"\n [tooltipPosition]=\"'top'\">\n <i class=\"fas fa-info-circle\"></i>\n </span>\n </h4>\n <img [src]=\"fullLogo\" alt=\"Demo Logo\" class=\"image full-logo w-100 h-100\"\n (error)=\"handleImageError($event, 'assets/img/icons/demo_logo1.png')\" />\n <div class=\"overlay mt-2\" (click)=\"openModal(content)\" (keydown.enter)=\"openModal(content)\">\n <div class=\"overlay-text\">\n <a aria-label=\"Navigate to Target\">{{ 'User.Profile.Change' | transloco }}</a>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"col-md-6\">\n <div class=\"text-center mt-5\">\n <div class=\"image-container\">\n <h4 class=\"mb-2\"> {{ 'User.Subscriptions.SquaredLogo' | transloco }} <span class=\"tooltip-wrap ms-1\"\n [pTooltip]=\"'User.Subscriptions.Tooltip.SquaredLogo'|transloco\" [appendTo]=\"'body'\"\n [tooltipPosition]=\"'top'\">\n <i class=\"fas fa-info-circle\"></i>\n </span>\n </h4>\n <img [src]=\"squaredLogo\" alt=\"Company Logo\" width=\"70\" class=\"squared_logo\" height=\"70\"\n (error)=\"handleImageError($event, 'assets/img/icons/company.png')\" />\n <div class=\"overlay mt-2\" (keydown.enter)=\"openModal(squaredLogoContent)\" (click)=\"openModal(squaredLogoContent)\">\n <div class=\"overlay-text\">\n <a aria-label=\"Navigate to Target\">{{ 'User.Profile.Change' | transloco }}</a>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <form [formGroup]=\"form\" (ngSubmit)=\"onSave()\">\n <div class=\"row\">\n <div class=\"col-12 col-md-6\">\n <div class=\"row\">\n <div class=\"col-md-6\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Name' | transloco\"\n [label]=\"'Label.Name' | transloco\" class=\"col-md-6 p-0\" name=\"name\" controlId=\"product-name\"\n [isLeftTooltip]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.Name' | transloco\">\n <input type=\"text\" id=\"product-name\" class=\"form-control\" formControlName=\"name\"\n [ngClass]=\"{ 'is-invalid': submitted && f['name'].errors }\" />\n </pw-input-container>\n </div>\n <div class=\"col-md-6\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.NickName' | transloco\"\n [label]=\"'Admin.Products.NickName' | transloco\" class=\"col-md-6 p-0\" name=\"nickname\" controlId=\"product-nickname\" [errorMsg]=\"\n 'Admin.Products.Validation.NickName' | transloco\n \">\n <input type=\"text\" id=\"product-nickname\" class=\"form-control\" formControlName=\"nickname\" [ngClass]=\"{\n 'is-invalid': submitted && f['nickname'].errors\n }\" />\n </pw-input-container>\n </div>\n </div>\n </div>\n <div class=\"col-12 col-md-6\">\n <div class=\"row\">\n <div class=\"mb-3 col-12 col-md-6\">\n <pw-input-container [label]=\"'Admin.Products.MinUnit' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MinUnits' | transloco\" class=\"col-md-6 p-0\" name=\"min_units\" controlId=\"product-min_units\"\n [errorMsg]=\"'Admin.Products.Validation.MinUnit' | transloco\">\n <input type=\"number\" id=\"product-min_units\" min=\"1\" class=\"form-control\" formControlName=\"min_units\" [ngClass]=\"{\n 'is-invalid': submitted && f['min_units'].errors\n }\" />\n </pw-input-container>\n </div>\n <div class=\"mb-3 col-12 col-md-6\">\n <pw-input-container [label]=\"'Admin.Products.MaxUnit' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MaxUnits' | transloco\" class=\"col-md-6 p-0\" name=\"max_units\" controlId=\"product-max_units\"\n [errorMsg]=\"'Admin.Products.Validation.MaxUnit' | transloco\">\n <input type=\"number\" id=\"product-max_units\" min=\"1\" class=\"form-control\" formControlName=\"max_units\" [ngClass]=\"{\n 'is-invalid': submitted && f['max_units'].errors\n }\" />\n </pw-input-container>\n </div>\n </div>\n </div>\n <div class=\"col-12 col-md-6\">\n <span class=\"pw-label-style info-circle\" id=\"product-dependency_products-label\"> {{ 'Admin.Products.DependencyProducts' | transloco }}<span\n class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.Products.Tooltip.DependencyProducts' |\n transloco }}</span>\n </span>\n <p-multiSelect inputId=\"product-dependency_products\"\n [options]=\"productsList\" [(ngModel)]=\"selectedScopes\"\n [attr.aria-labelledby]=\"'product-dependency_products-label'\"\n [ngModelOptions]=\"{ standalone: true }\" (onChange)=\"onSearchCriteria($event)\" [showHeader]=\"false\"\n maxSelectedLabels=\"1\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <div class=\"col-12 col-md-6\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.StripePlan' | transloco\"\n [label]=\"'Admin.Products.StripePlan' | transloco\" class=\"col-md-6 p-0\" name=\"stripe_plan_id\" controlId=\"product-stripe_plan_id\">\n <input type=\"text\" id=\"product-stripe_plan_id\" class=\"form-control\" formControlName=\"stripe_plan_id\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-6\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Price' | transloco\"\n [isLeftTooltip]=\"true\"\n [label]=\"'Admin.Products.Price' | transloco\" class=\"col-md-6 p-0\" name=\"price_per_unit\" controlId=\"product-price_per_unit\"\n [errorMsg]=\"'Admin.Products.Validation.Name' | transloco\">\n <input type=\"text\" id=\"product-price_per_unit\" numbersOnly class=\"form-control\" formControlName=\"price_per_unit\" [ngClass]=\"{\n 'is-invalid': submitted && f['price_per_unit'].errors\n }\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-6\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.TrialDays' | transloco\"\n [label]=\"'Admin.Products.TrialDays' | transloco\" class=\"col-md-6 p-0\" name=\"trial_days\" controlId=\"product-trial_days\"\n [errorMsg]=\"'Admin.Products.Validation.TrialDays' | transloco\">\n <input type=\"number\" id=\"product-trial_days\" min=\"0\" class=\"form-control\" formControlName=\"trial_days\" [ngClass]=\"{\n 'is-invalid': submitted && f['trial_days'].errors\n }\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-6\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MaxTrialHits' | transloco\"\n [label]=\"'Admin.Products.MaxTrialHits' | transloco\" class=\"col-md-6 p-0\" name=\"max_hits_trial\" controlId=\"product-max_hits_trial\">\n <input type=\"number\" id=\"product-max_hits_trial\" min=\"0\" class=\"form-control\" formControlName=\"max_hits_trial\" [ngClass]=\"{\n 'is-invalid': submitted && f['max_hits_trial'].errors\n }\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-6\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.TrialHits' | transloco\"\n [label]=\"'Admin.Products.TrialHits' | transloco\" class=\"col-md-6 p-0\" name=\"max_hits\" controlId=\"product-max_hits\">\n <input type=\"number\" id=\"product-max_hits\" min=\"0\" class=\"form-control\" formControlName=\"max_hits\"\n [ngClass]=\"{ 'is-invalid': submitted && f['max_hits'].errors }\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-12\" id=\"descriptionEditor\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Description' | transloco\"\n [label]=\"'Admin.Products.Description' | transloco\" name=\"description\" controlId=\"product-description\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.Description' | transloco\">\n <quill-editor [attr.aria-labelledby]=\"'product-description-label'\" [styles]=\"{ height: '220px' }\" formControlName=\"description\" class=\"quillEditor\" [modules]=\"editorConfig\"\n [ngClass]=\"{ 'is-invalid': submitted && f['description'].errors, 'quill-container': true}\">\n </quill-editor>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-12\" id=\"signupInstructionsEditor\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.SignupInstructions' | transloco\"\n [label]=\"'Admin.Products.SignupInstructions' | transloco\" name=\"signup_instructions\" controlId=\"product-signup_instructions\" [useAriaLabelledbyOnly]=\"true\">\n <quill-editor [attr.aria-labelledby]=\"'product-signup_instructions-label'\" [styles]=\"{ height: '220px' }\" formControlName=\"signup_instructions\" class=\"quillEditor\" [modules]=\"editorConfig\" [ngClass]=\"{\n 'is-invalid': submitted && f['signup_instructions'].errors, 'quill-container': true\n }\">\n </quill-editor>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-12\" id=\"signupEmployeesEditor\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.SignupInstructionEmployees' | transloco\"\n [label]=\"'Admin.Products.SignupInstructionEmployees' | transloco\" name=\"signup_instruction_employees\" controlId=\"product-signup_instruction_employees\" [useAriaLabelledbyOnly]=\"true\">\n <quill-editor [attr.aria-labelledby]=\"'product-signup_instruction_employees-label'\" [styles]=\"{ height: '220px' }\" formControlName=\"signup_instruction_employees\" class=\"quillEditor\" [modules]=\"editorConfig\" [ngClass]=\"{\n 'is-invalid':\n submitted && f['signup_instruction_employees'].errors, 'quill-container': true\n }\">\n </quill-editor>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.PermissionKey' | transloco\"\n [label]=\"'Admin.Products.PermissionKey' | transloco\" name=\"permission_key\" controlId=\"product-permission_key\" [errorMsg]=\"\n 'Admin.Products.Validation.PermissionKey' | transloco\n \">\n <input type=\"text\" id=\"product-permission_key\" class=\"form-control\" [ngClass]=\"{\n 'is-invalid': submitted && f['permission_key'].errors\n }\" formControlName=\"permission_key\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.FeatureKey' | transloco\"\n [label]=\"'Admin.Products.FeatureKey' | transloco\" name=\"feature_key\" controlId=\"product-feature_key\"\n [errorMsg]=\"'Admin.Products.Validation.FeatureKey' | transloco\">\n <input type=\"text\" id=\"product-feature_key\" class=\"form-control\" [ngClass]=\"{\n 'is-invalid': submitted && f['feature_key'].errors\n }\" formControlName=\"feature_key\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Products.ProductKey' | transloco\" class=\"col-md-6 p-0\"\n [showTooltip]=\"true\" [tooltipText]=\"\n 'Admin.Products.Tooltip.PermissionKey' | transloco\n \" name=\"product_key\" controlId=\"product-product_key\"\n [errorMsg]=\"'Admin.Products.Validation.ProductKey' | transloco\">\n <input type=\"text\" id=\"product-product_key\" class=\"form-control\" formControlName=\"product_key\" [ngClass]=\"{\n 'is-invalid': submitted && f['product_key'].errors\n }\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Products.Category' | transloco\" class=\"col-md-6 p-0\"\n [showTooltip]=\"true\" [tooltipText]=\"\n 'Admin.Products.Tooltip.PermissionKey' | transloco\n \" name=\"category\" controlId=\"product-category\" [useAriaLabelledbyOnly]=\"true\" [errorMsg]=\"'Admin.Products.Validation.Category' | transloco\">\n <p-select inputId=\"product-category\"\n [options]=\"categories\" class=\"dropdown-bg-transparent\" [attr.aria-labelledby]=\"'product-category-label'\" formControlName=\"category\"\n [ngClass]=\"{ 'is-invalid': submitted && f['category'].errors }\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.BillingFrequency' | transloco\"\n [label]=\"'Admin.Products.BillingFrequency' | transloco\" class=\"col-md-6 p-0\" name=\"billing_frequency\" controlId=\"product-billing_frequency\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.BillingFrequency' | transloco\">\n <p-select inputId=\"product-billing_frequency\"\n [options]=\"frequency\" class=\"dropdown-bg-transparent\" [attr.aria-labelledby]=\"'product-billing_frequency-label'\" formControlName=\"billing_frequency\"\n [required]=\"true\" [ngClass]=\"{\n 'is-invalid': submitted && f['billing_frequency'].errors\n }\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.DocumentationUrl' | transloco\"\n [label]=\"'Admin.Products.DocumentationUrl' | transloco\" class=\"col-md-6 p-0\" name=\"documentation_url\" controlId=\"product-documentation_url\">\n <input type=\"text\" id=\"product-documentation_url\" class=\"form-control\" formControlName=\"documentation_url\" [ngClass]=\"{\n 'is-invalid': submitted && f['documentation_url'].errors\n }\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.ProductPrivacyService' | transloco\"\n [label]=\"'Admin.Products.ProductPrivacyService' | transloco\" name=\"product_privacy_service_id\" controlId=\"product-product_privacy_service_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'product-product_privacy_service_id-label'\"\n [options]=\"allTos\"\n formControlName=\"product_privacy_service_id\"\n [placeholder]=\"'Select Privacy Service'\"\n optionValue=\"id\"\n optionLabel=\"title\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'SuperAdmin'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MasterProduct' | transloco\"\n [label]=\"'Admin.Products.MasterProduct' | transloco\" name=\"master_product_id\" controlId=\"product-master_product_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'product-master_product_id-label'\"\n [options]=\"productsList\"\n formControlName=\"master_product_id\"\n [placeholder]=\"'Select Master Product'\"\n optionValue=\"value\"\n optionLabel=\"label\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"mb-3 col-xs-12 col-sm-6 col-md-4\">\n <span class=\"pw-label-style info-circle\" id=\"product-roles-label\">{{ 'Admin.Products.AssignedRoles' | transloco }} <span\n class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.Subscriptions.Tooltip.AssignedRoles' |\n transloco }}</span>\n </span>\n <p-multiSelect inputId=\"product-roles\" [options]=\"allRoles\" formControlName=\"roles\" appendTo=\"body\"\n [attr.aria-labelledby]=\"'product-roles-label'\"></p-multiSelect>\n </div>\n <div class=\"col-12 col-md-4\" *ngIf=\"supportedCurrency$ | async as currency\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Currency' | transloco\"\n [label]=\"'Admin.Products.Currency' | transloco\" name=\"currency\" controlId=\"product-currency\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.Currency' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'product-currency-label'\"\n [options]=\"currency['regions']\"\n formControlName=\"currency\"\n [ngClass]=\"{ 'is-invalid': submitted && f['currency'].errors }\"\n [placeholder]=\"'Select Currency'\"\n [showClear]=\"false\">\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-4\" *ngIf=\"supportedRegions$ | async as region\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Region' | transloco\"\n [isLeftTooltip]=\"true\"\n [label]=\"'Admin.Products.Region' | transloco\" name=\"region\" controlId=\"product-region\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.Region' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'product-region-label'\"\n [options]=\"region['regions']\"\n formControlName=\"region\"\n [ngClass]=\"{ 'is-invalid': submitted && f['region'].errors }\"\n [placeholder]=\"'Select Region'\"\n [showClear]=\"false\">\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-4\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.GitLabServiceDeskEmail' | transloco\"\n [label]=\"'Admin.Products.GitLabServiceDeskEmail' | transloco\" name=\"gitlab_service_desk_email\" controlId=\"product-gitlab_service_desk_email\">\n <input type=\"text\" id=\"product-gitlab_service_desk_email\" class=\"form-control\" formControlName=\"gitlab_service_desk_email\" />\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'Pages.Alpha'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.PartnerProducts' | transloco\"\n [label]=\"'Admin.Products.PartnerProducts' | transloco\" name=\"partner_products\" controlId=\"product-partner_products\" [useAriaLabelledbyOnly]=\"true\">\n <p-multiSelect inputId=\"product-partner_products\"\n [options]=\"productsList\" (onChange)=\"onSearchPartnerProducts($event)\"\n [attr.aria-labelledby]=\"'product-partner_products-label'\"\n [ngModelOptions]=\"{ standalone: true }\" [showToggleAll]=\"true\" [(ngModel)]=\"selectedPartnerProducts\"\n [showHeader]=\"true\" maxSelectedLabels=\"1\" appendTo=\"body\">\n </p-multiSelect>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'Pages.Alpha'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.ProrationBehavior' | transloco\"\n [label]=\"'Admin.Products.ProrationBehavior' | transloco\" name=\"proration_behavior\" controlId=\"product-proration_behavior\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'product-proration_behavior-label'\"\n [options]=\"prorationBehaviors\"\n formControlName=\"proration_behavior\"\n [placeholder]=\"'Select Proration Behavior'\"\n optionValue=\"value\"\n optionLabel=\"label\"\n [showClear]=\"true\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'Pages.Alpha'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.UnsubscribeStripeBehavior' | transloco\"\n [label]=\"'Admin.Products.UnsubscribeStripeBehavior' | transloco\" name=\"unsubscribe_stripe_behavior\" controlId=\"product-unsubscribe_stripe_behavior\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'product-unsubscribe_stripe_behavior-label'\"\n [options]=\"unsubscribeBehaviors\"\n formControlName=\"unsubscribe_stripe_behavior\"\n [placeholder]=\"'Select Unsubscribe Stripe Behavior'\"\n optionValue=\"value\"\n optionLabel=\"label\"\n [showClear]=\"true\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <!--start toggles -->\n <div class=\"col-12 row mt-4\">\n <div class=\"col\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.IsActive' | transloco\"\n [label]=\"'Admin.Products.IsActive' | transloco\" name=\"active\" controlId=\"product-active\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"active\" name=\"active\"\n [attr.aria-labelledby]=\"'product-active-label'\"\n [ngClass]=\"{ 'is-invalid': submitted && f['active'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col\" *rbacAllow=\"'SuperAdmin'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MultipleAllowed' | transloco\"\n [label]=\"'Admin.Products.MultipleAllowed' | transloco\" class=\"nowrap\" name=\"multiple_allowed\" controlId=\"product-multiple_allowed\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"multiple_allowed\" name=\"multiple_allowed\"\n [attr.aria-labelledby]=\"'product-multiple_allowed-label'\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['multiple_allowed'].errors\n }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.IsVisible' | transloco\"\n [label]=\"'Admin.Products.IsVisible' | transloco\" name=\"visible\" controlId=\"product-visible\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"visible\" name=\"visible\"\n [attr.aria-labelledby]=\"'product-visible-label'\"\n [ngClass]=\"{ 'is-invalid': submitted && f['visible'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MembersVisible' | transloco\"\n [label]=\"'Admin.Products.MembersVisible' | transloco\" name=\"members_visible\" controlId=\"product-members_visible\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"members_visible\" name=\"members_visible\"\n [attr.aria-labelledby]=\"'product-members_visible-label'\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['members_visible'].errors\n }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.ChatVisible' | transloco\"\n [label]=\"'Admin.Products.ChatVisible' | transloco\" name=\"chat_visible\" controlId=\"product-chat_visible\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"chat_visible\" name=\"chat_visible\"\n [attr.aria-labelledby]=\"'product-chat_visible-label'\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['chat_visible'].errors\n }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col\" *rbacAllow=\"'SuperAdmin'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.IsMasterProduct' | transloco\"\n [label]=\"'Admin.Products.IsMasterProduct' | transloco\" name=\"is_master_product\" controlId=\"product-is_master_product\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"is_master_product\" name=\"is_master_product\"\n [attr.aria-labelledby]=\"'product-is_master_product-label'\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['is_master_product'].errors\n }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n </div>\n <!-- end toggles -->\n </div>\n <div class=\"row text-end mt-4\">\n <div class=\"col-12\">\n <button type=\"button\" class=\"btn btn-outline-default me-2\" (click)=\"back()\"> {{ 'Button.Cancel' |\n transloco }} </button>\n <button type=\"submit\" [buttonBusy]=\"submitted\" class=\"btn btn-primary\" *rbacAllow=\"'Pages.Admin.Product.Edit'\"> {{ 'Button.Submit'\n | transloco }} </button>\n </div>\n </div>\n </form>\n </div>\n </div>\n </div>\n</div>\n<ng-template #content let-modal>\n <div class=\"modal-header\">\n <h3 class=\"modal-title mb-0 p-0\">{{ 'User.Subscriptions.FullLogo' | transloco }}</h3>\n <button type=\"button\" class=\"btn-close float-end\" aria-label=\"Close\" (click)=\"modal.dismiss()\">\n </button>\n </div>\n <div class=\"modal-body\">\n <small> {{ 'User.Profile.PictureMessage' | transloco }}</small>\n <pw-image-cropper #profile (imageSelectionEvent)=\"onImageSelection($event)\" aspectRatio=\"fullLogo\"\n (closeEvent)=\"onClose()\">\n </pw-image-cropper>\n </div>\n</ng-template>\n<ng-template #squaredLogoContent let-modal>\n <div class=\"modal-header\">\n <h3 class=\"modal-title mb-0 p-0\">{{ 'User.Subscriptions.SquaredLogo' | transloco }}</h3>\n <button type=\"button\" class=\"btn-close float-end\" aria-label=\"Close\" (click)=\"modal.dismiss()\">\n </button>\n </div>\n <div class=\"modal-body\">\n <small> {{ 'User.Profile.PictureMessage' | transloco }}</small>\n <pw-image-cropper #profile (imageSelectionEvent)=\"uploadSquaredLogo($event)\" aspectRatio=\"auto\"\n (closeEvent)=\"onClose()\">\n </pw-image-cropper>\n </div>\n</ng-template>\n", styles: [".pw-label-style.info-circle{display:inline-block;line-height:1.5}.pw-label-style.info-circle:after{top:-7px}.nowrap{white-space:nowrap}textarea{height:180px}.full-logo{object-fit:cover;width:280px}\n"], dependencies: [{ kind: "directive", type: i4$2.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: i7.Accordion, selector: "p-accordion", inputs: ["value", "multiple", "style", "styleClass", "expandIcon", "collapseIcon", "selectOnFocus", "transitionOptions", "activeIndex", "headerAriaLevel"], outputs: ["valueChange", "activeIndexChange", "onClose", "onOpen"] }, { kind: "component", type: i7.AccordionPanel, selector: "p-accordion-panel, p-accordionpanel", inputs: ["value", "disabled"], outputs: ["valueChange"] }, { kind: "component", type: i7.AccordionHeader, selector: "p-accordion-header, p-accordionheader" }, { kind: "component", type: i7.AccordionContent, selector: "p-accordion-content, p-accordioncontent" }, { kind: "component", type: i3.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "size", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "fluid", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i6.MultiSelect, selector: "p-multiSelect, p-multiselect, p-multi-select", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "fluid", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "chipIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "size", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus", "highlightOnSelect"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$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: i3$2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3$2.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.UiSwitchComponent, selector: "ui-switch", inputs: ["size", "color", "switchOffColor", "switchColor", "defaultBgColor", "defaultBoColor", "checkedLabel", "uncheckedLabel", "checkedTextColor", "uncheckedTextColor", "beforeChange", "ariaLabel", "checked", "disabled", "reverse", "loading"], outputs: ["change", "changeEvent", "valueChange"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i13.ProfileImageCropperComponent, selector: "pw-image-cropper", inputs: ["aspectRatio", "dynamicData"], outputs: ["imageSelectionEvent", "closeEvent", "fileChangeEvent"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "controlId", "useAriaLabelledbyOnly", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i10.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i10.NumberDirective, selector: "input[numbersOnly]" }, { kind: "directive", type: i10.LazyImgDirective, selector: "img" }, { kind: "directive", type: i10.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i9.QuillEditorComponent, selector: "quill-editor" }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
|
|
5045
5045
|
}
|
|
5046
5046
|
__decorate([
|
|
5047
5047
|
ValidateForm('form'),
|
|
@@ -5051,7 +5051,7 @@ __decorate([
|
|
|
5051
5051
|
], ProductDetailsComponent.prototype, "onSave", null);
|
|
5052
5052
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: ProductDetailsComponent, decorators: [{
|
|
5053
5053
|
type: Component,
|
|
5054
|
-
args: [{ selector: 'pw-product-details', standalone: false, template: "<div class=\"container-fluid pw-tab product-form overflow-hidden\">\n <div class=\"dashboard\">\n <div class=\"dashboard-body\">\n <div class=\"me-auto col-xs-6 mt-4\">\n <a aria-label=\"Navigate to Target\" (click)=\"back()\" class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\"\n aria-hidden=\"true\"></i></a>\n <h3 class=\"\">Product: {{ data?.name ? data?.name : 'Add New' }}</h3>\n </div>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"isLoading\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div class=\"my-4\" *ngIf=\"!isLoading\">\n <div class=\"mb-5\">\n <p-accordion>\n <p-accordion-panel value=\"0\">\n <p-accordion-header>How To</p-accordion-header>\n <p-accordion-content>\n <div class=\"row\">\n <div class=\"col-12 col-md-6\">\n <h4>Product / Feature logic</h4>\n <p> Logic for back-end/front-end permissions binding:\n <br /> * product.category (these are features) => type of product, i.e., seat_pricing or item_pricing\n <br /> * product.feature_key => this describes the main feature\n <br /> * product.permission_key => users can be subscribed to only one product of same permission_key\n <br /> * product.product_key => this is unique to each product, it defines the permission for frontend binding\n <br /> * Example of permission => {{ 'Pages.Product.{permission_key}.{product_key}' }}\n <br /> * If it's a feature associated to an existing project, you can to set the \"dependency product\" accordingly. </p>\n </div>\n <div class=\"col-12 col-md-6\">\n <h4>If it's a Free Product</h4>\n <p> Stripe Plan needs to be nil. <br /> \"Price\" per Unit needs to be set as 0. <br /> \"Trial Days\" needs\n to be something like 99999. <br /> The product should be set as \"visible===false\". </p>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n </p-accordion>\n </div>\n <div class=\"row\" *ngIf=\"id\">\n <div class=\"col-md-6\">\n <div class=\"text-center mt-5\">\n <div class=\"image-container\">\n <h4 class=\"mb-2\"> {{ 'User.Subscriptions.FullLogo' | transloco }} <span class=\"tooltip-wrap ms-1\"\n [pTooltip]=\"'User.Subscriptions.Tooltip.FullLogo'|transloco\" [appendTo]=\"'body'\"\n [tooltipPosition]=\"'top'\">\n <i class=\"fas fa-info-circle\"></i>\n </span>\n </h4>\n <img [src]=\"fullLogo\" alt=\"Demo Logo\" class=\"image full-logo w-100 h-100\"\n (error)=\"handleImageError($event, 'assets/img/icons/demo_logo1.png')\" />\n <div class=\"overlay mt-2\" (click)=\"openModal(content)\" (keydown.enter)=\"openModal(content)\">\n <div class=\"overlay-text\">\n <a aria-label=\"Navigate to Target\">{{ 'User.Profile.Change' | transloco }}</a>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"col-md-6\">\n <div class=\"text-center mt-5\">\n <div class=\"image-container\">\n <h4 class=\"mb-2\"> {{ 'User.Subscriptions.SquaredLogo' | transloco }} <span class=\"tooltip-wrap ms-1\"\n [pTooltip]=\"'User.Subscriptions.Tooltip.SquaredLogo'|transloco\" [appendTo]=\"'body'\"\n [tooltipPosition]=\"'top'\">\n <i class=\"fas fa-info-circle\"></i>\n </span>\n </h4>\n <img [src]=\"squaredLogo\" alt=\"Company Logo\" width=\"70\" class=\"squared_logo\" height=\"70\"\n (error)=\"handleImageError($event, 'assets/img/icons/company.png')\" />\n <div class=\"overlay mt-2\" (keydown.enter)=\"openModal(squaredLogoContent)\" (click)=\"openModal(squaredLogoContent)\">\n <div class=\"overlay-text\">\n <a aria-label=\"Navigate to Target\">{{ 'User.Profile.Change' | transloco }}</a>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <form [formGroup]=\"form\" (ngSubmit)=\"onSave()\">\n <div class=\"row\">\n <div class=\"col-12 col-md-6\">\n <div class=\"row\">\n <div class=\"col-md-6\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Name' | transloco\"\n [label]=\"'Label.Name' | transloco\" class=\"col-md-6 p-0\" name=\"name\" controlId=\"product-name\"\n [isLeftTooltip]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.Name' | transloco\">\n <input type=\"text\" id=\"product-name\" class=\"form-control\" formControlName=\"name\"\n [ngClass]=\"{ 'is-invalid': submitted && f['name'].errors }\" />\n </pw-input-container>\n </div>\n <div class=\"col-md-6\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.NickName' | transloco\"\n [label]=\"'Admin.Products.NickName' | transloco\" class=\"col-md-6 p-0\" name=\"nickname\" controlId=\"product-nickname\" [errorMsg]=\"\n 'Admin.Products.Validation.NickName' | transloco\n \">\n <input type=\"text\" id=\"product-nickname\" class=\"form-control\" formControlName=\"nickname\" [ngClass]=\"{\n 'is-invalid': submitted && f['nickname'].errors\n }\" />\n </pw-input-container>\n </div>\n </div>\n </div>\n <div class=\"col-12 col-md-6\">\n <div class=\"row\">\n <div class=\"mb-3 col-12 col-md-6\">\n <pw-input-container [label]=\"'Admin.Products.MinUnit' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MinUnits' | transloco\" class=\"col-md-6 p-0\" name=\"min_units\" controlId=\"product-min_units\"\n [errorMsg]=\"'Admin.Products.Validation.MinUnit' | transloco\">\n <input type=\"number\" id=\"product-min_units\" min=\"1\" class=\"form-control\" formControlName=\"min_units\" [ngClass]=\"{\n 'is-invalid': submitted && f['min_units'].errors\n }\" />\n </pw-input-container>\n </div>\n <div class=\"mb-3 col-12 col-md-6\">\n <pw-input-container [label]=\"'Admin.Products.MaxUnit' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MaxUnits' | transloco\" class=\"col-md-6 p-0\" name=\"max_units\" controlId=\"product-max_units\"\n [errorMsg]=\"'Admin.Products.Validation.MaxUnit' | transloco\">\n <input type=\"number\" id=\"product-max_units\" min=\"1\" class=\"form-control\" formControlName=\"max_units\" [ngClass]=\"{\n 'is-invalid': submitted && f['max_units'].errors\n }\" />\n </pw-input-container>\n </div>\n </div>\n </div>\n <div class=\"col-12 col-md-6\">\n <span class=\"pw-label-style info-circle\" id=\"product-dependency_products-label\"> {{ 'Admin.Products.DependencyProducts' | transloco }}<span\n class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.Products.Tooltip.DependencyProducts' |\n transloco }}</span>\n </span>\n <p-multiSelect inputId=\"product-dependency_products\"\n [options]=\"productsList\" [(ngModel)]=\"selectedScopes\"\n [attr.aria-labelledby]=\"'product-dependency_products-label'\"\n [ngModelOptions]=\"{ standalone: true }\" (onChange)=\"onSearchCriteria($event)\" [showHeader]=\"false\"\n maxSelectedLabels=\"1\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <div class=\"col-12 col-md-6\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.StripePlan' | transloco\"\n [label]=\"'Admin.Products.StripePlan' | transloco\" class=\"col-md-6 p-0\" name=\"stripe_plan_id\" controlId=\"product-stripe_plan_id\">\n <input type=\"text\" id=\"product-stripe_plan_id\" class=\"form-control\" formControlName=\"stripe_plan_id\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-6\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Price' | transloco\"\n [isLeftTooltip]=\"true\"\n [label]=\"'Admin.Products.Price' | transloco\" class=\"col-md-6 p-0\" name=\"price_per_unit\" controlId=\"product-price_per_unit\"\n [errorMsg]=\"'Admin.Products.Validation.Name' | transloco\">\n <input type=\"text\" id=\"product-price_per_unit\" numbersOnly class=\"form-control\" formControlName=\"price_per_unit\" [ngClass]=\"{\n 'is-invalid': submitted && f['price_per_unit'].errors\n }\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-6\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.TrialDays' | transloco\"\n [label]=\"'Admin.Products.TrialDays' | transloco\" class=\"col-md-6 p-0\" name=\"trial_days\" controlId=\"product-trial_days\"\n [errorMsg]=\"'Admin.Products.Validation.TrialDays' | transloco\">\n <input type=\"number\" id=\"product-trial_days\" min=\"0\" class=\"form-control\" formControlName=\"trial_days\" [ngClass]=\"{\n 'is-invalid': submitted && f['trial_days'].errors\n }\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-6\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MaxTrialHits' | transloco\"\n [label]=\"'Admin.Products.MaxTrialHits' | transloco\" class=\"col-md-6 p-0\" name=\"max_hits_trial\" controlId=\"product-max_hits_trial\">\n <input type=\"number\" id=\"product-max_hits_trial\" min=\"0\" class=\"form-control\" formControlName=\"max_hits_trial\" [ngClass]=\"{\n 'is-invalid': submitted && f['max_hits_trial'].errors\n }\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-6\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.TrialHits' | transloco\"\n [label]=\"'Admin.Products.TrialHits' | transloco\" class=\"col-md-6 p-0\" name=\"max_hits\" controlId=\"product-max_hits\">\n <input type=\"number\" id=\"product-max_hits\" min=\"0\" class=\"form-control\" formControlName=\"max_hits\"\n [ngClass]=\"{ 'is-invalid': submitted && f['max_hits'].errors }\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-12\" id=\"descriptionEditor\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Description' | transloco\"\n [label]=\"'Admin.Products.Description' | transloco\" name=\"description\" controlId=\"product-description\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.Description' | transloco\">\n <quill-editor [attr.aria-labelledby]=\"'product-description-label'\" [styles]=\"{ height: '220px' }\" formControlName=\"description\" class=\"quillEditor\" [modules]=\"editorConfig\"\n [ngClass]=\"{ 'is-invalid': submitted && f['description'].errors, 'quill-container': true}\">\n </quill-editor>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-12\" id=\"signupInstructionsEditor\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.SignupInstructions' | transloco\"\n [label]=\"'Admin.Products.SignupInstructions' | transloco\" name=\"signup_instructions\" controlId=\"product-signup_instructions\" [useAriaLabelledbyOnly]=\"true\">\n <quill-editor [attr.aria-labelledby]=\"'product-signup_instructions-label'\" [styles]=\"{ height: '220px' }\" formControlName=\"signup_instructions\" class=\"quillEditor\" [modules]=\"editorConfig\" [ngClass]=\"{\n 'is-invalid': submitted && f['signup_instructions'].errors, 'quill-container': true\n }\">\n </quill-editor>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-12\" id=\"signupEmployeesEditor\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.SignupInstructionEmployees' | transloco\"\n [label]=\"'Admin.Products.SignupInstructionEmployees' | transloco\" name=\"signup_instruction_employees\" controlId=\"product-signup_instruction_employees\" [useAriaLabelledbyOnly]=\"true\">\n <quill-editor [attr.aria-labelledby]=\"'product-signup_instruction_employees-label'\" [styles]=\"{ height: '220px' }\" formControlName=\"signup_instruction_employees\" class=\"quillEditor\" [modules]=\"editorConfig\" [ngClass]=\"{\n 'is-invalid':\n submitted && f['signup_instruction_employees'].errors, 'quill-container': true\n }\">\n </quill-editor>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.PermissionKey' | transloco\"\n [label]=\"'Admin.Products.PermissionKey' | transloco\" name=\"permission_key\" controlId=\"product-permission_key\" [errorMsg]=\"\n 'Admin.Products.Validation.PermissionKey' | transloco\n \">\n <input type=\"text\" id=\"product-permission_key\" class=\"form-control\" [ngClass]=\"{\n 'is-invalid': submitted && f['permission_key'].errors\n }\" formControlName=\"permission_key\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.FeatureKey' | transloco\"\n [label]=\"'Admin.Products.FeatureKey' | transloco\" name=\"feature_key\" controlId=\"product-feature_key\"\n [errorMsg]=\"'Admin.Products.Validation.FeatureKey' | transloco\">\n <input type=\"text\" id=\"product-feature_key\" class=\"form-control\" [ngClass]=\"{\n 'is-invalid': submitted && f['feature_key'].errors\n }\" formControlName=\"feature_key\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Products.ProductKey' | transloco\" class=\"col-md-6 p-0\"\n [showTooltip]=\"true\" [tooltipText]=\"\n 'Admin.Products.Tooltip.PermissionKey' | transloco\n \" name=\"product_key\" controlId=\"product-product_key\"\n [errorMsg]=\"'Admin.Products.Validation.ProductKey' | transloco\">\n <input type=\"text\" id=\"product-product_key\" class=\"form-control\" formControlName=\"product_key\" [ngClass]=\"{\n 'is-invalid': submitted && f['product_key'].errors\n }\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Products.Category' | transloco\" class=\"col-md-6 p-0\"\n [showTooltip]=\"true\" [tooltipText]=\"\n 'Admin.Products.Tooltip.PermissionKey' | transloco\n \" name=\"category\" controlId=\"product-category\" [useAriaLabelledbyOnly]=\"true\" [errorMsg]=\"'Admin.Products.Validation.Category' | transloco\">\n <p-select [options]=\"categories\" class=\"dropdown-bg-transparent\" [attr.aria-labelledby]=\"'product-category-label'\" formControlName=\"category\"\n [ngClass]=\"{ 'is-invalid': submitted && f['category'].errors }\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.BillingFrequency' | transloco\"\n [label]=\"'Admin.Products.BillingFrequency' | transloco\" class=\"col-md-6 p-0\" name=\"billing_frequency\" controlId=\"product-billing_frequency\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.BillingFrequency' | transloco\">\n <p-select [options]=\"frequency\" class=\"dropdown-bg-transparent\" [attr.aria-labelledby]=\"'product-billing_frequency-label'\" formControlName=\"billing_frequency\"\n [required]=\"true\" [ngClass]=\"{\n 'is-invalid': submitted && f['billing_frequency'].errors\n }\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.DocumentationUrl' | transloco\"\n [label]=\"'Admin.Products.DocumentationUrl' | transloco\" class=\"col-md-6 p-0\" name=\"documentation_url\" controlId=\"product-documentation_url\">\n <input type=\"text\" id=\"product-documentation_url\" class=\"form-control\" formControlName=\"documentation_url\" [ngClass]=\"{\n 'is-invalid': submitted && f['documentation_url'].errors\n }\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.ProductPrivacyService' | transloco\"\n [label]=\"'Admin.Products.ProductPrivacyService' | transloco\" name=\"product_privacy_service_id\" controlId=\"product-product_privacy_service_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'product-product_privacy_service_id-label'\"\n [options]=\"allTos\"\n formControlName=\"product_privacy_service_id\"\n [placeholder]=\"'Select Privacy Service'\"\n optionValue=\"id\"\n optionLabel=\"title\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'SuperAdmin'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MasterProduct' | transloco\"\n [label]=\"'Admin.Products.MasterProduct' | transloco\" name=\"master_product_id\" controlId=\"product-master_product_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'product-master_product_id-label'\"\n [options]=\"productsList\"\n formControlName=\"master_product_id\"\n [placeholder]=\"'Select Master Product'\"\n optionValue=\"value\"\n optionLabel=\"label\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"mb-3 col-xs-12 col-sm-6 col-md-4\">\n <span class=\"pw-label-style info-circle\" id=\"product-roles-label\">{{ 'Admin.Products.AssignedRoles' | transloco }} <span\n class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.Subscriptions.Tooltip.AssignedRoles' |\n transloco }}</span>\n </span>\n <p-multiSelect inputId=\"product-roles\" [options]=\"allRoles\" formControlName=\"roles\" appendTo=\"body\"\n [attr.aria-labelledby]=\"'product-roles-label'\"></p-multiSelect>\n </div>\n <div class=\"col-12 col-md-4\" *ngIf=\"supportedCurrency$ | async as currency\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Currency' | transloco\"\n [label]=\"'Admin.Products.Currency' | transloco\" name=\"currency\" controlId=\"product-currency\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.Currency' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'product-currency-label'\"\n [options]=\"currency['regions']\"\n formControlName=\"currency\"\n [ngClass]=\"{ 'is-invalid': submitted && f['currency'].errors }\"\n [placeholder]=\"'Select Currency'\"\n [showClear]=\"false\">\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-4\" *ngIf=\"supportedRegions$ | async as region\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Region' | transloco\"\n [isLeftTooltip]=\"true\"\n [label]=\"'Admin.Products.Region' | transloco\" name=\"region\" controlId=\"product-region\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.Region' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'product-region-label'\"\n [options]=\"region['regions']\"\n formControlName=\"region\"\n [ngClass]=\"{ 'is-invalid': submitted && f['region'].errors }\"\n [placeholder]=\"'Select Region'\"\n [showClear]=\"false\">\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-4\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.GitLabServiceDeskEmail' | transloco\"\n [label]=\"'Admin.Products.GitLabServiceDeskEmail' | transloco\" name=\"gitlab_service_desk_email\" controlId=\"product-gitlab_service_desk_email\">\n <input type=\"text\" id=\"product-gitlab_service_desk_email\" class=\"form-control\" formControlName=\"gitlab_service_desk_email\" />\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'Pages.Alpha'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.PartnerProducts' | transloco\"\n [label]=\"'Admin.Products.PartnerProducts' | transloco\" name=\"partner_products\" controlId=\"product-partner_products\" [useAriaLabelledbyOnly]=\"true\">\n <p-multiSelect inputId=\"product-partner_products\"\n [options]=\"productsList\" (onChange)=\"onSearchPartnerProducts($event)\"\n [attr.aria-labelledby]=\"'product-partner_products-label'\"\n [ngModelOptions]=\"{ standalone: true }\" [showToggleAll]=\"true\" [(ngModel)]=\"selectedPartnerProducts\"\n [showHeader]=\"true\" maxSelectedLabels=\"1\" appendTo=\"body\">\n </p-multiSelect>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'Pages.Alpha'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.ProrationBehavior' | transloco\"\n [label]=\"'Admin.Products.ProrationBehavior' | transloco\" name=\"proration_behavior\" controlId=\"product-proration_behavior\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'product-proration_behavior-label'\"\n [options]=\"prorationBehaviors\"\n formControlName=\"proration_behavior\"\n [placeholder]=\"'Select Proration Behavior'\"\n optionValue=\"value\"\n optionLabel=\"label\"\n [showClear]=\"true\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'Pages.Alpha'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.UnsubscribeStripeBehavior' | transloco\"\n [label]=\"'Admin.Products.UnsubscribeStripeBehavior' | transloco\" name=\"unsubscribe_stripe_behavior\" controlId=\"product-unsubscribe_stripe_behavior\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'product-unsubscribe_stripe_behavior-label'\"\n [options]=\"unsubscribeBehaviors\"\n formControlName=\"unsubscribe_stripe_behavior\"\n [placeholder]=\"'Select Unsubscribe Stripe Behavior'\"\n optionValue=\"value\"\n optionLabel=\"label\"\n [showClear]=\"true\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <!--start toggles -->\n <div class=\"col-12 row mt-4\">\n <div class=\"col\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.IsActive' | transloco\"\n [label]=\"'Admin.Products.IsActive' | transloco\" name=\"active\" controlId=\"product-active\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"active\" name=\"active\"\n [attr.aria-labelledby]=\"'product-active-label'\"\n [ngClass]=\"{ 'is-invalid': submitted && f['active'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col\" *rbacAllow=\"'SuperAdmin'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MultipleAllowed' | transloco\"\n [label]=\"'Admin.Products.MultipleAllowed' | transloco\" class=\"nowrap\" name=\"multiple_allowed\" controlId=\"product-multiple_allowed\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"multiple_allowed\" name=\"multiple_allowed\"\n [attr.aria-labelledby]=\"'product-multiple_allowed-label'\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['multiple_allowed'].errors\n }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.IsVisible' | transloco\"\n [label]=\"'Admin.Products.IsVisible' | transloco\" name=\"visible\" controlId=\"product-visible\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"visible\" name=\"visible\"\n [attr.aria-labelledby]=\"'product-visible-label'\"\n [ngClass]=\"{ 'is-invalid': submitted && f['visible'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MembersVisible' | transloco\"\n [label]=\"'Admin.Products.MembersVisible' | transloco\" name=\"members_visible\" controlId=\"product-members_visible\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"members_visible\" name=\"members_visible\"\n [attr.aria-labelledby]=\"'product-members_visible-label'\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['members_visible'].errors\n }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.ChatVisible' | transloco\"\n [label]=\"'Admin.Products.ChatVisible' | transloco\" name=\"chat_visible\" controlId=\"product-chat_visible\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"chat_visible\" name=\"chat_visible\"\n [attr.aria-labelledby]=\"'product-chat_visible-label'\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['chat_visible'].errors\n }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col\" *rbacAllow=\"'SuperAdmin'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.IsMasterProduct' | transloco\"\n [label]=\"'Admin.Products.IsMasterProduct' | transloco\" name=\"is_master_product\" controlId=\"product-is_master_product\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"is_master_product\" name=\"is_master_product\"\n [attr.aria-labelledby]=\"'product-is_master_product-label'\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['is_master_product'].errors\n }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n </div>\n <!-- end toggles -->\n </div>\n <div class=\"row text-end mt-4\">\n <div class=\"col-12\">\n <button type=\"button\" class=\"btn btn-outline-default me-2\" (click)=\"back()\"> {{ 'Button.Cancel' |\n transloco }} </button>\n <button type=\"submit\" [buttonBusy]=\"submitted\" class=\"btn btn-primary\" *rbacAllow=\"'Pages.Admin.Product.Edit'\"> {{ 'Button.Submit'\n | transloco }} </button>\n </div>\n </div>\n </form>\n </div>\n </div>\n </div>\n</div>\n<ng-template #content let-modal>\n <div class=\"modal-header\">\n <h3 class=\"modal-title mb-0 p-0\">{{ 'User.Subscriptions.FullLogo' | transloco }}</h3>\n <button type=\"button\" class=\"btn-close float-end\" aria-label=\"Close\" (click)=\"modal.dismiss()\">\n </button>\n </div>\n <div class=\"modal-body\">\n <small> {{ 'User.Profile.PictureMessage' | transloco }}</small>\n <pw-image-cropper #profile (imageSelectionEvent)=\"onImageSelection($event)\" aspectRatio=\"fullLogo\"\n (closeEvent)=\"onClose()\">\n </pw-image-cropper>\n </div>\n</ng-template>\n<ng-template #squaredLogoContent let-modal>\n <div class=\"modal-header\">\n <h3 class=\"modal-title mb-0 p-0\">{{ 'User.Subscriptions.SquaredLogo' | transloco }}</h3>\n <button type=\"button\" class=\"btn-close float-end\" aria-label=\"Close\" (click)=\"modal.dismiss()\">\n </button>\n </div>\n <div class=\"modal-body\">\n <small> {{ 'User.Profile.PictureMessage' | transloco }}</small>\n <pw-image-cropper #profile (imageSelectionEvent)=\"uploadSquaredLogo($event)\" aspectRatio=\"auto\"\n (closeEvent)=\"onClose()\">\n </pw-image-cropper>\n </div>\n</ng-template>\n", styles: [".pw-label-style.info-circle{display:inline-block;line-height:1.5}.pw-label-style.info-circle:after{top:-7px}.nowrap{white-space:nowrap}textarea{height:180px}.full-logo{object-fit:cover;width:280px}\n"] }]
|
|
5054
|
+
args: [{ selector: 'pw-product-details', standalone: false, template: "<div class=\"container-fluid pw-tab product-form overflow-hidden\">\n <div class=\"dashboard\">\n <div class=\"dashboard-body\">\n <div class=\"me-auto col-xs-6 mt-4\">\n <a aria-label=\"Navigate to Target\" (click)=\"back()\" class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\"\n aria-hidden=\"true\"></i></a>\n <h3 class=\"\">Product: {{ data?.name ? data?.name : 'Add New' }}</h3>\n </div>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"isLoading\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n <div class=\"my-4\" *ngIf=\"!isLoading\">\n <div class=\"mb-5\">\n <p-accordion>\n <p-accordion-panel value=\"0\">\n <p-accordion-header>How To</p-accordion-header>\n <p-accordion-content>\n <div class=\"row\">\n <div class=\"col-12 col-md-6\">\n <h4>Product / Feature logic</h4>\n <p> Logic for back-end/front-end permissions binding:\n <br /> * product.category (these are features) => type of product, i.e., seat_pricing or item_pricing\n <br /> * product.feature_key => this describes the main feature\n <br /> * product.permission_key => users can be subscribed to only one product of same permission_key\n <br /> * product.product_key => this is unique to each product, it defines the permission for frontend binding\n <br /> * Example of permission => {{ 'Pages.Product.{permission_key}.{product_key}' }}\n <br /> * If it's a feature associated to an existing project, you can to set the \"dependency product\" accordingly. </p>\n </div>\n <div class=\"col-12 col-md-6\">\n <h4>If it's a Free Product</h4>\n <p> Stripe Plan needs to be nil. <br /> \"Price\" per Unit needs to be set as 0. <br /> \"Trial Days\" needs\n to be something like 99999. <br /> The product should be set as \"visible===false\". </p>\n </div>\n </div>\n </p-accordion-content>\n </p-accordion-panel>\n </p-accordion>\n </div>\n <div class=\"row\" *ngIf=\"id\">\n <div class=\"col-md-6\">\n <div class=\"text-center mt-5\">\n <div class=\"image-container\">\n <h4 class=\"mb-2\"> {{ 'User.Subscriptions.FullLogo' | transloco }} <span class=\"tooltip-wrap ms-1\"\n [pTooltip]=\"'User.Subscriptions.Tooltip.FullLogo'|transloco\" [appendTo]=\"'body'\"\n [tooltipPosition]=\"'top'\">\n <i class=\"fas fa-info-circle\"></i>\n </span>\n </h4>\n <img [src]=\"fullLogo\" alt=\"Demo Logo\" class=\"image full-logo w-100 h-100\"\n (error)=\"handleImageError($event, 'assets/img/icons/demo_logo1.png')\" />\n <div class=\"overlay mt-2\" (click)=\"openModal(content)\" (keydown.enter)=\"openModal(content)\">\n <div class=\"overlay-text\">\n <a aria-label=\"Navigate to Target\">{{ 'User.Profile.Change' | transloco }}</a>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"col-md-6\">\n <div class=\"text-center mt-5\">\n <div class=\"image-container\">\n <h4 class=\"mb-2\"> {{ 'User.Subscriptions.SquaredLogo' | transloco }} <span class=\"tooltip-wrap ms-1\"\n [pTooltip]=\"'User.Subscriptions.Tooltip.SquaredLogo'|transloco\" [appendTo]=\"'body'\"\n [tooltipPosition]=\"'top'\">\n <i class=\"fas fa-info-circle\"></i>\n </span>\n </h4>\n <img [src]=\"squaredLogo\" alt=\"Company Logo\" width=\"70\" class=\"squared_logo\" height=\"70\"\n (error)=\"handleImageError($event, 'assets/img/icons/company.png')\" />\n <div class=\"overlay mt-2\" (keydown.enter)=\"openModal(squaredLogoContent)\" (click)=\"openModal(squaredLogoContent)\">\n <div class=\"overlay-text\">\n <a aria-label=\"Navigate to Target\">{{ 'User.Profile.Change' | transloco }}</a>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <form [formGroup]=\"form\" (ngSubmit)=\"onSave()\">\n <div class=\"row\">\n <div class=\"col-12 col-md-6\">\n <div class=\"row\">\n <div class=\"col-md-6\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Name' | transloco\"\n [label]=\"'Label.Name' | transloco\" class=\"col-md-6 p-0\" name=\"name\" controlId=\"product-name\"\n [isLeftTooltip]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.Name' | transloco\">\n <input type=\"text\" id=\"product-name\" class=\"form-control\" formControlName=\"name\"\n [ngClass]=\"{ 'is-invalid': submitted && f['name'].errors }\" />\n </pw-input-container>\n </div>\n <div class=\"col-md-6\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.NickName' | transloco\"\n [label]=\"'Admin.Products.NickName' | transloco\" class=\"col-md-6 p-0\" name=\"nickname\" controlId=\"product-nickname\" [errorMsg]=\"\n 'Admin.Products.Validation.NickName' | transloco\n \">\n <input type=\"text\" id=\"product-nickname\" class=\"form-control\" formControlName=\"nickname\" [ngClass]=\"{\n 'is-invalid': submitted && f['nickname'].errors\n }\" />\n </pw-input-container>\n </div>\n </div>\n </div>\n <div class=\"col-12 col-md-6\">\n <div class=\"row\">\n <div class=\"mb-3 col-12 col-md-6\">\n <pw-input-container [label]=\"'Admin.Products.MinUnit' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MinUnits' | transloco\" class=\"col-md-6 p-0\" name=\"min_units\" controlId=\"product-min_units\"\n [errorMsg]=\"'Admin.Products.Validation.MinUnit' | transloco\">\n <input type=\"number\" id=\"product-min_units\" min=\"1\" class=\"form-control\" formControlName=\"min_units\" [ngClass]=\"{\n 'is-invalid': submitted && f['min_units'].errors\n }\" />\n </pw-input-container>\n </div>\n <div class=\"mb-3 col-12 col-md-6\">\n <pw-input-container [label]=\"'Admin.Products.MaxUnit' | transloco\" [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MaxUnits' | transloco\" class=\"col-md-6 p-0\" name=\"max_units\" controlId=\"product-max_units\"\n [errorMsg]=\"'Admin.Products.Validation.MaxUnit' | transloco\">\n <input type=\"number\" id=\"product-max_units\" min=\"1\" class=\"form-control\" formControlName=\"max_units\" [ngClass]=\"{\n 'is-invalid': submitted && f['max_units'].errors\n }\" />\n </pw-input-container>\n </div>\n </div>\n </div>\n <div class=\"col-12 col-md-6\">\n <span class=\"pw-label-style info-circle\" id=\"product-dependency_products-label\"> {{ 'Admin.Products.DependencyProducts' | transloco }}<span\n class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.Products.Tooltip.DependencyProducts' |\n transloco }}</span>\n </span>\n <p-multiSelect inputId=\"product-dependency_products\"\n [options]=\"productsList\" [(ngModel)]=\"selectedScopes\"\n [attr.aria-labelledby]=\"'product-dependency_products-label'\"\n [ngModelOptions]=\"{ standalone: true }\" (onChange)=\"onSearchCriteria($event)\" [showHeader]=\"false\"\n maxSelectedLabels=\"1\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n <div class=\"col-12 col-md-6\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.StripePlan' | transloco\"\n [label]=\"'Admin.Products.StripePlan' | transloco\" class=\"col-md-6 p-0\" name=\"stripe_plan_id\" controlId=\"product-stripe_plan_id\">\n <input type=\"text\" id=\"product-stripe_plan_id\" class=\"form-control\" formControlName=\"stripe_plan_id\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-6\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Price' | transloco\"\n [isLeftTooltip]=\"true\"\n [label]=\"'Admin.Products.Price' | transloco\" class=\"col-md-6 p-0\" name=\"price_per_unit\" controlId=\"product-price_per_unit\"\n [errorMsg]=\"'Admin.Products.Validation.Name' | transloco\">\n <input type=\"text\" id=\"product-price_per_unit\" numbersOnly class=\"form-control\" formControlName=\"price_per_unit\" [ngClass]=\"{\n 'is-invalid': submitted && f['price_per_unit'].errors\n }\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-6\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.TrialDays' | transloco\"\n [label]=\"'Admin.Products.TrialDays' | transloco\" class=\"col-md-6 p-0\" name=\"trial_days\" controlId=\"product-trial_days\"\n [errorMsg]=\"'Admin.Products.Validation.TrialDays' | transloco\">\n <input type=\"number\" id=\"product-trial_days\" min=\"0\" class=\"form-control\" formControlName=\"trial_days\" [ngClass]=\"{\n 'is-invalid': submitted && f['trial_days'].errors\n }\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-6\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MaxTrialHits' | transloco\"\n [label]=\"'Admin.Products.MaxTrialHits' | transloco\" class=\"col-md-6 p-0\" name=\"max_hits_trial\" controlId=\"product-max_hits_trial\">\n <input type=\"number\" id=\"product-max_hits_trial\" min=\"0\" class=\"form-control\" formControlName=\"max_hits_trial\" [ngClass]=\"{\n 'is-invalid': submitted && f['max_hits_trial'].errors\n }\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-6\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.TrialHits' | transloco\"\n [label]=\"'Admin.Products.TrialHits' | transloco\" class=\"col-md-6 p-0\" name=\"max_hits\" controlId=\"product-max_hits\">\n <input type=\"number\" id=\"product-max_hits\" min=\"0\" class=\"form-control\" formControlName=\"max_hits\"\n [ngClass]=\"{ 'is-invalid': submitted && f['max_hits'].errors }\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-12\" id=\"descriptionEditor\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Description' | transloco\"\n [label]=\"'Admin.Products.Description' | transloco\" name=\"description\" controlId=\"product-description\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.Description' | transloco\">\n <quill-editor [attr.aria-labelledby]=\"'product-description-label'\" [styles]=\"{ height: '220px' }\" formControlName=\"description\" class=\"quillEditor\" [modules]=\"editorConfig\"\n [ngClass]=\"{ 'is-invalid': submitted && f['description'].errors, 'quill-container': true}\">\n </quill-editor>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-12\" id=\"signupInstructionsEditor\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.SignupInstructions' | transloco\"\n [label]=\"'Admin.Products.SignupInstructions' | transloco\" name=\"signup_instructions\" controlId=\"product-signup_instructions\" [useAriaLabelledbyOnly]=\"true\">\n <quill-editor [attr.aria-labelledby]=\"'product-signup_instructions-label'\" [styles]=\"{ height: '220px' }\" formControlName=\"signup_instructions\" class=\"quillEditor\" [modules]=\"editorConfig\" [ngClass]=\"{\n 'is-invalid': submitted && f['signup_instructions'].errors, 'quill-container': true\n }\">\n </quill-editor>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-12\" id=\"signupEmployeesEditor\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.SignupInstructionEmployees' | transloco\"\n [label]=\"'Admin.Products.SignupInstructionEmployees' | transloco\" name=\"signup_instruction_employees\" controlId=\"product-signup_instruction_employees\" [useAriaLabelledbyOnly]=\"true\">\n <quill-editor [attr.aria-labelledby]=\"'product-signup_instruction_employees-label'\" [styles]=\"{ height: '220px' }\" formControlName=\"signup_instruction_employees\" class=\"quillEditor\" [modules]=\"editorConfig\" [ngClass]=\"{\n 'is-invalid':\n submitted && f['signup_instruction_employees'].errors, 'quill-container': true\n }\">\n </quill-editor>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.PermissionKey' | transloco\"\n [label]=\"'Admin.Products.PermissionKey' | transloco\" name=\"permission_key\" controlId=\"product-permission_key\" [errorMsg]=\"\n 'Admin.Products.Validation.PermissionKey' | transloco\n \">\n <input type=\"text\" id=\"product-permission_key\" class=\"form-control\" [ngClass]=\"{\n 'is-invalid': submitted && f['permission_key'].errors\n }\" formControlName=\"permission_key\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.FeatureKey' | transloco\"\n [label]=\"'Admin.Products.FeatureKey' | transloco\" name=\"feature_key\" controlId=\"product-feature_key\"\n [errorMsg]=\"'Admin.Products.Validation.FeatureKey' | transloco\">\n <input type=\"text\" id=\"product-feature_key\" class=\"form-control\" [ngClass]=\"{\n 'is-invalid': submitted && f['feature_key'].errors\n }\" formControlName=\"feature_key\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Products.ProductKey' | transloco\" class=\"col-md-6 p-0\"\n [showTooltip]=\"true\" [tooltipText]=\"\n 'Admin.Products.Tooltip.PermissionKey' | transloco\n \" name=\"product_key\" controlId=\"product-product_key\"\n [errorMsg]=\"'Admin.Products.Validation.ProductKey' | transloco\">\n <input type=\"text\" id=\"product-product_key\" class=\"form-control\" formControlName=\"product_key\" [ngClass]=\"{\n 'is-invalid': submitted && f['product_key'].errors\n }\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [label]=\"'Admin.Products.Category' | transloco\" class=\"col-md-6 p-0\"\n [showTooltip]=\"true\" [tooltipText]=\"\n 'Admin.Products.Tooltip.PermissionKey' | transloco\n \" name=\"category\" controlId=\"product-category\" [useAriaLabelledbyOnly]=\"true\" [errorMsg]=\"'Admin.Products.Validation.Category' | transloco\">\n <p-select inputId=\"product-category\"\n [options]=\"categories\" class=\"dropdown-bg-transparent\" [attr.aria-labelledby]=\"'product-category-label'\" formControlName=\"category\"\n [ngClass]=\"{ 'is-invalid': submitted && f['category'].errors }\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.BillingFrequency' | transloco\"\n [label]=\"'Admin.Products.BillingFrequency' | transloco\" class=\"col-md-6 p-0\" name=\"billing_frequency\" controlId=\"product-billing_frequency\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.BillingFrequency' | transloco\">\n <p-select inputId=\"product-billing_frequency\"\n [options]=\"frequency\" class=\"dropdown-bg-transparent\" [attr.aria-labelledby]=\"'product-billing_frequency-label'\" formControlName=\"billing_frequency\"\n [required]=\"true\" [ngClass]=\"{\n 'is-invalid': submitted && f['billing_frequency'].errors\n }\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.DocumentationUrl' | transloco\"\n [label]=\"'Admin.Products.DocumentationUrl' | transloco\" class=\"col-md-6 p-0\" name=\"documentation_url\" controlId=\"product-documentation_url\">\n <input type=\"text\" id=\"product-documentation_url\" class=\"form-control\" formControlName=\"documentation_url\" [ngClass]=\"{\n 'is-invalid': submitted && f['documentation_url'].errors\n }\" />\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.ProductPrivacyService' | transloco\"\n [label]=\"'Admin.Products.ProductPrivacyService' | transloco\" name=\"product_privacy_service_id\" controlId=\"product-product_privacy_service_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'product-product_privacy_service_id-label'\"\n [options]=\"allTos\"\n formControlName=\"product_privacy_service_id\"\n [placeholder]=\"'Select Privacy Service'\"\n optionValue=\"id\"\n optionLabel=\"title\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'SuperAdmin'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MasterProduct' | transloco\"\n [label]=\"'Admin.Products.MasterProduct' | transloco\" name=\"master_product_id\" controlId=\"product-master_product_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'product-master_product_id-label'\"\n [options]=\"productsList\"\n formControlName=\"master_product_id\"\n [placeholder]=\"'Select Master Product'\"\n optionValue=\"value\"\n optionLabel=\"label\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"mb-3 col-xs-12 col-sm-6 col-md-4\">\n <span class=\"pw-label-style info-circle\" id=\"product-roles-label\">{{ 'Admin.Products.AssignedRoles' | transloco }} <span\n class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.Subscriptions.Tooltip.AssignedRoles' |\n transloco }}</span>\n </span>\n <p-multiSelect inputId=\"product-roles\" [options]=\"allRoles\" formControlName=\"roles\" appendTo=\"body\"\n [attr.aria-labelledby]=\"'product-roles-label'\"></p-multiSelect>\n </div>\n <div class=\"col-12 col-md-4\" *ngIf=\"supportedCurrency$ | async as currency\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Currency' | transloco\"\n [label]=\"'Admin.Products.Currency' | transloco\" name=\"currency\" controlId=\"product-currency\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.Currency' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'product-currency-label'\"\n [options]=\"currency['regions']\"\n formControlName=\"currency\"\n [ngClass]=\"{ 'is-invalid': submitted && f['currency'].errors }\"\n [placeholder]=\"'Select Currency'\"\n [showClear]=\"false\">\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-4\" *ngIf=\"supportedRegions$ | async as region\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.Region' | transloco\"\n [isLeftTooltip]=\"true\"\n [label]=\"'Admin.Products.Region' | transloco\" name=\"region\" controlId=\"product-region\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.Products.Validation.Region' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'product-region-label'\"\n [options]=\"region['regions']\"\n formControlName=\"region\"\n [ngClass]=\"{ 'is-invalid': submitted && f['region'].errors }\"\n [placeholder]=\"'Select Region'\"\n [showClear]=\"false\">\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-4\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.GitLabServiceDeskEmail' | transloco\"\n [label]=\"'Admin.Products.GitLabServiceDeskEmail' | transloco\" name=\"gitlab_service_desk_email\" controlId=\"product-gitlab_service_desk_email\">\n <input type=\"text\" id=\"product-gitlab_service_desk_email\" class=\"form-control\" formControlName=\"gitlab_service_desk_email\" />\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'Pages.Alpha'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.PartnerProducts' | transloco\"\n [label]=\"'Admin.Products.PartnerProducts' | transloco\" name=\"partner_products\" controlId=\"product-partner_products\" [useAriaLabelledbyOnly]=\"true\">\n <p-multiSelect inputId=\"product-partner_products\"\n [options]=\"productsList\" (onChange)=\"onSearchPartnerProducts($event)\"\n [attr.aria-labelledby]=\"'product-partner_products-label'\"\n [ngModelOptions]=\"{ standalone: true }\" [showToggleAll]=\"true\" [(ngModel)]=\"selectedPartnerProducts\"\n [showHeader]=\"true\" maxSelectedLabels=\"1\" appendTo=\"body\">\n </p-multiSelect>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'Pages.Alpha'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.ProrationBehavior' | transloco\"\n [label]=\"'Admin.Products.ProrationBehavior' | transloco\" name=\"proration_behavior\" controlId=\"product-proration_behavior\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'product-proration_behavior-label'\"\n [options]=\"prorationBehaviors\"\n formControlName=\"proration_behavior\"\n [placeholder]=\"'Select Proration Behavior'\"\n optionValue=\"value\"\n optionLabel=\"label\"\n [showClear]=\"true\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col-12 col-md-4\" *rbacAllow=\"'Pages.Alpha'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.UnsubscribeStripeBehavior' | transloco\"\n [label]=\"'Admin.Products.UnsubscribeStripeBehavior' | transloco\" name=\"unsubscribe_stripe_behavior\" controlId=\"product-unsubscribe_stripe_behavior\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'product-unsubscribe_stripe_behavior-label'\"\n [options]=\"unsubscribeBehaviors\"\n formControlName=\"unsubscribe_stripe_behavior\"\n [placeholder]=\"'Select Unsubscribe Stripe Behavior'\"\n optionValue=\"value\"\n optionLabel=\"label\"\n [showClear]=\"true\">\n </p-select>\n </pw-input-container>\n </div>\n </div>\n <!--start toggles -->\n <div class=\"col-12 row mt-4\">\n <div class=\"col\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\" [tooltipText]=\"'Admin.Products.Tooltip.IsActive' | transloco\"\n [label]=\"'Admin.Products.IsActive' | transloco\" name=\"active\" controlId=\"product-active\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"active\" name=\"active\"\n [attr.aria-labelledby]=\"'product-active-label'\"\n [ngClass]=\"{ 'is-invalid': submitted && f['active'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col\" *rbacAllow=\"'SuperAdmin'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MultipleAllowed' | transloco\"\n [label]=\"'Admin.Products.MultipleAllowed' | transloco\" class=\"nowrap\" name=\"multiple_allowed\" controlId=\"product-multiple_allowed\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"multiple_allowed\" name=\"multiple_allowed\"\n [attr.aria-labelledby]=\"'product-multiple_allowed-label'\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['multiple_allowed'].errors\n }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.IsVisible' | transloco\"\n [label]=\"'Admin.Products.IsVisible' | transloco\" name=\"visible\" controlId=\"product-visible\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"visible\" name=\"visible\"\n [attr.aria-labelledby]=\"'product-visible-label'\"\n [ngClass]=\"{ 'is-invalid': submitted && f['visible'].errors }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.MembersVisible' | transloco\"\n [label]=\"'Admin.Products.MembersVisible' | transloco\" name=\"members_visible\" controlId=\"product-members_visible\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"members_visible\" name=\"members_visible\"\n [attr.aria-labelledby]=\"'product-members_visible-label'\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['members_visible'].errors\n }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.ChatVisible' | transloco\"\n [label]=\"'Admin.Products.ChatVisible' | transloco\" name=\"chat_visible\" controlId=\"product-chat_visible\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"chat_visible\" name=\"chat_visible\"\n [attr.aria-labelledby]=\"'product-chat_visible-label'\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['chat_visible'].errors\n }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n <div class=\"col\" *rbacAllow=\"'SuperAdmin'\">\n <div class=\"mb-3\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Products.Tooltip.IsMasterProduct' | transloco\"\n [label]=\"'Admin.Products.IsMasterProduct' | transloco\" name=\"is_master_product\" controlId=\"product-is_master_product\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" formControlName=\"is_master_product\" name=\"is_master_product\"\n [attr.aria-labelledby]=\"'product-is_master_product-label'\"\n [ngClass]=\"{\n 'is-invalid': submitted && f['is_master_product'].errors\n }\">\n </ui-switch>\n </pw-input-container>\n </div>\n </div>\n </div>\n <!-- end toggles -->\n </div>\n <div class=\"row text-end mt-4\">\n <div class=\"col-12\">\n <button type=\"button\" class=\"btn btn-outline-default me-2\" (click)=\"back()\"> {{ 'Button.Cancel' |\n transloco }} </button>\n <button type=\"submit\" [buttonBusy]=\"submitted\" class=\"btn btn-primary\" *rbacAllow=\"'Pages.Admin.Product.Edit'\"> {{ 'Button.Submit'\n | transloco }} </button>\n </div>\n </div>\n </form>\n </div>\n </div>\n </div>\n</div>\n<ng-template #content let-modal>\n <div class=\"modal-header\">\n <h3 class=\"modal-title mb-0 p-0\">{{ 'User.Subscriptions.FullLogo' | transloco }}</h3>\n <button type=\"button\" class=\"btn-close float-end\" aria-label=\"Close\" (click)=\"modal.dismiss()\">\n </button>\n </div>\n <div class=\"modal-body\">\n <small> {{ 'User.Profile.PictureMessage' | transloco }}</small>\n <pw-image-cropper #profile (imageSelectionEvent)=\"onImageSelection($event)\" aspectRatio=\"fullLogo\"\n (closeEvent)=\"onClose()\">\n </pw-image-cropper>\n </div>\n</ng-template>\n<ng-template #squaredLogoContent let-modal>\n <div class=\"modal-header\">\n <h3 class=\"modal-title mb-0 p-0\">{{ 'User.Subscriptions.SquaredLogo' | transloco }}</h3>\n <button type=\"button\" class=\"btn-close float-end\" aria-label=\"Close\" (click)=\"modal.dismiss()\">\n </button>\n </div>\n <div class=\"modal-body\">\n <small> {{ 'User.Profile.PictureMessage' | transloco }}</small>\n <pw-image-cropper #profile (imageSelectionEvent)=\"uploadSquaredLogo($event)\" aspectRatio=\"auto\"\n (closeEvent)=\"onClose()\">\n </pw-image-cropper>\n </div>\n</ng-template>\n", styles: [".pw-label-style.info-circle{display:inline-block;line-height:1.5}.pw-label-style.info-circle:after{top:-7px}.nowrap{white-space:nowrap}textarea{height:180px}.full-logo{object-fit:cover;width:280px}\n"] }]
|
|
5055
5055
|
}], ctorParameters: () => [{ type: i0.Injector }, { type: i1$2.ProductService }, { type: i2$1.NgbModal }, { type: i1.AdminService }], propDecorators: { onSave: [] } });
|
|
5056
5056
|
|
|
5057
5057
|
class ProductInsightComponent extends AppBaseComponent {
|
|
@@ -8040,11 +8040,11 @@ class TagDetailsComponent extends AppBaseComponent {
|
|
|
8040
8040
|
});
|
|
8041
8041
|
}
|
|
8042
8042
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TagDetailsComponent, deps: [{ token: i0.Injector }, { token: i1$2.TagService }, { token: i0.ChangeDetectorRef }, { token: i2$1.NgbModal }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8043
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: TagDetailsComponent, isStandalone: false, selector: "pw-tag-details", usesInheritance: true, ngImport: i0, template: "<div class=\"container-fluid pw-tab overflow-hidden\">\n <div class=\"dashboard\">\n <div class=\"dashboard-body\">\n <div class=\"me-auto col-xs-6 mt-4\">\n <a aria-label=\"Navigate to Target\"\n (click)=\"back()\"\n class=\"previous\">\n <i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i>\n </a>\n <h3 class=\"m-subheader__title m-subheader__title--separator\">\n {{ currentTag ? 'Edit Tag' : 'Create Tag' }}\n </h3>\n </div>\n\n <div class=\"p-2 mt-3\">\n <form [formGroup]=\"form\" (ngSubmit)=\"onSave()\">\n <div class=\"row\">\n <!-- Tag Name -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [label]=\"'Admin.Tags.TagName' | transloco\"\n errorMsg=\"This field is required.\" name=\"name\" controlId=\"tags-name\">\n <input type=\"text\" id=\"tags-name\" class=\"form-control\" formControlName=\"name\" placeholder=\"Tag Name\" />\n </pw-input-container>\n </div>\n\n <!-- Tag Type -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [label]=\"'Admin.Tags.TagType' | transloco\"\n errorMsg=\"This field is required.\" name=\"tag_type\" controlId=\"tags-tag_type\" [useAriaLabelledbyOnly]=\"true\">\n <p-select [options]=\"tagTypes\" formControlName=\"tag_type\"\n [attr.aria-labelledby]=\"'tags-tag_type-label'\" placeholder=\"Tag Types\">\n </p-select>\n </pw-input-container>\n </div>\n\n <!-- Category -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [label]=\"'Admin.Tags.Category' | transloco\"\n errorMsg=\"This field is required.\" name=\"tag_category_id\" controlId=\"tags-tag_category_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-select [options]=\"tagCategories\" formControlName=\"tag_category_id\"\n [attr.aria-labelledby]=\"'tags-tag_category_id-label'\" placeholder=\"Category\">\n </p-select>\n </pw-input-container>\n </div>\n\n <!-- Icon Name -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [label]=\"'Admin.Tags.IconName' | transloco\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Tags.Tooltip.IconName' | transloco\"\n name=\"icon_name\" controlId=\"tags-icon_name\">\n <input type=\"text\" id=\"tags-icon_name\" class=\"form-control\" formControlName=\"icon_name\" placeholder=\"Icon Name\" />\n </pw-input-container>\n </div>\n\n <!-- Title and Meta Title on same line -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [label]=\"'Label.Title' | transloco\" name=\"title\" controlId=\"tags-title\"\n errorMsg=\"This field is required.\">\n <input type=\"text\" id=\"tags-title\" class=\"form-control\" formControlName=\"title\" placeholder=\"Title\" />\n </pw-input-container>\n </div>\n\n <!-- Meta Title -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [label]=\"'Meta Title' | transloco\" name=\"meta_title\" controlId=\"tags-meta_title\">\n <input type=\"text\" id=\"tags-meta_title\" class=\"form-control\" formControlName=\"meta_title\" placeholder=\"Meta Title\" />\n </pw-input-container>\n </div>\n\n <!-- Description and Meta Description on same line -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [label]=\"'Admin.Tags.Description' | transloco\" name=\"description\" controlId=\"tags-description\"\n errorMsg=\"This field is required.\">\n <textarea id=\"tags-description\" class=\"form-control\" rows=\"3\" formControlName=\"description\" placeholder=\"Description\"></textarea>\n </pw-input-container>\n </div>\n\n <!-- Meta Description -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [label]=\"'Meta Description' | transloco\" name=\"meta_description\" controlId=\"tags-meta_description\">\n <textarea id=\"tags-meta_description\" class=\"form-control\" rows=\"3\" formControlName=\"meta_description\" placeholder=\"Meta Description\"></textarea>\n </pw-input-container>\n </div>\n\n <!-- Visible In Resources toggle moved to bottom -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Tags.Tooltip.VisibleInResources' | transloco\"\n [label]=\"'Admin.Tags.VisibleInResources' | transloco\"\n name=\"visible_in_resources\" controlId=\"tags-visible_in_resources\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" [attr.aria-labelledby]=\"'tags-visible_in_resources-label'\" formControlName=\"visible_in_resources\"></ui-switch>\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-4 display-grid mt-2 text-center\">\n <span class=\"pw-label-style d-block mb-1\">{{ 'Admin.Tags.Image' | transloco }}</span>\n <div class=\"text-center d-flex flex-column align-items-end\">\n <img [src]=\"image !== null ? image : 'assets/img/resource/blog.png'\"\n (click)=\"openModal(imageModal)\"\n (keydown.enter)=\"openModal(imageModal)\"\n class=\"image cropped-img\"\n [ngClass]=\"{ 'w-100': image === null }\"\n alt=\"Tag preview\"\n (error)=\"handleImageError($event, 'assets/img/resource/blog.png')\" />\n <div class=\"d-flex justify-content-between align-items-center mt-2\">\n <a aria-label=\"Open image cropper\"\n class=\"d-inline-block mt-2\"\n (click)=\"openModal(imageModal)\">\n {{ currentTag ? 'Update' : 'Add' }} Image\n </a>\n <i\n class=\"fa fa-trash delete-icon text-danger ms-2 cursor-pointer\"\n title=\"Remove Image\"\n (click)=\"deleteTagImage()\"\n (keydown.enter)=\"deleteTagImage()\"\n *ngIf=\"image && !image.includes('default-photo.jpg') && !image.includes('no_image_uploaded_squared.png')\">\n </i>\n </div>\n </div>\n </div>\n\n <!-- Image Upload -->\n </div>\n\n <div class=\"row text-end mt-4\">\n <div class=\"col-12\">\n <button type=\"button\"\n class=\"btn btn-outline-default me-2\"\n (click)=\"back()\">\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n [disabled]=\"!form.valid\"\n class=\"btn btn-primary\">\n {{ 'Button.Save' | transloco }}\n </button>\n </div>\n </div>\n </form>\n </div>\n </div>\n </div>\n</div>\n\n\n<ng-template #imageModal let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Upload Image</h5>\n <button type=\"button\" class=\"btn-close float-end\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n </div>\n <div class=\"modal-body\">\n <small>You can upload a JPG, GIF, or PNG file. Avoid artwork, celebrities, or copyrighted images.</small>\n <pw-image-cropper\n #cropper\n aspectRatio=\"dynamic\"\n (imageSelectionEvent)=\"onImageSelected($event)\"\n (closeEvent)=\"onClose()\">\n </pw-image-cropper>\n </div>\n</ng-template>\n", dependencies: [{ kind: "component", type: i3.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "size", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "fluid", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i4.UiSwitchComponent, selector: "ui-switch", inputs: ["size", "color", "switchOffColor", "switchColor", "defaultBgColor", "defaultBoColor", "checkedLabel", "uncheckedLabel", "checkedTextColor", "uncheckedTextColor", "beforeChange", "ariaLabel", "checked", "disabled", "reverse", "loading"], outputs: ["change", "changeEvent", "valueChange"] }, { kind: "component", type: i13.ProfileImageCropperComponent, selector: "pw-image-cropper", inputs: ["aspectRatio", "dynamicData"], outputs: ["imageSelectionEvent", "closeEvent", "fileChangeEvent"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "controlId", "useAriaLabelledbyOnly", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i10.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i10.LazyImgDirective, selector: "img" }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
8043
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: TagDetailsComponent, isStandalone: false, selector: "pw-tag-details", usesInheritance: true, ngImport: i0, template: "<div class=\"container-fluid pw-tab overflow-hidden\">\n <div class=\"dashboard\">\n <div class=\"dashboard-body\">\n <div class=\"me-auto col-xs-6 mt-4\">\n <a aria-label=\"Navigate to Target\"\n (click)=\"back()\"\n class=\"previous\">\n <i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i>\n </a>\n <h3 class=\"m-subheader__title m-subheader__title--separator\">\n {{ currentTag ? 'Edit Tag' : 'Create Tag' }}\n </h3>\n </div>\n\n <div class=\"p-2 mt-3\">\n <form [formGroup]=\"form\" (ngSubmit)=\"onSave()\">\n <div class=\"row\">\n <!-- Tag Name -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [label]=\"'Admin.Tags.TagName' | transloco\"\n errorMsg=\"This field is required.\" name=\"name\" controlId=\"tags-name\">\n <input type=\"text\" id=\"tags-name\" class=\"form-control\" formControlName=\"name\" placeholder=\"Tag Name\" />\n </pw-input-container>\n </div>\n\n <!-- Tag Type -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [label]=\"'Admin.Tags.TagType' | transloco\"\n errorMsg=\"This field is required.\" name=\"tag_type\" controlId=\"tags-tag_type\" [useAriaLabelledbyOnly]=\"true\">\n <p-select inputId=\"tags-tag_type\"\n [options]=\"tagTypes\" formControlName=\"tag_type\"\n [attr.aria-labelledby]=\"'tags-tag_type-label'\" placeholder=\"Tag Types\">\n </p-select>\n </pw-input-container>\n </div>\n\n <!-- Category -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [label]=\"'Admin.Tags.Category' | transloco\"\n errorMsg=\"This field is required.\" name=\"tag_category_id\" controlId=\"tags-tag_category_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-select inputId=\"tags-tag_category_id\"\n [options]=\"tagCategories\" formControlName=\"tag_category_id\"\n [attr.aria-labelledby]=\"'tags-tag_category_id-label'\" placeholder=\"Category\">\n </p-select>\n </pw-input-container>\n </div>\n\n <!-- Icon Name -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [label]=\"'Admin.Tags.IconName' | transloco\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Tags.Tooltip.IconName' | transloco\"\n name=\"icon_name\" controlId=\"tags-icon_name\">\n <input type=\"text\" id=\"tags-icon_name\" class=\"form-control\" formControlName=\"icon_name\" placeholder=\"Icon Name\" />\n </pw-input-container>\n </div>\n\n <!-- Title and Meta Title on same line -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [label]=\"'Label.Title' | transloco\" name=\"title\" controlId=\"tags-title\"\n errorMsg=\"This field is required.\">\n <input type=\"text\" id=\"tags-title\" class=\"form-control\" formControlName=\"title\" placeholder=\"Title\" />\n </pw-input-container>\n </div>\n\n <!-- Meta Title -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [label]=\"'Meta Title' | transloco\" name=\"meta_title\" controlId=\"tags-meta_title\">\n <input type=\"text\" id=\"tags-meta_title\" class=\"form-control\" formControlName=\"meta_title\" placeholder=\"Meta Title\" />\n </pw-input-container>\n </div>\n\n <!-- Description and Meta Description on same line -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [label]=\"'Admin.Tags.Description' | transloco\" name=\"description\" controlId=\"tags-description\"\n errorMsg=\"This field is required.\">\n <textarea id=\"tags-description\" class=\"form-control\" rows=\"3\" formControlName=\"description\" placeholder=\"Description\"></textarea>\n </pw-input-container>\n </div>\n\n <!-- Meta Description -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [label]=\"'Meta Description' | transloco\" name=\"meta_description\" controlId=\"tags-meta_description\">\n <textarea id=\"tags-meta_description\" class=\"form-control\" rows=\"3\" formControlName=\"meta_description\" placeholder=\"Meta Description\"></textarea>\n </pw-input-container>\n </div>\n\n <!-- Visible In Resources toggle moved to bottom -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Tags.Tooltip.VisibleInResources' | transloco\"\n [label]=\"'Admin.Tags.VisibleInResources' | transloco\"\n name=\"visible_in_resources\" controlId=\"tags-visible_in_resources\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" [attr.aria-labelledby]=\"'tags-visible_in_resources-label'\" formControlName=\"visible_in_resources\"></ui-switch>\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-4 display-grid mt-2 text-center\">\n <span class=\"pw-label-style d-block mb-1\">{{ 'Admin.Tags.Image' | transloco }}</span>\n <div class=\"text-center d-flex flex-column align-items-end\">\n <img [src]=\"image !== null ? image : 'assets/img/resource/blog.png'\"\n (click)=\"openModal(imageModal)\"\n (keydown.enter)=\"openModal(imageModal)\"\n class=\"image cropped-img\"\n [ngClass]=\"{ 'w-100': image === null }\"\n alt=\"Tag preview\"\n (error)=\"handleImageError($event, 'assets/img/resource/blog.png')\" />\n <div class=\"d-flex justify-content-between align-items-center mt-2\">\n <a aria-label=\"Open image cropper\"\n class=\"d-inline-block mt-2\"\n (click)=\"openModal(imageModal)\">\n {{ currentTag ? 'Update' : 'Add' }} Image\n </a>\n <i\n class=\"fa fa-trash delete-icon text-danger ms-2 cursor-pointer\"\n title=\"Remove Image\"\n (click)=\"deleteTagImage()\"\n (keydown.enter)=\"deleteTagImage()\"\n *ngIf=\"image && !image.includes('default-photo.jpg') && !image.includes('no_image_uploaded_squared.png')\">\n </i>\n </div>\n </div>\n </div>\n\n <!-- Image Upload -->\n </div>\n\n <div class=\"row text-end mt-4\">\n <div class=\"col-12\">\n <button type=\"button\"\n class=\"btn btn-outline-default me-2\"\n (click)=\"back()\">\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n [disabled]=\"!form.valid\"\n class=\"btn btn-primary\">\n {{ 'Button.Save' | transloco }}\n </button>\n </div>\n </div>\n </form>\n </div>\n </div>\n </div>\n</div>\n\n\n<ng-template #imageModal let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Upload Image</h5>\n <button type=\"button\" class=\"btn-close float-end\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n </div>\n <div class=\"modal-body\">\n <small>You can upload a JPG, GIF, or PNG file. Avoid artwork, celebrities, or copyrighted images.</small>\n <pw-image-cropper\n #cropper\n aspectRatio=\"dynamic\"\n (imageSelectionEvent)=\"onImageSelected($event)\"\n (closeEvent)=\"onClose()\">\n </pw-image-cropper>\n </div>\n</ng-template>\n", dependencies: [{ kind: "component", type: i3.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "size", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "fluid", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i4.UiSwitchComponent, selector: "ui-switch", inputs: ["size", "color", "switchOffColor", "switchColor", "defaultBgColor", "defaultBoColor", "checkedLabel", "uncheckedLabel", "checkedTextColor", "uncheckedTextColor", "beforeChange", "ariaLabel", "checked", "disabled", "reverse", "loading"], outputs: ["change", "changeEvent", "valueChange"] }, { kind: "component", type: i13.ProfileImageCropperComponent, selector: "pw-image-cropper", inputs: ["aspectRatio", "dynamicData"], outputs: ["imageSelectionEvent", "closeEvent", "fileChangeEvent"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "controlId", "useAriaLabelledbyOnly", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i10.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i10.LazyImgDirective, selector: "img" }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
8044
8044
|
}
|
|
8045
8045
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: TagDetailsComponent, decorators: [{
|
|
8046
8046
|
type: Component,
|
|
8047
|
-
args: [{ selector: 'pw-tag-details', encapsulation: ViewEncapsulation.None, standalone: false, template: "<div class=\"container-fluid pw-tab overflow-hidden\">\n <div class=\"dashboard\">\n <div class=\"dashboard-body\">\n <div class=\"me-auto col-xs-6 mt-4\">\n <a aria-label=\"Navigate to Target\"\n (click)=\"back()\"\n class=\"previous\">\n <i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i>\n </a>\n <h3 class=\"m-subheader__title m-subheader__title--separator\">\n {{ currentTag ? 'Edit Tag' : 'Create Tag' }}\n </h3>\n </div>\n\n <div class=\"p-2 mt-3\">\n <form [formGroup]=\"form\" (ngSubmit)=\"onSave()\">\n <div class=\"row\">\n <!-- Tag Name -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [label]=\"'Admin.Tags.TagName' | transloco\"\n errorMsg=\"This field is required.\" name=\"name\" controlId=\"tags-name\">\n <input type=\"text\" id=\"tags-name\" class=\"form-control\" formControlName=\"name\" placeholder=\"Tag Name\" />\n </pw-input-container>\n </div>\n\n <!-- Tag Type -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [label]=\"'Admin.Tags.TagType' | transloco\"\n errorMsg=\"This field is required.\" name=\"tag_type\" controlId=\"tags-tag_type\" [useAriaLabelledbyOnly]=\"true\">\n <p-select [options]=\"tagTypes\" formControlName=\"tag_type\"\n [attr.aria-labelledby]=\"'tags-tag_type-label'\" placeholder=\"Tag Types\">\n </p-select>\n </pw-input-container>\n </div>\n\n <!-- Category -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [label]=\"'Admin.Tags.Category' | transloco\"\n errorMsg=\"This field is required.\" name=\"tag_category_id\" controlId=\"tags-tag_category_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-select [options]=\"tagCategories\" formControlName=\"tag_category_id\"\n [attr.aria-labelledby]=\"'tags-tag_category_id-label'\" placeholder=\"Category\">\n </p-select>\n </pw-input-container>\n </div>\n\n <!-- Icon Name -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [label]=\"'Admin.Tags.IconName' | transloco\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Tags.Tooltip.IconName' | transloco\"\n name=\"icon_name\" controlId=\"tags-icon_name\">\n <input type=\"text\" id=\"tags-icon_name\" class=\"form-control\" formControlName=\"icon_name\" placeholder=\"Icon Name\" />\n </pw-input-container>\n </div>\n\n <!-- Title and Meta Title on same line -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [label]=\"'Label.Title' | transloco\" name=\"title\" controlId=\"tags-title\"\n errorMsg=\"This field is required.\">\n <input type=\"text\" id=\"tags-title\" class=\"form-control\" formControlName=\"title\" placeholder=\"Title\" />\n </pw-input-container>\n </div>\n\n <!-- Meta Title -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [label]=\"'Meta Title' | transloco\" name=\"meta_title\" controlId=\"tags-meta_title\">\n <input type=\"text\" id=\"tags-meta_title\" class=\"form-control\" formControlName=\"meta_title\" placeholder=\"Meta Title\" />\n </pw-input-container>\n </div>\n\n <!-- Description and Meta Description on same line -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [label]=\"'Admin.Tags.Description' | transloco\" name=\"description\" controlId=\"tags-description\"\n errorMsg=\"This field is required.\">\n <textarea id=\"tags-description\" class=\"form-control\" rows=\"3\" formControlName=\"description\" placeholder=\"Description\"></textarea>\n </pw-input-container>\n </div>\n\n <!-- Meta Description -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [label]=\"'Meta Description' | transloco\" name=\"meta_description\" controlId=\"tags-meta_description\">\n <textarea id=\"tags-meta_description\" class=\"form-control\" rows=\"3\" formControlName=\"meta_description\" placeholder=\"Meta Description\"></textarea>\n </pw-input-container>\n </div>\n\n <!-- Visible In Resources toggle moved to bottom -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Tags.Tooltip.VisibleInResources' | transloco\"\n [label]=\"'Admin.Tags.VisibleInResources' | transloco\"\n name=\"visible_in_resources\" controlId=\"tags-visible_in_resources\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" [attr.aria-labelledby]=\"'tags-visible_in_resources-label'\" formControlName=\"visible_in_resources\"></ui-switch>\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-4 display-grid mt-2 text-center\">\n <span class=\"pw-label-style d-block mb-1\">{{ 'Admin.Tags.Image' | transloco }}</span>\n <div class=\"text-center d-flex flex-column align-items-end\">\n <img [src]=\"image !== null ? image : 'assets/img/resource/blog.png'\"\n (click)=\"openModal(imageModal)\"\n (keydown.enter)=\"openModal(imageModal)\"\n class=\"image cropped-img\"\n [ngClass]=\"{ 'w-100': image === null }\"\n alt=\"Tag preview\"\n (error)=\"handleImageError($event, 'assets/img/resource/blog.png')\" />\n <div class=\"d-flex justify-content-between align-items-center mt-2\">\n <a aria-label=\"Open image cropper\"\n class=\"d-inline-block mt-2\"\n (click)=\"openModal(imageModal)\">\n {{ currentTag ? 'Update' : 'Add' }} Image\n </a>\n <i\n class=\"fa fa-trash delete-icon text-danger ms-2 cursor-pointer\"\n title=\"Remove Image\"\n (click)=\"deleteTagImage()\"\n (keydown.enter)=\"deleteTagImage()\"\n *ngIf=\"image && !image.includes('default-photo.jpg') && !image.includes('no_image_uploaded_squared.png')\">\n </i>\n </div>\n </div>\n </div>\n\n <!-- Image Upload -->\n </div>\n\n <div class=\"row text-end mt-4\">\n <div class=\"col-12\">\n <button type=\"button\"\n class=\"btn btn-outline-default me-2\"\n (click)=\"back()\">\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n [disabled]=\"!form.valid\"\n class=\"btn btn-primary\">\n {{ 'Button.Save' | transloco }}\n </button>\n </div>\n </div>\n </form>\n </div>\n </div>\n </div>\n</div>\n\n\n<ng-template #imageModal let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Upload Image</h5>\n <button type=\"button\" class=\"btn-close float-end\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n </div>\n <div class=\"modal-body\">\n <small>You can upload a JPG, GIF, or PNG file. Avoid artwork, celebrities, or copyrighted images.</small>\n <pw-image-cropper\n #cropper\n aspectRatio=\"dynamic\"\n (imageSelectionEvent)=\"onImageSelected($event)\"\n (closeEvent)=\"onClose()\">\n </pw-image-cropper>\n </div>\n</ng-template>\n" }]
|
|
8047
|
+
args: [{ selector: 'pw-tag-details', encapsulation: ViewEncapsulation.None, standalone: false, template: "<div class=\"container-fluid pw-tab overflow-hidden\">\n <div class=\"dashboard\">\n <div class=\"dashboard-body\">\n <div class=\"me-auto col-xs-6 mt-4\">\n <a aria-label=\"Navigate to Target\"\n (click)=\"back()\"\n class=\"previous\">\n <i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i>\n </a>\n <h3 class=\"m-subheader__title m-subheader__title--separator\">\n {{ currentTag ? 'Edit Tag' : 'Create Tag' }}\n </h3>\n </div>\n\n <div class=\"p-2 mt-3\">\n <form [formGroup]=\"form\" (ngSubmit)=\"onSave()\">\n <div class=\"row\">\n <!-- Tag Name -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [label]=\"'Admin.Tags.TagName' | transloco\"\n errorMsg=\"This field is required.\" name=\"name\" controlId=\"tags-name\">\n <input type=\"text\" id=\"tags-name\" class=\"form-control\" formControlName=\"name\" placeholder=\"Tag Name\" />\n </pw-input-container>\n </div>\n\n <!-- Tag Type -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [label]=\"'Admin.Tags.TagType' | transloco\"\n errorMsg=\"This field is required.\" name=\"tag_type\" controlId=\"tags-tag_type\" [useAriaLabelledbyOnly]=\"true\">\n <p-select inputId=\"tags-tag_type\"\n [options]=\"tagTypes\" formControlName=\"tag_type\"\n [attr.aria-labelledby]=\"'tags-tag_type-label'\" placeholder=\"Tag Types\">\n </p-select>\n </pw-input-container>\n </div>\n\n <!-- Category -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [label]=\"'Admin.Tags.Category' | transloco\"\n errorMsg=\"This field is required.\" name=\"tag_category_id\" controlId=\"tags-tag_category_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-select inputId=\"tags-tag_category_id\"\n [options]=\"tagCategories\" formControlName=\"tag_category_id\"\n [attr.aria-labelledby]=\"'tags-tag_category_id-label'\" placeholder=\"Category\">\n </p-select>\n </pw-input-container>\n </div>\n\n <!-- Icon Name -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [label]=\"'Admin.Tags.IconName' | transloco\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Tags.Tooltip.IconName' | transloco\"\n name=\"icon_name\" controlId=\"tags-icon_name\">\n <input type=\"text\" id=\"tags-icon_name\" class=\"form-control\" formControlName=\"icon_name\" placeholder=\"Icon Name\" />\n </pw-input-container>\n </div>\n\n <!-- Title and Meta Title on same line -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [label]=\"'Label.Title' | transloco\" name=\"title\" controlId=\"tags-title\"\n errorMsg=\"This field is required.\">\n <input type=\"text\" id=\"tags-title\" class=\"form-control\" formControlName=\"title\" placeholder=\"Title\" />\n </pw-input-container>\n </div>\n\n <!-- Meta Title -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [label]=\"'Meta Title' | transloco\" name=\"meta_title\" controlId=\"tags-meta_title\">\n <input type=\"text\" id=\"tags-meta_title\" class=\"form-control\" formControlName=\"meta_title\" placeholder=\"Meta Title\" />\n </pw-input-container>\n </div>\n\n <!-- Description and Meta Description on same line -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [label]=\"'Admin.Tags.Description' | transloco\" name=\"description\" controlId=\"tags-description\"\n errorMsg=\"This field is required.\">\n <textarea id=\"tags-description\" class=\"form-control\" rows=\"3\" formControlName=\"description\" placeholder=\"Description\"></textarea>\n </pw-input-container>\n </div>\n\n <!-- Meta Description -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [label]=\"'Meta Description' | transloco\" name=\"meta_description\" controlId=\"tags-meta_description\">\n <textarea id=\"tags-meta_description\" class=\"form-control\" rows=\"3\" formControlName=\"meta_description\" placeholder=\"Meta Description\"></textarea>\n </pw-input-container>\n </div>\n\n <!-- Visible In Resources toggle moved to bottom -->\n <div class=\"col-12 col-md-6\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Tags.Tooltip.VisibleInResources' | transloco\"\n [label]=\"'Admin.Tags.VisibleInResources' | transloco\"\n name=\"visible_in_resources\" controlId=\"tags-visible_in_resources\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\" [attr.aria-labelledby]=\"'tags-visible_in_resources-label'\" formControlName=\"visible_in_resources\"></ui-switch>\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-4 display-grid mt-2 text-center\">\n <span class=\"pw-label-style d-block mb-1\">{{ 'Admin.Tags.Image' | transloco }}</span>\n <div class=\"text-center d-flex flex-column align-items-end\">\n <img [src]=\"image !== null ? image : 'assets/img/resource/blog.png'\"\n (click)=\"openModal(imageModal)\"\n (keydown.enter)=\"openModal(imageModal)\"\n class=\"image cropped-img\"\n [ngClass]=\"{ 'w-100': image === null }\"\n alt=\"Tag preview\"\n (error)=\"handleImageError($event, 'assets/img/resource/blog.png')\" />\n <div class=\"d-flex justify-content-between align-items-center mt-2\">\n <a aria-label=\"Open image cropper\"\n class=\"d-inline-block mt-2\"\n (click)=\"openModal(imageModal)\">\n {{ currentTag ? 'Update' : 'Add' }} Image\n </a>\n <i\n class=\"fa fa-trash delete-icon text-danger ms-2 cursor-pointer\"\n title=\"Remove Image\"\n (click)=\"deleteTagImage()\"\n (keydown.enter)=\"deleteTagImage()\"\n *ngIf=\"image && !image.includes('default-photo.jpg') && !image.includes('no_image_uploaded_squared.png')\">\n </i>\n </div>\n </div>\n </div>\n\n <!-- Image Upload -->\n </div>\n\n <div class=\"row text-end mt-4\">\n <div class=\"col-12\">\n <button type=\"button\"\n class=\"btn btn-outline-default me-2\"\n (click)=\"back()\">\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n [disabled]=\"!form.valid\"\n class=\"btn btn-primary\">\n {{ 'Button.Save' | transloco }}\n </button>\n </div>\n </div>\n </form>\n </div>\n </div>\n </div>\n</div>\n\n\n<ng-template #imageModal let-modal>\n <div class=\"modal-header\">\n <h5 class=\"modal-title\">Upload Image</h5>\n <button type=\"button\" class=\"btn-close float-end\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n </div>\n <div class=\"modal-body\">\n <small>You can upload a JPG, GIF, or PNG file. Avoid artwork, celebrities, or copyrighted images.</small>\n <pw-image-cropper\n #cropper\n aspectRatio=\"dynamic\"\n (imageSelectionEvent)=\"onImageSelected($event)\"\n (closeEvent)=\"onClose()\">\n </pw-image-cropper>\n </div>\n</ng-template>\n" }]
|
|
8048
8048
|
}], ctorParameters: () => [{ type: i0.Injector }, { type: i1$2.TagService }, { type: i0.ChangeDetectorRef }, { type: i2$1.NgbModal }] });
|
|
8049
8049
|
|
|
8050
8050
|
class TagsListComponent extends AppBaseComponent {
|
|
@@ -9026,11 +9026,11 @@ class AhoyVisitsComponent extends AppBaseComponent {
|
|
|
9026
9026
|
}
|
|
9027
9027
|
}
|
|
9028
9028
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: AhoyVisitsComponent, deps: [{ token: i0.Injector }, { token: i1$2.AhoyService }, { token: i1.AdminDataService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
9029
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: AhoyVisitsComponent, isStandalone: false, selector: "pw-ahoy-visits", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12 d-flex justify-content-between align-items-center\">\n <h2 class=\"card-title p-0 float-start\">Ahoy Visits</h2>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container mt-0\" [class.hideTable]=\"data.unfiltered_count === 0\">\n <div class=\"user-management-table table-responsive\">\n <p-table #dt\n [value]=\"data.visits\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [sortField]=\"'started_at'\"\n [sortOrder]=\"-1\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\">\n <ng-template pTemplate=\"caption\">\n <div class=\"row\">\n <div *rbacAllow=\"'SuperAdmin'\"\n class=\"col-sm-2 mb-2 mb-md-0\">\n <p-select\n [options]=\"microServices\"\n (onChange)=\"onServiceChange($event.value)\"\n [placeholder]=\"'Select Service'\"\n optionLabel=\"name\"\n optionValue=\"name\">\n </p-select>\n </div>\n <div class=\"col-sm-2\">\n <p-multiSelect #multiSelector [options]=\"searchOptions\"\n (onChange)=\"onSearchOptionChange($event)\"\n placeholder=\"Filter by users\"\n [(ngModel)]=\"filterSource\"\n [showToggleAll]=\"true\"\n [showHeader]=\"true\"\n appendTo=\"body\"\n [lazy]=\"true\"\n (scroll)=\"onScroll($event)\"\n (onPanelShow)=\"onPanelShow()\"\n [loading]=\"userLoading\"\n (onFilter)=\"handleFilter($event)\"\n >\n </p-multiSelect>\n </div>\n <div class=\"col-sm-2\">\n <p-calendar [showTime]=\"true\"\n [appendTo]=\"'body'\"\n (onSelect)=\"onDateSelection()\"\n [placeholder]=\"'Start Date'\"\n [(ngModel)]=\"startDate\"\n [showIcon]=\"true\"\n dateFormat=\"yy-M-dd\"\n >\n </p-calendar>\n </div>\n <div class=\"col-sm-2\">\n <p-calendar [appendTo]=\"'body'\"\n [showTime]=\"true\"\n (onSelect)=\"onDateSelection()\"\n [placeholder]=\"'End Date'\"\n [(ngModel)]=\"endDate\"\n [showIcon]=\"true\"\n dateFormat=\"yy-M-dd\">\n </p-calendar>\n </div>\n <div class=\"col d-flex align-items-center\">\n <label for=\"ahoy-visits-search\" class=\"visually-hidden\">Search Visits</label>\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n id=\"ahoy-visits-search\"\n name=\"ahoy-visits-search\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search Visits...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90 form-control bg-white\" />\n </div>\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"browser\">\n {{ 'Admin.Tracking.Browser' | transloco }}\n <p-sortIcon field=\"browser\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"device_type\">\n {{ 'Admin.Tracking.DeviceType' | transloco }}\n <p-sortIcon field=\"device_type\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"ip\">\n {{ 'Admin.Tracking.Ip' | transloco }}\n <p-sortIcon field=\"ip\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"referring_domain\">\n {{ 'Admin.Tracking.Domain' | transloco }}\n <p-sortIcon field=\"ip\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"landing_page\">\n {{ 'Admin.Tracking.LandingPage' | transloco }}\n <p-sortIcon field=\"ip\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"country\">\n {{ 'Admin.Tracking.Country' | transloco }}\n <p-sortIcon field=\"ip\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"region\">\n {{ 'Admin.Tracking.Region' | transloco }}\n <p-sortIcon field=\"ip\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"city\">\n {{ 'Admin.Tracking.City' | transloco }}\n <p-sortIcon field=\"ip\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"os\">\n {{ 'Admin.Tracking.Os' | transloco }}\n <p-sortIcon field=\"os\"></p-sortIcon>\n </th>\n <th scope=\"true\">\n {{ 'Admin.Tracking.User' | transloco }}\n </th>\n <th scope=\"true\"\n pSortableColumn=\"started_at\">\n {{ 'Admin.Tracking.StartedAt' | transloco }}\n <p-sortIcon field=\"started_at\"></p-sortIcon>\n </th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-visits>\n <tr [class.d-none]=\"loading\">\n <td data-head=\"Browser\">{{ visits.browser }}</td>\n <td data-head=\"Device Type\">{{ visits.device_type }}</td>\n <td data-head=\"IP\">{{ visits.ip }}</td>\n <td data-head=\"referring_domain\">\n <span [ngbTooltip]=\"visits.referring_domain\"\n tooltipClass=\"custom-tooltip\"\n placement=\"top\" container=\"body\"> {{ visits.referring_domain | textTruncate: 20 }}\n </span>\n </td>\n <td data-head=\"landing_page\">\n <span [ngbTooltip]=\"visits.landing_page\"\n tooltipClass=\"custom-tooltip\"\n placement=\"top\" container=\"body\"> {{ visits.landing_page | textTruncate: 20 }}\n </span>\n </td>\n <td data-head=\"country\">\n <span [ngbTooltip]=\"visits.country\"\n tooltipClass=\"custom-tooltip\"\n placement=\"top\" container=\"body\"> {{ visits.country | textTruncate: 20 }}\n </span>\n </td>\n <td data-head=\"region\">\n <span [ngbTooltip]=\"visits.region\"\n tooltipClass=\"custom-tooltip\"\n placement=\"top\" container=\"body\"> {{ visits.region | textTruncate: 20 }}\n </span>\n </td>\n <td data-head=\"city\">\n <span [ngbTooltip]=\"visits.city\"\n tooltipClass=\"custom-tooltip\"\n placement=\"top\" container=\"body\"> {{ visits.city | textTruncate: 20 }}\n </span></td>\n <td data-head=\"OS\">{{ visits.os }}</td>\n <td data-head=\"User\">\n <span *ngIf=\"visits?.user_id\">\n <span *ngIf=\"visits?.user\"><a [routerLink]=\"['/members', visits?.user?.slug]\">{{ visits?.user?.first_name }} {{ visits?.user?.last_name }}</a></span>\n <span *ngIf=\"!visits?.user\">{{ visits?.user_id }}</span>\n </span>\n </td>\n <td data-head=\"Started At\">{{ visits.started_at | dateFormat : 'datetime' }}</td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\" data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\">\n </pw-no-data>\n </div>\n <span *ngIf=\"data.object_count !== 0\" class=\"total-records-count\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n </div>\n</div>\n<div *ngIf=\"!loading && data.unfiltered_count === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Ahoy.NoVistitsDataMessage' | transloco\"> </pw-no-data>\n</div>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.table-responsive td,.table-responsive th{font-size:11px!important}\n"], dependencies: [{ kind: "component", type: i2.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.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i3.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "size", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "fluid", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i6.MultiSelect, selector: "p-multiSelect, p-multiselect, p-multi-select", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "fluid", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "chipIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "size", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus", "highlightOnSelect"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["variant", "fluid", "pSize"] }, { kind: "component", type: i8.Calendar, selector: "p-calendar", inputs: ["iconDisplay", "style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "fluid", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "variant", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "directive", type: i2$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i10.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i11.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i16.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i16.TextTruncatePipe, name: "textTruncate" }] }); }
|
|
9029
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: AhoyVisitsComponent, isStandalone: false, selector: "pw-ahoy-visits", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12 d-flex justify-content-between align-items-center\">\n <h2 class=\"card-title p-0 float-start\">Ahoy Visits</h2>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container mt-0\" [class.hideTable]=\"data.unfiltered_count === 0\">\n <div class=\"user-management-table table-responsive\">\n <p-table #dt\n [value]=\"data.visits\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [sortField]=\"'started_at'\"\n [sortOrder]=\"-1\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\">\n <ng-template pTemplate=\"caption\">\n <div class=\"row\">\n <div *rbacAllow=\"'SuperAdmin'\"\n class=\"col-sm-2 mb-2 mb-md-0\">\n <p-select\n [options]=\"microServices\"\n (onChange)=\"onServiceChange($event.value)\"\n [placeholder]=\"'Select Service'\"\n optionLabel=\"name\"\n optionValue=\"name\">\n </p-select>\n </div>\n <div class=\"col-sm-2\">\n <p-multiSelect inputId=\"ahoy-visits-filter-users\"\n #multiSelector [options]=\"searchOptions\"\n (onChange)=\"onSearchOptionChange($event)\"\n placeholder=\"Filter by users\"\n [(ngModel)]=\"filterSource\"\n [showToggleAll]=\"true\"\n [showHeader]=\"true\"\n appendTo=\"body\"\n [lazy]=\"true\"\n (scroll)=\"onScroll($event)\"\n (onPanelShow)=\"onPanelShow()\"\n [loading]=\"userLoading\"\n (onFilter)=\"handleFilter($event)\"\n >\n </p-multiSelect>\n </div>\n <div class=\"col-sm-2\">\n <p-calendar [showTime]=\"true\"\n [appendTo]=\"'body'\"\n (onSelect)=\"onDateSelection()\"\n [placeholder]=\"'Start Date'\"\n [(ngModel)]=\"startDate\"\n [showIcon]=\"true\"\n dateFormat=\"yy-M-dd\"\n >\n </p-calendar>\n </div>\n <div class=\"col-sm-2\">\n <p-calendar [appendTo]=\"'body'\"\n [showTime]=\"true\"\n (onSelect)=\"onDateSelection()\"\n [placeholder]=\"'End Date'\"\n [(ngModel)]=\"endDate\"\n [showIcon]=\"true\"\n dateFormat=\"yy-M-dd\">\n </p-calendar>\n </div>\n <div class=\"col d-flex align-items-center\">\n <label for=\"ahoy-visits-search\" class=\"visually-hidden\">Search Visits</label>\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n id=\"ahoy-visits-search\"\n name=\"ahoy-visits-search\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search Visits...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90 form-control bg-white\" />\n </div>\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"browser\">\n {{ 'Admin.Tracking.Browser' | transloco }}\n <p-sortIcon field=\"browser\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"device_type\">\n {{ 'Admin.Tracking.DeviceType' | transloco }}\n <p-sortIcon field=\"device_type\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"ip\">\n {{ 'Admin.Tracking.Ip' | transloco }}\n <p-sortIcon field=\"ip\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"referring_domain\">\n {{ 'Admin.Tracking.Domain' | transloco }}\n <p-sortIcon field=\"ip\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"landing_page\">\n {{ 'Admin.Tracking.LandingPage' | transloco }}\n <p-sortIcon field=\"ip\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"country\">\n {{ 'Admin.Tracking.Country' | transloco }}\n <p-sortIcon field=\"ip\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"region\">\n {{ 'Admin.Tracking.Region' | transloco }}\n <p-sortIcon field=\"ip\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"city\">\n {{ 'Admin.Tracking.City' | transloco }}\n <p-sortIcon field=\"ip\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"os\">\n {{ 'Admin.Tracking.Os' | transloco }}\n <p-sortIcon field=\"os\"></p-sortIcon>\n </th>\n <th scope=\"true\">\n {{ 'Admin.Tracking.User' | transloco }}\n </th>\n <th scope=\"true\"\n pSortableColumn=\"started_at\">\n {{ 'Admin.Tracking.StartedAt' | transloco }}\n <p-sortIcon field=\"started_at\"></p-sortIcon>\n </th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-visits>\n <tr [class.d-none]=\"loading\">\n <td data-head=\"Browser\">{{ visits.browser }}</td>\n <td data-head=\"Device Type\">{{ visits.device_type }}</td>\n <td data-head=\"IP\">{{ visits.ip }}</td>\n <td data-head=\"referring_domain\">\n <span [ngbTooltip]=\"visits.referring_domain\"\n tooltipClass=\"custom-tooltip\"\n placement=\"top\" container=\"body\"> {{ visits.referring_domain | textTruncate: 20 }}\n </span>\n </td>\n <td data-head=\"landing_page\">\n <span [ngbTooltip]=\"visits.landing_page\"\n tooltipClass=\"custom-tooltip\"\n placement=\"top\" container=\"body\"> {{ visits.landing_page | textTruncate: 20 }}\n </span>\n </td>\n <td data-head=\"country\">\n <span [ngbTooltip]=\"visits.country\"\n tooltipClass=\"custom-tooltip\"\n placement=\"top\" container=\"body\"> {{ visits.country | textTruncate: 20 }}\n </span>\n </td>\n <td data-head=\"region\">\n <span [ngbTooltip]=\"visits.region\"\n tooltipClass=\"custom-tooltip\"\n placement=\"top\" container=\"body\"> {{ visits.region | textTruncate: 20 }}\n </span>\n </td>\n <td data-head=\"city\">\n <span [ngbTooltip]=\"visits.city\"\n tooltipClass=\"custom-tooltip\"\n placement=\"top\" container=\"body\"> {{ visits.city | textTruncate: 20 }}\n </span></td>\n <td data-head=\"OS\">{{ visits.os }}</td>\n <td data-head=\"User\">\n <span *ngIf=\"visits?.user_id\">\n <span *ngIf=\"visits?.user\"><a [routerLink]=\"['/members', visits?.user?.slug]\">{{ visits?.user?.first_name }} {{ visits?.user?.last_name }}</a></span>\n <span *ngIf=\"!visits?.user\">{{ visits?.user_id }}</span>\n </span>\n </td>\n <td data-head=\"Started At\">{{ visits.started_at | dateFormat : 'datetime' }}</td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\" data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\">\n </pw-no-data>\n </div>\n <span *ngIf=\"data.object_count !== 0\" class=\"total-records-count\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n </div>\n</div>\n<div *ngIf=\"!loading && data.unfiltered_count === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Ahoy.NoVistitsDataMessage' | transloco\"> </pw-no-data>\n</div>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.table-responsive td,.table-responsive th{font-size:11px!important}\n"], dependencies: [{ kind: "component", type: i2.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.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i3.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "size", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "fluid", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i6.MultiSelect, selector: "p-multiSelect, p-multiselect, p-multi-select", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "fluid", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "chipIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "size", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus", "highlightOnSelect"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["variant", "fluid", "pSize"] }, { kind: "component", type: i8.Calendar, selector: "p-calendar", inputs: ["iconDisplay", "style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "fluid", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "startWeekFromFirstDayOfYear", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autofocus", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "variant", "minDate", "maxDate", "disabledDates", "disabledDays", "yearRange", "showTime", "responsiveOptions", "numberOfMonths", "firstDayOfWeek", "locale", "view", "defaultDate"], outputs: ["onFocus", "onBlur", "onClose", "onSelect", "onClear", "onInput", "onTodayClick", "onClearClick", "onMonthChange", "onYearChange", "onClickOutside", "onShow"] }, { kind: "directive", type: i2$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i10.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i11.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i16.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i16.TextTruncatePipe, name: "textTruncate" }] }); }
|
|
9030
9030
|
}
|
|
9031
9031
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: AhoyVisitsComponent, decorators: [{
|
|
9032
9032
|
type: Component,
|
|
9033
|
-
args: [{ selector: 'pw-ahoy-visits', standalone: false, template: "<div class=\"row\">\n <div class=\"col-12 d-flex justify-content-between align-items-center\">\n <h2 class=\"card-title p-0 float-start\">Ahoy Visits</h2>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container mt-0\" [class.hideTable]=\"data.unfiltered_count === 0\">\n <div class=\"user-management-table table-responsive\">\n <p-table #dt\n [value]=\"data.visits\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [sortField]=\"'started_at'\"\n [sortOrder]=\"-1\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\">\n <ng-template pTemplate=\"caption\">\n <div class=\"row\">\n <div *rbacAllow=\"'SuperAdmin'\"\n class=\"col-sm-2 mb-2 mb-md-0\">\n <p-select\n [options]=\"microServices\"\n (onChange)=\"onServiceChange($event.value)\"\n [placeholder]=\"'Select Service'\"\n optionLabel=\"name\"\n optionValue=\"name\">\n </p-select>\n </div>\n <div class=\"col-sm-2\">\n <p-multiSelect #multiSelector [options]=\"searchOptions\"\n (onChange)=\"onSearchOptionChange($event)\"\n placeholder=\"Filter by users\"\n [(ngModel)]=\"filterSource\"\n [showToggleAll]=\"true\"\n [showHeader]=\"true\"\n appendTo=\"body\"\n [lazy]=\"true\"\n (scroll)=\"onScroll($event)\"\n (onPanelShow)=\"onPanelShow()\"\n [loading]=\"userLoading\"\n (onFilter)=\"handleFilter($event)\"\n >\n </p-multiSelect>\n </div>\n <div class=\"col-sm-2\">\n <p-calendar [showTime]=\"true\"\n [appendTo]=\"'body'\"\n (onSelect)=\"onDateSelection()\"\n [placeholder]=\"'Start Date'\"\n [(ngModel)]=\"startDate\"\n [showIcon]=\"true\"\n dateFormat=\"yy-M-dd\"\n >\n </p-calendar>\n </div>\n <div class=\"col-sm-2\">\n <p-calendar [appendTo]=\"'body'\"\n [showTime]=\"true\"\n (onSelect)=\"onDateSelection()\"\n [placeholder]=\"'End Date'\"\n [(ngModel)]=\"endDate\"\n [showIcon]=\"true\"\n dateFormat=\"yy-M-dd\">\n </p-calendar>\n </div>\n <div class=\"col d-flex align-items-center\">\n <label for=\"ahoy-visits-search\" class=\"visually-hidden\">Search Visits</label>\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n id=\"ahoy-visits-search\"\n name=\"ahoy-visits-search\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search Visits...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90 form-control bg-white\" />\n </div>\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"browser\">\n {{ 'Admin.Tracking.Browser' | transloco }}\n <p-sortIcon field=\"browser\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"device_type\">\n {{ 'Admin.Tracking.DeviceType' | transloco }}\n <p-sortIcon field=\"device_type\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"ip\">\n {{ 'Admin.Tracking.Ip' | transloco }}\n <p-sortIcon field=\"ip\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"referring_domain\">\n {{ 'Admin.Tracking.Domain' | transloco }}\n <p-sortIcon field=\"ip\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"landing_page\">\n {{ 'Admin.Tracking.LandingPage' | transloco }}\n <p-sortIcon field=\"ip\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"country\">\n {{ 'Admin.Tracking.Country' | transloco }}\n <p-sortIcon field=\"ip\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"region\">\n {{ 'Admin.Tracking.Region' | transloco }}\n <p-sortIcon field=\"ip\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"city\">\n {{ 'Admin.Tracking.City' | transloco }}\n <p-sortIcon field=\"ip\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"os\">\n {{ 'Admin.Tracking.Os' | transloco }}\n <p-sortIcon field=\"os\"></p-sortIcon>\n </th>\n <th scope=\"true\">\n {{ 'Admin.Tracking.User' | transloco }}\n </th>\n <th scope=\"true\"\n pSortableColumn=\"started_at\">\n {{ 'Admin.Tracking.StartedAt' | transloco }}\n <p-sortIcon field=\"started_at\"></p-sortIcon>\n </th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-visits>\n <tr [class.d-none]=\"loading\">\n <td data-head=\"Browser\">{{ visits.browser }}</td>\n <td data-head=\"Device Type\">{{ visits.device_type }}</td>\n <td data-head=\"IP\">{{ visits.ip }}</td>\n <td data-head=\"referring_domain\">\n <span [ngbTooltip]=\"visits.referring_domain\"\n tooltipClass=\"custom-tooltip\"\n placement=\"top\" container=\"body\"> {{ visits.referring_domain | textTruncate: 20 }}\n </span>\n </td>\n <td data-head=\"landing_page\">\n <span [ngbTooltip]=\"visits.landing_page\"\n tooltipClass=\"custom-tooltip\"\n placement=\"top\" container=\"body\"> {{ visits.landing_page | textTruncate: 20 }}\n </span>\n </td>\n <td data-head=\"country\">\n <span [ngbTooltip]=\"visits.country\"\n tooltipClass=\"custom-tooltip\"\n placement=\"top\" container=\"body\"> {{ visits.country | textTruncate: 20 }}\n </span>\n </td>\n <td data-head=\"region\">\n <span [ngbTooltip]=\"visits.region\"\n tooltipClass=\"custom-tooltip\"\n placement=\"top\" container=\"body\"> {{ visits.region | textTruncate: 20 }}\n </span>\n </td>\n <td data-head=\"city\">\n <span [ngbTooltip]=\"visits.city\"\n tooltipClass=\"custom-tooltip\"\n placement=\"top\" container=\"body\"> {{ visits.city | textTruncate: 20 }}\n </span></td>\n <td data-head=\"OS\">{{ visits.os }}</td>\n <td data-head=\"User\">\n <span *ngIf=\"visits?.user_id\">\n <span *ngIf=\"visits?.user\"><a [routerLink]=\"['/members', visits?.user?.slug]\">{{ visits?.user?.first_name }} {{ visits?.user?.last_name }}</a></span>\n <span *ngIf=\"!visits?.user\">{{ visits?.user_id }}</span>\n </span>\n </td>\n <td data-head=\"Started At\">{{ visits.started_at | dateFormat : 'datetime' }}</td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\" data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\">\n </pw-no-data>\n </div>\n <span *ngIf=\"data.object_count !== 0\" class=\"total-records-count\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n </div>\n</div>\n<div *ngIf=\"!loading && data.unfiltered_count === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Ahoy.NoVistitsDataMessage' | transloco\"> </pw-no-data>\n</div>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.table-responsive td,.table-responsive th{font-size:11px!important}\n"] }]
|
|
9033
|
+
args: [{ selector: 'pw-ahoy-visits', standalone: false, template: "<div class=\"row\">\n <div class=\"col-12 d-flex justify-content-between align-items-center\">\n <h2 class=\"card-title p-0 float-start\">Ahoy Visits</h2>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container mt-0\" [class.hideTable]=\"data.unfiltered_count === 0\">\n <div class=\"user-management-table table-responsive\">\n <p-table #dt\n [value]=\"data.visits\"\n [paginator]=\"data.object_count !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"data.object_count\"\n [loading]=\"loading\"\n [sortField]=\"'started_at'\"\n [sortOrder]=\"-1\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\">\n <ng-template pTemplate=\"caption\">\n <div class=\"row\">\n <div *rbacAllow=\"'SuperAdmin'\"\n class=\"col-sm-2 mb-2 mb-md-0\">\n <p-select\n [options]=\"microServices\"\n (onChange)=\"onServiceChange($event.value)\"\n [placeholder]=\"'Select Service'\"\n optionLabel=\"name\"\n optionValue=\"name\">\n </p-select>\n </div>\n <div class=\"col-sm-2\">\n <p-multiSelect inputId=\"ahoy-visits-filter-users\"\n #multiSelector [options]=\"searchOptions\"\n (onChange)=\"onSearchOptionChange($event)\"\n placeholder=\"Filter by users\"\n [(ngModel)]=\"filterSource\"\n [showToggleAll]=\"true\"\n [showHeader]=\"true\"\n appendTo=\"body\"\n [lazy]=\"true\"\n (scroll)=\"onScroll($event)\"\n (onPanelShow)=\"onPanelShow()\"\n [loading]=\"userLoading\"\n (onFilter)=\"handleFilter($event)\"\n >\n </p-multiSelect>\n </div>\n <div class=\"col-sm-2\">\n <p-calendar [showTime]=\"true\"\n [appendTo]=\"'body'\"\n (onSelect)=\"onDateSelection()\"\n [placeholder]=\"'Start Date'\"\n [(ngModel)]=\"startDate\"\n [showIcon]=\"true\"\n dateFormat=\"yy-M-dd\"\n >\n </p-calendar>\n </div>\n <div class=\"col-sm-2\">\n <p-calendar [appendTo]=\"'body'\"\n [showTime]=\"true\"\n (onSelect)=\"onDateSelection()\"\n [placeholder]=\"'End Date'\"\n [(ngModel)]=\"endDate\"\n [showIcon]=\"true\"\n dateFormat=\"yy-M-dd\">\n </p-calendar>\n </div>\n <div class=\"col d-flex align-items-center\">\n <label for=\"ahoy-visits-search\" class=\"visually-hidden\">Search Visits</label>\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n id=\"ahoy-visits-search\"\n name=\"ahoy-visits-search\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search Visits...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n class=\"mw-90 form-control bg-white\" />\n </div>\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\"\n pSortableColumn=\"browser\">\n {{ 'Admin.Tracking.Browser' | transloco }}\n <p-sortIcon field=\"browser\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"device_type\">\n {{ 'Admin.Tracking.DeviceType' | transloco }}\n <p-sortIcon field=\"device_type\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"ip\">\n {{ 'Admin.Tracking.Ip' | transloco }}\n <p-sortIcon field=\"ip\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"referring_domain\">\n {{ 'Admin.Tracking.Domain' | transloco }}\n <p-sortIcon field=\"ip\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"landing_page\">\n {{ 'Admin.Tracking.LandingPage' | transloco }}\n <p-sortIcon field=\"ip\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"country\">\n {{ 'Admin.Tracking.Country' | transloco }}\n <p-sortIcon field=\"ip\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"region\">\n {{ 'Admin.Tracking.Region' | transloco }}\n <p-sortIcon field=\"ip\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"city\">\n {{ 'Admin.Tracking.City' | transloco }}\n <p-sortIcon field=\"ip\"></p-sortIcon>\n </th>\n <th scope=\"true\"\n pSortableColumn=\"os\">\n {{ 'Admin.Tracking.Os' | transloco }}\n <p-sortIcon field=\"os\"></p-sortIcon>\n </th>\n <th scope=\"true\">\n {{ 'Admin.Tracking.User' | transloco }}\n </th>\n <th scope=\"true\"\n pSortableColumn=\"started_at\">\n {{ 'Admin.Tracking.StartedAt' | transloco }}\n <p-sortIcon field=\"started_at\"></p-sortIcon>\n </th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-visits>\n <tr [class.d-none]=\"loading\">\n <td data-head=\"Browser\">{{ visits.browser }}</td>\n <td data-head=\"Device Type\">{{ visits.device_type }}</td>\n <td data-head=\"IP\">{{ visits.ip }}</td>\n <td data-head=\"referring_domain\">\n <span [ngbTooltip]=\"visits.referring_domain\"\n tooltipClass=\"custom-tooltip\"\n placement=\"top\" container=\"body\"> {{ visits.referring_domain | textTruncate: 20 }}\n </span>\n </td>\n <td data-head=\"landing_page\">\n <span [ngbTooltip]=\"visits.landing_page\"\n tooltipClass=\"custom-tooltip\"\n placement=\"top\" container=\"body\"> {{ visits.landing_page | textTruncate: 20 }}\n </span>\n </td>\n <td data-head=\"country\">\n <span [ngbTooltip]=\"visits.country\"\n tooltipClass=\"custom-tooltip\"\n placement=\"top\" container=\"body\"> {{ visits.country | textTruncate: 20 }}\n </span>\n </td>\n <td data-head=\"region\">\n <span [ngbTooltip]=\"visits.region\"\n tooltipClass=\"custom-tooltip\"\n placement=\"top\" container=\"body\"> {{ visits.region | textTruncate: 20 }}\n </span>\n </td>\n <td data-head=\"city\">\n <span [ngbTooltip]=\"visits.city\"\n tooltipClass=\"custom-tooltip\"\n placement=\"top\" container=\"body\"> {{ visits.city | textTruncate: 20 }}\n </span></td>\n <td data-head=\"OS\">{{ visits.os }}</td>\n <td data-head=\"User\">\n <span *ngIf=\"visits?.user_id\">\n <span *ngIf=\"visits?.user\"><a [routerLink]=\"['/members', visits?.user?.slug]\">{{ visits?.user?.first_name }} {{ visits?.user?.last_name }}</a></span>\n <span *ngIf=\"!visits?.user\">{{ visits?.user_id }}</span>\n </span>\n </td>\n <td data-head=\"Started At\">{{ visits.started_at | dateFormat : 'datetime' }}</td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\" data.object_count === 0 && data.unfiltered_count !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\">\n </pw-no-data>\n </div>\n <span *ngIf=\"data.object_count !== 0\" class=\"total-records-count\">{{ 'Label.Total' | transloco }}: {{ data.object_count }}</span>\n </div>\n</div>\n<div *ngIf=\"!loading && data.unfiltered_count === 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Ahoy.NoVistitsDataMessage' | transloco\"> </pw-no-data>\n</div>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.table-responsive td,.table-responsive th{font-size:11px!important}\n"] }]
|
|
9034
9034
|
}], ctorParameters: () => [{ type: i0.Injector }, { type: i1$2.AhoyService }, { type: i1.AdminDataService }, { type: i0.ChangeDetectorRef }] });
|
|
9035
9035
|
|
|
9036
9036
|
class EventsComponent extends AppBaseComponent {
|