Allow partial export

hpi-sam · Dec 22, 2022 · cf17cc3 · cf17cc3
1 parent 70d09e5
commit cf17cc3
Show file tree

Hide file tree

Showing 8 changed files with 162 additions and 12 deletions.
diff --git a/frontend/src/app/pages/exercises/exercise/exercise.module.ts b/frontend/src/app/pages/exercises/exercise/exercise.module.ts
@@ -16,6 +16,7 @@ import { ExerciseSettingsModalComponent } from './shared/exercise-settings/exerc
 import { ExerciseStateBadgeComponent } from './shared/exercise-state-badge/exercise-state-badge.component';
 import { ExerciseStatisticsModule } from './shared/exercise-statistics/exercise-statistics.module';
 import { HospitalEditorModule } from './shared/hospital-editor/hospital-editor.module';
+import { PartialExportSelectionComponent } from './shared/partial-export-selection/partial-export-selection-modal/partial-export-selection.component';
 import { TimeTravelComponent } from './shared/time-travel/time-travel.component';
 import { TrainerMapEditorComponent } from './shared/trainer-map-editor/trainer-map-editor.component';
 import { TrainerToolbarComponent } from './shared/trainer-toolbar/trainer-toolbar.component';
@@ -32,6 +33,7 @@ import { TransferOverviewModule } from './shared/transfer-overview/transfer-over
         CreateImageTemplateModalComponent,
         EditImageTemplateModalComponent,
         ImageTemplateFormComponent,
