From 079449d980db5623e3d41c3255b03de87b9a9ff2 Mon Sep 17 00:00:00 2001 From: NorbiPeti Date: Sat, 5 Feb 2022 19:34:36 +0100 Subject: [PATCH] Add subject list, edit/create pages --- frontend/src/app/app-routing.module.ts | 5 ++++ frontend/src/app/app.component.ts | 3 ++- frontend/src/app/model/subject.model.ts | 6 +++++ frontend/src/app/model/user.model.ts | 3 ++- .../shared-components/edit/edit.component.ts | 13 +++++++--- .../subject-edit/subject-edit.component.css | 0 .../subject-edit/subject-edit.component.html | 4 +++ .../subject-edit.component.spec.ts | 25 +++++++++++++++++++ .../subject-edit/subject-edit.component.ts | 17 +++++++++++++ .../subject-list/subject-list.component.css | 0 .../subject-list/subject-list.component.html | 4 +++ .../subject-list.component.spec.ts | 25 +++++++++++++++++++ .../subject-list/subject-list.component.ts | 17 +++++++++++++ frontend/src/app/subjects/subjects.module.ts | 23 +++++++++++++++++ .../users/user-edit/user-edit.component.html | 2 +- .../users/user-edit/user-edit.component.ts | 2 ++ 16 files changed, 142 insertions(+), 7 deletions(-) create mode 100644 frontend/src/app/model/subject.model.ts create mode 100644 frontend/src/app/subjects/subject-edit/subject-edit.component.css create mode 100644 frontend/src/app/subjects/subject-edit/subject-edit.component.html create mode 100644 frontend/src/app/subjects/subject-edit/subject-edit.component.spec.ts create mode 100644 frontend/src/app/subjects/subject-edit/subject-edit.component.ts create mode 100644 frontend/src/app/subjects/subject-list/subject-list.component.css create mode 100644 frontend/src/app/subjects/subject-list/subject-list.component.html create mode 100644 frontend/src/app/subjects/subject-list/subject-list.component.spec.ts create mode 100644 frontend/src/app/subjects/subject-list/subject-list.component.ts create mode 100644 frontend/src/app/subjects/subjects.module.ts diff --git a/frontend/src/app/app-routing.module.ts b/frontend/src/app/app-routing.module.ts index cc27147..133b02c 100644 --- a/frontend/src/app/app-routing.module.ts +++ b/frontend/src/app/app-routing.module.ts @@ -17,6 +17,11 @@ const routes: Routes = [ path: 'users', loadChildren: async () => (await import('./users/users.module')).UsersModule, data: {title: 'Felhasználók'} as RouteData + }, + { + path: 'subjects', + loadChildren: async () => (await import('./subjects/subjects.module')).SubjectsModule, + data: {title: 'Tárgyak'} } ] } diff --git a/frontend/src/app/app.component.ts b/frontend/src/app/app.component.ts index 385383a..291dc10 100644 --- a/frontend/src/app/app.component.ts +++ b/frontend/src/app/app.component.ts @@ -23,7 +23,8 @@ export class AppComponent implements OnInit { ); menu: MenuItem[] = [ - {path: 'users', requiredRole: 'admin'} + {path: 'users', requiredRole: 'admin'}, + {path: 'subjects', requiredRole: 'admin'} ]; routeSegments: RouteSegment[]; diff --git a/frontend/src/app/model/subject.model.ts b/frontend/src/app/model/subject.model.ts new file mode 100644 index 0000000..f386385 --- /dev/null +++ b/frontend/src/app/model/subject.model.ts @@ -0,0 +1,6 @@ +import { Model } from './model'; + +export class Subject extends Model { + name: string; + description: string; +} diff --git a/frontend/src/app/model/user.model.ts b/frontend/src/app/model/user.model.ts index 4f5d31c..9576ff0 100644 --- a/frontend/src/app/model/user.model.ts +++ b/frontend/src/app/model/user.model.ts @@ -2,7 +2,8 @@ import { Model } from './model'; export class User extends Model { name: string; - isAdmin: boolean; + email: string; + isAdmin = false; } export type UserRole = 'teacher' | 'student'; diff --git a/frontend/src/app/shared-components/edit/edit.component.ts b/frontend/src/app/shared-components/edit/edit.component.ts index 3997639..0cea344 100644 --- a/frontend/src/app/shared-components/edit/edit.component.ts +++ b/frontend/src/app/shared-components/edit/edit.component.ts @@ -1,4 +1,4 @@ -import { Component, Input, OnInit } from '@angular/core'; +import { Component, Input, OnInit, Type } from '@angular/core'; import { ApiService } from '../../api.service'; import { ActivatedRoute, Router } from '@angular/router'; import { Model } from '../../model/model'; @@ -12,10 +12,12 @@ import { FormBuilder, FormControl, FormGroup } from '@angular/forms'; export class EditComponent implements OnInit { item?: T; + creating = false; isLoading = true; @Input() apiPath: string; - @Input() fields: { title: string, name: string }[]; + @Input() fields: { title: string, name: keyof T }[]; + @Input() itemType: Type; formGroup: FormGroup; constructor(private api: ApiService, private router: Router, private fb: FormBuilder, private route: ActivatedRoute) { @@ -31,6 +33,9 @@ export class EditComponent implements OnInit { this.formGroup = this.fb.group(this.fields.reduce((pv, cv) => Object.assign(pv, {[cv.name]: new FormControl()}), {})); if (this.item) { this.formGroup.patchValue(this.item); + } else { + this.item = new this.itemType(); + this.creating = true; } this.isLoading = false; } @@ -38,14 +43,14 @@ export class EditComponent implements OnInit { async submit(): Promise { this.isLoading = true; try { - if (this.item) { + if (this.item && !this.creating) { await this.api.request('patch', this.apiPath + '/' + this.item.id, this.formGroup.value); } else { await this.api.request('post', this.apiPath, this.formGroup.value); } await this.router.navigateByUrl(this.router.url.substring(0, this.router.url.lastIndexOf('/'))); } catch (e) { - alert(e); + alert(e.message); } this.isLoading = false; } diff --git a/frontend/src/app/subjects/subject-edit/subject-edit.component.css b/frontend/src/app/subjects/subject-edit/subject-edit.component.css new file mode 100644 index 0000000..e69de29 diff --git a/frontend/src/app/subjects/subject-edit/subject-edit.component.html b/frontend/src/app/subjects/subject-edit/subject-edit.component.html new file mode 100644 index 0000000..5c4a466 --- /dev/null +++ b/frontend/src/app/subjects/subject-edit/subject-edit.component.html @@ -0,0 +1,4 @@ + diff --git a/frontend/src/app/subjects/subject-edit/subject-edit.component.spec.ts b/frontend/src/app/subjects/subject-edit/subject-edit.component.spec.ts new file mode 100644 index 0000000..19fbfc0 --- /dev/null +++ b/frontend/src/app/subjects/subject-edit/subject-edit.component.spec.ts @@ -0,0 +1,25 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { SubjectEditComponent } from './subject-edit.component'; + +describe('SubjectEditComponent', () => { + let component: SubjectEditComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [ SubjectEditComponent ] + }) + .compileComponents(); + }); + + beforeEach(() => { + fixture = TestBed.createComponent(SubjectEditComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/frontend/src/app/subjects/subject-edit/subject-edit.component.ts b/frontend/src/app/subjects/subject-edit/subject-edit.component.ts new file mode 100644 index 0000000..7f78116 --- /dev/null +++ b/frontend/src/app/subjects/subject-edit/subject-edit.component.ts @@ -0,0 +1,17 @@ +import { Component, OnInit } from '@angular/core'; +import { Subject } from '../../model/subject.model'; + +@Component({ + selector: 'app-subject-edit', + templateUrl: './subject-edit.component.html', + styleUrls: ['./subject-edit.component.css'] +}) +export class SubjectEditComponent implements OnInit { + itemType = Subject; + + constructor() { } + + ngOnInit(): void { + } + +} diff --git a/frontend/src/app/subjects/subject-list/subject-list.component.css b/frontend/src/app/subjects/subject-list/subject-list.component.css new file mode 100644 index 0000000..e69de29 diff --git a/frontend/src/app/subjects/subject-list/subject-list.component.html b/frontend/src/app/subjects/subject-list/subject-list.component.html new file mode 100644 index 0000000..b09c1cf --- /dev/null +++ b/frontend/src/app/subjects/subject-list/subject-list.component.html @@ -0,0 +1,4 @@ + diff --git a/frontend/src/app/subjects/subject-list/subject-list.component.spec.ts b/frontend/src/app/subjects/subject-list/subject-list.component.spec.ts new file mode 100644 index 0000000..e19421d --- /dev/null +++ b/frontend/src/app/subjects/subject-list/subject-list.component.spec.ts @@ -0,0 +1,25 @@ +import { ComponentFixture, TestBed } from '@angular/core/testing'; + +import { SubjectListComponent } from './subject-list.component'; + +describe('SubjectListComponent', () => { + let component: SubjectListComponent; + let fixture: ComponentFixture; + + beforeEach(async () => { + await TestBed.configureTestingModule({ + declarations: [ SubjectListComponent ] + }) + .compileComponents(); + }); + + beforeEach(() => { + fixture = TestBed.createComponent(SubjectListComponent); + component = fixture.componentInstance; + fixture.detectChanges(); + }); + + it('should create', () => { + expect(component).toBeTruthy(); + }); +}); diff --git a/frontend/src/app/subjects/subject-list/subject-list.component.ts b/frontend/src/app/subjects/subject-list/subject-list.component.ts new file mode 100644 index 0000000..19df4c6 --- /dev/null +++ b/frontend/src/app/subjects/subject-list/subject-list.component.ts @@ -0,0 +1,17 @@ +import { Component, OnInit } from '@angular/core'; +import { Subject } from '../../model/subject.model'; + +@Component({ + selector: 'app-subject-list', + templateUrl: './subject-list.component.html', + styleUrls: ['./subject-list.component.css'] +}) +export class SubjectListComponent implements OnInit { + itemType = Subject; + + constructor() { } + + ngOnInit(): void { + } + +} diff --git a/frontend/src/app/subjects/subjects.module.ts b/frontend/src/app/subjects/subjects.module.ts new file mode 100644 index 0000000..7d3afc4 --- /dev/null +++ b/frontend/src/app/subjects/subjects.module.ts @@ -0,0 +1,23 @@ +import { NgModule } from '@angular/core'; +import { CommonModule } from '@angular/common'; +import { SubjectListComponent } from './subject-list/subject-list.component'; +import { SubjectEditComponent } from './subject-edit/subject-edit.component'; +import { SharedComponentsModule } from '../shared-components/shared-components.module'; +import { RouterModule, Routes } from '@angular/router'; +import { RouteData } from '../app-routing.module'; + +const routes: Routes = [ + {path: '', component: SubjectListComponent, data: {title: 'Tárgyak'} as RouteData}, + {path: ':id', component: SubjectEditComponent, data: {title: 'Szerkesztés'}} +]; + +@NgModule({ + declarations: [SubjectListComponent, SubjectEditComponent], + imports: [ + CommonModule, + SharedComponentsModule, + RouterModule.forChild(routes) + ] +}) +export class SubjectsModule { +} diff --git a/frontend/src/app/users/user-edit/user-edit.component.html b/frontend/src/app/users/user-edit/user-edit.component.html index 41d922f..0f047e4 100644 --- a/frontend/src/app/users/user-edit/user-edit.component.html +++ b/frontend/src/app/users/user-edit/user-edit.component.html @@ -1,4 +1,4 @@ -