<?php require_once 'conexion2.php'; ?>
<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="UTF-8">
  <title>Transferir Factura</title>
  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
  <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body class="bg-light">
  <div class="container py-5">
    <div class="card shadow">
      <div class="card-header bg-primary text-white">
        <h4 class="mb-0">Transferir Factura a Otro Cliente</h4>
      </div>
      <div class="card-body">
        <form action="procesar_transferencia.php" method="POST">

          <div class="mb-3">
            <label for="invoice_id" class="form-label">Buscar factura</label>
            <input type="text" class="form-control" name="invoice_id" id="invoice_id" autocomplete="off" required>
            <div id="sugerencias_facturas" class="list-group"></div>
          </div>

          <div class="mb-3">
            <label for="nuevo_cliente" class="form-label">Nuevo cliente</label>
            <input type="text" class="form-control" id="buscar_cliente" autocomplete="off" placeholder="Buscar cliente...">
            <div id="sugerencias_clientes" class="list-group"></div>
            <input type="hidden" name="nuevo_cliente" id="nuevo_cliente" required>
          </div>

          <button type="submit" class="btn btn-success w-100">Transferir Factura</button>
        </form>
      </div>
    </div>
  </div>

<script>
$(document).ready(function () {
  // Autocompletado de factura
  $('#invoice_id').on('input', function () {
    let query = $(this).val();
    if (query.length >= 2) {
      $.post('ajax_buscar_factura.php', {query: query}, function (data) {
        $('#sugerencias_facturas').html(data).show();
      });
    } else {
      $('#sugerencias_facturas').hide();
    }
  });

  $(document).on('click', '.factura-item', function () {
    $('#invoice_id').val($(this).text());
    $('#sugerencias_facturas').hide();
  });

  // Autocompletado de cliente
  $('#buscar_cliente').on('input', function () {
    let query = $(this).val();
    if (query.length >= 2) {
      $.post('ajax_buscar_cliente.php', {query: query}, function (data) {
        $('#sugerencias_clientes').html(data).show();
      });
    } else {
      $('#sugerencias_clientes').hide();
    }
  });

  $(document).on('click', '.cliente-item', function () {
    $('#buscar_cliente').val($(this).text());
    $('#nuevo_cliente').val($(this).data('id'));
    $('#sugerencias_clientes').hide();
  });
});
</script>
</body>
</html>
