{% extends 'base.html.twig' %}


{% block body %}

    <div class="card card-custom card-border gutter-b">
        <div class="card-header border-0 py-5">
            <h3 class="card-title align-items-start flex-column">
                <span class="card-label font-weight-bolder text-dark">Latest users</span>
                <span class="text-muted mt-3 font-weight-bold font-size-sm">Most recent users</span>
            </h3>
        </div>
        <div class="card-body py-0">
            <div class="table-responsive">
                <table class="table table-head-custom table-vertical-center" id="kt_advance_table_widget_2">
                    <thead>
                    <tr class="text-uppercase">
                        <th class="pl-0" style="min-width: 150px">name</th>
                        <th style="width: 300px">email</th>
                        <th style="min-width: 90px">Country</th>
                        <th style="min-width: 70px">city</th>
                        <th style="min-width: 130px">phone</th>
                        <th style="min-width: 110px">created on</th>
                        <th class="pr-0 text-right" style="min-width: 110px">action</th>
                    </tr>
                    </thead>
                    <tbody>
                    {% for user in users %}
                        <tr>
                            <td class="pl-0">
                                <a class="text-dark-75 font-weight-bolder text-hover-primary font-size-lg" href="{{ path('users_show', {token: user.token}) }}">
                                    {{ user.first_name|default }} {{ user.last_name|default }}
                                </a>
                            </td>
                            <td>
                                <a class="text-info font-weight-bolder font-size-sm" href="{{ path('users_show', {token: user.token}) }}">
                                    {{ user.email| default }}
                                </a>
                            </td>
                            <td class="text-uppercase">{{ user.country| default }}</td>
                            <td>{{ user.city| default }}</td>
                            <td>{{ user.phone ?? user.mobile_phone | default }}</td>
                            <td>
                                 <span class="text-dark-75 font-weight-bolder d-block font-size-lg">
                                     {{ user.registration_date |date('d-m-Y')| default }}
                                </span>
                                <span class="text-muted font-weight-bold">
                                   {{ user.registration_date |date('H:i')| default }}
                                </span>
                            </td>
                            <td class="text-right">
                                <a data-toggle="tooltip" title="Edit" href="{{ path('users_update',{token:user.token}) }}" class="btn btn-sm btn-warning mr-2"><i class="flaticon-edit text-white p-0"></i></a>
                                <a data-toggle="tooltip" title="Block" href="{{ path('users_block_unblock',{token:user.token, block: 1}) }}" class="btn btn-sm btn-danger"><i class="flaticon-circle
 text-white p-0"></i></a>
                            </td>
                        </tr>
                    {% endfor %}
                    </tbody>
                </table>
            </div>
        </div>
    </div>

    <div class="mt-25 card card-custom card-border gutter-b">
        <div class="card-header border-0 py-5">
            <h3 class="card-title align-items-start flex-column">
                <span class="card-label font-weight-bolder text-dark">Latest transactions</span>
                <span class="text-muted mt-3 font-weight-bold font-size-sm">Most recent transaction</span>
            </h3>
        </div>
        <div class="card-body py-0">
            <div class="table-responsive">
                <table class="table table-head-custom table-vertical-center" id="kt_advance_table_widget_2">

                    <thead>

                    <tr class="text-uppercase">

                        <th style="width: 270px;">Sender Email</th>

                        <th style="width: 270px;">Receiver Email</th>

                        <th style="min-width: 115px;">Trn Amount Currency</th>

                        <th style="min-width: 120px;">User Amount Currency</th>

                        <th style="min-width: 120px;">Date</th>

                        <th>Type</th>

                        <th class="text-center">Status</th>

                        <th>Actions</th>

                    </tr>

                    </thead>

                    <tbody>

                    {% for trn in transactions %}

                        <tr>

                            <td class="text-dark-75 font-weight-bolder font-size-sm">{{ trn.sender_email }}</td>

                            <td class="text-dark-75 font-weight-bolder font-size-sm">{{ trn.receiver_email | default('') }}</td>

                            <td>{{ trn.amount | number_format(2) }} {{ trn.transaction_currency }}</td>

                            <td>{{ trn.user_amount | number_format(2) }} {{ trn.user_currency }}</td>

                            <td>
                                  <span class="text-dark-75 font-weight-bolder d-block font-size-lg">
                                     {{ trn.transaction_date | date('d-m-Y') }}
                                </span>
                                <span class="text-muted font-weight-bold">
                                    <span class="font-weight-bold">{{ trn.transaction_date | date('H:i:s') }}</span>
                                </span>
                            </td>

                            <td>{{ trn.type | capitalize }}</td>

                            <td class="text-center">{{ trn.status | trn_status }}</td>

                            <td>
                                {#                        <button class="btn btn-primary trn-details" data-url="{{ path('transaction_show',{token:trn.trn_key}) }}">Details</button>#}
                            </td>
                        </tr>

                    {% endfor %}

                    </tbody>

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

    </div>

{% endblock %}