
1 changed files with 35 additions and 14 deletions
@ -1,28 +1,49 @@ |
|||
<template> |
|||
<div id="app"> |
|||
<img alt="Vue logo" src="./assets/logo.png"> |
|||
<HelloWorld msg="Welcome to Your Vue.js App"/> |
|||
<h1>Letenka</h1> |
|||
<div class="wrapper"></div> |
|||
<div class="col"> |
|||
<h2>Parametry letu</h2> |
|||
<select v-model="travelType" > |
|||
<option value="" disabled>Vyberte jednu požnost</option> |
|||
<option v-for="(option, index) in travelTypes" :key="index" :value="option"> |
|||
{{option.text}} |
|||
</option> |
|||
|
|||
</select> |
|||
</div> |
|||
<div class="col"> |
|||
<h2>Objednávka</h2> |
|||
<p v-if="travelType"> |
|||
Typ cesty: |
|||
<span style="text-transform:lowercase">{{travelType.text}} |
|||
</span> |
|||
</p> |
|||
</div> |
|||
|
|||
|
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import HelloWorld from './components/HelloWorld.vue' |
|||
|
|||
export default { |
|||
name: 'App', |
|||
components: { |
|||
HelloWorld |
|||
name: "App", |
|||
data: function(){ |
|||
return { |
|||
travelType: "", |
|||
travelTypes: [ |
|||
{ value: "R", text: "Zpáteční"}, |
|||
{ value: "O", text: "Jednosměrná"}, |
|||
] |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
#app { |
|||
font-family: Avenir, Helvetica, Arial, sans-serif; |
|||
-webkit-font-smoothing: antialiased; |
|||
-moz-osx-font-smoothing: grayscale; |
|||
text-align: center; |
|||
color: #2c3e50; |
|||
margin-top: 60px; |
|||
.wrapper { |
|||
display: grid; |
|||
grid-template-columns: 1fr 1fr; |
|||
} |
|||
</style> |
Loading…
Reference in new issue