แก้ พฤติกรรมการปฎิบัติราชการ (สมรรถนะ)

src/modules/08_KPI/components/Tab/Topic/02_Competency.vue

@@ -10,7 +10,16 @@ import http from "@/plugins/http";
 import config from "@/app.config";
 import { useRoute } from "vue-router";
 
-import type { FormCapacityList } from "@/modules/08_KPI/interface/request/index";
+import type {
+  FormCapacityList,
+  ListCriteria,
+} from "@/modules/08_KPI/interface/request/index";
+
+const dataListCriteria = defineModel<ListCriteria[]>("dataListCriteria", { required: true, });
+
+const sortedDataListCriteria = computed(() => {
+  return dataListCriteria.value.sort((a, b) => a.level - b.level);
+});
 
 const modalEvaluate = ref<boolean>(false);
 const store = useKpiDataStore();
@@ -260,22 +269,16 @@ onMounted(() => {
                       label="ระดับการประเมินพฤติกรรม"
                       disable
                     >
-                      <template v-slot:tip-1>
-                        <q-tooltip>ต่ำกว่าระดับที่คาดหวังมาก (1)</q-tooltip>
-                      </template>
-                      <template v-slot:tip-2>
-                        <q-tooltip>ต่ำกว่าระดับที่คาดหวัง (2)</q-tooltip>
-                      </template>
-                      <template v-slot:tip-3>
-                        <q-tooltip>อยู่ในระดับที่คาดหวัง (3)</q-tooltip>
-                      </template>
-                      <template v-slot:tip-4>
-                        <q-tooltip>อยู่ในระดับสูงกว่าที่คาดหวัง (4)</q-tooltip>
-                      </template>
-                      <template v-slot:tip-5>
-                        <q-tooltip
-                          >เป็นแบบอย่างที่ดีให้กับผู้อื่น (5)</q-tooltip
-                        >
+                      <template
+                        v-for="(i, index) in sortedDataListCriteria"
+                        :key="i.level"
+                        v-slot:[`tip-${index+1}`]
+                      >
+                        <q-tooltip>
+                          <div class="text-body2">
+                            <span v-html="i.description"></span>
+                          </div>
+                        </q-tooltip>
                       </template>
                     </q-rating>
                   </div>
@@ -330,7 +333,9 @@ onMounted(() => {
     v-model:modal="modalEvaluate"
     v-model:data="rows[typeCompetency]"
     v-model:type="typeCompetency"
+    v-model:dataListCriteria="dataListCriteria"
     :get-data="getData"
+    
   />
 
   <div class="row text-body2 text-weight-bold justify-center">