{% extends 'super_admin_templates/base.html' %}
{% set path = "regions" %}
{% set subpath = "regions_list" %}
{% block content %}
<!-- Content Wrapper. Contains page content -->

 <script>
    /* function getServices(transactionAPIId,variablev,selectedid){
      if(transactionAPIId != "" && transactionAPIId != "undefined"){
        var htmldata="<option value=''>Select Service</option>";
     $.ajax({
        url: "http://18.188.39.218/api/super_admin/transaction_based_services_list",//{{ url_for('admin.dashboard') }}
        data: { "transactionId": transactionAPIId },
        dataType:"json",
        type: "post",
        success: function(resultdata){
          if(resultdata.responseStatus==1){
          $.each(resultdata.servicesList, function( key, value ) {
            if(selectedid!="" && selectedid==value.id){
            htmldata=htmldata+"<option selected value='"+value.id+"'>"+value.serviceName+"</option>";
          }else{
           htmldata=htmldata+"<option value='"+value.id+"'>"+value.serviceName+"</option>"; 
          }
              });
         $('#serviceId'+variablev).html(htmldata);
          }else{
            $('#serviceId'+variablev).html(htmldata);
          }
         
        }
    });
      }else{
        $('#serviceId'+variablev).html("<option value=''>Select Service</option>");
        alert('Please select Transaction api.');
      }
    
}*/

    
     /*function getOperators(operatorId,variablev,selectedid){
      if(operatorId != "" && operatorId != "undefined"){
        var htmldata="<option value=''>Select Operator Parameter</option>";
     $.ajax({
        url: "{{ url_for('service_configurations.operator_based_operator_parameters_list') }}",//{{ url_for('admin.dashboard') }}
        data: { "operatorId": operatorId },
        dataType:"json",
        type: "post",
        success: function(resultdata){
          if(resultdata.responseStatus==1){
          $.each(resultdata.operatorParametersList, function( key, value ) {
            if(selectedid!="" && selectedid==value.id){
              htmldata=htmldata+"<option selected value='"+value.id+"'>"+value.displayName+"</option>";
            }else{
              htmldata=htmldata+"<option value='"+value.id+"'>"+value.displayName+"</option>";
            }
              });
         $('#operatorParameterId'+variablev).html(htmldata);
          }else{
            $('#operatorParameterId'+variablev).html(htmldata);
          }
         
        }
    });
      }else{
        $('#operatorParameterId'+variablev).html("<option value=''>Select Operator Parameter</option>");
        alert('Please select operator parameter.');
      }
    
}*/

    /*function getsubOperators(operatorId,variablev,selectedid){
      if(operatorId != "" && operatorId != "undefined"){
        var htmldata="<option value=''>Select sub parameter</option>";
     $.ajax({
        url: "{{ url_for('service_configurations.operator_based_operator_sub_parameters_list') }}",
        data: { "operatorId": operatorId },
        dataType:"json",
        type: "post",
        success: function(resultdata){
          if(resultdata.responseStatus==1){
          $.each(resultdata.operatorSubParametersList, function( key, value ) {
            if(selectedid!="" && selectedid==value.id){
              htmldata=htmldata+"<option selected value='"+value.id+"'>"+value.displayName+"</option>";
            }else{
              htmldata=htmldata+"<option value='"+value.id+"'>"+value.displayName+"</option>";
            }
              });
         $('#operatorsubParameterId'+variablev).html(htmldata);
          }else{
            $('#operatorsubParameterId'+variablev).html(htmldata);
          }
         
        }
    });
      }else{
        $('#operatorsubParameterId'+variablev).html("<option value=''>Select sub parameter</option>");
        alert('Please select operator parameter.');
      }
    
}*/
</script>


<script>
/*function getOperatorGrouping(operatorParameterId,variablev,selectedid){
      if(operatorParameterId != "" && operatorParameterId != "undefined"){
        var htmldata="<option value=''>Select Parameter Grouping</option>";
     $.ajax({
        url: "{{ url_for('service_configurations.operator_parameter_based_operator_grouping_list') }}",
        data: { "operatorParameterId": operatorParameterId },
        dataType:"json",
        type: "post",
        success: function(resultdata){
          if(resultdata.responseStatus==1){
          $.each(resultdata.operatorGroupingList, function( key, value ) {
            if(selectedid!="" && selectedid==value.id){
              htmldata=htmldata+"<option selected value='"+value.id+"'>"+value.groupName+"</option>";
            }else{
              htmldata=htmldata+"<option value='"+value.id+"'>"+value.groupName+"</option>";
            }
              });
         $('#operatorGroupingId'+variablev).html(htmldata);
          }else{
            $('#operatorGroupingId'+variablev).html(htmldata);
          }
         
        }
    });
      }else{
        $('#operatorGroupingId'+variablev).html("<option value=''>Select Operator Parameter</option>");
        alert('Please select operator parameter.');
      }
    
}*/
</script>

