2-3 changements d'affichage dans les tableaux

This commit is contained in:
Sébastien André
2020-07-29 14:17:57 +02:00
parent 1e3e728fdd
commit caa7215b71
6 changed files with 34 additions and 27 deletions

View File

@@ -6,10 +6,10 @@
<ng-container matColumnDef="isfavorite"> <ng-container matColumnDef="isfavorite">
<th mat-header-cell *matHeaderCellDef style="min-width: 144px;"></th> <th mat-header-cell *matHeaderCellDef style="min-width: 144px;"></th>
<td mat-cell *matCellDef="let element" style="text-align: left;"> <td mat-cell *matCellDef="let element" style="text-align: left;">
<mat-icon aria-hidden="false" aria-label="Favorit" *ngIf="element.isFavorite === true" <mat-icon aria-hidden="false" aria-label="Favorite" *ngIf="element.isFavorite === true"
(click)="removeToFavorite(element)">favorite</mat-icon> (click)="removeToFavorite(element)" color="primary" style="cursor: pointer;">favorite</mat-icon>
<mat-icon aria-hidden="false" aria-label="Not favorite" *ngIf="element.isFavorite === false" <mat-icon aria-hidden="false" aria-label="Not favorite" *ngIf="element.isFavorite === false"
(click)="setToFavorite(element)">favorite_border</mat-icon> (click)="setToFavorite(element)" style="cursor: pointer;">favorite_border</mat-icon>
<a href='http://{{element.website}}' target="_blank"> <a href='http://{{element.website}}' target="_blank">
<mat-icon aria-hidden="false" aria-label="URL to the DZ website">link</mat-icon> <mat-icon aria-hidden="false" aria-label="URL to the DZ website">link</mat-icon>

View File

@@ -1,6 +1,13 @@
<div class="content"> <div class="content">
<div *ngIf="dataSourceTable != null else loading"> <div *ngIf="dataSourceTable != null else loading">
<table mat-table [dataSource]="dataSourceTable"> <table mat-table [dataSource]="dataSourceTable">
<ng-container matColumnDef="infos">
<th mat-header-cell *matHeaderCellDef></th>
<td mat-cell *matCellDef="let element" style="text-align: left; cursor: pointer;">
<mat-icon aria-hidden="false" aria-label="All informations of the jump">info</mat-icon>
</td>
</ng-container>
<ng-container matColumnDef="id"> <ng-container matColumnDef="id">
<th mat-header-cell *matHeaderCellDef>ID</th> <th mat-header-cell *matHeaderCellDef>ID</th>
<td mat-cell *matCellDef="let element">{{element.id}}</td> <td mat-cell *matCellDef="let element">{{element.id}}</td>

View File

@@ -1,26 +1,26 @@
import { Component, OnInit, ViewChild } from "@angular/core"; import { Component, OnInit, ViewChild } from '@angular/core';
import { MatPaginator } from "@angular/material/paginator"; import { MatPaginator } from '@angular/material/paginator';
import { MatTableDataSource } from "@angular/material/table"; import { MatTableDataSource } from '@angular/material/table';
import { Observable } from "rxjs"; import { Observable } from 'rxjs';
import { JumpResp } from "../../models/jump"; import { JumpResp } from '../../models/jump';
import { JumpService } from "../../services/jump.service"; import { JumpService } from '../../services/jump.service';
import { ServiceComm } from "../../services/service-comm.service"; import { ServiceComm } from '../../services/service-comm.service';
@Component({ @Component({
selector: "app-list-of-jumps", selector: 'app-list-of-jumps',
templateUrl: "./list-of-jumps.component.html", templateUrl: './list-of-jumps.component.html',
styleUrls: ["./list-of-jumps.component.css"] styleUrls: ['./list-of-jumps.component.css']
}) })
export class ListOfJumpsComponent implements OnInit { export class ListOfJumpsComponent implements OnInit {
public listOfJumps: Observable<Array<JumpResp>>; public listOfJumps: Observable<Array<JumpResp>>;
public displayedColumns: Array<string> = [ public displayedColumns: Array<string> = [
"id", 'infos',
"jumpDate", 'id',
"jumpType", 'jumpDate',
"aircraft", 'jumpType',
"dropZone", 'aircraft',
"gear" 'dropZone'
]; ];
public dataSourceTable; public dataSourceTable;
public resultsLength = 0; public resultsLength = 0;
@@ -29,10 +29,10 @@ export class ListOfJumpsComponent implements OnInit {
constructor( constructor(
private serviceApi: JumpService, private serviceApi: JumpService,
private serviceComm: ServiceComm private serviceComm: ServiceComm
) {} ) { }
ngOnInit() { ngOnInit() {
this.serviceComm.UpdatedComponentTitle("List of jumps"); this.serviceComm.UpdatedComponentTitle('List of jumps');
this.getListOfJumps(); this.getListOfJumps();
} }

View File

@@ -37,8 +37,8 @@
<mat-autocomplete #autoDropZone="matAutocomplete" [displayWith]="displayFn"> <mat-autocomplete #autoDropZone="matAutocomplete" [displayWith]="displayFn">
<mat-option *ngFor="let dropZone of listOfFilteredDropZone" [value]="dropZone"> <mat-option *ngFor="let dropZone of listOfFilteredDropZone" [value]="dropZone">
{{dropZone.name}} {{dropZone.name}}
<img src="../../assets/img/favorite.png" alt="favorite DZ" *ngIf="dropZone.isFavorite === true" <mat-icon aria-hidden="false" aria-label="Favorite" *ngIf="dropZone.isFavorite === true" color="primary">
style="width: 16px;"> favorite</mat-icon>
</mat-option> </mat-option>
</mat-autocomplete> </mat-autocomplete>
<button mat-button *ngIf="selectedDz" matSuffix mat-icon-button aria-label="Clear" (click)="selectedDz=undefined"> <button mat-button *ngIf="selectedDz" matSuffix mat-icon-button aria-label="Clear" (click)="selectedDz=undefined">

View File

@@ -1,6 +1,6 @@
export const environment = { export const environment = {
production: true, production: true,
apiUrl: "https://divelog.sebastienandre.com", apiUrl: 'https://divelog.sebastienandre.com',
debugMode: false, debugMode: false,
version: "0.6.0", version: '0.7.0',
}; };

View File

@@ -5,7 +5,7 @@
export const environment = { export const environment = {
production: false, production: false,
apiUrl: "http://localhost:5000", apiUrl: 'http://localhost:5000',
debugMode: false, debugMode: false,
version: "0.6.0", version: '0.7.0',
}; };