{% extends 'board.html' %}
{% load static %}
{% load humanize %}
{% block title %}
  <title>Receipt</title>
  <style type="text/css">
  @media print {
    body {-webkit-print-color-adjust: exact;}
      #printbtn {
          display :  none;
      }
  }

  li {
    margin-left: 10px;
    list-style-type: square
  }

  new_font {
    font-size: 38px;
  }

  </style>
  <meta name="description" content="">

{% endblock title %}

{% block content %}

{% load home_tags %}
<div class=" app-content">
	<div class="side-app">
    <br>
    <div class="row">
      <div class="col-md-12">
        <div class="card">
          <div class="card-body">
            <div class="d-flex strong">
              <div class="row">
                <p class="lh mt-4">Telephone: </p>
                <p class="lh3">Email: bursar@apu.edu.ng</p>
              </div>


              <div class="text-right ml-auto">
                <div class="row">
                  <div class="col-md-10 text-right ml-auto strong p1 mt-4">
                    <h5 class="text-apu-purple lh"><strong>AHMAN PATEGI UNIVERSITY</strong></h5>
                    <p class="text-apu-purple lh2"><strong>Km 3 Patigi-Kpada Road, Patigi, Kwara State, Nigeria</strong></p>
                    <p class="text-apu-purple lh3"><strong>Tel: 09031517702, 08143485771</strong></p>

                  </div>
                  <div class="col-md-2 text-right ml-aut">
                    <img alt="logo" class="logo" src="{% static 'img/logo2.png' %}">
                  </div>
                </div>
              </div>
            </div>
            <h5 class="text-center text-black strong">RECEIPT</h5>
            <hr>
            <div class="row">
              <div class="col-lg-6 strong">
                <p class="h6 text-black">BILL TO:</p>
                <address>
                  Mr and Mrs {{receipt.undergrad.last_name}}{% if receipt.undergrad.parent_address == None %}{% else %},<br>
                  {{receipt.undergrad.parent_address}}{% endif %}
                </address>
              </div>
              <div class="col-lg-6 text-right">

              </div>
            </div>
            <div class="row">
              <h6 class="text-black text-center"><strong>2023/2024 Academic Session</strong></h6>
                <div class="table-responsive">
                  <table class="table table-sm table-bordered">
                    <tbody class="table-green">
                      <tr>
                        <th style="background:#544A89!important" class="text-center text-white large"><strong>MATRIC NO</strong></th>
                        <th style="background:#544A89!important" class="text-center text-white large"><strong>LEVEL</strong></th>
                        <th style="background:#544A89!important" class="text-center text-white large"><strong>NAME</strong></th>
                        <th style="background:#544A89!important" class="text-center text-white large"><strong>PROGRAMME</strong></th>
                        <th style="background:#544A89!important" class="text-center text-white large"><strong>DATE</strong></th>
                        <th style="background:#544A89!important" class="text-center text-white large"><strong>receipt NO</strong></th>
                      </tr>

                      <tr class="table-white">
                        <td class="text-black"><strong>{{receipt.undergrad.username}}</strong></td>
                        <td class="text-black text-left"><strong>100</strong></td>
                        <td class="text-black text-left"><strong>{{receipt.undergrad.first_name}} {{receipt.undergrad.last_name}}</strong></td>
                        <td class="text-black text-left"><strong>{{receipt.undergrad.programme}}</strong></td>
                        <td class="text-black text-left"><strong>{{receipt.created}}</strong></td>

                        <td class="text-black text-left"><strong>APU-23/24-{{receipt.id}}</strong></td>

                      </tr>
                      <tr class="table-white">
                        <td colspan="5" class="text-apu-purple"><strong>NARRATIVE</strong></td>
                        <td class="text-apu-purple text-left"><strong>AMOUNT</strong></td>
                      </tr>
                      <tr class="table-white">
                        <td colspan="5" class="text-black"><strong>Acceptance Fee - </strong></td>
                        <td class="text-black text-left"><strong>₦25,000.00</strong></td>
                      </tr>


                      <tr class="table-white">
                        <td colspan="5" class="text-black"><strong>Tuition Fee (50%) - </strong></td>
                        <td class="text-black text-left"><strong>₦{{receipt.undergrad.programme.amount|intcomma}}</strong></td>
                      </tr>

                      <tr class="table-white">
                        <td colspan="5" class="text-black"><strong>Aliyu Ahman Pategi Foundation (50%) - </strong></td>
                        <td class="text-black text-left"><strong>₦147,500.00 (Waived)</strong></td>
                      </tr>



                      <tr class="table-white">
                        <td colspan="5" class="text-black"><strong>Accomodation Fee - </strong></td>
                        <td class="text-black text-left"><strong>₦150,000.00</strong></td>
                      </tr>

                      <tr class="table-white">
                        <td colspan="5" class="text-apu-green"><strong>Total Bill - </strong></td>
                        <td class="text-black text-left"><strong>₦322,000.00</strong></td>
                      </tr>

                    </tbody>
                  </table>
                  
            <button id="printbtn" type="button" class="btn btn-cylinder mb-1" onClick="javascript:window.print();"><i class="fas fa-print fa-1x mr-1"></i> Print receipt</button>
        </div>
      </div>
    </div>
  </div>



	</div>
</div>
{% endblock content%}