From 2417548672815828938b6351750073f076ada88a Mon Sep 17 00:00:00 2001
From: Kittapath <kittapath@frappet.com>
Date: Fri, 13 Oct 2023 04:27:51 +0700
Subject: [PATCH] =?UTF-8?q?=E0=B9=80=E0=B8=9E=E0=B8=B4=E0=B9=88=E0=B8=A1?=
 =?UTF-8?q?=E0=B8=A7=E0=B8=B1=E0=B8=99=E0=B8=97=E0=B8=B5=E0=B9=88=E0=B8=AA?=
 =?UTF-8?q?=E0=B8=A1=E0=B8=B1=E0=B8=84=E0=B8=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../03_recruiting/components/Career.vue       | 1125 +++++++++--------
 .../views/02_qualify/PeriodAdd.vue            |    2 +-
 .../views/02_qualify/manageDetail.vue         |    2 +-
 3 files changed, 625 insertions(+), 504 deletions(-)

diff --git a/src/modules/03_recruiting/components/Career.vue b/src/modules/03_recruiting/components/Career.vue
index a00065564..20c9f86c3 100644
--- a/src/modules/03_recruiting/components/Career.vue
+++ b/src/modules/03_recruiting/components/Career.vue
@@ -1,58 +1,117 @@
 <!-- tab ประวัติการทำงาน (ตั้งแต่เริ่มปฏิบัติงานกับกรุงเทพมหานคร - ปัจจุบัน) -->
 <template>
-    <q-form ref="myForm">
-        <Table :rows="rows" :columns="columns" :filter="filter" :visible-columns="visibleColumns"
-            v-model:inputfilter="filter" v-model:inputvisible="visibleColumns" v-model:editvisible="edit" :add="clickAdd"
-            :edit="clickEdit" :addData="false" :bottom="true" :editData="status == 'checkRegister' || status == 'payment'"
-            name="ประวัติการทำงาน (ตั้งแต่เริ่มปฏิบัติงานกับกรุงเทพมหานคร - ปัจจุบัน)" icon="mdi-briefcase">
-            <template #columns="props">
-                <q-tr :props="props">
-                    <q-td v-for="col in props.cols" :key="col.name" :props="props" @click="selectData(props)"
-                        class="cursor-pointer">
-                        <div v-if="col.name == 'startDate' || col.name == 'endDate'">
-                            {{ date2Thai(col.value) }}
-                        </div>
-                        <div v-else>
-                            {{ col.value }}
-                        </div>
-                    </q-td>
-                    <q-td style="width:5% !important;" v-if="status == 'checkRegister' || status == 'payment'">
-                        <q-btn color="red" flat dense round size="14px" icon="mdi-trash-can-outline"
-                            @click="checkDelete(props.row)" />
-                    </q-td>
-                </q-tr>
-            </template>
-            <template #bottom="props">
-                <div style="width:75% !important;" />
-                <div :props="props" style="width:25% !important;padding-left: 12px;">
-                    <span class="text-weight-medium text-subtitle2 q-py-sm">รวมระยะเวลา : <span class="q-pl-sm">{{ total
-                    }}</span></span>
-                </div>
-            </template>
-        </Table>
-    </q-form>
-    <!-- popup Edit window-->
-    <q-dialog v-model="modal" persistent>
-        <q-card style="width: 600px">
-            <q-form ref="myForm">
-                <DialogHeader tittle="ประวัติการทำงาน (ตั้งแต่เริ่มปฏิบัติงานกับกรุงเทพมหานคร - ปัจจุบัน)"
-                    :close="checkClose" />
-                <q-separator />
-                <q-card-section class="q-p-sm">
-                    <div class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs">
-                        <div class="col-xs-12 col-sm-6 col-md-6">
-                            <q-input :class="getClass(edit)" :outlined="edit" dense lazy-rules :readonly="!edit"
-                                :borderless="!edit" v-model="position"
-                                :rules="[(val) => !!val || `${'กรุณากรอกตำแหน่ง/ลักษณะงาน'}`]"
-                                :label="`${'ตำแหน่ง/ลักษณะงาน'}`" @update:modelValue="clickEditRow" hide-bottom-space />
-                        </div>
-                        <div class="col-xs-12 col-sm-6 col-md-6">
-                            <q-select :class="getClass(edit)" :outlined="edit" dense lazy-rules :readonly="!edit"
-                                :borderless="!edit" v-model="type" :options="opType"
-                                :rules="[(val) => !!val || `${'กรุณาเลือกประเภท'}`]" :label="`${'ประเภท'}`"
-                                @update:modelValue="clickEditRow" hide-bottom-space />
-                        </div>
-                        <!-- <div class="col-xs-12 col-sm-6 col-md-6">
+  <q-form ref="myForm">
+    <Table
+      :rows="rows"
+      :columns="columns"
+      :filter="filter"
+      :visible-columns="visibleColumns"
+      v-model:inputfilter="filter"
+      v-model:inputvisible="visibleColumns"
+      v-model:editvisible="edit"
+      :add="clickAdd"
+      :edit="clickEdit"
+      :addData="false"
+      :bottom="true"
+      :editData="status == 'checkRegister' || status == 'payment'"
+      name="ประวัติการทำงาน (ตั้งแต่เริ่มปฏิบัติงานกับกรุงเทพมหานคร - ปัจจุบัน)"
+      icon="mdi-briefcase"
+    >
+      <template #columns="props">
+        <q-tr :props="props">
+          <q-td
+            v-for="col in props.cols"
+            :key="col.name"
+            :props="props"
+            @click="selectData(props)"
+            class="cursor-pointer"
+          >
+            <div v-if="col.name == 'startDate' || col.name == 'endDate'">
+              {{ date2Thai(col.value) }}
+            </div>
+            <div v-else>
+              {{ col.value }}
+            </div>
+          </q-td>
+          <q-td
+            style="width: 5% !important"
+            v-if="status == 'checkRegister' || status == 'payment'"
+          >
+            <q-btn
+              color="red"
+              flat
+              dense
+              round
+              size="14px"
+              icon="mdi-trash-can-outline"
+              @click="checkDelete(props.row)"
+            />
+          </q-td>
+        </q-tr>
+      </template>
+      <template #bottom="props">
+        <div style="width: 60% !important" />
+        <div
+          :props="props"
+          class="row"
+          style="width: 18.4% !important; padding-left: 20px"
+        >
+          <div
+            class="text-weight-medium text-subtitle2 q-py-sm row col-12 justify-between"
+          >
+            <div>รวมระยะเวลา :</div>
+
+            <div>{{ total }}</div>
+          </div>
+        </div>
+      </template>
+    </Table>
+  </q-form>
+  <!-- popup Edit window-->
+  <q-dialog v-model="modal" persistent>
+    <q-card style="width: 600px">
+      <q-form ref="myForm">
+        <DialogHeader
+          tittle="ประวัติการทำงาน (ตั้งแต่เริ่มปฏิบัติงานกับกรุงเทพมหานคร - ปัจจุบัน)"
+          :close="checkClose"
+        />
+        <q-separator />
+        <q-card-section class="q-p-sm">
+          <div
+            class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs"
+          >
+            <div class="col-xs-12 col-sm-6 col-md-6">
+              <q-input
+                :class="getClass(edit)"
+                :outlined="edit"
+                dense
+                lazy-rules
+                :readonly="!edit"
+                :borderless="!edit"
+                v-model="position"
+                :rules="[(val) => !!val || `${'กรุณากรอกตำแหน่ง/ลักษณะงาน'}`]"
+                :label="`${'ตำแหน่ง/ลักษณะงาน'}`"
+                @update:modelValue="clickEditRow"
+                hide-bottom-space
+              />
+            </div>
+            <div class="col-xs-12 col-sm-6 col-md-6">
+              <q-select
+                :class="getClass(edit)"
+                :outlined="edit"
+                dense
+                lazy-rules
+                :readonly="!edit"
+                :borderless="!edit"
+                v-model="type"
+                :options="opType"
+                :rules="[(val) => !!val || `${'กรุณาเลือกประเภท'}`]"
+                :label="`${'ประเภท'}`"
+                @update:modelValue="clickEditRow"
+                hide-bottom-space
+              />
+            </div>
+            <!-- <div class="col-xs-12 col-sm-6 col-md-6">
               <q-input
                 :class="getClass(edit)"
                 :outlined="edit"
