tango-app-ui-manage-users 3.4.0-alpha.7 → 3.4.0-alpha.9

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.
Files changed (25) hide show
  1. package/esm2022/lib/components/tango-manage-users/add-user-popup/add-user-popup.component.mjs +3 -3
  2. package/esm2022/lib/components/tango-manage-users/assign-store-popup/assign-store-popup.component.mjs +3 -3
  3. package/esm2022/lib/components/tango-manage-users/audit-user/audit-user-earnings/audit-user-earnings.component.mjs +9 -5
  4. package/esm2022/lib/components/tango-manage-users/audit-user/audit-user-list/audit-user-list.component.mjs +9 -5
  5. package/esm2022/lib/components/tango-manage-users/brand-user/brand-user.component.mjs +3 -3
  6. package/esm2022/lib/components/tango-manage-users/roles-permission-table/roles-permission-table.component.mjs +3 -3
  7. package/esm2022/lib/components/tango-manage-users/tango-manage-users.component.mjs +3 -3
  8. package/esm2022/lib/components/tango-manage-users/user-table/alert-popup/alert-popup.component.mjs +3 -3
  9. package/esm2022/lib/components/tango-manage-users/user-table/user-table.component.mjs +5 -5
  10. package/esm2022/lib/components-v2/action-popup/action-popup.component.mjs +3 -3
  11. package/esm2022/lib/components-v2/add-users/add-users.component.mjs +6 -6
  12. package/esm2022/lib/components-v2/custom-select/custom-select.component.mjs +3 -3
  13. package/esm2022/lib/components-v2/teams-creation/teams-creation.component.mjs +3 -3
  14. package/esm2022/lib/components-v2/teams-list/teams-list.component.mjs +3 -3
  15. package/esm2022/lib/components-v2/users-list/users-list.component.mjs +3 -3
  16. package/esm2022/lib/components-v2/users-manage/users-manage.component.mjs +3 -3
  17. package/esm2022/lib/components-v2/viewteams-list/viewteams-list.component.mjs +3 -3
  18. package/esm2022/lib/services/excel.service.mjs +3 -3
  19. package/esm2022/lib/services/user.service.mjs +3 -3
  20. package/esm2022/lib/services-v2/manage-users.service.mjs +3 -3
  21. package/esm2022/lib/tango-manage-users-routing.module.mjs +4 -4
  22. package/esm2022/lib/tango-manage-users.module.mjs +4 -4
  23. package/fesm2022/tango-app-ui-manage-users.mjs +81 -73
  24. package/fesm2022/tango-app-ui-manage-users.mjs.map +1 -1
  25. package/package.json +1 -1
@@ -455,10 +455,10 @@ export class AddUserPopupComponent {
455
455
  .replace(/^./, (str) => str.toUpperCase())
456
456
  .trim();
457
457
  }
