This commit is contained in:
Bastian Wagner
2024-10-23 15:16:00 +02:00
parent b453945183
commit 03ae75c83d
23 changed files with 138 additions and 103 deletions

View File

@@ -11,7 +11,7 @@
</mat-toolbar>
<mat-drawer-container class="example-container" autosize>
<mat-drawer #drawer class="main_sidenav" mode="side" opened="true">
<mat-drawer #drawer class="main_sidenav" mode="side" opened="true" style="border-right: 1px solid #dfdfdf">
<button mat-button routerLink="/" routerLinkActive="mat-elevation-z1" [routerLinkActiveOptions]="{exact: true}">Home</button>
<button mat-button routerLink="/keys" routerLinkActive="mat-elevation-z1">Schlüssel</button>
<button mat-button routerLink="/users" routerLinkActive="mat-elevation-z1">Alle User</button>

View File

@@ -1,14 +1,21 @@
import { Component, inject } from '@angular/core';
import { MatButtonModule } from '@angular/material/button';
import { AuthService } from '../../../core/auth/auth.service';
import { MatDialog, MatDialogActions, MatDialogModule, MatDialogRef } from '@angular/material/dialog';
@Component({
selector: 'app-login',
standalone: true,
imports: [MatButtonModule],
imports: [MatButtonModule, MatDialogModule],
templateUrl: './login.component.html',
styleUrl: './login.component.scss'
})
export class LoginComponent {
public authService: AuthService = inject(AuthService);
readonly dialogRef = inject(MatDialog);
ngOnInit() {
this.dialogRef.closeAll();
}
}

View File

@@ -44,10 +44,12 @@ export class ArchiveComponent {
},
{
width: 40,
cellRenderer: () => '<div class="icon-btn-sm restore" ></div>',
onCellClicked: (event) => { this.restoreKey(event.data);}
cellRenderer: () => '<div class="icon-btn-sm restore icon-btn-xs" ></div>',
onCellClicked: (event) => { this.restoreKey(event.data);},
sortable: false
}
]
];
this.gridOptions.rowHeight = 36;
}
onGridReady(params: GridReadyEvent) {

View File

@@ -5,6 +5,6 @@
/>
<div class="floating-btn-container">
<button mat-raised-button class="btn-create" (click)="openCreateKey()" >Schlüssel anlegen</button>
<button mat-flat-button class="btn-create mat-elevation-z8" (click)="openCreateKey()" color="accent" >Schlüssel anlegen</button>
<button mat-mini-fab (click)="openArchive()"><mat-icon>inventory_2</mat-icon></button>
</div>

View File

@@ -1,7 +1,7 @@
.floating-btn-container {
position: absolute;
bottom: 12px;
right: 12px;
bottom: 48px;
right: 24px;
display: flex;
gap: 12px;
}

View File

@@ -9,7 +9,6 @@ import { HotToastService } from '@ngxpert/hot-toast';
import { MatButtonModule } from '@angular/material/button';
import { MatDialog, MatDialogModule } from '@angular/material/dialog';
import { CreateKeyComponent } from './create/create.component';
import { AgOpenHandoutComponent } from '../../shared/ag-grid/components/ag-open-handout/ag-open-handout.component';
import { AgDeleteKeyComponent } from '../../shared/ag-grid/components/ag-delete-key/ag-delete-key.component';
import { MatIconModule } from '@angular/material/icon';
import { ArchiveComponent } from './components/archive/archive.component';
@@ -37,14 +36,7 @@ export class KeysComponent {
localeText: AG_GRID_LOCALE_DE,
rowData: [],
columnDefs: [
{
cellRenderer: AgOpenHandoutComponent,
width: 100,
headerName: 'Übergabe',
sortable: false,
colId: 'handover',
},
{ colId: 'handedOut', field: 'handedOut' , headerName: 'Ausgegeben', width: 100, editable: false, filter: false, headerTooltip: 'Ausgegeben' },
{ colId: 'name', field: 'name' , headerName: 'Name', flex: 1, editable: true, sort: 'asc', filter: true },
{ colId: 'nr', field: 'nr' , headerName: 'Schlüsselnummer', flex: 1, editable: true, filter: true },
{ colId: 'cylinder', field: 'cylinder' , headerName: 'Zylinder', flex: 1, editable: true, filter: true, cellRenderer: (data: any) => {return data.value?.name}, cellEditor: 'agSelectCellEditor',
@@ -54,8 +46,9 @@ export class KeysComponent {
}
},
valueFormatter: (val) => {
return val.value?.name;
}
return val.value?.name + ` (${val.value?.system?.name})`;
},
cellEditorPopup: false
},
{ colId: 'system', field: 'cylinder.system' , headerName: 'Schließanlage', flex: 1, editable: false, filter: true, cellRenderer: (data: any) => {return data.value?.name} },
{
@@ -73,19 +66,20 @@ export class KeysComponent {
, type: 'date'
, cellRenderer: (data: any) => data.value ? this.datePipe.transform(new Date(data.value)) : '-'
, tooltipValueGetter: (data: any) => this.datePipe.transform(new Date(data.value), 'medium')
}
,{
colId: 'delete'
, headerName: 'Löschen'
},
{ colId: 'handedOut', field: 'handedOut' , headerName: 'Ausgegeben', width: 100, editable: false, filter: false, headerTooltip: 'Ausgegeben' },
{
colId: 'actions'
, headerName: 'Aktionen'
, width: 120
, cellRenderer: AgDeleteKeyComponent
// , onCellClicked: (event) => { this.deleteKey(event.data.id)}
}
],
loading: true,
rowHeight: 36,
loadingOverlayComponent: AgLoadingComponent
rowHeight: 54,
loadingOverlayComponent: AgLoadingComponent,
pagination: true,
}
deleteKey(id: string) {

View File

@@ -1 +1,3 @@
<div class="delete icon-btn-sm" (click)="delete()" ></div>
<div class="handover icon-btn-sm" (click)="openHandoutDialog()" matTooltip="Schlüsselübergaben" [matTooltipShowDelay]="600"></div>
<div class="delete icon-btn-sm" (click)="delete()" matTooltip="Löschen" [matTooltipShowDelay]="600"></div>

View File

@@ -1,8 +1,13 @@
:host {
display: flex;
flex-direction: column;
flex-direction: row;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
gap: 12px;
}
.handover {
background-image: url('../../../../../assets/img/key_2.svg');
}

View File

@@ -6,11 +6,13 @@ import { ApiService } from '../../../api.service';
import { MatDialog, MatDialogModule } from '@angular/material/dialog';
import { DeleteKeyComponent } from '../../../../modules/keys/components/delete-key/delete-key.component';
import { HotToastService } from '@ngxpert/hot-toast';
import { HandoverDialogComponent } from '../../../../modules/keys/components/handover-dialog/handover-dialog.component';
import { MatTooltipModule } from '@angular/material/tooltip';
@Component({
selector: 'app-ag-delete-key',
standalone: true,
imports: [MatDialogModule],
imports: [MatDialogModule, MatTooltipModule],
templateUrl: './ag-delete-key.component.html',
styleUrl: './ag-delete-key.component.scss'
})
@@ -66,4 +68,20 @@ export class AgDeleteKeyComponent implements ICellRendererAngularComp {
})
}
openHandoutDialog() {
this.dialog.open(HandoverDialogComponent, {
data: this.key,
autoFocus: false,
maxWidth: '100vw',
maxHeight: '100vh'
}).afterClosed().subscribe({
next: n => {
if (n != null) {
this.key.handedOut = n;
this.params.api.refreshCells();
}
}
})
}
}

