{% extends 'doctor/base.html' %}
{% load static %}
{% load i18n %}


{% block header.add_script %}
    <style rel="stylesheet">
        .dropdown-menu li {
        position: relative;
        }
        .dropdown-menu .dropdown-submenu {
        display: none;
        position: absolute;
        left: 100%;
        top: -7px;
        }
        .dropdown-menu .dropdown-submenu-left {
        right: 100%;
        left: auto;
        }
        .dropdown-menu > li:hover > .dropdown-submenu {
        display: block;
        }
    </style>
{% endblock %}

{% block sidebar.dashboard %} {% endblock %}
{% block sidebar.patients %} class="active" {% endblock %}



{% block content %}
    <div class="content">
        <div class="row">
            <div class="col-sm-4 col-3">
                <h4 class="page-title">{% trans "لیست کاربران" %}</h4>
            </div>
            <div class="col-sm-8 col-9 text-right m-b-20">
                <a href="#" class="btn btn btn-primary btn-rounded float-right"><i class="fa fa-plus"></i> Add Patient</a>
            </div>
        </div>
        <div class="row">
            <div class="col-md-12">
                <div class="table-responsive">
                    <table class="table table-border table-striped custom-table mb-0" id="patients_table">
                        <thead>
                            <tr>
                                <th></th>
                                <th>{% trans "نام" %}</th>
                                <th>{% trans "نام خانوادگی" %}</th>
                                <th>{% trans "تغییرات وزن" %}</th>
                                <th>{% trans "سن" %}</th>
                                <th>{% trans "جنسیت" %}</th>
                                <th>{% trans "تحت نظر (پزشک / دستیار پزشک)" %}</th>
                                <th>{% trans "بیماری ها" %}</th>
                                <th>{% trans "پیام های کاربر" %}</th>
                                <th>{% trans "امتیاز روزانه" %}</th>
                                <th>{% trans "اشتراک" %}</th>
                                <th>{% trans "گروه" %}</th>                                
                                <th>{% trans "آخرین رژیم" %}</th>
                                <th>{% trans "نوع پلن" %}</th>                                
                                <th>{% trans "پرونده" %}</th>
                                <th class="text-right">{% trans "تغیر مربی" %}</th>
                                <th class="text-right">{% trans "تغییرات" %}</th>
                            </tr>
                        </thead>
                        <tbody>
                            {% for patient, weight, number, sub, new, point, total, group, diet, plan_type in patients_list %}
                                {% if new %}
                                    <tr style="background-color: rgba(148,149,236,0.52)">
                                {% else %}
                                    <tr>
                                {% endif %}
                                    <td>
                                        <img width="28" height="28" src="{% static 'panel/doctor' %}/img/user.jpg" class="rounded-circle m-r-5" alt="">
                                        {% if number != 0 %}
                                            <span class="badge badge-pill bg-success float-left">{{ number }}</span>
                                        {% endif %}
                                    </td>
                                    <td><h5>{{ patient.profile.first_name }}</h5></td>
                                    <td><h5>{{ patient.profile.last_name }}</h5></td>
                                    {% if weight >= 0 %}
                                        <td style="background-color: rgba(50,189,96,0.67)">+{{ weight }}</td>
                                    {% else %}
                                        <td style="background-color: rgba(229,94,79,0.82)">{{ weight }}</td>
                                    {% endif %}
                                    <td>{{ patient.profile.age }}</td>
                                    {% if patient.profile.gender %}
                                        <td>{% trans "زن" %}</td>
                                    {% elif patient.profile.gender == False %}
                                        <td>{% trans "مرد" %}</td>
                                    {% endif %}
                                    <td>{{ patient.profile.therapist.first_name }} {{ patient.profile.therapist.last_name }}</td>
                                    <td>{{ patient.profile.diseases }}</td>
                                    <td class="text-center">{{  total  }}</td>
                                    <td class="text-center">{{  point  }}</td>
                                    {% if sub <= 0 %}
                                        <td class="text-center" style="background-color: rgba(255,0,0,0.36); border-radius: 20px;">{% trans "ندارد" %}</td>
                                    {% elif sub <= 5 %}
                                        <td class="text-center" style="background-color: rgba(255,221,0,0.52); border-radius: 20px;">{{ sub }}</td>
                                    {% else %}
                                        <td class="text-center" style="background-color: rgba(80,180,152,0.25); border-radius: 20px;">{{ sub }}</td>
                                    {% endif %}
                                    <td>{{ group }}</td>
                                    <td>{{ diet }}</td>
                                    <td style="text-align: center; font-weight: bold;">{{ plan_type }}</td>
                                    <td>
                                        <a href="{% url 'panel-doctor' %}show/patient/{{ patient.id }}/">
                                            <button type="button" class="btn btn-success btn-lg">{% trans "مشاهده" %}</button>
                                        </a>
                                    </td>
                                    {% if patient.profile.therapist.first_name != "" and patient.profile.therapist.first_name != "Ziluck" and patient.profile.therapist.last_name != "Team" %}
                                        <td class="text-right">
                                            <div class="column">
                                                <div class="dropdown dropdown-action">
                                                    <a href="#" class="action-icon dropdown-toggle" data-toggle="dropdown" aria-expanded="false"><i class="fa fa-pencil m-r-5">{% trans "تغییرات" %}</i></a>
                                                    <div class="dropdown-menu dropdown-menu-right" style="height: auto; max-height: 200px; overflow-x: hidden;">
                                                        {% for assistant in assistants %}
                                                            {% if assistant.first_name != patient.profile.therapist.first_name and assistant.last_name != patient.profile.therapist.last_name %}
                                                                <a class="dropdown-item" href="{% url 'panel-doctor' %}assign/{{ patient.id }}/to/{{ assistant.id }}/">{{ assistant }}</a>
                                                            {% endif %}
                                                        {% endfor %}
                                                    </div>
                                                </div>
                                                <div class="text-right">
                                                    <a class="dropdown-item" href="{% url 'panel-doctor' %}assign/{{ patient.id }}/to/0/"><i class="fa fa-trash-o m-r-5"></i>{% trans "حذف" %}</a>
                                                </div>
                                            </div>

                                        </td>
                                    {% else %}
                                        <td class="text-right">
                                            <div class="dropdown dropdown-action">
                                                <a href="#" class="action-icon dropdown-toggle" data-toggle="dropdown" aria-expanded="false"><i class="fa fa-ellipsis-v"></i></a>
                                                <div class="dropdown-menu dropdown-menu-right" style="height: auto; max-height: 200px; overflow-x: hidden;">
                                                    {% for assistant in assistants %}
                                                        <a class="dropdown-item" href="{% url 'panel-doctor' %}assign/{{ patient.id }}/to/{{ assistant.id }}/">{{ assistant }}</a>
                                                    {% endfor %}
                                                </div>
                                            </div>
                                        </td>
                                    {% endif %}

                                    <td class="text-right">
                                        <div class="dropdown dropdown-action">
                                            <a href="#" class="action-icon dropdown-toggle" data-toggle="dropdown" aria-expanded="false"><i class="fa fa-ellipsis-v"></i></a>
                                            <div class="dropdown-menu dropdown-menu-right">
                                                <a class="dropdown-item" href="edit-patient.html"><i class="fa fa-pencil m-r-5"></i> Edit</a>
                                                <a class="dropdown-item" href="#" data-toggle="modal" data-target="#delete_patient"><i class="fa fa-trash-o m-r-5"></i> Delete</a>
                                            </div>
                                        </div>
                                    </td>

                                </tr>
                            {% endfor %}
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
{% endblock %}

