หน้ารายการประเมิน

2024-01-03 17:04:45 +07:00 · 2024-01-03 17:04:45 +07:00 · d271ff96b8
commit d271ff96b8
parent c2e0e5cb59
16 changed files with 386 additions and 134 deletions
--- a/src/modules/12_evaluatePersonal/components/Detail/Stepper.vue
+++ b/src/modules/12_evaluatePersonal/components/Detail/Stepper.vue
@ -73,7 +73,7 @@ const store = useEvaluateDetailStore();
    <q-step
      :name="7"
      prefix="7"
-      title="ตรวจสอบเอกสารเล่ม 2"
+      title="รอพิจารณาผลการประเมิน 2"
      :done="store.step >= 7"
      :disable="store.currentStep < 7"
    >
@ -82,7 +82,7 @@ const store = useEvaluateDetailStore();
    <q-step
      :name="8"
      prefix="8"
-      title="รอพิจารณาผล"
+      title="ตรวจสอบความถูกต้องของเอกสารเล่ม 2"
      :done="store.step >= 8"
      :disable="store.currentStep < 8"
    >
--- a/src/modules/12_evaluatePersonal/components/Detail/Tab1.vue
+++ b/src/modules/12_evaluatePersonal/components/Detail/Tab1.vue
@ -233,7 +233,7 @@ onMounted(() => {
 </script>

 <template>
-  <div class="row q-col-gutter-md">
+  <q-card bordered class="col-12 row caedNone q-pa-md q-col-gutter-md">
    <div class="col-xs-12 col-sm-3">
      <div class="toptitle">
        {{
@ -275,7 +275,7 @@ onMounted(() => {
              : 'col-xs-12 col-sm-5 row'
          "
        >
-          <q-card flat bordered class="col-12">
+          <q-card flat bordered class="col-12 q-pa-md">
            <q-card-section>
              <Step1 v-if="store.step === 1" :data="props.data" />
              <Step2 v-if="store.step === 2" @update:form="updateformCommand" />
@ -293,16 +293,18 @@ onMounted(() => {
          class="col-xs-12 col-sm-7 row"
          v-if="store.step === 1 || store.step === 3 || store.step === 7"
        >
-          <q-card flat bordered class="col-12">
-            <q-card-section>
-              <ViewStep1 v-if="store.step === 1" :data="data" />
-              <ViewStep3 v-if="store.step === 3" />
-              <ViewStep7 v-if="store.step === 7" /> </q-card-section
-          ></q-card>
+          <!-- <q-card flat bordered class="col-12"> -->
+          <div class="col-12">
+            <ViewStep1 v-if="store.step === 1" :data="data" />
+            <ViewStep3 v-if="store.step === 3" />
+            <ViewStep7 v-if="store.step === 7" />
+          </div>
+          <!-- <q-card-section> </q-card-section -->
+          <!-- ></q-card> -->
        </div>
      </div>
    </div>
-  </div>
+  </q-card>

  <PopupHistory :modal="modalHistory" :close="onClickPopupHistory" :id="id" />
 </template>
--- a/src/modules/12_evaluatePersonal/components/Detail/popupHistory.vue
+++ b/src/modules/12_evaluatePersonal/components/Detail/popupHistory.vue
@ -68,6 +68,11 @@ const columns = ref<QTableProps["columns"]>([
 const row = ref<any>();

 async function fetchListHistory(id: string) {
+  const thaiOptions: Intl.DateTimeFormatOptions = {
+    hour: "2-digit",
+    minute: "2-digit",
+    second: "2-digit",
+  };
  showLoader();
  await http
    .get(config.API.evaluationHistory(id))
@ -76,7 +81,9 @@ async function fetchListHistory(id: string) {
      const list = data.map((e: any) => ({
        step: e.step,
        lastUpdateFullName: e.lastUpdateFullName,
-        lastUpdatedAt: date2Thai(e.lastUpdatedAt),
+        lastUpdatedAt: `${date2Thai(e.lastUpdatedAt)} เวลา  ${new Date(
+          e.lastUpdatedAt
+        ).toLocaleTimeString("th-TH", thaiOptions)} น.`,
      }));
      row.value = list;
    })
--- a/src/modules/12_evaluatePersonal/components/Detail/step/step3.vue
+++ b/src/modules/12_evaluatePersonal/components/Detail/step/step3.vue
@ -34,7 +34,8 @@ function getFile(volume: number) {
    .then((res) => {
      const link = res.data.downloadUrl;
      const type = res.data.fileType;
-      getPDF(link,type);
+
+      getPDF(link, type);
    })
    .catch((e) => {
      // messageError($q, e);
@ -44,7 +45,7 @@ function getFile(volume: number) {
    });
 }

-function getPDF(url: string,type:string) {
+function getPDF(url: string, type: string) {
  axios
    .get(url, {
      method: "GET",
@ -55,25 +56,26 @@ function getPDF(url: string,type:string) {
      },
    })
    .then(async (res) => {
-      store.log = 0
-      console.log(res);
+      store.log = 0;
+      store.urlDownloadFile = url;
      const blob = new Blob([res.data]);
      const objectUrl = URL.createObjectURL(blob);

      const pdfData = await usePDF(`${objectUrl}`);
      showLoader();
      setTimeout(() => {
-        store.log = 1
+        store.log = 1;
        store.pdfSrcStore = pdfData.pdf.value;
        store.numOfPagesStore = pdfData.pages.value;
        hideLoader();
      }, 1500);
-    }).catch((e)=>{
-      messageError($q,e)
    })
-    .finally(()=>{
-      store.log = 0
+    .catch((e) => {
+      messageError($q, e);
    })
+    .finally(() => {
+      store.log = 0;
+    });
 }

 function numToThai(val: number) {
--- a/src/modules/12_evaluatePersonal/components/Detail/step/step4.vue
+++ b/src/modules/12_evaluatePersonal/components/Detail/step/step4.vue
@ -34,6 +34,7 @@ const messenger = ref<string>("");
 const title = ref<string>("");
 const modalEvaluation = ref<boolean>(false);
 const fileEvaluationUpload = ref<any>();
+const fileEvaluationUploadRef = ref<any>();
 const status = ref<string>("WAIT_CHECK_DOC_V1");
 const files = [
  {
@ -153,22 +154,31 @@ function getPDF(url: string, type: string, fileName: string) {

 /** ส่งไปประกาศบนเว็บไซต์ */
 function onWebSite() {
-  dialogConfirm(
-    $q,
-    () => {
-      showLoader();
-      http
-        .put(config.API.evaluationApproveDoc1(id.value))
-        .then((res) => {})
-        .catch((e) => {})
-        .finally(() => {
-          success($q, "ส่งไปประกาศบนเว็บไซต์สำเร็จ");
-          getStep();
-        });
-    },
-    "ยืนยันการส่งไปประกาศบนเว็บไซต์",
-    "ยืนยันการส่งไปประกาศบนเว็บไซต์ใช่หรือไม่?"
-  );
+  download10Url.value === ""
+    ? (fileEvaluationUpload.value = "")
+    : fileEvaluationUpload.value;
+  fileEvaluationUploadRef.value.validate();
+  if (
+    fileEvaluationUploadRef.value.hasError === false &&
+    download10Url.value !== ""
+  ) {
+    dialogConfirm(
+      $q,
+      () => {
+        showLoader();
+        http
+          .put(config.API.evaluationApproveDoc1(id.value))
+          .then((res) => {})
+          .catch((e) => {})
+          .finally(() => {
+            success($q, "ส่งไปประกาศบนเว็บไซต์สำเร็จ");
+            getStep();
+          });
+      },
+      "ยืนยันการส่งไปประกาศบนเว็บไซต์",
+      "ยืนยันการส่งไปประกาศบนเว็บไซต์ใช่หรือไม่?"
+    );
+  }
 }

 function getStep() {
@ -248,7 +258,6 @@ function fileUpLoad(url: string) {
      messageError($q, e);
    })
    .finally(() => {
-      fileEvaluationUpload.value = null;
      checkDoc10();
      success($q, "อัปโหลดไฟล์สำเร็จ");
    });
@ -408,6 +417,7 @@ onMounted(() => {
              <div v-if="store.currentStep == 4" class="row col-12">
                <div class="col-xs-12 col-sm-11 row">
                  <q-file
+                    ref="fileEvaluationUploadRef"
                    v-model="fileEvaluationUpload"
                    class="col-12"
                    outlined
@ -415,6 +425,11 @@ onMounted(() => {
                    hide-bottom-space
                    lazy-rules
                    accept=".pdf"
+                    :rules="
+                      download10Url === ''
+                        ? [(val) => !!val || 'กรุณาเลือกไฟล์']
+                        : []
+                    "
                  >
                    <template v-slot:prepend>
                      <q-icon name="attach_file" />
--- a/src/modules/12_evaluatePersonal/components/Detail/step/step5.vue
+++ b/src/modules/12_evaluatePersonal/components/Detail/step/step5.vue
@ -37,6 +37,7 @@ const AnnouncementEndDate = ref<string | null>();
 const id = ref<string>(route.params.id as string);
 const pdfSrc = ref<any>();
 const fileEvaluation5 = ref<any>();
+const fileEvaluation5Ref = ref<any>();
 const status = ref<string>("ANNOUNCE_WEB");
 const website = ref<string>("https://bma-ehr.frappet.com/");

@ -80,21 +81,30 @@ function deleteFile(name: string) {
 }

 function save() {
-  dialogConfirm($q, () => {
-    showLoader();
-    http
-      .put(config.API.evaluationNext5To6(id.value))
-      // .then((res) => {})
-      .catch((e) => {
-        messageError($q, e);
-      })
-      .finally(() => {
-        success($q, "บันทึกแจ้งผลการประกาศคัดเลือกสำเร็จ");
-        store.step = 6;
-        store.currentStep = 6;
-        hideLoader();
-      });
-  });
+  download10Url.value === ""
+    ? (fileEvaluation5.value = "")
+    : fileEvaluation5.value;
+  fileEvaluation5Ref.value.validate();
+  if (
+    fileEvaluation5Ref.value.hasError === false &&
+    download10Url.value !== ""
+  ) {
+    dialogConfirm($q, () => {
+      showLoader();
+      http
+        .put(config.API.evaluationNext5To6(id.value))
+        // .then((res) => {})
+        .catch((e) => {
+          messageError($q, e);
+        })
+        .finally(() => {
+          success($q, "บันทึกแจ้งผลการประกาศคัดเลือกสำเร็จ");
+          store.step = 6;
+          store.currentStep = 6;
+          hideLoader();
+        });
+    });
+  }
 }

 function upLoadFile() {
@ -135,7 +145,6 @@ function fileUpLoad(url: string) {
      messageError($q, e);
    })
    .finally(() => {
-      fileEvaluation5.value = null;
      checkDocResult();
      success($q, "อัปโหลดไฟล์สำเร็จ");
    });
@ -356,7 +365,7 @@ onMounted(() => {
              <div v-if="store.currentStep == 5" class="row col-12">
                <div class="col-xs-12 col-sm-10 row">
                  <q-file
-                    ref="fileEvaluation1Ref"
+                    ref="fileEvaluation5Ref"
                    v-model="fileEvaluation5"
                    class="col-12"
                    outlined
@ -365,6 +374,11 @@ onMounted(() => {
                    hide-bottom-space
                    lazy-rules
                    accept=".pdf"
+                    :rules="
+                      download10Url === ''
+                        ? [(val) => !!val || 'กรุณาเลือกไฟล์']
+                        : []
+                    "
                  >
                    <template v-slot:prepend>
                      <q-icon name="attach_file" />
--- a/src/modules/12_evaluatePersonal/components/Detail/step/step7.vue
+++ b/src/modules/12_evaluatePersonal/components/Detail/step/step7.vue
@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { reactive, ref,onMounted } from "vue";
+import { reactive, ref, onMounted } from "vue";
 import { VuePDF, usePDF } from "@tato30/vue-pdf";
 import { useCounterMixin } from "@/stores/mixin";
 import { useEvaluateDetailStore } from "@/modules/12_evaluatePersonal/store/EvaluateDetail";
@ -30,14 +30,14 @@ function handleItemClick(itemNumber: number) {
 // evaluationFilebyId
 function getFile(volume: number) {
  const fileText = numToThai(volume);
-  console.log(fileText)
+  console.log(fileText);
  showLoader();
  http
    .get(config.API.evaluationFilebyId("เล่ม 2", id.value, fileText))
    .then((res) => {
      const link = res.data.downloadUrl;
      const type = res.data.fileType;
-      console.log(link,type)
+      console.log(link, type);
      getPDF(link, type);
    })
    .catch((e) => {
@ -67,6 +67,7 @@ function getPDF(url: string, type: string) {
      const pdfData = await usePDF(`${objectUrl}`);
      showLoader();
      setTimeout(() => {
+        store.urlDownloadFile = url;
        store.log = 1;
        store.pdfSrcStore = pdfData.pdf.value;
        store.numOfPagesStore = pdfData.pages.value;
@ -90,9 +91,9 @@ function numToThai(val: number) {
  }
 }

-onMounted(()=>{
-  getFile(1)
-})
+onMounted(() => {
+  getFile(1);
+});
 </script>

 <template>
--- a/src/modules/12_evaluatePersonal/components/Detail/step/step8.vue
+++ b/src/modules/12_evaluatePersonal/components/Detail/step/step8.vue
@ -8,6 +8,8 @@ import { useCounterMixin } from "@/stores/mixin";
 import { useQuasar } from "quasar";
 import keycloak from "@/plugins/keycloak";

+import type { FileEvaluationRefRef } from "@/modules/12_evaluatePersonal/interface/index/evalute";
+
 import genReport from "@/plugins/genreport";
 import { useEvaluateDetailStore } from "@/modules/12_evaluatePersonal/store/EvaluateDetail";

@ -42,7 +44,21 @@ const fileEvaluation83 = ref<any>();
 const fileEvaluation84 = ref<any>();
 const fileEvaluation85 = ref<any>();
 const fileEvaluation86 = ref<any>();
+const fileEvaluation81Ref = ref<object | null>(null);
+const fileEvaluation82Ref = ref<object | null>(null);
+const fileEvaluation83Ref = ref<object | null>(null);
+const fileEvaluation84Ref = ref<object | null>(null);
+const fileEvaluation85Ref = ref<object | null>(null);
+const fileEvaluation86Ref = ref<object | null>(null);
 const profile = ref<any>();
+const fileEvaluationRef: FileEvaluationRefRef = {
+  fileEvaluation81: fileEvaluation81Ref,
+  fileEvaluation82: fileEvaluation82Ref,
+  fileEvaluation83: fileEvaluation83Ref,
+  fileEvaluation84: fileEvaluation84Ref,
+  fileEvaluation85: fileEvaluation85Ref,
+  fileEvaluation86: fileEvaluation86Ref,
+};

 async function onClickDowloadFile(
  tp: string,
@ -127,12 +143,12 @@ function fileUpLoad(url: string, file: any) {
      messageError($q, e);
    })
    .finally(() => {
-      fileEvaluation81.value = null;
-      fileEvaluation82.value = null;
-      fileEvaluation83.value = null;
-      fileEvaluation84.value = null;
-      fileEvaluation85.value = null;
-      fileEvaluation86.value = null;
+      // fileEvaluation81.value = null;
+      // fileEvaluation82.value = null;
+      // fileEvaluation83.value = null;
+      // fileEvaluation84.value = null;
+      // fileEvaluation85.value = null;
+      // fileEvaluation86.value = null;
      success($q, "อัปโหลดไฟล์สำเร็จ");
    });
 }
@ -183,38 +199,77 @@ function fileUpLoad(url: string, file: any) {
 //     .finally(() => {});
 // }

-function confirmApprove() {
-  dialogConfirm(
-    $q,
-    () => {
-      const data = {
-        metadata: {
-          additionalProp1: nameOfWork.value,
-          additionalProp2: nameOfOwner.value,
-          additionalProp3: position.value,
+async function confirmApprove() {
+  const fileEvaluationValues = [
+    fileEvaluation81,
+    fileEvaluation82,
+    fileEvaluation83,
+    fileEvaluation84,
+    fileEvaluation85,
+    fileEvaluation86,
+  ];
+  const downloadFileValues = [
+    downloadFile1,
+    downloadFile2,
+    downloadFile3,
+    downloadFile4,
+    downloadFile5,
+    downloadFile6,
+  ];
+
+  for (let i = 0; i < downloadFileValues.length; i++) {
+    if (downloadFileValues[i].value === "") {
+      fileEvaluationValues[i].value = null;
+    }
+  }
+  setTimeout(() => {
+    const hasError = [];
+    for (const key in fileEvaluationRef) {
+      if (Object.prototype.hasOwnProperty.call(fileEvaluationRef, key)) {
+        const property = fileEvaluationRef[key];
+        if (property.value && typeof property.value.validate === "function") {
+          const isValid = property.value.validate();
+          hasError.push(isValid);
+        }
+      }
+    }
+
+    if (hasError.every((result) => result === true)) {
+      dialogConfirm(
+        $q,
+        () => {
+          const data = {
+            metadata: {
+              additionalProp1: nameOfWork.value,
+              additionalProp2: nameOfOwner.value,
+              additionalProp3: position.value,
+            },
+          };
+          showLoader();
+          http
+            .patch(
+              config.API.evaluationPatchData(
+                "เล่ม 2",
+                id.value,
+                "1-เอกสารเล่ม 2"
+              ),
+              data
+            )
+            .then(() => {})
+            .catch((e) => {
+              messageError($q, e);
+            })
+            .finally(() => {
+              nextStep();
+              modalConfirm.value = false;
+              hideLoader();
+            });
        },
-      };
-      showLoader();
-      http
-        .patch(
-          config.API.evaluationPatchData("เล่ม 2", id.value, "1-เอกสารเล่ม 2"),
-          data
-        )
-        .then((res) => {
-          console.log(res);
-        })
-        .catch((e) => {
-          messageError($q, e);
-        })
-        .finally(() => {
-          nextStep();
-          modalConfirm.value = false;
-          hideLoader();
-        });
-    },
-    "ยืนยันผลการพิจารณา",
-    "ต้องการยืนยันผลการพิจารณาใช่หรือไม่?"
-  );
+        "ยืนยันผลการพิจารณา",
+        "ต้องการยืนยันผลการพิจารณาใช่หรือไม่?"
+      );
+    }
+  }, 100);
 }

 function nextStep() {
@ -379,6 +434,7 @@ onMounted(() => {
                        <div v-if="store.currentStep == 8" class="row col-12">
                          <div class="col-xs-12 col-sm-10 row">
                            <q-file
+                              ref="fileEvaluation81Ref"
                              v-model="fileEvaluation81"
                              class="col-12"
                              outlined
@ -387,6 +443,11 @@ onMounted(() => {
                              lazy-rules
                              label="อัปโหลดไฟล์"
                              accept=".pdf"
+                              :rules="
+                                downloadFile1 === ''
+                                  ? [(val) => !!val || 'กรุณาเลือกไฟล์']
+                                  : []
+                              "
                            >
                              <template v-slot:prepend>
                                <q-icon name="attach_file" />
@ -463,6 +524,7 @@ onMounted(() => {
                        <div v-if="store.currentStep == 8" class="row col-12">
                          <div class="col-xs-12 col-sm-10 row">
                            <q-file
+                              ref="fileEvaluation82Ref"
                              v-model="fileEvaluation82"
                              class="col-12"
                              outlined
@ -471,6 +533,11 @@ onMounted(() => {
                              lazy-rules
                              label="อัปโหลดไฟล์"
                              accept=".pdf"
+                              :rules="
+                                downloadFile2 === ''
+                                  ? [(val) => !!val || 'กรุณาเลือกไฟล์']
+                                  : []
+                              "
                            >
                              <template v-slot:prepend>
                                <q-icon name="attach_file" />
@ -547,6 +614,7 @@ onMounted(() => {
                        <div v-if="store.currentStep == 8" class="row col-12">
                          <div class="col-xs-12 col-sm-10 row">
                            <q-file
+                              ref="fileEvaluation83Ref"
                              v-model="fileEvaluation83"
                              class="col-12"
                              outlined
@ -555,6 +623,11 @@ onMounted(() => {
                              lazy-rules
                              label="อัปโหลดไฟล์"
                              accept=".pdf"
+                              :rules="
+                                downloadFile3 === ''
+                                  ? [(val) => !!val || 'กรุณาเลือกไฟล์']
+                                  : []
+                              "
                            >
                              <template v-slot:prepend>
                                <q-icon name="attach_file" />
@ -631,6 +704,7 @@ onMounted(() => {
                        <div v-if="store.currentStep == 8" class="row col-12">
                          <div class="col-xs-12 col-sm-10 row">
                            <q-file
+                              ref="fileEvaluation84Ref"
                              v-model="fileEvaluation84"
                              class="col-12"
                              outlined
@ -639,6 +713,11 @@ onMounted(() => {
                              lazy-rules
                              label="อัปโหลดไฟล์"
                              accept=".pdf"
+                              :rules="
+                                downloadFile4 === ''
+                                  ? [(val) => !!val || 'กรุณาเลือกไฟล์']
+                                  : []
+                              "
                            >
                              <template v-slot:prepend>
                                <q-icon name="attach_file" />
@ -715,6 +794,7 @@ onMounted(() => {
                        <div v-if="store.currentStep == 8" class="row col-12">
                          <div class="col-xs-12 col-sm-10 row">
                            <q-file
+                              ref="fileEvaluation85Ref"
                              v-model="fileEvaluation85"
                              class="col-12"
                              outlined
@ -723,6 +803,11 @@ onMounted(() => {
                              lazy-rules
                              label="อัปโหลดไฟล์"
                              accept=".pdf"
+                              :rules="
+                                downloadFile5 === ''
+                                  ? [(val) => !!val || 'กรุณาเลือกไฟล์']
+                                  : []
+                              "
                            >
                              <template v-slot:prepend>
                                <q-icon name="attach_file" />
@ -799,6 +884,7 @@ onMounted(() => {
                        <div v-if="store.currentStep == 8" class="row col-12">
                          <div class="col-xs-12 col-sm-10 row">
                            <q-file
+                              ref="fileEvaluation86Ref"
                              v-model="fileEvaluation86"
                              class="col-12"
                              outlined
@ -807,6 +893,11 @@ onMounted(() => {
                              lazy-rules
                              label="อัปโหลดไฟล์"
                              accept=".pdf"
+                              :rules="
+                                downloadFile6 === ''
+                                  ? [(val) => !!val || 'กรุณาเลือกไฟล์']
+                                  : []
+                              "
                            >
                              <template v-slot:prepend>
                                <q-icon name="attach_file" />
@ -876,7 +967,7 @@ onMounted(() => {
          unelevated
          label="ยืนยันผลการพิจารณา"
          color="public"
-          @click="openConfirmEvalution"
+          @click="confirmApprove"
        />
      </div>
    </div>
--- a/src/modules/12_evaluatePersonal/components/Detail/viewstep/tableStep1.vue
+++ b/src/modules/12_evaluatePersonal/components/Detail/viewstep/tableStep1.vue
@ -1,7 +1,11 @@
 <script setup lang="ts">
 const props = defineProps({
  columns: {
-    type: Object,
+    type: Array as () => any[],
+    require: true,
+  },
+  row: {
+    type: Array as () => any[],
    require: true,
  },
 });
@ -11,12 +15,14 @@ const props = defineProps({
  <d-table
    ref="table"
    :columns="props.columns"
+    :rows="props.row"
    row-key="name"
    flat
    bordered
    dense
    class="custom-header-table"
-    style="width: 580px"
+    style="width: 610px"
+    :rows-per-page-options="[10, 25, 50, 100]"
  >
    <!-- <template v-slot:header="props">
      <q-tr :props="props">
--- a/src/modules/12_evaluatePersonal/components/Detail/viewstep/viewPDF.vue
+++ b/src/modules/12_evaluatePersonal/components/Detail/viewstep/viewPDF.vue
@ -1,10 +1,16 @@
 <script setup lang="ts">
-import { ref, watch } from "vue";
+import { ref, watch, onMounted } from "vue";
 import { VuePDF, usePDF } from "@tato30/vue-pdf";
 import { useEvaluateDetailStore } from "@/modules/12_evaluatePersonal/store/EvaluateDetail";

 const store = useEvaluateDetailStore();

+const props = defineProps({
+  type: {
+    type: String,
+  },
+});
+
 const splitterModel = ref(14);
 const numOfPages = ref<number>(0);
 const page = ref<number>(1);
@ -24,11 +30,18 @@ function backPage() {
  }
 }

-watch(()=>store.log, () => {
-  if(store.log === 1){
-    numOfPages.value = store.numOfPagesStore;
-    pdfSrc.value = store.pdfSrcStore;
+watch(
+  () => store.log,
+  () => {
+    if (store.log === 1) {
+      numOfPages.value = store.numOfPagesStore;
+      pdfSrc.value = store.pdfSrcStore;
+    }
  }
+);
+onMounted(() => {
+  numOfPages.value = store.numOfPagesStore;
+  pdfSrc.value = store.pdfSrcStore;
 });
 </script>

@ -36,10 +49,10 @@ watch(()=>store.log, () => {
  <q-splitter
    v-model="splitterModel"
    horizontal
-    style="
-      height: 50vh;
-      border: 1px solid rgb(210, 210, 210);
-      border-radius: 5px;
+    :style="
+      props.type !== 'popup'
+        ? 'height: 50vh; border: 1px solid rgb(210, 210, 210);border-radius: 5px;'
+        : 'border: 1px solid rgb(210, 210, 210);border-radius: 5px;'
    "
    before-class="overflow-hidden disable"
    separator-class="bg-white disabled"
--- a/src/modules/12_evaluatePersonal/components/Detail/viewstep/viewStep1.vue
+++ b/src/modules/12_evaluatePersonal/components/Detail/viewstep/viewStep1.vue
@ -50,10 +50,8 @@ const formDetail = reactive({

 onMounted(() => {
  if (props.data) {
-    // formDetail.userId = props.data.id;
-    // formDetail.citizenId = props.data.citizenId;
    formDetail.prefix = props.data.prefix;
-    formDetail.fullName = `${props.data.firstName}  ${props.data.lastName}`;
+    formDetail.fullName = props.data.fullName;
    formDetail.position = props.data.position;
    formDetail.oc = props.data.oc;
    formDetail.salary = props.data.salary
@ -64,10 +62,12 @@ onMounted(() => {
    formDetail.birthDate =
      props.data.birthDate && date2Thai(props.data.birthDate);
    formDetail.govAge = props.data.govAge;
-    formDetail.educations = props.data.educations;
+    formDetail.educations = props.data.education;

-    formDetail.certificates = props.data.certificates
-      ? props.data.certificates.map((e: CertificatesForm) => ({
+    console.log(props.data.certificate);
+
+    formDetail.certificates = props.data.certificate
+      ? props.data.certificate.map((e: CertificatesForm) => ({
          certificateNo: e.certificateNo,
          certificateType: e.certificateType,
          expireDate: date2Thai(e.expireDate),
@ -75,6 +75,9 @@ onMounted(() => {
          issuer: e.issuer,
        }))
      : [];
+
+    console.log(formDetail.certificates);
+
    formDetail.salaries = props.data.salaries
      ? props.data.salaries.map((e: any) => ({
          amount: e.amount,
@ -102,8 +105,8 @@ onMounted(() => {
        }))
      : [];

-    formDetail.trainings = props.data.trainings
-      ? props.data.trainings.map((e: any) => ({
+    formDetail.trainings = props.data.training
+      ? props.data.training.map((e: any) => ({
          dateOrder: date2Thai(e.dateOrder),
          department: e.department,
          duration: e.duration,
@ -116,7 +119,7 @@ onMounted(() => {
          yearly: e.yearly,
        }))
      : [];
-    formDetail.assessments = props.data.assessments;
+    formDetail.assessments = props.data.assessment;
  }
 });
 </script>
--- a/src/modules/12_evaluatePersonal/components/Detail/viewstep/viewStep3.vue
+++ b/src/modules/12_evaluatePersonal/components/Detail/viewstep/viewStep3.vue
@ -1,12 +1,38 @@
 <script setup lang="ts">
+import { ref } from "vue";
+import DialogHeader from "@/components/DialogHeader.vue";
 import ViewPDF from "@/modules/12_evaluatePersonal/components/Detail/viewstep/viewPDF.vue";

 import { useEvaluateDetailStore } from "@/modules/12_evaluatePersonal/store/EvaluateDetail";

 const store = useEvaluateDetailStore();
+
+const modalPerview = ref<boolean>(false);
 </script>

 <template>
+  <div class="col-12 row">
+    <q-space />
+    <q-btn
+      flat
+      round
+      color="primary"
+      icon="download"
+      target="_blank"
+      :href="store.urlDownloadFile"
+    >
+      <q-tooltip>ดาวน์โหลด</q-tooltip>
+    </q-btn>
+    <q-btn
+      flat
+      round
+      color="primary"
+      icon="mdi-fullscreen"
+      @click="modalPerview = true"
+      ><q-tooltip>ดูเต็มจอ</q-tooltip></q-btn
+    >
+  </div>
+
  <q-tab-panels v-model="store.tabPanels" animated swipeable vertical>
    <q-tab-panel name="1">
      <ViewPDF />
@ -29,6 +55,22 @@ const store = useEvaluateDetailStore();
      <ViewPDF />
    </q-tab-panel>
  </q-tab-panels>
+
+  <q-dialog v-model="modalPerview" full-width fullHeight>
+    <q-card>
+      <q-card-section>
+        <DialogHeader :close="() => (modalPerview = false)" />
+      </q-card-section>
+
+      <q-card-section class="q-pt-none">
+        <ViewPDF :type="'popup'" />
+      </q-card-section>
+    </q-card>
+  </q-dialog>
 </template>

-<style scoped></style>
+<style>
+.q-tab-panel {
+  padding: 0px;
+}
+</style>
--- a/src/modules/12_evaluatePersonal/components/Detail/viewstep/viewStep7.vue
+++ b/src/modules/12_evaluatePersonal/components/Detail/viewstep/viewStep7.vue
@ -1,17 +1,54 @@
 <script setup lang="ts">
+import { ref } from "vue";
+import DialogHeader from "@/components/DialogHeader.vue";
 import ViewPDF from "@/modules/12_evaluatePersonal/components/Detail/viewstep/viewPDF.vue";

 import { useEvaluateDetailStore } from "@/modules/12_evaluatePersonal/store/EvaluateDetail";

 const store = useEvaluateDetailStore();
+
+const modalPerview = ref<boolean>(false);
 </script>

 <template>
-  <q-tab-panels v-model="store.tabPanels" animated swipeable vertical>
-    <q-tab-panel name="1">
-      <ViewPDF />
-    </q-tab-panel>
-  </q-tab-panels>
+  <div class="col-12 row">
+    <q-space />
+    <q-btn
+      flat
+      round
+      color="primary"
+      icon="download"
+      target="_blank"
+      :href="store.urlDownloadFile"
+    >
+      <q-tooltip>ดาวน์โหลด</q-tooltip>
+    </q-btn>
+    <q-btn
+      flat
+      round
+      color="primary"
+      icon="mdi-fullscreen"
+      @click="modalPerview = true"
+      ><q-tooltip>ดูเต็มจอ</q-tooltip></q-btn
+    >
+  </div>
+  <!-- <q-tab-panels v-model="store.tabPanels" animated swipeable vertical>
+    <q-tab-panel name="1"> -->
+  <ViewPDF />
+  <!-- </q-tab-panel>
+  </q-tab-panels> -->
+
+  <q-dialog v-model="modalPerview" full-width fullHeight>
+    <q-card>
+      <q-card-section>
+        <DialogHeader :close="() => (modalPerview = false)" />
+      </q-card-section>
+
+      <q-card-section class="q-pt-none">
+        <ViewPDF :type="'popup'" />
+      </q-card-section>
+    </q-card>
+  </q-dialog>
 </template>

 <style scoped></style>
--- a/src/modules/12_evaluatePersonal/interface/index/evalute.ts
+++ b/src/modules/12_evaluatePersonal/interface/index/evalute.ts
@ -14,6 +14,17 @@ interface FormCommandRef {
  [key: string]: any;
 }

+interface FileEvaluationRefRef {
+  fileEvaluation81: object | null;
+  fileEvaluation82: object | null;
+  fileEvaluation83: object | null;
+  fileEvaluation84: object | null;
+  fileEvaluation85: object | null;
+  fileEvaluation86: object | null;
+
+  [key: string]: any;
+}
+
 interface EducationForm {
  country: string;
  degree: string;
@ -40,4 +51,10 @@ interface CertificatesForm {
  issuer: string;
 }

-export type { FormCommand, FormCommandRef, EducationForm, CertificatesForm };
+export type {
+  FormCommand,
+  FormCommandRef,
+  EducationForm,
+  CertificatesForm,
+  FileEvaluationRefRef,
+};
--- a/src/modules/12_evaluatePersonal/store/Evaluate.ts
+++ b/src/modules/12_evaluatePersonal/store/Evaluate.ts
@ -23,9 +23,9 @@ export const useEvalutuonStore = defineStore("EvalutuonStore", () => {
      case "PREPARE_DOC_V2":
        return "จัดเตรียมเอกสารเล่ม 2";
      case "WAIT_CHECK_DOC_V2":
-        return "ตรวจสอบความถูกต้องของเอกสารเล่ม 2";
+        return "รอพิจารณาผลการประเมิน 2";
      case "CHECK_DOC_V2":
-        return "รอพิจารณาผลการประเมิน";
+        return "ตรวจสอบความถูกต้องของเอกสารเล่ม 2";
      case "DONE":
        return "เสร็จสิ้น";
    }
--- a/src/modules/12_evaluatePersonal/store/EvaluateDetail.ts
+++ b/src/modules/12_evaluatePersonal/store/EvaluateDetail.ts
@ -14,16 +14,17 @@ export const useEvaluateDetailStore = defineStore("evaluateDetailStore", () => {
    "รอตรวจสอบคุณสมบัติ",
    "ประกาศบนเว็บไซต์",
    "จัดเตรียมเอกสารเล่ม 2",
-    "ตรวจสอบเอกสารเล่ม 2",
-    "รอพิจารณาผล",
+    "รอพิจารณาผลการประเมิน 2",
+    "ตรวจสอบความถูกต้องของเอกสารเล่ม 2",
    "เสร็จสิ้น",
  ]);

  const tabPanels = ref<string>("1");

-  const log = ref<any>(0)
-  const pdfSrcStore = ref<any>()
-  const numOfPagesStore = ref<any>()
+  const log = ref<any>(0);
+  const urlDownloadFile = ref<string>("");
+  const pdfSrcStore = ref<any>();
+  const numOfPagesStore = ref<any>();

  const columnsCertificates = ref<QTableProps["columns"]>([
    {
@ -291,8 +292,9 @@ export const useEvaluateDetailStore = defineStore("evaluateDetailStore", () => {
    columnTraining,
    columnProjectsProposed,
    pdfSrcStore,
+    urlDownloadFile,
    numOfPagesStore,
    log,
-    currentStep
+    currentStep,
  };
 });