Merge branch 'develop' of github.com:Frappet/BMA-EHR-USER into develop

* 'develop' of github.com:Frappet/BMA-EHR-USER:
  ui องค์ประกอบที่ 2
  รายการขอรับประเมินผลการปฏิบัติราชการระดับบุคคล =>  แก้ไขแบบประเมิน

src/modules/08_KPI/components/Tab/Dialog/01_FormIndicator.vue

@@ -1,3 +1,4 @@
+div
 <script setup lang="ts">
 import { ref, reactive, watch } from "vue";
 import { useQuasar } from "quasar";
@@ -13,13 +14,19 @@ const $q = useQuasar();
 const mixin = useCounterMixin();
 const store = useKpiDataStore();
 
-const { showLoader, hideLoader, messageError, dialogConfirm } = mixin;
+const {
+  showLoader,
+  hideLoader,
+  messageError,
+  dialogConfirm,
+  dialogMessageNotify,
+} = mixin;
 
 const modal = defineModel<boolean>("modal", { required: true });
 const numpage = defineModel<number>("numpage", { required: true });
 
 const search = ref<string>("");
-const listCheck = ref<number | null>(null);
+const listCheckID = ref<string | null>(null);
 const listTarget = ref<any>([]);
 
 const formDetail = reactive<any>({
@@ -86,13 +93,13 @@ function fetchListRole() {
     });
 }
 
