{% extends "admin/partial/layout_logged_in.html.twig" %}

{% block title %}Themes{% endblock %}
{% block selected_page %}users{% endblock %}
{% block selected_sub_page %}user_manage{% endblock %}

{% block body %}
<script>
    oTable = null;
    gPluginId = null;
    $(document).ready(function(){
        // datatable
        oTable = $('#userLoginsTable').dataTable({
            "sPaginationType": "full_numbers",
            "bServerSide": false,
            "iDisplayLength": 50,
            "bLengthChange": false,
            "aaSorting": [[ 0, "desc" ]],
            "fnDrawCallback": function (oSettings) {
                postDatatableRender();
            },
            "oLanguage": {
                "sEmptyTable": "There are no logins in the current filters."
            },
            dom: "lBfrtip",
            buttons: [
              {
                extend: "copy",
                className: "btn-sm"
              },
              {
                extend: "csv",
                className: "btn-sm"
              },
              {
                extend: "excel",
                className: "btn-sm"
              },
              {
                extend: "pdfHtml5",
                className: "btn-sm"
              },
              {
                extend: "print",
                className: "btn-sm"
              }
            ]
        });
    });
</script>

<!-- page content -->
<div class="right_col" role="main">
    <div class="">
        <div class="page-title">
            <div class="title_left">
                <h3>{{ block('title') }}</h3>
            </div>
        </div>
        <div class="clearfix"></div>

        {{ msg_page_notifications|raw }}
        
        <div class="row">
            <div class="col-md-3 col-sm-3 col-xs-12">
                <div class="x_panel">
                    <div class="x_title">
                        <h2>Account Logins</h2>
                        <div class="clearfix"></div>
                    </div>
                    <div class="x_content">
                        <p>Details of any successful account logins for the past 30 days, the IP address and which country it was from.</p>
                        <table class="countries_list">
                            <tr><td><i class="fa fa-lock"></i>Total Logins:</td><td class="fs15 fw700 text-right">{{ loginData|length }}</td></tr>
                            <tr><td><i class="fa fa-share-alt"></i>Different IPs:</td><td class="fs15 fw700 text-right">{{ totalDifferentIps }}</td></tr>
                            <tr><td><i class="fa fa-globe"></i>Different Countries:</td><td class="fs15 fw700 text-right">{{ totalDifferentCountries }}</td></tr>
                        </table>
                    </div>
                </div>
            </div>
            
            <div class="col-md-9 col-sm-9 col-xs-12">
                <div class="x_panel">
                    <div class="x_content">
                        <table id="userLoginsTable" class="table table-striped table-only-border bulk_action">
                            <thead>
                                <tr>
                                    <th class='align-left'>Login Date</th>
                                    <th class='align-left'>IP Address</th>
                                    <th class='align-left'>Country</th>
                                </tr>
                            </thead>
                            <tbody>
                                {% if loginData|length == 0 %}
                                    <tr><td>No logins in the past 30 days.</td><td></td><td></td></tr>
                                {% else %}
                                    {% for loginDataItem in loginData %}
                                    <tr>
                                        <td>{{ CoreHelper.formatDate(loginDataItem['date_added'], SITE_CONFIG_DATE_TIME_FORMAT) }}</td>
                                        <td>{{ loginDataItem['ip_address'] }}</td>
                                        <td>{{ loginDataItem['country_name']|length?loginDataItem['country_name']:'Unknown' }}</td>
                                    </tr>
                                    {% endfor %}
                                {% endif %}
                            </tbody>
                        </table>
                    </div>
                </div>
                <div class="x_panel">
                    <div class="btn-group">
                        <div class="dropup">
                            <a href="user_manage" class="btn btn-default dropdown-toggle" type="button">
                                Return to Manage Users
                            </a>
                        </div>
                    </div>
                </div>

            </div>
        </div>
    </div>
</div>
{% endblock %}