tango-app-ui-manage-users 3.7.1-alpha.0-test2 → 3.7.1-alpha.0-test4
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.
|
@@ -551,7 +551,7 @@ class AddUsersComponent {
|
|
|
551
551
|
]
|
|
552
552
|
},
|
|
553
553
|
{
|
|
554
|
-
featureName: "
|
|
554
|
+
featureName: "Tickets",
|
|
555
555
|
modules: [
|
|
556
556
|
{
|
|
557
557
|
name: 'creator', isAdd: true, isEdit: true,
|
|
@@ -701,11 +701,11 @@ class AddUsersComponent {
|
|
|
701
701
|
return `${first2}${maskedMiddle}${last2}`;
|
|
702
702
|
}
|
|
703
703
|
loadUserForm() {
|
|
704
|
-
this.userService.getUser(this.decrypt(this.user.
|
|
704
|
+
// this.userService.getUser(this.decrypt(this.user.email)).pipe(takeUntil(this.destroy$)).subscribe({
|
|
705
|
+
this.userService.getUser(this.user.email).pipe(takeUntil(this.destroy$)).subscribe({
|
|
705
706
|
next: (res) => {
|
|
706
707
|
if (res && res.code == 200 && res.data.result) {
|
|
707
708
|
const userData = res.data.result;
|
|
708
|
-
console.log('userData', userData);
|
|
709
709
|
const isViewMode = this.type === 'view';
|
|
710
710
|
const isSuperadmin = this.user_data?.role === 'superadmin';
|
|
711
711
|
const email = (isViewMode && !isSuperadmin) ? this.maskEmail(userData.email) : userData.email;
|
|
@@ -767,7 +767,6 @@ class AddUsersComponent {
|
|
|
767
767
|
}
|
|
768
768
|
}
|
|
769
769
|
initUserForm() {
|
|
770
|
-
console.log('init form called');
|
|
771
770
|
this.userForm = this.fb.group({
|
|
772
771
|
userName: ["", Validators.required],
|
|
773
772
|
email: ["", Validators.compose([Validators.required,
|
|
@@ -793,7 +792,6 @@ class AddUsersComponent {
|
|
|
793
792
|
this.getUserPermissionData("user", this.user_data.userType);
|
|
794
793
|
}
|
|
795
794
|
populatePermission(permissionsData) {
|
|
796
|
-
console.log('populatePermission called', permissionsData);
|
|
797
795
|
const permissions = this.userForm.get("rolespermission");
|
|
798
796
|
permissions.clear(); // Clear existing entries
|
|
799
797
|
permissionsData.forEach((rolespermission) => {
|
|
@@ -817,7 +815,6 @@ class AddUsersComponent {
|
|
|
817
815
|
permissions.updateValueAndValidity();
|
|
818
816
|
}
|
|
819
817
|
getPermissions() {
|
|
820
|
-
// console.log(this.userForm.value)
|
|
821
818
|
return this.userForm.get("rolespermission");
|
|
822
819
|
}
|
|
823
820
|
getFeaturePermissions(rolespermission) {
|
|
@@ -1143,11 +1140,11 @@ class AddUsersComponent {
|
|
|
1143
1140
|
event.preventDefault();
|
|
1144
1141
|
}
|
|
1145
1142
|
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 });
|
|
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" }] });
|
|
1143
|
+
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" }] });
|
|
1147
1144
|
}
|
|
1148
1145
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AddUsersComponent, decorators: [{
|
|
1149
1146
|
type: Component,
|
|
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"] }]
|
|
1147
|
+
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"] }]
|
|
1151
1148
|
}], 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: [{
|
|
1152
1149
|
type: Input
|
|
1153
1150
|
}], user: [{
|