ปรับ ui

src/modules/11_discipline/components/2_InvestigateFacts/Form.vue

@@ -132,25 +132,40 @@ const formData = reactive<FormData>({
 
 /** maping ref เข้าตัวแปรเพื่อเตรียมตรวจสอบ */
 const objectInvestigate: MyObjectInvestigateRef = {
-  complaint: complaintRef,
-  complaintdetail: complaintdetailRef,
-  investigationDescription: investigationDescriptionRef,
-  fault: faultRef,
-  investigationDetailOther: investigationDetailOtherRef,
-  fileComplaint: fileComplaintRef,
-  date: dateRef,
-  dateEnd: dateEndRef,
-  investigationDetail: investigationDetailRef,
-  daysExtend: daysExtendRef,
-  investigationStatusResult: investigationStatusResultRef,
-  investigationCauseText: investigationCauseTextRef,
-  result: resultRef,
+  // complaint: complaintRef,
+  // complaintdetail: complaintdetailRef,
+  // investigationDescription: investigationDescriptionRef,
+  // fault: faultRef,
+  // investigationDetailOther: investigationDetailOtherRef,
+  // fileComplaint: fileComplaintRef,
+  // date: dateRef,
+  // dateEnd: dateEndRef,
+  // investigationDetail: investigationDetailRef,
+  // daysExtend: daysExtendRef,
+  // investigationStatusResult: investigationStatusResultRef,
+  // investigationCauseText: investigationCauseTextRef,
+  // result: resultRef,
 };
 
 const rows = ref([]);
 const statusStep = computed(() => {
   return route.name === "/discipline-disciplinaryEdit" ? true : false;
 });
+const dateEndInputStyle = computed(() => {
+  const currentDate = new Date();
+  const investigationDateEnd = new Date(formData.investigationDateEnd as Date);
+
+  const isInNext7Days =
+    investigationDateEnd >= currentDate &&
+    investigationDateEnd <=
+      new Date(currentDate.getTime() + 7 * 24 * 60 * 60 * 1000);
+
+  console.log(isInNext7Days);
+  return isInNext7Days
+    ? { textDecoration: "underline", color: "red", borderColor: "red" }
+    : {};
+});
+
 const initialPagination = ref<any>({
   rowsPerPage: 0,
 });
@@ -565,7 +580,7 @@ function closeEditDirector() {
   modalEditDirector.value = false;
 }
 
-async function saveDuty(id: string, duty: string){
+async function saveDuty(id: string, duty: string) {
   showLoader();
   await http
     .put(config.API.investigateEditDuty(formData.id, id), { duty: duty })
@@ -580,7 +595,7 @@ async function saveDuty(id: string, duty: string){
       props.getData?.();
       hideLoader();
     });
-};
+}
 
 onMounted(async () => {
   mainStore.rowsAdd = [];
@@ -1024,7 +1039,7 @@ onMounted(async () => {
                               }}</template>
                               <template #trigger>
                                 <q-input
-                                  for="#dateEnd"
+                                  for="#dateEndInvestigatefacts"
                                   ref="dateEndRef"
                                   :class="inputEditExtend(isReadonly)"
                                   :readonly="
@@ -1048,6 +1063,7 @@ onMounted(async () => {
                                       `${'กรุณาเลือกวันที่สิ้นสุดการสืบสวน'}`,
                                   ]"
                                   :label="`${'วันที่สิ้นสุดการสืบสวน'}`"
+                                  :input-style="dateEndInputStyle"
                                 >
                                   <template v-slot:prepend>
                                     <q-icon
@@ -1581,7 +1597,8 @@ onMounted(async () => {
   />
 </template>
 
-<style scoped>
+<style scope>
+
 .q-banner {
   min-height: 25px;
 }