Merge pull request #3 from UdL-EPS-SoftArch/adoptions-angular

Adoptions frontend

src/app/adoptions/adoption-create/adoption-create.component.html

@@ -0,0 +1,32 @@
+<form id="adoptions-form" (ngSubmit)="onSubmit()" #form="ngForm">
+  <fieldset>
+
+    <div class="form-group mb-3" [class.was-validated]="id.invalid && (id.dirty || id.touched)">
+      <label class="control-label" for="id">Id</label>
+      <input id="id" name="id" type="number" class="form-control"  [(ngModel)]="adoption.id"
+             #id="ngModel">
+    </div>
+
+    <div class="form-group mb-3">
+      <label class="control-label" for="pet">Pet</label>
+      <input id="pet" name="pet" type="text" class="form-control" [(ngModel)]="adoption.pet"
+             #time="ngModel">
+    </div>
+
+    <div class="form-group mb-3">
+      <label class="control-label" for="time">Time</label>
+      <input id="time" name="time" type="Date" class="form-control" [(ngModel)]="adoption.localDateTime"
+             #time="ngModel">
+    </div>
+
+    <div class=" form-group fa-pull-right">
+      <button id="listBtn" type="button" [routerLink]="['/adoptions']"
+              class="btn btn-outline-primary pull-right">Back
+      </button>
+      <button id="submit" type="submit" [disabled]="!form.form.valid"
+              class="btn ms-3 btn-success pull-right">Submit
+      </button>
+    </div>
+
+  </fieldset>
+</form>

src/app/adoptions/adoption-create/adoption-create.component.ts

@@ -0,0 +1,26 @@
+import { Component, OnInit } from '@angular/core';
+import { Adoption } from '../adoption';
+import { Router } from '@angular/router';
+import { AdoptionService } from '../adoption.service';
+
+@Component({
+  selector: 'app-adoption-add',
+  templateUrl: './adoption-create.component.html',
+})
+export class AdoptionCreateComponent implements OnInit{
+  public adoption: Adoption;
+  public date: Date;
+
+  constructor(private router: Router,
+              private adoptionService: AdoptionService) {
+  }
+  ngOnInit(): void {
+    this.adoption = new Adoption();
+  }
+
+  onSubmit(): void {
+    this.adoptionService.createResource({body: this.adoption}).subscribe(
+      (adoption:Adoption) => this.router.navigate([adoption.uri])
+    );
+  }
+}

src/app/adoptions/adoption-delete/adoption-delete.component.ts

@@ -0,0 +1,31 @@
+import { Component, OnInit } from '@angular/core';
+import { ActivatedRoute, Router } from '@angular/router';
+import { Adoption } from '../adoption';
+import { AdoptionService } from '../adoption.service';
+
+@Component({
+  selector: 'app-adoption-delete',
+  templateUrl: './adoption.delete.component.html'
+})
+export class AdoptionDeleteComponent implements OnInit {
+  public adoption: Adoption = new Adoption();
+  public adoptionId: string;
+
+  constructor(private route: ActivatedRoute,
+              private router: Router,
+              private adoptionService: AdoptionService) {
+  }
+
+  ngOnInit(): void {
+    this.adoptionId = this.route.snapshot.paramMap.get('id');
+    this.adoptionService.getResource(this.adoptionId).subscribe(
+      adoption => this.adoption = adoption);
+  }
+
+  delete(): void {
+    this.adoptionService.deleteResource(this.adoption).subscribe(
+      () => {
+        this.router.navigate(['id']);
+      });
+  }
+}

src/app/adoptions/adoption-delete/adoption.delete.component.html

@@ -0,0 +1 @@
+<p>adoption-delete works!</p>

src/app/adoptions/adoption-detail/adoption-detail.component.html

@@ -0,0 +1 @@
+<p>adoptions-detail works!</p>

src/app/adoptions/adoption-detail/adoption-detail.component.ts

@@ -0,0 +1,25 @@
+import { Component, OnInit } from '@angular/core';
+import { ActivatedRoute } from '@angular/router';
+import { AdoptionService } from '../adoption.service';
+import { Adoption } from '../adoption';
+
+@Component({
+  selector: 'app-adoption-detail',
+  templateUrl: './adoption-detail.component.html'
+})
+export class AdoptionDetailComponent implements OnInit {
+  public adoption: Adoption = new Adoption();
+  public adoptionId: string;
+
+  constructor(private route: ActivatedRoute,
+              private adoptionService: AdoptionService) {
+  }
+
+  ngOnInit(): void {
+    this.adoptionId = this.route.snapshot.paramMap.get('id');
+    this.adoptionService.getResource(this.adoptionId).subscribe(
+      adoption => {
+        this.adoption = adoption;
+      });
+  }
+}

src/app/adoptions/adoption-edit/adoption-edit.component.html

@@ -0,0 +1 @@
+<p>adoptions-edit works!</p>

src/app/adoptions/adoption-edit/adoption-edit.component.ts

