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.
55 lines
1.4 KiB
55 lines
1.4 KiB
<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 }}
|
|
<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>
|
|
</div>
|
|
</div>
|
|
<div class="col">
|
|
<h2>Košík</h2>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import data from "./assets/knihy.json";
|
|
|
|
export default {
|
|
name: "App",
|
|
data: function () {
|
|
return {
|
|
knihy: data,
|
|
};
|
|
},
|
|
methods: {
|
|
typKniha: function(kniha, typ) {
|
|
kniha.typ_volba = typ.nazev
|
|
kniha.format_volba = typ.formaty
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style>
|
|
</style>
|
|
|