normalize multiSelect actions
This commit is contained in:
parent
798af8c5ab
commit
5cedf6eb58
@ -23,7 +23,7 @@
|
||||
<!-- selector column -->
|
||||
<ng-container matColumnDef="selector">
|
||||
<mat-header-cell *matHeaderCellDef mat-sort-header class="checkbox-cell"></mat-header-cell>
|
||||
<mat-cell (click)="selectItem(item, $event)" *matCellDef="let item" class="checkbox-cell">
|
||||
<mat-cell *matCellDef="let item" class="checkbox-cell">
|
||||
<mat-icon>{{ isSelected(item) ? 'check_circle' : '' }}</mat-icon>
|
||||
</mat-cell>
|
||||
</ng-container>
|
||||
@ -32,7 +32,7 @@
|
||||
<ng-container matColumnDef="projector">
|
||||
<mat-header-cell *matHeaderCellDef mat-sort-header>Projector</mat-header-cell>
|
||||
<mat-cell *matCellDef="let item">
|
||||
<div *ngIf="item.contentObject">
|
||||
<div *ngIf="item.contentObject && !isMultiSelect">
|
||||
<os-projector-button [object]="item.contentObject"></os-projector-button>
|
||||
</div>
|
||||
</mat-cell>
|
||||
@ -41,8 +41,7 @@
|
||||
<!-- title column -->
|
||||
<ng-container matColumnDef="title">
|
||||
<mat-header-cell *matHeaderCellDef mat-sort-header>Topic</mat-header-cell>
|
||||
<!-- <mat-cell (click)="onTitleColumn(item)" *matCellDef="let item"> -->
|
||||
<mat-cell (click)="selectItem(item, $event)" *matCellDef="let item">
|
||||
<mat-cell *matCellDef="let item">
|
||||
<div [ngStyle]="{ 'margin-left': item.agendaListLevel * 25 + 'px' }">
|
||||
<span *ngIf="item.closed"> <mat-icon class="done-check">check</mat-icon> </span>
|
||||
<span class="table-view-list-title">{{ item.getListTitle() }}</span>
|
||||
@ -53,7 +52,7 @@
|
||||
<!-- Info column -->
|
||||
<ng-container matColumnDef="info">
|
||||
<mat-header-cell *matHeaderCellDef mat-sort-header>Info</mat-header-cell>
|
||||
<mat-cell (click)="openEditInfo(item)" *matCellDef="let item">
|
||||
<mat-cell (click)="openEditInfo(item, $event)" *matCellDef="let item">
|
||||
<div class="info-col-items">
|
||||
<div *ngIf="item.verboseType">
|
||||
<mat-icon>visibility</mat-icon>
|
||||
@ -75,7 +74,8 @@
|
||||
<ng-container matColumnDef="speakers">
|
||||
<mat-header-cell *matHeaderCellDef mat-sort-header>Speakers</mat-header-cell>
|
||||
<mat-cell *matCellDef="let item">
|
||||
<button mat-icon-button (click)="onSpeakerIcon(item)">
|
||||
<button mat-icon-button (click)="onSpeakerIcon(item, $event)"
|
||||
[disabled]="isMultiSelect">
|
||||
<mat-icon
|
||||
[matBadge]="item.waitingSpeakerAmount > 0 ? item.waitingSpeakerAmount : null"
|
||||
matBadgeColor="accent"
|
||||
@ -92,8 +92,10 @@
|
||||
<mat-cell *matCellDef="let item">
|
||||
<button
|
||||
mat-icon-button
|
||||
[disabled]="isMultiSelect"
|
||||
*osPerms="'agenda.can_manage'"
|
||||
[matMenuTriggerFor]="singleItemMenu"
|
||||
(click)="$event.stopPropagation()"
|
||||
[matMenuTriggerData]="{ item: item }"
|
||||
>
|
||||
<mat-icon>more_vert</mat-icon>
|
||||
@ -105,6 +107,7 @@
|
||||
<mat-row
|
||||
class="lg"
|
||||
[ngClass]="selectedRows.indexOf(row) >= 0 ? 'selected' : ''"
|
||||
(click)="selectItem(row, $event)"
|
||||
*matRowDef="let row; columns: getColumnDefinition()"
|
||||
></mat-row>
|
||||
</mat-table>
|
||||
|
@ -147,10 +147,11 @@ export class AgendaListComponent extends ListViewBaseComponent<ViewItem, Item> i
|
||||
*
|
||||
* @param item The view item that was clicked
|
||||
*/
|
||||
public openEditInfo(item: ViewItem): void {
|
||||
if (!this.canManage) {
|
||||
public openEditInfo(item: ViewItem, event: MouseEvent): void {
|
||||
if (this.isMultiSelect || !this.canManage) {
|
||||
return;
|
||||
}
|
||||
event.stopPropagation();
|
||||
const dialogRef = this.dialog.open(ItemInfoDialogComponent, {
|
||||
width: '400px',
|
||||
data: item,
|
||||
@ -191,7 +192,8 @@ export class AgendaListComponent extends ListViewBaseComponent<ViewItem, Item> i
|
||||
*
|
||||
* @param item indicates the row that was clicked on
|
||||
*/
|
||||
public onSpeakerIcon(item: ViewItem): void {
|
||||
public onSpeakerIcon(item: ViewItem, event: MouseEvent): void {
|
||||
event.stopPropagation();
|
||||
this.router.navigate([`${item.id}/speakers`], { relativeTo: this.route });
|
||||
}
|
||||
|
||||
@ -259,7 +261,7 @@ export class AgendaListComponent extends ListViewBaseComponent<ViewItem, Item> i
|
||||
*/
|
||||
public getColumnDefinition(): string[] {
|
||||
let columns = this.vp.isMobile ? this.displayedColumnsMobile : this.displayedColumnsDesktop;
|
||||
if (this.operator.hasPerms('core.can_manage_projector')) {
|
||||
if (this.operator.hasPerms('core.can_manage_projector') && !this.isMultiSelect) {
|
||||
columns = ['projector'].concat(columns);
|
||||
}
|
||||
if (this.isMultiSelect) {
|
||||
|
@ -145,16 +145,17 @@ export abstract class ListViewBaseComponent<V extends BaseViewModel, M extends B
|
||||
* @param event The Mouse event
|
||||
*/
|
||||
public selectItem(row: V, event: MouseEvent): void {
|
||||
if (this.isMultiSelect) {
|
||||
event.stopPropagation();
|
||||
if (!this._multiSelectMode) {
|
||||
this.singleSelectAction(row);
|
||||
} else {
|
||||
const idx = this.selectedRows.indexOf(row);
|
||||
if (idx < 0) {
|
||||
this.selectedRows.push(row);
|
||||
} else {
|
||||
this.selectedRows.splice(idx, 1);
|
||||
}
|
||||
} else {
|
||||
event.stopPropagation();
|
||||
this.singleSelectAction(row);
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -78,18 +78,19 @@
|
||||
<!-- Filename -->
|
||||
<ng-container matColumnDef="title">
|
||||
<mat-header-cell *matHeaderCellDef mat-sort-header>Name</mat-header-cell>
|
||||
<mat-cell *matCellDef="let file" (click)="selectItem(file, $event)">
|
||||
<mat-cell *matCellDef="let file">
|
||||
<span *ngIf="file.is_hidden">
|
||||
<mat-icon matTooltip="{{ 'is hidden' | translate }}">lock</mat-icon>
|
||||
|
||||
</span>
|
||||
{{ file.title }}</mat-cell>
|
||||
{{ file.title }}</mat-cell
|
||||
>
|
||||
</ng-container>
|
||||
|
||||
<!-- Info -->
|
||||
<ng-container matColumnDef="info">
|
||||
<mat-header-cell *matHeaderCellDef mat-sort-header>Group</mat-header-cell>
|
||||
<mat-cell *matCellDef="let file" (click)="selectItem(file, $event)">
|
||||
<mat-cell *matCellDef="let file">
|
||||
<div class="file-info-cell">
|
||||
<span> <mat-icon [inline]="true">insert_drive_file</mat-icon> {{ file.type }} </span>
|
||||
<span> <mat-icon [inline]="true">data_usage</mat-icon> {{ file.size }} </span>
|
||||
@ -100,7 +101,7 @@
|
||||
<!-- indicator -->
|
||||
<ng-container matColumnDef="indicator">
|
||||
<mat-header-cell *matHeaderCellDef mat-sort-header>Indicator</mat-header-cell>
|
||||
<mat-cell *matCellDef="let file" (click)="selectItem(file, $event)">
|
||||
<mat-cell *matCellDef="let file">
|
||||
<!-- check if the file is managed -->
|
||||
|
||||
<div
|
||||
@ -119,7 +120,12 @@
|
||||
<ng-container matColumnDef="menu">
|
||||
<mat-header-cell *matHeaderCellDef mat-sort-header>Menu</mat-header-cell>
|
||||
<mat-cell *matCellDef="let file">
|
||||
<button mat-icon-button [matMenuTriggerFor]="singleFileMenu" [matMenuTriggerData]="{ file: file }">
|
||||
<button
|
||||
mat-icon-button
|
||||
[matMenuTriggerFor]="singleFileMenu"
|
||||
[matMenuTriggerData]="{ file: file }"
|
||||
[disabled]="isMultiSelect"
|
||||
>
|
||||
<mat-icon>more_vert</mat-icon>
|
||||
</button>
|
||||
</mat-cell>
|
||||
@ -128,6 +134,7 @@
|
||||
<mat-header-row *matHeaderRowDef="getColumnDefinition()"></mat-header-row>
|
||||
<mat-row
|
||||
*matRowDef="let row; columns: getColumnDefinition()"
|
||||
(click)="selectItem(row, $event)"
|
||||
[ngClass]="selectedRows.indexOf(row) >= 0 ? 'selected' : ''"
|
||||
></mat-row>
|
||||
</mat-table>
|
||||
|
@ -271,7 +271,7 @@ export class MediafileListComponent extends ListViewBaseComponent<ViewMediafile,
|
||||
*/
|
||||
public getColumnDefinition(): string[] {
|
||||
let columns = this.vp.isMobile ? this.displayedColumnsMobile : this.displayedColumnsDesktop;
|
||||
if (this.operator.hasPerms('core.can_manage_projector')) {
|
||||
if (this.operator.hasPerms('core.can_manage_projector') && !this.isMultiSelect) {
|
||||
columns = ['projector'].concat(columns);
|
||||
}
|
||||
if (this.isMultiSelect) {
|
||||
|
@ -121,11 +121,11 @@
|
||||
</mat-cell>
|
||||
</ng-container>
|
||||
|
||||
<!-- Anchor column to open separate tab -->
|
||||
<!-- Anchor column to open the separate tab -->
|
||||
<ng-container matColumnDef="anchor">
|
||||
<mat-header-cell *matHeaderCellDef></mat-header-cell>
|
||||
<mat-cell *matCellDef="let motion">
|
||||
<a [routerLink]="motion.id"></a>
|
||||
<a [routerLink]="motion.id" *ngIf="!isMultiSelect"></a>
|
||||
</mat-cell>
|
||||
</ng-container>
|
||||
|
||||
@ -133,7 +133,7 @@
|
||||
<ng-container matColumnDef="speakers">
|
||||
<mat-header-cell *matHeaderCellDef mat-sort-header>Speakers</mat-header-cell>
|
||||
<mat-cell *matCellDef="let motion">
|
||||
<button mat-icon-button (click)="onSpeakerIcon(motion, $event)">
|
||||
<button mat-icon-button (click)="onSpeakerIcon(motion, $event)" [disabled]="isMultiSelect">
|
||||
<mat-icon
|
||||
[matBadge]="motion.agendaSpeakerAmount > 0 ? motion.agendaSpeakerAmount : null"
|
||||
matBadgeColor="accent"
|
||||
@ -147,6 +147,7 @@
|
||||
<mat-header-row *matHeaderRowDef="getColumnDefinition()"></mat-header-row>
|
||||
<mat-row
|
||||
[ngClass]="selectedRows.indexOf(row) >= 0 ? 'selected' : ''"
|
||||
(click)="selectItem(row, $event)"
|
||||
*matRowDef="let row; columns: getColumnDefinition()"
|
||||
class="lg"
|
||||
>
|
||||
|
@ -231,7 +231,7 @@ export class MotionListComponent extends ListViewBaseComponent<ViewMotion, Motio
|
||||
*/
|
||||
public getColumnDefinition(): string[] {
|
||||
let columns = this.vp.isMobile ? this.displayedColumnsMobile : this.displayedColumnsDesktop;
|
||||
if (this.operator.hasPerms('core.can_manage_projector')) {
|
||||
if (this.operator.hasPerms('core.can_manage_projector') && !this.isMultiSelect) {
|
||||
columns = ['projector'].concat(columns);
|
||||
}
|
||||
if (this.isMultiSelect) {
|
||||
|
@ -27,7 +27,7 @@
|
||||
<!-- Selector column -->
|
||||
<ng-container matColumnDef="selector">
|
||||
<mat-header-cell *matHeaderCellDef mat-sort-header></mat-header-cell>
|
||||
<mat-cell *matCellDef="let user" (click)="selectItem(user, $event)">
|
||||
<mat-cell *matCellDef="let user">
|
||||
<mat-icon>{{ isSelected(user) ? 'check_circle' : '' }}</mat-icon>
|
||||
</mat-cell>
|
||||
</ng-container>
|
||||
@ -43,13 +43,13 @@
|
||||
<!-- name column -->
|
||||
<ng-container matColumnDef="name">
|
||||
<mat-header-cell *matHeaderCellDef mat-sort-header>Name</mat-header-cell>
|
||||
<mat-cell *matCellDef="let user" (click)="selectItem(user, $event)">{{ user.full_name }}</mat-cell>
|
||||
<mat-cell *matCellDef="let user">{{ user.full_name }}</mat-cell>
|
||||
</ng-container>
|
||||
|
||||
<!-- prefix column -->
|
||||
<ng-container matColumnDef="group">
|
||||
<mat-header-cell *matHeaderCellDef mat-sort-header>Group</mat-header-cell>
|
||||
<mat-cell (click)="openEditInfo(user)" *matCellDef="let user">
|
||||
<mat-cell (click)="openEditInfo(user, $event)" *matCellDef="let user">
|
||||
<div class="groupsCell">
|
||||
<span *ngIf="user.groups && user.groups.length">
|
||||
<mat-icon>people</mat-icon>
|
||||
@ -68,7 +68,7 @@
|
||||
<ng-container matColumnDef="anchor">
|
||||
<mat-header-cell *matHeaderCellDef></mat-header-cell>
|
||||
<mat-cell *matCellDef="let user">
|
||||
<a [routerLink]="user.id"></a>
|
||||
<a [routerLink]="user.id" *ngIf="!isMultiSelect"></a>
|
||||
</mat-cell>
|
||||
</ng-container>
|
||||
|
||||
@ -77,7 +77,12 @@
|
||||
<mat-header-cell *matHeaderCellDef mat-sort-header>Presence</mat-header-cell>
|
||||
<mat-cell *matCellDef="let user" class="presentCell">
|
||||
<div *ngIf="user.is_active">
|
||||
<mat-checkbox class="checkboxPresent" (click)="setPresent(user)" [checked]="user.is_present">
|
||||
<mat-checkbox
|
||||
class="checkboxPresent"
|
||||
(click)="setPresent(user)"
|
||||
[checked]="user.is_present"
|
||||
[disabled]="isMultiSelect"
|
||||
>
|
||||
<span translate>Present</span>
|
||||
</mat-checkbox>
|
||||
</div>
|
||||
@ -88,6 +93,7 @@
|
||||
<mat-row
|
||||
[ngClass]="selectedRows.indexOf(row) >= 0 ? 'selected' : ''"
|
||||
*matRowDef="let row; columns: getColumnDefinition()"
|
||||
(click)="selectItem(row, $event)"
|
||||
>
|
||||
</mat-row>
|
||||
</mat-table>
|
||||
|
@ -191,7 +191,11 @@ export class UserListComponent extends ListViewBaseComponent<ViewUser, User> imp
|
||||
*
|
||||
* @param user is an instance of ViewUser. This is the given user, who will be modified.
|
||||
*/
|
||||
public openEditInfo(user: ViewUser): void {
|
||||
public openEditInfo(user: ViewUser, ev: MouseEvent): void {
|
||||
if (this.isMultiSelect) {
|
||||
return;
|
||||
}
|
||||
ev.stopPropagation();
|
||||
this.infoDialog = {
|
||||
name: user.username,
|
||||
groups_id: user.groups_id,
|
||||
|
Loading…
Reference in New Issue
Block a user