fix actions for other timeslots

This commit is contained in:
_Bastler 2021-08-12 20:31:52 +02:00
parent a11c74b91b
commit ffbcd7fe1a
2 changed files with 72 additions and 60 deletions

View File

@ -68,16 +68,18 @@
<th mat-header-cell *matHeaderCellDef mat-sort-header="stream"> {{'partey.timeslots.stream' | i18n}} <th mat-header-cell *matHeaderCellDef mat-sort-header="stream"> {{'partey.timeslots.stream' | i18n}}
</th> </th>
<td mat-cell *matCellDef="let timeslot"> <td mat-cell *matCellDef="let timeslot">
<button *ngIf="timeslot.type == 'AUDIO'" mat-raised-button <div *ngIf="timeslot.owner == userId">
(click)="copySecretToClipboard(timeslot.secret)">{{'partey.timeslots.secret.copy' | i18n}}</button> <button *ngIf="timeslot.type == 'AUDIO'" mat-raised-button
<span *ngIf="timeslot.type == 'VIDEO'"> {{ timeslot.stream }} </span> (click)="copySecretToClipboard(timeslot.secret)">{{'partey.timeslots.secret.copy' | i18n}}</button>
<span *ngIf="timeslot.type == 'VIDEO'"> {{ timeslot.stream }} </span>
</div>
</td> </td>
</ng-container> </ng-container>
<ng-container matColumnDef="edit"> <ng-container matColumnDef="edit">
<th mat-header-cell *matHeaderCellDef> {{'partey.timeslots.edit' | i18n}} </th> <th mat-header-cell *matHeaderCellDef> {{'partey.timeslots.edit' | i18n}} </th>
<td mat-cell *matCellDef="let timeslot" class="text-right"> <td mat-cell *matCellDef="let timeslot" class="text-right">
<a mat-icon-button> <a *ngIf="timeslot.owner == userId" mat-icon-button>
<mat-icon (click)="openEdit(timeslot)">edit</mat-icon> <mat-icon (click)="openEdit(timeslot)">edit</mat-icon>
</a> </a>
</td> </td>
@ -86,7 +88,7 @@
<ng-container matColumnDef="delete"> <ng-container matColumnDef="delete">
<th mat-header-cell *matHeaderCellDef class="align-right"> {{'partey.timeslots.delete' | i18n}} </th> <th mat-header-cell *matHeaderCellDef class="align-right"> {{'partey.timeslots.delete' | i18n}} </th>
<td mat-cell *matCellDef="let timeslot" class="text-right"> <td mat-cell *matCellDef="let timeslot" class="text-right">
<a mat-icon-button> <a *ngIf="timeslot.owner == userId" mat-icon-button>
<mat-icon (click)="confirmDelete(timeslot)">delete</mat-icon> <mat-icon (click)="confirmDelete(timeslot)">delete</mat-icon>
</a> </a>
</td> </td>

View File

