{% extends 'transactions/extends/layout.html' %}
{% load static %}
{% load humanize %}
{% load difference_calc %}
{% block content %}
    {% block scripts %}
        <script>
            var global_state = {
                baseUrl: '{{ baseUrl }}',
                accTypesJson: '{{ accTypesJson|safe }}',
                transactionChargesJson: '{{ transactionChargesJson|safe }}'
            }
        </script>
    {% endblock %}
    <!-- start page title -->
    <div class="row p-0">
        <div class="col-md-12">
            <div class="card mt-2">
                <div class="card-header text-uppercase">
                    <div class="row align-content-between">
                        <div class="col-md-12">
                            <div class="page-title-right ">

                                    <div class="row">
                                        <div class="col-lg-10">

                                        <form action="/transactions/member-statement/" method="POST" autocomplete="off" class="row">
                                            {% csrf_token %}
                                            <input type="hidden" name="id" value="{{ account.id }}" id="selected_member">
                                        <div class="col-md-2 form-group" style="display: none">
                                            <select class="form-control form-control-sm" name="report_for">
                                                <option value="{{ user.staff.branch.id }}">{{ user.staff.branch.name }}</option>
                                                {% for b in vbranches %}
                                                    <option value="{{ b.id }}">{{ b.name }}</option>
                                                {% endfor %}
                                                <option value="business">Business Report</option>
                                            </select>
                                        </div>

                                        <div class="col-md-2 form-group position-relative">
                                            <div class=" form-group">
                                                <input type="text" id="search_members"
                                                       class="form-control form-control-sm"
                                                       placeholder="Name or Acc Number" {% if individual_gl %}
                                                       value="{{ account.member.member_names }}" {% endif %}/>
                                            </div>
                                            <ul class="dropdown-menu show" id="search-results"></ul>
                                        </div>
                                        <div class="col-md-2 form-group">
                                            <select class="form-control form-control-sm"
                                                    onchange="check_range(this.value)"
                                                    name="financial_year">
                                                {% for f in fy %}
                                                    <option value="{{ f.id }}">{{ f.name }}</option>
                                                {% endfor %}
                                                <option value="custom">Custom Date Range</option>
                                            </select>
                                        </div>
                                        <script>
                                            function check_range(val) {
                                                if (val == "custom") {
                                                    document.getElementById("date_from").style.display = "inline-block";
                                                    document.getElementById("date_to").style.display = "inline-block";
                                                } else {
                                                    document.getElementById("date_from").style.display = "none";
                                                    document.getElementById("date_to").style.display = "none";
                                                }
                                            }
                                        </script>

                                        <div class="col-md-2 form-group" id="date_from" style="display: none;">
                                            <input type="date" class="form-control form-control-sm" name="start_date">
                                        </div>
                                        <div class="col-md-2 form-group" id="date_to" style="display: none;">
                                            <input type="date" class="form-control form-control-sm" name="end_date">
                                        </div>
                                        <div class="col-md-2">
                                            <button class="btn btn-primary btn-sm"><i class="fa fa-filter"></i>
                                                Filter
                                            </button>
                                        </div>
                                        </form>

                                            </div>
                                        <div class="col-md-2">
                                            <form action="/transactions/pdf-member-statement/" method="post">
                                                {% csrf_token %}
                                                <input type="hidden" name="id" value="{{ account.id }}">
                                                <input type="hidden" name="start_date"
                                                       value="{{ start_date|date:'Y-m-d' }}">
                                                <input type="hidden" name="end_date"
                                                       value="{{ end_date|date:'Y-m-d' }}">
                                                <input type="hidden" name="financial_year" value="custom">
                                                <button type="submit" class="btn btn-primary btn-sm">
                                                    <i class="fa fa-file-pdf-o"></i> Export PDF
                                                </button>
                                            </form>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- end page title -->
    <div class="row">
        <div class="col-md-12">
            <div class="card">
                <div class="card-body">
                    <div class="row">
                        <div class="col-md-12">
                            {% if individual_gl %}
                                {% if start_date != None and end_date != None %}
                                    <h4 class="card-title"
                                        style="text-align: center">{{ account.member.member_names }} Account
                                        Statement for the Period between {{ start_date }} and {{ end_date }}</h4>
                                {% elif start_date != None and end_date == None %}
                                    <h4 class="card-title"
                                        style="text-align: center">{{ account.member.member_names }} Account
                                        Statement for the Period From {{ start_date|date:'d/m/Y' }} To Date</h4>
                                {% elif start_date == None and end_date != None %}
                                    <h4 class="card-title"
                                        style="text-align: center">{{ account.member.member_names }} Account
                                        Statement for the Period Up to {{ end_date|date:'d/m/Y' }}</h4>
                                {% else %}
                                    <h4 class="card-title"
                                        style="text-align: center">{{ account.member.member_names }} Account
                                        Statement </h4>
                                {% endif %}
                                <div class="row d-none">
                                    <div class="col-md-6"></div>
                                    <div class="col-md-6">
                                        <h4 style="text-align: center">
                                            Summary
                                        </h4>
                                        <table class="table table-striped">
                                            <tr>
                                                <td>Opening Balance</td>
                                                <td>{{ opening_balance|intcomma }}</td>
                                            </tr>
                                            <tr>
                                                <td>Total Deposits</td>
                                                <td>{{ total_deposits|intcomma }}</td>
                                            </tr>
                                            <tr>
                                                <td>Total Withdraws</td>
                                                <td>{{ total_withdraws|intcomma }}</td>
                                            </tr>
                                            <tr>
                                                <td>Total Charges</td>
                                                <td>{{ total_charges|intcomma }}</td>
                                            </tr>
                                            <tr>
                                                <td>Total Interests</td>
                                                <td>{{ total_interests|intcomma }}</td>
                                            </tr>
                                            <tr>
                                                <td><b>Closing Balance</b></td>
                                                <td><b>{{ closing_balance|intcomma }}</b></td>
                                            </tr>
                                        </table>
                                    </div>
                                </div>
                                <h4 style="text-align: center">
                                    Transactions Breakdown
                                </h4>
                                <table class="table dt-responsive nowrap w-100">
                                    <thead>
                                    <tr>
{#                                        <th>RefNo</th>#}
                                        <th>Date</th>
                                        <th>Account Dr</th>
                                        <th>Account cr</th>
                                        <th>Narrative</th>
                                        <th>Transaction</th>
                                        <th>Amount Dr</th>
                                        <th>Amount Cr</th>
                                        <th>Running Balance</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    {% for gl in individual_gl %}
                                        <tr>
{#                                            <td>{{ gl.gl.txno }}</td>#}
                                            <td>{{ gl.gl.tx_date }}</td>
                                            {% if gl.account_dr.member is not None  %}
                                                <td>{{ gl.account_dr.member.acc_number }} ({{ gl.account_dr.bio_name }})</td>
                                            {% else %}
                                                <td>{{ gl.account_dr.display_name }}</td>
                                            {% endif %}
                                            {% if gl.account_cr.member is not None  %}
                                                <td>{{ gl.account_cr.member.acc_number }} ({{ gl.account_cr.bio_name }})</td>
                                            {% else %}
                                                <td>{{ gl.account_cr.display_name }}</td>
                                            {% endif %}

                                            <td>{{ gl.gl.narration }}</td>


                                            {% if gl.is_opening_balance %}
                                                <td>Opening Balance</td>
                                            {% else %}
                                                <td>{{ gl.gl.transaction_type }}</td>
                                            {% endif %}

                                            <td class="amounts">{{ gl.amount_dr|default_if_none:'-'|floatformat:2|intcomma }}</td>
                                            <td class="amounts">{{ gl.amount_cr|default_if_none:'-'|floatformat:2|intcomma }}</td>
                                            <td class="amounts">{{ gl.balance|floatformat:2|intcomma }}</td>

                                        </tr>
                                    {% endfor %}
                                    </tbody>

                                    <tfoot>
                                    <tr>
                                        <th colspan="5">TOTALS</th>

                                        <th class="amounts">{{ total_dr|default_if_none:0|floatformat:2|intcomma }}</th>
                                        <th class="amounts">{{ total_cr|default_if_none:0|floatformat:2|intcomma }}</th>
                                        <th class="amounts">
                                            {% if individual_gl|length > 0 %}
                                                {% if account.category.dr_cr == 'cr' %}
                                                    {% dif_calc total_cr|default_if_none:0 total_dr|default_if_none:0 %}
                                                {% elif account == "Members" %}
                                                    {% dif_calc total_cr|default_if_none:0 total_dr|default_if_none:0 %}
                                                {% else %}
                                                    {% dif_calc total_dr|default_if_none:0 total_cr|default_if_none:0 %}
                                                {% endif %}

                                            {% else %}
                                                000
                                            {% endif %}
                                        </th>


                                    </tr>
                                    </tfoot>
                                </table>
                            {% else %}
                                <h6 style="color: red; text-align: center">Please Select a Ledger to get
                                    started</h6>
                            {% endif %}
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
{% endblock %}
{% block javascript %}
    <script>
        var request;
        $(function () {

            $('#search_members').keyup(function () {

                if (request) {
                    request.abort();
                }

                request = $.ajax({
                    type: "GET",
                    url: "/transactions/search_members/",
                    data: {
                        'search_text': $('#search_members').val(),
                        'csrfmiddlewaretoken': $("input[name=csrfmiddlewaretoken]").val()
                    },

                    success: searchSuccess,
                    dataType: 'html'
                });
            });
        });

        function searchSuccess(data, textStatus, jqXHR) {
            $('#search-results').html(data)
        }

    </script>
{% endblock %}