Merge branch 'develop' into devTee
This commit is contained in:
STW_TTTY\stwtt
commit
0454dbabad
3 changed files with 102 additions and 19 deletions
|
|
@ -118,12 +118,12 @@ onMounted(() => {
|
|||
:fetchList="fetchAssigned"
|
||||
/>
|
||||
<div class="row text-body2 text-weight-bold">
|
||||
<div class="col-6 text-center row justify-center">
|
||||
<!-- <div class="col-6 text-center row justify-center">
|
||||
<span>รวมผลการประเมิน (ร้อยละ) 100</span>
|
||||
<div class="text-primary q-pl-md">{{ total }}</div>
|
||||
</div>
|
||||
</div> -->
|
||||
|
||||
<div class="col-6 text-center row justify-center">
|
||||
<div class="col-12 text-center row justify-center">
|
||||
<span>สรุปผลการประเมินผลสัมฤทธิ์ของงาน (คะแนนเต็ม 70 คะแนน)</span>
|
||||
<div class="text-primary q-pl-md">{{ resultWork }}</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,16 +1,28 @@
|
|||
<script setup lang="ts">
|
||||
import { ref } from "vue";
|
||||
import { ref, watch } from "vue";
|
||||
import { useQuasar } from "quasar";
|
||||
|
||||
import DialogHeader from "@/components/DialogHeader.vue";
|
||||
|
||||
import { useKpiDataStore } from "@/modules/08_KPI/store";
|
||||
|
||||
import type { QTableProps } from "quasar";
|
||||
|
||||
import { useKpiDataStore } from "@/modules/08_KPI/store";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
|
||||
const $q = useQuasar();
|
||||
const store = useKpiDataStore();
|
||||
const {
|
||||
showLoader,
|
||||
hideLoader,
|
||||
messageError,
|
||||
dialogConfirm,
|
||||
dialogMessageNotify,
|
||||
success,
|
||||
} = useCounterMixin();
|
||||
|
||||
const modal = defineModel<boolean>("modal", { required: true });
|
||||
const rows = defineModel<any>("data", { required: true });
|
||||
const numpage = defineModel<number>("numpage", { required: true });
|
||||
|
||||
/** table*/
|
||||
const columns = ref<QTableProps["columns"]>([
|
||||
|
|
@ -90,18 +102,44 @@ const visibleColumns = ref<string[]>([
|
|||
"evaluationResults",
|
||||
]);
|
||||
|
||||
const answer3 = ref<number>(0);
|
||||
|
||||
function closeDialog() {
|
||||
modal.value = false;
|
||||
}
|
||||
|
||||
function updateAchievement(index: number, data: any) {
|
||||
switch (data.point) {
|
||||
case 1:
|
||||
rows.value[index].achievement = data.achievement1;
|
||||
break;
|
||||
case 2:
|
||||
rows.value[index].achievement = data.achievement2;
|
||||
break;
|
||||
case 3:
|
||||
rows.value[index].achievement = data.achievement3;
|
||||
break;
|
||||
case 4:
|
||||
rows.value[index].achievement = data.achievement4;
|
||||
break;
|
||||
case 5:
|
||||
rows.value[index].achievement = data.achievement5;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
function onSubmit() {
|
||||
dialogConfirm($q, () => {
|
||||
closeDialog();
|
||||
});
|
||||
console.log(rows.value);
|
||||
}
|
||||
</script>
|
||||
<template>
|
||||
<q-dialog v-model="modal" persistent>
|
||||
<q-card style="width: 1200px; max-width: 80vw">
|
||||
<DialogHeader :tittle="'ประเมิน'" :close="closeDialog" />
|
||||
|
||||
<q-separator />
|
||||
<q-card-section class="q-pt-none">
|
||||
<q-card-section>
|
||||
<div class="col-12 q-pa-sm">
|
||||
<q-table
|
||||
ref="table"
|
||||
|
|
@ -122,7 +160,6 @@ function closeDialog() {
|
|||
<q-th v-for="col in props.cols" :key="col.name" :props="props">
|
||||
<span class="text-weight-medium">{{ col.label }}</span>
|
||||
</q-th>
|
||||
<q-th auto-width />
|
||||
</q-tr>
|
||||
</template>
|
||||
<template v-slot:body="props">
|
||||
|
|
@ -136,24 +173,33 @@ function closeDialog() {
|
|||
color="grey"
|
||||
:color-selected="store.ratingColors"
|
||||
label="ระดับการประเมินพฤติกรรม"
|
||||
@update:model-value="
|
||||
updateAchievement(props.rowIndex, props.row)
|
||||
"
|
||||
>
|
||||
<template v-slot:tip-1>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังมาก (1)</q-tooltip>
|
||||
<q-tooltip>{{ props.row.achievement1 }}</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-2>
|
||||
<q-tooltip>ต่ำกว่าความคาดหวังค่อนข้างมาก (2)</q-tooltip>
|
||||
<q-tooltip>{{ props.row.achievement2 }}</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-3>
|
||||
<q-tooltip>เป็นไปตามความคาดหวัง (3)</q-tooltip>
|
||||
<q-tooltip>{{ props.row.achievement3 }}</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-4>
|
||||
<q-tooltip>สูงว่าความคาดหวังค่อนข้างมาก (4)</q-tooltip>
|
||||
<q-tooltip>{{ props.row.achievement4 }}</q-tooltip>
|
||||
</template>
|
||||
<template v-slot:tip-5>
|
||||
<q-tooltip>สูงกว่าความคาดหวังมาก (5)</q-tooltip>
|
||||
<q-tooltip>{{ props.row.achievement5 }}</q-tooltip>
|
||||
</template>
|
||||
</q-rating>
|
||||
</div>
|
||||
<div v-else-if="col.name === 'achievement'">
|
||||
{{ props.row.achievement }}
|
||||
</div>
|
||||
<div v-else-if="col.name === 'evaluationResults'">
|
||||
{{ (props.row.point / 5) * props.row.weight }}
|
||||
</div>
|
||||
<div v-else>
|
||||
{{ col.value ? col.value : "-" }}
|
||||
</div>
|
||||
|
|
@ -163,6 +209,12 @@ function closeDialog() {
|
|||
</q-table>
|
||||
</div>
|
||||
</q-card-section>
|
||||
<q-separator />
|
||||
<q-card-actions align="right">
|
||||
<q-btn label="บันทึก" color="secondary" @click="onSubmit"
|
||||
><q-tooltip>บันทึกข้อมูล</q-tooltip></q-btn
|
||||
>
|
||||
</q-card-actions>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, watch } from "vue";
|
||||
import { computed, ref, watch } from "vue";
|
||||
import { useQuasar } from "quasar";
|
||||
import { useRoute } from "vue-router";
|
||||
import config from "@/app.config";
|
||||
|
|
@ -114,7 +114,19 @@ const filterKeyword = ref<string>("");
|
|||
const modal = ref<boolean>(false);
|
||||
const modalAssigned = ref<boolean>(false);
|
||||
const isStatusEdit = ref<boolean>(false);
|
||||
const moalEvaluate = ref<boolean>(false);
|
||||
const modalEvaluate = ref<boolean>(false);
|
||||
const evaluationTotal = ref<number>(0);
|
||||
|
||||
// const evaluationTotal = computed(() => {
|
||||
// if (rows.value) {
|
||||
// const test = rows.value.reduce(
|
||||
// (sumAge: number, e: any) => sumAge + e.point
|
||||
// );
|
||||
// console.log(test);
|
||||
|
||||
// return test;
|
||||
// }
|
||||
// });
|
||||
|
||||
function onAdd(edit: boolean = false, id: string = "") {
|
||||
isStatusEdit.value = edit;
|
||||
|
|
@ -127,7 +139,7 @@ function onAdd(edit: boolean = false, id: string = "") {
|
|||
}
|
||||
|
||||
function onEvaluate() {
|
||||
moalEvaluate.value = true;
|
||||
modalEvaluate.value = true;
|
||||
}
|
||||
|
||||
function onDelete(id: string) {
|
||||
|
|
@ -161,6 +173,15 @@ watch(
|
|||
}
|
||||
}
|
||||
);
|
||||
|
||||
watch(
|
||||
() => modalEvaluate.value,
|
||||
() => {
|
||||
if (!modalEvaluate.value) {
|
||||
props.fetchList?.();
|
||||
}
|
||||
}
|
||||
);
|
||||
</script>
|
||||
<template>
|
||||
<q-card bordered style="border-radius: 5px" class="no-shadow">
|
||||
|
|
@ -259,6 +280,12 @@ watch(
|
|||
</q-tr>
|
||||
</template>
|
||||
</q-table>
|
||||
<div class="row text-body2 text-weight-bold q-pa-md">
|
||||
<div class="col-12 text-center row justify-center">
|
||||
<span>รวมผลการประเมิน (ร้อยละ)</span>
|
||||
<div class="text-primary q-pl-md">{{ evaluationTotal }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</q-card-section>
|
||||
</q-card>
|
||||
|
||||
|
|
@ -275,7 +302,11 @@ watch(
|
|||
:kpiUserPlannedId="kpiUserPlannedId"
|
||||
/>
|
||||
|
||||
<DialogEvaluate v-model:modal="moalEvaluate" v-model:data="rows" />
|
||||
<DialogEvaluate
|
||||
v-model:modal="modalEvaluate"
|
||||
:data="rows"
|
||||
:numpage="numpage"
|
||||
/>
|
||||
</template>
|
||||
<style scoped>
|
||||
.custom-table2 {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue