Merge branch 'develop' into devTee

2025-04-24 10:18:21 +07:00 · 2025-04-24 10:18:21 +07:00 · 2ec7426576
commit 2ec7426576
parent 3ad8096378 21156b8782
23 changed files with 1297 additions and 1271 deletions
--- a/src/api/12_evaluatePersonal/api.evaluate.ts
+++ b/src/api/12_evaluatePersonal/api.evaluate.ts
@ -9,10 +9,10 @@ export default {
  evaluationMain: () => `${evaluation}`,

  evaluateGetDetail: (id: string) => `${evaluation}/admin/check-spec/${id}`,
-  evaluateGetReport: (id: string) => `${evaluation}/report/check-spec-report/${id}`,
+  evaluateGetReport: (id: string) =>
+    `${evaluation}/report/check-spec-report/${id}`,
  evaluateGetStep: (id: string) => `${evaluation}/check/admin/${id}`,

-  
  meeting: () => `${evaluation}/meeting`,
  meetingById: (id: string) => `${evaluation}/meeting/${id}`,
  meetingFilebyId: (volume: string, id: string) =>
@ -28,6 +28,9 @@ export default {
  evaluationNext5To6: (id: string) => `${evaluation}/announce/${id}`,
  evaluationNextFinish: (id: string) => `${evaluation}/wait-check-doc-v2/${id}`,

+  evaluationAnnounceTemplete: (type: string, id: string) =>
+    `${evaluation}/${type}-announce-template/${id}`,
+
  evaluationHistory: (id: string) => `${evaluation}/step-history/${id}`,

  evaluationDateAnnounce: (id: string) =>
@ -47,7 +50,8 @@ export default {
    `${evaluation}/choose-meetings/${id}`,

  evaluationListData: (id: string) => `${evaluation}/director-meeting/${id}`,
-  evaluationReport:`${evaluation}/report`,
+  evaluationReport: `${evaluation}/report`,

-  updateEvaluationResult:(id:string) =>`${evaluation}/updateEvaluationResult/${id}`
+  updateEvaluationResult: (id: string) =>
+    `${evaluation}/updateEvaluationResult/${id}`,
 };
--- a/src/modules/02_organization/components/DialogFormAgency.vue
+++ b/src/modules/02_organization/components/DialogFormAgency.vue
@ -279,7 +279,7 @@ function selectOrgLevele(val: string, status: boolean = true) {
          id: "MISSION",
        },
      ];
-
+      break;
    case "SECTION":
      orgLevelSubOptionMain.value = [
        { name: "ฝ่าย", id: "FACTION" },
@ -328,7 +328,7 @@ function selectOrgLevele(val: string, status: boolean = true) {
          id: "SECONDARYSCHOOL",
        },
      ];
-
+      break;
    default:
      break;
  }
--- a/src/modules/04_registryPerson/components/detail/Achievement/01_ProfessionalLicense.vue
+++ b/src/modules/04_registryPerson/components/detail/Achievement/01_ProfessionalLicense.vue
@ -240,20 +240,17 @@ async function uploadfile(subId: string) {

    //อัพโหลไฟล์
    await uploadFile(uploadUrl, fileUpload.value);
-    await updateIsUpload();
+    await updateIsUpload(subId);
  } catch (err) {
    messageError($q, err);
  }
 }

 /** ฟังก์ชันอัพเดทสถานะอัพโหลด*/
