chore: install prettier

app/components/marketing/email/JobConfigurator.vue

@@ -5,23 +5,36 @@
         <h5 class="title is-5">Automation Jobs</h5>
       </div>
       <div class="level-right">
-        <button class="button is-primary" @click="openNewJobForm">
+        <button
+          class="button is-primary"
+          @click="openNewJobForm"
+        >
           <SvgIcon v-bind="{ name: 'add4.svg', type: 'white', size: 18 }" />
           <span class="ml-2">Add New Job</span>
         </button>
       </div>
     </div>
 
-    <div v-if="isLoading" class="has-text-centered">
+    <div
+      v-if="isLoading"
+      class="has-text-centered"
+    >
       <p>Loading jobs...</p>
     </div>
 
-    <div v-else-if="jobs.length === 0" class="has-text-centered">
+    <div
+      v-else-if="jobs.length === 0"
+      class="has-text-centered"
+    >
       <p>No automation jobs found for this template.</p>
     </div>
 
     <div v-else>
-      <div v-for="job in jobs" :key="job.id" class="mb-4 p-3 border">
+      <div
+        v-for="job in jobs"
+        :key="job.id"
+        class="mb-4 p-3 border"
+      >
         <div class="level">
           <div class="level-left">
             <div>
@@ -29,25 +42,43 @@
               <p class="is-size-7">Model: {{ job.model_name }}</p>
               <p class="is-size-7">
                 Triggers:
-                <span v-if="job.trigger_on_create" class="tag is-info is-light mr-1">On Create</span>
-                <span v-if="job.trigger_on_update" class="tag is-warning is-light">On Update</span>
+                <span
+                  v-if="job.trigger_on_create"
+                  class="tag is-info is-light mr-1"
+                  >On Create</span
+                >
+                <span
+                  v-if="job.trigger_on_update"
+                  class="tag is-warning is-light"
+                  >On Update</span
+                >
               </p>
             </div>
           </div>
           <div class="level-right">
             <div class="field has-addons">
               <div class="control">
-                 <button class="button is-small" :class="{'is-success': job.active, 'is-light': !job.active}" @click="toggleJobStatus(job)">
-                  {{ job.active ? 'Active' : 'Inactive' }}
+                <button
+                  class="button is-small"
+                  :class="{ 'is-success': job.active, 'is-light': !job.active }"
+                  @click="toggleJobStatus(job)"
+                >
+                  {{ job.active ? "Active" : "Inactive" }}
                 </button>
               </div>
               <div class="control">
-                <button class="button is-small" @click="openEditJobForm(job)">
+                <button
+                  class="button is-small"
+                  @click="openEditJobForm(job)"
+                >
                   <SvgIcon v-bind="{ name: 'pen1.svg', type: 'primary', size: 18 }" />
                 </button>
               </div>
               <div class="control">
-                <button class="button is-danger is-small" @click="confirmDelete(job)">
+                <button
+                  class="button is-danger is-small"
+                  @click="confirmDelete(job)"
+                >
                   <SvgIcon v-bind="{ name: 'trash.svg', type: 'white', size: 18 }" />
                 </button>
               </div>
@@ -58,54 +89,93 @@
     </div>
 
     <!-- Job Form Modal -->
-    <div v-if="showForm" class="modal is-active">
-      <div class="modal-background" @click="closeForm"></div>
+    <div
+      v-if="showForm"
+      class="modal is-active"
+    >
+      <div
+        class="modal-background"
+        @click="closeForm"
+      ></div>
       <div class="modal-card">
         <header class="modal-card-head">
-          <p class="modal-card-title">{{ isEditing ? 'Edit Job' : 'Create New Job' }}</p>
-          <button class="delete" @click="closeForm"></button>
+          <p class="modal-card-title">
+            {{ isEditing ? "Edit Job" : "Create New Job" }}
+          </p>
+          <button
+            class="delete"
+            @click="closeForm"
+          ></button>
         </header>
         <section class="modal-card-body">
           <div class="field">
             <label class="label">Job Name</label>
             <div class="control">
-              <input class="input" type="text" v-model="jobForm.name" placeholder="e.g., Notify on Transaction Update">
+              <input
+                class="input"
+                type="text"
+                v-model="jobForm.name"
+                placeholder="e.g., Notify on Transaction Update"
+              />
             </div>
           </div>
           <div class="field">
             <label class="label">Model Name</label>
             <div class="control">
