@openziti/ziti-console-lib 0.12.8 → 0.12.10
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.
- package/assets/components/tabIdentities.html +0 -1
- package/assets/components/tabServices.html +1 -0
- package/assets/fonts/icomoon.eot +0 -0
- package/assets/fonts/icomoon.svg +3 -0
- package/assets/fonts/icomoon.ttf +0 -0
- package/assets/fonts/icomoon.woff +0 -0
- package/assets/fonts/icomoon.woff2 +0 -0
- package/assets/styles/global.scss +102 -0
- package/assets/styles/icons.css +4 -1
- package/esm2022/lib/features/card-list/card-list.component.mjs +6 -3
- package/esm2022/lib/features/creation-summary-dialog/creation-summary-dialog.component.mjs +5 -3
- package/esm2022/lib/features/custom-tags/custom-tags.component.mjs +56 -24
- package/esm2022/lib/features/data-table/cells/table-cell-select/table-cell-select.component.mjs +18 -5
- package/esm2022/lib/features/data-table/data-table.component.mjs +5 -3
- package/esm2022/lib/features/multi-action-button/multi-action-button.component.mjs +3 -3
- package/esm2022/lib/features/preview-list/preview-list.component.mjs +13 -3
- package/esm2022/lib/features/preview-selections/preview-selections.component.mjs +1 -1
- package/esm2022/lib/features/projectable-forms/api-session/api-session-form.component.mjs +1 -1
- package/esm2022/lib/features/projectable-forms/auth-policy/auth-policy-form.component.mjs +1 -1
- package/esm2022/lib/features/projectable-forms/certificate-authority/certificate-authority-form.component.mjs +1 -1
- package/esm2022/lib/features/projectable-forms/certificate-authority/verify-certificate/verify-certificate.component.mjs +1 -1
- package/esm2022/lib/features/projectable-forms/config-type/config-type-form.component.mjs +1 -1
- package/esm2022/lib/features/projectable-forms/configuration/configuration-form.component.mjs +1 -1
- package/esm2022/lib/features/projectable-forms/edge-router/edge-router-form.component.mjs +1 -1
- package/esm2022/lib/features/projectable-forms/edge-router-policy/edge-router-policy-form.component.mjs +1 -1
- package/esm2022/lib/features/projectable-forms/edge-router-policy/edge-router-policy-form.service.mjs +3 -1
- package/esm2022/lib/features/projectable-forms/form-header/form-header.component.mjs +25 -4
- package/esm2022/lib/features/projectable-forms/identity/identity-form.component.mjs +120 -23
- package/esm2022/lib/features/projectable-forms/jwt-signer/jwt-signer-form.component.mjs +1 -1
- package/esm2022/lib/features/projectable-forms/posture-check/posture-check-form.component.mjs +1 -1
- package/esm2022/lib/features/projectable-forms/projectable-form.class.mjs +4 -1
- package/esm2022/lib/features/projectable-forms/service/service-form.component.mjs +17 -4
- package/esm2022/lib/features/projectable-forms/service/service-form.service.mjs +51 -12
- package/esm2022/lib/features/projectable-forms/service/simple-service/simple-service.component.mjs +316 -112
- package/esm2022/lib/features/projectable-forms/service-edge-router-policy/service-edge-router-policy-form.component.mjs +1 -1
- package/esm2022/lib/features/projectable-forms/service-edge-router-policy/service-edge-router-policy-form.service.mjs +3 -1
- package/esm2022/lib/features/projectable-forms/service-policy/service-policy-form.component.mjs +1 -1
- package/esm2022/lib/features/projectable-forms/service-policy/service-policy-form.service.mjs +4 -2
- package/esm2022/lib/features/projectable-forms/session/session-form.component.mjs +3 -3
- package/esm2022/lib/features/projectable-forms/terminator/terminator-form.component.mjs +1 -1
- package/esm2022/lib/features/projectable-forms/transit-router/transit-router-form.component.mjs +1 -1
- package/esm2022/lib/features/reset-enrollment/reset-enrollment.component.mjs +3 -3
- package/esm2022/lib/pages/edge-router-policies/edge-router-policies-page.component.mjs +6 -1
- package/esm2022/lib/pages/identities/identities-page.component.mjs +3 -9
- package/esm2022/lib/pages/identities/identities-page.service.mjs +50 -1
- package/esm2022/lib/pages/services/services-page.component.mjs +2 -13
- package/esm2022/lib/pages/services/services-page.service.mjs +35 -2
- package/esm2022/lib/pages/terminators/terminators-page.component.mjs +7 -5
- package/esm2022/lib/services/ziti-controller-data.service.mjs +4 -4
- package/esm2022/lib/services/ziti-data.service.mjs +1 -1
- package/esm2022/lib/shared/list-page-component.class.mjs +4 -1
- package/esm2022/lib/shared/list-page-service.class.mjs +5 -2
- package/esm2022/lib/urls.mjs +34 -0
- package/esm2022/lib/version.mjs +2 -2
- package/fesm2022/openziti-ziti-console-lib.mjs +780 -236
- package/fesm2022/openziti-ziti-console-lib.mjs.map +1 -1
- package/lib/features/card-list/card-list.component.d.ts +1 -0
- package/lib/features/card-list/card-list.component.d.ts.map +1 -1
- package/lib/features/creation-summary-dialog/creation-summary-dialog.component.d.ts +1 -0
- package/lib/features/creation-summary-dialog/creation-summary-dialog.component.d.ts.map +1 -1
- package/lib/features/custom-tags/custom-tags.component.d.ts +19 -3
- package/lib/features/custom-tags/custom-tags.component.d.ts.map +1 -1
- package/lib/features/data-table/cells/table-cell-select/table-cell-select.component.d.ts +2 -6
- package/lib/features/data-table/cells/table-cell-select/table-cell-select.component.d.ts.map +1 -1
- package/lib/features/data-table/data-table.component.d.ts +1 -0
- package/lib/features/data-table/data-table.component.d.ts.map +1 -1
- package/lib/features/preview-list/preview-list.component.d.ts +3 -1
- package/lib/features/preview-list/preview-list.component.d.ts.map +1 -1
- package/lib/features/projectable-forms/edge-router-policy/edge-router-policy-form.service.d.ts.map +1 -1
- package/lib/features/projectable-forms/form-header/form-header.component.d.ts +14 -3
- package/lib/features/projectable-forms/form-header/form-header.component.d.ts.map +1 -1
- package/lib/features/projectable-forms/identity/identity-form.component.d.ts +14 -1
- package/lib/features/projectable-forms/identity/identity-form.component.d.ts.map +1 -1
- package/lib/features/projectable-forms/projectable-form.class.d.ts +1 -0
- package/lib/features/projectable-forms/projectable-form.class.d.ts.map +1 -1
- package/lib/features/projectable-forms/service/service-form.component.d.ts +1 -0
- package/lib/features/projectable-forms/service/service-form.component.d.ts.map +1 -1
- package/lib/features/projectable-forms/service/service-form.service.d.ts +9 -3
- package/lib/features/projectable-forms/service/service-form.service.d.ts.map +1 -1
- package/lib/features/projectable-forms/service/simple-service/simple-service.component.d.ts +25 -6
- package/lib/features/projectable-forms/service/simple-service/simple-service.component.d.ts.map +1 -1
- package/lib/features/projectable-forms/service-edge-router-policy/service-edge-router-policy-form.service.d.ts.map +1 -1
- package/lib/features/projectable-forms/service-policy/service-policy-form.service.d.ts.map +1 -1
- package/lib/pages/edge-router-policies/edge-router-policies-page.component.d.ts.map +1 -1
- package/lib/pages/identities/identities-page.component.d.ts +0 -2
- package/lib/pages/identities/identities-page.component.d.ts.map +1 -1
- package/lib/pages/identities/identities-page.service.d.ts +3 -0
- package/lib/pages/identities/identities-page.service.d.ts.map +1 -1
- package/lib/pages/services/services-page.component.d.ts +0 -3
- package/lib/pages/services/services-page.component.d.ts.map +1 -1
- package/lib/pages/services/services-page.service.d.ts +2 -0
- package/lib/pages/services/services-page.service.d.ts.map +1 -1
- package/lib/services/ziti-controller-data.service.d.ts +1 -1
- package/lib/services/ziti-controller-data.service.d.ts.map +1 -1
- package/lib/services/ziti-data.service.d.ts +1 -1
- package/lib/services/ziti-data.service.d.ts.map +1 -1
- package/lib/shared/list-page-component.class.d.ts.map +1 -1
- package/lib/shared/list-page-service.class.d.ts.map +1 -1
- package/lib/urls.d.ts +34 -0
- package/lib/urls.d.ts.map +1 -0
- package/package.json +1 -1
|
@@ -4,7 +4,7 @@ import * as i4 from '@angular/router';
|
|
|
4
4
|
import { NavigationEnd, RouterModule } from '@angular/router';
|
|
5
5
|
import { Subject, BehaviorSubject, firstValueFrom, tap, map, Subscription } from 'rxjs';
|
|
6
6
|
import { catchError } from 'rxjs/operators';
|
|
7
|
-
import _, { isEmpty, isNumber, includes, isNil, defer, cloneDeep, set, invoke, get, debounce, isNaN as isNaN$1, forEach, isString, isFunction, unset, isBoolean, keys, isEqual, isObject, isArray, forOwn, invert, some, filter, sortBy, sortedUniq,
|
|
7
|
+
import _, { isEmpty, isNumber, includes, isNil, defer, cloneDeep, set, invoke, get, debounce, isNaN as isNaN$1, forEach, isString, isFunction, unset, isBoolean, keys, isEqual, isObject, isArray, forOwn, invert, map as map$1, some, filter, sortBy, sortedUniq, has, trim, delay } from 'lodash';
|
|
8
8
|
import * as i1$1 from '@angular/common/http';
|
|
9
9
|
import { HttpClient, HttpParams, HttpClientModule, HttpHeaders } from '@angular/common/http';
|
|
10
10
|
import * as i1 from 'ngx-logger';
|
|
@@ -3323,7 +3323,10 @@ let ListPageServiceClass = class ListPageServiceClass {
|
|
|
3323
3323
|
const prom = this.dataService.delete(this.resourceType, id);
|
|
3324
3324
|
promises.push(prom);
|
|
3325
3325
|
});
|
|
3326
|
-
return Promise.all(promises)
|
|
3326
|
+
return Promise.all(promises).catch((response) => {
|
|
3327
|
+
const message = this.dataService.getErrorMessage(response);
|
|
3328
|
+
throw message;
|
|
3329
|
+
});
|
|
3327
3330
|
}
|
|
3328
3331
|
sort(sortBy, ordering = 'asc') {
|
|
3329
3332
|
this.currentSort = { sortBy, ordering };
|
|
@@ -3492,6 +3495,9 @@ class ListPageComponent {
|
|
|
3492
3495
|
if (result?.confirmed) {
|
|
3493
3496
|
this.svc.removeItems(selectedIds).then(() => {
|
|
3494
3497
|
this.refreshData(this.svc.currentSort);
|
|
3498
|
+
}).catch((errorMessage) => {
|
|
3499
|
+
const growlerData = new GrowlerModel('error', 'Error', `Delete Failed`, `Failed to delete item(s): ${errorMessage}`);
|
|
3500
|
+
this.growlerSvc.show(growlerData);
|
|
3495
3501
|
});
|
|
3496
3502
|
}
|
|
3497
3503
|
});
|
|
@@ -5222,7 +5228,8 @@ class TableCellSelectComponent {
|
|
|
5222
5228
|
this.disableToggle =
|
|
5223
5229
|
_.get(this.item, 'typeId') === 'Router' ||
|
|
5224
5230
|
_.get(this.item, 'exclusiveTo') ||
|
|
5225
|
-
_.get(this.item, 'reserved') === true
|
|
5231
|
+
_.get(this.item, 'reserved') === true ||
|
|
5232
|
+
_.get(this.item, 'isSystem') === true;
|
|
5226
5233
|
}
|
|
5227
5234
|
refresh(params) {
|
|
5228
5235
|
this.cellParams = params;
|
|
@@ -5230,7 +5237,8 @@ class TableCellSelectComponent {
|
|
|
5230
5237
|
this.disableToggle =
|
|
5231
5238
|
_.get(this.item, 'typeId') === 'Router' ||
|
|
5232
5239
|
_.get(this.item, 'exclusiveTo') ||
|
|
5233
|
-
_.get(this.item, 'reserved') === true
|
|
5240
|
+
_.get(this.item, 'reserved') === true ||
|
|
5241
|
+
_.get(this.item, 'isSystem') === true;
|
|
5234
5242
|
return true;
|
|
5235
5243
|
}
|
|
5236
5244
|
toggle(item) {
|
|
@@ -5239,12 +5247,22 @@ class TableCellSelectComponent {
|
|
|
5239
5247
|
}
|
|
5240
5248
|
this.cellParams.toggleItem(item, this.cellParams);
|
|
5241
5249
|
}
|
|
5250
|
+
get tooltip() {
|
|
5251
|
+
let tooltip = '';
|
|
5252
|
+
if (this.item?.isSystem) {
|
|
5253
|
+
tooltip = 'Deleting "system" entities is not allowed';
|
|
5254
|
+
}
|
|
5255
|
+
else if (this.item?.typeId === 'Router') {
|
|
5256
|
+
tooltip = 'Unable to delete "Router" Identities. Please delete the associated Router instead.';
|
|
5257
|
+
}
|
|
5258
|
+
return tooltip;
|
|
5259
|
+
}
|
|
5242
5260
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TableCellSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5243
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TableCellSelectComponent, selector: "app-table-cell-select", ngImport: i0, template: "<div\n #toggleButton\n (click)=\"toggle(item)\"\n *ngIf=\"!item.hideSelect\"\n [ngClass]=\"{ selected: item.selected, disabled: disableToggle }\"\n attr.name=\"RowSelect0_{{ item.name }}\"\n class=\"row-toggle tSelect\"\n id=\"RowSelect0_{{ item.id }}\"\n attr.data-id=\"{{item.id}}\"\n></div>\n", styles: [".row-toggle.tSelect{width:1.5625rem;height:1.5625rem;border:.1rem var(--stroke) solid;border-radius:.9375rem;cursor:pointer;
|
|
5261
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TableCellSelectComponent, selector: "app-table-cell-select", ngImport: i0, template: "<div\n #toggleButton\n (click)=\"toggle(item)\"\n *ngIf=\"!item.hideSelect\"\n [ngClass]=\"{ selected: item.selected, disabled: disableToggle }\"\n attr.name=\"RowSelect0_{{ item.name }}\"\n class=\"row-toggle tSelect\"\n id=\"RowSelect0_{{ item.id }}\"\n attr.data-id=\"{{item.id}}\"\n [matTooltip]=\"tooltip\"\n></div>\n", styles: [".row-toggle.tSelect{width:1.5625rem;height:1.5625rem;border:.1rem var(--stroke) solid;border-radius:.9375rem;cursor:pointer;position:absolute;top:.8125rem;left:.625rem;background-color:var(--navigation)}.row-toggle.tSelect:hover{border:.125rem var(--placeholder) solid;background-color:var(--background)}.row-toggle.tSelect.selected{background-color:var(--green);background-size:45%;background-position:center center;border:none;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAYCAYAAAD+vg1LAAABdElEQVRIia3UPWsUURSH8f9GRRvtFKtIgoKggo2CYO0XsLKzsbARbNKJYGPndxEEO8VGRRvBF6xFBAkplPiyb/lZzAx7d9jE3ewcmOLOPTyc85x7bw/pKI4keZ7kUpIHQVffIwxU0e91VPHlJK+T9Or19y7Ah5N8TLJeg3eSXO9CwcNCwQCPkWWhFzE2iZ84viz4ED4X4DFuNPvLgO8XCoZ4Wu7vF3oeo0LBL5xcFnwA7wsFI9xs5+0HvFG33ih4NitvUejZAgp/sLoseAVvC7dD3NotfxHw3ZaCl+jtBT6qOn+n94CuoV8o+Fv/27WQ4E3dXh9XZyT18Kql4M7/OozJsdnBb1xoJd0uFIxqzyvzgJ+Y3KAxtrBeJ6yqJt/EEGfmmUlwDB9aVX3FCbwwPbCNeaANOKoX6UvL41axHuOd6tYtBA5OYdP0a9XECOfmhbbBUT0u26pBNjHAvUWgs8DBFdPD/ISDXYCDa/iBb3UXC0GRf9rA4qSLGyBIAAAAAElFTkSuQmCC)}.row-toggle.tSelect.disabled{opacity:.3;cursor:not-allowed;transform:initial!important}.row-toggle.tSelect.disabled:hover{border:.1rem var(--stroke) solid;background-color:var(--navigation)}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }] }); }
|
|
5244
5262
|
}
|
|
5245
5263
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TableCellSelectComponent, decorators: [{
|
|
5246
5264
|
type: Component,
|
|
5247
|
-
args: [{ selector: 'app-table-cell-select', template: "<div\n #toggleButton\n (click)=\"toggle(item)\"\n *ngIf=\"!item.hideSelect\"\n [ngClass]=\"{ selected: item.selected, disabled: disableToggle }\"\n attr.name=\"RowSelect0_{{ item.name }}\"\n class=\"row-toggle tSelect\"\n id=\"RowSelect0_{{ item.id }}\"\n attr.data-id=\"{{item.id}}\"\n></div>\n", styles: [".row-toggle.tSelect{width:1.5625rem;height:1.5625rem;border:.1rem var(--stroke) solid;border-radius:.9375rem;cursor:pointer;
|
|
5265
|
+
args: [{ selector: 'app-table-cell-select', template: "<div\n #toggleButton\n (click)=\"toggle(item)\"\n *ngIf=\"!item.hideSelect\"\n [ngClass]=\"{ selected: item.selected, disabled: disableToggle }\"\n attr.name=\"RowSelect0_{{ item.name }}\"\n class=\"row-toggle tSelect\"\n id=\"RowSelect0_{{ item.id }}\"\n attr.data-id=\"{{item.id}}\"\n [matTooltip]=\"tooltip\"\n></div>\n", styles: [".row-toggle.tSelect{width:1.5625rem;height:1.5625rem;border:.1rem var(--stroke) solid;border-radius:.9375rem;cursor:pointer;position:absolute;top:.8125rem;left:.625rem;background-color:var(--navigation)}.row-toggle.tSelect:hover{border:.125rem var(--placeholder) solid;background-color:var(--background)}.row-toggle.tSelect.selected{background-color:var(--green);background-size:45%;background-position:center center;border:none;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAYCAYAAAD+vg1LAAABdElEQVRIia3UPWsUURSH8f9GRRvtFKtIgoKggo2CYO0XsLKzsbARbNKJYGPndxEEO8VGRRvBF6xFBAkplPiyb/lZzAx7d9jE3ewcmOLOPTyc85x7bw/pKI4keZ7kUpIHQVffIwxU0e91VPHlJK+T9Or19y7Ah5N8TLJeg3eSXO9CwcNCwQCPkWWhFzE2iZ84viz4ED4X4DFuNPvLgO8XCoZ4Wu7vF3oeo0LBL5xcFnwA7wsFI9xs5+0HvFG33ih4NitvUejZAgp/sLoseAVvC7dD3NotfxHw3ZaCl+jtBT6qOn+n94CuoV8o+Fv/27WQ4E3dXh9XZyT18Kql4M7/OozJsdnBb1xoJd0uFIxqzyvzgJ+Y3KAxtrBeJ6yqJt/EEGfmmUlwDB9aVX3FCbwwPbCNeaANOKoX6UvL41axHuOd6tYtBA5OYdP0a9XECOfmhbbBUT0u26pBNjHAvUWgs8DBFdPD/ISDXYCDa/iBb3UXC0GRf9rA4qSLGyBIAAAAAElFTkSuQmCC)}.row-toggle.tSelect.disabled{opacity:.3;cursor:not-allowed;transform:initial!important}.row-toggle.tSelect.disabled:hover{border:.1rem var(--stroke) solid;background-color:var(--navigation)}\n"] }]
|
|
5248
5266
|
}] });
|
|
5249
5267
|
|
|
5250
5268
|
class TableCellMenuComponent {
|
|
@@ -5492,11 +5510,11 @@ class ResetEnrollmentComponent {
|
|
|
5492
5510
|
});
|
|
5493
5511
|
}
|
|
5494
5512
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ResetEnrollmentComponent, deps: [{ token: ResetEnrollmentService }, { token: i5$1.MatDialogRef }, { token: MAT_DIALOG_DATA }, { token: ZITI_DATA_SERVICE }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5495
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ResetEnrollmentComponent, selector: "lib-reset-enrollment", viewQueries: [{ propertyName: "calendar", first: true, predicate: ["calendar"], descendants: true }], ngImport: i0, template: "<div id=\"ResetModal\" class=\"reset-enrollment-container modal\" style=\"height: fit-content;\">\n <div class=\"close icon-close\" (click)=\"cancel()\"></div>\n <div class=\"reset-title-container\">\n <div class=\"title\">{{type === 'reset' ? 'Reset' : 'Reissue'}} Enrollment</div>\n <div class=\"subtitle\">Select a date to {{type === 'reset' ? 'reset' : 'reissue'}} the enrollment token</div>\n </div>\n <div class=\"reset-content-container\">\n <label>Date Enrollment Expires</label>\n <p-calendar\n [(ngModel)]=\"dateValue\"\n dateFormat=\"mm/dd/yy\"\n selectionMode=\"single\"\n [showIcon]=\"showIcon\"\n [showTime]=\"true\"\n [minDate]=\"minDate\"\n placeholder=\"Select
|
|
5513
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ResetEnrollmentComponent, selector: "lib-reset-enrollment", viewQueries: [{ propertyName: "calendar", first: true, predicate: ["calendar"], descendants: true }], ngImport: i0, template: "<div id=\"ResetModal\" class=\"reset-enrollment-container modal\" style=\"height: fit-content;\">\n <div class=\"close icon-close\" (click)=\"cancel()\"></div>\n <div class=\"reset-title-container\">\n <div class=\"title\">{{type === 'reset' ? 'Reset' : 'Reissue'}} Enrollment</div>\n <div class=\"subtitle\">Select a date to {{type === 'reset' ? 'reset' : 'reissue'}} the enrollment token</div>\n </div>\n <div class=\"reset-content-container\">\n <label>Date Enrollment Expires</label>\n <p-calendar\n [(ngModel)]=\"dateValue\"\n dateFormat=\"mm/dd/yy\"\n selectionMode=\"single\"\n [showIcon]=\"showIcon\"\n [showTime]=\"true\"\n [minDate]=\"minDate\"\n placeholder=\"Select Expiration Date\"\n #calendar\n ></p-calendar>\n </div>\n <div class=\"reset-buttons-container\">\n <div id=\"ResetEnrollButton\" class=\"button\" (click)=\"handleAction()\">{{type === 'reset' ? 'Reset' : 'Reissue'}} Enrollment</div>\n </div>\n</div>\n", styles: [".reset-enrollment-container{display:flex;flex-direction:column;height:-moz-fit-content;height:fit-content;width:37.5rem;padding:1.25rem;gap:.9375rem;background-color:var(--background);border-radius:.625rem;overflow:visible}.reset-title-container{display:flex;flex-direction:column;justify-content:flex-start}.reset-title-container .title,.reset-title-container .subtitle{padding:0;height:inherit;line-height:initial}.reset-content-container{display:flex;flex-direction:column}.reset-buttons-container{display:flex;flex-direction:row;width:100%;justify-content:flex-start}.reset-buttons-container .button{border-radius:var(--inputBorderRadius);line-height:initial;margin-top:0;display:flex;align-items:center}::ng-deep .reset-enroll-dialog-container .mat-mdc-dialog-surface{overflow:visible}::ng-deep .p-component.p-datepicker{background:var(--background)!important}::ng-deep .p-datepicker .p-timepicker button.p-element{background-color:var(--primaryColor)}::ng-deep .p-datepicker .p-datepicker-header button.p-element.p-ripple{background-color:var(--primaryColor)}\n"], dependencies: [{ kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4$1.Calendar, selector: "p-calendar", inputs: ["style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "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"] }] }); }
|
|
5496
5514
|
}
|
|
5497
5515
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ResetEnrollmentComponent, decorators: [{
|
|
5498
5516
|
type: Component,
|
|
5499
|
-
args: [{ selector: 'lib-reset-enrollment', template: "<div id=\"ResetModal\" class=\"reset-enrollment-container modal\" style=\"height: fit-content;\">\n <div class=\"close icon-close\" (click)=\"cancel()\"></div>\n <div class=\"reset-title-container\">\n <div class=\"title\">{{type === 'reset' ? 'Reset' : 'Reissue'}} Enrollment</div>\n <div class=\"subtitle\">Select a date to {{type === 'reset' ? 'reset' : 'reissue'}} the enrollment token</div>\n </div>\n <div class=\"reset-content-container\">\n <label>Date Enrollment Expires</label>\n <p-calendar\n [(ngModel)]=\"dateValue\"\n dateFormat=\"mm/dd/yy\"\n selectionMode=\"single\"\n [showIcon]=\"showIcon\"\n [showTime]=\"true\"\n [minDate]=\"minDate\"\n placeholder=\"Select
|
|
5517
|
+
args: [{ selector: 'lib-reset-enrollment', template: "<div id=\"ResetModal\" class=\"reset-enrollment-container modal\" style=\"height: fit-content;\">\n <div class=\"close icon-close\" (click)=\"cancel()\"></div>\n <div class=\"reset-title-container\">\n <div class=\"title\">{{type === 'reset' ? 'Reset' : 'Reissue'}} Enrollment</div>\n <div class=\"subtitle\">Select a date to {{type === 'reset' ? 'reset' : 'reissue'}} the enrollment token</div>\n </div>\n <div class=\"reset-content-container\">\n <label>Date Enrollment Expires</label>\n <p-calendar\n [(ngModel)]=\"dateValue\"\n dateFormat=\"mm/dd/yy\"\n selectionMode=\"single\"\n [showIcon]=\"showIcon\"\n [showTime]=\"true\"\n [minDate]=\"minDate\"\n placeholder=\"Select Expiration Date\"\n #calendar\n ></p-calendar>\n </div>\n <div class=\"reset-buttons-container\">\n <div id=\"ResetEnrollButton\" class=\"button\" (click)=\"handleAction()\">{{type === 'reset' ? 'Reset' : 'Reissue'}} Enrollment</div>\n </div>\n</div>\n", styles: [".reset-enrollment-container{display:flex;flex-direction:column;height:-moz-fit-content;height:fit-content;width:37.5rem;padding:1.25rem;gap:.9375rem;background-color:var(--background);border-radius:.625rem;overflow:visible}.reset-title-container{display:flex;flex-direction:column;justify-content:flex-start}.reset-title-container .title,.reset-title-container .subtitle{padding:0;height:inherit;line-height:initial}.reset-content-container{display:flex;flex-direction:column}.reset-buttons-container{display:flex;flex-direction:row;width:100%;justify-content:flex-start}.reset-buttons-container .button{border-radius:var(--inputBorderRadius);line-height:initial;margin-top:0;display:flex;align-items:center}::ng-deep .reset-enroll-dialog-container .mat-mdc-dialog-surface{overflow:visible}::ng-deep .p-component.p-datepicker{background:var(--background)!important}::ng-deep .p-datepicker .p-timepicker button.p-element{background-color:var(--primaryColor)}::ng-deep .p-datepicker .p-datepicker-header button.p-element.p-ripple{background-color:var(--primaryColor)}\n"] }]
|
|
5500
5518
|
}], ctorParameters: function () { return [{ type: ResetEnrollmentService }, { type: i5$1.MatDialogRef }, { type: undefined, decorators: [{
|
|
5501
5519
|
type: Inject,
|
|
5502
5520
|
args: [MAT_DIALOG_DATA]
|
|
@@ -5672,6 +5690,8 @@ class IdentitiesPageService extends ListPageServiceClass {
|
|
|
5672
5690
|
{ label: 'Created At', path: 'createdAt' },
|
|
5673
5691
|
{ label: 'ID', path: 'id' },
|
|
5674
5692
|
];
|
|
5693
|
+
this.identityRoleAttributes = [];
|
|
5694
|
+
this.selectedIdentityRoleAttributes = [];
|
|
5675
5695
|
this.selectedIdentity = new Identity$1();
|
|
5676
5696
|
this.columnFilters = {
|
|
5677
5697
|
name: '',
|
|
@@ -5697,9 +5717,49 @@ class IdentitiesPageService extends ListPageServiceClass {
|
|
|
5697
5717
|
this.validate = (formData) => {
|
|
5698
5718
|
return Promise.resolve({ passed: true });
|
|
5699
5719
|
};
|
|
5720
|
+
this.filterService.filtersChanged.subscribe(filters => {
|
|
5721
|
+
let identityFilter;
|
|
5722
|
+
filters.forEach((filter) => {
|
|
5723
|
+
switch (filter.columnId) {
|
|
5724
|
+
case 'identityRoles':
|
|
5725
|
+
identityFilter = true;
|
|
5726
|
+
break;
|
|
5727
|
+
}
|
|
5728
|
+
});
|
|
5729
|
+
if (!identityFilter) {
|
|
5730
|
+
this.selectedIdentityRoleAttributes = [];
|
|
5731
|
+
}
|
|
5732
|
+
});
|
|
5700
5733
|
}
|
|
5701
5734
|
initTableColumns() {
|
|
5702
5735
|
this.initMenuActions();
|
|
5736
|
+
const self = this;
|
|
5737
|
+
const identityRolesHeaderComponentParams = {
|
|
5738
|
+
filterType: 'ATTRIBUTE',
|
|
5739
|
+
enableSorting: true,
|
|
5740
|
+
appendAttributeHash: false,
|
|
5741
|
+
getRoleAttributes: () => {
|
|
5742
|
+
return self.identityRoleAttributes;
|
|
5743
|
+
},
|
|
5744
|
+
getNamedAttributes: () => {
|
|
5745
|
+
return [];
|
|
5746
|
+
},
|
|
5747
|
+
getSelectedRoleAttributes: () => {
|
|
5748
|
+
return self.selectedIdentityRoleAttributes;
|
|
5749
|
+
},
|
|
5750
|
+
getSelectedNamedAttributes: () => {
|
|
5751
|
+
return [];
|
|
5752
|
+
},
|
|
5753
|
+
setSelectedRoleAttributes: (attributes) => {
|
|
5754
|
+
self.selectedIdentityRoleAttributes = attributes;
|
|
5755
|
+
},
|
|
5756
|
+
setSelectedNamedAttributes: (attributes) => {
|
|
5757
|
+
// no-op
|
|
5758
|
+
},
|
|
5759
|
+
getNamedAttributesMap: () => {
|
|
5760
|
+
return {};
|
|
5761
|
+
}
|
|
5762
|
+
};
|
|
5703
5763
|
const nameRenderer = (row) => {
|
|
5704
5764
|
return `<a href="./identities/${row?.data?.id}">
|
|
5705
5765
|
<div class="col cell-name-renderer" data-id="${row?.data?.id}">
|
|
@@ -5811,6 +5871,7 @@ class IdentitiesPageService extends ListPageServiceClass {
|
|
|
5811
5871
|
field: 'roleAttributes',
|
|
5812
5872
|
headerName: 'Roles',
|
|
5813
5873
|
headerComponent: TableColumnDefaultComponent,
|
|
5874
|
+
headerComponentParams: identityRolesHeaderComponentParams,
|
|
5814
5875
|
onCellClicked: (data) => {
|
|
5815
5876
|
if (this.hasSelectedText()) {
|
|
5816
5877
|
return;
|
|
@@ -5906,6 +5967,12 @@ class IdentitiesPageService extends ListPageServiceClass {
|
|
|
5906
5967
|
}
|
|
5907
5968
|
return tableColumns;
|
|
5908
5969
|
}
|
|
5970
|
+
getIdentityRoleAttributes() {
|
|
5971
|
+
return this.zitiService.get('identity-role-attributes', {}, []).then((result) => {
|
|
5972
|
+
this.identityRoleAttributes = result.data;
|
|
5973
|
+
return result;
|
|
5974
|
+
});
|
|
5975
|
+
}
|
|
5909
5976
|
getData(filters, sort, page) {
|
|
5910
5977
|
// we can customize filters or sorting here before moving on...
|
|
5911
5978
|
this.paging.page = page || this.paging.page;
|
|
@@ -7419,6 +7486,7 @@ class DataTableComponent {
|
|
|
7419
7486
|
this.pageChanged = new EventEmitter();
|
|
7420
7487
|
this._view = 'list';
|
|
7421
7488
|
this.filterOptions = [];
|
|
7489
|
+
this.appendAttributeHash = true;
|
|
7422
7490
|
this.attributesColumn = '';
|
|
7423
7491
|
this.dateTimeColumn = '';
|
|
7424
7492
|
this.dateTimeFilterLabel = '';
|
|
@@ -7634,6 +7702,7 @@ class DataTableComponent {
|
|
|
7634
7702
|
}, 100);
|
|
7635
7703
|
}
|
|
7636
7704
|
else if (type === 'ATTRIBUTE') {
|
|
7705
|
+
this.appendAttributeHash = headerComponentParams.appendAttributeHash !== false;
|
|
7637
7706
|
this.attributesColumn = columnId;
|
|
7638
7707
|
this.roleAttributes = headerComponentParams?.getRoleAttributes();
|
|
7639
7708
|
this.namedAttributes = headerComponentParams?.getNamedAttributes();
|
|
@@ -7721,8 +7790,8 @@ class DataTableComponent {
|
|
|
7721
7790
|
label += ', ';
|
|
7722
7791
|
value += ', ';
|
|
7723
7792
|
}
|
|
7724
|
-
label += '#' + attr;
|
|
7725
|
-
value += '%23' + attr;
|
|
7793
|
+
label += ((this.appendAttributeHash ? '#' : '') + attr);
|
|
7794
|
+
value += ((this.appendAttributeHash ? '%23' : '') + attr);
|
|
7726
7795
|
});
|
|
7727
7796
|
}
|
|
7728
7797
|
else {
|
|
@@ -8475,6 +8544,9 @@ class ProjectableForm extends ExtendableComponent {
|
|
|
8475
8544
|
}));
|
|
8476
8545
|
this.initBaseHref();
|
|
8477
8546
|
}
|
|
8547
|
+
get isEdit() {
|
|
8548
|
+
return !isEmpty(this.formData.id);
|
|
8549
|
+
}
|
|
8478
8550
|
ngAfterViewInit(skipFocus = false) {
|
|
8479
8551
|
super.ngAfterViewInit();
|
|
8480
8552
|
this.errors = {};
|
|
@@ -8855,6 +8927,32 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
8855
8927
|
args: [SHAREDZ_EXTENSION]
|
|
8856
8928
|
}] }, { type: GrowlerService }, { type: ValidationService }]; } });
|
|
8857
8929
|
|
|
8930
|
+
class MultiActionButtonComponent {
|
|
8931
|
+
constructor() {
|
|
8932
|
+
this.actionRequested = new EventEmitter();
|
|
8933
|
+
this.showMoreActions = false;
|
|
8934
|
+
}
|
|
8935
|
+
showMoreActionsMenu() {
|
|
8936
|
+
this.showMoreActions = true;
|
|
8937
|
+
}
|
|
8938
|
+
closeMoreActionsMenu() {
|
|
8939
|
+
this.showMoreActions = false;
|
|
8940
|
+
}
|
|
8941
|
+
actionClicked(action) {
|
|
8942
|
+
this.actionRequested.emit(action);
|
|
8943
|
+
}
|
|
8944
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MultiActionButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8945
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: MultiActionButtonComponent, selector: "lib-multi-action-button", inputs: { actions: "actions" }, outputs: { actionRequested: "actionRequested" }, ngImport: i0, template: "<div class=\"multi-action-button-container\">\n <div class=\"form-field-action\"\n *ngIf=\"actions\"\n (clickOutside)=\"closeMoreActionsMenu()\"\n >\n <div class=\"primary-action-button\" (click)=\"actionClicked(actions[0])\">{{actions[0].label}}</div>\n <div class=\"secondary-action-button\"\n *ngIf=\"actions.length > 1\"\n (click)=\"showMoreActionsMenu()\"\n ><div class=\"secondary-actions-arrow icon-prev\"></div></div>\n </div>\n <div class=\"multi-action-button-dropdown\" *ngIf=\"showMoreActions\">\n <ul>\n <li *ngFor=\"let action of actions\" [hidden]=\"action.hidden\" class=\"confirm-item-name\" (click)=\"actionClicked(action)\">{{action.label}}</li>\n </ul>\n </div>\n</div>\n", styles: [".multi-action-button-container{position:absolute;right:.9375rem;top:.625rem;z-index:999999}.multi-action-button-container .form-field-action{display:flex;flex-direction:row;align-items:center;padding:0;height:1.5625rem}.multi-action-button-container .form-field-action .primary-action-button{padding-left:.625rem;padding-right:.625rem;border-right-style:solid;height:100%;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.875rem;background:var(--primary);color:var(--offWhite_ALWAYS);cursor:pointer;border-top-left-radius:var(--inputBorderRadius);border-bottom-left-radius:var(--inputBorderRadius);border-color:var(--stroke);box-shadow:0 .1875rem .5625rem 0 var(--primaryColorOpaque)}.multi-action-button-container .form-field-action .primary-action-button:hover{outline:0;filter:brightness(90%);box-shadow:0 .125rem .1875rem 0 var(--primaryColorOpaque)}.multi-action-button-container .form-field-action .primary-action-button:active{background:#648293;box-shadow:none;transform:translateY(.0625rem)}.multi-action-button-container .form-field-action .secondary-action-button{height:100%;width:1.875rem;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:1rem;background:var(--primary);color:var(--white);cursor:pointer;border-top-right-radius:var(--inputBorderRadius);border-bottom-right-radius:var(--inputBorderRadius);border-color:var(--stroke);box-shadow:0 .1875rem .5625rem 0 var(--primaryColorOpaque)}.multi-action-button-container .form-field-action .secondary-action-button:hover{outline:0;filter:brightness(90%);box-shadow:0 .125rem .1875rem 0 var(--primaryColorOpaque)}.multi-action-button-container .form-field-action .secondary-action-button:active{background:#648293;box-shadow:none;transform:translateY(.0625rem)}.multi-action-button-container .form-field-action .secondary-action-button .secondary-actions-arrow{transform:rotate(270deg)}.multi-action-button-container .multi-action-button-dropdown{position:absolute;background:var(--background);width:100%}.multi-action-button-container .multi-action-button-dropdown ul{width:100%;margin:0;padding:0}.multi-action-button-container .multi-action-button-dropdown ul li{list-style-type:none;padding:.3125rem .3125rem .3125rem .625rem;cursor:pointer}.multi-action-button-container .multi-action-button-dropdown ul li[hidden]{display:none}.multi-action-button-container .multi-action-button-dropdown ul li:hover{background-color:var(--inputBorder)}\n"], dependencies: [{ kind: "directive", type: i1$4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ClickOutsideDirective, selector: "[clickOutside]", inputs: ["clickOutsideEnabled", "attachOutsideOnClick", "delayClickOutsideInit", "emitOnBlur", "exclude", "excludeBeforeClick", "clickOutsideEvents"], outputs: ["clickOutside"] }] }); }
|
|
8946
|
+
}
|
|
8947
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MultiActionButtonComponent, decorators: [{
|
|
8948
|
+
type: Component,
|
|
8949
|
+
args: [{ selector: 'lib-multi-action-button', template: "<div class=\"multi-action-button-container\">\n <div class=\"form-field-action\"\n *ngIf=\"actions\"\n (clickOutside)=\"closeMoreActionsMenu()\"\n >\n <div class=\"primary-action-button\" (click)=\"actionClicked(actions[0])\">{{actions[0].label}}</div>\n <div class=\"secondary-action-button\"\n *ngIf=\"actions.length > 1\"\n (click)=\"showMoreActionsMenu()\"\n ><div class=\"secondary-actions-arrow icon-prev\"></div></div>\n </div>\n <div class=\"multi-action-button-dropdown\" *ngIf=\"showMoreActions\">\n <ul>\n <li *ngFor=\"let action of actions\" [hidden]=\"action.hidden\" class=\"confirm-item-name\" (click)=\"actionClicked(action)\">{{action.label}}</li>\n </ul>\n </div>\n</div>\n", styles: [".multi-action-button-container{position:absolute;right:.9375rem;top:.625rem;z-index:999999}.multi-action-button-container .form-field-action{display:flex;flex-direction:row;align-items:center;padding:0;height:1.5625rem}.multi-action-button-container .form-field-action .primary-action-button{padding-left:.625rem;padding-right:.625rem;border-right-style:solid;height:100%;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.875rem;background:var(--primary);color:var(--offWhite_ALWAYS);cursor:pointer;border-top-left-radius:var(--inputBorderRadius);border-bottom-left-radius:var(--inputBorderRadius);border-color:var(--stroke);box-shadow:0 .1875rem .5625rem 0 var(--primaryColorOpaque)}.multi-action-button-container .form-field-action .primary-action-button:hover{outline:0;filter:brightness(90%);box-shadow:0 .125rem .1875rem 0 var(--primaryColorOpaque)}.multi-action-button-container .form-field-action .primary-action-button:active{background:#648293;box-shadow:none;transform:translateY(.0625rem)}.multi-action-button-container .form-field-action .secondary-action-button{height:100%;width:1.875rem;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:1rem;background:var(--primary);color:var(--white);cursor:pointer;border-top-right-radius:var(--inputBorderRadius);border-bottom-right-radius:var(--inputBorderRadius);border-color:var(--stroke);box-shadow:0 .1875rem .5625rem 0 var(--primaryColorOpaque)}.multi-action-button-container .form-field-action .secondary-action-button:hover{outline:0;filter:brightness(90%);box-shadow:0 .125rem .1875rem 0 var(--primaryColorOpaque)}.multi-action-button-container .form-field-action .secondary-action-button:active{background:#648293;box-shadow:none;transform:translateY(.0625rem)}.multi-action-button-container .form-field-action .secondary-action-button .secondary-actions-arrow{transform:rotate(270deg)}.multi-action-button-container .multi-action-button-dropdown{position:absolute;background:var(--background);width:100%}.multi-action-button-container .multi-action-button-dropdown ul{width:100%;margin:0;padding:0}.multi-action-button-container .multi-action-button-dropdown ul li{list-style-type:none;padding:.3125rem .3125rem .3125rem .625rem;cursor:pointer}.multi-action-button-container .multi-action-button-dropdown ul li[hidden]{display:none}.multi-action-button-container .multi-action-button-dropdown ul li:hover{background-color:var(--inputBorder)}\n"] }]
|
|
8950
|
+
}], propDecorators: { actions: [{
|
|
8951
|
+
type: Input
|
|
8952
|
+
}], actionRequested: [{
|
|
8953
|
+
type: Output
|
|
8954
|
+
}] } });
|
|
8955
|
+
|
|
8858
8956
|
/*
|
|
8859
8957
|
Copyright NetFoundry Inc.
|
|
8860
8958
|
|
|
@@ -8883,10 +8981,17 @@ class FormHeaderComponent {
|
|
|
8883
8981
|
this.moreActionsText = 'More Actions';
|
|
8884
8982
|
this.showHeaderToggle = true;
|
|
8885
8983
|
this.showHeaderButton = true;
|
|
8984
|
+
this.multiActions = [];
|
|
8886
8985
|
this.formViewChange = new EventEmitter();
|
|
8887
8986
|
this.actionRequested = new EventEmitter();
|
|
8987
|
+
this.multiActionRequested = new EventEmitter();
|
|
8988
|
+
this._saveActions = [{ id: 'save', label: 'Save', hidden: true }];
|
|
8989
|
+
this.saveActions = [];
|
|
8888
8990
|
this.showActionsDropDown = false;
|
|
8889
8991
|
}
|
|
8992
|
+
ngOnChanges(changes) {
|
|
8993
|
+
this.saveActions = [...this._saveActions, ...this.multiActions];
|
|
8994
|
+
}
|
|
8890
8995
|
get hasMoreActions() {
|
|
8891
8996
|
let hasMoreActions = false;
|
|
8892
8997
|
this.moreActions?.forEach(action => {
|
|
@@ -8896,6 +9001,12 @@ class FormHeaderComponent {
|
|
|
8896
9001
|
});
|
|
8897
9002
|
return hasMoreActions;
|
|
8898
9003
|
}
|
|
9004
|
+
actionClicked(event) {
|
|
9005
|
+
if (event?.id === 'save' && this.saveDisabled) {
|
|
9006
|
+
return;
|
|
9007
|
+
}
|
|
9008
|
+
this.multiActionRequested.emit({ id: event?.id });
|
|
9009
|
+
}
|
|
8899
9010
|
requestAction(action) {
|
|
8900
9011
|
if (action?.name === 'save' && this.saveDisabled) {
|
|
8901
9012
|
return;
|
|
@@ -8926,15 +9037,18 @@ class FormHeaderComponent {
|
|
|
8926
9037
|
this.showActionsDropDown = false;
|
|
8927
9038
|
});
|
|
8928
9039
|
}
|
|
9040
|
+
get hasMultiActions() {
|
|
9041
|
+
return !isEmpty(this.multiActions);
|
|
9042
|
+
}
|
|
8929
9043
|
get headerBadges() {
|
|
8930
9044
|
return this.data.badges || this.badges;
|
|
8931
9045
|
}
|
|
8932
9046
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8933
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormHeaderComponent, selector: "lib-form-header", inputs: { data: "data", badges: "badges", title: "title", moreActions: "moreActions", formView: "formView", saveDisabled: "saveDisabled", saveTooltip: "saveTooltip", actionButtonText: "actionButtonText", moreActionsText: "moreActionsText", showHeaderToggle: "showHeaderToggle", showHeaderButton: "showHeaderButton" }, outputs: { formViewChange: "formViewChange", actionRequested: "actionRequested" }, ngImport: i0, template: "<div class=\"form-header-container\" [ngClass]=\"{'show-more-actions': (moreActions && moreActions.length > 0 && data.id)}\">\n <div class=\"form-header-group\">\n <div class=\"form-title-container\">\n <div class=\"form-title-back-arrow\" (click)=\"requestAction({name: 'close'})\">\n <div class=\"form-title-back-arrow-icon icon-back-arrow\"></div>\n </div>\n <div class=\"form-header-title-text\">\n <span class=\"form-title\">{{title}}</span>\n <span class=\"form-title title-name\" *ngIf=\"data.name\">{{data.name}}</span>\n </div>\n </div>\n <div class=\"header-actions-container\">\n <div *ngIf=\"showHeaderToggle\" class=\"form-header-toggle-container\">\n <span\n class=\"toggle-option-text\"\n [ngClass]=\"{'toggle-option-selected': formView === 'simple'}\"\n (click)=\"requestAction({name: 'toggle-view', data: 'raw'})\"\n >\n FORM\n </span>\n <div class=\"form-header-toggle\" (click)=\"requestAction({name: 'toggle-view', data: formView})\">\n <div\n class=\"form-toggle-switch\"\n [ngClass]=\"{'toggle-left': formView === 'simple', 'toggle-right': formView === 'raw'}\"\n >\n <div class=\"form-toggle-indicator\"></div>\n <div class=\"form-toggle-indicator\"></div>\n </div>\n </div>\n <span\n class=\"toggle-option-text\"\n [ngClass]=\"{'toggle-option-selected': formView === 'raw'}\"\n (click)=\"requestAction({name:'toggle-view', data: 'simple'})\"\n >\n JSON\n </span>\n </div>\n <div class=\"more-actions-container\" [ngClass]=\"{'more-actions-open': showActionsDropDown}\" *ngIf=\"hasMoreActions\" (click)=\"showMoreActions()\">\n <div class=\"more-actions-button\">\n <div class=\"more-actions-label\">\n <div class=\"more-actions-text\">{{moreActionsText}}</div>\n <div class=\"more-actions-arrow\"></div>\n </div>\n </div>\n <div class=\"more-actions-list\" *ngIf=\"showActionsDropDown\" (clickOutside)=\"closeActionsMoreActions()\">\n <div\n *ngFor=\"let action of moreActions\"\n class=\"more-actions-item\"\n (click)=\"requestAction(action)\"\n >\n {{action.label}}\n </div>\n </div>\n </div>\n <div class=\"save-button\"\n *ngIf=\"showHeaderButton\"\n (click)=\"requestAction({name: 'save'})\"\n [ngClass]=\"{'save-disabled': saveDisabled}\"\n matTooltip=\"{{saveDisabled ? saveTooltip : ''}}\"\n matTooltipPosition=\"below\"\n >{{actionButtonText}}</div>\n </div>\n </div>\n <div class=\"form-header-group badges-container\">\n <div *ngFor=\"let badge of headerBadges\" class=\"header-badge-container {{badge.class}}\">\n <span *ngIf=\"badge.circle\" class=\"circle {{badge.circle}}\"></span>\n <span class=\"badge-label\">{{badge.label}}</span>\n </div>\n </div>\n</div>", styles: [":host{position:relative;width:100%;margin-bottom:.625rem;display:flex;justify-content:center;padding-left:3.125rem;padding-right:3.125rem}.form-header-container{display:flex;flex-direction:column;width:100%;padding-right:var(--paddingMedium);max-width:68.75rem}.form-header-container.show-more-actions .form-title-container{max-width:calc(100% - 23.4375rem)}.form-header-container.show-more-actions .header-actions-container{min-width:23.4375rem}.form-header-container .form-header-group{display:flex;flex-direction:row;justify-content:space-between;align-items:center;width:100%}.form-header-container .form-header-group.badges-container{justify-content:flex-start;margin-left:1.875rem;margin-top:.3125rem;gap:.625rem}.form-header-container .form-title-container{display:flex;flex-direction:row;justify-content:flex-start;max-width:calc(100% - 12.5rem)}.form-header-container .form-title-container .form-header-title-text{overflow:hidden;display:block;white-space:nowrap;text-overflow:ellipsis}.form-header-container .form-title-container .form-title{width:100%;flex:1 1 auto;font-weight:700;font-size:1.375rem;color:var(--tableText);margin-left:.4375rem;min-width:8.125rem;text-wrap:nowrap}.form-header-container .form-title-container .form-title.title-name{color:var(--primary);margin-left:.3125rem}.form-header-container .form-title-container .form-title-back-arrow{display:flex;align-items:center;justify-content:flex-start;transform:scaleX(1.25);margin-left:var(--marginSmall);width:1.325rem;min-width:1.325rem;padding-left:.125rem;cursor:pointer}.form-header-container .form-title-container .form-title-back-arrow:hover{background-color:#fff;border-radius:var(--inputBorderRadius);filter:brightness(90%);transition:.3s}.form-header-container .form-title-container .form-title-back-arrow:active{background-color:#fff;border-radius:var(--inputBorderRadius);filter:brightness(80%);transition:.3s}.form-header-container .form-title-container .form-title-back-arrow .form-title-back-arrow-icon{font-family:icomoon!important;font-size:1rem;height:1rem;font-weight:600;margin-top:.05rem;color:var(--tableText)}.form-header-container .form-title-container .form-title-back-arrow .form-title-back-button-line{border-color:var(--tableText);border-style:solid;border-left-width:.0625rem;border-right-width:.0625rem;width:.875rem;position:absolute;left:.5rem}.form-header-container .header-actions-container{display:flex;flex-direction:row;min-width:11.25rem;justify-content:flex-end}.form-header-container .header-actions-container .save-button{min-width:4.0625rem;height:2.0625rem;text-transform:none}.form-header-container .header-actions-container .save-button.save-disabled{filter:grayscale(1);opacity:.3;cursor:not-allowed}.form-header-container .header-actions-container .save-button.save-disabled:active{transform:translateY(0);background:var(--primary)}.more-actions-container{width:9.375rem;height:2.0625rem;display:flex;flex-direction:row;align-items:center;justify-content:center;border-radius:.3125rem;position:relative;cursor:pointer;z-index:999999;margin-right:1.25rem}.more-actions-container .more-actions-button{height:100%;width:100%;background-color:var(--inputBorder);display:flex;flex-direction:row;align-items:center;justify-content:center;border-radius:.3125rem;position:relative;cursor:pointer}.more-actions-container .more-actions-button:hover{outline:0;filter:brightness(95%)}.more-actions-container .more-actions-label{display:flex;flex-direction:row;align-items:center;justify-content:space-between;width:100%;margin-left:.9375rem;margin-right:.625rem}.more-actions-container .more-actions-label .more-actions-arrow{background-image:url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22utf-8%22%3F%3E%3C!-- Generator%3A Adobe Illustrator 23.0.3%2C SVG Export Plug-In . SVG Version%3A 6.00 Build 0) --%3E%3Csvg id%3D'Stroke_Color' style%3D'enable-background%3Anew 0 0 20.2 10.8%3B' version%3D'1.1' viewBox%3D'0 0 20.2 10.8' x%3D'0px' xml%3Aspace%3D'preserve' xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' y%3D'0px'%3E%3Cstyle type%3D'text%2Fcss'%3E%09.st0 %7B fill%3A %23668291%3B %7D%3C%2Fstyle%3E %3Cg%3E%09%3Cpath class%3D'st0' d%3D'M19.8%2C1.7c0%2C0.4-0.1%2C0.7-0.4%2C0.9l-8.5%2C7.3c-0.5%2C0.4-1.2%2C0.4-1.6%2C0L0.7%2C2.7C0.2%2C2.2%2C0.2%2C1.5%2C0.6%2C0.9%09%09c0.5-0.5%2C1.2-0.6%2C1.8-0.1l7.7%2C6.6l7.7-6.6c0.5-0.5%2C1.3-0.4%2C1.8%2C0.1C19.7%2C1.2%2C19.8%2C1.5%2C19.8%2C1.7z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E\");background-size:1.25rem .625rem;width:1.25rem;height:.625rem;transition:.3s}.more-actions-container .more-actions-label .more-actions-text{color:var(--tableText);font-weight:600}.more-actions-container .more-actions-list{display:flex;flex-direction:column;background-color:var(--white);position:absolute;top:2.0625rem;width:100%;box-shadow:0 .1875rem .3125rem .0625rem var(--boxShadow);border-radius:.3125rem}.more-actions-container .more-actions-item{display:flex;flex-direction:row;align-items:center;height:1.5625rem;width:100%;padding-left:.9375rem;color:var(--tableText);cursor:pointer}.more-actions-container .more-actions-item:hover{background-color:var(--inputBorder)}.more-actions-container.more-actions-open .more-actions-arrow{transform:rotate(180deg)}.form-header-toggle-container{display:flex;flex-direction:row;align-items:center;margin-right:1.25rem}.form-header-toggle-container .form-header-toggle{display:flex;flex-direction:row;width:1.875rem;height:1.125rem;border-radius:.625rem;border-color:var(--inputBorder);border-style:solid;border-width:var(--inputBorderWidth);margin-left:.3125rem;cursor:pointer;position:relative;margin-right:.3125rem}.form-header-toggle-container .form-header-toggle:hover{filter:brightness(90%)}.form-header-toggle-container .form-header-toggle:active{transform:translateY(.0625rem);filter:brightness(80%)}.form-header-toggle-container .form-header-toggle .form-toggle-switch{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;height:100%;margin-left:.1875rem;position:absolute;transition:.5s;left:0}.form-header-toggle-container .form-header-toggle .form-toggle-switch.toggle-right{left:.625rem}.form-header-toggle-container .form-header-toggle .form-toggle-switch.toggle-right .form-toggle-indicator{border-color:var(--red)}.form-header-toggle-container .form-header-toggle .form-toggle-switch .form-toggle-indicator{height:.625rem;border-color:var(--green);border-style:solid;border-left-width:.0625rem;border-right-width:.0625rem;position:relative;margin-left:.125rem}.form-header-toggle-container .toggle-option-text{font-size:.8125rem;font-weight:600;color:var(--placeholder);cursor:pointer}.form-header-toggle-container .toggle-option-text:hover{filter:brightness(90%)}.form-header-toggle-container .toggle-option-text:hover.toggle-option-selected{filter:unset}.form-header-toggle-container .toggle-option-text.toggle-option-selected{color:var(--tableText);cursor:default}.header-badge-container{height:1.875rem;display:flex;flex-direction:row;align-items:center;border-radius:1.875rem;padding:0rem .75rem;font-weight:600;color:var(--tableText);background:var(--inputBorder)}.header-badge-container.online{background-color:var(--greenShadow)}.header-badge-container.unreg{background-color:var(--redShadow);color:var(--red)}.header-badge-container .badge-label{margin-left:.3125rem}.header-badge-container.verified{background-color:var(--primary);color:var(--white)}.header-badge-container .circle.false{background-color:var(--white)}.header-badge-container .circle.verified{font-size:1.2rem;color:var(--white);font-family:icomoon;background-color:transparent;width:1.2rem;height:1.2rem}.header-badge-container .circle.verified:before{content:\"\\e958\"}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ClickOutsideDirective, selector: "[clickOutside]", inputs: ["clickOutsideEnabled", "attachOutsideOnClick", "delayClickOutsideInit", "emitOnBlur", "exclude", "excludeBeforeClick", "clickOutsideEvents"], outputs: ["clickOutside"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }] }); }
|
|
9047
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: FormHeaderComponent, selector: "lib-form-header", inputs: { data: "data", badges: "badges", title: "title", moreActions: "moreActions", formView: "formView", saveDisabled: "saveDisabled", saveTooltip: "saveTooltip", actionButtonText: "actionButtonText", moreActionsText: "moreActionsText", showHeaderToggle: "showHeaderToggle", showHeaderButton: "showHeaderButton", multiActions: "multiActions" }, outputs: { formViewChange: "formViewChange", actionRequested: "actionRequested", multiActionRequested: "multiActionRequested" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"form-header-container\" [ngClass]=\"{'show-more-actions': (moreActions && moreActions.length > 0 && data.id)}\">\n <div class=\"form-header-group\">\n <div class=\"form-title-container\">\n <div class=\"form-title-back-arrow\" (click)=\"requestAction({name: 'close'})\">\n <div class=\"form-title-back-arrow-icon icon-back-arrow\"></div>\n </div>\n <div class=\"form-header-title-text\">\n <span class=\"form-title\">{{title}}</span>\n <span class=\"form-title title-name\" *ngIf=\"data.name\">{{data.name}}</span>\n </div>\n </div>\n <div class=\"header-actions-container\">\n <div *ngIf=\"showHeaderToggle\" class=\"form-header-toggle-container\">\n <span\n class=\"toggle-option-text\"\n [ngClass]=\"{'toggle-option-selected': formView === 'simple'}\"\n (click)=\"requestAction({name: 'toggle-view', data: 'raw'})\"\n >\n FORM\n </span>\n <div class=\"form-header-toggle\" (click)=\"requestAction({name: 'toggle-view', data: formView})\">\n <div\n class=\"form-toggle-switch\"\n [ngClass]=\"{'toggle-left': formView === 'simple', 'toggle-right': formView === 'raw'}\"\n >\n <div class=\"form-toggle-indicator\"></div>\n <div class=\"form-toggle-indicator\"></div>\n </div>\n </div>\n <span\n class=\"toggle-option-text\"\n [ngClass]=\"{'toggle-option-selected': formView === 'raw'}\"\n (click)=\"requestAction({name:'toggle-view', data: 'simple'})\"\n >\n JSON\n </span>\n </div>\n <div class=\"more-actions-container\" [ngClass]=\"{'more-actions-open': showActionsDropDown}\" *ngIf=\"hasMoreActions\" (click)=\"showMoreActions()\">\n <div class=\"more-actions-button\">\n <div class=\"more-actions-label\">\n <div class=\"more-actions-text\">{{moreActionsText}}</div>\n <div class=\"more-actions-arrow\"></div>\n </div>\n </div>\n <div class=\"more-actions-list\" *ngIf=\"showActionsDropDown\" (clickOutside)=\"closeActionsMoreActions()\">\n <div\n *ngFor=\"let action of moreActions\"\n class=\"more-actions-item\"\n (click)=\"requestAction(action)\"\n >\n {{action.label}}\n </div>\n </div>\n </div>\n <div class=\"save-button\"\n *ngIf=\"!hasMultiActions && showHeaderButton\"\n (click)=\"requestAction({name: 'save'})\"\n [ngClass]=\"{'save-disabled': saveDisabled}\"\n matTooltip=\"{{saveDisabled ? saveTooltip : ''}}\"\n matTooltipPosition=\"below\"\n >{{actionButtonText}}</div>\n <lib-multi-action-button\n *ngIf=\"hasMultiActions\"\n [actions]=\"saveActions\"\n (actionRequested)=\"actionClicked($event)\"\n ></lib-multi-action-button>\n </div>\n </div>\n <div class=\"form-header-group badges-container\">\n <div *ngFor=\"let badge of headerBadges\" class=\"header-badge-container {{badge.class}}\">\n <span *ngIf=\"badge.circle\" class=\"circle {{badge.circle}}\"></span>\n <span class=\"badge-label\">{{badge.label}}</span>\n </div>\n </div>\n</div>\n", styles: [":host{position:relative;width:100%;margin-bottom:.625rem;display:flex;justify-content:center;padding-left:3.125rem;padding-right:3.125rem}.form-header-container{display:flex;flex-direction:column;width:100%;padding-right:var(--paddingMedium);max-width:68.75rem}.form-header-container.show-more-actions .form-title-container{max-width:calc(100% - 23.4375rem)}.form-header-container.show-more-actions .header-actions-container{min-width:23.4375rem}.form-header-container .form-header-group{display:flex;flex-direction:row;justify-content:space-between;align-items:center;width:100%}.form-header-container .form-header-group.badges-container{justify-content:flex-start;margin-left:1.875rem;margin-top:.3125rem;gap:.625rem}.form-header-container .form-title-container{display:flex;flex-direction:row;justify-content:flex-start;max-width:calc(100% - 12.5rem)}.form-header-container .form-title-container .form-header-title-text{overflow:hidden;display:block;white-space:nowrap;text-overflow:ellipsis}.form-header-container .form-title-container .form-title{width:100%;flex:1 1 auto;font-weight:700;font-size:1.375rem;color:var(--tableText);margin-left:.4375rem;min-width:8.125rem;text-wrap:nowrap}.form-header-container .form-title-container .form-title.title-name{color:var(--primary);margin-left:.3125rem}.form-header-container .form-title-container .form-title-back-arrow{display:flex;align-items:center;justify-content:flex-start;transform:scaleX(1.25);margin-left:var(--marginSmall);width:1.325rem;min-width:1.325rem;padding-left:.125rem;cursor:pointer}.form-header-container .form-title-container .form-title-back-arrow:hover{background-color:#fff;border-radius:var(--inputBorderRadius);filter:brightness(90%);transition:.3s}.form-header-container .form-title-container .form-title-back-arrow:active{background-color:#fff;border-radius:var(--inputBorderRadius);filter:brightness(80%);transition:.3s}.form-header-container .form-title-container .form-title-back-arrow .form-title-back-arrow-icon{font-family:icomoon!important;font-size:1rem;height:1rem;font-weight:600;margin-top:.05rem;color:var(--tableText)}.form-header-container .form-title-container .form-title-back-arrow .form-title-back-button-line{border-color:var(--tableText);border-style:solid;border-left-width:.0625rem;border-right-width:.0625rem;width:.875rem;position:absolute;left:.5rem}.form-header-container .header-actions-container{display:flex;flex-direction:row;min-width:11.25rem;justify-content:flex-end}.form-header-container .header-actions-container .save-button{min-width:4.0625rem;height:2.0625rem;text-transform:none}.form-header-container .header-actions-container .save-button.save-disabled{filter:grayscale(1);opacity:.3;cursor:not-allowed}.form-header-container .header-actions-container .save-button.save-disabled:active{transform:translateY(0);background:var(--primary)}.more-actions-container{width:9.375rem;height:2.0625rem;display:flex;flex-direction:row;align-items:center;justify-content:center;border-radius:.3125rem;position:relative;cursor:pointer;z-index:999999;margin-right:1.25rem}.more-actions-container .more-actions-button{height:100%;width:100%;background-color:var(--inputBorder);display:flex;flex-direction:row;align-items:center;justify-content:center;border-radius:.3125rem;position:relative;cursor:pointer}.more-actions-container .more-actions-button:hover{outline:0;filter:brightness(95%)}.more-actions-container .more-actions-label{display:flex;flex-direction:row;align-items:center;justify-content:space-between;width:100%;margin-left:.9375rem;margin-right:.625rem}.more-actions-container .more-actions-label .more-actions-arrow{background-image:url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22utf-8%22%3F%3E%3C!-- Generator%3A Adobe Illustrator 23.0.3%2C SVG Export Plug-In . SVG Version%3A 6.00 Build 0) --%3E%3Csvg id%3D'Stroke_Color' style%3D'enable-background%3Anew 0 0 20.2 10.8%3B' version%3D'1.1' viewBox%3D'0 0 20.2 10.8' x%3D'0px' xml%3Aspace%3D'preserve' xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' y%3D'0px'%3E%3Cstyle type%3D'text%2Fcss'%3E%09.st0 %7B fill%3A %23668291%3B %7D%3C%2Fstyle%3E %3Cg%3E%09%3Cpath class%3D'st0' d%3D'M19.8%2C1.7c0%2C0.4-0.1%2C0.7-0.4%2C0.9l-8.5%2C7.3c-0.5%2C0.4-1.2%2C0.4-1.6%2C0L0.7%2C2.7C0.2%2C2.2%2C0.2%2C1.5%2C0.6%2C0.9%09%09c0.5-0.5%2C1.2-0.6%2C1.8-0.1l7.7%2C6.6l7.7-6.6c0.5-0.5%2C1.3-0.4%2C1.8%2C0.1C19.7%2C1.2%2C19.8%2C1.5%2C19.8%2C1.7z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E\");background-size:1.25rem .625rem;width:1.25rem;height:.625rem;transition:.3s}.more-actions-container .more-actions-label .more-actions-text{color:var(--tableText);font-weight:600}.more-actions-container .more-actions-list{display:flex;flex-direction:column;background-color:var(--white);position:absolute;top:2.0625rem;width:100%;box-shadow:0 .1875rem .3125rem .0625rem var(--boxShadow);border-radius:.3125rem}.more-actions-container .more-actions-item{display:flex;flex-direction:row;align-items:center;height:1.5625rem;width:100%;padding-left:.9375rem;color:var(--tableText);cursor:pointer}.more-actions-container .more-actions-item:hover{background-color:var(--inputBorder)}.more-actions-container.more-actions-open .more-actions-arrow{transform:rotate(180deg)}.form-header-toggle-container{display:flex;flex-direction:row;align-items:center;margin-right:1.25rem}.form-header-toggle-container .form-header-toggle{display:flex;flex-direction:row;width:1.875rem;height:1.125rem;border-radius:.625rem;border-color:var(--inputBorder);border-style:solid;border-width:var(--inputBorderWidth);margin-left:.3125rem;cursor:pointer;position:relative;margin-right:.3125rem}.form-header-toggle-container .form-header-toggle:hover{filter:brightness(90%)}.form-header-toggle-container .form-header-toggle:active{transform:translateY(.0625rem);filter:brightness(80%)}.form-header-toggle-container .form-header-toggle .form-toggle-switch{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;height:100%;margin-left:.1875rem;position:absolute;transition:.5s;left:0}.form-header-toggle-container .form-header-toggle .form-toggle-switch.toggle-right{left:.625rem}.form-header-toggle-container .form-header-toggle .form-toggle-switch.toggle-right .form-toggle-indicator{border-color:var(--red)}.form-header-toggle-container .form-header-toggle .form-toggle-switch .form-toggle-indicator{height:.625rem;border-color:var(--green);border-style:solid;border-left-width:.0625rem;border-right-width:.0625rem;position:relative;margin-left:.125rem}.form-header-toggle-container .toggle-option-text{font-size:.8125rem;font-weight:600;color:var(--placeholder);cursor:pointer}.form-header-toggle-container .toggle-option-text:hover{filter:brightness(90%)}.form-header-toggle-container .toggle-option-text:hover.toggle-option-selected{filter:unset}.form-header-toggle-container .toggle-option-text.toggle-option-selected{color:var(--tableText);cursor:default}.header-badge-container{height:1.875rem;display:flex;flex-direction:row;align-items:center;border-radius:1.875rem;padding:0rem .75rem;font-weight:600;color:var(--tableText);background:var(--inputBorder)}.header-badge-container.online{background-color:var(--greenShadow)}.header-badge-container.unreg{background-color:var(--redShadow);color:var(--red)}.header-badge-container .badge-label{margin-left:.3125rem}.header-badge-container.verified{background-color:var(--primary);color:var(--white)}.header-badge-container .circle.false{background-color:var(--white)}.header-badge-container .circle.verified{font-size:1.2rem;color:var(--white);font-family:icomoon;background-color:transparent;width:1.2rem;height:1.2rem}.header-badge-container .circle.verified:before{content:\"\\e958\"}.header-badge-container.unknown{background-color:var(--highlightedOpaque)}.header-badge-container.unknown .circle{background-color:var(--highlighted)}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ClickOutsideDirective, selector: "[clickOutside]", inputs: ["clickOutsideEnabled", "attachOutsideOnClick", "delayClickOutsideInit", "emitOnBlur", "exclude", "excludeBeforeClick", "clickOutsideEvents"], outputs: ["clickOutside"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: MultiActionButtonComponent, selector: "lib-multi-action-button", inputs: ["actions"], outputs: ["actionRequested"] }] }); }
|
|
8934
9048
|
}
|
|
8935
9049
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: FormHeaderComponent, decorators: [{
|
|
8936
9050
|
type: Component,
|
|
8937
|
-
args: [{ selector: 'lib-form-header', template: "<div class=\"form-header-container\" [ngClass]=\"{'show-more-actions': (moreActions && moreActions.length > 0 && data.id)}\">\n <div class=\"form-header-group\">\n <div class=\"form-title-container\">\n <div class=\"form-title-back-arrow\" (click)=\"requestAction({name: 'close'})\">\n <div class=\"form-title-back-arrow-icon icon-back-arrow\"></div>\n </div>\n <div class=\"form-header-title-text\">\n <span class=\"form-title\">{{title}}</span>\n <span class=\"form-title title-name\" *ngIf=\"data.name\">{{data.name}}</span>\n </div>\n </div>\n <div class=\"header-actions-container\">\n <div *ngIf=\"showHeaderToggle\" class=\"form-header-toggle-container\">\n <span\n class=\"toggle-option-text\"\n [ngClass]=\"{'toggle-option-selected': formView === 'simple'}\"\n (click)=\"requestAction({name: 'toggle-view', data: 'raw'})\"\n >\n FORM\n </span>\n <div class=\"form-header-toggle\" (click)=\"requestAction({name: 'toggle-view', data: formView})\">\n <div\n class=\"form-toggle-switch\"\n [ngClass]=\"{'toggle-left': formView === 'simple', 'toggle-right': formView === 'raw'}\"\n >\n <div class=\"form-toggle-indicator\"></div>\n <div class=\"form-toggle-indicator\"></div>\n </div>\n </div>\n <span\n class=\"toggle-option-text\"\n [ngClass]=\"{'toggle-option-selected': formView === 'raw'}\"\n (click)=\"requestAction({name:'toggle-view', data: 'simple'})\"\n >\n JSON\n </span>\n </div>\n <div class=\"more-actions-container\" [ngClass]=\"{'more-actions-open': showActionsDropDown}\" *ngIf=\"hasMoreActions\" (click)=\"showMoreActions()\">\n <div class=\"more-actions-button\">\n <div class=\"more-actions-label\">\n <div class=\"more-actions-text\">{{moreActionsText}}</div>\n <div class=\"more-actions-arrow\"></div>\n </div>\n </div>\n <div class=\"more-actions-list\" *ngIf=\"showActionsDropDown\" (clickOutside)=\"closeActionsMoreActions()\">\n <div\n *ngFor=\"let action of moreActions\"\n class=\"more-actions-item\"\n (click)=\"requestAction(action)\"\n >\n {{action.label}}\n </div>\n </div>\n </div>\n <div class=\"save-button\"\n *ngIf=\"showHeaderButton\"\n (click)=\"requestAction({name: 'save'})\"\n [ngClass]=\"{'save-disabled': saveDisabled}\"\n matTooltip=\"{{saveDisabled ? saveTooltip : ''}}\"\n matTooltipPosition=\"below\"\n >{{actionButtonText}}</div>\n </div>\n </div>\n <div class=\"form-header-group badges-container\">\n <div *ngFor=\"let badge of headerBadges\" class=\"header-badge-container {{badge.class}}\">\n <span *ngIf=\"badge.circle\" class=\"circle {{badge.circle}}\"></span>\n <span class=\"badge-label\">{{badge.label}}</span>\n </div>\n </div>\n</div>", styles: [":host{position:relative;width:100%;margin-bottom:.625rem;display:flex;justify-content:center;padding-left:3.125rem;padding-right:3.125rem}.form-header-container{display:flex;flex-direction:column;width:100%;padding-right:var(--paddingMedium);max-width:68.75rem}.form-header-container.show-more-actions .form-title-container{max-width:calc(100% - 23.4375rem)}.form-header-container.show-more-actions .header-actions-container{min-width:23.4375rem}.form-header-container .form-header-group{display:flex;flex-direction:row;justify-content:space-between;align-items:center;width:100%}.form-header-container .form-header-group.badges-container{justify-content:flex-start;margin-left:1.875rem;margin-top:.3125rem;gap:.625rem}.form-header-container .form-title-container{display:flex;flex-direction:row;justify-content:flex-start;max-width:calc(100% - 12.5rem)}.form-header-container .form-title-container .form-header-title-text{overflow:hidden;display:block;white-space:nowrap;text-overflow:ellipsis}.form-header-container .form-title-container .form-title{width:100%;flex:1 1 auto;font-weight:700;font-size:1.375rem;color:var(--tableText);margin-left:.4375rem;min-width:8.125rem;text-wrap:nowrap}.form-header-container .form-title-container .form-title.title-name{color:var(--primary);margin-left:.3125rem}.form-header-container .form-title-container .form-title-back-arrow{display:flex;align-items:center;justify-content:flex-start;transform:scaleX(1.25);margin-left:var(--marginSmall);width:1.325rem;min-width:1.325rem;padding-left:.125rem;cursor:pointer}.form-header-container .form-title-container .form-title-back-arrow:hover{background-color:#fff;border-radius:var(--inputBorderRadius);filter:brightness(90%);transition:.3s}.form-header-container .form-title-container .form-title-back-arrow:active{background-color:#fff;border-radius:var(--inputBorderRadius);filter:brightness(80%);transition:.3s}.form-header-container .form-title-container .form-title-back-arrow .form-title-back-arrow-icon{font-family:icomoon!important;font-size:1rem;height:1rem;font-weight:600;margin-top:.05rem;color:var(--tableText)}.form-header-container .form-title-container .form-title-back-arrow .form-title-back-button-line{border-color:var(--tableText);border-style:solid;border-left-width:.0625rem;border-right-width:.0625rem;width:.875rem;position:absolute;left:.5rem}.form-header-container .header-actions-container{display:flex;flex-direction:row;min-width:11.25rem;justify-content:flex-end}.form-header-container .header-actions-container .save-button{min-width:4.0625rem;height:2.0625rem;text-transform:none}.form-header-container .header-actions-container .save-button.save-disabled{filter:grayscale(1);opacity:.3;cursor:not-allowed}.form-header-container .header-actions-container .save-button.save-disabled:active{transform:translateY(0);background:var(--primary)}.more-actions-container{width:9.375rem;height:2.0625rem;display:flex;flex-direction:row;align-items:center;justify-content:center;border-radius:.3125rem;position:relative;cursor:pointer;z-index:999999;margin-right:1.25rem}.more-actions-container .more-actions-button{height:100%;width:100%;background-color:var(--inputBorder);display:flex;flex-direction:row;align-items:center;justify-content:center;border-radius:.3125rem;position:relative;cursor:pointer}.more-actions-container .more-actions-button:hover{outline:0;filter:brightness(95%)}.more-actions-container .more-actions-label{display:flex;flex-direction:row;align-items:center;justify-content:space-between;width:100%;margin-left:.9375rem;margin-right:.625rem}.more-actions-container .more-actions-label .more-actions-arrow{background-image:url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22utf-8%22%3F%3E%3C!-- Generator%3A Adobe Illustrator 23.0.3%2C SVG Export Plug-In . SVG Version%3A 6.00 Build 0) --%3E%3Csvg id%3D'Stroke_Color' style%3D'enable-background%3Anew 0 0 20.2 10.8%3B' version%3D'1.1' viewBox%3D'0 0 20.2 10.8' x%3D'0px' xml%3Aspace%3D'preserve' xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' y%3D'0px'%3E%3Cstyle type%3D'text%2Fcss'%3E%09.st0 %7B fill%3A %23668291%3B %7D%3C%2Fstyle%3E %3Cg%3E%09%3Cpath class%3D'st0' d%3D'M19.8%2C1.7c0%2C0.4-0.1%2C0.7-0.4%2C0.9l-8.5%2C7.3c-0.5%2C0.4-1.2%2C0.4-1.6%2C0L0.7%2C2.7C0.2%2C2.2%2C0.2%2C1.5%2C0.6%2C0.9%09%09c0.5-0.5%2C1.2-0.6%2C1.8-0.1l7.7%2C6.6l7.7-6.6c0.5-0.5%2C1.3-0.4%2C1.8%2C0.1C19.7%2C1.2%2C19.8%2C1.5%2C19.8%2C1.7z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E\");background-size:1.25rem .625rem;width:1.25rem;height:.625rem;transition:.3s}.more-actions-container .more-actions-label .more-actions-text{color:var(--tableText);font-weight:600}.more-actions-container .more-actions-list{display:flex;flex-direction:column;background-color:var(--white);position:absolute;top:2.0625rem;width:100%;box-shadow:0 .1875rem .3125rem .0625rem var(--boxShadow);border-radius:.3125rem}.more-actions-container .more-actions-item{display:flex;flex-direction:row;align-items:center;height:1.5625rem;width:100%;padding-left:.9375rem;color:var(--tableText);cursor:pointer}.more-actions-container .more-actions-item:hover{background-color:var(--inputBorder)}.more-actions-container.more-actions-open .more-actions-arrow{transform:rotate(180deg)}.form-header-toggle-container{display:flex;flex-direction:row;align-items:center;margin-right:1.25rem}.form-header-toggle-container .form-header-toggle{display:flex;flex-direction:row;width:1.875rem;height:1.125rem;border-radius:.625rem;border-color:var(--inputBorder);border-style:solid;border-width:var(--inputBorderWidth);margin-left:.3125rem;cursor:pointer;position:relative;margin-right:.3125rem}.form-header-toggle-container .form-header-toggle:hover{filter:brightness(90%)}.form-header-toggle-container .form-header-toggle:active{transform:translateY(.0625rem);filter:brightness(80%)}.form-header-toggle-container .form-header-toggle .form-toggle-switch{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;height:100%;margin-left:.1875rem;position:absolute;transition:.5s;left:0}.form-header-toggle-container .form-header-toggle .form-toggle-switch.toggle-right{left:.625rem}.form-header-toggle-container .form-header-toggle .form-toggle-switch.toggle-right .form-toggle-indicator{border-color:var(--red)}.form-header-toggle-container .form-header-toggle .form-toggle-switch .form-toggle-indicator{height:.625rem;border-color:var(--green);border-style:solid;border-left-width:.0625rem;border-right-width:.0625rem;position:relative;margin-left:.125rem}.form-header-toggle-container .toggle-option-text{font-size:.8125rem;font-weight:600;color:var(--placeholder);cursor:pointer}.form-header-toggle-container .toggle-option-text:hover{filter:brightness(90%)}.form-header-toggle-container .toggle-option-text:hover.toggle-option-selected{filter:unset}.form-header-toggle-container .toggle-option-text.toggle-option-selected{color:var(--tableText);cursor:default}.header-badge-container{height:1.875rem;display:flex;flex-direction:row;align-items:center;border-radius:1.875rem;padding:0rem .75rem;font-weight:600;color:var(--tableText);background:var(--inputBorder)}.header-badge-container.online{background-color:var(--greenShadow)}.header-badge-container.unreg{background-color:var(--redShadow);color:var(--red)}.header-badge-container .badge-label{margin-left:.3125rem}.header-badge-container.verified{background-color:var(--primary);color:var(--white)}.header-badge-container .circle.false{background-color:var(--white)}.header-badge-container .circle.verified{font-size:1.2rem;color:var(--white);font-family:icomoon;background-color:transparent;width:1.2rem;height:1.2rem}.header-badge-container .circle.verified:before{content:\"\\e958\"}\n"] }]
|
|
9051
|
+
args: [{ selector: 'lib-form-header', template: "<div class=\"form-header-container\" [ngClass]=\"{'show-more-actions': (moreActions && moreActions.length > 0 && data.id)}\">\n <div class=\"form-header-group\">\n <div class=\"form-title-container\">\n <div class=\"form-title-back-arrow\" (click)=\"requestAction({name: 'close'})\">\n <div class=\"form-title-back-arrow-icon icon-back-arrow\"></div>\n </div>\n <div class=\"form-header-title-text\">\n <span class=\"form-title\">{{title}}</span>\n <span class=\"form-title title-name\" *ngIf=\"data.name\">{{data.name}}</span>\n </div>\n </div>\n <div class=\"header-actions-container\">\n <div *ngIf=\"showHeaderToggle\" class=\"form-header-toggle-container\">\n <span\n class=\"toggle-option-text\"\n [ngClass]=\"{'toggle-option-selected': formView === 'simple'}\"\n (click)=\"requestAction({name: 'toggle-view', data: 'raw'})\"\n >\n FORM\n </span>\n <div class=\"form-header-toggle\" (click)=\"requestAction({name: 'toggle-view', data: formView})\">\n <div\n class=\"form-toggle-switch\"\n [ngClass]=\"{'toggle-left': formView === 'simple', 'toggle-right': formView === 'raw'}\"\n >\n <div class=\"form-toggle-indicator\"></div>\n <div class=\"form-toggle-indicator\"></div>\n </div>\n </div>\n <span\n class=\"toggle-option-text\"\n [ngClass]=\"{'toggle-option-selected': formView === 'raw'}\"\n (click)=\"requestAction({name:'toggle-view', data: 'simple'})\"\n >\n JSON\n </span>\n </div>\n <div class=\"more-actions-container\" [ngClass]=\"{'more-actions-open': showActionsDropDown}\" *ngIf=\"hasMoreActions\" (click)=\"showMoreActions()\">\n <div class=\"more-actions-button\">\n <div class=\"more-actions-label\">\n <div class=\"more-actions-text\">{{moreActionsText}}</div>\n <div class=\"more-actions-arrow\"></div>\n </div>\n </div>\n <div class=\"more-actions-list\" *ngIf=\"showActionsDropDown\" (clickOutside)=\"closeActionsMoreActions()\">\n <div\n *ngFor=\"let action of moreActions\"\n class=\"more-actions-item\"\n (click)=\"requestAction(action)\"\n >\n {{action.label}}\n </div>\n </div>\n </div>\n <div class=\"save-button\"\n *ngIf=\"!hasMultiActions && showHeaderButton\"\n (click)=\"requestAction({name: 'save'})\"\n [ngClass]=\"{'save-disabled': saveDisabled}\"\n matTooltip=\"{{saveDisabled ? saveTooltip : ''}}\"\n matTooltipPosition=\"below\"\n >{{actionButtonText}}</div>\n <lib-multi-action-button\n *ngIf=\"hasMultiActions\"\n [actions]=\"saveActions\"\n (actionRequested)=\"actionClicked($event)\"\n ></lib-multi-action-button>\n </div>\n </div>\n <div class=\"form-header-group badges-container\">\n <div *ngFor=\"let badge of headerBadges\" class=\"header-badge-container {{badge.class}}\">\n <span *ngIf=\"badge.circle\" class=\"circle {{badge.circle}}\"></span>\n <span class=\"badge-label\">{{badge.label}}</span>\n </div>\n </div>\n</div>\n", styles: [":host{position:relative;width:100%;margin-bottom:.625rem;display:flex;justify-content:center;padding-left:3.125rem;padding-right:3.125rem}.form-header-container{display:flex;flex-direction:column;width:100%;padding-right:var(--paddingMedium);max-width:68.75rem}.form-header-container.show-more-actions .form-title-container{max-width:calc(100% - 23.4375rem)}.form-header-container.show-more-actions .header-actions-container{min-width:23.4375rem}.form-header-container .form-header-group{display:flex;flex-direction:row;justify-content:space-between;align-items:center;width:100%}.form-header-container .form-header-group.badges-container{justify-content:flex-start;margin-left:1.875rem;margin-top:.3125rem;gap:.625rem}.form-header-container .form-title-container{display:flex;flex-direction:row;justify-content:flex-start;max-width:calc(100% - 12.5rem)}.form-header-container .form-title-container .form-header-title-text{overflow:hidden;display:block;white-space:nowrap;text-overflow:ellipsis}.form-header-container .form-title-container .form-title{width:100%;flex:1 1 auto;font-weight:700;font-size:1.375rem;color:var(--tableText);margin-left:.4375rem;min-width:8.125rem;text-wrap:nowrap}.form-header-container .form-title-container .form-title.title-name{color:var(--primary);margin-left:.3125rem}.form-header-container .form-title-container .form-title-back-arrow{display:flex;align-items:center;justify-content:flex-start;transform:scaleX(1.25);margin-left:var(--marginSmall);width:1.325rem;min-width:1.325rem;padding-left:.125rem;cursor:pointer}.form-header-container .form-title-container .form-title-back-arrow:hover{background-color:#fff;border-radius:var(--inputBorderRadius);filter:brightness(90%);transition:.3s}.form-header-container .form-title-container .form-title-back-arrow:active{background-color:#fff;border-radius:var(--inputBorderRadius);filter:brightness(80%);transition:.3s}.form-header-container .form-title-container .form-title-back-arrow .form-title-back-arrow-icon{font-family:icomoon!important;font-size:1rem;height:1rem;font-weight:600;margin-top:.05rem;color:var(--tableText)}.form-header-container .form-title-container .form-title-back-arrow .form-title-back-button-line{border-color:var(--tableText);border-style:solid;border-left-width:.0625rem;border-right-width:.0625rem;width:.875rem;position:absolute;left:.5rem}.form-header-container .header-actions-container{display:flex;flex-direction:row;min-width:11.25rem;justify-content:flex-end}.form-header-container .header-actions-container .save-button{min-width:4.0625rem;height:2.0625rem;text-transform:none}.form-header-container .header-actions-container .save-button.save-disabled{filter:grayscale(1);opacity:.3;cursor:not-allowed}.form-header-container .header-actions-container .save-button.save-disabled:active{transform:translateY(0);background:var(--primary)}.more-actions-container{width:9.375rem;height:2.0625rem;display:flex;flex-direction:row;align-items:center;justify-content:center;border-radius:.3125rem;position:relative;cursor:pointer;z-index:999999;margin-right:1.25rem}.more-actions-container .more-actions-button{height:100%;width:100%;background-color:var(--inputBorder);display:flex;flex-direction:row;align-items:center;justify-content:center;border-radius:.3125rem;position:relative;cursor:pointer}.more-actions-container .more-actions-button:hover{outline:0;filter:brightness(95%)}.more-actions-container .more-actions-label{display:flex;flex-direction:row;align-items:center;justify-content:space-between;width:100%;margin-left:.9375rem;margin-right:.625rem}.more-actions-container .more-actions-label .more-actions-arrow{background-image:url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22utf-8%22%3F%3E%3C!-- Generator%3A Adobe Illustrator 23.0.3%2C SVG Export Plug-In . SVG Version%3A 6.00 Build 0) --%3E%3Csvg id%3D'Stroke_Color' style%3D'enable-background%3Anew 0 0 20.2 10.8%3B' version%3D'1.1' viewBox%3D'0 0 20.2 10.8' x%3D'0px' xml%3Aspace%3D'preserve' xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' y%3D'0px'%3E%3Cstyle type%3D'text%2Fcss'%3E%09.st0 %7B fill%3A %23668291%3B %7D%3C%2Fstyle%3E %3Cg%3E%09%3Cpath class%3D'st0' d%3D'M19.8%2C1.7c0%2C0.4-0.1%2C0.7-0.4%2C0.9l-8.5%2C7.3c-0.5%2C0.4-1.2%2C0.4-1.6%2C0L0.7%2C2.7C0.2%2C2.2%2C0.2%2C1.5%2C0.6%2C0.9%09%09c0.5-0.5%2C1.2-0.6%2C1.8-0.1l7.7%2C6.6l7.7-6.6c0.5-0.5%2C1.3-0.4%2C1.8%2C0.1C19.7%2C1.2%2C19.8%2C1.5%2C19.8%2C1.7z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E\");background-size:1.25rem .625rem;width:1.25rem;height:.625rem;transition:.3s}.more-actions-container .more-actions-label .more-actions-text{color:var(--tableText);font-weight:600}.more-actions-container .more-actions-list{display:flex;flex-direction:column;background-color:var(--white);position:absolute;top:2.0625rem;width:100%;box-shadow:0 .1875rem .3125rem .0625rem var(--boxShadow);border-radius:.3125rem}.more-actions-container .more-actions-item{display:flex;flex-direction:row;align-items:center;height:1.5625rem;width:100%;padding-left:.9375rem;color:var(--tableText);cursor:pointer}.more-actions-container .more-actions-item:hover{background-color:var(--inputBorder)}.more-actions-container.more-actions-open .more-actions-arrow{transform:rotate(180deg)}.form-header-toggle-container{display:flex;flex-direction:row;align-items:center;margin-right:1.25rem}.form-header-toggle-container .form-header-toggle{display:flex;flex-direction:row;width:1.875rem;height:1.125rem;border-radius:.625rem;border-color:var(--inputBorder);border-style:solid;border-width:var(--inputBorderWidth);margin-left:.3125rem;cursor:pointer;position:relative;margin-right:.3125rem}.form-header-toggle-container .form-header-toggle:hover{filter:brightness(90%)}.form-header-toggle-container .form-header-toggle:active{transform:translateY(.0625rem);filter:brightness(80%)}.form-header-toggle-container .form-header-toggle .form-toggle-switch{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;height:100%;margin-left:.1875rem;position:absolute;transition:.5s;left:0}.form-header-toggle-container .form-header-toggle .form-toggle-switch.toggle-right{left:.625rem}.form-header-toggle-container .form-header-toggle .form-toggle-switch.toggle-right .form-toggle-indicator{border-color:var(--red)}.form-header-toggle-container .form-header-toggle .form-toggle-switch .form-toggle-indicator{height:.625rem;border-color:var(--green);border-style:solid;border-left-width:.0625rem;border-right-width:.0625rem;position:relative;margin-left:.125rem}.form-header-toggle-container .toggle-option-text{font-size:.8125rem;font-weight:600;color:var(--placeholder);cursor:pointer}.form-header-toggle-container .toggle-option-text:hover{filter:brightness(90%)}.form-header-toggle-container .toggle-option-text:hover.toggle-option-selected{filter:unset}.form-header-toggle-container .toggle-option-text.toggle-option-selected{color:var(--tableText);cursor:default}.header-badge-container{height:1.875rem;display:flex;flex-direction:row;align-items:center;border-radius:1.875rem;padding:0rem .75rem;font-weight:600;color:var(--tableText);background:var(--inputBorder)}.header-badge-container.online{background-color:var(--greenShadow)}.header-badge-container.unreg{background-color:var(--redShadow);color:var(--red)}.header-badge-container .badge-label{margin-left:.3125rem}.header-badge-container.verified{background-color:var(--primary);color:var(--white)}.header-badge-container .circle.false{background-color:var(--white)}.header-badge-container .circle.verified{font-size:1.2rem;color:var(--white);font-family:icomoon;background-color:transparent;width:1.2rem;height:1.2rem}.header-badge-container .circle.verified:before{content:\"\\e958\"}.header-badge-container.unknown{background-color:var(--highlightedOpaque)}.header-badge-container.unknown .circle{background-color:var(--highlighted)}\n"] }]
|
|
8938
9052
|
}], ctorParameters: function () { return []; }, propDecorators: { data: [{
|
|
8939
9053
|
type: Input
|
|
8940
9054
|
}], badges: [{
|
|
@@ -8957,35 +9071,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
8957
9071
|
type: Input
|
|
8958
9072
|
}], showHeaderButton: [{
|
|
8959
9073
|
type: Input
|
|
9074
|
+
}], multiActions: [{
|
|
9075
|
+
type: Input
|
|
8960
9076
|
}], formViewChange: [{
|
|
8961
9077
|
type: Output
|
|
8962
9078
|
}], actionRequested: [{
|
|
8963
9079
|
type: Output
|
|
8964
|
-
}]
|
|
8965
|
-
|
|
8966
|
-
class MultiActionButtonComponent {
|
|
8967
|
-
constructor() {
|
|
8968
|
-
this.actionRequested = new EventEmitter();
|
|
8969
|
-
this.showMoreActions = false;
|
|
8970
|
-
}
|
|
8971
|
-
showMoreActionsMenu() {
|
|
8972
|
-
this.showMoreActions = true;
|
|
8973
|
-
}
|
|
8974
|
-
closeMoreActionsMenu() {
|
|
8975
|
-
this.showMoreActions = false;
|
|
8976
|
-
}
|
|
8977
|
-
actionClicked(action) {
|
|
8978
|
-
this.actionRequested.emit(action);
|
|
8979
|
-
}
|
|
8980
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MultiActionButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8981
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: MultiActionButtonComponent, selector: "lib-multi-action-button", inputs: { actions: "actions" }, outputs: { actionRequested: "actionRequested" }, ngImport: i0, template: "<div class=\"multi-action-button-container\">\n <div class=\"form-field-action\"\n *ngIf=\"actions\"\n (clickOutside)=\"closeMoreActionsMenu()\"\n >\n <div class=\"primary-action-button\" (click)=\"actionClicked(actions[0])\">{{actions[0].label}}</div>\n <div class=\"secondary-action-button\"\n *ngIf=\"actions.length > 1\"\n (click)=\"showMoreActionsMenu()\"\n ><div class=\"secondary-actions-arrow icon-prev\"></div></div>\n </div>\n <div class=\"multi-action-button-dropdown\" *ngIf=\"showMoreActions\">\n <ul>\n <li *ngFor=\"let action of actions\" class=\"confirm-item-name\" (click)=\"actionClicked(action)\">{{action.label}}</li>\n </ul>\n </div>\n</div>\n", styles: [".multi-action-button-container{position:absolute;right:.9375rem;top:.625rem;z-index:999999}.multi-action-button-container .form-field-action{display:flex;flex-direction:row;align-items:center;padding:0;height:1.5625rem}.multi-action-button-container .form-field-action .primary-action-button{padding-left:.625rem;padding-right:.625rem;border-right-style:solid;height:100%;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.875rem;background:var(--primary);color:var(--offWhite_ALWAYS);cursor:pointer;border-top-left-radius:var(--inputBorderRadius);border-bottom-left-radius:var(--inputBorderRadius);border-color:var(--stroke);box-shadow:0 .1875rem .5625rem 0 var(--primaryColorOpaque)}.multi-action-button-container .form-field-action .primary-action-button:hover{outline:0;filter:brightness(90%);box-shadow:0 .125rem .1875rem 0 var(--primaryColorOpaque)}.multi-action-button-container .form-field-action .primary-action-button:active{background:#648293;box-shadow:none;transform:translateY(.0625rem)}.multi-action-button-container .form-field-action .secondary-action-button{height:100%;width:1.875rem;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:1rem;background:var(--primary);color:var(--white);cursor:pointer;border-top-right-radius:var(--inputBorderRadius);border-bottom-right-radius:var(--inputBorderRadius);border-color:var(--stroke);box-shadow:0 .1875rem .5625rem 0 var(--primaryColorOpaque)}.multi-action-button-container .form-field-action .secondary-action-button:hover{outline:0;filter:brightness(90%);box-shadow:0 .125rem .1875rem 0 var(--primaryColorOpaque)}.multi-action-button-container .form-field-action .secondary-action-button:active{background:#648293;box-shadow:none;transform:translateY(.0625rem)}.multi-action-button-container .form-field-action .secondary-action-button .secondary-actions-arrow{transform:rotate(270deg)}.multi-action-button-container .multi-action-button-dropdown{position:absolute;background:var(--background);width:100%}.multi-action-button-container .multi-action-button-dropdown ul{width:100%;margin:0;padding:0}.multi-action-button-container .multi-action-button-dropdown ul li{list-style-type:none;padding:.3125rem .3125rem .3125rem .625rem;cursor:pointer}.multi-action-button-container .multi-action-button-dropdown ul li:hover{background-color:var(--inputBorder)}\n"], dependencies: [{ kind: "directive", type: i1$4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ClickOutsideDirective, selector: "[clickOutside]", inputs: ["clickOutsideEnabled", "attachOutsideOnClick", "delayClickOutsideInit", "emitOnBlur", "exclude", "excludeBeforeClick", "clickOutsideEvents"], outputs: ["clickOutside"] }] }); }
|
|
8982
|
-
}
|
|
8983
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: MultiActionButtonComponent, decorators: [{
|
|
8984
|
-
type: Component,
|
|
8985
|
-
args: [{ selector: 'lib-multi-action-button', template: "<div class=\"multi-action-button-container\">\n <div class=\"form-field-action\"\n *ngIf=\"actions\"\n (clickOutside)=\"closeMoreActionsMenu()\"\n >\n <div class=\"primary-action-button\" (click)=\"actionClicked(actions[0])\">{{actions[0].label}}</div>\n <div class=\"secondary-action-button\"\n *ngIf=\"actions.length > 1\"\n (click)=\"showMoreActionsMenu()\"\n ><div class=\"secondary-actions-arrow icon-prev\"></div></div>\n </div>\n <div class=\"multi-action-button-dropdown\" *ngIf=\"showMoreActions\">\n <ul>\n <li *ngFor=\"let action of actions\" class=\"confirm-item-name\" (click)=\"actionClicked(action)\">{{action.label}}</li>\n </ul>\n </div>\n</div>\n", styles: [".multi-action-button-container{position:absolute;right:.9375rem;top:.625rem;z-index:999999}.multi-action-button-container .form-field-action{display:flex;flex-direction:row;align-items:center;padding:0;height:1.5625rem}.multi-action-button-container .form-field-action .primary-action-button{padding-left:.625rem;padding-right:.625rem;border-right-style:solid;height:100%;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.875rem;background:var(--primary);color:var(--offWhite_ALWAYS);cursor:pointer;border-top-left-radius:var(--inputBorderRadius);border-bottom-left-radius:var(--inputBorderRadius);border-color:var(--stroke);box-shadow:0 .1875rem .5625rem 0 var(--primaryColorOpaque)}.multi-action-button-container .form-field-action .primary-action-button:hover{outline:0;filter:brightness(90%);box-shadow:0 .125rem .1875rem 0 var(--primaryColorOpaque)}.multi-action-button-container .form-field-action .primary-action-button:active{background:#648293;box-shadow:none;transform:translateY(.0625rem)}.multi-action-button-container .form-field-action .secondary-action-button{height:100%;width:1.875rem;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:1rem;background:var(--primary);color:var(--white);cursor:pointer;border-top-right-radius:var(--inputBorderRadius);border-bottom-right-radius:var(--inputBorderRadius);border-color:var(--stroke);box-shadow:0 .1875rem .5625rem 0 var(--primaryColorOpaque)}.multi-action-button-container .form-field-action .secondary-action-button:hover{outline:0;filter:brightness(90%);box-shadow:0 .125rem .1875rem 0 var(--primaryColorOpaque)}.multi-action-button-container .form-field-action .secondary-action-button:active{background:#648293;box-shadow:none;transform:translateY(.0625rem)}.multi-action-button-container .form-field-action .secondary-action-button .secondary-actions-arrow{transform:rotate(270deg)}.multi-action-button-container .multi-action-button-dropdown{position:absolute;background:var(--background);width:100%}.multi-action-button-container .multi-action-button-dropdown ul{width:100%;margin:0;padding:0}.multi-action-button-container .multi-action-button-dropdown ul li{list-style-type:none;padding:.3125rem .3125rem .3125rem .625rem;cursor:pointer}.multi-action-button-container .multi-action-button-dropdown ul li:hover{background-color:var(--inputBorder)}\n"] }]
|
|
8986
|
-
}], propDecorators: { actions: [{
|
|
8987
|
-
type: Input
|
|
8988
|
-
}], actionRequested: [{
|
|
9080
|
+
}], multiActionRequested: [{
|
|
8989
9081
|
type: Output
|
|
8990
9082
|
}] } });
|
|
8991
9083
|
|
|
@@ -9495,7 +9587,7 @@ class TerminatorFormComponent extends ProjectableForm {
|
|
|
9495
9587
|
});
|
|
9496
9588
|
}
|
|
9497
9589
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TerminatorFormComponent, deps: [{ token: TerminatorFormService }, { token: SchemaService }, { token: GrowlerService }, { token: SHAREDZ_EXTENSION }, { token: SETTINGS_SERVICE }, { token: ZITI_DATA_SERVICE }, { token: i4.Router }, { token: i4.ActivatedRoute }, { token: i1$4.Location }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
9498
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TerminatorFormComponent, selector: "lib-configuration", inputs: { formData: "formData", errors: "errors" }, outputs: { close: "close" }, usesInheritance: true, ngImport: i0, template: "<div class=\"projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n tabindex=\"0\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"(formData.id ? 'Terminator Details' : 'Create Terminator')\"\n [moreActions]=\"formData.moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n [saveDisabled]=\"svc.saveDisabled || formDataInvalid\"\n ></lib-form-header>\n <div class=\"terminator-form-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" [hidden]=\"formView !== 'simple'\">\n <div class=\"form-group-column one-half\">\n <lib-form-field-container\n [title]=\"'Service'\"\n [contentStyle]=\"'z-index: 10003'\"\n >\n <input class=\"form-field-input read-only\" [(ngModel)]=\"selectedServiceNamedAttribute\" [disabled]=\"true\"/>\n <!--<lib-tag-selector\n [(selectedNamedAttributes)]=\"svc.selectedServiceNamedAttributes\"\n [availableNamedAttributes]=\"svc.serviceNamedAttributes\"\n [placeholder]=\"'Select a service'\"\n (addNamedAttribute)=\"serviceAttributeChanged($event)\"\n (namedAttributeRemoved)=\"serviceAttributeChanged()\"\n ></lib-tag-selector>-->\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Router'\"\n [contentStyle]=\"'z-index: 10002'\"\n >\n <input class=\"form-field-input read-only\" [(ngModel)]=\"selectedRouterNamedAttribute\" [disabled]=\"true\"/>\n <!--<lib-tag-selector\n [(selectedNamedAttributes)]=\"svc.selectedRouterNamedAttributes\"\n [availableNamedAttributes]=\"svc.routerNamedAttributes\"\n [placeholder]=\"'Select a router'\"\n (addNamedAttribute)=\"routerAttributeChanged($event)\"\n (namedAttributeRemoved)=\"routerAttributeChanged()\"\n ></lib-tag-selector>-->\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Identity'\"\n [contentStyle]=\"'z-index: 10001'\"\n >\n <input class=\"form-field-input read-only\" [(ngModel)]=\"selectedIdentityNamedAttribute\" [disabled]=\"true\"/>\n <!--<lib-tag-selector\n [(selectedNamedAttributes)]=\"svc.selectedIdentityNamedAttributes\"\n [availableNamedAttributes]=\"svc.identityNamedAttributes\"\n [placeholder]=\"'Select an identity'\"\n (addNamedAttribute)=\"identityAttributeChanged($event)\"\n (namedAttributeRemoved)=\"identityAttributeChanged()\"\n ></lib-tag-selector>-->\n </lib-form-field-container>\n </div>\n <div class=\"form-group-column one-half\">\n <lib-form-field-container\n [title]=\"'Address'\"\n [contentStyle]=\"'z-index: 1001'\"\n >\n <input class=\"form-field-input read-only\" [disabled]=\"true\" [(ngModel)]=\"formData.address\"/>\n </lib-form-field-container>\n <lib-form-field-container\n [showHeader]=\"false\"\n [layout]=\"'row'\"\n [contentStyle]=\"'z-index: 1001'\"\n >\n <div class=\"form-field-label-container\">\n <span class=\"form-field-title\">Binding</span>\n <input class=\"form-field-input\" [disabled]=\"true\" [(ngModel)]=\"formData.binding\"/>\n </div>\n <div class=\"form-field-label-container\">\n <span class=\"form-field-title\">Identity Secret</span>\n <input class=\"form-field-input\" [disabled]=\"true\" [(ngModel)]=\"formData.identitySecret\"/>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [layout]=\"'row'\"\n [showHeader]=\"false\"\n >\n <div class=\"form-field-label-container\">\n <span class=\"form-field-title\">Hosting Cost</span>\n <input class=\"form-field-input\" [disabled]=\"true\" [(ngModel)]=\"formData.cost\" type=\"number\"/>\n </div>\n <div class=\"form-field-label-container\">\n <span class=\"form-field-title\">Precedence</span>\n <select\n [(ngModel)]=\"formData.precedence\"\n [disabled]=\"true\"\n id=\"hostingPrecedence\"\n class=\"form-field-dropdown read-only\"\n >\n <option value=\"default\">Default</option>\n <option value=\"required\">Required</option>\n <option value=\"failed\">Failed</option>\n </select>\n </div>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>\n", styles: [".terminator-form-container{display:flex;flex-direction:column;height:100%;width:100%;align-items:center;gap:var(--gapXL)}.config-type-select.disabled{opacity:.7;pointer-events:none}::ng-deep .terminator-form-container select:disabled,::ng-deep .terminator-form-container input:disabled{opacity:.75!important;cursor:text;background-color:var(--stroke)!important}@media (max-width: 1524px){.terminator-form-container .projectable-form-main-column{max-width:38.75rem}}\n"], dependencies: [{ kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.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: i5.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i5.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: FormHeaderComponent, selector: "lib-form-header", inputs: ["data", "badges", "title", "moreActions", "formView", "saveDisabled", "saveTooltip", "actionButtonText", "moreActionsText", "showHeaderToggle", "showHeaderButton"], outputs: ["formViewChange", "actionRequested"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }, { kind: "component", type: LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }, { kind: "component", type: JsonViewComponent, selector: "lib-json-view", inputs: ["data", "schema", "readOnly", "jsonInvalid", "showCopy", "showLineNumbers"], outputs: ["dataChange", "jsonChange", "jsonInvalidChange"] }] }); }
|
|
9590
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TerminatorFormComponent, selector: "lib-configuration", inputs: { formData: "formData", errors: "errors" }, outputs: { close: "close" }, usesInheritance: true, ngImport: i0, template: "<div class=\"projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n tabindex=\"0\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"(formData.id ? 'Terminator Details' : 'Create Terminator')\"\n [moreActions]=\"formData.moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n [saveDisabled]=\"svc.saveDisabled || formDataInvalid\"\n ></lib-form-header>\n <div class=\"terminator-form-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" [hidden]=\"formView !== 'simple'\">\n <div class=\"form-group-column one-half\">\n <lib-form-field-container\n [title]=\"'Service'\"\n [contentStyle]=\"'z-index: 10003'\"\n >\n <input class=\"form-field-input read-only\" [(ngModel)]=\"selectedServiceNamedAttribute\" [disabled]=\"true\"/>\n <!--<lib-tag-selector\n [(selectedNamedAttributes)]=\"svc.selectedServiceNamedAttributes\"\n [availableNamedAttributes]=\"svc.serviceNamedAttributes\"\n [placeholder]=\"'Select a service'\"\n (addNamedAttribute)=\"serviceAttributeChanged($event)\"\n (namedAttributeRemoved)=\"serviceAttributeChanged()\"\n ></lib-tag-selector>-->\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Router'\"\n [contentStyle]=\"'z-index: 10002'\"\n >\n <input class=\"form-field-input read-only\" [(ngModel)]=\"selectedRouterNamedAttribute\" [disabled]=\"true\"/>\n <!--<lib-tag-selector\n [(selectedNamedAttributes)]=\"svc.selectedRouterNamedAttributes\"\n [availableNamedAttributes]=\"svc.routerNamedAttributes\"\n [placeholder]=\"'Select a router'\"\n (addNamedAttribute)=\"routerAttributeChanged($event)\"\n (namedAttributeRemoved)=\"routerAttributeChanged()\"\n ></lib-tag-selector>-->\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Identity'\"\n [contentStyle]=\"'z-index: 10001'\"\n >\n <input class=\"form-field-input read-only\" [(ngModel)]=\"selectedIdentityNamedAttribute\" [disabled]=\"true\"/>\n <!--<lib-tag-selector\n [(selectedNamedAttributes)]=\"svc.selectedIdentityNamedAttributes\"\n [availableNamedAttributes]=\"svc.identityNamedAttributes\"\n [placeholder]=\"'Select an identity'\"\n (addNamedAttribute)=\"identityAttributeChanged($event)\"\n (namedAttributeRemoved)=\"identityAttributeChanged()\"\n ></lib-tag-selector>-->\n </lib-form-field-container>\n </div>\n <div class=\"form-group-column one-half\">\n <lib-form-field-container\n [title]=\"'Address'\"\n [contentStyle]=\"'z-index: 1001'\"\n >\n <input class=\"form-field-input read-only\" [disabled]=\"true\" [(ngModel)]=\"formData.address\"/>\n </lib-form-field-container>\n <lib-form-field-container\n [showHeader]=\"false\"\n [layout]=\"'row'\"\n [contentStyle]=\"'z-index: 1001'\"\n >\n <div class=\"form-field-label-container\">\n <span class=\"form-field-title\">Binding</span>\n <input class=\"form-field-input\" [disabled]=\"true\" [(ngModel)]=\"formData.binding\"/>\n </div>\n <div class=\"form-field-label-container\">\n <span class=\"form-field-title\">Identity Secret</span>\n <input class=\"form-field-input\" [disabled]=\"true\" [(ngModel)]=\"formData.identitySecret\"/>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [layout]=\"'row'\"\n [showHeader]=\"false\"\n >\n <div class=\"form-field-label-container\">\n <span class=\"form-field-title\">Hosting Cost</span>\n <input class=\"form-field-input\" [disabled]=\"true\" [(ngModel)]=\"formData.cost\" type=\"number\"/>\n </div>\n <div class=\"form-field-label-container\">\n <span class=\"form-field-title\">Precedence</span>\n <select\n [(ngModel)]=\"formData.precedence\"\n [disabled]=\"true\"\n id=\"hostingPrecedence\"\n class=\"form-field-dropdown read-only\"\n >\n <option value=\"default\">Default</option>\n <option value=\"required\">Required</option>\n <option value=\"failed\">Failed</option>\n </select>\n </div>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>\n", styles: [".terminator-form-container{display:flex;flex-direction:column;height:100%;width:100%;align-items:center;gap:var(--gapXL)}.config-type-select.disabled{opacity:.7;pointer-events:none}::ng-deep .terminator-form-container select:disabled,::ng-deep .terminator-form-container input:disabled{opacity:.75!important;cursor:text;background-color:var(--stroke)!important}@media (max-width: 1524px){.terminator-form-container .projectable-form-main-column{max-width:38.75rem}}\n"], dependencies: [{ kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.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: i5.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i5.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: FormHeaderComponent, selector: "lib-form-header", inputs: ["data", "badges", "title", "moreActions", "formView", "saveDisabled", "saveTooltip", "actionButtonText", "moreActionsText", "showHeaderToggle", "showHeaderButton", "multiActions"], outputs: ["formViewChange", "actionRequested", "multiActionRequested"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }, { kind: "component", type: LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }, { kind: "component", type: JsonViewComponent, selector: "lib-json-view", inputs: ["data", "schema", "readOnly", "jsonInvalid", "showCopy", "showLineNumbers"], outputs: ["dataChange", "jsonChange", "jsonInvalidChange"] }] }); }
|
|
9499
9591
|
}
|
|
9500
9592
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TerminatorFormComponent, decorators: [{
|
|
9501
9593
|
type: Component,
|
|
@@ -10875,7 +10967,6 @@ class IdentitiesPageComponent extends ListPageComponent {
|
|
|
10875
10967
|
this.extService = extService;
|
|
10876
10968
|
this.title = 'Identities';
|
|
10877
10969
|
this.isLoading = false;
|
|
10878
|
-
this.identityRoleAttributes = [];
|
|
10879
10970
|
this.formDataChanged = false;
|
|
10880
10971
|
}
|
|
10881
10972
|
ngOnInit() {
|
|
@@ -10890,7 +10981,7 @@ class IdentitiesPageComponent extends ListPageComponent {
|
|
|
10890
10981
|
}
|
|
10891
10982
|
}));
|
|
10892
10983
|
this.zacWrapperService.resetZacEvents();
|
|
10893
|
-
this.getIdentityRoleAttributes();
|
|
10984
|
+
this.svc.getIdentityRoleAttributes();
|
|
10894
10985
|
super.ngOnInit();
|
|
10895
10986
|
}
|
|
10896
10987
|
headerActionClicked(action) {
|
|
@@ -10915,7 +11006,7 @@ class IdentitiesPageComponent extends ListPageComponent {
|
|
|
10915
11006
|
this.svc.sideModalOpen = false;
|
|
10916
11007
|
if (event?.refresh) {
|
|
10917
11008
|
this.refreshData();
|
|
10918
|
-
this.getIdentityRoleAttributes();
|
|
11009
|
+
this.svc.getIdentityRoleAttributes();
|
|
10919
11010
|
}
|
|
10920
11011
|
}
|
|
10921
11012
|
dataChanged(event) {
|
|
@@ -11001,11 +11092,6 @@ class IdentitiesPageComponent extends ListPageComponent {
|
|
|
11001
11092
|
deleteItem(item) {
|
|
11002
11093
|
this.openBulkDelete([item], 'identity');
|
|
11003
11094
|
}
|
|
11004
|
-
getIdentityRoleAttributes() {
|
|
11005
|
-
this.svc.getIdentitiesRoleAttributes().then((result) => {
|
|
11006
|
-
this.identityRoleAttributes = result.data;
|
|
11007
|
-
});
|
|
11008
|
-
}
|
|
11009
11095
|
openIdentityVisualizer(identity) {
|
|
11010
11096
|
this.dialogRef = this.dialogForm.open(IdentityServicePathComponent, {
|
|
11011
11097
|
data: {
|
|
@@ -11619,10 +11705,12 @@ class ServiceFormService {
|
|
|
11619
11705
|
this.associatedTerminatorNames = [];
|
|
11620
11706
|
this.associatedTerminatorsMap = {};
|
|
11621
11707
|
this.associatedTerminatorsTotal = 0;
|
|
11708
|
+
this.associatedTerminatorsFilter = '';
|
|
11622
11709
|
this.associatedServicePolicies = [];
|
|
11623
11710
|
this.associatedServicePolicyNames = [];
|
|
11624
11711
|
this.associatedServicePoliciesMap = {};
|
|
11625
11712
|
this.associatedServicePoliciesTotal = 0;
|
|
11713
|
+
this.associatedServicePoliciesFilter = '';
|
|
11626
11714
|
this.associatedConfigsLoading = false;
|
|
11627
11715
|
this.associatedServicePoliciesLoading = false;
|
|
11628
11716
|
this.associatedTerminatorsLoading = false;
|
|
@@ -11641,6 +11729,8 @@ class ServiceFormService {
|
|
|
11641
11729
|
'var(--formSubGroup)'
|
|
11642
11730
|
];
|
|
11643
11731
|
this.subscription = new Subscription();
|
|
11732
|
+
this.getAssociatedServicePoliciesDebounced = debounce(this.getAssociatedServicePolicies.bind(this), 300);
|
|
11733
|
+
this.getAssociatedTerminatorsDebounced = debounce(this.getAssociatedTerminators.bind(this), 300);
|
|
11644
11734
|
this._apiData = {};
|
|
11645
11735
|
}
|
|
11646
11736
|
resetFormData() {
|
|
@@ -11684,11 +11774,24 @@ class ServiceFormService {
|
|
|
11684
11774
|
throw resp;
|
|
11685
11775
|
});
|
|
11686
11776
|
}
|
|
11687
|
-
getAssociatedServicePolicies() {
|
|
11777
|
+
getAssociatedServicePolicies(nameFilter) {
|
|
11688
11778
|
const paging = this.zitiService.DEFAULT_PAGING;
|
|
11689
11779
|
paging.total = 5;
|
|
11690
11780
|
this.associatedServicePoliciesLoading = true;
|
|
11691
|
-
|
|
11781
|
+
const filters = [];
|
|
11782
|
+
if (!isEmpty(nameFilter)) {
|
|
11783
|
+
paging.noSearch = false;
|
|
11784
|
+
filters.push({
|
|
11785
|
+
columnId: 'name',
|
|
11786
|
+
value: nameFilter,
|
|
11787
|
+
label: nameFilter,
|
|
11788
|
+
filterName: 'Service Policy Name',
|
|
11789
|
+
type: 'TEXTINPUT',
|
|
11790
|
+
verb: 'icontains'
|
|
11791
|
+
});
|
|
11792
|
+
}
|
|
11793
|
+
this.associatedServicePoliciesFilter = nameFilter;
|
|
11794
|
+
this.zitiService.getSubdata('services', this.formData.id, 'service-policies', paging, undefined, filters).then((result) => {
|
|
11692
11795
|
this.associatedServicePolicies = result.data;
|
|
11693
11796
|
this.associatedServicePoliciesTotal = result.meta?.pagination.totalCount || 0;
|
|
11694
11797
|
this.associatedServicePolicyNames = this.associatedServicePolicies.map((policy) => {
|
|
@@ -11698,8 +11801,8 @@ class ServiceFormService {
|
|
|
11698
11801
|
});
|
|
11699
11802
|
if (this.associatedServicePoliciesTotal > 5) {
|
|
11700
11803
|
let roleAttributes = cloneDeep(this.formData.roleAttributes);
|
|
11701
|
-
roleAttributes =
|
|
11702
|
-
return '%23' + attribute;
|
|
11804
|
+
roleAttributes = map$1(roleAttributes, (attribute) => {
|
|
11805
|
+
return ('%23' + attribute);
|
|
11703
11806
|
});
|
|
11704
11807
|
roleAttributes.push('%40' + this.formData.id);
|
|
11705
11808
|
let urlParam = '';
|
|
@@ -11718,7 +11821,7 @@ class ServiceFormService {
|
|
|
11718
11821
|
};
|
|
11719
11822
|
localStorage.setItem('search_filters', JSON.stringify([searchFilter]));
|
|
11720
11823
|
this.associatedServicePolicies.push({
|
|
11721
|
-
name: '
|
|
11824
|
+
name: 'view all results ',
|
|
11722
11825
|
href: '/service-policies?serviceRoles=' + urlParam,
|
|
11723
11826
|
linkClass: 'preview-more-results',
|
|
11724
11827
|
//iconClass: 'icon-open',
|
|
@@ -11729,12 +11832,28 @@ class ServiceFormService {
|
|
|
11729
11832
|
this.associatedServicePoliciesLoading = false;
|
|
11730
11833
|
});
|
|
11731
11834
|
}
|
|
11732
|
-
getAssociatedTerminators() {
|
|
11835
|
+
getAssociatedTerminators(nameFilter) {
|
|
11733
11836
|
this.associatedTerminatorsLoading = true;
|
|
11734
|
-
this.
|
|
11837
|
+
this.associatedTerminatorsFilter = nameFilter;
|
|
11838
|
+
const paging = this.zitiService.DEFAULT_PAGING;
|
|
11839
|
+
paging.total = 5;
|
|
11840
|
+
paging.sort = 'createdAt';
|
|
11841
|
+
const filters = [];
|
|
11842
|
+
if (!isEmpty(nameFilter)) {
|
|
11843
|
+
paging.noSearch = false;
|
|
11844
|
+
filters.push({
|
|
11845
|
+
columnId: 'service.name',
|
|
11846
|
+
value: nameFilter,
|
|
11847
|
+
label: nameFilter,
|
|
11848
|
+
filterName: 'Service Name',
|
|
11849
|
+
type: 'TEXTINPUT',
|
|
11850
|
+
verb: 'icontains'
|
|
11851
|
+
});
|
|
11852
|
+
}
|
|
11853
|
+
this.zitiService.getSubdata('services', this.formData.id, 'terminators', paging, undefined, filters).then((result) => {
|
|
11735
11854
|
this.associatedTerminators = result.data;
|
|
11736
11855
|
this.associatedTerminatorsTotal = result.meta?.pagination.totalCount || 0;
|
|
11737
|
-
this.associatedTerminatorNames = this.associatedTerminators
|
|
11856
|
+
this.associatedTerminatorNames = map$1(this.associatedTerminators, (terminator) => {
|
|
11738
11857
|
this.associatedTerminatorsMap[terminator.id] = terminator.binding + ': ' + terminator.address;
|
|
11739
11858
|
terminator.name = terminator.router.name + ': ' + terminator.address;
|
|
11740
11859
|
terminator.href = '/terminators/' + terminator.id;
|
|
@@ -11751,7 +11870,7 @@ class ServiceFormService {
|
|
|
11751
11870
|
};
|
|
11752
11871
|
localStorage.setItem('search_filters', JSON.stringify([searchFilter]));
|
|
11753
11872
|
this.associatedTerminators.push({
|
|
11754
|
-
name: '
|
|
11873
|
+
name: 'view all results ',
|
|
11755
11874
|
href: '/terminators?service=' + this.formData.id,
|
|
11756
11875
|
linkClass: 'preview-more-results',
|
|
11757
11876
|
//iconClass: 'icon-open',
|
|
@@ -11821,7 +11940,7 @@ class ServiceFormService {
|
|
|
11821
11940
|
this.routers = result.data;
|
|
11822
11941
|
});
|
|
11823
11942
|
}
|
|
11824
|
-
getAssociatedConfigs() {
|
|
11943
|
+
getAssociatedConfigs(nameFilter) {
|
|
11825
11944
|
this.associatedConfigsLoading = true;
|
|
11826
11945
|
this.zitiService.getSubdata('services', this.formData.id, 'configs').then((result) => {
|
|
11827
11946
|
this.associatedConfigs = result.data;
|
|
@@ -12039,6 +12158,12 @@ class ServiceFormService {
|
|
|
12039
12158
|
}
|
|
12040
12159
|
return isEmpty(this.configErrors);
|
|
12041
12160
|
}
|
|
12161
|
+
get showServicePoliciesFilter() {
|
|
12162
|
+
return !isEmpty(this.associatedServicePoliciesFilter) || this.associatedServicePoliciesTotal > 5;
|
|
12163
|
+
}
|
|
12164
|
+
get showTerminatorsFilter() {
|
|
12165
|
+
return !isEmpty(this.associatedTerminatorsFilter) || this.associatedTerminatorsTotal > 5;
|
|
12166
|
+
}
|
|
12042
12167
|
set apiData(data) {
|
|
12043
12168
|
this._apiData = data;
|
|
12044
12169
|
}
|
|
@@ -12188,8 +12313,9 @@ class ServicePolicyFormService {
|
|
|
12188
12313
|
return svc.name;
|
|
12189
12314
|
});
|
|
12190
12315
|
this.associatedServiceNames = [...this.associatedServiceNames, ...namedAttributes];
|
|
12191
|
-
this.associatedServiceNames = sortBy(this.
|
|
12316
|
+
this.associatedServiceNames = sortBy(this.associatedServiceNames);
|
|
12192
12317
|
this.associatedServiceNames = sortedUniq(this.associatedServiceNames);
|
|
12318
|
+
this.associatedIdentityNames = this.associatedServiceNames.filter(item => item !== undefined);
|
|
12193
12319
|
return this.associatedServices;
|
|
12194
12320
|
});
|
|
12195
12321
|
}
|
|
@@ -12210,6 +12336,7 @@ class ServicePolicyFormService {
|
|
|
12210
12336
|
this.associatedIdentityNames = [...this.associatedIdentityNames, ...namedAttributes];
|
|
12211
12337
|
this.associatedIdentityNames = sortBy(this.associatedIdentityNames);
|
|
12212
12338
|
this.associatedIdentityNames = sortedUniq(this.associatedIdentityNames);
|
|
12339
|
+
this.associatedIdentityNames = this.associatedIdentityNames.filter(item => item !== undefined);
|
|
12213
12340
|
});
|
|
12214
12341
|
}
|
|
12215
12342
|
getAssociatedPostureChecksByAttribute(roleAttributes, namedAttributes) {
|
|
@@ -12357,6 +12484,8 @@ class ServicesPageService extends ListPageServiceClass {
|
|
|
12357
12484
|
os: '',
|
|
12358
12485
|
createdAt: '',
|
|
12359
12486
|
};
|
|
12487
|
+
this.roleAttributes = [];
|
|
12488
|
+
this.selectedRoleAttributes = [];
|
|
12360
12489
|
this.menuItems = [
|
|
12361
12490
|
{ name: 'Edit', action: 'update' },
|
|
12362
12491
|
{ name: 'Delete', action: 'delete' },
|
|
@@ -12379,6 +12508,33 @@ class ServicesPageService extends ListPageServiceClass {
|
|
|
12379
12508
|
});
|
|
12380
12509
|
return roles;
|
|
12381
12510
|
};
|
|
12511
|
+
const self = this;
|
|
12512
|
+
const serviceRolesHeaderComponentParams = {
|
|
12513
|
+
filterType: 'ATTRIBUTE',
|
|
12514
|
+
enableSorting: true,
|
|
12515
|
+
appendAttributeHash: false,
|
|
12516
|
+
getRoleAttributes: () => {
|
|
12517
|
+
return self.roleAttributes;
|
|
12518
|
+
},
|
|
12519
|
+
getNamedAttributes: () => {
|
|
12520
|
+
return [];
|
|
12521
|
+
},
|
|
12522
|
+
getSelectedRoleAttributes: () => {
|
|
12523
|
+
return self.selectedRoleAttributes;
|
|
12524
|
+
},
|
|
12525
|
+
getSelectedNamedAttributes: () => {
|
|
12526
|
+
return [];
|
|
12527
|
+
},
|
|
12528
|
+
setSelectedRoleAttributes: (attributes) => {
|
|
12529
|
+
self.selectedRoleAttributes = attributes;
|
|
12530
|
+
},
|
|
12531
|
+
setSelectedNamedAttributes: (attributes) => {
|
|
12532
|
+
// no-op
|
|
12533
|
+
},
|
|
12534
|
+
getNamedAttributesMap: () => {
|
|
12535
|
+
return {};
|
|
12536
|
+
}
|
|
12537
|
+
};
|
|
12382
12538
|
return [
|
|
12383
12539
|
{
|
|
12384
12540
|
colId: 'name',
|
|
@@ -12408,6 +12564,7 @@ class ServicesPageService extends ListPageServiceClass {
|
|
|
12408
12564
|
field: 'roleAttributes',
|
|
12409
12565
|
headerName: 'Roles',
|
|
12410
12566
|
headerComponent: TableColumnDefaultComponent,
|
|
12567
|
+
headerComponentParams: serviceRolesHeaderComponentParams,
|
|
12411
12568
|
onCellClicked: (data) => {
|
|
12412
12569
|
if (this.hasSelectedText()) {
|
|
12413
12570
|
return;
|
|
@@ -12467,7 +12624,10 @@ class ServicesPageService extends ListPageServiceClass {
|
|
|
12467
12624
|
});
|
|
12468
12625
|
}
|
|
12469
12626
|
getServiceRoleAttributes() {
|
|
12470
|
-
return this.zitiService.get('service-role-attributes', {}, [])
|
|
12627
|
+
return this.zitiService.get('service-role-attributes', {}, []).then((result) => {
|
|
12628
|
+
this.roleAttributes = result.data;
|
|
12629
|
+
return result;
|
|
12630
|
+
});
|
|
12471
12631
|
}
|
|
12472
12632
|
getIdentityNamedAttributes() {
|
|
12473
12633
|
return this.zitiService.get('identities', {}, []).then((result) => {
|
|
@@ -12669,8 +12829,10 @@ class PreviewListComponent {
|
|
|
12669
12829
|
this.allowRemove = false;
|
|
12670
12830
|
this.tooltip = '';
|
|
12671
12831
|
this.showfilter = true;
|
|
12832
|
+
this.localFilter = true;
|
|
12672
12833
|
this.itemSelected = new EventEmitter();
|
|
12673
12834
|
this.itemRemoved = new EventEmitter();
|
|
12835
|
+
this.filterChanged = new EventEmitter();
|
|
12674
12836
|
this.previewItems = [];
|
|
12675
12837
|
this.hideOption = 'asdf';
|
|
12676
12838
|
this.filterFor = '';
|
|
@@ -12694,6 +12856,10 @@ class PreviewListComponent {
|
|
|
12694
12856
|
this.sort();
|
|
12695
12857
|
}
|
|
12696
12858
|
onKeydownEvent() {
|
|
12859
|
+
if (!this.localFilter) {
|
|
12860
|
+
this.filterChanged.emit(this.filterFor);
|
|
12861
|
+
return;
|
|
12862
|
+
}
|
|
12697
12863
|
this.previewItems = [];
|
|
12698
12864
|
for (let i = 0; i < this.allNames.length; i++) {
|
|
12699
12865
|
if (!isEmpty(this.allNames)) {
|
|
@@ -12749,11 +12915,11 @@ class PreviewListComponent {
|
|
|
12749
12915
|
return './' + hrefVal;
|
|
12750
12916
|
}
|
|
12751
12917
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PreviewListComponent, deps: [{ token: i4.Router }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
12752
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: PreviewListComponent, selector: "lib-preview-list", inputs: { label: "label", clickable: "clickable", isLoading: "isLoading", allNames: "allNames", items: "items", allowRemove: "allowRemove", tooltip: "tooltip", showfilter: "showfilter" }, outputs: { itemSelected: "itemSelected", itemRemoved: "itemRemoved" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"listBox row\">\n <input *ngIf=\"showfilter\" (keyup)=\"onKeydownEvent()\" [(ngModel)]=\"filterFor\" placeholder=\"Type to Filter\"/>\n <div class=\"text row\">\n <div *ngIf=\"previewItems.length <= 0\" class=\"listText\">\n <span class=\"preview-name preview-placeholder\">no items to display...</span>\n </div>\n <div (click)=\"selected(item)\" *ngFor=\"let item of previewItems\" [ngClass]=\"{ clickable: clickable }\" class=\"listText\">\n <div *ngIf=\"allowRemove\" class=\"icon-clear\" (click)=\"remove(item)\"></div>\n <span *ngIf=\"!item.href\" class=\"preview-name\" matTooltip=\"{{tooltip}}\" matTooltipPosition=\"below\" matTooltipShowDelay=\"1000\">{{ item.name || item }}</span>\n <a *ngIf=\"item.href\" [href]=\"getHrefVal(item.href)\" (click)=\"linkClicked($event, item)\" class=\"{{item.linkClass ? item.linkClass : ''}}\" matTooltip=\"{{tooltip}}\" matTooltipShowDelay=\"1000\" matTooltipPosition=\"below\">\n <span *ngIf=\"item.name\" class=\"preview-name\">{{ item.name }}<div *ngIf=\"item.iconClass\" class=\"preview-item-icon {{item.iconClass}}\" (click)=\"remove(item)\"></div></span>\n </a>\n </div>\n </div>\n</div>\n<div *ngIf=\"isLoading\" class=\"spinner-container\">\n <span class=\"spinner\"></span>\n</div>\n", styles: [":host{display:flex;flex-direction:column;height:100%;position:relative}.counter{background-color:#4c5566;color:var(--white);position:absolute;right:0rem}.listBox{background-color:var(--stroke);padding:.625rem;border-radius:var(--inputBorderRadius);height:100%;min-height:3.75rem}.listBox input{height:2.5rem;border-radius:1.6875rem;font-size:.875rem;font-weight:600;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACwAAAAuCAYAAABTTPsKAAAD4klEQVRYhc2ZyYsUSRSHvypLbRfGDfWgzngYFRR3EUQPOm5oOyMuKIoo4kk9iAriQfAPcAMvKuJBPAyiXmbAwWVUFGEYmMHlIi24ogd3cW3trpYnv4CooLKrKiuzqn5QUBmZEe/Lly9fvIjMPH36CmA4cABYAHSnsdQK/AVsBR4Y8E/ATaA30KXBYJ3agffA+Cywt8FhEZsx7jUPf/bC4BNwuc5woWYBPdTWmgti9hSwrv6MBToOrFVD92xwsqOOYFEqYAqBGzGOC5gshv07aANuNZCnM8A4IOcacsEFdjyp9lzly0KipZEBA7VYSKwEfpf7nTqU4uqpHkWYVlkInAR+ATZ4AZ4HmoErdQKeCVz0eGymO2asrpawE38D0xXHdjcfFM93aww7Avgf6CUPWyK4Dsw2cJfW7A4WA4/1P6NHcgHoV0PYfrLpwqFdTIv1vyAPvwXmyLMd8voQ4A+gaw1gu8rWENl2T3mO2AiBTfeARYphFB7TgMM1AD4sWy7V5sVyz78oBDZd0wvoZHe7HtiWIuw22fBntQ1iKVAxYFRw7PE8nVEZ2pwCbLPGdimsXbaPF7vYZYmi54A/gfneY7JSdCpwOyHYscC/QJOOLSOcA36NKg+iPIw6rNBM2Ka2bnqLBycAO1hjdfNgW2QzspbpDNj0EZintzSv6wdojdVUom9natIYAzRmXjbmyWakSgGbnigsnJdzepQngqmzXGXUd6wXam2y8aTUGOUAm/4DVnvHZmgpsDsG8G719SvF1bJRUuUCm84Au7zMkfWMl6sl6uPs5jXmmXIH6CxLRMkqu+Weh94BPwJvSvTrAzwCftCxhcFpq8AqMR4W8OXIFqk/AxPUv0lJfl/Q114gP4yGAT092BtxFrxxgL8Ay4D7OrYa4LciwKOBNRHrxKye0pdKjVcSw74eBSuV4RHXtUW0W9+HcQzHBUaVlFPUflxU+4eI9pKqBriUDqm+db9nSQwaJ4bLldUDOzyn9G904KHAxKRtpBkSpsQ3ZNL0sG1EW9r6quNw2R5Lab90vbX67ZXUS5cUcJTnZmjqtjQ2KAlD1QB/9v4PVAETbgnk5OWeSYQDVQKf9WayjKbnO9oxT03VAO8HrgZbAubpS1pU2tLHKrh/VOtGTdMVqdqQmAvs1Eo37z32LarGWrXXMAV4WW9gBGlL8sn2DS1YRo3U57TNScUvCWYJAxsDHPXarKy00vMgcD6pD5ZJ5mELkU3AQuC15+2stk/7JmEkjYnDlu+jtL/rpuZwRn0Rd/C0Zrrn+m69UauK71ulkt2EbU7HUtrFzxF9BXLpzzZLtusDZuUCvgHvMdO9Y7xsIwAAAABJRU5ErkJggg==);background-size:auto 1.3125rem;background-position:top .5rem right .75rem;background-repeat:no-repeat;margin-bottom:.625rem;padding-left:.875rem}.text{overflow-y:scroll;height:100%}.listText{width:100%;position:relative;float:left;font-size:.875rem;font-weight:600;padding-left:.625rem;padding-right:.625rem;margin-bottom:.125rem;color:var(--primary);display:flex;flex-direction:row;align-items:center;gap:.3125rem}.listText a{color:var(--primary);display:flex;flex-direction:row;align-items:center}.listText a:hover .preview-item-icon{text-decoration:underline}.listText .icon-clear{margin-top:.125rem}.listText .icon-clear:hover{color:var(--background)}::-webkit-scrollbar-thumb{background-color:var(--background)!important}.clickable{color:var(--primary);cursor:pointer}.clickable:hover,.clickable:focus{filter:brightness(90%)}.clickable:active{color:var(--icon);transform:translateY(.0625rem)}.clickable .preview-name:hover,.clickable .preview-name:focus{text-decoration:underline}.clickable .preview-name:active{text-decoration:underline}.preview-name{white-space:pre}.preview-name.preview-placeholder{font-style:italic}.preview-item-icon{margin-left:.4375rem;font-family:zac!important}.preview-more-results{margin-top:.3125rem}.spinner-container{position:absolute;display:flex;align-items:center;justify-content:center;width:100%;height:100%}.spinner-container .spinner{display:inline-block;width:2rem;height:2rem;border-radius:50%;background:transparent;border-top:.3125rem solid var(--tableText);border-right:.3125rem solid var(--tableText);border-bottom:.3125rem solid transparent;border-left:.3125rem solid transparent;animation:loading .5s infinite linear;opacity:.7}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }] }); }
|
|
12918
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: PreviewListComponent, selector: "lib-preview-list", inputs: { label: "label", clickable: "clickable", isLoading: "isLoading", allNames: "allNames", items: "items", allowRemove: "allowRemove", tooltip: "tooltip", showfilter: "showfilter", localFilter: "localFilter" }, outputs: { itemSelected: "itemSelected", itemRemoved: "itemRemoved", filterChanged: "filterChanged" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"listBox row\">\n <input *ngIf=\"showfilter\" (keyup)=\"onKeydownEvent()\" [(ngModel)]=\"filterFor\" placeholder=\"Type to Filter\"/>\n <div class=\"text row\">\n <div *ngIf=\"previewItems.length <= 0\" class=\"listText\">\n <span class=\"preview-name preview-placeholder no-items-preview\">no items to display...</span>\n </div>\n <div (click)=\"selected(item)\" *ngFor=\"let item of previewItems\" [ngClass]=\"{ clickable: clickable }\" class=\"listText\">\n <div *ngIf=\"allowRemove\" class=\"icon-clear\" (click)=\"remove(item)\"></div>\n <span *ngIf=\"!item.href\" class=\"preview-name\" matTooltip=\"{{tooltip}}\" matTooltipPosition=\"below\" matTooltipShowDelay=\"1000\">{{ item.name || item }}</span>\n <a *ngIf=\"item.href\" [href]=\"getHrefVal(item.href)\" (click)=\"linkClicked($event, item)\" class=\"{{item.linkClass ? item.linkClass : ''}}\" matTooltip=\"{{tooltip}}\" matTooltipShowDelay=\"1000\" matTooltipPosition=\"below\">\n <span *ngIf=\"item.name\" class=\"preview-name\">{{ item.name }}<div *ngIf=\"item.iconClass\" class=\"preview-item-icon {{item.iconClass}}\" (click)=\"remove(item)\"></div></span>\n </a>\n </div>\n </div>\n</div>\n<div *ngIf=\"isLoading\" class=\"spinner-container\">\n <span class=\"spinner\"></span>\n</div>\n", styles: [":host{display:flex;flex-direction:column;height:100%;position:relative}.counter{background-color:#4c5566;color:var(--white);position:absolute;right:0rem}.listBox{background-color:var(--stroke);padding:.625rem;border-radius:var(--inputBorderRadius);height:100%;min-height:3.75rem}.listBox input{height:2.5rem;border-radius:1.6875rem;font-size:.875rem;font-weight:600;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACwAAAAuCAYAAABTTPsKAAAD4klEQVRYhc2ZyYsUSRSHvypLbRfGDfWgzngYFRR3EUQPOm5oOyMuKIoo4kk9iAriQfAPcAMvKuJBPAyiXmbAwWVUFGEYmMHlIi24ogd3cW3trpYnv4CooLKrKiuzqn5QUBmZEe/Lly9fvIjMPH36CmA4cABYAHSnsdQK/AVsBR4Y8E/ATaA30KXBYJ3agffA+Cywt8FhEZsx7jUPf/bC4BNwuc5woWYBPdTWmgti9hSwrv6MBToOrFVD92xwsqOOYFEqYAqBGzGOC5gshv07aANuNZCnM8A4IOcacsEFdjyp9lzly0KipZEBA7VYSKwEfpf7nTqU4uqpHkWYVlkInAR+ATZ4AZ4HmoErdQKeCVz0eGymO2asrpawE38D0xXHdjcfFM93aww7Avgf6CUPWyK4Dsw2cJfW7A4WA4/1P6NHcgHoV0PYfrLpwqFdTIv1vyAPvwXmyLMd8voQ4A+gaw1gu8rWENl2T3mO2AiBTfeARYphFB7TgMM1AD4sWy7V5sVyz78oBDZd0wvoZHe7HtiWIuw22fBntQ1iKVAxYFRw7PE8nVEZ2pwCbLPGdimsXbaPF7vYZYmi54A/gfneY7JSdCpwOyHYscC/QJOOLSOcA36NKg+iPIw6rNBM2Ka2bnqLBycAO1hjdfNgW2QzspbpDNj0EZintzSv6wdojdVUom9natIYAzRmXjbmyWakSgGbnigsnJdzepQngqmzXGXUd6wXam2y8aTUGOUAm/4DVnvHZmgpsDsG8G719SvF1bJRUuUCm84Au7zMkfWMl6sl6uPs5jXmmXIH6CxLRMkqu+Weh94BPwJvSvTrAzwCftCxhcFpq8AqMR4W8OXIFqk/AxPUv0lJfl/Q114gP4yGAT092BtxFrxxgL8Ay4D7OrYa4LciwKOBNRHrxKye0pdKjVcSw74eBSuV4RHXtUW0W9+HcQzHBUaVlFPUflxU+4eI9pKqBriUDqm+db9nSQwaJ4bLldUDOzyn9G904KHAxKRtpBkSpsQ3ZNL0sG1EW9r6quNw2R5Lab90vbX67ZXUS5cUcJTnZmjqtjQ2KAlD1QB/9v4PVAETbgnk5OWeSYQDVQKf9WayjKbnO9oxT03VAO8HrgZbAubpS1pU2tLHKrh/VOtGTdMVqdqQmAvs1Eo37z32LarGWrXXMAV4WW9gBGlL8sn2DS1YRo3U57TNScUvCWYJAxsDHPXarKy00vMgcD6pD5ZJ5mELkU3AQuC15+2stk/7JmEkjYnDlu+jtL/rpuZwRn0Rd/C0Zrrn+m69UauK71ulkt2EbU7HUtrFzxF9BXLpzzZLtusDZuUCvgHvMdO9Y7xsIwAAAABJRU5ErkJggg==);background-size:auto 1.3125rem;background-position:top .5rem right .75rem;background-repeat:no-repeat;margin-bottom:.625rem;padding-left:.875rem}.text{overflow-y:scroll;height:100%}.listText{width:100%;position:relative;float:left;font-size:.875rem;font-weight:600;padding-left:.625rem;padding-right:.625rem;margin-bottom:.125rem;color:var(--primary);display:flex;flex-direction:row;align-items:center;gap:.3125rem}.listText a{color:var(--primary);display:flex;flex-direction:row;align-items:center}.listText a:hover .preview-item-icon{text-decoration:underline}.listText .icon-clear{margin-top:.125rem}.listText .icon-clear:hover{color:var(--background)}::-webkit-scrollbar-thumb{background-color:var(--background)!important}.clickable{color:var(--primary);cursor:pointer}.clickable:hover,.clickable:focus{filter:brightness(90%)}.clickable:active{color:var(--icon);transform:translateY(.0625rem)}.clickable .preview-name:hover,.clickable .preview-name:focus{text-decoration:underline}.clickable .preview-name:active{text-decoration:underline}.preview-name{white-space:pre}.preview-name.preview-placeholder{font-style:italic}.preview-name.no-items-preview{font-weight:400}.preview-item-icon{margin-left:.4375rem;font-family:zac!important}.preview-more-results{margin-top:.3125rem}.preview-more-results .preview-name{font-weight:600;border-top-width:1px;text-transform:uppercase;font-size:.825rem;font-style:italic}.preview-more-results .preview-name:after{content:\"\\e939\";font-family:icomoon!important;font-style:normal}.spinner-container{position:absolute;display:flex;align-items:center;justify-content:center;width:100%;height:100%}.spinner-container .spinner{display:inline-block;width:2rem;height:2rem;border-radius:50%;background:transparent;border-top:.3125rem solid var(--tableText);border-right:.3125rem solid var(--tableText);border-bottom:.3125rem solid transparent;border-left:.3125rem solid transparent;animation:loading .5s infinite linear;opacity:.7}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }] }); }
|
|
12753
12919
|
}
|
|
12754
12920
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PreviewListComponent, decorators: [{
|
|
12755
12921
|
type: Component,
|
|
12756
|
-
args: [{ selector: 'lib-preview-list', template: "<div class=\"listBox row\">\n <input *ngIf=\"showfilter\" (keyup)=\"onKeydownEvent()\" [(ngModel)]=\"filterFor\" placeholder=\"Type to Filter\"/>\n <div class=\"text row\">\n <div *ngIf=\"previewItems.length <= 0\" class=\"listText\">\n <span class=\"preview-name preview-placeholder\">no items to display...</span>\n </div>\n <div (click)=\"selected(item)\" *ngFor=\"let item of previewItems\" [ngClass]=\"{ clickable: clickable }\" class=\"listText\">\n <div *ngIf=\"allowRemove\" class=\"icon-clear\" (click)=\"remove(item)\"></div>\n <span *ngIf=\"!item.href\" class=\"preview-name\" matTooltip=\"{{tooltip}}\" matTooltipPosition=\"below\" matTooltipShowDelay=\"1000\">{{ item.name || item }}</span>\n <a *ngIf=\"item.href\" [href]=\"getHrefVal(item.href)\" (click)=\"linkClicked($event, item)\" class=\"{{item.linkClass ? item.linkClass : ''}}\" matTooltip=\"{{tooltip}}\" matTooltipShowDelay=\"1000\" matTooltipPosition=\"below\">\n <span *ngIf=\"item.name\" class=\"preview-name\">{{ item.name }}<div *ngIf=\"item.iconClass\" class=\"preview-item-icon {{item.iconClass}}\" (click)=\"remove(item)\"></div></span>\n </a>\n </div>\n </div>\n</div>\n<div *ngIf=\"isLoading\" class=\"spinner-container\">\n <span class=\"spinner\"></span>\n</div>\n", styles: [":host{display:flex;flex-direction:column;height:100%;position:relative}.counter{background-color:#4c5566;color:var(--white);position:absolute;right:0rem}.listBox{background-color:var(--stroke);padding:.625rem;border-radius:var(--inputBorderRadius);height:100%;min-height:3.75rem}.listBox input{height:2.5rem;border-radius:1.6875rem;font-size:.875rem;font-weight:600;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACwAAAAuCAYAAABTTPsKAAAD4klEQVRYhc2ZyYsUSRSHvypLbRfGDfWgzngYFRR3EUQPOm5oOyMuKIoo4kk9iAriQfAPcAMvKuJBPAyiXmbAwWVUFGEYmMHlIi24ogd3cW3trpYnv4CooLKrKiuzqn5QUBmZEe/Lly9fvIjMPH36CmA4cABYAHSnsdQK/AVsBR4Y8E/ATaA30KXBYJ3agffA+Cywt8FhEZsx7jUPf/bC4BNwuc5woWYBPdTWmgti9hSwrv6MBToOrFVD92xwsqOOYFEqYAqBGzGOC5gshv07aANuNZCnM8A4IOcacsEFdjyp9lzly0KipZEBA7VYSKwEfpf7nTqU4uqpHkWYVlkInAR+ATZ4AZ4HmoErdQKeCVz0eGymO2asrpawE38D0xXHdjcfFM93aww7Avgf6CUPWyK4Dsw2cJfW7A4WA4/1P6NHcgHoV0PYfrLpwqFdTIv1vyAPvwXmyLMd8voQ4A+gaw1gu8rWENl2T3mO2AiBTfeARYphFB7TgMM1AD4sWy7V5sVyz78oBDZd0wvoZHe7HtiWIuw22fBntQ1iKVAxYFRw7PE8nVEZ2pwCbLPGdimsXbaPF7vYZYmi54A/gfneY7JSdCpwOyHYscC/QJOOLSOcA36NKg+iPIw6rNBM2Ka2bnqLBycAO1hjdfNgW2QzspbpDNj0EZintzSv6wdojdVUom9natIYAzRmXjbmyWakSgGbnigsnJdzepQngqmzXGXUd6wXam2y8aTUGOUAm/4DVnvHZmgpsDsG8G719SvF1bJRUuUCm84Au7zMkfWMl6sl6uPs5jXmmXIH6CxLRMkqu+Weh94BPwJvSvTrAzwCftCxhcFpq8AqMR4W8OXIFqk/AxPUv0lJfl/Q114gP4yGAT092BtxFrxxgL8Ay4D7OrYa4LciwKOBNRHrxKye0pdKjVcSw74eBSuV4RHXtUW0W9+HcQzHBUaVlFPUflxU+4eI9pKqBriUDqm+db9nSQwaJ4bLldUDOzyn9G904KHAxKRtpBkSpsQ3ZNL0sG1EW9r6quNw2R5Lab90vbX67ZXUS5cUcJTnZmjqtjQ2KAlD1QB/9v4PVAETbgnk5OWeSYQDVQKf9WayjKbnO9oxT03VAO8HrgZbAubpS1pU2tLHKrh/VOtGTdMVqdqQmAvs1Eo37z32LarGWrXXMAV4WW9gBGlL8sn2DS1YRo3U57TNScUvCWYJAxsDHPXarKy00vMgcD6pD5ZJ5mELkU3AQuC15+2stk/7JmEkjYnDlu+jtL/rpuZwRn0Rd/C0Zrrn+m69UauK71ulkt2EbU7HUtrFzxF9BXLpzzZLtusDZuUCvgHvMdO9Y7xsIwAAAABJRU5ErkJggg==);background-size:auto 1.3125rem;background-position:top .5rem right .75rem;background-repeat:no-repeat;margin-bottom:.625rem;padding-left:.875rem}.text{overflow-y:scroll;height:100%}.listText{width:100%;position:relative;float:left;font-size:.875rem;font-weight:600;padding-left:.625rem;padding-right:.625rem;margin-bottom:.125rem;color:var(--primary);display:flex;flex-direction:row;align-items:center;gap:.3125rem}.listText a{color:var(--primary);display:flex;flex-direction:row;align-items:center}.listText a:hover .preview-item-icon{text-decoration:underline}.listText .icon-clear{margin-top:.125rem}.listText .icon-clear:hover{color:var(--background)}::-webkit-scrollbar-thumb{background-color:var(--background)!important}.clickable{color:var(--primary);cursor:pointer}.clickable:hover,.clickable:focus{filter:brightness(90%)}.clickable:active{color:var(--icon);transform:translateY(.0625rem)}.clickable .preview-name:hover,.clickable .preview-name:focus{text-decoration:underline}.clickable .preview-name:active{text-decoration:underline}.preview-name{white-space:pre}.preview-name.preview-placeholder{font-style:italic}.preview-item-icon{margin-left:.4375rem;font-family:zac!important}.preview-more-results{margin-top:.3125rem}.spinner-container{position:absolute;display:flex;align-items:center;justify-content:center;width:100%;height:100%}.spinner-container .spinner{display:inline-block;width:2rem;height:2rem;border-radius:50%;background:transparent;border-top:.3125rem solid var(--tableText);border-right:.3125rem solid var(--tableText);border-bottom:.3125rem solid transparent;border-left:.3125rem solid transparent;animation:loading .5s infinite linear;opacity:.7}\n"] }]
|
|
12922
|
+
args: [{ selector: 'lib-preview-list', template: "<div class=\"listBox row\">\n <input *ngIf=\"showfilter\" (keyup)=\"onKeydownEvent()\" [(ngModel)]=\"filterFor\" placeholder=\"Type to Filter\"/>\n <div class=\"text row\">\n <div *ngIf=\"previewItems.length <= 0\" class=\"listText\">\n <span class=\"preview-name preview-placeholder no-items-preview\">no items to display...</span>\n </div>\n <div (click)=\"selected(item)\" *ngFor=\"let item of previewItems\" [ngClass]=\"{ clickable: clickable }\" class=\"listText\">\n <div *ngIf=\"allowRemove\" class=\"icon-clear\" (click)=\"remove(item)\"></div>\n <span *ngIf=\"!item.href\" class=\"preview-name\" matTooltip=\"{{tooltip}}\" matTooltipPosition=\"below\" matTooltipShowDelay=\"1000\">{{ item.name || item }}</span>\n <a *ngIf=\"item.href\" [href]=\"getHrefVal(item.href)\" (click)=\"linkClicked($event, item)\" class=\"{{item.linkClass ? item.linkClass : ''}}\" matTooltip=\"{{tooltip}}\" matTooltipShowDelay=\"1000\" matTooltipPosition=\"below\">\n <span *ngIf=\"item.name\" class=\"preview-name\">{{ item.name }}<div *ngIf=\"item.iconClass\" class=\"preview-item-icon {{item.iconClass}}\" (click)=\"remove(item)\"></div></span>\n </a>\n </div>\n </div>\n</div>\n<div *ngIf=\"isLoading\" class=\"spinner-container\">\n <span class=\"spinner\"></span>\n</div>\n", styles: [":host{display:flex;flex-direction:column;height:100%;position:relative}.counter{background-color:#4c5566;color:var(--white);position:absolute;right:0rem}.listBox{background-color:var(--stroke);padding:.625rem;border-radius:var(--inputBorderRadius);height:100%;min-height:3.75rem}.listBox input{height:2.5rem;border-radius:1.6875rem;font-size:.875rem;font-weight:600;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACwAAAAuCAYAAABTTPsKAAAD4klEQVRYhc2ZyYsUSRSHvypLbRfGDfWgzngYFRR3EUQPOm5oOyMuKIoo4kk9iAriQfAPcAMvKuJBPAyiXmbAwWVUFGEYmMHlIi24ogd3cW3trpYnv4CooLKrKiuzqn5QUBmZEe/Lly9fvIjMPH36CmA4cABYAHSnsdQK/AVsBR4Y8E/ATaA30KXBYJ3agffA+Cywt8FhEZsx7jUPf/bC4BNwuc5woWYBPdTWmgti9hSwrv6MBToOrFVD92xwsqOOYFEqYAqBGzGOC5gshv07aANuNZCnM8A4IOcacsEFdjyp9lzly0KipZEBA7VYSKwEfpf7nTqU4uqpHkWYVlkInAR+ATZ4AZ4HmoErdQKeCVz0eGymO2asrpawE38D0xXHdjcfFM93aww7Avgf6CUPWyK4Dsw2cJfW7A4WA4/1P6NHcgHoV0PYfrLpwqFdTIv1vyAPvwXmyLMd8voQ4A+gaw1gu8rWENl2T3mO2AiBTfeARYphFB7TgMM1AD4sWy7V5sVyz78oBDZd0wvoZHe7HtiWIuw22fBntQ1iKVAxYFRw7PE8nVEZ2pwCbLPGdimsXbaPF7vYZYmi54A/gfneY7JSdCpwOyHYscC/QJOOLSOcA36NKg+iPIw6rNBM2Ka2bnqLBycAO1hjdfNgW2QzspbpDNj0EZintzSv6wdojdVUom9natIYAzRmXjbmyWakSgGbnigsnJdzepQngqmzXGXUd6wXam2y8aTUGOUAm/4DVnvHZmgpsDsG8G719SvF1bJRUuUCm84Au7zMkfWMl6sl6uPs5jXmmXIH6CxLRMkqu+Weh94BPwJvSvTrAzwCftCxhcFpq8AqMR4W8OXIFqk/AxPUv0lJfl/Q114gP4yGAT092BtxFrxxgL8Ay4D7OrYa4LciwKOBNRHrxKye0pdKjVcSw74eBSuV4RHXtUW0W9+HcQzHBUaVlFPUflxU+4eI9pKqBriUDqm+db9nSQwaJ4bLldUDOzyn9G904KHAxKRtpBkSpsQ3ZNL0sG1EW9r6quNw2R5Lab90vbX67ZXUS5cUcJTnZmjqtjQ2KAlD1QB/9v4PVAETbgnk5OWeSYQDVQKf9WayjKbnO9oxT03VAO8HrgZbAubpS1pU2tLHKrh/VOtGTdMVqdqQmAvs1Eo37z32LarGWrXXMAV4WW9gBGlL8sn2DS1YRo3U57TNScUvCWYJAxsDHPXarKy00vMgcD6pD5ZJ5mELkU3AQuC15+2stk/7JmEkjYnDlu+jtL/rpuZwRn0Rd/C0Zrrn+m69UauK71ulkt2EbU7HUtrFzxF9BXLpzzZLtusDZuUCvgHvMdO9Y7xsIwAAAABJRU5ErkJggg==);background-size:auto 1.3125rem;background-position:top .5rem right .75rem;background-repeat:no-repeat;margin-bottom:.625rem;padding-left:.875rem}.text{overflow-y:scroll;height:100%}.listText{width:100%;position:relative;float:left;font-size:.875rem;font-weight:600;padding-left:.625rem;padding-right:.625rem;margin-bottom:.125rem;color:var(--primary);display:flex;flex-direction:row;align-items:center;gap:.3125rem}.listText a{color:var(--primary);display:flex;flex-direction:row;align-items:center}.listText a:hover .preview-item-icon{text-decoration:underline}.listText .icon-clear{margin-top:.125rem}.listText .icon-clear:hover{color:var(--background)}::-webkit-scrollbar-thumb{background-color:var(--background)!important}.clickable{color:var(--primary);cursor:pointer}.clickable:hover,.clickable:focus{filter:brightness(90%)}.clickable:active{color:var(--icon);transform:translateY(.0625rem)}.clickable .preview-name:hover,.clickable .preview-name:focus{text-decoration:underline}.clickable .preview-name:active{text-decoration:underline}.preview-name{white-space:pre}.preview-name.preview-placeholder{font-style:italic}.preview-name.no-items-preview{font-weight:400}.preview-item-icon{margin-left:.4375rem;font-family:zac!important}.preview-more-results{margin-top:.3125rem}.preview-more-results .preview-name{font-weight:600;border-top-width:1px;text-transform:uppercase;font-size:.825rem;font-style:italic}.preview-more-results .preview-name:after{content:\"\\e939\";font-family:icomoon!important;font-style:normal}.spinner-container{position:absolute;display:flex;align-items:center;justify-content:center;width:100%;height:100%}.spinner-container .spinner{display:inline-block;width:2rem;height:2rem;border-radius:50%;background:transparent;border-top:.3125rem solid var(--tableText);border-right:.3125rem solid var(--tableText);border-bottom:.3125rem solid transparent;border-left:.3125rem solid transparent;animation:loading .5s infinite linear;opacity:.7}\n"] }]
|
|
12757
12923
|
}], ctorParameters: function () { return [{ type: i4.Router }]; }, propDecorators: { label: [{
|
|
12758
12924
|
type: Input
|
|
12759
12925
|
}], clickable: [{
|
|
@@ -12770,10 +12936,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
12770
12936
|
type: Input
|
|
12771
12937
|
}], showfilter: [{
|
|
12772
12938
|
type: Input
|
|
12939
|
+
}], localFilter: [{
|
|
12940
|
+
type: Input
|
|
12773
12941
|
}], itemSelected: [{
|
|
12774
12942
|
type: Output
|
|
12775
12943
|
}], itemRemoved: [{
|
|
12776
12944
|
type: Output
|
|
12945
|
+
}], filterChanged: [{
|
|
12946
|
+
type: Output
|
|
12777
12947
|
}] } });
|
|
12778
12948
|
|
|
12779
12949
|
/*
|
|
@@ -12863,7 +13033,7 @@ class PreviewSelectionsComponent {
|
|
|
12863
13033
|
this.dialogRef.close({ confirmed: false });
|
|
12864
13034
|
}
|
|
12865
13035
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PreviewSelectionsComponent, deps: [{ token: i5$1.MatDialogRef }, { token: MAT_DIALOG_DATA }, { token: ZITI_DATA_SERVICE }, { token: ServicesPageService }, { token: GrowlerService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
12866
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: PreviewSelectionsComponent, selector: "preview-selections", ngImport: i0, template: "<div class=\"preview-selections-container confirm-modal-container\" [ngClass]=\"{'error-state': state === 'ERROR', 'loading-state': isLoading}\">\n <div class=\"close icon-close\" (click)=\"cancel()\"></div>\n <div class=\"preview-selections-body\">\n <div class=\"preview-selections-content\">\n <div class=\"preview-selections-title-container\">\n <div class=\"confirm-modal-icon\" style=\"background-image: url("../../assets/svgs/Confirm_Trash.svg");\"></div>\n <span class=\"preview-selections-title\">Orphaned Configs & Service Policies</span>\n <span class=\"preview-selections-subtitle\">Preview of all associated entities that will be orphaned and deleted once the selected services are deleted</span>\n </div>\n <div class=\"preview-selections-info-message\" *ngIf=\"infoMessage\" [ngClass]=\"{'error-message': state === 'ERROR'}\">{{infoMessage}}</div>\n <div class=\"preview-selections-main\">\n <div class=\"preview-selections-left-side\">\n <lib-form-field-container\n [showHeader]=\"true\"\n [title]=\"'Services To Delete'\"\n [class]=\"'hide-overflow bold-header-title'\"\n [count]=\"selectedItems.length\"\n >\n <div class=\"selected-items-container\">\n <div class=\"selected-items\">\n <div class=\"selected-items-category\">\n <ul>\n <li class=\"selected-items-item header-item\" (click)=\"previewItem(allItem)\" [ngClass]=\"{'selected': selectedItem.id === 'all'}\">\n <span class=\"selected-item-name\">{{allItem.name}}</span>\n <div class=\"associated-count-container\">\n <div class=\"associated-count-header-group\">\n <div\n class=\"associated-header-icon icon-configuration\"\n matTooltip=\"Configs\"\n matTooltipPosition=\"below\"\n matTooltipShowDelay=\"500\"\n ></div>\n <span class=\"associated-configs-count\">{{allItem.associatedConfigs.length}}</span>\n </div>\n <div class=\"count-divider header-divider\"></div>\n <div class=\"associated-count-header-group\">\n <div\n class=\"associated-header-icon icon-Policies\"\n matTooltip=\"Service Policies\"\n matTooltipPosition=\"below\"\n matTooltipShowDelay=\"500\"\n ></div>\n <span class=\"associated-policies-count\">{{allItem.associatedServicePolicies.length}}</span>\n </div>\n </div>\n </li>\n <div class=\"selected-items-divider\"></div>\n <li *ngFor=\"let item of selectedItems\" class=\"selected-items-item\" (click)=\"previewItem(item)\" [ngClass]=\"{'selected': item.selected}\">\n <span class=\"selected-item-name\">{{item.name}}</span>\n <div class=\"associated-count-container\">\n <div class=\"associated-count-list-group\">\n <span class=\"associated-configs-header-count\">{{allItem.associatedConfigs.length}}</span>\n <span class=\"associated-configs-count\">{{item.associatedConfigs.length}}</span>\n </div>\n <div class=\"count-divider\"></div>\n <div class=\"associated-count-list-group\">\n <span class=\"associated-configs-header-count\">{{allItem.associatedServicePolicies.length}}</span>\n <span class=\"associated-policies-count\">{{item.associatedServicePolicies.length}}</span>\n </div>\n </div>\n </li>\n </ul>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n </div>\n <div class=\"preview-selections-divider\"></div>\n <div class=\"preview-selections-right-side\">\n <div class=\"preview-selections-lists-title\">\n <div class=\"resource-type\"> Selected Service </div>\n <div class=\"icon-next preview-selections-breadcrumb\"></div>\n <div class=\"selected-attribute\"> {{selectedItem.name}} </div>\n </div>\n <div class=\"preview-selections-lists\">\n <lib-form-field-container\n [title]=\"'Orphaned Configs'\"\n [titleIcon]=\"'icon-configuration'\"\n [count]=\"selectedItem.associatedConfigs.length\"\n [class]=\"'hide-overflow'\"\n [helpText]=\"'List of orphaned Configs that will be deleted.'\"\n >\n <lib-preview-list\n [clickable]=\"false\"\n [items]=\"selectedItem.associatedConfigs\"\n [allowRemove]=\"false\"\n ></lib-preview-list>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Orphaned Service Policies'\"\n [titleIcon]=\"'icon-Policies'\"\n [count]=\"selectedItem.associatedServicePolicies.length\"\n [class]=\"'hide-overflow'\"\n [helpText]=\"'List of all orphaned Service Policies that will be deleted.'\"\n >\n <lib-preview-list\n [clickable]=\"false\"\n [items]=\"selectedItem.associatedServicePolicies\"\n [allowRemove]=\"false\"\n ></lib-preview-list>\n </lib-form-field-container>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"preview-selections-buttons-container\">\n <button class=\"button save secondary-button\" (click)=\"return()\">Return</button>\n <button class=\"button save confirm\" *ngIf=\"dataObj.deleteConfirmed && state !== 'ERROR'\" (click)=\"confirm()\" [disabled]=\"isLoading\">Delete All</button>\n </div>\n</div>\n\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>\n", styles: [".preview-selections-container{display:flex;flex-direction:column;background-color:var(--formBackground);border-radius:1.5625rem}.preview-selections-container.loading-state .preview-selections-main,.preview-selections-container.error-state .preview-selections-main{filter:grayscale(1);opacity:.6;cursor:default;pointer-events:none}.preview-selections-container .preview-selections-divider{height:100%;min-height:20.625rem;flex:1 0 auto;display:flex;width:.125rem;max-width:.125rem;border-right-width:.125rem;border-right-color:var(--stroke);border-right-style:solid;margin-right:var(--marginMedium);margin-left:var(--marginMedium);padding-top:var(--paddingXXL);padding-bottom:var(--paddingXXL)}.preview-selections-container .selected-items-container{width:18.75rem;height:100%;min-height:18.75rem;max-height:18.75rem;background-color:var(--navigation);overflow:hidden;display:flex;flex-direction:column}.preview-selections-container .selected-items-container .selected-items-filter-header{display:flex;flex-direction:column;position:relative;margin-top:var(--marginMedium)}.preview-selections-container .selected-items-container .selected-items-filter-header .selected-items-filter-search{margin:0;width:100%;height:2.5rem;float:left;border-radius:1.875rem;font-size:.875rem;font-weight:600;padding-left:1.125rem;background-image:url(/assets/svgs/Filter.svg);background-size:1.125rem;background-position:right .9375rem top .625rem;background-repeat:no-repeat}.preview-selections-container .selected-items-container .selected-items{overflow:hidden;height:100%;display:flex;position:relative;flex-direction:column}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-category-title{margin-left:var(--marginMedium);color:var(--primaryColor);font-weight:700;font-size:.9375rem;filter:brightness(65%);text-transform:uppercase}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item{display:flex;flex-direction:row;justify-content:space-between;font-weight:600;font-size:1rem;padding-top:.1875rem;padding-bottom:.1875rem;padding-left:var(--paddingSmall);position:relative;cursor:pointer;border-left-width:.3125rem;border-left-color:transparent;border-left-style:solid}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item.header-item{margin-top:1.375rem}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item.header-item .selected-item-name{font-weight:900}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item:hover{background-color:#2196f31a;border-left-width:.3125rem;border-left-color:var(--primaryColor)}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item.selected{background-color:#2196f31a;border-left-width:.3125rem;border-left-color:var(--secondaryColor)}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item .selected-item-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 2.5rem)}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item .selected-items-remove-icon{color:var(--red);margin-right:var(--marginSmall);font-weight:600;font-family:zac;display:flex;justify-content:center;align-items:center}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item .selected-items-remove-icon:before{content:\"\\e927\"}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item .selected-items-remove-icon:hover{filter:brightness(.8)}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item .selected-items-remove-icon:active{transform:translateY(.0625rem)}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item .associated-count-container{display:flex;flex-direction:row;gap:var(--gapMedium);right:.3125rem;justify-content:flex-end;padding-right:var(--paddingSmall);padding-left:var(--paddingSmall)}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item .associated-count-container .count-divider{height:150%;margin-top:-.625rem;width:.0625rem;border-width:0;border-right-width:.0625rem;border-style:solid;border-color:var(--placeholder)}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item .associated-count-container .count-divider.header-divider{height:300%;margin-top:-2.5rem}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item .associated-count-container .associated-configs-header-count{color:transparent;position:relative}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item .associated-count-container .associated-count-list-group{display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-end;position:relative}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item .associated-count-container .associated-count-list-group .associated-configs-count,.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item .associated-count-container .associated-count-list-group .associated-policies-count{position:absolute}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item .associated-count-container .associated-count-header-group{display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-end;position:relative}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item .associated-count-container .associated-count-header-group .associated-header-icon{position:absolute;display:flex;margin-top:-1.5625rem;margin-right:-.3125rem;top:0;right:0;font-size:1.25rem;cursor:default}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item .associated-count-container .associated-configs-count{color:var(--primaryColor)}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item .associated-count-container .associated-policies-count{color:var(--secondaryColor);filter:brightness(.9)}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-divider{width:100%;height:.125rem;border-color:var(--placeholder);border-bottom-style:solid;border-bottom-width:.0625rem;border-top-width:0;border-right-width:0;border-left-width:0}.preview-selections-container .selected-items-container .selected-items .selected-items-category ul{padding-inline-start:0rem;margin-block-start:var(--marginSmall);max-height:18.75rem;overflow:auto;overflow-x:hidden}.preview-selections-container .preview-selections-body{display:flex;flex-direction:row;align-items:center}.preview-selections-container .preview-selections-body .preview-selections-content{display:flex;flex-direction:column}.preview-selections-container .preview-selections-body .preview-selections-info-message{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;border-radius:var(--inputBorderRadius);padding:var(--paddingMedium) var(--paddingXL);margin:var(--marginMedium) var(--marginXL);margin-bottom:0}.preview-selections-container .preview-selections-body .preview-selections-info-message.error-message{color:var(--redText);background-color:var(--redShadow)}.preview-selections-container .preview-selections-body .preview-selections-main{display:flex;flex-direction:row;align-items:center;width:75rem;min-height:25rem;height:-moz-fit-content;height:fit-content;gap:var(--gapLarge);padding:0 var(--paddingXXL)}.preview-selections-container .preview-selections-body .preview-selections-main .preview-selections-left-side{width:25rem}.preview-selections-container .preview-selections-body .preview-selections-main .preview-selections-right-side{display:flex;flex-direction:column;height:100%;width:100%;gap:var(--gapSmall)}.preview-selections-container .preview-selections-body .preview-selections-main .preview-selections-right-side .preview-selections-title{height:2.5rem}.preview-selections-container .preview-selections-body .preview-selections-main .preview-selections-right-side .preview-selections-lists{height:20rem;width:100%;display:flex;flex-direction:row;align-items:center;gap:var(--gapLarge)}.preview-selections-container .preview-selections-body .preview-selections-icon{width:7.5rem;height:7.5rem;background-size:contain;z-index:20;box-sizing:var(--shadow);margin-left:var(--marginLarge)}.preview-selections-container .preview-selections-title-container{width:100%;display:flex;flex-direction:column}.preview-selections-container .preview-selections-title-container .confirm-modal-icon{width:3.75rem;height:3.75rem;position:absolute;top:1.25rem;left:1.25rem;background-image:url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22utf-8%22%3F%3E%3C!-- Generator%3A Adobe Illustrator 22.1.0%2C SVG Export Plug-In . SVG Version%3A 6.00 Build 0) --%3E%3C!DOCTYPE svg PUBLIC %22-%2F%2FW3C%2F%2FDTD SVG 1.1%2F%2FEN%22 %22http%3A%2F%2Fwww.w3.org%2FGraphics%2FSVG%2F1.1%2FDTD%2Fsvg11.dtd%22%3E%3Csvg id%3D'Layer_1' style%3D'enable-background%3Anew 0 0 72 72%3B' version%3D'1.1' viewBox%3D'0 0 72 72' x%3D'0px' xml%3Aspace%3D'preserve' xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' y%3D'0px'%3E%3Cstyle type%3D'text%2Fcss'%3E%09.st0 %7B fill%3A %23FFFFFF%3B %7D .st1 %7B fill%3A %23D9DFE3%3B %7D .st2 %7B fill%3A none%3B stroke%3A %23648293%3B stroke-width%3A 1.5%3B stroke-linecap%3A round%3B stroke-linejoin%3A round%3B stroke-miterlimit%3A 10%3B %7D%3C%2Fstyle%3E %3Cpolygon class%3D'st0' points%3D'59.2%2C19.7 59.2%2C13.7 50.4%2C8.7 46.9%2C10.7 35.7%2C2.1 24.5%2C10.7 21.1%2C8.7 12.3%2C13.7 12.3%2C19.7 9.3%2C19.7%0915.2%2C69.5 56.2%2C69.5 62.1%2C19.7 '%2F%3E %3Cpolygon class%3D'st1' points%3D'50.4%2C8.7 46.9%2C10.7 42.6%2C13.1 35.7%2C8.1 28.9%2C13.2 24.5%2C10.7 21.1%2C8.7 12.3%2C13.7 12.3%2C19.7 59.2%2C19.7%0959.2%2C13.7 '%2F%3E %3Cpolygon class%3D'st2' points%3D'9.3%2C19.7 15.2%2C69.5 56.2%2C69.5 62.1%2C19.7 '%2F%3E %3Cg%3E%09%3Cline class%3D'st2' x1%3D'60.1' x2%3D'26.9' y1%3D'36.3' y2%3D'69.5'%2F%3E %3Cline class%3D'st2' x1%3D'54' x2%3D'14' y1%3D'19.7' y2%3D'59.7'%2F%3E %3Cline class%3D'st2' x1%3D'11.6' x2%3D'31.3' y1%3D'39.3' y2%3D'19.7'%2F%3E %3Cline class%3D'st2' x1%3D'11.3' x2%3D'44.5' y1%3D'36.3' y2%3D'69.5'%2F%3E %3Cline class%3D'st2' x1%3D'17.4' x2%3D'57.4' y1%3D'19.7' y2%3D'59.6'%2F%3E %3Cline class%3D'st2' x1%3D'59.8' x2%3D'40.1' y1%3D'39.3' y2%3D'19.7'%2F%3E%3C%2Fg%3E %3Cline class%3D'st2' x1%3D'6.4' x2%3D'65' y1%3D'19.7' y2%3D'19.7'%2F%3E %3Cpolyline class%3D'st2' points%3D'12.3%2C19.7 12.3%2C13.7 21.1%2C8.7 27.6%2C12.4 '%2F%3E %3Cpolyline class%3D'st2' points%3D'59.2%2C19.7 59.2%2C13.7 50.4%2C8.7 43.9%2C12.4 '%2F%3E %3Cpolyline class%3D'st2' points%3D'24.5%2C10.7 35.7%2C2.1 46.9%2C10.7 '%2F%3E%3C%2Fsvg%3E\")}.preview-selections-container .preview-selections-title-container .preview-selections-title{color:var(--primaryColor);font-size:1.875rem;position:relative;padding-left:0;width:37.5rem;background:none;text-transform:none;height:auto;font-family:Russo One;margin-top:1.5625rem;margin-left:5rem;filter:brightness(50%)}.preview-selections-container .preview-selections-title-container .preview-selections-subtitle{margin-left:5rem}.preview-selections-container .preview-selections-lists-title{display:flex;flex-direction:row;align-items:center;height:1.25rem;margin-left:var(--marginLarge);margin-top:var(--marginLarge)}.preview-selections-container .preview-selections-lists-title .selected-attribute,.preview-selections-container .preview-selections-lists-title .title-arrow,.preview-selections-container .preview-selections-lists-title .title-tag,.preview-selections-container .preview-selections-lists-title .resource-type{color:var(--primary);font-weight:100;font-size:1.125rem;font-family:Russo One;filter:brightness(.9);text-transform:uppercase}.preview-selections-container .preview-selections-lists-title .selected-attribute{color:var(--primaryColor);color:var(--tableText);text-transform:none}.preview-selections-container .preview-selections-lists-title .title-tag{margin-right:.1875rem;color:var(--red)}.preview-selections-container .preview-selections-lists-title .preview-selections-breadcrumb{font-size:1.25rem;line-height:1.25rem}.preview-selections-container .preview-selections-buttons-container{display:flex;justify-content:flex-end;flex-direction:row;width:100%;padding-right:var(--paddingXXL);padding-bottom:var(--paddingXXL);align-items:flex-end}.preview-selections-container .preview-selections-buttons-container .linkButton{position:absolute;left:1.5625rem;color:var(--subText);font-weight:600}.preview-selections-container .preview-selections-buttons-container .secondary-button{background-color:var(--primary)}.preview-selections-container .preview-selections-buttons-container .confirm{background-color:var(--secondary);margin-left:var(--marginMedium)}.preview-selections-container .preview-selections-buttons-container .confirm:disabled{filter:grayscale(1);opacity:.6;pointer-events:none}.preview-selections-container button{width:6.25rem;height:2.5rem;color:var(--white);display:flex;align-items:center;justify-content:center;font-size:.75rem}.preview-selections-container button.confirm,.preview-selections-container button.cancel{background-color:var(--primary)}::ng-deep .preview-selections-container .form-field-content .listBox{min-height:16.5625rem;max-height:16.5625rem;min-width:22.5rem;max-width:22.5rem;overflow:auto}::ng-deep .preview-selections-container .form-field-content .listBox>input{display:none}::ng-deep .preview-selections-container .form-field-content .listBox .text{width:-moz-fit-content;width:fit-content;overflow-x:hidden}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }, { kind: "component", type: PreviewListComponent, selector: "lib-preview-list", inputs: ["label", "clickable", "isLoading", "allNames", "items", "allowRemove", "tooltip", "showfilter"], outputs: ["itemSelected", "itemRemoved"] }, { kind: "component", type: LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }] }); }
|
|
13036
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: PreviewSelectionsComponent, selector: "preview-selections", ngImport: i0, template: "<div class=\"preview-selections-container confirm-modal-container\" [ngClass]=\"{'error-state': state === 'ERROR', 'loading-state': isLoading}\">\n <div class=\"close icon-close\" (click)=\"cancel()\"></div>\n <div class=\"preview-selections-body\">\n <div class=\"preview-selections-content\">\n <div class=\"preview-selections-title-container\">\n <div class=\"confirm-modal-icon\" style=\"background-image: url("../../assets/svgs/Confirm_Trash.svg");\"></div>\n <span class=\"preview-selections-title\">Orphaned Configs & Service Policies</span>\n <span class=\"preview-selections-subtitle\">Preview of all associated entities that will be orphaned and deleted once the selected services are deleted</span>\n </div>\n <div class=\"preview-selections-info-message\" *ngIf=\"infoMessage\" [ngClass]=\"{'error-message': state === 'ERROR'}\">{{infoMessage}}</div>\n <div class=\"preview-selections-main\">\n <div class=\"preview-selections-left-side\">\n <lib-form-field-container\n [showHeader]=\"true\"\n [title]=\"'Services To Delete'\"\n [class]=\"'hide-overflow bold-header-title'\"\n [count]=\"selectedItems.length\"\n >\n <div class=\"selected-items-container\">\n <div class=\"selected-items\">\n <div class=\"selected-items-category\">\n <ul>\n <li class=\"selected-items-item header-item\" (click)=\"previewItem(allItem)\" [ngClass]=\"{'selected': selectedItem.id === 'all'}\">\n <span class=\"selected-item-name\">{{allItem.name}}</span>\n <div class=\"associated-count-container\">\n <div class=\"associated-count-header-group\">\n <div\n class=\"associated-header-icon icon-configuration\"\n matTooltip=\"Configs\"\n matTooltipPosition=\"below\"\n matTooltipShowDelay=\"500\"\n ></div>\n <span class=\"associated-configs-count\">{{allItem.associatedConfigs.length}}</span>\n </div>\n <div class=\"count-divider header-divider\"></div>\n <div class=\"associated-count-header-group\">\n <div\n class=\"associated-header-icon icon-Policies\"\n matTooltip=\"Service Policies\"\n matTooltipPosition=\"below\"\n matTooltipShowDelay=\"500\"\n ></div>\n <span class=\"associated-policies-count\">{{allItem.associatedServicePolicies.length}}</span>\n </div>\n </div>\n </li>\n <div class=\"selected-items-divider\"></div>\n <li *ngFor=\"let item of selectedItems\" class=\"selected-items-item\" (click)=\"previewItem(item)\" [ngClass]=\"{'selected': item.selected}\">\n <span class=\"selected-item-name\">{{item.name}}</span>\n <div class=\"associated-count-container\">\n <div class=\"associated-count-list-group\">\n <span class=\"associated-configs-header-count\">{{allItem.associatedConfigs.length}}</span>\n <span class=\"associated-configs-count\">{{item.associatedConfigs.length}}</span>\n </div>\n <div class=\"count-divider\"></div>\n <div class=\"associated-count-list-group\">\n <span class=\"associated-configs-header-count\">{{allItem.associatedServicePolicies.length}}</span>\n <span class=\"associated-policies-count\">{{item.associatedServicePolicies.length}}</span>\n </div>\n </div>\n </li>\n </ul>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n </div>\n <div class=\"preview-selections-divider\"></div>\n <div class=\"preview-selections-right-side\">\n <div class=\"preview-selections-lists-title\">\n <div class=\"resource-type\"> Selected Service </div>\n <div class=\"icon-next preview-selections-breadcrumb\"></div>\n <div class=\"selected-attribute\"> {{selectedItem.name}} </div>\n </div>\n <div class=\"preview-selections-lists\">\n <lib-form-field-container\n [title]=\"'Orphaned Configs'\"\n [titleIcon]=\"'icon-configuration'\"\n [count]=\"selectedItem.associatedConfigs.length\"\n [class]=\"'hide-overflow'\"\n [helpText]=\"'List of orphaned Configs that will be deleted.'\"\n >\n <lib-preview-list\n [clickable]=\"false\"\n [items]=\"selectedItem.associatedConfigs\"\n [allowRemove]=\"false\"\n ></lib-preview-list>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Orphaned Service Policies'\"\n [titleIcon]=\"'icon-Policies'\"\n [count]=\"selectedItem.associatedServicePolicies.length\"\n [class]=\"'hide-overflow'\"\n [helpText]=\"'List of all orphaned Service Policies that will be deleted.'\"\n >\n <lib-preview-list\n [clickable]=\"false\"\n [items]=\"selectedItem.associatedServicePolicies\"\n [allowRemove]=\"false\"\n ></lib-preview-list>\n </lib-form-field-container>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"preview-selections-buttons-container\">\n <button class=\"button save secondary-button\" (click)=\"return()\">Return</button>\n <button class=\"button save confirm\" *ngIf=\"dataObj.deleteConfirmed && state !== 'ERROR'\" (click)=\"confirm()\" [disabled]=\"isLoading\">Delete All</button>\n </div>\n</div>\n\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>\n", styles: [".preview-selections-container{display:flex;flex-direction:column;background-color:var(--formBackground);border-radius:1.5625rem}.preview-selections-container.loading-state .preview-selections-main,.preview-selections-container.error-state .preview-selections-main{filter:grayscale(1);opacity:.6;cursor:default;pointer-events:none}.preview-selections-container .preview-selections-divider{height:100%;min-height:20.625rem;flex:1 0 auto;display:flex;width:.125rem;max-width:.125rem;border-right-width:.125rem;border-right-color:var(--stroke);border-right-style:solid;margin-right:var(--marginMedium);margin-left:var(--marginMedium);padding-top:var(--paddingXXL);padding-bottom:var(--paddingXXL)}.preview-selections-container .selected-items-container{width:18.75rem;height:100%;min-height:18.75rem;max-height:18.75rem;background-color:var(--navigation);overflow:hidden;display:flex;flex-direction:column}.preview-selections-container .selected-items-container .selected-items-filter-header{display:flex;flex-direction:column;position:relative;margin-top:var(--marginMedium)}.preview-selections-container .selected-items-container .selected-items-filter-header .selected-items-filter-search{margin:0;width:100%;height:2.5rem;float:left;border-radius:1.875rem;font-size:.875rem;font-weight:600;padding-left:1.125rem;background-image:url(/assets/svgs/Filter.svg);background-size:1.125rem;background-position:right .9375rem top .625rem;background-repeat:no-repeat}.preview-selections-container .selected-items-container .selected-items{overflow:hidden;height:100%;display:flex;position:relative;flex-direction:column}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-category-title{margin-left:var(--marginMedium);color:var(--primaryColor);font-weight:700;font-size:.9375rem;filter:brightness(65%);text-transform:uppercase}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item{display:flex;flex-direction:row;justify-content:space-between;font-weight:600;font-size:1rem;padding-top:.1875rem;padding-bottom:.1875rem;padding-left:var(--paddingSmall);position:relative;cursor:pointer;border-left-width:.3125rem;border-left-color:transparent;border-left-style:solid}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item.header-item{margin-top:1.375rem}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item.header-item .selected-item-name{font-weight:900}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item:hover{background-color:#2196f31a;border-left-width:.3125rem;border-left-color:var(--primaryColor)}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item.selected{background-color:#2196f31a;border-left-width:.3125rem;border-left-color:var(--secondaryColor)}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item .selected-item-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:calc(100% - 2.5rem)}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item .selected-items-remove-icon{color:var(--red);margin-right:var(--marginSmall);font-weight:600;font-family:zac;display:flex;justify-content:center;align-items:center}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item .selected-items-remove-icon:before{content:\"\\e927\"}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item .selected-items-remove-icon:hover{filter:brightness(.8)}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item .selected-items-remove-icon:active{transform:translateY(.0625rem)}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item .associated-count-container{display:flex;flex-direction:row;gap:var(--gapMedium);right:.3125rem;justify-content:flex-end;padding-right:var(--paddingSmall);padding-left:var(--paddingSmall)}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item .associated-count-container .count-divider{height:150%;margin-top:-.625rem;width:.0625rem;border-width:0;border-right-width:.0625rem;border-style:solid;border-color:var(--placeholder)}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item .associated-count-container .count-divider.header-divider{height:300%;margin-top:-2.5rem}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item .associated-count-container .associated-configs-header-count{color:transparent;position:relative}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item .associated-count-container .associated-count-list-group{display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-end;position:relative}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item .associated-count-container .associated-count-list-group .associated-configs-count,.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item .associated-count-container .associated-count-list-group .associated-policies-count{position:absolute}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item .associated-count-container .associated-count-header-group{display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-end;position:relative}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item .associated-count-container .associated-count-header-group .associated-header-icon{position:absolute;display:flex;margin-top:-1.5625rem;margin-right:-.3125rem;top:0;right:0;font-size:1.25rem;cursor:default}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item .associated-count-container .associated-configs-count{color:var(--primaryColor)}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-item .associated-count-container .associated-policies-count{color:var(--secondaryColor);filter:brightness(.9)}.preview-selections-container .selected-items-container .selected-items .selected-items-category .selected-items-divider{width:100%;height:.125rem;border-color:var(--placeholder);border-bottom-style:solid;border-bottom-width:.0625rem;border-top-width:0;border-right-width:0;border-left-width:0}.preview-selections-container .selected-items-container .selected-items .selected-items-category ul{padding-inline-start:0rem;margin-block-start:var(--marginSmall);max-height:18.75rem;overflow:auto;overflow-x:hidden}.preview-selections-container .preview-selections-body{display:flex;flex-direction:row;align-items:center}.preview-selections-container .preview-selections-body .preview-selections-content{display:flex;flex-direction:column}.preview-selections-container .preview-selections-body .preview-selections-info-message{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;border-radius:var(--inputBorderRadius);padding:var(--paddingMedium) var(--paddingXL);margin:var(--marginMedium) var(--marginXL);margin-bottom:0}.preview-selections-container .preview-selections-body .preview-selections-info-message.error-message{color:var(--redText);background-color:var(--redShadow)}.preview-selections-container .preview-selections-body .preview-selections-main{display:flex;flex-direction:row;align-items:center;width:75rem;min-height:25rem;height:-moz-fit-content;height:fit-content;gap:var(--gapLarge);padding:0 var(--paddingXXL)}.preview-selections-container .preview-selections-body .preview-selections-main .preview-selections-left-side{width:25rem}.preview-selections-container .preview-selections-body .preview-selections-main .preview-selections-right-side{display:flex;flex-direction:column;height:100%;width:100%;gap:var(--gapSmall)}.preview-selections-container .preview-selections-body .preview-selections-main .preview-selections-right-side .preview-selections-title{height:2.5rem}.preview-selections-container .preview-selections-body .preview-selections-main .preview-selections-right-side .preview-selections-lists{height:20rem;width:100%;display:flex;flex-direction:row;align-items:center;gap:var(--gapLarge)}.preview-selections-container .preview-selections-body .preview-selections-icon{width:7.5rem;height:7.5rem;background-size:contain;z-index:20;box-sizing:var(--shadow);margin-left:var(--marginLarge)}.preview-selections-container .preview-selections-title-container{width:100%;display:flex;flex-direction:column}.preview-selections-container .preview-selections-title-container .confirm-modal-icon{width:3.75rem;height:3.75rem;position:absolute;top:1.25rem;left:1.25rem;background-image:url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22utf-8%22%3F%3E%3C!-- Generator%3A Adobe Illustrator 22.1.0%2C SVG Export Plug-In . SVG Version%3A 6.00 Build 0) --%3E%3C!DOCTYPE svg PUBLIC %22-%2F%2FW3C%2F%2FDTD SVG 1.1%2F%2FEN%22 %22http%3A%2F%2Fwww.w3.org%2FGraphics%2FSVG%2F1.1%2FDTD%2Fsvg11.dtd%22%3E%3Csvg id%3D'Layer_1' style%3D'enable-background%3Anew 0 0 72 72%3B' version%3D'1.1' viewBox%3D'0 0 72 72' x%3D'0px' xml%3Aspace%3D'preserve' xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' y%3D'0px'%3E%3Cstyle type%3D'text%2Fcss'%3E%09.st0 %7B fill%3A %23FFFFFF%3B %7D .st1 %7B fill%3A %23D9DFE3%3B %7D .st2 %7B fill%3A none%3B stroke%3A %23648293%3B stroke-width%3A 1.5%3B stroke-linecap%3A round%3B stroke-linejoin%3A round%3B stroke-miterlimit%3A 10%3B %7D%3C%2Fstyle%3E %3Cpolygon class%3D'st0' points%3D'59.2%2C19.7 59.2%2C13.7 50.4%2C8.7 46.9%2C10.7 35.7%2C2.1 24.5%2C10.7 21.1%2C8.7 12.3%2C13.7 12.3%2C19.7 9.3%2C19.7%0915.2%2C69.5 56.2%2C69.5 62.1%2C19.7 '%2F%3E %3Cpolygon class%3D'st1' points%3D'50.4%2C8.7 46.9%2C10.7 42.6%2C13.1 35.7%2C8.1 28.9%2C13.2 24.5%2C10.7 21.1%2C8.7 12.3%2C13.7 12.3%2C19.7 59.2%2C19.7%0959.2%2C13.7 '%2F%3E %3Cpolygon class%3D'st2' points%3D'9.3%2C19.7 15.2%2C69.5 56.2%2C69.5 62.1%2C19.7 '%2F%3E %3Cg%3E%09%3Cline class%3D'st2' x1%3D'60.1' x2%3D'26.9' y1%3D'36.3' y2%3D'69.5'%2F%3E %3Cline class%3D'st2' x1%3D'54' x2%3D'14' y1%3D'19.7' y2%3D'59.7'%2F%3E %3Cline class%3D'st2' x1%3D'11.6' x2%3D'31.3' y1%3D'39.3' y2%3D'19.7'%2F%3E %3Cline class%3D'st2' x1%3D'11.3' x2%3D'44.5' y1%3D'36.3' y2%3D'69.5'%2F%3E %3Cline class%3D'st2' x1%3D'17.4' x2%3D'57.4' y1%3D'19.7' y2%3D'59.6'%2F%3E %3Cline class%3D'st2' x1%3D'59.8' x2%3D'40.1' y1%3D'39.3' y2%3D'19.7'%2F%3E%3C%2Fg%3E %3Cline class%3D'st2' x1%3D'6.4' x2%3D'65' y1%3D'19.7' y2%3D'19.7'%2F%3E %3Cpolyline class%3D'st2' points%3D'12.3%2C19.7 12.3%2C13.7 21.1%2C8.7 27.6%2C12.4 '%2F%3E %3Cpolyline class%3D'st2' points%3D'59.2%2C19.7 59.2%2C13.7 50.4%2C8.7 43.9%2C12.4 '%2F%3E %3Cpolyline class%3D'st2' points%3D'24.5%2C10.7 35.7%2C2.1 46.9%2C10.7 '%2F%3E%3C%2Fsvg%3E\")}.preview-selections-container .preview-selections-title-container .preview-selections-title{color:var(--primaryColor);font-size:1.875rem;position:relative;padding-left:0;width:37.5rem;background:none;text-transform:none;height:auto;font-family:Russo One;margin-top:1.5625rem;margin-left:5rem;filter:brightness(50%)}.preview-selections-container .preview-selections-title-container .preview-selections-subtitle{margin-left:5rem}.preview-selections-container .preview-selections-lists-title{display:flex;flex-direction:row;align-items:center;height:1.25rem;margin-left:var(--marginLarge);margin-top:var(--marginLarge)}.preview-selections-container .preview-selections-lists-title .selected-attribute,.preview-selections-container .preview-selections-lists-title .title-arrow,.preview-selections-container .preview-selections-lists-title .title-tag,.preview-selections-container .preview-selections-lists-title .resource-type{color:var(--primary);font-weight:100;font-size:1.125rem;font-family:Russo One;filter:brightness(.9);text-transform:uppercase}.preview-selections-container .preview-selections-lists-title .selected-attribute{color:var(--primaryColor);color:var(--tableText);text-transform:none}.preview-selections-container .preview-selections-lists-title .title-tag{margin-right:.1875rem;color:var(--red)}.preview-selections-container .preview-selections-lists-title .preview-selections-breadcrumb{font-size:1.25rem;line-height:1.25rem}.preview-selections-container .preview-selections-buttons-container{display:flex;justify-content:flex-end;flex-direction:row;width:100%;padding-right:var(--paddingXXL);padding-bottom:var(--paddingXXL);align-items:flex-end}.preview-selections-container .preview-selections-buttons-container .linkButton{position:absolute;left:1.5625rem;color:var(--subText);font-weight:600}.preview-selections-container .preview-selections-buttons-container .secondary-button{background-color:var(--primary)}.preview-selections-container .preview-selections-buttons-container .confirm{background-color:var(--secondary);margin-left:var(--marginMedium)}.preview-selections-container .preview-selections-buttons-container .confirm:disabled{filter:grayscale(1);opacity:.6;pointer-events:none}.preview-selections-container button{width:6.25rem;height:2.5rem;color:var(--white);display:flex;align-items:center;justify-content:center;font-size:.75rem}.preview-selections-container button.confirm,.preview-selections-container button.cancel{background-color:var(--primary)}::ng-deep .preview-selections-container .form-field-content .listBox{min-height:16.5625rem;max-height:16.5625rem;min-width:22.5rem;max-width:22.5rem;overflow:auto}::ng-deep .preview-selections-container .form-field-content .listBox>input{display:none}::ng-deep .preview-selections-container .form-field-content .listBox .text{width:-moz-fit-content;width:fit-content;overflow-x:hidden}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }, { kind: "component", type: PreviewListComponent, selector: "lib-preview-list", inputs: ["label", "clickable", "isLoading", "allNames", "items", "allowRemove", "tooltip", "showfilter", "localFilter"], outputs: ["itemSelected", "itemRemoved", "filterChanged"] }, { kind: "component", type: LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }] }); }
|
|
12867
13037
|
}
|
|
12868
13038
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PreviewSelectionsComponent, decorators: [{
|
|
12869
13039
|
type: Component,
|
|
@@ -12901,8 +13071,6 @@ class ServicesPageComponent extends ListPageComponent {
|
|
|
12901
13071
|
this.settingsService = settingsService;
|
|
12902
13072
|
this.extensionService = extensionService;
|
|
12903
13073
|
this.serviceType = '';
|
|
12904
|
-
this.serviceRoleAttributes = [];
|
|
12905
|
-
this.identityRoleAttributes = [];
|
|
12906
13074
|
this.formDataChanged = false;
|
|
12907
13075
|
this.title = 'Services';
|
|
12908
13076
|
this.confirmData = {};
|
|
@@ -12911,8 +13079,8 @@ class ServicesPageComponent extends ListPageComponent {
|
|
|
12911
13079
|
}
|
|
12912
13080
|
ngOnInit() {
|
|
12913
13081
|
super.ngOnInit();
|
|
12914
|
-
this.getServiceRoleAttributes();
|
|
12915
13082
|
this.tabs = this.tabNames.getTabs('services');
|
|
13083
|
+
this.svc.getServiceRoleAttributes();
|
|
12916
13084
|
}
|
|
12917
13085
|
headerActionClicked(action) {
|
|
12918
13086
|
switch (action) {
|
|
@@ -12964,14 +13132,6 @@ class ServicesPageComponent extends ListPageComponent {
|
|
|
12964
13132
|
deleteItem(item) {
|
|
12965
13133
|
this.openBulkDelete([item], 'service');
|
|
12966
13134
|
}
|
|
12967
|
-
getServiceRoleAttributes() {
|
|
12968
|
-
this.svc.getServiceRoleAttributes().then((result) => {
|
|
12969
|
-
this.serviceRoleAttributes = result.data;
|
|
12970
|
-
});
|
|
12971
|
-
this.svc.getIdentityRoleAttributes().then((result) => {
|
|
12972
|
-
this.identityRoleAttributes = result.data;
|
|
12973
|
-
});
|
|
12974
|
-
}
|
|
12975
13135
|
dataChanged(event) {
|
|
12976
13136
|
this.formDataChanged = event;
|
|
12977
13137
|
}
|
|
@@ -12987,7 +13147,6 @@ class ServicesPageComponent extends ListPageComponent {
|
|
|
12987
13147
|
this.svc.sideModalOpen = false;
|
|
12988
13148
|
if (event?.refresh) {
|
|
12989
13149
|
this.refreshData();
|
|
12990
|
-
this.getServiceRoleAttributes();
|
|
12991
13150
|
}
|
|
12992
13151
|
}
|
|
12993
13152
|
serviceTypeSelected(event) {
|
|
@@ -13185,50 +13344,81 @@ class CustomTagsComponent {
|
|
|
13185
13344
|
this.newTagValue = '';
|
|
13186
13345
|
this.errors = {};
|
|
13187
13346
|
this.object = Object;
|
|
13347
|
+
this.newTag = { name: '', value: '', initName: '', initVal: '', showNewTag: true, errors: {} };
|
|
13348
|
+
this.tagNameChangedDebounced = debounce(this.tagNameChanged, 350);
|
|
13349
|
+
this.tagValueChangedDebounced = debounce(this.tagValueChanged, 350);
|
|
13350
|
+
this.updateTagsArrayDebounced = debounce(this.updateTagsArray, 350);
|
|
13351
|
+
this.updateTagsObjectDebounced = debounce(this.updateTagsObject, 350);
|
|
13188
13352
|
}
|
|
13189
13353
|
ngOnInit() {
|
|
13190
|
-
this.updateTagsArray();
|
|
13354
|
+
this.updateTagsArray({});
|
|
13191
13355
|
}
|
|
13192
13356
|
ngOnChanges(changes) {
|
|
13193
|
-
this.updateTagsArray();
|
|
13357
|
+
this.updateTagsArray({});
|
|
13194
13358
|
}
|
|
13195
|
-
updateTagsArray() {
|
|
13359
|
+
updateTagsArray(event) {
|
|
13196
13360
|
this.tagsArray = map$1(this.tags, (value, key) => {
|
|
13197
|
-
return { name: key, value: value };
|
|
13361
|
+
return { name: key, value: value, initName: key, initVal: value, errors: {} };
|
|
13198
13362
|
});
|
|
13199
13363
|
this.tagsChange.emit(this.tags);
|
|
13364
|
+
event?.srcElement?.focus();
|
|
13200
13365
|
}
|
|
13201
|
-
|
|
13202
|
-
this.
|
|
13203
|
-
|
|
13204
|
-
|
|
13205
|
-
|
|
13206
|
-
|
|
13207
|
-
|
|
13208
|
-
|
|
13209
|
-
|
|
13210
|
-
|
|
13211
|
-
}
|
|
13212
|
-
this.
|
|
13213
|
-
|
|
13214
|
-
|
|
13215
|
-
this.
|
|
13366
|
+
updateTagsObject(event) {
|
|
13367
|
+
this.tagsArray.forEach((tag) => {
|
|
13368
|
+
if (tag.initName !== tag.name) {
|
|
13369
|
+
unset(this.tags, tag.initName);
|
|
13370
|
+
tag.initName = tag.name;
|
|
13371
|
+
}
|
|
13372
|
+
if (isEmpty(tag.name) && isEmpty(tag.value)) {
|
|
13373
|
+
unset(this.tags, tag.name);
|
|
13374
|
+
}
|
|
13375
|
+
this.tags[tag.name] = tag.value;
|
|
13376
|
+
});
|
|
13377
|
+
this.tagsChange.emit(this.tags);
|
|
13378
|
+
}
|
|
13379
|
+
addTag(event) {
|
|
13380
|
+
this.validate();
|
|
13381
|
+
set(this.tagsArray, `[${this.tagsArray.length - 1}].showNewTag`, false);
|
|
13382
|
+
const newTag = cloneDeep(this.newTag);
|
|
13383
|
+
this.tagsArray = [...this.tagsArray, newTag];
|
|
13384
|
+
this.updateTagsObject();
|
|
13385
|
+
event?.stopPropagation();
|
|
13386
|
+
event?.preventDefault();
|
|
13216
13387
|
}
|
|
13217
13388
|
removeTag(tagName) {
|
|
13218
13389
|
unset(this.tags, tagName);
|
|
13219
|
-
this.updateTagsArray();
|
|
13390
|
+
this.updateTagsArray({});
|
|
13391
|
+
set(this.tagsArray, `[${this.tagsArray.length - 1}].showNewTag`, true);
|
|
13220
13392
|
}
|
|
13221
13393
|
enterKeyPressed(event) {
|
|
13222
13394
|
this.addTag();
|
|
13223
13395
|
event.stopPropagation();
|
|
13224
13396
|
event.preventDefault();
|
|
13225
13397
|
}
|
|
13398
|
+
tagNameChanged(tag, event) {
|
|
13399
|
+
this.updateTagsObjectDebounced(event);
|
|
13400
|
+
}
|
|
13401
|
+
tagValueChanged(tag, event) {
|
|
13402
|
+
this.updateTagsObjectDebounced(event);
|
|
13403
|
+
}
|
|
13404
|
+
validate(event) {
|
|
13405
|
+
this.tagsArray.forEach((tag) => {
|
|
13406
|
+
const errors = {};
|
|
13407
|
+
if (isEmpty(tag.name)) {
|
|
13408
|
+
errors['name'] = true;
|
|
13409
|
+
}
|
|
13410
|
+
if (isEmpty(tag.value)) {
|
|
13411
|
+
errors['value'] = true;
|
|
13412
|
+
}
|
|
13413
|
+
tag.errors = errors;
|
|
13414
|
+
});
|
|
13415
|
+
}
|
|
13226
13416
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CustomTagsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
13227
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CustomTagsComponent, selector: "lib-custom-tags", inputs: { tags: "tags" }, outputs: { tagsChange: "tagsChange" }, usesOnChanges: true, ngImport: i0, template: "<div id=\"TagExtended\">\n <div class=\"grid tags\">\n <label>Name</label><label>Value</label>\n </div>\n <div id=\"NewTags\" >\n <div class=\"grid tags\" *ngFor=\"let tag of tagsArray\">\n <input\n
|
|
13417
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CustomTagsComponent, selector: "lib-custom-tags", inputs: { tags: "tags" }, outputs: { tagsChange: "tagsChange" }, usesOnChanges: true, ngImport: i0, template: "<div id=\"TagExtended\" (clickOutside)=\"validate($event)\">\n <div class=\"add-button-container add-vlan-button add-config-open\" (click)=\"addTag($event)\">\n <div class=\"icon-add addIcon\"></div>\n <span class=\"add-icon-label\">New Tag</span>\n </div>\n <div *ngIf=\"tagsArray.length >= 1\" class=\"grid tags\">\n <label>Name</label><label>Value</label>\n </div>\n <div id=\"NewTags\" >\n <div *ngIf=\"tagsArray.length <= 0\" class=\"no-tags-container\">\n No tags to display...\n </div>\n <div class=\"grid tags\" *ngFor=\"let tag of tagsArray\">\n <input\n maxlength=\"100\"\n placeholder=\"enter tag name...\"\n [(ngModel)]=\"tag['name']\"\n [ngClass]=\"{invalid: tag.errors.name}\"\n (keyup.enter)=\"enterKeyPressed($event)\"\n (keyup)=\"tagNameChanged(tag, $event)\"\n (change)=\"validate($event)\"\n >\n <input\n placeholder=\"enter tag value...\"\n type=\"text\"\n maxlength=\"100\"\n [(ngModel)]=\"tag['value']\"\n (keyup.enter)=\"enterKeyPressed($event)\"\n (keyup)=\"tagValueChanged(tag, $event)\"\n (change)=\"validate($event)\"\n >\n <div class=\"tag-actions\">\n <div class=\"removeIcon icon-clear\" (click)=\"removeTag(tag.name)\"></div>\n </div>\n </div>\n </div>\n</div>\n", styles: [".grid.tags .invalid{border-color:var(--red)}.no-tags-container{height:2rem;display:flex;align-items:center;color:var(--tableText);opacity:.65;font-weight:600}.add-button-container{position:absolute;right:0;top:-1.5rem;display:flex;flex-direction:row;height:1.75rem;align-items:center;margin-right:0;border-radius:var(--inputBorderRadius);padding:var(--paddingSmall);background:var(--mainBackground);cursor:pointer;transition:.3s;background-color:var(--primaryColor)!important;width:-moz-fit-content;width:fit-content;margin-top:-.25rem;color:var(--offWhite_ALWAYS);gap:var(--gapSmall)}.add-button-container .icon-add{font-size:1rem;position:relative;top:unset;left:unset;right:unset;color:var(--background)}.add-button-container:active{transform:translateY(1px)}.add-button-container:hover{filter:brightness(.93)}.tag-actions{position:absolute;top:0;right:0rem;display:flex;flex-direction:row;justify-content:flex-end;align-items:center;height:100%;margin-right:.5rem;gap:var(--gapSmall)}.tag-actions .addIcon{position:relative;font-size:1.125rem;color:var(--primary);cursor:pointer;transition:var(--transition);top:unset;right:unset}.tag-actions .removeIcon{position:relative;font-size:1.125rem;color:var(--primary);cursor:pointer;font-weight:400;transition:var(--transition);top:unset;right:unset}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.ClickOutsideDirective, selector: "[clickOutside]", inputs: ["clickOutsideEnabled", "attachOutsideOnClick", "delayClickOutsideInit", "emitOnBlur", "exclude", "excludeBeforeClick", "clickOutsideEvents"], outputs: ["clickOutside"] }] }); }
|
|
13228
13418
|
}
|
|
13229
13419
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CustomTagsComponent, decorators: [{
|
|
13230
13420
|
type: Component,
|
|
13231
|
-
args: [{ selector: 'lib-custom-tags', template: "<div id=\"TagExtended\">\n <div class=\"grid tags\">\n <label>Name</label><label>Value</label>\n </div>\n <div id=\"NewTags\" >\n <div class=\"grid tags\" *ngFor=\"let tag of tagsArray\">\n <input\n
|
|
13421
|
+
args: [{ selector: 'lib-custom-tags', template: "<div id=\"TagExtended\" (clickOutside)=\"validate($event)\">\n <div class=\"add-button-container add-vlan-button add-config-open\" (click)=\"addTag($event)\">\n <div class=\"icon-add addIcon\"></div>\n <span class=\"add-icon-label\">New Tag</span>\n </div>\n <div *ngIf=\"tagsArray.length >= 1\" class=\"grid tags\">\n <label>Name</label><label>Value</label>\n </div>\n <div id=\"NewTags\" >\n <div *ngIf=\"tagsArray.length <= 0\" class=\"no-tags-container\">\n No tags to display...\n </div>\n <div class=\"grid tags\" *ngFor=\"let tag of tagsArray\">\n <input\n maxlength=\"100\"\n placeholder=\"enter tag name...\"\n [(ngModel)]=\"tag['name']\"\n [ngClass]=\"{invalid: tag.errors.name}\"\n (keyup.enter)=\"enterKeyPressed($event)\"\n (keyup)=\"tagNameChanged(tag, $event)\"\n (change)=\"validate($event)\"\n >\n <input\n placeholder=\"enter tag value...\"\n type=\"text\"\n maxlength=\"100\"\n [(ngModel)]=\"tag['value']\"\n (keyup.enter)=\"enterKeyPressed($event)\"\n (keyup)=\"tagValueChanged(tag, $event)\"\n (change)=\"validate($event)\"\n >\n <div class=\"tag-actions\">\n <div class=\"removeIcon icon-clear\" (click)=\"removeTag(tag.name)\"></div>\n </div>\n </div>\n </div>\n</div>\n", styles: [".grid.tags .invalid{border-color:var(--red)}.no-tags-container{height:2rem;display:flex;align-items:center;color:var(--tableText);opacity:.65;font-weight:600}.add-button-container{position:absolute;right:0;top:-1.5rem;display:flex;flex-direction:row;height:1.75rem;align-items:center;margin-right:0;border-radius:var(--inputBorderRadius);padding:var(--paddingSmall);background:var(--mainBackground);cursor:pointer;transition:.3s;background-color:var(--primaryColor)!important;width:-moz-fit-content;width:fit-content;margin-top:-.25rem;color:var(--offWhite_ALWAYS);gap:var(--gapSmall)}.add-button-container .icon-add{font-size:1rem;position:relative;top:unset;left:unset;right:unset;color:var(--background)}.add-button-container:active{transform:translateY(1px)}.add-button-container:hover{filter:brightness(.93)}.tag-actions{position:absolute;top:0;right:0rem;display:flex;flex-direction:row;justify-content:flex-end;align-items:center;height:100%;margin-right:.5rem;gap:var(--gapSmall)}.tag-actions .addIcon{position:relative;font-size:1.125rem;color:var(--primary);cursor:pointer;transition:var(--transition);top:unset;right:unset}.tag-actions .removeIcon{position:relative;font-size:1.125rem;color:var(--primary);cursor:pointer;font-weight:400;transition:var(--transition);top:unset;right:unset}\n"] }]
|
|
13232
13422
|
}], ctorParameters: function () { return []; }, propDecorators: { tags: [{
|
|
13233
13423
|
type: Input
|
|
13234
13424
|
}], tagsChange: [{
|
|
@@ -13251,7 +13441,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
13251
13441
|
limitations under the License.
|
|
13252
13442
|
*/
|
|
13253
13443
|
class IdentityFormComponent extends ProjectableForm {
|
|
13254
|
-
constructor(settingsService, svc, identitiesService, zitiService, growlerService, extService, router, route, location) {
|
|
13444
|
+
constructor(settingsService, svc, identitiesService, zitiService, growlerService, extService, router, route, location, dialogForm) {
|
|
13255
13445
|
super(growlerService, extService, zitiService, router, route, location, settingsService);
|
|
13256
13446
|
this.settingsService = settingsService;
|
|
13257
13447
|
this.svc = svc;
|
|
@@ -13259,6 +13449,7 @@ class IdentityFormComponent extends ProjectableForm {
|
|
|
13259
13449
|
this.zitiService = zitiService;
|
|
13260
13450
|
this.router = router;
|
|
13261
13451
|
this.route = route;
|
|
13452
|
+
this.dialogForm = dialogForm;
|
|
13262
13453
|
this.formData = {};
|
|
13263
13454
|
this.identityRoleAttributes = [];
|
|
13264
13455
|
this.close = new EventEmitter();
|
|
@@ -13280,6 +13471,10 @@ class IdentityFormComponent extends ProjectableForm {
|
|
|
13280
13471
|
this.testResultOpen = false;
|
|
13281
13472
|
this.cas = [];
|
|
13282
13473
|
this._apiData = {};
|
|
13474
|
+
this.disableDurationType = 'indefinite';
|
|
13475
|
+
this.identityDisabled = false;
|
|
13476
|
+
this.disableDuration = new Date();
|
|
13477
|
+
this.minDate = new Date();
|
|
13283
13478
|
this.identityRoleAttributes = [];
|
|
13284
13479
|
this.getAuthPolicies();
|
|
13285
13480
|
}
|
|
@@ -13300,7 +13495,19 @@ class IdentityFormComponent extends ProjectableForm {
|
|
|
13300
13495
|
entityUpdated() {
|
|
13301
13496
|
if (this.formData.id) {
|
|
13302
13497
|
this.formData.badges = [];
|
|
13303
|
-
|
|
13498
|
+
const hasERConnectionProp = has(this.formData, 'edgeRouterConnectionStatus');
|
|
13499
|
+
if (hasERConnectionProp) {
|
|
13500
|
+
if (this.formData.edgeRouterConnectionStatus === 'online') {
|
|
13501
|
+
this.formData.badges.push({ label: 'Online', class: 'online', circle: 'true' });
|
|
13502
|
+
}
|
|
13503
|
+
else if (this.formData.edgeRouterConnectionStatus === 'offline') {
|
|
13504
|
+
this.formData.badges.push({ label: 'Offline', class: 'offline', circle: 'false' });
|
|
13505
|
+
}
|
|
13506
|
+
else {
|
|
13507
|
+
this.formData.badges.push({ label: 'Connection Status Unknown', class: 'unknown', circle: 'false' });
|
|
13508
|
+
}
|
|
13509
|
+
}
|
|
13510
|
+
else if (this.formData.hasApiSession || this.formData.hasEdgeRouterConnection) {
|
|
13304
13511
|
this.formData.badges.push({ label: 'Online', class: 'online', circle: 'true' });
|
|
13305
13512
|
}
|
|
13306
13513
|
else {
|
|
@@ -13309,6 +13516,9 @@ class IdentityFormComponent extends ProjectableForm {
|
|
|
13309
13516
|
if (this.formData.enrollment?.ott) {
|
|
13310
13517
|
this.formData.badges.push({ label: 'Unregistered', class: 'unreg' });
|
|
13311
13518
|
}
|
|
13519
|
+
if (this.formData.disabled) {
|
|
13520
|
+
this.formData.badges.push({ label: 'Disabled', class: 'unreg' });
|
|
13521
|
+
}
|
|
13312
13522
|
this.jwt = this.identitiesService.getJWT(this.formData);
|
|
13313
13523
|
this.enrollmentExpiration = this.identitiesService.getEnrollmentExpiration(this.formData);
|
|
13314
13524
|
}
|
|
@@ -13515,9 +13725,18 @@ class IdentityFormComponent extends ProjectableForm {
|
|
|
13515
13725
|
this.testResultOpen = true;
|
|
13516
13726
|
});
|
|
13517
13727
|
}
|
|
13728
|
+
toggleDisableIdentity() {
|
|
13729
|
+
this.identityDisabled = !this.identityDisabled;
|
|
13730
|
+
}
|
|
13518
13731
|
toggleIsAdmin() {
|
|
13519
13732
|
this.formData.isAdmin = !this.formData.isAdmin;
|
|
13520
13733
|
}
|
|
13734
|
+
setDisabledDate(range) {
|
|
13735
|
+
let label;
|
|
13736
|
+
let date = moment();
|
|
13737
|
+
let closeCalendar = true;
|
|
13738
|
+
const dateEncoded = encodeURIComponent(date.toISOString());
|
|
13739
|
+
}
|
|
13521
13740
|
get identityType() {
|
|
13522
13741
|
return this.isEditing ? this.formData.type.name : this.formData.type;
|
|
13523
13742
|
}
|
|
@@ -13529,18 +13748,81 @@ class IdentityFormComponent extends ProjectableForm {
|
|
|
13529
13748
|
set(this.formData, 'type', type);
|
|
13530
13749
|
}
|
|
13531
13750
|
}
|
|
13751
|
+
get entityDisabled() {
|
|
13752
|
+
return this.formData?.disabled;
|
|
13753
|
+
}
|
|
13754
|
+
disableIdentity() {
|
|
13755
|
+
const localDate = moment(this.disableDuration).local();
|
|
13756
|
+
const minutesDifference = localDate.diff(moment(), 'minutes');
|
|
13757
|
+
const confirmData = {
|
|
13758
|
+
appendId: 'DisableIdentity',
|
|
13759
|
+
title: 'Disable Identity',
|
|
13760
|
+
message: `Are you sure you would like to disable this identity ${this.disableDurationType === 'indefinite' ? 'indefinitely' : `until: <br>${localDate}`}?`,
|
|
13761
|
+
confirmLabel: 'Yes',
|
|
13762
|
+
cancelLabel: 'Oops, no get me out of here',
|
|
13763
|
+
showCancelLink: true,
|
|
13764
|
+
imageUrl: '../../assets/svgs/Growl_Warning.svg',
|
|
13765
|
+
};
|
|
13766
|
+
this.dialogRef = this.dialogForm.open(ConfirmComponent, {
|
|
13767
|
+
data: confirmData,
|
|
13768
|
+
autoFocus: false,
|
|
13769
|
+
});
|
|
13770
|
+
this.dialogRef.afterClosed().subscribe({
|
|
13771
|
+
next: (result) => {
|
|
13772
|
+
this.zitiService.post(`/identities/${this.formData.id}/disable`, { durationMinutes: minutesDifference }).then((result) => {
|
|
13773
|
+
const growlerData = new GrowlerModel('success', 'Success', `Identity Disabled`, `Successfully disabled identity`);
|
|
13774
|
+
this.growlerService.show(growlerData);
|
|
13775
|
+
this.refreshIdentity();
|
|
13776
|
+
}).catch((error) => {
|
|
13777
|
+
const errorMessage = this.zitiService.getErrorMessage(error);
|
|
13778
|
+
const growlerData = new GrowlerModel('error', 'Error', `Failed to Disabled`, `Unable to disable identity: "${errorMessage}"`);
|
|
13779
|
+
this.growlerService.show(growlerData);
|
|
13780
|
+
this.refreshIdentity();
|
|
13781
|
+
});
|
|
13782
|
+
},
|
|
13783
|
+
});
|
|
13784
|
+
}
|
|
13785
|
+
enableIdentity() {
|
|
13786
|
+
const confirmData = {
|
|
13787
|
+
appendId: 'EnableIdentity',
|
|
13788
|
+
title: 'Enable Identity',
|
|
13789
|
+
message: `Are you sure you would like to enable this identity?`,
|
|
13790
|
+
confirmLabel: 'Yes',
|
|
13791
|
+
cancelLabel: 'Oops, no get me out of here',
|
|
13792
|
+
showCancelLink: true,
|
|
13793
|
+
imageUrl: '../../assets/svgs/Growl_Warning.svg',
|
|
13794
|
+
};
|
|
13795
|
+
this.dialogRef = this.dialogForm.open(ConfirmComponent, {
|
|
13796
|
+
data: confirmData,
|
|
13797
|
+
autoFocus: false,
|
|
13798
|
+
});
|
|
13799
|
+
this.dialogRef.afterClosed().subscribe({
|
|
13800
|
+
next: (result) => {
|
|
13801
|
+
this.zitiService.post(`/identities/${this.formData.id}/enable`, { durationMinutes: 0 }).then((result) => {
|
|
13802
|
+
const growlerData = new GrowlerModel('success', 'Success', `Identity Enabled`, `Successfully enabled identity`);
|
|
13803
|
+
this.growlerService.show(growlerData);
|
|
13804
|
+
this.refreshIdentity();
|
|
13805
|
+
}).catch((error) => {
|
|
13806
|
+
const errorMessage = this.zitiService.getErrorMessage(error);
|
|
13807
|
+
const growlerData = new GrowlerModel('error', 'Error', `Failed to Enable`, `Unable to enable identity: "${errorMessage}"`);
|
|
13808
|
+
this.growlerService.show(growlerData);
|
|
13809
|
+
this.refreshIdentity();
|
|
13810
|
+
});
|
|
13811
|
+
},
|
|
13812
|
+
});
|
|
13813
|
+
}
|
|
13532
13814
|
closeTestResult() {
|
|
13533
13815
|
this.testResultOpen = false;
|
|
13534
13816
|
}
|
|
13535
13817
|
clear() {
|
|
13536
13818
|
}
|
|
13537
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: IdentityFormComponent, deps: [{ token: SETTINGS_SERVICE }, { token: IdentityFormService }, { token: IdentitiesPageService }, { token: ZITI_DATA_SERVICE }, { token: GrowlerService }, { token: IDENTITY_EXTENSION_SERVICE }, { token: i4.Router }, { token: i4.ActivatedRoute }, { token: i1$4.Location }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
13819
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: IdentityFormComponent, deps: [{ token: SETTINGS_SERVICE }, { token: IdentityFormService }, { token: IdentitiesPageService }, { token: ZITI_DATA_SERVICE }, { token: GrowlerService }, { token: IDENTITY_EXTENSION_SERVICE }, { token: i4.Router }, { token: i4.ActivatedRoute }, { token: i1$4.Location }, { token: i5$1.MatDialog }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
13538
13820
|
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: IdentityFormComponent, selector: "lib-identity-form", inputs: { formData: "formData", identityRoleAttributes: "identityRoleAttributes" }, outputs: { close: "close" }, providers: [
|
|
13539
13821
|
{
|
|
13540
13822
|
provide: MatDialogRef,
|
|
13541
13823
|
useValue: {}
|
|
13542
13824
|
}
|
|
13543
|
-
], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"formData.id ? 'Edit Identity: ' : 'Create New Identity'\"\n [moreActions]=\"moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n ></lib-form-header>\n <div class=\"identity-form-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" *ngIf=\"formView === 'simple'\">\n <div class=\"form-group-column three-fifths\">\n <lib-form-field-container [title]=\"'Identity Name'\" [label]=\"'REQUIRED'\">\n <input\n class=\"form-field-input\"\n placeholder=\"Name this identity\"\n [ngClass]=\"{error: errors['name']}\"\n [(ngModel)]=\"formData.name\"\n autofocus\n #nameFieldInput\n />\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Select or create Identity attributes'\"\n [label]=\"'OPTIONAL'\"\n [contentStyle]=\"'z-index: 99999999'\"\n [helpText]=\"'Attributes are tags applied to an resource. Apply the same tag to other Identities to form a group of Identities.'\"\n >\n <lib-tag-selector\n [(selectedRoleAttributes)]=\"formData.roleAttributes\"\n [availableRoleAttributes]=\"identityRoleAttributes\"\n [placeholder]=\"'Add attributes to group Identities'\"\n ></lib-tag-selector>\n </lib-form-field-container>\n <ng-content select=\"[slot=column-1-slot-1]\"></ng-content>\n <lib-form-field-container\n [title]=\"'Auth Policy'\"\n [label]=\"'OPTIONAL'\"\n [helpText]=\"'Authentication Policies restrict the authentication methods available to identities.'\"\n >\n <select\n [(ngModel)]=\"formData.authPolicyId\"\n id=\"authPolicyId\"\n class=\"form-field-dropdown\"\n >\n <option value=\"\">Select an Authentication Policy</option>\n <option\n *ngFor=\"let policy of authPolicies\"\n [value]=\"policy.id\"\n >\n {{ policy.name }}\n </option>\n </select>\n <div class=\"form-field-label-container\" style=\"gap: var(--paddingMedium)\">\n <div class=\"form-field-header\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">External ID</span>\n </div>\n <span class=\"form-field-label\">OPTIONAL</span>\n </div>\n <input class=\"form-field-input\" placeholder=\"Optional External ID\" [(ngModel)]=\"formData.externalId\"/>\n </div>\n </lib-form-field-container>\n <ng-content select=\"[slot=column-1-slot-2]\"></ng-content>\n <lib-form-field-toggle [(toggleOn)]=\"showMore\" (toggleOnChange)=\"showMoreChanged($event)\" style=\"margin: 0px 10px\"></lib-form-field-toggle>\n <div [hidden]=\"!showMore\" class=\"form-group-column\">\n <lib-form-field-container\n [title]=\"'Enrollment Type'\"\n [title2]=\"enrollmentTypeTitle\"\n [layout]=\"'row'\"\n class=\"form-field-advanced\"\n >\n <select\n id=\"EnrollmentType\"\n class=\"form-field-dropdown\"\n [ngClass]=\"{disabled: isEditing}\"\n [(ngModel)]=\"enrollmentType\"\n (change)=\"updateEnrollment()\"\n >\n <option value=\"ott\">One Time Token</option>\n <option value=\"CA\">Certificate Authority</option>\n <option value=\"updb\">UPDB</option>\n <option value=\"none\">None</option>\n </select>\n <select\n id=\"CertAuthorities\"\n class=\"form-field-dropdown\"\n *ngIf=\"enrollmentType === 'CA'\"\n [ngClass]=\"{disabled: isEditing}\"\n [(ngModel)]=\"enrollmentCA\"\n [ngClass]=\"{error: errors.enrollmentCA}\"\n (change)=\"updateEnrollment()\"\n >\n <option *ngFor=\"let ca of cas\" [value]=\"ca.id\">{{ca.name}}</option>\n </select>\n <input\n *ngIf=\"enrollmentType === 'updb' && !isEditing\"\n [ngClass]=\"{disabled: isEditing, error: errors.enrollmentUPDB}\"\n [(ngModel)]=\"enrollmentUPDB\"\n (keyup)=\"updateEnrollment()\"\n class=\"form-field-input\"\n id=\"UPDBName\"\n type=\"text\"\n maxlength=\"500\"\n placeholder=\"Enter a name\"\n >\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Admin'\"\n [layout]=\"'row'\"\n class=\"form-field-advanced is-admin-container\"\n >\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"config-container-label\">IS ADMIN</div>\n <div\n (click)=\"toggleIsAdmin()\"\n [ngClass]=\"{ on: formData.isAdmin }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.isAdmin\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.isAdmin\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Hosting Cost'\"\n [title2]=\"'Precedence'\"\n [layout]=\"'row'\"\n class=\"form-field-advanced\"\n >\n <input class=\"form-field-input\" [(ngModel)]=\"formData.defaultHostingCost\" type=\"number\"/>\n <select\n [(ngModel)]=\"formData.defaultHostingPrecedence\"\n id=\"hostingPrecedence\"\n class=\"form-field-dropdown\"\n >\n <option value=\"default\">Default</option>\n <option value=\"required\">Required</option>\n <option value=\"failed\">Failed</option>\n </select>\n </lib-form-field-container>\n <lib-form-field-container *ngFor=\"let tagElement of tagElements\"\n [title]=\"tagElement.label\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n >\n <div [innerHTML]=\"tagElement.content | safe\"></div>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Custom Tags'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n *ngIf=\"!hideTags\"\n >\n <lib-custom-tags [(tags)]=\"formData.tags\"></lib-custom-tags>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'App Data'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n >\n <lib-json-view [(data)]=\"formData.appData\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column two-fifths\">\n <ng-content select=\"[slot=column-2-slot-1]\"></ng-content>\n <lib-form-field-container\n *ngIf=\"hasEnrolmentToken || hasAuthenticator\"\n [showHeader]=\"false\"\n >\n <lib-qr-code\n [identity]=\"formData\"\n [jwt]=\"jwt\"\n [expiration]=\"enrollmentExpiration\"\n [authenticators]=\"formData.authenticators\"\n [type]=\"'identity'\"\n [canExpand]=\"true\"\n (doRefresh)=\"refreshIdentity()\"\n ></lib-qr-code>\n </lib-form-field-container>\n <lib-form-field-container\n *ngIf=\"formData.id\"\n [title]=\"'Associated Services'\"\n [count]=\"associatedServices.length\"\n [class]=\"'hide-overflow'\"\n [helpText]=\"'Preview list of all services that this Identity is associated with.'\"\n >\n <lib-preview-list\n (itemSelected)=\"serviceSelected($event)\"\n [clickable]=\"true\"\n [isLoading]=\"servicesLoading\"\n [allNames]=\"associatedServiceNames\"\n ></lib-preview-list>\n <div class=\"svc-test-result\" [ngClass]=\"{'test-result-open': testResultOpen}\">\n <div class=\"close icon-close\" (click)=\"closeTestResult()\"></div>\n <div class=\"result-container\" [innerHTML]=\"testResult\" ></div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n *ngIf=\"formData.id\"\n [title]=\"'Associated Service Policies'\"\n [count]=\"associatedServicePolicies.length\"\n [helpText]=\"'Preview list of all service policies that this Identity is associated with.'\"\n >\n <lib-preview-list\n (itemSelected)=\"serviceSelected($event)\"\n [clickable]=\"false\"\n [isLoading]=\"servicePoliciesLoading\"\n [allNames]=\"associatedServicePolicyNames\"\n ></lib-preview-list>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'API Calls'\"\n [label]=\"''\"\n >\n <div class=\"form-row\">\n <input class=\"form-field-input\" [value]=\"apiCallURL\" readonly/>\n <div class=\"url-copy icon-copy copy\" (click)=\"copyToClipboard(apiCallURL)\"></div>\n </div>\n <lib-json-view *ngIf=\"formData\" [(data)]=\"apiData\" [readOnly]=\"true\" [showCopy]=\"true\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>\n", styles: [".identity-form-container{display:flex;flex-direction:column;height:100%;width:100%;align-items:center;gap:.9375rem}.disabled{opacity:.5;pointer-events:none}::ng-deep .admin-toggle{width:100%;width:35%;display:flex}::ng-deep .admin-toggle .form-field-line{display:none}::ng-deep .admin-toggle .toggle{width:100%}::ng-deep .is-admin-container .form-field-title-container.title-container-2{width:35%!important}.svc-test-result{position:absolute;transition:var(--transition);height:0;width:100%;background-color:var(--background);bottom:0;font-weight:600;padding-left:.625rem;padding-right:.625rem;border-color:var(--inputBorder);border-style:solid;border-width:var(--inputBorderWidth);border-bottom-right-radius:var(--inputBorderRadius);border-bottom-left-radius:var(--inputBorderRadius);border-top-style:none}.svc-test-result.test-result-open{height:-moz-fit-content;height:fit-content;box-shadow:0 -.125rem .6875rem 0 var(--boxShadow);padding-bottom:.9375rem;padding-top:.9375rem}.svc-test-result .close.icon-close{top:.625rem;right:.625rem;font-size:1.125rem;height:1.125rem;width:1.125rem;line-height:1.125rem}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-label{color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-line{border-color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle{border-color:var(--primaryColor);border-style:solid;border-width:var(--inputBorderWidth)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle .switch{top:.0625rem}::ng-deep .copy.icon-copy.url-copy{background-color:var(--navigation)}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.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: i5.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i5.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: FormHeaderComponent, selector: "lib-form-header", inputs: ["data", "badges", "title", "moreActions", "formView", "saveDisabled", "saveTooltip", "actionButtonText", "moreActionsText", "showHeaderToggle", "showHeaderButton"], outputs: ["formViewChange", "actionRequested"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }, { kind: "component", type: PreviewListComponent, selector: "lib-preview-list", inputs: ["label", "clickable", "isLoading", "allNames", "items", "allowRemove", "tooltip", "showfilter"], outputs: ["itemSelected", "itemRemoved"] }, { kind: "component", type: LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }, { kind: "component", type: FormFieldToggleComponent, selector: "lib-form-field-toggle", inputs: ["label", "orientation", "labelOn", "labelOff", "toggleOn"], outputs: ["toggleOnChange"] }, { kind: "component", type: JsonViewComponent, selector: "lib-json-view", inputs: ["data", "schema", "readOnly", "jsonInvalid", "showCopy", "showLineNumbers"], outputs: ["dataChange", "jsonChange", "jsonInvalidChange"] }, { kind: "component", type: TagSelectorComponent, selector: "lib-tag-selector", inputs: ["placeholder", "disableField", "disableCreate", "hideOption", "isLoading", "errorMessage", "focusOnInit", "selectedRoleAttributes", "selectedNamedAttributes", "hasError", "availableRoleAttributes", "availableNamedAttributes"], outputs: ["addRoleAttribute", "addNamedAttribute", "roleAttributeRemoved", "namedAttributeRemoved", "selectedRoleAttributesChange", "selectedNamedAttributesChange", "filterChange"] }, { kind: "component", type: QrCodeComponent, selector: "lib-qr-code", inputs: ["jwt", "token", "expiration", "identity", "type", "authenticators", "qrOnly", "canExpand"], outputs: ["doRefresh"] }, { kind: "component", type: CustomTagsComponent, selector: "lib-custom-tags", inputs: ["tags"], outputs: ["tagsChange"] }, { kind: "pipe", type: SafePipe, name: "safe" }] }); }
|
|
13825
|
+
], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"formData.id ? 'Edit Identity: ' : 'Create New Identity'\"\n [moreActions]=\"moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n ></lib-form-header>\n <div class=\"identity-form-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" *ngIf=\"formView === 'simple'\">\n <div class=\"form-group-column three-fifths\">\n <lib-form-field-container [title]=\"'Identity Name'\" [label]=\"'REQUIRED'\">\n <input\n class=\"form-field-input\"\n placeholder=\"Name this identity\"\n [ngClass]=\"{error: errors['name']}\"\n [(ngModel)]=\"formData.name\"\n autofocus\n #nameFieldInput\n />\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Select or create Identity attributes'\"\n [label]=\"'OPTIONAL'\"\n [contentStyle]=\"'z-index: 99999999'\"\n [helpText]=\"'Attributes are tags applied to an resource. Apply the same tag to other Identities to form a group of Identities.'\"\n >\n <lib-tag-selector\n [(selectedRoleAttributes)]=\"formData.roleAttributes\"\n [availableRoleAttributes]=\"identityRoleAttributes\"\n [placeholder]=\"'Add attributes to group Identities'\"\n ></lib-tag-selector>\n </lib-form-field-container>\n <ng-content select=\"[slot=column-1-slot-1]\"></ng-content>\n <lib-form-field-container\n [title]=\"'Auth Policy'\"\n [label]=\"'OPTIONAL'\"\n [helpText]=\"'Authentication Policies restrict the authentication methods available to identities.'\"\n >\n <select\n [(ngModel)]=\"formData.authPolicyId\"\n id=\"authPolicyId\"\n class=\"form-field-dropdown\"\n >\n <option value=\"\">Select an Authentication Policy</option>\n <option\n *ngFor=\"let policy of authPolicies\"\n [value]=\"policy.id\"\n >\n {{ policy.name }}\n </option>\n </select>\n <div class=\"form-field-label-container\" style=\"gap: var(--paddingMedium)\">\n <div class=\"form-field-header\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">External ID</span>\n </div>\n <span class=\"form-field-label\">OPTIONAL</span>\n </div>\n <input class=\"form-field-input\" placeholder=\"Optional External ID\" [(ngModel)]=\"formData.externalId\"/>\n </div>\n </lib-form-field-container>\n <ng-content select=\"[slot=column-1-slot-2]\"></ng-content>\n <lib-form-field-toggle [(toggleOn)]=\"showMore\" (toggleOnChange)=\"showMoreChanged($event)\" style=\"margin: 0px 10px\"></lib-form-field-toggle>\n <div [hidden]=\"!showMore\" class=\"form-group-column\">\n <lib-form-field-container\n [title]=\"'Enrollment Type'\"\n [title2]=\"enrollmentTypeTitle\"\n [layout]=\"'row'\"\n class=\"form-field-advanced\"\n >\n <select\n id=\"EnrollmentType\"\n class=\"form-field-dropdown\"\n [ngClass]=\"{disabled: isEditing}\"\n [(ngModel)]=\"enrollmentType\"\n (change)=\"updateEnrollment()\"\n >\n <option value=\"ott\">One Time Token</option>\n <option value=\"CA\">Certificate Authority</option>\n <option value=\"updb\">UPDB</option>\n <option value=\"none\">None</option>\n </select>\n <select\n id=\"CertAuthorities\"\n class=\"form-field-dropdown\"\n *ngIf=\"enrollmentType === 'CA'\"\n [ngClass]=\"{disabled: isEditing}\"\n [(ngModel)]=\"enrollmentCA\"\n [ngClass]=\"{error: errors.enrollmentCA}\"\n (change)=\"updateEnrollment()\"\n >\n <option *ngFor=\"let ca of cas\" [value]=\"ca.id\">{{ca.name}}</option>\n </select>\n <input\n *ngIf=\"enrollmentType === 'updb' && !isEditing\"\n [ngClass]=\"{disabled: isEditing, error: errors.enrollmentUPDB}\"\n [(ngModel)]=\"enrollmentUPDB\"\n (keyup)=\"updateEnrollment()\"\n class=\"form-field-input\"\n id=\"UPDBName\"\n type=\"text\"\n maxlength=\"500\"\n placeholder=\"Enter a name\"\n >\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Admin'\"\n [layout]=\"'row'\"\n class=\"form-field-advanced is-admin-container\"\n >\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"config-container-label\">IS ADMIN</div>\n <div\n (click)=\"toggleIsAdmin()\"\n [ngClass]=\"{ on: formData.isAdmin }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.isAdmin\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.isAdmin\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Hosting Cost'\"\n [title2]=\"'Precedence'\"\n [layout]=\"'row'\"\n class=\"form-field-advanced\"\n >\n <input class=\"form-field-input\" [(ngModel)]=\"formData.defaultHostingCost\" type=\"number\"/>\n <select\n [(ngModel)]=\"formData.defaultHostingPrecedence\"\n id=\"hostingPrecedence\"\n class=\"form-field-dropdown\"\n >\n <option value=\"default\">Default</option>\n <option value=\"required\">Required</option>\n <option value=\"failed\">Failed</option>\n </select>\n </lib-form-field-container>\n <lib-form-field-container *ngFor=\"let tagElement of tagElements\"\n [title]=\"tagElement.label\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n >\n <div [innerHTML]=\"tagElement.content | safe\"></div>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Custom Tags'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n *ngIf=\"!hideTags\"\n >\n <lib-custom-tags [(tags)]=\"formData.tags\"></lib-custom-tags>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'App Data'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n >\n <lib-json-view [(data)]=\"formData.appData\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column two-fifths\">\n <ng-content select=\"[slot=column-2-slot-1]\"></ng-content>\n <lib-form-field-container\n *ngIf=\"hasEnrolmentToken || hasAuthenticator\"\n [showHeader]=\"false\"\n >\n <lib-qr-code\n [identity]=\"formData\"\n [jwt]=\"jwt\"\n [expiration]=\"enrollmentExpiration\"\n [authenticators]=\"formData.authenticators\"\n [type]=\"'identity'\"\n [canExpand]=\"true\"\n (doRefresh)=\"refreshIdentity()\"\n ></lib-qr-code>\n </lib-form-field-container>\n <lib-form-field-container\n *ngIf=\"isEdit\"\n [showHeader]=\"false\"\n [layout]=\"'column'\"\n [contentStyle]=\"'z-index: 99999999'\"\n >\n <div *ngIf=\"entityDisabled\" class=\"disable-identity-button-container\" (click)=\"enableIdentity()\">\n <div class=\"disable-identity-background\"></div>\n <button class=\"download-button disable-identity-button\">Enable Identity</button>\n </div>\n <div *ngIf=\"!entityDisabled\" class=\"disable-identity-button-container\" (click)=\"disableIdentity()\">\n <div class=\"disable-identity-background\"></div>\n <button class=\"download-button disable-identity-button\">Disable Identity</button>\n </div>\n <div *ngIf=\"!entityDisabled\" class=\"form-field-label-container\" style=\"gap: var(--paddingMedium)\">\n <div class=\"form-field-header\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Disable Until:</span>\n </div>\n </div>\n <div class=\"disable-identity-duration-container\">\n <select [(ngModel)]=\"disableDurationType\" id=\"DurationType\" class=\"form-field-dropdown\">\n <option value=\"indefinite\">Indefinite</option>\n <option value=\"pick-date\">Pick a Date & Time</option>\n </select>\n <p-calendar\n *ngIf=\"disableDurationType === 'pick-date'\"\n [(ngModel)]=\"disableDuration\"\n (onSelect)=\"setDisabledDate($event)\"\n [showIcon]=\"true\"\n [showTime]=\"true\"\n [minDate]=\"minDate\"\n placeholder=\"Select a date\"\n selectionMode=\"single\"\n #calendar\n >\n </p-calendar>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n *ngIf=\"formData.id\"\n [title]=\"'Associated Services'\"\n [count]=\"associatedServices.length\"\n [class]=\"'hide-overflow'\"\n [helpText]=\"'Preview list of all services that this Identity is associated with.'\"\n >\n <lib-preview-list\n (itemSelected)=\"serviceSelected($event)\"\n [clickable]=\"true\"\n [isLoading]=\"servicesLoading\"\n [allNames]=\"associatedServiceNames\"\n ></lib-preview-list>\n <div class=\"svc-test-result\" [ngClass]=\"{'test-result-open': testResultOpen}\">\n <div class=\"close icon-close\" (click)=\"closeTestResult()\"></div>\n <div class=\"result-container\" [innerHTML]=\"testResult\" ></div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n *ngIf=\"formData.id\"\n [title]=\"'Associated Service Policies'\"\n [count]=\"associatedServicePolicies.length\"\n [helpText]=\"'Preview list of all service policies that this Identity is associated with.'\"\n >\n <lib-preview-list\n (itemSelected)=\"serviceSelected($event)\"\n [clickable]=\"false\"\n [isLoading]=\"servicePoliciesLoading\"\n [allNames]=\"associatedServicePolicyNames\"\n ></lib-preview-list>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'API Calls'\"\n [label]=\"''\"\n >\n <div class=\"form-row\">\n <input class=\"form-field-input\" [value]=\"apiCallURL\" readonly/>\n <div class=\"url-copy icon-copy copy\" (click)=\"copyToClipboard(apiCallURL)\"></div>\n </div>\n <lib-json-view *ngIf=\"formData\" [(data)]=\"apiData\" [readOnly]=\"true\" [showCopy]=\"true\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>\n", styles: [".identity-form-container{display:flex;flex-direction:column;height:100%;width:100%;align-items:center;gap:.9375rem}.disabled{opacity:.5;pointer-events:none}::ng-deep .admin-toggle{width:100%;width:35%;display:flex}::ng-deep .admin-toggle .form-field-line{display:none}::ng-deep .admin-toggle .toggle{width:100%}::ng-deep .is-admin-container .form-field-title-container.title-container-2{width:35%!important}.disable-identity-button-container{position:relative}.disable-identity-duration-container{display:flex;flex-direction:row;gap:var(--gapMedium)}.disable-identity-duration-container .form-field-dropdown{min-width:10rem}.disable-identity-duration-container p-calendar{min-width:12rem}.disable-identity-background{width:100%;height:100%;position:absolute;background:var(--red);border-radius:var(--inputBorderRadius);filter:brightness(.95);height:var(--defaultInputHeight)}.disable-identity-button{background:transparent;border:none;position:relative;z-index:9999999;display:flex;align-items:center;justify-content:center;height:var(--defaultInputHeight)}.svc-test-result{position:absolute;transition:var(--transition);height:0;width:100%;background-color:var(--background);bottom:0;font-weight:600;padding-left:.625rem;padding-right:.625rem;border-color:var(--inputBorder);border-style:solid;border-width:var(--inputBorderWidth);border-bottom-right-radius:var(--inputBorderRadius);border-bottom-left-radius:var(--inputBorderRadius);border-top-style:none}.svc-test-result.test-result-open{height:-moz-fit-content;height:fit-content;box-shadow:0 -.125rem .6875rem 0 var(--boxShadow);padding-bottom:.9375rem;padding-top:.9375rem}.svc-test-result .close.icon-close{top:.625rem;right:.625rem;font-size:1.125rem;height:1.125rem;width:1.125rem;line-height:1.125rem}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-label{color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-line{border-color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle{border-color:var(--primaryColor);border-style:solid;border-width:var(--inputBorderWidth)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle .switch{top:.0625rem}::ng-deep .copy.icon-copy.url-copy{background-color:var(--navigation)}@media (max-width: 1575px){.disable-identity-duration-container{flex-wrap:wrap}}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.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: i5.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i5.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4$1.Calendar, selector: "p-calendar", inputs: ["style", "styleClass", "inputStyle", "inputId", "name", "inputStyleClass", "placeholder", "ariaLabelledBy", "ariaLabel", "iconAriaLabel", "disabled", "dateFormat", "multipleSeparator", "rangeSeparator", "inline", "showOtherMonths", "selectOtherMonths", "showIcon", "icon", "appendTo", "readonlyInput", "shortYearCutoff", "monthNavigator", "yearNavigator", "hourFormat", "timeOnly", "stepHour", "stepMinute", "stepSecond", "showSeconds", "required", "showOnFocus", "showWeek", "showClear", "dataType", "selectionMode", "maxDateCount", "showButtonBar", "todayButtonStyleClass", "clearButtonStyleClass", "autoZIndex", "baseZIndex", "panelStyleClass", "panelStyle", "keepInvalid", "hideOnDateTimeSelect", "touchUI", "timeSeparator", "focusTrap", "showTransitionOptions", "hideTransitionOptions", "tabindex", "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: "component", type: FormHeaderComponent, selector: "lib-form-header", inputs: ["data", "badges", "title", "moreActions", "formView", "saveDisabled", "saveTooltip", "actionButtonText", "moreActionsText", "showHeaderToggle", "showHeaderButton", "multiActions"], outputs: ["formViewChange", "actionRequested", "multiActionRequested"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }, { kind: "component", type: PreviewListComponent, selector: "lib-preview-list", inputs: ["label", "clickable", "isLoading", "allNames", "items", "allowRemove", "tooltip", "showfilter", "localFilter"], outputs: ["itemSelected", "itemRemoved", "filterChanged"] }, { kind: "component", type: LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }, { kind: "component", type: FormFieldToggleComponent, selector: "lib-form-field-toggle", inputs: ["label", "orientation", "labelOn", "labelOff", "toggleOn"], outputs: ["toggleOnChange"] }, { kind: "component", type: JsonViewComponent, selector: "lib-json-view", inputs: ["data", "schema", "readOnly", "jsonInvalid", "showCopy", "showLineNumbers"], outputs: ["dataChange", "jsonChange", "jsonInvalidChange"] }, { kind: "component", type: TagSelectorComponent, selector: "lib-tag-selector", inputs: ["placeholder", "disableField", "disableCreate", "hideOption", "isLoading", "errorMessage", "focusOnInit", "selectedRoleAttributes", "selectedNamedAttributes", "hasError", "availableRoleAttributes", "availableNamedAttributes"], outputs: ["addRoleAttribute", "addNamedAttribute", "roleAttributeRemoved", "namedAttributeRemoved", "selectedRoleAttributesChange", "selectedNamedAttributesChange", "filterChange"] }, { kind: "component", type: QrCodeComponent, selector: "lib-qr-code", inputs: ["jwt", "token", "expiration", "identity", "type", "authenticators", "qrOnly", "canExpand"], outputs: ["doRefresh"] }, { kind: "component", type: CustomTagsComponent, selector: "lib-custom-tags", inputs: ["tags"], outputs: ["tagsChange"] }, { kind: "pipe", type: SafePipe, name: "safe" }] }); }
|
|
13544
13826
|
}
|
|
13545
13827
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: IdentityFormComponent, decorators: [{
|
|
13546
13828
|
type: Component,
|
|
@@ -13549,7 +13831,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
13549
13831
|
provide: MatDialogRef,
|
|
13550
13832
|
useValue: {}
|
|
13551
13833
|
}
|
|
13552
|
-
], template: "<div class=\"projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"formData.id ? 'Edit Identity: ' : 'Create New Identity'\"\n [moreActions]=\"moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n ></lib-form-header>\n <div class=\"identity-form-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" *ngIf=\"formView === 'simple'\">\n <div class=\"form-group-column three-fifths\">\n <lib-form-field-container [title]=\"'Identity Name'\" [label]=\"'REQUIRED'\">\n <input\n class=\"form-field-input\"\n placeholder=\"Name this identity\"\n [ngClass]=\"{error: errors['name']}\"\n [(ngModel)]=\"formData.name\"\n autofocus\n #nameFieldInput\n />\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Select or create Identity attributes'\"\n [label]=\"'OPTIONAL'\"\n [contentStyle]=\"'z-index: 99999999'\"\n [helpText]=\"'Attributes are tags applied to an resource. Apply the same tag to other Identities to form a group of Identities.'\"\n >\n <lib-tag-selector\n [(selectedRoleAttributes)]=\"formData.roleAttributes\"\n [availableRoleAttributes]=\"identityRoleAttributes\"\n [placeholder]=\"'Add attributes to group Identities'\"\n ></lib-tag-selector>\n </lib-form-field-container>\n <ng-content select=\"[slot=column-1-slot-1]\"></ng-content>\n <lib-form-field-container\n [title]=\"'Auth Policy'\"\n [label]=\"'OPTIONAL'\"\n [helpText]=\"'Authentication Policies restrict the authentication methods available to identities.'\"\n >\n <select\n [(ngModel)]=\"formData.authPolicyId\"\n id=\"authPolicyId\"\n class=\"form-field-dropdown\"\n >\n <option value=\"\">Select an Authentication Policy</option>\n <option\n *ngFor=\"let policy of authPolicies\"\n [value]=\"policy.id\"\n >\n {{ policy.name }}\n </option>\n </select>\n <div class=\"form-field-label-container\" style=\"gap: var(--paddingMedium)\">\n <div class=\"form-field-header\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">External ID</span>\n </div>\n <span class=\"form-field-label\">OPTIONAL</span>\n </div>\n <input class=\"form-field-input\" placeholder=\"Optional External ID\" [(ngModel)]=\"formData.externalId\"/>\n </div>\n </lib-form-field-container>\n <ng-content select=\"[slot=column-1-slot-2]\"></ng-content>\n <lib-form-field-toggle [(toggleOn)]=\"showMore\" (toggleOnChange)=\"showMoreChanged($event)\" style=\"margin: 0px 10px\"></lib-form-field-toggle>\n <div [hidden]=\"!showMore\" class=\"form-group-column\">\n <lib-form-field-container\n [title]=\"'Enrollment Type'\"\n [title2]=\"enrollmentTypeTitle\"\n [layout]=\"'row'\"\n class=\"form-field-advanced\"\n >\n <select\n id=\"EnrollmentType\"\n class=\"form-field-dropdown\"\n [ngClass]=\"{disabled: isEditing}\"\n [(ngModel)]=\"enrollmentType\"\n (change)=\"updateEnrollment()\"\n >\n <option value=\"ott\">One Time Token</option>\n <option value=\"CA\">Certificate Authority</option>\n <option value=\"updb\">UPDB</option>\n <option value=\"none\">None</option>\n </select>\n <select\n id=\"CertAuthorities\"\n class=\"form-field-dropdown\"\n *ngIf=\"enrollmentType === 'CA'\"\n [ngClass]=\"{disabled: isEditing}\"\n [(ngModel)]=\"enrollmentCA\"\n [ngClass]=\"{error: errors.enrollmentCA}\"\n (change)=\"updateEnrollment()\"\n >\n <option *ngFor=\"let ca of cas\" [value]=\"ca.id\">{{ca.name}}</option>\n </select>\n <input\n *ngIf=\"enrollmentType === 'updb' && !isEditing\"\n [ngClass]=\"{disabled: isEditing, error: errors.enrollmentUPDB}\"\n [(ngModel)]=\"enrollmentUPDB\"\n (keyup)=\"updateEnrollment()\"\n class=\"form-field-input\"\n id=\"UPDBName\"\n type=\"text\"\n maxlength=\"500\"\n placeholder=\"Enter a name\"\n >\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Admin'\"\n [layout]=\"'row'\"\n class=\"form-field-advanced is-admin-container\"\n >\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"config-container-label\">IS ADMIN</div>\n <div\n (click)=\"toggleIsAdmin()\"\n [ngClass]=\"{ on: formData.isAdmin }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.isAdmin\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.isAdmin\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Hosting Cost'\"\n [title2]=\"'Precedence'\"\n [layout]=\"'row'\"\n class=\"form-field-advanced\"\n >\n <input class=\"form-field-input\" [(ngModel)]=\"formData.defaultHostingCost\" type=\"number\"/>\n <select\n [(ngModel)]=\"formData.defaultHostingPrecedence\"\n id=\"hostingPrecedence\"\n class=\"form-field-dropdown\"\n >\n <option value=\"default\">Default</option>\n <option value=\"required\">Required</option>\n <option value=\"failed\">Failed</option>\n </select>\n </lib-form-field-container>\n <lib-form-field-container *ngFor=\"let tagElement of tagElements\"\n [title]=\"tagElement.label\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n >\n <div [innerHTML]=\"tagElement.content | safe\"></div>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Custom Tags'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n *ngIf=\"!hideTags\"\n >\n <lib-custom-tags [(tags)]=\"formData.tags\"></lib-custom-tags>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'App Data'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n >\n <lib-json-view [(data)]=\"formData.appData\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column two-fifths\">\n <ng-content select=\"[slot=column-2-slot-1]\"></ng-content>\n <lib-form-field-container\n *ngIf=\"hasEnrolmentToken || hasAuthenticator\"\n [showHeader]=\"false\"\n >\n <lib-qr-code\n [identity]=\"formData\"\n [jwt]=\"jwt\"\n [expiration]=\"enrollmentExpiration\"\n [authenticators]=\"formData.authenticators\"\n [type]=\"'identity'\"\n [canExpand]=\"true\"\n (doRefresh)=\"refreshIdentity()\"\n ></lib-qr-code>\n </lib-form-field-container>\n <lib-form-field-container\n *ngIf=\"formData.id\"\n [title]=\"'Associated Services'\"\n [count]=\"associatedServices.length\"\n [class]=\"'hide-overflow'\"\n [helpText]=\"'Preview list of all services that this Identity is associated with.'\"\n >\n <lib-preview-list\n (itemSelected)=\"serviceSelected($event)\"\n [clickable]=\"true\"\n [isLoading]=\"servicesLoading\"\n [allNames]=\"associatedServiceNames\"\n ></lib-preview-list>\n <div class=\"svc-test-result\" [ngClass]=\"{'test-result-open': testResultOpen}\">\n <div class=\"close icon-close\" (click)=\"closeTestResult()\"></div>\n <div class=\"result-container\" [innerHTML]=\"testResult\" ></div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n *ngIf=\"formData.id\"\n [title]=\"'Associated Service Policies'\"\n [count]=\"associatedServicePolicies.length\"\n [helpText]=\"'Preview list of all service policies that this Identity is associated with.'\"\n >\n <lib-preview-list\n (itemSelected)=\"serviceSelected($event)\"\n [clickable]=\"false\"\n [isLoading]=\"servicePoliciesLoading\"\n [allNames]=\"associatedServicePolicyNames\"\n ></lib-preview-list>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'API Calls'\"\n [label]=\"''\"\n >\n <div class=\"form-row\">\n <input class=\"form-field-input\" [value]=\"apiCallURL\" readonly/>\n <div class=\"url-copy icon-copy copy\" (click)=\"copyToClipboard(apiCallURL)\"></div>\n </div>\n <lib-json-view *ngIf=\"formData\" [(data)]=\"apiData\" [readOnly]=\"true\" [showCopy]=\"true\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>\n", styles: [".identity-form-container{display:flex;flex-direction:column;height:100%;width:100%;align-items:center;gap:.9375rem}.disabled{opacity:.5;pointer-events:none}::ng-deep .admin-toggle{width:100%;width:35%;display:flex}::ng-deep .admin-toggle .form-field-line{display:none}::ng-deep .admin-toggle .toggle{width:100%}::ng-deep .is-admin-container .form-field-title-container.title-container-2{width:35%!important}.svc-test-result{position:absolute;transition:var(--transition);height:0;width:100%;background-color:var(--background);bottom:0;font-weight:600;padding-left:.625rem;padding-right:.625rem;border-color:var(--inputBorder);border-style:solid;border-width:var(--inputBorderWidth);border-bottom-right-radius:var(--inputBorderRadius);border-bottom-left-radius:var(--inputBorderRadius);border-top-style:none}.svc-test-result.test-result-open{height:-moz-fit-content;height:fit-content;box-shadow:0 -.125rem .6875rem 0 var(--boxShadow);padding-bottom:.9375rem;padding-top:.9375rem}.svc-test-result .close.icon-close{top:.625rem;right:.625rem;font-size:1.125rem;height:1.125rem;width:1.125rem;line-height:1.125rem}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-label{color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-line{border-color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle{border-color:var(--primaryColor);border-style:solid;border-width:var(--inputBorderWidth)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle .switch{top:.0625rem}::ng-deep .copy.icon-copy.url-copy{background-color:var(--navigation)}\n"] }]
|
|
13834
|
+
], template: "<div class=\"projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"formData.id ? 'Edit Identity: ' : 'Create New Identity'\"\n [moreActions]=\"moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n ></lib-form-header>\n <div class=\"identity-form-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" *ngIf=\"formView === 'simple'\">\n <div class=\"form-group-column three-fifths\">\n <lib-form-field-container [title]=\"'Identity Name'\" [label]=\"'REQUIRED'\">\n <input\n class=\"form-field-input\"\n placeholder=\"Name this identity\"\n [ngClass]=\"{error: errors['name']}\"\n [(ngModel)]=\"formData.name\"\n autofocus\n #nameFieldInput\n />\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Select or create Identity attributes'\"\n [label]=\"'OPTIONAL'\"\n [contentStyle]=\"'z-index: 99999999'\"\n [helpText]=\"'Attributes are tags applied to an resource. Apply the same tag to other Identities to form a group of Identities.'\"\n >\n <lib-tag-selector\n [(selectedRoleAttributes)]=\"formData.roleAttributes\"\n [availableRoleAttributes]=\"identityRoleAttributes\"\n [placeholder]=\"'Add attributes to group Identities'\"\n ></lib-tag-selector>\n </lib-form-field-container>\n <ng-content select=\"[slot=column-1-slot-1]\"></ng-content>\n <lib-form-field-container\n [title]=\"'Auth Policy'\"\n [label]=\"'OPTIONAL'\"\n [helpText]=\"'Authentication Policies restrict the authentication methods available to identities.'\"\n >\n <select\n [(ngModel)]=\"formData.authPolicyId\"\n id=\"authPolicyId\"\n class=\"form-field-dropdown\"\n >\n <option value=\"\">Select an Authentication Policy</option>\n <option\n *ngFor=\"let policy of authPolicies\"\n [value]=\"policy.id\"\n >\n {{ policy.name }}\n </option>\n </select>\n <div class=\"form-field-label-container\" style=\"gap: var(--paddingMedium)\">\n <div class=\"form-field-header\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">External ID</span>\n </div>\n <span class=\"form-field-label\">OPTIONAL</span>\n </div>\n <input class=\"form-field-input\" placeholder=\"Optional External ID\" [(ngModel)]=\"formData.externalId\"/>\n </div>\n </lib-form-field-container>\n <ng-content select=\"[slot=column-1-slot-2]\"></ng-content>\n <lib-form-field-toggle [(toggleOn)]=\"showMore\" (toggleOnChange)=\"showMoreChanged($event)\" style=\"margin: 0px 10px\"></lib-form-field-toggle>\n <div [hidden]=\"!showMore\" class=\"form-group-column\">\n <lib-form-field-container\n [title]=\"'Enrollment Type'\"\n [title2]=\"enrollmentTypeTitle\"\n [layout]=\"'row'\"\n class=\"form-field-advanced\"\n >\n <select\n id=\"EnrollmentType\"\n class=\"form-field-dropdown\"\n [ngClass]=\"{disabled: isEditing}\"\n [(ngModel)]=\"enrollmentType\"\n (change)=\"updateEnrollment()\"\n >\n <option value=\"ott\">One Time Token</option>\n <option value=\"CA\">Certificate Authority</option>\n <option value=\"updb\">UPDB</option>\n <option value=\"none\">None</option>\n </select>\n <select\n id=\"CertAuthorities\"\n class=\"form-field-dropdown\"\n *ngIf=\"enrollmentType === 'CA'\"\n [ngClass]=\"{disabled: isEditing}\"\n [(ngModel)]=\"enrollmentCA\"\n [ngClass]=\"{error: errors.enrollmentCA}\"\n (change)=\"updateEnrollment()\"\n >\n <option *ngFor=\"let ca of cas\" [value]=\"ca.id\">{{ca.name}}</option>\n </select>\n <input\n *ngIf=\"enrollmentType === 'updb' && !isEditing\"\n [ngClass]=\"{disabled: isEditing, error: errors.enrollmentUPDB}\"\n [(ngModel)]=\"enrollmentUPDB\"\n (keyup)=\"updateEnrollment()\"\n class=\"form-field-input\"\n id=\"UPDBName\"\n type=\"text\"\n maxlength=\"500\"\n placeholder=\"Enter a name\"\n >\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Admin'\"\n [layout]=\"'row'\"\n class=\"form-field-advanced is-admin-container\"\n >\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"config-container-label\">IS ADMIN</div>\n <div\n (click)=\"toggleIsAdmin()\"\n [ngClass]=\"{ on: formData.isAdmin }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.isAdmin\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.isAdmin\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Hosting Cost'\"\n [title2]=\"'Precedence'\"\n [layout]=\"'row'\"\n class=\"form-field-advanced\"\n >\n <input class=\"form-field-input\" [(ngModel)]=\"formData.defaultHostingCost\" type=\"number\"/>\n <select\n [(ngModel)]=\"formData.defaultHostingPrecedence\"\n id=\"hostingPrecedence\"\n class=\"form-field-dropdown\"\n >\n <option value=\"default\">Default</option>\n <option value=\"required\">Required</option>\n <option value=\"failed\">Failed</option>\n </select>\n </lib-form-field-container>\n <lib-form-field-container *ngFor=\"let tagElement of tagElements\"\n [title]=\"tagElement.label\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n >\n <div [innerHTML]=\"tagElement.content | safe\"></div>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Custom Tags'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n *ngIf=\"!hideTags\"\n >\n <lib-custom-tags [(tags)]=\"formData.tags\"></lib-custom-tags>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'App Data'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n >\n <lib-json-view [(data)]=\"formData.appData\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column two-fifths\">\n <ng-content select=\"[slot=column-2-slot-1]\"></ng-content>\n <lib-form-field-container\n *ngIf=\"hasEnrolmentToken || hasAuthenticator\"\n [showHeader]=\"false\"\n >\n <lib-qr-code\n [identity]=\"formData\"\n [jwt]=\"jwt\"\n [expiration]=\"enrollmentExpiration\"\n [authenticators]=\"formData.authenticators\"\n [type]=\"'identity'\"\n [canExpand]=\"true\"\n (doRefresh)=\"refreshIdentity()\"\n ></lib-qr-code>\n </lib-form-field-container>\n <lib-form-field-container\n *ngIf=\"isEdit\"\n [showHeader]=\"false\"\n [layout]=\"'column'\"\n [contentStyle]=\"'z-index: 99999999'\"\n >\n <div *ngIf=\"entityDisabled\" class=\"disable-identity-button-container\" (click)=\"enableIdentity()\">\n <div class=\"disable-identity-background\"></div>\n <button class=\"download-button disable-identity-button\">Enable Identity</button>\n </div>\n <div *ngIf=\"!entityDisabled\" class=\"disable-identity-button-container\" (click)=\"disableIdentity()\">\n <div class=\"disable-identity-background\"></div>\n <button class=\"download-button disable-identity-button\">Disable Identity</button>\n </div>\n <div *ngIf=\"!entityDisabled\" class=\"form-field-label-container\" style=\"gap: var(--paddingMedium)\">\n <div class=\"form-field-header\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Disable Until:</span>\n </div>\n </div>\n <div class=\"disable-identity-duration-container\">\n <select [(ngModel)]=\"disableDurationType\" id=\"DurationType\" class=\"form-field-dropdown\">\n <option value=\"indefinite\">Indefinite</option>\n <option value=\"pick-date\">Pick a Date & Time</option>\n </select>\n <p-calendar\n *ngIf=\"disableDurationType === 'pick-date'\"\n [(ngModel)]=\"disableDuration\"\n (onSelect)=\"setDisabledDate($event)\"\n [showIcon]=\"true\"\n [showTime]=\"true\"\n [minDate]=\"minDate\"\n placeholder=\"Select a date\"\n selectionMode=\"single\"\n #calendar\n >\n </p-calendar>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n *ngIf=\"formData.id\"\n [title]=\"'Associated Services'\"\n [count]=\"associatedServices.length\"\n [class]=\"'hide-overflow'\"\n [helpText]=\"'Preview list of all services that this Identity is associated with.'\"\n >\n <lib-preview-list\n (itemSelected)=\"serviceSelected($event)\"\n [clickable]=\"true\"\n [isLoading]=\"servicesLoading\"\n [allNames]=\"associatedServiceNames\"\n ></lib-preview-list>\n <div class=\"svc-test-result\" [ngClass]=\"{'test-result-open': testResultOpen}\">\n <div class=\"close icon-close\" (click)=\"closeTestResult()\"></div>\n <div class=\"result-container\" [innerHTML]=\"testResult\" ></div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n *ngIf=\"formData.id\"\n [title]=\"'Associated Service Policies'\"\n [count]=\"associatedServicePolicies.length\"\n [helpText]=\"'Preview list of all service policies that this Identity is associated with.'\"\n >\n <lib-preview-list\n (itemSelected)=\"serviceSelected($event)\"\n [clickable]=\"false\"\n [isLoading]=\"servicePoliciesLoading\"\n [allNames]=\"associatedServicePolicyNames\"\n ></lib-preview-list>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'API Calls'\"\n [label]=\"''\"\n >\n <div class=\"form-row\">\n <input class=\"form-field-input\" [value]=\"apiCallURL\" readonly/>\n <div class=\"url-copy icon-copy copy\" (click)=\"copyToClipboard(apiCallURL)\"></div>\n </div>\n <lib-json-view *ngIf=\"formData\" [(data)]=\"apiData\" [readOnly]=\"true\" [showCopy]=\"true\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>\n", styles: [".identity-form-container{display:flex;flex-direction:column;height:100%;width:100%;align-items:center;gap:.9375rem}.disabled{opacity:.5;pointer-events:none}::ng-deep .admin-toggle{width:100%;width:35%;display:flex}::ng-deep .admin-toggle .form-field-line{display:none}::ng-deep .admin-toggle .toggle{width:100%}::ng-deep .is-admin-container .form-field-title-container.title-container-2{width:35%!important}.disable-identity-button-container{position:relative}.disable-identity-duration-container{display:flex;flex-direction:row;gap:var(--gapMedium)}.disable-identity-duration-container .form-field-dropdown{min-width:10rem}.disable-identity-duration-container p-calendar{min-width:12rem}.disable-identity-background{width:100%;height:100%;position:absolute;background:var(--red);border-radius:var(--inputBorderRadius);filter:brightness(.95);height:var(--defaultInputHeight)}.disable-identity-button{background:transparent;border:none;position:relative;z-index:9999999;display:flex;align-items:center;justify-content:center;height:var(--defaultInputHeight)}.svc-test-result{position:absolute;transition:var(--transition);height:0;width:100%;background-color:var(--background);bottom:0;font-weight:600;padding-left:.625rem;padding-right:.625rem;border-color:var(--inputBorder);border-style:solid;border-width:var(--inputBorderWidth);border-bottom-right-radius:var(--inputBorderRadius);border-bottom-left-radius:var(--inputBorderRadius);border-top-style:none}.svc-test-result.test-result-open{height:-moz-fit-content;height:fit-content;box-shadow:0 -.125rem .6875rem 0 var(--boxShadow);padding-bottom:.9375rem;padding-top:.9375rem}.svc-test-result .close.icon-close{top:.625rem;right:.625rem;font-size:1.125rem;height:1.125rem;width:1.125rem;line-height:1.125rem}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-label{color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-line{border-color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle{border-color:var(--primaryColor);border-style:solid;border-width:var(--inputBorderWidth)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle .switch{top:.0625rem}::ng-deep .copy.icon-copy.url-copy{background-color:var(--navigation)}@media (max-width: 1575px){.disable-identity-duration-container{flex-wrap:wrap}}\n"] }]
|
|
13553
13835
|
}], ctorParameters: function () { return [{ type: SettingsService, decorators: [{
|
|
13554
13836
|
type: Inject,
|
|
13555
13837
|
args: [SETTINGS_SERVICE]
|
|
@@ -13559,7 +13841,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
13559
13841
|
}] }, { type: GrowlerService }, { type: undefined, decorators: [{
|
|
13560
13842
|
type: Inject,
|
|
13561
13843
|
args: [IDENTITY_EXTENSION_SERVICE]
|
|
13562
|
-
}] }, { type: i4.Router }, { type: i4.ActivatedRoute }, { type: i1$4.Location }]; }, propDecorators: { formData: [{
|
|
13844
|
+
}] }, { type: i4.Router }, { type: i4.ActivatedRoute }, { type: i1$4.Location }, { type: i5$1.MatDialog }]; }, propDecorators: { formData: [{
|
|
13563
13845
|
type: Input
|
|
13564
13846
|
}], identityRoleAttributes: [{
|
|
13565
13847
|
type: Input
|
|
@@ -17008,7 +17290,7 @@ class EdgeRouterFormComponent extends ProjectableForm {
|
|
|
17008
17290
|
provide: MatDialogRef,
|
|
17009
17291
|
useValue: {}
|
|
17010
17292
|
}
|
|
17011
|
-
], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"formData.id ? 'Edit Edge Router: ' : 'Create New Edge Router'\"\n [moreActions]=\"moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n ></lib-form-header>\n <div class=\"edge-router-form-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" *ngIf=\"formView === 'simple'\">\n <div class=\"form-group-column three-fifths\">\n <lib-form-field-container [title]=\"'Edge Router Name'\" [label]=\"'REQUIRED'\">\n <input\n class=\"form-field-input\"\n placeholder=\"Name this edge router\"\n [ngClass]=\"{error: errors['name']}\"\n [(ngModel)]=\"formData.name\"\n autofocus\n #nameFieldInput\n />\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Select or create Edge Router attributes'\"\n [label]=\"'OPTIONAL'\"\n [contentStyle]=\"'z-index: 99999999'\"\n [helpText]=\"'Attributes are tags applied to an resource. Apply the same tag to other Edge Routers to form a group of Edge Routers.'\"\n >\n <lib-tag-selector\n [(selectedRoleAttributes)]=\"formData.roleAttributes\"\n [availableRoleAttributes]=\"edgeRouterRoleAttributes\"\n [placeholder]=\"'Add attributes to group Edge Routers'\"\n ></lib-tag-selector>\n </lib-form-field-container>\n <ng-content select=\"[slot=column-1-slot-1]\"></ng-content>\n <lib-form-field-toggle [(toggleOn)]=\"showMore\" style=\"margin: 0px 10px\"></lib-form-field-toggle>\n <div *ngIf=\"showMore\" class=\"form-group-column\">\n <lib-form-field-container\n [title]=\"'TUNNELER'\"\n [title2]=\"'TRAVERSAL'\"\n [layout]=\"'row'\"\n class=\"form-field-advanced\"\n >\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"config-container-label\">TUNNELER ENABLED</div>\n <div\n (click)=\"toggleTunnelerEnabled()\"\n [ngClass]=\"{ on: formData.isTunnelerEnabled }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.isTunnelerEnabled\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.isTunnelerEnabled\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"config-container-label\">ALLOW TRAVERSAL</div>\n <div\n (click)=\"toggleNoTraversal()\"\n [ngClass]=\"{ on: !formData.noTraversal }\"\n class=\"toggle\"\n >\n <span [hidden]=\"formData.noTraversal\" class=\"on-label\">YES</span>\n <span [hidden]=\"!formData.noTraversal\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Custom Tags'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n >\n <lib-custom-tags [(tags)]=\"formData.tags\"></lib-custom-tags>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'App Data'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n >\n <lib-json-view [(data)]=\"formData.appData\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column two-fifths\">\n <ng-content select=\"[slot=column-2-slot-1]\"></ng-content>\n <lib-form-field-container\n *ngIf=\"hasEnrolmentToken && !extService['hideZitiRegistration']\"\n [showHeader]=\"false\"\n >\n <lib-qr-code\n [identity]=\"formData\"\n [jwt]=\"formData.enrollmentJwt\"\n [token]=\"formData.enrollmentToken\"\n [expiration]=\"formData.enrollmentExpiresAt\"\n (doRefresh)=\"refreshEdgeRouter()\"\n [type]=\"'router'\"\n ></lib-qr-code>\n </lib-form-field-container>\n <lib-form-field-container\n *ngIf=\"formData.id\"\n [title]=\"'Associated Services'\"\n [count]=\"svc.associatedServices.length\"\n [class]=\"'hide-overflow'\"\n [helpText]=\"'Preview list of all services that this Edge Router is associated with.'\"\n >\n <lib-preview-list\n [clickable]=\"false\"\n [isLoading]=\"servicesLoading\"\n [allNames]=\"svc.associatedServiceNames\"\n ></lib-preview-list>\n </lib-form-field-container>\n <lib-form-field-container\n *ngIf=\"formData.id\"\n [title]=\"'Associated Identities'\"\n [count]=\"svc.associatedIdentities.length\"\n [helpText]=\"'Preview list of all Identities that this Edge Router is associated with.'\"\n >\n <lib-preview-list\n [clickable]=\"false\"\n [isLoading]=\"identitiesLoading\"\n [allNames]=\"svc.associatedIdentityNames\"\n ></lib-preview-list>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'API Calls'\"\n [label]=\"'OPTIONAL'\"\n >\n <div class=\"form-row\">\n <input class=\"form-field-input\" [value]=\"apiCallURL\"/>\n <div class=\"icon-copy copy\" (click)=\"copyToClipboard(apiCallURL)\"></div>\n </div>\n <lib-json-view *ngIf=\"formData\" [(data)]=\"apiData\" [readOnly]=\"true\" [showCopy]=\"true\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>", styles: [".edge-router-form-container{display:flex;flex-direction:column;height:100%;width:100%;align-items:center;gap:.9375rem}.form-field-dropdown{background-image:url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22utf-8%22%3F%3E%3C!-- Generator%3A Adobe Illustrator 23.0.3%2C SVG Export Plug-In . SVG Version%3A 6.00 Build 0) --%3E%3Csvg id%3D'Stroke_Color' style%3D'enable-background%3Anew 0 0 20.2 10.8%3B' version%3D'1.1' viewBox%3D'0 0 20.2 10.8' x%3D'0px' xml%3Aspace%3D'preserve' xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' y%3D'0px'%3E%3Cstyle type%3D'text%2Fcss'%3E%09.st0 %7B fill%3A %23668291%3B %7D%3C%2Fstyle%3E %3Cg%3E%09%3Cpath class%3D'st0' d%3D'M19.8%2C1.7c0%2C0.4-0.1%2C0.7-0.4%2C0.9l-8.5%2C7.3c-0.5%2C0.4-1.2%2C0.4-1.6%2C0L0.7%2C2.7C0.2%2C2.2%2C0.2%2C1.5%2C0.6%2C0.9%09%09c0.5-0.5%2C1.2-0.6%2C1.8-0.1l7.7%2C6.6l7.7-6.6c0.5-0.5%2C1.3-0.4%2C1.8%2C0.1C19.7%2C1.2%2C19.8%2C1.5%2C19.8%2C1.7z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E\");background-position:center right .625rem;background-repeat:no-repeat;background-size:1.125rem;padding-right:1.75rem}.disabled{opacity:.5;pointer-events:none}::ng-deep .admin-toggle{width:100%;width:35%;display:flex}::ng-deep .admin-toggle .form-field-line{display:none}::ng-deep .admin-toggle .toggle{width:100%}::ng-deep .is-admin-container .form-field-title-container.title-container-2{width:35%!important}.svc-test-result{position:absolute;transition:var(--transition);height:0;width:100%;background-color:var(--background);bottom:0;font-weight:600;padding-left:.625rem;padding-right:.625rem;border-color:var(--inputBorder);border-style:solid;border-width:var(--inputBorderWidth);border-bottom-right-radius:var(--inputBorderRadius);border-bottom-left-radius:var(--inputBorderRadius);border-top-style:none}.svc-test-result.test-result-open{height:-moz-fit-content;height:fit-content;box-shadow:0 -.125rem .6875rem 0 var(--boxShadow);padding-bottom:.9375rem;padding-top:.9375rem}.svc-test-result .close.icon-close{top:.625rem;right:.625rem;font-size:1.125rem;height:1.125rem;width:1.125rem;line-height:1.125rem}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-label{color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-line{border-color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle{border-color:var(--primaryColor);border-style:solid;border-width:var(--inputBorderWidth)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle .switch{top:.0625rem}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: FormHeaderComponent, selector: "lib-form-header", inputs: ["data", "badges", "title", "moreActions", "formView", "saveDisabled", "saveTooltip", "actionButtonText", "moreActionsText", "showHeaderToggle", "showHeaderButton"], outputs: ["formViewChange", "actionRequested"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }, { kind: "component", type: PreviewListComponent, selector: "lib-preview-list", inputs: ["label", "clickable", "isLoading", "allNames", "items", "allowRemove", "tooltip", "showfilter"], outputs: ["itemSelected", "itemRemoved"] }, { kind: "component", type: LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }, { kind: "component", type: FormFieldToggleComponent, selector: "lib-form-field-toggle", inputs: ["label", "orientation", "labelOn", "labelOff", "toggleOn"], outputs: ["toggleOnChange"] }, { kind: "component", type: JsonViewComponent, selector: "lib-json-view", inputs: ["data", "schema", "readOnly", "jsonInvalid", "showCopy", "showLineNumbers"], outputs: ["dataChange", "jsonChange", "jsonInvalidChange"] }, { kind: "component", type: TagSelectorComponent, selector: "lib-tag-selector", inputs: ["placeholder", "disableField", "disableCreate", "hideOption", "isLoading", "errorMessage", "focusOnInit", "selectedRoleAttributes", "selectedNamedAttributes", "hasError", "availableRoleAttributes", "availableNamedAttributes"], outputs: ["addRoleAttribute", "addNamedAttribute", "roleAttributeRemoved", "namedAttributeRemoved", "selectedRoleAttributesChange", "selectedNamedAttributesChange", "filterChange"] }, { kind: "component", type: QrCodeComponent, selector: "lib-qr-code", inputs: ["jwt", "token", "expiration", "identity", "type", "authenticators", "qrOnly", "canExpand"], outputs: ["doRefresh"] }, { kind: "component", type: CustomTagsComponent, selector: "lib-custom-tags", inputs: ["tags"], outputs: ["tagsChange"] }] }); }
|
|
17293
|
+
], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"formData.id ? 'Edit Edge Router: ' : 'Create New Edge Router'\"\n [moreActions]=\"moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n ></lib-form-header>\n <div class=\"edge-router-form-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" *ngIf=\"formView === 'simple'\">\n <div class=\"form-group-column three-fifths\">\n <lib-form-field-container [title]=\"'Edge Router Name'\" [label]=\"'REQUIRED'\">\n <input\n class=\"form-field-input\"\n placeholder=\"Name this edge router\"\n [ngClass]=\"{error: errors['name']}\"\n [(ngModel)]=\"formData.name\"\n autofocus\n #nameFieldInput\n />\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Select or create Edge Router attributes'\"\n [label]=\"'OPTIONAL'\"\n [contentStyle]=\"'z-index: 99999999'\"\n [helpText]=\"'Attributes are tags applied to an resource. Apply the same tag to other Edge Routers to form a group of Edge Routers.'\"\n >\n <lib-tag-selector\n [(selectedRoleAttributes)]=\"formData.roleAttributes\"\n [availableRoleAttributes]=\"edgeRouterRoleAttributes\"\n [placeholder]=\"'Add attributes to group Edge Routers'\"\n ></lib-tag-selector>\n </lib-form-field-container>\n <ng-content select=\"[slot=column-1-slot-1]\"></ng-content>\n <lib-form-field-toggle [(toggleOn)]=\"showMore\" style=\"margin: 0px 10px\"></lib-form-field-toggle>\n <div *ngIf=\"showMore\" class=\"form-group-column\">\n <lib-form-field-container\n [title]=\"'TUNNELER'\"\n [title2]=\"'TRAVERSAL'\"\n [layout]=\"'row'\"\n class=\"form-field-advanced\"\n >\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"config-container-label\">TUNNELER ENABLED</div>\n <div\n (click)=\"toggleTunnelerEnabled()\"\n [ngClass]=\"{ on: formData.isTunnelerEnabled }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.isTunnelerEnabled\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.isTunnelerEnabled\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"config-container-label\">ALLOW TRAVERSAL</div>\n <div\n (click)=\"toggleNoTraversal()\"\n [ngClass]=\"{ on: !formData.noTraversal }\"\n class=\"toggle\"\n >\n <span [hidden]=\"formData.noTraversal\" class=\"on-label\">YES</span>\n <span [hidden]=\"!formData.noTraversal\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Custom Tags'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n >\n <lib-custom-tags [(tags)]=\"formData.tags\"></lib-custom-tags>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'App Data'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n >\n <lib-json-view [(data)]=\"formData.appData\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column two-fifths\">\n <ng-content select=\"[slot=column-2-slot-1]\"></ng-content>\n <lib-form-field-container\n *ngIf=\"hasEnrolmentToken && !extService['hideZitiRegistration']\"\n [showHeader]=\"false\"\n >\n <lib-qr-code\n [identity]=\"formData\"\n [jwt]=\"formData.enrollmentJwt\"\n [token]=\"formData.enrollmentToken\"\n [expiration]=\"formData.enrollmentExpiresAt\"\n (doRefresh)=\"refreshEdgeRouter()\"\n [type]=\"'router'\"\n ></lib-qr-code>\n </lib-form-field-container>\n <lib-form-field-container\n *ngIf=\"formData.id\"\n [title]=\"'Associated Services'\"\n [count]=\"svc.associatedServices.length\"\n [class]=\"'hide-overflow'\"\n [helpText]=\"'Preview list of all services that this Edge Router is associated with.'\"\n >\n <lib-preview-list\n [clickable]=\"false\"\n [isLoading]=\"servicesLoading\"\n [allNames]=\"svc.associatedServiceNames\"\n ></lib-preview-list>\n </lib-form-field-container>\n <lib-form-field-container\n *ngIf=\"formData.id\"\n [title]=\"'Associated Identities'\"\n [count]=\"svc.associatedIdentities.length\"\n [helpText]=\"'Preview list of all Identities that this Edge Router is associated with.'\"\n >\n <lib-preview-list\n [clickable]=\"false\"\n [isLoading]=\"identitiesLoading\"\n [allNames]=\"svc.associatedIdentityNames\"\n ></lib-preview-list>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'API Calls'\"\n [label]=\"'OPTIONAL'\"\n >\n <div class=\"form-row\">\n <input class=\"form-field-input\" [value]=\"apiCallURL\"/>\n <div class=\"icon-copy copy\" (click)=\"copyToClipboard(apiCallURL)\"></div>\n </div>\n <lib-json-view *ngIf=\"formData\" [(data)]=\"apiData\" [readOnly]=\"true\" [showCopy]=\"true\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>", styles: [".edge-router-form-container{display:flex;flex-direction:column;height:100%;width:100%;align-items:center;gap:.9375rem}.form-field-dropdown{background-image:url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22utf-8%22%3F%3E%3C!-- Generator%3A Adobe Illustrator 23.0.3%2C SVG Export Plug-In . SVG Version%3A 6.00 Build 0) --%3E%3Csvg id%3D'Stroke_Color' style%3D'enable-background%3Anew 0 0 20.2 10.8%3B' version%3D'1.1' viewBox%3D'0 0 20.2 10.8' x%3D'0px' xml%3Aspace%3D'preserve' xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' y%3D'0px'%3E%3Cstyle type%3D'text%2Fcss'%3E%09.st0 %7B fill%3A %23668291%3B %7D%3C%2Fstyle%3E %3Cg%3E%09%3Cpath class%3D'st0' d%3D'M19.8%2C1.7c0%2C0.4-0.1%2C0.7-0.4%2C0.9l-8.5%2C7.3c-0.5%2C0.4-1.2%2C0.4-1.6%2C0L0.7%2C2.7C0.2%2C2.2%2C0.2%2C1.5%2C0.6%2C0.9%09%09c0.5-0.5%2C1.2-0.6%2C1.8-0.1l7.7%2C6.6l7.7-6.6c0.5-0.5%2C1.3-0.4%2C1.8%2C0.1C19.7%2C1.2%2C19.8%2C1.5%2C19.8%2C1.7z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E\");background-position:center right .625rem;background-repeat:no-repeat;background-size:1.125rem;padding-right:1.75rem}.disabled{opacity:.5;pointer-events:none}::ng-deep .admin-toggle{width:100%;width:35%;display:flex}::ng-deep .admin-toggle .form-field-line{display:none}::ng-deep .admin-toggle .toggle{width:100%}::ng-deep .is-admin-container .form-field-title-container.title-container-2{width:35%!important}.svc-test-result{position:absolute;transition:var(--transition);height:0;width:100%;background-color:var(--background);bottom:0;font-weight:600;padding-left:.625rem;padding-right:.625rem;border-color:var(--inputBorder);border-style:solid;border-width:var(--inputBorderWidth);border-bottom-right-radius:var(--inputBorderRadius);border-bottom-left-radius:var(--inputBorderRadius);border-top-style:none}.svc-test-result.test-result-open{height:-moz-fit-content;height:fit-content;box-shadow:0 -.125rem .6875rem 0 var(--boxShadow);padding-bottom:.9375rem;padding-top:.9375rem}.svc-test-result .close.icon-close{top:.625rem;right:.625rem;font-size:1.125rem;height:1.125rem;width:1.125rem;line-height:1.125rem}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-label{color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-line{border-color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle{border-color:var(--primaryColor);border-style:solid;border-width:var(--inputBorderWidth)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle .switch{top:.0625rem}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: FormHeaderComponent, selector: "lib-form-header", inputs: ["data", "badges", "title", "moreActions", "formView", "saveDisabled", "saveTooltip", "actionButtonText", "moreActionsText", "showHeaderToggle", "showHeaderButton", "multiActions"], outputs: ["formViewChange", "actionRequested", "multiActionRequested"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }, { kind: "component", type: PreviewListComponent, selector: "lib-preview-list", inputs: ["label", "clickable", "isLoading", "allNames", "items", "allowRemove", "tooltip", "showfilter", "localFilter"], outputs: ["itemSelected", "itemRemoved", "filterChanged"] }, { kind: "component", type: LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }, { kind: "component", type: FormFieldToggleComponent, selector: "lib-form-field-toggle", inputs: ["label", "orientation", "labelOn", "labelOff", "toggleOn"], outputs: ["toggleOnChange"] }, { kind: "component", type: JsonViewComponent, selector: "lib-json-view", inputs: ["data", "schema", "readOnly", "jsonInvalid", "showCopy", "showLineNumbers"], outputs: ["dataChange", "jsonChange", "jsonInvalidChange"] }, { kind: "component", type: TagSelectorComponent, selector: "lib-tag-selector", inputs: ["placeholder", "disableField", "disableCreate", "hideOption", "isLoading", "errorMessage", "focusOnInit", "selectedRoleAttributes", "selectedNamedAttributes", "hasError", "availableRoleAttributes", "availableNamedAttributes"], outputs: ["addRoleAttribute", "addNamedAttribute", "roleAttributeRemoved", "namedAttributeRemoved", "selectedRoleAttributesChange", "selectedNamedAttributesChange", "filterChange"] }, { kind: "component", type: QrCodeComponent, selector: "lib-qr-code", inputs: ["jwt", "token", "expiration", "identity", "type", "authenticators", "qrOnly", "canExpand"], outputs: ["doRefresh"] }, { kind: "component", type: CustomTagsComponent, selector: "lib-custom-tags", inputs: ["tags"], outputs: ["tagsChange"] }] }); }
|
|
17012
17294
|
}
|
|
17013
17295
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EdgeRouterFormComponent, decorators: [{
|
|
17014
17296
|
type: Component,
|
|
@@ -17317,7 +17599,7 @@ class TransitRouterFormComponent extends ProjectableForm {
|
|
|
17317
17599
|
provide: MatDialogRef,
|
|
17318
17600
|
useValue: {}
|
|
17319
17601
|
}
|
|
17320
|
-
], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"formData.id ? 'Edit Transit Router: ' : 'Create New Transit Router'\"\n [moreActions]=\"moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n ></lib-form-header>\n <div class=\"edge-router-form-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" *ngIf=\"formView === 'simple'\">\n <div class=\"form-group-column three-fifths\">\n <lib-form-field-container [title]=\"'Edge Router Name'\" [label]=\"'REQUIRED'\">\n <input\n class=\"form-field-input\"\n placeholder=\"Name this edge router\"\n [ngClass]=\"{error: errors['name']}\"\n [(ngModel)]=\"formData.name\"\n autofocus\n #nameFieldInput\n />\n </lib-form-field-container>\n <lib-form-field-container\n [showHeader]=\"false\"\n [layout]=\"'row'\"\n >\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Cost</span>\n </div>\n <input\n type=\"number\"\n class=\"form-field-input\"\n placeholder=\"Name this edge router\"\n [ngClass]=\"{error: errors['cost']}\"\n [(ngModel)]=\"formData.cost\"\n />\n </div>\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"config-container-label\">ENABLED</div>\n <div\n (click)=\"toggleDisabled()\"\n [ngClass]=\"{ on: !formData.disabled }\"\n class=\"toggle\"\n >\n <span [hidden]=\"formData.disabled\" class=\"on-label\">YES</span>\n <span [hidden]=\"!formData.disabled\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"config-container-label\">ALLOW TRAVERSAL</div>\n <div\n (click)=\"toggleNoTraversal()\"\n [ngClass]=\"{ on: !formData.noTraversal }\"\n class=\"toggle\"\n >\n <span [hidden]=\"formData.noTraversal\" class=\"on-label\">YES</span>\n <span [hidden]=\"!formData.noTraversal\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n <ng-content select=\"[slot=column-1-slot-1]\"></ng-content>\n <lib-form-field-toggle [(toggleOn)]=\"showMore\" style=\"margin: 0px 10px\"></lib-form-field-toggle>\n <div *ngIf=\"showMore\" class=\"form-group-column\">\n <lib-form-field-container\n [title]=\"'Custom Tags'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n >\n <lib-custom-tags [(tags)]=\"formData.tags\"></lib-custom-tags>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column two-fifths\">\n <ng-content select=\"[slot=column-2-slot-1]\"></ng-content>\n <lib-form-field-container\n *ngIf=\"hasEnrolmentToken && !extService['hideZitiRegistration']\"\n [showHeader]=\"false\"\n >\n <lib-qr-code\n [identity]=\"formData\"\n [jwt]=\"formData.enrollmentJwt\"\n [token]=\"formData.enrollmentToken\"\n [expiration]=\"formData.enrollmentExpiresAt\"\n (doRefresh)=\"refreshEdgeRouter()\"\n [type]=\"'router'\"\n ></lib-qr-code>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'API Calls'\"\n [label]=\"'OPTIONAL'\"\n >\n <div class=\"form-row\">\n <input class=\"form-field-input\" [value]=\"apiCallURL\"/>\n <div class=\"icon-copy copy\" (click)=\"copyToClipboard(apiCallURL)\"></div>\n </div>\n <lib-json-view *ngIf=\"formData\" [(data)]=\"apiData\" [readOnly]=\"true\" [showCopy]=\"true\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>", styles: [".edge-router-form-container{display:flex;flex-direction:column;height:100%;width:100%;align-items:center;gap:.9375rem}.form-field-dropdown{background-image:url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22utf-8%22%3F%3E%3C!-- Generator%3A Adobe Illustrator 23.0.3%2C SVG Export Plug-In . SVG Version%3A 6.00 Build 0) --%3E%3Csvg id%3D'Stroke_Color' style%3D'enable-background%3Anew 0 0 20.2 10.8%3B' version%3D'1.1' viewBox%3D'0 0 20.2 10.8' x%3D'0px' xml%3Aspace%3D'preserve' xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' y%3D'0px'%3E%3Cstyle type%3D'text%2Fcss'%3E%09.st0 %7B fill%3A %23668291%3B %7D%3C%2Fstyle%3E %3Cg%3E%09%3Cpath class%3D'st0' d%3D'M19.8%2C1.7c0%2C0.4-0.1%2C0.7-0.4%2C0.9l-8.5%2C7.3c-0.5%2C0.4-1.2%2C0.4-1.6%2C0L0.7%2C2.7C0.2%2C2.2%2C0.2%2C1.5%2C0.6%2C0.9%09%09c0.5-0.5%2C1.2-0.6%2C1.8-0.1l7.7%2C6.6l7.7-6.6c0.5-0.5%2C1.3-0.4%2C1.8%2C0.1C19.7%2C1.2%2C19.8%2C1.5%2C19.8%2C1.7z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E\");background-position:center right .625rem;background-repeat:no-repeat;background-size:1.125rem;padding-right:1.75rem}.disabled{opacity:.5;pointer-events:none}.config-item{max-height:var(--defaultInputHeight);margin-top:1.15rem}::ng-deep .admin-toggle{width:100%;width:35%;display:flex}::ng-deep .admin-toggle .form-field-line{display:none}::ng-deep .admin-toggle .toggle{width:100%}::ng-deep .is-admin-container .form-field-title-container.title-container-2{width:35%!important}.svc-test-result{position:absolute;transition:var(--transition);height:0;width:100%;background-color:var(--background);bottom:0;font-weight:600;padding-left:.625rem;padding-right:.625rem;border-color:var(--inputBorder);border-style:solid;border-width:var(--inputBorderWidth);border-bottom-right-radius:var(--inputBorderRadius);border-bottom-left-radius:var(--inputBorderRadius);border-top-style:none}.svc-test-result.test-result-open{height:-moz-fit-content;height:fit-content;box-shadow:0 -.125rem .6875rem 0 var(--boxShadow);padding-bottom:.9375rem;padding-top:.9375rem}.svc-test-result .close.icon-close{top:.625rem;right:.625rem;font-size:1.125rem;height:1.125rem;width:1.125rem;line-height:1.125rem}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-label{color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-line{border-color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle{border-color:var(--primaryColor);border-style:solid;border-width:var(--inputBorderWidth)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle .switch{top:.0625rem}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.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: i5.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: FormHeaderComponent, selector: "lib-form-header", inputs: ["data", "badges", "title", "moreActions", "formView", "saveDisabled", "saveTooltip", "actionButtonText", "moreActionsText", "showHeaderToggle", "showHeaderButton"], outputs: ["formViewChange", "actionRequested"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }, { kind: "component", type: LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }, { kind: "component", type: FormFieldToggleComponent, selector: "lib-form-field-toggle", inputs: ["label", "orientation", "labelOn", "labelOff", "toggleOn"], outputs: ["toggleOnChange"] }, { kind: "component", type: JsonViewComponent, selector: "lib-json-view", inputs: ["data", "schema", "readOnly", "jsonInvalid", "showCopy", "showLineNumbers"], outputs: ["dataChange", "jsonChange", "jsonInvalidChange"] }, { kind: "component", type: QrCodeComponent, selector: "lib-qr-code", inputs: ["jwt", "token", "expiration", "identity", "type", "authenticators", "qrOnly", "canExpand"], outputs: ["doRefresh"] }, { kind: "component", type: CustomTagsComponent, selector: "lib-custom-tags", inputs: ["tags"], outputs: ["tagsChange"] }] }); }
|
|
17602
|
+
], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"formData.id ? 'Edit Transit Router: ' : 'Create New Transit Router'\"\n [moreActions]=\"moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n ></lib-form-header>\n <div class=\"edge-router-form-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" *ngIf=\"formView === 'simple'\">\n <div class=\"form-group-column three-fifths\">\n <lib-form-field-container [title]=\"'Edge Router Name'\" [label]=\"'REQUIRED'\">\n <input\n class=\"form-field-input\"\n placeholder=\"Name this edge router\"\n [ngClass]=\"{error: errors['name']}\"\n [(ngModel)]=\"formData.name\"\n autofocus\n #nameFieldInput\n />\n </lib-form-field-container>\n <lib-form-field-container\n [showHeader]=\"false\"\n [layout]=\"'row'\"\n >\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Cost</span>\n </div>\n <input\n type=\"number\"\n class=\"form-field-input\"\n placeholder=\"Name this edge router\"\n [ngClass]=\"{error: errors['cost']}\"\n [(ngModel)]=\"formData.cost\"\n />\n </div>\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"config-container-label\">ENABLED</div>\n <div\n (click)=\"toggleDisabled()\"\n [ngClass]=\"{ on: !formData.disabled }\"\n class=\"toggle\"\n >\n <span [hidden]=\"formData.disabled\" class=\"on-label\">YES</span>\n <span [hidden]=\"!formData.disabled\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"config-container-label\">ALLOW TRAVERSAL</div>\n <div\n (click)=\"toggleNoTraversal()\"\n [ngClass]=\"{ on: !formData.noTraversal }\"\n class=\"toggle\"\n >\n <span [hidden]=\"formData.noTraversal\" class=\"on-label\">YES</span>\n <span [hidden]=\"!formData.noTraversal\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n <ng-content select=\"[slot=column-1-slot-1]\"></ng-content>\n <lib-form-field-toggle [(toggleOn)]=\"showMore\" style=\"margin: 0px 10px\"></lib-form-field-toggle>\n <div *ngIf=\"showMore\" class=\"form-group-column\">\n <lib-form-field-container\n [title]=\"'Custom Tags'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n >\n <lib-custom-tags [(tags)]=\"formData.tags\"></lib-custom-tags>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column two-fifths\">\n <ng-content select=\"[slot=column-2-slot-1]\"></ng-content>\n <lib-form-field-container\n *ngIf=\"hasEnrolmentToken && !extService['hideZitiRegistration']\"\n [showHeader]=\"false\"\n >\n <lib-qr-code\n [identity]=\"formData\"\n [jwt]=\"formData.enrollmentJwt\"\n [token]=\"formData.enrollmentToken\"\n [expiration]=\"formData.enrollmentExpiresAt\"\n (doRefresh)=\"refreshEdgeRouter()\"\n [type]=\"'router'\"\n ></lib-qr-code>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'API Calls'\"\n [label]=\"'OPTIONAL'\"\n >\n <div class=\"form-row\">\n <input class=\"form-field-input\" [value]=\"apiCallURL\"/>\n <div class=\"icon-copy copy\" (click)=\"copyToClipboard(apiCallURL)\"></div>\n </div>\n <lib-json-view *ngIf=\"formData\" [(data)]=\"apiData\" [readOnly]=\"true\" [showCopy]=\"true\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>", styles: [".edge-router-form-container{display:flex;flex-direction:column;height:100%;width:100%;align-items:center;gap:.9375rem}.form-field-dropdown{background-image:url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22utf-8%22%3F%3E%3C!-- Generator%3A Adobe Illustrator 23.0.3%2C SVG Export Plug-In . SVG Version%3A 6.00 Build 0) --%3E%3Csvg id%3D'Stroke_Color' style%3D'enable-background%3Anew 0 0 20.2 10.8%3B' version%3D'1.1' viewBox%3D'0 0 20.2 10.8' x%3D'0px' xml%3Aspace%3D'preserve' xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' y%3D'0px'%3E%3Cstyle type%3D'text%2Fcss'%3E%09.st0 %7B fill%3A %23668291%3B %7D%3C%2Fstyle%3E %3Cg%3E%09%3Cpath class%3D'st0' d%3D'M19.8%2C1.7c0%2C0.4-0.1%2C0.7-0.4%2C0.9l-8.5%2C7.3c-0.5%2C0.4-1.2%2C0.4-1.6%2C0L0.7%2C2.7C0.2%2C2.2%2C0.2%2C1.5%2C0.6%2C0.9%09%09c0.5-0.5%2C1.2-0.6%2C1.8-0.1l7.7%2C6.6l7.7-6.6c0.5-0.5%2C1.3-0.4%2C1.8%2C0.1C19.7%2C1.2%2C19.8%2C1.5%2C19.8%2C1.7z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E\");background-position:center right .625rem;background-repeat:no-repeat;background-size:1.125rem;padding-right:1.75rem}.disabled{opacity:.5;pointer-events:none}.config-item{max-height:var(--defaultInputHeight);margin-top:1.15rem}::ng-deep .admin-toggle{width:100%;width:35%;display:flex}::ng-deep .admin-toggle .form-field-line{display:none}::ng-deep .admin-toggle .toggle{width:100%}::ng-deep .is-admin-container .form-field-title-container.title-container-2{width:35%!important}.svc-test-result{position:absolute;transition:var(--transition);height:0;width:100%;background-color:var(--background);bottom:0;font-weight:600;padding-left:.625rem;padding-right:.625rem;border-color:var(--inputBorder);border-style:solid;border-width:var(--inputBorderWidth);border-bottom-right-radius:var(--inputBorderRadius);border-bottom-left-radius:var(--inputBorderRadius);border-top-style:none}.svc-test-result.test-result-open{height:-moz-fit-content;height:fit-content;box-shadow:0 -.125rem .6875rem 0 var(--boxShadow);padding-bottom:.9375rem;padding-top:.9375rem}.svc-test-result .close.icon-close{top:.625rem;right:.625rem;font-size:1.125rem;height:1.125rem;width:1.125rem;line-height:1.125rem}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-label{color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-line{border-color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle{border-color:var(--primaryColor);border-style:solid;border-width:var(--inputBorderWidth)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle .switch{top:.0625rem}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.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: i5.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: FormHeaderComponent, selector: "lib-form-header", inputs: ["data", "badges", "title", "moreActions", "formView", "saveDisabled", "saveTooltip", "actionButtonText", "moreActionsText", "showHeaderToggle", "showHeaderButton", "multiActions"], outputs: ["formViewChange", "actionRequested", "multiActionRequested"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }, { kind: "component", type: LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }, { kind: "component", type: FormFieldToggleComponent, selector: "lib-form-field-toggle", inputs: ["label", "orientation", "labelOn", "labelOff", "toggleOn"], outputs: ["toggleOnChange"] }, { kind: "component", type: JsonViewComponent, selector: "lib-json-view", inputs: ["data", "schema", "readOnly", "jsonInvalid", "showCopy", "showLineNumbers"], outputs: ["dataChange", "jsonChange", "jsonInvalidChange"] }, { kind: "component", type: QrCodeComponent, selector: "lib-qr-code", inputs: ["jwt", "token", "expiration", "identity", "type", "authenticators", "qrOnly", "canExpand"], outputs: ["doRefresh"] }, { kind: "component", type: CustomTagsComponent, selector: "lib-custom-tags", inputs: ["tags"], outputs: ["tagsChange"] }] }); }
|
|
17321
17603
|
}
|
|
17322
17604
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TransitRouterFormComponent, decorators: [{
|
|
17323
17605
|
type: Component,
|
|
@@ -17671,6 +17953,40 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
17671
17953
|
args: [JsonEditorComponent, { static: false }]
|
|
17672
17954
|
}] } });
|
|
17673
17955
|
|
|
17956
|
+
const URLS = {
|
|
17957
|
+
ZITI_ATTRIBUTES: '/attributes',
|
|
17958
|
+
ZITI_DASHBOARD: '/dashboard',
|
|
17959
|
+
ZITI_IDENTITIES: '/identities',
|
|
17960
|
+
ZITI_JWT_SIGNERS: '/jwt-signers',
|
|
17961
|
+
ZITI_SERVICES: '/services',
|
|
17962
|
+
ZITI_SERVICE_SELECT: '/services/select',
|
|
17963
|
+
ZITI_SIMPLE_SERVICE: 'services/simple',
|
|
17964
|
+
ZITI_ADVANCED_SERVICE: 'services/advanced',
|
|
17965
|
+
ZITI_ROUTERS: '/routers',
|
|
17966
|
+
ZITI_TRANSIT_ROUTERS: '/transit-routers',
|
|
17967
|
+
ZITI_CONFIGS: '/configs',
|
|
17968
|
+
ZITI_CONFIG_TYPES: '/config-types',
|
|
17969
|
+
ZITI_RECIPES: '/recipes',
|
|
17970
|
+
ZITI_TERMINATORS: '/terminators',
|
|
17971
|
+
ZITI_AUTH_POLICIES: '/auth-policies',
|
|
17972
|
+
ZITI_SERVICE_POLICIES: '/service-policies',
|
|
17973
|
+
ZITI_ROUTER_POLICIES: '/router-policies',
|
|
17974
|
+
ZITI_SERVICE_ROUTER_POLICIES: '/service-router-policies',
|
|
17975
|
+
ZITI_POSTURE_CHECKS: '/posture-checks',
|
|
17976
|
+
ZITI_BROWZER_CAS: '/browzer-cert-auth',
|
|
17977
|
+
ZITI_CERT_AUTHORITIES: '/certificate-authorities',
|
|
17978
|
+
ZITI_SESSIONS: '/sessions',
|
|
17979
|
+
ZITI_API_SESSIONS: '/api-sessions',
|
|
17980
|
+
ZITI_LOGIN: '/login',
|
|
17981
|
+
ZITI_ORGANIZATION: '/organization',
|
|
17982
|
+
ZITI_PROFILE: '/profile',
|
|
17983
|
+
ZITI_SERVERS: '/servers',
|
|
17984
|
+
ZITI_SETTINGS: '/settings',
|
|
17985
|
+
ZITI_CUSTOM_FIELDS: '/custom-fields',
|
|
17986
|
+
ZAC_LOGIN: '/login',
|
|
17987
|
+
NETWORK_VISUALIZER: '/network-visualizer',
|
|
17988
|
+
};
|
|
17989
|
+
|
|
17674
17990
|
/*
|
|
17675
17991
|
Copyright NetFoundry Inc.
|
|
17676
17992
|
|
|
@@ -17692,6 +18008,17 @@ class ServiceFormComponent extends ProjectableForm {
|
|
|
17692
18008
|
data.configs = [];
|
|
17693
18009
|
}
|
|
17694
18010
|
this.svc.formData = data;
|
|
18011
|
+
if (!isEmpty(data?.id)) {
|
|
18012
|
+
if (get(data, 'tags["service-type"]') === 'simple') {
|
|
18013
|
+
this.router.navigate([URLS.ZITI_SIMPLE_SERVICE + '/' + data?.id]);
|
|
18014
|
+
}
|
|
18015
|
+
else {
|
|
18016
|
+
this.dataInit = true;
|
|
18017
|
+
}
|
|
18018
|
+
}
|
|
18019
|
+
else if (this.entityId === 'create') {
|
|
18020
|
+
this.dataInit = true;
|
|
18021
|
+
}
|
|
17695
18022
|
}
|
|
17696
18023
|
get formData() {
|
|
17697
18024
|
return this.svc?.formData;
|
|
@@ -17705,6 +18032,7 @@ class ServiceFormComponent extends ProjectableForm {
|
|
|
17705
18032
|
this.route = route;
|
|
17706
18033
|
this.serviceRoleAttributes = [];
|
|
17707
18034
|
this.close = new EventEmitter();
|
|
18035
|
+
this.dataInit = false;
|
|
17708
18036
|
this.isEditing = false;
|
|
17709
18037
|
this.strategies = [
|
|
17710
18038
|
{ id: 'smartrouting', label: 'Smart Routing' },
|
|
@@ -17929,7 +18257,7 @@ class ServiceFormComponent extends ProjectableForm {
|
|
|
17929
18257
|
provide: MatDialogRef,
|
|
17930
18258
|
useValue: {}
|
|
17931
18259
|
}
|
|
17932
|
-
], viewQueries: [{ propertyName: "configEditor", first: true, predicate: ["configEditor"], descendants: true, read: ConfigEditorComponent }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"returnToListPage()\"\n tabindex=\"0\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"(formData.id ? 'Edit Service' : 'Create Service')\"\n [moreActions]=\"moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n [saveDisabled]=\"svc.saveDisabled || formDataInvalid\"\n [saveTooltip]=\"saveButtonTooltip\"\n ></lib-form-header>\n <div class=\"edge-router-form-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" [hidden]=\"formView !== 'simple'\">\n <div class=\"form-group-column three-fifths\">\n <lib-form-field-container [title]=\"'Service Name'\" [label]=\"'Required'\">\n <input\n class=\"form-field-input\"\n placeholder=\"Name this Service\"\n [ngClass]=\"{error: svc.errors['name']}\"\n [(ngModel)]=\"formData.name\"\n autofocus\n #nameFieldInput\n />\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Select or create Service attributes'\"\n [label]=\"'Optional'\"\n [contentStyle]=\"'z-index: 99999999'\"\n [helpText]=\"'Attributes are tags applied to a resource. Apply the same tag to other Services to form a group of Services.'\"\n >\n <lib-tag-selector\n [(selectedRoleAttributes)]=\"formData.roleAttributes\"\n [availableRoleAttributes]=\"serviceRoleAttributes\"\n [placeholder]=\"'Add attributes to group Services'\"\n ></lib-tag-selector>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Add Configurations'\"\n (actionRequested)=\"attachConfig()\"\n (keyup.enter)=\"captureConfigEnterEvent($event)\"\n [helpText]=\"'Configurations are used to define how to intercept and host a service. Ziti Networks come with built-in configuration types (ie. intercept.v1 and host.v1)'\"\n >\n <div class=\"form-field-input-group\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">Select a Config</span>\n </div>\n <select\n [(ngModel)]=\"svc.selectedConfigTypeId\"\n (change)=\"configTypeChanged($event)\"\n id=\"SelectedConfigType\"\n class=\"form-field-dropdown\"\n >\n <option value=\"\">Select configuration type...</option>\n <option\n *ngFor=\"let type of svc.configTypes\"\n [value]=\"type.id\"\n >\n {{ type.name }}\n </option>\n </select>\n <div class=\"dropdown-container\" [ngClass]=\"{'dropdown-loading': svc.configsLoading}\">\n <p-dropdown\n placeholder=\"Select configuration...\"\n optionLabel=\"name\"\n optionValue=\"id\"\n filterBy=\"name\"\n [options]=\"svc.filteredConfigs\"\n [filter]=\"true\"\n [showClear]=\"true\"\n [disabled]=\"!svc.selectedConfigTypeId || svc.selectedConfigTypeId === ''\"\n (onChange)=\"configChanged($event)\"\n [(ngModel)]=\"svc.selectedConfigId\"\n >\n <ng-template pTemplate=\"filter\" let-options=\"options\">\n <div class=\"dropdown-filter-container\">\n <div class=\"p-inputgroup\" (click)=\"$event.stopPropagation()\">\n <span class=\"p-inputgroup-addon\"><i class=\"pi pi-search\"></i></span>\n <input\n type=\"text\"\n pInputText\n placeholder=\"Filter\"\n (keyup)=\"configFilterChangedDebounced($event)\" />\n </div>\n <button pButton\n icon=\"pi pi-times\"\n [ngClass]=\"{'configs-loading': svc.configsLoading}\"\n (click)=\"clearConfigFilter($event)\"\n severity=\"secondary\">\n </button>\n <div class=\"spinner\" *ngIf=\"svc.configsLoading\"></div>\n </div>\n </ng-template>\n </p-dropdown>\n </div>\n <div *ngIf=\"!showConfigData && svc.selectedConfigId && svc.selectedConfigId !== '' && svc.selectedConfigId !== 'preview'\" class=\"button-row-right\" >\n <div class=\"save-button\" (click)=\"svc.attachConfig(svc.selectedConfigId)\">\n {{svc.attachLabel}}\n </div>\n </div>\n <div [hidden]=\"!showConfigData\" class=\"form-field-extended-fields\" [ngClass]=\"{'cfg-preview': svc.selectedConfigId === 'preview'}\">\n <div *ngIf=\"showConfigData\" class=\"config-title-row\" style=\"margin-bottom: 10px;\">\n <span class=\"form-field-title\">Config Name</span>\n <div\n class=\"save-button\"\n (click)=\"attachConfig()\"\n *ngIf=\"svc.selectedConfigId !== 'preview'\"\n >{{svc.attachLabel}}\n </div>\n </div>\n <input\n *ngIf=\"showConfigData\"\n [(ngModel)]=\"svc.newConfigName\"\n class=\"form-field-input\"\n [placeholder]=\"'New Config Name'\"\n [ngClass]=\"{error: svc.configErrors['name']}\"\n style=\"margin-bottom: 20px;\"\n />\n <div class=\"config-title-row\" style=\"margin-bottom: 10px;\">\n <span class=\"form-field-title\">Configuration Data</span>\n <div class=\"form-header-toggle-container\" *ngIf=\"svc.selectedConfigId !== 'preview'\">\n <span\n class=\"toggle-option-text\"\n [ngClass]=\"{'toggle-option-selected': !svc.configJsonView}\"\n (click)=\"svc.toggleJSONView()\"\n >\n FORM\n </span>\n <div class=\"form-header-toggle\" (click)=\"svc.toggleJSONView()\">\n <div\n class=\"form-toggle-switch\"\n [ngClass]=\"{'toggle-left': !svc.configJsonView, 'toggle-right': svc.configJsonView}\"\n >\n <div class=\"form-toggle-indicator\"></div>\n <div class=\"form-toggle-indicator\"></div>\n </div>\n </div>\n <span\n class=\"toggle-option-text\"\n [ngClass]=\"{'toggle-option-selected': svc.configJsonView}\"\n (click)=\"svc.toggleJSONView()\"\n >\n JSON\n </span>\n </div>\n </div>\n <lib-config-editor\n [(configData)]=\"svc.configData\"\n [schema]=\"svc.selectedSchema\"\n [showJsonView]=\"svc.configJsonView\"\n [(configErrors)]=\"svc.configErrors\"\n #configEditor\n ></lib-config-editor>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-toggle [(toggleOn)]=\"showMore\" style=\"margin: 0px 10px\"></lib-form-field-toggle>\n <div *ngIf=\"showMore\" class=\"form-group-column\">\n <lib-form-field-container\n [title]=\"'Terminator Strategy'\"\n [title2]=\"'Encryption'\"\n [layout]=\"'row'\"\n [helpText]=\"'Pick a strategy to determine how to rank available terminators for a service'\"\n [helpText2]=\"'Encrypts packets when entering or leaving the network.'\"\n class=\"form-field-advanced\"\n >\n <select\n [(ngModel)]=\"formData.terminatorStrategy\"\n id=\"authPolicyId\"\n class=\"form-field-dropdown\"\n >\n <option value=\"\">Select a Strategy....</option>\n <option\n *ngFor=\"let strat of strategies\"\n [value]=\"strat.id\"\n >\n {{ strat.label }}\n </option>\n </select>\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"config-container-label\">Require Encryption</div>\n <div\n (click)=\"toggleEncryptionRequired()\"\n [ngClass]=\"{ on: formData.encryptionRequired }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.encryptionRequired\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.encryptionRequired\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Custom Tags'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n >\n <lib-custom-tags [(tags)]=\"formData.tags\"></lib-custom-tags>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column two-fifths\">\n <lib-form-field-container\n [title]=\"'Associated Entities'\"\n [label]=\"'Click for detailed view'\"\n [helpText]=\"'List the configs, policies, and terminators that are associated with this service. Click on the entity name to navigate to the entity\\'s detailed view.'\"\n [class]=\"'no-gap'\"\n >\n <div class=\"form-row space-between\" style=\"margin-top: 0;\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">Configurations</span>\n </div>\n <span class=\"form-field-count\">{{svc.addedConfigs ? svc.addedConfigs.length : 0}}</span>\n </div>\n <lib-preview-list\n [isLoading]=\"svc.associatedConfigsLoading\"\n [allNames]=\"svc.addedConfigs\"\n [allowRemove]=\"true\"\n [clickable]=\"true\"\n [showfilter]=\"false\"\n [tooltip]=\"'View Config'\"\n (itemRemoved)=\"svc.removeConfig($event)\"\n (itemSelected)=\"svc.previewConfig($event, router)\"\n ></lib-preview-list>\n <div class=\"form-row space-between\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">Service Policies</span>\n </div>\n <span class=\"form-field-count\">{{svc.associatedServicePoliciesTotal}}</span>\n </div>\n <lib-preview-list\n [isLoading]=\"svc.associatedServicePoliciesLoading\"\n [clickable]=\"true\"\n (itemSelected)=\"svc.previewPolicy($event, router)\"\n [tooltip]=\"'View Service Policy'\"\n [allNames]=\"svc.associatedServicePolicies\"\n [showfilter]=\"false\"\n ></lib-preview-list>\n <div class=\"form-row space-between\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">Terminators</span>\n </div>\n <span class=\"form-field-count\">{{svc.associatedTerminators ? svc.associatedTerminators.length : 0}}</span>\n </div>\n <lib-preview-list\n [isLoading]=\"svc.associatedTerminatorsLoading\"\n [clickable]=\"true\"\n (itemSelected)=\"svc.previewTerminator($event, router)\"\n [tooltip]=\"'View Terminator'\"\n [allNames]=\"svc.associatedTerminators\"\n [showfilter]=\"false\"\n ></lib-preview-list>\n </lib-form-field-container>\n<!-- <lib-form-field-container\n *ngIf=\"formData.id\"\n [title]=\"'Associated Service Policies'\"\n [count]=\"svc.associatedServicePolicies.length\"\n [helpText]=\"'Preview list of all service policies that this service is associated with.'\"\n >\n </lib-form-field-container>-->\n <lib-form-field-container\n [title]=\"'API Calls'\"\n [label]=\"''\"\n [class]=\"'api-call-container'\"\n [helpText]=\"'Preview of the API URL and data model that is used to create/update this service'\"\n >\n <div class=\"form-row\">\n <input class=\"form-field-input\" [value]=\"apiCallURL\" readonly/>\n <div class=\"url-copy icon-copy copy\" (click)=\"copyToClipboard(apiCallURL)\"></div>\n </div>\n <lib-json-view *ngIf=\"formData\" [(data)]=\"svc.apiData\" [readOnly]=\"true\" [showCopy]=\"true\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\" [(jsonInvalid)]=\"formDataInvalid\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>", styles: [".edge-router-form-container{display:flex;flex-direction:column;height:100%;width:100%;align-items:center;gap:.9375rem}.form-field-dropdown{background-image:url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22utf-8%22%3F%3E%3C!-- Generator%3A Adobe Illustrator 23.0.3%2C SVG Export Plug-In . SVG Version%3A 6.00 Build 0) --%3E%3Csvg id%3D'Stroke_Color' style%3D'enable-background%3Anew 0 0 20.2 10.8%3B' version%3D'1.1' viewBox%3D'0 0 20.2 10.8' x%3D'0px' xml%3Aspace%3D'preserve' xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' y%3D'0px'%3E%3Cstyle type%3D'text%2Fcss'%3E%09.st0 %7B fill%3A %23668291%3B %7D%3C%2Fstyle%3E %3Cg%3E%09%3Cpath class%3D'st0' d%3D'M19.8%2C1.7c0%2C0.4-0.1%2C0.7-0.4%2C0.9l-8.5%2C7.3c-0.5%2C0.4-1.2%2C0.4-1.6%2C0L0.7%2C2.7C0.2%2C2.2%2C0.2%2C1.5%2C0.6%2C0.9%09%09c0.5-0.5%2C1.2-0.6%2C1.8-0.1l7.7%2C6.6l7.7-6.6c0.5-0.5%2C1.3-0.4%2C1.8%2C0.1C19.7%2C1.2%2C19.8%2C1.5%2C19.8%2C1.7z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E\");background-position:center right .625rem;background-repeat:no-repeat;background-size:1.125rem;padding-right:1.75rem}.form-field-extended-fields{position:relative;display:flex;flex-direction:column}.form-field-extended-fields.cfg-preview{opacity:.8;filter:grayscale(.4);pointer-events:none}.form-header-toggle-container{display:flex;flex-direction:row;align-items:center}.form-header-toggle-container .form-header-toggle{display:flex;flex-direction:row;width:1.875rem;height:1.125rem;border-radius:.625rem;border-color:var(--inputBorder);border-style:solid;border-width:var(--inputBorderWidth);margin-left:.3125rem;cursor:pointer;position:relative;margin-right:.3125rem}.form-header-toggle-container .form-header-toggle:hover{filter:brightness(90%)}.form-header-toggle-container .form-header-toggle:active{transform:translateY(.0625rem);filter:brightness(80%)}.form-header-toggle-container .form-header-toggle .form-toggle-switch{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;height:100%;margin-left:.1875rem;position:absolute;transition:.5s;left:0}.form-header-toggle-container .form-header-toggle .form-toggle-switch.toggle-right{left:.625rem}.form-header-toggle-container .form-header-toggle .form-toggle-switch.toggle-right .form-toggle-indicator{border-color:var(--red)}.form-header-toggle-container .form-header-toggle .form-toggle-switch .form-toggle-indicator{height:.625rem;border-color:var(--green);border-style:solid;border-left-width:.0625rem;border-right-width:.0625rem;position:relative;margin-left:.125rem}.form-header-toggle-container .toggle-option-text{font-size:.8125rem;font-weight:600;color:var(--placeholder);cursor:pointer}.form-header-toggle-container .toggle-option-text:hover{filter:brightness(90%)}.form-header-toggle-container .toggle-option-text:hover.toggle-option-selected{filter:unset}.form-header-toggle-container .toggle-option-text.toggle-option-selected{color:var(--tableText);cursor:default}.jsonButton{position:relative;top:0;margin:0;padding:.625rem;height:1.875rem}.disabled{opacity:.5;pointer-events:none}.attach-config{display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.875rem;background:var(--primary);padding:.4375rem;border-radius:var(--inputBorderRadius);color:var(--white);cursor:pointer;box-shadow:0 .1875rem .5625rem 0 var(--primaryColorOpaque);border:none;width:-moz-fit-content;width:fit-content}.attach-config:active{background:#648293;box-shadow:none;transform:translateY(.0625rem)}.attach-config:hover{outline:0;filter:brightness(90%);box-shadow:0 .125rem .1875rem 0 var(--primaryColorOpaque)}::ng-deep .admin-toggle{width:100%;width:35%;display:flex}::ng-deep .admin-toggle .form-field-line{display:none}::ng-deep .admin-toggle .toggle{width:100%}::ng-deep .is-admin-container .form-field-title-container.title-container-2{width:35%!important}.svc-test-result{position:absolute;transition:var(--transition);height:0;width:100%;background-color:var(--background);bottom:0;font-weight:600;padding-left:.625rem;padding-right:.625rem;border-color:var(--inputBorder);border-style:solid;border-width:var(--inputBorderWidth);border-bottom-right-radius:var(--inputBorderRadius);border-bottom-left-radius:var(--inputBorderRadius);border-top-style:none}.svc-test-result.test-result-open{height:-moz-fit-content;height:fit-content;box-shadow:0 -.125rem .6875rem 0 var(--boxShadow);padding-bottom:.9375rem;padding-top:.9375rem}.svc-test-result .close.icon-close{top:.625rem;right:.625rem;font-size:1.125rem;height:1.125rem;width:1.125rem;line-height:1.125rem}.dropdown-container{display:flex;flex-direction:column;position:relative}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-label{color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-line{border-color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle{border-color:var(--primaryColor);border-style:solid;border-width:var(--inputBorderWidth)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle .switch{top:.0625rem}::ng-deep .form-field-extended-fields .form-field-extended-fields{padding:0}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.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: i5.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i6$1.InputText, selector: "[pInputText]" }, { kind: "directive", type: i9.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i8.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "component", type: i4$2.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: FormHeaderComponent, selector: "lib-form-header", inputs: ["data", "badges", "title", "moreActions", "formView", "saveDisabled", "saveTooltip", "actionButtonText", "moreActionsText", "showHeaderToggle", "showHeaderButton"], outputs: ["formViewChange", "actionRequested"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }, { kind: "component", type: PreviewListComponent, selector: "lib-preview-list", inputs: ["label", "clickable", "isLoading", "allNames", "items", "allowRemove", "tooltip", "showfilter"], outputs: ["itemSelected", "itemRemoved"] }, { kind: "component", type: LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }, { kind: "component", type: FormFieldToggleComponent, selector: "lib-form-field-toggle", inputs: ["label", "orientation", "labelOn", "labelOff", "toggleOn"], outputs: ["toggleOnChange"] }, { kind: "component", type: JsonViewComponent, selector: "lib-json-view", inputs: ["data", "schema", "readOnly", "jsonInvalid", "showCopy", "showLineNumbers"], outputs: ["dataChange", "jsonChange", "jsonInvalidChange"] }, { kind: "component", type: TagSelectorComponent, selector: "lib-tag-selector", inputs: ["placeholder", "disableField", "disableCreate", "hideOption", "isLoading", "errorMessage", "focusOnInit", "selectedRoleAttributes", "selectedNamedAttributes", "hasError", "availableRoleAttributes", "availableNamedAttributes"], outputs: ["addRoleAttribute", "addNamedAttribute", "roleAttributeRemoved", "namedAttributeRemoved", "selectedRoleAttributesChange", "selectedNamedAttributesChange", "filterChange"] }, { kind: "component", type: CustomTagsComponent, selector: "lib-custom-tags", inputs: ["tags"], outputs: ["tagsChange"] }, { kind: "component", type: ConfigEditorComponent, selector: "lib-config-editor", inputs: ["configErrors", "configData", "showJsonView", "schema"], outputs: ["configErrorsChange", "configDataChange"] }] }); }
|
|
18260
|
+
], viewQueries: [{ propertyName: "configEditor", first: true, predicate: ["configEditor"], descendants: true, read: ConfigEditorComponent }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"returnToListPage()\"\n tabindex=\"0\"\n *ngIf=\"dataInit\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"(formData.id ? 'Edit Service' : 'Create Service')\"\n [moreActions]=\"moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n [saveDisabled]=\"svc.saveDisabled || formDataInvalid\"\n [saveTooltip]=\"saveButtonTooltip\"\n ></lib-form-header>\n <div class=\"edge-router-form-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" [hidden]=\"formView !== 'simple'\">\n <div class=\"form-group-column three-fifths\">\n <lib-form-field-container [title]=\"'Service Name'\" [label]=\"'Required'\">\n <input\n class=\"form-field-input\"\n placeholder=\"Name this Service\"\n [ngClass]=\"{error: svc.errors['name']}\"\n [(ngModel)]=\"formData.name\"\n autofocus\n #nameFieldInput\n />\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Select or create Service attributes'\"\n [label]=\"'Optional'\"\n [contentStyle]=\"'z-index: 99999999'\"\n [helpText]=\"'Attributes are tags applied to a resource. Apply the same tag to other Services to form a group of Services.'\"\n >\n <lib-tag-selector\n [(selectedRoleAttributes)]=\"formData.roleAttributes\"\n [availableRoleAttributes]=\"serviceRoleAttributes\"\n [placeholder]=\"'Add attributes to group Services'\"\n ></lib-tag-selector>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Add Configurations'\"\n (actionRequested)=\"attachConfig()\"\n (keyup.enter)=\"captureConfigEnterEvent($event)\"\n [helpText]=\"'Configurations are used to define how to intercept and host a service. Ziti Networks come with built-in configuration types (ie. intercept.v1 and host.v1)'\"\n >\n <div class=\"form-field-input-group\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">Select a Config</span>\n </div>\n <select\n [(ngModel)]=\"svc.selectedConfigTypeId\"\n (change)=\"configTypeChanged($event)\"\n id=\"SelectedConfigType\"\n class=\"form-field-dropdown\"\n >\n <option value=\"\">Select configuration type...</option>\n <option\n *ngFor=\"let type of svc.configTypes\"\n [value]=\"type.id\"\n >\n {{ type.name }}\n </option>\n </select>\n <div class=\"dropdown-container\" [ngClass]=\"{'dropdown-loading': svc.configsLoading}\">\n <p-dropdown\n placeholder=\"Select configuration...\"\n optionLabel=\"name\"\n optionValue=\"id\"\n filterBy=\"name\"\n [options]=\"svc.filteredConfigs\"\n [filter]=\"true\"\n [showClear]=\"true\"\n [disabled]=\"!svc.selectedConfigTypeId || svc.selectedConfigTypeId === ''\"\n (onChange)=\"configChanged($event)\"\n [(ngModel)]=\"svc.selectedConfigId\"\n >\n <ng-template pTemplate=\"filter\" let-options=\"options\">\n <div class=\"dropdown-filter-container\">\n <div class=\"p-inputgroup\" (click)=\"$event.stopPropagation()\">\n <span class=\"p-inputgroup-addon\"><i class=\"pi pi-search\"></i></span>\n <input\n type=\"text\"\n pInputText\n placeholder=\"Filter\"\n (keyup)=\"configFilterChangedDebounced($event)\" />\n </div>\n <button pButton\n icon=\"pi pi-times\"\n [ngClass]=\"{'configs-loading': svc.configsLoading}\"\n (click)=\"clearConfigFilter($event)\"\n severity=\"secondary\">\n </button>\n <div class=\"spinner\" *ngIf=\"svc.configsLoading\"></div>\n </div>\n </ng-template>\n </p-dropdown>\n </div>\n <div *ngIf=\"!showConfigData && svc.selectedConfigId && svc.selectedConfigId !== '' && svc.selectedConfigId !== 'preview'\" class=\"button-row-right\" >\n <div class=\"save-button\" (click)=\"svc.attachConfig(svc.selectedConfigId)\">\n {{svc.attachLabel}}\n </div>\n </div>\n <div [hidden]=\"!showConfigData\" class=\"form-field-extended-fields\" [ngClass]=\"{'cfg-preview': svc.selectedConfigId === 'preview'}\">\n <div *ngIf=\"showConfigData\" class=\"config-title-row\" style=\"margin-bottom: 10px;\">\n <span class=\"form-field-title\">Config Name</span>\n <div\n class=\"save-button\"\n (click)=\"attachConfig()\"\n *ngIf=\"svc.selectedConfigId !== 'preview'\"\n >{{svc.attachLabel}}\n </div>\n </div>\n <input\n *ngIf=\"showConfigData\"\n [(ngModel)]=\"svc.newConfigName\"\n class=\"form-field-input\"\n [placeholder]=\"'New Config Name'\"\n [ngClass]=\"{error: svc.configErrors['name']}\"\n style=\"margin-bottom: 20px;\"\n />\n <div class=\"config-title-row\" style=\"margin-bottom: 10px;\">\n <span class=\"form-field-title\">Configuration Data</span>\n <div class=\"form-header-toggle-container\" *ngIf=\"svc.selectedConfigId !== 'preview'\">\n <span\n class=\"toggle-option-text\"\n [ngClass]=\"{'toggle-option-selected': !svc.configJsonView}\"\n (click)=\"svc.toggleJSONView()\"\n >\n FORM\n </span>\n <div class=\"form-header-toggle\" (click)=\"svc.toggleJSONView()\">\n <div\n class=\"form-toggle-switch\"\n [ngClass]=\"{'toggle-left': !svc.configJsonView, 'toggle-right': svc.configJsonView}\"\n >\n <div class=\"form-toggle-indicator\"></div>\n <div class=\"form-toggle-indicator\"></div>\n </div>\n </div>\n <span\n class=\"toggle-option-text\"\n [ngClass]=\"{'toggle-option-selected': svc.configJsonView}\"\n (click)=\"svc.toggleJSONView()\"\n >\n JSON\n </span>\n </div>\n </div>\n <lib-config-editor\n [(configData)]=\"svc.configData\"\n [schema]=\"svc.selectedSchema\"\n [showJsonView]=\"svc.configJsonView\"\n [(configErrors)]=\"svc.configErrors\"\n #configEditor\n ></lib-config-editor>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-toggle [(toggleOn)]=\"showMore\" style=\"margin: 0px 10px\"></lib-form-field-toggle>\n <div *ngIf=\"showMore\" class=\"form-group-column\">\n <lib-form-field-container\n [title]=\"'Terminator Strategy'\"\n [title2]=\"'Encryption'\"\n [layout]=\"'row'\"\n [helpText]=\"'Pick a strategy to determine how to rank available terminators for a service'\"\n [helpText2]=\"'Encrypts packets when entering or leaving the network.'\"\n class=\"form-field-advanced\"\n >\n <select\n [(ngModel)]=\"formData.terminatorStrategy\"\n id=\"authPolicyId\"\n class=\"form-field-dropdown\"\n >\n <option value=\"\">Select a Strategy....</option>\n <option\n *ngFor=\"let strat of strategies\"\n [value]=\"strat.id\"\n >\n {{ strat.label }}\n </option>\n </select>\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"config-container-label\">Require Encryption</div>\n <div\n (click)=\"toggleEncryptionRequired()\"\n [ngClass]=\"{ on: formData.encryptionRequired }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.encryptionRequired\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.encryptionRequired\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Custom Tags'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n >\n <lib-custom-tags [(tags)]=\"formData.tags\"></lib-custom-tags>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column two-fifths\">\n <lib-form-field-container\n [title]=\"'Associated Entities'\"\n [label]=\"'click item to view details'\"\n [helpText]=\"'List the configs, policies, and terminators that are associated with this service. Click on the entity name to navigate to the entity\\'s detailed view.'\"\n [class]=\"'no-gap'\"\n >\n <div class=\"form-row space-between\" style=\"margin-top: 0;\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">Configurations</span>\n </div>\n <span class=\"form-field-count\">{{svc.addedConfigs ? svc.addedConfigs.length : 0}}</span>\n </div>\n <lib-preview-list\n [isLoading]=\"svc.associatedConfigsLoading\"\n [allNames]=\"svc.addedConfigs\"\n [allowRemove]=\"true\"\n [clickable]=\"true\"\n [tooltip]=\"'View Config'\"\n [showfilter]=\"false\"\n (itemRemoved)=\"svc.removeConfig($event)\"\n (itemSelected)=\"svc.previewConfig($event, router)\"\n ></lib-preview-list>\n <div class=\"form-row space-between\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">Service Policies</span>\n </div>\n <span class=\"form-field-count\">{{svc.associatedServicePoliciesTotal}}</span>\n </div>\n <lib-preview-list\n [isLoading]=\"svc.associatedServicePoliciesLoading\"\n [clickable]=\"true\"\n (itemSelected)=\"svc.previewPolicy($event, router)\"\n [tooltip]=\"'View Service Policy'\"\n [allNames]=\"svc.associatedServicePolicies\"\n [showfilter]=\"svc.showServicePoliciesFilter\"\n [localFilter]=\"false\"\n (filterChanged)=\"svc.getAssociatedServicePoliciesDebounced($event)\"\n ></lib-preview-list>\n <div class=\"form-row space-between\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">Terminators</span>\n </div>\n <span class=\"form-field-count\">{{svc.associatedTerminatorsTotal}}</span>\n </div>\n <lib-preview-list\n [isLoading]=\"svc.associatedTerminatorsLoading\"\n [clickable]=\"true\"\n (itemSelected)=\"svc.previewTerminator($event, router)\"\n [tooltip]=\"'View Terminator'\"\n [allNames]=\"svc.associatedTerminators\"\n [showfilter]=\"false\"\n [showfilter]=\"svc.showTerminatorsFilter\"\n [localFilter]=\"false\"\n (filterChanged)=\"svc.getAssociatedTerminatorsDebounced($event)\"\n ></lib-preview-list>\n </lib-form-field-container>\n<!-- <lib-form-field-container\n *ngIf=\"formData.id\"\n [title]=\"'Associated Service Policies'\"\n [count]=\"svc.associatedServicePolicies.length\"\n [helpText]=\"'Preview list of all service policies that this service is associated with.'\"\n >\n </lib-form-field-container>-->\n <lib-form-field-container\n [title]=\"'API Calls'\"\n [label]=\"''\"\n [class]=\"'api-call-container'\"\n [helpText]=\"'Preview of the API URL and data model that is used to create/update this service'\"\n >\n <div class=\"form-row\">\n <input class=\"form-field-input\" [value]=\"apiCallURL\" readonly/>\n <div class=\"url-copy icon-copy copy\" (click)=\"copyToClipboard(apiCallURL)\"></div>\n </div>\n <lib-json-view *ngIf=\"formData\" [(data)]=\"svc.apiData\" [readOnly]=\"true\" [showCopy]=\"true\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\" [(jsonInvalid)]=\"formDataInvalid\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>\n", styles: [".edge-router-form-container{display:flex;flex-direction:column;height:100%;width:100%;align-items:center;gap:.9375rem}.form-field-dropdown{background-image:url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22utf-8%22%3F%3E%3C!-- Generator%3A Adobe Illustrator 23.0.3%2C SVG Export Plug-In . SVG Version%3A 6.00 Build 0) --%3E%3Csvg id%3D'Stroke_Color' style%3D'enable-background%3Anew 0 0 20.2 10.8%3B' version%3D'1.1' viewBox%3D'0 0 20.2 10.8' x%3D'0px' xml%3Aspace%3D'preserve' xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' y%3D'0px'%3E%3Cstyle type%3D'text%2Fcss'%3E%09.st0 %7B fill%3A %23668291%3B %7D%3C%2Fstyle%3E %3Cg%3E%09%3Cpath class%3D'st0' d%3D'M19.8%2C1.7c0%2C0.4-0.1%2C0.7-0.4%2C0.9l-8.5%2C7.3c-0.5%2C0.4-1.2%2C0.4-1.6%2C0L0.7%2C2.7C0.2%2C2.2%2C0.2%2C1.5%2C0.6%2C0.9%09%09c0.5-0.5%2C1.2-0.6%2C1.8-0.1l7.7%2C6.6l7.7-6.6c0.5-0.5%2C1.3-0.4%2C1.8%2C0.1C19.7%2C1.2%2C19.8%2C1.5%2C19.8%2C1.7z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E\");background-position:center right .625rem;background-repeat:no-repeat;background-size:1.125rem;padding-right:1.75rem}.form-field-extended-fields{position:relative;display:flex;flex-direction:column}.form-field-extended-fields.cfg-preview{opacity:.8;filter:grayscale(.4);pointer-events:none}.form-header-toggle-container{display:flex;flex-direction:row;align-items:center}.form-header-toggle-container .form-header-toggle{display:flex;flex-direction:row;width:1.875rem;height:1.125rem;border-radius:.625rem;border-color:var(--inputBorder);border-style:solid;border-width:var(--inputBorderWidth);margin-left:.3125rem;cursor:pointer;position:relative;margin-right:.3125rem}.form-header-toggle-container .form-header-toggle:hover{filter:brightness(90%)}.form-header-toggle-container .form-header-toggle:active{transform:translateY(.0625rem);filter:brightness(80%)}.form-header-toggle-container .form-header-toggle .form-toggle-switch{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;height:100%;margin-left:.1875rem;position:absolute;transition:.5s;left:0}.form-header-toggle-container .form-header-toggle .form-toggle-switch.toggle-right{left:.625rem}.form-header-toggle-container .form-header-toggle .form-toggle-switch.toggle-right .form-toggle-indicator{border-color:var(--red)}.form-header-toggle-container .form-header-toggle .form-toggle-switch .form-toggle-indicator{height:.625rem;border-color:var(--green);border-style:solid;border-left-width:.0625rem;border-right-width:.0625rem;position:relative;margin-left:.125rem}.form-header-toggle-container .toggle-option-text{font-size:.8125rem;font-weight:600;color:var(--placeholder);cursor:pointer}.form-header-toggle-container .toggle-option-text:hover{filter:brightness(90%)}.form-header-toggle-container .toggle-option-text:hover.toggle-option-selected{filter:unset}.form-header-toggle-container .toggle-option-text.toggle-option-selected{color:var(--tableText);cursor:default}.jsonButton{position:relative;top:0;margin:0;padding:.625rem;height:1.875rem}.disabled{opacity:.5;pointer-events:none}.attach-config{display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.875rem;background:var(--primary);padding:.4375rem;border-radius:var(--inputBorderRadius);color:var(--white);cursor:pointer;box-shadow:0 .1875rem .5625rem 0 var(--primaryColorOpaque);border:none;width:-moz-fit-content;width:fit-content}.attach-config:active{background:#648293;box-shadow:none;transform:translateY(.0625rem)}.attach-config:hover{outline:0;filter:brightness(90%);box-shadow:0 .125rem .1875rem 0 var(--primaryColorOpaque)}::ng-deep .admin-toggle{width:100%;width:35%;display:flex}::ng-deep .admin-toggle .form-field-line{display:none}::ng-deep .admin-toggle .toggle{width:100%}::ng-deep .is-admin-container .form-field-title-container.title-container-2{width:35%!important}.svc-test-result{position:absolute;transition:var(--transition);height:0;width:100%;background-color:var(--background);bottom:0;font-weight:600;padding-left:.625rem;padding-right:.625rem;border-color:var(--inputBorder);border-style:solid;border-width:var(--inputBorderWidth);border-bottom-right-radius:var(--inputBorderRadius);border-bottom-left-radius:var(--inputBorderRadius);border-top-style:none}.svc-test-result.test-result-open{height:-moz-fit-content;height:fit-content;box-shadow:0 -.125rem .6875rem 0 var(--boxShadow);padding-bottom:.9375rem;padding-top:.9375rem}.svc-test-result .close.icon-close{top:.625rem;right:.625rem;font-size:1.125rem;height:1.125rem;width:1.125rem;line-height:1.125rem}.dropdown-container{display:flex;flex-direction:column;position:relative}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-label{color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-line{border-color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle{border-color:var(--primaryColor);border-style:solid;border-width:var(--inputBorderWidth)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle .switch{top:.0625rem}::ng-deep .form-field-extended-fields .form-field-extended-fields{padding:0}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.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: i5.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i6$1.InputText, selector: "[pInputText]" }, { kind: "directive", type: i9.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i8.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "component", type: i4$2.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: FormHeaderComponent, selector: "lib-form-header", inputs: ["data", "badges", "title", "moreActions", "formView", "saveDisabled", "saveTooltip", "actionButtonText", "moreActionsText", "showHeaderToggle", "showHeaderButton", "multiActions"], outputs: ["formViewChange", "actionRequested", "multiActionRequested"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }, { kind: "component", type: PreviewListComponent, selector: "lib-preview-list", inputs: ["label", "clickable", "isLoading", "allNames", "items", "allowRemove", "tooltip", "showfilter", "localFilter"], outputs: ["itemSelected", "itemRemoved", "filterChanged"] }, { kind: "component", type: LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }, { kind: "component", type: FormFieldToggleComponent, selector: "lib-form-field-toggle", inputs: ["label", "orientation", "labelOn", "labelOff", "toggleOn"], outputs: ["toggleOnChange"] }, { kind: "component", type: JsonViewComponent, selector: "lib-json-view", inputs: ["data", "schema", "readOnly", "jsonInvalid", "showCopy", "showLineNumbers"], outputs: ["dataChange", "jsonChange", "jsonInvalidChange"] }, { kind: "component", type: TagSelectorComponent, selector: "lib-tag-selector", inputs: ["placeholder", "disableField", "disableCreate", "hideOption", "isLoading", "errorMessage", "focusOnInit", "selectedRoleAttributes", "selectedNamedAttributes", "hasError", "availableRoleAttributes", "availableNamedAttributes"], outputs: ["addRoleAttribute", "addNamedAttribute", "roleAttributeRemoved", "namedAttributeRemoved", "selectedRoleAttributesChange", "selectedNamedAttributesChange", "filterChange"] }, { kind: "component", type: CustomTagsComponent, selector: "lib-custom-tags", inputs: ["tags"], outputs: ["tagsChange"] }, { kind: "component", type: ConfigEditorComponent, selector: "lib-config-editor", inputs: ["configErrors", "configData", "showJsonView", "schema"], outputs: ["configErrorsChange", "configDataChange"] }] }); }
|
|
17933
18261
|
}
|
|
17934
18262
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ServiceFormComponent, decorators: [{
|
|
17935
18263
|
type: Component,
|
|
@@ -17938,7 +18266,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
17938
18266
|
provide: MatDialogRef,
|
|
17939
18267
|
useValue: {}
|
|
17940
18268
|
}
|
|
17941
|
-
], template: "<div class=\"projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"returnToListPage()\"\n tabindex=\"0\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"(formData.id ? 'Edit Service' : 'Create Service')\"\n [moreActions]=\"moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n [saveDisabled]=\"svc.saveDisabled || formDataInvalid\"\n [saveTooltip]=\"saveButtonTooltip\"\n ></lib-form-header>\n <div class=\"edge-router-form-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" [hidden]=\"formView !== 'simple'\">\n <div class=\"form-group-column three-fifths\">\n <lib-form-field-container [title]=\"'Service Name'\" [label]=\"'Required'\">\n <input\n class=\"form-field-input\"\n placeholder=\"Name this Service\"\n [ngClass]=\"{error: svc.errors['name']}\"\n [(ngModel)]=\"formData.name\"\n autofocus\n #nameFieldInput\n />\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Select or create Service attributes'\"\n [label]=\"'Optional'\"\n [contentStyle]=\"'z-index: 99999999'\"\n [helpText]=\"'Attributes are tags applied to a resource. Apply the same tag to other Services to form a group of Services.'\"\n >\n <lib-tag-selector\n [(selectedRoleAttributes)]=\"formData.roleAttributes\"\n [availableRoleAttributes]=\"serviceRoleAttributes\"\n [placeholder]=\"'Add attributes to group Services'\"\n ></lib-tag-selector>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Add Configurations'\"\n (actionRequested)=\"attachConfig()\"\n (keyup.enter)=\"captureConfigEnterEvent($event)\"\n [helpText]=\"'Configurations are used to define how to intercept and host a service. Ziti Networks come with built-in configuration types (ie. intercept.v1 and host.v1)'\"\n >\n <div class=\"form-field-input-group\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">Select a Config</span>\n </div>\n <select\n [(ngModel)]=\"svc.selectedConfigTypeId\"\n (change)=\"configTypeChanged($event)\"\n id=\"SelectedConfigType\"\n class=\"form-field-dropdown\"\n >\n <option value=\"\">Select configuration type...</option>\n <option\n *ngFor=\"let type of svc.configTypes\"\n [value]=\"type.id\"\n >\n {{ type.name }}\n </option>\n </select>\n <div class=\"dropdown-container\" [ngClass]=\"{'dropdown-loading': svc.configsLoading}\">\n <p-dropdown\n placeholder=\"Select configuration...\"\n optionLabel=\"name\"\n optionValue=\"id\"\n filterBy=\"name\"\n [options]=\"svc.filteredConfigs\"\n [filter]=\"true\"\n [showClear]=\"true\"\n [disabled]=\"!svc.selectedConfigTypeId || svc.selectedConfigTypeId === ''\"\n (onChange)=\"configChanged($event)\"\n [(ngModel)]=\"svc.selectedConfigId\"\n >\n <ng-template pTemplate=\"filter\" let-options=\"options\">\n <div class=\"dropdown-filter-container\">\n <div class=\"p-inputgroup\" (click)=\"$event.stopPropagation()\">\n <span class=\"p-inputgroup-addon\"><i class=\"pi pi-search\"></i></span>\n <input\n type=\"text\"\n pInputText\n placeholder=\"Filter\"\n (keyup)=\"configFilterChangedDebounced($event)\" />\n </div>\n <button pButton\n icon=\"pi pi-times\"\n [ngClass]=\"{'configs-loading': svc.configsLoading}\"\n (click)=\"clearConfigFilter($event)\"\n severity=\"secondary\">\n </button>\n <div class=\"spinner\" *ngIf=\"svc.configsLoading\"></div>\n </div>\n </ng-template>\n </p-dropdown>\n </div>\n <div *ngIf=\"!showConfigData && svc.selectedConfigId && svc.selectedConfigId !== '' && svc.selectedConfigId !== 'preview'\" class=\"button-row-right\" >\n <div class=\"save-button\" (click)=\"svc.attachConfig(svc.selectedConfigId)\">\n {{svc.attachLabel}}\n </div>\n </div>\n <div [hidden]=\"!showConfigData\" class=\"form-field-extended-fields\" [ngClass]=\"{'cfg-preview': svc.selectedConfigId === 'preview'}\">\n <div *ngIf=\"showConfigData\" class=\"config-title-row\" style=\"margin-bottom: 10px;\">\n <span class=\"form-field-title\">Config Name</span>\n <div\n class=\"save-button\"\n (click)=\"attachConfig()\"\n *ngIf=\"svc.selectedConfigId !== 'preview'\"\n >{{svc.attachLabel}}\n </div>\n </div>\n <input\n *ngIf=\"showConfigData\"\n [(ngModel)]=\"svc.newConfigName\"\n class=\"form-field-input\"\n [placeholder]=\"'New Config Name'\"\n [ngClass]=\"{error: svc.configErrors['name']}\"\n style=\"margin-bottom: 20px;\"\n />\n <div class=\"config-title-row\" style=\"margin-bottom: 10px;\">\n <span class=\"form-field-title\">Configuration Data</span>\n <div class=\"form-header-toggle-container\" *ngIf=\"svc.selectedConfigId !== 'preview'\">\n <span\n class=\"toggle-option-text\"\n [ngClass]=\"{'toggle-option-selected': !svc.configJsonView}\"\n (click)=\"svc.toggleJSONView()\"\n >\n FORM\n </span>\n <div class=\"form-header-toggle\" (click)=\"svc.toggleJSONView()\">\n <div\n class=\"form-toggle-switch\"\n [ngClass]=\"{'toggle-left': !svc.configJsonView, 'toggle-right': svc.configJsonView}\"\n >\n <div class=\"form-toggle-indicator\"></div>\n <div class=\"form-toggle-indicator\"></div>\n </div>\n </div>\n <span\n class=\"toggle-option-text\"\n [ngClass]=\"{'toggle-option-selected': svc.configJsonView}\"\n (click)=\"svc.toggleJSONView()\"\n >\n JSON\n </span>\n </div>\n </div>\n <lib-config-editor\n [(configData)]=\"svc.configData\"\n [schema]=\"svc.selectedSchema\"\n [showJsonView]=\"svc.configJsonView\"\n [(configErrors)]=\"svc.configErrors\"\n #configEditor\n ></lib-config-editor>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-toggle [(toggleOn)]=\"showMore\" style=\"margin: 0px 10px\"></lib-form-field-toggle>\n <div *ngIf=\"showMore\" class=\"form-group-column\">\n <lib-form-field-container\n [title]=\"'Terminator Strategy'\"\n [title2]=\"'Encryption'\"\n [layout]=\"'row'\"\n [helpText]=\"'Pick a strategy to determine how to rank available terminators for a service'\"\n [helpText2]=\"'Encrypts packets when entering or leaving the network.'\"\n class=\"form-field-advanced\"\n >\n <select\n [(ngModel)]=\"formData.terminatorStrategy\"\n id=\"authPolicyId\"\n class=\"form-field-dropdown\"\n >\n <option value=\"\">Select a Strategy....</option>\n <option\n *ngFor=\"let strat of strategies\"\n [value]=\"strat.id\"\n >\n {{ strat.label }}\n </option>\n </select>\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"config-container-label\">Require Encryption</div>\n <div\n (click)=\"toggleEncryptionRequired()\"\n [ngClass]=\"{ on: formData.encryptionRequired }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.encryptionRequired\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.encryptionRequired\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Custom Tags'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n >\n <lib-custom-tags [(tags)]=\"formData.tags\"></lib-custom-tags>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column two-fifths\">\n <lib-form-field-container\n [title]=\"'Associated Entities'\"\n [label]=\"'Click for detailed view'\"\n [helpText]=\"'List the configs, policies, and terminators that are associated with this service. Click on the entity name to navigate to the entity\\'s detailed view.'\"\n [class]=\"'no-gap'\"\n >\n <div class=\"form-row space-between\" style=\"margin-top: 0;\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">Configurations</span>\n </div>\n <span class=\"form-field-count\">{{svc.addedConfigs ? svc.addedConfigs.length : 0}}</span>\n </div>\n <lib-preview-list\n [isLoading]=\"svc.associatedConfigsLoading\"\n [allNames]=\"svc.addedConfigs\"\n [allowRemove]=\"true\"\n [clickable]=\"true\"\n [showfilter]=\"false\"\n [tooltip]=\"'View Config'\"\n (itemRemoved)=\"svc.removeConfig($event)\"\n (itemSelected)=\"svc.previewConfig($event, router)\"\n ></lib-preview-list>\n <div class=\"form-row space-between\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">Service Policies</span>\n </div>\n <span class=\"form-field-count\">{{svc.associatedServicePoliciesTotal}}</span>\n </div>\n <lib-preview-list\n [isLoading]=\"svc.associatedServicePoliciesLoading\"\n [clickable]=\"true\"\n (itemSelected)=\"svc.previewPolicy($event, router)\"\n [tooltip]=\"'View Service Policy'\"\n [allNames]=\"svc.associatedServicePolicies\"\n [showfilter]=\"false\"\n ></lib-preview-list>\n <div class=\"form-row space-between\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">Terminators</span>\n </div>\n <span class=\"form-field-count\">{{svc.associatedTerminators ? svc.associatedTerminators.length : 0}}</span>\n </div>\n <lib-preview-list\n [isLoading]=\"svc.associatedTerminatorsLoading\"\n [clickable]=\"true\"\n (itemSelected)=\"svc.previewTerminator($event, router)\"\n [tooltip]=\"'View Terminator'\"\n [allNames]=\"svc.associatedTerminators\"\n [showfilter]=\"false\"\n ></lib-preview-list>\n </lib-form-field-container>\n<!-- <lib-form-field-container\n *ngIf=\"formData.id\"\n [title]=\"'Associated Service Policies'\"\n [count]=\"svc.associatedServicePolicies.length\"\n [helpText]=\"'Preview list of all service policies that this service is associated with.'\"\n >\n </lib-form-field-container>-->\n <lib-form-field-container\n [title]=\"'API Calls'\"\n [label]=\"''\"\n [class]=\"'api-call-container'\"\n [helpText]=\"'Preview of the API URL and data model that is used to create/update this service'\"\n >\n <div class=\"form-row\">\n <input class=\"form-field-input\" [value]=\"apiCallURL\" readonly/>\n <div class=\"url-copy icon-copy copy\" (click)=\"copyToClipboard(apiCallURL)\"></div>\n </div>\n <lib-json-view *ngIf=\"formData\" [(data)]=\"svc.apiData\" [readOnly]=\"true\" [showCopy]=\"true\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\" [(jsonInvalid)]=\"formDataInvalid\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>", styles: [".edge-router-form-container{display:flex;flex-direction:column;height:100%;width:100%;align-items:center;gap:.9375rem}.form-field-dropdown{background-image:url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22utf-8%22%3F%3E%3C!-- Generator%3A Adobe Illustrator 23.0.3%2C SVG Export Plug-In . SVG Version%3A 6.00 Build 0) --%3E%3Csvg id%3D'Stroke_Color' style%3D'enable-background%3Anew 0 0 20.2 10.8%3B' version%3D'1.1' viewBox%3D'0 0 20.2 10.8' x%3D'0px' xml%3Aspace%3D'preserve' xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' y%3D'0px'%3E%3Cstyle type%3D'text%2Fcss'%3E%09.st0 %7B fill%3A %23668291%3B %7D%3C%2Fstyle%3E %3Cg%3E%09%3Cpath class%3D'st0' d%3D'M19.8%2C1.7c0%2C0.4-0.1%2C0.7-0.4%2C0.9l-8.5%2C7.3c-0.5%2C0.4-1.2%2C0.4-1.6%2C0L0.7%2C2.7C0.2%2C2.2%2C0.2%2C1.5%2C0.6%2C0.9%09%09c0.5-0.5%2C1.2-0.6%2C1.8-0.1l7.7%2C6.6l7.7-6.6c0.5-0.5%2C1.3-0.4%2C1.8%2C0.1C19.7%2C1.2%2C19.8%2C1.5%2C19.8%2C1.7z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E\");background-position:center right .625rem;background-repeat:no-repeat;background-size:1.125rem;padding-right:1.75rem}.form-field-extended-fields{position:relative;display:flex;flex-direction:column}.form-field-extended-fields.cfg-preview{opacity:.8;filter:grayscale(.4);pointer-events:none}.form-header-toggle-container{display:flex;flex-direction:row;align-items:center}.form-header-toggle-container .form-header-toggle{display:flex;flex-direction:row;width:1.875rem;height:1.125rem;border-radius:.625rem;border-color:var(--inputBorder);border-style:solid;border-width:var(--inputBorderWidth);margin-left:.3125rem;cursor:pointer;position:relative;margin-right:.3125rem}.form-header-toggle-container .form-header-toggle:hover{filter:brightness(90%)}.form-header-toggle-container .form-header-toggle:active{transform:translateY(.0625rem);filter:brightness(80%)}.form-header-toggle-container .form-header-toggle .form-toggle-switch{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;height:100%;margin-left:.1875rem;position:absolute;transition:.5s;left:0}.form-header-toggle-container .form-header-toggle .form-toggle-switch.toggle-right{left:.625rem}.form-header-toggle-container .form-header-toggle .form-toggle-switch.toggle-right .form-toggle-indicator{border-color:var(--red)}.form-header-toggle-container .form-header-toggle .form-toggle-switch .form-toggle-indicator{height:.625rem;border-color:var(--green);border-style:solid;border-left-width:.0625rem;border-right-width:.0625rem;position:relative;margin-left:.125rem}.form-header-toggle-container .toggle-option-text{font-size:.8125rem;font-weight:600;color:var(--placeholder);cursor:pointer}.form-header-toggle-container .toggle-option-text:hover{filter:brightness(90%)}.form-header-toggle-container .toggle-option-text:hover.toggle-option-selected{filter:unset}.form-header-toggle-container .toggle-option-text.toggle-option-selected{color:var(--tableText);cursor:default}.jsonButton{position:relative;top:0;margin:0;padding:.625rem;height:1.875rem}.disabled{opacity:.5;pointer-events:none}.attach-config{display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.875rem;background:var(--primary);padding:.4375rem;border-radius:var(--inputBorderRadius);color:var(--white);cursor:pointer;box-shadow:0 .1875rem .5625rem 0 var(--primaryColorOpaque);border:none;width:-moz-fit-content;width:fit-content}.attach-config:active{background:#648293;box-shadow:none;transform:translateY(.0625rem)}.attach-config:hover{outline:0;filter:brightness(90%);box-shadow:0 .125rem .1875rem 0 var(--primaryColorOpaque)}::ng-deep .admin-toggle{width:100%;width:35%;display:flex}::ng-deep .admin-toggle .form-field-line{display:none}::ng-deep .admin-toggle .toggle{width:100%}::ng-deep .is-admin-container .form-field-title-container.title-container-2{width:35%!important}.svc-test-result{position:absolute;transition:var(--transition);height:0;width:100%;background-color:var(--background);bottom:0;font-weight:600;padding-left:.625rem;padding-right:.625rem;border-color:var(--inputBorder);border-style:solid;border-width:var(--inputBorderWidth);border-bottom-right-radius:var(--inputBorderRadius);border-bottom-left-radius:var(--inputBorderRadius);border-top-style:none}.svc-test-result.test-result-open{height:-moz-fit-content;height:fit-content;box-shadow:0 -.125rem .6875rem 0 var(--boxShadow);padding-bottom:.9375rem;padding-top:.9375rem}.svc-test-result .close.icon-close{top:.625rem;right:.625rem;font-size:1.125rem;height:1.125rem;width:1.125rem;line-height:1.125rem}.dropdown-container{display:flex;flex-direction:column;position:relative}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-label{color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-line{border-color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle{border-color:var(--primaryColor);border-style:solid;border-width:var(--inputBorderWidth)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle .switch{top:.0625rem}::ng-deep .form-field-extended-fields .form-field-extended-fields{padding:0}\n"] }]
|
|
18269
|
+
], template: "<div class=\"projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"returnToListPage()\"\n tabindex=\"0\"\n *ngIf=\"dataInit\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"(formData.id ? 'Edit Service' : 'Create Service')\"\n [moreActions]=\"moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n [saveDisabled]=\"svc.saveDisabled || formDataInvalid\"\n [saveTooltip]=\"saveButtonTooltip\"\n ></lib-form-header>\n <div class=\"edge-router-form-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" [hidden]=\"formView !== 'simple'\">\n <div class=\"form-group-column three-fifths\">\n <lib-form-field-container [title]=\"'Service Name'\" [label]=\"'Required'\">\n <input\n class=\"form-field-input\"\n placeholder=\"Name this Service\"\n [ngClass]=\"{error: svc.errors['name']}\"\n [(ngModel)]=\"formData.name\"\n autofocus\n #nameFieldInput\n />\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Select or create Service attributes'\"\n [label]=\"'Optional'\"\n [contentStyle]=\"'z-index: 99999999'\"\n [helpText]=\"'Attributes are tags applied to a resource. Apply the same tag to other Services to form a group of Services.'\"\n >\n <lib-tag-selector\n [(selectedRoleAttributes)]=\"formData.roleAttributes\"\n [availableRoleAttributes]=\"serviceRoleAttributes\"\n [placeholder]=\"'Add attributes to group Services'\"\n ></lib-tag-selector>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Add Configurations'\"\n (actionRequested)=\"attachConfig()\"\n (keyup.enter)=\"captureConfigEnterEvent($event)\"\n [helpText]=\"'Configurations are used to define how to intercept and host a service. Ziti Networks come with built-in configuration types (ie. intercept.v1 and host.v1)'\"\n >\n <div class=\"form-field-input-group\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">Select a Config</span>\n </div>\n <select\n [(ngModel)]=\"svc.selectedConfigTypeId\"\n (change)=\"configTypeChanged($event)\"\n id=\"SelectedConfigType\"\n class=\"form-field-dropdown\"\n >\n <option value=\"\">Select configuration type...</option>\n <option\n *ngFor=\"let type of svc.configTypes\"\n [value]=\"type.id\"\n >\n {{ type.name }}\n </option>\n </select>\n <div class=\"dropdown-container\" [ngClass]=\"{'dropdown-loading': svc.configsLoading}\">\n <p-dropdown\n placeholder=\"Select configuration...\"\n optionLabel=\"name\"\n optionValue=\"id\"\n filterBy=\"name\"\n [options]=\"svc.filteredConfigs\"\n [filter]=\"true\"\n [showClear]=\"true\"\n [disabled]=\"!svc.selectedConfigTypeId || svc.selectedConfigTypeId === ''\"\n (onChange)=\"configChanged($event)\"\n [(ngModel)]=\"svc.selectedConfigId\"\n >\n <ng-template pTemplate=\"filter\" let-options=\"options\">\n <div class=\"dropdown-filter-container\">\n <div class=\"p-inputgroup\" (click)=\"$event.stopPropagation()\">\n <span class=\"p-inputgroup-addon\"><i class=\"pi pi-search\"></i></span>\n <input\n type=\"text\"\n pInputText\n placeholder=\"Filter\"\n (keyup)=\"configFilterChangedDebounced($event)\" />\n </div>\n <button pButton\n icon=\"pi pi-times\"\n [ngClass]=\"{'configs-loading': svc.configsLoading}\"\n (click)=\"clearConfigFilter($event)\"\n severity=\"secondary\">\n </button>\n <div class=\"spinner\" *ngIf=\"svc.configsLoading\"></div>\n </div>\n </ng-template>\n </p-dropdown>\n </div>\n <div *ngIf=\"!showConfigData && svc.selectedConfigId && svc.selectedConfigId !== '' && svc.selectedConfigId !== 'preview'\" class=\"button-row-right\" >\n <div class=\"save-button\" (click)=\"svc.attachConfig(svc.selectedConfigId)\">\n {{svc.attachLabel}}\n </div>\n </div>\n <div [hidden]=\"!showConfigData\" class=\"form-field-extended-fields\" [ngClass]=\"{'cfg-preview': svc.selectedConfigId === 'preview'}\">\n <div *ngIf=\"showConfigData\" class=\"config-title-row\" style=\"margin-bottom: 10px;\">\n <span class=\"form-field-title\">Config Name</span>\n <div\n class=\"save-button\"\n (click)=\"attachConfig()\"\n *ngIf=\"svc.selectedConfigId !== 'preview'\"\n >{{svc.attachLabel}}\n </div>\n </div>\n <input\n *ngIf=\"showConfigData\"\n [(ngModel)]=\"svc.newConfigName\"\n class=\"form-field-input\"\n [placeholder]=\"'New Config Name'\"\n [ngClass]=\"{error: svc.configErrors['name']}\"\n style=\"margin-bottom: 20px;\"\n />\n <div class=\"config-title-row\" style=\"margin-bottom: 10px;\">\n <span class=\"form-field-title\">Configuration Data</span>\n <div class=\"form-header-toggle-container\" *ngIf=\"svc.selectedConfigId !== 'preview'\">\n <span\n class=\"toggle-option-text\"\n [ngClass]=\"{'toggle-option-selected': !svc.configJsonView}\"\n (click)=\"svc.toggleJSONView()\"\n >\n FORM\n </span>\n <div class=\"form-header-toggle\" (click)=\"svc.toggleJSONView()\">\n <div\n class=\"form-toggle-switch\"\n [ngClass]=\"{'toggle-left': !svc.configJsonView, 'toggle-right': svc.configJsonView}\"\n >\n <div class=\"form-toggle-indicator\"></div>\n <div class=\"form-toggle-indicator\"></div>\n </div>\n </div>\n <span\n class=\"toggle-option-text\"\n [ngClass]=\"{'toggle-option-selected': svc.configJsonView}\"\n (click)=\"svc.toggleJSONView()\"\n >\n JSON\n </span>\n </div>\n </div>\n <lib-config-editor\n [(configData)]=\"svc.configData\"\n [schema]=\"svc.selectedSchema\"\n [showJsonView]=\"svc.configJsonView\"\n [(configErrors)]=\"svc.configErrors\"\n #configEditor\n ></lib-config-editor>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-toggle [(toggleOn)]=\"showMore\" style=\"margin: 0px 10px\"></lib-form-field-toggle>\n <div *ngIf=\"showMore\" class=\"form-group-column\">\n <lib-form-field-container\n [title]=\"'Terminator Strategy'\"\n [title2]=\"'Encryption'\"\n [layout]=\"'row'\"\n [helpText]=\"'Pick a strategy to determine how to rank available terminators for a service'\"\n [helpText2]=\"'Encrypts packets when entering or leaving the network.'\"\n class=\"form-field-advanced\"\n >\n <select\n [(ngModel)]=\"formData.terminatorStrategy\"\n id=\"authPolicyId\"\n class=\"form-field-dropdown\"\n >\n <option value=\"\">Select a Strategy....</option>\n <option\n *ngFor=\"let strat of strategies\"\n [value]=\"strat.id\"\n >\n {{ strat.label }}\n </option>\n </select>\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"config-container-label\">Require Encryption</div>\n <div\n (click)=\"toggleEncryptionRequired()\"\n [ngClass]=\"{ on: formData.encryptionRequired }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.encryptionRequired\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.encryptionRequired\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Custom Tags'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n >\n <lib-custom-tags [(tags)]=\"formData.tags\"></lib-custom-tags>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column two-fifths\">\n <lib-form-field-container\n [title]=\"'Associated Entities'\"\n [label]=\"'click item to view details'\"\n [helpText]=\"'List the configs, policies, and terminators that are associated with this service. Click on the entity name to navigate to the entity\\'s detailed view.'\"\n [class]=\"'no-gap'\"\n >\n <div class=\"form-row space-between\" style=\"margin-top: 0;\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">Configurations</span>\n </div>\n <span class=\"form-field-count\">{{svc.addedConfigs ? svc.addedConfigs.length : 0}}</span>\n </div>\n <lib-preview-list\n [isLoading]=\"svc.associatedConfigsLoading\"\n [allNames]=\"svc.addedConfigs\"\n [allowRemove]=\"true\"\n [clickable]=\"true\"\n [tooltip]=\"'View Config'\"\n [showfilter]=\"false\"\n (itemRemoved)=\"svc.removeConfig($event)\"\n (itemSelected)=\"svc.previewConfig($event, router)\"\n ></lib-preview-list>\n <div class=\"form-row space-between\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">Service Policies</span>\n </div>\n <span class=\"form-field-count\">{{svc.associatedServicePoliciesTotal}}</span>\n </div>\n <lib-preview-list\n [isLoading]=\"svc.associatedServicePoliciesLoading\"\n [clickable]=\"true\"\n (itemSelected)=\"svc.previewPolicy($event, router)\"\n [tooltip]=\"'View Service Policy'\"\n [allNames]=\"svc.associatedServicePolicies\"\n [showfilter]=\"svc.showServicePoliciesFilter\"\n [localFilter]=\"false\"\n (filterChanged)=\"svc.getAssociatedServicePoliciesDebounced($event)\"\n ></lib-preview-list>\n <div class=\"form-row space-between\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">Terminators</span>\n </div>\n <span class=\"form-field-count\">{{svc.associatedTerminatorsTotal}}</span>\n </div>\n <lib-preview-list\n [isLoading]=\"svc.associatedTerminatorsLoading\"\n [clickable]=\"true\"\n (itemSelected)=\"svc.previewTerminator($event, router)\"\n [tooltip]=\"'View Terminator'\"\n [allNames]=\"svc.associatedTerminators\"\n [showfilter]=\"false\"\n [showfilter]=\"svc.showTerminatorsFilter\"\n [localFilter]=\"false\"\n (filterChanged)=\"svc.getAssociatedTerminatorsDebounced($event)\"\n ></lib-preview-list>\n </lib-form-field-container>\n<!-- <lib-form-field-container\n *ngIf=\"formData.id\"\n [title]=\"'Associated Service Policies'\"\n [count]=\"svc.associatedServicePolicies.length\"\n [helpText]=\"'Preview list of all service policies that this service is associated with.'\"\n >\n </lib-form-field-container>-->\n <lib-form-field-container\n [title]=\"'API Calls'\"\n [label]=\"''\"\n [class]=\"'api-call-container'\"\n [helpText]=\"'Preview of the API URL and data model that is used to create/update this service'\"\n >\n <div class=\"form-row\">\n <input class=\"form-field-input\" [value]=\"apiCallURL\" readonly/>\n <div class=\"url-copy icon-copy copy\" (click)=\"copyToClipboard(apiCallURL)\"></div>\n </div>\n <lib-json-view *ngIf=\"formData\" [(data)]=\"svc.apiData\" [readOnly]=\"true\" [showCopy]=\"true\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\" [(jsonInvalid)]=\"formDataInvalid\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>\n", styles: [".edge-router-form-container{display:flex;flex-direction:column;height:100%;width:100%;align-items:center;gap:.9375rem}.form-field-dropdown{background-image:url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22utf-8%22%3F%3E%3C!-- Generator%3A Adobe Illustrator 23.0.3%2C SVG Export Plug-In . SVG Version%3A 6.00 Build 0) --%3E%3Csvg id%3D'Stroke_Color' style%3D'enable-background%3Anew 0 0 20.2 10.8%3B' version%3D'1.1' viewBox%3D'0 0 20.2 10.8' x%3D'0px' xml%3Aspace%3D'preserve' xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' y%3D'0px'%3E%3Cstyle type%3D'text%2Fcss'%3E%09.st0 %7B fill%3A %23668291%3B %7D%3C%2Fstyle%3E %3Cg%3E%09%3Cpath class%3D'st0' d%3D'M19.8%2C1.7c0%2C0.4-0.1%2C0.7-0.4%2C0.9l-8.5%2C7.3c-0.5%2C0.4-1.2%2C0.4-1.6%2C0L0.7%2C2.7C0.2%2C2.2%2C0.2%2C1.5%2C0.6%2C0.9%09%09c0.5-0.5%2C1.2-0.6%2C1.8-0.1l7.7%2C6.6l7.7-6.6c0.5-0.5%2C1.3-0.4%2C1.8%2C0.1C19.7%2C1.2%2C19.8%2C1.5%2C19.8%2C1.7z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E\");background-position:center right .625rem;background-repeat:no-repeat;background-size:1.125rem;padding-right:1.75rem}.form-field-extended-fields{position:relative;display:flex;flex-direction:column}.form-field-extended-fields.cfg-preview{opacity:.8;filter:grayscale(.4);pointer-events:none}.form-header-toggle-container{display:flex;flex-direction:row;align-items:center}.form-header-toggle-container .form-header-toggle{display:flex;flex-direction:row;width:1.875rem;height:1.125rem;border-radius:.625rem;border-color:var(--inputBorder);border-style:solid;border-width:var(--inputBorderWidth);margin-left:.3125rem;cursor:pointer;position:relative;margin-right:.3125rem}.form-header-toggle-container .form-header-toggle:hover{filter:brightness(90%)}.form-header-toggle-container .form-header-toggle:active{transform:translateY(.0625rem);filter:brightness(80%)}.form-header-toggle-container .form-header-toggle .form-toggle-switch{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;height:100%;margin-left:.1875rem;position:absolute;transition:.5s;left:0}.form-header-toggle-container .form-header-toggle .form-toggle-switch.toggle-right{left:.625rem}.form-header-toggle-container .form-header-toggle .form-toggle-switch.toggle-right .form-toggle-indicator{border-color:var(--red)}.form-header-toggle-container .form-header-toggle .form-toggle-switch .form-toggle-indicator{height:.625rem;border-color:var(--green);border-style:solid;border-left-width:.0625rem;border-right-width:.0625rem;position:relative;margin-left:.125rem}.form-header-toggle-container .toggle-option-text{font-size:.8125rem;font-weight:600;color:var(--placeholder);cursor:pointer}.form-header-toggle-container .toggle-option-text:hover{filter:brightness(90%)}.form-header-toggle-container .toggle-option-text:hover.toggle-option-selected{filter:unset}.form-header-toggle-container .toggle-option-text.toggle-option-selected{color:var(--tableText);cursor:default}.jsonButton{position:relative;top:0;margin:0;padding:.625rem;height:1.875rem}.disabled{opacity:.5;pointer-events:none}.attach-config{display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.875rem;background:var(--primary);padding:.4375rem;border-radius:var(--inputBorderRadius);color:var(--white);cursor:pointer;box-shadow:0 .1875rem .5625rem 0 var(--primaryColorOpaque);border:none;width:-moz-fit-content;width:fit-content}.attach-config:active{background:#648293;box-shadow:none;transform:translateY(.0625rem)}.attach-config:hover{outline:0;filter:brightness(90%);box-shadow:0 .125rem .1875rem 0 var(--primaryColorOpaque)}::ng-deep .admin-toggle{width:100%;width:35%;display:flex}::ng-deep .admin-toggle .form-field-line{display:none}::ng-deep .admin-toggle .toggle{width:100%}::ng-deep .is-admin-container .form-field-title-container.title-container-2{width:35%!important}.svc-test-result{position:absolute;transition:var(--transition);height:0;width:100%;background-color:var(--background);bottom:0;font-weight:600;padding-left:.625rem;padding-right:.625rem;border-color:var(--inputBorder);border-style:solid;border-width:var(--inputBorderWidth);border-bottom-right-radius:var(--inputBorderRadius);border-bottom-left-radius:var(--inputBorderRadius);border-top-style:none}.svc-test-result.test-result-open{height:-moz-fit-content;height:fit-content;box-shadow:0 -.125rem .6875rem 0 var(--boxShadow);padding-bottom:.9375rem;padding-top:.9375rem}.svc-test-result .close.icon-close{top:.625rem;right:.625rem;font-size:1.125rem;height:1.125rem;width:1.125rem;line-height:1.125rem}.dropdown-container{display:flex;flex-direction:column;position:relative}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-label{color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-line{border-color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle{border-color:var(--primaryColor);border-style:solid;border-width:var(--inputBorderWidth)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle .switch{top:.0625rem}::ng-deep .form-field-extended-fields .form-field-extended-fields{padding:0}\n"] }]
|
|
17942
18270
|
}], ctorParameters: function () { return [{ type: SettingsService, decorators: [{
|
|
17943
18271
|
type: Inject,
|
|
17944
18272
|
args: [SETTINGS_SERVICE]
|
|
@@ -18007,15 +18335,18 @@ class CardListComponent extends ProjectableForm {
|
|
|
18007
18335
|
}
|
|
18008
18336
|
save() {
|
|
18009
18337
|
}
|
|
18338
|
+
back() {
|
|
18339
|
+
this.router?.navigateByUrl(`${this.basePath}`);
|
|
18340
|
+
}
|
|
18010
18341
|
cardSelected(type) {
|
|
18011
18342
|
this.router.navigateByUrl(`/services/${type}`);
|
|
18012
18343
|
}
|
|
18013
18344
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CardListComponent, deps: [{ token: SETTINGS_SERVICE }, { token: ServiceFormService }, { token: ZITI_DATA_SERVICE }, { token: GrowlerService }, { token: SERVICE_EXTENSION_SERVICE }, { token: i4.Router }, { token: i4.ActivatedRoute }, { token: i1$4.Location }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
18014
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CardListComponent, selector: "lib-card-list", outputs: { close: "close", selected: "selected" }, usesInheritance: true, ngImport: i0, template: "<div class=\"card-list-wrapper ziti-page-container fullModal opened\">\n <div class=\"title\" style=\"filter: brightness(50%)\">Create a service</div>\n
|
|
18345
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CardListComponent, selector: "lib-card-list", outputs: { close: "close", selected: "selected" }, usesInheritance: true, ngImport: i0, template: "<div class=\"card-list-wrapper ziti-page-container fullModal opened\">\n <div class=\"card-list-content\">\n <div class=\"card-list-title-container\">\n <div class=\"form-title-back-arrow-icon icon-back-arrow\" (click)=\"back()\"></div>\n <div class=\"title\" style=\"filter: brightness(50%)\">Create a service</div>\n </div>\n <div class=\"subtitle\">Choose a service type</div>\n <div class=\"card-list-container\">\n <lib-card\n (click)=\"cardSelected('simple')\"\n [imageUrl]=\"'/assets/svgs/Simple.svg'\"\n [title]=\"'Simple'\"\n [content]=\"'Simple services required fewer details, only asking for the most commonly used fields.'\"\n [buttonText]=\"'Create Simple Service'\"\n [id]=\"'SimpleServiceCard'\"\n [href]=\"'services/simple'\"\n ></lib-card>\n <lib-card\n (click)=\"cardSelected('advanced')\"\n [imageUrl]=\"'/assets/svgs/Advanced.svg'\"\n [title]=\"'Advanced'\"\n [content]=\"'Advanced services allow you to configure any option supported by the controller but are subsequently a bit more complex.'\"\n [buttonText]=\"'Create Advanced Service'\"\n [id]=\"'AdvancedServiceCard'\"\n [href]=\"'services/advanced'\"\n ></lib-card>\n </div>\n <div (click)=\"returnToListPage()\" class=\"buttonBall close\" id=\"EscZitiAWClose\">\n <div class=\"buttonLabel\">ESC</div>\n </div>\n </div>\n</div>\n", styles: [":host{--shadow: rgba(0, 0, 0, .08)}.card-list-wrapper{align-items:center}.card-list-wrapper .card-list-content{width:-moz-fit-content;width:fit-content;height:-moz-fit-content;height:fit-content;display:flex;flex-direction:column;align-items:center;justify-content:flex-start}.card-list-wrapper .card-list-title-container{width:100%;position:relative}.card-list-wrapper .card-list-title-container .icon-back-arrow{position:absolute;left:0;height:2rem;width:1.325rem;top:2.25rem;display:flex;align-items:center;justify-content:flex-start;transform:scaleX(1.25);margin-left:1.25rem;min-width:1.325rem;padding-left:.125rem;cursor:pointer;font-family:icomoon!important;font-size:1.25rem;font-weight:600;margin-top:.05rem;color:var(--tableText);z-index:9999999}.card-list-wrapper .card-list-title-container .icon-back-arrow:hover{background-color:#fff;border-radius:var(--inputBorderRadius);filter:brightness(90%);transition:.3s}.card-list-wrapper .card-list-title-container>.title{font-size:1.625rem;filter:brightness(50%);padding-top:2.1875rem;text-align:center;width:100%;color:var(--primaryColor);font-family:Russo One;text-transform:uppercase;position:relative;font-weight:400}.card-list-wrapper>.subtitle{text-align:center;width:100%;color:var(--tableText);position:relative;margin-bottom:0rem;font-size:2rem;font-weight:300;font-family:Open Sans;float:left}.card-list-wrapper .card-list-container{display:flex;flex-direction:row;width:100%;justify-content:center}.card-list-wrapper .buttonBall.close{font-style:normal;font-weight:600;-webkit-font-smoothing:antialiased;cursor:pointer;position:absolute;width:3.9375rem;height:3.9375rem;font-size:1.875rem;top:1.25rem;right:1.25rem;left:unset;z-index:20;color:var(--stroke);text-transform:uppercase;text-align:center;line-height:2.5rem;font-family:zac!important;font-variant:normal;border-radius:2.0625rem;transition:all .3s ease 0s}.card-list-wrapper .buttonBall.close:before{content:\"\\e91b\";font-size:1.875rem}.card-list-wrapper .buttonBall:hover{background-color:var(--primaryColor);color:var(--white);box-shadow:0 .125rem .1875rem 0 var(--primaryColorOpaque);transition:all .2s ease 0s}.card-list-wrapper .buttonBall:hover:before{color:var(--white)}.card-list-wrapper .buttonBall .buttonLabel{font-weight:600;font-family:Open Sans,Arial,sans-serif;position:absolute;bottom:-.125rem;width:100%;text-align:center;font-size:.75rem;text-transform:uppercase}\n"], dependencies: [{ kind: "component", type: CardComponent, selector: "lib-card", inputs: ["imageUrl", "title", "content", "buttonText", "id", "href"] }] }); }
|
|
18015
18346
|
}
|
|
18016
18347
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CardListComponent, decorators: [{
|
|
18017
18348
|
type: Component,
|
|
18018
|
-
args: [{ selector: 'lib-card-list', template: "<div class=\"card-list-wrapper ziti-page-container fullModal opened\">\n <div class=\"title\" style=\"filter: brightness(50%)\">Create a service</div>\n
|
|
18349
|
+
args: [{ selector: 'lib-card-list', template: "<div class=\"card-list-wrapper ziti-page-container fullModal opened\">\n <div class=\"card-list-content\">\n <div class=\"card-list-title-container\">\n <div class=\"form-title-back-arrow-icon icon-back-arrow\" (click)=\"back()\"></div>\n <div class=\"title\" style=\"filter: brightness(50%)\">Create a service</div>\n </div>\n <div class=\"subtitle\">Choose a service type</div>\n <div class=\"card-list-container\">\n <lib-card\n (click)=\"cardSelected('simple')\"\n [imageUrl]=\"'/assets/svgs/Simple.svg'\"\n [title]=\"'Simple'\"\n [content]=\"'Simple services required fewer details, only asking for the most commonly used fields.'\"\n [buttonText]=\"'Create Simple Service'\"\n [id]=\"'SimpleServiceCard'\"\n [href]=\"'services/simple'\"\n ></lib-card>\n <lib-card\n (click)=\"cardSelected('advanced')\"\n [imageUrl]=\"'/assets/svgs/Advanced.svg'\"\n [title]=\"'Advanced'\"\n [content]=\"'Advanced services allow you to configure any option supported by the controller but are subsequently a bit more complex.'\"\n [buttonText]=\"'Create Advanced Service'\"\n [id]=\"'AdvancedServiceCard'\"\n [href]=\"'services/advanced'\"\n ></lib-card>\n </div>\n <div (click)=\"returnToListPage()\" class=\"buttonBall close\" id=\"EscZitiAWClose\">\n <div class=\"buttonLabel\">ESC</div>\n </div>\n </div>\n</div>\n", styles: [":host{--shadow: rgba(0, 0, 0, .08)}.card-list-wrapper{align-items:center}.card-list-wrapper .card-list-content{width:-moz-fit-content;width:fit-content;height:-moz-fit-content;height:fit-content;display:flex;flex-direction:column;align-items:center;justify-content:flex-start}.card-list-wrapper .card-list-title-container{width:100%;position:relative}.card-list-wrapper .card-list-title-container .icon-back-arrow{position:absolute;left:0;height:2rem;width:1.325rem;top:2.25rem;display:flex;align-items:center;justify-content:flex-start;transform:scaleX(1.25);margin-left:1.25rem;min-width:1.325rem;padding-left:.125rem;cursor:pointer;font-family:icomoon!important;font-size:1.25rem;font-weight:600;margin-top:.05rem;color:var(--tableText);z-index:9999999}.card-list-wrapper .card-list-title-container .icon-back-arrow:hover{background-color:#fff;border-radius:var(--inputBorderRadius);filter:brightness(90%);transition:.3s}.card-list-wrapper .card-list-title-container>.title{font-size:1.625rem;filter:brightness(50%);padding-top:2.1875rem;text-align:center;width:100%;color:var(--primaryColor);font-family:Russo One;text-transform:uppercase;position:relative;font-weight:400}.card-list-wrapper>.subtitle{text-align:center;width:100%;color:var(--tableText);position:relative;margin-bottom:0rem;font-size:2rem;font-weight:300;font-family:Open Sans;float:left}.card-list-wrapper .card-list-container{display:flex;flex-direction:row;width:100%;justify-content:center}.card-list-wrapper .buttonBall.close{font-style:normal;font-weight:600;-webkit-font-smoothing:antialiased;cursor:pointer;position:absolute;width:3.9375rem;height:3.9375rem;font-size:1.875rem;top:1.25rem;right:1.25rem;left:unset;z-index:20;color:var(--stroke);text-transform:uppercase;text-align:center;line-height:2.5rem;font-family:zac!important;font-variant:normal;border-radius:2.0625rem;transition:all .3s ease 0s}.card-list-wrapper .buttonBall.close:before{content:\"\\e91b\";font-size:1.875rem}.card-list-wrapper .buttonBall:hover{background-color:var(--primaryColor);color:var(--white);box-shadow:0 .125rem .1875rem 0 var(--primaryColorOpaque);transition:all .2s ease 0s}.card-list-wrapper .buttonBall:hover:before{color:var(--white)}.card-list-wrapper .buttonBall .buttonLabel{font-weight:600;font-family:Open Sans,Arial,sans-serif;position:absolute;bottom:-.125rem;width:100%;text-align:center;font-size:.75rem;text-transform:uppercase}\n"] }]
|
|
18019
18350
|
}], ctorParameters: function () { return [{ type: SettingsService, decorators: [{
|
|
18020
18351
|
type: Inject,
|
|
18021
18352
|
args: [SETTINGS_SERVICE]
|
|
@@ -18041,11 +18372,13 @@ class CreationSummaryDialogComponent {
|
|
|
18041
18372
|
this.selectedCliCommand = '';
|
|
18042
18373
|
this.selectedEntityType = 'service';
|
|
18043
18374
|
this.selectedEntityName = '';
|
|
18375
|
+
this.isEdit = false;
|
|
18044
18376
|
this.summaryData = [];
|
|
18045
18377
|
this.showAPI = false;
|
|
18046
18378
|
this.hasError = false;
|
|
18047
18379
|
this.hideSummaryNextTime = false;
|
|
18048
18380
|
this.summaryData = data.summaryData;
|
|
18381
|
+
this.isEdit = data.isEdit === true;
|
|
18049
18382
|
}
|
|
18050
18383
|
get hasCreationError() {
|
|
18051
18384
|
let hasError = false;
|
|
@@ -18104,11 +18437,11 @@ class CreationSummaryDialogComponent {
|
|
|
18104
18437
|
this.dialogRef.close('new');
|
|
18105
18438
|
}
|
|
18106
18439
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CreationSummaryDialogComponent, deps: [{ token: i5$1.MatDialogRef }, { token: MAT_DIALOG_DATA }, { token: GrowlerService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
18107
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CreationSummaryDialogComponent, selector: "lib-creation-summary-dialog", ngImport: i0, template: "<div class=\"creation-summary-dialog-container\">\n <div class=\"close icon-close\" (click)=\"close()\"></div>\n <div class=\"title-row\">\n <span class=\"title\">Execution Summary</span>\n <span class=\"subtitle\">The following entities were created for this service</span>\n </div>\n <lib-form-field-container [showHeader]=\"false\">\n <div class=\"copy-links-container\">\n <span class=\"copy-links-title\">\n <span class=\"title\">Entities</span>\n <span class=\"subtitle\" *ngIf=\"hasCreationError\">One or more of the following resources failed to create. See below for more details and/or retry.</span>\n </span>\n </div>\n <div class=\"form-group-row exec-operations-group\">\n <div class=\"summary-groups-container\">\n <div class=\"summary-group\" *ngFor=\"let group of summaryData\">\n <div class=\"summary-group-title\">{{group.title}}</div>\n <ul>\n <li\n
|
|
18440
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CreationSummaryDialogComponent, selector: "lib-creation-summary-dialog", ngImport: i0, template: "<div class=\"creation-summary-dialog-container\">\n <div class=\"close icon-close\" (click)=\"close()\"></div>\n <div class=\"title-row\">\n <span class=\"title\">Execution Summary</span>\n <span class=\"subtitle\">The following entities were {{isEdit ? 'updated' : 'created'}} for this service</span>\n </div>\n <lib-form-field-container [showHeader]=\"false\">\n <div class=\"copy-links-container\">\n <span class=\"copy-links-title\">\n <span class=\"title\">Entities</span>\n <span class=\"subtitle\" *ngIf=\"hasCreationError\">One or more of the following resources failed to create. See below for more details and/or retry.</span>\n </span>\n </div>\n <div class=\"form-group-row exec-operations-group\">\n <div class=\"summary-groups-container\">\n <div class=\"summary-group\" *ngFor=\"let group of summaryData\">\n <div class=\"summary-group-title\">{{group.title}}</div>\n <ul>\n <li\n *ngFor=\"let entity of group.entities\"\n (click)=\"selectZitiEntity(entity.name, 'all')\"\n [ngClass]=\"{selected: selectedEntityType === 'all'}\"\n class=\"entity-item drop-target-svc\"\n >\n <span class=\"spinner\" *ngIf=\"entity.status === 'loading'\"></span>\n <input type=\"checkbox\" [disabled]=\"true\" [checked]=\"true\" class=\"success-check\" *ngIf=\"entity.status === 'done'\">\n <div class=\"retry\" *ngIf=\"entity.status === 'error'\" (click)=\"doRetry(entity)\"></div>\n <div class=\"icon-clear\" *ngIf=\"entity.status === 'error'\"></div>\n <span class=\"entity-name\" matTooltipShowDelay=\"1000\">\n {{ entity.name.length > 0 ? entity.name : 'SimpleService' }}\n </span>\n </li>\n </ul>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container [showHeader]=\"false\" style=\"margin-top: 10px;\">\n <div class=\"copy-links-container\">\n <div class=\"copy-links-title\">\n <div class=\"title-container\">\n <span class=\"title\">Copy Links</span>\n <div class=\"copy-icon\"></div>\n </div>\n </div>\n <div class=\"copy-links\">\n <div class=\"link-button\" (click)=\"copyCliCommands()\">CLI Commands</div>\n <div class=\"link-button\" (click)=\"copyAPIRequests()\">API Requests</div>\n </div>\n </div>\n </lib-form-field-container>\n\n <div class=\"confirm-buttons-container\">\n <button class=\"button save alert\" (click)=\"done()\">Done</button>\n <button class=\"button save cancel\" (click)=\"confirm()\" *ngIf=\"!isEdit\">Create another</button>\n </div>\n</div>\n", styles: [".creation-summary-dialog-container{background-color:var(--formBackground);min-width:29.6875rem;border-radius:var(--modalBorderRadius);padding:var(--paddingXXL)}.creation-summary-dialog-container .title-row{display:flex;align-items:center;flex-direction:column;margin-bottom:var(--marginLarge)}.creation-summary-dialog-container .subtitle{color:var(--text)}.creation-summary-dialog-container .close{font-size:1.5625rem;top:.9375rem;right:.9375rem;width:2.1875rem;font-weight:600}.resource-type-container{display:flex;flex-direction:column;padding-left:var(--paddingLarge);padding-right:var(--paddingLarge)}.resource-type-container.disabled{opacity:.5}.resource-type-container.disabled select{cursor:not-allowed}.resource-type-container .resource-type-content{margin-top:1.25rem;flex-wrap:wrap}.entity-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:-moz-fit-content;width:fit-content}.summary-group ul{padding-inline-start:0rem;margin-block-start:var(--marginSmall);max-height:40.625rem;overflow:auto;overflow-x:hidden}.summary-group .entity-item{display:flex;align-items:center;gap:.3125rem;font-weight:600;font-size:1rem;padding-top:.1875rem;padding-bottom:.1875rem;position:relative;cursor:pointer;border-left-width:.3125rem;border-left-color:transparent;border-left-style:solid}.summary-group .entity-item:hover{background-color:#2196f31a;border-left-width:.3125rem;border-left-color:var(--primaryColor)}.summary-group .entity-item[hidden]{display:none}.summary-group .entity-item.no-results{font-weight:400}.summary-group .entity-item.no-results:hover{background-color:transparent;border-left-color:transparent;cursor:default}.summary-groups-container{overflow:auto;height:100%;width:100%;max-width:18.75rem;display:flex;position:relative;flex-direction:column}.summary-group-title{margin-left:0;color:var(--primaryColor);font-weight:700;font-size:.9375rem;filter:brightness(65%);text-transform:uppercase}.exec-operations-group{padding:0}.confirm-buttons-container{display:flex;justify-content:space-between;align-items:center;flex-direction:row;width:100%;padding-top:var(--paddingMedium);margin-left:auto}.confirm-buttons-container .linkButton{position:absolute;left:1.5625rem;color:var(--subText);font-weight:600}.confirm-buttons-container .button{text-align:center;line-height:normal}button{width:6.25rem;height:2.5rem;color:var(--white);display:flex;align-items:center;justify-content:center}button.confirm{background-color:var(--secondary)}button.cancel{background-color:var(--primary)}.spinner{right:1em;top:1em;display:inline-block;width:1rem;height:1rem;border-radius:50%;background:transparent;border-top:.125rem solid var(--placeholder);border-right:.125rem solid var(--placeholder);border-bottom:.125rem solid transparent;border-left:.125rem solid transparent;animation:loading .5s infinite linear}.config-check,.success-check{width:1.0625rem;height:1.0625rem;cursor:pointer;background-color:var(--navigation);margin:0;margin-top:.25rem}.config-check:checked,.success-check:checked{background-color:var(--green)!important;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAYCAYAAAD+vg1LAAABdElEQVRIia3UPWsUURSH8f9GRRvtFKtIgoKggo2CYO0XsLKzsbARbNKJYGPndxEEO8VGRRvBF6xFBAkplPiyb/lZzAx7d9jE3ewcmOLOPTyc85x7bw/pKI4keZ7kUpIHQVffIwxU0e91VPHlJK+T9Or19y7Ah5N8TLJeg3eSXO9CwcNCwQCPkWWhFzE2iZ84viz4ED4X4DFuNPvLgO8XCoZ4Wu7vF3oeo0LBL5xcFnwA7wsFI9xs5+0HvFG33ih4NitvUejZAgp/sLoseAVvC7dD3NotfxHw3ZaCl+jtBT6qOn+n94CuoV8o+Fv/27WQ4E3dXh9XZyT18Kql4M7/OozJsdnBb1xoJd0uFIxqzyvzgJ+Y3KAxtrBeJ6yqJt/EEGfmmUlwDB9aVX3FCbwwPbCNeaANOKoX6UvL41axHuOd6tYtBA5OYdP0a9XECOfmhbbBUT0u26pBNjHAvUWgs8DBFdPD/ISDXYCDa/iBb3UXC0GRf9rA4qSLGyBIAAAAAElFTkSuQmCC);background-size:45%;background-position:center center;background-repeat:no-repeat;border:none}.config-check:checked:disabled,.success-check:checked:disabled{opacity:1!important}.success-check{border-radius:100%;top:.8125rem;left:.625rem;transition:var(--transition);border:.125rem var(--offWhite) solid}.config-check{border-radius:0}.config-check:checked{background-size:.625rem}.icon-clear{color:var(--red);margin-top:.25rem}.retry{background-image:url(/assets/svgs/refresh.svg);background-size:1.125rem;background-repeat:no-repeat;height:1.125rem;width:1.125rem;margin-left:.3125rem}.copy-links-container{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:var(--gapMedium)}.copy-links-container .copy-links-title{display:flex;flex-direction:column;align-items:center;justify-content:center;max-width:23.4375rem}.copy-links-container .copy-links-title .title-container{display:flex}.copy-links-container .copy-links-title .title{font-size:1.25rem;line-height:1.25rem}.copy-links-container .copy-links-title .subtitle{display:flex;align-items:center;justify-content:center;text-align:center;color:var(--red)}.copy-links-container .copy-links-title .copy-icon{background-image:url(/assets/svgs/copy.svg);background-size:1.125rem;background-repeat:no-repeat;height:1.25rem;width:1.25rem;margin-left:.4375rem}.copy-links-container .copy-links{display:flex;flex-direction:row;justify-content:space-around;align-items:center;padding:var(--paddingMedium);width:100%}.copy-links-container .copy-links .link-button{color:var(--subText);font-size:1rem;font-weight:600;cursor:pointer}.copy-links-container .copy-links .link-button:hover{text-decoration:underline}.visibility-config-container{display:flex;flex-direction:row;align-items:center;width:100%;justify-content:flex-start;gap:.3125rem;margin-top:var(--marginMedium)}::ng-deep .creation-summary-dialog-container .form-field-content{gap:0!important}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }] }); }
|
|
18108
18441
|
}
|
|
18109
18442
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CreationSummaryDialogComponent, decorators: [{
|
|
18110
18443
|
type: Component,
|
|
18111
|
-
args: [{ selector: 'lib-creation-summary-dialog', template: "<div class=\"creation-summary-dialog-container\">\n <div class=\"close icon-close\" (click)=\"close()\"></div>\n <div class=\"title-row\">\n <span class=\"title\">Execution Summary</span>\n <span class=\"subtitle\">The following entities were created for this service</span>\n </div>\n <lib-form-field-container [showHeader]=\"false\">\n <div class=\"copy-links-container\">\n <span class=\"copy-links-title\">\n <span class=\"title\">Entities</span>\n <span class=\"subtitle\" *ngIf=\"hasCreationError\">One or more of the following resources failed to create. See below for more details and/or retry.</span>\n </span>\n </div>\n <div class=\"form-group-row exec-operations-group\">\n <div class=\"summary-groups-container\">\n <div class=\"summary-group\" *ngFor=\"let group of summaryData\">\n <div class=\"summary-group-title\">{{group.title}}</div>\n <ul>\n <li\n
|
|
18444
|
+
args: [{ selector: 'lib-creation-summary-dialog', template: "<div class=\"creation-summary-dialog-container\">\n <div class=\"close icon-close\" (click)=\"close()\"></div>\n <div class=\"title-row\">\n <span class=\"title\">Execution Summary</span>\n <span class=\"subtitle\">The following entities were {{isEdit ? 'updated' : 'created'}} for this service</span>\n </div>\n <lib-form-field-container [showHeader]=\"false\">\n <div class=\"copy-links-container\">\n <span class=\"copy-links-title\">\n <span class=\"title\">Entities</span>\n <span class=\"subtitle\" *ngIf=\"hasCreationError\">One or more of the following resources failed to create. See below for more details and/or retry.</span>\n </span>\n </div>\n <div class=\"form-group-row exec-operations-group\">\n <div class=\"summary-groups-container\">\n <div class=\"summary-group\" *ngFor=\"let group of summaryData\">\n <div class=\"summary-group-title\">{{group.title}}</div>\n <ul>\n <li\n *ngFor=\"let entity of group.entities\"\n (click)=\"selectZitiEntity(entity.name, 'all')\"\n [ngClass]=\"{selected: selectedEntityType === 'all'}\"\n class=\"entity-item drop-target-svc\"\n >\n <span class=\"spinner\" *ngIf=\"entity.status === 'loading'\"></span>\n <input type=\"checkbox\" [disabled]=\"true\" [checked]=\"true\" class=\"success-check\" *ngIf=\"entity.status === 'done'\">\n <div class=\"retry\" *ngIf=\"entity.status === 'error'\" (click)=\"doRetry(entity)\"></div>\n <div class=\"icon-clear\" *ngIf=\"entity.status === 'error'\"></div>\n <span class=\"entity-name\" matTooltipShowDelay=\"1000\">\n {{ entity.name.length > 0 ? entity.name : 'SimpleService' }}\n </span>\n </li>\n </ul>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container [showHeader]=\"false\" style=\"margin-top: 10px;\">\n <div class=\"copy-links-container\">\n <div class=\"copy-links-title\">\n <div class=\"title-container\">\n <span class=\"title\">Copy Links</span>\n <div class=\"copy-icon\"></div>\n </div>\n </div>\n <div class=\"copy-links\">\n <div class=\"link-button\" (click)=\"copyCliCommands()\">CLI Commands</div>\n <div class=\"link-button\" (click)=\"copyAPIRequests()\">API Requests</div>\n </div>\n </div>\n </lib-form-field-container>\n\n <div class=\"confirm-buttons-container\">\n <button class=\"button save alert\" (click)=\"done()\">Done</button>\n <button class=\"button save cancel\" (click)=\"confirm()\" *ngIf=\"!isEdit\">Create another</button>\n </div>\n</div>\n", styles: [".creation-summary-dialog-container{background-color:var(--formBackground);min-width:29.6875rem;border-radius:var(--modalBorderRadius);padding:var(--paddingXXL)}.creation-summary-dialog-container .title-row{display:flex;align-items:center;flex-direction:column;margin-bottom:var(--marginLarge)}.creation-summary-dialog-container .subtitle{color:var(--text)}.creation-summary-dialog-container .close{font-size:1.5625rem;top:.9375rem;right:.9375rem;width:2.1875rem;font-weight:600}.resource-type-container{display:flex;flex-direction:column;padding-left:var(--paddingLarge);padding-right:var(--paddingLarge)}.resource-type-container.disabled{opacity:.5}.resource-type-container.disabled select{cursor:not-allowed}.resource-type-container .resource-type-content{margin-top:1.25rem;flex-wrap:wrap}.entity-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:-moz-fit-content;width:fit-content}.summary-group ul{padding-inline-start:0rem;margin-block-start:var(--marginSmall);max-height:40.625rem;overflow:auto;overflow-x:hidden}.summary-group .entity-item{display:flex;align-items:center;gap:.3125rem;font-weight:600;font-size:1rem;padding-top:.1875rem;padding-bottom:.1875rem;position:relative;cursor:pointer;border-left-width:.3125rem;border-left-color:transparent;border-left-style:solid}.summary-group .entity-item:hover{background-color:#2196f31a;border-left-width:.3125rem;border-left-color:var(--primaryColor)}.summary-group .entity-item[hidden]{display:none}.summary-group .entity-item.no-results{font-weight:400}.summary-group .entity-item.no-results:hover{background-color:transparent;border-left-color:transparent;cursor:default}.summary-groups-container{overflow:auto;height:100%;width:100%;max-width:18.75rem;display:flex;position:relative;flex-direction:column}.summary-group-title{margin-left:0;color:var(--primaryColor);font-weight:700;font-size:.9375rem;filter:brightness(65%);text-transform:uppercase}.exec-operations-group{padding:0}.confirm-buttons-container{display:flex;justify-content:space-between;align-items:center;flex-direction:row;width:100%;padding-top:var(--paddingMedium);margin-left:auto}.confirm-buttons-container .linkButton{position:absolute;left:1.5625rem;color:var(--subText);font-weight:600}.confirm-buttons-container .button{text-align:center;line-height:normal}button{width:6.25rem;height:2.5rem;color:var(--white);display:flex;align-items:center;justify-content:center}button.confirm{background-color:var(--secondary)}button.cancel{background-color:var(--primary)}.spinner{right:1em;top:1em;display:inline-block;width:1rem;height:1rem;border-radius:50%;background:transparent;border-top:.125rem solid var(--placeholder);border-right:.125rem solid var(--placeholder);border-bottom:.125rem solid transparent;border-left:.125rem solid transparent;animation:loading .5s infinite linear}.config-check,.success-check{width:1.0625rem;height:1.0625rem;cursor:pointer;background-color:var(--navigation);margin:0;margin-top:.25rem}.config-check:checked,.success-check:checked{background-color:var(--green)!important;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAYCAYAAAD+vg1LAAABdElEQVRIia3UPWsUURSH8f9GRRvtFKtIgoKggo2CYO0XsLKzsbARbNKJYGPndxEEO8VGRRvBF6xFBAkplPiyb/lZzAx7d9jE3ewcmOLOPTyc85x7bw/pKI4keZ7kUpIHQVffIwxU0e91VPHlJK+T9Or19y7Ah5N8TLJeg3eSXO9CwcNCwQCPkWWhFzE2iZ84viz4ED4X4DFuNPvLgO8XCoZ4Wu7vF3oeo0LBL5xcFnwA7wsFI9xs5+0HvFG33ih4NitvUejZAgp/sLoseAVvC7dD3NotfxHw3ZaCl+jtBT6qOn+n94CuoV8o+Fv/27WQ4E3dXh9XZyT18Kql4M7/OozJsdnBb1xoJd0uFIxqzyvzgJ+Y3KAxtrBeJ6yqJt/EEGfmmUlwDB9aVX3FCbwwPbCNeaANOKoX6UvL41axHuOd6tYtBA5OYdP0a9XECOfmhbbBUT0u26pBNjHAvUWgs8DBFdPD/ISDXYCDa/iBb3UXC0GRf9rA4qSLGyBIAAAAAElFTkSuQmCC);background-size:45%;background-position:center center;background-repeat:no-repeat;border:none}.config-check:checked:disabled,.success-check:checked:disabled{opacity:1!important}.success-check{border-radius:100%;top:.8125rem;left:.625rem;transition:var(--transition);border:.125rem var(--offWhite) solid}.config-check{border-radius:0}.config-check:checked{background-size:.625rem}.icon-clear{color:var(--red);margin-top:.25rem}.retry{background-image:url(/assets/svgs/refresh.svg);background-size:1.125rem;background-repeat:no-repeat;height:1.125rem;width:1.125rem;margin-left:.3125rem}.copy-links-container{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:var(--gapMedium)}.copy-links-container .copy-links-title{display:flex;flex-direction:column;align-items:center;justify-content:center;max-width:23.4375rem}.copy-links-container .copy-links-title .title-container{display:flex}.copy-links-container .copy-links-title .title{font-size:1.25rem;line-height:1.25rem}.copy-links-container .copy-links-title .subtitle{display:flex;align-items:center;justify-content:center;text-align:center;color:var(--red)}.copy-links-container .copy-links-title .copy-icon{background-image:url(/assets/svgs/copy.svg);background-size:1.125rem;background-repeat:no-repeat;height:1.25rem;width:1.25rem;margin-left:.4375rem}.copy-links-container .copy-links{display:flex;flex-direction:row;justify-content:space-around;align-items:center;padding:var(--paddingMedium);width:100%}.copy-links-container .copy-links .link-button{color:var(--subText);font-size:1rem;font-weight:600;cursor:pointer}.copy-links-container .copy-links .link-button:hover{text-decoration:underline}.visibility-config-container{display:flex;flex-direction:row;align-items:center;width:100%;justify-content:flex-start;gap:.3125rem;margin-top:var(--marginMedium)}::ng-deep .creation-summary-dialog-container .form-field-content{gap:0!important}\n"] }]
|
|
18112
18445
|
}], ctorParameters: function () { return [{ type: i5$1.MatDialogRef }, { type: undefined, decorators: [{
|
|
18113
18446
|
type: Inject,
|
|
18114
18447
|
args: [MAT_DIALOG_DATA]
|
|
@@ -18130,6 +18463,7 @@ class SimpleServiceComponent extends ProjectableForm {
|
|
|
18130
18463
|
this.serviceRoleAttributes = [];
|
|
18131
18464
|
this.identityRoleAttributes = [];
|
|
18132
18465
|
this.identityNamedAttributes = [];
|
|
18466
|
+
this.dataInit = false;
|
|
18133
18467
|
this.showForm = true;
|
|
18134
18468
|
this.formView = 'simple';
|
|
18135
18469
|
this.controllerDomain = '';
|
|
@@ -18188,9 +18522,9 @@ class SimpleServiceComponent extends ProjectableForm {
|
|
|
18188
18522
|
this.bindPolicyNamedAttributes = [];
|
|
18189
18523
|
this.bindPolicyRoleAttributes = [];
|
|
18190
18524
|
this.identitiesNameIdMap = {};
|
|
18525
|
+
this.identitiesIdNameMap = {};
|
|
18191
18526
|
this.sdkOnlyDial = false;
|
|
18192
18527
|
this.sdkOnlyBind = false;
|
|
18193
|
-
this.formData = {};
|
|
18194
18528
|
this.interceptIncrement = -1;
|
|
18195
18529
|
this.hostIncrement = -1;
|
|
18196
18530
|
this.serviceIncrement = -1;
|
|
@@ -18201,8 +18535,33 @@ class SimpleServiceComponent extends ProjectableForm {
|
|
|
18201
18535
|
this.hostDataChange = false;
|
|
18202
18536
|
this.dialDataChange = false;
|
|
18203
18537
|
this.bindDataChange = false;
|
|
18538
|
+
this.identitiesInit = new BehaviorSubject(false);
|
|
18539
|
+
this.entitiesInit = false;
|
|
18540
|
+
this.multiActions = [];
|
|
18541
|
+
this.entityType = 'services';
|
|
18204
18542
|
this.close = new EventEmitter();
|
|
18205
18543
|
this.selected = new EventEmitter();
|
|
18544
|
+
this.formData = {};
|
|
18545
|
+
}
|
|
18546
|
+
set formData(data) {
|
|
18547
|
+
if (!data?.configs) {
|
|
18548
|
+
data.configs = [];
|
|
18549
|
+
}
|
|
18550
|
+
this.svc.formData = data;
|
|
18551
|
+
if (!isEmpty(data?.id)) {
|
|
18552
|
+
this.initAssociatedData();
|
|
18553
|
+
if (get(this.formData, 'tags.service-type') === 'simple') {
|
|
18554
|
+
this.multiActions = [
|
|
18555
|
+
{ id: 'convert-to-advanced', label: 'Convert to Advanced', hidden: false }
|
|
18556
|
+
];
|
|
18557
|
+
}
|
|
18558
|
+
else {
|
|
18559
|
+
this.multiActions = [];
|
|
18560
|
+
}
|
|
18561
|
+
}
|
|
18562
|
+
}
|
|
18563
|
+
get formData() {
|
|
18564
|
+
return this.svc?.formData;
|
|
18206
18565
|
}
|
|
18207
18566
|
ngOnInit() {
|
|
18208
18567
|
super.ngOnInit();
|
|
@@ -18244,6 +18603,74 @@ class SimpleServiceComponent extends ProjectableForm {
|
|
|
18244
18603
|
this.identityRoleAttributes = result.data;
|
|
18245
18604
|
});
|
|
18246
18605
|
}
|
|
18606
|
+
initAssociatedData() {
|
|
18607
|
+
if (this.entitiesInit) {
|
|
18608
|
+
return;
|
|
18609
|
+
}
|
|
18610
|
+
this.entitiesInit = true;
|
|
18611
|
+
this.serviceApiData = this.svc.formData;
|
|
18612
|
+
this.identitiesInit.subscribe((val) => {
|
|
18613
|
+
if (val === true) {
|
|
18614
|
+
const configsPromise = this.getAssociatedConfigs();
|
|
18615
|
+
const policiesPromise = this.getAssocaitedPolicies();
|
|
18616
|
+
Promise.all([configsPromise, policiesPromise]).finally(() => {
|
|
18617
|
+
this.dataInit = true;
|
|
18618
|
+
});
|
|
18619
|
+
}
|
|
18620
|
+
});
|
|
18621
|
+
}
|
|
18622
|
+
getAssociatedConfigs() {
|
|
18623
|
+
return this.zitiService.getSubdata('services', this.formData.id, 'configs').then((result) => {
|
|
18624
|
+
const associatedConfigs = result.data;
|
|
18625
|
+
associatedConfigs.forEach((config) => {
|
|
18626
|
+
if (config.configTypeId == this.initInterceptConfigApiData.configTypeId) {
|
|
18627
|
+
this.interceptConfigApiData = config;
|
|
18628
|
+
const portRange = this.interceptConfigApiData.data.portRanges[0];
|
|
18629
|
+
this.interceptPort = portRange?.high;
|
|
18630
|
+
}
|
|
18631
|
+
else if (config.configTypeId == this.initHostConfigApiData.configTypeId) {
|
|
18632
|
+
this.hostConfigApiData = config;
|
|
18633
|
+
}
|
|
18634
|
+
});
|
|
18635
|
+
});
|
|
18636
|
+
}
|
|
18637
|
+
getAssocaitedPolicies() {
|
|
18638
|
+
return this.zitiService.getSubdata('services', this.formData.id, 'service-policies').then((result) => {
|
|
18639
|
+
const associatedServicePolicies = result.data;
|
|
18640
|
+
associatedServicePolicies.forEach((policy) => {
|
|
18641
|
+
if (policy.type?.toLowerCase() == 'dial') {
|
|
18642
|
+
this.dialPolicyApiData = policy;
|
|
18643
|
+
const roleAttributes = [];
|
|
18644
|
+
const namedAttributes = [];
|
|
18645
|
+
policy.identityRoles.forEach((attr) => {
|
|
18646
|
+
if (attr.charAt(0) === '#') {
|
|
18647
|
+
roleAttributes.push(attr.slice(1));
|
|
18648
|
+
}
|
|
18649
|
+
else if (attr.charAt(0) === '@') {
|
|
18650
|
+
namedAttributes.push(this.identitiesIdNameMap[attr.slice(1)]);
|
|
18651
|
+
}
|
|
18652
|
+
});
|
|
18653
|
+
this.dialPolicyRoleAttributes = roleAttributes;
|
|
18654
|
+
this.dialPolicyNamedAttributes = namedAttributes;
|
|
18655
|
+
}
|
|
18656
|
+
else if (policy.type?.toLowerCase() == 'bind') {
|
|
18657
|
+
const roleAttributes = [];
|
|
18658
|
+
const namedAttributes = [];
|
|
18659
|
+
policy.identityRoles.forEach((attr) => {
|
|
18660
|
+
if (attr.charAt(0) === '#') {
|
|
18661
|
+
roleAttributes.push(attr.slice(1));
|
|
18662
|
+
}
|
|
18663
|
+
else if (attr.charAt(0) === '@') {
|
|
18664
|
+
namedAttributes.push(this.identitiesIdNameMap[attr.slice(1)]);
|
|
18665
|
+
}
|
|
18666
|
+
});
|
|
18667
|
+
this.bindPolicyRoleAttributes = roleAttributes;
|
|
18668
|
+
this.bindPolicyNamedAttributes = namedAttributes;
|
|
18669
|
+
this.bindPolicyApiData = policy;
|
|
18670
|
+
}
|
|
18671
|
+
});
|
|
18672
|
+
});
|
|
18673
|
+
}
|
|
18247
18674
|
getIdentityNamedAttributes(filter) {
|
|
18248
18675
|
const paging = {
|
|
18249
18676
|
searchOn: 'name',
|
|
@@ -18266,18 +18693,35 @@ class SimpleServiceComponent extends ProjectableForm {
|
|
|
18266
18693
|
this.zitiService.get('identities', paging, filters).then((result) => {
|
|
18267
18694
|
const namedAttributes = result.data.map((identity) => {
|
|
18268
18695
|
this.identitiesNameIdMap[identity.name] = identity.id;
|
|
18696
|
+
this.identitiesIdNameMap[identity.id] = identity.name;
|
|
18697
|
+
this.identitiesInit.next(true);
|
|
18269
18698
|
return identity.name;
|
|
18270
18699
|
});
|
|
18271
18700
|
this.identityNamedAttributes = namedAttributes;
|
|
18272
18701
|
});
|
|
18273
18702
|
}
|
|
18703
|
+
multiActionRequested(action) {
|
|
18704
|
+
switch (action.id) {
|
|
18705
|
+
case 'save':
|
|
18706
|
+
this.save();
|
|
18707
|
+
break;
|
|
18708
|
+
case 'convert-to-advanced':
|
|
18709
|
+
this.convertToAdvanced();
|
|
18710
|
+
break;
|
|
18711
|
+
}
|
|
18712
|
+
}
|
|
18274
18713
|
headerActionRequested(action) {
|
|
18275
18714
|
switch (action.name) {
|
|
18276
18715
|
case 'save':
|
|
18277
18716
|
this.save();
|
|
18278
18717
|
break;
|
|
18279
18718
|
case 'close':
|
|
18280
|
-
this.
|
|
18719
|
+
if (this.isEdit) {
|
|
18720
|
+
this.router?.navigateByUrl(URLS.ZITI_SERVICES);
|
|
18721
|
+
}
|
|
18722
|
+
else {
|
|
18723
|
+
this.router?.navigateByUrl(URLS.ZITI_SERVICE_SELECT);
|
|
18724
|
+
}
|
|
18281
18725
|
break;
|
|
18282
18726
|
case 'toggle-view':
|
|
18283
18727
|
this.formView = action.data;
|
|
@@ -18321,19 +18765,20 @@ class SimpleServiceComponent extends ProjectableForm {
|
|
|
18321
18765
|
if (!this.validate()) {
|
|
18322
18766
|
return;
|
|
18323
18767
|
}
|
|
18324
|
-
const
|
|
18325
|
-
if (
|
|
18326
|
-
|
|
18768
|
+
const isNewService = isEmpty(this.serviceApiData?.id);
|
|
18769
|
+
if (isNewService) {
|
|
18770
|
+
const hasConflicts = await this.checkNameConflicts();
|
|
18771
|
+
if (hasConflicts) {
|
|
18772
|
+
return;
|
|
18773
|
+
}
|
|
18327
18774
|
}
|
|
18328
18775
|
const summaryData = this.showSummary();
|
|
18329
18776
|
this.serviceApiData.configs = [];
|
|
18330
|
-
await this.
|
|
18331
|
-
await this.
|
|
18332
|
-
await this.
|
|
18333
|
-
await this.
|
|
18334
|
-
await this.
|
|
18335
|
-
const growlerData = new GrowlerModel('success', 'Success', `Simple Service ${this.serviceApiData.name} Created`, `Successfully created entities for simple service ${this.serviceApiData.name}`);
|
|
18336
|
-
this.growlerService.show(growlerData);
|
|
18777
|
+
const interceptCfgPromise = await this.saveInterceptConfig(summaryData);
|
|
18778
|
+
const hostCfgPromise = await this.saveHostConfig(summaryData);
|
|
18779
|
+
const servicePromise = await this.saveService(summaryData);
|
|
18780
|
+
const dialPolicyPromise = await this.savePolicy(summaryData, 'Dial');
|
|
18781
|
+
const bindPolicyPromise = await this.savePolicy(summaryData, 'Bind');
|
|
18337
18782
|
summaryData?.forEach((entityType) => {
|
|
18338
18783
|
entityType.entities?.forEach((entity) => {
|
|
18339
18784
|
if (entity.type === 'services') {
|
|
@@ -18369,7 +18814,7 @@ class SimpleServiceComponent extends ProjectableForm {
|
|
|
18369
18814
|
apiRequest: '',
|
|
18370
18815
|
apiUrl: this.interceptConfigApiUrl,
|
|
18371
18816
|
status: 'loading',
|
|
18372
|
-
retry: this.
|
|
18817
|
+
retry: this.saveInterceptConfig.bind(this),
|
|
18373
18818
|
};
|
|
18374
18819
|
const hostSummary = {
|
|
18375
18820
|
name: this.hostConfigApiData.name,
|
|
@@ -18380,7 +18825,7 @@ class SimpleServiceComponent extends ProjectableForm {
|
|
|
18380
18825
|
apiRequest: '',
|
|
18381
18826
|
apiUrl: this.hostConfigApiUrl,
|
|
18382
18827
|
status: 'loading',
|
|
18383
|
-
retry: this.
|
|
18828
|
+
retry: this.saveHostConfig.bind(this)
|
|
18384
18829
|
};
|
|
18385
18830
|
const summaryData = [
|
|
18386
18831
|
{
|
|
@@ -18394,7 +18839,7 @@ class SimpleServiceComponent extends ProjectableForm {
|
|
|
18394
18839
|
apiRequest: '',
|
|
18395
18840
|
apiUrl: this.serviceApiUrl,
|
|
18396
18841
|
status: 'loading',
|
|
18397
|
-
retry: this.
|
|
18842
|
+
retry: this.saveService.bind(this)
|
|
18398
18843
|
}
|
|
18399
18844
|
]
|
|
18400
18845
|
},
|
|
@@ -18410,7 +18855,7 @@ class SimpleServiceComponent extends ProjectableForm {
|
|
|
18410
18855
|
apiRequest: '',
|
|
18411
18856
|
apiUrl: this.dialPolicyApiUrl,
|
|
18412
18857
|
status: 'loading',
|
|
18413
|
-
retry: (summaryData) => { this.
|
|
18858
|
+
retry: (summaryData) => { this.savePolicy(summaryData, 'Dial'); }
|
|
18414
18859
|
},
|
|
18415
18860
|
{
|
|
18416
18861
|
name: this.bindPolicyApiData.name,
|
|
@@ -18421,7 +18866,7 @@ class SimpleServiceComponent extends ProjectableForm {
|
|
|
18421
18866
|
apiRequest: '',
|
|
18422
18867
|
apiUrl: this.bindPolicyApiUrl,
|
|
18423
18868
|
status: 'loading',
|
|
18424
|
-
retry: (summaryData) => { this.
|
|
18869
|
+
retry: (summaryData) => { this.savePolicy(summaryData, 'Bind'); }
|
|
18425
18870
|
}
|
|
18426
18871
|
]
|
|
18427
18872
|
}
|
|
@@ -18445,7 +18890,8 @@ class SimpleServiceComponent extends ProjectableForm {
|
|
|
18445
18890
|
});
|
|
18446
18891
|
}
|
|
18447
18892
|
const data = {
|
|
18448
|
-
summaryData: summaryData
|
|
18893
|
+
summaryData: summaryData,
|
|
18894
|
+
isEdit: this.isEdit
|
|
18449
18895
|
};
|
|
18450
18896
|
this.dialogRef = this.dialogForm.open(CreationSummaryDialogComponent, {
|
|
18451
18897
|
data: data,
|
|
@@ -18548,81 +18994,103 @@ class SimpleServiceComponent extends ProjectableForm {
|
|
|
18548
18994
|
this.nameFieldInput.nativeElement.focus();
|
|
18549
18995
|
});
|
|
18550
18996
|
}
|
|
18551
|
-
async
|
|
18552
|
-
|
|
18997
|
+
async saveInterceptConfig(summaryData) {
|
|
18998
|
+
const isNewConfig = isEmpty(this.interceptConfigApiData?.id);
|
|
18999
|
+
// Conditional Deletion (Identical Logic)
|
|
19000
|
+
if (this.sdkOnlyDial && !isNewConfig) {
|
|
19001
|
+
return this.zitiService.delete('configs', this.interceptConfigApiData.id);
|
|
19002
|
+
}
|
|
19003
|
+
else if (this.sdkOnlyDial && isNewConfig) {
|
|
18553
19004
|
return;
|
|
18554
19005
|
}
|
|
18555
|
-
|
|
18556
|
-
this.interceptIncrement
|
|
18557
|
-
|
|
18558
|
-
|
|
18559
|
-
|
|
19006
|
+
// Use the Helper Function
|
|
19007
|
+
const { status } = await this.saveConfig(this.interceptConfigApiData, 'interceptIncrement', 'interceptConfigId', 'interceptConfigCliCommand');
|
|
19008
|
+
// Apply final status logic
|
|
19009
|
+
summaryData[0].entities[0].status = status;
|
|
19010
|
+
}
|
|
19011
|
+
async saveHostConfig(summaryData) {
|
|
19012
|
+
const isNewConfig = isEmpty(this.hostConfigApiData?.id);
|
|
19013
|
+
// Conditional Deletion (Identical Logic)
|
|
19014
|
+
if (this.sdkOnlyDial && !isNewConfig) {
|
|
19015
|
+
return this.zitiService.delete('configs', this.hostConfigApiData.id);
|
|
18560
19016
|
}
|
|
18561
|
-
|
|
18562
|
-
|
|
18563
|
-
|
|
18564
|
-
|
|
18565
|
-
|
|
18566
|
-
|
|
19017
|
+
else if (this.sdkOnlyDial && isNewConfig) {
|
|
19018
|
+
return;
|
|
19019
|
+
}
|
|
19020
|
+
// Use the Helper Function
|
|
19021
|
+
const { status, configApiData } = await this.saveConfig(this.hostConfigApiData, 'hostIncrement', 'hostConfigId', 'hostConfigCliCommand');
|
|
19022
|
+
// Apply final status logic (slightly different than intercept)
|
|
19023
|
+
if (this.sdkOnlyDial) {
|
|
19024
|
+
summaryData[0].entities[0].status = status;
|
|
19025
|
+
summaryData[0].entities[0].apiData = configApiData;
|
|
18567
19026
|
}
|
|
18568
19027
|
else {
|
|
18569
|
-
|
|
18570
|
-
|
|
18571
|
-
this.interceptConfigCliCommand = `ziti edge create config '${this.interceptConfigApiData.name}' '${this.interceptConfigApiData.configTypeId}' '${JSON.stringify(this.interceptConfigApiData.data)}'`;
|
|
18572
|
-
status = 'done';
|
|
18573
|
-
this.interceptIncrement = -1;
|
|
19028
|
+
summaryData[0].entities[1].status = status;
|
|
19029
|
+
summaryData[0].entities[0].apiData = configApiData;
|
|
18574
19030
|
}
|
|
18575
|
-
summaryData[0].entities[0].status = status;
|
|
18576
19031
|
}
|
|
18577
|
-
async
|
|
18578
|
-
|
|
18579
|
-
|
|
18580
|
-
|
|
19032
|
+
async saveConfig(configApiData, // e.g., this.interceptConfigApiData
|
|
19033
|
+
incrementer, // The name of the incrementer property ('interceptIncrement' or 'hostIncrement')
|
|
19034
|
+
configIdProp, // The name of the ID property ('interceptConfigId' or 'hostConfigId')
|
|
19035
|
+
cliCommandProp // The name of the CLI command property ('interceptConfigCliCommand' or 'hostConfigCliCommand')
|
|
19036
|
+
) {
|
|
19037
|
+
const isNewConfig = isEmpty(configApiData?.id);
|
|
19038
|
+
const incrementValue = this[incrementer]; // Get current increment value
|
|
18581
19039
|
let status;
|
|
18582
|
-
|
|
18583
|
-
|
|
18584
|
-
|
|
18585
|
-
postFix = '
|
|
19040
|
+
let configResult;
|
|
19041
|
+
if (isNewConfig) {
|
|
19042
|
+
this[incrementer] = incrementValue + 1; // Increment for naming
|
|
19043
|
+
let postFix = '';
|
|
19044
|
+
if (this[incrementer] > 0) {
|
|
19045
|
+
postFix = '_' + this[incrementer];
|
|
19046
|
+
}
|
|
19047
|
+
configApiData.name = configApiData.name + postFix;
|
|
19048
|
+
configResult = await this.saveEntity('configs', configApiData).catch((result) => result);
|
|
18586
19049
|
}
|
|
18587
|
-
|
|
18588
|
-
|
|
18589
|
-
|
|
18590
|
-
|
|
18591
|
-
if (hostConfigResult.error) {
|
|
19050
|
+
else {
|
|
19051
|
+
configResult = await this.updateEntity('configs', configApiData).catch((result) => result);
|
|
19052
|
+
}
|
|
19053
|
+
if (configResult.error) {
|
|
18592
19054
|
status = 'error';
|
|
18593
19055
|
}
|
|
18594
19056
|
else {
|
|
18595
|
-
|
|
18596
|
-
this.
|
|
18597
|
-
|
|
19057
|
+
// Set the config ID property dynamically (e.g., this.interceptConfigId)
|
|
19058
|
+
this[configIdProp] = configApiData.id || configResult.id || configResult.data.id;
|
|
19059
|
+
// Add the new config ID to serviceApiData (assuming serviceApiData is accessible via 'this')
|
|
19060
|
+
this.serviceApiData.configs.push(this[configIdProp]);
|
|
19061
|
+
// Set the CLI command dynamically
|
|
19062
|
+
this[cliCommandProp] = `ziti edge create config '${configApiData.name}' '${configApiData.configTypeId}' '${JSON.stringify(configApiData.data)}'`;
|
|
18598
19063
|
status = 'done';
|
|
18599
|
-
this
|
|
19064
|
+
this[incrementer] = -1; // Reset incrementer
|
|
18600
19065
|
}
|
|
18601
|
-
|
|
18602
|
-
|
|
18603
|
-
|
|
19066
|
+
return { status, configResult, configApiData };
|
|
19067
|
+
}
|
|
19068
|
+
async saveService(summaryData) {
|
|
19069
|
+
const isNewService = isEmpty(this.serviceApiData?.id);
|
|
19070
|
+
let serviceResult;
|
|
19071
|
+
if (isNewService) {
|
|
19072
|
+
this.serviceIncrement++;
|
|
19073
|
+
let postFix = '';
|
|
19074
|
+
if (this.serviceIncrement > 0) {
|
|
19075
|
+
postFix = '_' + this.serviceIncrement;
|
|
19076
|
+
}
|
|
19077
|
+
this.serviceApiData.name = this.serviceApiData.name + postFix;
|
|
19078
|
+
set(this.serviceApiData, 'tags.service-type', 'simple');
|
|
19079
|
+
serviceResult = await this.saveEntity('services', this.serviceApiData).catch((result) => {
|
|
19080
|
+
return result;
|
|
19081
|
+
});
|
|
18604
19082
|
}
|
|
18605
19083
|
else {
|
|
18606
|
-
|
|
18607
|
-
|
|
18608
|
-
|
|
18609
|
-
}
|
|
18610
|
-
async createService(summaryData) {
|
|
18611
|
-
this.serviceIncrement++;
|
|
18612
|
-
let postFix = '';
|
|
18613
|
-
if (this.serviceIncrement > 0) {
|
|
18614
|
-
postFix = '_' + this.serviceIncrement;
|
|
19084
|
+
serviceResult = await this.updateEntity('services', this.serviceApiData).catch((result) => {
|
|
19085
|
+
return result;
|
|
19086
|
+
});
|
|
18615
19087
|
}
|
|
18616
|
-
this.serviceApiData.name = this.serviceApiData.name + postFix;
|
|
18617
|
-
const serviceResult = await this.zitiService.post('services', this.serviceApiData, true).catch((result) => {
|
|
18618
|
-
return result;
|
|
18619
|
-
});
|
|
18620
19088
|
let serviceStatus;
|
|
18621
19089
|
if (serviceResult.error) {
|
|
18622
19090
|
serviceStatus = 'error';
|
|
18623
19091
|
}
|
|
18624
19092
|
else {
|
|
18625
|
-
this.serviceId = serviceResult.id ? serviceResult.id : serviceResult.data.id;
|
|
19093
|
+
this.serviceId = this.serviceApiData.id ? this.serviceApiData.id : (serviceResult.id ? serviceResult.id : serviceResult.data.id);
|
|
18626
19094
|
serviceStatus = 'done';
|
|
18627
19095
|
let cliConfigIds = '';
|
|
18628
19096
|
if (!this.sdkOnlyDial && !this.sdkOnlyBind) {
|
|
@@ -18640,46 +19108,74 @@ class SimpleServiceComponent extends ProjectableForm {
|
|
|
18640
19108
|
const summaryIndex = (this.sdkOnlyDial && this.sdkOnlyBind) ? 0 : 1;
|
|
18641
19109
|
summaryData[summaryIndex].entities[0].status = serviceStatus;
|
|
18642
19110
|
}
|
|
18643
|
-
async
|
|
18644
|
-
|
|
18645
|
-
|
|
18646
|
-
|
|
18647
|
-
|
|
18648
|
-
|
|
18649
|
-
|
|
19111
|
+
async savePolicy(summaryData, type = 'Dial') {
|
|
19112
|
+
const isNewPolicy = isEmpty(this.serviceApiData?.id);
|
|
19113
|
+
let policyApiData, policyResult, roleAttributes, namedAttributes;
|
|
19114
|
+
let cliRoles = '';
|
|
19115
|
+
let status = '';
|
|
19116
|
+
if (isNewPolicy) {
|
|
19117
|
+
if (type === 'Dial') {
|
|
19118
|
+
this.dialIncrement++;
|
|
19119
|
+
let postFix = '';
|
|
19120
|
+
if (this.dialIncrement > 0) {
|
|
19121
|
+
postFix = '_' + this.dialIncrement;
|
|
19122
|
+
}
|
|
19123
|
+
this.dialPolicyApiData.name = this.dialPolicyApiData.name + postFix;
|
|
19124
|
+
policyApiData = this.dialPolicyApiData;
|
|
19125
|
+
roleAttributes = this.dialPolicyRoleAttributes;
|
|
19126
|
+
namedAttributes = this.dialPolicyNamedAttributes;
|
|
18650
19127
|
}
|
|
18651
|
-
|
|
18652
|
-
|
|
18653
|
-
|
|
18654
|
-
|
|
19128
|
+
else {
|
|
19129
|
+
this.bindIncrement++;
|
|
19130
|
+
let postFix = '';
|
|
19131
|
+
if (this.bindIncrement > 0) {
|
|
19132
|
+
postFix = '_' + this.bindIncrement;
|
|
19133
|
+
}
|
|
19134
|
+
this.bindPolicyApiData.name = this.bindPolicyApiData.name + postFix;
|
|
19135
|
+
policyApiData = this.bindPolicyApiData;
|
|
19136
|
+
roleAttributes = this.bindPolicyRoleAttributes;
|
|
19137
|
+
namedAttributes = this.bindPolicyNamedAttributes;
|
|
19138
|
+
}
|
|
19139
|
+
policyApiData.serviceRoles = [`@${this.serviceId}`];
|
|
19140
|
+
policyApiData.identityRoles = namedAttributes.map((name) => {
|
|
19141
|
+
cliRoles += '@' + this.identitiesNameIdMap[name] + ',';
|
|
19142
|
+
return '@' + this.identitiesNameIdMap[name];
|
|
19143
|
+
});
|
|
19144
|
+
policyApiData.identityRoles = [...policyApiData.identityRoles, ...roleAttributes.map((role) => {
|
|
19145
|
+
cliRoles += '#' + role + ',';
|
|
19146
|
+
return '#' + role;
|
|
19147
|
+
})];
|
|
19148
|
+
cliRoles = cliRoles.slice(0, -1);
|
|
19149
|
+
policyResult = await this.saveEntity('service-policies', policyApiData).catch((result) => {
|
|
19150
|
+
return result;
|
|
19151
|
+
});
|
|
18655
19152
|
}
|
|
18656
19153
|
else {
|
|
18657
|
-
|
|
18658
|
-
|
|
18659
|
-
|
|
18660
|
-
|
|
19154
|
+
if (type === 'Dial') {
|
|
19155
|
+
policyApiData = this.dialPolicyApiData;
|
|
19156
|
+
roleAttributes = this.dialPolicyRoleAttributes;
|
|
19157
|
+
namedAttributes = this.dialPolicyNamedAttributes;
|
|
18661
19158
|
}
|
|
18662
|
-
|
|
18663
|
-
|
|
18664
|
-
|
|
18665
|
-
|
|
19159
|
+
else {
|
|
19160
|
+
policyApiData = this.bindPolicyApiData;
|
|
19161
|
+
roleAttributes = this.bindPolicyRoleAttributes;
|
|
19162
|
+
namedAttributes = this.bindPolicyNamedAttributes;
|
|
19163
|
+
}
|
|
19164
|
+
policyApiData.serviceRoles = [`@${this.serviceId}`];
|
|
19165
|
+
policyApiData.identityRoles = namedAttributes.map((name) => {
|
|
19166
|
+
cliRoles += '@' + this.identitiesNameIdMap[name] + ',';
|
|
19167
|
+
return '@' + this.identitiesNameIdMap[name];
|
|
19168
|
+
});
|
|
19169
|
+
policyApiData.identityRoles = [...policyApiData.identityRoles, ...roleAttributes.map((role) => {
|
|
19170
|
+
cliRoles += '#' + role + ',';
|
|
19171
|
+
return '#' + role;
|
|
19172
|
+
})];
|
|
19173
|
+
cliRoles = cliRoles.slice(0, -1);
|
|
19174
|
+
policyResult = await this.updateEntity('service-policies', policyApiData).catch((result) => {
|
|
19175
|
+
return result;
|
|
19176
|
+
});
|
|
18666
19177
|
}
|
|
18667
|
-
|
|
18668
|
-
let cliRoles = '';
|
|
18669
|
-
let status = '';
|
|
18670
|
-
policyApiData.identityRoles = namedAttributes.map((name) => {
|
|
18671
|
-
cliRoles += '@' + this.identitiesNameIdMap[name] + ',';
|
|
18672
|
-
return '@' + this.identitiesNameIdMap[name];
|
|
18673
|
-
});
|
|
18674
|
-
policyApiData.identityRoles = [...policyApiData.identityRoles, ...roleAttributes.map((role) => {
|
|
18675
|
-
cliRoles += '#' + role + ',';
|
|
18676
|
-
return '#' + role;
|
|
18677
|
-
})];
|
|
18678
|
-
cliRoles = cliRoles.slice(0, -1);
|
|
18679
|
-
const dialPolicyResult = await this.zitiService.post('service-policies', policyApiData).catch((result) => {
|
|
18680
|
-
return result;
|
|
18681
|
-
});
|
|
18682
|
-
if (dialPolicyResult.error) {
|
|
19178
|
+
if (policyResult.error) {
|
|
18683
19179
|
status = 'error';
|
|
18684
19180
|
}
|
|
18685
19181
|
else {
|
|
@@ -18702,6 +19198,12 @@ class SimpleServiceComponent extends ProjectableForm {
|
|
|
18702
19198
|
this.bindPolicyCliCommand = cliCommand;
|
|
18703
19199
|
}
|
|
18704
19200
|
}
|
|
19201
|
+
saveEntity(type, data) {
|
|
19202
|
+
return this.zitiService.post(type, data, true);
|
|
19203
|
+
}
|
|
19204
|
+
updateEntity(type, data) {
|
|
19205
|
+
return this.zitiService.patch(type, data, data.id, true);
|
|
19206
|
+
}
|
|
18705
19207
|
validate() {
|
|
18706
19208
|
this.errors = {};
|
|
18707
19209
|
this.validateServiceName();
|
|
@@ -18835,6 +19337,37 @@ class SimpleServiceComponent extends ProjectableForm {
|
|
|
18835
19337
|
this.dialPolicyApiData = this.initDialPolicyApiData;
|
|
18836
19338
|
this.bindPolicyApiData = this.initBindPolicyApiData;
|
|
18837
19339
|
}
|
|
19340
|
+
convertToAdvanced() {
|
|
19341
|
+
const data = {
|
|
19342
|
+
appendId: 'ConvertSimpleService',
|
|
19343
|
+
title: 'Convert Service',
|
|
19344
|
+
message: `Are you sure you would like to convert this simple service to an advanced service? This change cannot be undone.`,
|
|
19345
|
+
bulletList: [],
|
|
19346
|
+
confirmLabel: 'Yes',
|
|
19347
|
+
cancelLabel: 'Oops, no get me out of here',
|
|
19348
|
+
imageUrl: '../../assets/svgs/Growl_Warning.svg',
|
|
19349
|
+
showCancelLink: true
|
|
19350
|
+
};
|
|
19351
|
+
this.dialogRef = this.dialogForm.open(ConfirmComponent, {
|
|
19352
|
+
data: data,
|
|
19353
|
+
autoFocus: false,
|
|
19354
|
+
});
|
|
19355
|
+
this.dialogRef.afterClosed().subscribe((result) => {
|
|
19356
|
+
if (result?.confirmed) {
|
|
19357
|
+
this.serviceApiData.tags['service-type'] = 'advanced';
|
|
19358
|
+
this.updateEntity('services', this.serviceApiData)
|
|
19359
|
+
.then(() => {
|
|
19360
|
+
const growlerData = new GrowlerModel('success', 'Success', `Service Updated`, `Successfully converted ${this.serviceApiData.name} to an advanced service.`);
|
|
19361
|
+
this.growlerService.show(growlerData);
|
|
19362
|
+
this.router.navigate([URLS.ZITI_ADVANCED_SERVICE + '/' + this.serviceApiData.id]);
|
|
19363
|
+
})
|
|
19364
|
+
.catch((result) => {
|
|
19365
|
+
const growlerData = new GrowlerModel('error', 'Error', `Failed to Update Service`, `Unable to convert ${this.serviceApiData.name} to an advanced service.`);
|
|
19366
|
+
this.growlerService.show(growlerData);
|
|
19367
|
+
});
|
|
19368
|
+
}
|
|
19369
|
+
});
|
|
19370
|
+
}
|
|
18838
19371
|
checkDataChange() {
|
|
18839
19372
|
const serviceDataChange = !isEqual(this.initServiceApiData, this.serviceApiData);
|
|
18840
19373
|
const interceptDataChange = !isEqual(this.initInterceptConfigApiData.data, this.interceptConfigApiData.data);
|
|
@@ -18857,11 +19390,11 @@ class SimpleServiceComponent extends ProjectableForm {
|
|
|
18857
19390
|
clear() {
|
|
18858
19391
|
}
|
|
18859
19392
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SimpleServiceComponent, deps: [{ token: SETTINGS_SERVICE }, { token: ServiceFormService }, { token: ZITI_DATA_SERVICE }, { token: GrowlerService }, { token: SERVICE_EXTENSION_SERVICE }, { token: i5$1.MatDialog }, { token: ValidationService }, { token: ServicesPageService }, { token: i4.Router }, { token: i4.ActivatedRoute }, { token: i1$4.Location }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
18860
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SimpleServiceComponent, selector: "lib-simple-service", inputs: { serviceRoleAttributes: "serviceRoleAttributes", identityRoleAttributes: "identityRoleAttributes", identityNamedAttributes: "identityNamedAttributes" }, outputs: { close: "close", selected: "selected" }, usesInheritance: true, ngImport: i0, template: "<div class=\"projectable-form-wrapper simple-service-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(true, false, 'cards', $event)\"\n tabindex=\"0\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"showForm ? 'Create a Simple Service' : 'Service Creation Summary'\"\n [actionButtonText]=\"'Save'\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n ></lib-form-header>\n <div class=\"simple-service-form-container projectable-form-container\">\n <div class=\"form-group-column three-fifths\" *ngIf=\"showForm\">\n <div id=\"InlineServiceArea\" class=\"anyadd\">\n <div class=\"simple-service-inputs\">\n <lib-form-field-container [title]=\"'Service Details'\">\n <div class=\"form-field-input-group service-group\">\n <div class=\"form-field-sub-group\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">Service Name</span>\n </div>\n <input\n class=\"form-field-input\"\n placeholder=\"Name this service\"\n autofocus\n #nameFieldInput\n [ngClass]=\"{error: errors.name}\"\n [(ngModel)]=\"serviceApiData.name\"\n (keyup)=\"serviceNameChanged($event)\"\n (change)=\"validateServiceName()\"\n />\n </div>\n <div class=\"form-field-sub-group\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">SELECT OR CREATE SERVICE ATTRIBUTES</span>\n </div>\n <lib-tag-selector\n [(selectedRoleAttributes)]=\"serviceApiData.roleAttributes\"\n [availableRoleAttributes]=\"serviceRoleAttributes\"\n [placeholder]=\"'Add attributes to group services'\"\n ></lib-tag-selector>\n </div>\n </div>\n </lib-form-field-container>\n </div>\n </div>\n </div>\n <div class=\"simple-service-center-content\" *ngIf=\"showForm\">\n <div class=\"form-group-row\">\n <lib-form-field-container\n [title]=\"'ACCESSING CONFIGURATION'\"\n [contentStyle]=\"'z-index: 10001'\"\n [helpText]=\"'How will client applications use this service? Specify a hostname/IP and port, or use the "SDK Only" toggle for an application embedded configuration.'\"\n >\n <div class=\"form-field-input-group accessing-group\">\n <div class=\"form-field-sub-group\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">What identities can access this service?</span>\n </div>\n <lib-tag-selector\n [(selectedNamedAttributes)]=\"dialPolicyNamedAttributes\"\n [(selectedRoleAttributes)]=\"dialPolicyRoleAttributes\"\n [availableNamedAttributes]=\"identityNamedAttributes\"\n [availableRoleAttributes]=\"identityRoleAttributes\"\n [placeholder]=\"'Select identity attributes to grant access'\"\n [hasError]=\"errors.dialIdentities\"\n (selectedNamedAttributesChange)=\"validateDialIdentities()\"\n (selectedRoleAttributesChange)=\"validateDialIdentities()\"\n (filterChange)=\"getIdentityNamedAttributes($event)\"\n ></lib-tag-selector>\n </div>\n <div class=\"form-field-sub-group\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">How will the service be accessed?</span>\n </div>\n <div class=\"grid addressPort\">\n <div class=\"config-item-container\">\n <span class=\"config-item-label\">SDK ONLY</span>\n <div\n class=\"sdk-toggle form-field-toggle\"\n >\n <div class=\"switchGrid\">\n <div>\n <div\n (click)=\"toggleSdkOnlyDial()\"\n [ngClass]=\"{ on: sdkOnlyDial }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!sdkOnlyDial\" class=\"on-label\">YES</span>\n <span [hidden]=\"sdkOnlyDial\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"config-item-container\" [ngClass]=\"{disabled: sdkOnlyDial}\">\n <div class=\"config-hostname-label\">\n <span class=\"config-item-label\">HOSTNAME / IP</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Accessing hostnames must include a '.'\"\n matTooltipPosition=\"above\"\n ></div>\n <span *ngIf=\"errors.interceptAddressFormat\" class=\"error-label\">Accessing hostnames must include a '.'</span>\n </div>\n <input id=\"HowTo\" type=\"text\" maxlength=\"100\" data-i18n=\"EgHost\" (change)=\"validateInterceptAddress()\" [ngClass]=\"{error: errors.interceptAddress}\" [placeholder]=\"sdkOnlyDial ? '' : 'e.g. myservice.ziti'\" [(ngModel)]=\"sdkOnlyDial ? '' : interceptConfigApiData.data.addresses[0]\">\n </div>\n <div class=\"config-item-container\" [ngClass]=\"{disabled: sdkOnlyDial}\">\n <span class=\"config-item-label\">PORT</span>\n <input id=\"HowToPort\" type=\"number\" maxlength=\"10\" (change)=\"validateInterceptPort()\" [ngClass]=\"{error: errors.interceptPort}\" [placeholder]=\"sdkOnlyDial ? '' : 443\" (keyup)=\"interceptPortChanged($event)\" [(ngModel)]=\"sdkOnlyDial ? '' : interceptPort\">\n </div>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'HOSTING CONFIGURATION'\"\n [contentStyle]=\"'z-index: 10000'\"\n [helpText]=\"'Where should traffic for this service be sent? Specify a protocol, hostname/IP, and port, or use the "SDK Only" toggle for an application embedded configuration.'\"\n\n >\n <div class=\"form-field-input-group hosting-group\">\n <div class=\"form-field-sub-group\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">What identities can host this service?</span>\n </div>\n <lib-tag-selector\n [(selectedNamedAttributes)]=\"bindPolicyNamedAttributes\"\n [(selectedRoleAttributes)]=\"bindPolicyRoleAttributes\"\n [availableNamedAttributes]=\"identityNamedAttributes\"\n [availableRoleAttributes]=\"identityRoleAttributes\"\n [placeholder]=\"'Select identity attributes'\"\n [hasError]=\"errors.bindIdentities\"\n (selectedNamedAttributesChange)=\"validateBindIdentities()\"\n (selectedRoleAttributesChange)=\"validateBindIdentities()\"\n (filterChange)=\"getIdentityNamedAttributes($event)\"\n ></lib-tag-selector>\n </div>\n <div class=\"form-field-sub-group\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">Where should traffic be sent?</span>\n </div>\n <div class=\"grid addressFull\">\n <div class=\"config-item-container\">\n <span class=\"config-item-label\">SDK ONLY</span>\n <div\n class=\"sdk-toggle form-field-toggle\"\n >\n <div class=\"switchGrid\">\n <div>\n <div\n (click)=\"toggleSdkOnlyBind()\"\n [ngClass]=\"{ on: sdkOnlyBind }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!sdkOnlyBind\" class=\"on-label\">YES</span>\n <span [hidden]=\"sdkOnlyBind\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"config-item-container\" [ngClass]=\"{disabled: sdkOnlyBind}\">\n <span class=\"config-item-label\">PROTOCOL</span>\n <select id=\"HostedProtocol\" (change)=\"hostProtocolsChanged($event)\" [(ngModel)]=\"sdkOnlyBind ? '' : hostProtocol\">\n <option value=\"tcp\">TCP</option>\n <option value=\"udp\" >UDP</option>\n <option value=\"both\" >TCP/UDP</option>\n </select>\n </div>\n <div class=\"config-item-container\" [ngClass]=\"{disabled: sdkOnlyBind}\">\n <span class=\"config-item-label\">HOSTNAME / IP</span>\n <input id=\"HostedHost\" type=\"text\" maxlength=\"100\" data-i18n=\"EgHost\" (change)=\"validateHostAddress()\" [ngClass]=\"{error: errors.hostAddress}\" [placeholder]=\"sdkOnlyBind ? '' : 'e.g. myservice.ziti'\" [(ngModel)]=\"sdkOnlyBind ? '' : hostConfigApiData.data.address\">\n </div>\n <div class=\"config-item-container\" [ngClass]=\"{disabled: sdkOnlyBind}\">\n <span class=\"config-item-label\">PORT</span>\n <input id=\"HostedPort\" type=\"number\" maxlength=\"10\" (change)=\"validateHostPort()\" [ngClass]=\"{error: errors.hostPort}\" [placeholder]=\"sdkOnlyBind ? '' : 443\" [(ngModel)]=\"sdkOnlyBind ? '' : hostConfigApiData.data.port\">\n </div>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n </div>\n </div>\n </div>\n</div>", styles: [".ziti-entity-header-container{display:flex;flex-direction:row;justify-content:space-between;align-items:center}.simple-service-wrapper .simple-service-form-container .form-group-column{height:-moz-fit-content;height:fit-content;max-width:40.625rem;width:100%;transition:var(--transition);flex-grow:0;padding-bottom:0}.simple-service-wrapper .simple-service-form-container .simple-service-center-content lib-form-field-container{min-width:23.4375rem}.simple-service-wrapper .simple-service-form-container .simple-service-center-content .form-field-input-group{display:flex;flex-direction:column;gap:.9375rem}.simple-service-wrapper .grid.addressFull{grid-template-columns:4.375rem 5.9375rem auto 4.0625rem}.simple-service-wrapper .grid.addressPort{grid-template-columns:4.375rem auto 4.0625rem}.simple-service-wrapper input:disabled{opacity:.5!important}.simple-service-wrapper .addressPort .config-item-container.disabled,.simple-service-wrapper .addressFull .config-item-container.disabled{opacity:.3;pointer-events:none}.simple-service-wrapper .addressPort .config-item-container .sdk-toggle,.simple-service-wrapper .addressFull .config-item-container .sdk-toggle{color:var(--white);display:flex;justify-content:space-between;height:var(--defaultInputHeight);align-items:center;margin-bottom:0}.simple-service-wrapper .addressPort .config-item-container .sdk-toggle .label,.simple-service-wrapper .addressFull .config-item-container .sdk-toggle .label{display:flex;font-size:.875rem;font-weight:600;text-transform:uppercase}.simple-service-wrapper .addressPort .config-item-container .sdk-toggle .toggle,.simple-service-wrapper .addressFull .config-item-container .sdk-toggle .toggle{margin:0;display:flex;align-items:center;width:3.75rem;height:1.75rem;font-size:.875rem;line-height:1.5625rem;font-weight:800;font-family:Open Sans,Arial,sans-serif;background-color:var(--icon);color:var(--white);text-align:center;cursor:pointer;position:relative;float:left;border-radius:.8125rem}.simple-service-wrapper .addressPort .config-item-container .sdk-toggle .toggle.on,.simple-service-wrapper .addressFull .config-item-container .sdk-toggle .toggle.on{background-color:var(--green)}.simple-service-wrapper .addressPort .config-item-container .sdk-toggle .toggle .switch,.simple-service-wrapper .addressFull .config-item-container .sdk-toggle .toggle .switch{width:1.25rem;height:1.25rem;border-radius:.625rem;background-color:var(--white);transition:var(--transition);position:absolute;top:.25rem;z-index:10}.simple-service-wrapper .addressPort .config-item-container .sdk-toggle .toggle .switch.on,.simple-service-wrapper .addressFull .config-item-container .sdk-toggle .toggle .switch.on{left:2.1875rem}.simple-service-wrapper .addressPort .config-item-container .sdk-toggle .toggle .on-label,.simple-service-wrapper .addressFull .config-item-container .sdk-toggle .toggle .on-label{margin-left:.4375rem}.simple-service-wrapper .addressPort .config-item-container .sdk-toggle .toggle .off-label,.simple-service-wrapper .addressFull .config-item-container .sdk-toggle .toggle .off-label{margin-left:2rem}.simple-service-wrapper .addressPort .config-item-container .config-hostname-label,.simple-service-wrapper .addressFull .config-item-container .config-hostname-label{display:flex;flex-direction:row;justify-content:flex-start;white-space:nowrap}.simple-service-wrapper .addressPort .config-item-container .config-hostname-label .form-field-info,.simple-service-wrapper .addressFull .config-item-container .config-hostname-label .form-field-info{margin-top:.0625rem}.simple-service-wrapper .addressPort .config-item-container .config-hostname-label .error-label,.simple-service-wrapper .addressFull .config-item-container .config-hostname-label .error-label{margin-left:.3125rem}.simple-service-wrapper .form-field-input-group.service-group{gap:.625rem;display:flex;flex-direction:column}.simple-service-wrapper .form-field-input-group.accessing-group{gap:.9375rem;display:flex;flex-direction:column}.simple-service-wrapper .form-field-input-group .form-field-sub-group{display:flex;flex-direction:column;gap:.3125rem}.simple-service-wrapper .form-field-input-group .form-field-sub-group .config-title-row{height:.875rem}.simple-service-wrapper .form-field-input-group .form-field-sub-group .addressFull,.simple-service-wrapper .form-field-input-group .form-field-sub-group .addressPort{gap:.625rem}.simple-service-wrapper .form-field-input-group .form-field-sub-group .addressFull select{height:var(--defaultInputHeight)}.simple-service-wrapper .simple-service-center-content{display:flex;flex-direction:column;width:100%;align-items:center;justify-content:center}.simple-service-wrapper .simple-service-center-content .form-group-row{flex-wrap:wrap;gap:.9375rem;max-width:40.625rem;justify-content:center;padding:0}.config-item-label{color:#a9abaf;font-weight:600;margin-bottom:.3125rem;position:relative;display:flex}.simple-service-inputs{display:flex;flex-direction:column;gap:.9375rem}.form-field-input-group .form-field-title{color:var(--offWhite);margin-bottom:.625rem}.config-item .config-container.encryption-pod{background-color:#222f3e;background-image:linear-gradient(90deg,#232f3e,#f6f7fb);background-image:-ms-linear-gradient(90deg,rgb(35,47,62) 0%,rgb(246,247,251) 100%);border-radius:var(--inputBorderRadius)}.config-item .config-container .config-container-label{color:#fff}::ng-deep .simple-service-wrapper input{max-height:var(--defaultInputHeight);min-height:0rem;height:var(--defaultInputHeight)}::ng-deep .simple-service-wrapper .select2-search__field{height:100%;min-height:2.5rem;max-height:2.5rem}::ng-deep .simple-service-wrapper .select2-selection__rendered{padding:0;max-height:7.1875rem!important;overflow:auto}::ng-deep .simple-service-wrapper .form-header-container{align-items:center}::ng-deep .simple-service-wrapper .form-header-container .form-header-group{width:40.625rem!important}::ng-deep .simple-service-wrapper .form-header-container .header-actions-container{min-width:0rem}::ng-deep .simple-service-wrapper .form-header-container .form-header-toggle-container{display:none}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.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: i5.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i5.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: FormHeaderComponent, selector: "lib-form-header", inputs: ["data", "badges", "title", "moreActions", "formView", "saveDisabled", "saveTooltip", "actionButtonText", "moreActionsText", "showHeaderToggle", "showHeaderButton"], outputs: ["formViewChange", "actionRequested"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }, { kind: "component", type: TagSelectorComponent, selector: "lib-tag-selector", inputs: ["placeholder", "disableField", "disableCreate", "hideOption", "isLoading", "errorMessage", "focusOnInit", "selectedRoleAttributes", "selectedNamedAttributes", "hasError", "availableRoleAttributes", "availableNamedAttributes"], outputs: ["addRoleAttribute", "addNamedAttribute", "roleAttributeRemoved", "namedAttributeRemoved", "selectedRoleAttributesChange", "selectedNamedAttributesChange", "filterChange"] }] }); }
|
|
19393
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: SimpleServiceComponent, selector: "lib-simple-service", inputs: { serviceRoleAttributes: "serviceRoleAttributes", identityRoleAttributes: "identityRoleAttributes", identityNamedAttributes: "identityNamedAttributes", formData: "formData" }, outputs: { close: "close", selected: "selected" }, usesInheritance: true, ngImport: i0, template: "<div class=\"projectable-form-wrapper simple-service-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(true, false, 'cards', $event)\"\n tabindex=\"0\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"isEdit ? 'Edit Simple Service' : 'Create a Simple Service'\"\n [actionButtonText]=\"'Save'\"\n [multiActions]=\"multiActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n (multiActionRequested)=\"multiActionRequested($event)\"\n [(formView)]=\"formView\"\n [moreActions]=\"moreActions\"\n ></lib-form-header>\n\n <div class=\"simple-service-form-container projectable-form-container\">\n <div class=\"form-group-column three-fifths\" *ngIf=\"showForm\">\n <div id=\"InlineServiceArea\" class=\"anyadd\">\n <div class=\"simple-service-inputs\">\n <lib-form-field-container [title]=\"'Service Details'\">\n <div class=\"form-field-input-group service-group\">\n <div class=\"form-field-sub-group\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">Service Name</span>\n </div>\n <input\n class=\"form-field-input\"\n placeholder=\"Name this service\"\n autofocus\n #nameFieldInput\n [ngClass]=\"{error: errors.name}\"\n [(ngModel)]=\"serviceApiData.name\"\n (keyup)=\"serviceNameChanged($event)\"\n (change)=\"validateServiceName()\"\n />\n </div>\n <div class=\"form-field-sub-group\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">SELECT OR CREATE SERVICE ATTRIBUTES</span>\n </div>\n <lib-tag-selector\n [(selectedRoleAttributes)]=\"serviceApiData.roleAttributes\"\n [availableRoleAttributes]=\"serviceRoleAttributes\"\n [placeholder]=\"'Add attributes to group services'\"\n ></lib-tag-selector>\n </div>\n </div>\n </lib-form-field-container>\n </div>\n </div>\n </div>\n <div class=\"simple-service-center-content\" *ngIf=\"showForm\">\n <div class=\"form-group-row\">\n <lib-form-field-container\n [title]=\"'ACCESSING CONFIGURATION'\"\n [contentStyle]=\"'z-index: 10001'\"\n [helpText]=\"'How will client applications use this service? Specify a hostname/IP and port, or use the "SDK Only" toggle for an application embedded configuration.'\"\n >\n <div class=\"form-field-input-group accessing-group\">\n <div class=\"form-field-sub-group\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">What identities can access this service?</span>\n </div>\n <lib-tag-selector\n [(selectedNamedAttributes)]=\"dialPolicyNamedAttributes\"\n [(selectedRoleAttributes)]=\"dialPolicyRoleAttributes\"\n [availableNamedAttributes]=\"identityNamedAttributes\"\n [availableRoleAttributes]=\"identityRoleAttributes\"\n [placeholder]=\"'Select identity attributes to grant access'\"\n [hasError]=\"errors.dialIdentities\"\n (selectedNamedAttributesChange)=\"validateDialIdentities()\"\n (selectedRoleAttributesChange)=\"validateDialIdentities()\"\n (filterChange)=\"getIdentityNamedAttributes($event)\"\n ></lib-tag-selector>\n </div>\n <div class=\"form-field-sub-group\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">How will the service be accessed?</span>\n </div>\n <div class=\"grid addressPort\">\n <div class=\"config-item-container\">\n <span class=\"config-item-label\">SDK ONLY</span>\n <div\n class=\"sdk-toggle form-field-toggle\"\n >\n <div class=\"switchGrid\">\n <div>\n <div\n (click)=\"toggleSdkOnlyDial()\"\n [ngClass]=\"{ on: sdkOnlyDial }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!sdkOnlyDial\" class=\"on-label\">YES</span>\n <span [hidden]=\"sdkOnlyDial\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"config-item-container\" [ngClass]=\"{disabled: sdkOnlyDial}\">\n <div class=\"config-hostname-label\">\n <span class=\"config-item-label\">HOSTNAME / IP</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Accessing hostnames must include a '.'\"\n matTooltipPosition=\"above\"\n ></div>\n <span *ngIf=\"errors.interceptAddressFormat\" class=\"error-label\">Accessing hostnames must include a '.'</span>\n </div>\n <input id=\"HowTo\" type=\"text\" maxlength=\"100\" data-i18n=\"EgHost\" (change)=\"validateInterceptAddress()\" [ngClass]=\"{error: errors.interceptAddress}\" [placeholder]=\"sdkOnlyDial ? '' : 'e.g. myservice.ziti'\" [(ngModel)]=\"sdkOnlyDial ? '' : interceptConfigApiData.data.addresses[0]\">\n </div>\n <div class=\"config-item-container\" [ngClass]=\"{disabled: sdkOnlyDial}\">\n <span class=\"config-item-label\">PORT</span>\n <input id=\"HowToPort\" type=\"number\" maxlength=\"10\" (change)=\"validateInterceptPort()\" [ngClass]=\"{error: errors.interceptPort}\" [placeholder]=\"sdkOnlyDial ? '' : 443\" (keyup)=\"interceptPortChanged($event)\" [(ngModel)]=\"sdkOnlyDial ? '' : interceptPort\">\n </div>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'HOSTING CONFIGURATION'\"\n [contentStyle]=\"'z-index: 10000'\"\n [helpText]=\"'Where should traffic for this service be sent? Specify a protocol, hostname/IP, and port, or use the "SDK Only" toggle for an application embedded configuration.'\"\n\n >\n <div class=\"form-field-input-group hosting-group\">\n <div class=\"form-field-sub-group\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">What identities can host this service?</span>\n </div>\n <lib-tag-selector\n [(selectedNamedAttributes)]=\"bindPolicyNamedAttributes\"\n [(selectedRoleAttributes)]=\"bindPolicyRoleAttributes\"\n [availableNamedAttributes]=\"identityNamedAttributes\"\n [availableRoleAttributes]=\"identityRoleAttributes\"\n [placeholder]=\"'Select identity attributes'\"\n [hasError]=\"errors.bindIdentities\"\n (selectedNamedAttributesChange)=\"validateBindIdentities()\"\n (selectedRoleAttributesChange)=\"validateBindIdentities()\"\n (filterChange)=\"getIdentityNamedAttributes($event)\"\n ></lib-tag-selector>\n </div>\n <div class=\"form-field-sub-group\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">Where should traffic be sent?</span>\n </div>\n <div class=\"grid addressFull\">\n <div class=\"config-item-container\">\n <span class=\"config-item-label\">SDK ONLY</span>\n <div\n class=\"sdk-toggle form-field-toggle\"\n >\n <div class=\"switchGrid\">\n <div>\n <div\n (click)=\"toggleSdkOnlyBind()\"\n [ngClass]=\"{ on: sdkOnlyBind }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!sdkOnlyBind\" class=\"on-label\">YES</span>\n <span [hidden]=\"sdkOnlyBind\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"config-item-container\" [ngClass]=\"{disabled: sdkOnlyBind}\">\n <span class=\"config-item-label\">PROTOCOL</span>\n <select id=\"HostedProtocol\" (change)=\"hostProtocolsChanged($event)\" [(ngModel)]=\"sdkOnlyBind ? '' : hostProtocol\">\n <option value=\"tcp\">TCP</option>\n <option value=\"udp\" >UDP</option>\n <option value=\"both\" >TCP/UDP</option>\n </select>\n </div>\n <div class=\"config-item-container\" [ngClass]=\"{disabled: sdkOnlyBind}\">\n <span class=\"config-item-label\">HOSTNAME / IP</span>\n <input id=\"HostedHost\" type=\"text\" maxlength=\"100\" data-i18n=\"EgHost\" (change)=\"validateHostAddress()\" [ngClass]=\"{error: errors.hostAddress}\" [placeholder]=\"sdkOnlyBind ? '' : 'e.g. myservice.ziti'\" [(ngModel)]=\"sdkOnlyBind ? '' : hostConfigApiData.data.address\">\n </div>\n <div class=\"config-item-container\" [ngClass]=\"{disabled: sdkOnlyBind}\">\n <span class=\"config-item-label\">PORT</span>\n <input id=\"HostedPort\" type=\"number\" maxlength=\"10\" (change)=\"validateHostPort()\" [ngClass]=\"{error: errors.hostPort}\" [placeholder]=\"sdkOnlyBind ? '' : 443\" [(ngModel)]=\"sdkOnlyBind ? '' : hostConfigApiData.data.port\">\n </div>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n </div>\n </div>\n </div>\n</div>\n", styles: [".service-header-container{display:flex;flex-direction:row;justify-content:space-between;align-items:center;position:relative}.simple-service-wrapper .simple-service-form-container .form-group-column{height:-moz-fit-content;height:fit-content;max-width:40.625rem;width:100%;transition:var(--transition);flex-grow:0;padding-bottom:0}.simple-service-wrapper .simple-service-form-container .simple-service-center-content lib-form-field-container{min-width:23.4375rem}.simple-service-wrapper .simple-service-form-container .simple-service-center-content .form-field-input-group{display:flex;flex-direction:column;gap:.9375rem}.simple-service-wrapper .grid.addressFull{grid-template-columns:4.375rem 5.9375rem auto 4.0625rem}.simple-service-wrapper .grid.addressPort{grid-template-columns:4.375rem auto 4.0625rem}.simple-service-wrapper input:disabled{opacity:.5!important}.simple-service-wrapper .addressPort .config-item-container.disabled,.simple-service-wrapper .addressFull .config-item-container.disabled{opacity:.3;pointer-events:none}.simple-service-wrapper .addressPort .config-item-container .sdk-toggle,.simple-service-wrapper .addressFull .config-item-container .sdk-toggle{color:var(--white);display:flex;justify-content:space-between;height:var(--defaultInputHeight);align-items:center;margin-bottom:0}.simple-service-wrapper .addressPort .config-item-container .sdk-toggle .label,.simple-service-wrapper .addressFull .config-item-container .sdk-toggle .label{display:flex;font-size:.875rem;font-weight:600;text-transform:uppercase}.simple-service-wrapper .addressPort .config-item-container .sdk-toggle .toggle,.simple-service-wrapper .addressFull .config-item-container .sdk-toggle .toggle{margin:0;display:flex;align-items:center;width:3.75rem;height:1.75rem;font-size:.875rem;line-height:1.5625rem;font-weight:800;font-family:Open Sans,Arial,sans-serif;background-color:var(--icon);color:var(--white);text-align:center;cursor:pointer;position:relative;float:left;border-radius:.8125rem}.simple-service-wrapper .addressPort .config-item-container .sdk-toggle .toggle.on,.simple-service-wrapper .addressFull .config-item-container .sdk-toggle .toggle.on{background-color:var(--green)}.simple-service-wrapper .addressPort .config-item-container .sdk-toggle .toggle .switch,.simple-service-wrapper .addressFull .config-item-container .sdk-toggle .toggle .switch{width:1.25rem;height:1.25rem;border-radius:.625rem;background-color:var(--white);transition:var(--transition);position:absolute;top:.25rem;z-index:10}.simple-service-wrapper .addressPort .config-item-container .sdk-toggle .toggle .switch.on,.simple-service-wrapper .addressFull .config-item-container .sdk-toggle .toggle .switch.on{left:2.1875rem}.simple-service-wrapper .addressPort .config-item-container .sdk-toggle .toggle .on-label,.simple-service-wrapper .addressFull .config-item-container .sdk-toggle .toggle .on-label{margin-left:.4375rem}.simple-service-wrapper .addressPort .config-item-container .sdk-toggle .toggle .off-label,.simple-service-wrapper .addressFull .config-item-container .sdk-toggle .toggle .off-label{margin-left:2rem}.simple-service-wrapper .addressPort .config-item-container .config-hostname-label,.simple-service-wrapper .addressFull .config-item-container .config-hostname-label{display:flex;flex-direction:row;justify-content:flex-start;white-space:nowrap}.simple-service-wrapper .addressPort .config-item-container .config-hostname-label .form-field-info,.simple-service-wrapper .addressFull .config-item-container .config-hostname-label .form-field-info{margin-top:.0625rem}.simple-service-wrapper .addressPort .config-item-container .config-hostname-label .error-label,.simple-service-wrapper .addressFull .config-item-container .config-hostname-label .error-label{margin-left:.3125rem}.simple-service-wrapper .form-field-input-group.service-group{gap:.625rem;display:flex;flex-direction:column}.simple-service-wrapper .form-field-input-group.accessing-group{gap:.9375rem;display:flex;flex-direction:column}.simple-service-wrapper .form-field-input-group .form-field-sub-group{display:flex;flex-direction:column;gap:.3125rem}.simple-service-wrapper .form-field-input-group .form-field-sub-group .config-title-row{height:.875rem}.simple-service-wrapper .form-field-input-group .form-field-sub-group .addressFull,.simple-service-wrapper .form-field-input-group .form-field-sub-group .addressPort{gap:.625rem}.simple-service-wrapper .form-field-input-group .form-field-sub-group .addressFull select{height:var(--defaultInputHeight)}.simple-service-wrapper .simple-service-center-content{display:flex;flex-direction:column;width:100%;align-items:center;justify-content:center}.simple-service-wrapper .simple-service-center-content .form-group-row{flex-wrap:wrap;gap:.9375rem;max-width:40.625rem;justify-content:center;padding:0}.config-item-label{color:#a9abaf;font-weight:600;margin-bottom:.3125rem;position:relative;display:flex}.simple-service-inputs{display:flex;flex-direction:column;gap:.9375rem}.form-field-input-group .form-field-title{color:var(--offWhite);margin-bottom:.625rem}.config-item .config-container.encryption-pod{background-color:#222f3e;background-image:linear-gradient(90deg,#232f3e,#f6f7fb);background-image:-ms-linear-gradient(90deg,rgb(35,47,62) 0%,rgb(246,247,251) 100%);border-radius:var(--inputBorderRadius)}.config-item .config-container .config-container-label{color:#fff}.convert-service-button{background-color:var(--primaryColor);width:2.0625rem;height:2.0625rem;color:var(--white);font-family:icomoon!important;font-size:1.5rem;border:none;border-radius:var(--inputBorderRadius);position:relative}::ng-deep .simple-service-wrapper input{max-height:var(--defaultInputHeight);min-height:0rem;height:var(--defaultInputHeight)}::ng-deep .simple-service-wrapper .select2-search__field{height:100%;min-height:2.5rem;max-height:2.5rem}::ng-deep .simple-service-wrapper .select2-selection__rendered{padding:0;max-height:7.1875rem!important;overflow:auto}::ng-deep .simple-service-wrapper .form-header-container{align-items:center}::ng-deep .simple-service-wrapper .form-header-container .form-header-group{width:40.625rem!important}::ng-deep .simple-service-wrapper .form-header-container .header-actions-container{min-width:0rem}::ng-deep .simple-service-wrapper .form-header-container .form-header-toggle-container{display:none}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.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: i5.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i5.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: FormHeaderComponent, selector: "lib-form-header", inputs: ["data", "badges", "title", "moreActions", "formView", "saveDisabled", "saveTooltip", "actionButtonText", "moreActionsText", "showHeaderToggle", "showHeaderButton", "multiActions"], outputs: ["formViewChange", "actionRequested", "multiActionRequested"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }, { kind: "component", type: TagSelectorComponent, selector: "lib-tag-selector", inputs: ["placeholder", "disableField", "disableCreate", "hideOption", "isLoading", "errorMessage", "focusOnInit", "selectedRoleAttributes", "selectedNamedAttributes", "hasError", "availableRoleAttributes", "availableNamedAttributes"], outputs: ["addRoleAttribute", "addNamedAttribute", "roleAttributeRemoved", "namedAttributeRemoved", "selectedRoleAttributesChange", "selectedNamedAttributesChange", "filterChange"] }] }); }
|
|
18861
19394
|
}
|
|
18862
19395
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SimpleServiceComponent, decorators: [{
|
|
18863
19396
|
type: Component,
|
|
18864
|
-
args: [{ selector: 'lib-simple-service', template: "<div class=\"projectable-form-wrapper simple-service-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(true, false, 'cards', $event)\"\n tabindex=\"0\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"showForm ? 'Create a Simple Service' : 'Service Creation Summary'\"\n [actionButtonText]=\"'Save'\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n ></lib-form-header>\n <div class=\"simple-service-form-container projectable-form-container\">\n <div class=\"form-group-column three-fifths\" *ngIf=\"showForm\">\n <div id=\"InlineServiceArea\" class=\"anyadd\">\n <div class=\"simple-service-inputs\">\n <lib-form-field-container [title]=\"'Service Details'\">\n <div class=\"form-field-input-group service-group\">\n <div class=\"form-field-sub-group\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">Service Name</span>\n </div>\n <input\n class=\"form-field-input\"\n placeholder=\"Name this service\"\n autofocus\n #nameFieldInput\n [ngClass]=\"{error: errors.name}\"\n [(ngModel)]=\"serviceApiData.name\"\n (keyup)=\"serviceNameChanged($event)\"\n (change)=\"validateServiceName()\"\n />\n </div>\n <div class=\"form-field-sub-group\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">SELECT OR CREATE SERVICE ATTRIBUTES</span>\n </div>\n <lib-tag-selector\n [(selectedRoleAttributes)]=\"serviceApiData.roleAttributes\"\n [availableRoleAttributes]=\"serviceRoleAttributes\"\n [placeholder]=\"'Add attributes to group services'\"\n ></lib-tag-selector>\n </div>\n </div>\n </lib-form-field-container>\n </div>\n </div>\n </div>\n <div class=\"simple-service-center-content\" *ngIf=\"showForm\">\n <div class=\"form-group-row\">\n <lib-form-field-container\n [title]=\"'ACCESSING CONFIGURATION'\"\n [contentStyle]=\"'z-index: 10001'\"\n [helpText]=\"'How will client applications use this service? Specify a hostname/IP and port, or use the "SDK Only" toggle for an application embedded configuration.'\"\n >\n <div class=\"form-field-input-group accessing-group\">\n <div class=\"form-field-sub-group\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">What identities can access this service?</span>\n </div>\n <lib-tag-selector\n [(selectedNamedAttributes)]=\"dialPolicyNamedAttributes\"\n [(selectedRoleAttributes)]=\"dialPolicyRoleAttributes\"\n [availableNamedAttributes]=\"identityNamedAttributes\"\n [availableRoleAttributes]=\"identityRoleAttributes\"\n [placeholder]=\"'Select identity attributes to grant access'\"\n [hasError]=\"errors.dialIdentities\"\n (selectedNamedAttributesChange)=\"validateDialIdentities()\"\n (selectedRoleAttributesChange)=\"validateDialIdentities()\"\n (filterChange)=\"getIdentityNamedAttributes($event)\"\n ></lib-tag-selector>\n </div>\n <div class=\"form-field-sub-group\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">How will the service be accessed?</span>\n </div>\n <div class=\"grid addressPort\">\n <div class=\"config-item-container\">\n <span class=\"config-item-label\">SDK ONLY</span>\n <div\n class=\"sdk-toggle form-field-toggle\"\n >\n <div class=\"switchGrid\">\n <div>\n <div\n (click)=\"toggleSdkOnlyDial()\"\n [ngClass]=\"{ on: sdkOnlyDial }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!sdkOnlyDial\" class=\"on-label\">YES</span>\n <span [hidden]=\"sdkOnlyDial\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"config-item-container\" [ngClass]=\"{disabled: sdkOnlyDial}\">\n <div class=\"config-hostname-label\">\n <span class=\"config-item-label\">HOSTNAME / IP</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Accessing hostnames must include a '.'\"\n matTooltipPosition=\"above\"\n ></div>\n <span *ngIf=\"errors.interceptAddressFormat\" class=\"error-label\">Accessing hostnames must include a '.'</span>\n </div>\n <input id=\"HowTo\" type=\"text\" maxlength=\"100\" data-i18n=\"EgHost\" (change)=\"validateInterceptAddress()\" [ngClass]=\"{error: errors.interceptAddress}\" [placeholder]=\"sdkOnlyDial ? '' : 'e.g. myservice.ziti'\" [(ngModel)]=\"sdkOnlyDial ? '' : interceptConfigApiData.data.addresses[0]\">\n </div>\n <div class=\"config-item-container\" [ngClass]=\"{disabled: sdkOnlyDial}\">\n <span class=\"config-item-label\">PORT</span>\n <input id=\"HowToPort\" type=\"number\" maxlength=\"10\" (change)=\"validateInterceptPort()\" [ngClass]=\"{error: errors.interceptPort}\" [placeholder]=\"sdkOnlyDial ? '' : 443\" (keyup)=\"interceptPortChanged($event)\" [(ngModel)]=\"sdkOnlyDial ? '' : interceptPort\">\n </div>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'HOSTING CONFIGURATION'\"\n [contentStyle]=\"'z-index: 10000'\"\n [helpText]=\"'Where should traffic for this service be sent? Specify a protocol, hostname/IP, and port, or use the "SDK Only" toggle for an application embedded configuration.'\"\n\n >\n <div class=\"form-field-input-group hosting-group\">\n <div class=\"form-field-sub-group\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">What identities can host this service?</span>\n </div>\n <lib-tag-selector\n [(selectedNamedAttributes)]=\"bindPolicyNamedAttributes\"\n [(selectedRoleAttributes)]=\"bindPolicyRoleAttributes\"\n [availableNamedAttributes]=\"identityNamedAttributes\"\n [availableRoleAttributes]=\"identityRoleAttributes\"\n [placeholder]=\"'Select identity attributes'\"\n [hasError]=\"errors.bindIdentities\"\n (selectedNamedAttributesChange)=\"validateBindIdentities()\"\n (selectedRoleAttributesChange)=\"validateBindIdentities()\"\n (filterChange)=\"getIdentityNamedAttributes($event)\"\n ></lib-tag-selector>\n </div>\n <div class=\"form-field-sub-group\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">Where should traffic be sent?</span>\n </div>\n <div class=\"grid addressFull\">\n <div class=\"config-item-container\">\n <span class=\"config-item-label\">SDK ONLY</span>\n <div\n class=\"sdk-toggle form-field-toggle\"\n >\n <div class=\"switchGrid\">\n <div>\n <div\n (click)=\"toggleSdkOnlyBind()\"\n [ngClass]=\"{ on: sdkOnlyBind }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!sdkOnlyBind\" class=\"on-label\">YES</span>\n <span [hidden]=\"sdkOnlyBind\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"config-item-container\" [ngClass]=\"{disabled: sdkOnlyBind}\">\n <span class=\"config-item-label\">PROTOCOL</span>\n <select id=\"HostedProtocol\" (change)=\"hostProtocolsChanged($event)\" [(ngModel)]=\"sdkOnlyBind ? '' : hostProtocol\">\n <option value=\"tcp\">TCP</option>\n <option value=\"udp\" >UDP</option>\n <option value=\"both\" >TCP/UDP</option>\n </select>\n </div>\n <div class=\"config-item-container\" [ngClass]=\"{disabled: sdkOnlyBind}\">\n <span class=\"config-item-label\">HOSTNAME / IP</span>\n <input id=\"HostedHost\" type=\"text\" maxlength=\"100\" data-i18n=\"EgHost\" (change)=\"validateHostAddress()\" [ngClass]=\"{error: errors.hostAddress}\" [placeholder]=\"sdkOnlyBind ? '' : 'e.g. myservice.ziti'\" [(ngModel)]=\"sdkOnlyBind ? '' : hostConfigApiData.data.address\">\n </div>\n <div class=\"config-item-container\" [ngClass]=\"{disabled: sdkOnlyBind}\">\n <span class=\"config-item-label\">PORT</span>\n <input id=\"HostedPort\" type=\"number\" maxlength=\"10\" (change)=\"validateHostPort()\" [ngClass]=\"{error: errors.hostPort}\" [placeholder]=\"sdkOnlyBind ? '' : 443\" [(ngModel)]=\"sdkOnlyBind ? '' : hostConfigApiData.data.port\">\n </div>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n </div>\n </div>\n </div>\n</div>", styles: [".ziti-entity-header-container{display:flex;flex-direction:row;justify-content:space-between;align-items:center}.simple-service-wrapper .simple-service-form-container .form-group-column{height:-moz-fit-content;height:fit-content;max-width:40.625rem;width:100%;transition:var(--transition);flex-grow:0;padding-bottom:0}.simple-service-wrapper .simple-service-form-container .simple-service-center-content lib-form-field-container{min-width:23.4375rem}.simple-service-wrapper .simple-service-form-container .simple-service-center-content .form-field-input-group{display:flex;flex-direction:column;gap:.9375rem}.simple-service-wrapper .grid.addressFull{grid-template-columns:4.375rem 5.9375rem auto 4.0625rem}.simple-service-wrapper .grid.addressPort{grid-template-columns:4.375rem auto 4.0625rem}.simple-service-wrapper input:disabled{opacity:.5!important}.simple-service-wrapper .addressPort .config-item-container.disabled,.simple-service-wrapper .addressFull .config-item-container.disabled{opacity:.3;pointer-events:none}.simple-service-wrapper .addressPort .config-item-container .sdk-toggle,.simple-service-wrapper .addressFull .config-item-container .sdk-toggle{color:var(--white);display:flex;justify-content:space-between;height:var(--defaultInputHeight);align-items:center;margin-bottom:0}.simple-service-wrapper .addressPort .config-item-container .sdk-toggle .label,.simple-service-wrapper .addressFull .config-item-container .sdk-toggle .label{display:flex;font-size:.875rem;font-weight:600;text-transform:uppercase}.simple-service-wrapper .addressPort .config-item-container .sdk-toggle .toggle,.simple-service-wrapper .addressFull .config-item-container .sdk-toggle .toggle{margin:0;display:flex;align-items:center;width:3.75rem;height:1.75rem;font-size:.875rem;line-height:1.5625rem;font-weight:800;font-family:Open Sans,Arial,sans-serif;background-color:var(--icon);color:var(--white);text-align:center;cursor:pointer;position:relative;float:left;border-radius:.8125rem}.simple-service-wrapper .addressPort .config-item-container .sdk-toggle .toggle.on,.simple-service-wrapper .addressFull .config-item-container .sdk-toggle .toggle.on{background-color:var(--green)}.simple-service-wrapper .addressPort .config-item-container .sdk-toggle .toggle .switch,.simple-service-wrapper .addressFull .config-item-container .sdk-toggle .toggle .switch{width:1.25rem;height:1.25rem;border-radius:.625rem;background-color:var(--white);transition:var(--transition);position:absolute;top:.25rem;z-index:10}.simple-service-wrapper .addressPort .config-item-container .sdk-toggle .toggle .switch.on,.simple-service-wrapper .addressFull .config-item-container .sdk-toggle .toggle .switch.on{left:2.1875rem}.simple-service-wrapper .addressPort .config-item-container .sdk-toggle .toggle .on-label,.simple-service-wrapper .addressFull .config-item-container .sdk-toggle .toggle .on-label{margin-left:.4375rem}.simple-service-wrapper .addressPort .config-item-container .sdk-toggle .toggle .off-label,.simple-service-wrapper .addressFull .config-item-container .sdk-toggle .toggle .off-label{margin-left:2rem}.simple-service-wrapper .addressPort .config-item-container .config-hostname-label,.simple-service-wrapper .addressFull .config-item-container .config-hostname-label{display:flex;flex-direction:row;justify-content:flex-start;white-space:nowrap}.simple-service-wrapper .addressPort .config-item-container .config-hostname-label .form-field-info,.simple-service-wrapper .addressFull .config-item-container .config-hostname-label .form-field-info{margin-top:.0625rem}.simple-service-wrapper .addressPort .config-item-container .config-hostname-label .error-label,.simple-service-wrapper .addressFull .config-item-container .config-hostname-label .error-label{margin-left:.3125rem}.simple-service-wrapper .form-field-input-group.service-group{gap:.625rem;display:flex;flex-direction:column}.simple-service-wrapper .form-field-input-group.accessing-group{gap:.9375rem;display:flex;flex-direction:column}.simple-service-wrapper .form-field-input-group .form-field-sub-group{display:flex;flex-direction:column;gap:.3125rem}.simple-service-wrapper .form-field-input-group .form-field-sub-group .config-title-row{height:.875rem}.simple-service-wrapper .form-field-input-group .form-field-sub-group .addressFull,.simple-service-wrapper .form-field-input-group .form-field-sub-group .addressPort{gap:.625rem}.simple-service-wrapper .form-field-input-group .form-field-sub-group .addressFull select{height:var(--defaultInputHeight)}.simple-service-wrapper .simple-service-center-content{display:flex;flex-direction:column;width:100%;align-items:center;justify-content:center}.simple-service-wrapper .simple-service-center-content .form-group-row{flex-wrap:wrap;gap:.9375rem;max-width:40.625rem;justify-content:center;padding:0}.config-item-label{color:#a9abaf;font-weight:600;margin-bottom:.3125rem;position:relative;display:flex}.simple-service-inputs{display:flex;flex-direction:column;gap:.9375rem}.form-field-input-group .form-field-title{color:var(--offWhite);margin-bottom:.625rem}.config-item .config-container.encryption-pod{background-color:#222f3e;background-image:linear-gradient(90deg,#232f3e,#f6f7fb);background-image:-ms-linear-gradient(90deg,rgb(35,47,62) 0%,rgb(246,247,251) 100%);border-radius:var(--inputBorderRadius)}.config-item .config-container .config-container-label{color:#fff}::ng-deep .simple-service-wrapper input{max-height:var(--defaultInputHeight);min-height:0rem;height:var(--defaultInputHeight)}::ng-deep .simple-service-wrapper .select2-search__field{height:100%;min-height:2.5rem;max-height:2.5rem}::ng-deep .simple-service-wrapper .select2-selection__rendered{padding:0;max-height:7.1875rem!important;overflow:auto}::ng-deep .simple-service-wrapper .form-header-container{align-items:center}::ng-deep .simple-service-wrapper .form-header-container .form-header-group{width:40.625rem!important}::ng-deep .simple-service-wrapper .form-header-container .header-actions-container{min-width:0rem}::ng-deep .simple-service-wrapper .form-header-container .form-header-toggle-container{display:none}\n"] }]
|
|
19397
|
+
args: [{ selector: 'lib-simple-service', template: "<div class=\"projectable-form-wrapper simple-service-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(true, false, 'cards', $event)\"\n tabindex=\"0\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"isEdit ? 'Edit Simple Service' : 'Create a Simple Service'\"\n [actionButtonText]=\"'Save'\"\n [multiActions]=\"multiActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n (multiActionRequested)=\"multiActionRequested($event)\"\n [(formView)]=\"formView\"\n [moreActions]=\"moreActions\"\n ></lib-form-header>\n\n <div class=\"simple-service-form-container projectable-form-container\">\n <div class=\"form-group-column three-fifths\" *ngIf=\"showForm\">\n <div id=\"InlineServiceArea\" class=\"anyadd\">\n <div class=\"simple-service-inputs\">\n <lib-form-field-container [title]=\"'Service Details'\">\n <div class=\"form-field-input-group service-group\">\n <div class=\"form-field-sub-group\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">Service Name</span>\n </div>\n <input\n class=\"form-field-input\"\n placeholder=\"Name this service\"\n autofocus\n #nameFieldInput\n [ngClass]=\"{error: errors.name}\"\n [(ngModel)]=\"serviceApiData.name\"\n (keyup)=\"serviceNameChanged($event)\"\n (change)=\"validateServiceName()\"\n />\n </div>\n <div class=\"form-field-sub-group\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">SELECT OR CREATE SERVICE ATTRIBUTES</span>\n </div>\n <lib-tag-selector\n [(selectedRoleAttributes)]=\"serviceApiData.roleAttributes\"\n [availableRoleAttributes]=\"serviceRoleAttributes\"\n [placeholder]=\"'Add attributes to group services'\"\n ></lib-tag-selector>\n </div>\n </div>\n </lib-form-field-container>\n </div>\n </div>\n </div>\n <div class=\"simple-service-center-content\" *ngIf=\"showForm\">\n <div class=\"form-group-row\">\n <lib-form-field-container\n [title]=\"'ACCESSING CONFIGURATION'\"\n [contentStyle]=\"'z-index: 10001'\"\n [helpText]=\"'How will client applications use this service? Specify a hostname/IP and port, or use the "SDK Only" toggle for an application embedded configuration.'\"\n >\n <div class=\"form-field-input-group accessing-group\">\n <div class=\"form-field-sub-group\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">What identities can access this service?</span>\n </div>\n <lib-tag-selector\n [(selectedNamedAttributes)]=\"dialPolicyNamedAttributes\"\n [(selectedRoleAttributes)]=\"dialPolicyRoleAttributes\"\n [availableNamedAttributes]=\"identityNamedAttributes\"\n [availableRoleAttributes]=\"identityRoleAttributes\"\n [placeholder]=\"'Select identity attributes to grant access'\"\n [hasError]=\"errors.dialIdentities\"\n (selectedNamedAttributesChange)=\"validateDialIdentities()\"\n (selectedRoleAttributesChange)=\"validateDialIdentities()\"\n (filterChange)=\"getIdentityNamedAttributes($event)\"\n ></lib-tag-selector>\n </div>\n <div class=\"form-field-sub-group\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">How will the service be accessed?</span>\n </div>\n <div class=\"grid addressPort\">\n <div class=\"config-item-container\">\n <span class=\"config-item-label\">SDK ONLY</span>\n <div\n class=\"sdk-toggle form-field-toggle\"\n >\n <div class=\"switchGrid\">\n <div>\n <div\n (click)=\"toggleSdkOnlyDial()\"\n [ngClass]=\"{ on: sdkOnlyDial }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!sdkOnlyDial\" class=\"on-label\">YES</span>\n <span [hidden]=\"sdkOnlyDial\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"config-item-container\" [ngClass]=\"{disabled: sdkOnlyDial}\">\n <div class=\"config-hostname-label\">\n <span class=\"config-item-label\">HOSTNAME / IP</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Accessing hostnames must include a '.'\"\n matTooltipPosition=\"above\"\n ></div>\n <span *ngIf=\"errors.interceptAddressFormat\" class=\"error-label\">Accessing hostnames must include a '.'</span>\n </div>\n <input id=\"HowTo\" type=\"text\" maxlength=\"100\" data-i18n=\"EgHost\" (change)=\"validateInterceptAddress()\" [ngClass]=\"{error: errors.interceptAddress}\" [placeholder]=\"sdkOnlyDial ? '' : 'e.g. myservice.ziti'\" [(ngModel)]=\"sdkOnlyDial ? '' : interceptConfigApiData.data.addresses[0]\">\n </div>\n <div class=\"config-item-container\" [ngClass]=\"{disabled: sdkOnlyDial}\">\n <span class=\"config-item-label\">PORT</span>\n <input id=\"HowToPort\" type=\"number\" maxlength=\"10\" (change)=\"validateInterceptPort()\" [ngClass]=\"{error: errors.interceptPort}\" [placeholder]=\"sdkOnlyDial ? '' : 443\" (keyup)=\"interceptPortChanged($event)\" [(ngModel)]=\"sdkOnlyDial ? '' : interceptPort\">\n </div>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'HOSTING CONFIGURATION'\"\n [contentStyle]=\"'z-index: 10000'\"\n [helpText]=\"'Where should traffic for this service be sent? Specify a protocol, hostname/IP, and port, or use the "SDK Only" toggle for an application embedded configuration.'\"\n\n >\n <div class=\"form-field-input-group hosting-group\">\n <div class=\"form-field-sub-group\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">What identities can host this service?</span>\n </div>\n <lib-tag-selector\n [(selectedNamedAttributes)]=\"bindPolicyNamedAttributes\"\n [(selectedRoleAttributes)]=\"bindPolicyRoleAttributes\"\n [availableNamedAttributes]=\"identityNamedAttributes\"\n [availableRoleAttributes]=\"identityRoleAttributes\"\n [placeholder]=\"'Select identity attributes'\"\n [hasError]=\"errors.bindIdentities\"\n (selectedNamedAttributesChange)=\"validateBindIdentities()\"\n (selectedRoleAttributesChange)=\"validateBindIdentities()\"\n (filterChange)=\"getIdentityNamedAttributes($event)\"\n ></lib-tag-selector>\n </div>\n <div class=\"form-field-sub-group\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">Where should traffic be sent?</span>\n </div>\n <div class=\"grid addressFull\">\n <div class=\"config-item-container\">\n <span class=\"config-item-label\">SDK ONLY</span>\n <div\n class=\"sdk-toggle form-field-toggle\"\n >\n <div class=\"switchGrid\">\n <div>\n <div\n (click)=\"toggleSdkOnlyBind()\"\n [ngClass]=\"{ on: sdkOnlyBind }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!sdkOnlyBind\" class=\"on-label\">YES</span>\n <span [hidden]=\"sdkOnlyBind\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"config-item-container\" [ngClass]=\"{disabled: sdkOnlyBind}\">\n <span class=\"config-item-label\">PROTOCOL</span>\n <select id=\"HostedProtocol\" (change)=\"hostProtocolsChanged($event)\" [(ngModel)]=\"sdkOnlyBind ? '' : hostProtocol\">\n <option value=\"tcp\">TCP</option>\n <option value=\"udp\" >UDP</option>\n <option value=\"both\" >TCP/UDP</option>\n </select>\n </div>\n <div class=\"config-item-container\" [ngClass]=\"{disabled: sdkOnlyBind}\">\n <span class=\"config-item-label\">HOSTNAME / IP</span>\n <input id=\"HostedHost\" type=\"text\" maxlength=\"100\" data-i18n=\"EgHost\" (change)=\"validateHostAddress()\" [ngClass]=\"{error: errors.hostAddress}\" [placeholder]=\"sdkOnlyBind ? '' : 'e.g. myservice.ziti'\" [(ngModel)]=\"sdkOnlyBind ? '' : hostConfigApiData.data.address\">\n </div>\n <div class=\"config-item-container\" [ngClass]=\"{disabled: sdkOnlyBind}\">\n <span class=\"config-item-label\">PORT</span>\n <input id=\"HostedPort\" type=\"number\" maxlength=\"10\" (change)=\"validateHostPort()\" [ngClass]=\"{error: errors.hostPort}\" [placeholder]=\"sdkOnlyBind ? '' : 443\" [(ngModel)]=\"sdkOnlyBind ? '' : hostConfigApiData.data.port\">\n </div>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n </div>\n </div>\n </div>\n</div>\n", styles: [".service-header-container{display:flex;flex-direction:row;justify-content:space-between;align-items:center;position:relative}.simple-service-wrapper .simple-service-form-container .form-group-column{height:-moz-fit-content;height:fit-content;max-width:40.625rem;width:100%;transition:var(--transition);flex-grow:0;padding-bottom:0}.simple-service-wrapper .simple-service-form-container .simple-service-center-content lib-form-field-container{min-width:23.4375rem}.simple-service-wrapper .simple-service-form-container .simple-service-center-content .form-field-input-group{display:flex;flex-direction:column;gap:.9375rem}.simple-service-wrapper .grid.addressFull{grid-template-columns:4.375rem 5.9375rem auto 4.0625rem}.simple-service-wrapper .grid.addressPort{grid-template-columns:4.375rem auto 4.0625rem}.simple-service-wrapper input:disabled{opacity:.5!important}.simple-service-wrapper .addressPort .config-item-container.disabled,.simple-service-wrapper .addressFull .config-item-container.disabled{opacity:.3;pointer-events:none}.simple-service-wrapper .addressPort .config-item-container .sdk-toggle,.simple-service-wrapper .addressFull .config-item-container .sdk-toggle{color:var(--white);display:flex;justify-content:space-between;height:var(--defaultInputHeight);align-items:center;margin-bottom:0}.simple-service-wrapper .addressPort .config-item-container .sdk-toggle .label,.simple-service-wrapper .addressFull .config-item-container .sdk-toggle .label{display:flex;font-size:.875rem;font-weight:600;text-transform:uppercase}.simple-service-wrapper .addressPort .config-item-container .sdk-toggle .toggle,.simple-service-wrapper .addressFull .config-item-container .sdk-toggle .toggle{margin:0;display:flex;align-items:center;width:3.75rem;height:1.75rem;font-size:.875rem;line-height:1.5625rem;font-weight:800;font-family:Open Sans,Arial,sans-serif;background-color:var(--icon);color:var(--white);text-align:center;cursor:pointer;position:relative;float:left;border-radius:.8125rem}.simple-service-wrapper .addressPort .config-item-container .sdk-toggle .toggle.on,.simple-service-wrapper .addressFull .config-item-container .sdk-toggle .toggle.on{background-color:var(--green)}.simple-service-wrapper .addressPort .config-item-container .sdk-toggle .toggle .switch,.simple-service-wrapper .addressFull .config-item-container .sdk-toggle .toggle .switch{width:1.25rem;height:1.25rem;border-radius:.625rem;background-color:var(--white);transition:var(--transition);position:absolute;top:.25rem;z-index:10}.simple-service-wrapper .addressPort .config-item-container .sdk-toggle .toggle .switch.on,.simple-service-wrapper .addressFull .config-item-container .sdk-toggle .toggle .switch.on{left:2.1875rem}.simple-service-wrapper .addressPort .config-item-container .sdk-toggle .toggle .on-label,.simple-service-wrapper .addressFull .config-item-container .sdk-toggle .toggle .on-label{margin-left:.4375rem}.simple-service-wrapper .addressPort .config-item-container .sdk-toggle .toggle .off-label,.simple-service-wrapper .addressFull .config-item-container .sdk-toggle .toggle .off-label{margin-left:2rem}.simple-service-wrapper .addressPort .config-item-container .config-hostname-label,.simple-service-wrapper .addressFull .config-item-container .config-hostname-label{display:flex;flex-direction:row;justify-content:flex-start;white-space:nowrap}.simple-service-wrapper .addressPort .config-item-container .config-hostname-label .form-field-info,.simple-service-wrapper .addressFull .config-item-container .config-hostname-label .form-field-info{margin-top:.0625rem}.simple-service-wrapper .addressPort .config-item-container .config-hostname-label .error-label,.simple-service-wrapper .addressFull .config-item-container .config-hostname-label .error-label{margin-left:.3125rem}.simple-service-wrapper .form-field-input-group.service-group{gap:.625rem;display:flex;flex-direction:column}.simple-service-wrapper .form-field-input-group.accessing-group{gap:.9375rem;display:flex;flex-direction:column}.simple-service-wrapper .form-field-input-group .form-field-sub-group{display:flex;flex-direction:column;gap:.3125rem}.simple-service-wrapper .form-field-input-group .form-field-sub-group .config-title-row{height:.875rem}.simple-service-wrapper .form-field-input-group .form-field-sub-group .addressFull,.simple-service-wrapper .form-field-input-group .form-field-sub-group .addressPort{gap:.625rem}.simple-service-wrapper .form-field-input-group .form-field-sub-group .addressFull select{height:var(--defaultInputHeight)}.simple-service-wrapper .simple-service-center-content{display:flex;flex-direction:column;width:100%;align-items:center;justify-content:center}.simple-service-wrapper .simple-service-center-content .form-group-row{flex-wrap:wrap;gap:.9375rem;max-width:40.625rem;justify-content:center;padding:0}.config-item-label{color:#a9abaf;font-weight:600;margin-bottom:.3125rem;position:relative;display:flex}.simple-service-inputs{display:flex;flex-direction:column;gap:.9375rem}.form-field-input-group .form-field-title{color:var(--offWhite);margin-bottom:.625rem}.config-item .config-container.encryption-pod{background-color:#222f3e;background-image:linear-gradient(90deg,#232f3e,#f6f7fb);background-image:-ms-linear-gradient(90deg,rgb(35,47,62) 0%,rgb(246,247,251) 100%);border-radius:var(--inputBorderRadius)}.config-item .config-container .config-container-label{color:#fff}.convert-service-button{background-color:var(--primaryColor);width:2.0625rem;height:2.0625rem;color:var(--white);font-family:icomoon!important;font-size:1.5rem;border:none;border-radius:var(--inputBorderRadius);position:relative}::ng-deep .simple-service-wrapper input{max-height:var(--defaultInputHeight);min-height:0rem;height:var(--defaultInputHeight)}::ng-deep .simple-service-wrapper .select2-search__field{height:100%;min-height:2.5rem;max-height:2.5rem}::ng-deep .simple-service-wrapper .select2-selection__rendered{padding:0;max-height:7.1875rem!important;overflow:auto}::ng-deep .simple-service-wrapper .form-header-container{align-items:center}::ng-deep .simple-service-wrapper .form-header-container .form-header-group{width:40.625rem!important}::ng-deep .simple-service-wrapper .form-header-container .header-actions-container{min-width:0rem}::ng-deep .simple-service-wrapper .form-header-container .form-header-toggle-container{display:none}\n"] }]
|
|
18865
19398
|
}], ctorParameters: function () { return [{ type: SettingsService, decorators: [{
|
|
18866
19399
|
type: Inject,
|
|
18867
19400
|
args: [SETTINGS_SERVICE]
|
|
@@ -18881,6 +19414,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
18881
19414
|
type: Output
|
|
18882
19415
|
}], selected: [{
|
|
18883
19416
|
type: Output
|
|
19417
|
+
}], formData: [{
|
|
19418
|
+
type: Input
|
|
18884
19419
|
}] } });
|
|
18885
19420
|
|
|
18886
19421
|
class EdgeRouterPolicy {
|
|
@@ -19340,6 +19875,11 @@ class EdgeRouterPoliciesPageComponent extends ListPageComponent {
|
|
|
19340
19875
|
case 'toggleAll':
|
|
19341
19876
|
case 'toggleItem':
|
|
19342
19877
|
this.itemToggled(event.item);
|
|
19878
|
+
this.rowData.forEach((item) => {
|
|
19879
|
+
if (item.isSystem) {
|
|
19880
|
+
item.selected = false;
|
|
19881
|
+
}
|
|
19882
|
+
});
|
|
19343
19883
|
break;
|
|
19344
19884
|
case 'update':
|
|
19345
19885
|
this.svc.serviceType = 'advanced';
|
|
@@ -20171,7 +20711,7 @@ class ServicePolicyFormComponent extends ProjectableForm {
|
|
|
20171
20711
|
provide: MatDialogRef,
|
|
20172
20712
|
useValue: {}
|
|
20173
20713
|
}
|
|
20174
|
-
], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"formData.id ? 'Edit Service Policy: ' : 'Create New Service Policy'\"\n [moreActions]=\"moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n ></lib-form-header>\n <div class=\"service-policy-form-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" *ngIf=\"formView === 'simple'\">\n <div class=\"form-group-column three-fifths\">\n <lib-form-field-container [title]=\"'Service Policy Name'\" [label]=\"'REQUIRED'\">\n <input\n class=\"form-field-input\"\n placeholder=\"Name this service policy\"\n [ngClass]=\"{error: errors['name']}\"\n [(ngModel)]=\"formData.name\"\n autofocus\n #nameFieldInput\n />\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Select Service Attributes'\"\n [label]=\"'OPTIONAL'\"\n [contentStyle]=\"'z-index: 100003'\"\n [helpText]=\"'Choose which services to associate to this policy by picking from the list of available attributes'\"\n >\n <lib-tag-selector\n [(selectedRoleAttributes)]=\"selectedServiceRoleAttributes\"\n [(selectedNamedAttributes)]=\"selectedServiceNamedAttributes\"\n [availableRoleAttributes]=\"svc.serviceRoleAttributes\"\n [availableNamedAttributes]=\"svc.serviceNamedAttributes\"\n (selectedNamedAttributesChange)=\"svc.getAssociatedServicesByAttribute(selectedServiceRoleAttributes, selectedServiceNamedAttributes)\"\n (selectedRoleAttributesChange)=\"svc.getAssociatedServicesByAttribute(selectedServiceRoleAttributes, selectedServiceNamedAttributes)\"\n [placeholder]=\"'Select service attributes'\"\n ></lib-tag-selector>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Select Identity Attributes'\"\n [label]=\"'OPTIONAL'\"\n [contentStyle]=\"'z-index: 100002'\"\n [helpText]=\"'Choose which identities to associate to this policy by picking from the list of available attributes'\"\n >\n <lib-tag-selector\n [(selectedRoleAttributes)]=\"selectedIdentityRoleAttributes\"\n [(selectedNamedAttributes)]=\"selectedIdentityNamedAttributes\"\n [availableRoleAttributes]=\"svc.identityRoleAttributes\"\n [availableNamedAttributes]=\"svc.identityNamedAttributes\"\n (selectedNamedAttributesChange)=\"svc.getAssociatedIdentitiesByAttribute(selectedIdentityRoleAttributes, selectedIdentityNamedAttributes)\"\n (selectedRoleAttributesChange)=\"svc.getAssociatedIdentitiesByAttribute(selectedIdentityRoleAttributes, selectedIdentityNamedAttributes)\"\n [placeholder]=\"'Select identity attributes'\"\n ></lib-tag-selector>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Select Posture Check Attributes'\"\n [label]=\"'OPTIONAL'\"\n [contentStyle]=\"'z-index: 100001'\"\n [helpText]=\"'Choose which posture checks to associate to this policy by picking from the list of available attributes'\"\n >\n <lib-tag-selector\n [(selectedRoleAttributes)]=\"selectedPostureRoleAttributes\"\n [(selectedNamedAttributes)]=\"selectedPostureNamedAttributes\"\n [(selectedRoleAttributes)]=\"svc.postureRoleAttributes\"\n [availableNamedAttributes]=\"svc.postureNamedAttributes\"\n (selectedNamedAttributesChange)=\"svc.getAssociatedPostureChecksByAttribute(selectedPostureRoleAttributes, selectedPostureNamedAttributes)\"\n (selectedRoleAttributesChange)=\"svc.getAssociatedPostureChecksByAttribute(selectedPostureRoleAttributes, selectedPostureNamedAttributes)\"\n [placeholder]=\"'Select posture check attributes'\"\n ></lib-tag-selector>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Type'\"\n [title2]=\"'Semantic'\"\n [layout]=\"'row'\"\n >\n <select\n [(ngModel)]=\"formData.type\"\n id=\"PolicyType\"\n class=\"form-field-dropdown\"\n >\n <option value=\"Bind\">Bind</option>\n <option value=\"Dial\">Dial</option>\n </select>\n <select\n [(ngModel)]=\"formData.semantic\"\n id=\"PolicySemantic\"\n class=\"form-field-dropdown\"\n >\n <option value=\"AnyOf\">AnyOf</option>\n <option value=\"AllOf\">AllOf</option>\n </select>\n </lib-form-field-container>\n <lib-form-field-toggle [(toggleOn)]=\"showMore\" (toggleOnChange)=\"showMoreChanged($event)\" style=\"margin: 0px 10px\"></lib-form-field-toggle>\n <div [hidden]=\"!showMore\" class=\"form-group-column\">\n <lib-form-field-container\n [title]=\"'Custom Tags'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n *ngIf=\"!hideTags\"\n >\n <lib-custom-tags [(tags)]=\"formData.tags\"></lib-custom-tags>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column two-fifths\">\n <lib-form-field-container\n [title]=\"'Associated Services'\"\n [count]=\"svc.associatedServiceNames.length\"\n [class]=\"'hide-overflow'\"\n [helpText]=\"'Preview list of all services that this Service Policy is associated with.'\"\n >\n <lib-preview-list\n [clickable]=\"false\"\n [isLoading]=\"servicesLoading\"\n [allNames]=\"svc.associatedServiceNames\"\n ></lib-preview-list>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Associated Identities'\"\n [count]=\"svc.associatedIdentityNames.length\"\n [helpText]=\"'Preview list of all Identities that this Service Policy is associated with.'\"\n >\n <lib-preview-list\n [clickable]=\"false\"\n [isLoading]=\"identitiesLoading\"\n [allNames]=\"svc.associatedIdentityNames\"\n ></lib-preview-list>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Associated Posture Checks'\"\n [count]=\"svc.associatedPostureCheckNames.length\"\n [helpText]=\"'Preview list of all Posture Checks that this Service Policy is associated with.'\"\n >\n <lib-preview-list\n [clickable]=\"false\"\n [isLoading]=\"postureChecksLoading\"\n [allNames]=\"svc.associatedPostureCheckNames\"\n ></lib-preview-list>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'API Calls'\"\n [headerActions]=\"apiOptions\"\n (actionRequested)=\"apiActionRequested($event)\"\n >\n <div class=\"form-row\">\n <input class=\"form-field-input\" [value]=\"apiCallURL\"/>\n <div class=\"icon-copy copy\" (click)=\"copyToClipboard(apiCallURL)\"></div>\n </div>\n <lib-json-view *ngIf=\"formData\" [(data)]=\"apiData\" [readOnly]=\"true\" [showCopy]=\"true\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>", styles: [""], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.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: i5.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: FormHeaderComponent, selector: "lib-form-header", inputs: ["data", "badges", "title", "moreActions", "formView", "saveDisabled", "saveTooltip", "actionButtonText", "moreActionsText", "showHeaderToggle", "showHeaderButton"], outputs: ["formViewChange", "actionRequested"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }, { kind: "component", type: PreviewListComponent, selector: "lib-preview-list", inputs: ["label", "clickable", "isLoading", "allNames", "items", "allowRemove", "tooltip", "showfilter"], outputs: ["itemSelected", "itemRemoved"] }, { kind: "component", type: LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }, { kind: "component", type: FormFieldToggleComponent, selector: "lib-form-field-toggle", inputs: ["label", "orientation", "labelOn", "labelOff", "toggleOn"], outputs: ["toggleOnChange"] }, { kind: "component", type: JsonViewComponent, selector: "lib-json-view", inputs: ["data", "schema", "readOnly", "jsonInvalid", "showCopy", "showLineNumbers"], outputs: ["dataChange", "jsonChange", "jsonInvalidChange"] }, { kind: "component", type: TagSelectorComponent, selector: "lib-tag-selector", inputs: ["placeholder", "disableField", "disableCreate", "hideOption", "isLoading", "errorMessage", "focusOnInit", "selectedRoleAttributes", "selectedNamedAttributes", "hasError", "availableRoleAttributes", "availableNamedAttributes"], outputs: ["addRoleAttribute", "addNamedAttribute", "roleAttributeRemoved", "namedAttributeRemoved", "selectedRoleAttributesChange", "selectedNamedAttributesChange", "filterChange"] }, { kind: "component", type: CustomTagsComponent, selector: "lib-custom-tags", inputs: ["tags"], outputs: ["tagsChange"] }] }); }
|
|
20714
|
+
], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"formData.id ? 'Edit Service Policy: ' : 'Create New Service Policy'\"\n [moreActions]=\"moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n ></lib-form-header>\n <div class=\"service-policy-form-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" *ngIf=\"formView === 'simple'\">\n <div class=\"form-group-column three-fifths\">\n <lib-form-field-container [title]=\"'Service Policy Name'\" [label]=\"'REQUIRED'\">\n <input\n class=\"form-field-input\"\n placeholder=\"Name this service policy\"\n [ngClass]=\"{error: errors['name']}\"\n [(ngModel)]=\"formData.name\"\n autofocus\n #nameFieldInput\n />\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Select Service Attributes'\"\n [label]=\"'OPTIONAL'\"\n [contentStyle]=\"'z-index: 100003'\"\n [helpText]=\"'Choose which services to associate to this policy by picking from the list of available attributes'\"\n >\n <lib-tag-selector\n [(selectedRoleAttributes)]=\"selectedServiceRoleAttributes\"\n [(selectedNamedAttributes)]=\"selectedServiceNamedAttributes\"\n [availableRoleAttributes]=\"svc.serviceRoleAttributes\"\n [availableNamedAttributes]=\"svc.serviceNamedAttributes\"\n (selectedNamedAttributesChange)=\"svc.getAssociatedServicesByAttribute(selectedServiceRoleAttributes, selectedServiceNamedAttributes)\"\n (selectedRoleAttributesChange)=\"svc.getAssociatedServicesByAttribute(selectedServiceRoleAttributes, selectedServiceNamedAttributes)\"\n [placeholder]=\"'Select service attributes'\"\n ></lib-tag-selector>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Select Identity Attributes'\"\n [label]=\"'OPTIONAL'\"\n [contentStyle]=\"'z-index: 100002'\"\n [helpText]=\"'Choose which identities to associate to this policy by picking from the list of available attributes'\"\n >\n <lib-tag-selector\n [(selectedRoleAttributes)]=\"selectedIdentityRoleAttributes\"\n [(selectedNamedAttributes)]=\"selectedIdentityNamedAttributes\"\n [availableRoleAttributes]=\"svc.identityRoleAttributes\"\n [availableNamedAttributes]=\"svc.identityNamedAttributes\"\n (selectedNamedAttributesChange)=\"svc.getAssociatedIdentitiesByAttribute(selectedIdentityRoleAttributes, selectedIdentityNamedAttributes)\"\n (selectedRoleAttributesChange)=\"svc.getAssociatedIdentitiesByAttribute(selectedIdentityRoleAttributes, selectedIdentityNamedAttributes)\"\n [placeholder]=\"'Select identity attributes'\"\n ></lib-tag-selector>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Select Posture Check Attributes'\"\n [label]=\"'OPTIONAL'\"\n [contentStyle]=\"'z-index: 100001'\"\n [helpText]=\"'Choose which posture checks to associate to this policy by picking from the list of available attributes'\"\n >\n <lib-tag-selector\n [(selectedRoleAttributes)]=\"selectedPostureRoleAttributes\"\n [(selectedNamedAttributes)]=\"selectedPostureNamedAttributes\"\n [(selectedRoleAttributes)]=\"svc.postureRoleAttributes\"\n [availableNamedAttributes]=\"svc.postureNamedAttributes\"\n (selectedNamedAttributesChange)=\"svc.getAssociatedPostureChecksByAttribute(selectedPostureRoleAttributes, selectedPostureNamedAttributes)\"\n (selectedRoleAttributesChange)=\"svc.getAssociatedPostureChecksByAttribute(selectedPostureRoleAttributes, selectedPostureNamedAttributes)\"\n [placeholder]=\"'Select posture check attributes'\"\n ></lib-tag-selector>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Type'\"\n [title2]=\"'Semantic'\"\n [layout]=\"'row'\"\n >\n <select\n [(ngModel)]=\"formData.type\"\n id=\"PolicyType\"\n class=\"form-field-dropdown\"\n >\n <option value=\"Bind\">Bind</option>\n <option value=\"Dial\">Dial</option>\n </select>\n <select\n [(ngModel)]=\"formData.semantic\"\n id=\"PolicySemantic\"\n class=\"form-field-dropdown\"\n >\n <option value=\"AnyOf\">AnyOf</option>\n <option value=\"AllOf\">AllOf</option>\n </select>\n </lib-form-field-container>\n <lib-form-field-toggle [(toggleOn)]=\"showMore\" (toggleOnChange)=\"showMoreChanged($event)\" style=\"margin: 0px 10px\"></lib-form-field-toggle>\n <div [hidden]=\"!showMore\" class=\"form-group-column\">\n <lib-form-field-container\n [title]=\"'Custom Tags'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n *ngIf=\"!hideTags\"\n >\n <lib-custom-tags [(tags)]=\"formData.tags\"></lib-custom-tags>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column two-fifths\">\n <lib-form-field-container\n [title]=\"'Associated Services'\"\n [count]=\"svc.associatedServiceNames.length\"\n [class]=\"'hide-overflow'\"\n [helpText]=\"'Preview list of all services that this Service Policy is associated with.'\"\n >\n <lib-preview-list\n [clickable]=\"false\"\n [isLoading]=\"servicesLoading\"\n [allNames]=\"svc.associatedServiceNames\"\n ></lib-preview-list>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Associated Identities'\"\n [count]=\"svc.associatedIdentityNames.length\"\n [helpText]=\"'Preview list of all Identities that this Service Policy is associated with.'\"\n >\n <lib-preview-list\n [clickable]=\"false\"\n [isLoading]=\"identitiesLoading\"\n [allNames]=\"svc.associatedIdentityNames\"\n ></lib-preview-list>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Associated Posture Checks'\"\n [count]=\"svc.associatedPostureCheckNames.length\"\n [helpText]=\"'Preview list of all Posture Checks that this Service Policy is associated with.'\"\n >\n <lib-preview-list\n [clickable]=\"false\"\n [isLoading]=\"postureChecksLoading\"\n [allNames]=\"svc.associatedPostureCheckNames\"\n ></lib-preview-list>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'API Calls'\"\n [headerActions]=\"apiOptions\"\n (actionRequested)=\"apiActionRequested($event)\"\n >\n <div class=\"form-row\">\n <input class=\"form-field-input\" [value]=\"apiCallURL\"/>\n <div class=\"icon-copy copy\" (click)=\"copyToClipboard(apiCallURL)\"></div>\n </div>\n <lib-json-view *ngIf=\"formData\" [(data)]=\"apiData\" [readOnly]=\"true\" [showCopy]=\"true\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>", styles: [""], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.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: i5.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: FormHeaderComponent, selector: "lib-form-header", inputs: ["data", "badges", "title", "moreActions", "formView", "saveDisabled", "saveTooltip", "actionButtonText", "moreActionsText", "showHeaderToggle", "showHeaderButton", "multiActions"], outputs: ["formViewChange", "actionRequested", "multiActionRequested"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }, { kind: "component", type: PreviewListComponent, selector: "lib-preview-list", inputs: ["label", "clickable", "isLoading", "allNames", "items", "allowRemove", "tooltip", "showfilter", "localFilter"], outputs: ["itemSelected", "itemRemoved", "filterChanged"] }, { kind: "component", type: LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }, { kind: "component", type: FormFieldToggleComponent, selector: "lib-form-field-toggle", inputs: ["label", "orientation", "labelOn", "labelOff", "toggleOn"], outputs: ["toggleOnChange"] }, { kind: "component", type: JsonViewComponent, selector: "lib-json-view", inputs: ["data", "schema", "readOnly", "jsonInvalid", "showCopy", "showLineNumbers"], outputs: ["dataChange", "jsonChange", "jsonInvalidChange"] }, { kind: "component", type: TagSelectorComponent, selector: "lib-tag-selector", inputs: ["placeholder", "disableField", "disableCreate", "hideOption", "isLoading", "errorMessage", "focusOnInit", "selectedRoleAttributes", "selectedNamedAttributes", "hasError", "availableRoleAttributes", "availableNamedAttributes"], outputs: ["addRoleAttribute", "addNamedAttribute", "roleAttributeRemoved", "namedAttributeRemoved", "selectedRoleAttributesChange", "selectedNamedAttributesChange", "filterChange"] }, { kind: "component", type: CustomTagsComponent, selector: "lib-custom-tags", inputs: ["tags"], outputs: ["tagsChange"] }] }); }
|
|
20175
20715
|
}
|
|
20176
20716
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ServicePolicyFormComponent, decorators: [{
|
|
20177
20717
|
type: Component,
|
|
@@ -20274,6 +20814,7 @@ class EdgeRouterPolicyFormService {
|
|
|
20274
20814
|
this.associatedEdgeRouterNames = [...this.associatedEdgeRouterNames, ...namedAttributes];
|
|
20275
20815
|
this.associatedEdgeRouterNames = sortBy(this.associatedEdgeRouterNames);
|
|
20276
20816
|
this.associatedEdgeRouterNames = sortedUniq(this.associatedEdgeRouterNames);
|
|
20817
|
+
this.associatedEdgeRouterNames = this.associatedEdgeRouterNames.filter(item => item !== undefined);
|
|
20277
20818
|
});
|
|
20278
20819
|
}
|
|
20279
20820
|
getAssociatedIdentitiesByAttribute(roleAttributes, namedAttributes) {
|
|
@@ -20293,6 +20834,7 @@ class EdgeRouterPolicyFormService {
|
|
|
20293
20834
|
this.associatedIdentityNames = [...this.associatedIdentityNames, ...namedAttributes];
|
|
20294
20835
|
this.associatedIdentityNames = sortBy(this.associatedIdentityNames);
|
|
20295
20836
|
this.associatedIdentityNames = sortedUniq(this.associatedIdentityNames);
|
|
20837
|
+
this.associatedIdentityNames = this.associatedIdentityNames.filter(item => item !== undefined);
|
|
20296
20838
|
});
|
|
20297
20839
|
}
|
|
20298
20840
|
getEdgeRouterRoleAttributes() {
|
|
@@ -20598,7 +21140,7 @@ ${this.formData.id ? '--request PATCH \\' : ''}
|
|
|
20598
21140
|
provide: MatDialogRef,
|
|
20599
21141
|
useValue: {}
|
|
20600
21142
|
}
|
|
20601
|
-
], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"formData.id ? 'Edit Edge Router Policy: ' : 'Create New Edge Router Policy'\"\n [moreActions]=\"moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n ></lib-form-header>\n <div class=\"edge-router-policy-form-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" *ngIf=\"formView === 'simple'\">\n <div class=\"form-group-column three-fifths\">\n <lib-form-field-container [title]=\"'Edge Router Policy Name'\" [label]=\"'REQUIRED'\">\n <input\n class=\"form-field-input\"\n placeholder=\"Name this edge router policy\"\n [ngClass]=\"{error: errors['name']}\"\n [(ngModel)]=\"formData.name\"\n autofocus\n #nameFieldInput\n />\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Select Edge Router Attributes'\"\n [label]=\"'OPTIONAL'\"\n [contentStyle]=\"'z-index: 100003'\"\n [helpText]=\"'Choose which edge router to associate to this policy by picking from the list of available attributes'\"\n >\n <lib-tag-selector\n [(selectedRoleAttributes)]=\"selectedEdgeRouterRoleAttributes\"\n [(selectedNamedAttributes)]=\"selectedEdgeRouterNamedAttributes\"\n [availableRoleAttributes]=\"svc.edgeRouterRoleAttributes\"\n [availableNamedAttributes]=\"svc.edgeRouterNamedAttributes\"\n (selectedNamedAttributesChange)=\"svc.getAssociatedEdgeRoutersByAttribute(selectedEdgeRouterRoleAttributes, selectedEdgeRouterNamedAttributes)\"\n (selectedRoleAttributesChange)=\"svc.getAssociatedEdgeRoutersByAttribute(selectedEdgeRouterRoleAttributes, selectedEdgeRouterNamedAttributes)\"\n [placeholder]=\"'Select edge router attributes'\"\n ></lib-tag-selector>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Select Identity Attributes'\"\n [label]=\"'OPTIONAL'\"\n [contentStyle]=\"'z-index: 100002'\"\n [helpText]=\"'Choose which identities to associate to this policy by picking from the list of available attributes'\"\n >\n <lib-tag-selector\n [(selectedRoleAttributes)]=\"selectedIdentityRoleAttributes\"\n [(selectedNamedAttributes)]=\"selectedIdentityNamedAttributes\"\n [availableRoleAttributes]=\"svc.identityRoleAttributes\"\n [availableNamedAttributes]=\"svc.identityNamedAttributes\"\n (selectedNamedAttributesChange)=\"svc.getAssociatedIdentitiesByAttribute(selectedIdentityRoleAttributes, selectedIdentityNamedAttributes)\"\n (selectedRoleAttributesChange)=\"svc.getAssociatedIdentitiesByAttribute(selectedIdentityRoleAttributes, selectedIdentityNamedAttributes)\"\n [placeholder]=\"'Select identity attributes'\"\n ></lib-tag-selector>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Semantic'\"\n [layout]=\"'row'\"\n >\n <select\n [(ngModel)]=\"formData.semantic\"\n id=\"PolicySemantic\"\n class=\"form-field-dropdown\"\n >\n <option value=\"AnyOf\">AnyOf</option>\n <option value=\"AllOf\">AllOf</option>\n </select>\n </lib-form-field-container>\n <lib-form-field-toggle [(toggleOn)]=\"showMore\" (toggleOnChange)=\"showMoreChanged($event)\" style=\"margin: 0px 10px\"></lib-form-field-toggle>\n <div [hidden]=\"!showMore\" class=\"form-group-column\">\n <lib-form-field-container\n [title]=\"'Custom Tags'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n *ngIf=\"!hideTags\"\n >\n <lib-custom-tags [(tags)]=\"formData.tags\"></lib-custom-tags>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column two-fifths\">\n <lib-form-field-container\n [title]=\"'Associated Edge Routers'\"\n [count]=\"svc.associatedEdgeRouterNames.length\"\n [class]=\"'hide-overflow'\"\n [helpText]=\"'Preview list of all Edge Routers that this Edge Router Policy is associated with.'\"\n >\n <lib-preview-list\n [clickable]=\"false\"\n [isLoading]=\"edgeRoutersLoading\"\n [allNames]=\"svc.associatedEdgeRouterNames\"\n ></lib-preview-list>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Associated Identities'\"\n [count]=\"svc.associatedIdentityNames.length\"\n [helpText]=\"'Preview list of all Identities that this Edge Router Policy is associated with.'\"\n >\n <lib-preview-list\n [clickable]=\"false\"\n [isLoading]=\"identitiesLoading\"\n [allNames]=\"svc.associatedIdentityNames\"\n ></lib-preview-list>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'API Calls'\"\n [headerActions]=\"apiOptions\"\n (actionRequested)=\"apiActionRequested($event)\"\n >\n <div class=\"form-row\">\n <input class=\"form-field-input\" [value]=\"apiCallURL\"/>\n <div class=\"icon-copy copy\" (click)=\"copyToClipboard(apiCallURL)\"></div>\n </div>\n <lib-json-view *ngIf=\"formData\" [(data)]=\"apiData\" [readOnly]=\"true\" [showCopy]=\"true\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>", styles: [""], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.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: i5.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: FormHeaderComponent, selector: "lib-form-header", inputs: ["data", "badges", "title", "moreActions", "formView", "saveDisabled", "saveTooltip", "actionButtonText", "moreActionsText", "showHeaderToggle", "showHeaderButton"], outputs: ["formViewChange", "actionRequested"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }, { kind: "component", type: PreviewListComponent, selector: "lib-preview-list", inputs: ["label", "clickable", "isLoading", "allNames", "items", "allowRemove", "tooltip", "showfilter"], outputs: ["itemSelected", "itemRemoved"] }, { kind: "component", type: LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }, { kind: "component", type: FormFieldToggleComponent, selector: "lib-form-field-toggle", inputs: ["label", "orientation", "labelOn", "labelOff", "toggleOn"], outputs: ["toggleOnChange"] }, { kind: "component", type: JsonViewComponent, selector: "lib-json-view", inputs: ["data", "schema", "readOnly", "jsonInvalid", "showCopy", "showLineNumbers"], outputs: ["dataChange", "jsonChange", "jsonInvalidChange"] }, { kind: "component", type: TagSelectorComponent, selector: "lib-tag-selector", inputs: ["placeholder", "disableField", "disableCreate", "hideOption", "isLoading", "errorMessage", "focusOnInit", "selectedRoleAttributes", "selectedNamedAttributes", "hasError", "availableRoleAttributes", "availableNamedAttributes"], outputs: ["addRoleAttribute", "addNamedAttribute", "roleAttributeRemoved", "namedAttributeRemoved", "selectedRoleAttributesChange", "selectedNamedAttributesChange", "filterChange"] }, { kind: "component", type: CustomTagsComponent, selector: "lib-custom-tags", inputs: ["tags"], outputs: ["tagsChange"] }] }); }
|
|
21143
|
+
], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"formData.id ? 'Edit Edge Router Policy: ' : 'Create New Edge Router Policy'\"\n [moreActions]=\"moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n ></lib-form-header>\n <div class=\"edge-router-policy-form-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" *ngIf=\"formView === 'simple'\">\n <div class=\"form-group-column three-fifths\">\n <lib-form-field-container [title]=\"'Edge Router Policy Name'\" [label]=\"'REQUIRED'\">\n <input\n class=\"form-field-input\"\n placeholder=\"Name this edge router policy\"\n [ngClass]=\"{error: errors['name']}\"\n [(ngModel)]=\"formData.name\"\n autofocus\n #nameFieldInput\n />\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Select Edge Router Attributes'\"\n [label]=\"'OPTIONAL'\"\n [contentStyle]=\"'z-index: 100003'\"\n [helpText]=\"'Choose which edge router to associate to this policy by picking from the list of available attributes'\"\n >\n <lib-tag-selector\n [(selectedRoleAttributes)]=\"selectedEdgeRouterRoleAttributes\"\n [(selectedNamedAttributes)]=\"selectedEdgeRouterNamedAttributes\"\n [availableRoleAttributes]=\"svc.edgeRouterRoleAttributes\"\n [availableNamedAttributes]=\"svc.edgeRouterNamedAttributes\"\n (selectedNamedAttributesChange)=\"svc.getAssociatedEdgeRoutersByAttribute(selectedEdgeRouterRoleAttributes, selectedEdgeRouterNamedAttributes)\"\n (selectedRoleAttributesChange)=\"svc.getAssociatedEdgeRoutersByAttribute(selectedEdgeRouterRoleAttributes, selectedEdgeRouterNamedAttributes)\"\n [placeholder]=\"'Select edge router attributes'\"\n ></lib-tag-selector>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Select Identity Attributes'\"\n [label]=\"'OPTIONAL'\"\n [contentStyle]=\"'z-index: 100002'\"\n [helpText]=\"'Choose which identities to associate to this policy by picking from the list of available attributes'\"\n >\n <lib-tag-selector\n [(selectedRoleAttributes)]=\"selectedIdentityRoleAttributes\"\n [(selectedNamedAttributes)]=\"selectedIdentityNamedAttributes\"\n [availableRoleAttributes]=\"svc.identityRoleAttributes\"\n [availableNamedAttributes]=\"svc.identityNamedAttributes\"\n (selectedNamedAttributesChange)=\"svc.getAssociatedIdentitiesByAttribute(selectedIdentityRoleAttributes, selectedIdentityNamedAttributes)\"\n (selectedRoleAttributesChange)=\"svc.getAssociatedIdentitiesByAttribute(selectedIdentityRoleAttributes, selectedIdentityNamedAttributes)\"\n [placeholder]=\"'Select identity attributes'\"\n ></lib-tag-selector>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Semantic'\"\n [layout]=\"'row'\"\n >\n <select\n [(ngModel)]=\"formData.semantic\"\n id=\"PolicySemantic\"\n class=\"form-field-dropdown\"\n >\n <option value=\"AnyOf\">AnyOf</option>\n <option value=\"AllOf\">AllOf</option>\n </select>\n </lib-form-field-container>\n <lib-form-field-toggle [(toggleOn)]=\"showMore\" (toggleOnChange)=\"showMoreChanged($event)\" style=\"margin: 0px 10px\"></lib-form-field-toggle>\n <div [hidden]=\"!showMore\" class=\"form-group-column\">\n <lib-form-field-container\n [title]=\"'Custom Tags'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n *ngIf=\"!hideTags\"\n >\n <lib-custom-tags [(tags)]=\"formData.tags\"></lib-custom-tags>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column two-fifths\">\n <lib-form-field-container\n [title]=\"'Associated Edge Routers'\"\n [count]=\"svc.associatedEdgeRouterNames.length\"\n [class]=\"'hide-overflow'\"\n [helpText]=\"'Preview list of all Edge Routers that this Edge Router Policy is associated with.'\"\n >\n <lib-preview-list\n [clickable]=\"false\"\n [isLoading]=\"edgeRoutersLoading\"\n [allNames]=\"svc.associatedEdgeRouterNames\"\n ></lib-preview-list>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Associated Identities'\"\n [count]=\"svc.associatedIdentityNames.length\"\n [helpText]=\"'Preview list of all Identities that this Edge Router Policy is associated with.'\"\n >\n <lib-preview-list\n [clickable]=\"false\"\n [isLoading]=\"identitiesLoading\"\n [allNames]=\"svc.associatedIdentityNames\"\n ></lib-preview-list>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'API Calls'\"\n [headerActions]=\"apiOptions\"\n (actionRequested)=\"apiActionRequested($event)\"\n >\n <div class=\"form-row\">\n <input class=\"form-field-input\" [value]=\"apiCallURL\"/>\n <div class=\"icon-copy copy\" (click)=\"copyToClipboard(apiCallURL)\"></div>\n </div>\n <lib-json-view *ngIf=\"formData\" [(data)]=\"apiData\" [readOnly]=\"true\" [showCopy]=\"true\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>", styles: [""], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.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: i5.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: FormHeaderComponent, selector: "lib-form-header", inputs: ["data", "badges", "title", "moreActions", "formView", "saveDisabled", "saveTooltip", "actionButtonText", "moreActionsText", "showHeaderToggle", "showHeaderButton", "multiActions"], outputs: ["formViewChange", "actionRequested", "multiActionRequested"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }, { kind: "component", type: PreviewListComponent, selector: "lib-preview-list", inputs: ["label", "clickable", "isLoading", "allNames", "items", "allowRemove", "tooltip", "showfilter", "localFilter"], outputs: ["itemSelected", "itemRemoved", "filterChanged"] }, { kind: "component", type: LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }, { kind: "component", type: FormFieldToggleComponent, selector: "lib-form-field-toggle", inputs: ["label", "orientation", "labelOn", "labelOff", "toggleOn"], outputs: ["toggleOnChange"] }, { kind: "component", type: JsonViewComponent, selector: "lib-json-view", inputs: ["data", "schema", "readOnly", "jsonInvalid", "showCopy", "showLineNumbers"], outputs: ["dataChange", "jsonChange", "jsonInvalidChange"] }, { kind: "component", type: TagSelectorComponent, selector: "lib-tag-selector", inputs: ["placeholder", "disableField", "disableCreate", "hideOption", "isLoading", "errorMessage", "focusOnInit", "selectedRoleAttributes", "selectedNamedAttributes", "hasError", "availableRoleAttributes", "availableNamedAttributes"], outputs: ["addRoleAttribute", "addNamedAttribute", "roleAttributeRemoved", "namedAttributeRemoved", "selectedRoleAttributesChange", "selectedNamedAttributesChange", "filterChange"] }, { kind: "component", type: CustomTagsComponent, selector: "lib-custom-tags", inputs: ["tags"], outputs: ["tagsChange"] }] }); }
|
|
20602
21144
|
}
|
|
20603
21145
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: EdgeRouterPolicyFormComponent, decorators: [{
|
|
20604
21146
|
type: Component,
|
|
@@ -21159,6 +21701,7 @@ class ServiceEdgeRouterPolicyFormService {
|
|
|
21159
21701
|
this.associatedEdgeRouterNames = [...this.associatedEdgeRouterNames, ...namedAttributes];
|
|
21160
21702
|
this.associatedEdgeRouterNames = sortBy(this.associatedEdgeRouterNames);
|
|
21161
21703
|
this.associatedEdgeRouterNames = sortedUniq(this.associatedEdgeRouterNames);
|
|
21704
|
+
this.associatedEdgeRouterNames = this.associatedEdgeRouterNames.filter(item => item !== undefined);
|
|
21162
21705
|
});
|
|
21163
21706
|
}
|
|
21164
21707
|
getAssociatedServicesByAttribute(roleAttributes, namedAttributes) {
|
|
@@ -21178,6 +21721,7 @@ class ServiceEdgeRouterPolicyFormService {
|
|
|
21178
21721
|
this.associatedServiceNames = [...this.associatedServiceNames, ...namedAttributes];
|
|
21179
21722
|
this.associatedServiceNames = sortBy(this.associatedServiceNames);
|
|
21180
21723
|
this.associatedServiceNames = sortedUniq(this.associatedServiceNames);
|
|
21724
|
+
this.associatedServiceNames = this.associatedServiceNames.filter(item => item !== undefined);
|
|
21181
21725
|
});
|
|
21182
21726
|
}
|
|
21183
21727
|
getEdgeRouterRoleAttributes() {
|
|
@@ -21481,7 +22025,7 @@ ${this.formData.id ? '--request PATCH \\' : ''}
|
|
|
21481
22025
|
provide: MatDialogRef,
|
|
21482
22026
|
useValue: {}
|
|
21483
22027
|
}
|
|
21484
|
-
], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"formData.id ? 'Edit Service Edge Router Policy: ' : 'Create New Service Edge Router Policy'\"\n [moreActions]=\"moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n ></lib-form-header>\n <div class=\"service-edge-router-policy-form-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" *ngIf=\"formView === 'simple'\">\n <div class=\"form-group-column three-fifths\">\n <lib-form-field-container [title]=\"'Service Edge Router Policy Name'\" [label]=\"'REQUIRED'\">\n <input\n class=\"form-field-input\"\n placeholder=\"Name this service edge router policy\"\n [ngClass]=\"{error: errors['name']}\"\n [(ngModel)]=\"formData.name\"\n autofocus\n #nameFieldInput\n />\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Select Edge Router Attributes'\"\n [label]=\"'OPTIONAL'\"\n [contentStyle]=\"'z-index: 100003'\"\n [helpText]=\"'Choose which edge router to associate to this policy by picking from the list of available attributes'\"\n >\n <lib-tag-selector\n [(selectedRoleAttributes)]=\"selectedEdgeRouterRoleAttributes\"\n [(selectedNamedAttributes)]=\"selectedEdgeRouterNamedAttributes\"\n [availableRoleAttributes]=\"svc.edgeRouterRoleAttributes\"\n [availableNamedAttributes]=\"svc.edgeRouterNamedAttributes\"\n (selectedNamedAttributesChange)=\"svc.getAssociatedEdgeRoutersByAttribute(selectedEdgeRouterRoleAttributes, selectedEdgeRouterNamedAttributes)\"\n (selectedRoleAttributesChange)=\"svc.getAssociatedEdgeRoutersByAttribute(selectedEdgeRouterRoleAttributes, selectedEdgeRouterNamedAttributes)\"\n [placeholder]=\"'Select edge router attributes'\"\n ></lib-tag-selector>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Select Service Attributes'\"\n [label]=\"'OPTIONAL'\"\n [contentStyle]=\"'z-index: 100002'\"\n [helpText]=\"'Choose which services to associate to this policy by picking from the list of available attributes'\"\n >\n <lib-tag-selector\n [(selectedRoleAttributes)]=\"selectedServiceRoleAttributes\"\n [(selectedNamedAttributes)]=\"selectedServiceNamedAttributes\"\n [availableRoleAttributes]=\"svc.serviceRoleAttributes\"\n [availableNamedAttributes]=\"svc.serviceNamedAttributes\"\n (selectedNamedAttributesChange)=\"svc.getAssociatedServicesByAttribute(selectedServiceRoleAttributes, selectedServiceNamedAttributes)\"\n (selectedRoleAttributesChange)=\"svc.getAssociatedServicesByAttribute(selectedServiceRoleAttributes, selectedServiceNamedAttributes)\"\n [placeholder]=\"'Select service attributes'\"\n ></lib-tag-selector>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Semantic'\"\n [layout]=\"'row'\"\n >\n <select\n [(ngModel)]=\"formData.semantic\"\n id=\"PolicySemantic\"\n class=\"form-field-dropdown\"\n >\n <option value=\"AnyOf\">AnyOf</option>\n <option value=\"AllOf\">AllOf</option>\n </select>\n </lib-form-field-container>\n <lib-form-field-toggle [(toggleOn)]=\"showMore\" (toggleOnChange)=\"showMoreChanged($event)\" style=\"margin: 0px 10px\"></lib-form-field-toggle>\n <div [hidden]=\"!showMore\" class=\"form-group-column\">\n <lib-form-field-container\n [title]=\"'Custom Tags'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n *ngIf=\"!hideTags\"\n >\n <lib-custom-tags [(tags)]=\"formData.tags\"></lib-custom-tags>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column two-fifths\">\n <lib-form-field-container\n [title]=\"'Associated Edge Routers'\"\n [count]=\"svc.associatedEdgeRouterNames.length\"\n [class]=\"'hide-overflow'\"\n [helpText]=\"'Preview list of all Edge Routers that this Service Edge Router Policy is associated with.'\"\n >\n <lib-preview-list\n [clickable]=\"false\"\n [isLoading]=\"edgeRoutersLoading\"\n [allNames]=\"svc.associatedEdgeRouterNames\"\n ></lib-preview-list>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Associated Services'\"\n [count]=\"svc.associatedServiceNames.length\"\n [helpText]=\"'Preview list of all Services that this Service Edge Router Policy is associated with.'\"\n >\n <lib-preview-list\n [clickable]=\"false\"\n [isLoading]=\"servicesLoading\"\n [allNames]=\"svc.associatedServiceNames\"\n ></lib-preview-list>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'API Calls'\"\n [headerActions]=\"apiOptions\"\n (actionRequested)=\"apiActionRequested($event)\"\n >\n <div class=\"form-row\">\n <input class=\"form-field-input\" [value]=\"apiCallURL\"/>\n <div class=\"icon-copy copy\" (click)=\"copyToClipboard(apiCallURL)\"></div>\n </div>\n <lib-json-view *ngIf=\"formData\" [(data)]=\"apiData\" [readOnly]=\"true\" [showCopy]=\"true\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>", styles: [""], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.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: i5.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: FormHeaderComponent, selector: "lib-form-header", inputs: ["data", "badges", "title", "moreActions", "formView", "saveDisabled", "saveTooltip", "actionButtonText", "moreActionsText", "showHeaderToggle", "showHeaderButton"], outputs: ["formViewChange", "actionRequested"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }, { kind: "component", type: PreviewListComponent, selector: "lib-preview-list", inputs: ["label", "clickable", "isLoading", "allNames", "items", "allowRemove", "tooltip", "showfilter"], outputs: ["itemSelected", "itemRemoved"] }, { kind: "component", type: LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }, { kind: "component", type: FormFieldToggleComponent, selector: "lib-form-field-toggle", inputs: ["label", "orientation", "labelOn", "labelOff", "toggleOn"], outputs: ["toggleOnChange"] }, { kind: "component", type: JsonViewComponent, selector: "lib-json-view", inputs: ["data", "schema", "readOnly", "jsonInvalid", "showCopy", "showLineNumbers"], outputs: ["dataChange", "jsonChange", "jsonInvalidChange"] }, { kind: "component", type: TagSelectorComponent, selector: "lib-tag-selector", inputs: ["placeholder", "disableField", "disableCreate", "hideOption", "isLoading", "errorMessage", "focusOnInit", "selectedRoleAttributes", "selectedNamedAttributes", "hasError", "availableRoleAttributes", "availableNamedAttributes"], outputs: ["addRoleAttribute", "addNamedAttribute", "roleAttributeRemoved", "namedAttributeRemoved", "selectedRoleAttributesChange", "selectedNamedAttributesChange", "filterChange"] }, { kind: "component", type: CustomTagsComponent, selector: "lib-custom-tags", inputs: ["tags"], outputs: ["tagsChange"] }] }); }
|
|
22028
|
+
], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"formData.id ? 'Edit Service Edge Router Policy: ' : 'Create New Service Edge Router Policy'\"\n [moreActions]=\"moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n ></lib-form-header>\n <div class=\"service-edge-router-policy-form-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" *ngIf=\"formView === 'simple'\">\n <div class=\"form-group-column three-fifths\">\n <lib-form-field-container [title]=\"'Service Edge Router Policy Name'\" [label]=\"'REQUIRED'\">\n <input\n class=\"form-field-input\"\n placeholder=\"Name this service edge router policy\"\n [ngClass]=\"{error: errors['name']}\"\n [(ngModel)]=\"formData.name\"\n autofocus\n #nameFieldInput\n />\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Select Edge Router Attributes'\"\n [label]=\"'OPTIONAL'\"\n [contentStyle]=\"'z-index: 100003'\"\n [helpText]=\"'Choose which edge router to associate to this policy by picking from the list of available attributes'\"\n >\n <lib-tag-selector\n [(selectedRoleAttributes)]=\"selectedEdgeRouterRoleAttributes\"\n [(selectedNamedAttributes)]=\"selectedEdgeRouterNamedAttributes\"\n [availableRoleAttributes]=\"svc.edgeRouterRoleAttributes\"\n [availableNamedAttributes]=\"svc.edgeRouterNamedAttributes\"\n (selectedNamedAttributesChange)=\"svc.getAssociatedEdgeRoutersByAttribute(selectedEdgeRouterRoleAttributes, selectedEdgeRouterNamedAttributes)\"\n (selectedRoleAttributesChange)=\"svc.getAssociatedEdgeRoutersByAttribute(selectedEdgeRouterRoleAttributes, selectedEdgeRouterNamedAttributes)\"\n [placeholder]=\"'Select edge router attributes'\"\n ></lib-tag-selector>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Select Service Attributes'\"\n [label]=\"'OPTIONAL'\"\n [contentStyle]=\"'z-index: 100002'\"\n [helpText]=\"'Choose which services to associate to this policy by picking from the list of available attributes'\"\n >\n <lib-tag-selector\n [(selectedRoleAttributes)]=\"selectedServiceRoleAttributes\"\n [(selectedNamedAttributes)]=\"selectedServiceNamedAttributes\"\n [availableRoleAttributes]=\"svc.serviceRoleAttributes\"\n [availableNamedAttributes]=\"svc.serviceNamedAttributes\"\n (selectedNamedAttributesChange)=\"svc.getAssociatedServicesByAttribute(selectedServiceRoleAttributes, selectedServiceNamedAttributes)\"\n (selectedRoleAttributesChange)=\"svc.getAssociatedServicesByAttribute(selectedServiceRoleAttributes, selectedServiceNamedAttributes)\"\n [placeholder]=\"'Select service attributes'\"\n ></lib-tag-selector>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Semantic'\"\n [layout]=\"'row'\"\n >\n <select\n [(ngModel)]=\"formData.semantic\"\n id=\"PolicySemantic\"\n class=\"form-field-dropdown\"\n >\n <option value=\"AnyOf\">AnyOf</option>\n <option value=\"AllOf\">AllOf</option>\n </select>\n </lib-form-field-container>\n <lib-form-field-toggle [(toggleOn)]=\"showMore\" (toggleOnChange)=\"showMoreChanged($event)\" style=\"margin: 0px 10px\"></lib-form-field-toggle>\n <div [hidden]=\"!showMore\" class=\"form-group-column\">\n <lib-form-field-container\n [title]=\"'Custom Tags'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n *ngIf=\"!hideTags\"\n >\n <lib-custom-tags [(tags)]=\"formData.tags\"></lib-custom-tags>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column two-fifths\">\n <lib-form-field-container\n [title]=\"'Associated Edge Routers'\"\n [count]=\"svc.associatedEdgeRouterNames.length\"\n [class]=\"'hide-overflow'\"\n [helpText]=\"'Preview list of all Edge Routers that this Service Edge Router Policy is associated with.'\"\n >\n <lib-preview-list\n [clickable]=\"false\"\n [isLoading]=\"edgeRoutersLoading\"\n [allNames]=\"svc.associatedEdgeRouterNames\"\n ></lib-preview-list>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Associated Services'\"\n [count]=\"svc.associatedServiceNames.length\"\n [helpText]=\"'Preview list of all Services that this Service Edge Router Policy is associated with.'\"\n >\n <lib-preview-list\n [clickable]=\"false\"\n [isLoading]=\"servicesLoading\"\n [allNames]=\"svc.associatedServiceNames\"\n ></lib-preview-list>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'API Calls'\"\n [headerActions]=\"apiOptions\"\n (actionRequested)=\"apiActionRequested($event)\"\n >\n <div class=\"form-row\">\n <input class=\"form-field-input\" [value]=\"apiCallURL\"/>\n <div class=\"icon-copy copy\" (click)=\"copyToClipboard(apiCallURL)\"></div>\n </div>\n <lib-json-view *ngIf=\"formData\" [(data)]=\"apiData\" [readOnly]=\"true\" [showCopy]=\"true\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>", styles: [""], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.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: i5.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: FormHeaderComponent, selector: "lib-form-header", inputs: ["data", "badges", "title", "moreActions", "formView", "saveDisabled", "saveTooltip", "actionButtonText", "moreActionsText", "showHeaderToggle", "showHeaderButton", "multiActions"], outputs: ["formViewChange", "actionRequested", "multiActionRequested"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }, { kind: "component", type: PreviewListComponent, selector: "lib-preview-list", inputs: ["label", "clickable", "isLoading", "allNames", "items", "allowRemove", "tooltip", "showfilter", "localFilter"], outputs: ["itemSelected", "itemRemoved", "filterChanged"] }, { kind: "component", type: LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }, { kind: "component", type: FormFieldToggleComponent, selector: "lib-form-field-toggle", inputs: ["label", "orientation", "labelOn", "labelOff", "toggleOn"], outputs: ["toggleOnChange"] }, { kind: "component", type: JsonViewComponent, selector: "lib-json-view", inputs: ["data", "schema", "readOnly", "jsonInvalid", "showCopy", "showLineNumbers"], outputs: ["dataChange", "jsonChange", "jsonInvalidChange"] }, { kind: "component", type: TagSelectorComponent, selector: "lib-tag-selector", inputs: ["placeholder", "disableField", "disableCreate", "hideOption", "isLoading", "errorMessage", "focusOnInit", "selectedRoleAttributes", "selectedNamedAttributes", "hasError", "availableRoleAttributes", "availableNamedAttributes"], outputs: ["addRoleAttribute", "addNamedAttribute", "roleAttributeRemoved", "namedAttributeRemoved", "selectedRoleAttributesChange", "selectedNamedAttributesChange", "filterChange"] }, { kind: "component", type: CustomTagsComponent, selector: "lib-custom-tags", inputs: ["tags"], outputs: ["tagsChange"] }] }); }
|
|
21485
22029
|
}
|
|
21486
22030
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ServiceEdgeRouterPolicyFormComponent, decorators: [{
|
|
21487
22031
|
type: Component,
|
|
@@ -21805,11 +22349,11 @@ class TerminatorsPageComponent extends ListPageComponent {
|
|
|
21805
22349
|
this.formDataChanged = event;
|
|
21806
22350
|
}
|
|
21807
22351
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TerminatorsPageComponent, deps: [{ token: TerminatorsPageService }, { token: DataTableFilterService }, { token: TabNameService }, { token: ConsoleEventsService }, { token: i5$1.MatDialog }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
21808
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TerminatorsPageComponent, selector: "lib-configurations", usesInheritance: true, ngImport: i0, template: "<div class=\"ziti-page-container ziti-terminators-container\">\n <lib-list-page-header [title]=\"title\"\n [tabs]=\"tabs\"\n [hideAction]=\"true\"\n (actionClicked)=\"headerActionClicked($event)\"></lib-list-page-header>\n <lib-data-table [tableId]=\"'terminators'\"\n [rowData]=\"rowData\"\n [columnDefinitions]=\"columnDefs\"\n (actionRequested)=\"tableAction($event)\"\n [startCount]=\"startCount\"\n [endCount]=\"endCount\"\n [totalCount]=\"totalCount\"\n [emptyMsg]=\"'No terminators defined, Click the plus to add a terminator.'\"\n [filterApplied]=\"filterApplied\"\n [filterName]=\"'Address'\"\n [filterColumn]=\"'address'\"\n [menuItems]=\"svc.menuItems\"\n (gridReady)=\"gridReady($event)\"\n [options]=\"{noSelect: true, noMenu: false}\"\n >\n </lib-data-table>\n</div>\n", styles: [""], dependencies: [{ kind: "component", type: ListPageHeaderComponent, selector: "lib-list-page-header", inputs: ["title", "tabs", "showAdd", "hideAction"], outputs: ["actionClicked"] }, { kind: "component", type: DataTableComponent, selector: "lib-data-table", inputs: ["rowData", "expandRowData", "collapseRowData", "rowValidation", "isTimeSearchAvailable", "isLoading", "tableId", "options", "validateService", "rowsToggled", "tableRefreshCount", "view", "serverSideDataSource", "allowDownload", "startCount", "endCount", "totalCount", "emptyMsg", "filterApplied", "menuItems", "headerActions", "noItemsClass", "entityTypeName", "showNoItemsAdd", "currentPage", "noItemsImage", "rowHeight", "filterName", "filterColumn", "columnDefinitions", "refreshCount"], outputs: ["actionRequested", "gridReady", "dragStart", "dragLeave", "pageChanged"] }] }); }
|
|
22352
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: TerminatorsPageComponent, selector: "lib-configurations", usesInheritance: true, ngImport: i0, template: "<div class=\"ziti-page-container ziti-terminators-container\">\n <lib-list-page-header [title]=\"title\"\n [tabs]=\"tabs\"\n [hideAction]=\"true\"\n (actionClicked)=\"headerActionClicked($event)\"></lib-list-page-header>\n <lib-data-table [tableId]=\"'terminators'\"\n [rowData]=\"rowData\"\n [columnDefinitions]=\"columnDefs\"\n (actionRequested)=\"tableAction($event)\"\n [startCount]=\"startCount\"\n [endCount]=\"endCount\"\n [totalCount]=\"totalCount\"\n [emptyMsg]=\"'No terminators defined, Click the plus to add a terminator.'\"\n [filterApplied]=\"filterApplied\"\n [filterName]=\"'Address'\"\n [filterColumn]=\"'address'\"\n [menuItems]=\"svc.menuItems\"\n (gridReady)=\"gridReady($event)\"\n [options]=\"{noSelect: true, noMenu: false}\"\n >\n </lib-data-table>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>\n", styles: [""], dependencies: [{ kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ListPageHeaderComponent, selector: "lib-list-page-header", inputs: ["title", "tabs", "showAdd", "hideAction"], outputs: ["actionClicked"] }, { kind: "component", type: DataTableComponent, selector: "lib-data-table", inputs: ["rowData", "expandRowData", "collapseRowData", "rowValidation", "isTimeSearchAvailable", "isLoading", "tableId", "options", "validateService", "rowsToggled", "tableRefreshCount", "view", "serverSideDataSource", "allowDownload", "startCount", "endCount", "totalCount", "emptyMsg", "filterApplied", "menuItems", "headerActions", "noItemsClass", "entityTypeName", "showNoItemsAdd", "currentPage", "noItemsImage", "rowHeight", "filterName", "filterColumn", "columnDefinitions", "refreshCount"], outputs: ["actionRequested", "gridReady", "dragStart", "dragLeave", "pageChanged"] }, { kind: "component", type: LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }] }); }
|
|
21809
22353
|
}
|
|
21810
22354
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TerminatorsPageComponent, decorators: [{
|
|
21811
22355
|
type: Component,
|
|
21812
|
-
args: [{ selector: 'lib-configurations', template: "<div class=\"ziti-page-container ziti-terminators-container\">\n <lib-list-page-header [title]=\"title\"\n [tabs]=\"tabs\"\n [hideAction]=\"true\"\n (actionClicked)=\"headerActionClicked($event)\"></lib-list-page-header>\n <lib-data-table [tableId]=\"'terminators'\"\n [rowData]=\"rowData\"\n [columnDefinitions]=\"columnDefs\"\n (actionRequested)=\"tableAction($event)\"\n [startCount]=\"startCount\"\n [endCount]=\"endCount\"\n [totalCount]=\"totalCount\"\n [emptyMsg]=\"'No terminators defined, Click the plus to add a terminator.'\"\n [filterApplied]=\"filterApplied\"\n [filterName]=\"'Address'\"\n [filterColumn]=\"'address'\"\n [menuItems]=\"svc.menuItems\"\n (gridReady)=\"gridReady($event)\"\n [options]=\"{noSelect: true, noMenu: false}\"\n >\n </lib-data-table>\n</div>\n" }]
|
|
22356
|
+
args: [{ selector: 'lib-configurations', template: "<div class=\"ziti-page-container ziti-terminators-container\">\n <lib-list-page-header [title]=\"title\"\n [tabs]=\"tabs\"\n [hideAction]=\"true\"\n (actionClicked)=\"headerActionClicked($event)\"></lib-list-page-header>\n <lib-data-table [tableId]=\"'terminators'\"\n [rowData]=\"rowData\"\n [columnDefinitions]=\"columnDefs\"\n (actionRequested)=\"tableAction($event)\"\n [startCount]=\"startCount\"\n [endCount]=\"endCount\"\n [totalCount]=\"totalCount\"\n [emptyMsg]=\"'No terminators defined, Click the plus to add a terminator.'\"\n [filterApplied]=\"filterApplied\"\n [filterName]=\"'Address'\"\n [filterColumn]=\"'address'\"\n [menuItems]=\"svc.menuItems\"\n (gridReady)=\"gridReady($event)\"\n [options]=\"{noSelect: true, noMenu: false}\"\n >\n </lib-data-table>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>\n" }]
|
|
21813
22357
|
}], ctorParameters: function () { return [{ type: TerminatorsPageService }, { type: DataTableFilterService }, { type: TabNameService }, { type: ConsoleEventsService }, { type: i5$1.MatDialog }]; } });
|
|
21814
22358
|
|
|
21815
22359
|
class Config {
|
|
@@ -22175,7 +22719,7 @@ class ConfigurationFormComponent extends ProjectableForm {
|
|
|
22175
22719
|
this._apiData = cloneDeep(this.apiData);
|
|
22176
22720
|
}
|
|
22177
22721
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ConfigurationFormComponent, deps: [{ token: ConfigurationService }, { token: SchemaService }, { token: GrowlerService }, { token: SHAREDZ_EXTENSION }, { token: SETTINGS_SERVICE }, { token: ZITI_DATA_SERVICE }, { token: i4.Router }, { token: i4.ActivatedRoute }, { token: i1$4.Location }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
22178
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ConfigurationFormComponent, selector: "lib-configuration", inputs: { formData: "formData", errors: "errors" }, outputs: { close: "close" }, viewQueries: [{ propertyName: "configEditor", first: true, predicate: ["configEditor"], descendants: true, read: ConfigEditorComponent }], usesInheritance: true, ngImport: i0, template: "<div class=\"projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n tabindex=\"0\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"(formData.id ? 'Edit Config' : 'Create Config')\"\n [moreActions]=\"formData.moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n [saveDisabled]=\"svc.saveDisabled || formDataInvalid\"\n [saveTooltip]=\"saveButtonTooltip\"\n ></lib-form-header>\n <div class=\"config-form-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" [hidden]=\"formView !== 'simple'\">\n <div class=\"form-group-column three-fifths\">\n <lib-form-field-container [title]=\"'Config Name'\" [label]=\"'Required'\">\n <input\n id=\"ConfigName\"\n type=\"text\"\n maxlength=\"500\"\n placeholder=\"Name this config\"\n [ngClass]=\"{error: errors['name']}\"\n [(ngModel)]=\"formData.name\"\n (keyup)=\"apiData()\"\n >\n </lib-form-field-container>\n <lib-form-field-container [showHeader]=\"false\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">Configuration Data</span>\n <div class=\"form-header-toggle-container\">\n <span\n class=\"toggle-option-text\"\n [ngClass]=\"{'toggle-option-selected': !svc.configJsonView}\"\n (click)=\"svc.toggleJSONView()\"\n >\n FORM\n </span>\n <div class=\"form-header-toggle\" (click)=\"svc.toggleJSONView()\">\n <div\n class=\"form-toggle-switch\"\n [ngClass]=\"{'toggle-left': !svc.configJsonView, 'toggle-right': svc.configJsonView}\"\n >\n <div class=\"form-toggle-indicator\"></div>\n <div class=\"form-toggle-indicator\"></div>\n </div>\n </div>\n <span\n class=\"toggle-option-text\"\n [ngClass]=\"{'toggle-option-selected': svc.configJsonView}\"\n (click)=\"svc.toggleJSONView()\"\n >\n JSON\n </span>\n </div>\n </div>\n <div class=\"form-field-input-group\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">{{isEditing ? 'Config Type' : 'Select a Config Type'}}</span>\n </div>\n <select\n id=\"ConfigTypes\"\n class=\"config-type-select\"\n [(ngModel)]=\"formData.configTypeId\"\n (change)=\"getSchema()\"\n [ngClass]=\"{disabled: isEditing, error: errors['configTypeId']}\"\n >\n <option value=\"\">Select A Type...</option>\n <option *ngFor=\"let config of options\"\n [value]=\"config.id\">{{config.name}}\n </option>\n </select>\n <lib-config-editor\n [hidden]=\"configTypeEmpty\"\n [schema]=\"selectedSchema\"\n [(configData)]=\"formData.data\"\n [showJsonView]=\"svc.configJsonView\"\n [(configErrors)]=\"errors\"\n (configDataChange)=\"dataChanged($event)\"\n #configEditor\n ></lib-config-editor>\n </div>\n </lib-form-field-container>\n <lib-form-field-toggle [(toggleOn)]=\"showMore\" (toggleOnChange)=\"showMoreChanged($event)\" style=\"margin: 0px 10px\"></lib-form-field-toggle>\n <div [hidden]=\"!showMore\" class=\"form-group-column\">\n <lib-form-field-container\n [title]=\"'Custom Tags'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n *ngIf=\"!hideTags\"\n >\n <lib-custom-tags [(tags)]=\"formData.tags\"></lib-custom-tags>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column two-fifths\">\n <lib-form-field-container\n [title]=\"'API Calls'\"\n [label]=\"''\"\n [headerActions]=\"apiOptions\"\n (actionRequested)=\"apiActionRequested($event)\"\n >\n <div class=\"form-row\">\n <input class=\"form-field-input\" [value]=\"apiCallURL\" readonly/>\n <div class=\"url-copy icon-copy copy\" (click)=\"copyToClipboard(apiCallURL)\"></div>\n </div>\n <lib-json-view *ngIf=\"formData\" [(data)]=\"_apiData\" [readOnly]=\"true\" [showCopy]=\"true\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>\n", styles: [".config-form-container{display:flex;flex-direction:column;height:100%;width:100%;align-items:center;gap:var(--gapXL)}.config-type-select.disabled{opacity:.7;pointer-events:none}.form-group-column.three-fifths{width:calc(60% - .9375rem);min-width:34.375rem;max-width:43.75rem}.form-group-column.two-fifths{max-width:43.75rem}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.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: i5.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: FormHeaderComponent, selector: "lib-form-header", inputs: ["data", "badges", "title", "moreActions", "formView", "saveDisabled", "saveTooltip", "actionButtonText", "moreActionsText", "showHeaderToggle", "showHeaderButton"], outputs: ["formViewChange", "actionRequested"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }, { kind: "component", type: LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }, { kind: "component", type: FormFieldToggleComponent, selector: "lib-form-field-toggle", inputs: ["label", "orientation", "labelOn", "labelOff", "toggleOn"], outputs: ["toggleOnChange"] }, { kind: "component", type: JsonViewComponent, selector: "lib-json-view", inputs: ["data", "schema", "readOnly", "jsonInvalid", "showCopy", "showLineNumbers"], outputs: ["dataChange", "jsonChange", "jsonInvalidChange"] }, { kind: "component", type: CustomTagsComponent, selector: "lib-custom-tags", inputs: ["tags"], outputs: ["tagsChange"] }, { kind: "component", type: ConfigEditorComponent, selector: "lib-config-editor", inputs: ["configErrors", "configData", "showJsonView", "schema"], outputs: ["configErrorsChange", "configDataChange"] }] }); }
|
|
22722
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ConfigurationFormComponent, selector: "lib-configuration", inputs: { formData: "formData", errors: "errors" }, outputs: { close: "close" }, viewQueries: [{ propertyName: "configEditor", first: true, predicate: ["configEditor"], descendants: true, read: ConfigEditorComponent }], usesInheritance: true, ngImport: i0, template: "<div class=\"projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n tabindex=\"0\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"(formData.id ? 'Edit Config' : 'Create Config')\"\n [moreActions]=\"formData.moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n [saveDisabled]=\"svc.saveDisabled || formDataInvalid\"\n [saveTooltip]=\"saveButtonTooltip\"\n ></lib-form-header>\n <div class=\"config-form-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" [hidden]=\"formView !== 'simple'\">\n <div class=\"form-group-column three-fifths\">\n <lib-form-field-container [title]=\"'Config Name'\" [label]=\"'Required'\">\n <input\n id=\"ConfigName\"\n type=\"text\"\n maxlength=\"500\"\n placeholder=\"Name this config\"\n [ngClass]=\"{error: errors['name']}\"\n [(ngModel)]=\"formData.name\"\n (keyup)=\"apiData()\"\n >\n </lib-form-field-container>\n <lib-form-field-container [showHeader]=\"false\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">Configuration Data</span>\n <div class=\"form-header-toggle-container\">\n <span\n class=\"toggle-option-text\"\n [ngClass]=\"{'toggle-option-selected': !svc.configJsonView}\"\n (click)=\"svc.toggleJSONView()\"\n >\n FORM\n </span>\n <div class=\"form-header-toggle\" (click)=\"svc.toggleJSONView()\">\n <div\n class=\"form-toggle-switch\"\n [ngClass]=\"{'toggle-left': !svc.configJsonView, 'toggle-right': svc.configJsonView}\"\n >\n <div class=\"form-toggle-indicator\"></div>\n <div class=\"form-toggle-indicator\"></div>\n </div>\n </div>\n <span\n class=\"toggle-option-text\"\n [ngClass]=\"{'toggle-option-selected': svc.configJsonView}\"\n (click)=\"svc.toggleJSONView()\"\n >\n JSON\n </span>\n </div>\n </div>\n <div class=\"form-field-input-group\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">{{isEditing ? 'Config Type' : 'Select a Config Type'}}</span>\n </div>\n <select\n id=\"ConfigTypes\"\n class=\"config-type-select\"\n [(ngModel)]=\"formData.configTypeId\"\n (change)=\"getSchema()\"\n [ngClass]=\"{disabled: isEditing, error: errors['configTypeId']}\"\n >\n <option value=\"\">Select A Type...</option>\n <option *ngFor=\"let config of options\"\n [value]=\"config.id\">{{config.name}}\n </option>\n </select>\n <lib-config-editor\n [hidden]=\"configTypeEmpty\"\n [schema]=\"selectedSchema\"\n [(configData)]=\"formData.data\"\n [showJsonView]=\"svc.configJsonView\"\n [(configErrors)]=\"errors\"\n (configDataChange)=\"dataChanged($event)\"\n #configEditor\n ></lib-config-editor>\n </div>\n </lib-form-field-container>\n <lib-form-field-toggle [(toggleOn)]=\"showMore\" (toggleOnChange)=\"showMoreChanged($event)\" style=\"margin: 0px 10px\"></lib-form-field-toggle>\n <div [hidden]=\"!showMore\" class=\"form-group-column\">\n <lib-form-field-container\n [title]=\"'Custom Tags'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n *ngIf=\"!hideTags\"\n >\n <lib-custom-tags [(tags)]=\"formData.tags\"></lib-custom-tags>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column two-fifths\">\n <lib-form-field-container\n [title]=\"'API Calls'\"\n [label]=\"''\"\n [headerActions]=\"apiOptions\"\n (actionRequested)=\"apiActionRequested($event)\"\n >\n <div class=\"form-row\">\n <input class=\"form-field-input\" [value]=\"apiCallURL\" readonly/>\n <div class=\"url-copy icon-copy copy\" (click)=\"copyToClipboard(apiCallURL)\"></div>\n </div>\n <lib-json-view *ngIf=\"formData\" [(data)]=\"_apiData\" [readOnly]=\"true\" [showCopy]=\"true\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>\n", styles: [".config-form-container{display:flex;flex-direction:column;height:100%;width:100%;align-items:center;gap:var(--gapXL)}.config-type-select.disabled{opacity:.7;pointer-events:none}.form-group-column.three-fifths{width:calc(60% - .9375rem);min-width:34.375rem;max-width:43.75rem}.form-group-column.two-fifths{max-width:43.75rem}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.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: i5.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: FormHeaderComponent, selector: "lib-form-header", inputs: ["data", "badges", "title", "moreActions", "formView", "saveDisabled", "saveTooltip", "actionButtonText", "moreActionsText", "showHeaderToggle", "showHeaderButton", "multiActions"], outputs: ["formViewChange", "actionRequested", "multiActionRequested"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }, { kind: "component", type: LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }, { kind: "component", type: FormFieldToggleComponent, selector: "lib-form-field-toggle", inputs: ["label", "orientation", "labelOn", "labelOff", "toggleOn"], outputs: ["toggleOnChange"] }, { kind: "component", type: JsonViewComponent, selector: "lib-json-view", inputs: ["data", "schema", "readOnly", "jsonInvalid", "showCopy", "showLineNumbers"], outputs: ["dataChange", "jsonChange", "jsonInvalidChange"] }, { kind: "component", type: CustomTagsComponent, selector: "lib-custom-tags", inputs: ["tags"], outputs: ["tagsChange"] }, { kind: "component", type: ConfigEditorComponent, selector: "lib-config-editor", inputs: ["configErrors", "configData", "showJsonView", "schema"], outputs: ["configErrorsChange", "configDataChange"] }] }); }
|
|
22179
22723
|
}
|
|
22180
22724
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ConfigurationFormComponent, decorators: [{
|
|
22181
22725
|
type: Component,
|
|
@@ -23160,7 +23704,7 @@ class JwtSignerFormComponent extends ProjectableForm {
|
|
|
23160
23704
|
return !this.errors.jwksEndpoint;
|
|
23161
23705
|
}
|
|
23162
23706
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: JwtSignerFormComponent, deps: [{ token: JwtSignerFormService }, { token: SchemaService }, { token: GrowlerService }, { token: SHAREDZ_EXTENSION }, { token: SETTINGS_SERVICE }, { token: ZITI_DATA_SERVICE }, { token: i4.Router }, { token: i4.ActivatedRoute }, { token: i1$4.Location }, { token: ValidationService }, { token: AuthService }, { token: i1$5.OAuthService }, { token: i1$1.HttpClient }, { token: ZAC_LOGIN_SERVICE }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
23163
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: JwtSignerFormComponent, selector: "lib-configuration", inputs: { formData: "formData", errors: "errors" }, outputs: { close: "close" }, viewQueries: [{ propertyName: "filterInput", first: true, predicate: ["fileSelect"], descendants: true }, { propertyName: "oidcVerification", first: true, predicate: ["oidcVerification"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n tabindex=\"0\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"(formData.id ? 'JWT Signer Details' : 'Create JWT Signer')\"\n [moreActions]=\"formData.moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n [saveDisabled]=\"svc.saveDisabled || formDataInvalid\"\n ></lib-form-header>\n <div class=\"jwt-signer-form-container projectable-form-container\" #scrollContainer>\n <div class=\"projectable-form-main-column form-group-row\" [hidden]=\"formView !== 'simple'\">\n <div class=\"form-group-column three-fifths\">\n <lib-form-field-container\n [title]=\"'Name'\"\n [label]=\"'Required'\"\n >\n <input class=\"form-field-input read-only\" [(ngModel)]=\"formData.name\" [ngClass]=\"{error: errors['name']}\" placeholder=\"Name this JWT Signer\" #nameFieldInput/>\n </lib-form-field-container>\n <lib-form-field-container\n [layout]=\"'column'\"\n [showHeader]=\"false\"\n >\n <div class=\"form-field-label-container\">\n <div class=\"form-field-header\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Issuer</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"The "issuer" field on the JWT Signer must match the "iss" field on the JWT\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <span class=\"form-field-label\" >Required</span>\n </div>\n <input class=\"form-field-input\" placeholder=\"Enter issuer\" [(ngModel)]=\"formData.issuer\" [ngClass]=\"{error: errors['issuer']}\"/>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Audience</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"The expected "aud" (audience) field on the JWT\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <input class=\"form-field-input\" placeholder=\"Enter audience\" [(ngModel)]=\"formData.audience\"/>\n </div>\n <div class=\"form-field-row\">\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Claims Property</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"The field on the JWT for mapping to an identity. Matches the identity's id or externalId if "Use External Id" is set to true. Defaults to "sub"\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <input class=\"form-field-input\" placeholder=\"Enter claims property\" [(ngModel)]=\"formData.claimsProperty\" (keyup)=\"checkExternalIdToggle()\" [ngClass]=\"{error: errors['claimsProperty']}\"/>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-header\">\n <div class=\"form-field-title-container\">\n <div class=\"config-container-label\" style=\"font-weight: 600; font-size: 14px;\">External ID</div>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"If enabled, will match the "claimsProperty" to an identity's "externalId" field. If false, it will match to the identity's id field.\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n </div>\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"form-field-title-container\">\n <div class=\"config-container-label\">Use External ID</div>\n </div>\n <div\n (click)=\"toggleUseExternalId()\"\n [ngClass]=\"{ on: formData.useExternalId }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.useExternalId\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.useExternalId\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [showHeader]=\"false\"\n >\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Client ID</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"The client id to use when authenticating to the IDP\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <input class=\"form-field-input\" placeholder=\"Enter client ID\" [(ngModel)]=\"formData.clientId\"/>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">External Auth Url</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"The URL that users are directed to, to obtain a JWT\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <input class=\"form-field-input\" placeholder=\"Enter external auth URL\" [(ngModel)]=\"formData.externalAuthUrl\"/>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Scopes</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Enter as a comma or space seperated list of claims/permissions\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <p-chips (keyup)=\"scopesOnKeyup($event)\"\n [(ngModel)]=\"formData.scopes\"\n [allowDuplicate]=\"false\"\n placeholder=\"Enter scopes\"\n [addOnBlur]=\"true\"\n separator=\",\">\n </p-chips>\n </div>\n </lib-form-field-container>\n <lib-form-field-toggle [(toggleOn)]=\"showMore\" (toggleOnChange)=\"showMoreChanged($event)\" style=\"margin: 0px 10px\"></lib-form-field-toggle>\n <lib-form-field-container\n *ngIf=\"showMore && showTokenType\"\n [title]=\"'Target Token Type'\"\n [label]=\"'Required'\"\n [helpText]=\"'The target token type. Can be either Access or ID'\"\n class=\"form-field-advanced\"\n >\n <select\n [(ngModel)]=\"targetToken\"\n id=\"authPolicyId\"\n class=\"form-field-dropdown\"\n >\n <option value=\"ACCESS\">Access</option>\n <option value=\"ID\">ID</option>\n </select>\n </lib-form-field-container>\n <div [hidden]=\"!showMore\" class=\"form-group-column\">\n <lib-form-field-container\n [title]=\"'Verify OIDC Authentication'\"\n class=\"form-field-advanced\"\n [ngClass]=\"{'formFieldError': !oidcVerified && oidcErrorMessageDetail, 'formFieldSuccess': oidcVerified}\"\n >\n <div class=\"form-field-row\" #oidcVerification>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <div class=\"form-field-title\">Callback URL</div>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"This URL must be added to the list of allowed callback URLs in your OAuth provider configuration\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <div class=\"copy-link-container\">\n <pre class=\"read-only-2\" (click)=\"copyCallbackURL()\">{{ callbackURL }}</pre>\n <div class=\"copy-button\" (click)=\"copyCallbackURL()\"></div>\n </div>\n </div>\n <div class=\"test-oauth-button\"\n [ngClass]=\"{'oidc-verified': oidcVerified}\"\n (click)=\"testOIDCAuthentication()\"\n >\n {{oidcVerified ? 'Verified' : 'Authenticate' }}\n <div class=\"spinner\" *ngIf=\"oauthLoading\"></div>\n <input type=\"checkbox\" [disabled]=\"true\" [checked]=\"true\" class=\"success-check\" *ngIf=\"oidcVerified\">\n </div>\n </div>\n <div class=\"oidc-error-message-container\" *ngIf=\"oidcErrorMessageDetail\">\n <code class=\"oidc-error-message-source\">{{oidcErrorMessageSource}}: </code>\n <code class=\"oidc-error-message-detail\">{{oidcErrorMessageDetail}}</code>\n <code class=\"oidc-error-message-detail2\" *ngIf=\"oidcErrorMessageDetail2\">{{oidcErrorMessageDetail2}}</code>\n <code class=\"oidc-error-message-detail2\" *ngIf=\"oidcErrorMessageDetail3\">{{oidcErrorMessageDetail3}}</code>\n </div>\n <div class=\"oidc-token-claims-container\" *ngIf=\"oidcAuthTokenClaims\">\n <code class=\"oidc-token-claims-title\">OAuth Token Claims: </code>\n <lib-json-view [showLineNumbers]=\"false\" [(data)]=\"oidcAuthTokenClaims\"></lib-json-view>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Custom Tags'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n >\n <lib-custom-tags [(tags)]=\"formData.tags\"></lib-custom-tags>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column two-fifths\">\n <lib-form-field-container\n [title]=\"'Verification'\"\n [label]=\"'REQUIRED'\"\n >\n <div class=\"radio-group-container\" (keydown)=\"radioKeyDownHandler($event)\" tabindex=\"0\">\n <div class=\"radio-button-container\" [ngClass]=\"{'selected': signatureMethod === 'JWKS_ENDPOINT'}\" (click)=\"selectSignatureMethod('JWKS_ENDPOINT')\">\n <div class=\"radio-button-circle\">\n <div class=\"radio-button-inner-circle\"></div>\n </div>\n <span class=\"radio-button-label\">JWKS Endpoint</span>\n </div>\n <div class=\"radio-button-container\" [ngClass]=\"{'selected': signatureMethod === 'CERT_PEM'}\" (click)=\"selectSignatureMethod('CERT_PEM')\">\n <div class=\"radio-button-circle\">\n <div class=\"radio-button-inner-circle\"></div>\n </div>\n <span class=\"radio-button-label\">Cert PEM</span>\n </div>\n </div>\n <div *ngIf=\"signatureMethod === 'JWKS_ENDPOINT'\" class=\"form-field-input-group\">\n <div class=\"form-field-label-container select-file-label-container\">\n <div class=\"form-field-header\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">JWKS Endpoint</span>\n </div>\n </div>\n <input class=\"form-field-input read-only\" placeholder=\"Enter endpoint URL\" [(ngModel)]=\"formData.jwksEndpoint\" [ngClass]=\"{error: errors['jwksEndpoint']}\"/>\n </div>\n </div>\n <div *ngIf=\"signatureMethod === 'CERT_PEM'\" class=\"form-field-input-group\">\n <div class=\"form-field-label-container select-file-label-container\">\n <div class=\"form-field-header\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">PEM</span>\n </div>\n <span class=\"select-file-button\" (click)=\"openFileSelect($event)\">\n Select File\n <div class=\"spinner\" *ngIf=\"fileSelectOpening\"></div>\n </span>\n <input #fileSelect type=\"file\" style=\"display:none\" (change)=\"selectPemFile($event)\">\n </div>\n <textarea placeholder=\"Paste pem contents or select file\" [(ngModel)]=\"formData.certPem\" [ngClass]=\"{error: errors['certPem']}\"></textarea>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-header\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">KID</span>\n </div>\n <span class=\"form-field-label\" >Optional</span>\n </div>\n <input class=\"form-field-input\" placeholder=\"Enter KID\" [(ngModel)]=\"formData.kid\"/>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [showHeader]=\"false\"\n >\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"config-container-label\">ENABLED</div>\n <div\n (click)=\"toggleEnabled()\"\n [ngClass]=\"{ on: formData.enabled }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.enabled\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.enabled\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'API Calls'\"\n [headerActions]=\"apiOptions\"\n (actionRequested)=\"apiActionRequested($event)\"\n [class]=\"'api-data-no-wrap'\"\n >\n <div class=\"form-row\">\n <input class=\"form-field-input\" [value]=\"apiCallURL\"/>\n <div class=\"icon-copy copy\" (click)=\"copyToClipboard(apiCallURL)\"></div>\n </div>\n <lib-json-view *ngIf=\"formData\" [showLineNumbers]=\"false\" [(data)]=\"apiData\" [readOnly]=\"true\" [showCopy]=\"true\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>\n", styles: ["@charset \"UTF-8\";.jwt-signer-form-container{display:flex;flex-direction:column;height:100%;width:100%;align-items:center;gap:var(--gapXL)}.jwt-signer-form-container .select-file-button{padding-left:var(--paddingMedium);padding-right:var(--paddingMedium);height:1.5625rem;width:-moz-fit-content;width:fit-content;white-space:nowrap;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.875rem;background:var(--primary);border-style:solid;border-width:.0625rem;border-color:var(--stroke);color:var(--white);cursor:pointer;border-radius:var(--inputBorderRadius);gap:var(--marginMedium);margin-top:-.3125rem}.jwt-signer-form-container .select-file-button:hover{filter:brightness(.8)}.jwt-signer-form-container .select-file-button:active{filter:grayscale(1);transform:translateY(.0625rem)}.jwt-signer-form-container .select-file-button .spinner{display:inline-block;width:.5rem;height:.5rem;border-radius:50%;background:transparent;border-top:.125rem solid white;border-right:.125rem solid white;border-bottom:.125rem solid transparent;border-left:.125rem solid transparent;animation:loading .5s infinite linear}.jwt-signer-form-container .select-file-label-container{gap:var(--marginMedium)}::ng-deep .jwt-signer-form-container select:disabled,::ng-deep .jwt-signer-form-container input:disabled{opacity:.75!important;cursor:text;background-color:var(--stroke)!important}::ng-deep .api-data-no-wrap .jse-text-mode{width:100%}::ng-deep .api-data-no-wrap .jse-text-mode .cm-editor{width:100%}::ng-deep .api-data-no-wrap .jse-text-mode .cm-editor .cm-scroller{width:100%}::ng-deep .api-data-no-wrap .jse-text-mode .cm-editor .cm-scroller .cm-content{width:100%;overflow:auto}::ng-deep .api-data-no-wrap .jse-text-mode .cm-editor .cm-scroller .cm-content .\\37cr{white-space:nowrap}.radio-group-container{display:flex;gap:var(--marginLarge)}.radio-group-container:focus .radio-button-container .radio-button-circle{border-color:var(--primaryColor)}.radio-group-container .radio-button-container{display:flex;flex-direction:row;align-items:center;background-color:var(--formGroup);border-radius:var(--inputBorderRadius);width:100%;padding-left:var(--paddingMedium);padding-right:var(--paddingMedium);padding-top:var(--paddingLarge);padding-bottom:var(--paddingLarge);cursor:pointer;gap:var(--marginMedium)}.radio-group-container .radio-button-container .radio-button-circle{display:flex;width:1.3125rem;height:1.3125rem;border-radius:1.3125rem;border-width:.125rem;border-style:solid;border-color:var(--offWhite_ALWAYS);align-items:center;justify-content:center;background-color:var(--offWhite)}.radio-group-container .radio-button-container .radio-button-circle .radio-button-inner-circle{display:none;width:.9375rem;height:.9375rem;border-radius:.9375rem;align-items:center;justify-content:center;background-color:var(--primaryColor)}.radio-group-container .radio-button-container.selected .radio-button-circle .radio-button-inner-circle{display:flex}.radio-group-container .radio-button-container:active .radio-button-circle .radio-button-inner-circle{display:flex;background-color:var(--menu)}.radio-group-container .radio-button-container .radio-button-label{color:var(--offWhite_ALWAYS);font-size:.875rem;font-weight:600}.test-oauth-button{color:var(--offWhite_ALWAYS);height:var(--defaultInputHeight);border-style:solid;border-color:var(--inputBorder);border-radius:var(--inputBorderRadius);vertical-align:middle;text-align:center;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;transition:color .2s;font-size:.9375rem;font-weight:600;font-family:Open Sans,sans-serif;text-transform:uppercase;cursor:pointer;width:100%;background-color:var(--primaryColor);margin-top:1.5rem;max-width:15rem}.test-oauth-button.oidc-verified{filter:brightness(.95);color:var(--offWhite_ALWAYS);background-color:var(--green)}.test-oauth-button .spinner{display:inline-block;width:var(--spinnerSizeMedium);height:var(--spinnerSizeMedium);border-radius:50%;background:transparent;border-top:var(--spinnerBorderTopMedium);border-right:var(--spinnerBorderRightMedium);border-bottom:var(--spinnerBorderBottomMedium);border-left:var(--spinnerBorderLeftMedium);animation:loading .5s infinite linear;margin-left:var(--marginSmall)}.test-oauth-button:hover{filter:brightness(.95)}.test-oauth-button:active{transform:translateY(1px)}.success-check{width:1.0625rem;height:1.0625rem;cursor:pointer;background-color:var(--navigation);margin:0;margin-top:.25rem;border-radius:2rem;margin-left:var(--marginSmall)}.success-check:checked{background-color:var(--green)!important;background-image:url(../../assets/images/check.png);background-size:.675rem;background-position:center center;background-repeat:no-repeat;border:none}.success-check:checked:disabled{opacity:1!important}.oidc-token-claims-container{background-color:var(--backgroundMuted);height:-moz-fit-content;height:fit-content;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;padding:var(--paddingMedium);border-radius:var(--inputBorderRadius);color:var(--tableText);font-weight:600;overflow:auto}.oidc-token-claims-container .oidc-token-claims-title{font-weight:600;font-size:1rem;white-space:nowrap;margin-bottom:var(--marginMedium)}.oidc-error-message-container{background-color:var(--lightRed);height:-moz-fit-content;height:fit-content;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;padding:var(--paddingMedium);border-radius:var(--inputBorderRadius);color:var(--red);font-weight:600;overflow:auto}.oidc-error-message-container .oidc-error-message-source{font-weight:600;font-size:1rem;white-space:nowrap}.oidc-error-message-container .oidc-error-message-detail2,.oidc-error-message-container .oidc-error-message-detail{margin-top:var(--marginSmall);font-weight:400;white-space:nowrap}.oidc-error-message-container::-webkit-scrollbar{height:6px;width:6px}.oidc-error-message-container::-webkit-scrollbar-thumb{background-color:var(--menu);border-radius:10px}.oidc-error-message-container:hover::-webkit-scrollbar-thumb{background-clip:unset!important}.read-only-2{display:flex;overflow:auto;white-space:nowrap;opacity:1!important;cursor:pointer;padding:var(--paddingMedium);padding-bottom:var(--paddingSmall)}.read-only-2::-webkit-scrollbar{height:6px;width:6px}.read-only-2::-webkit-scrollbar-thumb{background-color:var(--menu);border-radius:10px}.read-only-2:hover{text-decoration:underline}.read-only-2:hover::-webkit-scrollbar-thumb{background-clip:unset}.copy-link-container{display:flex;flex-direction:row;justify-content:space-between;align-items:center;opacity:1!important;cursor:text;border-radius:var(--inputBorderRadius);height:var(--defaultInputHeight);background-color:var(--backgroundMuted)!important}.copy-button{display:flex;align-items:center;justify-content:center;height:100%;width:2.575rem;margin-left:.125rem;background:url(/assets/svgs/copy.svg) no-repeat;background-size:1.125rem 1.125rem;background-position:center;cursor:pointer;border-top-right-radius:var(--inputBorderRadius);border-bottom-right-radius:var(--inputBorderRadius);background-color:#0000000f}.copy-button:hover{filter:brightness(.95);background-color:#0000001f}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.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: i5.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3$1.Chips, selector: "p-chips", inputs: ["style", "styleClass", "disabled", "field", "placeholder", "max", "ariaLabel", "ariaLabelledBy", "tabindex", "inputId", "allowDuplicate", "inputStyle", "inputStyleClass", "addOnTab", "addOnBlur", "separator", "showClear"], outputs: ["onAdd", "onRemove", "onFocus", "onBlur", "onChipClick", "onClear"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: FormHeaderComponent, selector: "lib-form-header", inputs: ["data", "badges", "title", "moreActions", "formView", "saveDisabled", "saveTooltip", "actionButtonText", "moreActionsText", "showHeaderToggle", "showHeaderButton"], outputs: ["formViewChange", "actionRequested"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }, { kind: "component", type: LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }, { kind: "component", type: FormFieldToggleComponent, selector: "lib-form-field-toggle", inputs: ["label", "orientation", "labelOn", "labelOff", "toggleOn"], outputs: ["toggleOnChange"] }, { kind: "component", type: JsonViewComponent, selector: "lib-json-view", inputs: ["data", "schema", "readOnly", "jsonInvalid", "showCopy", "showLineNumbers"], outputs: ["dataChange", "jsonChange", "jsonInvalidChange"] }, { kind: "component", type: CustomTagsComponent, selector: "lib-custom-tags", inputs: ["tags"], outputs: ["tagsChange"] }] }); }
|
|
23707
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: JwtSignerFormComponent, selector: "lib-configuration", inputs: { formData: "formData", errors: "errors" }, outputs: { close: "close" }, viewQueries: [{ propertyName: "filterInput", first: true, predicate: ["fileSelect"], descendants: true }, { propertyName: "oidcVerification", first: true, predicate: ["oidcVerification"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n tabindex=\"0\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"(formData.id ? 'JWT Signer Details' : 'Create JWT Signer')\"\n [moreActions]=\"formData.moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n [saveDisabled]=\"svc.saveDisabled || formDataInvalid\"\n ></lib-form-header>\n <div class=\"jwt-signer-form-container projectable-form-container\" #scrollContainer>\n <div class=\"projectable-form-main-column form-group-row\" [hidden]=\"formView !== 'simple'\">\n <div class=\"form-group-column three-fifths\">\n <lib-form-field-container\n [title]=\"'Name'\"\n [label]=\"'Required'\"\n >\n <input class=\"form-field-input read-only\" [(ngModel)]=\"formData.name\" [ngClass]=\"{error: errors['name']}\" placeholder=\"Name this JWT Signer\" #nameFieldInput/>\n </lib-form-field-container>\n <lib-form-field-container\n [layout]=\"'column'\"\n [showHeader]=\"false\"\n >\n <div class=\"form-field-label-container\">\n <div class=\"form-field-header\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Issuer</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"The "issuer" field on the JWT Signer must match the "iss" field on the JWT\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <span class=\"form-field-label\" >Required</span>\n </div>\n <input class=\"form-field-input\" placeholder=\"Enter issuer\" [(ngModel)]=\"formData.issuer\" [ngClass]=\"{error: errors['issuer']}\"/>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Audience</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"The expected "aud" (audience) field on the JWT\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <input class=\"form-field-input\" placeholder=\"Enter audience\" [(ngModel)]=\"formData.audience\"/>\n </div>\n <div class=\"form-field-row\">\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Claims Property</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"The field on the JWT for mapping to an identity. Matches the identity's id or externalId if "Use External Id" is set to true. Defaults to "sub"\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <input class=\"form-field-input\" placeholder=\"Enter claims property\" [(ngModel)]=\"formData.claimsProperty\" (keyup)=\"checkExternalIdToggle()\" [ngClass]=\"{error: errors['claimsProperty']}\"/>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-header\">\n <div class=\"form-field-title-container\">\n <div class=\"config-container-label\" style=\"font-weight: 600; font-size: 14px;\">External ID</div>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"If enabled, will match the "claimsProperty" to an identity's "externalId" field. If false, it will match to the identity's id field.\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n </div>\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"form-field-title-container\">\n <div class=\"config-container-label\">Use External ID</div>\n </div>\n <div\n (click)=\"toggleUseExternalId()\"\n [ngClass]=\"{ on: formData.useExternalId }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.useExternalId\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.useExternalId\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [showHeader]=\"false\"\n >\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Client ID</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"The client id to use when authenticating to the IDP\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <input class=\"form-field-input\" placeholder=\"Enter client ID\" [(ngModel)]=\"formData.clientId\"/>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">External Auth Url</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"The URL that users are directed to, to obtain a JWT\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <input class=\"form-field-input\" placeholder=\"Enter external auth URL\" [(ngModel)]=\"formData.externalAuthUrl\"/>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Scopes</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Enter as a comma or space seperated list of claims/permissions\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <p-chips (keyup)=\"scopesOnKeyup($event)\"\n [(ngModel)]=\"formData.scopes\"\n [allowDuplicate]=\"false\"\n placeholder=\"Enter scopes\"\n [addOnBlur]=\"true\"\n separator=\",\">\n </p-chips>\n </div>\n </lib-form-field-container>\n <lib-form-field-toggle [(toggleOn)]=\"showMore\" (toggleOnChange)=\"showMoreChanged($event)\" style=\"margin: 0px 10px\"></lib-form-field-toggle>\n <lib-form-field-container\n *ngIf=\"showMore && showTokenType\"\n [title]=\"'Target Token Type'\"\n [label]=\"'Required'\"\n [helpText]=\"'The target token type. Can be either Access or ID'\"\n class=\"form-field-advanced\"\n >\n <select\n [(ngModel)]=\"targetToken\"\n id=\"authPolicyId\"\n class=\"form-field-dropdown\"\n >\n <option value=\"ACCESS\">Access</option>\n <option value=\"ID\">ID</option>\n </select>\n </lib-form-field-container>\n <div [hidden]=\"!showMore\" class=\"form-group-column\">\n <lib-form-field-container\n [title]=\"'Verify OIDC Authentication'\"\n class=\"form-field-advanced\"\n [ngClass]=\"{'formFieldError': !oidcVerified && oidcErrorMessageDetail, 'formFieldSuccess': oidcVerified}\"\n >\n <div class=\"form-field-row\" #oidcVerification>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <div class=\"form-field-title\">Callback URL</div>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"This URL must be added to the list of allowed callback URLs in your OAuth provider configuration\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <div class=\"copy-link-container\">\n <pre class=\"read-only-2\" (click)=\"copyCallbackURL()\">{{ callbackURL }}</pre>\n <div class=\"copy-button\" (click)=\"copyCallbackURL()\"></div>\n </div>\n </div>\n <div class=\"test-oauth-button\"\n [ngClass]=\"{'oidc-verified': oidcVerified}\"\n (click)=\"testOIDCAuthentication()\"\n >\n {{oidcVerified ? 'Verified' : 'Authenticate' }}\n <div class=\"spinner\" *ngIf=\"oauthLoading\"></div>\n <input type=\"checkbox\" [disabled]=\"true\" [checked]=\"true\" class=\"success-check\" *ngIf=\"oidcVerified\">\n </div>\n </div>\n <div class=\"oidc-error-message-container\" *ngIf=\"oidcErrorMessageDetail\">\n <code class=\"oidc-error-message-source\">{{oidcErrorMessageSource}}: </code>\n <code class=\"oidc-error-message-detail\">{{oidcErrorMessageDetail}}</code>\n <code class=\"oidc-error-message-detail2\" *ngIf=\"oidcErrorMessageDetail2\">{{oidcErrorMessageDetail2}}</code>\n <code class=\"oidc-error-message-detail2\" *ngIf=\"oidcErrorMessageDetail3\">{{oidcErrorMessageDetail3}}</code>\n </div>\n <div class=\"oidc-token-claims-container\" *ngIf=\"oidcAuthTokenClaims\">\n <code class=\"oidc-token-claims-title\">OAuth Token Claims: </code>\n <lib-json-view [showLineNumbers]=\"false\" [(data)]=\"oidcAuthTokenClaims\"></lib-json-view>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Custom Tags'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n >\n <lib-custom-tags [(tags)]=\"formData.tags\"></lib-custom-tags>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column two-fifths\">\n <lib-form-field-container\n [title]=\"'Verification'\"\n [label]=\"'REQUIRED'\"\n >\n <div class=\"radio-group-container\" (keydown)=\"radioKeyDownHandler($event)\" tabindex=\"0\">\n <div class=\"radio-button-container\" [ngClass]=\"{'selected': signatureMethod === 'JWKS_ENDPOINT'}\" (click)=\"selectSignatureMethod('JWKS_ENDPOINT')\">\n <div class=\"radio-button-circle\">\n <div class=\"radio-button-inner-circle\"></div>\n </div>\n <span class=\"radio-button-label\">JWKS Endpoint</span>\n </div>\n <div class=\"radio-button-container\" [ngClass]=\"{'selected': signatureMethod === 'CERT_PEM'}\" (click)=\"selectSignatureMethod('CERT_PEM')\">\n <div class=\"radio-button-circle\">\n <div class=\"radio-button-inner-circle\"></div>\n </div>\n <span class=\"radio-button-label\">Cert PEM</span>\n </div>\n </div>\n <div *ngIf=\"signatureMethod === 'JWKS_ENDPOINT'\" class=\"form-field-input-group\">\n <div class=\"form-field-label-container select-file-label-container\">\n <div class=\"form-field-header\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">JWKS Endpoint</span>\n </div>\n </div>\n <input class=\"form-field-input read-only\" placeholder=\"Enter endpoint URL\" [(ngModel)]=\"formData.jwksEndpoint\" [ngClass]=\"{error: errors['jwksEndpoint']}\"/>\n </div>\n </div>\n <div *ngIf=\"signatureMethod === 'CERT_PEM'\" class=\"form-field-input-group\">\n <div class=\"form-field-label-container select-file-label-container\">\n <div class=\"form-field-header\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">PEM</span>\n </div>\n <span class=\"select-file-button\" (click)=\"openFileSelect($event)\">\n Select File\n <div class=\"spinner\" *ngIf=\"fileSelectOpening\"></div>\n </span>\n <input #fileSelect type=\"file\" style=\"display:none\" (change)=\"selectPemFile($event)\">\n </div>\n <textarea placeholder=\"Paste pem contents or select file\" [(ngModel)]=\"formData.certPem\" [ngClass]=\"{error: errors['certPem']}\"></textarea>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-header\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">KID</span>\n </div>\n <span class=\"form-field-label\" >Optional</span>\n </div>\n <input class=\"form-field-input\" placeholder=\"Enter KID\" [(ngModel)]=\"formData.kid\"/>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [showHeader]=\"false\"\n >\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"config-container-label\">ENABLED</div>\n <div\n (click)=\"toggleEnabled()\"\n [ngClass]=\"{ on: formData.enabled }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.enabled\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.enabled\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'API Calls'\"\n [headerActions]=\"apiOptions\"\n (actionRequested)=\"apiActionRequested($event)\"\n [class]=\"'api-data-no-wrap'\"\n >\n <div class=\"form-row\">\n <input class=\"form-field-input\" [value]=\"apiCallURL\"/>\n <div class=\"icon-copy copy\" (click)=\"copyToClipboard(apiCallURL)\"></div>\n </div>\n <lib-json-view *ngIf=\"formData\" [showLineNumbers]=\"false\" [(data)]=\"apiData\" [readOnly]=\"true\" [showCopy]=\"true\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>\n", styles: ["@charset \"UTF-8\";.jwt-signer-form-container{display:flex;flex-direction:column;height:100%;width:100%;align-items:center;gap:var(--gapXL)}.jwt-signer-form-container .select-file-button{padding-left:var(--paddingMedium);padding-right:var(--paddingMedium);height:1.5625rem;width:-moz-fit-content;width:fit-content;white-space:nowrap;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.875rem;background:var(--primary);border-style:solid;border-width:.0625rem;border-color:var(--stroke);color:var(--white);cursor:pointer;border-radius:var(--inputBorderRadius);gap:var(--marginMedium);margin-top:-.3125rem}.jwt-signer-form-container .select-file-button:hover{filter:brightness(.8)}.jwt-signer-form-container .select-file-button:active{filter:grayscale(1);transform:translateY(.0625rem)}.jwt-signer-form-container .select-file-button .spinner{display:inline-block;width:.5rem;height:.5rem;border-radius:50%;background:transparent;border-top:.125rem solid white;border-right:.125rem solid white;border-bottom:.125rem solid transparent;border-left:.125rem solid transparent;animation:loading .5s infinite linear}.jwt-signer-form-container .select-file-label-container{gap:var(--marginMedium)}::ng-deep .jwt-signer-form-container select:disabled,::ng-deep .jwt-signer-form-container input:disabled{opacity:.75!important;cursor:text;background-color:var(--stroke)!important}::ng-deep .api-data-no-wrap .jse-text-mode{width:100%}::ng-deep .api-data-no-wrap .jse-text-mode .cm-editor{width:100%}::ng-deep .api-data-no-wrap .jse-text-mode .cm-editor .cm-scroller{width:100%}::ng-deep .api-data-no-wrap .jse-text-mode .cm-editor .cm-scroller .cm-content{width:100%;overflow:auto}::ng-deep .api-data-no-wrap .jse-text-mode .cm-editor .cm-scroller .cm-content .\\37cr{white-space:nowrap}.radio-group-container{display:flex;gap:var(--marginLarge)}.radio-group-container:focus .radio-button-container .radio-button-circle{border-color:var(--primaryColor)}.radio-group-container .radio-button-container{display:flex;flex-direction:row;align-items:center;background-color:var(--formGroup);border-radius:var(--inputBorderRadius);width:100%;padding-left:var(--paddingMedium);padding-right:var(--paddingMedium);padding-top:var(--paddingLarge);padding-bottom:var(--paddingLarge);cursor:pointer;gap:var(--marginMedium)}.radio-group-container .radio-button-container .radio-button-circle{display:flex;width:1.3125rem;height:1.3125rem;border-radius:1.3125rem;border-width:.125rem;border-style:solid;border-color:var(--offWhite_ALWAYS);align-items:center;justify-content:center;background-color:var(--offWhite)}.radio-group-container .radio-button-container .radio-button-circle .radio-button-inner-circle{display:none;width:.9375rem;height:.9375rem;border-radius:.9375rem;align-items:center;justify-content:center;background-color:var(--primaryColor)}.radio-group-container .radio-button-container.selected .radio-button-circle .radio-button-inner-circle{display:flex}.radio-group-container .radio-button-container:active .radio-button-circle .radio-button-inner-circle{display:flex;background-color:var(--menu)}.radio-group-container .radio-button-container .radio-button-label{color:var(--offWhite_ALWAYS);font-size:.875rem;font-weight:600}.test-oauth-button{color:var(--offWhite_ALWAYS);height:var(--defaultInputHeight);border-style:solid;border-color:var(--inputBorder);border-radius:var(--inputBorderRadius);vertical-align:middle;text-align:center;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;transition:color .2s;font-size:.9375rem;font-weight:600;font-family:Open Sans,sans-serif;text-transform:uppercase;cursor:pointer;width:100%;background-color:var(--primaryColor);margin-top:1.5rem;max-width:15rem}.test-oauth-button.oidc-verified{filter:brightness(.95);color:var(--offWhite_ALWAYS);background-color:var(--green)}.test-oauth-button .spinner{display:inline-block;width:var(--spinnerSizeMedium);height:var(--spinnerSizeMedium);border-radius:50%;background:transparent;border-top:var(--spinnerBorderTopMedium);border-right:var(--spinnerBorderRightMedium);border-bottom:var(--spinnerBorderBottomMedium);border-left:var(--spinnerBorderLeftMedium);animation:loading .5s infinite linear;margin-left:var(--marginSmall)}.test-oauth-button:hover{filter:brightness(.95)}.test-oauth-button:active{transform:translateY(1px)}.success-check{width:1.0625rem;height:1.0625rem;cursor:pointer;background-color:var(--navigation);margin:0;margin-top:.25rem;border-radius:2rem;margin-left:var(--marginSmall)}.success-check:checked{background-color:var(--green)!important;background-image:url(../../assets/images/check.png);background-size:.675rem;background-position:center center;background-repeat:no-repeat;border:none}.success-check:checked:disabled{opacity:1!important}.oidc-token-claims-container{background-color:var(--backgroundMuted);height:-moz-fit-content;height:fit-content;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;padding:var(--paddingMedium);border-radius:var(--inputBorderRadius);color:var(--tableText);font-weight:600;overflow:auto}.oidc-token-claims-container .oidc-token-claims-title{font-weight:600;font-size:1rem;white-space:nowrap;margin-bottom:var(--marginMedium)}.oidc-error-message-container{background-color:var(--lightRed);height:-moz-fit-content;height:fit-content;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;padding:var(--paddingMedium);border-radius:var(--inputBorderRadius);color:var(--red);font-weight:600;overflow:auto}.oidc-error-message-container .oidc-error-message-source{font-weight:600;font-size:1rem;white-space:nowrap}.oidc-error-message-container .oidc-error-message-detail2,.oidc-error-message-container .oidc-error-message-detail{margin-top:var(--marginSmall);font-weight:400;white-space:nowrap}.oidc-error-message-container::-webkit-scrollbar{height:6px;width:6px}.oidc-error-message-container::-webkit-scrollbar-thumb{background-color:var(--menu);border-radius:10px}.oidc-error-message-container:hover::-webkit-scrollbar-thumb{background-clip:unset!important}.read-only-2{display:flex;overflow:auto;white-space:nowrap;opacity:1!important;cursor:pointer;padding:var(--paddingMedium);padding-bottom:var(--paddingSmall)}.read-only-2::-webkit-scrollbar{height:6px;width:6px}.read-only-2::-webkit-scrollbar-thumb{background-color:var(--menu);border-radius:10px}.read-only-2:hover{text-decoration:underline}.read-only-2:hover::-webkit-scrollbar-thumb{background-clip:unset}.copy-link-container{display:flex;flex-direction:row;justify-content:space-between;align-items:center;opacity:1!important;cursor:text;border-radius:var(--inputBorderRadius);height:var(--defaultInputHeight);background-color:var(--backgroundMuted)!important}.copy-button{display:flex;align-items:center;justify-content:center;height:100%;width:2.575rem;margin-left:.125rem;background:url(/assets/svgs/copy.svg) no-repeat;background-size:1.125rem 1.125rem;background-position:center;cursor:pointer;border-top-right-radius:var(--inputBorderRadius);border-bottom-right-radius:var(--inputBorderRadius);background-color:#0000000f}.copy-button:hover{filter:brightness(.95);background-color:#0000001f}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.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: i5.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3$1.Chips, selector: "p-chips", inputs: ["style", "styleClass", "disabled", "field", "placeholder", "max", "ariaLabel", "ariaLabelledBy", "tabindex", "inputId", "allowDuplicate", "inputStyle", "inputStyleClass", "addOnTab", "addOnBlur", "separator", "showClear"], outputs: ["onAdd", "onRemove", "onFocus", "onBlur", "onChipClick", "onClear"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: FormHeaderComponent, selector: "lib-form-header", inputs: ["data", "badges", "title", "moreActions", "formView", "saveDisabled", "saveTooltip", "actionButtonText", "moreActionsText", "showHeaderToggle", "showHeaderButton", "multiActions"], outputs: ["formViewChange", "actionRequested", "multiActionRequested"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }, { kind: "component", type: LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }, { kind: "component", type: FormFieldToggleComponent, selector: "lib-form-field-toggle", inputs: ["label", "orientation", "labelOn", "labelOff", "toggleOn"], outputs: ["toggleOnChange"] }, { kind: "component", type: JsonViewComponent, selector: "lib-json-view", inputs: ["data", "schema", "readOnly", "jsonInvalid", "showCopy", "showLineNumbers"], outputs: ["dataChange", "jsonChange", "jsonInvalidChange"] }, { kind: "component", type: CustomTagsComponent, selector: "lib-custom-tags", inputs: ["tags"], outputs: ["tagsChange"] }] }); }
|
|
23164
23708
|
}
|
|
23165
23709
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: JwtSignerFormComponent, decorators: [{
|
|
23166
23710
|
type: Component,
|
|
@@ -23918,7 +24462,7 @@ class AuthPolicyFormComponent extends ProjectableForm {
|
|
|
23918
24462
|
this.svc.getJwtSigners(filters, 1);
|
|
23919
24463
|
}
|
|
23920
24464
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AuthPolicyFormComponent, deps: [{ token: AuthPolicyFormService }, { token: SchemaService }, { token: GrowlerService }, { token: SHAREDZ_EXTENSION }, { token: SETTINGS_SERVICE }, { token: ZITI_DATA_SERVICE }, { token: i4.Router }, { token: i4.ActivatedRoute }, { token: i1$4.Location }, { token: ValidationService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
23921
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: AuthPolicyFormComponent, selector: "lib-configuration", inputs: { formData: "formData", errors: "errors" }, outputs: { close: "close" }, viewQueries: [{ propertyName: "filterInput", first: true, predicate: ["fileSelect"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n tabindex=\"0\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"(formData.id ? 'Auth Policy Details' : 'Create Auth Policy')\"\n [moreActions]=\"formData.moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n [saveDisabled]=\"svc.saveDisabled || formDataInvalid\"\n ></lib-form-header>\n <div class=\"jwt-signer-form-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" [hidden]=\"formView !== 'simple'\">\n <div class=\"form-group-column three-fifths\">\n <lib-form-field-container\n [title]=\"'Name'\"\n [label]=\"'Required'\"\n >\n <input class=\"form-field-input read-only\" [(ngModel)]=\"formData.name\" [ngClass]=\"{error: errors['name']}\" placeholder=\"Name this Auth Policy\"/>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Primary Authentication'\"\n [layout]=\"'row'\"\n >\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"form-field-title-container\">\n <div class=\"config-container-label\">Cert</div>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Allow x509 certificate based authentication\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <div\n (click)=\"toggleCertAllowed()\"\n [ngClass]=\"{ on: formData.primary.cert.allowed }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.primary.cert.allowed\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.primary.cert.allowed\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"form-field-title-container\">\n <div class=\"config-container-label\">Ext JWT</div>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Allow externally signed JWT bearer tokens\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <div\n (click)=\"toggleExtJwtAllowed()\"\n [ngClass]=\"{ on: formData.primary.extJwt.allowed }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.primary.extJwt.allowed\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.primary.extJwt.allowed\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"form-field-title-container\">\n <div class=\"config-container-label\">UPDB</div>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Allow authentication via a traditional "Username Password Database"\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <div\n (click)=\"toggleUpdbAllowed()\"\n [ngClass]=\"{ on: formData.primary.updb.allowed }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.primary.updb.allowed\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.primary.updb.allowed\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n *ngIf=\"formData.primary.cert.allowed\"\n [title]=\"'Cert Options'\"\n [layout]=\"'row'\"\n >\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"form-field-title-container\">\n <div class=\"config-container-label\">Allow Expired Certificates</div>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Allow expired client certificates to authenticate\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <div\n (click)=\"toggleAllowExpiredCerts()\"\n [ngClass]=\"{ on: formData.primary.cert.allowExpiredCerts }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.primary.cert.allowExpiredCerts\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.primary.cert.allowExpiredCerts\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n *ngIf=\"formData.primary.extJwt.allowed\"\n [title]=\"'Ext JWT Options'\"\n [layout]=\"'column'\"\n >\n <div class=\"form-field-label-container allowed-signers-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Allowed JWT Signers</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Choose which External JWT Signers may be used for authentication\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <lib-tag-selector\n [(selectedNamedAttributes)]=\"allowedJwtSignerAttributes\"\n [availableNamedAttributes]=\"svc.jwtSignerNamedAttributes\"\n [placeholder]=\"'Select which External JWT Signers to allow'\"\n (selectedNamedAttributesChange)=\"allowedJwtSignersChanged($event)\"\n ></lib-tag-selector>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n *ngIf=\"formData.primary.updb.allowed\"\n [title]=\"'UPDB Options'\"\n [layout]=\"'column'\"\n >\n <div class=\"form-field-row updb-input-options\">\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Minimum Length</span>\n </div>\n <input class=\"form-field-input\" placeholder=\"Enter a numeric value\" type=\"number\" [(ngModel)]=\"formData.primary.updb.minPasswordLength\"/>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Max Attempts</span>\n </div>\n <input class=\"form-field-input\" placeholder=\"Enter a numeric value\" type=\"number\" [(ngModel)]=\"formData.primary.updb.maxAttempts\"/>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Lockout Duration <div class=\"form-sub-text\">(min)</div></span>\n </div>\n <input class=\"form-field-input\" placeholder=\"Enter time in min\" type=\"number\" [(ngModel)]=\"formData.primary.updb.lockoutDurationMinutes\"/>\n </div>\n </div>\n <div class=\"form-field-row\">\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"form-field-title-container\">\n <div class=\"config-container-label\">Mixed Case</div>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Require upper and lower case charachters\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <div\n (click)=\"toggleUpdbMixed()\"\n [ngClass]=\"{ on: formData.primary.updb.requireMixedCase }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.primary.updb.requireMixedCase\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.primary.updb.requireMixedCase\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"form-field-title-container\">\n <div class=\"config-container-label\">Numeric</div>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Require numerical charachters 0-9\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <div\n (click)=\"toggleUpdbNumeric()\"\n [ngClass]=\"{ on: formData.primary.updb.requireNumericChar }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.primary.updb.requireNumericChar\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.primary.updb.requireNumericChar\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"form-field-title-container\">\n <div class=\"config-container-label\">Special</div>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Require special (non-alpha numeric) charachters. ie. !%$@*\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <div\n (click)=\"toggleUpdbSpecial()\"\n [ngClass]=\"{ on: formData.primary.updb.requireSpecialChar }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.primary.updb.requireSpecialChar\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.primary.updb.requireSpecialChar\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-toggle [(toggleOn)]=\"showMore\" (toggleOnChange)=\"showMoreChanged($event)\" style=\"margin: 0px 10px\"></lib-form-field-toggle>\n <div [hidden]=\"!showMore\" class=\"form-group-column\">\n <lib-form-field-container\n [title]=\"'Custom Tags'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n >\n <lib-custom-tags [(tags)]=\"formData.tags\"></lib-custom-tags>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column two-fifths\">\n <lib-form-field-container\n [title]=\"'Secondary Authentication'\"\n [label]=\"'OPTIONAL'\"\n [layout]=\"'column'\"\n [contentStyle]=\"'z-index: 1000001'\"\n >\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">TOTP MFA</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Require authenticating clients to have TOTP MFA enabled (Time-based, One-Time Password)\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"form-field-title-container\">\n <div class=\"config-container-label\">Require TOTP</div>\n </div>\n <div\n (click)=\"toggleRequireTotp()\"\n [ngClass]=\"{ on: formData.secondary.requireTotp }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.secondary.requireTotp\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.secondary.requireTotp\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">JWT Signer</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Require every client request to have a JWT from the specified External JTW Signer in the HTTP Authentication header\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <p-dropdown\n placeholder=\"Select JWT Signer...\"\n optionLabel=\"name\"\n optionValue=\"id\"\n filterBy=\"name\"\n [options]=\"svc.jwtSigners\"\n [filter]=\"true\"\n [showClear]=\"true\"\n (change)=\"secondaryJwtSignerChanged($event)\"\n [(ngModel)]=\"formData.secondary.requireExtJwtSigner\"\n >\n <ng-template pTemplate=\"filter\" let-options=\"options\">\n <div class=\"dropdown-filter-container\">\n <div class=\"p-inputgroup\" (click)=\"$event.stopPropagation()\">\n <span class=\"p-inputgroup-addon\"><i class=\"pi pi-search\"></i></span>\n <input\n type=\"text\"\n pInputText\n placeholder=\"Filter\"\n (keyup)=\"jwtSignersFilterChangedDebounced($event)\" />\n </div>\n <button pButton\n icon=\"pi pi-times\"\n [ngClass]=\"{'configs-loading': svc.jwtSignersLoading}\"\n (click)=\"clearJwtSignerFilter($event)\"\n severity=\"secondary\">\n </button>\n <div class=\"spinner\" *ngIf=\"svc.jwtSignersLoading\"></div>\n </div>\n </ng-template>\n </p-dropdown>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'API Calls'\"\n [headerActions]=\"apiOptions\"\n (actionRequested)=\"apiActionRequested($event)\"\n [class]=\"'api-data-no-wrap'\"\n >\n <div class=\"form-row\">\n <input class=\"form-field-input\" [value]=\"apiCallURL\"/>\n <div class=\"icon-copy copy\" (click)=\"copyToClipboard(apiCallURL)\"></div>\n </div>\n <lib-json-view *ngIf=\"formData\" [(data)]=\"apiData\" [readOnly]=\"true\" [showCopy]=\"true\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>\n", styles: ["@charset \"UTF-8\";.form-group-column.three-fifths{min-width:31.25rem}.jwt-signer-form-container{display:flex;flex-direction:column;height:100%;width:100%;align-items:center;gap:var(--gapXL)}.jwt-signer-form-container .select-file-button{padding-left:var(--paddingMedium);padding-right:var(--paddingMedium);height:1.5625rem;width:-moz-fit-content;width:fit-content;white-space:nowrap;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.875rem;background:var(--primary);border-style:solid;border-width:.0625rem;border-color:var(--stroke);color:var(--white);cursor:pointer;border-radius:var(--inputBorderRadius);gap:var(--marginMedium);margin-top:-.3125rem}.jwt-signer-form-container .select-file-button:hover{filter:brightness(.8)}.jwt-signer-form-container .select-file-button:active{filter:grayscale(1);transform:translateY(.0625rem)}.jwt-signer-form-container .select-file-button .spinner{display:inline-block;width:.5rem;height:.5rem;border-radius:50%;background:transparent;border-top:.125rem solid white;border-right:.125rem solid white;border-bottom:.125rem solid transparent;border-left:.125rem solid transparent;animation:loading .5s infinite linear}.jwt-signer-form-container .select-file-label-container{gap:var(--marginMedium)}.jwt-signer-form-container .updb-input-options{margin-top:var(--marginSmall);background-color:var(--formGroup);padding:var(--paddingMedium);border-radius:var(--inputBorderRadius)}.jwt-signer-form-container .updb-input-options .form-field-title{color:var(--offWhite)}::ng-deep .jwt-signer-form-container select:disabled,::ng-deep .jwt-signer-form-container input:disabled{opacity:.75!important;cursor:text;background-color:var(--stroke)!important}::ng-deep .api-data-no-wrap .jse-text-mode{width:100%}::ng-deep .api-data-no-wrap .jse-text-mode .cm-editor{width:100%}::ng-deep .api-data-no-wrap .jse-text-mode .cm-editor .cm-scroller{width:100%}::ng-deep .api-data-no-wrap .jse-text-mode .cm-editor .cm-scroller .cm-content{width:100%;overflow:auto}::ng-deep .api-data-no-wrap .jse-text-mode .cm-editor .cm-scroller .cm-content .\\37cr{white-space:nowrap}.radio-group-container{display:flex;gap:var(--marginLarge)}.radio-group-container:focus .radio-button-container .radio-button-circle{border-color:var(--primaryColor)}.radio-group-container .radio-button-container{display:flex;flex-direction:row;align-items:center;background-color:var(--formGroup);border-radius:var(--inputBorderRadius);width:100%;padding-left:var(--paddingMedium);padding-right:var(--paddingMedium);padding-top:var(--paddingLarge);padding-bottom:var(--paddingLarge);cursor:pointer;gap:var(--marginMedium)}.radio-group-container .radio-button-container .radio-button-circle{display:flex;width:1.3125rem;height:1.3125rem;border-radius:1.3125rem;border-width:.125rem;border-style:solid;border-color:var(--offWhite);align-items:center;justify-content:center;background-color:var(--offWhite)}.radio-group-container .radio-button-container .radio-button-circle .radio-button-inner-circle{display:none;width:.9375rem;height:.9375rem;border-radius:.9375rem;align-items:center;justify-content:center;background-color:var(--primaryColor)}.radio-group-container .radio-button-container.selected .radio-button-circle .radio-button-inner-circle{display:flex}.radio-group-container .radio-button-container:active .radio-button-circle .radio-button-inner-circle{display:flex;background-color:var(--menu)}.radio-group-container .radio-button-container .radio-button-label{color:var(--offWhite);font-size:.875rem;font-weight:600}.allowed-signers-container{background-color:var(--formGroup);padding:var(--paddingMedium);border-radius:var(--inputBorderRadius)}.allowed-signers-container .form-field-title{color:var(--offWhite)}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.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: i5.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i6$1.InputText, selector: "[pInputText]" }, { kind: "directive", type: i9.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i8.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: i4$2.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: FormHeaderComponent, selector: "lib-form-header", inputs: ["data", "badges", "title", "moreActions", "formView", "saveDisabled", "saveTooltip", "actionButtonText", "moreActionsText", "showHeaderToggle", "showHeaderButton"], outputs: ["formViewChange", "actionRequested"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }, { kind: "component", type: LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }, { kind: "component", type: FormFieldToggleComponent, selector: "lib-form-field-toggle", inputs: ["label", "orientation", "labelOn", "labelOff", "toggleOn"], outputs: ["toggleOnChange"] }, { kind: "component", type: JsonViewComponent, selector: "lib-json-view", inputs: ["data", "schema", "readOnly", "jsonInvalid", "showCopy", "showLineNumbers"], outputs: ["dataChange", "jsonChange", "jsonInvalidChange"] }, { kind: "component", type: TagSelectorComponent, selector: "lib-tag-selector", inputs: ["placeholder", "disableField", "disableCreate", "hideOption", "isLoading", "errorMessage", "focusOnInit", "selectedRoleAttributes", "selectedNamedAttributes", "hasError", "availableRoleAttributes", "availableNamedAttributes"], outputs: ["addRoleAttribute", "addNamedAttribute", "roleAttributeRemoved", "namedAttributeRemoved", "selectedRoleAttributesChange", "selectedNamedAttributesChange", "filterChange"] }, { kind: "component", type: CustomTagsComponent, selector: "lib-custom-tags", inputs: ["tags"], outputs: ["tagsChange"] }] }); }
|
|
24465
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: AuthPolicyFormComponent, selector: "lib-configuration", inputs: { formData: "formData", errors: "errors" }, outputs: { close: "close" }, viewQueries: [{ propertyName: "filterInput", first: true, predicate: ["fileSelect"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n tabindex=\"0\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"(formData.id ? 'Auth Policy Details' : 'Create Auth Policy')\"\n [moreActions]=\"formData.moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n [saveDisabled]=\"svc.saveDisabled || formDataInvalid\"\n ></lib-form-header>\n <div class=\"jwt-signer-form-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" [hidden]=\"formView !== 'simple'\">\n <div class=\"form-group-column three-fifths\">\n <lib-form-field-container\n [title]=\"'Name'\"\n [label]=\"'Required'\"\n >\n <input class=\"form-field-input read-only\" [(ngModel)]=\"formData.name\" [ngClass]=\"{error: errors['name']}\" placeholder=\"Name this Auth Policy\"/>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Primary Authentication'\"\n [layout]=\"'row'\"\n >\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"form-field-title-container\">\n <div class=\"config-container-label\">Cert</div>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Allow x509 certificate based authentication\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <div\n (click)=\"toggleCertAllowed()\"\n [ngClass]=\"{ on: formData.primary.cert.allowed }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.primary.cert.allowed\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.primary.cert.allowed\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"form-field-title-container\">\n <div class=\"config-container-label\">Ext JWT</div>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Allow externally signed JWT bearer tokens\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <div\n (click)=\"toggleExtJwtAllowed()\"\n [ngClass]=\"{ on: formData.primary.extJwt.allowed }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.primary.extJwt.allowed\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.primary.extJwt.allowed\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"form-field-title-container\">\n <div class=\"config-container-label\">UPDB</div>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Allow authentication via a traditional "Username Password Database"\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <div\n (click)=\"toggleUpdbAllowed()\"\n [ngClass]=\"{ on: formData.primary.updb.allowed }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.primary.updb.allowed\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.primary.updb.allowed\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n *ngIf=\"formData.primary.cert.allowed\"\n [title]=\"'Cert Options'\"\n [layout]=\"'row'\"\n >\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"form-field-title-container\">\n <div class=\"config-container-label\">Allow Expired Certificates</div>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Allow expired client certificates to authenticate\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <div\n (click)=\"toggleAllowExpiredCerts()\"\n [ngClass]=\"{ on: formData.primary.cert.allowExpiredCerts }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.primary.cert.allowExpiredCerts\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.primary.cert.allowExpiredCerts\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n *ngIf=\"formData.primary.extJwt.allowed\"\n [title]=\"'Ext JWT Options'\"\n [layout]=\"'column'\"\n >\n <div class=\"form-field-label-container allowed-signers-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Allowed JWT Signers</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Choose which External JWT Signers may be used for authentication\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <lib-tag-selector\n [(selectedNamedAttributes)]=\"allowedJwtSignerAttributes\"\n [availableNamedAttributes]=\"svc.jwtSignerNamedAttributes\"\n [placeholder]=\"'Select which External JWT Signers to allow'\"\n (selectedNamedAttributesChange)=\"allowedJwtSignersChanged($event)\"\n ></lib-tag-selector>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n *ngIf=\"formData.primary.updb.allowed\"\n [title]=\"'UPDB Options'\"\n [layout]=\"'column'\"\n >\n <div class=\"form-field-row updb-input-options\">\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Minimum Length</span>\n </div>\n <input class=\"form-field-input\" placeholder=\"Enter a numeric value\" type=\"number\" [(ngModel)]=\"formData.primary.updb.minPasswordLength\"/>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Max Attempts</span>\n </div>\n <input class=\"form-field-input\" placeholder=\"Enter a numeric value\" type=\"number\" [(ngModel)]=\"formData.primary.updb.maxAttempts\"/>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Lockout Duration <div class=\"form-sub-text\">(min)</div></span>\n </div>\n <input class=\"form-field-input\" placeholder=\"Enter time in min\" type=\"number\" [(ngModel)]=\"formData.primary.updb.lockoutDurationMinutes\"/>\n </div>\n </div>\n <div class=\"form-field-row\">\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"form-field-title-container\">\n <div class=\"config-container-label\">Mixed Case</div>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Require upper and lower case charachters\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <div\n (click)=\"toggleUpdbMixed()\"\n [ngClass]=\"{ on: formData.primary.updb.requireMixedCase }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.primary.updb.requireMixedCase\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.primary.updb.requireMixedCase\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"form-field-title-container\">\n <div class=\"config-container-label\">Numeric</div>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Require numerical charachters 0-9\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <div\n (click)=\"toggleUpdbNumeric()\"\n [ngClass]=\"{ on: formData.primary.updb.requireNumericChar }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.primary.updb.requireNumericChar\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.primary.updb.requireNumericChar\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"form-field-title-container\">\n <div class=\"config-container-label\">Special</div>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Require special (non-alpha numeric) charachters. ie. !%$@*\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <div\n (click)=\"toggleUpdbSpecial()\"\n [ngClass]=\"{ on: formData.primary.updb.requireSpecialChar }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.primary.updb.requireSpecialChar\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.primary.updb.requireSpecialChar\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-toggle [(toggleOn)]=\"showMore\" (toggleOnChange)=\"showMoreChanged($event)\" style=\"margin: 0px 10px\"></lib-form-field-toggle>\n <div [hidden]=\"!showMore\" class=\"form-group-column\">\n <lib-form-field-container\n [title]=\"'Custom Tags'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n >\n <lib-custom-tags [(tags)]=\"formData.tags\"></lib-custom-tags>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column two-fifths\">\n <lib-form-field-container\n [title]=\"'Secondary Authentication'\"\n [label]=\"'OPTIONAL'\"\n [layout]=\"'column'\"\n [contentStyle]=\"'z-index: 1000001'\"\n >\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">TOTP MFA</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Require authenticating clients to have TOTP MFA enabled (Time-based, One-Time Password)\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"form-field-title-container\">\n <div class=\"config-container-label\">Require TOTP</div>\n </div>\n <div\n (click)=\"toggleRequireTotp()\"\n [ngClass]=\"{ on: formData.secondary.requireTotp }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.secondary.requireTotp\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.secondary.requireTotp\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">JWT Signer</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Require every client request to have a JWT from the specified External JTW Signer in the HTTP Authentication header\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <p-dropdown\n placeholder=\"Select JWT Signer...\"\n optionLabel=\"name\"\n optionValue=\"id\"\n filterBy=\"name\"\n [options]=\"svc.jwtSigners\"\n [filter]=\"true\"\n [showClear]=\"true\"\n (change)=\"secondaryJwtSignerChanged($event)\"\n [(ngModel)]=\"formData.secondary.requireExtJwtSigner\"\n >\n <ng-template pTemplate=\"filter\" let-options=\"options\">\n <div class=\"dropdown-filter-container\">\n <div class=\"p-inputgroup\" (click)=\"$event.stopPropagation()\">\n <span class=\"p-inputgroup-addon\"><i class=\"pi pi-search\"></i></span>\n <input\n type=\"text\"\n pInputText\n placeholder=\"Filter\"\n (keyup)=\"jwtSignersFilterChangedDebounced($event)\" />\n </div>\n <button pButton\n icon=\"pi pi-times\"\n [ngClass]=\"{'configs-loading': svc.jwtSignersLoading}\"\n (click)=\"clearJwtSignerFilter($event)\"\n severity=\"secondary\">\n </button>\n <div class=\"spinner\" *ngIf=\"svc.jwtSignersLoading\"></div>\n </div>\n </ng-template>\n </p-dropdown>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'API Calls'\"\n [headerActions]=\"apiOptions\"\n (actionRequested)=\"apiActionRequested($event)\"\n [class]=\"'api-data-no-wrap'\"\n >\n <div class=\"form-row\">\n <input class=\"form-field-input\" [value]=\"apiCallURL\"/>\n <div class=\"icon-copy copy\" (click)=\"copyToClipboard(apiCallURL)\"></div>\n </div>\n <lib-json-view *ngIf=\"formData\" [(data)]=\"apiData\" [readOnly]=\"true\" [showCopy]=\"true\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>\n", styles: ["@charset \"UTF-8\";.form-group-column.three-fifths{min-width:31.25rem}.jwt-signer-form-container{display:flex;flex-direction:column;height:100%;width:100%;align-items:center;gap:var(--gapXL)}.jwt-signer-form-container .select-file-button{padding-left:var(--paddingMedium);padding-right:var(--paddingMedium);height:1.5625rem;width:-moz-fit-content;width:fit-content;white-space:nowrap;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.875rem;background:var(--primary);border-style:solid;border-width:.0625rem;border-color:var(--stroke);color:var(--white);cursor:pointer;border-radius:var(--inputBorderRadius);gap:var(--marginMedium);margin-top:-.3125rem}.jwt-signer-form-container .select-file-button:hover{filter:brightness(.8)}.jwt-signer-form-container .select-file-button:active{filter:grayscale(1);transform:translateY(.0625rem)}.jwt-signer-form-container .select-file-button .spinner{display:inline-block;width:.5rem;height:.5rem;border-radius:50%;background:transparent;border-top:.125rem solid white;border-right:.125rem solid white;border-bottom:.125rem solid transparent;border-left:.125rem solid transparent;animation:loading .5s infinite linear}.jwt-signer-form-container .select-file-label-container{gap:var(--marginMedium)}.jwt-signer-form-container .updb-input-options{margin-top:var(--marginSmall);background-color:var(--formGroup);padding:var(--paddingMedium);border-radius:var(--inputBorderRadius)}.jwt-signer-form-container .updb-input-options .form-field-title{color:var(--offWhite)}::ng-deep .jwt-signer-form-container select:disabled,::ng-deep .jwt-signer-form-container input:disabled{opacity:.75!important;cursor:text;background-color:var(--stroke)!important}::ng-deep .api-data-no-wrap .jse-text-mode{width:100%}::ng-deep .api-data-no-wrap .jse-text-mode .cm-editor{width:100%}::ng-deep .api-data-no-wrap .jse-text-mode .cm-editor .cm-scroller{width:100%}::ng-deep .api-data-no-wrap .jse-text-mode .cm-editor .cm-scroller .cm-content{width:100%;overflow:auto}::ng-deep .api-data-no-wrap .jse-text-mode .cm-editor .cm-scroller .cm-content .\\37cr{white-space:nowrap}.radio-group-container{display:flex;gap:var(--marginLarge)}.radio-group-container:focus .radio-button-container .radio-button-circle{border-color:var(--primaryColor)}.radio-group-container .radio-button-container{display:flex;flex-direction:row;align-items:center;background-color:var(--formGroup);border-radius:var(--inputBorderRadius);width:100%;padding-left:var(--paddingMedium);padding-right:var(--paddingMedium);padding-top:var(--paddingLarge);padding-bottom:var(--paddingLarge);cursor:pointer;gap:var(--marginMedium)}.radio-group-container .radio-button-container .radio-button-circle{display:flex;width:1.3125rem;height:1.3125rem;border-radius:1.3125rem;border-width:.125rem;border-style:solid;border-color:var(--offWhite);align-items:center;justify-content:center;background-color:var(--offWhite)}.radio-group-container .radio-button-container .radio-button-circle .radio-button-inner-circle{display:none;width:.9375rem;height:.9375rem;border-radius:.9375rem;align-items:center;justify-content:center;background-color:var(--primaryColor)}.radio-group-container .radio-button-container.selected .radio-button-circle .radio-button-inner-circle{display:flex}.radio-group-container .radio-button-container:active .radio-button-circle .radio-button-inner-circle{display:flex;background-color:var(--menu)}.radio-group-container .radio-button-container .radio-button-label{color:var(--offWhite);font-size:.875rem;font-weight:600}.allowed-signers-container{background-color:var(--formGroup);padding:var(--paddingMedium);border-radius:var(--inputBorderRadius)}.allowed-signers-container .form-field-title{color:var(--offWhite)}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.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: i5.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i6$1.InputText, selector: "[pInputText]" }, { kind: "directive", type: i9.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i8.ButtonDirective, selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: i4$2.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: FormHeaderComponent, selector: "lib-form-header", inputs: ["data", "badges", "title", "moreActions", "formView", "saveDisabled", "saveTooltip", "actionButtonText", "moreActionsText", "showHeaderToggle", "showHeaderButton", "multiActions"], outputs: ["formViewChange", "actionRequested", "multiActionRequested"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }, { kind: "component", type: LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }, { kind: "component", type: FormFieldToggleComponent, selector: "lib-form-field-toggle", inputs: ["label", "orientation", "labelOn", "labelOff", "toggleOn"], outputs: ["toggleOnChange"] }, { kind: "component", type: JsonViewComponent, selector: "lib-json-view", inputs: ["data", "schema", "readOnly", "jsonInvalid", "showCopy", "showLineNumbers"], outputs: ["dataChange", "jsonChange", "jsonInvalidChange"] }, { kind: "component", type: TagSelectorComponent, selector: "lib-tag-selector", inputs: ["placeholder", "disableField", "disableCreate", "hideOption", "isLoading", "errorMessage", "focusOnInit", "selectedRoleAttributes", "selectedNamedAttributes", "hasError", "availableRoleAttributes", "availableNamedAttributes"], outputs: ["addRoleAttribute", "addNamedAttribute", "roleAttributeRemoved", "namedAttributeRemoved", "selectedRoleAttributesChange", "selectedNamedAttributesChange", "filterChange"] }, { kind: "component", type: CustomTagsComponent, selector: "lib-custom-tags", inputs: ["tags"], outputs: ["tagsChange"] }] }); }
|
|
23922
24466
|
}
|
|
23923
24467
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: AuthPolicyFormComponent, decorators: [{
|
|
23924
24468
|
type: Component,
|
|
@@ -24727,7 +25271,7 @@ class CertificateAuthorityFormComponent extends ProjectableForm {
|
|
|
24727
25271
|
this.formData.externalIdClaim.parserCriteria = parserCriteria;
|
|
24728
25272
|
}
|
|
24729
25273
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CertificateAuthorityFormComponent, deps: [{ token: CertificateAuthorityFormService }, { token: SchemaService }, { token: GrowlerService }, { token: SHAREDZ_EXTENSION }, { token: SETTINGS_SERVICE }, { token: ZITI_DATA_SERVICE }, { token: i4.Router }, { token: i4.ActivatedRoute }, { token: i1$4.Location }, { token: ValidationService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
24730
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CertificateAuthorityFormComponent, selector: "lib-certificate-authority", inputs: { formData: "formData", errors: "errors" }, outputs: { close: "close" }, viewQueries: [{ propertyName: "filterInput", first: true, predicate: ["fileSelect"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n tabindex=\"0\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"(formData.id ? 'Certificate Authority Details' : 'Create Certificate Authority')\"\n [moreActions]=\"formData.moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n [saveDisabled]=\"svc.saveDisabled || formDataInvalid\"\n [badges]=\"badges\"\n ></lib-form-header>\n <div class=\"jwt-signer-form-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" [hidden]=\"formView !== 'simple'\">\n <div class=\"form-group-column three-fifths\">\n <lib-form-field-container\n [title]=\"'Name'\"\n [label]=\"'Required'\"\n >\n <input class=\"form-field-input read-only\" [(ngModel)]=\"formData.name\" [ngClass]=\"{error: errors['name']}\" placeholder=\"Name this Certificate Authority\"/>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Identity Name Format'\"\n [contentStyle]=\"'z-index: 99999999'\"\n [label]=\"'OPTIONAL'\"\n [helpText]=\"'The identity name format used to name automatically enrolling identities. Defaults to [caName]-[commonName]'\"\n >\n <input class=\"form-field-input read-only\" [(ngModel)]=\"formData.identityNameFormat\" [ngClass]=\"{error: errors['identityNameFormat']}\" placeholder=\"Defaults to [caName]-[commonName]\"/>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Identity Roles'\"\n [contentStyle]=\"'z-index: 99999999'\"\n [label]=\"'OPTIONAL'\"\n [helpText]=\"'The identity roles to give to automatically enrolling identities'\"\n >\n <lib-tag-selector\n [(selectedRoleAttributes)]=\"formData.identityRoles\"\n [availableRoleAttributes]=\"identityRoleAttributes\"\n [placeholder]=\"'Type to filter and enter to assign'\"\n [hasError]=\"errors.dialIdentities\"\n ></lib-tag-selector>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Enrollment Options'\"\n [layout]=\"'row'\"\n >\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"form-field-title-container\">\n <div class=\"config-container-label\">Auto Enroll</div>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Allows client certificates of the CA to automatically enroll when encountered\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <div\n (click)=\"toggleSwitch('isAutoCaEnrollmentEnabled')\"\n [ngClass]=\"{ on: formData.isAutoCaEnrollmentEnabled }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.isAutoCaEnrollmentEnabled\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.isAutoCaEnrollmentEnabled\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"form-field-title-container\">\n <div class=\"config-container-label\">OTT Enroll</div>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Allows client certificates of the CA to enroll if an identity with an ottca enrollment was created\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <div\n (click)=\"toggleSwitch('isOttCaEnrollmentEnabled')\"\n [ngClass]=\"{ on: formData.isOttCaEnrollmentEnabled }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.isOttCaEnrollmentEnabled\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.isOttCaEnrollmentEnabled\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"form-field-title-container\">\n <div class=\"config-container-label\">Auth Enabled</div>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Allows client certificates of the CA to attempt to enroll\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <div\n (click)=\"toggleSwitch('isAuthEnabled')\"\n [ngClass]=\"{ on: formData.isAuthEnabled }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.isAuthEnabled\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.isAuthEnabled\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'External ID Claim'\"\n [layout]=\"'column'\"\n [helpText]=\"'Configuration used to pull values out of the x509 client certificate used to match identity externalId'\"\n [showToggle]=\"true\"\n [(headerToggle)]=\"externalIdClaim\"\n (headerToggleChange)=\"externalIdClaimChanged()\"\n >\n <div class=\"form-field-input-group\" [ngClass]=\"{disabled: !externalIdClaim}\">\n <div class=\"form-field-row\">\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Location</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Defines which value(s) in an x509 certificate will be processed\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <select [(ngModel)]=\"claimLocation\" id=\"ClaimLocation\" class=\"form-field-dropdown\" [disabled]=\"!externalIdClaim\" [ngClass]=\"{error: errors['claimLocation']}\">\n <option value=\"\">Select an option</option>\n <option *ngFor=\"let loc of locations\" [value]=\"loc\">\n {{ loc }}\n </option>\n </select>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Matcher</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Defines how values from location will be filtered\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <select [(ngModel)]=\"matcher\" id=\"ClaimMatcher\" class=\"form-field-dropdown\" [disabled]=\"!externalIdClaim\" [ngClass]=\"{error: errors['matcher']}\">\n <option value=\"\">Select an option</option>\n <option *ngFor=\"let matcher of matchers\" [value]=\"matcher\">\n {{ matcher }}\n </option>\n </select>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Parser</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Defines how values from location filtered by matcher will be parsed\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <select [(ngModel)]=\"parser\" id=\"ClaimParser\" class=\"form-field-dropdown\" [disabled]=\"!externalIdClaim\" [ngClass]=\"{error: errors['parser']}\">\n <option value=\"\">Select an option</option>\n <option *ngFor=\"let parser of parsers\" [value]=\"parser\">\n {{ parser }}\n </option>\n </select>\n </div>\n </div>\n <div class=\"form-field-row\">\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Index</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Should multiple values still be available after location, matcher, and parser processing the integer value here will be used from the set\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <input class=\"form-field-input\" type=\"number\" placeholder=\"Enter a number\" [(ngModel)]=\"index\" [ngClass]=\"{error: errors['index']}\" [disabled]=\"!externalIdClaim\"/>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Match Criteria</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Defines the PREFIX, SUFFIX, or SCHEME to look for based on matcher\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <input class=\"form-field-input\" placeholder=\"Enter matcher criteria\" [(ngModel)]=\"matcherCriteria\" [ngClass]=\"{error: errors['matcherCriteria']}\" [disabled]=\"!externalIdClaim\"/>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Parser Criteria</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Defines the criteria to provide to parser\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <input class=\"form-field-input\" placeholder=\"Enter parser criteria\" [(ngModel)]=\"parserCriteria\" [ngClass]=\"{error: errors['parserCriteria']}\" [disabled]=\"!externalIdClaim\"/>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'PEM'\"\n [label]=\"'REQUIRED'\"\n >\n <div class=\"form-field-input-group\">\n <div class=\"form-field-label-container select-file-label-container\">\n <div class=\"form-field-header\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Enter PEM</span>\n </div>\n <span class=\"select-file-button\" (click)=\"openFileSelect($event)\">\n Select File\n <div class=\"spinner\" *ngIf=\"fileSelectOpening\"></div>\n </span>\n <input #fileSelect type=\"file\" style=\"display:none\" (change)=\"selectPemFile($event)\">\n </div>\n <textarea placeholder=\"Paste pem contents or select file\" [(ngModel)]=\"formData.certPem\" [ngClass]=\"{error: errors['certPem']}\"></textarea>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-toggle [(toggleOn)]=\"showMore\" (toggleOnChange)=\"showMoreChanged($event)\" style=\"margin: 0px 10px\"></lib-form-field-toggle>\n <div [hidden]=\"!showMore\" class=\"form-group-column\">\n <lib-form-field-container\n [title]=\"'Custom Tags'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n >\n <lib-custom-tags [(tags)]=\"formData.tags\"></lib-custom-tags>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column two-fifths\">\n <lib-form-field-container\n *ngIf=\"formData.id && !this.formData.isVerified\"\n [showHeader]=\"false\"\n >\n <a class=\"download-button\" href=\"./{{this.basePath}}/{{this.formData.id}}/verify\" (click)=\"verifyCertificate($event)\">\n <div class=\"verify-certificate\"></div>\n <span>Verify Certificate</span>\n <div class=\"tap-to-download\"></div>\n </a>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'API Calls'\"\n [headerActions]=\"apiOptions\"\n (actionRequested)=\"apiActionRequested($event)\"\n [class]=\"'api-data-no-wrap'\"\n >\n <div class=\"form-row\">\n <input class=\"form-field-input\" [value]=\"apiCallURL\"/>\n <div class=\"icon-copy copy\" (click)=\"copyToClipboard(apiCallURL)\"></div>\n </div>\n <lib-json-view *ngIf=\"formData\" [(data)]=\"apiData\" [readOnly]=\"true\" [showCopy]=\"true\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>\n", styles: ["@charset \"UTF-8\";.form-group-column.three-fifths{min-width:31.25rem}.jwt-signer-form-container{display:flex;flex-direction:column;height:100%;width:100%;align-items:center;gap:var(--gapXL)}.jwt-signer-form-container .select-file-button{padding-left:var(--paddingMedium);padding-right:var(--paddingMedium);height:1.5625rem;width:-moz-fit-content;width:fit-content;white-space:nowrap;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.875rem;background:var(--primary);border-style:solid;border-width:.0625rem;border-color:var(--stroke);color:var(--white);cursor:pointer;border-radius:var(--inputBorderRadius);gap:var(--marginMedium);margin-top:-.3125rem}.jwt-signer-form-container .select-file-button:hover{filter:brightness(.8)}.jwt-signer-form-container .select-file-button:active{filter:grayscale(1);transform:translateY(.0625rem)}.jwt-signer-form-container .select-file-button .spinner{display:inline-block;width:.5rem;height:.5rem;border-radius:50%;background:transparent;border-top:.125rem solid white;border-right:.125rem solid white;border-bottom:.125rem solid transparent;border-left:.125rem solid transparent;animation:loading .5s infinite linear}.jwt-signer-form-container .select-file-label-container{gap:var(--marginMedium)}.jwt-signer-form-container .updb-input-options{margin-top:var(--marginSmall);background-color:var(--formGroup);padding:var(--paddingMedium);border-radius:var(--inputBorderRadius)}.jwt-signer-form-container .updb-input-options .form-field-title{color:var(--offWhite)}::ng-deep .jwt-signer-form-container select:disabled,::ng-deep .jwt-signer-form-container input:disabled{opacity:.75!important;cursor:text;background-color:var(--stroke)!important}::ng-deep .api-data-no-wrap .jse-text-mode{width:100%}::ng-deep .api-data-no-wrap .jse-text-mode .cm-editor{width:100%}::ng-deep .api-data-no-wrap .jse-text-mode .cm-editor .cm-scroller{width:100%}::ng-deep .api-data-no-wrap .jse-text-mode .cm-editor .cm-scroller .cm-content{width:100%;overflow:auto}::ng-deep .api-data-no-wrap .jse-text-mode .cm-editor .cm-scroller .cm-content .\\37cr{white-space:nowrap}.radio-group-container{display:flex;gap:var(--marginLarge)}.radio-group-container:focus .radio-button-container .radio-button-circle{border-color:var(--primaryColor)}.radio-group-container .radio-button-container{display:flex;flex-direction:row;align-items:center;background-color:var(--formGroup);border-radius:var(--inputBorderRadius);width:100%;padding-left:var(--paddingMedium);padding-right:var(--paddingMedium);padding-top:var(--paddingLarge);padding-bottom:var(--paddingLarge);cursor:pointer;gap:var(--marginMedium)}.radio-group-container .radio-button-container .radio-button-circle{display:flex;width:1.3125rem;height:1.3125rem;border-radius:1.3125rem;border-width:.125rem;border-style:solid;border-color:var(--offWhite);align-items:center;justify-content:center;background-color:var(--offWhite)}.radio-group-container .radio-button-container .radio-button-circle .radio-button-inner-circle{display:none;width:.9375rem;height:.9375rem;border-radius:.9375rem;align-items:center;justify-content:center;background-color:var(--primaryColor)}.radio-group-container .radio-button-container.selected .radio-button-circle .radio-button-inner-circle{display:flex}.radio-group-container .radio-button-container:active .radio-button-circle .radio-button-inner-circle{display:flex;background-color:var(--menu)}.radio-group-container .radio-button-container .radio-button-label{color:var(--offWhite);font-size:.875rem;font-weight:600}.allowed-signers-container{background-color:var(--formGroup);padding:var(--paddingMedium);border-radius:var(--inputBorderRadius)}.allowed-signers-container .form-field-title{color:var(--offWhite)}.toggle-container .config-container-label{font-size:.8rem}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.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: i5.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i5.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: FormHeaderComponent, selector: "lib-form-header", inputs: ["data", "badges", "title", "moreActions", "formView", "saveDisabled", "saveTooltip", "actionButtonText", "moreActionsText", "showHeaderToggle", "showHeaderButton"], outputs: ["formViewChange", "actionRequested"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }, { kind: "component", type: LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }, { kind: "component", type: FormFieldToggleComponent, selector: "lib-form-field-toggle", inputs: ["label", "orientation", "labelOn", "labelOff", "toggleOn"], outputs: ["toggleOnChange"] }, { kind: "component", type: JsonViewComponent, selector: "lib-json-view", inputs: ["data", "schema", "readOnly", "jsonInvalid", "showCopy", "showLineNumbers"], outputs: ["dataChange", "jsonChange", "jsonInvalidChange"] }, { kind: "component", type: TagSelectorComponent, selector: "lib-tag-selector", inputs: ["placeholder", "disableField", "disableCreate", "hideOption", "isLoading", "errorMessage", "focusOnInit", "selectedRoleAttributes", "selectedNamedAttributes", "hasError", "availableRoleAttributes", "availableNamedAttributes"], outputs: ["addRoleAttribute", "addNamedAttribute", "roleAttributeRemoved", "namedAttributeRemoved", "selectedRoleAttributesChange", "selectedNamedAttributesChange", "filterChange"] }, { kind: "component", type: CustomTagsComponent, selector: "lib-custom-tags", inputs: ["tags"], outputs: ["tagsChange"] }] }); }
|
|
25274
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: CertificateAuthorityFormComponent, selector: "lib-certificate-authority", inputs: { formData: "formData", errors: "errors" }, outputs: { close: "close" }, viewQueries: [{ propertyName: "filterInput", first: true, predicate: ["fileSelect"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n tabindex=\"0\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"(formData.id ? 'Certificate Authority Details' : 'Create Certificate Authority')\"\n [moreActions]=\"formData.moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n [saveDisabled]=\"svc.saveDisabled || formDataInvalid\"\n [badges]=\"badges\"\n ></lib-form-header>\n <div class=\"jwt-signer-form-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" [hidden]=\"formView !== 'simple'\">\n <div class=\"form-group-column three-fifths\">\n <lib-form-field-container\n [title]=\"'Name'\"\n [label]=\"'Required'\"\n >\n <input class=\"form-field-input read-only\" [(ngModel)]=\"formData.name\" [ngClass]=\"{error: errors['name']}\" placeholder=\"Name this Certificate Authority\"/>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Identity Name Format'\"\n [contentStyle]=\"'z-index: 99999999'\"\n [label]=\"'OPTIONAL'\"\n [helpText]=\"'The identity name format used to name automatically enrolling identities. Defaults to [caName]-[commonName]'\"\n >\n <input class=\"form-field-input read-only\" [(ngModel)]=\"formData.identityNameFormat\" [ngClass]=\"{error: errors['identityNameFormat']}\" placeholder=\"Defaults to [caName]-[commonName]\"/>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Identity Roles'\"\n [contentStyle]=\"'z-index: 99999999'\"\n [label]=\"'OPTIONAL'\"\n [helpText]=\"'The identity roles to give to automatically enrolling identities'\"\n >\n <lib-tag-selector\n [(selectedRoleAttributes)]=\"formData.identityRoles\"\n [availableRoleAttributes]=\"identityRoleAttributes\"\n [placeholder]=\"'Type to filter and enter to assign'\"\n [hasError]=\"errors.dialIdentities\"\n ></lib-tag-selector>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Enrollment Options'\"\n [layout]=\"'row'\"\n >\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"form-field-title-container\">\n <div class=\"config-container-label\">Auto Enroll</div>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Allows client certificates of the CA to automatically enroll when encountered\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <div\n (click)=\"toggleSwitch('isAutoCaEnrollmentEnabled')\"\n [ngClass]=\"{ on: formData.isAutoCaEnrollmentEnabled }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.isAutoCaEnrollmentEnabled\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.isAutoCaEnrollmentEnabled\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"form-field-title-container\">\n <div class=\"config-container-label\">OTT Enroll</div>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Allows client certificates of the CA to enroll if an identity with an ottca enrollment was created\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <div\n (click)=\"toggleSwitch('isOttCaEnrollmentEnabled')\"\n [ngClass]=\"{ on: formData.isOttCaEnrollmentEnabled }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.isOttCaEnrollmentEnabled\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.isOttCaEnrollmentEnabled\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n <div class=\"config-item\">\n <div class=\"config-container toggle-container\">\n <div class=\"form-field-title-container\">\n <div class=\"config-container-label\">Auth Enabled</div>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Allows client certificates of the CA to attempt to enroll\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <div\n (click)=\"toggleSwitch('isAuthEnabled')\"\n [ngClass]=\"{ on: formData.isAuthEnabled }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.isAuthEnabled\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.isAuthEnabled\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'External ID Claim'\"\n [layout]=\"'column'\"\n [helpText]=\"'Configuration used to pull values out of the x509 client certificate used to match identity externalId'\"\n [showToggle]=\"true\"\n [(headerToggle)]=\"externalIdClaim\"\n (headerToggleChange)=\"externalIdClaimChanged()\"\n >\n <div class=\"form-field-input-group\" [ngClass]=\"{disabled: !externalIdClaim}\">\n <div class=\"form-field-row\">\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Location</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Defines which value(s) in an x509 certificate will be processed\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <select [(ngModel)]=\"claimLocation\" id=\"ClaimLocation\" class=\"form-field-dropdown\" [disabled]=\"!externalIdClaim\" [ngClass]=\"{error: errors['claimLocation']}\">\n <option value=\"\">Select an option</option>\n <option *ngFor=\"let loc of locations\" [value]=\"loc\">\n {{ loc }}\n </option>\n </select>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Matcher</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Defines how values from location will be filtered\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <select [(ngModel)]=\"matcher\" id=\"ClaimMatcher\" class=\"form-field-dropdown\" [disabled]=\"!externalIdClaim\" [ngClass]=\"{error: errors['matcher']}\">\n <option value=\"\">Select an option</option>\n <option *ngFor=\"let matcher of matchers\" [value]=\"matcher\">\n {{ matcher }}\n </option>\n </select>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Parser</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Defines how values from location filtered by matcher will be parsed\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <select [(ngModel)]=\"parser\" id=\"ClaimParser\" class=\"form-field-dropdown\" [disabled]=\"!externalIdClaim\" [ngClass]=\"{error: errors['parser']}\">\n <option value=\"\">Select an option</option>\n <option *ngFor=\"let parser of parsers\" [value]=\"parser\">\n {{ parser }}\n </option>\n </select>\n </div>\n </div>\n <div class=\"form-field-row\">\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Index</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Should multiple values still be available after location, matcher, and parser processing the integer value here will be used from the set\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <input class=\"form-field-input\" type=\"number\" placeholder=\"Enter a number\" [(ngModel)]=\"index\" [ngClass]=\"{error: errors['index']}\" [disabled]=\"!externalIdClaim\"/>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Match Criteria</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Defines the PREFIX, SUFFIX, or SCHEME to look for based on matcher\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <input class=\"form-field-input\" placeholder=\"Enter matcher criteria\" [(ngModel)]=\"matcherCriteria\" [ngClass]=\"{error: errors['matcherCriteria']}\" [disabled]=\"!externalIdClaim\"/>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Parser Criteria</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Defines the criteria to provide to parser\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <input class=\"form-field-input\" placeholder=\"Enter parser criteria\" [(ngModel)]=\"parserCriteria\" [ngClass]=\"{error: errors['parserCriteria']}\" [disabled]=\"!externalIdClaim\"/>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'PEM'\"\n [label]=\"'REQUIRED'\"\n >\n <div class=\"form-field-input-group\">\n <div class=\"form-field-label-container select-file-label-container\">\n <div class=\"form-field-header\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Enter PEM</span>\n </div>\n <span class=\"select-file-button\" (click)=\"openFileSelect($event)\">\n Select File\n <div class=\"spinner\" *ngIf=\"fileSelectOpening\"></div>\n </span>\n <input #fileSelect type=\"file\" style=\"display:none\" (change)=\"selectPemFile($event)\">\n </div>\n <textarea placeholder=\"Paste pem contents or select file\" [(ngModel)]=\"formData.certPem\" [ngClass]=\"{error: errors['certPem']}\"></textarea>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-toggle [(toggleOn)]=\"showMore\" (toggleOnChange)=\"showMoreChanged($event)\" style=\"margin: 0px 10px\"></lib-form-field-toggle>\n <div [hidden]=\"!showMore\" class=\"form-group-column\">\n <lib-form-field-container\n [title]=\"'Custom Tags'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n >\n <lib-custom-tags [(tags)]=\"formData.tags\"></lib-custom-tags>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column two-fifths\">\n <lib-form-field-container\n *ngIf=\"formData.id && !this.formData.isVerified\"\n [showHeader]=\"false\"\n >\n <a class=\"download-button\" href=\"./{{this.basePath}}/{{this.formData.id}}/verify\" (click)=\"verifyCertificate($event)\">\n <div class=\"verify-certificate\"></div>\n <span>Verify Certificate</span>\n <div class=\"tap-to-download\"></div>\n </a>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'API Calls'\"\n [headerActions]=\"apiOptions\"\n (actionRequested)=\"apiActionRequested($event)\"\n [class]=\"'api-data-no-wrap'\"\n >\n <div class=\"form-row\">\n <input class=\"form-field-input\" [value]=\"apiCallURL\"/>\n <div class=\"icon-copy copy\" (click)=\"copyToClipboard(apiCallURL)\"></div>\n </div>\n <lib-json-view *ngIf=\"formData\" [(data)]=\"apiData\" [readOnly]=\"true\" [showCopy]=\"true\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>\n", styles: ["@charset \"UTF-8\";.form-group-column.three-fifths{min-width:31.25rem}.jwt-signer-form-container{display:flex;flex-direction:column;height:100%;width:100%;align-items:center;gap:var(--gapXL)}.jwt-signer-form-container .select-file-button{padding-left:var(--paddingMedium);padding-right:var(--paddingMedium);height:1.5625rem;width:-moz-fit-content;width:fit-content;white-space:nowrap;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.875rem;background:var(--primary);border-style:solid;border-width:.0625rem;border-color:var(--stroke);color:var(--white);cursor:pointer;border-radius:var(--inputBorderRadius);gap:var(--marginMedium);margin-top:-.3125rem}.jwt-signer-form-container .select-file-button:hover{filter:brightness(.8)}.jwt-signer-form-container .select-file-button:active{filter:grayscale(1);transform:translateY(.0625rem)}.jwt-signer-form-container .select-file-button .spinner{display:inline-block;width:.5rem;height:.5rem;border-radius:50%;background:transparent;border-top:.125rem solid white;border-right:.125rem solid white;border-bottom:.125rem solid transparent;border-left:.125rem solid transparent;animation:loading .5s infinite linear}.jwt-signer-form-container .select-file-label-container{gap:var(--marginMedium)}.jwt-signer-form-container .updb-input-options{margin-top:var(--marginSmall);background-color:var(--formGroup);padding:var(--paddingMedium);border-radius:var(--inputBorderRadius)}.jwt-signer-form-container .updb-input-options .form-field-title{color:var(--offWhite)}::ng-deep .jwt-signer-form-container select:disabled,::ng-deep .jwt-signer-form-container input:disabled{opacity:.75!important;cursor:text;background-color:var(--stroke)!important}::ng-deep .api-data-no-wrap .jse-text-mode{width:100%}::ng-deep .api-data-no-wrap .jse-text-mode .cm-editor{width:100%}::ng-deep .api-data-no-wrap .jse-text-mode .cm-editor .cm-scroller{width:100%}::ng-deep .api-data-no-wrap .jse-text-mode .cm-editor .cm-scroller .cm-content{width:100%;overflow:auto}::ng-deep .api-data-no-wrap .jse-text-mode .cm-editor .cm-scroller .cm-content .\\37cr{white-space:nowrap}.radio-group-container{display:flex;gap:var(--marginLarge)}.radio-group-container:focus .radio-button-container .radio-button-circle{border-color:var(--primaryColor)}.radio-group-container .radio-button-container{display:flex;flex-direction:row;align-items:center;background-color:var(--formGroup);border-radius:var(--inputBorderRadius);width:100%;padding-left:var(--paddingMedium);padding-right:var(--paddingMedium);padding-top:var(--paddingLarge);padding-bottom:var(--paddingLarge);cursor:pointer;gap:var(--marginMedium)}.radio-group-container .radio-button-container .radio-button-circle{display:flex;width:1.3125rem;height:1.3125rem;border-radius:1.3125rem;border-width:.125rem;border-style:solid;border-color:var(--offWhite);align-items:center;justify-content:center;background-color:var(--offWhite)}.radio-group-container .radio-button-container .radio-button-circle .radio-button-inner-circle{display:none;width:.9375rem;height:.9375rem;border-radius:.9375rem;align-items:center;justify-content:center;background-color:var(--primaryColor)}.radio-group-container .radio-button-container.selected .radio-button-circle .radio-button-inner-circle{display:flex}.radio-group-container .radio-button-container:active .radio-button-circle .radio-button-inner-circle{display:flex;background-color:var(--menu)}.radio-group-container .radio-button-container .radio-button-label{color:var(--offWhite);font-size:.875rem;font-weight:600}.allowed-signers-container{background-color:var(--formGroup);padding:var(--paddingMedium);border-radius:var(--inputBorderRadius)}.allowed-signers-container .form-field-title{color:var(--offWhite)}.toggle-container .config-container-label{font-size:.8rem}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.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: i5.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i5.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: FormHeaderComponent, selector: "lib-form-header", inputs: ["data", "badges", "title", "moreActions", "formView", "saveDisabled", "saveTooltip", "actionButtonText", "moreActionsText", "showHeaderToggle", "showHeaderButton", "multiActions"], outputs: ["formViewChange", "actionRequested", "multiActionRequested"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }, { kind: "component", type: LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }, { kind: "component", type: FormFieldToggleComponent, selector: "lib-form-field-toggle", inputs: ["label", "orientation", "labelOn", "labelOff", "toggleOn"], outputs: ["toggleOnChange"] }, { kind: "component", type: JsonViewComponent, selector: "lib-json-view", inputs: ["data", "schema", "readOnly", "jsonInvalid", "showCopy", "showLineNumbers"], outputs: ["dataChange", "jsonChange", "jsonInvalidChange"] }, { kind: "component", type: TagSelectorComponent, selector: "lib-tag-selector", inputs: ["placeholder", "disableField", "disableCreate", "hideOption", "isLoading", "errorMessage", "focusOnInit", "selectedRoleAttributes", "selectedNamedAttributes", "hasError", "availableRoleAttributes", "availableNamedAttributes"], outputs: ["addRoleAttribute", "addNamedAttribute", "roleAttributeRemoved", "namedAttributeRemoved", "selectedRoleAttributesChange", "selectedNamedAttributesChange", "filterChange"] }, { kind: "component", type: CustomTagsComponent, selector: "lib-custom-tags", inputs: ["tags"], outputs: ["tagsChange"] }] }); }
|
|
24731
25275
|
}
|
|
24732
25276
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: CertificateAuthorityFormComponent, decorators: [{
|
|
24733
25277
|
type: Component,
|
|
@@ -24971,7 +25515,7 @@ class VerifyCertificateComponent extends ProjectableForm {
|
|
|
24971
25515
|
}
|
|
24972
25516
|
}
|
|
24973
25517
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: VerifyCertificateComponent, deps: [{ token: VerifyCertificateService }, { token: SchemaService }, { token: GrowlerService }, { token: SHAREDZ_EXTENSION }, { token: SETTINGS_SERVICE }, { token: ZITI_DATA_SERVICE }, { token: i4.Router }, { token: i4.ActivatedRoute }, { token: i1$4.Location }, { token: ValidationService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
24974
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: VerifyCertificateComponent, selector: "lib-certificate-authority", inputs: { formData: "formData", errors: "errors" }, outputs: { close: "close" }, viewQueries: [{ propertyName: "filterInput", first: true, predicate: ["fileSelect"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"projectable-form-wrapper verify-certificate-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n tabindex=\"0\"\n>\n <lib-form-header\n [title]=\"'Verify Certificate for CA:'\"\n [data]=\"formData\"\n [moreActions]=\"formData.moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n [saveDisabled]=\"svc.saveDisabled || formDataInvalid\"\n [showHeaderToggle]=\"false\"\n [actionButtonText]=\"'Verify'\"\n ></lib-form-header>\n <div class=\"verify-certificate-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" [hidden]=\"formView !== 'simple'\">\n <div class=\"form-group-column\">\n <lib-form-field-container\n [title]=\"'Instructions'\"\n >\n <ul class=\"instructions-list\">\n <li>Generate a certificate with the common name CN=<b>{{formData.verificationToken}}</b></li>\n <li>Upload the generated cert, or copy & paste it using the text field below</li>\n <li>Click the \"Verify\" button to submit certificate for verification</li>\n </ul>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Token'\"\n >\n <div class=\"copy-token-container\" (click)=\"copyToClipboard(formData.verificationToken)\">\n <span class=\"form-field-input copy-token-button\" matTooltip=\"Copy verifcation token\" matTooltipPosition=\"below\" matTooltipShowDelay=\"300\">{{formData.verificationToken}}</span>\n <div class=\"copy-icon\"></div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Certificate'\"\n [label]=\"'REQUIRED'\"\n >\n <span *ngIf=\"errors['certPem']\" class=\"cert-error-text error-text\">{{certErrorMessage}}</span>\n <div class=\"form-field-input-group\">\n <div class=\"form-field-label-container select-file-label-container\">\n <div class=\"form-field-header\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Enter PEM</span>\n </div>\n <span class=\"select-file-button\" (click)=\"openFileSelect($event)\">\n Select File\n <div class=\"spinner\" *ngIf=\"fileSelectOpening\"></div>\n </span>\n <input #fileSelect type=\"file\" style=\"display:none\" (change)=\"selectPemFile($event)\">\n </div>\n <textarea placeholder=\"Paste pem contents or select file\" [(ngModel)]=\"certificate\" [ngClass]=\"{error: errors['certPem']}\"></textarea>\n </div>\n </div>\n </lib-form-field-container>\n <div class=\"buttons-container buttons\">\n <div class=\"linkButton cancel\" (click)=\"returnToListPage()\">Oops, no get me out of here</div>\n <div class=\" save-button button save confirm\" (click)=\"save($event)\">Verify</div>\n </div>\n </div>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>\n", styles: ["::ng-deep .verify-certificate-container lib-form-header .form-header-container{max-width:50rem}.verify-certificate-container{display:flex;flex-direction:column;height:100%;width:100%;align-items:center;gap:var(--gapXL)}.verify-certificate-container .projectable-form-main-column{max-width:50rem}.verify-certificate-container .copy-token-container{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;cursor:pointer;background-color:var(--stroke);border-radius:var(--inputBorderRadius);transition:all .2s}.verify-certificate-container .copy-token-container .copy-icon{filter:grayscale(1)}.verify-certificate-container .copy-token-container:hover .copy-token-button{transform:scale(1.02)}.verify-certificate-container .copy-token-container:hover .copy-icon{transform:scale(1.02);filter:none}.verify-certificate-container .copy-token-container .copy-token-button{cursor:pointer;align-items:center;margin-left:var(--marginMedium);display:flex}.verify-certificate-container .instructions-list{margin:0;padding-left:1rem;display:flex;flex-direction:column;gap:.4rem;font-size:.9rem}.verify-certificate-container .select-file-button{padding-left:var(--paddingMedium);padding-right:var(--paddingMedium);height:1.5625rem;width:-moz-fit-content;width:fit-content;white-space:nowrap;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.875rem;background:var(--primary);border-style:solid;border-width:.0625rem;border-color:var(--stroke);color:var(--white);cursor:pointer;border-radius:var(--inputBorderRadius);gap:var(--marginMedium);margin-top:-.3125rem}.verify-certificate-container .select-file-button:hover{filter:brightness(.8)}.verify-certificate-container .select-file-button:active{filter:grayscale(1);transform:translateY(.0625rem)}.verify-certificate-container .select-file-button .spinner{display:inline-block;width:.5rem;height:.5rem;border-radius:50%;background:transparent;border-top:.125rem solid white;border-right:.125rem solid white;border-bottom:.125rem solid transparent;border-left:.125rem solid transparent;animation:loading .5s infinite linear}.verify-certificate-container .select-file-label-container{gap:var(--marginMedium)}.verify-certificate-container .cert-error-text{height:.7rem}.verify-certificate-container .save-button{display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.875rem;background:var(--primary);padding:.4375rem;border-radius:var(--inputBorderRadius);color:var(--white);cursor:pointer;box-shadow:0 .1875rem .5625rem 0 var(--primaryColorOpaque)}::ng-deep .verify-certificate-container select:disabled,::ng-deep .verify-certificate-container input:disabled{opacity:.75!important;cursor:text;background-color:var(--stroke)!important}::ng-deep .verify-certificate-wrapper lib-form-header .form-header-container{max-width:50rem}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: FormHeaderComponent, selector: "lib-form-header", inputs: ["data", "badges", "title", "moreActions", "formView", "saveDisabled", "saveTooltip", "actionButtonText", "moreActionsText", "showHeaderToggle", "showHeaderButton"], outputs: ["formViewChange", "actionRequested"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }, { kind: "component", type: LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }] }); }
|
|
25518
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: VerifyCertificateComponent, selector: "lib-certificate-authority", inputs: { formData: "formData", errors: "errors" }, outputs: { close: "close" }, viewQueries: [{ propertyName: "filterInput", first: true, predicate: ["fileSelect"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"projectable-form-wrapper verify-certificate-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n tabindex=\"0\"\n>\n <lib-form-header\n [title]=\"'Verify Certificate for CA:'\"\n [data]=\"formData\"\n [moreActions]=\"formData.moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n [saveDisabled]=\"svc.saveDisabled || formDataInvalid\"\n [showHeaderToggle]=\"false\"\n [actionButtonText]=\"'Verify'\"\n ></lib-form-header>\n <div class=\"verify-certificate-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" [hidden]=\"formView !== 'simple'\">\n <div class=\"form-group-column\">\n <lib-form-field-container\n [title]=\"'Instructions'\"\n >\n <ul class=\"instructions-list\">\n <li>Generate a certificate with the common name CN=<b>{{formData.verificationToken}}</b></li>\n <li>Upload the generated cert, or copy & paste it using the text field below</li>\n <li>Click the \"Verify\" button to submit certificate for verification</li>\n </ul>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Token'\"\n >\n <div class=\"copy-token-container\" (click)=\"copyToClipboard(formData.verificationToken)\">\n <span class=\"form-field-input copy-token-button\" matTooltip=\"Copy verifcation token\" matTooltipPosition=\"below\" matTooltipShowDelay=\"300\">{{formData.verificationToken}}</span>\n <div class=\"copy-icon\"></div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Certificate'\"\n [label]=\"'REQUIRED'\"\n >\n <span *ngIf=\"errors['certPem']\" class=\"cert-error-text error-text\">{{certErrorMessage}}</span>\n <div class=\"form-field-input-group\">\n <div class=\"form-field-label-container select-file-label-container\">\n <div class=\"form-field-header\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Enter PEM</span>\n </div>\n <span class=\"select-file-button\" (click)=\"openFileSelect($event)\">\n Select File\n <div class=\"spinner\" *ngIf=\"fileSelectOpening\"></div>\n </span>\n <input #fileSelect type=\"file\" style=\"display:none\" (change)=\"selectPemFile($event)\">\n </div>\n <textarea placeholder=\"Paste pem contents or select file\" [(ngModel)]=\"certificate\" [ngClass]=\"{error: errors['certPem']}\"></textarea>\n </div>\n </div>\n </lib-form-field-container>\n <div class=\"buttons-container buttons\">\n <div class=\"linkButton cancel\" (click)=\"returnToListPage()\">Oops, no get me out of here</div>\n <div class=\" save-button button save confirm\" (click)=\"save($event)\">Verify</div>\n </div>\n </div>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>\n", styles: ["::ng-deep .verify-certificate-container lib-form-header .form-header-container{max-width:50rem}.verify-certificate-container{display:flex;flex-direction:column;height:100%;width:100%;align-items:center;gap:var(--gapXL)}.verify-certificate-container .projectable-form-main-column{max-width:50rem}.verify-certificate-container .copy-token-container{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;cursor:pointer;background-color:var(--stroke);border-radius:var(--inputBorderRadius);transition:all .2s}.verify-certificate-container .copy-token-container .copy-icon{filter:grayscale(1)}.verify-certificate-container .copy-token-container:hover .copy-token-button{transform:scale(1.02)}.verify-certificate-container .copy-token-container:hover .copy-icon{transform:scale(1.02);filter:none}.verify-certificate-container .copy-token-container .copy-token-button{cursor:pointer;align-items:center;margin-left:var(--marginMedium);display:flex}.verify-certificate-container .instructions-list{margin:0;padding-left:1rem;display:flex;flex-direction:column;gap:.4rem;font-size:.9rem}.verify-certificate-container .select-file-button{padding-left:var(--paddingMedium);padding-right:var(--paddingMedium);height:1.5625rem;width:-moz-fit-content;width:fit-content;white-space:nowrap;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.875rem;background:var(--primary);border-style:solid;border-width:.0625rem;border-color:var(--stroke);color:var(--white);cursor:pointer;border-radius:var(--inputBorderRadius);gap:var(--marginMedium);margin-top:-.3125rem}.verify-certificate-container .select-file-button:hover{filter:brightness(.8)}.verify-certificate-container .select-file-button:active{filter:grayscale(1);transform:translateY(.0625rem)}.verify-certificate-container .select-file-button .spinner{display:inline-block;width:.5rem;height:.5rem;border-radius:50%;background:transparent;border-top:.125rem solid white;border-right:.125rem solid white;border-bottom:.125rem solid transparent;border-left:.125rem solid transparent;animation:loading .5s infinite linear}.verify-certificate-container .select-file-label-container{gap:var(--marginMedium)}.verify-certificate-container .cert-error-text{height:.7rem}.verify-certificate-container .save-button{display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.875rem;background:var(--primary);padding:.4375rem;border-radius:var(--inputBorderRadius);color:var(--white);cursor:pointer;box-shadow:0 .1875rem .5625rem 0 var(--primaryColorOpaque)}::ng-deep .verify-certificate-container select:disabled,::ng-deep .verify-certificate-container input:disabled{opacity:.75!important;cursor:text;background-color:var(--stroke)!important}::ng-deep .verify-certificate-wrapper lib-form-header .form-header-container{max-width:50rem}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: FormHeaderComponent, selector: "lib-form-header", inputs: ["data", "badges", "title", "moreActions", "formView", "saveDisabled", "saveTooltip", "actionButtonText", "moreActionsText", "showHeaderToggle", "showHeaderButton", "multiActions"], outputs: ["formViewChange", "actionRequested", "multiActionRequested"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }, { kind: "component", type: LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }] }); }
|
|
24975
25519
|
}
|
|
24976
25520
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: VerifyCertificateComponent, decorators: [{
|
|
24977
25521
|
type: Component,
|
|
@@ -25628,7 +26172,7 @@ class ConfigTypeFormComponent extends ProjectableForm {
|
|
|
25628
26172
|
return '';
|
|
25629
26173
|
}
|
|
25630
26174
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ConfigTypeFormComponent, deps: [{ token: ConfigTypeFormService }, { token: SchemaService }, { token: GrowlerService }, { token: SHAREDZ_EXTENSION }, { token: SETTINGS_SERVICE }, { token: ZITI_DATA_SERVICE }, { token: i4.Router }, { token: i4.ActivatedRoute }, { token: i1$4.Location }, { token: ValidationService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
25631
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ConfigTypeFormComponent, selector: "lib-configuration", inputs: { formData: "formData", errors: "errors" }, outputs: { close: "close" }, viewQueries: [{ propertyName: "configEditor", first: true, predicate: ["configEditor"], descendants: true, read: ConfigEditorComponent }], usesInheritance: true, ngImport: i0, template: "<div class=\"config-type-form-container projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n tabindex=\"0\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"(formData.id ? 'Edit Config Type' : 'Create Config Type')\"\n [moreActions]=\"formData.moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n [saveDisabled]=\"saveDisabled\"\n [saveTooltip]=\"saveButtonTooltip\"\n ></lib-form-header>\n <div class=\"config-form-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" [hidden]=\"formView !== 'simple'\">\n <div class=\"form-group-column three-fifths\">\n <lib-form-field-container [title]=\"'Config Name'\" [label]=\"'Required'\">\n <input\n id=\"ConfigName\"\n type=\"text\"\n maxlength=\"500\"\n placeholder=\"Name this config\"\n [ngClass]=\"{error: errors['name']}\"\n [(ngModel)]=\"formData.name\"\n >\n </lib-form-field-container>\n <lib-form-field-container [title]=\"'Schema'\" [label]=\"'Required'\" class=\"schema-json-editor\">\n <lib-json-view [(data)]=\"formData.schema\" [jsonInvalid]=\"errors['schema']\"></lib-json-view>\n </lib-form-field-container>\n <lib-form-field-toggle [(toggleOn)]=\"showMore\" (toggleOnChange)=\"showMoreChanged($event)\" style=\"margin: 0px 10px\"></lib-form-field-toggle>\n <div [hidden]=\"!showMore\" class=\"form-group-column\">\n <lib-form-field-container\n [title]=\"'Custom Tags'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n *ngIf=\"!hideTags\"\n >\n <lib-custom-tags [(tags)]=\"formData.tags\"></lib-custom-tags>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column two-fifths\">\n <lib-form-field-container\n [title]=\"'API Calls'\"\n [label]=\"''\"\n [headerActions]=\"apiOptions\"\n (actionRequested)=\"apiActionRequested($event)\"\n >\n <div class=\"form-row\">\n <input class=\"form-field-input\" [value]=\"apiCallURL\" readonly/>\n <div class=\"url-copy icon-copy copy\" (click)=\"copyToClipboard(apiCallURL)\"></div>\n </div>\n <lib-json-view *ngIf=\"formData\" [(data)]=\"apiData\" [readOnly]=\"true\" [showCopy]=\"true\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>\n", styles: [".config-type-form-container{display:flex;flex-direction:column;height:100%;width:100%;align-items:center;gap:var(--gapXL)}.config-type-select.disabled{opacity:.7;pointer-events:none}.form-group-column.three-fifths{width:calc(60% - .9375rem);min-width:34.375rem;max-width:43.75rem}.form-group-column.two-fifths{max-width:43.75rem}::ng-deep #jsoneditor{max-height:32rem;overflow:hidden}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: FormHeaderComponent, selector: "lib-form-header", inputs: ["data", "badges", "title", "moreActions", "formView", "saveDisabled", "saveTooltip", "actionButtonText", "moreActionsText", "showHeaderToggle", "showHeaderButton"], outputs: ["formViewChange", "actionRequested"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }, { kind: "component", type: LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }, { kind: "component", type: FormFieldToggleComponent, selector: "lib-form-field-toggle", inputs: ["label", "orientation", "labelOn", "labelOff", "toggleOn"], outputs: ["toggleOnChange"] }, { kind: "component", type: JsonViewComponent, selector: "lib-json-view", inputs: ["data", "schema", "readOnly", "jsonInvalid", "showCopy", "showLineNumbers"], outputs: ["dataChange", "jsonChange", "jsonInvalidChange"] }, { kind: "component", type: CustomTagsComponent, selector: "lib-custom-tags", inputs: ["tags"], outputs: ["tagsChange"] }] }); }
|
|
26175
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: ConfigTypeFormComponent, selector: "lib-configuration", inputs: { formData: "formData", errors: "errors" }, outputs: { close: "close" }, viewQueries: [{ propertyName: "configEditor", first: true, predicate: ["configEditor"], descendants: true, read: ConfigEditorComponent }], usesInheritance: true, ngImport: i0, template: "<div class=\"config-type-form-container projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n tabindex=\"0\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"(formData.id ? 'Edit Config Type' : 'Create Config Type')\"\n [moreActions]=\"formData.moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n [saveDisabled]=\"saveDisabled\"\n [saveTooltip]=\"saveButtonTooltip\"\n ></lib-form-header>\n <div class=\"config-form-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" [hidden]=\"formView !== 'simple'\">\n <div class=\"form-group-column three-fifths\">\n <lib-form-field-container [title]=\"'Config Name'\" [label]=\"'Required'\">\n <input\n id=\"ConfigName\"\n type=\"text\"\n maxlength=\"500\"\n placeholder=\"Name this config\"\n [ngClass]=\"{error: errors['name']}\"\n [(ngModel)]=\"formData.name\"\n >\n </lib-form-field-container>\n <lib-form-field-container [title]=\"'Schema'\" [label]=\"'Required'\" class=\"schema-json-editor\">\n <lib-json-view [(data)]=\"formData.schema\" [jsonInvalid]=\"errors['schema']\"></lib-json-view>\n </lib-form-field-container>\n <lib-form-field-toggle [(toggleOn)]=\"showMore\" (toggleOnChange)=\"showMoreChanged($event)\" style=\"margin: 0px 10px\"></lib-form-field-toggle>\n <div [hidden]=\"!showMore\" class=\"form-group-column\">\n <lib-form-field-container\n [title]=\"'Custom Tags'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n *ngIf=\"!hideTags\"\n >\n <lib-custom-tags [(tags)]=\"formData.tags\"></lib-custom-tags>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column two-fifths\">\n <lib-form-field-container\n [title]=\"'API Calls'\"\n [label]=\"''\"\n [headerActions]=\"apiOptions\"\n (actionRequested)=\"apiActionRequested($event)\"\n >\n <div class=\"form-row\">\n <input class=\"form-field-input\" [value]=\"apiCallURL\" readonly/>\n <div class=\"url-copy icon-copy copy\" (click)=\"copyToClipboard(apiCallURL)\"></div>\n </div>\n <lib-json-view *ngIf=\"formData\" [(data)]=\"apiData\" [readOnly]=\"true\" [showCopy]=\"true\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>\n", styles: [".config-type-form-container{display:flex;flex-direction:column;height:100%;width:100%;align-items:center;gap:var(--gapXL)}.config-type-select.disabled{opacity:.7;pointer-events:none}.form-group-column.three-fifths{width:calc(60% - .9375rem);min-width:34.375rem;max-width:43.75rem}.form-group-column.two-fifths{max-width:43.75rem}::ng-deep #jsoneditor{max-height:32rem;overflow:hidden}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.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: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: FormHeaderComponent, selector: "lib-form-header", inputs: ["data", "badges", "title", "moreActions", "formView", "saveDisabled", "saveTooltip", "actionButtonText", "moreActionsText", "showHeaderToggle", "showHeaderButton", "multiActions"], outputs: ["formViewChange", "actionRequested", "multiActionRequested"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }, { kind: "component", type: LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }, { kind: "component", type: FormFieldToggleComponent, selector: "lib-form-field-toggle", inputs: ["label", "orientation", "labelOn", "labelOff", "toggleOn"], outputs: ["toggleOnChange"] }, { kind: "component", type: JsonViewComponent, selector: "lib-json-view", inputs: ["data", "schema", "readOnly", "jsonInvalid", "showCopy", "showLineNumbers"], outputs: ["dataChange", "jsonChange", "jsonInvalidChange"] }, { kind: "component", type: CustomTagsComponent, selector: "lib-custom-tags", inputs: ["tags"], outputs: ["tagsChange"] }] }); }
|
|
25632
26176
|
}
|
|
25633
26177
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: ConfigTypeFormComponent, decorators: [{
|
|
25634
26178
|
type: Component,
|
|
@@ -26419,7 +26963,7 @@ class PostureCheckFormComponent extends ProjectableForm {
|
|
|
26419
26963
|
macAddressesChange(event) {
|
|
26420
26964
|
}
|
|
26421
26965
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PostureCheckFormComponent, deps: [{ token: PostureCheckFormService }, { token: SchemaService }, { token: GrowlerService }, { token: SHAREDZ_EXTENSION }, { token: SETTINGS_SERVICE }, { token: ZITI_DATA_SERVICE }, { token: i4.Router }, { token: i4.ActivatedRoute }, { token: i1$4.Location }, { token: ValidationService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
26422
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: PostureCheckFormComponent, selector: "lib-posture-check", inputs: { formData: "formData", errors: "errors" }, outputs: { close: "close" }, usesInheritance: true, ngImport: i0, template: "<div class=\"posture-check-form-container projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n tabindex=\"0\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"(formData.id ? 'Edit Posture Check' : 'Create Posture Check')\"\n [moreActions]=\"formData.moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n ></lib-form-header>\n <div class=\"posture-checkform-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" [hidden]=\"formView !== 'simple'\">\n <div class=\"form-group-column three-fifths\">\n <lib-form-field-container [title]=\"'Name'\" [label]=\"'Required'\">\n <input\n id=\"PostureCheckName\"\n type=\"text\"\n maxlength=\"500\"\n placeholder=\"Name this posture check\"\n [ngClass]=\"{error: errors['name']}\"\n [(ngModel)]=\"formData.name\"\n >\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Select or create Posture Check attributes'\"\n [label]=\"'OPTIONAL'\"\n [contentStyle]=\"'z-index: 99999999'\"\n [helpText]=\"'Attributes are tags applied to an resource. Apply the same tag to other Posture Checks to form a group of Posture Checks.'\"\n >\n <lib-tag-selector\n [(selectedRoleAttributes)]=\"formData.roleAttributes\"\n [availableRoleAttributes]=\"pcRoleAttributes\"\n [placeholder]=\"'Add attributes to group Posture Checks'\"\n ></lib-tag-selector>\n </lib-form-field-container>\n <lib-form-field-container [title]=\"'Type'\" [label]=\"'Required'\" class=\"schema-json-editor\">\n <select\n *ngIf=\"postureCheckTypes.length > 0\"\n [(ngModel)]=\"formData.typeId\"\n (change)=\"pcTypeChanged($event)\"\n [disabled]=\"formData.id\"\n [matTooltip]=\"formData.id ? 'Type cannot be changed' : ''\"\n matTooltipPosition=\"below\"\n id=\"SelectedConfigType\"\n class=\"form-field-dropdown\"\n (keyup.enter)=\"preventEnterProp($event)\"\n >\n <option value=\"\">Select posture check type...</option>\n <option\n *ngFor=\"let type of postureCheckTypes\"\n [value]=\"type.id\"\n >\n {{ type.name }}\n </option>\n </select>\n </lib-form-field-container>\n <lib-form-field-container [title]=\"'MAC Addresses'\" [label]=\"'Required'\" *ngIf=\"formData.typeId === 'MAC'\">\n <p-chips (keyup)=\"macAddressesChange($event)\"\n [(ngModel)]=\"formData.macAddresses\"\n [allowDuplicate]=\"false\"\n placeholder=\"Enter mc addresses\"\n [addOnBlur]=\"true\"\n [ngClass]=\"{ error: errors['macAddresses'] }\"\n separator=\",\"\n (keyup.enter)=\"preventEnterProp($event)\"\n >\n </p-chips>\n </lib-form-field-container>\n <lib-form-field-container [title]=\"'Windows Domain Details'\" [label]=\"'Required'\" *ngIf=\"formData.typeId === 'DOMAIN'\">\n <p-chips (keyup)=\"macAddressesChange($event)\"\n [(ngModel)]=\"formData.domains\"\n [allowDuplicate]=\"false\"\n placeholder=\"Enter domains\"\n [addOnBlur]=\"true\"\n [ngClass]=\"{ error: errors['domains'] }\"\n separator=\",\"\n (keyup.enter)=\"preventEnterProp($event)\"\n >\n </p-chips>\n </lib-form-field-container>\n <lib-form-field-container [title]=\"'Process Details'\" [contentClass]=\"'form-field-input-group'\" *ngIf=\"formData.typeId === 'PROCESS'\">\n <div class=\"form-field-label-container process-os-details-header\">\n <div class=\"form-field-header\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Operating System</span>\n </div>\n <span class=\"form-field-label\" >Required</span>\n </div>\n <p-dropdown\n placeholder=\"Select configuration...\"\n optionLabel=\"name\"\n optionValue=\"type\"\n filterBy=\"name\"\n [options]=\"osTypes\"\n [filter]=\"false\"\n [showClear]=\"true\"\n [(ngModel)]=\"formData.process.osType\"\n (keyup.enter)=\"preventEnterProp($event)\"\n >\n <ng-template pTemplate=\"selectedItem\">\n <div class=\"os-type-dropdown-item\" *ngIf=\"formData.process.osType && formData.process.osType !== ''\">\n <div class=\"os-type-dropdown-icon\"\n [class]=\"'os-type-dropdown-icon-' + formData.process.osType\"\n ></div>\n <div>{{ formData.process.osType }}</div>\n </div>\n </ng-template>\n <ng-template let-os pTemplate=\"item\">\n <div class=\"os-type-dropdown-item\">\n <div class=\"os-type-dropdown-icon\"\n [class]=\"'os-type-dropdown-icon-' + os.type\"\n ></div>\n <div>{{ os.name }}</div>\n </div>\n </ng-template>\n </p-dropdown>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-header\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Hashes</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Valid sha256 hashes of a binary\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <span class=\"form-field-label\" >Required</span>\n </div>\n <p-chips [(ngModel)]=\"formData.process.hashes\"\n [allowDuplicate]=\"false\"\n placeholder=\"Enter hashes\"\n [addOnBlur]=\"true\"\n [ngClass]=\"{ error: errors['processHashes'] }\"\n separator=\",\"\n (keyup.enter)=\"preventEnterProp($event)\"\n >\n </p-chips>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-header\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Path</span>\n </div>\n <span class=\"form-field-label\" >Required</span>\n </div>\n <input class=\"form-field-input\" placeholder=\"/path/to/process\" [(ngModel)]=\"formData.process.path\" [ngClass]=\"{error: errors['processPath']}\"/>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-header\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Fingerprint</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Fingerprints are the sha1 fingerprints (thumbprints) of valid signing certificates\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <span class=\"form-field-label\" >Required</span>\n </div>\n <input class=\"form-field-input\" placeholder=\"Enter a fingerprint\" [(ngModel)]=\"formData.process.signerFingerprint\" [ngClass]=\"{error: errors['androidOSMin']}\"/>\n </div>\n </lib-form-field-container>\n <lib-form-field-container [title]=\"'Process Multi Details'\" *ngIf=\"formData.typeId === 'PROCESS_MULTI'\">\n <div class=\"form-field-label-container\">\n <div class=\"form-field-header\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Semantic</span>\n </div>\n <span class=\"form-field-label\" >Required</span>\n </div>\n <select\n [(ngModel)]=\"formData.semantic\"\n id=\"PolicySemantic\"\n class=\"form-field-dropdown\"\n >\n <option value=\"AllOf\">AllOf</option>\n <option value=\"AnyOf\">AnyOf</option>\n </select>\n </div>\n <div class=\"process-multi-item form-field-input-group\" *ngFor=\"let process of processMultiItems; index as i\">\n <div class=\"icon-clear\" *ngIf=\"processMultiItems.length > 1\" (click)=\"removeProcessItem(i)\"></div>\n <div class=\"form-field-label-container process-os-details-header\">\n <div class=\"form-field-header\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Operating System</span>\n </div>\n <span class=\"form-field-label\" >Required</span>\n </div>\n <p-dropdown\n placeholder=\"Select configuration...\"\n optionLabel=\"name\"\n optionValue=\"type\"\n filterBy=\"name\"\n [options]=\"osTypes\"\n [filter]=\"false\"\n [showClear]=\"true\"\n [(ngModel)]=\"process.osType\"\n (keyup.enter)=\"preventEnterProp($event)\"\n >\n <ng-template pTemplate=\"selectedItem\">\n <div class=\"os-type-dropdown-item\" *ngIf=\"process.osType && process.osType !== ''\">\n <div class=\"os-type-dropdown-icon\"\n [class]=\"'os-type-dropdown-icon-' + process.osType\"\n ></div>\n <div>{{ process.osType }}</div>\n </div>\n </ng-template>\n <ng-template let-os pTemplate=\"item\">\n <div class=\"os-type-dropdown-item\">\n <div class=\"os-type-dropdown-icon\"\n [class]=\"'os-type-dropdown-icon-' + os.type\"\n ></div>\n <div>{{ os.name }}</div>\n </div>\n </ng-template>\n </p-dropdown>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-header\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Hashes</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Valid sha256 hashes of a binary\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <span class=\"form-field-label\" >Required</span>\n </div>\n <p-chips [(ngModel)]=\"process.hashes\"\n [allowDuplicate]=\"false\"\n placeholder=\"Enter hashes\"\n [addOnBlur]=\"true\"\n [ngClass]=\"{ error: errors['processHashes'] }\"\n separator=\",\"\n (keyup.enter)=\"preventEnterProp($event)\"\n >\n </p-chips>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-header\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Path</span>\n </div>\n <span class=\"form-field-label\" >Required</span>\n </div>\n <input class=\"form-field-input\" placeholder=\"/path/to/process\" [(ngModel)]=\"process.path\" [ngClass]=\"{error: errors['processPath']}\"/>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-header\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Fingerprint</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Signer fingerprints are the sha1 fingerprints (thumbprints) of valid signing certificates\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <span class=\"form-field-label\" >Required</span>\n </div>\n <p-chips (keyup)=\"macAddressesChange($event)\"\n [(ngModel)]=\"process.signerFingerprints\"\n [allowDuplicate]=\"false\"\n placeholder=\"Enter signer fingerprints\"\n [addOnBlur]=\"true\"\n [ngClass]=\"{ error: errors['process[' + i +'].signerFingerprints'] }\"\n separator=\",\"\n (keyup.enter)=\"preventEnterProp($event)\"\n />\n </div>\n </div>\n <div class=\"buttons process-multi-buttons\">\n <button class=\"button\" (click)=\"addProcessItem()\">Add Another Process</button>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Multi Factor Details'\"\n [layout]=\"'column'\"\n *ngIf=\"formData.typeId === 'MFA'\"\n >\n <div class=\"form-field-row\">\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Timeout (seconds)</span>\n </div>\n <input class=\"form-field-input\" placeholder=\"# in seconds\" [(ngModel)]=\"formData.timeoutSeconds\" [ngClass]=\"{error: errors['timeoutSeconds']}\" type=\"number\"/>\n </div>\n <div class=\"config-item os-toggle-container\" (click)=\"toggleMFAPrompt('wake')\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Require On Wake</span>\n </div>\n <div class=\"config-container toggle-container os-toggle-container\">\n <div class=\"form-field-title-container\">\n <div class=\"config-container-label\">Require</div>\n </div>\n <div\n [ngClass]=\"{ on: formData.promptOnWake }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.promptOnWake\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.promptOnWake\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n <div class=\"config-item os-toggle-container\" (click)=\"toggleMFAPrompt('unlock')\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Require On Unlock</span>\n </div>\n <div class=\"config-container toggle-container os-toggle-container\">\n <div class=\"form-field-title-container\">\n <div class=\"config-container-label\">Require</div>\n </div>\n <div\n [ngClass]=\"{ on: formData.promptOnUnlock }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.promptOnUnlock\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.promptOnUnlock\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [showHeader]=\"false\"\n [layout]=\"'column'\"\n *ngIf=\"formData.typeId === 'OS'\"\n >\n <div class=\"form-field-row os-version-row\">\n <div class=\"config-item os-toggle-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Operating System</span>\n </div>\n <div class=\"config-container toggle-container os-toggle-container\"\n (click)=\"toggleOS('Android')\">\n <div class=\"form-field-title-container\">\n <div class=\"pc-os-button android-os-button\"></div>\n <div class=\"config-container-label\">Android</div>\n </div>\n <div\n [ngClass]=\"{ on: osCheckData.Android.enabled }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!osCheckData.Android.enabled\" class=\"on-label\">YES</span>\n <span [hidden]=\"osCheckData.Android.enabled\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Min Version</span>\n </div>\n <input class=\"form-field-input\" placeholder=\"#.#.#\" [matTooltip]=\"osCheckData.Android.isAdvanced ? 'Use JSON view to edit' : ''\" [(ngModel)]=\"osCheckData.Android.min\" [ngClass]=\"{error: errors['androidOSMin']}\" [disabled]=\"!osCheckData.Android.enabled || osCheckData.Android.isAdvanced\"/>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Max Version</span>\n </div>\n <input class=\"form-field-input\" placeholder=\"#.#.#\" [matTooltip]=\"osCheckData.Android.isAdvanced ? 'Use JSON view to edit' : ''\" [(ngModel)]=\"osCheckData.Android.max\" [ngClass]=\"{error: errors['androidOSMax']}\" [disabled]=\"!osCheckData.Android.enabled || osCheckData.Android.isAdvanced\"/>\n </div>\n </div>\n <div class=\"form-field-row os-version-row\">\n <div class=\"config-item os-toggle-container\"\n (click)=\"toggleOS('iOS')\">\n <div class=\"config-container toggle-container os-toggle-container\">\n <div class=\"form-field-title-container\">\n <div class=\"pc-os-button ios-os-button\"></div>\n <div class=\"config-container-label\">iOS</div>\n </div>\n <div\n [ngClass]=\"{ on: osCheckData.iOS.enabled }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!osCheckData.iOS.enabled\" class=\"on-label\">YES</span>\n <span [hidden]=\"osCheckData.iOS.enabled\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n <div class=\"form-field-label-container\">\n <input class=\"form-field-input\" placeholder=\"#.#.#\" [matTooltip]=\"osCheckData.iOS.isAdvanced ? 'Use JSON view to edit' : ''\" [(ngModel)]=\"osCheckData.iOS.min\" [ngClass]=\"{error: errors['iOS']}\" [disabled]=\"!osCheckData.iOS.enabled || osCheckData.iOS.isAdvanced\"/>\n </div>\n <div class=\"form-field-label-container\">\n <input class=\"form-field-input\" placeholder=\"#.#.#\" [matTooltip]=\"osCheckData.iOS.isAdvanced ? 'Use JSON view to edit' : ''\" [(ngModel)]=\"osCheckData.iOS.max\" [ngClass]=\"{error: errors['iOS']}\" [disabled]=\"!osCheckData.iOS.enabled || osCheckData.iOS.isAdvanced\"/>\n </div>\n </div>\n <div class=\"form-field-row os-version-row\">\n <div class=\"config-item os-toggle-container\"\n (click)=\"toggleOS('Linux')\">\n <div class=\"config-container toggle-container os-toggle-container\">\n <div class=\"form-field-title-container\">\n <div class=\"pc-os-button linux-os-button\"></div>\n <div class=\"config-container-label\">Linux</div>\n </div>\n <div\n [ngClass]=\"{ on: osCheckData.Linux.enabled }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!osCheckData.Linux.enabled\" class=\"on-label\">YES</span>\n <span [hidden]=\"osCheckData.Linux.enabled\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n <div class=\"form-field-label-container\">\n <input class=\"form-field-input\" placeholder=\"#.#.#\" [matTooltip]=\"osCheckData.Linux.isAdvanced ? 'Use JSON view to edit' : ''\" [(ngModel)]=\"osCheckData.Linux.min\" [ngClass]=\"{error: errors['linuxOS']}\" [disabled]=\"!osCheckData.Linux.enabled || osCheckData.Linux.isAdvanced\"/>\n </div>\n <div class=\"form-field-label-container\">\n <input class=\"form-field-input\" placeholder=\"#.#.#\" [matTooltip]=\"osCheckData.Linux.isAdvanced ? 'Use JSON view to edit' : ''\" [(ngModel)]=\"osCheckData.Linux.max\" [ngClass]=\"{error: errors['linuxOS']}\" [disabled]=\"!osCheckData.Linux.enabled || osCheckData.Linux.isAdvanced\"/>\n </div>\n </div>\n <div class=\"form-field-row os-version-row\">\n <div class=\"config-item os-toggle-container\">\n <div class=\"config-container toggle-container os-toggle-container\"\n (click)=\"toggleOS('macOS')\">\n <div class=\"form-field-title-container\">\n <div class=\"pc-os-button mac-os-button\"></div>\n <div class=\"config-container-label\">macOS</div>\n </div>\n <div\n [ngClass]=\"{ on: osCheckData.macOS.enabled }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!osCheckData.macOS.enabled\" class=\"on-label\">YES</span>\n <span [hidden]=\"osCheckData.macOS.enabled\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n <div class=\"form-field-label-container\">\n <input class=\"form-field-input\" placeholder=\"#.#.#\" [matTooltip]=\"osCheckData.macOS.isAdvanced ? 'Use JSON view to edit' : ''\" [(ngModel)]=\"osCheckData.macOS.min\" [ngClass]=\"{error: errors['macOS']}\" [disabled]=\"!osCheckData.macOS.enabled || osCheckData.macOS.isAdvanced\"/>\n </div>\n <div class=\"form-field-label-container\">\n <input class=\"form-field-input\" placeholder=\"#.#.#\" [matTooltip]=\"osCheckData.macOS.isAdvanced ? 'Use JSON view to edit' : ''\" [(ngModel)]=\"osCheckData.macOS.max\" [ngClass]=\"{error: errors['macOS']}\" [disabled]=\"!osCheckData.macOS.enabled || osCheckData.macOS.isAdvanced\"/>\n </div>\n </div>\n <div class=\"form-field-row os-version-row\">\n <div class=\"config-item os-toggle-container\"\n (click)=\"toggleOS('Windows')\">\n <div class=\"config-container toggle-container os-toggle-container\">\n <div class=\"form-field-title-container\">\n <div class=\"pc-os-button windows-os-button\"></div>\n <div class=\"config-container-label\">Windows</div>\n </div>\n <div\n [ngClass]=\"{ on: osCheckData.Windows.enabled }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!osCheckData.Windows.enabled\" class=\"on-label\">YES</span>\n <span [hidden]=\"osCheckData.Windows.enabled\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n <div class=\"form-field-label-container\">\n <input class=\"form-field-input\" placeholder=\"#.#.#\" [matTooltip]=\"osCheckData.Windows.isAdvanced ? 'Use JSON view to edit' : ''\" [(ngModel)]=\"osCheckData.Windows.min\" [ngClass]=\"{error: errors['windowsOS']}\" [disabled]=\"!osCheckData.Windows.enabled || osCheckData.Windows.isAdvanced\"/>\n </div>\n <div class=\"form-field-label-container\">\n <input class=\"form-field-input\" placeholder=\"#.#.#\" [matTooltip]=\"osCheckData.Windows.isAdvanced ? 'Use JSON view to edit' : ''\" [(ngModel)]=\"osCheckData.Windows.max\" [ngClass]=\"{error: errors['windowsOS']}\" [disabled]=\"!osCheckData.Windows.enabled || osCheckData.Windows.isAdvanced\"/>\n </div>\n </div>\n <div class=\"form-field-row os-version-row\">\n <div class=\"config-item os-toggle-container\"\n (click)=\"toggleOS('WindowsServer')\">\n <div class=\"config-container toggle-container os-toggle-container\">\n <div class=\"form-field-title-container\">\n <div class=\"pc-os-button windows-server-os-button\"></div>\n <div class=\"config-container-label\">Windows Server</div>\n </div>\n <div\n [ngClass]=\"{ on: osCheckData.WindowsServer.enabled }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!osCheckData.WindowsServer.enabled\" class=\"on-label\">YES</span>\n <span [hidden]=\"osCheckData.WindowsServer.enabled\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n <div class=\"form-field-label-container\">\n <input class=\"form-field-input\" placeholder=\"#.#.#\" [matTooltip]=\"osCheckData.WindowsServer.isAdvanced ? 'Use JSON view to edit' : ''\" [(ngModel)]=\"osCheckData.WindowsServer.min\" [ngClass]=\"{error: errors['windowsServerOS']}\" [disabled]=\"!osCheckData.WindowsServer.enabled || osCheckData.WindowsServer.isAdvanced\"/>\n </div>\n <div class=\"form-field-label-container\">\n <input class=\"form-field-input\" placeholder=\"#.#.#\" [matTooltip]=\"osCheckData.WindowsServer.isAdvanced ? 'Use JSON view to edit' : ''\" [(ngModel)]=\"osCheckData.WindowsServer.max\" [ngClass]=\"{error: errors['windowsServerOS']}\" [disabled]=\"!osCheckData.WindowsServer.enabled || osCheckData.WindowsServer.isAdvanced\"/>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-toggle [(toggleOn)]=\"showMore\" (toggleOnChange)=\"showMoreChanged($event)\" style=\"margin: 0px 10px\"></lib-form-field-toggle>\n <div [hidden]=\"!showMore\" class=\"form-group-column\">\n <lib-form-field-container\n [title]=\"'Custom Tags'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n *ngIf=\"!hideTags\"\n >\n <lib-custom-tags [(tags)]=\"formData.tags\"></lib-custom-tags>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column two-fifths\">\n <lib-form-field-container\n [title]=\"'API Calls'\"\n [label]=\"''\"\n [headerActions]=\"apiOptions\"\n (actionRequested)=\"apiActionRequested($event)\"\n >\n <div class=\"form-row\">\n <input class=\"form-field-input\" [value]=\"apiCallURL\" readonly/>\n <div class=\"url-copy icon-copy copy\" (click)=\"copyToClipboard(apiCallURL)\"></div>\n </div>\n <lib-json-view *ngIf=\"formData\" [(data)]=\"apiData\" [readOnly]=\"true\" [showCopy]=\"true\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>\n", styles: [".posture-check-form-container{display:flex;flex-direction:column;height:100%;width:100%;align-items:center;gap:var(--gapXL)}.config-type-select.disabled{opacity:.7;pointer-events:none}.form-group-column.three-fifths{width:calc(60% - .9375rem);min-width:34.375rem;max-width:43.75rem}.form-group-column.two-fifths{max-width:43.75rem}::ng-deep #jsoneditor{max-height:32rem;overflow:hidden}.os-toggle-container{gap:var(--gapSmall)}.os-toggle-container .config-container-label{text-transform:unset}.os-toggle-container{height:var(--defaultInputHeight);cursor:pointer}.os-toggle-container:hover .pc-os-button{transform:scale(1.05)}.os-version-row input:disabled{color:transparent!important}.os-version-row input:disabled::placeholder{color:transparent!important}.process-os-details-header{margin-top:var(--marginSmall)}input:disabled,select:disabled,textarea:disabled{opacity:.3!important;cursor:not-allowed}.process-multi-buttons{display:flex;flex-direction:row;justify-content:flex-end;margin:0}.process-multi-buttons button{background-color:var(--primaryColor);box-shadow:none;font-size:.75rem}.process-multi-buttons button:hover{filter:brightness(.8)}.process-multi-buttons button:active{transform:translateY(.0625rem)}.process-multi-item{display:flex;flex-direction:column;position:relative;gap:var(--gapMedium);border-width:.125rem;border-color:var(--menu);border-style:solid;padding:var(--paddingMedium);border-radius:var(--inputBorderRadius)}.process-multi-item .icon-clear{position:absolute;top:0;right:0;color:var(--red);margin-top:-.5rem;margin-right:-.5rem;background:var(--background);font-size:1.5rem;border-radius:2rem;cursor:pointer}.process-multi-item .icon-clear:hover{filter:brightness(.8)}.process-multi-item .icon-clear:active{transform:translateY(.0625rem)}.os-type-dropdown-item{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:var(--gapMedium)}.os-type-dropdown-item div{font-size:.875rem!important;font-family:Open Sans,Arial,sans-serif;color:var(--tableText)}.os-type-dropdown-item .os-type-dropdown-icon{background-size:1.75rem;height:1.75rem;width:1.75rem;display:inline-block;background-position-x:center;background-position-y:center}.os-type-dropdown-item .os-type-dropdown-icon.os-type-dropdown-icon-Android{background-image:url(/assets/images/android-os.png)}.os-type-dropdown-item .os-type-dropdown-icon.os-type-dropdown-icon-iOS{background-image:url(/assets/images/ios-os.png)}.os-type-dropdown-item .os-type-dropdown-icon.os-type-dropdown-icon-Linux{background-image:url(/assets/images/linux-os.png)}.os-type-dropdown-item .os-type-dropdown-icon.os-type-dropdown-icon-macOS{background-image:url(/assets/images/mac-os.png)}.os-type-dropdown-item .os-type-dropdown-icon.os-type-dropdown-icon-Windows{background-image:url(/assets/images/windows-os.png)}.os-type-dropdown-item .os-type-dropdown-icon.os-type-dropdown-icon-WindowsServer{background-image:url(/assets/images/windows-server-os.png)}.pc-os-button{background-size:2rem;height:2rem;width:2rem;display:inline-block;background-position-x:center;background-position-y:center;margin-right:.5rem}.pc-os-button.android-os-button{background-image:url(/assets/images/android-os.png)}.pc-os-button.ios-os-button{background-image:url(/assets/images/ios-os.png)}.pc-os-button.linux-os-button{background-image:url(/assets/images/linux-os.png)}.pc-os-button.mac-os-button{background-image:url(/assets/images/mac-os.png)}.pc-os-button.windows-os-button{background-image:url(/assets/images/windows-os.png)}.pc-os-button.windows-server-os-button{background-color:var(--offWhite_ALWAYS);border-radius:2rem;width:2rem;height:2rem;min-width:2rem;background-size:1.625rem;background-image:url(/assets/images/windows-server-os.png)}::ng-deep .posture-check-form-container .p-dropdown-panel .p-dropdown-items .p-dropdown-item{font-size:.875rem!important;font-family:Open Sans,Arial,sans-serif;color:var(--tableText);padding:.25rem var(--paddingMedium)}::ng-deep .posture-check-form-container p-dropdown .p-dropdown.p-component .p-inputtext.p-dropdown-label{padding:0 var(--paddingMedium)}::ng-deep p-chips input[type=text]{width:100%}::ng-deep p-chips ul{padding:0}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.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: i5.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i5.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3$1.Chips, selector: "p-chips", inputs: ["style", "styleClass", "disabled", "field", "placeholder", "max", "ariaLabel", "ariaLabelledBy", "tabindex", "inputId", "allowDuplicate", "inputStyle", "inputStyleClass", "addOnTab", "addOnBlur", "separator", "showClear"], outputs: ["onAdd", "onRemove", "onFocus", "onBlur", "onChipClick", "onClear"] }, { kind: "directive", type: i9.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: i4$2.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: FormHeaderComponent, selector: "lib-form-header", inputs: ["data", "badges", "title", "moreActions", "formView", "saveDisabled", "saveTooltip", "actionButtonText", "moreActionsText", "showHeaderToggle", "showHeaderButton"], outputs: ["formViewChange", "actionRequested"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }, { kind: "component", type: LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }, { kind: "component", type: FormFieldToggleComponent, selector: "lib-form-field-toggle", inputs: ["label", "orientation", "labelOn", "labelOff", "toggleOn"], outputs: ["toggleOnChange"] }, { kind: "component", type: JsonViewComponent, selector: "lib-json-view", inputs: ["data", "schema", "readOnly", "jsonInvalid", "showCopy", "showLineNumbers"], outputs: ["dataChange", "jsonChange", "jsonInvalidChange"] }, { kind: "component", type: TagSelectorComponent, selector: "lib-tag-selector", inputs: ["placeholder", "disableField", "disableCreate", "hideOption", "isLoading", "errorMessage", "focusOnInit", "selectedRoleAttributes", "selectedNamedAttributes", "hasError", "availableRoleAttributes", "availableNamedAttributes"], outputs: ["addRoleAttribute", "addNamedAttribute", "roleAttributeRemoved", "namedAttributeRemoved", "selectedRoleAttributesChange", "selectedNamedAttributesChange", "filterChange"] }, { kind: "component", type: CustomTagsComponent, selector: "lib-custom-tags", inputs: ["tags"], outputs: ["tagsChange"] }] }); }
|
|
26966
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: PostureCheckFormComponent, selector: "lib-posture-check", inputs: { formData: "formData", errors: "errors" }, outputs: { close: "close" }, usesInheritance: true, ngImport: i0, template: "<div class=\"posture-check-form-container projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n tabindex=\"0\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"(formData.id ? 'Edit Posture Check' : 'Create Posture Check')\"\n [moreActions]=\"formData.moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n ></lib-form-header>\n <div class=\"posture-checkform-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" [hidden]=\"formView !== 'simple'\">\n <div class=\"form-group-column three-fifths\">\n <lib-form-field-container [title]=\"'Name'\" [label]=\"'Required'\">\n <input\n id=\"PostureCheckName\"\n type=\"text\"\n maxlength=\"500\"\n placeholder=\"Name this posture check\"\n [ngClass]=\"{error: errors['name']}\"\n [(ngModel)]=\"formData.name\"\n >\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Select or create Posture Check attributes'\"\n [label]=\"'OPTIONAL'\"\n [contentStyle]=\"'z-index: 99999999'\"\n [helpText]=\"'Attributes are tags applied to an resource. Apply the same tag to other Posture Checks to form a group of Posture Checks.'\"\n >\n <lib-tag-selector\n [(selectedRoleAttributes)]=\"formData.roleAttributes\"\n [availableRoleAttributes]=\"pcRoleAttributes\"\n [placeholder]=\"'Add attributes to group Posture Checks'\"\n ></lib-tag-selector>\n </lib-form-field-container>\n <lib-form-field-container [title]=\"'Type'\" [label]=\"'Required'\" class=\"schema-json-editor\">\n <select\n *ngIf=\"postureCheckTypes.length > 0\"\n [(ngModel)]=\"formData.typeId\"\n (change)=\"pcTypeChanged($event)\"\n [disabled]=\"formData.id\"\n [matTooltip]=\"formData.id ? 'Type cannot be changed' : ''\"\n matTooltipPosition=\"below\"\n id=\"SelectedConfigType\"\n class=\"form-field-dropdown\"\n (keyup.enter)=\"preventEnterProp($event)\"\n >\n <option value=\"\">Select posture check type...</option>\n <option\n *ngFor=\"let type of postureCheckTypes\"\n [value]=\"type.id\"\n >\n {{ type.name }}\n </option>\n </select>\n </lib-form-field-container>\n <lib-form-field-container [title]=\"'MAC Addresses'\" [label]=\"'Required'\" *ngIf=\"formData.typeId === 'MAC'\">\n <p-chips (keyup)=\"macAddressesChange($event)\"\n [(ngModel)]=\"formData.macAddresses\"\n [allowDuplicate]=\"false\"\n placeholder=\"Enter mc addresses\"\n [addOnBlur]=\"true\"\n [ngClass]=\"{ error: errors['macAddresses'] }\"\n separator=\",\"\n (keyup.enter)=\"preventEnterProp($event)\"\n >\n </p-chips>\n </lib-form-field-container>\n <lib-form-field-container [title]=\"'Windows Domain Details'\" [label]=\"'Required'\" *ngIf=\"formData.typeId === 'DOMAIN'\">\n <p-chips (keyup)=\"macAddressesChange($event)\"\n [(ngModel)]=\"formData.domains\"\n [allowDuplicate]=\"false\"\n placeholder=\"Enter domains\"\n [addOnBlur]=\"true\"\n [ngClass]=\"{ error: errors['domains'] }\"\n separator=\",\"\n (keyup.enter)=\"preventEnterProp($event)\"\n >\n </p-chips>\n </lib-form-field-container>\n <lib-form-field-container [title]=\"'Process Details'\" [contentClass]=\"'form-field-input-group'\" *ngIf=\"formData.typeId === 'PROCESS'\">\n <div class=\"form-field-label-container process-os-details-header\">\n <div class=\"form-field-header\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Operating System</span>\n </div>\n <span class=\"form-field-label\" >Required</span>\n </div>\n <p-dropdown\n placeholder=\"Select configuration...\"\n optionLabel=\"name\"\n optionValue=\"type\"\n filterBy=\"name\"\n [options]=\"osTypes\"\n [filter]=\"false\"\n [showClear]=\"true\"\n [(ngModel)]=\"formData.process.osType\"\n (keyup.enter)=\"preventEnterProp($event)\"\n >\n <ng-template pTemplate=\"selectedItem\">\n <div class=\"os-type-dropdown-item\" *ngIf=\"formData.process.osType && formData.process.osType !== ''\">\n <div class=\"os-type-dropdown-icon\"\n [class]=\"'os-type-dropdown-icon-' + formData.process.osType\"\n ></div>\n <div>{{ formData.process.osType }}</div>\n </div>\n </ng-template>\n <ng-template let-os pTemplate=\"item\">\n <div class=\"os-type-dropdown-item\">\n <div class=\"os-type-dropdown-icon\"\n [class]=\"'os-type-dropdown-icon-' + os.type\"\n ></div>\n <div>{{ os.name }}</div>\n </div>\n </ng-template>\n </p-dropdown>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-header\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Hashes</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Valid sha256 hashes of a binary\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <span class=\"form-field-label\" >Required</span>\n </div>\n <p-chips [(ngModel)]=\"formData.process.hashes\"\n [allowDuplicate]=\"false\"\n placeholder=\"Enter hashes\"\n [addOnBlur]=\"true\"\n [ngClass]=\"{ error: errors['processHashes'] }\"\n separator=\",\"\n (keyup.enter)=\"preventEnterProp($event)\"\n >\n </p-chips>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-header\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Path</span>\n </div>\n <span class=\"form-field-label\" >Required</span>\n </div>\n <input class=\"form-field-input\" placeholder=\"/path/to/process\" [(ngModel)]=\"formData.process.path\" [ngClass]=\"{error: errors['processPath']}\"/>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-header\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Fingerprint</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Fingerprints are the sha1 fingerprints (thumbprints) of valid signing certificates\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <span class=\"form-field-label\" >Required</span>\n </div>\n <input class=\"form-field-input\" placeholder=\"Enter a fingerprint\" [(ngModel)]=\"formData.process.signerFingerprint\" [ngClass]=\"{error: errors['androidOSMin']}\"/>\n </div>\n </lib-form-field-container>\n <lib-form-field-container [title]=\"'Process Multi Details'\" *ngIf=\"formData.typeId === 'PROCESS_MULTI'\">\n <div class=\"form-field-label-container\">\n <div class=\"form-field-header\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Semantic</span>\n </div>\n <span class=\"form-field-label\" >Required</span>\n </div>\n <select\n [(ngModel)]=\"formData.semantic\"\n id=\"PolicySemantic\"\n class=\"form-field-dropdown\"\n >\n <option value=\"AllOf\">AllOf</option>\n <option value=\"AnyOf\">AnyOf</option>\n </select>\n </div>\n <div class=\"process-multi-item form-field-input-group\" *ngFor=\"let process of processMultiItems; index as i\">\n <div class=\"icon-clear\" *ngIf=\"processMultiItems.length > 1\" (click)=\"removeProcessItem(i)\"></div>\n <div class=\"form-field-label-container process-os-details-header\">\n <div class=\"form-field-header\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Operating System</span>\n </div>\n <span class=\"form-field-label\" >Required</span>\n </div>\n <p-dropdown\n placeholder=\"Select configuration...\"\n optionLabel=\"name\"\n optionValue=\"type\"\n filterBy=\"name\"\n [options]=\"osTypes\"\n [filter]=\"false\"\n [showClear]=\"true\"\n [(ngModel)]=\"process.osType\"\n (keyup.enter)=\"preventEnterProp($event)\"\n >\n <ng-template pTemplate=\"selectedItem\">\n <div class=\"os-type-dropdown-item\" *ngIf=\"process.osType && process.osType !== ''\">\n <div class=\"os-type-dropdown-icon\"\n [class]=\"'os-type-dropdown-icon-' + process.osType\"\n ></div>\n <div>{{ process.osType }}</div>\n </div>\n </ng-template>\n <ng-template let-os pTemplate=\"item\">\n <div class=\"os-type-dropdown-item\">\n <div class=\"os-type-dropdown-icon\"\n [class]=\"'os-type-dropdown-icon-' + os.type\"\n ></div>\n <div>{{ os.name }}</div>\n </div>\n </ng-template>\n </p-dropdown>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-header\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Hashes</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Valid sha256 hashes of a binary\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <span class=\"form-field-label\" >Required</span>\n </div>\n <p-chips [(ngModel)]=\"process.hashes\"\n [allowDuplicate]=\"false\"\n placeholder=\"Enter hashes\"\n [addOnBlur]=\"true\"\n [ngClass]=\"{ error: errors['processHashes'] }\"\n separator=\",\"\n (keyup.enter)=\"preventEnterProp($event)\"\n >\n </p-chips>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-header\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Path</span>\n </div>\n <span class=\"form-field-label\" >Required</span>\n </div>\n <input class=\"form-field-input\" placeholder=\"/path/to/process\" [(ngModel)]=\"process.path\" [ngClass]=\"{error: errors['processPath']}\"/>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-header\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Fingerprint</span>\n <div\n class=\"form-field-info infoicon\"\n matTooltip=\"Signer fingerprints are the sha1 fingerprints (thumbprints) of valid signing certificates\"\n matTooltipPosition=\"below\"\n ></div>\n </div>\n <span class=\"form-field-label\" >Required</span>\n </div>\n <p-chips (keyup)=\"macAddressesChange($event)\"\n [(ngModel)]=\"process.signerFingerprints\"\n [allowDuplicate]=\"false\"\n placeholder=\"Enter signer fingerprints\"\n [addOnBlur]=\"true\"\n [ngClass]=\"{ error: errors['process[' + i +'].signerFingerprints'] }\"\n separator=\",\"\n (keyup.enter)=\"preventEnterProp($event)\"\n />\n </div>\n </div>\n <div class=\"buttons process-multi-buttons\">\n <button class=\"button\" (click)=\"addProcessItem()\">Add Another Process</button>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [title]=\"'Multi Factor Details'\"\n [layout]=\"'column'\"\n *ngIf=\"formData.typeId === 'MFA'\"\n >\n <div class=\"form-field-row\">\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Timeout (seconds)</span>\n </div>\n <input class=\"form-field-input\" placeholder=\"# in seconds\" [(ngModel)]=\"formData.timeoutSeconds\" [ngClass]=\"{error: errors['timeoutSeconds']}\" type=\"number\"/>\n </div>\n <div class=\"config-item os-toggle-container\" (click)=\"toggleMFAPrompt('wake')\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Require On Wake</span>\n </div>\n <div class=\"config-container toggle-container os-toggle-container\">\n <div class=\"form-field-title-container\">\n <div class=\"config-container-label\">Require</div>\n </div>\n <div\n [ngClass]=\"{ on: formData.promptOnWake }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.promptOnWake\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.promptOnWake\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n <div class=\"config-item os-toggle-container\" (click)=\"toggleMFAPrompt('unlock')\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Require On Unlock</span>\n </div>\n <div class=\"config-container toggle-container os-toggle-container\">\n <div class=\"form-field-title-container\">\n <div class=\"config-container-label\">Require</div>\n </div>\n <div\n [ngClass]=\"{ on: formData.promptOnUnlock }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!formData.promptOnUnlock\" class=\"on-label\">YES</span>\n <span [hidden]=\"formData.promptOnUnlock\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-container\n [showHeader]=\"false\"\n [layout]=\"'column'\"\n *ngIf=\"formData.typeId === 'OS'\"\n >\n <div class=\"form-field-row os-version-row\">\n <div class=\"config-item os-toggle-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Operating System</span>\n </div>\n <div class=\"config-container toggle-container os-toggle-container\"\n (click)=\"toggleOS('Android')\">\n <div class=\"form-field-title-container\">\n <div class=\"pc-os-button android-os-button\"></div>\n <div class=\"config-container-label\">Android</div>\n </div>\n <div\n [ngClass]=\"{ on: osCheckData.Android.enabled }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!osCheckData.Android.enabled\" class=\"on-label\">YES</span>\n <span [hidden]=\"osCheckData.Android.enabled\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Min Version</span>\n </div>\n <input class=\"form-field-input\" placeholder=\"#.#.#\" [matTooltip]=\"osCheckData.Android.isAdvanced ? 'Use JSON view to edit' : ''\" [(ngModel)]=\"osCheckData.Android.min\" [ngClass]=\"{error: errors['androidOSMin']}\" [disabled]=\"!osCheckData.Android.enabled || osCheckData.Android.isAdvanced\"/>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Max Version</span>\n </div>\n <input class=\"form-field-input\" placeholder=\"#.#.#\" [matTooltip]=\"osCheckData.Android.isAdvanced ? 'Use JSON view to edit' : ''\" [(ngModel)]=\"osCheckData.Android.max\" [ngClass]=\"{error: errors['androidOSMax']}\" [disabled]=\"!osCheckData.Android.enabled || osCheckData.Android.isAdvanced\"/>\n </div>\n </div>\n <div class=\"form-field-row os-version-row\">\n <div class=\"config-item os-toggle-container\"\n (click)=\"toggleOS('iOS')\">\n <div class=\"config-container toggle-container os-toggle-container\">\n <div class=\"form-field-title-container\">\n <div class=\"pc-os-button ios-os-button\"></div>\n <div class=\"config-container-label\">iOS</div>\n </div>\n <div\n [ngClass]=\"{ on: osCheckData.iOS.enabled }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!osCheckData.iOS.enabled\" class=\"on-label\">YES</span>\n <span [hidden]=\"osCheckData.iOS.enabled\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n <div class=\"form-field-label-container\">\n <input class=\"form-field-input\" placeholder=\"#.#.#\" [matTooltip]=\"osCheckData.iOS.isAdvanced ? 'Use JSON view to edit' : ''\" [(ngModel)]=\"osCheckData.iOS.min\" [ngClass]=\"{error: errors['iOS']}\" [disabled]=\"!osCheckData.iOS.enabled || osCheckData.iOS.isAdvanced\"/>\n </div>\n <div class=\"form-field-label-container\">\n <input class=\"form-field-input\" placeholder=\"#.#.#\" [matTooltip]=\"osCheckData.iOS.isAdvanced ? 'Use JSON view to edit' : ''\" [(ngModel)]=\"osCheckData.iOS.max\" [ngClass]=\"{error: errors['iOS']}\" [disabled]=\"!osCheckData.iOS.enabled || osCheckData.iOS.isAdvanced\"/>\n </div>\n </div>\n <div class=\"form-field-row os-version-row\">\n <div class=\"config-item os-toggle-container\"\n (click)=\"toggleOS('Linux')\">\n <div class=\"config-container toggle-container os-toggle-container\">\n <div class=\"form-field-title-container\">\n <div class=\"pc-os-button linux-os-button\"></div>\n <div class=\"config-container-label\">Linux</div>\n </div>\n <div\n [ngClass]=\"{ on: osCheckData.Linux.enabled }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!osCheckData.Linux.enabled\" class=\"on-label\">YES</span>\n <span [hidden]=\"osCheckData.Linux.enabled\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n <div class=\"form-field-label-container\">\n <input class=\"form-field-input\" placeholder=\"#.#.#\" [matTooltip]=\"osCheckData.Linux.isAdvanced ? 'Use JSON view to edit' : ''\" [(ngModel)]=\"osCheckData.Linux.min\" [ngClass]=\"{error: errors['linuxOS']}\" [disabled]=\"!osCheckData.Linux.enabled || osCheckData.Linux.isAdvanced\"/>\n </div>\n <div class=\"form-field-label-container\">\n <input class=\"form-field-input\" placeholder=\"#.#.#\" [matTooltip]=\"osCheckData.Linux.isAdvanced ? 'Use JSON view to edit' : ''\" [(ngModel)]=\"osCheckData.Linux.max\" [ngClass]=\"{error: errors['linuxOS']}\" [disabled]=\"!osCheckData.Linux.enabled || osCheckData.Linux.isAdvanced\"/>\n </div>\n </div>\n <div class=\"form-field-row os-version-row\">\n <div class=\"config-item os-toggle-container\">\n <div class=\"config-container toggle-container os-toggle-container\"\n (click)=\"toggleOS('macOS')\">\n <div class=\"form-field-title-container\">\n <div class=\"pc-os-button mac-os-button\"></div>\n <div class=\"config-container-label\">macOS</div>\n </div>\n <div\n [ngClass]=\"{ on: osCheckData.macOS.enabled }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!osCheckData.macOS.enabled\" class=\"on-label\">YES</span>\n <span [hidden]=\"osCheckData.macOS.enabled\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n <div class=\"form-field-label-container\">\n <input class=\"form-field-input\" placeholder=\"#.#.#\" [matTooltip]=\"osCheckData.macOS.isAdvanced ? 'Use JSON view to edit' : ''\" [(ngModel)]=\"osCheckData.macOS.min\" [ngClass]=\"{error: errors['macOS']}\" [disabled]=\"!osCheckData.macOS.enabled || osCheckData.macOS.isAdvanced\"/>\n </div>\n <div class=\"form-field-label-container\">\n <input class=\"form-field-input\" placeholder=\"#.#.#\" [matTooltip]=\"osCheckData.macOS.isAdvanced ? 'Use JSON view to edit' : ''\" [(ngModel)]=\"osCheckData.macOS.max\" [ngClass]=\"{error: errors['macOS']}\" [disabled]=\"!osCheckData.macOS.enabled || osCheckData.macOS.isAdvanced\"/>\n </div>\n </div>\n <div class=\"form-field-row os-version-row\">\n <div class=\"config-item os-toggle-container\"\n (click)=\"toggleOS('Windows')\">\n <div class=\"config-container toggle-container os-toggle-container\">\n <div class=\"form-field-title-container\">\n <div class=\"pc-os-button windows-os-button\"></div>\n <div class=\"config-container-label\">Windows</div>\n </div>\n <div\n [ngClass]=\"{ on: osCheckData.Windows.enabled }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!osCheckData.Windows.enabled\" class=\"on-label\">YES</span>\n <span [hidden]=\"osCheckData.Windows.enabled\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n <div class=\"form-field-label-container\">\n <input class=\"form-field-input\" placeholder=\"#.#.#\" [matTooltip]=\"osCheckData.Windows.isAdvanced ? 'Use JSON view to edit' : ''\" [(ngModel)]=\"osCheckData.Windows.min\" [ngClass]=\"{error: errors['windowsOS']}\" [disabled]=\"!osCheckData.Windows.enabled || osCheckData.Windows.isAdvanced\"/>\n </div>\n <div class=\"form-field-label-container\">\n <input class=\"form-field-input\" placeholder=\"#.#.#\" [matTooltip]=\"osCheckData.Windows.isAdvanced ? 'Use JSON view to edit' : ''\" [(ngModel)]=\"osCheckData.Windows.max\" [ngClass]=\"{error: errors['windowsOS']}\" [disabled]=\"!osCheckData.Windows.enabled || osCheckData.Windows.isAdvanced\"/>\n </div>\n </div>\n <div class=\"form-field-row os-version-row\">\n <div class=\"config-item os-toggle-container\"\n (click)=\"toggleOS('WindowsServer')\">\n <div class=\"config-container toggle-container os-toggle-container\">\n <div class=\"form-field-title-container\">\n <div class=\"pc-os-button windows-server-os-button\"></div>\n <div class=\"config-container-label\">Windows Server</div>\n </div>\n <div\n [ngClass]=\"{ on: osCheckData.WindowsServer.enabled }\"\n class=\"toggle\"\n >\n <span [hidden]=\"!osCheckData.WindowsServer.enabled\" class=\"on-label\">YES</span>\n <span [hidden]=\"osCheckData.WindowsServer.enabled\" class=\"off-label\">NO</span>\n <div class=\"switch\"></div>\n </div>\n </div>\n </div>\n <div class=\"form-field-label-container\">\n <input class=\"form-field-input\" placeholder=\"#.#.#\" [matTooltip]=\"osCheckData.WindowsServer.isAdvanced ? 'Use JSON view to edit' : ''\" [(ngModel)]=\"osCheckData.WindowsServer.min\" [ngClass]=\"{error: errors['windowsServerOS']}\" [disabled]=\"!osCheckData.WindowsServer.enabled || osCheckData.WindowsServer.isAdvanced\"/>\n </div>\n <div class=\"form-field-label-container\">\n <input class=\"form-field-input\" placeholder=\"#.#.#\" [matTooltip]=\"osCheckData.WindowsServer.isAdvanced ? 'Use JSON view to edit' : ''\" [(ngModel)]=\"osCheckData.WindowsServer.max\" [ngClass]=\"{error: errors['windowsServerOS']}\" [disabled]=\"!osCheckData.WindowsServer.enabled || osCheckData.WindowsServer.isAdvanced\"/>\n </div>\n </div>\n </lib-form-field-container>\n <lib-form-field-toggle [(toggleOn)]=\"showMore\" (toggleOnChange)=\"showMoreChanged($event)\" style=\"margin: 0px 10px\"></lib-form-field-toggle>\n <div [hidden]=\"!showMore\" class=\"form-group-column\">\n <lib-form-field-container\n [title]=\"'Custom Tags'\"\n [label]=\"'OPTIONAL'\"\n class=\"form-field-advanced\"\n *ngIf=\"!hideTags\"\n >\n <lib-custom-tags [(tags)]=\"formData.tags\"></lib-custom-tags>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column two-fifths\">\n <lib-form-field-container\n [title]=\"'API Calls'\"\n [label]=\"''\"\n [headerActions]=\"apiOptions\"\n (actionRequested)=\"apiActionRequested($event)\"\n >\n <div class=\"form-row\">\n <input class=\"form-field-input\" [value]=\"apiCallURL\" readonly/>\n <div class=\"url-copy icon-copy copy\" (click)=\"copyToClipboard(apiCallURL)\"></div>\n </div>\n <lib-json-view *ngIf=\"formData\" [(data)]=\"apiData\" [readOnly]=\"true\" [showCopy]=\"true\"></lib-json-view>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>\n", styles: [".posture-check-form-container{display:flex;flex-direction:column;height:100%;width:100%;align-items:center;gap:var(--gapXL)}.config-type-select.disabled{opacity:.7;pointer-events:none}.form-group-column.three-fifths{width:calc(60% - .9375rem);min-width:34.375rem;max-width:43.75rem}.form-group-column.two-fifths{max-width:43.75rem}::ng-deep #jsoneditor{max-height:32rem;overflow:hidden}.os-toggle-container{gap:var(--gapSmall)}.os-toggle-container .config-container-label{text-transform:unset}.os-toggle-container{height:var(--defaultInputHeight);cursor:pointer}.os-toggle-container:hover .pc-os-button{transform:scale(1.05)}.os-version-row input:disabled{color:transparent!important}.os-version-row input:disabled::placeholder{color:transparent!important}.process-os-details-header{margin-top:var(--marginSmall)}input:disabled,select:disabled,textarea:disabled{opacity:.3!important;cursor:not-allowed}.process-multi-buttons{display:flex;flex-direction:row;justify-content:flex-end;margin:0}.process-multi-buttons button{background-color:var(--primaryColor);box-shadow:none;font-size:.75rem}.process-multi-buttons button:hover{filter:brightness(.8)}.process-multi-buttons button:active{transform:translateY(.0625rem)}.process-multi-item{display:flex;flex-direction:column;position:relative;gap:var(--gapMedium);border-width:.125rem;border-color:var(--menu);border-style:solid;padding:var(--paddingMedium);border-radius:var(--inputBorderRadius)}.process-multi-item .icon-clear{position:absolute;top:0;right:0;color:var(--red);margin-top:-.5rem;margin-right:-.5rem;background:var(--background);font-size:1.5rem;border-radius:2rem;cursor:pointer}.process-multi-item .icon-clear:hover{filter:brightness(.8)}.process-multi-item .icon-clear:active{transform:translateY(.0625rem)}.os-type-dropdown-item{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:var(--gapMedium)}.os-type-dropdown-item div{font-size:.875rem!important;font-family:Open Sans,Arial,sans-serif;color:var(--tableText)}.os-type-dropdown-item .os-type-dropdown-icon{background-size:1.75rem;height:1.75rem;width:1.75rem;display:inline-block;background-position-x:center;background-position-y:center}.os-type-dropdown-item .os-type-dropdown-icon.os-type-dropdown-icon-Android{background-image:url(/assets/images/android-os.png)}.os-type-dropdown-item .os-type-dropdown-icon.os-type-dropdown-icon-iOS{background-image:url(/assets/images/ios-os.png)}.os-type-dropdown-item .os-type-dropdown-icon.os-type-dropdown-icon-Linux{background-image:url(/assets/images/linux-os.png)}.os-type-dropdown-item .os-type-dropdown-icon.os-type-dropdown-icon-macOS{background-image:url(/assets/images/mac-os.png)}.os-type-dropdown-item .os-type-dropdown-icon.os-type-dropdown-icon-Windows{background-image:url(/assets/images/windows-os.png)}.os-type-dropdown-item .os-type-dropdown-icon.os-type-dropdown-icon-WindowsServer{background-image:url(/assets/images/windows-server-os.png)}.pc-os-button{background-size:2rem;height:2rem;width:2rem;display:inline-block;background-position-x:center;background-position-y:center;margin-right:.5rem}.pc-os-button.android-os-button{background-image:url(/assets/images/android-os.png)}.pc-os-button.ios-os-button{background-image:url(/assets/images/ios-os.png)}.pc-os-button.linux-os-button{background-image:url(/assets/images/linux-os.png)}.pc-os-button.mac-os-button{background-image:url(/assets/images/mac-os.png)}.pc-os-button.windows-os-button{background-image:url(/assets/images/windows-os.png)}.pc-os-button.windows-server-os-button{background-color:var(--offWhite_ALWAYS);border-radius:2rem;width:2rem;height:2rem;min-width:2rem;background-size:1.625rem;background-image:url(/assets/images/windows-server-os.png)}::ng-deep .posture-check-form-container .p-dropdown-panel .p-dropdown-items .p-dropdown-item{font-size:.875rem!important;font-family:Open Sans,Arial,sans-serif;color:var(--tableText);padding:.25rem var(--paddingMedium)}::ng-deep .posture-check-form-container p-dropdown .p-dropdown.p-component .p-inputtext.p-dropdown-label{padding:0 var(--paddingMedium)}::ng-deep p-chips input[type=text]{width:100%}::ng-deep p-chips ul{padding:0}\n"], dependencies: [{ kind: "directive", type: i1$4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i5.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: i5.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i5.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3$1.Chips, selector: "p-chips", inputs: ["style", "styleClass", "disabled", "field", "placeholder", "max", "ariaLabel", "ariaLabelledBy", "tabindex", "inputId", "allowDuplicate", "inputStyle", "inputStyleClass", "addOnTab", "addOnBlur", "separator", "showClear"], outputs: ["onAdd", "onRemove", "onFocus", "onBlur", "onChipClick", "onClear"] }, { kind: "directive", type: i9.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: i4$2.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: FormHeaderComponent, selector: "lib-form-header", inputs: ["data", "badges", "title", "moreActions", "formView", "saveDisabled", "saveTooltip", "actionButtonText", "moreActionsText", "showHeaderToggle", "showHeaderButton", "multiActions"], outputs: ["formViewChange", "actionRequested", "multiActionRequested"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }, { kind: "component", type: LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }, { kind: "component", type: FormFieldToggleComponent, selector: "lib-form-field-toggle", inputs: ["label", "orientation", "labelOn", "labelOff", "toggleOn"], outputs: ["toggleOnChange"] }, { kind: "component", type: JsonViewComponent, selector: "lib-json-view", inputs: ["data", "schema", "readOnly", "jsonInvalid", "showCopy", "showLineNumbers"], outputs: ["dataChange", "jsonChange", "jsonInvalidChange"] }, { kind: "component", type: TagSelectorComponent, selector: "lib-tag-selector", inputs: ["placeholder", "disableField", "disableCreate", "hideOption", "isLoading", "errorMessage", "focusOnInit", "selectedRoleAttributes", "selectedNamedAttributes", "hasError", "availableRoleAttributes", "availableNamedAttributes"], outputs: ["addRoleAttribute", "addNamedAttribute", "roleAttributeRemoved", "namedAttributeRemoved", "selectedRoleAttributesChange", "selectedNamedAttributesChange", "filterChange"] }, { kind: "component", type: CustomTagsComponent, selector: "lib-custom-tags", inputs: ["tags"], outputs: ["tagsChange"] }] }); }
|
|
26423
26967
|
}
|
|
26424
26968
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: PostureCheckFormComponent, decorators: [{
|
|
26425
26969
|
type: Component,
|
|
@@ -27001,7 +27545,7 @@ class SessionFormComponent extends ProjectableForm {
|
|
|
27001
27545
|
provide: MatDialogRef,
|
|
27002
27546
|
useValue: {}
|
|
27003
27547
|
}
|
|
27004
|
-
], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"'Session Details'\"\n [moreActions]=\"moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n [showHeaderButton]=\"false\"\n ></lib-form-header>\n <div class=\"edge-router-form-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" *ngIf=\"formView === 'simple'\">\n <div class=\"form-group-column three-fifths\">\n <lib-form-field-container [showHeader]=\"false\">\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">ID</span>\n </div>\n <div class=\"config-container\">\n <span>{{formData.id}}</span>\n </div>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Service Name</span>\n </div>\n <a class=\"form-field-link\" [href]=\"'./services/' + formData.service.id\" (click)=\"serviceNameLinkClicked($event)\">\n <div class=\"config-container config-container-clickable\">\n <span>{{formData.service.name}}</span>\n </div>\n </a>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Identity Name</span>\n </div>\n <a class=\"form-field-link\" [href]=\"'./identities/' + associatedIdentity.id\" (click)=\"identityNameLinkClicked($event)\">\n <div class=\"config-container config-container-clickable\">\n <div class=\"entity-name-and-spinner\">\n <span>{{associatedIdentity.name}}</span>\n <div class=\"spinner\" *ngIf=\"identityLoading\"></div>\n </div>\n </div>\n </a>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">API Session ID</span>\n </div>\n <a class=\"form-field-link\" [href]=\"'./api-sessions/' + formData.apiSessionId\" (click)=\"apiSessionLinkClicked($event)\">\n <div class=\"config-container config-container-clickable\">\n <span>{{formData.apiSessionId}}</span>\n </div>\n </a>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Type</span>\n </div>\n <div class=\"config-container\">\n <span>{{formData.type}}</span>\n </div>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Created At</span>\n </div>\n <div class=\"config-container\">\n <span>{{moment(formData.createdAt).format(\"M/D/YYYY h:mm A\")}}</span>\n </div>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Updated At</span>\n </div>\n <div class=\"config-container\">\n <span>{{moment(formData.updatedAt).format(\"M/D/YYYY h:mm A\")}}</span>\n </div>\n </div>\n </lib-form-field-container>\n <ng-content select=\"[slot=column-1-slot-1]\"></ng-content>\n </div>\n <div class=\"form-group-column two-fifths\">\n <lib-form-field-container\n [title]=\"'Associated Entities'\"\n [label]=\"'Click for detailed view'\"\n [helpText]=\"'List the edge routers and service policies that are associated with this session. Click on the entity name to navigate to the entity\\'s detailed view.'\"\n [class]=\"'no-gap'\"\n >\n <div class=\"form-row space-between\" style=\"margin-top: 0;\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">Edge Routers</span>\n </div>\n <span class=\"form-field-count\">{{associatedEdgeRouters.length}}</span>\n </div>\n <lib-preview-list\n [isLoading]=\"false\"\n [allNames]=\"associatedEdgeRouters\"\n [allowRemove]=\"false\"\n [clickable]=\"true\"\n [showfilter]=\"false\"\n [tooltip]=\"'View Edge Router'\"\n (itemSelected)=\"previewEdgeRouter($event, router)\"\n ></lib-preview-list>\n <div class=\"form-row space-between\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">Service Policies</span>\n </div>\n <span class=\"form-field-count\">{{associatedServicePolicies.length}}</span>\n </div>\n <lib-preview-list\n [isLoading]=\"false\"\n [clickable]=\"true\"\n (itemSelected)=\"previewServicePolicy($event, router)\"\n [tooltip]=\"'View Service Policy'\"\n [allNames]=\"associatedServicePolicies\"\n [showfilter]=\"false\"\n ></lib-preview-list>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>\n", styles: ["::ng-deep .api-session-form-wrapper .form-header-container .form-header-toggle-container{margin-right:0!important}.form-field-dropdown{background-image:url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22utf-8%22%3F%3E%3C!-- Generator%3A Adobe Illustrator 23.0.3%2C SVG Export Plug-In . SVG Version%3A 6.00 Build 0) --%3E%3Csvg id%3D'Stroke_Color' style%3D'enable-background%3Anew 0 0 20.2 10.8%3B' version%3D'1.1' viewBox%3D'0 0 20.2 10.8' x%3D'0px' xml%3Aspace%3D'preserve' xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' y%3D'0px'%3E%3Cstyle type%3D'text%2Fcss'%3E%09.st0 %7B fill%3A %23668291%3B %7D%3C%2Fstyle%3E %3Cg%3E%09%3Cpath class%3D'st0' d%3D'M19.8%2C1.7c0%2C0.4-0.1%2C0.7-0.4%2C0.9l-8.5%2C7.3c-0.5%2C0.4-1.2%2C0.4-1.6%2C0L0.7%2C2.7C0.2%2C2.2%2C0.2%2C1.5%2C0.6%2C0.9%09%09c0.5-0.5%2C1.2-0.6%2C1.8-0.1l7.7%2C6.6l7.7-6.6c0.5-0.5%2C1.3-0.4%2C1.8%2C0.1C19.7%2C1.2%2C19.8%2C1.5%2C19.8%2C1.7z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E\");background-position:center right .625rem;background-repeat:no-repeat;background-size:1.125rem;padding-right:1.75rem}.disabled{opacity:.5;pointer-events:none}.config-item{max-height:var(--defaultInputHeight);margin-top:1.15rem}::ng-deep .admin-toggle{width:100%;width:35%;display:flex}::ng-deep .admin-toggle .form-field-line{display:none}::ng-deep .admin-toggle .toggle{width:100%}::ng-deep .is-admin-container .form-field-title-container.title-container-2{width:35%!important}.svc-test-result{position:absolute;transition:var(--transition);height:0;width:100%;background-color:var(--background);bottom:0;font-weight:600;padding-left:.625rem;padding-right:.625rem;border-color:var(--inputBorder);border-style:solid;border-width:var(--inputBorderWidth);border-bottom-right-radius:var(--inputBorderRadius);border-bottom-left-radius:var(--inputBorderRadius);border-top-style:none}.svc-test-result.test-result-open{height:-moz-fit-content;height:fit-content;box-shadow:0 -.125rem .6875rem 0 var(--boxShadow);padding-bottom:.9375rem;padding-top:.9375rem}.svc-test-result .close.icon-close{top:.625rem;right:.625rem;font-size:1.125rem;height:1.125rem;width:1.125rem;line-height:1.125rem}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-label{color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-line{border-color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle{border-color:var(--primaryColor);border-style:solid;border-width:var(--inputBorderWidth)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle .switch{top:.0625rem}.entity-name-and-spinner{display:flex;flex-direction:row;align-items:center;justify-content:flex-start}.spinner{border-right-color:var(--formBase);border-top-color:var(--formBase)}\n"], dependencies: [{ kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: FormHeaderComponent, selector: "lib-form-header", inputs: ["data", "badges", "title", "moreActions", "formView", "saveDisabled", "saveTooltip", "actionButtonText", "moreActionsText", "showHeaderToggle", "showHeaderButton"], outputs: ["formViewChange", "actionRequested"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }, { kind: "component", type: PreviewListComponent, selector: "lib-preview-list", inputs: ["label", "clickable", "isLoading", "allNames", "items", "allowRemove", "tooltip", "showfilter"], outputs: ["itemSelected", "itemRemoved"] }, { kind: "component", type: LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }, { kind: "component", type: JsonViewComponent, selector: "lib-json-view", inputs: ["data", "schema", "readOnly", "jsonInvalid", "showCopy", "showLineNumbers"], outputs: ["dataChange", "jsonChange", "jsonInvalidChange"] }] }); }
|
|
27548
|
+
], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"'Session Details'\"\n [moreActions]=\"moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n [showHeaderButton]=\"false\"\n ></lib-form-header>\n <div class=\"edge-router-form-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" *ngIf=\"formView === 'simple'\">\n <div class=\"form-group-column three-fifths\">\n <lib-form-field-container [showHeader]=\"false\">\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">ID</span>\n </div>\n <div class=\"config-container\">\n <span>{{formData.id}}</span>\n </div>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Service Name</span>\n </div>\n <a class=\"form-field-link\" [href]=\"'./services/' + formData.service.id\" (click)=\"serviceNameLinkClicked($event)\">\n <div class=\"config-container config-container-clickable\">\n <span>{{formData.service.name}}</span>\n </div>\n </a>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Identity Name</span>\n </div>\n <a class=\"form-field-link\" [href]=\"'./identities/' + associatedIdentity.id\" (click)=\"identityNameLinkClicked($event)\">\n <div class=\"config-container config-container-clickable\">\n <div class=\"entity-name-and-spinner\">\n <span>{{associatedIdentity.name}}</span>\n <div class=\"spinner\" *ngIf=\"identityLoading\"></div>\n </div>\n </div>\n </a>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">API Session ID</span>\n </div>\n <a class=\"form-field-link\" [href]=\"'./api-sessions/' + formData.apiSessionId\" (click)=\"apiSessionLinkClicked($event)\">\n <div class=\"config-container config-container-clickable\">\n <span>{{formData.apiSessionId}}</span>\n </div>\n </a>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Type</span>\n </div>\n <div class=\"config-container\">\n <span>{{formData.type}}</span>\n </div>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Created At</span>\n </div>\n <div class=\"config-container\">\n <span>{{moment(formData.createdAt).format(\"M/D/YYYY h:mm A\")}}</span>\n </div>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Updated At</span>\n </div>\n <div class=\"config-container\">\n <span>{{moment(formData.updatedAt).format(\"M/D/YYYY h:mm A\")}}</span>\n </div>\n </div>\n </lib-form-field-container>\n <ng-content select=\"[slot=column-1-slot-1]\"></ng-content>\n </div>\n <div class=\"form-group-column two-fifths\">\n <lib-form-field-container\n [title]=\"'Associated Entities'\"\n [label]=\"'click item to view details'\"\n [helpText]=\"'List the edge routers and service policies that are associated with this session. Click on the entity name to navigate to the entity\\'s detailed view.'\"\n [class]=\"'no-gap'\"\n >\n <div class=\"form-row space-between\" style=\"margin-top: 0;\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">Edge Routers</span>\n </div>\n <span class=\"form-field-count\">{{associatedEdgeRouters.length}}</span>\n </div>\n <lib-preview-list\n [isLoading]=\"false\"\n [allNames]=\"associatedEdgeRouters\"\n [allowRemove]=\"false\"\n [clickable]=\"true\"\n [showfilter]=\"false\"\n [tooltip]=\"'View Edge Router'\"\n (itemSelected)=\"previewEdgeRouter($event, router)\"\n ></lib-preview-list>\n <div class=\"form-row space-between\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">Service Policies</span>\n </div>\n <span class=\"form-field-count\">{{associatedServicePolicies.length}}</span>\n </div>\n <lib-preview-list\n [isLoading]=\"false\"\n [clickable]=\"true\"\n (itemSelected)=\"previewServicePolicy($event, router)\"\n [tooltip]=\"'View Service Policy'\"\n [allNames]=\"associatedServicePolicies\"\n [showfilter]=\"false\"\n ></lib-preview-list>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>\n", styles: ["::ng-deep .api-session-form-wrapper .form-header-container .form-header-toggle-container{margin-right:0!important}.form-field-dropdown{background-image:url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22utf-8%22%3F%3E%3C!-- Generator%3A Adobe Illustrator 23.0.3%2C SVG Export Plug-In . SVG Version%3A 6.00 Build 0) --%3E%3Csvg id%3D'Stroke_Color' style%3D'enable-background%3Anew 0 0 20.2 10.8%3B' version%3D'1.1' viewBox%3D'0 0 20.2 10.8' x%3D'0px' xml%3Aspace%3D'preserve' xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' y%3D'0px'%3E%3Cstyle type%3D'text%2Fcss'%3E%09.st0 %7B fill%3A %23668291%3B %7D%3C%2Fstyle%3E %3Cg%3E%09%3Cpath class%3D'st0' d%3D'M19.8%2C1.7c0%2C0.4-0.1%2C0.7-0.4%2C0.9l-8.5%2C7.3c-0.5%2C0.4-1.2%2C0.4-1.6%2C0L0.7%2C2.7C0.2%2C2.2%2C0.2%2C1.5%2C0.6%2C0.9%09%09c0.5-0.5%2C1.2-0.6%2C1.8-0.1l7.7%2C6.6l7.7-6.6c0.5-0.5%2C1.3-0.4%2C1.8%2C0.1C19.7%2C1.2%2C19.8%2C1.5%2C19.8%2C1.7z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E\");background-position:center right .625rem;background-repeat:no-repeat;background-size:1.125rem;padding-right:1.75rem}.disabled{opacity:.5;pointer-events:none}.config-item{max-height:var(--defaultInputHeight);margin-top:1.15rem}::ng-deep .admin-toggle{width:100%;width:35%;display:flex}::ng-deep .admin-toggle .form-field-line{display:none}::ng-deep .admin-toggle .toggle{width:100%}::ng-deep .is-admin-container .form-field-title-container.title-container-2{width:35%!important}.svc-test-result{position:absolute;transition:var(--transition);height:0;width:100%;background-color:var(--background);bottom:0;font-weight:600;padding-left:.625rem;padding-right:.625rem;border-color:var(--inputBorder);border-style:solid;border-width:var(--inputBorderWidth);border-bottom-right-radius:var(--inputBorderRadius);border-bottom-left-radius:var(--inputBorderRadius);border-top-style:none}.svc-test-result.test-result-open{height:-moz-fit-content;height:fit-content;box-shadow:0 -.125rem .6875rem 0 var(--boxShadow);padding-bottom:.9375rem;padding-top:.9375rem}.svc-test-result .close.icon-close{top:.625rem;right:.625rem;font-size:1.125rem;height:1.125rem;width:1.125rem;line-height:1.125rem}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-label{color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-line{border-color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle{border-color:var(--primaryColor);border-style:solid;border-width:var(--inputBorderWidth)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle .switch{top:.0625rem}.entity-name-and-spinner{display:flex;flex-direction:row;align-items:center;justify-content:flex-start}.spinner{border-right-color:var(--formBase);border-top-color:var(--formBase)}\n"], dependencies: [{ kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: FormHeaderComponent, selector: "lib-form-header", inputs: ["data", "badges", "title", "moreActions", "formView", "saveDisabled", "saveTooltip", "actionButtonText", "moreActionsText", "showHeaderToggle", "showHeaderButton", "multiActions"], outputs: ["formViewChange", "actionRequested", "multiActionRequested"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }, { kind: "component", type: PreviewListComponent, selector: "lib-preview-list", inputs: ["label", "clickable", "isLoading", "allNames", "items", "allowRemove", "tooltip", "showfilter", "localFilter"], outputs: ["itemSelected", "itemRemoved", "filterChanged"] }, { kind: "component", type: LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }, { kind: "component", type: JsonViewComponent, selector: "lib-json-view", inputs: ["data", "schema", "readOnly", "jsonInvalid", "showCopy", "showLineNumbers"], outputs: ["dataChange", "jsonChange", "jsonInvalidChange"] }] }); }
|
|
27005
27549
|
}
|
|
27006
27550
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: SessionFormComponent, decorators: [{
|
|
27007
27551
|
type: Component,
|
|
@@ -27010,7 +27554,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
27010
27554
|
provide: MatDialogRef,
|
|
27011
27555
|
useValue: {}
|
|
27012
27556
|
}
|
|
27013
|
-
], template: "<div class=\"projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"'Session Details'\"\n [moreActions]=\"moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n [showHeaderButton]=\"false\"\n ></lib-form-header>\n <div class=\"edge-router-form-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" *ngIf=\"formView === 'simple'\">\n <div class=\"form-group-column three-fifths\">\n <lib-form-field-container [showHeader]=\"false\">\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">ID</span>\n </div>\n <div class=\"config-container\">\n <span>{{formData.id}}</span>\n </div>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Service Name</span>\n </div>\n <a class=\"form-field-link\" [href]=\"'./services/' + formData.service.id\" (click)=\"serviceNameLinkClicked($event)\">\n <div class=\"config-container config-container-clickable\">\n <span>{{formData.service.name}}</span>\n </div>\n </a>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Identity Name</span>\n </div>\n <a class=\"form-field-link\" [href]=\"'./identities/' + associatedIdentity.id\" (click)=\"identityNameLinkClicked($event)\">\n <div class=\"config-container config-container-clickable\">\n <div class=\"entity-name-and-spinner\">\n <span>{{associatedIdentity.name}}</span>\n <div class=\"spinner\" *ngIf=\"identityLoading\"></div>\n </div>\n </div>\n </a>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">API Session ID</span>\n </div>\n <a class=\"form-field-link\" [href]=\"'./api-sessions/' + formData.apiSessionId\" (click)=\"apiSessionLinkClicked($event)\">\n <div class=\"config-container config-container-clickable\">\n <span>{{formData.apiSessionId}}</span>\n </div>\n </a>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Type</span>\n </div>\n <div class=\"config-container\">\n <span>{{formData.type}}</span>\n </div>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Created At</span>\n </div>\n <div class=\"config-container\">\n <span>{{moment(formData.createdAt).format(\"M/D/YYYY h:mm A\")}}</span>\n </div>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Updated At</span>\n </div>\n <div class=\"config-container\">\n <span>{{moment(formData.updatedAt).format(\"M/D/YYYY h:mm A\")}}</span>\n </div>\n </div>\n </lib-form-field-container>\n <ng-content select=\"[slot=column-1-slot-1]\"></ng-content>\n </div>\n <div class=\"form-group-column two-fifths\">\n <lib-form-field-container\n [title]=\"'Associated Entities'\"\n [label]=\"'Click for detailed view'\"\n [helpText]=\"'List the edge routers and service policies that are associated with this session. Click on the entity name to navigate to the entity\\'s detailed view.'\"\n [class]=\"'no-gap'\"\n >\n <div class=\"form-row space-between\" style=\"margin-top: 0;\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">Edge Routers</span>\n </div>\n <span class=\"form-field-count\">{{associatedEdgeRouters.length}}</span>\n </div>\n <lib-preview-list\n [isLoading]=\"false\"\n [allNames]=\"associatedEdgeRouters\"\n [allowRemove]=\"false\"\n [clickable]=\"true\"\n [showfilter]=\"false\"\n [tooltip]=\"'View Edge Router'\"\n (itemSelected)=\"previewEdgeRouter($event, router)\"\n ></lib-preview-list>\n <div class=\"form-row space-between\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">Service Policies</span>\n </div>\n <span class=\"form-field-count\">{{associatedServicePolicies.length}}</span>\n </div>\n <lib-preview-list\n [isLoading]=\"false\"\n [clickable]=\"true\"\n (itemSelected)=\"previewServicePolicy($event, router)\"\n [tooltip]=\"'View Service Policy'\"\n [allNames]=\"associatedServicePolicies\"\n [showfilter]=\"false\"\n ></lib-preview-list>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>\n", styles: ["::ng-deep .api-session-form-wrapper .form-header-container .form-header-toggle-container{margin-right:0!important}.form-field-dropdown{background-image:url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22utf-8%22%3F%3E%3C!-- Generator%3A Adobe Illustrator 23.0.3%2C SVG Export Plug-In . SVG Version%3A 6.00 Build 0) --%3E%3Csvg id%3D'Stroke_Color' style%3D'enable-background%3Anew 0 0 20.2 10.8%3B' version%3D'1.1' viewBox%3D'0 0 20.2 10.8' x%3D'0px' xml%3Aspace%3D'preserve' xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' y%3D'0px'%3E%3Cstyle type%3D'text%2Fcss'%3E%09.st0 %7B fill%3A %23668291%3B %7D%3C%2Fstyle%3E %3Cg%3E%09%3Cpath class%3D'st0' d%3D'M19.8%2C1.7c0%2C0.4-0.1%2C0.7-0.4%2C0.9l-8.5%2C7.3c-0.5%2C0.4-1.2%2C0.4-1.6%2C0L0.7%2C2.7C0.2%2C2.2%2C0.2%2C1.5%2C0.6%2C0.9%09%09c0.5-0.5%2C1.2-0.6%2C1.8-0.1l7.7%2C6.6l7.7-6.6c0.5-0.5%2C1.3-0.4%2C1.8%2C0.1C19.7%2C1.2%2C19.8%2C1.5%2C19.8%2C1.7z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E\");background-position:center right .625rem;background-repeat:no-repeat;background-size:1.125rem;padding-right:1.75rem}.disabled{opacity:.5;pointer-events:none}.config-item{max-height:var(--defaultInputHeight);margin-top:1.15rem}::ng-deep .admin-toggle{width:100%;width:35%;display:flex}::ng-deep .admin-toggle .form-field-line{display:none}::ng-deep .admin-toggle .toggle{width:100%}::ng-deep .is-admin-container .form-field-title-container.title-container-2{width:35%!important}.svc-test-result{position:absolute;transition:var(--transition);height:0;width:100%;background-color:var(--background);bottom:0;font-weight:600;padding-left:.625rem;padding-right:.625rem;border-color:var(--inputBorder);border-style:solid;border-width:var(--inputBorderWidth);border-bottom-right-radius:var(--inputBorderRadius);border-bottom-left-radius:var(--inputBorderRadius);border-top-style:none}.svc-test-result.test-result-open{height:-moz-fit-content;height:fit-content;box-shadow:0 -.125rem .6875rem 0 var(--boxShadow);padding-bottom:.9375rem;padding-top:.9375rem}.svc-test-result .close.icon-close{top:.625rem;right:.625rem;font-size:1.125rem;height:1.125rem;width:1.125rem;line-height:1.125rem}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-label{color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-line{border-color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle{border-color:var(--primaryColor);border-style:solid;border-width:var(--inputBorderWidth)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle .switch{top:.0625rem}.entity-name-and-spinner{display:flex;flex-direction:row;align-items:center;justify-content:flex-start}.spinner{border-right-color:var(--formBase);border-top-color:var(--formBase)}\n"] }]
|
|
27557
|
+
], template: "<div class=\"projectable-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"'Session Details'\"\n [moreActions]=\"moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n [showHeaderButton]=\"false\"\n ></lib-form-header>\n <div class=\"edge-router-form-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" *ngIf=\"formView === 'simple'\">\n <div class=\"form-group-column three-fifths\">\n <lib-form-field-container [showHeader]=\"false\">\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">ID</span>\n </div>\n <div class=\"config-container\">\n <span>{{formData.id}}</span>\n </div>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Service Name</span>\n </div>\n <a class=\"form-field-link\" [href]=\"'./services/' + formData.service.id\" (click)=\"serviceNameLinkClicked($event)\">\n <div class=\"config-container config-container-clickable\">\n <span>{{formData.service.name}}</span>\n </div>\n </a>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Identity Name</span>\n </div>\n <a class=\"form-field-link\" [href]=\"'./identities/' + associatedIdentity.id\" (click)=\"identityNameLinkClicked($event)\">\n <div class=\"config-container config-container-clickable\">\n <div class=\"entity-name-and-spinner\">\n <span>{{associatedIdentity.name}}</span>\n <div class=\"spinner\" *ngIf=\"identityLoading\"></div>\n </div>\n </div>\n </a>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">API Session ID</span>\n </div>\n <a class=\"form-field-link\" [href]=\"'./api-sessions/' + formData.apiSessionId\" (click)=\"apiSessionLinkClicked($event)\">\n <div class=\"config-container config-container-clickable\">\n <span>{{formData.apiSessionId}}</span>\n </div>\n </a>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Type</span>\n </div>\n <div class=\"config-container\">\n <span>{{formData.type}}</span>\n </div>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Created At</span>\n </div>\n <div class=\"config-container\">\n <span>{{moment(formData.createdAt).format(\"M/D/YYYY h:mm A\")}}</span>\n </div>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Updated At</span>\n </div>\n <div class=\"config-container\">\n <span>{{moment(formData.updatedAt).format(\"M/D/YYYY h:mm A\")}}</span>\n </div>\n </div>\n </lib-form-field-container>\n <ng-content select=\"[slot=column-1-slot-1]\"></ng-content>\n </div>\n <div class=\"form-group-column two-fifths\">\n <lib-form-field-container\n [title]=\"'Associated Entities'\"\n [label]=\"'click item to view details'\"\n [helpText]=\"'List the edge routers and service policies that are associated with this session. Click on the entity name to navigate to the entity\\'s detailed view.'\"\n [class]=\"'no-gap'\"\n >\n <div class=\"form-row space-between\" style=\"margin-top: 0;\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">Edge Routers</span>\n </div>\n <span class=\"form-field-count\">{{associatedEdgeRouters.length}}</span>\n </div>\n <lib-preview-list\n [isLoading]=\"false\"\n [allNames]=\"associatedEdgeRouters\"\n [allowRemove]=\"false\"\n [clickable]=\"true\"\n [showfilter]=\"false\"\n [tooltip]=\"'View Edge Router'\"\n (itemSelected)=\"previewEdgeRouter($event, router)\"\n ></lib-preview-list>\n <div class=\"form-row space-between\">\n <div class=\"config-title-row\">\n <span class=\"form-field-title\">Service Policies</span>\n </div>\n <span class=\"form-field-count\">{{associatedServicePolicies.length}}</span>\n </div>\n <lib-preview-list\n [isLoading]=\"false\"\n [clickable]=\"true\"\n (itemSelected)=\"previewServicePolicy($event, router)\"\n [tooltip]=\"'View Service Policy'\"\n [allNames]=\"associatedServicePolicies\"\n [showfilter]=\"false\"\n ></lib-preview-list>\n </lib-form-field-container>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>\n", styles: ["::ng-deep .api-session-form-wrapper .form-header-container .form-header-toggle-container{margin-right:0!important}.form-field-dropdown{background-image:url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22utf-8%22%3F%3E%3C!-- Generator%3A Adobe Illustrator 23.0.3%2C SVG Export Plug-In . SVG Version%3A 6.00 Build 0) --%3E%3Csvg id%3D'Stroke_Color' style%3D'enable-background%3Anew 0 0 20.2 10.8%3B' version%3D'1.1' viewBox%3D'0 0 20.2 10.8' x%3D'0px' xml%3Aspace%3D'preserve' xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' y%3D'0px'%3E%3Cstyle type%3D'text%2Fcss'%3E%09.st0 %7B fill%3A %23668291%3B %7D%3C%2Fstyle%3E %3Cg%3E%09%3Cpath class%3D'st0' d%3D'M19.8%2C1.7c0%2C0.4-0.1%2C0.7-0.4%2C0.9l-8.5%2C7.3c-0.5%2C0.4-1.2%2C0.4-1.6%2C0L0.7%2C2.7C0.2%2C2.2%2C0.2%2C1.5%2C0.6%2C0.9%09%09c0.5-0.5%2C1.2-0.6%2C1.8-0.1l7.7%2C6.6l7.7-6.6c0.5-0.5%2C1.3-0.4%2C1.8%2C0.1C19.7%2C1.2%2C19.8%2C1.5%2C19.8%2C1.7z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E\");background-position:center right .625rem;background-repeat:no-repeat;background-size:1.125rem;padding-right:1.75rem}.disabled{opacity:.5;pointer-events:none}.config-item{max-height:var(--defaultInputHeight);margin-top:1.15rem}::ng-deep .admin-toggle{width:100%;width:35%;display:flex}::ng-deep .admin-toggle .form-field-line{display:none}::ng-deep .admin-toggle .toggle{width:100%}::ng-deep .is-admin-container .form-field-title-container.title-container-2{width:35%!important}.svc-test-result{position:absolute;transition:var(--transition);height:0;width:100%;background-color:var(--background);bottom:0;font-weight:600;padding-left:.625rem;padding-right:.625rem;border-color:var(--inputBorder);border-style:solid;border-width:var(--inputBorderWidth);border-bottom-right-radius:var(--inputBorderRadius);border-bottom-left-radius:var(--inputBorderRadius);border-top-style:none}.svc-test-result.test-result-open{height:-moz-fit-content;height:fit-content;box-shadow:0 -.125rem .6875rem 0 var(--boxShadow);padding-bottom:.9375rem;padding-top:.9375rem}.svc-test-result .close.icon-close{top:.625rem;right:.625rem;font-size:1.125rem;height:1.125rem;width:1.125rem;line-height:1.125rem}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-label{color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-line{border-color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle{border-color:var(--primaryColor);border-style:solid;border-width:var(--inputBorderWidth)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle .switch{top:.0625rem}.entity-name-and-spinner{display:flex;flex-direction:row;align-items:center;justify-content:flex-start}.spinner{border-right-color:var(--formBase);border-top-color:var(--formBase)}\n"] }]
|
|
27014
27558
|
}], ctorParameters: function () { return [{ type: SettingsService, decorators: [{
|
|
27015
27559
|
type: Inject,
|
|
27016
27560
|
args: [SETTINGS_SERVICE]
|
|
@@ -27562,7 +28106,7 @@ class APISessionFormComponent extends ProjectableForm {
|
|
|
27562
28106
|
provide: MatDialogRef,
|
|
27563
28107
|
useValue: {}
|
|
27564
28108
|
}
|
|
27565
|
-
], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"projectable-form-wrapper api-session-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"'API Session Details'\"\n [moreActions]=\"moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n [showHeaderButton]=\"false\"\n ></lib-form-header>\n <div class=\"edge-router-form-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" *ngIf=\"formView === 'simple'\">\n <div class=\"form-group-column\">\n <lib-form-field-container [showHeader]=\"false\">\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">ID</span>\n </div>\n <div class=\"config-container\">\n <span>{{formData.id}}</span>\n </div>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Identity Name</span>\n </div>\n <a class=\"form-field-link\" [href]=\"'./services/' + formData.identity.id\" (click)=\"identityNameLinkClicked($event)\">\n <div class=\"config-container config-container-clickable\">\n <span>{{formData.identity.name}}</span>\n </div>\n </a>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">IP Address</span>\n </div>\n <div class=\"config-container\">\n <span>{{formData.ipAddress}}</span>\n </div>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Created At</span>\n </div>\n <div class=\"config-container\">\n <span>{{moment(formData.createdAt).format(\"M/D/YYYY h:mm A\")}}</span>\n </div>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Updated At</span>\n </div>\n <div class=\"config-container\">\n <span>{{moment(formData.updatedAt).format(\"M/D/YYYY h:mm A\")}}</span>\n </div>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Last Activity</span>\n </div>\n <div class=\"config-container\">\n <span>{{moment(formData.lastActivity).format(\"M/D/YYYY h:mm A\")}}</span>\n </div>\n </div>\n </lib-form-field-container>\n <ng-content select=\"[slot=column-1-slot-1]\"></ng-content>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>\n", styles: ["::ng-deep .api-session-form-wrapper .form-header-container{max-width:35rem!important}::ng-deep .api-session-form-wrapper .form-header-container .form-header-toggle-container{margin-right:0!important}.projectable-form-main-column.form-group-row{max-width:35rem}.form-field-dropdown{background-image:url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22utf-8%22%3F%3E%3C!-- Generator%3A Adobe Illustrator 23.0.3%2C SVG Export Plug-In . SVG Version%3A 6.00 Build 0) --%3E%3Csvg id%3D'Stroke_Color' style%3D'enable-background%3Anew 0 0 20.2 10.8%3B' version%3D'1.1' viewBox%3D'0 0 20.2 10.8' x%3D'0px' xml%3Aspace%3D'preserve' xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' y%3D'0px'%3E%3Cstyle type%3D'text%2Fcss'%3E%09.st0 %7B fill%3A %23668291%3B %7D%3C%2Fstyle%3E %3Cg%3E%09%3Cpath class%3D'st0' d%3D'M19.8%2C1.7c0%2C0.4-0.1%2C0.7-0.4%2C0.9l-8.5%2C7.3c-0.5%2C0.4-1.2%2C0.4-1.6%2C0L0.7%2C2.7C0.2%2C2.2%2C0.2%2C1.5%2C0.6%2C0.9%09%09c0.5-0.5%2C1.2-0.6%2C1.8-0.1l7.7%2C6.6l7.7-6.6c0.5-0.5%2C1.3-0.4%2C1.8%2C0.1C19.7%2C1.2%2C19.8%2C1.5%2C19.8%2C1.7z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E\");background-position:center right .625rem;background-repeat:no-repeat;background-size:1.125rem;padding-right:1.75rem}.disabled{opacity:.5;pointer-events:none}.config-item{max-height:var(--defaultInputHeight);margin-top:1.15rem}::ng-deep .admin-toggle{width:100%;width:35%;display:flex}::ng-deep .admin-toggle .form-field-line{display:none}::ng-deep .admin-toggle .toggle{width:100%}::ng-deep .is-admin-container .form-field-title-container.title-container-2{width:35%!important}.svc-test-result{position:absolute;transition:var(--transition);height:0;width:100%;background-color:var(--background);bottom:0;font-weight:600;padding-left:.625rem;padding-right:.625rem;border-color:var(--inputBorder);border-style:solid;border-width:var(--inputBorderWidth);border-bottom-right-radius:var(--inputBorderRadius);border-bottom-left-radius:var(--inputBorderRadius);border-top-style:none}.svc-test-result.test-result-open{height:-moz-fit-content;height:fit-content;box-shadow:0 -.125rem .6875rem 0 var(--boxShadow);padding-bottom:.9375rem;padding-top:.9375rem}.svc-test-result .close.icon-close{top:.625rem;right:.625rem;font-size:1.125rem;height:1.125rem;width:1.125rem;line-height:1.125rem}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-label{color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-line{border-color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle{border-color:var(--primaryColor);border-style:solid;border-width:var(--inputBorderWidth)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle .switch{top:.0625rem}.entity-name-and-spinner{display:flex;flex-direction:row;align-items:center;justify-content:flex-start}.spinner{border-right-color:var(--formBase);border-top-color:var(--formBase)}\n"], dependencies: [{ kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: FormHeaderComponent, selector: "lib-form-header", inputs: ["data", "badges", "title", "moreActions", "formView", "saveDisabled", "saveTooltip", "actionButtonText", "moreActionsText", "showHeaderToggle", "showHeaderButton"], outputs: ["formViewChange", "actionRequested"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }, { kind: "component", type: LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }, { kind: "component", type: JsonViewComponent, selector: "lib-json-view", inputs: ["data", "schema", "readOnly", "jsonInvalid", "showCopy", "showLineNumbers"], outputs: ["dataChange", "jsonChange", "jsonInvalidChange"] }] }); }
|
|
28109
|
+
], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"projectable-form-wrapper api-session-form-wrapper\"\n (keyup.enter)=\"save($event)\"\n (keyup.escape)=\"closeModal(false)\"\n>\n <lib-form-header\n [data]=\"formData\"\n [title]=\"'API Session Details'\"\n [moreActions]=\"moreActions\"\n (actionRequested)=\"headerActionRequested($event)\"\n [(formView)]=\"formView\"\n [showHeaderButton]=\"false\"\n ></lib-form-header>\n <div class=\"edge-router-form-container projectable-form-container\">\n <div class=\"projectable-form-main-column form-group-row\" *ngIf=\"formView === 'simple'\">\n <div class=\"form-group-column\">\n <lib-form-field-container [showHeader]=\"false\">\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">ID</span>\n </div>\n <div class=\"config-container\">\n <span>{{formData.id}}</span>\n </div>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Identity Name</span>\n </div>\n <a class=\"form-field-link\" [href]=\"'./services/' + formData.identity.id\" (click)=\"identityNameLinkClicked($event)\">\n <div class=\"config-container config-container-clickable\">\n <span>{{formData.identity.name}}</span>\n </div>\n </a>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">IP Address</span>\n </div>\n <div class=\"config-container\">\n <span>{{formData.ipAddress}}</span>\n </div>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Created At</span>\n </div>\n <div class=\"config-container\">\n <span>{{moment(formData.createdAt).format(\"M/D/YYYY h:mm A\")}}</span>\n </div>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Updated At</span>\n </div>\n <div class=\"config-container\">\n <span>{{moment(formData.updatedAt).format(\"M/D/YYYY h:mm A\")}}</span>\n </div>\n </div>\n <div class=\"form-field-label-container\">\n <div class=\"form-field-title-container\">\n <span class=\"form-field-title\">Last Activity</span>\n </div>\n <div class=\"config-container\">\n <span>{{moment(formData.lastActivity).format(\"M/D/YYYY h:mm A\")}}</span>\n </div>\n </div>\n </lib-form-field-container>\n <ng-content select=\"[slot=column-1-slot-1]\"></ng-content>\n </div>\n </div>\n <div class=\"form-group-column\" *ngIf=\"formView === 'raw'\">\n <lib-json-view *ngIf=\"formData\" [(data)]=\"formData\"></lib-json-view>\n </div>\n </div>\n</div>\n<lib-loading-indicator *ngIf=\"isLoading\" [isLoading]=\"isLoading\"></lib-loading-indicator>\n", styles: ["::ng-deep .api-session-form-wrapper .form-header-container{max-width:35rem!important}::ng-deep .api-session-form-wrapper .form-header-container .form-header-toggle-container{margin-right:0!important}.projectable-form-main-column.form-group-row{max-width:35rem}.form-field-dropdown{background-image:url(\"data:image/svg+xml,%3C%3Fxml version%3D%221.0%22 encoding%3D%22utf-8%22%3F%3E%3C!-- Generator%3A Adobe Illustrator 23.0.3%2C SVG Export Plug-In . SVG Version%3A 6.00 Build 0) --%3E%3Csvg id%3D'Stroke_Color' style%3D'enable-background%3Anew 0 0 20.2 10.8%3B' version%3D'1.1' viewBox%3D'0 0 20.2 10.8' x%3D'0px' xml%3Aspace%3D'preserve' xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' y%3D'0px'%3E%3Cstyle type%3D'text%2Fcss'%3E%09.st0 %7B fill%3A %23668291%3B %7D%3C%2Fstyle%3E %3Cg%3E%09%3Cpath class%3D'st0' d%3D'M19.8%2C1.7c0%2C0.4-0.1%2C0.7-0.4%2C0.9l-8.5%2C7.3c-0.5%2C0.4-1.2%2C0.4-1.6%2C0L0.7%2C2.7C0.2%2C2.2%2C0.2%2C1.5%2C0.6%2C0.9%09%09c0.5-0.5%2C1.2-0.6%2C1.8-0.1l7.7%2C6.6l7.7-6.6c0.5-0.5%2C1.3-0.4%2C1.8%2C0.1C19.7%2C1.2%2C19.8%2C1.5%2C19.8%2C1.7z'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E\");background-position:center right .625rem;background-repeat:no-repeat;background-size:1.125rem;padding-right:1.75rem}.disabled{opacity:.5;pointer-events:none}.config-item{max-height:var(--defaultInputHeight);margin-top:1.15rem}::ng-deep .admin-toggle{width:100%;width:35%;display:flex}::ng-deep .admin-toggle .form-field-line{display:none}::ng-deep .admin-toggle .toggle{width:100%}::ng-deep .is-admin-container .form-field-title-container.title-container-2{width:35%!important}.svc-test-result{position:absolute;transition:var(--transition);height:0;width:100%;background-color:var(--background);bottom:0;font-weight:600;padding-left:.625rem;padding-right:.625rem;border-color:var(--inputBorder);border-style:solid;border-width:var(--inputBorderWidth);border-bottom-right-radius:var(--inputBorderRadius);border-bottom-left-radius:var(--inputBorderRadius);border-top-style:none}.svc-test-result.test-result-open{height:-moz-fit-content;height:fit-content;box-shadow:0 -.125rem .6875rem 0 var(--boxShadow);padding-bottom:.9375rem;padding-top:.9375rem}.svc-test-result .close.icon-close{top:.625rem;right:.625rem;font-size:1.125rem;height:1.125rem;width:1.125rem;line-height:1.125rem}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-label{color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .form-field-line{border-color:var(--primaryColor)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle{border-color:var(--primaryColor);border-style:solid;border-width:var(--inputBorderWidth)}::ng-deep .admin-toggle .form-field-toggle-container:focus .toggle .switch{top:.0625rem}.entity-name-and-spinner{display:flex;flex-direction:row;align-items:center;justify-content:flex-start}.spinner{border-right-color:var(--formBase);border-top-color:var(--formBase)}\n"], dependencies: [{ kind: "directive", type: i1$4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: FormHeaderComponent, selector: "lib-form-header", inputs: ["data", "badges", "title", "moreActions", "formView", "saveDisabled", "saveTooltip", "actionButtonText", "moreActionsText", "showHeaderToggle", "showHeaderButton", "multiActions"], outputs: ["formViewChange", "actionRequested", "multiActionRequested"] }, { kind: "component", type: FormFieldContainerComponent, selector: "lib-form-field-container", inputs: ["title", "title2", "titleIcon", "layout", "helpText", "helpText2", "label", "count", "action", "actionLabel", "class", "contentStyle", "contentClass", "showHeader", "showToggle", "headerActions", "headerToggle"], outputs: ["actionRequested", "headerToggleChange"] }, { kind: "component", type: LoadingIndicatorComponent, selector: "lib-loading-indicator", inputs: ["isLoading"] }, { kind: "component", type: JsonViewComponent, selector: "lib-json-view", inputs: ["data", "schema", "readOnly", "jsonInvalid", "showCopy", "showLineNumbers"], outputs: ["dataChange", "jsonChange", "jsonInvalidChange"] }] }); }
|
|
27566
28110
|
}
|
|
27567
28111
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: APISessionFormComponent, decorators: [{
|
|
27568
28112
|
type: Component,
|
|
@@ -28262,7 +28806,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImpo
|
|
|
28262
28806
|
}] });
|
|
28263
28807
|
|
|
28264
28808
|
const VERSION = {
|
|
28265
|
-
"version": "3.12.
|
|
28809
|
+
"version": "3.12.8"
|
|
28266
28810
|
};
|
|
28267
28811
|
|
|
28268
28812
|
/*
|
|
@@ -29731,12 +30275,12 @@ class ZitiControllerDataService extends ZitiDataService {
|
|
|
29731
30275
|
return results;
|
|
29732
30276
|
})));
|
|
29733
30277
|
}
|
|
29734
|
-
getSubdata(entityType, id, dataType, paging, contentType) {
|
|
30278
|
+
getSubdata(entityType, id, dataType, paging, contentType, filters = []) {
|
|
29735
30279
|
const apiVersions = this.settingsService.apiVersions || {};
|
|
29736
30280
|
const prefix = apiVersions["edge-management"]?.v1?.path || '/edge/management/v1';
|
|
29737
30281
|
let urlFilter = '';
|
|
29738
30282
|
if (!isEmpty(paging)) {
|
|
29739
|
-
urlFilter = this.getUrlFilter(paging,
|
|
30283
|
+
urlFilter = this.getUrlFilter(paging, filters);
|
|
29740
30284
|
}
|
|
29741
30285
|
const url = this.settingsService.settings.selectedEdgeController + `${prefix}/${entityType}/${id}/${dataType}/${urlFilter}`;
|
|
29742
30286
|
let options = {};
|
|
@@ -29824,7 +30368,7 @@ class ZitiControllerDataService extends ZitiDataService {
|
|
|
29824
30368
|
return firstValueFrom(this.httpClient.delete(serviceUrl, {}).pipe(catchError((err) => {
|
|
29825
30369
|
const error = "Server Not Accessible";
|
|
29826
30370
|
if (err.code != "ECONNREFUSED")
|
|
29827
|
-
throw
|
|
30371
|
+
throw err;
|
|
29828
30372
|
throw ({ error: error });
|
|
29829
30373
|
}), map((results) => {
|
|
29830
30374
|
return results;
|