@tuki-io/tuki-widgets 0.0.184 → 0.0.186
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/esm2020/di2mt/widgets/upgrade-overview/cards/pending-activation-users/pending-activation-users.component.mjs +20 -9
- package/esm2020/user-creation/src/classes/notification.mjs +32 -0
- package/esm2020/user-creation/src/environments/environment.mjs +11 -0
- package/esm2020/user-creation/src/shared/services/notification.service.mjs +62 -0
- package/esm2020/user-creation/src/user-creation.module.mjs +7 -1
- package/esm2020/user-creation/src/widgets/user-creation-wizard/user-creation-wizard.component.mjs +14 -11
- package/esm2020/user-device-manage/src/device-manage-widget.component.mjs +3 -3
- package/esm2020/user-manage/src/device-list/device-list.component.mjs +3 -3
- package/fesm2015/tuki-io-tuki-widgets-di2mt.mjs +16 -6
- package/fesm2015/tuki-io-tuki-widgets-di2mt.mjs.map +1 -1
- package/fesm2015/tuki-io-tuki-widgets-user-creation.mjs +117 -10
- package/fesm2015/tuki-io-tuki-widgets-user-creation.mjs.map +1 -1
- package/fesm2015/tuki-io-tuki-widgets-user-device-manage.mjs +2 -2
- package/fesm2015/tuki-io-tuki-widgets-user-device-manage.mjs.map +1 -1
- package/fesm2015/tuki-io-tuki-widgets-user-manage.mjs +2 -2
- package/fesm2015/tuki-io-tuki-widgets-user-manage.mjs.map +1 -1
- package/fesm2020/tuki-io-tuki-widgets-di2mt.mjs +18 -7
- package/fesm2020/tuki-io-tuki-widgets-di2mt.mjs.map +1 -1
- package/fesm2020/tuki-io-tuki-widgets-user-creation.mjs +117 -10
- package/fesm2020/tuki-io-tuki-widgets-user-creation.mjs.map +1 -1
- package/fesm2020/tuki-io-tuki-widgets-user-device-manage.mjs +2 -2
- package/fesm2020/tuki-io-tuki-widgets-user-device-manage.mjs.map +1 -1
- package/fesm2020/tuki-io-tuki-widgets-user-manage.mjs +2 -2
- package/fesm2020/tuki-io-tuki-widgets-user-manage.mjs.map +1 -1
- package/package.json +1 -1
- package/user-creation/src/classes/notification.d.ts +18 -0
- package/user-creation/src/environments/environment.d.ts +9 -0
- package/user-creation/src/shared/services/notification.service.d.ts +18 -0
- package/user-creation/src/widgets/user-creation-wizard/user-creation-wizard.component.d.ts +3 -0
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import * as
|
|
1
|
+
import * as i2 from '@angular/common';
|
|
2
2
|
import { CommonModule } from '@angular/common';
|
|
3
3
|
import * as i0 from '@angular/core';
|
|
4
4
|
import { NgModule, Injectable, inject, Component, Input, EventEmitter, ViewEncapsulation, Output } from '@angular/core';
|
|
@@ -7,7 +7,7 @@ import { FormBuilder, Validators, FormControl, FormsModule, ReactiveFormsModule
|
|
|
7
7
|
import * as i9 from '@angular/material/expansion';
|
|
8
8
|
import { MatExpansionModule } from '@angular/material/expansion';
|
|
9
9
|
import { MatRadioModule } from '@angular/material/radio';
|
|
10
|
-
import * as
|
|
10
|
+
import * as i4$1 from '@angular/material/stepper';
|
|
11
11
|
import { MatStepperModule } from '@angular/material/stepper';
|
|
12
12
|
import { MatProgressBarModule } from '@angular/material/progress-bar';
|
|
13
13
|
import * as i3 from '@angular/material/table';
|
|
@@ -15,7 +15,7 @@ import { MatTableModule } from '@angular/material/table';
|
|
|
15
15
|
import * as i5$1 from '@angular/material/tooltip';
|
|
16
16
|
import { MatTooltipModule } from '@angular/material/tooltip';
|
|
17
17
|
import { MatCheckboxModule } from '@angular/material/checkbox';
|
|
18
|
-
import * as i4
|
|
18
|
+
import * as i4 from '@angular/material/button';
|
|
19
19
|
import { MatButtonModule } from '@angular/material/button';
|
|
20
20
|
import { MatIconModule } from '@angular/material/icon';
|
|
21
21
|
import * as i5 from '@angular/material/form-field';
|
|
@@ -722,7 +722,7 @@ class UserDetailsStepComponent {
|
|
|
722
722
|
}
|
|
723
723
|
}
|
|
724
724
|
UserDetailsStepComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: UserDetailsStepComponent, deps: [{ token: UserCreationWizardService }], target: i0.ɵɵFactoryTarget.Component });
|
|
725
|
-
UserDetailsStepComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: UserDetailsStepComponent, selector: "tk-user-details-step", ngImport: i0, template: "<section class=\"details-step-content\">\r\n <div class=\"details-step-sections\">\r\n <section class=\"details-step-section\">\r\n <h3 class=\"details-step-section__title\">User details</h3>\r\n <div class=\"details-step-section__content\">\r\n <div class=\"details-step-section__part\">\r\n <div class=\"details-inline-fields\">\r\n <div class=\"details-inline-field\">\r\n <label class=\"details-inline-field__label\">User ID</label>\r\n <mat-form-field class=\"details-step-input\" appearance=\"outline\">\r\n <input\r\n matInput\r\n placeholder=\"User ID\"\r\n [value]=\"userCreationWizardService.userDetailsForm.userId\"\r\n (input)=\"\r\n userCreationWizardService.setUserDetailsField(\r\n 'userId',\r\n $any($event.target).value\r\n )\r\n \"\r\n />\r\n </mat-form-field>\r\n </div>\r\n\r\n <div class=\"details-inline-field\">\r\n <label class=\"details-inline-field__label\">First Name</label>\r\n <mat-form-field class=\"details-step-input\" appearance=\"outline\">\r\n <input\r\n matInput\r\n placeholder=\"First Name\"\r\n [value]=\"userCreationWizardService.userDetailsForm.firstName\"\r\n (input)=\"\r\n userCreationWizardService.setUserDetailsField(\r\n 'firstName',\r\n $any($event.target).value\r\n )\r\n \"\r\n />\r\n </mat-form-field>\r\n </div>\r\n\r\n <div class=\"details-inline-field\">\r\n <label class=\"details-inline-field__label\">Last Name</label>\r\n <mat-form-field class=\"details-step-input\" appearance=\"outline\">\r\n <input\r\n matInput\r\n placeholder=\"Last Name\"\r\n [value]=\"userCreationWizardService.userDetailsForm.lastName\"\r\n (input)=\"\r\n userCreationWizardService.setUserDetailsField(\r\n 'lastName',\r\n $any($event.target).value\r\n )\r\n \"\r\n />\r\n </mat-form-field>\r\n </div>\r\n\r\n <div class=\"details-inline-field\">\r\n <label class=\"details-inline-field__label\">Email</label>\r\n <mat-form-field class=\"details-step-input\" appearance=\"outline\">\r\n <input\r\n matInput\r\n placeholder=\"Email\"\r\n [value]=\"userCreationWizardService.userDetailsForm.email\"\r\n (input)=\"\r\n userCreationWizardService.setUserDetailsField(\r\n 'email',\r\n $any($event.target).value\r\n )\r\n \"\r\n />\r\n </mat-form-field>\r\n </div>\r\n\r\n <div class=\"details-inline-field\">\r\n <label class=\"details-inline-field__label\">User Template</label>\r\n <mat-form-field class=\"details-step-input\" appearance=\"outline\">\r\n <input\r\n matInput\r\n placeholder=\"User Template\"\r\n [value]=\"userCreationWizardService.selectedTemplate || ''\"\r\n [disabled]=\"true\"\r\n />\r\n </mat-form-field>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"details-step-section__part\">\r\n <mat-accordion class=\"details-user-accordion\">\r\n <mat-expansion-panel togglePosition=\"before\">\r\n <mat-expansion-panel-header>\r\n <mat-panel-title\r\n >Choose an existing or a LDAP user</mat-panel-title\r\n >\r\n </mat-expansion-panel-header>\r\n <div class=\"details-user-accordion__content\">\r\n <table\r\n mat-table\r\n [dataSource]=\"userCreationWizardService.ldapUsers\"\r\n class=\"details-ldap-table\"\r\n >\r\n <ng-container matColumnDef=\"userId\">\r\n <th mat-header-cell *matHeaderCellDef>User ID</th>\r\n <td mat-cell *matCellDef=\"let row\">{{ row.userId }}</td>\r\n </ng-container>\r\n\r\n <ng-container matColumnDef=\"firstName\">\r\n <th mat-header-cell *matHeaderCellDef>First Name</th>\r\n <td mat-cell *matCellDef=\"let row\">{{ row.firstName }}</td>\r\n </ng-container>\r\n\r\n <ng-container matColumnDef=\"lastName\">\r\n <th mat-header-cell *matHeaderCellDef>Last Name</th>\r\n <td mat-cell *matCellDef=\"let row\">{{ row.lastName }}</td>\r\n </ng-container>\r\n\r\n <ng-container matColumnDef=\"email\">\r\n <th mat-header-cell *matHeaderCellDef>Email</th>\r\n <td mat-cell *matCellDef=\"let row\">{{ row.email }}</td>\r\n </ng-container>\r\n\r\n <ng-container matColumnDef=\"add\">\r\n <th mat-header-cell *matHeaderCellDef>Add</th>\r\n <td mat-cell *matCellDef=\"let row\">\r\n <button\r\n mat-button\r\n class=\"details-ldap-table__add-btn\"\r\n type=\"button\"\r\n [disabled]=\"\r\n userCreationWizardService.isLdapUserAdded(row)\r\n \"\r\n (click)=\"onAddUser(row)\"\r\n >\r\n Add user\r\n </button>\r\n </td>\r\n </ng-container>\r\n\r\n <tr\r\n mat-header-row\r\n *matHeaderRowDef=\"\r\n userCreationWizardService.ldapTableColumns\r\n \"\r\n ></tr>\r\n <tr\r\n mat-row\r\n *matRowDef=\"\r\n let row;\r\n columns: userCreationWizardService.ldapTableColumns\r\n \"\r\n [class.details-ldap-table__row--disabled]=\"\r\n userCreationWizardService.isLdapUserAdded(row)\r\n \"\r\n ></tr>\r\n </table>\r\n </div>\r\n </mat-expansion-panel>\r\n </mat-accordion>\r\n </div>\r\n </div>\r\n </section>\r\n\r\n <section class=\"details-step-section\">\r\n <h3 class=\"details-step-section__title\">Lines</h3>\r\n <div class=\"details-step-section__content\">\r\n <div class=\"line-route-list\">\r\n <div\r\n class=\"line-route-row\"\r\n *ngFor=\"\r\n let lineSelection of userCreationWizardService.lineSelections;\r\n let idx = index\r\n \"\r\n >\r\n <div class=\"line-route-field\">\r\n <mat-form-field\r\n class=\"details-step-select line-route-select\"\r\n appearance=\"outline\"\r\n >\r\n <mat-select\r\n placeholder=\"Select line\"\r\n [value]=\"lineSelection.lineNumber\"\r\n (selectionChange)=\"\r\n userCreationWizardService.setLineSelection(\r\n idx,\r\n $event.value\r\n )\r\n \"\r\n >\r\n <mat-option\r\n *ngFor=\"let line of userCreationWizardService.lineOptions\"\r\n [value]=\"line.number\"\r\n >\r\n {{ line.number }} - {{ line.did }}\r\n </mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n </div>\r\n\r\n <div class=\"line-route-field\">\r\n <mat-form-field\r\n class=\"details-step-select line-route-select\"\r\n appearance=\"outline\"\r\n >\r\n <mat-select\r\n placeholder=\"Select route partition\"\r\n [value]=\"lineSelection.routePartitionName\"\r\n (selectionChange)=\"\r\n userCreationWizardService.setRoutePartitionSelection(\r\n idx,\r\n $event.value\r\n )\r\n \"\r\n >\r\n <mat-option\r\n *ngFor=\"\r\n let partition of userCreationWizardService.routePartitionOptions\r\n \"\r\n [value]=\"partition\"\r\n >\r\n {{ partition }}\r\n </mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </section>\r\n\r\n <section class=\"details-step-section\">\r\n <h3 class=\"details-step-section__title\">Devices</h3>\r\n <div class=\"details-step-section__content\">\r\n <div class=\"devices-rows\">\r\n <div\r\n class=\"details-inline-fields details-inline-fields--four\"\r\n *ngFor=\"\r\n let _row of userCreationWizardService.deviceRows;\r\n let idx = index\r\n \"\r\n >\r\n <div class=\"details-inline-field\">\r\n <label class=\"details-inline-field__label\">Device type</label>\r\n <mat-form-field class=\"details-step-input\" appearance=\"outline\">\r\n <input\r\n matInput\r\n placeholder=\"Device type\"\r\n [value]=\"\r\n userCreationWizardService.deviceEntries[idx].deviceType ||\r\n ''\r\n \"\r\n [disabled]=\"true\"\r\n />\r\n </mat-form-field>\r\n </div>\r\n\r\n <div class=\"details-inline-field\">\r\n <label class=\"details-inline-field__label\">Protocol</label>\r\n <mat-form-field class=\"details-step-input\" appearance=\"outline\">\r\n <input\r\n matInput\r\n placeholder=\"Protocol\"\r\n [value]=\"\r\n userCreationWizardService.deviceEntries[idx].protocol || ''\r\n \"\r\n [disabled]=\"true\"\r\n />\r\n </mat-form-field>\r\n </div>\r\n\r\n <div class=\"details-inline-field\">\r\n <label class=\"details-inline-field__label\">Button Template</label>\r\n <mat-form-field class=\"details-step-input\" appearance=\"outline\">\r\n <input\r\n matInput\r\n placeholder=\"Button Template\"\r\n [value]=\"\r\n userCreationWizardService.deviceEntries[idx]\r\n .buttonTemplate || ''\r\n \"\r\n [disabled]=\"true\"\r\n />\r\n </mat-form-field>\r\n </div>\r\n\r\n <div class=\"details-inline-field\">\r\n <label class=\"details-inline-field__label\">Name</label>\r\n <mat-form-field class=\"details-step-input\" appearance=\"outline\">\r\n <input\r\n matInput\r\n placeholder=\"Name\"\r\n [value]=\"getDeviceName(idx)\"\r\n (input)=\"\r\n userCreationWizardService.setDeviceName(\r\n idx,\r\n $any($event.target).value\r\n )\r\n \"\r\n />\r\n </mat-form-field>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </section>\r\n </div>\r\n</section>\r\n", styles: [".details-step-content{display:flex;flex-direction:column;gap:0}.details-step-dropdowns{display:flex;flex-direction:column;gap:1rem}.details-step-field{display:flex;flex-direction:column;gap:8px}.details-step-label{font-size:16px;font-weight:400;line-height:100%;letter-spacing:0;color:#333}.details-step-select{width:333px}.details-step-divider{border-top:1px solid #d9d9d9;margin-top:24px}.details-step-sections{display:flex;flex-direction:column}.details-step-section{display:flex;flex-direction:column;gap:0;padding:24px 0}.details-step-sections>.details-step-section:first-child{padding-top:0}.details-step-section+.details-step-section{border-top:1px solid #d9d9d9}.details-step-section__title{margin:0;font-family:Inter,sans-serif;font-size:16px;font-weight:600;line-height:100%;letter-spacing:0;color:#333}.details-step-section__content{margin-top:24px}.details-step-section__part+.details-step-section__part{margin-top:24px}.details-user-accordion{width:100%}.details-user-accordion__content{padding:12px 0 0}.details-ldap-table{width:100%}.details-ldap-table__row--disabled{opacity:.35}.details-ldap-table__add-btn{min-width:0;padding:0;font-family:Inter,sans-serif;font-size:14px;font-weight:500;line-height:20px;letter-spacing:0;color:#0d56aa}:host ::ng-deep .details-ldap-table .mat-header-cell{font-family:Inter,sans-serif;font-size:12px;font-weight:500;line-height:16px;letter-spacing:0;color:#737480;height:30px;padding:7px 8px}:host ::ng-deep .details-ldap-table .mat-cell{font-family:Inter,sans-serif;font-size:14px;font-weight:400;line-height:20px;letter-spacing:0;color:#333;height:40px;padding:8px}.details-inline-fields{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}.details-inline-fields--four{grid-template-columns:repeat(4,minmax(0,1fr))}.devices-rows{display:flex;flex-direction:column;gap:24px}.details-inline-field{display:flex;flex-direction:column;gap:4px}.details-inline-field__label{color:#c0c2ce;font-size:12px;font-weight:400;line-height:16px;letter-spacing:0}.details-step-input{width:100%}.line-route-list{display:flex;flex-direction:column;gap:16px}.line-route-row{display:flex;gap:16px}.line-route-field{display:flex;flex-direction:column;gap:0}.line-route-field:nth-of-type(1) .line-route-select{width:230px}.line-route-field .line-route-select{width:185px}:host ::ng-deep .details-step-select .mat-form-field-wrapper{padding-bottom:0}:host ::ng-deep .details-step-input .mat-form-field-wrapper{padding-bottom:0}:host ::ng-deep .details-step-select .mat-form-field-flex{align-items:center;height:32px;border:1px solid #767676;border-radius:6px;padding:0 12px}:host ::ng-deep .details-step-input .mat-form-field-flex{align-items:center;height:36px;border:1px solid #767676;border-radius:4px;padding:10px 8px}:host ::ng-deep .details-step-select .mat-form-field-outline,:host ::ng-deep .details-step-select .mat-form-field-outline-start,:host ::ng-deep .details-step-select .mat-form-field-outline-end,:host ::ng-deep .details-step-select .mat-form-field-outline-gap{display:none}:host ::ng-deep .details-step-input .mat-form-field-outline,:host ::ng-deep .details-step-input .mat-form-field-outline-start,:host ::ng-deep .details-step-input .mat-form-field-outline-end,:host ::ng-deep .details-step-input .mat-form-field-outline-gap{display:none}:host ::ng-deep .details-step-select .mat-form-field-infix{width:100%;border-top:0;padding:0}:host ::ng-deep .details-step-input .mat-form-field-infix{width:100%;border-top:0;padding:0}:host ::ng-deep .details-step-select .mat-select-trigger{display:flex;align-items:center;justify-content:space-between;height:100%}:host ::ng-deep .details-step-input .mat-input-element{height:100%;margin:0}:host ::ng-deep .details-step-input.mat-form-field-disabled .mat-form-field-flex{background-color:#f5f6fa;border-color:#b8beca;opacity:.55;cursor:not-allowed}:host ::ng-deep .details-step-input .mat-input-element:disabled{color:#7f8694;-webkit-text-fill-color:#7f8694;cursor:not-allowed}:host ::ng-deep .details-user-accordion .mat-expansion-panel{border:0;border-radius:0!important;background:transparent;box-shadow:none!important}:host ::ng-deep .details-user-accordion .mat-expansion-panel-header{padding:0 0 0 8px;min-height:32px;height:32px}:host ::ng-deep .details-user-accordion .mat-expansion-panel-header-title{margin:0;display:flex;align-items:center;font-family:Inter,sans-serif;font-size:14px;font-weight:500;line-height:20px;letter-spacing:0;color:#333}:host ::ng-deep .details-user-accordion .mat-expansion-panel-body{padding:0!important}:host ::ng-deep .details-user-accordion .mat-expansion-panel-header .mat-content{display:flex;align-items:center}:host ::ng-deep .details-user-accordion .mat-expansion-panel-header .mat-expansion-indicator{display:block!important;opacity:1!important;color:#333!important;align-self:center;margin:0 8px 0 0!important}:host ::ng-deep .details-user-accordion .mat-expansion-panel-header .mat-expansion-indicator:after{color:#333!important;border-color:#333!important;position:relative;top:-4px}\n"], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i3.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i3.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i3.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i3.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i3.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i3.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i3.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i3.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i3.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i3.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i4$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i6.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i7.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i8.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "directive", type: i9.MatAccordion, selector: "mat-accordion", inputs: ["multi", "hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: i9.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["disabled", "expanded", "hideToggle", "togglePosition"], outputs: ["opened", "closed", "expandedChange", "afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i9.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["tabIndex", "expandedHeight", "collapsedHeight"] }, { kind: "directive", type: i9.MatExpansionPanelTitle, selector: "mat-panel-title" }] });
|
|
725
|
+
UserDetailsStepComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: UserDetailsStepComponent, selector: "tk-user-details-step", ngImport: i0, template: "<section class=\"details-step-content\">\r\n <div class=\"details-step-sections\">\r\n <section class=\"details-step-section\">\r\n <h3 class=\"details-step-section__title\">User details</h3>\r\n <div class=\"details-step-section__content\">\r\n <div class=\"details-step-section__part\">\r\n <div class=\"details-inline-fields\">\r\n <div class=\"details-inline-field\">\r\n <label class=\"details-inline-field__label\">User ID</label>\r\n <mat-form-field class=\"details-step-input\" appearance=\"outline\">\r\n <input\r\n matInput\r\n placeholder=\"User ID\"\r\n [value]=\"userCreationWizardService.userDetailsForm.userId\"\r\n (input)=\"\r\n userCreationWizardService.setUserDetailsField(\r\n 'userId',\r\n $any($event.target).value\r\n )\r\n \"\r\n />\r\n </mat-form-field>\r\n </div>\r\n\r\n <div class=\"details-inline-field\">\r\n <label class=\"details-inline-field__label\">First Name</label>\r\n <mat-form-field class=\"details-step-input\" appearance=\"outline\">\r\n <input\r\n matInput\r\n placeholder=\"First Name\"\r\n [value]=\"userCreationWizardService.userDetailsForm.firstName\"\r\n (input)=\"\r\n userCreationWizardService.setUserDetailsField(\r\n 'firstName',\r\n $any($event.target).value\r\n )\r\n \"\r\n />\r\n </mat-form-field>\r\n </div>\r\n\r\n <div class=\"details-inline-field\">\r\n <label class=\"details-inline-field__label\">Last Name</label>\r\n <mat-form-field class=\"details-step-input\" appearance=\"outline\">\r\n <input\r\n matInput\r\n placeholder=\"Last Name\"\r\n [value]=\"userCreationWizardService.userDetailsForm.lastName\"\r\n (input)=\"\r\n userCreationWizardService.setUserDetailsField(\r\n 'lastName',\r\n $any($event.target).value\r\n )\r\n \"\r\n />\r\n </mat-form-field>\r\n </div>\r\n\r\n <div class=\"details-inline-field\">\r\n <label class=\"details-inline-field__label\">Email</label>\r\n <mat-form-field class=\"details-step-input\" appearance=\"outline\">\r\n <input\r\n matInput\r\n placeholder=\"Email\"\r\n [value]=\"userCreationWizardService.userDetailsForm.email\"\r\n (input)=\"\r\n userCreationWizardService.setUserDetailsField(\r\n 'email',\r\n $any($event.target).value\r\n )\r\n \"\r\n />\r\n </mat-form-field>\r\n </div>\r\n\r\n <div class=\"details-inline-field\">\r\n <label class=\"details-inline-field__label\">User Template</label>\r\n <mat-form-field class=\"details-step-input\" appearance=\"outline\">\r\n <input\r\n matInput\r\n placeholder=\"User Template\"\r\n [value]=\"userCreationWizardService.selectedTemplate || ''\"\r\n [disabled]=\"true\"\r\n />\r\n </mat-form-field>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"details-step-section__part\">\r\n <mat-accordion class=\"details-user-accordion\">\r\n <mat-expansion-panel togglePosition=\"before\">\r\n <mat-expansion-panel-header>\r\n <mat-panel-title\r\n >Choose an existing or a LDAP user</mat-panel-title\r\n >\r\n </mat-expansion-panel-header>\r\n <div class=\"details-user-accordion__content\">\r\n <table\r\n mat-table\r\n [dataSource]=\"userCreationWizardService.ldapUsers\"\r\n class=\"details-ldap-table\"\r\n >\r\n <ng-container matColumnDef=\"userId\">\r\n <th mat-header-cell *matHeaderCellDef>User ID</th>\r\n <td mat-cell *matCellDef=\"let row\">{{ row.userId }}</td>\r\n </ng-container>\r\n\r\n <ng-container matColumnDef=\"firstName\">\r\n <th mat-header-cell *matHeaderCellDef>First Name</th>\r\n <td mat-cell *matCellDef=\"let row\">{{ row.firstName }}</td>\r\n </ng-container>\r\n\r\n <ng-container matColumnDef=\"lastName\">\r\n <th mat-header-cell *matHeaderCellDef>Last Name</th>\r\n <td mat-cell *matCellDef=\"let row\">{{ row.lastName }}</td>\r\n </ng-container>\r\n\r\n <ng-container matColumnDef=\"email\">\r\n <th mat-header-cell *matHeaderCellDef>Email</th>\r\n <td mat-cell *matCellDef=\"let row\">{{ row.email }}</td>\r\n </ng-container>\r\n\r\n <ng-container matColumnDef=\"add\">\r\n <th mat-header-cell *matHeaderCellDef>Add</th>\r\n <td mat-cell *matCellDef=\"let row\">\r\n <button\r\n mat-button\r\n class=\"details-ldap-table__add-btn\"\r\n type=\"button\"\r\n [disabled]=\"\r\n userCreationWizardService.isLdapUserAdded(row)\r\n \"\r\n (click)=\"onAddUser(row)\"\r\n >\r\n Add user\r\n </button>\r\n </td>\r\n </ng-container>\r\n\r\n <tr\r\n mat-header-row\r\n *matHeaderRowDef=\"\r\n userCreationWizardService.ldapTableColumns\r\n \"\r\n ></tr>\r\n <tr\r\n mat-row\r\n *matRowDef=\"\r\n let row;\r\n columns: userCreationWizardService.ldapTableColumns\r\n \"\r\n [class.details-ldap-table__row--disabled]=\"\r\n userCreationWizardService.isLdapUserAdded(row)\r\n \"\r\n ></tr>\r\n </table>\r\n </div>\r\n </mat-expansion-panel>\r\n </mat-accordion>\r\n </div>\r\n </div>\r\n </section>\r\n\r\n <section class=\"details-step-section\">\r\n <h3 class=\"details-step-section__title\">Lines</h3>\r\n <div class=\"details-step-section__content\">\r\n <div class=\"line-route-list\">\r\n <div\r\n class=\"line-route-row\"\r\n *ngFor=\"\r\n let lineSelection of userCreationWizardService.lineSelections;\r\n let idx = index\r\n \"\r\n >\r\n <div class=\"line-route-field\">\r\n <mat-form-field\r\n class=\"details-step-select line-route-select\"\r\n appearance=\"outline\"\r\n >\r\n <mat-select\r\n placeholder=\"Select line\"\r\n [value]=\"lineSelection.lineNumber\"\r\n (selectionChange)=\"\r\n userCreationWizardService.setLineSelection(\r\n idx,\r\n $event.value\r\n )\r\n \"\r\n >\r\n <mat-option\r\n *ngFor=\"let line of userCreationWizardService.lineOptions\"\r\n [value]=\"line.number\"\r\n >\r\n {{ line.number }} - {{ line.did }}\r\n </mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n </div>\r\n\r\n <div class=\"line-route-field\">\r\n <mat-form-field\r\n class=\"details-step-select line-route-select\"\r\n appearance=\"outline\"\r\n >\r\n <mat-select\r\n placeholder=\"Select route partition\"\r\n [value]=\"lineSelection.routePartitionName\"\r\n (selectionChange)=\"\r\n userCreationWizardService.setRoutePartitionSelection(\r\n idx,\r\n $event.value\r\n )\r\n \"\r\n >\r\n <mat-option\r\n *ngFor=\"\r\n let partition of userCreationWizardService.routePartitionOptions\r\n \"\r\n [value]=\"partition\"\r\n >\r\n {{ partition }}\r\n </mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </section>\r\n\r\n <section class=\"details-step-section\">\r\n <h3 class=\"details-step-section__title\">Devices</h3>\r\n <div class=\"details-step-section__content\">\r\n <div class=\"devices-rows\">\r\n <div\r\n class=\"details-inline-fields details-inline-fields--four\"\r\n *ngFor=\"\r\n let _row of userCreationWizardService.deviceRows;\r\n let idx = index\r\n \"\r\n >\r\n <div class=\"details-inline-field\">\r\n <label class=\"details-inline-field__label\">Device type</label>\r\n <mat-form-field class=\"details-step-input\" appearance=\"outline\">\r\n <input\r\n matInput\r\n placeholder=\"Device type\"\r\n [value]=\"\r\n userCreationWizardService.deviceEntries[idx].deviceType ||\r\n ''\r\n \"\r\n [disabled]=\"true\"\r\n />\r\n </mat-form-field>\r\n </div>\r\n\r\n <div class=\"details-inline-field\">\r\n <label class=\"details-inline-field__label\">Protocol</label>\r\n <mat-form-field class=\"details-step-input\" appearance=\"outline\">\r\n <input\r\n matInput\r\n placeholder=\"Protocol\"\r\n [value]=\"\r\n userCreationWizardService.deviceEntries[idx].protocol || ''\r\n \"\r\n [disabled]=\"true\"\r\n />\r\n </mat-form-field>\r\n </div>\r\n\r\n <div class=\"details-inline-field\">\r\n <label class=\"details-inline-field__label\">Button Template</label>\r\n <mat-form-field class=\"details-step-input\" appearance=\"outline\">\r\n <input\r\n matInput\r\n placeholder=\"Button Template\"\r\n [value]=\"\r\n userCreationWizardService.deviceEntries[idx]\r\n .buttonTemplate || ''\r\n \"\r\n [disabled]=\"true\"\r\n />\r\n </mat-form-field>\r\n </div>\r\n\r\n <div class=\"details-inline-field\">\r\n <label class=\"details-inline-field__label\">Name</label>\r\n <mat-form-field class=\"details-step-input\" appearance=\"outline\">\r\n <input\r\n matInput\r\n placeholder=\"Name\"\r\n [value]=\"getDeviceName(idx)\"\r\n (input)=\"\r\n userCreationWizardService.setDeviceName(\r\n idx,\r\n $any($event.target).value\r\n )\r\n \"\r\n />\r\n </mat-form-field>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </section>\r\n </div>\r\n</section>\r\n", styles: [".details-step-content{display:flex;flex-direction:column;gap:0}.details-step-dropdowns{display:flex;flex-direction:column;gap:1rem}.details-step-field{display:flex;flex-direction:column;gap:8px}.details-step-label{font-size:16px;font-weight:400;line-height:100%;letter-spacing:0;color:#333}.details-step-select{width:333px}.details-step-divider{border-top:1px solid #d9d9d9;margin-top:24px}.details-step-sections{display:flex;flex-direction:column}.details-step-section{display:flex;flex-direction:column;gap:0;padding:24px 0}.details-step-sections>.details-step-section:first-child{padding-top:0}.details-step-section+.details-step-section{border-top:1px solid #d9d9d9}.details-step-section__title{margin:0;font-family:Inter,sans-serif;font-size:16px;font-weight:600;line-height:100%;letter-spacing:0;color:#333}.details-step-section__content{margin-top:24px}.details-step-section__part+.details-step-section__part{margin-top:24px}.details-user-accordion{width:100%}.details-user-accordion__content{padding:12px 0 0}.details-ldap-table{width:100%}.details-ldap-table__row--disabled{opacity:.35}.details-ldap-table__add-btn{min-width:0;padding:0;font-family:Inter,sans-serif;font-size:14px;font-weight:500;line-height:20px;letter-spacing:0;color:#0d56aa}:host ::ng-deep .details-ldap-table .mat-header-cell{font-family:Inter,sans-serif;font-size:12px;font-weight:500;line-height:16px;letter-spacing:0;color:#737480;height:30px;padding:7px 8px}:host ::ng-deep .details-ldap-table .mat-cell{font-family:Inter,sans-serif;font-size:14px;font-weight:400;line-height:20px;letter-spacing:0;color:#333;height:40px;padding:8px}.details-inline-fields{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}.details-inline-fields--four{grid-template-columns:repeat(4,minmax(0,1fr))}.devices-rows{display:flex;flex-direction:column;gap:24px}.details-inline-field{display:flex;flex-direction:column;gap:4px}.details-inline-field__label{color:#c0c2ce;font-size:12px;font-weight:400;line-height:16px;letter-spacing:0}.details-step-input{width:100%}.line-route-list{display:flex;flex-direction:column;gap:16px}.line-route-row{display:flex;gap:16px}.line-route-field{display:flex;flex-direction:column;gap:0}.line-route-field:nth-of-type(1) .line-route-select{width:230px}.line-route-field .line-route-select{width:185px}:host ::ng-deep .details-step-select .mat-form-field-wrapper{padding-bottom:0}:host ::ng-deep .details-step-input .mat-form-field-wrapper{padding-bottom:0}:host ::ng-deep .details-step-select .mat-form-field-flex{align-items:center;height:32px;border:1px solid #767676;border-radius:6px;padding:0 12px}:host ::ng-deep .details-step-input .mat-form-field-flex{align-items:center;height:36px;border:1px solid #767676;border-radius:4px;padding:10px 8px}:host ::ng-deep .details-step-select .mat-form-field-outline,:host ::ng-deep .details-step-select .mat-form-field-outline-start,:host ::ng-deep .details-step-select .mat-form-field-outline-end,:host ::ng-deep .details-step-select .mat-form-field-outline-gap{display:none}:host ::ng-deep .details-step-input .mat-form-field-outline,:host ::ng-deep .details-step-input .mat-form-field-outline-start,:host ::ng-deep .details-step-input .mat-form-field-outline-end,:host ::ng-deep .details-step-input .mat-form-field-outline-gap{display:none}:host ::ng-deep .details-step-select .mat-form-field-infix{width:100%;border-top:0;padding:0}:host ::ng-deep .details-step-input .mat-form-field-infix{width:100%;border-top:0;padding:0}:host ::ng-deep .details-step-select .mat-select-trigger{display:flex;align-items:center;justify-content:space-between;height:100%}:host ::ng-deep .details-step-input .mat-input-element{height:100%;margin:0}:host ::ng-deep .details-step-input.mat-form-field-disabled .mat-form-field-flex{background-color:#f5f6fa;border-color:#b8beca;opacity:.55;cursor:not-allowed}:host ::ng-deep .details-step-input .mat-input-element:disabled{color:#7f8694;-webkit-text-fill-color:#7f8694;cursor:not-allowed}:host ::ng-deep .details-user-accordion .mat-expansion-panel{border:0;border-radius:0!important;background:transparent;box-shadow:none!important}:host ::ng-deep .details-user-accordion .mat-expansion-panel-header{padding:0 0 0 8px;min-height:32px;height:32px}:host ::ng-deep .details-user-accordion .mat-expansion-panel-header-title{margin:0;display:flex;align-items:center;font-family:Inter,sans-serif;font-size:14px;font-weight:500;line-height:20px;letter-spacing:0;color:#333}:host ::ng-deep .details-user-accordion .mat-expansion-panel-body{padding:0!important}:host ::ng-deep .details-user-accordion .mat-expansion-panel-header .mat-content{display:flex;align-items:center}:host ::ng-deep .details-user-accordion .mat-expansion-panel-header .mat-expansion-indicator{display:block!important;opacity:1!important;color:#333!important;align-self:center;margin:0 8px 0 0!important}:host ::ng-deep .details-user-accordion .mat-expansion-panel-header .mat-expansion-indicator:after{color:#333!important;border-color:#333!important;position:relative;top:-4px}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i3.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i3.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i3.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i3.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i3.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i3.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i3.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i3.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i3.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i3.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i4.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i5.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i6.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i7.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "component", type: i8.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "directive", type: i9.MatAccordion, selector: "mat-accordion", inputs: ["multi", "hideToggle", "displayMode", "togglePosition"], exportAs: ["matAccordion"] }, { kind: "component", type: i9.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["disabled", "expanded", "hideToggle", "togglePosition"], outputs: ["opened", "closed", "expandedChange", "afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "component", type: i9.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["tabIndex", "expandedHeight", "collapsedHeight"] }, { kind: "directive", type: i9.MatExpansionPanelTitle, selector: "mat-panel-title" }] });
|
|
726
726
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: UserDetailsStepComponent, decorators: [{
|
|
727
727
|
type: Component,
|
|
728
728
|
args: [{ selector: 'tk-user-details-step', template: "<section class=\"details-step-content\">\r\n <div class=\"details-step-sections\">\r\n <section class=\"details-step-section\">\r\n <h3 class=\"details-step-section__title\">User details</h3>\r\n <div class=\"details-step-section__content\">\r\n <div class=\"details-step-section__part\">\r\n <div class=\"details-inline-fields\">\r\n <div class=\"details-inline-field\">\r\n <label class=\"details-inline-field__label\">User ID</label>\r\n <mat-form-field class=\"details-step-input\" appearance=\"outline\">\r\n <input\r\n matInput\r\n placeholder=\"User ID\"\r\n [value]=\"userCreationWizardService.userDetailsForm.userId\"\r\n (input)=\"\r\n userCreationWizardService.setUserDetailsField(\r\n 'userId',\r\n $any($event.target).value\r\n )\r\n \"\r\n />\r\n </mat-form-field>\r\n </div>\r\n\r\n <div class=\"details-inline-field\">\r\n <label class=\"details-inline-field__label\">First Name</label>\r\n <mat-form-field class=\"details-step-input\" appearance=\"outline\">\r\n <input\r\n matInput\r\n placeholder=\"First Name\"\r\n [value]=\"userCreationWizardService.userDetailsForm.firstName\"\r\n (input)=\"\r\n userCreationWizardService.setUserDetailsField(\r\n 'firstName',\r\n $any($event.target).value\r\n )\r\n \"\r\n />\r\n </mat-form-field>\r\n </div>\r\n\r\n <div class=\"details-inline-field\">\r\n <label class=\"details-inline-field__label\">Last Name</label>\r\n <mat-form-field class=\"details-step-input\" appearance=\"outline\">\r\n <input\r\n matInput\r\n placeholder=\"Last Name\"\r\n [value]=\"userCreationWizardService.userDetailsForm.lastName\"\r\n (input)=\"\r\n userCreationWizardService.setUserDetailsField(\r\n 'lastName',\r\n $any($event.target).value\r\n )\r\n \"\r\n />\r\n </mat-form-field>\r\n </div>\r\n\r\n <div class=\"details-inline-field\">\r\n <label class=\"details-inline-field__label\">Email</label>\r\n <mat-form-field class=\"details-step-input\" appearance=\"outline\">\r\n <input\r\n matInput\r\n placeholder=\"Email\"\r\n [value]=\"userCreationWizardService.userDetailsForm.email\"\r\n (input)=\"\r\n userCreationWizardService.setUserDetailsField(\r\n 'email',\r\n $any($event.target).value\r\n )\r\n \"\r\n />\r\n </mat-form-field>\r\n </div>\r\n\r\n <div class=\"details-inline-field\">\r\n <label class=\"details-inline-field__label\">User Template</label>\r\n <mat-form-field class=\"details-step-input\" appearance=\"outline\">\r\n <input\r\n matInput\r\n placeholder=\"User Template\"\r\n [value]=\"userCreationWizardService.selectedTemplate || ''\"\r\n [disabled]=\"true\"\r\n />\r\n </mat-form-field>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div class=\"details-step-section__part\">\r\n <mat-accordion class=\"details-user-accordion\">\r\n <mat-expansion-panel togglePosition=\"before\">\r\n <mat-expansion-panel-header>\r\n <mat-panel-title\r\n >Choose an existing or a LDAP user</mat-panel-title\r\n >\r\n </mat-expansion-panel-header>\r\n <div class=\"details-user-accordion__content\">\r\n <table\r\n mat-table\r\n [dataSource]=\"userCreationWizardService.ldapUsers\"\r\n class=\"details-ldap-table\"\r\n >\r\n <ng-container matColumnDef=\"userId\">\r\n <th mat-header-cell *matHeaderCellDef>User ID</th>\r\n <td mat-cell *matCellDef=\"let row\">{{ row.userId }}</td>\r\n </ng-container>\r\n\r\n <ng-container matColumnDef=\"firstName\">\r\n <th mat-header-cell *matHeaderCellDef>First Name</th>\r\n <td mat-cell *matCellDef=\"let row\">{{ row.firstName }}</td>\r\n </ng-container>\r\n\r\n <ng-container matColumnDef=\"lastName\">\r\n <th mat-header-cell *matHeaderCellDef>Last Name</th>\r\n <td mat-cell *matCellDef=\"let row\">{{ row.lastName }}</td>\r\n </ng-container>\r\n\r\n <ng-container matColumnDef=\"email\">\r\n <th mat-header-cell *matHeaderCellDef>Email</th>\r\n <td mat-cell *matCellDef=\"let row\">{{ row.email }}</td>\r\n </ng-container>\r\n\r\n <ng-container matColumnDef=\"add\">\r\n <th mat-header-cell *matHeaderCellDef>Add</th>\r\n <td mat-cell *matCellDef=\"let row\">\r\n <button\r\n mat-button\r\n class=\"details-ldap-table__add-btn\"\r\n type=\"button\"\r\n [disabled]=\"\r\n userCreationWizardService.isLdapUserAdded(row)\r\n \"\r\n (click)=\"onAddUser(row)\"\r\n >\r\n Add user\r\n </button>\r\n </td>\r\n </ng-container>\r\n\r\n <tr\r\n mat-header-row\r\n *matHeaderRowDef=\"\r\n userCreationWizardService.ldapTableColumns\r\n \"\r\n ></tr>\r\n <tr\r\n mat-row\r\n *matRowDef=\"\r\n let row;\r\n columns: userCreationWizardService.ldapTableColumns\r\n \"\r\n [class.details-ldap-table__row--disabled]=\"\r\n userCreationWizardService.isLdapUserAdded(row)\r\n \"\r\n ></tr>\r\n </table>\r\n </div>\r\n </mat-expansion-panel>\r\n </mat-accordion>\r\n </div>\r\n </div>\r\n </section>\r\n\r\n <section class=\"details-step-section\">\r\n <h3 class=\"details-step-section__title\">Lines</h3>\r\n <div class=\"details-step-section__content\">\r\n <div class=\"line-route-list\">\r\n <div\r\n class=\"line-route-row\"\r\n *ngFor=\"\r\n let lineSelection of userCreationWizardService.lineSelections;\r\n let idx = index\r\n \"\r\n >\r\n <div class=\"line-route-field\">\r\n <mat-form-field\r\n class=\"details-step-select line-route-select\"\r\n appearance=\"outline\"\r\n >\r\n <mat-select\r\n placeholder=\"Select line\"\r\n [value]=\"lineSelection.lineNumber\"\r\n (selectionChange)=\"\r\n userCreationWizardService.setLineSelection(\r\n idx,\r\n $event.value\r\n )\r\n \"\r\n >\r\n <mat-option\r\n *ngFor=\"let line of userCreationWizardService.lineOptions\"\r\n [value]=\"line.number\"\r\n >\r\n {{ line.number }} - {{ line.did }}\r\n </mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n </div>\r\n\r\n <div class=\"line-route-field\">\r\n <mat-form-field\r\n class=\"details-step-select line-route-select\"\r\n appearance=\"outline\"\r\n >\r\n <mat-select\r\n placeholder=\"Select route partition\"\r\n [value]=\"lineSelection.routePartitionName\"\r\n (selectionChange)=\"\r\n userCreationWizardService.setRoutePartitionSelection(\r\n idx,\r\n $event.value\r\n )\r\n \"\r\n >\r\n <mat-option\r\n *ngFor=\"\r\n let partition of userCreationWizardService.routePartitionOptions\r\n \"\r\n [value]=\"partition\"\r\n >\r\n {{ partition }}\r\n </mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </section>\r\n\r\n <section class=\"details-step-section\">\r\n <h3 class=\"details-step-section__title\">Devices</h3>\r\n <div class=\"details-step-section__content\">\r\n <div class=\"devices-rows\">\r\n <div\r\n class=\"details-inline-fields details-inline-fields--four\"\r\n *ngFor=\"\r\n let _row of userCreationWizardService.deviceRows;\r\n let idx = index\r\n \"\r\n >\r\n <div class=\"details-inline-field\">\r\n <label class=\"details-inline-field__label\">Device type</label>\r\n <mat-form-field class=\"details-step-input\" appearance=\"outline\">\r\n <input\r\n matInput\r\n placeholder=\"Device type\"\r\n [value]=\"\r\n userCreationWizardService.deviceEntries[idx].deviceType ||\r\n ''\r\n \"\r\n [disabled]=\"true\"\r\n />\r\n </mat-form-field>\r\n </div>\r\n\r\n <div class=\"details-inline-field\">\r\n <label class=\"details-inline-field__label\">Protocol</label>\r\n <mat-form-field class=\"details-step-input\" appearance=\"outline\">\r\n <input\r\n matInput\r\n placeholder=\"Protocol\"\r\n [value]=\"\r\n userCreationWizardService.deviceEntries[idx].protocol || ''\r\n \"\r\n [disabled]=\"true\"\r\n />\r\n </mat-form-field>\r\n </div>\r\n\r\n <div class=\"details-inline-field\">\r\n <label class=\"details-inline-field__label\">Button Template</label>\r\n <mat-form-field class=\"details-step-input\" appearance=\"outline\">\r\n <input\r\n matInput\r\n placeholder=\"Button Template\"\r\n [value]=\"\r\n userCreationWizardService.deviceEntries[idx]\r\n .buttonTemplate || ''\r\n \"\r\n [disabled]=\"true\"\r\n />\r\n </mat-form-field>\r\n </div>\r\n\r\n <div class=\"details-inline-field\">\r\n <label class=\"details-inline-field__label\">Name</label>\r\n <mat-form-field class=\"details-step-input\" appearance=\"outline\">\r\n <input\r\n matInput\r\n placeholder=\"Name\"\r\n [value]=\"getDeviceName(idx)\"\r\n (input)=\"\r\n userCreationWizardService.setDeviceName(\r\n idx,\r\n $any($event.target).value\r\n )\r\n \"\r\n />\r\n </mat-form-field>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </section>\r\n </div>\r\n</section>\r\n", styles: [".details-step-content{display:flex;flex-direction:column;gap:0}.details-step-dropdowns{display:flex;flex-direction:column;gap:1rem}.details-step-field{display:flex;flex-direction:column;gap:8px}.details-step-label{font-size:16px;font-weight:400;line-height:100%;letter-spacing:0;color:#333}.details-step-select{width:333px}.details-step-divider{border-top:1px solid #d9d9d9;margin-top:24px}.details-step-sections{display:flex;flex-direction:column}.details-step-section{display:flex;flex-direction:column;gap:0;padding:24px 0}.details-step-sections>.details-step-section:first-child{padding-top:0}.details-step-section+.details-step-section{border-top:1px solid #d9d9d9}.details-step-section__title{margin:0;font-family:Inter,sans-serif;font-size:16px;font-weight:600;line-height:100%;letter-spacing:0;color:#333}.details-step-section__content{margin-top:24px}.details-step-section__part+.details-step-section__part{margin-top:24px}.details-user-accordion{width:100%}.details-user-accordion__content{padding:12px 0 0}.details-ldap-table{width:100%}.details-ldap-table__row--disabled{opacity:.35}.details-ldap-table__add-btn{min-width:0;padding:0;font-family:Inter,sans-serif;font-size:14px;font-weight:500;line-height:20px;letter-spacing:0;color:#0d56aa}:host ::ng-deep .details-ldap-table .mat-header-cell{font-family:Inter,sans-serif;font-size:12px;font-weight:500;line-height:16px;letter-spacing:0;color:#737480;height:30px;padding:7px 8px}:host ::ng-deep .details-ldap-table .mat-cell{font-family:Inter,sans-serif;font-size:14px;font-weight:400;line-height:20px;letter-spacing:0;color:#333;height:40px;padding:8px}.details-inline-fields{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}.details-inline-fields--four{grid-template-columns:repeat(4,minmax(0,1fr))}.devices-rows{display:flex;flex-direction:column;gap:24px}.details-inline-field{display:flex;flex-direction:column;gap:4px}.details-inline-field__label{color:#c0c2ce;font-size:12px;font-weight:400;line-height:16px;letter-spacing:0}.details-step-input{width:100%}.line-route-list{display:flex;flex-direction:column;gap:16px}.line-route-row{display:flex;gap:16px}.line-route-field{display:flex;flex-direction:column;gap:0}.line-route-field:nth-of-type(1) .line-route-select{width:230px}.line-route-field .line-route-select{width:185px}:host ::ng-deep .details-step-select .mat-form-field-wrapper{padding-bottom:0}:host ::ng-deep .details-step-input .mat-form-field-wrapper{padding-bottom:0}:host ::ng-deep .details-step-select .mat-form-field-flex{align-items:center;height:32px;border:1px solid #767676;border-radius:6px;padding:0 12px}:host ::ng-deep .details-step-input .mat-form-field-flex{align-items:center;height:36px;border:1px solid #767676;border-radius:4px;padding:10px 8px}:host ::ng-deep .details-step-select .mat-form-field-outline,:host ::ng-deep .details-step-select .mat-form-field-outline-start,:host ::ng-deep .details-step-select .mat-form-field-outline-end,:host ::ng-deep .details-step-select .mat-form-field-outline-gap{display:none}:host ::ng-deep .details-step-input .mat-form-field-outline,:host ::ng-deep .details-step-input .mat-form-field-outline-start,:host ::ng-deep .details-step-input .mat-form-field-outline-end,:host ::ng-deep .details-step-input .mat-form-field-outline-gap{display:none}:host ::ng-deep .details-step-select .mat-form-field-infix{width:100%;border-top:0;padding:0}:host ::ng-deep .details-step-input .mat-form-field-infix{width:100%;border-top:0;padding:0}:host ::ng-deep .details-step-select .mat-select-trigger{display:flex;align-items:center;justify-content:space-between;height:100%}:host ::ng-deep .details-step-input .mat-input-element{height:100%;margin:0}:host ::ng-deep .details-step-input.mat-form-field-disabled .mat-form-field-flex{background-color:#f5f6fa;border-color:#b8beca;opacity:.55;cursor:not-allowed}:host ::ng-deep .details-step-input .mat-input-element:disabled{color:#7f8694;-webkit-text-fill-color:#7f8694;cursor:not-allowed}:host ::ng-deep .details-user-accordion .mat-expansion-panel{border:0;border-radius:0!important;background:transparent;box-shadow:none!important}:host ::ng-deep .details-user-accordion .mat-expansion-panel-header{padding:0 0 0 8px;min-height:32px;height:32px}:host ::ng-deep .details-user-accordion .mat-expansion-panel-header-title{margin:0;display:flex;align-items:center;font-family:Inter,sans-serif;font-size:14px;font-weight:500;line-height:20px;letter-spacing:0;color:#333}:host ::ng-deep .details-user-accordion .mat-expansion-panel-body{padding:0!important}:host ::ng-deep .details-user-accordion .mat-expansion-panel-header .mat-content{display:flex;align-items:center}:host ::ng-deep .details-user-accordion .mat-expansion-panel-header .mat-expansion-indicator{display:block!important;opacity:1!important;color:#333!important;align-self:center;margin:0 8px 0 0!important}:host ::ng-deep .details-user-accordion .mat-expansion-panel-header .mat-expansion-indicator:after{color:#333!important;border-color:#333!important;position:relative;top:-4px}\n"] }]
|
|
@@ -737,7 +737,7 @@ class UserOverviewStepComponent {
|
|
|
737
737
|
}
|
|
738
738
|
}
|
|
739
739
|
UserOverviewStepComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: UserOverviewStepComponent, deps: [{ token: UserCreationWizardService }], target: i0.ɵɵFactoryTarget.Component });
|
|
740
|
-
UserOverviewStepComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: UserOverviewStepComponent, selector: "tk-user-overview-step", ngImport: i0, template: "<section class=\"details-step-content\">\r\n <div class=\"details-step-sections\">\r\n <section class=\"details-step-section\">\r\n <h3 class=\"details-step-section__title\">User details</h3>\r\n <div class=\"details-step-section__content\">\r\n <div class=\"preview-list\" [style.--preview-cols]=\"USER_DETAILS_COLS.length\">\r\n <div class=\"preview-list__header\">\r\n <span *ngFor=\"let col of USER_DETAILS_COLS\">{{ col }}</span>\r\n </div>\r\n <div class=\"preview-list__row\" *ngFor=\"let user of userCreationWizardService.overviewUsers\">\r\n <span>{{ user.userId }}</span>\r\n <span>{{ user.firstName }}</span>\r\n <span>{{ user.lastName }}</span>\r\n <span>{{ user.email }}</span>\r\n <span>{{ user.userTemplate }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n </section>\r\n </div>\r\n \r\n <div class=\"details-step-divider\"></div>\r\n \r\n <div class=\"details-step-sections\">\r\n <section class=\"details-step-section\">\r\n <h3 class=\"details-step-section__title\">Lines</h3>\r\n <div class=\"details-step-section__content\">\r\n <div class=\"preview-list\" [style.--preview-cols]=\"LINES_COLS.length\">\r\n <div class=\"preview-list__header\">\r\n <span *ngFor=\"let col of LINES_COLS\">{{ col }}</span>\r\n </div>\r\n <div class=\"preview-list__row\" *ngFor=\"let line of userCreationWizardService.overviewLines\">\r\n <span>{{ line.number }}</span>\r\n <span>{{ line.did }}</span>\r\n <span>{{ line.routePartitionName }}</span>\r\n <span>{{ line.css }}</span>\r\n <span>{{ line.description }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n </section>\r\n </div>\r\n \r\n <div class=\"details-step-divider\"></div>\r\n \r\n <div class=\"details-step-sections\">\r\n <section class=\"details-step-section\">\r\n <h3 class=\"details-step-section__title\">Devices</h3>\r\n <div class=\"details-step-section__content\">\r\n <div class=\"preview-list\" [style.--preview-cols]=\"DEVICES_COLS.length\">\r\n <div class=\"preview-list__header\">\r\n <span *ngFor=\"let col of DEVICES_COLS\">{{ col }}</span>\r\n </div>\r\n <div class=\"preview-list__row\" *ngFor=\"let device of userCreationWizardService.overviewDevices\">\r\n <span>{{ device.name }}</span>\r\n <span>{{ device.deviceType }}</span>\r\n <span>{{ device.lines }}</span>\r\n <span>{{ device.description }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n </section>\r\n </div>\r\n\r\n <div class=\"details-step-divider\"></div>\r\n \r\n <div class=\"details-step-sections\">\r\n <section class=\"details-step-section\">\r\n <h3 class=\"details-step-section__title\">Single Number Reach</h3>\r\n <div class=\"details-step-section__content\"></div>\r\n </section>\r\n </div>\r\n\r\n <div class=\"details-step-divider\"></div>\r\n \r\n <div class=\"details-step-sections\">\r\n <section class=\"details-step-section\">\r\n <h3 class=\"details-step-section__title\">Features</h3>\r\n <div class=\"details-step-section__content\">\r\n <span style=\"margin-right: 1rem;\">Voicemail</span> 557046\r\n </div>\r\n </section>\r\n </div>\r\n\r\n</section>", styles: [".details-step-content{display:flex;flex-direction:column;gap:24px}.details-step-divider{border-top:1px solid #d9d9d9}.details-step-sections{display:flex;flex-direction:column}.details-step-section{display:flex;flex-direction:column;gap:16px}.details-step-section+.details-step-section{border-top:1px solid #d9d9d9}.details-step-section__title{margin:0;font-family:Inter,sans-serif;font-size:16px;font-weight:600;line-height:100%;letter-spacing:0;color:#333}.preview-list{display:flex;flex-direction:column;gap:4px}.preview-list__header,.preview-list__row{display:grid;grid-template-columns:repeat(var(--preview-cols, 1),minmax(0,1fr));column-gap:24px}.preview-list__header>span,.preview-list__row>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--Gray-700, #737480);font-family:Inter,sans-serif;font-size:12px;font-style:normal;font-weight:400;line-height:16px}.preview-list__row>span{min-width:0;color:var(--Gray-700, #333);font-family:Inter,sans-serif;font-size:14px;font-style:normal;font-weight:400;line-height:150%}\n"], dependencies: [{ kind: "directive", type:
|
|
740
|
+
UserOverviewStepComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: UserOverviewStepComponent, selector: "tk-user-overview-step", ngImport: i0, template: "<section class=\"details-step-content\">\r\n <div class=\"details-step-sections\">\r\n <section class=\"details-step-section\">\r\n <h3 class=\"details-step-section__title\">User details</h3>\r\n <div class=\"details-step-section__content\">\r\n <div class=\"preview-list\" [style.--preview-cols]=\"USER_DETAILS_COLS.length\">\r\n <div class=\"preview-list__header\">\r\n <span *ngFor=\"let col of USER_DETAILS_COLS\">{{ col }}</span>\r\n </div>\r\n <div class=\"preview-list__row\" *ngFor=\"let user of userCreationWizardService.overviewUsers\">\r\n <span>{{ user.userId }}</span>\r\n <span>{{ user.firstName }}</span>\r\n <span>{{ user.lastName }}</span>\r\n <span>{{ user.email }}</span>\r\n <span>{{ user.userTemplate }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n </section>\r\n </div>\r\n \r\n <div class=\"details-step-divider\"></div>\r\n \r\n <div class=\"details-step-sections\">\r\n <section class=\"details-step-section\">\r\n <h3 class=\"details-step-section__title\">Lines</h3>\r\n <div class=\"details-step-section__content\">\r\n <div class=\"preview-list\" [style.--preview-cols]=\"LINES_COLS.length\">\r\n <div class=\"preview-list__header\">\r\n <span *ngFor=\"let col of LINES_COLS\">{{ col }}</span>\r\n </div>\r\n <div class=\"preview-list__row\" *ngFor=\"let line of userCreationWizardService.overviewLines\">\r\n <span>{{ line.number }}</span>\r\n <span>{{ line.did }}</span>\r\n <span>{{ line.routePartitionName }}</span>\r\n <span>{{ line.css }}</span>\r\n <span>{{ line.description }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n </section>\r\n </div>\r\n \r\n <div class=\"details-step-divider\"></div>\r\n \r\n <div class=\"details-step-sections\">\r\n <section class=\"details-step-section\">\r\n <h3 class=\"details-step-section__title\">Devices</h3>\r\n <div class=\"details-step-section__content\">\r\n <div class=\"preview-list\" [style.--preview-cols]=\"DEVICES_COLS.length\">\r\n <div class=\"preview-list__header\">\r\n <span *ngFor=\"let col of DEVICES_COLS\">{{ col }}</span>\r\n </div>\r\n <div class=\"preview-list__row\" *ngFor=\"let device of userCreationWizardService.overviewDevices\">\r\n <span>{{ device.name }}</span>\r\n <span>{{ device.deviceType }}</span>\r\n <span>{{ device.lines }}</span>\r\n <span>{{ device.description }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n </section>\r\n </div>\r\n\r\n <div class=\"details-step-divider\"></div>\r\n \r\n <div class=\"details-step-sections\">\r\n <section class=\"details-step-section\">\r\n <h3 class=\"details-step-section__title\">Single Number Reach</h3>\r\n <div class=\"details-step-section__content\"></div>\r\n </section>\r\n </div>\r\n\r\n <div class=\"details-step-divider\"></div>\r\n \r\n <div class=\"details-step-sections\">\r\n <section class=\"details-step-section\">\r\n <h3 class=\"details-step-section__title\">Features</h3>\r\n <div class=\"details-step-section__content\">\r\n <span style=\"margin-right: 1rem;\">Voicemail</span> 557046\r\n </div>\r\n </section>\r\n </div>\r\n\r\n</section>", styles: [".details-step-content{display:flex;flex-direction:column;gap:24px}.details-step-divider{border-top:1px solid #d9d9d9}.details-step-sections{display:flex;flex-direction:column}.details-step-section{display:flex;flex-direction:column;gap:16px}.details-step-section+.details-step-section{border-top:1px solid #d9d9d9}.details-step-section__title{margin:0;font-family:Inter,sans-serif;font-size:16px;font-weight:600;line-height:100%;letter-spacing:0;color:#333}.preview-list{display:flex;flex-direction:column;gap:4px}.preview-list__header,.preview-list__row{display:grid;grid-template-columns:repeat(var(--preview-cols, 1),minmax(0,1fr));column-gap:24px}.preview-list__header>span,.preview-list__row>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--Gray-700, #737480);font-family:Inter,sans-serif;font-size:12px;font-style:normal;font-weight:400;line-height:16px}.preview-list__row>span{min-width:0;color:var(--Gray-700, #333);font-family:Inter,sans-serif;font-size:14px;font-style:normal;font-weight:400;line-height:150%}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
|
|
741
741
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: UserOverviewStepComponent, decorators: [{
|
|
742
742
|
type: Component,
|
|
743
743
|
args: [{ selector: 'tk-user-overview-step', template: "<section class=\"details-step-content\">\r\n <div class=\"details-step-sections\">\r\n <section class=\"details-step-section\">\r\n <h3 class=\"details-step-section__title\">User details</h3>\r\n <div class=\"details-step-section__content\">\r\n <div class=\"preview-list\" [style.--preview-cols]=\"USER_DETAILS_COLS.length\">\r\n <div class=\"preview-list__header\">\r\n <span *ngFor=\"let col of USER_DETAILS_COLS\">{{ col }}</span>\r\n </div>\r\n <div class=\"preview-list__row\" *ngFor=\"let user of userCreationWizardService.overviewUsers\">\r\n <span>{{ user.userId }}</span>\r\n <span>{{ user.firstName }}</span>\r\n <span>{{ user.lastName }}</span>\r\n <span>{{ user.email }}</span>\r\n <span>{{ user.userTemplate }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n </section>\r\n </div>\r\n \r\n <div class=\"details-step-divider\"></div>\r\n \r\n <div class=\"details-step-sections\">\r\n <section class=\"details-step-section\">\r\n <h3 class=\"details-step-section__title\">Lines</h3>\r\n <div class=\"details-step-section__content\">\r\n <div class=\"preview-list\" [style.--preview-cols]=\"LINES_COLS.length\">\r\n <div class=\"preview-list__header\">\r\n <span *ngFor=\"let col of LINES_COLS\">{{ col }}</span>\r\n </div>\r\n <div class=\"preview-list__row\" *ngFor=\"let line of userCreationWizardService.overviewLines\">\r\n <span>{{ line.number }}</span>\r\n <span>{{ line.did }}</span>\r\n <span>{{ line.routePartitionName }}</span>\r\n <span>{{ line.css }}</span>\r\n <span>{{ line.description }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n </section>\r\n </div>\r\n \r\n <div class=\"details-step-divider\"></div>\r\n \r\n <div class=\"details-step-sections\">\r\n <section class=\"details-step-section\">\r\n <h3 class=\"details-step-section__title\">Devices</h3>\r\n <div class=\"details-step-section__content\">\r\n <div class=\"preview-list\" [style.--preview-cols]=\"DEVICES_COLS.length\">\r\n <div class=\"preview-list__header\">\r\n <span *ngFor=\"let col of DEVICES_COLS\">{{ col }}</span>\r\n </div>\r\n <div class=\"preview-list__row\" *ngFor=\"let device of userCreationWizardService.overviewDevices\">\r\n <span>{{ device.name }}</span>\r\n <span>{{ device.deviceType }}</span>\r\n <span>{{ device.lines }}</span>\r\n <span>{{ device.description }}</span>\r\n </div>\r\n </div>\r\n </div>\r\n </section>\r\n </div>\r\n\r\n <div class=\"details-step-divider\"></div>\r\n \r\n <div class=\"details-step-sections\">\r\n <section class=\"details-step-section\">\r\n <h3 class=\"details-step-section__title\">Single Number Reach</h3>\r\n <div class=\"details-step-section__content\"></div>\r\n </section>\r\n </div>\r\n\r\n <div class=\"details-step-divider\"></div>\r\n \r\n <div class=\"details-step-sections\">\r\n <section class=\"details-step-section\">\r\n <h3 class=\"details-step-section__title\">Features</h3>\r\n <div class=\"details-step-section__content\">\r\n <span style=\"margin-right: 1rem;\">Voicemail</span> 557046\r\n </div>\r\n </section>\r\n </div>\r\n\r\n</section>", styles: [".details-step-content{display:flex;flex-direction:column;gap:24px}.details-step-divider{border-top:1px solid #d9d9d9}.details-step-sections{display:flex;flex-direction:column}.details-step-section{display:flex;flex-direction:column;gap:16px}.details-step-section+.details-step-section{border-top:1px solid #d9d9d9}.details-step-section__title{margin:0;font-family:Inter,sans-serif;font-size:16px;font-weight:600;line-height:100%;letter-spacing:0;color:#333}.preview-list{display:flex;flex-direction:column;gap:4px}.preview-list__header,.preview-list__row{display:grid;grid-template-columns:repeat(var(--preview-cols, 1),minmax(0,1fr));column-gap:24px}.preview-list__header>span,.preview-list__row>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--Gray-700, #737480);font-family:Inter,sans-serif;font-size:12px;font-style:normal;font-weight:400;line-height:16px}.preview-list__row>span{min-width:0;color:var(--Gray-700, #333);font-family:Inter,sans-serif;font-size:14px;font-style:normal;font-weight:400;line-height:150%}\n"] }]
|
|
@@ -859,7 +859,7 @@ class UserTemplateStepComponent {
|
|
|
859
859
|
}
|
|
860
860
|
}
|
|
861
861
|
UserTemplateStepComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: UserTemplateStepComponent, deps: [{ token: UserCreationWizardService }, { token: UserCreationApiService }, { token: i3$1.FormBuilder }], target: i0.ɵɵFactoryTarget.Component });
|
|
862
|
-
UserTemplateStepComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: UserTemplateStepComponent, selector: "tk-user-template-step", inputs: { customerId: "customerId" }, ngImport: i0, template: "<section class=\"template-step-content\">\r\n <ng-container [formGroup]=\"formGroup\">\r\n <!-- <div class=\"template-step-field template-step-field--user-type\">\r\n <label class=\"template-step-label\">User type</label>\r\n <mat-radio-group class=\"user-type-mat-radio-group\" formControlName=\"userType\">\r\n <mat-radio-button class=\"user-type-mat-radio\" id=\"userCreationCucm\" [value]=\"USER_CREATION_TYPES.CUCM\">\r\n UCM/DI\r\n </mat-radio-button>\r\n <mat-radio-button class=\"user-type-mat-radio\" id=\"userCreationMT\" [value]=\"USER_CREATION_TYPES.MT\">\r\n MT\r\n </mat-radio-button>\r\n </mat-radio-group>\r\n </div> -->\r\n\r\n <div class=\"template-step-field\">\r\n <label class=\"template-step-label\">Select site</label>\r\n <mat-form-field class=\"template-step-select\" appearance=\"outline\">\r\n <mat-select\r\n placeholder=\"Site name\"\r\n formControlName=\"siteId\">\r\n\r\n <mat-select-trigger>\r\n {{ getSelectedSiteName() }}\r\n </mat-select-trigger>\r\n\r\n <mat-option *ngFor=\"let site of sitesList$ | async\" [value]=\"site.id\">\r\n <div class=\"option-row\">\r\n <span class=\"name\">{{ site.name }}</span>\r\n <span *ngIf=\"site.name === 'Berlin' else notBerlinSite\" class=\"type\">{{ 'Multi Tenant' }}</span>\r\n <ng-template #notBerlinSite>\r\n <span class=\"type\">{{ isCUCM(site) ? 'UCM' : 'Dedicated Instance' }}</span>\r\n </ng-template>\r\n </div>\r\n </mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n </div>\r\n\r\n <ng-container *ngIf=\"formGroup.get('userType')?.value === USER_CREATION_TYPES.CUCM\">\r\n <div class=\"template-step-field\">\r\n <!-- <label class=\"template-step-label\">Would you like to use a template for the user creation?</label>\r\n <mat-radio-group [formControl]=\"templateToggleFormControl\">\r\n <mat-radio-button [color]=\"'primary'\" [value]=\"true\">\r\n {{ 'Yes' }}\r\n </mat-radio-button>\r\n <mat-radio-button [color]=\"'primary'\" [value]=\"false\">\r\n {{ 'No' }}\r\n </mat-radio-button>\r\n </mat-radio-group> -->\r\n\r\n <!-- <ng-container *ngIf=\"templateToggleFormControl.value === true\"> -->\r\n <label class=\"template-step-label\">Select user template</label>\r\n <mat-form-field class=\"template-step-select\" appearance=\"outline\">\r\n <mat-select\r\n placeholder=\"Templates\"\r\n formControlName=\"userTemplateId\">\r\n <mat-select-trigger>\r\n <span matTooltip=\"'A new user will be created based on the selected template, including a Cisco 8851 physical device with a single line configured, without SNR (Single Number Reach) and without voicemail.'\">\r\n {{ defaultTemplateName }}\r\n </span>\r\n </mat-select-trigger>\r\n <mat-option [value]=\"fallbackTemplateId\">\r\n {{ defaultTemplateName }}\r\n </mat-option>\r\n <mat-option *ngFor=\"let template of templatesList$ | async\" [value]=\"template.id\">\r\n {{ template.name }}\r\n </mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n <!-- </ng-container> -->\r\n </div>\r\n </ng-container>\r\n \r\n </ng-container>\r\n</section>\r\n", styles: [".template-step-content{display:flex;flex-direction:column;gap:20px;max-width:420px}.template-step-field{display:flex;flex-direction:column;gap:10px}.template-step-field--user-type{margin-bottom:6px}.template-step-label{font-size:14px;font-weight:600;line-height:100%;letter-spacing:.1px;color:#2a2f3b}.template-step-select{width:100%;max-width:333px}.user-type-mat-radio-group{display:flex;flex-direction:column;gap:10px;margin-left:16px;margin-top:8px}.user-type-mat-radio{color:#2a2f3b;font-size:14px;font-weight:500}:host ::ng-deep .user-type-mat-radio .mat-radio-label{gap:10px}:host ::ng-deep .user-type-mat-radio .mat-radio-outer-circle{border-color:#8a93a3;border-width:2px}:host ::ng-deep .user-type-mat-radio .mat-radio-inner-circle{background-color:#1170cf}:host ::ng-deep .user-type-mat-radio.mat-radio-checked .mat-radio-outer-circle{border-color:#1170cf}:host ::ng-deep .user-type-mat-radio.mat-radio-checked .mat-radio-ripple .mat-ripple-element{background-color:#1176ce26!important}:host ::ng-deep .user-type-mat-radio .mdc-radio__outer-circle{border-color:#8a93a3!important;border-width:2px!important}:host ::ng-deep .user-type-mat-radio .mdc-radio__inner-circle{border-color:#1170cf!important}:host ::ng-deep .user-type-mat-radio.mat-mdc-radio-checked .mdc-radio__outer-circle{border-color:#1170cf!important}:host ::ng-deep .user-type-mat-radio.mat-mdc-radio-checked .mdc-radio__background:before{background-color:#1176ce1f!important}:host ::ng-deep .template-step-select .mat-form-field-wrapper{padding-bottom:0}:host ::ng-deep .template-step-select .mat-form-field-flex{align-items:center;height:32px;border:1px solid #767676;border-radius:6px;padding:0 12px}:host ::ng-deep .template-step-select .mat-form-field-outline,:host ::ng-deep .template-step-select .mat-form-field-outline-start,:host ::ng-deep .template-step-select .mat-form-field-outline-end,:host ::ng-deep .template-step-select .mat-form-field-outline-gap{display:none}:host ::ng-deep .template-step-select .mat-form-field-infix{width:100%;border-top:0;padding:0}:host ::ng-deep .template-step-select .mat-select-trigger{display:flex;align-items:center;justify-content:space-between;height:100%}::ng-deep .option-row{display:flex;justify-content:space-between;align-items:center;width:100%}\n"], dependencies: [{ kind: "directive", type:
|
|
862
|
+
UserTemplateStepComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: UserTemplateStepComponent, selector: "tk-user-template-step", inputs: { customerId: "customerId" }, ngImport: i0, template: "<section class=\"template-step-content\">\r\n <ng-container [formGroup]=\"formGroup\">\r\n <!-- <div class=\"template-step-field template-step-field--user-type\">\r\n <label class=\"template-step-label\">User type</label>\r\n <mat-radio-group class=\"user-type-mat-radio-group\" formControlName=\"userType\">\r\n <mat-radio-button class=\"user-type-mat-radio\" id=\"userCreationCucm\" [value]=\"USER_CREATION_TYPES.CUCM\">\r\n UCM/DI\r\n </mat-radio-button>\r\n <mat-radio-button class=\"user-type-mat-radio\" id=\"userCreationMT\" [value]=\"USER_CREATION_TYPES.MT\">\r\n MT\r\n </mat-radio-button>\r\n </mat-radio-group>\r\n </div> -->\r\n\r\n <div class=\"template-step-field\">\r\n <label class=\"template-step-label\">Select site</label>\r\n <mat-form-field class=\"template-step-select\" appearance=\"outline\">\r\n <mat-select\r\n placeholder=\"Site name\"\r\n formControlName=\"siteId\">\r\n\r\n <mat-select-trigger>\r\n {{ getSelectedSiteName() }}\r\n </mat-select-trigger>\r\n\r\n <mat-option *ngFor=\"let site of sitesList$ | async\" [value]=\"site.id\">\r\n <div class=\"option-row\">\r\n <span class=\"name\">{{ site.name }}</span>\r\n <span *ngIf=\"site.name === 'Berlin' else notBerlinSite\" class=\"type\">{{ 'Multi Tenant' }}</span>\r\n <ng-template #notBerlinSite>\r\n <span class=\"type\">{{ isCUCM(site) ? 'UCM' : 'Dedicated Instance' }}</span>\r\n </ng-template>\r\n </div>\r\n </mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n </div>\r\n\r\n <ng-container *ngIf=\"formGroup.get('userType')?.value === USER_CREATION_TYPES.CUCM\">\r\n <div class=\"template-step-field\">\r\n <!-- <label class=\"template-step-label\">Would you like to use a template for the user creation?</label>\r\n <mat-radio-group [formControl]=\"templateToggleFormControl\">\r\n <mat-radio-button [color]=\"'primary'\" [value]=\"true\">\r\n {{ 'Yes' }}\r\n </mat-radio-button>\r\n <mat-radio-button [color]=\"'primary'\" [value]=\"false\">\r\n {{ 'No' }}\r\n </mat-radio-button>\r\n </mat-radio-group> -->\r\n\r\n <!-- <ng-container *ngIf=\"templateToggleFormControl.value === true\"> -->\r\n <label class=\"template-step-label\">Select user template</label>\r\n <mat-form-field class=\"template-step-select\" appearance=\"outline\">\r\n <mat-select\r\n placeholder=\"Templates\"\r\n formControlName=\"userTemplateId\">\r\n <mat-select-trigger>\r\n <span matTooltip=\"'A new user will be created based on the selected template, including a Cisco 8851 physical device with a single line configured, without SNR (Single Number Reach) and without voicemail.'\">\r\n {{ defaultTemplateName }}\r\n </span>\r\n </mat-select-trigger>\r\n <mat-option [value]=\"fallbackTemplateId\">\r\n {{ defaultTemplateName }}\r\n </mat-option>\r\n <mat-option *ngFor=\"let template of templatesList$ | async\" [value]=\"template.id\">\r\n {{ template.name }}\r\n </mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n <!-- </ng-container> -->\r\n </div>\r\n </ng-container>\r\n \r\n </ng-container>\r\n</section>\r\n", styles: [".template-step-content{display:flex;flex-direction:column;gap:20px;max-width:420px}.template-step-field{display:flex;flex-direction:column;gap:10px}.template-step-field--user-type{margin-bottom:6px}.template-step-label{font-size:14px;font-weight:600;line-height:100%;letter-spacing:.1px;color:#2a2f3b}.template-step-select{width:100%;max-width:333px}.user-type-mat-radio-group{display:flex;flex-direction:column;gap:10px;margin-left:16px;margin-top:8px}.user-type-mat-radio{color:#2a2f3b;font-size:14px;font-weight:500}:host ::ng-deep .user-type-mat-radio .mat-radio-label{gap:10px}:host ::ng-deep .user-type-mat-radio .mat-radio-outer-circle{border-color:#8a93a3;border-width:2px}:host ::ng-deep .user-type-mat-radio .mat-radio-inner-circle{background-color:#1170cf}:host ::ng-deep .user-type-mat-radio.mat-radio-checked .mat-radio-outer-circle{border-color:#1170cf}:host ::ng-deep .user-type-mat-radio.mat-radio-checked .mat-radio-ripple .mat-ripple-element{background-color:#1176ce26!important}:host ::ng-deep .user-type-mat-radio .mdc-radio__outer-circle{border-color:#8a93a3!important;border-width:2px!important}:host ::ng-deep .user-type-mat-radio .mdc-radio__inner-circle{border-color:#1170cf!important}:host ::ng-deep .user-type-mat-radio.mat-mdc-radio-checked .mdc-radio__outer-circle{border-color:#1170cf!important}:host ::ng-deep .user-type-mat-radio.mat-mdc-radio-checked .mdc-radio__background:before{background-color:#1176ce1f!important}:host ::ng-deep .template-step-select .mat-form-field-wrapper{padding-bottom:0}:host ::ng-deep .template-step-select .mat-form-field-flex{align-items:center;height:32px;border:1px solid #767676;border-radius:6px;padding:0 12px}:host ::ng-deep .template-step-select .mat-form-field-outline,:host ::ng-deep .template-step-select .mat-form-field-outline-start,:host ::ng-deep .template-step-select .mat-form-field-outline-end,:host ::ng-deep .template-step-select .mat-form-field-outline-gap{display:none}:host ::ng-deep .template-step-select .mat-form-field-infix{width:100%;border-top:0;padding:0}:host ::ng-deep .template-step-select .mat-select-trigger{display:flex;align-items:center;justify-content:space-between;height:100%}::ng-deep .option-row{display:flex;justify-content:space-between;align-items:center;width:100%}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5$1.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { kind: "component", type: i5.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { kind: "component", type: i7.MatSelect, selector: "mat-select", inputs: ["disabled", "disableRipple", "tabIndex"], exportAs: ["matSelect"] }, { kind: "directive", type: i7.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i8.MatOption, selector: "mat-option", exportAs: ["matOption"] }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }] });
|
|
863
863
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: UserTemplateStepComponent, decorators: [{
|
|
864
864
|
type: Component,
|
|
865
865
|
args: [{ selector: 'tk-user-template-step', template: "<section class=\"template-step-content\">\r\n <ng-container [formGroup]=\"formGroup\">\r\n <!-- <div class=\"template-step-field template-step-field--user-type\">\r\n <label class=\"template-step-label\">User type</label>\r\n <mat-radio-group class=\"user-type-mat-radio-group\" formControlName=\"userType\">\r\n <mat-radio-button class=\"user-type-mat-radio\" id=\"userCreationCucm\" [value]=\"USER_CREATION_TYPES.CUCM\">\r\n UCM/DI\r\n </mat-radio-button>\r\n <mat-radio-button class=\"user-type-mat-radio\" id=\"userCreationMT\" [value]=\"USER_CREATION_TYPES.MT\">\r\n MT\r\n </mat-radio-button>\r\n </mat-radio-group>\r\n </div> -->\r\n\r\n <div class=\"template-step-field\">\r\n <label class=\"template-step-label\">Select site</label>\r\n <mat-form-field class=\"template-step-select\" appearance=\"outline\">\r\n <mat-select\r\n placeholder=\"Site name\"\r\n formControlName=\"siteId\">\r\n\r\n <mat-select-trigger>\r\n {{ getSelectedSiteName() }}\r\n </mat-select-trigger>\r\n\r\n <mat-option *ngFor=\"let site of sitesList$ | async\" [value]=\"site.id\">\r\n <div class=\"option-row\">\r\n <span class=\"name\">{{ site.name }}</span>\r\n <span *ngIf=\"site.name === 'Berlin' else notBerlinSite\" class=\"type\">{{ 'Multi Tenant' }}</span>\r\n <ng-template #notBerlinSite>\r\n <span class=\"type\">{{ isCUCM(site) ? 'UCM' : 'Dedicated Instance' }}</span>\r\n </ng-template>\r\n </div>\r\n </mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n </div>\r\n\r\n <ng-container *ngIf=\"formGroup.get('userType')?.value === USER_CREATION_TYPES.CUCM\">\r\n <div class=\"template-step-field\">\r\n <!-- <label class=\"template-step-label\">Would you like to use a template for the user creation?</label>\r\n <mat-radio-group [formControl]=\"templateToggleFormControl\">\r\n <mat-radio-button [color]=\"'primary'\" [value]=\"true\">\r\n {{ 'Yes' }}\r\n </mat-radio-button>\r\n <mat-radio-button [color]=\"'primary'\" [value]=\"false\">\r\n {{ 'No' }}\r\n </mat-radio-button>\r\n </mat-radio-group> -->\r\n\r\n <!-- <ng-container *ngIf=\"templateToggleFormControl.value === true\"> -->\r\n <label class=\"template-step-label\">Select user template</label>\r\n <mat-form-field class=\"template-step-select\" appearance=\"outline\">\r\n <mat-select\r\n placeholder=\"Templates\"\r\n formControlName=\"userTemplateId\">\r\n <mat-select-trigger>\r\n <span matTooltip=\"'A new user will be created based on the selected template, including a Cisco 8851 physical device with a single line configured, without SNR (Single Number Reach) and without voicemail.'\">\r\n {{ defaultTemplateName }}\r\n </span>\r\n </mat-select-trigger>\r\n <mat-option [value]=\"fallbackTemplateId\">\r\n {{ defaultTemplateName }}\r\n </mat-option>\r\n <mat-option *ngFor=\"let template of templatesList$ | async\" [value]=\"template.id\">\r\n {{ template.name }}\r\n </mat-option>\r\n </mat-select>\r\n </mat-form-field>\r\n <!-- </ng-container> -->\r\n </div>\r\n </ng-container>\r\n \r\n </ng-container>\r\n</section>\r\n", styles: [".template-step-content{display:flex;flex-direction:column;gap:20px;max-width:420px}.template-step-field{display:flex;flex-direction:column;gap:10px}.template-step-field--user-type{margin-bottom:6px}.template-step-label{font-size:14px;font-weight:600;line-height:100%;letter-spacing:.1px;color:#2a2f3b}.template-step-select{width:100%;max-width:333px}.user-type-mat-radio-group{display:flex;flex-direction:column;gap:10px;margin-left:16px;margin-top:8px}.user-type-mat-radio{color:#2a2f3b;font-size:14px;font-weight:500}:host ::ng-deep .user-type-mat-radio .mat-radio-label{gap:10px}:host ::ng-deep .user-type-mat-radio .mat-radio-outer-circle{border-color:#8a93a3;border-width:2px}:host ::ng-deep .user-type-mat-radio .mat-radio-inner-circle{background-color:#1170cf}:host ::ng-deep .user-type-mat-radio.mat-radio-checked .mat-radio-outer-circle{border-color:#1170cf}:host ::ng-deep .user-type-mat-radio.mat-radio-checked .mat-radio-ripple .mat-ripple-element{background-color:#1176ce26!important}:host ::ng-deep .user-type-mat-radio .mdc-radio__outer-circle{border-color:#8a93a3!important;border-width:2px!important}:host ::ng-deep .user-type-mat-radio .mdc-radio__inner-circle{border-color:#1170cf!important}:host ::ng-deep .user-type-mat-radio.mat-mdc-radio-checked .mdc-radio__outer-circle{border-color:#1170cf!important}:host ::ng-deep .user-type-mat-radio.mat-mdc-radio-checked .mdc-radio__background:before{background-color:#1176ce1f!important}:host ::ng-deep .template-step-select .mat-form-field-wrapper{padding-bottom:0}:host ::ng-deep .template-step-select .mat-form-field-flex{align-items:center;height:32px;border:1px solid #767676;border-radius:6px;padding:0 12px}:host ::ng-deep .template-step-select .mat-form-field-outline,:host ::ng-deep .template-step-select .mat-form-field-outline-start,:host ::ng-deep .template-step-select .mat-form-field-outline-end,:host ::ng-deep .template-step-select .mat-form-field-outline-gap{display:none}:host ::ng-deep .template-step-select .mat-form-field-infix{width:100%;border-top:0;padding:0}:host ::ng-deep .template-step-select .mat-select-trigger{display:flex;align-items:center;justify-content:space-between;height:100%}::ng-deep .option-row{display:flex;justify-content:space-between;align-items:center;width:100%}\n"] }]
|
|
@@ -867,8 +867,109 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
867
867
|
type: Input
|
|
868
868
|
}] } });
|
|
869
869
|
|
|
870
|
-
|
|
870
|
+
const environment = {
|
|
871
|
+
production: false,
|
|
872
|
+
// apiUrl: 'http://localhost:4200',
|
|
873
|
+
apiUrl: 'http://192.168.0.191:8080',
|
|
874
|
+
notificationsLifetime: 30000,
|
|
875
|
+
longNotificationsLifetime: 45000,
|
|
876
|
+
cashCleanTimer: 900000,
|
|
877
|
+
cashArrayLength: 10000,
|
|
878
|
+
matomoUrl: 'http://192.168.0.136/matomo/',
|
|
879
|
+
};
|
|
880
|
+
|
|
881
|
+
const TTL_DEFAULT = environment.notificationsLifetime;
|
|
882
|
+
const TTL_LONG_DEFAULT = environment.longNotificationsLifetime;
|
|
883
|
+
var NotificationType;
|
|
884
|
+
(function (NotificationType) {
|
|
885
|
+
NotificationType["info"] = "info";
|
|
886
|
+
NotificationType["error"] = "error";
|
|
887
|
+
NotificationType["success"] = "success";
|
|
888
|
+
NotificationType["warning"] = "warning";
|
|
889
|
+
})(NotificationType || (NotificationType = {}));
|
|
890
|
+
class Notification {
|
|
891
|
+
constructor(data) {
|
|
892
|
+
this.ttl = TTL_DEFAULT;
|
|
893
|
+
Object.assign(this, data || {});
|
|
894
|
+
if (this.ttl === undefined) {
|
|
895
|
+
this.ttl = this.message && this.message.length && this.message.length < 80 ? TTL_DEFAULT : TTL_LONG_DEFAULT;
|
|
896
|
+
}
|
|
897
|
+
}
|
|
898
|
+
isInfo() {
|
|
899
|
+
return this.type === NotificationType.info;
|
|
900
|
+
}
|
|
901
|
+
isError() {
|
|
902
|
+
return this.type === NotificationType.error;
|
|
903
|
+
}
|
|
904
|
+
isSuccess() {
|
|
905
|
+
return this.type === NotificationType.success;
|
|
906
|
+
}
|
|
907
|
+
isWarning() {
|
|
908
|
+
return this.type === NotificationType.warning;
|
|
909
|
+
}
|
|
910
|
+
}
|
|
911
|
+
|
|
912
|
+
const SUCCESS_TIME = 5000;
|
|
913
|
+
const INACTIVE_SESSION_MESSAGE = 'Your session was lost due to inactivity. Please login again';
|
|
914
|
+
const INACTIVE_SESSION = 'SESSION_INACTIVE';
|
|
915
|
+
class NotificationService {
|
|
871
916
|
constructor() {
|
|
917
|
+
this.listChange = new Subject();
|
|
918
|
+
this.max = 0;
|
|
919
|
+
this.list = [];
|
|
920
|
+
}
|
|
921
|
+
error(message, ttl) {
|
|
922
|
+
this.notify('error', message, ttl);
|
|
923
|
+
}
|
|
924
|
+
success(message, ttl) {
|
|
925
|
+
this.notify('success', message, (!ttl) ? SUCCESS_TIME : ttl);
|
|
926
|
+
}
|
|
927
|
+
warning(message, ttl) {
|
|
928
|
+
this.notify('warning', message, ttl);
|
|
929
|
+
}
|
|
930
|
+
info(message, ttl) {
|
|
931
|
+
this.notify('info', message, ttl);
|
|
932
|
+
}
|
|
933
|
+
notify(type, message, ttl) {
|
|
934
|
+
const found = this.list.find((n) => n.message === message);
|
|
935
|
+
if (found) {
|
|
936
|
+
this.remove(found);
|
|
937
|
+
}
|
|
938
|
+
const notification = new Notification({
|
|
939
|
+
id: ++this.max,
|
|
940
|
+
type, message, ttl
|
|
941
|
+
});
|
|
942
|
+
if (notification.ttl > 0) {
|
|
943
|
+
notification.timerId = setTimeout(() => this.remove(notification, true), notification.ttl);
|
|
944
|
+
}
|
|
945
|
+
this.list.push(notification);
|
|
946
|
+
this.listChange.next(this.list);
|
|
947
|
+
}
|
|
948
|
+
remove(notification, auto) {
|
|
949
|
+
if (!auto && notification.timerId) {
|
|
950
|
+
// clear timeout in case of manual remove
|
|
951
|
+
clearInterval(notification.timerId);
|
|
952
|
+
}
|
|
953
|
+
this.list = this.list.filter(n => n.id !== notification.id);
|
|
954
|
+
this.listChange.next(this.list);
|
|
955
|
+
}
|
|
956
|
+
removeInactiveSessionError() {
|
|
957
|
+
if (!this.list || !this.list.length) {
|
|
958
|
+
return;
|
|
959
|
+
}
|
|
960
|
+
this.list = this.list.filter(n => n.message !== INACTIVE_SESSION_MESSAGE && n.message !== INACTIVE_SESSION);
|
|
961
|
+
this.listChange.next(this.list);
|
|
962
|
+
}
|
|
963
|
+
}
|
|
964
|
+
NotificationService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: NotificationService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
965
|
+
NotificationService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: NotificationService });
|
|
966
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: NotificationService, decorators: [{
|
|
967
|
+
type: Injectable
|
|
968
|
+
}], ctorParameters: function () { return []; } });
|
|
969
|
+
|
|
970
|
+
class UserCreationWizardComponent {
|
|
971
|
+
constructor(notificationService) {
|
|
972
|
+
this.notificationService = notificationService;
|
|
872
973
|
this.apiService = inject(APIService);
|
|
873
974
|
this.title = 'Create User';
|
|
874
975
|
this.cancel = new EventEmitter();
|
|
@@ -892,6 +993,7 @@ class UserCreationWizardComponent {
|
|
|
892
993
|
this.submitTimerId = window.setTimeout(() => {
|
|
893
994
|
this.isSubmitting = false;
|
|
894
995
|
this.submitTimerId = null;
|
|
996
|
+
this.notificationService.success('User created successfully!');
|
|
895
997
|
this.submit.emit();
|
|
896
998
|
}, delayMs);
|
|
897
999
|
}
|
|
@@ -902,12 +1004,12 @@ class UserCreationWizardComponent {
|
|
|
902
1004
|
}
|
|
903
1005
|
}
|
|
904
1006
|
}
|
|
905
|
-
UserCreationWizardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: UserCreationWizardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
906
|
-
UserCreationWizardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: UserCreationWizardComponent, selector: "tk-user-creation-wizard", inputs: { title: "title", host: "host", token: "token", customerId: "customerId" }, outputs: { cancel: "cancel", submit: "submit" }, ngImport: i0, template: "<div class=\"move-user-stepper-container\" [attr.aria-busy]=\"isSubmitting\">\n <header class=\"move-user-header\">\n <div class=\"move-user-header__title\">{{ title }}</div>\n <div class=\"move-user-header__close\">\n <span class=\"app-icon user-creation-close-icon\" (click)=\"onCancel()\"></span>\n </div>\n </header>\n\n <div id=\"user-creation-stepper\">\n <mat-stepper [linear]=\"false\" labelPosition=\"bottom\" #stepper>\n <mat-step>\n <div class=\"step-title\">Step 1: User creation with template</div>\n <ng-template matStepLabel>User creation</ng-template>\n\n <div class=\"move-user-tab-content-box\">\n <tk-user-template-step [customerId]=\"customerId\"></tk-user-template-step>\n </div>\n </mat-step>\n\n <mat-step>\n <div class=\"step-title\">Step 2 : User details</div>\n <ng-template matStepLabel>User details</ng-template>\n\n <div class=\"move-user-tab-content-box\">\n <tk-user-details-step></tk-user-details-step>\n </div>\n </mat-step>\n\n <mat-step>\n <div class=\"step-title\">Step 3: Review</div>\n <ng-template matStepLabel>Review</ng-template>\n\n <div class=\"move-user-tab-content-box\">\n <tk-user-overview-step></tk-user-overview-step>\n </div>\n </mat-step>\n </mat-stepper>\n\n <div class=\"wizard-actions\">\n <ng-container [ngSwitch]=\"stepper.selectedIndex\">\n <ng-container *ngSwitchCase=\"0\">\n <button mat-button class=\"uc-btn uc-btn-primary\" type=\"button\" (click)=\"stepper.next()\">\n Next\n </button>\n <button mat-button class=\"uc-btn uc-btn-secondary\" type=\"button\" (click)=\"onCancel()\">\n Cancel\n </button>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"1\">\n <button mat-button class=\"uc-btn uc-btn-primary\" type=\"button\" (click)=\"stepper.next()\">\n Next\n </button>\n <button mat-button class=\"uc-btn uc-btn-secondary\" type=\"button\" (click)=\"stepper.previous()\">\n Previous\n </button>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"2\">\n <button\n mat-button\n class=\"uc-btn uc-btn-primary\"\n type=\"button\"\n [disabled]=\"isSubmitting\"\n (click)=\"onSubmit()\"\n >\n <span class=\"uc-btn__inline-content\">\n <span class=\"uc-btn__spinner\" *ngIf=\"isSubmitting\" aria-hidden=\"true\"></span>\n <span>{{ isSubmitting ? 'Creating...' : 'Create' }}</span>\n </span>\n </button>\n <button\n mat-button\n class=\"uc-btn uc-btn-secondary\"\n type=\"button\"\n [disabled]=\"isSubmitting\"\n (click)=\"stepper.previous()\"\n >\n Previous\n </button>\n </ng-container>\n </ng-container>\n </div>\n </div>\n\n <div class=\"wizard-loading-overlay\" [class.wizard-loading-overlay--visible]=\"isSubmitting\" aria-hidden=\"true\"></div>\n</div>\n", styles: [".move-user-stepper-container{background-color:#f3f3f3;padding:0 0 16px;position:relative;overflow:hidden}.move-user-header{background-color:#1170cf;height:45px;padding:1rem 1.5rem;display:flex;align-items:center;justify-content:space-between;color:#fff;font-size:18px;font-weight:500}.move-user-header__close{cursor:pointer;display:flex;align-items:center;justify-content:center;line-height:0}.move-user-header__close i{font-size:25px;font-weight:100}.app-icon{height:20px;width:20px;display:block;cursor:pointer;background-repeat:no-repeat;background-position:center}.user-creation-close-icon{background-image:url(\"data:image/svg+xml,%3Csvg width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M13.0606 11.9998L19.2803 5.78001C19.35 5.71038 19.4052 5.6277 19.4429 5.53672C19.4806 5.44573 19.5 5.34822 19.5 5.24974C19.5 5.15126 19.4806 5.05374 19.4429 4.96276C19.4052 4.87177 19.3499 4.7891 19.2803 4.71947C19.2107 4.64983 19.128 4.5946 19.037 4.55691C18.946 4.51923 18.8485 4.49983 18.75 4.49983C18.6515 4.49984 18.554 4.51924 18.463 4.55692C18.3721 4.59461 18.2894 4.64985 18.2198 4.71949L12 10.9392L5.78026 4.71949C5.71077 4.64921 5.62807 4.59335 5.53691 4.55514C5.44576 4.51692 5.34795 4.49711 5.24911 4.49683C5.15027 4.49655 5.05235 4.51581 4.96098 4.55351C4.86961 4.59121 4.78659 4.64659 4.7167 4.71648C4.64681 4.78638 4.59143 4.8694 4.55374 4.96077C4.51605 5.05214 4.49679 5.15006 4.49707 5.2489C4.49736 5.34774 4.51718 5.44555 4.5554 5.5367C4.59361 5.62786 4.64947 5.71055 4.71976 5.78004L10.9395 11.9998L4.71976 18.2195C4.65013 18.2892 4.59489 18.3718 4.5572 18.4628C4.51951 18.5538 4.50011 18.6513 4.50011 18.7498C4.50011 18.8483 4.51951 18.9458 4.5572 19.0368C4.59488 19.1278 4.65012 19.2105 4.71976 19.2801C4.7894 19.3497 4.87207 19.405 4.96305 19.4427C5.05403 19.4803 5.15155 19.4997 5.25003 19.4997C5.34851 19.4997 5.44603 19.4803 5.53701 19.4427C5.628 19.405 5.71067 19.3497 5.78031 19.2801L12.0001 13.0603L18.2198 19.2801C18.3604 19.4207 18.5512 19.4997 18.7501 19.4997C18.949 19.4997 19.1397 19.4207 19.2804 19.2801C19.421 19.1395 19.5 18.9487 19.5 18.7498C19.5 18.5509 19.421 18.3602 19.2804 18.2195L13.0606 11.9998Z%22 fill%3D%22white%22 fill-opacity%3D%220.95%22%2F%3E%3C%2Fsvg%3E\");background-size:20px 20px}#user-creation-stepper{display:flex;flex-direction:column;width:100%}#user-creation-stepper .mat-stepper-horizontal{margin:0 auto;width:100%;background-color:transparent}#user-creation-stepper .mat-horizontal-stepper-header-container{margin:0 auto;width:800px}#user-creation-stepper .mat-step-icon{width:28px;height:28px;border:3px solid hsl(0,0%,50.2%)}#user-creation-stepper .mat-step-icon-selected{background-color:#c6c6c6!important;border-color:#19487d}#user-creation-stepper .mat-step-icon-state-number{background-color:#fff}#user-creation-stepper .mat-step-icon-state-edit,#user-creation-stepper .mat-step-header .mat-step-icon-state-done{background-color:#1170cf;border-color:#1170cf}#user-creation-stepper .mat-step-icon-content{display:none}#user-creation-stepper .mat-stepper-label-position-bottom .mat-horizontal-stepper-header:not(:first-child):before,#user-creation-stepper [dir=rtl] .mat-stepper-label-position-bottom .mat-horizontal-stepper-header:not(:last-child):before,#user-creation-stepper .mat-stepper-label-position-bottom .mat-horizontal-stepper-header:not(:last-child):after,#user-creation-stepper [dir=rtl] .mat-stepper-label-position-bottom .mat-horizontal-stepper-header:not(:first-child):after{border-top-width:3px!important}#user-creation-stepper .mat-horizontal-stepper-header:before,#user-creation-stepper .mat-horizontal-stepper-header:after,#user-creation-stepper .mat-stepper-horizontal-line{border-top-color:#1170cf!important;border-top-width:3px!important;border-top-style:solid!important}#user-creation-stepper .mat-horizontal-stepper-header[aria-selected=true]~.mat-stepper-horizontal-line,#user-creation-stepper .mat-horizontal-stepper-header[aria-selected=true]~.mat-horizontal-stepper-header:before,#user-creation-stepper .mat-horizontal-stepper-header[aria-selected=true]~.mat-horizontal-stepper-header:after{border-top-width:3px!important;background-color:#7b7b7b!important;border-top-color:#7b7b7b!important}#user-creation-stepper .mat-horizontal-content-container{padding:0!important;margin-top:3rem}#user-creation-stepper .mat-horizontal-stepper-content[aria-expanded=true]{padding-bottom:0}.step-title{font-size:26px;font-weight:500;width:70%;margin:0 auto 1rem;min-height:32px;display:flex;align-items:center}.wizard-actions{display:flex;flex-flow:row-reverse;justify-content:flex-start;align-items:center;margin:16px 16px 0 0;align-self:flex-end;gap:1rem;position:relative;z-index:30}.uc-btn{border-radius:50px!important;padding:8px 16px!important;min-width:80px!important;line-height:normal!important;cursor:pointer}.uc-btn__inline-content{display:inline-flex;align-items:center;gap:8px}.uc-btn__spinner{width:14px;height:14px;border:2px solid rgba(255,255,255,.5);border-top-color:#fff;border-radius:50%;animation:uc-btn-spin .7s linear infinite}@keyframes uc-btn-spin{to{transform:rotate(360deg)}}.uc-btn-primary{background-color:#000!important;color:#fff!important;border:1px solid black!important}.uc-btn-secondary{background-color:#fff!important;color:#000!important;border:1px solid black!important}.move-user-tab-content-box{width:70%;margin:0 auto;background-color:#fff;min-height:350px;border:1px solid #C3C1C1;border-radius:8px;box-sizing:border-box;padding:25px}.wizard-loading-overlay{position:absolute;inset:0;background:rgba(243,243,243,.72);backdrop-filter:blur(1px);opacity:0;pointer-events:none;transition:opacity .18s ease;z-index:20}.wizard-loading-overlay--visible{opacity:1;pointer-events:auto}.mat-button-disabled{background-color:#bbb;color:#fff;border:1px solid grey;cursor:default!important}\n"], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i4.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: i4$1.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i3$2.MatStep, selector: "mat-step", inputs: ["color"], exportAs: ["matStep"] }, { kind: "directive", type: i3$2.MatStepLabel, selector: "[matStepLabel]" }, { kind: "component", type: i3$2.MatStepper, selector: "mat-stepper, mat-vertical-stepper, mat-horizontal-stepper, [matStepper]", inputs: ["selectedIndex", "disableRipple", "color", "labelPosition", "headerPosition", "animationDuration"], outputs: ["animationDone"], exportAs: ["matStepper", "matVerticalStepper", "matHorizontalStepper"] }, { kind: "component", type: UserTemplateStepComponent, selector: "tk-user-template-step", inputs: ["customerId"] }, { kind: "component", type: UserDetailsStepComponent, selector: "tk-user-details-step" }, { kind: "component", type: UserOverviewStepComponent, selector: "tk-user-overview-step" }], encapsulation: i0.ViewEncapsulation.None });
|
|
1007
|
+
UserCreationWizardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: UserCreationWizardComponent, deps: [{ token: NotificationService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1008
|
+
UserCreationWizardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: UserCreationWizardComponent, selector: "tk-user-creation-wizard", inputs: { title: "title", host: "host", token: "token", customerId: "customerId" }, outputs: { cancel: "cancel", submit: "submit" }, ngImport: i0, template: "<div class=\"move-user-stepper-container\" [attr.aria-busy]=\"isSubmitting\">\n <header class=\"move-user-header\">\n <div class=\"move-user-header__title\">{{ title }}</div>\n <div class=\"move-user-header__close\">\n <span class=\"app-icon user-creation-close-icon\" (click)=\"onCancel()\"></span>\n </div>\n </header>\n\n <div id=\"user-creation-stepper\">\n <mat-stepper [linear]=\"false\" labelPosition=\"bottom\" #stepper>\n <mat-step>\n <div class=\"step-title\">Step 1: User creation with template</div>\n <ng-template matStepLabel>User creation</ng-template>\n\n <div class=\"move-user-tab-content-box\">\n <tk-user-template-step [customerId]=\"customerId\"></tk-user-template-step>\n </div>\n </mat-step>\n\n <mat-step>\n <div class=\"step-title\">Step 2 : User details</div>\n <ng-template matStepLabel>User details</ng-template>\n\n <div class=\"move-user-tab-content-box\">\n <tk-user-details-step></tk-user-details-step>\n </div>\n </mat-step>\n\n <mat-step>\n <div class=\"step-title\">Step 3: Review</div>\n <ng-template matStepLabel>Review</ng-template>\n\n <div class=\"move-user-tab-content-box\">\n <tk-user-overview-step></tk-user-overview-step>\n </div>\n </mat-step>\n </mat-stepper>\n\n <div class=\"wizard-actions\">\n <ng-container [ngSwitch]=\"stepper.selectedIndex\">\n <ng-container *ngSwitchCase=\"0\">\n <button mat-button class=\"uc-btn uc-btn-primary\" type=\"button\" (click)=\"stepper.next()\">\n Next\n </button>\n <button mat-button class=\"uc-btn uc-btn-secondary\" type=\"button\" (click)=\"onCancel()\">\n Cancel\n </button>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"1\">\n <button mat-button class=\"uc-btn uc-btn-primary\" type=\"button\" (click)=\"stepper.next()\">\n Next\n </button>\n <button mat-button class=\"uc-btn uc-btn-secondary\" type=\"button\" (click)=\"stepper.previous()\">\n Previous\n </button>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"2\">\n <button\n mat-button\n class=\"uc-btn uc-btn-primary\"\n type=\"button\"\n [disabled]=\"isSubmitting\"\n (click)=\"onSubmit()\"\n >\n <span class=\"uc-btn__inline-content\">\n <span class=\"uc-btn__spinner\" *ngIf=\"isSubmitting\" aria-hidden=\"true\"></span>\n <span>{{ isSubmitting ? 'Creating...' : 'Create' }}</span>\n </span>\n </button>\n <button\n mat-button\n class=\"uc-btn uc-btn-secondary\"\n type=\"button\"\n [disabled]=\"isSubmitting\"\n (click)=\"stepper.previous()\"\n >\n Previous\n </button>\n </ng-container>\n </ng-container>\n </div>\n </div>\n\n <div class=\"wizard-loading-overlay\" [class.wizard-loading-overlay--visible]=\"isSubmitting\" aria-hidden=\"true\"></div>\n</div>\n", styles: [".move-user-stepper-container{background-color:#f3f3f3;padding:0 0 16px;position:relative;overflow:hidden}.move-user-header{background-color:#1170cf;height:45px;padding:1rem 1.5rem;display:flex;align-items:center;justify-content:space-between;color:#fff;font-size:18px;font-weight:500}.move-user-header__close{cursor:pointer;display:flex;align-items:center;justify-content:center;line-height:0}.move-user-header__close i{font-size:25px;font-weight:100}.app-icon{height:20px;width:20px;display:block;cursor:pointer;background-repeat:no-repeat;background-position:center}.user-creation-close-icon{background-image:url(\"data:image/svg+xml,%3Csvg width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M13.0606 11.9998L19.2803 5.78001C19.35 5.71038 19.4052 5.6277 19.4429 5.53672C19.4806 5.44573 19.5 5.34822 19.5 5.24974C19.5 5.15126 19.4806 5.05374 19.4429 4.96276C19.4052 4.87177 19.3499 4.7891 19.2803 4.71947C19.2107 4.64983 19.128 4.5946 19.037 4.55691C18.946 4.51923 18.8485 4.49983 18.75 4.49983C18.6515 4.49984 18.554 4.51924 18.463 4.55692C18.3721 4.59461 18.2894 4.64985 18.2198 4.71949L12 10.9392L5.78026 4.71949C5.71077 4.64921 5.62807 4.59335 5.53691 4.55514C5.44576 4.51692 5.34795 4.49711 5.24911 4.49683C5.15027 4.49655 5.05235 4.51581 4.96098 4.55351C4.86961 4.59121 4.78659 4.64659 4.7167 4.71648C4.64681 4.78638 4.59143 4.8694 4.55374 4.96077C4.51605 5.05214 4.49679 5.15006 4.49707 5.2489C4.49736 5.34774 4.51718 5.44555 4.5554 5.5367C4.59361 5.62786 4.64947 5.71055 4.71976 5.78004L10.9395 11.9998L4.71976 18.2195C4.65013 18.2892 4.59489 18.3718 4.5572 18.4628C4.51951 18.5538 4.50011 18.6513 4.50011 18.7498C4.50011 18.8483 4.51951 18.9458 4.5572 19.0368C4.59488 19.1278 4.65012 19.2105 4.71976 19.2801C4.7894 19.3497 4.87207 19.405 4.96305 19.4427C5.05403 19.4803 5.15155 19.4997 5.25003 19.4997C5.34851 19.4997 5.44603 19.4803 5.53701 19.4427C5.628 19.405 5.71067 19.3497 5.78031 19.2801L12.0001 13.0603L18.2198 19.2801C18.3604 19.4207 18.5512 19.4997 18.7501 19.4997C18.949 19.4997 19.1397 19.4207 19.2804 19.2801C19.421 19.1395 19.5 18.9487 19.5 18.7498C19.5 18.5509 19.421 18.3602 19.2804 18.2195L13.0606 11.9998Z%22 fill%3D%22white%22 fill-opacity%3D%220.95%22%2F%3E%3C%2Fsvg%3E\");background-size:20px 20px}#user-creation-stepper{display:flex;flex-direction:column;width:100%}#user-creation-stepper .mat-stepper-horizontal{margin:0 auto;width:100%;background-color:transparent}#user-creation-stepper .mat-horizontal-stepper-header-container{margin:0 auto;width:800px}#user-creation-stepper .mat-step-icon{width:28px;height:28px;border:3px solid hsl(0,0%,50.2%)}#user-creation-stepper .mat-step-icon-selected{background-color:#c6c6c6!important;border-color:#19487d}#user-creation-stepper .mat-step-icon-state-number{background-color:#fff}#user-creation-stepper .mat-step-icon-state-edit,#user-creation-stepper .mat-step-header .mat-step-icon-state-done{background-color:#1170cf;border-color:#1170cf}#user-creation-stepper .mat-step-icon-content{display:none}#user-creation-stepper .mat-stepper-label-position-bottom .mat-horizontal-stepper-header:not(:first-child):before,#user-creation-stepper [dir=rtl] .mat-stepper-label-position-bottom .mat-horizontal-stepper-header:not(:last-child):before,#user-creation-stepper .mat-stepper-label-position-bottom .mat-horizontal-stepper-header:not(:last-child):after,#user-creation-stepper [dir=rtl] .mat-stepper-label-position-bottom .mat-horizontal-stepper-header:not(:first-child):after{border-top-width:3px!important}#user-creation-stepper .mat-horizontal-stepper-header:before,#user-creation-stepper .mat-horizontal-stepper-header:after,#user-creation-stepper .mat-stepper-horizontal-line{border-top-color:#1170cf!important;border-top-width:3px!important;border-top-style:solid!important}#user-creation-stepper .mat-horizontal-stepper-header[aria-selected=true]~.mat-stepper-horizontal-line,#user-creation-stepper .mat-horizontal-stepper-header[aria-selected=true]~.mat-horizontal-stepper-header:before,#user-creation-stepper .mat-horizontal-stepper-header[aria-selected=true]~.mat-horizontal-stepper-header:after{border-top-width:3px!important;background-color:#7b7b7b!important;border-top-color:#7b7b7b!important}#user-creation-stepper .mat-horizontal-content-container{padding:0!important;margin-top:3rem}#user-creation-stepper .mat-horizontal-stepper-content[aria-expanded=true]{padding-bottom:0}.step-title{font-size:26px;font-weight:500;width:70%;margin:0 auto 1rem;min-height:32px;display:flex;align-items:center}.wizard-actions{display:flex;flex-flow:row-reverse;justify-content:flex-start;align-items:center;margin:16px 16px 0 0;align-self:flex-end;gap:1rem;position:relative;z-index:30}.uc-btn{border-radius:50px!important;padding:8px 16px!important;min-width:80px!important;line-height:normal!important;cursor:pointer}.uc-btn__inline-content{display:inline-flex;align-items:center;gap:8px}.uc-btn__spinner{width:14px;height:14px;border:2px solid rgba(255,255,255,.5);border-top-color:#fff;border-radius:50%;animation:uc-btn-spin .7s linear infinite}@keyframes uc-btn-spin{to{transform:rotate(360deg)}}.uc-btn-primary{background-color:#000!important;color:#fff!important;border:1px solid black!important}.uc-btn-secondary{background-color:#fff!important;color:#000!important;border:1px solid black!important}.move-user-tab-content-box{width:70%;margin:0 auto;background-color:#fff;min-height:350px;border:1px solid #C3C1C1;border-radius:8px;box-sizing:border-box;padding:25px}.wizard-loading-overlay{position:absolute;inset:0;background:rgba(243,243,243,.72);backdrop-filter:blur(1px);opacity:0;pointer-events:none;transition:opacity .18s ease;z-index:20}.wizard-loading-overlay--visible{opacity:1;pointer-events:auto}.mat-button-disabled{background-color:#bbb;color:#fff;border:1px solid grey;cursor:default!important}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i2.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: i4.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i4$1.MatStep, selector: "mat-step", inputs: ["color"], exportAs: ["matStep"] }, { kind: "directive", type: i4$1.MatStepLabel, selector: "[matStepLabel]" }, { kind: "component", type: i4$1.MatStepper, selector: "mat-stepper, mat-vertical-stepper, mat-horizontal-stepper, [matStepper]", inputs: ["selectedIndex", "disableRipple", "color", "labelPosition", "headerPosition", "animationDuration"], outputs: ["animationDone"], exportAs: ["matStepper", "matVerticalStepper", "matHorizontalStepper"] }, { kind: "component", type: UserTemplateStepComponent, selector: "tk-user-template-step", inputs: ["customerId"] }, { kind: "component", type: UserDetailsStepComponent, selector: "tk-user-details-step" }, { kind: "component", type: UserOverviewStepComponent, selector: "tk-user-overview-step" }], encapsulation: i0.ViewEncapsulation.None });
|
|
907
1009
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: UserCreationWizardComponent, decorators: [{
|
|
908
1010
|
type: Component,
|
|
909
1011
|
args: [{ selector: 'tk-user-creation-wizard', encapsulation: ViewEncapsulation.None, template: "<div class=\"move-user-stepper-container\" [attr.aria-busy]=\"isSubmitting\">\n <header class=\"move-user-header\">\n <div class=\"move-user-header__title\">{{ title }}</div>\n <div class=\"move-user-header__close\">\n <span class=\"app-icon user-creation-close-icon\" (click)=\"onCancel()\"></span>\n </div>\n </header>\n\n <div id=\"user-creation-stepper\">\n <mat-stepper [linear]=\"false\" labelPosition=\"bottom\" #stepper>\n <mat-step>\n <div class=\"step-title\">Step 1: User creation with template</div>\n <ng-template matStepLabel>User creation</ng-template>\n\n <div class=\"move-user-tab-content-box\">\n <tk-user-template-step [customerId]=\"customerId\"></tk-user-template-step>\n </div>\n </mat-step>\n\n <mat-step>\n <div class=\"step-title\">Step 2 : User details</div>\n <ng-template matStepLabel>User details</ng-template>\n\n <div class=\"move-user-tab-content-box\">\n <tk-user-details-step></tk-user-details-step>\n </div>\n </mat-step>\n\n <mat-step>\n <div class=\"step-title\">Step 3: Review</div>\n <ng-template matStepLabel>Review</ng-template>\n\n <div class=\"move-user-tab-content-box\">\n <tk-user-overview-step></tk-user-overview-step>\n </div>\n </mat-step>\n </mat-stepper>\n\n <div class=\"wizard-actions\">\n <ng-container [ngSwitch]=\"stepper.selectedIndex\">\n <ng-container *ngSwitchCase=\"0\">\n <button mat-button class=\"uc-btn uc-btn-primary\" type=\"button\" (click)=\"stepper.next()\">\n Next\n </button>\n <button mat-button class=\"uc-btn uc-btn-secondary\" type=\"button\" (click)=\"onCancel()\">\n Cancel\n </button>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"1\">\n <button mat-button class=\"uc-btn uc-btn-primary\" type=\"button\" (click)=\"stepper.next()\">\n Next\n </button>\n <button mat-button class=\"uc-btn uc-btn-secondary\" type=\"button\" (click)=\"stepper.previous()\">\n Previous\n </button>\n </ng-container>\n\n <ng-container *ngSwitchCase=\"2\">\n <button\n mat-button\n class=\"uc-btn uc-btn-primary\"\n type=\"button\"\n [disabled]=\"isSubmitting\"\n (click)=\"onSubmit()\"\n >\n <span class=\"uc-btn__inline-content\">\n <span class=\"uc-btn__spinner\" *ngIf=\"isSubmitting\" aria-hidden=\"true\"></span>\n <span>{{ isSubmitting ? 'Creating...' : 'Create' }}</span>\n </span>\n </button>\n <button\n mat-button\n class=\"uc-btn uc-btn-secondary\"\n type=\"button\"\n [disabled]=\"isSubmitting\"\n (click)=\"stepper.previous()\"\n >\n Previous\n </button>\n </ng-container>\n </ng-container>\n </div>\n </div>\n\n <div class=\"wizard-loading-overlay\" [class.wizard-loading-overlay--visible]=\"isSubmitting\" aria-hidden=\"true\"></div>\n</div>\n", styles: [".move-user-stepper-container{background-color:#f3f3f3;padding:0 0 16px;position:relative;overflow:hidden}.move-user-header{background-color:#1170cf;height:45px;padding:1rem 1.5rem;display:flex;align-items:center;justify-content:space-between;color:#fff;font-size:18px;font-weight:500}.move-user-header__close{cursor:pointer;display:flex;align-items:center;justify-content:center;line-height:0}.move-user-header__close i{font-size:25px;font-weight:100}.app-icon{height:20px;width:20px;display:block;cursor:pointer;background-repeat:no-repeat;background-position:center}.user-creation-close-icon{background-image:url(\"data:image/svg+xml,%3Csvg width%3D%2224%22 height%3D%2224%22 viewBox%3D%220 0 24 24%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M13.0606 11.9998L19.2803 5.78001C19.35 5.71038 19.4052 5.6277 19.4429 5.53672C19.4806 5.44573 19.5 5.34822 19.5 5.24974C19.5 5.15126 19.4806 5.05374 19.4429 4.96276C19.4052 4.87177 19.3499 4.7891 19.2803 4.71947C19.2107 4.64983 19.128 4.5946 19.037 4.55691C18.946 4.51923 18.8485 4.49983 18.75 4.49983C18.6515 4.49984 18.554 4.51924 18.463 4.55692C18.3721 4.59461 18.2894 4.64985 18.2198 4.71949L12 10.9392L5.78026 4.71949C5.71077 4.64921 5.62807 4.59335 5.53691 4.55514C5.44576 4.51692 5.34795 4.49711 5.24911 4.49683C5.15027 4.49655 5.05235 4.51581 4.96098 4.55351C4.86961 4.59121 4.78659 4.64659 4.7167 4.71648C4.64681 4.78638 4.59143 4.8694 4.55374 4.96077C4.51605 5.05214 4.49679 5.15006 4.49707 5.2489C4.49736 5.34774 4.51718 5.44555 4.5554 5.5367C4.59361 5.62786 4.64947 5.71055 4.71976 5.78004L10.9395 11.9998L4.71976 18.2195C4.65013 18.2892 4.59489 18.3718 4.5572 18.4628C4.51951 18.5538 4.50011 18.6513 4.50011 18.7498C4.50011 18.8483 4.51951 18.9458 4.5572 19.0368C4.59488 19.1278 4.65012 19.2105 4.71976 19.2801C4.7894 19.3497 4.87207 19.405 4.96305 19.4427C5.05403 19.4803 5.15155 19.4997 5.25003 19.4997C5.34851 19.4997 5.44603 19.4803 5.53701 19.4427C5.628 19.405 5.71067 19.3497 5.78031 19.2801L12.0001 13.0603L18.2198 19.2801C18.3604 19.4207 18.5512 19.4997 18.7501 19.4997C18.949 19.4997 19.1397 19.4207 19.2804 19.2801C19.421 19.1395 19.5 18.9487 19.5 18.7498C19.5 18.5509 19.421 18.3602 19.2804 18.2195L13.0606 11.9998Z%22 fill%3D%22white%22 fill-opacity%3D%220.95%22%2F%3E%3C%2Fsvg%3E\");background-size:20px 20px}#user-creation-stepper{display:flex;flex-direction:column;width:100%}#user-creation-stepper .mat-stepper-horizontal{margin:0 auto;width:100%;background-color:transparent}#user-creation-stepper .mat-horizontal-stepper-header-container{margin:0 auto;width:800px}#user-creation-stepper .mat-step-icon{width:28px;height:28px;border:3px solid hsl(0,0%,50.2%)}#user-creation-stepper .mat-step-icon-selected{background-color:#c6c6c6!important;border-color:#19487d}#user-creation-stepper .mat-step-icon-state-number{background-color:#fff}#user-creation-stepper .mat-step-icon-state-edit,#user-creation-stepper .mat-step-header .mat-step-icon-state-done{background-color:#1170cf;border-color:#1170cf}#user-creation-stepper .mat-step-icon-content{display:none}#user-creation-stepper .mat-stepper-label-position-bottom .mat-horizontal-stepper-header:not(:first-child):before,#user-creation-stepper [dir=rtl] .mat-stepper-label-position-bottom .mat-horizontal-stepper-header:not(:last-child):before,#user-creation-stepper .mat-stepper-label-position-bottom .mat-horizontal-stepper-header:not(:last-child):after,#user-creation-stepper [dir=rtl] .mat-stepper-label-position-bottom .mat-horizontal-stepper-header:not(:first-child):after{border-top-width:3px!important}#user-creation-stepper .mat-horizontal-stepper-header:before,#user-creation-stepper .mat-horizontal-stepper-header:after,#user-creation-stepper .mat-stepper-horizontal-line{border-top-color:#1170cf!important;border-top-width:3px!important;border-top-style:solid!important}#user-creation-stepper .mat-horizontal-stepper-header[aria-selected=true]~.mat-stepper-horizontal-line,#user-creation-stepper .mat-horizontal-stepper-header[aria-selected=true]~.mat-horizontal-stepper-header:before,#user-creation-stepper .mat-horizontal-stepper-header[aria-selected=true]~.mat-horizontal-stepper-header:after{border-top-width:3px!important;background-color:#7b7b7b!important;border-top-color:#7b7b7b!important}#user-creation-stepper .mat-horizontal-content-container{padding:0!important;margin-top:3rem}#user-creation-stepper .mat-horizontal-stepper-content[aria-expanded=true]{padding-bottom:0}.step-title{font-size:26px;font-weight:500;width:70%;margin:0 auto 1rem;min-height:32px;display:flex;align-items:center}.wizard-actions{display:flex;flex-flow:row-reverse;justify-content:flex-start;align-items:center;margin:16px 16px 0 0;align-self:flex-end;gap:1rem;position:relative;z-index:30}.uc-btn{border-radius:50px!important;padding:8px 16px!important;min-width:80px!important;line-height:normal!important;cursor:pointer}.uc-btn__inline-content{display:inline-flex;align-items:center;gap:8px}.uc-btn__spinner{width:14px;height:14px;border:2px solid rgba(255,255,255,.5);border-top-color:#fff;border-radius:50%;animation:uc-btn-spin .7s linear infinite}@keyframes uc-btn-spin{to{transform:rotate(360deg)}}.uc-btn-primary{background-color:#000!important;color:#fff!important;border:1px solid black!important}.uc-btn-secondary{background-color:#fff!important;color:#000!important;border:1px solid black!important}.move-user-tab-content-box{width:70%;margin:0 auto;background-color:#fff;min-height:350px;border:1px solid #C3C1C1;border-radius:8px;box-sizing:border-box;padding:25px}.wizard-loading-overlay{position:absolute;inset:0;background:rgba(243,243,243,.72);backdrop-filter:blur(1px);opacity:0;pointer-events:none;transition:opacity .18s ease;z-index:20}.wizard-loading-overlay--visible{opacity:1;pointer-events:auto}.mat-button-disabled{background-color:#bbb;color:#fff;border:1px solid grey;cursor:default!important}\n"] }]
|
|
910
|
-
}], propDecorators: { title: [{
|
|
1012
|
+
}], ctorParameters: function () { return [{ type: NotificationService }]; }, propDecorators: { title: [{
|
|
911
1013
|
type: Input
|
|
912
1014
|
}], host: [{
|
|
913
1015
|
type: Input
|
|
@@ -921,11 +1023,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
921
1023
|
type: Output
|
|
922
1024
|
}] } });
|
|
923
1025
|
|
|
1026
|
+
// import { NotificationsComponent } from "./shared/components/notification/notification.component";
|
|
924
1027
|
class UserCreationModule {
|
|
925
1028
|
}
|
|
926
1029
|
UserCreationModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: UserCreationModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
927
1030
|
UserCreationModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.2.10", ngImport: i0, type: UserCreationModule, declarations: [UserCreationWizardComponent,
|
|
928
1031
|
UserTemplateStepComponent,
|
|
1032
|
+
// NotificationsComponent,
|
|
929
1033
|
UserDetailsStepComponent,
|
|
930
1034
|
UserOverviewStepComponent], imports: [CommonModule,
|
|
931
1035
|
SharedModule,
|
|
@@ -938,6 +1042,7 @@ UserCreationModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", vers
|
|
|
938
1042
|
UserCreationModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: UserCreationModule, providers: [
|
|
939
1043
|
UserCreationApiService,
|
|
940
1044
|
UserCreationWizardService,
|
|
1045
|
+
NotificationService,
|
|
941
1046
|
], imports: [CommonModule,
|
|
942
1047
|
SharedModule,
|
|
943
1048
|
MaterialModule,
|
|
@@ -952,6 +1057,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
952
1057
|
declarations: [
|
|
953
1058
|
UserCreationWizardComponent,
|
|
954
1059
|
UserTemplateStepComponent,
|
|
1060
|
+
// NotificationsComponent,
|
|
955
1061
|
UserDetailsStepComponent,
|
|
956
1062
|
UserOverviewStepComponent
|
|
957
1063
|
],
|
|
@@ -971,6 +1077,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
971
1077
|
providers: [
|
|
972
1078
|
UserCreationApiService,
|
|
973
1079
|
UserCreationWizardService,
|
|
1080
|
+
NotificationService,
|
|
974
1081
|
]
|
|
975
1082
|
}]
|
|
976
1083
|
}] });
|