From 6813d496e8cb1fbd5714caa759dd69034748c3dc Mon Sep 17 00:00:00 2001
From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" <nicey2t1096@gmail.com>
Date: Thu, 24 Apr 2025 15:05:48 +0700
Subject: [PATCH] =?UTF-8?q?=E0=B8=9B=E0=B8=A3=E0=B8=B1=E0=B8=9A=20=20Eva?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/EvaluateStepMain.vue           |  10 +-
 .../06_evaluate/components/step/step2.vue     |  61 ++---
 .../06_evaluate/components/step/step4.vue     |  10 +-
 .../06_evaluate/components/step/step6.vue     |  69 +++--
 .../06_evaluate/components/step/step7.vue     |   3 -
 .../06_evaluate/components/step/step8.vue     |   9 +-
 .../components/viewstep/popupHistory.vue      |   2 +-
 .../components/viewstep/viewStep1.vue         | 245 +++++++++++++++++-
 8 files changed, 317 insertions(+), 92 deletions(-)

diff --git a/src/modules/06_evaluate/components/EvaluateStepMain.vue b/src/modules/06_evaluate/components/EvaluateStepMain.vue
index 980e619..a497936 100644
--- a/src/modules/06_evaluate/components/EvaluateStepMain.vue
+++ b/src/modules/06_evaluate/components/EvaluateStepMain.vue
@@ -321,7 +321,7 @@ async function saveStep1() {
   }));
 
   const performances = formDetail.value.assessments.map(
-    ({ id, ...rest }: any) => ({
+    ({ id, isAdd, ...rest }: any) => ({
       ...rest,
     })
   );
@@ -444,8 +444,8 @@ async function saveStep2() {
           ),
           { ...formCommand, assignedPosition: undefined }
         )
-        .then(() => {
-          route.params.id && fetchCheckStep(route.params.id.toString());
+        .then(async () => {
+          route.params.id && (await fetchCheckStep(route.params.id.toString()));
         })
         .catch((err) => {
           messageError($q, err);
@@ -534,8 +534,8 @@ async function saveStep6() {
           ),
           body
         )
-        .then(() => {
-          route.params.id && fetchCheckStep(route.params.id.toString());
+        .then(async () => {
+          route.params.id && (await fetchCheckStep(route.params.id.toString()));
         })
         .catch((err) => {
           messageError($q, err);
diff --git a/src/modules/06_evaluate/components/step/step2.vue b/src/modules/06_evaluate/components/step/step2.vue
index 3050195..cb21e06 100644
--- a/src/modules/06_evaluate/components/step/step2.vue
+++ b/src/modules/06_evaluate/components/step/step2.vue
@@ -450,7 +450,7 @@ onMounted(async () => {
                   <div class="row col-12 q-col-gutter-sm">
                     <q-input
                       :readonly="store.currentStep != 2 || store.statusUpload"
-                      class="col-xs-6 col-sm-3"
+                      class="col-xs-6 col-sm-6"
                       dense
                       outlined
                       v-model="formCommand.commanderPosition"
@@ -460,21 +460,10 @@ onMounted(async () => {
                       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"
+                      class="col-xs-6 col-sm-6"
                       dense
                       outlined
                       v-model="formCommand.commanderOrg"
@@ -486,14 +475,22 @@ onMounted(async () => {
                     />
                     <q-input
                       :readonly="store.currentStep != 2 || store.statusUpload"
-                      class="col-xs-6 col-sm-3"
+                      class="col-xs-6 col-sm-6"
+                      dense
+                      outlined
+                      v-model="formCommand.commanderPositionOld"
+                      @update:model-value="updateInput(formCommand)"
+                      label="ตำแหน่งเดิม"
+                      hide-bottom-space
+                    />
+                    <q-input
+                      :readonly="store.currentStep != 2 || store.statusUpload"
+                      class="col-xs-6 col-sm-6"
                       dense
                       outlined
                       v-model="formCommand.commanderOrgOld"
                       @update:model-value="updateInput(formCommand)"
                       label="สังกัดเดิม"
-                      :rules="[(val:string) => !!val || `${'กรุณากรอกสังกัดเดิม'}`]"
-                      lazy-rules
                       hide-bottom-space
                     />
                   </div>
@@ -524,7 +521,7 @@ onMounted(async () => {
                   <div class="row col-12 q-col-gutter-sm">
                     <q-input
                       :readonly="store.currentStep != 2 || store.statusUpload"
-                      class="col-xs-6 col-sm-3"
+                      class="col-xs-6 col-sm-6"
                       dense
                       outlined
                       v-model="formCommand.commanderAbovePosition"
@@ -536,19 +533,7 @@ onMounted(async () => {
                     />
                     <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"
+                      class="col-xs-6 col-sm-6"
                       dense
                       outlined
                       v-model="formCommand.commanderAboveOrg"
@@ -560,13 +545,21 @@ onMounted(async () => {
                     />
                     <q-input
                       :readonly="store.currentStep != 2 || store.statusUpload"
-                      class="col-xs-6 col-sm-3"
+                      class="col-xs-6 col-sm-6"
+                      dense
+                      outlined
+                      v-model="formCommand.commanderAbovePositionOld"
+                      label="ตำแหน่งเดิม"
+                      hide-bottom-space
+                      @update:model-value="updateInput(formCommand)"
+                    />
+                    <q-input
+                      :readonly="store.currentStep != 2 || store.statusUpload"
+                      class="col-xs-6 col-sm-6"
                       dense
                       outlined
                       v-model="formCommand.commanderAboveOrgOld"
                       label="สังกัดเดิม"
-                      :rules="[(val:string) => !!val || `${'กรุณากรอกสังกัดเดิม'}`]"
-                      lazy-rules
                       hide-bottom-space
                       @update:model-value="updateInput(formCommand)"
                     />
diff --git a/src/modules/06_evaluate/components/step/step4.vue b/src/modules/06_evaluate/components/step/step4.vue
index 839f63b..56d583d 100644
--- a/src/modules/06_evaluate/components/step/step4.vue
+++ b/src/modules/06_evaluate/components/step/step4.vue
@@ -226,7 +226,15 @@ onMounted(async () => {
 
   <div class="row q-col-gutter-sm q-pa-sm">
     <div class="col-6" v-for="(item, index) in formTemplates" :key="index">
-      <q-card bordered class="cardSp1">
+      <q-card
+        bordered
+        class="cardSp1"
+        v-if="
+          (store.currentStep !== 4 &&
+            formTemplates.some((e) => e.downloadFile !== '')) ||
+          store.currentStep == 4
+        "
+      >
         <div
           class="text-weight-medium bg-grey-1 q-py-sm q-pl-md q-pr-sm col-12 row items-center"
         >
diff --git a/src/modules/06_evaluate/components/step/step6.vue b/src/modules/06_evaluate/components/step/step6.vue
index 450c22b..9907555 100644
--- a/src/modules/06_evaluate/components/step/step6.vue
+++ b/src/modules/06_evaluate/components/step/step6.vue
@@ -386,7 +386,7 @@ onMounted(async () => {
                         :readonly="
                           store.currentStep != 6 || store.statusUpload6
                         "
-                        class="col-xs-6 col-sm-3"
+                        class="col-xs-6 col-sm-6"
                         dense
                         outlined
                         v-model="formCommand.commanderPosition"
@@ -401,22 +401,7 @@ onMounted(async () => {
                         :readonly="
                           store.currentStep != 6 || store.statusUpload6
                         "
-                        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 != 6 || store.statusUpload6
-                        "
-                        class="col-xs-6 col-sm-3"
+                        class="col-xs-6 col-sm-6"
                         dense
                         outlined
                         v-model="formCommand.commanderOrg"
@@ -430,14 +415,24 @@ onMounted(async () => {
                         :readonly="
                           store.currentStep != 6 || store.statusUpload6
                         "
-                        class="col-xs-6 col-sm-3"
+                        class="col-xs-6 col-sm-6"
+                        dense
+                        outlined
+                        v-model="formCommand.commanderPositionOld"
+                        @update:model-value="updateInput(formCommand)"
+                        label="ตำแหน่งเดิม"
+                        hide-bottom-space
+                      />
+                      <q-input
+                        :readonly="
+                          store.currentStep != 6 || store.statusUpload6
+                        "
+                        class="col-xs-6 col-sm-6"
                         dense
                         outlined
                         v-model="formCommand.commanderOrgOld"
                         @update:model-value="updateInput(formCommand)"
                         label="สังกัดเดิม"
-                        :rules="[(val:string) => !!val || `${'กรุณากรอกสังกัดเดิม'}`]"
-                        lazy-rules
                         hide-bottom-space
                       />
                     </div>
@@ -471,7 +466,7 @@ onMounted(async () => {
                         :readonly="
                           store.currentStep != 6 || store.statusUpload6
                         "
-                        class="col-xs-6 col-sm-3"
+                        class="col-xs-6 col-sm-6"
                         dense
                         outlined
                         v-model="formCommand.commanderAbovePosition"
@@ -485,21 +480,7 @@ onMounted(async () => {
                         :readonly="
                           store.currentStep != 6 || store.statusUpload6
                         "
-                        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 != 6 || store.statusUpload6
-                        "
-                        class="col-xs-6 col-sm-3"
+                        class="col-xs-6 col-sm-6"
                         dense
                         outlined
                         v-model="formCommand.commanderAboveOrg"
@@ -513,13 +494,23 @@ onMounted(async () => {
                         :readonly="
                           store.currentStep != 6 || store.statusUpload6
                         "
-                        class="col-xs-6 col-sm-3"
+                        class="col-xs-6 col-sm-6"
+                        dense
+                        outlined
+                        v-model="formCommand.commanderAbovePositionOld"
+                        label="ตำแหน่งเดิม"
+                        hide-bottom-space
+                        @update:model-value="updateInput(formCommand)"
+                      />
+                      <q-input
+                        :readonly="
+                          store.currentStep != 6 || store.statusUpload6
+                        "
+                        class="col-xs-6 col-sm-6"
                         dense
                         outlined
                         v-model="formCommand.commanderAboveOrgOld"
                         label="สังกัดเดิม"
-                        :rules="[(val:string) => !!val || `${'กรุณากรอกสังกัดเดิม'}`]"
-                        lazy-rules
                         hide-bottom-space
                         @update:model-value="updateInput(formCommand)"
                       />
diff --git a/src/modules/06_evaluate/components/step/step7.vue b/src/modules/06_evaluate/components/step/step7.vue
index 8586ce3..a6cf6b9 100644
--- a/src/modules/06_evaluate/components/step/step7.vue
+++ b/src/modules/06_evaluate/components/step/step7.vue
@@ -66,9 +66,6 @@ async function downloadFile(url: string) {
     })
     .catch((err) => {
       messageError($q, err);
-    })
-    .finally(() => {
-      hideLoader();
     });
 }
 
diff --git a/src/modules/06_evaluate/components/step/step8.vue b/src/modules/06_evaluate/components/step/step8.vue
index 93794c9..ef226e4 100644
--- a/src/modules/06_evaluate/components/step/step8.vue
+++ b/src/modules/06_evaluate/components/step/step8.vue
@@ -172,7 +172,12 @@ onMounted(async () => {
         />
       </div>
 
-      <div class="col-12" v-if="(store.currentStep !== 8 && downloadUrl) ||  store.currentStep == 8 ">
+      <div
+        class="col-12"
+        v-if="
+          (store.currentStep !== 8 && downloadUrl) || store.currentStep == 8
+        "
+      >
         <q-card class="shadow-0" bordered>
           <div class="row col-12 bg-grey-1 q-px-sm q-py-xs items-center">
             <div class="text-weight-medium">เอกสารเล่ม 2 (ฉบับแก้ไข)</div>
@@ -218,7 +223,7 @@ onMounted(async () => {
                 </div>
               </div>
               <div v-else>
-                <div class="row col-12 q-px-sm q-py-xs items-center"> 
+                <div class="row col-12 q-px-sm q-py-xs items-center">
                   <div>เอกสารเล่ม 2 (ฉบับแก้ไข)</div>
                   <q-space />
                   <q-btn
diff --git a/src/modules/06_evaluate/components/viewstep/popupHistory.vue b/src/modules/06_evaluate/components/viewstep/popupHistory.vue
index 90af293..fd03ab9 100644
--- a/src/modules/06_evaluate/components/viewstep/popupHistory.vue
+++ b/src/modules/06_evaluate/components/viewstep/popupHistory.vue
@@ -73,7 +73,7 @@ const columns = ref<QTableProps["columns"]>([
     style: "font-size: 14px",
   },
 ]);
-const row = ref<any>();
+const row = ref<any[]>([]);
 
 /**
  * function เรียกข้อมูลประวัติการประเมิน
diff --git a/src/modules/06_evaluate/components/viewstep/viewStep1.vue b/src/modules/06_evaluate/components/viewstep/viewStep1.vue
index 773715a..d749a44 100644
--- a/src/modules/06_evaluate/components/viewstep/viewStep1.vue
+++ b/src/modules/06_evaluate/components/viewstep/viewStep1.vue
@@ -1,5 +1,6 @@
+div
 <script setup lang="ts">
-import { reactive, onMounted } from "vue";
+import { reactive, onMounted, ref } from "vue";
 import { useRoute } from "vue-router";
 import { useQuasar } from "quasar";
 
@@ -7,6 +8,7 @@ import http from "@/plugins/http";
 import config from "@/app.config";
 import { useCounterMixin } from "@/stores/mixin";
 import { useEvaluateDetailStore } from "@/modules/06_evaluate/stores/evaluteDetail";
+import { useEvaluateStore } from "@/modules/06_evaluate/store";
 
 /** importType*/
 import type {
@@ -16,10 +18,12 @@ import type {
 
 /** importComponents*/
 import TableData from "@/modules/06_evaluate/components/viewstep/tableStep1.vue";
+import HeaderDialog from "@/components/DialogHeader.vue";
 
 /** use*/
 const mixin = useCounterMixin();
 const store = useEvaluateDetailStore();
+const storeEva = useEvaluateStore();
 const $q = useQuasar();
 const route = useRoute();
 const { showLoader, hideLoader, messageError, date2Thai, findOrgNameHtml } =
@@ -140,7 +144,10 @@ async function fetchDataAllDetail() {
   });
 
   http.get(config.API.dataUserPerformance).then((res) => {
-    formDetail.assessments = res.data.result;
+    formDetail.assessments = res.data.result.map((e: any) => ({
+      ...e,
+      isAdd: false,
+    }));
   });
 
   http.get(config.API.dataUserPortfolio).then((res) => {
@@ -217,6 +224,70 @@ function getData() {
     });
 }
 
+/** ผลงานที่เคยเสนอขอ*/
+const modalPerformance = ref<boolean>(false);
+const isEdit = ref<boolean>(false);
+const isIndex = ref<number>();
+const formPerformance = reactive<any>({
+  year: null,
+  type: "",
+  subject: "",
+  evaluationResult: "",
+});
+const typeOptions = ref<string[]>([
+  "ประเมินชำนาญการ",
+  "ประเมินชำนาญการพิเศษ",
+  "ประเมินเชี่ยวชาญ",
+]);
+
+const resultOptions = ref<any[]>([
+  { label: "ผ่าน", value: "ผ่าน" },
+  { label: "ไม่ผ่าน", value: "ไม่ผ่าน" },
+]);
+
+function onOpenDialogPerformance(
+  stetusEdit: boolean = false,
+  index: number | null = null
+) {
+  if (stetusEdit && index) {
+    isIndex.value = index;
+    const data = formDetail.assessments[index];
+    formPerformance.year = data.year ? Number(data.year) - 543 : null;
+    formPerformance.type = data.type;
+    formPerformance.subject = data.subject;
+    formPerformance.evaluationResult = data.evaluationResult;
+  }
+  isEdit.value = stetusEdit;
+  modalPerformance.value = true;
+}
+
+function onCloseDialogPerformance() {
+  modalPerformance.value = false;
+  formPerformance.year = null;
+  formPerformance.type = "";
+  formPerformance.subject = "";
+  formPerformance.evaluationResult = "";
+}
+
+function onSubmitPerformance() {
+  const body = {
+    ...formPerformance,
+    year: formPerformance.year ? Number(formPerformance.year) + 543 : null,
+    isAdd: true,
+  };
+
+  if (isEdit.value && isIndex.value) {
+    formDetail.assessments[isIndex.value] = body;
+  } else {
+    formDetail.assessments.push(body);
+  }
+  onCloseDialogPerformance();
+}
+
+function onDeletePerformance(index: number) {
+  formDetail.assessments.splice(index, 1);
+}
+
 onMounted(async () => {
   try {
     showLoader();
@@ -575,18 +646,178 @@ onMounted(async () => {
 
       <q-card class="col-12 cardSp1" bordered>
         <div class="text-weight-bold row items-center bg-grey-2 col-12">
-          <span class="q-ml-lg q-my-sm">ผลงานที่เคยเสนอขอประเมิน (ถ้ามี)</span>
+          <span class="q-ml-lg q-my-sm">ผลงานที่เคยเสนอขอประเมิน (ถ้ามี) </span>
+          <q-btn
+            v-if="storeEva.currentStep === 1"
+            class="q-ml-sm"
+            flat
+            round
+            dense
+            color="primary"
+            icon="add"
+            @click.stop="onOpenDialogPerformance(false)"
+          >
+            <q-tooltip>เพิ่มข้อมูล </q-tooltip>
+          </q-btn>
         </div>
         <div class="col-12"><q-separator /></div>
         <div class="col-10">
-          <TableData
-            :columns="columnAssessments"
-            :row="formDetail.assessments"
-          />
+          <div class="q-pa-sm row col-12">
+            <d-table
+              flat
+              bordered
+              :columns="columnAssessments"
+              :rows="formDetail.assessments"
+              dense
+              :rows-per-page-options="[10, 25, 50, 100]"
+              virtual-scroll
+              class="row col-12"
+              :style="$q.screen.lt.sm ? 'width: 80vw' : 'width: 50vw;'"
+            >
+              <template v-slot:header="props">
+                <q-tr :props="props" class="bg-grey-2">
+                  <q-th auto-widt v-if="storeEva.currentStep === 1" />
+                  <q-th
+                    v-for="col in props.cols"
+                    :key="col.name"
+                    :props="props"
+                  >
+                    <span class="text-body2 text-black">{{ col.label }}</span>
+                  </q-th>
+                </q-tr>
+              </template>
+
+              <template v-slot:body="props">
+                <q-tr :props="props">
+                  <q-td auto-widt v-if="storeEva.currentStep === 1">
+                    <q-btn
+                      v-if="props.row.isAdd"
+                      flat
+                      dense
+                      round
+                      color="edit"
+                      icon="edit"
+                      @Click.stop.prevent="
+                        onOpenDialogPerformance(true, props.rowIndex)
+                      "
+                    >
+                      <q-tooltip>แก้ไข</q-tooltip>
+                    </q-btn>
+
+                    <q-btn
+                      v-if="props.row.isAdd"
+                      flat
+                      dense
+                      round
+                      color="red"
+                      icon="delete"
+                      @click.stop.pervent="onDeletePerformance(props.rowIndex)"
+                    >
+                      <q-tooltip>ลบ</q-tooltip>
+                    </q-btn>
+                  </q-td>
+                  <q-td
+                    v-for="col in props.cols"
+                    :key="col.name"
+                    :props="props"
+                  >
+                    <div>
+                      {{ !col.value ? "-" : col.value }}
+                    </div>
+                  </q-td>
+                </q-tr>
+              </template>
+            </d-table>
+          </div>
         </div>
       </q-card>
     </div>
   </q-card>
+
+  <q-dialog v-model="modalPerformance" persistent>
+    <q-card style="min-width: 35%">
+      <q-form greedy @submit.prevent @validation-success="onSubmitPerformance">
+        <HeaderDialog
+          :tittle="'ผลงานที่เคยเสนอขอประเมิน (ถ้ามี)'"
+          :close="onCloseDialogPerformance"
+        />
+        <q-separator />
+        <q-card-section>
+          <div class="row q-col-gutter-sm">
+            <div class="col-12">
+              <datepicker
+                menu-class-name="modalfix"
+                v-model="formPerformance.year"
+                :locale="'th'"
+                autoApply
+                year-picker
+                :enableTimePicker="false"
+              >
+                <template #year="{ year }">{{ year + 543 }}</template>
+                <template #year-overlay-value="{ value }">{{
+                  parseInt(value + 543)
+                }}</template>
+                <template #trigger>
+                  <q-input
+                    dense
+                    outlined
+                    :model-value="
+                      !formPerformance.year
+                        ? null
+                        : Number(formPerformance.year) + 543
+                    "
+                    :label="`${'ปี พ.ศ.'}`"
+                    :rules="[(val:string) => !!val || 'กรุณาเลือกปี พ.ศ.']"
+                    hide-bottom-space
+                  >
+                    <template v-slot:prepend>
+                      <q-icon
+                        name="event"
+                        class="cursor-pointer"
+                        style="color: var(--q-primary)"
+                      >
+                      </q-icon>
+                    </template>
+                  </q-input>
+                </template>
+              </datepicker>
+            </div>
+            <div class="col-12">
+              <q-select
+                dense
+                outlined
+                label="ระดับตอนที่ยืนขอ"
+                hide-bottom-space
+                v-model="formPerformance.type"
+                :options="typeOptions"
+              />
+            </div>
+            <div class="col-12">
+              <q-input
+                v-model="formPerformance.subject"
+                label="เรื่อง/ชื่อเรื่อง"
+                outlined
+                dense
+                hide-bottom-space
+              />
+            </div>
+            <div class="col-12">
+              <q-option-group
+                :options="resultOptions"
+                type="radio"
+                v-model="formPerformance.evaluationResult"
+                inline
+              />
+            </div>
+          </div>
+        </q-card-section>
+        <q-separator />
+        <q-card-actions align="right">
+          <q-btn label="บันทึก" color="public" type="submit" />
+        </q-card-actions>
+      </q-form>
+    </q-card>
+  </q-dialog>
 </template>
 
 <style>