79 lines
2.9 KiB
TypeScript
79 lines
2.9 KiB
TypeScript
import { Component, inject, LOCALE_ID } from '@angular/core';
|
|
import { AgGridContainerComponent } from '../../../../shared/ag-grid/components/ag-grid-container/ag-grid-container.component';
|
|
import { CommonModule, DatePipe } from '@angular/common';
|
|
import { HotToastService } from '@ngxpert/hot-toast';
|
|
import { ApiService } from '../../../../shared/api.service';
|
|
import { GridApi, GridOptions, GridReadyEvent } from 'ag-grid-community';
|
|
import { HELPER } from '../../../../shared/helper.service';
|
|
import { MatButtonModule } from '@angular/material/button';
|
|
import { MatDialogModule } from '@angular/material/dialog';
|
|
import { MatIconModule } from '@angular/material/icon';
|
|
import { AgGridAngular } from 'ag-grid-angular';
|
|
import { ICylinder } from '../../../../model/interface/cylinder.interface';
|
|
|
|
@Component({
|
|
selector: 'app-cylinder-archive',
|
|
imports: [MatDialogModule, AgGridAngular, MatButtonModule, MatIconModule, CommonModule],
|
|
providers: [DatePipe, { provide: LOCALE_ID, useValue: 'de-DE' }],
|
|
templateUrl: './cylinder-archive.component.html',
|
|
styleUrl: './cylinder-archive.component.scss',
|
|
})
|
|
export class CylinderArchiveComponent extends AgGridContainerComponent {
|
|
private api: ApiService = inject(ApiService);
|
|
private datePipe = inject(DatePipe);
|
|
private toast = inject(HotToastService);
|
|
|
|
gridApi!: GridApi;
|
|
|
|
gridOptions: GridOptions = HELPER.getGridOptions();
|
|
|
|
constructor() {
|
|
super();
|
|
|
|
this.createGridOptions();
|
|
|
|
}
|
|
|
|
private createGridOptions() {
|
|
this.gridOptions.columnDefs = [
|
|
{ colId: 'name', field: 'name' , headerName: 'Name', flex: 1, editable: true, sort: 'asc', filter: true },
|
|
{ colId: 'nr', field: 'nr' , headerName: 'Name', flex: 1, editable: true, filter: true },
|
|
{
|
|
field: 'deletedAt'
|
|
, headerName: 'Gelöscht'
|
|
, width: 160
|
|
, cellRenderer: (data: any) => this.datePipe.transform(new Date(data.value), 'short')
|
|
},
|
|
{
|
|
width: 40,
|
|
cellRenderer: () => '<div class="icon-btn-sm restore icon-btn-xs" ></div>',
|
|
onCellClicked: (event) => { this.restoreCylinder(event.data);},
|
|
tooltipValueGetter: () => 'Wiederherstellen',
|
|
sortable: false
|
|
}
|
|
];
|
|
this.gridOptions.rowHeight = 36;
|
|
this.gridOptions.overlayNoRowsTemplate = 'Bisher wurden keine Zylinder gelöscht. Sobald dies der Fall ist, werden sie hier angezeigt.';
|
|
}
|
|
|
|
|
|
async restoreCylinder(data: ICylinder) {
|
|
this.gridApi.setGridOption("loading", true);
|
|
await this.api.restoreCylinder(data);
|
|
this.loadCylinders();
|
|
}
|
|
|
|
onGridReady(params: GridReadyEvent) {
|
|
this.gridApi = params.api;
|
|
this.loadCylinders();
|
|
}
|
|
|
|
async loadCylinders() {
|
|
this.gridApi.setGridOption("loading", true);
|
|
const cylinders = await this.api.getCylinderArchive();
|
|
this.gridApi.setGridOption("rowData", cylinders);
|
|
this.gridApi.setGridOption("loading", false);
|
|
}
|
|
|
|
}
|