From 710426280cbfa06b649edff71147adb7ee1ce708 Mon Sep 17 00:00:00 2001
From: Net <93821485+somnetsak123@users.noreply.github.com>
Date: Wed, 24 Apr 2024 09:19:54 +0700
Subject: [PATCH] =?UTF-8?q?fix:=20=E0=B9=81=E0=B8=81=E0=B9=89=20function?=
 =?UTF-8?q?=20clos=20=E0=B8=A5=E0=B8=9A=20=E0=B8=95=E0=B8=B1=E0=B8=A7?=
 =?UTF-8?q?=E0=B8=AA=E0=B8=B8=E0=B8=94=E0=B8=97=E0=B9=89=E0=B8=B2=E0=B8=A2?=
 =?UTF-8?q?=20=E0=B9=80=E0=B9=80=E0=B8=95=E0=B9=88=20index=20=E0=B9=84?=
 =?UTF-8?q?=E0=B8=A1=E0=B9=88=E0=B9=80=E0=B8=9B=E0=B8=A5=E0=B8=B5=E0=B9=88?=
 =?UTF-8?q?=E0=B8=A2=E0=B8=99?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/TabComponent.vue | 45 +++++++++++++++++----------------
 1 file changed, 23 insertions(+), 22 deletions(-)

diff --git a/src/components/TabComponent.vue b/src/components/TabComponent.vue
index 833d657b..6a0cf7b3 100644
--- a/src/components/TabComponent.vue
+++ b/src/components/TabComponent.vue
@@ -1,14 +1,12 @@
 <script setup lang="ts">
-import { ref, onMounted } from 'vue';
+import { ref } from 'vue';
 import { CustomerBranchCreate } from 'stores/customer/types';
 
 const customerBranch = defineModel<CustomerBranchCreate[]>('customerBranch', {
   default: [],
 });
 
-const indexTab = defineModel<number>('indexTab');
-
-const tab = ref<string>('');
+const tab = defineModel<number>('tabIndex', { required: true });
 
 const index = ref<number>(0);
 
@@ -34,16 +32,19 @@ function addData() {
     districtId: '',
     provinceId: '',
   });
+
+  tab.value = customerBranch.value.length - 1;
 }
 
-async function close(index: number) {
+function close(index: number) {
+  console.log(customerBranch.value.length, index);
+  if (customerBranch.value.length - 1 === index) {
+    tab.value = tab.value - 1;
+  }
+
   if (customerBranch.value.length > 1) {
     customerBranch.value.splice(index, 1);
   }
-  // tab.value = await tabList.value[tabList.value.length - 1].name;
-  setTimeout(() => {
-    tab.value = `สาขาที่ ${customerBranch.value.length.toString()}`;
-  }, 10);
 }
 </script>
 <template>
@@ -65,20 +66,20 @@ async function close(index: number) {
         :key="index"
         :name="index"
         :label="`${$t('customerBranchFormTab')} ${index + 1}`"
-        @click="indexTab = index"
+        @click="tab = index"
         no-caps
-      />
-
-      <q-btn
-        round
-        flat
-        id="closeDialog"
-        icon="mdi-close"
-        padding="xs"
-        color="red"
-        :class="{ dark: $q.dark.isActive }"
-        @click="close(index)"
-      />
+      >
+        <q-btn
+          round
+          flat
+          id="closeDialog"
+          icon="mdi-close"
+          padding="xs"
+          color="red"
+          :class="{ dark: $q.dark.isActive }"
+          @click.stop="close(index)"
+        />
+      </q-tab>
     </q-tabs>
   </div>
   <div class="column">