ag-admin
/
OpenSlides
0
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

make choice dialog proper scrollable

This commit is contained in:
Maximilian Krambach 2018-11-29 18:20:21 +01:00 committed by FinnStutzenstein
parent d49b796b29
commit 1de2161ded
3 changed files with 35 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
client/src/app/core/services/choice.service.ts
View File

@ -36,6 +36,7 @@ export class ChoiceService extends OpenSlidesComponent {
): Promise<ChoiceAnswer> {
const dialogRef = this.dialog.open(ChoiceDialogComponent, {
minWidth: '250px',
maxHeight:'90vh',
data: { title: title, choices: choices, multiSelect: multiSelect }
});
return dialogRef.afterClosed().toPromise();

56
client/src/app/shared/components/choice-dialog/choice-dialog.component.html
View File

@ -1,30 +1,32 @@
<h2 mat-dialog-title>{{ data.title | translate }}</h2>
<div class="scrollmenu">
<mat-radio-group
#radio
name="choice"
*ngIf="!data.multiSelect"
class="choice-radio-group"
[(ngModel)]="selectedChoice"
>
<mat-radio-button class="choice-button" *ngFor="let choice of data.choices" [value]="choice.id">
{{ getChoiceTitle(choice) | translate }}
</mat-radio-button>
</mat-radio-group>
<mat-list *ngIf="data.multiSelect">
<mat-list-item *ngFor="let choice of data.choices">
<mat-checkbox [checked]="isChosen(choice)" (change)="toggleChoice(choice)">
<div class="scrollmenu-outer">
<h2 mat-dialog-title>{{ data.title | translate }}</h2>
<div class="scrollmenu">
<mat-radio-group
#radio
name="choice"
*ngIf="!data.multiSelect"
class="choice-radio-group"
[(ngModel)]="selectedChoice"
>
<mat-radio-button class="choice-button" *ngFor="let choice of data.choices" [value]="choice.id">
{{ getChoiceTitle(choice) | translate }}
</mat-checkbox>
</mat-list-item>
</mat-list>
</mat-radio-button>
</mat-radio-group>
<span *ngIf="!data.choices.length" translate>No choices available</span>
</div>
<mat-dialog-actions>
<button *ngIf="!data.multiSelect || data.choices.length" mat-button (click)="closeDialog(true)">
<span translate>Ok</span>
</button>
<button mat-button (click)="closeDialog(false)"><span translate>Cancel</span></button>
<mat-list *ngIf="data.multiSelect">
<mat-list-item *ngFor="let choice of data.choices">
<mat-checkbox [checked]="isChosen(choice)" (change)="toggleChoice(choice)">
{{ getChoiceTitle(choice) | translate }}
</mat-checkbox>
</mat-list-item>
</mat-list>
<span *ngIf="!data.choices.length" translate>No choices available</span>
</div>
<mat-dialog-actions>
<button *ngIf="!data.multiSelect || data.choices.length" mat-button (click)="closeDialog(true)">
<span translate>Ok</span>
</button>
<button mat-button (click)="closeDialog(false)"><span translate>Cancel</span></button>
</mat-dialog-actions>
</div>

8
client/src/app/shared/components/choice-dialog/choice-dialog.component.scss
View File

@ -8,8 +8,10 @@ mat-radio-group {
}
.scrollmenu {
padding: 4px;
overflow-y: auto;
padding: 5px;
display: block;
overflow-y: auto;
}
.scrollmenu-outer {
max-height:inherit;
}