Revize f8b40fd5

Re#7494 Implemented edit user settings

webapp/package.json

@@ -30 +30 @@
     "core-js": "^2.5.4",
     "date-fns": "^1.30.1",
     "flatpickr": "^4.5.7",
-    "fsevents": "^2.0.7",
     "rxjs": "~6.3.3",
     "tslib": "^1.9.0",
     "zone.js": "~0.8.26"

webapp/src/app/employees/edit-employee-dialog/edit-employee-dialog.component.html

@@ -1 +1 @@
 <h1 mat-dialog-title>
   <img
-    [src]="data.imageLink"
+    [src]="data.photo"
     alt="photo"
     style="width: 35px; height: 35px; margin-right: 5px"
   >
-  {{data.name}}
+  {{data.firstName + ' ' + data.lastName}}
 </h1>
 <hr>
 <div mat-dialog-content>
@@ -12 +12 @@
     <mat-radio-group
       aria-labelledby="example-radio-group-label"
       class="example-radio-group"
-      [(ngModel)]="userType"
+      [(ngModel)]="_userType"
     >
       <mat-radio-button
         class="example-radio-button"
-        *ngFor="let season of _userTypes" [value]="season"
+        *ngFor="let type of _userTypes" [value]="type"
       >
-        {{season}}
+        {{type}}
       </mat-radio-button>
     </mat-radio-group>
   </div>
@@ -29 +29 @@
         type="number"
         placeholder="Sickdays"
         min="1"
-        value="20"
+        step="0.5"
         [(ngModel)]="_sickDaysCount"
       >
     </mat-form-field>
@@ -43 +43 @@
       type="number"
       placeholder="Dovolená"
       min="1"
-      value="20"
+      step="0.5"
       [(ngModel)]="_vacationDaysCount"
     >
   </mat-form-field>

webapp/src/app/employees/edit-employee-dialog/edit-employee-dialog.component.ts

@@ -1 @@
-import {Component, Inject, Input, OnInit} from '@angular/core';
-import {MAT_DIALOG_DATA, MatDialogRef} from '@angular/material';
-import {User} from '../user.model';
+import {Component, EventEmitter, Inject, OnInit, Output} from '@angular/core';
+import {MAT_DIALOG_DATA, MatDialogRef, MatSnackBar} from '@angular/material';
 import {UserType} from '../../enums/common.enum';
