แก้ bug ฟอร์มทดลองงาน

This commit is contained in:
Warunee Tamkoo 2023-10-04 17:36:53 +07:00
parent c0efcf59ce
commit d83530ec9c
5 changed files with 56 additions and 179 deletions

View file

@ -151,6 +151,8 @@ const fetchEvaluate = async () => {
self_learning.value = data.self_learning.toString(); self_learning.value = data.self_learning.toString();
training_seminar.value = data.training_seminar.toString(); training_seminar.value = data.training_seminar.toString();
other_training.value = data.other_training.toString(); other_training.value = data.other_training.toString();
dateAutherise.value = data.commander_dated
if ( if (
data.achievement_other_desc !== "" && data.achievement_other_desc !== "" &&
data.achievement_other_level !== null data.achievement_other_level !== null

View file

@ -46,6 +46,19 @@ const director_id3 = ref<any>(null);
const optionDirector = ref<any>([]); const optionDirector = ref<any>([]);
const person = ref<any>([]); const person = ref<any>([]);
const options = ref<any>([
{ value: 1, label: "พัฒนาครบ 3 ส่วน" },
{ value: 2, label: "พัฒนาไม่ครบ 3 ส่วน" },
]);
const optionsResult = ref<any>([
{ value: 1, label: "ไม่ต่ำกว่ามาตรฐานที่กำหนด เห็นควรให้รับราชการต่อ" },
{ value: 2, label: "ต่ำกว่ามาตรฐานที่กำหนด เห็นควรให้ออกจากราชการ" },
{
value: 3,
label: "เห็นควรให้ขยายระยะเวลาทดลองปฏิบัติหน้าที่ราชการต่อไปอีก",
},
]);
// const saveEdit = async (id: string) => { // const saveEdit = async (id: string) => {
// await myForm.value.validate().then((result: boolean) => { // await myForm.value.validate().then((result: boolean) => {
// if (result) { // if (result) {
@ -73,6 +86,7 @@ const fecthAssign = async (id: string) => {
) { ) {
develop.value = res.data.data.result.develop_complete; develop.value = res.data.data.result.develop_complete;
result.value = res.data.data.result.evaluate_result; result.value = res.data.data.result.evaluate_result;
changeReson52(Number(res.data.data.result.evaluate_result));
} }
director_id.value = res.data.data.chairman.name; director_id.value = res.data.data.chairman.name;
@ -117,19 +131,6 @@ const fecthResult = async (id: string) => {
// part new // part new
const options = [
{ value: 1, label: "พัฒนาครบ 3 ส่วน" },
{ value: 2, label: "พัฒนาไม่ครบ 3 ส่วน" },
];
const optionsResult = [
{ value: 1, label: "ไม่ต่ำกว่ามาตรฐานที่กำหนด เห็นควรให้รับราชการต่อ" },
{ value: 2, label: "ต่ำกว่ามาตรฐานที่กำหนด เห็นควรให้ออกจากราชการ" },
{
value: 3,
label: "เห็นควรให้ขยายระยะเวลาทดลองปฏิบัติหน้าที่ราชการต่อไปอีก",
},
];
const savaForm = async () => { const savaForm = async () => {
await myForm.value.validate().then((result: boolean) => { await myForm.value.validate().then((result: boolean) => {
if (result) { if (result) {
@ -207,7 +208,7 @@ const postData = async (action: string) => {
}); });
} }
}; };
const selectRuslt = () => { const selectResult = () => {
if (result.value !== 3) { if (result.value !== 3) {
expand_month.value = ""; expand_month.value = "";
} }
@ -236,30 +237,6 @@ onMounted(() => {
fecthAssign(assignId.value); fecthAssign(assignId.value);
fecthResult(assignId.value); fecthResult(assignId.value);
}); });
const optionsFn = ref<any>([]);
function filterFnOptions(val: string, update: any) {
if (val == "") {
update(() => {
optionsFn.value = options;
});
} else {
update(() => {
optionsFn.value = options.filter((e: any) => e.label.search(val) !== -1);
});
}
}
const optionsResultFn = ref<any>([])
function filterFnOptionsResult(val: string, update: any) {
if (val == "") {
update(() => {
optionsResultFn.value = optionsResult;
});
} else {
update(() => {
optionsResultFn.value = optionsResult.filter((e: any) => e.label.search(val) !== -1);
});
}
}
</script> </script>
<template> <template>
@ -428,7 +405,7 @@ function filterFnOptionsResult(val: string, update: any) {
'กรุณาเลือกการพัฒนาในระหว่างทดลองปฏิบัติหน้าที่ราชการ', 'กรุณาเลือกการพัฒนาในระหว่างทดลองปฏิบัติหน้าที่ราชการ',
]" ]"
hide-bottom-space hide-bottom-space
:options="optionsFn" :options="options"
class="col-xs-12 col-sm-6" class="col-xs-12 col-sm-6"
dense dense
borderless borderless
@ -440,7 +417,6 @@ function filterFnOptionsResult(val: string, update: any) {
outlined outlined
v-model="develop" v-model="develop"
label="การพัฒนาในระหว่างทดลองปฏิบัติหน้าที่ราชการ" label="การพัฒนาในระหว่างทดลองปฏิบัติหน้าที่ราชการ"
@filter="filterFnOptions"
use-input use-input
><template v-slot:no-option> ><template v-slot:no-option>
<q-item> <q-item>
@ -461,7 +437,7 @@ function filterFnOptionsResult(val: string, update: any) {
'กรุณาเลือกผลการประเมินการทดลองปฏิบัติหน้าที่ราชการ', 'กรุณาเลือกผลการประเมินการทดลองปฏิบัติหน้าที่ราชการ',
]" ]"
hide-bottom-space hide-bottom-space
:options="optionsResultFn" :options="optionsResult"
:disable="!status" :disable="!status"
dense dense
borderless borderless
@ -472,9 +448,8 @@ function filterFnOptionsResult(val: string, update: any) {
outlined outlined
v-model="result" v-model="result"
label="ผลการประเมินการทดลองปฏิบัติหน้าที่ราชการ" label="ผลการประเมินการทดลองปฏิบัติหน้าที่ราชการ"
@update:model-value="selectRuslt" @update:model-value="selectResult"
use-input use-input
@filter="filterFnOptionsResult"
><template v-slot:no-option> ><template v-slot:no-option>
<q-item> <q-item>
<q-item-section class="text-grey"> <q-item-section class="text-grey">

View file

@ -152,6 +152,7 @@ const fecthFormRound = async () => {
self_learning.value = data.self_learning.toString(); self_learning.value = data.self_learning.toString();
training_seminar.value = data.training_seminar.toString(); training_seminar.value = data.training_seminar.toString();
other_training.value = data.other_training.toString(); other_training.value = data.other_training.toString();
dateAutherise.value = data.assessor_dated
if ( if (
data.achievement_other_desc !== "" && data.achievement_other_desc !== "" &&
data.achievement_other_level !== null data.achievement_other_level !== null

View file

@ -161,6 +161,8 @@ const fecthFormRound = async () => {
self_learning.value = data.self_learning.toString(); self_learning.value = data.self_learning.toString();
training_seminar.value = data.training_seminar.toString(); training_seminar.value = data.training_seminar.toString();
other_training.value = data.other_training.toString(); other_training.value = data.other_training.toString();
dateAutherise.value = data.assessor_dated
if ( if (
data.achievement_other_desc !== "" && data.achievement_other_desc !== "" &&
data.achievement_other_level !== null data.achievement_other_level !== null

View file

@ -1,5 +1,5 @@
<script setup lang="ts"> <script setup lang="ts">
import { ref, onMounted } from "vue"; import { ref, onMounted, reactive } from "vue";
import { QForm, useQuasar } from "quasar"; import { QForm, useQuasar } from "quasar";
import { useCounterMixin } from "@/stores/mixin"; import { useCounterMixin } from "@/stores/mixin";
import { useRoute, useRouter } from "vue-router"; import { useRoute, useRouter } from "vue-router";
@ -54,8 +54,11 @@ const sum_percent = ref<number>();
const reason = ref<string>(); const reason = ref<string>();
const pass_result = ref<number>(); const pass_result = ref<number>();
const evaluate_date = ref<Date>(); const evaluate_date = ref<Date>();
const result = ref<any>(); const dev_options = reactive([
const result_option = ref<any>([ { value: 1, label: "พัฒนาครบ 3 ส่วน" },
{ value: 2, label: "พัฒนาไม่ครบ 3 ส่วน" },
]);
const result_option = reactive([
{ name: "ไม่ต่ำกว่ามาตรฐานที่กำหนด เห็นควรให้รับราชการต่อ", value: 1 }, { name: "ไม่ต่ำกว่ามาตรฐานที่กำหนด เห็นควรให้รับราชการต่อ", value: 1 },
{ name: "ต่ำกว่ามาตรฐานที่กำหนด เห็นควรให้ออกจากราชการ", value: 2 }, { name: "ต่ำกว่ามาตรฐานที่กำหนด เห็นควรให้ออกจากราชการ", value: 2 },
{ name: "เห็นควรให้ขยายระยะเวลาทดลองปฏิบัติหน้าที่ราชการต่อไปอีก", value: 3 }, { name: "เห็นควรให้ขยายระยะเวลาทดลองปฏิบัติหน้าที่ราชการต่อไปอีก", value: 3 },
@ -84,7 +87,7 @@ const getReportScore = async () => {
data.develop_training_seminar_percent; data.develop_training_seminar_percent;
develop_other_training_percent.value = data.develop_other_training_percent; develop_other_training_percent.value = data.develop_other_training_percent;
develop_total_percent.value = data.develop_total_percent; develop_total_percent.value = data.develop_total_percent;
develop_result.value = data.develop_result; develop_result.value = data.develop_result == 0 ? 2 : data.develop_result;
achievement_score.value = data.achievement_score; achievement_score.value = data.achievement_score;
achievement_score_total.value = data.achievement_score_total; achievement_score_total.value = data.achievement_score_total;
@ -127,8 +130,7 @@ onMounted(() => {
<q-item-section> <q-item-section>
<q-item-label> <q-item-label>
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" /> <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
1. คะแนนผลสมฤทธการทดลองปฏหนาทราชการ</q-item-label 1. คะแนนผลสมฤทธการทดลองปฏหนาทราชการ</q-item-label>
>
</q-item-section> </q-item-section>
<q-item-section> <q-item-section>
<q-item-label style="color: gray"> <q-item-label style="color: gray">
@ -160,8 +162,7 @@ onMounted(() => {
<q-item-section> <q-item-section>
<q-item-label> <q-item-label>
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" /> <q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
2. คะแนนพฤตกรรมการปฏราชการ</q-item-label 2. คะแนนพฤตกรรมการปฏราชการ</q-item-label>
>
</q-item-section> </q-item-section>
<q-item-section> <q-item-section>
<q-item-label style="color: gray"> <q-item-label style="color: gray">
@ -191,9 +192,7 @@ onMounted(() => {
<q-list dense> <q-list dense>
<q-item dense tag="label" v-ripple> <q-item dense tag="label" v-ripple>
<q-item-section> <q-item-section>
<q-item-label class="text-black" <q-item-label class="text-black">ผลคะแนนรวมการประเมนการทดลอง</q-item-label>
>ผลคะแนนรวมการประเมนการทดลอง</q-item-label
>
</q-item-section> </q-item-section>
<q-item-section> <q-item-section>
<q-item-label style="color: gray"> <q-item-label style="color: gray">
@ -226,11 +225,7 @@ onMounted(() => {
<q-avatar class="bg-grey-2 q-mr-sm" size="28px">2</q-avatar> <q-avatar class="bg-grey-2 q-mr-sm" size="28px">2</q-avatar>
การพฒนาผทดลองปฏหนาทราชการ การพฒนาผทดลองปฏหนาทราชการ
</div> </div>
<q-card <q-card flat bordered class="col-xs-12 col-sm-11 col-md-11 q-pa-sm bg-grey-1">
flat
bordered
class="col-xs-12 col-sm-11 col-md-11 q-pa-sm bg-grey-1"
>
<div class="col-xs-12 col-sm-11 col-md-11 q-my-sm"> <div class="col-xs-12 col-sm-11 col-md-11 q-my-sm">
<div class="row q-gutter-md q-pl-md"> <div class="row q-gutter-md q-pl-md">
<div class="col-8 text-weight-medium">วข</div> <div class="col-8 text-weight-medium">วข</div>
@ -242,66 +237,30 @@ onMounted(() => {
<div class="row q-gutter-md align-center q-pl-md"> <div class="row q-gutter-md align-center q-pl-md">
<div class="col-8">1. การปฐมนเทศ</div> <div class="col-8">1. การปฐมนเทศ</div>
<div class="col"> <div class="col">
<q-input <q-input outlined dense type="number" :disable="!status" v-model="develop_orientation_score" />
outlined
dense
type="number"
:disable="!status"
v-model="develop_orientation_score"
/>
</div> </div>
<div class="col"> <div class="col">
<q-input <q-input outlined dense type="number" :disable="!status" v-model="develop_orientation_percent" />
outlined
dense
type="number"
:disable="!status"
v-model="develop_orientation_percent"
/>
</div> </div>
</div> </div>
<q-separator class="q-my-xs" /> <q-separator class="q-my-xs" />
<div class="row q-gutter-md align-center q-pl-md"> <div class="row q-gutter-md align-center q-pl-md">
<div class="col-8">2. การเรยนรวยตนเอง</div> <div class="col-8">2. การเรยนรวยตนเอง</div>
<div class="col"> <div class="col">
<q-input <q-input dense outlined type="number" :disable="!status" v-model="develop_self_learning_score" />
dense
outlined
type="number"
:disable="!status"
v-model="develop_self_learning_score"
/>
</div> </div>
<div class="col"> <div class="col">
<q-input <q-input outlined dense type="number" :disable="!status" v-model="develop_self_learning_percent" />
outlined
dense
type="number"
:disable="!status"
v-model="develop_self_learning_percent"
/>
</div> </div>
</div> </div>
<q-separator class="q-my-xs" /> <q-separator class="q-my-xs" />
<div class="row q-gutter-md align-center q-pl-md"> <div class="row q-gutter-md align-center q-pl-md">
<div class="col-8">3. การอบรมสมนารวมก</div> <div class="col-8">3. การอบรมสมนารวมก</div>
<div class="col"> <div class="col">
<q-input <q-input outlined dense type="number" :disable="!status" v-model="develop_training_seminar_score" />
outlined
dense
type="number"
:disable="!status"
v-model="develop_training_seminar_score"
/>
</div> </div>
<div class="col"> <div class="col">
<q-input <q-input outlined dense type="number" :disable="!status" v-model="develop_training_seminar_percent" />
outlined
dense
type="number"
:disable="!status"
v-model="develop_training_seminar_percent"
/>
</div> </div>
</div> </div>
<q-separator class="q-my-xs" /> <q-separator class="q-my-xs" />
@ -310,22 +269,10 @@ onMounted(() => {
4. การอบรมอ ตามทหนวยงานกำหนด (าม) 4. การอบรมอ ตามทหนวยงานกำหนด (าม)
</div> </div>
<div class="col"> <div class="col">
<q-input <q-input outlined dense type="number" :disable="!status" v-model="develop_other_training_score" />
outlined
dense
type="number"
:disable="!status"
v-model="develop_other_training_score"
/>
</div> </div>
<div class="col"> <div class="col">
<q-input <q-input outlined dense type="number" :disable="!status" v-model="develop_other_training_percent" />
outlined
dense
type="number"
:disable="!status"
v-model="develop_other_training_percent"
/>
</div> </div>
</div> </div>
@ -333,9 +280,7 @@ onMounted(() => {
<div class="col-xs-12 col-sm-11 col-md-11 q-my-sm"> <div class="col-xs-12 col-sm-11 col-md-11 q-my-sm">
<div class="row q-gutter-md q-pl-sm"> <div class="row q-gutter-md q-pl-sm">
<div class="col-8 text-weight-medium"> <div class="col-8 text-weight-medium">
<q-item-label <q-item-label>คะแนนผลการพฒนาขาราชการทอยระหวางการทดลองปฏหนาทราชการ</q-item-label>
>คะแนนผลการพฒนาขาราชการทอยระหวางการทดลองปฏหนาทราชการ</q-item-label
>
</div> </div>
<div class="col q-pl-md">{{ develop_total_score }}</div> <div class="col q-pl-md">{{ develop_total_score }}</div>
<div class="col q-pl-md">{{ develop_total_percent }}</div> <div class="col q-pl-md">{{ develop_total_percent }}</div>
@ -350,18 +295,8 @@ onMounted(() => {
ผลการพฒนาขาราชการทอยระหวางการทดลองปฏหนาทราชการ ผลการพฒนาขาราชการทอยระหวางการทดลองปฏหนาทราชการ
</div> </div>
<div class="col-12"> <div class="col-12">
<q-select <q-select class="col-12" dense v-model="develop_result" outlined :options="dev_options" option-label="label"
class="col-12" option-value="value" map-options emit-value :disable="!status" />
dense
v-model="develop_result"
outlined
:options="result_option"
option-label="name"
option-value="value"
map-options
emit-value
:disable="!status"
/>
</div> </div>
</div> </div>
@ -369,18 +304,8 @@ onMounted(() => {
<div class="col-12 text-top0 row items-center"> <div class="col-12 text-top0 row items-center">
เหตผลอ ในการพจารณา เหตผลอ ในการพจารณา
</div> </div>
<q-input <q-input type="textarea" outlined dense class="col-12" v-model="reason" lazy-rules autogrow hide-bottom-space
type="textarea" :row="3" :disable="!status" />
outlined
dense
class="col-12"
v-model="reason"
lazy-rules
autogrow
hide-bottom-space
:row="3"
:disable="!status"
/>
</div> </div>
<div class="col-xs-12 col-sm-11"> <div class="col-xs-12 col-sm-11">
@ -390,18 +315,8 @@ onMounted(() => {
ผลการทดลองปฏหนาทราชการ ผลการทดลองปฏหนาทราชการ
</div> </div>
<div class="col-12"> <div class="col-12">
<q-select <q-select class="col-12" dense v-model="pass_result" outlined :options="result_option" option-label="name"
class="col-12" option-value="value" map-options emit-value :disable="!status" />
dense
v-model="pass_result"
outlined
:options="result_option"
option-label="name"
option-value="value"
map-options
emit-value
:disable="!status"
/>
</div> </div>
</div> </div>
<div class="col-xs-12 col-sm-6"> <div class="col-xs-12 col-sm-6">
@ -409,16 +324,8 @@ onMounted(() => {
เดอน ประเม เดอน ประเม
</div> </div>
<div class="col-12"> <div class="col-12">
<datepicker <datepicker menu-class-name="modalfix" v-model="evaluate_date" :locale="'th'" autoApply :readonly="!status"
menu-class-name="modalfix" borderless :enableTimePicker="false" week-start="0">
v-model="evaluate_date"
:locale="'th'"
autoApply
:readonly="!status"
borderless
:enableTimePicker="false"
week-start="0"
>
<template #year="{ year }"> <template #year="{ year }">
{{ year + 543 }} {{ year + 543 }}
</template> </template>
@ -426,22 +333,10 @@ onMounted(() => {
{{ parseInt(value + 543) }} {{ parseInt(value + 543) }}
</template> </template>
<template #trigger> <template #trigger>
<q-input <q-input outlined dense :disable="!status" class="full-width datepicker" :model-value="evaluate_date != null ? date2Thai(evaluate_date) : null
outlined " :rules="[(val) => !!val || `${'วัน เดือน ปี ที่ประเมิน'}`]">
dense
:disable="!status"
class="full-width datepicker"
:model-value="
evaluate_date != null ? date2Thai(evaluate_date) : null
"
:rules="[(val) => !!val || `${'วัน เดือน ปี ที่ประเมิน'}`]"
>
<template v-slot:prepend> <template v-slot:prepend>
<q-icon <q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
</q-icon> </q-icon>
</template> </template>
</q-input> </q-input>
@ -471,9 +366,11 @@ onMounted(() => {
.q-rating__icon { .q-rating__icon {
text-shadow: transparent !important; text-shadow: transparent !important;
} }
.color-txt { .color-txt {
color: black !important; color: black !important;
} }
.q-card { .q-card {
box-shadow: 0px 0px 0px 0px !important; box-shadow: 0px 0px 0px 0px !important;
} }