small fixes while reviewing code

lootalot_front/src/components/ItemInput.vue

@@ -4,7 +4,7 @@
     <div class="control is-expanded" 
         :class="{'is-loading': is_loading }">
       <input type="text" 
-        v-model="search"
+        v-model="item_name"
         @input="autoCompletion" 
         class="input" 
        :class="{'is-danger': no_results, 
@@ -12,6 +12,11 @@
         autocomplete="on">
         </input>
       </div>
+    <div class="control">
+      <input type="text" class="input"
+        :class="{'is-danger': !item_price}"
+        v-model.number="item_price"></input>
+    </div>
     <div class="control">
       <button class="button is-primary"
         :disabled="no_results"
@@ -23,7 +28,7 @@
       <div class="dropdown-menu">
         <div class="dropdown-content">
             <a v-for="(result,i) in results" :key="i"
-              @click="setResult(result.name)"
+              @click="setResult(result)"
               class="dropdown-item"
               >
               {{ result.name }}
@@ -35,18 +40,15 @@
 </template>
 
 <script>
-    // List of items for autocomplete
-    const MOCK_ITEMS = [
-        {id: 35, name: "Cape d'invisibilité", sell_value: 30000}, 
-        {id: 8, name: "Arc long", sell_value: 10}, 
-    ];
- 
+
     export default {
+        props: ["source"],
         data () {
             return {
                 is_loading: false,
                 no_results: false,
-                search: '',
+                item_name: '',
+                item_price: '',
                 results: [],
                 auto_open: false,
             };
@@ -55,13 +57,13 @@
             autoCompletion (ev) {
                 // TODO: a lot happens here that
                 //       need to be clarified
-                if (this.search == '') {
+                if (this.item_name == '') {
                     this.auto_open = false;
                     this.results = [];
                     this.no_results = false;
                 } else {
-                    this.results = MOCK_ITEMS.filter(item => {
-                        return item.name.includes(this.search);
+                    this.results = this.source.filter(item => {
+                        return item.name.includes(this.item_name);
                     });
                     // Update status 
                     if (this.results.length == 0) {
@@ -73,12 +75,17 @@
                 }
             },
             setResult(result) {
-                this.search = result;
+                this.item_name = result.name;
+                this.item_price = result.sell_value;
                 this.auto_open = false;
             },
             addItem () {
-                this.$emit("addItem", this.search);        
-                this.search = '';
+                this.$emit("addItem", {
+                   name: this.item_name,
+                   sell_value: this.item_price
+                });        
+                this.item_name = '';
+                this.item_price = '';
                 this.results = [];
                 this.no_results = false;
                 this.auto_open = false;