<!-- Start::app-content -->
<div class="main-content app-content">
  <div class="container-fluid">
    <!-- Page Header -->
    <div class="d-md-flex d-block align-items-center justify-content-between my-4 page-header-breadcrumb">
      <h1 class="page-title fw-semibold fs-18 mb-0">Master Configuration</h1>
      <div class="ms-md-1 ms-0">
          <nav>
              <ol class="breadcrumb mb-0">
                  <li class="breadcrumb-item"><a href="{{ url_for('admin.dashboard') }}">Home</a></li>
                  <li class="breadcrumb-item active" aria-current="page">Locations</li>
              </ol>
          </nav>
      </div>
    </div>
    <!-- Page Header Close -->
    <!-- Start::row-1 -->
    <div class="row">
      <div class="col-xl-12">
        <div class="card custom-card">
          <div class="card-header">
            <div class="card-title">
               Locations List
            </div>
          </div>

          <div class="card-body">
            <nav class="nav nav-style-6 nav-pills mb-3 nav-justified d-sm-flex d-block" role="tablist">
              <a class="nav-link {% if redirectval == 'Region' %}active{% endif %}" data-bs-toggle="tab" role="tab" aria-current="page" href="#nav-region" aria-selected="true">Region</a>
              <a class="nav-link {% if redirectval == 'Country' %}active{% endif %}" data-bs-toggle="tab" role="tab" href="#nav-country" aria-selected="false">Country</a>
              <a class="nav-link {% if redirectval == 'State' %}active{% endif %}" data-bs-toggle="tab" role="tab" href="#nav-state" aria-selected="false">State</a>
              <a class="nav-link {% if redirectval == 'City' %}active{% endif %}" data-bs-toggle="tab" role="tab" href="#nav-cities" aria-selected="false">Cities</a>
              <a class="nav-link {% if redirectval == 'Block' %}active{% endif %}" data-bs-toggle="tab" role="tab" href="#nav-block" aria-selected="false">Block/PO</a>
              <a class="nav-link {% if redirectval == 'Pincode' %}active{% endif %}" data-bs-toggle="tab" role="tab" href="#nav-pincode" aria-selected="false">Pincode</a>
              
            </nav>
          
            <center>
                {% if error %}
                <h2><b><center style="color:RED">{{ error }}</center></b></h2>
                {% endif %}
            </center>

            <div class="tab-content">
              <div class="tab-pane fade {% if redirectval == 'Region' %}show active{% endif %}" id="nav-region" role="tabpanel">
                <div class="row">
                  <div class="col-xl-12">
                      <div class="d-flex justify-content-between align-items-center mb-4">
                          <form method="GET" action="{{ url_for('regions.regions_list')}}" class="row gy-2 gx-3 align-items-center">
                              <div class="col-auto">
                                  <input type="text" class="form-control" value="{{regions_search_element}}" name="regions_search_element" id="regions_search_element"
                                      placeholder="search element">
                              </div>
                              <div class="col-auto">
                                  <button type="submit" class="btn btn-primary">Search</button>
                              </div>
                          </form>
                          
                          <div class="prism-toggle">
                              <button type="button" class="btn btn-primary-light rounded-pill btn-wave" data-bs-toggle="modal" data-bs-target="#addRegionModal">
                                  <i class="ri-add-circle-line fs-16 align-middle me-1"></i>Add Region
                              </button>
                          </div>
                      </div>
                  </div>
                </div>


                <div class="mt-3"></div>
                  <div class="table-responsive">
                    <table id="datatable-basic" class="table text-nowrap"  style="padding-bottom: 200px;">
                      <thead class="table-primary">
                        <tr>
                         <th scope="col">S.No</th>
                         <th scope="col">Region Name</th>
                         <th scope="col">Region Type</th>
                         <th scope="col">Status</th>
                         <th scope="col">Action</th>
                      </thead>

                      <tbody>
                        {% for each_region in regionsList %}
                        <tr>
                          <td>{{each_region.snoCount}}</td>
                          <td>{{each_region.regionName}}</td>
                          <td>{{each_region.regionType}}</td>
                          <td>
                                {% if each_region.actionText == "Active" %}
                                  <a class="btn btn-sm btn-success-light" href="{{ url_for('regions.update_region_type_status', regionId=each_region.id) }}">{{ each_region.actionText }}</a>
                              {% else %}
                                  <a class="btn btn-sm btn-warning-light" href="{{ url_for('regions.update_region_type_status', regionId=each_region.id) }}">{{ each_region.actionText }}</a>
                              {% endif %}
                          </td>

                          <td>
                              <a href="javascript:void(0);" class="btn btn-icon btn-sm btn-info-transparent rounded-pill" data-bs-toggle="modal" data-bs-target="#editRegionModal{{ loop.index }}">
                                  <i class="ri-edit-line"></i>
                              </a>

                              <a href="javascript:void(0);" onclick="confirmDelete('{{ url_for('regions.delete_region', regionId=each_region.id) }}')"><span class="btn btn-icon btn-sm btn-danger-transparent rounded-pill"><i class="ri-delete-bin-line"></i></span></a>
                              </a>
                          </td>

                        {% endfor %}
                      </tbody>
                      {% with messages = get_flashed_messages() %}
                      {% if messages %}
                      <ul class=flashes>
                        {% for message in messages %}
                        <h2><b><center style="color:green">{{ message }}</center></b></h2>
                        {% endfor %}
                      </ul>
                      {% endif %}
                      {% endwith %}
                    </table>
                  </div>
                   <div class="col-sm-12 col-md-12 mt-3">
                      <nav aria-label="Page navigation" class="pagination-style-1">
                        <ul class="pagination mb-0">
                            {% if pagination %}
                                  <div class="pagination">
                                      {{ pagination.links }}
                                  </div>
                              {% endif %}
                        </ul>
                    </nav>
                  </div>
              </div>

              <div class="tab-pane fade {% if redirectval == 'Country' %}show active{% endif %}" id="nav-country" role="tabpanel">
                <div class="row">
                  <div class="col-xl-12">
                      <div class="d-flex justify-content-between align-items-center mb-4">
                          <form method="GET" action="{{ url_for('regions.regions_list')}}" class="row gy-2 gx-3 align-items-center">
                              <div class="col-auto">
                                  <input type="text" class="form-control" value="{{countries_search_element}}" name="countries_search_element" id="countries_search_element"
                                      placeholder="search element">
                              </div>
                              <div class="col-auto">
                                  <button type="submit" class="btn btn-primary">Search</button>
                              </div>
                          </form>
                          
                          <div class="prism-toggle">
                              <button type="button" class="btn btn-primary-light rounded-pill btn-wave" data-bs-toggle="modal" data-bs-target="#addCountryModal">
                                  <i class="ri-add-circle-line fs-16 align-middle me-1"></i>Add Country
                              </button>
                          </div>
                      </div>
                  </div>
                </div>


                <div class="mt-3"></div>
                <div class="table-responsive">
                  <table id="datatable-basic" class="table text-nowrap"  style="padding-bottom: 200px;">
                    <thead class="table-primary">
                      <tr>
                       <th scope="col">S.No</th>
                       <th scope="col">Country Name</th>
                      <th scope="col">Region Name</th>
                        <th scope="col">Regex</th>
                        <th scope="col"> Country Code</th>
                        <th scope="col">Flag</th>
                        <th scope="col">Status</th>
                        <th scope="col">Action</th>
                     </tr>
                    </thead>

                    <tbody>
                       {% for each_country in countriesList %}
                      <tr>
                        <td>{{each_country.snoCount}}</td>
                        <td>{{each_country.countryName}}</td>
                          <td>{{each_country.regionName}}</td>
                          <td>{{each_country.regex}}</td>
                          <td>{{each_country.countryCode}}</td>
                          <td><img src="{{each_country.countryFlag}}" alt="" border=3 height="50px" width="50px"></td>
                        
                          <td>
                              {% if each_country.actionText == "Active" %}
                                  <a class="btn btn-sm btn-success" href="{{ url_for('regions.update_country_type_status', countryId=each_country.id) }}">{{ each_country.actionText }}</a>
                              {% else %}
                                  <a class="btn btn-sm btn-warning" href="{{ url_for('regions.update_country_type_status', countryId=each_country.id) }}">{{ each_country.actionText }}</a>
                              {% endif %}
                          </td>

                        

                        <td>
                            <a href="javascript:void(0);" class="btn btn-icon btn-sm btn-info-transparent rounded-pill" data-bs-toggle="modal" data-bs-target="#editCountryModal{{ loop.index }}">
                                <i class="ri-edit-line"></i>
                            </a>

                            <a href="javascript:void(0);" onclick="confirmDelete('{{ url_for('regions.delete_country', countryId=each_country.id) }}')"><span class="btn btn-icon btn-sm btn-danger-transparent rounded-pill"><i class="ri-delete-bin-line"></i></span></a>
                            </a>
                        </td>

                      {% endfor %}
                    </tbody>
                    {% with messages = get_flashed_messages() %}
                    {% if messages %}
                    <ul class=flashes>
                      {% for message in messages %}
                      <h2><b><center style="color:green">{{ message }}</center></b></h2>
                      {% endfor %}
                    </ul>
                    {% endif %}
                    {% endwith %}
                  </table>
                </div>
                 <div class="col-sm-12 col-md-12 mt-3">
                      <nav aria-label="Page navigation" class="pagination-style-1">
                        <ul class="pagination mb-0">
                            {% if countryPagination %}
                                  <div class="pagination">
                                      {{ countryPagination.links }}
                                  </div>
                              {% endif %}
                        </ul>
                    </nav>
                  </div>

              </div>

              <div class="tab-pane fade {% if redirectval == 'State' %}show active{% endif %}" id="nav-state" role="tabpanel">

                <div class="row">
                  <div class="col-xl-12">
                      <div class="d-flex justify-content-between align-items-center mb-4">
                          <form method="GET" action="{{ url_for('regions.regions_list')}}" class="row gy-2 gx-3 align-items-center">
                              <div class="col-auto">
                                  <input type="text" class="form-control" value="{{states_search_element}}" name="states_search_element" id="states_search_element"
                                      placeholder="search element">
                              </div>
                              <div class="col-auto">
                                  <button type="submit" class="btn btn-primary">Search</button>
                              </div>
                          </form>
                          
                          <div class="prism-toggle">
                              <button type="button" class="btn btn-primary-light rounded-pill btn-wave" data-bs-toggle="modal" data-bs-target="#addStateModal">
                                  <i class="ri-add-circle-line fs-16 align-middle me-1"></i>Add State
                              </button>
                          </div>
                      </div>
                  </div>
                </div>


                <div class="mt-3"></div>
                <div class="table-responsive">
                  <table id="datatable-basic" class="table text-nowrap"  style="padding-bottom: 200px;">
                    <thead class="table-primary">
                      <tr>
                        <th scope="col">S.No</th>
                        <th scope="col">State Name</th>
                         <th scope="col">Country Name</th>
                         <th scope="col">Status</th>
                          <th scope="col">Action</th>
                     </tr>
                    </thead>

                    <tbody>
                        {% for each_state in statesList %}
                      <tr>
                        <td>{{each_state.snoCount}}</td>
                        <td>{{each_state.stateName}}</td>
                        <td>{{each_state.countryName}}</td>

                        
                        <td>
                            {% if each_state.actionText == "Active" %}
                                <a class="btn btn-sm btn-success" href="{{ url_for('regions.update_state_status', stateId=each_state.id) }}">{{ each_state.actionText }}</a>
                            {% else %}
                                <a class="btn btn-sm btn-warning" href="{{ url_for('regions.update_state_status', stateId=each_state.id) }}">{{ each_state.actionText }}</a>
                            {% endif %}
                        </td>

                        <td>
                            <a href="javascript:void(0);" class="btn btn-icon btn-sm btn-info-transparent rounded-pill" data-bs-toggle="modal" data-bs-target="#editStateModal{{ loop.index }}">
                                <i class="ri-edit-line"></i>
                            </a>

                            <a href="javascript:void(0);" onclick="confirmDelete('{{ url_for('regions.delete_state', stateId=each_state.id) }}')"><span class="btn btn-icon btn-sm btn-danger-transparent rounded-pill"><i class="ri-delete-bin-line"></i></span></a>
                            </a>
                        </td>

                      {% endfor %}
                    </tbody>
                    {% with messages = get_flashed_messages() %}
                    {% if messages %}
                    <ul class=flashes>
                      {% for message in messages %}
                      <h2><b><center style="color:green">{{ message }}</center></b></h2>
                      {% endfor %}
                    </ul>
                    {% endif %}
                    {% endwith %}
                  </table>
                </div>
                <div class="col-sm-12 col-md-12 mt-3">
                      <nav aria-label="Page navigation" class="pagination-style-1">
                        <ul class="pagination mb-0">
                            {% if statePagination %}
                                  <div class="pagination">
                                      {{ statePagination.links }}
                                  </div>
                              {% endif %}
                        </ul>
                    </nav>
                  </div>

              </div>
                        
              <div class="tab-pane fade {% if redirectval == 'City' %}show active{% endif %}" id="nav-cities" role="tabpanel">

                <div class="row">
                  <div class="col-xl-12">
                      <div class="d-flex justify-content-between align-items-center mb-4">
                          <form method="GET" action="{{ url_for('regions.regions_list')}}" class="row gy-2 gx-3 align-items-center">
                              <div class="col-auto">
                                  <input type="text" class="form-control" value="{{cities_search_element}}" name="cities_search_element" id="cities_search_element"
                                      placeholder="search element">
                              </div>
                              <div class="col-auto">
                                  <button type="submit" class="btn btn-primary">Search</button>
                              </div>
                          </form>
                          
                          <div class="prism-toggle">
                              <button type="button" class="btn btn-primary-light rounded-pill btn-wave" data-bs-toggle="modal" data-bs-target="#addCityModal">
                                  <i class="ri-add-circle-line fs-16 align-middle me-1"></i>Add Cities
                              </button>
                          </div>
                      </div>
                  </div>
                </div>


                <div class="mt-3"></div>
                <div class="table-responsive">
                          <table id="datatable-basic" class="table text-nowrap"  style="padding-bottom: 200px;">
                            <thead class="table-primary">
                              <tr>
                                <th scope="col">S.No</th>
                                <th scope="col">City Name</th>
                                 <th scope="col">State Name</th>
                                 <th scope="col">Status</th>
                                  <th scope="col">Action</th>
                             </tr>
                            </thead>

                            <tbody>
                               {% for each_city in citiesList %}
                              <tr>
                                <td>{{each_city.citysnoCount}}</td>
                                <td>{{each_city.cityName}}</td>
                                <td>{{each_city.stateName}}</td>

                                
                               <td>
                                    {% if each_city.actionText == "Active" %}
                                        <a class="btn btn-sm btn-success" href="{{ url_for('regions.update_city_status', cityId=each_city.id) }}">{{ each_city.actionText }}</a>
                                    {% else %}
                                        <a class="btn btn-sm btn-warning" href="{{ url_for('regions.update_city_status', cityId=each_city.id) }}">{{ each_city.actionText }}</a>
                                    {% endif %}
                                </td>
                                <td>
                                    <a href="javascript:void(0);" class="btn btn-icon btn-sm btn-info-transparent rounded-pill" data-bs-toggle="modal" data-bs-target="#editCityModal{{ loop.index }}">
                                        <i class="ri-edit-line"></i>
                                    </a>

                                    <a href="javascript:void(0);" onclick="confirmDelete('{{ url_for('regions.delete_city', cityId=each_city.id) }}')"><span class="btn btn-icon btn-sm btn-danger-transparent rounded-pill"><i class="ri-delete-bin-line"></i></span></a>
                                    </a>
                                </td>

                              {% endfor %}
                            </tbody>
                            {% with messages = get_flashed_messages() %}
                            {% if messages %}
                            <ul class=flashes>
                              {% for message in messages %}
                              <h2><b><center style="color:green">{{ message }}</center></b></h2>
                              {% endfor %}
                            </ul>
                            {% endif %}
                            {% endwith %}
                          </table>
                </div>
                 <div class="col-sm-12 col-md-12 mt-3">
                      <nav aria-label="Page navigation" class="pagination-style-1">
                        <ul class="pagination mb-0">
                            {% if cityPagination %}
                                  <div class="pagination">
                                      {{ cityPagination.links }}
                                  </div>
                              {% endif %}
                        </ul>
                    </nav>
                  </div>
              </div>

              <div class="tab-pane fade {% if redirectval == 'Block' %}show active{% endif %}" id="nav-block" role="tabpanel">

                <div class="row">
                  <div class="col-xl-12">
                      <div class="d-flex justify-content-between align-items-center mb-4">
                          <form method="GET" action="{{ url_for('regions.regions_list')}}" class="row gy-2 gx-3 align-items-center">
                              <div class="col-auto">
                                  <input type="text" class="form-control" value="{{blocks_search_element}}" name="blocks_search_element" id="blocks_search_element"
                                      placeholder="search element">
                              </div>
                              <div class="col-auto">
                                  <button type="submit" class="btn btn-primary">Search</button>
                              </div>
                          </form>
                          
                          <div class="prism-toggle">
                              <button type="button" class="btn btn-primary-light rounded-pill btn-wave" data-bs-toggle="modal" data-bs-target="#addBlockModal">
                                  <i class="ri-add-circle-line fs-16 align-middle me-1"></i>Add Block
                              </button>
                          </div>
                      </div>
                  </div>
                </div>


                <div class="mt-3"></div>
                <div class="table-responsive">
                  <table id="datatable-basic" class="table text-nowrap"  style="padding-bottom: 200px;">
                    <thead class="table-primary">
                      <tr>
                        <th scope="col">S.No</th>
                        <th scope="col">Block/PO Name</th>
                           <th scope="col">City Name</th>
                           <th scope="col">Status</th>
                            <th scope="col">Action</th>
                     </tr>
                    </thead>

                    <tbody>
                        {% for each_block in blocksList %} 
                      <tr>
                        <td>{{each_block.snoCount}}</td>
                          <td>{{each_block.name}}</td>
                          <td>{{each_block.cityName}}</td>

                        <td>
                              {% if each_block.actionText == "Active" %}
                                  <a class="btn btn-sm btn-success" href="{{ url_for('regions.update_block_status', blockId=each_block.id) }}">{{ each_block.actionText }}</a>
                              {% else %}
                                  <a class="btn btn-sm btn-warning" href="{{ url_for('regions.update_block_status', blockId=each_block.id) }}">{{ each_block.actionText }}</a>
                              {% endif %}
                          </td>

                          <td>
                              <a href="javascript:void(0);" class="btn btn-icon btn-sm btn-info-transparent rounded-pill" data-bs-toggle="modal" data-bs-target="#editBlockModal{{ loop.index }}">
                                  <i class="ri-edit-line"></i>
                              </a>

                              <a href="javascript:void(0);" onclick="confirmDelete('{{ url_for('regions.delete_block', blockId=each_block.id) }}')"><span class="btn btn-icon btn-sm btn-danger-transparent rounded-pill"><i class="ri-delete-bin-line"></i></span></a>
                              </a>
                          </td>

                      {% endfor %}
                    </tbody>
                    {% with messages = get_flashed_messages() %}
                    {% if messages %}
                    <ul class=flashes>
                      {% for message in messages %}
                      <h2><b><center style="color:green">{{ message }}</center></b></h2>
                      {% endfor %}
                    </ul>
                    {% endif %}
                    {% endwith %}
                  </table>
                </div>
                 <div class="col-sm-12 col-md-12 mt-3">
                      <nav aria-label="Page navigation" class="pagination-style-1">
                        <ul class="pagination mb-0">
                            {% if blockPagination %}
                                  <div class="pagination">
                                      {{ blockPagination.links }}
                                  </div>
                              {% endif %}
                        </ul>
                    </nav>
                  </div>
              </div>

              <div class="tab-pane fade {% if redirectval == 'Pincode' %}show active{% endif %}" id="nav-pincode" role="tabpanel">

                <div class="row">
                  <div class="col-xl-12">
                      <div class="d-flex justify-content-between align-items-center mb-4">
                          <form method="GET" action="{{ url_for('regions.regions_list')}}" class="row gy-2 gx-3 align-items-center">
                              <div class="col-auto">
                                  <input type="text" class="form-control" value="{{pincodes_search_element}}" name="pincodes_search_element" id="pincodes_search_element"
                                      placeholder="search element">
                              </div>
                              <div class="col-auto">
                                  <button type="submit" class="btn btn-primary">Search</button>
                              </div>
                          </form>
                          
                          <div class="prism-toggle">
                              <button type="button" class="btn btn-primary-light rounded-pill btn-wave" data-bs-toggle="modal" data-bs-target="#addPincodeModal">
                                  <i class="ri-add-circle-line fs-16 align-middle me-1"></i>Add Pincode
                              </button>
                          </div>
                      </div>
                  </div>
                </div>


                <div class="mt-3"></div>
                <div class="table-responsive">
                  <table id="datatable-basic" class="table text-nowrap"  style="padding-bottom: 200px;">
                    <thead class="table-primary">
                      <tr>
                        <tr>
                          <th scope="col">S.No</th>
                          <th scope="col">Pincode</th>
                           <th scope="col">Block/PO Name</th>
                           <th scope="col">Latitude</th>
                           <th scope="col">Longitude</th>
                           <th scope="col">Status</th>
                            <th scope="col">Action</th>
                        </tr>
                     </tr>
                    </thead>

                    <tbody>
                         {% for each_pincode in pincodesList %}
                      <tr>
                        <td>{{each_pincode.snoCount}}</td>
                         <td>{{each_pincode.pincode}}</td>
                          <td>{{each_pincode.blockName}}</td>
                          <td>{{each_pincode.latitude}}</td>
                          <td>{{each_pincode.longitude}}</td>
                        


                        <td>
                              {% if each_pincode.actionText == "Active" %}
                                  <a class="btn btn-sm btn-success" href="{{ url_for('regions.update_pincode_status', pincodeId=each_pincode.id) }}">{{ each_pincode.actionText }}</a>
                              {% else %}
                                  <a class="btn btn-sm btn-warning" href="{{ url_for('regions.update_pincode_status', pincodeId=each_pincode.id) }}">{{ each_pincode.actionText }}</a>
                              {% endif %}
                          </td>

                          <td>
                              <a href="javascript:void(0);" class="btn btn-icon btn-sm btn-info-transparent rounded-pill" data-bs-toggle="modal" data-bs-target="#editPincodeModal{{ loop.index }}">
                                  <i class="ri-edit-line"></i>
                              </a>

                              <a href="javascript:void(0);" onclick="confirmDelete('{{ url_for('regions.delete_pincode', pincodeId=each_pincode.id) }}')"><span class="btn btn-icon btn-sm btn-danger-transparent rounded-pill"><i class="ri-delete-bin-line"></i></span></a>
                              </a>
                          </td>

                      {% endfor %}
                    </tbody>
                    {% with messages = get_flashed_messages() %}
                    {% if messages %}
                    <ul class=flashes>
                      {% for message in messages %}
                      <h2><b><center style="color:green">{{ message }}</center></b></h2>
                      {% endfor %}
                    </ul>
                    {% endif %}
                    {% endwith %}
                  </table>
                </div>
                <div class="col-sm-12 col-md-12 mt-3">
                      <nav aria-label="Page navigation" class="pagination-style-1">
                        <ul class="pagination mb-0">
                            {% if pincodePagination %}
                                  <div class="pagination">
                                      {{ pincodePagination.links }}
                                  </div>
                              {% endif %}
                        </ul>
                    </nav>
                  </div>
              </div>

              
            </div>

          </div>

        </div>
      </div>
    </div>
  </div>
