Merge branch 'develop' into nice_dev

This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490 2024-05-08 09:17:09 +07:00
commit 10a34f7ba5
22 changed files with 1010 additions and 718 deletions

View file

@ -244,7 +244,7 @@ function close() {
async function getDataTable(id: string, level: number = 0) {
showLoader();
const body = {
node: level,
nodeId: id,
@ -511,11 +511,11 @@ function onSubmit() {
</script>
<template>
<q-dialog v-model="modal" persistent full-width>
<q-card>
<q-card class="no-scroll">
<q-form greedy @submit.prevent @validation-success="onSubmit">
<DialogHeader :tittle="title" :close="close" />
<q-separator />
<q-card-section>
<q-card-section style="max-height: 80vh" class="scroll">
<div class="row">
<q-card
bordered

View file

@ -67,8 +67,8 @@ const fecthappointmentByid = async () => {
const data = res.data.result;
profileId.value = data.profileId;
title.value.fullname = `${data.prefix}${data.firstname ?? "-"} ${
data.lastname ?? "-"
title.value.fullname = `${data.prefix}${data.firstName ?? "-"} ${
data.lastName ?? "-"
}`;
title.value.organizationPositionOld = data.organizationPositionOld ?? "-";
title.value.positionLevelOld = data.positionLevelOld ?? "-";
@ -92,47 +92,39 @@ const fecthappointmentByid = async () => {
});
};
//
const clickSave = async () => {
if (myForm.value !== null) {
myForm.value.validate().then((success: any) => {
if (success) {
dialogConfirm(
$q,
async () => await putAppointment(),
"ต้องการแก้ไขข้อมูลหรือไม่?",
"แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย"
);
}
});
}
};
//
const putAppointment = async () => {
let data = {
educationOld: educationOld.value,
organizationPositionOld: organizationPositionOld.value,
positionTypeOld: positionTypeOld.value,
positionLevelOld: positionLevelOld.value,
positionNumberOld: posNo.value,
amountOld: Number(salary.value),
reason: reason.value,
positionDate: date.value,
};
showLoader();
await http
.put(config.API.appointmentByid(paramsId.toString()), data)
.then(() => {
success($q, "บันทึกข้อมูลสำเร็จ");
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
fecthappointmentByid();
edit.value = false;
});
};
function putAppointment() {
dialogConfirm(
$q,
() => {
let data = {
educationOld: educationOld.value,
organizationPositionOld: organizationPositionOld.value,
positionTypeOld: positionTypeOld.value,
positionLevelOld: positionLevelOld.value,
positionNumberOld: posNo.value,
amountOld: Number(salary.value),
reason: reason.value,
positionDate: date.value,
};
showLoader();
http
.put(config.API.appointmentByid(paramsId.toString()), data)
.then(() => {
success($q, "บันทึกข้อมูลสำเร็จ");
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
fecthappointmentByid();
edit.value = false;
});
},
"ต้องการแก้ไขข้อมูลหรือไม่?",
"แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย"
);
}
const cancel = () => {
edit.value = false;
fecthappointmentByid();
@ -175,48 +167,54 @@ onMounted(async () => {
<CardProfile :data="dataProfile as DataProfile" />
<q-card bordered class="row col-12 text-dark q-mt-sm">
<div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">
<div class="q-pl-sm text-weight-bold text-dark">
แกไขขอมลเพอลงบญชแนบทาย
</div>
<q-space />
<div v-if="status !== 'DONE' && status !== 'REPORT'">
<div class="q-gutter-sm" v-if="!edit">
<q-btn
outline
color="primary"
dense
icon-right="mdi-file-edit-outline"
class="q-px-sm"
label="แก้ไข"
style="width: 80px"
@click="edit = !edit"
/>
<q-form
greedy
@submit.prevent
@validation-success="putAppointment"
ref="myForm"
>
<div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">
<div class="q-pl-sm text-weight-bold text-dark">
แกไขขอมลเพอลงบญชแนบทาย
</div>
<div class="q-gutter-sm" v-else>
<q-btn
outline
color="public"
dense
class="q-px-sm"
label="บันทึก"
style="width: 80px"
@click="clickSave"
/>
<q-btn
outline
color="red"
dense
class="q-px-sm"
label="ยกเลิก"
style="width: 80px"
@click="cancel()"
/>
<q-space />
<div v-if="status !== 'DONE' && status !== 'REPORT'">
<div class="q-gutter-sm" v-if="!edit">
<q-btn
outline
color="primary"
dense
icon-right="mdi-file-edit-outline"
class="q-px-sm"
label="แก้ไข"
style="width: 80px"
@click="edit = !edit"
/>
</div>
<div class="q-gutter-sm" v-else>
<q-btn
outline
type="submit"
color="public"
dense
class="q-px-sm"
label="บันทึก"
style="width: 80px"
/>
<q-btn
outline
color="red"
dense
class="q-px-sm"
label="ยกเลิก"
style="width: 80px"
@click="cancel()"
/>
</div>
</div>
</div>
</div>
<div class="col-12"><q-separator /></div>
<q-form ref="myForm">
<div class="col-12"><q-separator /></div>
<div class="row col-12 q-pa-md">
<div class="col-12">
<div class="text-weight-bold">การศกษา</div>
@ -311,12 +309,19 @@ onMounted(async () => {
</div>
<div class="col-xs-6 col-sm-3 row">
<div class="col-12">
<CurrencyInput
<q-input
v-model="salary"
label="เงินเดือน"
:edit="edit"
:outlined="edit"
dense
:readonly="!edit"
hide-bottom-space
:borderless="!edit"
:label="`${'เงินเดือน'}`"
:rules="[(val:number) => !!val || `${'กรุณากรอกเงินเดือน'}`]"
lazy-rules
mask="###,###,###,###"
reverse-fill-mask
class="inputgreen"
/>
</div>
</div>

View file

@ -304,12 +304,19 @@ onMounted(async () => {
</div>
<div class="col-xs-6 col-sm-3 row">
<div class="col-12">
<CurruncyInput
<q-input
v-model="salary"
label="เงินเดือน"
:edit="edit"
:outlined="edit"
dense
:readonly="!edit"
class="inputgreen"
hide-bottom-space
:borderless="!edit"
:label="`${'เงินเดือน'}`"
:rules="[(val:number) => !!val || `${'กรุณากรอกเงินเดือน'}`]"
lazy-rules
mask="###,###,###,###"
reverse-fill-mask
/>
</div>
</div>

View file

@ -126,7 +126,7 @@ const clickPrevious = async () => {
unelevated
:disabled="!editvisible"
:color="!editvisible ? 'grey-7' : 'public'"
@click="checkSave"
type="submit"
label="บันทึก"
><!-- icon="mdi-content-save-outline"
<q-tooltip>นท</q-tooltip> -->

View file

@ -448,15 +448,11 @@ const clickAdd = async () => {
* กดบนทกใน dialog
*/
const clickSave = async () => {
myForm.value.validate().then(async (result: boolean) => {
if (result) {
if (modalEdit.value) {
await editData();
} else {
await saveData();
}
}
});
if (modalEdit.value) {
await dialogConfirm($q, () => editData());
} else {
await dialogConfirm($q, () => saveData());
}
};
/**
@ -662,10 +658,12 @@ const addData = () => {
* งกนปมยกเลกการแกไขขอม
*/
const clickCancel = async () => {
myForm.value.resetValidation()
if (editRow.value == true) {
dialogConfirm(
$q,
async () => {
edit.value = false;
await checkRowPage();
await getData();
},
@ -778,12 +776,12 @@ const getClass = (val: boolean) => {
</q-card>
<q-dialog v-model="modal" persistent>
<q-card style="width: 600px">
<q-form ref="myForm">
<q-form ref="myForm" greedy @submit.prevent @validation-success="clickSave">
<DialogHeader tittle="ประวัติการศึกษา" :close="clickClose" />
<q-separator />
<q-card-section class="q-p-sm">
<div
class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs"
class="row col-12 items-top q-col-gutter-x-xs q-col-gutter-y-xs"
>
<div class="col-xs-6 col-sm-6 col-md-6">
<selector
@ -1227,7 +1225,6 @@ const getClass = (val: boolean) => {
<DialogFooter
:cancel="clickCancel"
:edit="clickEdit"
:save="clickSave"
:validate="validateData"
:clickNext="clickNext"
:clickPrevious="clickPrevious"

View file

@ -43,7 +43,14 @@ const emit = defineEmits(["update:statusEdit"]);
const route = useRoute();
const $q = useQuasar();
const mixin = useCounterMixin();
const { date2Thai, success, messageError, showLoader, hideLoader } = mixin;
const {
date2Thai,
success,
messageError,
showLoader,
hideLoader,
dialogConfirm,
} = mixin;
const edit = ref<boolean>(false);
const addressData = ref<AddressType>(props.data);
const myform = ref<any>();
@ -138,61 +145,54 @@ const getNewData = async () => {
//
const editData = async () => {
const body = {
registrationSame: addressData.value.registSame == "1",
registrationAddress: addressData.value.registAddress,
registrationSubDistrictId: registAddress.subDistrictId,
registrationDistrictId: registAddress.districtId,
registrationProvinceId: registAddress.provinceId,
registrationZipCode: registAddress.provinceId,
currentAddress:
addressData.value.registSame == "1"
? addressData.value.registAddress
: addressData.value.currentAddress,
currentSubDistrictId:
addressData.value.registSame == "1"
? registAddress.subDistrictId
: currentAddress.subDistrictId,
currentDistrictId:
addressData.value.registSame == "1"
? registAddress.districtId
: currentAddress.districtId,
currentProvinceId:
addressData.value.registSame == "1"
? registAddress.provinceId
: currentAddress.provinceId,
currentZipCode:
addressData.value.registSame == "1"
? registAddress.zipCode
: currentAddress.zipCode,
};
showLoader();
await http
.put(
config.API.placementAddressId(route.params.personalId.toString()),
body
)
.then(() => {
success($q, "แก้ไขข้อมูลสำเร็จ");
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
edit.value = false;
emit("update:statusEdit", false);
await getNewData();
await props.fetch();
// await fetchProvince();
});
};
//
const saveData = async () => {
myform.value.validate().then((success: boolean) => {
if (success) {
editData();
}
dialogConfirm($q, async() => {
const body = {
registrationSame: addressData.value.registSame == "1",
registrationAddress: addressData.value.registAddress,
registrationSubDistrictId: registAddress.subDistrictId,
registrationDistrictId: registAddress.districtId,
registrationProvinceId: registAddress.provinceId,
registrationZipCode: registAddress.provinceId,
currentAddress:
addressData.value.registSame == "1"
? addressData.value.registAddress
: addressData.value.currentAddress,
currentSubDistrictId:
addressData.value.registSame == "1"
? registAddress.subDistrictId
: currentAddress.subDistrictId,
currentDistrictId:
addressData.value.registSame == "1"
? registAddress.districtId
: currentAddress.districtId,
currentProvinceId:
addressData.value.registSame == "1"
? registAddress.provinceId
: currentAddress.provinceId,
currentZipCode:
addressData.value.registSame == "1"
? registAddress.zipCode
: currentAddress.zipCode,
};
showLoader();
await http
.put(
config.API.placementAddressId(route.params.personalId.toString()),
body
)
.then(() => {
success($q, "แก้ไขข้อมูลสำเร็จ");
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
edit.value = false;
emit("update:statusEdit", false);
await getNewData();
await props.fetch();
// await fetchProvince();
});
});
};
@ -440,18 +440,18 @@ const getClass = (val: boolean) => {
<template>
<q-card class="col-12 q-px-lg q-py-md q-mt-md no-border">
<HeaderTop
v-model:edit="edit"
header="ข้อมูลที่อยู่"
icon="mdi-map-marker"
:save="saveData"
:history="false"
:changeBtn="changeBtn"
:disable="statusEdit"
:cancel="refreshData"
/>
<q-form ref="myform">
<div class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs">
<q-form ref="myform" greedy @submit.prevent @validation-success="editData">
<HeaderTop
v-model:edit="edit"
header="ข้อมูลที่อยู่"
icon="mdi-map-marker"
:history="false"
:changeBtn="changeBtn"
:disable="statusEdit"
:cancel="refreshData"
/>
<div class="row col-12 items-top q-col-gutter-x-xs q-col-gutter-y-xs">
<div class="col-xs-12">
<q-input
:class="getClass(edit)"

View file

@ -45,8 +45,15 @@ const store = useProfileDataStore();
const { profileData, changeProfileColumns } = store;
const mixin = useCounterMixin();
const { date2Thai, success, dateToISO, messageError, showLoader, hideLoader } =
mixin;
const {
date2Thai,
success,
dateToISO,
messageError,
showLoader,
hideLoader,
dialogConfirm,
} = mixin;
const route = useRoute();
const id = ref<string>("");
const certificateNo = ref<string>();
@ -313,15 +320,11 @@ const clickAdd = async () => {
* กดบนทกใน dialog
*/
const clickSave = async () => {
myForm.value.validate().then(async (result: boolean) => {
if (result) {
if (modalEdit.value) {
await editData();
} else {
await saveData();
}
}
});
if (modalEdit.value) {
await dialogConfirm($q, () => editData());
} else {
await dialogConfirm($q, () => saveData());
}
};
/**
@ -476,6 +479,7 @@ const addData = () => {
* งกนปมยกเลกการแกไขขอม
*/
const clickCancel = async () => {
myForm.value.resetValidation()
if (editRow.value == true) {
$q.dialog({
title: `ข้อมูลมีการแก้ไข`,
@ -618,7 +622,12 @@ const getClass = (val: boolean) => {
<!-- popup Edit window-->
<q-dialog v-model="modal" persistent>
<q-card style="width: 600px">
<q-form ref="myForm">
<q-form
ref="myForm"
greedy
@submit.prevent
@validation-success="clickSave"
>
<DialogHeader
:tittle="
profileType == 'employee'
@ -630,7 +639,7 @@ const getClass = (val: boolean) => {
<q-separator />
<q-card-section class="q-p-sm">
<div
class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs"
class="row col-12 items-top q-col-gutter-x-xs q-col-gutter-y-xs"
>
<div class="col-xs-6 col-sm-6 col-md-6">
<q-input
@ -772,8 +781,6 @@ const getClass = (val: boolean) => {
<DialogFooter
:cancel="clickCancel"
:edit="clickEdit"
:save="clickSave"
:validate="validateData"
:clickNext="clickNext"
:clickPrevious="clickPrevious"
:clickDelete="clickDelete"

View file

@ -36,7 +36,14 @@ const route = useRoute();
const $q = useQuasar();
const mixin = useCounterMixin();
const { date2Thai, success, messageError, showLoader, hideLoader } = mixin;
const {
date2Thai,
success,
messageError,
showLoader,
hideLoader,
dialogConfirm,
} = mixin;
const edit = ref<boolean>(false);
const myform = ref<QForm | null>(null);
@ -93,57 +100,62 @@ const fetchPrefix = async () => {
};
const editData = async () => {
showLoader();
// const body: ResponseObject = {
// couple: familyData.value.couple == "1",
// couplePrefixId: familyData.value.marryPrefixId,
// coupleFirstName: familyData.value.marryFirstName,
// coupleLastName: familyData.value.marryLastName,
// coupleLastNameOld: familyData.value.lastnameCOld,
// coupleCareer: familyData.value.marryOccupation,
// fatherPrefixId: familyData.value.fatherPrefixId,
// fatherFirstName: familyData.value.fatherFirstName,
// fatherLastName: familyData.value.fatherLastName,
// fatherCareer: familyData.value.fatherOccupation,
// motherPrefixId: familyData.value.motherPrefixId,
// motherFirstName: familyData.value.motherFirstName,
// motherLastName: familyData.value.motherLastName,
// motherCareer: familyData.value.motherOccupation,
// // childrens: familyData.value.childrens,
// createdFullName: "-",
// createdAt: new Date(),
// };
dialogConfirm($q, async () => {
showLoader();
// const body: ResponseObject = {
// couple: familyData.value.couple == "1",
// couplePrefixId: familyData.value.marryPrefixId,
// coupleFirstName: familyData.value.marryFirstName,
// coupleLastName: familyData.value.marryLastName,
// coupleLastNameOld: familyData.value.lastnameCOld,
// coupleCareer: familyData.value.marryOccupation,
// fatherPrefixId: familyData.value.fatherPrefixId,
// fatherFirstName: familyData.value.fatherFirstName,
// fatherLastName: familyData.value.fatherLastName,
// fatherCareer: familyData.value.fatherOccupation,
// motherPrefixId: familyData.value.motherPrefixId,
// motherFirstName: familyData.value.motherFirstName,
// motherLastName: familyData.value.motherLastName,
// motherCareer: familyData.value.motherOccupation,
// // childrens: familyData.value.childrens,
// createdFullName: "-",
// createdAt: new Date(),
// };
const body = {
couple: familyData.value.couple == "1",
couplePrefixId: familyData.value.marryPrefixId,
coupleFirstName: familyData.value.marryFirstName,
coupleLastName: familyData.value.marryLastName,
coupleLastNameOld: "",
coupleCareer: familyData.value.marryOccupation,
fatherPrefixId: familyData.value.fatherPrefixId,
fatherFirstName: familyData.value.fatherFirstName,
fatherLastName: familyData.value.fatherLastName,
fatherCareer: familyData.value.fatherOccupation,
motherPrefixId: familyData.value.motherPrefixId,
motherFirstName: familyData.value.motherFirstName,
motherLastName: familyData.value.motherLastName,
motherCareer: familyData.value.motherOccupation,
};
await http
.put(config.API.placementFamilyId(route.params.personalId.toString()), body)
.then(() => {
success($q, "บันทึกข้อมูลสำเร็จ");
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
hideLoader();
edit.value = false;
emit("update:statusEdit", false);
await props.fetch();
});
const body = {
couple: familyData.value.couple == "1",
couplePrefixId: familyData.value.marryPrefixId,
coupleFirstName: familyData.value.marryFirstName,
coupleLastName: familyData.value.marryLastName,
coupleLastNameOld: "",
coupleCareer: familyData.value.marryOccupation,
fatherPrefixId: familyData.value.fatherPrefixId,
fatherFirstName: familyData.value.fatherFirstName,
fatherLastName: familyData.value.fatherLastName,
fatherCareer: familyData.value.fatherOccupation,
motherPrefixId: familyData.value.motherPrefixId,
motherFirstName: familyData.value.motherFirstName,
motherLastName: familyData.value.motherLastName,
motherCareer: familyData.value.motherOccupation,
};
await http
.put(
config.API.placementFamilyId(route.params.personalId.toString()),
body
)
.then(() => {
success($q, "บันทึกข้อมูลสำเร็จ");
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
hideLoader();
edit.value = false;
emit("update:statusEdit", false);
await props.fetch();
});
});
};
const saveData = async () => {
@ -188,18 +200,18 @@ const getClass = (val: boolean) => {
<template>
<q-card flat class="col-12 q-px-lg q-py-md q-mt-md text-dark">
<HeaderTop
v-model:edit="edit"
header="ข้อมูลครอบครัว"
icon="mdi-account-group"
:save="saveData"
:history="false"
:changeBtn="changeBtn"
:disable="statusEdit"
:cancel="refreshData"
/>
<q-form ref="myform" class="col-12">
<div class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs">
<q-form ref="myform" greedy @submit.prevent @validation-success="editData">
<HeaderTop
v-model:edit="edit"
header="ข้อมูลครอบครัว"
icon="mdi-account-group"
:history="false"
:changeBtn="changeBtn"
:disable="statusEdit"
:cancel="refreshData"
/>
<div class="row col-12 items-top q-col-gutter-x-xs q-col-gutter-y-xs">
<div class="col-xs-12 text-weight-bold"> ดา</div>
<div class="col-xs-12 col-sm-3 col-md-3">
<selector

View file

@ -54,6 +54,7 @@ const {
modalError,
showLoader,
hideLoader,
dialogConfirm,
} = mixin;
const profileStore = useProfileDataStore();
@ -257,43 +258,45 @@ const calRetire = async (birth: Date) => {
};
const editData = async () => {
if (age.value == false) {
modalError($q, "พบข้อผิดพลาด", "วันเกิดไม่ถูกต้อง");
return;
}
dialogConfirm($q, async () => {
if (age.value == false) {
modalError($q, "พบข้อผิดพลาด", "วันเกิดไม่ถูกต้อง");
return;
}
const body: any = {
citizenId: informaData.value.idCard,
prefixId: informaData.value.prefixId,
firstName: informaData.value.firstname,
lastName: informaData.value.lastname,
genderId: informaData.value.genderId,
nationality: informaData.value.nationality,
race: informaData.value.race,
religionId: informaData.value.religionId,
birthDate: informaData.value.dateOfBirth,
bloodGroupId: informaData.value.bloodGroupId,
relationshipId: informaData.value.relationshipId,
telephoneNumber: informaData.value.telephone,
};
showLoader();
await http
.put(
config.API.placementInformationId(route.params.personalId.toString()),
body
)
.then((res) => {
success($q, "บันทึกข้อมูลสำเร็จ");
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
edit.value = false;
emit("update:statusEdit", false);
await props.fetch();
await changeBirth(informaData.value.dateOfBirth ?? new Date());
});
const body: any = {
citizenId: informaData.value.idCard,
prefixId: informaData.value.prefixId,
firstName: informaData.value.firstname,
lastName: informaData.value.lastname,
genderId: informaData.value.genderId,
nationality: informaData.value.nationality,
race: informaData.value.race,
religionId: informaData.value.religionId,
birthDate: informaData.value.dateOfBirth,
bloodGroupId: informaData.value.bloodGroupId,
relationshipId: informaData.value.relationshipId,
telephoneNumber: informaData.value.telephone,
};
showLoader();
await http
.put(
config.API.placementInformationId(route.params.personalId.toString()),
body
)
.then((res) => {
success($q, "บันทึกข้อมูลสำเร็จ");
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
edit.value = false;
emit("update:statusEdit", false);
await props.fetch();
await changeBirth(informaData.value.dateOfBirth ?? new Date());
});
});
};
const saveData = async () => {
@ -328,18 +331,18 @@ const getClass = (val: boolean) => {
</script>
<template>
<q-card flat bordered class="col-12 q-px-lg q-py-md no-border">
<HeaderTop
v-model:edit="edit"
header="ข้อมูลส่วนตัว"
icon="mdi-account"
:save="saveData"
:history="false"
:changeBtn="changeBtn"
:disable="statusEdit"
:cancel="onCancel"
/>
<q-form ref="myform" class="col-12">
<div class="row col-12 items-center q-col-gutter-x-sm q-col-gutter-y-sm">
<q-form ref="myform" greedy @submit.prevent @validation-success="editData">
<HeaderTop
v-model:edit="edit"
header="ข้อมูลส่วนตัว"
icon="mdi-account"
:history="false"
:changeBtn="changeBtn"
:disable="statusEdit"
:cancel="onCancel"
/>
<div class="row col-12 items-top q-col-gutter-x-sm q-col-gutter-y-sm">
<div class="col-xs-6 col-sm-3 col-md-3">
<q-input
:class="getClass(edit)"

View file

@ -131,7 +131,7 @@ const add = () => {
round
v-if="edit"
:color="!edit ? 'grey-7' : 'public'"
@click="save"
type="submit"
icon="mdi-content-save-outline"
>
<q-tooltip>นทกขอม</q-tooltip>

View file

@ -7,11 +7,14 @@ import type { ResponseRow } from "@/modules/05_placement/interface/response/Rece
import DialogHeader from "@/modules/05_placement/components/PersonalList/DialogHeader.vue";
import http from "@/plugins/http";
import config from "@/app.config";
import { useTransferDataStore } from "@/modules/05_placement/store";
const transferStore = useTransferDataStore();
const { statusText } = transferStore;
const $q = useQuasar();
const selected = ref<ResponseRow[]>([]);
const mixin = useCounterMixin();
const { showLoader, success, messageError, dialogConfirm, hideLoader } = mixin;
const { showLoader, success, messageError, dialogConfirm, hideLoader,date2Thai } = mixin;
//
const visibleColumns2 = ref<string[]>([
@ -19,9 +22,9 @@ const visibleColumns2 = ref<string[]>([
"citizenId",
"fullname",
"organizationName",
"birthday",
"dateText",
"statusText",
"dateOfBirth",
"createdAt",
"status",
]);
//
const columns2 = ref<QTableProps["columns"]>([
@ -70,22 +73,22 @@ const columns2 = ref<QTableProps["columns"]>([
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "birthday",
name: "dateOfBirth",
align: "left",
label: "วัน/เดือน/ปี เกิด",
sortable: true,
field: "birthday",
field: "dateOfBirth",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "dateText",
name: "createdAt",
align: "left",
label: "วันที่ดำเนินการ",
sortable: true,
field: "dateText",
field: "createdAt",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
@ -93,11 +96,11 @@ const columns2 = ref<QTableProps["columns"]>([
sortOrder: "da",
},
{
name: "statusText",
name: "status",
align: "left",
label: "สถานะ",
sortable: true,
field: "statusText",
field: "status",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
@ -174,75 +177,144 @@ watchEffect(() => {
<div class="row justify-end">
<div class="col-5">
<q-toolbar style="padding: 0">
<q-input borderless outlined dense debounce="300" :model-value="filterKeyword2"
@update:model-value="updateInput" placeholder="ค้นหา" style="width: 850px; max-width: auto" >
<q-input
borderless
outlined
dense
debounce="300"
:model-value="filterKeyword2"
@update:model-value="updateInput"
placeholder="ค้นหา"
style="width: 850px; max-width: auto"
>
<template v-slot:append>
<q-icon v-if="filterKeyword2 == ''" name="search" />
<q-icon v-if="filterKeyword2 !== ''" name="clear" class="cursor-pointer" @click="Reset" />
<q-icon
v-if="filterKeyword2 !== ''"
name="clear"
class="cursor-pointer"
@click="Reset"
/>
</template>
</q-input>
<q-select v-model="visibleColumns2" multiple outlined dense options-dense
:display-value="$q.lang.table.columns" emit-value map-options :options="columns2"
option-value="name" options-cover style="min-width: 150px" class="gt-xs q-ml-sm" />
<q-select
v-model="visibleColumns2"
multiple
outlined
dense
options-dense
:display-value="$q.lang.table.columns"
emit-value
map-options
:options="columns2"
option-value="name"
options-cover
style="min-width: 150px"
class="gt-xs q-ml-sm"
/>
</q-toolbar>
</div>
</div>
<d-table :columns="columns2" :rows="rows2" :filter="filterKeyword2"
row-key="personalId" flat :visible-columns="visibleColumns2" selection="multiple"
v-model:selected="selected" >
<d-table
:columns="columns2"
:rows="rows2"
:filter="filterKeyword2"
row-key="personalId"
flat
:visible-columns="visibleColumns2"
selection="multiple"
v-model:selected="selected"
>
<template v-slot:header-selection="scope">
<q-checkbox keep-color color="primary" dense v-model="scope.selected" />
<q-checkbox
keep-color
color="primary"
dense
v-model="scope.selected"
/>
</template>
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer">
<q-td>
<q-checkbox keep-color color="primary" dense v-model="props.selected" />
<q-checkbox
keep-color
color="primary"
dense
v-model="props.selected"
/>
</q-td>
<q-td key="no" :props="props">
{{ props.rowIndex + 1 }}
</q-td>
<q-td key="citizenId" :props="props" @click="props.nextPage(props.row)" >
{{ props.row.citizenId }}
</q-td>
<q-td key="fullname" :props="props" @click="props.nextPage(props.row)" >
{{ props.row.fullname }}
</q-td>
<q-td key="organizationName" :props="props" @click="props.nextPage(props.row)" >
<div v-if=" props.row.orgName !== null || props.row.positionPath !== null " >
<q-td
v-for="col in props.cols"
:key="col.name"
:props="props"
@click="props.nextPage(props.row.id)"
>
<div v-if="col.name == 'no'">
{{ props.rowIndex + 1 }}
</div>
<div v-else-if="col.name == 'fullname'">
{{
props.row.firstName
? `${props.row.prefix ?? ""}${
props.row.firstName ?? ""
} ${props.row.lastName ?? ""}`
: "-"
}}
</div>
<div v-else-if="col.name == 'dateOfBirth'">
{{
props.row.dateOfBirth
? date2Thai(props.row.dateOfBirth)
: "-"
}}
</div>
<div v-else-if="col.name == 'createdAt'">
{{
props.row.createdAt ? date2Thai(props.row.createdAt) : "-"
}}
</div>
<div v-else-if="col.name == 'organizationName'">
<div class="col-4">
<div class="text-weight-medium">
{{ props.row.orgName !== null ? props.row.orgName : "-" }}
{{ props.row.organizationShortName !== null ? `(${props.row.organizationShortName})` : "" }}
{{ props.row.root !== null ? props.row.root : "-" }}
{{
props.row.rootShortName !== null
? `(${props.row.rootShortName})`
: ""
}}
</div>
<div class="text-weight-light">
{{ props.row.positionPath !== null ? props.row.positionPath : "-" }}
{{ props.row.positionNumber !== null ? `(${props.row.positionNumber})` : "" }}
{{
props.row.nodeName !== null ? props.row.nodeName : ""
}}
{{
props.row.nodeShortName !== null
? `(${props.row.nodeShortName}${props.row.posMasterNo})`
: ""
}}
</div>
</div>
</div>
<div v-else-if="col.name == 'status'">
{{ props.row.status ? statusText(props.row.status) : "-" }}
</div>
<div v-else>
<div class="col-4">
<div class="text-weight-medium">-</div>
</div>
{{ col.value ? col.value : "-" }}
</div>
</q-td>
<q-td key="birthday" :props="props" @click="props.nextPage(props.row)" >
{{ props.row.birthday }}
</q-td>
<q-td key="dateText" :props="props" @click="props.nextPage(props.row)" >
{{ props.row.dateText }}
</q-td>
<q-td key="statusText" :props="props" @click="props.nextPage(props.row)" >
{{ props.row.statusText }}
</q-td>
</q-tr>
</template>
</d-table>
</q-card-section>
<q-card-actions align="right" class="bg-white text-teal">
<q-btn label="ส่งไปออกคำสั่ง" @click="saveOrder" :disable="checkSelected" color="public" />
<q-btn
label="ส่งไปออกคำสั่ง"
@click="saveOrder"
:disable="checkSelected"
color="public"
/>
</q-card-actions>
</q-card>
</q-dialog>

View file

@ -1,4 +1,4 @@
<script setup lang="ts">
divdivdiv<script setup lang="ts">
import { onMounted, ref } from "vue";
import { useQuasar } from "quasar";
import { useRoute, useRouter } from "vue-router";
@ -224,11 +224,11 @@ const getData = async () => {
age: "",
prefix: "",
prefixId:
(data.prefixId == "00000000-0000-0000-0000-000000000000"
(data.prefix == "00000000-0000-0000-0000-000000000000"
? null
: data.prefixId) ?? "",
firstname: data.firstname ?? "",
lastname: data.lastname ?? "",
: data.prefix) ?? "",
firstname: data.firstName ?? "",
lastname: data.lastName ?? "",
birthDate:
data.dateOfBirth !== null ? new Date(data.dateOfBirth) : null,
genderId:
@ -422,47 +422,54 @@ const conditionSave = async () => {
}
};
const saveData = async () => {
const body = {
citizenId: informaData.value.cardid,
prefixId: informaData.value.prefixId,
firstname: informaData.value.firstname,
lastname: informaData.value.lastname,
dateOfBirth:
informaData.value.birthDate !== null
? dateToISO(informaData.value.birthDate)
: null,
genderId: informaData.value.genderId,
nationality: informaData.value.nationality,
race: informaData.value.ethnicity,
religionId: informaData.value.religionId,
bloodGroupId: informaData.value.bloodId,
relationshipId: informaData.value.statusId,
telephoneNumber: informaData.value.tel,
reason: reason.value,
educationOld: educationOld.value,
organizationPositionOld: organizationPositionOld.value,
positionTypeOld: positionTypeOld.value,
positionLevelOld: positionLevelOld.value,
positionNumberOld: posNo.value,
amount: 0,
amountOld: salary.value,
};
showLoader();
await http
.put(config.API.receiveDataId(route.params.id.toString()), body)
.then((res: any) => {
success($q, "แก้ไขข้อมูลเพื่อลงบัญชีแนบท้ายสำเร็จ");
edit.value = false;
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
await getData();
hideLoader();
});
};
function saveData() {
dialogConfirm(
$q,
() => {
const body = {
citizenId: informaData.value.cardid,
prefix: informaData.value.prefixId,
firstname: informaData.value.firstname,
lastname: informaData.value.lastname,
dateOfBirth:
informaData.value.birthDate !== null
? dateToISO(informaData.value.birthDate)
: null,
genderId: informaData.value.genderId,
nationality: informaData.value.nationality,
race: informaData.value.ethnicity,
religionId: informaData.value.religionId,
bloodGroupId: informaData.value.bloodId,
relationshipId: informaData.value.statusId,
telephoneNumber: informaData.value.tel,
reason: reason.value,
educationOld: educationOld.value,
organizationPositionOld: organizationPositionOld.value,
positionTypeOld: positionTypeOld.value,
positionLevelOld: positionLevelOld.value,
positionNumberOld: posNo.value,
amount: 0,
amountOld: salary.value,
};
showLoader();
http
.put(config.API.receiveDataId(route.params.id.toString()), body)
.then((res: any) => {
success($q, "แก้ไขข้อมูลเพื่อลงบัญชีแนบท้ายสำเร็จ");
edit.value = false;
getData();
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
hideLoader();
});
},
"ต้องการแก้ไขข้อมูลหรือไม่?",
"แก้ไขข้อมูลเพื่อลงบัญชีแนบท้าย"
);
}
const getClass = (val: boolean) => {
return {
@ -493,49 +500,49 @@ onMounted(async () => {
</div>
<CardProfile :data="dataProfile as DataProfile" />
<q-card bordered class="row col-12 text-dark q-mt-sm">
<div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">
<div class="q-pl-sm text-weight-bold text-dark">
แกไขขอมลเพอลงบญชแนบทาย
<q-form greedy @submit.prevent @validation-success="saveData" ref="myForm">
<div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">
<div class="q-pl-sm text-weight-bold text-dark">
แกไขขอมลเพอลงบญชแนบทาย
</div>
<q-space />
<div class="q-gutter-sm" v-if="!edit">
<q-btn
outline
color="primary"
dense
icon-right="mdi-file-edit-outline"
class="q-px-sm"
label="แก้ไข"
style="width: 80px"
@click="edit = !edit"
v-if="!(status == 'REPORT' || status == 'DONE')"
/>
</div>
<div class="q-gutter-sm" v-else>
<q-btn
type="submit"
outline
color="public"
dense
class="q-px-sm"
label="บันทึก"
style="width: 80px"
/>
<q-btn
outline
color="red"
dense
class="q-px-sm"
label="ยกเลิก"
style="width: 80px"
@click="cancel"
/>
</div>
</div>
<q-space />
<div class="q-gutter-sm" v-if="!edit">
<q-btn
outline
color="primary"
dense
icon-right="mdi-file-edit-outline"
class="q-px-sm"
label="แก้ไข"
style="width: 80px"
@click="edit = !edit"
v-if="!(status == 'REPORT' || status == 'DONE')"
/>
</div>
<div class="q-gutter-sm" v-else>
<q-btn
outline
color="public"
dense
class="q-px-sm"
label="บันทึก"
style="width: 80px"
@click="conditionSave"
/>
<q-btn
outline
color="red"
dense
class="q-px-sm"
label="ยกเลิก"
style="width: 80px"
@click="cancel"
/>
</div>
</div>
<div class="col-12"><q-separator /></div>
<q-form ref="myForm">
<div class="col-12"><q-separator /></div>
<div class="row col-12 q-pa-md">
<div class="col-12 row bg-white">
<div class="col-xs-12 row q-col-gutter-md">
@ -865,7 +872,7 @@ onMounted(async () => {
:readonly="!edit"
:borderless="!edit"
v-model="educationOld"
:rules="[(val) => !!val || `${'กรุณากรอกวุฒิ/สาขา'}`]"
:rules="[(val:string) => !!val || `${'กรุณากรอกวุฒิ/สาขา'}`,]"
hide-bottom-space
:label="`${'วุฒิ/สาขา'}`"
type="textarea"
@ -930,15 +937,19 @@ onMounted(async () => {
/>
</div>
<div class="col-xs-6 col-sm-3">
<CurrencyInput
<q-input
v-model="salary"
:edit="edit"
:options="{
currency: 'THB',
}"
:outlined="edit"
dense
:readonly="!edit"
hide-bottom-space
:borderless="!edit"
:label="`${'เงินเดือน'}`"
:rules="[(val:number) => !!val || `${'กรุณากรอกเงินเดือน'}`]"
lazy-rules
mask="###,###,###,###"
class="inputgreen"
reverse-fill-mask
/>
</div>
<div class="col-xs-12">
@ -959,50 +970,46 @@ onMounted(async () => {
</div>
</div>
</q-form>
<q-card
v-if="rows.length > 0"
bordered
class="row col-12 text-dark q-mt-sm"
>
<div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">
<div class="q-pl-sm text-weight-bold text-dark">เอกสารเพมเต</div>
</div>
<div class="col-12"><q-separator /></div>
<div class="col-12">
<d-table
:rows="rows"
:columns="columns"
row-key="fileName"
hide-header
hide-bottom
>
<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="btnMicrosoft" :props="props">
<q-btn
type="a"
target="_blank"
:href="props.row.pathName"
flat
dense
round
color="red"
icon="picture_as_pdf"
>
<q-tooltip>ไฟล PDF</q-tooltip>
</q-btn>
</q-td>
</q-tr>
</template>
</d-table>
</div>
</q-card>
</q-card>
<q-card v-if="rows.length > 0" bordered class="row col-12 text-dark q-my-sm">
<div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">
<div class="q-pl-sm text-weight-bold text-dark">เอกสารเพมเต</div>
</div>
<div class="col-12"><q-separator /></div>
<div class="col-12">
<d-table
:rows="rows"
:columns="columns"
row-key="fileName"
hide-header
hide-bottom
>
<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="btnMicrosoft" :props="props">
<q-btn
type="a"
target="_blank"
:href="props.row.pathName"
flat
dense
round
color="red"
icon="picture_as_pdf"
>
<q-tooltip>ไฟล PDF</q-tooltip>
</q-btn>
</q-td>
</q-tr>
</template>
</d-table>
</div>
</q-card>
</template>

View file

@ -56,11 +56,11 @@ const {
const popup = () => {
const row = filters.value.filter(
(r: ResponseRow) =>
(r: any) =>
(r.status == "WAITTING" ||
r.status == "PENDING" ||
r.status == "APPROVE") &&
r.positionNumber != null &&
r.posMasterNo != null &&
r.educationOld &&
r.organizationPositionOld &&
r.positionTypeOld &&
@ -822,15 +822,9 @@ onMounted(() => {
</div>
</q-card-section>
<q-separator />
<div class="row q-px-sm q-py-xs">
<div class="row q-pa-sm">
<q-space />
<q-btn
flat
round
color="public"
@click="SaveData()"
icon="mdi-content-save-outline"
>
<q-btn label="บันทึก" color="secondary" @click="SaveData()">
<q-tooltip>นท</q-tooltip>
</q-btn>
</div>

View file

@ -272,13 +272,19 @@ onMounted(() => {
</div>
<div class="col-xs-6 col-sm-3 row">
<div class="col-12">
<CurrencyInput
<q-input
v-model="salary"
:edit="edit"
:options="{ currency: 'THB' }"
:outlined="edit"
dense
:readonly="!edit"
hide-bottom-space
:borderless="!edit"
:label="`${'เงินเดือน'}`"
class="inputgreen"
:rules="[(val:number) => !!val || `${'กรุณากรอกเงินเดือน'}`]"
lazy-rules
mask="###,###,###,###"
reverse-fill-mask
/>
</div>
</div>

View file

@ -16,7 +16,7 @@ import type {
rowFile,
} from "@/modules/05_placement/interface/response/Transfer";
import PopupPersonal from "@/components/Dialogs/PopupPersonal.vue";
const modalPersonal = ref<boolean>(false);
const personId = ref<string>("");
const $q = useQuasar();
@ -613,15 +613,19 @@ onMounted(async () => {
/>
</div>
<div class="col-xs-6 col-sm-3">
<CurrencyInput
<q-input
v-model="salary"
:edit="edit"
:options="{
currency: 'THB',
}"
:outlined="edit"
dense
:readonly="!edit"
:borderless="!edit"
hide-bottom-space
:label="`${'เงินเดือน'}`"
:rules="[(val:number) => !!val || `${'กรุณากรอกเงินเดือน'}`]"
lazy-rules
class="inputgreen"
mask="###,###,###,###"
reverse-fill-mask
/>
</div>
</div>
@ -664,7 +668,6 @@ onMounted(async () => {
:class="getClass(edit)"
:outlined="edit"
dense
:borderless="!edit"
:readonly="!edit"
:model-value="date !== null ? date2Thai(date) : null"

View file

@ -0,0 +1,65 @@
<script setup lang="ts">
import { ref } from "vue";
import DialogHeader from "@/components/DialogHeader.vue";
import type { QTableProps } from "quasar";
const modal = defineModel<boolean>("modal", { required: true });
const rows = ref<any[]>([]);
const visibleColumns = ref<string[]>(["fullName"]);
const columns = ref<QTableProps["columns"]>([
{
name: "fullName",
align: "left",
label: "ชื่อ",
sortable: true,
field: "fullName",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
]);
function close() {
modal.value = false;
}
</script>
<template>
<q-dialog persistent v-model="modal">
<q-card style="min-width: 50vw">
<DialogHeader tittle="ประวัติการแก้ไข" :close="close" />
<q-separator />
<q-card-section>
<d-table
for="table"
ref="table"
:columns="columns"
:rows="rows"
row-key="id"
flat
bordered
dense
class="custom-header-table"
:rows-per-page-options="[10, 25, 50, 100]"
:visible-columns="visibleColumns"
>
<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-th auto-width />
</q-tr>
</template>
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer">
<q-td v-for="col in props.cols" :key="col.name" :props="props">
<div class="table_ellipsis">
{{ col.value ? col.value : "-" }}
</div>
</q-td>
</q-tr>
</template>
</d-table>
</q-card-section>
</q-card>
</q-dialog>
</template>

View file

@ -28,14 +28,15 @@ const {
} = mixin;
const id = ref<string>(route.params.id ? route.params.id.toLocaleString() : "");
const editCheck = ref<boolean>(route.params.id ? true : false);
/**form ตัวชี้วัดตามแผนฯ*/
const planData = reactive({
kpiPeriodId: "", //(->APR, ->OCT)
period: "", //(->APR, ->OCT)
including: "", //
includingName: "", //
target: "", //
unit: null, //
unit: "", //
weight: null, //
achievement1: "", // 1
achievement2: "", // 2
@ -49,10 +50,14 @@ const planData = reactive({
orgRevisionId: "", //RevisionId
strategy: null, //
strategyId: "", //id
documentInfoEvidence: "", //
});
const year = ref<number>(0); //
const roundOp = ref<DataOption[]>([]);
const year = ref<number | null>(0); //
const roundOp = ref<DataOption[]>([
{ id: "APR", name: "รอบเมษายน" },
{ id: "OCT", name: "รอบตุลาคม" },
]);
const nodeplan = ref<any>([]);
const nodeAgency = ref<any>([]);
@ -64,36 +69,6 @@ const expandedAgency = ref<string[]>([]);
const editStatus = ref<boolean>(false);
const inputRef = ref<any>(null);
/** functiopn fetch รอบการประเมิน*/
function fetchRoundOption(isId: number | null = null) {
http
.get(
config.API.kpiPeriod +
`?page=${1}&pageSize=${10}&keyword=${""}&year=${year.value}`
)
.then((res) => {
const data = res.data.result.data;
const list = data.map((e: any) => ({
id: e.id,
name:
e.durationKPI === "OCT"
? "รอบตุลาคม"
: e.durationKPI === "APR"
? "รอบเมษายน"
: "",
}));
roundOp.value = list;
if (isId) {
planData.kpiPeriodId = "";
inputRef.value.resetValidation();
}
})
.catch((err) => {
messageError($q, err);
});
}
/** function fetch หาโครงสร้างที่ใช้งาน*/
function fetchOrganizationActive() {
http
@ -147,7 +122,7 @@ function fetchDataById(id: string) {
.then((res) => {
const data = res.data.result;
year.value = data.year;
planData.kpiPeriodId = data.kpiPeriodId;
planData.period = data.round;
planData.including = data.including;
planData.includingName = data.includingName;
planData.target = data.target;
@ -189,8 +164,6 @@ function fetchDataById(id: string) {
expandedPlan.value = arrayexpandedPlan
.filter((e) => e !== null)
.slice(0, -1);
fetchRoundOption();
})
.catch((err) => {
messageError($q, err);
@ -235,6 +208,27 @@ function onSubmit() {
dialogConfirm(
$q,
async () => {
const body = {
year: year.value == 0 ? null : year.value,
period: planData.period,
includingName: planData.includingName,
target: planData.target,
unit: planData.unit,
weight: planData.weight,
achievement1: planData.achievement1,
achievement2: planData.achievement2,
achievement3: planData.achievement3,
achievement4: planData.achievement4,
achievement5: planData.achievement5,
meaning: planData.meaning,
formula: planData.formula,
node: planData.node,
nodeId: planData.nodeId,
orgRevisionId: planData.orgRevisionId,
strategy: planData.strategy,
strategyId: planData.strategyId,
documentInfoEvidence: planData.documentInfoEvidence,
};
showLoader();
// editStatus.value ? editData(id.value) : addData();
try {
@ -242,7 +236,7 @@ function onSubmit() {
? config.API.kpiPlanById(id.value)
: config.API.kpiPlan;
const method = editStatus.value ? "put" : "post";
const res = await http[method](url, planData);
const res = await http[method](url, body);
success($q, "บันทึกข้อมูลสำเร็จ");
editStatus.value
? fetchDataById(id.value)
@ -272,6 +266,29 @@ onMounted(() => {
<q-form @submit.prevent greedy @validation-success="onSubmit()">
<div>
<div class="row q-col-gutter-md q-pa-md">
<div class="col-2" v-if="editCheck">
<q-input
outlined
v-model="planData.including"
label="ลำดับ/รหัสตัวชี้วัด"
bg-color="white"
readonly
dense
class="inputgreen"
/>
</div>
<div :class="`${editCheck ? 'col-6' : 'col-8'}`">
<q-input
outlined
v-model="planData.includingName"
label="ชื่อตัวชี้วัด"
bg-color="white"
dense
class="inputgreen"
:rules="[(val) => !!val || `${'กรุณากรอกชิ่อตัวชี้วัด'}`]"
hide-bottom-space
/>
</div>
<div class="col-2">
<datepicker
menu-class-name="modalfix"
@ -280,7 +297,7 @@ onMounted(() => {
autoApply
year-picker
:enableTimePicker="false"
@update:modelValue="fetchRoundOption"
@update:modelValue="planData.period = ''"
>
<template #year="{ year }">{{ year + 543 }}</template>
<template #year-overlay-value="{ value }">{{
@ -303,6 +320,17 @@ onMounted(() => {
>
</q-icon>
</template>
<template v-slot:append>
<q-icon
v-if="year"
name="cancel"
class="cursor-pointer"
@click.stop.prevent="
year = 0;
planData.period = '';
"
/>
</template>
</q-input>
</template>
</datepicker>
@ -310,47 +338,17 @@ onMounted(() => {
<div class="col-2">
<q-select
ref="inputRef"
:readonly="roundOp.length === 0"
:readonly="year == 0"
dense
outlined
v-model="planData.kpiPeriodId"
v-model="planData.period"
:options="roundOp"
label="รอบการประเมิน"
hide-bottom-space
option-label="name"
option-value="id"
map-options
emit-value
lazy-rules
class="inputgreen"
:rules="[
(val:string) =>
!!val || `${'กรุณาเลือกรอบการประเมิน'}`,
]"
/>
</div>
<div class="col-2">
<q-input
outlined
v-model="planData.including"
label="รหัสตัวชี้วัด"
bg-color="white"
dense
class="inputgreen"
:rules="[(val) => !!val || `${'กรุณากรอกรหัสตัวชี้วัด'}`]"
hide-bottom-space
/>
</div>
<div class="col-6">
<q-input
outlined
v-model="planData.includingName"
label="ชื่อตัวชี้วัด"
bg-color="white"
dense
class="inputgreen"
:rules="[(val) => !!val || `${'กรุณากรอกชิ่อตัวชี้วัด'}`]"
hide-bottom-space
/>
</div>
<div class="col-4">
@ -371,8 +369,8 @@ onMounted(() => {
v-model="planData.unit"
label="หน่วยนับ"
bg-color="white"
type="number"
dense
lazy-rules
class="inputgreen"
:rules="[(val) => !!val || `${'กรุณากรอกหน่วยนับ'}`]"
hide-bottom-space
@ -644,6 +642,16 @@ onMounted(() => {
</q-card-section>
</q-card>
</div>
<div class="col-12">
<q-input
class="inputgreen"
v-model="planData.documentInfoEvidence"
label="ข้อมูลเอกสารหลักฐาน"
outlined
dense
type="textarea"
></q-input>
</div>
</div>
<q-separator color="grey-4" />
</div>

View file

@ -45,6 +45,7 @@ const form = reactive<FormDataRole>({
weight: "", //
meaning: "", //
formula: "", //
documentInfoEvidence: "", //
node: null,
nodeId: null,
@ -71,7 +72,10 @@ const positionOp = ref<DataOption[]>([]);
const positionMainOp = ref<DataOption[]>([]);
/** Option รอบการประเมิน*/
const roundOp = ref<DataOption[]>([]);
const roundOp = ref<DataOption[]>([
{ id: "APR", name: "รอบเมษายน" },
{ id: "OCT", name: "รอบตุลาคม" },
]);
/**
* function นหาขอมลของ Option
@ -121,9 +125,9 @@ function onSubmit() {
: config.API.kpiRoleMainList;
const body = {
year: form.year == 0 ? null:form.year,
position: form.position, //
kpiPeriodId: form.round, //(->APR, ->OCT)
including: form.including, //
period: form.round, //(->APR, ->OCT)
includingName: form.includingName, //
target: form.target, //
unit: form.unit, //
@ -135,6 +139,7 @@ function onSubmit() {
achievement5: formScore.score5, // 5
meaning: form.meaning, //
formula: form.formula, //
documentInfoEvidence: form.documentInfoEvidence, //
node: form.node, //
nodeId: form.nodeId, //id
@ -171,7 +176,7 @@ function getDetail() {
const data = res.data.result;
form.position = data.position;
form.year = data.year == null ? 0 : data.year;
form.round = data.kpiPeriodId;
form.round = data.round;
form.including = data.including;
form.includingName = data.includingName;
form.target = data.target;
@ -244,21 +249,6 @@ function updateSelected(data: any) {
form.orgRevisionId = data.orgRevisionId;
}
function getRound() {
showLoader();
http
.get(config.API.kpiPeriod + `?year=${form.year}`)
.then((res) => {
const data = res.data.result.data;
roundOp.value = data.map((item: any) => ({
id: item.id,
name: statusTothai(item.durationKPI),
}));
})
.finally(() => {
hideLoader();
});
}
function statusTothai(val: string) {
switch (val) {
@ -284,7 +274,6 @@ function setModel(val: string) {
onMounted(() => {
fetchActive();
getOptions();
getRound();
if (id.value !== "") {
getDetail();
}
@ -345,7 +334,7 @@ onMounted(() => {
autoApply
year-picker
:enableTimePicker="false"
@update:model-value="(form.round = ''), getRound()"
@update:model-value="form.round = ''"
>
<template #year="{ year }">{{ year + 543 }}</template>
<template #year-overlay-value="{ value }">{{
@ -355,8 +344,6 @@ onMounted(() => {
<q-input
dense
class="inputgreen"
:rules="[(val:string) => !!val || `${'กรุณาเลือกปีงบประมาณ'}`,]"
hide-bottom-space
outlined
:model-value="
form.year === 0 ? null : Number(form.year) + 543
@ -371,12 +358,24 @@ onMounted(() => {
>
</q-icon>
</template>
<template v-slot:append>
<q-icon
v-if="form.year"
name="cancel"
class="cursor-pointer"
@click.stop.prevent="
form.year = 0;
form.round = '';
"
/>
</template>
</q-input>
</template>
</datepicker>
</div>
<div class="col-2">
<q-select
:readonly="form.year == 0"
dense
outlined
v-model="form.round"
@ -388,21 +387,16 @@ onMounted(() => {
input-class="text-red"
label="รอบการประเมิน"
class="inputgreen"
lazy-rules
:rules="[(val:string) => !!val || `${'กรุณาเลือกรอบการประเมิน'}`,]"
hide-bottom-space
/>
</div>
<div class="col-2">
<div class="col-2" v-if="id">
<q-input
label="รหัสตัวชี้วัด"
label="ลำดับ/รหัสตัวชี้วัด"
v-model="form.including"
outlined
readonly
dense
class="inputgreen"
lazy-rules
:rules="[(val:string) => !!val || `${'กรุณากรอกรหัสตัวชี้วัด'}`,]"
hide-bottom-space
/>
</div>
<div class="col-4">
@ -632,6 +626,16 @@ onMounted(() => {
type="textarea"
/>
</div>
<div class="col-12">
<q-input
class="inputgreen"
v-model="form.documentInfoEvidence"
label="ข้อมูลเอกสารหลักฐาน"
outlined
dense
type="textarea"
></q-input>
</div>
</div>
</q-card-section>
<q-separator />

View file

@ -36,6 +36,7 @@ interface FormDataRole {
weight: string;
meaning: string;
formula: string;
documentInfoEvidence: string;
node: number | null;
nodeId: string | null;
orgRevisionId: string | null;
@ -48,6 +49,15 @@ interface NewPagination {
sortBy: string;
}
interface FormListMainByRole {
page:number
pageSize:number
position:string
round:string
keyword:string
year:number|null
}
interface ListGroup{
id:string
nameGroupKPI:string
@ -66,5 +76,6 @@ export type {
FormDataRole,
NewPagination,
FormQueryCapacity,
ListGroup
ListGroup,
FormListMainByRole
};

View file

@ -4,6 +4,7 @@ import { useQuasar, type QTableProps } from "quasar";
import { useRouter } from "vue-router";
import type { DataOption } from "@/modules/14_KPI/interface/index/Main";
import DialogHistory from '@/modules/14_KPI/components/DialogHistory.vue'
/** importStore*/
import { useCounterMixin } from "@/stores/mixin";
@ -11,6 +12,8 @@ import http from "@/plugins/http";
import config from "@/app.config";
/** use*/
const modalHistory = ref<boolean>(false)
const isAll = ref<boolean>(false);
const $q = useQuasar();
const router = useRouter();
const { showLoader, hideLoader, dialogRemove, success, messageError } =
@ -22,7 +25,7 @@ const columns = ref<QTableProps["columns"]>([
{
name: "including",
align: "left",
label: "รหัสตัวชี้วัด",
label: "ลำดับ/รหัสตัวชี้วัด",
sortable: true,
field: "including",
headerStyle: "font-size: 14px",
@ -43,11 +46,14 @@ const expanded = ref<any>([]);
const filterMain = ref<string>("");
const visibleColumns = ref<string[]>(["including", "includingName"]);
const roundOp = ref<DataOption[]>([]);
const roundOp = ref<DataOption[]>([
{ id: "APR", name: "รอบเมษายน" },
{ id: "OCT", name: "รอบตุลาคม" },
]);
const totalList = ref<number>(1);
const year = ref<number>(new Date().getFullYear());
const year = ref<number|null>(new Date().getFullYear());
const nodeData = reactive<any>({
page: 1,
pageSize: 10,
@ -57,41 +63,12 @@ const nodeData = reactive<any>({
keyword: "",
});
function fetchRoundOption() {
showLoader();
http
.get(
config.API.kpiPeriod +
`?page=${1}&pageSize=${10}&keyword=${""}&year=${year.value}`
)
.then((res) => {
const data = res.data.result.data;
const list = data.map((e: any) => ({
id: e.id,
name:
e.durationKPI === "OCT"
? "รอบตุลาคม"
: e.durationKPI === "APR"
? "รอบเมษายน"
: "",
}));
roundOp.value = list;
nodeData.round = "";
fetchListProjectNew();
})
.catch((err) => {
messageError($q, err);
})
.finally(() => {
hideLoader();
});
}
function fetchList() {
showLoader();
http
.get(
config.API.kpiPlan +
`?page=${nodeData.page}&pageSize=${nodeData.pageSize}&kpiPeriodId=${nodeData.round}&nodeId=${nodeData.nodeId}&node=${nodeData.node}&keyword=${nodeData.keyword}`
`?page=${nodeData.page}&pageSize=${nodeData.pageSize}&period=${nodeData.round}&nodeId=${nodeData.nodeId}&node=${nodeData.node}&keyword=${nodeData.keyword}&year=${year.value}&isAll=${isAll.value}`
)
.then((res) => {
const data = res.data.result.data;
@ -178,12 +155,20 @@ async function deleteData(idData: string) {
function clearFilter() {
nodeData.keyword = "";
fetchActive();
fetchRoundOption();
fetchListProjectNew();
}
onMounted(() => {
fetchActive();
fetchRoundOption();
// fetchData();
/**
* เป dialog history
* @param id
*/
function onClickHistory(id:string){
modalHistory.value = true
}
onMounted(async () => {
await fetchActive();
await fetchList();
});
</script>
@ -270,7 +255,7 @@ onMounted(() => {
year-picker
:enableTimePicker="false"
style="width: 150px"
@update:model-value="fetchRoundOption"
@update:model-value="fetchListProjectNew"
>
<template #year="{ year }">{{ year + 543 }}</template>
<template #year-overlay-value="{ value }">{{
@ -281,7 +266,7 @@ onMounted(() => {
class="inputgreen"
dense
outlined
:model-value="year === 0 ? 'ทั้งหมด' : Number(year) + 543"
:model-value="year === null ? 'ทั้งหมด' : Number(year) + 543"
:label="`${'ปีงบประมาณ'}`"
>
<template v-slot:prepend>
@ -292,6 +277,15 @@ onMounted(() => {
>
</q-icon>
</template>
<template v-if="year" v-slot:append>
<q-icon
name="cancel"
@click.stop.prevent="
(year = null), (nodeData.page = 1), fetchListProjectNew()
"
class="cursor-pointer"
/>
</template>
</q-input>
</template>
</datepicker>
@ -323,7 +317,20 @@ onMounted(() => {
</q-toolbar-title>
</div>
<q-space />
<div class="row q-gutter-sm">
<q-checkbox
keep-color
v-model="isAll"
label="แสดงตำแหน่งทั้งหมด"
color="primary"
@update:model-value="fetchListProjectNew"
>
<q-tooltip
>แสดงตำแหนงทงหมดภายใตหนวยงาน/วนราชการทเลอก</q-tooltip
>
</q-checkbox>
<q-input
class="inputgreen"
standout
@ -367,11 +374,12 @@ onMounted(() => {
ref="table"
:columns="columns"
:rows="rows"
row-key="subject"
row-key="id"
flat
bordered
dense
class="custom-header-table"
:rows-per-page-options="[10, 25, 50, 100]"
:visible-columns="visibleColumns"
>
<template v-slot:header="props">
@ -389,29 +397,66 @@ onMounted(() => {
{{ col.value ? col.value : "-" }}
</div>
</q-td>
<q-td>
<q-td auto-width>
<q-btn
color="primary"
flat
dense
round
class="q-mr-xs"
color="grey"
@click.stop
size="14px"
icon="mdi-pencil-outline"
clickable
@click="onClickAddOrView(true, props.row.id)"
icon="more_vert"
>
<q-tooltip>แกไขขอม</q-tooltip>
</q-btn>
<q-btn
flat
round
icon="delete"
color="red"
@click.stop.pervent="deleteData(props.row.id)"
>
<q-tooltip>ลบขอม </q-tooltip>
<q-menu>
<q-list style="min-width: 180px">
<q-item
clickable
v-close-popup
@click="onClickAddOrView(true, props.row.id)"
>
<q-item-section
style="min-width: 0px"
avatar
class="q-py-sm"
>
<q-tooltip>แกไขขอม</q-tooltip>
<q-icon color="primary" size="xs" name="mdi-pencil-outline" />
</q-item-section>
<q-item-section>แกไขขอม</q-item-section>
</q-item>
<q-item
clickable
v-close-popup
@click="onClickHistory(props.row.id)"
>
<q-item-section
style="min-width: 0px"
avatar
class="q-py-sm"
>
<q-tooltip>ประวการแกไข</q-tooltip>
<q-icon color="info" size="xs" name="mdi-history" />
</q-item-section>
<q-item-section>ประวการแกไข</q-item-section>
</q-item>
<q-item
clickable
v-close-popup
@click.stop.pervent="deleteData(props.row.id)"
>
<q-item-section
style="min-width: 0px"
avatar
class="q-py-sm"
>
<q-tooltip>ลบขอม</q-tooltip>
<q-icon color="red" size="xs" name="mdi-delete" />
</q-item-section>
<q-item-section>ลบขอม</q-item-section>
</q-item>
</q-list>
</q-menu>
</q-btn>
</q-td>
</q-tr>
</template>
@ -420,6 +465,11 @@ onMounted(() => {
</div>
</div>
</q-card>
<DialogHistory
v-model:modal="modalHistory"
/>
</template>
<style lang="scss" scoped>

View file

@ -7,10 +7,14 @@ import { useRouter } from "vue-router";
import { useCounterMixin } from "@/stores/mixin";
import http from "@/plugins/http";
import config from "@/app.config";
import type { NewPagination } from "@/modules/14_KPI/interface/request/Main";
import type {
NewPagination,
FormListMainByRole,
} from "@/modules/14_KPI/interface/request/Main";
import type { DataOption } from "@/modules/14_KPI/interface/index/Main";
import DialogHistory from "@/modules/14_KPI/components/DialogHistory.vue";
/** use*/
const modalHistory = ref<boolean>(false);
const total = ref<number>();
const $q = useQuasar();
const router = useRouter();
@ -56,7 +60,7 @@ const columns = ref<QTableProps["columns"]>([
]);
const visibleColumns = ref<string[]>(["including", "includingName"]);
const formFilter = reactive({
const formFilter = reactive<FormListMainByRole>({
page: 1,
pageSize: 10,
position: "",
@ -70,13 +74,16 @@ const pagination = ref({
});
/** Option รอบการประเมิน*/
const roundOp = ref<DataOption[]>([]);
const roundOp = ref<DataOption[]>([
{ id: "APR", name: "รอบเมษายน" },
{ id: "OCT", name: "รอบตุลาคม" },
]);
function fetchList() {
http
.get(
config.API.kpiRoleMainList +
`?page=${formFilter.page}&pageSize=${formFilter.pageSize}&kpiPeriodId=${formFilter.round}&position=${formFilter.position}&keyword=${formFilter.keyword}`
`?page=${formFilter.page}&pageSize=${formFilter.pageSize}&period=${formFilter.round}&position=${formFilter.position}&keyword=${formFilter.keyword}&year=${formFilter.year}`
)
.then((res) => {
const data = res.data.result.data;
@ -172,28 +179,6 @@ function getOptions() {
});
}
function getRound() {
showLoader();
http
.get(
config.API.kpiPeriod +
`?page=${formFilter.page}&pageSize=${formFilter.pageSize}&keyword=${formFilter.keyword}&year=${formFilter.year}`
)
.then((res) => {
const data = res.data.result.data;
roundOp.value = data.map((item: any) => ({
id: item.id,
name: statusTothai(item.durationKPI),
}));
})
.catch((err) => {
messageError($q, err);
})
.finally(() => {
hideLoader();
});
}
function statusTothai(val: string) {
switch (val) {
case "SPECIAL":
@ -211,9 +196,16 @@ function setModel(val: string) {
formFilter.position = val;
}
/**
* เป dialog history
* @param id
*/
function onClickHistory(id: string) {
modalHistory.value = true;
}
onMounted(async () => {
await getOptions();
await getRound();
await fetchList();
});
</script>
@ -281,10 +273,7 @@ onMounted(async () => {
year-picker
:enableTimePicker="false"
@update:model-value="
(formFilter.page = 1),
(formFilter.round = ''),
getRound(),
fetchList()
(formFilter.page = 1), (formFilter.round = ''), fetchList()
"
>
<template #year="{ year }">{{ year + 543 }}</template>
@ -297,7 +286,7 @@ onMounted(async () => {
outlined
class="inputgreen"
:model-value="
formFilter.year === 0
formFilter.year === null
? 'ทั้งหมด'
: Number(formFilter.year) + 543
"
@ -311,15 +300,15 @@ onMounted(async () => {
>
</q-icon>
</template>
<!-- <template v-if="formFilter.year" v-slot:append>
<template v-if="formFilter.year" v-slot:append>
<q-icon
name="cancel"
@click.stop.prevent="
(formFilter.year = 0), (formFilter.page = 1), getRound(),fetchList()
(formFilter.year = null), (formFilter.page = 1), fetchList()
"
class="cursor-pointer"
/>
</template> -->
</template>
</q-input>
</template>
</datepicker>
@ -443,24 +432,68 @@ onMounted(async () => {
{{ col.value ? col.value : "-" }}
</div>
</q-td>
<q-td>
<q-td auto-width>
<q-btn
flat
round
icon="edit"
color="edit"
@click.stop.pervent="onClickAddOrView(true, props.row.id)"
color="grey"
@click.stop
size="14px"
icon="more_vert"
>
<q-tooltip>แกไข </q-tooltip>
</q-btn>
<q-btn
flat
round
icon="delete"
color="red"
@click.stop.pervent="onClickDelete(props.row.id)"
>
<q-tooltip>ลบขอม </q-tooltip>
<q-menu>
<q-list style="min-width: 180px">
<q-item
clickable
v-close-popup
@click.stop.pervent="onClickAddOrView(true, props.row.id)"
>
<q-item-section
style="min-width: 0px"
avatar
class="q-py-sm"
>
<q-tooltip>แกไขขอม</q-tooltip>
<q-icon
color="primary"
size="xs"
name="mdi-pencil-outline"
/>
</q-item-section>
<q-item-section>แกไขขอม</q-item-section>
</q-item>
<q-item
clickable
v-close-popup
@click="onClickHistory(props.row.id)"
>
<q-item-section
style="min-width: 0px"
avatar
class="q-py-sm"
>
<q-tooltip>ประวการแกไข</q-tooltip>
<q-icon color="info" size="xs" name="mdi-history" />
</q-item-section>
<q-item-section>ประวการแกไข</q-item-section>
</q-item>
<q-item
clickable
v-close-popup
@click.stop.pervent="onClickDelete(props.row.id)"
>
<q-item-section
style="min-width: 0px"
avatar
class="q-py-sm"
>
<q-tooltip>ลบขอม</q-tooltip>
<q-icon color="red" size="xs" name="mdi-delete" />
</q-item-section>
<q-item-section>ลบขอม</q-item-section>
</q-item>
</q-list>
</q-menu>
</q-btn>
</q-td>
</q-tr>
@ -468,6 +501,8 @@ onMounted(async () => {
</d-table>
</div>
</q-card>
<DialogHistory v-model:modal="modalHistory" />
</template>
<style scoped></style>

View file

@ -161,4 +161,10 @@ h3.resigtry-tab-title
.q-dialog .q-layout__section--marginal
background-color: #fff
color: #000
color: #000
.q-card.noscrool
overflow: hidden
.q-card__actions
padding: 4px