From c99f221c8360b9ee844ea0ea31561fd636f78fdd Mon Sep 17 00:00:00 2001
From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" <nicey2t1096@gmail.com>
Date: Fri, 25 Aug 2023 17:02:18 +0700
Subject: [PATCH] =?UTF-8?q?api=20=E0=B8=AD=E0=B8=AD=E0=B8=81=E0=B8=84?=
 =?UTF-8?q?=E0=B8=B3=E0=B8=AA=E0=B8=B1=E0=B9=88=E0=B8=87?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/05_placement/api.placement.ts         |   10 +-
 .../10_order/components/step/step01.vue       | 1480 +++++++++++++----
 2 files changed, 1120 insertions(+), 370 deletions(-)

diff --git a/src/api/05_placement/api.placement.ts b/src/api/05_placement/api.placement.ts
index f83d400c7..c8e627c3f 100644
--- a/src/api/05_placement/api.placement.ts
+++ b/src/api/05_placement/api.placement.ts
@@ -72,7 +72,7 @@ export default {
   prevStep: (orderId: string) => `${order}/order/prev/${orderId}`,
   executeOrder: (orderId: string) => `${order}/order/execute/${orderId}`,
   createOrder: () => `${order}/order/detail`,
-  examroundOrder: () => `${order}/order/detail/exam-round`,
+  examroundOrder: (commandCode: string) => `${order}/order/detail/exam-round/${commandCode}`,
   personsOrder: (orderId: string) => `${order}/order/persons/${orderId}`, //ข้อมูลเลือกรายชื่อออกคำสั่ง, ลบรายชื่อ
   personsselectedOrder: (orderId: string) =>
     `${order}/order/persons-selected/${orderId}`,
@@ -150,5 +150,11 @@ export default {
   otherReport: (id: string) => `${placemenOther}/report/${id}`,
   otherByid: (id: string) => `${placemenOther}/${id}`,
 
-  userPlacement:(id:string) => `${placement}/user/${id}`
+  userPlacement: (id: string) => `${placement}/user/${id}`,
+
+  // orderForm 
+  orderCPM: (type: string) => `${order}/order/${type}/detail`,
+  orderCPMUpdate: (type: string, id: string) => `${order}/order/${type}/detail/${id}`,
+
+
 };
diff --git a/src/modules/10_order/components/step/step01.vue b/src/modules/10_order/components/step/step01.vue
index cca81ea63..84aa15ad2 100644
--- a/src/modules/10_order/components/step/step01.vue
+++ b/src/modules/10_order/components/step/step01.vue
@@ -217,15 +217,9 @@ watch(byOrder, async () => {
 });
 
 watch(nameCommand, async () => {
-  // console.log(nameCommand.value);
-  // console.log(positionCommand.value);
-
   if (positionCommand.value === "" || positionCommand.value === undefined) {
     positionCommand.value = nameCommand.value.positionName;
   }
-  // if (nameCommand.value === "") {
-  //   positionCommand.value = "";
-  // }
 });
 const fecthTypeOption = async (actions: string) => {
   showLoader();
@@ -248,7 +242,6 @@ const fecthTypeOption = async (actions: string) => {
         await fetchdetailOrder();
       }
       await fecthCommand();
-      await fecthExamRoundOption();
       hideLoader();
     });
 };
@@ -278,12 +271,12 @@ const fetchdetailOrder = async () => {
       conclusionRegisterDate.value = data.conclusionRegisterDate;
       conclusionResultNo.value = data.conclusionResultNo;
       conclusionResultDate.value = data.conclusionResultDate;
+      fecthExamRoundOption(data.orderTypeCode);
     })
     .catch((e) => {
       messageError($q, e);
     })
     .finally(async () => {
-      await fecthExamRoundOption();
       await fecthCommand();
       hideLoader();
     });
@@ -299,29 +292,35 @@ const fecthCommand = async () => {
       console.log(e);
     });
 };
