From 3ce1e0da448472d077310fdf1602ebd18d3cd6c2 Mon Sep 17 00:00:00 2001
From: Net <93821485+somnetsak123@users.noreply.github.com>
Date: Wed, 19 Jun 2024 16:21:14 +0700
Subject: [PATCH] =?UTF-8?q?feat:=20=E0=B9=80=E0=B8=9E=E0=B8=B4=E0=B9=88?=
 =?UTF-8?q?=E0=B8=A1=20toggleStatusEmployee?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../CustomerInfoComponent.vue                 |  1 +
 src/components/home/PersonCard.vue            |  8 ++++---
 src/pages/03_customer-management/MainPage.vue | 24 +++++++++++++++++++
 src/stores/employee/index.ts                  |  2 +-
 4 files changed, 31 insertions(+), 4 deletions(-)

diff --git a/src/components/03_customer-management/CustomerInfoComponent.vue b/src/components/03_customer-management/CustomerInfoComponent.vue
index 9950b6ea..778ceec1 100644
--- a/src/components/03_customer-management/CustomerInfoComponent.vue
+++ b/src/components/03_customer-management/CustomerInfoComponent.vue
@@ -207,6 +207,7 @@ watch(currentStatus, async () => {
         class="col-4"
       >
         <BranchCardCustomer
+          :inactive="br.status === 'INACTIVE'"
           :color="customerType"
           :badgeField="['status']"
           :data="{
diff --git a/src/components/home/PersonCard.vue b/src/components/home/PersonCard.vue
index 3bc035ba..366c9b2b 100644
--- a/src/components/home/PersonCard.vue
+++ b/src/components/home/PersonCard.vue
@@ -27,7 +27,7 @@ defineEmits<{
   (e: 'deleteCard', id: string): void;
   (e: 'updateCard', action: 'FORM' | 'INFO', id: string): void;
   (e: 'enterCard', action: 'FORM' | 'INFO', id: string): void;
-  (e: 'toggleStatus', id: string): void;
+  (e: 'toggleStatus', id: string, status: boolean): void;
 }>();
 </script>
 
@@ -126,8 +126,10 @@ defineEmits<{
                       <q-toggle
                         dense
                         size="sm"
-                        @click="$emit('toggleStatus', v.id)"
-                        :model-value="!v.disabled"
+                        @click="
+                          $emit('toggleStatus', v.id, v.disabled === false)
+                        "
+                        :model-value="v.disabled"
                         val="xs"
                         padding="none"
                       >
diff --git a/src/pages/03_customer-management/MainPage.vue b/src/pages/03_customer-management/MainPage.vue
index 6543340b..9e8a0d5c 100644
--- a/src/pages/03_customer-management/MainPage.vue
+++ b/src/pages/03_customer-management/MainPage.vue
@@ -720,6 +720,10 @@ async function fetchListEmployee(param?: {
   }
 }
 
+async function toggleStatusEmployee(id: string, status: boolean) {
+  await employeeStore.editById(id, { status: !status ? 'ACTIVE' : 'INACTIVE' });
+}
+
 async function toggleStatusCustomer(id: string, status: boolean) {
   await editById(id, { status: !status ? 'ACTIVE' : 'INACTIVE' });
 
@@ -787,6 +791,10 @@ async function submitBranch() {
   if (formData.value.customerBranch?.[0]) {
     delete formData.value.customerBranch[0]['id'];
 
+    formData.value.customerBranch[0].status = statusToggle.value
+      ? 'ACTIVE'
+      : 'INACTIVE';
+
     await editBranchById(currentBranchId.value, {
       ...formData.value.customerBranch[0],
       customerId: currentCustomerId.value,
@@ -1541,6 +1549,7 @@ watch(selectorLabel, async () => {
               :list="
                 (!!inputSearch ? resultSearchEmployee ?? [] : listEmployee).map(
                   (v: Employee) => ({
+                    disabled: v.status === 'INACTIVE',
                     img: v.profileImageUrl,
                     id: v.id,
                     name:
@@ -1566,6 +1575,7 @@ watch(selectorLabel, async () => {
               @update-card="openDialogInputForm"
               @enter-card="openDialogInputForm"
               @delete-card="onDelete"
+              @toggle-status="(id, status) => toggleStatusEmployee(id, status)"
             />
 
             <div class="row flex-center q-pt-md">
@@ -1631,6 +1641,8 @@ watch(selectorLabel, async () => {
           (v) => {
             currentBranchId = v[0].id;
 
+            statusToggle = v[0].status === 'INACTIVE' ? false : true;
+
             currentBranch = {
               name: v[0].name,
               code: v[0].code,
@@ -2478,6 +2490,18 @@ watch(selectorLabel, async () => {
                 }"
               />
             </AppBox>
+
+            <div class="text-left q-pt-md" v-if="infoDrawerEdit">
+              <q-toggle
+                id="toggle-status"
+                dense
+                size="md"
+                v-model="statusToggle"
+                padding="none"
+                class="q-pr-md"
+              />
+              <span>สถานะสาขา</span>
+            </div>
           </div>
         </template>
         <template #information>
diff --git a/src/stores/employee/index.ts b/src/stores/employee/index.ts
index 9c88fe8d..82c666e7 100644
--- a/src/stores/employee/index.ts
+++ b/src/stores/employee/index.ts
@@ -95,7 +95,7 @@ const useEmployeeStore = defineStore('api-employee', () => {
 
   async function editById(
     id: string,
-    data: EmployeeCreate,
+    data: Partial<EmployeeCreate>,
     flow?: {
       sessionId: string;
       refTransactionId: string;