{% block delete %}
    <div id="delete_patient" class="modal fade delete-modal" role="dialog">
        <div class="modal-dialog modal-dialog-centered">
            <div class="modal-content">
                <div class="modal-body text-center">
                    <img src="{% static 'panel/doctor' %}/img/sent.png" alt="" width="50" height="46">
                    <h3>{% trans "آیا از حذف این کاربر مطمئن هستید؟" %}</h3>
                    <div class="m-t-20"> <a href="#" class="btn btn-white" data-dismiss="modal">{% trans "بستن" %}</a>
                        <a href="{% url 'panel-doctor-patients' %}"><button type="submit" class="btn btn-danger">{% trans "حذف" %}</button></a>
                    </div>
                </div>
            </div>
        </div>

    </div>
{% endblock %}


{% block script %}
    <script src="{% static 'panel/doctor' %}/js/jquery-3.2.1.min.js"></script>
    <script src="{% static 'panel/doctor' %}/js/popper.min.js"></script>
    <script src="{% static 'panel/doctor' %}/js/bootstrap.min.js"></script>
    <script src="{% static 'panel/doctor' %}/js/jquery.slimscroll.js"></script>
    <script src="{% static 'panel/doctor' %}/js/select2.min.js"></script>
    <script src="{% static 'panel/doctor' %}/js/jquery.dataTables.min.js"></script>
    <script src="{% static 'panel/doctor' %}/js/dataTables.bootstrap4.min.js"></script>
    <script src="{% static 'panel/doctor' %}/js/moment.min.js"></script>
    <script src="{% static 'panel/doctor' %}/js/bootstrap-datetimepicker.min.js"></script>
    <script src="{% static 'panel/doctor' %}/js/app.js"></script>
    <link rel="stylesheet" href="https://cdn.datatables.net/1.11.5/css/jquery.dataTables.min.css">
    <!-- If you want the Bootstrap 4 styling for DataTables -->
    <link rel="stylesheet" href="https://cdn.datatables.net/1.11.5/css/dataTables.bootstrap4.min.css">

    <!-- jQuery (must be before DataTables JS) -->
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <!-- DataTables JS -->
    <script src="https://cdn.datatables.net/1.11.5/js/jquery.dataTables.min.js"></script>
    <!-- If you want Bootstrap styling for DataTables -->
    <script src="https://cdn.datatables.net/1.11.5/js/dataTables.bootstrap4.min.js"></script>
    <script> $(document).ready(function () {$('.assign-to-link').popover(); }); </script>
    <script>
      // Initialize DataTables for the table with ID 'patients_table'
      $(document).ready(function() {
          $('#patients_table').DataTable({
              paging: true,
              searching: true,    // Enable the search box
              info: true,
              lengthChange: true,
              pageLength: 100,
              language: {
                  search: "جستجو:",
                  paginate: {
                      next: "بعدی",
                      previous: "قبلی"
                  },
                  info: "نمایش _START_ تا _END_ از _TOTAL_ ورودی",
                  lengthMenu: "نمایش _MENU_ ورودی در هر صفحه",
                  emptyTable: "هیچ داده‌ای موجود نیست",
              }
          });
      });
    </script>
{% endblock %}