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

This commit is contained in:
STW_TTTY\stwtt 2024-04-25 16:53:07 +07:00
parent 2f1a600c22
commit 31c2f99741
6 changed files with 94 additions and 70 deletions

View file

@ -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>

View file

@ -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 = "";

View file

@ -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>

View file

@ -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>

View file

@ -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">