</div>



 <!-- Create New Region Modal -->
<div class="modal fade" id="addRegionModal" tabindex="-1" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h6 class="modal-title" id="mail-ComposeLabel">Add Region</h6>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <form method="POST" action="{{url_for('regions.add_region')}}" enctype="multipart/form-data">
              <div class="modal-body px-4">
                <div class="row">
                  <div class="col-md-6">
                    <div class="form-group">
                      <label for="regionName">Region Name*</label>
                      <input type="text" class="form-control" id="regionName" name="regionName" placeholder="Enter region name" required>
                    </div>
                  </div>

                  <div class="col-md-6">
                    <div class="form-group">
                      <label for="regionType">RegionType*</label>
                      <input type="text" class="form-control" id="regionType" name="regionType" placeholder="Enter region type" required>
                    </div>
                  </div>

                </div>
              </div>

              <div class="modal-footer justify-content-between">
                  <button type="button" class="btn btn-default" data-bs-dismiss="modal">Close</button>
                  <button type="submit" class="btn btn-primary" id="form_submit">Submit</button>
              </div>
            </form>
        </div>
    </div>
</div>
<!-- End -->

{% for each_region in regionsList %}
<div class="modal fade" id="editRegionModal{{ loop.index }}" tabindex="-1" role="dialog" aria-labelledby="editRegionModalLabel{{ loop.index }}" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="editRegionModalLabel{{ loop.index }}">Update Region</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <form method="POST" action="{{ url_for('regions.update_region', regionId=each_region.id) }}" enctype="multipart/form-data">
                    <div class="form-group">
                        <label for="regionName{{ loop.index }}">Region Name*</label>
                        <input type="text" class="form-control" id="regionName{{ loop.index }}" name="regionName" value="{{ each_region.regionName }}" required>
                    </div>
                    <div class="form-group">
                        <label for="regionType{{ loop.index }}">RegionType*</label>
                        <input type="text" class="form-control" id="regionType{{ loop.index }}" name="regionType" value="{{ each_region.regionType }}" required>
                    </div>
              
                    <div class="modal-footer justify-content-between">
                        <button type="button" class="btn btn-default" data-bs-dismiss="modal">Close</button>
                        <button type="submit" class="btn btn-primary">Update</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
{% endfor %}



