fix merge conflicts

improve usability add final save functions
thm-mni-ii · Jan 17, 2024 · 325a2dc · 325a2dc
1 parent 7256400
commit 325a2dc
Show file tree

Hide file tree

Showing 9 changed files with 133 additions and 74 deletions.
diff --git a/modules/fbs-core/web/src/app/dialogs/task-new-dialog/task-new-dialog.component.html b/modules/fbs-core/web/src/app/dialogs/task-new-dialog/task-new-dialog.component.html
@@ -1,45 +1,43 @@
-<div matDialogTitle *ngIf="!isUpdate">
-  {{ "dialog.task.new.title-create" | i18nextEager }}
-</div>
-<div matDialogTitle *ngIf="isUpdate">
-  {{ "dialog.task.new.title-edit" | i18nextEager }}
-</div>
 <div matDialogTitle *ngIf="updateCondition === allUpdateConditions.CREATE">
-  Neue Aufgabe erstellen
+  {{ "dialog.task.new.title-create" | i18nextEager }}
 </div>
 <div matDialogTitle *ngIf="updateCondition === allUpdateConditions.UPDATE">
-  Aufgabe bearbeiten
+  {{ "dialog.task.new.title-edit" | i18nextEager }}
 </div>
 <div
   matDialogTitle
   *ngIf="updateCondition === allUpdateConditions.UPDATE_MULTIPLE"
 >
-  Ausgewählte Aufgaben bearbeiten
+  {{ "dialog.task.new.title-edit-multiple" | i18nextEager }}
 </div>
 
 <div *ngIf="updateCondition === allUpdateConditions.UPDATE_MULTIPLE">
   Ausgewählte Aufgaben:
-  <span *ngFor="let task of data.tasks"> {{ task.name }}; </span>
+  <span *ngFor="let task of data.tasks">
+    <b>{{ task.name }}; </b>
+  </span>
 
   <section
     *ngIf="updateCondition === allUpdateConditions.UPDATE_MULTIPLE"
     class="checkboxes"
   >
     <div>
-      Deadline
-      <mat-checkbox [(ngModel)]="datePickerSelected"></mat-checkbox>
+      {{ "dialog.task.new.placeholder-deadline" | i18nextEager }}
+      <mat-checkbox [(ngModel)]="selectedFormFields.datePicker"></mat-checkbox>
     </div>
     <div>
-      Mediatype
-      <mat-checkbox [(ngModel)]="mediaTypeSelected"></mat-checkbox>
+      {{ "dialog.task.new.label-mediatype" | i18nextEager }}
+      <mat-checkbox [(ngModel)]="selectedFormFields.mediaType"></mat-checkbox>
     </div>
     <div>
-      Verbindlichkeit
-      <mat-checkbox [(ngModel)]="requirementTypeSelected"></mat-checkbox>
+      {{ "dialog.task.new.label-requirement" | i18nextEager }}
+      <mat-checkbox
+        [(ngModel)]="selectedFormFields.requirementType"
+      ></mat-checkbox>
     </div>
     <div>
-      Sichtbarkeit
-      <mat-checkbox [(ngModel)]="isPrivateSelected"></mat-checkbox>
+      {{ "dialog.task.new.label-visibility" | i18nextEager }}
+      <mat-checkbox [(ngModel)]="selectedFormFields.isPrivate"></mat-checkbox>
     </div>
   </section>
 </div>
@@ -89,7 +87,7 @@
         [readonly]="true"
         matInput
         [ngxMatDatetimePicker]="picker"
-        [disabled]="datePickerDisabled || !datePickerSelected"
+        [disabled]="datePickerDisabled || !selectedFormFields.datePicker"
         placeholder="{{
           'dialog.task.new.placeholder-deadline' | i18nextEager
         }}"
@@ -101,7 +99,7 @@
       <ngx-mat-datetime-picker
         #picker
         [showSeconds]="true"
-        [disabled]="!datePickerSelected"
+        [disabled]="!selectedFormFields.datePicker"
       ></ngx-mat-datetime-picker>
     </mat-form-field>
 
@@ -110,7 +108,7 @@
       formControlName="expCheck"
       class="noDeadline"
       (change)="setMaxExpirationDate($event)"
