tango-app-ui-manage-users 3.7.1-alpha.0 → 3.7.1-alpha.0-test
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/esm2022/lib/components/tango-manage-users/brand-user/brand-user.component.mjs +20 -3
- package/esm2022/lib/components-v2/add-users/add-users.component.mjs +21 -5
- package/fesm2022/tango-app-ui-manage-users.mjs +38 -7
- package/fesm2022/tango-app-ui-manage-users.mjs.map +1 -1
- package/lib/components/tango-manage-users/brand-user/brand-user.component.d.ts +1 -0
- package/lib/components-v2/add-users/add-users.component.d.ts +1 -0
- package/package.json +1 -1
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Injectable,
|
|
2
|
+
import { Injectable, Component, Input, EventEmitter, ChangeDetectionStrategy, HostListener, Output, ViewChild, NgModule } from '@angular/core';
|
|
3
3
|
import * as i6 from '@angular/common';
|
|
4
4
|
import { CommonModule } from '@angular/common';
|
|
5
5
|
import * as i3 from '@angular/router';
|
|
@@ -16,6 +16,7 @@ import * as i1 from '@angular/common/http';
|
|
|
16
16
|
import * as i2 from 'tango-app-ui-global';
|
|
17
17
|
import * as i4 from 'tango-app-ui-shared';
|
|
18
18
|
import { CommonSharedModule } from 'tango-app-ui-shared';
|
|
19
|
+
import * as CryptoJS from 'crypto-js';
|
|
19
20
|
import * as FileSaver from 'file-saver';
|
|
20
21
|
import { NgxPaginationModule } from 'ngx-pagination';
|
|
21
22
|
|
|
@@ -497,6 +498,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
497
498
|
type: Output
|
|
498
499
|
}] } });
|
|
499
500
|
|
|
501
|
+
const SECRET_KEY$1 = CryptoJS.enc.Utf8.parse(CryptoJS.SHA256("t@ng0-ret@il-@pi-v3")
|
|
502
|
+
.toString(CryptoJS.enc.Base64)
|
|
503
|
+
.substring(0, 32));
|
|
500
504
|
class AddUsersComponent {
|
|
501
505
|
service;
|
|
502
506
|
cd;
|
|
@@ -572,8 +576,20 @@ class AddUsersComponent {
|
|
|
572
576
|
this.destroy.next(false);
|
|
573
577
|
this.destroy.complete();
|
|
574
578
|
}
|
|
579
|
+
// must match backend
|
|
580
|
+
decrypt(encryptedText) {
|
|
581
|
+
const [ivHex, encrypted] = encryptedText.split(':');
|
|
582
|
+
const iv = CryptoJS.enc.Hex.parse(ivHex);
|
|
583
|
+
const ciphertext = CryptoJS.enc.Hex.parse(encrypted);
|
|
584
|
+
const cipherParams = CryptoJS.lib.CipherParams.create({ ciphertext });
|
|
585
|
+
const decrypted = CryptoJS.AES.decrypt(cipherParams, SECRET_KEY$1, {
|
|
586
|
+
iv: iv,
|
|
587
|
+
mode: CryptoJS.mode.CBC,
|
|
588
|
+
padding: CryptoJS.pad.Pkcs7
|
|
589
|
+
});
|
|
590
|
+
return decrypted.toString(CryptoJS.enc.Utf8);
|
|
591
|
+
}
|
|
575
592
|
ngOnInit() {
|
|
576
|
-
// console.log(this.type)
|
|
577
593
|
let data;
|
|
578
594
|
if ("header-filters" in localStorage) {
|
|
579
595
|
data = JSON.parse(localStorage.getItem('header-filters') || '');
|
|
@@ -671,7 +687,7 @@ class AddUsersComponent {
|
|
|
671
687
|
return `${first2}${maskedMiddle}${last2}`;
|
|
672
688
|
}
|
|
673
689
|
loadUserForm() {
|
|
674
|
-
this.userService.getUser(this.user.
|
|
690
|
+
this.userService.getUser(this.decrypt(this.user.encryptedEmail)).pipe(takeUntil(this.destroy$)).subscribe({
|
|
675
691
|
next: (res) => {
|
|
676
692
|
if (res && res.code == 200 && res.data.result) {
|
|
677
693
|
const userData = res.data.result;
|
|
@@ -1110,11 +1126,11 @@ class AddUsersComponent {
|
|
|
1110
1126
|
event.preventDefault();
|
|
1111
1127
|
}
|
|
1112
1128
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AddUsersComponent, deps: [{ token: ManageUsersService }, { token: i0.ChangeDetectorRef }, { token: i1$1.NgbActiveModal }, { token: i3$1.FormBuilder }, { token: UserService }, { token: i4.ToastService }, { token: i2.GlobalStateService }, { token: i1$1.NgbModal }], target: i0.ɵɵFactoryTarget.Component });
|
|
1113
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: AddUsersComponent, selector: "lib-add-users", inputs: { type: "type", user: "user", userType: "userType", data: "data" }, ngImport: i0, template: "<div class=\"card pt-0 pb-3 scroll\">\r\n <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"my-5 d-flex\">\r\n <div class=\"symbol symbol-75px symbol-circle\">\r\n <img alt=\"Pic\" src=\"./assets/tango/Icons/add-store-icon.svg\">\r\n </div>\r\n \r\n </div>\r\n <div class=\"row w-100\">\r\n <div *ngIf=\"type!=='view' && type!=='edit'\" class=\"col-md-12\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Add\r\n User</a>\r\n <div class=\"sub-title\">Please add your user details</div>\r\n </div>\r\n <div *ngIf=\"type==='view' && type !=='edit'\" class=\"col-md-9\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">User Details</a>\r\n <div class=\"sub-title\">View your user details</div>\r\n </div>\r\n <ng-container *ngIf=\"operationType!=='view'\">\r\n <div *ngIf=\"(gs.userAccess |async)?.Global_User_isEdit && type ==='view' && type !=='edit' && user?.role !== 'superadmin' && user?.isActive == true\" class=\"col-md-3 text-end px-0\" (click)=\"editUser()\">\r\n <button class=\"btn btn-outline\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"\r\n viewBox=\"0 0 20 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_3833_85908)\">\r\n <path\r\n d=\"M9.16602 3.3332H3.33268C2.89065 3.3332 2.46673 3.50879 2.15417 3.82135C1.84161 4.13391 1.66602 4.55784 1.66602 4.99986V16.6665C1.66602 17.1086 1.84161 17.5325 2.15417 17.845C2.46673 18.1576 2.89065 18.3332 3.33268 18.3332H14.9993C15.4414 18.3332 15.8653 18.1576 16.1779 17.845C16.4904 17.5325 16.666 17.1086 16.666 16.6665V10.8332M15.416 2.0832C15.7475 1.75168 16.1972 1.56543 16.666 1.56543C17.1349 1.56543 17.5845 1.75168 17.916 2.0832C18.2475 2.41472 18.4338 2.86436 18.4338 3.3332C18.4338 3.80204 18.2475 4.25168 17.916 4.5832L9.99935 12.4999L6.66602 13.3332L7.49935 9.99986L15.416 2.0832Z\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3833_85908\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg></button>\r\n </div>\r\n </ng-container>\r\n <div *ngIf=\"type==='edit' && type !=='view'\" class=\"col-md-9\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">User Details</a>\r\n <div class=\"sub-title\">Edit your user details</div>\r\n </div>\r\n <div class=\"w-100 h-0px scroll\">\r\n <div class=\"mt-5\" *ngIf=\"userForm\">\r\n <form [formGroup]=\"userForm\" novalidate=\"novalidate\" (keydown.enter)=\"preventClose($event)\" class=\"\">\r\n <div class=\"row px-0 me-3\">\r\n <!-- User Name Field -->\r\n <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n <label for=\"username\" class=\"form-label\">User Name <span class=\"alert-required text-danger\">*</span></label>\r\n <input type=\"text\" class=\"form-control\" id=\"username\" formControlName=\"userName\" autocomplete=\"off\" (keypress)=\"omitSpecialChar($event)\" (paste)=\"omitSpecialCharPaste($event)\">\r\n <div *ngIf=\"userForm.get('userName')?.invalid && (userForm.get('userName')?.dirty)\" class=\"text-danger\">\r\n <small *ngIf=\"userForm.get('userName')?.errors?.['required']\">User Name is required.</small>\r\n </div>\r\n </div>\r\n \r\n <!-- Email Field -->\r\n <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n <label for=\"email\" class=\"form-label\">Email <span class=\"alert-required text-danger\">*</span></label>\r\n <input type=\"email\" class=\"form-control\" id=\"email\" formControlName=\"email\" autocomplete=\"off\">\r\n <div *ngIf=\"userForm.get('email')?.invalid && userForm.get('email')?.touched\" class=\"text-danger\">\r\n <small *ngIf=\"userForm.get('email')?.errors?.['required']\">Email is required.</small>\r\n <small *ngIf=\"userForm.get('email')?.errors?.['pattern']\">Invalid email format.</small>\r\n </div>\r\n </div>\r\n \r\n <!-- Contact Number Field -->\r\n <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n <label for=\"contact\" class=\"form-label\">Contact Number <span class=\"alert-required text-danger\">*</span></label>\r\n <div class=\"row\">\r\n <div class=\"col-md-12 col-lg-4 col-xl-4\">\r\n <select class=\"form-select ps-3 pe-8\" id=\"inputGroupSelect01\" formControlName=\"countryCode\">\r\n <option *ngFor=\"let country of countryList\" [value]=\"country.phonecode\">\r\n {{country.name}} ({{country.phonecode}})\r\n </option>\r\n </select>\r\n </div>\r\n <div class=\"col-md-12 col-lg-8 col-xl-8\">\r\n <input type=\"text\" class=\"form-control\" (keypress)=\"omit_special_char($event)\"\r\n id=\"mobileNumber\" autocomplete=\"off\" formControlName=\"mobileNumber\" minlength=\"8\" maxlength=\"13\">\r\n <div *ngIf=\"userForm.get('mobileNumber')?.invalid && userForm.get('mobileNumber')?.touched\" class=\"text-danger\">\r\n <small *ngIf=\"userForm.get('mobileNumber')?.errors?.['required']\">Contact Number is required.</small>\r\n <small *ngIf=\"userForm.get('mobileNumber')?.errors?.['minlength']\">Contact Number must be at least 8 digits.</small>\r\n <small *ngIf=\"userForm.get('mobileNumber')?.errors?.['maxlength']\">Contact Number cannot exceed 13 digits.</small>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n \r\n <!-- Role Field -->\r\n <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n <label for=\"role\" class=\"form-label\">Role <span class=\"alert-required text-danger\">*</span></label>\r\n <select class=\"form-select\" formControlName=\"role\" (change)=\"onRoleChange(userForm.get('role')?.value)\">\r\n <option value=\"admin\">Admin</option>\r\n <option value=\"user\">User</option>\r\n </select>\r\n <div *ngIf=\"userForm.get('role')?.invalid && userForm.get('role')?.touched\" class=\"text-danger\">\r\n <small *ngIf=\"userForm.get('role')?.errors?.['required']\">Role is required.</small>\r\n </div>\r\n </div>\r\n \r\n <!-- Add to Team Field -->\r\n <div class=\"col-md-12 col-lg-12 col-xl-12 col-xxl-12 mb-5\" *ngIf=\"this.userType !=='tango'\">\r\n <label for=\"teamLead\" class=\"form-label teams-title\">Add to a team</label>\r\n <team-select [items]=\"teamList\" [multi]=\"true\" [searchField]=\"'teamName'\" [idField]=\"'_id'\" [disabled]=\"type === 'view' ? true : false\"\r\n (selected)=\"onStoreSelect($event)\" [selectedValues]=\"selectedUser\"></team-select>\r\n </div>\r\n </div>\r\n \r\n <div *ngIf=\"userForm.get('role')?.value === 'admin'\">\r\n\r\n <h3 class=\"teams-title\" *ngIf=\"getPermissions().length\">Access for Admin</h3>\r\n <ng-container *ngIf=\"getPermissions().length\">\r\n <ng-container formArrayName=\"rolespermission\">\r\n <ng-container *ngFor=\"let rolespermission of getPermissions().controls; let i = index\" [formGroupName]=\"i\">\r\n <div class=\"table-responsive my-2 me-3\">\r\n <div class=\"row w-100\">\r\n <div class=\"title-header mt-4 ms-2\">\r\n {{ camelCaseToText(rolespermission.get('featureName')?.value) }}\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"rolespermission.get('modules')\" formArrayName=\"modules\">\r\n <ng-container *ngFor=\"let modules of getFeaturePermissions(rolespermission)?.controls; let j = index\" [formGroupName]=\"j\">\r\n <table class=\"w-100\">\r\n <tbody>\r\n <tr *ngIf=\"rolespermission.get('featureName')?.value !== 'TangoAdmin'\">\r\n <td class=\"w-50\">{{ camelCaseToText(modules.get('name')?.value) }}</td>\r\n <td class=\"text-start\">\r\n <div class=\"d-inline-flex align-items-center\">\r\n <input type=\"checkbox\" formControlName=\"isAdd\" class=\"cursor-pointer\" (change)=\"handleViewChange(modules)\">\r\n <label class=\"global-label ms-2 mt-auto\">Add</label>\r\n </div>\r\n </td>\r\n <td class=\"text-start\">\r\n <div class=\"d-inline-flex align-items-center\">\r\n <input formControlName=\"isEdit\" type=\"checkbox\" class=\"cursor-pointer\" (change)=\"handleEditChange(modules)\">\r\n <label class=\"global-label ms-2 mt-auto\">Edit</label>\r\n </div>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </ng-container>\r\n <div *ngIf=\"rolespermission.get('featureName')?.value === 'TangoAdmin'\" class=\"row w-100 text-nowrap\">\r\n <div class=\"col-md-4\" *ngFor=\"let modules of getFeaturePermissions(rolespermission)?.controls; let j = index\" [formGroupName]=\"j\">\r\n <div class=\"d-inline-flex mt-3\">\r\n <input type=\"checkbox\" class=\"cursor-pointer\" formControlName=\"isEdit\">\r\n <label class=\"global-label mb-5 mx-2 mt-1\" style=\"text-wrap:nowrap\">\r\n {{ camelCaseToText(modules.get('name')?.value) }}\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n \r\n </div>\r\n <div *ngIf=\"type!=='view'\" class=\"d-flex my-10\" role=\"group\">\r\n <button class=\"btn btn-outline w-100 me-3\" (click)=\"cancel()\">Cancel</button>\r\n <button class=\"btn btn-primary w-100 ms-3\" id=\"alert-toast\"\r\n (click)=\"onSubmit()\" [disabled]=\"userForm.invalid || type === 'view'\">Submit</button>\r\n </div>\r\n </form>\r\n </div>\r\n </div>\r\n </div>\r\n </div>", styles: [".scroll{overflow-y:auto;overflow-x:hidden}.title{color:var(--Gray-900, #101828)!important;font-size:18px!important;font-weight:600;line-height:28px}.sub-title{color:var(--Gray-500, #667085)!important;font-size:14px!important;font-weight:400!important;line-height:20px}.teams-title{color:var(--Black, #101828)!important;font-size:18px!important;font-weight:600!important;line-height:28px}.title-header{border-radius:6px!important;border-bottom:2px solid var(--Gray-200, #EAECF0)!important;background:#f2f4f7!important;box-shadow:0 4px 10px #0000000d!important;color:var(--Black, #101828)!important;font-size:20px!important;font-weight:600;line-height:30px;padding:8px 16px}input[type=checkbox]{width:18px!important;height:18px!important;margin:5px;border-radius:4px!important;-webkit-appearance:none;-moz-appearance:none;-o-appearance:none;appearance:none;outline:1px solid var(--gray-300, #D0D5DD);box-shadow:none;font-size:.8em;text-align:center;line-height:1em;background:#fff}input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}input[type=checkbox]:checked:after{content:\"\";transform:rotate(45deg);border-bottom:2px solid #00A3FF;border-right:2px solid #00A3FF;display:inline-block;width:.5em;padding-left:0;padding-top:12px;padding-right:6px}.global-label{color:var(--Gray-700, #344054)!important;font-size:16px!important;font-weight:500;line-height:24px}.w-25{width:40%!important}td{color:var(--Black, #101828)!important;font-size:16px!important;font-weight:500!important;line-height:24px}tr,.add-team{border-bottom:1px solid var(--Gray-200, #EAECF0)!important}input[disabled]{pointer-events:none;opacity:.5}\n"], dependencies: [{ kind: "directive", type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3$1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i3$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { 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.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i3$1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { 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: "directive", type: i3$1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i3$1.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "component", type: CustomSelectComponent, selector: "team-select", inputs: ["items", "searchField", "multi", "idField", "selectedValues", "disabled", "label"], outputs: ["selected", "deselected", "deselectedAll"] }, { kind: "pipe", type: i6.AsyncPipe, name: "async" }] });
|
|
1129
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: AddUsersComponent, selector: "lib-add-users", inputs: { type: "type", user: "user", userType: "userType", data: "data" }, ngImport: i0, template: "<div class=\"card pt-0 pb-3 scroll\">\r\n <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"my-5 d-flex\">\r\n <div class=\"symbol symbol-75px symbol-circle\">\r\n <img alt=\"Pic\" src=\"./assets/tango/Icons/add-store-icon.svg\">\r\n </div>\r\n \r\n </div>\r\n <div class=\"row w-100\">\r\n <div *ngIf=\"type!=='view' && type!=='edit'\" class=\"col-md-12\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Add\r\n User</a>\r\n <div class=\"sub-title\">Please add your user details</div>\r\n </div>\r\n <div *ngIf=\"type==='view' && type !=='edit'\" class=\"col-md-9\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">User Details</a>\r\n <div class=\"sub-title\">View your user details</div>\r\n </div>\r\n <ng-container *ngIf=\"operationType!=='view'\">\r\n <div *ngIf=\"(gs.userAccess |async)?.Global_User_isEdit && type ==='view' && type !=='edit' && user?.role !== 'superadmin' && user?.isActive === true\" class=\"col-md-3 text-end px-0\" (click)=\"editUser()\">\r\n <button class=\"btn btn-outline\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"\r\n viewBox=\"0 0 20 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_3833_85908)\">\r\n <path\r\n d=\"M9.16602 3.3332H3.33268C2.89065 3.3332 2.46673 3.50879 2.15417 3.82135C1.84161 4.13391 1.66602 4.55784 1.66602 4.99986V16.6665C1.66602 17.1086 1.84161 17.5325 2.15417 17.845C2.46673 18.1576 2.89065 18.3332 3.33268 18.3332H14.9993C15.4414 18.3332 15.8653 18.1576 16.1779 17.845C16.4904 17.5325 16.666 17.1086 16.666 16.6665V10.8332M15.416 2.0832C15.7475 1.75168 16.1972 1.56543 16.666 1.56543C17.1349 1.56543 17.5845 1.75168 17.916 2.0832C18.2475 2.41472 18.4338 2.86436 18.4338 3.3332C18.4338 3.80204 18.2475 4.25168 17.916 4.5832L9.99935 12.4999L6.66602 13.3332L7.49935 9.99986L15.416 2.0832Z\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3833_85908\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg></button>\r\n </div>\r\n </ng-container>\r\n <div *ngIf=\"type==='edit' && type !=='view'\" class=\"col-md-9\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">User Details</a>\r\n <div class=\"sub-title\">Edit your user details</div>\r\n </div>\r\n <div class=\"w-100 h-0px scroll\">\r\n <div class=\"mt-5\" *ngIf=\"userForm\">\r\n <form [formGroup]=\"userForm\" novalidate=\"novalidate\" (keydown.enter)=\"preventClose($event)\" class=\"\">\r\n <div class=\"row px-0 me-3\">\r\n <!-- User Name Field -->\r\n <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n <label for=\"username\" class=\"form-label\">User Name <span class=\"alert-required text-danger\">*</span></label>\r\n <input type=\"text\" class=\"form-control\" id=\"username\" formControlName=\"userName\" autocomplete=\"off\" (keypress)=\"omitSpecialChar($event)\" (paste)=\"omitSpecialCharPaste($event)\">\r\n <div *ngIf=\"userForm.get('userName')?.invalid && (userForm.get('userName')?.dirty)\" class=\"text-danger\">\r\n <small *ngIf=\"userForm.get('userName')?.errors?.['required']\">User Name is required.</small>\r\n </div>\r\n </div>\r\n \r\n <!-- Email Field -->\r\n <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n <label for=\"email\" class=\"form-label\">Email <span class=\"alert-required text-danger\">*</span></label>\r\n <input type=\"email\" class=\"form-control\" id=\"email\" formControlName=\"email\" autocomplete=\"off\">\r\n <div *ngIf=\"userForm.get('email')?.invalid && userForm.get('email')?.touched\" class=\"text-danger\">\r\n <small *ngIf=\"userForm.get('email')?.errors?.['required']\">Email is required.</small>\r\n <small *ngIf=\"userForm.get('email')?.errors?.['pattern']\">Invalid email format.</small>\r\n </div>\r\n </div>\r\n \r\n <!-- Contact Number Field -->\r\n <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n <label for=\"contact\" class=\"form-label\">Contact Number <span class=\"alert-required text-danger\">*</span></label>\r\n <div class=\"row\">\r\n <div class=\"col-md-12 col-lg-4 col-xl-4\">\r\n <select class=\"form-select ps-3 pe-8\" id=\"inputGroupSelect01\" formControlName=\"countryCode\">\r\n <option *ngFor=\"let country of countryList\" [value]=\"country.phonecode\">\r\n {{country.name}} ({{country.phonecode}})\r\n </option>\r\n </select>\r\n </div>\r\n <div class=\"col-md-12 col-lg-8 col-xl-8\">\r\n <input type=\"text\" class=\"form-control\" (keypress)=\"omit_special_char($event)\"\r\n id=\"mobileNumber\" autocomplete=\"off\" formControlName=\"mobileNumber\" minlength=\"8\" maxlength=\"13\">\r\n <div *ngIf=\"userForm.get('mobileNumber')?.invalid && userForm.get('mobileNumber')?.touched\" class=\"text-danger\">\r\n <small *ngIf=\"userForm.get('mobileNumber')?.errors?.['required']\">Contact Number is required.</small>\r\n <small *ngIf=\"userForm.get('mobileNumber')?.errors?.['minlength']\">Contact Number must be at least 8 digits.</small>\r\n <small *ngIf=\"userForm.get('mobileNumber')?.errors?.['maxlength']\">Contact Number cannot exceed 13 digits.</small>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n \r\n <!-- Role Field -->\r\n <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n <label for=\"role\" class=\"form-label\">Role <span class=\"alert-required text-danger\">*</span></label>\r\n <select class=\"form-select\" formControlName=\"role\" (change)=\"onRoleChange(userForm.get('role')?.value)\">\r\n <option value=\"admin\">Admin</option>\r\n <option value=\"user\">User</option>\r\n </select>\r\n <div *ngIf=\"userForm.get('role')?.invalid && userForm.get('role')?.touched\" class=\"text-danger\">\r\n <small *ngIf=\"userForm.get('role')?.errors?.['required']\">Role is required.</small>\r\n </div>\r\n </div>\r\n \r\n <!-- Add to Team Field -->\r\n <div class=\"col-md-12 col-lg-12 col-xl-12 col-xxl-12 mb-5\" *ngIf=\"this.userType !=='tango'\">\r\n <label for=\"teamLead\" class=\"form-label teams-title\">Add to a team</label>\r\n <team-select [items]=\"teamList\" [multi]=\"true\" [searchField]=\"'teamName'\" [idField]=\"'_id'\" [disabled]=\"type === 'view' ? true : false\"\r\n (selected)=\"onStoreSelect($event)\" [selectedValues]=\"selectedUser\"></team-select>\r\n </div>\r\n </div>\r\n \r\n <div *ngIf=\"userForm.get('role')?.value === 'admin'\">\r\n\r\n <h3 class=\"teams-title\" *ngIf=\"getPermissions().length\">Access for Admin</h3>\r\n <ng-container *ngIf=\"getPermissions().length\">\r\n <ng-container formArrayName=\"rolespermission\">\r\n <ng-container *ngFor=\"let rolespermission of getPermissions().controls; let i = index\" [formGroupName]=\"i\">\r\n <div class=\"table-responsive my-2 me-3\">\r\n <div class=\"row w-100\">\r\n <div class=\"title-header mt-4 ms-2\">\r\n {{ camelCaseToText(rolespermission.get('featureName')?.value) }}\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"rolespermission.get('modules')\" formArrayName=\"modules\">\r\n <ng-container *ngFor=\"let modules of getFeaturePermissions(rolespermission)?.controls; let j = index\" [formGroupName]=\"j\">\r\n <table class=\"w-100\">\r\n <tbody>\r\n <tr *ngIf=\"rolespermission.get('featureName')?.value !== 'TangoAdmin'\">\r\n <td class=\"w-50\">{{ camelCaseToText(modules.get('name')?.value) }}</td>\r\n <td class=\"text-start\">\r\n <div class=\"d-inline-flex align-items-center\">\r\n <input type=\"checkbox\" formControlName=\"isAdd\" class=\"cursor-pointer\" (change)=\"handleViewChange(modules)\">\r\n <label class=\"global-label ms-2 mt-auto\">Add</label>\r\n </div>\r\n </td>\r\n <td class=\"text-start\">\r\n <div class=\"d-inline-flex align-items-center\">\r\n <input formControlName=\"isEdit\" type=\"checkbox\" class=\"cursor-pointer\" (change)=\"handleEditChange(modules)\">\r\n <label class=\"global-label ms-2 mt-auto\">Edit</label>\r\n </div>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </ng-container>\r\n <div *ngIf=\"rolespermission.get('featureName')?.value === 'TangoAdmin'\" class=\"row w-100 text-nowrap\">\r\n <div class=\"col-md-4\" *ngFor=\"let modules of getFeaturePermissions(rolespermission)?.controls; let j = index\" [formGroupName]=\"j\">\r\n <div class=\"d-inline-flex mt-3\">\r\n <input type=\"checkbox\" class=\"cursor-pointer\" formControlName=\"isEdit\">\r\n <label class=\"global-label mb-5 mx-2 mt-1\" style=\"text-wrap:nowrap\">\r\n {{ camelCaseToText(modules.get('name')?.value) }}\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n \r\n </div>\r\n <div *ngIf=\"type!=='view'\" class=\"d-flex my-10\" role=\"group\">\r\n <button class=\"btn btn-outline w-100 me-3\" (click)=\"cancel()\">Cancel</button>\r\n <button class=\"btn btn-primary w-100 ms-3\" id=\"alert-toast\"\r\n (click)=\"onSubmit()\" [disabled]=\"userForm.invalid || type === 'view'\">Submit</button>\r\n </div>\r\n </form>\r\n </div>\r\n </div>\r\n </div>\r\n </div>", styles: [".scroll{overflow-y:auto;overflow-x:hidden}.title{color:var(--Gray-900, #101828)!important;font-size:18px!important;font-weight:600;line-height:28px}.sub-title{color:var(--Gray-500, #667085)!important;font-size:14px!important;font-weight:400!important;line-height:20px}.teams-title{color:var(--Black, #101828)!important;font-size:18px!important;font-weight:600!important;line-height:28px}.title-header{border-radius:6px!important;border-bottom:2px solid var(--Gray-200, #EAECF0)!important;background:#f2f4f7!important;box-shadow:0 4px 10px #0000000d!important;color:var(--Black, #101828)!important;font-size:20px!important;font-weight:600;line-height:30px;padding:8px 16px}input[type=checkbox]{width:18px!important;height:18px!important;margin:5px;border-radius:4px!important;-webkit-appearance:none;-moz-appearance:none;-o-appearance:none;appearance:none;outline:1px solid var(--gray-300, #D0D5DD);box-shadow:none;font-size:.8em;text-align:center;line-height:1em;background:#fff}input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}input[type=checkbox]:checked:after{content:\"\";transform:rotate(45deg);border-bottom:2px solid #00A3FF;border-right:2px solid #00A3FF;display:inline-block;width:.5em;padding-left:0;padding-top:12px;padding-right:6px}.global-label{color:var(--Gray-700, #344054)!important;font-size:16px!important;font-weight:500;line-height:24px}.w-25{width:40%!important}td{color:var(--Black, #101828)!important;font-size:16px!important;font-weight:500!important;line-height:24px}tr,.add-team{border-bottom:1px solid var(--Gray-200, #EAECF0)!important}input[disabled]{pointer-events:none;opacity:.5}\n"], dependencies: [{ kind: "directive", type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3$1.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i3$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { 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.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i3$1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { 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: "directive", type: i3$1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i3$1.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "component", type: CustomSelectComponent, selector: "team-select", inputs: ["items", "searchField", "multi", "idField", "selectedValues", "disabled", "label"], outputs: ["selected", "deselected", "deselectedAll"] }, { kind: "pipe", type: i6.AsyncPipe, name: "async" }] });
|
|
1114
1130
|
}
|
|
1115
1131
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AddUsersComponent, decorators: [{
|
|
1116
1132
|
type: Component,
|
|
1117
|
-
args: [{ selector: 'lib-add-users', template: "<div class=\"card pt-0 pb-3 scroll\">\r\n <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"my-5 d-flex\">\r\n <div class=\"symbol symbol-75px symbol-circle\">\r\n <img alt=\"Pic\" src=\"./assets/tango/Icons/add-store-icon.svg\">\r\n </div>\r\n \r\n </div>\r\n <div class=\"row w-100\">\r\n <div *ngIf=\"type!=='view' && type!=='edit'\" class=\"col-md-12\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Add\r\n User</a>\r\n <div class=\"sub-title\">Please add your user details</div>\r\n </div>\r\n <div *ngIf=\"type==='view' && type !=='edit'\" class=\"col-md-9\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">User Details</a>\r\n <div class=\"sub-title\">View your user details</div>\r\n </div>\r\n <ng-container *ngIf=\"operationType!=='view'\">\r\n <div *ngIf=\"(gs.userAccess |async)?.Global_User_isEdit && type ==='view' && type !=='edit' && user?.role !== 'superadmin' && user?.isActive == true\" class=\"col-md-3 text-end px-0\" (click)=\"editUser()\">\r\n <button class=\"btn btn-outline\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"\r\n viewBox=\"0 0 20 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_3833_85908)\">\r\n <path\r\n d=\"M9.16602 3.3332H3.33268C2.89065 3.3332 2.46673 3.50879 2.15417 3.82135C1.84161 4.13391 1.66602 4.55784 1.66602 4.99986V16.6665C1.66602 17.1086 1.84161 17.5325 2.15417 17.845C2.46673 18.1576 2.89065 18.3332 3.33268 18.3332H14.9993C15.4414 18.3332 15.8653 18.1576 16.1779 17.845C16.4904 17.5325 16.666 17.1086 16.666 16.6665V10.8332M15.416 2.0832C15.7475 1.75168 16.1972 1.56543 16.666 1.56543C17.1349 1.56543 17.5845 1.75168 17.916 2.0832C18.2475 2.41472 18.4338 2.86436 18.4338 3.3332C18.4338 3.80204 18.2475 4.25168 17.916 4.5832L9.99935 12.4999L6.66602 13.3332L7.49935 9.99986L15.416 2.0832Z\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3833_85908\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg></button>\r\n </div>\r\n </ng-container>\r\n <div *ngIf=\"type==='edit' && type !=='view'\" class=\"col-md-9\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">User Details</a>\r\n <div class=\"sub-title\">Edit your user details</div>\r\n </div>\r\n <div class=\"w-100 h-0px scroll\">\r\n <div class=\"mt-5\" *ngIf=\"userForm\">\r\n <form [formGroup]=\"userForm\" novalidate=\"novalidate\" (keydown.enter)=\"preventClose($event)\" class=\"\">\r\n <div class=\"row px-0 me-3\">\r\n <!-- User Name Field -->\r\n <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n <label for=\"username\" class=\"form-label\">User Name <span class=\"alert-required text-danger\">*</span></label>\r\n <input type=\"text\" class=\"form-control\" id=\"username\" formControlName=\"userName\" autocomplete=\"off\" (keypress)=\"omitSpecialChar($event)\" (paste)=\"omitSpecialCharPaste($event)\">\r\n <div *ngIf=\"userForm.get('userName')?.invalid && (userForm.get('userName')?.dirty)\" class=\"text-danger\">\r\n <small *ngIf=\"userForm.get('userName')?.errors?.['required']\">User Name is required.</small>\r\n </div>\r\n </div>\r\n \r\n <!-- Email Field -->\r\n <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n <label for=\"email\" class=\"form-label\">Email <span class=\"alert-required text-danger\">*</span></label>\r\n <input type=\"email\" class=\"form-control\" id=\"email\" formControlName=\"email\" autocomplete=\"off\">\r\n <div *ngIf=\"userForm.get('email')?.invalid && userForm.get('email')?.touched\" class=\"text-danger\">\r\n <small *ngIf=\"userForm.get('email')?.errors?.['required']\">Email is required.</small>\r\n <small *ngIf=\"userForm.get('email')?.errors?.['pattern']\">Invalid email format.</small>\r\n </div>\r\n </div>\r\n \r\n <!-- Contact Number Field -->\r\n <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n <label for=\"contact\" class=\"form-label\">Contact Number <span class=\"alert-required text-danger\">*</span></label>\r\n <div class=\"row\">\r\n <div class=\"col-md-12 col-lg-4 col-xl-4\">\r\n <select class=\"form-select ps-3 pe-8\" id=\"inputGroupSelect01\" formControlName=\"countryCode\">\r\n <option *ngFor=\"let country of countryList\" [value]=\"country.phonecode\">\r\n {{country.name}} ({{country.phonecode}})\r\n </option>\r\n </select>\r\n </div>\r\n <div class=\"col-md-12 col-lg-8 col-xl-8\">\r\n <input type=\"text\" class=\"form-control\" (keypress)=\"omit_special_char($event)\"\r\n id=\"mobileNumber\" autocomplete=\"off\" formControlName=\"mobileNumber\" minlength=\"8\" maxlength=\"13\">\r\n <div *ngIf=\"userForm.get('mobileNumber')?.invalid && userForm.get('mobileNumber')?.touched\" class=\"text-danger\">\r\n <small *ngIf=\"userForm.get('mobileNumber')?.errors?.['required']\">Contact Number is required.</small>\r\n <small *ngIf=\"userForm.get('mobileNumber')?.errors?.['minlength']\">Contact Number must be at least 8 digits.</small>\r\n <small *ngIf=\"userForm.get('mobileNumber')?.errors?.['maxlength']\">Contact Number cannot exceed 13 digits.</small>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n \r\n <!-- Role Field -->\r\n <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n <label for=\"role\" class=\"form-label\">Role <span class=\"alert-required text-danger\">*</span></label>\r\n <select class=\"form-select\" formControlName=\"role\" (change)=\"onRoleChange(userForm.get('role')?.value)\">\r\n <option value=\"admin\">Admin</option>\r\n <option value=\"user\">User</option>\r\n </select>\r\n <div *ngIf=\"userForm.get('role')?.invalid && userForm.get('role')?.touched\" class=\"text-danger\">\r\n <small *ngIf=\"userForm.get('role')?.errors?.['required']\">Role is required.</small>\r\n </div>\r\n </div>\r\n \r\n <!-- Add to Team Field -->\r\n <div class=\"col-md-12 col-lg-12 col-xl-12 col-xxl-12 mb-5\" *ngIf=\"this.userType !=='tango'\">\r\n <label for=\"teamLead\" class=\"form-label teams-title\">Add to a team</label>\r\n <team-select [items]=\"teamList\" [multi]=\"true\" [searchField]=\"'teamName'\" [idField]=\"'_id'\" [disabled]=\"type === 'view' ? true : false\"\r\n (selected)=\"onStoreSelect($event)\" [selectedValues]=\"selectedUser\"></team-select>\r\n </div>\r\n </div>\r\n \r\n <div *ngIf=\"userForm.get('role')?.value === 'admin'\">\r\n\r\n <h3 class=\"teams-title\" *ngIf=\"getPermissions().length\">Access for Admin</h3>\r\n <ng-container *ngIf=\"getPermissions().length\">\r\n <ng-container formArrayName=\"rolespermission\">\r\n <ng-container *ngFor=\"let rolespermission of getPermissions().controls; let i = index\" [formGroupName]=\"i\">\r\n <div class=\"table-responsive my-2 me-3\">\r\n <div class=\"row w-100\">\r\n <div class=\"title-header mt-4 ms-2\">\r\n {{ camelCaseToText(rolespermission.get('featureName')?.value) }}\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"rolespermission.get('modules')\" formArrayName=\"modules\">\r\n <ng-container *ngFor=\"let modules of getFeaturePermissions(rolespermission)?.controls; let j = index\" [formGroupName]=\"j\">\r\n <table class=\"w-100\">\r\n <tbody>\r\n <tr *ngIf=\"rolespermission.get('featureName')?.value !== 'TangoAdmin'\">\r\n <td class=\"w-50\">{{ camelCaseToText(modules.get('name')?.value) }}</td>\r\n <td class=\"text-start\">\r\n <div class=\"d-inline-flex align-items-center\">\r\n <input type=\"checkbox\" formControlName=\"isAdd\" class=\"cursor-pointer\" (change)=\"handleViewChange(modules)\">\r\n <label class=\"global-label ms-2 mt-auto\">Add</label>\r\n </div>\r\n </td>\r\n <td class=\"text-start\">\r\n <div class=\"d-inline-flex align-items-center\">\r\n <input formControlName=\"isEdit\" type=\"checkbox\" class=\"cursor-pointer\" (change)=\"handleEditChange(modules)\">\r\n <label class=\"global-label ms-2 mt-auto\">Edit</label>\r\n </div>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </ng-container>\r\n <div *ngIf=\"rolespermission.get('featureName')?.value === 'TangoAdmin'\" class=\"row w-100 text-nowrap\">\r\n <div class=\"col-md-4\" *ngFor=\"let modules of getFeaturePermissions(rolespermission)?.controls; let j = index\" [formGroupName]=\"j\">\r\n <div class=\"d-inline-flex mt-3\">\r\n <input type=\"checkbox\" class=\"cursor-pointer\" formControlName=\"isEdit\">\r\n <label class=\"global-label mb-5 mx-2 mt-1\" style=\"text-wrap:nowrap\">\r\n {{ camelCaseToText(modules.get('name')?.value) }}\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n \r\n </div>\r\n <div *ngIf=\"type!=='view'\" class=\"d-flex my-10\" role=\"group\">\r\n <button class=\"btn btn-outline w-100 me-3\" (click)=\"cancel()\">Cancel</button>\r\n <button class=\"btn btn-primary w-100 ms-3\" id=\"alert-toast\"\r\n (click)=\"onSubmit()\" [disabled]=\"userForm.invalid || type === 'view'\">Submit</button>\r\n </div>\r\n </form>\r\n </div>\r\n </div>\r\n </div>\r\n </div>", styles: [".scroll{overflow-y:auto;overflow-x:hidden}.title{color:var(--Gray-900, #101828)!important;font-size:18px!important;font-weight:600;line-height:28px}.sub-title{color:var(--Gray-500, #667085)!important;font-size:14px!important;font-weight:400!important;line-height:20px}.teams-title{color:var(--Black, #101828)!important;font-size:18px!important;font-weight:600!important;line-height:28px}.title-header{border-radius:6px!important;border-bottom:2px solid var(--Gray-200, #EAECF0)!important;background:#f2f4f7!important;box-shadow:0 4px 10px #0000000d!important;color:var(--Black, #101828)!important;font-size:20px!important;font-weight:600;line-height:30px;padding:8px 16px}input[type=checkbox]{width:18px!important;height:18px!important;margin:5px;border-radius:4px!important;-webkit-appearance:none;-moz-appearance:none;-o-appearance:none;appearance:none;outline:1px solid var(--gray-300, #D0D5DD);box-shadow:none;font-size:.8em;text-align:center;line-height:1em;background:#fff}input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}input[type=checkbox]:checked:after{content:\"\";transform:rotate(45deg);border-bottom:2px solid #00A3FF;border-right:2px solid #00A3FF;display:inline-block;width:.5em;padding-left:0;padding-top:12px;padding-right:6px}.global-label{color:var(--Gray-700, #344054)!important;font-size:16px!important;font-weight:500;line-height:24px}.w-25{width:40%!important}td{color:var(--Black, #101828)!important;font-size:16px!important;font-weight:500!important;line-height:24px}tr,.add-team{border-bottom:1px solid var(--Gray-200, #EAECF0)!important}input[disabled]{pointer-events:none;opacity:.5}\n"] }]
|
|
1133
|
+
args: [{ selector: 'lib-add-users', template: "<div class=\"card pt-0 pb-3 scroll\">\r\n <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"my-5 d-flex\">\r\n <div class=\"symbol symbol-75px symbol-circle\">\r\n <img alt=\"Pic\" src=\"./assets/tango/Icons/add-store-icon.svg\">\r\n </div>\r\n \r\n </div>\r\n <div class=\"row w-100\">\r\n <div *ngIf=\"type!=='view' && type!=='edit'\" class=\"col-md-12\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Add\r\n User</a>\r\n <div class=\"sub-title\">Please add your user details</div>\r\n </div>\r\n <div *ngIf=\"type==='view' && type !=='edit'\" class=\"col-md-9\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">User Details</a>\r\n <div class=\"sub-title\">View your user details</div>\r\n </div>\r\n <ng-container *ngIf=\"operationType!=='view'\">\r\n <div *ngIf=\"(gs.userAccess |async)?.Global_User_isEdit && type ==='view' && type !=='edit' && user?.role !== 'superadmin' && user?.isActive === true\" class=\"col-md-3 text-end px-0\" (click)=\"editUser()\">\r\n <button class=\"btn btn-outline\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"\r\n viewBox=\"0 0 20 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_3833_85908)\">\r\n <path\r\n d=\"M9.16602 3.3332H3.33268C2.89065 3.3332 2.46673 3.50879 2.15417 3.82135C1.84161 4.13391 1.66602 4.55784 1.66602 4.99986V16.6665C1.66602 17.1086 1.84161 17.5325 2.15417 17.845C2.46673 18.1576 2.89065 18.3332 3.33268 18.3332H14.9993C15.4414 18.3332 15.8653 18.1576 16.1779 17.845C16.4904 17.5325 16.666 17.1086 16.666 16.6665V10.8332M15.416 2.0832C15.7475 1.75168 16.1972 1.56543 16.666 1.56543C17.1349 1.56543 17.5845 1.75168 17.916 2.0832C18.2475 2.41472 18.4338 2.86436 18.4338 3.3332C18.4338 3.80204 18.2475 4.25168 17.916 4.5832L9.99935 12.4999L6.66602 13.3332L7.49935 9.99986L15.416 2.0832Z\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_3833_85908\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg></button>\r\n </div>\r\n </ng-container>\r\n <div *ngIf=\"type==='edit' && type !=='view'\" class=\"col-md-9\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">User Details</a>\r\n <div class=\"sub-title\">Edit your user details</div>\r\n </div>\r\n <div class=\"w-100 h-0px scroll\">\r\n <div class=\"mt-5\" *ngIf=\"userForm\">\r\n <form [formGroup]=\"userForm\" novalidate=\"novalidate\" (keydown.enter)=\"preventClose($event)\" class=\"\">\r\n <div class=\"row px-0 me-3\">\r\n <!-- User Name Field -->\r\n <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n <label for=\"username\" class=\"form-label\">User Name <span class=\"alert-required text-danger\">*</span></label>\r\n <input type=\"text\" class=\"form-control\" id=\"username\" formControlName=\"userName\" autocomplete=\"off\" (keypress)=\"omitSpecialChar($event)\" (paste)=\"omitSpecialCharPaste($event)\">\r\n <div *ngIf=\"userForm.get('userName')?.invalid && (userForm.get('userName')?.dirty)\" class=\"text-danger\">\r\n <small *ngIf=\"userForm.get('userName')?.errors?.['required']\">User Name is required.</small>\r\n </div>\r\n </div>\r\n \r\n <!-- Email Field -->\r\n <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n <label for=\"email\" class=\"form-label\">Email <span class=\"alert-required text-danger\">*</span></label>\r\n <input type=\"email\" class=\"form-control\" id=\"email\" formControlName=\"email\" autocomplete=\"off\">\r\n <div *ngIf=\"userForm.get('email')?.invalid && userForm.get('email')?.touched\" class=\"text-danger\">\r\n <small *ngIf=\"userForm.get('email')?.errors?.['required']\">Email is required.</small>\r\n <small *ngIf=\"userForm.get('email')?.errors?.['pattern']\">Invalid email format.</small>\r\n </div>\r\n </div>\r\n \r\n <!-- Contact Number Field -->\r\n <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n <label for=\"contact\" class=\"form-label\">Contact Number <span class=\"alert-required text-danger\">*</span></label>\r\n <div class=\"row\">\r\n <div class=\"col-md-12 col-lg-4 col-xl-4\">\r\n <select class=\"form-select ps-3 pe-8\" id=\"inputGroupSelect01\" formControlName=\"countryCode\">\r\n <option *ngFor=\"let country of countryList\" [value]=\"country.phonecode\">\r\n {{country.name}} ({{country.phonecode}})\r\n </option>\r\n </select>\r\n </div>\r\n <div class=\"col-md-12 col-lg-8 col-xl-8\">\r\n <input type=\"text\" class=\"form-control\" (keypress)=\"omit_special_char($event)\"\r\n id=\"mobileNumber\" autocomplete=\"off\" formControlName=\"mobileNumber\" minlength=\"8\" maxlength=\"13\">\r\n <div *ngIf=\"userForm.get('mobileNumber')?.invalid && userForm.get('mobileNumber')?.touched\" class=\"text-danger\">\r\n <small *ngIf=\"userForm.get('mobileNumber')?.errors?.['required']\">Contact Number is required.</small>\r\n <small *ngIf=\"userForm.get('mobileNumber')?.errors?.['minlength']\">Contact Number must be at least 8 digits.</small>\r\n <small *ngIf=\"userForm.get('mobileNumber')?.errors?.['maxlength']\">Contact Number cannot exceed 13 digits.</small>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n \r\n <!-- Role Field -->\r\n <div class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n <label for=\"role\" class=\"form-label\">Role <span class=\"alert-required text-danger\">*</span></label>\r\n <select class=\"form-select\" formControlName=\"role\" (change)=\"onRoleChange(userForm.get('role')?.value)\">\r\n <option value=\"admin\">Admin</option>\r\n <option value=\"user\">User</option>\r\n </select>\r\n <div *ngIf=\"userForm.get('role')?.invalid && userForm.get('role')?.touched\" class=\"text-danger\">\r\n <small *ngIf=\"userForm.get('role')?.errors?.['required']\">Role is required.</small>\r\n </div>\r\n </div>\r\n \r\n <!-- Add to Team Field -->\r\n <div class=\"col-md-12 col-lg-12 col-xl-12 col-xxl-12 mb-5\" *ngIf=\"this.userType !=='tango'\">\r\n <label for=\"teamLead\" class=\"form-label teams-title\">Add to a team</label>\r\n <team-select [items]=\"teamList\" [multi]=\"true\" [searchField]=\"'teamName'\" [idField]=\"'_id'\" [disabled]=\"type === 'view' ? true : false\"\r\n (selected)=\"onStoreSelect($event)\" [selectedValues]=\"selectedUser\"></team-select>\r\n </div>\r\n </div>\r\n \r\n <div *ngIf=\"userForm.get('role')?.value === 'admin'\">\r\n\r\n <h3 class=\"teams-title\" *ngIf=\"getPermissions().length\">Access for Admin</h3>\r\n <ng-container *ngIf=\"getPermissions().length\">\r\n <ng-container formArrayName=\"rolespermission\">\r\n <ng-container *ngFor=\"let rolespermission of getPermissions().controls; let i = index\" [formGroupName]=\"i\">\r\n <div class=\"table-responsive my-2 me-3\">\r\n <div class=\"row w-100\">\r\n <div class=\"title-header mt-4 ms-2\">\r\n {{ camelCaseToText(rolespermission.get('featureName')?.value) }}\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"rolespermission.get('modules')\" formArrayName=\"modules\">\r\n <ng-container *ngFor=\"let modules of getFeaturePermissions(rolespermission)?.controls; let j = index\" [formGroupName]=\"j\">\r\n <table class=\"w-100\">\r\n <tbody>\r\n <tr *ngIf=\"rolespermission.get('featureName')?.value !== 'TangoAdmin'\">\r\n <td class=\"w-50\">{{ camelCaseToText(modules.get('name')?.value) }}</td>\r\n <td class=\"text-start\">\r\n <div class=\"d-inline-flex align-items-center\">\r\n <input type=\"checkbox\" formControlName=\"isAdd\" class=\"cursor-pointer\" (change)=\"handleViewChange(modules)\">\r\n <label class=\"global-label ms-2 mt-auto\">Add</label>\r\n </div>\r\n </td>\r\n <td class=\"text-start\">\r\n <div class=\"d-inline-flex align-items-center\">\r\n <input formControlName=\"isEdit\" type=\"checkbox\" class=\"cursor-pointer\" (change)=\"handleEditChange(modules)\">\r\n <label class=\"global-label ms-2 mt-auto\">Edit</label>\r\n </div>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </ng-container>\r\n <div *ngIf=\"rolespermission.get('featureName')?.value === 'TangoAdmin'\" class=\"row w-100 text-nowrap\">\r\n <div class=\"col-md-4\" *ngFor=\"let modules of getFeaturePermissions(rolespermission)?.controls; let j = index\" [formGroupName]=\"j\">\r\n <div class=\"d-inline-flex mt-3\">\r\n <input type=\"checkbox\" class=\"cursor-pointer\" formControlName=\"isEdit\">\r\n <label class=\"global-label mb-5 mx-2 mt-1\" style=\"text-wrap:nowrap\">\r\n {{ camelCaseToText(modules.get('name')?.value) }}\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n \r\n </div>\r\n <div *ngIf=\"type!=='view'\" class=\"d-flex my-10\" role=\"group\">\r\n <button class=\"btn btn-outline w-100 me-3\" (click)=\"cancel()\">Cancel</button>\r\n <button class=\"btn btn-primary w-100 ms-3\" id=\"alert-toast\"\r\n (click)=\"onSubmit()\" [disabled]=\"userForm.invalid || type === 'view'\">Submit</button>\r\n </div>\r\n </form>\r\n </div>\r\n </div>\r\n </div>\r\n </div>", styles: [".scroll{overflow-y:auto;overflow-x:hidden}.title{color:var(--Gray-900, #101828)!important;font-size:18px!important;font-weight:600;line-height:28px}.sub-title{color:var(--Gray-500, #667085)!important;font-size:14px!important;font-weight:400!important;line-height:20px}.teams-title{color:var(--Black, #101828)!important;font-size:18px!important;font-weight:600!important;line-height:28px}.title-header{border-radius:6px!important;border-bottom:2px solid var(--Gray-200, #EAECF0)!important;background:#f2f4f7!important;box-shadow:0 4px 10px #0000000d!important;color:var(--Black, #101828)!important;font-size:20px!important;font-weight:600;line-height:30px;padding:8px 16px}input[type=checkbox]{width:18px!important;height:18px!important;margin:5px;border-radius:4px!important;-webkit-appearance:none;-moz-appearance:none;-o-appearance:none;appearance:none;outline:1px solid var(--gray-300, #D0D5DD);box-shadow:none;font-size:.8em;text-align:center;line-height:1em;background:#fff}input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}input[type=checkbox]:checked:after{content:\"\";transform:rotate(45deg);border-bottom:2px solid #00A3FF;border-right:2px solid #00A3FF;display:inline-block;width:.5em;padding-left:0;padding-top:12px;padding-right:6px}.global-label{color:var(--Gray-700, #344054)!important;font-size:16px!important;font-weight:500;line-height:24px}.w-25{width:40%!important}td{color:var(--Black, #101828)!important;font-size:16px!important;font-weight:500!important;line-height:24px}tr,.add-team{border-bottom:1px solid var(--Gray-200, #EAECF0)!important}input[disabled]{pointer-events:none;opacity:.5}\n"] }]
|
|
1118
1134
|
}], ctorParameters: () => [{ type: ManageUsersService }, { type: i0.ChangeDetectorRef }, { type: i1$1.NgbActiveModal }, { type: i3$1.FormBuilder }, { type: UserService }, { type: i4.ToastService }, { type: i2.GlobalStateService }, { type: i1$1.NgbModal }], propDecorators: { type: [{
|
|
1119
1135
|
type: Input
|
|
1120
1136
|
}], user: [{
|
|
@@ -3614,7 +3630,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
3614
3630
|
type: Output
|
|
3615
3631
|
}] } });
|
|
3616
3632
|
|
|
3617
|
-
|
|
3633
|
+
const SECRET_KEY = CryptoJS.enc.Utf8.parse(CryptoJS.SHA256("t@ng0-ret@il-@pi-v3")
|
|
3634
|
+
.toString(CryptoJS.enc.Base64)
|
|
3635
|
+
.substring(0, 32));
|
|
3618
3636
|
class BrandUserComponent {
|
|
3619
3637
|
modalService;
|
|
3620
3638
|
pageInfo;
|
|
@@ -3678,6 +3696,19 @@ class BrandUserComponent {
|
|
|
3678
3696
|
}
|
|
3679
3697
|
});
|
|
3680
3698
|
}
|
|
3699
|
+
// must match backend
|
|
3700
|
+
decrypt(encryptedText) {
|
|
3701
|
+
const [ivHex, encrypted] = encryptedText.split(':');
|
|
3702
|
+
const iv = CryptoJS.enc.Hex.parse(ivHex);
|
|
3703
|
+
const ciphertext = CryptoJS.enc.Hex.parse(encrypted);
|
|
3704
|
+
const cipherParams = CryptoJS.lib.CipherParams.create({ ciphertext });
|
|
3705
|
+
const decrypted = CryptoJS.AES.decrypt(cipherParams, SECRET_KEY, {
|
|
3706
|
+
iv: iv,
|
|
3707
|
+
mode: CryptoJS.mode.CBC,
|
|
3708
|
+
padding: CryptoJS.pad.Pkcs7
|
|
3709
|
+
});
|
|
3710
|
+
return decrypted.toString(CryptoJS.enc.Utf8);
|
|
3711
|
+
}
|
|
3681
3712
|
setPageData() {
|
|
3682
3713
|
this.pageInfo.setTitle("Users");
|
|
3683
3714
|
this.pageInfo.setDescription("Onboard your team and help them visualize their stores performance");
|
|
@@ -4256,7 +4287,7 @@ class BrandUserComponent {
|
|
|
4256
4287
|
modalRef.result.then((result) => {
|
|
4257
4288
|
if (result) {
|
|
4258
4289
|
if (result === 'submit') {
|
|
4259
|
-
this.userService.updateUser({ email: user?.
|
|
4290
|
+
this.userService.updateUser({ email: this.decrypt(user?.encryptedEmail), isActive: user.isActive }).subscribe({
|
|
4260
4291
|
next: (res) => {
|
|
4261
4292
|
if (res && res.code == 200) {
|
|
4262
4293
|
if (user.isActive) {
|