feat: เพิ่ม toggleStatusEmployee

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="{

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)"
+                        @click="
-                        :model-value="!v.disabled"
+                          $emit('toggleStatus', v.id, v.disabled === false)
+                        "
+                        :model-value="v.disabled"
                         val="xs"
                         padding="none"
                       >

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>

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;