{% extends 'base/base.html' %}
{% block title %} Patient Files{% endblock %}
{% block stylesheets %}
{% endblock stylesheets %}
{% block content %}



<div class="overlay"></div>

<div id="wrapper">

    <div id="main-content">
        
            <br>
           

    {% for item in client_files %}
    <div class="modal fade" id="editDocumentModal-{{forloop.counter}}" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel">Edit File</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <form method="post" action="{% url 'editClientFile' item.id %}" enctype="multipart/form-data">
                        {% csrf_token %}
                        <div class="row">
                          <div class="col mb-3">
                            <label for="documentType-{{forloop.counter}}">Document Type</label>
                            <select class="form-control" id="documentType-{{forloop.counter}}" name="documentType" required>
                                <option value="Image" {% if item.documentType == 'Image' %}selected{% endif %}>Image</option>
                                <option value="PDF" {% if item.documentType == 'PDF' %}selected{% endif %}>PDF</option>
                                <option value="Word Document" {% if item.documentType == 'Word Document' %}selected{% endif %}>Word Document</option>
                                <option value="Excel Spreadsheet" {% if item.documentType == 'Excel Spreadsheet' %}selected{% endif %}>Excel Spreadsheet</option>
                                <option value="Other" {% if item.documentType == 'Other' %}selected{% endif %}>Other</option>
                            </select>
                          </div>
                      </div>
                      <div class="row g-2">
                          <div class="col mb-3">
                            <label for="patientFile-{{forloop.counter}}">File</label>
                            <input type="file" class="form-control" id="patientFile-{{forloop.counter}}" name="patientFile">
                            {% if item.patientFile %}
                            <small class="form-text text-muted">
                                Current File: <a href="{{ item.patientFile.url }}" target="_blank">{{ item.patientFile.name }}</a>
                            </small>
                            {% endif %}
                          </div>
                         
                      </div>       
                   
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                    <button type="submit" class="btn btn-primary">Save Changes</button>
                </div>
            </form>
        
            </div>
        </div>
    </div>
    {% endfor %}


        {% if messages %}
{% for message in messages %}
        <div class="alert {% if message.tags == 'error' %}alert-danger{% else %}alert-success{% endif %} alert-dismissible" role="alert">
            <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
            <i class="fa fa-check-circle"></i> {{ message }}
        </div>
        {% endfor %}
        {% endif %}

        <div class="container-fluid">
            
            
        <div class="col-lg-12">
            <div class="card">
                <div class="card-header" style="background-color: white;">
                    <div class="row">
                        <div class="col-md-4">
                            <a href="{% url 'addClient' %}" type="button" class="btn btn-info" >Back</a>
                            </div>
                            <div class="col-md-4">
                                <h5><strong>View <u>{{clientData.name}}</u> Files</strong></h5>
                            </div>
                            <div class="col-md-4">
                            </div>
                        </div>
                    </div>

                    <div class="body">

                       
                        <table class="table table-bordered table-striped table-hover dataTable js-exportable" style="width:100%">
                            <thead>
                                <tr>
                                    <th>Sr.No</th>
                                    <th>Type</th>
                                    <th>File</th>
                                    {% if request.user.userRole == 'Manager' or  request.user.userRole == 'Radiologist' or request.user.userRole == 'Receptionist' %}
                                    {% else %}
                                    <th>Action</th>
                                    {% endif %}
                                </tr>
                            </thead>
                            
                            <tbody>
                                
                                {% for item in client_files %}
          <tr>
            <td>{{forloop.counter}}</td>
            <td>{{item.documentType}}</td>
           
            <td>
                {% if item.patientFile %}
                <a href="{{ item.patientFile.url }}" target="_blank">
                {{ item.patientFile.name }} 
                {% else %}
                N/A
                {% endif %}
            </a>
            </td>
          
            {% if request.user.userRole == 'Manager' or  request.user.userRole == 'Radiologist' or request.user.userRole == 'Receptionist' %}
            {% else %}
            <td > 
                <button type="button" class="btn btn-info" title="Edit"  data-toggle="modal" data-target="#editDocumentModal-{{forloop.counter}}"><i class="fa fa-edit"></i></button>
            <a href="{% url 'deleteClientFile' item.id%}" type="button" class="btn btn-danger" title="Delete"><i class="fa fa-trash"></i></a>
            </td>
            {% endif %}
            
          </tr>
          {% endfor %}
                                
                            </tbody>
                        </table>
                               
                    </div>        
                </div>
                     
                    </div>
                </div>
  
        </div>
    </div>
    
</div>


{% block javascripts %}
{% endblock javascripts %}
{% endblock content %}