diff --git a/src/app/group-monitor/group-monitor.component.html b/src/app/group-monitor/group-monitor.component.html index 03c43144bb563245165eda0d30bacbc010a3437a..5aed6967fce56ac9790c20962cd864a249c8155b 100644 --- a/src/app/group-monitor/group-monitor.component.html +++ b/src/app/group-monitor/group-monitor.component.html @@ -71,7 +71,10 @@ <hr> <div class="selection-info"> - <ng-container *ngIf="selectedElement">Auswahl: Block `{{selectedElement.label}} + ` in x Tests ausgewählt.</ng-container> + <ng-container *ngIf="selectedElement"> + Auswahl: Block `{{selectedElement.label}} ` + in {{selectedSessions.length}} Tests ausgewählt. + </ng-container> </div> </mat-sidenav> @@ -92,6 +95,7 @@ <thead> <tr class="mat-sort-container"> + <td mat-sort-header="selected">°</td> <td mat-sort-header="personLabel">Benutzer</td> <td mat-sort-header="groupLabel" *ngIf="displayOptions.groupColumn === 'show'">Gruppe</td> <td mat-sort-header="bookletName">Testheft</td> @@ -99,8 +103,13 @@ </tr> </thead> - <tc-test-view - *ngFor="let session of sessions$ | async; trackBy: trackSession" + <ng-container *ngFor="let session of sessions$ | async; trackBy: trackSession"> + + <td> + <mat-checkbox (change)="selectSession($event, session)"></mat-checkbox> + </td> + + <tc-test-view [testSession]="session" [displayOptions]="displayOptions" [markedElement]="markedElement" @@ -108,8 +117,10 @@ [selectedElement]="selectedElement" (selectedElement$)="selectElement($event)" (bookletId$)="adjustViewModeOnBookletLoad($event)" - > - </tc-test-view> + > + </tc-test-view> + + </ng-container> </table> </div> </div> diff --git a/src/app/group-monitor/group-monitor.component.ts b/src/app/group-monitor/group-monitor.component.ts index da1bb300245d9aa0163258877af3e04e65048600..eaef2f9ff440fa1e00231da7688f2562928aab49 100644 --- a/src/app/group-monitor/group-monitor.component.ts +++ b/src/app/group-monitor/group-monitor.component.ts @@ -12,6 +12,7 @@ import {ConnectionStatus} from '../shared/websocket-backend.service'; import {map} from 'rxjs/operators'; import {Sort} from '@angular/material/sort'; import {MatSidenav} from '@angular/material/sidenav'; +import {MatCheckboxChange} from '@angular/material/checkbox'; @Component({ @@ -43,6 +44,7 @@ export class GroupMonitorComponent implements OnInit, OnDestroy { selectedElement: Testlet|Unit|null = null; markedElement: Testlet|Unit|null = null; + selectedSessions: TestSession[] = []; private bookletIdsViewIsAdjustedFor: string[] = []; private lastWindowSize = Infinity; @@ -147,4 +149,13 @@ export class GroupMonitorComponent implements OnInit, OnDestroy { markElement(testletOrUnit: Testlet|Unit|null) { this.markedElement = testletOrUnit; } + + selectSession(event: MatCheckboxChange, session: TestSession) { + if (event.checked) { + this.selectedSessions.push(session); + } else { + this.selectedSessions.splice(this.selectedSessions.indexOf(session), 1); + } + console.log('select', event.checked, session, this.selectedSessions); + } } diff --git a/src/app/group-monitor/group-monitor.module.ts b/src/app/group-monitor/group-monitor.module.ts index 40f9a31bdfab12023aba452a8d1d5aa10c610ba0..7061350f7ab46ab43962c9b41062c2c632c4d591 100644 --- a/src/app/group-monitor/group-monitor.module.ts +++ b/src/app/group-monitor/group-monitor.module.ts @@ -21,6 +21,7 @@ import {MatButtonModule} from '@angular/material/button'; import {MatRadioModule} from '@angular/material/radio'; import {MatSidenavModule} from '@angular/material/sidenav'; import {FormsModule} from '@angular/forms'; +import {MatCheckboxModule} from '@angular/material/checkbox'; @NgModule({ @@ -43,7 +44,8 @@ import {FormsModule} from '@angular/forms'; MatButtonModule, MatRadioModule, FormsModule, - MatSidenavModule + MatSidenavModule, + MatCheckboxModule ], providers: [ BackendService,