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

{% block title %}Share Vendor Settlement #{{ payment.description }}{% endblock %}
{% block heading %}Share Vendor Settlement #{{ payment.description }}{% endblock %}

{% block content %}
<div class="card shadow mb-4">
  <div class="card-body">
    <p class="mb-2">
      Use this page to share the vendor settlement PDF via WhatsApp, Email, etc.
    </p>
    <button id="btnShare" class="btn btn-primary mb-3">
      <i class="fas fa-share-alt mr-1"></i> Share
    </button>

    <div class="mb-2">
      <a href="{{ download_url }}" target="_blank" class="btn btn-outline-secondary btn-sm mr-1">
        <i class="fas fa-external-link-alt mr-1"></i> Open Receipt
      </a>
      <a href="{{ download_url }}" download class="btn btn-outline-dark btn-sm">
        <i class="fas fa-download mr-1"></i> Download PDF
      </a>
    </div>

    <small class="text-muted d-block mt-2">
      If your browser does not support direct sharing, use Open / Download and share the file manually.
    </small>
  </div>
</div>
{% endblock %}

{% block javascripts %}
<script>
document.addEventListener('DOMContentLoaded', function(){
  const shareBtn = document.getElementById('btnShare');
  const url = "{{ download_url }}";

  shareBtn.addEventListener('click', async function(){
    if (navigator.share) {
      try {
        await navigator.share({
          title: "Vendor Settlement #{{ payment.description }}",
          text: "Vendor settlement receipt",
          url: url
        });
      } catch (err) {
        console.log("Share cancelled or failed", err);
      }
    } else {
      alert("This browser does not support direct share. Please use Open / Download buttons.");
    }
  });
});
</script>
{% endblock %}