Get status dynamically

frontend/src/components/BooksAddEdit.vue

@@ -10,7 +10,14 @@
       </template>
     </div>
 
-    <form class="ui form" v-bind:class="{ loading: loading }">
+    <div class="ui positive message" v-if="success">
+      <div class="header">
+        Success
+      </div>
+      {{ success }}
+    </div>
+
+    <form class="ui form" v-bind:class="{ loading: loading }" v-if="!success">
       <div class="field">
         <label>Title</label>
         <input name="title" placeholder="Title" type="text" v-model="book.Title">
@@ -83,8 +90,8 @@
         <label>Status</label>
         <div class="field" v-for="status in allStatus">
           <div class="ui radio checkbox">
-            <input name="status" :id="status.value" :value="status.value" class="hidden" type="radio" v-model="book.Status"/>
-            <label :for="status.value">{{ status.name }}</label>
+            <input name="status" :id="status.ID" :value="status.ID" class="hidden" type="radio" v-model="book.Status"/>
+            <label :for="status.ID">{{ status.Name }}</label>
           </div>
         </div>
       </div>
@@ -102,6 +109,7 @@
     data () {
       return {
         error: '',
+        success: '',
         loading: false,
         book: {
           Title: '',
@@ -121,25 +129,13 @@
         addAuthorForm: [],
         newAuthors: {},
         newestAuthor: 0,
-        allStatus: [
-          {
-            name: 'New',
-            value: 1
-          },
-          {
-            name: 'Second Hand',
-            value: 2
-          },
-          {
-            name: 'Other',
-            value: 3
-          }
-        ]
+        allStatus: []
       }
     },
     created () {
       this.loadPublishers()
       this.loadAuthors()
+      this.loadStatus()
     },
     methods: {
       loadPublishers: function () {
@@ -167,6 +163,15 @@
             this.error = e
           })
       },
+      loadStatus: function () {
+        HTTP.get('status')
+          .then(response => {
+            this.allStatus = response.data
+          })
+          .catch(e => {
+            this.error = e
+          })
+      },
       toggleAddPublisher: function () {
         this.addPublisherForm = !this.addPublisherForm
         this.book.PublisherFull = {ID: 0, Name: ''}
@@ -223,6 +228,7 @@
           .then(response => {
             this.loading = false
             console.log(response)
+            this.success = 'The book was successfully inserted!'
           })
           .catch(e => {
             this.loading = false