diff --git a/src/modules/10_order/components/step/step04.vue b/src/modules/10_order/components/step/step04.vue
index b2747c8cd..0ac4959ff 100644
--- a/src/modules/10_order/components/step/step04.vue
+++ b/src/modules/10_order/components/step/step04.vue
@@ -8,6 +8,7 @@ import { useQuasar } from "quasar";
 import { useRoute } from "vue-router";
 import http from "@/plugins/http";
 import config from "@/app.config";
+import { aW } from "@fullcalendar/core/internal-common";
 
 const mixin = useCounterMixin();
 const {
@@ -47,23 +48,24 @@ const orderStatusName = ref<string>("");
 const orderId = ref<string>(orderId_params.toString());
 onMounted(async () => {
   if (orderId.value) {
-    fetchAttachment(orderId.value);
-    fecthstatusOrder(orderId.value);
-    getType();
+    showLoader()
+    await fetchAttachment(orderId.value);
+    await fecthstatusOrder();
+    await getCommandDetail();
+    hideLoader()
   }
 });
 
-const getType = async () => {
-  showLoader();
+const getCommandDetail = async () => {
   await http
     .get(config.API.detailOrder(orderId.value))
     .then(async (res) => {
-      const data = res.data.result;
-      const orderTypeCode = data.orderTypeCode;
+      const data = await res.data.result;
+      const orderTypeCode = await data.orderTypeCode;
       code.value = orderTypeCode ?? "";
       orderName.value = res.data.result.orderTitle;
       orderStatusName.value = data.orderStatusName;
-      console.log(orderStatusName.value);
+      // console.log(orderStatusName.value);
 
       fetchReportCover("pdf", orderId.value);
       fetchReportAttachment("pdf", orderId.value);
@@ -71,9 +73,6 @@ const getType = async () => {
     .catch((e) => {
       messageError($q, e);
     })
-    .finally(() => {
-      hideLoader();
-    });
 };
 
 const downloadCover = async (type: string) => {
@@ -111,27 +110,22 @@ const downloadAttachment = async (type: string) => {
 };
 
 const fetchReportCover = async (type: string, orderId: string) => {
-  showLoader();
   await http
     .get(config.API.reportOrderCover(type, orderId, code.value), {
       responseType: "blob",
     })
-    .then(async (res) => {
+    .then((res) => {
       const blob = new Blob([res.data]);
       const objectUrl = URL.createObjectURL(blob);
       orderCoverPdf.value = objectUrl;
       viewPDF(orderCoverPdf.value);
     })
     .catch((e) => {
-      // messageError($q, e);
+      messageError($q, e);
     })
-    .finally(() => {
-      hideLoader();
-    });
 };
 
 const fetchReportAttachment = async (type: string, orderId: string) => {
-  showLoader();
   await http
     .get(config.API.reportOrderAttachment(type, orderId, code.value), {
       responseType: "blob",
@@ -142,15 +136,12 @@ const fetchReportAttachment = async (type: string, orderId: string) => {
       orderAttachmentPdf.value = objectUrl;
     })
     .catch((e) => {
-      // messageError($q, e);
+      messageError($q, e);
     })
-    .finally(() => {
-      hideLoader();
-    });
 };
 
+// Fetch file upload & detail
 const fetchAttachment = async (orderId: string) => {
-  showLoader();
   await http
     .get(config.API.attachmentOrder(orderId))
     .then(async (res) => {
@@ -171,14 +162,11 @@ const fetchAttachment = async (orderId: string) => {
     .catch((e) => {
       messageError($q, e);
     })
-    .finally(() => {
-      hideLoader();
-    });
 };
 
-const fecthstatusOrder = async (orderId: string) => {
+const fecthstatusOrder = async () => {
   await http
-    .get(config.API.orderReady(orderId))
+    .get(config.API.orderReady(orderId.value))
     .then((res) => {
       let status = res.data.result;
       statusOrder.value = status.result;
@@ -187,6 +175,7 @@ const fecthstatusOrder = async (orderId: string) => {
       messageError($q, e);
     });
 };
+
 const viewPDF = async (pdf: string) => {
   const pdfData = await usePDF(`${pdf}`);
   showLoader();
@@ -224,6 +213,7 @@ const page = ref<number>(1);
 const vuePDFRef = ref<any>(null);
 
 const myForm = ref<QForm | null>(null);
+const myFormUpload = ref<QForm | null>(null);
 
 const props = defineProps({
   next: {
@@ -256,16 +246,33 @@ const downloadFile = (response: any, filename: string) => {
   document.body.removeChild(link);
 };
 
-const save = () => {
+const saveUpload = () => {
+  if (myFormUpload.value !== null) {
+    myFormUpload.value!.validate().then((success: Boolean) => {
+      if (success) {
+        dialogConfirm($q, async () => {
+          showLoader()
+          await postfileOrder();
+          await postfileTailer();
+          await fetchAttachment(orderId.value);
+          await fecthstatusOrder();
+          hideLoader()
+        });
+      }
+    });
+  }
+};
+
+const saveDetail = () => {
   if (myForm.value !== null) {
     myForm.value!.validate().then((success: Boolean) => {
       if (success) {
         dialogConfirm($q, async () => {
+          showLoader();
           await putOrderData();
-          await postfileOrder();
-          await postfileTailer();
-          await fetchAttachment(orderId.value);
-          await fecthstatusOrder(orderId.value);
+          await fetchReportCover("pdf", orderId.value);
+          await fecthstatusOrder();
+          hideLoader();
         });
       }
     });
@@ -293,45 +300,60 @@ const postfileOrder = async () => {
   formData.append("File", fileOrder.value);
   await http
     .post(config.API.attachmentOrderId(orderId.value), formData)
-    .then(() => {
-      // fileOrder.value = null
-    });
+    .catch((e) => {
+      messageError($q, e)
+    })
 };
+
 const postfileTailer = async () => {
   const formData = new FormData();
   formData.append("File", fileTailer.value);
   await http
     .post(config.API.attachmentFileId(orderId.value), formData)
-    .then(() => {
-      //fileTailer.value = null
-    });
+    .then(()=>{
+      success($q, "บันทึกข้อมูลสำเร็จ");
+    })
+    .catch((e) => {
+      messageError($q, e)
+    })
 };
 
 const clickExecute = async (id: string) => {
   dialogConfirm(
     $q,
     async () => {
+      showLoader()
       await http
         .put(config.API.executeOrder(id))
         .then((res) => {
-          console.log(res);
+          success($q, "ออกคำสั่งสำเร็จ");
         })
         .catch((e) => {
           messageError($q, e);
-        });
+        }).finally(async()=> {
+          await fecthstatusOrder()
+          await getCommandDetail()
+          hideLoader();
+        })
     },
     "ยืนยันการออกคำสั่ง",
     "ต้องการยืนยันการออกคำสั่งนี้ใช่หรือไม่?"
   );
 };
 
-const validateForm = () => {
+const validateFormUpload = () => {
   return (
     fileOrder.value !== null &&
-    fileOrder.value !== null &&
+    fileTailer.value !== null
+  );
+};
+
+const validateForm = () => {
+  return (
     order.value.trim() !== ""
   );
 };
+
 const getClass = (val: boolean) => {
   return {
     "card-header-active q-px-lg q-py-md cursor-pointer": val,
@@ -354,105 +376,60 @@ const viewFileUpload = async (url: string) => {
 <template>
   <div>
     <div style="min-height: 70vh">
-      <q-splitter
-        v-model="splitterModel"
-        style="height: 70vh"
-        @update:model-value="onchangePage"
-      >
+      <q-splitter v-model="splitterModel" style="height: 70vh" @update:model-value="onchangePage">
         <template v-slot:before>
           <div class="space">
             <div @click="setTab('main')" :class="getClass(tab == 'main')">
               <div class="q-pr-sm">คำสั่ง</div>
-              <q-btn
-                size="12px"
-                flat
-                dense
-                icon="mdi-download"
-                :disable="tab !== 'main'"
-                :color="tab !== 'main' ? 'grey' : 'add'"
-              >
+              <q-btn size="12px" flat dense icon="mdi-download" :disable="tab !== 'main'"
+                :color="tab !== 'main' ? 'grey' : 'add'">
                 <q-tooltip>ดาวน์โหลด</q-tooltip>
                 <q-menu>
                   <q-list style="min-width: 150px">
-                    <q-item
-                      clickable
-                      v-close-popup
-                      @click="downloadCover('pdf')"
-                    >
+                    <q-item clickable v-close-popup @click="downloadCover('pdf')">
                       <!-- type="a"
                       :href="orderCoverPdf"
                       target="_blank" -->
-                      <q-item-section avatar
-                        ><q-icon color="red" name="mdi-file-pdf"
-                      /></q-item-section>
+                      <q-item-section avatar><q-icon color="red" name="mdi-file-pdf" /></q-item-section>
                       <q-item-section>ไฟล์ .PDF</q-item-section>
                     </q-item>
-                    <q-item
-                      clickable
-                      v-close-popup
-                      @click="downloadCover('docx')"
-                    >
+                    <q-item clickable v-close-popup @click="downloadCover('docx')">
                       <!-- type="a"
                       :href="orderCoverDocs"
                       target="_blank" -->
-                      <q-item-section avatar
-                        ><q-icon color="blue" name="mdi-file-word"
-                      /></q-item-section>
+                      <q-item-section avatar><q-icon color="blue" name="mdi-file-word" /></q-item-section>
                       <q-item-section>ไฟล์ .docx</q-item-section>
                     </q-item>
                   </q-list>
                 </q-menu>
               </q-btn>
             </div>
-            <div
-              v-if="
-                code != 'c-pm-10' &&
-                code != 'c-pm-11' &&
-                code != 'c-pm-12' &&
-                code != 'c-pm-16' &&
-                code != 'c-pm-18' &&
-                code != 'c-pm-19' &&
-                code != 'c-pm-20'
-              "
-              @click="setTab('second')"
-              :class="getClass(tab == 'second')"
-            >
+            <div v-if="code != 'c-pm-10' &&
+              code != 'c-pm-11' &&
+              code != 'c-pm-12' &&
+              code != 'c-pm-16' &&
+              code != 'c-pm-18' &&
+              code != 'c-pm-19' &&
+              code != 'c-pm-20'
+              " @click="setTab('second')" :class="getClass(tab == 'second')">
               <div class="q-pr-sm">เอกสารแนบท้าย</div>
-              <q-btn
-                size="12px"
-                flat
-                dense
-                :color="tab !== 'second' ? 'grey' : 'add'"
-                icon="mdi-download"
-                :disable="tab !== 'second'"
-              >
+              <q-btn size="12px" flat dense :color="tab !== 'second' ? 'grey' : 'add'" icon="mdi-download"
+                :disable="tab !== 'second'">
                 <q-tooltip>ดาวน์โหลด</q-tooltip>
                 <q-menu>
                   <q-list style="min-width: 150px">
-                    <q-item
-                      clickable
-                      v-close-popup
-                      @click="downloadAttachment('pdf')"
-                    >
+                    <q-item clickable v-close-popup @click="downloadAttachment('pdf')">
                       <!-- type="a"
                       :href="orderAttachmentPdf"
                       target="_blank" -->
-                      <q-item-section avatar
-                        ><q-icon color="red" name="mdi-file-pdf"
-                      /></q-item-section>
+                      <q-item-section avatar><q-icon color="red" name="mdi-file-pdf" /></q-item-section>
                       <q-item-section>ไฟล์ .PDF</q-item-section>
                     </q-item>
-                    <q-item
-                      clickable
-                      v-close-popup
-                      @click="downloadAttachment('xlsx')"
-                    >
+                    <q-item clickable v-close-popup @click="downloadAttachment('xlsx')">
                       <!-- type="a"
                       :href="orderAttachmentXlsx"
                       target="_blank" -->
-                      <q-item-section avatar
-                        ><q-icon color="green-7" name="mdi-file-excel"
-                      /></q-item-section>
+                      <q-item-section avatar><q-icon color="green-7" name="mdi-file-excel" /></q-item-section>
                       <q-item-section>ไฟล์ .xls</q-item-section>
                     </q-item>
                   </q-list>
@@ -460,24 +437,12 @@ const viewFileUpload = async (url: string) => {
               </q-btn>
             </div>
             <q-space />
-            <q-btn
-              class="text-dark"
-              flat
-              dense
-              icon="mdi-fullscreen"
-              color="add"
-              @click="dialog = true"
-            />
+            <q-btn class="text-dark" flat dense icon="mdi-fullscreen" color="add" @click="dialog = true" />
           </div>
           <q-separator style="margin-top: -1px; z-index: 1" />
           <q-card bordered class="card-pdf q-ma-md q-pa-md">
             <div class="justify-between items-center align-center q-pb-sm row">
-              <q-btn
-                class="text-dark bg-grey-4"
-                flat
-                dense
-                @click="page = page > 1 ? page - 1 : page"
-              >
+              <q-btn class="text-dark bg-grey-4" flat dense @click="page = page > 1 ? page - 1 : page">
                 <q-icon name="mdi-chevron-left" />
               </q-btn>
 
@@ -485,12 +450,7 @@ const viewFileUpload = async (url: string) => {
                 หน้าที่ {{ page }} จาก {{ numOfPages }}
               </span>
 
-              <q-btn
-                class="text-dark bg-grey-4"
-                flat
-                dense
-                @click="page = page < numOfPages ? page + 1 : page"
-              >
+              <q-btn class="text-dark bg-grey-4" flat dense @click="page = page < numOfPages ? page + 1 : page">
                 <q-icon name="mdi-chevron-right" />
               </q-btn>
             </div>
@@ -499,12 +459,7 @@ const viewFileUpload = async (url: string) => {
               <!-- <VuePdf :key="page" :src="pdfSrc" :page="page" /> -->
             </div>
             <div class="justify-between items-center align-center q-pt-sm row">
-              <q-btn
-                class="text-dark bg-grey-4"
-                flat
-                dense
-                @click="page = page > 1 ? page - 1 : page"
-              >
+              <q-btn class="text-dark bg-grey-4" flat dense @click="page = page > 1 ? page - 1 : page">
                 <q-icon name="mdi-chevron-left" />
               </q-btn>
 
@@ -512,12 +467,7 @@ const viewFileUpload = async (url: string) => {
                 หน้าที่ {{ page }} จาก {{ numOfPages }}
               </span>
 
-              <q-btn
-                class="text-dark bg-grey-4"
-                flat
-                dense
-                @click="page = page < numOfPages ? page + 1 : page"
-              >
+              <q-btn class="text-dark bg-grey-4" flat dense @click="page = page < numOfPages ? page + 1 : page">
                 <q-icon name="mdi-chevron-right" />
               </q-btn>
             </div>
@@ -525,166 +475,98 @@ const viewFileUpload = async (url: string) => {
         </template>
 
         <template v-slot:separator>
-          <q-avatar
-            color="primary"
-            text-color="white"
-            size="30px"
-            icon="drag_indicator"
-          />
+          <q-avatar color="primary" text-color="white" size="30px" icon="drag_indicator" />
         </template>
 
         <template v-slot:after>
-          <q-form ref="myForm">
-            <div class="q-pa-md q-gutter-y-md">
-              <fieldset class="border q-px-lg q-py-md">
+          <div class="q-pa-md q-gutter-y-md">
+            <q-form ref="myFormUpload">
+              <fieldset class="border q-px-lg q-py-sm">
                 <legend class="text-header q-px-sm">อัปโหลดไฟล์</legend>
                 <div class="q-gutter-y-md q-mb-md">
                   <div>
                     <label class="text-file">คำสั่ง</label>
-                    <div class="text-right">
-                      <q-btn
-                        size="12px"
-                        flat
-                        dense
-                        color="primary"
-                        icon="mdi-eye"
-                        @click="viewFileUpload(OrderPDFUpload)"
-                      >
+                    <div v-if="OrderPDFUpload != ''" class="text-right">
+                      <q-btn size="12px" flat dense color="primary" icon="mdi-eye"
+                        @click="viewFileUpload(OrderPDFUpload)">
                         <q-tooltip>ดูไฟล์คำสั่ง</q-tooltip>
                       </q-btn>
-                      <q-btn
-                        type="a"
-                        :href="OrderPDFUpload"
-                        size="12px"
-                        flat
-                        dense
-                        color="red"
-                        icon="mdi-download"
-                        target="_blank"
-                      >
+                      <q-btn type="a" :href="OrderPDFUpload" size="12px" flat dense color="red" icon="mdi-download"
+                        target="_blank">
                         <q-tooltip>ดาวน์โหลดไฟล์คำสั่ง</q-tooltip>
                       </q-btn>
                     </div>
-                    <q-file
-                      outlined
-                      dense
-                      v-model="fileOrder"
-                      label="เลือกไฟล์คำสั่ง"
-                      hide-bottom-space
-                      lazy-rules
-                      :rules="[(val) => val || 'กรุณาเลือกไฟล์ไฟล์คำสั่ง']"
-                      accept=".pdf"
-                    >
+                    <q-file outlined dense v-model="fileOrder" label="เลือกไฟล์คำสั่ง" hide-bottom-space lazy-rules
+                      :rules="[(val) => val || 'กรุณาเลือกไฟล์ไฟล์คำสั่ง']" accept=".pdf">
                       <template v-slot:prepend>
                         <q-icon name="attach_file" />
                       </template>
                     </q-file>
                   </div>
-                  <div
-                    v-if="
-                      code != 'c-pm-10' &&
-                      code != 'c-pm-11' &&
-                      code != 'c-pm-12' &&
-                      code != 'c-pm-16' &&
-                      code != 'c-pm-18' &&
-                      code != 'c-pm-19' &&
-                      code != 'c-pm-20'
-                    "
-                  >
+                  <div v-if="code != 'c-pm-10' &&
+                    code != 'c-pm-11' &&
+                    code != 'c-pm-12' &&
+                    code != 'c-pm-16' &&
+                    code != 'c-pm-18' &&
+                    code != 'c-pm-19' &&
+                    code != 'c-pm-20'
+                    ">
                     <label class="text-file">เอกสารแนบท้าย</label>
-                    <div class="text-right">
-                      <q-btn
-                        size="12px"
-                        flat
-                        dense
-                        color="primary"
-                        icon="mdi-eye"
-                        @click="viewFileUpload(TailerPDFUpload)"
-                      >
+                    <div v-if="TailerPDFUpload != ''" class="text-right">
+                      <q-btn size="12px" flat dense color="primary" icon="mdi-eye"
+                        @click="viewFileUpload(TailerPDFUpload)">
                         <q-tooltip>ดูเอกสารแนบท้าย</q-tooltip>
                       </q-btn>
-                      <q-btn
-                        type="a"
-                        :href="TailerPDFUpload"
-                        size="12px"
-                        flat
-                        dense
-                        color="red"
-                        icon="mdi-download"
-                        target="_blank"
-                      >
+                      <q-btn type="a" :href="TailerPDFUpload" size="12px" flat dense color="red" icon="mdi-download"
+                        target="_blank">
                         <q-tooltip>ดาวน์โหลดเอกสารแนบท้าย</q-tooltip>
                       </q-btn>
                     </div>
 
-                    <q-file
-                      outlined
-                      dense
-                      v-model="fileTailer"
-                      label="เลือกไฟล์เอกสารแนบท้าย"
-                      hide-bottom-space
-                      lazy-rules
-                      :rules="[(val) => val || 'กรุณาเลือกไฟล์เอกสารแนบท้าย']"
-                      accept=".pdf"
-                    >
+                    <q-file outlined dense v-model="fileTailer" label="เลือกไฟล์เอกสารแนบท้าย" hide-bottom-space
+                      lazy-rules :rules="[(val) => val || 'กรุณาเลือกไฟล์เอกสารแนบท้าย']" accept=".pdf">
                       <template v-slot:prepend>
                         <q-icon name="attach_file" />
                       </template>
                     </q-file>
+
+                    <!-- บันทึกอัพโหลดเอกสาร  -->
+                    <div class="row col-12 q-mt-md">
+                      <q-space></q-space>
+                      <q-btn unelevated label="บันทึก" :color="validateFormUpload() ? 'public' : 'grey'"
+                        :disable="!validateFormUpload() || orderStatusName == 'ออกคำสั่งแล้ว'" @click="saveUpload">
+                      </q-btn>
+                    </div>
+
                   </div>
                 </div>
               </fieldset>
+            </q-form>
 
-              <fieldset class="border q-px-lg q-py-md">
+            <q-form ref="myForm">
+              <fieldset class="border q-px-lg q-py-sm">
                 <legend class="text-header q-px-sm">รายละเอียด</legend>
                 <div class="q-gutter-y-md q-mb-md">
                   <div>
                     <label class="text-file">เลขที่คำสั่ง</label>
-                    <q-input
-                      :outlined="true"
-                      dense
-                      lazy-rules
-                      :readonly="!true"
-                      :borderless="!true"
-                      v-model="order"
-                      :rules="[(val) => !!val || `${'กรุณากรอกเลขที่คำสั่ง'}`]"
-                      hide-bottom-space
-                      :label="`${'เลขที่คำสั่ง'}`"
-                    />
+                    <q-input :outlined="true" dense lazy-rules :readonly="!true" :borderless="!true" v-model="order"
+                      :rules="[(val) => !!val || `${'กรุณากรอกเลขที่คำสั่ง'}`]" hide-bottom-space
+                      :label="`${'เลขที่คำสั่ง'}`" />
                   </div>
                   <div>
                     <label class="text-file">ปีที่ออกคำสั่ง</label>
-                    <datepicker
-                      menu-class-name="modalfix"
-                      v-model="years"
-                      :locale="'th'"
-                      autoApply
-                      year-picker
-                      :enableTimePicker="false"
-                      week-start="0"
-                    >
+                    <datepicker menu-class-name="modalfix" v-model="years" :locale="'th'" autoApply year-picker
+                      :enableTimePicker="false" week-start="0">
                       <template #year="{ year }">{{ year + 543 }}</template>
                       <template #year-overlay-value="{ value }">{{
                         parseInt(value + 543)
                       }}</template>
                       <template #trigger>
-                        <q-input
-                          outlined
-                          dense
-                          lazy-rules
-                          :model-value="years + 543"
-                          :rules="[
-                            (val) => !!val || `${'กรุณาเลือกปีที่ออกคำสั่ง'}`,
-                          ]"
-                          hide-bottom-space
-                          :label="`${'ปีที่ออกคำสั่ง'}`"
-                        >
+                        <q-input outlined dense lazy-rules :model-value="years + 543" :rules="[
+                          (val) => !!val || `${'กรุณาเลือกปีที่ออกคำสั่ง'}`,
+                        ]" hide-bottom-space :label="`${'ปีที่ออกคำสั่ง'}`">
                           <template v-slot:prepend>
-                            <q-icon
-                              name="event"
-                              class="cursor-pointer"
-                              style="color: var(--q-grey)"
-                            >
+                            <q-icon name="event" class="cursor-pointer" style="color: var(--q-grey)">
                             </q-icon>
                           </template>
                         </q-input>
@@ -693,15 +575,8 @@ const viewFileUpload = async (url: string) => {
                   </div>
                   <div>
                     <label class="text-file">วันที่ลงนาม</label>
-                    <datepicker
-                      menu-class-name="modalfix"
-                      v-model="date"
-                      :locale="'th'"
-                      autoApply
-                      borderless
-                      :enableTimePicker="false"
-                      week-start="0"
-                    >
+                    <datepicker menu-class-name="modalfix" v-model="date" :locale="'th'" autoApply borderless
+                      :enableTimePicker="false" week-start="0">
                       <template #year="{ year }">
                         {{ year + 543 }}
                       </template>
@@ -709,106 +584,66 @@ const viewFileUpload = async (url: string) => {
                         {{ parseInt(value + 543) }}
                       </template>
                       <template #trigger>
-                        <q-input
-                          outlined
-                          dense
-                          class="full-width datepicker"
-                          hide-bottom-space
-                          :model-value="date != null ? date2Thai(date) : null"
-                          :label="`${'วันที่ลงนาม'}`"
-                          :rules="[
+                        <q-input outlined dense class="full-width datepicker" hide-bottom-space
+                          :model-value="date != null ? date2Thai(date) : null" :label="`${'วันที่ลงนาม'}`" :rules="[
                             (val) => !!val || `${'กรุณาเลือกวันที่ลงนาม'}`,
-                          ]"
-                        >
+                          ]">
                           <template v-slot:prepend>
-                            <q-icon
-                              name="event"
-                              class="cursor-pointer"
-                              style="color: var(--q-grey)"
-                            >
+                            <q-icon name="event" class="cursor-pointer" style="color: var(--q-grey)">
                             </q-icon>
                           </template>
                         </q-input>
                       </template>
                     </datepicker>
                   </div>
+
+                  <!-- บันทึกรายละเอียดคำสั่ง  -->
+                  <div class="row col-12 q-mt-md">
+                    <q-space></q-space>
+                    <q-btn unelevated label="บันทึก" :color="validateForm() ? 'public' : 'grey'"
+                      :disable="!validateForm()" @click="saveDetail">
+                    </q-btn>
+                  </div>
+
                 </div>
               </fieldset>
-              <div class="flex justify-around">
-                <q-btn
-                  unelevated
-                  label="ออกคำสั่ง"
-                  :color="validateForm() ? 'public' : 'grey'"
-                  :disable="
-                    statusOrder == 'N' || orderStatusName === 'ออกคำสั่งแล้ว'
-                  "
-                  @click="clickExecute(orderId)"
-                />
-                <q-btn
-                  class="text-dark"
-                  unelevated
-                  label="ส่งไปลงนาม"
-                  color="grey"
-                  :disable="
-                    statusOrder == 'N' || orderStatusName === 'ออกคำสั่งแล้ว'
-                  "
-                />
-              </div>
-            </div>
-          </q-form>
+            </q-form>
+
+          </div>
         </template>
       </q-splitter>
     </div>
     <q-separator />
     <div class="flex justify-end q-pa-sm q-gutter-sm">
-      <q-btn
-        v-if="orderStatusName !== 'ออกคำสั่งแล้ว'"
-        dense
-        outline
-        color="primary"
-        icon="chevron_left"
-        @click="previous"
-        class="q-pr-md"
-        label="เลือกรายชื่อส่งสำเนา"
-      >
+      <q-btn v-if="orderStatusName !== 'ออกคำสั่งแล้ว'" dense outline color="primary" icon="chevron_left"
+        @click="previous" class="q-pr-md" label="เลือกรายชื่อส่งสำเนา">
       </q-btn>
-      <q-btn
-        unelevated
-        label="บันทึก"
-        :color="validateForm() ? 'public' : 'grey'"
-        :disable="!validateForm()"
-        @click="save"
-      >
+
+      <!-- ออกคำสั่ง -->
+      <q-btn :disable="statusOrder == 'N' || orderStatusName === 'ออกคำสั่งแล้ว'" unelevated label="ออกคำสั่ง" :color="statusOrder == 'Y' && orderStatusName !== 'ออกคำสั่งแล้ว' ? 'public' : 'grey'">
+        <q-menu>
+          <q-list style="min-width: 150px">
+            <q-item clickable v-close-popup @click="clickExecute(orderId)">
+              <q-item-section>ออกคำสั่งทันที</q-item-section>
+            </q-item>
+            <q-item clickable v-close-popup disabled>
+              <q-item-section>ส่งไปลงนาม</q-item-section>
+            </q-item>
+          </q-list>
+        </q-menu>
       </q-btn>
+
     </div>
 
-    <q-dialog
-      v-model="dialog"
-      persistent
-      :maximized="true"
-      transition-show="slide-up"
-      transition-hide="slide-down"
-    >
+    <q-dialog v-model="dialog" persistent :maximized="true" transition-show="slide-up" transition-hide="slide-down">
       <q-card class="bg-white text-white">
         <div class="flex justify-end items-center align-center q-mr-md q-mt-sm">
-          <q-btn
-            icon="close"
-            unelevated
-            round
-            dense
-            style="color: #ff8080; background-color: #ffdede"
-            size="12px"
-            v-close-popup
-          />
+          <q-btn icon="close" unelevated round dense style="color: #ff8080; background-color: #ffdede" size="12px"
+            v-close-popup />
         </div>
         <q-card-section bordered class="card-pdf q-ma-md q-pa-md">
           <div class="justify-between items-center align-center q-pb-sm row">
-            <q-btn
-              class="text-dark bg-grey-4"
-              flat
-              dense
-              @click="page = page > 1 ? page - 1 : page"
-            >
+            <q-btn class="text-dark bg-grey-4" flat dense @click="page = page > 1 ? page - 1 : page">
               <q-icon name="mdi-chevron-left" />
             </q-btn>
 
@@ -816,32 +651,16 @@ const viewFileUpload = async (url: string) => {
               หน้าที่ {{ page }} จาก {{ numOfPages }}
             </span>
 
-            <q-btn
-              class="text-dark bg-grey-4"
-              flat
-              dense
-              @click="page = page < numOfPages ? page + 1 : page"
-            >
+            <q-btn class="text-dark bg-grey-4" flat dense @click="page = page < numOfPages ? page + 1 : page">
               <q-icon name="mdi-chevron-right" />
             </q-btn>
           </div>
           <div class="pdfWidth">
-            <VuePDF
-              ref="vuePDFRef"
-              :pdf="pdfSrc"
-              :page="page"
-              fit-parent
-              :scale="0.1"
-            />
+            <VuePDF ref="vuePDFRef" :pdf="pdfSrc" :page="page" fit-parent :scale="0.1" />
             <!-- <VuePdf :key="page" :src="pdfSrc" :page="page" /> -->
           </div>
           <div class="justify-between items-center align-center q-pt-sm row">
-            <q-btn
-              class="text-dark bg-grey-4"
-              flat
-              dense
-              @click="page = page > 1 ? page - 1 : page"
-            >
+            <q-btn class="text-dark bg-grey-4" flat dense @click="page = page > 1 ? page - 1 : page">
               <q-icon name="mdi-chevron-left" />
             </q-btn>
 
@@ -849,12 +668,7 @@ const viewFileUpload = async (url: string) => {
               หน้าที่ {{ page }} จาก {{ numOfPages }}
             </span>
 
-            <q-btn
-              class="text-dark bg-grey-4"
-              flat
-              dense
-              @click="page = page < numOfPages ? page + 1 : page"
-            >
+            <q-btn class="text-dark bg-grey-4" flat dense @click="page = page < numOfPages ? page + 1 : page">
               <q-icon name="mdi-chevron-right" />
             </q-btn>
           </div>
@@ -862,33 +676,16 @@ const viewFileUpload = async (url: string) => {
       </q-card>
     </q-dialog>
 
-    <q-dialog
-      v-model="dialogFileUpload"
-      persistent
-      :maximized="true"
-      transition-show="slide-up"
-      transition-hide="slide-down"
-    >
+    <q-dialog v-model="dialogFileUpload" persistent :maximized="true" transition-show="slide-up"
+      transition-hide="slide-down">
       <q-card class="bg-white text-white">
         <div class="flex justify-end items-center align-center q-mr-md q-mt-sm">
-          <q-btn
-            icon="close"
-            unelevated
-            round
-            dense
-            style="color: #ff8080; background-color: #ffdede"
-            size="12px"
-            v-close-popup
-          />
+          <q-btn icon="close" unelevated round dense style="color: #ff8080; background-color: #ffdede" size="12px"
+            v-close-popup />
         </div>
         <q-card-section bordered class="card-pdf q-ma-md q-pa-md">
           <div class="justify-between items-center align-center q-pb-sm row">
-            <q-btn
-              class="text-dark bg-grey-4"
-              flat
-              dense
-              @click="page = page > 1 ? page - 1 : page"
-            >
+            <q-btn class="text-dark bg-grey-4" flat dense @click="page = page > 1 ? page - 1 : page">
               <q-icon name="mdi-chevron-left" />
             </q-btn>
 
@@ -896,32 +693,16 @@ const viewFileUpload = async (url: string) => {
               หน้าที่ {{ page }} จาก {{ numOfPages }}
             </span>
 
-            <q-btn
-              class="text-dark bg-grey-4"
-              flat
-              dense
-              @click="page = page < numOfPages ? page + 1 : page"
-            >
+            <q-btn class="text-dark bg-grey-4" flat dense @click="page = page < numOfPages ? page + 1 : page">
               <q-icon name="mdi-chevron-right" />
             </q-btn>
           </div>
           <div class="pdfWidth">
-            <VuePDF
-              ref="vuePDFRef"
-              :pdf="pdfFileUploadSrc"
-              :page="page"
-              fit-parent
-              :scale="0.1"
-            />
+            <VuePDF ref="vuePDFRef" :pdf="pdfFileUploadSrc" :page="page" fit-parent :scale="0.1" />
             <!-- <VuePdf :key="page" :src="pdfSrc" :page="page" /> -->
           </div>
           <div class="justify-between items-center align-center q-pt-sm row">
-            <q-btn
-              class="text-dark bg-grey-4"
-              flat
-              dense
-              @click="page = page > 1 ? page - 1 : page"
-            >
+            <q-btn class="text-dark bg-grey-4" flat dense @click="page = page > 1 ? page - 1 : page">
               <q-icon name="mdi-chevron-left" />
             </q-btn>
 
@@ -929,12 +710,7 @@ const viewFileUpload = async (url: string) => {
               หน้าที่ {{ page }} จาก {{ numOfPages }}
             </span>
 
-            <q-btn
-              class="text-dark bg-grey-4"
-              flat
-              dense
-              @click="page = page < numOfPages ? page + 1 : page"
-            >
+            <q-btn class="text-dark bg-grey-4" flat dense @click="page = page < numOfPages ? page + 1 : page">
               <q-icon name="mdi-chevron-right" />
             </q-btn>
           </div>