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 17:08:10 +07:00
parent b18056a335
commit 7ce0ee240b
3 changed files with 143 additions and 35 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -166,7 +166,6 @@ const ArrayCountbotton = [
orientation,
self_learning,
training_seminar,
other_training,
];
const variablesToWatch = [
knowledge_level,
@ -1117,7 +1116,7 @@ const getBordered = (i: boolean) => {
dense
tag="label"
v-ripple
:class="getBordered(alerts[12].value)"
>
<q-item-section>
<q-item-label
@ -1256,6 +1255,6 @@ const getBordered = (i: boolean) => {
.border_custom {
border: 2px solid #c10015;
border-radius: 5px;
color: #c10015;
// color: #c10015;
}
</style>

2
src/modules/05_placement/components/probation/FormEvaluation/FormEvaluateScoreAdd.vue
View file

@ -1574,6 +1574,6 @@ watch(lengthdiscipline_level, (newLength) => {
.border_custom {
border: 2px solid #c10015;
border-radius: 5px;
color: #c10015;
// color: #c10015;
}
</style>

171
src/modules/05_placement/components/probation/FormEvaluation/FormSaveResultAdd.vue
View file

@ -1,5 +1,5 @@
<script setup lang="ts">
import { ref, onMounted } from "vue";
import { ref, onMounted,watch,computed } from "vue";
import { useQuasar } from "quasar";
import { useProbationDataStore } from "@/modules/05_placement/store";
import { useCounterMixin } from "@/stores/mixin";
@ -21,6 +21,7 @@ const {
dateToISO,
messageError,
dialogConfirm,
dialogMessageNotify
} = mixin;
const { ratingColors } = probationStore;
const assignId = ref<string>(route.params.form.toString());
@ -34,7 +35,9 @@ const date_finish = ref<Date>(new Date());
const round = ref<number>();
const checkArray = ref<number>(0);
const alerts = Array(20)
.fill(null)
.map(() => ref<boolean>(false));
onMounted(async () => {
await fecthFormdata(assignId.value);
});
@ -130,13 +133,9 @@ const dateEnd = ref<Date>(new Date("12-10-2023"));
const period = ref<number>(1);
// part 1
const evaluate_expenct_level = ref<any>([
// { id: "1", label: "ผลผลิตของงานที่คาดหวัง 1", level: 0 },
// { id: "2", label: "ผลผลิตของงานที่คาดหวัง 2", level: 0 },
// { id: "3", label: "ผลผลิตของงานที่คาดหวัง 3", level: 0 },
// { id: "4", label: "ผลผลิตของงานที่คาดหวัง 4", level: 0 },
// { id: "5", label: "ผลผลิตของงานที่คาดหวัง 5", level: 0 },
]);
const evaluate_expenct_level = ref<any>([]);
const evaluate_ouptut = ref<any>([
// { level: 0, text: "" },
// { level: 0, text: "" },
@ -195,7 +194,35 @@ const behavio_inproveRef = ref<any>(null);
const behavio_inproveRules = [
(val: any) => (val && val.length > 0) || "กรุณากรอกข้อมูลสิ่งที่ควรปรับปรุง",
];
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 lengthevaluate_expenct_level = computed(() => {
return evaluate_expenct_level.value.filter((item:any) => item.level !== undefined && item.level !== 0).length;
});
const lengthevaluate_ouptut = computed(() => {
return evaluate_ouptut.value.filter((item:any) => item.level !== undefined && item.level !== 0).length;
});
const variablesToWatch = [
knowledge_level,
skill_level,
competency_level,
learn_level,
apply_level,
success_level,
];
const ArrayCountbotton = [
orientation,
self_learning,
training_seminar,
];
const savaForm = () => {
achievement_strengthRef.value.validate();
// achievement_inproveRef.value.validate();
@ -213,6 +240,8 @@ const savaForm = () => {
if (
// filterlevel1_1.length != 0 ||
// filter_ouptut1_2.length != 0 ||
lengthevaluate_expenct_level.value !== evaluate_expenct_level.value.length||
lengthevaluate_ouptut.value !== evaluate_ouptut.value.length||
knowledge_level.value === 0 ||
skill_level.value === 0 ||
competency_level.value === 0 ||
@ -221,9 +250,9 @@ const savaForm = () => {
success_level.value === 0 ||
achievement_strength_desc.value === "" ||
// achievement_improve_desc.value === "" ||
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 ||
behavior_strength_desc.value === "" ||
// behavior_improve_desc.value === "" ||
orientation.value === null ||
@ -247,7 +276,34 @@ const savaForm = () => {
}
if (hasError === true) {
notifyError($q, "กรุณากรอกข้อมูลให้ครบ");
variablesToWatch.forEach((item, index) => {
if (item.value === 0) {
alerts[index+2].value = true;
}
});
if(lengthevaluate_expenct_level.value !== evaluate_expenct_level.value.length){
alerts[0].value = true
}
if(lengthevaluate_ouptut.value !== evaluate_ouptut.value.length){
alerts[1].value = true
}
if (lengthconduct.value !== 4) {
alerts[8].value = true;
}
if (lengthmoral_level.value !== 3) {
alerts[9].value = true;
}
if (lengthdiscipline_level.value !== 5) {
alerts[10].value = true;
}
ArrayCountbotton.forEach((item, index) => {
if (item.value === null) {
alerts[index + 11].value = true;
}
});
console.log(evaluate_expenct_level.value)
dialogMessageNotify($q, "กรุณากรอกข้อมูลให้ครบ");
} else {
putformData()
}
@ -312,6 +368,52 @@ const saveformdata = async (data: any) => {
messageError($q, e);
});
};
variablesToWatch.forEach((variable, index) => {
watch(variable, (item: any) => {
if (item !== 0) {
alerts[index+2].value = false;
}
});
});
ArrayCountbotton.forEach((variable, index) => {
watch(variable, (item: any) => {
if (item !== null) {
alerts[index + 11].value = false;
}
});
});
watch(lengthevaluate_expenct_level, (newLength) => {
if (newLength === evaluate_expenct_level.value.length) {
console.log(true)
alerts[0].value = false;
}
});
watch(lengthevaluate_ouptut, (newLength) => {
if (newLength === evaluate_ouptut.value.length) {
console.log(true)
alerts[1].value = false;
}
});
watch(lengthconduct, (newLength) => {
if (newLength === 4) {
alerts[8].value = false;
}
});
watch(lengthmoral_level, (newLength) => {
if (newLength === 3) {
alerts[9].value = false;
}
});
watch(lengthdiscipline_level, (newLength) => {
if (newLength === 5) {
alerts[10].value = false;
}
});
const getBordered = (i: boolean) => {
return {
border_custom: i,
};}
</script>
<template>
@ -365,16 +467,17 @@ const saveformdata = async (data: any) => {
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
1.1 ความสำเร็จของงานที่ได้รับมอบหมาย
</div>
<div class="col-xs-12 col-sm-11 col-md-10 offset-md-1 text-top2">
<div class="col-xs-12 col-sm-11 col-md-10 offset-md-1 text-top2 ">
ผลผลิตของงานที่คาดหวัง
</div>
<q-card flat bordered class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1">
<q-card flat bordered :class="['col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1', getBordered(alerts[0].value)]">
<q-list dense v-for="(list, i) in list1_1" :key="i">
<q-item dense tag="label" v-ripple>
<q-item-section>
<q-item-label>{{ list.output_desc }}</q-item-label>
</q-item-section>
<q-item-section side>
<q-rating v-model="evaluate_expenct_level[i].level" :val="list.id" max="5" size="sm" color="grey"
:color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม">
<template v-slot:tip-1>
@ -404,7 +507,7 @@ const saveformdata = async (data: any) => {
<div class="col-xs-12 col-sm-11 col-md-10 offset-md-1 text-top2">
ผลผลิตของงานที่เกิดขึ้นจริง
</div>
<q-card flat bordered class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1">
<q-card flat bordered :class="['col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1', getBordered(alerts[1].value)]">
<q-list dense v-for="(list, i) in list1_2" :key="i">
<q-item dense tag="label" v-ripple v-if="i < checkArray">
<q-item-section>
@ -441,7 +544,7 @@ const saveformdata = async (data: any) => {
<div class="col-12 row">
<q-card class="text-top0 col-xs-12 col-sm-11 q-pa-sm q-pl-sm">
<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" />
@ -471,9 +574,9 @@ const saveformdata = async (data: any) => {
</q-list>
</q-card>
<q-card class="text-top0 col-xs-12 col-sm-11 q-pa-sm q-pl-sm">
<q-card class="text-top0 col-xs-12 col-sm-11 q-pa-sm q-pl-sm" >
<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" />
@ -505,7 +608,7 @@ const saveformdata = async (data: any) => {
<q-card class="text-top0 col-xs-12 col-sm-11 q-pa-sm q-pl-sm">
<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" />
@ -537,7 +640,7 @@ const saveformdata = async (data: any) => {
<q-card class="text-top0 col-xs-12 col-sm-11 q-pa-sm q-pl-sm">
<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" />
@ -569,7 +672,7 @@ const saveformdata = async (data: any) => {
<q-card class="text-top0 col-xs-12 col-sm-11 q-pa-sm q-pl-sm">
<q-list dense>
<q-item dense tag="label" v-ripple>
<q-item dense tag="label" v-ripple :class="getBordered(alerts[6].value)">
<q-item-section>
<q-item-label>
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
@ -602,7 +705,7 @@ const saveformdata = async (data: any) => {
<q-card class="text-top0 col-xs-12 col-sm-11 q-pa-sm q-pl-sm">
<q-list dense>
<q-item dense tag="label" v-ripple>
<q-item dense tag="label" v-ripple :class="getBordered(alerts[7].value)">
<q-item-section>
<q-item-label>
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
@ -648,7 +751,7 @@ const saveformdata = async (data: any) => {
</q-list>
</q-card>
<q-card v-if="etc" class="text-top0 col-xs-12 col-sm-11 q-pa-sm q-mt-sm q-pl-lg">
<q-card v-if="etc" class="text-top0 col-xs-12 col-sm-11 q-pa-sm q-mt-sm q-pl-lg ">
<q-list dense>
<q-item dense tag="label" v-ripple>
<q-item-section class="q-ml-md">
@ -717,7 +820,8 @@ const saveformdata = async (data: any) => {
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
2.1 ความประพฤติ
</div>
<q-card flat bordered class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1">
<q-card flat bordered :class="['col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1', getBordered(alerts[8].value)]">
<q-list dense v-for="(list, i) in list2_1" :key="i">
<q-item dense tag="label" v-ripple>
<q-item-section>
@ -753,7 +857,7 @@ const saveformdata = async (data: any) => {
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
2.2 ความมีคุณธรรมจริยธรรม
</div>
<q-card flat bordered class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1">
<q-card flat bordered :class="['col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1', getBordered(alerts[9].value)]">
<q-list dense v-for="(list, i) in list2_2" :key="i">
<q-item dense tag="label" v-ripple>
<q-item-section>
@ -789,7 +893,7 @@ const saveformdata = async (data: any) => {
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
2.3 การรักษาวินัย
</div>
<q-card flat bordered class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1">
<q-card flat bordered :class="['col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1', getBordered(alerts[10].value)]">
<q-list dense v-for="(list, i) in list2_3" :key="i">
<q-item dense tag="label" v-ripple>
<q-item-section>
@ -896,7 +1000,7 @@ const saveformdata = async (data: any) => {
</div>
<q-card flat bordered 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[11].value)">
<q-item-section>
<q-item-label>1. การปฐมนิเทศ</q-item-label>
</q-item-section>
@ -910,7 +1014,7 @@ const saveformdata = async (data: any) => {
</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>2. การเรียนรู้ด้วยตนเอง</q-item-label>
</q-item-section>
@ -924,7 +1028,7 @@ const saveformdata = async (data: any) => {
</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[13].value)">
<q-item-section>
<q-item-label>3. การอบรมสัมนาร่วมกัน</q-item-label>
</q-item-section>
@ -938,7 +1042,7 @@ const saveformdata = async (data: any) => {
</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 >
<q-item-section>
<q-item-label>4. การอบรมอื่น ๆ ตามที่หน่วยงานกำหนด
(ถ้ามี)</q-item-label>
@ -1030,4 +1134,9 @@ const saveformdata = async (data: any) => {
.q-card {
box-shadow: 0px 0px 0px 0px !important;
}
.border_custom {
border: 2px solid #c10015;
border-radius: 5px;
// color: #c10015;
}
</style>