104362 Update product title with data from endpoint

kruchy8 · kruchy8 · commit 9d482676932b · 2024-11-25T13:46:59.000+01:00
diff --git a/view/adminhtml/web/vue/menu-type/product.vue b/view/adminhtml/web/vue/menu-type/product.vue
@@ -5,7 +5,7 @@
             v-model="item.content"
             :label="config.translation.productId"
             type="textarea"
-            @input="updateTitle"
+            @input="debouncedUpdateTitle"
         />
     </div>
 </template>
@@ -26,7 +26,18 @@
                 }
             },
             template: template,
+            data() {
+                return {
+                    updateTitleTimeout: null
+                };
+            },
             methods: {
+                debouncedUpdateTitle(value) {
+                    clearTimeout(this.updateTitleTimeout);
+                    this.updateTitleTimeout = setTimeout(() => {
+                        this.updateTitle(value);
+                    }, 300);
+                },
                 updateTitle(value) {
                     let adminPath = window.location.pathname.split('/snowmenu')[0];
                     fetch(`${adminPath}/snowmenu/node/productName?isAjax=true&product_id=${value}&form_key=${window.FORM_KEY}`, {
@@ -36,15 +47,16 @@
                         },
                     })
                     .then((response) => {
-                        console.log(response)
-                        // return response.json();
+                        if (!response.ok) {
+                            throw new Error(response.status);
+                        }
+                        return response.json();
+                    })
+                    .then(data => {
+                        data.product_name && this.$set(this.item, 'title', data.product_name);
                     })
-                    // .then(data => {
-                        // this.$set(this.item, 'title', data.name);
-                    // })
                     .catch(error => {
                         console.error('Error fetching product name:', error);
-                        // this.$set(this.item, 'title', value);
                     });
                 }
             }