@@ -97,70 +156,130 @@
                 hide-bottom-space
               />
             </div> -->
-                        <div class="col-xs-12 col-sm-6 col-md-6">
-                            <datepicker menu-class-name="modalfix" :readonly="!edit" v-model="startDate" :locale="'th'"
-                                autoApply :enableTimePicker="false" @update:modelValue="clickEditRow" week-start="0">
-                                <template #year="{ year }">
-                                    {{ year + 543 }}
-                                </template>
-                                <template #year-overlay-value="{ value }">
-                                    {{ parseInt(value + 543) }}
-                                </template>
-                                <template #trigger>
-                                    <q-input :class="getClass(edit)" :outlined="edit" dense lazy-rules :borderless="!edit"
-                                        :model-value="date2Thai(startDate)"
-                                        :rules="[(val) => !!val || `${'กรุณาเลือกวันที่เริ่ม'}`]" hide-bottom-space
-                                        :label="`${'วันที่เริ่ม'}`">
-                                        <template v-slot:prepend>
-                                            <q-icon name="event" class="cursor-pointer" :style="edit
-                                                ? 'color: var(--q-primary)'
-                                                : 'color: var(--q-grey)'
-                                                ">
-                                            </q-icon>
-                                        </template>
-                                    </q-input>
-                                </template>
-                            </datepicker>
-                        </div>
-                        <div class="col-xs-12 col-sm-6 col-md-6">
-                            <datepicker menu-class-name="modalfix" :readonly="!edit" v-model="endDate" :locale="'th'"
-                                autoApply :enableTimePicker="false" @update:modelValue="clickEditRow" week-start="0">
-                                <template #year="{ year }">
-                                    {{ year + 543 }}
-                                </template>
-                                <template #year-overlay-value="{ value }">
-                                    {{ parseInt(value + 543) }}
-                                </template>
-                                <template #trigger>
-                                    <q-input :class="getClass(edit)" :outlined="edit" dense lazy-rules :borderless="!edit"
-                                        :model-value="date2Thai(endDate)"
-                                        :rules="[(val) => !!val || `${'กรุณาเลือกวันที่สิ้นสุด'}`, endDateValidation]"
-                                        hide-bottom-space :label="`${'วันที่สิ้นสุด'}`">
-                                        <template v-slot:prepend>
-                                            <q-icon name="event" class="cursor-pointer" :style="edit
-                                                ? 'color: var(--q-primary)'
-                                                : 'color: var(--q-grey)'
-                                                ">
-                                            </q-icon>
-                                        </template>
-                                    </q-input>
-                                </template>
-                            </datepicker>
-                        </div>
-                        <div class="col-xs-12 col-sm-12 col-md-12">
-                            <q-input :class="getClass(false)" :outlined="false" dense lazy-rules :readonly="!false"
-                                :borderless="!false" v-model="rangeDate" :label="`${'ระยะเวลา'}`" hide-bottom-space />
-                        </div>
-                    </div>
-                </q-card-section>
-                <q-separator />
-                <DialogFooter :edit="clickEdit" :save="clickSave" :validate="validateData" :clickNext="clickNext"
-                    :clickPrevious="clickPrevious" :editData="status == 'checkRegister' || status == 'payment'"
-                    v-model:editvisible="edit" v-model:next="next" v-model:previous="previous"
-                    v-model:modalEdit="modalEdit" />
-            </q-form>
-        </q-card>
-    </q-dialog>
+            <div class="col-xs-12 col-sm-6 col-md-6">
+              <datepicker
+                menu-class-name="modalfix"
+                :readonly="!edit"
+                v-model="startDate"
+                :locale="'th'"
+                autoApply
+                :enableTimePicker="false"
+                @update:modelValue="clickEditRow"
+                week-start="0"
+              >
+                <template #year="{ year }">
+                  {{ year + 543 }}
+                </template>
+                <template #year-overlay-value="{ value }">
+                  {{ parseInt(value + 543) }}
+                </template>
+                <template #trigger>
+                  <q-input
+                    :class="getClass(edit)"
+                    :outlined="edit"
+                    dense
+                    lazy-rules
+                    :borderless="!edit"
+                    :model-value="date2Thai(startDate)"
+                    :rules="[(val) => !!val || `${'กรุณาเลือกวันที่เริ่ม'}`]"
+                    hide-bottom-space
+                    :label="`${'วันที่เริ่ม'}`"
+                  >
+                    <template v-slot:prepend>
+                      <q-icon
+                        name="event"
+                        class="cursor-pointer"
+                        :style="
+                          edit
+                            ? 'color: var(--q-primary)'
+                            : 'color: var(--q-grey)'
+                        "
+                      >
+                      </q-icon>
+                    </template>
+                  </q-input>
+                </template>
+              </datepicker>
+            </div>
+            <div class="col-xs-12 col-sm-6 col-md-6">
+              <datepicker
+                menu-class-name="modalfix"
+                :readonly="!edit"
+                v-model="endDate"
+                :locale="'th'"
+                autoApply
+                :enableTimePicker="false"
+                @update:modelValue="clickEditRow"
+                week-start="0"
+              >
+                <template #year="{ year }">
+                  {{ year + 543 }}
+                </template>
+                <template #year-overlay-value="{ value }">
+                  {{ parseInt(value + 543) }}
+                </template>
+                <template #trigger>
+                  <q-input
+                    :class="getClass(edit)"
+                    :outlined="edit"
+                    dense
+                    lazy-rules
+                    :borderless="!edit"
+                    :model-value="date2Thai(endDate)"
+                    :rules="[
+                      (val) => !!val || `${'กรุณาเลือกวันที่สิ้นสุด'}`,
+                      endDateValidation,
+                    ]"
+                    hide-bottom-space
+                    :label="`${'วันที่สิ้นสุด'}`"
+                  >
+                    <template v-slot:prepend>
+                      <q-icon
+                        name="event"
+                        class="cursor-pointer"
+                        :style="
+                          edit
+                            ? 'color: var(--q-primary)'
+                            : 'color: var(--q-grey)'
+                        "
+                      >
+                      </q-icon>
+                    </template>
+                  </q-input>
+                </template>
+              </datepicker>
+            </div>
+            <div class="col-xs-12 col-sm-12 col-md-12">
+              <q-input
+                :class="getClass(false)"
+                :outlined="false"
+                dense
+                lazy-rules
+                :readonly="!false"
+                :borderless="!false"
+                v-model="rangeDate"
+                :label="`${'ระยะเวลา'}`"
+                hide-bottom-space
+              />
+            </div>
+          </div>
+        </q-card-section>
+        <q-separator />
+        <DialogFooter
+          :edit="clickEdit"
+          :save="clickSave"
+          :validate="validateData"
+          :clickNext="clickNext"
+          :clickPrevious="clickPrevious"
+          :editData="status == 'checkRegister' || status == 'payment'"
+          v-model:editvisible="edit"
+          v-model:next="next"
+          v-model:previous="previous"
+          v-model:modalEdit="modalEdit"
+        />
+      </q-form>
+    </q-card>
+  </q-dialog>
 </template>
 <script setup lang="ts">
 import type { QTableProps } from "quasar";
