From ecbc9cee3a36b07388678ddc49629c3c497d2b35 Mon Sep 17 00:00:00 2001
From: "STW_TTTY\\stwtt" <trx.setthawut@gmail.com>
Date: Thu, 20 Jun 2024 18:05:00 +0700
Subject: [PATCH] =?UTF-8?q?=E0=B9=81=E0=B8=81=E0=B9=89=20KPI?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../08_KPI/components/Tab/04_Result.vue       | 260 +++++++++++-------
 .../Tab/Dialog/DialogCommentProgress.vue      |   1 -
 .../components/Tab/Topic/01_Indicator.vue     |   3 +
 .../components/Tab/Topic/02_Competency.vue    |   3 +
 .../components/Tab/Topic/03_Develop.vue       |   3 +
 src/modules/08_KPI/views/form.vue             |   4 +-
 6 files changed, 171 insertions(+), 103 deletions(-)

diff --git a/src/modules/08_KPI/components/Tab/04_Result.vue b/src/modules/08_KPI/components/Tab/04_Result.vue
index 60edefc..0448ee6 100644
--- a/src/modules/08_KPI/components/Tab/04_Result.vue
+++ b/src/modules/08_KPI/components/Tab/04_Result.vue
@@ -1,8 +1,21 @@
 <script setup lang="ts">
 import { computed, ref } from "vue";
+import DialogHeader from "@/components/DialogHeader.vue";
+import { useQuasar } from "quasar";
+import { useCounterMixin } from "@/stores/mixin";
+import { useKpiDataStore } from "@/modules/08_KPI/store";
+
+const store = useKpiDataStore();
+const $q = useQuasar();
+const mixin = useCounterMixin();
+const { dialogConfirm, success, showLoader, hideLoader, dialogMessageNotify } =
+  mixin;
 
 const separator = ref<any>("cell");
 
+const additionalSuperiorCommentRef = ref<any>(null);
+const superiorCommentRef = ref<any>(null);
+
 const title = ref<string>("");
 const developmentMethod = ref<string>("");
 const developmentPeriod = ref<string>("");
@@ -65,29 +78,48 @@ function convert(score: any): string {
   }
 }
 
