{% extends 'base.html' %}
{% load kunj_filters %}

{% block body %}

<div id="wrapper">
    {% include 'navbar.html' %}

    <div id="page-wrapper" class="gray-bg">
        {% include 'header.html' %}
        <div class="row wrapper border-bottom white-bg page-heading">
            <div class="col-lg-10">
                <h2>Donor Register — Form 10BD Reference</h2>
            </div>
            <div class="col-lg-2"></div>
        </div>

        <div class="wrapper wrapper-content animated fadeInRight">

            <div class="row">
                <div class="col-lg-12">
                    <div class="alert" style="background:#3a2f12; border:1px solid #6b5420; color:#f0c96b; border-radius:8px;">
                        <i class="fa fa-exclamation-triangle"></i>
                        <strong>For reference only.</strong> This report compiles donor details in the shape Form 10BD needs (donor identity, amount, mode, section).
                        It does <u>not</u> file anything automatically. Please verify every row and file Form 10BD yourself via the Income Tax e-filing portal,
                        or hand this sheet to your Chartered Accountant — exact field requirements can change with each year's Finance Act.
                    </div>
                </div>
            </div>

            <div class="row">
                <div class="col-lg-12">
                    <div class="ibox">
                        <div class="ibox-title px-4 justify-content-between d-flex align-items-center">
                            <form id="donor_register_form" action="/admin/finance-department/donor-register" method="GET" style="width:100%;">
                                <div class="flex-row justify-content-between w-100 d-flex align-items-end">
                                    <div class="form-group mb-0 d-flex flex-column mr-2">
                                        <label>Project</label>
                                        <select data-placeholder="" id="project" data-value="{{project}}" name="project" class="select2 form-control" tabindex="-1">
                                            <option value="All">All</option>
                                            {% for p in projects %}
                                                <option value="{{p.id}}">{{p.project}}</option>
                                            {% endfor %}
                                        </select>
                                    </div>
                                    <div class="form-group mb-0 d-flex flex-column">
                                        <label>Financial Year</label>
                                        <select data-placeholder="" id="financial_year" data-value="{{financial_year}}" name="financial_year" class="select2 form-control" tabindex="-1">
                                            <option value="All">All</option>
                                            {% for fy in financial_years %}
                                                <option value="{{fy}}">{{fy}}</option>
                                            {% endfor %}
                                        </select>
                                    </div>
                                    <div>
                                        <button type="submit" class="btn btn-w-s btn-primary">Apply</button>
                                        <button type="button" id="export_table" class="btn btn-w-s btn-primary">Export to Excel</button>
                                    </div>
                                </div>
                            </form>
                        </div>
                        <div class="ibox-content">
                            <div class="table-responsive">
                                <table class="footable table table-stripped table-bordered" data-page-size="15">
                                    <thead>
                                        <tr>
                                            <th data-toggle="true">Sl. No.</th>
                                            <th>Donor Name</th>
                                            <th>ID Type</th>
                                            <th>ID Number</th>
                                            <th>Address</th>
                                            <th>Type of Donation</th>
                                            <th>Mode of Receipt</th>
                                            <th>Amount Received</th>
                                            <th>Tax Section</th>
                                            <th>Payment Date</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        {% for income in incomes %}
                                            <tr>
                                                <td>{{forloop.counter}}</td>
                                                <td>{{income.donor}}</td>
                                                <td>{{income.id_type}}</td>
                                                <td>{{income.id_number|default:"—"}}</td>
                                                <td>{{income.address|default:"—"}}</td>
                                                <td>{{income.donation_type}}</td>
                                                <td>{{income.mode_of_payment}}</td>
                                                <td>₹ {{income.received_amount}}</td>
                                                <td>{{income.tax_section|default:"Not set"}}</td>
                                                <td>{{income.payment_date|ddmmyyyy}}</td>
                                            </tr>
                                        {% empty %}
                                            <tr><td colspan="10" class="text-center">No income records for this selection.</td></tr>
                                        {% endfor %}
                                    </tbody>
                                    <tfoot>
                                        <tr style="font-weight:700;"><td colspan="7" class="text-right">Total</td><td>₹ {{total_received}}</td><td colspan="2"></td></tr>
                                    </tfoot>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

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

<script>
    $('.footable').footable({
        "paging": {
            "enabled": true
        }
    });

    $(document).ready(function(){
        var financial_year = $('#financial_year').attr('data-value');
        var project = $('#project').attr('data-value');
        $('#financial_year').select2({}).val(financial_year.toString()).trigger('change');
        $('#project').select2({}).val(project.toString()).trigger('change');
    });

    $(document).on('click', '#export_table', function() {
        $(".footable").table2excel({
            exclude: "",
            name: "donor_register",
            filename: "donor_register_form_10bd.xls",
            preserveColors: false
        });
    });
</script>

{% endblock %}