agdar/appointments/templates/appointments/available_group_sessions.html
Marwan Alwali 2f1681b18c update
2025-11-11 13:44:48 +03:00

166 lines
9.3 KiB
HTML

{% extends "base.html" %}
{% load i18n %}
{% load static %}
{% block title %}{% trans "Available Group Sessions" %}{% endblock %}
{% block content %}
<div class="container-fluid">
<div class="row mb-4">
<div class="col-md-12">
<div class="d-flex justify-content-between align-items-center">
<h2>{% trans "Available Group Sessions" %}</h2>
<div>
<a href="{% url 'appointments:session_list' %}" class="btn btn-secondary">
<i class="fas fa-list"></i> {% trans "All Sessions" %}
</a>
<a href="{% url 'appointments:group_session_create' %}" class="btn btn-primary">
<i class="fas fa-plus"></i> {% trans "Create New Session" %}
</a>
</div>
</div>
</div>
</div>
<!-- Filters -->
<div class="row mb-4">
<div class="col-md-12">
<div class="card">
<div class="card-body">
<form method="get" class="row g-3">
<div class="col-md-3">
<label for="clinic" class="form-label">{% trans "Clinic" %}</label>
<select name="clinic" id="clinic" class="form-select">
<option value="">{% trans "All Clinics" %}</option>
{% for clinic in clinics %}
<option value="{{ clinic.id }}" {% if request.GET.clinic == clinic.id|stringformat:"s" %}selected{% endif %}>
{{ clinic.name_en }}
</option>
{% endfor %}
</select>
</div>
<div class="col-md-3">
<label for="service_type" class="form-label">{% trans "Service Type" %}</label>
<input type="text" name="service_type" id="service_type" class="form-control"
value="{{ request.GET.service_type }}" placeholder="{% trans 'e.g., Group Therapy' %}">
</div>
<div class="col-md-2">
<label for="date_from" class="form-label">{% trans "From Date" %}</label>
<input type="date" name="date_from" id="date_from" class="form-control"
value="{{ request.GET.date_from }}">
</div>
<div class="col-md-2">
<label for="date_to" class="form-label">{% trans "To Date" %}</label>
<input type="date" name="date_to" id="date_to" class="form-control"
value="{{ request.GET.date_to }}">
</div>
<div class="col-md-2 d-flex align-items-end">
<button type="submit" class="btn btn-primary w-100">
<i class="fas fa-search"></i> {% trans "Search" %}
</button>
</div>
</form>
</div>
</div>
</div>
</div>
<!-- Available Sessions -->
<div class="row">
<div class="col-md-12">
{% if sessions %}
<div class="row">
{% for session in sessions %}
<div class="col-md-6 col-lg-4 mb-4">
<div class="card h-100">
<div class="card-header bg-info text-white">
<h5 class="mb-0">
<i class="fas fa-users"></i> {{ session.service_type }}
</h5>
</div>
<div class="card-body">
<p><strong>{% trans "Session" %}:</strong> {{ session.session_number }}</p>
<p><strong>{% trans "Provider" %}:</strong> {{ session.provider.user.get_full_name }}</p>
<p><strong>{% trans "Clinic" %}:</strong> {{ session.clinic.name_en }}</p>
<p><strong>{% trans "Date" %}:</strong> {{ session.scheduled_date|date:"l, F d, Y" }}</p>
<p><strong>{% trans "Time" %}:</strong> {{ session.scheduled_time|time:"H:i" }}</p>
<p><strong>{% trans "Duration" %}:</strong> {{ session.duration }} {% trans "min" %}</p>
<hr>
<div class="mb-2">
<strong>{% trans "Capacity" %}:</strong>
<div class="progress mt-1" style="height: 25px;">
<div class="progress-bar {% if session.capacity_percentage > 75 %}bg-warning{% else %}bg-success{% endif %}"
role="progressbar"
style="width: {{ session.capacity_percentage }}%">
{{ session.current_capacity }}/{{ session.max_capacity }}
</div>
</div>
<small class="text-muted">{{ session.available_spots }} {% trans "spots available" %}</small>
</div>
</div>
<div class="card-footer">
<div class="d-grid gap-2">
<a href="{% url 'appointments:session_detail' session.pk %}" class="btn btn-primary">
<i class="fas fa-eye"></i> {% trans "View Details" %}
</a>
<a href="{% url 'appointments:session_add_patient' session.pk %}" class="btn btn-success">
<i class="fas fa-user-plus"></i> {% trans "Add Patient" %}
</a>
</div>
</div>
</div>
</div>
{% endfor %}
</div>
<!-- Pagination -->
{% if is_paginated %}
<nav aria-label="Page navigation">
<ul class="pagination justify-content-center">
{% if page_obj.has_previous %}
<li class="page-item">
<a class="page-link" href="?page=1{% if request.GET.clinic %}&clinic={{ request.GET.clinic }}{% endif %}{% if request.GET.service_type %}&service_type={{ request.GET.service_type }}{% endif %}">{% trans "First" %}</a>
</li>
<li class="page-item">
<a class="page-link" href="?page={{ page_obj.previous_page_number }}{% if request.GET.clinic %}&clinic={{ request.GET.clinic }}{% endif %}{% if request.GET.service_type %}&service_type={{ request.GET.service_type }}{% endif %}">{% trans "Previous" %}</a>
</li>
{% endif %}
<li class="page-item active">
<span class="page-link">
{% trans "Page" %} {{ page_obj.number }} {% trans "of" %} {{ page_obj.paginator.num_pages }}
</span>
</li>
{% if page_obj.has_next %}
<li class="page-item">
<a class="page-link" href="?page={{ page_obj.next_page_number }}{% if request.GET.clinic %}&clinic={{ request.GET.clinic }}{% endif %}{% if request.GET.service_type %}&service_type={{ request.GET.service_type }}{% endif %}">{% trans "Next" %}</a>
</li>
<li class="page-item">
<a class="page-link" href="?page={{ page_obj.paginator.num_pages }}{% if request.GET.clinic %}&clinic={{ request.GET.clinic }}{% endif %}{% if request.GET.service_type %}&service_type={{ request.GET.service_type }}{% endif %}">{% trans "Last" %}</a>
</li>
{% endif %}
</ul>
</nav>
{% endif %}
{% else %}
<div class="card">
<div class="card-body">
<div class="alert alert-info text-center">
<i class="fas fa-info-circle fa-3x mb-3"></i>
<h4>{% trans "No Available Group Sessions" %}</h4>
<p>{% trans "There are currently no group sessions with available capacity matching your criteria." %}</p>
<a href="{% url 'appointments:group_session_create' %}" class="btn btn-primary mt-2">
<i class="fas fa-plus"></i> {% trans "Create New Group Session" %}
</a>
</div>
</div>
</div>
{% endif %}
</div>
</div>
</div>
{% endblock %}