458
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: AddUserPopupComponent, deps: [{ token: i1.NgbActiveModal }, { token: i0.ChangeDetectorRef }, { token: i1.NgbModal }, { token: i2.FormBuilder }, { token: i3.UserService }, { token: i4.ToastService }, { token: i5.GlobalStateService }], target: i0.ɵɵFactoryTarget.Component });
459
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.11", type: AddUserPopupComponent, selector: "lib-add-user-popup", inputs: { type: "type", user: "user", userType: "userType" }, outputs: { dataTosingleuser: "dataTosingleuser" }, viewQueries: [{ propertyName: "inputFile", first: true, predicate: ["inputFile"], descendants: true }], ngImport: i0, template: "<div class=\"card py-0 scroll\">\r\n <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"my-5\">\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 </div>\r\n <div class=\"row w-100\">\r\n <div *ngIf=\"operationType==='add'\" 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=\"operationType==='edit'\" class=\"col-md-12\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Edit User Details</a>\r\n <div class=\"sub-title\">Please Edit your user details</div>\r\n </div> -->\r\n <div *ngIf=\"operationType==='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\">View your user details</div>\r\n </div>\r\n <!-- @if ((gs.userAccess | async)?.Global_User_isEdit) { -->\r\n <div *ngIf=\"operationType==='view' && (gs.userAccess | async)?.Global_User_isEdit\"\r\n 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 <!-- } -->\r\n </div>\r\n <div class=\"fw-bold text-gray-500 my-6\" *ngIf=\"!showsingleuser && this.operationType ==='add'\">\r\n <ul class=\"text-gray-400 fw-bold fs-6\">\r\n <li>Use the template to upload multiple users at once.</li>\r\n <li>Download the template here -\r\n <a [attr.href]=\"userType ==='tango' ? '../../../assets/files/TangoUsersTemplate.xlsx' : '../../../assets/files/UsersTemplate.xlsx'\"\r\n download>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M17.5 12.5V15.8333C17.5 16.2754 17.3244 16.6993 17.0118 17.0118C16.6993 17.3244 16.2754 17.5 15.8333 17.5H4.16667C3.72464 17.5 3.30072 17.3244 2.98816 17.0118C2.67559 16.6993 2.5 16.2754 2.5 15.8333V12.5M5.83333 8.33333L10 12.5M10 12.5L14.1667 8.33333M10 12.5V2.5\"\r\n stroke=\"#009BF3\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span class=\"template ms-2\">Download Template</span>\r\n </a>\r\n </li>\r\n <li>Add your data to the Template File</li>\r\n <li>Upload it below for processing</li>\r\n\r\n </ul>\r\n </div>\r\n <div class=\"d-flex flex-center flex-wrap mb-5 w-100\" *ngIf=\"!showsingleuser && this.operationType ==='add'\">\r\n <input name=\"accountType\" type=\"radio\" id=\"kt_create_account_form_account_type_personal\"\r\n (change)=\"onUpload($event)\" value=\"personal\" class=\"btn-check\" ng-reflect-name=\"accountType\"\r\n ng-reflect-form-control-name=\"accountType\" ng-reflect-value=\"personal\" type=\"file\" #inputFile />\r\n <label for=\"kt_create_account_form_account_type_personal\"\r\n class=\"btn btn-outline bg-primary btn-outline-default rounded-3 w-100 p-4 mt-5\"><span\r\n class=\"fw-bold fs-4\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\"\r\n viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path\r\n d=\"M18 12.5V15.8333C18 16.2754 17.8244 16.6993 17.5118 17.0118C17.1993 17.3244 16.7754 17.5 16.3333 17.5H4.66667C4.22464 17.5 3.80072 17.3244 3.48816 17.0118C3.17559 16.6993 3 16.2754 3 15.8333V12.5M14.6667 6.66667L10.5 2.5M10.5 2.5L6.33333 6.66667M10.5 2.5V12.5\"\r\n stroke=\"white\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg> <span class=\"text-white mx-2 single-user\">Add Multiple Users</span></span>\r\n </label>\r\n <p class=\"text-gray-400 fw-bold my-3\">\r\n <span class=\"mx-2 orval\">Or </span>\r\n </p>\r\n <input type=\"radio\" id=\"kt_account_team_size_select_1\" value=\"1-1\" (click)=\"addSingleUser()\"\r\n class=\"btn-check ng-untouched ng-pristine ng-valid\" />\r\n <label for=\"kt_account_team_size_select_1\"\r\n class=\"btn btn-outline btn-outline-default rounded-3 w-100 p-4 mt-3\"><span class=\"fw-bold fs-4\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path\r\n d=\"M17.1663 17.5V15.8333C17.1663 14.9493 16.8152 14.1014 16.19 13.4763C15.5649 12.8512 14.7171 12.5 13.833 12.5H7.16634C6.28229 12.5 5.43444 12.8512 4.80932 13.4763C4.1842 14.1014 3.83301 14.9493 3.83301 15.8333V17.5M13.833 5.83333C13.833 7.67428 12.3406 9.16667 10.4997 9.16667C8.65873 9.16667 7.16634 7.67428 7.16634 5.83333C7.16634 3.99238 8.65873 2.5 10.4997 2.5C12.3406 2.5 13.833 3.99238 13.833 5.83333Z\"\r\n stroke=\"#101828\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span id=\"triggerButtonId\" class=\"mx-2 single-user fw-bold\">Add Single\r\n User</span></span></label>\r\n </div>\r\n\r\n <div class=\"w-100 h-500px scroll\" *ngIf=\"showsingleuser\">\r\n <div class=\"mt-5\" *ngIf=\"userForm\">\r\n <form [formGroup]=\"userForm\" novalidate=\"novalidate\" class=\"\">\r\n <div class=\"row px-0 me-3\">\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</label>\r\n <input type=\"text\" class=\"form-control\" id=\"username\" formControlName=\"userName\"\r\n autocomplete=\"off\">\r\n </div>\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</label>\r\n <input type=\"email\" class=\"form-control\" id=\"email\" formControlName=\"email\"\r\n autocomplete=\"off\" required>\r\n </div>\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</label>\r\n <input type=\"text\" class=\"form-control\" id=\"contact\" formControlName=\"mobileNumber\"\r\n autocomplete=\"off\" required minlength=\"10\" maxlength=\"13\"\r\n (keypress)=\"omit_special_char($event)\">\r\n </div>\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</label>\r\n <select class=\"form-select\" formControlName=\"role\"\r\n (change)=\"onRoleChange(userForm.get('role')?.value)\">\r\n <option value=\"superadmin\">Super Admin</option>\r\n <option value=\"admin\">Admin</option>\r\n <option value=\"user\">User</option>\r\n </select>\r\n </div>\r\n <div *ngIf=\"userType === 'tango'\" class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n <label for=\"tangoUserType\" class=\"form-label\">User Type</label>\r\n <select class=\"form-select\" formControlName=\"tangoUserType\"\r\n (change)=\"onRoleChange(userForm.get('tangoUserType')?.value)\">\r\n <option value=\"dashboard\">Dashboard</option>\r\n <option value=\"audit\">Audit</option>\r\n </select>\r\n </div>\r\n </div>\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bolder mb-0 title cursor-pointer\">Access for\r\n {{userForm.get('role')?.value | titlecase}}</a>\r\n <div class=\"sub-title font-sub\">{{userForm.get('role')?.value | titlecase}} can access respective\r\n enabled features and products</div>\r\n <ng-container *ngIf=\"getPermissions().length\">\r\n <ng-container formArrayName=\"permission\">\r\n <ng-container *ngFor=\"let permission of getPermissions().controls; let i = index\"\r\n [formGroupName]=\"i\">\r\n <div class=\"my-6\">\r\n <div class=\"row me-3\">\r\n <div class=\"col-6\">\r\n <div class=\"title fw-semibold\">\r\n {{ permission.get('featureName')?.value | titlecase }}\r\n\r\n </div>\r\n </div>\r\n <div class=\"col-6 d-flex justify-content-end\" (click)=\"toggleCollapse(i)\">\r\n <div class=\"text-end\">\r\n @if (!isExpanded[i]) {\r\n <svg width=\"13\" height=\"8\" viewBox=\"0 0 13 8\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M1.5 1.5L6.5 6.5L11.5 1.5\" stroke=\"#667085\"\r\n stroke-width=\"1.67\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n } @else {\r\n <svg width=\"12\" height=\"8\" viewBox=\"0 0 12 8\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M11 6.5L6 1.5L1 6.5\" stroke=\"#667085\" stroke-width=\"1.67\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n <div [ngClass]=\"{ 'collapsed': !isExpanded[i] }\">\r\n <div class=\"table-responsive my-2 me-3\">\r\n <table class=\"w-100\">\r\n <thead>\r\n <tr>\r\n <th>Modules</th>\r\n <th>View</th>\r\n <th>Edit</th>\r\n <th>Download</th>\r\n <th>Delete</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <ng-container *ngIf=\"permission.get('product')\"\r\n formArrayName=\"product\">\r\n <ng-container\r\n *ngFor=\"let product of getFeaturePermissions(permission)?.controls;let j=index;\"\r\n [formGroupName]=\"j\">\r\n <tr>\r\n <td>{{ camelCaseToText(product.get('name')?.value) }}\r\n </td>\r\n <td><input formControlName=\"isView\" type=\"checkbox\"\r\n class=\"cursor-pointer\"\r\n (change)=\"handleAddChange(product)\"></td>\r\n <td><input formControlName=\"isEdit\" type=\"checkbox\"\r\n class=\"cursor-pointer\"\r\n (change)=\"handleEditChange(product)\"></td>\r\n <td><input formControlName=\"isDownload\" type=\"checkbox\"\r\n class=\"cursor-pointer\"\r\n [disabled]=\"!product.get('isEdit')?.value || !product.get('isView')?.value\">\r\n </td>\r\n <td><input formControlName=\"isDelete\" type=\"checkbox\"\r\n class=\"cursor-pointer\"\r\n [disabled]=\"!product.get('isEdit')?.value || !product.get('isView')?.value\">\r\n </td>\r\n </tr>\r\n </ng-container>\r\n </ng-container>\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <div *ngIf=\"operationType!=='view'\" class=\"d-flex my-14\" role=\"group\">\r\n <button class=\"btn btn-outline w-100 mx-3\" (click)=\"cancel()\">Cancel</button>\r\n <button class=\"btn btn-primary w-100 mx-3\" [disabled]=\"userForm.invalid\" id=\"alert-toast\"\r\n (click)=\"onSubmit()\">Submit</button>\r\n </div>\r\n </form>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n</div>", styles: [".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}li{color:var(--Gray-700, #344054)!important;font-family:Inter;font-size:14px!important;font-weight:500!important;line-height:30px;list-style:decimal!important}.scroll{overflow-y:auto;overflow-x:hidden}.template{color:var(--Primary-700, #009BF3)!important;font-family:Inter;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize}.orval{color:var(--Gray-700, #344054);font-size:14px;font-weight:400!important;line-height:20px}.single-user{color:var(--Gray-700, #344054);font-size:16px!important;line-height:24px;text-transform:capitalize}.form-label{color:var(--Gray-700, #344054);text-shadow:0px 0px 0px #D5EFFE,0px 1px 2px rgba(16,24,40,.05);font-size:14px;font-weight:500;line-height:20px}.form-control:focus{border-radius:8px;border:1px solid var(--Primary-300, #6BCAFF)!important;background:var(--White, #FFF)!important;box-shadow:0 0 0 4px #d5effe,0 1px 2px #1018280d!important}.font-sub{font-size:12px!important;line-height:18px!important}.accordion-item{color:var(--bs-accordion-color);background-color:var(--bs-accordion-bg);border:none!important}.divider{border-bottom:1px solid #D0D5DD;width:75%;margin-left:2%;background:var(--Gray-300, #D0D5DD)}input[type=checkbox]{width:20px!important;height:20px!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}.collapsed{display:none}.divider{border-right:1px solid #ccc;margin-left:10px;margin-right:10px}\n"], dependencies: [{ kind: "directive", type: i6.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.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: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i2.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "pipe", type: i6.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.TitleCasePipe, name: "titlecase" }] });
458
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AddUserPopupComponent, deps: [{ token: i1.NgbActiveModal }, { token: i0.ChangeDetectorRef }, { token: i1.NgbModal }, { token: i2.FormBuilder }, { token: i3.UserService }, { token: i4.ToastService }, { token: i5.GlobalStateService }], target: i0.ɵɵFactoryTarget.Component });
459
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: AddUserPopupComponent, selector: "lib-add-user-popup", inputs: { type: "type", user: "user", userType: "userType" }, outputs: { dataTosingleuser: "dataTosingleuser" }, viewQueries: [{ propertyName: "inputFile", first: true, predicate: ["inputFile"], descendants: true }], ngImport: i0, template: "<div class=\"card py-0 scroll\">\r\n <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"my-5\">\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 </div>\r\n <div class=\"row w-100\">\r\n <div *ngIf=\"operationType==='add'\" 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=\"operationType==='edit'\" class=\"col-md-12\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Edit User Details</a>\r\n <div class=\"sub-title\">Please Edit your user details</div>\r\n </div> -->\r\n <div *ngIf=\"operationType==='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\">View your user details</div>\r\n </div>\r\n <!-- @if ((gs.userAccess | async)?.Global_User_isEdit) { -->\r\n <div *ngIf=\"operationType==='view' && (gs.userAccess | async)?.Global_User_isEdit\"\r\n 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 <!-- } -->\r\n </div>\r\n <div class=\"fw-bold text-gray-500 my-6\" *ngIf=\"!showsingleuser && this.operationType ==='add'\">\r\n <ul class=\"text-gray-400 fw-bold fs-6\">\r\n <li>Use the template to upload multiple users at once.</li>\r\n <li>Download the template here -\r\n <a [attr.href]=\"userType ==='tango' ? '../../../assets/files/TangoUsersTemplate.xlsx' : '../../../assets/files/UsersTemplate.xlsx'\"\r\n download>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M17.5 12.5V15.8333C17.5 16.2754 17.3244 16.6993 17.0118 17.0118C16.6993 17.3244 16.2754 17.5 15.8333 17.5H4.16667C3.72464 17.5 3.30072 17.3244 2.98816 17.0118C2.67559 16.6993 2.5 16.2754 2.5 15.8333V12.5M5.83333 8.33333L10 12.5M10 12.5L14.1667 8.33333M10 12.5V2.5\"\r\n stroke=\"#009BF3\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span class=\"template ms-2\">Download Template</span>\r\n </a>\r\n </li>\r\n <li>Add your data to the Template File</li>\r\n <li>Upload it below for processing</li>\r\n\r\n </ul>\r\n </div>\r\n <div class=\"d-flex flex-center flex-wrap mb-5 w-100\" *ngIf=\"!showsingleuser && this.operationType ==='add'\">\r\n <input name=\"accountType\" type=\"radio\" id=\"kt_create_account_form_account_type_personal\"\r\n (change)=\"onUpload($event)\" value=\"personal\" class=\"btn-check\" ng-reflect-name=\"accountType\"\r\n ng-reflect-form-control-name=\"accountType\" ng-reflect-value=\"personal\" type=\"file\" #inputFile />\r\n <label for=\"kt_create_account_form_account_type_personal\"\r\n class=\"btn btn-outline bg-primary btn-outline-default rounded-3 w-100 p-4 mt-5\"><span\r\n class=\"fw-bold fs-4\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\"\r\n viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path\r\n d=\"M18 12.5V15.8333C18 16.2754 17.8244 16.6993 17.5118 17.0118C17.1993 17.3244 16.7754 17.5 16.3333 17.5H4.66667C4.22464 17.5 3.80072 17.3244 3.48816 17.0118C3.17559 16.6993 3 16.2754 3 15.8333V12.5M14.6667 6.66667L10.5 2.5M10.5 2.5L6.33333 6.66667M10.5 2.5V12.5\"\r\n stroke=\"white\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg> <span class=\"text-white mx-2 single-user\">Add Multiple Users</span></span>\r\n </label>\r\n <p class=\"text-gray-400 fw-bold my-3\">\r\n <span class=\"mx-2 orval\">Or </span>\r\n </p>\r\n <input type=\"radio\" id=\"kt_account_team_size_select_1\" value=\"1-1\" (click)=\"addSingleUser()\"\r\n class=\"btn-check ng-untouched ng-pristine ng-valid\" />\r\n <label for=\"kt_account_team_size_select_1\"\r\n class=\"btn btn-outline btn-outline-default rounded-3 w-100 p-4 mt-3\"><span class=\"fw-bold fs-4\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path\r\n d=\"M17.1663 17.5V15.8333C17.1663 14.9493 16.8152 14.1014 16.19 13.4763C15.5649 12.8512 14.7171 12.5 13.833 12.5H7.16634C6.28229 12.5 5.43444 12.8512 4.80932 13.4763C4.1842 14.1014 3.83301 14.9493 3.83301 15.8333V17.5M13.833 5.83333C13.833 7.67428 12.3406 9.16667 10.4997 9.16667C8.65873 9.16667 7.16634 7.67428 7.16634 5.83333C7.16634 3.99238 8.65873 2.5 10.4997 2.5C12.3406 2.5 13.833 3.99238 13.833 5.83333Z\"\r\n stroke=\"#101828\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span id=\"triggerButtonId\" class=\"mx-2 single-user fw-bold\">Add Single\r\n User</span></span></label>\r\n </div>\r\n\r\n <div class=\"w-100 h-500px scroll\" *ngIf=\"showsingleuser\">\r\n <div class=\"mt-5\" *ngIf=\"userForm\">\r\n <form [formGroup]=\"userForm\" novalidate=\"novalidate\" class=\"\">\r\n <div class=\"row px-0 me-3\">\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</label>\r\n <input type=\"text\" class=\"form-control\" id=\"username\" formControlName=\"userName\"\r\n autocomplete=\"off\">\r\n </div>\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</label>\r\n <input type=\"email\" class=\"form-control\" id=\"email\" formControlName=\"email\"\r\n autocomplete=\"off\" required>\r\n </div>\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</label>\r\n <input type=\"text\" class=\"form-control\" id=\"contact\" formControlName=\"mobileNumber\"\r\n autocomplete=\"off\" required minlength=\"10\" maxlength=\"13\"\r\n (keypress)=\"omit_special_char($event)\">\r\n </div>\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</label>\r\n <select class=\"form-select\" formControlName=\"role\"\r\n (change)=\"onRoleChange(userForm.get('role')?.value)\">\r\n <option value=\"superadmin\">Super Admin</option>\r\n <option value=\"admin\">Admin</option>\r\n <option value=\"user\">User</option>\r\n </select>\r\n </div>\r\n <div *ngIf=\"userType === 'tango'\" class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n <label for=\"tangoUserType\" class=\"form-label\">User Type</label>\r\n <select class=\"form-select\" formControlName=\"tangoUserType\"\r\n (change)=\"onRoleChange(userForm.get('tangoUserType')?.value)\">\r\n <option value=\"dashboard\">Dashboard</option>\r\n <option value=\"audit\">Audit</option>\r\n </select>\r\n </div>\r\n </div>\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bolder mb-0 title cursor-pointer\">Access for\r\n {{userForm.get('role')?.value | titlecase}}</a>\r\n <div class=\"sub-title font-sub\">{{userForm.get('role')?.value | titlecase}} can access respective\r\n enabled features and products</div>\r\n <ng-container *ngIf=\"getPermissions().length\">\r\n <ng-container formArrayName=\"permission\">\r\n <ng-container *ngFor=\"let permission of getPermissions().controls; let i = index\"\r\n [formGroupName]=\"i\">\r\n <div class=\"my-6\">\r\n <div class=\"row me-3\">\r\n <div class=\"col-6\">\r\n <div class=\"title fw-semibold\">\r\n {{ permission.get('featureName')?.value | titlecase }}\r\n\r\n </div>\r\n </div>\r\n <div class=\"col-6 d-flex justify-content-end\" (click)=\"toggleCollapse(i)\">\r\n <div class=\"text-end\">\r\n @if (!isExpanded[i]) {\r\n <svg width=\"13\" height=\"8\" viewBox=\"0 0 13 8\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M1.5 1.5L6.5 6.5L11.5 1.5\" stroke=\"#667085\"\r\n stroke-width=\"1.67\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n } @else {\r\n <svg width=\"12\" height=\"8\" viewBox=\"0 0 12 8\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M11 6.5L6 1.5L1 6.5\" stroke=\"#667085\" stroke-width=\"1.67\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n <div [ngClass]=\"{ 'collapsed': !isExpanded[i] }\">\r\n <div class=\"table-responsive my-2 me-3\">\r\n <table class=\"w-100\">\r\n <thead>\r\n <tr>\r\n <th>Modules</th>\r\n <th>View</th>\r\n <th>Edit</th>\r\n <th>Download</th>\r\n <th>Delete</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <ng-container *ngIf=\"permission.get('product')\"\r\n formArrayName=\"product\">\r\n <ng-container\r\n *ngFor=\"let product of getFeaturePermissions(permission)?.controls;let j=index;\"\r\n [formGroupName]=\"j\">\r\n <tr>\r\n <td>{{ camelCaseToText(product.get('name')?.value) }}\r\n </td>\r\n <td><input formControlName=\"isView\" type=\"checkbox\"\r\n class=\"cursor-pointer\"\r\n (change)=\"handleAddChange(product)\"></td>\r\n <td><input formControlName=\"isEdit\" type=\"checkbox\"\r\n class=\"cursor-pointer\"\r\n (change)=\"handleEditChange(product)\"></td>\r\n <td><input formControlName=\"isDownload\" type=\"checkbox\"\r\n class=\"cursor-pointer\"\r\n [disabled]=\"!product.get('isEdit')?.value || !product.get('isView')?.value\">\r\n </td>\r\n <td><input formControlName=\"isDelete\" type=\"checkbox\"\r\n class=\"cursor-pointer\"\r\n [disabled]=\"!product.get('isEdit')?.value || !product.get('isView')?.value\">\r\n </td>\r\n </tr>\r\n </ng-container>\r\n </ng-container>\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <div *ngIf=\"operationType!=='view'\" class=\"d-flex my-14\" role=\"group\">\r\n <button class=\"btn btn-outline w-100 mx-3\" (click)=\"cancel()\">Cancel</button>\r\n <button class=\"btn btn-primary w-100 mx-3\" [disabled]=\"userForm.invalid\" id=\"alert-toast\"\r\n (click)=\"onSubmit()\">Submit</button>\r\n </div>\r\n </form>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n</div>", styles: [".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}li{color:var(--Gray-700, #344054)!important;font-family:Inter;font-size:14px!important;font-weight:500!important;line-height:30px;list-style:decimal!important}.scroll{overflow-y:auto;overflow-x:hidden}.template{color:var(--Primary-700, #009BF3)!important;font-family:Inter;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize}.orval{color:var(--Gray-700, #344054);font-size:14px;font-weight:400!important;line-height:20px}.single-user{color:var(--Gray-700, #344054);font-size:16px!important;line-height:24px;text-transform:capitalize}.form-label{color:var(--Gray-700, #344054);text-shadow:0px 0px 0px #D5EFFE,0px 1px 2px rgba(16,24,40,.05);font-size:14px;font-weight:500;line-height:20px}.form-control:focus{border-radius:8px;border:1px solid var(--Primary-300, #6BCAFF)!important;background:var(--White, #FFF)!important;box-shadow:0 0 0 4px #d5effe,0 1px 2px #1018280d!important}.font-sub{font-size:12px!important;line-height:18px!important}.accordion-item{color:var(--bs-accordion-color);background-color:var(--bs-accordion-bg);border:none!important}.divider{border-bottom:1px solid #D0D5DD;width:75%;margin-left:2%;background:var(--Gray-300, #D0D5DD)}input[type=checkbox]{width:20px!important;height:20px!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}.collapsed{display:none}.divider{border-right:1px solid #ccc;margin-left:10px;margin-right:10px}\n"], dependencies: [{ kind: "directive", type: i6.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { 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: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.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: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i2.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "pipe", type: i6.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.TitleCasePipe, name: "titlecase" }] });
460
460
  }