@@ -171,8 +290,8 @@ import http from "@/plugins/http";
 import config from "@/app.config";
 import { useExamDataStore } from "@/modules/03_recruiting/store";
 import type {
-    RequestItemsObject,
-    DataProps,
+  RequestItemsObject,
+  DataProps,
 } from "@/modules/03_recruiting/interface/request/Career";
 import type { ResponseObject } from "@/modules/03_recruiting/interface/response/Career";
 import Table from "@/modules/03_recruiting/components/TableCan.vue";
@@ -181,10 +300,10 @@ import DialogFooter from "@/modules/03_recruiting/components/DialogFooter.vue";
 import { useRoute } from "vue-router";
 
 const props = defineProps({
-    status: {
-        type: String,
-        required: true,
-    },
+  status: {
+    type: String,
+    required: true,
+  },
 });
 
 const $q = useQuasar();
@@ -196,9 +315,9 @@ const id = ref<string>("");
 
 const type = ref<string | null>();
 const opType = ref([
-    "ลูกจ้างประจำ",
-    "ลูกจ้างชั่วคราว",
-    "ผู้ปฏิบัติงานอื่นในกรุงเทพมหานคร",
+  "ลูกจ้างประจำ",
+  "ลูกจ้างชั่วคราว",
+  "ผู้ปฏิบัติงานอื่นในกรุงเทพมหานคร",
 ]);
 
 const position = ref<string | null>();
@@ -228,444 +347,446 @@ const { messageError, showLoader, hideLoader } = mixin;
 const visibleColumns = ref<String[]>([]);
 
 examData.career.columns.length == 0