-async function updateIsUpload() {
+async function updateIsUpload(subId: string) {
  await http
    .patch(
-      config.API.profileNewCertificateByCertificateId(
-        editId.value,
-        empType.value
-      ),
+      config.API.profileNewCertificateByCertificateId(subId, empType.value),
      {
        isUpload: fileUpload.value ? true : false,
      }
--- a/src/modules/04_registryPerson/components/detail/GovernmentInformation/02_Discipline.vue
+++ b/src/modules/04_registryPerson/components/detail/GovernmentInformation/02_Discipline.vue
@ -400,21 +400,18 @@ async function uploadfile(id: string) {

    //อัพโหลไฟล์
    await uploadFile(uploadUrl, fileUpload.value);
-    await updateIsUpload();
+    await updateIsUpload(id);
  } catch (err) {
    messageError($q, err);
  }
 }

 /** ฟังก์ชันอัพเดทสถานะอัพโหลด*/
-async function updateIsUpload() {
+async function updateIsUpload(id: string) {
  await http
-    .patch(
-      config.API.profileNewDisciplineByDisciplineId(id.value, empType.value),
-      {
-        isUpload: fileUpload.value ? true : false,
-      }
-    )
+    .patch(config.API.profileNewDisciplineByDisciplineId(id, empType.value), {
+      isUpload: fileUpload.value ? true : false,
+    })
    .then(() => {
      fileUpload.value = null;
    });
--- a/src/modules/04_registryPerson/components/detail/PersonalInformation/02_NameChangeHistory.vue
+++ b/src/modules/04_registryPerson/components/detail/PersonalInformation/02_NameChangeHistory.vue
@ -618,7 +618,7 @@ onMounted(async () => {
                  <q-btn
                    v-if="scope.queuedFiles.length > 0"
                    icon="clear_all"
-                    @click="scope.removeQueuedFiles"
+                    @click="scope.removeQueuedFiles, (fileUpload = undefined)"
                    round
                    dense
                    flat
@ -628,7 +628,7 @@ onMounted(async () => {
                  <q-btn
                    v-if="scope.uploadedFiles.length > 0"
                    icon="done_all"
-                    @click="scope.removeUploadedFiles"
+                    @click="scope.removeUploadedFiles, (fileUpload = undefined)"
                    round
                    dense
                    flat
@ -663,7 +663,7 @@ onMounted(async () => {
                  <q-btn
                    v-if="scope.isUploading"
                    icon="clear"
-                    @click="scope.abort"
+                    @click="scope.abort, (fileUpload = undefined)"
                    round
                    dense
                    flat
@ -672,6 +672,36 @@ onMounted(async () => {
                  </q-btn>
                </div>
              </template>
+
+              <template v-slot:list="scope">
+                <q-list separator>
+                  <q-item v-for="file in scope.files" :key="file.__key">
+                    <q-item-section>
+                      <q-item-label class="full-width ellipsis">
+                        {{ file.name }}
+                      </q-item-label>
+
+                      <q-item-label caption>
+                        {{ file.__sizeLabel }} / {{ file.__progressLabel }}
+                      </q-item-label>
+                    </q-item-section>
+
+                    <q-item-section top side>
+                      <q-btn
+                        class="gt-xs"
+                        size="12px"
+                        flat
+                        dense
+                        round
+                        icon="delete"
+                        @click="
+                          scope.removeFile(file), (fileUpload = undefined)
+                        "
+                      />
+                    </q-item-section>
+                  </q-item>
+                </q-list>
+              </template>
            </q-uploader>
            <div
              v-if="alertUpload && dialogStatus === 'create'"
--- a/src/modules/04_registryPerson/components/detail/PersonalInformation/DialogSortEducation.vue
+++ b/src/modules/04_registryPerson/components/detail/PersonalInformation/DialogSortEducation.vue
@ -307,7 +307,7 @@ watch(modal, async () => {
              <q-tr :props="props">
                <q-td>
                  <q-checkbox
-                    :disable="props.rowIndex === 0"
+                    :disable="props.rowIndex === 0 && rows.length > 1"
                    keep-color
                    color="primary"
                    dense
--- a/src/modules/04_registryPerson/components/detail/Salary/01_PositionSalary.vue
+++ b/src/modules/04_registryPerson/components/detail/Salary/01_PositionSalary.vue
@ -679,6 +679,7 @@ function onSubmit() {
        ...formData,
        commandDateAffect: convertDateToAPI(formData.commandDateAffect),
        commandDateSign: convertDateToAPI(formData.commandDateSign),
+        commandName: store.convertCommandCodeName(formData.commandCode),
        amount: Number(String(formData.amount)?.replace(/,/g, "")),
        amountSpecial: Number(
          String(formData.amountSpecial)?.replace(/,/g, "")
@ -690,6 +691,7 @@ function onSubmit() {
          String(formData.mouthSalaryAmount)?.replace(/,/g, "")
        ),
      });
+
      await fetchListSalary();
      onClickCloseDialog();
      success($q, "บันทึกข้อมูลสำเร็จ");
--- a/src/modules/04_registryPerson/components/detail/Salary/02_NotReceiveSalary.vue
+++ b/src/modules/04_registryPerson/components/detail/Salary/02_NotReceiveSalary.vue
@ -233,16 +233,16 @@ async function uploadfile(id: string) {

    //อัพโหลไฟล์
    await uploadFile(uploadUrl, fileUpload.value);
-    await updateIsUpload();
+    await updateIsUpload(id);
  } catch (err) {
    messageError($q, err);
  }
 }

 /** ฟังก์ชันอัพเดทสถานะอัพโหลด*/
-async function updateIsUpload() {
+async function updateIsUpload(id: string) {
  await http
-    .patch(config.API.profileNewNoPaidById(id.value, empType.value), {
+    .patch(config.API.profileNewNoPaidById(id, empType.value), {
      isUpload: fileUpload.value ? true : false,
    })
    .then(() => {
--- a/src/modules/04_registryPerson/stores/RequestEdit.ts
+++ b/src/modules/04_registryPerson/stores/RequestEdit.ts
@ -3,16 +3,20 @@ import { ref } from "vue";
 import type { DataOption } from "@/modules/04_registryPerson/interface/index/Main";

 export const useRequestEditStore = defineStore("requestEditStore", () => {
-  const profileId = ref<string>('')
+  const profileId = ref<string>("");
  const optionTopic = ref<string[]>([
-    "ขอแก้ไขคำนำหน้านาม ชื่อ นามสกุล",
+    "ขอปรับปรุงข้อมูลจากกรมการปกครอง",
    "ขอแก้ไขรูปภาพประจำตัว",
-    "ขอแก้ไขชื่อ - นามสกุล คู่สมรส",
-    "ขอแก้ไขชื่อ - นามสกุล บิดา",
-    "ขอแก้ไขชื่อ - นามสกุล มารดา",
-    "ขอแก้ไขข้อมูลการได้รับพระราชทานเครื่องราชอิสริยาภรณ์/เหรียญจักรพรรดิมาลา",
-    "ขอแก้ไขประกาศเกียรติคุณ",
+    "ขอแก้ไขข้อมูล คู่สมรส",
+    "ขอแก้ไขข้อมูล บิดา",
+    "ขอแก้ไขข้อมูล มารดา",
+    "ขอแก้ไขข้อมูลบุตร",
+    "ขอแก้ไขข้อมูลเครื่องราชฯ เหรียญจักรพรรดิมาลา",
    "ขอแก้ไขข้อมูลประวัติการศึกษา",
+    "ขอแก้ไขข้อมูลประวัติการฝึกอบรม",
+    "ขอแก้ไขใบอนุญาตประกอบวิชาชีพ",
+    "ขอแก้ไขที่อยู่ปัจจุบัน",
+    "ขอแก้ไขใบอนุญาตประกอบวิชาชีพ",
  ]);
  const optionStatus = ref<DataOption[]>([
    { id: "", name: "ทั้งหมด" },
@ -59,6 +63,6 @@ export const useRequestEditStore = defineStore("requestEditStore", () => {
    optionStatus,
    optionStatusIDP,
    convertStatusIDP,
-    profileId
+    profileId,
  };
 });
--- a/src/modules/05_placement/components/probation/ProbationDetail.vue
+++ b/src/modules/05_placement/components/probation/ProbationDetail.vue
@ -362,7 +362,9 @@ onMounted(async () => {
        <div class="col-xs-6 col-sm-3 row items-center">
          <div class="col-12">
            <div class="col-12 text-top">สังกัด</div>
-            <div class="col-12 text-detail">{{ organization }}</div>
+            <div class="col-12 text-detail text-html">
+              {{ organization.replace("\\n", "\n") }}
+            </div>
          </div>
        </div>

--- a/src/modules/07_insignia/components/2_Manage/Tab1.vue
+++ b/src/modules/07_insignia/components/2_Manage/Tab1.vue
@ -715,13 +715,15 @@ async function fecthInsignia() {
 }

 const personId = ref<string>("");
+const profileType = ref<string>("");
 /**
 *  function redirect to ทะเบียนประวัติ
 * @param id profileId
 */
-function nextPage(id: string) {
+function nextPage(id: string, type: string) {
  modalPersonal.value = true;
  personId.value = id;
+  profileType.value = type;
 }

 function updatemodalPersonal(modal: boolean) {
@ -1148,7 +1150,9 @@ onMounted(async () => {
                      <q-item
                        v-if="checkPermission($route)?.attrIsGet"
                        clickable
-                        @click.stop="nextPage(props.row.profileId)"
+                        @click.stop="
+                          nextPage(props.row.profileId, props.row.employeeClass)
+                        "
                        v-close-popup
                      >
                        <q-item-section style="min-width: 0px" avatar>
@ -1217,7 +1221,9 @@ onMounted(async () => {
                  flat
                  round
                  dense
-                  @click.stop="nextPage(props.row.profileId)"
+                  @click.stop="
+                    nextPage(props.row.profileId, props.row.employeeClass)
+                  "
                >
                  <q-tooltip>ดูข้อมูลทะเบียนประวัติ</q-tooltip>
                </q-btn>
@ -1698,6 +1704,7 @@ onMounted(async () => {
  <PopupPersonal
    :modal="modalPersonal"
    :id="personId"
+    :type="profileType"
    @update:modal="updatemodalPersonal"
  />

--- a/src/modules/07_insignia/components/2_Manage/Tab2.vue
+++ b/src/modules/07_insignia/components/2_Manage/Tab2.vue
@ -170,14 +170,15 @@ function changtypeOc() {

 const modalPersonal = ref<boolean>(false);
 const personId = ref<string>("");
-
+const profileType = ref<string>("");
 /**
 *  function redirect ทะเบียนประวัติิ
 * @param id profileId
 */
-function nextPage(id: string) {
+function nextPage(id: string, type: string) {
  modalPersonal.value = true;
  personId.value = id;
+  profileType.value = type;
 }

 function updatemodalPersonal(modal: boolean) {
@ -474,7 +475,9 @@ watch(
                  flat
                  round
                  color="info"
-                  @click="nextPage(props.row.profileId)"
+                  @click="
+                    nextPage(props.row.profileId, props.row.employeeClass)
+                  "
                  icon="mdi-eye"
                >
                  <q-tooltip>ดูข้อมูลทะเบียนประวัติ</q-tooltip>
@ -545,6 +548,7 @@ watch(
  <PopupPersonal
    :modal="modalPersonal"
    :id="personId"
+    :type="profileType"
    @update:modal="updatemodalPersonal"
  />
 </template>
--- a/src/modules/07_insignia/components/2_Manage/Tab3.vue
+++ b/src/modules/07_insignia/components/2_Manage/Tab3.vue
@ -170,14 +170,15 @@ async function changtypeOc() {

 const modalPersonal = ref<boolean>(false);
 const personId = ref<string>("");
-
+const profileType = ref<string>("");
 /**
 *  function redirect ทะเบียนประวัติิ
 * @param id profileId
 */
-function nextPage(id: string) {
+function nextPage(id: string, type: string) {
  modalPersonal.value = true;
  personId.value = id;
+  profileType.value = type;
 }

 function updatemodalPersonal(modal: boolean) {
@ -472,7 +473,9 @@ onMounted(async () => {
                  flat
                  round
                  color="info"
-                  @click="nextPage(props.row.profileId)"
+                  @click="
+                    nextPage(props.row.profileId, props.row.employeeClass)
+                  "
                  icon="mdi-eye"
                >
                  <q-tooltip>ดูข้อมูลทะเบียนประวัติ</q-tooltip>
@ -542,6 +545,7 @@ onMounted(async () => {
  <PopupPersonal
    :modal="modalPersonal"
    :id="personId"
+    :type="profileType"
    @update:modal="updatemodalPersonal"
  />
 </template>
--- a/src/modules/12_evaluatePersonal/components/Detail/step/step2.vue
+++ b/src/modules/12_evaluatePersonal/components/Detail/step/step2.vue
@ -1,3 +1,4 @@
+div
 <script setup lang="ts">
 import { ref, reactive, onMounted } from "vue";
 import { useQuasar } from "quasar";
@ -16,13 +17,19 @@ const { showLoader, hideLoader, messageError } = mixin;

 const id = ref<string>(route.params.id as string); //id ประเมิน
 /** ฟรอมจัดเตรียมเอกสารเล่ม 1*/
-const subject = ref<string>(""); //ชื่อผลงาน
+const subject = ref<string[]>([""]); //ชื่อผลงาน
 const author = ref<string>(""); //เจ้าของผลงาน
 const formCommand = reactive<FormCommand>({
  elementaryFullName: "", //ชื่อ-นามสกุลผู้บังคับบัญชาชั้นต้น
  elementaryPosition: "", //ตำแหน่งผู้บังคับบัญชาชั้นต้น
+  elementaryPositionOld: "", //ตำแหน่งเดิมผู้บังคับบัญชาชั้นต้น
+  elementaryOrg: "", //สังกัดผู้บังคับบัญชาชั้นต้น
+  elementaryOrgOld: "", //สังกัดเดิมผู้บังคับบัญชาชั้นต้น
  abovelevelFullname: "", //ชื่อ-นามสกุลผู้บังคับบัญชาเหนือขึ้นไป 1 ระดับ
  abovelevelPosition: "", //ตำแหน่งผู้บังคับบัญชาเหนือขึ้นไป 1 ระดับ
+  abovelevelPositionOld: "", //ตำแหน่งเดิมผู้บังคับบัญชาเหนือขึ้นไป 1 ระดับ
+  abovelevelOrg: "", //สังกัดผู้บังคับบัญชาเหนือขึ้นไป 1 ระดับ
+  abovelevelOrgOld: "", //สังกัดเดิมผู้บังคับบัญชาเหนือขึ้นไป 1 ระดับ
 });

 /**
@ -35,26 +42,25 @@ async function fetchSigner() {
    .then((res) => {
      const data = res.data.result;
      if (data) {
-        formCommand.elementaryFullName =
-          data == null ? "" : data.commanderFullname;
-        formCommand.elementaryPosition =
-          data == null ? "" : data.commanderPosition;
-        formCommand.abovelevelFullname =
-          data == null ? "" : data.commanderAboveFullname;
-        formCommand.abovelevelPosition =
-          data == null ? "" : data.commanderAbovePosition;
+        formCommand.elementaryFullName = data.commanderFullname;
+        formCommand.elementaryPosition = data.commanderPosition;
+        formCommand.elementaryPositionOld = data.commanderPositionOld;
+        formCommand.elementaryOrg = data.commanderOrg;
+        formCommand.elementaryOrgOld = data.commanderOrgOld;
+        formCommand.abovelevelFullname = data.commanderAboveFullname;
+        formCommand.abovelevelPosition = data.commanderAbovePosition;
+        formCommand.abovelevelPositionOld = data.commanderAbovePositionOld;
+        formCommand.abovelevelOrg = data.commanderAboveOrg;
+        formCommand.abovelevelOrgOld = data.commanderAboveOrgOld;
        author.value = data.author;
        subject.value = data.subject;
      }
    })
    .catch((e) => {
-      // messageError($q, e);
      console.log(e);
    })
    .finally(() => {
-      setTimeout(() => {
-        hideLoader();
-      }, 1000);
+      hideLoader();
    });
 }

@ -74,34 +80,32 @@ onMounted(async () => {
        <q-card bordered style="border: 1px solid #d6dee1">
          <div class="text-weight-medium bg-grey-1 q-py-sm q-px-md">ผลงาน</div>
          <div class="col-12"><q-separator /></div>
-          <div class="row">
-            <div class="col-12 q-pa-sm">
-              <div class="row q-col-gutter-sm col-12">
-                <div class="col-xs-12 col-sm-12 row">
-                  <div class="row col-12 q-col-gutter-sm">
-                    <q-input
-                      readonly
-                      dense
-                      class="col-xs-12 col-sm-6"
-                      outlined
-                      label="ชื่อผลงาน"
-                      v-model="subject"
-                      :rules="[(val:string) => !!val || `${'กรุณากรอกชื่อผลงาน'}`]"
-                      lazy-rules
-                      hide-bottom-space
-                    />
-                    <q-input
-                      readonly
-                      class="col-xs-12 col-sm-6"
-                      dense
-                      outlined
-                      v-model="author"
-                      label="เจ้าของผลงาน"
-                      :rules="[(val:string) => !!val || `${'กรุณากรอกเจ้าของผลงาน'}`]"
-                      lazy-rules
-                      hide-bottom-space
-                    />
-                  </div>
+
+          <div class="col-12 q-pa-sm">
+            <div class="row q-col-gutter-sm">
+              <div class="col-12">
+                <q-input
+                  readonly
+                  dense
+                  outlined
+                  v-model="author"
+                  label="เจ้าของผลงาน"
+                  lazy-rules
+                  hide-bottom-space
+                />
+              </div>
+              <div class="col-12" v-for="(item, index) in subject" :key="index">
+                <div class="row col-12 q-col-gutter-sm">
+                  <q-input
+                    readonly
+                    dense
+                    class="col-xs-12 col-sm-12"
+                    outlined
+                    label="ชื่อผลงาน"
+                    v-model="subject[index]"
+                    lazy-rules
+                    hide-bottom-space
+                  />
                </div>
              </div>
            </div>
@ -123,31 +127,63 @@ onMounted(async () => {
                  <div class="text-weight-medium q-py-xs q-pl-sm">
                    ผู้บังคับบัญชาชั้นต้น
                  </div>
+
                  <div class="row col-12 q-col-gutter-sm">
                    <q-input
                      readonly
-                      ref="elementaryFullNameRef"
                      dense
                      class="col-xs-12 col-sm-6"
                      outlined
-                      label="ชื่อ-นามสกุล"
                      v-model="formCommand.elementaryFullName"
-                      :rules="[(val:string) => !!val || `${'กรุณากรอกชื่อ-นามสกุล'}`]"
-                      lazy-rules
-                      hide-bottom-space
-                    />
-                    <q-input
-                      readonly
-                      ref="elementaryPositonRef"
-                      class="col-xs-12 col-sm-6"
-                      dense
-                      outlined
-                      v-model="formCommand.elementaryPosition"
-                      label="ตำแหน่ง"
-                      :rules="[(val:string) => !!val || `${'กรุณากรอกตำแหน่ง'}`]"
+                      label="ชื่อ-นามสกุล"
                      lazy-rules
                      hide-bottom-space
                    />
+
+                    <div class="col-12">
+                      <div class="row col-12 q-col-gutter-sm">
+                        <q-input
+                          readonly
+                          class="col-xs-6 col-sm-3"
+                          dense
+                          outlined
+                          v-model="formCommand.elementaryPosition"
+                          label="ตำแหน่ง"
+                          lazy-rules
+                          hide-bottom-space
+                        />
+                        <q-input
+                          readonly
+                          class="col-xs-6 col-sm-3"
+                          dense
+                          outlined
+                          v-model="formCommand.elementaryPositionOld"
+                          label="ตำแหน่งเดิม"
+                          lazy-rules
+                          hide-bottom-space
+                        />
+                        <q-input
+                          readonly
+                          class="col-xs-6 col-sm-3"
+                          dense
+                          outlined
+                          v-model="formCommand.elementaryOrg"
+                          label="สังกัด"
+                          lazy-rules
+                          hide-bottom-space
+                        />
+                        <q-input
+                          readonly
+                          class="col-xs-6 col-sm-3"
+                          dense
+                          outlined
+                          v-model="formCommand.elementaryOrgOld"
+                          label="สังกัดเดิม"
+                          lazy-rules
+                          hide-bottom-space
+                        />
+                      </div>
+                    </div>
                  </div>
                </div>
              </div>
@ -170,18 +206,50 @@ onMounted(async () => {
                      lazy-rules
                      hide-bottom-space
                    />
-                    <q-input
-                      ref="abovelevelPositionRef"
-                      class="col-xs-12 col-sm-6"
-                      dense
-                      readonly
-                      outlined
-                      v-model="formCommand.abovelevelPosition"
-                      label="ตำแหน่ง"
-                      :rules="[(val:string) => !!val || `${'กรุณากรอกตำแหน่ง'}`]"
-                      lazy-rules
-                      hide-bottom-space
-                    />
+                    <div class="col-12">
+                      <div class="row col-12 q-col-gutter-sm">
+                        <q-input
+                          readonly
+                          class="col-xs-6 col-sm-3"
+                          dense
+                          outlined
+                          v-model="formCommand.abovelevelPosition"
+                          label="ตำแหน่ง"
+                          lazy-rules
+                          hide-bottom-space
+                        />
+                        <q-input
+                          readonly
+                          class="col-xs-6 col-sm-3"
+                          dense
+                          outlined
+                          v-model="formCommand.abovelevelPositionOld"
+                          label="ตำแหน่งเดิม"
+                          lazy-rules
+                          hide-bottom-space
+                        />
+                        <q-input
+                          readonly
+                          class="col-xs-6 col-sm-3"
+                          dense
+                          outlined
+                          v-model="formCommand.abovelevelOrg"
+                          label="สังกัด"
+                          lazy-rules
+                          hide-bottom-space
+                        />
+                        <q-input
+                          readonly
+                          class="col-xs-6 col-sm-3"
+                          dense
+                          outlined
+                          v-model="formCommand.abovelevelOrgOld"
+                          label="สังกัดเดิม"
+                          lazy-rules
+                          hide-bottom-space
+                        />
+                      </div>
+                    </div>
                  </div>
                </div>
              </div>
--- a/src/modules/12_evaluatePersonal/components/Detail/step/step3.vue
+++ b/src/modules/12_evaluatePersonal/components/Detail/step/step3.vue
@ -22,6 +22,25 @@ const { showLoader, hideLoader, messageError } = mixin;
 const id = ref<string>(route.params.id as string); //id ประเมิน
 const selectedItem = ref<number>(1); //ไฟล์ที่เลือก

+const formTemplates = ref([
+  {
+    title: "แบบพิจารณาคุณสมบัติบุคคล",
+    fileName: "1-แบบพิจารณาคุณสมบัติบุคคล",
+  },
+  {
+    title: "แบบแสดงรายละเอียดการเสนอผลงาน",
+    fileName: "2-แบบแสดงรายละเอียดการเสนอผลงาน",
+  },
+  {
+    title: "แบบประเมินคุณลักษณะบุคคล",
+    fileName: "4-แบบประเมินคุณลักษณะบุคคล",
+  },
+  {
+    title: "ผลงานที่จะส่งประเมิน (เอกสารหมายเลข 11)",
+    fileName: "6-ผลงานที่จะส่งประเมิน (เอกสารหมายเลข 11)",
+  },
+]);
+
 /**
 * funtion เลือกไฟล์
 * @param itemNumber indexItems
@ -29,29 +48,30 @@ const selectedItem = ref<number>(1); //ไฟล์ที่เลือก
 function handleItemClick(itemNumber: number) {
  store.tabPanels = itemNumber.toString();
  selectedItem.value = itemNumber;
-  getFile(itemNumber);
+  store.pdfSrcStore = undefined;
+  fetchDocument(formTemplates.value[itemNumber - 1].fileName);
 }

 /**
- * function เรียกไฟล์
- * @param volume index item
+ * function เรีกยเอกสาร
+ * @param fileName ชื่อเอกสาร
 */
-async function getFile(volume: number) {
+async function fetchDocument(fileName: string) {
  showLoader();
-  const fileText = numToThai(volume);
-  await http
-    .get(config.API.evaluationFilebyId("เล่ม 1", id.value, fileText))
-    .then(async (res) => {
-      const link = res.data.downloadUrl;
-      const type = res.data.fileType;
-      await getPDF(link, type);
-    })
-    .catch((e) => {
-      messageError($q, e);
-      hideLoader();
-
-      store.pdfSrcStore = undefined;
-    });
+  id.value &&
+    (await http
+      .get(config.API.evaluationFilebyId("เล่ม 1", id.value, fileName))
+      .then(async (res) => {
+        const link = res.data.downloadUrl;
+        const type = res.data.fileType;
+        await getPDF(link, type);
+      })
+      .catch((err) => {
+        messageError($q, err);
+      })
+      .finally(() => {
+        hideLoader();
+      }));
 }

 /**
@ -80,111 +100,33 @@ async function getPDF(url: string, type: string) {
        store.log = 1;
        store.pdfSrcStore = pdfData.pdf.value;
        store.numOfPagesStore = pdfData.pages.value;
-        hideLoader();
      }, 1500);
    })
-    .catch(() => {
-      hideLoader();
-    })
    .finally(() => {
+      hideLoader();
      store.log = 0;
    });
 }

-/**
- * function Convert ชื่อไฟล์
- * @param val indexItems
- */
-function numToThai(val: number) {
-  switch (val) {
-    case 1:
-      return "1-แบบพิจารณาคุณสมบัติบุคคล";
-    case 2:
-      return "2-แบบแสดงรายละเอียดการเสนอผลงาน";
-    case 3:
-      return "3-แบบตรวจสอบความถูกต้องครบถ้วนของข้อมูลเพื่อประกอบการคัดเลือกบุคคล (เอกสารแบบ ก)";
-    case 4:
-      return "4-แบบประเมินคุณลักษณะบุคคล";
-    case 5:
-      return "5-แบบสรุปข้อมูลของผู้ขอรับการคัดเลือก (เอกสารหมายเลข 9)";
-    case 6:
-      return "6-ผลงานที่จะส่งประเมิน (เอกสารหมายเลข 11)";
-    default:
-      return "1-แบบพิจารณาคุณสมบัติบุคคล";
-  }
-}
-
+/** HooK lifecycle*/
 onMounted(async () => {
-  await getFile(selectedItem.value);
+  await fetchDocument(formTemplates.value[selectedItem.value - 1].fileName);
 });
 </script>

 <template>
-  <q-list separator dense>
+  <q-list separator>
    <q-item
+      v-for="(item, index) in formTemplates"
+      :key="index"
      clickable
      v-ripple
-      :active="selectedItem === 1 ? true : false"
+      :active="selectedItem === index + 1 ? true : false"
      active-class="text-primary"
-      @click="handleItemClick(1)"
+      @click="handleItemClick(index + 1)"
+      class="cursor-pointer"
    >
-      <q-item-section class="q-py-sm">แบบพิจารณาคุณสมบัติบุคคล</q-item-section>
-    </q-item>
-    <q-item
-      clickable
-      v-ripple
-      :active="selectedItem === 2 ? true : false"
-      active-class="text-primary"
-      @click="handleItemClick(2)"
-    >
-      <q-item-section class="q-py-sm"
-        >แบบแสดงรายละเอียดการเสนอผลงาน</q-item-section
-      >
-    </q-item>
-    <q-item
-      clickable
-      v-ripple
-      :active="selectedItem === 3 ? true : false"
-      active-class="text-primary"
-      @click="handleItemClick(3)"
-    >
-      <q-item-section class="q-py-sm"
-        >แบบตรวจสอบความถูกต้องครบถ้วนของข้อมูลเพื่อประกอบการคัดเลือกบุคคล
-        (เอกสารแบบ ก)</q-item-section
-      >
-    </q-item>
-    <q-item
-      clickable
-      v-ripple
-      :active="selectedItem === 4 ? true : false"
-      active-class="text-primary"
-      @click="handleItemClick(4)"
-    >
-      <q-item-section class="q-py-sm">
-        แบบประเมินคุณลักษณะบุคคล
-      </q-item-section>
-    </q-item>
-    <q-item
-      clickable
-      v-ripple
-      :active="selectedItem === 5 ? true : false"
-      active-class="text-primary"
-      @click="handleItemClick(5)"
-    >
-      <q-item-section class="q-py-sm">
-        แบบสรุปข้อมูลของผู้ขอรับการคัดเลือก (เอกสารหมายเลข 9)
-      </q-item-section>
-    </q-item>
-    <q-item
-      clickable
-      v-ripple
-      :active="selectedItem === 6 ? true : false"
-      active-class="text-primary"
-      @click="handleItemClick(6)"
-    >
-      <q-item-section class="q-py-sm">
-        ผลงานที่จะส่งประเมิน (เอกสารหมายเลข 11)
-      </q-item-section>
+      <q-item-section>{{ item.title }}</q-item-section>
    </q-item>
  </q-list>
 </template>
--- a/src/modules/12_evaluatePersonal/components/Detail/step/step4.vue
+++ b/src/modules/12_evaluatePersonal/components/Detail/step/step4.vue
@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { ref, onMounted } from "vue";
+import { ref, onMounted, reactive } from "vue";
 import { useQuasar } from "quasar";

 import { useRoute } from "vue-router";
@ -11,6 +11,8 @@ import http from "@/plugins/http";
 import config from "@/app.config";
 import genReport from "@/plugins/genreport";

+import DialogHeader from "@/components/DialogHeader.vue";
+
 /** use*/
 const route = useRoute();
 const $q = useQuasar();
@ -40,23 +42,23 @@ const files = [
    fileName: "แบบแสดงรายละเอียดการเสนอผลงาน",
    pathName: "2-แบบแสดงรายละเอียดการเสนอผลงาน",
  },
-  {
-    id: "file3",
-    fileName:
-      "แบบตรวจสอบความถูกต้องครบถ้วนของข้อมูลเพื่อประกอบการคัดเลือกบุคคล (เอกสารแบบ ก)",
-    pathName:
-      "3-แบบตรวจสอบความถูกต้องครบถ้วนของข้อมูลเพื่อประกอบการคัดเลือกบุคคล (เอกสารแบบ ก)",
-  },
+  // {
+  //   id: "file3",
+  //   fileName:
+  //     "แบบตรวจสอบความถูกต้องครบถ้วนของข้อมูลเพื่อประกอบการคัดเลือกบุคคล (เอกสารแบบ ก)",
+  //   pathName:
+  //     "3-แบบตรวจสอบความถูกต้องครบถ้วนของข้อมูลเพื่อประกอบการคัดเลือกบุคคล (เอกสารแบบ ก)",
+  // },
  {
    id: "file4",
    fileName: "แบบประเมินคุณลักษณะบุคคล",
    pathName: "4-แบบประเมินคุณลักษณะบุคคล",
  },
-  {
-    id: "file5",
-    fileName: "แบบสรุปข้อมูลของผู้ขอรับการคัดเลือก (เอกสารหมายเลข 9)",
-    pathName: "5-แบบสรุปข้อมูลของผู้ขอรับการคัดเลือก (เอกสารหมายเลข 9)",
-  },
+  // {
+  //   id: "file5",
+  //   fileName: "แบบสรุปข้อมูลของผู้ขอรับการคัดเลือก (เอกสารหมายเลข 9)",
+  //   pathName: "5-แบบสรุปข้อมูลของผู้ขอรับการคัดเลือก (เอกสารหมายเลข 9)",
+  // },
  {
    id: "file6",
    fileName: "ผลงานที่จะส่งประเมิน (เอกสารหมายเลข 11)",
@ -64,6 +66,72 @@ const files = [
  },
 ];

+const download10Url = ref<string>("");
+
+const modalTemplates = ref<boolean>(false);
+const formBodyTemplates = reactive({
+  detailFooter: "",
+  detailBody: "",
+});
+const formTemplates = ref<any[]>([
+  {
+    code: "EV1_005",
+    templateName: "template-1",
+    title: "แบบพิจารณาคุณสมบัติบุคคล (ฉบับแก้ไข)",
+    fileName: "1-แบบพิจารณาคุณสมบัติบุคคล (ฉบับแก้ไข)",
+    downloadFile: "",
+    fileType: "",
+  },
+  {
+    code: "EV1_006",
+    templateName: "template-2",
+    title: "แบบแสดงรายละเอียดการเสนอผลงาน (ฉบับแก้ไข)",
+    fileName: "2-แบบแสดงรายละเอียดการเสนอผลงาน (ฉบับแก้ไข)",
+    downloadFile: "",
+    fileType: "",
+  },
+  {
+    code: "EV1_008",
+    templateName: "template-4",
+    title: "แบบประเมินคุณลักษณะบุคคล (ฉบับแก้ไข)",
+    fileName: "4-แบบประเมินคุณลักษณะบุคคล (ฉบับแก้ไข)",
+    downloadFile: "",
+    fileType: "",
+  },
+  {
+    code: "EV1_010",
+    templateName: "template-6",
+    title: "ผลงานที่จะส่งประเมิน (เอกสารหมายเลข 11) (ฉบับแก้ไข)",
+    fileName: "6-ผลงานที่จะส่งประเมิน (เอกสารหมายเลข 11) (ฉบับแก้ไข)",
+    downloadFile: "",
+    fileType: "",
+  },
+]);
+
+const fileEvaluatioRef = ref<any>();
+const formEvaluation = ref<any[]>([
+  {
+    code: "EV1_007",
+    templateName: "template-3",
+    title:
+      "แบบตรวจสอบความถูกต้องครบถ้วนของข้อมูลเพื่อประกอบการคัดเลือกบุคคล(เอกสารแบบ ก)",
+    fileName:
+      "3-แบบตรวจสอบความถูกต้องครบถ้วนของข้อมูลเพื่อประกอบการคัดเลือกบุคคล (เอกสารแบบ ก)",
+    downloadFile: "",
+    fileType: "",
+    file: null,
+  },
+  {
+    code: "EV1_009",
+    templateName: "template-5",
+    title: "แบบสรุปข้อมูลของผู้ขอรับการคัดเลือก(เอกสารหมายเลข 9)",
+    fileName: "5-แบบสรุปข้อมูลของผู้ขอรับการคัดเลือก (เอกสารหมายเลข 9)",
+    downloadFile: "",
+    fileType: "",
+    file: null,
+  },
+]);
+
 /**
 * function ดาวน์โหลดไฟล์ต้นแบบ
 */
@ -83,12 +151,13 @@ async function onClickDowloadFile(
        data: data,
      };
      await genReport(body, fileName);
-      hideLoader();
    })
    .catch((e) => {
      messageError($q, e);
    })
-    .finally(() => {});
+    .finally(() => {
+      hideLoader();
+    });
 }

 /**
@ -106,13 +175,15 @@ async function downloadFile(name: string) {
  showLoader();
  await http
    .get(config.API.evaluationFilebyId("เล่ม 1", id.value, name))
-    .then((res) => {
+    .then(async (res) => {
      const link = res.data.downloadUrl;
      const type = res.data.fileType;
      const fileName = res.data.fileName;
-      getPDF(link, type, fileName);
+      await getPDF(link, type, fileName);
+    })
+    .catch((err) => {
+      messageError($q, err);
    })
-    .catch((e) => {})
    .finally(() => {
      hideLoader();
    });
@ -148,14 +219,26 @@ async function getPDF(url: string, type: string, fileName: string) {

 /** function ส่งไปประกาศบนเว็บไซต์ */
 function onWebSite() {
-  download10Url.value === ""
-    ? (fileEvaluationUpload.value = "")
-    : fileEvaluationUpload.value;
-  fileEvaluationUploadRef.value.validate();
-  if (
-    fileEvaluationUploadRef.value.hasError === false &&
-    download10Url.value !== ""
-  ) {
+  const downloadArray = [
+    download10Url.value,
+    formEvaluation.value[0].downloadFile,
+    formEvaluation.value[1].downloadFile,
+  ];
+
+  if (downloadArray.some((e: any) => e === "")) {
+    for (let i = 0; i < downloadArray.length; i++) {
+      if (downloadArray[i] === "") {
+        if (i == 0) {
+          fileEvaluationUploadRef.value.validate();
+          fileEvaluationUpload.value = null;
+        } else {
+          fileEvaluatioRef.value[0].validate();
+          fileEvaluatioRef.value[1].validate();
+          formEvaluation.value[i - 1].file = null;
+        }
+      }
+    }
+  } else {
    dialogConfirm(
      $q,
      () => {
@ -164,16 +247,48 @@ function onWebSite() {
          .put(config.API.evaluationApproveDoc1(id.value))
          .then(() => {
            success($q, "ส่งไปประกาศบนเว็บไซต์สำเร็จ");
-          })
-          .catch(() => {})
-          .finally(() => {
            getStep();
+          })
+          .catch((err) => {
+            messageError($q, err);
+          })
+          .finally(() => {
+            hideLoader();
          });
      },
      "ยืนยันการส่งไปประกาศบนเว็บไซต์",
      "ยืนยันการส่งไปประกาศบนเว็บไซต์ใช่หรือไม่?"
    );
  }
+
+  // download10Url.value === ""
+  //   ? (fileEvaluationUpload.value = "")
+  //   : fileEvaluationUpload.value;
+
+  // fileEvaluatioRef.value[0].validate();
+  // fileEvaluatioRef.value[1].validate();
+  // if (
+  //   fileEvaluationUploadRef.value.hasError === false &&
+  //   download10Url.value !== ""
+  // ) {
+  //   dialogConfirm(
+  //     $q,
+  //     () => {
+  //       showLoader();
+  //       http
+  //         .put(config.API.evaluationApproveDoc1(id.value))
+  //         .then(() => {
+  //           success($q, "ส่งไปประกาศบนเว็บไซต์สำเร็จ");
+  //         })
+  //         .catch(() => {})
+  //         .finally(() => {
+  //           getStep();
+  //         });
+  //     },
+  //     "ยืนยันการส่งไปประกาศบนเว็บไซต์",
+  //     "ยืนยันการส่งไปประกาศบนเว็บไซต์ใช่หรือไม่?"
+  //   );
+  // }
 }

 /** function เช็คขั้นตอน*/
@ -220,13 +335,13 @@ async function getStep() {
 * function เรียก link อัปโหลด
 * @param file ไฟล์
 */
-async function upLoadFile(file: any) {
+async function upLoadFile(file: any, fileName: string) {
  if (file) {
    showLoader();
    await http
      .post(config.API.evaluationFileListbyId("เล่ม 1", id.value), {
        fileList: {
-          fileName: "10-ประกาศผลการคัดเลือกบุคคล (เอกสารหมายเลข 10)",
+          fileName: fileName,
          metadata: {
            tag: "value",
            subject: subject.value,
@ -241,7 +356,8 @@ async function upLoadFile(file: any) {
            res.data[key]?.fileName !== ""
        );
        const link = res.data[foundKey]?.uploadUrl;
-        await fileUpLoad(link);
+        await uploadfile(link, file);
+        await fetchCheckFile(fileName);
      })
      .catch((e) => {
        messageError($q, e);
@ -253,31 +369,26 @@ async function upLoadFile(file: any) {
 }

 /**
- * function อัปโหลดไฟล์
- * @param url link อัปโหลด
+ *  functoin อัปโหลดไฟล์
+ * @param uploadUrl  link อัปโหลด
+ * @param file  ไฟล์
 */
-async function fileUpLoad(url: string) {
-  showLoader();
-  axios
-    .put(url, fileEvaluationUpload.value, {
-      headers: { "Content-Type": fileEvaluationUpload.value?.type },
-      onUploadProgress: (e) => console.log(e),
+async function uploadfile(uploadUrl: string, file: any) {
+  await axios
+    .put(uploadUrl, file, {
+      headers: {
+        "Content-Type": file.type,
+      },
    })
-    .then(async () => {
-      await checkDoc10();
-      success($q, "อัปโหลดไฟล์สำเร็จ");
+    .then(() => {
+      success($q, "อัปโหลไฟล์สำเร็จ");
    })
-    .catch((e) => {
-      messageError($q, e);
-    })
-    .finally(() => {
-      hideLoader();
+    .catch((err) => {
+      messageError($q, err);
    });
 }

-/**
- *  fiunction ส่งข้อความ
- */
+/**  fiunction ส่งข้อความ*/
 async function sentMessenger() {
  myForm.value.validate().then(async (result: boolean) => {
    if (result) {
@ -303,33 +414,8 @@ async function sentMessenger() {
  });
 }

-const download10Url = ref<string>("");
-/**
- *  function เช็คไฟล์อัปโหลด
- */
-async function checkDoc10() {
-  showLoader();
-  await http
-    .get(
-      config.API.evaluationPatchData(
-        "เล่ม 1",
-        id.value,
-        "10-ประกาศผลการคัดเลือกบุคคล (เอกสารหมายเลข 10)"
-      )
-    )
-    .then(async (res) => {
-      download10Url.value = await res.data.downloadUrl;
-    })
-    .finally(() => {
-      hideLoader();
-    });
-}
-
-/**
- * function เรียกข้อมูลผลงาน
- */
+/** function เรียกข้อมูลผลงาน*/
 async function fetchDataSigner() {
-  showLoader();
  await http
    .get(config.API.evaluationSigner(id.value, 1))
    .then((res) => {
@ -339,16 +425,100 @@ async function fetchDataSigner() {
    })
    .catch((e) => {
      messageError($q, e);
-    })
-    .finally(() => {
-      setTimeout(() => {
-        hideLoader();
-      }, 1500);
    });
 }

+/**
+ * function ดาวน์โหลดไฟล์
+ * @param fileName ชื่อไฟล์
+ */
+async function fetchCheckFile(fileName: string) {
+  await http
+    .get(config.API.evaluationPatchData("เล่ม 1", id.value, fileName))
+    .then((res) => {
+      const index = formTemplates.value.findIndex(
+        (item) => item.fileName === fileName
+      );
+      if (index !== -1) {
+        formTemplates.value[index].downloadFile = res.data.downloadUrl;
+        formTemplates.value[index].fileType = res.data.fileType;
+      }
+
+      const index2 = formEvaluation.value.findIndex(
+        (item) => item.fileName === fileName
+      );
+      if (index2 !== -1) {
+        formEvaluation.value[index2].downloadFile = res.data.downloadUrl;
+      }
+
+      if (fileName === "10-ประกาศผลการคัดเลือกบุคคล (เอกสารหมายเลข 10)") {
+        download10Url.value = res.data.downloadUrl;
+      }
+    });
+}
+
+function onOpenDialogTemplates() {
+  modalTemplates.value = true;
+  fetchDataAnnounceTemplete();
+}
+
+async function fetchDataAnnounceTemplete() {
+  showLoader();
+  await http
+    .get(config.API.evaluationAnnounceTemplete("get", id.value))
+    .then((res) => {
+      const data = res.data.result;
+      formBodyTemplates.detailBody = data.detailAnnounceStep5Body;
+      formBodyTemplates.detailFooter = data.detailAnnounceStep5Footer;
+    })
+    .catch((err) => {
+      messageError($q, err);
+    })
+    .finally(() => {
+      hideLoader();
+    });
+}
+
+function onSubmitBodyTemplates() {
+  dialogConfirm($q, async () => {
+    showLoader();
+    await http
+      .put(
+        config.API.evaluationAnnounceTemplete("edit", id.value),
+        formBodyTemplates
+      )
+      .then(() => {
+        success($q, "บันทึกข้อมูลสำเร็จ");
+        modalTemplates.value = false;
+      })
+      .catch((err) => {
+        messageError($q, err);
+      })
+      .finally(() => {
+        hideLoader();
+      });
+  });
+}
+
 onMounted(async () => {
-  await Promise.all([checkDoc10(), fetchDataSigner()]);
+  try {
+    showLoader();
+    await Promise.all([
+      fetchDataSigner(),
+      formTemplates.value.forEach((e) => {
+        fetchCheckFile(e.fileName);
+      }),
+      formEvaluation.value.forEach((e) => {
+        fetchCheckFile(e.fileName);
+      }),
+
+      fetchCheckFile("10-ประกาศผลการคัดเลือกบุคคล (เอกสารหมายเลข 10)"),
+    ]);
+  } catch (error) {
+    console.log(error);
+  } finally {
+    hideLoader();
+  }
 });
 </script>

@ -394,6 +564,124 @@ onMounted(async () => {
      </q-card>
    </div>

+    <!-- เอกสารเล่มที่ 1 (ฉบับแก้ไข)-->
+    <div
+      class="col-12"
+      v-if="formTemplates.some((e:any) => e.downloadFile !== '')"
+    >
+      <q-card bordered style="border: 1px solid #d6dee1">
+        <div class="text-weight-medium bg-grey-1 q-py-sm q-px-md">
+          เอกสารเล่มที่ 1 (ฉบับแก้ไข)
+        </div>
+        <div class="col-12"><q-separator /></div>
+
+        <q-list v-for="file in formTemplates" :key="file.id" class="full-width">
+          <q-item clickable v-ripple v-if="file.downloadFile !== ''">
+            <q-item-section class="text-grey-9">
+              {{ file.title }}
+            </q-item-section>
+            <q-item-section avatar>
+              <div class="row">
+                <div>
+                  <q-btn
+                    dense
+                    flat
+                    round
+                    size="12px"
+                    color="blue"
+                    icon="mdi-download"
+                    @click="getPDF(file.downloadFile, file.type, file.fileName)"
+                  >
+                    <q-tooltip>ดาวน์โหลดไฟล์</q-tooltip>
+                  </q-btn>
+                </div>
+              </div>
+            </q-item-section>
+          </q-item>
+        </q-list>
+      </q-card>
+    </div>
+
+    <div
+      class="col-6"
+      v-if="store.currentStep === 4"
+      v-for="(item, index) in formEvaluation"
+      :key="index"
+    >
+      <q-card bordered class="cardSp1">
+        <div
+          class="text-weight-medium bg-grey-1 q-py-sm q-pl-md q-pr-sm col-12 row items-center"
+        >
+          <div>{{ item.title }}</div>
+          <q-space />
+          <div>
+            <q-btn
+              flat
+              dense
+              icon="download"
+              color="indigo"
+              @click="
+                onClickDowloadFile(item.code, item.templateName, item.title)
+              "
+            >
+              <q-tooltip> ดาวน์โหลดต้นแบบ </q-tooltip></q-btn
+            >
+          </div>
+          <div>
+            <q-btn
+              v-if="item.downloadFile != ''"
+              :href="item.downloadFile"
+              target="_blank"
+              class="q-ml-sm"
+              color="blue"
+              flat
+              dense
+              icon="visibility"
+            >
+              <q-tooltip> ดูไฟล์เอกสาร </q-tooltip></q-btn
+            >
+          </div>
+        </div>
+        <div class="col-12"><q-separator /></div>
+        <div class="row">
+          <div class="col-12 q-pa-sm">
+            <div class="row q-col-gutter-md col-12">
+              <q-file
+                ref="fileEvaluatioRef"
+                v-model="item.file"
+                class="col-xs-12 col-sm-12"
+                label="อัปโหลดไฟล์"
+                outlined
+                dense
+                lazy-rules
+                hide-bottom-space
+                accept=".pdf"
+                :rules="
+                item.downloadFile === '' ? [(val:string) => !!val || 'กรุณาเลือกไฟล์'] : []
+              "
+              >
+                <template v-slot:prepend>
+                  <q-icon name="attach_file" />
+                </template>
+                <template v-slot:after>
+                  <q-btn
+                    flat
+                    round
+                    dense
+                    color="primary"
+                    icon="mdi-upload"
+                    @click="upLoadFile(item.file, item.fileName)"
+                  >
+                    <q-tooltip>อัปโหลดไฟล์</q-tooltip>
+                  </q-btn>
+                </template>
+              </q-file>
+            </div>
+          </div>
+        </div>
+      </q-card>
+    </div>
+
    <!-- ประกาศผลการคัดเลือกบุคคล (เอกสารหมายเลข 10) -->
    <div class="col-12" v-if="store.currentStep == 4">
      <q-card bordered style="border: 1px solid #d6dee1">
@ -401,6 +689,17 @@ onMounted(async () => {
          class="text-weight-medium row col-12 bg-grey-1 q-py-sm q-px-md items-center"
        >
          <div>ประกาศผลการคัดเลือกบุคคล (เอกสารหมายเลข 10)</div>
+
+          <q-btn
+            flat
+            dense
+            round
+            color="edit"
+            icon="edit"
+            @click="onOpenDialogTemplates"
+          >
+            <q-tooltip>แก้ไขประกาศ</q-tooltip>
+          </q-btn>
          <q-space />
          <div>
            <q-btn
@ -468,7 +767,12 @@ onMounted(async () => {
                  dense
                  color="primary"
                  icon="mdi-upload "
-                  @click="upLoadFile(fileEvaluationUpload)"
+                  @click="
+                    upLoadFile(
+                      fileEvaluationUpload,
+                      '10-ประกาศผลการคัดเลือกบุคคล (เอกสารหมายเลข 10)'
+                    )
+                  "
                  ><q-tooltip>อัปโหลดไฟล์</q-tooltip></q-btn
                >
              </template>
@ -498,22 +802,15 @@ onMounted(async () => {
  <!--  popup ติดต่อผู้ขอประเมิน -->
  <q-dialog v-model="modalEvaluation" persistent>
    <q-card style="min-width: 60vw">
-      <q-toolbar>
-        <q-toolbar-title class="text-subtitle2 text-bold">
-          ติดต่อผู้ขอประเมิน
-        </q-toolbar-title>
-        <q-btn
-          icon="close"
-          unelevated
-          round
-          dense
-          @click="modalEvaluation = false"
-          style="color: #ff8080; background-color: #ffdede"
+      <q-form ref="myForm">
+        <DialogHeader
+          tittle="ติดต่อผู้ขอประเมิน"
+          :close="
+            () => ((modalEvaluation = false), (title = ''), (messenger = ''))
+          "
        />
-      </q-toolbar>
-      <q-separator />
-      <q-card-section class="q-pa-md bg-grey-1">
-        <q-form ref="myForm">
+        <q-separator />
+        <q-card-section class="q-pa-md bg-grey-1">
          <div class="row q-col-gutter-sm">
            <div class="col-12">
              <q-input
@ -537,21 +834,69 @@ onMounted(async () => {
              />
            </div>
          </div>
-        </q-form>
-      </q-card-section>
-      <q-separator />
+        </q-card-section>
+        <q-separator />

-      <div class="row justify-end q-px-md q-py-sm items-center">
-        <q-btn
-          dense
-          color="public"
-          id="onSubmit"
-          class="q-px-md q-py-xs"
-          label="ส่งข้อความ"
-          @click="sentMessenger"
-        >
-        </q-btn>
-      </div>
+        <div class="row justify-end q-px-md q-py-sm items-center">
+          <q-btn
+            dense
+            color="public"
+            id="onSubmit"
+            class="q-px-md q-py-xs"
+            label="ส่งข้อความ"
+            @click="sentMessenger"
+          >
+          </q-btn>
+        </div>
+      </q-form>
+    </q-card>
+  </q-dialog>
+
+  <!--  popup แก้ไขประกาศ -->
+  <q-dialog v-model="modalTemplates" persistent>
+    <q-card style="min-width: 60vw">
+      <q-form
+        greedy
+        @submit.prevent
+        @validation-success="onSubmitBodyTemplates"
+      >
+        <DialogHeader
+          tittle="แก้ไขประกาศ"
+          :close="() => (modalTemplates = false)"
+        />
+        <q-separator />
+        <q-card-section class="q-pa-md bg-grey-1">
+          <div class="row q-col-gutter-sm">
+            <div class="col-12">
+              <q-input
+                v-model="formBodyTemplates.detailBody"
+                label="เนื้อหาประกาศผลการคัดเลือกบุคคลส่วนที่ 1"
+                type="textarea"
+                outlined
+                dense
+                bg-color="white"
+              />
+            </div>
+            <div class="col-12">
+              <q-input
+                v-model="formBodyTemplates.detailFooter"
+                label="เนื้อหาประกาศผลการคัดเลือกบุคคลส่วนที่ 2"
+                type="textarea"
+                outlined
+                dense
+                bg-color="white"
+              />
+            </div>
+          </div>
+        </q-card-section>
+        <q-separator />
+
+        <q-card-actions align="right">
+          <q-btn type="submit" color="public" label="บันทึก">
+            <q-tooltip>บันทึกข้อมูล</q-tooltip>
+          </q-btn>
+        </q-card-actions>
+      </q-form>
    </q-card>
  </q-dialog>
 </template>
--- a/src/modules/12_evaluatePersonal/components/Detail/step/step6.vue
+++ b/src/modules/12_evaluatePersonal/components/Detail/step/step6.vue
@ -21,19 +21,22 @@ const id = ref<string>(route.params.id as string); //id ประเมิน
 const formCommand = reactive<FormCommand>({
  elementaryFullName: "", //ชื่อ-นามสกุลผู้บังคับบัญชาชั้นต้น
  elementaryPosition: "", //ตำแหน่งผู้บังคับบัญชาชั้นต้น
+  elementaryPositionOld: "", //ตำแหน่งเดิมผู้บังคับบัญชาชั้นต้น
+  elementaryOrg: "", //สังกัดผู้บังคับบัญชาชั้นต้น
+  elementaryOrgOld: "", //สังกัดเดิมผู้บังคับบัญชาชั้นต้น
  abovelevelFullname: "", //ชื่อ-นามสกุลผู้บังคับบัญชาเหนือขึ้นไป 1 ระดับ
  abovelevelPosition: "", //ตำแหน่งผู้บังคับบัญชาเหนือขึ้นไป 1 ระดับ
+  abovelevelPositionOld: "", //ตำแหน่งเดิมผู้บังคับบัญชาเหนือขึ้นไป 1 ระดับ
+  abovelevelOrg: "", //สังกัดผู้บังคับบัญชาเหนือขึ้นไป 1 ระดับ
+  abovelevelOrgOld: "", //สังกัดเดิมผู้บังคับบัญชาเหนือขึ้นไป 1 ระดับ
 });
 const author = ref<string>(""); //เจ้าของผลงาน
-const subject = ref<string>(""); //ชื่อผลงาน
+const subject = ref<string[]>([""]); //ชื่อผลงาน
 const assignedPosition = ref<string>(""); //ตำแหน่งที่ได้รับ
 const dateEndPrepareDoc2 = ref<string | null>(); //วันสุดท้ายของการส่งผลงาน

-/**
- * function เรียกข้อมูลวันที่ประกาศ
- */
+/** function เรียกข้อมูลวันที่ประกาศ*/
 async function getDate() {
-  showLoader();
  await http
    .get(config.API.evaluationDateAnnounce(id.value))
    .then((res) => {
@ -44,11 +47,6 @@ async function getDate() {
    })
    .catch((e) => {
      messageError($q, e);
-    })
-    .finally(() => {
-      setTimeout(() => {
-        hideLoader();
-      }, 1500);
    });
 }

@ -56,7 +54,6 @@ async function getDate() {
 * function เรียกข้อมูลผลงาน
 */
 async function getSigner() {
-  showLoader();
  await http
    .get(config.API.evaluationSigner(id.value, 2))
    .then((res) => {
@ -64,8 +61,14 @@ async function getSigner() {
      if (data) {
        formCommand.elementaryFullName = data.commanderFullnameDoc2;
        formCommand.elementaryPosition = data.commanderPositionDoc2;
+        formCommand.elementaryPositionOld = data.commanderPositionOldDoc2;
+        formCommand.elementaryOrg = data.commanderOrgDoc2;
+        formCommand.elementaryOrgOld = data.commanderOrgOldDoc2;
        formCommand.abovelevelFullname = data.commanderAboveFullnameDoc2;
        formCommand.abovelevelPosition = data.commanderAbovePositionDoc2;
+        formCommand.abovelevelPositionOld = data.commanderAbovePositionOldDoc2;
+        formCommand.abovelevelOrg = data.commanderAboveOrgDoc2;
+        formCommand.abovelevelOrgOld = data.commanderAboveOrgOldDoc2;
        author.value = data.authorDoc2;
        subject.value = data.subjectDoc2;
        assignedPosition.value = data.assignedPosition;
@ -73,16 +76,18 @@ async function getSigner() {
    })
    .catch((e) => {
      messageError($q, e);
-    })
-    .finally(() => {
-      setTimeout(() => {
-        hideLoader();
-      }, 1500);
    });
 }

 onMounted(async () => {
-  await Promise.all([getSigner(), getDate()]);
+  try {
+    showLoader();
+    await Promise.all([getSigner(), getDate()]);
+  } catch (error) {
+    console.log(error);
+  } finally {
+    hideLoader();
+  }
 });
 </script>

@ -104,47 +109,47 @@ onMounted(async () => {
      <q-card bordered style="border: 1px solid #d6dee1">
        <div class="text-weight-medium bg-grey-1 q-py-sm q-px-md">ผลงาน</div>
        <div class="col-12"><q-separator /></div>
-        <div class="row">
-          <div class="col-12 q-pa-sm">
-            <div class="row q-col-gutter-sm col-12">
-              <div class="col-xs-12 col-sm-12 row">
-                <div class="row col-12 q-col-gutter-sm">
-                  <q-input
-                    readonly
-                    dense
-                    class="col-xs-12 col-sm-6"
-                    outlined
-                    label="ชื่อผลงาน"
-                    v-model="subject"
-                    :rules="[(val:string) => !!val || `${'กรุณากรอกชื่อผลงาน'}`]"
-                    lazy-rules
-                    hide-bottom-space
-                  />
-                  <q-input
-                    readonly
-                    class="col-xs-12 col-sm-6"
-                    dense
-                    outlined
-                    v-model="author"
-                    label="เจ้าของผลงาน"
-                    :rules="[(val:string) => !!val || `${'กรุณากรอกเจ้าของผลงาน'}`]"
-                    lazy-rules
-                    hide-bottom-space
-                  />
-                  <q-input
-                    readonly
-                    class="col-xs-12 col-sm-6"
-                    dense
-                    outlined
-                    v-model="assignedPosition"
-                    label="ตำแหน่งที่ได้รับ"
-                    :rules="[
-                      (val:string) => !!val || `${'กรุณากรอกตำแหน่งที่ได้รับ'}`,
-                    ]"
-                    lazy-rules
-                    hide-bottom-space
-                  />
-                </div>
+
+        <div class="col-12 q-pa-sm">
+          <div class="row q-col-gutter-sm">
+            <div class="col-12 row q-col-gutter-sm">
+              <q-input
+                readonly
+                class="col-xs-12 col-sm-6"
+                dense
+                outlined
+                v-model="author"
+                label="เจ้าของผลงาน"
+                lazy-rules
+                hide-bottom-space
+              />
+              <q-input
+                readonly
+                class="col-xs-12 col-sm-6"
+                dense
+                outlined
+                v-model="assignedPosition"
+                label="ตำแหน่งที่ได้รับ"
+                lazy-rules
+                hide-bottom-space
+              />
+            </div>
+
+            <div
+              class="row col-12 q-col-gutter-sm"
+              v-for="(item, index) in subject"
+              :key="index"
+            >
+              <div class="col-12">
+                <q-input
+                  readonly
+                  dense
+                  outlined
+                  label="ชื่อผลงาน"
+                  v-model="subject[index]"
+                  hide-bottom-space
+                  lazy-rules
+                />
              </div>
            </div>
          </div>
@ -159,48 +164,81 @@ onMounted(async () => {
          เลือกผู้เซ็นเอกสาร
        </div>
        <div class="col-12"><q-separator /></div>
-        <div class="row">
-          <div class="col-12 q-pa-sm">
-            <div class="row q-col-gutter-sm col-12">
+        <div class="col-12 q-pa-sm">
+          <div class="row q-col-gutter-sm">
+            <div class="col-xs-12 col-sm-12 row">
              <div class="col-xs-12 col-sm-12 row">
                <div class="text-weight-medium q-pl-sm q-py-sm">
                  ผู้บังคับบัญชาชั้นต้น
                </div>
-                <div class="row col-12 q-col-gutter-sm">
+                <div class="row col-12 q-col-gutter-sm q-pa-sm">
                  <q-input
                    readonly
-                    ref="elementaryFullNameRef"
                    dense
                    class="col-xs-12 col-sm-6"
                    outlined
                    label="ชื่อ-นามสกุล"
                    v-model="formCommand.elementaryFullName"
-                    :rules="[(val:string) => !!val || `${'กรุณากรอกชื่อ-นามสกุล'}`]"
-                    lazy-rules
-                    hide-bottom-space
-                  />
-                  <q-input
-                    readonly
-                    ref="elementaryPositonRef"
-                    class="col-xs-12 col-sm-6"
-                    dense
-                    outlined
-                    v-model="formCommand.elementaryPosition"
-                    label="ตำแหน่ง"
-                    :rules="[(val:string) => !!val || `${'กรุณากรอกตำแหน่ง'}`]"
                    lazy-rules
                    hide-bottom-space
                  />
+                  <div class="col-12">
+                    <div class="row col-12 q-col-gutter-sm">
+                      <q-input
+                        readonly
+                        class="col-xs-6 col-sm-3"
+                        dense
+                        outlined
+                        v-model="formCommand.elementaryPosition"
+                        label="ตำแหน่ง"
+                        lazy-rules
+                        hide-bottom-space
+                      />
+
+                      <q-input
+                        readonly
+                        class="col-xs-6 col-sm-3"
+                        dense
+                        outlined
+                        v-model="formCommand.elementaryPositionOld"
+                        label="ตำแหน่งเดิม"
+                        :rules="[(val:string) => !!val || `${'กรุณากรอกตำแหน่งเดิม'}`]"
+                        lazy-rules
+                        hide-bottom-space
+                      />
+
+                      <q-input
+                        readonly
+                        class="col-xs-6 col-sm-3"
+                        dense
+                        outlined
+                        v-model="formCommand.elementaryOrg"
+                        label="สังกัด"
+                        lazy-rules
+                        hide-bottom-space
+                      />
+                      <q-input
+                        readonly
+                        class="col-xs-6 col-sm-3"
+                        dense
+                        outlined
+                        v-model="formCommand.elementaryOrgOld"
+                        label="สังกัดเดิม"
+                        lazy-rules
+                        hide-bottom-space
+                      />
+                    </div>
+                  </div>
                </div>
              </div>
            </div>

-            <div class="row q-col-gutter-sm col-12">
+            <div class="row q-col-gutter-sm">
              <div class="col-xs-12 col-sm-12 row">
                <div class="text-weight-medium q-pl-sm q-pt-md q-mb-xs">
                  ผู้บังคับบัญชาเหนือขึ้นไป 1 ระดับ
                </div>
-                <div class="row col-12 q-col-gutter-sm">
+                <div class="row col-12 q-col-gutter-sm q-pa-sm">
                  <q-input
                    readonly
                    ref="abovelevelFullnameRef"
@ -213,18 +251,54 @@ onMounted(async () => {
                    lazy-rules
                    hide-bottom-space
                  />
-                  <q-input
-                    ref="abovelevelPositionRef"
-                    class="col-xs-12 col-sm-6"
-                    dense
-                    readonly
-                    outlined
-                    v-model="formCommand.abovelevelPosition"
-                    label="ตำแหน่ง"
-                    :rules="[(val:string) => !!val || `${'กรุณากรอกตำแหน่ง'}`]"
-                    lazy-rules
-                    hide-bottom-space
-                  />
+
+                  <div class="col-12">
+                    <div class="row col-12 q-col-gutter-sm">
+                      <q-input
+                        readonly
+                        class="col-xs-6 col-sm-3"
+                        dense
+                        outlined
+                        v-model="formCommand.abovelevelPosition"
+                        label="ตำแหน่ง"
+                        lazy-rules
+                        hide-bottom-space
+                      />
+
+                      <q-input
+                        readonly
+                        class="col-xs-6 col-sm-3"
+                        dense
+                        outlined
+                        v-model="formCommand.abovelevelPositionOld"
+                        label="ตำแหน่งเดิม"
+                        :rules="[(val:string) => !!val || `${'กรุณากรอกตำแหน่งเดิม'}`]"
+                        lazy-rules
+                        hide-bottom-space
+                      />
+
+                      <q-input
+                        readonly
+                        class="col-xs-6 col-sm-3"
+                        dense
+                        outlined
+                        v-model="formCommand.abovelevelOrg"
+                        label="สังกัด"
+                        lazy-rules
+                        hide-bottom-space
+                      />
+                      <q-input
+                        readonly
+                        class="col-xs-6 col-sm-3"
+                        dense
+                        outlined
+                        v-model="formCommand.abovelevelOrgOld"
+                        label="สังกัดเดิม"
+                        lazy-rules
+                        hide-bottom-space
+                      />
+                    </div>
+                  </div>
                </div>
              </div>
            </div>
--- a/src/modules/12_evaluatePersonal/components/Detail/step/step7.vue
+++ b/src/modules/12_evaluatePersonal/components/Detail/step/step7.vue
@ -39,13 +39,10 @@ async function getFile(volume: number) {
  showLoader();
  await http
    .get(config.API.evaluationFilebyId("เล่ม 2", id.value, fileText))
-    .then((res) => {
+    .then(async (res) => {
      const link = res.data.downloadUrl;
      const type = res.data.fileType;
-      getPDF(link, type);
-    })
-    .catch(() => {
-      // messageError($q, e);
+      await getPDF(link, type);
    })
    .finally(() => {
      hideLoader();
@ -57,9 +54,8 @@ async function getFile(volume: number) {
 * @param url linkLoadFile
 * @param type ประเภทไฟล์
 */
-function getPDF(url: string, type: string) {
-  showLoader();
-  axios
+async function getPDF(url: string, type: string) {
+  await axios
    .get(url, {
      method: "GET",
      responseType: "blob",
@ -80,7 +76,6 @@ function getPDF(url: string, type: string) {
        store.log = 1;
        store.pdfSrcStore = pdfData.pdf.value;
        store.numOfPagesStore = pdfData.pages.value;
-        hideLoader();
      }, 1500);
    })
    .catch(async (e) => {
--- a/src/modules/12_evaluatePersonal/components/Detail/step/step8.vue
+++ b/src/modules/12_evaluatePersonal/components/Detail/step/step8.vue
--- a/src/modules/12_evaluatePersonal/components/Detail/viewstep/viewStep1.vue
+++ b/src/modules/12_evaluatePersonal/components/Detail/viewstep/viewStep1.vue
@ -21,6 +21,7 @@ const {
  columnSalaries,
  columnTraining,
  columnAssessments,
+  columnExperience,
 } = store;
 const { date2Thai, showLoader, hideLoader } = mixin;

@ -51,6 +52,7 @@ const formDetail = reactive({
  salaries: [], //ประวัติการรับราชการ
  trainings: [], //ประวัติการฝึกอบรมดูงาน
  assessments: [], //ประสบการณ์ในการปฏิบัติงาน
+  experience: [],
 });

 function formattedNumber(x: number) {
@ -60,6 +62,7 @@ function formattedNumber(x: number) {
 onMounted(() => {
  if (props.data) {
    showLoader();
+    console.log("props.data :>> ", props.data);
    formDetail.prefix = props.data.prefix ?? "-";
    formDetail.fullName = props.data.fullName ?? "-";
    formDetail.position = props.data.position ?? "-";
@ -99,7 +102,8 @@ onMounted(() => {
          yearly: e.yearly,
        }))
      : [];
-    formDetail.assessments = props.data.assessments;
+    formDetail.assessments = props.data.performances;
+    formDetail.experience = props.data.portfolios;
    setTimeout(() => {
      hideLoader();
    }, 1000);
@ -382,7 +386,11 @@ onMounted(() => {
          <span class="q-ml-lg q-my-sm">ประสบการณ์ในการปฏิบัติงาน </span>
        </div>
        <div class="col-12"><q-separator /></div>
-        <div class="col-12 q-pa-sm">-</div>
+        <TableData
+          class="col-12"
+          :columns="columnExperience"
+          :row="formDetail.experience"
+        />
      </q-card>

      <q-card class="col-12 cardSp1" bordered>
@ -390,13 +398,12 @@ onMounted(() => {
          <span class="q-ml-lg q-my-sm">ผลงานที่เคยเสนอขอประเมิน (ถ้ามี)</span>
        </div>
        <div class="col-12"><q-separator /></div>
-        <div class="col-12 q-pa-sm">-</div>
-        <!-- <div class="col-10">
-          <TableData
-            :columns="columnAssessments"
-            :row="formDetail.assessments"
-          />
-        </div> -->
+
+        <TableData
+          class="col-12"
+          :columns="columnAssessments"
+          :row="formDetail.assessments"
+        />
      </q-card>
    </div>
  </q-card>
--- a/src/modules/12_evaluatePersonal/interface/index/evalute.ts
+++ b/src/modules/12_evaluatePersonal/interface/index/evalute.ts
@ -1,8 +1,14 @@
 interface FormCommand {
  elementaryFullName: string;
  elementaryPosition: string;
+  elementaryPositionOld: string;
+  elementaryOrg: string;
+  elementaryOrgOld: string;
  abovelevelFullname: string;
  abovelevelPosition: string;
+  abovelevelPositionOld: string;
+  abovelevelOrg: string;
+  abovelevelOrgOld: string;
 }

 interface FormCommandRef {
--- a/src/modules/12_evaluatePersonal/store/EvaluateDetail.ts
+++ b/src/modules/12_evaluatePersonal/store/EvaluateDetail.ts
@ -328,97 +328,65 @@ export const useEvaluateDetailStore = defineStore("evaluateDetailStore", () => {
    },
  ]);

-  /** คอลัมน์ ผลงานที่เคยเสนอขอประเมิน*/
+  //ผลงานที่เคยเสนอขอประเมิน (ถ้ามี)
  const columnAssessments = ref<QTableProps["columns"]>([
    {
-      name: "date",
+      name: "year",
      align: "left",
-      label: "วันที่ได้รับ",
+      label: "ปี พ.ศ.",
      sortable: true,
-      field: "date",
+      field: "year",
      headerStyle: "font-size: 14px",
      style: "font-size: 14px",
-      format: (v) => date2Thai(v),
    },
    {
-      name: "point1Total",
+      name: "type",
      align: "left",
-      label: "ส่วนที่1 (น้ำหนัก)",
+      label: "ระดับตอนที่ยื่นขอ",
      sortable: true,
-      field: "point1Total",
+      field: "type",
      headerStyle: "font-size: 14px",
      style: "font-size: 14px",
-      sort: (a: string, b: string) =>
-        a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
    },
    {
-      name: "point1",
+      name: "subject",
      align: "left",
-      label: "ผลประเมินส่วนที่1 (คะแนน)",
+      label: "เรื่อง/ชื่อเรื่อง",
      sortable: true,
-      field: "point1",
+      field: "subject",
      headerStyle: "font-size: 14px",
      style: "font-size: 14px",
-      sort: (a: string, b: string) =>
-        a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
    },
    {
-      name: "point2Total",
+      name: "evaluationResult",
      align: "left",
-      label: "ส่วนที่2 (น้ำหนัก)",
+      label: "ผลการประเมิน (ผ่าน/ไม่ผ่าน)",
      sortable: true,
-      field: "point2Total",
+      field: "evaluationResult",
      headerStyle: "font-size: 14px",
      style: "font-size: 14px",
-      sort: (a: string, b: string) =>
-        a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
-    },
-    {
-      name: "point2",
-      align: "left",
-      label: "ผลประเมินส่วนที่2 (คะแนน)",
-      sortable: true,
-      field: "point2",
-      headerStyle: "font-size: 14px",
-      style: "font-size: 14px",
-      sort: (a: string, b: string) =>
-        a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
-    },
-    {
-      name: "pointSumTotal",
-      align: "left",
-      label: "ผลรวม (น้ำหนัก)",
-      sortable: true,
-      field: "pointSumTotal",
-      headerStyle: "font-size: 14px",
-      style: "font-size: 14px",
-      sort: (a: string, b: string) =>
-        a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
-    },
-    {
-      name: "pointSum",
-      align: "left",
-      label: "ผลประเมินรวม (คะแนน)",
-      sortable: true,
-      field: "pointSum",
-      headerStyle: "font-size: 14px",
-      style: "font-size: 14px",
-      sort: (a: string, b: string) =>
-        a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
    },
+  ]);
+
+  //ประสบการณ์ในการปฏิบัติงาน
+  const columnExperience = ref<QTableProps["columns"]>([
    {
      name: "name",
      align: "left",
-      label: "ผลประเมิน",
+      label: "ชื่อผลงาน",
      sortable: true,
      field: "name",
-      format(val, row) {
-        return `${textPoint(row.pointSum)} ${textRangePoint(row.pointSum)}`;
-      },
      headerStyle: "font-size: 14px",
      style: "font-size: 14px",
-      sort: (a: string, b: string) =>
-        a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
+    },
+    {
+      name: "detail",
+      align: "left",
+      label: "รายละเอียดผลงาน",
+      sortable: true,
+      field: "detail",
+      headerStyle: "font-size: 14px",
+      style: "font-size: 14px",
    },
  ]);

@ -452,6 +420,8 @@ export const useEvaluateDetailStore = defineStore("evaluateDetailStore", () => {
    columnSalaries,
    columnTraining,
    columnAssessments,
+    columnExperience,
+
    pdfSrcStore,
    urlDownloadFile,
    numOfPagesStore,
--- a/src/modules/14_KPI/views/mainDetail.vue
+++ b/src/modules/14_KPI/views/mainDetail.vue
@ -35,7 +35,6 @@ const router = useRouter();
 const route = useRoute();
 const id = ref<string>(route.params.id as string);

-
 const idEva = ref<string>(route.params.id as string);
 const formData = reactive<any>({
  prefix: "",
@ -119,7 +118,7 @@ function onResize(size: any) {
 * fetch ข้แมูลส่วนตัว
 */

- // เส้นเก่าที่เคยใช้     .get(config.API.kpiEvaluationUser + `/admin/${id.value}`)
+// เส้นเก่าที่เคยใช้     .get(config.API.kpiEvaluationUser + `/admin/${id.value}`)
 async function getMain() {
  showLoader();
  await http
@ -303,7 +302,7 @@ onMounted(async () => {
                  }}
                </div>
                <div class="col-4 text-html">
-                  {{ formData.org ? formData.org : "-" }}
+                  {{ formData.org ? formData.org.replace("\\n", "\n") : "-" }}
                </div>
              </div>
            </div>