Dashboard Page - Appointments:

- create separate dashboard components for doctor and patient - add appointments to dashboard components - add code to backend for appointments retrieval
2024-04-30 12:48:19 +03:00
parent 1ff7f51aa6
commit 7e38d60802
17 changed files with 665 additions and 30 deletions
@@ -0,0 +1,269 @@
+@using System.Text.Json
+@using HealthcareManagerUiWebAssem.Models
+@using HealthcareManagerUiWebAssem.Services.Profile
+@using HealthcareManagerUiWebAssem.Services.Appointment
+@using HealthcareManagerUiWebAssem.Services.User
+@inject UserService UserService
+@inject IProfileService ProfileService
+@inject IAppointmentService AppointmentService
+@inject IJSRuntime JS
+
+<div class="container mt-3">
+    <h2 class="landingTitle">Patient Menu</h2>
+    <p class="landingSubtitle">Here you can manage appointments, review your medical history and chat with doctors.</p>
+    <div id="accordion">
+        <div class="card">
+            <div class="card-header">
+                <a class="btn" data-bs-toggle="collapse" href="#collapseOne">
+                    Appointments
+                </a>
+            </div>
+            <div id="collapseOne" class="collapse show" data-bs-parent="#accordion">
+                <div class="card-body">
+                    <button @onclick="ShowAddAppointmentModal" class="btn btn-primary">Add Appointment</button>
+                    <table class="table">
+
+                        <thead>
+
+                        <tr>
+
+                            <th>Doctor Name</th>
+
+                            <th>Appointment Time</th>
+
+                            <th>Delete</th>
+
+                        </tr>
+
+                        </thead>
+
+                        <tbody>
+
+                        @foreach (var appointment in appointments)
+
+                        {
+
+                        @foreach (var date in appointment.AppointmentsList)
+
+                        {
+
+                        <tr>
+
+                            <td>@GetDoctorName(new Guid(appointment.DoctorId))</td>
+
+                            <td>@date.ToString("yyyy-MM-dd HH:mm")</td>
+
+                            <td><button class="btn btn-danger" @onclick="(() => DeleteAppointment(appointment))">Delete</button></td>
+
+                        </tr>
+
+                        }
+
+                        }
+
+                        </tbody>
+
+                    </table>
+                    <AppointmentTableComponent appointments="appointments" OnAppointmentDeleted="HandleAppointmentDeleted" />
+                </div>
+            </div>
+        </div>
+        <!-- ... other patient-specific cards ... -->
+    </div>
+    <div class="modal" id="addAppointmentModal" tabindex="-1" aria-labelledby="addAppointmentModalLabel" data-backdrop="false">
+
+        <div class="modal-dialog">
+
+            <div class="modal-content">
+
+                <div class="modal-header">
+
+                    <h5 class="modal-title" id="addAppointmentModalLabel">Add Appointment</h5>
+
+                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+
+                </div>
+
+                <div class="modal-body">
+
+                    @if (doctors != null)
+
+                    {
+
+                        <select @bind="selectedDoctorId" class="form-select">
+
+                            <option value="">Select a doctor</option>
+
+                            @foreach (var doctor in doctors)
+
+                            {
+
+                                <option value="@doctor.Id">@doctor.Name</option>
+
+                            }
+
+                        </select>
+
+                        <input type="datetime-local" @bind="selectedDate" class="form-control" />
+
+                    }
+
+                    else
+
+                    {
+
+                        <p>Loading doctors...</p>
+
+                    }
+
+                </div>
+
+                <div class="modal-footer">
+
+                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
+
+                    <button @onclick="CreateAppointment" type="button" class="btn btn-primary">Create Appointment</button>
+
+                </div>
+
+            </div>
+
+        </div>
+        </div>
+</div>
+
+@code {
+    private List<Doctor> doctors;
+    private string selectedDoctorId;
+    private DateTime? selectedDate;
+    private List<Appointment> appointments;
+    private List<byte[]> medicalHistoryFiles;
+    [Parameter] public string Role { get; set; }
+    
+    protected override async Task OnInitializedAsync()
+    {
+        await InitializeDoctors();
+        await LoadAppointments();
+    }
+    
+    private async Task LoadAppointments()
+    {
+        var response = await AppointmentService.GetAppointmentsByPatient(UserService.UserId);
+        var jsonOptions = new JsonSerializerOptions { PropertyNameCaseInsensitive = true };
+        if (response.StatusCode == HttpStatusCodes.OK)
+        {
+            appointments = JsonSerializer.Deserialize<List<Appointment>>(response.Data, jsonOptions) ?? new List<Appointment>();
+        }
+        else
+        {
+            appointments = new List<Appointment>();
+        }
+    }
+
+    private async Task ShowAddAppointmentModal()
+    {
+        await JS.InvokeVoidAsync("eval", "new bootstrap.Modal(document.getElementById('addAppointmentModal')).show();");
+    }
+
+    private async Task InitializeDoctors()
+    {
+        var response = await ProfileService.GetDoctors();
+        var jsonOptions = new JsonSerializerOptions { PropertyNameCaseInsensitive = true };
+        if (response.StatusCode == HttpStatusCodes.OK)
+        {
+            doctors = JsonSerializer.Deserialize<List<Doctor>>(response.Data, jsonOptions);
+        }
+        else
+        {
+            // Handle error
+        }
+    }
+
+    private async Task CreateAppointment()
+
+    {
+
+        if (string.IsNullOrEmpty(selectedDoctorId) || !selectedDate.HasValue)
+
+        {
+
+            // Handle validation
+
+            return;
+
+        }
+
+
+
+        // Call AddAppointment method, which is not shown here
+
+        var createAppointmentModel = new AppointmentManagementModel
+
+        {
+
+            PatientId = UserService.UserId,
+
+            DoctorId = new Guid(selectedDoctorId),
+
+            Appointment = (DateTime)selectedDate
+
+        };
+
+        
+
+        await AppointmentService.CreateAppointment(createAppointmentModel);
+
+        // You'll need to pass UserService.UserId, selectedDoctorId, and selectedDate.Value to it
+
+
+
+        // Close the modal after creation
+
+        await JS.InvokeVoidAsync("eval", "new bootstrap.Modal(document.getElementById('addAppointmentModal')).hide();");
+
+        
+
+        // Optionally, refresh the appointments list
+
+    }
+
+    
+
+    private void AddMedicalHistoryFile()
+
+    {
+
+        // Logic for adding a new appointment
+
+    }
+
+    private async Task DeleteAppointment(Appointment appointmentToDelete)
+
+    {
+
+        var appointmentModelToDelete = new AppointmentManagementModel
+
+        {
+
+            PatientId = new Guid(appointmentToDelete.PatientId),
+
+            DoctorId = new Guid(appointmentToDelete.DoctorId),
+
+            Appointment = appointmentToDelete.AppointmentsList.FirstOrDefault()
+
+        };
+
+        await AppointmentService.DeleteAppointment(appointmentModelToDelete);
+
+        appointments.Remove(appointmentToDelete);
+
+    }
+
+
+
+    private string GetDoctorName(Guid doctorId)
+    {
+        var doctor = doctors.Select(d => d).FirstOrDefault(d => d.Id == doctorId);
+        return doctor?.Name ?? string.Empty;
+    }
+}