
2 changed files with 57 additions and 24 deletions
@ -1,30 +1,60 @@ |
|||
<template> |
|||
<div> |
|||
<h1>Knihkupectví</h1> |
|||
<div class="row"> |
|||
<div class="col"> |
|||
<h2>Knihy</h2> |
|||
<div v-for="kniha, i in knihy" :key="i"> |
|||
{{kniha.nazev}} |
|||
<div> |
|||
<h1>Knihkupectví</h1> |
|||
<div class="row"> |
|||
<div class="col"> |
|||
<h2>Knihy</h2> |
|||
<div v-for="(kniha, i) in knihy" :key="i"> |
|||
{{ kniha.nazev }} |
|||
{{kniha.obrazek}} |
|||
<button |
|||
v-on:click="typKniha(kniha, typ)" |
|||
class="btn" |
|||
v-bind:class="{ |
|||
'btn-success': kniha.typ_volba == typ.nazev, |
|||
'btn-outline-secondary': kniha.typ_volba != typ.nazev}" |
|||
v-for="(typ, i) in kniha.typy" |
|||
:key="i" |
|||
> |
|||
<i class="fas" v-bind:class="typ.ikona"></i> |
|||
{{ typ.nazev }} |
|||
</button> |
|||
<p> |
|||
{{ kniha.format_volba }} |
|||
</p> |
|||
<p><button v-on:click="kosik.push(kniha)">Do košíku</button></p> |
|||
</div> |
|||
</div> |
|||
<div class="col"> |
|||
<h2>Košík</h2> |
|||
<div v-for="(kniha, i) in kosik" :key="i"> |
|||
{{kniha.nazev}} |
|||
<input type="number" min="1" v-model="kniha.pocet"> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import data from "./assets/knihy.json" |
|||
import data from "./assets/knihy.json"; |
|||
|
|||
export default { |
|||
name: 'App', |
|||
data:function () { |
|||
return{ |
|||
name: "App", |
|||
data: function () { |
|||
return { |
|||
knihy: data, |
|||
} |
|||
kosik:[] |
|||
}; |
|||
}, |
|||
|
|||
} |
|||
methods: { |
|||
typKniha: function(kniha, typ) { |
|||
kniha.typ_volba = typ.nazev |
|||
kniha.format_volba = typ.format |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style> |
|||
|
|||
</style> |
|||
</style> |
Loading…
Reference in new issue