IFCD0210/Practicas/Practicas JS/DOM Alquiler Coche/Ejercicio_practica_alquila_coche_1.html
Marcos Lopez 6d00e5cc0e Dia36
2024-01-29 09:15:05 +01:00

127 lines
4.0 KiB
HTML

<!Doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Coste alquiler JAVASCRIPT</title>
<script>
// Una función para realizar todas las instrucciones
function obtener() {
// Obtengo el numero de días y el tipo de vehículo
let dias=document.getElementById("dias").value;
let tipo=document.getElementById("tipo").value;
// Asigno el seguro a todo riesgo y el precio del tipo de coche
if (tipo === "basico") {
tipoP=45;
riesgo=15;
}
if (tipo === "gamamedia") {
tipoP=65;
riesgo=25;
}
if (tipo === "lujo") {
tipoP=85;
riesgo=35;
}
// Calculo el coste del vehículo + seguro
let vehiculo;
if (document.getElementById("riesgo").checked) {
vehiculo=dias*(tipoP+riesgo);
} else {vehiculo=dias*(tipoP+10)}
//Condición silla y gps
let silla;
if (document.getElementById("silla").checked) {
silla=15;
} else { silla=0}
let gps;
if (document.getElementById("gps").checked) {
gps=5;
} else { gps=0}
//Calculo coste de los extras
let extras=(silla+gps)*dias;
//Calculo vehículo + extras con IVA
let total=vehiculo+extras;
let totalI=(total*1.21);
//Calculo el recargo por menor de 30
let precioMenor;
if (document.getElementById("menor").checked) {
precioMenor=totalI*0.3;
} else { precioMenor=0 }
// Calculo el total
let totalF=(totalI+precioMenor).toFixed(2);
document.getElementById("total").value=totalF;
// Mensaje alert
//Fecha del momento de la reserva
let hoy=new Date().getTime();
//Fecha para inico del alquiler
let inicio=document.getElementById("fecha").valueAsNumber;
// Calculo los días que faltan
let dif=inicio-hoy;
let diasF=dif/(1000*60*60*24);
// Calculo la fecha de entrega
let entrega=inicio+(dias*24*60*60*1000);
let entregaF=new Date(entrega);
// Obtengo la fecha de entrega en formato local dd-mm-xxxx
let entregaP=entregaF.toLocaleDateString();//.toLocaleDateString()
//alert("Faltan "+(Math.ceil(dias))+ " días"+"\n"+"Tu fecha de entrega es el "+entregaP);
//Creo el mensaje
let frase="Faltan "+(Math.ceil(diasF))+ " días "+"para tu alquiler"+"\n"
+"Tu fecha de de entrega del vehículo es el "+entregaP+"\n";
alert(frase);
}
</script>
</head>
<body>
<div id="container">
<form>
<h1>Alquiler de vehículo</h1>
<p>Introduzca número de dias de alquiler
<input type="number" name="dias" id="dias" size="3" value="0">
<p>Elige la fecha de inicio del alquiler<input type="date" id="fecha"></p>
<br>
<p>Seleccione el tipo de vehículo
<!-- Lista de selección -->
<select name="tipo" id="tipo">
<option value="basico">Básico 45 Euros/día</option>
<option value="gamamedia">Gama media 65 Euros/día</option>
<option value="lujo">Lujo 85 Euros/día</option>
</select></p>
<h2>Elementos opcionales</h2>
<p>Silla Infantil * 15 Euros por día de alquiler<input type="checkbox" name="silla" id="silla" value="Silla Infantil"></p>
<p>GPS * 5 Euros por día de alquiler <input type="checkbox" name="gps" id="gps" value="Gps"></p>
<h2>Seguro</h2>
<p>** El seguro a terceros es obligatorio y tiene un coste de 10 Euros/día sin IVA</p>
<p>Seguro a todo riesgo <input type="checkbox" name="riesgo" id="riesgo" value="Has contratado seguro a todo riesgo"></p>
<p>Conductor menor de 30 años <input type="checkbox" name="menor" id="menor" value="Tienes recargo por ser menor de 30 años"></p>
<p>Coste total <input type="text" name="total" id="total" ></p>
<input type="button" value="Calcular coste total" onclick="obtener();">
</form>
</div>
<br>
</body>
</html>