ตรวจสอบ กรอกเวลาไม่ครบ 10 หลัก

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

@@ -380,6 +380,7 @@ import { onMounted, ref, watch } from "vue";
 import { useRoute } from "vue-router";
 import { useCounterMixin } from "@/stores/mixin";
 import { useProfileDataStore } from "@/modules/04_registry/store";
+import { validateTime } from "@/modules/04_registry/stores/time";
 
 import ProfileTable from "@/modules/04_registry/components/Table.vue";
 import DialogHeader from "@/modules/04_registry/components/DialogHeader.vue";
@@ -770,10 +771,10 @@ const clickAdd = async () => {
  * กดบันทึกใน dialog
  */
 const clickSave = async () => {
-  if (inputDateRef.value.length != 0 && inputDateRef.value.length != 10) {
-    dayCheckedRef.value = true;
-    return "";
-  }
+  dayChecked.value = validateTime(inputDate.value);
+  dayCheckedRef.value = validateTime(inputDateRef.value);
+  if (dayCheckedRef.value || dayChecked.value) return;
+
   myForm.value.validate().then(async (result: boolean) => {
     if (result) {
       if (modalEdit.value) {
@@ -904,6 +905,8 @@ const clickClose = async () => {
     modal.value = false;
     next.value = false;
     previous.value = false;
+    dayChecked.value = false;
+    dayCheckedRef.value = false;
   }
 };
 

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

@@ -65,6 +65,8 @@
                 mask="##/##/####"
                 dense
                 :rules="[(val) => !!val || `${'กรุณาเลือกวันที่'}`]"
+                :error="dayChecked"
+                error-message="กรุณากรอกวันที่"
               />
 
               <datepicker
@@ -178,7 +180,7 @@ import { onMounted, ref, watch } from "vue";
 import { useRoute } from "vue-router";
 import { useProfileDataStore } from "@/modules/04_registry/store";
 import { useCounterMixin } from "@/stores/mixin";
-
+import { validateTime } from "@/modules/04_registry/stores/time";
 import ProfileTable from "@/modules/04_registry/components/Table.vue";
 import DialogHeader from "@/modules/04_registry/components/DialogHeader.vue";
 import DialogFooter from "@/modules/04_registry/components/DialogFooter.vue";
@@ -436,6 +438,9 @@ const clickAdd = async () => {
  * กดบันทึกใน dialog
  */
 const clickSave = async () => {
+  dayChecked.value = validateTime(inputDate.value);
+  if (dayChecked.value) return;
+
   myForm.value.validate().then(async (result: boolean) => {
     if (result) {
       if (modalEdit.value) {
@@ -546,6 +551,7 @@ const clickClose = async () => {
     modal.value = false;
     next.value = false;
     previous.value = false;
+    dayChecked.value = false;
   }
 };
 

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

@@ -73,6 +73,8 @@
                 mask="##/##/####"
                 dense
                 :rules="[(val) => !!val || `${'กรุณาเลือก วัน/เดือน/ปี'}`]"
+                :error="dayChecked"
+                error-message="กรุณากรอก วัน/เดือน/ปี"
               />
 
               <datepicker
@@ -181,6 +183,8 @@
                 :label="`${'เอกสารอ้างอิง (ลงวันที่)'}`"
                 mask="##/##/####"
                 dense
+                :error="dayCheckedRefCommandDate"
+                error-message="กรุณากรอกเอกสารอ้างอิง (ลงวันที่) หรือเว้นว่าง"
               />
 
               <datepicker
@@ -290,7 +294,7 @@ import { onMounted, ref, watch } from "vue";
 import { useRoute } from "vue-router";
 import { useProfileDataStore } from "@/modules/04_registry/store";
 import { useCounterMixin } from "@/stores/mixin";
-
+import { validateTime } from "@/modules/04_registry/stores/time";
 import ProfileTable from "@/modules/04_registry/components/Table.vue";
 import DialogHeader from "@/modules/04_registry/components/DialogHeader.vue";
 import DialogFooter from "@/modules/04_registry/components/DialogFooter.vue";
@@ -385,13 +389,14 @@ watch(
     if (value.length === 10) {
       const dateVal = convertDate(value);
       if (dateVal.isValid) {
-        dayChecked.value = false;
+        dayCheckedRefCommandDate.value = false;
         refCommandDate.value = new Date(dateVal.value);
       } else {
-        dayChecked.value = true;
+        dayCheckedRefCommandDate.value = true;
         inputDateRefCommandDate.value = "";
       }
     } else {
+      dayCheckedRefCommandDate.value = false;
       refCommandDate.value = null;
     }
   }
@@ -660,6 +665,14 @@ const clickAdd = async () => {
  * กดบันทึกใน dialog
  */
 const clickSave = async () => {
+  dayChecked.value = validateTime(inputDate.value);
+  dayCheckedRefCommandDate.value = validateTime(inputDateRefCommandDate.value);
+  console.log(dayChecked.value);
+
+  console.log(dayCheckedRefCommandDate.value);
+
+  if (dayChecked.value || dayCheckedRefCommandDate.value) return;
+
   myForm.value.validate().then(async (result: boolean) => {
     if (result) {
       if (modalEdit.value) {
@@ -782,6 +795,8 @@ const clickClose = async () => {
     modal.value = false;
     next.value = false;
     previous.value = false;
+    dayChecked.value = false;
+    dayCheckedRefCommandDate.value = false;
   }
 };
 

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

@@ -239,6 +239,8 @@
                 :label="`${'เอกสารอ้างอิง (ลงวันที่)'}`"
                 mask="##/##/####"
                 dense
+                :error="dayCheckedRefCommandDate"
+                error-message="กรุณากรอกเอกสารอ้างอิง (ลงวันที่) หรือเว้นว่าง"
               />
 
               <datepicker
@@ -350,7 +352,7 @@ import { useRoute } from "vue-router";
 import moment from "moment";
 import { useProfileDataStore } from "@/modules/04_registry/store";
 import { useCounterMixin } from "@/stores/mixin";
-
+import { validateTime } from "@/modules/04_registry/stores/time";
 import ProfileTable from "@/modules/04_registry/components/Table.vue";
 import DialogHeader from "@/modules/04_registry/components/DialogHeader.vue";
 import DialogFooter from "@/modules/04_registry/components/DialogFooter.vue";
@@ -424,6 +426,7 @@ const inputRefCommandDate = ref<string>("");
 
 const dayCheckedStart = ref<boolean>(false);
 const dayCheckedEnd = ref<boolean>(false);
+const dayCheckedRefCommandDate = ref<boolean>(false);
 /** ตรวจเวลา */
 watch(
   () => inputDateStart.value,
@@ -446,11 +449,14 @@ watch(
     if (value.length === 10) {
       const dateVal = convertDate(value);
       if (dateVal.isValid) {
+        dayCheckedRefCommandDate.value = false;
         refCommandDate.value = new Date(dateVal.value);
       } else {
+        dayCheckedRefCommandDate.value = true;
         inputRefCommandDate.value = "";
       }
     } else {
+      dayCheckedRefCommandDate.value = false;
       refCommandDate.value = null;
     }
   }
@@ -765,6 +771,16 @@ const clickAdd = async () => {
  * กดบันทึกใน dialog
  */
 const clickSave = async () => {
+  dayCheckedStart.value = validateTime(inputDateStart.value);
+  dayCheckedEnd.value = validateTime(inputDateEnd.value);
+  dayCheckedRefCommandDate.value = validateTime(inputRefCommandDate.value);
+
+  if (
+    dayCheckedStart.value ||
+    dayCheckedEnd.value ||
+    dayCheckedRefCommandDate.value
+  )
+    return;
   myForm.value.validate().then(async (result: boolean) => {
     if (result) {
       if (modalEdit.value) {
@@ -889,6 +905,9 @@ const clickClose = async () => {
     modal.value = false;
     next.value = false;
     previous.value = false;
+    dayCheckedStart.value = false;
+    dayCheckedEnd.value = false;
+    dayCheckedRefCommandDate.value = false;
   }
 };
 

src/modules/04_registry/stores/time.ts

@@ -0,0 +1,4 @@
+export function validateTime(input: string) {
+  if (input.length != 0 && input.length != 10) return true;
+  return false;
+}