ปรับ Eva

src/modules/06_evaluate/components/step/step2.vue

@@ -31,26 +31,53 @@ const emit = defineEmits(["update:form"]);
 const formCommand = reactive<FormCommand>({
   commanderFullname: "",
   commanderPosition: "",
+  commanderPositionOld: "",
+  commanderOrg: "",
+  commanderOrgOld: "",
   commanderAboveFullname: "",
   commanderAbovePosition: "",
+  commanderAbovePositionOld: "",
+  commanderAboveOrgOld: "",
+  commanderAboveOrg: "",
   author: "",
-  subject: "",
+  subject: [""],
   assignedPosition: "",
 });
 
-/** formRef */
-const commanderFullnameRef = ref<object | null>(null);
-const commanderPositionRef = ref<object | null>(null);
-const commanderAboveFullnameRef = ref<object | null>(null);
-const commanderAbovePositionRef = ref<object | null>(null);
-const fileEvaluation1Ref = ref<object | null>(null);
-const fileEvaluation2Ref = ref<object | null>(null);
-const fileEvaluation3Ref = ref<object | null>(null);
-const fileEvaluation4Ref = ref<object | null>(null);
-const fileEvaluation5Ref = ref<object | null>(null);
-const fileEvaluation6Ref = ref<object | null>(null);
-const performanceRef = ref<object | null>(null);
-const performanceOwnerRef = ref<object | null>(null);
+const formTemplates = ref<any[]>([
+  {
+    code: "EV1_005",
+    templateName: "template-1",
+    title: "แบบพิจารณาคุณสมบัติบุคคล",
+    fileName: "1-แบบพิจารณาคุณสมบัติบุคคล",
+    downloadFile: "",
+    file: null,
+  },
+  {
+    code: "EV1_006",
+    templateName: "template-2",
+    title: "แบบแสดงรายละเอียดการเสนอผลงาน",
+    fileName: "2-แบบแสดงรายละเอียดการเสนอผลงาน",
+    downloadFile: "",
+    file: null,
+  },
+  {
+    code: "EV1_008",
+    templateName: "template-4",
+    title: "แบบประเมินคุณลักษณะบุคคล",
+    fileName: "4-แบบประเมินคุณลักษณะบุคคล",
+    downloadFile: "",
+    file: null,
+  },
+  {
+    code: "EV1_010",
+    templateName: "template-6",
+    title: "ผลงานที่จะส่งประเมิน (เอกสารหมายเลข 11)",
+    fileName: "6-ผลงานที่จะส่งประเมิน (เอกสารหมายเลข 11)",
+    downloadFile: "",
+    file: null,
+  },
+]);
 
 /**
  * function updateFormref
@@ -58,39 +85,12 @@ const performanceOwnerRef = ref<object | null>(null);
  */
 function updateInput(val: any) {
   const ref = {
-    commanderFullnameRef: commanderFullnameRef.value,
-    commanderPositionRef: commanderPositionRef.value,
-    commanderAboveFullnameRef: commanderAboveFullnameRef.value,
-    commanderAbovePositionRef: commanderAbovePositionRef.value,
-    fileEvaluation1Ref: fileEvaluation1Ref.value,
-    fileEvaluation2Ref: fileEvaluation2Ref.value,
-    fileEvaluation3Ref: fileEvaluation3Ref.value,
-    fileEvaluation4Ref: fileEvaluation4Ref.value,
-    fileEvaluation5Ref: fileEvaluation5Ref.value,
-    fileEvaluation6Ref: fileEvaluation6Ref.value,
-    downloadFile: [
-      downloadFile1.value,
-      downloadFile2.value,
-      downloadFile3.value,
-      downloadFile4.value,
-      downloadFile5.value,
-      downloadFile6.value,
-    ],
-    performance: performanceRef.value,
-    performanceOwner: performanceOwnerRef.value,
-    statusUpload: store.statusUpload,
+    statusUpload: false,
+    downloadFile: formTemplates.value.map((e) => e.downloadFile),
   };
   emit("update:form", val, ref); // ส่งข้อมูลไปอัปเดท
 }
 
