ChronosXYZ/InstructorsListAppTA
1
0
Fork 0
mirror of https://github.com/ChronosX88/InstructorsListAppTA.git synced 2024-12-04 22:52:19 +00:00
Code Issues Projects Releases Wiki Activity

[ui] feat: Implement editing instructors

Browse Source
This commit is contained in:
ChronosX88 2019-09-25 22:57:40 +04:00
parent 097a361f15
commit 1039362b1b
Signed by: ChronosXYZ
GPG Key ID: 085A69A82C8C511A
2 changed files with 35 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
ClientApp/src/app/home/home.component.html
View File

@ -4,17 +4,27 @@
<tr>
<th>First name</th>
<th>Last Name</th>
<th>DELETE</th>
<th>Manage</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let instructor of instructors">
<td>{{ instructor.firstName }}</td>
<td>{{ instructor.lastName }}</td>
<td><button type="button" class="btn btn-danger" (click)="deleteInstructor(instructor)">DELETE</button></td>
<td>
<ng-template [ngIf]="changingInstructor?.id != instructor.id" [ngIfElse]="edit">
<button type="button" class="btn btn-primary" style="margin-right: 10px" (click)="setChangingInstructor(instructor)">Change</button>
</ng-template>
<button type="button" class="btn btn-danger" (click)="deleteInstructor(instructor)">DELETE</button>
</td>
</tr>
</tbody>
</table>
<ng-template #edit>
<button type="button" class="btn btn-primary" style="margin-right: 10px" (click)="clearChangingInstructor(true)">Cancel edit</button>
</ng-template>
<div style="text-align: center;"><h1>Instructor Details</h1>
<br>
<label><h5 style="text-align: initial">First Name</h5><input type="text" style="margin-right: 20px" [(ngModel)]="changingInstructor.firstName"></label>

25
ClientApp/src/app/home/home.component.ts
View File

@ -11,6 +11,7 @@ import { InstructorsHttpService } from '../services/instructors-http-service';
export class HomeComponent {
public instructors: Instructor[];
private changingInstructor: Instructor = new Instructor();
private savedInstructor: Instructor = new Instructor();
constructor(private instructorsService: InstructorsHttpService) {}
@ -24,16 +25,36 @@ export class HomeComponent {
})
}
setChangingInstructor(instructor: Instructor) {
Object.assign(this.savedInstructor, instructor)
this.changingInstructor = instructor
}
clearChangingInstructor(isUndo: boolean) {
if(isUndo) {
// undo edit changes
Object.assign(this.changingInstructor, this.savedInstructor) // copy previous object
}
this.changingInstructor = new Instructor() // remove ref
this.savedInstructor = new Instructor()
}
saveChanges() {
if(this.changingInstructor.id == null) {
console.log("Creating instructor...")
this.instructorsService.createInstructor(this.changingInstructor).subscribe(result => {
this.instructors.push(result)
console.log("Instructor successfully created")
})
} else {
this.instructorsService.updateInstructor(this.changingInstructor)
console.log("Updating instructor...")
this.instructorsService.updateInstructor(this.changingInstructor).subscribe(_ => {
console.log("Instructor successfully updated")
})
}
this.changingInstructor = new Instructor()
this.clearChangingInstructor(false)
}
deleteInstructor(instructor: Instructor) {