<?php
include __DIR__ . '/../../config/db.php';

$produits = $conn->query("
    SELECT id, reference, nom, prix_vente 
    FROM produits 
    ORDER BY nom ASC
")->fetchAll(PDO::FETCH_ASSOC);

$modepaiement = $conn->query("SELECT id, libelle FROM modes_paiement ORDER BY id")->fetchAll(PDO::FETCH_ASSOC);
$depots   = $conn->query("SELECT id, nom FROM depots ORDER BY nom ASC")->fetchAll(PDO::FETCH_ASSOC);

$produitsOptionsHtml = '';
foreach ($produits as $p) {
    $label = htmlspecialchars($p['nom']);
    if ($p['reference']) {
        $label .= ' (' . htmlspecialchars($p['reference']) . ')';
    }
    $produitsOptionsHtml .= '
        <option value="'.$p['id'].'" data-prix="'.$p['prix_vente'].'">
            '.$label.'
        </option>';
}

$modepaiementOptionsHtml = '';
foreach ($modepaiement as $m) {
    $modepaiementOptionsHtml .= '
        <option value="'.$m['id'].'">'.$m['libelle'].'</option>';
}

$depotsOptionsHtml = '';
foreach ($depots as $d) {
    $depotsOptionsHtml .= '<option value="'.htmlspecialchars($d['id'], ENT_QUOTES, 'UTF-8').'">'.htmlspecialchars($d['nom'], ENT_QUOTES, 'UTF-8').'</option>';
}
?>


<!-- Modal Ajouter Vente -->
<div class="modal fade" id="ajouterDevisModal" tabindex="-1" aria-labelledby="ajouterDevisLabel" aria-hidden="true">
  <div class="modal-dialog modal-xl">
    <div class="modal-content">
      <form id="formAjouterDevis" method="POST" action="/eagle_client_istanbulcups/api/devis/ajouter.php">
        <div class="modal-header bg-primary text-white">
          <h5 class="modal-title" id="ajouterAchatLabel">Ajouter un devis</h5>
          <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
        </div>

        <div class="modal-body">
          <div class="row g-3 mb-3">
            <div class="col-md-3">
              <label class="form-label">Client</label>
              <select name="client_id" class="form-control" required>
                <option value="">-- Sélectionner --</option>
                <?php
                  $clients = $conn->query("SELECT idClient, nom, exonere FROM clients ORDER BY nom ASC")->fetchAll(PDO::FETCH_ASSOC);
                  foreach ($clients as $c) {
                      echo '<option value="'.htmlspecialchars($c['idClient']).'" data-exonere="'.htmlspecialchars($c['exonere']).'">'
                          .htmlspecialchars($c['nom']).'</option>';
                  }
                ?>
              </select>
            </div>

            <div class="col-md-3">
              <label class="form-label">Date</label>
              <input type="datetime-local" name="date_devis" class="form-control" value="<?= date('Y-m-d\TH:i') ?>" required>
            </div>
          </div>

          <!-- Lignes produits -->
          <div id="produitsContainer">
            <div class="row mb-2 align-items-center" id="ligneProduit0">

              <div class="col-md-3">
                <label>Designation </label>
                <select name="produits[0][id]" class="form-control produitSelect"
                        onchange="mettreAJourPrix(0)">
                  <option value="">-- Produit --</option>
                  <?= $produitsOptionsHtml ?>
                </select>
              </div>
              
              <div class="col-md-2">
                <label>Quantité </label>
                <input type="number" name="produits[0][quantite]"
                      class="form-control quantiteInput"
                      value="1" min="1"
                      oninput="calculerLigne(0)">
              </div>

              <div class="col-md-2">
                <label>Prix vente </label>
                <input type="number" name="produits[0][prix]" class="form-control prixInput"
                      id="prixUnitaire0" step="0.01" min="0" oninput="calculerLigne(0)">
              </div>

              <div class="col-md-2">
                <label>Total </label>
                <input type="text" class="form-control sousTotal"
                      id="sousTotal0" readonly>
              </div>

              <div class="col-auto">
                <button type="button" class="btn btn-danger btn-sm"
                        onclick="supprimerLigneProduit(0)">🗑️</button>
              </div>

            </div>
          </div>

          <div class="mt-2 mb-3">
            <button type="button" class="btn btn-success btn-sm" onclick="ajouterLigneProduit()">➕ Ajouter un produit</button>
          </div>

          <!-- Totaux -->
          <div class="row g-3 align-items-end">
            <div class="col-md-3">
              <label>Total HT</label>
              <input type="text" id="totalBrutInput" class="form-control" readonly value="0">
            </div>
            <div class="col-md-3">
              <label>Taxe</label>
              <input type="text" id="taxe" name="taxe" class="form-control" readonly>
            </div>
            <div class="col-md-3">
              <label>Remise </label>
             <input type="number" id="remise" name="remise" class="form-control"value="0" min="0" step="1" oninput="calculerTotal()">
            </div>
            <div class="col-md-3">
              <label>Total TTC (après remise)</label>
              <input type="text" id="totalTTCNetInput" class="form-control" readonly value="0">
              <input type="hidden" id="hiddenTotalDevise" name="total_devise" value="0">
              <input type="hidden" id="hiddenTotalCFA" name="total_cfa" value="0">
            </div>
          </div>
        </div>

        <div class="modal-footer">
          <button type="submit" class="btn btn-primary">Enregistrer</button>
          <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Annuler</button>
        </div>
      </form>
    </div>
  </div>
</div>

<script>
const produitsOptions = `<?= $produitsOptionsHtml ?>`;
//const depotsOptions   = `<?= $depotsOptionsHtml ?>`;
let produitIndex = 1;

/* ---------- AJOUT / SUPPRESSION ---------- */
function ajouterLigneProduit() {
  const i = produitIndex++;
  document.getElementById('produitsContainer').insertAdjacentHTML(
    'beforeend',
    `
    <div class="row mb-2 align-items-center" id="ligneProduit${i}">
      <div class="col-md-3">
        <select name="produits[${i}][id]" class="form-control produitSelect"
                onchange="mettreAJourPrix(${i})">
          <option value="">-- Produit --</option>
          ${produitsOptions}
        </select>
      </div>

      <div class="col-md-2">
        <input type="number" name="produits[${i}][quantite]"
               class="form-control quantiteInput"
               value="1" min="1"
               oninput="calculerLigne(${i})">
      </div>

      <div class="col-md-2">
        <input type="number" name="produits[${i}][prix]" class="form-control prixInput"
               id="prixUnitaire${i}" step="0.01" min="0" oninput="calculerLigne(${i})">
      </div>

      <div class="col-md-2">
        <input type="text" class="form-control sousTotal"
               id="sousTotal${i}" readonly>
      </div>

      <div class="col-auto">
        <button type="button" class="btn btn-danger btn-sm"
                onclick="supprimerLigneProduit(${i})">🗑️</button>
      </div>
    </div>
    `
  );
}

function supprimerLigneProduit(i) {
  document.getElementById('ligneProduit'+i)?.remove();
  calculerTotal();
}

/* ---------- PRIX & CALCUL ---------- */
function mettreAJourPrix(i) {
  const ligne = document.getElementById(`ligneProduit${i}`);
  if (!ligne) return;

  const select = ligne.querySelector('.produitSelect');
  const prixInput = document.getElementById(`prixUnitaire${i}`);

  const prix = parseFloat(select?.selectedOptions[0]?.dataset?.prix || 0);

  prixInput.value = prix.toFixed(2);

  calculerLigne(i);
}


function calculerLigne(i) {
  const q = document.querySelector(`#ligneProduit${i} .quantiteInput`)?.value || 0;
  const p = document.getElementById(`prixUnitaire${i}`)?.value || 0;
  document.getElementById(`sousTotal${i}`).value = (q * p).toFixed(2);
  calculerTotal();
}

/* ---------- TOTAUX ---------- */
function calculerTotal() {
  let total = 0;
  document.querySelectorAll('.sousTotal').forEach(el => {
    total += parseFloat(el.value || 0);
  });

/*   const fournisseur = document.querySelector('[name="fournisseur_id"]');
  const exonere = fournisseur?.selectedOptions[0]?.dataset?.exonere === "1";
  const taxe = exonere ? 0 : 0; */

  const client = document.querySelector('select[name="client_id"]');
  const exonere = client?.options[client.selectedIndex]?.getAttribute('data-exonere') ?? "1";
  const taxeRate = (exonere === "0") ? 0.18 : 0; // 18% si soumis, sinon 0
  const taxe = total * taxeRate;

  const remiseValeur = parseFloat(document.getElementById('remise')?.value || 0);

  if (remiseValeur > (total + taxe)) {
  alert("La remise ne peut pas dépasser le total");
  document.getElementById('remise').value = 0;
}

  let ttc = (total + taxe) - remiseValeur;
  if (ttc < 0) ttc = 0;

  document.getElementById('totalBrutInput').value = total.toFixed(2);
  document.getElementById('taxe').value = taxe.toFixed(2);
  document.getElementById('totalTTCNetInput').value = ttc.toFixed(2);
  document.getElementById('hiddenTotalCFA').value = ttc.toFixed(2);

  calculerReste();
}


function calculerReste() {
  const total = parseFloat(document.getElementById('totalTTCNetInput').value || 0);
  const verse = parseFloat(document.getElementById('montantVerse').value || 0);
  const reste = total - verse;

  const field = document.getElementById('resteAPayer');
  field.value = reste.toFixed(2);
  field.classList.toggle('is-invalid', reste > 0);
  field.classList.toggle('is-valid', reste <= 0);

  document.getElementById('statutAchat').value = reste > 0 ? 'Impayé' : 'Payé';
}
</script>
