แก้ไขแบบฟอร์มการลา

This commit is contained in:
Warunee Tamkoo 2024-01-05 15:47:01 +07:00
parent 473757cdd1
commit f0c7cf2c72
6 changed files with 188 additions and 157 deletions

View file

@ -155,7 +155,7 @@ function onValidate() {
* @param formData * @param formData
*/ */
const isLeave = ref<boolean>(true); const isLeave = ref<boolean>(true);
async function FetchCheck() { async function fetchCheck() {
await http await http
.post(config.API.leaveCheck(), { .post(config.API.leaveCheck(), {
type: dataStore.typeId ?? null, type: dataStore.typeId ?? null,
@ -181,16 +181,16 @@ async function FetchCheck() {
* function พเดทค LeaveTotal * function พเดทค LeaveTotal
*/ */
function updateLeaveTotal() { function updateLeaveTotal() {
fetchCheck();
const newLeaveTotal = calculateDurationYmd( const newLeaveTotal = calculateDurationYmd(
formDataStudy.leaveStartDate, formDataStudy.leaveStartDate,
formDataStudy.leaveEndDate formDataStudy.leaveEndDate
); );
formDataStudy.leaveTotal = newLeaveTotal; formDataStudy.leaveTotal = newLeaveTotal;
console.log("test");
} }
/** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */ /** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */
onMounted(() => { onMounted(async () => {
if (props.data) { if (props.data) {
formDataStudy.leaveWrote = props.data.leaveWrote; formDataStudy.leaveWrote = props.data.leaveWrote;
formDataStudy.leaveStartDate = props.data.leaveStartDate; formDataStudy.leaveStartDate = props.data.leaveStartDate;
@ -209,6 +209,12 @@ onMounted(() => {
formDataStudy.studyDaySubject = props.data.studyDaySubject; formDataStudy.studyDaySubject = props.data.studyDaySubject;
// formDataStudy.leaveDocument = props.data.leaveDocument; // formDataStudy.leaveDocument = props.data.leaveDocument;
formDataStudy.leaveDetail = props.data.leaveDetail; formDataStudy.leaveDetail = props.data.leaveDetail;
const leaveTotal = await calculateDurationYmd(
new Date(props.data.leaveStartDate),
new Date(props.data.leaveEndDate)
);
formDataStudy.leaveTotal = leaveTotal;
} }
}); });
</script> </script>
@ -287,7 +293,7 @@ onMounted(() => {
borderless borderless
week-start="0" week-start="0"
:locale="'th'" :locale="'th'"
@update:model-value="updateLeaveTotal, FetchCheck()" @update:model-value="updateLeaveTotal()"
:readonly="!formDataStudy.leaveStartDate" :readonly="!formDataStudy.leaveStartDate"
:enableTimePicker="false" :enableTimePicker="false"
:min-date="formDataStudy.leaveStartDate" :min-date="formDataStudy.leaveStartDate"

View file

@ -153,7 +153,7 @@ function onValidate() {
* @param formData * @param formData
*/ */
const isLeave = ref<boolean>(true); const isLeave = ref<boolean>(true);
async function FetchCheck() { async function fetchCheck() {
await http await http
.post(config.API.leaveCheck(), { .post(config.API.leaveCheck(), {
type: dataStore.typeId ?? null, type: dataStore.typeId ?? null,
@ -165,7 +165,7 @@ async function FetchCheck() {
isLeave.value = data.isLeave; isLeave.value = data.isLeave;
if (data.isLeave === true) { if (data.isLeave === true) {
// formDataTrain.leaveTotal = data.totalDate - data.sumDateWork - data.sumDateHoliday // formDataTrain.leaveTotal = data.totalDate - data.sumDateWork - data.sumDateHoliday
formDataTrain.leaveTotal = data.totalDate formDataTrain.leaveTotal = data.totalDate;
} else { } else {
fails($q, "ไม่สามารถลาได้"); fails($q, "ไม่สามารถลาได้");
} }
@ -179,12 +179,12 @@ async function FetchCheck() {
* function พเดทค LeaveTotal * function พเดทค LeaveTotal
*/ */
function updateLeaveTotal() { function updateLeaveTotal() {
fetchCheck();
const newLeaveTotal = calculateDurationYmd( const newLeaveTotal = calculateDurationYmd(
formDataTrain.leaveStartDate, formDataTrain.leaveStartDate,
formDataTrain.leaveEndDate formDataTrain.leaveEndDate
); );
formDataTrain.leaveTotal = newLeaveTotal; formDataTrain.leaveTotal = newLeaveTotal;
console.log("test");
} }
/** /**
@ -197,7 +197,7 @@ const formattedSalary = computed(() => {
}); });
/** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */ /** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */
onMounted(() => { onMounted(async () => {
if (props.data) { if (props.data) {
formDataTrain.leaveWrote = props.data.leaveWrote; formDataTrain.leaveWrote = props.data.leaveWrote;
formDataTrain.leaveStartDate = props.data.leaveStartDate; formDataTrain.leaveStartDate = props.data.leaveStartDate;
@ -215,6 +215,11 @@ onMounted(() => {
formDataTrain.studyDayTrainingName = props.data.studyDayTrainingName; formDataTrain.studyDayTrainingName = props.data.studyDayTrainingName;
formDataTrain.leaveDetail = props.data.leaveDetail; formDataTrain.leaveDetail = props.data.leaveDetail;
// formDataTrain.leaveDocument = props.data.leaveDocument; // formDataTrain.leaveDocument = props.data.leaveDocument;
const leaveTotal = await calculateDurationYmd(
new Date(props.data.leaveStartDate),
new Date(props.data.leaveEndDate)
);
formDataStudy.leaveTotal = leaveTotal;
} }
}); });
</script> </script>
@ -291,7 +296,7 @@ onMounted(() => {
menu-class-name="modalfix" menu-class-name="modalfix"
autoApply autoApply
borderless borderless
@update:model-value="updateLeaveTotal, FetchCheck()" @update:model-value="updateLeaveTotal()"
week-start="0" week-start="0"
:readonly="!formDataTrain.leaveStartDate" :readonly="!formDataTrain.leaveStartDate"
:locale="'th'" :locale="'th'"
@ -564,7 +569,6 @@ onMounted(() => {
bg-color="white" bg-color="white"
dense dense
outlined outlined
label="เอกสารประกอบ" label="เอกสารประกอบ"
> >
<template v-slot:prepend> <template v-slot:prepend>

View file

@ -13,7 +13,7 @@ import genReport from "@/plugins/genreport";
const dataStore = useLeaveStore(); const dataStore = useLeaveStore();
const $q = useQuasar(); const $q = useQuasar();
const mixin = useCounterMixin(); const mixin = useCounterMixin();
const { date2Thai, dialogConfirm, fails, dateToISO, success, messageError } = const { date2Thai, dialogConfirm, fails, dateToISO, success, messageError, showLoader } =
mixin; mixin;
const edit = ref<boolean>(true); const edit = ref<boolean>(true);
const router = useRouter(); const router = useRouter();
@ -124,7 +124,7 @@ function onValidate() {
//download function //download function
async function onClickDownloadFile(id: string, fileName: string) { async function onClickDownloadFile(id: string, fileName: string) {
// showLoader(); showLoader();
await http await http
.get(config.API.leaveReport(id)) .get(config.API.leaveReport(id))
.then(async (res) => { .then(async (res) => {
@ -167,6 +167,7 @@ async function FetchCheck() {
}); });
} }
const leaveDraftDocument = ref<string>();
/** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */ /** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */
onMounted(() => { onMounted(() => {
if (props.data) { if (props.data) {
@ -177,8 +178,7 @@ onMounted(() => {
formDataWorkInternational.leaveEndDate = new Date(props.data.leaveEndDate); formDataWorkInternational.leaveEndDate = new Date(props.data.leaveEndDate);
formDataWorkInternational.leaveDetail = props.data.leaveDetail; formDataWorkInternational.leaveDetail = props.data.leaveDetail;
// formDataWorkInternational.leaveDocument = props.data.leaveDocument; // formDataWorkInternational.leaveDocument = props.data.leaveDocument;
// formDataWorkInternational.leaveDraftDocument = leaveDraftDocument.value = props.data.leaveDraftDocument;
// props.data.leaveDraftDocument;
} }
}); });
</script> </script>
@ -372,14 +372,7 @@ onMounted(() => {
</div> </div>
</q-card> </q-card>
<div <div v-if="data && data.id" class="q-mt-md">
v-if="
formDataWorkInternational.leaveWrote &&
formDataWorkInternational.leaveEndDate &&
formDataWorkInternational.leaveStartDate
"
class="q-mt-md"
>
<div style="display: flex; align-items: center"> <div style="display: flex; align-items: center">
<q-icon name="mdi-numeric-4-circle" size="20px" color="primary" /> <q-icon name="mdi-numeric-4-circle" size="20px" color="primary" />
<div class="q-pl-sm text-weight-bold text-dark"> <div class="q-pl-sm text-weight-bold text-dark">
@ -388,33 +381,32 @@ onMounted(() => {
</div> </div>
<q-card class="bg-grey-1 q-pa-sm" bordered> <q-card class="bg-grey-1 q-pa-sm" bordered>
<div class="row"> <div class="row">
<div class="col-12 col-sm-4 col-md-4 q-my-sm offset-sm-1 offset-md-2"> <div class="col-sm-3 q-my-sm">
<div class="column q-mx-xs"> <div class="column q-mx-xs">
<div class="q-pl-sm text-weight-bold text-dark text-center"> <!-- <div class="q-pl-sm text-weight-bold text-dark text-center">
ดาวนโหลด ดาวนโหลด
</div> </div> -->
<q-btn <q-btn
color="primary" color="primary"
icon="download" icon="download"
label="ดาวน์โหลดแบบฟอร์ม" label="ดาวน์โหลดแบบฟอร์ม"
@click=" @click="onClickDownloadFile(data.id, `แบบฟอร์ม${data.leaveTypeName}`)"
onClickDownloadFile(data.id, `แบบฟอร์ม${data.leaveTypeName}`)
"
/> />
</div> </div>
</div> </div>
<div class="col-10 col-sm-5 col-md-4 q-my-sm"> <div class="col-sm-5 q-my-sm">
<div class="column q-mx-xs"> <div class="column q-mx-xs">
<div class="q-pl-sm text-weight-bold text-dark text-center"> <!-- <div class="q-pl-sm text-weight-bold text-dark text-center">
ปโหลด ปโหลด
</div> </div> -->
<q-file <q-file
v-model="formDataWorkInternational.leaveDraftDocument" v-model="formDataWorkInternational.leaveDraftDocument"
use-chips
dense dense
label="แบบฟอร์ม" label="อัปโหลดแบบฟอร์ม"
outlined outlined
bg-color="white" bg-color="white"
accept=".pdf" accept="application/pdf"
> >
<template v-slot:prepend> <template v-slot:prepend>
<q-icon name="attach_file" color="primary" /> <q-icon name="attach_file" color="primary" />
@ -422,6 +414,21 @@ onMounted(() => {
</q-file> </q-file>
</div> </div>
</div> </div>
<div v-if="leaveDraftDocument" class="col-sm-2 q-my-sm">
<div class="column q-mx-xs">
<!-- <div class="q-pl-sm text-weight-bold text-dark text-center">
ไฟลปโหลด
</div> -->
<q-btn
icon="visibility"
color="blue"
label="ดาวน์โหลดไฟล์"
:href="leaveDraftDocument"
target="_blank"
/>
</div>
</div>
<!-- <div class="col-md-1 self-end q-mb-sm"> <!-- <div class="col-md-1 self-end q-mb-sm">
<q-btn v-if="formDataWorkInternational.leaveDraftDocument != null" use-chips flat round color="primary" icon="mdi-arrow-up-bold" @click="fileUploadDoc" <q-btn v-if="formDataWorkInternational.leaveDraftDocument != null" use-chips flat round color="primary" icon="mdi-arrow-up-bold" @click="fileUploadDoc"
><q-tooltip>ปโหลด</q-tooltip></q-btn ><q-tooltip>ปโหลด</q-tooltip></q-btn

View file

@ -51,31 +51,21 @@ const formDataFollowSpouse = reactive<any>({
leaveStartDate: null, leaveStartDate: null,
leaveEndDate: null, leaveEndDate: null,
leaveTotal: "", // leaveTotal: "", //
leaveSalaryText: 25000, leaveSalaryText: "",
leaveSalary: 25000, // leaveSalary: 0, //
coupleDayName: "", // coupleDayName: "", //
coupleDayPosition: "", // coupleDayPosition: "", //
coupleDayLevel: "", // coupleDayLevel: "", //
coupleDayLevelCountry: "", // coupleDayLevelCountry: "", //
followHistoryCountry: "ลาว", // coupleDayCountryHistory: "", //
followHistoryTime: "0 วัน", coupleDayTotalHistory: null,
followHistoryStart: new Date(), coupleDayStartDateHistory: null,
followHistoryEnd: new Date(), coupleDayEndDateHistory: null,
leaveDetail: leaveDetail:
"ในกรณีลาติดต่อกับครั้งก่อน รวมทั้งนี้ด้วย เป็นเวลา ...ปี, ...เดือน, ...วัน", // "ในกรณีลาติดต่อกับครั้งก่อน รวมทั้งนี้ด้วย เป็นเวลา ...ปี, ...เดือน, ...วัน", //
leaveDocument: [], // leaveDocument: [], //
}); });
/** แปลงตัวแปร Salary */
const formattleaveSalaryText = arabicNumberToText(
formDataFollowSpouse.leaveSalaryText
);
const formattSalary = computed(() => {
return formDataFollowSpouse.leaveSalary !== null
? formDataFollowSpouse.leaveSalary.toLocaleString("th-TH")
: "";
});
/** ตัวแปร ref สำหรับแสดง validate */ /** ตัวแปร ref สำหรับแสดง validate */
const leaveWroteRef = ref<object | null>(null); const leaveWroteRef = ref<object | null>(null);
const leaveStartDateRef = ref<object | null>(null); const leaveStartDateRef = ref<object | null>(null);
@ -88,10 +78,10 @@ const leaveDetailRef = ref<object | null>(null);
const coupleDayPositionRef = ref<object | null>(null); const coupleDayPositionRef = ref<object | null>(null);
const coupleDayLevelRef = ref<object | null>(null); const coupleDayLevelRef = ref<object | null>(null);
const coupleDayLevelCountryRef = ref<object | null>(null); const coupleDayLevelCountryRef = ref<object | null>(null);
const followHistoryCountryRef = ref<object | null>(null); const coupleDayCountryHistoryRef = ref<object | null>(null);
const followHistoryTimeRef = ref<object | null>(null); const coupleDayTotalHistoryRef = ref<object | null>(null);
const followHistoryStartRef = ref<object | null>(null); const coupleDayStartDateHistoryRef = ref<object | null>(null);
const followHistoryEndRef = ref<object | null>(null); const coupleDayEndDateHistoryRef = ref<object | null>(null);
const leaveDocumentRef = ref<object | null>(null); const leaveDocumentRef = ref<object | null>(null);
/** maping ref เข้าตัวแปรเพื่อเตรียมตรวจสอบ */ /** maping ref เข้าตัวแปรเพื่อเตรียมตรวจสอบ */
@ -105,10 +95,10 @@ const FormRef: FormRef = {
coupleDayPosition: coupleDayPositionRef, // coupleDayPosition: coupleDayPositionRef, //
coupleDayLevel: coupleDayLevelRef, // coupleDayLevel: coupleDayLevelRef, //
coupleDayLevelCountry: coupleDayLevelCountryRef, // coupleDayLevelCountry: coupleDayLevelCountryRef, //
followHistoryCountry: followHistoryCountryRef, // coupleDayCountryHistory: coupleDayCountryHistoryRef, //
followHistoryEnd: followHistoryEndRef, // coupleDayEndDateHistory: coupleDayEndDateHistoryRef, //
followHistoryTime: followHistoryTimeRef, // coupleDayTotalHistory: coupleDayTotalHistoryRef, //
followHistoryStart: followHistoryStartRef, // coupleDayStartDateHistory: coupleDayStartDateHistoryRef, //
leaveDetail: leaveDetailRef, // leaveDetail: leaveDetailRef, //
leaveAddress: leaveAddressRef, // leaveAddress: leaveAddressRef, //
leaveDocument: leaveDocumentRef, leaveDocument: leaveDocumentRef,
@ -155,24 +145,24 @@ function onValidate() {
dateToISO(formDataFollowSpouse.leaveEndDate) dateToISO(formDataFollowSpouse.leaveEndDate)
); // ); //
formData.append( formData.append(
"followHistoryStart", "coupleDayStartDateHistory",
dateToISO(formDataFollowSpouse.followHistoryStart) dateToISO(formDataFollowSpouse.coupleDayStartDateHistory)
); // ); //
formData.append( formData.append(
"followHistoryEnd", "coupleDayEndDateHistory",
dateToISO(formDataFollowSpouse.followHistoryEnd) dateToISO(formDataFollowSpouse.coupleDayEndDateHistory)
); // ); //
formData.append("leaveWrote", formDataFollowSpouse.leaveWrote); // formData.append("leaveWrote", formDataFollowSpouse.leaveWrote); //
formData.append("leaveDetail", formDataFollowSpouse.leaveDetail); // formData.append("leaveDetail", formDataFollowSpouse.leaveDetail); //
formData.append("leaveSalaryText", formDataFollowSpouse.leaveSalaryText); // formData.append("leaveSalaryText", formDataFollowSpouse.leaveSalaryText); //
formData.append("leaveSalary", formDataFollowSpouse.leaveSalary); // formData.append("leaveSalary", formDataFollowSpouse.leaveSalary); //
formData.append( formData.append(
"followHistoryTime", "coupleDayTotalHistory",
formDataFollowSpouse.followHistoryTime formDataFollowSpouse.coupleDayTotalHistory
); // ); //
formData.append( formData.append(
"followHistoryCountry", "coupleDayCountryHistory",
formDataFollowSpouse.followHistoryCountry formDataFollowSpouse.coupleDayCountryHistory
); // ); //
formData.append( formData.append(
"coupleDayLevelCountry", "coupleDayLevelCountry",
@ -194,7 +184,7 @@ function onValidate() {
* @param formData * @param formData
*/ */
const isLeave = ref<boolean>(true); const isLeave = ref<boolean>(true);
async function FetchCheck() { async function fetchCheck() {
await http await http
.post(config.API.leaveCheck(), { .post(config.API.leaveCheck(), {
type: dataStore.typeId ?? null, type: dataStore.typeId ?? null,
@ -205,9 +195,8 @@ async function FetchCheck() {
const data = res.data.result; const data = res.data.result;
isLeave.value = data.isLeave; isLeave.value = data.isLeave;
if (data.isLeave === true) { if (data.isLeave === true) {
formDataFollowSpouse.leaveTotal = // formDataFollowSpouse.leaveTotal = data.totalDate - data.sumDateWork - data.sumDateHoliday;
// data.totalDate - data.sumDateWork - data.sumDateHoliday; // formDataFollowSpouse.leaveTotal = data.totalDate;
formDataFollowSpouse.leaveTotal = data.totalDate;
} else { } else {
fails($q, "ไม่สามารถลาได้"); fails($q, "ไม่สามารถลาได้");
} }
@ -221,6 +210,8 @@ async function FetchCheck() {
* function พเดทค LeaveTotal * function พเดทค LeaveTotal
*/ */
function updateLeaveTotal() { function updateLeaveTotal() {
fetchCheck();
const newLeaveTotal = calculateDurationYmd( const newLeaveTotal = calculateDurationYmd(
formDataFollowSpouse.leaveStartDate, formDataFollowSpouse.leaveStartDate,
formDataFollowSpouse.leaveEndDate formDataFollowSpouse.leaveEndDate
@ -228,8 +219,19 @@ function updateLeaveTotal() {
formDataFollowSpouse.leaveTotal = newLeaveTotal; formDataFollowSpouse.leaveTotal = newLeaveTotal;
} }
/**
* function พเดทค LeaveTotal
*/
function updateLeaveHistoryTotal() {
const newLeaveTotal = calculateDurationYmd(
formDataFollowSpouse.coupleDayStartDateHistory,
formDataFollowSpouse.coupleDayEndDateHistory
);
formDataFollowSpouse.coupleDayTotalHistory = newLeaveTotal;
}
/** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */ /** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */
onMounted(() => { onMounted(async () => {
if (props.data) { if (props.data) {
formDataFollowSpouse.leaveWrote = props.data.leaveWrote; formDataFollowSpouse.leaveWrote = props.data.leaveWrote;
formDataFollowSpouse.leaveStartDate = new Date(props.data.leaveStartDate); formDataFollowSpouse.leaveStartDate = new Date(props.data.leaveStartDate);
@ -244,10 +246,26 @@ onMounted(() => {
formDataFollowSpouse.coupleDayLevel = props.data.coupleDayLevel; formDataFollowSpouse.coupleDayLevel = props.data.coupleDayLevel;
formDataFollowSpouse.coupleDayLevelCountry = formDataFollowSpouse.coupleDayLevelCountry =
props.data.coupleDayLevelCountry; props.data.coupleDayLevelCountry;
formDataFollowSpouse.followHistoryCountry = props.data.followHistoryCountry; formDataFollowSpouse.coupleDayCountryHistory =
formDataFollowSpouse.followHistoryTime = props.data.followHistoryTime; props.data.coupleDayCountryHistory;
formDataFollowSpouse.followHistoryStart = props.data.followHistoryStart; formDataFollowSpouse.coupleDayTotalHistory =
formDataFollowSpouse.followHistoryEnd = props.data.followHistoryEnd; props.data.coupleDayTotalHistory;
formDataFollowSpouse.coupleDayStartDateHistory =
props.data.coupleDayStartDateHistory;
formDataFollowSpouse.coupleDayEndDateHistory =
props.data.coupleDayEndDateHistory;
const leaveTotal = await calculateDurationYmd(
new Date(props.data.leaveStartDate),
new Date(props.data.leaveEndDate)
);
formDataFollowSpouse.leaveTotal = leaveTotal;
const coupleDayTotalHistory = await calculateDurationYmd(
new Date(props.data.coupleDayStartDateHistory),
new Date(props.data.coupleDayEndDateHistory)
);
formDataFollowSpouse.coupleDayTotalHistory = coupleDayTotalHistory;
} }
}); });
</script> </script>
@ -332,7 +350,7 @@ onMounted(() => {
hide-bottom-space hide-bottom-space
:enableTimePicker="false" :enableTimePicker="false"
week-start="0" week-start="0"
@update:model-value="updateLeaveTotal, FetchCheck()" @update:model-value="updateLeaveTotal()"
:readonly="!formDataFollowSpouse.leaveStartDate" :readonly="!formDataFollowSpouse.leaveStartDate"
:min-date="formDataFollowSpouse.leaveStartDate" :min-date="formDataFollowSpouse.leaveStartDate"
> >
@ -392,7 +410,7 @@ onMounted(() => {
for="leaveSalaryRef" for="leaveSalaryRef"
dense dense
outlined outlined
v-model="formattSalary" v-model="dataStore.salary"
label="เงินเดือนปัจจุบัน" label="เงินเดือนปัจจุบัน"
readonly readonly
/> />
@ -406,7 +424,7 @@ onMounted(() => {
for="leaveSalaryRef" for="leaveSalaryRef"
dense dense
outlined outlined
v-model="formattleaveSalaryText" v-model="dataStore.salaryText"
label="เงินเดือนปัจจุบัน" label="เงินเดือนปัจจุบัน"
readonly readonly
/> />
@ -476,16 +494,15 @@ onMounted(() => {
ประวการลาตดตามคสมรสครงสดทาย ประวการลาตดตามคสมรสครงสดทาย
</div> </div>
<datepicker <datepicker
class="col-12 col-md-3 col-sm-12" class="col-12 col-md-3 col-sm-12 inputgreen"
menu-class-name="modalfix" menu-class-name="modalfix"
v-model="formDataFollowSpouse.followHistoryStart" v-model="formDataFollowSpouse.coupleDayStartDateHistory"
:locale="'th'" :locale="'th'"
autoApply autoApply
hide-bottom-space hide-bottom-space
borderless borderless
:enableTimePicker="false" :enableTimePicker="false"
week-start="0" week-start="0"
readonly
> >
<template #year="{ year }"> <template #year="{ year }">
{{ year + 543 }} {{ year + 543 }}
@ -497,15 +514,14 @@ onMounted(() => {
<q-input <q-input
outlined outlined
dense dense
ref="followHistoryStartRef" ref="coupleDayStartDateHistoryRef"
for="followHistoryStartRef" for="coupleDayStartDateHistoryRef"
hide-bottom-space hide-bottom-space
readonly
bg-color="white" bg-color="white"
class="full-width" class="full-width"
:model-value=" :model-value="
formDataFollowSpouse.followHistoryStart != null formDataFollowSpouse.coupleDayStartDateHistory != null
? date2Thai(formDataFollowSpouse.followHistoryStart) ? date2Thai(formDataFollowSpouse.coupleDayStartDateHistory)
: null : null
" "
:label="`${'ตั้งแต่วันที่'}`" :label="`${'ตั้งแต่วันที่'}`"
@ -515,7 +531,7 @@ onMounted(() => {
<q-icon <q-icon
name="event" name="event"
class="cursor-pointer" class="cursor-pointer"
style="color: var(--black)" style="color: var(--q-primary)"
> >
</q-icon> </q-icon>
</template> </template>
@ -523,16 +539,16 @@ onMounted(() => {
</template> </template>
</datepicker> </datepicker>
<datepicker <datepicker
class="col-12 col-md-3 col-sm-12" class="col-12 col-md-3 col-sm-12 inputgreen"
menu-class-name="modalfix" menu-class-name="modalfix"
v-model="formDataFollowSpouse.followHistoryEnd" v-model="formDataFollowSpouse.coupleDayEndDateHistory"
:locale="'th'" :locale="'th'"
autoApply autoApply
hide-bottom-space hide-bottom-space
borderless borderless
:enableTimePicker="false" :enableTimePicker="false"
week-start="0" week-start="0"
readonly @update:model-value="updateLeaveHistoryTotal()"
> >
<template #year="{ year }"> <template #year="{ year }">
{{ year + 543 }} {{ year + 543 }}
@ -544,15 +560,14 @@ onMounted(() => {
<q-input <q-input
outlined outlined
dense dense
ref="followHistoryEndRef" ref="coupleDayEndDateHistoryRef"
for="followHistoryEndRef" for="coupleDayEndDateHistoryRef"
hide-bottom-space hide-bottom-space
bg-color="white" bg-color="white"
readonly
class="full-width" class="full-width"
:model-value=" :model-value="
formDataFollowSpouse.followHistoryEnd != null formDataFollowSpouse.coupleDayEndDateHistory != null
? date2Thai(formDataFollowSpouse.followHistoryEnd) ? date2Thai(formDataFollowSpouse.coupleDayEndDateHistory)
: null : null
" "
:label="`${'ถึงวันที่'}`" :label="`${'ถึงวันที่'}`"
@ -562,37 +577,38 @@ onMounted(() => {
<q-icon <q-icon
name="event" name="event"
class="cursor-pointer" class="cursor-pointer"
style="color: var(--black)" style="color: var(--q-primary)"
> >
</q-icon> </q-icon>
</template> </template>
</q-input> </q-input>
</template> </template>
</datepicker> </datepicker>
<q-input
class="col-12 col-md-3 col-sm-12"
dense
outlined
readonly
hide-bottom-space
bg-color="white"
ref="coupleDayTotalHistoryRef"
for="coupleDayTotalHistoryRef"
v-model="formDataFollowSpouse.coupleDayTotalHistory"
label="เป็นเวลา"
/>
<q-input <q-input
class="col-12 col-md-3 col-sm-12" class="col-12 col-md-3 col-sm-12"
dense dense
outlined outlined
hide-bottom-space hide-bottom-space
bg-color="white" bg-color="white"
ref="followHistoryCountryRef" ref="coupleDayCountryHistoryRef"
for="followHistoryCountryRef" for="coupleDayCountryHistoryRef"
v-model="formDataFollowSpouse.followHistoryCountry" v-model="formDataFollowSpouse.coupleDayCountryHistory"
label="ประเทศ" label="ประเทศ"
:rules="[(val) => !!val || `${'กรุณาเลือกประเทศ'}`]" :rules="[(val) => !!val || `${'กรุณาเลือกประเทศ'}`]"
readonly
/>
<q-input
class="col-12 col-md-3 col-sm-12"
dense
outlined
:readonly="formDataFollowSpouse.followHistoryTime !== ''"
hide-bottom-space
bg-color="white"
ref="followHistoryTimeRef"
for="followHistoryTimeRef"
v-model="formDataFollowSpouse.followHistoryTime"
label="เป็นเวลา"
/> />
<q-input <q-input
@ -619,7 +635,6 @@ onMounted(() => {
label="เอกสารประกอบ" label="เอกสารประกอบ"
outlined outlined
use-chips use-chips
class="q-pl-sm col-12" class="q-pl-sm col-12"
> >
<template v-slot:prepend> <template v-slot:prepend>

View file

@ -13,7 +13,7 @@ import genReport from "@/plugins/genreport";
const dataStore = useLeaveStore(); const dataStore = useLeaveStore();
const $q = useQuasar(); const $q = useQuasar();
const mixin = useCounterMixin(); const mixin = useCounterMixin();
const { date2Thai, dialogConfirm, fails, dateToISO, success, messageError } = const { date2Thai, dialogConfirm, fails, dateToISO, success, messageError, showLoader } =
mixin; mixin;
const router = useRouter(); const router = useRouter();
const edit = ref<boolean>(true); const edit = ref<boolean>(true);
@ -151,7 +151,6 @@ async function onClickDownloadFile(id: string, fileName: string) {
await http await http
.get(config.API.leaveReport(id)) .get(config.API.leaveReport(id))
.then(async (res) => { .then(async (res) => {
console.log(res);
const data = res.data.result; const data = res.data.result;
await genReport(data, fileName); await genReport(data, fileName);
}) })
@ -163,6 +162,7 @@ async function onClickDownloadFile(id: string, fileName: string) {
}); });
} }
const leaveDraftDocument = ref<string>();
/** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */ /** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */
onMounted(() => { onMounted(() => {
if (props.data) { if (props.data) {
@ -171,8 +171,7 @@ onMounted(() => {
formDataRehabilitation.leaveEndDate = new Date(props.data.leaveEndDate); formDataRehabilitation.leaveEndDate = new Date(props.data.leaveEndDate);
formDataRehabilitation.leaveDetail = props.data.leaveDetail; formDataRehabilitation.leaveDetail = props.data.leaveDetail;
// formDataRehabilitation.leaveDocument = props.data.leaveDocument; // formDataRehabilitation.leaveDocument = props.data.leaveDocument;
// formDataRehabilitation.leaveDraftDocument = leaveDraftDocument.value = props.data.leaveDraftDocument;
// props.data.leaveDraftDocument;
} }
}); });
</script> </script>
@ -302,7 +301,7 @@ onMounted(() => {
label="รายละเอียด" label="รายละเอียด"
/> />
<div class="col-12 col-sm-6"> <div class="col-12">
<!-- multiple --> <!-- multiple -->
<q-file <q-file
v-model="formDataRehabilitation.leaveDocument" v-model="formDataRehabilitation.leaveDocument"
@ -311,7 +310,6 @@ onMounted(() => {
bg-color="white" bg-color="white"
dense dense
outlined outlined
label="เอกสารประกอบ" label="เอกสารประกอบ"
> >
<template v-slot:prepend> <template v-slot:prepend>
@ -343,14 +341,7 @@ onMounted(() => {
</div> </div>
</q-card> </q-card>
<div <div v-if="data && data.id" class="q-mt-md">
v-if="
formDataRehabilitation.leaveWrote &&
formDataRehabilitation.leaveStartDate &&
formDataRehabilitation.leaveEndDate
"
class="q-mt-md"
>
<div style="display: flex; align-items: center"> <div style="display: flex; align-items: center">
<q-icon name="mdi-numeric-4-circle" size="20px" color="primary" /> <q-icon name="mdi-numeric-4-circle" size="20px" color="primary" />
<div class="q-pl-sm text-weight-bold text-dark"> <div class="q-pl-sm text-weight-bold text-dark">
@ -359,34 +350,29 @@ onMounted(() => {
</div> </div>
<q-card class="bg-grey-1 q-pa-sm" bordered> <q-card class="bg-grey-1 q-pa-sm" bordered>
<div class="row"> <div class="row">
<div class="col-12 col-sm-4 col-md-4 q-my-sm offset-sm-1 offset-md-2"> <div class="col-sm-3 q-my-sm">
<div class="column q-mx-xs"> <div class="column q-mx-xs">
<div class="q-pl-sm text-weight-bold text-dark text-center"> <!-- <div class="q-pl-sm text-weight-bold text-dark text-center">
ดาวนโหลด ดาวนโหลด
</div> </div> -->
<q-btn <q-btn
color="primary" color="primary"
icon="download" icon="download"
label="ดาวน์โหลดแบบฟอร์ม" label="ดาวน์โหลดแบบฟอร์ม"
@click=" @click="onClickDownloadFile(data.id, `แบบฟอร์ม${data.leaveTypeName}`)"
onClickDownloadFile(
'08dc05c8-4cfd-4603-81f8-92a401571717',
'แบบฟอร์ม'
)
"
/> />
</div> </div>
</div> </div>
<div class="col-10 col-sm-5 col-md-4 q-my-sm"> <div class="col-sm-5 q-my-sm">
<div class="column q-mx-xs"> <div class="column q-mx-xs">
<div class="q-pl-sm text-weight-bold text-dark text-center"> <!-- <div class="q-pl-sm text-weight-bold text-dark text-center">
ปโหลด ปโหลด
</div> </div> -->
<q-file <q-file
v-model="formDataRehabilitation.leaveDraftDocument" v-model="formDataRehabilitation.leaveDraftDocument"
use-chips use-chips
dense dense
label="แบบฟอร์ม" label="อัปโหลดแบบฟอร์ม"
outlined outlined
bg-color="white" bg-color="white"
accept="application/pdf" accept="application/pdf"
@ -397,6 +383,21 @@ onMounted(() => {
</q-file> </q-file>
</div> </div>
</div> </div>
<div v-if="leaveDraftDocument" class="col-sm-2 q-my-sm">
<div class="column q-mx-xs">
<!-- <div class="q-pl-sm text-weight-bold text-dark text-center">
ไฟลปโหลด
</div> -->
<q-btn
icon="visibility"
color="blue"
label="ดาวน์โหลดไฟล์"
:href="leaveDraftDocument"
target="_blank"
/>
</div>
</div>
<!-- <div class="col-md-1 self-end q-mb-sm"> <!-- <div class="col-md-1 self-end q-mb-sm">
<q-btn v-if="formDataRehabilitation.leaveDraftDocument != null" flat round color="primary" icon="mdi-arrow-up-bold" @click="fileUploadDoc" <q-btn v-if="formDataRehabilitation.leaveDraftDocument != null" flat round color="primary" icon="mdi-arrow-up-bold" @click="fileUploadDoc"
><q-tooltip>ปโหลด</q-tooltip></q-btn ><q-tooltip>ปโหลด</q-tooltip></q-btn

View file

@ -47,10 +47,10 @@ const formData = reactive<any>({
leaveTypeName: "", // Name leaveTypeName: "", // Name
leaveTypeId: "", //Id leaveTypeId: "", //Id
fullname: "", // fullname: "", //
dateSendLeave: new Date(), // dateSendLeave: null, //
status: "", // status: "", //
leaveDateStart: new Date(), // leaveDateStart: null, //
leaveDateEnd: new Date(), // leaveDateEnd: null, //
leaveCount: 0, // leaveCount: 0, //
leaveWrote: "", // leaveWrote: "", //
leaveAddress: "", // leaveAddress: "", //
@ -58,29 +58,29 @@ const formData = reactive<any>({
leaveDetail: "", // leaveDetail: "", //
leaveDocument: "", // leaveDocument: "", //
leaveDraftDocument: "", // leaveDraftDocument: "", //
leaveLastStart: new Date(), // ( )(Auto) leaveLastStart: null, // ( )(Auto)
leaveLastEnd: new Date(), // ( )(Auto) leaveLastEnd: null, // ( )(Auto)
leaveTotal: 0, //(Auto) leaveTotal: 0, //(Auto)
leavebirthDate: new Date(), //(Auto) leavebirthDate: null, //(Auto)
leavegovernmentDate: new Date(), //(Auto) leavegovernmentDate: null, //(Auto)
leaveSalary: 0, //(Auto) leaveSalary: 0, //(Auto)
leaveSalaryText: "", //() leaveSalaryText: "", //()
leaveTypeDay: "", // leaveTypeDay: "", //
wifeDayName: "", //() wifeDayName: "", //()
wifeDayDateBorn: new Date(), //() wifeDayDateBorn: null, //()
restDayOldTotal: 0, // ()(Auto) restDayOldTotal: 0, // ()(Auto)
restDayCurrentTotal: 0, //()(Auto) restDayCurrentTotal: 0, //()(Auto)
ordainDayStatus: "", /// () () ordainDayStatus: "", /// () ()
ordainDayLocationName: "", // () ordainDayLocationName: "", // ()
ordainDayLocationAddress: "", // () ordainDayLocationAddress: "", // ()
ordainDayLocationNumber: "", // () ordainDayLocationNumber: "", // ()
ordainDayOrdination: new Date(), // () ordainDayOrdination: null, // ()
ordainDayBuddhistLentName: "", // () ordainDayBuddhistLentName: "", // ()
ordainDayBuddhistLentAddress: "", // () ordainDayBuddhistLentAddress: "", // ()
hajjDayStatus: "", /// () () hajjDayStatus: "", /// () ()
absentDaySummon: "", // () absentDaySummon: "", // ()
absentDayLocation: "", // () absentDayLocation: "", // ()
absentDayRegistorDate: new Date(), // () absentDayRegistorDate: null, // ()
absentDayGetIn: "", // () absentDayGetIn: "", // ()
absentDayAt: "", // () absentDayAt: "", // ()
studyDaySubject: "", // ( ) studyDaySubject: "", // ( )
@ -96,8 +96,8 @@ const formData = reactive<any>({
coupleDayLevelCountry: "", // () coupleDayLevelCountry: "", // ()
coupleDayCountryHistory: "", // () coupleDayCountryHistory: "", // ()
coupleDayTotalHistory: "", // () coupleDayTotalHistory: "", // ()
coupleDayStartDateHistory: new Date(), // () coupleDayStartDateHistory: null, // ()
coupleDayEndDateHistory: new Date(), // () coupleDayEndDateHistory: null, // ()
coupleDaySumTotalHistory: "", // () coupleDaySumTotalHistory: "", // ()
approveStep: "", approveStep: "",
dear: "", dear: "",
@ -183,11 +183,8 @@ async function fetchDataDetail(id: string) {
formData.coupleDayLevelCountry = data.coupleDayLevelCountry ?? "-"; formData.coupleDayLevelCountry = data.coupleDayLevelCountry ?? "-";
formData.coupleDayCountryHistory = data.coupleDayCountryHistory ?? "-"; formData.coupleDayCountryHistory = data.coupleDayCountryHistory ?? "-";
formData.coupleDayTotalHistory = data.coupleDayTotalHistory ?? "-"; formData.coupleDayTotalHistory = data.coupleDayTotalHistory ?? "-";
formData.coupleDayStartDateHistory = formData.coupleDayStartDateHistory = data.coupleDayStartDateHistory;
data.coupleDayStartDateHistory && formData.coupleDayEndDateHistory = data.coupleDayEndDateHistory;
date2Thai(data.coupleDayStartDateHistory);
formData.coupleDayEndDateHistory =
data.coupleDayEndDateHistory && date2Thai(data.coupleDayEndDateHistory);
formData.coupleDaySumTotalHistory = data.coupleDaySumTotalHistory ?? "-"; formData.coupleDaySumTotalHistory = data.coupleDaySumTotalHistory ?? "-";
formData.approveStep = data.approveStep ?? "-"; formData.approveStep = data.approveStep ?? "-";
formData.dear = data.dear ?? "-"; formData.dear = data.dear ?? "-";
@ -254,7 +251,8 @@ function onConfirm(id: string) {
// await http // await http
// .post(config.API.leaveUser() + "/" + id) // .post(config.API.leaveUser() + "/" + id)
// .then(() => { // .then(() => {
// success($q, ""); router.push("/leave");
success($q, "ยื่นใบลาสำเร็จ");
// }) // })
// .catch((e: any) => { // .catch((e: any) => {
// messageError($q, e); // messageError($q, e);