-function onSubmit(){
-
+function onSubmit() {
+  dialogConfirm($q, () => {});
 }
 
-function onSubmitCommander(){
-  
+function onSubmitCommander() {
+  if (superiorCommentCheck.value == "") {
+    dialogMessageNotify($q, "กรุณาเลือกความคิดเห็น");
+  } else {
+    dialogConfirm($q, () => {});
+  }
 }
-function onSubmitCommanderHigh(){
-  
+function onSubmitCommanderHigh() {
+  if (additionalSuperiorCheck.value == "") {
+    dialogMessageNotify($q, "กรุณาเลือกความคิดเห็น");
+  } else {
+    dialogConfirm($q, () => {});
+  }
+}
+
+function resetCommander() {
+  superiorComment.value = "";
+  superiorCommentRef.value.resetValidation();
+}
+
+function resetCommanderHigh() {
+  additionalSuperiorComment.value = "";
+  additionalSuperiorCommentRef.value.resetValidation();
 }
 </script>
 <template>
-  <div class="q-pa-sm ">
+  <div class="q-pa-sm">
     <!-- 1-4 สรุปผลการประเมิน -->
     <q-card bordered>
       <q-form greedy @submit.prevent @validation-success="onSubmit">
+        <q-toolbar>
+          <q-toolbar-title class="text-subtitle2 text-bold"
+            >สรุปผลการประเมิน</q-toolbar-title
+          >
+        </q-toolbar>
+        <q-separator />
         <q-card-section>
           <div class="row q-col-gutter-sm">
-            <div class="col-12">
-              <div class="text-weight-bold text-body2">
-                <span class="txt-under text-blue-6">สรุปผลการประเมิน</span>
-              </div>
-            </div>
             <div class="col-12">
               <q-markup-table
                 :separator="separator"
@@ -181,24 +213,33 @@ function onSubmitCommanderHigh(){
               <q-input
                 v-model="title"
                 outlined
+                hide-bottom-space
                 type="textarea"
                 label="ชื่อเรื่อง/เนื้อหา/หัวข้อการพัฒนา"
+                :readonly="store.rolePerson !== 'EVALUATOR'"
+                :rules="[(val:string) => !!val || `${'กรุณากรอกชื่อเรื่อง/เนื้อหา/หัวข้อการพัฒนา'}`,]"
               />
             </div>
             <div class="col-12">
               <q-input
                 v-model="developmentMethod"
                 outlined
+                hide-bottom-space
                 type="textarea"
                 label="วิธีการพัฒนา"
+                :readonly="store.rolePerson !== 'EVALUATOR'"
+                :rules="[(val:string) => !!val || `${'กรุณากรอกวิธีการพัฒนา'}`,]"
               />
             </div>
             <div class="col-12">
               <q-input
                 v-model="developmentPeriod"
                 outlined
+                hide-bottom-space
                 type="textarea"
                 label="ช่วงเวลาการพัฒนา"
+                :readonly="store.rolePerson !== 'EVALUATOR'"
+                :rules="[(val:string) => !!val || `${'กรุณากรอกช่วงเวลาการพัฒนา'}`,]"
               />
             </div>
             <div class="col-12">
@@ -211,7 +252,67 @@ function onSubmitCommanderHigh(){
                 v-model="evaluatorComment"
                 outlined
                 type="textarea"
+                hide-bottom-space
                 label="ความเห็นของผู้ประเมิน"
+                :readonly="store.rolePerson !== 'EVALUATOR'"
+                :rules="[(val:string) => !!val || `${'กรุณากรอกความเห็นของ'}`,]"
+              />
+            </div>
+          </div>
+        </q-card-section>
+        <q-separator v-if="store.rolePerson == 'EVALUATOR'" />
+        <q-card-actions v-if="store.rolePerson == 'EVALUATOR'" align="right">
+          <q-btn label="บันทึก" color="secondary" type="submit"
+            ><q-tooltip>บันทึกข้อมูล</q-tooltip></q-btn
+          >
+        </q-card-actions>
+      </q-form>
+    </q-card>
+
+    <q-card
+      bordered
+      class="q-mt-md"
+      v-if="store.rolePerson == 'COMMANDER' && evaluatorComment !== '' && store.dataEvaluation.commanderId !== null"
+    >
+      <q-form greedy @submit.prevent @validation-success="onSubmitCommander">
+        <q-toolbar>
+          <q-toolbar-title class="text-subtitle2 text-bold"
+            >ความเห็นของผู้บังคับบัญชาเหนือขึ้นไป</q-toolbar-title
+          >
+        </q-toolbar>
+        <q-separator />
+        <q-card-section>
+          <div class="row q-col-gutter-sm">
+            <div class="col-12">
+              <div class="column">
+                <q-radio
+                  v-model="superiorCommentCheck"
+                  checked-icon="task_alt"
+                  unchecked-icon="panorama_fish_eye"
+                  val="true"
+                  label="เห็นด้วยกับผลการประเมิน"
+                  @click="resetCommander()"
+                />
+                <q-radio
+                  v-model="superiorCommentCheck"
+                  checked-icon="task_alt"
+                  unchecked-icon="panorama_fish_eye"
+                  val="false"
+                  label="มีความเห็นต่าง ดังนี้"
+                />
+              </div>
+            </div>
+
+            <div class="col-12">
+              <q-input
+                v-model="superiorComment"
+                outlined
+                :readonly="superiorCommentCheck == 'true'"
+                type="textarea"
+                label="ความเห็นของผู้บังคับบัญชาเหนือขึ้นไป"
+                hide-bottom-space
+                ref="superiorCommentRef"
+                :rules="[(val:string) => superiorCommentCheck !== 'false'||!!val || `${'กรุณากรอกความเห็น'}`,]"
               />
             </div>
           </div>
@@ -225,96 +326,57 @@ function onSubmitCommanderHigh(){
       </q-form>
     </q-card>
 
-    <q-card bordered class="q-mt-md">
-      <q-form greedy @submit.prevent @validation-success="onSubmitCommander">
-        <q-card-section>
-      <div class="row q-gutter-sm">
-        <div class="col-12">
-          <div class="text-weight-bold text-body2">
-            <span class="txt-under text-blue-6"
-              >ความเห็นของผู้บังคับบัญชาเหนือขึ้นไป</span
-            >
-          </div>
-        </div>
-        <div class="col-12">
-          <div class="column">
-            <q-radio
-              v-model="superiorCommentCheck"
-              checked-icon="task_alt"
-              unchecked-icon="panorama_fish_eye"
-              val="true"
-              label="เห็นด้วยกับผลการประเมิน"
-            />
-            <q-radio
-              v-model="superiorCommentCheck"
-              checked-icon="task_alt"
-              unchecked-icon="panorama_fish_eye"
-              val="false"
-              label="มีความเห็นตามดังนี้"
-            />
-          </div>
-        </div>
-
-        <div class="col-12">
-          <q-input
-            v-model="superiorComment"
-            outlined
-            type="textarea"
-            label="ความเห็นของผู้บังคับบัญชาเหนือขึ้นไป"
-            :readonly="superiorCommentCheck == 'true'"
-          />
-        </div>
-      </div>
-              </q-card-section>
-        <q-separator />
-        <q-card-actions align="right">
-          <q-btn label="บันทึก" color="secondary" type="submit"
-            ><q-tooltip>บันทึกข้อมูล</q-tooltip></q-btn
+    <q-card
+      bordered
+      class="q-mt-md"
+      v-if="store.rolePerson == 'COMMANDERHIGH' && superiorComment !== '' && store.dataEvaluation.commanderHighId !== null"
+    >
+      <q-form
+        greedy
+        @submit.prevent
+        @validation-success="onSubmitCommanderHigh"
+      >
+        <q-toolbar>
+          <q-toolbar-title class="text-subtitle2 text-bold"
+            >ความเห็นของผู้บังคับบัญชาเหนือขึ้นไปอีกชั้นหนึ่ง</q-toolbar-title
           >
-        </q-card-actions>
-      </q-form>
-    </q-card>
-
-    <q-card bordered class="q-mt-md">
-      <q-form greedy @submit.prevent @validation-success="onSubmitCommanderHigh">
+        </q-toolbar>
+        <q-separator />
         <q-card-section>
-      <div class="row q-gutter-sm">
-        <div class="col-12">
-          <div class="text-weight-bold text-body2">
-            <span class="txt-under text-blue-6"
-              >ความเห็นของผู้บังคับบัญชาเหนือขึ้นไปอีกชั้นหนึ่ง</span
-            >
+          <div class="row q-col-gutter-sm">
+            <div class="col-12">
+              <div class="column">
+                <q-radio
+                  v-model="additionalSuperiorCheck"
+                  checked-icon="task_alt"
+                  unchecked-icon="panorama_fish_eye"
+                  val="true"
+                  label="เห็นด้วยกับผลการประเมิน"
+                  @click="resetCommanderHigh()"
+                />
+                <q-radio
+                  v-model="additionalSuperiorCheck"
+                  checked-icon="task_alt"
+                  unchecked-icon="panorama_fish_eye"
+                  val="false"
+                  label="มีความเห็นต่าง ดังนี้"
+                />
+              </div>
+            </div>
+            <div class="col-12">
+              <q-input
+                ref="additionalSuperiorCommentRef"
+                v-model="additionalSuperiorComment"
+                outlined
+                hide-bottom-space
+                type="textarea"
+                label="ความเห็นของผู้บังคับบัญชาเหนือขึ้นไปอีกชั้นหนึ่ง"
+                :readonly="additionalSuperiorCheck == 'true'"
+                :rules="[(val:string) => additionalSuperiorCheck !== 'false'||!!val || `${'กรุณากรอกความเห็น'}`,]"
+              />
+            </div>
           </div>
-        </div>
-        <div class="col-12">
-          <div class="column">
-            <q-radio
-              v-model="additionalSuperiorCheck"
-              checked-icon="task_alt"
-              unchecked-icon="panorama_fish_eye"
-              val="true"
-              label="เห็นด้วยกับผลการประเมิน"
-            />
-            <q-radio
-              v-model="additionalSuperiorCheck"
-              checked-icon="task_alt"
-              unchecked-icon="panorama_fish_eye"
-              val="false"
-              label="มีความเห็นตามดังนี้"
-            />
-          </div>
-        </div>
-        <div class="col-12">
-          <q-input
-            v-model="additionalSuperiorComment"
-            outlined
-            type="textarea"
-            label="ความเห็นของผู้บังคับบัญชาเหนือขึ้นไปอีกชั้นหนึ่ง"
-            :readonly="additionalSuperiorCheck == 'true'"
-          />
-        </div>
-      </div>
-              </q-card-section>
+        </q-card-section>
         <q-separator />
         <q-card-actions align="right">
           <q-btn label="บันทึก" color="secondary" type="submit"
diff --git a/src/modules/08_KPI/components/Tab/Dialog/DialogCommentProgress.vue b/src/modules/08_KPI/components/Tab/Dialog/DialogCommentProgress.vue
index 692c697..2a0dfb6 100644
--- a/src/modules/08_KPI/components/Tab/Dialog/DialogCommentProgress.vue
+++ b/src/modules/08_KPI/components/Tab/Dialog/DialogCommentProgress.vue
@@ -236,7 +236,6 @@ watch(
             <template v-slot:before>
               <div class="q-pa-sm">
                 <q-btn
-                  v-if="store.rolePerson === 'USER'"
                   icon="add"
                   color="teal"
                   flat
diff --git a/src/modules/08_KPI/components/Tab/Topic/01_Indicator.vue b/src/modules/08_KPI/components/Tab/Topic/01_Indicator.vue
index e1509c4..d9ee3ad 100644
--- a/src/modules/08_KPI/components/Tab/Topic/01_Indicator.vue
+++ b/src/modules/08_KPI/components/Tab/Topic/01_Indicator.vue
@@ -213,6 +213,9 @@ const isEditStep3 = computed(() => {
       store.rolePerson === "USER" &&
       store.tabMain === "3") ||
     (store.dataEvaluation.evaluationStatus === "EVALUATING_EVALUATOR" &&
+      store.rolePerson === "EVALUATOR" &&
+      store.tabMain === "3")||
+    (store.dataEvaluation.evaluationStatus === "EVALUATING" &&
       store.rolePerson === "EVALUATOR" &&
       store.tabMain === "3")
   );
diff --git a/src/modules/08_KPI/components/Tab/Topic/02_Competency.vue b/src/modules/08_KPI/components/Tab/Topic/02_Competency.vue
index b0b3419..26ba5b1 100644
--- a/src/modules/08_KPI/components/Tab/Topic/02_Competency.vue
+++ b/src/modules/08_KPI/components/Tab/Topic/02_Competency.vue
@@ -247,6 +247,9 @@ const isEditStep3 = computed(() => {
       store.rolePerson === "USER" &&
       store.tabMain === "3") ||
     (store.dataEvaluation.evaluationStatus === "EVALUATING_EVALUATOR" &&
+      store.rolePerson === "EVALUATOR" &&
+      store.tabMain === "3")||
+    (store.dataEvaluation.evaluationStatus === "EVALUATING" &&
       store.rolePerson === "EVALUATOR" &&
       store.tabMain === "3")
   );
diff --git a/src/modules/08_KPI/components/Tab/Topic/03_Develop.vue b/src/modules/08_KPI/components/Tab/Topic/03_Develop.vue
index 692d403..1f364ea 100644
--- a/src/modules/08_KPI/components/Tab/Topic/03_Develop.vue
+++ b/src/modules/08_KPI/components/Tab/Topic/03_Develop.vue
@@ -180,6 +180,9 @@ const isEditStep3 = computed(() => {
       store.rolePerson === "USER" &&
       store.tabMain === "3") ||
     (store.dataEvaluation.evaluationStatus === "EVALUATING_EVALUATOR" &&
+      store.rolePerson === "EVALUATOR" &&
+      store.tabMain === "3")||
+    (store.dataEvaluation.evaluationStatus === "EVALUATING" &&
       store.rolePerson === "EVALUATOR" &&
       store.tabMain === "3")
   );
diff --git a/src/modules/08_KPI/views/form.vue b/src/modules/08_KPI/views/form.vue
index 7b0dc0f..7fffaa7 100644
--- a/src/modules/08_KPI/views/form.vue
+++ b/src/modules/08_KPI/views/form.vue
@@ -63,8 +63,6 @@ async function fetchEvaluation() {
     .get(config.API.kpiEvaluation + `/${id.value}`)
     .then(async (res) => {
       const data = res.data.result;
-      // console.log("🚀 ~ .then ~ data:", data);
-
       store.dataEvaluation = await data;
       formProfile.status = store.convertStatus(data.evaluationStatus);
       formProfile.result = store.convertResults(data.evaluationResults);
@@ -89,7 +87,7 @@ async function fetchEvaluation() {
 
 async function getProfile() {
   await http
-    .get(config.API.orgPosition + `/${store.dataEvaluation.profileId}`)
+    .get(config.API.profilePosition())
     .then(async (res) => {
       const data = await res.data.result;
       store.dataProfile = await data;