{% extends "base.html" %}
{% load static %}
{% load crispy_forms_tags %}
{% block title %}
<title>Mother Organization</title>
{% endblock title %}

{% block Style %}
<style>
  .search {
    width: 94%!important;
  }
</style>

{% endblock Style %}

{% block MainContent %}

<div class="modal fade" tabindex="-1" role="dialog" id="modal">
  <div class="modal-dialog" role="document">
    <div class="modal-content"></div>
  </div>
</div>


<div class="modal fade" id="create-modal" data-bs-backdrop="static" tabindex="-1" role="dialog" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
    </div>
  </div>
</div>
<div class="contents">
  {% 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 %}
  <div class="table-area">

    <!-- table-title -->
    <div class="table-title">
      <div class="row">
        <div class="col-md-4">
          <div class="mother-rganization-name">
            <h4>Mother Organizations</h4>
          </div>
        </div>
        <div class="col-md-8">
          <div class="add-btn">
            <ul>
              {% if request.user.is_superuser == True %}
              <li>
                <button id="mother-rganization" class="cus-btn"  type="button" name="button">
                  <i class="fa fa-plus-circle" aria-hidden="true"></i>
                  Mother-Organizations
              </button>
              </li>
              {% endif %}
            </ul>
          </div>
        </div>
      </div>
    </div>

    <!-- table-title -->
    
    {% if mother_organizations %}
      <div class="table-header">
        <div class="row">

          <div class="col-md-3">
            <div class="data-search">
                <div class="input-group search">
                    <input type="search" class="form-control" id="searchMotherOrganization" placeholder="Search...">
                    <span class="input-group-text" id="search-btn"><i class="fa fa-search" aria-hidden="true"></i></span>
                </div>
            </div>
    
        </div>
      </div>
      <div class="tables table-responsive" id="mother-organization">
          <table class="table  table-striped table-hover">
              <thead>
                  <tr>
                      <th class="text-center">SL No</th>
                      <th>Mother Organization Name (English)</th>
                      <th>Mother Organization (Bengali) </th>
                      <th class="text-center">Number of User </th>
                      <th>Sister Concern </th>
                      <th>Action</th>
                  </tr>
              </thead>
              <tbody>
              {% for mother_organization in mother_organizations  %}
                  <tr>
                      <td class="text-center">{{forloop.counter}}</td>
                      <td>{{ mother_organization.name_en }}</td>
                      <td>{{ mother_organization.name_bn }}</td>
                      <td class="text-center">{{ mother_organization.number_of_user }}</td>
                      {% if mother_organization.has_sister_concern == True %}
                          <td>YES</td>
                      {% else %}
                          <td>NO</td>
                      {% endif %}
                      <td>
                      <ul class="action">
                          {% if request.user.is_superuser == True %}
                          <li>
                              <a type="button" class="mother-organization" data-form-url="{% url 'mother_organization_update' mother_organization.id %}">
                                <i class="fa fa-pencil" aria-hidden="true"></i>
                                
                              </a>
                            </li>
                          
                          <li>
                              <a  onclick="SweetDelete(event,this.href)" href="{% url 'mother_organization_delete' mother_organization.id %}">
                                  <i class="fa fa-trash" aria-hidden="true"></i>
                                  
                              </a>
                          </li>
                          {% endif %}
                      </ul>
                  </td>
                  </tr>
                  {% endfor %}
              </tbody>
          </table>
      </div>

{% if mother_organizations.has_other_pages %}
 <nav aria-label="Page navigation example">
    <ul class="pagination justify-content-end">
        {% if mother_organizations.has_previous %}
          <li class="page-item" >
                <a href="?page={{ mother_organizations.previous_page_number }}" class="page-link" tabindex="-1">Previous</a>
            </li>
          {% if mother_organizations.number > 3 %}
          <li class="page-item">
            <a class="page-link" href="?page=1">1</a>
          </li>
            {% if mother_organizations.number > 4 %}

            <li class="page-item">
            <span class="page-link">...</span>
            </li>
            {% endif %}
          {% endif %}
        {% endif %}

        {% for num in mother_organizations.paginator.page_range %}
          {% if mother_organizations.number == num %}
          <li class="page-item active">
            <a class="page-link" href="?page={{ num }}">{{ num }}</a>
          </li>
          {% elif num > mother_organizations.number|add:'-3' and num < mother_organizations.number|add:'3' %}
          <li class="page-item">
            <a class="page-link" href="?page={{ num }}">{{ num }}</a>
          </li>
          {% endif %}
        {% endfor %}

        {% if mother_organizations.has_next %}
          {% if mother_organizations.number < mother_organizations.paginator.num_pages|add:'-3' %}
            <li class="page-item">
            <span class="page-link">...</span>
            </li>
            <li class="page-item">
            <a class="page-link" href="?page={{ mother_organizations.paginator.num_pages }}">{{ mother_organizations.paginator.num_pages }}</a>
            </li>
          {% elif mother_organizations.number < mother_organizations.paginator.num_pages|add:'-2' %}
          <li class="page-item">
            <a class="page-link" href="?page={{ mother_organizations.paginator.num_pages }}">{{ mother_organizations.paginator.num_pages }}</a>
          </li>
          {% endif %}
          <li class="page-item">
          <a href="?page={{ mother_organizations.next_page_number }}" class="page-link">Next</a>
          </li>
        {% endif %}
    </ul>  
  </nav> 
{% endif %}  
    </div>
    {% else %}
    <div class="tables table-responsive" id="mother-rganization">
      <table class="table  table-striped table-hover">
          <thead>
              <tr>
                  <th class="text-center">SL No</th>
                  <th>Mother Organization Name(English) </th>
                  <th>Mother Organization(Bengali) </th>
                  <th class="text-center">Number of User </th>
                  <th>Sister Concern </th>
                  <th>Action</th>
              </tr>
          </thead>
          <tbody>
              <tr>
                <td style="text-align: center;" colspan="10">No Data Found</td>
              </tr>
          </tbody>
      </table>
  </div>
    {% endif %}
</div>


{% endblock MainContent %}
{% block meassage %}

{% include 'notifications/notifications.html' %}

{% endblock meassage %}

{% block JS %}

<script type=text/javascript>
  var create = "{% url 'mother_organization_create' %}"
  var redirect_url = "{% url 'mother_organization_index' %}"
  var ajax_search_url = "{% url 'search-mother_organization' %}"
</script>
<script src="{% static 'js/mother_organization/index.js' %} "></script>

{% endblock JS %}