Brisa
154 lines
6.4 KiB
PHP
154 lines
6.4 KiB
PHP
<?php
|
|
session_start();
|
|
include("db.php");
|
|
|
|
if (empty($_SESSION['carrito'])) {
|
|
header("Location: carrito.php");
|
|
exit();
|
|
}
|
|
?>
|
|
<!DOCTYPE html>
|
|
<html lang="es">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>Datos de Entrega - La Pecosa</title>
|
|
<link rel="stylesheet" href="css/all.min.css">
|
|
<style>
|
|
* { margin: 0; padding: 0; box-sizing: border-box; }
|
|
body { font-family: 'Segoe UI', sans-serif; background-color: #fffef8; color: #333; padding: 50px; }
|
|
.box { max-width: 500px; margin: 0 auto; background: white; padding: 30px; border-radius: 20px; box-shadow: 0 10px 30px rgba(0,0,0,0.05); }
|
|
|
|
.header-form { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
|
|
h2 { color: #e02828; font-size: 1.5rem; display: flex; align-items: center; gap: 10px; }
|
|
|
|
.btn-volver {
|
|
color: #888;
|
|
text-decoration: none;
|
|
font-size: 1.2rem;
|
|
transition: 0.2s;
|
|
padding: 5px 10px;
|
|
border-radius: 50px;
|
|
}
|
|
.btn-volver:hover { color: #e02828; background-color: #fff5f5; }
|
|
|
|
.form-group { margin-bottom: 15px; width: 100%; }
|
|
label { display: block; margin-bottom: 5px; font-weight: 600; }
|
|
|
|
input, select { width: 100%; padding: 10px; border: 1px solid #ccc; border-radius: 8px; font-size: 1rem; box-sizing: border-box; }
|
|
input[type="file"] { padding: 5px; background: #f9f9f9; }
|
|
|
|
.btn-enviar { background: #e02828; color: white; border: none; padding: 12px 20px; border-radius: 50px; cursor: pointer; font-weight: bold; width: 100%; margin-top: 15px; transition: 0.3s; }
|
|
.btn-enviar:hover { background: #c02020; transform: scale(1.02); }
|
|
|
|
#seccion_envio, #seccion_retiro { display: none; width: 100%; }
|
|
|
|
.info-pago-box {
|
|
background-color: #fff5f5;
|
|
border: 2px dashed #e02828;
|
|
border-radius: 10px;
|
|
padding: 15px;
|
|
text-align: center;
|
|
margin-bottom: 15px;
|
|
}
|
|
.info-pago-box h4 { color: #333; font-size: 0.9rem; letter-spacing: 1px; margin-bottom: 5px; }
|
|
.info-pago-box .alias { color: #e02828; font-size: 1.3rem; font-weight: bold; margin: 5px 0; }
|
|
.info-pago-box p { font-size: 0.85rem; color: #555; line-height: 1.4; }
|
|
|
|
.info-retiro-box {
|
|
background-color: #f4fbf7;
|
|
border: 1px solid #2ecc71;
|
|
border-radius: 10px;
|
|
padding: 12px;
|
|
margin-bottom: 15px;
|
|
font-size: 0.9rem;
|
|
color: #27ae60;
|
|
}
|
|
</style>
|
|
<script>
|
|
function evaluarTipo(select) {
|
|
var seccionEnvio = document.getElementById('seccion_envio');
|
|
var seccionRetiro = document.getElementById('seccion_retiro');
|
|
var inputDir = document.getElementById('direccion');
|
|
var inputComprobante = document.getElementById('comprobante');
|
|
|
|
if (select.value === 'envio') {
|
|
seccionEnvio.style.display = 'block';
|
|
seccionRetiro.style.display = 'none';
|
|
inputDir.required = true;
|
|
inputComprobante.required = true;
|
|
} else if (select.value === 'retiro') {
|
|
seccionEnvio.style.display = 'none';
|
|
seccionRetiro.style.display = 'block';
|
|
inputDir.required = false;
|
|
inputComprobante.required = false;
|
|
inputDir.value = '';
|
|
inputComprobante.value = '';
|
|
} else {
|
|
seccionEnvio.style.display = 'none';
|
|
seccionRetiro.style.display = 'none';
|
|
inputDir.required = false;
|
|
inputComprobante.required = false;
|
|
}
|
|
}
|
|
</script>
|
|
</head>
|
|
<body>
|
|
<div class="box">
|
|
<div class="header-form">
|
|
<h2><i class="fa-solid fa-truck"></i> Opciones de entrega</h2>
|
|
<a href="carrito.php" class="btn-volver" title="Volver al carrito">
|
|
<i class="fa-solid fa-arrow-left"></i> Volver
|
|
</a>
|
|
</div>
|
|
|
|
<form action="procesar_pago.php" method="POST" enctype="multipart/form-data">
|
|
|
|
<div class="form-group">
|
|
<label for="tipo_entrega">¿Cómo querés recibir tu pedido?</label>
|
|
<select name="tipo_entrega" id="tipo_entrega" onchange="evaluarTipo(this)" required>
|
|
<option value="">-- Seleccioná una opción --</option>
|
|
<option value="retiro">Retiro en el local (México 569)</option>
|
|
<option value="envio">Envío a domicilio</option>
|
|
</select>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="telefono">Teléfono de contacto:</label>
|
|
<input type="text" name="telefono" id="telefono" placeholder="Ej: 3434567890" required>
|
|
</div>
|
|
|
|
<div id="seccion_retiro">
|
|
<div class="info-retiro-box">
|
|
<i class="fa-solid fa-circle-info"></i> <b>Formas de pago en el local:</b><br>
|
|
Podés abonar al momento de retirar en <b>Efectivo, Débito o Transferencia</b>.
|
|
</div>
|
|
</div>
|
|
|
|
<div id="seccion_envio">
|
|
<div class="form-group">
|
|
<label for="direccion">Dirección de entrega (en Paraná):</label>
|
|
<input type="text" name="direccion" id="direccion" placeholder="Calle, Número y Barrio">
|
|
</div>
|
|
|
|
<div class="info-pago-box">
|
|
<h4><i class="fa-solid fa-credit-card"></i> PAGO POR TRANSFERENCIA</h4>
|
|
<div class="alias">Alias: LA.PECOSA.PARANA</div>
|
|
<p>
|
|
⚠️ <b>Única forma de pago para envíos.</b><br>
|
|
Realizá la transferencia del pedido y adjuntá el comprobante abajo.<br>
|
|
<i>El costo del envío se abona en efectivo directamente al repartidor al recibirlo.</i>
|
|
</p>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="comprobante"><i class="fa-solid fa-receipt"></i> Adjuntar Comprobante de Transferencia:</label>
|
|
<input type="file" name="comprobante" id="comprobante" accept="image/*,.pdf">
|
|
<small style="color: #666; display: block; margin-top: 4px;">Obligatorio para procesar tu envío.</small>
|
|
</div>
|
|
</div>
|
|
|
|
<button type="submit" class="btn-enviar">Confirmar y registrar pedido →</button>
|
|
</form>
|
|
</div>
|
|
</body>
|
|
</html>
|