This commit is contained in:
2024-10-05 00:15:13 +02:00
commit 0c5fb0e1c1
145 changed files with 23168 additions and 0 deletions
@@ -0,0 +1,39 @@
<div class="flex column fill">
<div class="flex wrap filter-container">
<a mat-icon-button (click)="filterOpen=!filterOpen" title="{{'turnovers.filter' | i18n}}"
[color]="filterOpen ? 'primary': 'accent'">
<mat-icon>filter_alt</mat-icon>
</a>
<form class="flex wrap filter" *ngIf="filterOpen">
<mat-form-field class="margin">
<mat-label>{{'turnovers.filter.created' | i18n}}</mat-label>
<mat-date-range-input [rangePicker]="picker">
<input matStartDate placeholder="{{'turnovers.filter.created.from' | i18n}}"
[value]="turnovers && turnovers.filter && turnovers.filter.from"
(dateChange)="setFilter('from', $event.value && $event.value.toISOString() || undefined)">
<input matEndDate placeholder="{{'turnovers.filter.created.to' | i18n}}"
[value]="turnovers && turnovers.filter && turnovers.filter.to"
(dateChange)="setFilter('to', $event.value && $event.value.endOf('day').toISOString() || undefined)">
</mat-date-range-input>
<mat-datepicker-toggle matIconSuffix [for]="picker"></mat-datepicker-toggle>
<mat-date-range-picker #picker></mat-date-range-picker>
</mat-form-field>
<mat-form-field class="margin">
<mat-label>{{'turnovers.filter.username' | i18n}}</mat-label>
<input type="text" matInput [matAutocomplete]="auto" [formControl]="usersFormControl"
(change)="setInputFilter('username', $event.target)">
<mat-autocomplete #auto="matAutocomplete" (optionSelected)="setFilter('username', $event.option.value)">
@for (user of users | async; track user.username) {
<mat-option [value]="user.username">{{user.username}}</mat-option>
}
</mat-autocomplete>
</mat-form-field>
</form>
</div>
<ui-turnovers class="flex column grow" [turnovers]="turnovers" (page)="applyPage($event)" (sort)="applySort($event)"
[username]="true"></ui-turnovers>
</div>
@@ -0,0 +1,22 @@
.filter-container {
padding-left: 15px;
justify-content: flex-start;
align-items: center;
.filter {
justify-content: flex-start;
align-items: center;
max-height: 70px;
&>* {
margin-top: 5px;
margin-bottom: 5px;
margin-left: 15px;
}
}
}
ui-turnovers {
min-height: 0;
}
@@ -0,0 +1,76 @@
import { Component, OnInit } from '@angular/core';
import { FormControl } from '@angular/forms';
import { PageEvent } from '@angular/material/paginator';
import { Sort } from '@angular/material/sort';
import { debounceTime, Observable, switchMap } from 'rxjs';
import { TurnoverManagementService } from 'src/app/services/turnover.management.service';
import { UserManagementService } from 'src/app/services/user.management.service';
@Component({
selector: 'page-turnovers-manage',
templateUrl: './manage.page.html',
styleUrls: ['./manage.page.scss']
})
export class PageTurnoversManage implements OnInit {
turnovers: any;
sort: string = "created";
descending: boolean = true;
filterOpen: boolean = false;
users: Observable<any>;
usersFormControl = new FormControl();
constructor(
private turnoverManagementService: TurnoverManagementService,
private userManagementService: UserManagementService
) { }
ngOnInit(): void {
this.turnovers = {};
this.update();
this.users = this.usersFormControl
.valueChanges
.pipe(
debounceTime(300),
switchMap(value => this.userManagementService.pick(value))
);
}
update() {
const filter = JSON.parse(JSON.stringify(this.turnovers.filter || {}));
this.turnoverManagementService.fetch(this.turnovers.limit || 15, this.turnovers.offset || 0, this.sort, this.descending, this.turnovers.filter).subscribe({
next: (data: any) => {
this.turnovers = data;
this.turnovers.filter = filter;
}, error: (error) => {
this.turnovers = { error: error };
}
})
}
applyPage(event: PageEvent) {
this.turnovers.limit = event.pageSize;
this.turnovers.offset = event.pageSize * event.pageIndex;
this.update();
}
applySort(event: Sort) {
this.sort = event.direction ? event.active : 'created';
this.descending = event.direction !== 'asc';
this.update();
}
setInputFilter(key: string, target: EventTarget) {
this.setFilter(key, (target as HTMLInputElement).value);
}
setFilter(key: string, value) {
if (value != this.turnovers.filter[key]) {
this.turnovers.filter[key] = value;
this.turnovers.offset = 0;
this.update();
}
}
}
@@ -0,0 +1,27 @@
<div class="flex column fill">
<div class="flex wrap filter-container">
<a mat-icon-button (click)="filterOpen=!filterOpen" title="{{'turnovers.filter' | i18n}}"
[color]="filterOpen ? 'primary': 'accent'">
<mat-icon>filter_alt</mat-icon>
</a>
<form class="flex wrap filter" *ngIf="filterOpen">
<mat-form-field class="margin">
<mat-label>{{'turnovers.filter.created' | i18n}}</mat-label>
<mat-date-range-input [rangePicker]="picker">
<input matStartDate placeholder="{{'turnovers.filter.created.from' | i18n}}"
[value]="turnovers && turnovers.filter && turnovers.filter.from"
(dateChange)="setFilter('from', $event.value && $event.value.toISOString() || undefined)">
<input matEndDate placeholder="{{'turnovers.filter.created.to' | i18n}}"
[value]="turnovers && turnovers.filter && turnovers.filter.to"
(dateChange)="setFilter('to', $event.value && $event.value.endOf('day').toISOString() || undefined)">
</mat-date-range-input>
<mat-datepicker-toggle matIconSuffix [for]="picker"></mat-datepicker-toggle>
<mat-date-range-picker #picker></mat-date-range-picker>
</mat-form-field>
</form>
</div>
<ui-turnovers class="flex column grow" [turnovers]="turnovers" (page)="applyPage($event)"
(sort)="applySort($event)"></ui-turnovers>
</div>
@@ -0,0 +1,23 @@
.filter-container {
padding-left: 15px;
justify-content: flex-start;
align-items: center;
.filter {
justify-content: flex-start;
align-items: center;
max-height: 70px;
&>* {
margin-top: 5px;
margin-bottom: 5px;
margin-left: 15px;
}
}
}
ui-turnovers {
min-height: 0;
}
@@ -0,0 +1,64 @@
import { Component, OnInit } from '@angular/core';
import { FormControl } from '@angular/forms';
import { PageEvent } from '@angular/material/paginator';
import { Sort } from '@angular/material/sort';
import { debounceTime, Observable, switchMap } from 'rxjs';
import { TurnoverService } from 'src/app/services/turnover.service';
import { UserManagementService } from 'src/app/services/user.management.service';
@Component({
selector: 'page-turnovers',
templateUrl: './turnovers.page.html',
styleUrls: ['./turnovers.page.scss']
})
export class PageTurnovers implements OnInit {
turnovers: any;
sort: string = "created";
descending: boolean = true;
filterOpen: boolean = false;
users: Observable<any>;
usersFormControl = new FormControl();
constructor(
private turnoverService: TurnoverService
) { }
ngOnInit(): void {
this.turnovers = {};
this.update();
}
update() {
const filter = JSON.parse(JSON.stringify(this.turnovers.filter || {}));
this.turnoverService.fetch(this.turnovers.limit || 15, this.turnovers.offset || 0, this.sort, this.descending, this.turnovers.filter).subscribe({
next: (data: any) => {
this.turnovers = data;
this.turnovers.filter = filter;
}, error: (error) => {
this.turnovers = { error: error };
}
})
}
applyPage(event: PageEvent) {
this.turnovers.limit = event.pageSize;
this.turnovers.offset = event.pageSize * event.pageIndex;
this.update();
}
applySort(event: Sort) {
this.sort = event.direction ? event.active : 'created';
this.descending = event.direction !== 'asc';
this.update();
}
setFilter(key: string, value) {
if (value != this.turnovers.filter[key]) {
this.turnovers.filter[key] = value;
this.turnovers.offset = 0;
this.update();
}
}
}