julien/headup_app
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Mise à jour du composant 'jump-table'

Browse Source
This commit is contained in:
Julien Gautier
2023-10-04 14:18:01 +02:00
parent 37cbba6cad
commit 8d595900b8
2 changed files with 65 additions and 60 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/components/shared/helpers-jump/jump-table.component.html
+24 -24
View File
@@ -48,14 +48,14 @@
<ng-container matColumnDef="lieu">
<th class="pl-3" mat-header-cell *matHeaderCellDef> Lieu </th>
<td class="pl-3 text-nowrap" mat-cell *matCellDef="let element">
<ng-container *ngIf="element.lieu">{{element.lieu}}</ng-container>
<ng-container *ngIf="element.lieu">{{element.lieu}} - {{element.oaci}}</ng-container>
<ng-container *ngIf="!element.numero">
<ngx-skeleton-loader [theme]="{width: '30px', height: '13px', marginBottom: '0px'}">
</ngx-skeleton-loader>
</ng-container>
</td>
</ng-container>
<!-- Oaci Column -->
<!-- Oaci Column
<ng-container matColumnDef="oaci">
<th class="pl-3" mat-header-cell *matHeaderCellDef> Oaci </th>
<td class="pl-3 text-nowrap" mat-cell *matCellDef="let element">
@@ -65,19 +65,19 @@
</ngx-skeleton-loader>
</ng-container>
</td>
</ng-container>
</ng-container> -->
<!-- Aeronef Column -->
<ng-container matColumnDef="aeronef">
<th class="pl-3" mat-header-cell *matHeaderCellDef> Aeronef </th>
<td class="pl-3 text-nowrap" mat-cell *matCellDef="let element">
<ng-container *ngIf="element.aeronef">{{element.aeronef}}</ng-container>
<ng-container *ngIf="element.aeronef">{{element.aeronef}} - {{element.imat}}</ng-container>
<ng-container *ngIf="!element.numero">
<ngx-skeleton-loader [theme]="{width: '30px', height: '13px', marginBottom: '0px'}">
</ngx-skeleton-loader>
</ng-container>
</td>
</ng-container>
<!-- Imat Column -->
<!-- Imat Column
<ng-container matColumnDef="imat">
<th class="pl-3" mat-header-cell *matHeaderCellDef> Imat </th>
<td class="pl-3 text-nowrap" mat-cell *matCellDef="let element">
@@ -87,7 +87,7 @@
</ngx-skeleton-loader>
</ng-container>
</td>
</ng-container>
</ng-container> -->
<!-- Hauteur Column -->
<ng-container matColumnDef="hauteur">
<th class="pl-3" mat-header-cell *matHeaderCellDef> Hauteur </th>
@@ -103,14 +103,14 @@
<ng-container matColumnDef="voile">
<th class="pl-3" mat-header-cell *matHeaderCellDef> Voile </th>
<td class="pl-3 text-nowrap" mat-cell *matCellDef="let element">
<ng-container *ngIf="element.voile">{{element.voile}}</ng-container>
<ng-container *ngIf="element.voile">{{element.voile}} - {{element.taille}}</ng-container>
<ng-container *ngIf="!element.numero">
<ngx-skeleton-loader [theme]="{width: '30px', height: '13px', marginBottom: '0px'}">
</ngx-skeleton-loader>
</ng-container>
</td>
</ng-container>
<!-- Taille Column -->
<!-- Taille Column
<ng-container matColumnDef="taille">
<th class="pl-3" mat-header-cell *matHeaderCellDef> Taille </th>
<td class="text-nowrap text-end pl-3 pr-3" mat-cell *matCellDef="let element">
@@ -120,19 +120,19 @@
</ngx-skeleton-loader>
</ng-container>
</td>
</ng-container>
</ng-container> -->
<!-- Categorie Column -->
<ng-container matColumnDef="categorie">
<th class="pl-3" mat-header-cell *matHeaderCellDef> Categorie </th>
<td class="pl-3 text-nowrap" mat-cell *matCellDef="let element">
<ng-container *ngIf="element.categorie">{{element.categorie}}</ng-container>
<ng-container *ngIf="element.categorie">{{element.categorie}} - {{element.module}}</ng-container>
<ng-container *ngIf="!element.numero">
<ngx-skeleton-loader [theme]="{width: '30px', height: '13px', marginBottom: '0px'}">
</ngx-skeleton-loader>
</ng-container>
</td>
</ng-container>
<!-- Module Column -->
<!-- Module Column
<ng-container matColumnDef="module">
<th class="pl-3" mat-header-cell *matHeaderCellDef> Module </th>
<td class="pl-3 text-nowrap" mat-cell *matCellDef="let element">
@@ -142,6 +142,17 @@
</ngx-skeleton-loader>
</ng-container>
</td>
</ng-container> -->
<!-- Zone Column -->
<ng-container matColumnDef="zone">
<th class="pl-3" mat-header-cell *matHeaderCellDef> Zone </th>
<td class="pl-3 text-nowrap" mat-cell *matCellDef="let element">
<ng-container *ngIf="element.zone">{{element.zone}}</ng-container>
<ng-container *ngIf="!element.numero">
<ngx-skeleton-loader [theme]="{width: '30px', height: '13px', marginBottom: '0px'}">
</ngx-skeleton-loader>
</ng-container>
</td>
</ng-container>
<!-- Participants Column -->
<ng-container matColumnDef="participants">
@@ -176,18 +187,7 @@
</ng-container>
</td>
</ng-container>
<!-- Zone Column -->
<ng-container matColumnDef="zone">
<th class="pl-3" mat-header-cell *matHeaderCellDef> Zone </th>
<td class="pl-3 text-nowrap" mat-cell *matCellDef="let element">
<ng-container *ngIf="element.zone">{{element.zone}}</ng-container>
<ng-container *ngIf="!element.numero">
<ngx-skeleton-loader [theme]="{width: '30px', height: '13px', marginBottom: '0px'}">
</ngx-skeleton-loader>
</ng-container>
</td>
</ng-container>
<!-- Dossier Column -->
<!-- Dossier Column
<ng-container matColumnDef="dossier">
<th class="pl-3" mat-header-cell *matHeaderCellDef> Dossier </th>
<td class="pl-3 text-nowrap" mat-cell *matCellDef="let element">
@@ -197,7 +197,7 @@
</ngx-skeleton-loader>
</ng-container>
</td>
</ng-container>
</ng-container> -->
<!-- Video Column -->
<ng-container matColumnDef="video">
<th class="pl-3" mat-header-cell *matHeaderCellDef> Video </th>
src/app/components/shared/helpers-jump/jump-table.component.ts
+41 -36
View File
@@ -47,11 +47,17 @@ export class JumpTableComponent implements OnChanges, OnDestroy, AfterContentChe
public jump: Jump = {} as Jump;
public jumps!: MatTableDataSource<Jump>;
public jumpsCount = 0;
public displayedColumns: string[] = [
/* public displayedColumns: string[] = [
'numero', 'date', 'lieu', 'oaci', 'aeronef',
'imat', 'hauteur', 'voile', 'taille', 'categorie',
'module', 'participants', 'programme', 'accessoires',
'zone', 'video', 'actions'
];*/
public displayedColumns: string[] = [
'numero', 'date', 'lieu', 'aeronef',
'hauteur', 'voile', 'categorie',
'participants', 'zone', 'accessoires',
'video', 'actions'
];
//public displayedColumns: string[] = jumpColumns.map((col) => col.key)
public columnsSchema: Array<ColumnDefinition> = jumpColumns;
@@ -101,7 +107,7 @@ export class JumpTableComponent implements OnChanges, OnDestroy, AfterContentChe
this.loading = true;
this._query = this.config;
this.runQuery();
console.log('ngOnChanges event in jump-table component');
//console.log('ngOnChanges event in jump-table component');
}
ngOnDestroy() {
@@ -113,7 +119,7 @@ export class JumpTableComponent implements OnChanges, OnDestroy, AfterContentChe
if (this.jumpRefresh != this._jumpTableService.jumpRefresh) {
this.jumpRefresh = this._jumpTableService.jumpRefresh;
this.runQuery();
console.log('table has been refreshed in jump-table component');
//console.log('table has been refreshed in jump-table component');
}
}
@@ -175,11 +181,11 @@ export class JumpTableComponent implements OnChanges, OnDestroy, AfterContentChe
data: jump
});
dialogRef.afterClosed().pipe(take(1))
.subscribe(result => {
if (result != undefined) {
this._onEdit(result);
}
});
.subscribe(result => {
if (result != undefined) {
this._onEdit(result);
}
});
}
getErrorMessage() {
@@ -201,19 +207,19 @@ export class JumpTableComponent implements OnChanges, OnDestroy, AfterContentChe
try {
this.isDeleting = true;
this._jumpsService.destroy(slug)
.pipe(take(1))
.subscribe({
next: () => {
this._resetErrors();
this._openSnackBar(`Le saut a été supprimé !`, 'OK');
this.runQuery();
this.tableRefresh = !this.tableRefresh;
this._jumpTableService.updateTableRefresh(this.tableRefresh);
},
error: (err) => {
this.errors = err;
}
});
.pipe(take(1))
.subscribe({
next: () => {
this._resetErrors();
this._openSnackBar(`Le saut a été supprimé !`, 'OK');
this.runQuery();
this.tableRefresh = !this.tableRefresh;
this._jumpTableService.updateTableRefresh(this.tableRefresh);
},
error: (err) => {
this.errors = err;
}
});
} catch (error) {
console.error(error);
}
@@ -222,22 +228,21 @@ export class JumpTableComponent implements OnChanges, OnDestroy, AfterContentChe
private _onEdit(jump: Jump): void {
try {
this.isSubmitting = true;
console.log(jump);
this._jumpsService.update(jump)
.pipe(take(1))
.subscribe({
next: (jump) => {
this._resetErrors();
this._openSnackBar(`Le saut n°${jump.numero} a été mis à jour !`, 'OK');
this.runQuery();
this.tableRefresh = !this.tableRefresh;
this._jumpTableService.updateTableRefresh(this.tableRefresh);
},
error: (err) => {
this.errors = err;
this.isSubmitting = false;
}
});
.pipe(take(1))
.subscribe({
next: (jump) => {
this._resetErrors();
this._openSnackBar(`Le saut n°${jump.numero} a été mis à jour !`, 'OK');
this.runQuery();
this.tableRefresh = !this.tableRefresh;
this._jumpTableService.updateTableRefresh(this.tableRefresh);
},
error: (err) => {
this.errors = err;
this.isSubmitting = false;
}
});
} catch (error) {
console.error(error);
}