{% extends 'base.html' %}

{% block title %}
  Income and Expenditure
{% endblock %}

{% block extra_css %} 
<link rel="stylesheet" href="{% static 'CSS/income_and_expences.css' %}">
{% endblock %}

{% block header %}
  INCOME AND EXPENDITURE of <u>{{ today }}</u>
{% endblock %}

{% block content %}
  <div class="income_and_expences_container">
    <div class="identity">
      Printed by <b>{{ user.username }}</b>
    </div>

    <h3>Details Amount</h3>
    <div class="table-wrapper">
      <table>
        <tr>
          <th>Total Soda Sold</th>
          <td>{{ total_soda_sold }}</td>
        </tr>
        <tr>
          <th>Total Water Sold</th>
          <td>{{ total_water_sold }}</td>
        </tr>
        <tr>
          <th>Soda In Store</th>
          <td>{{ store.soda_store }}</td>
        </tr>
        <tr>
          <th>Water In Store</th>
          <td>{{ store.water_store }}</td>
        </tr>
      </table>
    </div>

    <h3>TODAY'S TRANSACTIONS ({{ today }})</h3>
    <div class="table-wrapper">
      <table>
        <thead>
          <tr>
            <th>User</th>
            <th>Soda Sold</th>
            <th>Water Sold</th>
            <th>Car</th>
            <th>Amount</th>
            <th>Time</th>
          </tr>
        </thead>
        <tbody>
          {% for t in transactions %}
            <tr>
              <td>{{ t.user.username }}</td>
              <td>{{ t.soda_amount }}</td>
              <td>{{ t.water_amount }}</td>
              <td>{{ t.car_id }}</td>
              <td>{{ t.total_price }}</td>
              <td>{{ t.created_at|time:'H:i' }}</td>
            </tr>
          {% empty %}
            <tr>
              <td colspan="6">No transactions today</td>
            </tr>
          {% endfor %}
        </tbody>
      </table>
    </div>

    <h3>INCOME</h3>
    <div class="table-wrapper">
      <table>
        <tr>
          <th>Collected Cash</th>
          <td>{{ total_price }} Tsh</td>
        </tr>
      </table>
    </div>

    <h3>EXPENDITURE</h3>
    <div class="table-wrapper">
      <table>
        <thead>
          <tr>
            <th>Type</th>
            <th>Information</th>
            <th>Amount</th>
            <th>Approved By</th>
            <th>Date</th>
          </tr>
        </thead>
        <tbody>
          {% for expences in exp %}
            <tr>
              <td>{{ expences.expend_type }}</td>
              <td>{{ expences.info }}</td>
              <td>{{ expences.value_amount }}</td>
              <td>{{ expences.approved_by }}</td>
              <td>{{ expences.created_on }}</td>
            </tr>
          {% empty %}
            <tr>
              <td colspan="5">No expenses today</td>
            </tr>
          {% endfor %}
          <tr>
            <th>Total Expenditure</th>
            <td colspan="4">{{ total_expenditure }} Tsh</td>
          </tr>
        </tbody>
      </table>
    </div>

    <div class="section">
      <strong>{{ total_price }} - {{ total_expenditure }} = {{ cash_amount }} Tsh</strong>
    </div>

    <div class="section">
      <h2># CASH AMOUNT: {{ cash_amount }} Tsh</h2>
    </div>

    <div class="print">
      <button onclick="window.print()">Print 🖨</button>
    </div>
  </div>
{% endblock %}