@ -1,21 +1,22 @@
import {Component, OnInit, ViewChild, Inject} from '@angular/core'; import { Component, OnInit, ViewChild, Inject } from '@angular/core';
import {Sort} from '@angular/material/sort'; import { Sort } from '@angular/material/sort';
import {MatSnackBar} from '@angular/material/snack-bar'; import { MatSnackBar } from '@angular/material/snack-bar';
import {FormBuilder, FormGroup, Validators, NgForm} from '@angular/forms'; import { FormBuilder, FormGroup, Validators, NgForm } from '@angular/forms';
import {MatDialog, MatDialogRef, MAT_DIALOG_DATA} from '@angular/material/dialog'; import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import {DatePipe} from '@angular/common'; import { DatePipe } from '@angular/common';
import {FormControl} from '@angular/forms'; import { FormControl } from '@angular/forms';
import {debounceTime} from 'rxjs/operators'; import { debounceTime } from 'rxjs/operators';
import {PageEvent} from '@angular/material/paginator'; import { PageEvent } from '@angular/material/paginator';
import {ParteyTimeslotsService} from '../../../services/partey.timeslots.service'; import { ParteyTimeslotsService } from '../../../services/partey.timeslots.service';
import {ConfirmDialog} from '../../../ui/confirm/confirm.component'; import { ConfirmDialog } from '../../../ui/confirm/confirm.component';
import {I18nService} from './../../../services/i18n.service'; import { I18nService } from './../../../services/i18n.service';
import { AuthService } from './../../../services/auth.service';
@Component({ @Component({
selector: 'app-partey-timeslots', selector: 'app-partey-timeslots',
templateUrl: './timeslots.component.html', templateUrl: './timeslots.component.html',
styleUrls: ['./timeslots.component.scss'] styleUrls: [ './timeslots.component.scss' ]
}) })
export class ParteyTimeslotsComponent implements OnInit { export class ParteyTimeslotsComponent implements OnInit {
@ -27,13 +28,14 @@ export class ParteyTimeslotsComponent implements OnInit {
success: boolean; success: boolean;
working: boolean; working: boolean;
datetimeformat: string; datetimeformat: string;
page: any = {page: 0, size: 10, sort: "id", desc: false}; page: any = { page: 0, size: 10, sort: "id", desc: false };
filter: any = {}; filter: any = {};
pageSizeOptions: number[] = [5, 10, 25, 50]; pageSizeOptions: number[] = [ 5, 10, 25, 50 ];
visibilities = ["PRIVATE", "PROTECTED", "PUBLIC"]; visibilities = [ "PRIVATE", "PROTECTED", "PUBLIC" ];
types = ["VIDEO", "AUDIO"]; types = [ "VIDEO", "AUDIO" ];
userId: any;
timeslotsColumns = ["type", "starts", "ends", "title", "description", "stream", "edit", "delete"]; timeslotsColumns = [ "type", "starts", "ends", "title", "description", "stream", "edit", "delete" ];
searchFormControl = new FormControl(); searchFormControl = new FormControl();
ownerFormControl = new FormControl(); ownerFormControl = new FormControl();
@ -43,19 +45,27 @@ export class ParteyTimeslotsComponent implements OnInit {
constructor( constructor(
private formBuilder: FormBuilder, private formBuilder: FormBuilder,
private parteyTimeslotsService: ParteyTimeslotsService, private parteyTimeslotsService: ParteyTimeslotsService,
private authService: AuthService,
private i18n: I18nService, private i18n: I18nService,
private datePipe: DatePipe, private datePipe: DatePipe,
private snackBar: MatSnackBar, private snackBar: MatSnackBar,
public dialog: MatDialog) {} public dialog: MatDialog) { }
ngOnInit(): void { ngOnInit(): void {
this.authService.auth.subscribe((auth: any) => {
if (auth.principal && auth.principal.userId) {
this.userId = auth.principal.userId;
}
});
this.datetimeformat = this.i18n.get('format.datetime', []); this.datetimeformat = this.i18n.get('format.datetime', []);
this.form = this.formBuilder.group({ this.form = this.formBuilder.group({
room: ['', Validators.required], room: [ '', Validators.required ],
starts: ['', Validators.nullValidator], starts: [ '', Validators.nullValidator ],
moderationStarts: ['', Validators.nullValidator], moderationStarts: [ '', Validators.nullValidator ],
expires: ['', Validators.nullValidator], expires: [ '', Validators.nullValidator ],
}); });
this.filter.owner = ""; this.filter.owner = "";
@ -69,25 +79,25 @@ export class ParteyTimeslotsComponent implements OnInit {
this.filter.search = value; this.filter.search = value;
this.parteyTimeslotsService.get(this.page.page, this.page.size, this.page.sort, this.page.desc, this.filter).subscribe((data: any) => { this.parteyTimeslotsService.get(this.page.page, this.page.size, this.page.sort, this.page.desc, this.filter).subscribe((data: any) => {
this.timeslots = data; this.timeslots = data;
}, (error) => {}) }, (error) => { })
}) })
this.ownerFormControl.valueChanges.subscribe(value => { this.ownerFormControl.valueChanges.subscribe(value => {
this.filter.owner = value; this.filter.owner = value;
this.parteyTimeslotsService.get(this.page.page, this.page.size, this.page.sort, this.page.desc, this.filter).subscribe((data: any) => { this.parteyTimeslotsService.get(this.page.page, this.page.size, this.page.sort, this.page.desc, this.filter).subscribe((data: any) => {
this.timeslots = data; this.timeslots = data;
}, (error) => {}) }, (error) => { })
}) })
this.typeFormControl.valueChanges.subscribe(value => { this.typeFormControl.valueChanges.subscribe(value => {
this.filter.type = value; this.filter.type = value;
this.parteyTimeslotsService.get(this.page.page, this.page.size, this.page.sort, this.page.desc, this.filter).subscribe((data: any) => { this.parteyTimeslotsService.get(this.page.page, this.page.size, this.page.sort, this.page.desc, this.filter).subscribe((data: any) => {
this.timeslots = data; this.timeslots = data;
}, (error) => {}) }, (error) => { })
}) })
this.afterFormControl.valueChanges.subscribe((value: Date) => { this.afterFormControl.valueChanges.subscribe((value: Date) => {
this.filter.after = value && value.toUTCString() || undefined; this.filter.after = value && value.toUTCString() || undefined;
this.parteyTimeslotsService.get(this.page.page, this.page.size, this.page.sort, this.page.desc, this.filter).subscribe((data: any) => { this.parteyTimeslotsService.get(this.page.page, this.page.size, this.page.sort, this.page.desc, this.filter).subscribe((data: any) => {
this.timeslots = data; this.timeslots = data;
}, (error) => {}) }, (error) => { })
}) })
this.refresh(); this.refresh();
@ -110,11 +120,11 @@ export class ParteyTimeslotsComponent implements OnInit {
this.page.size = event.pageSize; this.page.size = event.pageSize;
this.parteyTimeslotsService.get(this.page.page, this.page.size, this.page.sort, this.page.desc, this.filter).subscribe((data: any) => { this.parteyTimeslotsService.get(this.page.page, this.page.size, this.page.sort, this.page.desc, this.filter).subscribe((data: any) => {
this.timeslots = data; this.timeslots = data;
}, (error) => {}) }, (error) => { })
} }
updateSort(sort: Sort) { updateSort(sort: Sort) {
if(sort.direction == "") { if (sort.direction == "") {
this.page.sort = "id"; this.page.sort = "id";
this.page.desc = false; this.page.desc = false;
} else { } else {
@ -123,19 +133,19 @@ export class ParteyTimeslotsComponent implements OnInit {
} }
this.parteyTimeslotsService.get(this.page.page, this.page.size, this.page.sort, this.page.desc, this.filter).subscribe((data: any) => { this.parteyTimeslotsService.get(this.page.page, this.page.size, this.page.sort, this.page.desc, this.filter).subscribe((data: any) => {
this.timeslots = data; this.timeslots = data;
}, (error) => {}) }, (error) => { })
} }
confirmDelete(timeslot) { confirmDelete(timeslot) {
const dialogRef = this.dialog.open(ConfirmDialog, { const dialogRef = this.dialog.open(ConfirmDialog, {
data: { data: {
'label': 'partey.timeslots.confirmDelete', 'label': 'partey.timeslots.confirmDelete',
'args': [timeslot.title, this.datePipe.transform(new Date(timeslot.starts), this.datetimeformat)] 'args': [ timeslot.title, this.datePipe.transform(new Date(timeslot.starts), this.datetimeformat) ]
} }
}) })
dialogRef.afterClosed().subscribe(result => { dialogRef.afterClosed().subscribe(result => {
if(result) { if (result) {
this.parteyTimeslotsService.delete(timeslot.id).subscribe((result: any) => { this.parteyTimeslotsService.delete(timeslot.id).subscribe((result: any) => {
this.refresh(); this.refresh();
}) })
@ -145,12 +155,12 @@ export class ParteyTimeslotsComponent implements OnInit {
openCreate(type) { openCreate(type) {
const dialogRef = this.dialog.open(ParteyTimeslotDialog, { const dialogRef = this.dialog.open(ParteyTimeslotDialog, {
data: {"type": type ? type : "VIDEO", "visibility": "PROTECTED"}, data: { "type": type ? type : "VIDEO", "visibility": "PROTECTED" },
minWidth: '400px' minWidth: '400px'
}); });
dialogRef.afterClosed().subscribe(result => { dialogRef.afterClosed().subscribe(result => {
if(result) { if (result) {
this.refresh(); this.refresh();
} }
}); });
@ -164,7 +174,7 @@ export class ParteyTimeslotsComponent implements OnInit {
}); });
dialogRef.afterClosed().subscribe(result => { dialogRef.afterClosed().subscribe(result => {
if(result) { if (result) {
this.refresh(); this.refresh();
} }
}); });
@ -191,15 +201,15 @@ export class ParteyTimeslotsComponent implements OnInit {
@Component({ @Component({
selector: 'app-timeslot-dialog', selector: 'app-timeslot-dialog',
templateUrl: 'timeslot.dialog.html', templateUrl: 'timeslot.dialog.html',
styleUrls: ['./timeslot.dialog.scss'] styleUrls: [ './timeslot.dialog.scss' ]
}) })
export class ParteyTimeslotDialog { export class ParteyTimeslotDialog {
form: FormGroup; form: FormGroup;
timeslot; timeslot;
visibilities = ["PRIVATE", "PROTECTED", "PUBLIC"]; visibilities = [ "PRIVATE", "PROTECTED", "PUBLIC" ];
types = ["VIDEO", "AUDIO"]; types = [ "VIDEO", "AUDIO" ];
constructor( constructor(
private parteyTimeslotsService: ParteyTimeslotsService, private parteyTimeslotsService: ParteyTimeslotsService,
@ -212,11 +222,11 @@ export class ParteyTimeslotDialog {
ngOnInit() { ngOnInit() {
this.form = this.formBuilder.group({ this.form = this.formBuilder.group({
starts: ['', Validators.required], starts: [ '', Validators.required ],
ends: ['', Validators.required], ends: [ '', Validators.required ],
title: ['', Validators.nullValidator], title: [ '', Validators.nullValidator ],
description: ['', Validators.nullValidator], description: [ '', Validators.nullValidator ],
stream: ['', this.timeslot.type == 'VIDEO' ? Validators.required : Validators.nullValidator], stream: [ '', this.timeslot.type == 'VIDEO' ? Validators.required : Validators.nullValidator ],
}); });
} }
@ -226,15 +236,15 @@ export class ParteyTimeslotDialog {
this.parteyTimeslotsService.create(timeslot).subscribe((result: any) => { this.parteyTimeslotsService.create(timeslot).subscribe((result: any) => {
this.dialogRef.close(timeslot); this.dialogRef.close(timeslot);
}, (error) => { }, (error) => {
if(error.status == 409) { if (error.status == 409) {
let errors = {}; let errors = {};
for(let code of error.error) { for (let code of error.error) {
errors[code.field] = errors[code.field] || {}; errors[ code.field ] = errors[ code.field ] || {};
errors[code.field][code.code] = true; errors[ code.field ][ code.code ] = true;
} }
for(let code in errors) { for (let code in errors) {
this.form.get(code).setErrors(errors[code]); this.form.get(code).setErrors(errors[ code ]);
} }
} }
}); });
@ -244,15 +254,15 @@ export class ParteyTimeslotDialog {
this.parteyTimeslotsService.update(timeslot).subscribe((result: any) => { this.parteyTimeslotsService.update(timeslot).subscribe((result: any) => {
this.dialogRef.close(timeslot); this.dialogRef.close(timeslot);
}, (error) => { }, (error) => {
if(error.status == 409) { if (error.status == 409) {
let errors = {}; let errors = {};
for(let code of error.error) { for (let code of error.error) {
errors[code.field] = errors[code.field] || {}; errors[ code.field ] = errors[ code.field ] || {};
errors[code.field][code.code] = true; errors[ code.field ][ code.code ] = true;
} }
for(let code in errors) { for (let code in errors) {
this.form.get(code).setErrors(errors[code]); this.form.get(code).setErrors(errors[ code ]);
} }
} }
}); });