Moved auth and new user list component to separate modules
This commit is contained in:
parent
11766499bc
commit
bd07e1a306
22 changed files with 144 additions and 37 deletions
|
@ -1,7 +1,7 @@
|
||||||
import {Injectable} from '@angular/core';
|
import {Injectable} from '@angular/core';
|
||||||
import {HttpClient} from '@angular/common/http';
|
import {HttpClient} from '@angular/common/http';
|
||||||
import {environment} from '../environments/environment';
|
import {environment} from '../environments/environment';
|
||||||
import {LoginService} from './shared/login.service';
|
import {LoginService} from './auth/login.service';
|
||||||
|
|
||||||
@Injectable({
|
@Injectable({
|
||||||
providedIn: 'root'
|
providedIn: 'root'
|
||||||
|
|
|
@ -1,11 +1,21 @@
|
||||||
import {NgModule} from '@angular/core';
|
import { NgModule } from '@angular/core';
|
||||||
import {RouterModule, Routes} from '@angular/router';
|
import { RouterModule, Routes } from '@angular/router';
|
||||||
import {LoginComponent} from './login/login.component';
|
import { AuthCheck } from './auth-check';
|
||||||
import {RegisterComponent} from './register/register.component';
|
|
||||||
|
|
||||||
const routes: Routes = [
|
const routes: Routes = [
|
||||||
{path: 'login', component: LoginComponent},
|
{
|
||||||
{path: 'register', component: RegisterComponent}
|
path: '',
|
||||||
|
children: [
|
||||||
|
{path: 'auth', loadChildren: async () => (await import('./auth/auth.module')).AuthModule}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: '',
|
||||||
|
canActivate: [AuthCheck],
|
||||||
|
children: [
|
||||||
|
{path: 'users', loadChildren: async () => (await import('./users/users.module')).UsersModule}
|
||||||
|
]
|
||||||
|
}
|
||||||
];
|
];
|
||||||
|
|
||||||
@NgModule({
|
@NgModule({
|
||||||
|
|
|
@ -26,8 +26,8 @@
|
||||||
<a mat-button (click)="logout()">Kijelentkezés</a>
|
<a mat-button (click)="logout()">Kijelentkezés</a>
|
||||||
</span>
|
</span>
|
||||||
<span *ngIf="!loginService.token">
|
<span *ngIf="!loginService.token">
|
||||||
<a mat-button routerLink="/register">Regisztráció</a>
|
<a mat-button routerLink="/auth/register">Regisztráció</a>
|
||||||
<a mat-button routerLink="/login">
|
<a mat-button routerLink="/auth/login">
|
||||||
Bejelentkezés
|
Bejelentkezés
|
||||||
<mat-icon aria-hidden="false" aria-label="Bejelentkezés">login</mat-icon>
|
<mat-icon aria-hidden="false" aria-label="Bejelentkezés">login</mat-icon>
|
||||||
</a>
|
</a>
|
||||||
|
|
|
@ -2,7 +2,7 @@ import {Component, OnInit} from '@angular/core';
|
||||||
import {BreakpointObserver, Breakpoints} from '@angular/cdk/layout';
|
import {BreakpointObserver, Breakpoints} from '@angular/cdk/layout';
|
||||||
import {Observable} from 'rxjs';
|
import {Observable} from 'rxjs';
|
||||||
import {map, shareReplay} from 'rxjs/operators';
|
import {map, shareReplay} from 'rxjs/operators';
|
||||||
import {LoginService} from './shared/login.service';
|
import {LoginService} from './auth/login.service';
|
||||||
import {Router} from '@angular/router';
|
import {Router} from '@angular/router';
|
||||||
import {ApiService} from './api.service';
|
import {ApiService} from './api.service';
|
||||||
import {UserRole} from './model/user.model';
|
import {UserRole} from './model/user.model';
|
||||||
|
|
|
@ -1,29 +1,26 @@
|
||||||
import {BrowserModule} from '@angular/platform-browser';
|
import { BrowserModule } from '@angular/platform-browser';
|
||||||
import {NgModule} from '@angular/core';
|
import { NgModule } from '@angular/core';
|
||||||
|
|
||||||
import {AppComponent} from './app.component';
|
import { AppComponent } from './app.component';
|
||||||
import {LoginComponent} from './login/login.component';
|
import { AppRoutingModule } from './app-routing.module';
|
||||||
import {AppRoutingModule} from './app-routing.module';
|
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
|
||||||
import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
|
import { MatSliderModule } from '@angular/material/slider';
|
||||||
import {MatSliderModule} from '@angular/material/slider';
|
import { LayoutModule } from '@angular/cdk/layout';
|
||||||
import {LayoutModule} from '@angular/cdk/layout';
|
import { MatToolbarModule } from '@angular/material/toolbar';
|
||||||
import {MatToolbarModule} from '@angular/material/toolbar';
|
import { MatButtonModule } from '@angular/material/button';
|
||||||
import {MatButtonModule} from '@angular/material/button';
|
import { MatSidenavModule } from '@angular/material/sidenav';
|
||||||
import {MatSidenavModule} from '@angular/material/sidenav';
|
import { MatIconModule } from '@angular/material/icon';
|
||||||
import {MatIconModule} from '@angular/material/icon';
|
import { MatListModule } from '@angular/material/list';
|
||||||
import {MatListModule} from '@angular/material/list';
|
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
|
||||||
import {FormsModule, ReactiveFormsModule} from '@angular/forms';
|
import { MatFormFieldModule } from '@angular/material/form-field';
|
||||||
import {MatFormFieldModule} from '@angular/material/form-field';
|
import { MatInputModule } from '@angular/material/input';
|
||||||
import {MatInputModule} from '@angular/material/input';
|
import { LoginService } from './auth/login.service';
|
||||||
import {RegisterComponent} from './register/register.component';
|
import { HttpClientModule } from '@angular/common/http';
|
||||||
import {LoginService} from './shared/login.service';
|
import { AuthCheck } from './auth-check';
|
||||||
import {HttpClientModule} from '@angular/common/http';
|
|
||||||
|
|
||||||
@NgModule({
|
@NgModule({
|
||||||
declarations: [
|
declarations: [
|
||||||
AppComponent,
|
AppComponent
|
||||||
LoginComponent,
|
|
||||||
RegisterComponent
|
|
||||||
],
|
],
|
||||||
imports: [
|
imports: [
|
||||||
BrowserModule,
|
BrowserModule,
|
||||||
|
@ -43,7 +40,8 @@ import {HttpClientModule} from '@angular/common/http';
|
||||||
HttpClientModule
|
HttpClientModule
|
||||||
],
|
],
|
||||||
providers: [
|
providers: [
|
||||||
LoginService
|
LoginService,
|
||||||
|
AuthCheck
|
||||||
],
|
],
|
||||||
bootstrap: [AppComponent]
|
bootstrap: [AppComponent]
|
||||||
})
|
})
|
||||||
|
|
13
frontend/src/app/auth-check.ts
Normal file
13
frontend/src/app/auth-check.ts
Normal file
|
@ -0,0 +1,13 @@
|
||||||
|
import { ActivatedRouteSnapshot, CanActivate, RouterStateSnapshot } from '@angular/router';
|
||||||
|
import { Injectable } from '@angular/core';
|
||||||
|
import { LoginService } from './auth/login.service';
|
||||||
|
|
||||||
|
@Injectable()
|
||||||
|
export class AuthCheck implements CanActivate {
|
||||||
|
constructor(private userService: LoginService) {
|
||||||
|
}
|
||||||
|
|
||||||
|
canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
|
||||||
|
return this.userService.token && this.userService.user && true;
|
||||||
|
}
|
||||||
|
}
|
32
frontend/src/app/auth/auth.module.ts
Normal file
32
frontend/src/app/auth/auth.module.ts
Normal file
|
@ -0,0 +1,32 @@
|
||||||
|
import { NgModule } from '@angular/core';
|
||||||
|
import { CommonModule } from '@angular/common';
|
||||||
|
import { LoginComponent } from './login/login.component';
|
||||||
|
import { RegisterComponent } from './register/register.component';
|
||||||
|
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
|
||||||
|
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';
|
||||||
|
|
||||||
|
const routes: Routes = [
|
||||||
|
{path: 'login', component: LoginComponent},
|
||||||
|
{path: 'register', component: RegisterComponent}
|
||||||
|
];
|
||||||
|
|
||||||
|
@NgModule({
|
||||||
|
declarations: [
|
||||||
|
LoginComponent,
|
||||||
|
RegisterComponent
|
||||||
|
],
|
||||||
|
imports: [
|
||||||
|
CommonModule,
|
||||||
|
ReactiveFormsModule,
|
||||||
|
MatInputModule,
|
||||||
|
MatButtonModule,
|
||||||
|
MatFormFieldModule,
|
||||||
|
FormsModule,
|
||||||
|
RouterModule.forChild(routes)
|
||||||
|
]
|
||||||
|
})
|
||||||
|
export class AuthModule {
|
||||||
|
}
|
|
@ -1,7 +1,7 @@
|
||||||
import {Component, OnInit} from '@angular/core';
|
import {Component, OnInit} from '@angular/core';
|
||||||
import {Router} from '@angular/router';
|
import {Router} from '@angular/router';
|
||||||
import {LoginService} from '../shared/login.service';
|
import {LoginService} from '../login.service';
|
||||||
import {FormErrorStateMatcher} from '../utility/form-error-state-matcher';
|
import {FormErrorStateMatcher} from '../../utility/form-error-state-matcher';
|
||||||
import {FormControl} from '@angular/forms';
|
import {FormControl} from '@angular/forms';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
|
@ -1,8 +1,8 @@
|
||||||
import {Component, OnInit} from '@angular/core';
|
import {Component, OnInit} from '@angular/core';
|
||||||
import {AbstractControl, FormControl, ValidationErrors, Validators} from '@angular/forms';
|
import {AbstractControl, FormControl, ValidationErrors, Validators} from '@angular/forms';
|
||||||
import {LoginService} from '../shared/login.service';
|
import {LoginService} from '../login.service';
|
||||||
import {Router} from '@angular/router';
|
import {Router} from '@angular/router';
|
||||||
import {FormErrorStateMatcher} from '../utility/form-error-state-matcher';
|
import {FormErrorStateMatcher} from '../../utility/form-error-state-matcher';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'app-register',
|
selector: 'app-register',
|
0
frontend/src/app/users/user-list/user-list.component.css
Normal file
0
frontend/src/app/users/user-list/user-list.component.css
Normal file
|
@ -0,0 +1 @@
|
||||||
|
<p>user-list works!</p>
|
25
frontend/src/app/users/user-list/user-list.component.spec.ts
Normal file
25
frontend/src/app/users/user-list/user-list.component.spec.ts
Normal file
|
@ -0,0 +1,25 @@
|
||||||
|
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||||
|
|
||||||
|
import { UserListComponent } from './user-list.component';
|
||||||
|
|
||||||
|
describe('UserListComponent', () => {
|
||||||
|
let component: UserListComponent;
|
||||||
|
let fixture: ComponentFixture<UserListComponent>;
|
||||||
|
|
||||||
|
beforeEach(async () => {
|
||||||
|
await TestBed.configureTestingModule({
|
||||||
|
declarations: [ UserListComponent ]
|
||||||
|
})
|
||||||
|
.compileComponents();
|
||||||
|
});
|
||||||
|
|
||||||
|
beforeEach(() => {
|
||||||
|
fixture = TestBed.createComponent(UserListComponent);
|
||||||
|
component = fixture.componentInstance;
|
||||||
|
fixture.detectChanges();
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should create', () => {
|
||||||
|
expect(component).toBeTruthy();
|
||||||
|
});
|
||||||
|
});
|
15
frontend/src/app/users/user-list/user-list.component.ts
Normal file
15
frontend/src/app/users/user-list/user-list.component.ts
Normal file
|
@ -0,0 +1,15 @@
|
||||||
|
import { Component, OnInit } from '@angular/core';
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'app-user-list',
|
||||||
|
templateUrl: './user-list.component.html',
|
||||||
|
styleUrls: ['./user-list.component.css']
|
||||||
|
})
|
||||||
|
export class UserListComponent implements OnInit {
|
||||||
|
|
||||||
|
constructor() { }
|
||||||
|
|
||||||
|
ngOnInit(): void {
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
13
frontend/src/app/users/users.module.ts
Normal file
13
frontend/src/app/users/users.module.ts
Normal file
|
@ -0,0 +1,13 @@
|
||||||
|
import { NgModule } from '@angular/core';
|
||||||
|
import { CommonModule } from '@angular/common';
|
||||||
|
import { UserListComponent } from './user-list/user-list.component';
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
@NgModule({
|
||||||
|
declarations: [UserListComponent],
|
||||||
|
imports: [
|
||||||
|
CommonModule
|
||||||
|
]
|
||||||
|
})
|
||||||
|
export class UsersModule { }
|
Loading…
Reference in a new issue