<!-- Create New country Modal -->
<div class="modal fade" id="addCountryModal" tabindex="-1" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h6 class="modal-title" id="mail-ComposeLabel">Add Country</h6>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <form method="POST" action="{{url_for('regions.add_country')}}" enctype="multipart/form-data">
              <div class="modal-body px-4">
                <div class="row">
                  <div class="col-md-6">
                    <div class="form-group">
                          <label for="countryName">Country Name*</label>
                          <input type="text" class="form-control" id="countryName" name="countryName" placeholder="Enter Country Name" required>
                    </div>

                    <div class="form-group">
                          <label for="countryCode">Country Code*</label>
                          <input type="text" class="form-control" id="countryCode" name="countryCode" placeholder="Enter Country Code" required>
                    </div>

                    <div class="form-group">
                        <label for="regionId">Region*</label>
                            <select class="form-control" name="regionId" id="regionId" required>
                            {% for each_region in regionsList %}
                              <option value="{{each_region.id}}">{{each_region.regionName}}</option>
                            {% endfor %}
                            </select>                                        
                    </div>

                    <div class="form-group">
                          <label for="regex">Regex*</label>
                          <input type="text" class="form-control" id="regex" name="regex" placeholder="Enter regex" required>
                    </div>

                    <div class="form-group">
                          <label>Image</label>
                          <input type="file" class="form-control" name="countryFlag">
                      </div>

                  </div>
                </div>
              </div>

              <div class="modal-footer justify-content-between">
                  <button type="button" class="btn btn-default" data-bs-dismiss="modal">Close</button>
                  <button type="submit" class="btn btn-primary" id="form_submit">Submit</button>
              </div>
            </form>
        </div>
    </div>