-function clickList(index: number, id: string) {
+function clickList(id: string) {
   showLoader();
   const url = numpage.value === 1 ? config.API.kpiPlan : config.API.kpiRole;
   http
     .get(`${url}/${id}`)
     .then((res) => {
-      listCheck.value = index;
+      listCheckID.value = id;
       const data = res.data.result;
       formDetail.orgRevisionId = data.corgRevisionId;
       formDetail.id = data.id;
@@ -117,7 +124,6 @@ function clickList(index: number, id: string) {
       formDetail.strategy = data.strategy;
       formDetail.strategyId = data.strategyId;
       formDetail.strategyName = data.strategyName;
-
     })
     .catch((err) => {
       messageError($q, err);
@@ -131,7 +137,7 @@ function clickList(index: number, id: string) {
 function closeDialog() {
   modal.value = false;
   search.value = "";
-  listCheck.value = null;
+  listCheckID.value = null;
   formDetail.orgRevisionId = "";
   formDetail.id = "";
   formDetail.year = "";
@@ -155,13 +161,12 @@ function closeDialog() {
   formDetail.strategyId = "";
 }
 
-/** เรียกใช้ class */
-function getclass() {
-  return "inputgreen";
-}
-
 function onSubmit() {
-  dialogConfirm($q, () => {});
+  if (!listCheckID.value) {
+    dialogMessageNotify($q, "กรุณาเลือกตัวชี้วัด");
+  } else {
+    dialogConfirm($q, () => {});
+  }
 }
 
 watch(
@@ -179,7 +184,7 @@ watch(
 </script>
 <template>
   <q-dialog v-model="modal" persistent>
-    <q-card class="col-12" style="width: 70%">
+    <q-card class="col-12" style="width: 100%">
       <q-form greedy @submit.prevent @validation-success="onSubmit">
         <DialogHeader
           :tittle="
@@ -193,9 +198,7 @@ watch(
 
         <q-card-section class="q-pa-none scroll" style="max-height: 75vh">
           <div class="col-12 row">
-            <div
+            <div class="bg-grey-1 q-pa-md col-3 row lineRight">
-              class="bg-grey-1 q-pa-md col-xs-12 col-sm-4 col-md-3 row lineRight"
-            >
               <div class="col-12 fit">
                 <div class="col-12">
                   <q-input
@@ -203,7 +206,7 @@ watch(
                     outlined
                     dense
                     label="ค้นหา"
-                    :class="getclass()"
+                    class="inputgreen"
                   >
                     <template v-slot:append>
                       <q-icon v-if="search == ''" name="search" />
@@ -234,9 +237,9 @@ watch(
                         :key="index"
                         clickable
                         v-ripple
-                        :active="listCheck === index"
+                        :active="listCheckID === item.id"
                         active-class="my-menu-link"
-                        @click="clickList(index, item.id)"
+                        @click="clickList(item.id)"
                       >
                         <q-item-section class="q-pa-none">
                           <div class="row items-center" style="height: 20px">
@@ -255,14 +258,14 @@ watch(
               </div>
             </div>
 
-            <div class="col-xs-12 col-sm-8 col-md-9 row">
+            <div class="col-9">
               <div class="row q-pa-md q-col-gutter-sm">
                 <div class="col-12">
                   <span class="text-body2 text-weight-medium"
                     >รายละเอียดตัวชี้วัด</span
                   >
                 </div>
-                <div class="col-8">
+                <div class="col-6">
                   <q-card bordered class="full-height q-pa-sm">
                     <div class="q-pa-sm q-col-gutter-lg">
                       <div class="col-12 row">
@@ -338,7 +341,7 @@ watch(
                     </div>
                   </q-card>
                 </div>
-                <div class="col-4 row">
+                <div class="col-6 row">
                   <div class="row col-12 card-box">
                     <div
                       class="col-12 bg-grey-2 row items-center text-weight-medium"
@@ -384,24 +387,23 @@ watch(
                     label="นิยามหรือความหมายของตัวชี้วัด"
                     type="textarea"
                     outlined
-                    autogrow
                     dense
                     :rules="[(val:string) => !!val || `${'กรุณากรอกตัวชี้วัด'}`,]"
                     hide-bottom-space
-                    :class="getclass()"
+                    class="inputgreen"
                   />
                 </div>
+
                 <div class="col-12">
                   <q-input
                     v-model="formDetail.formula"
                     label="สูตรคำนวณ"
                     type="textarea"
                     outlined
-                    autogrow
                     dense
                     :rules="[(val:string) => !!val || `${'กรุณากรอกตัวชี้วัด'}`,]"
                     hide-bottom-space
-                    :class="getclass()"
+                    class="inputgreen"
                   />
                 </div>
               </div>

src/modules/08_KPI/components/Tab/Dialog/03_FormIndicatorSpecial.vue

@@ -1,4 +1,4 @@
-divdivdiv<script setup lang="ts">
+<script setup lang="ts">
 import { ref, reactive } from "vue";
 import DialogHeader from "@/components/DialogHeader.vue";
 import type { FormDataAssigned } from "@/modules/08_KPI/interface/request/index";

src/modules/08_KPI/components/Tab/Dialog/04_FormCompetency.vue

@@ -9,7 +9,9 @@ import http from "@/plugins/http";
 import config from "@/app.config";
 
 const store = useKpiDataStore();
+const expectedLevel = ref<any>();
 
+const weight = ref<number | null>(null);
 const { showLoader, hideLoader } = useCounterMixin();
 const modal = defineModel<boolean>("modal", { required: true });
 const competencyType = defineModel<string>("competencyType", {
@@ -26,6 +28,13 @@ const listCheck = ref<number | null>();
 const listTarget = ref<any>([]);
 const listTargetMain = ref<any>([]);
 
+const expectedLevelOp = ref<DataOptions[]>([
+  { id: "1", name: "1" },
+  { id: "2", name: "2" },
+  { id: "3", name: "3" },
+  { id: "4", name: "4" },
+  { id: "5", name: "5" },
+]);
 const formDetail = reactive<any>({
   type: "สมรรถนะหลัก",
   name: "สมรรถนะ 1",
@@ -84,6 +93,9 @@ function closeDialog() {
   formDetail.name = "";
   formDetail.definition = "";
   formDetail.criteria = "";
+
+  weight.value = null
+  expectedLevel.value = null
 }
 
 /** เรียกใช้ class */
@@ -126,6 +138,14 @@ watch(
   () => {
     if (modal.value == true) {
       type.value = competencyType.value;
+      if(type.value == 'HEAD'){
+        expectedLevel.value = store.defaultCompetencyCoreLevel
+      }
+      else if(type.value == 'GROUP'){
+        expectedLevel.value = store.defaultCompetencyGroupLevel
+      }else{
+        expectedLevel.value = null
+      }
       getData();
     }
   }
@@ -229,7 +249,7 @@ watch(
               <div class="row col-12 q-pa-md q-col-gutter-sm">
                 <div class="col-12">
                   <span class="text-body2 text-weight-medium"
-                    >รายละเอียดตัวชี้วัด</span
+                    >รายละเอียดสมรรถนะ</span
                   >
                 </div>
                 <div class="col-5 row">
@@ -262,6 +282,53 @@ watch(
                         </div>
                       </div>
                     </div>
+                    <div class="row q-col-gutter-sm">
+                      <div class="col-6">
+                        <q-input
+                          v-model="weight"
+                          dense
+                          outlined
+                          type="number"
+                          label="น้ำหนัก (ร้อยละ)"
+                          lazy-rules
+                          :rules="[(val:string) => !!val || `${'กรุณากรอกน้ำหนัก (ร้อยละ)'}`,]"
+                          hide-bottom-space
+                          class="inputgreen"
+                        />
+                      </div>
+                      <div
+                        v-if="type == 'HEAD' || type == 'GROUP'"
+                        class="col-6"
+                      >
+                        <q-select
+                          v-model="expectedLevel"
+                          :options="expectedLevelOp"
+                          dense
+                          emit-value
+                          map-options
+                          option-label="id"
+                          option-value="name"
+                          outlined
+                          lazy-rules
+                          label="ระดับที่คาดหวัง"
+                          :rules="[(val:string) => !!val || `${'กรุณาเลือกระดับที่คาดหวัง'}`,]"
+                          hide-bottom-space
+                          class="inputgreen"
+                        />
+                      </div>
+                      <div v-else>
+                        <q-input
+                          v-model="expectedLevel"
+                          dense
+                          outlined
+                          label="ระดับที่คาดหวัง"
+                          lazy-rules
+                          :rules="[(val:string) => !!val || `${'กรุณาระดับที่คาดหวัง'}`,]"
+                          hide-bottom-space
+                          class="inputgreen"
+                        />
+                      </div>
+                    </div>
                   </q-card>
                 </div>
                 <div class="col-7 row">

src/modules/08_KPI/store.ts

@@ -180,5 +180,7 @@ export const useKpiDataStore = defineStore("KPIDate", () => {
     convertResults,
     checkCompetency,
     checkCompetencyDefaultCompetencyLevel,
+    defaultCompetencyCoreLevel,
+    defaultCompetencyGroupLevel
   };
 });