ปลด validate วันที่มีผล ถ้าไม่มีค่า เเสดง ว่าง

src/modules/13_salary/components/SalaryChart/DialogFormMain.vue

@@ -19,7 +19,7 @@ import Header from "@/components/DialogHeader.vue";
 
 import { useCounterMixin } from "@/stores/mixin";
 
-const isReadonly = ref<boolean>(false)
+const isReadonly = ref<boolean>(false);
 const $q = useQuasar();
 const {
   date2Thai,
@@ -64,17 +64,11 @@ const formData = reactive<FormData>({
 const salaryTypeRef = ref<Object | null>(null);
 const posTypeRef = ref<Object | null>(null);
 const posLevelRef = ref<Object | null>(null);
-const dateRef = ref<any>(null);
-const startDateRef = ref<any>();
-const endDateRef = ref<any>();
 
 const ObjectRef: ObjectSalaryRef = {
   salaryType: salaryTypeRef,
   posTypId: posTypeRef,
   posLevelId: posLevelRef,
-  date: dateRef,
-  startDate: startDateRef,
-  endDate: endDateRef,
 };
 
 const salaryTypeOption = ref<DataOption[]>([
@@ -145,7 +139,7 @@ async function fetchSalaryDetail(id: string) {
       formData.endDate = data.endDate;
       formData.details = data.details;
       formData.isSpecial = data.isSpecial;
-      isReadonly.value = data.isActive
+      isReadonly.value = data.isActive;
     })
     .catch((err) => {
       messageError($q, err);
@@ -208,7 +202,7 @@ function clearFormData() {
   formData.details = "";
   documentFile.value = null;
   itemsDocument.value = [];
-  isReadonly.value = false
+  isReadonly.value = false;
 }
 
 function onClickSubmit() {
@@ -256,37 +250,10 @@ function checkEndDate() {
   }
 }
 
-// watch(
-//   () => formData.date,
-//   () => {
-//     if (formData.date) {
-//       dateRef.value.resetValidation();
-//     }
-//   }
-// );
-
-// watch(
-//   () => formData.startDate,
-//   () => {
-//     if (formData.startDate) {
-//       startDateRef.value.resetValidation();
-//     }
-//   }
-// );
-
-// watch(
-//   () => formData.endDate,
-//   () => {
-//     if (formData.endDate) {
-//       endDateRef.value.resetValidation();
-//     }
-//   }
-// );
 </script>
 
 <template>
   <q-dialog v-model="modal" persistent>
-
     <q-card class="col-12" style="width: 80%">
       <form @submit.prevent.stop="onClickSubmit">
         <Header :tittle="title" :close="closeDialog" />
@@ -396,7 +363,6 @@ function checkEndDate() {
                     <template #trigger>
                       <q-input
                         :readonly="isReadonly"
-                        ref="dateRef"
                         outlined
                         dense
                         hide-bottom-space
@@ -406,10 +372,6 @@ function checkEndDate() {
                             : null
                         "
                         label="ให้ไว้ ณ วันที่"
-                        :rules="[
-                          (val) =>
-                            !!val || `${'กรุณาเลือกวันที่ ให้ไว ณ วันที่'}`,
-                        ]"
                       >
                         <template v-slot:prepend>
                           <q-icon
@@ -445,7 +407,6 @@ function checkEndDate() {
                     <template #trigger>
                       <q-input
                         :readonly="isReadonly"
-                        ref="startDateRef"
                         outlined
                         dense
                         hide-bottom-space
@@ -455,10 +416,6 @@ function checkEndDate() {
                             : null
                         "
                         label="วันที่มีผลบังคับใช้"
-                        :rules="[
-                          (val) =>
-                            !!val || `${'กรุณาเลือกวันที่มีผลบังคับใช้'}`,
-                        ]"
                       >
                         <template v-slot:prepend>
                           <q-icon
@@ -494,20 +451,14 @@ function checkEndDate() {
                     <template #trigger>
                       <q-input
                         :readonly="isReadonly"
-                        ref="endDateRef"
                         outlined
                         dense
-                        hide-bottom-space
                         :model-value="
                           formData.endDate != null
                             ? date2Thai(formData.endDate)
                             : null
                         "
                         label="วันที่สิ้นสุดบังคับใช้"
-                        :rules="[
-                          (val) =>
-                            !!val || `${'กรุณาเลือกวันที่สิ้นสุดบังคับใช้'}`,
-                        ]"
                       >
                         <template v-slot:prepend>
                           <q-icon

src/modules/13_salary/interface/index/Main.ts

@@ -26,9 +26,6 @@ interface ObjectSalaryRef {
   salaryType: object | null;
   posTypId: object | null;
   posLevelId: object | null;
-  date: object | null;
-  startDate: object | null;
-  endDate: object | null;
 
   [key: string]: any;
 }

src/modules/13_salary/views/salaryChart.vue

@@ -313,7 +313,7 @@ async function filterFn(page: number) {
                 }}
               </div>
               <div v-else-if="col.name === 'startDate'">
-                {{ col.value ? date2Thai(col.value) : "-" }}
+                {{ col.value ? date2Thai(col.value) : "" }}
               </div>
               <div v-else-if="col.name === 'posLevel'">
                 {{ props.row.isSpecial ? `${col.value} (ฉ)` : `${col.value}` }}