@@ -0,0 +1,30 @@
+import { Component, OnInit } from '@angular/core';
+import { ActivatedRoute } from '@angular/router';
+import { Router } from '@angular/router';
+import { AuthenticationBasicService } from '../../login-basic/authentication-basic.service';
+import { AdoptionService } from '../adoption.service';
+import { Adoption } from '../adoption';
+
+@Component({
+  selector: 'app-adoption-edit',
+  templateUrl: './adoption-edit.component.html',
+})
+export class AdoptionEditComponent implements OnInit {
+  public adoption: Adoption = new Adoption();
+
+  constructor(private route: ActivatedRoute,
+              private router: Router,
+              private adoptionsService: AdoptionService,
+              private authenticationService: AuthenticationBasicService) {
+  }
+
+  ngOnInit(): void {
+    const id = this.route.snapshot.paramMap.get('id');
+    this.adoptionsService.getResource(id).subscribe(
+      (adoption: Adoption) => this.adoption = adoption );
+  }
+
+  getCurrentUserName(): string {
+    return this.authenticationService.getCurrentUser().username;
+  }
+}

src/app/adoptions/adoption-list/adoption-list.component.html

@@ -0,0 +1,26 @@
+<div class="card mb-1" *ngFor="let adoption of adoption">
+  <div class="card-block row m-1 col-12">
+    <div class="card-body row align-items-center">
+      <div class="col-6 mt-1">
+        <h6 class="card-subtitle text-muted">Adoptions ID</h6>
+        <a class="card-text" [routerLink]="['/adoptions', adoption.id]">{{adoption.id}}</a>
+      </div>
+      <div class="col-6 mt-1">
+        <h6 class="card-subtitle text-muted">Pet</h6>
+        <p class="card-text">{{adoption.pet}}</p>
+      </div>
+      <div class="col-6 mt-1">
+        <h6 class="card-subtitle text-muted">User</h6>
+        <p class="card-text">{{adoption.user}}</p>
+      </div>
+      <div class="col-6 mt-1">
+        <h6 class="card-subtitle text-muted">Time</h6>
+        <p class="card-text">{{adoption.localDateTime}}</p>
+      </div>
+    </div>
+  </div>
+
+
+  <ngb-pagination class="d-flex justify-content-center"
+                  [(page)]="page" [pageSize]="pageSize" [collectionSize]="totalAdoption"
+                  (pageChange)="changePage()"></ngb-pagination>

src/app/adoptions/adoption-list/adoption-list.component.ts

@@ -0,0 +1,39 @@
+import {Component, EventEmitter, OnInit, Output} from '@angular/core';
+import { Router } from '@angular/router';
+import { Adoption } from '../adoption';
+import { AdoptionService } from '../adoption.service';
+import { PagedResourceCollection } from '@lagoshny/ngx-hateoas-client';
+
+@Component({
+  selector: 'app-adoption-list',
+  templateUrl: './adoption-list.component.html'
+})
+export class AdoptionListComponent implements OnInit{
+  public adoption: Adoption[] = [];
+  public pageSize = 5;
+  public page = 1;
+  public totalAdoption = 0;
+
+  constructor(
+    public router: Router,
+    private adoptionService: AdoptionService) {
+  }
+
+  ngOnInit(): void {
+    this.adoptionService.getPage({ pageParams:  { size: this.pageSize }, sort: { id: 'ASC' } }).subscribe(
+      (page: PagedResourceCollection<Adoption>) => {
+        this.adoption = page.resources;
+        this.totalAdoption = page.totalElements;
+      });
+  }
+
+  changePage(): void {
+    this.adoptionService.getPage({ pageParams: { page: this.page - 1, size: this.pageSize }, sort: { id: 'ASC' } }).subscribe(
+      (page: PagedResourceCollection<Adoption>) => this.adoption = page.resources);
+  }
+
+  detail(adoption: Adoption): void {
+    this.router.navigate(['adoption', adoption.id]);
+  }
+
+}

src/app/adoptions/adoption-search/adoption-search.component.html

@@ -0,0 +1 @@
+<p>adoption-search works!</p>

src/app/adoptions/adoption-search/adoption-search.component.ts

@@ -0,0 +1,42 @@
+import { Component, EventEmitter, Output } from '@angular/core';
+import { AdoptionService } from '../adoption.service';
+import { Adoption } from '../adoption';
+import { Observable, of, OperatorFunction } from 'rxjs';
+import { catchError, debounceTime, distinctUntilChanged, map, switchMap, tap } from 'rxjs/operators';
+import { ResourceCollection } from '@lagoshny/ngx-hateoas-client';
+
+@Component({
+  selector: 'app-adoption-search',
+  templateUrl: './adoption-search.component.html'
+})
+
+export class AdoptionSearchComponent {
+  @Output() emitResults: EventEmitter<Adoption> = new EventEmitter();
+  searchFailed = false;
+  searching = false;
+
+  constructor(private AdoptionService: AdoptionService) {
+  }
+
+  autocomplete: OperatorFunction<string, readonly Adoption[]> = (text$: Observable<string>) =>
+    text$.pipe(
+      debounceTime(500),
+      distinctUntilChanged(),
+      tap(() => this.searching = true),
+      switchMap(term => term.length < 3 ? of([]) :
+        this.AdoptionService.findById(term).pipe(
+          map((collection: ResourceCollection<Adoption>) => collection.resources),
+          tap(() => this.searchFailed = false),
+          catchError(() => {
+            this.searchFailed = true;
+            return of([]);
+          })
+        )
+      ),
+      tap(() => this.searching = false )
+    )
+
+  select(item: any): void {
+    this.emitResults.emit(item as Adoption);
+  }
+}