</div>
<!-- End -->

{% for each_country in countriesList %}
<div class="modal fade" id="editCountryModal{{ loop.index }}" tabindex="-1" role="dialog" aria-labelledby="editCountryModalLabel{{ loop.index }}" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="editCountryModalLabel{{ loop.index }}">Update Country</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <form method="POST" action="{{ url_for('regions.update_country', countryId=each_country.id) }}" enctype="multipart/form-data">
                    <div class="form-group">
                      <label for="countryName">Country Name*</label>
                      <input type="text" class="form-control"id="countryName"name="countryName" value="{{each_country.countryName}}" required>
                    </div>

                    <div class="form-group">
                      <label for="countryCode">Country Code*</label>
                      <input type="text" class="form-control"id="countryCode"name="countryCode" value="{{each_country.countryCode}}" required>
                    </div>


                    <div class="form-group">
                      <label for="regionId">Region*</label>
                      <select class="form-control" name="regionId" id="regionId">
                        {%for each_region in regionsList%}
                          {%if each_region.id == each_country.regionId%}
                            <option selected value="{{each_region.id}}">{{regionId.regionName}}</option>
                          {%else%}
                          <option value="{{each_region.id}}">{{each_region.regionName}}</option>
                          {%endif%}
                        {%endfor%}
                      </select>
                            
                    </div>

                    {%if each_country.countryFlag%}
                        <img src="{{each_country.countryFlag}}" alt="" border=3 height="150px" width="150px"></img>
                          <br>
                    {%endif%}
                        <label>Image</label>
                        <input type="file" class="form-control" name="countryFlag">


                        <div class="form-group">
                            <label for="regex">Regex*</label>
                            <input type="text" class="form-control"id="regex"name="regex" value="{{each_country.regex}}" required>
                         </div>
 
              
                    <div class="modal-footer justify-content-between">
                        <button type="button" class="btn btn-default" data-bs-dismiss="modal">Close</button>
                        <button type="submit" class="btn btn-primary">Update</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
{% endfor %}


<!-- Create New State Modal -->
<div class="modal fade" id="addStateModal" tabindex="-1" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h6 class="modal-title" id="mail-ComposeLabel">Add State</h6>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <form method="POST" action="{{url_for('regions.add_state')}}" enctype="multipart/form-data">
              <div class="modal-body px-4">
                <div class="row">
                  <div class="col-md-6">
                    <div class="form-group">
                        <label for="stateName">State Name*</label>
                        <input type="text" class="form-control" id="stateName" name="stateName" placeholder="Enter State Name" required>
                    </div>
                  </div>
                 <div class="col-md-6">
                  <div class="form-group">
                        <label for="countryId">Country*</label>
                        <select class="form-control" name="countryId" id="countryId" required>
                          {% for each_country in countriesList %}
                                <option value="{{each_country.id}}">{{each_country.countryName}}</option>
                          {% endfor %}
                        </select>                                        
                   </div>
                 </div>

                </div>
              </div>

              <div class="modal-footer justify-content-between">
                  <button type="button" class="btn btn-default" data-bs-dismiss="modal">Close</button>
                  <button type="submit" class="btn btn-primary" id="form_submit">Submit</button>
              </div>
            </form>
        </div>
    </div>
</div>
<!-- End -->

{% for each_state in statesList %}

<div class="modal fade" id="editStateModal{{ loop.index }}" tabindex="-1" role="dialog" aria-labelledby="editStateModalLabel{{ loop.index }}" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="editStateModalLabel{{ loop.index }}">Update State</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <form method="POST" action="{{ url_for('regions.update_state', stateId=each_state.id) }}" enctype="multipart/form-data">
                    <div class="form-group">
                        <label for="stateName{{ loop.index }}">State Name*</label>
                        <input type="text" class="form-control" id="stateName{{ loop.index }}" name="stateName" value="{{ each_state.stateName }}" required>
                    </div>
                   

                    <label for="countryId">Country*</label>
                        <select class="form-control" name="countryId" id="countryId">
                        {%for each_country in countriesList%}
                        {%if each_country.id == each_country.countryId%}
                        <option selected value="{{each_country.id}}">{{each_country.countryName}}</option>
                        {%else%}
                        <option value="{{each_country.id}}">{{each_country.countryName}}</option>
                        {%endif%}
                        {%endfor%}
                        </select>
              
                    <div class="modal-footer justify-content-between">
                        <button type="button" class="btn btn-default" data-bs-dismiss="modal">Close</button>
                        <button type="submit" class="btn btn-primary">Update</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
{% endfor %}





<!-- Create New City Modal -->
<div class="modal fade" id="addCityModal" tabindex="-1" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h6 class="modal-title" id="mail-ComposeLabel">Add City</h6>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <form method="POST" action="{{url_for('regions.add_city')}}" enctype="multipart/form-data">
              <div class="modal-body px-4">
                <div class="row">
                  <div class="col-md-6">
                    <div class="form-group">
                          <label for="cityName">City Name*</label>
                         <input type="text" class="form-control" id="cityName" name="cityName" placeholder="Enter City Name" required>
                    </div>

                  </div>
                 <div class="col-md-6">
                  <div class="form-group">
                  <label for="stateId">State Name*</label>
                    <select class="form-control" name="stateId" id="stateId">
                      {% for each_state in statesList %}
                          <option value="{{each_state.id}}">{{each_state.stateName}}</option>
                      {% endfor %}
                  </select>                                       
                   </div>
                 </div>

                </div>
              </div>

              <div class="modal-footer justify-content-between">
                  <button type="button" class="btn btn-default" data-bs-dismiss="modal">Close</button>
                  <button type="submit" class="btn btn-primary" id="form_submit">Submit</button>
              </div>
            </form>
        </div>
    </div>
</div>
<!-- End -->

{% for each_city in citiesList %}

<div class="modal fade" id="editCityModal{{ loop.index }}" tabindex="-1" role="dialog" aria-labelledby="editCityModalLabel{{ loop.index }}" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="editCityModalLabel{{ loop.index }}">Update Cities</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <form method="POST" action="{{ url_for('regions.update_city', cityId=each_city.id) }}" enctype="multipart/form-data">
                    <div class="form-group">
                        <label for="cityName">City Name*</label>
                        <input type="text" class="form-control"id="cityName"name="cityName" value="{{each_city.cityName}}" required>
                    </div>

                    <label for="stateId">State Name*</label>
                        <select class="form-control" name="stateId" id="stateId">
                        {%for each_state in statesList%}
                        {%if each_state.id == each_city.stateId%}
                        <option selected value="{{each_state.id}}">{{each_state.stateName}}</option>
                        {%else%}
                        <option value="{{each_state.id}}">{{each_state.stateName}}</option>
                        {%endif%}
                        {%endfor%}
                        </select>

              
                    <div class="modal-footer justify-content-between">
                        <button type="button" class="btn btn-default" data-bs-dismiss="modal">Close</button>
                        <button type="submit" class="btn btn-primary">Update</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
{% endfor %}






