
<div class="container-fluid dashboard-content">
    <!-- Header -->
    {% set title = "Users Import" %}
    {% set navigation = [('Admin', ''), ('Users', '')] %}
    {% include 'include_header.html' %}

    <!-- table row -->
    <div class="row">
            <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                {% if users_imported %}
                    <row>
                    <h4>Imported users:</h4>
                    <ul>
                    {% for iu in users_imported %}
                        <li>{{ iu['name'] }}</li>
                    {% endfor %}
                    </ul>
                    </row>
                {% endif %}
                {% if users_failed %}
                    <row>
                    <h4>Failed to import users:</h4>
                    <ul>
                    {% for fu in users_failed %}
                        <li>{{ fu['name'] }} - Error: {{ fu['error'] }}</li>
                    {% endfor %}
                    </ul>
                    </row>
                {% endif %}
            </div>
    </div>

    <div class="row">
        <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
            <div class="card">
                <div class="card-header">
                    <div class="row">
                    <h5 class="mb-0 col-8">Users from Application Portal</h5>
                        {% if status == 'ready' %}
                            {% if portal_users %}
                                <button type="button" id="import-btn" class="btn btn-outline-dark col-4"
                                        onclick="importReadyUsers()">Import Users ({{ portal_users|length }} {{ status }})
                                </button>
                            {% else %}
                                <button type="button" id="showall-btn" class="btn btn-outline-dark col-4"
                                        onclick="showAllUsers()">Show All Users
                                </button>
                            {% endif %}
                        {% else %}
                            <button type="button" id="showready-btn" class="btn btn-outline-dark col-4"
                                    onclick="showReadyUsers()"> Show Ready Users
                            </button>
                        {% endif %}
                    </div>
                </div>
                <div class="card-body">
                    <div class="table-responsive">
                        <table id="users-table" class="table table-striped table-bordered" style="width:100%">
                            <thead>
                            <tr>
                                <th>pi</th>
                                <th>email</th>
                                <th>name</th>
                                <td>invoice_ref</td>
                                <th>status</th>
                                <th>pi</th>
                                <th>actions</th>
                            </tr>
                            </thead>
                            <tbody>
                            {% for pu in portal_users %}
                            <tr>
                                <td>{{ pu['pi'] }}</td>
                                <td>{{ pu['email'] }}</td>
                                <td>{{ pu['name'] }}</td>
                                <td>{{ pu['invoice_ref'] }}</td>
                                <td>{{ pu['status'] }}</td>
                                <td>{{ pu['pi_user'].name }}</td>
                                <td>
                                    <button class="btn btn-sm btn-outline-light" onclick=""><i class="far fa-edit"></i></button>
                                </td>
                            </tr>
                            {% endfor %}

                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- end table row -->

</div>

<!-- Modal -->
<div class="modal" id="deleteModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h3 class="modal-title" id="exampleModalLongTitle">Delete User</h3>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">

      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
        <button type="button" class="btn btn-primary">Delete</button>
      </div>
    </div>
  </div>
</div>


<script>
    $('#users-table').DataTable();
    
    function showReadyUsers() {
        window.location.href = "{{ url_for('main', content_id='portal_users_list')}}" + '&status=ready';
    }

    function showAllUsers() {
        window.location.href = "{{ url_for('main', content_id='portal_users_list')}}";
    }

    function importReadyUsers() {
        window.location.href = "{{ url_for('main', content_id='portal_users_list')}}" + '&import';
    }

</script>