ui ประเมินผล

src/modules/06_evaluate/components/Tab1.vue

@@ -25,6 +25,7 @@ import ViewStep3 from "@/modules/06_evaluate/components/viewstep/viewStep3.vue";
 import ViewStep7 from "@/modules/06_evaluate/components/viewstep/viewStep7.vue";
 
 import DialogMain from "@/modules/06_evaluate/components/directorandmeet/DialogMain.vue";
+import PopupHistory from "@/modules/06_evaluate/components/viewstep/popupHistory.vue";
 
 import { useEvaluateStore } from "@/modules/06_evaluate/store";
 import { useCounterMixin } from "@/stores/mixin";
@@ -87,8 +88,6 @@ async function onCilckNextStep() {
       ? await saveStep5
       : store.step === 5
       ? await saveStep5
-      : store.step === 6
-      ? await saveStep6
       : store.step === 7
       ? await saveStep7
       : store.step === 8
@@ -96,7 +95,7 @@ async function onCilckNextStep() {
       : store.step === 9
       ? await saveStep9
       : null;
-  store.step === 2
+  store.step === 2 || store.step === 6
     ? validateStep2()
     : store.step < 9 &&
       dialogConfirm(
@@ -215,9 +214,14 @@ function fetchDirector() {
 function fetchMeeting() {
   console.log("ประเมินชำนาญการ:meeting");
 }
+const modalHistory = ref<boolean>(false);
+function onClickPopupHistory() {
+  modalHistory.value = !modalHistory.value;
+
+  console.log(modalHistory.value);
+}
 
 onMounted(async () => {
-  store.step = 1;
   await fetchCheckStatus();
 });
 </script>
@@ -225,10 +229,22 @@ onMounted(async () => {
 <template>
   <div class="row q-col-gutter-md">
     <div class="col-xs-12 col-sm-3">
-      <div class="toptitle">{{ props.title }}</div>
+      <div class="toptitle">
+        {{ props.title }}
+        <q-btn
+          flat
+          round
+          dense
+          color="primary"
+          icon="history"
+          @click="onClickPopupHistory"
+        >
+          <q-tooltip>ประวัติการประเมิน</q-tooltip>
+        </q-btn>
+      </div>
       <Stepper />
 
-      <div class="text-center">
+      <!-- <div class="text-center">
         <q-btn
           unelevated
           outline
@@ -236,7 +252,7 @@ onMounted(async () => {
           color="public"
           @click="onClickDialogDirevtor"
         />
-      </div>
+      </div> -->
     </div>
 
     <div class="col-xs-12 col-sm-9">
@@ -288,7 +304,11 @@ onMounted(async () => {
               <Step3 v-if="store.step === 3" />
               <Step4 v-if="store.step === 4" />
               <Step5 v-if="store.step === 5" />
-              <Step6 v-if="store.step === 6" />
+              <Step6
+                v-if="store.step === 6"
+                @update:form="updateformCommand"
+                :evaluateId="store.evaluateId"
+              />
               <Step7 v-if="store.step === 7" />
               <Step8 v-if="store.step === 8" />
               <Step9 v-if="store.step === 9" />
@@ -317,7 +337,13 @@ onMounted(async () => {
           @click="onCilckprPeviousStep('reject')"
         /> -->
         <q-btn
-          v-if="store.step !== 4"
+          v-if="
+            store.step >= store.currentStep &&
+            store.step !== 4 &&
+            store.step !== 5 &&
+            store.step !== 8 &&
+            store.step !== 9
+          "
           unelevated
           label="ดำเนินการต่อ"
           color="public"
@@ -333,6 +359,8 @@ onMounted(async () => {
     :fetchDirector="fetchDirector"
     :fetchMeeting="fetchMeeting"
   />
+
+  <PopupHistory :modal="modalHistory" :close="onClickPopupHistory" />
 </template>
 
 <style>

src/modules/06_evaluate/components/directorandmeet/Table.vue

@@ -37,15 +37,15 @@ const columnsDrictor = ref<QTableProps["columns"]>([
     headerStyle: "font-size: 14px",
     style: "font-size: 14px",
   },
-  {
+  // {
-    name: "duty",
+  //   name: "duty",
-    align: "left",
+  //   align: "left",
-    label: "หน้าที่",
+  //   label: "หน้าที่",
-    sortable: true,
+  //   sortable: true,
-    field: "duty",
+  //   field: "duty",
-    headerStyle: "font-size: 14px",
+  //   headerStyle: "font-size: 14px",
-    style: "font-size: 14px",
+  //   style: "font-size: 14px",
-  },
+  // },
   {
     name: "email",
     align: "left",

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

@@ -5,9 +5,11 @@ import http from "@/plugins/http";
 import config from "@/app.config";
 
 import { useCounterMixin } from "@/stores/mixin";
+import { useEvaluateStore } from "@/modules/06_evaluate/store";
 
 const mixin = useCounterMixin();
 const $q = useQuasar();
+const store = useEvaluateStore();
 
 const { showLoader, hideLoader, messageError } = mixin;
 
@@ -55,7 +57,7 @@ async function fetchCheckSpec(id: string) {
 }
 
 onMounted(() => {
-  props.evaluateId && fetchCheckSpec(props.evaluateId);
+  store.step === 1 && props.evaluateId && fetchCheckSpec(props.evaluateId);
 });
 </script>
 
@@ -71,7 +73,12 @@ onMounted(() => {
         />
       </q-item-section>
       <q-item-section>
-        <q-item-label>คุณวุฒิการศึกษา </q-item-label>
+        <q-item-label
+          >คุณวุฒิการศึกษา
+          <q-btn flat round dense color="info" icon="info">
+            <q-tooltip>ข้อมูลเพิ่มเติม</q-tooltip>
+          </q-btn>
+        </q-item-label>
       </q-item-section>
     </q-item>
     <q-item v-ripple>
@@ -111,7 +118,10 @@ onMounted(() => {
       </q-item-section>
       <q-item-section>
         <q-item-label
-          >ระยะเวลาขั้นต่ำในการดำรงตำแหน่งในสายงานที่ขอเข้ารับการคัดเลือก</q-item-label
+          >ระยะเวลาขั้นต่ำในการดำรงตำแหน่งในสายงานที่ขอเข้ารับการคัดเลือก
+          <q-btn flat round dense color="info" icon="info">
+            <q-tooltip>ข้อมูลเพิ่มเติม</q-tooltip>
+          </q-btn></q-item-label
         >
       </q-item-section>
     </q-item>

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

@@ -9,8 +9,10 @@ import { useQuasar, type StringDictionary } from "quasar";
 import type { FormCommand } from "@/modules/06_evaluate/interface/evalute";
 
 import { useCounterMixin } from "@/stores/mixin";
+import { useEvaluateStore } from "@/modules/06_evaluate/store";
 
 const $q = useQuasar();
+const store = useEvaluateStore();
 
 const mixin = useCounterMixin();
 const { showLoader, hideLoader, messageError } = mixin;
@@ -107,10 +109,10 @@ async function fetchPathUpload(volume: string, id: string) {
     fileList: [
       "1-แบบพิจารณาคุณสมบัติบุคคล",
       "2-แบบแสดงรายละเอียดการเสนอผลงาน",
-      "3-แบบตรวจสอบความถูกต้องครบถ้วนของข้อมูล",
+      "3-แบบตรวจสอบความถูกต้องครบถ้วนของข้อมูลเพื่อประกอบการคัดเลือกบุคคล (เอกสารแบบ ก.)",
       "4-แบบประเมินคุณลักษณะบุคคล",
-      "5-แบบสรุปข้อมูลของผู้ขอรับการคัดเลือก",
+      "5-แบบสรุปข้อมูลของผู้ขอรับการคัดเลือก (เอกสารหมายเลข 9)",
-      "6-ผลงานที่จะส่งประเมิน",
+      "6-ผลงานที่จะส่งประเมิน (เอกสารหมายเลข 11)",
     ],
   };
   await http
@@ -137,7 +139,7 @@ onMounted(async () => {
 <template>
   <div class="row q-col-gutter-md">
     <!-- แบบพิจารณาคุณสมบัติบุคคล -->
-    <div class="col-6">
+    <div class="col-6" v-if="store.currentStep === 2">
       <q-card bordered style="border: 1px solid #d6dee1">
         <div class="text-weight-medium bg-grey-1 q-py-sm q-px-md">
           แบบพิจารณาคุณสมบัติบุคคล
@@ -204,7 +206,7 @@ onMounted(async () => {
     </div>
 
     <!-- แบบแสดงรายละเอียดการเสนอผลงาน     -->
-    <div class="col-6">
+    <div class="col-6" v-if="store.currentStep === 2">
       <q-card bordered style="border: 1px solid #d6dee1">
         <div class="text-weight-medium bg-grey-1 q-py-sm q-px-md">
           แบบแสดงรายละเอียดการเสนอผลงาน
@@ -269,11 +271,12 @@ onMounted(async () => {
       </q-card>
     </div>
 
-    <!-- แบบตรวจสอบความถูกต้องครบถ้วนของข้อมูลเพื่อประกอบการคัดเลือกบุคคล -->
+    <!-- แบบตรวจสอบความถูกต้องครบถ้วนของข้อมูลเพื่อประกอบการคัดเลือกบุคคล (เอกสารแบบ ก.) -->
-    <div class="col-6">
+    <div class="col-6" v-if="store.currentStep === 2">
       <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">
@@ -290,7 +293,7 @@ onMounted(async () => {
                     onClickDowloadFile(
                       'EV1_007',
                       'template-3',
-                      'แบบตรวจสอบความถูกต้องครบถ้วนของข้อมูลเพื่อประกอบการคัดเลือกบุคคล'
+                      'แบบตรวจสอบความถูกต้องครบถ้วนของข้อมูลเพื่อประกอบการคัดเลือกบุคคล (เอกสารแบบ ก.)'
                     )
                   "
                 >
@@ -336,7 +339,7 @@ onMounted(async () => {
     </div>
 
     <!-- แบบประเมินคุณลักษณะบุคคล -->
-    <div class="col-6">
+    <div class="col-6" v-if="store.currentStep === 2">
       <q-card bordered style="border: 1px solid #d6dee1">
         <div class="text-weight-medium bg-grey-1 q-py-sm q-px-md">
           แบบประเมินคุณลักษณะบุคคล
@@ -401,11 +404,11 @@ onMounted(async () => {
       </q-card>
     </div>
 
-    <!-- แบบสรุปข้อมูลของผู้ขอรับการคัดเลือก -->
+    <!-- แบบสรุปข้อมูลของผู้ขอรับการคัดเลือก (เอกสารหมายเลข 9) -->
-    <div class="col-6">
+    <div class="col-6" v-if="store.currentStep === 2">
       <q-card bordered style="border: 1px solid #d6dee1">
         <div class="text-weight-medium bg-grey-1 q-py-sm q-px-md">
-          แบบสรุปข้อมูลของผู้ขอรับการคัดเลือก
+          แบบสรุปข้อมูลของผู้ขอรับการคัดเลือก (เอกสารหมายเลข 9)
         </div>
         <div class="col-12"><q-separator /></div>
         <div class="row">
@@ -422,7 +425,7 @@ onMounted(async () => {
                     onClickDowloadFile(
                       'EV1_009',
                       'template-5',
-                      'แบบสรุปข้อมูลของผู้ขอรับการคัดเลือก'
+                      'แบบสรุปข้อมูลของผู้ขอรับการคัดเลือก (เอกสารหมายเลข 9)'
                     )
                   "
                   ><q-tooltip> ดาวน์โหลดต้นแบบ </q-tooltip></q-btn
@@ -466,11 +469,11 @@ onMounted(async () => {
       </q-card>
     </div>
 
-    <!--ผลงานที่จะส่งประเมิน -->
+    <!--ผลงานที่จะส่งประเมิน (เอกสารหมายเลข 11) -->
-    <div class="col-6">
+    <div class="col-6" v-if="store.currentStep === 2">
       <q-card bordered style="border: 1px solid #d6dee1">
         <div class="text-weight-medium bg-grey-1 q-py-sm q-px-md">
-          ผลงานที่จะส่งประเมิน
+          ผลงานที่จะส่งประเมิน (เอกสารหมายเลข 11)
         </div>
         <div class="col-12"><q-separator /></div>
         <div class="row">
@@ -487,7 +490,7 @@ onMounted(async () => {
                     onClickDowloadFile(
                       'EV1_010',
                       'template-6',
-                      'ผลงานที่จะส่งประเมิน'
+                      'ผลงานที่จะส่งประเมิน (เอกสารหมายเลข 11)'
                     )
                   "
                 >

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

@@ -44,7 +44,8 @@ function handleItemClick(itemNumber: number) {
       @click="handleItemClick(3)"
     >
       <q-item-section
-        >แบบตรวจสอบความถูกต้องครบถ้วนของข้อมูลเพื่อประกอบการคัดเลือกบุคคล</q-item-section
+        >แบบตรวจสอบความถูกต้องครบถ้วนของข้อมูลเพื่อประกอบการคัดเลือกบุคคล
+        (เอกสารแบบ ก.)</q-item-section
       >
     </q-item>
     <q-item
@@ -63,7 +64,9 @@ function handleItemClick(itemNumber: number) {
       active-class="text-primary"
       @click="handleItemClick(5)"
     >
-      <q-item-section> แบบสรุปข้อมูลของผู้ขอรับการคัดเลือก </q-item-section>
+      <q-item-section>
+        แบบสรุปข้อมูลของผู้ขอรับการคัดเลือก (เอกสารหมายเลข 9)
+      </q-item-section>
     </q-item>
     <q-item
       clickable
@@ -72,7 +75,7 @@ function handleItemClick(itemNumber: number) {
       active-class="text-primary"
       @click="handleItemClick(6)"
     >
-      <q-item-section> ผลงานที่จะส่งประเมิน </q-item-section>
+      <q-item-section> ผลงานที่จะส่งประเมิน (เอกสารหมายเลข 11) </q-item-section>
     </q-item>
   </q-list>
 </template>

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

@@ -1,14 +1,40 @@
 <script setup lang="ts">
 import { ref } from "vue";
 
+import { useCounterMixin } from "@/stores/mixin";
+
+const mixins = useCounterMixin();
+const { date2Thai } = mixins;
 const status = ref<string>("ANNOUNCE_WEB");
 const website = ref<string>("https://bma-ehr.frappet.com/");
+const AnnouncementDate = ref<string | null>(date2Thai(new Date()));
+
+const items = ref<any>([
+  { label: "แบบสรุปข้อมูลของผู้ขอรับการคัดเลือก (เอกสารหมายเลข 9)" },
+  { label: "ประกาศผลการคัดเลือกบุคคล (เอกสารหมายเลข 10)" },
+  { label: "เอกสารแสดงผลงานที่จะส่งประเมิน (เอกสารหมายเลข 11)" },
+]);
+
+function copyLink(link: string) {
+  console.log(`Copying link  ${link}`);
+  const textarea = document.createElement("textarea");
+  textarea.value = link;
+  document.body.appendChild(textarea);
+  textarea.select();
+  document.execCommand("copy");
+}
 </script>
 
 <template>
-  <div class="row">
+  <div class="row q-gutter-md">
-    <div class="col-12 text-center q-">
+    <div class="col-12 text-center">
-      <q-badge
+      <q-banner class="text-weight-bold text-red-14 bg-red-2">
+        <div class="text-weight-bold">
+          <q-icon name="info_outline" color="red-14" size="24px" />
+          ประกาศเมื่อวันที่ {{ AnnouncementDate }}
+        </div>
+      </q-banner>
+      <!-- <q-badge
         v-if="status == 'ANNOUNCE_WEB'"
         outline
         color="primary"
@@ -16,9 +42,41 @@ const website = ref<string>("https://bma-ehr.frappet.com/");
         class="q-pa-sm"
         style="font-size: 16px"
       />
-      <div>
+      <div> -->
-        <a :href="website" target="_blank">{{ website }}</a>
+      <!-- <a :href="website" target="_blank">{{ website }}</a> -->
-      </div>
+      <!-- </div> -->
+    </div>
+
+    <div class="col-12">
+      <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 q-pa-md">
+          <div class="col-12">
+            <q-list>
+              <q-item v-for="(item, index) in items" :key="index">
+                <q-item-section>
+                  <q-item-label>{{ item.label }}</q-item-label>
+                </q-item-section>
+
+                <q-item-section side top>
+                  <q-btn
+                    flat
+                    round
+                    color="primary"
+                    icon="mdi-clipboard-outline"
+                    @click="copyLink(item.label)"
+                  >
+                    <q-tooltip>คัดลอกลิ้งค์</q-tooltip>
+                  </q-btn>
+                </q-item-section>
+              </q-item>
+            </q-list>
+          </div>
+        </div>
+      </q-card>
     </div>
   </div>
 </template>

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

@@ -1,21 +1,80 @@
 <script setup lang="ts">
-import { ref } from "vue";
+import { ref, reactive, onMounted } from "vue";
 import ViewPDF from "@/modules/06_evaluate/components/viewstep/viewPDF.vue";
 
-const fileEvaluation1 = ref<any>();
+import type { FormCommand } from "@/modules/06_evaluate/interface/evalute";
 
+import { useCounterMixin } from "@/stores/mixin";
+import { useEvaluateStore } from "@/modules/06_evaluate/store";
+
+const store = useEvaluateStore();
+const mixins = useCounterMixin();
+const { date2Thai } = mixins;
+
+const props = defineProps({
+  evaluateId: {
+    type: String,
+  },
+});
+
+const emit = defineEmits(["update:form"]);
+
+const lastDateSendPerformance = ref<string | null>(date2Thai(new Date()));
+
+const fileEvaluation1 = ref<any>();
 const pdfSrc = ref<any>();
 
+const formCommand = reactive<FormCommand>({
+  commanderFullname: "",
+  commanderPosition: "",
+  commanderAboveFullname: "",
+  commanderAbovePosition: "",
+});
+
+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 modalView = ref<boolean>(false);
 function onClickViewPDF(file: any) {
   pdfSrc.value = file.webkitRelativePath;
   modalView.value = true;
 }
+
+const updateInput = (value: any) => {
+  const ref = {
+    commanderFullnameRef: commanderFullnameRef.value,
+    commanderPositionRef: commanderPositionRef.value,
+    commanderAboveFullnameRef: commanderAboveFullnameRef.value,
+    commanderAbovePositionRef: commanderAbovePositionRef.value,
+  };
+  emit("update:form", value, ref);
+};
+
+onMounted(async () => {
+  const ref = {
+    commanderFullnameRef: commanderFullnameRef.value,
+    commanderPositionRef: commanderPositionRef.value,
+    commanderAboveFullnameRef: commanderAboveFullnameRef.value,
+    commanderAbovePositionRef: commanderAbovePositionRef.value,
+  };
+  emit("update:form", formCommand, ref);
+  // props.evaluateId && (await fetchPathUpload("เล่ม 2", props.evaluateId));
+});
 </script>
 
 <template>
   <div class="row q-col-gutter-md">
-    <div class="col-6">
+    <div class="col-12 text-center">
+      <q-banner class="text-weight-bold text-red-14 bg-red-2">
+        <div class="text-weight-bold">
+          <q-icon name="info_outline" color="red-14" size="24px" />
+          วันสุดท้ายของการส่งผลงานคือวันที่ {{ lastDateSendPerformance }}
+        </div>
+      </q-banner>
+    </div>
+    <div class="col-6" v-if="store.currentStep === 6">
       <q-card bordered style="border: 1px solid #d6dee1">
         <div class="text-weight-medium bg-grey-1 q-py-sm q-px-md">
           เอกสารเล่ม 2
@@ -73,6 +132,82 @@ function onClickViewPDF(file: any) {
         </div>
       </q-card>
     </div>
+
+    <div class="col-12">
+      <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-md col-12">
+              <div class="col-xs-12 col-sm-12 row">
+                <div class="text-weight-medium q-py-sm">
+                  ผู้บังคับบัญชาชั้นต้น
+                </div>
+                <div class="row col-12 q-col-gutter-md q-pa-sm">
+                  <q-input
+                    ref="commanderFullnameRef"
+                    dense
+                    class="col-xs-12 col-sm-6"
+                    outlined
+                    label="ชื่อ-นามสกุล"
+                    v-model="formCommand.commanderFullname"
+                    @update:model-value="updateInput(formCommand)"
+                    :rules="[(val) => !!val || `${'กรุณากรอกชื่อ-นามสกุล'}`]"
+                    lazy-rules
+                  />
+                  <q-input
+                    ref="commanderPositionRef"
+                    class="col-xs-12 col-sm-6"
+                    dense
+                    outlined
+                    v-model="formCommand.commanderPosition"
+                    @update:model-value="updateInput(formCommand)"
+                    label="ตำแหน่ง"
+                    :rules="[(val) => !!val || `${'กรุณากรอกตำแหน่ง'}`]"
+                    lazy-rules
+                  />
+                </div>
+              </div>
+            </div>
+
+            <div class="row q-col-gutter-md col-12">
+              <div class="col-xs-12 col-sm-12 row">
+                <div class="text-weight-medium q-py-sm">
+                  ผู้บังคับบัญชาเหนือขึ้นไป 1 ระดับ
+                </div>
+                <div class="row col-12 q-col-gutter-md q-pa-sm">
+                  <q-input
+                    ref="commanderAboveFullnameRef"
+                    dense
+                    class="col-xs-12 col-sm-6"
+                    outlined
+                    v-model="formCommand.commanderAboveFullname"
+                    label="ชื่อ-นามสกุล"
+                    :rules="[(val) => !!val || `${'กรุณากรอกชื่อ-นามสกุล'}`]"
+                    lazy-rules
+                    @update:model-value="updateInput(formCommand)"
+                  />
+                  <q-input
+                    ref="commanderAbovePositionRef"
+                    class="col-xs-12 col-sm-6"
+                    dense
+                    outlined
+                    v-model="formCommand.commanderAbovePosition"
+                    label="ตำแหน่ง"
+                    :rules="[(val) => !!val || `${'กรุณากรอกตำแหน่ง'}`]"
+                    lazy-rules
+                    @update:model-value="updateInput(formCommand)"
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </q-card>
+    </div>
   </div>
 
   <!-- Dialog Full Screen -->

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

@@ -1,11 +1,54 @@
 <script setup lang="ts">
 import { ref } from "vue";
+import genReport from "@/plugins/genreport";
+
+import TableDirector from "@/modules/06_evaluate/components/directorandmeet/Table.vue";
 
 const status = ref<string>("WAIT_CHECK_DOC_V2");
+const tabMenu = ref<string>("director");
+
+const fileEvaluationEdit = ref<any>();
+
+const modalView = ref<boolean>(false);
+const numOfPages = ref<number>(0);
+const page = ref<number>(1);
+const pdfSrc = ref<any>();
+
+function onClickViewPDF(file: any) {
+  pdfSrc.value = file.webkitRelativePath;
+  modalView.value = true;
+}
+
+/** ไปหน้าต่อไปของรายงาน */
+function nextPage() {
+  if (page.value < numOfPages.value) {
+    page.value++;
+  }
+}
+
+/** กลับหน้าก่อนหน้าของรายงาน */
+function backPage() {
+  if (page.value !== 1) {
+    page.value--;
+  }
+}
+
+async function onClickDowloadFile(
+  tp: string,
+  templateName: string,
+  fileName: string
+) {
+  const body = {
+    template: tp,
+    reportName: templateName,
+    data: {},
+  };
+  await genReport(body, fileName);
+}
 </script>
 
 <template>
-  <div class="row">
+  <div class="row q-gutter-md">
     <div class="col-12 text-center">
       <q-badge
         v-if="status == 'WAIT_CHECK_DOC_V2'"
@@ -16,7 +59,191 @@ const status = ref<string>("WAIT_CHECK_DOC_V2");
         style="font-size: 16px"
       />
     </div>
+
+    <div class="col-12">
+      <q-card bordered style="border: 1px solid #d6dee1">
+        <q-card class="col-12 items-center">
+          <q-tabs
+            v-model="tabMenu"
+            dense
+            align="left"
+            inline-label
+            class="rounded-borders"
+            indicator-color="primary"
+            active-bg-color="teal-1"
+            active-class="text-primary"
+          >
+            <q-tab name="director" label="กรรมการ" />
+            <q-tab name="meeting" label="การประชุม" />
+          </q-tabs>
+          <q-separator />
+          <q-tab-panels v-model="tabMenu" animated>
+            <q-tab-panel name="director"
+              ><TableDirector :type="tabMenu"
+            /></q-tab-panel>
+
+            <q-tab-panel name="meeting">
+              <TableDirector :type="tabMenu"
+            /></q-tab-panel>
+          </q-tab-panels>
+        </q-card>
+      </q-card>
+    </div>
+
+    <div class="col-6">
+      <q-card bordered style="border: 1px solid #d6dee1">
+        <div class="text-weight-medium bg-grey-1 q-py-sm q-px-md">
+          เอกสารเล่ม 2 (ฉบับแก้ไข)
+        </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">
+              <div class="col-xs-12 col-sm-6 row">
+                <q-btn
+                  class="col-12"
+                  outline
+                  icon="download"
+                  label="ดาวน์โหลดต้นแบบ"
+                  color="primary"
+                  @click="
+                    onClickDowloadFile(
+                      'EV1_010',
+                      'template-6',
+                      'ผลงานที่จะส่งประเมิน (เอกสารหมายเลข 11)'
+                    )
+                  "
+                >
+                  <q-tooltip> ดาวน์โหลดต้นแบบ </q-tooltip></q-btn
+                >
+              </div>
+              <div class="col-xs-12 col-sm-6 row">
+                <q-btn
+                  v-if="fileEvaluationEdit"
+                  class="col-12"
+                  outline
+                  icon="visibility"
+                  label="ดูไฟล์เอกสาร"
+                  color="primary"
+                  @click="onClickViewPDF"
+                >
+                  <q-tooltip> ดูไฟล์เอกสาร </q-tooltip></q-btn
+                >
+              </div>
+              <div class="col-xs-12 col-sm-10 row">
+                <q-file
+                  v-model="fileEvaluationEdit"
+                  class="col-12"
+                  outlined
+                  dense
+                  hide-bottom-space
+                  lazy-rules
+                  accept=".pdf"
+                >
+                  <template v-slot:prepend>
+                    <q-icon name="attach_file" />
+                  </template>
+                </q-file>
+              </div>
+              <div class="col-2 self-center text-center q-pl-none">
+                <q-btn flat round dense color="primary" icon="mdi-upload"
+                  ><q-tooltip>อัปโหลดไฟล์</q-tooltip></q-btn
+                >
+              </div>
+            </div>
+          </div>
+        </div>
+      </q-card>
+    </div>
   </div>
+
+  <!-- Dialog Full Screen -->
+  <q-dialog
+    v-model="modalView"
+    persistent
+    :maximized="true"
+    transition-show="slide-up"
+    transition-hide="slide-down"
+  >
+    <q-card class="bg-white">
+      <div class="flex justify-end items-center align-center q-mr-md q-mt-sm">
+        <q-btn
+          icon="close"
+          unelevated
+          round
+          dense
+          style="color: #ff8080; background-color: #ffdede"
+          size="12px"
+          v-close-popup
+        />
+      </div>
+      <div class="q-pa-md">
+        <div class="row items-start items-center">
+          <div class="col">
+            <q-btn
+              padding="xs"
+              icon="mdi-chevron-left"
+              color="grey-2"
+              text-color="grey-5"
+              size="md"
+              class="my-auto"
+              @click="backPage"
+              :disable="page == 1"
+            />
+          </div>
+          <div class="col-12 col-md-auto">
+            <div class="q-pa-md flex">
+              หน้าที่ {{ page }} จาก {{ numOfPages }}
+            </div>
+          </div>
+          <div class="col text-right">
+            <q-btn
+              padding="xs"
+              icon="mdi-chevron-right"
+              color="grey-2"
+              text-color="grey-5"
+              size="md"
+              @click="nextPage"
+              :disable="page === numOfPages"
+            />
+          </div>
+        </div>
+        <div class="row items- items-center">
+          <VuePDF ref="vuePDFRef" :pdf="pdfSrc" :page="page" fit-parent />
+        </div>
+        <div class="row items- items-end">
+          <div class="col">
+            <q-btn
+              padding="xs"
+              icon="mdi-chevron-left"
+              color="grey-2"
+              text-color="grey-5"
+              size="md"
+              class="my-auto"
+              @click="backPage"
+              :disable="page == 1"
+            />
+          </div>
+          <div class="col-12 col-md-auto">
+            <div class="q-pa-md flex">
+              หน้าที่ {{ page }} จาก {{ numOfPages }}
+            </div>
+          </div>
+          <div class="col text-right">
+            <q-btn
+              padding="xs"
+              icon="mdi-chevron-right"
+              color="grey-2"
+              text-color="grey-5"
+              size="md"
+              @click="nextPage"
+              :disable="page === numOfPages"
+            />
+          </div>
+        </div>
+      </div>
+    </q-card>
+  </q-dialog>
 </template>
 
 <style scoped></style>

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

@@ -7,14 +7,22 @@ const status = ref<string>("DONE");
 <template>
   <div class="row">
     <div class="col-12 text-center">
-      <q-badge
+      <!-- <q-badge
         v-if="status == 'DONE'"
         outline
         color="green"
         label="เสร็จสิ้น"
         class="q-pa-sm"
         style="font-size: 16px"
-      />
+      /> -->
+      <q-btn
+        outline
+        icon-right="mdi-clipboard-outline"
+        label="เสร็จสิ้น"
+        color="primary"
+      >
+        <q-tooltip> คัดลอกลิ้งค์ </q-tooltip></q-btn
+      >
     </div>
   </div>
 </template>

src/modules/06_evaluate/components/viewstep/popupHistory.vue

@@ -0,0 +1,149 @@
+<script setup lang="ts">
+import { ref } from "vue";
+import type { QTableProps } from "quasar";
+
+import HeaderDialog from "@/components/DialogHeader.vue";
+
+/** รับ props Tab 1  */
+const props = defineProps({
+  modal: {
+    type: Boolean,
+    require: true,
+  },
+  // fetchDirector: {
+  //   type: Function,
+  //   require: true,
+  //   default: () => "",
+  // },
+  // fetchMeeting: {
+  //   type: Function,
+  //   require: true,
+  //   default: () => "",
+  // },
+  close: {
+    type: Function,
+    default: () => "",
+  },
+});
+
+const columns = ref<QTableProps["columns"]>([
+  {
+    name: "no",
+    align: "left",
+    label: "ลำดับ",
+    sortable: false,
+    field: "no",
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px",
+  },
+  {
+    name: "statusEdit",
+    align: "left",
+    label: "การแก้ไข",
+    sortable: true,
+    field: "statusEdit",
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px",
+  },
+  {
+    name: "operator",
+    align: "left",
+    label: "ผู้ดำเนินการ",
+    sortable: true,
+    field: "operator",
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px",
+  },
+  {
+    name: "dateEdit",
+    align: "left",
+    label: "วันที่แก้ไข",
+    sortable: true,
+    field: "dateEdit",
+    headerStyle: "font-size: 14px",
+    style: "font-size: 14px",
+  },
+]);
+</script>
+<template>
+  <q-dialog v-model="props.modal">
+    <q-card style="width: 700px; max-width: 80vw">
+      <q-card-section>
+        <HeaderDialog :tittle="'ประวัติการประเมิน'" :close="props.close" />
+      </q-card-section>
+      <q-separator />
+      <q-card-section class="q-pt-none">
+        <div class="col-xs-12 col-sm-12 col-md-12 row q-col-gutter-md">
+          <div class="col-12 q-mt-sm">
+            <q-table
+              ref="table"
+              flat
+              bordered
+              class="custom-header-table"
+              :columns="columns"
+              dense
+              :rows-per-page-options="[10, 25, 50, 100]"
+            >
+              <template v-slot:header="props">
+                <q-tr :props="props">
+                  <q-th
+                    v-for="col in props.cols"
+                    :key="col.name"
+                    :props="props"
+                  >
+                    <span class="text-weight-medium" v-html="col.label" />
+                  </q-th>
+                </q-tr>
+              </template>
+              <template v-slot:body="props">
+                <q-tr :props="props" class="cursor-pointer">
+                  <q-td
+                    v-for="col in props.cols"
+                    :key="col.name"
+                    :props="props"
+                  >
+                    <div v-if="col.name == 'no'">
+                      {{ props.rowIndex + 1 }}
+                    </div>
+                    <div>
+                      {{ col.value }}
+                    </div>
+                  </q-td>
+                </q-tr>
+              </template>
+            </q-table>
+          </div>
+        </div>
+      </q-card-section>
+    </q-card>
+  </q-dialog>
+</template>
+
+<style lang="scss" scoped>
+.custom-header-table {
+  height: auto;
+  .q-table tr:nth-child(odd) td {
+    background: white;
+  }
+  .q-table tr:nth-child(even) td {
+    background: #f8f8f8;
+  }
+
+  .q-table thead tr {
+    background: #ecebeb;
+  }
+
+  .q-table thead tr th {
+    position: sticky;
+    z-index: 1;
+  }
+  /* this will be the loading indicator */
+  .q-table thead tr:last-child th {
+    /* height of all previous header rows */
+    top: 48px;
+  }
+  .q-table thead tr:first-child th {
+    top: 0;
+  }
+}
+</style>

src/modules/06_evaluate/store.ts

@@ -4,7 +4,7 @@ import { ref } from "vue";
 export const useEvaluateStore = defineStore("evaluateStore", () => {
   const tabMenu = ref<string>("1");
   const showLoadStatus = ref<boolean>(false);
-  const step = ref<number>(1);
+  const step = ref<number>(0);
   const currentStep = ref<number>(1);
   const title = ref<string[]>([
     "ตรวจสอบคุณสมบัติ",

src/modules/06_evaluate/stores/evaluationFunction.ts

@@ -23,9 +23,7 @@ async function fetchCheckStatus() {
       store.tabMenu === "1"
         ? (store.evaluateId = data.expertId)
         : (store.evaluateId = data.specialExpertId);
-      store.evaluateId && fetchCheckStep();
+      fetchCheckStep(store?.evaluateId);
-
-      store.showLoadStatus = true;
     })
     .catch((err) => {
       messageError($q, err);
@@ -35,38 +33,43 @@ async function fetchCheckStatus() {
     });
 }
 
-async function fetchCheckStep() {
+async function fetchCheckStep(id: string) {
-  await http
+  if (id) {
-    .get(config.API.evaluationCheckStep(store.evaluateId))
+    await http
-    .then((res) => {
+      .get(config.API.evaluationCheckStep(id))
-      const data = res.data.result;
+      .then((res) => {
-      let step =
+        const data = res.data.result;
-        data.Step === "CHECK_SPEC"
-          ? 1
-          : data.Step === "PREPARE_DOC_V1"
-          ? 2
-          : data.Step === "CHECK_DOC_V1"
-          ? 3
-          : data.Step === "WAIT_CHECK_DOC_V1"
-          ? 4
-          : data.Step === "ANNOUNCE_WEB"
-          ? 5
-          : data.Step === "PREPARE_DOC_V2"
-          ? 6
-          : data.Step === "CHECK_DOC_V2"
-          ? 7
-          : data.Step === "WAIT_CHECK_DOC_V2"
-          ? 8
-          : data.Step === "DONE"
-          ? 9
-          : 0;
 
-      store.currentStep = step;
+        let step =
-      store.step = step;
+          data.Step === "CHECK_SPEC"
-    })
+            ? 1
-    .catch((err) => {
+            : data.Step === "PREPARE_DOC_V1"
-      messageError($q, err);
+            ? 2
-    });
+            : data.Step === "CHECK_DOC_V1"
+            ? 3
+            : data.Step === "WAIT_CHECK_DOC_V1"
+            ? 4
+            : data.Step === "ANNOUNCE_WEB"
+            ? 5
+            : data.Step === "PREPARE_DOC_V2"
+            ? 6
+            : data.Step === "CHECK_DOC_V2"
+            ? 7
+            : data.Step === "WAIT_CHECK_DOC_V2"
+            ? 8
+            : data.Step === "DONE"
+            ? 9
+            : 1;
+        store.currentStep = step;
+        store.step = step;
+      })
+      .catch((err) => {
+        messageError($q, err);
+      })
+      .finally(() => {
+        store.showLoadStatus = true;
+      });
+  } else (store.step = 1), (store.showLoadStatus = true);
 }
 
 async function saveEvaluation(body: any) {
@@ -176,7 +179,7 @@ async function saveEvaluation(body: any) {
     })
     .finally(() => {
       hideLoader();
-      fetchCheckStep();
+      fetchCheckStep(store?.evaluateId);
     });
 }
 
@@ -192,7 +195,7 @@ async function nextPrapare(type: string, body: any) {
     })
     .finally(() => {
       hideLoader();
-      fetchCheckStep();
+      fetchCheckStep(store?.evaluateId);
     });
 }
 
@@ -223,7 +226,7 @@ async function nextCheckDoc(type: string) {
     })
     .finally(() => {
       hideLoader();
-      fetchCheckStep();
+      fetchCheckStep(store?.evaluateId);
     });
 }
 

src/modules/06_evaluate/views/EvaluateMain.vue

@@ -24,7 +24,7 @@ onMounted(async () => {});
   <div class="col-12 row justify-center">
     <div class="col-xs-12 col-sm-12 col-md-11">
       <div class="toptitle text-white col-12 row items-center">
-        <q-btn
+        <!-- <q-btn
           icon="mdi-arrow-left"
           unelevated
           round
@@ -33,7 +33,7 @@ onMounted(async () => {});
           color="primary"
           class="q-mr-sm"
           @click="router.go(-1)"
-        />
+        /> -->
         <div>ประเมินผล</div>
       </div>
     </div>