แก้ พฤติกรรมการปฎิบัติราชการ (สมรรถนะ)
This commit is contained in:
parent
2f1a600c22
commit
31c2f99741
6 changed files with 94 additions and 70 deletions
|
|
@ -14,6 +14,11 @@ import Competency from "@/modules/08_KPI/components/Tab/Topic/02_Competency.vue"
|
|||
import { useCounterMixin } from "@/stores/mixin";
|
||||
import { useKpiDataStore } from "@/modules/08_KPI/store";
|
||||
|
||||
|
||||
import type { ListCriteria } from "@/modules/08_KPI/interface/request/index";
|
||||
|
||||
const dataListCriteria = ref<ListCriteria[]>([]);
|
||||
|
||||
const modalCriteria = ref<boolean>(false);
|
||||
const $q = useQuasar();
|
||||
const route = useRoute();
|
||||
|
|
@ -117,7 +122,23 @@ const resultWork = computed(() => {
|
|||
return parseFloat(((total * 80) ).toFixed(2));
|
||||
});
|
||||
|
||||
function getCriteria() {
|
||||
http
|
||||
.get(config.API.KpiEvaluation)
|
||||
.then((res) => {
|
||||
const data = res.data.result.data;
|
||||
dataListCriteria.value = data;
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
getCriteria()
|
||||
fetchListPlanned();
|
||||
fetchListRole();
|
||||
fetchAssigned();
|
||||
|
|
@ -187,11 +208,11 @@ onMounted(() => {
|
|||
</q-btn>
|
||||
</div>
|
||||
|
||||
<Competency />
|
||||
<Competency v-model:dataListCriteria="dataListCriteria"/>
|
||||
</div>
|
||||
</q-scroll-area>
|
||||
|
||||
<DialogListCriteria v-model:modal="modalCriteria" />
|
||||
<DialogListCriteria v-model:modal="modalCriteria" v-model:dataListCriteria="dataListCriteria"/>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
|
|
|
|||
|
|
@ -78,6 +78,10 @@ const fieldLabels = {
|
|||
const competencyTypeOp = ref<DataOptions[]>(store.competencyType);
|
||||
|
||||
function clickList(index: string, data: any) {
|
||||
showLoader()
|
||||
setTimeout(()=>{
|
||||
hideLoader()
|
||||
},100)
|
||||
formScore.score1 = "";
|
||||
formScore.score2 = "";
|
||||
formScore.score3 = "";
|
||||
|
|
|
|||
|
|
@ -16,50 +16,36 @@ const $q = useQuasar();
|
|||
const dataList = ref<ListCriteria[]>([]);
|
||||
const { showLoader, hideLoader, messageError } = useCounterMixin();
|
||||
const modal = defineModel<boolean>("modal", { required: true });
|
||||
const dataListCriteria = defineModel<ListCriteria[]>("dataListCriteria", { required: true });
|
||||
|
||||
function close() {
|
||||
modal.value = false;
|
||||
}
|
||||
|
||||
watch(
|
||||
() => modal.value,
|
||||
(newValue, oldValue) => {
|
||||
if (newValue == true) {
|
||||
showLoader();
|
||||
http
|
||||
.get(config.API.KpiEvaluation)
|
||||
.then((res) => {
|
||||
const data = res.data.result.data;
|
||||
dataList.value = data;
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
}
|
||||
);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<q-dialog persistent v-model="modal">
|
||||
<q-card style="min-width: 60%" >
|
||||
<q-card style="min-width: 60%">
|
||||
<DialogHeader tittle="เกณฑ์การประเมินสมรรถนะ" :close="close" />
|
||||
<q-separator />
|
||||
<q-card-section class="bg-grey-2">
|
||||
<q-card-section class="">
|
||||
<q-card bordered>
|
||||
<div class="column">
|
||||
<div v-for="(item, index) in dataList" :key="item.id">
|
||||
<div class="q-pa-sm">
|
||||
<div class="row">
|
||||
<span v-html="item.description"></span>
|
||||
</div>
|
||||
</div>
|
||||
<q-separator />
|
||||
<div class="bg-grey-2 q-pa-sm">
|
||||
<div class="row text-dark text-body2 text-weight-medium">
|
||||
<div class="text-center col-8">เกณฑ์การประเมิน</div>
|
||||
<div class="text-center col-4">ระดับคะแนน</div>
|
||||
</div>
|
||||
</div>
|
||||
<q-separator />
|
||||
<div v-for="(item, index) in dataListCriteria" :key="item.id">
|
||||
<div :class="`row q-pa-sm ${index %2 !== 0 && 'bg-grey-2'}`">
|
||||
<div class="col-8"><span v-html="item.description"></span></div>
|
||||
<div class="col-4 text-center self-center text-body1 text-weight-bold">
|
||||
<span>{{ item.level }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<q-separator />
|
||||
</div>
|
||||
</q-card>
|
||||
</q-card-section>
|
||||
</q-card>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, watch } from "vue";
|
||||
import { ref, watch, computed } from "vue";
|
||||
|
||||
import DialogHeader from "@/components/DialogHeader.vue";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
|
|
@ -9,6 +9,16 @@ import { useQuasar, type QTableProps } from "quasar";
|
|||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
|
||||
import type { 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 props = defineProps({
|
||||
getData: Function,
|
||||
default: () => console.log("not function"),
|
||||
|
|
@ -170,24 +180,16 @@ function onSubmit() {
|
|||
:color-selected="store.ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม"
|
||||
>
|
||||
<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>
|
||||
|
|
|
|||
|
|
@ -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">
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue