-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #44 from UdL-EPS-SoftArch/waypoint-detail-delete
Waypoint detail, edit, delete components
- Loading branch information
Showing
15 changed files
with
363 additions
and
76 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Empty file.
15 changes: 15 additions & 0 deletions
15
src/app/waypoint/waypoint-delete/waypoint-delete.component.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,15 @@ | ||
| <div class="panel panel-warning"> | ||
| <div class="panel-heading"> | ||
| <div class="panel-title">Please, confirm deletion:</div> | ||
| </div> | ||
| <div class="panel-body"> | ||
| <div class="text-center"> | ||
| <button id="deleteBtn" type="button" (click)="delete()" | ||
| class="btn btn-outline-danger m-1">Delete | ||
| </button> | ||
| <button id="listBtn" type="button" [routerLink]="['routes', waypoint.id]" | ||
| class="btn btn-outline-primary m-1">Cancel | ||
| </button> | ||
| </div> | ||
| </div> | ||
| </div> |
33 changes: 33 additions & 0 deletions
33
src/app/waypoint/waypoint-delete/waypoint-delete.component.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,33 @@ | ||
| import {Component, OnInit} from '@angular/core'; | ||
| import {ActivatedRoute, Router} from "@angular/router"; | ||
| import {Waypoint} from "../waypoint"; | ||
| import {WaypointService} from "../waypoint.service"; | ||
|
|
||
| @Component({ | ||
| selector: 'app-waypoint-delete', | ||
| templateUrl: './waypoint-delete.component.html', | ||
| styleUrls: ['./waypoint-delete.component.css'] | ||
| }) | ||
| export class WaypointDeleteComponent implements OnInit { | ||
|
|
||
| public waypoint: Waypoint = new Waypoint(); | ||
| private id: string; | ||
|
|
||
| constructor(private activatedRoute: ActivatedRoute, | ||
| private router: Router, | ||
| private waypointService: WaypointService) { | ||
| } | ||
|
|
||
| ngOnInit(): void { | ||
| this.id = this.activatedRoute.snapshot.paramMap.get('id'); | ||
| this.waypointService.getResource(this.id).subscribe( | ||
| w => this.waypoint = w); | ||
| } | ||
|
|
||
| delete(): void { | ||
| this.waypointService.deleteResource(this.waypoint).subscribe( | ||
| () => { | ||
| this.router.navigate(['waypoints']); | ||
| }); | ||
| } | ||
| } |
11 changes: 11 additions & 0 deletions
11
src/app/waypoint/waypoint-detail/waypoint-detail.component.css
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,11 @@ | ||
| .custom-container { | ||
| border: 1px solid #ddd; | ||
| padding: 15px; | ||
| border-radius: 5px; | ||
| background-color: #fff; | ||
| } | ||
|
|
||
| .info-text { | ||
| font-weight: bold; | ||
| color: #333; | ||
| } |
28 changes: 28 additions & 0 deletions
28
src/app/waypoint/waypoint-detail/waypoint-detail.component.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,28 @@ | ||
| <div class="row"> | ||
| <div class="col-12"> | ||
| <div class="custom-container"> | ||
| <h5 class="text-center mb-4">Waypoint Detail</h5> | ||
| <div class="row mb-3"> | ||
| <div class="col-md-6"> | ||
| <h6 class="text-muted">Waypoint Title</h6> | ||
| <p id="WaypointTitle" class="info-text">{{ waypoint.title }}</p> | ||
| </div> | ||
| <div class="col-md-6"> | ||
| <h6 class="text-muted">Description</h6> | ||
| <p id="WaypointDescription" class="info-text">{{ waypoint.description }}</p> | ||
| </div> | ||
| </div> | ||
| <div class="row"> | ||
| <div class="col-md-6"> | ||
| <h6 class="text-muted">Waypoint Type</h6> | ||
| <p id="WaypointType" class="info-text">{{ waypoint.type }}</p> | ||
| </div> | ||
| </div> | ||
| <div class="row mt-4"> | ||
| <div class="col-12 text-right"> | ||
| <a [routerLink]="[waypoint.uri.endsWith('/') ? waypoint.uri.slice(0, -1) : waypoint.uri, 'edit']" class="btn btn-primary">Edit Waypoint</a> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> |
40 changes: 40 additions & 0 deletions
40
src/app/waypoint/waypoint-detail/waypoint-detail.component.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,40 @@ | ||
| import {Component, OnInit} from '@angular/core'; | ||
| import {ActivatedRoute, Router} from "@angular/router"; | ||
| import {AuthenticationBasicService} from "../../login-basic/authentication-basic.service"; | ||
| import {WaypointService} from "../waypoint.service"; | ||
| import {Waypoint} from "../waypoint"; | ||
| import {Location} from "@angular/common"; | ||
|
|
||
| @Component({ | ||
| selector: 'app-waypoint-detail', | ||
| templateUrl: './waypoint-detail.component.html', | ||
| styleUrls: ['./waypoint-detail.component.css'] | ||
| }) | ||
| export class WaypointDetailComponent implements OnInit { | ||
| public waypoint: Waypoint = new Waypoint(); | ||
|
|
||
| constructor( | ||
| public router: Router, | ||
| private activatedRoute: ActivatedRoute, | ||
| private waypointService: WaypointService, | ||
| private authenticationService: AuthenticationBasicService, | ||
| private location: Location) { | ||
| } | ||
|
|
||
| ngOnInit(): void { | ||
| const id = this.activatedRoute.snapshot.paramMap.get('id'); | ||
| this.waypointService.getResource(id).subscribe( | ||
| (w: Waypoint) => { | ||
| this.waypoint = w; | ||
| }); | ||
| } | ||
|
|
||
| isRole(role: string): boolean { | ||
| return this.authenticationService.isRole(role); | ||
| } | ||
|
|
||
| goBackToPrevPage(): void { | ||
| this.location.back(); | ||
| } | ||
|
|
||
| } |
Empty file.
33 changes: 33 additions & 0 deletions
33
src/app/waypoint/waypoint-edit/waypoint-edit.component.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,33 @@ | ||
| <form id="routes-form" (ngSubmit)="onSubmit()" #form="ngForm"> | ||
| <fieldset> | ||
| <!-- Title input --> | ||
| <div class="form-group mb-3" [class.was-validated]="title.invalid && (title.dirty || title.touched)"> | ||
| <label class="control-label" for="title">Title</label> | ||
| <input id="title" name="title" type="text" class="form-control" | ||
| [(ngModel)]="waypoint.title" #title="ngModel"> | ||
| </div> | ||
|
|
||
| <!-- Description input --> | ||
| <div class="form-group mb-3" [class.was-validated]="description.dirty || description.touched"> | ||
| <label class="control-label" for="description">Description</label> | ||
| <input id="description" name="description" type="text" class="form-control" | ||
| [(ngModel)]="waypoint.description" #description="ngModel"> | ||
| </div> | ||
|
|
||
| <div class="form-group mb-3"> | ||
| <label class="control-label" for="type">Type</label> | ||
| <input id="type" name="type" type="text" class="form-control" readonly | ||
| [(ngModel)]="waypoint.type" #type="ngModel"> | ||
| </div> | ||
|
|
||
| <!-- Button --> | ||
| <div class="form-group fa-pull-right"> | ||
| <button id="routeBack" type="button" (click)="goBackToPrevPage()" | ||
| class="btn btn-outline-primary">Back</button> | ||
| <button id="submit" type="submit" [disabled]="!form.form.valid" | ||
| class="btn btn-success ms-3">Submit</button> | ||
| </div> | ||
|
|
||
| </fieldset> | ||
| </form> | ||
|
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,41 @@ | ||
| import {Component, OnInit} from '@angular/core'; | ||
| import {ActivatedRoute, Router} from "@angular/router"; | ||
| import {Location} from "@angular/common"; | ||
| import {Waypoint} from "../waypoint"; | ||
| import {WaypointService} from "../waypoint.service"; | ||
|
|
||
| @Component({ | ||
| selector: 'app-waypoint-edit', | ||
| templateUrl: './waypoint-edit.component.html', | ||
| styleUrls: ['./waypoint-edit.component.css'] | ||
| }) | ||
| export class WaypointEditComponent implements OnInit { | ||
| public waypoint: Waypoint = new Waypoint(); | ||
|
|
||
| constructor(private activatedRoute: ActivatedRoute, | ||
| private router: Router, | ||
| private waypointService: WaypointService, | ||
| private location: Location) { | ||
| } | ||
|
|
||
| ngOnInit(): void { | ||
|
|
||
| const id = this.activatedRoute.snapshot.paramMap.get('id'); | ||
| this.waypointService.getResource(id).subscribe( | ||
| (w: Waypoint) => { | ||
| this.waypoint = w; | ||
| this.waypoint.id = id; | ||
| }); | ||
| } | ||
|
|
||
| onSubmit() { | ||
| this.waypointService.patchResource(this.waypoint).subscribe( | ||
| (waypoint: Waypoint) => { | ||
| this.router.navigate([waypoint.uri]); | ||
| }); | ||
| } | ||
|
|
||
| goBackToPrevPage(): void { | ||
| this.location.back(); | ||
| } | ||
| } |
Oops, something went wrong.