vue hotovo

src/App.vue

@@ -4,7 +4,6 @@
     <div class="row">
       <div class="col">
         <h2>Knihy</h2>
-        #// card horizont
         <div v-for="(kniha, i) in knihy" :key="i">
          <img style="width:50%" :src= kniha.obrazek alt="">
          {{ kniha.nazev }}
@@ -32,8 +31,11 @@
             {{kniha.nazev}} <br>
             {{kniha.format_volba}}
             <input type="number" min="1" v-model="kniha.pocet">  
+            {{ kniha.pocet * kniha.cena }} Kč
           </div>
+        <p>Celková cena: {{celkovaCena}} Kč</p>
       </div>
+
     </div>
   </div>
 </template>
@@ -55,6 +57,17 @@ export default {
             kniha.format_volba = typ.format
         },
     },
+    computed:{
+      celkovaCena: function () {
+        let suma = 0 
+
+        for (let index = 0; index < this.kosik.length; index++) {
+          const element = this.kosik[index];
+          suma = suma + element.cena * element.pocet
+        }
+        return suma
+      }
+    }
 };
 </script>
 

src/assets/knihy.json

@@ -24,9 +24,13 @@
     },
     {
         "nazev":"Hardcore historie",
+        "obrazek":"/img/hardcore-historie.png",
         "autor":"",
         "stran":369,
-        "cena": "",
+        "cena": 369,
+        "typ_volba": null,
+        "format_volba": null,
+        "pocet":1,
         "typy":[
             {
                 "nazev":"papír",
@@ -47,9 +51,13 @@
     },
     {
         "nazev":"Spotify",
+        "obrazek":"/img/spotify.png",
         "autor":"",
-        "stran":0,
+        "stran":256,
         "cena": 369,
+        "typ_volba": null,
+        "format_volba": null,
+        "pocet":1,
         "typy":[
             {
                 "nazev":"papír",
@@ -70,9 +78,13 @@
     },
     {
         "nazev":"Uber",
+        "obrazek":"/img/valka-o-uber.png",
         "autor":"",
-        "stran":0,
+        "stran":384,
         "cena": 382,
+        "typ_volba": null,
+        "format_volba": null,
+        "pocet":1,
         "typy":[
             {
                 "nazev":"papír",