+import {UserProfile} from '../../models/user.model';
+import {UserSettings} from '../../models/settings.model';
 
 
 @Component({
@@ -10 +11 @@
   styleUrls: ['./edit-employee-dialog.component.sass']
 })
 export class EditEmployeeDialogComponent implements OnInit {
-  readonly _userTypes: string[] = ['Zaměstnanec', 'Zaměstnavatel'];
+  readonly _userTypes: string[] = ['EMPLOYER', 'EMPLOYEE'];
   private _sickDaysCount: number;
   private _vacationDaysCount: number;
   private _userType: UserType;
+  private readonly _userId: number;
+  @Output() postUserSettings = new EventEmitter<UserSettings>();
 
   constructor(public dialogRef: MatDialogRef<EditEmployeeDialogComponent>,
-              @Inject(MAT_DIALOG_DATA) public data: User) {
-
+              @Inject(MAT_DIALOG_DATA) public data: UserProfile,
+              private snackBar: MatSnackBar) {
+    this._sickDaysCount = data.sickdayCount;
+    this._vacationDaysCount = data.vacationCount;
+    this._userType = data.role;
+    this._userId = data.id;
   }
 
   ngOnInit() {
   }
 
-  @Input()
-  set userType(userType: string) {
-    this._userType = UserType.EMPLOYEE;
-    console.log('intercepted ' + this._userType);
-  }
-
   onConfirmClick(): void {
-    this.dialogRef.close();
+    if (this._sickDaysCount == null || this._vacationDaysCount == null || this._userType == null) {
+      this.snackBar.open('Vyplňte prosím všechny údaje', 'Zavřít');
+    } else {
+      this.postUserSettings.emit({
+        id: this._userId,
+        role: this._userType,
+        sickdayCount: this._sickDaysCount,
+        vacationCount: this._vacationDaysCount
+      });
+
+      this.dialogRef.close();
+    }
   }
 
-
   onCloseClick(): void {
     this.dialogRef.close();
   }

webapp/src/app/employees/employees-list.component.html

@@ -1 +1 @@
 <div class="employee-component">
   <h3>Zaměstnanci
-    <span class="material-icons" style="font-size: medium; margin-right: 5px">add</span>
     <span class="material-icons" style="font-size: medium">edit</span>
   </h3>
 
@@ -32 +31 @@
         </div>
       </td>
       <td>
-        <span class="material-icons" style="font-size: small" (click)="openDialog(user)">edit</span>
+        <span class="material-icons" style="font-size: small" (click)="openEditUserDialog(user)">edit</span>
       </td>
     </tr>
     </tbody>

webapp/src/app/employees/employees-list.component.ts

@@ -1 +1 @@
 import {Component, OnInit} from '@angular/core';
 import {UsersService} from '../services/users.service';
 import {VacationType} from '../enums/common.enum';
-import {MatDialog} from '@angular/material';
+import {MatDialog, MatSnackBar} from '@angular/material';
 import {EditEmployeeDialogComponent} from './edit-employee-dialog/edit-employee-dialog.component';
 import {DayInfo, User} from './user.model';
-import {UserBasicInformation} from '../models/user.model';
+import {UserBasicInformation, UserProfile} from '../models/user.model';
+import {UserService} from '../services/user.service';
+import {SettingsService} from '../services/settings.service';
 
 const daysOfWeek: string[] = [
   'po',
@@ -28 +30 @@
   private _employeesBasicInformation: UserBasicInformation[] = [];
   readonly _todayDate: Date = new Date();
 
-  constructor(private usersService: UsersService, public dialog: MatDialog) {
+  constructor(private usersService: UsersService,
+              private userService: UserService,
+              private settingsService: SettingsService,
+              public dialog: MatDialog,
+              private snackBar: MatSnackBar) {
     this.generateDays();
     this.generateDates();
     this.editDates();
   }
 
-  openDialog(user: User): void {
-    this.dialog.open(EditEmployeeDialogComponent, {
-     data: user,
-   });
+  openEditUserDialog(user: User): void {
+    this.userService.getUserProfile(user.id)
+      .subscribe((userProfile: UserProfile) => {
+        const dialogRef = this.dialog.open(EditEmployeeDialogComponent, {
+          data: userProfile,
+        });
+
+        dialogRef.componentInstance.postUserSettings.subscribe((emittedData) => {
+          this.userService.putUserSettings(emittedData)
+            .subscribe(() => this.snackBar.open('Povedlo se', 'Zavrit'));
+        });
+      });
   }
 
   private generateDays(): void {
@@ -119 +133 @@
     // this.userService.postCalendar(calendar)
     //   .subscribe((data: any) => console.log(data));
 
-    // const settings: PostUserSettings = {
+    // const settings: UserSettings = {
     //   id: 1,
     //   role: UserType.EMPLOYEE,
     //   sickdayCount: 1,

webapp/src/app/employees/employees.module.ts

@@ -1 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
+import {NgModule} from '@angular/core';
+import {CommonModule} from '@angular/common';
 import {EmployeesListComponent} from './employees-list.component';
-import {MatDialogModule, MatFormFieldModule, MatInputModule, MatRadioModule, MatTableModule} from '@angular/material';
+import {MatDatepickerModule, MatDialogModule, MatFormFieldModule, MatInputModule, MatRadioModule, MatTableModule} from '@angular/material';
 import {EditEmployeeDialogComponent} from './edit-employee-dialog/edit-employee-dialog.component';
 import {FormsModule} from '@angular/forms';
 
 @NgModule({
   declarations: [
     EmployeesListComponent,
-    EditEmployeeDialogComponent
+    EditEmployeeDialogComponent,
   ],
   imports: [
     CommonModule,
@@ -17 +17 @@
     FormsModule,
     MatInputModule,
     MatDialogModule,
-    MatRadioModule
+    MatRadioModule,
+    MatDatepickerModule
   ],
   entryComponents: [
     EditEmployeeDialogComponent,

webapp/src/app/models/settings.model.ts

@@ -5 +5 @@
   notification: string;
 }
 
-export interface PostUserSettings {
+export interface UserSettings {
   id: number;
   vacationCount: number;
   sickdayCount: number;

webapp/src/app/services/profile.service.ts

@@ -12 +12 @@
   constructor(
     private userService: UserService
   ) {
-    // userService.getEmployeeProfile(1)
+    // userService.getUserProfile(1)
     //   .subscribe((data: UserProfile) => this.profile = data);
   }
 
@@ -22 +22 @@
         observer.next(this.profile);
         observer.complete();
       } else {
-        this.userService.getEmployeeProfile(1) // TODO zmenit id na prihlaseneho uzivatele
+        this.userService.getUserProfile(1) // TODO zmenit id na prihlaseneho uzivatele
           .subscribe((data: UserProfile) => {
             this.profile = data;
             observer.next(this.profile);

webapp/src/app/services/user.service.ts

@@ -5 +5 @@
 import {BasicService} from './basic.service';
 import {catchError} from 'rxjs/operators';
 import {Languages, RequestStatus, RequestTypes} from '../enums/common.enum';
-import {PostUserSettings} from '../models/settings.model';
+import {UserSettings} from '../models/settings.model';
 import {UserProfile} from '../models/user.model';
 import {UserRequest} from '../models/requests.model';
 
@@ -20 +20 @@
   }
 
   /**
-   * Returns employee profile if the user making this call
+   * Returns user profile if the user making this call
    * is logged as admin
    * UserProfile.notification might be returned as string instead of date
    * @param id employee id
    */
-  getEmployeeProfile(id: number) {
-    return this.makeGetProfileApiCall(id.toString(), '');
+  getUserProfile(id: number) {
+    return this.makeGetProfileApiCall(id.toString(), null);
   }
 
   /**
-   * Overloaded version of getEmployeeProfile to filter profiles
+   * Overloaded version of getUserProfile to filter profiles
    * by language
    * UserProfile.notification might be returned as string instead of date
-   * @param id employee profile id
+   * @param id user profile id
    * @param language language to filtery by
    */
-  getEmployeeProfileWithLanguage(id: number, language: Languages) {
+  getUserProfileWithLanguage(id: number, language: Languages) {
     return this.makeGetProfileApiCall(id.toString(), language);
   }
 
@@ -99 +99 @@
    * Put user settings with given id for the user
    * @param settings settings to be put
    */
-  putUserSettings(settings: PostUserSettings) {
+  putUserSettings(settings: UserSettings) {
     return this.makePutUserSettingsApiCall(settings, null);
   }
 
@@ -108 +108 @@
    * @param settings settings to be put
    * @param language specified language
    */
-  putUserSettingsWithLanguage(settings: PostUserSettings, language: Languages) {
+  putUserSettingsWithLanguage(settings: UserSettings, language: Languages) {
     return this.makePutUserSettingsApiCall(settings, language);
   }
 
@@ -157 +157 @@
    */
   private makeGetProfileApiCall(id: string, language: string) {
     const httpParams: HttpParams = this.createParams({lang: language});
-
     const options = {params: httpParams};
 
     return this.http.get<UserProfile>(this._userUrl + id + '/profile', options)
@@ -215 +214 @@
    * @param settings setting to be set for given user
    * @param language specified language
    */
-  private makePutUserSettingsApiCall(settings: PostUserSettings, language: Languages) {
+  private makePutUserSettingsApiCall(settings: UserSettings, language: Languages) {
     const httpParams: HttpParams = this.createParams({lang: language});
     const options = {params: httpParams};
 
-    return this.http.put<PostUserSettings>(this._userUrl + 'settings', settings, options)
+    return this.http.put<UserSettings>(this._userUrl + 'settings', settings, options)
       .pipe(
         catchError(err => this.handleError(err))
       );

webapp/yarn.lock

@@ -3003 +3003 @@
     nan "^2.12.1"
     node-pre-gyp "^0.12.0"
 
-fsevents@^2.0.7:
-  version "2.0.7"
-  resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-2.0.7.tgz#382c9b443c6cbac4c57187cdda23aa3bf1ccfc2a"
-  integrity sha512-a7YT0SV3RB+DjYcppwVDLtn13UQnmg0SWZS7ezZD0UjnLwXmy8Zm21GMVGLaFGimIqcvyMQaOJBrop8MyOp1kQ==
-
 fstream@^1.0.0, fstream@^1.0.12:
   version "1.0.12"
   resolved "https://registry.yarnpkg.com/fstream/-/fstream-1.0.12.tgz#4e8ba8ee2d48be4f7d0de505455548eae5932045"