chore: install prettier

app/components/transaction/ChangeCustomerModal.vue

@@ -3,13 +3,13 @@ import { useStore } from "~/stores/index";
 import { useAdvancedWorkflow } from "~/composables/useAdvancedWorkflow";
 import Contract from "~/components/application/Contract.vue";
 import Datepicker from "~/components/datepicker/Datepicker.vue";
-import dayjs from 'dayjs';
+import dayjs from "dayjs";
 
 const props = defineProps({
   transactionId: Number,
 });
 
-const emit = defineEmits(['close', 'modalevent']);
+const emit = defineEmits(["close", "modalevent"]);
 
 const { $getdata, $snackbar } = useNuxtApp();
 const store = useStore();
@@ -23,7 +23,7 @@ const showContract = ref(false);
 const contractId = ref(null);
 
 // Contract Date
-const initialContractDate = dayjs().format('YYYY-MM-DD');
+const initialContractDate = dayjs().format("YYYY-MM-DD");
 const contractDate = ref(initialContractDate);
 const dateRecord = ref({ contractDate: initialContractDate });
 
@@ -31,7 +31,7 @@ const customerViewAddon = {
   component: "customer/CustomerView",
   width: "70%",
   height: "600px",
-  title: "Chi tiết khách hàng"
+  title: "Chi tiết khách hàng",
 };
 
 const customerViewAdd = {
@@ -43,9 +43,9 @@ const customerViewAdd = {
 
 onMounted(async () => {
   if (props.transactionId) {
-    transaction.value = await $getdata('transaction', { id: props.transactionId }, undefined, true);
+    transaction.value = await $getdata("transaction", { id: props.transactionId }, undefined, true);
     if (transaction.value && transaction.value.customer) {
-      currentCustomer.value = await $getdata('customer', { id: transaction.value.customer }, undefined, true);
+      currentCustomer.value = await $getdata("customer", { id: transaction.value.customer }, undefined, true);
     }
   }
 });
@@ -59,7 +59,7 @@ function updateTransactionCustomerDisplay(result) {
   if (result?.success) {
     const contract = result?.contract;
     if (contract && contract.id) {
-      $snackbar(`Đổi khách hàng thành công. Hợp đồng mới được tạo với ID: ${contract.id}`, { type: 'is-success' });
+      $snackbar(`Đổi khách hàng thành công. Hợp đồng mới được tạo với ID: ${contract.id}`, { type: "is-success" });
       contractId.value = contract.id;
       showContract.value = true;
     }
@@ -68,23 +68,19 @@ function updateTransactionCustomerDisplay(result) {
 
 async function confirmChangeCustomer() {
   if (!newCustomer.value) {
-    $snackbar('Vui lòng chọn khách hàng mới.', { type: 'is-warning' });
+    $snackbar("Vui lòng chọn khách hàng mới.", { type: "is-warning" });
     return;
   }
 
   workflowResult.value = null;
 
   try {
-    const result = await updateTransactionCustomer(
-      props.transactionId, 
-      newCustomer.value.id,
-      contractDate.value
-    );
+    const result = await updateTransactionCustomer(props.transactionId, newCustomer.value.id, contractDate.value);
     workflowResult.value = result;
     updateTransactionCustomerDisplay(result);
   } catch (error) {
-    console.error('Workflow execution error:', error);
-    $snackbar('Có lỗi xảy ra khi thực thi workflow.', { type: 'is-danger' });
+    console.error("Workflow execution error:", error);
+    $snackbar("Có lỗi xảy ra khi thực thi workflow.", { type: "is-danger" });
   }
 }
 </script>
@@ -103,12 +99,19 @@ async function confirmChangeCustomer() {
           </div>
           <div>
             <p class="has-text-grey is-size-7">Tên</p>
-            <p class="is-size-6">{{ currentCustomer.name || currentCustomer.fullname }}</p>
+            <p class="is-size-6">
+              {{ currentCustomer.name || currentCustomer.fullname }}
+            </p>
           </div>
           <div>
             <p class="has-text-grey is-size-7">Loại</p>
-            <p class="is-size-6"><span class="tag" :class="currentCustomer.type === 1 ? 'is-info' : 'is-warning'">{{
-              currentCustomer.type === 1 ? 'Cá nhân' : 'Tổ chức' }}</span></p>
+            <p class="is-size-6">
+              <span
+                class="tag"
+                :class="currentCustomer.type === 1 ? 'is-info' : 'is-warning'"
+                >{{ currentCustomer.type === 1 ? "Cá nhân" : "Tổ chức" }}</span
+              >
+            </p>
           </div>
           <div>
             <p class="has-text-grey is-size-7">Điện thoại</p>
@@ -124,20 +127,30 @@ async function confirmChangeCustomer() {
       <div class="field mb-3">
         <label class="label">Chọn khách hàng mới<b class="ml-1 has-text-danger">*</b></label>
         <div class="control">
-          <SearchBox v-bind="{
-            api: 'customer',
-            field: 'label',
-            searchfield: ['code', 'fullname', 'phone', 'legal_code'],
-            column: ['code', 'fullname', 'phone', 'legal_code'],
-            first: true,
-            viewaddon: customerViewAddon,
-            addon: customerViewAdd,
-            placeholder: 'Tìm khách hàng theo mã, tên, số điện thoại hoặc CMND'
-          }" @option="(customer) => { newCustomer = customer }" />
+          <SearchBox
+            v-bind="{
+              api: 'customer',
+              field: 'label',
+              searchfield: ['code', 'fullname', 'phone', 'legal_code'],
+              column: ['code', 'fullname', 'phone', 'legal_code'],
+              first: true,
+              viewaddon: customerViewAddon,
+              addon: customerViewAdd,
+              placeholder: 'Tìm khách hàng theo mã, tên, số điện thoại hoặc CMND',
+            }"
+            @option="
+              (customer) => {
+                newCustomer = customer;
+              }
+            "
+          />
         </div>
       </div>
 
-      <div v-if="newCustomer" class="mb-4">
+      <div
+        v-if="newCustomer"
+        class="mb-4"
+      >
         <h4 class="is-size-6 has-text-weight-bold mb-2">Khách hàng mới được chọn</h4>
         <div class="is-flex is-flex-wrap-wrap is-gap-4">
           <div>
@@ -146,12 +159,19 @@ async function confirmChangeCustomer() {
           </div>
           <div>
             <p class="has-text-grey is-size-7">Tên</p>
-            <p class="is-size-6">{{ newCustomer.name || newCustomer.fullname }}</p>
+            <p class="is-size-6">
+              {{ newCustomer.name || newCustomer.fullname }}
+            </p>
           </div>
           <div>
             <p class="has-text-grey is-size-7">Loại</p>
-            <p class="is-size-6"><span class="tag" :class="newCustomer.type === 1 ? 'is-info' : 'is-warning'">{{
-              newCustomer.type === 1 ? 'Cá nhân' : 'Tổ chức' }}</span></p>
+            <p class="is-size-6">
+              <span
+                class="tag"
+                :class="newCustomer.type === 1 ? 'is-info' : 'is-warning'"
+                >{{ newCustomer.type === 1 ? "Cá nhân" : "Tổ chức" }}</span
+              >
+            </p>
           </div>
           <div>
             <p class="has-text-grey is-size-7">Điện thoại</p>
@@ -166,30 +186,45 @@ async function confirmChangeCustomer() {
 
       <div class="field mb-4">
         <label class="label">Ngày ký hợp đồng mới<b class="ml-1 has-text-danger">*</b></label>
-        <div class="control" style="max-width: 200px;">
-          <Datepicker 
-            :record="dateRecord" 
-            attr="contractDate" 
-            @date="updateContractDate" 
-            position="is-top-left" 
+        <div
+          class="control"
+          style="max-width: 200px"
+        >
+          <Datepicker
+            :record="dateRecord"
+            attr="contractDate"
+            @date="updateContractDate"
+            position="is-top-left"
           />
         </div>
       </div>
 
       <div class="is-flex is-justify-content-flex-end is-gap-2">
-        <button class="button" @click="$emit('close')">Hủy</button>
-        <button class="button is-primary" :disabled="!newCustomer" :class="{ 'is-loading': isLoading }"
-          @click="confirmChangeCustomer">
+        <button
+          class="button"
+          @click="$emit('close')"
+        >
+          Hủy
+        </button>
+        <button
+          class="button is-primary"
+          :disabled="!newCustomer"
+          :class="{ 'is-loading': isLoading }"
+          @click="confirmChangeCustomer"
+        >
           Xác nhận
         </button>
       </div>
-
     </div>
-    <div v-else class="is-flex is-justify-content-center is-align-items-center" style="min-height: 200px;">
+    <div
+      v-else
+      class="is-flex is-justify-content-center is-align-items-center"
+      style="min-height: 200px"
+    >
       <div class="loader"></div>
     </div>
   </div>
   <div v-else>
     <Contract :contractId="contractId" />
   </div>
-</template>
+</template>