{% extends 'base.html' %}
{% load i18n %}
{% block title %}{{ page_title }}{% endblock %}
{% block content %}
    <div class="modal fade"
         id="deleteModal"
         data-bs-backdrop="static"
         data-bs-keyboard="false"
         tabindex="-1"
         aria-labelledby="deleteModalLabel"
         aria-hidden="true">
        <div class="modal-dialog modal-sm">
            <div class="modal-content rounded">
                <div class="modal-body d-flex justify-content-center">
                    <h1 class="text-danger me-2">
                        <i class="bi bi-exclamation-diamond-fill"></i>
                    </h1>
                    <span class="text-danger">{% trans 'Are you sure you want to delete this account?' %}</span>
                </div>
                <div class="btn-group">
                    <button type="button"
                            class="btn btn-sm btn-phoenix-secondary"
                            data-bs-dismiss="modal">{% trans 'No' %}</button>
                    <div class="btn btn-sm btn-phoenix-danger">
                        <form action="{% url 'account_delete' request.dealer.slug url_kwargs.coa_pk account.pk %}"
                              method="post">
                            {% csrf_token %}
                            <button type="submit" class="btn btn-sm btn-phoenix-danger">{% trans 'Yes' %}</button>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="row my-3">
        <div class="">
            <div class="">
                <p class="mb-3"></p>
            </div>
            <div class="">
                <div class="row">
                    <div class="col-md-6">
                        <p>
                            <strong>{{ _("Account Name") }}:</strong> {{ account.name }}
                        </p>
                        <p>
                            <strong>{{ _("Account Code") }}:</strong> {{ account.code }}
                        </p>
                    </div>
                    <div class="col-md-6">
                        <p>
                            {% if account.balance_type == 'debit' %}
                                <strong>{{ _("Balance Type") }}:</strong>
                                <div class="badge badge-phoenix fs-10 badge-phoenix-success">
                                    <span class="fw-bold">{{ _("Debit") }}</span><span class="ms-1 fas fa-arrow-circle-down"></span>
                                </div>
                            {% else %}
                                <strong>{{ _("Balance Type") }}:</strong>
                                <div class="badge badge-phoenix fs-10 badge-phoenix-danger">
                                    <span class="fw-bold">{{ _("Credit") }}</span><span class="ms-1 fas fa-arrow-circle-up"></span>
                                </div>
                            {% endif %}
                        </p>
                        <p>
                            <strong>{{ _("Active") }}:</strong> {{ account.active }}
                        </p>
                    </div>
                </div>
                <div class="row mt-4">
                    <div class="table-responsive px-1 scrollbar mt-3">
                        <table class="table align-items-center table-flush">
                            <thead>
                                <tr class="bg-body-highlight">
                                    <th class="sort white-space-nowrap align-middle" scope="col">{{ _("JE Number") }}</th>
                                    <th class="sort white-space-nowrap align-middle" scope="col">{{ _("Date") }}</th>
                                    <th class="sort white-space-nowrap align-middle" scope="col">{{ _("Debit") }}</th>
                                    <th class="sort white-space-nowrap align-middle" scope="col">{{ _("Credit") }}</th>
                                    <th class="sort white-space-nowrap align-middle" scope="col">{{ _("Description") }}</th>
                                    <th class="sort white-space-nowrap align-middle" scope="col">{{ _("Actions") }}</th>
                                </tr>
                            </thead>
                            <tbody class="list">
                                {% for tx in account.transactionmodel_set.all %}
                                    <tr class="hover-actions-trigger btn-reveal-trigger position-static">
                                        <td class="align-middle product white-space-nowrap">{{ tx.journal_entry.je_number }}</td>
                                        <td class="align-middle product white-space-nowrap">{{ tx.journal_entry.timestamp }}</td>
                                        <td class="align-middle product white-space-nowrap">
                                            {% if tx.tx_type == 'debit' %}<i class="fa-solid fa-circle-up"></i> {{ tx.amount }}{% endif %}
                                        </td>
                                        <td class="align-middle product white-space-nowrap">
                                            {% if tx.tx_type == 'credit' %}<i class="fa-solid fa-circle-down"></i> {{ tx.amount }}{% endif %}
                                        </td>
                                        <td class="align-middle product white-space-nowrap">
                                            {% if tx.description %}{{ tx.description }}{% endif %}
                                        </td>
                                        <td class="align-middle white-space-nowrap text-start">
                                            {% if perms.django_ledger.view_transactionmodel %}
                                                <div class="btn-reveal-trigger position-static">
                                                    <button class="btn btn-sm dropdown-toggle dropdown-caret-none transition-none btn-reveal fs-10"
                                                            type="button"
                                                            data-bs-toggle="dropdown"
                                                            data-boundary="window"
                                                            aria-haspopup="true"
                                                            aria-expanded="false"
                                                            data-bs-reference="parent">
                                                        <span class="fas fa-ellipsis-h fs-10"></span>
                                                    </button>
                                                    <div class="dropdown-menu dropdown-menu-end py-2">
                                                        <a class="dropdown-item text-success-dark"
                                                           href="{% url 'payment_details' request.dealer.slug tx.journal_entry.pk %}">{% trans 'view Transactions'|capfirst %}</a>
                                                    </div>
                                                </div>
                                            {% endif %}
                                        </td>
                                    </tr>
                                {% endfor %}
                                <tr class="hover-actions-trigger btn-reveal-trigger position-static">
                                    <td class="align-middle product white-space-nowrap"></td>
                                    <td class="align-middle product white-space-nowrap">
                                        <span class="fw-bold fs-8">{{ _("Total") }}</span>
                                    </td>
                                    <td class="align-middle product white-space-nowrap">
                                        <span class="fw-bold fs-8 text-success">{{ total_debits }} <span class="icon-saudi_riyal"></span></span>
                                    </td>
                                    <td class="align-middle product white-space-nowrap">
                                        <span class="fw-bold fs-8 text-danger">{{ total_credits }} <span class="icon-saudi_riyal"></span></span>
                                    </td>
                                    <td class="align-middle product white-space-nowrap"></td>
                                    <td class="align-middle white-space-nowrap text-start"></td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
                <div class="mt-3 d-flex">
                    {% if perms.django_ledger.change_chartofaccountmodel %}
                        <a class="btn btn-sm btn-phoenix-primary me-1"
                           href="{% url 'account_update' request.dealer.slug url_kwargs.coa_pk account.pk %}">
                            <i class="fa-solid fa-pen-to-square"></i> {{ _("Edit") }}
                        </a>
                    {% endif %}
                    {% if perms.django_ledger.delete_chartofaccountmodel %}
                        <a class="btn btn-sm btn-phoenix-danger me-1"
                           data-bs-toggle="modal"
                           data-bs-target="#deleteModal">

                            <i class="fa-solid fa-trash"></i> {{ _("Delete") }}
                        </a>
                    {% endif %}
                    <a class="btn btn-sm btn-phoenix-secondary"
                       href="{% url 'account_list' request.dealer.slug url_kwargs.coa_pk %}">

                        <i class="fa-regular fa-circle-left"></i> {% trans 'Back to COA List' %}
                    </a>
                </div>
            </div>
        </div>
        <!--test-->
{% endblock %}