-              <input class="input" type="text" v-model="jobForm.model_name" placeholder="e.g., app.Transaction_Detail">
+              <input
+                class="input"
+                type="text"
+                v-model="jobForm.model_name"
+                placeholder="e.g., app.Transaction_Detail"
+              />
             </div>
           </div>
           <div class="field">
             <label class="label">Triggers</label>
             <div class="control">
               <label class="checkbox mr-4">
-                <input type="checkbox" v-model="jobForm.trigger_on_create">
+                <input
+                  type="checkbox"
+                  v-model="jobForm.trigger_on_create"
+                />
                 On Create
               </label>
               <label class="checkbox">
-                <input type="checkbox" v-model="jobForm.trigger_on_update">
+                <input
+                  type="checkbox"
+                  v-model="jobForm.trigger_on_update"
+                />
                 On Update
               </label>
             </div>
           </div>
-           <div class="field">
+          <div class="field">
             <label class="label">Status</label>
             <div class="control">
               <label class="checkbox">
-                <input type="checkbox" v-model="jobForm.active">
+                <input
+                  type="checkbox"
+                  v-model="jobForm.active"
+                />
                 Active
               </label>
             </div>
           </div>
         </section>
         <footer class="modal-card-foot">
-          <button class="button is-success" @click="saveJob" :disabled="isSaving">
-            {{ isSaving ? 'Saving...' : 'Save' }}
+          <button
+            class="button is-success"
+            @click="saveJob"
+            :disabled="isSaving"
+          >
+            {{ isSaving ? "Saving..." : "Save" }}
+          </button>
+          <button
+            class="button"
+            @click="closeForm"
+          >
+            Cancel
           </button>
-          <button class="button" @click="closeForm">Cancel</button>
         </footer>
       </div>
     </div>
@@ -113,10 +183,10 @@
 </template>
 
 <script setup lang="ts">
-import { ref, watch, onMounted } from 'vue';
-import axios from 'axios';
-import { useNuxtApp } from 'nuxt/app';
-import { apiUrl, putApiUrl } from '@/components/marketing/email/Email.utils';
+import { ref, watch, onMounted } from "vue";
+import axios from "axios";
+import { useNuxtApp } from "nuxt/app";
+import { apiUrl, putApiUrl } from "@/components/marketing/email/Email.utils";
 
 const props = defineProps({
   templateId: {
@@ -136,8 +206,8 @@ const isEditing = ref(false);
 
 const defaultJobForm = () => ({
   id: null,
-  name: '',
-  model_name: 'app.Transaction_Detail',
+  name: "",
+  model_name: "app.Transaction_Detail",
   template: props.templateId,
   trigger_on_create: false,
   trigger_on_update: false,
@@ -211,32 +281,32 @@ const saveJob = async () => {
 };
 
 const toggleJobStatus = async (job: any) => {
-    const updatedJob = { ...job, active: !job.active };
-    try {
-        await axios.put(`${putApiUrl}/Email_Job/${job.id}`, updatedJob);
-        $snackbar(`Job status updated`);
-        await fetchJobs();
-    } catch (error) {
-        console.error("Error updating job status:", error);
-        $snackbar(`Error updating job status`);
-    }
+  const updatedJob = { ...job, active: !job.active };
+  try {
+    await axios.put(`${putApiUrl}/Email_Job/${job.id}`, updatedJob);
+    $snackbar(`Job status updated`);
+    await fetchJobs();
+  } catch (error) {
+    console.error("Error updating job status:", error);
+    $snackbar(`Error updating job status`);
+  }
 };
 
 const confirmDelete = (job: any) => {
-    if (confirm(`Are you sure you want to delete the job "${job.name}"?`)) {
-        deleteJob(job.id);
-    }
+  if (confirm(`Are you sure you want to delete the job "${job.name}"?`)) {
+    deleteJob(job.id);
+  }
 };
 
 const deleteJob = async (jobId: number) => {
-    try {
-        await axios.delete(`${putApiUrl}/Email_Job/${jobId}`);
-        $snackbar(`Job deleted successfully`);
-        await fetchJobs();
-    } catch (error) {
-        console.error("Error deleting job:", error);
-        $snackbar(`Error deleting job`);
-    }
+  try {
+    await axios.delete(`${putApiUrl}/Email_Job/${jobId}`);
+    $snackbar(`Job deleted successfully`);
+    await fetchJobs();
+  } catch (error) {
+    console.error("Error deleting job:", error);
+    $snackbar(`Error deleting job`);
+  }
 };
 
 onMounted(fetchJobs);