tango-app-ui-manage-users 3.4.0-alpha.8 → 3.7.0-alpha.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2022/lib/components/tango-manage-users/add-user-popup/add-user-popup.component.mjs +66 -18
- package/esm2022/lib/components/tango-manage-users/assign-store-popup/assign-store-popup.component.mjs +182 -39
- package/esm2022/lib/components/tango-manage-users/audit-user/audit-user-earnings/audit-user-earnings.component.mjs +3 -3
- package/esm2022/lib/components/tango-manage-users/audit-user/audit-user-list/audit-user-list.component.mjs +3 -3
- package/esm2022/lib/components/tango-manage-users/brand-user/brand-user.component.mjs +197 -7
- package/esm2022/lib/components/tango-manage-users/group-select/group-select.component.mjs +155 -0
- package/esm2022/lib/components/tango-manage-users/roles-permission-table/roles-permission-table.component.mjs +3 -3
- package/esm2022/lib/components/tango-manage-users/tango-manage-users.component.mjs +3 -3
- package/esm2022/lib/components/tango-manage-users/user-table/alert-popup/alert-popup.component.mjs +3 -3
- package/esm2022/lib/components/tango-manage-users/user-table/user-table.component.mjs +3 -3
- package/esm2022/lib/components-v2/action-popup/action-popup.component.mjs +3 -3
- package/esm2022/lib/components-v2/add-users/add-users.component.mjs +65 -13
- package/esm2022/lib/components-v2/custom-select/custom-select.component.mjs +3 -3
- package/esm2022/lib/components-v2/teams-creation/teams-creation.component.mjs +12 -5
- package/esm2022/lib/components-v2/teams-list/teams-list.component.mjs +18 -5
- package/esm2022/lib/components-v2/users-list/users-list.component.mjs +3 -3
- package/esm2022/lib/components-v2/users-manage/users-manage.component.mjs +3 -3
- package/esm2022/lib/components-v2/viewteams-list/viewteams-list.component.mjs +28 -5
- package/esm2022/lib/services/excel.service.mjs +3 -3
- package/esm2022/lib/services/user.service.mjs +11 -4
- package/esm2022/lib/services-v2/manage-users.service.mjs +3 -3
- package/esm2022/lib/tango-manage-users-routing.module.mjs +4 -4
- package/esm2022/lib/tango-manage-users.module.mjs +8 -5
- package/fesm2022/tango-app-ui-manage-users.mjs +762 -130
- package/fesm2022/tango-app-ui-manage-users.mjs.map +1 -1
- package/lib/components/tango-manage-users/add-user-popup/add-user-popup.component.d.ts +3 -0
- package/lib/components/tango-manage-users/assign-store-popup/assign-store-popup.component.d.ts +21 -4
- package/lib/components/tango-manage-users/brand-user/brand-user.component.d.ts +19 -1
- package/lib/components/tango-manage-users/group-select/group-select.component.d.ts +33 -0
- package/lib/components-v2/add-users/add-users.component.d.ts +6 -0
- package/lib/components-v2/teams-creation/teams-creation.component.d.ts +1 -0
- package/lib/components-v2/teams-list/teams-list.component.d.ts +2 -0
- package/lib/components-v2/viewteams-list/viewteams-list.component.d.ts +3 -0
- package/lib/services/user.service.d.ts +3 -0
- package/lib/tango-manage-users.module.d.ts +10 -9
- package/package.json +1 -1
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Injectable, EventEmitter,
|
|
2
|
+
import { Injectable, EventEmitter, Output, Input, HostListener, ChangeDetectionStrategy, Component, ViewChild, NgModule } from '@angular/core';
|
|
3
3
|
import * as i6 from '@angular/common';
|
|
4
4
|
import { CommonModule } from '@angular/common';
|
|
5
5
|
import * as i2$1 from '@angular/router';
|
|
@@ -94,10 +94,10 @@ class ManageUsersService {
|
|
|
94
94
|
setViewTeam(value) {
|
|
95
95
|
this.viewTeamsSubject.next(value);
|
|
96
96
|
}
|
|
97
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
98
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.
|
|
97
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ManageUsersService, deps: [{ token: i1.HttpClient }, { token: i2.GlobalStateService }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
98
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ManageUsersService, providedIn: 'root' });
|
|
99
99
|
}
|
|
100
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
100
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ManageUsersService, decorators: [{
|
|
101
101
|
type: Injectable,
|
|
102
102
|
args: [{
|
|
103
103
|
providedIn: 'root'
|
|
@@ -114,6 +114,7 @@ class UserService {
|
|
|
114
114
|
auditWalletApiUrl = '';
|
|
115
115
|
dataSubject = new BehaviorSubject(null);
|
|
116
116
|
rolesComms = new BehaviorSubject(null);
|
|
117
|
+
dropDownTrigger = new BehaviorSubject(null);
|
|
117
118
|
clusterApiUrl = '';
|
|
118
119
|
teamsApiUrl = '';
|
|
119
120
|
constructor(http, gs) {
|
|
@@ -183,6 +184,12 @@ class UserService {
|
|
|
183
184
|
assignData(data) {
|
|
184
185
|
return this.http.post(`${this.userApiUrl}/assignData`, data).pipe(map((response) => response), catchError(this.handleError));
|
|
185
186
|
}
|
|
187
|
+
bulkUserAssign(data) {
|
|
188
|
+
return this.http.post(`${this.userApiUrl}/bulk-assign-data`, data);
|
|
189
|
+
}
|
|
190
|
+
bulkstoreAssign(data) {
|
|
191
|
+
return this.http.post(`${this.userApiUrl}/bulk-store-data`, data);
|
|
192
|
+
}
|
|
186
193
|
assignStores(data) {
|
|
187
194
|
return this.http.post(`${this.userApiUrl}/assign-store`, data).pipe(map((response) => response), catchError(this.handleError));
|
|
188
195
|
}
|
|
@@ -253,10 +260,10 @@ class UserService {
|
|
|
253
260
|
getGenerateReport(data) {
|
|
254
261
|
return this.http.get(`${this.auditWalletApiUrl}/generate-report`, { params: data });
|
|
255
262
|
}
|
|
256
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
257
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.
|
|
263
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: UserService, deps: [{ token: i1.HttpClient }, { token: i2.GlobalStateService }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
264
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: UserService, providedIn: "root" });
|
|
258
265
|
}
|
|
259
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
266
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: UserService, decorators: [{
|
|
260
267
|
type: Injectable,
|
|
261
268
|
args: [{
|
|
262
269
|
providedIn: "root",
|
|
@@ -395,10 +402,10 @@ class CustomSelectComponent {
|
|
|
395
402
|
checkIfAllSelected() {
|
|
396
403
|
return this.filteredValues.every((item) => item.isSelected);
|
|
397
404
|
}
|
|
398
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
399
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
405
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CustomSelectComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: ManageUsersService }], target: i0.ɵɵFactoryTarget.Component });
|
|
406
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: CustomSelectComponent, selector: "team-select", inputs: { items: "items", searchField: "searchField", multi: "multi", idField: "idField", selectedValues: "selectedValues", disabled: "disabled", label: "label" }, outputs: { selected: "selected", deselected: "deselected", deselectedAll: "deselectedAll" }, host: { listeners: { "document:click": "onClick($event)" } }, usesOnChanges: true, ngImport: i0, template: "<div class=\"outer-container\">\r\n <div [ngClass]=\"disabled ? 'disable-input':''\" (click)=\"openDropdown($event)\" class=\"form-select\">\r\n <ng-container *ngIf=\"multi\" >\r\n <span *ngIf=\"selectedValues?.length\" class=\"select-value mx-2\"> <img class=\"me-2\" alt=\"Pic\" src=\"./assets/tango/Image/users-teams.svg\">{{selectedValues?.[0]?.[searchField]}}</span> \r\n <span *ngIf=\"selectedValues?.length > 1\" class=\"select-value mx-2\"><img class=\"me-2\" alt=\"Pic\" src=\"./assets/tango/Image/users-teams.svg\">{{selectedValues?.[1]?.[searchField]}}</span> \r\n <span class=\"select-value mx-2\" *ngIf=\"selectedValues?.length > 2\">+{{selectedValues?.length -2}}</span> {{label}} \r\n </ng-container>\r\n <ng-container *ngIf=\"!multi\" >\r\n {{selectedValues?.[0]?.[searchField]}}\r\n </ng-container>\r\n </div>\r\n <div [ngClass]=\"showDropdown ? '' : 'd-none'\" class=\"input-container dropdown\" >\r\n <div class=\"w-100 input-wrapper\">\r\n <input [(ngModel)]=\"searchValue\" placeholder=\"Search\" (input)=\"onInput($event)\" type=\"text\"> \r\n <svg class=\"search-icon\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"17\" viewBox=\"0 0 16 17\" fill=\"none\">\r\n <path d=\"M14 14.5L11.1 11.6M12.6667 7.83333C12.6667 10.7789 10.2789 13.1667 7.33333 13.1667C4.38781 13.1667 2 10.7789 2 7.83333C2 4.88781 4.38781 2.5 7.33333 2.5C10.2789 2.5 12.6667 4.88781 12.6667 7.83333Z\" stroke=\"#667085\" stroke-width=\"1.3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg> \r\n </div>\r\n <ul>\r\n <li *ngIf=\"multi && filteredValues?.length\">\r\n <label class=\"form-check\" [for]=\"instanceId\">\r\n <input (change)=\"onSelectAll($event)\" [checked]=\"checkIfAllSelected()\" class=\"form-check-input me-3\" type=\"checkbox\"\r\n [id]=\"instanceId\">\r\n <span class=\"form-check-label\" >\r\n Select All\r\n </span>\r\n </label>\r\n </li>\r\n <li *ngFor=\"let item of filteredValues\" [ngClass]=\"item.isSelected && !multi ? 'selected' : ''\" >\r\n <label [for]=\"item[idField] + instanceId\" [ngClass]=\"multi ? '': 'ps-0'\" class=\"form-check\">\r\n <input [ngClass]=\"multi ? '': 'd-none'\" (change)=\"onSelect($event, item)\" [(ngModel)]=\"item.isSelected\" class=\"form-check-input me-3\" type=\"checkbox\" value=\"\"\r\n [id]=\"item[idField] + instanceId\">\r\n <span class=\"form-check-label\" >\r\n {{item[searchField]}}\r\n </span>\r\n </label>\r\n </li>\r\n <li *ngIf=\"!filteredValues?.length\" >\r\n <span class=\"d-flex align-items-center justify-content-center\" >No data found</span>\r\n </li>\r\n </ul> \r\n </div> \r\n \r\n</div>", styles: [":host{width:100%;height:100%}.outer-container{position:relative;background-color:#fff}.outer-container .form-select{font-size:1.1rem;font-weight:600;border-radius:8px!important;color:var(--Gray-500, #344054);border:1px solid var(--Gray-300, #D0D5DD)!important;height:42.5px}.outer-container .disable-input{pointer-events:none;background-color:#f9fafb!important}.outer-container .input-container{position:absolute;width:100%;z-index:1}.outer-container .input-container .input-wrapper{padding:8px 10px;background-color:#fff;border-top-right-radius:8px;border-top-left-radius:8px;border-top:1px solid rgba(16,24,40,.08);border-right:1px solid rgba(16,24,40,.08);border-left:1px solid rgba(16,24,40,.08)}.outer-container .input-container .input-wrapper input{width:100%;border-radius:8px;border:1px solid var(--Gray-300, #D0D5DD);background:var(--White, #FFF);box-shadow:0 1px 2px #1018280d;padding:10px 14px 10px 30px;outline:none}.outer-container .input-container .input-wrapper input ::placeholder{color:var(--Gray-500, #667085);font-family:Inter;font-size:14px;font-weight:500;line-height:20px}.outer-container .input-container .input-wrapper .search-icon{position:absolute;left:20px;top:20px}.outer-container .input-container ul{position:relative;background-color:#fff;margin:0;padding:0;max-height:200px;min-height:auto;overflow-y:auto;border-bottom-right-radius:8px;border-bottom-left-radius:8px;border-bottom:1px solid rgba(16,24,40,.08);border-right:1px solid rgba(16,24,40,.08);border-left:1px solid rgba(16,24,40,.08)}.outer-container .input-container ul .selected{background:#f9fafb}.outer-container .input-container ul li{list-style:none;padding:10px 16px;cursor:pointer}.outer-container .input-container ul li label{cursor:pointer}.outer-container .input-container ul li:hover{background:#f9fafb}.form-check{display:flex;align-items:center}.form-check-input{height:16px;width:16px;border-radius:4px;border:1px solid var(--Primary-600, #00A3FF)}.form-check-input:checked{--bs-form-check-bg-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAICAYAAADA+m62AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAB4SURBVHgBhY7NDUBQEIRnqcJNKXTg6qYTStCB+Isy6IQSNMDa9SLh5eWZZPcw+81kCX/quABhD73QyKXsGoyIvNCJSto2hEhNtY4N9cwYeMXEsVqB1GaSauRQOpty2tSmO3FgloAmF5nEhgyoesMO6CuFW66fn2xdFyA3ZzcRLrMAAAAASUVORK5CYII=);background-color:#eaf8ff;border-color:#00a3ff}.form-check-label{color:var(--Gray-700, #344054);font-family:Inter;font-size:14px;font-style:normal;font-weight:500;line-height:20px}.select-value{border-radius:16px!important;background:var(--Gray-100, #F2F4F7)!important;mix-blend-mode:multiply;color:var(--Gray-700, #344054)!important;text-align:center;font-size:14px;font-style:normal;font-weight:500;line-height:20px;padding:4px 12px 4px 6px}\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: i3.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.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
400
407
|
}
|
|
401
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
408
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CustomSelectComponent, decorators: [{
|
|
402
409
|
type: Component,
|
|
403
410
|
args: [{ selector: 'team-select', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"outer-container\">\r\n <div [ngClass]=\"disabled ? 'disable-input':''\" (click)=\"openDropdown($event)\" class=\"form-select\">\r\n <ng-container *ngIf=\"multi\" >\r\n <span *ngIf=\"selectedValues?.length\" class=\"select-value mx-2\"> <img class=\"me-2\" alt=\"Pic\" src=\"./assets/tango/Image/users-teams.svg\">{{selectedValues?.[0]?.[searchField]}}</span> \r\n <span *ngIf=\"selectedValues?.length > 1\" class=\"select-value mx-2\"><img class=\"me-2\" alt=\"Pic\" src=\"./assets/tango/Image/users-teams.svg\">{{selectedValues?.[1]?.[searchField]}}</span> \r\n <span class=\"select-value mx-2\" *ngIf=\"selectedValues?.length > 2\">+{{selectedValues?.length -2}}</span> {{label}} \r\n </ng-container>\r\n <ng-container *ngIf=\"!multi\" >\r\n {{selectedValues?.[0]?.[searchField]}}\r\n </ng-container>\r\n </div>\r\n <div [ngClass]=\"showDropdown ? '' : 'd-none'\" class=\"input-container dropdown\" >\r\n <div class=\"w-100 input-wrapper\">\r\n <input [(ngModel)]=\"searchValue\" placeholder=\"Search\" (input)=\"onInput($event)\" type=\"text\"> \r\n <svg class=\"search-icon\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"17\" viewBox=\"0 0 16 17\" fill=\"none\">\r\n <path d=\"M14 14.5L11.1 11.6M12.6667 7.83333C12.6667 10.7789 10.2789 13.1667 7.33333 13.1667C4.38781 13.1667 2 10.7789 2 7.83333C2 4.88781 4.38781 2.5 7.33333 2.5C10.2789 2.5 12.6667 4.88781 12.6667 7.83333Z\" stroke=\"#667085\" stroke-width=\"1.3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg> \r\n </div>\r\n <ul>\r\n <li *ngIf=\"multi && filteredValues?.length\">\r\n <label class=\"form-check\" [for]=\"instanceId\">\r\n <input (change)=\"onSelectAll($event)\" [checked]=\"checkIfAllSelected()\" class=\"form-check-input me-3\" type=\"checkbox\"\r\n [id]=\"instanceId\">\r\n <span class=\"form-check-label\" >\r\n Select All\r\n </span>\r\n </label>\r\n </li>\r\n <li *ngFor=\"let item of filteredValues\" [ngClass]=\"item.isSelected && !multi ? 'selected' : ''\" >\r\n <label [for]=\"item[idField] + instanceId\" [ngClass]=\"multi ? '': 'ps-0'\" class=\"form-check\">\r\n <input [ngClass]=\"multi ? '': 'd-none'\" (change)=\"onSelect($event, item)\" [(ngModel)]=\"item.isSelected\" class=\"form-check-input me-3\" type=\"checkbox\" value=\"\"\r\n [id]=\"item[idField] + instanceId\">\r\n <span class=\"form-check-label\" >\r\n {{item[searchField]}}\r\n </span>\r\n </label>\r\n </li>\r\n <li *ngIf=\"!filteredValues?.length\" >\r\n <span class=\"d-flex align-items-center justify-content-center\" >No data found</span>\r\n </li>\r\n </ul> \r\n </div> \r\n \r\n</div>", styles: [":host{width:100%;height:100%}.outer-container{position:relative;background-color:#fff}.outer-container .form-select{font-size:1.1rem;font-weight:600;border-radius:8px!important;color:var(--Gray-500, #344054);border:1px solid var(--Gray-300, #D0D5DD)!important;height:42.5px}.outer-container .disable-input{pointer-events:none;background-color:#f9fafb!important}.outer-container .input-container{position:absolute;width:100%;z-index:1}.outer-container .input-container .input-wrapper{padding:8px 10px;background-color:#fff;border-top-right-radius:8px;border-top-left-radius:8px;border-top:1px solid rgba(16,24,40,.08);border-right:1px solid rgba(16,24,40,.08);border-left:1px solid rgba(16,24,40,.08)}.outer-container .input-container .input-wrapper input{width:100%;border-radius:8px;border:1px solid var(--Gray-300, #D0D5DD);background:var(--White, #FFF);box-shadow:0 1px 2px #1018280d;padding:10px 14px 10px 30px;outline:none}.outer-container .input-container .input-wrapper input ::placeholder{color:var(--Gray-500, #667085);font-family:Inter;font-size:14px;font-weight:500;line-height:20px}.outer-container .input-container .input-wrapper .search-icon{position:absolute;left:20px;top:20px}.outer-container .input-container ul{position:relative;background-color:#fff;margin:0;padding:0;max-height:200px;min-height:auto;overflow-y:auto;border-bottom-right-radius:8px;border-bottom-left-radius:8px;border-bottom:1px solid rgba(16,24,40,.08);border-right:1px solid rgba(16,24,40,.08);border-left:1px solid rgba(16,24,40,.08)}.outer-container .input-container ul .selected{background:#f9fafb}.outer-container .input-container ul li{list-style:none;padding:10px 16px;cursor:pointer}.outer-container .input-container ul li label{cursor:pointer}.outer-container .input-container ul li:hover{background:#f9fafb}.form-check{display:flex;align-items:center}.form-check-input{height:16px;width:16px;border-radius:4px;border:1px solid var(--Primary-600, #00A3FF)}.form-check-input:checked{--bs-form-check-bg-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAICAYAAADA+m62AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAB4SURBVHgBhY7NDUBQEIRnqcJNKXTg6qYTStCB+Isy6IQSNMDa9SLh5eWZZPcw+81kCX/quABhD73QyKXsGoyIvNCJSto2hEhNtY4N9cwYeMXEsVqB1GaSauRQOpty2tSmO3FgloAmF5nEhgyoesMO6CuFW66fn2xdFyA3ZzcRLrMAAAAASUVORK5CYII=);background-color:#eaf8ff;border-color:#00a3ff}.form-check-label{color:var(--Gray-700, #344054);font-family:Inter;font-size:14px;font-style:normal;font-weight:500;line-height:20px}.select-value{border-radius:16px!important;background:var(--Gray-100, #F2F4F7)!important;mix-blend-mode:multiply;color:var(--Gray-700, #344054)!important;text-align:center;font-size:14px;font-style:normal;font-weight:500;line-height:20px;padding:4px 12px 4px 6px}\n"] }]
|
|
404
411
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: ManageUsersService }], propDecorators: { onClick: [{
|
|
@@ -512,7 +519,6 @@ class AddUsersComponent {
|
|
|
512
519
|
}
|
|
513
520
|
this.user_data = JSON?.parse(localStorage.getItem('user-info') || '');
|
|
514
521
|
this.$headerFilters = data ? data : this.user_data;
|
|
515
|
-
this.getCountryCodes();
|
|
516
522
|
this.getRoles();
|
|
517
523
|
this.getAllTeamsList();
|
|
518
524
|
if (this.type === "view" || (this.type === "edit")) {
|
|
@@ -524,6 +530,7 @@ class AddUsersComponent {
|
|
|
524
530
|
// this.getAllTeamsList()
|
|
525
531
|
// this.showsingleuser = false;
|
|
526
532
|
}
|
|
533
|
+
this.getCountryCodes();
|
|
527
534
|
}
|
|
528
535
|
getRoles() {
|
|
529
536
|
if (this.userType === 'tango') {
|
|
@@ -569,7 +576,6 @@ class AddUsersComponent {
|
|
|
569
576
|
});
|
|
570
577
|
}
|
|
571
578
|
onrolechange(event) {
|
|
572
|
-
console.log(event.target.value);
|
|
573
579
|
if (event.target.value === 'user') {
|
|
574
580
|
this.populatePermission(this.permissionArray);
|
|
575
581
|
}
|
|
@@ -592,16 +598,40 @@ class AddUsersComponent {
|
|
|
592
598
|
// onSubmit() {
|
|
593
599
|
// this.activeModal.close('submit');
|
|
594
600
|
// }
|
|
601
|
+
maskEmail(value) {
|
|
602
|
+
if (!value || !value.includes('@'))
|
|
603
|
+
return '';
|
|
604
|
+
const [local, domain] = value.split('@');
|
|
605
|
+
const visibleLength = Math.min(3, local.length);
|
|
606
|
+
const visiblePart = local.slice(0, visibleLength);
|
|
607
|
+
const maskedPart = '*'.repeat(local.length - visibleLength);
|
|
608
|
+
return `${visiblePart}${maskedPart}@${domain}`;
|
|
609
|
+
}
|
|
610
|
+
maskMobile(value) {
|
|
611
|
+
if (!value || value.length <= 4)
|
|
612
|
+
return '*'.repeat(value.length);
|
|
613
|
+
const first2 = value.slice(0, 2);
|
|
614
|
+
const last2 = value.slice(-2);
|
|
615
|
+
const maskedMiddle = '*'.repeat(value.length - 4);
|
|
616
|
+
return `${first2}${maskedMiddle}${last2}`;
|
|
617
|
+
}
|
|
595
618
|
loadUserForm() {
|
|
596
619
|
this.userService.getUser(this.user.email).pipe(takeUntil(this.destroy$)).subscribe({
|
|
597
620
|
next: (res) => {
|
|
598
621
|
if (res && res.code == 200 && res.data.result) {
|
|
622
|
+
const userData = res.data.result;
|
|
623
|
+
const isViewMode = this.type === 'view';
|
|
624
|
+
const isSuperadmin = this.user_data?.role === 'superadmin';
|
|
625
|
+
const email = (isViewMode && !isSuperadmin) ? this.maskEmail(userData.email) : userData.email;
|
|
626
|
+
const mobile = (isViewMode && !isSuperadmin) ? this.maskMobile(userData.mobileNumber) : userData.mobileNumber;
|
|
627
|
+
this.originalEmail = userData.email;
|
|
628
|
+
this.originalMobile = userData.mobileNumber;
|
|
599
629
|
this.userForm = this.fb.group({
|
|
600
630
|
userName: [res.data.result.userName, Validators.required],
|
|
601
|
-
email: [
|
|
631
|
+
email: [email, Validators.compose([Validators.required,
|
|
602
632
|
Validators.pattern("^[a-zA-Z0-9]+([.-_]?[a-zA-Z0-9]+)*@[a-zA-Z0-9]+([.-_]?[a-zA-Z]+)*[.]{1}[a-zA-Z]{2,}$"),
|
|
603
633
|
])],
|
|
604
|
-
mobileNumber: [
|
|
634
|
+
mobileNumber: [mobile, [Validators.required, Validators.minLength(8), Validators.maxLength(13)]],
|
|
605
635
|
role: [res.data.result.role, Validators.required],
|
|
606
636
|
userType: [res.data.result.userType, Validators.required],
|
|
607
637
|
rolespermission: this.fb.array([], Validators.required),
|
|
@@ -656,12 +686,12 @@ class AddUsersComponent {
|
|
|
656
686
|
email: ["", Validators.compose([Validators.required,
|
|
657
687
|
Validators.pattern("^[a-zA-Z0-9]+([.-_]?[a-zA-Z0-9]+)*@[a-zA-Z0-9]+([.-_]?[a-zA-Z]+)*[.]{1}[a-zA-Z]{2,}$"),
|
|
658
688
|
])],
|
|
659
|
-
mobileNumber: ["", [Validators.required, Validators.minLength(
|
|
689
|
+
mobileNumber: ["", [Validators.required, Validators.minLength(8), Validators.maxLength(13)]],
|
|
660
690
|
role: ["user", Validators.required],
|
|
661
691
|
userType: [this.userType, Validators.required],
|
|
662
692
|
rolespermission: this.fb.array([], Validators.required),
|
|
663
693
|
teamLead: this.fb.array([]),
|
|
664
|
-
countryCode: ["", Validators.required],
|
|
694
|
+
countryCode: ["91", Validators.required],
|
|
665
695
|
});
|
|
666
696
|
if (this.userType === 'tango') {
|
|
667
697
|
if (!this.userForm.contains('tangoUserType')) {
|
|
@@ -714,10 +744,15 @@ class AddUsersComponent {
|
|
|
714
744
|
.replace(/^./, (str) => str.toUpperCase())
|
|
715
745
|
.trim();
|
|
716
746
|
}
|
|
747
|
+
originalEmail = '';
|
|
748
|
+
originalMobile = '';
|
|
717
749
|
addUserSubmit() {
|
|
718
750
|
let value = this.updatePermissionsBasedOnUserType(this.userForm.value);
|
|
719
751
|
const updatedData = this.removeNullValues(value);
|
|
720
|
-
|
|
752
|
+
// updatedData.email = this.originalEmail;
|
|
753
|
+
// updatedData.mobileNumber = this.originalMobile;
|
|
754
|
+
const clientId = this.$headerFilters.client ? this.$headerFilters.client : this.user_data.clientId;
|
|
755
|
+
this.userService.createSingleUsers({ ...updatedData, clientId }).subscribe({
|
|
721
756
|
next: (res) => {
|
|
722
757
|
if (res && res.code == 200) {
|
|
723
758
|
this.ts.getSuccessToast("User created successfully.");
|
|
@@ -733,7 +768,7 @@ class AddUsersComponent {
|
|
|
733
768
|
this.ts.getErrorToast(err?.error?.error ? err?.error?.error : "Unable to create User!");
|
|
734
769
|
this.activeModal.close();
|
|
735
770
|
},
|
|
736
|
-
complete: () => { }
|
|
771
|
+
complete: () => { }
|
|
737
772
|
});
|
|
738
773
|
}
|
|
739
774
|
onSubmit() {
|
|
@@ -747,6 +782,13 @@ class AddUsersComponent {
|
|
|
747
782
|
userUpdate() {
|
|
748
783
|
this.userForm.get("email")?.enable();
|
|
749
784
|
let user = this.userForm.value;
|
|
785
|
+
if (!user.mobileNumber || user.mobileNumber.includes('*')) {
|
|
786
|
+
user.mobileNumber = this.originalMobile;
|
|
787
|
+
}
|
|
788
|
+
else {
|
|
789
|
+
user.mobileNumber;
|
|
790
|
+
}
|
|
791
|
+
user.email = this.originalEmail;
|
|
750
792
|
this.userForm.get("email")?.disable();
|
|
751
793
|
this.service.updateUsers(user).subscribe({
|
|
752
794
|
next: (res) => {
|
|
@@ -843,12 +885,29 @@ class AddUsersComponent {
|
|
|
843
885
|
}
|
|
844
886
|
});
|
|
845
887
|
}
|
|
846
|
-
|
|
847
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", 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==='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=\"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\r\n *ngIf=\"(gs.userAccess |async)?.Global_User_isEdit && type ==='view' && type !=='edit' && user?.role !== 'superadmin'\"\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 </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\" 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\r\n class=\"alert-required text-danger\">*</span></label>\r\n <input type=\"text\" class=\"form-control\" id=\"username\" formControlName=\"userName\" autocomplete=\"off\">\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\r\n 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)\" id=\"mobileNumber\"\r\n autocomplete=\"off\" formControlName=\"mobileNumber\">\r\n <div *ngIf=\"userForm.get('mobileNumber')?.invalid && userForm.get('mobileNumber')?.touched\"\r\n class=\"text-danger\">\r\n <small *ngIf=\"userForm.get('mobileNumber')?.errors?.['required']\">Contact Number is\r\n required.</small>\r\n <small *ngIf=\"userForm.get('mobileNumber')?.errors?.['minlength']\">Contact Number must be at least\r\n 10 digits.</small>\r\n <small *ngIf=\"userForm.get('mobileNumber')?.errors?.['maxlength']\">Contact Number cannot exceed 13\r\n 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 <!-- User Type Field -->\r\n <div *ngIf=\"this.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 <span\r\n class=\"alert-required text-danger\">*</span></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 *ngIf=\"userForm.get('tangoUserType')?.invalid && userForm.get('tangoUserType')?.touched\"\r\n class=\"text-danger\">\r\n <small *ngIf=\"userForm.get('tangoUserType')?.errors?.['required']\">User Type 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'\"\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\"\r\n [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\r\n *ngFor=\"let modules of getFeaturePermissions(rolespermission)?.controls; let j = index\"\r\n [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\"\r\n (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\"\r\n (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'\"\r\n class=\"row w-100 text-nowrap\">\r\n <div class=\"col-md-4\"\r\n *ngFor=\"let modules of getFeaturePermissions(rolespermission)?.controls; let j = index\"\r\n [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\" (click)=\"onSubmit()\"\r\n [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.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.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.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i3.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i3.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i3.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" }] });
|
|
888
|
+
omitSpecialChar(event) {
|
|
889
|
+
const key = event.key;
|
|
890
|
+
const regex = /^[a-zA-Z0-9 _-]$/;
|
|
891
|
+
if (!regex.test(key)) {
|
|
892
|
+
event.preventDefault();
|
|
893
|
+
}
|
|
894
|
+
}
|
|
895
|
+
omitSpecialCharPaste(event) {
|
|
896
|
+
const clipboardData = event.clipboardData || window['clipboardData'];
|
|
897
|
+
;
|
|
898
|
+
const pastedText = clipboardData.getData('text');
|
|
899
|
+
const regex = /^[a-zA-Z0-9 _-]*$/;
|
|
900
|
+
if (!regex.test(pastedText)) {
|
|
901
|
+
event.preventDefault();
|
|
902
|
+
this.ts.getErrorToast("Special characters are not allowed.");
|
|
903
|
+
}
|
|
904
|
+
}
|
|
905
|
+
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.FormBuilder }, { token: UserService }, { token: i4.ToastService }, { token: i2.GlobalStateService }], target: i0.ɵɵFactoryTarget.Component });
|
|
906
|
+
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==='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=\"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'\" 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\" 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'\" \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.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.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.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i3.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i3.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i3.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i3.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" }] });
|
|
848
907
|
}
|
|
849
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
908
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AddUsersComponent, decorators: [{
|
|
850
909
|
type: Component,
|
|
851
|
-
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==='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=\"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\r\n *ngIf=\"(gs.userAccess |async)?.Global_User_isEdit && type ==='view' && type !=='edit' && user?.role !== 'superadmin'\"\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 </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\" 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\r\n class=\"alert-required text-danger\">*</span></label>\r\n <input type=\"text\" class=\"form-control\" id=\"username\" formControlName=\"userName\" autocomplete=\"off\">\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\r\n 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)\" id=\"mobileNumber\"\r\n autocomplete=\"off\" formControlName=\"mobileNumber\">\r\n <div *ngIf=\"userForm.get('mobileNumber')?.invalid && userForm.get('mobileNumber')?.touched\"\r\n class=\"text-danger\">\r\n <small *ngIf=\"userForm.get('mobileNumber')?.errors?.['required']\">Contact Number is\r\n required.</small>\r\n <small *ngIf=\"userForm.get('mobileNumber')?.errors?.['minlength']\">Contact Number must be at least\r\n 10 digits.</small>\r\n <small *ngIf=\"userForm.get('mobileNumber')?.errors?.['maxlength']\">Contact Number cannot exceed 13\r\n 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 <!-- User Type Field -->\r\n <div *ngIf=\"this.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 <span\r\n class=\"alert-required text-danger\">*</span></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 *ngIf=\"userForm.get('tangoUserType')?.invalid && userForm.get('tangoUserType')?.touched\"\r\n class=\"text-danger\">\r\n <small *ngIf=\"userForm.get('tangoUserType')?.errors?.['required']\">User Type 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'\"\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\"\r\n [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\r\n *ngFor=\"let modules of getFeaturePermissions(rolespermission)?.controls; let j = index\"\r\n [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\"\r\n (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\"\r\n (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'\"\r\n class=\"row w-100 text-nowrap\">\r\n <div class=\"col-md-4\"\r\n *ngFor=\"let modules of getFeaturePermissions(rolespermission)?.controls; let j = index\"\r\n [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\" (click)=\"onSubmit()\"\r\n [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"] }]
|
|
910
|
+
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==='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=\"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'\" 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\" 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'\" \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"] }]
|
|
852
911
|
}], ctorParameters: () => [{ type: ManageUsersService }, { type: i0.ChangeDetectorRef }, { type: i1$1.NgbActiveModal }, { type: i3.FormBuilder }, { type: UserService }, { type: i4.ToastService }, { type: i2.GlobalStateService }], propDecorators: { type: [{
|
|
853
912
|
type: Input
|
|
854
913
|
}], user: [{
|
|
@@ -989,28 +1048,50 @@ class AddUserPopupComponent {
|
|
|
989
1048
|
});
|
|
990
1049
|
this.getUserPermissionData("user", this.userType);
|
|
991
1050
|
}
|
|
1051
|
+
maskEmail(value) {
|
|
1052
|
+
if (!value || !value.includes('@'))
|
|
1053
|
+
return '';
|
|
1054
|
+
const [local, domain] = value.split('@');
|
|
1055
|
+
const visibleLength = Math.min(5, local.length);
|
|
1056
|
+
const visiblePart = local.slice(0, visibleLength);
|
|
1057
|
+
const maskedPart = '*'.repeat(local.length - visibleLength);
|
|
1058
|
+
return `${visiblePart}${maskedPart}@${domain}`;
|
|
1059
|
+
}
|
|
1060
|
+
maskMobile(value) {
|
|
1061
|
+
if (!value || value.length <= 4)
|
|
1062
|
+
return '*'.repeat(value.length);
|
|
1063
|
+
const first2 = value.slice(0, 2);
|
|
1064
|
+
const last2 = value.slice(-2);
|
|
1065
|
+
const maskedMiddle = '*'.repeat(value.length - 4);
|
|
1066
|
+
return `${first2}${maskedMiddle}${last2}`;
|
|
1067
|
+
}
|
|
992
1068
|
loadUserForm() {
|
|
993
1069
|
this.userService.getUser(this.user.email).pipe(takeUntil(this.destroy$)).subscribe({
|
|
994
1070
|
next: (res) => {
|
|
995
|
-
if (res && res.code
|
|
1071
|
+
if (res && res.code === 200 && res.data.result) {
|
|
1072
|
+
const userData = res.data.result;
|
|
1073
|
+
const isViewMode = this.operationType === 'view';
|
|
1074
|
+
const isSuperadmin = userData.role === 'superadmin';
|
|
1075
|
+
const email = (isViewMode && !isSuperadmin) ? this.maskEmail(userData.email) : userData.email;
|
|
1076
|
+
const mobile = (isViewMode && !isSuperadmin) ? this.maskMobile(userData.mobileNumber) : userData.mobileNumber;
|
|
996
1077
|
this.userForm = this.fb.group({
|
|
997
|
-
userName: [
|
|
998
|
-
email: [
|
|
1078
|
+
userName: [userData.userName, Validators.required],
|
|
1079
|
+
email: [email, Validators.compose([
|
|
1080
|
+
Validators.required,
|
|
999
1081
|
Validators.pattern("^[a-zA-Z0-9]+([.-_]?[a-zA-Z0-9]+)*@[a-zA-Z0-9]+([.-_]?[a-zA-Z]+)*[.]{1}[a-zA-Z]{2,}$"),
|
|
1000
1082
|
])],
|
|
1001
|
-
mobileNumber: [
|
|
1002
|
-
role: [
|
|
1003
|
-
userType: [
|
|
1004
|
-
tangoUserType: [
|
|
1083
|
+
mobileNumber: [mobile, [Validators.required, Validators.minLength(7), Validators.maxLength(13)]],
|
|
1084
|
+
role: [userData.role, Validators.required],
|
|
1085
|
+
userType: [userData.userType, Validators.required],
|
|
1086
|
+
tangoUserType: [userData.tangoUserType, Validators.required],
|
|
1005
1087
|
permission: this.fb.array([], Validators.required),
|
|
1006
1088
|
});
|
|
1007
|
-
this.populatePermission(
|
|
1008
|
-
if (
|
|
1009
|
-
this.userForm.disable();
|
|
1089
|
+
this.populatePermission(userData.permission);
|
|
1090
|
+
if (isViewMode) {
|
|
1091
|
+
this.userForm.disable(); // disable entire form
|
|
1010
1092
|
}
|
|
1011
|
-
this.userForm.get("email")?.disable();
|
|
1093
|
+
this.userForm.get("email")?.disable(); // email is always disabled
|
|
1012
1094
|
this.cd.detectChanges();
|
|
1013
|
-
// this.getUserPermissionData(res.data.result.role,res.data.result.userType);
|
|
1014
1095
|
}
|
|
1015
1096
|
else {
|
|
1016
1097
|
this.initUserForm();
|
|
@@ -1155,12 +1236,29 @@ class AddUserPopupComponent {
|
|
|
1155
1236
|
getFeaturePermissions(permission) {
|
|
1156
1237
|
return permission.get("product");
|
|
1157
1238
|
}
|
|
1239
|
+
hasInvalidChars(value) {
|
|
1240
|
+
const regex = /^[a-zA-Z0-9 _-]*$/;
|
|
1241
|
+
return !regex.test(value);
|
|
1242
|
+
}
|
|
1158
1243
|
onUpload(e) {
|
|
1159
1244
|
let data;
|
|
1160
1245
|
const target = e.target;
|
|
1161
1246
|
if (target.files.length > 1) {
|
|
1162
1247
|
this.inputFile.nativeElement.value = "";
|
|
1163
1248
|
}
|
|
1249
|
+
const file = e.target.files[0];
|
|
1250
|
+
const allowedExtensions = /\.(xls|xlsx|csv)$/i;
|
|
1251
|
+
const allowedTypes = [
|
|
1252
|
+
"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
|
|
1253
|
+
"application/vnd.ms-excel",
|
|
1254
|
+
"text/csv",
|
|
1255
|
+
"application/csv",
|
|
1256
|
+
];
|
|
1257
|
+
if (!allowedExtensions.test(file.name) || !allowedTypes.includes(file.type)) {
|
|
1258
|
+
this.ts.getErrorToast("Only .xlsx, or .csv files are allowed.");
|
|
1259
|
+
this.inputFile.nativeElement.value = "";
|
|
1260
|
+
return;
|
|
1261
|
+
}
|
|
1164
1262
|
if (!!target.files[0].name.match(/(.xls|.xlsx)/)) {
|
|
1165
1263
|
const reader = new FileReader();
|
|
1166
1264
|
reader.onload = (e) => {
|
|
@@ -1170,6 +1268,7 @@ class AddUserPopupComponent {
|
|
|
1170
1268
|
const ws = wb.Sheets[wsname];
|
|
1171
1269
|
if (wb.SheetNames[0] != "Users") {
|
|
1172
1270
|
this.ts.getErrorToast('Please Upload the Valid File');
|
|
1271
|
+
this.inputFile.nativeElement.value = "";
|
|
1173
1272
|
return;
|
|
1174
1273
|
}
|
|
1175
1274
|
data = utils.sheet_to_json(ws);
|
|
@@ -1179,8 +1278,12 @@ class AddUserPopupComponent {
|
|
|
1179
1278
|
let processedArray = [];
|
|
1180
1279
|
let errMsgs = [];
|
|
1181
1280
|
for (let i = 0; i < data.length; i++) {
|
|
1281
|
+
this.inputFile.nativeElement.value = "";
|
|
1182
1282
|
errMsgs.push(this.validateField(data[i].UserName, "User name", i));
|
|
1183
1283
|
errMsgs.push(this.validateField(data[i].Email, "Email", i, this.emailRegex));
|
|
1284
|
+
if (this.hasInvalidChars(data[i].UserName)) {
|
|
1285
|
+
errMsgs.push(`Row ${i + 1}: UserName : ${data[i].UserName} has invalid characters.`);
|
|
1286
|
+
}
|
|
1184
1287
|
errMsgs.push(this.validateField(data[i].Contact, "Contact", i, this.phoneRegex));
|
|
1185
1288
|
// errMsgs.push(this.validateField(data[i].Role, "Role", i));
|
|
1186
1289
|
}
|
|
@@ -1229,8 +1332,8 @@ class AddUserPopupComponent {
|
|
|
1229
1332
|
}
|
|
1230
1333
|
},
|
|
1231
1334
|
error: (error) => {
|
|
1232
|
-
console.log(error);
|
|
1233
1335
|
if (error) {
|
|
1336
|
+
this.inputFile.nativeElement.value = "";
|
|
1234
1337
|
this.ts.getErrorToast(error.error.error ? error.error.error : 'Unable to create multiple Users!');
|
|
1235
1338
|
// } else {
|
|
1236
1339
|
// this.ts.getErrorToast('Unable to create multiple Users!');
|
|
@@ -1240,6 +1343,10 @@ class AddUserPopupComponent {
|
|
|
1240
1343
|
};
|
|
1241
1344
|
$("#kt_create_account_form_account_type_personal").val("");
|
|
1242
1345
|
}
|
|
1346
|
+
else {
|
|
1347
|
+
this.ts.getErrorToast("Please Upload a Valid File");
|
|
1348
|
+
this.inputFile.nativeElement.value = "";
|
|
1349
|
+
}
|
|
1243
1350
|
}
|
|
1244
1351
|
validateField(value, fieldName, row, regex) {
|
|
1245
1352
|
if (typeof value !== "string" && typeof value !== "number") {
|
|
@@ -1303,12 +1410,12 @@ class AddUserPopupComponent {
|
|
|
1303
1410
|
.replace(/^./, (str) => str.toUpperCase())
|
|
1304
1411
|
.trim();
|
|
1305
1412
|
}
|
|
1306
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
1307
|
-
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: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.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.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i3.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i3.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i3.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i3.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "pipe", type: i6.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.TitleCasePipe, name: "titlecase" }] });
|
|
1413
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AddUserPopupComponent, deps: [{ token: i1$1.NgbActiveModal }, { token: i0.ChangeDetectorRef }, { token: i1$1.NgbModal }, { token: i3.FormBuilder }, { token: UserService }, { token: i4.ToastService }, { token: i2.GlobalStateService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1414
|
+
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\" accept = \".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel\"\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: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i3.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.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i3.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3.MinLengthValidator, selector: "[minlength][formControlName],[minlength][formControl],[minlength][ngModel]", inputs: ["minlength"] }, { kind: "directive", type: i3.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i3.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i3.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "pipe", type: i6.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.TitleCasePipe, name: "titlecase" }] });
|
|
1308
1415
|
}
|
|
1309
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
1416
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AddUserPopupComponent, decorators: [{
|
|
1310
1417
|
type: Component,
|
|
1311
|
-
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"] }]
|
|
1418
|
+
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\" accept = \".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel\"\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"] }]
|
|
1312
1419
|
}], ctorParameters: () => [{ type: i1$1.NgbActiveModal }, { type: i0.ChangeDetectorRef }, { type: i1$1.NgbModal }, { type: i3.FormBuilder }, { type: UserService }, { type: i4.ToastService }, { type: i2.GlobalStateService }], propDecorators: { type: [{
|
|
1313
1420
|
type: Input
|
|
1314
1421
|
}], user: [{
|
|
@@ -1322,27 +1429,183 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImpo
|
|
|
1322
1429
|
args: ["inputFile"]
|
|
1323
1430
|
}] } });
|
|
1324
1431
|
|
|
1432
|
+
class GroupSelectComponent {
|
|
1433
|
+
cd;
|
|
1434
|
+
userService;
|
|
1435
|
+
onClick(event) {
|
|
1436
|
+
const target = event.target;
|
|
1437
|
+
if (!target.closest('.dropdown')) {
|
|
1438
|
+
this.showDropdown = false;
|
|
1439
|
+
}
|
|
1440
|
+
}
|
|
1441
|
+
items;
|
|
1442
|
+
searchField;
|
|
1443
|
+
multi;
|
|
1444
|
+
idField;
|
|
1445
|
+
selectedValues = [];
|
|
1446
|
+
disabled;
|
|
1447
|
+
label;
|
|
1448
|
+
selected = new EventEmitter();
|
|
1449
|
+
filteredValues = [];
|
|
1450
|
+
showDropdown;
|
|
1451
|
+
searchValue;
|
|
1452
|
+
instanceId;
|
|
1453
|
+
constructor(cd, userService) {
|
|
1454
|
+
this.cd = cd;
|
|
1455
|
+
this.userService = userService;
|
|
1456
|
+
}
|
|
1457
|
+
ngOnInit() {
|
|
1458
|
+
this.instanceId = crypto.randomUUID();
|
|
1459
|
+
this.userService.dropDownTrigger.subscribe((e) => {
|
|
1460
|
+
if (e !== this.instanceId) {
|
|
1461
|
+
this.showDropdown = false;
|
|
1462
|
+
this.cd.detectChanges();
|
|
1463
|
+
}
|
|
1464
|
+
});
|
|
1465
|
+
}
|
|
1466
|
+
ngOnChanges(changes) {
|
|
1467
|
+
if (changes['items'] && this.items?.length) {
|
|
1468
|
+
this.initializeItems();
|
|
1469
|
+
}
|
|
1470
|
+
if (changes['selectedValues'] && Array.isArray(changes['selectedValues']?.currentValue) && changes['selectedValues']?.currentValue?.length > 0 && changes['selectedValues']?.currentValue[0]) {
|
|
1471
|
+
this.updateSelectedValues();
|
|
1472
|
+
}
|
|
1473
|
+
}
|
|
1474
|
+
initializeItems() {
|
|
1475
|
+
this.filteredValues = this.items.map((item) => ({ ...item }));
|
|
1476
|
+
this.updateSelectedValues();
|
|
1477
|
+
}
|
|
1478
|
+
updateSelectedValues() {
|
|
1479
|
+
this.selectedValues?.forEach((selectedItem) => {
|
|
1480
|
+
const item = this.filteredValues?.find((filteredItem) => filteredItem?.[this.idField] === selectedItem?.[this.idField]);
|
|
1481
|
+
if (item) {
|
|
1482
|
+
item.isSelected = true;
|
|
1483
|
+
}
|
|
1484
|
+
});
|
|
1485
|
+
}
|
|
1486
|
+
openDropdown(event) {
|
|
1487
|
+
this.userService.dropDownTrigger.next(this.instanceId);
|
|
1488
|
+
event.stopPropagation();
|
|
1489
|
+
this.showDropdown = !this.showDropdown;
|
|
1490
|
+
}
|
|
1491
|
+
onInput(event) {
|
|
1492
|
+
if (!event.target.value) {
|
|
1493
|
+
this.filteredValues = [...this.items];
|
|
1494
|
+
}
|
|
1495
|
+
else {
|
|
1496
|
+
const searchTerm = event.target.value.toLowerCase();
|
|
1497
|
+
this.filteredValues = this.items.filter((item) => item[this.searchField].toLowerCase().includes(searchTerm));
|
|
1498
|
+
}
|
|
1499
|
+
this.updateSelectedValues();
|
|
1500
|
+
this.cd.detectChanges();
|
|
1501
|
+
}
|
|
1502
|
+
onSelect(event, item) {
|
|
1503
|
+
if (this.multi) {
|
|
1504
|
+
if (event.currentTarget.checked) {
|
|
1505
|
+
this.selectedValues.push(item);
|
|
1506
|
+
}
|
|
1507
|
+
else {
|
|
1508
|
+
this.selectedValues = this.selectedValues.filter((elem) => elem[this.idField] !== item[this.idField]);
|
|
1509
|
+
}
|
|
1510
|
+
}
|
|
1511
|
+
else {
|
|
1512
|
+
this.selectedValues = [{ ...item }];
|
|
1513
|
+
this.filteredValues.forEach((element) => {
|
|
1514
|
+
if (element[this.idField] !== item[this.idField]) {
|
|
1515
|
+
element.isSelected = false;
|
|
1516
|
+
}
|
|
1517
|
+
});
|
|
1518
|
+
this.showDropdown = false;
|
|
1519
|
+
}
|
|
1520
|
+
const valuesToEmit = this.selectedValues.map((value) => {
|
|
1521
|
+
const selectedItem = { ...value };
|
|
1522
|
+
delete selectedItem.isSelected;
|
|
1523
|
+
return selectedItem;
|
|
1524
|
+
});
|
|
1525
|
+
this.cd.detectChanges();
|
|
1526
|
+
this.emitSelectedValues(valuesToEmit);
|
|
1527
|
+
}
|
|
1528
|
+
onSelectAll(event) {
|
|
1529
|
+
const selectAll = event.currentTarget.checked;
|
|
1530
|
+
this.filteredValues.forEach((item) => item.isSelected = selectAll);
|
|
1531
|
+
if (selectAll) {
|
|
1532
|
+
this.selectedValues = [...this.filteredValues];
|
|
1533
|
+
}
|
|
1534
|
+
else {
|
|
1535
|
+
this.selectedValues = [];
|
|
1536
|
+
}
|
|
1537
|
+
const valuesToEmit = this.selectedValues.map((value) => {
|
|
1538
|
+
const { isSelected, ...selectedItem } = value;
|
|
1539
|
+
return selectedItem;
|
|
1540
|
+
});
|
|
1541
|
+
this.cd.detectChanges();
|
|
1542
|
+
this.emitSelectedValues(valuesToEmit);
|
|
1543
|
+
}
|
|
1544
|
+
emitSelectedValues(values) {
|
|
1545
|
+
if (this.multi) {
|
|
1546
|
+
this.selected.emit(values);
|
|
1547
|
+
}
|
|
1548
|
+
else {
|
|
1549
|
+
this.selected.emit(values[0]);
|
|
1550
|
+
}
|
|
1551
|
+
}
|
|
1552
|
+
checkIfAllSelected() {
|
|
1553
|
+
return this.filteredValues.every((item) => item.isSelected);
|
|
1554
|
+
}
|
|
1555
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: GroupSelectComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: UserService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1556
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: GroupSelectComponent, selector: "lib-group-select", inputs: { items: "items", searchField: "searchField", multi: "multi", idField: "idField", selectedValues: "selectedValues", disabled: "disabled", label: "label" }, outputs: { selected: "selected" }, host: { listeners: { "document:click": "onClick($event)" } }, usesOnChanges: true, ngImport: i0, template: "<div class=\"outer-container\">\r\n <div [ngClass]=\"disabled ? 'disable-input':''\" (click)=\"openDropdown($event)\" class=\"form-select\">\r\n <ng-container *ngIf=\"multi\" >\r\n <span *ngIf=\"selectedValues?.length\" class=\"select-value mx-2\"> <img class=\"me-2\" alt=\"Pic\" src=\"./assets/tango/Image/users-teams.svg\">{{selectedValues?.[0]?.[searchField]}}</span> \r\n <!-- <span *ngIf=\"selectedValues?.length > 1\" class=\"select-value mx-2\"><img class=\"me-2\" alt=\"Pic\" src=\"./assets/tango/Image/users-teams.svg\">{{selectedValues?.[1]?.[searchField]}}</span> -->\r\n <span class=\"select-value mx-2\" *ngIf=\"selectedValues?.length > 1\">+{{selectedValues?.length -1}}</span> {{label}} \r\n </ng-container>\r\n <ng-container *ngIf=\"!multi\" >\r\n {{selectedValues?.[0]?.[searchField]}}\r\n </ng-container>\r\n </div>\r\n <div [ngClass]=\"showDropdown ? '' : 'd-none'\" class=\"input-container dropdown\" >\r\n <div class=\"w-100 input-wrapper\">\r\n <input [(ngModel)]=\"searchValue\" placeholder=\"Search\" (input)=\"onInput($event)\" type=\"text\"> \r\n <svg class=\"search-icon\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"17\" viewBox=\"0 0 16 17\" fill=\"none\">\r\n <path d=\"M14 14.5L11.1 11.6M12.6667 7.83333C12.6667 10.7789 10.2789 13.1667 7.33333 13.1667C4.38781 13.1667 2 10.7789 2 7.83333C2 4.88781 4.38781 2.5 7.33333 2.5C10.2789 2.5 12.6667 4.88781 12.6667 7.83333Z\" stroke=\"#667085\" stroke-width=\"1.3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg> \r\n </div>\r\n <ul>\r\n <li *ngIf=\"multi && filteredValues?.length\">\r\n <label class=\"form-check\" [for]=\"instanceId\" >\r\n <input (change)=\"onSelectAll($event)\" [checked]=\"checkIfAllSelected()\" class=\"form-check-input me-3\" type=\"checkbox\"\r\n [id]=\"instanceId\">\r\n <span class=\"form-check-label\" >\r\n Select All\r\n </span>\r\n </label>\r\n </li>\r\n <li *ngFor=\"let item of filteredValues\" [ngClass]=\"item.isSelected && !multi ? 'selected' : ''\" >\r\n <label [for]=\"item[idField] + instanceId\" [ngClass]=\"multi ? '': 'ps-0'\" class=\"form-check\">\r\n <input [ngClass]=\"multi ? '': 'd-none'\" (change)=\"onSelect($event, item)\" [(ngModel)]=\"item.isSelected\" class=\"form-check-input me-3\" type=\"checkbox\" value=\"\"\r\n [id]=\"item[idField] + instanceId\">\r\n <span class=\"form-check-label\" >\r\n {{item[searchField]}}\r\n </span>\r\n </label>\r\n </li>\r\n <li *ngIf=\"!filteredValues?.length\" >\r\n <span class=\"d-flex align-items-center justify-content-center\" >No data found</span>\r\n </li>\r\n </ul> \r\n </div> \r\n \r\n</div>", styles: [":host{width:100%;height:100%}.outer-container{position:relative;background-color:#fff}.outer-container .form-select{font-size:1.1rem;font-weight:600;border-radius:8px!important;color:var(--Gray-500, #344054);border:1px solid var(--Gray-300, #D0D5DD)!important;height:42.5px}.outer-container .disable-input{pointer-events:none;background-color:#f9fafb!important}.outer-container .input-container{position:absolute;width:100%;z-index:1}.outer-container .input-container .input-wrapper{padding:8px 10px;background-color:#fff;border-top-right-radius:8px;border-top-left-radius:8px;border-top:1px solid rgba(16,24,40,.08);border-right:1px solid rgba(16,24,40,.08);border-left:1px solid rgba(16,24,40,.08)}.outer-container .input-container .input-wrapper input{width:100%;border-radius:8px;border:1px solid var(--Gray-300, #D0D5DD);background:var(--White, #FFF);box-shadow:0 1px 2px #1018280d;padding:10px 14px 10px 30px;outline:none}.outer-container .input-container .input-wrapper input ::placeholder{color:var(--Gray-500, #667085);font-family:Inter;font-size:14px;font-weight:500;line-height:20px}.outer-container .input-container .input-wrapper .search-icon{position:absolute;left:20px;top:20px}.outer-container .input-container ul{position:relative;background-color:#fff;margin:0;padding:0;max-height:200px;min-height:auto;overflow-y:auto;border-bottom-right-radius:8px;border-bottom-left-radius:8px;border-bottom:1px solid rgba(16,24,40,.08);border-right:1px solid rgba(16,24,40,.08);border-left:1px solid rgba(16,24,40,.08)}.outer-container .input-container ul .selected{background:#f9fafb}.outer-container .input-container ul li{list-style:none;padding:10px 16px;cursor:pointer}.outer-container .input-container ul li label{cursor:pointer}.outer-container .input-container ul li:hover{background:#f9fafb}.form-check{display:flex;align-items:center}.form-check-input{height:16px;width:16px;border-radius:4px;border:1px solid var(--Primary-600, #00A3FF)}.form-check-input:checked{--bs-form-check-bg-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAICAYAAADA+m62AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAB4SURBVHgBhY7NDUBQEIRnqcJNKXTg6qYTStCB+Isy6IQSNMDa9SLh5eWZZPcw+81kCX/quABhD73QyKXsGoyIvNCJSto2hEhNtY4N9cwYeMXEsVqB1GaSauRQOpty2tSmO3FgloAmF5nEhgyoesMO6CuFW66fn2xdFyA3ZzcRLrMAAAAASUVORK5CYII=);background-color:#eaf8ff;border-color:#00a3ff}.form-check-label{color:var(--Gray-700, #344054);font-family:Inter;font-size:14px;font-style:normal;font-weight:500;line-height:20px}.select-value{border-radius:16px!important;background:var(--Gray-100, #F2F4F7)!important;mix-blend-mode:multiply;color:var(--Gray-700, #344054)!important;text-align:center;font-size:14px;font-style:normal;font-weight:500;line-height:20px;padding:4px 12px 4px 6px}\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: i3.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.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
|
|
1557
|
+
}
|
|
1558
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: GroupSelectComponent, decorators: [{
|
|
1559
|
+
type: Component,
|
|
1560
|
+
args: [{ selector: 'lib-group-select', template: "<div class=\"outer-container\">\r\n <div [ngClass]=\"disabled ? 'disable-input':''\" (click)=\"openDropdown($event)\" class=\"form-select\">\r\n <ng-container *ngIf=\"multi\" >\r\n <span *ngIf=\"selectedValues?.length\" class=\"select-value mx-2\"> <img class=\"me-2\" alt=\"Pic\" src=\"./assets/tango/Image/users-teams.svg\">{{selectedValues?.[0]?.[searchField]}}</span> \r\n <!-- <span *ngIf=\"selectedValues?.length > 1\" class=\"select-value mx-2\"><img class=\"me-2\" alt=\"Pic\" src=\"./assets/tango/Image/users-teams.svg\">{{selectedValues?.[1]?.[searchField]}}</span> -->\r\n <span class=\"select-value mx-2\" *ngIf=\"selectedValues?.length > 1\">+{{selectedValues?.length -1}}</span> {{label}} \r\n </ng-container>\r\n <ng-container *ngIf=\"!multi\" >\r\n {{selectedValues?.[0]?.[searchField]}}\r\n </ng-container>\r\n </div>\r\n <div [ngClass]=\"showDropdown ? '' : 'd-none'\" class=\"input-container dropdown\" >\r\n <div class=\"w-100 input-wrapper\">\r\n <input [(ngModel)]=\"searchValue\" placeholder=\"Search\" (input)=\"onInput($event)\" type=\"text\"> \r\n <svg class=\"search-icon\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"17\" viewBox=\"0 0 16 17\" fill=\"none\">\r\n <path d=\"M14 14.5L11.1 11.6M12.6667 7.83333C12.6667 10.7789 10.2789 13.1667 7.33333 13.1667C4.38781 13.1667 2 10.7789 2 7.83333C2 4.88781 4.38781 2.5 7.33333 2.5C10.2789 2.5 12.6667 4.88781 12.6667 7.83333Z\" stroke=\"#667085\" stroke-width=\"1.3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg> \r\n </div>\r\n <ul>\r\n <li *ngIf=\"multi && filteredValues?.length\">\r\n <label class=\"form-check\" [for]=\"instanceId\" >\r\n <input (change)=\"onSelectAll($event)\" [checked]=\"checkIfAllSelected()\" class=\"form-check-input me-3\" type=\"checkbox\"\r\n [id]=\"instanceId\">\r\n <span class=\"form-check-label\" >\r\n Select All\r\n </span>\r\n </label>\r\n </li>\r\n <li *ngFor=\"let item of filteredValues\" [ngClass]=\"item.isSelected && !multi ? 'selected' : ''\" >\r\n <label [for]=\"item[idField] + instanceId\" [ngClass]=\"multi ? '': 'ps-0'\" class=\"form-check\">\r\n <input [ngClass]=\"multi ? '': 'd-none'\" (change)=\"onSelect($event, item)\" [(ngModel)]=\"item.isSelected\" class=\"form-check-input me-3\" type=\"checkbox\" value=\"\"\r\n [id]=\"item[idField] + instanceId\">\r\n <span class=\"form-check-label\" >\r\n {{item[searchField]}}\r\n </span>\r\n </label>\r\n </li>\r\n <li *ngIf=\"!filteredValues?.length\" >\r\n <span class=\"d-flex align-items-center justify-content-center\" >No data found</span>\r\n </li>\r\n </ul> \r\n </div> \r\n \r\n</div>", styles: [":host{width:100%;height:100%}.outer-container{position:relative;background-color:#fff}.outer-container .form-select{font-size:1.1rem;font-weight:600;border-radius:8px!important;color:var(--Gray-500, #344054);border:1px solid var(--Gray-300, #D0D5DD)!important;height:42.5px}.outer-container .disable-input{pointer-events:none;background-color:#f9fafb!important}.outer-container .input-container{position:absolute;width:100%;z-index:1}.outer-container .input-container .input-wrapper{padding:8px 10px;background-color:#fff;border-top-right-radius:8px;border-top-left-radius:8px;border-top:1px solid rgba(16,24,40,.08);border-right:1px solid rgba(16,24,40,.08);border-left:1px solid rgba(16,24,40,.08)}.outer-container .input-container .input-wrapper input{width:100%;border-radius:8px;border:1px solid var(--Gray-300, #D0D5DD);background:var(--White, #FFF);box-shadow:0 1px 2px #1018280d;padding:10px 14px 10px 30px;outline:none}.outer-container .input-container .input-wrapper input ::placeholder{color:var(--Gray-500, #667085);font-family:Inter;font-size:14px;font-weight:500;line-height:20px}.outer-container .input-container .input-wrapper .search-icon{position:absolute;left:20px;top:20px}.outer-container .input-container ul{position:relative;background-color:#fff;margin:0;padding:0;max-height:200px;min-height:auto;overflow-y:auto;border-bottom-right-radius:8px;border-bottom-left-radius:8px;border-bottom:1px solid rgba(16,24,40,.08);border-right:1px solid rgba(16,24,40,.08);border-left:1px solid rgba(16,24,40,.08)}.outer-container .input-container ul .selected{background:#f9fafb}.outer-container .input-container ul li{list-style:none;padding:10px 16px;cursor:pointer}.outer-container .input-container ul li label{cursor:pointer}.outer-container .input-container ul li:hover{background:#f9fafb}.form-check{display:flex;align-items:center}.form-check-input{height:16px;width:16px;border-radius:4px;border:1px solid var(--Primary-600, #00A3FF)}.form-check-input:checked{--bs-form-check-bg-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAICAYAAADA+m62AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAB4SURBVHgBhY7NDUBQEIRnqcJNKXTg6qYTStCB+Isy6IQSNMDa9SLh5eWZZPcw+81kCX/quABhD73QyKXsGoyIvNCJSto2hEhNtY4N9cwYeMXEsVqB1GaSauRQOpty2tSmO3FgloAmF5nEhgyoesMO6CuFW66fn2xdFyA3ZzcRLrMAAAAASUVORK5CYII=);background-color:#eaf8ff;border-color:#00a3ff}.form-check-label{color:var(--Gray-700, #344054);font-family:Inter;font-size:14px;font-style:normal;font-weight:500;line-height:20px}.select-value{border-radius:16px!important;background:var(--Gray-100, #F2F4F7)!important;mix-blend-mode:multiply;color:var(--Gray-700, #344054)!important;text-align:center;font-size:14px;font-style:normal;font-weight:500;line-height:20px;padding:4px 12px 4px 6px}\n"] }]
|
|
1561
|
+
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: UserService }], propDecorators: { onClick: [{
|
|
1562
|
+
type: HostListener,
|
|
1563
|
+
args: ['document:click', ['$event']]
|
|
1564
|
+
}], items: [{
|
|
1565
|
+
type: Input
|
|
1566
|
+
}], searchField: [{
|
|
1567
|
+
type: Input
|
|
1568
|
+
}], multi: [{
|
|
1569
|
+
type: Input
|
|
1570
|
+
}], idField: [{
|
|
1571
|
+
type: Input
|
|
1572
|
+
}], selectedValues: [{
|
|
1573
|
+
type: Input
|
|
1574
|
+
}], disabled: [{
|
|
1575
|
+
type: Input
|
|
1576
|
+
}], label: [{
|
|
1577
|
+
type: Input
|
|
1578
|
+
}], selected: [{
|
|
1579
|
+
type: Output
|
|
1580
|
+
}] } });
|
|
1581
|
+
|
|
1325
1582
|
class AssignStorePopupComponent {
|
|
1326
1583
|
userService;
|
|
1327
1584
|
cd;
|
|
1328
1585
|
ts;
|
|
1329
1586
|
activeModal;
|
|
1587
|
+
modalService;
|
|
1330
1588
|
user;
|
|
1331
1589
|
select = "stores";
|
|
1332
1590
|
stores = [];
|
|
1333
1591
|
clusters = [];
|
|
1334
1592
|
teams = [];
|
|
1335
1593
|
$headerFilters;
|
|
1594
|
+
modalRef;
|
|
1336
1595
|
userData;
|
|
1337
1596
|
userType;
|
|
1338
1597
|
selectedTextstores;
|
|
1339
1598
|
selectedTextclusters;
|
|
1340
1599
|
selectedTextteams;
|
|
1341
|
-
|
|
1600
|
+
inputFile;
|
|
1601
|
+
afterValidation;
|
|
1602
|
+
uploadPopUp;
|
|
1603
|
+
constructor(userService, cd, ts, activeModal, modalService) {
|
|
1342
1604
|
this.userService = userService;
|
|
1343
1605
|
this.cd = cd;
|
|
1344
1606
|
this.ts = ts;
|
|
1345
1607
|
this.activeModal = activeModal;
|
|
1608
|
+
this.modalService = modalService;
|
|
1346
1609
|
this.userService.dataSubject.subscribe({
|
|
1347
1610
|
next: (data) => {
|
|
1348
1611
|
this.userData = data;
|
|
@@ -1472,8 +1735,8 @@ class AssignStorePopupComponent {
|
|
|
1472
1735
|
this.selectedValuesArray[1] = [];
|
|
1473
1736
|
}
|
|
1474
1737
|
resetTeams() {
|
|
1475
|
-
this.dataObject[2].
|
|
1476
|
-
this.
|
|
1738
|
+
this.dataObject[2].teams = [];
|
|
1739
|
+
this.teams = [];
|
|
1477
1740
|
this.selectedValuesArray[2] = [];
|
|
1478
1741
|
}
|
|
1479
1742
|
Opendropdown = false;
|
|
@@ -1523,6 +1786,13 @@ class AssignStorePopupComponent {
|
|
|
1523
1786
|
const selectAllChecked = stores.every((item) => item.checked);
|
|
1524
1787
|
document.getElementById(`selectall${index}`)?.setAttribute("checked", String(selectAllChecked));
|
|
1525
1788
|
document.getElementById(`option${store.storeName}`)?.setAttribute("checked", String(event.target.checked));
|
|
1789
|
+
this.apiData = this.selectedValuesArray[0].map((el) => {
|
|
1790
|
+
return {
|
|
1791
|
+
_id: el?._id,
|
|
1792
|
+
storeName: el?.storeName,
|
|
1793
|
+
storeId: el?.storeId
|
|
1794
|
+
};
|
|
1795
|
+
});
|
|
1526
1796
|
this.loadTable(this.selectedValuesArray[0]);
|
|
1527
1797
|
this.selectedTextstores = `${this.selectedValuesArray[0].length} Stores Selected`;
|
|
1528
1798
|
}
|
|
@@ -1560,27 +1830,17 @@ class AssignStorePopupComponent {
|
|
|
1560
1830
|
}
|
|
1561
1831
|
this.cd.detectChanges();
|
|
1562
1832
|
}
|
|
1563
|
-
|
|
1564
|
-
|
|
1565
|
-
this.
|
|
1566
|
-
|
|
1567
|
-
|
|
1568
|
-
|
|
1569
|
-
|
|
1570
|
-
|
|
1571
|
-
|
|
1572
|
-
|
|
1573
|
-
|
|
1574
|
-
isChecked
|
|
1575
|
-
? this.selectedValuesArray[1].push(cluster)
|
|
1576
|
-
: this.selectedValuesArray[1].splice(clusterIndex, 1);
|
|
1577
|
-
this.dataObject[1].clusters[subIndex].checked = isChecked;
|
|
1578
|
-
}
|
|
1579
|
-
const selectAllChecked = clusters.every((item) => item.checked);
|
|
1580
|
-
document.getElementById(`selectall${index}`)?.setAttribute("checked", String(selectAllChecked));
|
|
1581
|
-
document.getElementById(`option${cluster.clusterName}`)?.setAttribute("checked", String(event.target.checked));
|
|
1582
|
-
this.loadTable(this.selectedValuesArray[1]);
|
|
1583
|
-
this.selectedTextclusters = `${this.selectedValuesArray[1].length} Clusters Selected`;
|
|
1833
|
+
onstoreSelect(event) {
|
|
1834
|
+
this.selectedValuesArray[0] = event;
|
|
1835
|
+
this.cd.detectChanges();
|
|
1836
|
+
}
|
|
1837
|
+
ongroupSelect(event) {
|
|
1838
|
+
this.selectedValuesArray[1] = event;
|
|
1839
|
+
this.cd.detectChanges();
|
|
1840
|
+
}
|
|
1841
|
+
onTeamsSelect(event) {
|
|
1842
|
+
this.selectedValuesArray[2] = event;
|
|
1843
|
+
this.cd.detectChanges();
|
|
1584
1844
|
}
|
|
1585
1845
|
onSubmit() {
|
|
1586
1846
|
if (this.user.assignedValue && this.user.assignedValue.length) {
|
|
@@ -1590,15 +1850,148 @@ class AssignStorePopupComponent {
|
|
|
1590
1850
|
this.assignSubmit();
|
|
1591
1851
|
}
|
|
1592
1852
|
}
|
|
1853
|
+
excelError;
|
|
1854
|
+
excelData = [];
|
|
1855
|
+
validatedOutput = [];
|
|
1856
|
+
getStoreCounts(data) {
|
|
1857
|
+
const uniqueUserNames = new Set(data?.map((item) => item['Store Name/Store Id']));
|
|
1858
|
+
return uniqueUserNames.size;
|
|
1859
|
+
}
|
|
1860
|
+
fileError = false;
|
|
1861
|
+
apiData = [];
|
|
1862
|
+
onUpload(e) {
|
|
1863
|
+
let data = [];
|
|
1864
|
+
let error = [];
|
|
1865
|
+
const target = e.target;
|
|
1866
|
+
if (target.files.length > 1) {
|
|
1867
|
+
this.inputFile.nativeElement.value = "";
|
|
1868
|
+
}
|
|
1869
|
+
if (!!target.files[0].name.match(/(.xls|.xlsx)/)) {
|
|
1870
|
+
const reader = new FileReader();
|
|
1871
|
+
reader.onload = (e) => {
|
|
1872
|
+
const bstr = e.target.result;
|
|
1873
|
+
const wb = read(bstr, { type: "binary" });
|
|
1874
|
+
const wsname = wb.SheetNames[0];
|
|
1875
|
+
const ws = wb.Sheets[wsname];
|
|
1876
|
+
if (wb.SheetNames[0] != "StoreData") {
|
|
1877
|
+
this.fileError = true;
|
|
1878
|
+
this.ts.getErrorToast("Please Upload the Valid File");
|
|
1879
|
+
return;
|
|
1880
|
+
}
|
|
1881
|
+
else {
|
|
1882
|
+
data = utils.sheet_to_json(ws, { defval: "", raw: true });
|
|
1883
|
+
this.excelData = data;
|
|
1884
|
+
}
|
|
1885
|
+
};
|
|
1886
|
+
reader.readAsBinaryString(target.files[0]);
|
|
1887
|
+
reader.onloadend = async (e) => {
|
|
1888
|
+
let processedArray = [];
|
|
1889
|
+
data?.forEach((element, index) => {
|
|
1890
|
+
if (!element?.['Store Name/Store Id'] || element?.['Store Name/Store Id'] == '' || element?.['Store Name/Store Id'] == null) {
|
|
1891
|
+
error.push(`Invalid Store Name/Store Id - A${index + 2}`);
|
|
1892
|
+
}
|
|
1893
|
+
else {
|
|
1894
|
+
processedArray.push({
|
|
1895
|
+
value: data[index]['Store Name/Store Id']
|
|
1896
|
+
});
|
|
1897
|
+
}
|
|
1898
|
+
});
|
|
1899
|
+
if (error.length) {
|
|
1900
|
+
// if (this.uploadPopUp) {
|
|
1901
|
+
// this.uploadPopUp.dismiss();
|
|
1902
|
+
// }
|
|
1903
|
+
// this.modalService.dismissAll();
|
|
1904
|
+
const popupcontent = {
|
|
1905
|
+
displayprop: false,
|
|
1906
|
+
imagesrc: `<svg xmlns="http://www.w3.org/2000/svg" width="56" height="56" viewBox="0 0 56 56" fill="none"><rect x="4" y="4" width="48" height="48" rx="24" fill="#FEF0C7"/><path d="M27.9998 24.0012V28.0012M27.9998 32.0012H28.0098M26.2898 18.8612L17.8198 33.0012C17.6451 33.3036 17.5527 33.6465 17.5518 33.9957C17.5508 34.3449 17.6413 34.6883 17.8142 34.9917C17.9871 35.2951 18.2365 35.5479 18.5375 35.725C18.8385 35.9021 19.1806 35.9973 19.5298 36.0012H36.4698C36.819 35.9973 37.1611 35.9021 37.4621 35.725C37.7631 35.5479 38.0124 35.2951 38.1854 34.9917C38.3583 34.6883 38.4488 34.3449 38.4478 33.9957C38.4468 33.6465 38.3544 33.3036 38.1798 33.0012L29.7098 18.8612C29.5315 18.5673 29.2805 18.3243 28.981 18.1557C28.6814 17.987 28.3435 17.8984 27.9998 17.8984C27.656 17.8984 27.3181 17.987 27.0186 18.1557C26.7191 18.3243 26.468 18.5673 26.2898 18.8612Z" stroke="#DC6803" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><rect x="4" y="4" width="48" height="48" rx="24" stroke="#FFFAEB" stroke-width="8"/></svg>`,
|
|
1907
|
+
title: `Invalid details!`,
|
|
1908
|
+
content: `Please provide correct and complete store information.`,
|
|
1909
|
+
buttontype: 'error',
|
|
1910
|
+
error: error
|
|
1911
|
+
};
|
|
1912
|
+
this.afterUplload(popupcontent);
|
|
1913
|
+
return;
|
|
1914
|
+
}
|
|
1915
|
+
if (this.fileError) {
|
|
1916
|
+
return;
|
|
1917
|
+
}
|
|
1918
|
+
processedArray = processedArray.map((el) => { return { store: el?.value }; });
|
|
1919
|
+
this.userService
|
|
1920
|
+
.bulkstoreAssign({
|
|
1921
|
+
userEmail: this.user.email,
|
|
1922
|
+
data: processedArray
|
|
1923
|
+
})
|
|
1924
|
+
.subscribe({
|
|
1925
|
+
next: (res) => {
|
|
1926
|
+
if (res && res.code == 200) {
|
|
1927
|
+
this.apiData = res?.data?.result;
|
|
1928
|
+
this.selectedValuesArray[0] = res?.data?.result.map((el) => {
|
|
1929
|
+
const stores = this.dataObject?.[0]?.Stores;
|
|
1930
|
+
const match = stores?.find((val) => val._id === el?._id);
|
|
1931
|
+
if (match) {
|
|
1932
|
+
match.checked = true;
|
|
1933
|
+
return match;
|
|
1934
|
+
}
|
|
1935
|
+
return null;
|
|
1936
|
+
}).filter((item) => item !== null);
|
|
1937
|
+
this.afterUplload();
|
|
1938
|
+
}
|
|
1939
|
+
else {
|
|
1940
|
+
this.ts.getErrorToast("The given Store not associated with this brand");
|
|
1941
|
+
}
|
|
1942
|
+
},
|
|
1943
|
+
error: (err) => {
|
|
1944
|
+
if (err.error.code == 400) {
|
|
1945
|
+
// if (this.uploadPopUp) {
|
|
1946
|
+
// this.uploadPopUp.dismiss();
|
|
1947
|
+
// }
|
|
1948
|
+
// // this.modalService.dismissAll();
|
|
1949
|
+
const popupcontent = {
|
|
1950
|
+
displayprop: false,
|
|
1951
|
+
imagesrc: `<svg xmlns="http://www.w3.org/2000/svg" width="56" height="56" viewBox="0 0 56 56" fill="none"><rect x="4" y="4" width="48" height="48" rx="24" fill="#FEF0C7"/><path d="M27.9998 24.0012V28.0012M27.9998 32.0012H28.0098M26.2898 18.8612L17.8198 33.0012C17.6451 33.3036 17.5527 33.6465 17.5518 33.9957C17.5508 34.3449 17.6413 34.6883 17.8142 34.9917C17.9871 35.2951 18.2365 35.5479 18.5375 35.725C18.8385 35.9021 19.1806 35.9973 19.5298 36.0012H36.4698C36.819 35.9973 37.1611 35.9021 37.4621 35.725C37.7631 35.5479 38.0124 35.2951 38.1854 34.9917C38.3583 34.6883 38.4488 34.3449 38.4478 33.9957C38.4468 33.6465 38.3544 33.3036 38.1798 33.0012L29.7098 18.8612C29.5315 18.5673 29.2805 18.3243 28.981 18.1557C28.6814 17.987 28.3435 17.8984 27.9998 17.8984C27.656 17.8984 27.3181 17.987 27.0186 18.1557C26.7191 18.3243 26.468 18.5673 26.2898 18.8612Z" stroke="#DC6803" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><rect x="4" y="4" width="48" height="48" rx="24" stroke="#FFFAEB" stroke-width="8"/></svg>`,
|
|
1952
|
+
title: `Invalid details!`,
|
|
1953
|
+
content: `Please provide correct and complete store information.`,
|
|
1954
|
+
buttontype: 'error',
|
|
1955
|
+
error: err.error.error
|
|
1956
|
+
};
|
|
1957
|
+
this.afterUplload(popupcontent);
|
|
1958
|
+
this.inputFile.nativeElement.value = "";
|
|
1959
|
+
}
|
|
1960
|
+
else {
|
|
1961
|
+
this.ts.getErrorToast(err.error.error);
|
|
1962
|
+
this.inputFile.nativeElement.value = "";
|
|
1963
|
+
}
|
|
1964
|
+
},
|
|
1965
|
+
});
|
|
1966
|
+
};
|
|
1967
|
+
// $("#kt_create_account_form_account_type_personal").val("");
|
|
1968
|
+
}
|
|
1969
|
+
}
|
|
1970
|
+
proceedSubmit() {
|
|
1971
|
+
this.loadTable(this.selectedValuesArray[0]);
|
|
1972
|
+
this.selectedTextstores = `${this.selectedValuesArray[0].length} Stores Selected`;
|
|
1973
|
+
}
|
|
1974
|
+
closeactivepopup() {
|
|
1975
|
+
this.modalService.dismissAll();
|
|
1976
|
+
}
|
|
1977
|
+
afterUplload(data) {
|
|
1978
|
+
this.excelError = data;
|
|
1979
|
+
if (this.uploadPopUp) {
|
|
1980
|
+
this.uploadPopUp.dismiss();
|
|
1981
|
+
}
|
|
1982
|
+
this.uploadPopUp = this.modalService.open(this.afterValidation, { centered: true, backdrop: 'static' });
|
|
1983
|
+
}
|
|
1593
1984
|
assignSubmit() {
|
|
1594
1985
|
let payload = {
|
|
1595
|
-
|
|
1596
|
-
|
|
1597
|
-
|
|
1598
|
-
|
|
1599
|
-
|
|
1600
|
-
|
|
1601
|
-
|
|
1986
|
+
data: [{
|
|
1987
|
+
userEmail: this.user.email,
|
|
1988
|
+
stores: this.apiData,
|
|
1989
|
+
clusters: this.selectedValuesArray[1],
|
|
1990
|
+
teams: this.selectedValuesArray[2]
|
|
1991
|
+
}]
|
|
1992
|
+
// userId:this.user._id,
|
|
1993
|
+
// clientId: this.$headerFilters.client,
|
|
1994
|
+
// userType: this.userType,
|
|
1602
1995
|
};
|
|
1603
1996
|
this.userService
|
|
1604
1997
|
.assignData(payload)
|
|
@@ -1687,16 +2080,22 @@ class AssignStorePopupComponent {
|
|
|
1687
2080
|
closeModal() {
|
|
1688
2081
|
this.activeModal.close('submit');
|
|
1689
2082
|
}
|
|
1690
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
1691
|
-
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: 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: i3.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
|
|
2083
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AssignStorePopupComponent, deps: [{ token: UserService }, { token: i0.ChangeDetectorRef }, { token: i4.ToastService }, { token: i1$1.NgbActiveModal }, { token: i1$1.NgbModal }], target: i0.ɵɵFactoryTarget.Component });
|
|
2084
|
+
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)" } }, viewQueries: [{ propertyName: "inputFile", first: true, predicate: ["inputFile"], descendants: true }, { propertyName: "afterValidation", first: true, predicate: ["afterValidation"], descendants: true }], 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=\"select-wrapper\">\r\n <div class=\"placeholder-overlay\" *ngIf=\"!(dataObject[0]?.Stores?.length)\">\r\n Select Stores\r\n </div>\r\n <lib-group-select [items]=\"dataObject[0]?.Stores\" [disabled]=\"false\" [multi]=\"true\" [searchField]=\"'storeName'\"\r\n [idField]=\"'storeId'\" (selected)=\"onstoreSelect($event)\"\r\n [selectedValues]=\"selectedValuesArray[0]\">\r\n </lib-group-select>\r\n </div>\r\n </div>\r\n <div *ngIf=\"select ==='clusters'\" class=\"w-100 my-5\"> \r\n <div class=\"select-wrapper\">\r\n <div class=\"placeholder-overlay\" *ngIf=\"!(dataObject[1]?.clusters?.length)\">\r\n Select cluster\r\n </div>\r\n <lib-group-select [items]=\"dataObject[1]?.clusters\" [disabled]=\"false\" [multi]=\"true\" [searchField]=\"'clusterName'\"\r\n [idField]=\"'clusterName'\" (selected)=\"ongroupSelect($event)\"\r\n [selectedValues]=\"selectedValuesArray[1]\">\r\n </lib-group-select>\r\n </div>\r\n </div>\r\n <div *ngIf=\"select ==='teams'\" class=\"w-100 my-5\"> \r\n <div class=\"select-wrapper\">\r\n <div class=\"placeholder-overlay\" *ngIf=\"!(dataObject[2]?.teams?.length)\">\r\n Select Stores\r\n </div>\r\n <lib-group-select [items]=\"dataObject[2]?.teams\" [disabled]=\"false\" [multi]=\"true\" [searchField]=\"'teamName'\"\r\n [idField]=\"'teamName'\" (selected)=\"onTeamsSelect($event)\"\r\n [selectedValues]=\"selectedValuesArray[2]\">\r\n </lib-group-select>\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 <section *ngIf=\"select ==='stores'\" class=\"w-100\">\r\n <div class=\"position-relative my-5\">\r\n <hr class=\"hr m-0 border border-gray-400 border-1\">\r\n <div class=\"position-absolute position-or px-10\">or</div>\r\n </div>\r\n <div class=\"d-flex justify-content-start align-items-center\">\r\n <div class=\"fw-bold text-gray-500 my-6\">\r\n <ol class=\"custom-ordered-list text-gray-400 fw-bold fs-6\">\r\n <li class=\"user-text\">Use the template to upload multiple stores at once.</li>\r\n <li class=\"user-text my-3\"><span class=\"user-text\">Download the template here - </span>\r\n <a class=\"ms-1\" href=\"../../../assets/files/storeListTemplate.xlsx\" 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 class=\"user-text my-3\">Add your data to the Template File</li> \r\n </ol>\r\n </div>\r\n </div>\r\n <div class=\"mt-3 ms-3 right-bar py-5 d-flex justify-content-center align-items-center flex-column\" >\r\n <input name=\"accountType\" type=\"radio\" id=\"kt_create_account_form_account_type_personal\" value=\"personal\"\r\n class=\"btn-check\"\r\n (change)=\"onUpload($event)\"\r\n ng-reflect-value=\"persona\" type=\"file\" #inputFile />\r\n <label for=\"kt_create_account_form_account_type_personal\" class=\" w-50 p-4\"><span\r\n class=\"fw-bold text-center w-100 fs-4\">\r\n <div class=\"d-flex justify-content-center align-items-center w-100\">\r\n <svg width=\"46\" height=\"46\" viewBox=\"0 0 46 46\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"3\" y=\"3\" width=\"40\" height=\"40\" rx=\"20\" fill=\"#F2F4F7\" />\r\n <rect x=\"3\" y=\"3\" width=\"40\" height=\"40\" rx=\"20\" stroke=\"#F9FAFB\"\r\n stroke-width=\"6\" />\r\n <g clip-path=\"url(#clip0_4047_40566)\">\r\n <path\r\n d=\"M26.3333 26.3334L23 23M23 23L19.6666 26.3334M23 23V30.5M29.9916 28.325C30.8044 27.8819 31.4465 27.1808 31.8165 26.3322C32.1866 25.4837 32.2635 24.5361 32.0351 23.6389C31.8068 22.7418 31.2862 21.9463 30.5555 21.3779C29.8248 20.8095 28.9257 20.5006 28 20.5H26.95C26.6977 19.5244 26.2276 18.6186 25.5749 17.8509C24.9222 17.0831 24.104 16.4732 23.1817 16.0672C22.2594 15.6612 21.2571 15.4695 20.2501 15.5066C19.243 15.5437 18.2575 15.8086 17.3676 16.2814C16.4777 16.7542 15.7066 17.4226 15.1122 18.2363C14.5177 19.0501 14.1155 19.988 13.9358 20.9795C13.756 21.9711 13.8034 22.9905 14.0743 23.9611C14.3452 24.9317 14.8327 25.8282 15.5 26.5834\"\r\n stroke=\"#475467\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_4047_40566\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\"\r\n transform=\"translate(13 13)\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </div>\r\n <div class=\"nodata-title\"><span class=\"click-upload cursor-pointer\">Click to\r\n upload</span>\r\n <!-- <span class=\"ms-2\">or drag and drop</span> -->\r\n </div>\r\n <div class=\"nodata-sub\">the data added template file for processing.</div>\r\n </span>\r\n </label>\r\n </div>\r\n </section>\r\n\r\n <div class=\"d-flex mb-10 w-100 mt-10\" 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>\r\n\r\n<ng-template #afterValidation let-model>\r\n <div class=\"card border-0\">\r\n <div class=\"card-header border-0 mt-0\">\r\n <div class=\"card-title mt-3\"><span class=\"config-heading fw-semibold w-auto\">Bulk Assign</span></div>\r\n </div>\r\n <div class=\"card-body pt-0\">\r\n <div class=\"row\">\r\n <div class=\"col-sm-4\">\r\n <div class=\"popup-card rounded-3 p-3 flex-column h-70px\">\r\n <div class=\"fw-semibold config-heading w-100\">{{getStoreCounts(excelData)}}</div>\r\n <div class=\"fw-semibold subtitle mt-1\">Total Records</div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-4\">\r\n <div class=\"popup-card rounded-3 p-3 flex-column h-70px\">\r\n <div class=\"fw-semibold config-heading w-100\">{{excelData?.length}}</div>\r\n <div class=\"fw-semibold subtitle mt-1\">Rows processed</div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-4\">\r\n <div class=\"popup-card rounded-3 p-3 flex-column h-70px\">\r\n <div [ngClass]=\"excelError ? 'error-heading':''\" class=\"fw-semibold config-heading w-100\">{{excelError?.error?.length || 0}}</div>\r\n <div [ngClass]=\"excelError ? 'excel-error':''\" class=\"fw-semibold subtitle mt-1\">Error</div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!excelError\" class=\"table-header mt-5\" style=\"font-weight: 400;\">\r\n <div >You're about to assign {{getStoreCounts(excelData)}} {{getStoreCounts(excelData) > 1 ? 'Stores' : 'Store'}}. Are you sure want to proceed?</div>\r\n \r\n </div>\r\n <div *ngIf=\"excelError\" class=\"flex-column mt-5\">\r\n <div class=\"config-heading fw-bold\">Invalid Details !</div>\r\n <div class=\"subtitle mt-5\">Please provide correct information.</div>\r\n <div class=\"p-5 w-100 rounded-3 border-error mt-5 flex-column\">\r\n <div *ngFor=\"let error of excelError?.error; let i = index; let last = last\" [ngClass]=\"!last ? 'mb-2' : ''\" class=\"text-error\">{{i + 1}}) {{error}}</div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n <div class=\"card-footer border-0 text-end pt-0\">\r\n <button class=\"btn btn-md btn-default btn-outline\" (click)=\"closeactivepopup()\">Cancel</button>\r\n <button *ngIf=\"!excelError\" class=\"btn btn-md py-3 btn-default ms-3 btn-primary\" (click)=\"proceedSubmit();model.close()\">Proceed</button>\r\n <button *ngIf=\"excelError\" class=\"btn py-3 btn-md btn-default ms-3 btn-danger\" (click)=\"file1.click();\">Reupload</button>\r\n <input style=\"visibility: hidden;\" #file1 type=\"file\" id=\"kt_account_team_size_select_2\"\r\n (change)=\"onUpload($event)\" />\r\n </div>\r\n </div>\r\n</ng-template>", 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}.user-text{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:400!important;line-height:20px}.right-bar{border-radius:8px;border:1px solid var(--Gray-300, #D0D5DD)}.click-upload{color:var(--Primary-700, #009BF3)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-decoration-line:underline;text-transform:capitalize}.position-or{left:50%;top:-10px;background:#fff;transform:translate(-50%)}.subtitle{color:var(--Gray-500, #667085);font-size:14px;font-weight:400;line-height:20px}.config-heading{color:var(--Gray-900, #101828);font-size:18px;font-weight:600;line-height:28px}.table-header{color:var(--Gray-800, #1D2939);font-size:16px;font-weight:400;line-height:24px}.text-error{color:var(--Error-700, #B42318)!important;font-size:14px;font-weight:500;line-height:20px}.excel-error{color:var(--Error-600, #D92D20);font-size:14px;font-weight:500;line-height:20px}.error-heading{color:var(--Error-600, #D92D20);font-size:20px;font-weight:500;line-height:30px}.border-error{border:1px solid var(--Error-300, #FDA29B)!important;background:var(--Error-25, #FFFBFA)!important}.popup-card{border-radius:6px;border:1px solid var(--Gray-300, #D0D5DD);background:#fff;box-shadow:0 1px 3px #1018281a,0 1px 2px #1018280f}\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: "component", type: GroupSelectComponent, selector: "lib-group-select", inputs: ["items", "searchField", "multi", "idField", "selectedValues", "disabled", "label"], outputs: ["selected"] }] });
|
|
1692
2085
|
}
|
|
1693
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
2086
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AssignStorePopupComponent, decorators: [{
|
|
1694
2087
|
type: Component,
|
|
1695
2088
|
args: [{ selector: "lib-assign-store-popup", host: {
|
|
1696
2089
|
'(document:click)': 'onClick($event)',
|
|
1697
|
-
}, 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"] }]
|
|
1698
|
-
}], ctorParameters: () => [{ type: UserService }, { type: i0.ChangeDetectorRef }, { type: i4.ToastService }, { type: i1$1.NgbActiveModal }], propDecorators: { user: [{
|
|
2090
|
+
}, 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=\"select-wrapper\">\r\n <div class=\"placeholder-overlay\" *ngIf=\"!(dataObject[0]?.Stores?.length)\">\r\n Select Stores\r\n </div>\r\n <lib-group-select [items]=\"dataObject[0]?.Stores\" [disabled]=\"false\" [multi]=\"true\" [searchField]=\"'storeName'\"\r\n [idField]=\"'storeId'\" (selected)=\"onstoreSelect($event)\"\r\n [selectedValues]=\"selectedValuesArray[0]\">\r\n </lib-group-select>\r\n </div>\r\n </div>\r\n <div *ngIf=\"select ==='clusters'\" class=\"w-100 my-5\"> \r\n <div class=\"select-wrapper\">\r\n <div class=\"placeholder-overlay\" *ngIf=\"!(dataObject[1]?.clusters?.length)\">\r\n Select cluster\r\n </div>\r\n <lib-group-select [items]=\"dataObject[1]?.clusters\" [disabled]=\"false\" [multi]=\"true\" [searchField]=\"'clusterName'\"\r\n [idField]=\"'clusterName'\" (selected)=\"ongroupSelect($event)\"\r\n [selectedValues]=\"selectedValuesArray[1]\">\r\n </lib-group-select>\r\n </div>\r\n </div>\r\n <div *ngIf=\"select ==='teams'\" class=\"w-100 my-5\"> \r\n <div class=\"select-wrapper\">\r\n <div class=\"placeholder-overlay\" *ngIf=\"!(dataObject[2]?.teams?.length)\">\r\n Select Stores\r\n </div>\r\n <lib-group-select [items]=\"dataObject[2]?.teams\" [disabled]=\"false\" [multi]=\"true\" [searchField]=\"'teamName'\"\r\n [idField]=\"'teamName'\" (selected)=\"onTeamsSelect($event)\"\r\n [selectedValues]=\"selectedValuesArray[2]\">\r\n </lib-group-select>\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 <section *ngIf=\"select ==='stores'\" class=\"w-100\">\r\n <div class=\"position-relative my-5\">\r\n <hr class=\"hr m-0 border border-gray-400 border-1\">\r\n <div class=\"position-absolute position-or px-10\">or</div>\r\n </div>\r\n <div class=\"d-flex justify-content-start align-items-center\">\r\n <div class=\"fw-bold text-gray-500 my-6\">\r\n <ol class=\"custom-ordered-list text-gray-400 fw-bold fs-6\">\r\n <li class=\"user-text\">Use the template to upload multiple stores at once.</li>\r\n <li class=\"user-text my-3\"><span class=\"user-text\">Download the template here - </span>\r\n <a class=\"ms-1\" href=\"../../../assets/files/storeListTemplate.xlsx\" 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 class=\"user-text my-3\">Add your data to the Template File</li> \r\n </ol>\r\n </div>\r\n </div>\r\n <div class=\"mt-3 ms-3 right-bar py-5 d-flex justify-content-center align-items-center flex-column\" >\r\n <input name=\"accountType\" type=\"radio\" id=\"kt_create_account_form_account_type_personal\" value=\"personal\"\r\n class=\"btn-check\"\r\n (change)=\"onUpload($event)\"\r\n ng-reflect-value=\"persona\" type=\"file\" #inputFile />\r\n <label for=\"kt_create_account_form_account_type_personal\" class=\" w-50 p-4\"><span\r\n class=\"fw-bold text-center w-100 fs-4\">\r\n <div class=\"d-flex justify-content-center align-items-center w-100\">\r\n <svg width=\"46\" height=\"46\" viewBox=\"0 0 46 46\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"3\" y=\"3\" width=\"40\" height=\"40\" rx=\"20\" fill=\"#F2F4F7\" />\r\n <rect x=\"3\" y=\"3\" width=\"40\" height=\"40\" rx=\"20\" stroke=\"#F9FAFB\"\r\n stroke-width=\"6\" />\r\n <g clip-path=\"url(#clip0_4047_40566)\">\r\n <path\r\n d=\"M26.3333 26.3334L23 23M23 23L19.6666 26.3334M23 23V30.5M29.9916 28.325C30.8044 27.8819 31.4465 27.1808 31.8165 26.3322C32.1866 25.4837 32.2635 24.5361 32.0351 23.6389C31.8068 22.7418 31.2862 21.9463 30.5555 21.3779C29.8248 20.8095 28.9257 20.5006 28 20.5H26.95C26.6977 19.5244 26.2276 18.6186 25.5749 17.8509C24.9222 17.0831 24.104 16.4732 23.1817 16.0672C22.2594 15.6612 21.2571 15.4695 20.2501 15.5066C19.243 15.5437 18.2575 15.8086 17.3676 16.2814C16.4777 16.7542 15.7066 17.4226 15.1122 18.2363C14.5177 19.0501 14.1155 19.988 13.9358 20.9795C13.756 21.9711 13.8034 22.9905 14.0743 23.9611C14.3452 24.9317 14.8327 25.8282 15.5 26.5834\"\r\n stroke=\"#475467\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_4047_40566\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\"\r\n transform=\"translate(13 13)\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </div>\r\n <div class=\"nodata-title\"><span class=\"click-upload cursor-pointer\">Click to\r\n upload</span>\r\n <!-- <span class=\"ms-2\">or drag and drop</span> -->\r\n </div>\r\n <div class=\"nodata-sub\">the data added template file for processing.</div>\r\n </span>\r\n </label>\r\n </div>\r\n </section>\r\n\r\n <div class=\"d-flex mb-10 w-100 mt-10\" 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>\r\n\r\n<ng-template #afterValidation let-model>\r\n <div class=\"card border-0\">\r\n <div class=\"card-header border-0 mt-0\">\r\n <div class=\"card-title mt-3\"><span class=\"config-heading fw-semibold w-auto\">Bulk Assign</span></div>\r\n </div>\r\n <div class=\"card-body pt-0\">\r\n <div class=\"row\">\r\n <div class=\"col-sm-4\">\r\n <div class=\"popup-card rounded-3 p-3 flex-column h-70px\">\r\n <div class=\"fw-semibold config-heading w-100\">{{getStoreCounts(excelData)}}</div>\r\n <div class=\"fw-semibold subtitle mt-1\">Total Records</div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-4\">\r\n <div class=\"popup-card rounded-3 p-3 flex-column h-70px\">\r\n <div class=\"fw-semibold config-heading w-100\">{{excelData?.length}}</div>\r\n <div class=\"fw-semibold subtitle mt-1\">Rows processed</div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-4\">\r\n <div class=\"popup-card rounded-3 p-3 flex-column h-70px\">\r\n <div [ngClass]=\"excelError ? 'error-heading':''\" class=\"fw-semibold config-heading w-100\">{{excelError?.error?.length || 0}}</div>\r\n <div [ngClass]=\"excelError ? 'excel-error':''\" class=\"fw-semibold subtitle mt-1\">Error</div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!excelError\" class=\"table-header mt-5\" style=\"font-weight: 400;\">\r\n <div >You're about to assign {{getStoreCounts(excelData)}} {{getStoreCounts(excelData) > 1 ? 'Stores' : 'Store'}}. Are you sure want to proceed?</div>\r\n \r\n </div>\r\n <div *ngIf=\"excelError\" class=\"flex-column mt-5\">\r\n <div class=\"config-heading fw-bold\">Invalid Details !</div>\r\n <div class=\"subtitle mt-5\">Please provide correct information.</div>\r\n <div class=\"p-5 w-100 rounded-3 border-error mt-5 flex-column\">\r\n <div *ngFor=\"let error of excelError?.error; let i = index; let last = last\" [ngClass]=\"!last ? 'mb-2' : ''\" class=\"text-error\">{{i + 1}}) {{error}}</div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n <div class=\"card-footer border-0 text-end pt-0\">\r\n <button class=\"btn btn-md btn-default btn-outline\" (click)=\"closeactivepopup()\">Cancel</button>\r\n <button *ngIf=\"!excelError\" class=\"btn btn-md py-3 btn-default ms-3 btn-primary\" (click)=\"proceedSubmit();model.close()\">Proceed</button>\r\n <button *ngIf=\"excelError\" class=\"btn py-3 btn-md btn-default ms-3 btn-danger\" (click)=\"file1.click();\">Reupload</button>\r\n <input style=\"visibility: hidden;\" #file1 type=\"file\" id=\"kt_account_team_size_select_2\"\r\n (change)=\"onUpload($event)\" />\r\n </div>\r\n </div>\r\n</ng-template>", 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}.user-text{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:400!important;line-height:20px}.right-bar{border-radius:8px;border:1px solid var(--Gray-300, #D0D5DD)}.click-upload{color:var(--Primary-700, #009BF3)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-decoration-line:underline;text-transform:capitalize}.position-or{left:50%;top:-10px;background:#fff;transform:translate(-50%)}.subtitle{color:var(--Gray-500, #667085);font-size:14px;font-weight:400;line-height:20px}.config-heading{color:var(--Gray-900, #101828);font-size:18px;font-weight:600;line-height:28px}.table-header{color:var(--Gray-800, #1D2939);font-size:16px;font-weight:400;line-height:24px}.text-error{color:var(--Error-700, #B42318)!important;font-size:14px;font-weight:500;line-height:20px}.excel-error{color:var(--Error-600, #D92D20);font-size:14px;font-weight:500;line-height:20px}.error-heading{color:var(--Error-600, #D92D20);font-size:20px;font-weight:500;line-height:30px}.border-error{border:1px solid var(--Error-300, #FDA29B)!important;background:var(--Error-25, #FFFBFA)!important}.popup-card{border-radius:6px;border:1px solid var(--Gray-300, #D0D5DD);background:#fff;box-shadow:0 1px 3px #1018281a,0 1px 2px #1018280f}\n"] }]
|
|
2091
|
+
}], ctorParameters: () => [{ type: UserService }, { type: i0.ChangeDetectorRef }, { type: i4.ToastService }, { type: i1$1.NgbActiveModal }, { type: i1$1.NgbModal }], propDecorators: { user: [{
|
|
1699
2092
|
type: Input
|
|
2093
|
+
}], inputFile: [{
|
|
2094
|
+
type: ViewChild,
|
|
2095
|
+
args: ["inputFile"]
|
|
2096
|
+
}], afterValidation: [{
|
|
2097
|
+
type: ViewChild,
|
|
2098
|
+
args: ['afterValidation']
|
|
1700
2099
|
}] } });
|
|
1701
2100
|
|
|
1702
2101
|
class AlertPopupComponent {
|
|
@@ -1714,10 +2113,10 @@ class AlertPopupComponent {
|
|
|
1714
2113
|
onSubmit() {
|
|
1715
2114
|
this.activeModal.close('submit');
|
|
1716
2115
|
}
|
|
1717
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
1718
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
2116
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AlertPopupComponent, deps: [{ token: i1$1.NgbActiveModal }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
2117
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: AlertPopupComponent, selector: "lib-alert-popup", inputs: { status: "status", userName: "userName" }, ngImport: i0, template: "<div class=\"card group-delete py-0\">\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 <svg width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#FEF0C7\"/>\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#FFFAEB\" stroke-width=\"8\"/>\r\n <path d=\"M27.9988 24V28M27.9988 32H28.0088M26.2888 18.86L17.8188 33C17.6442 33.3024 17.5518 33.6453 17.5508 33.9945C17.5498 34.3437 17.6403 34.6871 17.8132 34.9905C17.9862 35.2939 18.2355 35.5467 18.5365 35.7238C18.8375 35.9009 19.1796 35.9961 19.5288 36H36.4688C36.818 35.9961 37.1601 35.9009 37.4611 35.7238C37.7621 35.5467 38.0114 35.2939 38.1844 34.9905C38.3573 34.6871 38.4478 34.3437 38.4468 33.9945C38.4458 33.6453 38.3534 33.3024 38.1788 33L29.7088 18.86C29.5305 18.5661 29.2795 18.3231 28.98 18.1544C28.6805 17.9858 28.3425 17.8972 27.9988 17.8972C27.6551 17.8972 27.3171 17.9858 27.0176 18.1544C26.7181 18.3231 26.4671 18.5661 26.2888 18.86Z\" stroke=\"#DC6803\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg> \r\n </div>\r\n </div>\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Are you sure?</a>\r\n <span *ngIf=\"status\" class=\"sub-title fw-normal mt-2\">Do you want to active the user<b> {{userName}}</b> ?</span>\r\n <span *ngIf=\"!status\" class=\"sub-title fw-normal mt-2\">Do you want to deactive the user<b> {{userName}}</b> ?</span>\r\n\r\n <div class=\"mt-5 w-100\">\r\n \r\n <div role=\"group\" class=\"d-flex mt-3 mb-15\">\r\n <button class=\"btn btn-outline w-100 me-3\" (click)=\"cancel()\">Cancel</button>\r\n <button *ngIf=\"status\" id=\"alert-toast\" class=\"btn btn-primary w-100 ms-3\" (click)=\"onSubmit()\">Active</button>\r\n <button *ngIf=\"!status\" id=\"alert-toast\" class=\"btn btn-danger w-100 ms-3\" (click)=\"onSubmit()\">Deactive</button>\r\n </div>\r\n \r\n </div>\r\n\r\n </div>\r\n</div>", styles: [".sub-title{font-size:14px!important}\n"], dependencies: [{ kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
1719
2118
|
}
|
|
1720
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
2119
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AlertPopupComponent, decorators: [{
|
|
1721
2120
|
type: Component,
|
|
1722
2121
|
args: [{ selector: 'lib-alert-popup', template: "<div class=\"card group-delete py-0\">\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 <svg width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#FEF0C7\"/>\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#FFFAEB\" stroke-width=\"8\"/>\r\n <path d=\"M27.9988 24V28M27.9988 32H28.0088M26.2888 18.86L17.8188 33C17.6442 33.3024 17.5518 33.6453 17.5508 33.9945C17.5498 34.3437 17.6403 34.6871 17.8132 34.9905C17.9862 35.2939 18.2355 35.5467 18.5365 35.7238C18.8375 35.9009 19.1796 35.9961 19.5288 36H36.4688C36.818 35.9961 37.1601 35.9009 37.4611 35.7238C37.7621 35.5467 38.0114 35.2939 38.1844 34.9905C38.3573 34.6871 38.4478 34.3437 38.4468 33.9945C38.4458 33.6453 38.3534 33.3024 38.1788 33L29.7088 18.86C29.5305 18.5661 29.2795 18.3231 28.98 18.1544C28.6805 17.9858 28.3425 17.8972 27.9988 17.8972C27.6551 17.8972 27.3171 17.9858 27.0176 18.1544C26.7181 18.3231 26.4671 18.5661 26.2888 18.86Z\" stroke=\"#DC6803\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg> \r\n </div>\r\n </div>\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Are you sure?</a>\r\n <span *ngIf=\"status\" class=\"sub-title fw-normal mt-2\">Do you want to active the user<b> {{userName}}</b> ?</span>\r\n <span *ngIf=\"!status\" class=\"sub-title fw-normal mt-2\">Do you want to deactive the user<b> {{userName}}</b> ?</span>\r\n\r\n <div class=\"mt-5 w-100\">\r\n \r\n <div role=\"group\" class=\"d-flex mt-3 mb-15\">\r\n <button class=\"btn btn-outline w-100 me-3\" (click)=\"cancel()\">Cancel</button>\r\n <button *ngIf=\"status\" id=\"alert-toast\" class=\"btn btn-primary w-100 ms-3\" (click)=\"onSubmit()\">Active</button>\r\n <button *ngIf=\"!status\" id=\"alert-toast\" class=\"btn btn-danger w-100 ms-3\" (click)=\"onSubmit()\">Deactive</button>\r\n </div>\r\n \r\n </div>\r\n\r\n </div>\r\n</div>", styles: [".sub-title{font-size:14px!important}\n"] }]
|
|
1723
2122
|
}], ctorParameters: () => [{ type: i1$1.NgbActiveModal }, { type: i0.ChangeDetectorRef }], propDecorators: { status: [{
|
|
@@ -1749,10 +2148,10 @@ class ExcelService {
|
|
|
1749
2148
|
});
|
|
1750
2149
|
FileSaver.saveAs(data, fileName + EXCEL_EXTENSION);
|
|
1751
2150
|
}
|
|
1752
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
1753
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.
|
|
2151
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ExcelService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
2152
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ExcelService, providedIn: 'root' });
|
|
1754
2153
|
}
|
|
1755
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
2154
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ExcelService, decorators: [{
|
|
1756
2155
|
type: Injectable,
|
|
1757
2156
|
args: [{
|
|
1758
2157
|
providedIn: 'root'
|
|
@@ -2238,10 +2637,10 @@ class UserTableComponent {
|
|
|
2238
2637
|
this.userList_req.export = false;
|
|
2239
2638
|
this.loadTable();
|
|
2240
2639
|
}
|
|
2241
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
2242
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.11", type: UserTableComponent, selector: "lib-user-table", ngImport: i0, template: "<div *ngIf=\"receivedData ===''\" class=\"card\">\r\n <div class=\"card-header border-0 pt-3\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <div class=\"d-flex overflow-auto h-50px\">\r\n <ul\r\n class=\"nav nav-stretch w-100 nav-line-tabs nav-line-tabs-2x border-bottom-2 fs-5 fw-bolder flex-nowrap\">\r\n <li class=\"nav-item activated cursor-pointer bg-light-primary px-5 text-center me-5\"><a\r\n class=\"nav-link me-0 text-active-primary\">Users</a>\r\n </li>\r\n <li *ngIf=\"(gs.userAccess | async)?.userType === 'tango' && userRole === 'superadmin'\"\r\n class=\"nav-item cursor-pointer me-5\"><a routerLink=\"/manage/users/tango/audit\"\r\n class=\"nav-link text-active-primary\">Audit Users\r\n Summary</a>\r\n </li>\r\n </ul>\r\n </div>\r\n <span class=\"text-sub mb-2 mt-5\">{{pagination?.totalCount}} total users</span>\r\n </h3>\r\n <div class=\"card-toolbar\">\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\"></rect>\r\n <path\r\n d=\"M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z\"\r\n fill=\"currentColor\"></path>\r\n </svg>\r\n </span>\r\n <input type=\"text\" (change)=\"searchData()\" [(ngModel)]=\"searchValue\" class=\"form-control ps-14 me-2\"\r\n name=\"search\" autocomplete=\"off\" placeholder=\"Search\" autocomplete=\"off\" />\r\n <lib-filters [dataObject]=\"dataObject\" (appliedFilters)=\"applyFilters($event)\"></lib-filters>\r\n @if (!loading && !noData) {\r\n <!-- @if ((gs.userAccess |async)?.Global_User_isEdit) { -->\r\n <button type=\"button\" (click)=\"exportXLSX()\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default px-4 py-3 rounded-3 text-nowrap border-val\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M8.125 13.125H16.3562L14.7438 14.7438L15.625 15.625L18.75 12.5L15.625 9.375L14.7438 10.2562L16.3562 11.875H8.125V13.125Z\"\r\n fill=\"black\" />\r\n <path\r\n d=\"M13.75 8.75V6.25C13.7505 6.16774 13.7347 6.0862 13.7036 6.01005C13.6725 5.93391 13.6267 5.86465 13.5688 5.80625L9.19375 1.43125C9.13535 1.37332 9.06609 1.32749 8.98994 1.29639C8.91379 1.26529 8.83225 1.24952 8.75 1.25H2.5C2.16848 1.25 1.85054 1.38169 1.61612 1.61611C1.3817 1.85053 1.25 2.16847 1.25 2.5V17.5C1.25 17.8315 1.3817 18.1495 1.61612 18.3839C1.85054 18.6183 2.16848 18.75 2.5 18.75H12.5C12.8315 18.75 13.1495 18.6183 13.3839 18.3839C13.6183 18.1495 13.75 17.8315 13.75 17.5V16.25H12.5V17.5H2.5V2.5H7.5V6.25C7.5 6.58152 7.6317 6.89946 7.86612 7.13388C8.10054 7.3683 8.41848 7.5 8.75 7.5H12.5V8.75H13.75ZM8.75 6.25V2.75625L12.2438 6.25H8.75Z\"\r\n fill=\"black\" />\r\n </svg><span class=\"ms-2\">Export</span> </button>\r\n <!-- } -->\r\n }\r\n @if ((gs.userAccess | async)?.Global_User_isAdd) {\r\n <button type=\"button\" (click)=\"users('add')\" class=\"btn btn-primary mx-2 rounded-3 text-nowrap\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M10.0001 4.16663V15.8333M4.16675 9.99996H15.8334\" stroke=\"white\"\r\n stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2 text-white\">Add User</span> </button>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"card-body p-0\">\r\n <div class=\"table-responsive\">\r\n <table class=\"table bottom-border text-nowrap \">\r\n <thead>\r\n <tr>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('userName')\">Name\r\n <svg [ngClass]=\"userList_req?.sortColumName === 'userName' && userList_req?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"userList_req?.sortColumName === 'userName' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('email')\">Email\r\n <svg [ngClass]=\"userList_req?.sortColumName === 'email' && userList_req?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"userList_req?.sortColumName === 'email' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('role')\">Roles\r\n <svg [ngClass]=\"userList_req?.sortColumName === 'role' && userList_req?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"userList_req?.sortColumName === 'role' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('assigned')\">Clients Assigned\r\n <svg [ngClass]=\"userList_req?.sortColumName === 'assigned' && userList_req?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"userList_req?.sortColumName === 'assigned' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('mobileNumber')\">Contact Number\r\n <svg [ngClass]=\"userList_req?.sortColumName === 'mobileNumber' && userList_req?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"userList_req?.sortColumName === 'mobileNumber' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th>Actions</th>\r\n </tr>\r\n </thead>\r\n <tbody class=\"fw-semibold\">\r\n <ng-container *ngFor=\"let user of userList;let i=index;\">\r\n <tr>\r\n <td>{{user?.userName}}</td>\r\n <td>{{user?.email}}</td>\r\n <td *ngIf=\"user?.role ==='superadmin'\">Super Admin</td>\r\n <td *ngIf=\"user?.role !=='superadmin'\">{{user?.role | titlecase}}</td>\r\n <td>{{user?.assigned || 0}}</td>\r\n <td>{{user?.mobileNumber}}</td>\r\n <td>\r\n <div class=\"d-flex\">\r\n <span class=\"cursor-pointer\" (click)=\"Viewusers('view',user)\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\"\r\n viewBox=\"0 0 21 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_1995_16400)\">\r\n <path\r\n d=\"M1.33325 10C1.33325 10 4.66658 3.33337 10.4999 3.33337C16.3333 3.33337 19.6666 10 19.6666 10C19.6666 10 16.3333 16.6667 10.4999 16.6667C4.66658 16.6667 1.33325 10 1.33325 10Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10.4999 12.5C11.8806 12.5 12.9999 11.3808 12.9999 10C12.9999 8.61933 11.8806 7.50004 10.4999 7.50004C9.11921 7.50004 7.99992 8.61933 7.99992 10C7.99992 11.3808 9.11921 12.5 10.4999 12.5Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_1995_16400\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\"\r\n transform=\"translate(0.5)\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n <span class=\"form-check form-switch mx-6\">\r\n <input class=\"form-check-input mt-3 cursor-pointer\" type=\"checkbox\"\r\n [disabled]=\"!((gs.userAccess | async)?.Global_User_isEdit)\"\r\n (change)=\"userStatusChange(user,i)\" [(ngModel)]=\"userList[i].isActive\"\r\n role=\"switch\" checked=\"\">\r\n @if (userList[i].isActive) {\r\n Active\r\n } @else {\r\n Deactive\r\n }\r\n </span>\r\n </div>\r\n </td>\r\n </tr>\r\n </ng-container>\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12 my-3\">\r\n <lib-pagination *ngIf=\"userList.length!==0\" [itemsPerPage]=\"pagination.limit\" [currentPage]=\"pagination.offset\"\r\n [totalItems]=\"pagination.totalCount\" [paginationSizes]=\"paginationSizes\" [pageSize]=\"paginationSize()\"\r\n (pageChange)=\"onPageChange($event)\" (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n <div *ngIf=\"loading\" class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"noData\" class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-nodata\" src=\"./assets/tango/Icons/Nodata1.svg\" alt=\"\">\r\n <div class=\"nodata-title\">No data found</div>\r\n <div class=\"nodata-sub\">There is no result for this Date</div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n\r\n\r\n<!-- <div *ngIf=\"receivedData ===''\" class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12 my-3\">\r\n <div class=\"card p-5\">\r\n <div class=\"border-0\">\r\n <h3 class=\"title fw-bold\">Roles & Permission</h3>\r\n <h6 class=\"sub-title fw-normal\">{{rolesCount || 0}} total roles</h6>\r\n </div>\r\n <div class=\"card-body px-0\">\r\n <div class=\"flex-column align-items-start\">\r\n <div class=\"row\">\r\n <div class=\"col-md-4 border-val mx-3 mb-7 py-7\" *ngFor=\"let obj of roles\">\r\n <a *ngIf=\"obj.roleName ==='superadmin'\" class=\"role-title my-2 cursor-pointer\" >Super Admin</a>\r\n <a *ngIf=\"obj.roleName !=='superadmin'\" class=\"role-title my-2 cursor-pointer\" >{{obj.roleName |\r\n titlecase}}</a>\r\n <div *ngIf=\"obj.roleName ==='superadmin'\" class=\"sub-title fw-semibold my-5\">Oversees all the operations and controls the entire functionality of the dashboard</div>\r\n <div *ngIf=\"obj.roleName ==='admin'\" class=\"sub-title fw-semibold my-5\">Manages specific operations, permissions, and can change setting for assigned locations</div>\r\n <div *ngIf=\"obj.roleName ==='user'\" class=\"sub-title fw-semibold my-5\">Access to specific location and will be able to view dashboard</div>\r\n <div><span class=\"me-5\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"25\" height=\"24\"\r\n viewBox=\"0 0 25 24\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_1973_14308)\">\r\n <path\r\n d=\"M17.5 21V19C17.5 17.9391 17.0786 16.9217 16.3284 16.1716C15.5783 15.4214 14.5609 15 13.5 15H5.5C4.43913 15 3.42172 15.4214 2.67157 16.1716C1.92143 16.9217 1.5 17.9391 1.5 19V21M23.5 21V19C23.4993 18.1137 23.2044 17.2528 22.6614 16.5523C22.1184 15.8519 21.3581 15.3516 20.5 15.13M16.5 3.13C17.3604 3.3503 18.123 3.8507 18.6676 4.55231C19.2122 5.25392 19.5078 6.11683 19.5078 7.005C19.5078 7.89317 19.2122 8.75608 18.6676 9.45769C18.123 10.1593 17.3604 10.6597 16.5 10.88M13.5 7C13.5 9.20914 11.7091 11 9.5 11C7.29086 11 5.5 9.20914 5.5 7C5.5 4.79086 7.29086 3 9.5 3C11.7091 3 13.5 4.79086 13.5 7Z\"\r\n stroke=\"#667085\" stroke-width=\"2\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_1973_14308\">\r\n <rect width=\"24\" height=\"24\" fill=\"white\" transform=\"translate(0.5)\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n <span class=\"uses-list fw-semibold\">{{obj?.count || 0}} Members</span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div> -->\r\n\r\n<!--begin::Row-->\r\n<!-- <div *ngIf=\"receivedData ==='Role Value'\" class=\"row gx-5 gx-xl-10\"> -->\r\n<!--begin::Col-->\r\n<!-- <div class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12\"> -->\r\n<!-- <lib-roles-permission-table (dataEvent)=\"receiveData($event)\"></lib-roles-permission-table> -->\r\n<!-- </div> -->\r\n<!--end::Col-->\r\n<!-- </div> -->\r\n<!--end::Row-->", styles: [".border-val{color:var(--Gray-700, #344054)!important;font-family:Inter;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}.table-title-primary{color:var(--Primary-700, #009BF3)!important;font-weight:500!important}.table-sub{line-height:30px!important;color:var(--Gray-500, #667085)!important}td{padding:16px 24px!important;line-height:36px!important}.img-src{width:25%;height:20%}.border-val{padding:16px;border-radius:12px;border:1px solid var(--Gray-200, #EAECF0);background:#fff;box-shadow:0 0 20px #4c577d05}.role-title{color:var(--Primary-600, #344054);font-size:16px;font-weight:600;line-height:24px}.col-md-4{width:31%!important}.user-list{color:var(--Gray-700, #344054);font-size:16px;line-height:24px}.rotate{rotate:180deg;transition:1s}.nav-line-tabs .activated{border-bottom:3px solid var(--bs-primary)!important;transition:color .2s ease!important}.nav-line-tabs .activated a{color:var(--Primary-700, #009BF3)!important}.nav-line-tabs .activated :hover,.nav-item,.nav-item .nav-link:hover{border:0px!important}.nav-line-tabs :hover{border-bottom:3px solid var(--bs-primary)!important;transition:color .2s ease!important}\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$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i3.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.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.PaginationComponent, selector: "lib-pagination", inputs: ["collection", "itemsPerPage", "currentPage", "totalItems", "directionLinks", "pageSize", "paginationSizes"], outputs: ["pageChange", "pageSizeChange"] }, { kind: "component", type: i4.FiltersComponent, selector: "lib-filters", inputs: ["dataObject"], outputs: ["appliedFilters"] }, { kind: "pipe", type: i6.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.TitleCasePipe, name: "titlecase" }] });
|
|
2640
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: UserTableComponent, deps: [{ token: i1$1.NgbModal }, { token: i2.PageInfoService }, { token: i0.ChangeDetectorRef }, { token: ExcelService }, { token: i2.GlobalStateService }, { token: i4.ToastService }, { token: UserService }], target: i0.ɵɵFactoryTarget.Component });
|
|
2641
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: UserTableComponent, selector: "lib-user-table", ngImport: i0, template: "<div *ngIf=\"receivedData ===''\" class=\"card\">\r\n <div class=\"card-header border-0 pt-3\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <div class=\"d-flex overflow-auto h-50px\">\r\n <ul\r\n class=\"nav nav-stretch w-100 nav-line-tabs nav-line-tabs-2x border-bottom-2 fs-5 fw-bolder flex-nowrap\">\r\n <li class=\"nav-item activated cursor-pointer bg-light-primary px-5 text-center me-5\"><a\r\n class=\"nav-link me-0 text-active-primary\">Users</a>\r\n </li>\r\n <li *ngIf=\"(gs.userAccess | async)?.userType === 'tango' && userRole === 'superadmin'\"\r\n class=\"nav-item cursor-pointer me-5\"><a routerLink=\"/manage/users/tango/audit\"\r\n class=\"nav-link text-active-primary\">Audit Users\r\n Summary</a>\r\n </li>\r\n </ul>\r\n </div>\r\n <span class=\"text-sub mb-2 mt-5\">{{pagination?.totalCount}} total users</span>\r\n </h3>\r\n <div class=\"card-toolbar\">\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\"></rect>\r\n <path\r\n d=\"M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z\"\r\n fill=\"currentColor\"></path>\r\n </svg>\r\n </span>\r\n <input type=\"text\" (change)=\"searchData()\" [(ngModel)]=\"searchValue\" class=\"form-control ps-14 me-2\"\r\n name=\"search\" autocomplete=\"off\" placeholder=\"Search\" autocomplete=\"off\" />\r\n <lib-filters [dataObject]=\"dataObject\" (appliedFilters)=\"applyFilters($event)\"></lib-filters>\r\n @if (!loading && !noData) {\r\n <!-- @if ((gs.userAccess |async)?.Global_User_isEdit) { -->\r\n <button type=\"button\" (click)=\"exportXLSX()\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default px-4 py-3 rounded-3 text-nowrap border-val\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M8.125 13.125H16.3562L14.7438 14.7438L15.625 15.625L18.75 12.5L15.625 9.375L14.7438 10.2562L16.3562 11.875H8.125V13.125Z\"\r\n fill=\"black\" />\r\n <path\r\n d=\"M13.75 8.75V6.25C13.7505 6.16774 13.7347 6.0862 13.7036 6.01005C13.6725 5.93391 13.6267 5.86465 13.5688 5.80625L9.19375 1.43125C9.13535 1.37332 9.06609 1.32749 8.98994 1.29639C8.91379 1.26529 8.83225 1.24952 8.75 1.25H2.5C2.16848 1.25 1.85054 1.38169 1.61612 1.61611C1.3817 1.85053 1.25 2.16847 1.25 2.5V17.5C1.25 17.8315 1.3817 18.1495 1.61612 18.3839C1.85054 18.6183 2.16848 18.75 2.5 18.75H12.5C12.8315 18.75 13.1495 18.6183 13.3839 18.3839C13.6183 18.1495 13.75 17.8315 13.75 17.5V16.25H12.5V17.5H2.5V2.5H7.5V6.25C7.5 6.58152 7.6317 6.89946 7.86612 7.13388C8.10054 7.3683 8.41848 7.5 8.75 7.5H12.5V8.75H13.75ZM8.75 6.25V2.75625L12.2438 6.25H8.75Z\"\r\n fill=\"black\" />\r\n </svg><span class=\"ms-2\">Export</span> </button>\r\n <!-- } -->\r\n }\r\n @if ((gs.userAccess | async)?.Global_User_isAdd) {\r\n <button type=\"button\" (click)=\"users('add')\" class=\"btn btn-primary mx-2 rounded-3 text-nowrap\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M10.0001 4.16663V15.8333M4.16675 9.99996H15.8334\" stroke=\"white\"\r\n stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2 text-white\">Add User</span> </button>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"card-body p-0\">\r\n <div class=\"table-responsive\">\r\n <table class=\"table bottom-border text-nowrap \">\r\n <thead>\r\n <tr>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('userName')\">Name\r\n <svg [ngClass]=\"userList_req?.sortColumName === 'userName' && userList_req?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"userList_req?.sortColumName === 'userName' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('email')\">Email\r\n <svg [ngClass]=\"userList_req?.sortColumName === 'email' && userList_req?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"userList_req?.sortColumName === 'email' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('role')\">Roles\r\n <svg [ngClass]=\"userList_req?.sortColumName === 'role' && userList_req?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"userList_req?.sortColumName === 'role' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('assigned')\">Clients Assigned\r\n <svg [ngClass]=\"userList_req?.sortColumName === 'assigned' && userList_req?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"userList_req?.sortColumName === 'assigned' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('mobileNumber')\">Contact Number\r\n <svg [ngClass]=\"userList_req?.sortColumName === 'mobileNumber' && userList_req?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"userList_req?.sortColumName === 'mobileNumber' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th>Actions</th>\r\n </tr>\r\n </thead>\r\n <tbody class=\"fw-semibold\">\r\n <ng-container *ngFor=\"let user of userList;let i=index;\">\r\n <tr>\r\n <td>{{user?.userName}}</td>\r\n <td>{{user?.email}}</td>\r\n <td *ngIf=\"user?.role ==='superadmin'\">Super Admin</td>\r\n <td *ngIf=\"user?.role !=='superadmin'\">{{user?.role | titlecase}}</td>\r\n <td>{{user?.assigned || 0}}</td>\r\n <td>{{user?.mobileNumber}}</td>\r\n <td>\r\n <div class=\"d-flex\">\r\n <span class=\"cursor-pointer\" (click)=\"Viewusers('view',user)\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\"\r\n viewBox=\"0 0 21 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_1995_16400)\">\r\n <path\r\n d=\"M1.33325 10C1.33325 10 4.66658 3.33337 10.4999 3.33337C16.3333 3.33337 19.6666 10 19.6666 10C19.6666 10 16.3333 16.6667 10.4999 16.6667C4.66658 16.6667 1.33325 10 1.33325 10Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10.4999 12.5C11.8806 12.5 12.9999 11.3808 12.9999 10C12.9999 8.61933 11.8806 7.50004 10.4999 7.50004C9.11921 7.50004 7.99992 8.61933 7.99992 10C7.99992 11.3808 9.11921 12.5 10.4999 12.5Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_1995_16400\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\"\r\n transform=\"translate(0.5)\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n <span class=\"form-check form-switch mx-6\">\r\n <input class=\"form-check-input mt-3 cursor-pointer\" type=\"checkbox\"\r\n [disabled]=\"!((gs.userAccess | async)?.Global_User_isEdit)\"\r\n (change)=\"userStatusChange(user,i)\" [(ngModel)]=\"userList[i].isActive\"\r\n role=\"switch\" checked=\"\">\r\n @if (userList[i].isActive) {\r\n Active\r\n } @else {\r\n Deactive\r\n }\r\n </span>\r\n </div>\r\n </td>\r\n </tr>\r\n </ng-container>\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12 my-3\">\r\n <lib-pagination *ngIf=\"userList.length!==0\" [itemsPerPage]=\"pagination.limit\" [currentPage]=\"pagination.offset\"\r\n [totalItems]=\"pagination.totalCount\" [paginationSizes]=\"paginationSizes\" [pageSize]=\"paginationSize()\"\r\n (pageChange)=\"onPageChange($event)\" (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n <div *ngIf=\"loading\" class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"noData\" class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-nodata\" src=\"./assets/tango/Icons/Nodata1.svg\" alt=\"\">\r\n <div class=\"nodata-title\">No data found</div>\r\n <div class=\"nodata-sub\">There is no result for this Date</div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n\r\n\r\n<!-- <div *ngIf=\"receivedData ===''\" class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12 my-3\">\r\n <div class=\"card p-5\">\r\n <div class=\"border-0\">\r\n <h3 class=\"title fw-bold\">Roles & Permission</h3>\r\n <h6 class=\"sub-title fw-normal\">{{rolesCount || 0}} total roles</h6>\r\n </div>\r\n <div class=\"card-body px-0\">\r\n <div class=\"flex-column align-items-start\">\r\n <div class=\"row\">\r\n <div class=\"col-md-4 border-val mx-3 mb-7 py-7\" *ngFor=\"let obj of roles\">\r\n <a *ngIf=\"obj.roleName ==='superadmin'\" class=\"role-title my-2 cursor-pointer\" >Super Admin</a>\r\n <a *ngIf=\"obj.roleName !=='superadmin'\" class=\"role-title my-2 cursor-pointer\" >{{obj.roleName |\r\n titlecase}}</a>\r\n <div *ngIf=\"obj.roleName ==='superadmin'\" class=\"sub-title fw-semibold my-5\">Oversees all the operations and controls the entire functionality of the dashboard</div>\r\n <div *ngIf=\"obj.roleName ==='admin'\" class=\"sub-title fw-semibold my-5\">Manages specific operations, permissions, and can change setting for assigned locations</div>\r\n <div *ngIf=\"obj.roleName ==='user'\" class=\"sub-title fw-semibold my-5\">Access to specific location and will be able to view dashboard</div>\r\n <div><span class=\"me-5\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"25\" height=\"24\"\r\n viewBox=\"0 0 25 24\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_1973_14308)\">\r\n <path\r\n d=\"M17.5 21V19C17.5 17.9391 17.0786 16.9217 16.3284 16.1716C15.5783 15.4214 14.5609 15 13.5 15H5.5C4.43913 15 3.42172 15.4214 2.67157 16.1716C1.92143 16.9217 1.5 17.9391 1.5 19V21M23.5 21V19C23.4993 18.1137 23.2044 17.2528 22.6614 16.5523C22.1184 15.8519 21.3581 15.3516 20.5 15.13M16.5 3.13C17.3604 3.3503 18.123 3.8507 18.6676 4.55231C19.2122 5.25392 19.5078 6.11683 19.5078 7.005C19.5078 7.89317 19.2122 8.75608 18.6676 9.45769C18.123 10.1593 17.3604 10.6597 16.5 10.88M13.5 7C13.5 9.20914 11.7091 11 9.5 11C7.29086 11 5.5 9.20914 5.5 7C5.5 4.79086 7.29086 3 9.5 3C11.7091 3 13.5 4.79086 13.5 7Z\"\r\n stroke=\"#667085\" stroke-width=\"2\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_1973_14308\">\r\n <rect width=\"24\" height=\"24\" fill=\"white\" transform=\"translate(0.5)\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n <span class=\"uses-list fw-semibold\">{{obj?.count || 0}} Members</span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div> -->\r\n\r\n<!--begin::Row-->\r\n<!-- <div *ngIf=\"receivedData ==='Role Value'\" class=\"row gx-5 gx-xl-10\"> -->\r\n<!--begin::Col-->\r\n<!-- <div class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12\"> -->\r\n<!-- <lib-roles-permission-table (dataEvent)=\"receiveData($event)\"></lib-roles-permission-table> -->\r\n<!-- </div> -->\r\n<!--end::Col-->\r\n<!-- </div> -->\r\n<!--end::Row-->", styles: [".border-val{color:var(--Gray-700, #344054)!important;font-family:Inter;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}.table-title-primary{color:var(--Primary-700, #009BF3)!important;font-weight:500!important}.table-sub{line-height:30px!important;color:var(--Gray-500, #667085)!important}td{padding:16px 24px!important;line-height:36px!important}.img-src{width:25%;height:20%}.border-val{padding:16px;border-radius:12px;border:1px solid var(--Gray-200, #EAECF0);background:#fff;box-shadow:0 0 20px #4c577d05}.role-title{color:var(--Primary-600, #344054);font-size:16px;font-weight:600;line-height:24px}.col-md-4{width:31%!important}.user-list{color:var(--Gray-700, #344054);font-size:16px;line-height:24px}.rotate{rotate:180deg;transition:1s}.nav-line-tabs .activated{border-bottom:3px solid var(--bs-primary)!important;transition:color .2s ease!important}.nav-line-tabs .activated a{color:var(--Primary-700, #009BF3)!important}.nav-line-tabs .activated :hover,.nav-item,.nav-item .nav-link:hover{border:0px!important}.nav-line-tabs :hover{border-bottom:3px solid var(--bs-primary)!important;transition:color .2s ease!important}\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$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i3.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.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.PaginationComponent, selector: "lib-pagination", inputs: ["collection", "itemsPerPage", "currentPage", "totalItems", "directionLinks", "pageSize", "paginationSizes"], outputs: ["pageChange", "pageSizeChange"] }, { kind: "component", type: i4.FiltersComponent, selector: "lib-filters", inputs: ["dataObject"], outputs: ["appliedFilters"] }, { kind: "pipe", type: i6.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.TitleCasePipe, name: "titlecase" }] });
|
|
2243
2642
|
}
|
|
2244
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
2643
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: UserTableComponent, decorators: [{
|
|
2245
2644
|
type: Component,
|
|
2246
2645
|
args: [{ selector: "lib-user-table", template: "<div *ngIf=\"receivedData ===''\" class=\"card\">\r\n <div class=\"card-header border-0 pt-3\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <div class=\"d-flex overflow-auto h-50px\">\r\n <ul\r\n class=\"nav nav-stretch w-100 nav-line-tabs nav-line-tabs-2x border-bottom-2 fs-5 fw-bolder flex-nowrap\">\r\n <li class=\"nav-item activated cursor-pointer bg-light-primary px-5 text-center me-5\"><a\r\n class=\"nav-link me-0 text-active-primary\">Users</a>\r\n </li>\r\n <li *ngIf=\"(gs.userAccess | async)?.userType === 'tango' && userRole === 'superadmin'\"\r\n class=\"nav-item cursor-pointer me-5\"><a routerLink=\"/manage/users/tango/audit\"\r\n class=\"nav-link text-active-primary\">Audit Users\r\n Summary</a>\r\n </li>\r\n </ul>\r\n </div>\r\n <span class=\"text-sub mb-2 mt-5\">{{pagination?.totalCount}} total users</span>\r\n </h3>\r\n <div class=\"card-toolbar\">\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\"></rect>\r\n <path\r\n d=\"M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z\"\r\n fill=\"currentColor\"></path>\r\n </svg>\r\n </span>\r\n <input type=\"text\" (change)=\"searchData()\" [(ngModel)]=\"searchValue\" class=\"form-control ps-14 me-2\"\r\n name=\"search\" autocomplete=\"off\" placeholder=\"Search\" autocomplete=\"off\" />\r\n <lib-filters [dataObject]=\"dataObject\" (appliedFilters)=\"applyFilters($event)\"></lib-filters>\r\n @if (!loading && !noData) {\r\n <!-- @if ((gs.userAccess |async)?.Global_User_isEdit) { -->\r\n <button type=\"button\" (click)=\"exportXLSX()\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default px-4 py-3 rounded-3 text-nowrap border-val\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M8.125 13.125H16.3562L14.7438 14.7438L15.625 15.625L18.75 12.5L15.625 9.375L14.7438 10.2562L16.3562 11.875H8.125V13.125Z\"\r\n fill=\"black\" />\r\n <path\r\n d=\"M13.75 8.75V6.25C13.7505 6.16774 13.7347 6.0862 13.7036 6.01005C13.6725 5.93391 13.6267 5.86465 13.5688 5.80625L9.19375 1.43125C9.13535 1.37332 9.06609 1.32749 8.98994 1.29639C8.91379 1.26529 8.83225 1.24952 8.75 1.25H2.5C2.16848 1.25 1.85054 1.38169 1.61612 1.61611C1.3817 1.85053 1.25 2.16847 1.25 2.5V17.5C1.25 17.8315 1.3817 18.1495 1.61612 18.3839C1.85054 18.6183 2.16848 18.75 2.5 18.75H12.5C12.8315 18.75 13.1495 18.6183 13.3839 18.3839C13.6183 18.1495 13.75 17.8315 13.75 17.5V16.25H12.5V17.5H2.5V2.5H7.5V6.25C7.5 6.58152 7.6317 6.89946 7.86612 7.13388C8.10054 7.3683 8.41848 7.5 8.75 7.5H12.5V8.75H13.75ZM8.75 6.25V2.75625L12.2438 6.25H8.75Z\"\r\n fill=\"black\" />\r\n </svg><span class=\"ms-2\">Export</span> </button>\r\n <!-- } -->\r\n }\r\n @if ((gs.userAccess | async)?.Global_User_isAdd) {\r\n <button type=\"button\" (click)=\"users('add')\" class=\"btn btn-primary mx-2 rounded-3 text-nowrap\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M10.0001 4.16663V15.8333M4.16675 9.99996H15.8334\" stroke=\"white\"\r\n stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2 text-white\">Add User</span> </button>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"card-body p-0\">\r\n <div class=\"table-responsive\">\r\n <table class=\"table bottom-border text-nowrap \">\r\n <thead>\r\n <tr>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('userName')\">Name\r\n <svg [ngClass]=\"userList_req?.sortColumName === 'userName' && userList_req?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"userList_req?.sortColumName === 'userName' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('email')\">Email\r\n <svg [ngClass]=\"userList_req?.sortColumName === 'email' && userList_req?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"userList_req?.sortColumName === 'email' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('role')\">Roles\r\n <svg [ngClass]=\"userList_req?.sortColumName === 'role' && userList_req?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"userList_req?.sortColumName === 'role' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('assigned')\">Clients Assigned\r\n <svg [ngClass]=\"userList_req?.sortColumName === 'assigned' && userList_req?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"userList_req?.sortColumName === 'assigned' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('mobileNumber')\">Contact Number\r\n <svg [ngClass]=\"userList_req?.sortColumName === 'mobileNumber' && userList_req?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"userList_req?.sortColumName === 'mobileNumber' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th>Actions</th>\r\n </tr>\r\n </thead>\r\n <tbody class=\"fw-semibold\">\r\n <ng-container *ngFor=\"let user of userList;let i=index;\">\r\n <tr>\r\n <td>{{user?.userName}}</td>\r\n <td>{{user?.email}}</td>\r\n <td *ngIf=\"user?.role ==='superadmin'\">Super Admin</td>\r\n <td *ngIf=\"user?.role !=='superadmin'\">{{user?.role | titlecase}}</td>\r\n <td>{{user?.assigned || 0}}</td>\r\n <td>{{user?.mobileNumber}}</td>\r\n <td>\r\n <div class=\"d-flex\">\r\n <span class=\"cursor-pointer\" (click)=\"Viewusers('view',user)\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\"\r\n viewBox=\"0 0 21 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_1995_16400)\">\r\n <path\r\n d=\"M1.33325 10C1.33325 10 4.66658 3.33337 10.4999 3.33337C16.3333 3.33337 19.6666 10 19.6666 10C19.6666 10 16.3333 16.6667 10.4999 16.6667C4.66658 16.6667 1.33325 10 1.33325 10Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10.4999 12.5C11.8806 12.5 12.9999 11.3808 12.9999 10C12.9999 8.61933 11.8806 7.50004 10.4999 7.50004C9.11921 7.50004 7.99992 8.61933 7.99992 10C7.99992 11.3808 9.11921 12.5 10.4999 12.5Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_1995_16400\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\"\r\n transform=\"translate(0.5)\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n <span class=\"form-check form-switch mx-6\">\r\n <input class=\"form-check-input mt-3 cursor-pointer\" type=\"checkbox\"\r\n [disabled]=\"!((gs.userAccess | async)?.Global_User_isEdit)\"\r\n (change)=\"userStatusChange(user,i)\" [(ngModel)]=\"userList[i].isActive\"\r\n role=\"switch\" checked=\"\">\r\n @if (userList[i].isActive) {\r\n Active\r\n } @else {\r\n Deactive\r\n }\r\n </span>\r\n </div>\r\n </td>\r\n </tr>\r\n </ng-container>\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12 my-3\">\r\n <lib-pagination *ngIf=\"userList.length!==0\" [itemsPerPage]=\"pagination.limit\" [currentPage]=\"pagination.offset\"\r\n [totalItems]=\"pagination.totalCount\" [paginationSizes]=\"paginationSizes\" [pageSize]=\"paginationSize()\"\r\n (pageChange)=\"onPageChange($event)\" (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n <div *ngIf=\"loading\" class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"noData\" class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-nodata\" src=\"./assets/tango/Icons/Nodata1.svg\" alt=\"\">\r\n <div class=\"nodata-title\">No data found</div>\r\n <div class=\"nodata-sub\">There is no result for this Date</div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n\r\n\r\n<!-- <div *ngIf=\"receivedData ===''\" class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12 my-3\">\r\n <div class=\"card p-5\">\r\n <div class=\"border-0\">\r\n <h3 class=\"title fw-bold\">Roles & Permission</h3>\r\n <h6 class=\"sub-title fw-normal\">{{rolesCount || 0}} total roles</h6>\r\n </div>\r\n <div class=\"card-body px-0\">\r\n <div class=\"flex-column align-items-start\">\r\n <div class=\"row\">\r\n <div class=\"col-md-4 border-val mx-3 mb-7 py-7\" *ngFor=\"let obj of roles\">\r\n <a *ngIf=\"obj.roleName ==='superadmin'\" class=\"role-title my-2 cursor-pointer\" >Super Admin</a>\r\n <a *ngIf=\"obj.roleName !=='superadmin'\" class=\"role-title my-2 cursor-pointer\" >{{obj.roleName |\r\n titlecase}}</a>\r\n <div *ngIf=\"obj.roleName ==='superadmin'\" class=\"sub-title fw-semibold my-5\">Oversees all the operations and controls the entire functionality of the dashboard</div>\r\n <div *ngIf=\"obj.roleName ==='admin'\" class=\"sub-title fw-semibold my-5\">Manages specific operations, permissions, and can change setting for assigned locations</div>\r\n <div *ngIf=\"obj.roleName ==='user'\" class=\"sub-title fw-semibold my-5\">Access to specific location and will be able to view dashboard</div>\r\n <div><span class=\"me-5\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"25\" height=\"24\"\r\n viewBox=\"0 0 25 24\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_1973_14308)\">\r\n <path\r\n d=\"M17.5 21V19C17.5 17.9391 17.0786 16.9217 16.3284 16.1716C15.5783 15.4214 14.5609 15 13.5 15H5.5C4.43913 15 3.42172 15.4214 2.67157 16.1716C1.92143 16.9217 1.5 17.9391 1.5 19V21M23.5 21V19C23.4993 18.1137 23.2044 17.2528 22.6614 16.5523C22.1184 15.8519 21.3581 15.3516 20.5 15.13M16.5 3.13C17.3604 3.3503 18.123 3.8507 18.6676 4.55231C19.2122 5.25392 19.5078 6.11683 19.5078 7.005C19.5078 7.89317 19.2122 8.75608 18.6676 9.45769C18.123 10.1593 17.3604 10.6597 16.5 10.88M13.5 7C13.5 9.20914 11.7091 11 9.5 11C7.29086 11 5.5 9.20914 5.5 7C5.5 4.79086 7.29086 3 9.5 3C11.7091 3 13.5 4.79086 13.5 7Z\"\r\n stroke=\"#667085\" stroke-width=\"2\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_1973_14308\">\r\n <rect width=\"24\" height=\"24\" fill=\"white\" transform=\"translate(0.5)\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n <span class=\"uses-list fw-semibold\">{{obj?.count || 0}} Members</span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div> -->\r\n\r\n<!--begin::Row-->\r\n<!-- <div *ngIf=\"receivedData ==='Role Value'\" class=\"row gx-5 gx-xl-10\"> -->\r\n<!--begin::Col-->\r\n<!-- <div class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12\"> -->\r\n<!-- <lib-roles-permission-table (dataEvent)=\"receiveData($event)\"></lib-roles-permission-table> -->\r\n<!-- </div> -->\r\n<!--end::Col-->\r\n<!-- </div> -->\r\n<!--end::Row-->", styles: [".border-val{color:var(--Gray-700, #344054)!important;font-family:Inter;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}.table-title-primary{color:var(--Primary-700, #009BF3)!important;font-weight:500!important}.table-sub{line-height:30px!important;color:var(--Gray-500, #667085)!important}td{padding:16px 24px!important;line-height:36px!important}.img-src{width:25%;height:20%}.border-val{padding:16px;border-radius:12px;border:1px solid var(--Gray-200, #EAECF0);background:#fff;box-shadow:0 0 20px #4c577d05}.role-title{color:var(--Primary-600, #344054);font-size:16px;font-weight:600;line-height:24px}.col-md-4{width:31%!important}.user-list{color:var(--Gray-700, #344054);font-size:16px;line-height:24px}.rotate{rotate:180deg;transition:1s}.nav-line-tabs .activated{border-bottom:3px solid var(--bs-primary)!important;transition:color .2s ease!important}.nav-line-tabs .activated a{color:var(--Primary-700, #009BF3)!important}.nav-line-tabs .activated :hover,.nav-item,.nav-item .nav-link:hover{border:0px!important}.nav-line-tabs :hover{border-bottom:3px solid var(--bs-primary)!important;transition:color .2s ease!important}\n"] }]
|
|
2247
2646
|
}], ctorParameters: () => [{ type: i1$1.NgbModal }, { type: i2.PageInfoService }, { type: i0.ChangeDetectorRef }, { type: ExcelService }, { type: i2.GlobalStateService }, { type: i4.ToastService }, { type: UserService }] });
|
|
@@ -2487,12 +2886,19 @@ class TeamsCreationComponent {
|
|
|
2487
2886
|
};
|
|
2488
2887
|
}
|
|
2489
2888
|
}
|
|
2490
|
-
|
|
2491
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: TeamsCreationComponent, selector: "lib-teams-creation", inputs: { teamData: "teamData", type: "type", teamsUsers: "teamsUsers" }, viewQueries: [{ propertyName: "inputFile", first: true, predicate: ["inputFile"], descendants: true }], 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\">\r\n <div class=\"symbol symbol-75px symbol-circle\">\r\n <svg width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M20.5 23.6816C18.8425 23.6816 17.5 22.2133 17.5 20.4004C17.5 18.5875 18.8425 17.1191 20.5 17.1191C22.1575 17.1191 23.5 18.5875 23.5 20.4004C23.5 22.2133 22.1575 23.6816 20.5 23.6816ZM35.6483 23.6816C33.9908 23.6816 32.6483 22.2133 32.6483 20.4004C32.6483 18.5875 33.9908 17.1191 35.6483 17.1191C37.3058 17.1191 38.6483 18.5875 38.6483 20.4004C38.6483 22.2133 37.3058 23.6816 35.6483 23.6816ZM31.509 26.3066C31.509 28.4805 29.8965 30.2441 27.909 30.2441C25.9215 30.2441 24.309 28.4805 24.309 26.3066C24.309 24.1328 25.9215 22.3691 27.909 22.3691C29.8965 22.3691 31.509 24.1328 31.509 26.3066Z\"\r\n fill=\"#00A3FF\" />\r\n <path\r\n d=\"M20.0013 25.7559C17.7925 25.7559 16 27.7164 16 30.1322C16 30.6121 16.36 31.0059 16.7988 31.0059H24.8013H24.8275C23.8338 30.042 23.2038 28.6352 23.2038 27.0684C23.2038 26.7566 23.2263 26.449 23.275 26.1537C22.765 25.8994 22.1988 25.7559 21.6025 25.7559H20.0013Z\"\r\n fill=\"#00A3FF\" />\r\n <path\r\n d=\"M31.1725 31.0059H31.1987H39.2012C39.64 31.0059 40 30.6162 40 30.1322C40 27.7164 38.2075 25.7559 35.9987 25.7559H34.3975C33.8012 25.7559 33.235 25.8953 32.725 26.1537C32.77 26.4531 32.7963 26.7566 32.7963 27.0684C32.7963 28.6352 32.17 30.042 31.1725 31.0059Z\"\r\n fill=\"#00A3FF\" />\r\n <path\r\n d=\"M25.7988 32.3183C23.0388 32.3183 20.8 34.767 20.8 37.7857C20.8 38.3928 21.25 38.8809 21.8013 38.8809H34.1987C34.7537 38.8809 35.2 38.3887 35.2 37.7857C35.2 34.767 32.9613 32.3183 30.2013 32.3183H25.7988Z\"\r\n fill=\"#00A3FF\" />\r\n </svg>\r\n </div>\r\n </div>\r\n <div class=\"row w-100\">\r\n <div class=\"col-md-12\" *ngIf=\"type === 'create'\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Create Team</a>\r\n <div class=\"sub-title\">Group multiple users to create a team for easier management</div>\r\n </div>\r\n <div class=\"col-md-12\" *ngIf=\"type === 'edit'\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Edit Team</a>\r\n <div class=\"sub-title\">Group multiple users to edit a team for easier management</div>\r\n </div>\r\n\r\n\r\n <div class=\"w-100 h-500px scroll\">\r\n <div class=\"mt-5\">\r\n <form>\r\n <div class=\"row px-0 me-3\">\r\n <div class=\"col-md-12 col-lg-12 col-xl-12 col-xxl-12 mb-7\">\r\n <label for=\"teamName\" class=\"form-label\">Team Name<span class=\"mandtryclr ms-1\">*</span></label>\r\n <input type=\"text\" [(ngModel)]=\"teamName\" [ngModelOptions]=\"{standalone: true}\"\r\n class=\"form-control\" id=\"teamName\" autocomplete=\"off\">\r\n </div>\r\n <div class=\"col-md-12 col-lg-12 col-xl-12 col-xxl-12 mb-5\">\r\n <label for=\"teamlead\" class=\"form-label\">Team Lead <span class=\"mandtryclr ms-1\">*</span></label>\r\n <team-select [items]=\"teamleadList\" [multi]=\"true\" [searchField]=\"'userName'\"\r\n [idField]=\"'userId'\" (selected)=\"onTeamSelect($event)\" (deselected)=\"TeamUnselect($event)\" (deselectedAll)=\"TeamUnselectAll($event)\"\r\n [selectedValues]=\"selectedTeam\"></team-select>\r\n </div>\r\n <div class=\"col-md-12 col-lg-12 col-xl-12 col-xxl-12 mb-5\">\r\n <label for=\"userlead\" class=\"form-label\">Select Users<span class=\"mandtryclr ms-1\">*</span>\r\n </label>\r\n <team-select [items]=\"userList\" [multi]=\"true\" [searchField]=\"'userName'\"\r\n [idField]=\"'userId'\" (selected)=\"onUserSelect($event)\" (deselected)=\"UserUnselect($event)\" (deselectedAll)=\"UserUnselectAll($event)\"\r\n [selectedValues]=\"selectedUsers\"></team-select>\r\n </div>\r\n <div class=\"col-md-12 col-lg-12 col-xl-12 col-xxl-12 mb-5\">\r\n <label for=\"userlead\" class=\"form-label\">Description (optional)</label>\r\n <textarea id=\"description\" [(ngModel)]=\"description\"\r\n [ngModelOptions]=\"{standalone: true}\" name=\"description\" class=\"form-control\"\r\n rows=\"5\" cols=\"50\" placeholder=\"Enter a description...\"></textarea>\r\n </div>\r\n\r\n\r\n <p class=\"text-gray-400 fw-bold my-3\">\r\n <span class=\"line-bg \"><svg width=\"280\" height=\"2\" viewBox=\"0 0 280 2\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect y=\"0.5\" width=\"280\" height=\"1\" fill=\"#EAECF0\" />\r\n </svg>\r\n </span><span class=\"mx-15 or-color\">Or </span> <span class=\"line-bg \"><svg width=\"280\"\r\n height=\"2\" viewBox=\"0 0 280 2\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect y=\"0.5\" width=\"280\" height=\"1\" fill=\"#EAECF0\" />\r\n </svg>\r\n </span>\r\n </p>\r\n <div class=\"d-flex justify-content-center align-items-center\">\r\n <div class=\"fw-bold text-gray-500 my-6\">\r\n <ol class=\"custom-ordered-list text-gray-400 fw-bold fs-6\">\r\n <li class=\"user-text\">Use the template to upload multiple users at once.</li>\r\n <li class=\"user-text my-3\"><span class=\"user-text\">Download the template here -\r\n </span>\r\n <a class=\"ms-1\" href=\"../../../assets/files/teamsUploadTemplate.xlsx\"\r\n download>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"\r\n 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\"\r\n 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 class=\"user-text my-3\">Add your data to the Template File</li>\r\n\r\n </ol>\r\n </div>\r\n </div>\r\n <div\r\n class=\"mt-3 ms-3 right-bar py-10 d-flex justify-content-center align-items-center flex-column\">\r\n <input name=\"accountType\" type=\"radio\" id=\"kt_create_account_form_account_type_personal\"\r\n value=\"personal\" class=\"btn-check\" ng-reflect-name=\"accountType\"\r\n ng-reflect-form-control-name=\"accountType\" (change)=\"onUpload($event)\"\r\n ng-reflect-value=\"personal\" type=\"file\" #inputFile />\r\n <label for=\"kt_create_account_form_account_type_personal\" class=\" w-50 p-4 mt-5\"><span\r\n class=\"fw-bold text-center w-100 fs-4\">\r\n<div class=\"d-flex justify-content-center align-items-center w-100\">\r\n <svg width=\"46\" height=\"46\" viewBox=\"0 0 46 46\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"3\" y=\"3\" width=\"40\" height=\"40\" rx=\"20\" fill=\"#F2F4F7\" />\r\n <rect x=\"3\" y=\"3\" width=\"40\" height=\"40\" rx=\"20\" stroke=\"#F9FAFB\"\r\n stroke-width=\"6\" />\r\n <g clip-path=\"url(#clip0_4047_40566)\">\r\n <path\r\n d=\"M26.3333 26.3334L23 23M23 23L19.6666 26.3334M23 23V30.5M29.9916 28.325C30.8044 27.8819 31.4465 27.1808 31.8165 26.3322C32.1866 25.4837 32.2635 24.5361 32.0351 23.6389C31.8068 22.7418 31.2862 21.9463 30.5555 21.3779C29.8248 20.8095 28.9257 20.5006 28 20.5H26.95C26.6977 19.5244 26.2276 18.6186 25.5749 17.8509C24.9222 17.0831 24.104 16.4732 23.1817 16.0672C22.2594 15.6612 21.2571 15.4695 20.2501 15.5066C19.243 15.5437 18.2575 15.8086 17.3676 16.2814C16.4777 16.7542 15.7066 17.4226 15.1122 18.2363C14.5177 19.0501 14.1155 19.988 13.9358 20.9795C13.756 21.9711 13.8034 22.9905 14.0743 23.9611C14.3452 24.9317 14.8327 25.8282 15.5 26.5834\"\r\n stroke=\"#475467\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_4047_40566\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\"\r\n transform=\"translate(13 13)\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </div>\r\n <div class=\"nodata-title\"><span class=\"click-upload cursor-pointer\">Click to\r\n upload</span>\r\n <!-- <span class=\"ms-2\">or drag and drop</span> -->\r\n </div>\r\n <div class=\"nodata-sub\">the data added template file for processing.</div>\r\n </span>\r\n </label>\r\n </div>\r\n <!-- <div class=\"mt-3 ms-3 right-bar py-10 d-flex justify-content-center align-items-center flex-column\" >\r\n <svg width=\"47\" height=\"46\" viewBox=\"0 0 47 46\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"3.5\" y=\"3\" width=\"40\" height=\"40\" rx=\"20\" fill=\"#F2F4F7\"/>\r\n <rect x=\"3.5\" y=\"3\" width=\"40\" height=\"40\" rx=\"20\" stroke=\"#F9FAFB\" stroke-width=\"6\"/>\r\n <g clip-path=\"url(#clip0_2176_18901)\">\r\n <path d=\"M26.8333 26.3332L23.5 22.9999M23.5 22.9999L20.1666 26.3332M23.5 22.9999V30.4999M30.4916 28.3249C31.3044 27.8818 31.9465 27.1806 32.3165 26.3321C32.6866 25.4835 32.7635 24.5359 32.5351 23.6388C32.3068 22.7417 31.7862 21.9462 31.0555 21.3778C30.3248 20.8094 29.4257 20.5005 28.5 20.4999H27.45C27.1977 19.5243 26.7276 18.6185 26.0749 17.8507C25.4222 17.0829 24.604 16.4731 23.6817 16.0671C22.7594 15.661 21.7571 15.4694 20.7501 15.5065C19.743 15.5436 18.7575 15.8085 17.8676 16.2813C16.9777 16.7541 16.2066 17.4225 15.6122 18.2362C15.0177 19.05 14.6155 19.9879 14.4358 20.9794C14.256 21.9709 14.3034 22.9903 14.5743 23.961C14.8452 24.9316 15.3327 25.8281 16 26.5832\" stroke=\"#475467\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_2176_18901\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" transform=\"translate(13.5 13)\"/>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n <div class=\"nodata-title\"><span class=\"click-upload cursor-pointer\"><input name=\"accountType\" type=\"radio\" id=\"kt_create_account_form_account_type_personal\" value=\"personal\"\r\n class=\"btn-check\" ng-reflect-name=\"accountType\" ng-reflect-form-control-name=\"accountType\"\r\n (change)=\"onUpload($event)\"\r\n ng-reflect-value=\"personal\" type=\"file\" #inputFile />Click to upload</span> <span class=\"ms-2\">or drag and drop</span></div>\r\n <div class=\"nodata-sub\">the data added template file for processing.</div>\r\n </div> -->\r\n </div>\r\n <div 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\" *ngIf=\"!isEdit\"\r\n (click)=\"onCreateTeam()\" [disabled]=\"!selectedUsers.length||!selectedTeam.length|| !teamName\">Create\r\n Team</button>\r\n <button class=\"btn btn-primary w-100 ms-3\" id=\"alert-toast\" *ngIf=\"isEdit\"\r\n (click)=\"onCreateTeam()\" [disabled]=\"!selectedUsers.length ||!selectedTeam.length||!teamName\">Update\r\n Team</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}.or-color{color:var(--Gray-700, #344054)!important;text-align:center;font-size:12px;font-style:normal;font-weight:500;line-height:18px}.custom-ordered-list{list-style-type:decimal}.user-text{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:400!important;line-height:20px}.right-bar{border-radius:12px;border:1px solid var(--Gray-300, #D0D5DD)}.click-upload{color:var(--Primary-700, #009BF3)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-decoration-line:underline;text-transform:capitalize}.mandtryclr{color:red}\n"], dependencies: [{ kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: CustomSelectComponent, selector: "team-select", inputs: ["items", "searchField", "multi", "idField", "selectedValues", "disabled", "label"], outputs: ["selected", "deselected", "deselectedAll"] }] });
|
|
2889
|
+
omitSpecialChar(event) {
|
|
2890
|
+
const key = event.key;
|
|
2891
|
+
const regex = /^[a-zA-Z0-9 _-]$/;
|
|
2892
|
+
if (!regex.test(key)) {
|
|
2893
|
+
event.preventDefault();
|
|
2894
|
+
}
|
|
2895
|
+
}
|
|
2896
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TeamsCreationComponent, deps: [{ token: i4.ToastService }, { token: i2$1.Router }, { token: i1$1.NgbActiveModal }, { token: ManageUsersService }, { token: i2.GlobalStateService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
2897
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: TeamsCreationComponent, selector: "lib-teams-creation", inputs: { teamData: "teamData", type: "type", teamsUsers: "teamsUsers" }, viewQueries: [{ propertyName: "inputFile", first: true, predicate: ["inputFile"], descendants: true }], 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\">\r\n <div class=\"symbol symbol-75px symbol-circle\">\r\n <svg width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M20.5 23.6816C18.8425 23.6816 17.5 22.2133 17.5 20.4004C17.5 18.5875 18.8425 17.1191 20.5 17.1191C22.1575 17.1191 23.5 18.5875 23.5 20.4004C23.5 22.2133 22.1575 23.6816 20.5 23.6816ZM35.6483 23.6816C33.9908 23.6816 32.6483 22.2133 32.6483 20.4004C32.6483 18.5875 33.9908 17.1191 35.6483 17.1191C37.3058 17.1191 38.6483 18.5875 38.6483 20.4004C38.6483 22.2133 37.3058 23.6816 35.6483 23.6816ZM31.509 26.3066C31.509 28.4805 29.8965 30.2441 27.909 30.2441C25.9215 30.2441 24.309 28.4805 24.309 26.3066C24.309 24.1328 25.9215 22.3691 27.909 22.3691C29.8965 22.3691 31.509 24.1328 31.509 26.3066Z\"\r\n fill=\"#00A3FF\" />\r\n <path\r\n d=\"M20.0013 25.7559C17.7925 25.7559 16 27.7164 16 30.1322C16 30.6121 16.36 31.0059 16.7988 31.0059H24.8013H24.8275C23.8338 30.042 23.2038 28.6352 23.2038 27.0684C23.2038 26.7566 23.2263 26.449 23.275 26.1537C22.765 25.8994 22.1988 25.7559 21.6025 25.7559H20.0013Z\"\r\n fill=\"#00A3FF\" />\r\n <path\r\n d=\"M31.1725 31.0059H31.1987H39.2012C39.64 31.0059 40 30.6162 40 30.1322C40 27.7164 38.2075 25.7559 35.9987 25.7559H34.3975C33.8012 25.7559 33.235 25.8953 32.725 26.1537C32.77 26.4531 32.7963 26.7566 32.7963 27.0684C32.7963 28.6352 32.17 30.042 31.1725 31.0059Z\"\r\n fill=\"#00A3FF\" />\r\n <path\r\n d=\"M25.7988 32.3183C23.0388 32.3183 20.8 34.767 20.8 37.7857C20.8 38.3928 21.25 38.8809 21.8013 38.8809H34.1987C34.7537 38.8809 35.2 38.3887 35.2 37.7857C35.2 34.767 32.9613 32.3183 30.2013 32.3183H25.7988Z\"\r\n fill=\"#00A3FF\" />\r\n </svg>\r\n </div>\r\n </div>\r\n <div class=\"row w-100\">\r\n <div class=\"col-md-12\" *ngIf=\"type === 'create'\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Create Team</a>\r\n <div class=\"sub-title\">Group multiple users to create a team for easier management</div>\r\n </div>\r\n <div class=\"col-md-12\" *ngIf=\"type === 'edit'\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Edit Team</a>\r\n <div class=\"sub-title\">Group multiple users to edit a team for easier management</div>\r\n </div>\r\n\r\n\r\n <div class=\"w-100 h-500px scroll\">\r\n <div class=\"mt-5\">\r\n <form>\r\n <div class=\"row px-0 me-3\">\r\n <div class=\"col-md-12 col-lg-12 col-xl-12 col-xxl-12 mb-7\">\r\n <label for=\"teamName\" class=\"form-label\">Team Name<span class=\"mandtryclr ms-1\">*</span></label>\r\n <input type=\"text\" [(ngModel)]=\"teamName\" [ngModelOptions]=\"{standalone: true}\"\r\n class=\"form-control\" id=\"teamName\" autocomplete=\"off\" (keypress)=\"omitSpecialChar($event)\">\r\n </div>\r\n <div class=\"col-md-12 col-lg-12 col-xl-12 col-xxl-12 mb-5\">\r\n <label for=\"teamlead\" class=\"form-label\">Team Lead <span class=\"mandtryclr ms-1\">*</span></label>\r\n <team-select [items]=\"teamleadList\" [multi]=\"true\" [searchField]=\"'userName'\"\r\n [idField]=\"'userId'\" (selected)=\"onTeamSelect($event)\" (deselected)=\"TeamUnselect($event)\" (deselectedAll)=\"TeamUnselectAll($event)\"\r\n [selectedValues]=\"selectedTeam\"></team-select>\r\n </div>\r\n <div class=\"col-md-12 col-lg-12 col-xl-12 col-xxl-12 mb-5\">\r\n <label for=\"userlead\" class=\"form-label\">Select Users<span class=\"mandtryclr ms-1\">*</span>\r\n </label>\r\n <team-select [items]=\"userList\" [multi]=\"true\" [searchField]=\"'userName'\"\r\n [idField]=\"'userId'\" (selected)=\"onUserSelect($event)\" (deselected)=\"UserUnselect($event)\" (deselectedAll)=\"UserUnselectAll($event)\"\r\n [selectedValues]=\"selectedUsers\"></team-select>\r\n </div>\r\n <div class=\"col-md-12 col-lg-12 col-xl-12 col-xxl-12 mb-5\">\r\n <label for=\"userlead\" class=\"form-label\">Description (optional)</label>\r\n <textarea id=\"description\" [(ngModel)]=\"description\"\r\n [ngModelOptions]=\"{standalone: true}\" name=\"description\" class=\"form-control\"\r\n rows=\"5\" cols=\"50\" placeholder=\"Enter a description...\"></textarea>\r\n </div>\r\n\r\n\r\n <p class=\"text-gray-400 fw-bold my-3\">\r\n <span class=\"line-bg \"><svg width=\"280\" height=\"2\" viewBox=\"0 0 280 2\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect y=\"0.5\" width=\"280\" height=\"1\" fill=\"#EAECF0\" />\r\n </svg>\r\n </span><span class=\"mx-15 or-color\">Or </span> <span class=\"line-bg \"><svg width=\"280\"\r\n height=\"2\" viewBox=\"0 0 280 2\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect y=\"0.5\" width=\"280\" height=\"1\" fill=\"#EAECF0\" />\r\n </svg>\r\n </span>\r\n </p>\r\n <div class=\"d-flex justify-content-center align-items-center\">\r\n <div class=\"fw-bold text-gray-500 my-6\">\r\n <ol class=\"custom-ordered-list text-gray-400 fw-bold fs-6\">\r\n <li class=\"user-text\">Use the template to upload multiple users at once.</li>\r\n <li class=\"user-text my-3\"><span class=\"user-text\">Download the template here -\r\n </span>\r\n <a class=\"ms-1\" href=\"../../../assets/files/teamsUploadTemplate.xlsx\"\r\n download>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"\r\n 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\"\r\n 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 class=\"user-text my-3\">Add your data to the Template File</li>\r\n\r\n </ol>\r\n </div>\r\n </div>\r\n <div\r\n class=\"mt-3 ms-3 right-bar py-10 d-flex justify-content-center align-items-center flex-column\">\r\n <input name=\"accountType\" type=\"radio\" id=\"kt_create_account_form_account_type_personal\"\r\n value=\"personal\" class=\"btn-check\" ng-reflect-name=\"accountType\"\r\n ng-reflect-form-control-name=\"accountType\" (change)=\"onUpload($event)\"\r\n ng-reflect-value=\"personal\" type=\"file\" #inputFile />\r\n <label for=\"kt_create_account_form_account_type_personal\" class=\" w-50 p-4 mt-5\"><span\r\n class=\"fw-bold text-center w-100 fs-4\">\r\n<div class=\"d-flex justify-content-center align-items-center w-100\">\r\n <svg width=\"46\" height=\"46\" viewBox=\"0 0 46 46\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"3\" y=\"3\" width=\"40\" height=\"40\" rx=\"20\" fill=\"#F2F4F7\" />\r\n <rect x=\"3\" y=\"3\" width=\"40\" height=\"40\" rx=\"20\" stroke=\"#F9FAFB\"\r\n stroke-width=\"6\" />\r\n <g clip-path=\"url(#clip0_4047_40566)\">\r\n <path\r\n d=\"M26.3333 26.3334L23 23M23 23L19.6666 26.3334M23 23V30.5M29.9916 28.325C30.8044 27.8819 31.4465 27.1808 31.8165 26.3322C32.1866 25.4837 32.2635 24.5361 32.0351 23.6389C31.8068 22.7418 31.2862 21.9463 30.5555 21.3779C29.8248 20.8095 28.9257 20.5006 28 20.5H26.95C26.6977 19.5244 26.2276 18.6186 25.5749 17.8509C24.9222 17.0831 24.104 16.4732 23.1817 16.0672C22.2594 15.6612 21.2571 15.4695 20.2501 15.5066C19.243 15.5437 18.2575 15.8086 17.3676 16.2814C16.4777 16.7542 15.7066 17.4226 15.1122 18.2363C14.5177 19.0501 14.1155 19.988 13.9358 20.9795C13.756 21.9711 13.8034 22.9905 14.0743 23.9611C14.3452 24.9317 14.8327 25.8282 15.5 26.5834\"\r\n stroke=\"#475467\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_4047_40566\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\"\r\n transform=\"translate(13 13)\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </div>\r\n <div class=\"nodata-title\"><span class=\"click-upload cursor-pointer\">Click to\r\n upload</span>\r\n <!-- <span class=\"ms-2\">or drag and drop</span> -->\r\n </div>\r\n <div class=\"nodata-sub\">the data added template file for processing.</div>\r\n </span>\r\n </label>\r\n </div>\r\n <!-- <div class=\"mt-3 ms-3 right-bar py-10 d-flex justify-content-center align-items-center flex-column\" >\r\n <svg width=\"47\" height=\"46\" viewBox=\"0 0 47 46\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"3.5\" y=\"3\" width=\"40\" height=\"40\" rx=\"20\" fill=\"#F2F4F7\"/>\r\n <rect x=\"3.5\" y=\"3\" width=\"40\" height=\"40\" rx=\"20\" stroke=\"#F9FAFB\" stroke-width=\"6\"/>\r\n <g clip-path=\"url(#clip0_2176_18901)\">\r\n <path d=\"M26.8333 26.3332L23.5 22.9999M23.5 22.9999L20.1666 26.3332M23.5 22.9999V30.4999M30.4916 28.3249C31.3044 27.8818 31.9465 27.1806 32.3165 26.3321C32.6866 25.4835 32.7635 24.5359 32.5351 23.6388C32.3068 22.7417 31.7862 21.9462 31.0555 21.3778C30.3248 20.8094 29.4257 20.5005 28.5 20.4999H27.45C27.1977 19.5243 26.7276 18.6185 26.0749 17.8507C25.4222 17.0829 24.604 16.4731 23.6817 16.0671C22.7594 15.661 21.7571 15.4694 20.7501 15.5065C19.743 15.5436 18.7575 15.8085 17.8676 16.2813C16.9777 16.7541 16.2066 17.4225 15.6122 18.2362C15.0177 19.05 14.6155 19.9879 14.4358 20.9794C14.256 21.9709 14.3034 22.9903 14.5743 23.961C14.8452 24.9316 15.3327 25.8281 16 26.5832\" stroke=\"#475467\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_2176_18901\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" transform=\"translate(13.5 13)\"/>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n <div class=\"nodata-title\"><span class=\"click-upload cursor-pointer\"><input name=\"accountType\" type=\"radio\" id=\"kt_create_account_form_account_type_personal\" value=\"personal\"\r\n class=\"btn-check\" ng-reflect-name=\"accountType\" ng-reflect-form-control-name=\"accountType\"\r\n (change)=\"onUpload($event)\"\r\n ng-reflect-value=\"personal\" type=\"file\" #inputFile />Click to upload</span> <span class=\"ms-2\">or drag and drop</span></div>\r\n <div class=\"nodata-sub\">the data added template file for processing.</div>\r\n </div> -->\r\n </div>\r\n <div 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\" *ngIf=\"!isEdit\"\r\n (click)=\"onCreateTeam()\" [disabled]=\"!selectedUsers.length||!selectedTeam.length|| !teamName\">Create\r\n Team</button>\r\n <button class=\"btn btn-primary w-100 ms-3\" id=\"alert-toast\" *ngIf=\"isEdit\"\r\n (click)=\"onCreateTeam()\" [disabled]=\"!selectedUsers.length ||!selectedTeam.length||!teamName\">Update\r\n Team</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}.or-color{color:var(--Gray-700, #344054)!important;text-align:center;font-size:12px;font-style:normal;font-weight:500;line-height:18px}.custom-ordered-list{list-style-type:decimal}.user-text{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:400!important;line-height:20px}.right-bar{border-radius:12px;border:1px solid var(--Gray-300, #D0D5DD)}.click-upload{color:var(--Primary-700, #009BF3)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-decoration-line:underline;text-transform:capitalize}.mandtryclr{color:red}\n"], dependencies: [{ kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i3.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: CustomSelectComponent, selector: "team-select", inputs: ["items", "searchField", "multi", "idField", "selectedValues", "disabled", "label"], outputs: ["selected", "deselected", "deselectedAll"] }] });
|
|
2492
2898
|
}
|
|
2493
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
2899
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TeamsCreationComponent, decorators: [{
|
|
2494
2900
|
type: Component,
|
|
2495
|
-
args: [{ selector: 'lib-teams-creation', 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\">\r\n <div class=\"symbol symbol-75px symbol-circle\">\r\n <svg width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M20.5 23.6816C18.8425 23.6816 17.5 22.2133 17.5 20.4004C17.5 18.5875 18.8425 17.1191 20.5 17.1191C22.1575 17.1191 23.5 18.5875 23.5 20.4004C23.5 22.2133 22.1575 23.6816 20.5 23.6816ZM35.6483 23.6816C33.9908 23.6816 32.6483 22.2133 32.6483 20.4004C32.6483 18.5875 33.9908 17.1191 35.6483 17.1191C37.3058 17.1191 38.6483 18.5875 38.6483 20.4004C38.6483 22.2133 37.3058 23.6816 35.6483 23.6816ZM31.509 26.3066C31.509 28.4805 29.8965 30.2441 27.909 30.2441C25.9215 30.2441 24.309 28.4805 24.309 26.3066C24.309 24.1328 25.9215 22.3691 27.909 22.3691C29.8965 22.3691 31.509 24.1328 31.509 26.3066Z\"\r\n fill=\"#00A3FF\" />\r\n <path\r\n d=\"M20.0013 25.7559C17.7925 25.7559 16 27.7164 16 30.1322C16 30.6121 16.36 31.0059 16.7988 31.0059H24.8013H24.8275C23.8338 30.042 23.2038 28.6352 23.2038 27.0684C23.2038 26.7566 23.2263 26.449 23.275 26.1537C22.765 25.8994 22.1988 25.7559 21.6025 25.7559H20.0013Z\"\r\n fill=\"#00A3FF\" />\r\n <path\r\n d=\"M31.1725 31.0059H31.1987H39.2012C39.64 31.0059 40 30.6162 40 30.1322C40 27.7164 38.2075 25.7559 35.9987 25.7559H34.3975C33.8012 25.7559 33.235 25.8953 32.725 26.1537C32.77 26.4531 32.7963 26.7566 32.7963 27.0684C32.7963 28.6352 32.17 30.042 31.1725 31.0059Z\"\r\n fill=\"#00A3FF\" />\r\n <path\r\n d=\"M25.7988 32.3183C23.0388 32.3183 20.8 34.767 20.8 37.7857C20.8 38.3928 21.25 38.8809 21.8013 38.8809H34.1987C34.7537 38.8809 35.2 38.3887 35.2 37.7857C35.2 34.767 32.9613 32.3183 30.2013 32.3183H25.7988Z\"\r\n fill=\"#00A3FF\" />\r\n </svg>\r\n </div>\r\n </div>\r\n <div class=\"row w-100\">\r\n <div class=\"col-md-12\" *ngIf=\"type === 'create'\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Create Team</a>\r\n <div class=\"sub-title\">Group multiple users to create a team for easier management</div>\r\n </div>\r\n <div class=\"col-md-12\" *ngIf=\"type === 'edit'\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Edit Team</a>\r\n <div class=\"sub-title\">Group multiple users to edit a team for easier management</div>\r\n </div>\r\n\r\n\r\n <div class=\"w-100 h-500px scroll\">\r\n <div class=\"mt-5\">\r\n <form>\r\n <div class=\"row px-0 me-3\">\r\n <div class=\"col-md-12 col-lg-12 col-xl-12 col-xxl-12 mb-7\">\r\n <label for=\"teamName\" class=\"form-label\">Team Name<span class=\"mandtryclr ms-1\">*</span></label>\r\n <input type=\"text\" [(ngModel)]=\"teamName\" [ngModelOptions]=\"{standalone: true}\"\r\n class=\"form-control\" id=\"teamName\" autocomplete=\"off\">\r\n </div>\r\n <div class=\"col-md-12 col-lg-12 col-xl-12 col-xxl-12 mb-5\">\r\n <label for=\"teamlead\" class=\"form-label\">Team Lead <span class=\"mandtryclr ms-1\">*</span></label>\r\n <team-select [items]=\"teamleadList\" [multi]=\"true\" [searchField]=\"'userName'\"\r\n [idField]=\"'userId'\" (selected)=\"onTeamSelect($event)\" (deselected)=\"TeamUnselect($event)\" (deselectedAll)=\"TeamUnselectAll($event)\"\r\n [selectedValues]=\"selectedTeam\"></team-select>\r\n </div>\r\n <div class=\"col-md-12 col-lg-12 col-xl-12 col-xxl-12 mb-5\">\r\n <label for=\"userlead\" class=\"form-label\">Select Users<span class=\"mandtryclr ms-1\">*</span>\r\n </label>\r\n <team-select [items]=\"userList\" [multi]=\"true\" [searchField]=\"'userName'\"\r\n [idField]=\"'userId'\" (selected)=\"onUserSelect($event)\" (deselected)=\"UserUnselect($event)\" (deselectedAll)=\"UserUnselectAll($event)\"\r\n [selectedValues]=\"selectedUsers\"></team-select>\r\n </div>\r\n <div class=\"col-md-12 col-lg-12 col-xl-12 col-xxl-12 mb-5\">\r\n <label for=\"userlead\" class=\"form-label\">Description (optional)</label>\r\n <textarea id=\"description\" [(ngModel)]=\"description\"\r\n [ngModelOptions]=\"{standalone: true}\" name=\"description\" class=\"form-control\"\r\n rows=\"5\" cols=\"50\" placeholder=\"Enter a description...\"></textarea>\r\n </div>\r\n\r\n\r\n <p class=\"text-gray-400 fw-bold my-3\">\r\n <span class=\"line-bg \"><svg width=\"280\" height=\"2\" viewBox=\"0 0 280 2\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect y=\"0.5\" width=\"280\" height=\"1\" fill=\"#EAECF0\" />\r\n </svg>\r\n </span><span class=\"mx-15 or-color\">Or </span> <span class=\"line-bg \"><svg width=\"280\"\r\n height=\"2\" viewBox=\"0 0 280 2\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect y=\"0.5\" width=\"280\" height=\"1\" fill=\"#EAECF0\" />\r\n </svg>\r\n </span>\r\n </p>\r\n <div class=\"d-flex justify-content-center align-items-center\">\r\n <div class=\"fw-bold text-gray-500 my-6\">\r\n <ol class=\"custom-ordered-list text-gray-400 fw-bold fs-6\">\r\n <li class=\"user-text\">Use the template to upload multiple users at once.</li>\r\n <li class=\"user-text my-3\"><span class=\"user-text\">Download the template here -\r\n </span>\r\n <a class=\"ms-1\" href=\"../../../assets/files/teamsUploadTemplate.xlsx\"\r\n download>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"\r\n 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\"\r\n 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 class=\"user-text my-3\">Add your data to the Template File</li>\r\n\r\n </ol>\r\n </div>\r\n </div>\r\n <div\r\n class=\"mt-3 ms-3 right-bar py-10 d-flex justify-content-center align-items-center flex-column\">\r\n <input name=\"accountType\" type=\"radio\" id=\"kt_create_account_form_account_type_personal\"\r\n value=\"personal\" class=\"btn-check\" ng-reflect-name=\"accountType\"\r\n ng-reflect-form-control-name=\"accountType\" (change)=\"onUpload($event)\"\r\n ng-reflect-value=\"personal\" type=\"file\" #inputFile />\r\n <label for=\"kt_create_account_form_account_type_personal\" class=\" w-50 p-4 mt-5\"><span\r\n class=\"fw-bold text-center w-100 fs-4\">\r\n<div class=\"d-flex justify-content-center align-items-center w-100\">\r\n <svg width=\"46\" height=\"46\" viewBox=\"0 0 46 46\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"3\" y=\"3\" width=\"40\" height=\"40\" rx=\"20\" fill=\"#F2F4F7\" />\r\n <rect x=\"3\" y=\"3\" width=\"40\" height=\"40\" rx=\"20\" stroke=\"#F9FAFB\"\r\n stroke-width=\"6\" />\r\n <g clip-path=\"url(#clip0_4047_40566)\">\r\n <path\r\n d=\"M26.3333 26.3334L23 23M23 23L19.6666 26.3334M23 23V30.5M29.9916 28.325C30.8044 27.8819 31.4465 27.1808 31.8165 26.3322C32.1866 25.4837 32.2635 24.5361 32.0351 23.6389C31.8068 22.7418 31.2862 21.9463 30.5555 21.3779C29.8248 20.8095 28.9257 20.5006 28 20.5H26.95C26.6977 19.5244 26.2276 18.6186 25.5749 17.8509C24.9222 17.0831 24.104 16.4732 23.1817 16.0672C22.2594 15.6612 21.2571 15.4695 20.2501 15.5066C19.243 15.5437 18.2575 15.8086 17.3676 16.2814C16.4777 16.7542 15.7066 17.4226 15.1122 18.2363C14.5177 19.0501 14.1155 19.988 13.9358 20.9795C13.756 21.9711 13.8034 22.9905 14.0743 23.9611C14.3452 24.9317 14.8327 25.8282 15.5 26.5834\"\r\n stroke=\"#475467\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_4047_40566\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\"\r\n transform=\"translate(13 13)\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </div>\r\n <div class=\"nodata-title\"><span class=\"click-upload cursor-pointer\">Click to\r\n upload</span>\r\n <!-- <span class=\"ms-2\">or drag and drop</span> -->\r\n </div>\r\n <div class=\"nodata-sub\">the data added template file for processing.</div>\r\n </span>\r\n </label>\r\n </div>\r\n <!-- <div class=\"mt-3 ms-3 right-bar py-10 d-flex justify-content-center align-items-center flex-column\" >\r\n <svg width=\"47\" height=\"46\" viewBox=\"0 0 47 46\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"3.5\" y=\"3\" width=\"40\" height=\"40\" rx=\"20\" fill=\"#F2F4F7\"/>\r\n <rect x=\"3.5\" y=\"3\" width=\"40\" height=\"40\" rx=\"20\" stroke=\"#F9FAFB\" stroke-width=\"6\"/>\r\n <g clip-path=\"url(#clip0_2176_18901)\">\r\n <path d=\"M26.8333 26.3332L23.5 22.9999M23.5 22.9999L20.1666 26.3332M23.5 22.9999V30.4999M30.4916 28.3249C31.3044 27.8818 31.9465 27.1806 32.3165 26.3321C32.6866 25.4835 32.7635 24.5359 32.5351 23.6388C32.3068 22.7417 31.7862 21.9462 31.0555 21.3778C30.3248 20.8094 29.4257 20.5005 28.5 20.4999H27.45C27.1977 19.5243 26.7276 18.6185 26.0749 17.8507C25.4222 17.0829 24.604 16.4731 23.6817 16.0671C22.7594 15.661 21.7571 15.4694 20.7501 15.5065C19.743 15.5436 18.7575 15.8085 17.8676 16.2813C16.9777 16.7541 16.2066 17.4225 15.6122 18.2362C15.0177 19.05 14.6155 19.9879 14.4358 20.9794C14.256 21.9709 14.3034 22.9903 14.5743 23.961C14.8452 24.9316 15.3327 25.8281 16 26.5832\" stroke=\"#475467\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_2176_18901\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" transform=\"translate(13.5 13)\"/>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n <div class=\"nodata-title\"><span class=\"click-upload cursor-pointer\"><input name=\"accountType\" type=\"radio\" id=\"kt_create_account_form_account_type_personal\" value=\"personal\"\r\n class=\"btn-check\" ng-reflect-name=\"accountType\" ng-reflect-form-control-name=\"accountType\"\r\n (change)=\"onUpload($event)\"\r\n ng-reflect-value=\"personal\" type=\"file\" #inputFile />Click to upload</span> <span class=\"ms-2\">or drag and drop</span></div>\r\n <div class=\"nodata-sub\">the data added template file for processing.</div>\r\n </div> -->\r\n </div>\r\n <div 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\" *ngIf=\"!isEdit\"\r\n (click)=\"onCreateTeam()\" [disabled]=\"!selectedUsers.length||!selectedTeam.length|| !teamName\">Create\r\n Team</button>\r\n <button class=\"btn btn-primary w-100 ms-3\" id=\"alert-toast\" *ngIf=\"isEdit\"\r\n (click)=\"onCreateTeam()\" [disabled]=\"!selectedUsers.length ||!selectedTeam.length||!teamName\">Update\r\n Team</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}.or-color{color:var(--Gray-700, #344054)!important;text-align:center;font-size:12px;font-style:normal;font-weight:500;line-height:18px}.custom-ordered-list{list-style-type:decimal}.user-text{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:400!important;line-height:20px}.right-bar{border-radius:12px;border:1px solid var(--Gray-300, #D0D5DD)}.click-upload{color:var(--Primary-700, #009BF3)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-decoration-line:underline;text-transform:capitalize}.mandtryclr{color:red}\n"] }]
|
|
2901
|
+
args: [{ selector: 'lib-teams-creation', 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\">\r\n <div class=\"symbol symbol-75px symbol-circle\">\r\n <svg width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#DAF1FF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#EAF8FF\" stroke-width=\"8\" />\r\n <path\r\n d=\"M20.5 23.6816C18.8425 23.6816 17.5 22.2133 17.5 20.4004C17.5 18.5875 18.8425 17.1191 20.5 17.1191C22.1575 17.1191 23.5 18.5875 23.5 20.4004C23.5 22.2133 22.1575 23.6816 20.5 23.6816ZM35.6483 23.6816C33.9908 23.6816 32.6483 22.2133 32.6483 20.4004C32.6483 18.5875 33.9908 17.1191 35.6483 17.1191C37.3058 17.1191 38.6483 18.5875 38.6483 20.4004C38.6483 22.2133 37.3058 23.6816 35.6483 23.6816ZM31.509 26.3066C31.509 28.4805 29.8965 30.2441 27.909 30.2441C25.9215 30.2441 24.309 28.4805 24.309 26.3066C24.309 24.1328 25.9215 22.3691 27.909 22.3691C29.8965 22.3691 31.509 24.1328 31.509 26.3066Z\"\r\n fill=\"#00A3FF\" />\r\n <path\r\n d=\"M20.0013 25.7559C17.7925 25.7559 16 27.7164 16 30.1322C16 30.6121 16.36 31.0059 16.7988 31.0059H24.8013H24.8275C23.8338 30.042 23.2038 28.6352 23.2038 27.0684C23.2038 26.7566 23.2263 26.449 23.275 26.1537C22.765 25.8994 22.1988 25.7559 21.6025 25.7559H20.0013Z\"\r\n fill=\"#00A3FF\" />\r\n <path\r\n d=\"M31.1725 31.0059H31.1987H39.2012C39.64 31.0059 40 30.6162 40 30.1322C40 27.7164 38.2075 25.7559 35.9987 25.7559H34.3975C33.8012 25.7559 33.235 25.8953 32.725 26.1537C32.77 26.4531 32.7963 26.7566 32.7963 27.0684C32.7963 28.6352 32.17 30.042 31.1725 31.0059Z\"\r\n fill=\"#00A3FF\" />\r\n <path\r\n d=\"M25.7988 32.3183C23.0388 32.3183 20.8 34.767 20.8 37.7857C20.8 38.3928 21.25 38.8809 21.8013 38.8809H34.1987C34.7537 38.8809 35.2 38.3887 35.2 37.7857C35.2 34.767 32.9613 32.3183 30.2013 32.3183H25.7988Z\"\r\n fill=\"#00A3FF\" />\r\n </svg>\r\n </div>\r\n </div>\r\n <div class=\"row w-100\">\r\n <div class=\"col-md-12\" *ngIf=\"type === 'create'\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Create Team</a>\r\n <div class=\"sub-title\">Group multiple users to create a team for easier management</div>\r\n </div>\r\n <div class=\"col-md-12\" *ngIf=\"type === 'edit'\">\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Edit Team</a>\r\n <div class=\"sub-title\">Group multiple users to edit a team for easier management</div>\r\n </div>\r\n\r\n\r\n <div class=\"w-100 h-500px scroll\">\r\n <div class=\"mt-5\">\r\n <form>\r\n <div class=\"row px-0 me-3\">\r\n <div class=\"col-md-12 col-lg-12 col-xl-12 col-xxl-12 mb-7\">\r\n <label for=\"teamName\" class=\"form-label\">Team Name<span class=\"mandtryclr ms-1\">*</span></label>\r\n <input type=\"text\" [(ngModel)]=\"teamName\" [ngModelOptions]=\"{standalone: true}\"\r\n class=\"form-control\" id=\"teamName\" autocomplete=\"off\" (keypress)=\"omitSpecialChar($event)\">\r\n </div>\r\n <div class=\"col-md-12 col-lg-12 col-xl-12 col-xxl-12 mb-5\">\r\n <label for=\"teamlead\" class=\"form-label\">Team Lead <span class=\"mandtryclr ms-1\">*</span></label>\r\n <team-select [items]=\"teamleadList\" [multi]=\"true\" [searchField]=\"'userName'\"\r\n [idField]=\"'userId'\" (selected)=\"onTeamSelect($event)\" (deselected)=\"TeamUnselect($event)\" (deselectedAll)=\"TeamUnselectAll($event)\"\r\n [selectedValues]=\"selectedTeam\"></team-select>\r\n </div>\r\n <div class=\"col-md-12 col-lg-12 col-xl-12 col-xxl-12 mb-5\">\r\n <label for=\"userlead\" class=\"form-label\">Select Users<span class=\"mandtryclr ms-1\">*</span>\r\n </label>\r\n <team-select [items]=\"userList\" [multi]=\"true\" [searchField]=\"'userName'\"\r\n [idField]=\"'userId'\" (selected)=\"onUserSelect($event)\" (deselected)=\"UserUnselect($event)\" (deselectedAll)=\"UserUnselectAll($event)\"\r\n [selectedValues]=\"selectedUsers\"></team-select>\r\n </div>\r\n <div class=\"col-md-12 col-lg-12 col-xl-12 col-xxl-12 mb-5\">\r\n <label for=\"userlead\" class=\"form-label\">Description (optional)</label>\r\n <textarea id=\"description\" [(ngModel)]=\"description\"\r\n [ngModelOptions]=\"{standalone: true}\" name=\"description\" class=\"form-control\"\r\n rows=\"5\" cols=\"50\" placeholder=\"Enter a description...\"></textarea>\r\n </div>\r\n\r\n\r\n <p class=\"text-gray-400 fw-bold my-3\">\r\n <span class=\"line-bg \"><svg width=\"280\" height=\"2\" viewBox=\"0 0 280 2\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect y=\"0.5\" width=\"280\" height=\"1\" fill=\"#EAECF0\" />\r\n </svg>\r\n </span><span class=\"mx-15 or-color\">Or </span> <span class=\"line-bg \"><svg width=\"280\"\r\n height=\"2\" viewBox=\"0 0 280 2\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect y=\"0.5\" width=\"280\" height=\"1\" fill=\"#EAECF0\" />\r\n </svg>\r\n </span>\r\n </p>\r\n <div class=\"d-flex justify-content-center align-items-center\">\r\n <div class=\"fw-bold text-gray-500 my-6\">\r\n <ol class=\"custom-ordered-list text-gray-400 fw-bold fs-6\">\r\n <li class=\"user-text\">Use the template to upload multiple users at once.</li>\r\n <li class=\"user-text my-3\"><span class=\"user-text\">Download the template here -\r\n </span>\r\n <a class=\"ms-1\" href=\"../../../assets/files/teamsUploadTemplate.xlsx\"\r\n download>\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\"\r\n 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\"\r\n 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 class=\"user-text my-3\">Add your data to the Template File</li>\r\n\r\n </ol>\r\n </div>\r\n </div>\r\n <div\r\n class=\"mt-3 ms-3 right-bar py-10 d-flex justify-content-center align-items-center flex-column\">\r\n <input name=\"accountType\" type=\"radio\" id=\"kt_create_account_form_account_type_personal\"\r\n value=\"personal\" class=\"btn-check\" ng-reflect-name=\"accountType\"\r\n ng-reflect-form-control-name=\"accountType\" (change)=\"onUpload($event)\"\r\n ng-reflect-value=\"personal\" type=\"file\" #inputFile />\r\n <label for=\"kt_create_account_form_account_type_personal\" class=\" w-50 p-4 mt-5\"><span\r\n class=\"fw-bold text-center w-100 fs-4\">\r\n<div class=\"d-flex justify-content-center align-items-center w-100\">\r\n <svg width=\"46\" height=\"46\" viewBox=\"0 0 46 46\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"3\" y=\"3\" width=\"40\" height=\"40\" rx=\"20\" fill=\"#F2F4F7\" />\r\n <rect x=\"3\" y=\"3\" width=\"40\" height=\"40\" rx=\"20\" stroke=\"#F9FAFB\"\r\n stroke-width=\"6\" />\r\n <g clip-path=\"url(#clip0_4047_40566)\">\r\n <path\r\n d=\"M26.3333 26.3334L23 23M23 23L19.6666 26.3334M23 23V30.5M29.9916 28.325C30.8044 27.8819 31.4465 27.1808 31.8165 26.3322C32.1866 25.4837 32.2635 24.5361 32.0351 23.6389C31.8068 22.7418 31.2862 21.9463 30.5555 21.3779C29.8248 20.8095 28.9257 20.5006 28 20.5H26.95C26.6977 19.5244 26.2276 18.6186 25.5749 17.8509C24.9222 17.0831 24.104 16.4732 23.1817 16.0672C22.2594 15.6612 21.2571 15.4695 20.2501 15.5066C19.243 15.5437 18.2575 15.8086 17.3676 16.2814C16.4777 16.7542 15.7066 17.4226 15.1122 18.2363C14.5177 19.0501 14.1155 19.988 13.9358 20.9795C13.756 21.9711 13.8034 22.9905 14.0743 23.9611C14.3452 24.9317 14.8327 25.8282 15.5 26.5834\"\r\n stroke=\"#475467\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_4047_40566\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\"\r\n transform=\"translate(13 13)\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </div>\r\n <div class=\"nodata-title\"><span class=\"click-upload cursor-pointer\">Click to\r\n upload</span>\r\n <!-- <span class=\"ms-2\">or drag and drop</span> -->\r\n </div>\r\n <div class=\"nodata-sub\">the data added template file for processing.</div>\r\n </span>\r\n </label>\r\n </div>\r\n <!-- <div class=\"mt-3 ms-3 right-bar py-10 d-flex justify-content-center align-items-center flex-column\" >\r\n <svg width=\"47\" height=\"46\" viewBox=\"0 0 47 46\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"3.5\" y=\"3\" width=\"40\" height=\"40\" rx=\"20\" fill=\"#F2F4F7\"/>\r\n <rect x=\"3.5\" y=\"3\" width=\"40\" height=\"40\" rx=\"20\" stroke=\"#F9FAFB\" stroke-width=\"6\"/>\r\n <g clip-path=\"url(#clip0_2176_18901)\">\r\n <path d=\"M26.8333 26.3332L23.5 22.9999M23.5 22.9999L20.1666 26.3332M23.5 22.9999V30.4999M30.4916 28.3249C31.3044 27.8818 31.9465 27.1806 32.3165 26.3321C32.6866 25.4835 32.7635 24.5359 32.5351 23.6388C32.3068 22.7417 31.7862 21.9462 31.0555 21.3778C30.3248 20.8094 29.4257 20.5005 28.5 20.4999H27.45C27.1977 19.5243 26.7276 18.6185 26.0749 17.8507C25.4222 17.0829 24.604 16.4731 23.6817 16.0671C22.7594 15.661 21.7571 15.4694 20.7501 15.5065C19.743 15.5436 18.7575 15.8085 17.8676 16.2813C16.9777 16.7541 16.2066 17.4225 15.6122 18.2362C15.0177 19.05 14.6155 19.9879 14.4358 20.9794C14.256 21.9709 14.3034 22.9903 14.5743 23.961C14.8452 24.9316 15.3327 25.8281 16 26.5832\" stroke=\"#475467\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_2176_18901\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" transform=\"translate(13.5 13)\"/>\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n <div class=\"nodata-title\"><span class=\"click-upload cursor-pointer\"><input name=\"accountType\" type=\"radio\" id=\"kt_create_account_form_account_type_personal\" value=\"personal\"\r\n class=\"btn-check\" ng-reflect-name=\"accountType\" ng-reflect-form-control-name=\"accountType\"\r\n (change)=\"onUpload($event)\"\r\n ng-reflect-value=\"personal\" type=\"file\" #inputFile />Click to upload</span> <span class=\"ms-2\">or drag and drop</span></div>\r\n <div class=\"nodata-sub\">the data added template file for processing.</div>\r\n </div> -->\r\n </div>\r\n <div 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\" *ngIf=\"!isEdit\"\r\n (click)=\"onCreateTeam()\" [disabled]=\"!selectedUsers.length||!selectedTeam.length|| !teamName\">Create\r\n Team</button>\r\n <button class=\"btn btn-primary w-100 ms-3\" id=\"alert-toast\" *ngIf=\"isEdit\"\r\n (click)=\"onCreateTeam()\" [disabled]=\"!selectedUsers.length ||!selectedTeam.length||!teamName\">Update\r\n Team</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}.or-color{color:var(--Gray-700, #344054)!important;text-align:center;font-size:12px;font-style:normal;font-weight:500;line-height:18px}.custom-ordered-list{list-style-type:decimal}.user-text{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:400!important;line-height:20px}.right-bar{border-radius:12px;border:1px solid var(--Gray-300, #D0D5DD)}.click-upload{color:var(--Primary-700, #009BF3)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-decoration-line:underline;text-transform:capitalize}.mandtryclr{color:red}\n"] }]
|
|
2496
2902
|
}], ctorParameters: () => [{ type: i4.ToastService }, { type: i2$1.Router }, { type: i1$1.NgbActiveModal }, { type: ManageUsersService }, { type: i2.GlobalStateService }, { type: i0.ChangeDetectorRef }], propDecorators: { inputFile: [{
|
|
2497
2903
|
type: ViewChild,
|
|
2498
2904
|
args: ["inputFile"]
|
|
@@ -2710,16 +3116,17 @@ class RolesPermissionTableComponent {
|
|
|
2710
3116
|
this.loadTable();
|
|
2711
3117
|
});
|
|
2712
3118
|
}
|
|
2713
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
2714
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.
|
|
3119
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: RolesPermissionTableComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i2.GlobalStateService }, { token: UserService }, { token: ExcelService }, { token: i1$1.NgbModal }], target: i0.ɵɵFactoryTarget.Component });
|
|
3120
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: RolesPermissionTableComponent, selector: "lib-roles-permission-table", outputs: { dataEvent: "dataEvent" }, ngImport: i0, template: "<div class=\"card mb-3\">\r\n <div class=\"card-header border-0 pt-3 ps-3\">\r\n <div class=\"d-flex align-items-center card-title flex-grow-1\">\r\n <!--begin::Avatar-->\r\n <div class=\"symbol symbol-45px me-3\">\r\n <button type=\"button\" (click)=\"backToUser()\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path d=\"M16.3333 9.99996H4.66663M4.66663 9.99996L10.5 15.8333M4.66663 9.99996L10.5 4.16663\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg> </button>\r\n </div>\r\n <!--end::Avatar-->\r\n\r\n <!--begin::Info-->\r\n <div class=\"d-flex flex-column\">\r\n <span *ngIf=\"roleName !=='superadmin'\" class=\"card-label\">{{roleName | titlecase}}</span>\r\n <span *ngIf=\"roleName ==='superadmin'\" class=\"card-label\">Super Admin</span>\r\n <span class=\"text-sub mb-2\">{{userCount || 0}} users in this role</span>\r\n </div>\r\n <!--end::Info-->\r\n </div>\r\n @if (!loading && !noData) {\r\n <div class=\"card-toolbar\">\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n @if ((gs.userAccess |async)?.Global_User_isEdit) {\r\n <button type=\"button\" (click)=\"exportXLSX()\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n 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.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2\">Export</span> </button>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n @if (!loading && !noData) {\r\n <div class=\"card-body p-0\">\r\n <div class=\"table-responsive\">\r\n <table class=\"table bottom-border\">\r\n <thead>\r\n <tr>\r\n <th>Users</th>\r\n <th>Email</th>\r\n <th>Stores Assigned</th>\r\n <th class=\"text-end\">Actions</th>\r\n </tr>\r\n </thead>\r\n <tbody class=\"fw-semibold\">\r\n <ng-container *ngFor=\"let user of userList;let i=index;\">\r\n <tr>\r\n <td>{{user?.userName}}</td>\r\n <td>{{user?.email}}</td>\r\n <td>{{user?.assigned || 0}}</td>\r\n\r\n <td class=\"text-end\">\r\n <span (click)=\"users('view',user)\" class=\"mx-6 cursor-pointer\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\"\r\n fill=\"none\">\r\n <g clip-path=\"url(#clip0_1995_16400)\">\r\n <path\r\n d=\"M1.33325 10C1.33325 10 4.66658 3.33337 10.4999 3.33337C16.3333 3.33337 19.6666 10 19.6666 10C19.6666 10 16.3333 16.6667 10.4999 16.6667C4.66658 16.6667 1.33325 10 1.33325 10Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10.4999 12.5C11.8806 12.5 12.9999 11.3808 12.9999 10C12.9999 8.61933 11.8806 7.50004 10.4999 7.50004C9.11921 7.50004 7.99992 8.61933 7.99992 10C7.99992 11.3808 9.11921 12.5 10.4999 12.5Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_1995_16400\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" transform=\"translate(0.5)\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n <!-- <span class=\"cursor-pointer\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\"\r\n height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path\r\n d=\"M3 4.99996H4.66667M4.66667 4.99996H18M4.66667 4.99996V16.6666C4.66667 17.1087 4.84226 17.5326 5.15482 17.8451C5.46738 18.1577 5.89131 18.3333 6.33333 18.3333H14.6667C15.1087 18.3333 15.5326 18.1577 15.8452 17.8451C16.1577 17.5326 16.3333 17.1087 16.3333 16.6666V4.99996H4.66667ZM7.16667 4.99996V3.33329C7.16667 2.89127 7.34226 2.46734 7.65482 2.15478C7.96738 1.84222 8.39131 1.66663 8.83333 1.66663H12.1667C12.6087 1.66663 13.0326 1.84222 13.3452 2.15478C13.6577 2.46734 13.8333 2.89127 13.8333 3.33329V4.99996M8.83333 9.16663V14.1666M12.1667 9.16663V14.1666\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span> -->\r\n </td>\r\n </tr>\r\n </ng-container>\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n <div class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12 my-3\">\r\n <lib-pagination *ngIf=\"userList.length!==0\" [itemsPerPage]=\"pagination.limit\" [currentPage]=\"pagination.offset\"\r\n [totalItems]=\"pagination.totalCount\" [paginationSizes]=\"paginationSizes\" [pageSize]=\"paginationSize()\"\r\n (pageChange)=\"onPageChange($event)\" (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n } @else if (loading) {\r\n <div class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n } @else if (noData) {\r\n <div class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-src\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n</div>", styles: ["td{padding:16px 24px!important}.bg-light-primary{border-radius:8px!important;border:1px solid var(--Primary-50, #EAF8FF)!important;background:var(--Primary-50, #EAF8FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Primary-700, #009BF3)!important;font-size:14px;font-weight:600;line-height:20px;text-transform:capitalize}.border-val{padding:12px!important;font-family:Inter;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}.img-src{width:25%;height:20%}\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: "component", type: i4.PaginationComponent, selector: "lib-pagination", inputs: ["collection", "itemsPerPage", "currentPage", "totalItems", "directionLinks", "pageSize", "paginationSizes"], outputs: ["pageChange", "pageSizeChange"] }, { kind: "pipe", type: i6.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.TitleCasePipe, name: "titlecase" }] });
|
|
2715
3121
|
}
|
|
2716
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
3122
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: RolesPermissionTableComponent, decorators: [{
|
|
2717
3123
|
type: Component,
|
|
2718
3124
|
args: [{ selector: "lib-roles-permission-table", template: "<div class=\"card mb-3\">\r\n <div class=\"card-header border-0 pt-3 ps-3\">\r\n <div class=\"d-flex align-items-center card-title flex-grow-1\">\r\n <!--begin::Avatar-->\r\n <div class=\"symbol symbol-45px me-3\">\r\n <button type=\"button\" (click)=\"backToUser()\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path d=\"M16.3333 9.99996H4.66663M4.66663 9.99996L10.5 15.8333M4.66663 9.99996L10.5 4.16663\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg> </button>\r\n </div>\r\n <!--end::Avatar-->\r\n\r\n <!--begin::Info-->\r\n <div class=\"d-flex flex-column\">\r\n <span *ngIf=\"roleName !=='superadmin'\" class=\"card-label\">{{roleName | titlecase}}</span>\r\n <span *ngIf=\"roleName ==='superadmin'\" class=\"card-label\">Super Admin</span>\r\n <span class=\"text-sub mb-2\">{{userCount || 0}} users in this role</span>\r\n </div>\r\n <!--end::Info-->\r\n </div>\r\n @if (!loading && !noData) {\r\n <div class=\"card-toolbar\">\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n @if ((gs.userAccess |async)?.Global_User_isEdit) {\r\n <button type=\"button\" (click)=\"exportXLSX()\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n 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.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2\">Export</span> </button>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n @if (!loading && !noData) {\r\n <div class=\"card-body p-0\">\r\n <div class=\"table-responsive\">\r\n <table class=\"table bottom-border\">\r\n <thead>\r\n <tr>\r\n <th>Users</th>\r\n <th>Email</th>\r\n <th>Stores Assigned</th>\r\n <th class=\"text-end\">Actions</th>\r\n </tr>\r\n </thead>\r\n <tbody class=\"fw-semibold\">\r\n <ng-container *ngFor=\"let user of userList;let i=index;\">\r\n <tr>\r\n <td>{{user?.userName}}</td>\r\n <td>{{user?.email}}</td>\r\n <td>{{user?.assigned || 0}}</td>\r\n\r\n <td class=\"text-end\">\r\n <span (click)=\"users('view',user)\" class=\"mx-6 cursor-pointer\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\"\r\n fill=\"none\">\r\n <g clip-path=\"url(#clip0_1995_16400)\">\r\n <path\r\n d=\"M1.33325 10C1.33325 10 4.66658 3.33337 10.4999 3.33337C16.3333 3.33337 19.6666 10 19.6666 10C19.6666 10 16.3333 16.6667 10.4999 16.6667C4.66658 16.6667 1.33325 10 1.33325 10Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10.4999 12.5C11.8806 12.5 12.9999 11.3808 12.9999 10C12.9999 8.61933 11.8806 7.50004 10.4999 7.50004C9.11921 7.50004 7.99992 8.61933 7.99992 10C7.99992 11.3808 9.11921 12.5 10.4999 12.5Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_1995_16400\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" transform=\"translate(0.5)\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n <!-- <span class=\"cursor-pointer\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\"\r\n height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path\r\n d=\"M3 4.99996H4.66667M4.66667 4.99996H18M4.66667 4.99996V16.6666C4.66667 17.1087 4.84226 17.5326 5.15482 17.8451C5.46738 18.1577 5.89131 18.3333 6.33333 18.3333H14.6667C15.1087 18.3333 15.5326 18.1577 15.8452 17.8451C16.1577 17.5326 16.3333 17.1087 16.3333 16.6666V4.99996H4.66667ZM7.16667 4.99996V3.33329C7.16667 2.89127 7.34226 2.46734 7.65482 2.15478C7.96738 1.84222 8.39131 1.66663 8.83333 1.66663H12.1667C12.6087 1.66663 13.0326 1.84222 13.3452 2.15478C13.6577 2.46734 13.8333 2.89127 13.8333 3.33329V4.99996M8.83333 9.16663V14.1666M12.1667 9.16663V14.1666\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span> -->\r\n </td>\r\n </tr>\r\n </ng-container>\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n <div class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12 my-3\">\r\n <lib-pagination *ngIf=\"userList.length!==0\" [itemsPerPage]=\"pagination.limit\" [currentPage]=\"pagination.offset\"\r\n [totalItems]=\"pagination.totalCount\" [paginationSizes]=\"paginationSizes\" [pageSize]=\"paginationSize()\"\r\n (pageChange)=\"onPageChange($event)\" (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n } @else if (loading) {\r\n <div class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n } @else if (noData) {\r\n <div class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-src\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n</div>", styles: ["td{padding:16px 24px!important}.bg-light-primary{border-radius:8px!important;border:1px solid var(--Primary-50, #EAF8FF)!important;background:var(--Primary-50, #EAF8FF)!important;box-shadow:0 1px 2px #1018280d!important;color:var(--Primary-700, #009BF3)!important;font-size:14px;font-weight:600;line-height:20px;text-transform:capitalize}.border-val{padding:12px!important;font-family:Inter;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}.img-src{width:25%;height:20%}\n"] }]
|
|
2719
3125
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i2.GlobalStateService }, { type: UserService }, { type: ExcelService }, { type: i1$1.NgbModal }], propDecorators: { dataEvent: [{
|
|
2720
3126
|
type: Output
|
|
2721
3127
|
}] } });
|
|
2722
3128
|
|
|
3129
|
+
// import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
|
|
2723
3130
|
class BrandUserComponent {
|
|
2724
3131
|
modalService;
|
|
2725
3132
|
pageInfo;
|
|
@@ -2730,6 +3137,9 @@ class BrandUserComponent {
|
|
|
2730
3137
|
userService;
|
|
2731
3138
|
dataToParent = new EventEmitter();
|
|
2732
3139
|
// @Output() dataTouserlist: EventEmitter<string> = new EventEmitter<string>();
|
|
3140
|
+
bulkUpload;
|
|
3141
|
+
inputFile1;
|
|
3142
|
+
afterValidation;
|
|
2733
3143
|
receivedData = '';
|
|
2734
3144
|
userData;
|
|
2735
3145
|
searchValue;
|
|
@@ -2749,6 +3159,8 @@ class BrandUserComponent {
|
|
|
2749
3159
|
searchInput = new FormControl("");
|
|
2750
3160
|
destroy$ = new Subject();
|
|
2751
3161
|
roles;
|
|
3162
|
+
fileError = false;
|
|
3163
|
+
stores = [];
|
|
2752
3164
|
rolesCount;
|
|
2753
3165
|
SelectedTab;
|
|
2754
3166
|
dataObject = [
|
|
@@ -2758,7 +3170,9 @@ class BrandUserComponent {
|
|
|
2758
3170
|
filterByRoles;
|
|
2759
3171
|
filterByStatus;
|
|
2760
3172
|
userInfo;
|
|
2761
|
-
constructor(modalService, pageInfo, changeDetector, excelService, gs, toastService,
|
|
3173
|
+
constructor(modalService, pageInfo, changeDetector, excelService, gs, toastService,
|
|
3174
|
+
// public activeModal: NgbActiveModal,
|
|
3175
|
+
userService) {
|
|
2762
3176
|
this.modalService = modalService;
|
|
2763
3177
|
this.pageInfo = pageInfo;
|
|
2764
3178
|
this.changeDetector = changeDetector;
|
|
@@ -2855,6 +3269,27 @@ class BrandUserComponent {
|
|
|
2855
3269
|
}
|
|
2856
3270
|
});
|
|
2857
3271
|
}
|
|
3272
|
+
getMaskedValue(value, role) {
|
|
3273
|
+
if (role === 'superadmin')
|
|
3274
|
+
return value;
|
|
3275
|
+
if (!value || !value.includes('@'))
|
|
3276
|
+
return '';
|
|
3277
|
+
const [local, domain] = value.split('@');
|
|
3278
|
+
const visibleLength = Math.min(5, local.length);
|
|
3279
|
+
const visiblePart = local.slice(0, visibleLength);
|
|
3280
|
+
const maskedPart = '*'.repeat(local.length - visibleLength);
|
|
3281
|
+
return `${visiblePart}${maskedPart}@${domain}`;
|
|
3282
|
+
}
|
|
3283
|
+
getMaskedMobile(value, role) {
|
|
3284
|
+
if (role === 'superadmin')
|
|
3285
|
+
return value;
|
|
3286
|
+
if (!value || value.length <= 4)
|
|
3287
|
+
return '*'.repeat(value.length);
|
|
3288
|
+
const first2 = value.slice(0, 2);
|
|
3289
|
+
const last2 = value.slice(-2);
|
|
3290
|
+
const maskedMiddle = '*'.repeat(value.length - 4);
|
|
3291
|
+
return `${first2}${maskedMiddle}${last2}`;
|
|
3292
|
+
}
|
|
2858
3293
|
searchData() {
|
|
2859
3294
|
this.pagination.offset = 1;
|
|
2860
3295
|
this.pagination.limit = 10;
|
|
@@ -3130,6 +3565,156 @@ class BrandUserComponent {
|
|
|
3130
3565
|
});
|
|
3131
3566
|
}
|
|
3132
3567
|
}
|
|
3568
|
+
bulkAssignasxlsx() {
|
|
3569
|
+
this.modalService.open(this.bulkUpload, { centered: true });
|
|
3570
|
+
}
|
|
3571
|
+
addSingleUser() {
|
|
3572
|
+
}
|
|
3573
|
+
excelError;
|
|
3574
|
+
excelData = [];
|
|
3575
|
+
validatedOutput = [];
|
|
3576
|
+
getStoreCounts(data) {
|
|
3577
|
+
const uniqueUserNames = new Set(data?.map((item) => item['Store Name/Store Id']));
|
|
3578
|
+
return uniqueUserNames.size;
|
|
3579
|
+
}
|
|
3580
|
+
onUpload1(e) {
|
|
3581
|
+
let data;
|
|
3582
|
+
let error = [];
|
|
3583
|
+
const target = e.target;
|
|
3584
|
+
if (target.files.length > 1) {
|
|
3585
|
+
this.inputFile1.nativeElement.value = "";
|
|
3586
|
+
}
|
|
3587
|
+
if (!!target.files[0].name.match(/(.xls|.xlsx)/)) {
|
|
3588
|
+
const reader = new FileReader();
|
|
3589
|
+
reader.onload = (e) => {
|
|
3590
|
+
const bstr = e.target.result;
|
|
3591
|
+
const wb = read(bstr, { type: "binary" });
|
|
3592
|
+
const wsname = wb.SheetNames[0];
|
|
3593
|
+
const ws = wb.Sheets[wsname];
|
|
3594
|
+
if (wb.SheetNames[0] !== "Users") {
|
|
3595
|
+
this.toastService.getErrorToast("Please Upload a Valid File");
|
|
3596
|
+
return;
|
|
3597
|
+
}
|
|
3598
|
+
else {
|
|
3599
|
+
data = utils.sheet_to_json(ws);
|
|
3600
|
+
this.excelData = data;
|
|
3601
|
+
}
|
|
3602
|
+
};
|
|
3603
|
+
reader.readAsBinaryString(target.files[0]);
|
|
3604
|
+
reader.onloadend = async (e) => {
|
|
3605
|
+
data?.forEach((element, index) => {
|
|
3606
|
+
if (element?.Email) {
|
|
3607
|
+
element.Email = element?.Email.replace(/\s/g, '');
|
|
3608
|
+
}
|
|
3609
|
+
if (!element?.['Store Name/Store Id'] || element?.['Store Name/Store Id'] == '' || element?.['Store Name/Store Id'] == null) {
|
|
3610
|
+
error.push(`Invalid Store Name/Store Id - B${index + 2}`);
|
|
3611
|
+
}
|
|
3612
|
+
if (!element?.Email || element?.Email?.trim() == '' || element.Email == null) {
|
|
3613
|
+
error.push(`Invalid Email - A${index + 2}`);
|
|
3614
|
+
}
|
|
3615
|
+
if (element?.Email && !element.Email.match(/^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,6}$/)) {
|
|
3616
|
+
error.push(`Invalid Email - A${index + 2}`);
|
|
3617
|
+
}
|
|
3618
|
+
});
|
|
3619
|
+
if (error.length) {
|
|
3620
|
+
this.modalService.dismissAll();
|
|
3621
|
+
const popupcontent = {
|
|
3622
|
+
displayprop: false,
|
|
3623
|
+
imagesrc: `<svg xmlns="http://www.w3.org/2000/svg" width="56" height="56" viewBox="0 0 56 56" fill="none"><rect x="4" y="4" width="48" height="48" rx="24" fill="#FEF0C7"/><path d="M27.9998 24.0012V28.0012M27.9998 32.0012H28.0098M26.2898 18.8612L17.8198 33.0012C17.6451 33.3036 17.5527 33.6465 17.5518 33.9957C17.5508 34.3449 17.6413 34.6883 17.8142 34.9917C17.9871 35.2951 18.2365 35.5479 18.5375 35.725C18.8385 35.9021 19.1806 35.9973 19.5298 36.0012H36.4698C36.819 35.9973 37.1611 35.9021 37.4621 35.725C37.7631 35.5479 38.0124 35.2951 38.1854 34.9917C38.3583 34.6883 38.4488 34.3449 38.4478 33.9957C38.4468 33.6465 38.3544 33.3036 38.1798 33.0012L29.7098 18.8612C29.5315 18.5673 29.2805 18.3243 28.981 18.1557C28.6814 17.987 28.3435 17.8984 27.9998 17.8984C27.656 17.8984 27.3181 17.987 27.0186 18.1557C26.7191 18.3243 26.468 18.5673 26.2898 18.8612Z" stroke="#DC6803" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><rect x="4" y="4" width="48" height="48" rx="24" stroke="#FFFAEB" stroke-width="8"/></svg>`,
|
|
3624
|
+
title: `Invalid details!`,
|
|
3625
|
+
content: `Please provide correct and complete store information.`,
|
|
3626
|
+
buttontype: 'error',
|
|
3627
|
+
error: error
|
|
3628
|
+
};
|
|
3629
|
+
this.afterUplload(popupcontent);
|
|
3630
|
+
return;
|
|
3631
|
+
}
|
|
3632
|
+
const apiData = this.excelData.map((el) => {
|
|
3633
|
+
return { store: el?.['Store Name/Store Id'],
|
|
3634
|
+
email: el?.Email };
|
|
3635
|
+
});
|
|
3636
|
+
this.userService
|
|
3637
|
+
.bulkUserAssign({
|
|
3638
|
+
data: apiData
|
|
3639
|
+
})
|
|
3640
|
+
.subscribe({
|
|
3641
|
+
next: (res) => {
|
|
3642
|
+
if (res && res.code === 200) {
|
|
3643
|
+
if (res.status === 'error' && res.error.error.length) {
|
|
3644
|
+
this.modalService.dismissAll();
|
|
3645
|
+
const popupcontent = {
|
|
3646
|
+
displayprop: false,
|
|
3647
|
+
imagesrc: `<svg xmlns="http://www.w3.org/2000/svg" width="56" height="56" viewBox="0 0 56 56" fill="none"><rect x="4" y="4" width="48" height="48" rx="24" fill="#FEF0C7"/><path d="M27.9998 24.0012V28.0012M27.9998 32.0012H28.0098M26.2898 18.8612L17.8198 33.0012C17.6451 33.3036 17.5527 33.6465 17.5518 33.9957C17.5508 34.3449 17.6413 34.6883 17.8142 34.9917C17.9871 35.2951 18.2365 35.5479 18.5375 35.725C18.8385 35.9021 19.1806 35.9973 19.5298 36.0012H36.4698C36.819 35.9973 37.1611 35.9021 37.4621 35.725C37.7631 35.5479 38.0124 35.2951 38.1854 34.9917C38.3583 34.6883 38.4488 34.3449 38.4478 33.9957C38.4468 33.6465 38.3544 33.3036 38.1798 33.0012L29.7098 18.8612C29.5315 18.5673 29.2805 18.3243 28.981 18.1557C28.6814 17.987 28.3435 17.8984 27.9998 17.8984C27.656 17.8984 27.3181 17.987 27.0186 18.1557C26.7191 18.3243 26.468 18.5673 26.2898 18.8612Z" stroke="#DC6803" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><rect x="4" y="4" width="48" height="48" rx="24" stroke="#FFFAEB" stroke-width="8"/></svg>`,
|
|
3648
|
+
title: `Invalid details!`,
|
|
3649
|
+
content: `Please provide correct and complete store information.`,
|
|
3650
|
+
buttontype: 'error',
|
|
3651
|
+
error: res.error.error
|
|
3652
|
+
};
|
|
3653
|
+
this.afterUplload(popupcontent);
|
|
3654
|
+
this.inputFile1.nativeElement.value = "";
|
|
3655
|
+
return;
|
|
3656
|
+
}
|
|
3657
|
+
else {
|
|
3658
|
+
this.afterUplload();
|
|
3659
|
+
this.validatedOutput = res?.data?.result;
|
|
3660
|
+
this.inputFile1.nativeElement.value = "";
|
|
3661
|
+
}
|
|
3662
|
+
}
|
|
3663
|
+
},
|
|
3664
|
+
error: (err) => {
|
|
3665
|
+
if (err.error.code === 400) {
|
|
3666
|
+
this.modalService.dismissAll();
|
|
3667
|
+
const popupcontent = {
|
|
3668
|
+
displayprop: false,
|
|
3669
|
+
imagesrc: `<svg xmlns="http://www.w3.org/2000/svg" width="56" height="56" viewBox="0 0 56 56" fill="none"><rect x="4" y="4" width="48" height="48" rx="24" fill="#FEF0C7"/><path d="M27.9998 24.0012V28.0012M27.9998 32.0012H28.0098M26.2898 18.8612L17.8198 33.0012C17.6451 33.3036 17.5527 33.6465 17.5518 33.9957C17.5508 34.3449 17.6413 34.6883 17.8142 34.9917C17.9871 35.2951 18.2365 35.5479 18.5375 35.725C18.8385 35.9021 19.1806 35.9973 19.5298 36.0012H36.4698C36.819 35.9973 37.1611 35.9021 37.4621 35.725C37.7631 35.5479 38.0124 35.2951 38.1854 34.9917C38.3583 34.6883 38.4488 34.3449 38.4478 33.9957C38.4468 33.6465 38.3544 33.3036 38.1798 33.0012L29.7098 18.8612C29.5315 18.5673 29.2805 18.3243 28.981 18.1557C28.6814 17.987 28.3435 17.8984 27.9998 17.8984C27.656 17.8984 27.3181 17.987 27.0186 18.1557C26.7191 18.3243 26.468 18.5673 26.2898 18.8612Z" stroke="#DC6803" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><rect x="4" y="4" width="48" height="48" rx="24" stroke="#FFFAEB" stroke-width="8"/></svg>`,
|
|
3670
|
+
title: `Invalid details!`,
|
|
3671
|
+
content: `Please provide correct and complete store information.`,
|
|
3672
|
+
buttontype: 'error',
|
|
3673
|
+
error: err.error.error
|
|
3674
|
+
};
|
|
3675
|
+
this.afterUplload(popupcontent);
|
|
3676
|
+
this.inputFile1.nativeElement.value = "";
|
|
3677
|
+
}
|
|
3678
|
+
else {
|
|
3679
|
+
this.toastService.getErrorToast(err.error.error);
|
|
3680
|
+
this.inputFile1.nativeElement.value = "";
|
|
3681
|
+
}
|
|
3682
|
+
},
|
|
3683
|
+
});
|
|
3684
|
+
};
|
|
3685
|
+
// $("#kt_create_account_form_account_type_personal")?.val("");
|
|
3686
|
+
}
|
|
3687
|
+
}
|
|
3688
|
+
Reupload() {
|
|
3689
|
+
}
|
|
3690
|
+
proceedSubmit() {
|
|
3691
|
+
let payload = { data: this.validatedOutput };
|
|
3692
|
+
this.userService
|
|
3693
|
+
.assignData(payload)
|
|
3694
|
+
.subscribe({
|
|
3695
|
+
next: (res) => {
|
|
3696
|
+
if (res && res.code == 200) {
|
|
3697
|
+
this.toastService.getSuccessToast(`Stores Assigned to User Successfully!`);
|
|
3698
|
+
}
|
|
3699
|
+
else {
|
|
3700
|
+
this.toastService.getErrorToast(`Unable to assign Stores to user!`);
|
|
3701
|
+
}
|
|
3702
|
+
this.modalService.dismissAll('submit');
|
|
3703
|
+
},
|
|
3704
|
+
error: () => {
|
|
3705
|
+
this.toastService.getErrorToast("Unable to Assign Stores to User!");
|
|
3706
|
+
this.modalService.dismissAll();
|
|
3707
|
+
},
|
|
3708
|
+
complete: () => { },
|
|
3709
|
+
});
|
|
3710
|
+
}
|
|
3711
|
+
closeactivepopup() {
|
|
3712
|
+
this.modalService.dismissAll();
|
|
3713
|
+
}
|
|
3714
|
+
afterUplload(data) {
|
|
3715
|
+
this.excelError = data;
|
|
3716
|
+
this.modalService.open(this.afterValidation, { centered: true, backdrop: 'static' });
|
|
3717
|
+
}
|
|
3133
3718
|
userStatusChange(user, i) {
|
|
3134
3719
|
const modalRef = this.modalService.open(AlertPopupComponent, { centered: true, size: 'md', backdrop: "static" });
|
|
3135
3720
|
modalRef.componentInstance.status = user.isActive;
|
|
@@ -3276,14 +3861,23 @@ class BrandUserComponent {
|
|
|
3276
3861
|
this.selectedUsers = [];
|
|
3277
3862
|
});
|
|
3278
3863
|
}
|
|
3279
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
3280
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.11", type: BrandUserComponent, selector: "lib-brand-user", outputs: { dataToParent: "dataToParent" }, ngImport: i0, template: "\r\n\r\n\r\n<div *ngIf=\"receivedData !=='Role Value'\">\r\n <div class=\"\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <!-- <span class=\"card-label mb-2\">Users</span>\r\n <span class=\"text-sub mb-2\">{{pagination?.totalCount ? pagination?.totalCount :'0'}} total users</span> -->\r\n </h3>\r\n <div class=\"card-toolbar rightcorner \">\r\n <div *ngIf=\"!createTeam\" class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\"></rect>\r\n <path\r\n d=\"M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z\"\r\n fill=\"currentColor\"></path>\r\n </svg>\r\n </span>\r\n <input type=\"text\" (change)=\"searchData()\" [(ngModel)]=\"searchValue\" class=\"form-control ps-14 me-2\"\r\n name=\"search\" autocomplete=\"off\" placeholder=\"Search\" autocomplete=\"off\" />\r\n <lib-filters [dataObject]=\"dataObject\" (appliedFilters)=\"applyFilters($event)\"></lib-filters>\r\n\r\n <button *ngIf=\"!loading && !noData\" type=\"button\" (click)=\"exportXLSX()\"\r\n class=\"btn btn-default mx-2 btn-outline p-4 btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n 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.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2\">Export</span> </button>\r\n \r\n <button *ngIf=\"(gs.userAccess |async)?.Global_User_isAdd\" type=\"button\" (click)=\"users('add')\" class=\"btn btn-primary mx-2 rounded-3 text-nowrap\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M10.0001 4.16663V15.8333M4.16675 9.99996H15.8334\" stroke=\"white\" stroke-width=\"1.67\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2 text-white\">Add User</span> </button>\r\n \r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"createTeam\" class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <button type=\"button\" (click)=\"createTeams()\" class=\"btn btn-primary mx-2 rounded-3 text-nowrap\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M10.0001 4.16663V15.8333M4.16675 9.99996H15.8334\" stroke=\"white\" stroke-width=\"1.67\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2 text-white\">Create Team</span> </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n \r\n <div *ngIf=\"!loading && !noData\" class=\"card-body p-0\">\r\n <div class=\"table-responsive\">\r\n <table class=\"table bottom-border text-nowrap \">\r\n <thead>\r\n <tr>\r\n <th *ngIf=\"(gs.userAccess |async)?.Global_User_isAdd\" class=\"cursor-pointer\"><span class=\"inputcheck\"><input type=\"checkbox\" (click)=\"onSelectAll()\" [(ngModel)]=\"selectAllChecked\"\r\n class=\"cursor-pointer\"></span>\r\n\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('userName')\">Name\r\n <svg [ngClass]=\"userList_req?.sortColumName === 'userName' && userList_req?.sortBy === 1 ? 'rotate' : ''\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"userList_req?.sortColumName === 'userName' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('email')\">Email\r\n <svg [ngClass]=\"userList_req?.sortColumName === 'email' && userList_req?.sortBy === 1 ? 'rotate' : ''\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"userList_req?.sortColumName === 'email' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('mobileNumber')\">Contact Number\r\n <svg [ngClass]=\"userList_req?.sortColumName === 'mobileNumber' && userList_req?.sortBy === 1 ? 'rotate' : ''\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"userList_req?.sortColumName === 'mobileNumber' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('role')\">Roles\r\n <svg [ngClass]=\"userList_req?.sortColumName === 'role' && userList_req?.sortBy === 1 ? 'rotate' : ''\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"userList_req?.sortColumName === 'role' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('assignedStores')\">Stores Assigned\r\n <svg [ngClass]=\"userList_req?.sortColumName === 'assignedStores' && userList_req?.sortBy === 1 ? 'rotate' : ''\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"userList_req?.sortColumName === 'assignedStores' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('clusterCount')\">Clusters \r\n <svg [ngClass]=\"userList_req?.sortColumName === 'clusterCount' && userList_req?.sortBy === 1 ? 'rotate' : ''\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"userList_req?.sortColumName === 'clusterCount' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n \r\n <th class=\"cursor-pointer\" (click)=\"onSort('teamCount')\">Teams \r\n <svg [ngClass]=\"userList_req?.sortColumName === 'teamCount' && userList_req?.sortBy === 1 ? 'rotate' : ''\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"userList_req?.sortColumName === 'teamCount' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th style=\"line-height: 21px !important;\">Actions</th>\r\n </tr>\r\n </thead>\r\n <tbody class=\"fw-semibold\">\r\n <ng-container *ngFor=\"let user of userList;let i=index;\">\r\n <tr>\r\n <td *ngIf=\"(gs.userAccess |async)?.Global_User_isAdd\"><span class=\"inputcheck\"><input type=\"checkbox\" class=\"cursor-pointer mt-2\" [(ngModel)]=\"user.checked\" (click)=\"onSelectedTeams(user,i)\"></span></td>\r\n <td>{{user?.userName}}</td>\r\n <td>{{user?.email}}</td>\r\n <td>{{user?.mobileNumber}}</td>\r\n <td *ngIf=\"user?.role ==='superadmin'\">Super Admin</td>\r\n <td *ngIf=\"user?.role !=='superadmin'\">{{user?.role | titlecase}}</td>\r\n <td>{{user?.assignedStores || 0}}</td> \r\n <td>{{user?.clusterCount||0}}</td>\r\n <td>{{user?.teamCount||0}}</td>\r\n\r\n <td>\r\n <div class=\"d-flex\">\r\n <!-- @if ((gs.userAccess | async)?.manage_users_isEdit) {\r\n <span class=\"me-3 cursor-pointer\" (click)=\"users('edit',user)\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path\r\n d=\"M9.66675 3.33333H3.83341C3.39139 3.33333 2.96746 3.50893 2.6549 3.82149C2.34234 4.13405 2.16675 4.55797 2.16675 5V16.6667C2.16675 17.1087 2.34234 17.5326 2.6549 17.8452C2.96746 18.1577 3.39139 18.3333 3.83341 18.3333H15.5001C15.9421 18.3333 16.366 18.1577 16.6786 17.8452C16.9912 17.5326 17.1667 17.1087 17.1667 16.6667V10.8333M15.9167 2.08333C16.2483 1.75181 16.6979 1.56557 17.1667 1.56557C17.6356 1.56557 18.0852 1.75181 18.4167 2.08333C18.7483 2.41485 18.9345 2.86449 18.9345 3.33333C18.9345 3.80217 18.7483 4.25181 18.4167 4.58333L10.5001 12.5L7.16675 13.3333L8.00008 10L15.9167 2.08333Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n } -->\r\n <span class=\"mx-3 cursor-pointer\" (click)=\"Viewusers('view',user)\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_1995_16400)\">\r\n <path\r\n d=\"M1.33325 10C1.33325 10 4.66658 3.33337 10.4999 3.33337C16.3333 3.33337 19.6666 10 19.6666 10C19.6666 10 16.3333 16.6667 10.4999 16.6667C4.66658 16.6667 1.33325 10 1.33325 10Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10.4999 12.5C11.8806 12.5 12.9999 11.3808 12.9999 10C12.9999 8.61933 11.8806 7.50004 10.4999 7.50004C9.11921 7.50004 7.99992 8.61933 7.99992 10C7.99992 11.3808 9.11921 12.5 10.4999 12.5Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_1995_16400\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" transform=\"translate(0.5)\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n @if ((gs.userAccess | async)?.Global_User_isEdit) {\r\n <span class=\"mx-3 cursor-pointer\" *ngIf=\"userInfo.role!=='user'\">\r\n <button type=\"button\" (click)=\"assignStore(user)\" [disabled]=\"!user?.isActive || user?.role ==='superadmin'\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\">\r\n <span class=\"ms-2\">Assign Store</span>\r\n </button>\r\n </span>\r\n }\r\n <span class=\"form-check form-switch\" *ngIf=\"userInfo.role!=='user'\">\r\n <input class=\"form-check-input mt-3\" type=\"checkbox\" role=\"switch\" id=\"support\"\r\n [disabled]=\"!((gs.userAccess | async)?.Global_User_isEdit)\"\r\n (change)=\"userStatusChange(user,i)\" [(ngModel)]=\"userList[i].isActive\" >\r\n @if (userList[i].isActive) {\r\n Active\r\n } @else {\r\n Deactive\r\n }\r\n </span>\r\n </div>\r\n </td>\r\n </tr>\r\n </ng-container>\r\n\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12 my-3\">\r\n <lib-pagination *ngIf=\"userList.length!==0\" [itemsPerPage]=\"pagination.limit\" [currentPage]=\"pagination.offset\"\r\n [totalItems]=\"pagination.totalCount\" [paginationSizes]=\"paginationSizes\" [pageSize]=\"paginationSize()\"\r\n (pageChange)=\"onPageChange($event)\" (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n <div *ngIf=\"loading\" class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer mb-10\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"noData\" class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-src\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- <div *ngIf=\"receivedData !=='Role Value'\" class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12 my-3\">\r\n <div class=\"card p-5\">\r\n <div class=\"border-0\">\r\n <h3 class=\"title fw-bold\">Roles & Permission</h3>\r\n <h6 class=\"sub-title fw-normal\">{{rolesCount || 0}} total roles</h6>\r\n </div>\r\n <div class=\"card-body px-0\">\r\n <div class=\"flex-column align-items-start\">\r\n <div class=\"row\">\r\n <div class=\"col-md-4 border-val mx-3 mb-7 py-7\" *ngFor=\"let obj of roles\">\r\n\r\n <a *ngIf=\"obj.roleName ==='superadmin'\" class=\"role-title my-2 cursor-pointer\" >Super Admin</a>\r\n <a *ngIf=\"obj.roleName !=='superadmin'\" class=\"role-title my-2 cursor-pointer\">{{obj.roleName |\r\n titlecase}}</a> \r\n <div *ngIf=\"obj.roleName ==='superadmin'\" class=\"sub-title fw-semibold my-5\">Oversees all the operations and controls the entire functionality of the dashboard</div>\r\n <div *ngIf=\"obj.roleName ==='admin'\" class=\"sub-title fw-semibold my-5\">Manages specific operations, permissions, and can change setting for assigned locations</div>\r\n <div *ngIf=\"obj.roleName ==='user'\" class=\"sub-title fw-semibold my-5\">Access to specific location and will be able to view dashboard</div>\r\n <div><span class=\"me-5\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"25\" height=\"24\"\r\n viewBox=\"0 0 25 24\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_1973_14308)\">\r\n <path\r\n d=\"M17.5 21V19C17.5 17.9391 17.0786 16.9217 16.3284 16.1716C15.5783 15.4214 14.5609 15 13.5 15H5.5C4.43913 15 3.42172 15.4214 2.67157 16.1716C1.92143 16.9217 1.5 17.9391 1.5 19V21M23.5 21V19C23.4993 18.1137 23.2044 17.2528 22.6614 16.5523C22.1184 15.8519 21.3581 15.3516 20.5 15.13M16.5 3.13C17.3604 3.3503 18.123 3.8507 18.6676 4.55231C19.2122 5.25392 19.5078 6.11683 19.5078 7.005C19.5078 7.89317 19.2122 8.75608 18.6676 9.45769C18.123 10.1593 17.3604 10.6597 16.5 10.88M13.5 7C13.5 9.20914 11.7091 11 9.5 11C7.29086 11 5.5 9.20914 5.5 7C5.5 4.79086 7.29086 3 9.5 3C11.7091 3 13.5 4.79086 13.5 7Z\"\r\n stroke=\"#667085\" stroke-width=\"2\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_1973_14308\">\r\n <rect width=\"24\" height=\"24\" fill=\"white\" transform=\"translate(0.5)\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n <span class=\"uses-list fw-semibold\">{{obj?.count || 0}} Members</span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div> -->\r\n\r\n<!--begin::Row-->\r\n<div *ngIf=\"receivedData ==='Role Value'\" class=\"row gx-5 gx-xl-10\">\r\n <!--begin::Col-->\r\n <div class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12\">\r\n <lib-roles-permission-table (dataEvent)=\"receiveData($event)\"></lib-roles-permission-table>\r\n </div>\r\n <!--end::Col-->\r\n</div>\r\n<!--end::Row-->\r\n", styles: [".border-val{color:var(--Gray-700, #344054)!important;font-family:Inter;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}.table-title-primary{color:var(--Primary-700, #009BF3)!important;font-weight:500!important}.table-sub{line-height:30px!important;color:var(--Gray-500, #667085)!important}td{padding:16px 24px!important;line-height:36px!important}.img-src{width:25%;height:20%}.border-val{padding:10px;border-radius:12px;border:1px solid var(--Gray-200, #EAECF0);background:#fff;box-shadow:0 0 20px #4c577d05}.role-title{color:var(--Primary-600, #344054);font-size:16px;font-weight:600;line-height:24px}.col-md-4{width:31%!important}.user-list{color:var(--Gray-700, #344054);font-size:16px;line-height:24px}.rotate{rotate:180deg;transition:1s}.p-4{padding:.85rem!important}.inputcheck input[type=checkbox]{width:18px!important;height:18px!important;margin:0;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}.inputcheck input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}.inputcheck 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!important;padding-top:12px;padding-right:6px}table th{border-bottom:1px solid var(--Gray-200, #EAECF0)!important;background:var(--Gray-50, #F9FAFB)!important;color:var(--Gray-500, #667085)!important;font-size:12px!important;font-weight:500!important;line-height:0px!important}.rightcorner{position:absolute;top:10px;right:16px;font-size:18px}\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: i3.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.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.PaginationComponent, selector: "lib-pagination", inputs: ["collection", "itemsPerPage", "currentPage", "totalItems", "directionLinks", "pageSize", "paginationSizes"], outputs: ["pageChange", "pageSizeChange"] }, { kind: "component", type: i4.FiltersComponent, selector: "lib-filters", inputs: ["dataObject"], outputs: ["appliedFilters"] }, { kind: "component", type: RolesPermissionTableComponent, selector: "lib-roles-permission-table", outputs: ["dataEvent"] }, { kind: "pipe", type: i6.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.TitleCasePipe, name: "titlecase" }] });
|
|
3864
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: BrandUserComponent, deps: [{ token: i1$1.NgbModal }, { token: i2.PageInfoService }, { token: i0.ChangeDetectorRef }, { token: ExcelService }, { token: i2.GlobalStateService }, { token: i4.ToastService }, { token: UserService }], target: i0.ɵɵFactoryTarget.Component });
|
|
3865
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: BrandUserComponent, selector: "lib-brand-user", outputs: { dataToParent: "dataToParent" }, viewQueries: [{ propertyName: "bulkUpload", first: true, predicate: ["bulkUpload"], descendants: true }, { propertyName: "inputFile1", first: true, predicate: ["inputFile1"], descendants: true }, { propertyName: "afterValidation", first: true, predicate: ["afterValidation"], descendants: true }], ngImport: i0, template: "<div *ngIf=\"receivedData !=='Role Value'\">\r\n <div class=\"\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <!-- <span class=\"card-label mb-2\">Users</span>\r\n <span class=\"text-sub mb-2\">{{pagination?.totalCount ? pagination?.totalCount :'0'}} total users</span> -->\r\n </h3>\r\n <div class=\"card-toolbar rightcorner \">\r\n <div *ngIf=\"!createTeam\" class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\"></rect>\r\n <path\r\n d=\"M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z\"\r\n fill=\"currentColor\"></path>\r\n </svg>\r\n </span>\r\n <input type=\"text\" (change)=\"searchData()\" [(ngModel)]=\"searchValue\" class=\"form-control ps-14 me-2\"\r\n name=\"search\" autocomplete=\"off\" placeholder=\"Search\" autocomplete=\"off\" />\r\n <lib-filters [dataObject]=\"dataObject\" (appliedFilters)=\"applyFilters($event)\"></lib-filters>\r\n\r\n <button *ngIf=\"!loading && !noData\" type=\"button\" (click)=\"exportXLSX()\"\r\n class=\"btn btn-default mx-2 btn-outline p-4 btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n 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.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2\">Export</span> </button>\r\n \r\n \r\n <button type=\"button\" (click)=\"bulkAssignasxlsx()\"\r\n class=\"btn btn-default mx-2 btn-outline p-4 btn-outline-default rounded-3 text-nowrap border-val\"><span class=\"ms-2\">Bulk Assign</span> </button>\r\n\r\n <button *ngIf=\"(gs.userAccess |async)?.Global_User_isAdd\" type=\"button\" (click)=\"users('add')\"\r\n class=\"btn btn-primary mx-2 rounded-3 text-nowrap\"><svg xmlns=\"http://www.w3.org/2000/svg\"\r\n width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M10.0001 4.16663V15.8333M4.16675 9.99996H15.8334\" stroke=\"white\"\r\n stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2 text-white\">Add User</span> </button>\r\n\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"createTeam\" class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <button type=\"button\" (click)=\"createTeams()\"\r\n class=\"btn btn-primary mx-2 rounded-3 text-nowrap\"><svg xmlns=\"http://www.w3.org/2000/svg\"\r\n width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M10.0001 4.16663V15.8333M4.16675 9.99996H15.8334\" stroke=\"white\"\r\n stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2 text-white\">Create Team</span> </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"!loading && !noData\" class=\"card-body p-0\">\r\n <div class=\"table-responsive\">\r\n <table class=\"table bottom-border text-nowrap \">\r\n <thead>\r\n <tr>\r\n <th *ngIf=\"(gs.userAccess |async)?.Global_User_isAdd\" class=\"cursor-pointer\"><span\r\n class=\"inputcheck\"><input type=\"checkbox\" (click)=\"onSelectAll()\"\r\n [(ngModel)]=\"selectAllChecked\" class=\"cursor-pointer\"></span>\r\n\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('userName')\">Name\r\n <svg [ngClass]=\"userList_req?.sortColumName === 'userName' && userList_req?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"userList_req?.sortColumName === 'userName' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('email')\">Email\r\n <svg [ngClass]=\"userList_req?.sortColumName === 'email' && userList_req?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"userList_req?.sortColumName === 'email' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('mobileNumber')\">Contact Number\r\n <svg [ngClass]=\"userList_req?.sortColumName === 'mobileNumber' && userList_req?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"userList_req?.sortColumName === 'mobileNumber' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('role')\">Roles\r\n <svg [ngClass]=\"userList_req?.sortColumName === 'role' && userList_req?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"userList_req?.sortColumName === 'role' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th style=\"line-height: 21px !important;\">Assigned To </th>\r\n <th style=\"line-height: 21px !important;\">As a Lead To </th>\r\n <th style=\"line-height: 21px !important;\">Actions</th>\r\n </tr>\r\n </thead>\r\n <tbody class=\"fw-semibold\">\r\n <ng-container *ngFor=\"let user of userList;let i=index;\">\r\n <tr>\r\n <td *ngIf=\"(gs.userAccess |async)?.Global_User_isAdd\"><span class=\"inputcheck\"><input\r\n type=\"checkbox\" class=\"cursor-pointer mt-2\" [(ngModel)]=\"user.checked\"\r\n (click)=\"onSelectedTeams(user,i)\"></span></td>\r\n <td>{{user?.userName}}</td>\r\n <td>{{ getMaskedValue(user?.email, userInfo?.role) }}</td>\r\n <td>{{ getMaskedMobile(user?.mobileNumber, userInfo?.role) }}</td>\r\n <td *ngIf=\"user?.role ==='superadmin'\">Super Admin</td>\r\n <td *ngIf=\"user?.role !=='superadmin'\">{{user?.role | titlecase}}</td>\r\n <td><span class=\"badge badge-light-primary\">{{user?.assignedStores||0}} Stores</span> <span class=\"badge badge-light-info\">{{user?.teamCount||0}} Teams</span></td>\r\n <td><span class=\"badge badge-light-purple\">{{user?.clusterCount||0}} Clusters</span> <span class=\"badge badge-light-info\">{{user?.teamlead||0}} Teams</span></td>\r\n <!-- <td>{{user?.teamCount||0}}</td> -->\r\n\r\n <td>\r\n <div class=\"d-flex\">\r\n <!-- @if ((gs.userAccess | async)?.manage_users_isEdit) {\r\n <span class=\"me-3 cursor-pointer\" (click)=\"users('edit',user)\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path\r\n d=\"M9.66675 3.33333H3.83341C3.39139 3.33333 2.96746 3.50893 2.6549 3.82149C2.34234 4.13405 2.16675 4.55797 2.16675 5V16.6667C2.16675 17.1087 2.34234 17.5326 2.6549 17.8452C2.96746 18.1577 3.39139 18.3333 3.83341 18.3333H15.5001C15.9421 18.3333 16.366 18.1577 16.6786 17.8452C16.9912 17.5326 17.1667 17.1087 17.1667 16.6667V10.8333M15.9167 2.08333C16.2483 1.75181 16.6979 1.56557 17.1667 1.56557C17.6356 1.56557 18.0852 1.75181 18.4167 2.08333C18.7483 2.41485 18.9345 2.86449 18.9345 3.33333C18.9345 3.80217 18.7483 4.25181 18.4167 4.58333L10.5001 12.5L7.16675 13.3333L8.00008 10L15.9167 2.08333Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n } -->\r\n <span class=\"mx-3 cursor-pointer\" (click)=\"Viewusers('view',user)\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\"\r\n viewBox=\"0 0 21 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_1995_16400)\">\r\n <path\r\n d=\"M1.33325 10C1.33325 10 4.66658 3.33337 10.4999 3.33337C16.3333 3.33337 19.6666 10 19.6666 10C19.6666 10 16.3333 16.6667 10.4999 16.6667C4.66658 16.6667 1.33325 10 1.33325 10Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10.4999 12.5C11.8806 12.5 12.9999 11.3808 12.9999 10C12.9999 8.61933 11.8806 7.50004 10.4999 7.50004C9.11921 7.50004 7.99992 8.61933 7.99992 10C7.99992 11.3808 9.11921 12.5 10.4999 12.5Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_1995_16400\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\"\r\n transform=\"translate(0.5)\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n @if ((gs.userAccess | async)?.Global_User_isEdit) {\r\n <span class=\"mx-3 cursor-pointer\" *ngIf=\"userInfo.role!=='user'\">\r\n <button type=\"button\" (click)=\"assignStore(user)\"\r\n [disabled]=\"!user?.isActive || user?.role ==='superadmin'\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\">\r\n <span class=\"ms-2\">Assign Store</span>\r\n </button>\r\n </span>\r\n }\r\n <span class=\"form-check form-switch\" *ngIf=\"userInfo.role!=='user'\">\r\n <input class=\"form-check-input mt-3\" type=\"checkbox\" role=\"switch\" id=\"support\"\r\n [disabled]=\"!((gs.userAccess | async)?.Global_User_isEdit)\"\r\n (change)=\"userStatusChange(user,i)\" [(ngModel)]=\"userList[i].isActive\">\r\n @if (userList[i].isActive) {\r\n Active\r\n } @else {\r\n Deactive\r\n }\r\n </span>\r\n </div>\r\n </td>\r\n </tr>\r\n </ng-container>\r\n\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12 my-3\">\r\n <lib-pagination *ngIf=\"userList.length!==0\" [itemsPerPage]=\"pagination.limit\" [currentPage]=\"pagination.offset\"\r\n [totalItems]=\"pagination.totalCount\" [paginationSizes]=\"paginationSizes\" [pageSize]=\"paginationSize()\"\r\n (pageChange)=\"onPageChange($event)\" (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n <div *ngIf=\"loading\" class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer mb-10\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"noData\" class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-src\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- <div *ngIf=\"receivedData !=='Role Value'\" class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12 my-3\">\r\n <div class=\"card p-5\">\r\n <div class=\"border-0\">\r\n <h3 class=\"title fw-bold\">Roles & Permission</h3>\r\n <h6 class=\"sub-title fw-normal\">{{rolesCount || 0}} total roles</h6>\r\n </div>\r\n <div class=\"card-body px-0\">\r\n <div class=\"flex-column align-items-start\">\r\n <div class=\"row\">\r\n <div class=\"col-md-4 border-val mx-3 mb-7 py-7\" *ngFor=\"let obj of roles\">\r\n\r\n <a *ngIf=\"obj.roleName ==='superadmin'\" class=\"role-title my-2 cursor-pointer\" >Super Admin</a>\r\n <a *ngIf=\"obj.roleName !=='superadmin'\" class=\"role-title my-2 cursor-pointer\">{{obj.roleName |\r\n titlecase}}</a> \r\n <div *ngIf=\"obj.roleName ==='superadmin'\" class=\"sub-title fw-semibold my-5\">Oversees all the operations and controls the entire functionality of the dashboard</div>\r\n <div *ngIf=\"obj.roleName ==='admin'\" class=\"sub-title fw-semibold my-5\">Manages specific operations, permissions, and can change setting for assigned locations</div>\r\n <div *ngIf=\"obj.roleName ==='user'\" class=\"sub-title fw-semibold my-5\">Access to specific location and will be able to view dashboard</div>\r\n <div><span class=\"me-5\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"25\" height=\"24\"\r\n viewBox=\"0 0 25 24\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_1973_14308)\">\r\n <path\r\n d=\"M17.5 21V19C17.5 17.9391 17.0786 16.9217 16.3284 16.1716C15.5783 15.4214 14.5609 15 13.5 15H5.5C4.43913 15 3.42172 15.4214 2.67157 16.1716C1.92143 16.9217 1.5 17.9391 1.5 19V21M23.5 21V19C23.4993 18.1137 23.2044 17.2528 22.6614 16.5523C22.1184 15.8519 21.3581 15.3516 20.5 15.13M16.5 3.13C17.3604 3.3503 18.123 3.8507 18.6676 4.55231C19.2122 5.25392 19.5078 6.11683 19.5078 7.005C19.5078 7.89317 19.2122 8.75608 18.6676 9.45769C18.123 10.1593 17.3604 10.6597 16.5 10.88M13.5 7C13.5 9.20914 11.7091 11 9.5 11C7.29086 11 5.5 9.20914 5.5 7C5.5 4.79086 7.29086 3 9.5 3C11.7091 3 13.5 4.79086 13.5 7Z\"\r\n stroke=\"#667085\" stroke-width=\"2\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_1973_14308\">\r\n <rect width=\"24\" height=\"24\" fill=\"white\" transform=\"translate(0.5)\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n <span class=\"uses-list fw-semibold\">{{obj?.count || 0}} Members</span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div> -->\r\n\r\n<!--begin::Row-->\r\n<div *ngIf=\"receivedData ==='Role Value'\" class=\"row gx-5 gx-xl-10\">\r\n <!--begin::Col-->\r\n <div class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12\">\r\n <lib-roles-permission-table (dataEvent)=\"receiveData($event)\"></lib-roles-permission-table>\r\n </div>\r\n <!--end::Col-->\r\n</div>\r\n<!--end::Row-->\r\n\r\n<ng-template #bulkUpload let-modal>\r\n <div class=\"card-body flex-column p-9\">\r\n <div class=\"header-title\">Bulk Assign</div>\r\n <div class=\"d-flex justify-content-start align-items-center\">\r\n <div class=\"fw-bold text-gray-500 mt-6\">\r\n <ol class=\"custom-ordered-list text-gray-400 fw-bold px-5 fs-6\">\r\n <li class=\"user-text\">Use the template to upload multiple stores at once.</li>\r\n <li class=\"user-text my-3\"><span class=\"user-text\">Download the template here - </span>\r\n <a class=\"ms-1\" href=\"../../../assets/files/BulkAssignTemplate.xlsx\" 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 class=\"user-text my-3\">Add your data to the Template File</li>\r\n \r\n </ol>\r\n </div>\r\n </div>\r\n <div class=\" w-100 right-bar d-flex justify-content-center align-items-center flex-column\" >\r\n <input name=\"accountType\" type=\"radio\" id=\"kt_create_account_form_account_type_personal1\" value=\"personal1\"\r\n class=\"btn-check\"\r\n (change)=\"onUpload1($event)\"\r\n ng-reflect-value=\"personal\" type=\"file\" #inputFile1 />\r\n <label for=\"kt_create_account_form_account_type_personal1\" class=\" w-1-0 p-4\"><span\r\n class=\"fw-bold text-center w-100 fs-4\">\r\n <div class=\"d-flex justify-content-center align-items-center w-100\">\r\n <svg width=\"46\" height=\"46\" viewBox=\"0 0 46 46\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"3\" y=\"3\" width=\"40\" height=\"40\" rx=\"20\" fill=\"#F2F4F7\" />\r\n <rect x=\"3\" y=\"3\" width=\"40\" height=\"40\" rx=\"20\" stroke=\"#F9FAFB\"\r\n stroke-width=\"6\" />\r\n <g clip-path=\"url(#clip0_4047_40566)\">\r\n <path\r\n d=\"M26.3333 26.3334L23 23M23 23L19.6666 26.3334M23 23V30.5M29.9916 28.325C30.8044 27.8819 31.4465 27.1808 31.8165 26.3322C32.1866 25.4837 32.2635 24.5361 32.0351 23.6389C31.8068 22.7418 31.2862 21.9463 30.5555 21.3779C29.8248 20.8095 28.9257 20.5006 28 20.5H26.95C26.6977 19.5244 26.2276 18.6186 25.5749 17.8509C24.9222 17.0831 24.104 16.4732 23.1817 16.0672C22.2594 15.6612 21.2571 15.4695 20.2501 15.5066C19.243 15.5437 18.2575 15.8086 17.3676 16.2814C16.4777 16.7542 15.7066 17.4226 15.1122 18.2363C14.5177 19.0501 14.1155 19.988 13.9358 20.9795C13.756 21.9711 13.8034 22.9905 14.0743 23.9611C14.3452 24.9317 14.8327 25.8282 15.5 26.5834\"\r\n stroke=\"#475467\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_4047_40566\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\"\r\n transform=\"translate(13 13)\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </div>\r\n <div class=\"nodata-title mb-3\"><span class=\"click-upload cursor-pointer\">Click to\r\n upload</span>\r\n <!-- <span class=\"ms-2\">or drag and drop</span> -->\r\n </div>\r\n <div class=\"nodata-sub\">the data added template file for processing.</div>\r\n </span>\r\n </label>\r\n </div>\r\n <div class=\"w-100 d-flex justify-content-between mt-5\">\r\n <button class=\"btn btn-default btn-outline w-50 me-2\" (click)=\"modal.close()\"> Cancel\r\n </button>\r\n <button class=\"btn btn-default btn-primary w-50 ms-2\" (click)=\"modal.close()\"> Submit\r\n </button> \r\n </div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #afterValidation let-model>\r\n <div class=\"card border-0\">\r\n <div class=\"card-header border-0 mt-0\">\r\n <div class=\"card-title mt-3\"><span class=\"config-heading fw-semibold w-auto\">Bulk Assign</span></div>\r\n </div>\r\n <div class=\"card-body pt-0\">\r\n <div class=\"row\">\r\n <div class=\"col-sm-4\">\r\n <div class=\"popup-card rounded-3 p-3 flex-column h-70px\">\r\n <div class=\"fw-semibold config-heading w-100\">{{getStoreCounts(excelData)}}</div>\r\n <div class=\"fw-semibold subtitle mt-1\">Total Records</div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-4\">\r\n <div class=\"popup-card rounded-3 p-3 flex-column h-70px\">\r\n <div class=\"fw-semibold config-heading w-100\">{{excelData?.length}}</div>\r\n <div class=\"fw-semibold subtitle mt-1\">Rows processed</div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-4\">\r\n <div class=\"popup-card rounded-3 p-3 flex-column h-70px\">\r\n <div [ngClass]=\"excelError ? 'error-heading':''\" class=\"fw-semibold config-heading w-100\">{{excelError?.error?.length || 0}}</div>\r\n <div [ngClass]=\"excelError ? 'excel-error':''\" class=\"fw-semibold subtitle mt-1\">Error</div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!excelError\" class=\"table-header mt-5\" style=\"font-weight: 400;\">\r\n <div >You're about to assign {{getStoreCounts(excelData)}} {{getStoreCounts(excelData) > 1 ? 'Stores' : 'Store'}}. Are you sure want to proceed?</div>\r\n \r\n </div>\r\n <div *ngIf=\"excelError\" class=\"flex-column mt-5\">\r\n <div class=\"config-heading fw-bold\">Invalid Details !</div>\r\n <div class=\"subtitle mt-5\">Please provide correct information.</div>\r\n <div class=\"p-5 w-100 rounded-3 border-error mt-5 flex-column\">\r\n <div *ngFor=\"let error of excelError?.error; let i = index; let last = last\" [ngClass]=\"!last ? 'mb-2' : ''\" class=\"text-error\">{{i + 1}}) {{error}}</div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n <div class=\"card-footer border-0 text-end pt-0\">\r\n <button class=\"btn btn-md btn-default btn-outline\" (click)=\"closeactivepopup()\">Cancel</button>\r\n <button *ngIf=\"!excelError\" class=\"btn btn-md py-3 btn-default ms-3 btn-primary\" (click)=\"proceedSubmit()\">Proceed</button>\r\n <button *ngIf=\"excelError\" class=\"btn py-3 btn-md btn-default ms-3 btn-danger\" (click)=\"file1.click();\">Reupload</button>\r\n <input style=\"visibility: hidden;\" #file1 type=\"file\" id=\"kt_account_team_size_select_2\"\r\n (change)=\"onUpload1($event)\" />\r\n </div>\r\n </div>\r\n</ng-template>\r\n", styles: [".border-val{color:var(--Gray-700, #344054)!important;font-family:Inter;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}.table-title-primary{color:var(--Primary-700, #009BF3)!important;font-weight:500!important}.table-sub{line-height:30px!important;color:var(--Gray-500, #667085)!important}td{padding:16px 24px!important;line-height:36px!important}.img-src{width:25%;height:20%}.border-val{padding:10px;border-radius:12px;border:1px solid var(--Gray-200, #EAECF0);background:#fff;box-shadow:0 0 20px #4c577d05}.role-title{color:var(--Primary-600, #344054);font-size:16px;font-weight:600;line-height:24px}.col-md-4{width:31%!important}.user-list{color:var(--Gray-700, #344054);font-size:16px;line-height:24px}.rotate{rotate:180deg;transition:1s}.p-4{padding:.85rem!important}.inputcheck input[type=checkbox]{width:18px!important;height:18px!important;margin:0;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}.inputcheck input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}.inputcheck 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!important;padding-top:12px;padding-right:6px}table th{border-bottom:1px solid var(--Gray-200, #EAECF0)!important;background:var(--Gray-50, #F9FAFB)!important;color:var(--Gray-500, #667085)!important;font-size:12px!important;font-weight:500!important;line-height:0px!important}.rightcorner{position:absolute;top:10px;right:16px;font-size:18px}.user-text{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:400!important;line-height:20px}.right-bar{border-radius:8px;border:1px solid var(--Gray-300, #D0D5DD)}.click-upload{color:var(--Primary-700, #009BF3)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-decoration-line:underline;text-transform:capitalize}.header-title{color:var(--Gray-900, #101828);font-size:18px;font-weight:600;line-height:28px}.subtitle{color:var(--Gray-500, #667085);font-size:14px;font-weight:400;line-height:20px}.config-heading{color:var(--Gray-900, #101828);font-size:18px;font-weight:600;line-height:28px}.table-header{color:var(--Gray-800, #1D2939);font-size:16px;font-weight:400;line-height:24px}.text-error{color:var(--Error-700, #B42318)!important;font-size:14px;font-weight:500;line-height:20px}.excel-error{color:var(--Error-600, #D92D20);font-size:14px;font-weight:500;line-height:20px}.error-heading{color:var(--Error-600, #D92D20);font-size:20px;font-weight:500;line-height:30px}.border-error{border:1px solid var(--Error-300, #FDA29B)!important;background:var(--Error-25, #FFFBFA)!important}.popup-card{border-radius:6px;border:1px solid var(--Gray-300, #D0D5DD);background:#fff;box-shadow:0 1px 3px #1018281a,0 1px 2px #1018280f}\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: i3.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.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.PaginationComponent, selector: "lib-pagination", inputs: ["collection", "itemsPerPage", "currentPage", "totalItems", "directionLinks", "pageSize", "paginationSizes"], outputs: ["pageChange", "pageSizeChange"] }, { kind: "component", type: i4.FiltersComponent, selector: "lib-filters", inputs: ["dataObject"], outputs: ["appliedFilters"] }, { kind: "component", type: RolesPermissionTableComponent, selector: "lib-roles-permission-table", outputs: ["dataEvent"] }, { kind: "pipe", type: i6.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.TitleCasePipe, name: "titlecase" }] });
|
|
3281
3866
|
}
|
|
3282
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
3867
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: BrandUserComponent, decorators: [{
|
|
3283
3868
|
type: Component,
|
|
3284
|
-
args: [{ selector: 'lib-brand-user', template: "\r\n\r\n\r\n<div *ngIf=\"receivedData !=='Role Value'\">\r\n <div class=\"\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <!-- <span class=\"card-label mb-2\">Users</span>\r\n <span class=\"text-sub mb-2\">{{pagination?.totalCount ? pagination?.totalCount :'0'}} total users</span> -->\r\n </h3>\r\n <div class=\"card-toolbar rightcorner \">\r\n <div *ngIf=\"!createTeam\" class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\"></rect>\r\n <path\r\n d=\"M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z\"\r\n fill=\"currentColor\"></path>\r\n </svg>\r\n </span>\r\n <input type=\"text\" (change)=\"searchData()\" [(ngModel)]=\"searchValue\" class=\"form-control ps-14 me-2\"\r\n name=\"search\" autocomplete=\"off\" placeholder=\"Search\" autocomplete=\"off\" />\r\n <lib-filters [dataObject]=\"dataObject\" (appliedFilters)=\"applyFilters($event)\"></lib-filters>\r\n\r\n <button *ngIf=\"!loading && !noData\" type=\"button\" (click)=\"exportXLSX()\"\r\n class=\"btn btn-default mx-2 btn-outline p-4 btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n 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.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2\">Export</span> </button>\r\n \r\n <button *ngIf=\"(gs.userAccess |async)?.Global_User_isAdd\" type=\"button\" (click)=\"users('add')\" class=\"btn btn-primary mx-2 rounded-3 text-nowrap\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M10.0001 4.16663V15.8333M4.16675 9.99996H15.8334\" stroke=\"white\" stroke-width=\"1.67\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2 text-white\">Add User</span> </button>\r\n \r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"createTeam\" class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <button type=\"button\" (click)=\"createTeams()\" class=\"btn btn-primary mx-2 rounded-3 text-nowrap\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M10.0001 4.16663V15.8333M4.16675 9.99996H15.8334\" stroke=\"white\" stroke-width=\"1.67\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2 text-white\">Create Team</span> </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n \r\n <div *ngIf=\"!loading && !noData\" class=\"card-body p-0\">\r\n <div class=\"table-responsive\">\r\n <table class=\"table bottom-border text-nowrap \">\r\n <thead>\r\n <tr>\r\n <th *ngIf=\"(gs.userAccess |async)?.Global_User_isAdd\" class=\"cursor-pointer\"><span class=\"inputcheck\"><input type=\"checkbox\" (click)=\"onSelectAll()\" [(ngModel)]=\"selectAllChecked\"\r\n class=\"cursor-pointer\"></span>\r\n\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('userName')\">Name\r\n <svg [ngClass]=\"userList_req?.sortColumName === 'userName' && userList_req?.sortBy === 1 ? 'rotate' : ''\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"userList_req?.sortColumName === 'userName' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('email')\">Email\r\n <svg [ngClass]=\"userList_req?.sortColumName === 'email' && userList_req?.sortBy === 1 ? 'rotate' : ''\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"userList_req?.sortColumName === 'email' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('mobileNumber')\">Contact Number\r\n <svg [ngClass]=\"userList_req?.sortColumName === 'mobileNumber' && userList_req?.sortBy === 1 ? 'rotate' : ''\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"userList_req?.sortColumName === 'mobileNumber' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('role')\">Roles\r\n <svg [ngClass]=\"userList_req?.sortColumName === 'role' && userList_req?.sortBy === 1 ? 'rotate' : ''\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"userList_req?.sortColumName === 'role' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('assignedStores')\">Stores Assigned\r\n <svg [ngClass]=\"userList_req?.sortColumName === 'assignedStores' && userList_req?.sortBy === 1 ? 'rotate' : ''\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"userList_req?.sortColumName === 'assignedStores' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('clusterCount')\">Clusters \r\n <svg [ngClass]=\"userList_req?.sortColumName === 'clusterCount' && userList_req?.sortBy === 1 ? 'rotate' : ''\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"userList_req?.sortColumName === 'clusterCount' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n \r\n <th class=\"cursor-pointer\" (click)=\"onSort('teamCount')\">Teams \r\n <svg [ngClass]=\"userList_req?.sortColumName === 'teamCount' && userList_req?.sortBy === 1 ? 'rotate' : ''\" xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"userList_req?.sortColumName === 'teamCount' ? '#00A3FF' : '#667085'\" stroke-width=\"1.33333\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg></th>\r\n <th style=\"line-height: 21px !important;\">Actions</th>\r\n </tr>\r\n </thead>\r\n <tbody class=\"fw-semibold\">\r\n <ng-container *ngFor=\"let user of userList;let i=index;\">\r\n <tr>\r\n <td *ngIf=\"(gs.userAccess |async)?.Global_User_isAdd\"><span class=\"inputcheck\"><input type=\"checkbox\" class=\"cursor-pointer mt-2\" [(ngModel)]=\"user.checked\" (click)=\"onSelectedTeams(user,i)\"></span></td>\r\n <td>{{user?.userName}}</td>\r\n <td>{{user?.email}}</td>\r\n <td>{{user?.mobileNumber}}</td>\r\n <td *ngIf=\"user?.role ==='superadmin'\">Super Admin</td>\r\n <td *ngIf=\"user?.role !=='superadmin'\">{{user?.role | titlecase}}</td>\r\n <td>{{user?.assignedStores || 0}}</td> \r\n <td>{{user?.clusterCount||0}}</td>\r\n <td>{{user?.teamCount||0}}</td>\r\n\r\n <td>\r\n <div class=\"d-flex\">\r\n <!-- @if ((gs.userAccess | async)?.manage_users_isEdit) {\r\n <span class=\"me-3 cursor-pointer\" (click)=\"users('edit',user)\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path\r\n d=\"M9.66675 3.33333H3.83341C3.39139 3.33333 2.96746 3.50893 2.6549 3.82149C2.34234 4.13405 2.16675 4.55797 2.16675 5V16.6667C2.16675 17.1087 2.34234 17.5326 2.6549 17.8452C2.96746 18.1577 3.39139 18.3333 3.83341 18.3333H15.5001C15.9421 18.3333 16.366 18.1577 16.6786 17.8452C16.9912 17.5326 17.1667 17.1087 17.1667 16.6667V10.8333M15.9167 2.08333C16.2483 1.75181 16.6979 1.56557 17.1667 1.56557C17.6356 1.56557 18.0852 1.75181 18.4167 2.08333C18.7483 2.41485 18.9345 2.86449 18.9345 3.33333C18.9345 3.80217 18.7483 4.25181 18.4167 4.58333L10.5001 12.5L7.16675 13.3333L8.00008 10L15.9167 2.08333Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n } -->\r\n <span class=\"mx-3 cursor-pointer\" (click)=\"Viewusers('view',user)\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_1995_16400)\">\r\n <path\r\n d=\"M1.33325 10C1.33325 10 4.66658 3.33337 10.4999 3.33337C16.3333 3.33337 19.6666 10 19.6666 10C19.6666 10 16.3333 16.6667 10.4999 16.6667C4.66658 16.6667 1.33325 10 1.33325 10Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10.4999 12.5C11.8806 12.5 12.9999 11.3808 12.9999 10C12.9999 8.61933 11.8806 7.50004 10.4999 7.50004C9.11921 7.50004 7.99992 8.61933 7.99992 10C7.99992 11.3808 9.11921 12.5 10.4999 12.5Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_1995_16400\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\" transform=\"translate(0.5)\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n @if ((gs.userAccess | async)?.Global_User_isEdit) {\r\n <span class=\"mx-3 cursor-pointer\" *ngIf=\"userInfo.role!=='user'\">\r\n <button type=\"button\" (click)=\"assignStore(user)\" [disabled]=\"!user?.isActive || user?.role ==='superadmin'\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\">\r\n <span class=\"ms-2\">Assign Store</span>\r\n </button>\r\n </span>\r\n }\r\n <span class=\"form-check form-switch\" *ngIf=\"userInfo.role!=='user'\">\r\n <input class=\"form-check-input mt-3\" type=\"checkbox\" role=\"switch\" id=\"support\"\r\n [disabled]=\"!((gs.userAccess | async)?.Global_User_isEdit)\"\r\n (change)=\"userStatusChange(user,i)\" [(ngModel)]=\"userList[i].isActive\" >\r\n @if (userList[i].isActive) {\r\n Active\r\n } @else {\r\n Deactive\r\n }\r\n </span>\r\n </div>\r\n </td>\r\n </tr>\r\n </ng-container>\r\n\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12 my-3\">\r\n <lib-pagination *ngIf=\"userList.length!==0\" [itemsPerPage]=\"pagination.limit\" [currentPage]=\"pagination.offset\"\r\n [totalItems]=\"pagination.totalCount\" [paginationSizes]=\"paginationSizes\" [pageSize]=\"paginationSize()\"\r\n (pageChange)=\"onPageChange($event)\" (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n <div *ngIf=\"loading\" class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer mb-10\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"noData\" class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-src\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- <div *ngIf=\"receivedData !=='Role Value'\" class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12 my-3\">\r\n <div class=\"card p-5\">\r\n <div class=\"border-0\">\r\n <h3 class=\"title fw-bold\">Roles & Permission</h3>\r\n <h6 class=\"sub-title fw-normal\">{{rolesCount || 0}} total roles</h6>\r\n </div>\r\n <div class=\"card-body px-0\">\r\n <div class=\"flex-column align-items-start\">\r\n <div class=\"row\">\r\n <div class=\"col-md-4 border-val mx-3 mb-7 py-7\" *ngFor=\"let obj of roles\">\r\n\r\n <a *ngIf=\"obj.roleName ==='superadmin'\" class=\"role-title my-2 cursor-pointer\" >Super Admin</a>\r\n <a *ngIf=\"obj.roleName !=='superadmin'\" class=\"role-title my-2 cursor-pointer\">{{obj.roleName |\r\n titlecase}}</a> \r\n <div *ngIf=\"obj.roleName ==='superadmin'\" class=\"sub-title fw-semibold my-5\">Oversees all the operations and controls the entire functionality of the dashboard</div>\r\n <div *ngIf=\"obj.roleName ==='admin'\" class=\"sub-title fw-semibold my-5\">Manages specific operations, permissions, and can change setting for assigned locations</div>\r\n <div *ngIf=\"obj.roleName ==='user'\" class=\"sub-title fw-semibold my-5\">Access to specific location and will be able to view dashboard</div>\r\n <div><span class=\"me-5\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"25\" height=\"24\"\r\n viewBox=\"0 0 25 24\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_1973_14308)\">\r\n <path\r\n d=\"M17.5 21V19C17.5 17.9391 17.0786 16.9217 16.3284 16.1716C15.5783 15.4214 14.5609 15 13.5 15H5.5C4.43913 15 3.42172 15.4214 2.67157 16.1716C1.92143 16.9217 1.5 17.9391 1.5 19V21M23.5 21V19C23.4993 18.1137 23.2044 17.2528 22.6614 16.5523C22.1184 15.8519 21.3581 15.3516 20.5 15.13M16.5 3.13C17.3604 3.3503 18.123 3.8507 18.6676 4.55231C19.2122 5.25392 19.5078 6.11683 19.5078 7.005C19.5078 7.89317 19.2122 8.75608 18.6676 9.45769C18.123 10.1593 17.3604 10.6597 16.5 10.88M13.5 7C13.5 9.20914 11.7091 11 9.5 11C7.29086 11 5.5 9.20914 5.5 7C5.5 4.79086 7.29086 3 9.5 3C11.7091 3 13.5 4.79086 13.5 7Z\"\r\n stroke=\"#667085\" stroke-width=\"2\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_1973_14308\">\r\n <rect width=\"24\" height=\"24\" fill=\"white\" transform=\"translate(0.5)\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n <span class=\"uses-list fw-semibold\">{{obj?.count || 0}} Members</span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div> -->\r\n\r\n<!--begin::Row-->\r\n<div *ngIf=\"receivedData ==='Role Value'\" class=\"row gx-5 gx-xl-10\">\r\n <!--begin::Col-->\r\n <div class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12\">\r\n <lib-roles-permission-table (dataEvent)=\"receiveData($event)\"></lib-roles-permission-table>\r\n </div>\r\n <!--end::Col-->\r\n</div>\r\n<!--end::Row-->\r\n", styles: [".border-val{color:var(--Gray-700, #344054)!important;font-family:Inter;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}.table-title-primary{color:var(--Primary-700, #009BF3)!important;font-weight:500!important}.table-sub{line-height:30px!important;color:var(--Gray-500, #667085)!important}td{padding:16px 24px!important;line-height:36px!important}.img-src{width:25%;height:20%}.border-val{padding:10px;border-radius:12px;border:1px solid var(--Gray-200, #EAECF0);background:#fff;box-shadow:0 0 20px #4c577d05}.role-title{color:var(--Primary-600, #344054);font-size:16px;font-weight:600;line-height:24px}.col-md-4{width:31%!important}.user-list{color:var(--Gray-700, #344054);font-size:16px;line-height:24px}.rotate{rotate:180deg;transition:1s}.p-4{padding:.85rem!important}.inputcheck input[type=checkbox]{width:18px!important;height:18px!important;margin:0;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}.inputcheck input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}.inputcheck 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!important;padding-top:12px;padding-right:6px}table th{border-bottom:1px solid var(--Gray-200, #EAECF0)!important;background:var(--Gray-50, #F9FAFB)!important;color:var(--Gray-500, #667085)!important;font-size:12px!important;font-weight:500!important;line-height:0px!important}.rightcorner{position:absolute;top:10px;right:16px;font-size:18px}\n"] }]
|
|
3869
|
+
args: [{ selector: 'lib-brand-user', template: "<div *ngIf=\"receivedData !=='Role Value'\">\r\n <div class=\"\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <!-- <span class=\"card-label mb-2\">Users</span>\r\n <span class=\"text-sub mb-2\">{{pagination?.totalCount ? pagination?.totalCount :'0'}} total users</span> -->\r\n </h3>\r\n <div class=\"card-toolbar rightcorner \">\r\n <div *ngIf=\"!createTeam\" class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\"></rect>\r\n <path\r\n d=\"M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z\"\r\n fill=\"currentColor\"></path>\r\n </svg>\r\n </span>\r\n <input type=\"text\" (change)=\"searchData()\" [(ngModel)]=\"searchValue\" class=\"form-control ps-14 me-2\"\r\n name=\"search\" autocomplete=\"off\" placeholder=\"Search\" autocomplete=\"off\" />\r\n <lib-filters [dataObject]=\"dataObject\" (appliedFilters)=\"applyFilters($event)\"></lib-filters>\r\n\r\n <button *ngIf=\"!loading && !noData\" type=\"button\" (click)=\"exportXLSX()\"\r\n class=\"btn btn-default mx-2 btn-outline p-4 btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n 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.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2\">Export</span> </button>\r\n \r\n \r\n <button type=\"button\" (click)=\"bulkAssignasxlsx()\"\r\n class=\"btn btn-default mx-2 btn-outline p-4 btn-outline-default rounded-3 text-nowrap border-val\"><span class=\"ms-2\">Bulk Assign</span> </button>\r\n\r\n <button *ngIf=\"(gs.userAccess |async)?.Global_User_isAdd\" type=\"button\" (click)=\"users('add')\"\r\n class=\"btn btn-primary mx-2 rounded-3 text-nowrap\"><svg xmlns=\"http://www.w3.org/2000/svg\"\r\n width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M10.0001 4.16663V15.8333M4.16675 9.99996H15.8334\" stroke=\"white\"\r\n stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2 text-white\">Add User</span> </button>\r\n\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"createTeam\" class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <button type=\"button\" (click)=\"createTeams()\"\r\n class=\"btn btn-primary mx-2 rounded-3 text-nowrap\"><svg xmlns=\"http://www.w3.org/2000/svg\"\r\n width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M10.0001 4.16663V15.8333M4.16675 9.99996H15.8334\" stroke=\"white\"\r\n stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2 text-white\">Create Team</span> </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"!loading && !noData\" class=\"card-body p-0\">\r\n <div class=\"table-responsive\">\r\n <table class=\"table bottom-border text-nowrap \">\r\n <thead>\r\n <tr>\r\n <th *ngIf=\"(gs.userAccess |async)?.Global_User_isAdd\" class=\"cursor-pointer\"><span\r\n class=\"inputcheck\"><input type=\"checkbox\" (click)=\"onSelectAll()\"\r\n [(ngModel)]=\"selectAllChecked\" class=\"cursor-pointer\"></span>\r\n\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('userName')\">Name\r\n <svg [ngClass]=\"userList_req?.sortColumName === 'userName' && userList_req?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"userList_req?.sortColumName === 'userName' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('email')\">Email\r\n <svg [ngClass]=\"userList_req?.sortColumName === 'email' && userList_req?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"userList_req?.sortColumName === 'email' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('mobileNumber')\">Contact Number\r\n <svg [ngClass]=\"userList_req?.sortColumName === 'mobileNumber' && userList_req?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"userList_req?.sortColumName === 'mobileNumber' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('role')\">Roles\r\n <svg [ngClass]=\"userList_req?.sortColumName === 'role' && userList_req?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"userList_req?.sortColumName === 'role' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th style=\"line-height: 21px !important;\">Assigned To </th>\r\n <th style=\"line-height: 21px !important;\">As a Lead To </th>\r\n <th style=\"line-height: 21px !important;\">Actions</th>\r\n </tr>\r\n </thead>\r\n <tbody class=\"fw-semibold\">\r\n <ng-container *ngFor=\"let user of userList;let i=index;\">\r\n <tr>\r\n <td *ngIf=\"(gs.userAccess |async)?.Global_User_isAdd\"><span class=\"inputcheck\"><input\r\n type=\"checkbox\" class=\"cursor-pointer mt-2\" [(ngModel)]=\"user.checked\"\r\n (click)=\"onSelectedTeams(user,i)\"></span></td>\r\n <td>{{user?.userName}}</td>\r\n <td>{{ getMaskedValue(user?.email, userInfo?.role) }}</td>\r\n <td>{{ getMaskedMobile(user?.mobileNumber, userInfo?.role) }}</td>\r\n <td *ngIf=\"user?.role ==='superadmin'\">Super Admin</td>\r\n <td *ngIf=\"user?.role !=='superadmin'\">{{user?.role | titlecase}}</td>\r\n <td><span class=\"badge badge-light-primary\">{{user?.assignedStores||0}} Stores</span> <span class=\"badge badge-light-info\">{{user?.teamCount||0}} Teams</span></td>\r\n <td><span class=\"badge badge-light-purple\">{{user?.clusterCount||0}} Clusters</span> <span class=\"badge badge-light-info\">{{user?.teamlead||0}} Teams</span></td>\r\n <!-- <td>{{user?.teamCount||0}}</td> -->\r\n\r\n <td>\r\n <div class=\"d-flex\">\r\n <!-- @if ((gs.userAccess | async)?.manage_users_isEdit) {\r\n <span class=\"me-3 cursor-pointer\" (click)=\"users('edit',user)\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\" viewBox=\"0 0 21 20\" fill=\"none\">\r\n <path\r\n d=\"M9.66675 3.33333H3.83341C3.39139 3.33333 2.96746 3.50893 2.6549 3.82149C2.34234 4.13405 2.16675 4.55797 2.16675 5V16.6667C2.16675 17.1087 2.34234 17.5326 2.6549 17.8452C2.96746 18.1577 3.39139 18.3333 3.83341 18.3333H15.5001C15.9421 18.3333 16.366 18.1577 16.6786 17.8452C16.9912 17.5326 17.1667 17.1087 17.1667 16.6667V10.8333M15.9167 2.08333C16.2483 1.75181 16.6979 1.56557 17.1667 1.56557C17.6356 1.56557 18.0852 1.75181 18.4167 2.08333C18.7483 2.41485 18.9345 2.86449 18.9345 3.33333C18.9345 3.80217 18.7483 4.25181 18.4167 4.58333L10.5001 12.5L7.16675 13.3333L8.00008 10L15.9167 2.08333Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n } -->\r\n <span class=\"mx-3 cursor-pointer\" (click)=\"Viewusers('view',user)\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\"\r\n viewBox=\"0 0 21 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_1995_16400)\">\r\n <path\r\n d=\"M1.33325 10C1.33325 10 4.66658 3.33337 10.4999 3.33337C16.3333 3.33337 19.6666 10 19.6666 10C19.6666 10 16.3333 16.6667 10.4999 16.6667C4.66658 16.6667 1.33325 10 1.33325 10Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10.4999 12.5C11.8806 12.5 12.9999 11.3808 12.9999 10C12.9999 8.61933 11.8806 7.50004 10.4999 7.50004C9.11921 7.50004 7.99992 8.61933 7.99992 10C7.99992 11.3808 9.11921 12.5 10.4999 12.5Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_1995_16400\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\"\r\n transform=\"translate(0.5)\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n @if ((gs.userAccess | async)?.Global_User_isEdit) {\r\n <span class=\"mx-3 cursor-pointer\" *ngIf=\"userInfo.role!=='user'\">\r\n <button type=\"button\" (click)=\"assignStore(user)\"\r\n [disabled]=\"!user?.isActive || user?.role ==='superadmin'\"\r\n class=\"btn btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\">\r\n <span class=\"ms-2\">Assign Store</span>\r\n </button>\r\n </span>\r\n }\r\n <span class=\"form-check form-switch\" *ngIf=\"userInfo.role!=='user'\">\r\n <input class=\"form-check-input mt-3\" type=\"checkbox\" role=\"switch\" id=\"support\"\r\n [disabled]=\"!((gs.userAccess | async)?.Global_User_isEdit)\"\r\n (change)=\"userStatusChange(user,i)\" [(ngModel)]=\"userList[i].isActive\">\r\n @if (userList[i].isActive) {\r\n Active\r\n } @else {\r\n Deactive\r\n }\r\n </span>\r\n </div>\r\n </td>\r\n </tr>\r\n </ng-container>\r\n\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12 my-3\">\r\n <lib-pagination *ngIf=\"userList.length!==0\" [itemsPerPage]=\"pagination.limit\" [currentPage]=\"pagination.offset\"\r\n [totalItems]=\"pagination.totalCount\" [paginationSizes]=\"paginationSizes\" [pageSize]=\"paginationSize()\"\r\n (pageChange)=\"onPageChange($event)\" (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n <div *ngIf=\"loading\" class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer mb-10\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"noData\" class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-src\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<!-- <div *ngIf=\"receivedData !=='Role Value'\" class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12 my-3\">\r\n <div class=\"card p-5\">\r\n <div class=\"border-0\">\r\n <h3 class=\"title fw-bold\">Roles & Permission</h3>\r\n <h6 class=\"sub-title fw-normal\">{{rolesCount || 0}} total roles</h6>\r\n </div>\r\n <div class=\"card-body px-0\">\r\n <div class=\"flex-column align-items-start\">\r\n <div class=\"row\">\r\n <div class=\"col-md-4 border-val mx-3 mb-7 py-7\" *ngFor=\"let obj of roles\">\r\n\r\n <a *ngIf=\"obj.roleName ==='superadmin'\" class=\"role-title my-2 cursor-pointer\" >Super Admin</a>\r\n <a *ngIf=\"obj.roleName !=='superadmin'\" class=\"role-title my-2 cursor-pointer\">{{obj.roleName |\r\n titlecase}}</a> \r\n <div *ngIf=\"obj.roleName ==='superadmin'\" class=\"sub-title fw-semibold my-5\">Oversees all the operations and controls the entire functionality of the dashboard</div>\r\n <div *ngIf=\"obj.roleName ==='admin'\" class=\"sub-title fw-semibold my-5\">Manages specific operations, permissions, and can change setting for assigned locations</div>\r\n <div *ngIf=\"obj.roleName ==='user'\" class=\"sub-title fw-semibold my-5\">Access to specific location and will be able to view dashboard</div>\r\n <div><span class=\"me-5\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"25\" height=\"24\"\r\n viewBox=\"0 0 25 24\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_1973_14308)\">\r\n <path\r\n d=\"M17.5 21V19C17.5 17.9391 17.0786 16.9217 16.3284 16.1716C15.5783 15.4214 14.5609 15 13.5 15H5.5C4.43913 15 3.42172 15.4214 2.67157 16.1716C1.92143 16.9217 1.5 17.9391 1.5 19V21M23.5 21V19C23.4993 18.1137 23.2044 17.2528 22.6614 16.5523C22.1184 15.8519 21.3581 15.3516 20.5 15.13M16.5 3.13C17.3604 3.3503 18.123 3.8507 18.6676 4.55231C19.2122 5.25392 19.5078 6.11683 19.5078 7.005C19.5078 7.89317 19.2122 8.75608 18.6676 9.45769C18.123 10.1593 17.3604 10.6597 16.5 10.88M13.5 7C13.5 9.20914 11.7091 11 9.5 11C7.29086 11 5.5 9.20914 5.5 7C5.5 4.79086 7.29086 3 9.5 3C11.7091 3 13.5 4.79086 13.5 7Z\"\r\n stroke=\"#667085\" stroke-width=\"2\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_1973_14308\">\r\n <rect width=\"24\" height=\"24\" fill=\"white\" transform=\"translate(0.5)\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n <span class=\"uses-list fw-semibold\">{{obj?.count || 0}} Members</span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div> -->\r\n\r\n<!--begin::Row-->\r\n<div *ngIf=\"receivedData ==='Role Value'\" class=\"row gx-5 gx-xl-10\">\r\n <!--begin::Col-->\r\n <div class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12\">\r\n <lib-roles-permission-table (dataEvent)=\"receiveData($event)\"></lib-roles-permission-table>\r\n </div>\r\n <!--end::Col-->\r\n</div>\r\n<!--end::Row-->\r\n\r\n<ng-template #bulkUpload let-modal>\r\n <div class=\"card-body flex-column p-9\">\r\n <div class=\"header-title\">Bulk Assign</div>\r\n <div class=\"d-flex justify-content-start align-items-center\">\r\n <div class=\"fw-bold text-gray-500 mt-6\">\r\n <ol class=\"custom-ordered-list text-gray-400 fw-bold px-5 fs-6\">\r\n <li class=\"user-text\">Use the template to upload multiple stores at once.</li>\r\n <li class=\"user-text my-3\"><span class=\"user-text\">Download the template here - </span>\r\n <a class=\"ms-1\" href=\"../../../assets/files/BulkAssignTemplate.xlsx\" 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 class=\"user-text my-3\">Add your data to the Template File</li>\r\n \r\n </ol>\r\n </div>\r\n </div>\r\n <div class=\" w-100 right-bar d-flex justify-content-center align-items-center flex-column\" >\r\n <input name=\"accountType\" type=\"radio\" id=\"kt_create_account_form_account_type_personal1\" value=\"personal1\"\r\n class=\"btn-check\"\r\n (change)=\"onUpload1($event)\"\r\n ng-reflect-value=\"personal\" type=\"file\" #inputFile1 />\r\n <label for=\"kt_create_account_form_account_type_personal1\" class=\" w-1-0 p-4\"><span\r\n class=\"fw-bold text-center w-100 fs-4\">\r\n <div class=\"d-flex justify-content-center align-items-center w-100\">\r\n <svg width=\"46\" height=\"46\" viewBox=\"0 0 46 46\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"3\" y=\"3\" width=\"40\" height=\"40\" rx=\"20\" fill=\"#F2F4F7\" />\r\n <rect x=\"3\" y=\"3\" width=\"40\" height=\"40\" rx=\"20\" stroke=\"#F9FAFB\"\r\n stroke-width=\"6\" />\r\n <g clip-path=\"url(#clip0_4047_40566)\">\r\n <path\r\n d=\"M26.3333 26.3334L23 23M23 23L19.6666 26.3334M23 23V30.5M29.9916 28.325C30.8044 27.8819 31.4465 27.1808 31.8165 26.3322C32.1866 25.4837 32.2635 24.5361 32.0351 23.6389C31.8068 22.7418 31.2862 21.9463 30.5555 21.3779C29.8248 20.8095 28.9257 20.5006 28 20.5H26.95C26.6977 19.5244 26.2276 18.6186 25.5749 17.8509C24.9222 17.0831 24.104 16.4732 23.1817 16.0672C22.2594 15.6612 21.2571 15.4695 20.2501 15.5066C19.243 15.5437 18.2575 15.8086 17.3676 16.2814C16.4777 16.7542 15.7066 17.4226 15.1122 18.2363C14.5177 19.0501 14.1155 19.988 13.9358 20.9795C13.756 21.9711 13.8034 22.9905 14.0743 23.9611C14.3452 24.9317 14.8327 25.8282 15.5 26.5834\"\r\n stroke=\"#475467\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_4047_40566\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\"\r\n transform=\"translate(13 13)\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </div>\r\n <div class=\"nodata-title mb-3\"><span class=\"click-upload cursor-pointer\">Click to\r\n upload</span>\r\n <!-- <span class=\"ms-2\">or drag and drop</span> -->\r\n </div>\r\n <div class=\"nodata-sub\">the data added template file for processing.</div>\r\n </span>\r\n </label>\r\n </div>\r\n <div class=\"w-100 d-flex justify-content-between mt-5\">\r\n <button class=\"btn btn-default btn-outline w-50 me-2\" (click)=\"modal.close()\"> Cancel\r\n </button>\r\n <button class=\"btn btn-default btn-primary w-50 ms-2\" (click)=\"modal.close()\"> Submit\r\n </button> \r\n </div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #afterValidation let-model>\r\n <div class=\"card border-0\">\r\n <div class=\"card-header border-0 mt-0\">\r\n <div class=\"card-title mt-3\"><span class=\"config-heading fw-semibold w-auto\">Bulk Assign</span></div>\r\n </div>\r\n <div class=\"card-body pt-0\">\r\n <div class=\"row\">\r\n <div class=\"col-sm-4\">\r\n <div class=\"popup-card rounded-3 p-3 flex-column h-70px\">\r\n <div class=\"fw-semibold config-heading w-100\">{{getStoreCounts(excelData)}}</div>\r\n <div class=\"fw-semibold subtitle mt-1\">Total Records</div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-4\">\r\n <div class=\"popup-card rounded-3 p-3 flex-column h-70px\">\r\n <div class=\"fw-semibold config-heading w-100\">{{excelData?.length}}</div>\r\n <div class=\"fw-semibold subtitle mt-1\">Rows processed</div>\r\n </div>\r\n </div>\r\n <div class=\"col-sm-4\">\r\n <div class=\"popup-card rounded-3 p-3 flex-column h-70px\">\r\n <div [ngClass]=\"excelError ? 'error-heading':''\" class=\"fw-semibold config-heading w-100\">{{excelError?.error?.length || 0}}</div>\r\n <div [ngClass]=\"excelError ? 'excel-error':''\" class=\"fw-semibold subtitle mt-1\">Error</div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!excelError\" class=\"table-header mt-5\" style=\"font-weight: 400;\">\r\n <div >You're about to assign {{getStoreCounts(excelData)}} {{getStoreCounts(excelData) > 1 ? 'Stores' : 'Store'}}. Are you sure want to proceed?</div>\r\n \r\n </div>\r\n <div *ngIf=\"excelError\" class=\"flex-column mt-5\">\r\n <div class=\"config-heading fw-bold\">Invalid Details !</div>\r\n <div class=\"subtitle mt-5\">Please provide correct information.</div>\r\n <div class=\"p-5 w-100 rounded-3 border-error mt-5 flex-column\">\r\n <div *ngFor=\"let error of excelError?.error; let i = index; let last = last\" [ngClass]=\"!last ? 'mb-2' : ''\" class=\"text-error\">{{i + 1}}) {{error}}</div>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n <div class=\"card-footer border-0 text-end pt-0\">\r\n <button class=\"btn btn-md btn-default btn-outline\" (click)=\"closeactivepopup()\">Cancel</button>\r\n <button *ngIf=\"!excelError\" class=\"btn btn-md py-3 btn-default ms-3 btn-primary\" (click)=\"proceedSubmit()\">Proceed</button>\r\n <button *ngIf=\"excelError\" class=\"btn py-3 btn-md btn-default ms-3 btn-danger\" (click)=\"file1.click();\">Reupload</button>\r\n <input style=\"visibility: hidden;\" #file1 type=\"file\" id=\"kt_account_team_size_select_2\"\r\n (change)=\"onUpload1($event)\" />\r\n </div>\r\n </div>\r\n</ng-template>\r\n", styles: [".border-val{color:var(--Gray-700, #344054)!important;font-family:Inter;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}.table-title-primary{color:var(--Primary-700, #009BF3)!important;font-weight:500!important}.table-sub{line-height:30px!important;color:var(--Gray-500, #667085)!important}td{padding:16px 24px!important;line-height:36px!important}.img-src{width:25%;height:20%}.border-val{padding:10px;border-radius:12px;border:1px solid var(--Gray-200, #EAECF0);background:#fff;box-shadow:0 0 20px #4c577d05}.role-title{color:var(--Primary-600, #344054);font-size:16px;font-weight:600;line-height:24px}.col-md-4{width:31%!important}.user-list{color:var(--Gray-700, #344054);font-size:16px;line-height:24px}.rotate{rotate:180deg;transition:1s}.p-4{padding:.85rem!important}.inputcheck input[type=checkbox]{width:18px!important;height:18px!important;margin:0;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}.inputcheck input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}.inputcheck 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!important;padding-top:12px;padding-right:6px}table th{border-bottom:1px solid var(--Gray-200, #EAECF0)!important;background:var(--Gray-50, #F9FAFB)!important;color:var(--Gray-500, #667085)!important;font-size:12px!important;font-weight:500!important;line-height:0px!important}.rightcorner{position:absolute;top:10px;right:16px;font-size:18px}.user-text{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:400!important;line-height:20px}.right-bar{border-radius:8px;border:1px solid var(--Gray-300, #D0D5DD)}.click-upload{color:var(--Primary-700, #009BF3)!important;font-size:14px!important;font-weight:600!important;line-height:20px;text-decoration-line:underline;text-transform:capitalize}.header-title{color:var(--Gray-900, #101828);font-size:18px;font-weight:600;line-height:28px}.subtitle{color:var(--Gray-500, #667085);font-size:14px;font-weight:400;line-height:20px}.config-heading{color:var(--Gray-900, #101828);font-size:18px;font-weight:600;line-height:28px}.table-header{color:var(--Gray-800, #1D2939);font-size:16px;font-weight:400;line-height:24px}.text-error{color:var(--Error-700, #B42318)!important;font-size:14px;font-weight:500;line-height:20px}.excel-error{color:var(--Error-600, #D92D20);font-size:14px;font-weight:500;line-height:20px}.error-heading{color:var(--Error-600, #D92D20);font-size:20px;font-weight:500;line-height:30px}.border-error{border:1px solid var(--Error-300, #FDA29B)!important;background:var(--Error-25, #FFFBFA)!important}.popup-card{border-radius:6px;border:1px solid var(--Gray-300, #D0D5DD);background:#fff;box-shadow:0 1px 3px #1018281a,0 1px 2px #1018280f}\n"] }]
|
|
3285
3870
|
}], ctorParameters: () => [{ type: i1$1.NgbModal }, { type: i2.PageInfoService }, { type: i0.ChangeDetectorRef }, { type: ExcelService }, { type: i2.GlobalStateService }, { type: i4.ToastService }, { type: UserService }], propDecorators: { dataToParent: [{
|
|
3286
3871
|
type: Output
|
|
3872
|
+
}], bulkUpload: [{
|
|
3873
|
+
type: ViewChild,
|
|
3874
|
+
args: ['bulkUpload']
|
|
3875
|
+
}], inputFile1: [{
|
|
3876
|
+
type: ViewChild,
|
|
3877
|
+
args: ["inputFile1"]
|
|
3878
|
+
}], afterValidation: [{
|
|
3879
|
+
type: ViewChild,
|
|
3880
|
+
args: ['afterValidation']
|
|
3287
3881
|
}] } });
|
|
3288
3882
|
|
|
3289
3883
|
class UsersListComponent {
|
|
@@ -3457,10 +4051,10 @@ class UsersListComponent {
|
|
|
3457
4051
|
this.userCount = data; // Store data from the child
|
|
3458
4052
|
this.dataToParent.emit(this.userCount);
|
|
3459
4053
|
}
|
|
3460
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
3461
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
4054
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: UsersListComponent, deps: [{ token: i4.ToastService }, { token: i2$1.Router }, { token: i1$1.NgbModal }, { token: UserService }], target: i0.ɵɵFactoryTarget.Component });
|
|
4055
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: UsersListComponent, selector: "lib-users-list", outputs: { dataToParent: "dataToParent" }, viewQueries: [{ propertyName: "inputFile", first: true, predicate: ["inputFile"], descendants: true }], ngImport: i0, template: "\r\n <div *ngIf=\"userListData === 0\" class=\"card-body d-flex flex-center flex-column p-9\">\r\n \r\n <div class=\"my-5\">\r\n <div class=\"symbol symbol-75px symbol-circle\">\r\n <svg width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#D1FADF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#ECFDF3\" stroke-width=\"8\" />\r\n <path\r\n d=\"M28 24V32M24 28H32M38 28C38 33.5228 33.5228 38 28 38C22.4772 38 18 33.5228 18 28C18 22.4772 22.4772 18 28 18C33.5228 18 38 22.4772 38 28Z\"\r\n stroke=\"#039855\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </div>\r\n </div>\r\n \r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bolder mb-0 title cursor-pointer\"> Upload to add users </a>\r\n \r\n <div class=\"fw-bold text-gray-500 my-6\">\r\n <ul class=\"text-gray-400 fw-bold fs-6\">\r\n <!-- <li class=\"user-text\">Use the template to upload multiple users at once.</li> -->\r\n <li class=\"user-text my-3\"><span class=\"user-text\">Download the template here - </span>\r\n <a class=\"ms-1\" href=\"../../../assets/files/UsersTemplate.xlsx\" 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 class=\"user-text my-3\">Add your data to the Template File</li>\r\n <li class=\"user-text my-3\">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\">\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\" viewBox=\"0 0 21 20\"\r\n 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 class=\"mx-2 single-user fw-bold\">Add Single User</span></span></label>\r\n \r\n </div>\r\n </div>\r\n\r\n<lib-brand-user *ngIf=\"userListData !== 0\" (dataToParent)=\"receiveData($event)\"></lib-brand-user>\r\n", styles: [".user-text{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:400!important;line-height:20px}.template{color:var(--Primary-700, #009BF3)!important;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize}td{padding:16px 24px!important;line-height:36px!important}.inputcheck input[type=checkbox]{width:20px!important;height:20px!important;margin:2px;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}.inputcheck input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}.inputcheck 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!important;padding-top:12px;padding-right:6px}\n"], dependencies: [{ kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: BrandUserComponent, selector: "lib-brand-user", outputs: ["dataToParent"] }] });
|
|
3462
4056
|
}
|
|
3463
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
4057
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: UsersListComponent, decorators: [{
|
|
3464
4058
|
type: Component,
|
|
3465
4059
|
args: [{ selector: 'lib-users-list', template: "\r\n <div *ngIf=\"userListData === 0\" class=\"card-body d-flex flex-center flex-column p-9\">\r\n \r\n <div class=\"my-5\">\r\n <div class=\"symbol symbol-75px symbol-circle\">\r\n <svg width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#D1FADF\" />\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#ECFDF3\" stroke-width=\"8\" />\r\n <path\r\n d=\"M28 24V32M24 28H32M38 28C38 33.5228 33.5228 38 28 38C22.4772 38 18 33.5228 18 28C18 22.4772 22.4772 18 28 18C33.5228 18 38 22.4772 38 28Z\"\r\n stroke=\"#039855\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </div>\r\n </div>\r\n \r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bolder mb-0 title cursor-pointer\"> Upload to add users </a>\r\n \r\n <div class=\"fw-bold text-gray-500 my-6\">\r\n <ul class=\"text-gray-400 fw-bold fs-6\">\r\n <!-- <li class=\"user-text\">Use the template to upload multiple users at once.</li> -->\r\n <li class=\"user-text my-3\"><span class=\"user-text\">Download the template here - </span>\r\n <a class=\"ms-1\" href=\"../../../assets/files/UsersTemplate.xlsx\" 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 class=\"user-text my-3\">Add your data to the Template File</li>\r\n <li class=\"user-text my-3\">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\">\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\" viewBox=\"0 0 21 20\"\r\n 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 class=\"mx-2 single-user fw-bold\">Add Single User</span></span></label>\r\n \r\n </div>\r\n </div>\r\n\r\n<lib-brand-user *ngIf=\"userListData !== 0\" (dataToParent)=\"receiveData($event)\"></lib-brand-user>\r\n", styles: [".user-text{color:var(--Gray-700, #344054)!important;font-size:14px!important;font-weight:400!important;line-height:20px}.template{color:var(--Primary-700, #009BF3)!important;font-size:14px!important;font-weight:600;line-height:20px;text-transform:capitalize}td{padding:16px 24px!important;line-height:36px!important}.inputcheck input[type=checkbox]{width:20px!important;height:20px!important;margin:2px;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}.inputcheck input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}.inputcheck 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!important;padding-top:12px;padding-right:6px}\n"] }]
|
|
3466
4060
|
}], ctorParameters: () => [{ type: i4.ToastService }, { type: i2$1.Router }, { type: i1$1.NgbModal }, { type: UserService }], propDecorators: { inputFile: [{
|
|
@@ -3484,10 +4078,10 @@ class ActionPopupComponent {
|
|
|
3484
4078
|
onSubmit() {
|
|
3485
4079
|
this.activeModal.close('submit');
|
|
3486
4080
|
}
|
|
3487
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
3488
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
4081
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ActionPopupComponent, deps: [{ token: i1$1.NgbActiveModal }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
4082
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: ActionPopupComponent, selector: "lib-action-popup", inputs: { teamData: "teamData" }, ngImport: i0, template: "<div class=\"card group-delete py-0\">\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 <svg width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#FEE4E2\"/>\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#FEF3F2\" stroke-width=\"8\"/>\r\n <path d=\"M28 24V28M28 32H28.01M38 28C38 33.5228 33.5228 38 28 38C22.4772 38 18 33.5228 18 28C18 22.4772 22.4772 18 28 18C33.5228 18 38 22.4772 38 28Z\" stroke=\"#D92D20\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg>\r\n \r\n </div>\r\n </div>\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Delete {{teamData?.teamName}} team?</a>\r\n <span class=\"sub-title fw-normal mt-2\">Are you sure you want to delete this team? This action cannot be undone.</span>\r\n\r\n <div class=\"mt-5 w-100\">\r\n <div role=\"group\" class=\"d-flex mt-3 mb-15\">\r\n <button class=\"btn btn-outline w-100 me-3\" (click)=\"cancel()\">Cancel</button>\r\n <button id=\"alert-toast\" class=\"btn btn-danger w-100 ms-3\" (click)=\"onSubmit()\">Delete</button> \r\n </div>\r\n </div>\r\n\r\n </div>\r\n</div>", styles: [".sub-title{font-size:14px!important}\n"] });
|
|
3489
4083
|
}
|
|
3490
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
4084
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ActionPopupComponent, decorators: [{
|
|
3491
4085
|
type: Component,
|
|
3492
4086
|
args: [{ selector: 'lib-action-popup', template: "<div class=\"card group-delete py-0\">\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 <svg width=\"56\" height=\"56\" viewBox=\"0 0 56 56\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#FEE4E2\"/>\r\n <rect x=\"4\" y=\"4\" width=\"48\" height=\"48\" rx=\"24\" stroke=\"#FEF3F2\" stroke-width=\"8\"/>\r\n <path d=\"M28 24V28M28 32H28.01M38 28C38 33.5228 33.5228 38 28 38C22.4772 38 18 33.5228 18 28C18 22.4772 22.4772 18 28 18C33.5228 18 38 22.4772 38 28Z\" stroke=\"#D92D20\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n </svg>\r\n \r\n </div>\r\n </div>\r\n <a class=\"fs-4 text-gray-800 text-hover-primary fw-bold mb-0 title cursor-pointer\">Delete {{teamData?.teamName}} team?</a>\r\n <span class=\"sub-title fw-normal mt-2\">Are you sure you want to delete this team? This action cannot be undone.</span>\r\n\r\n <div class=\"mt-5 w-100\">\r\n <div role=\"group\" class=\"d-flex mt-3 mb-15\">\r\n <button class=\"btn btn-outline w-100 me-3\" (click)=\"cancel()\">Cancel</button>\r\n <button id=\"alert-toast\" class=\"btn btn-danger w-100 ms-3\" (click)=\"onSubmit()\">Delete</button> \r\n </div>\r\n </div>\r\n\r\n </div>\r\n</div>", styles: [".sub-title{font-size:14px!important}\n"] }]
|
|
3493
4087
|
}], ctorParameters: () => [{ type: i1$1.NgbActiveModal }, { type: i0.ChangeDetectorRef }], propDecorators: { teamData: [{
|
|
@@ -3530,7 +4124,9 @@ class ViewteamsListComponent {
|
|
|
3530
4124
|
this.excelService = excelService;
|
|
3531
4125
|
this.modalService = modalService;
|
|
3532
4126
|
}
|
|
4127
|
+
users;
|
|
3533
4128
|
ngOnInit() {
|
|
4129
|
+
this.users = JSON.parse(localStorage.getItem('user-info') || '{}');
|
|
3534
4130
|
this.gs?.dataRangeValue?.pipe(takeUntil(this.destroy$))?.subscribe({
|
|
3535
4131
|
next: (data) => {
|
|
3536
4132
|
if (data === null) {
|
|
@@ -3566,6 +4162,27 @@ class ViewteamsListComponent {
|
|
|
3566
4162
|
}
|
|
3567
4163
|
});
|
|
3568
4164
|
}
|
|
4165
|
+
getMaskedValue(value, role) {
|
|
4166
|
+
if (role === 'superadmin')
|
|
4167
|
+
return value;
|
|
4168
|
+
if (!value || !value.includes('@'))
|
|
4169
|
+
return '';
|
|
4170
|
+
const [local, domain] = value.split('@');
|
|
4171
|
+
const visibleLength = Math.min(3, local.length);
|
|
4172
|
+
const visiblePart = local.slice(0, visibleLength);
|
|
4173
|
+
const maskedPart = '*'.repeat(local.length - visibleLength);
|
|
4174
|
+
return `${visiblePart}${maskedPart}@${domain}`;
|
|
4175
|
+
}
|
|
4176
|
+
getMaskedMobile(value, role) {
|
|
4177
|
+
if (role === 'superadmin')
|
|
4178
|
+
return value;
|
|
4179
|
+
if (!value || value.length <= 4)
|
|
4180
|
+
return '*'.repeat(value.length);
|
|
4181
|
+
const first2 = value.slice(0, 2);
|
|
4182
|
+
const last2 = value.slice(-2);
|
|
4183
|
+
const maskedMiddle = '*'.repeat(value.length - 4);
|
|
4184
|
+
return `${first2}${maskedMiddle}${last2}`;
|
|
4185
|
+
}
|
|
3569
4186
|
exportXLSX() {
|
|
3570
4187
|
let obj = {
|
|
3571
4188
|
clientId: this.$headerFilters.client,
|
|
@@ -3781,12 +4398,12 @@ class ViewteamsListComponent {
|
|
|
3781
4398
|
modalRef.result.then((result) => {
|
|
3782
4399
|
});
|
|
3783
4400
|
}
|
|
3784
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
3785
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: ViewteamsListComponent, selector: "lib-viewteams-list", inputs: { teamData: "teamData" }, ngImport: i0, template: "<div *ngIf=\"viewTeams\" class=\"card border-0 p-5\">\r\n <div class=\"card-header border-0 px-0\">\r\n <h3 class=\"card-title align-items-start d-flex align-items-center\">\r\n <span class=\"cursor-pointer\" (click)=\"backteamsList()\"> <svg width=\"48\" height=\"48\" viewBox=\"0 0 48 48\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <g filter=\"url(#filter0_d_1029_22185)\">\r\n <rect x=\"2\" y=\"1\" width=\"44\" height=\"44\" rx=\"8\" fill=\"white\" />\r\n <rect x=\"2.5\" y=\"1.5\" width=\"43\" height=\"43\" rx=\"7.5\" stroke=\"#D0D5DD\" />\r\n <path d=\"M29.8334 22.9998H18.1667M18.1667 22.9998L24 28.8332M18.1667 22.9998L24 17.1665\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <filter id=\"filter0_d_1029_22185\" x=\"0\" y=\"0\" width=\"48\" height=\"48\"\r\n filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\">\r\n <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\r\n <feColorMatrix in=\"SourceAlpha\" type=\"matrix\"\r\n values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\" result=\"hardAlpha\" />\r\n <feOffset dy=\"1\" />\r\n <feGaussianBlur stdDeviation=\"1\" />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.05 0\" />\r\n <feBlend mode=\"normal\" in2=\"BackgroundImageFix\" result=\"effect1_dropShadow_1029_22185\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect1_dropShadow_1029_22185\"\r\n result=\"shape\" />\r\n </filter>\r\n </defs>\r\n </svg></span>\r\n <div class=\"ms-3\">\r\n <div class=\"card-label mb-2\">{{teamData?.teamName}}</div>\r\n <div class=\"text-sub mb-2\">{{pagination?.totalCount ? pagination?.totalCount :'0'}} total users</div>\r\n </div>\r\n </h3>\r\n <div class=\"card-toolbar\">\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\"></rect>\r\n <path\r\n d=\"M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z\"\r\n fill=\"currentColor\"></path>\r\n </svg>\r\n </span>\r\n <input type=\"text\" (change)=\"searchData()\" [(ngModel)]=\"searchValue\" class=\"form-control ps-14 me-2\"\r\n name=\"search\" autocomplete=\"off\" placeholder=\"Search\" autocomplete=\"off\" />\r\n <lib-filters [dataObject]=\"dataObject\" (appliedFilters)=\"applyFilters($event)\"></lib-filters>\r\n\r\n <button *ngIf=\"!loading && !noData\" type=\"button\"\r\n (click)=\"exportXLSX()\"\r\n class=\"btn btn-default mx-2 btn-outline p-4 btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n 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.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2\">Export</span> </button>\r\n <button *ngIf=\"!loading && !noData && (gs.userAccess |async)?.Global_User_isEdit\" class=\"btn btn-primary w-100 ms-3\" id=\"alert-toast\" \r\n (click)=\"Configure()\">Configure</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"border-0 px-0 d-flex\" *ngIf=\"leadData?.length\">\r\n <div class=\"d-flex mt-5 mx-5 w-100 overflow-auto\">\r\n <div class=\"p-3 pt-7 text-nowrap\">\r\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <g id=\"users\">\r\n <path id=\"Icon\"\r\n d=\"M17 21V19C17 17.9391 16.5786 16.9217 15.8284 16.1716C15.0783 15.4214 14.0609 15 13 15H5C3.93913 15 2.92172 15.4214 2.17157 16.1716C1.42143 16.9217 1 17.9391 1 19V21M23 21V19C22.9993 18.1137 22.7044 17.2528 22.1614 16.5523C21.6184 15.8519 20.8581 15.3516 20 15.13M16 3.13C16.8604 3.3503 17.623 3.8507 18.1676 4.55231C18.7122 5.25392 19.0078 6.11683 19.0078 7.005C19.0078 7.89317 18.7122 8.75608 18.1676 9.45769C17.623 10.1593 16.8604 10.6597 16 10.88M13 7C13 9.20914 11.2091 11 9 11C6.79086 11 5 9.20914 5 7C5 4.79086 6.79086 3 9 3C11.2091 3 13 4.79086 13 7Z\"\r\n stroke=\"#667085\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n </svg>\r\n <span class=\"heading ms-2\">Lead By</span>\r\n </div>\r\n <div class=\"btn btn-default btn-outline btn-outline-default rounded-3 text-nowrap border-val1 ms-4\"\r\n *ngFor=\"let obj of leadData\">\r\n <span class=\"heading \">{{obj.userName}}</span>\r\n <span *ngIf=\"obj?.role\" class=\"blue-badge ms-2\">{{obj?.role | titlecase}}</span>\r\n <div class=\"sub-header mt-2\">{{obj.email}}</div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n\r\n <div *ngIf=\"!loading && !noData\" class=\"card-body p-0 mt-10\">\r\n <div class=\"table-responsive\">\r\n <table class=\"table bottom-border text-nowrap \">\r\n <thead>\r\n <tr>\r\n <!-- <th class=\"cursor-pointer\"><span class=\"inputcheck\"><input type=\"checkbox\"\r\n class=\"cursor-pointer\"></span>\r\n\r\n </th> -->\r\n <th class=\"cursor-pointer\" (click)=\"onSort('userName')\">Username\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'userName' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'userName' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('email')\">Email\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'email' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'email' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('mobileNumber')\">Contact Number\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'mobileNumber' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'mobileNumber' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('role')\">Roles\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'role' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'role' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('assignedStores')\">Stores Assigned\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'assignedStores' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'assignedStores' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('clusterCount')\">Clusters\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'clusterCount' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'clusterCount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('teamCount')\">Teams\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'teamCount' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'teamCount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th style=\"line-height: 21px !important;\">Actions</th>\r\n <!-- <th class=\"cursor-pointer\" (click)=\"onSort('description')\">Assigned Type\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'description' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'description' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th> -->\r\n <!-- <th style=\"line-height: 21px !important;\">Actions</th> -->\r\n </tr>\r\n </thead>\r\n <tbody class=\"fw-semibold\">\r\n <ng-container *ngFor=\"let user of viewteamsList;let i=index;\">\r\n <tr>\r\n <!-- <td><span class=\"inputcheck\"><input type=\"checkbox\" class=\"cursor-pointer mt-2\"></span></td> -->\r\n <td>{{user?.userName}}</td>\r\n <td>{{user?.email}}</td>\r\n <td>{{user?.mobileNumber}}</td>\r\n <td>{{user?.role |titlecase}}</td>\r\n <td>{{user?.assignedStores}}</td>\r\n <td>{{user?.clusterCount}}</td>\r\n <td>{{user?.teamCount}}</td>\r\n <td>\r\n <div class=\"d-flex\" (click)=\"Viewusers('view',user)\">\r\n <span class=\"cursor-pointer\">\r\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <g id=\"eye\">\r\n <g id=\"Icon\">\r\n <path\r\n d=\"M0.833374 10C0.833374 10 4.16671 3.33334 10 3.33334C15.8334 3.33334 19.1667 10 19.1667 10C19.1667 10 15.8334 16.6667 10 16.6667C4.16671 16.6667 0.833374 10 0.833374 10Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10 12.5C11.3808 12.5 12.5 11.3807 12.5 10C12.5 8.6193 11.3808 7.50001 10 7.50001C8.61933 7.50001 7.50004 8.6193 7.50004 10C7.50004 11.3807 8.61933 12.5 10 12.5Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n </g>\r\n </svg>\r\n\r\n </span>\r\n </div>\r\n </td>\r\n <!-- <td>store</td> -->\r\n <!-- <td>\r\n <span class=\"me-3 cursor-pointer\">\r\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <g id=\"eye\">\r\n <g id=\"Icon\">\r\n <path\r\n d=\"M0.833374 10.0002C0.833374 10.0002 4.16671 3.3335 10 3.3335C15.8334 3.3335 19.1667 10.0002 19.1667 10.0002C19.1667 10.0002 15.8334 16.6668 10 16.6668C4.16671 16.6668 0.833374 10.0002 0.833374 10.0002Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10 12.5002C11.3808 12.5002 12.5 11.3809 12.5 10.0002C12.5 8.61945 11.3808 7.50016 10 7.50016C8.61933 7.50016 7.50004 8.61945 7.50004 10.0002C7.50004 11.3809 8.61933 12.5002 10 12.5002Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n </g>\r\n </svg>\r\n </span>\r\n\r\n </td> -->\r\n </tr>\r\n </ng-container>\r\n\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12 my-3\">\r\n <lib-pagination *ngIf=\"viewteamsList.length!==0\" [itemsPerPage]=\"pagination.limit\"\r\n [currentPage]=\"pagination.offset\" [totalItems]=\"pagination.totalCount\" [paginationSizes]=\"paginationSizes\"\r\n [pageSize]=\"paginationSize()\" (pageChange)=\"onPageChange($event)\"\r\n (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n <!-- <div *ngIf=\"loading\" class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer mb-10\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"noData\" class=\"row \">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-src\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div> -->\r\n</div>", styles: [".img-src{width:25%;height:20%}.inputcheck input[type=checkbox]{width:18px!important;height:18px!important;margin:0;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}.inputcheck input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}.inputcheck 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!important;padding-top:12px;padding-right:6px}.heading{color:var(--Gray-700, #344054);font-family:Inter;font-size:16px;font-style:normal;font-weight:600;line-height:24px}.sub-header{color:var(--Gray-500, #667085);text-align:left;font-family:Inter;font-size:12px;font-style:normal;font-weight:500;line-height:18px}.bg-colr{background-color:#f2f4f7}table th{border-bottom:1px solid var(--Gray-200, #EAECF0)!important;background:var(--Gray-50, #F9FAFB)!important;color:var(--Gray-500, #667085)!important;font-size:12px!important;font-weight:500!important;line-height:0px!important}.rotate{rotate:180deg;transition:1s}.overflow-auto{overflow-x:auto}.blue-badge{color:#009bf3;font-size:12px;font-weight:500;line-height:18px;border-radius:16px;background:#eaf8ff;padding:2px 8px}.border-val1{cursor:auto}\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: i3.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.PaginationComponent, selector: "lib-pagination", inputs: ["collection", "itemsPerPage", "currentPage", "totalItems", "directionLinks", "pageSize", "paginationSizes"], outputs: ["pageChange", "pageSizeChange"] }, { kind: "component", type: i4.FiltersComponent, selector: "lib-filters", inputs: ["dataObject"], outputs: ["appliedFilters"] }, { kind: "pipe", type: i6.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.TitleCasePipe, name: "titlecase" }] });
|
|
4401
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ViewteamsListComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: ManageUsersService }, { token: i2.GlobalStateService }, { token: ExcelService }, { token: i1$1.NgbModal }], target: i0.ɵɵFactoryTarget.Component });
|
|
4402
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: ViewteamsListComponent, selector: "lib-viewteams-list", inputs: { teamData: "teamData" }, ngImport: i0, template: "<div *ngIf=\"viewTeams\" class=\"card border-0 p-5\">\r\n <div class=\"card-header border-0 px-0\">\r\n <h3 class=\"card-title align-items-start d-flex align-items-center\">\r\n <span class=\"cursor-pointer\" (click)=\"backteamsList()\"> <svg width=\"48\" height=\"48\" viewBox=\"0 0 48 48\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <g filter=\"url(#filter0_d_1029_22185)\">\r\n <rect x=\"2\" y=\"1\" width=\"44\" height=\"44\" rx=\"8\" fill=\"white\" />\r\n <rect x=\"2.5\" y=\"1.5\" width=\"43\" height=\"43\" rx=\"7.5\" stroke=\"#D0D5DD\" />\r\n <path d=\"M29.8334 22.9998H18.1667M18.1667 22.9998L24 28.8332M18.1667 22.9998L24 17.1665\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <filter id=\"filter0_d_1029_22185\" x=\"0\" y=\"0\" width=\"48\" height=\"48\"\r\n filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\">\r\n <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\r\n <feColorMatrix in=\"SourceAlpha\" type=\"matrix\"\r\n values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\" result=\"hardAlpha\" />\r\n <feOffset dy=\"1\" />\r\n <feGaussianBlur stdDeviation=\"1\" />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.05 0\" />\r\n <feBlend mode=\"normal\" in2=\"BackgroundImageFix\" result=\"effect1_dropShadow_1029_22185\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect1_dropShadow_1029_22185\"\r\n result=\"shape\" />\r\n </filter>\r\n </defs>\r\n </svg></span>\r\n <div class=\"ms-3\">\r\n <div class=\"card-label mb-2\">{{teamData?.teamName}}</div>\r\n <div class=\"text-sub mb-2\">{{pagination?.totalCount ? pagination?.totalCount :'0'}} total users</div>\r\n </div>\r\n </h3>\r\n <div class=\"card-toolbar\">\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\"></rect>\r\n <path\r\n d=\"M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z\"\r\n fill=\"currentColor\"></path>\r\n </svg>\r\n </span>\r\n <input type=\"text\" (change)=\"searchData()\" [(ngModel)]=\"searchValue\" class=\"form-control ps-14 me-2\"\r\n name=\"search\" autocomplete=\"off\" placeholder=\"Search\" autocomplete=\"off\" />\r\n <lib-filters [dataObject]=\"dataObject\" (appliedFilters)=\"applyFilters($event)\"></lib-filters>\r\n\r\n <button *ngIf=\"!loading && !noData\" type=\"button\"\r\n (click)=\"exportXLSX()\"\r\n class=\"btn btn-default mx-2 btn-outline p-4 btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n 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.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2\">Export</span> </button>\r\n <button *ngIf=\"!loading && !noData && (gs.userAccess |async)?.Global_User_isEdit\" class=\"btn btn-primary w-100 ms-3\" id=\"alert-toast\" \r\n (click)=\"Configure()\">Configure</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"border-0 px-0 d-flex\" *ngIf=\"leadData?.length\">\r\n <div class=\"d-flex mt-5 mx-5 w-100 overflow-auto\">\r\n <div class=\"p-3 pt-7 text-nowrap\">\r\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <g id=\"users\">\r\n <path id=\"Icon\"\r\n d=\"M17 21V19C17 17.9391 16.5786 16.9217 15.8284 16.1716C15.0783 15.4214 14.0609 15 13 15H5C3.93913 15 2.92172 15.4214 2.17157 16.1716C1.42143 16.9217 1 17.9391 1 19V21M23 21V19C22.9993 18.1137 22.7044 17.2528 22.1614 16.5523C21.6184 15.8519 20.8581 15.3516 20 15.13M16 3.13C16.8604 3.3503 17.623 3.8507 18.1676 4.55231C18.7122 5.25392 19.0078 6.11683 19.0078 7.005C19.0078 7.89317 18.7122 8.75608 18.1676 9.45769C17.623 10.1593 16.8604 10.6597 16 10.88M13 7C13 9.20914 11.2091 11 9 11C6.79086 11 5 9.20914 5 7C5 4.79086 6.79086 3 9 3C11.2091 3 13 4.79086 13 7Z\"\r\n stroke=\"#667085\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n </svg>\r\n <span class=\"heading ms-2\">Lead By</span>\r\n </div>\r\n <div class=\"btn btn-default btn-outline btn-outline-default rounded-3 text-nowrap border-val1 ms-4\"\r\n *ngFor=\"let obj of leadData\">\r\n <span class=\"heading \">{{obj.userName}}</span>\r\n <span *ngIf=\"obj?.role\" class=\"blue-badge ms-2\">{{obj?.role | titlecase}}</span>\r\n <div class=\"sub-header mt-2\">{{getMaskedValue(obj.email,users?.role)}}</div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n\r\n <div *ngIf=\"!loading && !noData\" class=\"card-body p-0 mt-10\">\r\n <div class=\"table-responsive\">\r\n <table class=\"table bottom-border text-nowrap \">\r\n <thead>\r\n <tr>\r\n <!-- <th class=\"cursor-pointer\"><span class=\"inputcheck\"><input type=\"checkbox\"\r\n class=\"cursor-pointer\"></span>\r\n\r\n </th> -->\r\n <th class=\"cursor-pointer\" (click)=\"onSort('userName')\">Username\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'userName' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'userName' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('email')\">Email\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'email' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'email' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('mobileNumber')\">Contact Number\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'mobileNumber' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'mobileNumber' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('role')\">Roles\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'role' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'role' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('assignedStores')\">Stores Assigned\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'assignedStores' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'assignedStores' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('clusterCount')\">Clusters\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'clusterCount' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'clusterCount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('teamCount')\">Teams\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'teamCount' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'teamCount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th style=\"line-height: 21px !important;\">Actions</th>\r\n <!-- <th class=\"cursor-pointer\" (click)=\"onSort('description')\">Assigned Type\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'description' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'description' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th> -->\r\n <!-- <th style=\"line-height: 21px !important;\">Actions</th> -->\r\n </tr>\r\n </thead>\r\n <tbody class=\"fw-semibold\">\r\n <ng-container *ngFor=\"let user of viewteamsList;let i=index;\">\r\n <tr>\r\n <!-- <td><span class=\"inputcheck\"><input type=\"checkbox\" class=\"cursor-pointer mt-2\"></span></td> -->\r\n <td>{{user?.userName}}</td>\r\n <td>{{getMaskedValue(user?.email,users.role)}}</td>\r\n <td>{{getMaskedMobile(user?.mobileNumber,users.role)}}</td>\r\n <td>{{user?.role |titlecase}}</td>\r\n <td>{{user?.assignedStores}}</td>\r\n <td>{{user?.clusterCount}}</td>\r\n <td>{{user?.teamCount}}</td>\r\n <td>\r\n <div class=\"d-flex\" (click)=\"Viewusers('view',user)\">\r\n <span class=\"cursor-pointer\">\r\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <g id=\"eye\">\r\n <g id=\"Icon\">\r\n <path\r\n d=\"M0.833374 10C0.833374 10 4.16671 3.33334 10 3.33334C15.8334 3.33334 19.1667 10 19.1667 10C19.1667 10 15.8334 16.6667 10 16.6667C4.16671 16.6667 0.833374 10 0.833374 10Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10 12.5C11.3808 12.5 12.5 11.3807 12.5 10C12.5 8.6193 11.3808 7.50001 10 7.50001C8.61933 7.50001 7.50004 8.6193 7.50004 10C7.50004 11.3807 8.61933 12.5 10 12.5Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n </g>\r\n </svg>\r\n\r\n </span>\r\n </div>\r\n </td>\r\n <!-- <td>store</td> -->\r\n <!-- <td>\r\n <span class=\"me-3 cursor-pointer\">\r\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <g id=\"eye\">\r\n <g id=\"Icon\">\r\n <path\r\n d=\"M0.833374 10.0002C0.833374 10.0002 4.16671 3.3335 10 3.3335C15.8334 3.3335 19.1667 10.0002 19.1667 10.0002C19.1667 10.0002 15.8334 16.6668 10 16.6668C4.16671 16.6668 0.833374 10.0002 0.833374 10.0002Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10 12.5002C11.3808 12.5002 12.5 11.3809 12.5 10.0002C12.5 8.61945 11.3808 7.50016 10 7.50016C8.61933 7.50016 7.50004 8.61945 7.50004 10.0002C7.50004 11.3809 8.61933 12.5002 10 12.5002Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n </g>\r\n </svg>\r\n </span>\r\n\r\n </td> -->\r\n </tr>\r\n </ng-container>\r\n\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12 my-3\">\r\n <lib-pagination *ngIf=\"viewteamsList.length!==0\" [itemsPerPage]=\"pagination.limit\"\r\n [currentPage]=\"pagination.offset\" [totalItems]=\"pagination.totalCount\" [paginationSizes]=\"paginationSizes\"\r\n [pageSize]=\"paginationSize()\" (pageChange)=\"onPageChange($event)\"\r\n (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n <!-- <div *ngIf=\"loading\" class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer mb-10\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"noData\" class=\"row \">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-src\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div> -->\r\n</div>", styles: [".img-src{width:25%;height:20%}.inputcheck input[type=checkbox]{width:18px!important;height:18px!important;margin:0;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}.inputcheck input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}.inputcheck 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!important;padding-top:12px;padding-right:6px}.heading{color:var(--Gray-700, #344054);font-family:Inter;font-size:16px;font-style:normal;font-weight:600;line-height:24px}.sub-header{color:var(--Gray-500, #667085);text-align:left;font-family:Inter;font-size:12px;font-style:normal;font-weight:500;line-height:18px}.bg-colr{background-color:#f2f4f7}table th{border-bottom:1px solid var(--Gray-200, #EAECF0)!important;background:var(--Gray-50, #F9FAFB)!important;color:var(--Gray-500, #667085)!important;font-size:12px!important;font-weight:500!important;line-height:0px!important}.rotate{rotate:180deg;transition:1s}.overflow-auto{overflow-x:auto}.blue-badge{color:#009bf3;font-size:12px;font-weight:500;line-height:18px;border-radius:16px;background:#eaf8ff;padding:2px 8px}.border-val1{cursor:auto}\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: i3.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.PaginationComponent, selector: "lib-pagination", inputs: ["collection", "itemsPerPage", "currentPage", "totalItems", "directionLinks", "pageSize", "paginationSizes"], outputs: ["pageChange", "pageSizeChange"] }, { kind: "component", type: i4.FiltersComponent, selector: "lib-filters", inputs: ["dataObject"], outputs: ["appliedFilters"] }, { kind: "pipe", type: i6.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.TitleCasePipe, name: "titlecase" }] });
|
|
3786
4403
|
}
|
|
3787
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
4404
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ViewteamsListComponent, decorators: [{
|
|
3788
4405
|
type: Component,
|
|
3789
|
-
args: [{ selector: 'lib-viewteams-list', template: "<div *ngIf=\"viewTeams\" class=\"card border-0 p-5\">\r\n <div class=\"card-header border-0 px-0\">\r\n <h3 class=\"card-title align-items-start d-flex align-items-center\">\r\n <span class=\"cursor-pointer\" (click)=\"backteamsList()\"> <svg width=\"48\" height=\"48\" viewBox=\"0 0 48 48\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <g filter=\"url(#filter0_d_1029_22185)\">\r\n <rect x=\"2\" y=\"1\" width=\"44\" height=\"44\" rx=\"8\" fill=\"white\" />\r\n <rect x=\"2.5\" y=\"1.5\" width=\"43\" height=\"43\" rx=\"7.5\" stroke=\"#D0D5DD\" />\r\n <path d=\"M29.8334 22.9998H18.1667M18.1667 22.9998L24 28.8332M18.1667 22.9998L24 17.1665\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <filter id=\"filter0_d_1029_22185\" x=\"0\" y=\"0\" width=\"48\" height=\"48\"\r\n filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\">\r\n <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\r\n <feColorMatrix in=\"SourceAlpha\" type=\"matrix\"\r\n values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\" result=\"hardAlpha\" />\r\n <feOffset dy=\"1\" />\r\n <feGaussianBlur stdDeviation=\"1\" />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.05 0\" />\r\n <feBlend mode=\"normal\" in2=\"BackgroundImageFix\" result=\"effect1_dropShadow_1029_22185\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect1_dropShadow_1029_22185\"\r\n result=\"shape\" />\r\n </filter>\r\n </defs>\r\n </svg></span>\r\n <div class=\"ms-3\">\r\n <div class=\"card-label mb-2\">{{teamData?.teamName}}</div>\r\n <div class=\"text-sub mb-2\">{{pagination?.totalCount ? pagination?.totalCount :'0'}} total users</div>\r\n </div>\r\n </h3>\r\n <div class=\"card-toolbar\">\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\"></rect>\r\n <path\r\n d=\"M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z\"\r\n fill=\"currentColor\"></path>\r\n </svg>\r\n </span>\r\n <input type=\"text\" (change)=\"searchData()\" [(ngModel)]=\"searchValue\" class=\"form-control ps-14 me-2\"\r\n name=\"search\" autocomplete=\"off\" placeholder=\"Search\" autocomplete=\"off\" />\r\n <lib-filters [dataObject]=\"dataObject\" (appliedFilters)=\"applyFilters($event)\"></lib-filters>\r\n\r\n <button *ngIf=\"!loading && !noData\" type=\"button\"\r\n (click)=\"exportXLSX()\"\r\n class=\"btn btn-default mx-2 btn-outline p-4 btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n 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.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2\">Export</span> </button>\r\n <button *ngIf=\"!loading && !noData && (gs.userAccess |async)?.Global_User_isEdit\" class=\"btn btn-primary w-100 ms-3\" id=\"alert-toast\" \r\n (click)=\"Configure()\">Configure</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"border-0 px-0 d-flex\" *ngIf=\"leadData?.length\">\r\n <div class=\"d-flex mt-5 mx-5 w-100 overflow-auto\">\r\n <div class=\"p-3 pt-7 text-nowrap\">\r\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <g id=\"users\">\r\n <path id=\"Icon\"\r\n d=\"M17 21V19C17 17.9391 16.5786 16.9217 15.8284 16.1716C15.0783 15.4214 14.0609 15 13 15H5C3.93913 15 2.92172 15.4214 2.17157 16.1716C1.42143 16.9217 1 17.9391 1 19V21M23 21V19C22.9993 18.1137 22.7044 17.2528 22.1614 16.5523C21.6184 15.8519 20.8581 15.3516 20 15.13M16 3.13C16.8604 3.3503 17.623 3.8507 18.1676 4.55231C18.7122 5.25392 19.0078 6.11683 19.0078 7.005C19.0078 7.89317 18.7122 8.75608 18.1676 9.45769C17.623 10.1593 16.8604 10.6597 16 10.88M13 7C13 9.20914 11.2091 11 9 11C6.79086 11 5 9.20914 5 7C5 4.79086 6.79086 3 9 3C11.2091 3 13 4.79086 13 7Z\"\r\n stroke=\"#667085\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n </svg>\r\n <span class=\"heading ms-2\">Lead By</span>\r\n </div>\r\n <div class=\"btn btn-default btn-outline btn-outline-default rounded-3 text-nowrap border-val1 ms-4\"\r\n *ngFor=\"let obj of leadData\">\r\n <span class=\"heading \">{{obj.userName}}</span>\r\n <span *ngIf=\"obj?.role\" class=\"blue-badge ms-2\">{{obj?.role | titlecase}}</span>\r\n <div class=\"sub-header mt-2\">{{obj.email}}</div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n\r\n <div *ngIf=\"!loading && !noData\" class=\"card-body p-0 mt-10\">\r\n <div class=\"table-responsive\">\r\n <table class=\"table bottom-border text-nowrap \">\r\n <thead>\r\n <tr>\r\n <!-- <th class=\"cursor-pointer\"><span class=\"inputcheck\"><input type=\"checkbox\"\r\n class=\"cursor-pointer\"></span>\r\n\r\n </th> -->\r\n <th class=\"cursor-pointer\" (click)=\"onSort('userName')\">Username\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'userName' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'userName' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('email')\">Email\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'email' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'email' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('mobileNumber')\">Contact Number\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'mobileNumber' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'mobileNumber' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('role')\">Roles\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'role' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'role' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('assignedStores')\">Stores Assigned\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'assignedStores' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'assignedStores' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('clusterCount')\">Clusters\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'clusterCount' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'clusterCount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('teamCount')\">Teams\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'teamCount' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'teamCount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th style=\"line-height: 21px !important;\">Actions</th>\r\n <!-- <th class=\"cursor-pointer\" (click)=\"onSort('description')\">Assigned Type\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'description' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'description' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th> -->\r\n <!-- <th style=\"line-height: 21px !important;\">Actions</th> -->\r\n </tr>\r\n </thead>\r\n <tbody class=\"fw-semibold\">\r\n <ng-container *ngFor=\"let user of viewteamsList;let i=index;\">\r\n <tr>\r\n <!-- <td><span class=\"inputcheck\"><input type=\"checkbox\" class=\"cursor-pointer mt-2\"></span></td> -->\r\n <td>{{user?.userName}}</td>\r\n <td>{{user?.email}}</td>\r\n <td>{{user?.mobileNumber}}</td>\r\n <td>{{user?.role |titlecase}}</td>\r\n <td>{{user?.assignedStores}}</td>\r\n <td>{{user?.clusterCount}}</td>\r\n <td>{{user?.teamCount}}</td>\r\n <td>\r\n <div class=\"d-flex\" (click)=\"Viewusers('view',user)\">\r\n <span class=\"cursor-pointer\">\r\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <g id=\"eye\">\r\n <g id=\"Icon\">\r\n <path\r\n d=\"M0.833374 10C0.833374 10 4.16671 3.33334 10 3.33334C15.8334 3.33334 19.1667 10 19.1667 10C19.1667 10 15.8334 16.6667 10 16.6667C4.16671 16.6667 0.833374 10 0.833374 10Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10 12.5C11.3808 12.5 12.5 11.3807 12.5 10C12.5 8.6193 11.3808 7.50001 10 7.50001C8.61933 7.50001 7.50004 8.6193 7.50004 10C7.50004 11.3807 8.61933 12.5 10 12.5Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n </g>\r\n </svg>\r\n\r\n </span>\r\n </div>\r\n </td>\r\n <!-- <td>store</td> -->\r\n <!-- <td>\r\n <span class=\"me-3 cursor-pointer\">\r\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <g id=\"eye\">\r\n <g id=\"Icon\">\r\n <path\r\n d=\"M0.833374 10.0002C0.833374 10.0002 4.16671 3.3335 10 3.3335C15.8334 3.3335 19.1667 10.0002 19.1667 10.0002C19.1667 10.0002 15.8334 16.6668 10 16.6668C4.16671 16.6668 0.833374 10.0002 0.833374 10.0002Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10 12.5002C11.3808 12.5002 12.5 11.3809 12.5 10.0002C12.5 8.61945 11.3808 7.50016 10 7.50016C8.61933 7.50016 7.50004 8.61945 7.50004 10.0002C7.50004 11.3809 8.61933 12.5002 10 12.5002Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n </g>\r\n </svg>\r\n </span>\r\n\r\n </td> -->\r\n </tr>\r\n </ng-container>\r\n\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12 my-3\">\r\n <lib-pagination *ngIf=\"viewteamsList.length!==0\" [itemsPerPage]=\"pagination.limit\"\r\n [currentPage]=\"pagination.offset\" [totalItems]=\"pagination.totalCount\" [paginationSizes]=\"paginationSizes\"\r\n [pageSize]=\"paginationSize()\" (pageChange)=\"onPageChange($event)\"\r\n (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n <!-- <div *ngIf=\"loading\" class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer mb-10\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"noData\" class=\"row \">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-src\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div> -->\r\n</div>", styles: [".img-src{width:25%;height:20%}.inputcheck input[type=checkbox]{width:18px!important;height:18px!important;margin:0;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}.inputcheck input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}.inputcheck 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!important;padding-top:12px;padding-right:6px}.heading{color:var(--Gray-700, #344054);font-family:Inter;font-size:16px;font-style:normal;font-weight:600;line-height:24px}.sub-header{color:var(--Gray-500, #667085);text-align:left;font-family:Inter;font-size:12px;font-style:normal;font-weight:500;line-height:18px}.bg-colr{background-color:#f2f4f7}table th{border-bottom:1px solid var(--Gray-200, #EAECF0)!important;background:var(--Gray-50, #F9FAFB)!important;color:var(--Gray-500, #667085)!important;font-size:12px!important;font-weight:500!important;line-height:0px!important}.rotate{rotate:180deg;transition:1s}.overflow-auto{overflow-x:auto}.blue-badge{color:#009bf3;font-size:12px;font-weight:500;line-height:18px;border-radius:16px;background:#eaf8ff;padding:2px 8px}.border-val1{cursor:auto}\n"] }]
|
|
4406
|
+
args: [{ selector: 'lib-viewteams-list', template: "<div *ngIf=\"viewTeams\" class=\"card border-0 p-5\">\r\n <div class=\"card-header border-0 px-0\">\r\n <h3 class=\"card-title align-items-start d-flex align-items-center\">\r\n <span class=\"cursor-pointer\" (click)=\"backteamsList()\"> <svg width=\"48\" height=\"48\" viewBox=\"0 0 48 48\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <g filter=\"url(#filter0_d_1029_22185)\">\r\n <rect x=\"2\" y=\"1\" width=\"44\" height=\"44\" rx=\"8\" fill=\"white\" />\r\n <rect x=\"2.5\" y=\"1.5\" width=\"43\" height=\"43\" rx=\"7.5\" stroke=\"#D0D5DD\" />\r\n <path d=\"M29.8334 22.9998H18.1667M18.1667 22.9998L24 28.8332M18.1667 22.9998L24 17.1665\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <filter id=\"filter0_d_1029_22185\" x=\"0\" y=\"0\" width=\"48\" height=\"48\"\r\n filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\">\r\n <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\r\n <feColorMatrix in=\"SourceAlpha\" type=\"matrix\"\r\n values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\" result=\"hardAlpha\" />\r\n <feOffset dy=\"1\" />\r\n <feGaussianBlur stdDeviation=\"1\" />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.05 0\" />\r\n <feBlend mode=\"normal\" in2=\"BackgroundImageFix\" result=\"effect1_dropShadow_1029_22185\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect1_dropShadow_1029_22185\"\r\n result=\"shape\" />\r\n </filter>\r\n </defs>\r\n </svg></span>\r\n <div class=\"ms-3\">\r\n <div class=\"card-label mb-2\">{{teamData?.teamName}}</div>\r\n <div class=\"text-sub mb-2\">{{pagination?.totalCount ? pagination?.totalCount :'0'}} total users</div>\r\n </div>\r\n </h3>\r\n <div class=\"card-toolbar\">\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\"></rect>\r\n <path\r\n d=\"M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z\"\r\n fill=\"currentColor\"></path>\r\n </svg>\r\n </span>\r\n <input type=\"text\" (change)=\"searchData()\" [(ngModel)]=\"searchValue\" class=\"form-control ps-14 me-2\"\r\n name=\"search\" autocomplete=\"off\" placeholder=\"Search\" autocomplete=\"off\" />\r\n <lib-filters [dataObject]=\"dataObject\" (appliedFilters)=\"applyFilters($event)\"></lib-filters>\r\n\r\n <button *ngIf=\"!loading && !noData\" type=\"button\"\r\n (click)=\"exportXLSX()\"\r\n class=\"btn btn-default mx-2 btn-outline p-4 btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n 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.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2\">Export</span> </button>\r\n <button *ngIf=\"!loading && !noData && (gs.userAccess |async)?.Global_User_isEdit\" class=\"btn btn-primary w-100 ms-3\" id=\"alert-toast\" \r\n (click)=\"Configure()\">Configure</button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"border-0 px-0 d-flex\" *ngIf=\"leadData?.length\">\r\n <div class=\"d-flex mt-5 mx-5 w-100 overflow-auto\">\r\n <div class=\"p-3 pt-7 text-nowrap\">\r\n <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <g id=\"users\">\r\n <path id=\"Icon\"\r\n d=\"M17 21V19C17 17.9391 16.5786 16.9217 15.8284 16.1716C15.0783 15.4214 14.0609 15 13 15H5C3.93913 15 2.92172 15.4214 2.17157 16.1716C1.42143 16.9217 1 17.9391 1 19V21M23 21V19C22.9993 18.1137 22.7044 17.2528 22.1614 16.5523C21.6184 15.8519 20.8581 15.3516 20 15.13M16 3.13C16.8604 3.3503 17.623 3.8507 18.1676 4.55231C18.7122 5.25392 19.0078 6.11683 19.0078 7.005C19.0078 7.89317 18.7122 8.75608 18.1676 9.45769C17.623 10.1593 16.8604 10.6597 16 10.88M13 7C13 9.20914 11.2091 11 9 11C6.79086 11 5 9.20914 5 7C5 4.79086 6.79086 3 9 3C11.2091 3 13 4.79086 13 7Z\"\r\n stroke=\"#667085\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n </svg>\r\n <span class=\"heading ms-2\">Lead By</span>\r\n </div>\r\n <div class=\"btn btn-default btn-outline btn-outline-default rounded-3 text-nowrap border-val1 ms-4\"\r\n *ngFor=\"let obj of leadData\">\r\n <span class=\"heading \">{{obj.userName}}</span>\r\n <span *ngIf=\"obj?.role\" class=\"blue-badge ms-2\">{{obj?.role | titlecase}}</span>\r\n <div class=\"sub-header mt-2\">{{getMaskedValue(obj.email,users?.role)}}</div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n\r\n <div *ngIf=\"!loading && !noData\" class=\"card-body p-0 mt-10\">\r\n <div class=\"table-responsive\">\r\n <table class=\"table bottom-border text-nowrap \">\r\n <thead>\r\n <tr>\r\n <!-- <th class=\"cursor-pointer\"><span class=\"inputcheck\"><input type=\"checkbox\"\r\n class=\"cursor-pointer\"></span>\r\n\r\n </th> -->\r\n <th class=\"cursor-pointer\" (click)=\"onSort('userName')\">Username\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'userName' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'userName' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('email')\">Email\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'email' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'email' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('mobileNumber')\">Contact Number\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'mobileNumber' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'mobileNumber' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('role')\">Roles\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'role' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'role' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('assignedStores')\">Stores Assigned\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'assignedStores' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'assignedStores' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('clusterCount')\">Clusters\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'clusterCount' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'clusterCount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('teamCount')\">Teams\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'teamCount' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'teamCount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th style=\"line-height: 21px !important;\">Actions</th>\r\n <!-- <th class=\"cursor-pointer\" (click)=\"onSort('description')\">Assigned Type\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'description' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'description' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th> -->\r\n <!-- <th style=\"line-height: 21px !important;\">Actions</th> -->\r\n </tr>\r\n </thead>\r\n <tbody class=\"fw-semibold\">\r\n <ng-container *ngFor=\"let user of viewteamsList;let i=index;\">\r\n <tr>\r\n <!-- <td><span class=\"inputcheck\"><input type=\"checkbox\" class=\"cursor-pointer mt-2\"></span></td> -->\r\n <td>{{user?.userName}}</td>\r\n <td>{{getMaskedValue(user?.email,users.role)}}</td>\r\n <td>{{getMaskedMobile(user?.mobileNumber,users.role)}}</td>\r\n <td>{{user?.role |titlecase}}</td>\r\n <td>{{user?.assignedStores}}</td>\r\n <td>{{user?.clusterCount}}</td>\r\n <td>{{user?.teamCount}}</td>\r\n <td>\r\n <div class=\"d-flex\" (click)=\"Viewusers('view',user)\">\r\n <span class=\"cursor-pointer\">\r\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <g id=\"eye\">\r\n <g id=\"Icon\">\r\n <path\r\n d=\"M0.833374 10C0.833374 10 4.16671 3.33334 10 3.33334C15.8334 3.33334 19.1667 10 19.1667 10C19.1667 10 15.8334 16.6667 10 16.6667C4.16671 16.6667 0.833374 10 0.833374 10Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10 12.5C11.3808 12.5 12.5 11.3807 12.5 10C12.5 8.6193 11.3808 7.50001 10 7.50001C8.61933 7.50001 7.50004 8.6193 7.50004 10C7.50004 11.3807 8.61933 12.5 10 12.5Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n </g>\r\n </svg>\r\n\r\n </span>\r\n </div>\r\n </td>\r\n <!-- <td>store</td> -->\r\n <!-- <td>\r\n <span class=\"me-3 cursor-pointer\">\r\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <g id=\"eye\">\r\n <g id=\"Icon\">\r\n <path\r\n d=\"M0.833374 10.0002C0.833374 10.0002 4.16671 3.3335 10 3.3335C15.8334 3.3335 19.1667 10.0002 19.1667 10.0002C19.1667 10.0002 15.8334 16.6668 10 16.6668C4.16671 16.6668 0.833374 10.0002 0.833374 10.0002Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10 12.5002C11.3808 12.5002 12.5 11.3809 12.5 10.0002C12.5 8.61945 11.3808 7.50016 10 7.50016C8.61933 7.50016 7.50004 8.61945 7.50004 10.0002C7.50004 11.3809 8.61933 12.5002 10 12.5002Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n </g>\r\n </svg>\r\n </span>\r\n\r\n </td> -->\r\n </tr>\r\n </ng-container>\r\n\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12 my-3\">\r\n <lib-pagination *ngIf=\"viewteamsList.length!==0\" [itemsPerPage]=\"pagination.limit\"\r\n [currentPage]=\"pagination.offset\" [totalItems]=\"pagination.totalCount\" [paginationSizes]=\"paginationSizes\"\r\n [pageSize]=\"paginationSize()\" (pageChange)=\"onPageChange($event)\"\r\n (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n <!-- <div *ngIf=\"loading\" class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer mb-10\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <div *ngIf=\"noData\" class=\"row \">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-src\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div> -->\r\n</div>", styles: [".img-src{width:25%;height:20%}.inputcheck input[type=checkbox]{width:18px!important;height:18px!important;margin:0;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}.inputcheck input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}.inputcheck 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!important;padding-top:12px;padding-right:6px}.heading{color:var(--Gray-700, #344054);font-family:Inter;font-size:16px;font-style:normal;font-weight:600;line-height:24px}.sub-header{color:var(--Gray-500, #667085);text-align:left;font-family:Inter;font-size:12px;font-style:normal;font-weight:500;line-height:18px}.bg-colr{background-color:#f2f4f7}table th{border-bottom:1px solid var(--Gray-200, #EAECF0)!important;background:var(--Gray-50, #F9FAFB)!important;color:var(--Gray-500, #667085)!important;font-size:12px!important;font-weight:500!important;line-height:0px!important}.rotate{rotate:180deg;transition:1s}.overflow-auto{overflow-x:auto}.blue-badge{color:#009bf3;font-size:12px;font-weight:500;line-height:18px;border-radius:16px;background:#eaf8ff;padding:2px 8px}.border-val1{cursor:auto}\n"] }]
|
|
3790
4407
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: ManageUsersService }, { type: i2.GlobalStateService }, { type: ExcelService }, { type: i1$1.NgbModal }], propDecorators: { teamData: [{
|
|
3791
4408
|
type: Input
|
|
3792
4409
|
}] } });
|
|
@@ -3827,6 +4444,7 @@ class TeamsListComponent {
|
|
|
3827
4444
|
this.router = router;
|
|
3828
4445
|
this.modalService = modalService;
|
|
3829
4446
|
}
|
|
4447
|
+
users;
|
|
3830
4448
|
ngOnInit() {
|
|
3831
4449
|
this.userService.setViewTeam(false);
|
|
3832
4450
|
this.userService.viewTeams$.subscribe((value) => {
|
|
@@ -3891,6 +4509,17 @@ class TeamsListComponent {
|
|
|
3891
4509
|
complete: () => { },
|
|
3892
4510
|
});
|
|
3893
4511
|
}
|
|
4512
|
+
getMaskedValue(value, role) {
|
|
4513
|
+
if (role === 'superadmin')
|
|
4514
|
+
return value;
|
|
4515
|
+
if (!value || !value.includes('@'))
|
|
4516
|
+
return '';
|
|
4517
|
+
const [local, domain] = value.split('@');
|
|
4518
|
+
const visibleLength = Math.min(3, local.length);
|
|
4519
|
+
const visiblePart = local.slice(0, visibleLength);
|
|
4520
|
+
const maskedPart = '*'.repeat(local.length - visibleLength);
|
|
4521
|
+
return `${visiblePart}${maskedPart}@${domain}`;
|
|
4522
|
+
}
|
|
3894
4523
|
createTeam() {
|
|
3895
4524
|
const modalRef = this.modalService.open(TeamsCreationComponent, { centered: true, size: 'lg' });
|
|
3896
4525
|
modalRef.componentInstance.type = 'create';
|
|
@@ -3935,6 +4564,7 @@ class TeamsListComponent {
|
|
|
3935
4564
|
this.loadTable();
|
|
3936
4565
|
}
|
|
3937
4566
|
loadTable() {
|
|
4567
|
+
this.users = JSON.parse(localStorage.getItem('user-info') || '{}');
|
|
3938
4568
|
this.loading = true;
|
|
3939
4569
|
this.noData = false;
|
|
3940
4570
|
// this.pagination.offset=1;
|
|
@@ -4083,12 +4713,12 @@ class TeamsListComponent {
|
|
|
4083
4713
|
this.loadTable();
|
|
4084
4714
|
}
|
|
4085
4715
|
}
|
|
4086
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
4087
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: TeamsListComponent, selector: "lib-teams-list", outputs: { dataTo: "dataTo" }, viewQueries: [{ propertyName: "tooltipContent", first: true, predicate: ["tooltipContent"], descendants: true }, { propertyName: "tooltipContents", first: true, predicate: ["tooltipContents"], descendants: true }], ngImport: i0, template: "<div>\r\n <div class=\"\" *ngIf=\"!loading && !viewTeams&&!showcreatebutton\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n </h3>\r\n <div class=\"card-toolbar rightcorner\">\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1 \">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\"></rect>\r\n <path\r\n d=\"M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z\"\r\n fill=\"currentColor\"></path>\r\n </svg>\r\n </span>\r\n <input type=\"text\" (change)=\"searchData()\" [(ngModel)]=\"searchValue\" class=\"form-control ps-14 me-2\"\r\n name=\"search\" autocomplete=\"off\" placeholder=\"Search\" autocomplete=\"off\" />\r\n\r\n\r\n <button *ngIf=\"!loading && !noData \" type=\"button\" (click)=\"exportXLSX()\"\r\n class=\"btn btn-default mx-2 btn-outline p-4 btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n 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.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2\">Export</span> </button>\r\n\r\n <button *ngIf=\"(gs.userAccess |async)?.Global_User_isAdd && teamsList.length>0\" type=\"button\" (click)=\"createTeam()\" class=\"btn btn-primary mx-2 rounded-3 text-nowrap\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M10.0001 4.16663V15.8333M4.16675 9.99996H15.8334\" stroke=\"white\"\r\n stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2 text-white\">Create Team</span> </button>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- <div class=\"card-header border-0 pt-3 left-move\">\r\n <div class=\"card-toolbar\">\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1 \">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\"></rect>\r\n <path\r\n d=\"M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z\"\r\n fill=\"currentColor\"></path>\r\n </svg>\r\n </span>\r\n <input type=\"text\" (change)=\"searchData()\" [(ngModel)]=\"searchValue\" class=\"form-control ps-14 me-2\"\r\n name=\"search\" autocomplete=\"off\" placeholder=\"Search\" autocomplete=\"off\" />\r\n\r\n\r\n <button *ngIf=\"!loading && !noData \" type=\"button\" (click)=\"exportXLSX()\"\r\n class=\"btn btn-default mx-2 btn-outline p-4 btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n 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.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2\">Export</span> </button>\r\n\r\n <button type=\"button\" (click)=\"createTeam()\" class=\"btn btn-primary mx-2 rounded-3 text-nowrap\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M10.0001 4.16663V15.8333M4.16675 9.99996H15.8334\" stroke=\"white\"\r\n stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2 text-white\">Create Team</span> </button>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n </div> -->\r\n\r\n <div *ngIf=\"!loading && !noData && !viewTeams&&teamsList.length>0\" class=\"card-body p-0\">\r\n <div class=\"table-responsive\">\r\n <table class=\"table bottom-border text-nowrap \">\r\n <thead>\r\n <tr>\r\n <!-- <th class=\"cursor-pointer\"><span class=\"inputcheck\"><input type=\"checkbox\"\r\n class=\"cursor-pointer\"></span>\r\n\r\n </th> -->\r\n <th class=\"cursor-pointer\" (click)=\"onSort('teamName')\">Team Name\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'teamName' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'teamName' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('userscount')\">Users\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'userscount' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'userscount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th style=\"line-height: 21px !important;\">Lead Name\r\n <!-- <svg [ngClass]=\"reqdata?.sortColumName === 'leadName' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'leadName' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg> -->\r\n </th>\r\n <th style=\"line-height: 21px !important;\">Lead Email\r\n <!-- <svg [ngClass]=\"reqdata?.sortColumName === 'leademail' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'leademail' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg> -->\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('description')\">Description\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'description' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'description' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th style=\"line-height: 21px !important;\">Actions</th>\r\n </tr>\r\n </thead>\r\n <tbody class=\"fw-semibold\">\r\n <ng-container *ngFor=\"let user of teamsList;let i=index;\">\r\n <tr>\r\n <!-- <td><span class=\"inputcheck\"><input type=\"checkbox\" class=\"cursor-pointer mt-2\"></span></td> -->\r\n <td>{{user?.teamName}}</td>\r\n <td>{{user?.userscount}}</td>\r\n <!-- <td>{{user?.leadName}}<span *ngIf=\"user?.Teamleadcount>0\"> +{{user?.Teamleadcount}}</span>\r\n </td> -->\r\n <td><div class=\"mx-2\">\r\n <div class=\"table-title\">\r\n <span class=\"camerastatus\">\r\n <span>\r\n {{ user?.leadName[0]?user?.leadName[0]:\"--\" }}\r\n </span>\r\n <span *ngIf=\"user?.leadName.length > 1\">\r\n +{{ user.leadName.length - 1 }}\r\n </span>\r\n </span>\r\n\r\n <!-- <ng-template #tooltipContent>\r\n <div class=\"custom-tooltip-content tooltip-content w-100\">\r\n <span class=\"w-100\">{{ user.leadName}}</span>\r\n <span *ngIf=\"user.leademail.length > 1\">\r\n +{{ user.leademail.length - 1 }} more\r\n </span>\r\n </div>\r\n </ng-template> -->\r\n </div>\r\n </div></td>\r\n <td>\r\n <div class=\"d-flex align-items-center\">\r\n <!-- <div class=\"symbol symbol-35px symbol-circle\">\r\n <span class=\"symbol-label badge-light-primary text-symbol\">\r\n <span class=\"text-primary fs-4 badge badge-light-primary fw-normal\">\r\n {{user?.leademail.slice(0,1) | uppercase }}\r\n </span>\r\n </span>\r\n </div> -->\r\n <div class=\"symbol symbol-35px symbol-circle\">\r\n <span class=\"symbol-label badge-light-primary text-symbol\" *ngIf=\"user?.leademail.length>0\">\r\n <span class=\"text-primary fs-4 badge badge-light-primary fw-normal\">\r\n {{ user?.leademail[0]?.substring(0, 2) | uppercase }}\r\n </span>\r\n </span>\r\n </div>\r\n <div class=\"mx-2\">\r\n <div class=\"table-title\">\r\n <span class=\"camerastatus\">\r\n <span>\r\n {{ user?.leademail[0]?user?.leademail[0]:\"--\" }}\r\n </span>\r\n <span *ngIf=\"user?.leademail.length > 1\">\r\n +{{ user.leademail.length - 1 }}\r\n </span>\r\n </span>\r\n\r\n <!-- <ng-template #tooltipContents>\r\n <div class=\"custom-tooltip-content tooltip-content w-100\">\r\n <span class=\"w-100\">{{ user.leademail}}</span>\r\n </div>\r\n </ng-template> -->\r\n </div>\r\n </div>\r\n <span *ngIf=\"user?.Teamleadcount>0\">+{{user?.Teamleadcount}}</span>\r\n </div>\r\n </td>\r\n <td class=\"description\">{{user?.description ? user?.description : \"--\"}}</td>\r\n <td>\r\n <span class=\"me-3 cursor-pointer\" (click)=\"viewTeamsdata(user)\">\r\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <g id=\"eye\">\r\n <g id=\"Icon\">\r\n <path\r\n d=\"M0.833374 10.0002C0.833374 10.0002 4.16671 3.3335 10 3.3335C15.8334 3.3335 19.1667 10.0002 19.1667 10.0002C19.1667 10.0002 15.8334 16.6668 10 16.6668C4.16671 16.6668 0.833374 10.0002 0.833374 10.0002Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10 12.5002C11.3808 12.5002 12.5 11.3809 12.5 10.0002C12.5 8.61945 11.3808 7.50016 10 7.50016C8.61933 7.50016 7.50004 8.61945 7.50004 10.0002C7.50004 11.3809 8.61933 12.5002 10 12.5002Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n </g>\r\n </svg>\r\n </span>\r\n <span *ngIf=\"(gs.userAccess |async)?.Global_User_isEdit\" class=\"me-3 cursor-pointer\" (click)=\"editTeamsdata(user)\">\r\n <svg width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <g clip-path=\"url(#clip0_2181_11160)\">\r\n <path\r\n d=\"M24.1666 12.4999C24.3855 12.2811 24.6453 12.1074 24.9313 11.989C25.2173 11.8705 25.5238 11.8096 25.8333 11.8096C26.1428 11.8096 26.4493 11.8705 26.7353 11.989C27.0213 12.1074 27.2811 12.2811 27.5 12.4999C27.7188 12.7188 27.8924 12.9786 28.0109 13.2646C28.1294 13.5506 28.1903 13.8571 28.1903 14.1666C28.1903 14.4761 28.1294 14.7826 28.0109 15.0686C27.8924 15.3546 27.7188 15.6144 27.5 15.8333L16.25 27.0833L11.6666 28.3333L12.9166 23.7499L24.1666 12.4999Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_2181_11160\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\"\r\n transform=\"translate(10 10)\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n <span *ngIf=\"(gs.userAccess |async)?.Global_User_isEdit\" class=\"cursor-pointer\" (click)=\"deleteTeam(user)\">\r\n <svg width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M12.5 14.9998H14.1667M14.1667 14.9998H27.5M14.1667 14.9998V26.6665C14.1667 27.1085 14.3423 27.5325 14.6548 27.845C14.9674 28.1576 15.3913 28.3332 15.8333 28.3332H24.1667C24.6087 28.3332 25.0326 28.1576 25.3452 27.845C25.6577 27.5325 25.8333 27.1085 25.8333 26.6665V14.9998H14.1667ZM16.6667 14.9998V13.3332C16.6667 12.8911 16.8423 12.4672 17.1548 12.1547C17.4674 11.8421 17.8913 11.6665 18.3333 11.6665H21.6667C22.1087 11.6665 22.5326 11.8421 22.8452 12.1547C23.1577 12.4672 23.3333 12.8911 23.3333 13.3332V14.9998M18.3333 19.1665V24.1665M21.6667 19.1665V24.1665\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </td>\r\n </tr>\r\n </ng-container>\r\n\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData && !viewTeams&&teamsList.length>0\" class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12 my-3\">\r\n <lib-pagination *ngIf=\"teamsList.length!==0\" [itemsPerPage]=\"pagination.limit\" [currentPage]=\"pagination.offset\"\r\n [totalItems]=\"pagination.totalCount\" [paginationSizes]=\"paginationSizes\" [pageSize]=\"paginationSize()\"\r\n (pageChange)=\"onPageChange($event)\" (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n <div *ngIf=\"loading\" class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer mb-10\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"noData&&!showcreatebutton\">\r\n <div class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-src\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <div *ngIf=\"showcreatebutton\" class=\"row\">\r\n <div class=\"ms-3 right-bar py-7 d-flex justify-content-center align-items-center flex-column\">\r\n <svg width=\"160\" height=\"120\" viewBox=\"0 0 160 120\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <circle cx=\"82\" cy=\"52\" r=\"52\" fill=\"#EAECF0\" />\r\n <g filter=\"url(#filter0_dd_1030_48016)\">\r\n <path\r\n d=\"M47.7266 79.1098L80.9651 63.6104C82.6339 62.8322 83.3559 60.8485 82.5777 59.1797L62.9484 17.0845L49.6563 12.2466L22.4611 24.9279C20.7923 25.7061 20.0703 27.6898 20.8485 29.3586L43.2959 77.4971C44.074 79.166 46.0577 79.888 47.7266 79.1098Z\"\r\n fill=\"url(#paint0_linear_1030_48016)\" />\r\n <path d=\"M49.6567 12.2471L62.9489 17.085L53.8838 21.3121L49.6567 12.2471Z\" fill=\"#D0D5DD\" />\r\n </g>\r\n <g filter=\"url(#filter1_dd_1030_48016)\">\r\n <path\r\n d=\"M63.6163 67.7831H100.291C102.132 67.7831 103.625 66.2904 103.625 64.4491V18.0022L93.6228 8H63.6163C61.7749 8 60.2822 9.49271 60.2822 11.3341V64.4491C60.2822 66.2904 61.7749 67.7831 63.6163 67.7831Z\"\r\n fill=\"url(#paint1_linear_1030_48016)\" />\r\n <path d=\"M93.6226 8L103.625 18.0022H93.6226V8Z\" fill=\"#D0D5DD\" />\r\n </g>\r\n <g filter=\"url(#filter2_dd_1030_48016)\">\r\n <path\r\n d=\"M82.4745 63.5909L115.713 79.0903C117.382 79.8685 119.366 79.1465 120.144 77.4777L139.773 35.3825L134.935 22.0903L107.74 9.40903C106.071 8.63085 104.087 9.35286 103.309 11.0217L80.8619 59.1602C80.0837 60.8291 80.8057 62.8128 82.4745 63.5909Z\"\r\n fill=\"url(#paint2_linear_1030_48016)\" />\r\n <path d=\"M134.936 22.0898L139.773 35.382L130.708 31.1549L134.936 22.0898Z\" fill=\"#D0D5DD\" />\r\n </g>\r\n <circle cx=\"27\" cy=\"11\" r=\"5\" fill=\"#F2F4F7\" />\r\n <circle cx=\"24\" cy=\"109\" r=\"7\" fill=\"#F2F4F7\" />\r\n <circle cx=\"151\" cy=\"35\" r=\"7\" fill=\"#F2F4F7\" />\r\n <circle cx=\"140\" cy=\"8\" r=\"4\" fill=\"#F2F4F7\" />\r\n <g filter=\"url(#filter3_b_1030_48016)\">\r\n <rect x=\"58\" y=\"62\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#344054\" fill-opacity=\"0.4\" />\r\n <path\r\n d=\"M74.5 81.6816C72.8425 81.6816 71.5 80.2133 71.5 78.4004C71.5 76.5875 72.8425 75.1191 74.5 75.1191C76.1575 75.1191 77.5 76.5875 77.5 78.4004C77.5 80.2133 76.1575 81.6816 74.5 81.6816ZM89.6483 81.6816C87.9908 81.6816 86.6483 80.2133 86.6483 78.4004C86.6483 76.5875 87.9908 75.1191 89.6483 75.1191C91.3058 75.1191 92.6483 76.5875 92.6483 78.4004C92.6483 80.2133 91.3058 81.6816 89.6483 81.6816ZM85.509 84.3066C85.509 86.4805 83.8965 88.2441 81.909 88.2441C79.9215 88.2441 78.309 86.4805 78.309 84.3066C78.309 82.1328 79.9215 80.3691 81.909 80.3691C83.8965 80.3691 85.509 82.1328 85.509 84.3066Z\"\r\n fill=\"white\" />\r\n <path\r\n d=\"M74.0013 83.7559C71.7925 83.7559 70 85.7164 70 88.1322C70 88.6121 70.36 89.0059 70.7988 89.0059H78.8013H78.8275C77.8338 88.042 77.2038 86.6352 77.2038 85.0684C77.2038 84.7566 77.2263 84.449 77.275 84.1537C76.765 83.8994 76.1988 83.7559 75.6025 83.7559H74.0013Z\"\r\n fill=\"#D0D5DD\" />\r\n <path\r\n d=\"M85.1725 89.0059H85.1987H93.2012C93.64 89.0059 94 88.6162 94 88.1322C94 85.7164 92.2075 83.7559 89.9987 83.7559H88.3975C87.8012 83.7559 87.235 83.8953 86.725 84.1537C86.77 84.4531 86.7963 84.7566 86.7963 85.0684C86.7963 86.6352 86.17 88.042 85.1725 89.0059Z\"\r\n fill=\"#D0D5DD\" />\r\n <path\r\n d=\"M79.7988 90.3183C77.0388 90.3183 74.8 92.767 74.8 95.7857C74.8 96.3928 75.25 96.8809 75.8013 96.8809H88.1987C88.7537 96.8809 89.2 96.3887 89.2 95.7857C89.2 92.767 86.9613 90.3183 84.2013 90.3183H79.7988Z\"\r\n fill=\"#D0D5DD\" />\r\n </g>\r\n <defs>\r\n <filter id=\"filter0_dd_1030_48016\" x=\"-0.560547\" y=\"8.01953\" width=\"104.547\" height=\"112.499\"\r\n filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\">\r\n <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\r\n <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\r\n result=\"hardAlpha\" />\r\n <feMorphology radius=\"4\" operator=\"erode\" in=\"SourceAlpha\" result=\"effect1_dropShadow_1030_48016\" />\r\n <feOffset dy=\"8\" />\r\n <feGaussianBlur stdDeviation=\"4\" />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.03 0\" />\r\n <feBlend mode=\"normal\" in2=\"BackgroundImageFix\" result=\"effect1_dropShadow_1030_48016\" />\r\n <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\r\n result=\"hardAlpha\" />\r\n <feMorphology radius=\"4\" operator=\"erode\" in=\"SourceAlpha\" result=\"effect2_dropShadow_1030_48016\" />\r\n <feOffset dy=\"20\" />\r\n <feGaussianBlur stdDeviation=\"12\" />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.08 0\" />\r\n <feBlend mode=\"normal\" in2=\"effect1_dropShadow_1030_48016\" result=\"effect2_dropShadow_1030_48016\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect2_dropShadow_1030_48016\" result=\"shape\" />\r\n </filter>\r\n <filter id=\"filter1_dd_1030_48016\" x=\"40.2822\" y=\"8\" width=\"83.3428\" height=\"99.7832\"\r\n filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\">\r\n <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\r\n <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\r\n result=\"hardAlpha\" />\r\n <feMorphology radius=\"4\" operator=\"erode\" in=\"SourceAlpha\" result=\"effect1_dropShadow_1030_48016\" />\r\n <feOffset dy=\"8\" />\r\n <feGaussianBlur stdDeviation=\"4\" />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.03 0\" />\r\n <feBlend mode=\"normal\" in2=\"BackgroundImageFix\" result=\"effect1_dropShadow_1030_48016\" />\r\n <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\r\n result=\"hardAlpha\" />\r\n <feMorphology radius=\"4\" operator=\"erode\" in=\"SourceAlpha\" result=\"effect2_dropShadow_1030_48016\" />\r\n <feOffset dy=\"20\" />\r\n <feGaussianBlur stdDeviation=\"12\" />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.08 0\" />\r\n <feBlend mode=\"normal\" in2=\"effect1_dropShadow_1030_48016\" result=\"effect2_dropShadow_1030_48016\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect2_dropShadow_1030_48016\" result=\"shape\" />\r\n </filter>\r\n <filter id=\"filter2_dd_1030_48016\" x=\"59.4526\" y=\"8\" width=\"104.547\" height=\"112.499\"\r\n filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\">\r\n <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\r\n <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\r\n result=\"hardAlpha\" />\r\n <feMorphology radius=\"4\" operator=\"erode\" in=\"SourceAlpha\" result=\"effect1_dropShadow_1030_48016\" />\r\n <feOffset dy=\"8\" />\r\n <feGaussianBlur stdDeviation=\"4\" />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.03 0\" />\r\n <feBlend mode=\"normal\" in2=\"BackgroundImageFix\" result=\"effect1_dropShadow_1030_48016\" />\r\n <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\r\n result=\"hardAlpha\" />\r\n <feMorphology radius=\"4\" operator=\"erode\" in=\"SourceAlpha\" result=\"effect2_dropShadow_1030_48016\" />\r\n <feOffset dy=\"20\" />\r\n <feGaussianBlur stdDeviation=\"12\" />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.08 0\" />\r\n <feBlend mode=\"normal\" in2=\"effect1_dropShadow_1030_48016\" result=\"effect2_dropShadow_1030_48016\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect2_dropShadow_1030_48016\" result=\"shape\" />\r\n </filter>\r\n <filter id=\"filter3_b_1030_48016\" x=\"50\" y=\"54\" width=\"64\" height=\"64\" filterUnits=\"userSpaceOnUse\"\r\n color-interpolation-filters=\"sRGB\">\r\n <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\r\n <feGaussianBlur in=\"BackgroundImageFix\" stdDeviation=\"4\" />\r\n <feComposite in2=\"SourceAlpha\" operator=\"in\" result=\"effect1_backgroundBlur_1030_48016\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect1_backgroundBlur_1030_48016\" result=\"shape\" />\r\n </filter>\r\n <linearGradient id=\"paint0_linear_1030_48016\" x1=\"45.7738\" y1=\"79.2396\" x2=\"19.2853\" y2=\"31.4523\"\r\n gradientUnits=\"userSpaceOnUse\">\r\n <stop stop-color=\"#E4E7EC\" />\r\n <stop offset=\"1\" stop-color=\"#F9FAFB\" />\r\n </linearGradient>\r\n <linearGradient id=\"paint1_linear_1030_48016\" x1=\"61.7916\" y1=\"67.0755\" x2=\"57.9807\" y2=\"12.571\"\r\n gradientUnits=\"userSpaceOnUse\">\r\n <stop stop-color=\"#E4E7EC\" />\r\n <stop offset=\"1\" stop-color=\"#F9FAFB\" />\r\n </linearGradient>\r\n <linearGradient id=\"paint2_linear_1030_48016\" x1=\"81.1199\" y1=\"62.1785\" x2=\"100.701\" y2=\"11.17\"\r\n gradientUnits=\"userSpaceOnUse\">\r\n <stop stop-color=\"#E4E7EC\" />\r\n <stop offset=\"1\" stop-color=\"#F9FAFB\" />\r\n </linearGradient>\r\n </defs>\r\n </svg>\r\n <div class=\"nodata-title\">Start by creating a team</div>\r\n <div class=\"nodata-sub mt-2\">Any team created will track here.</div>\r\n </div>\r\n \r\n <div class=\"d-flex justify-content-center align-items-center mt-3 mb-10\" role=\"group\">\r\n <button class=\"btn btn-outline w-25 me-3\">How to create?</button>\r\n <button [disabled]=\"!(gs.userAccess |async)?.Global_User_isAdd\" class=\"btn btn-primary w-25 ms-3\" id=\"alert-toast\" (click)=\"createTeam()\"><span class=\"mx-2\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M9.99984 4.16699V15.8337M4.1665 10.0003H15.8332\" stroke=\"white\" stroke-width=\"1.67\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>Create\r\n Team</button>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div *ngIf=\"viewTeams\">\r\n <lib-viewteams-list [teamData]=\"this.selectedTeam\"></lib-viewteams-list>\r\n</div>\r\n", styles: [".inputcheck input[type=checkbox]{width:18px!important;height:18px!important;margin:0;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}.inputcheck input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}.inputcheck 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!important;padding-top:12px;padding-right:6px}.left-move{justify-content:end}.img-src{width:25%;height:20%}.w-25{width:15%!important}td.description{overflow:hidden;text-overflow:ellipsis;max-width:100px}table th{border-bottom:1px solid var(--Gray-200, #EAECF0)!important;background:var(--Gray-50, #F9FAFB)!important;color:var(--Gray-500, #667085)!important;font-size:12px!important;font-weight:500!important;line-height:0px!important}.rotate{rotate:180deg;transition:1s}td{line-height:30px}.rightcorner{position:absolute;top:10px;right:16px;font-size:18px}\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: i3.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.PaginationComponent, selector: "lib-pagination", inputs: ["collection", "itemsPerPage", "currentPage", "totalItems", "directionLinks", "pageSize", "paginationSizes"], outputs: ["pageChange", "pageSizeChange"] }, { kind: "component", type: ViewteamsListComponent, selector: "lib-viewteams-list", inputs: ["teamData"] }, { kind: "pipe", type: i6.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.UpperCasePipe, name: "uppercase" }] });
|
|
4716
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TeamsListComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: ManageUsersService }, { token: ExcelService }, { token: i2.GlobalStateService }, { token: i4.ToastService }, { token: i2$1.Router }, { token: i1$1.NgbModal }], target: i0.ɵɵFactoryTarget.Component });
|
|
4717
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: TeamsListComponent, selector: "lib-teams-list", outputs: { dataTo: "dataTo" }, viewQueries: [{ propertyName: "tooltipContent", first: true, predicate: ["tooltipContent"], descendants: true }, { propertyName: "tooltipContents", first: true, predicate: ["tooltipContents"], descendants: true }], ngImport: i0, template: "<div>\r\n <div class=\"\" *ngIf=\"!loading && !viewTeams&&!showcreatebutton\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n </h3>\r\n <div class=\"card-toolbar rightcorner\">\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1 \">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\"></rect>\r\n <path\r\n d=\"M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z\"\r\n fill=\"currentColor\"></path>\r\n </svg>\r\n </span>\r\n <input type=\"text\" (change)=\"searchData()\" [(ngModel)]=\"searchValue\" class=\"form-control ps-14 me-2\"\r\n name=\"search\" autocomplete=\"off\" placeholder=\"Search\" autocomplete=\"off\" />\r\n\r\n\r\n <button *ngIf=\"!loading && !noData \" type=\"button\" (click)=\"exportXLSX()\"\r\n class=\"btn btn-default mx-2 btn-outline p-4 btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n 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.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2\">Export</span> </button>\r\n\r\n <button *ngIf=\"(gs.userAccess |async)?.Global_User_isAdd && teamsList.length>0\" type=\"button\" (click)=\"createTeam()\" class=\"btn btn-primary mx-2 rounded-3 text-nowrap\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M10.0001 4.16663V15.8333M4.16675 9.99996H15.8334\" stroke=\"white\"\r\n stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2 text-white\">Create Team</span> </button>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- <div class=\"card-header border-0 pt-3 left-move\">\r\n <div class=\"card-toolbar\">\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1 \">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\"></rect>\r\n <path\r\n d=\"M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z\"\r\n fill=\"currentColor\"></path>\r\n </svg>\r\n </span>\r\n <input type=\"text\" (change)=\"searchData()\" [(ngModel)]=\"searchValue\" class=\"form-control ps-14 me-2\"\r\n name=\"search\" autocomplete=\"off\" placeholder=\"Search\" autocomplete=\"off\" />\r\n\r\n\r\n <button *ngIf=\"!loading && !noData \" type=\"button\" (click)=\"exportXLSX()\"\r\n class=\"btn btn-default mx-2 btn-outline p-4 btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n 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.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2\">Export</span> </button>\r\n\r\n <button type=\"button\" (click)=\"createTeam()\" class=\"btn btn-primary mx-2 rounded-3 text-nowrap\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M10.0001 4.16663V15.8333M4.16675 9.99996H15.8334\" stroke=\"white\"\r\n stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2 text-white\">Create Team</span> </button>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n </div> -->\r\n\r\n <div *ngIf=\"!loading && !noData && !viewTeams&&teamsList.length>0\" class=\"card-body p-0\">\r\n <div class=\"table-responsive\">\r\n <table class=\"table bottom-border text-nowrap \">\r\n <thead>\r\n <tr>\r\n <!-- <th class=\"cursor-pointer\"><span class=\"inputcheck\"><input type=\"checkbox\"\r\n class=\"cursor-pointer\"></span>\r\n\r\n </th> -->\r\n <th class=\"cursor-pointer\" (click)=\"onSort('teamName')\">Team Name\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'teamName' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'teamName' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('userscount')\">Users\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'userscount' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'userscount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th style=\"line-height: 21px !important;\">Lead Name\r\n <!-- <svg [ngClass]=\"reqdata?.sortColumName === 'leadName' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'leadName' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg> -->\r\n </th>\r\n <th style=\"line-height: 21px !important;\">Lead Email\r\n <!-- <svg [ngClass]=\"reqdata?.sortColumName === 'leademail' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'leademail' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg> -->\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('description')\">Description\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'description' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'description' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th style=\"line-height: 21px !important;\">Actions</th>\r\n </tr>\r\n </thead>\r\n <tbody class=\"fw-semibold\">\r\n <ng-container *ngFor=\"let user of teamsList;let i=index;\">\r\n <tr>\r\n <!-- <td><span class=\"inputcheck\"><input type=\"checkbox\" class=\"cursor-pointer mt-2\"></span></td> -->\r\n <td>{{user?.teamName}}</td>\r\n <td>{{user?.userscount}}</td>\r\n <!-- <td>{{user?.leadName}}<span *ngIf=\"user?.Teamleadcount>0\"> +{{user?.Teamleadcount}}</span>\r\n </td> -->\r\n <td><div class=\"mx-2\">\r\n <div class=\"table-title\">\r\n <span class=\"camerastatus\">\r\n <span>\r\n {{ user?.leadName[0]?user?.leadName[0]:\"--\" }}\r\n </span>\r\n <span *ngIf=\"user?.leadName.length > 1\">\r\n +{{ user.leadName.length - 1 }}\r\n </span>\r\n </span>\r\n\r\n <!-- <ng-template #tooltipContent>\r\n <div class=\"custom-tooltip-content tooltip-content w-100\">\r\n <span class=\"w-100\">{{ user.leadName}}</span>\r\n <span *ngIf=\"user.leademail.length > 1\">\r\n +{{ user.leademail.length - 1 }} more\r\n </span>\r\n </div>\r\n </ng-template> -->\r\n </div>\r\n </div></td>\r\n <td>\r\n <div class=\"d-flex align-items-center\">\r\n <!-- <div class=\"symbol symbol-35px symbol-circle\">\r\n <span class=\"symbol-label badge-light-primary text-symbol\">\r\n <span class=\"text-primary fs-4 badge badge-light-primary fw-normal\">\r\n {{user?.leademail.slice(0,1) | uppercase }}\r\n </span>\r\n </span>\r\n </div> -->\r\n <div class=\"symbol symbol-35px symbol-circle\">\r\n <span class=\"symbol-label badge-light-primary text-symbol\" *ngIf=\"user?.leademail.length>0\">\r\n <span class=\"text-primary fs-4 badge badge-light-primary fw-normal\">\r\n {{ user?.leademail[0]?.substring(0, 2) | uppercase }}\r\n </span>\r\n </span>\r\n </div>\r\n <div class=\"mx-2\">\r\n <div class=\"table-title\">\r\n <span class=\"camerastatus\">\r\n <span>\r\n {{ getMaskedValue(user?.leademail[0] ,users?.role) }}\r\n </span>\r\n <span *ngIf=\"user?.leademail.length > 1\">\r\n +{{ user.leademail.length - 1 }}\r\n </span>\r\n </span>\r\n\r\n <!-- <ng-template #tooltipContents>\r\n <div class=\"custom-tooltip-content tooltip-content w-100\">\r\n <span class=\"w-100\">{{ user.leademail}}</span>\r\n </div>\r\n </ng-template> -->\r\n </div>\r\n </div>\r\n <span *ngIf=\"user?.Teamleadcount>0\">+{{user?.Teamleadcount}}</span>\r\n </div>\r\n </td>\r\n <td class=\"description\">{{user?.description ? user?.description : \"--\"}}</td>\r\n <td>\r\n <span class=\"me-3 cursor-pointer\" (click)=\"viewTeamsdata(user)\">\r\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <g id=\"eye\">\r\n <g id=\"Icon\">\r\n <path\r\n d=\"M0.833374 10.0002C0.833374 10.0002 4.16671 3.3335 10 3.3335C15.8334 3.3335 19.1667 10.0002 19.1667 10.0002C19.1667 10.0002 15.8334 16.6668 10 16.6668C4.16671 16.6668 0.833374 10.0002 0.833374 10.0002Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10 12.5002C11.3808 12.5002 12.5 11.3809 12.5 10.0002C12.5 8.61945 11.3808 7.50016 10 7.50016C8.61933 7.50016 7.50004 8.61945 7.50004 10.0002C7.50004 11.3809 8.61933 12.5002 10 12.5002Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n </g>\r\n </svg>\r\n </span>\r\n <span *ngIf=\"(gs.userAccess |async)?.Global_User_isEdit\" class=\"me-3 cursor-pointer\" (click)=\"editTeamsdata(user)\">\r\n <svg width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <g clip-path=\"url(#clip0_2181_11160)\">\r\n <path\r\n d=\"M24.1666 12.4999C24.3855 12.2811 24.6453 12.1074 24.9313 11.989C25.2173 11.8705 25.5238 11.8096 25.8333 11.8096C26.1428 11.8096 26.4493 11.8705 26.7353 11.989C27.0213 12.1074 27.2811 12.2811 27.5 12.4999C27.7188 12.7188 27.8924 12.9786 28.0109 13.2646C28.1294 13.5506 28.1903 13.8571 28.1903 14.1666C28.1903 14.4761 28.1294 14.7826 28.0109 15.0686C27.8924 15.3546 27.7188 15.6144 27.5 15.8333L16.25 27.0833L11.6666 28.3333L12.9166 23.7499L24.1666 12.4999Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_2181_11160\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\"\r\n transform=\"translate(10 10)\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n <span *ngIf=\"(gs.userAccess |async)?.Global_User_isEdit\" class=\"cursor-pointer\" (click)=\"deleteTeam(user)\">\r\n <svg width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M12.5 14.9998H14.1667M14.1667 14.9998H27.5M14.1667 14.9998V26.6665C14.1667 27.1085 14.3423 27.5325 14.6548 27.845C14.9674 28.1576 15.3913 28.3332 15.8333 28.3332H24.1667C24.6087 28.3332 25.0326 28.1576 25.3452 27.845C25.6577 27.5325 25.8333 27.1085 25.8333 26.6665V14.9998H14.1667ZM16.6667 14.9998V13.3332C16.6667 12.8911 16.8423 12.4672 17.1548 12.1547C17.4674 11.8421 17.8913 11.6665 18.3333 11.6665H21.6667C22.1087 11.6665 22.5326 11.8421 22.8452 12.1547C23.1577 12.4672 23.3333 12.8911 23.3333 13.3332V14.9998M18.3333 19.1665V24.1665M21.6667 19.1665V24.1665\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </td>\r\n </tr>\r\n </ng-container>\r\n\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData && !viewTeams&&teamsList.length>0\" class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12 my-3\">\r\n <lib-pagination *ngIf=\"teamsList.length!==0\" [itemsPerPage]=\"pagination.limit\" [currentPage]=\"pagination.offset\"\r\n [totalItems]=\"pagination.totalCount\" [paginationSizes]=\"paginationSizes\" [pageSize]=\"paginationSize()\"\r\n (pageChange)=\"onPageChange($event)\" (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n <div *ngIf=\"loading\" class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer mb-10\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"noData&&!showcreatebutton\">\r\n <div class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-src\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <div *ngIf=\"showcreatebutton\" class=\"row\">\r\n <div class=\"ms-3 right-bar py-7 d-flex justify-content-center align-items-center flex-column\">\r\n <svg width=\"160\" height=\"120\" viewBox=\"0 0 160 120\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <circle cx=\"82\" cy=\"52\" r=\"52\" fill=\"#EAECF0\" />\r\n <g filter=\"url(#filter0_dd_1030_48016)\">\r\n <path\r\n d=\"M47.7266 79.1098L80.9651 63.6104C82.6339 62.8322 83.3559 60.8485 82.5777 59.1797L62.9484 17.0845L49.6563 12.2466L22.4611 24.9279C20.7923 25.7061 20.0703 27.6898 20.8485 29.3586L43.2959 77.4971C44.074 79.166 46.0577 79.888 47.7266 79.1098Z\"\r\n fill=\"url(#paint0_linear_1030_48016)\" />\r\n <path d=\"M49.6567 12.2471L62.9489 17.085L53.8838 21.3121L49.6567 12.2471Z\" fill=\"#D0D5DD\" />\r\n </g>\r\n <g filter=\"url(#filter1_dd_1030_48016)\">\r\n <path\r\n d=\"M63.6163 67.7831H100.291C102.132 67.7831 103.625 66.2904 103.625 64.4491V18.0022L93.6228 8H63.6163C61.7749 8 60.2822 9.49271 60.2822 11.3341V64.4491C60.2822 66.2904 61.7749 67.7831 63.6163 67.7831Z\"\r\n fill=\"url(#paint1_linear_1030_48016)\" />\r\n <path d=\"M93.6226 8L103.625 18.0022H93.6226V8Z\" fill=\"#D0D5DD\" />\r\n </g>\r\n <g filter=\"url(#filter2_dd_1030_48016)\">\r\n <path\r\n d=\"M82.4745 63.5909L115.713 79.0903C117.382 79.8685 119.366 79.1465 120.144 77.4777L139.773 35.3825L134.935 22.0903L107.74 9.40903C106.071 8.63085 104.087 9.35286 103.309 11.0217L80.8619 59.1602C80.0837 60.8291 80.8057 62.8128 82.4745 63.5909Z\"\r\n fill=\"url(#paint2_linear_1030_48016)\" />\r\n <path d=\"M134.936 22.0898L139.773 35.382L130.708 31.1549L134.936 22.0898Z\" fill=\"#D0D5DD\" />\r\n </g>\r\n <circle cx=\"27\" cy=\"11\" r=\"5\" fill=\"#F2F4F7\" />\r\n <circle cx=\"24\" cy=\"109\" r=\"7\" fill=\"#F2F4F7\" />\r\n <circle cx=\"151\" cy=\"35\" r=\"7\" fill=\"#F2F4F7\" />\r\n <circle cx=\"140\" cy=\"8\" r=\"4\" fill=\"#F2F4F7\" />\r\n <g filter=\"url(#filter3_b_1030_48016)\">\r\n <rect x=\"58\" y=\"62\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#344054\" fill-opacity=\"0.4\" />\r\n <path\r\n d=\"M74.5 81.6816C72.8425 81.6816 71.5 80.2133 71.5 78.4004C71.5 76.5875 72.8425 75.1191 74.5 75.1191C76.1575 75.1191 77.5 76.5875 77.5 78.4004C77.5 80.2133 76.1575 81.6816 74.5 81.6816ZM89.6483 81.6816C87.9908 81.6816 86.6483 80.2133 86.6483 78.4004C86.6483 76.5875 87.9908 75.1191 89.6483 75.1191C91.3058 75.1191 92.6483 76.5875 92.6483 78.4004C92.6483 80.2133 91.3058 81.6816 89.6483 81.6816ZM85.509 84.3066C85.509 86.4805 83.8965 88.2441 81.909 88.2441C79.9215 88.2441 78.309 86.4805 78.309 84.3066C78.309 82.1328 79.9215 80.3691 81.909 80.3691C83.8965 80.3691 85.509 82.1328 85.509 84.3066Z\"\r\n fill=\"white\" />\r\n <path\r\n d=\"M74.0013 83.7559C71.7925 83.7559 70 85.7164 70 88.1322C70 88.6121 70.36 89.0059 70.7988 89.0059H78.8013H78.8275C77.8338 88.042 77.2038 86.6352 77.2038 85.0684C77.2038 84.7566 77.2263 84.449 77.275 84.1537C76.765 83.8994 76.1988 83.7559 75.6025 83.7559H74.0013Z\"\r\n fill=\"#D0D5DD\" />\r\n <path\r\n d=\"M85.1725 89.0059H85.1987H93.2012C93.64 89.0059 94 88.6162 94 88.1322C94 85.7164 92.2075 83.7559 89.9987 83.7559H88.3975C87.8012 83.7559 87.235 83.8953 86.725 84.1537C86.77 84.4531 86.7963 84.7566 86.7963 85.0684C86.7963 86.6352 86.17 88.042 85.1725 89.0059Z\"\r\n fill=\"#D0D5DD\" />\r\n <path\r\n d=\"M79.7988 90.3183C77.0388 90.3183 74.8 92.767 74.8 95.7857C74.8 96.3928 75.25 96.8809 75.8013 96.8809H88.1987C88.7537 96.8809 89.2 96.3887 89.2 95.7857C89.2 92.767 86.9613 90.3183 84.2013 90.3183H79.7988Z\"\r\n fill=\"#D0D5DD\" />\r\n </g>\r\n <defs>\r\n <filter id=\"filter0_dd_1030_48016\" x=\"-0.560547\" y=\"8.01953\" width=\"104.547\" height=\"112.499\"\r\n filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\">\r\n <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\r\n <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\r\n result=\"hardAlpha\" />\r\n <feMorphology radius=\"4\" operator=\"erode\" in=\"SourceAlpha\" result=\"effect1_dropShadow_1030_48016\" />\r\n <feOffset dy=\"8\" />\r\n <feGaussianBlur stdDeviation=\"4\" />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.03 0\" />\r\n <feBlend mode=\"normal\" in2=\"BackgroundImageFix\" result=\"effect1_dropShadow_1030_48016\" />\r\n <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\r\n result=\"hardAlpha\" />\r\n <feMorphology radius=\"4\" operator=\"erode\" in=\"SourceAlpha\" result=\"effect2_dropShadow_1030_48016\" />\r\n <feOffset dy=\"20\" />\r\n <feGaussianBlur stdDeviation=\"12\" />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.08 0\" />\r\n <feBlend mode=\"normal\" in2=\"effect1_dropShadow_1030_48016\" result=\"effect2_dropShadow_1030_48016\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect2_dropShadow_1030_48016\" result=\"shape\" />\r\n </filter>\r\n <filter id=\"filter1_dd_1030_48016\" x=\"40.2822\" y=\"8\" width=\"83.3428\" height=\"99.7832\"\r\n filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\">\r\n <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\r\n <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\r\n result=\"hardAlpha\" />\r\n <feMorphology radius=\"4\" operator=\"erode\" in=\"SourceAlpha\" result=\"effect1_dropShadow_1030_48016\" />\r\n <feOffset dy=\"8\" />\r\n <feGaussianBlur stdDeviation=\"4\" />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.03 0\" />\r\n <feBlend mode=\"normal\" in2=\"BackgroundImageFix\" result=\"effect1_dropShadow_1030_48016\" />\r\n <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\r\n result=\"hardAlpha\" />\r\n <feMorphology radius=\"4\" operator=\"erode\" in=\"SourceAlpha\" result=\"effect2_dropShadow_1030_48016\" />\r\n <feOffset dy=\"20\" />\r\n <feGaussianBlur stdDeviation=\"12\" />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.08 0\" />\r\n <feBlend mode=\"normal\" in2=\"effect1_dropShadow_1030_48016\" result=\"effect2_dropShadow_1030_48016\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect2_dropShadow_1030_48016\" result=\"shape\" />\r\n </filter>\r\n <filter id=\"filter2_dd_1030_48016\" x=\"59.4526\" y=\"8\" width=\"104.547\" height=\"112.499\"\r\n filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\">\r\n <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\r\n <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\r\n result=\"hardAlpha\" />\r\n <feMorphology radius=\"4\" operator=\"erode\" in=\"SourceAlpha\" result=\"effect1_dropShadow_1030_48016\" />\r\n <feOffset dy=\"8\" />\r\n <feGaussianBlur stdDeviation=\"4\" />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.03 0\" />\r\n <feBlend mode=\"normal\" in2=\"BackgroundImageFix\" result=\"effect1_dropShadow_1030_48016\" />\r\n <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\r\n result=\"hardAlpha\" />\r\n <feMorphology radius=\"4\" operator=\"erode\" in=\"SourceAlpha\" result=\"effect2_dropShadow_1030_48016\" />\r\n <feOffset dy=\"20\" />\r\n <feGaussianBlur stdDeviation=\"12\" />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.08 0\" />\r\n <feBlend mode=\"normal\" in2=\"effect1_dropShadow_1030_48016\" result=\"effect2_dropShadow_1030_48016\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect2_dropShadow_1030_48016\" result=\"shape\" />\r\n </filter>\r\n <filter id=\"filter3_b_1030_48016\" x=\"50\" y=\"54\" width=\"64\" height=\"64\" filterUnits=\"userSpaceOnUse\"\r\n color-interpolation-filters=\"sRGB\">\r\n <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\r\n <feGaussianBlur in=\"BackgroundImageFix\" stdDeviation=\"4\" />\r\n <feComposite in2=\"SourceAlpha\" operator=\"in\" result=\"effect1_backgroundBlur_1030_48016\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect1_backgroundBlur_1030_48016\" result=\"shape\" />\r\n </filter>\r\n <linearGradient id=\"paint0_linear_1030_48016\" x1=\"45.7738\" y1=\"79.2396\" x2=\"19.2853\" y2=\"31.4523\"\r\n gradientUnits=\"userSpaceOnUse\">\r\n <stop stop-color=\"#E4E7EC\" />\r\n <stop offset=\"1\" stop-color=\"#F9FAFB\" />\r\n </linearGradient>\r\n <linearGradient id=\"paint1_linear_1030_48016\" x1=\"61.7916\" y1=\"67.0755\" x2=\"57.9807\" y2=\"12.571\"\r\n gradientUnits=\"userSpaceOnUse\">\r\n <stop stop-color=\"#E4E7EC\" />\r\n <stop offset=\"1\" stop-color=\"#F9FAFB\" />\r\n </linearGradient>\r\n <linearGradient id=\"paint2_linear_1030_48016\" x1=\"81.1199\" y1=\"62.1785\" x2=\"100.701\" y2=\"11.17\"\r\n gradientUnits=\"userSpaceOnUse\">\r\n <stop stop-color=\"#E4E7EC\" />\r\n <stop offset=\"1\" stop-color=\"#F9FAFB\" />\r\n </linearGradient>\r\n </defs>\r\n </svg>\r\n <div class=\"nodata-title\">Start by creating a team</div>\r\n <div class=\"nodata-sub mt-2\">Any team created will track here.</div>\r\n </div>\r\n \r\n <div class=\"d-flex justify-content-center align-items-center mt-3 mb-10\" role=\"group\">\r\n <button class=\"btn btn-outline w-25 me-3\">How to create?</button>\r\n <button [disabled]=\"!(gs.userAccess |async)?.Global_User_isAdd\" class=\"btn btn-primary w-25 ms-3\" id=\"alert-toast\" (click)=\"createTeam()\"><span class=\"mx-2\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M9.99984 4.16699V15.8337M4.1665 10.0003H15.8332\" stroke=\"white\" stroke-width=\"1.67\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>Create\r\n Team</button>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div *ngIf=\"viewTeams\">\r\n <lib-viewteams-list [teamData]=\"this.selectedTeam\"></lib-viewteams-list>\r\n</div>\r\n", styles: [".inputcheck input[type=checkbox]{width:18px!important;height:18px!important;margin:0;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}.inputcheck input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}.inputcheck 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!important;padding-top:12px;padding-right:6px}.left-move{justify-content:end}.img-src{width:25%;height:20%}.w-25{width:15%!important}td.description{overflow:hidden;text-overflow:ellipsis;max-width:100px}table th{border-bottom:1px solid var(--Gray-200, #EAECF0)!important;background:var(--Gray-50, #F9FAFB)!important;color:var(--Gray-500, #667085)!important;font-size:12px!important;font-weight:500!important;line-height:0px!important}.rotate{rotate:180deg;transition:1s}td{line-height:30px}.rightcorner{position:absolute;top:10px;right:16px;font-size:18px}\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: i3.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.PaginationComponent, selector: "lib-pagination", inputs: ["collection", "itemsPerPage", "currentPage", "totalItems", "directionLinks", "pageSize", "paginationSizes"], outputs: ["pageChange", "pageSizeChange"] }, { kind: "component", type: ViewteamsListComponent, selector: "lib-viewteams-list", inputs: ["teamData"] }, { kind: "pipe", type: i6.AsyncPipe, name: "async" }, { kind: "pipe", type: i6.UpperCasePipe, name: "uppercase" }] });
|
|
4088
4718
|
}
|
|
4089
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
4719
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TeamsListComponent, decorators: [{
|
|
4090
4720
|
type: Component,
|
|
4091
|
-
args: [{ selector: 'lib-teams-list', template: "<div>\r\n <div class=\"\" *ngIf=\"!loading && !viewTeams&&!showcreatebutton\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n </h3>\r\n <div class=\"card-toolbar rightcorner\">\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1 \">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\"></rect>\r\n <path\r\n d=\"M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z\"\r\n fill=\"currentColor\"></path>\r\n </svg>\r\n </span>\r\n <input type=\"text\" (change)=\"searchData()\" [(ngModel)]=\"searchValue\" class=\"form-control ps-14 me-2\"\r\n name=\"search\" autocomplete=\"off\" placeholder=\"Search\" autocomplete=\"off\" />\r\n\r\n\r\n <button *ngIf=\"!loading && !noData \" type=\"button\" (click)=\"exportXLSX()\"\r\n class=\"btn btn-default mx-2 btn-outline p-4 btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n 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.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2\">Export</span> </button>\r\n\r\n <button *ngIf=\"(gs.userAccess |async)?.Global_User_isAdd && teamsList.length>0\" type=\"button\" (click)=\"createTeam()\" class=\"btn btn-primary mx-2 rounded-3 text-nowrap\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M10.0001 4.16663V15.8333M4.16675 9.99996H15.8334\" stroke=\"white\"\r\n stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2 text-white\">Create Team</span> </button>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- <div class=\"card-header border-0 pt-3 left-move\">\r\n <div class=\"card-toolbar\">\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1 \">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\"></rect>\r\n <path\r\n d=\"M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z\"\r\n fill=\"currentColor\"></path>\r\n </svg>\r\n </span>\r\n <input type=\"text\" (change)=\"searchData()\" [(ngModel)]=\"searchValue\" class=\"form-control ps-14 me-2\"\r\n name=\"search\" autocomplete=\"off\" placeholder=\"Search\" autocomplete=\"off\" />\r\n\r\n\r\n <button *ngIf=\"!loading && !noData \" type=\"button\" (click)=\"exportXLSX()\"\r\n class=\"btn btn-default mx-2 btn-outline p-4 btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n 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.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2\">Export</span> </button>\r\n\r\n <button type=\"button\" (click)=\"createTeam()\" class=\"btn btn-primary mx-2 rounded-3 text-nowrap\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M10.0001 4.16663V15.8333M4.16675 9.99996H15.8334\" stroke=\"white\"\r\n stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2 text-white\">Create Team</span> </button>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n </div> -->\r\n\r\n <div *ngIf=\"!loading && !noData && !viewTeams&&teamsList.length>0\" class=\"card-body p-0\">\r\n <div class=\"table-responsive\">\r\n <table class=\"table bottom-border text-nowrap \">\r\n <thead>\r\n <tr>\r\n <!-- <th class=\"cursor-pointer\"><span class=\"inputcheck\"><input type=\"checkbox\"\r\n class=\"cursor-pointer\"></span>\r\n\r\n </th> -->\r\n <th class=\"cursor-pointer\" (click)=\"onSort('teamName')\">Team Name\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'teamName' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'teamName' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('userscount')\">Users\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'userscount' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'userscount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th style=\"line-height: 21px !important;\">Lead Name\r\n <!-- <svg [ngClass]=\"reqdata?.sortColumName === 'leadName' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'leadName' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg> -->\r\n </th>\r\n <th style=\"line-height: 21px !important;\">Lead Email\r\n <!-- <svg [ngClass]=\"reqdata?.sortColumName === 'leademail' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'leademail' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg> -->\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('description')\">Description\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'description' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'description' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th style=\"line-height: 21px !important;\">Actions</th>\r\n </tr>\r\n </thead>\r\n <tbody class=\"fw-semibold\">\r\n <ng-container *ngFor=\"let user of teamsList;let i=index;\">\r\n <tr>\r\n <!-- <td><span class=\"inputcheck\"><input type=\"checkbox\" class=\"cursor-pointer mt-2\"></span></td> -->\r\n <td>{{user?.teamName}}</td>\r\n <td>{{user?.userscount}}</td>\r\n <!-- <td>{{user?.leadName}}<span *ngIf=\"user?.Teamleadcount>0\"> +{{user?.Teamleadcount}}</span>\r\n </td> -->\r\n <td><div class=\"mx-2\">\r\n <div class=\"table-title\">\r\n <span class=\"camerastatus\">\r\n <span>\r\n {{ user?.leadName[0]?user?.leadName[0]:\"--\" }}\r\n </span>\r\n <span *ngIf=\"user?.leadName.length > 1\">\r\n +{{ user.leadName.length - 1 }}\r\n </span>\r\n </span>\r\n\r\n <!-- <ng-template #tooltipContent>\r\n <div class=\"custom-tooltip-content tooltip-content w-100\">\r\n <span class=\"w-100\">{{ user.leadName}}</span>\r\n <span *ngIf=\"user.leademail.length > 1\">\r\n +{{ user.leademail.length - 1 }} more\r\n </span>\r\n </div>\r\n </ng-template> -->\r\n </div>\r\n </div></td>\r\n <td>\r\n <div class=\"d-flex align-items-center\">\r\n <!-- <div class=\"symbol symbol-35px symbol-circle\">\r\n <span class=\"symbol-label badge-light-primary text-symbol\">\r\n <span class=\"text-primary fs-4 badge badge-light-primary fw-normal\">\r\n {{user?.leademail.slice(0,1) | uppercase }}\r\n </span>\r\n </span>\r\n </div> -->\r\n <div class=\"symbol symbol-35px symbol-circle\">\r\n <span class=\"symbol-label badge-light-primary text-symbol\" *ngIf=\"user?.leademail.length>0\">\r\n <span class=\"text-primary fs-4 badge badge-light-primary fw-normal\">\r\n {{ user?.leademail[0]?.substring(0, 2) | uppercase }}\r\n </span>\r\n </span>\r\n </div>\r\n <div class=\"mx-2\">\r\n <div class=\"table-title\">\r\n <span class=\"camerastatus\">\r\n <span>\r\n {{ user?.leademail[0]?user?.leademail[0]:\"--\" }}\r\n </span>\r\n <span *ngIf=\"user?.leademail.length > 1\">\r\n +{{ user.leademail.length - 1 }}\r\n </span>\r\n </span>\r\n\r\n <!-- <ng-template #tooltipContents>\r\n <div class=\"custom-tooltip-content tooltip-content w-100\">\r\n <span class=\"w-100\">{{ user.leademail}}</span>\r\n </div>\r\n </ng-template> -->\r\n </div>\r\n </div>\r\n <span *ngIf=\"user?.Teamleadcount>0\">+{{user?.Teamleadcount}}</span>\r\n </div>\r\n </td>\r\n <td class=\"description\">{{user?.description ? user?.description : \"--\"}}</td>\r\n <td>\r\n <span class=\"me-3 cursor-pointer\" (click)=\"viewTeamsdata(user)\">\r\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <g id=\"eye\">\r\n <g id=\"Icon\">\r\n <path\r\n d=\"M0.833374 10.0002C0.833374 10.0002 4.16671 3.3335 10 3.3335C15.8334 3.3335 19.1667 10.0002 19.1667 10.0002C19.1667 10.0002 15.8334 16.6668 10 16.6668C4.16671 16.6668 0.833374 10.0002 0.833374 10.0002Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10 12.5002C11.3808 12.5002 12.5 11.3809 12.5 10.0002C12.5 8.61945 11.3808 7.50016 10 7.50016C8.61933 7.50016 7.50004 8.61945 7.50004 10.0002C7.50004 11.3809 8.61933 12.5002 10 12.5002Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n </g>\r\n </svg>\r\n </span>\r\n <span *ngIf=\"(gs.userAccess |async)?.Global_User_isEdit\" class=\"me-3 cursor-pointer\" (click)=\"editTeamsdata(user)\">\r\n <svg width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <g clip-path=\"url(#clip0_2181_11160)\">\r\n <path\r\n d=\"M24.1666 12.4999C24.3855 12.2811 24.6453 12.1074 24.9313 11.989C25.2173 11.8705 25.5238 11.8096 25.8333 11.8096C26.1428 11.8096 26.4493 11.8705 26.7353 11.989C27.0213 12.1074 27.2811 12.2811 27.5 12.4999C27.7188 12.7188 27.8924 12.9786 28.0109 13.2646C28.1294 13.5506 28.1903 13.8571 28.1903 14.1666C28.1903 14.4761 28.1294 14.7826 28.0109 15.0686C27.8924 15.3546 27.7188 15.6144 27.5 15.8333L16.25 27.0833L11.6666 28.3333L12.9166 23.7499L24.1666 12.4999Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_2181_11160\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\"\r\n transform=\"translate(10 10)\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n <span *ngIf=\"(gs.userAccess |async)?.Global_User_isEdit\" class=\"cursor-pointer\" (click)=\"deleteTeam(user)\">\r\n <svg width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M12.5 14.9998H14.1667M14.1667 14.9998H27.5M14.1667 14.9998V26.6665C14.1667 27.1085 14.3423 27.5325 14.6548 27.845C14.9674 28.1576 15.3913 28.3332 15.8333 28.3332H24.1667C24.6087 28.3332 25.0326 28.1576 25.3452 27.845C25.6577 27.5325 25.8333 27.1085 25.8333 26.6665V14.9998H14.1667ZM16.6667 14.9998V13.3332C16.6667 12.8911 16.8423 12.4672 17.1548 12.1547C17.4674 11.8421 17.8913 11.6665 18.3333 11.6665H21.6667C22.1087 11.6665 22.5326 11.8421 22.8452 12.1547C23.1577 12.4672 23.3333 12.8911 23.3333 13.3332V14.9998M18.3333 19.1665V24.1665M21.6667 19.1665V24.1665\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </td>\r\n </tr>\r\n </ng-container>\r\n\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData && !viewTeams&&teamsList.length>0\" class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12 my-3\">\r\n <lib-pagination *ngIf=\"teamsList.length!==0\" [itemsPerPage]=\"pagination.limit\" [currentPage]=\"pagination.offset\"\r\n [totalItems]=\"pagination.totalCount\" [paginationSizes]=\"paginationSizes\" [pageSize]=\"paginationSize()\"\r\n (pageChange)=\"onPageChange($event)\" (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n <div *ngIf=\"loading\" class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer mb-10\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"noData&&!showcreatebutton\">\r\n <div class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-src\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <div *ngIf=\"showcreatebutton\" class=\"row\">\r\n <div class=\"ms-3 right-bar py-7 d-flex justify-content-center align-items-center flex-column\">\r\n <svg width=\"160\" height=\"120\" viewBox=\"0 0 160 120\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <circle cx=\"82\" cy=\"52\" r=\"52\" fill=\"#EAECF0\" />\r\n <g filter=\"url(#filter0_dd_1030_48016)\">\r\n <path\r\n d=\"M47.7266 79.1098L80.9651 63.6104C82.6339 62.8322 83.3559 60.8485 82.5777 59.1797L62.9484 17.0845L49.6563 12.2466L22.4611 24.9279C20.7923 25.7061 20.0703 27.6898 20.8485 29.3586L43.2959 77.4971C44.074 79.166 46.0577 79.888 47.7266 79.1098Z\"\r\n fill=\"url(#paint0_linear_1030_48016)\" />\r\n <path d=\"M49.6567 12.2471L62.9489 17.085L53.8838 21.3121L49.6567 12.2471Z\" fill=\"#D0D5DD\" />\r\n </g>\r\n <g filter=\"url(#filter1_dd_1030_48016)\">\r\n <path\r\n d=\"M63.6163 67.7831H100.291C102.132 67.7831 103.625 66.2904 103.625 64.4491V18.0022L93.6228 8H63.6163C61.7749 8 60.2822 9.49271 60.2822 11.3341V64.4491C60.2822 66.2904 61.7749 67.7831 63.6163 67.7831Z\"\r\n fill=\"url(#paint1_linear_1030_48016)\" />\r\n <path d=\"M93.6226 8L103.625 18.0022H93.6226V8Z\" fill=\"#D0D5DD\" />\r\n </g>\r\n <g filter=\"url(#filter2_dd_1030_48016)\">\r\n <path\r\n d=\"M82.4745 63.5909L115.713 79.0903C117.382 79.8685 119.366 79.1465 120.144 77.4777L139.773 35.3825L134.935 22.0903L107.74 9.40903C106.071 8.63085 104.087 9.35286 103.309 11.0217L80.8619 59.1602C80.0837 60.8291 80.8057 62.8128 82.4745 63.5909Z\"\r\n fill=\"url(#paint2_linear_1030_48016)\" />\r\n <path d=\"M134.936 22.0898L139.773 35.382L130.708 31.1549L134.936 22.0898Z\" fill=\"#D0D5DD\" />\r\n </g>\r\n <circle cx=\"27\" cy=\"11\" r=\"5\" fill=\"#F2F4F7\" />\r\n <circle cx=\"24\" cy=\"109\" r=\"7\" fill=\"#F2F4F7\" />\r\n <circle cx=\"151\" cy=\"35\" r=\"7\" fill=\"#F2F4F7\" />\r\n <circle cx=\"140\" cy=\"8\" r=\"4\" fill=\"#F2F4F7\" />\r\n <g filter=\"url(#filter3_b_1030_48016)\">\r\n <rect x=\"58\" y=\"62\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#344054\" fill-opacity=\"0.4\" />\r\n <path\r\n d=\"M74.5 81.6816C72.8425 81.6816 71.5 80.2133 71.5 78.4004C71.5 76.5875 72.8425 75.1191 74.5 75.1191C76.1575 75.1191 77.5 76.5875 77.5 78.4004C77.5 80.2133 76.1575 81.6816 74.5 81.6816ZM89.6483 81.6816C87.9908 81.6816 86.6483 80.2133 86.6483 78.4004C86.6483 76.5875 87.9908 75.1191 89.6483 75.1191C91.3058 75.1191 92.6483 76.5875 92.6483 78.4004C92.6483 80.2133 91.3058 81.6816 89.6483 81.6816ZM85.509 84.3066C85.509 86.4805 83.8965 88.2441 81.909 88.2441C79.9215 88.2441 78.309 86.4805 78.309 84.3066C78.309 82.1328 79.9215 80.3691 81.909 80.3691C83.8965 80.3691 85.509 82.1328 85.509 84.3066Z\"\r\n fill=\"white\" />\r\n <path\r\n d=\"M74.0013 83.7559C71.7925 83.7559 70 85.7164 70 88.1322C70 88.6121 70.36 89.0059 70.7988 89.0059H78.8013H78.8275C77.8338 88.042 77.2038 86.6352 77.2038 85.0684C77.2038 84.7566 77.2263 84.449 77.275 84.1537C76.765 83.8994 76.1988 83.7559 75.6025 83.7559H74.0013Z\"\r\n fill=\"#D0D5DD\" />\r\n <path\r\n d=\"M85.1725 89.0059H85.1987H93.2012C93.64 89.0059 94 88.6162 94 88.1322C94 85.7164 92.2075 83.7559 89.9987 83.7559H88.3975C87.8012 83.7559 87.235 83.8953 86.725 84.1537C86.77 84.4531 86.7963 84.7566 86.7963 85.0684C86.7963 86.6352 86.17 88.042 85.1725 89.0059Z\"\r\n fill=\"#D0D5DD\" />\r\n <path\r\n d=\"M79.7988 90.3183C77.0388 90.3183 74.8 92.767 74.8 95.7857C74.8 96.3928 75.25 96.8809 75.8013 96.8809H88.1987C88.7537 96.8809 89.2 96.3887 89.2 95.7857C89.2 92.767 86.9613 90.3183 84.2013 90.3183H79.7988Z\"\r\n fill=\"#D0D5DD\" />\r\n </g>\r\n <defs>\r\n <filter id=\"filter0_dd_1030_48016\" x=\"-0.560547\" y=\"8.01953\" width=\"104.547\" height=\"112.499\"\r\n filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\">\r\n <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\r\n <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\r\n result=\"hardAlpha\" />\r\n <feMorphology radius=\"4\" operator=\"erode\" in=\"SourceAlpha\" result=\"effect1_dropShadow_1030_48016\" />\r\n <feOffset dy=\"8\" />\r\n <feGaussianBlur stdDeviation=\"4\" />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.03 0\" />\r\n <feBlend mode=\"normal\" in2=\"BackgroundImageFix\" result=\"effect1_dropShadow_1030_48016\" />\r\n <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\r\n result=\"hardAlpha\" />\r\n <feMorphology radius=\"4\" operator=\"erode\" in=\"SourceAlpha\" result=\"effect2_dropShadow_1030_48016\" />\r\n <feOffset dy=\"20\" />\r\n <feGaussianBlur stdDeviation=\"12\" />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.08 0\" />\r\n <feBlend mode=\"normal\" in2=\"effect1_dropShadow_1030_48016\" result=\"effect2_dropShadow_1030_48016\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect2_dropShadow_1030_48016\" result=\"shape\" />\r\n </filter>\r\n <filter id=\"filter1_dd_1030_48016\" x=\"40.2822\" y=\"8\" width=\"83.3428\" height=\"99.7832\"\r\n filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\">\r\n <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\r\n <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\r\n result=\"hardAlpha\" />\r\n <feMorphology radius=\"4\" operator=\"erode\" in=\"SourceAlpha\" result=\"effect1_dropShadow_1030_48016\" />\r\n <feOffset dy=\"8\" />\r\n <feGaussianBlur stdDeviation=\"4\" />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.03 0\" />\r\n <feBlend mode=\"normal\" in2=\"BackgroundImageFix\" result=\"effect1_dropShadow_1030_48016\" />\r\n <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\r\n result=\"hardAlpha\" />\r\n <feMorphology radius=\"4\" operator=\"erode\" in=\"SourceAlpha\" result=\"effect2_dropShadow_1030_48016\" />\r\n <feOffset dy=\"20\" />\r\n <feGaussianBlur stdDeviation=\"12\" />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.08 0\" />\r\n <feBlend mode=\"normal\" in2=\"effect1_dropShadow_1030_48016\" result=\"effect2_dropShadow_1030_48016\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect2_dropShadow_1030_48016\" result=\"shape\" />\r\n </filter>\r\n <filter id=\"filter2_dd_1030_48016\" x=\"59.4526\" y=\"8\" width=\"104.547\" height=\"112.499\"\r\n filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\">\r\n <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\r\n <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\r\n result=\"hardAlpha\" />\r\n <feMorphology radius=\"4\" operator=\"erode\" in=\"SourceAlpha\" result=\"effect1_dropShadow_1030_48016\" />\r\n <feOffset dy=\"8\" />\r\n <feGaussianBlur stdDeviation=\"4\" />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.03 0\" />\r\n <feBlend mode=\"normal\" in2=\"BackgroundImageFix\" result=\"effect1_dropShadow_1030_48016\" />\r\n <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\r\n result=\"hardAlpha\" />\r\n <feMorphology radius=\"4\" operator=\"erode\" in=\"SourceAlpha\" result=\"effect2_dropShadow_1030_48016\" />\r\n <feOffset dy=\"20\" />\r\n <feGaussianBlur stdDeviation=\"12\" />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.08 0\" />\r\n <feBlend mode=\"normal\" in2=\"effect1_dropShadow_1030_48016\" result=\"effect2_dropShadow_1030_48016\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect2_dropShadow_1030_48016\" result=\"shape\" />\r\n </filter>\r\n <filter id=\"filter3_b_1030_48016\" x=\"50\" y=\"54\" width=\"64\" height=\"64\" filterUnits=\"userSpaceOnUse\"\r\n color-interpolation-filters=\"sRGB\">\r\n <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\r\n <feGaussianBlur in=\"BackgroundImageFix\" stdDeviation=\"4\" />\r\n <feComposite in2=\"SourceAlpha\" operator=\"in\" result=\"effect1_backgroundBlur_1030_48016\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect1_backgroundBlur_1030_48016\" result=\"shape\" />\r\n </filter>\r\n <linearGradient id=\"paint0_linear_1030_48016\" x1=\"45.7738\" y1=\"79.2396\" x2=\"19.2853\" y2=\"31.4523\"\r\n gradientUnits=\"userSpaceOnUse\">\r\n <stop stop-color=\"#E4E7EC\" />\r\n <stop offset=\"1\" stop-color=\"#F9FAFB\" />\r\n </linearGradient>\r\n <linearGradient id=\"paint1_linear_1030_48016\" x1=\"61.7916\" y1=\"67.0755\" x2=\"57.9807\" y2=\"12.571\"\r\n gradientUnits=\"userSpaceOnUse\">\r\n <stop stop-color=\"#E4E7EC\" />\r\n <stop offset=\"1\" stop-color=\"#F9FAFB\" />\r\n </linearGradient>\r\n <linearGradient id=\"paint2_linear_1030_48016\" x1=\"81.1199\" y1=\"62.1785\" x2=\"100.701\" y2=\"11.17\"\r\n gradientUnits=\"userSpaceOnUse\">\r\n <stop stop-color=\"#E4E7EC\" />\r\n <stop offset=\"1\" stop-color=\"#F9FAFB\" />\r\n </linearGradient>\r\n </defs>\r\n </svg>\r\n <div class=\"nodata-title\">Start by creating a team</div>\r\n <div class=\"nodata-sub mt-2\">Any team created will track here.</div>\r\n </div>\r\n \r\n <div class=\"d-flex justify-content-center align-items-center mt-3 mb-10\" role=\"group\">\r\n <button class=\"btn btn-outline w-25 me-3\">How to create?</button>\r\n <button [disabled]=\"!(gs.userAccess |async)?.Global_User_isAdd\" class=\"btn btn-primary w-25 ms-3\" id=\"alert-toast\" (click)=\"createTeam()\"><span class=\"mx-2\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M9.99984 4.16699V15.8337M4.1665 10.0003H15.8332\" stroke=\"white\" stroke-width=\"1.67\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>Create\r\n Team</button>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div *ngIf=\"viewTeams\">\r\n <lib-viewteams-list [teamData]=\"this.selectedTeam\"></lib-viewteams-list>\r\n</div>\r\n", styles: [".inputcheck input[type=checkbox]{width:18px!important;height:18px!important;margin:0;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}.inputcheck input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}.inputcheck 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!important;padding-top:12px;padding-right:6px}.left-move{justify-content:end}.img-src{width:25%;height:20%}.w-25{width:15%!important}td.description{overflow:hidden;text-overflow:ellipsis;max-width:100px}table th{border-bottom:1px solid var(--Gray-200, #EAECF0)!important;background:var(--Gray-50, #F9FAFB)!important;color:var(--Gray-500, #667085)!important;font-size:12px!important;font-weight:500!important;line-height:0px!important}.rotate{rotate:180deg;transition:1s}td{line-height:30px}.rightcorner{position:absolute;top:10px;right:16px;font-size:18px}\n"] }]
|
|
4721
|
+
args: [{ selector: 'lib-teams-list', template: "<div>\r\n <div class=\"\" *ngIf=\"!loading && !viewTeams&&!showcreatebutton\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n </h3>\r\n <div class=\"card-toolbar rightcorner\">\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1 \">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\"></rect>\r\n <path\r\n d=\"M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z\"\r\n fill=\"currentColor\"></path>\r\n </svg>\r\n </span>\r\n <input type=\"text\" (change)=\"searchData()\" [(ngModel)]=\"searchValue\" class=\"form-control ps-14 me-2\"\r\n name=\"search\" autocomplete=\"off\" placeholder=\"Search\" autocomplete=\"off\" />\r\n\r\n\r\n <button *ngIf=\"!loading && !noData \" type=\"button\" (click)=\"exportXLSX()\"\r\n class=\"btn btn-default mx-2 btn-outline p-4 btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n 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.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2\">Export</span> </button>\r\n\r\n <button *ngIf=\"(gs.userAccess |async)?.Global_User_isAdd && teamsList.length>0\" type=\"button\" (click)=\"createTeam()\" class=\"btn btn-primary mx-2 rounded-3 text-nowrap\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M10.0001 4.16663V15.8333M4.16675 9.99996H15.8334\" stroke=\"white\"\r\n stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2 text-white\">Create Team</span> </button>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <!-- <div class=\"card-header border-0 pt-3 left-move\">\r\n <div class=\"card-toolbar\">\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1 \">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\"></rect>\r\n <path\r\n d=\"M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z\"\r\n fill=\"currentColor\"></path>\r\n </svg>\r\n </span>\r\n <input type=\"text\" (change)=\"searchData()\" [(ngModel)]=\"searchValue\" class=\"form-control ps-14 me-2\"\r\n name=\"search\" autocomplete=\"off\" placeholder=\"Search\" autocomplete=\"off\" />\r\n\r\n\r\n <button *ngIf=\"!loading && !noData \" type=\"button\" (click)=\"exportXLSX()\"\r\n class=\"btn btn-default mx-2 btn-outline p-4 btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n 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.5M14.1667 6.66667L10 2.5M10 2.5L5.83333 6.66667M10 2.5V12.5\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2\">Export</span> </button>\r\n\r\n <button type=\"button\" (click)=\"createTeam()\" class=\"btn btn-primary mx-2 rounded-3 text-nowrap\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M10.0001 4.16663V15.8333M4.16675 9.99996H15.8334\" stroke=\"white\"\r\n stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2 text-white\">Create Team</span> </button>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n </div> -->\r\n\r\n <div *ngIf=\"!loading && !noData && !viewTeams&&teamsList.length>0\" class=\"card-body p-0\">\r\n <div class=\"table-responsive\">\r\n <table class=\"table bottom-border text-nowrap \">\r\n <thead>\r\n <tr>\r\n <!-- <th class=\"cursor-pointer\"><span class=\"inputcheck\"><input type=\"checkbox\"\r\n class=\"cursor-pointer\"></span>\r\n\r\n </th> -->\r\n <th class=\"cursor-pointer\" (click)=\"onSort('teamName')\">Team Name\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'teamName' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'teamName' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('userscount')\">Users\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'userscount' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'userscount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th style=\"line-height: 21px !important;\">Lead Name\r\n <!-- <svg [ngClass]=\"reqdata?.sortColumName === 'leadName' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'leadName' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg> -->\r\n </th>\r\n <th style=\"line-height: 21px !important;\">Lead Email\r\n <!-- <svg [ngClass]=\"reqdata?.sortColumName === 'leademail' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'leademail' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg> -->\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('description')\">Description\r\n <svg [ngClass]=\"reqdata?.sortColumName === 'description' && reqdata?.sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"reqdata?.sortColumName === 'description' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th style=\"line-height: 21px !important;\">Actions</th>\r\n </tr>\r\n </thead>\r\n <tbody class=\"fw-semibold\">\r\n <ng-container *ngFor=\"let user of teamsList;let i=index;\">\r\n <tr>\r\n <!-- <td><span class=\"inputcheck\"><input type=\"checkbox\" class=\"cursor-pointer mt-2\"></span></td> -->\r\n <td>{{user?.teamName}}</td>\r\n <td>{{user?.userscount}}</td>\r\n <!-- <td>{{user?.leadName}}<span *ngIf=\"user?.Teamleadcount>0\"> +{{user?.Teamleadcount}}</span>\r\n </td> -->\r\n <td><div class=\"mx-2\">\r\n <div class=\"table-title\">\r\n <span class=\"camerastatus\">\r\n <span>\r\n {{ user?.leadName[0]?user?.leadName[0]:\"--\" }}\r\n </span>\r\n <span *ngIf=\"user?.leadName.length > 1\">\r\n +{{ user.leadName.length - 1 }}\r\n </span>\r\n </span>\r\n\r\n <!-- <ng-template #tooltipContent>\r\n <div class=\"custom-tooltip-content tooltip-content w-100\">\r\n <span class=\"w-100\">{{ user.leadName}}</span>\r\n <span *ngIf=\"user.leademail.length > 1\">\r\n +{{ user.leademail.length - 1 }} more\r\n </span>\r\n </div>\r\n </ng-template> -->\r\n </div>\r\n </div></td>\r\n <td>\r\n <div class=\"d-flex align-items-center\">\r\n <!-- <div class=\"symbol symbol-35px symbol-circle\">\r\n <span class=\"symbol-label badge-light-primary text-symbol\">\r\n <span class=\"text-primary fs-4 badge badge-light-primary fw-normal\">\r\n {{user?.leademail.slice(0,1) | uppercase }}\r\n </span>\r\n </span>\r\n </div> -->\r\n <div class=\"symbol symbol-35px symbol-circle\">\r\n <span class=\"symbol-label badge-light-primary text-symbol\" *ngIf=\"user?.leademail.length>0\">\r\n <span class=\"text-primary fs-4 badge badge-light-primary fw-normal\">\r\n {{ user?.leademail[0]?.substring(0, 2) | uppercase }}\r\n </span>\r\n </span>\r\n </div>\r\n <div class=\"mx-2\">\r\n <div class=\"table-title\">\r\n <span class=\"camerastatus\">\r\n <span>\r\n {{ getMaskedValue(user?.leademail[0] ,users?.role) }}\r\n </span>\r\n <span *ngIf=\"user?.leademail.length > 1\">\r\n +{{ user.leademail.length - 1 }}\r\n </span>\r\n </span>\r\n\r\n <!-- <ng-template #tooltipContents>\r\n <div class=\"custom-tooltip-content tooltip-content w-100\">\r\n <span class=\"w-100\">{{ user.leademail}}</span>\r\n </div>\r\n </ng-template> -->\r\n </div>\r\n </div>\r\n <span *ngIf=\"user?.Teamleadcount>0\">+{{user?.Teamleadcount}}</span>\r\n </div>\r\n </td>\r\n <td class=\"description\">{{user?.description ? user?.description : \"--\"}}</td>\r\n <td>\r\n <span class=\"me-3 cursor-pointer\" (click)=\"viewTeamsdata(user)\">\r\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <g id=\"eye\">\r\n <g id=\"Icon\">\r\n <path\r\n d=\"M0.833374 10.0002C0.833374 10.0002 4.16671 3.3335 10 3.3335C15.8334 3.3335 19.1667 10.0002 19.1667 10.0002C19.1667 10.0002 15.8334 16.6668 10 16.6668C4.16671 16.6668 0.833374 10.0002 0.833374 10.0002Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10 12.5002C11.3808 12.5002 12.5 11.3809 12.5 10.0002C12.5 8.61945 11.3808 7.50016 10 7.50016C8.61933 7.50016 7.50004 8.61945 7.50004 10.0002C7.50004 11.3809 8.61933 12.5002 10 12.5002Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n </g>\r\n </svg>\r\n </span>\r\n <span *ngIf=\"(gs.userAccess |async)?.Global_User_isEdit\" class=\"me-3 cursor-pointer\" (click)=\"editTeamsdata(user)\">\r\n <svg width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <g clip-path=\"url(#clip0_2181_11160)\">\r\n <path\r\n d=\"M24.1666 12.4999C24.3855 12.2811 24.6453 12.1074 24.9313 11.989C25.2173 11.8705 25.5238 11.8096 25.8333 11.8096C26.1428 11.8096 26.4493 11.8705 26.7353 11.989C27.0213 12.1074 27.2811 12.2811 27.5 12.4999C27.7188 12.7188 27.8924 12.9786 28.0109 13.2646C28.1294 13.5506 28.1903 13.8571 28.1903 14.1666C28.1903 14.4761 28.1294 14.7826 28.0109 15.0686C27.8924 15.3546 27.7188 15.6144 27.5 15.8333L16.25 27.0833L11.6666 28.3333L12.9166 23.7499L24.1666 12.4999Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_2181_11160\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\"\r\n transform=\"translate(10 10)\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n <span *ngIf=\"(gs.userAccess |async)?.Global_User_isEdit\" class=\"cursor-pointer\" (click)=\"deleteTeam(user)\">\r\n <svg width=\"40\" height=\"40\" viewBox=\"0 0 40 40\" fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\">\r\n <path\r\n d=\"M12.5 14.9998H14.1667M14.1667 14.9998H27.5M14.1667 14.9998V26.6665C14.1667 27.1085 14.3423 27.5325 14.6548 27.845C14.9674 28.1576 15.3913 28.3332 15.8333 28.3332H24.1667C24.6087 28.3332 25.0326 28.1576 25.3452 27.845C25.6577 27.5325 25.8333 27.1085 25.8333 26.6665V14.9998H14.1667ZM16.6667 14.9998V13.3332C16.6667 12.8911 16.8423 12.4672 17.1548 12.1547C17.4674 11.8421 17.8913 11.6665 18.3333 11.6665H21.6667C22.1087 11.6665 22.5326 11.8421 22.8452 12.1547C23.1577 12.4672 23.3333 12.8911 23.3333 13.3332V14.9998M18.3333 19.1665V24.1665M21.6667 19.1665V24.1665\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n </td>\r\n </tr>\r\n </ng-container>\r\n\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData && !viewTeams&&teamsList.length>0\" class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12 my-3\">\r\n <lib-pagination *ngIf=\"teamsList.length!==0\" [itemsPerPage]=\"pagination.limit\" [currentPage]=\"pagination.offset\"\r\n [totalItems]=\"pagination.totalCount\" [paginationSizes]=\"paginationSizes\" [pageSize]=\"paginationSize()\"\r\n (pageChange)=\"onPageChange($event)\" (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n <div *ngIf=\"loading\" class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer mb-10\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n <ng-container *ngIf=\"noData&&!showcreatebutton\">\r\n <div class=\"row\">\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-src\" src=\"./assets/tango/Icons/Nodata.svg\" alt=\"\">\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <div *ngIf=\"showcreatebutton\" class=\"row\">\r\n <div class=\"ms-3 right-bar py-7 d-flex justify-content-center align-items-center flex-column\">\r\n <svg width=\"160\" height=\"120\" viewBox=\"0 0 160 120\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\r\n <circle cx=\"82\" cy=\"52\" r=\"52\" fill=\"#EAECF0\" />\r\n <g filter=\"url(#filter0_dd_1030_48016)\">\r\n <path\r\n d=\"M47.7266 79.1098L80.9651 63.6104C82.6339 62.8322 83.3559 60.8485 82.5777 59.1797L62.9484 17.0845L49.6563 12.2466L22.4611 24.9279C20.7923 25.7061 20.0703 27.6898 20.8485 29.3586L43.2959 77.4971C44.074 79.166 46.0577 79.888 47.7266 79.1098Z\"\r\n fill=\"url(#paint0_linear_1030_48016)\" />\r\n <path d=\"M49.6567 12.2471L62.9489 17.085L53.8838 21.3121L49.6567 12.2471Z\" fill=\"#D0D5DD\" />\r\n </g>\r\n <g filter=\"url(#filter1_dd_1030_48016)\">\r\n <path\r\n d=\"M63.6163 67.7831H100.291C102.132 67.7831 103.625 66.2904 103.625 64.4491V18.0022L93.6228 8H63.6163C61.7749 8 60.2822 9.49271 60.2822 11.3341V64.4491C60.2822 66.2904 61.7749 67.7831 63.6163 67.7831Z\"\r\n fill=\"url(#paint1_linear_1030_48016)\" />\r\n <path d=\"M93.6226 8L103.625 18.0022H93.6226V8Z\" fill=\"#D0D5DD\" />\r\n </g>\r\n <g filter=\"url(#filter2_dd_1030_48016)\">\r\n <path\r\n d=\"M82.4745 63.5909L115.713 79.0903C117.382 79.8685 119.366 79.1465 120.144 77.4777L139.773 35.3825L134.935 22.0903L107.74 9.40903C106.071 8.63085 104.087 9.35286 103.309 11.0217L80.8619 59.1602C80.0837 60.8291 80.8057 62.8128 82.4745 63.5909Z\"\r\n fill=\"url(#paint2_linear_1030_48016)\" />\r\n <path d=\"M134.936 22.0898L139.773 35.382L130.708 31.1549L134.936 22.0898Z\" fill=\"#D0D5DD\" />\r\n </g>\r\n <circle cx=\"27\" cy=\"11\" r=\"5\" fill=\"#F2F4F7\" />\r\n <circle cx=\"24\" cy=\"109\" r=\"7\" fill=\"#F2F4F7\" />\r\n <circle cx=\"151\" cy=\"35\" r=\"7\" fill=\"#F2F4F7\" />\r\n <circle cx=\"140\" cy=\"8\" r=\"4\" fill=\"#F2F4F7\" />\r\n <g filter=\"url(#filter3_b_1030_48016)\">\r\n <rect x=\"58\" y=\"62\" width=\"48\" height=\"48\" rx=\"24\" fill=\"#344054\" fill-opacity=\"0.4\" />\r\n <path\r\n d=\"M74.5 81.6816C72.8425 81.6816 71.5 80.2133 71.5 78.4004C71.5 76.5875 72.8425 75.1191 74.5 75.1191C76.1575 75.1191 77.5 76.5875 77.5 78.4004C77.5 80.2133 76.1575 81.6816 74.5 81.6816ZM89.6483 81.6816C87.9908 81.6816 86.6483 80.2133 86.6483 78.4004C86.6483 76.5875 87.9908 75.1191 89.6483 75.1191C91.3058 75.1191 92.6483 76.5875 92.6483 78.4004C92.6483 80.2133 91.3058 81.6816 89.6483 81.6816ZM85.509 84.3066C85.509 86.4805 83.8965 88.2441 81.909 88.2441C79.9215 88.2441 78.309 86.4805 78.309 84.3066C78.309 82.1328 79.9215 80.3691 81.909 80.3691C83.8965 80.3691 85.509 82.1328 85.509 84.3066Z\"\r\n fill=\"white\" />\r\n <path\r\n d=\"M74.0013 83.7559C71.7925 83.7559 70 85.7164 70 88.1322C70 88.6121 70.36 89.0059 70.7988 89.0059H78.8013H78.8275C77.8338 88.042 77.2038 86.6352 77.2038 85.0684C77.2038 84.7566 77.2263 84.449 77.275 84.1537C76.765 83.8994 76.1988 83.7559 75.6025 83.7559H74.0013Z\"\r\n fill=\"#D0D5DD\" />\r\n <path\r\n d=\"M85.1725 89.0059H85.1987H93.2012C93.64 89.0059 94 88.6162 94 88.1322C94 85.7164 92.2075 83.7559 89.9987 83.7559H88.3975C87.8012 83.7559 87.235 83.8953 86.725 84.1537C86.77 84.4531 86.7963 84.7566 86.7963 85.0684C86.7963 86.6352 86.17 88.042 85.1725 89.0059Z\"\r\n fill=\"#D0D5DD\" />\r\n <path\r\n d=\"M79.7988 90.3183C77.0388 90.3183 74.8 92.767 74.8 95.7857C74.8 96.3928 75.25 96.8809 75.8013 96.8809H88.1987C88.7537 96.8809 89.2 96.3887 89.2 95.7857C89.2 92.767 86.9613 90.3183 84.2013 90.3183H79.7988Z\"\r\n fill=\"#D0D5DD\" />\r\n </g>\r\n <defs>\r\n <filter id=\"filter0_dd_1030_48016\" x=\"-0.560547\" y=\"8.01953\" width=\"104.547\" height=\"112.499\"\r\n filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\">\r\n <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\r\n <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\r\n result=\"hardAlpha\" />\r\n <feMorphology radius=\"4\" operator=\"erode\" in=\"SourceAlpha\" result=\"effect1_dropShadow_1030_48016\" />\r\n <feOffset dy=\"8\" />\r\n <feGaussianBlur stdDeviation=\"4\" />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.03 0\" />\r\n <feBlend mode=\"normal\" in2=\"BackgroundImageFix\" result=\"effect1_dropShadow_1030_48016\" />\r\n <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\r\n result=\"hardAlpha\" />\r\n <feMorphology radius=\"4\" operator=\"erode\" in=\"SourceAlpha\" result=\"effect2_dropShadow_1030_48016\" />\r\n <feOffset dy=\"20\" />\r\n <feGaussianBlur stdDeviation=\"12\" />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.08 0\" />\r\n <feBlend mode=\"normal\" in2=\"effect1_dropShadow_1030_48016\" result=\"effect2_dropShadow_1030_48016\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect2_dropShadow_1030_48016\" result=\"shape\" />\r\n </filter>\r\n <filter id=\"filter1_dd_1030_48016\" x=\"40.2822\" y=\"8\" width=\"83.3428\" height=\"99.7832\"\r\n filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\">\r\n <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\r\n <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\r\n result=\"hardAlpha\" />\r\n <feMorphology radius=\"4\" operator=\"erode\" in=\"SourceAlpha\" result=\"effect1_dropShadow_1030_48016\" />\r\n <feOffset dy=\"8\" />\r\n <feGaussianBlur stdDeviation=\"4\" />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.03 0\" />\r\n <feBlend mode=\"normal\" in2=\"BackgroundImageFix\" result=\"effect1_dropShadow_1030_48016\" />\r\n <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\r\n result=\"hardAlpha\" />\r\n <feMorphology radius=\"4\" operator=\"erode\" in=\"SourceAlpha\" result=\"effect2_dropShadow_1030_48016\" />\r\n <feOffset dy=\"20\" />\r\n <feGaussianBlur stdDeviation=\"12\" />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.08 0\" />\r\n <feBlend mode=\"normal\" in2=\"effect1_dropShadow_1030_48016\" result=\"effect2_dropShadow_1030_48016\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect2_dropShadow_1030_48016\" result=\"shape\" />\r\n </filter>\r\n <filter id=\"filter2_dd_1030_48016\" x=\"59.4526\" y=\"8\" width=\"104.547\" height=\"112.499\"\r\n filterUnits=\"userSpaceOnUse\" color-interpolation-filters=\"sRGB\">\r\n <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\r\n <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\r\n result=\"hardAlpha\" />\r\n <feMorphology radius=\"4\" operator=\"erode\" in=\"SourceAlpha\" result=\"effect1_dropShadow_1030_48016\" />\r\n <feOffset dy=\"8\" />\r\n <feGaussianBlur stdDeviation=\"4\" />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.03 0\" />\r\n <feBlend mode=\"normal\" in2=\"BackgroundImageFix\" result=\"effect1_dropShadow_1030_48016\" />\r\n <feColorMatrix in=\"SourceAlpha\" type=\"matrix\" values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\r\n result=\"hardAlpha\" />\r\n <feMorphology radius=\"4\" operator=\"erode\" in=\"SourceAlpha\" result=\"effect2_dropShadow_1030_48016\" />\r\n <feOffset dy=\"20\" />\r\n <feGaussianBlur stdDeviation=\"12\" />\r\n <feColorMatrix type=\"matrix\"\r\n values=\"0 0 0 0 0.0627451 0 0 0 0 0.0941176 0 0 0 0 0.156863 0 0 0 0.08 0\" />\r\n <feBlend mode=\"normal\" in2=\"effect1_dropShadow_1030_48016\" result=\"effect2_dropShadow_1030_48016\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect2_dropShadow_1030_48016\" result=\"shape\" />\r\n </filter>\r\n <filter id=\"filter3_b_1030_48016\" x=\"50\" y=\"54\" width=\"64\" height=\"64\" filterUnits=\"userSpaceOnUse\"\r\n color-interpolation-filters=\"sRGB\">\r\n <feFlood flood-opacity=\"0\" result=\"BackgroundImageFix\" />\r\n <feGaussianBlur in=\"BackgroundImageFix\" stdDeviation=\"4\" />\r\n <feComposite in2=\"SourceAlpha\" operator=\"in\" result=\"effect1_backgroundBlur_1030_48016\" />\r\n <feBlend mode=\"normal\" in=\"SourceGraphic\" in2=\"effect1_backgroundBlur_1030_48016\" result=\"shape\" />\r\n </filter>\r\n <linearGradient id=\"paint0_linear_1030_48016\" x1=\"45.7738\" y1=\"79.2396\" x2=\"19.2853\" y2=\"31.4523\"\r\n gradientUnits=\"userSpaceOnUse\">\r\n <stop stop-color=\"#E4E7EC\" />\r\n <stop offset=\"1\" stop-color=\"#F9FAFB\" />\r\n </linearGradient>\r\n <linearGradient id=\"paint1_linear_1030_48016\" x1=\"61.7916\" y1=\"67.0755\" x2=\"57.9807\" y2=\"12.571\"\r\n gradientUnits=\"userSpaceOnUse\">\r\n <stop stop-color=\"#E4E7EC\" />\r\n <stop offset=\"1\" stop-color=\"#F9FAFB\" />\r\n </linearGradient>\r\n <linearGradient id=\"paint2_linear_1030_48016\" x1=\"81.1199\" y1=\"62.1785\" x2=\"100.701\" y2=\"11.17\"\r\n gradientUnits=\"userSpaceOnUse\">\r\n <stop stop-color=\"#E4E7EC\" />\r\n <stop offset=\"1\" stop-color=\"#F9FAFB\" />\r\n </linearGradient>\r\n </defs>\r\n </svg>\r\n <div class=\"nodata-title\">Start by creating a team</div>\r\n <div class=\"nodata-sub mt-2\">Any team created will track here.</div>\r\n </div>\r\n \r\n <div class=\"d-flex justify-content-center align-items-center mt-3 mb-10\" role=\"group\">\r\n <button class=\"btn btn-outline w-25 me-3\">How to create?</button>\r\n <button [disabled]=\"!(gs.userAccess |async)?.Global_User_isAdd\" class=\"btn btn-primary w-25 ms-3\" id=\"alert-toast\" (click)=\"createTeam()\"><span class=\"mx-2\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M9.99984 4.16699V15.8337M4.1665 10.0003H15.8332\" stroke=\"white\" stroke-width=\"1.67\"\r\n stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg></span>Create\r\n Team</button>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div *ngIf=\"viewTeams\">\r\n <lib-viewteams-list [teamData]=\"this.selectedTeam\"></lib-viewteams-list>\r\n</div>\r\n", styles: [".inputcheck input[type=checkbox]{width:18px!important;height:18px!important;margin:0;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}.inputcheck input[type=checkbox]:checked{outline:1px solid var(--primary-600, #00A3FF);background-color:var(--primary-50, #EAF8FF)}.inputcheck 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!important;padding-top:12px;padding-right:6px}.left-move{justify-content:end}.img-src{width:25%;height:20%}.w-25{width:15%!important}td.description{overflow:hidden;text-overflow:ellipsis;max-width:100px}table th{border-bottom:1px solid var(--Gray-200, #EAECF0)!important;background:var(--Gray-50, #F9FAFB)!important;color:var(--Gray-500, #667085)!important;font-size:12px!important;font-weight:500!important;line-height:0px!important}.rotate{rotate:180deg;transition:1s}td{line-height:30px}.rightcorner{position:absolute;top:10px;right:16px;font-size:18px}\n"] }]
|
|
4092
4722
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: ManageUsersService }, { type: ExcelService }, { type: i2.GlobalStateService }, { type: i4.ToastService }, { type: i2$1.Router }, { type: i1$1.NgbModal }], propDecorators: { dataTo: [{
|
|
4093
4723
|
type: Output
|
|
4094
4724
|
}], tooltipContent: [{
|
|
@@ -4143,10 +4773,10 @@ class UsersManageComponent {
|
|
|
4143
4773
|
}
|
|
4144
4774
|
});
|
|
4145
4775
|
}
|
|
4146
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
4147
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.
|
|
4776
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: UsersManageComponent, deps: [{ token: ManageUsersService }], target: i0.ɵɵFactoryTarget.Component });
|
|
4777
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: UsersManageComponent, selector: "lib-users-manage", ngImport: i0, template: "<div class=\"card mb-5\">\r\n <div class=\"card-header border-0 pt-3\">\r\n <div class=\"d-flex overflow-auto mb-2\">\r\n <ul class=\"nav nav-stretch nav-line-tabs1 nav-line-tabs flex-nowrap \" style=\"border-bottom: white!important;overflow-y: hidden;\">\r\n \r\n <li class=\"nav-item nav-item1\" (click)=\"selectedTabs('users')\">\r\n <a [ngClass]=\"selectedTab ==='users' ? 'active' :''\"\r\n class=\"nav-link nav-link1 cursor-pointer tab-title me-6\">Users <span class=\"blue-badge mx-2\" >{{ userCount ? userCount : '0'}}</span></a>\r\n </li>\r\n <li class=\"nav-item nav-item1\" (click)=\"selectedTabs('teams')\"><a\r\n [ngClass]=\"selectedTab ==='teams' ? 'active' :''\"\r\n class=\"nav-link nav-link1 cursor-pointer no-border tab-title me-6 \">Teams <span class=\"blue-badge mx-2\" >{{ teamCount ? teamCount : '0'}}</span></a>\r\n </li>\r\n \r\n </ul>\r\n </div>\r\n </div>\r\n <!-- <div class=\"card-header my-3 min-h-55px\">\r\n <ul class=\"nav nav-stretch nav-line-tabs1 nav-line-tabs flex-nowrap \">\r\n\r\n <li class=\"nav-item nav-item1\" (click)=\"selectedTabs('users')\" >\r\n <a [ngClass]=\"selectedTab ==='users' ? 'active' :''\"\r\n class=\"nav-link nav-link1 cursor-pointer tab-title me-6\">Users <span class=\"blue-badge mx-2\">{{ userCount ? userCount : '0'}}</span></a>\r\n </li>\r\n <li class=\"nav-item nav-item1\" (click)=\"selectedTabs('teams')\"><a\r\n [ngClass]=\"selectedTab ==='teams' ? 'active' :''\"\r\n class=\"nav-link nav-link1 cursor-pointer no-border tab-title me-6\">Teams <span class=\"blue-badge mx-2\">{{ teamCount ? teamCount : '0'}}</span></a>\r\n </li>\r\n\r\n </ul>\r\n </div> -->\r\n <div class=\"card-card pt-2 pb-1 \">\r\n <lib-users-list *ngIf=\"selectedTab ==='users'\" (dataToParent)=\"receiveData($event)\"></lib-users-list>\r\n <lib-teams-list *ngIf=\"selectedTab ==='teams'\" (dataTo)=\"receive($event)\"></lib-teams-list>\r\n </div>\r\n</div>", styles: [".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}.tab-title{color:var(--Primary-700, #009BF3)!important;font-size:16px!important;font-style:normal;font-weight:500;line-height:24px}.blue-badge{border-radius:16px!important;background:var(--Primary-50, #EAF8FF)!important;color:var(--Primary-700, #009BF3)!important;text-align:center;font-size:14px!important;font-style:normal;font-weight:500;line-height:20px;padding:2px 10px!important;mix-blend-mode:multiply!important}\n"], dependencies: [{ kind: "directive", type: i6.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: UsersListComponent, selector: "lib-users-list", outputs: ["dataToParent"] }, { kind: "component", type: TeamsListComponent, selector: "lib-teams-list", outputs: ["dataTo"] }] });
|
|
4148
4778
|
}
|
|
4149
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
4779
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: UsersManageComponent, decorators: [{
|
|
4150
4780
|
type: Component,
|
|
4151
4781
|
args: [{ selector: 'lib-users-manage', template: "<div class=\"card mb-5\">\r\n <div class=\"card-header border-0 pt-3\">\r\n <div class=\"d-flex overflow-auto mb-2\">\r\n <ul class=\"nav nav-stretch nav-line-tabs1 nav-line-tabs flex-nowrap \" style=\"border-bottom: white!important;overflow-y: hidden;\">\r\n \r\n <li class=\"nav-item nav-item1\" (click)=\"selectedTabs('users')\">\r\n <a [ngClass]=\"selectedTab ==='users' ? 'active' :''\"\r\n class=\"nav-link nav-link1 cursor-pointer tab-title me-6\">Users <span class=\"blue-badge mx-2\" >{{ userCount ? userCount : '0'}}</span></a>\r\n </li>\r\n <li class=\"nav-item nav-item1\" (click)=\"selectedTabs('teams')\"><a\r\n [ngClass]=\"selectedTab ==='teams' ? 'active' :''\"\r\n class=\"nav-link nav-link1 cursor-pointer no-border tab-title me-6 \">Teams <span class=\"blue-badge mx-2\" >{{ teamCount ? teamCount : '0'}}</span></a>\r\n </li>\r\n \r\n </ul>\r\n </div>\r\n </div>\r\n <!-- <div class=\"card-header my-3 min-h-55px\">\r\n <ul class=\"nav nav-stretch nav-line-tabs1 nav-line-tabs flex-nowrap \">\r\n\r\n <li class=\"nav-item nav-item1\" (click)=\"selectedTabs('users')\" >\r\n <a [ngClass]=\"selectedTab ==='users' ? 'active' :''\"\r\n class=\"nav-link nav-link1 cursor-pointer tab-title me-6\">Users <span class=\"blue-badge mx-2\">{{ userCount ? userCount : '0'}}</span></a>\r\n </li>\r\n <li class=\"nav-item nav-item1\" (click)=\"selectedTabs('teams')\"><a\r\n [ngClass]=\"selectedTab ==='teams' ? 'active' :''\"\r\n class=\"nav-link nav-link1 cursor-pointer no-border tab-title me-6\">Teams <span class=\"blue-badge mx-2\">{{ teamCount ? teamCount : '0'}}</span></a>\r\n </li>\r\n\r\n </ul>\r\n </div> -->\r\n <div class=\"card-card pt-2 pb-1 \">\r\n <lib-users-list *ngIf=\"selectedTab ==='users'\" (dataToParent)=\"receiveData($event)\"></lib-users-list>\r\n <lib-teams-list *ngIf=\"selectedTab ==='teams'\" (dataTo)=\"receive($event)\"></lib-teams-list>\r\n </div>\r\n</div>", styles: [".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}.tab-title{color:var(--Primary-700, #009BF3)!important;font-size:16px!important;font-style:normal;font-weight:500;line-height:24px}.blue-badge{border-radius:16px!important;background:var(--Primary-50, #EAF8FF)!important;color:var(--Primary-700, #009BF3)!important;text-align:center;font-size:14px!important;font-style:normal;font-weight:500;line-height:20px;padding:2px 10px!important;mix-blend-mode:multiply!important}\n"] }]
|
|
4152
4782
|
}], ctorParameters: () => [{ type: ManageUsersService }] });
|
|
@@ -4330,10 +4960,10 @@ class AuditUserListComponent {
|
|
|
4330
4960
|
this.searchValue = '';
|
|
4331
4961
|
this.dataEmitter.emit(this.viewuser);
|
|
4332
4962
|
}
|
|
4333
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
4334
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.11", type: AuditUserListComponent, selector: "lib-audit-user-list", inputs: { viewuser: "viewuser", userDetails: "userDetails" }, outputs: { dataEmitter: "dataEmitter" }, ngImport: i0, template: "<div class=\"card p-0 rounded-3 mb-5\">\r\n <div class=\"card-header border-0\">\r\n <div class=\"card-title m-0\">\r\n <div class=\"d-flex align-items-center\">\r\n <span (click)=\"backTosummary()\" class=\"btn me-3 px-2 py-2 btn-outline\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M15.8332 10H4.1665M4.1665 10L9.99984 15.8333M4.1665 10L9.99984 4.16667\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"userData?.userName\" class=\"me-3 fw-bold\">{{(userDetails?.userName ? userDetails?.userName : userDetails?.userName) | titlecase}}</span> <span\r\n class=\"badge me-3 badge-light-default\">{{userData?.tangoUserType | titlecase}}</span><span\r\n class=\"badge me-3 badge-light-success\">{{userData?.role | titlecase}}</span>\r\n <span *ngIf=\"userData?.email\" class=\"me-3\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\"\r\n height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M14.6668 4.00001C14.6668 3.26667 14.0668 2.66667 13.3335 2.66667H2.66683C1.9335 2.66667 1.3335 3.26667 1.3335 4.00001M14.6668 4.00001V12C14.6668 12.7333 14.0668 13.3333 13.3335 13.3333H2.66683C1.9335 13.3333 1.3335 12.7333 1.3335 12V4.00001M14.6668 4.00001L8.00016 8.66667L1.3335 4.00001\"\r\n stroke=\"#667085\" stroke-width=\"1.4\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg> <span class=\"ms-2 top-list\">{{userData?.email}}</span></span>\r\n <span *ngIf=\"userData?.mobileNumber\" class=\"me-3\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\"\r\n height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_8096_7888)\">\r\n <path\r\n d=\"M16.5001 12.69V14.94C16.5009 15.1489 16.4581 15.3556 16.3745 15.547C16.2908 15.7384 16.168 15.9102 16.0141 16.0514C15.8602 16.1926 15.6785 16.3001 15.4806 16.367C15.2828 16.4339 15.0731 16.4588 14.8651 16.44C12.5572 16.1892 10.3403 15.4006 8.39257 14.1375C6.58044 12.986 5.04407 11.4496 3.89257 9.6375C2.62506 7.6809 1.83625 5.45324 1.59007 3.135C1.57133 2.9276 1.59598 2.71857 1.66245 2.52121C1.72892 2.32386 1.83575 2.14251 1.97615 1.98871C2.11654 1.83491 2.28743 1.71203 2.47792 1.62789C2.6684 1.54375 2.87433 1.50019 3.08257 1.5H5.33257C5.69655 1.49641 6.04942 1.62531 6.32539 1.86265C6.60137 2.09999 6.78163 2.42958 6.83257 2.79C6.92754 3.51005 7.10366 4.21704 7.35757 4.8975C7.45848 5.16594 7.48032 5.45768 7.4205 5.73816C7.36069 6.01863 7.22172 6.27608 7.02007 6.48L6.06757 7.4325C7.13524 9.31016 8.68991 10.8648 10.5676 11.9325L11.5201 10.98C11.724 10.7783 11.9814 10.6394 12.2619 10.5796C12.5424 10.5197 12.8341 10.5416 13.1026 10.6425C13.783 10.8964 14.49 11.0725 15.2101 11.1675C15.5744 11.2189 15.9071 11.4024 16.145 11.6831C16.3828 11.9638 16.5092 12.3222 16.5001 12.69Z\"\r\n stroke=\"#667085\" stroke-width=\"1.4\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_8096_7888\">\r\n <rect width=\"18\" height=\"18\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg> <span class=\"ms-2 top-list\">{{userData?.mobileNumber }}</span></span>\r\n <span *ngIf=\"userData?.clientAssigned\" class=\"me-3\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\"\r\n height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <path\r\n d=\"M12.75 15.75V14.25C12.75 13.4544 12.4339 12.6913 11.8713 12.1287C11.3087 11.5661 10.5456 11.25 9.75 11.25H3.75C2.95435 11.25 2.19129 11.5661 1.62868 12.1287C1.06607 12.6913 0.75 13.4544 0.75 14.25V15.75M17.25 15.75V14.25C17.2495 13.5853 17.0283 12.9396 16.621 12.4142C16.2138 11.8889 15.6436 11.5137 15 11.3475M12 2.3475C12.6453 2.51273 13.2173 2.88803 13.6257 3.41423C14.0342 3.94044 14.2559 4.58762 14.2559 5.25375C14.2559 5.91988 14.0342 6.56706 13.6257 7.09327C13.2173 7.61947 12.6453 7.99477 12 8.16M9.75 5.25C9.75 6.90685 8.40685 8.25 6.75 8.25C5.09315 8.25 3.75 6.90685 3.75 5.25C3.75 3.59315 5.09315 2.25 6.75 2.25C8.40685 2.25 9.75 3.59315 9.75 5.25Z\"\r\n stroke=\"#667085\" stroke-width=\"1.4\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2 top-list\">Clients Assigned:{{userData?.clientAssigned ?? 0}}</span></span>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n<div class=\"card p-3 rounded-3 mb-5\">\r\n <div class=\"w-100 p-5 bg-highlighted d-flex align-items-center\">\r\n <span class=\"fw-bold text-highlighted\">\u20B9 {{consolidatedData?.totalCredit ? consolidatedData?.totalCredit.toFixed(2) : 0}}</span><span\r\n class=\"fw-semibold text-sub ms-3\">{{consolidatedData?.message}}\r\n <!-- {{headerFilter?.date?.startDate}} \u2013 {{headerFilter?.date?.endDate}} -->\r\n </span>\r\n </div>\r\n <div class=\"d-flex justify-content-between align-items-center px-5 py-5\">\r\n <div class=\"Boxes\">\r\n <div class=\"box-header\">{{consolidatedData?.totalFiles ?? 0}}</div>\r\n <div class=\"box-label fw-semibold\">Total Files</div>\r\n </div>\r\n <div class=\"Boxes\">\r\n <div class=\"box-header\">{{consolidatedData?.totalBC ?? 0}}</div>\r\n <div class=\"box-label fw-semibold\">Before Count</div>\r\n </div>\r\n <div class=\"Boxes\">\r\n <div class=\"box-header\">{{consolidatedData?.totalAC ?? 0}}</div>\r\n <div class=\"box-label fw-semibold\">After Count</div>\r\n </div>\r\n <div class=\"Boxes\">\r\n <div class=\"box-header\">{{consolidatedData?.totalEarnings ? consolidatedData?.totalEarnings.toFixed(2) : 0}}</div>\r\n <div class=\"box-label fw-semibold\">Total Earnings</div>\r\n </div>\r\n <div class=\"Boxes\">\r\n <div class=\"box-header\">{{consolidatedData?.totalReducedAmount ? consolidatedData?.totalReducedAmount.toFixed(2) : 0}}</div>\r\n <div class=\"box-label fw-semibold\">Total Reduced Amount</div>\r\n </div>\r\n </div>\r\n</div>\r\n<div class=\"card\">\r\n <div class=\"card-header border-0 pt-3 mb-5\">\r\n <div class=\"card-title d-grid\">\r\n <div class=\"title\">Summary Table</div>\r\n <div class=\"text-sub\">Based on {{headerFilter?.date?.startDate | date:'dd MMM, yyyy'}} \u2013 {{headerFilter?.date?.endDate | date:'dd MMM, yyyy'}}</div>\r\n </div>\r\n <div class=\"card-toolbar\">\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\"></rect>\r\n <path\r\n d=\"M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z\"\r\n fill=\"currentColor\"></path>\r\n </svg>\r\n </span>\r\n <input type=\"text\" (change)=\"searchData()\" [(ngModel)]=\"searchValue\" class=\"form-control ps-14 me-2\"\r\n name=\"search\" autocomplete=\"off\" placeholder=\"Search\" autocomplete=\"off\" />\r\n @if (!loading && !noData) {\r\n <!-- @if ((gs.userAccess |async)?.Global_User_isEdit) { -->\r\n <button *ngIf=\"!noData && !loading\" type=\"button\" (click)=\"exportXLSX()\"\r\n class=\"btn btn-default px-4 py-3 mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M8.125 13.125H16.3562L14.7438 14.7438L15.625 15.625L18.75 12.5L15.625 9.375L14.7438 10.2562L16.3562 11.875H8.125V13.125Z\"\r\n fill=\"black\" />\r\n <path\r\n d=\"M13.75 8.75V6.25C13.7505 6.16775 13.7347 6.08621 13.7036 6.01006C13.6725 5.93391 13.6267 5.86465 13.5688 5.80625L9.19375 1.43125C9.13535 1.37333 9.06609 1.3275 8.98994 1.2964C8.91379 1.26529 8.83225 1.24953 8.75 1.25H2.5C2.16848 1.25 1.85054 1.3817 1.61612 1.61612C1.3817 1.85054 1.25 2.16848 1.25 2.5V17.5C1.25 17.8315 1.3817 18.1495 1.61612 18.3839C1.85054 18.6183 2.16848 18.75 2.5 18.75H12.5C12.8315 18.75 13.1495 18.6183 13.3839 18.3839C13.6183 18.1495 13.75 17.8315 13.75 17.5V16.25H12.5V17.5H2.5V2.5H7.5V6.25C7.5 6.58152 7.6317 6.89947 7.86612 7.13389C8.10054 7.36831 8.41848 7.5 8.75 7.5H12.5V8.75H13.75ZM8.75 6.25V2.75625L12.2438 6.25H8.75Z\"\r\n fill=\"black\" />\r\n </svg><span class=\"ms-2\">Export</span> </button>\r\n <!-- } -->\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"card-body p-0\">\r\n <div class=\"table-responsive\">\r\n <table class=\"table bottom-border text-nowrap \">\r\n <thead>\r\n <tr>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('fileDate')\">File Date\r\n <svg [ngClass]=\"sortColumName === 'fileDate' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'fileDate' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('totalFilesCount')\">Total Files\r\n <svg [ngClass]=\"sortColumName === 'totalFilesCount' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'totalFilesCount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('totalBeforeCount')\">Total BC\r\n <svg [ngClass]=\"sortColumName === 'totalBeforeCount' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'totalBeforeCount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('totalAfterCount')\">Total AC\r\n <svg [ngClass]=\"sortColumName === 'totalAfterCount' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'totalAfterCount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('totalEarn')\">Total Earnings(Rs)\r\n <svg [ngClass]=\"sortColumName === 'totalEarn' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'totalEarn' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('deductionByMinimumTarget')\">Deduction by Minimum\r\n Target\r\n <svg [ngClass]=\"sortColumName === 'deductionByMinimumTarget' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'deductionByMinimumTarget' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('deductionByMapping')\">Deduction by Mapping\r\n <svg [ngClass]=\"sortColumName === 'deductionByMapping' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'deductionByMapping' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('deductionByLateLogin')\">Deduction by Late Login\r\n <svg [ngClass]=\"sortColumName === 'deductionByLateLogin' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'deductionByLateLogin' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('totalReducedAmount')\">Total Reduced Amount\r\n <svg [ngClass]=\"sortColumName === 'totalReducedAmount' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'totalReducedAmount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('totalCredit')\">Total Credit\r\n <svg [ngClass]=\"sortColumName === 'totalCredit' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'totalCredit' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody class=\"fw-semibold\">\r\n <ng-container *ngFor=\"let user of userList;let i=index;\">\r\n <tr>\r\n <td>{{user?.fileDate ?? '--'}}</td>\r\n <td>{{user?.totalFilesCount ?? '--'}}</td>\r\n <td>{{user?.totalBeforeCount ?? '--'}}</td>\r\n <td>{{user?.totalAfterCount ?? '--'}}</td>\r\n <td>{{user?.totalEarn ? user?.totalEarn.toFixed(2) : 0}}</td>\r\n <td>{{user?.deductionByMinimumTarget ? user?.deductionByMinimumTarget.toFixed(2) : 0}}</td>\r\n <td>{{user?.deductionByMapping ? user?.deductionByMapping.toFixed(2) : 0}}</td>\r\n <td>{{user.deductionByLateLogin ? user.deductionByLateLogin.toFixed(2) : 0}}\r\n </td>\r\n <td>{{user?.totalReducedAmount ? user?.totalReducedAmount.toFixed(2) : 0}}</td>\r\n <td>{{user?.totalCredit ? user?.totalCredit.toFixed(2) : 0}}</td>\r\n </tr>\r\n </ng-container>\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12 my-3\">\r\n <lib-pagination *ngIf=\"userList.length!==0\" [itemsPerPage]=\"pagination.limit\" [currentPage]=\"pagination.offset\"\r\n [totalItems]=\"totalCount\" [paginationSizes]=\"paginationSizes\" [pageSize]=\"paginationSize()\"\r\n (pageChange)=\"onPageChange($event)\" (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n <div *ngIf=\"loading\" class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"noData\" class=\"row\">\r\n <!-- <div class=\"row\"> -->\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-nodata\" src=\"./assets/tango/Icons/Nodata1.svg\" alt=\"\">\r\n <div class=\"nodata-title\">No data found</div>\r\n <div class=\"nodata-sub\">There is no result for this Date</div>\r\n </div>\r\n </div>\r\n <!-- </div> -->\r\n </div>\r\n</div>", styles: [".Boxes .box-header{color:var(--Black, #101828);font-size:20px;font-weight:700;line-height:30px}.Boxes .box-label{color:var(--Black, #101828);font-size:14px;line-height:20px}.card-title .title{color:var(--Gray-900, #101828);font-size:18px;font-weight:600;line-height:28px}.card-title .text-sub{color:var(--Gray-500, #667085);font-size:14px;font-weight:400;line-height:20px}.bg-highlighted{border-radius:6px;border-bottom:2px solid var(--Gray-200, #EAECF0);background:radial-gradient(206.89% 107.47% at 16.16% 32.77%,#fff6,#45bbfe33),#f2f4f7;box-shadow:0 4px 10px #0000000d;padding:8px 16px}.text-highlighted{color:var(--Black, #101828);font-size:30px;line-height:38px}.text-sub{color:var(--Gray-700, #344054);font-size:14px;line-height:20px}.top-list{color:var(--Gray-500, #667085);font-size:12px;font-weight:500;line-height:18px}.nav-line-tabs .activated{border-bottom:3px solid var(--bs-primary)!important;transition:color .2s ease!important}.nav-line-tabs .activated a{color:var(--Primary-700, #009BF3)!important}.nav-line-tabs .activated :hover,.nav-item,.nav-item .nav-link:hover{border:0px!important}.nav-line-tabs :hover{border-bottom:3px solid var(--bs-primary)!important;transition:color .2s ease!important}.border-val{color:var(--Gray-700, #344054)!important;font-family:Inter;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}.table-title-primary{color:var(--Primary-700, #009BF3)!important;font-weight:500!important}.table-sub{line-height:30px!important;color:var(--Gray-500, #667085)!important}td{padding:16px 24px!important;line-height:36px!important}.img-src{width:25%;height:20%}.border-val{padding:16px;border-radius:12px;border:1px solid var(--Gray-200, #EAECF0);background:#fff;box-shadow:0 0 20px #4c577d05}.role-title{color:var(--Primary-600, #344054);font-size:16px;font-weight:600;line-height:24px}.col-md-4{width:31%!important}.user-list{color:var(--Gray-700, #344054);font-size:16px;line-height:24px}.rotate{rotate:180deg;transition:1s}\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: i3.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.PaginationComponent, selector: "lib-pagination", inputs: ["collection", "itemsPerPage", "currentPage", "totalItems", "directionLinks", "pageSize", "paginationSizes"], outputs: ["pageChange", "pageSizeChange"] }, { kind: "pipe", type: i6.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i6.DatePipe, name: "date" }] });
|
|
4963
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AuditUserListComponent, deps: [{ token: i1$1.NgbModal }, { token: i0.ChangeDetectorRef }, { token: i4.ToastService }, { token: i2.GlobalStateService }, { token: UserService }, { token: ExcelService }], target: i0.ɵɵFactoryTarget.Component });
|
|
4964
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: AuditUserListComponent, selector: "lib-audit-user-list", inputs: { viewuser: "viewuser", userDetails: "userDetails" }, outputs: { dataEmitter: "dataEmitter" }, ngImport: i0, template: "<div class=\"card p-0 rounded-3 mb-5\">\r\n <div class=\"card-header border-0\">\r\n <div class=\"card-title m-0\">\r\n <div class=\"d-flex align-items-center\">\r\n <span (click)=\"backTosummary()\" class=\"btn me-3 px-2 py-2 btn-outline\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M15.8332 10H4.1665M4.1665 10L9.99984 15.8333M4.1665 10L9.99984 4.16667\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"userData?.userName\" class=\"me-3 fw-bold\">{{(userDetails?.userName ? userDetails?.userName : userDetails?.userName) | titlecase}}</span> <span\r\n class=\"badge me-3 badge-light-default\">{{userData?.tangoUserType | titlecase}}</span><span\r\n class=\"badge me-3 badge-light-success\">{{userData?.role | titlecase}}</span>\r\n <span *ngIf=\"userData?.email\" class=\"me-3\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\"\r\n height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M14.6668 4.00001C14.6668 3.26667 14.0668 2.66667 13.3335 2.66667H2.66683C1.9335 2.66667 1.3335 3.26667 1.3335 4.00001M14.6668 4.00001V12C14.6668 12.7333 14.0668 13.3333 13.3335 13.3333H2.66683C1.9335 13.3333 1.3335 12.7333 1.3335 12V4.00001M14.6668 4.00001L8.00016 8.66667L1.3335 4.00001\"\r\n stroke=\"#667085\" stroke-width=\"1.4\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg> <span class=\"ms-2 top-list\">{{userData?.email}}</span></span>\r\n <span *ngIf=\"userData?.mobileNumber\" class=\"me-3\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\"\r\n height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_8096_7888)\">\r\n <path\r\n d=\"M16.5001 12.69V14.94C16.5009 15.1489 16.4581 15.3556 16.3745 15.547C16.2908 15.7384 16.168 15.9102 16.0141 16.0514C15.8602 16.1926 15.6785 16.3001 15.4806 16.367C15.2828 16.4339 15.0731 16.4588 14.8651 16.44C12.5572 16.1892 10.3403 15.4006 8.39257 14.1375C6.58044 12.986 5.04407 11.4496 3.89257 9.6375C2.62506 7.6809 1.83625 5.45324 1.59007 3.135C1.57133 2.9276 1.59598 2.71857 1.66245 2.52121C1.72892 2.32386 1.83575 2.14251 1.97615 1.98871C2.11654 1.83491 2.28743 1.71203 2.47792 1.62789C2.6684 1.54375 2.87433 1.50019 3.08257 1.5H5.33257C5.69655 1.49641 6.04942 1.62531 6.32539 1.86265C6.60137 2.09999 6.78163 2.42958 6.83257 2.79C6.92754 3.51005 7.10366 4.21704 7.35757 4.8975C7.45848 5.16594 7.48032 5.45768 7.4205 5.73816C7.36069 6.01863 7.22172 6.27608 7.02007 6.48L6.06757 7.4325C7.13524 9.31016 8.68991 10.8648 10.5676 11.9325L11.5201 10.98C11.724 10.7783 11.9814 10.6394 12.2619 10.5796C12.5424 10.5197 12.8341 10.5416 13.1026 10.6425C13.783 10.8964 14.49 11.0725 15.2101 11.1675C15.5744 11.2189 15.9071 11.4024 16.145 11.6831C16.3828 11.9638 16.5092 12.3222 16.5001 12.69Z\"\r\n stroke=\"#667085\" stroke-width=\"1.4\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_8096_7888\">\r\n <rect width=\"18\" height=\"18\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg> <span class=\"ms-2 top-list\">{{userData?.mobileNumber }}</span></span>\r\n <span *ngIf=\"userData?.clientAssigned\" class=\"me-3\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\"\r\n height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <path\r\n d=\"M12.75 15.75V14.25C12.75 13.4544 12.4339 12.6913 11.8713 12.1287C11.3087 11.5661 10.5456 11.25 9.75 11.25H3.75C2.95435 11.25 2.19129 11.5661 1.62868 12.1287C1.06607 12.6913 0.75 13.4544 0.75 14.25V15.75M17.25 15.75V14.25C17.2495 13.5853 17.0283 12.9396 16.621 12.4142C16.2138 11.8889 15.6436 11.5137 15 11.3475M12 2.3475C12.6453 2.51273 13.2173 2.88803 13.6257 3.41423C14.0342 3.94044 14.2559 4.58762 14.2559 5.25375C14.2559 5.91988 14.0342 6.56706 13.6257 7.09327C13.2173 7.61947 12.6453 7.99477 12 8.16M9.75 5.25C9.75 6.90685 8.40685 8.25 6.75 8.25C5.09315 8.25 3.75 6.90685 3.75 5.25C3.75 3.59315 5.09315 2.25 6.75 2.25C8.40685 2.25 9.75 3.59315 9.75 5.25Z\"\r\n stroke=\"#667085\" stroke-width=\"1.4\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2 top-list\">Clients Assigned:{{userData?.clientAssigned ?? 0}}</span></span>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n<div class=\"card p-3 rounded-3 mb-5\">\r\n <div class=\"w-100 p-5 bg-highlighted d-flex align-items-center\">\r\n <span class=\"fw-bold text-highlighted\">\u20B9 {{consolidatedData?.totalCredit ? consolidatedData?.totalCredit.toFixed(2) : 0}}</span><span\r\n class=\"fw-semibold text-sub ms-3\">{{consolidatedData?.message}}\r\n <!-- {{headerFilter?.date?.startDate}} \u2013 {{headerFilter?.date?.endDate}} -->\r\n </span>\r\n </div>\r\n <div class=\"d-flex justify-content-between align-items-center px-5 py-5\">\r\n <div class=\"Boxes\">\r\n <div class=\"box-header\">{{consolidatedData?.totalFiles ?? 0}}</div>\r\n <div class=\"box-label fw-semibold\">Total Files</div>\r\n </div>\r\n <div class=\"Boxes\">\r\n <div class=\"box-header\">{{consolidatedData?.totalBC ?? 0}}</div>\r\n <div class=\"box-label fw-semibold\">Before Count</div>\r\n </div>\r\n <div class=\"Boxes\">\r\n <div class=\"box-header\">{{consolidatedData?.totalAC ?? 0}}</div>\r\n <div class=\"box-label fw-semibold\">After Count</div>\r\n </div>\r\n <div class=\"Boxes\">\r\n <div class=\"box-header\">{{consolidatedData?.totalEarnings ? consolidatedData?.totalEarnings.toFixed(2) : 0}}</div>\r\n <div class=\"box-label fw-semibold\">Total Earnings</div>\r\n </div>\r\n <div class=\"Boxes\">\r\n <div class=\"box-header\">{{consolidatedData?.totalReducedAmount ? consolidatedData?.totalReducedAmount.toFixed(2) : 0}}</div>\r\n <div class=\"box-label fw-semibold\">Total Reduced Amount</div>\r\n </div>\r\n </div>\r\n</div>\r\n<div class=\"card\">\r\n <div class=\"card-header border-0 pt-3 mb-5\">\r\n <div class=\"card-title d-grid\">\r\n <div class=\"title\">Summary Table</div>\r\n <div class=\"text-sub\">Based on {{headerFilter?.date?.startDate | date:'dd MMM, yyyy'}} \u2013 {{headerFilter?.date?.endDate | date:'dd MMM, yyyy'}}</div>\r\n </div>\r\n <div class=\"card-toolbar\">\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\"></rect>\r\n <path\r\n d=\"M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z\"\r\n fill=\"currentColor\"></path>\r\n </svg>\r\n </span>\r\n <input type=\"text\" (change)=\"searchData()\" [(ngModel)]=\"searchValue\" class=\"form-control ps-14 me-2\"\r\n name=\"search\" autocomplete=\"off\" placeholder=\"Search\" autocomplete=\"off\" />\r\n @if (!loading && !noData) {\r\n <!-- @if ((gs.userAccess |async)?.Global_User_isEdit) { -->\r\n <button *ngIf=\"!noData && !loading\" type=\"button\" (click)=\"exportXLSX()\"\r\n class=\"btn btn-default px-4 py-3 mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M8.125 13.125H16.3562L14.7438 14.7438L15.625 15.625L18.75 12.5L15.625 9.375L14.7438 10.2562L16.3562 11.875H8.125V13.125Z\"\r\n fill=\"black\" />\r\n <path\r\n d=\"M13.75 8.75V6.25C13.7505 6.16775 13.7347 6.08621 13.7036 6.01006C13.6725 5.93391 13.6267 5.86465 13.5688 5.80625L9.19375 1.43125C9.13535 1.37333 9.06609 1.3275 8.98994 1.2964C8.91379 1.26529 8.83225 1.24953 8.75 1.25H2.5C2.16848 1.25 1.85054 1.3817 1.61612 1.61612C1.3817 1.85054 1.25 2.16848 1.25 2.5V17.5C1.25 17.8315 1.3817 18.1495 1.61612 18.3839C1.85054 18.6183 2.16848 18.75 2.5 18.75H12.5C12.8315 18.75 13.1495 18.6183 13.3839 18.3839C13.6183 18.1495 13.75 17.8315 13.75 17.5V16.25H12.5V17.5H2.5V2.5H7.5V6.25C7.5 6.58152 7.6317 6.89947 7.86612 7.13389C8.10054 7.36831 8.41848 7.5 8.75 7.5H12.5V8.75H13.75ZM8.75 6.25V2.75625L12.2438 6.25H8.75Z\"\r\n fill=\"black\" />\r\n </svg><span class=\"ms-2\">Export</span> </button>\r\n <!-- } -->\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"card-body p-0\">\r\n <div class=\"table-responsive\">\r\n <table class=\"table bottom-border text-nowrap \">\r\n <thead>\r\n <tr>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('fileDate')\">File Date\r\n <svg [ngClass]=\"sortColumName === 'fileDate' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'fileDate' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('totalFilesCount')\">Total Files\r\n <svg [ngClass]=\"sortColumName === 'totalFilesCount' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'totalFilesCount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('totalBeforeCount')\">Total BC\r\n <svg [ngClass]=\"sortColumName === 'totalBeforeCount' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'totalBeforeCount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('totalAfterCount')\">Total AC\r\n <svg [ngClass]=\"sortColumName === 'totalAfterCount' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'totalAfterCount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('totalEarn')\">Total Earnings(Rs)\r\n <svg [ngClass]=\"sortColumName === 'totalEarn' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'totalEarn' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('deductionByMinimumTarget')\">Deduction by Minimum\r\n Target\r\n <svg [ngClass]=\"sortColumName === 'deductionByMinimumTarget' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'deductionByMinimumTarget' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('deductionByMapping')\">Deduction by Mapping\r\n <svg [ngClass]=\"sortColumName === 'deductionByMapping' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'deductionByMapping' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('deductionByLateLogin')\">Deduction by Late Login\r\n <svg [ngClass]=\"sortColumName === 'deductionByLateLogin' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'deductionByLateLogin' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('totalReducedAmount')\">Total Reduced Amount\r\n <svg [ngClass]=\"sortColumName === 'totalReducedAmount' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'totalReducedAmount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('totalCredit')\">Total Credit\r\n <svg [ngClass]=\"sortColumName === 'totalCredit' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'totalCredit' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody class=\"fw-semibold\">\r\n <ng-container *ngFor=\"let user of userList;let i=index;\">\r\n <tr>\r\n <td>{{user?.fileDate ?? '--'}}</td>\r\n <td>{{user?.totalFilesCount ?? '--'}}</td>\r\n <td>{{user?.totalBeforeCount ?? '--'}}</td>\r\n <td>{{user?.totalAfterCount ?? '--'}}</td>\r\n <td>{{user?.totalEarn ? user?.totalEarn.toFixed(2) : 0}}</td>\r\n <td>{{user?.deductionByMinimumTarget ? user?.deductionByMinimumTarget.toFixed(2) : 0}}</td>\r\n <td>{{user?.deductionByMapping ? user?.deductionByMapping.toFixed(2) : 0}}</td>\r\n <td>{{user.deductionByLateLogin ? user.deductionByLateLogin.toFixed(2) : 0}}\r\n </td>\r\n <td>{{user?.totalReducedAmount ? user?.totalReducedAmount.toFixed(2) : 0}}</td>\r\n <td>{{user?.totalCredit ? user?.totalCredit.toFixed(2) : 0}}</td>\r\n </tr>\r\n </ng-container>\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12 my-3\">\r\n <lib-pagination *ngIf=\"userList.length!==0\" [itemsPerPage]=\"pagination.limit\" [currentPage]=\"pagination.offset\"\r\n [totalItems]=\"totalCount\" [paginationSizes]=\"paginationSizes\" [pageSize]=\"paginationSize()\"\r\n (pageChange)=\"onPageChange($event)\" (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n <div *ngIf=\"loading\" class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"noData\" class=\"row\">\r\n <!-- <div class=\"row\"> -->\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-nodata\" src=\"./assets/tango/Icons/Nodata1.svg\" alt=\"\">\r\n <div class=\"nodata-title\">No data found</div>\r\n <div class=\"nodata-sub\">There is no result for this Date</div>\r\n </div>\r\n </div>\r\n <!-- </div> -->\r\n </div>\r\n</div>", styles: [".Boxes .box-header{color:var(--Black, #101828);font-size:20px;font-weight:700;line-height:30px}.Boxes .box-label{color:var(--Black, #101828);font-size:14px;line-height:20px}.card-title .title{color:var(--Gray-900, #101828);font-size:18px;font-weight:600;line-height:28px}.card-title .text-sub{color:var(--Gray-500, #667085);font-size:14px;font-weight:400;line-height:20px}.bg-highlighted{border-radius:6px;border-bottom:2px solid var(--Gray-200, #EAECF0);background:radial-gradient(206.89% 107.47% at 16.16% 32.77%,#fff6,#45bbfe33),#f2f4f7;box-shadow:0 4px 10px #0000000d;padding:8px 16px}.text-highlighted{color:var(--Black, #101828);font-size:30px;line-height:38px}.text-sub{color:var(--Gray-700, #344054);font-size:14px;line-height:20px}.top-list{color:var(--Gray-500, #667085);font-size:12px;font-weight:500;line-height:18px}.nav-line-tabs .activated{border-bottom:3px solid var(--bs-primary)!important;transition:color .2s ease!important}.nav-line-tabs .activated a{color:var(--Primary-700, #009BF3)!important}.nav-line-tabs .activated :hover,.nav-item,.nav-item .nav-link:hover{border:0px!important}.nav-line-tabs :hover{border-bottom:3px solid var(--bs-primary)!important;transition:color .2s ease!important}.border-val{color:var(--Gray-700, #344054)!important;font-family:Inter;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}.table-title-primary{color:var(--Primary-700, #009BF3)!important;font-weight:500!important}.table-sub{line-height:30px!important;color:var(--Gray-500, #667085)!important}td{padding:16px 24px!important;line-height:36px!important}.img-src{width:25%;height:20%}.border-val{padding:16px;border-radius:12px;border:1px solid var(--Gray-200, #EAECF0);background:#fff;box-shadow:0 0 20px #4c577d05}.role-title{color:var(--Primary-600, #344054);font-size:16px;font-weight:600;line-height:24px}.col-md-4{width:31%!important}.user-list{color:var(--Gray-700, #344054);font-size:16px;line-height:24px}.rotate{rotate:180deg;transition:1s}\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: i3.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.PaginationComponent, selector: "lib-pagination", inputs: ["collection", "itemsPerPage", "currentPage", "totalItems", "directionLinks", "pageSize", "paginationSizes"], outputs: ["pageChange", "pageSizeChange"] }, { kind: "pipe", type: i6.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i6.DatePipe, name: "date" }] });
|
|
4335
4965
|
}
|
|
4336
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
4966
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AuditUserListComponent, decorators: [{
|
|
4337
4967
|
type: Component,
|
|
4338
4968
|
args: [{ selector: 'lib-audit-user-list', template: "<div class=\"card p-0 rounded-3 mb-5\">\r\n <div class=\"card-header border-0\">\r\n <div class=\"card-title m-0\">\r\n <div class=\"d-flex align-items-center\">\r\n <span (click)=\"backTosummary()\" class=\"btn me-3 px-2 py-2 btn-outline\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M15.8332 10H4.1665M4.1665 10L9.99984 15.8333M4.1665 10L9.99984 4.16667\"\r\n stroke=\"#344054\" stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </span>\r\n <span *ngIf=\"userData?.userName\" class=\"me-3 fw-bold\">{{(userDetails?.userName ? userDetails?.userName : userDetails?.userName) | titlecase}}</span> <span\r\n class=\"badge me-3 badge-light-default\">{{userData?.tangoUserType | titlecase}}</span><span\r\n class=\"badge me-3 badge-light-success\">{{userData?.role | titlecase}}</span>\r\n <span *ngIf=\"userData?.email\" class=\"me-3\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\"\r\n height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\">\r\n <path\r\n d=\"M14.6668 4.00001C14.6668 3.26667 14.0668 2.66667 13.3335 2.66667H2.66683C1.9335 2.66667 1.3335 3.26667 1.3335 4.00001M14.6668 4.00001V12C14.6668 12.7333 14.0668 13.3333 13.3335 13.3333H2.66683C1.9335 13.3333 1.3335 12.7333 1.3335 12V4.00001M14.6668 4.00001L8.00016 8.66667L1.3335 4.00001\"\r\n stroke=\"#667085\" stroke-width=\"1.4\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg> <span class=\"ms-2 top-list\">{{userData?.email}}</span></span>\r\n <span *ngIf=\"userData?.mobileNumber\" class=\"me-3\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\"\r\n height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_8096_7888)\">\r\n <path\r\n d=\"M16.5001 12.69V14.94C16.5009 15.1489 16.4581 15.3556 16.3745 15.547C16.2908 15.7384 16.168 15.9102 16.0141 16.0514C15.8602 16.1926 15.6785 16.3001 15.4806 16.367C15.2828 16.4339 15.0731 16.4588 14.8651 16.44C12.5572 16.1892 10.3403 15.4006 8.39257 14.1375C6.58044 12.986 5.04407 11.4496 3.89257 9.6375C2.62506 7.6809 1.83625 5.45324 1.59007 3.135C1.57133 2.9276 1.59598 2.71857 1.66245 2.52121C1.72892 2.32386 1.83575 2.14251 1.97615 1.98871C2.11654 1.83491 2.28743 1.71203 2.47792 1.62789C2.6684 1.54375 2.87433 1.50019 3.08257 1.5H5.33257C5.69655 1.49641 6.04942 1.62531 6.32539 1.86265C6.60137 2.09999 6.78163 2.42958 6.83257 2.79C6.92754 3.51005 7.10366 4.21704 7.35757 4.8975C7.45848 5.16594 7.48032 5.45768 7.4205 5.73816C7.36069 6.01863 7.22172 6.27608 7.02007 6.48L6.06757 7.4325C7.13524 9.31016 8.68991 10.8648 10.5676 11.9325L11.5201 10.98C11.724 10.7783 11.9814 10.6394 12.2619 10.5796C12.5424 10.5197 12.8341 10.5416 13.1026 10.6425C13.783 10.8964 14.49 11.0725 15.2101 11.1675C15.5744 11.2189 15.9071 11.4024 16.145 11.6831C16.3828 11.9638 16.5092 12.3222 16.5001 12.69Z\"\r\n stroke=\"#667085\" stroke-width=\"1.4\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_8096_7888\">\r\n <rect width=\"18\" height=\"18\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg> <span class=\"ms-2 top-list\">{{userData?.mobileNumber }}</span></span>\r\n <span *ngIf=\"userData?.clientAssigned\" class=\"me-3\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"18\"\r\n height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\">\r\n <path\r\n d=\"M12.75 15.75V14.25C12.75 13.4544 12.4339 12.6913 11.8713 12.1287C11.3087 11.5661 10.5456 11.25 9.75 11.25H3.75C2.95435 11.25 2.19129 11.5661 1.62868 12.1287C1.06607 12.6913 0.75 13.4544 0.75 14.25V15.75M17.25 15.75V14.25C17.2495 13.5853 17.0283 12.9396 16.621 12.4142C16.2138 11.8889 15.6436 11.5137 15 11.3475M12 2.3475C12.6453 2.51273 13.2173 2.88803 13.6257 3.41423C14.0342 3.94044 14.2559 4.58762 14.2559 5.25375C14.2559 5.91988 14.0342 6.56706 13.6257 7.09327C13.2173 7.61947 12.6453 7.99477 12 8.16M9.75 5.25C9.75 6.90685 8.40685 8.25 6.75 8.25C5.09315 8.25 3.75 6.90685 3.75 5.25C3.75 3.59315 5.09315 2.25 6.75 2.25C8.40685 2.25 9.75 3.59315 9.75 5.25Z\"\r\n stroke=\"#667085\" stroke-width=\"1.4\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2 top-list\">Clients Assigned:{{userData?.clientAssigned ?? 0}}</span></span>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n<div class=\"card p-3 rounded-3 mb-5\">\r\n <div class=\"w-100 p-5 bg-highlighted d-flex align-items-center\">\r\n <span class=\"fw-bold text-highlighted\">\u20B9 {{consolidatedData?.totalCredit ? consolidatedData?.totalCredit.toFixed(2) : 0}}</span><span\r\n class=\"fw-semibold text-sub ms-3\">{{consolidatedData?.message}}\r\n <!-- {{headerFilter?.date?.startDate}} \u2013 {{headerFilter?.date?.endDate}} -->\r\n </span>\r\n </div>\r\n <div class=\"d-flex justify-content-between align-items-center px-5 py-5\">\r\n <div class=\"Boxes\">\r\n <div class=\"box-header\">{{consolidatedData?.totalFiles ?? 0}}</div>\r\n <div class=\"box-label fw-semibold\">Total Files</div>\r\n </div>\r\n <div class=\"Boxes\">\r\n <div class=\"box-header\">{{consolidatedData?.totalBC ?? 0}}</div>\r\n <div class=\"box-label fw-semibold\">Before Count</div>\r\n </div>\r\n <div class=\"Boxes\">\r\n <div class=\"box-header\">{{consolidatedData?.totalAC ?? 0}}</div>\r\n <div class=\"box-label fw-semibold\">After Count</div>\r\n </div>\r\n <div class=\"Boxes\">\r\n <div class=\"box-header\">{{consolidatedData?.totalEarnings ? consolidatedData?.totalEarnings.toFixed(2) : 0}}</div>\r\n <div class=\"box-label fw-semibold\">Total Earnings</div>\r\n </div>\r\n <div class=\"Boxes\">\r\n <div class=\"box-header\">{{consolidatedData?.totalReducedAmount ? consolidatedData?.totalReducedAmount.toFixed(2) : 0}}</div>\r\n <div class=\"box-label fw-semibold\">Total Reduced Amount</div>\r\n </div>\r\n </div>\r\n</div>\r\n<div class=\"card\">\r\n <div class=\"card-header border-0 pt-3 mb-5\">\r\n <div class=\"card-title d-grid\">\r\n <div class=\"title\">Summary Table</div>\r\n <div class=\"text-sub\">Based on {{headerFilter?.date?.startDate | date:'dd MMM, yyyy'}} \u2013 {{headerFilter?.date?.endDate | date:'dd MMM, yyyy'}}</div>\r\n </div>\r\n <div class=\"card-toolbar\">\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\"></rect>\r\n <path\r\n d=\"M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z\"\r\n fill=\"currentColor\"></path>\r\n </svg>\r\n </span>\r\n <input type=\"text\" (change)=\"searchData()\" [(ngModel)]=\"searchValue\" class=\"form-control ps-14 me-2\"\r\n name=\"search\" autocomplete=\"off\" placeholder=\"Search\" autocomplete=\"off\" />\r\n @if (!loading && !noData) {\r\n <!-- @if ((gs.userAccess |async)?.Global_User_isEdit) { -->\r\n <button *ngIf=\"!noData && !loading\" type=\"button\" (click)=\"exportXLSX()\"\r\n class=\"btn btn-default px-4 py-3 mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M8.125 13.125H16.3562L14.7438 14.7438L15.625 15.625L18.75 12.5L15.625 9.375L14.7438 10.2562L16.3562 11.875H8.125V13.125Z\"\r\n fill=\"black\" />\r\n <path\r\n d=\"M13.75 8.75V6.25C13.7505 6.16775 13.7347 6.08621 13.7036 6.01006C13.6725 5.93391 13.6267 5.86465 13.5688 5.80625L9.19375 1.43125C9.13535 1.37333 9.06609 1.3275 8.98994 1.2964C8.91379 1.26529 8.83225 1.24953 8.75 1.25H2.5C2.16848 1.25 1.85054 1.3817 1.61612 1.61612C1.3817 1.85054 1.25 2.16848 1.25 2.5V17.5C1.25 17.8315 1.3817 18.1495 1.61612 18.3839C1.85054 18.6183 2.16848 18.75 2.5 18.75H12.5C12.8315 18.75 13.1495 18.6183 13.3839 18.3839C13.6183 18.1495 13.75 17.8315 13.75 17.5V16.25H12.5V17.5H2.5V2.5H7.5V6.25C7.5 6.58152 7.6317 6.89947 7.86612 7.13389C8.10054 7.36831 8.41848 7.5 8.75 7.5H12.5V8.75H13.75ZM8.75 6.25V2.75625L12.2438 6.25H8.75Z\"\r\n fill=\"black\" />\r\n </svg><span class=\"ms-2\">Export</span> </button>\r\n <!-- } -->\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"card-body p-0\">\r\n <div class=\"table-responsive\">\r\n <table class=\"table bottom-border text-nowrap \">\r\n <thead>\r\n <tr>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('fileDate')\">File Date\r\n <svg [ngClass]=\"sortColumName === 'fileDate' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'fileDate' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('totalFilesCount')\">Total Files\r\n <svg [ngClass]=\"sortColumName === 'totalFilesCount' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'totalFilesCount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('totalBeforeCount')\">Total BC\r\n <svg [ngClass]=\"sortColumName === 'totalBeforeCount' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'totalBeforeCount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('totalAfterCount')\">Total AC\r\n <svg [ngClass]=\"sortColumName === 'totalAfterCount' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'totalAfterCount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('totalEarn')\">Total Earnings(Rs)\r\n <svg [ngClass]=\"sortColumName === 'totalEarn' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'totalEarn' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('deductionByMinimumTarget')\">Deduction by Minimum\r\n Target\r\n <svg [ngClass]=\"sortColumName === 'deductionByMinimumTarget' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'deductionByMinimumTarget' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('deductionByMapping')\">Deduction by Mapping\r\n <svg [ngClass]=\"sortColumName === 'deductionByMapping' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'deductionByMapping' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('deductionByLateLogin')\">Deduction by Late Login\r\n <svg [ngClass]=\"sortColumName === 'deductionByLateLogin' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'deductionByLateLogin' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('totalReducedAmount')\">Total Reduced Amount\r\n <svg [ngClass]=\"sortColumName === 'totalReducedAmount' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'totalReducedAmount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('totalCredit')\">Total Credit\r\n <svg [ngClass]=\"sortColumName === 'totalCredit' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'totalCredit' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody class=\"fw-semibold\">\r\n <ng-container *ngFor=\"let user of userList;let i=index;\">\r\n <tr>\r\n <td>{{user?.fileDate ?? '--'}}</td>\r\n <td>{{user?.totalFilesCount ?? '--'}}</td>\r\n <td>{{user?.totalBeforeCount ?? '--'}}</td>\r\n <td>{{user?.totalAfterCount ?? '--'}}</td>\r\n <td>{{user?.totalEarn ? user?.totalEarn.toFixed(2) : 0}}</td>\r\n <td>{{user?.deductionByMinimumTarget ? user?.deductionByMinimumTarget.toFixed(2) : 0}}</td>\r\n <td>{{user?.deductionByMapping ? user?.deductionByMapping.toFixed(2) : 0}}</td>\r\n <td>{{user.deductionByLateLogin ? user.deductionByLateLogin.toFixed(2) : 0}}\r\n </td>\r\n <td>{{user?.totalReducedAmount ? user?.totalReducedAmount.toFixed(2) : 0}}</td>\r\n <td>{{user?.totalCredit ? user?.totalCredit.toFixed(2) : 0}}</td>\r\n </tr>\r\n </ng-container>\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12 my-3\">\r\n <lib-pagination *ngIf=\"userList.length!==0\" [itemsPerPage]=\"pagination.limit\" [currentPage]=\"pagination.offset\"\r\n [totalItems]=\"totalCount\" [paginationSizes]=\"paginationSizes\" [pageSize]=\"paginationSize()\"\r\n (pageChange)=\"onPageChange($event)\" (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n <div *ngIf=\"loading\" class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"noData\" class=\"row\">\r\n <!-- <div class=\"row\"> -->\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-nodata\" src=\"./assets/tango/Icons/Nodata1.svg\" alt=\"\">\r\n <div class=\"nodata-title\">No data found</div>\r\n <div class=\"nodata-sub\">There is no result for this Date</div>\r\n </div>\r\n </div>\r\n <!-- </div> -->\r\n </div>\r\n</div>", styles: [".Boxes .box-header{color:var(--Black, #101828);font-size:20px;font-weight:700;line-height:30px}.Boxes .box-label{color:var(--Black, #101828);font-size:14px;line-height:20px}.card-title .title{color:var(--Gray-900, #101828);font-size:18px;font-weight:600;line-height:28px}.card-title .text-sub{color:var(--Gray-500, #667085);font-size:14px;font-weight:400;line-height:20px}.bg-highlighted{border-radius:6px;border-bottom:2px solid var(--Gray-200, #EAECF0);background:radial-gradient(206.89% 107.47% at 16.16% 32.77%,#fff6,#45bbfe33),#f2f4f7;box-shadow:0 4px 10px #0000000d;padding:8px 16px}.text-highlighted{color:var(--Black, #101828);font-size:30px;line-height:38px}.text-sub{color:var(--Gray-700, #344054);font-size:14px;line-height:20px}.top-list{color:var(--Gray-500, #667085);font-size:12px;font-weight:500;line-height:18px}.nav-line-tabs .activated{border-bottom:3px solid var(--bs-primary)!important;transition:color .2s ease!important}.nav-line-tabs .activated a{color:var(--Primary-700, #009BF3)!important}.nav-line-tabs .activated :hover,.nav-item,.nav-item .nav-link:hover{border:0px!important}.nav-line-tabs :hover{border-bottom:3px solid var(--bs-primary)!important;transition:color .2s ease!important}.border-val{color:var(--Gray-700, #344054)!important;font-family:Inter;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}.table-title-primary{color:var(--Primary-700, #009BF3)!important;font-weight:500!important}.table-sub{line-height:30px!important;color:var(--Gray-500, #667085)!important}td{padding:16px 24px!important;line-height:36px!important}.img-src{width:25%;height:20%}.border-val{padding:16px;border-radius:12px;border:1px solid var(--Gray-200, #EAECF0);background:#fff;box-shadow:0 0 20px #4c577d05}.role-title{color:var(--Primary-600, #344054);font-size:16px;font-weight:600;line-height:24px}.col-md-4{width:31%!important}.user-list{color:var(--Gray-700, #344054);font-size:16px;line-height:24px}.rotate{rotate:180deg;transition:1s}\n"] }]
|
|
4339
4969
|
}], ctorParameters: () => [{ type: i1$1.NgbModal }, { type: i0.ChangeDetectorRef }, { type: i4.ToastService }, { type: i2.GlobalStateService }, { type: UserService }, { type: ExcelService }], propDecorators: { viewuser: [{
|
|
@@ -4531,10 +5161,10 @@ class AuditUserEarningsComponent {
|
|
|
4531
5161
|
this.sortColumName = undefined;
|
|
4532
5162
|
this.loadTable();
|
|
4533
5163
|
}
|
|
4534
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
4535
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.11", type: AuditUserEarningsComponent, selector: "lib-audit-user-earnings", ngImport: i0, template: "<div *ngIf=\"!viewuser\" class=\"card\">\r\n <div class=\"card-header border-0 pt-3\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <div class=\"d-flex overflow-auto h-50px\">\r\n <ul\r\n class=\"nav nav-stretch w-100 nav-line-tabs nav-line-tabs-2x border-bottom-2 fs-5 fw-bolder flex-nowrap\">\r\n <li class=\"nav-item cursor-pointer px-5 me-5 text-center\"><a routerLink=\"/manage/users/tango\"\r\n class=\"nav-link mx-0 text-active-primary\">Users</a>\r\n </li>\r\n <li class=\"nav-item activated px-5 me-5 bg-light-primary cursor-pointer\"><a\r\n class=\"nav-link text-active-primary mx-0\">Audit Users\r\n Summary</a>\r\n </li>\r\n </ul>\r\n </div>\r\n <span class=\"text-sub mb-2 mt-5\">{{pagination?.totalCount}} total users</span>\r\n </h3>\r\n <div class=\"card-toolbar\">\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\"></rect>\r\n <path\r\n d=\"M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z\"\r\n fill=\"currentColor\"></path>\r\n </svg>\r\n </span>\r\n <input type=\"text\" (change)=\"searchData()\" [(ngModel)]=\"searchValue\" class=\"form-control ps-14 me-2\"\r\n name=\"search\" autocomplete=\"off\" placeholder=\"Search\" autocomplete=\"off\" />\r\n @if (!loading && !noData) {\r\n <!-- @if ((gs.userAccess |async)?.Global_User_isEdit) { -->\r\n <button *ngIf=\"!noData && !loading\" type=\"button\" (click)=\"exportXLSX()\"\r\n class=\"btn py-3 px-4 btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M8.125 13.125H16.3562L14.7438 14.7438L15.625 15.625L18.75 12.5L15.625 9.375L14.7438 10.2562L16.3562 11.875H8.125V13.125Z\"\r\n fill=\"black\" />\r\n <path\r\n d=\"M13.75 8.75V6.25C13.7505 6.16775 13.7347 6.08621 13.7036 6.01006C13.6725 5.93391 13.6267 5.86465 13.5688 5.80625L9.19375 1.43125C9.13535 1.37333 9.06609 1.3275 8.98994 1.2964C8.91379 1.26529 8.83225 1.24953 8.75 1.25H2.5C2.16848 1.25 1.85054 1.3817 1.61612 1.61612C1.3817 1.85054 1.25 2.16848 1.25 2.5V17.5C1.25 17.8315 1.3817 18.1495 1.61612 18.3839C1.85054 18.6183 2.16848 18.75 2.5 18.75H12.5C12.8315 18.75 13.1495 18.6183 13.3839 18.3839C13.6183 18.1495 13.75 17.8315 13.75 17.5V16.25H12.5V17.5H2.5V2.5H7.5V6.25C7.5 6.58152 7.6317 6.89947 7.86612 7.13389C8.10054 7.36831 8.41848 7.5 8.75 7.5H12.5V8.75H13.75ZM8.75 6.25V2.75625L12.2438 6.25H8.75Z\"\r\n fill=\"black\" />\r\n </svg><span class=\"ms-2\">Export</span> </button>\r\n\r\n <!-- <button *ngIf=\"!noData && !loading\" type=\"button\" (click)=\"generateReport()\"\r\n class=\"btn py-3 px-4 btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\"><span\r\n class=\"ms-2\">Generate</span> </button> -->\r\n\r\n\r\n <!-- } -->\r\n }\r\n @if ((gs.userAccess | async)?.Global_User_isAdd) {\r\n <button type=\"button\" (click)=\"addUsers('add')\"\r\n class=\"btn btn-primary mx-2 rounded-3 text-nowrap\"><svg xmlns=\"http://www.w3.org/2000/svg\"\r\n width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M10.0001 4.16663V15.8333M4.16675 9.99996H15.8334\" stroke=\"white\"\r\n stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2 text-white\">Add User</span> </button>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"card-body p-0\">\r\n <div class=\"table-responsive\">\r\n <table class=\"table bottom-border text-nowrap \">\r\n <thead>\r\n <tr>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('userName')\">Name\r\n <svg [ngClass]=\"sortColumName === 'userName' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'userName' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('fileDateFrom')\">File Date From\r\n <svg [ngClass]=\"sortColumName === 'fileDateFrom' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'fileDateFrom' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('fileDateTo')\">File Date To\r\n <svg [ngClass]=\"sortColumName === 'fileDateTo' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'fileDateTo' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('noOfDays')\">No.of Days\r\n <svg [ngClass]=\"sortColumName === 'noOfDays' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'noOfDays' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('totalFiles')\">Total Files\r\n <svg [ngClass]=\"sortColumName === 'totalFiles' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'totalFiles' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('totalBC')\">Total BC\r\n <svg [ngClass]=\"sortColumName === 'totalBC' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'totalBC' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('totalAC')\">Total AC\r\n <svg [ngClass]=\"sortColumName === 'totalAC' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'totalAC' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('totalEarnings')\">Total Earnings(Rs)\r\n <svg [ngClass]=\"sortColumName === 'totalEarnings' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'totalEarnings' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('bcCredit')\">BC Credit\r\n <svg [ngClass]=\"sortColumName === 'bcCredit' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'bcCredit' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('acCredit')\">AC Credit\r\n <svg [ngClass]=\"sortColumName === 'acCredit' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'acCredit' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('deductionbyMinimumTarget')\">Deduction by Minimum\r\n Target\r\n <svg [ngClass]=\"sortColumName === 'deductionbyMinimumTarget' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'deductionbyMinimumTarget' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('deductionbyMapping')\">Deduction by Mapping\r\n <svg [ngClass]=\"sortColumName === 'deductionbyMapping' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'deductionbyMapping' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('deductionbyLateLogin')\">Deduction by Late Login\r\n <svg [ngClass]=\"sortColumName === 'deductionbyLateLogin' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'deductionbyLateLogin' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('totalReducedAmount')\">Total Reduced Amount\r\n <svg [ngClass]=\"sortColumName === 'totalReducedAmount' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'totalReducedAmount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('totalCredit')\">Total Credit\r\n <svg [ngClass]=\"sortColumName === 'totalCredit' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'totalCredit' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th>Actions</th>\r\n </tr>\r\n </thead>\r\n <tbody class=\"fw-semibold\">\r\n <ng-container *ngFor=\"let user of userList;let i=index;\">\r\n <tr>\r\n <td>{{user?.userName ? user?.userName : '--'}}</td>\r\n <td>{{user?.fileDateFrom ? user?.fileDateFrom : '--'}}</td>\r\n <td>{{user?.fileDateTo ? user?.fileDateTo : '--'}}</td>\r\n <td>{{user?.noOfDays ? user?.noOfDays : 0}}</td>\r\n <td>{{user?.totalFiles ?? '--'}}</td>\r\n <td>{{user?.totalBC ?? '--'}}</td>\r\n <td>{{user?.totalAC ?? '--'}}</td>\r\n <td>{{user?.totalEarnings ? user?.totalEarnings.toFixed(2) : 0}}</td>\r\n <td>{{user.bcCredit ? user.bcCredit.toFixed(2) : 0}}</td>\r\n <td>{{user?.acCredit ? user?.acCredit.toFixed(2) : 0}}</td>\r\n <td>{{user?.deductionbyMinimumTarget ? user?.deductionbyMinimumTarget.toFixed(2) : 0}}</td>\r\n <td>{{user?.deductionbyMapping ? user?.deductionbyMapping.toFixed(2) : 0}}</td>\r\n <td>{{user?.deductionbyLateLogin ? user?.deductionbyLateLogin.toFixed(2) : 0}}</td>\r\n <td>{{user?.totalReducedAmount ? user?.totalReducedAmount.toFixed(2) : 0}}</td>\r\n <td>{{user?.totalCredit ? user?.totalCredit.toFixed(2) : 0}}</td>\r\n <td>\r\n <div class=\"d-flex\">\r\n <span class=\"cursor-pointer\" (click)=\"Viewusers('view',user)\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\"\r\n viewBox=\"0 0 21 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_1995_16400)\">\r\n <path\r\n d=\"M1.33325 10C1.33325 10 4.66658 3.33337 10.4999 3.33337C16.3333 3.33337 19.6666 10 19.6666 10C19.6666 10 16.3333 16.6667 10.4999 16.6667C4.66658 16.6667 1.33325 10 1.33325 10Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10.4999 12.5C11.8806 12.5 12.9999 11.3808 12.9999 10C12.9999 8.61933 11.8806 7.50004 10.4999 7.50004C9.11921 7.50004 7.99992 8.61933 7.99992 10C7.99992 11.3808 9.11921 12.5 10.4999 12.5Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_1995_16400\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\"\r\n transform=\"translate(0.5)\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n </div>\r\n </td>\r\n </tr>\r\n </ng-container>\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12 my-3\">\r\n <lib-pagination *ngIf=\"userList.length!==0\" [itemsPerPage]=\"pagination.limit\" [currentPage]=\"pagination.offset\"\r\n [totalItems]=\"pagination.totalCount\" [paginationSizes]=\"paginationSizes\" [pageSize]=\"paginationSize()\"\r\n (pageChange)=\"onPageChange($event)\" (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n <div *ngIf=\"loading\" class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"noData\" class=\"row\">\r\n <!-- <div class=\"row\"> -->\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-nodata\" src=\"./assets/tango/Icons/Nodata1.svg\" alt=\"\">\r\n <div class=\"nodata-title\">No data found</div>\r\n <div class=\"nodata-sub\">There is no result for this Date</div>\r\n </div>\r\n </div>\r\n <!-- </div> -->\r\n </div>\r\n</div>\r\n<div *ngIf=\"viewuser\">\r\n <lib-audit-user-list (dataEmitter)=\"receivedData($event)\" [viewuser]=\"viewuser\"\r\n [userDetails]=\"userDetails\"></lib-audit-user-list>\r\n</div>", styles: [".nav-line-tabs .activated{border-bottom:3px solid var(--bs-primary)!important;transition:color .2s ease!important}.nav-line-tabs .activated a{color:var(--Primary-700, #009BF3)!important}.nav-line-tabs .activated :hover,.nav-item,.nav-item .nav-link:hover{border:0px!important}.nav-line-tabs :hover{border-bottom:3px solid var(--bs-primary)!important;transition:color .2s ease!important}.border-val{color:var(--Gray-700, #344054)!important;font-family:Inter;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}.table-title-primary{color:var(--Primary-700, #009BF3)!important;font-weight:500!important}.table-sub{line-height:30px!important;color:var(--Gray-500, #667085)!important}td{padding:16px 24px!important;line-height:36px!important}.img-src{width:25%;height:20%}.border-val{padding:16px;border-radius:12px;border:1px solid var(--Gray-200, #EAECF0);background:#fff;box-shadow:0 0 20px #4c577d05}.role-title{color:var(--Primary-600, #344054);font-size:16px;font-weight:600;line-height:24px}.col-md-4{width:31%!important}.user-list{color:var(--Gray-700, #344054);font-size:16px;line-height:24px}.rotate{rotate:180deg;transition:1s}\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$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i3.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.PaginationComponent, selector: "lib-pagination", inputs: ["collection", "itemsPerPage", "currentPage", "totalItems", "directionLinks", "pageSize", "paginationSizes"], outputs: ["pageChange", "pageSizeChange"] }, { kind: "component", type: AuditUserListComponent, selector: "lib-audit-user-list", inputs: ["viewuser", "userDetails"], outputs: ["dataEmitter"] }, { kind: "pipe", type: i6.AsyncPipe, name: "async" }] });
|
|
5164
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AuditUserEarningsComponent, deps: [{ token: i1$1.NgbModal }, { token: i0.ChangeDetectorRef }, { token: i2.GlobalStateService }, { token: i4.ToastService }, { token: UserService }, { token: ExcelService }], target: i0.ɵɵFactoryTarget.Component });
|
|
5165
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: AuditUserEarningsComponent, selector: "lib-audit-user-earnings", ngImport: i0, template: "<div *ngIf=\"!viewuser\" class=\"card\">\r\n <div class=\"card-header border-0 pt-3\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <div class=\"d-flex overflow-auto h-50px\">\r\n <ul\r\n class=\"nav nav-stretch w-100 nav-line-tabs nav-line-tabs-2x border-bottom-2 fs-5 fw-bolder flex-nowrap\">\r\n <li class=\"nav-item cursor-pointer px-5 me-5 text-center\"><a routerLink=\"/manage/users/tango\"\r\n class=\"nav-link mx-0 text-active-primary\">Users</a>\r\n </li>\r\n <li class=\"nav-item activated px-5 me-5 bg-light-primary cursor-pointer\"><a\r\n class=\"nav-link text-active-primary mx-0\">Audit Users\r\n Summary</a>\r\n </li>\r\n </ul>\r\n </div>\r\n <span class=\"text-sub mb-2 mt-5\">{{pagination?.totalCount}} total users</span>\r\n </h3>\r\n <div class=\"card-toolbar\">\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\"></rect>\r\n <path\r\n d=\"M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z\"\r\n fill=\"currentColor\"></path>\r\n </svg>\r\n </span>\r\n <input type=\"text\" (change)=\"searchData()\" [(ngModel)]=\"searchValue\" class=\"form-control ps-14 me-2\"\r\n name=\"search\" autocomplete=\"off\" placeholder=\"Search\" autocomplete=\"off\" />\r\n @if (!loading && !noData) {\r\n <!-- @if ((gs.userAccess |async)?.Global_User_isEdit) { -->\r\n <button *ngIf=\"!noData && !loading\" type=\"button\" (click)=\"exportXLSX()\"\r\n class=\"btn py-3 px-4 btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M8.125 13.125H16.3562L14.7438 14.7438L15.625 15.625L18.75 12.5L15.625 9.375L14.7438 10.2562L16.3562 11.875H8.125V13.125Z\"\r\n fill=\"black\" />\r\n <path\r\n d=\"M13.75 8.75V6.25C13.7505 6.16775 13.7347 6.08621 13.7036 6.01006C13.6725 5.93391 13.6267 5.86465 13.5688 5.80625L9.19375 1.43125C9.13535 1.37333 9.06609 1.3275 8.98994 1.2964C8.91379 1.26529 8.83225 1.24953 8.75 1.25H2.5C2.16848 1.25 1.85054 1.3817 1.61612 1.61612C1.3817 1.85054 1.25 2.16848 1.25 2.5V17.5C1.25 17.8315 1.3817 18.1495 1.61612 18.3839C1.85054 18.6183 2.16848 18.75 2.5 18.75H12.5C12.8315 18.75 13.1495 18.6183 13.3839 18.3839C13.6183 18.1495 13.75 17.8315 13.75 17.5V16.25H12.5V17.5H2.5V2.5H7.5V6.25C7.5 6.58152 7.6317 6.89947 7.86612 7.13389C8.10054 7.36831 8.41848 7.5 8.75 7.5H12.5V8.75H13.75ZM8.75 6.25V2.75625L12.2438 6.25H8.75Z\"\r\n fill=\"black\" />\r\n </svg><span class=\"ms-2\">Export</span> </button>\r\n\r\n <!-- <button *ngIf=\"!noData && !loading\" type=\"button\" (click)=\"generateReport()\"\r\n class=\"btn py-3 px-4 btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\"><span\r\n class=\"ms-2\">Generate</span> </button> -->\r\n\r\n\r\n <!-- } -->\r\n }\r\n @if ((gs.userAccess | async)?.Global_User_isAdd) {\r\n <button type=\"button\" (click)=\"addUsers('add')\"\r\n class=\"btn btn-primary mx-2 rounded-3 text-nowrap\"><svg xmlns=\"http://www.w3.org/2000/svg\"\r\n width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M10.0001 4.16663V15.8333M4.16675 9.99996H15.8334\" stroke=\"white\"\r\n stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2 text-white\">Add User</span> </button>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"card-body p-0\">\r\n <div class=\"table-responsive\">\r\n <table class=\"table bottom-border text-nowrap \">\r\n <thead>\r\n <tr>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('userName')\">Name\r\n <svg [ngClass]=\"sortColumName === 'userName' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'userName' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('fileDateFrom')\">File Date From\r\n <svg [ngClass]=\"sortColumName === 'fileDateFrom' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'fileDateFrom' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('fileDateTo')\">File Date To\r\n <svg [ngClass]=\"sortColumName === 'fileDateTo' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'fileDateTo' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('noOfDays')\">No.of Days\r\n <svg [ngClass]=\"sortColumName === 'noOfDays' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'noOfDays' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('totalFiles')\">Total Files\r\n <svg [ngClass]=\"sortColumName === 'totalFiles' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'totalFiles' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('totalBC')\">Total BC\r\n <svg [ngClass]=\"sortColumName === 'totalBC' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'totalBC' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('totalAC')\">Total AC\r\n <svg [ngClass]=\"sortColumName === 'totalAC' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'totalAC' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('totalEarnings')\">Total Earnings(Rs)\r\n <svg [ngClass]=\"sortColumName === 'totalEarnings' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'totalEarnings' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('bcCredit')\">BC Credit\r\n <svg [ngClass]=\"sortColumName === 'bcCredit' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'bcCredit' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('acCredit')\">AC Credit\r\n <svg [ngClass]=\"sortColumName === 'acCredit' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'acCredit' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('deductionbyMinimumTarget')\">Deduction by Minimum\r\n Target\r\n <svg [ngClass]=\"sortColumName === 'deductionbyMinimumTarget' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'deductionbyMinimumTarget' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('deductionbyMapping')\">Deduction by Mapping\r\n <svg [ngClass]=\"sortColumName === 'deductionbyMapping' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'deductionbyMapping' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('deductionbyLateLogin')\">Deduction by Late Login\r\n <svg [ngClass]=\"sortColumName === 'deductionbyLateLogin' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'deductionbyLateLogin' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('totalReducedAmount')\">Total Reduced Amount\r\n <svg [ngClass]=\"sortColumName === 'totalReducedAmount' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'totalReducedAmount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('totalCredit')\">Total Credit\r\n <svg [ngClass]=\"sortColumName === 'totalCredit' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'totalCredit' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th>Actions</th>\r\n </tr>\r\n </thead>\r\n <tbody class=\"fw-semibold\">\r\n <ng-container *ngFor=\"let user of userList;let i=index;\">\r\n <tr>\r\n <td>{{user?.userName ? user?.userName : '--'}}</td>\r\n <td>{{user?.fileDateFrom ? user?.fileDateFrom : '--'}}</td>\r\n <td>{{user?.fileDateTo ? user?.fileDateTo : '--'}}</td>\r\n <td>{{user?.noOfDays ? user?.noOfDays : 0}}</td>\r\n <td>{{user?.totalFiles ?? '--'}}</td>\r\n <td>{{user?.totalBC ?? '--'}}</td>\r\n <td>{{user?.totalAC ?? '--'}}</td>\r\n <td>{{user?.totalEarnings ? user?.totalEarnings.toFixed(2) : 0}}</td>\r\n <td>{{user.bcCredit ? user.bcCredit.toFixed(2) : 0}}</td>\r\n <td>{{user?.acCredit ? user?.acCredit.toFixed(2) : 0}}</td>\r\n <td>{{user?.deductionbyMinimumTarget ? user?.deductionbyMinimumTarget.toFixed(2) : 0}}</td>\r\n <td>{{user?.deductionbyMapping ? user?.deductionbyMapping.toFixed(2) : 0}}</td>\r\n <td>{{user?.deductionbyLateLogin ? user?.deductionbyLateLogin.toFixed(2) : 0}}</td>\r\n <td>{{user?.totalReducedAmount ? user?.totalReducedAmount.toFixed(2) : 0}}</td>\r\n <td>{{user?.totalCredit ? user?.totalCredit.toFixed(2) : 0}}</td>\r\n <td>\r\n <div class=\"d-flex\">\r\n <span class=\"cursor-pointer\" (click)=\"Viewusers('view',user)\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\"\r\n viewBox=\"0 0 21 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_1995_16400)\">\r\n <path\r\n d=\"M1.33325 10C1.33325 10 4.66658 3.33337 10.4999 3.33337C16.3333 3.33337 19.6666 10 19.6666 10C19.6666 10 16.3333 16.6667 10.4999 16.6667C4.66658 16.6667 1.33325 10 1.33325 10Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10.4999 12.5C11.8806 12.5 12.9999 11.3808 12.9999 10C12.9999 8.61933 11.8806 7.50004 10.4999 7.50004C9.11921 7.50004 7.99992 8.61933 7.99992 10C7.99992 11.3808 9.11921 12.5 10.4999 12.5Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_1995_16400\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\"\r\n transform=\"translate(0.5)\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n </div>\r\n </td>\r\n </tr>\r\n </ng-container>\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12 my-3\">\r\n <lib-pagination *ngIf=\"userList.length!==0\" [itemsPerPage]=\"pagination.limit\" [currentPage]=\"pagination.offset\"\r\n [totalItems]=\"pagination.totalCount\" [paginationSizes]=\"paginationSizes\" [pageSize]=\"paginationSize()\"\r\n (pageChange)=\"onPageChange($event)\" (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n <div *ngIf=\"loading\" class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"noData\" class=\"row\">\r\n <!-- <div class=\"row\"> -->\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-nodata\" src=\"./assets/tango/Icons/Nodata1.svg\" alt=\"\">\r\n <div class=\"nodata-title\">No data found</div>\r\n <div class=\"nodata-sub\">There is no result for this Date</div>\r\n </div>\r\n </div>\r\n <!-- </div> -->\r\n </div>\r\n</div>\r\n<div *ngIf=\"viewuser\">\r\n <lib-audit-user-list (dataEmitter)=\"receivedData($event)\" [viewuser]=\"viewuser\"\r\n [userDetails]=\"userDetails\"></lib-audit-user-list>\r\n</div>", styles: [".nav-line-tabs .activated{border-bottom:3px solid var(--bs-primary)!important;transition:color .2s ease!important}.nav-line-tabs .activated a{color:var(--Primary-700, #009BF3)!important}.nav-line-tabs .activated :hover,.nav-item,.nav-item .nav-link:hover{border:0px!important}.nav-line-tabs :hover{border-bottom:3px solid var(--bs-primary)!important;transition:color .2s ease!important}.border-val{color:var(--Gray-700, #344054)!important;font-family:Inter;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}.table-title-primary{color:var(--Primary-700, #009BF3)!important;font-weight:500!important}.table-sub{line-height:30px!important;color:var(--Gray-500, #667085)!important}td{padding:16px 24px!important;line-height:36px!important}.img-src{width:25%;height:20%}.border-val{padding:16px;border-radius:12px;border:1px solid var(--Gray-200, #EAECF0);background:#fff;box-shadow:0 0 20px #4c577d05}.role-title{color:var(--Primary-600, #344054);font-size:16px;font-weight:600;line-height:24px}.col-md-4{width:31%!important}.user-list{color:var(--Gray-700, #344054);font-size:16px;line-height:24px}.rotate{rotate:180deg;transition:1s}\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$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i3.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.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.PaginationComponent, selector: "lib-pagination", inputs: ["collection", "itemsPerPage", "currentPage", "totalItems", "directionLinks", "pageSize", "paginationSizes"], outputs: ["pageChange", "pageSizeChange"] }, { kind: "component", type: AuditUserListComponent, selector: "lib-audit-user-list", inputs: ["viewuser", "userDetails"], outputs: ["dataEmitter"] }, { kind: "pipe", type: i6.AsyncPipe, name: "async" }] });
|
|
4536
5166
|
}
|
|
4537
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
5167
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AuditUserEarningsComponent, decorators: [{
|
|
4538
5168
|
type: Component,
|
|
4539
5169
|
args: [{ selector: 'lib-audit-user-earnings', template: "<div *ngIf=\"!viewuser\" class=\"card\">\r\n <div class=\"card-header border-0 pt-3\">\r\n <h3 class=\"card-title align-items-start flex-column\">\r\n <div class=\"d-flex overflow-auto h-50px\">\r\n <ul\r\n class=\"nav nav-stretch w-100 nav-line-tabs nav-line-tabs-2x border-bottom-2 fs-5 fw-bolder flex-nowrap\">\r\n <li class=\"nav-item cursor-pointer px-5 me-5 text-center\"><a routerLink=\"/manage/users/tango\"\r\n class=\"nav-link mx-0 text-active-primary\">Users</a>\r\n </li>\r\n <li class=\"nav-item activated px-5 me-5 bg-light-primary cursor-pointer\"><a\r\n class=\"nav-link text-active-primary mx-0\">Audit Users\r\n Summary</a>\r\n </li>\r\n </ul>\r\n </div>\r\n <span class=\"text-sub mb-2 mt-5\">{{pagination?.totalCount}} total users</span>\r\n </h3>\r\n <div class=\"card-toolbar\">\r\n <div class=\"d-flex\">\r\n <div class=\"d-flex align-items-center position-relative my-1\">\r\n <span class=\"svg-icon svg-icon-1 position-absolute ms-3\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <rect opacity=\"0.5\" x=\"17.0365\" y=\"15.1223\" width=\"8.15546\" height=\"2\" rx=\"1\"\r\n transform=\"rotate(45 17.0365 15.1223)\" fill=\"currentColor\"></rect>\r\n <path\r\n d=\"M11 19C6.55556 19 3 15.4444 3 11C3 6.55556 6.55556 3 11 3C15.4444 3 19 6.55556 19 11C19 15.4444 15.4444 19 11 19ZM11 5C7.53333 5 5 7.53333 5 11C5 14.4667 7.53333 17 11 17C14.4667 17 17 14.4667 17 11C17 7.53333 14.4667 5 11 5Z\"\r\n fill=\"currentColor\"></path>\r\n </svg>\r\n </span>\r\n <input type=\"text\" (change)=\"searchData()\" [(ngModel)]=\"searchValue\" class=\"form-control ps-14 me-2\"\r\n name=\"search\" autocomplete=\"off\" placeholder=\"Search\" autocomplete=\"off\" />\r\n @if (!loading && !noData) {\r\n <!-- @if ((gs.userAccess |async)?.Global_User_isEdit) { -->\r\n <button *ngIf=\"!noData && !loading\" type=\"button\" (click)=\"exportXLSX()\"\r\n class=\"btn py-3 px-4 btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\"><svg\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path\r\n d=\"M8.125 13.125H16.3562L14.7438 14.7438L15.625 15.625L18.75 12.5L15.625 9.375L14.7438 10.2562L16.3562 11.875H8.125V13.125Z\"\r\n fill=\"black\" />\r\n <path\r\n d=\"M13.75 8.75V6.25C13.7505 6.16775 13.7347 6.08621 13.7036 6.01006C13.6725 5.93391 13.6267 5.86465 13.5688 5.80625L9.19375 1.43125C9.13535 1.37333 9.06609 1.3275 8.98994 1.2964C8.91379 1.26529 8.83225 1.24953 8.75 1.25H2.5C2.16848 1.25 1.85054 1.3817 1.61612 1.61612C1.3817 1.85054 1.25 2.16848 1.25 2.5V17.5C1.25 17.8315 1.3817 18.1495 1.61612 18.3839C1.85054 18.6183 2.16848 18.75 2.5 18.75H12.5C12.8315 18.75 13.1495 18.6183 13.3839 18.3839C13.6183 18.1495 13.75 17.8315 13.75 17.5V16.25H12.5V17.5H2.5V2.5H7.5V6.25C7.5 6.58152 7.6317 6.89947 7.86612 7.13389C8.10054 7.36831 8.41848 7.5 8.75 7.5H12.5V8.75H13.75ZM8.75 6.25V2.75625L12.2438 6.25H8.75Z\"\r\n fill=\"black\" />\r\n </svg><span class=\"ms-2\">Export</span> </button>\r\n\r\n <!-- <button *ngIf=\"!noData && !loading\" type=\"button\" (click)=\"generateReport()\"\r\n class=\"btn py-3 px-4 btn-default mx-2 btn-outline btn-outline-default rounded-3 text-nowrap border-val\"><span\r\n class=\"ms-2\">Generate</span> </button> -->\r\n\r\n\r\n <!-- } -->\r\n }\r\n @if ((gs.userAccess | async)?.Global_User_isAdd) {\r\n <button type=\"button\" (click)=\"addUsers('add')\"\r\n class=\"btn btn-primary mx-2 rounded-3 text-nowrap\"><svg xmlns=\"http://www.w3.org/2000/svg\"\r\n width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\r\n <path d=\"M10.0001 4.16663V15.8333M4.16675 9.99996H15.8334\" stroke=\"white\"\r\n stroke-width=\"1.67\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg><span class=\"ms-2 text-white\">Add User</span> </button>\r\n }\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"card-body p-0\">\r\n <div class=\"table-responsive\">\r\n <table class=\"table bottom-border text-nowrap \">\r\n <thead>\r\n <tr>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('userName')\">Name\r\n <svg [ngClass]=\"sortColumName === 'userName' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'userName' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('fileDateFrom')\">File Date From\r\n <svg [ngClass]=\"sortColumName === 'fileDateFrom' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'fileDateFrom' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('fileDateTo')\">File Date To\r\n <svg [ngClass]=\"sortColumName === 'fileDateTo' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'fileDateTo' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('noOfDays')\">No.of Days\r\n <svg [ngClass]=\"sortColumName === 'noOfDays' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'noOfDays' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('totalFiles')\">Total Files\r\n <svg [ngClass]=\"sortColumName === 'totalFiles' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'totalFiles' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('totalBC')\">Total BC\r\n <svg [ngClass]=\"sortColumName === 'totalBC' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'totalBC' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('totalAC')\">Total AC\r\n <svg [ngClass]=\"sortColumName === 'totalAC' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'totalAC' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('totalEarnings')\">Total Earnings(Rs)\r\n <svg [ngClass]=\"sortColumName === 'totalEarnings' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'totalEarnings' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('bcCredit')\">BC Credit\r\n <svg [ngClass]=\"sortColumName === 'bcCredit' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'bcCredit' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('acCredit')\">AC Credit\r\n <svg [ngClass]=\"sortColumName === 'acCredit' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'acCredit' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('deductionbyMinimumTarget')\">Deduction by Minimum\r\n Target\r\n <svg [ngClass]=\"sortColumName === 'deductionbyMinimumTarget' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'deductionbyMinimumTarget' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('deductionbyMapping')\">Deduction by Mapping\r\n <svg [ngClass]=\"sortColumName === 'deductionbyMapping' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'deductionbyMapping' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('deductionbyLateLogin')\">Deduction by Late Login\r\n <svg [ngClass]=\"sortColumName === 'deductionbyLateLogin' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'deductionbyLateLogin' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('totalReducedAmount')\">Total Reduced Amount\r\n <svg [ngClass]=\"sortColumName === 'totalReducedAmount' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'totalReducedAmount' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th class=\"cursor-pointer\" (click)=\"onSort('totalCredit')\">Total Credit\r\n <svg [ngClass]=\"sortColumName === 'totalCredit' && sortBy === 1 ? 'rotate' : ''\"\r\n xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\"\r\n fill=\"none\">\r\n <path\r\n d=\"M8.00016 3.33337V12.6667M8.00016 12.6667L12.6668 8.00004M8.00016 12.6667L3.3335 8.00004\"\r\n [attr.stroke]=\"sortColumName === 'totalCredit' ? '#00A3FF' : '#667085'\"\r\n stroke-width=\"1.33333\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </svg>\r\n </th>\r\n <th>Actions</th>\r\n </tr>\r\n </thead>\r\n <tbody class=\"fw-semibold\">\r\n <ng-container *ngFor=\"let user of userList;let i=index;\">\r\n <tr>\r\n <td>{{user?.userName ? user?.userName : '--'}}</td>\r\n <td>{{user?.fileDateFrom ? user?.fileDateFrom : '--'}}</td>\r\n <td>{{user?.fileDateTo ? user?.fileDateTo : '--'}}</td>\r\n <td>{{user?.noOfDays ? user?.noOfDays : 0}}</td>\r\n <td>{{user?.totalFiles ?? '--'}}</td>\r\n <td>{{user?.totalBC ?? '--'}}</td>\r\n <td>{{user?.totalAC ?? '--'}}</td>\r\n <td>{{user?.totalEarnings ? user?.totalEarnings.toFixed(2) : 0}}</td>\r\n <td>{{user.bcCredit ? user.bcCredit.toFixed(2) : 0}}</td>\r\n <td>{{user?.acCredit ? user?.acCredit.toFixed(2) : 0}}</td>\r\n <td>{{user?.deductionbyMinimumTarget ? user?.deductionbyMinimumTarget.toFixed(2) : 0}}</td>\r\n <td>{{user?.deductionbyMapping ? user?.deductionbyMapping.toFixed(2) : 0}}</td>\r\n <td>{{user?.deductionbyLateLogin ? user?.deductionbyLateLogin.toFixed(2) : 0}}</td>\r\n <td>{{user?.totalReducedAmount ? user?.totalReducedAmount.toFixed(2) : 0}}</td>\r\n <td>{{user?.totalCredit ? user?.totalCredit.toFixed(2) : 0}}</td>\r\n <td>\r\n <div class=\"d-flex\">\r\n <span class=\"cursor-pointer\" (click)=\"Viewusers('view',user)\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"21\" height=\"20\"\r\n viewBox=\"0 0 21 20\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_1995_16400)\">\r\n <path\r\n d=\"M1.33325 10C1.33325 10 4.66658 3.33337 10.4999 3.33337C16.3333 3.33337 19.6666 10 19.6666 10C19.6666 10 16.3333 16.6667 10.4999 16.6667C4.66658 16.6667 1.33325 10 1.33325 10Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n <path\r\n d=\"M10.4999 12.5C11.8806 12.5 12.9999 11.3808 12.9999 10C12.9999 8.61933 11.8806 7.50004 10.4999 7.50004C9.11921 7.50004 7.99992 8.61933 7.99992 10C7.99992 11.3808 9.11921 12.5 10.4999 12.5Z\"\r\n stroke=\"#667085\" stroke-width=\"1.66667\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_1995_16400\">\r\n <rect width=\"20\" height=\"20\" fill=\"white\"\r\n transform=\"translate(0.5)\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n </span>\r\n </div>\r\n </td>\r\n </tr>\r\n </ng-container>\r\n </tbody>\r\n </table>\r\n </div>\r\n </div>\r\n <div *ngIf=\"!loading && !noData\" class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12 my-3\">\r\n <lib-pagination *ngIf=\"userList.length!==0\" [itemsPerPage]=\"pagination.limit\" [currentPage]=\"pagination.offset\"\r\n [totalItems]=\"pagination.totalCount\" [paginationSizes]=\"paginationSizes\" [pageSize]=\"paginationSize()\"\r\n (pageChange)=\"onPageChange($event)\" (pageSizeChange)=\"onPageSizeChange($event)\"></lib-pagination>\r\n </div>\r\n <div *ngIf=\"loading\" class=\"row loader d-flex justify-content-center align-items-center\">\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n <div class=\"shimmer\">\r\n <div class=\"wrapper\">\r\n <div class=\"stroke animate title\"></div>\r\n <div class=\"stroke animate link\"></div>\r\n <div class=\"stroke animate description\"></div>\r\n </div>\r\n </div>\r\n </div>\r\n <div *ngIf=\"noData\" class=\"row\">\r\n <!-- <div class=\"row\"> -->\r\n <div class=\"col-lg-12 mb-3\">\r\n <div class=\"card-body d-flex justify-content-center align-items-center flex-column\">\r\n <img class=\"img-nodata\" src=\"./assets/tango/Icons/Nodata1.svg\" alt=\"\">\r\n <div class=\"nodata-title\">No data found</div>\r\n <div class=\"nodata-sub\">There is no result for this Date</div>\r\n </div>\r\n </div>\r\n <!-- </div> -->\r\n </div>\r\n</div>\r\n<div *ngIf=\"viewuser\">\r\n <lib-audit-user-list (dataEmitter)=\"receivedData($event)\" [viewuser]=\"viewuser\"\r\n [userDetails]=\"userDetails\"></lib-audit-user-list>\r\n</div>", styles: [".nav-line-tabs .activated{border-bottom:3px solid var(--bs-primary)!important;transition:color .2s ease!important}.nav-line-tabs .activated a{color:var(--Primary-700, #009BF3)!important}.nav-line-tabs .activated :hover,.nav-item,.nav-item .nav-link:hover{border:0px!important}.nav-line-tabs :hover{border-bottom:3px solid var(--bs-primary)!important;transition:color .2s ease!important}.border-val{color:var(--Gray-700, #344054)!important;font-family:Inter;font-size:14px!important;font-weight:600!important;line-height:20px;text-transform:capitalize}.table-title-primary{color:var(--Primary-700, #009BF3)!important;font-weight:500!important}.table-sub{line-height:30px!important;color:var(--Gray-500, #667085)!important}td{padding:16px 24px!important;line-height:36px!important}.img-src{width:25%;height:20%}.border-val{padding:16px;border-radius:12px;border:1px solid var(--Gray-200, #EAECF0);background:#fff;box-shadow:0 0 20px #4c577d05}.role-title{color:var(--Primary-600, #344054);font-size:16px;font-weight:600;line-height:24px}.col-md-4{width:31%!important}.user-list{color:var(--Gray-700, #344054);font-size:16px;line-height:24px}.rotate{rotate:180deg;transition:1s}\n"] }]
|
|
4540
5170
|
}], ctorParameters: () => [{ type: i1$1.NgbModal }, { type: i0.ChangeDetectorRef }, { type: i2.GlobalStateService }, { type: i4.ToastService }, { type: UserService }, { type: ExcelService }] });
|
|
@@ -4562,11 +5192,11 @@ const routes = [
|
|
|
4562
5192
|
}
|
|
4563
5193
|
];
|
|
4564
5194
|
class TangoManageUsersRoutingModule {
|
|
4565
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
4566
|
-
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.
|
|
4567
|
-
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.
|
|
5195
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TangoManageUsersRoutingModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
5196
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.12", ngImport: i0, type: TangoManageUsersRoutingModule, imports: [i2$1.RouterModule], exports: [RouterModule] });
|
|
5197
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TangoManageUsersRoutingModule, imports: [RouterModule.forChild(routes), RouterModule] });
|
|
4568
5198
|
}
|
|
4569
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
5199
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TangoManageUsersRoutingModule, decorators: [{
|
|
4570
5200
|
type: NgModule,
|
|
4571
5201
|
args: [{
|
|
4572
5202
|
imports: [RouterModule.forChild(routes)],
|
|
@@ -4721,17 +5351,17 @@ class TangoManageUsersComponent {
|
|
|
4721
5351
|
this.destroy$.next(true);
|
|
4722
5352
|
this.destroy$.complete();
|
|
4723
5353
|
}
|
|
4724
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
4725
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.
|
|
5354
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TangoManageUsersComponent, deps: [{ token: i2.PageInfoService }, { token: UserService }, { token: i0.ChangeDetectorRef }, { token: i2.GlobalStateService }, { token: i2$1.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component });
|
|
5355
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: TangoManageUsersComponent, selector: "lib-tango-manage-users", ngImport: i0, template: "<!-- Users subhead start -->\r\n<div class=\"card mb-5\">\r\n @if (USER?.userType==='tango') {\r\n <div class=\"card-body pt-2 pb-1\">\r\n <div class=\"d-flex overflow-auto mb-2\">\r\n <ul \r\n class=\"nav nav-stretch nav-line-tabs1 nav-line-tabs-2x justify-content-center align-items-center border-transparent flex-nowrap\">\r\n <li (click)=\"userValue('Brand User')\" class=\"nav-item\" [routerLink]=\"['/manage/users']\" [queryParams]=\"{ type: 'client' }\">\r\n <a [ngClass]=\"userData ==='Brand User' ? 'active' :''\"\r\n class=\"nav-link text-active-primary cursor-pointer me-6\">Brand User</a>\r\n </li>\r\n <li (click)=\"userValue('Tango User')\" class=\"nav-item\" [routerLink]=\"['/manage/users']\" [queryParams]=\"{ type: 'tango' }\">\r\n <a [ngClass]=\"userData ==='Tango User' ? 'active' :''\"\r\n class=\"nav-link text-active-primary cursor-pointer no-border me-6 \">Tango User</a>\r\n </li>\r\n \r\n </ul>\r\n </div>\r\n </div>\r\n }\r\n</div>\r\n<!-- Users subhead end -->\r\n<!-- *ngIf=\"userdata =='Tango User'\" -->\r\n<!--begin::Row-->\r\n<div *ngIf=\"receivedData !=='Role Value' && (userData ==='Tango User' || userData ==='Brand User')\" class=\"row gx-5 gx-xl-10\">\r\n <!--begin::Col-->\r\n <div class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12\">\r\n <!-- (dataTouserlist)=\"receiveData($event)\" -->\r\n <lib-user-table *ngIf=\"userData ==='Tango User'\" class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12 mb-5 mb-xl-1\"></lib-user-table>\r\n <lib-brand-user *ngIf=\"userData ==='Brand User'\" class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12 mb-5 mb-xl-1\"></lib-brand-user>\r\n\r\n </div>\r\n <!-- <div class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12 my-3\">\r\n <div class=\"card p-5\">\r\n <div class=\"border-0\">\r\n <h3 class=\"title fw-bold\">Roles & Permission</h3>\r\n <h6 class=\"sub-title fw-normal\">{{rolesCount || 0}} total roles</h6>\r\n </div>\r\n <div class=\"card-body px-0\">\r\n <div class=\"flex-column align-items-start\">\r\n <div class=\"row\">\r\n <div class=\"col-md-4 border-val mx-3 mb-7 py-7\" *ngFor=\"let obj of roles;let i=index\">\r\n <a class=\"role-title my-2 cursor-pointer\" (click)=\"userDetials(obj)\">{{obj.roleName |\r\n titlecase}}</a>\r\n <div *ngIf=\"obj.roleName ==='superadmin'\" class=\"sub-title fw-semibold my-5\">Oversees all the operations and controls the entire functionality of the dashboard</div>\r\n <div *ngIf=\"obj.roleName ==='admin'\" class=\"sub-title fw-semibold my-5\">Manages specific operations, permissions, and can change setting for assigned locations</div>\r\n <div *ngIf=\"obj.roleName ==='user'\" class=\"sub-title fw-semibold my-5\">Access to specific location and will be able to view dashboard</div>\r\n <div><span class=\"me-5\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"25\" height=\"24\"\r\n viewBox=\"0 0 25 24\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_1973_14308)\">\r\n <path\r\n d=\"M17.5 21V19C17.5 17.9391 17.0786 16.9217 16.3284 16.1716C15.5783 15.4214 14.5609 15 13.5 15H5.5C4.43913 15 3.42172 15.4214 2.67157 16.1716C1.92143 16.9217 1.5 17.9391 1.5 19V21M23.5 21V19C23.4993 18.1137 23.2044 17.2528 22.6614 16.5523C22.1184 15.8519 21.3581 15.3516 20.5 15.13M16.5 3.13C17.3604 3.3503 18.123 3.8507 18.6676 4.55231C19.2122 5.25392 19.5078 6.11683 19.5078 7.005C19.5078 7.89317 19.2122 8.75608 18.6676 9.45769C18.123 10.1593 17.3604 10.6597 16.5 10.88M13.5 7C13.5 9.20914 11.7091 11 9.5 11C7.29086 11 5.5 9.20914 5.5 7C5.5 4.79086 7.29086 3 9.5 3C11.7091 3 13.5 4.79086 13.5 7Z\"\r\n stroke=\"#667085\" stroke-width=\"2\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_1973_14308\">\r\n <rect width=\"24\" height=\"24\" fill=\"white\" transform=\"translate(0.5)\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n <span class=\"uses-list fw-semibold\">{{obj?.count || 0}} Members</span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div> -->\r\n <!--end::Col-->\r\n</div>\r\n<!--end::Row-->\r\n\r\n<!--begin::Row-->\r\n<div *ngIf=\"receivedData ==='Role Value'\" class=\"row gx-5 gx-xl-10\">\r\n <!--begin::Col-->\r\n <div class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12\">\r\n <lib-roles-permission-table (dataEvent)=\"receiveData($event)\"></lib-roles-permission-table>\r\n </div>\r\n <!--end::Col-->\r\n</div>\r\n<!--end::Row-->\r\n\r\n<!-- <div *ngFor=\"let obj of values\">\r\n <input type=\"text\" class=\"form-control\" [(ngModel)]=\"obj.value\">\r\n </div> -->", styles: [".nav-line-tabs1.nav-line-tabs-2x .nav-item .nav-link.active{border-radius:6px!important;background:var(--Primary-50, #EAF8FF)!important;padding:10px 14px!important;color:var(--Primary-700, #009BF3)!important}.nav-line-tabs1 .nav-link{color:var(--Gray-500, #667085)!important;font-size:16px;font-weight:500!important;line-height:24px}.daterangepicker{display:block!important;top:153.85px!important;left:900px!important;right:0}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .md-drppicker.drops-down-down.ltr.double.show-ranges.shown{left:0!important;height:350px}:host::ng-deep .md-drppicker td{border-radius:44px}:host::ng-deep .md-drppicker .btn{border-radius:7px!important;background-color:#019df5!important}:host::ng-deep .md-drppicker .btn{right:99px;top:300px}:host::ng-deep .md-drppicker .ranges ul li button.active{background-color:#029cf3!important}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important}.title{color:var(--Gray-900, #101828);font-size:20px;line-height:30px}.sub-title{color:var(--Gray-500, #667085);font-size:14px;line-height:20px}.border-val{padding:16px;border-radius:12px;border:1px solid var(--Gray-200, #EAECF0);background:#fff;box-shadow:0 0 20px #4c577d05}.role-title{color:var(--Primary-600, #00A3FF);font-size:16px;font-weight:600;line-height:24px;text-decoration-line:underline}.col-md-4{width:31%!important}.user-list{color:var(--Gray-700, #344054);font-size:16px;line-height:24px}\n"], dependencies: [{ kind: "directive", type: i6.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: UserTableComponent, selector: "lib-user-table" }, { kind: "component", type: RolesPermissionTableComponent, selector: "lib-roles-permission-table", outputs: ["dataEvent"] }, { kind: "component", type: BrandUserComponent, selector: "lib-brand-user", outputs: ["dataToParent"] }] });
|
|
4726
5356
|
}
|
|
4727
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
5357
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TangoManageUsersComponent, decorators: [{
|
|
4728
5358
|
type: Component,
|
|
4729
5359
|
args: [{ selector: "lib-tango-manage-users", template: "<!-- Users subhead start -->\r\n<div class=\"card mb-5\">\r\n @if (USER?.userType==='tango') {\r\n <div class=\"card-body pt-2 pb-1\">\r\n <div class=\"d-flex overflow-auto mb-2\">\r\n <ul \r\n class=\"nav nav-stretch nav-line-tabs1 nav-line-tabs-2x justify-content-center align-items-center border-transparent flex-nowrap\">\r\n <li (click)=\"userValue('Brand User')\" class=\"nav-item\" [routerLink]=\"['/manage/users']\" [queryParams]=\"{ type: 'client' }\">\r\n <a [ngClass]=\"userData ==='Brand User' ? 'active' :''\"\r\n class=\"nav-link text-active-primary cursor-pointer me-6\">Brand User</a>\r\n </li>\r\n <li (click)=\"userValue('Tango User')\" class=\"nav-item\" [routerLink]=\"['/manage/users']\" [queryParams]=\"{ type: 'tango' }\">\r\n <a [ngClass]=\"userData ==='Tango User' ? 'active' :''\"\r\n class=\"nav-link text-active-primary cursor-pointer no-border me-6 \">Tango User</a>\r\n </li>\r\n \r\n </ul>\r\n </div>\r\n </div>\r\n }\r\n</div>\r\n<!-- Users subhead end -->\r\n<!-- *ngIf=\"userdata =='Tango User'\" -->\r\n<!--begin::Row-->\r\n<div *ngIf=\"receivedData !=='Role Value' && (userData ==='Tango User' || userData ==='Brand User')\" class=\"row gx-5 gx-xl-10\">\r\n <!--begin::Col-->\r\n <div class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12\">\r\n <!-- (dataTouserlist)=\"receiveData($event)\" -->\r\n <lib-user-table *ngIf=\"userData ==='Tango User'\" class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12 mb-5 mb-xl-1\"></lib-user-table>\r\n <lib-brand-user *ngIf=\"userData ==='Brand User'\" class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12 mb-5 mb-xl-1\"></lib-brand-user>\r\n\r\n </div>\r\n <!-- <div class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12 my-3\">\r\n <div class=\"card p-5\">\r\n <div class=\"border-0\">\r\n <h3 class=\"title fw-bold\">Roles & Permission</h3>\r\n <h6 class=\"sub-title fw-normal\">{{rolesCount || 0}} total roles</h6>\r\n </div>\r\n <div class=\"card-body px-0\">\r\n <div class=\"flex-column align-items-start\">\r\n <div class=\"row\">\r\n <div class=\"col-md-4 border-val mx-3 mb-7 py-7\" *ngFor=\"let obj of roles;let i=index\">\r\n <a class=\"role-title my-2 cursor-pointer\" (click)=\"userDetials(obj)\">{{obj.roleName |\r\n titlecase}}</a>\r\n <div *ngIf=\"obj.roleName ==='superadmin'\" class=\"sub-title fw-semibold my-5\">Oversees all the operations and controls the entire functionality of the dashboard</div>\r\n <div *ngIf=\"obj.roleName ==='admin'\" class=\"sub-title fw-semibold my-5\">Manages specific operations, permissions, and can change setting for assigned locations</div>\r\n <div *ngIf=\"obj.roleName ==='user'\" class=\"sub-title fw-semibold my-5\">Access to specific location and will be able to view dashboard</div>\r\n <div><span class=\"me-5\"><svg xmlns=\"http://www.w3.org/2000/svg\" width=\"25\" height=\"24\"\r\n viewBox=\"0 0 25 24\" fill=\"none\">\r\n <g clip-path=\"url(#clip0_1973_14308)\">\r\n <path\r\n d=\"M17.5 21V19C17.5 17.9391 17.0786 16.9217 16.3284 16.1716C15.5783 15.4214 14.5609 15 13.5 15H5.5C4.43913 15 3.42172 15.4214 2.67157 16.1716C1.92143 16.9217 1.5 17.9391 1.5 19V21M23.5 21V19C23.4993 18.1137 23.2044 17.2528 22.6614 16.5523C22.1184 15.8519 21.3581 15.3516 20.5 15.13M16.5 3.13C17.3604 3.3503 18.123 3.8507 18.6676 4.55231C19.2122 5.25392 19.5078 6.11683 19.5078 7.005C19.5078 7.89317 19.2122 8.75608 18.6676 9.45769C18.123 10.1593 17.3604 10.6597 16.5 10.88M13.5 7C13.5 9.20914 11.7091 11 9.5 11C7.29086 11 5.5 9.20914 5.5 7C5.5 4.79086 7.29086 3 9.5 3C11.7091 3 13.5 4.79086 13.5 7Z\"\r\n stroke=\"#667085\" stroke-width=\"2\" stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_1973_14308\">\r\n <rect width=\"24\" height=\"24\" fill=\"white\" transform=\"translate(0.5)\" />\r\n </clipPath>\r\n </defs>\r\n </svg></span>\r\n <span class=\"uses-list fw-semibold\">{{obj?.count || 0}} Members</span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div> -->\r\n <!--end::Col-->\r\n</div>\r\n<!--end::Row-->\r\n\r\n<!--begin::Row-->\r\n<div *ngIf=\"receivedData ==='Role Value'\" class=\"row gx-5 gx-xl-10\">\r\n <!--begin::Col-->\r\n <div class=\"col-xxl-12 col-md-12 col-xl-12 col-lg-12\">\r\n <lib-roles-permission-table (dataEvent)=\"receiveData($event)\"></lib-roles-permission-table>\r\n </div>\r\n <!--end::Col-->\r\n</div>\r\n<!--end::Row-->\r\n\r\n<!-- <div *ngFor=\"let obj of values\">\r\n <input type=\"text\" class=\"form-control\" [(ngModel)]=\"obj.value\">\r\n </div> -->", styles: [".nav-line-tabs1.nav-line-tabs-2x .nav-item .nav-link.active{border-radius:6px!important;background:var(--Primary-50, #EAF8FF)!important;padding:10px 14px!important;color:var(--Primary-700, #009BF3)!important}.nav-line-tabs1 .nav-link{color:var(--Gray-500, #667085)!important;font-size:16px;font-weight:500!important;line-height:24px}.daterangepicker{display:block!important;top:153.85px!important;left:900px!important;right:0}:host::ng-deep .md-drppicker .btn{line-height:10px!important}:host::ng-deep .md-drppicker.drops-down-down.ltr.double.show-ranges.shown{left:0!important;height:350px}:host::ng-deep .md-drppicker td{border-radius:44px}:host::ng-deep .md-drppicker .btn{border-radius:7px!important;background-color:#019df5!important}:host::ng-deep .md-drppicker .btn{right:99px;top:300px}:host::ng-deep .md-drppicker .ranges ul li button.active{background-color:#029cf3!important}:host::ng-deep .md-drppicker td.active,:host::ng-deep .md-drppicker td.active:hover{background-color:#029cf4!important}.title{color:var(--Gray-900, #101828);font-size:20px;line-height:30px}.sub-title{color:var(--Gray-500, #667085);font-size:14px;line-height:20px}.border-val{padding:16px;border-radius:12px;border:1px solid var(--Gray-200, #EAECF0);background:#fff;box-shadow:0 0 20px #4c577d05}.role-title{color:var(--Primary-600, #00A3FF);font-size:16px;font-weight:600;line-height:24px;text-decoration-line:underline}.col-md-4{width:31%!important}.user-list{color:var(--Gray-700, #344054);font-size:16px;line-height:24px}\n"] }]
|
|
4730
5360
|
}], ctorParameters: () => [{ type: i2.PageInfoService }, { type: UserService }, { type: i0.ChangeDetectorRef }, { type: i2.GlobalStateService }, { type: i2$1.ActivatedRoute }] });
|
|
4731
5361
|
|
|
4732
5362
|
class TangoManageUsersModule {
|
|
4733
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.
|
|
4734
|
-
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.
|
|
5363
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TangoManageUsersModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
5364
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.12", ngImport: i0, type: TangoManageUsersModule, declarations: [TangoManageUsersComponent,
|
|
4735
5365
|
UserTableComponent,
|
|
4736
5366
|
RolesPermissionTableComponent,
|
|
4737
5367
|
AddUserPopupComponent,
|
|
@@ -4746,6 +5376,7 @@ class TangoManageUsersModule {
|
|
|
4746
5376
|
CustomSelectComponent,
|
|
4747
5377
|
ViewteamsListComponent,
|
|
4748
5378
|
ActionPopupComponent,
|
|
5379
|
+
GroupSelectComponent,
|
|
4749
5380
|
AuditUserEarningsComponent,
|
|
4750
5381
|
AuditUserListComponent], imports: [CommonModule,
|
|
4751
5382
|
TangoManageUsersRoutingModule,
|
|
@@ -4755,7 +5386,7 @@ class TangoManageUsersModule {
|
|
|
4755
5386
|
NgbAccordionModule,
|
|
4756
5387
|
CommonSharedModule,
|
|
4757
5388
|
NgbTooltipModule] });
|
|
4758
|
-
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.
|
|
5389
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TangoManageUsersModule, imports: [CommonModule,
|
|
4759
5390
|
TangoManageUsersRoutingModule,
|
|
4760
5391
|
FormsModule,
|
|
4761
5392
|
ReactiveFormsModule,
|
|
@@ -4764,7 +5395,7 @@ class TangoManageUsersModule {
|
|
|
4764
5395
|
CommonSharedModule,
|
|
4765
5396
|
NgbTooltipModule] });
|
|
4766
5397
|
}
|
|
4767
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.
|
|
5398
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: TangoManageUsersModule, decorators: [{
|
|
4768
5399
|
type: NgModule,
|
|
4769
5400
|
args: [{
|
|
4770
5401
|
declarations: [
|
|
@@ -4783,6 +5414,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImpo
|
|
|
4783
5414
|
CustomSelectComponent,
|
|
4784
5415
|
ViewteamsListComponent,
|
|
4785
5416
|
ActionPopupComponent,
|
|
5417
|
+
GroupSelectComponent,
|
|
4786
5418
|
AuditUserEarningsComponent,
|
|
4787
5419
|
AuditUserListComponent
|
|
4788
5420
|
],
|