Merge branch 'develop' of github.com:Frappet/bma-ehr-frontend into me

This commit is contained in:
Thanit Konmek 2023-08-23 14:58:02 +07:00
commit e4ba225018
6 changed files with 2140 additions and 655 deletions

View file

@ -29,8 +29,8 @@ const assignId = ref<string>(route.params.form.toString());
const personalId = ref<string>(route.params.personalId.toString());
const saveEdit = (id: string) => {
dialogConfirm($q, () => console.log("save"))
}
dialogConfirm($q, () => console.log("save"));
};
const edit = () => {
status.value = true;
@ -54,7 +54,7 @@ const dataArr = ref<any>();
const props = defineProps({
tab: String,
data: Object,
action: String
action: String,
});
const list2_1 = [
@ -108,7 +108,7 @@ onMounted(async () => {
// fecthFormdata();
// }
// console.log("props===>", props)
if (props.tab && props.action == 'edit') {
if (props.tab && props.action == "edit") {
evaluate_no.value = Number(props.tab.charAt(4));
dataArr.value = await props.data;
fecthAssign();
@ -116,13 +116,13 @@ onMounted(async () => {
});
watch(props, async () => {
if (props.tab && props.action == 'edit') {
if (props.tab && props.action == "edit") {
evaluate_no.value = Number(props.tab.charAt(4));
dataArr.value = await props.data;
fecthAssign();
// console.log("props===>", props);
}
})
});
// onMounted(async () => {
// if (props.tab !== undefined) {
@ -138,7 +138,7 @@ const fecthAssign = async () => {
await http
.get(config.API.evaluateCreate(assignId.value))
.then(async (res: any) => {
if (props.action == 'add') {
if (props.action == "add") {
person.value = res.data.data.person;
assign.value = res.data.data.assign;
commander.value = res.data.data.commander;
@ -148,7 +148,6 @@ const fecthAssign = async () => {
evaluate_no.value = res.data.data.evaluate_no;
start_date.value = res.data.data.start_date;
date_finish.value = res.data.data.end_date;
}
// console.log(props.tab, res.data.data.evaluate_no);
@ -158,8 +157,9 @@ const fecthAssign = async () => {
})
.catch((e) => {
messageError($q, e);
}).finally(() => {
if (props.action == 'edit') {
})
.finally(() => {
if (props.action == "edit") {
fetchEvaluate();
}
hideLoader();
@ -210,13 +210,10 @@ const fetchEvaluate = async () => {
data.achievement_other_level !== null
) {
etc.value = true;
}
if (
data.behavior_other_desc !== "" &&
data.behavior_other_level !== null
) {
} else etc.value = false;
if (data.behavior_other_desc !== "" && data.behavior_other_level !== null) {
etc2.value = true;
}
} else etc2.value = false;
status.value = false;
// })
// .catch((e) => {
@ -346,7 +343,10 @@ const save = () => {
dialogConfirm($q, async () => {
await http
.put(config.API.editFormEvaluateCommader(assignId.value, evaluate_id.value), data)
.put(
config.API.editFormEvaluateCommader(assignId.value, evaluate_id.value),
data
)
.then((res: any) => {
// console.log(res);
status.value = false;
@ -356,7 +356,7 @@ const save = () => {
messageError($q, e);
});
});
};
};
</script>
<template>
@ -365,7 +365,13 @@ const save = () => {
<div>แบบประเมนผล (งคบบญชา)</div>
<q-space />
<div v-if="status == false">
<q-btn flat round color="primary" @click="edit()" icon="mdi-pencil-outline">
<q-btn
flat
round
color="primary"
@click="edit()"
icon="mdi-pencil-outline"
>
<q-tooltip>แกไขขอม</q-tooltip>
</q-btn>
</div>
@ -373,12 +379,16 @@ const save = () => {
<q-btn flat round color="red" @click="cancel()" icon="mdi-undo">
<q-tooltip>ยกเล</q-tooltip>
</q-btn>
<q-btn flat round color="public" @click="savaForm()" icon="mdi-content-save-outline">
<q-btn
flat
round
color="public"
@click="savaForm()"
icon="mdi-content-save-outline"
>
<q-tooltip>นทกขอม</q-tooltip>
</q-btn>
</div>
</div>
<div class="col-12 row">
<div class="col-12 text-top0 row items-center">
@ -418,11 +428,19 @@ const save = () => {
<q-item-section>
<q-item-label>
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
1.1. ความรความสามารถ</q-item-label>
1.1. ความรความสามารถ</q-item-label
>
</q-item-section>
<q-item-section side>
<q-rating v-model="knowledge_level" max="5" size="sm" color="grey" :color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม" :disable="!status">
<q-rating
v-model="knowledge_level"
max="5"
size="sm"
color="grey"
:color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม"
:disable="!status"
>
<template v-slot:tip-1>
<q-tooltip>ำกวาความคาดหวงมาก</q-tooltip>
</template>
@ -450,11 +468,19 @@ const save = () => {
<q-item-section>
<q-item-label>
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
1.2. กษะ</q-item-label>
1.2. กษะ</q-item-label
>
</q-item-section>
<q-item-section side>
<q-rating v-model="skill_level" max="5" size="sm" color="grey" :color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม" :disable="!status">
<q-rating
v-model="skill_level"
max="5"
size="sm"
color="grey"
:color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม"
:disable="!status"
>
<template v-slot:tip-1>
<q-tooltip>ำกวาความคาดหวงมาก</q-tooltip>
</template>
@ -482,11 +508,19 @@ const save = () => {
<q-item-section>
<q-item-label>
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
1.3. สมมรถนะ</q-item-label>
1.3. สมมรถนะ</q-item-label
>
</q-item-section>
<q-item-section side>
<q-rating v-model="competency_level" max="5" size="sm" color="grey" :color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม" :disable="!status">
<q-rating
v-model="competency_level"
max="5"
size="sm"
color="grey"
:color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม"
:disable="!status"
>
<template v-slot:tip-1>
<q-tooltip>ำกวาความคาดหวงมาก</q-tooltip>
</template>
@ -514,11 +548,19 @@ const save = () => {
<q-item-section>
<q-item-label>
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
1.4. ความสามารถในการเรยนรงาน</q-item-label>
1.4. ความสามารถในการเรยนรงาน</q-item-label
>
</q-item-section>
<q-item-section side>
<q-rating v-model="learn_level" max="5" size="sm" color="grey" :color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม" :disable="!status">
<q-rating
v-model="learn_level"
max="5"
size="sm"
color="grey"
:color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม"
:disable="!status"
>
<template v-slot:tip-1>
<q-tooltip>ำกวาความคาดหวงมาก</q-tooltip>
</template>
@ -546,11 +588,19 @@ const save = () => {
<q-item-section>
<q-item-label>
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
1.5. ความสามารถในการปรบใชความรบงานในหนาท</q-item-label>
1.5. ความสามารถในการปรบใชความรบงานในหนาท</q-item-label
>
</q-item-section>
<q-item-section side>
<q-rating v-model="apply_level" max="5" size="sm" color="grey" :color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม" :disable="!status">
<q-rating
v-model="apply_level"
max="5"
size="sm"
color="grey"
:color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม"
:disable="!status"
>
<template v-slot:tip-1>
<q-tooltip>ำกวาความคาดหวงมาก</q-tooltip>
</template>
@ -578,11 +628,19 @@ const save = () => {
<q-item-section>
<q-item-label>
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
1.6. ความสำเรจของงานทไดบมอบหมาย</q-item-label>
1.6. ความสำเรจของงานทไดบมอบหมาย</q-item-label
>
</q-item-section>
<q-item-section side>
<q-rating v-model="success_level" max="5" size="sm" color="grey" :color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม" :disable="!status">
<q-rating
v-model="success_level"
max="5"
size="sm"
color="grey"
:color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม"
:disable="!status"
>
<template v-slot:tip-1>
<q-tooltip>ำกวาความคาดหวงมาก</q-tooltip>
</template>
@ -611,9 +669,15 @@ const save = () => {
<q-item-label>
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
1.7 นๆ
<q-checkbox class="q-ml-sm" :disable="!status" dense v-model="etc" @click="
(achievement_other.text = ''), (achievement_other.level = 0)
" /></q-item-label>
<q-checkbox
class="q-ml-sm"
:disable="!status"
dense
v-model="etc"
@click="
(achievement_other.text = ''), (achievement_other.level = 0)
"
/></q-item-label>
</q-item-section>
</q-item>
</q-list>
@ -624,15 +688,32 @@ const save = () => {
<q-item dense tag="label" v-ripple>
<q-item-section class="q-ml-md">
<q-item-label>
<q-input v-model="achievement_other.text" label="กรอกอื่นๆ" dense :disable="!status" lazy-rules autogrow
hide-bottom-space outlined class="bg-white" :rules="[
<q-input
v-model="achievement_other.text"
label="กรอกอื่นๆ"
dense
:disable="!status"
lazy-rules
autogrow
hide-bottom-space
outlined
class="bg-white"
:rules="[
(val) => (val && val.length > 0) || 'กรุณากรอกข้อความ',
]" />
]"
/>
</q-item-label>
</q-item-section>
<q-item-section side>
<q-rating v-model="achievement_other.level" max="5" size="sm" :disable="!status" color="grey"
:color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม">
<q-rating
v-model="achievement_other.level"
max="5"
size="sm"
:disable="!status"
color="grey"
:color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม"
>
<template v-slot:tip-1>
<q-tooltip>ำกวาความคาดหวงมาก</q-tooltip>
</template>
@ -667,15 +748,27 @@ const save = () => {
<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"
>
<q-list dense v-for="(list, i) in list2_1" :key="i">
<q-item dense tag="label" v-ripple>
<q-item-section>
<q-item-label>{{ list.label }}</q-item-label>
</q-item-section>
<q-item-section side>
<q-rating v-model="conduct_level[i]" :val="list.id" max="5" :disable="!status" size="sm" color="grey"
:color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม">
<q-rating
v-model="conduct_level[i]"
:val="list.id"
max="5"
:disable="!status"
size="sm"
color="grey"
:color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม"
>
<template v-slot:tip-1>
<q-tooltip>ำกวาความคาดหวงมาก</q-tooltip>
</template>
@ -703,15 +796,27 @@ const save = () => {
<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"
>
<q-list dense v-for="(list, i) in list2_2" :key="i">
<q-item dense tag="label" v-ripple>
<q-item-section>
<q-item-label>{{ list.label }}</q-item-label>
</q-item-section>
<q-item-section side>
<q-rating v-model="moral_level[i]" :val="list.id" max="5" size="sm" :disable="!status" color="grey"
:color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม">
<q-rating
v-model="moral_level[i]"
:val="list.id"
max="5"
size="sm"
:disable="!status"
color="grey"
:color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม"
>
<template v-slot:tip-1>
<q-tooltip>ำกวาความคาดหวงมาก</q-tooltip>
</template>
@ -739,15 +844,27 @@ const save = () => {
<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"
>
<q-list dense v-for="(list, i) in list2_3" :key="i">
<q-item dense tag="label" v-ripple>
<q-item-section>
<q-item-label>{{ list.label }}</q-item-label>
</q-item-section>
<q-item-section side>
<q-rating v-model="discipline_level[i]" :val="list.id" max="5" size="sm" :disable="!status" color="grey"
:color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม">
<q-rating
v-model="discipline_level[i]"
:val="list.id"
max="5"
size="sm"
:disable="!status"
color="grey"
:color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม"
>
<template v-slot:tip-1>
<q-tooltip>ำกวาความคาดหวงมาก</q-tooltip>
</template>
@ -774,23 +891,50 @@ const save = () => {
<div class="col-12 text-top0 row items-center q-pl-lg">
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
2.4 นๆ
<q-checkbox class="q-ml-sm" dense v-model="etc2" :disable="!status"
@click="(behavio_orther.text = ''), (behavio_orther.level = 0)" />
<q-checkbox
class="q-ml-sm"
dense
v-model="etc2"
:disable="!status"
@click="(behavio_orther.text = ''), (behavio_orther.level = 0)"
/>
</div>
<q-card v-if="etc2" flat bordered class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1">
<q-card
v-if="etc2"
flat
bordered
class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1"
>
<q-list dense>
<q-item dense tag="label" v-ripple>
<q-item-section>
<q-item-label>
<q-input v-model="behavio_orther.text" label="กรอกอื่นๆ" dense :disable="!status" lazy-rules autogrow
hide-bottom-space outlined class="bg-white" :rules="[
<q-input
v-model="behavio_orther.text"
label="กรอกอื่นๆ"
dense
:disable="!status"
lazy-rules
autogrow
hide-bottom-space
outlined
class="bg-white"
:rules="[
(val) => (val && val.length > 0) || 'กรุณากรอกข้อความ',
]" />
]"
/>
</q-item-label>
</q-item-section>
<q-item-section side>
<q-rating v-model="behavio_orther.level" max="5" size="sm" :disable="!status" color="grey"
:color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม">
<q-rating
v-model="behavio_orther.level"
max="5"
size="sm"
:disable="!status"
color="grey"
:color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม"
>
<template v-slot:tip-1>
<q-tooltip>ำกวาความคาดหวงมาก</q-tooltip>
</template>
@ -819,18 +963,39 @@ const save = () => {
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
ดเด (ไมเก 5 บรรท)
</div>
<q-input outlined dense v-model="behavio_strength_desc" class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
lazy-rules type="textarea" :disable="!status" label="กรอกจุดเด่น" hide-bottom-space :row="5"
:rules="behavio_strengthRules" ref="behavio_strengthRef" />
<q-input
outlined
dense
v-model="behavio_strength_desc"
class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
lazy-rules
type="textarea"
:disable="!status"
label="กรอกจุดเด่น"
hide-bottom-space
:row="5"
:rules="behavio_strengthRules"
ref="behavio_strengthRef"
/>
</div>
<div class="col-12 row">
<div class="col-12 text-top0 row items-center q-pl-lg">
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
งทควรปรบปร (ไมเก 5 บรรท)
</div>
<q-input outlined dense v-model="behavior_improve_desc" class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
lazy-rules type="textarea" hide-bottom-space label="กรอกสิ่งที่ควรปรับปรุง" :disable="!status" :row="5"
ref="behavio_inproveRef" />
<q-input
outlined
dense
v-model="behavior_improve_desc"
class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
lazy-rules
type="textarea"
hide-bottom-space
label="กรอกสิ่งที่ควรปรับปรุง"
:disable="!status"
:row="5"
ref="behavio_inproveRef"
/>
</div>
</div>
</div>
@ -843,7 +1008,11 @@ const save = () => {
<q-avatar class="bg-grey-2 q-mr-sm" size="28px">3</q-avatar>
การพฒนาผทดลองปฏหนาทราชการ
</div>
<q-card flat bordered class="col-xs-12 col-sm-11 col-md-11 q-pa-sm bg-grey-1">
<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-section>
@ -851,10 +1020,22 @@ const save = () => {
</q-item-section>
<q-item-section side>
<div class="row">
<q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" v-model="orientation" val="1"
label="ดำเนินการเเล้ว" :disable="!status" />
<q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" v-model="orientation"
:disable="!status" val="0" label=" ยังไม่ได้ดำเนินการ" />
<q-radio
checked-icon="task_alt"
unchecked-icon="panorama_fish_eye"
v-model="orientation"
val="1"
label="ดำเนินการเเล้ว"
:disable="!status"
/>
<q-radio
checked-icon="task_alt"
unchecked-icon="panorama_fish_eye"
v-model="orientation"
:disable="!status"
val="0"
label=" ยังไม่ได้ดำเนินการ"
/>
</div>
</q-item-section>
</q-item>
@ -865,10 +1046,22 @@ const save = () => {
</q-item-section>
<q-item-section side>
<div class="row">
<q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" v-model="self_learning"
:disable="!status" val="1" label="ดำเนินการเเล้ว" />
<q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" :disable="!status"
v-model="self_learning" val="0" label=" ยังไม่ได้ดำเนินการ" />
<q-radio
checked-icon="task_alt"
unchecked-icon="panorama_fish_eye"
v-model="self_learning"
:disable="!status"
val="1"
label="ดำเนินการเเล้ว"
/>
<q-radio
checked-icon="task_alt"
unchecked-icon="panorama_fish_eye"
:disable="!status"
v-model="self_learning"
val="0"
label=" ยังไม่ได้ดำเนินการ"
/>
</div>
</q-item-section>
</q-item>
@ -879,24 +1072,50 @@ const save = () => {
</q-item-section>
<q-item-section side>
<div class="row">
<q-radio checked-icon="task_alt" :disable="!status" unchecked-icon="panorama_fish_eye"
v-model="training_seminar" val="1" label="ดำเนินการเเล้ว" />
<q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" v-model="training_seminar"
:disable="!status" val="0" label=" ยังไม่ได้ดำเนินการ" />
<q-radio
checked-icon="task_alt"
:disable="!status"
unchecked-icon="panorama_fish_eye"
v-model="training_seminar"
val="1"
label="ดำเนินการเเล้ว"
/>
<q-radio
checked-icon="task_alt"
unchecked-icon="panorama_fish_eye"
v-model="training_seminar"
:disable="!status"
val="0"
label=" ยังไม่ได้ดำเนินการ"
/>
</div>
</q-item-section>
</q-item>
<q-separator class="q-my-xs" />
<q-item dense tag="label" v-ripple>
<q-item-section>
<q-item-label>4. การอบรมอ ตามทหนวยงานกำหนด (าม)</q-item-label>
<q-item-label
>4. การอบรมอ ตามทหนวยงานกำหนด (าม)</q-item-label
>
</q-item-section>
<q-item-section side>
<div class="row">
<q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" v-model="other_training" val="1"
:disable="!status" label="ดำเนินการเเล้ว" />
<q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" v-model="other_training"
:disable="!status" val="0" label=" ยังไม่ได้ดำเนินการ" />
<q-radio
checked-icon="task_alt"
unchecked-icon="panorama_fish_eye"
v-model="other_training"
val="1"
:disable="!status"
label="ดำเนินการเเล้ว"
/>
<q-radio
checked-icon="task_alt"
unchecked-icon="panorama_fish_eye"
v-model="other_training"
:disable="!status"
val="0"
label=" ยังไม่ได้ดำเนินการ"
/>
</div>
</q-item-section>
</q-item>
@ -910,11 +1129,26 @@ const save = () => {
<div class="col-12 row">
<div class="col-12 text-top2 row items-center">งคบบญชา</div>
<div class="col-12 row q-col-gutter-md">
<q-select class="col-xs-12 col-sm-8" dense v-model="Autherise" outlined :options="option" label="ผู้บังคับบัญชา"
disable />
<q-select
class="col-xs-12 col-sm-8"
dense
v-model="Autherise"
outlined
:options="option"
label="ผู้บังคับบัญชา"
disable
/>
<div class="col-xs-12 col-sm-4">
<datepicker menu-class-name="modalfix" v-model="dateAutherise" :locale="'th'" autoApply borderless
:enableTimePicker="false" :readonly="!status" week-start="0">
<datepicker
menu-class-name="modalfix"
v-model="dateAutherise"
:locale="'th'"
autoApply
borderless
:enableTimePicker="false"
:readonly="!status"
week-start="0"
>
<template #year="{ year }">
{{ year + 543 }}
</template>
@ -922,10 +1156,23 @@ const save = () => {
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input outlined dense class="full-width datepicker col-3" :model-value="dateAutherise != null ? date2Thai(dateAutherise) : null
" :label="`${'ลงวันที่'}`" :disable="!status" :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่'}`]">
<q-input
outlined
dense
class="full-width datepicker col-3"
:model-value="
dateAutherise != null ? date2Thai(dateAutherise) : null
"
:label="`${'ลงวันที่'}`"
:disable="!status"
:rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่'}`]"
>
<template v-slot:prepend>
<q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
<q-icon
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
</q-icon>
</template>
</q-input>
@ -938,7 +1185,12 @@ const save = () => {
<!-- <Footer /> -->
<q-toolbar class="text-primary">
<q-space />
<q-btn v-if="routeName == 'FormEvaluateAdd'" label="บันทึก" color="secondary" @click="savaForm" />
<q-btn
v-if="routeName == 'FormEvaluateAdd'"
label="บันทึก"
color="secondary"
@click="savaForm"
/>
</q-toolbar>
</div>
</template>

View file

@ -27,8 +27,8 @@ const route = useRoute();
const assignId = ref<string>(route.params.form.toString());
const personalId = ref<string>(route.params.personalId.toString());
const saveEdit = (id: string) => {
dialogConfirm($q, () => console.log("save"))
}
dialogConfirm($q, () => console.log("save"));
};
const edit = () => {
status.value = true;
// console.log(status.value);
@ -53,7 +53,7 @@ const round = ref<any>();
const props = defineProps({
tab: String,
data: Object,
action: String
action: String,
});
onMounted(async () => {
@ -61,7 +61,7 @@ onMounted(async () => {
// fecthFormdata();
// }
// console.log("props===>", props)
if (props.tab && props.action == 'edit') {
if (props.tab && props.action == "edit") {
evaluate_no.value = Number(props.tab.charAt(4));
dataArr.value = await props.data;
fecthAssign();
@ -69,13 +69,13 @@ onMounted(async () => {
});
watch(props, async () => {
if (props.tab && props.action == 'edit') {
if (props.tab && props.action == "edit") {
evaluate_no.value = Number(props.tab.charAt(4));
dataArr.value = await props.data;
fecthAssign();
// console.log("props===>", props);
}
})
});
// onMounted(() => {
// if (props.tab !== undefined) {
@ -91,7 +91,7 @@ const fecthAssign = async () => {
.get(config.API.evaluateChairman(assignId.value))
.then(async (res: any) => {
// console.log(res);
if (props.action == 'add') {
if (props.action == "add") {
assign.value = res.data.data.assign;
evaluate_no.value = res.data.data.evaluate_no;
start_date.value = res.data.data.start_date;
@ -105,7 +105,7 @@ const fecthAssign = async () => {
messageError($q, e);
})
.finally(() => {
if (props.action == 'edit') {
if (props.action == "edit") {
fetchEvaluate();
}
hideLoader();
@ -159,13 +159,10 @@ const fetchEvaluate = async () => {
data.achievement_other_level !== null
) {
etc.value = true;
}
if (
data.behavior_other_desc !== "" &&
data.behavior_other_level !== null
) {
} else etc.value = false;
if (data.behavior_other_desc !== "" && data.behavior_other_level !== null) {
etc2.value = true;
}
} else etc2.value = false;
status.value = false;
// })
@ -452,14 +449,15 @@ const putformData = () => {
dialogConfirm($q, async () => {
console.log("data==>", data);
await http
.put(config.API.editFormEvaluateChairman(assignId.value, evaluate_id.value), data)
.put(
config.API.editFormEvaluateChairman(assignId.value, evaluate_id.value),
data
)
.then((res: any) => {
// console.log(res);
status.value = false;
success($q, "บันทึกสำเร็จ");
router.push(
`/probation/detail/${personalId.value}/${assignId.value}`
);
router.push(`/probation/detail/${personalId.value}/${assignId.value}`);
})
.catch((e: any) => {
messageError($q, e);
@ -501,7 +499,13 @@ const putformData = () => {
<div>แบบประเมนผล (คณะกรรมการ)</div>
<q-space />
<div v-if="status == false">
<q-btn flat round color="primary" @click="edit()" icon="mdi-pencil-outline">
<q-btn
flat
round
color="primary"
@click="edit()"
icon="mdi-pencil-outline"
>
<q-tooltip>แกไขขอม</q-tooltip>
</q-btn>
</div>
@ -509,12 +513,16 @@ const putformData = () => {
<q-btn flat round color="red" @click="cancel()" icon="mdi-undo">
<q-tooltip>ยกเล</q-tooltip>
</q-btn>
<q-btn flat round color="public" @click="savaForm()" icon="mdi-content-save-outline">
<q-btn
flat
round
color="public"
@click="savaForm()"
icon="mdi-content-save-outline"
>
<q-tooltip>นทกขอม</q-tooltip>
</q-btn>
</div>
</div>
<div class="col-12 row">
<div class="col-12 text-top0 row items-center">
@ -554,11 +562,19 @@ const putformData = () => {
<q-item-section>
<q-item-label>
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
1.1. ความสามารถในการเรยนรงาน</q-item-label>
1.1. ความสามารถในการเรยนรงาน</q-item-label
>
</q-item-section>
<q-item-section side>
<q-rating v-model="learn_level" max="5" size="sm" :disable="!status" color="grey"
:color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม">
<q-rating
v-model="learn_level"
max="5"
size="sm"
:disable="!status"
color="grey"
:color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม"
>
<template v-slot:tip-1>
<q-tooltip>ำกวาความคาดหวงมาก</q-tooltip>
</template>
@ -586,11 +602,19 @@ const putformData = () => {
<q-item-section>
<q-item-label>
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
1.2. ความสามารถในการปรบใชความรบงานในหนาท</q-item-label>
1.2. ความสามารถในการปรบใชความรบงานในหนาท</q-item-label
>
</q-item-section>
<q-item-section side>
<q-rating v-model="apply_level" max="5" size="sm" color="grey" :disable="!status"
:color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม">
<q-rating
v-model="apply_level"
max="5"
size="sm"
color="grey"
:disable="!status"
:color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม"
>
<template v-slot:tip-1>
<q-tooltip>ำกวาความคาดหวงมาก</q-tooltip>
</template>
@ -618,11 +642,19 @@ const putformData = () => {
<q-item-section>
<q-item-label>
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
1.3. ความสำเรจของงานทไดบมอบหมาย</q-item-label>
1.3. ความสำเรจของงานทไดบมอบหมาย</q-item-label
>
</q-item-section>
<q-item-section side>
<q-rating v-model="success_level" max="5" :disable="!status" size="sm" color="grey"
:color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม">
<q-rating
v-model="success_level"
max="5"
:disable="!status"
size="sm"
color="grey"
:color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม"
>
<template v-slot:tip-1>
<q-tooltip>ำกวาความคาดหวงมาก</q-tooltip>
</template>
@ -651,9 +683,15 @@ const putformData = () => {
<q-item-label>
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
1.4 นๆ
<q-checkbox class="q-ml-sm" dense :disable="!status" v-model="etc" @click="
(achievement_other.text = ''), (achievement_other.level = 0)
" /></q-item-label>
<q-checkbox
class="q-ml-sm"
dense
:disable="!status"
v-model="etc"
@click="
(achievement_other.text = ''), (achievement_other.level = 0)
"
/></q-item-label>
</q-item-section>
</q-item>
</q-list>
@ -664,15 +702,32 @@ const putformData = () => {
<q-item dense tag="label" v-ripple>
<q-item-section class="q-ml-md">
<q-item-label>
<q-input v-model="achievement_other.text" label="กรอกอื่นๆ" dense lazy-rules autogrow :disable="!status"
hide-bottom-space outlined class="bg-white" :rules="[
<q-input
v-model="achievement_other.text"
label="กรอกอื่นๆ"
dense
lazy-rules
autogrow
:disable="!status"
hide-bottom-space
outlined
class="bg-white"
:rules="[
(val) => (val && val.length > 0) || 'กรุณากรอกข้อความ',
]" />
]"
/>
</q-item-label>
</q-item-section>
<q-item-section side>
<q-rating v-model="achievement_other.level" max="5" size="sm" color="grey" :disable="!status"
:color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม">
<q-rating
v-model="achievement_other.level"
max="5"
size="sm"
color="grey"
:disable="!status"
:color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม"
>
<template v-slot:tip-1>
<q-tooltip>ำกวาความคาดหวงมาก</q-tooltip>
</template>
@ -725,15 +780,27 @@ const putformData = () => {
<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"
>
<q-list dense v-for="(list, i) in list2_1" :key="i">
<q-item dense tag="label" v-ripple>
<q-item-section>
<q-item-label>{{ list.label }}</q-item-label>
</q-item-section>
<q-item-section side>
<q-rating v-model="conduct_level[i]" :val="list.id" max="5" size="sm" :disable="!status" color="grey"
:color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม">
<q-rating
v-model="conduct_level[i]"
:val="list.id"
max="5"
size="sm"
:disable="!status"
color="grey"
:color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม"
>
<template v-slot:tip-1>
<q-tooltip>ำกวาความคาดหวงมาก</q-tooltip>
</template>
@ -761,15 +828,27 @@ const putformData = () => {
<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"
>
<q-list dense v-for="(list, i) in list2_2" :key="i">
<q-item dense tag="label" v-ripple>
<q-item-section>
<q-item-label>{{ list.label }}</q-item-label>
</q-item-section>
<q-item-section side>
<q-rating v-model="moral_level[i]" :val="list.id" :disable="!status" max="5" size="sm" color="grey"
:color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม">
<q-rating
v-model="moral_level[i]"
:val="list.id"
:disable="!status"
max="5"
size="sm"
color="grey"
:color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม"
>
<template v-slot:tip-1>
<q-tooltip>ำกวาความคาดหวงมาก</q-tooltip>
</template>
@ -797,15 +876,27 @@ const putformData = () => {
<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"
>
<q-list dense v-for="(list, i) in list2_3" :key="i">
<q-item dense tag="label" v-ripple>
<q-item-section>
<q-item-label>{{ list.label }}</q-item-label>
</q-item-section>
<q-item-section side>
<q-rating v-model="discipline_level[i]" :val="list.id" :disable="!status" max="5" size="sm" color="grey"
:color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม">
<q-rating
v-model="discipline_level[i]"
:val="list.id"
:disable="!status"
max="5"
size="sm"
color="grey"
:color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม"
>
<template v-slot:tip-1>
<q-tooltip>ำกวาความคาดหวงมาก</q-tooltip>
</template>
@ -832,23 +923,50 @@ const putformData = () => {
<div class="col-12 text-top0 row items-center q-pl-lg">
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
2.4 นๆ
<q-checkbox class="q-ml-sm" dense v-model="etc2" :disable="!status"
@click="(behavio_orther.text = ''), (behavio_orther.level = 0)" />
<q-checkbox
class="q-ml-sm"
dense
v-model="etc2"
:disable="!status"
@click="(behavio_orther.text = ''), (behavio_orther.level = 0)"
/>
</div>
<q-card v-if="etc2" flat bordered class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1">
<q-card
v-if="etc2"
flat
bordered
class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1"
>
<q-list dense>
<q-item dense tag="label" v-ripple>
<q-item-section>
<q-item-label>
<q-input v-model="behavio_orther.text" label="กรอกอื่นๆ" dense lazy-rules :disable="!status" autogrow
hide-bottom-space outlined class="bg-white" :rules="[
<q-input
v-model="behavio_orther.text"
label="กรอกอื่นๆ"
dense
lazy-rules
:disable="!status"
autogrow
hide-bottom-space
outlined
class="bg-white"
:rules="[
(val) => (val && val.length > 0) || 'กรุณากรอกข้อความ',
]" />
]"
/>
</q-item-label>
</q-item-section>
<q-item-section side>
<q-rating v-model="behavio_orther.level" max="5" size="sm" :disable="!status" color="grey"
:color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม">
<q-rating
v-model="behavio_orther.level"
max="5"
size="sm"
:disable="!status"
color="grey"
:color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม"
>
<template v-slot:tip-1>
<q-tooltip>ำกวาความคาดหวงมาก</q-tooltip>
</template>
@ -906,7 +1024,8 @@ const putformData = () => {
<q-item-section>
<q-item-label>
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
3.1. ผลสมฤทธของการทดลองปฏหนาทราชการ</q-item-label>
3.1. ผลสมฤทธของการทดลองปฏหนาทราชการ</q-item-label
>
</q-item-section>
<q-item-section>
<q-item-label style="color: gray">
@ -938,7 +1057,8 @@ const putformData = () => {
<q-item-section>
<q-item-label>
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
3.2. พฤตกรรมของผทดลองปฏหนาทราชการ</q-item-label>
3.2. พฤตกรรมของผทดลองปฏหนาทราชการ</q-item-label
>
</q-item-section>
<q-item-section>
<q-item-label style="color: gray">
@ -1010,34 +1130,68 @@ const putformData = () => {
<div class="col">อยละ</div>
</div>
</div>
<q-card flat bordered class="col-xs-12 col-sm-11 col-md-11 q-pa-sm bg-grey-1">
<q-card
flat
bordered
class="col-xs-12 col-sm-11 col-md-11 q-pa-sm bg-grey-1"
>
<div class="row q-gutter-md align-center">
<div class="col-8">1. การปฐมนเทศ</div>
<div class="col">
<q-input dense type="number" :disable="!status" v-model="orientation" />
<q-input
dense
type="number"
:disable="!status"
v-model="orientation"
/>
</div>
<div class="col">
<q-input dense type="number" :disable="!status" v-model="orientation_percent" />
<q-input
dense
type="number"
:disable="!status"
v-model="orientation_percent"
/>
</div>
</div>
<q-separator class="q-my-xs" />
<div class="row q-gutter-md align-center">
<div class="col-8">2. การเรยนรวยตนเอง</div>
<div class="col">
<q-input dense type="number" :disable="!status" v-model="self_learning" />
<q-input
dense
type="number"
:disable="!status"
v-model="self_learning"
/>
</div>
<div class="col">
<q-input dense type="number" :disable="!status" v-model="self_learning_percent" />
<q-input
dense
type="number"
:disable="!status"
v-model="self_learning_percent"
/>
</div>
</div>
<q-separator class="q-my-xs" />
<div class="row q-gutter-md align-center">
<div class="col-8">3. การอบรมสมนารวมก</div>
<div class="col">
<q-input dense type="number" :disable="!status" v-model="training_seminar" />
<q-input
dense
type="number"
:disable="!status"
v-model="training_seminar"
/>
</div>
<div class="col">
<q-input dense type="number" :disable="!status" v-model="training_seminar_percent" />
<q-input
dense
type="number"
:disable="!status"
v-model="training_seminar_percent"
/>
</div>
</div>
<q-separator class="q-my-xs" />
@ -1046,10 +1200,20 @@ const putformData = () => {
4. การอบรมอ ตามทหนวยงานกำหนด (าม)
</div>
<div class="col">
<q-input dense type="number" :disable="!status" v-model="other_training" />
<q-input
dense
type="number"
:disable="!status"
v-model="other_training"
/>
</div>
<div class="col">
<q-input dense type="number" :disable="!status" v-model="other_training_percent" />
<q-input
dense
type="number"
:disable="!status"
v-model="other_training_percent"
/>
</div>
</div>
<!-- <q-list dense>
@ -1171,9 +1335,19 @@ const putformData = () => {
สรปผลการพฒนา
</div>
<div class="col-12">
<q-select :disable="!status" class="col-xs-12" dense v-model="develop_result" outlined
:options="develop_result_option" option-label="name" option-value="value" label="เลือกสรุปผลการพัฒนา"
map-options emit-value />
<q-select
:disable="!status"
class="col-xs-12"
dense
v-model="develop_result"
outlined
:options="develop_result_option"
option-label="name"
option-value="value"
label="เลือกสรุปผลการพัฒนา"
map-options
emit-value
/>
</div>
</div>
</div>
@ -1185,9 +1359,19 @@ const putformData = () => {
สรปผล การประเมนผลทดลองปฎหนาทราชการ
</div>
<div class="col-12">
<q-select :disable="!status" class="col-xs-12" dense v-model="evaluate_result" outlined
:options="evaluate_result_option" option-label="name" option-value="value"
label="เลือกสรุปผล การประเมินผลทดลองปฎิบัติหน้าที่ราชการ" map-options emit-value />
<q-select
:disable="!status"
class="col-xs-12"
dense
v-model="evaluate_result"
outlined
:options="evaluate_result_option"
option-label="name"
option-value="value"
label="เลือกสรุปผล การประเมินผลทดลองปฎิบัติหน้าที่ราชการ"
map-options
emit-value
/>
</div>
</div>
</div>
@ -1200,10 +1384,25 @@ const putformData = () => {
งคบบญชาผมอบหมายงาน
</div>
<div class="col-12 row q-col-gutter-md">
<q-select class="col-xs-12 col-sm-8" dense v-model="commander.name" outlined label="ผู้บังคับบัญชา" disable />
<q-select
class="col-xs-12 col-sm-8"
dense
v-model="commander.name"
outlined
label="ผู้บังคับบัญชา"
disable
/>
<div class="col-xs-12 col-sm-4">
<datepicker menu-class-name="modalfix" v-model="dateAutherise" :locale="'th'" autoApply borderless
:readonly="!status" :enableTimePicker="false" week-start="0">
<datepicker
menu-class-name="modalfix"
v-model="dateAutherise"
:locale="'th'"
autoApply
borderless
:readonly="!status"
:enableTimePicker="false"
week-start="0"
>
<template #year="{ year }">
{{ year + 543 }}
</template>
@ -1211,10 +1410,23 @@ const putformData = () => {
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input outlined dense :disable="!status" class="full-width datepicker col-3" :model-value="dateAutherise != null ? date2Thai(dateAutherise) : null
" :label="`${'ลงวันที่'}`" :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่'}`]">
<q-input
outlined
dense
:disable="!status"
class="full-width datepicker col-3"
:model-value="
dateAutherise != null ? date2Thai(dateAutherise) : null
"
:label="`${'ลงวันที่'}`"
:rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่'}`]"
>
<template v-slot:prepend>
<q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
<q-icon
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
</q-icon>
</template>
</q-input>
@ -1223,10 +1435,25 @@ const putformData = () => {
</div>
</div>
<div class="col-12 row q-col-gutter-md">
<q-select class="col-xs-12 col-sm-8" dense v-model="mentors[0].name" outlined label="ผู้บังคับบัญชา" disable />
<q-select
class="col-xs-12 col-sm-8"
dense
v-model="mentors[0].name"
outlined
label="ผู้บังคับบัญชา"
disable
/>
<div class="col-xs-12 col-sm-4">
<datepicker menu-class-name="modalfix" v-model="dateAutherise" :locale="'th'" autoApply borderless
:readonly="!status" :enableTimePicker="false" week-start="0">
<datepicker
menu-class-name="modalfix"
v-model="dateAutherise"
:locale="'th'"
autoApply
borderless
:readonly="!status"
:enableTimePicker="false"
week-start="0"
>
<template #year="{ year }">
{{ year + 543 }}
</template>
@ -1234,10 +1461,23 @@ const putformData = () => {
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input outlined :disable="!status" dense class="full-width datepicker col-3" :model-value="dateAutherise != null ? date2Thai(dateAutherise) : null
" :label="`${'ลงวันที่'}`" :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่'}`]">
<q-input
outlined
:disable="!status"
dense
class="full-width datepicker col-3"
:model-value="
dateAutherise != null ? date2Thai(dateAutherise) : null
"
:label="`${'ลงวันที่'}`"
:rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่'}`]"
>
<template v-slot:prepend>
<q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
<q-icon
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
</q-icon>
</template>
</q-input>
@ -1246,10 +1486,25 @@ const putformData = () => {
</div>
</div>
<div class="col-12 row q-col-gutter-md">
<q-select class="col-xs-12 col-sm-8" dense v-model="mentors[1].name" outlined label="ผู้บังคับบัญชา" disable />
<q-select
class="col-xs-12 col-sm-8"
dense
v-model="mentors[1].name"
outlined
label="ผู้บังคับบัญชา"
disable
/>
<div class="col-xs-12 col-sm-4">
<datepicker menu-class-name="modalfix" v-model="dateAutherise" :locale="'th'" autoApply borderless
:readonly="!status" :enableTimePicker="false" week-start="0">
<datepicker
menu-class-name="modalfix"
v-model="dateAutherise"
:locale="'th'"
autoApply
borderless
:readonly="!status"
:enableTimePicker="false"
week-start="0"
>
<template #year="{ year }">
{{ year + 543 }}
</template>
@ -1257,10 +1512,23 @@ const putformData = () => {
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input outlined dense :disable="!status" class="full-width datepicker col-3" :model-value="dateAutherise != null ? date2Thai(dateAutherise) : null
" :label="`${'ลงวันที่'}`" :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่'}`]">
<q-input
outlined
dense
:disable="!status"
class="full-width datepicker col-3"
:model-value="
dateAutherise != null ? date2Thai(dateAutherise) : null
"
:label="`${'ลงวันที่'}`"
:rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่'}`]"
>
<template v-slot:prepend>
<q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
<q-icon
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
</q-icon>
</template>
</q-input>
@ -1275,10 +1543,25 @@ const putformData = () => {
<div class="col-12 row">
<div class="col-12 text-top2 row items-center">คณะกรรมการ</div>
<div class="col-12 row q-col-gutter-md">
<q-select class="col-xs-12 col-sm-8" dense v-model="chairman.name" outlined label="คณะกรรมการ" disable />
<q-select
class="col-xs-12 col-sm-8"
dense
v-model="chairman.name"
outlined
label="คณะกรรมการ"
disable
/>
<div class="col-xs-12 col-sm-4">
<datepicker menu-class-name="modalfix" v-model="dateAutherise" :locale="'th'" autoApply borderless
:enableTimePicker="false" :readonly="!status" week-start="0">
<datepicker
menu-class-name="modalfix"
v-model="dateAutherise"
:locale="'th'"
autoApply
borderless
:enableTimePicker="false"
:readonly="!status"
week-start="0"
>
<template #year="{ year }">
{{ year + 543 }}
</template>
@ -1286,10 +1569,23 @@ const putformData = () => {
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input outlined :disable="!status" dense class="full-width datepicker col-3" :model-value="dateAutherise != null ? date2Thai(dateAutherise) : null
" :label="`${'ลงวันที่'}`" :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่'}`]">
<q-input
outlined
:disable="!status"
dense
class="full-width datepicker col-3"
:model-value="
dateAutherise != null ? date2Thai(dateAutherise) : null
"
:label="`${'ลงวันที่'}`"
:rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่'}`]"
>
<template v-slot:prepend>
<q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
<q-icon
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
</q-icon>
</template>
</q-input>
@ -1302,7 +1598,12 @@ const putformData = () => {
<q-toolbar class="text-primary">
<q-space />
<q-btn v-if="routeName == 'probationFormAddevaluascore'" label="บันทึก" color="secondary" @click="savaForm" />
<q-btn
v-if="routeName == 'probationFormAddevaluascore'"
label="บันทึก"
color="secondary"
@click="savaForm"
/>
</q-toolbar>
</div>
</template>

View file

@ -22,7 +22,7 @@ const {
const route = useRoute();
const assignId = ref<string>(route.params.form.toString());
const personalId = ref<string>(route.params.personalId.toString());
const action = ref<string>('add')
const action = ref<string>("add");
const assign = ref<any>([]);
const mentors = ref<any>([]);
const commander = ref<any>([]);
@ -93,7 +93,7 @@ const fecthResult = async (id: string) => {
director1_dated.value = data.director1_dated;
director2_dated.value = data.director2_dated;
status.value = false;
action.value = 'edit';
action.value = "edit";
})
.catch((e) => {
console.log(e);
@ -142,9 +142,7 @@ const postData = async () => {
.post(config.API.createformReport(assignId.value), data)
.then(() => {
success($q, "บันทึกสำเร็จ");
router.push(
`/probation/detail/${personalId.value}/${assignId.value}`
);
router.push(`/probation/detail/${personalId.value}/${assignId.value}`);
})
.catch((e: any) => {
console.log(e);
@ -160,7 +158,13 @@ const postData = async () => {
<q-space />
<div v-if="action == 'edit'">
<div v-if="status == false">
<q-btn flat round color="primary" @click="edit()" icon="mdi-pencil-outline">
<q-btn
flat
round
color="primary"
@click="edit()"
icon="mdi-pencil-outline"
>
<q-tooltip>แกไขขอม</q-tooltip>
</q-btn>
</div>
@ -168,103 +172,32 @@ const postData = async () => {
<q-btn flat round color="red" @click="cancel()" icon="mdi-undo">
<q-tooltip>ยกเล</q-tooltip>
</q-btn>
<q-btn flat round color="public" @click="saveEdit(assignId)" icon="mdi-content-save-outline">
<q-btn
flat
round
color="public"
@click="saveEdit(assignId)"
icon="mdi-content-save-outline"
>
<q-tooltip>นทกขอม</q-tooltip>
</q-btn>
</div>
</div>
</div>
<div class="row col-12">
<div class="col-12 row q-col-gutter-md">
<div class="col-xs-12 col-sm-6">
<datepicker menu-class-name="modalfix" v-model="date_start" :locale="'th'" autoApply borderless
:readonly="!status" :enableTimePicker="false" week-start="0">
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input outlined dense :disable="!status" class="full-width datepicker" :model-value="date_start != null ? date2Thai(date_start) : null
" :label="`${'ระหว่างวันที่'}`" :rules="[(val) => !!val || `${'กรุณาเลือกวันที่'}`]">
<template v-slot:prepend>
<q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
</q-icon>
</template>
</q-input>
</template>
</datepicker>
</div>
<div class="col-xs-12 col-sm-6">
<datepicker menu-class-name="modalfix" v-model="date_finish" :locale="'th'" autoApply :readonly="!status"
borderless :enableTimePicker="false" week-start="0">
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input outlined dense :disable="!status" class="full-width datepicker" :model-value="date_finish != null ? date2Thai(date_finish) : null
" :label="`${'ถึงวันที่'}`" :rules="[(val) => !!val || `${'กรุณาเลือกวันที่'}`]">
<template v-slot:prepend>
<q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
</q-icon>
</template>
</q-input>
</template>
</datepicker>
</div>
</div>
</div>
<div class="col-12 row q-mt-xs">
<div class="col-12 row q-col-gutter-md">
<div class="col-xs-12 col-sm-6">
<q-select :rules="[
(val) =>
!!val || 'กรุณาเลือกการพัฒนาในระหว่างทดลองปฏิบัติหน้าที่ราชการ',
]" hide-bottom-space :options="options" class="col-xs-12 col-sm-6" dense borderless :disable="!status"
emit-value map-options option-label="label" option-value="value" outlined v-model="develop"
label="การพัฒนาในระหว่างทดลองปฏิบัติหน้าที่ราชการ" />
</div>
</div>
</div>
<div class="col-12 row q-mt-lg">
<div class="col-12 row q-col-gutter-md">
<div class="col-xs-12 col-sm-6">
<q-select :rules="[
(val) =>
!!val || 'กรุณาเลือกผลการประเมินการทดลองปฏิบัติหน้าที่ราชการ',
]" hide-bottom-space :options="optionsResult" class="col-xs-12 col-sm-6" :disable="!status" dense borderless
emit-value map-options option-label="label" option-value="value" outlined v-model="result"
label="ผลการประเมินการทดลองปฏิบัติหน้าที่ราชการ" />
</div>
</div>
</div>
<div class="col-12 row q-mt-lg">
<div class="col-12">
<q-input hide-bottom-space dense borderless outlined :disable="!status" class="bg-white" type="textarea"
v-model="reson" label="เหตุผล" :rules="[(val) => !!val || 'กรุณาระบุเหตุผล']" />
</div>
</div>
<div class="col-12 q-mt-lg">
<q-separator size="3px" color="grey-2" />
</div>
<div class="row col-12 q-gutter-lg q-mt-sm">
<div class="col-12 row">
<div class="col-12 text-top2 row items-center">
ประธานคณะกรรมการประเมนผลการปฏหนาทราชการ
</div>
<q-form ref="myForm">
<div class="row col-12">
<div class="col-12 row q-col-gutter-md">
<q-select class="col-xs-12 col-sm-8" dense v-model="director_id" outlined :options="commander" label=""
option-label="name" disable />
<div class="col-xs-12 col-sm-4">
<datepicker menu-class-name="modalfix" v-model="chairman_dated" :locale="'th'" :readonly="!status" autoApply
borderless :enableTimePicker="false" week-start="0">
<div class="col-xs-12 col-sm-6">
<datepicker
menu-class-name="modalfix"
v-model="date_start"
:locale="'th'"
autoApply
borderless
:readonly="!status"
:enableTimePicker="false"
week-start="0"
>
<template #year="{ year }">
{{ year + 543 }}
</template>
@ -272,10 +205,64 @@ const postData = async () => {
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input outlined dense :disable="!status" class="full-width datepicker col-3" :model-value="chairman_dated != null ? date2Thai(chairman_dated) : null
" :label="`${'ลงวันที่'}`" :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่'}`]">
<q-input
outlined
dense
:disable="!status"
class="full-width datepicker"
:model-value="
date_start != null ? date2Thai(date_start) : null
"
:label="`${'ระหว่างวันที่'}`"
:rules="[(val) => !!val || `${'กรุณาเลือกวันที่'}`]"
>
<template v-slot:prepend>
<q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
<q-icon
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
</q-icon>
</template>
</q-input>
</template>
</datepicker>
</div>
<div class="col-xs-12 col-sm-6">
<datepicker
menu-class-name="modalfix"
v-model="date_finish"
:locale="'th'"
autoApply
:readonly="!status"
borderless
:enableTimePicker="false"
week-start="0"
>
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
outlined
dense
:disable="!status"
class="full-width datepicker"
:model-value="
date_finish != null ? date2Thai(date_finish) : null
"
:label="`${'ถึงวันที่'}`"
:rules="[(val) => !!val || `${'กรุณาเลือกวันที่'}`]"
>
<template v-slot:prepend>
<q-icon
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
</q-icon>
</template>
</q-input>
@ -286,75 +273,271 @@ const postData = async () => {
</div>
<div class="col-12 row q-mt-xs">
<div class="col-12 text-top2 row items-center">
คณะกรรมการ
<!-- ความเหนของผอำนาจสงบรรจตามมาตรา 52 -->
</div>
<div class="col-12 row q-col-gutter-md">
<q-select class="col-xs-12 col-sm-8" dense v-model="director_id2" outlined :disable="!status"
:options="optionDirector" label="" option-label="name" />
<div class="col-xs-12 col-sm-4">
<datepicker menu-class-name="modalfix" v-model="director1_dated" :locale="'th'" autoApply borderless
:readonly="!status" :enableTimePicker="false" week-start="0">
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input outlined dense :disable="!status" class="full-width datepicker col-3" :model-value="director1_dated != null
? date2Thai(director1_dated)
: null
" :label="`${'ลงวันที่'}`" :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่'}`]">
<template v-slot:prepend>
<q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
</q-icon>
</template>
</q-input>
</template>
</datepicker>
<div class="col-xs-12 col-sm-6">
<q-select
:rules="[
(val) =>
!!val ||
'กรุณาเลือกการพัฒนาในระหว่างทดลองปฏิบัติหน้าที่ราชการ',
]"
hide-bottom-space
:options="options"
class="col-xs-12 col-sm-6"
dense
borderless
:disable="!status"
emit-value
map-options
option-label="label"
option-value="value"
outlined
v-model="develop"
label="การพัฒนาในระหว่างทดลองปฏิบัติหน้าที่ราชการ"
/>
</div>
</div>
</div>
<div class="col-12 row q-mt-lg">
<div class="col-12 row q-col-gutter-md">
<div class="col-xs-12 col-sm-6">
<q-select
:rules="[
(val) =>
!!val || 'กรุณาเลือกผลการประเมินการทดลองปฏิบัติหน้าที่ราชการ',
]"
hide-bottom-space
:options="optionsResult"
class="col-xs-12 col-sm-6"
:disable="!status"
dense
borderless
emit-value
map-options
option-label="label"
option-value="value"
outlined
v-model="result"
label="ผลการประเมินการทดลองปฏิบัติหน้าที่ราชการ"
/>
</div>
</div>
</div>
<div class="col-12 row q-mt-lg">
<div class="col-12">
<q-input
hide-bottom-space
dense
borderless
outlined
:disable="!status"
class="bg-white"
type="textarea"
v-model="reson"
label="เหตุผล"
:rules="[(val) => !!val || 'กรุณาระบุเหตุผล']"
/>
</div>
</div>
<div class="col-12 row q-mt-xs">
<div class="col-12 text-top2 row items-center">
คณะกรรมการ
<!-- อำนาจสงบรรจตามมาตรา 52 -->
<div class="col-12 q-mt-lg">
<q-separator size="3px" color="grey-2" />
</div>
<div class="row col-12 q-gutter-lg q-mt-sm">
<div class="col-12 row">
<div class="col-12 text-top2 row items-center">
ประธานคณะกรรมการประเมนผลการปฏหนาทราชการ
</div>
<div class="col-12 row q-col-gutter-md">
<q-select
class="col-xs-12 col-sm-8"
dense
v-model="director_id"
outlined
:options="commander"
label=""
option-label="name"
disable
/>
<div class="col-xs-12 col-sm-4">
<datepicker
menu-class-name="modalfix"
v-model="chairman_dated"
:locale="'th'"
:readonly="!status"
autoApply
borderless
:enableTimePicker="false"
week-start="0"
>
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
outlined
dense
:disable="!status"
class="full-width datepicker col-3"
:model-value="
chairman_dated != null ? date2Thai(chairman_dated) : null
"
:label="`${'ลงวันที่'}`"
:rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่'}`]"
>
<template v-slot:prepend>
<q-icon
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
</q-icon>
</template>
</q-input>
</template>
</datepicker>
</div>
</div>
</div>
<div class="col-12 row q-col-gutter-md">
<q-select class="col-xs-12 col-sm-8" dense v-model="director_id3" outlined :options="optionDirector"
:disable="!status" label="" option-label="name" />
<div class="col-xs-12 col-sm-4">
<datepicker menu-class-name="modalfix" v-model="director2_dated" :locale="'th'" autoApply :readonly="!status"
borderless :enableTimePicker="false" week-start="0">
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input outlined dense :disable="!status" class="full-width datepicker col-3" :model-value="director2_dated != null
? date2Thai(director2_dated)
: null
" :label="`${'ลงวันที่'}`" :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่'}`]">
<template v-slot:prepend>
<q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
</q-icon>
</template>
</q-input>
</template>
</datepicker>
<div class="col-12 row q-mt-xs">
<div class="col-12 text-top2 row items-center">
คณะกรรมการ
<!-- ความเหนของผอำนาจสงบรรจตามมาตรา 52 -->
</div>
<div class="col-12 row q-col-gutter-md">
<q-select
class="col-xs-12 col-sm-8"
dense
v-model="director_id2"
outlined
:disable="!status"
:options="optionDirector"
label=""
option-label="name"
/>
<div class="col-xs-12 col-sm-4">
<datepicker
menu-class-name="modalfix"
v-model="director1_dated"
:locale="'th'"
autoApply
borderless
:readonly="!status"
:enableTimePicker="false"
week-start="0"
>
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
outlined
dense
:disable="!status"
class="full-width datepicker col-3"
:model-value="
director1_dated != null
? date2Thai(director1_dated)
: null
"
:label="`${'ลงวันที่'}`"
:rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่'}`]"
>
<template v-slot:prepend>
<q-icon
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
</q-icon>
</template>
</q-input>
</template>
</datepicker>
</div>
</div>
</div>
<div class="col-12 row q-mt-xs">
<div class="col-12 text-top2 row items-center">
คณะกรรมการ
<!-- อำนาจสงบรรจตามมาตรา 52 -->
</div>
<div class="col-12 row q-col-gutter-md">
<q-select
class="col-xs-12 col-sm-8"
dense
v-model="director_id3"
outlined
:options="optionDirector"
:disable="!status"
label=""
option-label="name"
/>
<div class="col-xs-12 col-sm-4">
<datepicker
menu-class-name="modalfix"
v-model="director2_dated"
:locale="'th'"
autoApply
:readonly="!status"
borderless
:enableTimePicker="false"
week-start="0"
>
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
outlined
dense
:disable="!status"
class="full-width datepicker col-3"
:model-value="
director2_dated != null
? date2Thai(director2_dated)
: null
"
:label="`${'ลงวันที่'}`"
:rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่'}`]"
>
<template v-slot:prepend>
<q-icon
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
</q-icon>
</template>
</q-input>
</template>
</datepicker>
</div>
</div>
</div>
</div>
</div>
</q-form>
<q-toolbar class="text-primary">
<q-space />
<q-btn label="บันทึก" color="secondary" @click="savaForm" v-if="action == 'add'" />
<q-btn
label="บันทึก"
color="secondary"
@click="savaForm"
v-if="action == 'add'"
/>
</q-toolbar>
</div>
</template>

View file

@ -51,14 +51,14 @@ const cancel = () => {
const props = defineProps({
tab: String,
data: Object,
action: String
action: String,
});
onMounted(async () => {
// if (props.action == 'add') {
// fecthFormdata();
// }
if (props.tab && props.action == 'edit') {
if (props.tab && props.action == "edit") {
evaluate_no.value = Number(props.tab.charAt(4));
dataArr.value = await props.data;
fecthFormdata();
@ -66,20 +66,20 @@ onMounted(async () => {
});
watch(props, async () => {
if (props.tab && props.action == 'edit') {
if (props.tab && props.action == "edit") {
evaluate_no.value = Number(props.tab.charAt(4));
dataArr.value = await props.data;
fecthFormdata();
// console.log("props===>", props);
// console.log("props===>", props.data);
}
})
});
const fecthFormdata = async () => {
await http
.get(config.API.formevaluateRecord(assignId.value))
.then(async (res: any) => {
// console.log(res);
if (props.action == 'add') {
if (props.action == "add") {
evaluate_no.value = res.data.data.evaluate_no;
start_date.value = res.data.data.start_date;
date_finish.value = res.data.data.end_date;
@ -91,13 +91,17 @@ const fecthFormdata = async () => {
Autherise.value = res.data.data.director.name;
list1_1.value = res.data.data.assign_output;
evaluate_expenct_level.value = await res.data.data.assign_output.map((e: any) => ({
id: e.id,
labal: e.output_desc,
}));
evaluate_ouptut.value = await res.data.data.assign_output.map((e: any) => ({
id: e.id,
}));
evaluate_expenct_level.value = await res.data.data.assign_output.map(
(e: any) => ({
id: e.id,
labal: e.output_desc,
})
);
evaluate_ouptut.value = await res.data.data.assign_output.map(
(e: any) => ({
id: e.id,
})
);
checkArray.value = list1_1.value.length;
@ -107,8 +111,9 @@ const fecthFormdata = async () => {
})
.catch((e: any) => {
console.log(e);
}).finally(() => {
if (props.action == 'edit') {
})
.finally(() => {
if (props.action == "edit") {
fecthFormRound();
}
});
@ -116,6 +121,8 @@ const fecthFormdata = async () => {
const fecthFormRound = async () => {
showLoader();
try {
console.log(dataArr.value);
// await http
// .get(config.API.formevaluateround(assignId.value, round.value))
// .then(async(res: any) => {
@ -158,23 +165,22 @@ const fecthFormRound = async () => {
data.achievement_other_level !== null
) {
etc.value = true;
}
if (
data.behavior_other_desc !== "" &&
data.behavior_other_level !== null
) {
} else etc.value = false;
if (data.behavior_other_desc !== "" && data.behavior_other_level !== null) {
etc2.value = true;
}
} else etc2.value = false;
if (data.achievements) {
await data.achievements.map((e: any, index: number) => {
evaluate_expenct_level.value[index].level = e.evaluate_expect_level
evaluate_ouptut.value[index].text = e.evaluate_output_desc
evaluate_ouptut.value[index].level = e.evaluate_output_level
evaluate_expenct_level.value[index].level = e.evaluate_expect_level;
evaluate_ouptut.value[index].text = e.evaluate_output_desc;
evaluate_ouptut.value[index].level = e.evaluate_output_level;
});
}
status.value = false;
console.log(etc.value);
// })
// .catch((e) => {
// console.log(e);
@ -188,7 +194,6 @@ const fecthFormRound = async () => {
} catch (error) {
hideLoader();
}
};
const list1_1 = ref<any>([]);
@ -426,7 +431,9 @@ const putformData = () => {
// commander_dated: dateAutherise.value,
};
dialogConfirm($q, () => props.action == 'edit' ? editData(data) : saveformdata(data));
dialogConfirm($q, () =>
props.action == "edit" ? editData(data) : saveformdata(data)
);
};
const saveformdata = async (data: any) => {
@ -435,9 +442,7 @@ const saveformdata = async (data: any) => {
.then((res: any) => {
// console.log(res);
success($q, "บันทึกสำเร็จ");
router.push(
`/probation/detail/${personalId.value}/${assignId.value}`
);
router.push(`/probation/detail/${personalId.value}/${assignId.value}`);
})
.catch((e: any) => {
messageError($q, e);
@ -455,7 +460,6 @@ const editData = async (data: any) => {
messageError($q, e);
});
};
</script>
<template>
@ -464,7 +468,13 @@ const editData = async (data: any) => {
<div>แบบบนทกผล</div>
<q-space />
<div v-if="status == false">
<q-btn flat round color="primary" @click="edit()" icon="mdi-pencil-outline">
<q-btn
flat
round
color="primary"
@click="edit()"
icon="mdi-pencil-outline"
>
<q-tooltip>แกไขขอม</q-tooltip>
</q-btn>
</div>
@ -472,7 +482,13 @@ const editData = async (data: any) => {
<q-btn flat round color="red" @click="cancel()" icon="mdi-undo">
<q-tooltip>ยกเล</q-tooltip>
</q-btn>
<q-btn flat round color="public" @click="savaForm()" icon="mdi-content-save-outline">
<q-btn
flat
round
color="public"
@click="savaForm()"
icon="mdi-content-save-outline"
>
<q-tooltip>นทกขอม</q-tooltip>
</q-btn>
</div>
@ -515,15 +531,27 @@ const editData = 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"
>
<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="ระดับการประเมินพฤติกรรม" :disable="!status">
<q-rating
v-model="evaluate_expenct_level[i].level"
:val="list.id"
max="5"
size="sm"
color="grey"
:color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม"
:disable="!status"
>
<template v-slot:tip-1>
<q-tooltip>ำกวาความคาดหวงมาก</q-tooltip>
</template>
@ -554,18 +582,40 @@ const editData = 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"
>
<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>
<!-- <q-item-label>{{ list.label }}</q-item-label> -->
<q-input outlined dense v-model="evaluate_ouptut[i].text" class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
lazy-rules type="textarea" :label="list.label" hide-bottom-space :row="1" :rules="evaluate_ouptutRules"
:disable="!status" />
<q-input
outlined
dense
v-model="evaluate_ouptut[i].text"
class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
lazy-rules
type="textarea"
:label="list.label"
hide-bottom-space
:row="1"
:rules="evaluate_ouptutRules"
:disable="!status"
/>
</q-item-section>
<q-item-section side>
<q-rating v-model="evaluate_ouptut[i].level" :val="list.id" max="5" size="sm" color="grey"
:color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม" :disable="!status">
<q-rating
v-model="evaluate_ouptut[i].level"
:val="list.id"
max="5"
size="sm"
color="grey"
:color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม"
:disable="!status"
>
<template v-slot:tip-1>
<q-tooltip>ำกวาความคาดหวงมาก</q-tooltip>
</template>
@ -596,11 +646,19 @@ const editData = async (data: any) => {
<q-item-section>
<q-item-label>
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
1.2. ความรความสามารถ</q-item-label>
1.2. ความรความสามารถ</q-item-label
>
</q-item-section>
<q-item-section side>
<q-rating v-model="knowledge_level" max="5" size="sm" color="grey" :color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม" :disable="!status">
<q-rating
v-model="knowledge_level"
max="5"
size="sm"
color="grey"
:color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม"
:disable="!status"
>
<template v-slot:tip-1>
<q-tooltip>ำกวาความคาดหวงมาก</q-tooltip>
</template>
@ -628,11 +686,19 @@ const editData = async (data: any) => {
<q-item-section>
<q-item-label>
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
1.3. กษะ</q-item-label>
1.3. กษะ</q-item-label
>
</q-item-section>
<q-item-section side>
<q-rating v-model="skill_level" max="5" size="sm" color="grey" :color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม" :disable="!status">
<q-rating
v-model="skill_level"
max="5"
size="sm"
color="grey"
:color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม"
:disable="!status"
>
<template v-slot:tip-1>
<q-tooltip>ำกวาความคาดหวงมาก</q-tooltip>
</template>
@ -660,11 +726,19 @@ const editData = async (data: any) => {
<q-item-section>
<q-item-label>
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
1.4. สมมรถนะ</q-item-label>
1.4. สมมรถนะ</q-item-label
>
</q-item-section>
<q-item-section side>
<q-rating v-model="competency_level" max="5" size="sm" color="grey" :color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม" :disable="!status">
<q-rating
v-model="competency_level"
max="5"
size="sm"
color="grey"
:color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม"
:disable="!status"
>
<template v-slot:tip-1>
<q-tooltip>ำกวาความคาดหวงมาก</q-tooltip>
</template>
@ -692,11 +766,19 @@ const editData = async (data: any) => {
<q-item-section>
<q-item-label>
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
1.5. ความสามารถในการเรยนรงาน</q-item-label>
1.5. ความสามารถในการเรยนรงาน</q-item-label
>
</q-item-section>
<q-item-section side>
<q-rating v-model="learn_level" max="5" size="sm" color="grey" :color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม" :disable="!status">
<q-rating
v-model="learn_level"
max="5"
size="sm"
color="grey"
:color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม"
:disable="!status"
>
<template v-slot:tip-1>
<q-tooltip>ำกวาความคาดหวงมาก</q-tooltip>
</template>
@ -724,11 +806,19 @@ const editData = async (data: any) => {
<q-item-section>
<q-item-label>
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
1.6. ความสามารถในการปรบใชความรบงานในหนาท</q-item-label>
1.6. ความสามารถในการปรบใชความรบงานในหนาท</q-item-label
>
</q-item-section>
<q-item-section side>
<q-rating v-model="apply_level" max="5" size="sm" color="grey" :color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม" :disable="!status">
<q-rating
v-model="apply_level"
max="5"
size="sm"
color="grey"
:color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม"
:disable="!status"
>
<template v-slot:tip-1>
<q-tooltip>ำกวาความคาดหวงมาก</q-tooltip>
</template>
@ -796,9 +886,15 @@ const editData = async (data: any) => {
<q-item-label>
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
1.7 นๆ
<q-checkbox class="q-ml-sm" dense v-model="etc" @click="
(achievement_other.text = ''), (achievement_other.level = 0)
" :disable="!status" /></q-item-label>
<q-checkbox
class="q-ml-sm"
dense
v-model="etc"
@click="
(achievement_other.text = ''), (achievement_other.level = 0)
"
:disable="!status"
/></q-item-label>
</q-item-section>
</q-item>
</q-list>
@ -809,15 +905,32 @@ const editData = async (data: any) => {
<q-item dense tag="label" v-ripple>
<q-item-section class="q-ml-md">
<q-item-label>
<q-input v-model="achievement_other.text" label="กรอกอื่นๆ" dense lazy-rules autogrow hide-bottom-space
outlined class="bg-white" :rules="[
<q-input
v-model="achievement_other.text"
label="กรอกอื่นๆ"
dense
lazy-rules
autogrow
hide-bottom-space
outlined
class="bg-white"
:rules="[
(val) => (val && val.length > 0) || 'กรุณากรอกข้อความ',
]" :disable="!status" />
]"
:disable="!status"
/>
</q-item-label>
</q-item-section>
<q-item-section side>
<q-rating v-model="achievement_other.level" max="5" size="sm" color="grey" :color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม" :disable="!status">
<q-rating
v-model="achievement_other.level"
max="5"
size="sm"
color="grey"
:color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม"
:disable="!status"
>
<template v-slot:tip-1>
<q-tooltip>ำกวาความคาดหวงมาก</q-tooltip>
</template>
@ -846,18 +959,39 @@ const editData = async (data: any) => {
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
ดเด (ไมเก 5 บรรท)
</div>
<q-input outlined dense v-model="achievement_strength_desc" class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
lazy-rules type="textarea" label="กรอกจุดเด่น" hide-bottom-space :row="5" :rules="achievement_strengthRules"
ref="achievement_strengthRef" :disable="!status" />
<q-input
outlined
dense
v-model="achievement_strength_desc"
class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
lazy-rules
type="textarea"
label="กรอกจุดเด่น"
hide-bottom-space
:row="5"
:rules="achievement_strengthRules"
ref="achievement_strengthRef"
:disable="!status"
/>
</div>
<div class="col-12 row">
<div class="col-12 text-top0 row items-center q-pl-lg">
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
งทควรปรบปร (ไมเก 5 บรรท)
</div>
<q-input outlined dense v-model="achievement_improve_desc" class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
lazy-rules type="textarea" hide-bottom-space label="กรอกสิ่งที่ควรปรับปรุง" :row="5"
ref="achievement_inproveRef" :disable="!status" />
<q-input
outlined
dense
v-model="achievement_improve_desc"
class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
lazy-rules
type="textarea"
hide-bottom-space
label="กรอกสิ่งที่ควรปรับปรุง"
:row="5"
ref="achievement_inproveRef"
:disable="!status"
/>
</div>
</div>
@ -873,15 +1007,27 @@ const editData = 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"
>
<q-list dense v-for="(list, i) in list2_1" :key="i">
<q-item dense tag="label" v-ripple>
<q-item-section>
<q-item-label>{{ list.label }}</q-item-label>
</q-item-section>
<q-item-section side>
<q-rating v-model="conduct_level[i]" :val="list.id" max="5" size="sm" color="grey"
:color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม" :disable="!status">
<q-rating
v-model="conduct_level[i]"
:val="list.id"
max="5"
size="sm"
color="grey"
:color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม"
:disable="!status"
>
<template v-slot:tip-1>
<q-tooltip>ำกวาความคาดหวงมาก</q-tooltip>
</template>
@ -909,15 +1055,27 @@ const editData = 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"
>
<q-list dense v-for="(list, i) in list2_2" :key="i">
<q-item dense tag="label" v-ripple>
<q-item-section>
<q-item-label>{{ list.label }}</q-item-label>
</q-item-section>
<q-item-section side>
<q-rating v-model="moral_level[i]" :val="list.id" max="5" size="sm" color="grey"
:color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม" :disable="!status">
<q-rating
v-model="moral_level[i]"
:val="list.id"
max="5"
size="sm"
color="grey"
:color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม"
:disable="!status"
>
<template v-slot:tip-1>
<q-tooltip>ำกวาความคาดหวงมาก</q-tooltip>
</template>
@ -945,15 +1103,27 @@ const editData = 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"
>
<q-list dense v-for="(list, i) in list2_3" :key="i">
<q-item dense tag="label" v-ripple>
<q-item-section>
<q-item-label>{{ list.label }}</q-item-label>
</q-item-section>
<q-item-section side>
<q-rating v-model="discipline_level[i]" :val="list.id" max="5" size="sm" color="grey"
:color-selected="ratingColors" label="ระดับการประเมินพฤติกรรม" :disable="!status">
<q-rating
v-model="discipline_level[i]"
:val="list.id"
max="5"
size="sm"
color="grey"
:color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม"
:disable="!status"
>
<template v-slot:tip-1>
<q-tooltip>ำกวาความคาดหวงมาก</q-tooltip>
</template>
@ -980,23 +1150,50 @@ const editData = async (data: any) => {
<div class="col-12 text-top0 row items-center q-pl-lg">
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
2.4 นๆ
<q-checkbox class="q-ml-sm" dense v-model="etc2" @click="(behavio_orther.text = ''), (behavio_orther.level = 0)"
:disable="!status" />
<q-checkbox
class="q-ml-sm"
dense
v-model="etc2"
@click="(behavio_orther.text = ''), (behavio_orther.level = 0)"
:disable="!status"
/>
</div>
<q-card v-if="etc2" flat bordered class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1">
<q-card
v-if="etc2"
flat
bordered
class="col-xs-12 col-sm-11 col-md-10 offset-md-1 q-pa-sm bg-grey-1"
>
<q-list dense>
<q-item dense tag="label" v-ripple>
<q-item-section>
<q-item-label>
<q-input v-model="behavio_orther.text" label="กรอกอื่นๆ" dense lazy-rules autogrow hide-bottom-space
outlined class="bg-white" :rules="[
<q-input
v-model="behavio_orther.text"
label="กรอกอื่นๆ"
dense
lazy-rules
autogrow
hide-bottom-space
outlined
class="bg-white"
:rules="[
(val) => (val && val.length > 0) || 'กรุณากรอกข้อความ',
]" :disable="!status" />
]"
:disable="!status"
/>
</q-item-label>
</q-item-section>
<q-item-section side>
<q-rating v-model="behavio_orther.level" max="5" size="sm" color="grey" :color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม" :disable="!status">
<q-rating
v-model="behavio_orther.level"
max="5"
size="sm"
color="grey"
:color-selected="ratingColors"
label="ระดับการประเมินพฤติกรรม"
:disable="!status"
>
<template v-slot:tip-1>
<q-tooltip>ำกวาความคาดหวงมาก</q-tooltip>
</template>
@ -1025,18 +1222,39 @@ const editData = async (data: any) => {
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
ดเด (ไมเก 5 บรรท)
</div>
<q-input outlined dense v-model="behavior_strength_desc" class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
lazy-rules type="textarea" label="กรอกจุดเด่น" hide-bottom-space :row="5" :rules="behavio_strengthRules"
ref="behavio_strengthRef" :disable="!status" />
<q-input
outlined
dense
v-model="behavior_strength_desc"
class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
lazy-rules
type="textarea"
label="กรอกจุดเด่น"
hide-bottom-space
:row="5"
:rules="behavio_strengthRules"
ref="behavio_strengthRef"
:disable="!status"
/>
</div>
<div class="col-12 row">
<div class="col-12 text-top0 row items-center q-pl-lg">
<q-icon name="mdi-label" color="grey-4" class="q-pr-sm" />
งทควรปรบปร (ไมเก 5 บรรท)
</div>
<q-input outlined dense v-model="behavior_improve_desc" class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
lazy-rules type="textarea" hide-bottom-space label="กรอกสิ่งที่ควรปรับปรุง" :row="5" ref="behavio_inproveRef"
:disable="!status" />
<q-input
outlined
dense
v-model="behavior_improve_desc"
class="col-xs-12 col-sm-11 col-md-10 offset-md-1"
lazy-rules
type="textarea"
hide-bottom-space
label="กรอกสิ่งที่ควรปรับปรุง"
:row="5"
ref="behavio_inproveRef"
:disable="!status"
/>
</div>
</div>
</div>
@ -1049,7 +1267,11 @@ const editData = async (data: any) => {
<q-avatar class="bg-grey-2 q-mr-sm" size="28px">3</q-avatar>
การพฒนาผทดลองปฏหนาทราชการ
</div>
<q-card flat bordered class="col-xs-12 col-sm-11 col-md-11 q-pa-sm bg-grey-1">
<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-section>
@ -1057,10 +1279,22 @@ const editData = async (data: any) => {
</q-item-section>
<q-item-section side>
<div class="row">
<q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" v-model="orientation" val="1"
label="ดำเนินการเเล้ว" :disable="!status" />
<q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" v-model="orientation" val="0"
label=" ยังไม่ได้ดำเนินการ" :disable="!status" />
<q-radio
checked-icon="task_alt"
unchecked-icon="panorama_fish_eye"
v-model="orientation"
val="1"
label="ดำเนินการเเล้ว"
:disable="!status"
/>
<q-radio
checked-icon="task_alt"
unchecked-icon="panorama_fish_eye"
v-model="orientation"
val="0"
label=" ยังไม่ได้ดำเนินการ"
:disable="!status"
/>
</div>
</q-item-section>
</q-item>
@ -1071,10 +1305,22 @@ const editData = async (data: any) => {
</q-item-section>
<q-item-section side>
<div class="row">
<q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" v-model="self_learning" val="1"
label="ดำเนินการเเล้ว" :disable="!status" />
<q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" v-model="self_learning" val="0"
label=" ยังไม่ได้ดำเนินการ" :disable="!status" />
<q-radio
checked-icon="task_alt"
unchecked-icon="panorama_fish_eye"
v-model="self_learning"
val="1"
label="ดำเนินการเเล้ว"
:disable="!status"
/>
<q-radio
checked-icon="task_alt"
unchecked-icon="panorama_fish_eye"
v-model="self_learning"
val="0"
label=" ยังไม่ได้ดำเนินการ"
:disable="!status"
/>
</div>
</q-item-section>
</q-item>
@ -1085,24 +1331,50 @@ const editData = async (data: any) => {
</q-item-section>
<q-item-section side>
<div class="row">
<q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" v-model="training_seminar" val="1"
label="ดำเนินการเเล้ว" :disable="!status" />
<q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" v-model="training_seminar" val="0"
label=" ยังไม่ได้ดำเนินการ" :disable="!status" />
<q-radio
checked-icon="task_alt"
unchecked-icon="panorama_fish_eye"
v-model="training_seminar"
val="1"
label="ดำเนินการเเล้ว"
:disable="!status"
/>
<q-radio
checked-icon="task_alt"
unchecked-icon="panorama_fish_eye"
v-model="training_seminar"
val="0"
label=" ยังไม่ได้ดำเนินการ"
:disable="!status"
/>
</div>
</q-item-section>
</q-item>
<q-separator class="q-my-xs" />
<q-item dense tag="label" v-ripple>
<q-item-section>
<q-item-label>4. การอบรมอ ตามทหนวยงานกำหนด (าม)</q-item-label>
<q-item-label
>4. การอบรมอ ตามทหนวยงานกำหนด (าม)</q-item-label
>
</q-item-section>
<q-item-section side>
<div class="row">
<q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" v-model="other_training" val="1"
label="ดำเนินการเเล้ว" :disable="!status" />
<q-radio checked-icon="task_alt" unchecked-icon="panorama_fish_eye" v-model="other_training" val="0"
label=" ยังไม่ได้ดำเนินการ" :disable="!status" />
<q-radio
checked-icon="task_alt"
unchecked-icon="panorama_fish_eye"
v-model="other_training"
val="1"
label="ดำเนินการเเล้ว"
:disable="!status"
/>
<q-radio
checked-icon="task_alt"
unchecked-icon="panorama_fish_eye"
v-model="other_training"
val="0"
label=" ยังไม่ได้ดำเนินการ"
:disable="!status"
/>
</div>
</q-item-section>
</q-item>
@ -1119,11 +1391,27 @@ const editData = async (data: any) => {
งคบบญชา/มอบหมายงาน
</div>
<div class="col-12 row q-col-gutter-md">
<q-select class="col-xs-12 col-sm-8" dense v-model="Autherise" outlined :options="option" label="ผู้บังคับบัญชา"
option-label="name" disable />
<q-select
class="col-xs-12 col-sm-8"
dense
v-model="Autherise"
outlined
:options="option"
label="ผู้บังคับบัญชา"
option-label="name"
disable
/>
<div class="col-xs-12 col-sm-4">
<datepicker menu-class-name="modalfix" v-model="dateAutherise" :locale="'th'" autoApply borderless
:enableTimePicker="false" week-start="0" :readonly="!status">
<datepicker
menu-class-name="modalfix"
v-model="dateAutherise"
:locale="'th'"
autoApply
borderless
:enableTimePicker="false"
week-start="0"
:readonly="!status"
>
<template #year="{ year }">
{{ year + 543 }}
</template>
@ -1131,10 +1419,23 @@ const editData = async (data: any) => {
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input outlined dense class="full-width datepicker col-3" :model-value="dateAutherise != null ? date2Thai(dateAutherise) : null
" :label="`${'ลงวันที่'}`" :rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่'}`]" :disable="!status">
<q-input
outlined
dense
class="full-width datepicker col-3"
:model-value="
dateAutherise != null ? date2Thai(dateAutherise) : null
"
:label="`${'ลงวันที่'}`"
:rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่'}`]"
:disable="!status"
>
<template v-slot:prepend>
<q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)">
<q-icon
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
</q-icon>
</template>
</q-input>
@ -1146,7 +1447,12 @@ const editData = async (data: any) => {
</div>
<q-toolbar class="text-primary">
<q-space />
<q-btn v-if="routeName == 'probationFormAddresult'" label="บันทึก" color="secondary" @click="savaForm" />
<q-btn
v-if="routeName == 'probationFormAddresult'"
label="บันทึก"
color="secondary"
@click="savaForm"
/>
</q-toolbar>
</div>
</template>

View file

@ -1,4 +1,78 @@
div
<script setup lang="ts">
import { ref } from "vue";
import { useCounterMixin } from "@/stores/mixin";
const Advertise = ref<string>("");
const brand = ref<string>("");
const cardid = ref<string>("");
const prefixId = ref<string>("");
const fullName = ref<string>("");
const volume = ref<string>("");
const episode = ref<string>("");
const duty = ref<string>("");
const announced = ref<string>("");
const firstname = ref<string>("");
const lastname = ref<string>("");
const position = ref<string>("");
const invoice = ref<string>("");
const payment = ref<string>("");
const addressPayment = ref<string>("");
const affiliationRequest = ref<string>("");
const affiliationReceived = ref<string>("");
const receivedate = ref<Date>();
const announceDate = ref<Date>();
const invoiceDate = ref<Date>();
const mixin = useCounterMixin();
const { date2Thai } = mixin;
const paymentOp = [
{ label: "จัดส่งทางไปรษณี", value: "xx1" },
{ label: "มารับด้วยตัวเอง", value: "xx2" },
];
const volumeOp = [
{ label: "เล่มที่", value: "xx1" },
{ label: "เล่มที่2", value: "xx2" },
{ label: "เล่มที่3", value: "xx3" },
];
const episodeOp = [
{ label: "ตอนที่1", value: "xx1" },
{ label: "ตอนที่2", value: "xx2" },
{ label: "ตอนที่3", value: "xx3" },
];
const dutyOp = [
{ label: "หน้าที่1", value: "xx1" },
{ label: "หน้าที่2", value: "xx2" },
{ label: "หน้าที่3", value: "xx3" },
];
const announcedOp = [
{ label: "ลำดับที่1", value: "xx1" },
{ label: "ลำดับที่2", value: "xx2" },
{ label: "ลำดับที่3", value: "xx3" },
];
const affiliationRequestOp = [
{ label: "สังกัด1", value: "xx1" },
{ label: "สังกัด2", value: "xx2" },
{ label: "สังกัด3", value: "xx3" },
];
const affiliationReceivedOp = [
{ label: "สังกัด4", value: "xx4" },
{ label: "สังกัด5", value: "xx5" },
{ label: "สังกัด6", value: "xx6" },
];
const prefixOp = [
{ label: "นาย", value: "mr" },
{ label: "นางสาว", value: "miss" },
{ label: "นาง", value: "mrs" },
];
const positionOp = [
{ label: "ตำแหน่ง1", value: "xxx1" },
{ label: "ตำแหน่ง2", value: "xxx2" },
{ label: "ตำแหน่ง3", value: "xxx3" },
];
const clearDateExam = () => {
receivedate.value = undefined;
};
const props = defineProps({
modal: Boolean,
save: {
@ -17,10 +91,9 @@ const close = async () => {
<template>
<q-dialog v-model="props.modal" persistent>
<q-card style="width: 800px;" class="q-pb-md">
<q-card style="min-width: 900px" class="q-pb-md">
<q-toolbar class="q-py-md">
<q-toolbar-title class="text-h6">นทกผล
</q-toolbar-title>
<q-toolbar-title class="text-h6">นทกผล </q-toolbar-title>
<q-btn
icon="close"
unelevated
@ -33,12 +106,363 @@ const close = async () => {
<q-separator />
<div class="q-pa-md">
<div class="row q-col-gutter-sm">
<div class="col-12">
<div
class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs"
>
<div class="col-xs-12 col-sm-6">
<q-input
:rules="[(val) => !!val || 'กรุณากรอกชื่อ']"
hide-bottom-space
dense
borderless
outlined
v-model="Advertise"
label="หมายเลขประกาศนีย์บัตรกำกับเครื่องราชอิสริยาภรณ์"
/>
</div>
<div class="col-xs-12 col-sm-6">
<q-input
:rules="[(val) => !!val || 'กรุณากรอกชื่อ']"
hide-bottom-space
dense
borderless
outlined
v-model="brand"
label="ชั้นตราเครื่องราชอิสริยาภรณ์"
/>
</div>
<div class="col-xs-12 col-sm-6">
<q-input
hide-bottom-space
outlined
v-model="cardid"
dense
lazy-rules
:rules="[
(val:string) => !!val || `${'กรุณากรอก เลขบัตรประจำตัวประชาชน'}`,
(val:string) =>
val.length >= 13 ||
`${'กรุณากรอกเลขบัตรประจำตัวประชาชนให้ครบ'}`,
]"
label="เลขบัตรประจำตัวประชาชน"
maxlength="13"
mask="#############"
/>
<!-- :rules="[(val:any) =>val.length != 13 ||`${'กรุณากรอกเลขบัตรประจำตัวประชาชนให้ครบ'}`,]" -->
</div>
<div class="col-6"></div>
<div class="col-12 q-my-xs"><q-separator size="2px" /></div>
<div class="col-12 text-weight-bold text-grey">-สก</div>
<div class="col-xs-12 col-sm-3">
<q-select
:rules="[(val) => !!val || 'กรุณาเลือกคำนำหน้าชื่อ']"
hide-bottom-space
:options="prefixOp"
class="col-xs-12 col-sm-6"
dense
borderless
option-label="label"
option-value="value"
outlined
v-model="prefixId"
:label="`คำนำหน้าชื่อ`"
/>
</div>
<div class="col-xs-6 col-sm-3 col-md-9">
<q-input
hide-bottom-space
outlined
dense
lazy-rules
borderless
v-model="fullName"
:rules="[(val:string) => !!val || `${'กรุณากรอก ชื่อ'}`]"
:label="`${'ชื่อ-นามสกุล'}`"
/>
</div>
<!-- <div class="col-xs-6 col-sm-3 col-md-5">
<q-input
hide-bottom-space
outlined
dense
lazy-rules
borderless
v-model="lastname"
:rules="[(val:string) => !!val || `${'กรุณากรอก นามสกุล'}`]"
:label="`${'นามสกุล'}`"
/>
</div> -->
<div class="col-12 q-my-xs"><q-separator size="2px" /></div>
<div class="col-12 text-weight-bold text-grey">
รายละเอยดตำเเหน
</div>
<div class="col-xs-12 col-sm-6">
<q-select
:rules="[(val) => !!val || 'กรุณาเลือกคำนำหน้าชื่อ']"
hide-bottom-space
:options="positionOp"
class="col-xs-12 col-sm-6"
dense
borderless
option-label="label"
option-value="value"
outlined
v-model="position"
:label="`ตำเเหน่ง`"
/>
</div>
<div class="col-xs-12 col-sm-6">
<datepicker
menu-class-name="modalfix"
v-model="receivedate"
:locale="'th'"
autoApply
borderless
:enableTimePicker="false"
week-start="0"
>
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
dense
borderless
outlined
:rules="[(val) => !!val || 'กรุณาเลือกวันที่']"
hide-bottom-space
:model-value="
receivedate != null ? date2Thai(receivedate) : undefined
"
:label="`${'วันที่ได้รับพระราชทานเครื่องราชอิสริยาภรณ์'}`"
clearable
@clear="clearDateExam"
>
<template v-slot:prepend>
<q-icon name="event" class="cursor-pointer" color="primary">
</q-icon>
</template>
</q-input>
</template>
</datepicker>
</div>
<div class="col-xs-12 col-sm-6">
<q-select
:rules="[(val) => !!val || 'กรุณาเลือกสังกัด']"
hide-bottom-space
:options="affiliationRequestOp"
class="col-xs-12 col-sm-6"
dense
borderless
option-label="label"
option-value="value"
outlined
v-model="affiliationRequest"
:label="`สังกัด ณ วันที่ขอพระราชทานเครื่องราชอิสริยาภรณ์`"
/>
</div>
<div class="col-xs-12 col-sm-6">
<q-select
:rules="[(val) => !!val || 'กรุณาเลือกสังกัด']"
hide-bottom-space
:options="affiliationReceivedOp"
class="col-xs-12 col-sm-6"
dense
borderless
option-label="label"
option-value="value"
outlined
v-model="affiliationReceived"
:label="`สังกัด ณ วันที่ได้รับประกาศนียบัตรกำกับเครื่องราชอิสริยาภรณ์`"
/>
</div>
<div class="col-12 q-my-xs"><q-separator size="2px" /></div>
<div class="col-12 text-weight-bold text-grey">
ประกาศราชกจจานเบกษา
</div>
<div class="col-xs-12 col-sm-4">
<datepicker
menu-class-name="modalfix"
v-model="announceDate"
:locale="'th'"
autoApply
borderless
:enableTimePicker="false"
week-start="0"
>
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
dense
borderless
outlined
:rules="[(val) => !!val || 'กรุณาเลือกวันที่']"
hide-bottom-space
:model-value="
announceDate != null ? date2Thai(announceDate) : undefined
"
:label="`${'วันที่'}`"
clearable
@clear="clearDateExam"
>
<template v-slot:prepend>
<q-icon name="event" class="cursor-pointer" color="primary">
</q-icon>
</template>
</q-input>
</template>
</datepicker>
</div>
<div class="col-xs-12 col-sm-4">
<q-select
:rules="[(val) => !!val || 'กรุณาเลือกคำนำหน้าชื่อ']"
hide-bottom-space
:options="volumeOp"
class="col-xs-12 col-sm-6"
dense
borderless
option-label="label"
option-value="value"
outlined
v-model="volume"
:label="`เล่มที่`"
/>
</div>
<div class="col-xs-12 col-sm-4">
<q-select
:rules="[(val) => !!val || 'กรุณาเลือกคำนำหน้าชื่อ']"
hide-bottom-space
:options="episodeOp"
class="col-xs-12 col-sm-6"
dense
borderless
option-label="label"
option-value="value"
outlined
v-model="episode"
:label="`ตอนที่`"
/>
</div>
<div class="col-xs-12 col-sm-6">
<q-select
:rules="[(val) => !!val || 'กรุณาเลือกคำนำหน้าชื่อ']"
hide-bottom-space
:options="dutyOp"
class="col-xs-12 col-sm-6"
dense
borderless
option-label="label"
option-value="value"
outlined
v-model="duty"
:label="`หน้าที่`"
/>
</div>
<div class="col-xs-12 col-sm-6">
<q-select
:rules="[(val) => !!val || 'กรุณาเลือกคำนำหน้าชื่อ']"
hide-bottom-space
:options="announcedOp"
class="col-xs-12 col-sm-6"
dense
borderless
option-label="label"
option-value="value"
outlined
v-model="announced"
:label="`ลำดับที่`"
/>
</div>
<div class="col-12 q-my-xs"><q-separator size="2px" /></div>
<div class="col-12 text-weight-bold text-grey">ผลการจายใบกำก</div>
<div class="col-xs-12 col-sm-4">
<q-input
:rules="[(val) => !!val || 'หมายเลขใบกํากับ']"
hide-bottom-space
dense
borderless
outlined
v-model="invoice"
label="หมายเลขใบกํากับ"
/>
</div>
<div class="col-xs-12 col-sm-4">
<datepicker
menu-class-name="modalfix"
v-model="invoiceDate"
:locale="'th'"
autoApply
borderless
:enableTimePicker="false"
week-start="0"
>
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
dense
borderless
outlined
:rules="[(val) => !!val || 'กรุณาเลือกวันที่']"
hide-bottom-space
:model-value="
invoiceDate != null ? date2Thai(invoiceDate) : undefined
"
:label="`${'วันที่จ่ายใบกำกับ'}`"
clearable
@clear="clearDateExam"
>
<template v-slot:prepend>
<q-icon name="event" class="cursor-pointer" color="primary">
</q-icon>
</template>
</q-input>
</template>
</datepicker>
</div>
<div class="col-xs-12 col-sm-4">
<q-select
:rules="[(val) => !!val || 'กรุณาเลือกคำนำหน้าชื่อ']"
hide-bottom-space
:options="paymentOp"
class="col-xs-12 col-sm-6"
dense
borderless
option-label="label"
option-value="value"
outlined
emit-value
map-options
v-model="payment"
:label="`เลือกรูปแบบการจ่าย`"
/>
</div>
<div v-if="payment === 'xx1'" class="col-12">
<q-input
label="ที่อยู่ที่จ่าย"
class="bg-white"
dense
borderless
outlined
v-model="addressPayment"
type="textarea"
/>
</div>
</div>
</div>
<q-separator />
<div class="q-pa-md">
<div class="row justify-end">
@ -47,4 +471,4 @@ const close = async () => {
</div>
</q-card>
</q-dialog>
</template>
</template>

View file

@ -25,7 +25,18 @@ const selectRound = ref<string>("1");
const selectRoundOption = ref<OptionData[]>([
{ id: "1", name: "รอบการเสนอขอพระราชทานเครื่องราชฯ ปี 2566" },
]);
const filterKeyword = ref<string>("");
const filterDoc = ref<any>(null);
const resetFilterRef = () => {
filterKeyword.value = "";
filterDoc.value.focus();
};
const pagination = ref({
sortBy: "filename",
descending: true,
page: 1,
rowsPerPage: 10,
});
const visibleColumns = ref<String[]>([
"no",
"status",
@ -39,6 +50,12 @@ const visibleColumns = ref<String[]>([
"address",
"action"
]);
const visibleColumnsReference = ref<String[]>([
"no",
"fileName",
"annotation",
"file",
]);
const filterRef = ref<QInput>();
const filter = ref<string>("");
const columns = ref<QTableProps["columns"]>([
@ -139,6 +156,53 @@ const columns = ref<QTableProps["columns"]>([
field: "",
},
]);
const colums2 = ref<QTableProps["columns"]>([
{
name: "no",
align: "left",
label: "ลำดับ",
field: "no",
sortable: true,
},
{
name: "fileName",
align: "left",
label: "ชื่อเอกสาร",
field: "fileName",
sortable: true,
},
{
name: "annotation",
align: "left",
label: "หมายเหตุ",
field: "annotation",
sortable: true,
},
{
name: "file",
align: "left",
label: "ไฟล์เอกสาร",
field: "file",
sortable: true,
},
]);
const rows2 = ref<any>([
{
no:"1",
fileName:"test1",
annotation:"ทดสอบ",
file:""
},
{
no:"2",
fileName:"test2",
annotation:"ทดสอบ",
file:""
}
])
const rows = ref<any>([
{
no: "1",
@ -481,185 +545,140 @@ const filterSelector = (val: any, update: Function, filtername: string) => {
<div v-else-if="tab=='doc'">
<Transition>
<div>
<div class="q-pa-md">
<div class="row col-12 q-col-gutter-sm">
<!-- <div class="col-xs-6 col-md-2">
<q-input
class="bg-white"
outlined
dense
lazy-rules
v-model="issue"
:label="`${'ฉบับ'}`"
hide-bottom-space
/>
</div>
<div class="col-xs-6 col-md-2">
<q-input
class="bg-white"
outlined
dense
lazy-rules
v-model="book"
:label="`${'เล่มที่'}`"
hide-bottom-space
/>
</div>
<div class="col-xs-6 col-md-2">
<q-input
class="bg-white"
outlined
dense
lazy-rules
v-model="volume"
:label="`${'เล่ม'}`"
hide-bottom-space
/>
</div>
<div class="col-xs-6 col-md-2">
<q-input
class="bg-white"
outlined
dense
lazy-rules
v-model="section"
:label="`${'ตอนที่'}`"
hide-bottom-space
/>
</div> -->
<div class="col-xs-6 col-md-4">
<q-file
class="bg-white"
outlined
dense
v-model="fileUpload"
label="ไฟล์เอกสาร"
hide-bottom-space
lazy-rules
>
<template v-slot:prepend>
<q-icon name="attach_file" color="primary" />
</template>
</q-file>
</div>
<div class="col-xs-6 col-md-3">
<q-input
class="bg-white"
outlined
dense
lazy-rules
v-model="documentTitle"
:label="`${'ชื่อเอกสาร'}`"
hide-bottom-space
/>
</div>
<div class="col-xs-12 col-md-5">
<q-input
class="bg-white"
outlined
dense
lazy-rules
v-model="reason"
:label="`${'หมายเหตุ'}`"
hide-bottom-space
/>
</div>
<!-- <div class="col-xs-6 col-md-2">
<datepicker
menu-class-name="modalfix"
v-model="dateGoverment"
:locale="'th'"
autoApply
borderless
:enableTimePicker="false"
week-start="0"
>
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
outlined
dense
class="full-width datepicker bg-white"
:model-value="
dateGoverment != null ? date2Thai(dateGoverment) : null
"
:label="`${'วันที่ประกาศราชกิจจานุเบกษา'}`"
>
<template v-slot:prepend>
<q-icon
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
</q-icon>
</template>
</q-input>
</template>
</datepicker>
</div>
<div class="col-xs-6 col-md-2">
<datepicker
menu-class-name="modalfix"
v-model="dateReceiver"
:locale="'th'"
autoApply
borderless
:enableTimePicker="false"
week-start="0"
>
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
outlined
dense
class="full-width datepicker bg-white"
:model-value="
dateReceiver != null ? date2Thai(dateReceiver) : null
"
:label="`${'วันที่ได้รับ'}`"
>
<template v-slot:prepend>
<q-icon
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
</q-icon>
</template>
</q-input>
</template>
</datepicker>
</div> -->
<!--<div class="col-xs-12 col-md-9">
<p>
นทประกาศราชกจจานเบกษา <b>{{ date2Thai(new Date()) }}</b>
</p>
</div> -->
<!-- <div class="col-xs-6 col-md-3">
<p>
นทได <b>{{ date2Thai(new Date()) }}</b>
</p>
</div> -->
</div>
<div class="bg-base rounded-borders q-pa-md q-mb-md">
<div class="row col-12 q-col-gutter-x-lg q-col-gutter-y-md">
<div class="col-xs-6 col-md-4">
<q-file
class="bg-white"
outlined
dense
v-model="fileUpload"
label="ไฟล์เอกสาร"
hide-bottom-space
lazy-rules
>
<template v-slot:prepend>
<q-icon name="attach_file" color="primary" />
</template>
</q-file>
</div>
<div class="col-12"><q-separator /></div>
<div class="col-12 flexsave q-pa-sm">
<q-space/>
<div class="col-xs-6 col-md-3">
<q-input
class="bg-white"
outlined
dense
lazy-rules
v-model="documentTitle"
:label="`${'ชื่อเอกสาร'}`"
hide-bottom-space
/>
</div>
<div class="col-xs-12 col-md-5">
<q-input
class="bg-white"
outlined
dense
lazy-rules
v-model="reason"
:label="`${'หมายเหตุ'}`"
hide-bottom-space
/>
</div>
<div class="row col-12">
<q-space />
<q-input
class="col-xs-12 col-sm-3 col-md-2"
standout
dense
v-model="filterKeyword"
ref="filterDoc"
outlined
debounce="300"
placeholder="ค้นหา"
>
<template v-slot:append>
<q-icon v-if="filterKeyword == ''" name="search" />
<q-icon
v-if="filterKeyword !== ''"
name="clear"
class="cursor-pointer"
@click="resetFilterRef"
/>
</template>
</q-input>
<q-select
v-model="visibleColumnsReference"
multiple
outlined
dense
options-dense
:display-value="$q.lang.table.columns"
emit-value
map-options
:options="colums2"
option-value="name"
options-cover
style="min-width: 150px"
class="col-xs-12 col-sm-3 col-md-2 q-ml-sm"
/>
</div>
<div class="col-12 q-pt-sm">
<d-table
:columns="colums2"
:rows="rows2"
:filter="filterKeyword"
row-key="fileName"
:visible-columns="visibleColumnsReference"
v-model:pagination="pagination"
>
<template v-slot:header="props">
<q-tr :props="props">
<q-th v-for="col in props.cols" :key="col.name" :props="props">
<span class="text-weight-medium">{{ col.label }}</span>
</q-th>
</q-tr>
</template>
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer">
<q-td key="no" :props="props" >
{{ props.rowIndex + 1 }}
</q-td>
<q-td key="fileName" :props="props">
{{ props.row.fileName }}
</q-td>
<q-td key="annotation" :props="props">
{{ props.row.annotation }}
</q-td>
<q-td auto-width>
<q-btn
dense
size="14px"
flat
round
color="deep-orange-6"
@click="editData(props.row.no)"
icon="picture_as_pdf"
>
<q-tooltip>ดาวโหลด PDF</q-tooltip>
</q-btn>
</q-td>
</q-tr>
</template>
</d-table>
</div>
<div class="col-xs-12 col-md-9">
</div>
<div class="col-xs-12 col-md-3 flexsave">
<q-btn label="บันทึก" @click="save" color="public" />
</div>
</div>
</div>
</Transition>
</div>
@ -680,7 +699,7 @@ const filterSelector = (val: any, update: Function, filtername: string) => {
}
.bg-base {
background-color: #efefef;
background-color: #f3f3f398;
}
.v-enter-active,