src/app/adoptions/adoption.service.ts

@@ -0,0 +1,17 @@
+import { Injectable } from '@angular/core';
+import { Observable } from 'rxjs/internal/Observable';
+import { HateoasResourceOperation, ResourceCollection } from '@lagoshny/ngx-hateoas-client';
+import { Adoption } from "./adoption"
+
+@Injectable({providedIn: 'root'})
+export class AdoptionService extends HateoasResourceOperation<Adoption> {
+
+  constructor() {
+    super(Adoption);
+  }
+
+  public findById(query: string): Observable<ResourceCollection<Adoption>> {
+    return this.searchCollection('findById', { params: { text: query } });
+  }
+}
+

src/app/adoptions/adoption.ts

@@ -0,0 +1,18 @@
+import { HateoasResource, Resource } from '@lagoshny/ngx-hateoas-client';
+import {User} from "../login-basic/user";
+
+@HateoasResource('adoptions')
+export class Adoption extends Resource {
+  localDateTime: Date;
+  id: string;
+  pet: string;
+  user: User;
+  uri: string;
+
+
+
+  constructor(values: object = {}) {
+    super();
+    Object.assign(this as any, values);
+  }
+}

src/app/app-routing.module.ts

@@ -8,6 +8,12 @@ import { UserDetailComponent } from './user/user-detail/user-detail.component';
 import { UserRegisterComponent } from './user/user-register/user-register.component';
 import { UserEditComponent } from './user/user-edit/user-edit.component';
 import { UserDeleteComponent } from './user/user-delete/user-delete.component';
+import {AdoptionSearchComponent} from './adoptions/adoption-search/adoption-search.component';
+import {AdoptionListComponent} from './adoptions/adoption-list/adoption-list.component';
+import {AdoptionEditComponent} from './adoptions/adoption-edit/adoption-edit.component';
+import {AdoptionDetailComponent} from './adoptions/adoption-detail/adoption-detail.component';
+import {AdoptionDeleteComponent} from './adoptions/adoption-delete/adoption-delete.component';
+import {AdoptionCreateComponent} from "./adoptions/adoption-create/adoption-create.component";
 import { ShelterListComponent } from './shelter/shelter-list/shelter-list.component'
 import {ShelterCreateComponent} from "./shelter/shelter-create/shelter-create.component";
 
@@ -20,6 +26,12 @@ const routes: Routes = [
   { path: 'about', component: AboutComponent},
   { path: '404', component: NotFoundComponent},
   { path: '', redirectTo: 'about', pathMatch: 'full'},
+  { path: 'adoptions' , component: AdoptionListComponent },
+  { path: 'adoptions/create', component: AdoptionCreateComponent },
+  { path: 'adoptions/edit', component: AdoptionEditComponent },
+  { path: 'adoptions/delete', component: AdoptionDeleteComponent },
+  { path: 'adoptions/detail', component: AdoptionDetailComponent },
+  { path: 'adoptions/search', component: AdoptionSearchComponent },
   { path: 'shelters', component: ShelterListComponent},
   { path: 'shelters/create', component: ShelterCreateComponent},
 ];

src/app/app.module.ts

@@ -23,6 +23,12 @@ import {HttpErrorInterceptor} from './error-handler/http-error-interceptor';
 import {AuthenticationBasicService} from './login-basic/authentication-basic.service';
 import {LoggedInGuard} from './login-basic/loggedin.guard';
 import {UserService} from './user/user.service';
+import {AdoptionSearchComponent} from './adoptions/adoption-search/adoption-search.component';
+import {AdoptionListComponent} from './adoptions/adoption-list/adoption-list.component';
+import {AdoptionEditComponent} from './adoptions/adoption-edit/adoption-edit.component';
+import {AdoptionDetailComponent} from './adoptions/adoption-detail/adoption-detail.component';
+import {AdoptionDeleteComponent} from './adoptions/adoption-delete/adoption-delete.component';
+import {AdoptionCreateComponent} from "./adoptions/adoption-create/adoption-create.component";
 import { provideAnimationsAsync } from '@angular/platform-browser/animations/async';
 import {ShelterService} from "./shelter/shelter.service";
 import {ShelterListComponent} from "./shelter/shelter-list/shelter-list.component";
@@ -41,6 +47,12 @@ import {ShelterDetailComponent} from "./shelter/shelter-detail/shelter-detail.co
     UserEditComponent,
     UserDeleteComponent,
     UserSearchComponent,
+    AdoptionSearchComponent,
+    AdoptionCreateComponent,
+    AdoptionDeleteComponent,
+    AdoptionDetailComponent,
+    AdoptionEditComponent,
+    AdoptionListComponent,
     ShelterListComponent,
     ShelterCreateComponent,
     ShelterDetailComponent