ปรับการกรอกวันที่ การลา , ,ปฏิบัติราชการพิเศษ ,วันที่ไม่ได้รับเงินเดือน ,อื่นๆ

src/modules/04_registry/components/Record.vue

@@ -65,7 +65,18 @@
         <q-card-section class="q-p-sm">
           <div class="row col-12 q-col-gutter-x-xs q-col-gutter-y-xs">
             <div class="col-xs-6 col-sm-6 col-md-6">
+              <q-input
+                v-if="edit"
+                outlined
+                v-model="inputDate"
+                label="วัน/เดือน/ปี"
+                mask="##/##/####"
+                dense
+                :rules="[(val) => !!val || `${'กรุณาเลือกวัน เดือน ปี'}`]"
+              />
+
               <datepicker
+                v-else
                 menu-class-name="modalfix"
                 :readonly="!edit"
                 v-model="date"
@@ -162,7 +173,17 @@
               </q-input>
             </div>
             <div class="col-xs-6 col-sm-6 col-md-6">
+              <q-input
+                v-if="edit"
+                outlined
+                v-model="inputDateRefCommandDate"
+                :label="`${'เอกสารอ้างอิง (ลงวันที่)'}`"
+                mask="##/##/####"
+                dense
+              />
+
               <datepicker
+                v-else
                 menu-class-name="modalfix"
                 :readonly="!edit"
                 v-model="refCommandDate"
@@ -294,8 +315,16 @@ const store = useProfileDataStore();
 const { profileData, changeProfileColumns } = store;
 
 const mixin = useCounterMixin();
-const { date2Thai, success, dateToISO, messageError, showLoader, hideLoader } =
-  mixin;
+const {
+  convertDateDisplay,
+  convertDate,
+  date2Thai,
+  success,
+  dateToISO,
+  messageError,
+  showLoader,
+  hideLoader,
+} = mixin;
 const route = useRoute();
 const id = ref<string>("");
 const date = ref<Date>(new Date());
@@ -325,6 +354,45 @@ const checkValidate = ref<boolean>(false); //validate data ผ่านหรื
 const rows = ref<RequestItemsObject[]>([]);
 const filter = ref<string>(""); //search data table
 const visibleColumns = ref<String[]>([]);
+const inputDate = ref<string>("");
+const inputDateRefCommandDate = ref<string>(
+  refCommandDate.value ? convertDateDisplay(refCommandDate.value) : ""
+);
+
+const dayChecked = ref<boolean>(false);
+const dayCheckedRefCommandDate = ref<boolean>(false);
+/** ตรวจเวลา */
+watch(
+  () => inputDate.value,
+  (value: string) => {
+    if (value.length === 10) {
+      const dateVal = convertDate(value);
+      if (dateVal.isValid) {
+        dayChecked.value = false;
+        date.value = new Date(dateVal.value);
+      } else {
+        dayChecked.value = true;
+        inputDate.value = "";
+      }
+    }
+  }
+);
+watch(
+  () => inputDateRefCommandDate.value,
+  (value: string) => {
+    if (value.length === 10) {
+      const dateVal = convertDate(value);
+      if (dateVal.isValid) {
+        dayChecked.value = false;
+        refCommandDate.value = new Date(dateVal.value);
+      } else {
+        dayChecked.value = true;
+        inputDateRefCommandDate.value = "";
+      }
+    }
+  }
+);
+
 profileData.record.columns.length == 0
   ? (visibleColumns.value = [
       "date",
@@ -725,6 +793,11 @@ const selectData = async (props: DataProps) => {
   refCommandNo.value = props.row.refCommandNo;
   refCommandDate.value = props.row.refCommandDate;
   id.value = props.row.id;
+
+  inputDate.value = convertDateDisplay(date.value);
+  inputDateRefCommandDate.value = refCommandDate.value
+    ? convertDateDisplay(refCommandDate.value)
+    : "";
   await checkRowPage();
 };
 
@@ -740,6 +813,8 @@ const addData = () => {
   reference.value = "";
   refCommandNo.value = "";
   refCommandDate.value = null;
+  inputDate.value = convertDateDisplay(date.value);
+  inputDateRefCommandDate.value = "";
 };
 
 /**