View File

@@ -1 +0,0 @@
<div class="handover icon-btn-sm" (click)="openDialog()" matTooltip="Schlüsselübergaben" [matTooltipShowDelay]="600"></div>

View File

@@ -1,11 +0,0 @@
:host {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
height: 100%;
}
.handover {
background-image: url('../../../../../assets/img/key_2.svg');
}

View File

@@ -1,45 +0,0 @@
import { Component, HostBinding, inject } from '@angular/core';
import { ICellRendererAngularComp } from 'ag-grid-angular';
import { ICellRendererParams } from 'ag-grid-community';
import { IKey } from '../../../../model/interface/key.interface';
import { MatDialog, MatDialogModule } from '@angular/material/dialog';
import { HandoverDialogComponent } from '../../../../modules/keys/components/handover-dialog/handover-dialog.component';
import {MatTooltipModule} from '@angular/material/tooltip';
@Component({
selector: 'app-ag-open-handout',
standalone: true,
imports: [MatDialogModule, MatTooltipModule],
templateUrl: './ag-open-handout.component.html',
styleUrl: './ag-open-handout.component.scss'
})
export class AgOpenHandoutComponent implements ICellRendererAngularComp {
private dialog: MatDialog = inject(MatDialog);
key!: IKey;
params!: ICellRendererParams<any, any, any>;
agInit(params: ICellRendererParams<any, any, any>): void {
this.params = params;
this.key = params.data;
}
refresh(params: ICellRendererParams<any, any, any>): boolean {
return false;
}
openDialog() {
this.dialog.open(HandoverDialogComponent, {
data: this.key,
autoFocus: false,
maxWidth: '100vw',
maxHeight: '100vh'
}).afterClosed().subscribe({
next: n => {
if (n != null) {
this.key.handedOut = n;
this.params.api.refreshCells();
}
}
})
}
}

View File

@@ -10,7 +10,8 @@ export class HELPER {
rowData: [],
columnDefs: [],
loading: true,
loadingOverlayComponent: AgLoadingComponent
loadingOverlayComponent: AgLoadingComponent,
rowHeight: 54,
}
}
}