(F) Finish history

Clinics.Frontend/src/app/app.module.ts

@@ -54,6 +54,8 @@ import { CreateVisitComponent } from './components/doctor/create-visit/create-vi
 import { MedicinesComponent } from './components/doctor/medicines/medicines.component';
 import { AccordionDirective } from './directives/accordion.directive';
 import { PatientIsComingNotificationComponent } from './components/doctor/patient-is-coming-notification/patient-is-coming-notification.component';
+import { VisitsService } from './services/visits/visits.service';
+import { ArabicDatePipe } from './pipes/arabic-date.pipe';
 
 
 @NgModule({
@@ -81,6 +83,7 @@ import { PatientIsComingNotificationComponent } from './components/doctor/patien
     WaitingListService,
     EmployeesDataService,
     DoctorNotificationsService,
+    VisitsService,
   ],
 
   // components and directives that belong to this module
@@ -126,6 +129,7 @@ import { PatientIsComingNotificationComponent } from './components/doctor/patien
     MedicinesComponent,
     AccordionDirective,
     PatientIsComingNotificationComponent,
+    ArabicDatePipe,
   ],
   
   // identifies the root component that Angular should

Clinics.Frontend/src/app/classes/visit/visit-view.ts

@@ -3,9 +3,10 @@ import { MedicineView } from "../medicine/medicine-view";
 export class VisitView {
     doctorName: string;
     diagnosis: string;
+    date: Date;
     medicines: MedicineView[];
 
-    constructor(doctorName: string = '', diagnosis: string = '', medicines: MedicineView[] = []) {
+    constructor(doctorName: string = '', diagnosis: string = '', date: Date = new Date(Date.now()), medicines: MedicineView[] = []) {
         this.doctorName = doctorName;
         this.diagnosis = diagnosis;
         this.medicines = medicines;

Clinics.Frontend/src/app/components/doctor/history/history.component.html

 <div class="custom-child">
     <section class="section">
         <div class="custom-title">
-            <h2 >زيارات المريض محمد رضا وائل تقلا</h2>
+            <h2 >زيارات المريض {{getEmployeeFullName()}}</h2>
         </div>
 
-
-        <div>
-            <app-visit [index]="'1'"></app-visit>
-            <!-- <hr style="border:2px solid var(--heading-color);">             -->
+        <div *ngFor="let visit of visits; let i = index">
+            <app-visit [visit]="visit" [index]="i.toString()"></app-visit>
         </div>
         
-        <div>
-            <app-visit [index]="'2'"></app-visit>
-            <!-- <hr style="border:2px solid var(--heading-color);">             -->
-        </div>
-
-        <div>
-            <app-visit [index]="'3'"></app-visit>
-            <!-- <hr style="border:2px solid var(--heading-color);">             -->
-        </div>
-
-        <div>
-            <app-visit [index]="'4'"></app-visit>
-            <!-- <hr style="border:2px solid var(--heading-color);">             -->
-        </div>
-
-        <div>
-            <app-visit [index]="'5'"></app-visit>
-            <!-- <hr style="border:2px solid var(--heading-color);">             -->
-        </div>
-
     
     </section>
 

Clinics.Frontend/src/app/components/doctor/history/history.component.ts

-import { Component } from '@angular/core';
+import { Component, OnChanges, OnInit, SimpleChanges } from '@angular/core';
+import { EmployeesDataService } from '../../../services/employees/employees-data.service';
+import { ActivatedRoute, Router } from '@angular/router';
+import { ToastrService } from 'ngx-toastr';
+import { EmployeeData } from '../../../classes/employeeData/employee-data';
+import { VisitView } from '../../../classes/visit/visit-view';
+import { VisitsService } from '../../../services/visits/visits.service';
 
 @Component({
   selector: 'app-history',
   templateUrl: './history.component.html',
   styleUrl: './history.component.css'
 })
-export class HistoryComponent {
+export class HistoryComponent  implements OnInit {
+  constructor(private employeesDataService: EmployeesDataService,
+    private route: ActivatedRoute,
+    private toastrService: ToastrService,
+    private router: Router,
+    private visitsService: VisitsService
+  ) {}
+
+  ngOnInit(): void {
+      this.setId();
+  }
+
+  patientId: number;
+  setId(): void {
+    this.route.params.subscribe((params: any) => {
+      this.patientId = Number(params.id);
+      if (isNaN(this.patientId)) {
+        this.toastrService.error('حدثت مشكلة، يرجى إعادة المحاولة');
+        this.router.navigateByUrl('doctor/waitinglist');
+      }
+      this.getEmployee();
+      this.getVisits();
+
+    });
+  }
+
+  employee: EmployeeData = new EmployeeData();
+  getEmployee(): void {
+    this.employeesDataService.getById(this.patientId)
+    .subscribe(result => {
+      if (result.status === false) {
+        this.toastrService.error('حدثت مشكلة، يرجى إعادة المحاولة');
+        this.router.navigateByUrl('doctor/waitinglist');
+      }
+      else {
+        this.employee = result.employeeData!;
+      }
+    })
+  }
+  getEmployeeFullName(): string {
+    return `${this.employee.firstName} ${this.employee.middleName} ${this.employee.lastName}`;
+  }
+
+  visits: VisitView[];
+  getVisits(): void {
+    this.visitsService.getAllByPatientId(this.patientId)
+    .subscribe(result => {
+      if (result.status === false) {
+        this.toastrService.error('حدثت مشكلة، يرجى إعادة المحاولة');
+        this.router.navigateByUrl('doctor/waitinglist');
+      }
+      else {
+        this.visits = result.visits!;
+      }
+    })
+  }
 
 }

Clinics.Frontend/src/app/components/doctor/medicines/medicines.component.html

@@ -13,22 +13,17 @@
             </thead>
             
             <tbody>
-              <tr>
-                <th scope="row">1</th>
-                <td>أسبيرين</td>
-                <td>حب</td>
-                <td>20 حبة</td>
-                <td>1000</td>
-                <td>3</td>
-              </tr>
-              <tr>
-                <th scope="row">2</th>
-                <td>باراسيتامول</td>
-                <td>شراب</td>
-                <td>500 ملل</td>
-                <td>500</td>
-                <td>2</td>
+
+              <tr *ngFor="let medicine of medicines; let i = index">
+                <th scope="row">{{i+1}}</th>
+                <td>{{medicine.name}}</td>
+                <td>{{medicine.form}}</td>
+                <td *ngIf="medicine.form==='حبوب'">{{medicine.amount}} حبة</td>
+                <td *ngIf="medicine.form==='شراب'">{{medicine.amount}} مل</td>
+                <td>{{medicine.dosage}}</td>
+                <td>{{medicine.number}}</td>
               </tr>
+
             </tbody>
           </table>
     </div>

Clinics.Frontend/src/app/components/doctor/medicines/medicines.component.ts

-import { Component } from '@angular/core';
+import { Component, Input } from '@angular/core';
+import { MedicineView } from '../../../classes/medicine/medicine-view';
 
 @Component({
   selector: 'app-medicines',
@@ -7,4 +8,5 @@ import { Component } from '@angular/core';
 })
 export class MedicinesComponent {
 
+  @Input("medicines") medicines: MedicineView[] = [];
 }

Clinics.Frontend/src/app/components/doctor/visit/visit.component.html

@@ -10,7 +10,7 @@
                     appAccordion [index]="index"
                     (click)="isSelected = !isSelected"
                     >
-                    زيارة بتاريخ 12/8/2024
+                    زيارة يوم {{visit.date | arabicDate}}
                     <i *ngIf="!isSelected" class="fas fa-chevron-down"></i>
                     <i *ngIf="isSelected" class="fas fa-chevron-up"></i>
       
@@ -23,15 +23,15 @@
       
                   <div class="accordion-body custom-child">
                     <div class="custom-visit-details mb-4">
-                        <h2>الطبيب: أحمد محمد فريد حافظ</h2>
+                        <h2>الطبيب: د. {{visit.doctorName}}</h2>
                     </div>
                     <div class="custom-visit-details mb-4">
-                        <h2>التشخيص: التهاب أمعاء</h2>
+                        <h2>التشخيص: {{visit.diagnosis}}</h2>
                     </div>
                     <div class="custom-visit-details mb-4">
                         <h2>الأدوية:</h2>
                     </div>
-                    <app-medicines></app-medicines>
+                    <app-medicines [medicines]="visit.medicines"></app-medicines>
                   </div>
       
                 </div>

Clinics.Frontend/src/app/components/doctor/visit/visit.component.ts

 import { Component, Input } from '@angular/core';
+import { VisitView } from '../../../classes/visit/visit-view';
 
 @Component({
   selector: 'app-visit',
@@ -8,6 +9,7 @@ import { Component, Input } from '@angular/core';
 export class VisitComponent {
 
   @Input("index") index: string;
+  @Input("visit") visit: VisitView = new VisitView();
 
   isSelected: boolean = false;
 }

Clinics.Frontend/src/app/components/receptionist/doctors/doctors.component.ts

@@ -22,7 +22,7 @@ export class DoctorsComponent implements OnInit {
     this.doctorsService.getAll()
     .subscribe(result => {
       if (result === null) {
-        this.toasreService.error('حدث خطأ، يرجى إعادة المحاولة');
+        this.toasreService.error('حدثت مشكلة، يرجى إعادة المحاولة');
       }
       else this.doctors = result;
     })

Clinics.Frontend/src/app/components/receptionist/employee/employee.component.ts

@@ -25,17 +25,17 @@ export class EmployeeComponent implements OnInit {
 
   ngOnInit(): void {
     this.getIdFromUrl();
-    this.updateFormModel();
   }
 
   getIdFromUrl(): void {
-
-    this.id = Number(this.activeRoute.snapshot.paramMap.get('id'));
-    if (isNaN(this.id)) {
-      this.toastrService.error('حدثت مشكلة، يرجى إعادة المحاولة');
-      this.router.navigateByUrl('receptionist/waitinglist');
-    }
-
+    this.activeRoute.params.subscribe((params: any) => {
+      this.id = Number(params.id);
+      if (isNaN(this.id)) {
+        this.toastrService.error('حدثت مشكلة، يرجى إعادة المحاولة');
+        this.router.navigateByUrl('receptionist/waitinglist');
+      }
+      this.updateFormModel();
+    });
   }
 
   updateFormModel(): void {

Clinics.Frontend/src/app/components/receptionist/waiting-list-item/waiting-list-item.component.ts

@@ -54,7 +54,7 @@ export class WaitingListItemComponent implements OnInit {
         this.deleted.emit();
       }
       else {
-        this.toastrService.error('حدث خطأ، يرجى اعادة المحاولة');
+        this.toastrService.error('حدثت مشكلة، يرجى إعادة المحاولة');
       }
     })
   }
@@ -82,7 +82,7 @@ export class WaitingListItemComponent implements OnInit {
         this.deleted.emit();
       }
       else {
-        this.toastrService.error('حدثت مشكلة، يرجى اعادة المحاولة');
+        this.toastrService.error('حدثت مشكلة، يرجى إعادة المحاولة');
       }
     })
   }

Clinics.Frontend/src/app/components/receptionist/waiting-list/waiting-list.component.ts

@@ -27,7 +27,7 @@ export class WaitingListComponent implements OnInit {
     this.waitingListService.getAll()
     .subscribe(result => {
       if (result === null)
-        this.toastrService.error("حدث خطأ، يرجى إعادة المحاولة");
+        this.toastrService.error("حدثت مشكلة، يرجى إعادة المحاولة");
       else this.records = result;
     });
   }

Clinics.Frontend/src/app/pipes/arabic-date.pipe.ts

+import { Pipe, PipeTransform } from '@angular/core';
+
+@Pipe({
+  name: 'arabicDate'
+})
+export class ArabicDatePipe implements PipeTransform {
+
+  transform(value: any, args?: any): any {
+    const days = ['الأحد', 'الإثنين', 'الثلاثاء', 'الأربعاء', 'الخميس', 'الجمعة', 'السبت'];
+    const months = ['كانون الثاني', 'شباط', 'آذار', 'نيسان', 'أيار', 'حزيران', 'تموز', 'آب', 'أيلول', 'تشرين الأول', 'تشرين الثاني', 'كانون الأول'];
+
+    const date = new Date(value);
+    const day = days[date.getDay()];
+    const year = date.getFullYear();
+    const month = months[date.getMonth()];
+    const dayOfMonth = date.getDate();
+
+    return `${day} في ${dayOfMonth}/${month}/${year}`;
+  }
+
+}

Clinics.Frontend/src/app/services/visits/visits.service.ts

+import { HttpClient, HttpErrorResponse } from '@angular/common/http';
+import { Injectable } from '@angular/core';
+import * as config from '../../../../config';
+import { catchError, map, Observable, of } from 'rxjs';
+import { VisitView } from '../../classes/visit/visit-view';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class VisitsService {
+
+  constructor(private http: HttpClient) { }
+  private readonly VISITS_ENDPOINT: string = `${config.apiUrl}/Visits`
+
+  getAllByPatientId(patientId: number):
+    Observable<{status: boolean, errorMessage: string | null, visits: VisitView[] | null}> {
+      return this.http.get<{visits: VisitView[]}>(`${this.VISITS_ENDPOINT}/${patientId}`)
+      .pipe(
+        map((response: {visits: VisitView[]}) => {
+          return {status: true, errorMessage: null, visits: response.visits};
+        }),
+        catchError((error: HttpErrorResponse) => {
+          console.error(error.error.detail);
+          return of ({status: false, errorMessage: error.error.detail, visits: null});
+        })
+      )
+    }
+}