-    ? (visibleColumns.value = [
-        "position",
-        //   "group",
-        //   "pile",
-        //   "org",
-        "type",
-        "startDate",
-        "endDate",
-        "rangeDate",
+  ? (visibleColumns.value = [
+      "position",
+      //   "group",
+      //   "pile",
+      //   "org",
+      "type",
+      "startDate",
+      "endDate",
+      "rangeDate",
     ])
-    : (visibleColumns.value = examData.career.columns);
+  : (visibleColumns.value = examData.career.columns);
 
 const columns = ref<QTableProps["columns"]>([
-    {
-        name: "position",
-        align: "left",
-        label: "ชื่อตำแหน่ง",
-        sortable: true,
-        field: "position",
-        headerStyle: "font-size: 14px",
-        style: "font-size: 14px; width:25%;",
-        sort: (a: string, b: string) =>
-            a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
-    },
-    {
-        name: "type",
-        align: "left",
-        label: "ประเภท",
-        sortable: true,
-        field: "type",
-        headerStyle: "font-size: 14px",
-        style: "font-size: 14px; width:20%;",
-        sort: (a: string, b: string) =>
-            a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
-    },
-    //   {
-    //     name: "group",
-    //     align: "left",
-    //     label: "กลุ่ม/ฝ่าย",
-    //     sortable: true,
-    //     field: "group",
-    //     headerStyle: "font-size: 14px",
-    //     style: "font-size: 14px",
-    //     sort: (a: string, b: string) =>
-    //       a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
-    //   },
-    //   {
-    //     name: "pile",
-    //     align: "left",
-    //     label: "กอง",
-    //     sortable: true,
-    //     field: "pile",
-    //     headerStyle: "font-size: 14px",
-    //     style: "font-size: 14px",
-    //     sort: (a: string, b: string) =>
-    //       a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
-    //   },
-    //   {
-    //     name: "org",
-    //     align: "left",
-    //     label: "สังกัด",
-    //     sortable: true,
-    //     field: "org",
-    //     headerStyle: "font-size: 14px",
-    //     style: "font-size: 14px",
-    //     sort: (a: string, b: string) =>
-    //       a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
-    //   },
-    {
-        name: "startDate",
-        align: "left",
-        label: "เริ่ม",
-        sortable: true,
-        field: "startDate",
-        headerStyle: "font-size: 14px",
-        style: "font-size: 14px; width:15%;",
-        sort: (a: string, b: string) =>
-            a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
-    },
-    {
-        name: "endDate",
-        align: "left",
-        label: "สิ้นสุด",
-        sortable: true,
-        field: "endDate",
-        headerStyle: "font-size: 14px",
-        style: "font-size: 14px; width:15%;",
-        sort: (a: string, b: string) =>
-            a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
-    },
-    {
-        name: "rangeDate",
-        align: "left",
-        label: "ระยะเวลา",
-        sortable: true,
-        field: "rangeDate",
-        headerStyle: "font-size: 14px",
-        style: "font-size: 14px; width:20%;",
-        sort: (a: string, b: string) =>
-            a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
-    },
+  {
+    name: "position",
+    align: "left",
+    label: "ชื่อตำแหน่ง",
+    sortable: true,
+    field: "position",
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px; width:25%;",
+    sort: (a: string, b: string) =>
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+  },
+  {
+    name: "type",
+    align: "left",
+    label: "ประเภท",
+    sortable: true,
+    field: "type",
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px; width:20%;",
+    sort: (a: string, b: string) =>
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+  },
+  //   {
+  //     name: "group",
+  //     align: "left",
+  //     label: "กลุ่ม/ฝ่าย",
+  //     sortable: true,
+  //     field: "group",
+  //     headerStyle: "font-size: 14px",
+  //     style: "font-size: 14px",
+  //     sort: (a: string, b: string) =>
+  //       a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+  //   },
+  //   {
+  //     name: "pile",
+  //     align: "left",
+  //     label: "กอง",
+  //     sortable: true,
+  //     field: "pile",
+  //     headerStyle: "font-size: 14px",
+  //     style: "font-size: 14px",
+  //     sort: (a: string, b: string) =>
+  //       a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+  //   },
+  //   {
+  //     name: "org",
+  //     align: "left",
+  //     label: "สังกัด",
+  //     sortable: true,
+  //     field: "org",
+  //     headerStyle: "font-size: 14px",
+  //     style: "font-size: 14px",
+  //     sort: (a: string, b: string) =>
+  //       a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+  //   },
+  {
+    name: "startDate",
+    align: "left",
+    label: "เริ่ม",
+    sortable: true,
+    field: "startDate",
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px; width:15%;",
+    sort: (a: string, b: string) =>
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+  },
+  {
+    name: "endDate",
+    align: "left",
+    label: "สิ้นสุด",
+    sortable: true,
+    field: "endDate",
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px; width:15%;",
+    sort: (a: string, b: string) =>
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+  },
+  {
+    name: "rangeDate",
+    align: "left",
+    label: "ระยะเวลา",
+    sortable: true,
+    field: "rangeDate",
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px; width:20%;",
+    sort: (a: string, b: string) =>
+      a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+  },
 ]);
 
 watch(visibleColumns, async (count: String[], prevCount: String[]) => {
-    await changeExamColumns("career", count);
+  await changeExamColumns("career", count);
 });
 
 watch(startDate, async (count: Date, prevCount: Date) => {
-    await calDate();
+  await calDate();
 });
 
 watch(endDate, async (count: Date, prevCount: Date) => {
-    await calDate();
+  await calDate();
 });
 
 onMounted(async () => {
-    await fetchData();
+  await fetchData();
 });
 
 const calDate = async () => {
-    let _startDate = new Date(startDate.value.toISOString().substr(0, 10));
-    let _endDate = new Date(endDate.value.toISOString().substr(0, 10));
-    _endDate.setDate(_endDate.getDate() + 1);
-    if (_startDate > _endDate) {
-        const swap = _startDate;
-        _startDate = _endDate;
-        _endDate = swap;
-    }
-    const startYear = _startDate.getFullYear();
-    const february =
-        (startYear % 4 === 0 && startYear % 100 !== 0) || startYear % 400 === 0
-            ? 29
-            : 28;
-    const daysInMonth = [31, february, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
+  let _startDate = new Date(startDate.value.toISOString().substr(0, 10));
+  let _endDate = new Date(endDate.value.toISOString().substr(0, 10));
+  _endDate.setDate(_endDate.getDate() + 1);
+  if (_startDate > _endDate) {
+    const swap = _startDate;
+    _startDate = _endDate;
+    _endDate = swap;
+  }
+  const startYear = _startDate.getFullYear();
+  const february =
+    (startYear % 4 === 0 && startYear % 100 !== 0) || startYear % 400 === 0
+      ? 29
+      : 28;
+  const daysInMonth = [31, february, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
 
-    let yearDiff = _endDate.getFullYear() - startYear;
-    let monthDiff = _endDate.getMonth() - _startDate.getMonth();
-    if (monthDiff < 0) {
-        yearDiff--;
-        monthDiff += 12;
+  let yearDiff = _endDate.getFullYear() - startYear;
+  let monthDiff = _endDate.getMonth() - _startDate.getMonth();
+  if (monthDiff < 0) {
+    yearDiff--;
+    monthDiff += 12;
+  }
+  let dayDiff = _endDate.getDate() - _startDate.getDate();
+  if (dayDiff < 0) {
+    if (monthDiff > 0) {
+      monthDiff--;
+    } else {
+      yearDiff--;
+      monthDiff = 11;
     }
-    let dayDiff = _endDate.getDate() - _startDate.getDate();
-    if (dayDiff < 0) {
-        if (monthDiff > 0) {
-            monthDiff--;
-        } else {
-            yearDiff--;
-            monthDiff = 11;
-        }
-        dayDiff += daysInMonth[_startDate.getMonth()];
-    }
-    rangeDate.value = `${yearDiff > 0 ? yearDiff + " ปี " : ""}${monthDiff > 0 ? monthDiff + " เดือน " : ""
-        }${dayDiff > 0 ? dayDiff + " วัน " : ""}`;
+    dayDiff += daysInMonth[_startDate.getMonth()];
+  }
+  rangeDate.value = `${yearDiff > 0 ? yearDiff + " ปี " : ""}${
+    monthDiff > 0 ? monthDiff + " เดือน " : ""
+  }${dayDiff > 0 ? dayDiff + " วัน " : ""}`;
 };
 
 const calDateSplit = async (startDate: Date, endDate: Date) => {
-    let _startDate = new Date(startDate.toISOString().substr(0, 10));
-    let _endDate = new Date(endDate.toISOString().substr(0, 10));
-    _endDate.setDate(_endDate.getDate() + 1);
-    if (_startDate > _endDate) {
-        const swap = _startDate;
-        _startDate = _endDate;
-        _endDate = swap;
-    }
-    const startYear = _startDate.getFullYear();
-    const february =
-        (startYear % 4 === 0 && startYear % 100 !== 0) || startYear % 400 === 0
-            ? 29
-            : 28;
-    const daysInMonth = [31, february, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
+  let _startDate = new Date(startDate.toISOString().substr(0, 10));
+  let _endDate = new Date(endDate.toISOString().substr(0, 10));
+  _endDate.setDate(_endDate.getDate() + 1);
+  if (_startDate > _endDate) {
+    const swap = _startDate;
+    _startDate = _endDate;
+    _endDate = swap;
+  }
+  const startYear = _startDate.getFullYear();
+  const february =
+    (startYear % 4 === 0 && startYear % 100 !== 0) || startYear % 400 === 0
+      ? 29
+      : 28;
+  const daysInMonth = [31, february, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
 
-    let yearDiff = _endDate.getFullYear() - startYear;
-    let monthDiff = _endDate.getMonth() - _startDate.getMonth();
-    if (monthDiff < 0) {
-        yearDiff--;
-        monthDiff += 12;
+  let yearDiff = _endDate.getFullYear() - startYear;
+  let monthDiff = _endDate.getMonth() - _startDate.getMonth();
+  if (monthDiff < 0) {
+    yearDiff--;
+    monthDiff += 12;
+  }
+  let dayDiff = _endDate.getDate() - _startDate.getDate();
+  if (dayDiff < 0) {
+    if (monthDiff > 0) {
+      monthDiff--;
+    } else {
+      yearDiff--;
+      monthDiff = 11;
     }
-    let dayDiff = _endDate.getDate() - _startDate.getDate();
-    if (dayDiff < 0) {
-        if (monthDiff > 0) {
-            monthDiff--;
-        } else {
-            yearDiff--;
-            monthDiff = 11;
-        }
-        dayDiff += daysInMonth[_startDate.getMonth()];
-    }
-    var obj = {
-        yearDiff: yearDiff,
-        monthDiff: monthDiff,
-        dayDiff: dayDiff,
-    };
-    return obj;
+    dayDiff += daysInMonth[_startDate.getMonth()];
+  }
+  var obj = {
+    yearDiff: yearDiff,
+    monthDiff: monthDiff,
+    dayDiff: dayDiff,
+  };
+  return obj;
 };
 
 const fetchData = async () => {
-    showLoader();
-    await http
-        .get(config.API.candidateCareer(candidateId.value))
-        .then((res) => {
-            const data = res.data.result;
-            var yearDiff = 0;
-            var monthDiff = 0;
-            var dayDiff = 0;
-            total.value = "-";
-            rows.value = [];
-            data.map((r: any) => {
-                rows.value.push({
-                    ...r,
-                    startDate: new Date(r.durationStart),
-                    endDate: new Date(r.durationEnd),
-                });
-                calDateSplit(new Date(r.durationStart), new Date(r.durationEnd)).then(
-                    (d) => {
-                        yearDiff = yearDiff + d.yearDiff;
-                        monthDiff = monthDiff + d.monthDiff;
-                        dayDiff = dayDiff + d.dayDiff;
-                        if (dayDiff >= 30) {
-                            monthDiff = monthDiff + parseInt((dayDiff / 30).toString());
-                            dayDiff = dayDiff % 30;
-                        }
-                        if (monthDiff >= 12) {
-                            yearDiff = yearDiff + parseInt((monthDiff / 12).toString());
-                            monthDiff = monthDiff % 12;
-                        }
-                        total.value = `${yearDiff > 0 ? yearDiff + " ปี " : ""}${monthDiff > 0 ? monthDiff + " เดือน " : ""
-                            }${dayDiff > 0 ? dayDiff + " วัน " : ""}`;
-                    }
-                );
-            });
-        })
-        .catch((e) => {
-            messageError($q, e);
-        })
-        .finally(() => {
-            hideLoader();
+  showLoader();
+  await http
+    .get(config.API.candidateCareer(candidateId.value))
+    .then((res) => {
+      const data = res.data.result;
+      var yearDiff = 0;
+      var monthDiff = 0;
+      var dayDiff = 0;
+      total.value = "-";
+      rows.value = [];
+      data.map((r: any) => {
+        rows.value.push({
+          ...r,
+          startDate: new Date(r.durationStart),
+          endDate: new Date(r.durationEnd),
         });
+        calDateSplit(new Date(r.durationStart), new Date(r.durationEnd)).then(
+          (d) => {
+            yearDiff = yearDiff + d.yearDiff;
+            monthDiff = monthDiff + d.monthDiff;
+            dayDiff = dayDiff + d.dayDiff;
+            if (dayDiff >= 30) {
+              monthDiff = monthDiff + parseInt((dayDiff / 30).toString());
+              dayDiff = dayDiff % 30;
+            }
+            if (monthDiff >= 12) {
+              yearDiff = yearDiff + parseInt((monthDiff / 12).toString());
+              monthDiff = monthDiff % 12;
+            }
+            total.value = `${yearDiff > 0 ? yearDiff + " ปี " : ""}${
+              monthDiff > 0 ? monthDiff + " เดือน " : ""
+            }${dayDiff > 0 ? dayDiff + " วัน " : ""}`;
+          }
+        );
+      });
+    })
+    .catch((e) => {
+      messageError($q, e);
+    })
+    .finally(() => {
+      hideLoader();
+    });
 };
 
 /**
  * กดดูข้อมูลก่อนหน้า
  */
 const clickPrevious = async () => {
-    rowIndex.value -= 1;
-    const row = rows.value[rowIndex.value];
-    position.value = row.position;
-    group.value = row.group;
-    pile.value = row.pile;
-    org.value = row.org;
-    startDate.value = row.startDate;
-    endDate.value = row.endDate;
-    rangeDate.value = row.rangeDate;
-    type.value = row.type;
-    id.value = row.id;
-    await checkRowPage();
+  rowIndex.value -= 1;
+  const row = rows.value[rowIndex.value];
+  position.value = row.position;
+  group.value = row.group;
+  pile.value = row.pile;
+  org.value = row.org;
+  startDate.value = row.startDate;
+  endDate.value = row.endDate;
+  rangeDate.value = row.rangeDate;
+  type.value = row.type;
+  id.value = row.id;
+  await checkRowPage();
 };
 
 /**
  * กดดูข้อมูลต่อไป
  */
 const clickNext = () => {
-    rowIndex.value += 1;
-    const row = rows.value[rowIndex.value];
-    position.value = row.position;
-    group.value = row.group;
-    pile.value = row.pile;
-    org.value = row.org;
-    startDate.value = row.startDate;
-    endDate.value = row.endDate;
-    rangeDate.value = row.rangeDate;
-    type.value = row.type;
-    id.value = row.id;
-    checkRowPage();
+  rowIndex.value += 1;
+  const row = rows.value[rowIndex.value];
+  position.value = row.position;
+  group.value = row.group;
+  pile.value = row.pile;
+  org.value = row.org;
+  startDate.value = row.startDate;
+  endDate.value = row.endDate;
+  rangeDate.value = row.rangeDate;
+  type.value = row.type;
+  id.value = row.id;
+  checkRowPage();
 };
 
 /**
  * เช็คปุ่มดูข้อมูล ย้อน กับ ต่อไป ว่าต้องแสดงไหม
  */
 const checkRowPage = () => {
-    editRow.value = false;
-    next.value = true;
-    previous.value = true;
-    if (rowIndex.value + 1 >= rows.value.length) {
-        next.value = false;
-    }
-    if (rowIndex.value - 1 < 0) {
-        previous.value = false;
-    }
+  editRow.value = false;
+  next.value = true;
+  previous.value = true;
+  if (rowIndex.value + 1 >= rows.value.length) {
+    next.value = false;
+  }
+  if (rowIndex.value - 1 < 0) {
+    previous.value = false;
+  }
 };
 
 /**
  * กดปุ่มแก้ไขใน dialog
  */
 const clickEdit = () => {
-    next.value = false;
-    previous.value = false;
+  next.value = false;
+  previous.value = false;
 };
 
 /**
  * กดปุ่มเพิ่มด้านบน table
  */
 const clickAdd = () => {
-    addRow();
+  addRow();
 };
 
 const checkDelete = (row: RequestItemsObject) => {
-    rawItem.value = row;
-    modalDelete(
-        $q,
-        "ยืนยันการลบข้อมูล",
-        "หากต้องการลบกดให้กดตกลง",
-        clickDeleteRow
-    );
+  rawItem.value = row;
+  modalDelete(
+    $q,
+    "ยืนยันการลบข้อมูล",
+    "หากต้องการลบกดให้กดตกลง",
+    clickDeleteRow
+  );
 };
 
 //validat enddate
 const endDateValidation = (value: Date) => {
-    if (startDate.value < endDate.value) {
-        return true;
-    }
-    return false;
+  if (startDate.value < endDate.value) {
+    return true;
+  }
+  return false;
 };
 
 /**
  * ลบข้อมูลใน table
  */
 const clickDeleteRow = async () => {
-    if (rawItem.value != null) {
-        showLoader();
-        await http
-            .delete(config.API.candidateAdminCareer(rawItem.value.id))
-            .then(() => {
-                success($q, "ลบข้อมูลสำเร็จ");
-            })
-            .catch((e) => {
-                messageError($q, e);
-            })
-            .finally(async () => {
-                await fetchData();
-            });
-    } else {
+  if (rawItem.value != null) {
+    showLoader();
+    await http
+      .delete(config.API.candidateAdminCareer(rawItem.value.id))
+      .then(() => {
+        success($q, "ลบข้อมูลสำเร็จ");
+      })
+      .catch((e) => {
+        messageError($q, e);
+      })
+      .finally(async () => {
         await fetchData();
-    }
+      });
+  } else {
+    await fetchData();
+  }
 };
 
 /**
  * กดบันทึกใน dialog
  */
 const clickSave = async () => {
-    myForm.value.validate().then(async (result: boolean) => {
-        if (result) {
-            if (modalEdit.value) {
-                await editData();
-            } else {
-                await saveData();
-            }
-        }
-    });
+  myForm.value.validate().then(async (result: boolean) => {
+    if (result) {
+      if (modalEdit.value) {
+        await editData();
+      } else {
+        await saveData();
+      }
+    }
+  });
 };
 
 /**
  * บันทึกเพิ่มข้อมูล
  */
 const saveData = async () => {
-    showLoader();
-    await http
-        .post(config.API.candidateAdminCareer(candidateId.value), {
-            position: position.value,
-            group: group.value,
-            pile: pile.value,
-            org: org.value,
-            durationStart: dateToISO(new Date(startDate.value)),
-            durationEnd: dateToISO(new Date(endDate.value)),
-            rangeDate: rangeDate.value,
-            type: type.value,
-        })
-        .then(() => {
-            success($q, "บันทึกข้อมูลสำเร็จ");
-        })
-        .catch((e) => {
-            messageError($q, e);
-        })
-        .finally(async () => {
-            modal.value = false;
-            await fetchData();
-        });
+  showLoader();
+  await http
+    .post(config.API.candidateAdminCareer(candidateId.value), {
+      position: position.value,
+      group: group.value,
+      pile: pile.value,
+      org: org.value,
+      durationStart: dateToISO(new Date(startDate.value)),
+      durationEnd: dateToISO(new Date(endDate.value)),
+      rangeDate: rangeDate.value,
+      type: type.value,
+    })
+    .then(() => {
+      success($q, "บันทึกข้อมูลสำเร็จ");
+    })
+    .catch((e) => {
+      messageError($q, e);
+    })
+    .finally(async () => {
+      modal.value = false;
+      await fetchData();
+    });
 };
 
 /**
  * บันทึกแก้ไขข้อมูล
  */
 const editData = async () => {
-    showLoader();
-    await http
-        .put(config.API.candidateAdminCareer(id.value), {
-            position: position.value,
-            group: group.value,
-            pile: pile.value,
-            org: org.value,
-            durationStart: dateToISO(new Date(startDate.value)),
-            durationEnd: dateToISO(new Date(endDate.value)),
-            rangeDate: rangeDate.value,
-            type: type.value,
-        })
-        .then(() => {
-            success($q, "บันทึกข้อมูลสำเร็จ");
-        })
-        .catch((e) => {
-            messageError($q, e);
-        })
-        .finally(async () => {
-            modal.value = false;
-            await fetchData();
-        });
+  showLoader();
+  await http
+    .put(config.API.candidateAdminCareer(id.value), {
+      position: position.value,
+      group: group.value,
+      pile: pile.value,
+      org: org.value,
+      durationStart: dateToISO(new Date(startDate.value)),
+      durationEnd: dateToISO(new Date(endDate.value)),
+      rangeDate: rangeDate.value,
+      type: type.value,
+    })
+    .then(() => {
+      success($q, "บันทึกข้อมูลสำเร็จ");
+    })
+    .catch((e) => {
+      messageError($q, e);
+    })
+    .finally(async () => {
+      modal.value = false;
+      await fetchData();
+    });
 };
 
 const checkClose = async () => {
-    if (editRow.value == true) {
-        modalConfirm(
-            $q,
-            "ข้อมูลมีการแก้ไข",
-            "ยืนยันการดำเนินต่อใช่หรือไม่",
-            clickClose
-        );
-    } else {
-        await clickClose();
-    }
-    await fetchData();
+  if (editRow.value == true) {
+    modalConfirm(
+      $q,
+      "ข้อมูลมีการแก้ไข",
+      "ยืนยันการดำเนินต่อใช่หรือไม่",
+      clickClose
+    );
+  } else {
+    await clickClose();
+  }
+  await fetchData();
 };
 
 /**
  * กดปิด dialog
  */
 const clickClose = async () => {
-    modal.value = false;
-    editRow.value = false;
-    next.value = false;
-    previous.value = false;
+  modal.value = false;
+  editRow.value = false;
+  next.value = false;
+  previous.value = false;
 };
 
 /**
@@ -673,57 +794,57 @@ const clickClose = async () => {
  * @param props ค่า props ใน row ที่เลือก
  */
 const selectData = (props: any) => {
-    modalEdit.value = true;
-    modal.value = true;
-    editRow.value = false;
-    rawItem.value = props.row;
-    rowIndex.value = props.rowIndex;
-    position.value = props.row.position;
-    group.value = props.row.group;
-    pile.value = props.row.pile;
-    org.value = props.row.org;
-    startDate.value = props.row.startDate;
-    endDate.value = props.row.endDate;
-    rangeDate.value = props.row.rangeDate;
-    type.value = props.row.type;
-    id.value = props.row.id;
-    next.value = false;
-    previous.value = false;
+  modalEdit.value = true;
+  modal.value = true;
+  editRow.value = false;
+  rawItem.value = props.row;
+  rowIndex.value = props.rowIndex;
+  position.value = props.row.position;
+  group.value = props.row.group;
+  pile.value = props.row.pile;
+  org.value = props.row.org;
+  startDate.value = props.row.startDate;
+  endDate.value = props.row.endDate;
+  rangeDate.value = props.row.rangeDate;
+  type.value = props.row.type;
+  id.value = props.row.id;
+  next.value = false;
+  previous.value = false;
 };
 
 /**
  * กดปุ่มเพิ่มบน table
  */
 const addRow = () => {
-    modalEdit.value = false;
-    modal.value = true;
-    position.value = null;
-    group.value = null;
-    pile.value = null;
-    org.value = null;
-    startDate.value = new Date();
-    endDate.value = new Date();
-    rangeDate.value = null;
-    type.value = null;
+  modalEdit.value = false;
+  modal.value = true;
+  position.value = null;
+  group.value = null;
+  pile.value = null;
+  org.value = null;
+  startDate.value = new Date();
+  endDate.value = new Date();
+  rangeDate.value = null;
+  type.value = null;
 };
 
 /**
  * เช็คว่ามีการแก้ไขข้อมูล
  */
 const clickEditRow = () => {
-    editRow.value = true;
+  editRow.value = true;
 };
 
 /**
  * validate input ใน dialog
  */
 const validateData = async () => {
-    checkValidate.value = true;
-    await myForm.value.validate().then((result: boolean) => {
-        if (result == false) {
-            checkValidate.value = false;
-        }
-    });
+  checkValidate.value = true;
+  await myForm.value.validate().then((result: boolean) => {
+    if (result == false) {
+      checkValidate.value = false;
+    }
+  });
 };
 
 /**
@@ -731,14 +852,14 @@ const validateData = async () => {
  * @param val ข้อมูล input สำหรับแก้ไขหรือไม่
  */
 const getClass = (val: boolean) => {
-    return {
-        "full-width inputgreen cursor-pointer": val,
-        "full-width cursor-pointer": !val,
-    };
+  return {
+    "full-width inputgreen cursor-pointer": val,
+    "full-width cursor-pointer": !val,
+  };
 };
 </script>
 <style lang="scss">
 .modalfix {
-    position: fixed !important;
+  position: fixed !important;
 }
 </style>
diff --git a/src/modules/03_recruiting/views/02_qualify/PeriodAdd.vue b/src/modules/03_recruiting/views/02_qualify/PeriodAdd.vue
index 2f269d835..16f962af9 100644
--- a/src/modules/03_recruiting/views/02_qualify/PeriodAdd.vue
+++ b/src/modules/03_recruiting/views/02_qualify/PeriodAdd.vue
@@ -1179,7 +1179,7 @@ const name = ref<string>("");
 const note = ref<string>("");
 const editor = ref<string>("");
 const editorCondition = ref<string>(
-  `<div style="text-align: center;"><span style="color: rgb(193, 0, 21); font-weight: 700; letter-spacing: 0.14992px;">ข้อกำหนดและเงื่อนไขฉบับนี้ ถือเป็นข้อตกลงในการเก็บข้อมูล</span><br></div><div><p style="margin-bottom: 16px;"><span style="font-size: 14px;">&nbsp; &nbsp;&nbsp;ข้าพเจ้าได้ศึกษาและทำความเข้าใจพระราชบัญญัติคุ้มครองข้อมูลส่วนบุคคล พ.ศ. 2562 ตลอดจนประกาศและระเบียบที่เกี่ยวข้องโดยละเอียดครบถ้วนแล้ว ข้าพเจ้ายินยอมให้หน่วยงานหรือบุคคลที่เกี่ยวข้องกับการดำเนินการสรรหา สามารถเก็บ รวบรวม ใช้และเปิดเผยข้อมูลส่วนบุคคลที่เกี่ยวข้องกับข้าพเจ้า เพื่อประโยชน์ของทางราชการตามกฎหมายที่เกี่ยวข้อง</span></p></div>`
+  `<div style="text-align: center;"><span style="color: rgb(193, 0, 21); font-weight: 700; letter-spacing: 0.14992px;">ข้อกำหนดและเงื่อนไขฉบับนี้ ถือเป็นข้อตกลงในการเก็บข้อมูล</span><br></div><div style="text-align: center;"><span style="color: rgb(193, 0, 21); font-weight: 700; letter-spacing: 0.14992px;"><br></span></div><div><p style="margin-bottom: 16px;"><span style="font-size: 14px;">&nbsp; &nbsp;&nbsp;ข้าพเจ้าได้ศึกษาและทำความเข้าใจพระราชบัญญัติคุ้มครองข้อมูลส่วนบุคคล พ.ศ. 2562 ตลอดจนประกาศและระเบียบที่เกี่ยวข้องโดยละเอียดครบถ้วนแล้ว ข้าพเจ้ายินยอมให้หน่วยงานหรือบุคคลที่เกี่ยวข้องกับการดำเนินการสรรหา สามารถเก็บ รวบรวม ใช้และเปิดเผยข้อมูลส่วนบุคคลที่เกี่ยวข้องกับข้าพเจ้า เพื่อประโยชน์ของทางราชการตามกฎหมายที่เกี่ยวข้อง</span></p></div>`
 );
 const editorConfirm = ref<string>(
   `<div style="text-align: center;"><span style="color: rgb(93, 190, 21); font-weight: 700; letter-spacing: 0.14992px;">คำรับรอง</span><br></div><div><div style=""><div style=""><font color="#35473c"><span style="font-size: 14px;"><br></span></font></div><div style=""><font color="#35473c"><span style="font-size: 14px;">1.<span style="white-space: pre;"> </span>ข้าพเจ้าขอให้คำรับรองว่า ข้อความดังกล่าวข้างต้นเป็นจริงทุกประการ และข้าพเจ้ามีคุณสมบัติทั่วไปและไม่มีลักษณะต้องห้ามตามมาตรา 43 แห่งพระราชบัญญัติระเบียบข้าราชการกรุงเทพมหานครและบุคลากรกรุงเทพมหานคร พ.ศ. 2554 และมีคุณสมบัติเฉพาะสำหรับตำแหน่งที่สมัครตรงตามประกาศรับสมัคร</span></font></div><div style=""><font color="#35473c"><span style="font-size: 14px;">2.<span style="white-space:pre"> </span>กรณีข้าพเจ้ามีลักษณะต้องห้าม ตามมาตรา 43 ข. แห่งพระราชบัญญัติระเบียบข้าราชการกรุงเทพมหานครและบุคลากรกรุงเทพมหานคร พ.ศ. 2554 และประสงค์จะยื่นคำขอยกเว้นเข้ารับราชการฯ ต่อสำนักงาน ก.ก. ตามระเบียบ ก.ก. ว่าด้วยการยกเว้นให้ผู้มีลักษณะต้องห้ามเข้ารับราชการเป็นข้าราชการกรุงเทพมหานคร พ.ศ. 2556 ตามมติ ก.ก. ครั้งที่ 7/2556 เมื่อวันที่ 15 สิงหาคม 2556 ข้าพเจ้าจะยื่นคำขอยกเว้นฯ ภายในวันปิดรับสมัคร ทั้งนี้ หากยื่นภายหลังกำหนด สำนักงาน ก.ก. จะไม่รับคำขอดังกล่าว</span></font></div><div style=""><font color="#35473c"><span style="font-size: 14px;">3.<span style="white-space:pre"> </span>ข้าพเจ้าจะยื่นหลักฐานและเอกสารที่แสดงว่า เป็นผู้มีคุณสมบัติทั่วไปและมีคุณสมบัติเฉพาะสำหรับตำแหน่งที่สมัครตรงตามประกาศรับสมัครภายในระยะเวลาที่กำหนดตามประกาศฯ หากมีการตรวจสอบหลักฐานและเอกสาร และหรือคุณวุฒิการศึกษาของข้าพเจ้าในภายหลังปรากฏว่าข้าพเจ้ามีคุณสมบัติไม่ตรงหรือมีลักษณะต้องห้ามตามประกาศรับสมัครหรือไม่ได้รับการยกเว้นให้ถือว่า ข้าพเจ้าเป็นผู้ขาดคุณสมบัติในการสมัครครั้งนี้มาตั้งแต่ต้น และไม่มีสิทธิได้รับการบรรจุและแต่งตั้งให้ดำรงตำแหน่ง และข้าพเจ้าจะไม่มีสิทธิเรียกร้องใด ๆ ทั้งสิ้น และหากข้าพเจ้าจงใจกรอกข้อความอันเป็นเท็จ อาจมีความผิดทางอาญาฐานแจ้งความเท็จต่อเจ้าพนักงาน ตามประมวลกฎหมายอาญา มาตรา 137</span></font></div><div style=""><font color="#35473c"><span style="font-size: 14px;">4.<span style="white-space:pre"> </span>ข้าพเจ้าได้ศึกษาและทำความเข้าใจพระราชบัญญัติคุ้มครองข้อมูลส่วนบุคคล พ.ศ. 2562 ตลอดจนประกาศและระเบียบที่เกี่ยวข้องโดยละเอียดครบถ้วนแล้ว ข้าพเจ้าขอแสดงความยินยอมให้หน่วยงานหรือบุคคลที่เกี่ยวข้องกับการดำเนินการสรรหา สามารถเก็บ รวบรวม ใช้และเปิดเผยข้อมูลส่วนบุคคลที่เกี่ยวข้องกับข้าพเจ้า เพื่อประโยชน์ของทางราชการตามกฎหมายที่เกี่ยวข้อง</span></font></div><div style=""><font color="#35473c"><span style="font-size: 14px;">5.<span style="white-space:pre"> </span>ข้าพเจ้ารับทราบว่าการส่งใบสมัครคัดเลือกฯ พร้อมเอกสารนี้ ยังไม่ได้รับการตรวจสอบคุณสมบัติตามหลักเกณฑ์ ประกาศรับสมัครคัดเลือก และเงื่อนไขต่าง ๆ โดยจะได้รับการตรวจสอบคุณสมบัติเมื่อเป็นผู้สอบผ่านข้อเขียนภาคความรู้ความสามารถที่ใช้เฉพาะตำแหน่งแล้วเท่านั้น</span></font></div></div>`
diff --git a/src/modules/03_recruiting/views/02_qualify/manageDetail.vue b/src/modules/03_recruiting/views/02_qualify/manageDetail.vue
index 640278b5a..6184531fc 100644
--- a/src/modules/03_recruiting/views/02_qualify/manageDetail.vue
+++ b/src/modules/03_recruiting/views/02_qualify/manageDetail.vue
@@ -481,7 +481,7 @@ const fetchData = async () => {
           avatar: r.profileImg != null ? r.profileImg.detail : "",
           citizenId: r.citizenId,
           number: r.number,
-          registerDate: date2Thai(r.registerDate),
+          registerDate: date2Thai(r.registerDate, false, true),
           examIdenNumber: r.examIdenNumber,
           seatNumber: r.seatNumber,
           resultC: r.resultC,