461
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: AddUserPopupComponent, decorators: [{
461
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AddUserPopupComponent, decorators: [{
462
462
  type: Component,
463
463
  args: [{ selector: "lib-add-user-popup", template: "<div class=\"card py-0 scroll\">\r\n <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"my-5\">\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 </div>\r\n <div class=\"row w-100\">\r\n <div *ngIf=\"operationType==='add'\" 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=\"operationType==='edit'\" class=\"col-md-12\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Edit User Details</a>\r\n <div class=\"sub-title\">Please Edit your user details</div>\r\n </div> -->\r\n <div *ngIf=\"operationType==='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\">View your user details</div>\r\n </div>\r\n <!-- @if ((gs.userAccess | async)?.Global_User_isEdit) { -->\r\n <div *ngIf=\"operationType==='view' && (gs.userAccess | async)?.Global_User_isEdit\"\r\n 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 <!-- } -->\r\n </div>\r\n <div class=\"fw-bold text-gray-500 my-6\" *ngIf=\"!showsingleuser && this.operationType ==='add'\">\r\n <ul class=\"text-gray-400 fw-bold fs-6\">\r\n <li>Use the template to upload multiple users at once.</li>\r\n <li>Download the template here -\r\n <a [attr.href]=\"userType ==='tango' ? '../../../assets/files/TangoUsersTemplate.xlsx' : '../../../assets/files/UsersTemplate.xlsx'\"\r\n download>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M17.5 12.5V15.8333C17.5 16.2754 17.3244 16.6993 17.0118 17.0118C16.6993 17.3244 16.2754 17.5 15.8333 17.5H4.16667C3.72464 17.5 3.30072 17.3244 2.98816 17.0118C2.67559 16.6993 2.5 16.2754 2.5 15.8333V12.5M5.83333 8.33333L10 12.5M10 12.5L14.1667 8.33333M10 12.5V2.5\"\r\n stroke=\"#009BF3\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n <span class=\"template ms-2\">Download Template</span>\r\n </a>\r\n </li>\r\n <li>Add your data to the Template File</li>\r\n <li>Upload it below for processing</li>\r\n\r\n </ul>\r\n </div>\r\n <div class=\"d-flex flex-center flex-wrap mb-5 w-100\" *ngIf=\"!showsingleuser && this.operationType ==='add'\">\r\n <input name=\"accountType\" type=\"radio\" id=\"kt_create_account_form_account_type_personal\"\r\n (change)=\"onUpload($event)\" value=\"personal\" class=\"btn-check\" ng-reflect-name=\"accountType\"\r\n ng-reflect-form-control-name=\"accountType\" ng-reflect-value=\"personal\" type=\"file\" #inputFile />\r\n <label for=\"kt_create_account_form_account_type_personal\"\r\n class=\"btn btn-outline bg-primary btn-outline-default rounded-3 w-100 p-4 mt-5\"><span\r\n class=\"fw-bold fs-4\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\"\r\n viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path\r\n d=\"M18 12.5V15.8333C18 16.2754 17.8244 16.6993 17.5118 17.0118C17.1993 17.3244 16.7754 17.5 16.3333 17.5H4.66667C4.22464 17.5 3.80072 17.3244 3.48816 17.0118C3.17559 16.6993 3 16.2754 3 15.8333V12.5M14.6667 6.66667L10.5 2.5M10.5 2.5L6.33333 6.66667M10.5 2.5V12.5\"\r\n stroke=\"white\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg> <span class=\"text-white mx-2 single-user\">Add Multiple Users</span></span>\r\n </label>\r\n <p class=\"text-gray-400 fw-bold my-3\">\r\n <span class=\"mx-2 orval\">Or </span>\r\n </p>\r\n <input type=\"radio\" id=\"kt_account_team_size_select_1\" value=\"1-1\" (click)=\"addSingleUser()\"\r\n class=\"btn-check ng-untouched ng-pristine ng-valid\" />\r\n <label for=\"kt_account_team_size_select_1\"\r\n class=\"btn btn-outline btn-outline-default rounded-3 w-100 p-4 mt-3\"><span class=\"fw-bold fs-4\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path\r\n d=\"M17.1663 17.5V15.8333C17.1663 14.9493 16.8152 14.1014 16.19 13.4763C15.5649 12.8512 14.7171 12.5 13.833 12.5H7.16634C6.28229 12.5 5.43444 12.8512 4.80932 13.4763C4.1842 14.1014 3.83301 14.9493 3.83301 15.8333V17.5M13.833 5.83333C13.833 7.67428 12.3406 9.16667 10.4997 9.16667C8.65873 9.16667 7.16634 7.67428 7.16634 5.83333C7.16634 3.99238 8.65873 2.5 10.4997 2.5C12.3406 2.5 13.833 3.99238 13.833 5.83333Z\"\r\n stroke=\"#101828\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span id=\"triggerButtonId\" class=\"mx-2 single-user fw-bold\">Add Single\r\n User</span></span></label>\r\n </div>\r\n\r\n <div class=\"w-100 h-500px scroll\" *ngIf=\"showsingleuser\">\r\n <div class=\"mt-5\" *ngIf=\"userForm\">\r\n <form [formGroup]=\"userForm\" novalidate=\"novalidate\" class=\"\">\r\n <div class=\"row px-0 me-3\">\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</label>\r\n <input type=\"text\" class=\"form-control\" id=\"username\" formControlName=\"userName\"\r\n autocomplete=\"off\">\r\n </div>\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</label>\r\n <input type=\"email\" class=\"form-control\" id=\"email\" formControlName=\"email\"\r\n autocomplete=\"off\" required>\r\n </div>\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</label>\r\n <input type=\"text\" class=\"form-control\" id=\"contact\" formControlName=\"mobileNumber\"\r\n autocomplete=\"off\" required minlength=\"10\" maxlength=\"13\"\r\n (keypress)=\"omit_special_char($event)\">\r\n </div>\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</label>\r\n <select class=\"form-select\" formControlName=\"role\"\r\n (change)=\"onRoleChange(userForm.get('role')?.value)\">\r\n <option value=\"superadmin\">Super Admin</option>\r\n <option value=\"admin\">Admin</option>\r\n <option value=\"user\">User</option>\r\n </select>\r\n </div>\r\n <div *ngIf=\"userType === 'tango'\" class=\"col-md-12 col-lg-6 col-xl-6 col-xxl-6 mb-7\">\r\n <label for=\"tangoUserType\" class=\"form-label\">User Type</label>\r\n <select class=\"form-select\" formControlName=\"tangoUserType\"\r\n (change)=\"onRoleChange(userForm.get('tangoUserType')?.value)\">\r\n <option value=\"dashboard\">Dashboard</option>\r\n <option value=\"audit\">Audit</option>\r\n </select>\r\n </div>\r\n </div>\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bolder mb-0 title cursor-pointer\">Access for\r\n {{userForm.get('role')?.value | titlecase}}</a>\r\n <div class=\"sub-title font-sub\">{{userForm.get('role')?.value | titlecase}} can access respective\r\n enabled features and products</div>\r\n <ng-container *ngIf=\"getPermissions().length\">\r\n <ng-container formArrayName=\"permission\">\r\n <ng-container *ngFor=\"let permission of getPermissions().controls; let i = index\"\r\n [formGroupName]=\"i\">\r\n <div class=\"my-6\">\r\n <div class=\"row me-3\">\r\n <div class=\"col-6\">\r\n <div class=\"title fw-semibold\">\r\n {{ permission.get('featureName')?.value | titlecase }}\r\n\r\n </div>\r\n </div>\r\n <div class=\"col-6 d-flex justify-content-end\" (click)=\"toggleCollapse(i)\">\r\n <div class=\"text-end\">\r\n @if (!isExpanded[i]) {\r\n <svg width=\"13\" height=\"8\" viewBox=\"0 0 13 8\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M1.5 1.5L6.5 6.5L11.5 1.5\" stroke=\"#667085\"\r\n stroke-width=\"1.67\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n } @else {\r\n <svg width=\"12\" height=\"8\" viewBox=\"0 0 12 8\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path d=\"M11 6.5L6 1.5L1 6.5\" stroke=\"#667085\" stroke-width=\"1.67\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n <div [ngClass]=\"{ 'collapsed': !isExpanded[i] }\">\r\n <div class=\"table-responsive my-2 me-3\">\r\n <table class=\"w-100\">\r\n <thead>\r\n <tr>\r\n <th>Modules</th>\r\n <th>View</th>\r\n <th>Edit</th>\r\n <th>Download</th>\r\n <th>Delete</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <ng-container *ngIf=\"permission.get('product')\"\r\n formArrayName=\"product\">\r\n <ng-container\r\n *ngFor=\"let product of getFeaturePermissions(permission)?.controls;let j=index;\"\r\n [formGroupName]=\"j\">\r\n <tr>\r\n <td>{{ camelCaseToText(product.get('name')?.value) }}\r\n </td>\r\n <td><input formControlName=\"isView\" type=\"checkbox\"\r\n class=\"cursor-pointer\"\r\n (change)=\"handleAddChange(product)\"></td>\r\n <td><input formControlName=\"isEdit\" type=\"checkbox\"\r\n class=\"cursor-pointer\"\r\n (change)=\"handleEditChange(product)\"></td>\r\n <td><input formControlName=\"isDownload\" type=\"checkbox\"\r\n class=\"cursor-pointer\"\r\n [disabled]=\"!product.get('isEdit')?.value || !product.get('isView')?.value\">\r\n </td>\r\n <td><input formControlName=\"isDelete\" type=\"checkbox\"\r\n class=\"cursor-pointer\"\r\n [disabled]=\"!product.get('isEdit')?.value || !product.get('isView')?.value\">\r\n </td>\r\n </tr>\r\n </ng-container>\r\n </ng-container>\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n </ng-container>\r\n </ng-container>\r\n\r\n <div *ngIf=\"operationType!=='view'\" class=\"d-flex my-14\" role=\"group\">\r\n <button class=\"btn btn-outline w-100 mx-3\" (click)=\"cancel()\">Cancel</button>\r\n <button class=\"btn btn-primary w-100 mx-3\" [disabled]=\"userForm.invalid\" id=\"alert-toast\"\r\n (click)=\"onSubmit()\">Submit</button>\r\n </div>\r\n </form>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n</div>", styles: [".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}li{color:var(--Gray-700, #344054)!important;font-family:Inter;font-size:14px!important;font-weight:500!important;line-height:30px;list-style:decimal!important}.scroll{overflow-y:auto;overflow-x:hidden}.template{color:var(--Primary-700, #009BF3)!important;font-family:Inter;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize}.orval{color:var(--Gray-700, #344054);font-size:14px;font-weight:400!important;line-height:20px}.single-user{color:var(--Gray-700, #344054);font-size:16px!important;line-height:24px;text-transform:capitalize}.form-label{color:var(--Gray-700, #344054);text-shadow:0px 0px 0px #D5EFFE,0px 1px 2px rgba(16,24,40,.05);font-size:14px;font-weight:500;line-height:20px}.form-control:focus{border-radius:8px;border:1px solid var(--Primary-300, #6BCAFF)!important;background:var(--White, #FFF)!important;box-shadow:0 0 0 4px #d5effe,0 1px 2px #1018280d!important}.font-sub{font-size:12px!important;line-height:18px!important}.accordion-item{color:var(--bs-accordion-color);background-color:var(--bs-accordion-bg);border:none!important}.divider{border-bottom:1px solid #D0D5DD;width:75%;margin-left:2%;background:var(--Gray-300, #D0D5DD)}input[type=checkbox]{width:20px!important;height:20px!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}.collapsed{display:none}.divider{border-right:1px solid #ccc;margin-left:10px;margin-right:10px}\n"] }]
464
464
  }], ctorParameters: () => [{ type: i1.NgbActiveModal }, { type: i0.ChangeDetectorRef }, { type: i1.NgbModal }, { type: i2.FormBuilder }, { type: i3.UserService }, { type: i4.ToastService }, { type: i5.GlobalStateService }], propDecorators: { type: [{
@@ -370,10 +370,10 @@ export class AssignStorePopupComponent {
370
370
  closeModal() {
371
371
  this.activeModal.close('submit');
372
372
  }
373
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: AssignStorePopupComponent, deps: [{ token: i1.UserService }, { token: i0.ChangeDetectorRef }, { token: i2.ToastService }, { token: i3.NgbActiveModal }], target: i0.ɵɵFactoryTarget.Component });
374
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.11", type: AssignStorePopupComponent, selector: "lib-assign-store-popup", inputs: { user: "user" }, host: { listeners: { "document:click": "onClick($event)" } }, ngImport: i0, template: "<div class=\"card assign-store py-0 scroll\">\r\n <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"my-5\">\r\n <!-- <div class=\"symbol symbol-75px symbol-circle\">\r\n <img alt=\"Pic\" src=\"./assets/tango/Icons/assign-adduser.svg\">\r\n </div> -->\r\n </div>\r\n <a class=\"title\">Assign User</a>\r\n <span class=\"sub-title my-2\">Please assign the user</span>\r\n <ul class=\"nav nav-stretch nav-line-tabs1 nav-line-tabs border-transparent flex-nowrap \">\r\n\r\n <li class=\"nav-item nav-item1\" (click)=\"select='stores'; storesType($event)\">\r\n <a [ngClass]=\"select === 'stores' ? 'active' : ''\"\r\n class=\"nav-link nav-link1 cursor-pointer tab-title me-6\">Stores</a>\r\n </li>\r\n <li class=\"nav-item nav-item1\" (click)=\"select='clusters'; storesType($event)\"><a\r\n [ngClass]=\"select === 'clusters' ? 'active' : ''\"\r\n class=\"nav-link nav-link1 cursor-pointer no-border tab-title me-6\">Cluster</a>\r\n </li>\r\n <li class=\"nav-item nav-item1\" (click)=\"select='teams'; storesType($event)\"><a\r\n [ngClass]=\"select === 'teams' ? 'active' : ''\"\r\n class=\"nav-link nav-link1 cursor-pointer no-border tab-title me-6\">Teams</a>\r\n </li>\r\n </ul>\r\n <div *ngIf=\"select ==='stores'\" class=\"w-100 my-5\">\r\n <div class=\"my-5 dropdown1 cursor-pointer h-700\" *ngFor=\"let item of [dataObject[0]]; let i = index\">\r\n <label for=\"storeList\" class=\"form-label\">Select Stores</label>\r\n <input autocomplete=\"off\" type=\"text\" class=\"form-control disable\" id=\"storeName\" [ngModel]=\"selectedTextstores\"\r\n placeholder=\"Select Stores\" (click)=\"Dropdown('Stores',0,$event)\" readonly>\r\n <div *ngIf=\"item.isOpen\" class=\"dropdown-content position-absolute\">\r\n <div class=\"form-check d-flex align-items-center pt-3 px-5\">\r\n <input class=\"form-check-input\" type=\"checkbox\" value=\"Select All\" id=\"selectall{{i}}\"\r\n [checked]=\"selectedValuesArray[i]?.length === item.Stores.length\"\r\n (click)=\"toggleCheckboxStores($event,'Select All', 0,0)\">\r\n <label class=\"form-check-label px-3\" for=\"selectall{{i}}\">\r\n Select All\r\n </label>\r\n </div>\r\n <div class=\"border border-gray mt-3\"></div>\r\n <div *ngFor=\"let store of item.Stores;let j=index;\"\r\n class=\"form-check d-flex align-items-center py-3 px-5\">\r\n <input class=\"form-check-input cursor-pointer\" type=\"checkbox\" [value]=\"store.storeName\"\r\n id=\"option{{store.storeName}}\" [checked]=\"store.checked\"\r\n (click)=\"toggleCheckboxStores($event,store,0,j)\">\r\n <label class=\"form-check-label px-3 cursor-pointer\" for=\"option{{store.storeName}}\">\r\n {{ store.storeName }}\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"select ==='clusters'\" class=\"w-100 my-5\"> \r\n <div class=\"my-5 dropdown1 cursor-pointer h-700\" *ngFor=\"let item of [dataObject[1]]; let i = index\">\r\n <label for=\"storeList\" class=\"form-label\">Select Cluster</label>\r\n <input autocomplete=\"off\" type=\"text\" class=\"form-control disable\" id=\"clusterName\" [ngModel]=\"selectedTextclusters\"\r\n placeholder=\"Select Clusters\" (click)=\"Dropdown('clusters',1,$event)\" readonly>\r\n <div *ngIf=\"item.isOpen\" class=\"dropdown-content position-absolute\">\r\n <div class=\"form-check d-flex align-items-center pt-3 px-5\">\r\n <input class=\"form-check-input\" type=\"checkbox\" value=\"Select All\" id=\"selectall{{i}}\"\r\n [checked]=\"selectedValuesArray[1]?.length === item.clusters.length\"\r\n (click)=\"toggleCheckboxclusters($event,'Select All', 1,0)\">\r\n <label class=\"form-check-label px-3\" for=\"selectall{{i}}\">\r\n Select All\r\n </label>\r\n </div>\r\n <div class=\"border border-gray mt-3\"></div>\r\n <div *ngFor=\"let cluster of item.clusters;let j=index;\"\r\n class=\"form-check d-flex align-items-center py-3 px-5\">\r\n <input class=\"form-check-input cursor-pointer\" type=\"checkbox\" [value]=\"cluster.clusterName\"\r\n id=\"option{{cluster.clusterName}}\" [checked]=\"cluster.checked\"\r\n (click)=\"toggleCheckboxclusters($event,cluster,1,j)\">\r\n <label class=\"form-check-label px-3 cursor-pointer\" for=\"option{{cluster.clusterName}}\">\r\n {{ cluster.clusterName }}\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"select ==='teams'\" class=\"w-100 my-5\"> \r\n <div class=\"my-5 dropdown1 cursor-pointer h-700\" *ngFor=\"let item of [dataObject[2]]; let i = index\">\r\n <label for=\"storeList\" class=\"form-label\">Select Teams</label>\r\n <input autocomplete=\"off\" type=\"text\" class=\"form-control disable\" id=\"teamName\" [ngModel]=\"selectedTextteams\"\r\n placeholder=\"Select Teams\" (click)=\"Dropdown('teams',2,$event)\" readonly>\r\n <div *ngIf=\"item.isOpen\" class=\"dropdown-content position-absolute\">\r\n <div class=\"form-check d-flex align-items-center pt-3 px-5\">\r\n <input class=\"form-check-input\" type=\"checkbox\" value=\"Select All\" id=\"selectall{{i}}\"\r\n [checked]=\"selectedValuesArray[2]?.length === item.teams.length\"\r\n (click)=\"toggleCheckboxTeams($event,'Select All', 2,0)\">\r\n <label class=\"form-check-label px-3\" for=\"selectall{{i}}\">\r\n Select All\r\n </label>\r\n </div>\r\n <div class=\"border border-gray mt-3\"></div>\r\n <div *ngFor=\"let team of item.teams;let j=index;\"\r\n class=\"form-check d-flex align-items-center py-3 px-5\">\r\n <input class=\"form-check-input cursor-pointer\" type=\"checkbox\" [value]=\"team.teamName\"\r\n id=\"option{{team.teamName}}\" [checked]=\"team.checked\"\r\n (click)=\"toggleCheckboxTeams($event,team,2,j)\">\r\n <label class=\"form-check-label px-3 cursor-pointer\" for=\"option{{team.teamName}}\">\r\n {{ team.teamName }}\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <h2 class=\"store-info fw-bold\">\r\n @if(select ==='stores') {\r\n Store \r\n } @else if(select ==='clusters') {\r\n Cluster\r\n }@else if(select ==='teams') {\r\n Teams\r\n }\r\n Information\r\n </h2>\r\n\r\n <section *ngIf=\"select ==='stores'\" class=\"w-100\">\r\n <div class=\"table-responsive h-200px mb-3 scroll\">\r\n <table class=\"table bottom-border mt-2 mb-4\">\r\n <thead>\r\n <tr>\r\n <th>SPOC Name</th>\r\n <th>Store ID</th>\r\n <th>Application ID</th>\r\n <th>Location</th>\r\n </tr>\r\n </thead>\r\n <tbody> \r\n <tr *ngFor=\"let store of stores;let i=index\">\r\n <td>{{store?.spocName}}</td>\r\n <td>{{store?.storeId}}</td>\r\n <td>{{store?.appId}}</td>\r\n <td>{{store?.location}}</td>\r\n </tr> \r\n </tbody>\r\n </table>\r\n </div>\r\n @if (selectedValuesArray[0].length) {\r\n <div class=\"d-flex align-items-center bg-assign-user w-100 mb-5 mx-2\">\r\n <span><svg width=\"36\" height=\"36\" viewBox=\"0 0 36 36\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"2\" y=\"2\" width=\"32\" height=\"32\" rx=\"16\" fill=\"#DAF1FF\" />\r\n <rect x=\"2\" y=\"2\" width=\"32\" height=\"32\" rx=\"16\" stroke=\"#EAF8FF\" stroke-width=\"4\" />\r\n <path\r\n d=\"M23.3327 24V22.6667C23.3327 21.9594 23.0517 21.2811 22.5516 20.781C22.0515 20.281 21.3733 20 20.666 20H15.3327C14.6254 20 13.9472 20.281 13.4471 20.781C12.947 21.2811 12.666 21.9594 12.666 22.6667V24M20.666 14.6667C20.666 16.1394 19.4721 17.3333 17.9993 17.3333C16.5266 17.3333 15.3327 16.1394 15.3327 14.6667C15.3327 13.1939 16.5266 12 17.9993 12C19.4721 12 20.666 13.1939 20.666 14.6667Z\"\r\n stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n <span class=\"mt-2 form-check-label ms-5\">The user {{user?.userName}} is assigned to the above stores.</span>\r\n </div>\r\n }\r\n </section>\r\n <section *ngIf=\"select ==='clusters'\" class=\"w-100\">\r\n <div class=\"table-responsive h-200px mb-3 scroll\">\r\n <table class=\"table bottom-border mt-2 mb-4\">\r\n <thead>\r\n <tr>\r\n <th class=\"ms-5\">Cluster Name</th>\r\n <th>Stores</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let cluster of this.selectedValuesArray[1];let i=index;\">\r\n <td class=\"ms-5\">{{cluster?.clusterName}}</td>\r\n <td>{{cluster?.storeNames}} <span *ngIf=\"cluster?.storeListCount > 2\" class=\"justify-content-center align-items-center blend-mode ms-3\">+{{cluster?.storeListCount - 2}}</span></td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </div>\r\n @if (selectedValuesArray[1].length) {\r\n <div class=\"d-flex align-items-center bg-assign-user w-100 mb-5 mx-2\">\r\n <span><svg width=\"36\" height=\"36\" viewBox=\"0 0 36 36\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"2\" y=\"2\" width=\"32\" height=\"32\" rx=\"16\" fill=\"#DAF1FF\" />\r\n <rect x=\"2\" y=\"2\" width=\"32\" height=\"32\" rx=\"16\" stroke=\"#EAF8FF\" stroke-width=\"4\" />\r\n <path\r\n d=\"M23.3327 24V22.6667C23.3327 21.9594 23.0517 21.2811 22.5516 20.781C22.0515 20.281 21.3733 20 20.666 20H15.3327C14.6254 20 13.9472 20.281 13.4471 20.781C12.947 21.2811 12.666 21.9594 12.666 22.6667V24M20.666 14.6667C20.666 16.1394 19.4721 17.3333 17.9993 17.3333C16.5266 17.3333 15.3327 16.1394 15.3327 14.6667C15.3327 13.1939 16.5266 12 17.9993 12C19.4721 12 20.666 13.1939 20.666 14.6667Z\"\r\n stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n <span class=\"mt-2 form-check-label ms-5\">The user {{user?.userName}} is assigned as a member to the above\r\n clusters.</span>\r\n </div>\r\n }\r\n </section>\r\n <section *ngIf=\"select ==='teams'\" class=\"w-100\">\r\n <div class=\"table-responsive h-200px mb-3 scroll\">\r\n <table class=\"table bottom-border mt-2 mb-4\">\r\n <thead>\r\n <tr>\r\n <th class=\"ms-5\">Team Name</th>\r\n <th>Users</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let team of this.selectedValuesArray[2];let i=index;\">\r\n <td class=\"ms-5\">{{team?.teamName}}</td>\r\n <td>{{team?.userNames}} <span *ngIf=\"team?.userListCount > 2\" class=\"justify-content-center align-items-center blend-mode ms-3\">+{{team?.userListCount - 2}}</span></td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </div>\r\n @if (selectedValuesArray[2].length) {\r\n <div class=\"d-flex align-items-center bg-assign-user w-100 mb-5 mx-2\">\r\n <span><svg width=\"36\" height=\"36\" viewBox=\"0 0 36 36\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"2\" y=\"2\" width=\"32\" height=\"32\" rx=\"16\" fill=\"#DAF1FF\" />\r\n <rect x=\"2\" y=\"2\" width=\"32\" height=\"32\" rx=\"16\" stroke=\"#EAF8FF\" stroke-width=\"4\" />\r\n <path\r\n d=\"M23.3327 24V22.6667C23.3327 21.9594 23.0517 21.2811 22.5516 20.781C22.0515 20.281 21.3733 20 20.666 20H15.3327C14.6254 20 13.9472 20.281 13.4471 20.781C12.947 21.2811 12.666 21.9594 12.666 22.6667V24M20.666 14.6667C20.666 16.1394 19.4721 17.3333 17.9993 17.3333C16.5266 17.3333 15.3327 16.1394 15.3327 14.6667C15.3327 13.1939 16.5266 12 17.9993 12C19.4721 12 20.666 13.1939 20.666 14.6667Z\"\r\n stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n <span class=\"mt-2 form-check-label ms-5\">The user {{user?.userName}} is assigned as a member to the above\r\n teams.</span>\r\n </div>\r\n }\r\n </section>\r\n\r\n <div class=\"d-flex mb-10 w-100\" role=\"cluster\">\r\n <button class=\"btn btn-outline w-100 mx-3\" (click)=\"closeModal()\">Cancel</button>\r\n <button class=\"btn btn-primary w-100 mx-3\" (click)=\"onSubmit()\">Submit</button>\r\n </div>\r\n\r\n\r\n </div>\r\n</div>", styles: [".assign-store .form-check-label{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:500!important;line-height:20px}.assign-store .store-info{color:var(--Gray-700, #344054)!important;font-size:18px!important;font-weight:600;line-height:28px}.assign-store .table-title{line-height:24px!important;color:var(--Gray-500, #344054)!important;font-size:16px!important;font-weight:500!important}.assign-store .table-sub{line-height:30px!important;color:var(--Gray-500, #667085)!important;font-size:14px!important;font-weight:400!important}.assign-store .bg-assign-user{border-radius:4px;border-left:2px solid var(--Primary-600, #00A3FF);background:var(--Primary-25, #F6FCFF);height:68px;padding:6px 8px 6px 16px}.assign-store td{padding:16px 24px!important}.assign-store .blend-mode{mix-blend-mode:multiply;border-radius:16px;background:var(--Gray-100, #F2F4F7);color:var(--Gray-700, #344054);text-align:center;font-size:12px;font-weight:500;line-height:18px;padding:2px 8px}.scroll{overflow-y:auto;overflow-x:hidden}.radio-custom{opacity:0;position:absolute}.radio-custom,.radio-custom-label{display:inline-block;vertical-align:middle;margin:5px 0;cursor:pointer}.radio-custom-label{position:relative}.radio-custom+.radio-custom-label:before{content:\"\";background:#fff;border:2px solid #00A3FF;display:inline-block;vertical-align:middle;width:20px;height:20px;padding:2px;margin-right:10px;text-align:center}.radio-custom+.radio-custom-label:before{border-radius:50%}.radio-custom:checked+.radio-custom-label:before{background:#00a3ff;box-shadow:inset 0 0 0 4.5px #eaf8ff}.text-muted{content:\"\";margin-top:5.1px;border-radius:50%;border:1px solid var(--Gray-300, #D0D5DD);background:var(--White, #FFF);display:inline-block;vertical-align:middle;width:20px;height:20px;padding:2px;margin-left:0;text-align:center}.ms-0{margin-left:-.75rem!important}.dropdown1 .dropdown-title{color:var(--Gray-900, #101828);font-size:16px;font-weight:600;line-height:24px}.dropdown1 .dropdown{position:relative;display:inline-block}.dropdown1 .dropdown span{color:var(--Gray-700, #344054);font-size:14px;font-weight:600;line-height:20px}.dropdown1 .dropdown-content{z-index:1;padding:0;min-height:auto!important;max-height:285px!important;overflow:auto;border-radius:12px;background:var(--White, #FFF);box-shadow:0 8px 8px -4px #10182808,0 20px 24px -4px #10182814;width:90%}.dropdown1 .dropdown-content label{color:var(--Gray-700, #344054);font-size:14px;font-weight:500;line-height:20px}.dropdown1 .dropdown-content a{color:#000;padding:12px 16px;text-decoration:none;display:block}.dropdown1 .dropdown button{padding:10px;font-size:16px;cursor:pointer}.dropdown1 input[type=checkbox]{width:16px!important;height:16px!important;margin:-3px 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}.dropdown1 input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}.dropdown1 input[type=checkbox]:checked:after{content:\"\";transform:rotate(45deg);border-bottom:2px solid #00A3FF;border-right:2px solid #00A3FF;display:inline-block;width:.2em;padding-left:0;padding-top:9px;padding-right:4px}.nav-item1 .nav-link1.active{border:none;border-radius:0;background:var(--Primary-50, #EAF8FF);border-bottom:2px solid #009BF3!important;padding:12px}.nav-item1 .nav-link1:hover{border:none}\n"], dependencies: [{ kind: "directive", type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
373
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AssignStorePopupComponent, deps: [{ token: i1.UserService }, { token: i0.ChangeDetectorRef }, { token: i2.ToastService }, { token: i3.NgbActiveModal }], target: i0.ɵɵFactoryTarget.Component });
374
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: AssignStorePopupComponent, selector: "lib-assign-store-popup", inputs: { user: "user" }, host: { listeners: { "document:click": "onClick($event)" } }, ngImport: i0, template: "<div class=\"card assign-store py-0 scroll\">\r\n <div class=\"card-body py-0 d-flex flex-start flex-column p-9 \">\r\n <div class=\"my-5\">\r\n <!-- <div class=\"symbol symbol-75px symbol-circle\">\r\n <img alt=\"Pic\" src=\"./assets/tango/Icons/assign-adduser.svg\">\r\n </div> -->\r\n </div>\r\n <a class=\"title\">Assign User</a>\r\n <span class=\"sub-title my-2\">Please assign the user</span>\r\n <ul class=\"nav nav-stretch nav-line-tabs1 nav-line-tabs border-transparent flex-nowrap \">\r\n\r\n <li class=\"nav-item nav-item1\" (click)=\"select='stores'; storesType($event)\">\r\n <a [ngClass]=\"select === 'stores' ? 'active' : ''\"\r\n class=\"nav-link nav-link1 cursor-pointer tab-title me-6\">Stores</a>\r\n </li>\r\n <li class=\"nav-item nav-item1\" (click)=\"select='clusters'; storesType($event)\"><a\r\n [ngClass]=\"select === 'clusters' ? 'active' : ''\"\r\n class=\"nav-link nav-link1 cursor-pointer no-border tab-title me-6\">Cluster</a>\r\n </li>\r\n <li class=\"nav-item nav-item1\" (click)=\"select='teams'; storesType($event)\"><a\r\n [ngClass]=\"select === 'teams' ? 'active' : ''\"\r\n class=\"nav-link nav-link1 cursor-pointer no-border tab-title me-6\">Teams</a>\r\n </li>\r\n </ul>\r\n <div *ngIf=\"select ==='stores'\" class=\"w-100 my-5\">\r\n <div class=\"my-5 dropdown1 cursor-pointer h-700\" *ngFor=\"let item of [dataObject[0]]; let i = index\">\r\n <label for=\"storeList\" class=\"form-label\">Select Stores</label>\r\n <input autocomplete=\"off\" type=\"text\" class=\"form-control disable\" id=\"storeName\" [ngModel]=\"selectedTextstores\"\r\n placeholder=\"Select Stores\" (click)=\"Dropdown('Stores',0,$event)\" readonly>\r\n <div *ngIf=\"item.isOpen\" class=\"dropdown-content position-absolute\">\r\n <div class=\"form-check d-flex align-items-center pt-3 px-5\">\r\n <input class=\"form-check-input\" type=\"checkbox\" value=\"Select All\" id=\"selectall{{i}}\"\r\n [checked]=\"selectedValuesArray[i]?.length === item.Stores.length\"\r\n (click)=\"toggleCheckboxStores($event,'Select All', 0,0)\">\r\n <label class=\"form-check-label px-3\" for=\"selectall{{i}}\">\r\n Select All\r\n </label>\r\n </div>\r\n <div class=\"border border-gray mt-3\"></div>\r\n <div *ngFor=\"let store of item.Stores;let j=index;\"\r\n class=\"form-check d-flex align-items-center py-3 px-5\">\r\n <input class=\"form-check-input cursor-pointer\" type=\"checkbox\" [value]=\"store.storeName\"\r\n id=\"option{{store.storeName}}\" [checked]=\"store.checked\"\r\n (click)=\"toggleCheckboxStores($event,store,0,j)\">\r\n <label class=\"form-check-label px-3 cursor-pointer\" for=\"option{{store.storeName}}\">\r\n {{ store.storeName }}\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"select ==='clusters'\" class=\"w-100 my-5\"> \r\n <div class=\"my-5 dropdown1 cursor-pointer h-700\" *ngFor=\"let item of [dataObject[1]]; let i = index\">\r\n <label for=\"storeList\" class=\"form-label\">Select Cluster</label>\r\n <input autocomplete=\"off\" type=\"text\" class=\"form-control disable\" id=\"clusterName\" [ngModel]=\"selectedTextclusters\"\r\n placeholder=\"Select Clusters\" (click)=\"Dropdown('clusters',1,$event)\" readonly>\r\n <div *ngIf=\"item.isOpen\" class=\"dropdown-content position-absolute\">\r\n <div class=\"form-check d-flex align-items-center pt-3 px-5\">\r\n <input class=\"form-check-input\" type=\"checkbox\" value=\"Select All\" id=\"selectall{{i}}\"\r\n [checked]=\"selectedValuesArray[1]?.length === item.clusters.length\"\r\n (click)=\"toggleCheckboxclusters($event,'Select All', 1,0)\">\r\n <label class=\"form-check-label px-3\" for=\"selectall{{i}}\">\r\n Select All\r\n </label>\r\n </div>\r\n <div class=\"border border-gray mt-3\"></div>\r\n <div *ngFor=\"let cluster of item.clusters;let j=index;\"\r\n class=\"form-check d-flex align-items-center py-3 px-5\">\r\n <input class=\"form-check-input cursor-pointer\" type=\"checkbox\" [value]=\"cluster.clusterName\"\r\n id=\"option{{cluster.clusterName}}\" [checked]=\"cluster.checked\"\r\n (click)=\"toggleCheckboxclusters($event,cluster,1,j)\">\r\n <label class=\"form-check-label px-3 cursor-pointer\" for=\"option{{cluster.clusterName}}\">\r\n {{ cluster.clusterName }}\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"select ==='teams'\" class=\"w-100 my-5\"> \r\n <div class=\"my-5 dropdown1 cursor-pointer h-700\" *ngFor=\"let item of [dataObject[2]]; let i = index\">\r\n <label for=\"storeList\" class=\"form-label\">Select Teams</label>\r\n <input autocomplete=\"off\" type=\"text\" class=\"form-control disable\" id=\"teamName\" [ngModel]=\"selectedTextteams\"\r\n placeholder=\"Select Teams\" (click)=\"Dropdown('teams',2,$event)\" readonly>\r\n <div *ngIf=\"item.isOpen\" class=\"dropdown-content position-absolute\">\r\n <div class=\"form-check d-flex align-items-center pt-3 px-5\">\r\n <input class=\"form-check-input\" type=\"checkbox\" value=\"Select All\" id=\"selectall{{i}}\"\r\n [checked]=\"selectedValuesArray[2]?.length === item.teams.length\"\r\n (click)=\"toggleCheckboxTeams($event,'Select All', 2,0)\">\r\n <label class=\"form-check-label px-3\" for=\"selectall{{i}}\">\r\n Select All\r\n </label>\r\n </div>\r\n <div class=\"border border-gray mt-3\"></div>\r\n <div *ngFor=\"let team of item.teams;let j=index;\"\r\n class=\"form-check d-flex align-items-center py-3 px-5\">\r\n <input class=\"form-check-input cursor-pointer\" type=\"checkbox\" [value]=\"team.teamName\"\r\n id=\"option{{team.teamName}}\" [checked]=\"team.checked\"\r\n (click)=\"toggleCheckboxTeams($event,team,2,j)\">\r\n <label class=\"form-check-label px-3 cursor-pointer\" for=\"option{{team.teamName}}\">\r\n {{ team.teamName }}\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <h2 class=\"store-info fw-bold\">\r\n @if(select ==='stores') {\r\n Store \r\n } @else if(select ==='clusters') {\r\n Cluster\r\n }@else if(select ==='teams') {\r\n Teams\r\n }\r\n Information\r\n </h2>\r\n\r\n <section *ngIf=\"select ==='stores'\" class=\"w-100\">\r\n <div class=\"table-responsive h-200px mb-3 scroll\">\r\n <table class=\"table bottom-border mt-2 mb-4\">\r\n <thead>\r\n <tr>\r\n <th>SPOC Name</th>\r\n <th>Store ID</th>\r\n <th>Application ID</th>\r\n <th>Location</th>\r\n </tr>\r\n </thead>\r\n <tbody> \r\n <tr *ngFor=\"let store of stores;let i=index\">\r\n <td>{{store?.spocName}}</td>\r\n <td>{{store?.storeId}}</td>\r\n <td>{{store?.appId}}</td>\r\n <td>{{store?.location}}</td>\r\n </tr> \r\n </tbody>\r\n </table>\r\n </div>\r\n @if (selectedValuesArray[0].length) {\r\n <div class=\"d-flex align-items-center bg-assign-user w-100 mb-5 mx-2\">\r\n <span><svg width=\"36\" height=\"36\" viewBox=\"0 0 36 36\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"2\" y=\"2\" width=\"32\" height=\"32\" rx=\"16\" fill=\"#DAF1FF\" />\r\n <rect x=\"2\" y=\"2\" width=\"32\" height=\"32\" rx=\"16\" stroke=\"#EAF8FF\" stroke-width=\"4\" />\r\n <path\r\n d=\"M23.3327 24V22.6667C23.3327 21.9594 23.0517 21.2811 22.5516 20.781C22.0515 20.281 21.3733 20 20.666 20H15.3327C14.6254 20 13.9472 20.281 13.4471 20.781C12.947 21.2811 12.666 21.9594 12.666 22.6667V24M20.666 14.6667C20.666 16.1394 19.4721 17.3333 17.9993 17.3333C16.5266 17.3333 15.3327 16.1394 15.3327 14.6667C15.3327 13.1939 16.5266 12 17.9993 12C19.4721 12 20.666 13.1939 20.666 14.6667Z\"\r\n stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n <span class=\"mt-2 form-check-label ms-5\">The user {{user?.userName}} is assigned to the above stores.</span>\r\n </div>\r\n }\r\n </section>\r\n <section *ngIf=\"select ==='clusters'\" class=\"w-100\">\r\n <div class=\"table-responsive h-200px mb-3 scroll\">\r\n <table class=\"table bottom-border mt-2 mb-4\">\r\n <thead>\r\n <tr>\r\n <th class=\"ms-5\">Cluster Name</th>\r\n <th>Stores</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let cluster of this.selectedValuesArray[1];let i=index;\">\r\n <td class=\"ms-5\">{{cluster?.clusterName}}</td>\r\n <td>{{cluster?.storeNames}} <span *ngIf=\"cluster?.storeListCount > 2\" class=\"justify-content-center align-items-center blend-mode ms-3\">+{{cluster?.storeListCount - 2}}</span></td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </div>\r\n @if (selectedValuesArray[1].length) {\r\n <div class=\"d-flex align-items-center bg-assign-user w-100 mb-5 mx-2\">\r\n <span><svg width=\"36\" height=\"36\" viewBox=\"0 0 36 36\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"2\" y=\"2\" width=\"32\" height=\"32\" rx=\"16\" fill=\"#DAF1FF\" />\r\n <rect x=\"2\" y=\"2\" width=\"32\" height=\"32\" rx=\"16\" stroke=\"#EAF8FF\" stroke-width=\"4\" />\r\n <path\r\n d=\"M23.3327 24V22.6667C23.3327 21.9594 23.0517 21.2811 22.5516 20.781C22.0515 20.281 21.3733 20 20.666 20H15.3327C14.6254 20 13.9472 20.281 13.4471 20.781C12.947 21.2811 12.666 21.9594 12.666 22.6667V24M20.666 14.6667C20.666 16.1394 19.4721 17.3333 17.9993 17.3333C16.5266 17.3333 15.3327 16.1394 15.3327 14.6667C15.3327 13.1939 16.5266 12 17.9993 12C19.4721 12 20.666 13.1939 20.666 14.6667Z\"\r\n stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n <span class=\"mt-2 form-check-label ms-5\">The user {{user?.userName}} is assigned as a member to the above\r\n clusters.</span>\r\n </div>\r\n }\r\n </section>\r\n <section *ngIf=\"select ==='teams'\" class=\"w-100\">\r\n <div class=\"table-responsive h-200px mb-3 scroll\">\r\n <table class=\"table bottom-border mt-2 mb-4\">\r\n <thead>\r\n <tr>\r\n <th class=\"ms-5\">Team Name</th>\r\n <th>Users</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngFor=\"let team of this.selectedValuesArray[2];let i=index;\">\r\n <td class=\"ms-5\">{{team?.teamName}}</td>\r\n <td>{{team?.userNames}} <span *ngIf=\"team?.userListCount > 2\" class=\"justify-content-center align-items-center blend-mode ms-3\">+{{team?.userListCount - 2}}</span></td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </div>\r\n @if (selectedValuesArray[2].length) {\r\n <div class=\"d-flex align-items-center bg-assign-user w-100 mb-5 mx-2\">\r\n <span><svg width=\"36\" height=\"36\" viewBox=\"0 0 36 36\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"2\" y=\"2\" width=\"32\" height=\"32\" rx=\"16\" fill=\"#DAF1FF\" />\r\n <rect x=\"2\" y=\"2\" width=\"32\" height=\"32\" rx=\"16\" stroke=\"#EAF8FF\" stroke-width=\"4\" />\r\n <path\r\n d=\"M23.3327 24V22.6667C23.3327 21.9594 23.0517 21.2811 22.5516 20.781C22.0515 20.281 21.3733 20 20.666 20H15.3327C14.6254 20 13.9472 20.281 13.4471 20.781C12.947 21.2811 12.666 21.9594 12.666 22.6667V24M20.666 14.6667C20.666 16.1394 19.4721 17.3333 17.9993 17.3333C16.5266 17.3333 15.3327 16.1394 15.3327 14.6667C15.3327 13.1939 16.5266 12 17.9993 12C19.4721 12 20.666 13.1939 20.666 14.6667Z\"\r\n stroke=\"#00A3FF\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>\r\n <span class=\"mt-2 form-check-label ms-5\">The user {{user?.userName}} is assigned as a member to the above\r\n teams.</span>\r\n </div>\r\n }\r\n </section>\r\n\r\n <div class=\"d-flex mb-10 w-100\" role=\"cluster\">\r\n <button class=\"btn btn-outline w-100 mx-3\" (click)=\"closeModal()\">Cancel</button>\r\n <button class=\"btn btn-primary w-100 mx-3\" (click)=\"onSubmit()\">Submit</button>\r\n </div>\r\n\r\n\r\n </div>\r\n</div>", styles: [".assign-store .form-check-label{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:500!important;line-height:20px}.assign-store .store-info{color:var(--Gray-700, #344054)!important;font-size:18px!important;font-weight:600;line-height:28px}.assign-store .table-title{line-height:24px!important;color:var(--Gray-500, #344054)!important;font-size:16px!important;font-weight:500!important}.assign-store .table-sub{line-height:30px!important;color:var(--Gray-500, #667085)!important;font-size:14px!important;font-weight:400!important}.assign-store .bg-assign-user{border-radius:4px;border-left:2px solid var(--Primary-600, #00A3FF);background:var(--Primary-25, #F6FCFF);height:68px;padding:6px 8px 6px 16px}.assign-store td{padding:16px 24px!important}.assign-store .blend-mode{mix-blend-mode:multiply;border-radius:16px;background:var(--Gray-100, #F2F4F7);color:var(--Gray-700, #344054);text-align:center;font-size:12px;font-weight:500;line-height:18px;padding:2px 8px}.scroll{overflow-y:auto;overflow-x:hidden}.radio-custom{opacity:0;position:absolute}.radio-custom,.radio-custom-label{display:inline-block;vertical-align:middle;margin:5px 0;cursor:pointer}.radio-custom-label{position:relative}.radio-custom+.radio-custom-label:before{content:\"\";background:#fff;border:2px solid #00A3FF;display:inline-block;vertical-align:middle;width:20px;height:20px;padding:2px;margin-right:10px;text-align:center}.radio-custom+.radio-custom-label:before{border-radius:50%}.radio-custom:checked+.radio-custom-label:before{background:#00a3ff;box-shadow:inset 0 0 0 4.5px #eaf8ff}.text-muted{content:\"\";margin-top:5.1px;border-radius:50%;border:1px solid var(--Gray-300, #D0D5DD);background:var(--White, #FFF);display:inline-block;vertical-align:middle;width:20px;height:20px;padding:2px;margin-left:0;text-align:center}.ms-0{margin-left:-.75rem!important}.dropdown1 .dropdown-title{color:var(--Gray-900, #101828);font-size:16px;font-weight:600;line-height:24px}.dropdown1 .dropdown{position:relative;display:inline-block}.dropdown1 .dropdown span{color:var(--Gray-700, #344054);font-size:14px;font-weight:600;line-height:20px}.dropdown1 .dropdown-content{z-index:1;padding:0;min-height:auto!important;max-height:285px!important;overflow:auto;border-radius:12px;background:var(--White, #FFF);box-shadow:0 8px 8px -4px #10182808,0 20px 24px -4px #10182814;width:90%}.dropdown1 .dropdown-content label{color:var(--Gray-700, #344054);font-size:14px;font-weight:500;line-height:20px}.dropdown1 .dropdown-content a{color:#000;padding:12px 16px;text-decoration:none;display:block}.dropdown1 .dropdown button{padding:10px;font-size:16px;cursor:pointer}.dropdown1 input[type=checkbox]{width:16px!important;height:16px!important;margin:-3px 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}.dropdown1 input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}.dropdown1 input[type=checkbox]:checked:after{content:\"\";transform:rotate(45deg);border-bottom:2px solid #00A3FF;border-right:2px solid #00A3FF;display:inline-block;width:.2em;padding-left:0;padding-top:9px;padding-right:4px}.nav-item1 .nav-link1.active{border:none;border-radius:0;background:var(--Primary-50, #EAF8FF);border-bottom:2px solid #009BF3!important;padding:12px}.nav-item1 .nav-link1:hover{border:none}\n"], dependencies: [{ kind: "directive", type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
375
375
  }
376
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: AssignStorePopupComponent, decorators: [{
376
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AssignStorePopupComponent, decorators: [{
377
377
  type: Component,
378
378
  args: [{ selector: "lib-assign-store-popup", host: {
379
379
  '(document:click)': 'onClick($event)',