sandre/SkydiveLogs
0
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Changement la navigation à gauche

Browse Source
This commit is contained in:
Sébastien André
2021-04-14 12:18:16 +02:00
parent 41fac29b91
commit b00ae1618a
2 changed files with 60 additions and 69 deletions
Download Patch File Download Diff File Expand all files Collapse all files

121
Front/skydivelogs-app/src/app/app.component.html
View File

@@ -1,70 +1,55 @@
<header *ngIf="this.show()">
<div style="display: flex; justify-content: space-between;">
<div>
<svg (click)="toggleMenu()" class="hamburger__icon" viewBox="31.5 30 49.9 32">
<rect id="Rectangle_9" width="49.9" height="4" class="hamburger__icon__fill" data-name="Rectangle 9" rx="2"
transform="translate(31.5 58)"></rect>
<rect id="Rectangle_10" width="49.9" height="4" class="hamburger__icon__fill" data-name="Rectangle 10" rx="2"
transform="translate(31.5 44)"></rect>
<rect id="Rectangle_11" width="49.9" height="4" class="hamburger__icon__fill" data-name="Rectangle 11" rx="2"
transform="translate(31.5 30)"></rect>
</svg>
<h2 style="display: inline;">{{ title }}</h2>
</div>
</div>
<mat-toolbar>
<button mat-icon-button (click)="snav.toggle()"><mat-icon>menu</mat-icon></button>
<h2>{{ title }}</h2>
</mat-toolbar>
<nav class="navigation" [ngClass]="{'side-menu-active': showMenu}">
<ul>
<li>
<mat-icon aria-hidden="false" aria-label="Summary">timeline</mat-icon>
<a routerLink="/summary" routerLinkActive="active" (click)="toggleMenu()" skipLocationChange>Summary</a>
<hr class="splitter">
</li>
<li>
<mat-icon aria-hidden="false" aria-label="List of jumps">list_alt</mat-icon>
<a routerLink="/jumps" routerLinkActive="active" (click)="toggleMenu()" skipLocationChange>List of
jumps</a>
</li>
<li>
<mat-icon aria-hidden="false" aria-label="Add jumps">add_circle</mat-icon>
<a routerLink="/newjump" routerLinkActive="active" (click)="toggleMenu()" skipLocationChange>Add a new
jump</a>
<hr class="splitter">
</li>
<li>
<mat-icon aria-hidden="false" aria-label="Dropzones">store</mat-icon>
<a routerLink="/dzs" routerLinkActive="active" (click)="toggleMenu()" skipLocationChange>List of DZs</a>
</li>
<li>
<mat-icon aria-hidden="false" aria-label="Aircrafts">airplanemode_active</mat-icon>
<a routerLink="/aircrafts" routerLinkActive="active" (click)="toggleMenu()" skipLocationChange>List of
aircrafts</a>
</li>
<li>
<mat-icon aria-hidden="false" aria-label="List of jump types">flight_land</mat-icon>
<a routerLink="/jumpTypes" routerLinkActive="active" (click)="toggleMenu()" skipLocationChange>List of
jump types</a>
</li>
<li>
<mat-icon aria-hidden="false" aria-label="List of gears">settings_input_antenna</mat-icon>
<a routerLink="/gears" routerLinkActive="active" (click)="toggleMenu()" skipLocationChange>List of
gears</a>
</li>
<li *ngIf="currentUser">
<hr class="splitter">
<mat-icon aria-hidden="false" aria-label="User account">account_box</mat-icon>
<a routerLink="/user" routerLinkActive="active" (click)="toggleMenu()" skipLocationChange>
{{ this.currentUser.firstName }} {{ this.currentUser.lastName }}
</a>
</li>
<li *ngIf="currentUser">
<mat-icon aria-hidden="false" aria-label="To logout">logout</mat-icon>
<span (click)="logout()" style="cursor: pointer;">Logout</span>
</li>
</ul>
</nav>
</header>
<mat-sidenav-container>
<mat-sidenav #snav mode="over" style="padding: 0 20px 0 10px;">
<mat-nav-list>
<mat-icon aria-hidden="false" aria-label="Summary">timeline</mat-icon>
<a routerLink="/summary" routerLinkActive="active" (click)="snav.toggle()" skipLocationChange>Summary</a>
<hr class="splitter">
</mat-nav-list>
<mat-nav-list>
<mat-icon aria-hidden="false" aria-label="List of jumps">list_alt</mat-icon>
<a routerLink="/jumps" routerLinkActive="active" (click)="snav.toggle()" skipLocationChange>List of jumps</a>
</mat-nav-list>
<mat-nav-list>
<mat-icon aria-hidden="false" aria-label="Add jumps">add_circle</mat-icon>
<a routerLink="/newjump" routerLinkActive="active" (click)="snav.toggle()" skipLocationChange>Add a new jump</a>
<hr class="splitter">
</mat-nav-list>
<mat-nav-list>
<mat-icon aria-hidden="false" aria-label="Dropzones">store</mat-icon>
<a routerLink="/dzs" routerLinkActive="active" (click)="snav.toggle()" skipLocationChange>List of DZs</a>
</mat-nav-list>
<mat-nav-list>
<mat-icon aria-hidden="false" aria-label="Aircrafts">airplanemode_active</mat-icon>
<a routerLink="/aircrafts" routerLinkActive="active" (click)="snav.toggle()" skipLocationChange>List of aircrafts</a>
</mat-nav-list>
<mat-nav-list>
<mat-icon aria-hidden="false" aria-label="List of jump types">flight_land</mat-icon>
<a routerLink="/jumpTypes" routerLinkActive="active" (click)="snav.toggle()" skipLocationChange>List of jump types</a>
</mat-nav-list>
<mat-nav-list>
<mat-icon aria-hidden="false" aria-label="List of gears">settings_input_antenna</mat-icon>
<a routerLink="/gears" routerLinkActive="active" (click)="snav.toggle()" skipLocationChange>List of gears</a>
</mat-nav-list>
<mat-nav-list *ngIf="currentUser">
<hr class="splitter">
<mat-icon aria-hidden="false" aria-label="User account">account_box</mat-icon>
<a routerLink="/user" routerLinkActive="active" (click)="snav.toggle()" skipLocationChange>
{{ this.currentUser.firstName }} {{ this.currentUser.lastName }}
</a>
</mat-nav-list>
<mat-nav-list *ngIf="currentUser">
<mat-icon aria-hidden="false" aria-label="To logout">logout</mat-icon>
<span (click)="logout()" style="cursor: pointer;">Logout</span>
</mat-nav-list>
</mat-sidenav>
<router-outlet></router-outlet>
<footer style="text-align: right;">Web software to log your skydive jumps - v{{ version }} - @Séb</footer>
<mat-sidenav-content>
<router-outlet></router-outlet>
<footer style="text-align: right;">Web software to log your skydive jumps - v{{ version }} - @Séb</footer>
</mat-sidenav-content>
</mat-sidenav-container>

8
Front/skydivelogs-app/src/app/app.module.ts
View File

@@ -53,6 +53,9 @@ import { MatTabsModule } from "@angular/material/tabs";
import { MatDialogModule } from "@angular/material/dialog";
import { MatCardModule } from "@angular/material/card";
import { MatRadioModule } from "@angular/material/radio";
import { MatSidenavModule } from '@angular/material/sidenav';
import { MatListModule } from '@angular/material/list';
import { MatToolbarModule } from '@angular/material/toolbar';
import { CachingInterceptor } from "../interceptor/caching.interceptor";
//import { BasicAuthInterceptor } from '../interceptor/basic-auth.interceptor';
@@ -163,7 +166,10 @@ export function initConfig(configService: ConfigurationHelper) {
MatTabsModule,
MatDialogModule,
MatCardModule,
MatRadioModule
MatRadioModule,
MatSidenavModule,
MatListModule,
MatToolbarModule
],
exports: [HttpClientModule],
providers: [