You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

64 lines
1.8 KiB

<template>
<div>
<h1>Letenka</h1>
<div class="card" style="width: 18rem;">
<div class="card-body">
<h5 class="card-title">Vyhledejte si let</h5>
<div class="form-check">
<input v-model="typLetu" value="Z" class="form-check-input" type="radio" name="typLetu" id="typLetu1" checked>
<label class="form-check-label" for="typLetu1">
Zpáteční
</label>
</div>
<div class="form-check">
<input v-model="typLetu" value="J" class="form-check-input" type="radio" name="typLetu" id="typLetu2">
<label class="form-check-label" for="typLetu2">
Jednosměrná
</label>
</div>
<label for="letisteZ" class="form-label">Odkud</label>
<select v-model="letisteZ" id="letisteZ" class="form-select">
<option v-for="obj, i in letisteSeznam" :key="i" :value="obj.value">
{{ obj.text }}
</option>
</select>
<label for="letisteKam" class="form-label">Kam</label>
<select v-model="letisteKam" id="letisteKam" class="form-select">
<option v-for="obj, i in letisteSeznam" :key="i" :value="obj.value">
{{ obj.text }}
</option>
</select>
<button v-on:click="pocetOsob -= 1" class="btn btn-outline-primary">-</button>
{{ pocetOsob }}
<button v-on:click="pocetOsob += 1" class="btn btn-outline-primary">+</button>
</div>
</div>
</div>
</template>
<script>
export default {
name: "App",
data: () => {
return {
letisteZ: "",
letisteKam: "",
letisteSeznam: [
{value: "PRG", text: "Prague - Letiště Václava Havla"},
{value: "PAR", text: "Paris"},
{value: "DWC", text: "Dubai, AL Mohamed"},
],
typLetu: "Z",
pocetOsob: 0,
};
},
};
</script>
<style>
</style>