-/** ตัวแปร file*/
-const fileEvaluation1 = ref<File | null>();
-const fileEvaluation2 = ref<File | null>();
-const fileEvaluation3 = ref<File | null>();
-const fileEvaluation4 = ref<File | null>();
-const fileEvaluation5 = ref<File | null>();
-const fileEvaluation6 = ref<File | null>();
-
 const modalView = ref<boolean>(false);
 const numOfPages = ref<number>(0);
 const page = ref<number>(1);
@@ -123,13 +123,13 @@ async function onClickDowloadFile(
   fileName: string
 ) {
   showLoader();
-
   const body = {
     template: tp,
     reportName: templateName,
     data: profile.value,
   };
   await genReport(body, fileName); //สร้างไฟล์ต้นแบบ
+  hideLoader();
 }
 
 /**
@@ -170,10 +170,9 @@ async function fetchPathUpload(
       })
       .catch((err) => {
         messageError($q, err);
-        hideLoader();
       })
       .finally(() => {
-        // hideLoader();
+        hideLoader();
       });
   }
 }
@@ -195,9 +194,6 @@ async function uploadfile(uploadUrl: string, file: any) {
     })
     .catch((err) => {
       messageError($q, err);
-    })
-    .finally(() => {
-      hideLoader();
     });
 }
 
@@ -206,16 +202,20 @@ async function uploadfile(uploadUrl: string, file: any) {
  * @param id evaluate ID
  */
 function fetcheSigner(id: string) {
-  showLoader();
   http
     .get(config.API.evaluationSignerDoc1(id))
     .then((res) => {
       const data = res.data.result;
-
       formCommand.commanderFullname = data.commanderFullname;
       formCommand.commanderPosition = data.commanderPosition;
+      formCommand.commanderPositionOld = data.commanderPositionOld;
+      formCommand.commanderOrg = data.commanderOrg;
+      formCommand.commanderOrgOld = data.commanderOrgOld;
       formCommand.commanderAboveFullname = data.commanderAboveFullname;
       formCommand.commanderAbovePosition = data.commanderAbovePosition;
+      formCommand.commanderAbovePositionOld = data.commanderAbovePositionOld;
+      formCommand.commanderAboveOrgOld = data.commanderAboveOrgOld;
+      formCommand.commanderAboveOrg = data.commanderAboveOrg;
       formCommand.author = data.author;
       formCommand.subject = data.subject;
       store.statusUpload = true;
@@ -223,11 +223,6 @@ function fetcheSigner(id: string) {
     .catch(() => {
       store.statusUpload = false;
       getCommander();
-    })
-    .finally(() => {
-      setTimeout(() => {
-        hideLoader();
-      }, 2000);
     });
 }
 
@@ -236,7 +231,6 @@ function fetcheSigner(id: string) {
  * @param id  evaluate ID
  */
 async function fetchCheckSpec(id: string) {
-  showLoader();
   await http
     .get(config.API.evaluationReportCheckspecByid(id))
     .then((res) => {
@@ -245,85 +239,31 @@ async function fetchCheckSpec(id: string) {
     })
     .catch((err) => {
       messageError($q, err);
-    })
-    .finally(() => {
-      setTimeout(() => {
-        hideLoader();
-      }, 2000);
     });
 }
 
-const downloadFile1 = ref<string>("");
-const downloadFile2 = ref<string>("");
-const downloadFile3 = ref<string>("");
-const downloadFile4 = ref<string>("");
-const downloadFile5 = ref<string>("");
-const downloadFile6 = ref<string>("");
-
 /**
  * function ดาวน์โหลดไฟล์
  * @param fileName ชื่อไฟล์
  */
 async function downloadFile(fileName: string) {
-  // showLoader();
   await http
     .get(config.API.loadFileDocument("เล่ม 1", evaluateId.value, fileName))
     .then((res) => {
-      if (fileName === "1-แบบพิจารณาคุณสมบัติบุคคล") {
-        downloadFile1.value = res.data.downloadUrl;
-        // fileEvaluation1.value = res.data.upload;
-      } else if (fileName === "2-แบบแสดงรายละเอียดการเสนอผลงาน") {
-        downloadFile2.value = res.data.downloadUrl;
-        // fileEvaluation2.value = res.data.upload;
-      } else if (
-        fileName ===
-        "3-แบบตรวจสอบความถูกต้องครบถ้วนของข้อมูลเพื่อประกอบการคัดเลือกบุคคล (เอกสารแบบ ก)"
-      ) {
-        downloadFile3.value = res.data.downloadUrl;
-        // fileEvaluation3.value = res.data.upload;
-      } else if (fileName === "4-แบบประเมินคุณลักษณะบุคคล") {
-        downloadFile4.value = res.data.downloadUrl;
-        // fileEvaluation4.value = res.data.upload;
-      } else if (
-        fileName === "5-แบบสรุปข้อมูลของผู้ขอรับการคัดเลือก (เอกสารหมายเลข 9)"
-      ) {
-        downloadFile5.value = res.data.downloadUrl;
-        // fileEvaluation5.value = res.data.upload;
-      } else if (fileName === "6-ผลงานที่จะส่งประเมิน (เอกสารหมายเลข 11)") {
-        downloadFile6.value = res.data.downloadUrl;
-        // fileEvaluation6.value = res.data.upload;
+      const index = formTemplates.value.findIndex(
+        (item) => item.fileName === fileName
+      );
+      if (index !== -1) {
+        formTemplates.value[index].downloadFile = res.data.downloadUrl;
       }
     })
     .finally(() => {
       const ref = {
-        commanderFullnameRef: commanderFullnameRef.value,
-        commanderPositionRef: commanderPositionRef.value,
-        commanderAboveFullnameRef: commanderAboveFullnameRef.value,
-        commanderAbovePositionRef: commanderAbovePositionRef.value,
-        fileEvaluation1Ref: fileEvaluation1Ref.value,
-        fileEvaluation2Ref: fileEvaluation2Ref.value,
-        fileEvaluation3Ref: fileEvaluation3Ref.value,
-        fileEvaluation4Ref: fileEvaluation4Ref.value,
-        fileEvaluation5Ref: fileEvaluation5Ref.value,
-        fileEvaluation6Ref: fileEvaluation6Ref.value,
-        performance: performanceRef.value,
-        performanceOwner: performanceOwnerRef.value,
-        downloadFile: [
-          downloadFile1.value,
-          downloadFile2.value,
-          downloadFile3.value,
-          downloadFile4.value,
-          downloadFile5.value,
-          downloadFile6.value,
-        ],
         statusUpload: false,
+        downloadFile: formTemplates.value.map((e) => e.downloadFile),
       };
 
       emit("update:form", formCommand, ref);
-
-      setTimeout(() => {
-        hideLoader();
-      }, 2000);
     });
 }
 
@@ -339,32 +279,24 @@ function getCommander() {
     })
     .catch((e) => {
       console.log(e);
-      // messageError($q, e);
     });
 }
+
+function onAddSubject() {
+  formCommand.subject.push("");
+}
+
+function onDeleteSubject(index: number) {
+  formCommand.subject.splice(index, 1);
+}
+
 /** callback function */
 watch(
   () => store.checkFileupload,
   () => {
-    const fileEvaluationValues = [
-      fileEvaluation1,
-      fileEvaluation2,
-      fileEvaluation3,
-      fileEvaluation4,
-      fileEvaluation5,
-      fileEvaluation6,
-    ];
-    const downloadFileValues = [
-      downloadFile1,
-      downloadFile2,
-      downloadFile3,
-      downloadFile4,
-      downloadFile5,
-      downloadFile6,
-    ];
-    for (let i = 0; i < downloadFileValues.length; i++) {
-      if (downloadFileValues[i].value === "") {
-        fileEvaluationValues[i].value = null;
+    for (let i = 0; i < formTemplates.value.length; i++) {
+      if (formTemplates.value[i].downloadFile === "") {
+        formTemplates.value[i].file = null;
       }
     }
   }
@@ -385,19 +317,29 @@ onMounted(async () => {
   if (user) {
     formCommand.author = user.name;
   }
-  showLoader();
-  await Promise.all([
-    fetcheSigner(evaluateId.value),
-    fetchCheckSpec(evaluateId.value),
-    downloadFile("1-แบบพิจารณาคุณสมบัติบุคคล"),
-    downloadFile("2-แบบแสดงรายละเอียดการเสนอผลงาน"),
-    downloadFile(
-      "3-แบบตรวจสอบความถูกต้องครบถ้วนของข้อมูลเพื่อประกอบการคัดเลือกบุคคล (เอกสารแบบ ก)"
-    ),
-    downloadFile("4-แบบประเมินคุณลักษณะบุคคล"),
-    downloadFile("5-แบบสรุปข้อมูลของผู้ขอรับการคัดเลือก (เอกสารหมายเลข 9)"),
-    downloadFile("6-ผลงานที่จะส่งประเมิน (เอกสารหมายเลข 11)"),
-  ]);
+
+  try {
+    showLoader();
+    await Promise.all([
+      fetcheSigner(evaluateId.value),
+      fetchCheckSpec(evaluateId.value),
+      formTemplates.value.forEach((e) => {
+        downloadFile(e.fileName);
+      }),
+      // downloadFile("1-แบบพิจารณาคุณสมบัติบุคคล"),
+      // downloadFile("2-แบบแสดงรายละเอียดการเสนอผลงาน"),
+      // downloadFile(
+      //   "3-แบบตรวจสอบความถูกต้องครบถ้วนของข้อมูลเพื่อประกอบการคัดเลือกบุคคล (เอกสารแบบ ก)"
+      // ),
+      // downloadFile("4-แบบประเมินคุณลักษณะบุคคล"),
+      // downloadFile("5-แบบสรุปข้อมูลของผู้ขอรับการคัดเลือก (เอกสารหมายเลข 9)"),
+      // downloadFile("6-ผลงานที่จะส่งประเมิน (เอกสารหมายเลข 11)"),
+    ]);
+  } catch (error) {
+    console.log(error);
+  } finally {
+    hideLoader();
+  }
 });
 </script>
 
@@ -412,32 +354,67 @@ onMounted(async () => {
         <div class="col-12"><q-separator /></div>
         <div class="col-12 q-pa-sm">
           <div class="row q-col-gutter-sm">
-            <q-input
-              :readonly="store.currentStep != 2 || store.statusUpload"
-              ref="performanceRef"
-              dense
-              class="col-xs-12 col-sm-6"
-              outlined
-              label="ชื่อผลงาน"
-              v-model="formCommand.subject"
-              @update:model-value="updateInput(formCommand)"
-              :rules="[(val:string) => !!val || `${'กรุณากรอกชื่อผลงาน'}`]"
-              lazy-rules
-              hide-bottom-space
-            />
-            <q-input
-              :readonly="store.currentStep != 2 || store.statusUpload"
-              ref="performanceOwnerRef"
-              class="col-xs-12 col-sm-6"
-              dense
-              outlined
-              v-model="formCommand.author"
-              @update:model-value="updateInput(formCommand)"
-              label="เจ้าของผลงาน"
-              :rules="[(val:string) => !!val || `${'กรุณากรอกเจ้าของผลงาน'}`]"
-              lazy-rules
-              hide-bottom-space
-            />
+            <div class="col-12">
+              <q-input
+                :readonly="store.currentStep != 2 || store.statusUpload"
+                dense
+                outlined
+                v-model="formCommand.author"
+                @update:model-value="updateInput(formCommand)"
+                label="เจ้าของผลงาน"
+                :rules="[(val:string) => !!val || `${'กรุณากรอกเจ้าของผลงาน'}`]"
+                lazy-rules
+                hide-bottom-space
+              />
+            </div>
+            <div
+              class="col-12"
+              v-if="store.currentStep === 2 && !store.statusUpload"
+            >
+              <q-btn
+                flat
+                round
+                color="primary"
+                icon="add"
+                @click="onAddSubject"
+              >
+                <q-tooltip>เพิ่มชื่อผลงาน</q-tooltip>
+              </q-btn>
+            </div>
+            <div
+              class="row col-12 q-col-gutter-sm"
+              v-for="(item, index) in formCommand.subject"
+              :key="index"
+            >
+              <div class="col-11">
+                <q-input
+                  :readonly="store.currentStep != 2 || store.statusUpload"
+                  dense
+                  outlined
+                  label="ชื่อผลงาน"
+                  v-model="formCommand.subject[index]"
+                  @update:model-value="updateInput(formCommand)"
+                  :rules="[(val:string) => !!val || `${'กรุณากรอกชื่อผลงาน'}`]"
+                  lazy-rules
+                  hide-bottom-space
+                />
+              </div>
+              <div
+                class="row col-1 items-centet justify-center"
+                v-if="index !== 0"
+              >
+                <q-btn
+                  v-if="store.currentStep === 2 && !store.statusUpload"
+                  flat
+                  round
+                  color="red"
+                  icon="delete"
+                  @click="onDeleteSubject(index)"
+                >
+                  <q-tooltip>ลบ</q-tooltip>
+                </q-btn>
+              </div>
+            </div>
           </div>
         </div>
       </q-card>
@@ -459,7 +436,6 @@ onMounted(async () => {
               <div class="row col-12 q-col-gutter-sm q-pa-sm">
                 <q-input
                   :readonly="store.currentStep != 2 || store.statusUpload"
-                  ref="commanderFullnameRef"
                   dense
                   class="col-xs-12 col-sm-6"
                   outlined
@@ -470,19 +446,58 @@ onMounted(async () => {
                   lazy-rules
                   hide-bottom-space
                 />
-                <q-input
-                  :readonly="store.currentStep != 2 || store.statusUpload"
-                  ref="commanderPositionRef"
-                  class="col-xs-12 col-sm-6"
-                  dense
-                  outlined
-                  v-model="formCommand.commanderPosition"
-                  @update:model-value="updateInput(formCommand)"
-                  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="store.currentStep != 2 || store.statusUpload"
+                      class="col-xs-6 col-sm-3"
+                      dense
+                      outlined
+                      v-model="formCommand.commanderPosition"
+                      @update:model-value="updateInput(formCommand)"
+                      label="ตำแหน่ง"
+                      :rules="[(val:string) => !!val || `${'กรุณากรอกตำแหน่ง'}`]"
+                      lazy-rules
+                      hide-bottom-space
+                    />
+                    <q-input
+                      :readonly="store.currentStep != 2 || store.statusUpload"
+                      class="col-xs-6 col-sm-3"
+                      dense
+                      outlined
+                      v-model="formCommand.commanderPositionOld"
+                      @update:model-value="updateInput(formCommand)"
+                      label="ตำแหน่งเดิม"
+                      :rules="[(val:string) => !!val || `${'กรุณากรอกตำแหน่งเดิม'}`]"
+                      lazy-rules
+                      hide-bottom-space
+                    />
+                    <q-input
+                      :readonly="store.currentStep != 2 || store.statusUpload"
+                      class="col-xs-6 col-sm-3"
+                      dense
+                      outlined
+                      v-model="formCommand.commanderOrg"
+                      @update:model-value="updateInput(formCommand)"
+                      label="สังกัด"
+                      :rules="[(val:string) => !!val || `${'กรุณากรอกสังกัด'}`]"
+                      lazy-rules
+                      hide-bottom-space
+                    />
+                    <q-input
+                      :readonly="store.currentStep != 2 || store.statusUpload"
+                      class="col-xs-6 col-sm-3"
+                      dense
+                      outlined
+                      v-model="formCommand.commanderOrgOld"
+                      @update:model-value="updateInput(formCommand)"
+                      label="สังกัดเดิม"
+                      :rules="[(val:string) => !!val || `${'กรุณากรอกสังกัดเดิม'}`]"
+                      lazy-rules
+                      hide-bottom-space
+                    />
+                  </div>
+                </div>
               </div>
             </div>
           </div>
@@ -494,7 +509,6 @@ onMounted(async () => {
               <div class="row col-12 q-col-gutter-md q-pa-sm">
                 <q-input
                   :readonly="store.currentStep != 2 || store.statusUpload"
-                  ref="commanderAboveFullnameRef"
                   dense
                   class="col-xs-12 col-sm-6"
                   outlined
@@ -505,19 +519,59 @@ onMounted(async () => {
                   @update:model-value="updateInput(formCommand)"
                   hide-bottom-space
                 />
-                <q-input
-                  :readonly="store.currentStep != 2 || store.statusUpload"
-                  ref="commanderAbovePositionRef"
-                  class="col-xs-12 col-sm-6"
-                  dense
-                  outlined
-                  v-model="formCommand.commanderAbovePosition"
-                  label="ตำแหน่ง"
-                  :rules="[(val:string) => !!val || `${'กรุณากรอกตำแหน่ง'}`]"
-                  lazy-rules
-                  hide-bottom-space
-                  @update:model-value="updateInput(formCommand)"
-                />
+
+                <div class="col-12">
+                  <div class="row col-12 q-col-gutter-sm">
+                    <q-input
+                      :readonly="store.currentStep != 2 || store.statusUpload"
+                      class="col-xs-6 col-sm-3"
+                      dense
+                      outlined
+                      v-model="formCommand.commanderAbovePosition"
+                      label="ตำแหน่ง"
+                      :rules="[(val:string) => !!val || `${'กรุณากรอกตำแหน่ง'}`]"
+                      lazy-rules
+                      hide-bottom-space
+                      @update:model-value="updateInput(formCommand)"
+                    />
+                    <q-input
+                      :readonly="store.currentStep != 2 || store.statusUpload"
+                      class="col-xs-6 col-sm-3"
+                      dense
+                      outlined
+                      v-model="formCommand.commanderAbovePositionOld"
+                      label="ตำแหน่งเดิม"
+                      :rules="[(val:string) => !!val || `${'กรุณากรอกตำแหน่งเดิม'}`]"
+                      lazy-rules
+                      hide-bottom-space
+                      @update:model-value="updateInput(formCommand)"
+                    />
+                    <q-input
+                      :readonly="store.currentStep != 2 || store.statusUpload"
+                      class="col-xs-6 col-sm-3"
+                      dense
+                      outlined
+                      v-model="formCommand.commanderAboveOrg"
+                      label="สังกัด"
+                      :rules="[(val:string) => !!val || `${'กรุณากรอกสังกัด'}`]"
+                      lazy-rules
+                      hide-bottom-space
+                      @update:model-value="updateInput(formCommand)"
+                    />
+                    <q-input
+                      :readonly="store.currentStep != 2 || store.statusUpload"
+                      class="col-xs-6 col-sm-3"
+                      dense
+                      outlined
+                      v-model="formCommand.commanderAboveOrgOld"
+                      label="สังกัดเดิม"
+                      :rules="[(val:string) => !!val || `${'กรุณากรอกสังกัดเดิม'}`]"
+                      lazy-rules
+                      hide-bottom-space
+                      @update:model-value="updateInput(formCommand)"
+                    />
+                  </div>
+                </div>
               </div>
             </div>
           </div>
@@ -527,8 +581,97 @@ onMounted(async () => {
 
     <!-- v-if="store.statusUpload -->
     <div class="row q-col-gutter-sm">
+      <div
+        class="col-6"
+        v-if="store.currentStep === 2"
+        v-for="(item, index) in formTemplates"
+        :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
+                  v-model="item.file"
+                  :disable="!store.statusUpload"
+                  class="col-xs-12 col-sm-12"
+                  label="อัปโหลดไฟล์"
+                  outlined
+                  dense
+                  lazy-rules
+                  hide-bottom-space
+                  accept=".pdf"
+                  :rules="
+                  item.downloadFile === ''
+                      ? [(val:any) => !!val || 'กรุณาเลือกไฟล์']
+                      : []
+                  "
+                >
+                  <template v-slot:prepend>
+                    <q-icon name="attach_file" />
+                  </template>
+                  <template v-slot:after>
+                    <q-btn
+                      :disable="!store.statusUpload"
+                      flat
+                      round
+                      dense
+                      color="primary"
+                      icon="mdi-upload"
+                      @click="
+                        fetchPathUpload(
+                          'เล่ม 1',
+                          evaluateId,
+                          item.fileName,
+                          item.file
+                        )
+                      "
+                      ><q-tooltip>อัปโหลดไฟล์</q-tooltip></q-btn
+                    >
+                  </template>
+                </q-file>
+              </div>
+            </div>
+          </div>
+        </q-card>
+      </div>
+
       <!-- แบบพิจารณาคุณสมบัติบุคคล -->
-      <div class="col-6" v-if="store.currentStep === 2">
+      <!-- <div class="col-6" v-if="store.currentStep === 2">
         <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"
@@ -615,10 +758,10 @@ onMounted(async () => {
             </div>
           </div>
         </q-card>
-      </div>
+      </div> -->
 
       <!-- แบบแสดงรายละเอียดการเสนอผลงาน     -->
-      <div class="col-6" v-if="store.currentStep === 2">
+      <!-- <div class="col-6" v-if="store.currentStep === 2">
         <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"
@@ -705,10 +848,10 @@ onMounted(async () => {
             </div>
           </div>
         </q-card>
-      </div>
+      </div> -->
 
       <!-- แบบตรวจสอบความถูกต้องครบถ้วนของข้อมูลเพื่อประกอบการคัดเลือกบุคคล (เอกสารแบบ ก) -->
-      <div class="col-6" v-if="store.currentStep === 2">
+      <!-- <div class="col-6" v-if="store.currentStep === 2">
         <q-card bordered class="cardSp1">
           <div
             class="col-12 row text-weight-medium bg-grey-1 q-py-sm q-pl-md q-pr-sm no-wrap"
@@ -795,10 +938,10 @@ onMounted(async () => {
             </div>
           </div>
         </q-card>
-      </div>
+      </div> -->
 
       <!-- แบบสรุปข้อมูลของผู้ขอรับการคัดเลือก (เอกสารหมายเลข 9) -->
-      <div class="col-6" v-if="store.currentStep === 2">
+      <!-- <div class="col-6" v-if="store.currentStep === 2">
         <q-card bordered class="cardSp1">
           <div
             class="col-12 row text-weight-medium bg-grey-1 q-py-sm q-pl-md q-pr-sm no-wrap"
@@ -884,10 +1027,10 @@ onMounted(async () => {
             </div>
           </div>
         </q-card>
-      </div>
+      </div> -->
 
       <!-- แบบประเมินคุณลักษณะบุคคล -->
-      <div class="col-6" v-if="store.currentStep === 2">
+      <!-- <div class="col-6" v-if="store.currentStep === 2">
         <q-card bordered class="cardSp1">
           <div
             class="col-12 row text-weight-medium bg-grey-1 q-py-sm q-pl-md q-pr-sm items-center"
@@ -972,10 +1115,10 @@ onMounted(async () => {
             </div>
           </div>
         </q-card>
-      </div>
+      </div> -->
 
       <!--ผลงานที่จะส่งประเมิน (เอกสารหมายเลข 11) -->
-      <div class="col-6" v-if="store.currentStep === 2">
+      <!-- <div class="col-6" v-if="store.currentStep === 2">
         <q-card bordered class="cardSp1">
           <div
             class="col-12 row text-weight-medium bg-grey-1 q-py-sm q-pl-md q-pr-sm items-center"
@@ -1060,7 +1203,7 @@ onMounted(async () => {
             </div>
           </div>
         </q-card>
-      </div>
+      </div> -->
     </div>
   </div>