-const fecthExamRoundOption = async () => {
+const selectCMP = (selectOrder: any) => {
+  fecthExamRoundOption(selectOrder.commandCode);
+};
+const fecthExamRoundOption = async (commandCode: string) => {
   await http
-    .get(config.API.examroundOrder())
+    .get(config.API.examroundOrder(commandCode))
     .then((res) => {
       examRoundOption.value = res.data.result;
-      // console.log(examRoundOption.value);
     })
-    .catch((e) => { });
+    .catch((e) => {
+      console.log(e);
+    });
 };
 
 const submit = async () => {
-  console.log("nameCommand ===>", nameCommand.value);
-
   let signBy = null;
   if (!nameCommand.value.length) {
     signBy = await nameCommand.value.name;
   } else {
-    const name2 = await CommandOption.value.find((x: any) => x.id == nameCommand.value.id);
+    const name2 = await CommandOption.value.find(
+      (x: any) => x.id == nameCommand.value.id
+    );
     signBy = await name2?.name;
     console.log("signBy", signBy);
   }
 
-  const orderByOrganizationName = await byOrderOption.value.find((x:any)=>x.id == byOrder.value)?.name;
+  const orderByOrganizationName = await byOrderOption.value.find(
+    (x: any) => x.id == byOrder.value
+  )?.name;
 
   const formdata = {
     orderTypeValue: typeOrder.value.id,
@@ -336,25 +335,6 @@ const submit = async () => {
     signatoryBy: signBy,
     signatoryPosition: positionCommand.value,
   };
-
-  //   {
-  //   "orderTypeValue": "3fa85f64-5717-4562-b3fc-2c963f66afa6",
-  //   "orderTitle": "string",
-  //   "orderNo": "string",
-  //   "orderYear": 0,
-  //   "orderDate": "2023-08-21T09:46:54.354Z",
-  //   "orderBy": "3fa85f64-5717-4562-b3fc-2c963f66afa6",
-  //   "orderByOrganizationName": "string",
-  //   "signatoryBy": "string",
-  //   "signatoryPosition": "string",
-  //   "examRound": "3fa85f64-5717-4562-b3fc-2c963f66afa6",
-  //   "registerPosition": "string",
-  //   "conclusionRegisterNo": "string",
-  //   "conclusionRegisterDate": "2023-08-21T09:46:54.354Z",
-  //   "conclusionResultNo": "string",
-  //   "conclusionResultDate": "2023-08-21T09:46:54.354Z"
-  // }
-
   if (
     typeOrder.value.commandCode == "C-PM-01" ||
     typeOrder.value.commandCode == "C-PM-02" ||
@@ -369,97 +349,96 @@ const submit = async () => {
       conclusionResultDate: conclusionResultDate.value,
     });
   } else if (
-    typeOrder.value.commandCode == "C-PM-04" ||
-    typeOrder.value.commandCode == "C-PM-05"
+    typeOrder.value.commandCode == "C-PM-05" ||
+    typeOrder.value.commandCode == "C-PM-06"
   ) {
     Object.assign(formdata, {
-      conclusionRegisterNo: conclusion1.value,
-      conclusionRegisterDate: conclusionDate1.value,
-      conclusionResultNo: conclusion2.value,
-      conclusionResultDate: conclusionDate2.value,
-      meeting: meeting.value,
-      dateMeeting: dateMeeting.value,
-    });
-  } else if (typeOrder.value.commandCode == "C-PM-07") {
-    Object.assign(formdata, {
-      conclusionRelocation1: conclusionRelocation1.value,
-      conclusionRelocationDate1: conclusionRelocationDate1.value,
-      conclusionRelocation2: conclusionRelocation2.value,
-      conclusionRelocationDate2: conclusionRelocationDate2.value,
+      conclusionMeetingNo: meeting.value,
+      conclusionMeetingDate: dateMeeting.value,
     });
   } else if (typeOrder.value.commandCode == "C-PM-08") {
     Object.assign(formdata, {
-      conclusion: conclusion.value,
-      conclusionDate: conclusionDate.value,
-      conclusionLeave: conclusionLeave.value,
-      conclusionLeaveDate: conclusionLeaveDate.value,
-      conclusionReceive: conclusionReceive.value,
-      conclusionReceiveDate: conclusionReceiveDate.value,
+      conclusionReturnNo: conclusionReceive.value,
+      conclusionReturnDate: conclusionReceiveDate.value,
     });
   } else if (typeOrder.value.commandCode == "C-PM-09") {
     Object.assign(formdata, {
-      organizations: organizations.value,
-      order: order.value,
-      orderDate: orderDate.value,
-      book: book.value,
-      bookDate: bookDate.value,
+      sourceOrganizationName: organizations.value,
+      conclusionReturnNo: order.value,
+      conclusionReturnDate: orderDate.value,
+      militaryCommandNo: book.value,
+      militaryCommandDate: bookDate.value,
     });
   } else if (typeOrder.value.commandCode == "C-PM-10") {
     Object.assign(formdata, {
-      organizationsOld: organizationsOld.value,
-      orderOld: orderOld.value,
-      orderOldDate: orderOldDate.value,
-      locationname: locationname.value,
-      experimentOc: experimentOc.value,
-      experimentformDate: experimentformDate.value,
-      experimenttoDate: experimenttoDate.value,
-      chairman: chairman.value,
-      director: director.value,
-      director2: director2.value,
+      placementCommandIssuer: organizationsOld.value,
+      placementCommandNo: orderOld.value,
+      placementCommandDate: orderOldDate.value,
+      placementPositionName: locationname.value,
+      placementOrganizationName: experimentOc.value,
+      probationStartDate: experimentformDate.value,
+      probationEndDate: experimenttoDate.value,
+      chairManFullName: chairman.value,
+      member1FullName: director.value,
+      member2FullName: director2.value,
     });
   } else if (
     typeOrder.value.commandCode == "C-PM-11" ||
     typeOrder.value.commandCode == "C-PM-12"
   ) {
     Object.assign(formdata, {
-      committeeOc: committeeOc.value,
-      committeeOrder: committeeOrder.value,
-      committeeDate: committeeDate.value,
+      placementCommandIssuer: committeeOc.value,
+      placementCommandNo: committeeOrder.value,
+      placementCommandDate: committeeDate.value,
     });
   } else if (typeOrder.value.commandCode == "C-PM-13") {
     Object.assign(formdata, {
-      receiveOc: receiveOc.value,
+      receiveOrganizationName: receiveOc.value,
     });
   } else if (typeOrder.value.commandCode == "C-PM-14") {
     Object.assign(formdata, {
-      conclusionReceive: conclusionReceive.value,
+      transferOrganizationName: "",
+      conclusionReceiveNo: conclusionReceive.value,
       conclusionReceiveDate: conclusionReceiveDate.value,
     });
   } else if (typeOrder.value.commandCode == "C-PM-16") {
     Object.assign(formdata, {
-      orderNumber: orderNumber.value,
-      orderNumberDate: orderNumberDate.value,
+      govAidCommandNo: orderNumber.value,
+      govAidCommandDate: orderNumberDate.value,
+    });
+  } else if (
+    typeOrder.value.commandCode == "C-PM-18" ||
+    typeOrder.value.commandCode == "C-PM-19" ||
+    typeOrder.value.commandCode == "C-PM-20"
+  ) {
+    Object.assign(formdata, {
+      fault: "",
+      guiltyBasis: "",
+      conclusionFireNo: "",
+      conclusionFireDate: new Date(),
+      conclusionFireResolution: "",
     });
   }
+
   console.log(formdata);
 
   await myForm.value!.validate().then((result: boolean) => {
     if (result) {
       dialogConfirm($q, () => {
         if (!orderId) {
-          createListOrder(formdata);
+          createListOrder(formdata, typeOrder.value.commandCode);
         } else {
           let orderIdString = orderId.toString();
-          updateOrder(formdata, orderIdString);
+          updateOrder(formdata, orderIdString, typeOrder.value.commandCode);
         }
       });
     }
   });
 };
-const createListOrder = async (formData: Object) => {
+const createListOrder = async (formData: Object, type: string) => {
   showLoader();
   await http
-    .post(config.API.createOrder(), formData)
+    .post(config.API.orderCPM(type), formData)
     .then((res) => {
       const data = res.data.result;
       localStorage.setItem("orderId", data.id);
@@ -474,10 +453,10 @@ const createListOrder = async (formData: Object) => {
       hideLoader();
     });
 };
-const updateOrder = async (formData: Object, orderId: string) => {
+const updateOrder = async (formData: Object, orderId: string, type: string) => {
   showLoader();
   await http
-    .put(config.API.detailOrder(orderId), formData)
+    .put(config.API.orderCPMUpdate(type, orderId), formData)
     .then((res) => {
       console.log(res);
       next();
@@ -508,38 +487,86 @@ const getClass = (val: boolean) => {
     <q-form ref="myForm" class="q-pa-md">
       <div class="row col-12 q-col-gutter-x-lg q-col-gutter-y-md">
         <div class="col-xs-12 col-md-6">
-          <selector :class="getClass(true)" outlined dense lazy-rules v-model="typeOrder"
-            :rules="[(val: string) => !!val || `${'กรุณาเลือกประเภทคำสั่ง'}`]" hide-bottom-space
-            :label="`${'ประเภทคำสั่ง'}`" map-options option-label="fullname" :options="typeOrderOption" option-value="id"
-            use-input input-debounce="0" />
+          <q-select
+            :class="getClass(true)"
+            outlined
+            dense
+            lazy-rules
+            v-model="typeOrder"
+            :rules="[(val: string) => !!val || `${'กรุณาเลือกประเภทคำสั่ง'}`]"
+            hide-bottom-space
+            :label="`${'ประเภทคำสั่ง'}`"
+            map-options
+            option-label="fullname"
+            :options="typeOrderOption"
+            option-value="id"
+            use-input
+            input-debounce="0"
+            @update:model-value="selectCMP(typeOrder)"
+          />
         </div>
         <div class="col-xs-12 col-md-6">
-          <q-input :class="getClass(true)" outlined dense lazy-rules v-model="nameOrder"
-            :rules="[(val) => !!val || `${'กรุณากรอกคำสั่งเรื่อง'}`]" :label="`${'คำสั่งเรื่อง'}`" hide-bottom-space />
+          <q-input
+            :class="getClass(true)"
+            outlined
+            dense
+            lazy-rules
+            v-model="nameOrder"
+            :rules="[(val) => !!val || `${'กรุณากรอกคำสั่งเรื่อง'}`]"
+            :label="`${'คำสั่งเรื่อง'}`"
+            hide-bottom-space
+          />
         </div>
         <div class="row col-xs-7 col-md-3 q-col-gutter-x-xs">
           <div class="col-6">
-            <q-input :class="getClass(true)" outlined dense lazy-rules v-model="command" hide-bottom-space
-              :label="`${'คำสั่งเลขที่'}`" />
+            <q-input
+              :class="getClass(true)"
+              outlined
+              dense
+              lazy-rules
+              v-model="command"
+              hide-bottom-space
+              :label="`${'คำสั่งเลขที่'}`"
+            />
           </div>
-          <label class="col-1 flex justify-center items-center text-bold">/</label>
+          <label class="col-1 flex justify-center items-center text-bold"
+            >/</label
+          >
           <div class="col-5">
-            <datepicker v-model="dateYear" :locale="'th'" autoApply year-picker :enableTimePicker="false">
+            <datepicker
+              v-model="dateYear"
+              :locale="'th'"
+              autoApply
+              year-picker
+              :enableTimePicker="false"
+            >
               <template #year="{ year }">{{ year + 543 }}</template>
               <template #year-overlay-value="{ value }">{{
                 parseInt(value + 543)
               }}</template>
               <template #trigger>
-                <q-input :model-value="dateYear + 543" :rules="[(val) => !!val || `${'กรุณากรอก พ.ศ.'}`]"
-                  :label="`${'พ.ศ.'}`" dense outlined>
+                <q-input
+                  :model-value="dateYear + 543"
+                  :rules="[(val) => !!val || `${'กรุณากรอก พ.ศ.'}`]"
+                  :label="`${'พ.ศ.'}`"
+                  dense
+                  outlined
+                >
                 </q-input>
               </template>
             </datepicker>
           </div>
         </div>
         <div class="col-xs-5 col-md-3">
-          <datepicker menu-class-name="modalfix" v-model="dateCommand" :locale="'th'" autoApply borderless
-            :enableTimePicker="false" week-start="0">
+          <datepicker
+            menu-class-name="modalfix"
+            v-model="dateCommand"
+            :locale="'th'"
+            autoApply
+            borderless
+            :enableTimePicker="false"
+            week-start="0"
+          >
             <template #year="{ year }">
               {{ year + 543 }}
             </template>
@@ -547,10 +574,22 @@ const getClass = (val: boolean) => {
               {{ parseInt(value + 543) }}
             </template>
             <template #trigger>
-              <q-input outlined dense class="full-width datepicker" :model-value="dateCommand != null ? date2Thai(dateCommand) : null
-                " :label="`${'วันที่คำสั่งมีผล'}`" :rules="[(val) => !!val || `${'กรุณาเลือกวันที่คำสั่งมีผล'}`]">
+              <q-input
+                outlined
+                dense
+                class="full-width datepicker"
+                :model-value="
+                  dateCommand != null ? date2Thai(dateCommand) : null
+                "
+                :label="`${'วันที่คำสั่งมีผล'}`"
+                :rules="[(val) => !!val || `${'กรุณาเลือกวันที่คำสั่งมีผล'}`]"
+              >
                 <template v-slot:prepend>
-                  <q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
+                  <q-icon
+                    name="event"
+                    class="cursor-pointer"
+                    style="color: var(--q-primary)"
+                  >
                   </q-icon>
                 </template>
               </q-input>
@@ -558,16 +597,42 @@ const getClass = (val: boolean) => {
           </datepicker>
         </div>
         <div class="col-xs-12 col-md-6">
-          <selector :class="getClass(true)" outlined dense lazy-rules v-model="byOrder"
-            :rules="[(val: string) => !!val || `${'กรุณาเลือกคำสั่งโดย'}`]" emit-value hide-bottom-space
-            :label="`${'คำสั่งโดย'}`" map-options option-label="name" :options="byOrderOption" option-value="id" use-input
-            input-debounce="0" @update:model-value="(nameCommand = ''), (positionCommand = ''), (console.log(byOrder))" />
+          <selector
+            :class="getClass(true)"
+            outlined
+            dense
+            lazy-rules
+            v-model="byOrder"
+            :rules="[(val: string) => !!val || `${'กรุณาเลือกคำสั่งโดย'}`]"
+            emit-value
+            hide-bottom-space
+            :label="`${'คำสั่งโดย'}`"
+            map-options
+            option-label="name"
+            :options="byOrderOption"
+            option-value="id"
+            use-input
+            input-debounce="0"
+            @update:model-value="(nameCommand = ''), (positionCommand = '')"
+          />
         </div>
         <div class="col-xs-12 col-md-6">
-          <selector :class="getClass(true)" outlined dense lazy-rules v-model="nameCommand"
-            :rules="[(val: string) => !!val || `${'กรุณาเลือกผู้มีอำนาจลงนาม'}`]" hide-bottom-space
-            :label="`${'ผู้มีอำนาจลงนาม'}`" map-options option-label="name" :options="CommandOption" option-value="id"
-            use-input input-debounce="0">
+          <selector
+            :class="getClass(true)"
+            outlined
+            dense
+            lazy-rules
+            v-model="nameCommand"
+            :rules="[(val: string) => !!val || `${'กรุณาเลือกผู้มีอำนาจลงนาม'}`]"
+            hide-bottom-space
+            :label="`${'ผู้มีอำนาจลงนาม'}`"
+            map-options
+            option-label="name"
+            :options="CommandOption"
+            option-value="id"
+            use-input
+            input-debounce="0"
+          >
             <template v-if="CommandOption.length === 0" v-slot:no-option>
               <q-item>
                 <q-item-section class="text-primary">
@@ -589,31 +654,67 @@ const getClass = (val: boolean) => {
           /> -->
         </div>
         <div class="col-xs-12 col-md-6">
-          <q-input :class="getClass(true)" outlined dense lazy-rules v-model="positionCommand"
-            :rules="[(val) => !!val || `${'กรุณากรอกตำแหน่งผู้มีอำนาจลงนาม'}`]" :label="`${'ตำแหน่งผู้มีอำนาจลงนาม'}`"
-            hide-bottom-space disable />
+          <q-input
+            :class="getClass(true)"
+            outlined
+            dense
+            lazy-rules
+            v-model="positionCommand"
+            :rules="[(val) => !!val || `${'กรุณากรอกตำแหน่งผู้มีอำนาจลงนาม'}`]"
+            :label="`${'ตำแหน่งผู้มีอำนาจลงนาม'}`"
+            hide-bottom-space
+            disable
+          />
         </div>
         <div class="col-12">
           <q-separator v-if="typeOrder.commandCode" />
         </div>
 
         <!-- C-PM-01-04 -->
-        <div class="row col-12 q-col-gutter-x-lg q-col-gutter-y-md" v-if="typeOrder.commandCode === 'C-PM-01' ||
-          typeOrder.commandCode === 'C-PM-02' ||
-          typeOrder.commandCode === 'C-PM-03' ||
-          typeOrder.commandCode === 'C-PM-04'
-          ">
+        <div
+          class="row col-12 q-col-gutter-x-lg q-col-gutter-y-md"
+          v-if="
+            typeOrder.commandCode === 'C-PM-01' ||
+            typeOrder.commandCode === 'C-PM-02' ||
+            typeOrder.commandCode === 'C-PM-03' ||
+            typeOrder.commandCode === 'C-PM-04'
+          "
+        >
           <div class="col-xs-12 col-md-12">
-            <selector :class="getClass(true)" outlined dense lazy-rules v-model="examRound"
-              :rules="[(val: string) => !!val || `${'กรุณาเลือกรอบการสอบ'}`]" hide-bottom-space :label="`${'รอบการสอบ'}`"
-              emit-value map-options option-label="examRoundName" :options="examRoundOption" option-value="examRoundValue"
-              use-input input-debounce="0" />
+            <selector
+              :class="getClass(true)"
+              outlined
+              dense
+              lazy-rules
+              v-model="examRound"
+              :rules="[(val: string) => !!val || `${'กรุณาเลือกรอบการสอบ'}`]"
+              hide-bottom-space
+              :label="`${'รอบการสอบ'}`"
+              emit-value
+              map-options
+              option-label="examRoundName"
+              :options="examRoundOption"
+              option-value="examRoundValue"
+              use-input
+              input-debounce="0"
+            />
           </div>
 
           <div class="col-xs-12 col-md-6">
-            <q-input :class="getClass(true)" outlined dense lazy-rules v-model="conclusionRegisterNo"
-              :rules="[(val) => !!val || `${'กรุณากรอกมติ กก. ครั้งที่ (เรื่อง รับสมัครสอบฯ)'}`]"
-              :label="`${'มติ กก. ครั้งที่ (เรื่อง รับสมัครสอบฯ)'}`" hide-bottom-space />
+            <q-input
+              :class="getClass(true)"
+              outlined
+              dense
+              lazy-rules
+              v-model="conclusionRegisterNo"
+              :rules="[
+                (val) =>
+                  !!val ||
+                  `${'กรุณากรอกมติ กก. ครั้งที่ (เรื่อง รับสมัครสอบฯ)'}`,
+              ]"
+              :label="`${'มติ กก. ครั้งที่ (เรื่อง รับสมัครสอบฯ)'}`"
+              hide-bottom-space
+            />
 
             <!-- <selector :class="getClass(true)" outlined dense lazy-rules v-model="conclusionRegisterNo"
               :rules="[(val: string) => !!val || `${'กรุณาเลือกมติ กก. ครั้งที่ (เรื่อง รับสมัครสอบฯ)'}`]"
@@ -621,8 +722,15 @@ const getClass = (val: boolean) => {
               option-label="name" :options="registerOption" option-value="id" use-input input-debounce="0" /> -->
           </div>
           <div class="col-xs-12 col-md-6">
-            <datepicker menu-class-name="modalfix" v-model="conclusionRegisterDate" :locale="'th'" autoApply borderless
-              :enableTimePicker="false" week-start="0">
+            <datepicker
+              menu-class-name="modalfix"
+              v-model="conclusionRegisterDate"
+              :locale="'th'"
+              autoApply
+              borderless
+              :enableTimePicker="false"
+              week-start="0"
+            >
               <template #year="{ year }">
                 {{ year + 543 }}
               </template>
@@ -630,15 +738,27 @@ const getClass = (val: boolean) => {
                 {{ parseInt(value + 543) }}
               </template>
               <template #trigger>
-                <q-input outlined dense class="full-width datepicker" :model-value="conclusionRegisterDate != null
-                  ? date2Thai(conclusionRegisterDate)
-                  : null
-                  " :label="`${'ลงวันที่ (เรื่อง รับสมัครสอบฯ)'}`" :rules="[
-    (val) =>
-      !!val || `${'กรุณาเลือกลงวันที่ (เรื่อง รับสมัครสอบฯ)'}`,
-  ]">
+                <q-input
+                  outlined
+                  dense
+                  class="full-width datepicker"
+                  :model-value="
+                    conclusionRegisterDate != null
+                      ? date2Thai(conclusionRegisterDate)
+                      : null
+                  "
+                  :label="`${'ลงวันที่ (เรื่อง รับสมัครสอบฯ)'}`"
+                  :rules="[
+                    (val) =>
+                      !!val || `${'กรุณาเลือกลงวันที่ (เรื่อง รับสมัครสอบฯ)'}`,
+                  ]"
+                >
                   <template v-slot:prepend>
-                    <q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
+                    <q-icon
+                      name="event"
+                      class="cursor-pointer"
+                      style="color: var(--q-primary)"
+                    >
                     </q-icon>
                   </template>
                 </q-input>
@@ -646,9 +766,19 @@ const getClass = (val: boolean) => {
             </datepicker>
           </div>
           <div class="col-xs-12 col-md-6">
-            <q-input :class="getClass(true)" outlined dense lazy-rules v-model="conclusionResultNo"
-              :rules="[(val) => !!val || `${'กรุณากรอกมติ กก. ครั้งที่ (เรื่อง ผลการสอบฯ)'}`]"
-              :label="`${'มติ กก. ครั้งที่ (เรื่อง ผลการสอบฯ)'}`" hide-bottom-space />
+            <q-input
+              :class="getClass(true)"
+              outlined
+              dense
+              lazy-rules
+              v-model="conclusionResultNo"
+              :rules="[
+                (val) =>
+                  !!val || `${'กรุณากรอกมติ กก. ครั้งที่ (เรื่อง ผลการสอบฯ)'}`,
+              ]"
+              :label="`${'มติ กก. ครั้งที่ (เรื่อง ผลการสอบฯ)'}`"
+              hide-bottom-space
+            />
 
             <!-- <selector :class="getClass(true)" outlined dense lazy-rules v-model="conclusionResultNo"
               :rules="[(val: string) => !!val || `${'กรุณาเลือกมติ กก. ครั้งที่ (เรื่อง ผลการสอบแข่งขัน)'}`]"
@@ -656,8 +786,15 @@ const getClass = (val: boolean) => {
               option-label="name" :options="announceOption" option-value="id" use-input input-debounce="0" /> -->
           </div>
           <div class="col-xs-12 col-md-6">
-            <datepicker menu-class-name="modalfix" v-model="conclusionResultDate" :locale="'th'" autoApply borderless
-              :enableTimePicker="false" week-start="0">
+            <datepicker
+              menu-class-name="modalfix"
+              v-model="conclusionResultDate"
+              :locale="'th'"
+              autoApply
+              borderless
+              :enableTimePicker="false"
+              week-start="0"
+            >
               <template #year="{ year }">
                 {{ year + 543 }}
               </template>
@@ -665,15 +802,27 @@ const getClass = (val: boolean) => {
                 {{ parseInt(value + 543) }}
               </template>
               <template #trigger>
-                <q-input outlined dense class="full-width datepicker" :model-value="conclusionResultDate != null
-                  ? date2Thai(conclusionResultDate)
-                  : null
-                  " :label="`${'ลงวันที่ (เรื่อง ผลการสอบฯ)'}`" :rules="[
-    (val) =>
-      !!val || `${'กรุณาเลือกลงวันที่ (เรื่อง ผลการสอบฯ)'}`,
-  ]">
+                <q-input
+                  outlined
+                  dense
+                  class="full-width datepicker"
+                  :model-value="
+                    conclusionResultDate != null
+                      ? date2Thai(conclusionResultDate)
+                      : null
+                  "
+                  :label="`${'ลงวันที่ (เรื่อง ผลการสอบฯ)'}`"
+                  :rules="[
+                    (val) =>
+                      !!val || `${'กรุณาเลือกลงวันที่ (เรื่อง ผลการสอบฯ)'}`,
+                  ]"
+                >
                   <template v-slot:prepend>
-                    <q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
+                    <q-icon
+                      name="event"
+                      class="cursor-pointer"
+                      style="color: var(--q-primary)"
+                    >
                     </q-icon>
                   </template>
                 </q-input>
@@ -683,22 +832,40 @@ const getClass = (val: boolean) => {
         </div>
 
         <!-- C-PM-05-06 -->
-        <div class="row col-12 q-col-gutter-x-lg q-col-gutter-y-md" v-if="typeOrder.commandCode === 'C-PM-05' ||
-          typeOrder.commandCode === 'C-PM-06'
-          ">
-          <div class="col-xs-12 col-md-6">
-            <q-input :class="getClass(true)" outlined dense lazy-rules v-model="conclusion1"
-              :rules="[(val) => !!val || `${'กรุณากรอกมติ กก. ครั้งที่'}`]" :label="`${'มติ กก. ครั้งที่'}`"
-              hide-bottom-space />
+        <div
+          class="row col-12 q-col-gutter-x-lg q-col-gutter-y-md"
+          v-if="
+            typeOrder.commandCode === 'C-PM-05' ||
+            typeOrder.commandCode === 'C-PM-06'
+          "
+        >
+          <!-- <div class="col-xs-12 col-md-6">
+            <q-input
+              :class="getClass(true)"
+              outlined
+              dense
+              lazy-rules
+              v-model="conclusion1"
+              :rules="[(val) => !!val || `${'กรุณากรอกมติ กก. ครั้งที่'}`]"
+              :label="`${'มติ กก. ครั้งที่'}`"
+              hide-bottom-space
+            /> -->
 
-            <!-- <selector :class="getClass(true)" outlined dense lazy-rules v-model="conclusion1"
+          <!-- <selector :class="getClass(true)" outlined dense lazy-rules v-model="conclusion1"
               :rules="[(val: string) => !!val || `${'กรุณาเลือกมติ กก. ครั้งที่ '}`]" hide-bottom-space
               :label="`${'มติ กก. ครั้งที่'}`" emit-value map-options option-label="name" :options="conclusion1Option"
               option-value="id" use-input input-debounce="0" /> -->
-          </div>
-          <div class="col-xs-12 col-md-6">
-            <datepicker menu-class-name="modalfix" v-model="conclusionDate1" :locale="'th'" autoApply borderless
-              :enableTimePicker="false" week-start="0">
+          <!-- </div> -->
+          <!-- <div class="col-xs-12 col-md-6">
+            <datepicker
+              menu-class-name="modalfix"
+              v-model="conclusionDate1"
+              :locale="'th'"
+              autoApply
+              borderless
+              :enableTimePicker="false"
+              week-start="0"
+            >
               <template #year="{ year }">
                 {{ year + 543 }}
               </template>
@@ -706,26 +873,52 @@ const getClass = (val: boolean) => {
                 {{ parseInt(value + 543) }}
               </template>
               <template #trigger>
-                <q-input outlined dense class="full-width datepicker" :model-value="conclusionDate1 != null ? date2Thai(conclusionDate1) : null
-                  " :label="`${'ลงวันที่ '}`" :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่ '}`]">
+                <q-input
+                  outlined
+                  dense
+                  class="full-width datepicker"
+                  :model-value="
+                    conclusionDate1 != null ? date2Thai(conclusionDate1) : null
+                  "
+                  :label="`${'ลงวันที่ '}`"
+                  :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่ '}`]"
+                >
                   <template v-slot:prepend>
-                    <q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
+                    <q-icon
+                      name="event"
+                      class="cursor-pointer"
+                      style="color: var(--q-primary)"
+                    >
                     </q-icon>
                   </template>
                 </q-input>
               </template>
             </datepicker>
-          </div>
-          <div class="col-xs-12 col-md-6">
-            <q-input :class="getClass(true)" outlined dense lazy-rules v-model="conclusion2"
-              :rules="[(val) => !!val || `${'กรุณากรอกมติ กก. ครั้งที่'}`]" :label="`${'มติ กก. ครั้งที่'}`"
-              hide-bottom-space />
+          </div> -->
+          <!-- <div class="col-xs-12 col-md-6">
+            <q-input
+              :class="getClass(true)"
+              outlined
+              dense
+              lazy-rules
+              v-model="conclusion2"
+              :rules="[(val) => !!val || `${'กรุณากรอกมติ กก. ครั้งที่'}`]"
+              :label="`${'มติ กก. ครั้งที่'}`"
+              hide-bottom-space
+            /> -->
 
-            <!-- <selector :class="getClass(true)" outlined dense lazy-rules v-model="conclusion2" :rules="[(val: string) => !!val || `${'กรุณาเลือกมติ กก. ครั้งที่ '}`]" hide-bottom-space :label="`${'มติ กก. ครั้งที่ '}`" emit-value map-options option-label="name" :options="conclusion2Option" option-value="id" use-input input-debounce="0" /> -->
-          </div>
-          <div class="col-xs-12 col-md-6">
-            <datepicker menu-class-name="modalfix" v-model="conclusionDate2" :locale="'th'" autoApply borderless
-              :enableTimePicker="false" week-start="0">
+          <!-- <selector :class="getClass(true)" outlined dense lazy-rules v-model="conclusion2" :rules="[(val: string) => !!val || `${'กรุณาเลือกมติ กก. ครั้งที่ '}`]" hide-bottom-space :label="`${'มติ กก. ครั้งที่ '}`" emit-value map-options option-label="name" :options="conclusion2Option" option-value="id" use-input input-debounce="0" /> -->
+          <!-- </div> -->
+          <!-- <div class="col-xs-12 col-md-6">
+            <datepicker
+              menu-class-name="modalfix"
+              v-model="conclusionDate2"
+              :locale="'th'"
+              autoApply
+              borderless
+              :enableTimePicker="false"
+              week-start="0"
+            >
               <template #year="{ year }">
                 {{ year + 543 }}
               </template>
@@ -733,20 +926,39 @@ const getClass = (val: boolean) => {
                 {{ parseInt(value + 543) }}
               </template>
               <template #trigger>
-                <q-input outlined dense class="full-width datepicker" :model-value="conclusionDate2 != null ? date2Thai(conclusionDate2) : null
-                  " :label="`${'ลงวันที่ '}`" :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่ '}`]">
+                <q-input
+                  outlined
+                  dense
+                  class="full-width datepicker"
+                  :model-value="
+                    conclusionDate2 != null ? date2Thai(conclusionDate2) : null
+                  "
+                  :label="`${'ลงวันที่ '}`"
+                  :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่ '}`]"
+                >
                   <template v-slot:prepend>
-                    <q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
+                    <q-icon
+                      name="event"
+                      class="cursor-pointer"
+                      style="color: var(--q-primary)"
+                    >
                     </q-icon>
                   </template>
                 </q-input>
               </template>
             </datepicker>
-          </div>
+          </div> -->
           <div class="col-xs-12 col-md-6">
-            <q-input :class="getClass(true)" outlined dense lazy-rules v-model="conclusionReceive"
-              :rules="[(val) => !!val || `${'กรุณากรอกการประชุม ครั้งที่'}`]" :label="`${'การประชุม ครั้งที่'}`"
-              hide-bottom-space />
+            <q-input
+              :class="getClass(true)"
+              outlined
+              dense
+              lazy-rules
+              v-model="meeting"
+              :rules="[(val) => !!val || `${'กรุณากรอกการประชุม ครั้งที่'}`]"
+              :label="`${'การประชุม ครั้งที่'}`"
+              hide-bottom-space
+            />
 
             <!-- <selector :class="getClass(true)" outlined dense lazy-rules v-model="meeting"
               :rules="[(val: string) => !!val || `${'กรุณาเลือกการประชุม ครั้งที่ '}`]" hide-bottom-space
@@ -754,8 +966,15 @@ const getClass = (val: boolean) => {
               option-value="id" use-input input-debounce="0" /> -->
           </div>
           <div class="col-xs-12 col-md-6">
-            <datepicker menu-class-name="modalfix" v-model="dateMeeting" :locale="'th'" autoApply borderless
-              :enableTimePicker="false" week-start="0">
+            <datepicker
+              menu-class-name="modalfix"
+              v-model="dateMeeting"
+              :locale="'th'"
+              autoApply
+              borderless
+              :enableTimePicker="false"
+              week-start="0"
+            >
               <template #year="{ year }">
                 {{ year + 543 }}
               </template>
@@ -763,10 +982,22 @@ const getClass = (val: boolean) => {
                 {{ parseInt(value + 543) }}
               </template>
               <template #trigger>
-                <q-input outlined dense class="full-width datepicker" :model-value="dateMeeting != null ? date2Thai(dateMeeting) : null
-                  " :label="`${'ลงวันที่ '}`" :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่ '}`]">
+                <q-input
+                  outlined
+                  dense
+                  class="full-width datepicker"
+                  :model-value="
+                    dateMeeting != null ? date2Thai(dateMeeting) : null
+                  "
+                  :label="`${'ลงวันที่ '}`"
+                  :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่ '}`]"
+                >
                   <template v-slot:prepend>
-                    <q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
+                    <q-icon
+                      name="event"
+                      class="cursor-pointer"
+                      style="color: var(--q-primary)"
+                    >
                     </q-icon>
                   </template>
                 </q-input>
@@ -776,17 +1007,32 @@ const getClass = (val: boolean) => {
         </div>
 
         <!-- C-PM-07 -->
-        <div class="row col-12 q-col-gutter-x-lg q-col-gutter-y-md" v-if="typeOrder.commandCode === 'C-PM-07'">
+        <!-- <div
+          class="row col-12 q-col-gutter-x-lg q-col-gutter-y-md"
+          v-if="typeOrder.commandCode === 'C-PM-07'"
+        >
           <div class="col-xs-12 col-md-6">
-            <q-input :class="getClass(true)" outlined dense lazy-rules v-model="conclusionRelocation1"
-              :rules="[(val) => !!val || `${'กรุณากรอกมติ กก. ครั้งที่'}`]" :label="`${'มติ กก. ครั้งที่'}`"
-              hide-bottom-space />
-
-            <!-- <selector :class="getClass(true)" outlined dense lazy-rules v-model="conclusionRelocation1" :rules="[(val: string) => !!val || `${'กรุณาเลือกมติ กก. ครั้งที่ '}`]" hide-bottom-space :label="`${'มติ กก. ครั้งที่'}`" emit-value map-options option-label="name" :options="RelocationOption1" option-value="id" use-input input-debounce="0" /> -->
+            <q-input
+              :class="getClass(true)"
+              outlined
+              dense
+              lazy-rules
+              v-model="conclusionRelocation1"
+              :rules="[(val) => !!val || `${'กรุณากรอกมติ กก. ครั้งที่'}`]"
+              :label="`${'มติ กก. ครั้งที่'}`"
+              hide-bottom-space
+            />
           </div>
           <div class="col-xs-12 col-md-6">
-            <datepicker menu-class-name="modalfix" v-model="conclusionRelocationDate1" :locale="'th'" autoApply borderless
-              :enableTimePicker="false" week-start="0">
+            <datepicker
+              menu-class-name="modalfix"
+              v-model="conclusionRelocationDate1"
+              :locale="'th'"
+              autoApply
+              borderless
+              :enableTimePicker="false"
+              week-start="0"
+            >
               <template #year="{ year }">
                 {{ year + 543 }}
               </template>
@@ -794,12 +1040,24 @@ const getClass = (val: boolean) => {
                 {{ parseInt(value + 543) }}
               </template>
               <template #trigger>
-                <q-input outlined dense class="full-width datepicker" :model-value="conclusionRelocationDate1 != null
-                  ? date2Thai(conclusionRelocationDate1)
-                  : null
-                  " :label="`${'ลงวันที่ '}`" :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่ '}`]">
+                <q-input
+                  outlined
+                  dense
+                  class="full-width datepicker"
+                  :model-value="
+                    conclusionRelocationDate1 != null
+                      ? date2Thai(conclusionRelocationDate1)
+                      : null
+                  "
+                  :label="`${'ลงวันที่ '}`"
+                  :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่ '}`]"
+                >
                   <template v-slot:prepend>
-                    <q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
+                    <q-icon
+                      name="event"
+                      class="cursor-pointer"
+                      style="color: var(--q-primary)"
+                    >
                     </q-icon>
                   </template>
                 </q-input>
@@ -807,15 +1065,27 @@ const getClass = (val: boolean) => {
             </datepicker>
           </div>
           <div class="col-xs-12 col-md-6">
-            <q-input :class="getClass(true)" outlined dense lazy-rules v-model="conclusionRelocation2"
-              :rules="[(val) => !!val || `${'กรุณากรอกมติ กก. ครั้งที่'}`]" :label="`${'มติ กก. ครั้งที่'}`"
-              hide-bottom-space />
-
-            <!-- <selector :class="getClass(true)" outlined dense lazy-rules v-model="conclusionRelocation2" :rules="[(val: string) => !!val || `${'กรุณาเลือกมติ กก. ครั้งที่ '}`]" hide-bottom-space :label="`${'มติ กก. ครั้งที่ '}`" emit-value map-options option-label="name" :options="RelocationOption2" option-value="id" use-input input-debounce="0" /> -->
+            <q-input
+              :class="getClass(true)"
+              outlined
+              dense
+              lazy-rules
+              v-model="conclusionRelocation2"
+              :rules="[(val) => !!val || `${'กรุณากรอกมติ กก. ครั้งที่'}`]"
+              :label="`${'มติ กก. ครั้งที่'}`"
+              hide-bottom-space
+            />
           </div>
           <div class="col-xs-12 col-md-6">
-            <datepicker menu-class-name="modalfix" v-model="conclusionRelocationDate2" :locale="'th'" autoApply borderless
-              :enableTimePicker="false" week-start="0">
+            <datepicker
+              menu-class-name="modalfix"
+              v-model="conclusionRelocationDate2"
+              :locale="'th'"
+              autoApply
+              borderless
+              :enableTimePicker="false"
+              week-start="0"
+            >
               <template #year="{ year }">
                 {{ year + 543 }}
               </template>
@@ -823,32 +1093,59 @@ const getClass = (val: boolean) => {
                 {{ parseInt(value + 543) }}
               </template>
               <template #trigger>
-                <q-input outlined dense class="full-width datepicker" :model-value="conclusionRelocationDate2 != null
-                  ? date2Thai(conclusionRelocationDate2)
-                  : null
-                  " :label="`${'ลงวันที่ '}`" :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่ '}`]">
+                <q-input
+                  outlined
+                  dense
+                  class="full-width datepicker"
+                  :model-value="
+                    conclusionRelocationDate2 != null
+                      ? date2Thai(conclusionRelocationDate2)
+                      : null
+                  "
+                  :label="`${'ลงวันที่ '}`"
+                  :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่ '}`]"
+                >
                   <template v-slot:prepend>
-                    <q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
+                    <q-icon
+                      name="event"
+                      class="cursor-pointer"
+                      style="color: var(--q-primary)"
+                    >
                     </q-icon>
                   </template>
                 </q-input>
               </template>
             </datepicker>
           </div>
-        </div>
+        </div> -->
 
         <!-- C-PM-08 -->
-        <div class="row col-12 q-col-gutter-x-lg q-col-gutter-y-md" v-if="typeOrder.commandCode === 'C-PM-08'">
-          <div class="col-xs-12 col-md-6">
-            <q-input :class="getClass(true)" outlined dense lazy-rules v-model="conclusion"
-              :rules="[(val) => !!val || `${'กรุณากรอกมติ กก. ครั้งที่'}`]" :label="`${'มติ กก. ครั้งที่'}`"
-              hide-bottom-space />
-
-            <!-- <selector :class="getClass(true)" outlined dense lazy-rules v-model="conclusion" :rules="[(val: string) => !!val || `${'กรุณาเลือกมติ กก. ครั้งที่ '}`]" hide-bottom-space :label="`${'มติ กก. ครั้งที่'}`" emit-value map-options option-label="name" :options="conclusionOption" option-value="id" use-input input-debounce="0" /> -->
-          </div>
-          <div class="col-xs-12 col-md-6">
-            <datepicker menu-class-name="modalfix" v-model="conclusionDate" :locale="'th'" autoApply borderless
-              :enableTimePicker="false" week-start="0">
+        <div
+          class="row col-12 q-col-gutter-x-lg q-col-gutter-y-md"
+          v-if="typeOrder.commandCode === 'C-PM-08'"
+        >
+          <!-- <div class="col-xs-12 col-md-6">
+            <q-input
+              :class="getClass(true)"
+              outlined
+              dense
+              lazy-rules
+              v-model="conclusion"
+              :rules="[(val) => !!val || `${'กรุณากรอกมติ กก. ครั้งที่'}`]"
+              :label="`${'มติ กก. ครั้งที่'}`"
+              hide-bottom-space
+            />
+          </div> -->
+          <!-- <div class="col-xs-12 col-md-6">
+            <datepicker
+              menu-class-name="modalfix"
+              v-model="conclusionDate"
+              :locale="'th'"
+              autoApply
+              borderless
+              :enableTimePicker="false"
+              week-start="0"
+            >
               <template #year="{ year }">
                 {{ year + 543 }}
               </template>
@@ -856,26 +1153,54 @@ const getClass = (val: boolean) => {
                 {{ parseInt(value + 543) }}
               </template>
               <template #trigger>
-                <q-input outlined dense class="full-width datepicker" :model-value="conclusionDate != null ? date2Thai(conclusionDate) : null
-                  " :label="`${'ลงวันที่ '}`" :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่ '}`]">
+                <q-input
+                  outlined
+                  dense
+                  class="full-width datepicker"
+                  :model-value="
+                    conclusionDate != null ? date2Thai(conclusionDate) : null
+                  "
+                  :label="`${'ลงวันที่ '}`"
+                  :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่ '}`]"
+                >
                   <template v-slot:prepend>
-                    <q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
+                    <q-icon
+                      name="event"
+                      class="cursor-pointer"
+                      style="color: var(--q-primary)"
+                    >
                     </q-icon>
                   </template>
                 </q-input>
               </template>
             </datepicker>
-          </div>
-          <div class="col-xs-12 col-md-6">
-            <q-input :class="getClass(true)" outlined dense lazy-rules v-model="conclusionLeave"
-              :rules="[(val) => !!val || `${'กรุณากรอกมติ กก. ครั้งที่ (เรื่อง ออกจากราชการ)'}`]"
-              :label="`${'มติ กก. ครั้งที่ (เรื่อง ออกจากราชการ)'}`" hide-bottom-space />
-
-            <!-- <selector :class="getClass(true)" outlined dense lazy-rules v-model="conclusionLeave" :rules="[(val: string) => !!val || `${'กรุณาเลือกมติ กก. ครั้งที่ (เรื่องราชการออกจากราชการไปแล้ว)'}`]" hide-bottom-space :label="`${'มติ กก. ครั้งที่ (เรื่องราชการออกจากราชการไปแล้ว) '}`" emit-value map-options option-label="name" :options="LeaveOption" option-value="id" use-input input-debounce="0" /> -->
-          </div>
-          <div class="col-xs-12 col-md-6">
-            <datepicker menu-class-name="modalfix" v-model="conclusionLeaveDate" :locale="'th'" autoApply borderless
-              :enableTimePicker="false" week-start="0">
+          </div> -->
+          <!-- <div class="col-xs-12 col-md-6">
+            <q-input
+              :class="getClass(true)"
+              outlined
+              dense
+              lazy-rules
+              v-model="conclusionLeave"
+              :rules="[
+                (val) =>
+                  !!val ||
+                  `${'กรุณากรอกมติ กก. ครั้งที่ (เรื่อง ออกจากราชการ)'}`,
+              ]"
+              :label="`${'มติ กก. ครั้งที่ (เรื่อง ออกจากราชการ)'}`"
+              hide-bottom-space
+            />
+          </div> -->
+          <!-- <div class="col-xs-12 col-md-6">
+            <datepicker
+              menu-class-name="modalfix"
+              v-model="conclusionLeaveDate"
+              :locale="'th'"
+              autoApply
+              borderless
+              :enableTimePicker="false"
+              week-start="0"
+            >
               <template #year="{ year }">
                 {{ year + 543 }}
               </template>
@@ -883,26 +1208,48 @@ const getClass = (val: boolean) => {
                 {{ parseInt(value + 543) }}
               </template>
               <template #trigger>
-                <q-input outlined dense class="full-width datepicker" :model-value="conclusionLeaveDate != null
-                  ? date2Thai(conclusionLeaveDate)
-                  : null
-                  " :label="`${'ลงวันที่ (เรื่อง ออกจากราชการ)'}`" :rules="[
-    (val) =>
-      !!val ||
-      `${'กรุณาเลือกลงวันที่ (เรื่อง ออกจากราชการ)'}`,
-  ]">
+                <q-input
+                  outlined
+                  dense
+                  class="full-width datepicker"
+                  :model-value="
+                    conclusionLeaveDate != null
+                      ? date2Thai(conclusionLeaveDate)
+                      : null
+                  "
+                  :label="`${'ลงวันที่ (เรื่อง ออกจากราชการ)'}`"
+                  :rules="[
+                    (val) =>
+                      !!val || `${'กรุณาเลือกลงวันที่ (เรื่อง ออกจากราชการ)'}`,
+                  ]"
+                >
                   <template v-slot:prepend>
-                    <q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
+                    <q-icon
+                      name="event"
+                      class="cursor-pointer"
+                      style="color: var(--q-primary)"
+                    >
                     </q-icon>
                   </template>
                 </q-input>
               </template>
             </datepicker>
-          </div>
+          </div> -->
           <div class="col-xs-12 col-md-6">
-            <q-input :class="getClass(true)" outlined dense lazy-rules v-model="conclusionReceive"
-              :rules="[(val) => !!val || `${'กรุณากรอกมติ กก. ครั้งที่ (เรื่อง กลับเข้าราชการ)'}`]"
-              :label="`${'มติ กก. ครั้งที่ (เรื่อง กลับเข้าราชการ)'}`" hide-bottom-space />
+            <q-input
+              :class="getClass(true)"
+              outlined
+              dense
+              lazy-rules
+              v-model="conclusionReceive"
+              :rules="[
+                (val) =>
+                  !!val ||
+                  `${'กรุณากรอกมติ กก. ครั้งที่ (เรื่อง กลับเข้าราชการ)'}`,
+              ]"
+              :label="`${'มติ กก. ครั้งที่ (เรื่อง กลับเข้าราชการ)'}`"
+              hide-bottom-space
+            />
 
             <!-- <selector :class="getClass(true)" outlined dense lazy-rules v-model="conclusionReceive"
               :rules="[(val: string) => !!val || `${'มติ กก. ครั้งที่ (กลับเข้าราชการ)'}`]" hide-bottom-space
@@ -910,8 +1257,15 @@ const getClass = (val: boolean) => {
               :options="ReceiveOption" option-value="id" use-input input-debounce="0" /> -->
           </div>
           <div class="col-xs-12 col-md-6">
-            <datepicker menu-class-name="modalfix" v-model="conclusionReceiveDate" :locale="'th'" autoApply borderless
-              :enableTimePicker="false" week-start="0">
+            <datepicker
+              menu-class-name="modalfix"
+              v-model="conclusionReceiveDate"
+              :locale="'th'"
+              autoApply
+              borderless
+              :enableTimePicker="false"
+              week-start="0"
+            >
               <template #year="{ year }">
                 {{ year + 543 }}
               </template>
@@ -919,12 +1273,24 @@ const getClass = (val: boolean) => {
                 {{ parseInt(value + 543) }}
               </template>
               <template #trigger>
-                <q-input outlined dense class="full-width datepicker" :model-value="conclusionReceiveDate != null
-                  ? date2Thai(conclusionReceiveDate)
-                  : null
-                  " :label="`${'ลงวันที่ '}`" :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่ '}`]">
+                <q-input
+                  outlined
+                  dense
+                  class="full-width datepicker"
+                  :model-value="
+                    conclusionReceiveDate != null
+                      ? date2Thai(conclusionReceiveDate)
+                      : null
+                  "
+                  :label="`${'ลงวันที่ '}`"
+                  :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่ '}`]"
+                >
                   <template v-slot:prepend>
-                    <q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
+                    <q-icon
+                      name="event"
+                      class="cursor-pointer"
+                      style="color: var(--q-primary)"
+                    >
                     </q-icon>
                   </template>
                 </q-input>
@@ -934,16 +1300,50 @@ const getClass = (val: boolean) => {
         </div>
 
         <!-- C-PM-09 -->
-        <div class="row col-12 q-col-gutter-x-lg q-col-gutter-y-md" v-if="typeOrder.commandCode === 'C-PM-09'">
+        <div
+          class="row col-12 q-col-gutter-x-lg q-col-gutter-y-md"
+          v-if="typeOrder.commandCode === 'C-PM-09'"
+        >
           <div class="col-xs-12 col-md-12">
-            <selector :class="getClass(true)" outlined dense lazy-rules v-model="organizations"
-              :rules="[(val: string) => !!val || `${'กรุณาเลือกหน่วยงาน'}`]" hide-bottom-space
-              :label="`${'ชื่อหน่วยงาน'}`" emit-value map-options option-label="name" :options="organizationsOption"
-              option-value="id" use-input input-debounce="0" />
+            <q-input
+              :class="getClass(true)"
+              outlined
+              dense
+              lazy-rules
+              v-model="organizations"
+              :rules="[(val) => !!val || `${'กรุณากกรอกหน่วยงาน'}`]"
+              :label="`${'หน่วยงาน'}`"
+              hide-bottom-space
+            />
+            <!-- <selector
+              :class="getClass(true)"
+              outlined
+              dense
+              lazy-rules
+              v-model="organizations"
+              :rules="[(val: string) => !!val || `${'กรุณาเลือกหน่วยงาน'}`]"
+              hide-bottom-space
+              :label="`${'ชื่อหน่วยงาน'}`"
+              emit-value
+              map-options
+              option-label="name"
+              :options="organizationsOption"
+              option-value="id"
+              use-input
+              input-debounce="0"
+            /> -->
           </div>
           <div class="col-xs-12 col-md-6">
-            <q-input :class="getClass(true)" outlined dense lazy-rules v-model="order"
-              :rules="[(val) => !!val || `${'กรุณาเลือกคำสั่งที่'}`]" :label="`${'คำสั่งที่'}`" hide-bottom-space />
+            <q-input
+              :class="getClass(true)"
+              outlined
+              dense
+              lazy-rules
+              v-model="order"
+              :rules="[(val) => !!val || `${'กรุณาเลือกคำสั่งที่'}`]"
+              :label="`${'คำสั่งที่'}`"
+              hide-bottom-space
+            />
 
             <!-- <selector :class="getClass(true)" outlined dense lazy-rules v-model="order"
               :rules="[(val: string) => !!val || `${'กรุณาเลือกคำสั่งที่'}`]" hide-bottom-space :label="`${'คำสั่งที่'}`"
@@ -951,8 +1351,15 @@ const getClass = (val: boolean) => {
               input-debounce="0" /> -->
           </div>
           <div class="col-xs-12 col-md-6">
-            <datepicker menu-class-name="modalfix" v-model="orderDate" :locale="'th'" autoApply borderless
-              :enableTimePicker="false" week-start="0">
+            <datepicker
+              menu-class-name="modalfix"
+              v-model="orderDate"
+              :locale="'th'"
+              autoApply
+              borderless
+              :enableTimePicker="false"
+              week-start="0"
+            >
               <template #year="{ year }">
                 {{ year + 543 }}
               </template>
@@ -960,11 +1367,20 @@ const getClass = (val: boolean) => {
                 {{ parseInt(value + 543) }}
               </template>
               <template #trigger>
-                <q-input outlined dense class="full-width datepicker"
-                  :model-value="orderDate != null ? date2Thai(orderDate) : null" :label="`${'ลงวันที่ '}`"
-                  :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่ '}`]">
+                <q-input
+                  outlined
+                  dense
+                  class="full-width datepicker"
+                  :model-value="orderDate != null ? date2Thai(orderDate) : null"
+                  :label="`${'ลงวันที่ '}`"
+                  :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่ '}`]"
+                >
                   <template v-slot:prepend>
-                    <q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
+                    <q-icon
+                      name="event"
+                      class="cursor-pointer"
+                      style="color: var(--q-primary)"
+                    >
                     </q-icon>
                   </template>
                 </q-input>
@@ -972,14 +1388,46 @@ const getClass = (val: boolean) => {
             </datepicker>
           </div>
           <div class="col-xs-12 col-md-6">
-            <selector :class="getClass(true)" outlined dense lazy-rules v-model="book"
-              :rules="[(val: string) => !!val || `${'กรุณาเลือก หนังสือสำนักงาน ก.พ. ที่ นร'}`]" hide-bottom-space
-              :label="`${'หนังสือสำนักงาน ก.พ. ที่ นร'}`" emit-value map-options option-label="name" :options="bookOption"
-              option-value="id" use-input input-debounce="0" />
+            <!-- <selector
+              :class="getClass(true)"
+              outlined
+              dense
+              lazy-rules
+              v-model="book"
+              :rules="[(val: string) => !!val || `${'กรุณาเลือก หนังสือสำนักงาน ก.พ. ที่ นร'}`]"
+              hide-bottom-space
+              :label="`${'หนังสือสำนักงาน ก.พ. ที่ นร'}`"
+              emit-value
+              map-options
+              option-label="name"
+              :options="bookOption"
+              option-value="id"
+              use-input
+              input-debounce="0"
+            /> -->
+            <q-input
+              :class="getClass(true)"
+              outlined
+              dense
+              lazy-rules
+              v-model="book"
+              :rules="[
+                (val) => !!val || `${'กรุณากกรอกหนังสือสำนักงาน ก.พ. ที่ นร'}`,
+              ]"
+              :label="`${'หนังสือสำนักงาน ก.พ. ที่ นร'}`"
+              hide-bottom-space
+            />
           </div>
           <div class="col-xs-12 col-md-6">
-            <datepicker menu-class-name="modalfix" v-model="bookDate" :locale="'th'" autoApply borderless
-              :enableTimePicker="false" week-start="0">
+            <datepicker
+              menu-class-name="modalfix"
+              v-model="bookDate"
+              :locale="'th'"
+              autoApply
+              borderless
+              :enableTimePicker="false"
+              week-start="0"
+            >
               <template #year="{ year }">
                 {{ year + 543 }}
               </template>
@@ -987,11 +1435,20 @@ const getClass = (val: boolean) => {
                 {{ parseInt(value + 543) }}
               </template>
               <template #trigger>
-                <q-input outlined dense class="full-width datepicker"
-                  :model-value="bookDate != null ? date2Thai(bookDate) : null" :label="`${'ลงวันที่'}`"
-                  :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่ '}`]">
+                <q-input
+                  outlined
+                  dense
+                  class="full-width datepicker"
+                  :model-value="bookDate != null ? date2Thai(bookDate) : null"
+                  :label="`${'ลงวันที่'}`"
+                  :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่ '}`]"
+                >
                   <template v-slot:prepend>
-                    <q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
+                    <q-icon
+                      name="event"
+                      class="cursor-pointer"
+                      style="color: var(--q-primary)"
+                    >
                     </q-icon>
                   </template>
                 </q-input>
@@ -1001,17 +1458,50 @@ const getClass = (val: boolean) => {
         </div>
 
         <!-- C-PM-10 -->
-        <div class="row col-12 q-col-gutter-x-lg q-col-gutter-y-md" v-if="typeOrder.commandCode === 'C-PM-10'">
+        <div
+          class="row col-12 q-col-gutter-x-lg q-col-gutter-y-md"
+          v-if="typeOrder.commandCode === 'C-PM-10'"
+        >
           <div class="col-xs-12 col-md-4">
-            <selector :class="getClass(true)" outlined dense lazy-rules v-model="organizationsOld"
-              :rules="[(val: string) => !!val || `${'กรุณาเลือกหน่วยงาน (ต้นทาง)'}`]" hide-bottom-space
-              :label="`${'ชื่อหน่วยงาน (ต้นทาง)'}`" emit-value map-options option-label="name"
-              :options="organizationsOldOption" option-value="id" use-input input-debounce="0" />
+            <!-- <selector
+              :class="getClass(true)"
+              outlined
+              dense
+              lazy-rules
+              v-model="organizationsOld"
+              :rules="[(val: string) => !!val || `${'กรุณาเลือกหน่วยงาน (ต้นทาง)'}`]"
+              hide-bottom-space
+              :label="`${'ชื่อหน่วยงาน (ต้นทาง)'}`"
+              emit-value
+              map-options
+              option-label="name"
+              :options="organizationsOldOption"
+              option-value="id"
+              use-input
+              input-debounce="0"
+            /> -->
+            <q-input
+              :class="getClass(true)"
+              outlined
+              dense
+              lazy-rules
+              v-model="organizationsOld"
+              :rules="[(val) => !!val || `${'กรุณากรอกหน่วยงาน  (ต้นทาง)'}`]"
+              :label="`${'ชื่อหน่วยงาน (ต้นทาง'}`"
+              hide-bottom-space
+            />
           </div>
           <div class="col-xs-12 col-md-4">
-            <q-input :class="getClass(true)" outlined dense lazy-rules v-model="orderOld"
-              :rules="[(val) => !!val || `${'กรุณาเลือกคำสั่งที่ (ต้นทาง)'}`]" :label="`${'คำสั่งที่ (ต้นทาง)'}`"
-              hide-bottom-space />
+            <q-input
+              :class="getClass(true)"
+              outlined
+              dense
+              lazy-rules
+              v-model="orderOld"
+              :rules="[(val) => !!val || `${'กรุณาเลือกคำสั่งที่ (ต้นทาง)'}`]"
+              :label="`${'คำสั่งที่ (ต้นทาง)'}`"
+              hide-bottom-space
+            />
 
             <!-- <selector :class="getClass(true)" outlined dense lazy-rules v-model="orderOld"
               :rules="[(val: string) => !!val || `${'กรุณาเลือกคำสั่งที่ (ต้นทาง)'}`]" hide-bottom-space
@@ -1019,8 +1509,15 @@ const getClass = (val: boolean) => {
               option-value="id" use-input input-debounce="0" /> -->
           </div>
           <div class="col-xs-12 col-md-4">
-            <datepicker menu-class-name="modalfix" v-model="orderOldDate" :locale="'th'" autoApply borderless
-              :enableTimePicker="false" week-start="0">
+            <datepicker
+              menu-class-name="modalfix"
+              v-model="orderOldDate"
+              :locale="'th'"
+              autoApply
+              borderless
+              :enableTimePicker="false"
+              week-start="0"
+            >
               <template #year="{ year }">
                 {{ year + 543 }}
               </template>
@@ -1028,10 +1525,22 @@ const getClass = (val: boolean) => {
                 {{ parseInt(value + 543) }}
               </template>
               <template #trigger>
-                <q-input outlined dense class="full-width datepicker" :model-value="orderOldDate != null ? date2Thai(orderOldDate) : null
-                  " :label="`${'ลงวันที่ '}`" :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่ '}`]">
+                <q-input
+                  outlined
+                  dense
+                  class="full-width datepicker"
+                  :model-value="
+                    orderOldDate != null ? date2Thai(orderOldDate) : null
+                  "
+                  :label="`${'ลงวันที่ '}`"
+                  :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่ '}`]"
+                >
                   <template v-slot:prepend>
-                    <q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
+                    <q-icon
+                      name="event"
+                      class="cursor-pointer"
+                      style="color: var(--q-primary)"
+                    >
                     </q-icon>
                   </template>
                 </q-input>
@@ -1039,23 +1548,46 @@ const getClass = (val: boolean) => {
             </datepicker>
           </div>
           <div class="col-xs-12 col-md-4">
-            <q-input :class="getClass(true)" outlined dense lazy-rules v-model="locationname"
-              :rules="[(val) => !!val || `${'กรุณากรอกให้ดำรงตำแหน่ง ณ'}`]" :label="`${'ให้ดำรงตำแหน่ง ณ'}`"
-              hide-bottom-space />
+            <q-input
+              :class="getClass(true)"
+              outlined
+              dense
+              lazy-rules
+              v-model="locationname"
+              :rules="[(val) => !!val || `${'กรุณากรอกให้ดำรงตำแหน่ง ณ'}`]"
+              :label="`${'ให้ดำรงตำแหน่ง ณ'}`"
+              hide-bottom-space
+            />
           </div>
 
           <div class="col-xs-12 col-md-4">
-            <q-input :class="getClass(true)" outlined dense lazy-rules v-model="experimentOc" :rules="[
-              (val) =>
-                !!val ||
-                `${'กรุณากรอกหน่วยงานที่ให้ทดลองปฏิบัติหน้าที่ราชการ'}`,
-            ]" :label="`${'หน่วยงานที่ให้ทดลองปฏิบัติหน้าที่ราชการ'}`" hide-bottom-space />
+            <q-input
+              :class="getClass(true)"
+              outlined
+              dense
+              lazy-rules
+              v-model="experimentOc"
+              :rules="[
+                (val) =>
+                  !!val ||
+                  `${'กรุณากรอกหน่วยงานที่ให้ทดลองปฏิบัติหน้าที่ราชการ'}`,
+              ]"
+              :label="`${'หน่วยงานที่ให้ทดลองปฏิบัติหน้าที่ราชการ'}`"
+              hide-bottom-space
+            />
           </div>
           <div class="col-md-4"></div>
 
           <div class="col-xs-12 col-md-4">
-            <datepicker menu-class-name="modalfix" v-model="experimentformDate" :locale="'th'" autoApply borderless
-              :enableTimePicker="false" week-start="0">
+            <datepicker
+              menu-class-name="modalfix"
+              v-model="experimentformDate"
+              :locale="'th'"
+              autoApply
+              borderless
+              :enableTimePicker="false"
+              week-start="0"
+            >
               <template #year="{ year }">
                 {{ year + 543 }}
               </template>
@@ -1063,16 +1595,28 @@ const getClass = (val: boolean) => {
                 {{ parseInt(value + 543) }}
               </template>
               <template #trigger>
-                <q-input outlined dense class="full-width datepicker" :model-value="experimentformDate != null
-                  ? date2Thai(experimentformDate)
-                  : null
-                  " :label="`${'ทดลองปฏิบัติหน้าที่ราชการตั้งแต่วันที่ '}`" :rules="[
-    (val) =>
-      !!val ||
-      `${'กรุณาเลือกลงวันที่ทดลองปฏิบัติหน้าที่ราชการตั้งแต่วันที่ '}`,
-  ]">
+                <q-input
+                  outlined
+                  dense
+                  class="full-width datepicker"
+                  :model-value="
+                    experimentformDate != null
+                      ? date2Thai(experimentformDate)
+                      : null
+                  "
+                  :label="`${'ทดลองปฏิบัติหน้าที่ราชการตั้งแต่วันที่ '}`"
+                  :rules="[
+                    (val) =>
+                      !!val ||
+                      `${'กรุณาเลือกลงวันที่ทดลองปฏิบัติหน้าที่ราชการตั้งแต่วันที่ '}`,
+                  ]"
+                >
                   <template v-slot:prepend>
-                    <q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
+                    <q-icon
+                      name="event"
+                      class="cursor-pointer"
+                      style="color: var(--q-primary)"
+                    >
                     </q-icon>
                   </template>
                 </q-input>
@@ -1081,8 +1625,15 @@ const getClass = (val: boolean) => {
           </div>
 
           <div class="col-xs-12 col-md-4">
-            <datepicker menu-class-name="modalfix" v-model="experimenttoDate" :locale="'th'" autoApply borderless
-              :enableTimePicker="false" week-start="0">
+            <datepicker
+              menu-class-name="modalfix"
+              v-model="experimenttoDate"
+              :locale="'th'"
+              autoApply
+              borderless
+              :enableTimePicker="false"
+              week-start="0"
+            >
               <template #year="{ year }">
                 {{ year + 543 }}
               </template>
@@ -1090,14 +1641,28 @@ const getClass = (val: boolean) => {
                 {{ parseInt(value + 543) }}
               </template>
               <template #trigger>
-                <q-input outlined dense class="full-width datepicker" :model-value="experimenttoDate != null ? date2Thai(experimenttoDate) : null
-                  " :label="`${'ทดลองปฏิบัติหน้าที่ราชการถึงวันที่ '}`" :rules="[
-    (val) =>
-      !!val ||
-      `${'กรุณาเลือกลงวันที่ทดลองปฏิบัติหน้าที่ราชการถึงวันที่ '}`,
-  ]">
+                <q-input
+                  outlined
+                  dense
+                  class="full-width datepicker"
+                  :model-value="
+                    experimenttoDate != null
+                      ? date2Thai(experimenttoDate)
+                      : null
+                  "
+                  :label="`${'ทดลองปฏิบัติหน้าที่ราชการถึงวันที่ '}`"
+                  :rules="[
+                    (val) =>
+                      !!val ||
+                      `${'กรุณาเลือกลงวันที่ทดลองปฏิบัติหน้าที่ราชการถึงวันที่ '}`,
+                  ]"
+                >
                   <template v-slot:prepend>
-                    <q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
+                    <q-icon
+                      name="event"
+                      class="cursor-pointer"
+                      style="color: var(--q-primary)"
+                    >
                     </q-icon>
                   </template>
                 </q-input>
@@ -1107,33 +1672,115 @@ const getClass = (val: boolean) => {
           <div class="col-md-4"></div>
 
           <div class="col-xs-12 col-md-4">
-            <selector :class="getClass(true)" outlined dense lazy-rules v-model="chairman"
-              :rules="[(val: string) => !!val || `${'กรุณาเลือกประธาน'}`]" hide-bottom-space :label="`${'ประธาน'}`"
-              emit-value map-options option-label="name" :options="chairmanOption" option-value="id" use-input
-              input-debounce="0" />
+            <!-- <selector
+              :class="getClass(true)"
+              outlined
+              dense
+              lazy-rules
+              v-model="chairman"
+              :rules="[(val: string) => !!val || `${'กรุณาเลือกประธาน'}`]"
+              hide-bottom-space
+              :label="`${'ประธาน'}`"
+              emit-value
+              map-options
+              option-label="name"
+              :options="chairmanOption"
+              option-value="id"
+              use-input
+              input-debounce="0"
+            /> -->
+            <q-input
+              :class="getClass(true)"
+              outlined
+              dense
+              lazy-rules
+              v-model="chairman"
+              :rules="[(val) => !!val || `${'กรุณากรอกชื่อประธาน)'}`]"
+              :label="`${'ประธาน'}`"
+              hide-bottom-space
+            />
           </div>
           <div class="col-xs-12 col-md-4">
-            <selector :class="getClass(true)" outlined dense lazy-rules v-model="director"
-              :rules="[(val: string) => !!val || `${'กรุณาเลือกกรรมการ'}`]" hide-bottom-space :label="`${'กรรมการ'}`"
-              emit-value map-options option-label="name" :options="directorOption" option-value="id" use-input
-              input-debounce="0" />
+            <!-- <selector
+              :class="getClass(true)"
+              outlined
+              dense
+              lazy-rules
+              v-model="director"
+              :rules="[(val: string) => !!val || `${'กรุณาเลือกกรรมการ'}`]"
+              hide-bottom-space
+              :label="`${'กรรมการ'}`"
+              emit-value
+              map-options
+              option-label="name"
+              :options="directorOption"
+              option-value="id"
+              use-input
+              input-debounce="0"
+            /> -->
+            <q-input
+              :class="getClass(true)"
+              outlined
+              dense
+              lazy-rules
+              v-model="director"
+              :rules="[(val) => !!val || `${'กรุณากรอกชื่อกรรมการ)'}`]"
+              :label="`${'กรรมการ'}`"
+              hide-bottom-space
+            />
           </div>
           <div class="col-xs-12 col-md-4">
-            <selector :class="getClass(true)" outlined dense lazy-rules v-model="director2"
-              :rules="[(val: string) => !!val || `${'กรุณาเลือกกรรมการ'}`]" hide-bottom-space :label="`${'กรรมการ'}`"
-              emit-value map-options option-label="name" :options="director2Option" option-value="id" use-input
-              input-debounce="0" />
+            <!-- <selector
+              :class="getClass(true)"
+              outlined
+              dense
+              lazy-rules
+              v-model="director2"
+              :rules="[(val: string) => !!val || `${'กรุณาเลือกกรรมการ'}`]"
+              hide-bottom-space
+              :label="`${'กรรมการ'}`"
+              emit-value
+              map-options
+              option-label="name"
+              :options="director2Option"
+              option-value="id"
+              use-input
+              input-debounce="0"
+            /> -->
+            <q-input
+              :class="getClass(true)"
+              outlined
+              dense
+              lazy-rules
+              v-model="director2"
+              :rules="[(val) => !!val || `${'กรุณากรอกชื่อกรรมการ)'}`]"
+              :label="`${'กรรมการ'}`"
+              hide-bottom-space
+            />
           </div>
         </div>
 
         <!-- C-PM-11 - 12 -->
-        <div class="row col-12 q-col-gutter-x-lg q-col-gutter-y-md" v-if="typeOrder.commandCode === 'C-PM-11' ||
-          typeOrder.commandCode === 'C-PM-12'
-          ">
+        <div
+          class="row col-12 q-col-gutter-x-lg q-col-gutter-y-md"
+          v-if="
+            typeOrder.commandCode === 'C-PM-11' ||
+            typeOrder.commandCode === 'C-PM-12'
+          "
+        >
           <div class="col-xs-12 col-md-4">
-            <q-input :class="getClass(true)" outlined dense lazy-rules v-model="committeeOc"
-              :rules="[(val) => !!val || `${'กรุณาเลือกชื่อหน่วยงาน (อนุสนธิคำสั่ง)'}`]"
-              :label="`${'ชื่อหน่วยงาน (อนุสนธิคำสั่ง)'}`" hide-bottom-space />
+            <q-input
+              :class="getClass(true)"
+              outlined
+              dense
+              lazy-rules
+              v-model="committeeOc"
+              :rules="[
+                (val) => !!val || `${'กรุณาเลือกชื่อหน่วยงาน (อนุสนธิคำสั่ง)'}`,
+              ]"
+              :label="`${'ชื่อหน่วยงาน (อนุสนธิคำสั่ง)'}`"
+              hide-bottom-space
+            />
 
             <!-- <selector :class="getClass(true)" outlined dense lazy-rules v-model="committeeOc"
               :rules="[(val: string) => !!val || `${'กรุณาเลือกหน่วยงาน (อนุสนธิคำสั่ง)'}`]" hide-bottom-space
@@ -1141,9 +1788,16 @@ const getClass = (val: boolean) => {
               :options="committeeOcOption" option-value="id" use-input input-debounce="0" /> -->
           </div>
           <div class="col-xs-12 col-md-4">
-            <q-input :class="getClass(true)" outlined dense lazy-rules v-model="committeeOrder"
-              :rules="[(val) => !!val || `${'กรุณาเลือกอนุสนธิคำสั่งที่'}`]" :label="`${'อนุสนธิคำสั่งที่'}`"
-              hide-bottom-space />
+            <q-input
+              :class="getClass(true)"
+              outlined
+              dense
+              lazy-rules
+              v-model="committeeOrder"
+              :rules="[(val) => !!val || `${'กรุณาเลือกอนุสนธิคำสั่งที่'}`]"
+              :label="`${'อนุสนธิคำสั่งที่'}`"
+              hide-bottom-space
+            />
 
             <!-- <selector :class="getClass(true)" outlined dense lazy-rules v-model="committeeOrder"
               :rules="[(val: string) => !!val || `${'กรุณาเลือกอนุสนธิคำสั่งที่'}`]" hide-bottom-space
@@ -1151,8 +1805,15 @@ const getClass = (val: boolean) => {
               option-value="id" use-input input-debounce="0" /> -->
           </div>
           <div class="col-xs-12 col-md-4">
-            <datepicker menu-class-name="modalfix" v-model="committeeDate" :locale="'th'" autoApply borderless
-              :enableTimePicker="false" week-start="0">
+            <datepicker
+              menu-class-name="modalfix"
+              v-model="committeeDate"
+              :locale="'th'"
+              autoApply
+              borderless
+              :enableTimePicker="false"
+              week-start="0"
+            >
               <template #year="{ year }">
                 {{ year + 543 }}
               </template>
@@ -1160,10 +1821,22 @@ const getClass = (val: boolean) => {
                 {{ parseInt(value + 543) }}
               </template>
               <template #trigger>
-                <q-input outlined dense class="full-width datepicker" :model-value="committeeDate != null ? date2Thai(committeeDate) : null
-                  " :label="`${'ลงวันที่ '}`" :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่ '}`]">
+                <q-input
+                  outlined
+                  dense
+                  class="full-width datepicker"
+                  :model-value="
+                    committeeDate != null ? date2Thai(committeeDate) : null
+                  "
+                  :label="`${'ลงวันที่ '}`"
+                  :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่ '}`]"
+                >
                   <template v-slot:prepend>
-                    <q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
+                    <q-icon
+                      name="event"
+                      class="cursor-pointer"
+                      style="color: var(--q-primary)"
+                    >
                     </q-icon>
                   </template>
                 </q-input>
@@ -1173,10 +1846,21 @@ const getClass = (val: boolean) => {
         </div>
 
         <!-- C-PM-13 -->
-        <div class="row col-6 q-col-gutter-x-lg q-col-gutter-y-md" v-if="typeOrder.commandCode === 'C-PM-13'">
+        <div
+          class="row col-6 q-col-gutter-x-lg q-col-gutter-y-md"
+          v-if="typeOrder.commandCode === 'C-PM-13'"
+        >
           <div class="col-xs-12 col-md-12">
-            <q-input :class="getClass(true)" outlined dense lazy-rules v-model="receiveOc"
-              :rules="[(val) => !!val || `${'กรุณาเลือกชื่อหน่วยงาน'}`]" :label="`${'ชื่อหน่วยงาน'}`" hide-bottom-space />
+            <q-input
+              :class="getClass(true)"
+              outlined
+              dense
+              lazy-rules
+              v-model="receiveOc"
+              :rules="[(val) => !!val || `${'กรุณาเลือกชื่อหน่วยงาน'}`]"
+              :label="`${'ชื่อหน่วยงาน'}`"
+              hide-bottom-space
+            />
 
             <!-- <selector :class="getClass(true)" outlined dense lazy-rules v-model="receiveOc"
               :rules="[(val: string) => !!val || `${'กรุณาเลือกหน่วยงาน'}`]" hide-bottom-space
@@ -1186,11 +1870,21 @@ const getClass = (val: boolean) => {
         </div>
 
         <!-- C-PM-14 -->
-        <div class="row col-12 q-col-gutter-x-lg q-col-gutter-y-md" v-if="typeOrder.commandCode === 'C-PM-14'">
+        <div
+          class="row col-12 q-col-gutter-x-lg q-col-gutter-y-md"
+          v-if="typeOrder.commandCode === 'C-PM-14'"
+        >
           <div class="col-xs-12 col-md-6">
-            <q-input :class="getClass(true)" outlined dense lazy-rules v-model="conclusionReceive"
-              :rules="[(val) => !!val || `${'กรุณากรอกมติ กก. ครั้งที่'}`]" :label="`${'มติ กก. ครั้งที่'}`"
-              hide-bottom-space />
+            <q-input
+              :class="getClass(true)"
+              outlined
+              dense
+              lazy-rules
+              v-model="conclusionReceive"
+              :rules="[(val) => !!val || `${'กรุณากรอกมติ กก. ครั้งที่'}`]"
+              :label="`${'มติ กก. ครั้งที่'}`"
+              hide-bottom-space
+            />
 
             <!-- <selector :class="getClass(true)" outlined dense lazy-rules v-model="conclusionReceive"
               :rules="[(val: string) => !!val || `${'มติ กก. ครั้งที่ '}`]" hide-bottom-space
@@ -1198,8 +1892,15 @@ const getClass = (val: boolean) => {
               option-value="id" use-input input-debounce="0" /> -->
           </div>
           <div class="col-xs-12 col-md-6">
-            <datepicker menu-class-name="modalfix" v-model="conclusionReceiveDate" :locale="'th'" autoApply borderless
-              :enableTimePicker="false" week-start="0">
+            <datepicker
+              menu-class-name="modalfix"
+              v-model="conclusionReceiveDate"
+              :locale="'th'"
+              autoApply
+              borderless
+              :enableTimePicker="false"
+              week-start="0"
+            >
               <template #year="{ year }">
                 {{ year + 543 }}
               </template>
@@ -1207,12 +1908,24 @@ const getClass = (val: boolean) => {
                 {{ parseInt(value + 543) }}
               </template>
               <template #trigger>
-                <q-input outlined dense class="full-width datepicker" :model-value="conclusionReceiveDate != null
-                  ? date2Thai(conclusionReceiveDate)
-                  : null
-                  " :label="`${'ลงวันที่ '}`" :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่ '}`]">
+                <q-input
+                  outlined
+                  dense
+                  class="full-width datepicker"
+                  :model-value="
+                    conclusionReceiveDate != null
+                      ? date2Thai(conclusionReceiveDate)
+                      : null
+                  "
+                  :label="`${'ลงวันที่ '}`"
+                  :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่ '}`]"
+                >
                   <template v-slot:prepend>
-                    <q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
+                    <q-icon
+                      name="event"
+                      class="cursor-pointer"
+                      style="color: var(--q-primary)"
+                    >
                     </q-icon>
                   </template>
                 </q-input>
@@ -1222,15 +1935,34 @@ const getClass = (val: boolean) => {
         </div>
 
         <!-- C-PM-16 -->
-        <div class="row col-12 q-col-gutter-x-lg q-col-gutter-y-md" v-if="typeOrder.commandCode === 'C-PM-16'">
+        <div
+          class="row col-12 q-col-gutter-x-lg q-col-gutter-y-md"
+          v-if="typeOrder.commandCode === 'C-PM-16'"
+        >
           <div class="col-xs-12 col-md-6">
-            <q-input :class="getClass(true)" outlined dense lazy-rules v-model="orderNumber" :rules="[
-              (val) => !!val || `${'กรุณากรอกคำสั่งให้ช่วยราชการเลขที่'}`,
-            ]" :label="`${'คำสั่งให้ช่วยราชการเลขที่'}`" hide-bottom-space />
+            <q-input
+              :class="getClass(true)"
+              outlined
+              dense
+              lazy-rules
+              v-model="orderNumber"
+              :rules="[
+                (val) => !!val || `${'กรุณากรอกคำสั่งให้ช่วยราชการเลขที่'}`,
+              ]"
+              :label="`${'คำสั่งให้ช่วยราชการเลขที่'}`"
+              hide-bottom-space
+            />
           </div>
           <div class="col-xs-12 col-md-6">
-            <datepicker menu-class-name="modalfix" v-model="orderNumberDate" :locale="'th'" autoApply borderless
-              :enableTimePicker="false" week-start="0">
+            <datepicker
+              menu-class-name="modalfix"
+              v-model="orderNumberDate"
+              :locale="'th'"
+              autoApply
+              borderless
+              :enableTimePicker="false"
+              week-start="0"
+            >
               <template #year="{ year }">
                 {{ year + 543 }}
               </template>
@@ -1238,10 +1970,22 @@ const getClass = (val: boolean) => {
                 {{ parseInt(value + 543) }}
               </template>
               <template #trigger>
-                <q-input outlined dense class="full-width datepicker" :model-value="orderNumberDate != null ? date2Thai(orderNumberDate) : null
-                  " :label="`${'ลงวันที่ '}`" :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่ '}`]">
+                <q-input
+                  outlined
+                  dense
+                  class="full-width datepicker"
+                  :model-value="
+                    orderNumberDate != null ? date2Thai(orderNumberDate) : null
+                  "
+                  :label="`${'ลงวันที่ '}`"
+                  :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่ '}`]"
+                >
                   <template v-slot:prepend>
-                    <q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
+                    <q-icon
+                      name="event"
+                      class="cursor-pointer"
+                      style="color: var(--q-primary)"
+                    >
                     </q-icon>
                   </template>
                 </q-input>