Merge branch 'develop' into devTee
This commit is contained in:
STW_TTTY\stwtt
commit
fb1e158861
9 changed files with 828 additions and 109 deletions
|
|
@ -5,6 +5,7 @@ const kpiPeriod = `${env.API_URI}/kpi/period`;
|
|||
const kpiEvaluation = `${env.API_URI}/kpi/user/evaluation`;
|
||||
const kpiPlan = `${env.API_URI}/kpi/plan`;
|
||||
const kpiRole = `${env.API_URI}/kpi/role`;
|
||||
const kpiSpecial = `${env.API_URI}/kpi/special`;
|
||||
const KpiCapacity = `${env.API_URI}/kpi/capacity`;
|
||||
const KpiFile = `${env.API_URI}/salary/file`;
|
||||
const KpiEvaluationInfo = `${env.API_URI}/kpi/evaluation`;
|
||||
|
|
@ -17,6 +18,7 @@ export default {
|
|||
kpiEvaluation,
|
||||
kpiPlan,
|
||||
kpiRole,
|
||||
kpiSpecial,
|
||||
KpiCapacity,
|
||||
file: KpiFile,
|
||||
|
||||
|
|
@ -25,7 +27,6 @@ export default {
|
|||
|
||||
kpiScoreTotal: () => `${kpiEvaluation}/point`,
|
||||
|
||||
|
||||
/** ผลสัมฤทธิ์ของงาน*/
|
||||
fileByFile: (name: string, group: string, id: string, fileName: string) =>
|
||||
`${url}/file/${name}/${group}/${id}/${fileName}`,
|
||||
|
|
|
|||
|
|
@ -1,10 +1,12 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, reactive, watch } from "vue";
|
||||
import { ref, reactive, watch, computed } from "vue";
|
||||
import { useQuasar } from "quasar";
|
||||
import { useRoute } from "vue-router";
|
||||
import config from "@/app.config";
|
||||
import http from "@/plugins/http";
|
||||
|
||||
import type { DataOptions } from "@/modules/08_KPI/interface/index/Main";
|
||||
|
||||
import DialogHeader from "@/components/DialogHeader.vue";
|
||||
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
|
|
@ -22,6 +24,7 @@ const {
|
|||
dialogConfirm,
|
||||
dialogMessageNotify,
|
||||
success,
|
||||
date2Thai,
|
||||
} = mixin;
|
||||
|
||||
const modal = defineModel<boolean>("modal", { required: true });
|
||||
|
|
@ -35,6 +38,20 @@ const search = ref<string>("");
|
|||
const listCheckID = ref<string | null>(null);
|
||||
const listTarget = ref<any>([]);
|
||||
|
||||
const formFilter = reactive<any>({
|
||||
isAll: false,
|
||||
keyword: "",
|
||||
node: 0,
|
||||
nodeId: "",
|
||||
period: "",
|
||||
year: null,
|
||||
page: 1,
|
||||
pageSize: 20,
|
||||
});
|
||||
|
||||
const totalList = ref<number>(0); //จำนวนข้อมูลรายการ
|
||||
const maxPage = ref<number>(1);
|
||||
|
||||
const formDetail = reactive<any>({
|
||||
orgRevisionId: "",
|
||||
id: "",
|
||||
|
|
@ -60,20 +77,28 @@ const formDetail = reactive<any>({
|
|||
strategyId: "",
|
||||
strategyName: "",
|
||||
documentInfoEvidence: "",
|
||||
date: null,
|
||||
});
|
||||
|
||||
function fetchIndicators() {
|
||||
const nodeId = store.dataProfile.nodeId;
|
||||
const node = store.dataProfile.node;
|
||||
const kpiPeriodId = store.dataEvaluation.kpiPeriodId;
|
||||
/** Option รอบการประเมิน*/
|
||||
const roundOp = ref<DataOptions[]>([
|
||||
{ id: "APR", name: "รอบเมษายน" },
|
||||
{ id: "OCT", name: "รอบตุลาคม" },
|
||||
]);
|
||||
|
||||
function fetchListPlan() {
|
||||
formFilter.nodeId = store.dataProfile.nodeId;
|
||||
formFilter.node = store.dataProfile.node;
|
||||
formFilter.year = formFilter?.year ? formFilter.year.toString() : "";
|
||||
// const kpiPeriodId = store.dataEvaluation.kpiPeriodId;
|
||||
|
||||
showLoader();
|
||||
http
|
||||
.get(
|
||||
config.API.kpiPlan +
|
||||
`?page=${1}&pageSize=${50}&kpiPeriodId=${kpiPeriodId}&nodeId=${nodeId}&node=${node}&keyword=${""}`
|
||||
)
|
||||
.post(config.API.kpiPlan + `/search`, formFilter)
|
||||
.then((res) => {
|
||||
listTarget.value = res.data.result.data;
|
||||
maxPage.value = Math.ceil(res.data.result.total / formFilter.pageSize);
|
||||
totalList.value = res.data.result.total;
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
|
|
@ -83,7 +108,7 @@ function fetchIndicators() {
|
|||
});
|
||||
}
|
||||
|
||||
function fetchIndicatorsByid(id: string) {
|
||||
function fetchListPlanByid(id: string) {
|
||||
showLoader();
|
||||
http
|
||||
.get(config.API.kpiAchievement("planned") + `/${id}`)
|
||||
|
|
@ -94,6 +119,17 @@ function fetchIndicatorsByid(id: string) {
|
|||
formDetail.weight = data.weight;
|
||||
formDetail.meaning = data.meaning;
|
||||
formDetail.formula = data.formula;
|
||||
formDetail.achievement1 = data.achievement1;
|
||||
formDetail.achievement2 = data.achievement2;
|
||||
formDetail.achievement3 = data.achievement3;
|
||||
formDetail.achievement4 = data.achievement4;
|
||||
formDetail.achievement5 = data.achievement5;
|
||||
formDetail.documentInfoEvidence = data.documentInfoEvidence;
|
||||
if (data.startDate && data.endDate) {
|
||||
formDetail.date = [];
|
||||
formDetail.date[0] = data.startDate;
|
||||
formDetail.date[1] = data.endDate;
|
||||
}
|
||||
clickList(data.kpiPlanId, true);
|
||||
})
|
||||
.catch((err) => {
|
||||
|
|
@ -105,15 +141,22 @@ function fetchIndicatorsByid(id: string) {
|
|||
}
|
||||
|
||||
function fetchListRole() {
|
||||
const kpiPeriodId = store.dataEvaluation.kpiPeriodId;
|
||||
const position = store.dataProfile.position;
|
||||
// const kpiPeriodId = store.dataEvaluation.kpiPeriodId;
|
||||
// const position = store.dataProfile.position;
|
||||
formFilter.nodeId = store.dataProfile.nodeId;
|
||||
formFilter.node = store.dataProfile.node;
|
||||
formFilter.year = formFilter?.year ? formFilter.year.toString() : "";
|
||||
formFilter.position = store.dataProfile.position;
|
||||
|
||||
http
|
||||
.get(
|
||||
config.API.kpiRole +
|
||||
`?page=${1}&pageSize=${50}&kpiPeriodId=${kpiPeriodId}&position=${position}`
|
||||
)
|
||||
.post(config.API.kpiRole + `/search`, formFilter)
|
||||
.then((res) => {
|
||||
listTarget.value = res.data.result.data;
|
||||
maxPage.value = Math.ceil(res.data.result.total / formFilter.pageSize);
|
||||
totalList.value = res.data.result.total;
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
|
|
@ -131,6 +174,17 @@ function fetchRoleByid(id: string) {
|
|||
formDetail.weight = data.weight;
|
||||
formDetail.meaning = data.meaning;
|
||||
formDetail.formula = data.formula;
|
||||
formDetail.achievement1 = data.achievement1;
|
||||
formDetail.achievement2 = data.achievement2;
|
||||
formDetail.achievement3 = data.achievement3;
|
||||
formDetail.achievement4 = data.achievement4;
|
||||
formDetail.achievement5 = data.achievement5;
|
||||
formDetail.documentInfoEvidence = data.documentInfoEvidence;
|
||||
if (data.startDate && data.endDate) {
|
||||
formDetail.date = [];
|
||||
formDetail.date[0] = data.startDate;
|
||||
formDetail.date[1] = data.endDate;
|
||||
}
|
||||
clickList(data.kpiRoleId, true);
|
||||
})
|
||||
.catch((err) => {
|
||||
|
|
@ -141,9 +195,76 @@ function fetchRoleByid(id: string) {
|
|||
});
|
||||
}
|
||||
|
||||
function fetchListSpecial() {
|
||||
formFilter.nodeId = store.dataProfile.nodeId;
|
||||
formFilter.node = store.dataProfile.node;
|
||||
formFilter.year = formFilter?.year ? formFilter.year.toString() : "";
|
||||
|
||||
const body = {
|
||||
keyword: formFilter.keyword,
|
||||
period: formFilter.period,
|
||||
year: formFilter.year,
|
||||
pageSize: formFilter.pageSize,
|
||||
page: formFilter.page,
|
||||
};
|
||||
|
||||
showLoader();
|
||||
http
|
||||
.post(config.API.kpiSpecial + `/search`, body)
|
||||
.then((res) => {
|
||||
listTarget.value = res.data.result.data;
|
||||
maxPage.value = Math.ceil(res.data.result.total / formFilter.pageSize);
|
||||
totalList.value = res.data.result.total;
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
|
||||
function fetchspecialByid(id: string) {
|
||||
showLoader();
|
||||
http
|
||||
.get(config.API.kpiAchievement("special") + `/${id}`)
|
||||
.then((res) => {
|
||||
const data = res.data.result;
|
||||
formDetail.including = data.including;
|
||||
formDetail.includingName = data.includingName;
|
||||
formDetail.target = data.target;
|
||||
formDetail.unit = data.unit;
|
||||
formDetail.achievement1 = data.achievement1;
|
||||
formDetail.achievement2 = data.achievement2;
|
||||
formDetail.achievement3 = data.achievement3;
|
||||
formDetail.achievement4 = data.achievement4;
|
||||
formDetail.achievement5 = data.achievement5;
|
||||
formDetail.weight = data.weight;
|
||||
formDetail.formula = data.formula;
|
||||
formDetail.meaning = data.meaning;
|
||||
formDetail.documentInfoEvidence = data.documentInfoEvidence;
|
||||
if (data.startDate && data.endDate) {
|
||||
formDetail.date = [];
|
||||
formDetail.date[0] = data.startDate;
|
||||
formDetail.date[1] = data.endDate;
|
||||
}
|
||||
})
|
||||
.catch((err) => {
|
||||
messageError($q, err);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
|
||||
function clickList(id: string, isData: boolean = false) {
|
||||
showLoader();
|
||||
const url = numpage.value === 1 ? config.API.kpiPlan : config.API.kpiRole;
|
||||
const url =
|
||||
numpage.value === 1
|
||||
? config.API.kpiPlan
|
||||
: numpage.value === 2
|
||||
? config.API.kpiRole
|
||||
: config.API.kpiSpecial;
|
||||
http
|
||||
.get(`${url}/${id}`)
|
||||
.then((res) => {
|
||||
|
|
@ -155,6 +276,11 @@ function clickList(id: string, isData: boolean = false) {
|
|||
formDetail.weight = data.weight;
|
||||
formDetail.meaning = data.meaning;
|
||||
formDetail.formula = data.formula;
|
||||
formDetail.achievement1 = data.achievement1;
|
||||
formDetail.achievement2 = data.achievement2;
|
||||
formDetail.achievement3 = data.achievement3;
|
||||
formDetail.achievement4 = data.achievement4;
|
||||
formDetail.achievement5 = data.achievement5;
|
||||
}
|
||||
formDetail.orgRevisionId = data.corgRevisionId;
|
||||
formDetail.id = data.id;
|
||||
|
|
@ -163,11 +289,6 @@ function clickList(id: string, isData: boolean = false) {
|
|||
formDetail.kpiPeriodId = data.kpiPeriodId;
|
||||
formDetail.includingName = data.includingName;
|
||||
formDetail.including = data.including;
|
||||
formDetail.achievement1 = data.achievement1;
|
||||
formDetail.achievement2 = data.achievement2;
|
||||
formDetail.achievement3 = data.achievement3;
|
||||
formDetail.achievement4 = data.achievement4;
|
||||
formDetail.achievement5 = data.achievement5;
|
||||
formDetail.node = data.node;
|
||||
formDetail.nodeId = data.nodeId;
|
||||
formDetail.nodeName = data.nodeName;
|
||||
|
|
@ -209,14 +330,25 @@ function closeDialog() {
|
|||
formDetail.nodeId = "";
|
||||
formDetail.strategy = "";
|
||||
formDetail.strategyId = "";
|
||||
formDetail.documentInfoEvidence = "";
|
||||
formDetail.date = null;
|
||||
|
||||
formFilter.isAll = false;
|
||||
formFilter.keyword = "";
|
||||
formFilter.node = 0;
|
||||
formFilter.nodeId = "";
|
||||
formFilter.period = "";
|
||||
formFilter.year = null;
|
||||
formFilter.page = 1;
|
||||
formFilter.pageSize = 20;
|
||||
}
|
||||
|
||||
function onSubmit() {
|
||||
if (!listCheckID.value) {
|
||||
if (!listCheckID.value && numpage.value !== 3) {
|
||||
dialogMessageNotify($q, "กรุณาเลือกตัวชี้วัด");
|
||||
} else {
|
||||
dialogConfirm($q, async () => {
|
||||
// showLoader();
|
||||
showLoader();
|
||||
|
||||
const formBody = {
|
||||
target: formDetail.target,
|
||||
|
|
@ -227,6 +359,23 @@ function onSubmit() {
|
|||
kpiUserEvaluationId: store.dataEvaluation.id,
|
||||
kpiPlanId: numpage.value === 1 ? listCheckID.value : undefined,
|
||||
kpiRoleId: numpage.value === 2 ? listCheckID.value : undefined,
|
||||
achievement1: formDetail.achievement1,
|
||||
achievement2: formDetail.achievement2,
|
||||
achievement3: formDetail.achievement3,
|
||||
achievement4: formDetail.achievement4,
|
||||
achievement5: formDetail.achievement5,
|
||||
documentInfoEvidence: formDetail.documentInfoEvidence,
|
||||
startDate: formDetail.date ? formDetail.date[0] : undefined,
|
||||
endDate: formDetail.date ? formDetail.date[1] : undefined,
|
||||
including: numpage.value === 3 ? formDetail.including : undefined,
|
||||
includingName:
|
||||
numpage.value === 3 ? formDetail.includingName : undefined,
|
||||
period:
|
||||
numpage.value === 3 ? store.dataEvaluation.durationKPI : undefined,
|
||||
year:
|
||||
numpage.value === 3
|
||||
? store.dataEvaluation.year.toString()
|
||||
: undefined,
|
||||
};
|
||||
try {
|
||||
const urlPlanned = isStatusEdit.value
|
||||
|
|
@ -237,68 +386,172 @@ function onSubmit() {
|
|||
? config.API.kpiAchievement("role") + `/${kpiUserPlannedId.value}`
|
||||
: config.API.kpiAchievement("role");
|
||||
|
||||
const url = numpage.value === 1 ? urlPlanned : urlRole;
|
||||
const urlSpecial = isStatusEdit.value
|
||||
? config.API.kpiAchievement("special") + `/${kpiUserPlannedId.value}`
|
||||
: config.API.kpiAchievement("special");
|
||||
|
||||
const url =
|
||||
numpage.value === 1
|
||||
? urlPlanned
|
||||
: numpage.value === 2
|
||||
? urlRole
|
||||
: urlSpecial;
|
||||
const method = isStatusEdit.value ? "put" : "post";
|
||||
await http[method](url, formBody);
|
||||
closeDialog();
|
||||
success($q, "บันทึกข้อมูลสำเร็จ");
|
||||
} catch (err) {
|
||||
messageError($q, err);
|
||||
} finally {
|
||||
hideLoader();
|
||||
closeDialog();
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function fetchNewList() {
|
||||
formFilter.page = 1;
|
||||
numpage.value === 1
|
||||
? fetchListPlan()
|
||||
: numpage.value === 2
|
||||
? fetchListRole()
|
||||
: fetchListSpecial();
|
||||
}
|
||||
watch(
|
||||
() => modal.value,
|
||||
() => {
|
||||
if (modal.value) {
|
||||
if (numpage.value === 1) {
|
||||
fetchIndicators();
|
||||
isStatusEdit.value && fetchIndicatorsByid(kpiUserPlannedId.value);
|
||||
fetchListPlan();
|
||||
isStatusEdit.value && fetchListPlanByid(kpiUserPlannedId.value);
|
||||
} else if (numpage.value === 2) {
|
||||
fetchListRole();
|
||||
isStatusEdit.value && fetchRoleByid(kpiUserPlannedId.value);
|
||||
} else if (numpage.value === 3) {
|
||||
fetchListSpecial();
|
||||
isStatusEdit.value && fetchspecialByid(kpiUserPlannedId.value);
|
||||
}
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
const title = computed(() => {
|
||||
let name = "";
|
||||
if (numpage.value === 1) {
|
||||
name = isStatusEdit.value
|
||||
? "แก้ไขตัวชี้วัดตามแผนปฏิบัติราชการประจําปี"
|
||||
: "เพิ่มตัวชี้วัดตามแผนปฏิบัติราชการประจําปี";
|
||||
} else if (numpage.value === 2) {
|
||||
name = isStatusEdit.value
|
||||
? "แก้ไขตัวชี้วัดตามหน้าที่ความรับผิดชอบ"
|
||||
: "เพิ่มตัวชี้วัดตามหน้าที่ความรับผิดชอบ";
|
||||
} else if (numpage.value === 3) {
|
||||
name = isStatusEdit.value
|
||||
? "แก้ไขตัวชี้วัดที่ได้รับมอบหมาย"
|
||||
: "เพิ่มตัวชี้วัดที่ได้รับมอบหมาย";
|
||||
}
|
||||
return name;
|
||||
});
|
||||
</script>
|
||||
<template>
|
||||
<q-dialog v-model="modal" persistent>
|
||||
<q-card class="col-12" style="width: 100%">
|
||||
<q-form greedy @submit.prevent @validation-success="onSubmit">
|
||||
<DialogHeader
|
||||
:tittle="
|
||||
numpage == 1
|
||||
? 'เพิ่มตัวชี้วัดตามแผนปฏิบัติราชการประจําปี'
|
||||
: 'เพิ่มตัวชี้วัดตามหน้าที่ความรับผิดชอบ'
|
||||
"
|
||||
:close="closeDialog"
|
||||
/>
|
||||
<DialogHeader :tittle="title" :close="closeDialog" />
|
||||
<q-separator />
|
||||
|
||||
<q-card-section class="q-pa-none scroll" style="max-height: 75vh">
|
||||
<div class="col-12 row">
|
||||
<div class="bg-grey-1 q-pa-md col-3 row lineRight">
|
||||
<div class="col-12 fit">
|
||||
<div class="col-12">
|
||||
<div class="row col-12" v-if="numpage !== 3">
|
||||
<q-checkbox
|
||||
v-model="formFilter.isAll"
|
||||
label="แสดงตัวชี้วัดภายใต้หน่วยงาน/ส่วนราชการทุกระดับ"
|
||||
@update:model-value="fetchNewList()"
|
||||
/>
|
||||
</div>
|
||||
<div class="row q-col-gutter-sm col-12">
|
||||
<div class="col-5">
|
||||
<datepicker
|
||||
menu-class-name="modalfix"
|
||||
v-model="formFilter.year"
|
||||
:locale="'th'"
|
||||
autoApply
|
||||
year-picker
|
||||
:enableTimePicker="false"
|
||||
@update:model-value="fetchNewList()"
|
||||
>
|
||||
<template #year="{ year }">{{ year + 543 }}</template>
|
||||
<template #year-overlay-value="{ value }">{{
|
||||
parseInt(value + 543)
|
||||
}}</template>
|
||||
<template #trigger>
|
||||
<q-input
|
||||
dense
|
||||
outlined
|
||||
:model-value="
|
||||
formFilter.year === null || formFilter.year === ''
|
||||
? null
|
||||
: Number(formFilter.year) + 543
|
||||
"
|
||||
:label="`${'ปีงบประมาณ'}`"
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon
|
||||
name="event"
|
||||
class="cursor-pointer"
|
||||
style="color: var(--q-primary)"
|
||||
>
|
||||
</q-icon>
|
||||
</template>
|
||||
<template v-slot:append>
|
||||
<q-icon
|
||||
v-if="formFilter.year"
|
||||
name="cancel"
|
||||
class="cursor-pointer"
|
||||
@click.stop.prevent="
|
||||
(formFilter.year = null), fetchNewList()
|
||||
"
|
||||
/>
|
||||
</template>
|
||||
</q-input>
|
||||
</template>
|
||||
</datepicker>
|
||||
</div>
|
||||
<div class="col-7">
|
||||
<q-select
|
||||
dense
|
||||
outlined
|
||||
v-model="formFilter.period"
|
||||
:options="roundOp"
|
||||
option-label="name"
|
||||
option-value="id"
|
||||
emit-value
|
||||
map-options
|
||||
input-class="text-red"
|
||||
label="รอบการประเมิน"
|
||||
clearable
|
||||
@update:model-value="fetchNewList()"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 q-mt-sm">
|
||||
<q-input
|
||||
v-model="search"
|
||||
v-model="formFilter.keyword"
|
||||
outlined
|
||||
dense
|
||||
label="ค้นหา"
|
||||
class="inputgreen"
|
||||
@keydown.enter.prevent="fetchNewList()"
|
||||
>
|
||||
<template v-slot:append>
|
||||
<q-icon v-if="search == ''" name="search" />
|
||||
<q-icon v-if="formFilter.keyword == ''" name="search" />
|
||||
<q-icon
|
||||
v-if="search !== ''"
|
||||
v-if="formFilter.keyword !== ''"
|
||||
name="clear"
|
||||
class="cursor-pointer"
|
||||
@click="search = ''"
|
||||
@click="(formFilter.keyword = ''), fetchNewList()"
|
||||
/>
|
||||
</template>
|
||||
</q-input>
|
||||
|
|
@ -335,6 +588,30 @@ watch(
|
|||
</q-item-section>
|
||||
</q-item>
|
||||
</q-list>
|
||||
<q-separator />
|
||||
<div
|
||||
class="q-pa-lg flex justify-end"
|
||||
v-if="totalList !== 0"
|
||||
>
|
||||
ทั้งหมด {{ totalList }} รายการ
|
||||
<q-pagination
|
||||
v-model="formFilter.page"
|
||||
active-color="primary"
|
||||
color="dark"
|
||||
:max="Number(maxPage)"
|
||||
size="sm"
|
||||
boundary-links
|
||||
direction-links
|
||||
:max-pages="5"
|
||||
@update:model-value="
|
||||
numpage === 1
|
||||
? fetchListPlan()
|
||||
: numpage === 2
|
||||
? fetchListRole()
|
||||
: fetchListSpecial()
|
||||
"
|
||||
></q-pagination>
|
||||
</div>
|
||||
</q-card-section>
|
||||
</q-card>
|
||||
</div>
|
||||
|
|
@ -350,7 +627,7 @@ watch(
|
|||
<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">
|
||||
<div class="col-12 row" v-if="numpage !== 3">
|
||||
<div class="col-4 text-grey-6">หน่วยงาน/ส่วนราชการ</div>
|
||||
<div class="col-8">{{ formDetail.nodeName }}</div>
|
||||
</div>
|
||||
|
|
@ -361,11 +638,43 @@ watch(
|
|||
|
||||
<div class="col-12 row">
|
||||
<div class="col-4 text-grey-6">ลำดับ/รหัสตัวชี้วัด</div>
|
||||
<div class="col-8">{{ formDetail.including }}</div>
|
||||
<div class="col-8">
|
||||
<q-input
|
||||
v-if="numpage === 3"
|
||||
outlined
|
||||
v-model="formDetail.including"
|
||||
bg-color="white"
|
||||
dense
|
||||
class="inputgreen"
|
||||
:rules="[
|
||||
(val) =>
|
||||
!!val || `${'กรุณากรอกลำดับ/รหัสตัวชี้วัด'}`,
|
||||
]"
|
||||
lazy-rules
|
||||
hide-bottom-space
|
||||
/>
|
||||
|
||||
<div v-else>{{ formDetail.including }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 row">
|
||||
<div class="col-4 text-grey-6">ชื่อตัวชี้วัด</div>
|
||||
<div class="col-8">{{ formDetail.includingName }}</div>
|
||||
<div class="col-8">
|
||||
<q-input
|
||||
v-if="numpage === 3"
|
||||
outlined
|
||||
v-model="formDetail.includingName"
|
||||
bg-color="white"
|
||||
dense
|
||||
class="inputgreen"
|
||||
:rules="[
|
||||
(val) => !!val || `${'กรุณากรอกชื่อตัวชี้วัด'}`,
|
||||
]"
|
||||
lazy-rules
|
||||
hide-bottom-space
|
||||
/>
|
||||
<div v-else>{{ formDetail.includingName }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 row">
|
||||
<div class="col-4 text-grey-6">ค่าเป้าหมาย</div>
|
||||
|
|
@ -380,6 +689,7 @@ watch(
|
|||
(val) => !!val || `${'กรุณากรอกค่าเป้าหมาย'}`,
|
||||
]"
|
||||
hide-bottom-space
|
||||
lazy-rules
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -395,6 +705,7 @@ watch(
|
|||
:rules="[
|
||||
(val) => !!val || `${'กรุณากรอกหน่วยนับ'}`,
|
||||
]"
|
||||
lazy-rules
|
||||
hide-bottom-space
|
||||
reverse-fill-mask
|
||||
/>
|
||||
|
|
@ -414,6 +725,7 @@ watch(
|
|||
!!val || `${'กรุณากรอกน้ำหนัก (ร้อยละ)'}`,
|
||||
]"
|
||||
hide-bottom-space
|
||||
lazy-rules
|
||||
mask="###"
|
||||
/>
|
||||
</div>
|
||||
|
|
@ -429,34 +741,84 @@ watch(
|
|||
<div class="col-6 text-center">ระดับคะแนน</div>
|
||||
<div class="col-6 text-center">ผลสำเร็จของงาน</div>
|
||||
</div>
|
||||
<div class="row col-12 items-center lineTop">
|
||||
<div
|
||||
class="row col-12 items-center lineTop q-col-gutter-sm"
|
||||
>
|
||||
<div class="col-6 text-center text-body2">5</div>
|
||||
<div class="col-6 text-center text-primary">
|
||||
{{ formDetail.achievement5 }}
|
||||
<div class="col-6">
|
||||
<q-input
|
||||
v-model="formDetail.achievement5"
|
||||
outlined
|
||||
dense
|
||||
:rules="[(val:string) => !!val || `${'กรุณากรอกผลสำเร็จของงาน'}`,]"
|
||||
hide-bottom-space
|
||||
class="inputgreen"
|
||||
lazy-rules
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row col-12 items-center lineTop">
|
||||
<div
|
||||
class="row col-12 items-center lineTop q-col-gutter-sm"
|
||||
>
|
||||
<div class="col-6 text-center text-body2">4</div>
|
||||
<div class="col-6 text-center text-primary">
|
||||
{{ formDetail.achievement4 }}
|
||||
<q-input
|
||||
v-model="formDetail.achievement4"
|
||||
outlined
|
||||
dense
|
||||
:rules="[(val:string) => !!val || `${'กรุณากรอกผลสำเร็จของงาน'}`,]"
|
||||
hide-bottom-space
|
||||
class="inputgreen"
|
||||
lazy-rules
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row col-12 items-center lineTop">
|
||||
<div
|
||||
class="row col-12 items-center lineTop q-col-gutter-sm"
|
||||
>
|
||||
<div class="col-6 text-center text-body2">3</div>
|
||||
<div class="col-6 text-center text-primary">
|
||||
{{ formDetail.achievement3 }}
|
||||
<q-input
|
||||
v-model="formDetail.achievement3"
|
||||
outlined
|
||||
dense
|
||||
:rules="[(val:string) => !!val || `${'กรุณากรอกผลสำเร็จของงาน'}`,]"
|
||||
hide-bottom-space
|
||||
class="inputgreen"
|
||||
lazy-rules
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row col-12 items-center lineTop">
|
||||
<div
|
||||
class="row col-12 items-center lineTop q-col-gutter-sm"
|
||||
>
|
||||
<div class="col-6 text-center text-body2">2</div>
|
||||
<div class="col-6 text-center text-primary">
|
||||
{{ formDetail.achievement2 }}
|
||||
<q-input
|
||||
v-model="formDetail.achievement2"
|
||||
outlined
|
||||
dense
|
||||
:rules="[(val:string) => !!val || `${'กรุณากรอกผลสำเร็จของงาน'}`,]"
|
||||
hide-bottom-space
|
||||
class="inputgreen"
|
||||
lazy-rules
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row col-12 items-center lineTop">
|
||||
<div
|
||||
class="row col-12 items-center lineTop q-col-gutter-sm"
|
||||
>
|
||||
<div class="col-6 text-center text-body2">1</div>
|
||||
<div class="col-6 text-center text-primary">
|
||||
{{ formDetail.achievement1 }}
|
||||
<q-input
|
||||
v-model="formDetail.achievement1"
|
||||
outlined
|
||||
dense
|
||||
:rules="[(val:string) => !!val || `${'กรุณากรอกผลสำเร็จของงาน'}`,]"
|
||||
hide-bottom-space
|
||||
class="inputgreen"
|
||||
lazy-rules
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -471,6 +833,7 @@ watch(
|
|||
:rules="[(val:string) => !!val || `${'กรุณากรอกตัวชี้วัด'}`,]"
|
||||
hide-bottom-space
|
||||
class="inputgreen"
|
||||
lazy-rules
|
||||
/>
|
||||
</div>
|
||||
|
||||
|
|
@ -484,6 +847,7 @@ watch(
|
|||
:rules="[(val:string) => !!val || `${'กรุณากรอกตัวชี้วัด'}`,]"
|
||||
hide-bottom-space
|
||||
class="inputgreen"
|
||||
lazy-rules
|
||||
/>
|
||||
</div>
|
||||
|
||||
|
|
@ -497,8 +861,57 @@ watch(
|
|||
:rules="[(val:string) => !!val || `${'กรุณากรอกข้อมูลเอกสารหลักฐาน'}`,]"
|
||||
hide-bottom-space
|
||||
class="inputgreen"
|
||||
lazy-rules
|
||||
/>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<datepicker
|
||||
v-model="formDetail.date"
|
||||
:locale="'th'"
|
||||
autoApply
|
||||
:enableTimePicker="false"
|
||||
week-start="0"
|
||||
range
|
||||
>
|
||||
<template #year="{ year }">{{ year + 543 }}</template>
|
||||
<template #year-overlay-value="{ value }">{{
|
||||
parseInt(value + 543)
|
||||
}}</template>
|
||||
<template #trigger>
|
||||
<q-input
|
||||
dense
|
||||
outlined
|
||||
class="inputgreen"
|
||||
:model-value="
|
||||
formDetail.date
|
||||
? `${date2Thai(formDetail.date[0])} - ${date2Thai(
|
||||
formDetail.date[1]
|
||||
)}`
|
||||
: null
|
||||
"
|
||||
:label="`${'ช่วงเวลาเริ่มต้น-สิ้นสุด'}`"
|
||||
hide-bottom-space
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon
|
||||
name="event"
|
||||
class="cursor-pointer"
|
||||
style="color: var(--q-primary)"
|
||||
>
|
||||
</q-icon>
|
||||
</template>
|
||||
<template v-slot:append>
|
||||
<q-icon
|
||||
v-if="formDetail.date !== null"
|
||||
name="cancel"
|
||||
class="cursor-pointer"
|
||||
@click="formDetail.date = null"
|
||||
/>
|
||||
</template>
|
||||
</q-input>
|
||||
</template>
|
||||
</datepicker>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -171,8 +171,26 @@ function onSubmit() {
|
|||
<q-tr :props="props" class="cursor-pointer">
|
||||
<q-td v-for="col in props.cols" :key="col.id">
|
||||
<div v-if="col.name === 'point'">
|
||||
<div v-if="type == 'HEAD' || type == 'GROUP'">
|
||||
<q-rating
|
||||
<div>
|
||||
<q-btn-group outline>
|
||||
<q-btn
|
||||
v-for="(i, index) in sortedDataListCriteria"
|
||||
:key="index"
|
||||
:class="props.row.point == i.level && 'active'"
|
||||
outline
|
||||
color="grey-6"
|
||||
:label="i.level"
|
||||
@click="props.row.point = i.level"
|
||||
>
|
||||
<q-tooltip>
|
||||
<div class="text-body2">
|
||||
<span v-html="i.description"></span>
|
||||
</div>
|
||||
</q-tooltip>
|
||||
</q-btn>
|
||||
</q-btn-group>
|
||||
|
||||
<!-- <q-rating
|
||||
v-model="props.row.point"
|
||||
max="5"
|
||||
size="sm"
|
||||
|
|
@ -191,9 +209,8 @@ function onSubmit() {
|
|||
</div>
|
||||
</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-rating> -->
|
||||
</div>
|
||||
<div v-else>รอ ทำ select</div>
|
||||
</div>
|
||||
<div v-else-if="col.name === 'summary'">
|
||||
{{ props.row.point !== 0 ? props.row.point * 20 : "-" }}
|
||||
|
|
@ -260,4 +277,14 @@ function onSubmit() {
|
|||
top: 0;
|
||||
}
|
||||
}
|
||||
.q-btn-group--outline > .q-btn-item:not(:last-child):before {
|
||||
border-right: 1px solid #c4c4c4;
|
||||
}
|
||||
.q-btn-group--outline > .q-btn-item.active {
|
||||
color: #2196f3 !important;
|
||||
background-color: #fff;
|
||||
}
|
||||
.q-btn-group--outline > .q-btn-item.active:not(:last-child):before {
|
||||
border: 1px solid #2196f3;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -11,7 +11,9 @@ import File from "@/modules/08_KPI/components/Tab/05_File.vue";
|
|||
|
||||
const store = useKpiDataStore();
|
||||
const route = useRoute();
|
||||
const isReadonly = ref<boolean>(route.name === "KPIEditEvaluator" ? true : false);
|
||||
const isReadonly = ref<boolean>(
|
||||
route.name === "KPIEditEvaluator" ? true : false
|
||||
);
|
||||
const step = ref<number>(1); // 1 = จัดทำข้อตกลง, 2 = รายงานความก้าวหน้า, 3 = รายงานผลสำเร็จของงาน
|
||||
const indicatorScore = defineModel("indicatorScore", {
|
||||
type: Number,
|
||||
|
|
@ -69,8 +71,16 @@ const splitterModel = ref<number>(12);
|
|||
:label="tab.label"
|
||||
/> -->
|
||||
<q-tab name="1" label="จัดทำข้อตกลง" />
|
||||
<q-tab name="2" label="รายงานความก้าวหน้า" :disable="step < 2" />
|
||||
<q-tab name="3" label="รายงานผลสำเร็จของงาน" :disable="step < 3" />
|
||||
<q-tab
|
||||
name="2"
|
||||
label="รายงานความก้าวหน้า"
|
||||
:disable="store.tabOpen < 2"
|
||||
/>
|
||||
<q-tab
|
||||
name="3"
|
||||
label="รายงานผลสำเร็จของงาน"
|
||||
:disable="store.tabOpen < 3"
|
||||
/>
|
||||
<!-- <q-tab name="3" label="ผู้บังคับบัญชา">
|
||||
<div class="text-caption">เหนือขึ้นไป</div>
|
||||
</q-tab>
|
||||
|
|
@ -101,9 +111,9 @@ const splitterModel = ref<number>(12);
|
|||
v-model:indicatorScore="indicatorScore"
|
||||
v-model:competencyScore="competencyScore"
|
||||
/>
|
||||
<Evaluator v-if="store.tabMain === '2'" :type="'evaluator'" />
|
||||
<Evaluator v-if="store.tabMain === '3'" :type="'commander'" />
|
||||
<Evaluator v-if="store.tabMain === '4'" :type="'commanderHigh'" />
|
||||
<Assessment v-if="store.tabMain === '2'" :type="'evaluator'" />
|
||||
<Assessment v-if="store.tabMain === '3'" :type="'commander'" />
|
||||
<Assessment v-if="store.tabMain === '4'" :type="'commanderHigh'" />
|
||||
<File v-if="store.tabMain === '5'" />
|
||||
</q-tab-panel>
|
||||
</q-tab-panels>
|
||||
|
|
|
|||
|
|
@ -123,11 +123,11 @@ const modalEvaluate = ref<boolean>(false);
|
|||
function onAdd(edit: boolean = false, id: string = "") {
|
||||
isStatusEdit.value = edit;
|
||||
kpiUserPlannedId.value = id;
|
||||
if (numpage.value !== 3) {
|
||||
// if (numpage.value !== 3) {
|
||||
modal.value = true;
|
||||
} else if (numpage.value == 3) {
|
||||
modalAssigned.value = true;
|
||||
}
|
||||
// } else if (numpage.value == 3) {
|
||||
// modalAssigned.value = true;
|
||||
// }
|
||||
}
|
||||
|
||||
function onEvaluate() {
|
||||
|
|
@ -166,23 +166,23 @@ watch(
|
|||
}
|
||||
);
|
||||
|
||||
watch(
|
||||
() => modalAssigned.value,
|
||||
() => {
|
||||
if (!modalAssigned.value) {
|
||||
props.fetchList?.();
|
||||
}
|
||||
}
|
||||
);
|
||||
// watch(
|
||||
// () => modalAssigned.value,
|
||||
// () => {
|
||||
// if (!modalAssigned.value) {
|
||||
// props.fetchList?.();
|
||||
// }
|
||||
// }
|
||||
// );
|
||||
|
||||
watch(
|
||||
() => modalEvaluate.value,
|
||||
() => {
|
||||
if (!modalEvaluate.value) {
|
||||
props.fetchList?.();
|
||||
}
|
||||
}
|
||||
);
|
||||
// watch(
|
||||
// () => modalEvaluate.value,
|
||||
// () => {
|
||||
// if (!modalEvaluate.value) {
|
||||
// props.fetchList?.();
|
||||
// }
|
||||
// }
|
||||
// );
|
||||
</script>
|
||||
<template>
|
||||
<q-card bordered style="border-radius: 5px" class="no-shadow">
|
||||
|
|
@ -338,18 +338,19 @@ watch(
|
|||
:isStatusEdit="isStatusEdit"
|
||||
:kpiUserPlannedId="kpiUserPlannedId"
|
||||
/>
|
||||
<Dialog03
|
||||
|
||||
<!-- <Dialog03
|
||||
v-model:modal="modalAssigned"
|
||||
:numpage="numpage"
|
||||
:isStatusEdit="isStatusEdit"
|
||||
:kpiUserPlannedId="kpiUserPlannedId"
|
||||
/>
|
||||
/> -->
|
||||
|
||||
<DialogEvaluate
|
||||
<!-- <DialogEvaluate
|
||||
v-model:modal="modalEvaluate"
|
||||
:data="rows"
|
||||
:numpage="numpage"
|
||||
/>
|
||||
/> -->
|
||||
</template>
|
||||
<style scoped>
|
||||
.custom-table2 {
|
||||
|
|
|
|||
|
|
@ -107,6 +107,12 @@ const columns = ref<QTableProps["columns"]>([
|
|||
},
|
||||
]);
|
||||
|
||||
const visibleColumns = ref<string[]>(
|
||||
store.tabOpen === 3
|
||||
? ["name", "level", "point", "weight", "summary"]
|
||||
: ["name", "level", "weight"]
|
||||
);
|
||||
|
||||
const typeCompetency = ref<string>("");
|
||||
function onAdd(type: string) {
|
||||
typeCompetency.value = type;
|
||||
|
|
@ -239,7 +245,7 @@ onMounted(() => {
|
|||
</div>
|
||||
|
||||
<q-space />
|
||||
<!-- <q-btn
|
||||
<q-btn
|
||||
v-if="!isReadonly"
|
||||
flat
|
||||
round
|
||||
|
|
@ -250,7 +256,7 @@ onMounted(() => {
|
|||
@click="onEvaluate(item.id)"
|
||||
>
|
||||
<q-tooltip>ประเมิน</q-tooltip>
|
||||
</q-btn> -->
|
||||
</q-btn>
|
||||
</div>
|
||||
</q-card-section>
|
||||
<q-card-section class="q-pa-sm">
|
||||
|
|
@ -266,6 +272,7 @@ onMounted(() => {
|
|||
hide-pagination
|
||||
class="custom-table2"
|
||||
no-data-label="ไม่มีข้อมูล"
|
||||
:visible-columns="visibleColumns"
|
||||
>
|
||||
<template v-slot:header="props">
|
||||
<q-tr :props="props">
|
||||
|
|
@ -283,7 +290,23 @@ onMounted(() => {
|
|||
</div>
|
||||
<div v-else-if="col.name == 'point'">
|
||||
<div>
|
||||
<q-rating
|
||||
<q-btn-group outline>
|
||||
<q-btn
|
||||
v-for="(i, index) in sortedDataListCriteria"
|
||||
:key="index"
|
||||
:class="props.row.point == i.level && 'active'"
|
||||
outline
|
||||
color="grey-6"
|
||||
:label="i.level"
|
||||
>
|
||||
<q-tooltip>
|
||||
<div class="text-body2">
|
||||
<span v-html="i.description"></span>
|
||||
</div>
|
||||
</q-tooltip>
|
||||
</q-btn>
|
||||
</q-btn-group>
|
||||
<!-- <q-rating
|
||||
v-model="props.row.point"
|
||||
max="5"
|
||||
size="sm"
|
||||
|
|
@ -303,7 +326,7 @@ onMounted(() => {
|
|||
</div>
|
||||
</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</q-rating> -->
|
||||
</div>
|
||||
<!-- <div v-else>รอ ทำ select</div> -->
|
||||
</div>
|
||||
|
|
@ -402,4 +425,14 @@ onMounted(() => {
|
|||
top: 0;
|
||||
}
|
||||
}
|
||||
.q-btn-group--outline > .q-btn-item:not(:last-child):before {
|
||||
border-right: 1px solid #c4c4c4;
|
||||
}
|
||||
.q-btn-group--outline > .q-btn-item.active {
|
||||
color: #2196f3 !important;
|
||||
background-color: #fff;
|
||||
}
|
||||
.q-btn-group--outline > .q-btn-item.active:not(:last-child):before {
|
||||
border: 1px solid #2196f3;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -4,8 +4,45 @@ import type { DataOptions } from "./interface/index/Main";
|
|||
|
||||
export const useKpiDataStore = defineStore("KPIDate", () => {
|
||||
const tabMain = ref<string>("1");
|
||||
const dataProfile = ref<any>(null);
|
||||
const dataProfile = ref<any>({
|
||||
profileId: null,
|
||||
prefix: "",
|
||||
rank: "",
|
||||
firstName: "",
|
||||
lastName: "",
|
||||
citizenId: "",
|
||||
position: "",
|
||||
posMaster: null,
|
||||
posLevelName: null,
|
||||
posLevelRank: null,
|
||||
posLevelId: null,
|
||||
posTypeName: null,
|
||||
posTypeRank: null,
|
||||
posTypeId: null,
|
||||
posExecutiveName: "",
|
||||
posExecutivePriority: null,
|
||||
posExecutiveId: null,
|
||||
rootId: null,
|
||||
root: "",
|
||||
child1Id: null,
|
||||
child1: null,
|
||||
child2Id: null,
|
||||
child2: null,
|
||||
child3Id: null,
|
||||
child3: null,
|
||||
child4Id: null,
|
||||
child4: null,
|
||||
node: null,
|
||||
nodeId: null,
|
||||
});
|
||||
|
||||
const dataEvaluation = ref<any>({
|
||||
evaluationReqEdit: "NEW",
|
||||
evaluationStatus: "NEW",
|
||||
profileId: null,
|
||||
evaluatorId: null,
|
||||
commanderId: null,
|
||||
commanderHighId: null,
|
||||
plannedPoint: 0,
|
||||
rolePoint: 0,
|
||||
specialPoint: 0,
|
||||
|
|
@ -43,12 +80,26 @@ export const useKpiDataStore = defineStore("KPIDate", () => {
|
|||
|
||||
function convertStatus(val: string) {
|
||||
switch (val) {
|
||||
case "PENDING":
|
||||
return "รอดำเนินการ";
|
||||
case "INPROGRESS":
|
||||
return "กําลังดำเนินการ";
|
||||
case "DONE":
|
||||
return "ประเมินเสร็จสิ้น";
|
||||
case "NEW":
|
||||
return "จัดทำข้อตกลง";
|
||||
case "NEW_EVALUATOR":
|
||||
return "รอผู้ประเมินตรวจสอบข้อตกลง";
|
||||
case "NEW_COMMANDER":
|
||||
return "รอผู้บังคับบัญชาเหนือขึ้นไปตรวจสอบข้อตกลง";
|
||||
case "NEW_COMMANDER_HIGH":
|
||||
return "รอผู้บังคับบัญชาเหนือขึ้นไปอีกชั้นหนึ่งตรวจสอบข้อตกลง";
|
||||
case "APPROVE":
|
||||
return "รายงานความก้าวหน้า";
|
||||
case "EVALUATING":
|
||||
return "รายงานผลสำเร็จของงาน";
|
||||
case "EVALUATING_EVALUATOR":
|
||||
return "รอผู้ประเมินตรวจสอบผล";
|
||||
case "EVALUATING_COMMANDER":
|
||||
return "รอผู้บังคับบัญชาเหนือขึ้นไปตรวจสอบผล";
|
||||
case "EVALUATING_COMMANDER_HIGH":
|
||||
return "รอผู้บังคับบัญชาเหนือขึ้นไปอีกชั้นหนึ่งตรวจสอบผล";
|
||||
case "COMPLETE":
|
||||
return "เสร็จสิ้น";
|
||||
default:
|
||||
break;
|
||||
}
|
||||
|
|
@ -182,6 +233,60 @@ export const useKpiDataStore = defineStore("KPIDate", () => {
|
|||
"blue-10",
|
||||
]);
|
||||
|
||||
// ROLE & TAB
|
||||
const rolePerson = ref<string>("USER"); //"USER" | "EVALUATOR" | "COMMANDER", "COMMANDERHIGH"
|
||||
const tabOpen = ref<number>(1);
|
||||
function checkStep() {
|
||||
const role =
|
||||
dataEvaluation.value.profileId == dataProfile.value.profileId
|
||||
? "USER"
|
||||
: dataEvaluation.value.evaluatorId == dataProfile.value.profileId
|
||||
? "EVALUATOR"
|
||||
: dataEvaluation.value.commanderId == dataProfile.value.profileId
|
||||
? "COMMANDER"
|
||||
: dataEvaluation.value.commanderHighId == dataProfile.value.profileId
|
||||
? "COMMANDERHIGH"
|
||||
: "";
|
||||
rolePerson.value = role;
|
||||
|
||||
switch (dataEvaluation.value.evaluationStatus) {
|
||||
case "NEW" || "NEW_EVALUATOR" || "NEW_COMMANDER" || "NEW_COMMANDER_HIGH":
|
||||
tabOpen.value = 1;
|
||||
break;
|
||||
case "APPROVE":
|
||||
tabOpen.value = 2;
|
||||
break;
|
||||
default:
|
||||
tabOpen.value = 3;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
// SUMMARY GENERAL CASE
|
||||
const indicatorPercent = ref<number>(100); // รวมผลการประเมิน (ร้อยละ)
|
||||
const indicatorPercentVal = ref<number>(0); // รวมผลการประเมิน (ร้อยละ) ที่ได้จริง
|
||||
const indicatorScore = ref<number>(80); // สรุปผลการประเมินผลสัมฤทธิ์ของงาน ( คะแนนเต็ม indicatorScore คะแนน)
|
||||
const indicatorScoreVal = ref<number>(0); // สรุปผลการประเมินผลสัมฤทธิ์ของงานที่ได้
|
||||
const competencyScore = ref<number>(20); // ผลการประเมินสมรรถนะ (competencyScore คะแนน)
|
||||
const competencyScoreVal = ref<number>(0); // ผลการประเมินสมรรถนะที่ได้กี่คะแนน
|
||||
const devScore = ref<number>(10); // ผลการประเมินการพัฒนาตนเอง (devScore คะแนน)
|
||||
const devScoreVal = ref<number>(0); // ผลการประเมินการพัฒนาตนเองที่ได้กี่คะแนน
|
||||
const competencyDevScore = ref<number>(30); // สรุปผลการประเมินพฤติกรรมการปฏิบัติราชการ (สมรรถนะ+การพัฒนาตนเอง) (คะแนนเต็ม competencyDevScore คะแนน)
|
||||
const competencyDevScoreVal = ref<number>(0); // สรุปผลการประเมินพฤติกรรมการปฏิบัติราชการ (สมรรถนะ+การพัฒนาตนเอง)ที่ได้กี่คะแนน
|
||||
|
||||
// SUMMARY EXCLUSIVE CASE
|
||||
const excusiveIndicatorPercent = ref<number>(100); // รวมผลการประเมิน (ร้อยละ) แต่ละมิติต้องไม่เกิน 100%
|
||||
const excusiveIndicator1PercentVal = ref<number>(0); // รวมผลการประเมิน (ร้อยละ) มิติที่ 1 ที่ได้จริง
|
||||
const excusiveIndicator1Weight = ref<number>(60); // น้ำหนักของมิติที่ 1
|
||||
const excusiveIndicator1ScoreVal = ref<number>(0); // คะแนนมิติที่ 1 ที่ได้จริง
|
||||
const excusiveIndicator2Weight = ref<number>(20); // น้ำหนักของมิติที่ 2
|
||||
const excusiveIndicator2PercentVal = ref<number>(0); // รวมผลการประเมิน (ร้อยละ) มิติที่ 2 ที่ได้จริง
|
||||
const excusiveIndicator2ScoreVal = ref<number>(0); // คะแนนมิติที่ 2 ที่ได้จริง
|
||||
const excusiveIndicatorScore = ref<number>(80); // สรุปผลการประเมินผลสัมฤทธิ์ของงาน (มิติที่ 1 + มิติที่ 2) ( คะแนนเต็ม excusiveIndicatorScore คะแนน)
|
||||
const excusiveIndicatorScoreVal = ref<number>(0); // สรุปผลการประเมินผลสัมฤทธิ์ของงาน (มิติที่ 1 + มิติที่ 2) คะแนนที่ได้จริง
|
||||
const excusiveCompetencyScore = ref<number>(20); // ผลการประเมินสมรรถนะ (competencyScore คะแนน)
|
||||
const excusiveCompetencyScoreVal = ref<number>(0); // ผลการประเมินสมรรถนะที่ได้กี่คะแนน
|
||||
|
||||
return {
|
||||
tabMain,
|
||||
dataProfile,
|
||||
|
|
@ -195,5 +300,31 @@ export const useKpiDataStore = defineStore("KPIDate", () => {
|
|||
defaultCompetencyCoreLevel,
|
||||
defaultCompetencyGroupLevel,
|
||||
ratingColors,
|
||||
checkStep,
|
||||
tabOpen,
|
||||
rolePerson,
|
||||
|
||||
// score
|
||||
indicatorPercent,
|
||||
indicatorPercentVal,
|
||||
indicatorScore,
|
||||
indicatorScoreVal,
|
||||
competencyScore,
|
||||
competencyScoreVal,
|
||||
devScore,
|
||||
devScoreVal,
|
||||
competencyDevScore,
|
||||
competencyDevScoreVal,
|
||||
excusiveCompetencyScore,
|
||||
excusiveCompetencyScoreVal,
|
||||
excusiveIndicatorPercent,
|
||||
excusiveIndicator1PercentVal,
|
||||
excusiveIndicator1Weight,
|
||||
excusiveIndicator1ScoreVal,
|
||||
excusiveIndicator2Weight,
|
||||
excusiveIndicator2PercentVal,
|
||||
excusiveIndicator2ScoreVal,
|
||||
excusiveIndicatorScore,
|
||||
excusiveIndicatorScoreVal,
|
||||
};
|
||||
});
|
||||
|
|
|
|||
|
|
@ -70,6 +70,7 @@ function fetchEvaluation() {
|
|||
.get(config.API.kpiEvaluation + `/${id.value}`)
|
||||
.then((res) => {
|
||||
const data = res.data.result;
|
||||
|
||||
store.dataEvaluation = data;
|
||||
formProfile.status = store.convertStatus(data.evaluationStatus);
|
||||
formProfile.result = store.convertResults(data.evaluationResults);
|
||||
|
|
@ -94,9 +95,11 @@ function getProfile() {
|
|||
.get(config.API.profilePosition())
|
||||
.then((res) => {
|
||||
const data = res.data.result;
|
||||
|
||||
store.dataProfile = data;
|
||||
store.checkCompetency();
|
||||
store.checkCompetencyDefaultCompetencyLevel();
|
||||
store.checkStep();
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
|
|
@ -281,10 +284,72 @@ async function clearScore() {
|
|||
|
||||
async function getAll() {
|
||||
await fetchEvaluation();
|
||||
await (store.dataProfile === null ? getProfile() : "");
|
||||
await (store.dataProfile.profileId === null ? getProfile() : ""); // await getProfile();
|
||||
await getOrgOp();
|
||||
}
|
||||
|
||||
function sendToEvaluatore() {
|
||||
dialogConfirm(
|
||||
$q,
|
||||
() => {
|
||||
if (id.value) {
|
||||
// showLoader();
|
||||
// http
|
||||
// .put(config.API.kpiEvaluationCheck + `/${id.value}`, {
|
||||
// evaluatorId: evaluatorId.value ? evaluatorId.value.id : null,
|
||||
// commanderId: commanderId.value ? commanderId.value.id : null,
|
||||
// commanderHighId: commanderHighId.value
|
||||
// ? commanderHighId.value.id
|
||||
// : null,
|
||||
// })
|
||||
// .then((res) => {
|
||||
// success($q, "บันทึกสำเร็จ");
|
||||
// close();
|
||||
// })
|
||||
// .catch((e) => {
|
||||
// messageError($q, e);
|
||||
// })
|
||||
// .finally(() => {
|
||||
// hideLoader();
|
||||
// });
|
||||
}
|
||||
},
|
||||
"ยืนยันการส่งข้อตกลงให้ผู้ประเมินอนุมัติ",
|
||||
"ต้องการยืนยันส่งข้อตกลงนี้ให้ผู้ประเมินอนุมัติใช่หรือไม่?"
|
||||
);
|
||||
}
|
||||
|
||||
function requireEdit() {
|
||||
dialogConfirm(
|
||||
$q,
|
||||
() => {
|
||||
if (id.value) {
|
||||
// showLoader();
|
||||
// http
|
||||
// .put(config.API.kpiEvaluationCheck + `/${id.value}`, {
|
||||
// evaluatorId: evaluatorId.value ? evaluatorId.value.id : null,
|
||||
// commanderId: commanderId.value ? commanderId.value.id : null,
|
||||
// commanderHighId: commanderHighId.value
|
||||
// ? commanderHighId.value.id
|
||||
// : null,
|
||||
// })
|
||||
// .then((res) => {
|
||||
// success($q, "บันทึกสำเร็จ");
|
||||
// close();
|
||||
// })
|
||||
// .catch((e) => {
|
||||
// messageError($q, e);
|
||||
// })
|
||||
// .finally(() => {
|
||||
// hideLoader();
|
||||
// });
|
||||
}
|
||||
},
|
||||
"ยืนยันการขอแก้ไขข้อตกลง",
|
||||
"ต้องการยืนยันการขอแก้ไขข้อตกลงนี้ใช่หรือไม่?"
|
||||
);
|
||||
}
|
||||
|
||||
onMounted(async () => {
|
||||
showLoader();
|
||||
await getAll();
|
||||
|
|
@ -292,6 +357,8 @@ onMounted(async () => {
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<!-- evaluationStatus={{ store.dataEvaluation.evaluationStatus }} | tabOpen =
|
||||
{{ store.tabOpen }} | rolePerson = {{ store.rolePerson }} | -->
|
||||
<div class="col-12 row justify-center">
|
||||
<div class="col-xs-12 col-sm-12 col-md-11">
|
||||
<div class="toptitle text-white col-12 row items-center">
|
||||
|
|
@ -335,6 +402,42 @@ onMounted(async () => {
|
|||
}}</span>
|
||||
<q-space />
|
||||
<div class="q-gutter-x-sm">
|
||||
<q-btn
|
||||
v-if="
|
||||
store.rolePerson == 'USER' &&
|
||||
store.dataEvaluation.evaluationStatus == 'NEW'
|
||||
"
|
||||
:disabled="store.dataEvaluation.evaluatorId == null"
|
||||
unelevated
|
||||
round
|
||||
icon="mdi-send"
|
||||
color="grey-2"
|
||||
text-color="blue-6"
|
||||
size="md"
|
||||
@click="sendToEvaluatore()"
|
||||
>
|
||||
<q-tooltip>ส่งให้ผู้ประเมินอนุมัติ</q-tooltip>
|
||||
</q-btn>
|
||||
<q-btn
|
||||
v-if="
|
||||
store.rolePerson == 'USER' &&
|
||||
store.tabOpen < 3 &&
|
||||
store.dataEvaluation.evaluationStatus != 'NEW' &&
|
||||
(store.dataEvaluation.evaluationReqEdit == null ||
|
||||
store.dataEvaluation.evaluationReqEdit == 'DONE')
|
||||
"
|
||||
:disabled="store.dataEvaluation.evaluatorId == null"
|
||||
unelevated
|
||||
round
|
||||
icon="mdi-file-edit"
|
||||
color="grey-2"
|
||||
text-color="red-6"
|
||||
size="md"
|
||||
@click="requireEdit()"
|
||||
>
|
||||
<q-tooltip>ขอแก้ไขข้อตกลง</q-tooltip>
|
||||
</q-btn>
|
||||
|
||||
<!-- <q-btn
|
||||
v-if="!isReadonly"
|
||||
unelevated
|
||||
|
|
@ -537,7 +640,7 @@ onMounted(async () => {
|
|||
</q-card>
|
||||
</q-dialog>
|
||||
|
||||
<q-dialog v-model="modalScore" persistent>
|
||||
<!-- <q-dialog v-model="modalScore" persistent>
|
||||
<q-card bordered style="width: 50vh">
|
||||
<q-form greedy @submit.prevent @validation-success="onSubmitScore">
|
||||
<DialogHeader tittle="แก้ไขคะแนนเต็ม" :close="clearScore" />
|
||||
|
|
@ -612,7 +715,7 @@ onMounted(async () => {
|
|||
</q-card-actions>
|
||||
</q-form>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
</q-dialog> -->
|
||||
</template>
|
||||
<style>
|
||||
.bg-toolbar {
|
||||
|
|
|
|||
|
|
@ -31,7 +31,7 @@ const visibleColumns = ref<string[]>([
|
|||
"name",
|
||||
"createdAt",
|
||||
"evaluationStatus",
|
||||
"evaluationStatus",
|
||||
"evaluationResults",
|
||||
]);
|
||||
const columns = ref<QTableProps["columns"]>([
|
||||
{
|
||||
|
|
@ -65,16 +65,16 @@ const columns = ref<QTableProps["columns"]>([
|
|||
field: "evaluationStatus",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
format: (v) => store.convertResults(v),
|
||||
format: (v) => store.convertStatus(v),
|
||||
sort: (a: string, b: string) =>
|
||||
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
|
||||
},
|
||||
{
|
||||
name: "evaluationStatus",
|
||||
name: "evaluationResults",
|
||||
align: "left",
|
||||
label: "ผลการประเมิน",
|
||||
sortable: true,
|
||||
field: "evaluationStatus",
|
||||
field: "evaluationResults",
|
||||
headerStyle: "font-size: 14px",
|
||||
style: "font-size: 14px",
|
||||
format: (v) => store.convertResults(v),
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue