{% extends "admin_base.html" %}
{% import "macros/admin_crud_list.html" as crud %}
{% import "macros/loading_spinner.html" as spinner %}

{% block extra_head %}
<link rel="stylesheet" href="/plugins/vendor/assets/css/vendor.ui.css">
{% endblock %}

{% block page_title %}Vendor Settlements{% endblock %}

{% block admin_content %}
<div class="vendor-management-container" data-plugin="vendor"
     data-currency-symbol="{{ currency_symbol | default(value='₹') }}"
     id="vendor-admin-settlements">
  {{ crud::shell_open(config_url="/plugins/vendor/assets/admin/settlements_page.json", mount_id="vendor-settlements-header", custom_mount=true) }}
  {{ crud::shell_close() }}

  {{ crud::shell_open(config_url="/plugins/vendor/assets/admin/settlements_vendors_list.json", mount_id="vendor-settlements-vendors", custom_mount=true) }}
  <table>
    <thead></thead>
    <tbody>
      {{ spinner::table_skeleton(colspan=5, lines=2, label="Loading vendors…") }}
    </tbody>
  </table>
  {{ crud::shell_close() }}

  {{ crud::shell_open(config_url="/plugins/vendor/assets/admin/settlements_consolidation_list.json", mount_id="vendor-settlements-consolidation", custom_mount=true) }}
  <table>
    <thead></thead>
    <tbody>
      {{ spinner::table_skeleton(colspan=7, lines=2, label="Loading consolidation…") }}
    </tbody>
  </table>
  {{ crud::shell_close() }}

  {{ crud::shell_open(config_url="/plugins/vendor/assets/admin/settlements_pending_lines_list.json", mount_id="vendor-settlements-pending-lines", custom_mount=true) }}
  <table>
    <thead></thead>
    <tbody>
      {{ spinner::table_skeleton(colspan=8, lines=2, label="Loading pending lines…") }}
    </tbody>
  </table>
  {{ crud::shell_close() }}
</div>
{% endblock %}

{% block scripts %}
<script src="/plugins/vendor/assets/js/vendor-admin-settlements.js"></script>
{% endblock %}