Feature/interface signaller UI

.eslint/angular-template.eslintrc.cjs

@@ -6,6 +6,5 @@ module.exports = {
         '@angular-eslint/template/no-autofocus': 'off',
         '@angular-eslint/template/no-call-expression': ['error'],
         '@angular-eslint/template/no-negated-async': 'warn',
-        '@angular-eslint/template/no-positive-tabindex': 'warn',
     },
 };

CHANGELOG.md

@@ -12,6 +12,7 @@ and this project does **not** adhere to [Semantic Versioning](https://semver.org
 - In the patient popup, there is a now a tab with a QR Code of the patient identifier. It is also
   possible to set custom QR code contents for each patient to support complexer systems.
 - Berliner Feuerwehr is now mentioned as member of the project consortium.
+- There is a dedicated view for "interface signallers" to participate in an exercise with simulated regions. Interface signallers can request information from simulated regions on behalf of the incident command and forward instructions back to the simulated regions.
 
 ### Fixed
 

backend/src/fuesim-server.spec.ts

@@ -40,6 +40,7 @@ describe('Exercise saving', () => {
                             id: uuid(),
                             type: 'alarmGroup',
                             name: 'Alarm Group',
+                            sent: false,
                         },
                     },
                     null

frontend/cypress/e2e/exercise.cy.ts

@@ -246,8 +246,14 @@ describe('A trainer on the exercise page', () => {
         cy.dragToMap('[data-cy=draggableTransferPointDiv]');
         cy.get('[data-cy=trainerToolbarExecutionButton]').click();
         cy.get('[data-cy=trainerToolbarControlCenterButton]').click();
+        cy.get('[data-cy=sendAlarmGroupChooseAlarmGroupButton]')
+            .first()
+            .click();
+        cy.get('[data-cy=searchableDropdownOptionButton] > :nth-child(1)')
+            .first()
+            .click();
         cy.get('[data-cy=sendAlarmGroupChooseTargetButton]').first().click();
-        cy.get('[data-cy=sendAlarmGroupChooseTargetSelect] > :nth-child(1)')
+        cy.get('[data-cy=searchableDropdownOptionButton] > :nth-child(1)')
             .first()
             .click();
         cy.get('[data-cy=sendAlarmGroupSendButton]').click();
@@ -474,9 +480,7 @@ describe('A trainer on the exercise page', () => {
         cy.get(
             '[data-cy=transferPointPopupAddOtherTransferPointButton]'
         ).click();
-        cy.get(
-            '[data-cy=transferPointPopupAddOtherTransferPointDropdownButton]'
-        )
+        cy.get('[data-cy=searchableDropdownOptionButton]')
             .first()
             .click({ force: true });
 
@@ -519,9 +523,7 @@ describe('A trainer on the exercise page', () => {
         cy.get(
             '[data-cy=transferPointPopupAddOtherTransferPointButton]'
         ).click();
-        cy.get(
-            '[data-cy=transferPointPopupAddOtherTransferPointDropdownButton]'
-        )
+        cy.get('[data-cy=searchableDropdownOptionButton]')
             .first()
             .click({ force: true });
         cy.get('[data-cy=transferPointPopupDurationInput]')

frontend/package.json

@@ -44,6 +44,7 @@
         "chart.js": "^4.4.8",
         "class-validator": "^0.14.1",
         "digital-fuesim-manv-shared": "file:../shared",
+        "hotkeys-js": "^3.10.3",
         "immer": "^10.1.1",
         "lodash-es": "4.17.21",
         "ng-qrcode": "^19.0.1",

frontend/src/app/pages/exercises/exercise/shared/emergency-operations-center/emergency-operations-center-modal/emergency-operations-center-modal.component.html

@@ -8,7 +8,17 @@ <h4 class="modal-title">Leitstelle</h4>
     ></button>
 </div>
 <div class="modal-body" style="min-height: 60vh">
-    <app-send-alarm-group-interface></app-send-alarm-group-interface>
+    <div class="card">
+        <h5 class="card-header">Alarmieren</h5>
+        <div class="card-body">
+            <app-send-alarm-group-interface />
+        </div>
+    </div>
     <br />
-    <app-eoc-log-interface></app-eoc-log-interface>
+    <div class="card">
+        <h5 class="card-header">Einsatztagebuch</h5>
+        <div class="card-body">
+            <app-eoc-log-interface />
+        </div>
+    </div>
 </div>

frontend/src/app/pages/exercises/exercise/shared/emergency-operations-center/emergency-operations-center.module.ts

@@ -7,16 +7,12 @@ import {
 import { SharedModule } from 'src/app/shared/shared.module';
 import { FormsModule } from '@angular/forms';
 import { EmergencyOperationsCenterModalComponent } from './emergency-operations-center-modal/emergency-operations-center-modal.component';
-import { SendAlarmGroupInterfaceComponent } from './send-alarm-group-interface/send-alarm-group-interface.component';
 import { EocLogInterfaceComponent } from './eoc-log-interface/eoc-log-interface.component';
-import { TransferTargetDropdownComponent } from './transfer-target-dropdown/transfer-target-dropdown.component';
 
 @NgModule({
     declarations: [
         EmergencyOperationsCenterModalComponent,
-        SendAlarmGroupInterfaceComponent,
         EocLogInterfaceComponent,
-        TransferTargetDropdownComponent,
     ],
     imports: [
         CommonModule,

frontend/src/app/pages/exercises/exercise/shared/emergency-operations-center/eoc-log-interface/eoc-log-interface.component.html

@@ -1,54 +1,47 @@
-<div class="card">
-    <h5 class="card-header">Einsatztagebuch</h5>
-
-    <div class="p-3 border-bottom">
-        <textarea
-            [(ngModel)]="newLogEntry"
-            [appAutofocus]="true"
-            maxlength="65535"
-            placeholder="Schreiben Sie den neuen Eintrag in dieses Feld..."
-            class="form-control no-validation mb-3"
-        ></textarea>
-        <button
-            type="button"
-            class="btn btn-primary w-100"
-            [disabled]="newLogEntry === ''"
-            (click)="addEocLogEntry()"
-        >
-            Eintrag speichern
-        </button>
+<div class="p-3 border-bottom">
+    <textarea
+        [(ngModel)]="newLogEntry"
+        [appAutofocus]="true"
+        maxlength="65535"
+        placeholder="Schreiben Sie den neuen Eintrag in dieses Feld..."
+        class="form-control no-validation mb-3"
+    ></textarea>
+    <button
+        type="button"
+        class="btn btn-primary w-100"
+        [disabled]="newLogEntry === ''"
+        (click)="addEocLogEntry()"
+    >
+        Eintrag speichern
+    </button>
+</div>
+<ng-container *ngIf="eocLogEntries$ | async as eocLogEntries">
+    <div *ngIf="eocLogEntries.length === 0" class="text-muted p-3">
+        Es sind noch keine Einträge vorhanden.
     </div>
-    <ng-container *ngIf="eocLogEntries$ | async as eocLogEntries">
-        <div *ngIf="eocLogEntries.length === 0" class="text-muted p-3">
-            Es sind noch keine Einträge vorhanden.
-        </div>
 
-        <ul
-            *ngIf="eocLogEntries.length > 0"
-            style="max-height: 50vh; overflow: auto"
-            class="list-group list-group-flush"
-        >
-            <li
-                *ngFor="let eocLogEntry of eocLogEntries"
-                class="list-group-item"
-            >
-                <div class="row">
-                    <div class="col-2">
-                        <span class="fw-bold">
-                            {{ eocLogEntry.exerciseTimestamp | formatDuration }}
-                        </span>
-                        <br />
-                        von
-                        <span class="font-monospace">
-                            {{ eocLogEntry.clientName }}
-                        </span>
-                    </div>
+    <ul
+        *ngIf="eocLogEntries.length > 0"
+        style="max-height: 50vh; overflow: auto"
+        class="list-group list-group-flush"
+    >
+        <li *ngFor="let eocLogEntry of eocLogEntries" class="list-group-item">
+            <div class="row">
+                <div class="col-2">
+                    <span class="fw-bold">
+                        {{ eocLogEntry.exerciseTimestamp | formatDuration }}
+                    </span>
+                    <br />
+                    von
+                    <span class="font-monospace">
+                        {{ eocLogEntry.clientName }}
+                    </span>
+                </div>
 
-                    <div class="col" style="white-space: pre-wrap">
-                        {{ eocLogEntry.message }}
-                    </div>
+                <div class="col" style="white-space: pre-wrap">
+                    {{ eocLogEntry.message }}
                 </div>
-            </li>
-        </ul>
-    </ng-container>
-</div>
+            </div>
+        </li>
+    </ul>
+</ng-container>