first version of book form

front/src/BookForm.vue

@@ -7,7 +7,7 @@
 });
 
   let { data, error } = getBook(props.id);
-
+  const imagePathOrDefault = "../defaultbook.png"
   onBeforeRouteUpdate(async (to, from) => {
     let res = getBook(to.params.id);
     data = res.data;
@@ -17,8 +17,13 @@
 </script>
 
 <template>
-  <div>
+  <div v-if="error">{{$t('bookform.error', {error: error.message})}}</div>
-    <pre>{{ data }}</pre>
+  <div v-if="data">
+    <h3 class="title">{{data.title}}</h3>
+    <h3 class="subtitle">{{data.author}}</h3>
+    <figure class="image">
+      <img v-bind:src="imagePathOrDefault" v-bind:alt="data.title">
+    </figure>
   </div>
 </template>
 

front/src/locales/en.json

@@ -38,5 +38,8 @@
     "read": "Read",
     "startread": "Start reading",
     "wantread": "I want to read it"
+  },
+  "bookform": {
+    "error": "Error when loading book: {error}"
   }
 }

front/src/locales/fr.json

@@ -38,5 +38,8 @@
     "read": "Lu",
     "startread": "Commencer la lecture",
     "wantread": "Je veux le lire"
+  },
+  "bookform": {
+    "error": "Erreur pendant le chargement du livre: {error}"
   }
 }