{% extends "base.html" %}
{% load static %}
{% load crispy_forms_tags %}


{% block Style %}
<link rel='stylesheet' href='https://cdn.jsdelivr.net/npm/sweetalert2@10.10.1/dist/sweetalert2.min.css'>
<style>
    .right{
      text-align: right !important;
    }
  </style>

{% endblock Style %}

{% block MainContent %}

        {% if messages %}
        {% for message in messages %}
                <div class="alert alert-dismissible fade show {% if message.tags %}alert-{% if message.level == DEFAULT_MESSAGE_LEVELS.ERROR %}danger{% else %}{{ message.tags }}{% endif %}{% endif %}" role="alert">{{ message }}
                <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
              </div>
        {% endfor %}
        {% endif %}
        {% if request.user.is_superuser == True %}
        <div class="contents">
            <div class="table-area">
                <div class="table-title">
                    <div class="row">
                        <div class="col-md-4">
                            <div class="benefit-type">
                            <h4>Night Bill</h4>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="table-header bg-white">
                    <form method="post" id="personForm" data-cities-url="" novalidate>
                        {% csrf_token %}
                        <div class="row">
                            <div class="col-md-12">
                                <div class="row">
                                    <div class="col-md-3">
                                    {{form.mother_organization|as_crispy_field }}
                                    </div> 
                                    <div class="col-md-3">
                                    {{form.sister_organization|as_crispy_field }}
                                    </div> 
                                    <div class="col-md-3">
                                    {{form.branch|as_crispy_field }}
                                    </div> 
                                </div>
                                <div class="row">
                                    <div class="col-md-3">
                                        {{time_form.from_date|as_crispy_field }}
                                    </div>
                                    <div class="col-md-3">
                                        {{time_form.to_date|as_crispy_field }}
                                        </div>
                                    <div class="col-md-1" style="margin-top: 31px;">
                                    <button type="submit" class="cus-btn">Show</button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>

            </div>
        </div>
        {% endif %} 
        {% if request.user.user_type == 'Mother_Organization_admin' %}
        <div class="contents">
            <div class="table-area">
                <div class="table-title">
                    <div class="row">
                        <div class="col-md-4">
                            <div class="benefit-type">
                            <h4>Night Bill</h4>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="table-header bg-white">
                    <form method="post" id="personForm" data-cities-url="" novalidate>
                        {% csrf_token %}
                        <div class="row">
                            <div class="col-md-12">
                                <div class="row">
                                    <div class="col-md-3">
                                    {{form.sister_organization|as_crispy_field }}
                                    </div> 
                                    <div class="col-md-3">
                                    {{form.branch|as_crispy_field }}
                                    </div> 
                                    <div class="col-md-3">
                                        {{time_form.from_date|as_crispy_field }}
                                    </div>
                                    <div class="col-md-3">
                                        {{time_form.to_date|as_crispy_field }}
                                        </div>
                                    <div class="col-md-1" style="margin-top: 31px;">
                                    <button type="submit" class="cus-btn">Show</button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>

            </div>
        </div>
        {% endif %} 
        {% if request.user.user_type == 'Sister_Organization_admin' %}
        <div class="contents">
            <div class="table-area">
                <div class="table-title">
                    <div class="row">
                        <div class="col-md-4">
                            <div class="benefit-type">
                            <h4>Night Bill</h4>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="table-header bg-white">
                    <form method="post" id="personForm" data-cities-url="" novalidate>
                        {% csrf_token %}
                        <div class="row">
                            <div class="col-md-12">
                                <div class="row">
                                    <div class="col-md-3">
                                    {{form.branch|as_crispy_field }}
                                    </div> 
                                    <div class="col-md-3">
                                        {{time_form.from_date|as_crispy_field }}
                                    </div>
                                    <div class="col-md-3">
                                        {{time_form.to_date|as_crispy_field }}
                                        </div>
                                    <div class="col-md-1" style="margin-top: 31px;">
                                    <button type="submit" class="cus-btn">Show</button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>

            </div>
        </div>
        {% endif %} 
        {% if request.user.user_type == 'Branch' or request.user.user_type == 'Regular'%}
                <div class="contents">
            <div class="table-area">
                <div class="table-title">
                    <div class="row">
                        <div class="col-md-4">
                            <div class="benefit-type">
                            <h4>Night Bill</h4>
                            </div>
                        </div>

                        
                    </div>
                </div>
                <div class="table-header bg-white">
                    <form method="post" id="personForm" data-cities-url="" novalidate>
                        {% csrf_token %}
                        <div class="row">
                            <div class="col-md-12">
                                <div class="row">
                                    <div class="col-md-3">
                                        {{form.working_place|as_crispy_field }}
                                    </div>
                                    <div class="col-md-3">
                                        {{time_form.from_date|as_crispy_field }}
                                    </div>
                                    <div class="col-md-3">
                                        {{time_form.to_date|as_crispy_field }}
                                        </div>
                                    <div class="col-md-1" style="margin-top: 31px;">
                                    <button type="submit" class="cus-btn">Show</button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>

            </div>
        </div>
        {% endif %} 


