diff --git a/src/modules/15_development/components/FormHistory.vue b/src/modules/15_development/components/FormHistory.vue
index d871308ab..a1ae652ee 100644
--- a/src/modules/15_development/components/FormHistory.vue
+++ b/src/modules/15_development/components/FormHistory.vue
@@ -8,6 +8,8 @@ const dateHisStart = defineModel<Date | null>("dateHisStart", {
 });
 const dateHisEnd = defineModel<Date | null>("dateHisEnd", { required: true });
 const trainingDays = defineModel<string>("trainingDays", { required: true });
+const order = defineModel<string>("order", { required: true });
+const dateOrder = defineModel<Date | null>("dateOrder", { required: true });
 </script>
 <template>
   <q-card flat bordered class="q-mt-md bg-grey-1">
@@ -59,6 +61,53 @@ const trainingDays = defineModel<string>("trainingDays", { required: true });
           label="จำนวนวันที่อบรม"
         ></q-input>
       </div>
+      <div class="col-4">
+        <q-input
+          readonly
+          label="เลขที่คำสั่ง/เลขที่หนังสืออนุมัติ"
+          v-model="order"
+          dense
+          outlined
+          bg-color="white"
+        />
+      </div>
+      <div class="col-4">
+        <datepicker
+          readonly
+          v-model="dateOrder"
+          :locale="'th'"
+          autoApply
+          borderless
+          :enableTimePicker="false"
+          week-start="0"
+        >
+          <template #year="{ year }">
+            {{ year + 543 }}
+          </template>
+          <template #year-overlay-value="{ value }">
+            {{ parseInt(value + 543) }}
+          </template>
+          <template #trigger>
+            <q-input
+              readonly
+              bg-color="white"
+              outlined
+              dense
+              :model-value="dateOrder != null ? date2Thai(dateOrder) : null"
+              label="คำสั่งลงวันที่/หนังสืออนุมัติลงวันที่"
+            >
+              <template v-slot:prepend>
+                <q-icon
+                  name="event"
+                  class="cursor-pointer"
+                  style="color: var(--q-primary)"
+                >
+                </q-icon>
+              </template>
+            </q-input>
+          </template>
+        </datepicker>
+      </div>
     </q-card-section>
   </q-card>
 </template>
diff --git a/src/modules/15_development/components/history/AddPage.vue b/src/modules/15_development/components/history/AddPage.vue
index 391288ef3..a7876af7d 100644
--- a/src/modules/15_development/components/history/AddPage.vue
+++ b/src/modules/15_development/components/history/AddPage.vue
@@ -413,58 +413,9 @@ onMounted(async () => {
         :date-his-start="dateHisStart"
         :date-his-end="dateHisEnd"
         :training-days="trainingDays"
+        :order="order"
+        :date-order="dateOrder"
       />
-      <div class="row q-col-gutter-sm q-mt-sm">
-        <div class="col-3">
-          <q-input
-            readonly
-            label="เลขที่คำสั่ง/เลขที่หนังสืออนุมัติ"
-            v-model="order"
-            dense
-            outlined
-            hide-bottom-space
-          />
-          <!-- :rules="[(val:string) => !!val || `${'กรุณากรอกเลขที่คำสั่ง/เลขที่หนังสืออนุมัติ'}`,]" -->
-        </div>
-        <div class="col-3">
-          <datepicker
-            readonly
-            v-model="dateOrder"
-            :locale="'th'"
-            autoApply
-            borderless
-            :enableTimePicker="false"
-            week-start="0"
-          >
-            <template #year="{ year }">
-              {{ year + 543 }}
-            </template>
-            <template #year-overlay-value="{ value }">
-              {{ parseInt(value + 543) }}
-            </template>
-            <!-- :rules="[(val:string) => !!val || `${'กรุณากรอกคำสั่งลงวันที่/หนังสืออนุมัติลงวันที่'}`,]" -->
-            <template #trigger>
-              <q-input
-                readonly
-                outlined
-                dense
-                hide-bottom-space
-                :model-value="dateOrder != null ? date2Thai(dateOrder) : null"
-                label="คำสั่งลงวันที่/หนังสืออนุมัติลงวันที่"
-              >
-                <template v-slot:prepend>
-                  <q-icon
-                    name="event"
-                    class="cursor-pointer"
-                    style="color: var(--q-primary)"
-                  >
-                  </q-icon>
-                </template>
-              </q-input>
-            </template>
-          </datepicker>
-        </div>
-      </div>
     </q-card-section>
   </q-card>
 </template>
diff --git a/src/modules/15_development/components/historyEmployee/AddPage.vue b/src/modules/15_development/components/historyEmployee/AddPage.vue
index be35eed17..7392364f1 100644
--- a/src/modules/15_development/components/historyEmployee/AddPage.vue
+++ b/src/modules/15_development/components/historyEmployee/AddPage.vue
@@ -32,7 +32,7 @@ const order = ref<string>("");
 
 const dateHisStart = ref<Date | null>(null);
 const dateHisEnd = ref<Date | null>(null);
-const trainingDays = ref<string>('');
+const trainingDays = ref<string>("");
 
 /** ตัวแปรข้อมูลข้าราชการ */
 const formMain = reactive<FormAddHistoryEmployee>({
@@ -415,58 +415,9 @@ onMounted(() => {
         :date-his-start="dateHisStart"
         :date-his-end="dateHisEnd"
         :training-days="trainingDays"
+        :order="order"
+        :date-order="dateOrder"
       />
-      <div class="row q-col-gutter-sm q-mt-sm">
-        <div class="col-3">
-          <q-input
-            readonly
-            label="เลขที่คำสั่ง/เลขที่หนังสืออนุมัติ"
-            v-model="order"
-            dense
-            outlined
-            hide-bottom-space
-            :rules="[(val:string) => !!val || `${'กรุณากรอกเลขที่คำสั่ง/เลขที่หนังสืออนุมัติ'}`,]"
-          />
-        </div>
-        <div class="col-3">
-          <datepicker
-            readonly
-            v-model="dateOrder"
-            :locale="'th'"
-            autoApply
-            borderless
-            :enableTimePicker="false"
-            week-start="0"
-          >
-            <template #year="{ year }">
-              {{ year + 543 }}
-            </template>
-            <template #year-overlay-value="{ value }">
-              {{ parseInt(value + 543) }}
-            </template>
-            <template #trigger>
-              <q-input
-                readonly
-                outlined
-                dense
-                hide-bottom-space
-                :model-value="dateOrder != null ? date2Thai(dateOrder) : null"
-                :rules="[(val:string) => !!val || `${'กรุณากรอกคำสั่งลงวันที่/หนังสืออนุมัติลงวันที่'}`,]"
-                label="คำสั่งลงวันที่/หนังสืออนุมัติลงวันที่"
-              >
-                <template v-slot:prepend>
-                  <q-icon
-                    name="event"
-                    class="cursor-pointer"
-                    style="color: var(--q-primary)"
-                  >
-                  </q-icon>
-                </template>
-              </q-input>
-            </template>
-          </datepicker>
-        </div>
-      </div>
     </q-card-section>
   </q-card>
 </template>