Add feature for adding students on-the-fly
This commit is contained in:
parent
66ef196617
commit
1a0bb96f69
|
@ -7,34 +7,36 @@
|
||||||
<label id="student-edit-lastname-label" for="student-edit-lastname-input">Nachname</label>
|
<label id="student-edit-lastname-label" for="student-edit-lastname-input">Nachname</label>
|
||||||
<input id="student-edit-lastname-input" name="student-edit-lastname-input" type="text" [(ngModel)]="model.lastname" />
|
<input id="student-edit-lastname-input" name="student-edit-lastname-input" type="text" [(ngModel)]="model.lastname" />
|
||||||
|
|
||||||
<label id="student-edit-birthday-label" for="student-edit-birthday-input">Geburtsdatum</label>
|
<ng-container *ngIf="!simple">
|
||||||
<input id="student-edit-birthday-input" name="student-edit-birthday-input" type="date" [(ngModel)]="model.birthday" />
|
<label id="student-edit-birthday-label" for="student-edit-birthday-input">Geburtsdatum</label>
|
||||||
|
<input id="student-edit-birthday-input" name="student-edit-birthday-input" type="date" [(ngModel)]="model.birthday" />
|
||||||
|
|
||||||
<label id="student-edit-gender-label" for="student-edit-gender-input">Geschlecht</label>
|
<label id="student-edit-gender-label" for="student-edit-gender-input">Geschlecht</label>
|
||||||
<select id="student-edit-gender-input" name="student-edit-gender-input" [(ngModel)]="model.gender" >
|
<select id="student-edit-gender-input" name="student-edit-gender-input" [(ngModel)]="model.gender" >
|
||||||
<option [value]="gender.id" *ngFor="let gender of genders">{{gender.text}}</option>
|
<option [value]="gender.id" *ngFor="let gender of genders">{{gender.text}}</option>
|
||||||
</select>
|
</select>
|
||||||
|
|
||||||
<label id="student-edit-street-label" for="student-edit-street-input">Strasse</label>
|
<label id="student-edit-street-label" for="student-edit-street-input">Strasse</label>
|
||||||
<input id="student-edit-street-input" name="student-edit-street-input" type="text" [(ngModel)]="model.street" />
|
<input id="student-edit-street-input" name="student-edit-street-input" type="text" [(ngModel)]="model.street" />
|
||||||
|
|
||||||
<label id="student-edit-house-label" for="student-edit-house-input">Hausnummer</label>
|
<label id="student-edit-house-label" for="student-edit-house-input">Hausnummer</label>
|
||||||
<input id="student-edit-house-input" name="student-edit-house-input" type="text" [(ngModel)]="model.house" />
|
<input id="student-edit-house-input" name="student-edit-house-input" type="text" [(ngModel)]="model.house" />
|
||||||
|
|
||||||
<label id="student-edit-housesuffix-label" for="student-edit-housesuffix-input">Suffix</label>
|
<label id="student-edit-housesuffix-label" for="student-edit-housesuffix-input">Suffix</label>
|
||||||
<input id="student-edit-housesuffix-input" name="student-edit-housesuffix-input" type="text" [(ngModel)]="model.house_suffix" />
|
<input id="student-edit-housesuffix-input" name="student-edit-housesuffix-input" type="text" [(ngModel)]="model.house_suffix" />
|
||||||
|
|
||||||
<label id="student-edit-zip-label" for="student-edit-zip-input">PLZ</label>
|
<label id="student-edit-zip-label" for="student-edit-zip-input">PLZ</label>
|
||||||
<input id="student-edit-zip-input" name="student-edit-zip-input" type="text" [(ngModel)]="model.zip" />
|
<input id="student-edit-zip-input" name="student-edit-zip-input" type="text" [(ngModel)]="model.zip" />
|
||||||
|
|
||||||
<label id="student-edit-city-label" for="student-edit-city-input">Stadt</label>
|
<label id="student-edit-city-label" for="student-edit-city-input">Stadt</label>
|
||||||
<input id="student-edit-city-input" name="student-edit-city-input" type="text" [(ngModel)]="model.city" />
|
<input id="student-edit-city-input" name="student-edit-city-input" type="text" [(ngModel)]="model.city" />
|
||||||
|
|
||||||
<label id="student-edit-phone-label" for="student-edit-phone-input">Telefon</label>
|
<label id="student-edit-phone-label" for="student-edit-phone-input">Telefon</label>
|
||||||
<input id="student-edit-phone-input" name="student-edit-phone-input" type="text" [(ngModel)]="model.phone" />
|
<input id="student-edit-phone-input" name="student-edit-phone-input" type="text" [(ngModel)]="model.phone" />
|
||||||
|
|
||||||
<label id="student-edit-email-label" for="student-edit-email-input">E-Mail</label>
|
<label id="student-edit-email-label" for="student-edit-email-input">E-Mail</label>
|
||||||
<input id="student-edit-email-input" name="student-edit-email-input" type="text" [(ngModel)]="model.email" />
|
<input id="student-edit-email-input" name="student-edit-email-input" type="text" [(ngModel)]="model.email" />
|
||||||
|
</ng-container>
|
||||||
</form>
|
</form>
|
||||||
<div style="text-align:center;">
|
<div style="text-align:center;">
|
||||||
<button class="button-save" (click)="save()">Save</button>
|
<button class="button-save" (click)="save()">Save</button>
|
||||||
|
|
|
@ -12,6 +12,9 @@ export class StudentEditComponent implements OnInit {
|
||||||
@Input()
|
@Input()
|
||||||
public student?: Student = undefined;
|
public student?: Student = undefined;
|
||||||
|
|
||||||
|
@Input()
|
||||||
|
public simple: boolean = false;
|
||||||
|
|
||||||
@Output()
|
@Output()
|
||||||
public closing = new EventEmitter();
|
public closing = new EventEmitter();
|
||||||
|
|
||||||
|
@ -36,7 +39,7 @@ export class StudentEditComponent implements OnInit {
|
||||||
|
|
||||||
public save(): void {
|
public save(): void {
|
||||||
if(this.student){
|
if(this.student){
|
||||||
this.studentsService.set(this.model).subscribe(_ => this.closing.emit());
|
this.studentsService.set(this.sanitize(this.model)).subscribe(_ => this.closing.emit());
|
||||||
} else {
|
} else {
|
||||||
this.closing.emit();
|
this.closing.emit();
|
||||||
}
|
}
|
||||||
|
@ -46,4 +49,20 @@ export class StudentEditComponent implements OnInit {
|
||||||
return this.student ? 'show' : 'hidden';
|
return this.student ? 'show' : 'hidden';
|
||||||
}
|
}
|
||||||
|
|
||||||
|
private sanitize(student: Student): Student {
|
||||||
|
if(student){
|
||||||
|
student.firstname ??= '';
|
||||||
|
student.lastname ??= '';
|
||||||
|
student.gender ??= 0;
|
||||||
|
student.street ??= '';
|
||||||
|
student.house ??= 0;
|
||||||
|
student.house_suffix ??= '';
|
||||||
|
student.zip ??= '';
|
||||||
|
student.city ??= '';
|
||||||
|
student.phone ??= '';
|
||||||
|
student.email ??= '';
|
||||||
|
}
|
||||||
|
|
||||||
|
return student;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -6,6 +6,7 @@
|
||||||
<div class="grid-item">
|
<div class="grid-item">
|
||||||
<h1>{{courseVisit?.name}}</h1>
|
<h1>{{courseVisit?.name}}</h1>
|
||||||
<h2>{{courseVisit?.date | date: 'dd.MM.yyyy'}}, {{courseVisit?.begin}} - {{courseVisit?.end}}</h2>
|
<h2>{{courseVisit?.date | date: 'dd.MM.yyyy'}}, {{courseVisit?.begin}} - {{courseVisit?.end}}</h2>
|
||||||
|
<button class="button-add" (click)="add()">Hinzufügen</button>
|
||||||
</div>
|
</div>
|
||||||
<div class="grid-item">
|
<div class="grid-item">
|
||||||
</div>
|
</div>
|
||||||
|
@ -35,3 +36,5 @@
|
||||||
<div class="grid-item">
|
<div class="grid-item">
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<li-student-edit [student]="addedStudent" (closing)="commit()" [simple]="true"></li-student-edit>
|
|
@ -21,6 +21,15 @@ table {
|
||||||
margin: auto;
|
margin: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
button {
|
||||||
|
color: white;
|
||||||
|
font-size: 1.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
button.button-add {
|
||||||
|
background-color: #411ccc;
|
||||||
|
}
|
||||||
|
|
||||||
a:link,
|
a:link,
|
||||||
a:visited,
|
a:visited,
|
||||||
a:active {
|
a:active {
|
||||||
|
|
|
@ -1,8 +1,12 @@
|
||||||
|
import { formatDate } from '@angular/common';
|
||||||
import { Component, OnInit } from '@angular/core';
|
import { Component, OnInit } from '@angular/core';
|
||||||
import { MatTableDataSource } from '@angular/material/table';
|
import { MatTableDataSource } from '@angular/material/table';
|
||||||
import { CourseVisit } from 'src/app/models/course-visit';
|
import { CourseVisit } from 'src/app/models/course-visit';
|
||||||
|
import { Student } from 'src/app/models/student';
|
||||||
|
import { StudentEnrollment } from 'src/app/models/student-enrollment';
|
||||||
import { StudentVisit } from 'src/app/models/student-visit';
|
import { StudentVisit } from 'src/app/models/student-visit';
|
||||||
import { Visit } from 'src/app/models/visit';
|
import { Visit } from 'src/app/models/visit';
|
||||||
|
import { EnrollService } from 'src/app/services/enroll/enroll.service';
|
||||||
import { VisitsService } from 'src/app/services/visits/visits.service';
|
import { VisitsService } from 'src/app/services/visits/visits.service';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
|
@ -16,7 +20,10 @@ export class VisitsComponent implements OnInit {
|
||||||
public courseVisit?: CourseVisit;
|
public courseVisit?: CourseVisit;
|
||||||
public dataSource = new MatTableDataSource<StudentVisit>();
|
public dataSource = new MatTableDataSource<StudentVisit>();
|
||||||
|
|
||||||
public constructor(private visitsService: VisitsService) { }
|
public addedStudent?: Student;
|
||||||
|
|
||||||
|
|
||||||
|
public constructor(private visitsService: VisitsService, private enrollService: EnrollService) { }
|
||||||
|
|
||||||
public ngOnInit() {
|
public ngOnInit() {
|
||||||
this.getData();
|
this.getData();
|
||||||
|
@ -37,7 +44,7 @@ export class VisitsComponent implements OnInit {
|
||||||
}
|
}
|
||||||
|
|
||||||
private getData(): void {
|
private getData(): void {
|
||||||
//const now = new Date('2022-11-03 19:17:00');
|
//const now = new Date('2023-04-24 16:01:01');
|
||||||
const now = new Date();
|
const now = new Date();
|
||||||
|
|
||||||
this.visitsService.get(now)
|
this.visitsService.get(now)
|
||||||
|
@ -52,4 +59,20 @@ export class VisitsComponent implements OnInit {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
public add(): void {
|
||||||
|
this.addedStudent = <Student>{};
|
||||||
|
}
|
||||||
|
|
||||||
|
public commit(): void {
|
||||||
|
this.enrollService.set(
|
||||||
|
-1,
|
||||||
|
[<StudentEnrollment>{
|
||||||
|
cid: this.courseVisit?.cid,
|
||||||
|
begin: formatDate(new Date(), 'yyyy-MM-dd', 'en-US'),
|
||||||
|
end: formatDate(new Date('2100-01-01'), 'yyyy-MM-dd', 'en-US')
|
||||||
|
}]).subscribe(_ => {
|
||||||
|
this.addedStudent = undefined;
|
||||||
|
this.getData();
|
||||||
|
});
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -3,7 +3,6 @@ import { HttpClient, HttpParams } from '@angular/common/http';
|
||||||
import { Injectable } from '@angular/core';
|
import { Injectable } from '@angular/core';
|
||||||
import { Observable } from 'rxjs';
|
import { Observable } from 'rxjs';
|
||||||
import { Enrollment } from 'src/app/models/enrollment';
|
import { Enrollment } from 'src/app/models/enrollment';
|
||||||
import { Student } from 'src/app/models/student';
|
|
||||||
import { StudentEnrollment } from 'src/app/models/student-enrollment';
|
import { StudentEnrollment } from 'src/app/models/student-enrollment';
|
||||||
import { environment } from 'src/environments/environment';
|
import { environment } from 'src/environments/environment';
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue