chore: install prettier

app/components/marketing/email/Email.vue

@@ -1,12 +1,18 @@
 <template>
-  <div class="container is-fluid px-0" style="overflow: hidden">
+  <div
+    class="container is-fluid px-0"
+    style="overflow: hidden"
+  >
     <!-- 95px is height of nav + breadcrumb -->
-    <div class="columns m-0" style="height: calc(100vh - 95px)"> 
+    <div
+      class="columns m-0"
+      style="height: calc(100vh - 95px)"
+    >
       <!-- Form Section -->
-      <div class="column is-5 pb-5" style="
-        overflow-y: scroll; 
-        border-right: 1px solid #dbdbdb;
-        ">
+      <div
+        class="column is-5 pb-5"
+        style="overflow-y: scroll; border-right: 1px solid #dbdbdb"
+      >
         <label class="label">
           <span class="icon-text">
             <span>Chọn mẫu</span>
@@ -15,12 +21,24 @@
         <div class="level mb-4 mt-2 pr-4">
           <!-- Template Selector -->
 
-          <div class="level-left" style="flex: 1">
-            <div class="level-item" style="flex: 1">
-              <div class="field" style="width: 100%">
+          <div
+            class="level-left"
+            style="flex: 1"
+          >
+            <div
+              class="level-item"
+              style="flex: 1"
+            >
+              <div
+                class="field"
+                style="width: 100%"
+              >
                 <div class="control">
                   <div class="select is-fullwidth">
-                    <select v-model="selectedValue" @change="handleTemplateChange">
+                    <select
+                      v-model="selectedValue"
+                      @change="handleTemplateChange"
+                    >
                       <option value="defaultTemplate">Mặc định</option>
                       <option
                         v-for="template in dataTemplate"
@@ -37,10 +55,16 @@
           </div>
 
           <!-- Action Buttons -->
-          <div v-if="$getEditRights()" class="level-right">
+          <div
+            v-if="$getEditRights()"
+            class="level-right"
+          >
             <div class="level-item">
               <div class="buttons">
-                <button class="button is-light" @click="handleOpenModal">
+                <button
+                  class="button is-light"
+                  @click="handleOpenModal"
+                >
                   <span class="icon">
                     <SvgIcon v-bind="{ name: 'save.svg', type: 'primary', size: 18 }"></SvgIcon>
                   </span>
@@ -87,7 +111,10 @@
           />
         </div>
         <div v-if="activeTab === 'mappings'">
-          <MappingConfigurator :mappings="formData.mappings" @update:mappings="updateMappings" />
+          <MappingConfigurator
+            :mappings="formData.mappings"
+            @update:mappings="updateMappings"
+          />
         </div>
         <div v-if="activeTab === 'automation'">
           <JobConfigurator :template-id="selectedTemplateId" />
@@ -95,25 +122,47 @@
       </div>
 
       <!-- Preview Section -->
-      <div class="column is-7 p-0" style="overflow-y: scroll">
-        <component :is="currentTemplateComponent" v-bind="templateProps" style="height: 100%" />
+      <div
+        class="column is-7 p-0"
+        style="overflow-y: scroll"
+      >
+        <component
+          :is="currentTemplateComponent"
+          v-bind="templateProps"
+          style="height: 100%"
+        />
       </div>
     </div>
 
     <!-- Delete Confirmation Modal -->
-    <div v-if="showDeleteDialog" class="modal is-active">
-      <div class="modal-background" @click="showDeleteDialog = false"></div>
+    <div
+      v-if="showDeleteDialog"
+      class="modal is-active"
+    >
+      <div
+        class="modal-background"
+        @click="showDeleteDialog = false"
+      ></div>
       <div class="modal-card">
         <header class="modal-card-head p-4">
           <p class="modal-card-title">Xác nhận xóa mẫu email</p>
-          <button class="delete" @click="showDeleteDialog = false"></button>
+          <button
+            class="delete"
+            @click="showDeleteDialog = false"
+          ></button>
         </header>
         <section class="modal-card-body p-4">
           <p class="mb-4">Bạn có chắc chắn muốn xóa mẫu email này không? Hành động này không thể hoàn tác.</p>
           <p class="has-text-weight-bold has-text-danger">Mẫu: {{ dataTemplateSelected?.name }}</p>
         </section>
         <footer class="modal-card-foot p-4">
-          <button class="button mr-2" @click="showDeleteDialog = false" :disabled="loading">Hủy</button>
+          <button
+            class="button mr-2"
+            @click="showDeleteDialog = false"
+            :disabled="loading"
+          >
+            Hủy
+          </button>
           <button
             class="button is-danger has-text-white"
             @click="handleDeleteTemplate"
@@ -127,7 +176,11 @@
     </div>
   </div>
 
-  <Modal @close="showmodal = undefined" v-bind="showmodal" v-if="showmodal"></Modal>
+  <Modal
+    @close="showmodal = undefined"
+    v-bind="showmodal"
+    v-if="showmodal"
+  ></Modal>
 </template>
 
 <script setup lang="ts">
@@ -146,7 +199,7 @@ const $deleteapi = nuxtApp.$deleteapi as (name: string, id: any) => Promise<Data
 const $getEditRights = nuxtApp.$getEditRights as () => boolean;
 const showmodal = ref<any>();
 const activeTab = ref("content");
-const defaultTemplate = 'defaultTemplate';
+const defaultTemplate = "defaultTemplate";
 
 // Types
 interface FormContent {
@@ -338,7 +391,7 @@ const handleDeleteTemplate = async () => {
 
   try {
     loading.value = true;
-    await $deleteapi('emailtemplate', selectedTemplateId.value);
+    await $deleteapi("emailtemplate", selectedTemplateId.value);
     $snackbar(`Template deleted: ${dataTemplateSelected.value.name}`);
     await fetchTemplates();
     selectedValue.value = defaultTemplate;
@@ -354,9 +407,9 @@ const handleDeleteTemplate = async () => {
 
 const fetchTemplates = async () => {
   try {
-    dataTemplate.value = await $getdata('emailtemplate');
+    dataTemplate.value = await $getdata("emailtemplate");
   } catch (error) {
-    $snackbar('Error: Failed to fetch templates');
+    $snackbar("Error: Failed to fetch templates");
     console.error(error);
   }
 };
@@ -366,7 +419,11 @@ const handleOpenModal = () => {
 
   if (editMode.value && originalLoadedTemplate.value) {
     // EDIT MODE: Calculate a patch of changed data
-    const patchPayload: { id: number; name?: string; content?: Record<string, any> } = {
+    const patchPayload: {
+      id: number;
+      name?: string;
+      content?: Record<string, any>;
+    } = {
       id: formData.value.id!,
     };
 
@@ -376,10 +433,11 @@ const handleOpenModal = () => {
     }
 
     // 2. Reconstruct the content object, preserving all original fields
-    const originalContentObject = typeof originalLoadedTemplate.value.content === 'object' 
-      ? JSON.parse(JSON.stringify(originalLoadedTemplate.value.content))
-      : {};
-      
+    const originalContentObject =
+      typeof originalLoadedTemplate.value.content === "object"
+        ? JSON.parse(JSON.stringify(originalLoadedTemplate.value.content))
+        : {};
+
     const newContentObject = {
       ...originalContentObject,
       subject: formData.value.content.subject,
@@ -394,11 +452,10 @@ const handleOpenModal = () => {
 
     // 3. Only include the 'content' field in the patch if it has actually changed
     if (JSON.stringify(newContentObject) !== JSON.stringify(originalLoadedTemplate.value.content)) {
-        patchPayload.content = newContentObject;
+      patchPayload.content = newContentObject;
     }
-    
-    dataForModal = patchPayload;
 
+    dataForModal = patchPayload;
   } else {
     // CREATE MODE: Build the full object
     const contentToSave = {