Add unique ref for focus events

resources/assets/js/components/AkauntingItemButton.vue

@@ -356,11 +356,8 @@ export default {
         onItemSelected(clickSelectedItem) {
             let item; 
             const firstMatchedItem = this.item_list[0];
-            
             const isClickSelectedItem = clickSelectedItem ? true : false;
-            
             isClickSelectedItem ? item = clickSelectedItem  : item = firstMatchedItem;
-            
             const indexeditem = { ...item, index: this.currentIndex };
 
             this.addItem(indexeditem, 'oldItem');
@@ -383,7 +380,7 @@ export default {
 
         onItemCreate() {
             let item = {
-                index: this.newItems.length,
+                index: this.currentIndex,
                 key: 0,
                 value: this.search,
                 type: this.type,
@@ -394,7 +391,7 @@ export default {
                 tax_ids: [],
             };
             
-            this.newItems.push(item)
+            this.newItems.push(item);
 
             this.addItem(item, 'newItem');
         },
@@ -528,7 +525,7 @@ export default {
             return this.sortItems();
         },
         currentIndex() {
-            return this.selected_items.length;
+            return this.$root.form.items.length;
         },
     },
 

resources/assets/js/views/common/documents.js

@@ -50,6 +50,7 @@ const app = new Vue({
             discounts: [],
             tax_id: [],
             items: [],
+            selected_items:[],
             taxes: [],
             page_loaded: false,
             currencies: [],
@@ -96,8 +97,10 @@ const app = new Vue({
     },
 
     methods: {
-        onRefFocus(ref, index) {
-            setPromiseTimeout(100).then(() => this.$refs[ref][index].focus());
+        onRefFocus(ref) {
+            let index = this.form.items.length - 1;  
+
+            this.$refs['items-' + index + '-'  + ref][0].focus();
         },
 
         onCalculateTotal() {
@@ -305,15 +308,16 @@ const app = new Vue({
             return totals_taxes;
         },
 
+        onSelectedItem(item){
+            this.onAddItem(item);
+        },
+
         // addItem to list
         onAddItem(payload) {
-            let { item, itemType } = payload
-            let { index } = item;
+            let { item, itemType } = payload;
             let inputRef = `${itemType === 'newItem' ? 'name' : 'description'}`; // indication for which input to focus first
             let total = 1 * item.price;
             let item_taxes = [];
-
-            this.onRefFocus(inputRef, index); // trigger initial focus event on input or description based on type of item added to the list
             
             if (item.tax_ids) {
                 item.tax_ids.forEach(function (tax_id, index) {
@@ -359,8 +363,14 @@ const app = new Vue({
                 // invoice_item_checkbox_sample: [],
             });
 
+            setTimeout(function() {
+                this.onRefFocus(inputRef);
+            }.bind(this), 100);
+
             setTimeout(function() {
                 this.onCalculateTotal();
+
+                this.onRefFocus(inputRef);
             }.bind(this), 800);
         },