diff --git a/deploy-backend.sh b/deploy-backend.sh index b66d90a..77750ae 100755 --- a/deploy-backend.sh +++ b/deploy-backend.sh @@ -2,4 +2,4 @@ cd backend || exit docker-compose build backend -USERNAME="0" docker-compose run -e COMMAND=deploy -v /var/run/docker.sock:/var/run/docker.sock backend +SZD_USERNAME="0" docker-compose run -e COMMAND=deploy -v /var/run/docker.sock:/var/run/docker.sock backend diff --git a/docker-compose.yml b/docker-compose.yml index 3e44219..08591e4 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -16,7 +16,7 @@ services: environment: - COMMAND=run - DATABASE_URL=mysql://szakdolgozat:DevelopmentPassword@database/szakdolgozat - user: ${USERNAME:-node} + user: ${SZD_USERNAME:-node} database: image: mysql:5.6 ports: diff --git a/frontend/src/app/app-routing.module.ts b/frontend/src/app/app-routing.module.ts index 266db6e..cc27147 100644 --- a/frontend/src/app/app-routing.module.ts +++ b/frontend/src/app/app-routing.module.ts @@ -13,7 +13,11 @@ const routes: Routes = [ path: '', canActivate: [AuthCheck], children: [ - {path: 'users', loadChildren: async () => (await import('./users/users.module')).UsersModule} + { + path: 'users', + loadChildren: async () => (await import('./users/users.module')).UsersModule, + data: {title: 'Felhasználók'} as RouteData + } ] } ]; @@ -24,3 +28,5 @@ const routes: Routes = [ }) export class AppRoutingModule { } + +export type RouteData = { title: string; }; diff --git a/frontend/src/app/app.component.html b/frontend/src/app/app.component.html index 77e14f3..fce5bb9 100644 --- a/frontend/src/app/app.component.html +++ b/frontend/src/app/app.component.html @@ -19,7 +19,7 @@ *ngIf="isHandset$ | async"> menu - Szakdolgozat + {{ pageTitle }} {{ loginService.user.name }} diff --git a/frontend/src/app/app.component.ts b/frontend/src/app/app.component.ts index 771c2c7..385383a 100644 --- a/frontend/src/app/app.component.ts +++ b/frontend/src/app/app.component.ts @@ -1,11 +1,13 @@ -import {Component, OnInit} from '@angular/core'; -import {BreakpointObserver, Breakpoints} from '@angular/cdk/layout'; -import {Observable} from 'rxjs'; -import {map, shareReplay} from 'rxjs/operators'; -import {LoginService} from './auth/login.service'; -import {Router} from '@angular/router'; -import {ApiService} from './api.service'; -import {UserRole} from './model/user.model'; +import { Component, OnInit } from '@angular/core'; +import { BreakpointObserver, Breakpoints } from '@angular/cdk/layout'; +import { Observable } from 'rxjs'; +import { filter, map, shareReplay } from 'rxjs/operators'; +import { LoginService } from './auth/login.service'; +import { ActivatedRoute, ActivatedRouteSnapshot, NavigationEnd, Route, Router, Routes } from '@angular/router'; +import { ApiService } from './api.service'; +import { UserRole } from './model/user.model'; +import { RouteData } from './app-routing.module'; +import { Title } from '@angular/platform-browser'; @Component({ selector: 'app-root', @@ -21,14 +23,89 @@ export class AppComponent implements OnInit { ); menu: MenuItem[] = [ - {path: 'users', title: 'Felhasználók', requiredRole: 'admin'} + {path: 'users', requiredRole: 'admin'} ]; + routeSegments: RouteSegment[]; + + pageTitle: string; + constructor(private breakpointObserver: BreakpointObserver, public loginService: LoginService, private api: ApiService, - private router: Router, private login: LoginService) { + private router: Router, private login: LoginService, private activeRoute: ActivatedRoute, + private title: Title) { } ngOnInit(): void { + for (const item of this.menu) { + const res = this.getRoutes([{path: item.path, routes: this.router.config}]); + if (res.length) { + const data = res[0].currentRoute.data as RouteData; + item.title = data.title; + } else { + item.title = 'NOTFOUND'; + } + } + this.setPageTitle(); + } + + getRoutes(data: { path: string, routes: Routes }[]): { routes: Routes, path: string, currentRoute: Route }[] { + for (const datum of data) { + const path = datum.path; + const res = datum.routes.filter(route => path.startsWith(route.path)).map(route => { + return { + currentRoute: route, + routes: route.children ?? [], + path: path.substring(route.path.length).replace(/^\//, '') + }; + }); + if (!res.length) { + continue; + } + const ret = this.getRoutes(res); + if (!ret.length && res.length && res[0].path.length === 0) { // Ha a következő már üres, akkor leellenőrizzük, hogy megtaláltuk-e + return res; + } else { // Ha megtaláltuk a megoldást, visszaadjuk végig + const results = ret.filter(obj => obj.path.length === 0); + if (results.length) { + return results; + } + } + } + return []; + } + + getRouteSegments(snapshot: ActivatedRouteSnapshot): RouteSegment[] { + let routeParts: RouteSegment[] = []; + if (snapshot) { + if (snapshot.firstChild) { + routeParts = routeParts.concat(this.getRouteSegments(snapshot.firstChild)); + } + if (!snapshot.data) { + return routeParts; + } + const data = snapshot.data as RouteData; + if (data.title && snapshot.url.length) { + routeParts.push({ + title: data.title, + url: snapshot.url[0].path + }); + } + } + return routeParts; + } + + setPageTitle(): void { + this.router.events.pipe(filter(event => event instanceof NavigationEnd)).subscribe(() => { + const routeParts = this.getRouteSegments(this.activeRoute.snapshot); + if (!routeParts.length) { + this.pageTitle = 'Szakdolgozat'; + return this.title.setTitle('Szakdolgozat'); + } + let pageTitle = routeParts.reverse().map(part => part.title).reduce((partA, partI) => `${partA} > ${partI}`); + this.pageTitle = pageTitle; + pageTitle += ` | Szakdolgozat`; + this.title.setTitle(pageTitle); + }); } async logout(): Promise { @@ -41,4 +118,5 @@ export class AppComponent implements OnInit { } } -type MenuItem = { path: string, title: string, requiredRole: UserRole | 'admin' }; +type MenuItem = { path: string, requiredRole: UserRole | 'admin', title?: string }; +type RouteSegment = { title: string, url: string }; diff --git a/frontend/src/app/auth/auth.module.ts b/frontend/src/app/auth/auth.module.ts index d221391..318e4f5 100644 --- a/frontend/src/app/auth/auth.module.ts +++ b/frontend/src/app/auth/auth.module.ts @@ -7,10 +7,11 @@ import { MatInputModule } from '@angular/material/input'; import { MatButtonModule } from '@angular/material/button'; import { MatFormFieldModule } from '@angular/material/form-field'; import { RouterModule, Routes } from '@angular/router'; +import { RouteData } from '../app-routing.module'; const routes: Routes = [ - {path: 'login', component: LoginComponent}, - {path: 'register', component: RegisterComponent} + {path: 'login', component: LoginComponent, data: {title: 'Bejelentkezés'} as RouteData}, + {path: 'register', component: RegisterComponent, data: {title: 'Regisztráció'} as RouteData} ]; @NgModule({ diff --git a/frontend/src/app/users/users.module.ts b/frontend/src/app/users/users.module.ts index 26abf32..f453eff 100644 --- a/frontend/src/app/users/users.module.ts +++ b/frontend/src/app/users/users.module.ts @@ -2,9 +2,10 @@ import { NgModule } from '@angular/core'; import { CommonModule } from '@angular/common'; import { UserListComponent } from './user-list/user-list.component'; import { RouterModule, Routes } from '@angular/router'; +import { RouteData } from '../app-routing.module'; const routes: Routes = [ - {path: '', component: UserListComponent} + {path: '', component: UserListComponent, data: {title: 'Felhasználók'} as RouteData} ]; @NgModule({