tango-app-ui-manage-users 3.7.1-alpha.0-test → 3.7.1-alpha.0-test2
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-v2/add-users/add-users.component.mjs +20 -3
- package/esm2022/lib/components-v2/teams-list/teams-list.component.mjs +2 -1
- package/esm2022/lib/components-v2/viewteams-list/viewteams-list.component.mjs +29 -26
- package/fesm2022/tango-app-ui-manage-users.mjs +49 -28
- package/fesm2022/tango-app-ui-manage-users.mjs.map +1 -1
- package/package.json +1 -1
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Injectable,
|
|
2
|
+
import { Injectable, Input, Component, EventEmitter, Output, HostListener, ChangeDetectionStrategy, 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';
|
|
@@ -550,6 +550,20 @@ class AddUsersComponent {
|
|
|
550
550
|
{ name: "Task", isAdd: false, isEdit: false },
|
|
551
551
|
]
|
|
552
552
|
},
|
|
553
|
+
{
|
|
554
|
+
featureName: "FootfallDirectory",
|
|
555
|
+
modules: [
|
|
556
|
+
{
|
|
557
|
+
name: 'creator', isAdd: true, isEdit: true,
|
|
558
|
+
},
|
|
559
|
+
{
|
|
560
|
+
name: 'reviewer', isAdd: false, isEdit: false,
|
|
561
|
+
},
|
|
562
|
+
{
|
|
563
|
+
name: "approver", isAdd: false, isEdit: false,
|
|
564
|
+
}
|
|
565
|
+
]
|
|
566
|
+
}
|
|
553
567
|
];
|
|
554
568
|
handleViewChange(modules) {
|
|
555
569
|
if (!modules.get("isAdd")?.value) {
|
|
@@ -691,6 +705,7 @@ class AddUsersComponent {
|
|
|
691
705
|
next: (res) => {
|
|
692
706
|
if (res && res.code == 200 && res.data.result) {
|
|
693
707
|
const userData = res.data.result;
|
|
708
|
+
console.log('userData', userData);
|
|
694
709
|
const isViewMode = this.type === 'view';
|
|
695
710
|
const isSuperadmin = this.user_data?.role === 'superadmin';
|
|
696
711
|
const email = (isViewMode && !isSuperadmin) ? this.maskEmail(userData.email) : userData.email;
|
|
@@ -752,6 +767,7 @@ class AddUsersComponent {
|
|
|
752
767
|
}
|
|
753
768
|
}
|
|
754
769
|
initUserForm() {
|
|
770
|
+
console.log('init form called');
|
|
755
771
|
this.userForm = this.fb.group({
|
|
756
772
|
userName: ["", Validators.required],
|
|
757
773
|
email: ["", Validators.compose([Validators.required,
|
|
@@ -777,6 +793,7 @@ class AddUsersComponent {
|
|
|
777
793
|
this.getUserPermissionData("user", this.user_data.userType);
|
|
778
794
|
}
|
|
779
795
|
populatePermission(permissionsData) {
|
|
796
|
+
console.log('populatePermission called', permissionsData);
|
|
780
797
|
const permissions = this.userForm.get("rolespermission");
|
|
781
798
|
permissions.clear(); // Clear existing entries
|
|
782
799
|
permissionsData.forEach((rolespermission) => {
|
|
@@ -1126,11 +1143,11 @@ class AddUsersComponent {
|
|
|
1126
1143
|
event.preventDefault();
|
|
1127
1144
|
}
|
|
1128
1145
|
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 });
|
|
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" }] });
|
|
1146
|
+
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 <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" }] });
|
|
1130
1147
|
}
|
|
1131
1148
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AddUsersComponent, decorators: [{
|
|
1132
1149
|
type: Component,
|
|
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"] }]
|
|
1150
|
+
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 <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"] }]
|
|
1134
1151
|
}], 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: [{
|
|
1135
1152
|
type: Input
|
|
1136
1153
|
}], user: [{
|
|
@@ -4690,41 +4707,43 @@ class ViewteamsListComponent {
|
|
|
4690
4707
|
}
|
|
4691
4708
|
users;
|
|
4692
4709
|
ngOnInit() {
|
|
4693
|
-
|
|
4694
|
-
|
|
4695
|
-
|
|
4696
|
-
|
|
4697
|
-
|
|
4698
|
-
|
|
4699
|
-
|
|
4700
|
-
|
|
4710
|
+
setTimeout(() => {
|
|
4711
|
+
this.users = JSON.parse(localStorage.getItem('user-info') || '{}');
|
|
4712
|
+
this.gs?.dataRangeValue?.pipe(takeUntil(this.destroy$))?.subscribe({
|
|
4713
|
+
next: (data) => {
|
|
4714
|
+
if (data === null) {
|
|
4715
|
+
const userData = JSON.parse(localStorage.getItem("user-info") || "{}");
|
|
4716
|
+
this.$headerFilters = userData;
|
|
4717
|
+
this.$headerFilters.client = userData.clientId;
|
|
4718
|
+
if (userData?.clientId) {
|
|
4719
|
+
this.reqdata = {
|
|
4720
|
+
clientId: this.$headerFilters.client,
|
|
4721
|
+
TeamId: this.teamData?._id,
|
|
4722
|
+
limit: 10,
|
|
4723
|
+
offset: 1,
|
|
4724
|
+
searchValue: this.searchValue,
|
|
4725
|
+
export: false
|
|
4726
|
+
};
|
|
4727
|
+
this.loadTable();
|
|
4728
|
+
}
|
|
4729
|
+
}
|
|
4730
|
+
else {
|
|
4731
|
+
this.$headerFilters = data;
|
|
4732
|
+
this.pagination.offset = 1;
|
|
4733
|
+
this.pagination.limit = 10;
|
|
4701
4734
|
this.reqdata = {
|
|
4702
4735
|
clientId: this.$headerFilters.client,
|
|
4703
|
-
TeamId: this.teamData?._id,
|
|
4704
4736
|
limit: 10,
|
|
4705
4737
|
offset: 1,
|
|
4738
|
+
TeamId: this.teamData?._id,
|
|
4706
4739
|
searchValue: this.searchValue,
|
|
4707
4740
|
export: false
|
|
4708
4741
|
};
|
|
4709
4742
|
this.loadTable();
|
|
4710
4743
|
}
|
|
4711
4744
|
}
|
|
4712
|
-
|
|
4713
|
-
|
|
4714
|
-
this.pagination.offset = 1;
|
|
4715
|
-
this.pagination.limit = 10;
|
|
4716
|
-
this.reqdata = {
|
|
4717
|
-
clientId: this.$headerFilters.client,
|
|
4718
|
-
limit: 10,
|
|
4719
|
-
offset: 1,
|
|
4720
|
-
TeamId: this.teamData?._id,
|
|
4721
|
-
searchValue: this.searchValue,
|
|
4722
|
-
export: false
|
|
4723
|
-
};
|
|
4724
|
-
this.loadTable();
|
|
4725
|
-
}
|
|
4726
|
-
}
|
|
4727
|
-
});
|
|
4745
|
+
});
|
|
4746
|
+
}, 100);
|
|
4728
4747
|
}
|
|
4729
4748
|
getMaskedValue(value, role) {
|
|
4730
4749
|
if (role === 'superadmin')
|
|
@@ -4813,6 +4832,7 @@ class ViewteamsListComponent {
|
|
|
4813
4832
|
this.userService.setViewTeam(false);
|
|
4814
4833
|
}
|
|
4815
4834
|
loadTable() {
|
|
4835
|
+
this.viewteamsList = [];
|
|
4816
4836
|
this.loading = true;
|
|
4817
4837
|
this.noData = false;
|
|
4818
4838
|
this.pagination.totalCount = 0;
|
|
@@ -5268,6 +5288,7 @@ class TeamsListComponent {
|
|
|
5268
5288
|
this.selectedTeam = data;
|
|
5269
5289
|
this.viewTeams = true;
|
|
5270
5290
|
this.userService.setViewTeam(true);
|
|
5291
|
+
this.loading = false;
|
|
5271
5292
|
}
|
|
5272
5293
|
searchData() {
|
|
5273
5294
|
this.pagination.offset = 1;
|