@model VentaUniformes.Application.VentasView.VentasViewModel;
@{
    ViewData["Title"] = "Venta uniformes";
}
<form asp-action="Principal" method="post">
   <div class="row">
        <!-- Columna izquierda: tabla de productos enctype="multipart/form-data-->
        <div class="col-md-8" form-group>
          
            <div class="form-group">
                <label asp-for="Alumno"></label>
                <input asp-for="Alumno" class="form-control" />
            </div>
            <div class="form-group">
                <label asp-for="Curso"></label>
                <input asp-for="Curso" class="form-control" />
            </div>
                <div class="form-group">
                <label asp-for="isBill"> 
                    <input type="checkbox" asp-for="isBill" id="con-factura" onchange="toggleFactura()" /> Con factura
                </label>
                <div id="factura">
                    <div class="form-group">
                        <label asp-for="Name">Nombre</label>
                        <input asp-for="Name" id="name-factura" class="form-control" />
                    </div>
                    <div class="form-group">
                        <label asp-for="DNI">DNI</label>
                        <input asp-for="DNI" id="dni-factura" class="form-control" />
                    </div>
                </div>
            </div>
            <!-- Input (oculto inicialmente) -->
            <div id="campoInput" style="display:none; margin-top:10px;">
                <label for="inputOpcional">Texto adicional:</label>
                <input type="text" id="inputOpcional" name="inputOpcional" placeholder="Escribe algo..." />
            </div>
            <table class="table">
                <thead>
                    <tr>
                        <th>Nombre</th>
                        <th>Descripcion</th>
                        <th>Precio</th>
                        <th>Cantidad</th>
                    </tr>
                </thead>
                <tbody>
                    @for (int i = 0; i < Model.Productos.Count; i++)
                    {
                        <tr>
                            <td>@Model.Productos[i].Name</td>
                            <td>@Model.Productos[i].Description</td>
                            <td>@Model.Productos[i].Price.ToString("C")</td>
                             <td>
                                <input asp-for="Productos[i].Cantidad" class="form-control cantidad-input" data-precio="@Model.Productos[i].Price.ToString().Replace(',','.')" data-index="@i" data-idp="@Model.Productos[i].Id" type="number" min="0" />
                                <input asp-for="Productos[i].Id" type="hidden" />
                                <input asp-for="Productos[i].Price" type="hidden" />
                            </td>
                        </tr>
                    }
                </tbody>
            </table>
        </div>
        <!-- Columna derecha: resumen de total y método de pago -->
   
        <div class="col-md-4 form-group">
            <div class="card form-group">
                <div class="card-body form-group">
                
                    <h5 class="card-title">Resumen</h5>
                        <p><strong>Total:<span id="total">0.00</span> €</strong></p>

                    <h6>Método de pago</h6>
                    <div class="form-check">
                        <div>
                            <label>
                                @Html.RadioButtonFor(m => m.ModoPago,0)
                                Efectivo
                            </label>
                        </div>
                        <div>
                            <label>
                                @Html.RadioButtonFor(m => m.ModoPago, 1)
                                Tarjeta
                            </label>
                        
                        </div>
                    </div>
                        <button type="submit" class="btn btn-primary mt-3">Procesar Venta</button>
                        @if (ViewData["Mensaje"] != null)
                        {
                            <div class="alert alert-danger">
                                @ViewData["Mensaje"]
                            </div>
                        }
                </div>
            </div>
        </div>
    
  </div>
</form>
@section Scripts {
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>

    //actualizacion del total
    
    
    $(document).ready(function () {
        toggleFactura();
        $(".cantidad-input").on('input', function () {
            let total = 0;
            $(".cantidad-input").each(function () {
                let cantidad = $(this).val();
                let precio = $(this).data("precio");
                total += cantidad * precio;
            });
            $("#total").text(total.toFixed(2));


        });

    });
        function toggleFactura() {
            var checkbox = document.getElementById("con-factura");
            var divfactura = document.getElementById("factura");
    


            if (checkbox.checked) {
                divfactura.style.display = "block";  // Mostrar el input
                

            } else {
                divfactura.style.display = "none";   // Ocultar el input
            }
        }
</script>
}
 