Dia37
This commit is contained in:
75
Practicas/Practicas JS/DOM Alquiler Coche V2/index.html
Normal file
75
Practicas/Practicas JS/DOM Alquiler Coche V2/index.html
Normal file
@@ -0,0 +1,75 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<script src="./js/main.js" defer></script>
|
||||
<title>Alquiler de coche</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<form id="formAlquiler">
|
||||
<div style="display: flex; flex-direction: column; min-width: max-content; gap: 1em;">
|
||||
<div style="display: flex; flex-direction: row; gap:1em">
|
||||
<div style="display: flex;flex-direction: column; width: max-content;">
|
||||
<label for="fechaInicio">Fecha de inicio</label><input type="date" name="fechaInicio"
|
||||
id="fechaInicio">
|
||||
</div>
|
||||
<div style="display: flex;flex-direction: column; width: max-content;">
|
||||
<label for="fechaFin">Fecha de fin</label><input type="date" name="fechaFin"
|
||||
id="fechaFin">
|
||||
</div>
|
||||
</div>
|
||||
<div style="display: flex; gap: 2px;">
|
||||
<label for="tipoVehiculo">Tipo de vehiculo</label>
|
||||
<select name="tipoVehiculo" id="tipoVehiculo">
|
||||
<option value='basico' selected>Basico (45€ dia)</option>
|
||||
<option value='gama_media'>Gama media (65€ dia)</option>
|
||||
<option value='lujo'>Lujo (85 dia)</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<h2 style="padding: 0; margin: 0;">Elementos Opcionales</h2>
|
||||
|
||||
<div>
|
||||
<input type="checkbox" name="sillainfantil" id="sillainfantil">
|
||||
<label for="sillainfantil">Silla infantil (15€ por dia)</label>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<input type="checkbox" name="gps" id="gps">
|
||||
<label for="gps">GPS (5€ por dia)</label>
|
||||
</div>
|
||||
|
||||
<h2 style="padding: 0; margin: 0;">Seguro</h2>
|
||||
<p style="padding: 0; margin: 0;">*** El seguro a terceros es obligatorio y tiene un coste de 10 €/dia sin IVA</p>
|
||||
<div>
|
||||
<input type="checkbox" name="segurotr" id="segurotr">
|
||||
<label for="segurotr">Seguro todo riesgo</label>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<input type="checkbox" name="menor30" id="menor30">
|
||||
<label for="menor30">Menor de 30 años (Recargo del 30% sobre el precio final)</label>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label for="total">Total Coste</label><input type="text" name="total" id="total">
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<button type="button" onclick="calculaAlquiler()">Calcula total</button>
|
||||
<button type="button" onclick="">Aceptar</button>
|
||||
<button type="button" onclick="limpiarForm()">Limpiar</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
<textarea name="resumen" id="resumen" cols="30" rows="10">
|
||||
</textarea>
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Reference in New Issue
Block a user