{% extends 'admin_pages/base_admin.html' %}
{% block title %}Received Details for Order #{{ order.id }}{% endblock %}

{% block content %}
            <!-- Company Info Row -->
            {% include 'includes/print_header.html' %}
            <hr>
<h2>Received Order Details - Order #{{ order.id }}</h2>
<p><strong>Supplier:</strong> {{ order.order_to }}</p>
<p><strong>Placed At:</strong> {{ order.placed_at }}</p>
<p><strong>Remarks:</strong> {{ receive_order.remarks }}</p>

<table class="table table-bordered mt-3">
  <thead class="table-light">
    <tr>
      <th>Product</th>
      <th>Batch No</th>
      <th>Expiry Date</th>
      <th>Ordered Qty</th>
      <th>Received Qty</th>
      <th>Damaged Qty</th>
      <th>Returned Qty</th>
      <th>Purchased Price</th>
      <th>Cargo</th>
      <th>Sale Rate</th>
      <th>Items can be sold</th>
      <th>Purchase Total</th>
      <th>Sale Total</th>
    </tr>
  </thead>
  <tbody>
    {% for item in received_items %}
    <tr>
      <td>{{ item.product }}</td>
      <td>{{ item.batch_details }}</td>
      <td>{{ item.expiry_date }}</td>
      <td>{{ item.ordered_quantity }}</td>
      <td>{{ item.received_quantity }}</td>
      <td>{{ item.damaged_quantity }}</td>
      <td>{{ item.returned_quantity }}</td>
      <td>{{ item.purchased_price }}</td>
      <td>{{ item.carge_charges }}</td>
      <td>{{ item.sale_rate }}</td>
      <td><strong>{{ item.saleable_qty }}</strong></td>
      <td>{{ item.line_purchase_total|floatformat:2 }}</td>
      <td>{{ item.line_sale_total|floatformat:2 }}</td>
    </tr>
    {% endfor %}
  </tbody>
  <tfoot>
    <tr>
      <td colspan="12" class="text-end fw-bold">Total Purchase Value:</td>
      <td class="text-end fw-bold">{{ purchase_total|floatformat:2 }}</td>
    </tr>
    <tr>
      <td colspan="12" class="text-end fw-bold">Expected Sale Value:</td>
      <td class="text-end fw-bold text-success">{{ sale_total|floatformat:2 }}</td>
    </tr>
  </tfoot>
</table>



<style>
  @media print {
    .navbar, .sidebar, footer, nav,.no-print * {
      display: none !important;
    }
    
    .container {
      padding: 10px;
      font-size: small;
    }
    p, .table td, .table th {
      margin: 0 !important;
      padding: 2px;
      line-height: 1.3;
    }
  }
</style>
<!-- Approval & Printed Info -->
<div class="mt-5 row text-muted small">
  <div class="col-md-6">
    <p><strong>Approved By:</strong> ....................................................</p>
  </div>
  <div class="col-md-6 text-end">
    <p><strong>Printed By:</strong> {{ request.user.get_full_name|default:request.user.username }}</p>
    <p><strong>Printed At:</strong> {% now "Y-m-d H:i" %}</p>
  </div>
</div>

<!-- Action Buttons -->
<div class="card no-print mt-3 shadow-sm border-0">
  <div class="card-body d-flex justify-content-between align-items-center px-4 py-3">
    <a href="{% url 'inventory:order_list' %}" class="btn btn-secondary d-flex align-items-center px-4">
      <i class="fas fa-arrow-left me-2"></i> Back to Orders
    </a>
    <button type="button" class="btn btn-outline-primary d-flex align-items-center px-4" onclick="window.print()">
      <i class="fas fa-print me-2"></i> Print Report
    </button>
  </div>
</div>

{% endblock %}