hrms-bangkok/hrms-mgt
7
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

แบบประเมินผล (ผู้บังคับบัญชา) validate q-rating

Browse source
This commit is contained in:
setthawutttty 2023-09-07 11:54:39 +07:00
parent 13f50ee5f1
commit 6ac11d86e7
1 changed files with 172 additions and 23 deletions
Download patch file Download diff file Expand all files Collapse all files

195
src/modules/05_placement/components/probation/FormEvaluation/FormEvaluateAdd.vue
View file

@ -1,5 +1,5 @@
<script setup lang="ts">
import { ref, defineAsyncComponent, onMounted } from "vue";
import { ref, defineAsyncComponent, onMounted, watch, computed } from "vue";
import { useQuasar } from "quasar";
import { useProbationDataStore } from "@/modules/05_placement/store";
import { useCounterMixin } from "@/stores/mixin";
@ -20,6 +20,7 @@ const {
success,
dateToISO,
dialogConfirm,
dialogMessageNotify,
} = mixin;
const route = useRoute();
const router = useRouter();
@ -114,7 +115,7 @@ const dateAutherise = ref<any>(new Date());
const option = ref<any>([]);
// part 1
const knowledge_level = ref<number>(0);
const skill_level = ref<number>(0);
const competency_level = ref<number>(0);
const learn_level = ref<number>(0);
@ -131,6 +132,19 @@ const behavio_orther = ref<any>({ text: "", level: 0 });
const behavio_strength_desc = ref<string>("");
const behavior_improve_desc = ref<string>("");
// part 3
const alerts = Array(20)
.fill(null)
.map(() => ref<boolean>(false));
const lengthconduct = computed(() => {
return conduct_level.value.filter((item: number) => item !== 0).length;
});
const lengthmoral_level = computed(() => {
return moral_level.value.filter((item: number) => item !== 0).length;
});
const lengthdiscipline_level = computed(() => {
return discipline_level.value.filter((item: number) => item !== 0).length;
});
const orientation = ref<any>(null);
const self_learning = ref<any>(null);
const training_seminar = ref<any>(null);
@ -144,7 +158,24 @@ const behavio_inproveRef = ref<any>(null);
const behavio_inproveRules = [
(val: any) => (val && val.length > 0) || "กรุณากรอกข้อมูลสิ่งที่ควรปรับปรุง",
];
const knowledge_level = ref<number>(0);
const knowledge_levelRules = [
(val: any) => (val && val.length > 0) || "กรุณากรอกข้อมูลสิ่งที่ควรปรับปรุง",
];
const ArrayCountbotton = [
orientation,
self_learning,
training_seminar,
other_training,
];
const variablesToWatch = [
knowledge_level,
skill_level,
competency_level,
learn_level,
apply_level,
success_level,
];
const savaForm = () => {
let hasError = false;
behavio_strengthRef.value.validate();
@ -156,11 +187,10 @@ const savaForm = () => {
learn_level.value === 0 ||
apply_level.value === 0 ||
success_level.value === 0 ||
conduct_level.value.length < 4 ||
moral_level.value.length < 3 ||
discipline_level.value.length < 5 ||
lengthconduct.value !== 4 ||
lengthmoral_level.value !== 3 ||
lengthdiscipline_level.value !== 5 ||
behavio_strength_desc.value === "" ||
behavior_improve_desc.value === "" ||
orientation.value === null ||
self_learning.value === null ||
training_seminar.value === null
@ -182,9 +212,29 @@ const savaForm = () => {
} else putformData();
if (hasError === true) {
notifyError($q, "กรุณากรอกข้อมูลให้ครบ");
variablesToWatch.forEach((item, index) => {
if (item.value === 0) {
alerts[index].value = true;
}
});
ArrayCountbotton.forEach((item, index) => {
if (item.value === null) {
alerts[index + 9].value = true;
}
});
if (lengthconduct.value !== 4) {
alerts[6].value = true;
}
if (lengthmoral_level.value !== 3) {
alerts[7].value = true;
}
if (lengthdiscipline_level.value !== 5) {
alerts[8].value = true;
}
dialogMessageNotify($q, "กรุณากรอกข้อมูลให้ครบ");
}
};
const putformData = () => {
const data = {
evaluate_no: evaluate_no.value,
@ -223,15 +273,49 @@ const putformData = () => {
.post(config.API.createformCommader(assignId.value), data)
.then((res: any) => {
success($q, "บันทึกสำเร็จ");
router.push(
`/probation/detail/${personalId.value}/${assignId.value}`
);
router.push(`/probation/detail/${personalId.value}/${assignId.value}`);
})
.catch((e: any) => {
messageError($q, e);
});
});
};
variablesToWatch.forEach((variable, index) => {
watch(variable, (item: any) => {
if (item !== 0) {
alerts[index].value = false;
}
});
});
ArrayCountbotton.forEach((variable, index) => {
watch(variable, (item: any) => {
if (item !== null) {
alerts[index + 9].value = false;
}
});
});
watch(lengthconduct, (newLength) => {
if (newLength === 4) {
alerts[6].value = false;
}
});
watch(lengthmoral_level, (newLength) => {
if (newLength === 3) {
alerts[7].value = false;
}
});
watch(lengthdiscipline_level, (newLength) => {
if (newLength === 5) {
alerts[8].value = false;
}
});
const getBordered = (i: boolean) => {
return {
border_custom: i,
};
};
</script>
<template>
@ -275,7 +359,9 @@ const putformData = () => {
</div>
<div class="col-12 text-top0 row items-center">
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
<span class="text-primary q-pr-sm">{{ "ครั้งที่ " + round }}</span>
<span class="text-primary q-pr-sm">{{
"ครั้งที่ " + round
}}</span>
ระหว่างวันที่
<span class="text-black q-px-sm">{{
date2Thai(start_date)
@ -299,7 +385,12 @@ const putformData = () => {
<div class="col-12 row no-margin">
<q-card class="text-top0 col-xs-12 col-sm-11 q-pa-xs q-pl-lg">
<q-list dense>
<q-item dense tag="label" v-ripple>
<q-item
dense
tag="label"
v-ripple
:class="getBordered(alerts[0].value)"
>
<q-item-section>
<q-item-label>
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
@ -312,6 +403,7 @@ const putformData = () => {
v-model="knowledge_level"
max="5"
size="sm"
:rules="knowledge_levelRules"
color="grey"
:color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม"
@ -339,7 +431,12 @@ const putformData = () => {
<q-card class="text-top0 col-xs-12 col-sm-11 q-pa-xs q-pl-lg">
<q-list dense>
<q-item dense tag="label" v-ripple>
<q-item
dense
tag="label"
v-ripple
:class="getBordered(alerts[1].value)"
>
<q-item-section>
<q-item-label>
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
@ -379,7 +476,12 @@ const putformData = () => {
<q-card class="text-top0 col-xs-12 col-sm-11 q-pa-xs q-pl-lg">
<q-list dense>
<q-item dense tag="label" v-ripple>
<q-item
dense
tag="label"
v-ripple
:class="getBordered(alerts[2].value)"
>
<q-item-section>
<q-item-label>
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
@ -419,7 +521,12 @@ const putformData = () => {
<q-card class="text-top0 col-xs-12 col-sm-11 q-pa-xs q-pl-lg">
<q-list dense>
<q-item dense tag="label" v-ripple>
<q-item
dense
tag="label"
v-ripple
:class="getBordered(alerts[3].value)"
>
<q-item-section>
<q-item-label>
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
@ -459,7 +566,12 @@ const putformData = () => {
<q-card class="text-top0 col-xs-12 col-sm-11 q-pa-xs q-pl-lg">
<q-list dense>
<q-item dense tag="label" v-ripple>
<q-item
dense
tag="label"
v-ripple
:class="getBordered(alerts[4].value)"
>
<q-item-section>
<q-item-label>
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
@ -500,7 +612,12 @@ const putformData = () => {
<q-card class="text-top0 col-xs-12 col-sm-11 q-pa-xs q-pl-lg">
<q-list dense>
<q-item dense tag="label" v-ripple>
<q-item
dense
tag="label"
v-ripple
:class="getBordered(alerts[5].value)"
>
<q-item-section>
<q-item-label>
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
@ -560,7 +677,10 @@ const putformData = () => {
</q-list>
</q-card>
<q-card v-if="etc" class="text-top0 col-xs-12 col-sm-11 q-pa-xs q-pl-lg">
<q-card
v-if="etc"
class="text-top0 col-xs-12 col-sm-11 q-pa-xs q-pl-lg"
>
<q-list dense>
<q-item dense tag="label" v-ripple>
<q-item-section class="q-ml-md">
@ -627,6 +747,7 @@ const putformData = () => {
2.1 ความประพฤติ
</div>
<q-card
:class="getBordered(alerts[6].value)"
flat
bordered
class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1"
@ -675,6 +796,7 @@ const putformData = () => {
2.2 ความมีคุณธรรมจริยธรรม
</div>
<q-card
:class="getBordered(alerts[7].value)"
flat
bordered
class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1"
@ -722,7 +844,9 @@ const putformData = () => {
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
2.3 การรักษาวินัย
</div>
<q-card
:class="getBordered(alerts[8].value)"
flat
bordered
class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1"
@ -896,7 +1020,12 @@ const putformData = () => {
class="col-xs-12 col-sm-11 col-md-11 q-pa-sm bg-grey-1"
>
<q-list dense>
<q-item dense tag="label" v-ripple>
<q-item
dense
tag="label"
v-ripple
:class="getBordered(alerts[9].value)"
>
<q-item-section>
<q-item-label>1. การปฐมนิเทศ</q-item-label>
</q-item-section>
@ -922,7 +1051,12 @@ const putformData = () => {
</q-item-section>
</q-item>
<q-separator class="q-my-xs" />
<q-item dense tag="label" v-ripple>
<q-item
dense
tag="label"
v-ripple
:class="getBordered(alerts[10].value)"
>
<q-item-section>
<q-item-label>2. การเรียนรู้ด้วยตนเอง</q-item-label>
</q-item-section>
@ -948,7 +1082,12 @@ const putformData = () => {
</q-item-section>
</q-item>
<q-separator class="q-my-xs" />
<q-item dense tag="label" v-ripple>
<q-item
dense
tag="label"
v-ripple
:class="getBordered(alerts[11].value)"
>
<q-item-section>
<q-item-label>3. การอบรมสัมนาร่วมกัน</q-item-label>
</q-item-section>
@ -974,7 +1113,12 @@ const putformData = () => {
</q-item-section>
</q-item>
<q-separator class="q-my-xs" />
<q-item dense tag="label" v-ripple>
<q-item
dense
tag="label"
v-ripple
:class="getBordered(alerts[12].value)"
>
<q-item-section>
<q-item-label
>4. การอบรมอื่น ๆ ตามที่หน่วยงานกำหนด
@ -1109,4 +1253,9 @@ const putformData = () => {
.q-card {
box-shadow: 0px 0px 0px 0px !important;
}
.border_custom {
border: 2px solid #c10015;
border-radius: 5px;
color: #c10015;
}
</style>