<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Lista de Productos</title>
</head>
<body>
    <h2>Selecciona un Producto:</h2>
    <ul>
        <li><a href="#" class="product-link" data-name="Manzana" data-price="1.00">Manzana</a></li>
        <li><a href="#" class="product-link" data-name="Plátano" data-price="0.75">Plátano</a></li>
        <!-- Agrega el resto de los productos aquí -->
    </ul>

    <script>
        const productLinks = document.querySelectorAll(".product-link");
        productLinks.forEach(link => {
            link.addEventListener("click", function(event) {
                event.preventDefault();
                const productName = this.getAttribute("data-name");
                const productPrice = this.getAttribute("data-price");

                // Llenar los campos del formulario en la página principal
                const productNameInput = window.opener.document.getElementById("product-name");
                const productPriceInput = window.opener.document.getElementById("product-price");

                productNameInput.value = productName;
                productPriceInput.value = productPrice;

                // Cerrar la ventana emergente
                window.close();
            });
        });
    </script>
</body>
</html>
