Visit status2.0

src/app/visit/visit-status/visit-status.component.css

@@ -0,0 +1,71 @@
+h1 {
+  text-align: center;
+  color: #2c3e50;
+  font-family: 'Arial', sans-serif;
+  margin-bottom: 20px;
+}
+
+.status-table {
+  width: 80%;
+  margin: 0 auto;
+  border-collapse: collapse;
+  font-family: 'Arial', sans-serif;
+  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+  background-color: #f9f9f9;
+}
+
+.status-table th, .status-table td {
+  padding: 12px 15px;
+  text-align: center;
+}
+
+.status-table th {
+  background-color: #49565a;
+  color: white;
+  text-transform: uppercase;
+  font-size: 14px;
+  letter-spacing: 1px;
+}
+
+.status-table tr:nth-child(even) {
+  background-color: #f2f2f2;
+}
+
+.status-table tr:hover {
+  background-color: #eaf3fc;
+}
+
+.status-table td {
+  font-size: 14px;
+  color: #2c3e50;
+}
+/* Estilo para el status */
+.status {
+  display: flex;
+  align-items: center;
+  font-weight: bold;
+  text-transform: capitalize;
+  justify-content: center;
+}
+
+.status::before {
+  content: '';
+  display: inline-block;
+  width: 10px;
+  height: 10px;
+  border-radius: 50%;
+  margin-right: 8px;
+}
+
+/* Colores según el estado */
+.status.pending::before {
+  background-color: #f1c40f; /* Amarillo */
+}
+
+.status.rejected::before {
+  background-color: #e74c3c; /* Rojo */
+}
+
+.status.accepted::before {
+  background-color: #2ecc71; /* Verde */
+}

src/app/visit/visit-status/visit-status.component.html

@@ -0,0 +1,18 @@
+<h1>VISIT STATUS</h1>
+
+<table class="status-table">
+  <thead>
+  <tr>
+    <th>Status</th>
+    <th>Date & Time</th>
+  </tr>
+  </thead>
+  <tbody>
+  <tr>
+    <span class="status" [ngClass]="visit.status.toLowerCase()">
+          {{ visit.status }}
+    </span>
+    <td>{{ visit.visitDate}}</td>
+  </tr>
+  </tbody>
+</table>

src/app/visit/visit-status/visit-status.component.spec.ts

@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { VisitStatusComponent } from './visit-status.component';
+
+describe('VisitStatusComponent', () => {
+  let component: VisitStatusComponent;
+  let fixture: ComponentFixture<VisitStatusComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [VisitStatusComponent]
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(VisitStatusComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/visit/visit-status/visit-status.component.ts

@@ -0,0 +1,58 @@
+import { Component, OnInit } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import {Visit} from '../visit';
+import {User} from '../../login-basic/user';
+import {ActivatedRoute, Router} from '@angular/router';
+import {ErrorMessageService} from '../../error-handler/error-message.service';
+import {AuthenticationBasicService} from '../../login-basic/authentication-basic.service';
+import { VisitService } from '../visit.service';
+import {catchError, of} from 'rxjs';
+@Component({
+  selector: 'app-visit-status',
+  standalone: true,
+  imports: [CommonModule],
+  templateUrl: './visit-status.component.html',
+  styleUrl: './visit-status.component.css'
+})
+export class VisitStatusComponent  implements OnInit {
+  public visit: Visit = new Visit()
+  public user: User = new User();
+  public visitId: string = '';
+  public errorFetchMsg: string = '';
+
+
+
+  constructor(
+    private router: Router,
+    private visitService: VisitService = new VisitService(),
+    private activatedRoute: ActivatedRoute,
+    private errorMessageService: ErrorMessageService,
+    private authenticationService: AuthenticationBasicService
+  ) {}
+
+  ngOnInit(): void {
+    this.visit = new Visit();
+    this.visitId = this.activatedRoute.snapshot.paramMap.get('id') || '';
+    this.user = this.authenticationService.getCurrentUser();
+
+
+
+    this.visitService
+      .getResource(this.visitId)
+      .pipe(
+        catchError((error) => {
+          this.errorFetchMsg = error.message;
+          return of(null);
+        })
+      )
+      .subscribe((_visit) => {
+        if (_visit) {
+          this.visit = _visit;
+          this.visit.id = this.visit.getIdFromLinks();
+          console.log(this.visit);
+
+        }
+      });
+
+  }
+}

src/app/visit/visit.service.ts

@@ -0,0 +1,11 @@
+import { Injectable } from "@angular/core";
+import { HateoasResourceOperation } from "@lagoshny/ngx-hateoas-client";
+import { Visit } from "./visit";
+
+@Injectable({ providedIn: "root" })
+export class VisitService extends HateoasResourceOperation<Visit> {
+
+  constructor() {
+    super(Visit);
+  }
+}

src/app/visit/visit.ts

@@ -0,0 +1,24 @@
+import { HateoasResource, Resource } from '@lagoshny/ngx-hateoas-client';
+import {User} from '../login-basic/user';
+
+@HateoasResource('visits')
+export class Visit extends Resource {
+  id: string = '';
+  visitDate: Date = new Date();
+  user: User = new User();
+  status: string = '';
+
+
+  constructor(values: object = {}) {
+    super();
+    Object.assign(this, values);
+  }
+
+
+  getIdFromLinks(): string {
+    if (this._links?.self?.href) {
+      return this._links.self.href.split('/').pop() || '';
+    }
+    return this.id;
+  }
+}