Revize 9cc55d8d

Re #7534 'Profile settings' component connected to the API

webapp/src/app/header/header.component.ts

@@ -3 +3 @@
 import {LocalizationService} from '../localization/localization.service';
 import {UserService} from '../services/api/user.service';
 import {UserProfile} from '../models/user.model';
+import {ProfileSettingsComponent} from "../profile-settings/profile-settings.component";
 
 @Component({
   selector: 'app-header',
@@ -22 +23 @@
   }
 
   onProfileClick(): void {
-    // TODO (až bude hotovej endpoint na post notifikace)
-    // this.dialog.open(ProfileSettingsComponent, {
-    //   data: {
-    //     notifyDate: this.notificationSettings,
-    //     notifyTime: {
-    //       hour: this.notificationSettings.getHours(),
-    //       minute: this.notificationSettings.getMinutes()
-    //     }
-    //   }
-    // });
+    this.userService.getLoggedUserProfile()
+      .subscribe((data: UserProfile) => {
+        this.profile = data;
+
+        this.dialog.open(ProfileSettingsComponent, {
+          data: {
+            notification: this.profile.notification
+          }
+        }).afterClosed().subscribe(dialogData => {
+          this.userService.putNotificationSettingsWithLanguage(
+            {
+              notification: dialogData.notification
+            },
+            this.localizationService.getCurrentLanguage()
+          ).subscribe(() => {
+            this.userService.getLoggedUserProfile().subscribe((profile: UserProfile) => this.profile = profile);
+          });
+        });
+      });
   }
 }

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

@@ -12 +12 @@
   role: UserType;
 }
 
+export interface NotificationSettings {
+  notification: string;
+}

webapp/src/app/profile-settings/profile-settings.component.html

@@ -2 +2 @@
 
 <div mat-dialog-content>
   <span class="notification-label">Notifikace o vypršení dovolené: </span>
-  <app-datetime [(date)]="data.notifyDate" [(time)]="data.notifyTime" [minuteStep]="15"></app-datetime>
+  <app-datetime [(date)]="date" [(time)]="time" [minuteStep]="15"></app-datetime>
 </div>
 
 <div mat-dialog-actions align="end">

webapp/src/app/profile-settings/profile-settings.component.ts

@@ -1 +1 @@
 import { Component, Inject } from '@angular/core';
 import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material';
+import {DateToolsService} from '../services/util/date-tools.service';
+import {DateFormatterService} from "../services/util/date-formatter.service";
 
 @Component({
   selector: 'app-profile-settings',
@@ -7 +9 @@
   styleUrls: ['./profile-settings.component.sass']
 })
 export class ProfileSettingsComponent {
+  private date: Date;
+  private time: string;
+
   constructor(
+    private dateToolsService: DateToolsService,
+    private dateFormatterService: DateFormatterService,
     public dialogRef: MatDialogRef<ProfileSettingsComponent>,
     @Inject(MAT_DIALOG_DATA) public data: ProfileSettingsDialogData,
   ) {
+    const parsedDatetime = this.dateToolsService.toDateAndTime(this.data.notification);
+
+    this.date = parsedDatetime.date;
+    this.time = parsedDatetime.time;
   }
 
   onConfirmClick(): void {
     this.dialogRef.close({
       isConfirmed: true,
-      notifyDate: this.data.notifyDate,
-      notifyTime: this.data.notifyTime
+      notification: this.dateFormatterService.formatDatetime(
+        this.dateToolsService.toDate(
+          this.dateFormatterService.formatDate(this.date),
+          this.time
+        )
+      )
     });
   }
 
@@ -29 +44 @@
 }
 
 export interface ProfileSettingsDialogData {
-  notifyDate: Date;
-  notifyTime: string;
+  notification: string; // yyyy/mm/dd hh:mm:ss
 }

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

@@ -5 +5 @@
 import {BasicService} from './basic.service';
 import {catchError} from 'rxjs/operators';
 import {Languages, RequestStatus, RequestTypes} from '../../enums/common.enum';
-import {UserSettings} from '../../models/settings.model';
+import {NotificationSettings, UserSettings} from '../../models/settings.model';
 import {UserProfile} from '../../models/user.model';
 import {UserRequest} from '../../models/requests.model';
 import {MatSnackBar} from '@angular/material';
@@ -126 +126 @@
     return this.makePutUserSettingsApiCall(settings, language);
   }
 
+  putNotificationSettingsWithLanguage(settings: NotificationSettings, language: Languages) {
+    console.log(settings);
+    return this.makePutNotificationSettingsApiCall(settings, language);
+  }
   /**
    * Accept or deny user request
    * @param request request to accept or deny
@@ -237 +241 @@
       );
   }
 
+  /**
+   * Změna nastavení notifikace uživatele podle id
+   * PUT /user/settings?[lang=<CZ,EN>]
+   * @param settings notification setting to be set for given user
+   * @param language specified language
+   */
+  private makePutNotificationSettingsApiCall(settings: NotificationSettings, language: Languages) {
+    const httpParams: HttpParams = this.createParams({lang: language});
+    const options = {params: httpParams};
+
+    return this.http.put<NotificationSettings>(this._userUrl + 'settings', settings, options)
+      .pipe(
+        catchError(err => this.handleError(err))
+      );
+  }
+
   /**
    * Vytvoření nové dovolené nebo sick day
    * POST /user/calendar/create?[lang=<CZ,EN>]

webapp/src/app/services/util/date-tools.service.ts

@@ -61 +61 @@
 
     return result;
   }
+
+  /**
+   * Creates {date: Date, time: string} object from string representation of datetime in format 'yyyy/mm/dd hh:mm:ss'
+   * @param datetime string representation of datetime in format 'yyyy/mm/dd hh:mm:ss'
+   */
+  toDateAndTime(datetime: string) {
+    const parsedDatetime = datetime.split(' ');
+    const parsedDate = parsedDatetime[0].split('/');
+    const parsedTime = parsedDatetime[1].split(':');
+
+    const date = new Date(Number(parsedDate[0]), Number(parsedDate[1]), Number(parsedDate[2]));
+    const time = parsedTime[0] + ':' + parsedTime[1];
+
+    return {
+      date,
+      time
+    };
+  }
 }