{% extends 'base.html' %}

{% 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>Income</h2>
            </div>
            <div class="col-lg-2">

            </div>
        </div>
		<!-- test -->
        <div class="wrapper wrapper-content animated fadeInRight">
            <div class="col-lg-12">
                <div class="ibox">
                    <div class="ibox-content">
                        <table class="table table-striped table-bordered">
                            <tr>
                                <th>Income Type</th>
                                <th>Donation Type</th>
                                <th>Name of Donor / Organisation </th>
                            </tr>
                            <tr>
                                <td>{{income.income_type}}</td>
                                <td>{{income.donation_type}}</td>
                                <td>{{income.donor}}</td>
                            </tr>
                            <tr>
                                <th>Email ID</th>
                                <th>Contact Number</th>
                                <th>Aadhar Number</th>
                            </tr>
                            <tr>
                                <td>{{income.email}}</td>
                                <td>{{income.mobile}}</td>
                                <td>{{income.aadhar_no}}</td>
                            </tr>
                            <tr>
                                <th>PAN No.</th>
                                <th>Saction Amount</th>
                                <th>Received Amount</th>
                            </tr>
                            <tr>
                                <td>{{income.pan_no}}</td>
                                <td>{{income.sanction_amount}}</td>
                                <td>{{income.received_amount}}</td>
                            </tr>
                            <tr>
                                <th>Mode of Payment</th>
                                <th>Proof of Evidence</th>
                                <th>Payment Date</th>
                            </tr>
                            <tr>
                                <td>{{income.mode_of_payment}}</td>
                                <td>
                                    {% if income.proof_of_evidence %}
                                        <a href="{{income.proof_of_evidence.url}}" target="_blank">
                                            View
                                        </a>
                                    {% else %}
                                        -
                                    {% endif %}
                                </td>
                                <td>{{income.payment_date}}</td>
                            </tr>
                        </table>
                    </div>
                </div>

                <div class="ibox">
                    <div class="ibox-content">
                        <div class="ibox-title px-2 justify-content-between d-flex align-items-center">
                            <h5>Alloted Amount</h5>
                        </div>

                        <table class="table table-striped table-bordered">
                            <tr>
                                <th>Human Resource</th>
                                <th>Camp Expenses</th>
                                <th>Training & Capacity Building Expenses</th>
                            </tr>
                            <tr>
                                <td>{{income.human_resource}}</td>
                                <td>{{income.camp_expenses}}</td>
                                <td>{{income.training_expenses}}</td>
                            </tr>
                            <tr>
                                <th>Equipment & Suplies</th>
                                <th>Travel Expenses</th>
                                <th>IEC Material Expenses</th>
                            </tr>
                            <tr>
                                <td>{{income.equipment_expenses}}</td>
                                <td>{{income.travel_expenses}}</td>
                                <td>{{income.material_expences}}</td>
                            </tr>
                            <tr>
                                <th>Administrative Expenses</th>
                                <th>Accomondation Expenses</th>
                                <th>Monitoring & Evaluation Expenses</th>
                            </tr>
                            <tr>
                                <td>{{income.administrative_expenses}}</td>
                                <td>{{income.accomodation_expenses}}</td>
                                <td>{{income.monitoring_expenses}}</td>
                            </tr>
                            <tr>
                                <th>Miscellaneous Expenses</th>
                            </tr>
                            <tr>
                                <td>{{income.miscellaneous_expenses}}</td>
                            </tr>
                        </table>

                    </div>
                </div>

                <div class="ibox">
                    <div class="ibox-content">
                        <div class="ibox-title px-2 justify-content-between d-flex align-items-center">
                            <h5>Alloted Target</h5>
                        </div>

                        <table class="table table-striped table-bordered">
                            <thead>
                                <tr>
                                    <th>Target Name</th>
                                    <th>Target No</th>
                                </tr>
                            </thead>
                            <tbody id="targets">
                                {% for target in income.alloted_targets.all %}
                                    <tr>
                                        <td>{{target.target_name}}</td>
                                        <td>{{target.target_number}}</td>
                                    </tr>
                                {% endfor %}
                            </tbody>
                        </table>
                    </div>
                </div>

                <div class="ibox">
                    <div class="ibox-content">
                        <table class="table table-striped table-bordered">
                            <tr>
                                <th>Program Type</th>
                                <th>Project</th>
                                <th>State</th>
                            </tr>
                            <tr>
                                <td>{{income.program_type.program_type}}</td>
                                <td>{{income.project.project}}</td>
                                <td>{{income.state.state}}</td>
                            </tr>
                            <tr>
                                <th>District</th>
                                <th>Start Date</th>
                                <th>End Date</th>
                            </tr>
                            <tr>
                                <td>{{income.district.district}}</td>
                                <td>{{income.start_date}}</td>
                                <td>{{income.end_date}}</td>
                            </tr>
                            <tr>
                                <th>Address</th>
                                <td colspan="2">{{income.address}}</td>
                            </tr>
                            <tr>
                                <th>Message</th>
                                <td colspan="2">{{income.message}}</td>
                            </tr>
                        </table>
                    </div>
                </div>
            </div>
        </div>
	</div>
</div>

{% for message in messages %}
	<script>
		showNotification('{{message}}', '{{message.tags}}')
	</script>
{% endfor %}

{% endblock %}