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

no message

Browse source
This commit is contained in:
setthawutttty 2023-08-09 12:09:46 +07:00
parent f4aa92634e
commit 44ab2aa17e
6 changed files with 463 additions and 249 deletions
Download patch file Download diff file Expand all files Collapse all files

8
src/api/05_placement/api.probation.ts
View file

@ -1,6 +1,8 @@
import env from "../index";
const dataOptions = `${env.API_PROBATION_URI}/data-options`;
const personal = `${env.API_PROBATION_URI}/personal`;
const calculate = `${env.API_PROBATION_URI}/calculate`;
const finish = `${env.API_PROBATION_URI}/assign`;
export default {
competencyOptions: () => `${dataOptions}/competency`,
@ -8,7 +10,11 @@ export default {
knowledgeOptions: () => `${dataOptions}/knowledge`,
skillOptions: () => `${dataOptions}/skill`,
lawOptions: () => `${dataOptions}/law`,
personalList: () => `${personal}/list`,
personal: (personalId:string) => `${personal}?personal_id=${personalId}`,
newAssign: (personalId:string) => `${dataOptions}/new-assign?personal_id=${personalId}`,
calculateDate: () => `${calculate}/assign-finish`,
saveFinish: (personalId:string) => `${finish}/probation-assign?personal_id=${personalId}`,
personalAdd: () => `${personal}/add`,
// clearPosition: (personalId:string) => `${placement}/position/clear/${personalId}`
};

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

@ -67,6 +67,7 @@
dense
borderless
option-label="label"
option-value="value"
:outlined="routeName === 'probationWorkAdd'"
v-model="monthSelect"
:label="`ระยะเวลากี่เดือน`"
@ -154,6 +155,7 @@
<div class="col-12 row q-col-gutter-md">
<q-select
:rules="[(val) => !!val || 'กรุณาเลือกผู้ดูเเล']"
option-value="personal_id"
:options="OPcaretaker"
class="col-xs-12 col-sm-6"
:readonly="routeName != 'probationWorkAdd'"
@ -163,10 +165,13 @@
:outlined="routeName == 'probationWorkAdd'"
v-model="caretaker1"
:label="`ผู้ดูแลคนที่ 1`"
option-label="name"
/>
<q-select
:rules="[(val) => !!val || 'กรุณาเลือกผู้ดูเเล']"
:options="OPcaretaker"
option-value="personal_id"
option-label="name"
hide-bottom-space
class="col-xs-12 col-sm-6"
:readonly="routeName != 'probationWorkAdd'"
@ -552,10 +557,18 @@
:outlined="routeName == 'probationWorkAdd'"
v-model="skill"
label="ด้านที่ 1"
/>
>
<template v-slot:selected-item="scope">
<div class="ellipsis-2-lines">
{{ scope.opt.title }} -
{{ scope.opt.level_description }}
</div>
</template></q-select
>
</div>
<div class="col-xs-12 col-sm-6">
<q-select
ellipsis-2-lines
:option-label="
(item) =>
`${item.title} - ${item.level_description}`
@ -573,7 +586,14 @@
:outlined="routeName == 'probationWorkAdd'"
v-model="skill2"
label="ด้านที่ 2"
/>
>
<template v-slot:selected-item="scope">
<div class="ellipsis-2-lines">
{{ scope.opt.title }} -
{{ scope.opt.level_description }}
</div>
</template></q-select
>
</div>
<div class="col-xs-12 col-sm-6">
<q-select
@ -594,7 +614,14 @@
:outlined="routeName == 'probationWorkAdd'"
v-model="skill3"
label="ด้านที่ 3"
/>
>
<template v-slot:selected-item="scope">
<div class="ellipsis-2-lines">
{{ scope.opt.title }} -
{{ scope.opt.level_description }}
</div>
</template></q-select
>
</div>
<div class="col-xs-12 col-sm-6">
<q-select
@ -615,7 +642,14 @@
:outlined="routeName == 'probationWorkAdd'"
v-model="skill4"
label="ด้านที่ 4"
/>
>
<template v-slot:selected-item="scope">
<div class="ellipsis-2-lines">
{{ scope.opt.title }} -
{{ scope.opt.level_description }}
</div>
</template></q-select
>
</div>
</div>
</div>
@ -641,7 +675,9 @@
option-value="id"
hide-bottom-space
:rules="[(val) => !!val || 'กรุณาเลือกสมรรถนะ']"
:options="filterMain(OPmain,[main2,main3,main4,main5])"
:options="
filterMain(OPmain, [main2, main3, main4, main5])
"
class="bg-white"
:readonly="routeName != 'probationWorkAdd'"
dense
@ -649,7 +685,14 @@
:outlined="routeName == 'probationWorkAdd'"
v-model="main"
label="ตัวที่ 1"
/>
>
<template v-slot:selected-item="scope">
<div class="ellipsis-2-lines">
{{ scope.opt.title }} -
{{ scope.opt.description }}
</div>
</template></q-select
>
</div>
<div class="col-xs-12 col-sm-6">
<q-select
@ -659,7 +702,9 @@
option-value="id"
hide-bottom-space
:rules="[(val) => !!val || 'กรุณาเลือกสมรรถนะ']"
:options="filterMain(OPmain,[main,main3,main4,main5])"
:options="
filterMain(OPmain, [main, main3, main4, main5])
"
class="bg-white"
:readonly="routeName != 'probationWorkAdd'"
dense
@ -667,7 +712,14 @@
:outlined="routeName == 'probationWorkAdd'"
v-model="main2"
label="ตัวที่ 2"
/>
>
<template v-slot:selected-item="scope">
<div class="ellipsis-2-lines">
{{ scope.opt.title }} -
{{ scope.opt.description }}
</div>
</template></q-select
>
</div>
<div class="col-xs-12 col-sm-6">
<q-select
@ -677,7 +729,9 @@
option-value="id"
hide-bottom-space
:rules="[(val) => !!val || 'กรุณาเลือกสมรรถนะ']"
:options="filterMain(OPmain,[main,main2,main4,main5])"
:options="
filterMain(OPmain, [main, main2, main4, main5])
"
class="bg-white"
:readonly="routeName != 'probationWorkAdd'"
dense
@ -685,7 +739,14 @@
:outlined="routeName == 'probationWorkAdd'"
v-model="main3"
label="ตัวที่ 3"
/>
>
<template v-slot:selected-item="scope">
<div class="ellipsis-2-lines">
{{ scope.opt.title }} -
{{ scope.opt.description }}
</div>
</template></q-select
>
</div>
<div class="col-xs-12 col-sm-6">
<q-select
@ -695,7 +756,9 @@
option-value="id"
hide-bottom-space
:rules="[(val) => !!val || 'กรุณาเลือกสมรรถนะ']"
:options="filterMain(OPmain,[main,main2,main3,main5])"
:options="
filterMain(OPmain, [main, main2, main3, main5])
"
class="bg-white"
:readonly="routeName != 'probationWorkAdd'"
dense
@ -703,14 +766,23 @@
:outlined="routeName == 'probationWorkAdd'"
v-model="main4"
label="ตัวที่ 4"
/>
>
<template v-slot:selected-item="scope">
<div class="ellipsis-2-lines">
{{ scope.opt.title }} -
{{ scope.opt.description }}
</div>
</template></q-select
>
</div>
<div class="col-xs-12 col-sm-6">
<q-select
hide-bottom-space
:rules="[(val) => !!val || 'กรุณาเลือกสมรรถนะ']"
:options="filterMain(OPmain,[main,main2,main3,main4])"
:options="
filterMain(OPmain, [main, main2, main3, main4])
"
:option-label="
(item) => `${item.title} - ${item.description}`
"
@ -722,7 +794,14 @@
:outlined="routeName == 'probationWorkAdd'"
v-model="main5"
label="ตัวที่ 5"
/>
>
<template v-slot:selected-item="scope">
<div class="ellipsis-2-lines">
{{ scope.opt.title }} -
{{ scope.opt.description }}
</div>
</template></q-select
>
</div>
</div>
</div>
@ -731,7 +810,6 @@
<div class="col-12 row q-col-gutter-sm">
<div class="col-xs-12 col-sm-6">
<q-select
:option-label="
(item) => `${item.title} - ${item.description}`
"
@ -740,7 +818,7 @@
:rules="[
(val) => !!val || 'กรุณาเลือกสมรรถนะประจํากลุ่มงาน',
]"
:options="filterData(OPgroup,[group2,group3])"
:options="filterData(OPgroup, [group2, group3])"
class="bg-white"
:readonly="routeName != 'probationWorkAdd'"
dense
@ -748,7 +826,14 @@
:outlined="routeName == 'probationWorkAdd'"
v-model="group"
label="ตัวที่ 1"
/>
>
<template v-slot:selected-item="scope">
<div class="ellipsis-2-lines">
{{ scope.opt.title }} -
{{ scope.opt.description }}
</div>
</template></q-select
>
</div>
<div class="col-xs-12 col-sm-6">
<q-select
@ -760,7 +845,7 @@
:rules="[
(val) => !!val || 'กรุณาเลือกสมรรถนะประจํากลุ่มงาน',
]"
:options="filterData(OPgroup,[group,group3])"
:options="filterData(OPgroup, [group, group3])"
class="bg-white"
:readonly="routeName != 'probationWorkAdd'"
dense
@ -768,7 +853,14 @@
:outlined="routeName == 'probationWorkAdd'"
v-model="group2"
label="ตัวที่ 2"
/>
>
<template v-slot:selected-item="scope">
<div class="ellipsis-2-lines">
{{ scope.opt.title }} -
{{ scope.opt.description }}
</div>
</template></q-select
>
</div>
<div class="col-xs-12 col-sm-6">
<q-select
@ -780,7 +872,7 @@
:rules="[
(val) => !!val || 'กรุณาเลือกสมรรถนะประจํากลุ่มงาน',
]"
:options="filterData(OPgroup,[group,group2])"
:options="filterData(OPgroup, [group, group2])"
class="bg-white"
:readonly="routeName != 'probationWorkAdd'"
dense
@ -788,7 +880,14 @@
:outlined="routeName == 'probationWorkAdd'"
v-model="group3"
label="ตัวที่ 3"
/>
>
<template v-slot:selected-item="scope">
<div class="ellipsis-2-lines">
{{ scope.opt.title }} -
{{ scope.opt.description }}
</div>
</template></q-select
>
</div>
</div>
</div>
@ -1179,6 +1278,8 @@
<div class="col-12 row q-col-gutter-md">
<q-select
:options="OPcaretaker"
option-value="personal_id"
option-label="name"
class="col-xs-12 col-sm-8"
:readonly="routeName != 'probationWorkAdd'"
dense
@ -1229,6 +1330,8 @@
</div>
<q-select
:options="OPcaretaker"
option-value="personal_id"
option-label="name"
class="col-xs-12 col-sm-8"
:readonly="routeName != 'probationWorkAdd'"
dense
@ -1287,7 +1390,9 @@
</div>
<div class="col-12 row q-col-gutter-md">
<q-select
:options="OPcaretaker"
:options="OPcommander"
option-value="personal_id"
option-label="name"
class="col-xs-12 col-sm-8"
:readonly="routeName != 'probationWorkAdd'"
dense
@ -1345,14 +1450,19 @@
v-show="routeName == 'probationWorkAdd'"
class="flex justify-end q-pa-sm q-gutter-sm"
>
<q-btn unelevated label="บันทึก" color="public" @click="saveData()" />
<q-btn
unelevated
label="บันทึก"
color="public"
@click="saveData(personalId)"
/>
</div>
</q-card>
</div>
</q-form>
</template>
<script setup lang="ts">
import { useRouter } from "vue-router";
import { useRouter, useRoute } from "vue-router";
import { ref, computed, watch, onMounted } from "vue";
import { useCounterMixin } from "@/stores/mixin";
import { useQuasar } from "quasar";
@ -1370,13 +1480,26 @@ const val1 = ref([
const router = useRouter();
const mixin = useCounterMixin();
const { date2Thai, notifyError } = mixin;
const {
date2Thai,
notifyError,
dateToISO,
success,
messageError,
showLoader,
hideLoader,
} = mixin;
const filterData = (options: any[], excludedGroups: any[]) => {
return options.filter((item) => !excludedGroups.some((group) => group && group.id === item.id));
return options.filter(
(item) => !excludedGroups.some((group) => group && group.id === item.id)
);
};
const filterMain = (options: any[], excludedGroups: any[]) => {
return options.filter((item) => !excludedGroups.some((group) => group && group.id === item.id));
return options.filter(
(item) => !excludedGroups.some((group) => group && group.id === item.id)
);
};
const route = useRoute();
const checkValidate = ref<boolean>(false);
const myForm = ref<any>(null);
const fullnameFoot = ref<string>("");
@ -1384,12 +1507,12 @@ const positionFoot = ref<string>("");
const caretakerFoot = ref<string>("");
const caretakerFoot2 = ref<string>("");
const id = ref<number>();
const personal_id = ref<string>();
const personalId = route.params.personalId as string;
const fullname = ref<string>();
const knowledge_skill_map_no = ref<string[]>([]);
const round_no = ref<number>();
const date_start = ref<Date | null>(null);
const date_finish = ref<Date | null>(null);
const date_start = ref<Date>();
const date_finish = ref<Date>();
const behavior_desc = ref<string>();
const other_desc = ref<object>({});
const other4_desc = ref<string>();
@ -1408,7 +1531,6 @@ const main3 = ref<any>();
const main4 = ref<any>();
const main5 = ref<any>();
const Other = ref<string>("");
const commander = ref<string>("");
@ -1447,19 +1569,36 @@ const routeName = router.currentRoute.value.name;
const name = ref<string>("");
const position = ref<string>("");
const monthSelect = ref<number>();
const monthSelect = ref<number | string>();
const caretaker1 = ref<string>("");
const caretaker2 = ref<string>("");
const OPcaretaker = [
"นางสาวรัชภรณ์ ภักดี",
"นางสาวทวิดา กมลเวชชี",
"test1",
"test2",
"test3",
"test4",
];
const monthOp = [{ value: "6", label: "6 เดือน" }];
const OPcaretaker = ref<
{
personal_id: string;
name: string;
PositionId: string;
PositionLevelId: string;
PositionLineId: string;
OrganizationOrganization: string;
}[]
>([]);
const OPcommander = ref<
{
personal_id: string;
name: string;
PositionId: string;
PositionLevelId: string;
PositionLineId: string;
OrganizationOrganization: string;
}[]
>([]);
interface MonthOption {
value: number;
label: string;
}
const monthOp: MonthOption[] = [];
//-----------------(3.1)-----------//
const activityCount = ref<number>(2);
const activityDataArray = ref<any[]>([]);
@ -1486,10 +1625,10 @@ const resetActivity = () => {
//-----------------(3.2)-----------//
const knowledgeCount = ref<number>(3);
const knowledge = ref<any[]>(Array.from({ length: knowledgeCount.value }, () => null));
const knowledge = ref<any[]>([]);
const OPknowledge = ref<
Array<{
knowledge_id: number;
id: number;
title: number;
options: Array<Option>;
}>
@ -1543,7 +1682,21 @@ interface CheckboxItem {
}
const checkRule = ref<CheckboxItem[]>([]);
const getcompetency = async () => {
const getAssignNew = async (id: string) => {
await http.get(config.API.newAssign(id)).then((res: any) => {
const data = res.data.data;
const monthOption = {
value: data.assign_month,
label: `${data.assign_month} เดือน`,
};
console.log("Assign-New", data);
monthOp.push(monthOption);
monthSelect.value = `${data.assign_month} เดือน`;
OPcaretaker.value = data.mentors;
OPcommander.value = [data.commander];
});
};
const getcompetency = async () => {
await http.get(config.API.competencyOptions()).then((res: any) => {
const data = res.data.data;
OPmain.value = data;
@ -1587,7 +1740,24 @@ const getLaw = async () => {
});
};
const putData = () => {
const postDateTime = async () => {
await http
.post(config.API.calculateDate(), {
month: monthSelect.value !== null ? parseInt(monthSelect.value) : null,
start_date: dateToISO(date_start.value as Date),
})
.then(async (res) => {
const result = res.data;
date_finish.value = result.finish_date;
})
.catch((e) => {})
.finally(async () => {
hideLoader();
});
};
const putData = (id: string) => {
const GUID = id;
const assign_job = activityArray.value.map((item, index) => {
const activityDesc = activity_desc.value[index]?.trim();
const goalDesc = goal_desc.value[index]?.trim();
@ -1599,7 +1769,7 @@ const putData = () => {
goal_desc: goalDesc,
};
} else {
return null;
return null;
}
});
const know_ledge = knowledge.value.map((item) => ({
@ -1607,7 +1777,6 @@ const putData = () => {
level: item ? item.level : null,
}));
const Productivity_assign = ProductivityArray.value.map((item, index) => {
const outputDesc = output_desc.value[index]?.trim();
const indicatorDesc = indicator_desc.value[index]?.trim();
@ -1615,88 +1784,94 @@ const putData = () => {
if (outputDesc !== "" && indicatorDesc !== "") {
return {
id: index + 1,
activity_desc: outputDesc,
goal_desc: indicatorDesc,
output_desc: outputDesc,
indicator_desc: indicatorDesc,
};
} else {
return null;
return null;
}
});
const groupData = group.value
? { id: group.value.id, level: group.value.level }
: null;
const group2Data = group2.value
? { id: group2.value.id, level: group2.value.level }
: null;
const group3Data = group3.value
? { id: group3.value.id, level: group3.value.level }
: null;
const skillData = skill.value
? { id: skill.value.id, level: skill.value.level }
: null;
const skill2Data = skill2.value
? { id: skill2.value.id, level: skill2.value.level }
: null;
const skill3Data = skill3.value
? { id: skill3.value.id, level: skill3.value.level }
: null;
const skill4Data = skill4.value
? { id: skill4.value.id, level: skill4.value.level }
: null;
const allGroup = [];
if (group.value)
allGroup.push({ id: group.value.id, level: group.value.level });
if (group2.value)
allGroup.push({ id: group2.value.id, level: group2.value.level });
if (group3.value)
allGroup.push({ id: group3.value.id, level: group3.value.level });
const mainData = main.value
? { id: main.value.id, level: main.value.level }
: null;
const main2Data = main2.value
? { id: main2.value.id, level: main2.value.level }
: null;
const main3Data = main3.value
? { id: main3.value.id, level: main3.value.level }
: null;
const main4Data = main4.value
? { id: main4.value.id, level: main4.value.level }
: null;
const main5Data = main5.value
? { id: main5.value.id, level: main5.value.level }
: null;
const allSkills = [];
if (skill.value)
allSkills.push({ id: skill.value.id, level: skill.value.level });
if (skill2.value)
allSkills.push({ id: skill2.value.id, level: skill2.value.level });
if (skill3.value)
allSkills.push({ id: skill3.value.id, level: skill3.value.level });
if (skill4.value)
allSkills.push({ id: skill4.value.id, level: skill4.value.level });
const allCompetency = [];
if (main.value)
allCompetency.push({ id: skill.value.id, level: main.value.level });
if (main2.value)
allCompetency.push({ id: main2.value.id, level: main2.value.level });
if (main3.value)
allCompetency.push({ id: main3.value.id, level: main3.value.level });
if (main4.value)
allCompetency.push({ id: main4.value.id, level: main4.value.level });
if (main5.value)
allCompetency.push({ id: main5.value.id, level: main5.value.level });
const assign_director = [
{
personal_id: caretakerFoot.value.personal_id,
role: "mentor",
dated: date2.value instanceof Date ? dateToISO(date2.value) : null,
},
{
personal_id: caretakerFoot2.value.personal_id,
role: "mentor",
dated: date3.value instanceof Date ? dateToISO(date3.value) : null,
},
{
personal_id: commander.value.personal_id,
role: "commander",
dated: date4.value instanceof Date ? dateToISO(date4.value) : null,
},
];
const data = {
personalId: GUID,
fullname: fullname.value,
position: position.value,
monthSelect: monthSelect.value !== undefined ? parseInt((monthSelect.value as any).value) : null,
date_start: date_start.value,
monthSelect:monthSelect.value !== null ? parseInt(monthSelect.value) : null,
date_start:
date_start.value instanceof Date
? dateToISO(date_start.value)
: new Date(),
date_finish: date_finish.value,
caretaker_1: caretaker1.value,
caretaker_2: caretaker2.value,
knowledge: know_ledge,
assign_job: assign_job.filter((item) => item !== null),
otherlaw: OtherLaw.value,
skill: skillData,
skill_2: skill2Data,
skill_3: skill3Data,
skill_4: skill4Data,
main: mainData,
main_2: main2Data,
main_3: main3Data,
main_4: main4Data,
main_5: main5Data,
group: groupData,
group_2: group2Data,
group_3: group3Data,
other: Other.value,
other_5: Other5.value,
productivity_assign: Productivity_assign.filter((item) => item !== null),
commander: commander.value,
date_1: date1.value,
date_2: date2.value,
date_3: date3.value,
date_4: date4.value,
// caretaker_1: caretaker1.value,
// caretaker_2: caretaker2.value,
assign_knowledges: know_ledge,
assign_jobs: assign_job.filter((item) => item !== null),
other_desc: OtherLaw.value,
assign_skill: allSkills,
assign_competency: allCompetency,
assign_competency_group: allGroup,
other4_desc: Other.value,
other5_no1_desc: Other5.value,
assign_outputs: Productivity_assign.filter((item) => item !== null),
// commander: commander.value,
assign_director: assign_director,
experimenter_dated: date1.value instanceof Date ? dateToISO(date1.value) : new Date(),
// date_2: date2.value instanceof Date ? dateToISO(date2.value) : new Date(),
// date_3: date3.value instanceof Date ? dateToISO(date3.value) : new Date(),
// date_4: date4.value instanceof Date ? dateToISO(date4.value) : new Date(),
fullname_foot: fullnameFoot.value,
position_foot: positionFoot.value,
caretaker_foot: caretakerFoot.value,
caretaker_foot2: caretakerFoot2.value,
checkarray: checkRule.value
// caretaker_foot: caretakerFoot.value,
// caretaker_foot2: caretakerFoot2.value,
assign_law: checkRule.value
.filter((item) => item.checked === 1)
.map((item) => ({
id: item.id,
@ -1706,16 +1881,8 @@ const putData = () => {
console.log("test", data);
};
const saveData = async () => {
// myForm.value.resetValidation();
// nameRef.value.validate();
// positionRef.value.validate();
// monthRef.value.validate();
// startDateRef.value.validate();
// caregiverRef1.value.validate();
// caregiverRef2.value.validate();
// workInfopRef.value.validate();
myForm.value.validate().then(async (result: boolean) => {
const saveData = (id: string) => {
myForm.value.validate().then((result: boolean) => {
if (result) {
$q.dialog({
title: "บันทึกข้อมูล",
@ -1726,20 +1893,24 @@ const saveData = async () => {
},
})
.onOk(async () => {
// putData();
const data = putData(id);
await http
.post(config.API.saveFinish(id), data)
.then(async (res) => {})
.catch((e) => {})
.finally(async () => {
hideLoader();
});
})
.onCancel(() => {})
.onDismiss(() => {});
} else {
// ลอง
putData();
notifyError($q, "กรุณากรอกข้อมูลให้ครบ");
}
});
};
const OtherLaw = ref<string>("");
const skill = ref<any>();
const skill2 = ref<any>();
const skill3 = ref<any>();
@ -1783,6 +1954,20 @@ onMounted(async () => {
await getCompetencyGroup();
await getSkill();
await getKnowledge();
await getAssignNew(personalId);
});
watch(
() => [monthSelect.value, date_start.value],
() => {
if (monthSelect.value !== undefined && date_start.value !== undefined) {
postDateTime();
}
}
);
watch(knowledge.value, () => {
knowledge.value.forEach((item) => {
OPknowledge.value = OPknowledge.value.filter((e) => e.id != item.id);
});
});
</script>
<style lang="scss" scoped>
@ -1813,4 +1998,12 @@ onMounted(async () => {
align-items: center;
justify-content: center;
}
.q-item span {
white-space: normal;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
}
</style>

144
src/modules/05_placement/components/probation/MainProbation.vue
View file

@ -84,7 +84,7 @@
<q-tr
:props="props"
class="cursor-pointer"
@click="router.push(`/probation/detail/${props.rowIndex + 1}`)"
@click="router.push(`/probation/detail/${props.row.personal_id}`)"
>
<q-td v-for="col in props.cols" :key="col.name" :props="props">
<div v-if="col.name == 'no'">
@ -257,12 +257,12 @@ const pagination = ref({
const visibleColumns = ref<string[]>([
"no",
"name",
"position",
"level",
"institution",
"time",
"status",
"orderNum",
"position_line",
"position_level",
"organization",
"probation_no",
"order_number",
"probation_status",
]); //ค้นหา คอลัมน์ คอลัมน์ที่แสดง
// หัวตาราง
@ -286,114 +286,63 @@ const columns = ref<QTableProps["columns"]>([
style: "font-size: 14px",
},
{
name: "position",
name: "position_line",
align: "left",
label: "ตำแหน่งในสายงาน",
sortable: true,
field: "position",
field: "position_line",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "level",
name: "position_level",
align: "left",
label: "ระดับ",
sortable: true,
field: "level",
field: "position_level",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "institution",
name: "organization",
align: "left",
label: "สังกัด",
sortable: true,
field: "institution",
field: "organization",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "time",
name: "probation_no",
align: "center",
label: "ครั้งที่ทดลองงาน",
sortable: true,
field: "time",
field: "probation_no",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "orderNum",
name: "order_number",
align: "center",
label: "เลขที่คําสั่งบรรจุแต่งตั้ง",
sortable: true,
field: "orderNum",
field: "order_number",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "status",
name: "probation_status",
align: "left",
label: "สถานะทดลองงาน",
sortable: true,
field: "status",
field: "probation_status",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
]);
// ข้อมูลตาราง (จำลอง)
const rows = ref<FormMainProbation[]>([
{
no: "1",
name: "นายสมคิด ยอดใจ ",
position: "นักวิชาการพัสดุ",
level: "ปฏิบัติการ",
institution: "กลุ่มงานโครงสร้างและอัตรากำลัง ๒",
time: "1",
status: "อยู่ระหว่างการทดลองงาน",
orderNum: "11/2566",
},
{
no: "2",
name: "นายเกียรติศักดิ์ บัณฑิต",
position: "นักวิชาการพัสดุ",
level: "ปฏิบัติการ",
institution: "กลุ่มงานโครงสร้างและอัตรากำลัง ๒",
time: "1",
status: "อยู่ระหว่างการทดลองงาน",
orderNum: "11/2566",
},
{
no: "3",
name: "นางสาวกัณฐิมา กาฬสินธุ์",
position: "นักจัดการงานทั่วไป",
level: "ปฏิบัติการ",
institution: "กลุ่มงานช่วยนักบริหาร",
time: "1",
status: "อยู่ระหว่างการทดลองงาน",
orderNum: "11/2566",
},
{
no: "4",
name: "นางสาวเมขลา กระจ่างมนตรี",
position: "นักจัดการงานทั่วไป",
level: "ปฏิบัติการ",
institution: "กลุ่มงานช่วยนักบริหาร",
time: "1",
status: "ไม่ผ่านการทดลอง",
orderNum: "11/2566",
},
{
no: "5",
name: "นางสาวฐิติรัตน์ พงษ์ศิริ",
position: "นักจัดการงานทั่วไป",
level: "ปฏิบัติการ",
institution: "กลุ่มงานช่วยนักบริหาร",
time: "1",
status: "ผ่านการทดลองงาน",
orderNum: "11/2566",
},
]);
const rows = ref<FormMainProbation[]>([]);
// หัวตาราง2
const columns2 = ref<QTableProps["columns"]>([
@ -483,28 +432,37 @@ const rows2 = ref<FormMainProbation2[]>([
// },
]);
onMounted(async () => {});
watch(modal, () => {
if (modal.value === true) {
fecthOrganiz();
}
onMounted(async () => {
getpersonalList();
});
const fecthOrganiz = async () => {
// watch(modal, () => {
// if (modal.value === true) {
// getpersonalList();
// }
// });
const getpersonalList = async () => {
showLoader();
await http
.get(config.API.profileOrganizRoot)
.get(config.API.personalList())
.then((res) => {
console.log(res);
let id = res.data.result[0].id;
if (id !== "") {
findlist(id);
}
})
.catch((e) => {
messageError($q, e);
const data = res.data.data;
rows.value = data.map((item: FormMainProbation) => ({
personal_id: item.personal_id,
name: item.name,
position_line: item.position_line,
position_line_id: item.position_line_id,
position_level: item.position_level,
position_level_id: item.position_level_id,
organization: item.organization,
probation_no: item.probation_no,
order_number: item.order_number,
probation_status: item.probation_status,
}));
console.log("(data)", data);
})
.catch(() => {})
.finally(() => {
hideLoader();
});
@ -559,15 +517,11 @@ const clickAdd = (id: string) => {
.onOk(async () => {
const postData = {
personal_id: id,
}
};
console.log("postData:", postData);
await http
.post(config.API.personalAdd(), postData)
.then((res) => {
console.log("res:", res);
});
await http.post(config.API.personalAdd(), postData).then((res) => {
console.log("res:", res);
});
})
.onCancel(() => {})
.onDismiss(() => {});

73
src/modules/05_placement/components/probation/ProbationDetail.vue
View file

@ -34,19 +34,19 @@
<div class="col-xs-6 col-sm-3 row items-center">
<div class="col-12 q-pl-md">
<div class="col-12 text-top">ตำแหน่งในสายงาน</div>
<div class="col-12 text-detail">{{ position }}</div>
<div class="col-12 text-detail">{{ position_line }}</div>
</div>
</div>
<div class="col-xs-6 col-sm-2 row items-center">
<div class="col-12">
<div class="col-12 text-top">ระดับ</div>
<div class="col-12 text-detail">{{ level }}</div>
<div class="col-12 text-detail">{{ position_level }}</div>
</div>
</div>
<div class="col-xs-6 col-sm-3 row items-center">
<div class="col-12">
<div class="col-12 text-top">สังกัด</div>
<div class="col-12 text-detail">{{ institution }}</div>
<div class="col-12 text-detail">{{ organization }}</div>
</div>
</div>
<div class="col-xs-6 col-sm-3 row items-center">
@ -55,18 +55,18 @@
<div class="col-12 text-detail">
<q-icon
size="20px"
v-if="status == 'อยู่ระหว่างการทดลองงาน'"
v-if="probation_status == 'PENDING'"
name="mdi-timer-sand"
color="deep-orange"
/>
<q-icon
size="20px"
v-else-if="status == 'ไม่ผ่านการทดลอง'"
v-else-if="probation_status == 'ไม่ผ่านการทดลอง'"
name="mdi-close"
color="red"
/>
<q-icon size="20px" v-else name="mdi-check" color="teal" />
{{ status }}
{{ probation_status == 'PENDING' ? 'อยู่ในระหว่างการทดลองงาน' : '' }}
</div>
</div>
</div>
@ -78,7 +78,7 @@
<div class="row col-12 q-col-gutter-sm">
<div>
<q-btn
@click="router.push(`/probation/add`)"
@click="router.push(`/probation/add/${personalId}`)"
size="12px"
flat
round
@ -191,17 +191,26 @@
</template>
<script setup lang="ts">
import { useRouter, useRoute } from "vue-router";
import { ref, useAttrs } from "vue";
import { ref, useAttrs,onMounted } from "vue";
import type { QTableProps } from "quasar";
import type { FormProbationDetail } from "@/modules/05_placement/interface/request/Main";
import type { FormProbationPersonal } from "@/modules/05_placement/interface/request/Main";
import { useCounterMixin } from "@/stores/mixin";
import { useQuasar } from "quasar";
import http from "@/plugins/http";
import config from "@/app.config";
const $q = useQuasar(); //ใช้ noti quasar
const mixin = useCounterMixin();
const { messageError, success, showLoader, hideLoader } = mixin;
const router = useRouter();
const route = useRoute();
const name = ref<string>("นายสมคิด ยอดใจ");
const position = ref<string>("นักจัดการงานทั่วไป");
const level = ref<string>("ชำนาญการพิเศษ");
const institution = ref<string>("ฝ่ายบริหารงานทั่วไป");
const status = ref<string>("อยู่ระหว่างการทดลองงาน");
const personalId = ref<string>(route.params.id as string);
const name = ref<string>("");
const position_line = ref<string>("");
const position_level = ref<string>("");
const organization = ref<string>("");
const probation_status = ref<string>("");
const pagination = ref({
sortBy: "desc",
@ -314,6 +323,42 @@ const paginationLabel = (start: string, end: string, total: string) => {
if (paging.value == true) return " " + start + "-" + end + " ใน " + total;
else return start + "-" + end + " ใน " + total;
};
const getpersonalList = async () => {
showLoader();
await http
.get(config.API.personal(personalId.value))
.then((res) => {
const data = res.data.data;
name.value = data.name
position_line.value = data.position_line
position_level.value = data.position_level
organization.value = data.organization
probation_status.value = data.probation_status
// rows.value = data.map((item: FormProbationPersonal) => ({
// personal_id: item.personal_id,
// name: item.name,
// position_line: item.position_line,
// position_line_id: item.position_line_id,
// position_level: item.position_level,
// position_level_id: item.position_level_id,
// organization: item.organization,
// probation_no: item.probation_no,
// order_number: item.order_number,
// probation_status: item.probation_status,
// }));
console.log("(data)", data);
})
.catch(() => {})
.finally(() => {
hideLoader();
});
};
onMounted(async () => {
await getpersonalList()
console.log()
})
</script>
<style lang="scss" scope>
.q-img {

32
src/modules/05_placement/interface/request/Main.ts
View file

@ -24,14 +24,17 @@ interface FormOrderPlacementMainData {
}
interface FormMainProbation {
no: string;
name: string;
position: string;
level: string;
institution: string;
time: string;
status: string;
orderNum: string;
personal_id: number,
ordering: number,
name: string,
position_line: string,
position_line_id: string,
position_level: string,
position_level_id: string,
organization: string,
probation_no: number,
order_number: string,
probation_status: string
}
interface FormMainProbation2 {
no: string;
@ -47,8 +50,21 @@ interface FormProbationDetail {
intendant: string;
commander: string;
}
interface FormProbationPersonal {
personal_id: string,
name: string,
position_line: string,
position_line_id: string,
position_level: string,
position_level_id: string,
organization: string,
probation_no: number,
order_number: string,
probation_status: string
}
export type { FormPlacementMainData };
export type { FormOrderPlacementMainData };
export type { FormMainProbation };
export type { FormMainProbation2 };
export type { FormProbationDetail };
export type { FormProbationPersonal };

2
src/modules/05_placement/router.ts
View file

@ -165,7 +165,7 @@ export default [
},
},
{
path: "/probation/add",
path: "/probation/add/:personalId",
name: "probationWorkAdd",
component: probationFormAssign,
meta: {