<!-- Create New Block Modal -->
<div class="modal fade" id="addBlockModal" tabindex="-1" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h6 class="modal-title" id="mail-ComposeLabel">Add Block</h6>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <form method="POST" action="{{url_for('regions.add_block')}}" enctype="multipart/form-data">
              <div class="modal-body px-4">
                <div class="row">
                  <div class="col-md-6">
                    <div class="form-group">
                          <label for="name">Block/PO Name*</label>
                          <input type="text" class="form-control" id="name" name="name" placeholder="Enter Name" required>
                    </div>

                  </div>

                  <div class="col-md-6">
                   <div class="form-group">
                      <label for="cityId">City*</label>
                      <select class="form-control" name="cityId" id="cityId" required>
                        {% for each_city in citiesList %}
                          <option value="{{each_city.id}}">{{each_city.cityName}}</option>
                        {% endfor %}
                      </select>                                        
                    </div>

                  </div>

                </div>
              </div>

              <div class="modal-footer justify-content-between">
                  <button type="button" class="btn btn-default" data-bs-dismiss="modal">Close</button>
                  <button type="submit" class="btn btn-primary" id="form_submit">Submit</button>
              </div>
            </form>
        </div>
    </div>
</div>
<!-- End -->

{% for each_block in blocksList %}
<div class="modal fade" id="editBlockModal{{ loop.index }}" tabindex="-1" role="dialog" aria-labelledby="editBlockModalLabel{{ loop.index }}" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="editBlockModalLabel{{ loop.index }}">Update Block</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <form method="POST" action="{{ url_for('regions.update_block', blockId=each_block.id) }}" enctype="multipart/form-data">
                    <div class="form-group">
                          <label for="name">Block/PO Name*</label>
                            <input type="text" class="form-control"id="name"name="name" value="{{each_block.name}}" required>
                      </div>

                    <div class="form-group">
                      <label for="cityId">City Name*</label>
                          <select class="form-control" name="cityId" id="cityId">
                          {%for each_city in citiesList%}
                          {%if each_city.id == each_block.cityId%}
                          <option selected value="{{each_city.id}}">{{each_city.cityName}}</option>
                          {%else%}
                          <option value="{{each_city.id}}">{{each_city.cityName}}</option>
                          {%endif%}
                          {%endfor%}
                          </select>

                    </div>
              
                    <div class="modal-footer justify-content-between">
                        <button type="button" class="btn btn-default" data-bs-dismiss="modal">Close</button>
                        <button type="submit" class="btn btn-primary">Update</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
{% endfor %}




<!-- Create New Pincode Modal -->
<div class="modal fade" id="addPincodeModal" tabindex="-1" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h6 class="modal-title" id="mail-ComposeLabel">Add Pincode</h6>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <form method="POST" action="{{url_for('regions.add_pincode')}}" enctype="multipart/form-data">
              <div class="modal-body px-4">
                <div class="row">
                  <div class="col-md-6">
                    <div class="form-group">
                        <label for="pincode">Pincode*</label>
                        <input type="number" class="form-control" id="pincode" name="pincode" required>
                    </div>
                 </div>

                  <div class="col-md-6">

                   <div class="form-group">
                      <label for="blockPoId">Block/PO*</label>
                      <select class="form-control" name="blockPoId" id="blockPoId" required>
                        {% for each_block in blocksList %}
                          <option value="" disabled selected hidden>Select a Block/Po</option>
                          <option value="{{each_block.id}}">{{each_block.name}}</option>
                        {% endfor %}
                      </select>                                        
                    </div>
                  </div>

                    <div class="col-md-6">
                     <div class="form-group">
                          <label for="latitude">Latitude</label>
                          <input type="text" class="form-control"id="latitude"name="latitude">
                      </div>
                     </div>

                     <div class="col-md-6">

                      <div class="form-group">
                          <label for="longitude">Longitude</label>
                          <input type="text" class="form-control"id="longitude"name="longitude">
                      </div>



                    </div>

                  </div>

                </div>
              <!--</div>-->

              <div class="modal-footer justify-content-between">
                  <button type="button" class="btn btn-default" data-bs-dismiss="modal">Close</button>
                  <button type="submit" class="btn btn-primary" id="form_submit">Submit</button>
              </div>
            </form>
        </div>
    </div>
</div>
<!-- End -->

{% for each_pincode in pincodesList %}
<div class="modal fade" id="editPincodeModal{{ loop.index }}" tabindex="-1" role="dialog" aria-labelledby="editPincodeModalLabel{{ loop.index }}" aria-hidden="true">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="editPincodeModalLabel{{ loop.index }}">Update Pincode</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <form method="POST" action="{{ url_for('regions.update_pincode', pincodeId=each_pincode.id) }}" enctype="multipart/form-data">
                   <div class="form-group">
                          <label for="pincode">Pincode*</label>
                          <input type="number" class="form-control"id="pincode"name="pincode" value="{{each_pincode.pincode}}" required>

                          
                    </div>



                    <div class="form-group">
                      <label for="blockPoId">Block/PO*</label>
                       <select class="form-control" name="blockPoId" id="blockPoId">
                          {%for each_block in blocksList%}
                          {%if each_block.id == each_pincode.blockPoId%}
                          <option selected value="{{each_block.id}}">{{each_block.name}}</option>
                          {%else%}
                          <option value="{{each_block.id}}">{{each_block.name}}</option>
                          {%endif%}
                          {%endfor%}
                          </select>
                    </div>

                     <div class="form-group">
                        <label for="latitude">Latitude</label>
                        <input type="text" class="form-control"id="latitude"name="latitude" value="{{each_pincode.latitude}}">
                      </div>

                      <div class="form-group">
                        <label for="longitude">Longitude</label>
                        <input type="text" class="form-control"id="longitude"name="longitude" value="{{each_pincode.longitude}}">
                       </div>


              
                    <div class="modal-footer justify-content-between">
                        <button type="button" class="btn btn-default" data-bs-dismiss="modal">Close</button>
                        <button type="submit" class="btn btn-primary">Update</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
{% endfor %}






</script>
<script>
  function Activate() {
    alert("Do you want to activate this role?");
  }
</script>
<!-- Add the following JavaScript code -->
<script>
    function confirmDelete(url) {
        if (confirm("Are you sure want to delete?")) {
            window.location.href = url;
        }
    }
</script>
  
{%endblock%}