{% extends "pos/base.html" %}
{% load static %}

{% block title %}Parties{% endblock %}
{% block stylesheets %}
  <link href="{% static 'vendor/datatables/dataTables.bootstrap4.min.css' %}" rel="stylesheet"/>
{% endblock %}

{% block heading %}Party Management{% endblock %}

{% block content %}

<div class="mb-3">
  <a href="{% url 'coa:party_add' %}" class="btn btn-primary"><i class="fas fa-plus"></i> Add Party</a>
  <button type="button" class="btn btn-outline-success" data-toggle="collapse" data-target="#excelUploadBox">
    <i class="fas fa-file-excel"></i> Excel Upload
  </button>
  <a href="{% url 'customer_portal:pending_requests' %}" class="btn btn-outline-warning">
  <i class="fas fa-receipt"></i> Payment Requests
</a>
</div>

<div class="collapse mb-3" id="excelUploadBox">
  <div class="card border-success">
    <div class="card-body">
      <a href="{% url 'coa:party_excel_template' %}" class="btn btn-sm btn-outline-primary mb-2">
        <i class="fas fa-download"></i> Download Excel Template
      </a>
      <form method="post" action="{% url 'coa:party_excel_upload' %}" enctype="multipart/form-data" class="form-inline">
        {% csrf_token %}
        <input type="file" name="excel_file" accept=".xlsx" class="form-control-file mr-2" required>
        <button type="submit" class="btn btn-sm btn-success"><i class="fas fa-upload"></i> Upload &amp; Continue</button>
      </form>
      <small class="text-muted"><i class="fas fa-info-circle mr-1"></i> On save, this will automatically post against the Opening Balance Equity account (3300).</small>
    </div>
  </div>
</div>

<form method="get" class="form-inline mb-3">
  <label class="mr-2">Type:</label>
  <select name="type" class="form-control mr-2">
    <option value="">All</option>
    {% for val, label in party_types %}
      <option value="{{ val }}" {% if val == type_filter %}selected{% endif %}>{{ label }}</option>
    {% endfor %}
  </select>
  <input type="text" name="q" class="form-control mr-2" placeholder="Search name/phone/email" value="{{ search }}">
  <div class="form-check mr-2">
    <input type="checkbox" name="show_inactive" class="form-check-input" id="show_inactive"
           value="1" {% if show_inactive %}checked{% endif %}>
    <label class="form-check-label" for="show_inactive">Show Inactive</label>
  </div>
  <button type="submit" class="btn btn-primary">Search</button>
</form>

<table id="partyTable" class="table table-bordered table-hover text-nowrap">
  <thead class="thead-light">
    <tr>
      <th>Name</th>
      <th>Type</th>
      <th>Phone</th>
      <th>Linked Account</th>
      <th>Current Balance</th>
      <th>Max Balance</th>
      <th>Status</th>
      <th>Action</th>
    </tr>
  </thead>
  <tbody>
    {% for p in parties %}
    <tr>
      <td>{{ p.name }}</td>
      <td>{{ p.get_party_type_display }}</td>
      <td>{{ p.phone }}</td>
      <td>{% if p.linked_account %}{{ p.linked_account.code }} — {{ p.linked_account.name }}{% else %}—{% endif %}</td>
      <td class="{% if p.balance_status == 'over' %}bg-danger text-white{% elif p.balance_status == 'warning' %}bg-warning{% endif %}">
        {{ p.current_balance|floatformat:2 }} {{ p.current_balance_type }}
      </td>
      <td>{% if p.max_balance %}{{ p.max_balance|floatformat:2 }}{% else %}—{% endif %}</td>
      <td>
        {% if p.is_active %}
          <span class="badge badge-success">Active</span>
        {% else %}
          <span class="badge badge-secondary">Inactive</span>
        {% endif %}
      </td>
      <td>
        <a href="{% url 'coa:party_ledger' p.pk %}" class="btn btn-sm btn-info">Ledger</a>
        <a href="{% url 'coa:party_edit' p.pk %}" class="btn btn-sm btn-primary">Edit</a>
        <a href="{% url 'customer_portal:manage_portal_access' p.pk %}" class="btn btn-sm btn-outline-dark">
          <i class="fas fa-user-lock"></i> Portal Access
        </a>
        <form method="post" action="{% url 'coa:party_delete' p.pk %}" style="display:inline;">
          {% csrf_token %}
          <button type="submit" class="btn btn-sm btn-danger"
                  onclick="return confirm('Delete this party?');">Delete</button>
        </form>
      </td>
    </tr>
    {% endfor %}
  </tbody>
</table>

{% endblock %}

{% block javascripts %}
<script>
  $(document).ready(function(){
    $('#partyTable').DataTable({
      pageLength: 25,
      ordering: false
    });
  });
</script>
{% endblock %}