แก้เเสดงผล การพัฒนารายบุคคล (Individual Development Plan)
This commit is contained in:
parent
85fcae6be7
commit
4b4b293ee7
3 changed files with 101 additions and 66 deletions
|
|
@ -49,4 +49,8 @@ export default {
|
|||
|
||||
/**API ยุทธศาสตร์*/
|
||||
devStrategy,
|
||||
|
||||
/** IDP */
|
||||
developmentReQuestIDP: (id: string) => `${developmentOrg}/profile/development/registry/OFFICER/${id}`,
|
||||
developmentIDP: (id: string) => `${development}/main/registry/OFFICER/${id}`,
|
||||
};
|
||||
|
|
|
|||
|
|
@ -38,7 +38,7 @@ const profileId = ref<string>(
|
|||
const empType = ref<string>(pathRegistryEmp(route.name?.toString() ?? ""));
|
||||
|
||||
const id = ref<string>(""); //id ที่ต้องการแก้ไข
|
||||
|
||||
const typeIDP = ref<string>('')
|
||||
const isEdit = ref<boolean>(false); //สถานะการแก้ไขข้อมูล
|
||||
const modal = ref<boolean>(false); //แสดง popup ผลการประเมินการปฏิบัติราชการ
|
||||
const modalDevelop = ref<boolean>(false); //แสดง popup การพัฒนารายบุคคล
|
||||
|
|
@ -553,6 +553,7 @@ function clearData() {
|
|||
function openDialogDevelop(data: any) {
|
||||
modalDevelop.value = true;
|
||||
kpiDevelopmentId.value = data.kpiDevelopmentId;
|
||||
typeIDP.value = data.type
|
||||
}
|
||||
|
||||
function updatePaginationIdp(newPagination: any) {
|
||||
|
|
@ -1272,7 +1273,7 @@ onMounted(async () => {
|
|||
</q-card>
|
||||
</q-dialog>
|
||||
|
||||
<DialogDevelop v-model:modal="modalDevelop" v-model:id="kpiDevelopmentId" />
|
||||
<DialogDevelop v-model:modal="modalDevelop" v-model:id="kpiDevelopmentId" :type="typeIDP"/>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
|
|
|
|||
|
|
@ -29,6 +29,10 @@ const modal = defineModel<boolean>("modal", { required: true });
|
|||
const id = defineModel<string>("id", { required: true });
|
||||
const props = defineProps({
|
||||
getAll: Function,
|
||||
type: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
});
|
||||
|
||||
const development = ref<any[]>([]);
|
||||
|
|
@ -203,11 +207,15 @@ watch(
|
|||
(i) => {
|
||||
if (i) {
|
||||
showLoader();
|
||||
http
|
||||
.get(
|
||||
config.API.kpiAchievementDevelop +
|
||||
const url =
|
||||
props.type == "KPI"
|
||||
? config.API.kpiAchievementDevelop +
|
||||
`/registry/${emType.value}/${id.value}`
|
||||
)
|
||||
: props.type == "REQUEST"
|
||||
? config.API.developmentReQuestIDP(id.value)
|
||||
: config.API.developmentIDP(id.value);
|
||||
http
|
||||
.get(url)
|
||||
.then(async (res) => {
|
||||
const data = res.data.result;
|
||||
formData.year = data.selectTypeYear;
|
||||
|
|
@ -265,7 +273,10 @@ watch(
|
|||
<q-separator />
|
||||
<q-card-section>
|
||||
<div class="row q-col-gutter-sm">
|
||||
<div class="col-3">
|
||||
<div
|
||||
class="col-3"
|
||||
v-if="props.type !== 'DEVELOP' && props.type !== 'REQUEST'"
|
||||
>
|
||||
<q-select
|
||||
outlined
|
||||
dense
|
||||
|
|
@ -280,48 +291,11 @@ watch(
|
|||
>
|
||||
</q-select>
|
||||
</div>
|
||||
<div class="col-3" v-if="choice == 'PROJECT'">
|
||||
<datepicker
|
||||
menu-class-name="modalfix"
|
||||
v-model="formData.year"
|
||||
readonly
|
||||
:locale="'th'"
|
||||
autoApply
|
||||
position="center"
|
||||
year-picker
|
||||
:alt-position="customPosition"
|
||||
:enableTimePicker="false"
|
||||
@update:model-value="getDataByYear(), (projectName = '')"
|
||||
>
|
||||
<template #year="{ year }">{{ year + 543 }}</template>
|
||||
<template #year-overlay-value="{ value }">{{
|
||||
parseInt(value + 543)
|
||||
}}</template>
|
||||
<template #trigger>
|
||||
<q-input
|
||||
dense
|
||||
readonly
|
||||
outlined
|
||||
hide-bottom-space
|
||||
:rules="[(val:string) => !!val || `${'กรุณาเลือกปีงบประมาณ'}`,]"
|
||||
:model-value="
|
||||
formData.year === null ? null : Number(formData.year) + 543
|
||||
"
|
||||
: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-3" v-if="choice == 'PROJECT'">
|
||||
|
||||
<div
|
||||
class="col-3"
|
||||
v-if="choice == 'PROJECT' && props.type !== 'DEVELOP'"
|
||||
>
|
||||
<q-select
|
||||
outlined
|
||||
dense
|
||||
|
|
@ -347,19 +321,71 @@ watch(
|
|||
</template>
|
||||
</q-select>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<q-input
|
||||
v-model="formData.name"
|
||||
readonly
|
||||
outlined
|
||||
dense
|
||||
:rules="[(val:string) => !!val || `${'กรุณากรอกชื่อเรื่อง/เนื้อเรื่อง/หัวข้อการพัฒนา'}`,]"
|
||||
lazy-rules
|
||||
hide-bottom-space
|
||||
class="inputgreen"
|
||||
label="ชื่อเรื่อง/เนื้อเรื่อง/หัวข้อการพัฒนา"
|
||||
<div class="col-12 row q-col-gutter-x-sm">
|
||||
<div
|
||||
:class="
|
||||
props.type == 'REQUEST' ||
|
||||
(props.type == 'KPI' && choice == 'MANUAL')
|
||||
? 'col-12'
|
||||
: 'col-9'
|
||||
"
|
||||
>
|
||||
</q-input>
|
||||
<q-input
|
||||
v-model="formData.name"
|
||||
readonly
|
||||
outlined
|
||||
dense
|
||||
:rules="[(val:string) => !!val || `${'กรุณากรอกชื่อเรื่อง/เนื้อเรื่อง/หัวข้อการพัฒนา'}`,]"
|
||||
lazy-rules
|
||||
hide-bottom-space
|
||||
class="inputgreen"
|
||||
label="ชื่อเรื่อง/เนื้อเรื่อง/หัวข้อการพัฒนา"
|
||||
>
|
||||
</q-input>
|
||||
</div>
|
||||
<div class="col-3" v-if="choice == 'PROJECT'">
|
||||
<datepicker
|
||||
menu-class-name="modalfix"
|
||||
v-model="formData.year"
|
||||
readonly
|
||||
:locale="'th'"
|
||||
autoApply
|
||||
position="center"
|
||||
year-picker
|
||||
:alt-position="customPosition"
|
||||
:enableTimePicker="false"
|
||||
@update:model-value="getDataByYear(), (projectName = '')"
|
||||
>
|
||||
<template #year="{ year }">{{ year + 543 }}</template>
|
||||
<template #year-overlay-value="{ value }">{{
|
||||
parseInt(value + 543)
|
||||
}}</template>
|
||||
<template #trigger>
|
||||
<q-input
|
||||
dense
|
||||
readonly
|
||||
outlined
|
||||
hide-bottom-space
|
||||
:rules="[(val:string) => !!val || `${'กรุณาเลือกปีงบประมาณ'}`,]"
|
||||
:model-value="
|
||||
formData.year === null
|
||||
? null
|
||||
: Number(formData.year) + 543
|
||||
"
|
||||
: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>
|
||||
<div class="col-12">
|
||||
<span class="text-weight-medium">วิธีการพัฒนา</span>
|
||||
|
|
@ -464,7 +490,7 @@ watch(
|
|||
label="10 การฝึกอบรมอื่นๆ"
|
||||
/> -->
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<div class="col-12" v-if="props.type !== 'DEVELOP'">
|
||||
<q-input
|
||||
label="เป้าหมายการนำไปพัฒนางาน"
|
||||
v-model="formData.target"
|
||||
|
|
@ -477,7 +503,10 @@ watch(
|
|||
hide-bottom-space
|
||||
></q-input>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
<div
|
||||
class="col-12"
|
||||
v-if="props.type !== 'DEVELOP' && props.type !== 'REQUEST'"
|
||||
>
|
||||
<q-card bordered>
|
||||
<div class="bg-grey-2 row q-py-sm text-weight-bold col-12">
|
||||
<div class="col-4 text-center">
|
||||
|
|
@ -493,7 +522,6 @@ watch(
|
|||
</div>
|
||||
<div class="col-8">
|
||||
<q-input
|
||||
|
||||
v-model="formData.achievement10"
|
||||
outlined
|
||||
readonly
|
||||
|
|
@ -512,7 +540,6 @@ watch(
|
|||
</div>
|
||||
<div class="col-8">
|
||||
<q-input
|
||||
|
||||
v-model="formData.achievement5"
|
||||
outlined
|
||||
readonly
|
||||
|
|
@ -545,7 +572,10 @@ watch(
|
|||
</q-card>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row q-pa-sm justify-center">
|
||||
<div
|
||||
class="row q-pa-sm justify-center"
|
||||
v-if="props.type !== 'DEVELOP' && props.type !== 'REQUEST'"
|
||||
>
|
||||
<span class="text-body2 text-weight-bold">ผลการพัฒนา </span>
|
||||
<div class="text-primary q-pl-md">
|
||||
{{ formData.point }}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue