From c86a755643a7735afbd533f56599f367e4e0375d Mon Sep 17 00:00:00 2001
From: puriphatt <puriphat@frappet.com>
Date: Thu, 17 Oct 2024 13:22:36 +0700
Subject: [PATCH] fix scroll to new workname

---
 .../04_product-service/WorkNameManagement.vue      | 14 ++++++++++++--
 1 file changed, 12 insertions(+), 2 deletions(-)

diff --git a/src/components/04_product-service/WorkNameManagement.vue b/src/components/04_product-service/WorkNameManagement.vue
index b0c96f57..7d66ece0 100644
--- a/src/components/04_product-service/WorkNameManagement.vue
+++ b/src/components/04_product-service/WorkNameManagement.vue
@@ -1,6 +1,7 @@
 <script lang="ts" setup>
-import { onMounted, ref, watch } from 'vue';
+import { nextTick, onMounted, ref, watch } from 'vue';
 import { DeleteButton, EditButton, SaveButton, UndoButton } from '../button';
+import { scrollToElement } from 'stores/utils';
 // import { useI18n } from 'vue-i18n';
 // import { storeToRefs } from 'pinia';
 
@@ -53,7 +54,15 @@ watch(
     await assignClone();
     if (!isAdd.value) return;
     cloneList.value[cloneList.value.length - 1].isEdit = true;
-    setTimeout(() => {
+    setTimeout(async () => {
+      await nextTick();
+
+      const scrollTarget = document.getElementById(
+        `input-work-name-${cloneList.value.length - 1}`,
+      );
+      if (scrollTarget)
+        scrollTarget.scrollIntoView({ behavior: 'instant', inline: 'center' });
+
       inputName.value[cloneList.value.length - 1].focus();
       isAdd.value = false;
     }, 150);
@@ -85,6 +94,7 @@ watch(
               lazy-rules="ondemand"
               ref="inputName"
               :for="`input-work-name-${index}`"
+              :id="`input-work-name-${index}`"
               dense
               class="col q-mr-md"
               v-model="item.name"