From 75078c52f1b77e85fcd68f9578e792897b05fe3e Mon Sep 17 00:00:00 2001
From: waruneeauy <warunee.auy@gmail.com>
Date: Wed, 6 Nov 2024 09:29:24 +0700
Subject: [PATCH] updated develop

---
 .../components/scholarship/DetailView.vue     | 172 +++++++++++++++++-
 1 file changed, 167 insertions(+), 5 deletions(-)

diff --git a/src/modules/15_development/components/scholarship/DetailView.vue b/src/modules/15_development/components/scholarship/DetailView.vue
index 5b77c706d..438cdacbe 100644
--- a/src/modules/15_development/components/scholarship/DetailView.vue
+++ b/src/modules/15_development/components/scholarship/DetailView.vue
@@ -525,6 +525,40 @@ const classInput = (val: boolean) => {
   };
 };
 
+const convertStudyPlace = () => {
+  switch (formBody.studyTopic) {
+    case "ศึกษา":
+      return "สถานที่ไปศึกษา (เมือง/ประเทศ)";
+    case "ฝึกอบรม":
+      return "สถานที่เข้ารับการฝึกอบรม (เมือง/ประเทศ)";
+    case "ดูงาน":
+      return "สถานที่ไปดูงาน";
+    case "ประชุม":
+      return "สถานที่จัดประชุม (เมือง/ประเทศ)";
+    case "ปฏิบัติการวิจัย":
+      return "สถานที่ไปปฏิบัติการวิจัย (เมือง/ประเทศ)";
+    default:
+      return "สถานที่ (เมือง/ประเทศ)";
+  }
+};
+
+const convertCourse = () => {
+  switch (formBody.studyTopic) {
+    case "ศึกษา":
+      return "หลักสูตรการศึกษา";
+    case "ฝึกอบรม":
+      return "หลักสูตรการฝึกอบรม";
+    case "ดูงาน":
+      return "หัวข้อการไปดูงาน";
+    case "ประชุม":
+      return "ชื่อการประชุม";
+    case "ปฏิบัติการวิจัย":
+      return "หลักสูตร";
+    default:
+      return "หลักสูตร";
+  }
+};
+
 /** ดึงข้อมูลเมื่อคอมโพเนนต์โหลดเสร็จสมบูรณ์  */
 onMounted(() => {
   if (scholarshipId.value) {
@@ -1636,7 +1670,7 @@ onMounted(() => {
                     v-model="formBody.course"
                     :rules="[
                       (val: string) =>
-                        !!val || `${'กรุณากรอกหลักสูตรการฝึกอบรม'}`,
+                        !!val || `กรุณากรอกหลักสูตรการฝึกอบรม`,
                     ]"
                   />
                 </div>
@@ -2383,11 +2417,11 @@ onMounted(() => {
                     :readonly="checkRouteDetail"
                     hide-bottom-space
                     :class="classInput(!checkRouteDetail)"
-                    label="หลักสูตรการฝึกอบรม"
+                    :label="convertCourse()"
                     v-model="formBody.course"
                     :rules="[
                   (val: string) =>
-                    !!val || `${'กรุณากรอกหลักสูตรการฝึกอบรม'}`,
+                    !!val || `กรุณากรอก${convertCourse()}`,
                 ]"
                   />
                 </div>
@@ -2538,15 +2572,143 @@ onMounted(() => {
                     lazy-rules
                     :readonly="checkRouteDetail"
                     hide-bottom-space
-                    label="ประเทศที่ไปศึกษา ฝึกอบรม ประชุม ดูงาน และปฏิบัติการวิจัย"
+                    :label="convertStudyPlace()"
+                    :class="classInput(!checkRouteDetail)"
+                    v-model="formBody.studyPlace"
+                    :rules="[
+                      (val: string) =>
+                        !!val || `กรุณากรอก${convertStudyPlace()}`,
+                    ]"
+                  />
+                </div>
+
+                <div v-if="formBody.studyTopic == 'ดูงาน'" class="col-3">
+                  <q-input
+                    dense
+                    :readonly="checkRouteDetail"
+                    outlined
+                    lazy-rules
+                    hide-bottom-space
+                    label="ประเทศที่ไปดูงาน"
                     :class="classInput(!checkRouteDetail)"
                     v-model="formBody.studyCountry"
                     :rules="[
                       (val: string) =>
-                        !!val || `${'กรุณากรอกประเทศที่ไปศึกษา ฝึกอบรม ประชุม ดูงาน และปฏิบัติการวิจัย'}`,
+                        !!val || `${'กรุณากรอประเทศที่ไปดูงาน'}`,
                     ]"
                   />
                 </div>
+
+                <div class="col-3">
+                  <datepicker
+                    menu-class-name="modalfix"
+                    v-model="formBody.studyAbroadStartDate"
+                    :locale="'th'"
+                    autoApply
+                    :readonly="checkRouteDetail"
+                    :enableTimePicker="false"
+                    week-start="0"
+                    @update:model-value="
+                      changeStartDate('studyAbroadStartDate')
+                    "
+                  >
+                    <template #year="{ year }">{{ year + 543 }}</template>
+                    <template #year-overlay-value="{ value }">{{
+                      parseInt(value + 543)
+                    }}</template>
+                    <template #trigger>
+                      <q-input
+                        dense
+                        outlined
+                        :readonly="checkRouteDetail"
+                        :class="classInput(!checkRouteDetail)"
+                        :model-value="
+                          formBody.studyAbroadStartDate
+                            ? date2Thai(formBody.studyAbroadStartDate)
+                            : null
+                        "
+                        :label="`${'วันขออนุมัติเดินทางออกจากประเทศไทย'}`"
+                        hide-bottom-space
+                        :rules="[
+                      (val: string) =>
+                        !!val || `${'วันขออนุมัติเดินทางออกจากประเทศไทย'}`,
+                    ]"
+                      >
+                        <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 class="col-3">
+                  <datepicker
+                    menu-class-name="modalfix"
+                    v-model="formBody.studyAbroadEndDate"
+                    :locale="'th'"
+                    autoApply
+                    :enableTimePicker="false"
+                    :readonly="checkRouteDetail"
+                    week-start="0"
+                    :min-date="formBody.studyAbroadStartDate"
+                    @update:model-value="
+                      updateTotalPeriod(
+                        formBody.studyAbroadStartDate,
+                        formBody.studyAbroadEndDate
+                      )
+                    "
+                  >
+                    <template #year="{ year }">{{ year + 543 }}</template>
+                    <template #year-overlay-value="{ value }">{{
+                      parseInt(value + 543)
+                    }}</template>
+                    <template #trigger>
+                      <q-input
+                        dense
+                        outlined
+                        :readonly="checkRouteDetail"
+                        :class="classInput(!checkRouteDetail)"
+                        :model-value="
+                          formBody.studyAbroadEndDate
+                            ? date2Thai(formBody.studyAbroadEndDate)
+                            : null
+                        "
+                        :label="`${'วันเดินทางกลับถึงประเทศไทย'}`"
+                        hide-bottom-space
+                        :rules="[
+                      (val: string) =>
+                        !!val || `${'วันเดินทางกลับถึงประเทศไทย'}`,
+                    ]"
+                      >
+                        <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 class="col-3">
+                  <q-input
+                    dense
+                    outlined
+                    lazy-rules
+                    :readonly="checkRouteDetail"
+                    hide-bottom-space
+                    label="รวมระยะเวลาทั้งสิ้น"
+                    :class="classInput(!checkRouteDetail)"
+                    v-model="formBody.totalPeriod"
+                  />
+                </div>
               </div>
             </div>
           </div>