+        PartialExportSelectionComponent,
     ],
     imports: [
         CommonModule,

diff --git a/frontend/src/app/pages/exercises/exercise/exercise/exercise.component.html b/frontend/src/app/pages/exercises/exercise/exercise/exercise.component.html
@@ -64,6 +64,10 @@ <h2>
                             um {{ timeConstraints.current | formatDuration }}
                         </span>
                     </button>
+                    <button ngbDropdownItem (click)="partialExport()">
+                        <i class="bi-card-list me-2"> </i>
+                        Partieller Export
+                    </button>
                 </div>
             </div>
         </h2>

diff --git a/frontend/src/app/pages/exercises/exercise/exercise/exercise.component.ts b/frontend/src/app/pages/exercises/exercise/exercise/exercise.component.ts
@@ -1,9 +1,10 @@
 import type { OnDestroy } from '@angular/core';
 import { Component } from '@angular/core';
+import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
 import { Store } from '@ngrx/store';
 import {
-    cloneDeepMutable,
     StateExport,
+    cloneDeepMutable,
     StateHistoryCompound,
 } from 'digital-fuesim-manv-shared';
 import { Subject } from 'rxjs';
@@ -13,16 +14,17 @@ import { MessageService } from 'src/app/core/messages/message.service';
 import { saveBlob } from 'src/app/shared/functions/save-blob';
 import type { AppState } from 'src/app/state/app.state';
 import {
-    selectExerciseId,
     selectExerciseStateMode,
     selectTimeConstraints,
+    selectExerciseId,
 } from 'src/app/state/application/selectors/application.selectors';
 import {
-    selectExerciseState,
     selectParticipantId,
+    selectExerciseState,
 } from 'src/app/state/application/selectors/exercise.selectors';
-import { selectStateSnapshot } from 'src/app/state/get-state-snapshot';
 import { selectOwnClient } from 'src/app/state/application/selectors/shared.selectors';
+import { selectStateSnapshot } from 'src/app/state/get-state-snapshot';
+import { openPartialExportSelectionModal } from '../shared/partial-export-selection/open-partial-export-selection-modal';
 
 @Component({
     selector: 'app-exercise',
@@ -43,7 +45,8 @@ export class ExerciseComponent implements OnDestroy {
         private readonly store: Store<AppState>,
         private readonly apiService: ApiService,
         private readonly applicationService: ApplicationService,
-        private readonly messageService: MessageService
+        private readonly messageService: MessageService,
+        private readonly modalService: NgbModal
     ) {}
 
     public shareExercise(type: 'participantId' | 'trainerId') {
@@ -103,6 +106,10 @@ export class ExerciseComponent implements OnDestroy {
         saveBlob(blob, `exercise-state-${currentState.participantId}.json`);
     }
 
+    public partialExport() {
+        openPartialExportSelectionModal(this.modalService);
+    }
+
     public exportExerciseState() {
         const currentState = selectStateSnapshot(
             selectExerciseState,

diff --git a/...exercises/exercise/shared/partial-export-selection/open-partial-export-selection-modal.ts b/...exercises/exercise/shared/partial-export-selection/open-partial-export-selection-modal.ts
@@ -0,0 +1,8 @@
+import type { NgbModal } from '@ng-bootstrap/ng-bootstrap';
+import { PartialExportSelectionComponent } from './partial-export-selection-modal/partial-export-selection.component';
+
+export function openPartialExportSelectionModal(ngbModalService: NgbModal) {
+    ngbModalService.open(PartialExportSelectionComponent, {
+        size: 'm',
+    });
+}
diff --git a/...l-export-selection/partial-export-selection-modal/partial-export-selection.component.html b/...l-export-selection/partial-export-selection-modal/partial-export-selection.component.html
@@ -0,0 +1,59 @@
+<div class="modal-header">
+    <h4 class="modal-title">Partieller Export</h4>
+    <button type="button" class="btn-close" (click)="close()"></button>
+</div>
+<div class="modal-body">
+    <table class="table">
+        <tbody>
+            <tr>
+                <td>Patientenvorlagen</td>
+                <td>
+                    <div class="form-switch">
+                        <input
+                            [(ngModel)]="configuration.patientCategories"
+                            class="form-check-input"
+                            type="checkbox"
+                        />
+                    </div>
+                </td>
+            </tr>
+            <tr>
+                <td>Fahrzeugvorlagen</td>
+                <td>
+                    <div class="form-switch">
+                        <input
+                            [(ngModel)]="configuration.vehicleTemplates"
+                            class="form-check-input"
+                            type="checkbox"
+                        />
+                    </div>
+                </td>
+            </tr>
+            <tr>
+                <td>Bildvorlagen</td>
+                <td>
+                    <div class="form-switch">
+                        <input
+                            [(ngModel)]="configuration.mapImageTemplates"
+                            class="form-check-input"
+                            type="checkbox"
+                        />
+                    </div>
+                </td>
+            </tr>
+        </tbody>
+    </table>
+    <button
+        (click)="partialExport()"
+        [disabled]="
+            !(
+                configuration.mapImageTemplates ||
+                configuration.patientCategories ||
+                configuration.vehicleTemplates
+            )
+        "
+        class="btn btn-primary"
+    >
+        Exportieren
+    </button>
+</div>
diff --git a/...l-export-selection/partial-export-selection-modal/partial-export-selection.component.scss b/...l-export-selection/partial-export-selection-modal/partial-export-selection.component.scss
diff --git a/...ial-export-selection/partial-export-selection-modal/partial-export-selection.component.ts b/...ial-export-selection/partial-export-selection-modal/partial-export-selection.component.ts
@@ -0,0 +1,62 @@
+import { Component } from '@angular/core';
+import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
+import { Store } from '@ngrx/store';
+import { cloneDeepMutable, PartialExport } from 'digital-fuesim-manv-shared';
+import { saveBlob } from 'src/app/shared/functions/save-blob';
+import type { AppState } from 'src/app/state/app.state';
+import { selectExerciseState } from 'src/app/state/application/selectors/exercise.selectors';
+import { selectStateSnapshot } from 'src/app/state/get-state-snapshot';
+
+interface PartialExportConfiguration {
+    patientCategories: boolean;
+    vehicleTemplates: boolean;
+    mapImageTemplates: boolean;
+}
+
+@Component({
+    selector: 'app-partial-export-selection',
+    templateUrl: './partial-export-selection.component.html',
+    styleUrls: ['./partial-export-selection.component.scss'],
+})
+export class PartialExportSelectionComponent {
+    constructor(
+        private readonly store: Store<AppState>,
+        public activeModal: NgbActiveModal
+    ) {}
+
+    public configuration: PartialExportConfiguration = {
+        mapImageTemplates: false,
+        patientCategories: false,
+        vehicleTemplates: false,
+    };
+
+    public close() {
+        this.activeModal.close();
+    }
+
+    public partialExport() {
+        const currentState = selectStateSnapshot(
+            selectExerciseState,
+            this.store
+        );
+        const patientCategories = this.configuration.patientCategories
+            ? currentState.patientCategories
+            : undefined;
+        const vehicleTemplates = this.configuration.vehicleTemplates
+            ? currentState.vehicleTemplates
+            : undefined;
+        const mapImageTemplates = this.configuration.mapImageTemplates
+            ? currentState.mapImageTemplates
+            : undefined;
+        const blob = new Blob([
+            JSON.stringify(
+                new PartialExport(
+                    cloneDeepMutable(patientCategories),
+                    cloneDeepMutable(vehicleTemplates),
+                    cloneDeepMutable(mapImageTemplates)
+                )
+            ),
+        ]);
+        saveBlob(blob, `exercise-partial-${currentState.participantId}.json`);
+    }
+}
diff --git a/shared/src/export-import/file-format/partial-export.ts b/shared/src/export-import/file-format/partial-export.ts
@@ -6,11 +6,8 @@ import {
     IsString,
     ValidateNested,
 } from 'class-validator';
-import {
-    MapImageTemplate,
-    PatientTemplate,
-    VehicleTemplate,
-} from '../../models';
+import { MapImageTemplate, VehicleTemplate } from '../../models';
+import { PatientCategory } from '../../models/patient-category';
 import { BaseExportImportFile } from './base-file';
 
 export class PartialExport extends BaseExportImportFile {
@@ -21,8 +18,8 @@ export class PartialExport extends BaseExportImportFile {
     @IsOptional()
     @IsArray()
     @ValidateNested({ each: true })
-    @Type(() => PatientTemplate)
-    public readonly patientTemplates?: PatientTemplate[];
+    @Type(() => PatientCategory)
+    public readonly patientCategories?: PatientCategory[];
 
     @IsOptional()
     @IsArray()
@@ -35,4 +32,15 @@ export class PartialExport extends BaseExportImportFile {
     @ValidateNested({ each: true })
     @Type(() => MapImageTemplate)
     public readonly mapImageTemplates?: MapImageTemplate[];
+
+    public constructor(
+        patientCategories?: PatientCategory[],
+        vehicleTemplates?: VehicleTemplate[],
+        mapImageTemplates?: MapImageTemplate[]
+    ) {
+        super();
+        this.patientCategories = patientCategories;
+        this.vehicleTemplates = vehicleTemplates;
+        this.mapImageTemplates = mapImageTemplates;
+    }
 }