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

เพิ่ม status แบบมอบหมายงานการทดลองปฏิบัติหน้าที่ราชการ option-label

Browse source
This commit is contained in:
setthawutttty 2023-08-21 14:13:00 +07:00
parent de439c931d
commit 6823876fa4
1 changed files with 206 additions and 125 deletions
Download patch file Download diff file Expand all files Collapse all files

331
src/modules/05_placement/components/probation/FormAssign.vue
View file

@ -13,7 +13,7 @@
@click="router.go(-1)" @click="router.go(-1)"
v-if="routeName == 'probationWorkAdd'" v-if="routeName == 'probationWorkAdd'"
/> />
<div v-if="routeName == 'probationWorkAdd'"> <div v-if="routeName !== 'probationWorkAdd'">
เพิ่มแบบมอบหมายงานการทดลองปฏิบัติหน้าที่ราชการ เพิ่มแบบมอบหมายงานการทดลองปฏิบัติหน้าที่ราชการ
</div> </div>
<div v-else>แบบมอบหมายงานการทดลองปฏิบัติหน้าที่ราชการ</div> <div v-else>แบบมอบหมายงานการทดลองปฏิบัติหน้าที่ราชการ</div>
@ -117,7 +117,9 @@
:locale="'th'" :locale="'th'"
autoApply autoApply
borderless borderless
:readonly="isDatePicker2Readonly|| routeName !== 'probationWorkAdd'" :readonly="
isDatePicker2Readonly || routeName !== 'probationWorkAdd'
"
:enableTimePicker="false" :enableTimePicker="false"
week-start="0" week-start="0"
> >
@ -158,7 +160,7 @@
ผู้ดูแลการทดลองปฏิบัติหน้าที่ราชการ (อาจมีได้มากกว่า 1 คน) ผู้ดูแลการทดลองปฏิบัติหน้าที่ราชการ (อาจมีได้มากกว่า 1 คน)
</div> </div>
<div class="col-12 row q-col-gutter-md"> <div v-if="status == true" class="col-12 row q-col-gutter-md">
<q-select <q-select
:rules="[(val) => !!val || 'กรุณาเลือกผู้ดูเเล']" :rules="[(val) => !!val || 'กรุณาเลือกผู้ดูเเล']"
option-value="id" option-value="id"
@ -188,6 +190,36 @@
:label="`ผู้ดูแลคนที่ 2`" :label="`ผู้ดูแลคนที่ 2`"
/> />
</div> </div>
<div v-else class="col-12 row q-col-gutter-md">
<q-select
:rules="[(val) => !!val || 'กรุณาเลือกผู้ดูเเล']"
option-value="id"
:options="filtermantor(OPcaretaker, [caretaker2])"
class="col-xs-12 col-sm-6"
:readonly="routeName != 'probationWorkAdd'"
dense
hide-bottom-space
borderless
:outlined="routeName == 'probationWorkAdd'"
v-model="caretaker1"
:label="`ผู้ดูแลคนที่ 1`"
option-label="name"
/>
<q-select
:rules="[(val) => !!val || 'กรุณาเลือกผู้ดูเเล']"
:options="filtermantor(OPcaretaker, [caretaker1])"
option-value="id"
option-label="name"
hide-bottom-space
class="col-xs-12 col-sm-6"
:readonly="routeName != 'probationWorkAdd'"
dense
borderless
:outlined="routeName == 'probationWorkAdd'"
v-model="caretaker2"
:label="`ผู้ดูแลคนที่ 2`"
/>
</div>
</div> </div>
<div class="col-12"> <div class="col-12">
<q-separator size="3px" color="grey-2" /> <q-separator size="3px" color="grey-2" />
@ -300,7 +332,9 @@
> >
<div class="col-11 q-my-xs"> <div class="col-11 q-my-xs">
<q-select <q-select
:option-label="(item) => `${item.title}-${item.description}`" :option-label="
(item) => `${item.title}-${item.description}`
"
option-value="id" option-value="id"
map-options map-options
:rules=" :rules="
@ -322,17 +356,16 @@
/> />
</div> </div>
<div <div
v-if="index > 2" v-if="index > 2"
class="col-xs-12 col-sm-1 flex justify-center items-center" class="col-xs-12 col-sm-1 flex justify-center items-center"
> >
<q-btn <q-btn
v-if="routeName == 'probationWorkAdd'" v-if="routeName == 'probationWorkAdd'"
flat flat
round round
color="red" color="red"
icon="mdi-trash-can-outline" icon="mdi-trash-can-outline"
@click="deleteknowledge(index)" @click="deleteknowledge(index)"
/> />
</div> </div>
</div> </div>
@ -371,13 +404,11 @@
v-if="item.status_select === 1" v-if="item.status_select === 1"
v-model="item.checked" v-model="item.checked"
dense dense
:disable="routeName != 'probationWorkAdd'" :disable="routeName != 'probationWorkAdd'"
/> />
</div> </div>
<div v-if="index === 0" class="col-11" > <div v-if="index === 0" class="col-11">
{{ item.description }} {{ item.description }}
</div> </div>
</div> </div>
</div> </div>
@ -911,7 +942,6 @@
</template></q-select </template></q-select
> >
</div> </div>
</div> </div>
</div> </div>
</div> </div>
@ -1147,7 +1177,7 @@
<li> <li>
อื่นๆ (ถ้ามี) อื่นๆ (ถ้ามี)
<q-input <q-input
:readonly="routeName != 'probationWorkAdd'" :readonly="routeName != 'probationWorkAdd'"
dense dense
borderless borderless
:outlined="routeName == 'probationWorkAdd'" :outlined="routeName == 'probationWorkAdd'"
@ -1305,7 +1335,8 @@
</div> </div>
<div class="col-12 row q-col-gutter-md"> <div class="col-12 row q-col-gutter-md">
<q-select <q-select
:options="filtermantor(OPcaretaker, [caretaker2])" v-if="status == true"
:options="filtermantor(OPcaretaker, [caretaker2])"
option-value="id" option-value="id"
option-label="fullName" option-label="fullName"
class="col-xs-12 col-sm-8" class="col-xs-12 col-sm-8"
@ -1316,6 +1347,19 @@
v-model="caretaker1" v-model="caretaker1"
label="ผู้ดูแลคนที่ 1" label="ผู้ดูแลคนที่ 1"
/> />
<q-select
v-else
:options="filtermantor(OPcaretaker, [caretaker2])"
option-value="id"
option-label="name"
class="col-xs-12 col-sm-8"
:readonly="routeName != 'probationWorkAdd'"
dense
borderless
:outlined="routeName == 'probationWorkAdd'"
v-model="caretaker1"
label="ผู้ดูแลคนที่ 1"
/>
<div class="col-xs-12 col-sm-4"> <div class="col-xs-12 col-sm-4">
<datepicker <datepicker
menu-class-name="modalfix" menu-class-name="modalfix"
@ -1358,7 +1402,8 @@
</datepicker> </datepicker>
</div> </div>
<q-select <q-select
:options="filtermantor(OPcaretaker, [caretaker1])" v-if="status == true"
:options="filtermantor(OPcaretaker, [caretaker1])"
option-value="id" option-value="id"
option-label="fullName" option-label="fullName"
class="col-xs-12 col-sm-8" class="col-xs-12 col-sm-8"
@ -1369,6 +1414,19 @@
v-model="caretaker2" v-model="caretaker2"
label="ผู้ดูแลคนที่ 2" label="ผู้ดูแลคนที่ 2"
/> />
<q-select
v-else
:options="filtermantor(OPcaretaker, [caretaker1])"
option-value="id"
option-label="name"
class="col-xs-12 col-sm-8"
:readonly="routeName != 'probationWorkAdd'"
dense
borderless
:outlined="routeName == 'probationWorkAdd'"
v-model="caretaker2"
label="ผู้ดูแลคนที่ 2"
/>
<div class="col-xs-12 col-sm-4"> <div class="col-xs-12 col-sm-4">
<datepicker <datepicker
menu-class-name="modalfix" menu-class-name="modalfix"
@ -1420,6 +1478,7 @@
</div> </div>
<div class="col-12 row q-col-gutter-md"> <div class="col-12 row q-col-gutter-md">
<q-select <q-select
v-if="status == true"
:options="OPcommander" :options="OPcommander"
option-value="id" option-value="id"
option-label="fullName" option-label="fullName"
@ -1431,6 +1490,19 @@
v-model="commander" v-model="commander"
label="ผู้บังคับบัญชา" label="ผู้บังคับบัญชา"
/> />
<q-select
v-else
:options="OPcommander"
option-value="id"
option-label="name"
class="col-xs-12 col-sm-8"
:readonly="routeName != 'probationWorkAdd'"
dense
borderless
:outlined="routeName == 'probationWorkAdd'"
v-model="commander"
label="ผู้บังคับบัญชา"
/>
<div class="col-xs-12 col-sm-4"> <div class="col-xs-12 col-sm-4">
<datepicker <datepicker
menu-class-name="modalfix" menu-class-name="modalfix"
@ -1481,6 +1553,7 @@
</div> </div>
<div class="col-12 row q-col-gutter-md"> <div class="col-12 row q-col-gutter-md">
<q-select <q-select
v-if="status == true"
:options="OPchairman" :options="OPchairman"
option-value="id" option-value="id"
option-label="fullName" option-label="fullName"
@ -1492,7 +1565,19 @@
v-model="chairman" v-model="chairman"
label="ประธานกรรมการ" label="ประธานกรรมการ"
/> />
<q-select
v-else
:options="OPchairman"
option-value="id"
option-label="name"
class="col-xs-12 col-sm-8"
:readonly="routeName != 'probationWorkAdd'"
dense
borderless
:outlined="routeName == 'probationWorkAdd'"
v-model="chairman"
label="ประธานกรรมการ"
/>
</div> </div>
</div> </div>
</div> </div>
@ -1529,7 +1614,7 @@ const val1 = ref([
checked: false, checked: false,
}, },
]); ]);
const status = ref<boolean>(true);
const router = useRouter(); const router = useRouter();
const mixin = useCounterMixin(); const mixin = useCounterMixin();
const { const {
@ -1540,7 +1625,7 @@ const {
messageError, messageError,
showLoader, showLoader,
hideLoader, hideLoader,
dialogConfirm dialogConfirm,
} = mixin; } = mixin;
const filterData = (options: any[], excludedGroups: any[]) => { const filterData = (options: any[], excludedGroups: any[]) => {
return options.filter( return options.filter(
@ -1549,10 +1634,7 @@ const filterData = (options: any[], excludedGroups: any[]) => {
}; };
const filtermantor = (options: any[], excludedGroups: any[]) => { const filtermantor = (options: any[], excludedGroups: any[]) => {
return options.filter( return options.filter(
(item) => (item) => !excludedGroups.some((group) => group && group.id === item.id)
!excludedGroups.some(
(group) => group && group.id === item.id
)
); );
}; };
const filterMain = (options: any[], excludedGroups: any[]) => { const filterMain = (options: any[], excludedGroups: any[]) => {
@ -1637,36 +1719,36 @@ const caretaker1 = ref<string>("");
const caretaker2 = ref<string>(""); const caretaker2 = ref<string>("");
const OPcaretaker = ref< const OPcaretaker = ref<
Array<{ Array<{
id: string, id: string;
prefix: string, prefix: string;
firstName: string, firstName: string;
lastName: string, lastName: string;
fullName:string, fullName: string;
citizenId: number, citizenId: number;
isDirector: boolean isDirector: boolean;
}>[] }>[]
>([]); >([]);
const OPcommander = ref< const OPcommander = ref<
Array<{ Array<{
id: string, id: string;
prefix: string, prefix: string;
firstName: string, firstName: string;
lastName: string, lastName: string;
fullName:string, fullName: string;
citizenId: number, citizenId: number;
isDirector: boolean isDirector: boolean;
}>[] }>[]
>([]); >([]);
const OPchairman = ref< const OPchairman = ref<
Array<{ Array<{
id: string, id: string;
prefix: string, prefix: string;
firstName: string, firstName: string;
lastName: string, lastName: string;
fullName:string, fullName: string;
citizenId: number, citizenId: number;
isDirector: boolean isDirector: boolean;
}>[] }>[]
>([]); >([]);
interface MonthOption { interface MonthOption {
@ -1706,7 +1788,7 @@ const OPknowledge = ref<
Array<{ Array<{
id: number; id: number;
title: number; title: number;
description:string; description: string;
level: string; level: string;
}> }>
>([]); >([]);
@ -1756,42 +1838,37 @@ interface CheckboxItem {
const checkRule = ref<CheckboxItem[]>([]); const checkRule = ref<CheckboxItem[]>([]);
const getUser = async () => { const getUser = async () => {
await http.get(config.API.userPlacement(personalId)) await http.get(config.API.userPlacement(personalId)).then((res: any) => {
.then((res:any) => { const data = res.data.result;
const data = res.data.result OPcaretaker.value = data.caregiver.map((item: any) => ({
OPcaretaker.value = data.caregiver.map((item:any) => ({
id: item.id, id: item.id,
prefix:item.prefix, prefix: item.prefix,
firstName:item.firstName, firstName: item.firstName,
lastName:item.lastName, lastName: item.lastName,
fullName:item.prefix + "" + item.firstName + " " + item.lastName, fullName: item.prefix + "" + item.firstName + " " + item.lastName,
citizenId:item.citizenId, citizenId: item.citizenId,
isDirector:item.isDirector isDirector: item.isDirector,
})); }));
OPcommander.value = data.commander.map((item:any) => ({ OPcommander.value = data.commander.map((item: any) => ({
id: item.id, id: item.id,
prefix:item.prefix, prefix: item.prefix,
firstName:item.firstName, firstName: item.firstName,
lastName:item.lastName, lastName: item.lastName,
fullName:item.prefix + "" + item.firstName + " " + item.lastName, fullName: item.prefix + "" + item.firstName + " " + item.lastName,
citizenId:item.citizenId, citizenId: item.citizenId,
isDirector:item.isDirector isDirector: item.isDirector,
})); }));
OPchairman.value = data.chairman.map((item:any) => ({ OPchairman.value = data.chairman.map((item: any) => ({
id: item.id, id: item.id,
prefix:item.prefix, prefix: item.prefix,
firstName:item.firstName, firstName: item.firstName,
lastName:item.lastName, lastName: item.lastName,
fullName:item.prefix + "" + item.firstName + " " + item.lastName, fullName: item.prefix + "" + item.firstName + " " + item.lastName,
citizenId:item.citizenId, citizenId: item.citizenId,
isDirector:item.isDirector isDirector: item.isDirector,
})); }));
});
}) };
}
const getAssignNew = async (id: string) => { const getAssignNew = async (id: string) => {
await http.get(config.API.newAssign(id)).then((res: any) => { await http.get(config.API.newAssign(id)).then((res: any) => {
const data = res.data.data; const data = res.data.data;
@ -1850,7 +1927,6 @@ const getSkill = async (id: string) => {
const getLaw = async (id: string) => { const getLaw = async (id: string) => {
await http.get(config.API.lawOptions(id)).then((res: any) => { await http.get(config.API.lawOptions(id)).then((res: any) => {
checkRule.value = res.data.data; checkRule.value = res.data.data;
}); });
}; };
@ -1939,7 +2015,7 @@ const putData = (id: string) => {
}, },
{ {
personal_id: chairman.value.id, personal_id: chairman.value.id,
role: "chairman" role: "chairman",
}, },
]; ];
@ -1987,22 +2063,22 @@ const putData = (id: string) => {
return data; return data;
}; };
const saveData = (id:string) => { const saveData = (id: string) => {
dialogConfirm($q,()=>DataSave(id)) dialogConfirm($q, () => DataSave(id));
} };
const DataSave = async (id: string) => { const DataSave = async (id: string) => {
await myForm.value.validate().then((result: boolean) => { await myForm.value.validate().then((result: boolean) => {
if (result) { if (result) {
const data = putData(id); const data = putData(id);
http http
.post(config.API.saveFinish(id), data) .post(config.API.saveFinish(id), data)
.then((res) => { .then((res) => {
router.push(`/probation/detail/${id}`); router.push(`/probation/detail/${id}`);
}) })
.catch((e) => {}) .catch((e) => {})
.finally(() => { .finally(() => {
hideLoader(); hideLoader();
}); });
} else { } else {
notifyError($q, "กรุณากรอกข้อมูลให้ครบ"); notifyError($q, "กรุณากรอกข้อมูลให้ครบ");
} }
@ -2050,61 +2126,66 @@ const skillIds = [1, 2, 3, 4];
const getAssign = async () => { const getAssign = async () => {
await http.get(config.API.probationsGetAssign(assignId.value)).then((res) => { await http.get(config.API.probationsGetAssign(assignId.value)).then((res) => {
status.value = false;
const data = res.data.data; const data = res.data.data;
console.log("ASSIGN-list ==>", data); console.log("ASSIGN-list ==>", data);
fullname.value = data.profile.name fullname.value = data.profile.name;
position.value = data.profile.OrganizationOrganization position.value = data.profile.OrganizationOrganization;
date_start.value = data.assign.date_start date_start.value = data.assign.date_start;
date_finish.value = data.assign.date_finish date_finish.value = data.assign.date_finish;
date1.value = data.assign.experimenter_dated date1.value = data.assign.experimenter_dated;
date2.value = data.mentors[0].dated date2.value = data.mentors[0].dated;
date3.value = data.mentors[1].dated date3.value = data.mentors[1].dated;
date4.value = data.commander.dated date4.value = data.commander.dated;
activity_desc.value = data.jobs.map((job:any) => job.activity_desc); activity_desc.value = data.jobs.map((job: any) => job.activity_desc);
goal_desc.value = data.jobs.map((job:any) => job.goal_desc); goal_desc.value = data.jobs.map((job: any) => job.goal_desc);
activityCount.value = data.jobs.length activityCount.value = data.jobs.length;
caretaker1.value = data.mentors[0]; caretaker1.value = data.mentors[0];
caretaker2.value = data.mentors[1]; caretaker2.value = data.mentors[1];
chairman.value = data.chairman.name; chairman.value = data.chairman.name;
commander.value = data.commander.name commander.value = data.commander.name;
knowledge.value = data.knowledges.map((id:any)=> id.id) knowledge.value = data.knowledges.map((id: any) => id.id);
knowledgeCount.value = data.knowledges.length knowledgeCount.value = data.knowledges.length;
other_desc.value = data.assign.other_desc other_desc.value = data.assign.other_desc;
other4_desc.value = data.assign.other4_desc other4_desc.value = data.assign.other4_desc;
other5_no1_desc.value = data.assign.other5_no1_desc other5_no1_desc.value = data.assign.other5_no1_desc;
const skills = data.skills.map((skills: any) => ({ const skills = data.skills.map((skills: any) => ({
id: skills.id, id: skills.id,
title: skills.title, title: skills.title,
level: skills.level, level: skills.level,
level_description: skills.description, level_description: skills.description,
})); }));
[skill.value, skill2.value, skill3.value, skill4.value] = skills; [skill.value, skill2.value, skill3.value, skill4.value] = skills;
main.value = data.competencys[0] main.value = data.competencys[0];
main2.value = data.competencys[1] main2.value = data.competencys[1];
main3.value = data.competencys[2] main3.value = data.competencys[2];
main4.value = data.competencys[3] main4.value = data.competencys[3];
main5.value = data.competencys[4] main5.value = data.competencys[4];
group.value = data.competency_groups[0] group.value = data.competency_groups[0];
group2.value = data.competency_groups[1] group2.value = data.competency_groups[1];
group3.value = data.competency_groups[2] group3.value = data.competency_groups[2];
output_desc.value = data.outputs.map((output: any) => output.output_desc); output_desc.value = data.outputs.map((output: any) => output.output_desc);
indicator_desc.value = data.outputs.map((output: any) => output.indicator_desc); indicator_desc.value = data.outputs.map(
(output: any) => output.indicator_desc
);
productivityCount.value = data.outputs.length; productivityCount.value = data.outputs.length;
checkRule.value = data.laws.map((law: any) => ({ checkRule.value = data.laws.map((law: any) => ({
id: law.law_id, id: law.law_id,
checked: law.selected, checked: law.selected,
description: law.description, description: law.description,
status_select: law.status_select, status_select: law.status_select,
}));
})); console.log(
console.log("🚀 ~ file: FormAssign.vue:2009 ~ awaithttp.get ~ checkRule:", checkRule.value) "🚀 ~ file: FormAssign.vue:2009 ~ awaithttp.get ~ checkRule:",
}) checkRule.value
);
});
}; };
onMounted(async() => { onMounted(async () => {
await getUser(); await getUser();
await getLaw(personalId); await getLaw(personalId);
await getcompetency(personalId); await getcompetency(personalId);