{% if night_bill %}
<div class="contents">
<div class="table-area">
  <div class="right">
     <button onclick="ExportToExcel('xlsx')" class="cus-btn" style="width:70px; height:30px"><i class="fa fa-file-excel-o" aria-hidden="true"></i></button>
    <button type="button" id="employee-attendance-general-report-pdf-button" class="cus-btn" style="width:70px; height:30px"><i class="fa fa-print" style="font-size: 16px; color:#fff"></i></button>
  </div>
  <div class="tables table-responsive" id="employee-attendance-general-report-table-pdf">
    <div>
      <h3 style = 'text-align: center'>{{ sister_organization }}</h3>
      <h5 style = 'text-align: center'>{{ branch }}</h5>
      <h6 style = 'text-align: center'>{{ branch.address_details }}</h6>
    </div>
    <h3>Night Bill Report
        <small style = 'font-size: 15px; text-transform: capitalize;'> {% if line %} <small style = 'font-size: 15px; text-transform: capitalize;float: right'>&nbsp&nbsp &nbsp&nbsp &nbsp&nbsp{{line}} </small> {% endif %}
      {% if from_date %} <small style = 'font-size: 15px; float: right'>{{from_date}} &nbsp-&nbsp {{to_date}}</small> {% endif %}</h3></h3>
    <table class="table table-striped table-hover" id="night_bill_report">
        <thead>
          <tr>
            <th>SL </th>
            <th> Employee Code</th>
            <th> Name </th>
            <th>Designation</th>
            <th>Night Rate</th>
            <th> Total Night</th>
            <th> Amount  </th>
          </tr>
        </thead>
        <tbody>
            {% for item in night_bill  %}
            <tr>
              <td>
                  {{ forloop.counter }}
              </td>
              <td>
                  {{ item.0.employee_code}}   
              </td>
              <td>
                  {{ item.0.name_en}}   
              </td>
              <td>
                  {{ item.0.designation.name_en}}   
              </td>
               <td>
                  {{ item.2}}
              </td>
              <td>
                  {{ item.1}}
              </td>
              <td>
                  {{ item.3}}
              </td>
              {% comment %} <td>
                  <li>
                    <input class="form-check-input" type="checkbox" name="employee_id" value="{{item.0.employee.id}}" id="flexCheckDefault">
                  </li>
                </td>
              </tr> {% endcomment %}
             {% endfor %}
             <tr>
                <td colspan="6">Grand Toatal</td>
                <td>{{grand_total}}</td>
             </tr>

        </tbody>
    </table>
  </div>
</div>
{% endif %}
     
</div>

{% endblock MainContent %}
{% block meassage %}
  {% include 'notifications/notifications.html' %}               
{% endblock meassage %}
{% block JS %}
<script type="text/javascript" src="https://unpkg.com/xlsx@0.15.1/dist/xlsx.full.min.js"></script>
<script type=text/javascript>
    var load_sister_organization_url = "{% url 'sister-organization-load' %}"
    var load_branch_organization_url = "{% url 'load-branch-organization' %}"
    var load_department_url = "{% url 'ajax-load-department' %}"
    var load_designation_url = "{% url 'ajax-load-designation' %}"
    var load_work_place_url = "{% url 'work-place-load' %}"
    $(document).ready(function() {
        $("#id_working_place").select2({
            
        });
      });
    $("#checkAll").click(function () {
        $(".form-check-input").prop('checked', $(this).prop('checked'));
      });

      function printDiv(divName) {
        var originalContents = document.body.innerHTML
        var printContents = document.getElementById(divName).innerHTML;
        document.body.innerHTML = printContents;
        window.print();
        document.body.innerHTML = originalContents;
      }
    function ExportToExcel(type, fn, dl) {
                var elt = document.getElementById('night_bill_report');
                var wb = XLSX.utils.table_to_book(elt, { sheet: "sheet1" });
                return dl ?
                    XLSX.write(wb, { bookType: type, bookSST: true, type: 'base64' }) :
                    XLSX.writeFile(wb, fn || ('night_bill_report.' + (type || 'xlsx')));
            }
  </script>
<script src="{% static 'js/hr_app/leave_allocation/index.js' %} "></script>
<script src="{% static 'js/report_app/global_dependency_search/global_dependency_search.js' %} "></script>
<script src="{% static 'js/report_app/general_attendance_report/general_attendance_report.js' %} "></script>

{% endblock JS %}