aede6e2edd6ac420ddf86de29fabf1262bffe495
[osm/NG-UI.git] / src / app / users / user-details / UserDetailsComponent.ts
1 /*
2  Copyright 2020 TATA ELXSI
3
4  Licensed under the Apache License, Version 2.0 (the 'License');
5  you may not use this file except in compliance with the License.
6  You may obtain a copy of the License at
7
8   http://www.apache.org/licenses/LICENSE-2.0
9
10  Unless required by applicable law or agreed to in writing, software
11  distributed under the License is distributed on an "AS IS" BASIS,
12  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13  See the License for the specific language governing permissions and
14  limitations under the License.
15
16  Author: KUMARAN M (kumaran.m@tataelxsi.co.in), RAJESH S (rajesh.s@tataelxsi.co.in), BARATH KUMAR R (barath.r@tataelxsi.co.in)
17 */
18 /**
19  * @file users details Component.
20  */
21 import { Component, Injector, OnDestroy, OnInit } from '@angular/core';
22 import { NgbModal, NgbModalRef } from '@ng-bootstrap/ng-bootstrap';
23 import { TranslateService } from '@ngx-translate/core';
24 import { AddEditUserComponent } from 'AddEditUserComponent';
25 import { ERRORDATA, MODALCLOSERESPONSEDATA } from 'CommonModel';
26 import { DataService } from 'DataService';
27 import { environment } from 'environment';
28 import { LocalDataSource } from 'ng2-smart-table';
29 import { ProjectService } from 'ProjectService';
30 import { RestService } from 'RestService';
31 import { Subscription } from 'rxjs';
32 import { SharedService } from 'SharedService';
33 import { UserData, UserDetail } from 'UserModel';
34 import { UsersActionComponent } from 'UsersActionComponent';
35 import { isNullOrUndefined } from 'util';
36
37 /**
38  * Creating component
39  * @Component takes UserDetailsComponent.html as template url
40  */
41 @Component({
42   templateUrl: './UserDetailsComponent.html',
43   styleUrls: ['./UserDetailsComponent.scss']
44 })
45 /** Exporting a class @exports UserDetailsComponent */
46 export class UserDetailsComponent implements OnInit, OnDestroy {
47   /** Data of smarttable populate through LocalDataSource @public */
48   public dataSource: LocalDataSource = new LocalDataSource();
49
50   /** handle translate @public */
51   public translateService: TranslateService;
52
53   /** To inject services @public */
54   public injector: Injector;
55
56   /** Settings for smarttable to populate the table with columns @public */
57   public settings: object = {};
58
59   /** Check the loading results @public */
60   public isLoadingResults: boolean = true;
61
62   /** Give the message for the loading @public */
63   public message: string = 'PLEASEWAIT';
64
65   /** Class for empty and present data @public */
66   public checkDataClass: string;
67
68   /** Instance of the rest service @private */
69   private restService: RestService;
70
71   /** dataService to pass the data from one component to another @private */
72   private dataService: DataService;
73
74   /** Instance of the modal service @private */
75   private modalService: NgbModal;
76
77   /** Formation of appropriate Data for LocalDatasource @private */
78   private userData: {}[] = [];
79
80   /** Contains all methods related to shared @private */
81   private sharedService: SharedService;
82
83   /** Holds all project details */
84   private projectService: ProjectService;
85
86   /** holds the project information @private */
87   private projectList: {}[] = [];
88
89   /** Columns list of the smart table @public */
90   private columnLists: object = {};
91
92   /** Instance of subscriptions @private */
93   private generateDataSub: Subscription;
94
95   constructor(injector: Injector) {
96     this.injector = injector;
97     this.restService = this.injector.get(RestService);
98     this.dataService = this.injector.get(DataService);
99     this.sharedService = this.injector.get(SharedService);
100     this.modalService = this.injector.get(NgbModal);
101     this.projectService = this.injector.get(ProjectService);
102     this.translateService = this.injector.get(TranslateService);
103   }
104
105   /**
106    * Lifecyle Hooks the trigger before component is instantiate
107    */
108   public ngOnInit(): void {
109     this.projectService.getAllProjects().subscribe((projects: {}[]) => {
110       this.projectList = projects;
111     });
112     this.generateColumns();
113     this.generateSettings();
114     this.generateData();
115     this.generateDataSub = this.sharedService.dataEvent.subscribe(() => { this.generateData(); });
116   }
117
118   /** smart table Header Colums @public */
119   public generateColumns(): void {
120     this.columnLists = {
121       username: { title: this.translateService.instant('NAME'), width: '20%', sortDirection: 'asc' },
122       projects: { title: this.translateService.instant('PAGE.DASHBOARD.PROJECTS'), width: '25%' },
123       identifier: { title: this.translateService.instant('IDENTIFIER'), width: '20%' },
124       modified: { title: this.translateService.instant('MODIFIED'), width: '15%' },
125       created: { title: this.translateService.instant('CREATED'), width: '15%' },
126       Actions: {
127         name: 'Action', width: '5%', filter: false, sort: false, title: this.translateService.instant('ACTIONS'), type: 'custom',
128         valuePrepareFunction: (cell: UserData, row: UserData): UserData => row,
129         renderComponent: UsersActionComponent
130       }
131     };
132   }
133
134   /** smart table Data Settings @public */
135   public generateSettings(): void {
136     this.settings = {
137       edit: { editButtonContent: '<i class="fa fa-edit" title="Edit"></i>', confirmSave: true },
138       delete: { deleteButtonContent: '<i class="far fa-trash-alt" title="delete"></i>', confirmDelete: true },
139       columns: this.columnLists,
140       actions: { add: false, edit: false, delete: false, position: 'right' },
141       attr: this.sharedService.tableClassConfig(),
142       pager: this.sharedService.paginationPagerConfig(),
143       noDataMessage: this.translateService.instant('NODATAMSG')
144     };
145   }
146
147   /** on Navigate to Composer Page @public */
148   public composeUser(): void {
149     const modalRef: NgbModalRef = this.modalService.open(AddEditUserComponent, { backdrop: 'static' });
150     modalRef.componentInstance.userTitle = this.translateService.instant('PAGE.USERS.NEWUSER');
151     modalRef.componentInstance.userType = 'add';
152     modalRef.result.then((result: MODALCLOSERESPONSEDATA) => {
153       if (result) {
154         this.sharedService.callData();
155       }
156     }).catch();
157   }
158
159   /** smart table listing manipulation @private */
160   public onChange(perPageValue: number): void {
161     this.dataSource.setPaging(1, perPageValue, true);
162   }
163
164   /** OnUserRowSelect function @private */
165   public onUserRowSelect(event: MessageEvent): void {
166     Object.assign(event.data, { page: 'users' });
167     this.dataService.changeMessage(event.data);
168   }
169
170   /** Set up user details @public */
171   public setUserDetails(userData: UserDetail): void {
172     const userDataObj: UserData = {
173       username: userData.username,
174       modified: this.sharedService.convertEpochTime(!isNullOrUndefined(userData._admin) ? userData._admin.modified : null),
175       created: this.sharedService.convertEpochTime(!isNullOrUndefined(userData._admin) ? userData._admin.created : null),
176       projects: userData.projectListName,
177       identifier: userData._id
178     };
179     this.userData.push(userDataObj);
180   }
181
182   /**
183    * Lifecyle hook which get trigger on component destruction
184    */
185   public ngOnDestroy(): void {
186     this.generateDataSub.unsubscribe();
187   }
188
189   /** Fetching the data from server to Load in the smarttable @protected */
190   protected generateData(): void {
191     this.isLoadingResults = true;
192     this.restService.getResource(environment.USERS_URL).subscribe((usersData: UserDetail[]) => {
193       this.userData = [];
194       usersData.forEach((userData: UserDetail) => {
195         if (userData.projects.length > 0) {
196           userData.projectListName = userData.projects.join(', ');
197         } else {
198           userData.projectListName = '';
199         }
200         this.setUserDetails(userData);
201       });
202       if (this.userData.length > 0) {
203         this.checkDataClass = 'dataTables_present';
204       } else {
205         this.checkDataClass = 'dataTables_empty';
206       }
207       this.dataSource.load(this.userData).then((data: {}) => {
208         this.isLoadingResults = false;
209       }).catch();
210     }, (error: ERRORDATA) => {
211       this.restService.handleError(error, 'get');
212       this.isLoadingResults = false;
213     });
214   }
215 }