refactor(04): change service status

src/pages/04_product-service/MainPage.vue

@@ -672,9 +672,10 @@ async function toggleStatusProduct(id: string, status: Status) {
 }
 
 async function toggleStatusService(id: string, status: Status) {
-  await editService(id, {
+  const res = await editService(id, {
     status: status === 'INACTIVE' ? 'ACTIVE' : 'INACTIVE',
   });
+  if (res) formDataProductService.value.status = res.status;
 
   await alternativeFetch();
   flowStore.rotate();
@@ -4196,7 +4197,7 @@ watch(
   <!-- edit service -->
   <DialogForm
     no-address
-    :edit="!(formDataProductService.status === 'INACTIVE')"
+    edit
     height="95vh"
     :isEdit="infoServiceEdit"
     :title="$t('service')"
@@ -4232,7 +4233,7 @@ watch(
       <ProfileBanner
         hideFade
         useToggle
-        hideActive
+        :active="formDataProductService.status !== 'INACTIVE'"
         :readonly="!infoServiceEdit"
         :toggleTitle="$t('formDialogTitleUseStatus')"
         :img="profileUrl || '/images/service-avatar-add.png'"
@@ -4250,8 +4251,19 @@ watch(
             bgColor: 'var(--surface-1)',
           },
         ]"
+        v-model:toggle-status="formDataProductService.status"
         @view="imageDialog = true"
         @edit="refImageUpload && refImageUpload.browse()"
+        @update:toggle-status="
+          async () => {
+            if (formDataProductService.status)
+              await triggerChangeStatus(
+                currentIdService,
+                formDataProductService.status,
+                'service',
+              );
+          }
+        "
       />
     </div>