-      [disabled]="!datePickerSelected"
+      [disabled]="!selectedFormFields.datePicker"
     >
       {{ "dialog.task.new.toggle-no-deadline" | i18nextEager }}
     </mat-slide-toggle>
@@ -122,7 +120,7 @@
       }}</mat-label>
       <mat-select
         formControlName="mediaType"
-        [disabled]="disableTypeChange || !mediaTypeSelected"
+        [disabled]="disableTypeChange || !selectedFormFields.mediaType"
         (selectionChange)="changedMediaType()"
       >
         <mat-option value="text/plain">{{
@@ -137,14 +135,14 @@
       </mat-select>
     </mat-form-field>
 
-    <!-- Task Mediatype -->
+    <!-- Task Requirement -->
     <mat-form-field class="col pad">
       <mat-label>{{
         "dialog.task.new.label-requirement" | i18nextEager
       }}</mat-label>
       <mat-select
         formControlName="requirementType"
-        [disabled]="!requirementTypeSelected"
+        [disabled]="!selectedFormFields.requirementType"
       >
         <mat-option value="mandatory">{{
           "dialog.task.new.option-compulsory" | i18nextEager
@@ -164,7 +162,10 @@
       <mat-label>{{
         "dialog.task.new.label-visibility" | i18nextEager
       }}</mat-label>
-      <mat-select formControlName="isPrivate" [disabled]="!isPrivateSelected">
+      <mat-select
+        formControlName="isPrivate"
+        [disabled]="!selectedFormFields.isPrivate"
+      >
         <mat-option value="Studenten">{{
           "dialog.task.new.option-students" | i18nextEager
         }}</mat-option>
@@ -297,17 +298,7 @@
       *ngIf="updateCondition === allUpdateConditions.UPDATE_MULTIPLE"
       mat-flat-button
       color="accent"
-      [disabled]="!taskForm.valid"
-      (click)="updateMultipleTaskDetails(selectedTasks)"
-    >
-      Ausgewählte Aufgaben bearbeiten
-    </button>
-    <button
-      *ngIf="updateCondition === allUpdateConditions.UPDATE_MULTIPLE"
-      mat-flat-button
-      color="accent"
-      [disabled]="!taskForm.valid"
-      (click)="updateMultipleTaskDetails(selectedTasks)"
+      (click)="updateMultipleTaskDetails(data.tasks)"
     >
       Ausgewählte Aufgaben bearbeiten
     </button>

diff --git a/modules/fbs-core/web/src/app/dialogs/task-new-dialog/task-new-dialog.component.ts b/modules/fbs-core/web/src/app/dialogs/task-new-dialog/task-new-dialog.component.ts
@@ -23,6 +23,7 @@ import { CheckerConfig } from "../../model/CheckerConfig";
 import { CheckerFileType } from "src/app/enums/checkerFileType";
 import { MatSlideToggle } from "@angular/material/slide-toggle";
 import { TaskUpdateConditions } from "src/app/enums/taskUpdateConditions";
+import { SelectedFormFields } from "src/app/model/SelectedFormFields";
 
 const defaultMediaType = "text/plain";
 const defaultrequirement = "mandatory";
@@ -51,15 +52,17 @@ export class TaskNewDialogComponent implements OnInit {
     pointFields: new UntypedFormControl(""),
     decimals: new UntypedFormControl(2),
     expCheck: new FormControl<Boolean>(false),
-    datePickerSelected: new FormControl<Boolean>(false),
+    // datePickerSelected: new FormControl<Boolean>(false),
   });
   updateCondition: TaskUpdateConditions = TaskUpdateConditions.CREATE;
   allUpdateConditions = TaskUpdateConditions;
 
-  datePickerSelected = false;
-  mediaTypeSelected = false;
-  requirementTypeSelected = false;
-  isPrivateSelected = false;
+  selectedFormFields: SelectedFormFields = {
+    datePicker: false,
+    mediaType: false,
+    requirementType: false,
+    isPrivate: false,
+  };
 
   courseId: number;
   datePickerDisabled: boolean = false;
@@ -121,6 +124,12 @@ export class TaskNewDialogComponent implements OnInit {
     if (this.data.task) {
       this.updateCondition = TaskUpdateConditions.UPDATE;
       this.task = this.data.task;
+
+      this.selectedFormFields.datePicker = true;
+      this.selectedFormFields.mediaType = true;
+      this.selectedFormFields.requirementType = true;
+      this.selectedFormFields.isPrivate = true;
+
       this.setValues();
     } else if (this.data.tasks) {
       this.updateCondition = TaskUpdateConditions.UPDATE_MULTIPLE;
@@ -357,6 +366,21 @@ export class TaskNewDialogComponent implements OnInit {
   }
 
   updateMultipleTaskDetails(tasks: Task[]) {
-    this.taskService.updateMultipleTasks(this.courseId, tasks, this.task);
+    this.getValues();
+    this.taskService
+      .updateMultipleTasks(
+        this.courseId,
+        tasks,
+        this.task,
+        this.selectedFormFields
+      )
+      .subscribe((success) => {
+        if (success) {
+          this.dialogRef.close({ success: true });
+        } else {
+          this.dialogRef.close({ success: false });
+          this.snackBar.open("Error while updating tasks", "ok");
+        }
+      });
   }
 }
diff --git a/modules/fbs-core/web/src/app/model/SelectedFormFields.ts b/modules/fbs-core/web/src/app/model/SelectedFormFields.ts
@@ -0,0 +1,6 @@
+export interface SelectedFormFields {
+  datePicker: boolean;
+  mediaType: boolean;
+  requirementType: boolean;
+  isPrivate: boolean;
+}
diff --git a/modules/fbs-core/web/src/app/page-components/course-detail/course-detail.component.html b/modules/fbs-core/web/src/app/page-components/course-detail/course-detail.component.html
@@ -81,7 +81,7 @@
       mat-icon-button
       *ngIf="isAuthorized()"
       (click)="enableEditTasks()"
-      matTooltip="Kursinhalt bearbeiten"
+      matTooltip="{{ 'course.edit-multiple-tasks' | i18nextEager }}"
     >
       <mat-icon *ngIf="!editTasks" class="icon-off">toggle_off</mat-icon>
       <mat-icon *ngIf="editTasks" class="icon-on">toggle_on</mat-icon>
@@ -144,7 +144,7 @@
 
   <div class="description">{{ (course | async)?.description }}</div>
 
-  <div class="create-task">
+  <div class="create-task" *ngIf="!editTasks">
     <button
       mat-raised-button
       color="accent"
@@ -157,28 +157,38 @@
   </div>
 
   <div class="select-all-container">
-    <!-- Checkbox: Alles Auswählen -->
     <section *ngIf="editTasks">
       <mat-checkbox
         [ngModel]="isAllSelected()"
         (ngModelChange)="changeAllSelections()"
       >
-        <span *ngIf="!isAllSelected()">Alles auswählen</span>
-        <span *ngIf="isAllSelected()">Alles abwählen</span>
+        <span *ngIf="!isAllSelected()">{{
+          "course.edit-multiple-tasks-select-all" | i18nextEager
+        }}</span>
+        <span *ngIf="isAllSelected()">{{
+          "course.edit-multiple-tasks-de-select-all" | i18nextEager
+        }}</span>
       </mat-checkbox>
     </section>
 
-    <mat-icon
+    <button
+      mat-raised-button
+      class="edit-multiple-tasks-btn"
+      color="accent"
       *ngIf="editTasks"
       (click)="updateMultipleTaskDetails(selectedTasks)"
-      matTooltip="Aufgabe(n) bearbeiten"
-      >sync</mat-icon
+      matTooltip="{{ 'course.edit-multiple-tasks' | i18nextEager }}"
     >
+      <mat-icon>edit_note</mat-icon>&nbsp;{{
+        "course.edit-multiple-tasks" | i18nextEager
+      }}
+    </button>
   </div>
+
   <!-- Johannes approach for progres bar -->
   <mat-card class="progress-card">
     <mat-card-content>
-      <div class="title">
+      <div class="title" *ngIf="requirements">
         <h2>{{ "course.progress-title" | i18nextEager }}</h2>
         <!-- if coursePassed show badge -->
         <mat-chip-list *ngIf="(requirements | async).length === 0">

diff --git a/modules/fbs-core/web/src/app/page-components/course-detail/course-detail.component.scss b/modules/fbs-core/web/src/app/page-components/course-detail/course-detail.component.scss
@@ -109,9 +109,16 @@
 
 .select-all-container {
   display: flex;
+  align-items: center;
   justify-content: flex-start;
-  margin-bottom: 10px;
-  margin-top: 10px;
+  margin-bottom: 30px;
+  margin-top: 30px;
+  margin-left: 15px;
+
+  .edit-multiple-tasks-btn {
+    margin-left: 150px;
+    cursor: pointer;
+  }
 }
 .mat-progress-bar {
   height: 15px;

diff --git a/modules/fbs-core/web/src/app/page-components/course-detail/course-detail.component.ts b/modules/fbs-core/web/src/app/page-components/course-detail/course-detail.component.ts
@@ -171,12 +171,6 @@ export class CourseDetailComponent implements OnInit {
       // calculate total bonus points based on succeded requirements
       this.calculatedBonusPoints = 0;
 
-      console.log(taskResults);
-
-      req.forEach((element) => {
-        console.log(element);
-      });
-
       // check in requirements if tasks are passed based on taskResults, match via id
       if (req.length > 0) {
         this.coursePassed = true;
@@ -391,12 +385,6 @@ export class CourseDetailComponent implements OnInit {
   }
 
   updateMultipleTaskDetails(tasks: Task[]) {
-    console.log(tasks);
-
-    // for (let task in tasks) {
-    //   console.log(task);
-    // }
-
     this.dialog
       .open(TaskNewDialogComponent, {
         height: "auto",
@@ -569,7 +557,6 @@ export class CourseDetailComponent implements OnInit {
     if (this.isAllSelected()) {
       this.selectedTasks = [];
     } else {
-      console.log("not all selected");
       this.selectedTasks = this.tasks;
     }
   }

diff --git a/modules/fbs-core/web/src/app/service/task.service.ts b/modules/fbs-core/web/src/app/service/task.service.ts
@@ -1,9 +1,11 @@
 import { Injectable } from "@angular/core";
-import { Observable } from "rxjs";
+import { forkJoin, Observable } from "rxjs";
+import { take, catchError, map } from "rxjs/operators";
 import { Task } from "../model/Task";
 import { HttpClient } from "@angular/common/http";
 import { UserTaskResult } from "../model/UserTaskResult";
 import { saveAs } from "file-saver";
+import { SelectedFormFields } from "../model/SelectedFormFields";
 
 @Injectable({
   providedIn: "root",
@@ -81,15 +83,39 @@ export class TaskService {
    * @param task The new task state
    * @return Observable that succeeds if updated successfully
    */
-  updateMultipleTasks(cid: number, tasks: Task[], referenceTask: Task) {
-    tasks.forEach((task) => {
-      if (task.deadline !== null) task.deadline = referenceTask.deadline;
-      if (task.isPrivate !== null) task.isPrivate = referenceTask.isPrivate;
-      if (task.mediaType !== null) task.mediaType = referenceTask.mediaType;
-      // if (task. !== null) task.name = referenceTask.name;
+  updateMultipleTasks(
+    cid: number,
+    tasks: Task[],
+    referenceTask: Task,
+    selectedFormFields: SelectedFormFields
+  ): Observable<boolean> {
+    const updateObservables = tasks.map((task) => {
+      if (selectedFormFields.datePicker) {
+        task.deadline = referenceTask.deadline;
+      }
+      if (selectedFormFields.isPrivate) {
+        task.isPrivate = referenceTask.isPrivate;
+      }
+      if (selectedFormFields.mediaType) {
+        task.mediaType = referenceTask.mediaType;
+      }
+      if (selectedFormFields.requirementType) {
+        task.requirementType = referenceTask.requirementType;
+      }
 
-      // this.updateTask(cid, id, task);
+      return this.updateTask(cid, task.id, task).pipe(
+        take(1),
+        catchError((error) => {
+          console.error(`Failed to update task ${task.id}:`, error);
+          return [];
+        })
+      );
     });
+
+    return forkJoin(updateObservables).pipe(
+      map(() => true),
+      catchError(async () => false)
+    );
   }
 
   /**