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

เพิ่ม comment ระบบลาออกและขอโอน

Browse source
This commit is contained in:
AnandaTon 2023-11-13 17:05:29 +07:00
parent 6621dfd7f0
commit 3f5687f0aa
15 changed files with 1529 additions and 1889 deletions
Download patch file Download diff file Expand all files Collapse all files

4
src/modules/05_leave/componenst/Calendar.vue
View file

@ -112,7 +112,7 @@ watch(props, async (count, prevCount) => {
})
/**
* ฟังชันน์ยกเลิก model
* ฟังก์ชั่นยกเลิก model
* @param text
*/
const cancel = async (text: string) => {
@ -121,7 +121,7 @@ const cancel = async (text: string) => {
modeCancel.value = true
}
/**
* ฟังชันน์เปิด model
* ฟังก์ชั่นเปิด model
* @param text
*/
const view = async (text: string) => {

829
src/modules/05_leave/componenst/Forms/06_OrdinationForm.vue
View file

@ -1,503 +1,402 @@
<script setup lang="ts">
import { reactive, ref } from "vue";
import { useCounterMixin } from "@/stores/mixin";
import { useQuasar } from "quasar";
import type { FormRef06 } from "@/modules/05_leave/interface/request/AddAbsence";
import { reactive, ref } from "vue"
import { useCounterMixin } from "@/stores/mixin"
import { useQuasar } from "quasar"
import type { FormRef06 } from "@/modules/05_leave/interface/request/AddAbsence"
const $q = useQuasar();
const mixin = useCounterMixin();
const { date2Thai, dialogConfirm } = mixin;
const $q = useQuasar()
const mixin = useCounterMixin()
const { date2Thai, dialogConfirm } = mixin
const edit = ref<boolean>(true);
const files = ref<any>(null);
const edit = ref<boolean>(true)
const files = ref<any>(null)
/** รับ props มาจากหน้าหลัก */
const props = defineProps({
data: {
type: Array,
default: null,
},
onSubmit: {
type: Function,
default: () => "",
},
});
data: {
type: Array,
default: null,
},
onSubmit: {
type: Function,
default: () => "",
},
})
/** ตัวแปร ref สำหรับแสดง validate */
const telRef = ref<object | null>(null);
const writeatRef = ref<object | null>(null);
const birthdayRef = ref<object | null>(null);
const governmentRef = ref<object | null>(null);
const totalLeaveRef = ref<object | null>(null);
const dateLeaveEndRef = ref<object | null>(null);
const dateOrdinationRef = ref<object | null>(null);
const dateLeaveStartRef = ref<object | null>(null);
const addressMeasureRef = ref<object | null>(null);
const addressBuddhistRef = ref<object | null>(null);
const measureLocationNameRef = ref<object | null>(null);
const buddhistLocationNameRef = ref<object | null>(null);
const telRef = ref<object | null>(null)
const writeatRef = ref<object | null>(null)
const birthdayRef = ref<object | null>(null)
const governmentRef = ref<object | null>(null)
const totalLeaveRef = ref<object | null>(null)
const dateLeaveEndRef = ref<object | null>(null)
const dateOrdinationRef = ref<object | null>(null)
const dateLeaveStartRef = ref<object | null>(null)
const addressMeasureRef = ref<object | null>(null)
const addressBuddhistRef = ref<object | null>(null)
const measureLocationNameRef = ref<object | null>(null)
const buddhistLocationNameRef = ref<object | null>(null)
/** ข้อมูล v-model ของฟอร์ม */
const formData = reactive<any>({
writeat: "",
government: new Date(),
birthday: new Date(),
dateLeaveStart: new Date(),
dateLeaveEnd: new Date(),
totalLeave: new Date(),
dateOrdination: new Date(),
measureLocationName: "",
tel: null,
addressMeasure: "",
buddhistLocationName: "",
addressBuddhist: "",
monk: "never",
file: null,
});
writeat: "",
government: new Date(),
birthday: new Date(),
dateLeaveStart: new Date(),
dateLeaveEnd: new Date(),
totalLeave: new Date(),
dateOrdination: new Date(),
measureLocationName: "",
tel: null,
addressMeasure: "",
buddhistLocationName: "",
addressBuddhist: "",
monk: "never",
file: null,
})
/** maping ref เข้าตัวแปรเพื่อเตรียมตรวจสอบ */
const formRef: FormRef06 = {
writeat: writeatRef,
government: governmentRef,
birthday: birthdayRef,
dateLeaveStart: dateLeaveStartRef,
dateLeaveEnd: dateLeaveEndRef,
totalLeave: totalLeaveRef,
dateOrdination: dateOrdinationRef,
measureLocationName: measureLocationNameRef,
tel: telRef,
addressMeasure: addressMeasureRef,
buddhistLocationName: buddhistLocationNameRef,
addressBuddhist: addressBuddhistRef,
};
/** ฟังชั่นตรวจสอบความถูกต้องก่อน บันทึก */
function onValidate() {
const hasError = [];
for (const key in formRef) {
if (Object.prototype.hasOwnProperty.call(formRef, key)) {
const property = formRef[key];
if (property.value && typeof property.value.validate === "function") {
const isValid = property.value.validate();
hasError.push(isValid);
}
}
}
if (hasError.every((result) => result === true)) {
onSubmit();
}
writeat: writeatRef,
government: governmentRef,
birthday: birthdayRef,
dateLeaveStart: dateLeaveStartRef,
dateLeaveEnd: dateLeaveEndRef,
totalLeave: totalLeaveRef,
dateOrdination: dateOrdinationRef,
measureLocationName: measureLocationNameRef,
tel: telRef,
addressMeasure: addressMeasureRef,
buddhistLocationName: buddhistLocationNameRef,
addressBuddhist: addressBuddhistRef,
}
/** ฟังชั่น บันทึก */
/** ฟังก์ชั่นตรวจสอบความถูกต้องก่อน บันทึก */
function onValidate() {
const hasError = []
for (const key in formRef) {
if (Object.prototype.hasOwnProperty.call(formRef, key)) {
const property = formRef[key]
if (property.value && typeof property.value.validate === "function") {
const isValid = property.value.validate()
hasError.push(isValid)
}
}
}
if (hasError.every(result => result === true)) {
onSubmit()
}
}
/** ฟังก์ชั่น บันทึก */
function onSubmit() {
dialogConfirm(
$q,
async () => {
console.log(formData);
props.onSubmit();
},
"ยืนยันการบันทึกข้อมูล",
"ต้องการยืนยันการบันทึกข้อมูลนี้หรือไม่ ?"
);
dialogConfirm(
$q,
async () => {
console.log(formData)
props.onSubmit()
},
"ยืนยันการบันทึกข้อมูล",
"ต้องการยืนยันการบันทึกข้อมูลนี้หรือไม่ ?"
)
}
</script>
<!-- ฟอร์ม ลาอุปสมบท -->
<template>
<q-icon name="mdi-numeric-3-circle" size="20px" color="primary" />
<div class="q-pl-sm text-weight-bold text-dark">กรอกข้อมูล</div>
<form @submit.prevent="onValidate" class="full-width">
<q-card bordered class="q-pa-md bg-grey-1">
<div class="row q-pa-sm q-col-gutter-sm">
<q-input
ref="writeatRef"
class="col-12 col-sm-12"
dense
outlined
bg-color="white"
hide-bottom-space
v-model="formData.writeat"
label="เขียนที่"
:rules="[(val) => !!val || `${'เขียนที่'}`]"
/>
<q-icon name="mdi-numeric-3-circle" size="20px" color="primary" />
<div class="q-pl-sm text-weight-bold text-dark">กรอกข้อมูล</div>
<form @submit.prevent="onValidate" class="full-width">
<q-card bordered class="q-pa-md bg-grey-1">
<div class="row q-pa-sm q-col-gutter-sm">
<q-input
ref="writeatRef"
class="col-12 col-sm-12"
dense
outlined
bg-color="white"
hide-bottom-space
v-model="formData.writeat"
label="เขียนที่"
:rules="[val => !!val || `${'เขียนที่'}`]"
/>
<datepicker
class="col-12 col-md-4 col-sm-6"
menu-class-name="modalfix"
v-model="formData.dateLeaveStart"
:locale="'th'"
autoApply
borderless
:enableTimePicker="false"
week-start="0"
>
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
outlined
bg-color="white"
dense
ref="dateLeaveStartRef"
hide-bottom-space
class="full-width datepicker"
:model-value="
formData.dateLeaveStart != null
? date2Thai(formData.dateLeaveStart)
: null
"
:label="`${'ลาตั้งแต่วันที่'}`"
:rules="[(val) => !!val || `${'กรุณาเลือกลาตั้งแต่วันที่'}`]"
>
<template v-slot:prepend>
<q-icon
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
</q-icon>
</template>
</q-input>
</template>
</datepicker>
<datepicker class="col-12 col-md-4 col-sm-6" menu-class-name="modalfix" v-model="formData.dateLeaveStart" :locale="'th'" autoApply borderless :enableTimePicker="false" week-start="0">
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
outlined
bg-color="white"
dense
ref="dateLeaveStartRef"
hide-bottom-space
class="full-width datepicker"
:model-value="formData.dateLeaveStart != null ? date2Thai(formData.dateLeaveStart) : null"
:label="`${'ลาตั้งแต่วันที่'}`"
:rules="[val => !!val || `${'กรุณาเลือกลาตั้งแต่วันที่'}`]"
>
<template v-slot:prepend>
<q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)"> </q-icon>
</template>
</q-input>
</template>
</datepicker>
<datepicker
class="col-12 col-md-4 col-sm-6"
menu-class-name="modalfix"
v-model="formData.dateLeaveEnd"
:locale="'th'"
autoApply
borderless
:enableTimePicker="false"
week-start="0"
>
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
outlined
dense
ref="dateLeaveEndRef"
bg-color="white"
hide-bottom-space
class="full-width datepicker"
:model-value="
formData.dateLeaveEnd != null
? date2Thai(formData.dateLeaveEnd)
: null
"
:label="`${'ลาถึงวันที่'}`"
:rules="[(val) => !!val || `${'กรุณาเลือกลาถึงวันที่'}`]"
>
<template v-slot:prepend>
<q-icon
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
</q-icon>
</template>
</q-input>
</template>
</datepicker>
<datepicker class="col-12 col-md-4 col-sm-6" menu-class-name="modalfix" v-model="formData.dateLeaveEnd" :locale="'th'" autoApply borderless :enableTimePicker="false" week-start="0">
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
outlined
dense
ref="dateLeaveEndRef"
bg-color="white"
hide-bottom-space
class="full-width datepicker"
:model-value="formData.dateLeaveEnd != null ? date2Thai(formData.dateLeaveEnd) : null"
:label="`${'ลาถึงวันที่'}`"
:rules="[val => !!val || `${'กรุณาเลือกลาถึงวันที่'}`]"
>
<template v-slot:prepend>
<q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)"> </q-icon>
</template>
</q-input>
</template>
</datepicker>
<q-input
class="col-12 col-md-4 col-sm-6"
dense
outlined
bg-color="white"
type="number"
v-model="formData.totalLeave"
label="จำนวนวันที่ลา"
readonly
/>
<q-input class="col-12 col-md-4 col-sm-6" dense outlined bg-color="white" type="number" v-model="formData.totalLeave" label="จำนวนวันที่ลา" readonly />
<div class="full-width">
<div class="q-col-gutter-sm row">
<datepicker
class="col-12 col-md-4 col-sm-6"
menu-class-name="modalfix"
v-model="formData.government"
:locale="'th'"
autoApply
borderless
:enableTimePicker="false"
week-start="0"
readonly
>
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
outlined
ref="governmentRef"
dense
bg-color="white"
hide-bottom-space
readonly
class="full-width datepicker"
:model-value="
formData.government != null
? date2Thai(formData.government)
: null
"
:label="`${'วันที่เข้ารับราชการ'}`"
:rules="[
(val) => !!val || `${'กรุณาเลือกวันที่เข้ารับราชการ'}`,
]"
>
<template v-slot:prepend>
<q-icon
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
</q-icon>
</template>
</q-input>
</template>
</datepicker>
<div class="full-width">
<div class="q-col-gutter-sm row">
<datepicker
class="col-12 col-md-4 col-sm-6"
menu-class-name="modalfix"
v-model="formData.government"
:locale="'th'"
autoApply
borderless
:enableTimePicker="false"
week-start="0"
readonly
>
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
outlined
ref="governmentRef"
dense
bg-color="white"
hide-bottom-space
readonly
class="full-width datepicker"
:model-value="formData.government != null ? date2Thai(formData.government) : null"
:label="`${'วันที่เข้ารับราชการ'}`"
:rules="[val => !!val || `${'กรุณาเลือกวันที่เข้ารับราชการ'}`]"
>
<template v-slot:prepend>
<q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)"> </q-icon>
</template>
</q-input>
</template>
</datepicker>
<datepicker
class="col-12 col-md-4 col-sm-6"
menu-class-name="modalfix"
v-model="formData.birthday"
:locale="'th'"
autoApply
borderless
readonly
:enableTimePicker="false"
week-start="0"
>
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
outlined
ref="birthdayRef"
dense
bg-color="white"
hide-bottom-space
readonly
class="full-width datepicker"
:model-value="
formData.birthday != null
? date2Thai(formData.birthday)
: null
"
:label="`${'วันเดือนปีเกิด'}`"
:rules="[(val) => !!val || `${'กรุณาเลือกลาตั้งแต่วันที่'}`]"
>
<template v-slot:prepend>
<q-icon
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
</q-icon>
</template>
</q-input>
</template>
</datepicker>
</div>
</div>
<datepicker
class="col-12 col-md-4 col-sm-6"
menu-class-name="modalfix"
v-model="formData.birthday"
:locale="'th'"
autoApply
borderless
readonly
:enableTimePicker="false"
week-start="0"
>
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
outlined
ref="birthdayRef"
dense
bg-color="white"
hide-bottom-space
readonly
class="full-width datepicker"
:model-value="formData.birthday != null ? date2Thai(formData.birthday) : null"
:label="`${'วันเดือนปีเกิด'}`"
:rules="[val => !!val || `${'กรุณาเลือกลาตั้งแต่วันที่'}`]"
>
<template v-slot:prepend>
<q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)"> </q-icon>
</template>
</q-input>
</template>
</datepicker>
</div>
</div>
<div class="q-pl-sm text-weight-bold text-dark col-12"> เคยบวชหรือไม่ </div>
<div class="col-12">
<q-radio
v-model="formData.monk"
val="ever"
label="เคยบวช"
checked-icon="task_alt"
/>
<q-radio
v-model="formData.monk"
val="never"
label="ไม่เคยบวช"
checked-icon="task_alt"
/>
</div>
<div class="q-pl-sm text-weight-bold text-dark col-12">เคยบวชหรือไม่</div>
<div class="col-12">
<q-radio v-model="formData.monk" val="ever" label="เคยบวช" checked-icon="task_alt" />
<q-radio v-model="formData.monk" val="never" label="ไม่เคยบวช" checked-icon="task_alt" />
</div>
<div class="q-pl-sm text-weight-bold text-dark col-12">สถานที่บวช</div>
<div class="full-width">
<div class="q-col-gutter-sm row">
<datepicker
class="col-12 col-md-4 col-sm-6"
menu-class-name="modalfix"
v-model="formData.dateOrdination"
:locale="'th'"
autoApply
borderless
:enableTimePicker="false"
week-start="0"
>
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
outlined
ref="dateOrdinationRef"
dense
bg-color="white"
hide-bottom-space
class="full-width datepicker"
:model-value="
formData.dateOrdination != null
? date2Thai(formData.dateOrdination)
: null
"
:label="`${'วันอุปสมบท'}`"
:rules="[(val) => !!val || `${'กรุณาเลือกวันอุปสมบท'}`]"
>
<template v-slot:prepend>
<q-icon
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
</q-icon>
</template>
</q-input>
</template>
</datepicker>
<div class="q-pl-sm text-weight-bold text-dark col-12">สถานที่บวช</div>
<div class="full-width">
<div class="q-col-gutter-sm row">
<datepicker
class="col-12 col-md-4 col-sm-6"
menu-class-name="modalfix"
v-model="formData.dateOrdination"
:locale="'th'"
autoApply
borderless
:enableTimePicker="false"
week-start="0"
>
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
outlined
ref="dateOrdinationRef"
dense
bg-color="white"
hide-bottom-space
class="full-width datepicker"
:model-value="formData.dateOrdination != null ? date2Thai(formData.dateOrdination) : null"
:label="`${'วันอุปสมบท'}`"
:rules="[val => !!val || `${'กรุณาเลือกวันอุปสมบท'}`]"
>
<template v-slot:prepend>
<q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)"> </q-icon>
</template>
</q-input>
</template>
</datepicker>
<q-input
class="col-12 col-sm-6 col-md-4"
dense
hide-bottom-space
ref="measureLocationNameRef"
bg-color="white"
outlined
v-model="formData.measureLocationName"
label="ชื่อวัด"
:rules="[(val) => !!val || `${'กรุณากรอกชื่อวัด'}`]"
/>
<q-input
class="col-12 col-sm-6 col-md-4"
dense
hide-bottom-space
ref="measureLocationNameRef"
bg-color="white"
outlined
v-model="formData.measureLocationName"
label="ชื่อวัด"
:rules="[val => !!val || `${'กรุณากรอกชื่อวัด'}`]"
/>
<q-input
class="col-12 col-sm-6 col-md-4"
ref="telRef"
dense
outlined
v-model="formData.tel"
bg-color="white"
mask="(###)-###-####"
unmasked-value
hide-bottom-space
label="หมายเลขโทรศัพท์"
:rules="[(val) => !!val || `${'กรุณากรอกหมายเลขโทรศัพท์'}`]"
/>
</div>
</div>
<q-input
class="col-12 q-mt-sm"
dense
ref="addressMeasureRef"
bg-color="white"
outlined
v-model="formData.addressMeasure"
label="ที่อยู่"
:rules="[(val) => !!val || `${'กรุณากรอกที่อยู่'}`]"
type="textarea"
/>
<q-input
class="col-12 col-sm-6 col-md-4"
ref="telRef"
dense
outlined
v-model="formData.tel"
bg-color="white"
mask="(###)-###-####"
unmasked-value
hide-bottom-space
label="หมายเลขโทรศัพท์"
:rules="[val => !!val || `${'กรุณากรอกหมายเลขโทรศัพท์'}`]"
/>
</div>
</div>
<div class="q-pl-sm text-weight-bold text-dark col-12"> สถานที่จำพรรษา </div>
<q-input
class="col-12 col-sm-6 col-md-4"
dense
ref="buddhistLocationNameRef"
bg-color="white"
hide-bottom-space
outlined
v-model="formData.buddhistLocationName"
label="ชื่อวัด"
:rules="[(val) => !!val || `${'กรุณากรอกชื่อวัด'}`]"
/>
<q-input
class="col-12 q-mt-sm"
dense
ref="addressMeasureRef"
bg-color="white"
outlined
v-model="formData.addressMeasure"
label="ที่อยู่"
:rules="[val => !!val || `${'กรุณากรอกที่อยู่'}`]"
type="textarea"
/>
<q-input
class="col-12"
dense
ref="addressBuddhistRef"
bg-color="white"
outlined
v-model="formData.addressBuddhist"
label="ที่อยู่"
:rules="[(val) => !!val || `${'กรุณากรอกที่อยู่'}`]"
type="textarea"
hide-bottom-space
/>
<div class="q-pl-sm text-weight-bold text-dark col-12">สถานที่จำพรรษา</div>
<q-input
class="col-12 col-sm-6 col-md-4"
dense
ref="buddhistLocationNameRef"
bg-color="white"
hide-bottom-space
outlined
v-model="formData.buddhistLocationName"
label="ชื่อวัด"
:rules="[val => !!val || `${'กรุณากรอกชื่อวัด'}`]"
/>
<div class="col-12 col-sm-6">
<q-file
ref="fileRef"
v-model="formData.file"
dense
label="เอกสารประกอบ"
outlined
bg-color="white"
multiple
>
<template v-slot:prepend>
<q-icon name="attach_file" color="primary" />
</template>
</q-file>
</div>
<q-input
class="col-12"
dense
ref="addressBuddhistRef"
bg-color="white"
outlined
v-model="formData.addressBuddhist"
label="ที่อยู่"
:rules="[val => !!val || `${'กรุณากรอกที่อยู่'}`]"
type="textarea"
hide-bottom-space
/>
<div class="col-12 row" v-if="!edit">
<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>
<q-card bordered flat class="full-width">
<q-list separator>
<q-item v-for="file in files" :key="file.key" class="q-my-xs">
<q-item-section>
<q-item-label class="full-width ellipsis">
{{ file.fileName }}
</q-item-label>
<div class="col-12 col-sm-6">
<q-file ref="fileRef" v-model="formData.file" dense label="เอกสารประกอบ" outlined bg-color="white" multiple>
<template v-slot:prepend>
<q-icon name="attach_file" color="primary" />
</template>
</q-file>
</div>
<q-item-label caption> </q-item-label>
</q-item-section>
</q-item>
</q-list>
</q-card>
</div>
</div>
</q-card>
<div class="col-12 row" v-if="!edit">
<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>
<q-card bordered flat class="full-width">
<q-list separator>
<q-item v-for="file in files" :key="file.key" class="q-my-xs">
<q-item-section>
<q-item-label class="full-width ellipsis">
{{ file.fileName }}
</q-item-label>
<q-separator class="q-mt-sm" />
<div class="row col-12 q-pt-md">
<q-space />
<q-btn
id="onSubmit"
type="submit"
unelevated
dense
class="q-px-md items-center btnBlue"
label="บันทึก"
/>
</div>
</form>
<q-item-label caption> </q-item-label>
</q-item-section>
</q-item>
</q-list>
</q-card>
</div>
</div>
</q-card>
<q-separator class="q-mt-sm" />
<div class="row col-12 q-pt-md">
<q-space />
<q-btn id="onSubmit" type="submit" unelevated dense class="q-px-md items-center btnBlue" label="บันทึก" />
</div>
</form>
</template>

523
src/modules/05_leave/componenst/Forms/07_HajjForm.vue
View file

@ -1,330 +1,255 @@
<script setup lang="ts">
import { reactive, ref } from "vue";
import { useCounterMixin } from "@/stores/mixin";
import { useQuasar } from "quasar";
import type { FormRef07 } from "@/modules/05_leave/interface/request/AddAbsence";
import { reactive, ref } from "vue"
import { useCounterMixin } from "@/stores/mixin"
import { useQuasar } from "quasar"
import type { FormRef07 } from "@/modules/05_leave/interface/request/AddAbsence"
const $q = useQuasar();
const mixin = useCounterMixin();
const { date2Thai, dialogConfirm } = mixin;
const $q = useQuasar()
const mixin = useCounterMixin()
const { date2Thai, dialogConfirm } = mixin
const edit = ref<boolean>(true);
const files = ref<any>(null);
const edit = ref<boolean>(true)
const files = ref<any>(null)
/** ตัวแปร ref สำหรับแสดง validate */
const writeatRef = ref<object | null>(null);
const governmentRef = ref<object | null>(null);
const dateLeaveStartRef = ref<object | null>(null);
const dateLeaveEndRef = ref<object | null>(null);
const writeatRef = ref<object | null>(null)
const governmentRef = ref<object | null>(null)
const dateLeaveStartRef = ref<object | null>(null)
const dateLeaveEndRef = ref<object | null>(null)
/** รับ props มาจากหน้าหลัก */
const props = defineProps({
data: {
type: Array,
default: null,
},
onSubmit: {
type: Function,
default: () => "",
},
});
data: {
type: Array,
default: null,
},
onSubmit: {
type: Function,
default: () => "",
},
})
/** ข้อมูล v-model ของฟอร์ม */
const formData = reactive<any>({
writeat: "",
government: new Date(),
dateLeaveStart: new Date(),
dateLeaveEnd: new Date(),
totalLeave: new Date(),
monk: "never",
file: null,
});
writeat: "",
government: new Date(),
dateLeaveStart: new Date(),
dateLeaveEnd: new Date(),
totalLeave: new Date(),
monk: "never",
file: null,
})
/** maping ref เข้าตัวแปรเพื่อเตรียมตรวจสอบ */
const formRef: FormRef07 = {
writeat: writeatRef,
government: governmentRef,
dateLeaveStart: dateLeaveStartRef,
dateLeaveEnd: dateLeaveEndRef,
};
/** ฟังชั่นตรวจสอบความถูกต้องก่อน บันทึก */
function onValidate() {
const hasError = [];
for (const key in formRef) {
if (Object.prototype.hasOwnProperty.call(formRef, key)) {
const property = formRef[key];
if (property.value && typeof property.value.validate === "function") {
const isValid = property.value.validate();
hasError.push(isValid);
}
}
}
if (hasError.every((result) => result === true)) {
onSubmit();
}
writeat: writeatRef,
government: governmentRef,
dateLeaveStart: dateLeaveStartRef,
dateLeaveEnd: dateLeaveEndRef,
}
/** ฟังชั่น บันทึก */
/** ฟังก์ชั่นตรวจสอบความถูกต้องก่อน บันทึก */
function onValidate() {
const hasError = []
for (const key in formRef) {
if (Object.prototype.hasOwnProperty.call(formRef, key)) {
const property = formRef[key]
if (property.value && typeof property.value.validate === "function") {
const isValid = property.value.validate()
hasError.push(isValid)
}
}
}
if (hasError.every(result => result === true)) {
onSubmit()
}
}
/** ฟังก์ชั่น บันทึก */
function onSubmit() {
dialogConfirm(
$q,
async () => {
console.log(formData);
props.onSubmit();
},
"ยืนยันการบันทึกข้อมูล",
"ต้องการยืนยันการบันทึกข้อมูลนี้หรือไม่ ?"
);
dialogConfirm(
$q,
async () => {
console.log(formData)
props.onSubmit()
},
"ยืนยันการบันทึกข้อมูล",
"ต้องการยืนยันการบันทึกข้อมูลนี้หรือไม่ ?"
)
}
</script>
<template>
<q-icon name="mdi-numeric-3-circle" size="20px" color="primary" />
<div class="q-pl-sm text-weight-bold text-dark">กรอกข้อมูล</div>
<form @submit.prevent="onValidate" class="full-width">
<q-card bordered class="q-pa-md bg-grey-1">
<div class="row q-pa-sm q-col-gutter-sm">
<q-input
v-model="formData.writeat"
ref="writeatRef"
class="col-12 col-sm-12"
bg-color="white"
dense
outlined
label="เขียนที่"
hide-bottom-space
:rules="[(val) => !!val || `${'เขียนที่'}`]"
/>
<q-icon name="mdi-numeric-3-circle" size="20px" color="primary" />
<div class="q-pl-sm text-weight-bold text-dark">กรอกข้อมูล</div>
<form @submit.prevent="onValidate" class="full-width">
<q-card bordered class="q-pa-md bg-grey-1">
<div class="row q-pa-sm q-col-gutter-sm">
<q-input
v-model="formData.writeat"
ref="writeatRef"
class="col-12 col-sm-12"
bg-color="white"
dense
outlined
label="เขียนที่"
hide-bottom-space
:rules="[val => !!val || `${'เขียนที่'}`]"
/>
<div class="full-width">
<div class="q-col-gutter-sm row">
<datepicker
v-model="formData.dateLeaveStart"
class="col-12 col-md-4 col-sm-6"
menu-class-name="modalfix"
autoApply
borderless
week-start="0"
:enableTimePicker="false"
:locale="'th'"
>
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
ref="dateLeaveStartRef"
bg-color="white"
class="full-width datepicker"
outlined
dense
hide-bottom-space
:label="`${'ลาตั้งแต่วันที่'}`"
:rules="[(val) => !!val || `${'กรุณาเลือกลาตั้งแต่วันที่'}`]"
:model-value="
formData.dateLeaveStart != null
? date2Thai(formData.dateLeaveStart)
: null
"
>
<template v-slot:prepend>
<q-icon
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
</q-icon>
</template>
</q-input>
</template>
</datepicker>
<div class="full-width">
<div class="q-col-gutter-sm row">
<datepicker
v-model="formData.dateLeaveStart"
class="col-12 col-md-4 col-sm-6"
menu-class-name="modalfix"
autoApply
borderless
week-start="0"
:enableTimePicker="false"
:locale="'th'"
>
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
ref="dateLeaveStartRef"
bg-color="white"
class="full-width datepicker"
outlined
dense
hide-bottom-space
:label="`${'ลาตั้งแต่วันที่'}`"
:rules="[val => !!val || `${'กรุณาเลือกลาตั้งแต่วันที่'}`]"
:model-value="formData.dateLeaveStart != null ? date2Thai(formData.dateLeaveStart) : null"
>
<template v-slot:prepend>
<q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)"> </q-icon>
</template>
</q-input>
</template>
</datepicker>
<datepicker
v-model="formData.dateLeaveEnd"
class="col-12 col-md-4 col-sm-6"
menu-class-name="modalfix"
autoApply
borderless
week-start="0"
:enableTimePicker="false"
:locale="'th'"
>
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
ref="dateLeaveEndRef"
class="full-width datepicker"
bg-color="white"
outlined
dense
hide-bottom-space
:label="`${'ลาถึงวันที่'}`"
:model-value="
formData.dateLeaveEnd != null
? date2Thai(formData.dateLeaveEnd)
: null
"
:rules="[(val) => !!val || `${'กรุณาเลือกลาถึงวันที่'}`]"
>
<template v-slot:prepend>
<q-icon
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
</q-icon>
</template>
</q-input>
</template>
</datepicker>
<datepicker
v-model="formData.dateLeaveEnd"
class="col-12 col-md-4 col-sm-6"
menu-class-name="modalfix"
autoApply
borderless
week-start="0"
:enableTimePicker="false"
:locale="'th'"
>
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
ref="dateLeaveEndRef"
class="full-width datepicker"
bg-color="white"
outlined
dense
hide-bottom-space
:label="`${'ลาถึงวันที่'}`"
:model-value="formData.dateLeaveEnd != null ? date2Thai(formData.dateLeaveEnd) : null"
:rules="[val => !!val || `${'กรุณาเลือกลาถึงวันที่'}`]"
>
<template v-slot:prepend>
<q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)"> </q-icon>
</template>
</q-input>
</template>
</datepicker>
<q-input
v-model="formData.totalLeave"
class="col-12 col-md-4 col-sm-6"
bg-color="white"
dense
outlined
readonly
type="number"
label="จำนวนวันที่ลา"
/>
<q-input v-model="formData.totalLeave" class="col-12 col-md-4 col-sm-6" bg-color="white" dense outlined readonly type="number" label="จำนวนวันที่ลา" />
<datepicker
v-model="formData.government"
class="col-12 col-md-4 col-sm-6"
menu-class-name="modalfix"
autoApply
borderless
readonly
week-start="0"
:locale="'th'"
:enableTimePicker="false"
>
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
ref="governmentRef"
bg-color="white"
class="full-width datepicker"
outlined
dense
readonly
hide-bottom-space
:label="`${'วันที่เข้ารับราชการ'}`"
:model-value="
formData.government != null
? date2Thai(formData.government)
: null
"
:rules="[
(val) => !!val || `${'กรุณาเลือกวันที่เข้ารับราชการ'}`,
]"
>
<template v-slot:prepend>
<q-icon
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
</q-icon>
</template>
</q-input>
</template>
</datepicker>
</div>
</div>
<datepicker
v-model="formData.government"
class="col-12 col-md-4 col-sm-6"
menu-class-name="modalfix"
autoApply
borderless
readonly
week-start="0"
:locale="'th'"
:enableTimePicker="false"
>
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
ref="governmentRef"
bg-color="white"
class="full-width datepicker"
outlined
dense
readonly
hide-bottom-space
:label="`${'วันที่เข้ารับราชการ'}`"
:model-value="formData.government != null ? date2Thai(formData.government) : null"
:rules="[val => !!val || `${'กรุณาเลือกวันที่เข้ารับราชการ'}`]"
>
<template v-slot:prepend>
<q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)"> </q-icon>
</template>
</q-input>
</template>
</datepicker>
</div>
</div>
<div class="q-pl-sm text-weight-bold text-dark col-12">
เคยไปประกอบพิธีฮัจย์หรือไม่
</div>
<div class="col-12">
<q-radio
v-model="formData.monk"
val="ever"
checked-icon="task_alt"
label="เคย"
/>
<q-radio
v-model="formData.monk"
val="never"
checked-icon="task_alt"
label="ไม่เคยไปประกอบพิธีฮัจย์"
/>
</div>
<div class="q-pl-sm text-weight-bold text-dark col-12">เคยไปประกอบพิธีฮัจย์หรือไม่</div>
<div class="col-12">
<q-radio v-model="formData.monk" val="ever" checked-icon="task_alt" label="เคย" />
<q-radio v-model="formData.monk" val="never" checked-icon="task_alt" label="ไม่เคยไปประกอบพิธีฮัจย์" />
</div>
<q-input
v-model="formData.info"
class="col-12 q-mt-sm"
bg-color="white"
dense
outlined
type="textarea"
label="รายละเอียด"
/>
<q-input v-model="formData.info" class="col-12 q-mt-sm" bg-color="white" dense outlined type="textarea" label="รายละเอียด" />
<div class="col-12 col-sm-6">
<q-file
v-model="formData.file"
bg-color="white"
label="เอกสารประกอบ"
dense
outlined
multiple
hide-bottom-space
>
<template v-slot:prepend>
<q-icon name="attach_file" color="primary" />
</template>
</q-file>
</div>
<div class="col-12 col-sm-6">
<q-file v-model="formData.file" bg-color="white" label="เอกสารประกอบ" dense outlined multiple hide-bottom-space>
<template v-slot:prepend>
<q-icon name="attach_file" color="primary" />
</template>
</q-file>
</div>
<div class="col-12 row" v-if="!edit">
<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>
<q-card bordered flat class="full-width">
<q-list separator>
<q-item v-for="file in files" :key="file.key" class="q-my-xs">
<q-item-section>
<q-item-label class="full-width ellipsis">
{{ file.fileName }}
</q-item-label>
<div class="col-12 row" v-if="!edit">
<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>
<q-card bordered flat class="full-width">
<q-list separator>
<q-item v-for="file in files" :key="file.key" class="q-my-xs">
<q-item-section>
<q-item-label class="full-width ellipsis">
{{ file.fileName }}
</q-item-label>
<q-item-label caption> </q-item-label>
</q-item-section>
</q-item>
</q-list>
</q-card>
</div>
</div>
</q-card>
<q-separator class="q-mt-sm" />
<div class="row col-12 q-pt-md">
<q-space />
<q-btn
id="onSubmit"
type="submit"
unelevated
dense
class="q-px-md items-center btnBlue"
label="บันทึก"
/>
</div>
</form>
<q-item-label caption> </q-item-label>
</q-item-section>
</q-item>
</q-list>
</q-card>
</div>
</div>
</q-card>
<q-separator class="q-mt-sm" />
<div class="row col-12 q-pt-md">
<q-space />
<q-btn id="onSubmit" type="submit" unelevated dense class="q-px-md items-center btnBlue" label="บันทึก" />
</div>
</form>
</template>

586
src/modules/05_leave/componenst/Forms/08_MilitaryForm.vue
View file

@ -1,370 +1,284 @@
<script setup lang="ts">
import { reactive, ref } from "vue";
import { useCounterMixin } from "@/stores/mixin";
import { useQuasar } from "quasar";
import type { FormRef08 } from "@/modules/05_leave/interface/request/AddAbsence";
import { reactive, ref } from "vue"
import { useCounterMixin } from "@/stores/mixin"
import { useQuasar } from "quasar"
import type { FormRef08 } from "@/modules/05_leave/interface/request/AddAbsence"
const $q = useQuasar();
const mixin = useCounterMixin();
const { date2Thai, dialogConfirm } = mixin;
const $q = useQuasar()
const mixin = useCounterMixin()
const { date2Thai, dialogConfirm } = mixin
const edit = ref<boolean>(true);
const files = ref<any>(null);
const edit = ref<boolean>(true)
const files = ref<any>(null)
/** ตัวแปร ref สำหรับแสดง validate */
const dateLeaveStartRef = ref<object | null>(null);
const dateLeaveEndRef = ref<object | null>(null);
const writeatRef = ref<object | null>(null);
const receivedRef = ref<object | null>(null);
const atRef = ref<object | null>(null);
const dateAtRef = ref<object | null>(null);
const admittedRef = ref<object | null>(null);
const atPlaceRef = ref<object | null>(null);
const dateLeaveStartRef = ref<object | null>(null)
const dateLeaveEndRef = ref<object | null>(null)
const writeatRef = ref<object | null>(null)
const receivedRef = ref<object | null>(null)
const atRef = ref<object | null>(null)
const dateAtRef = ref<object | null>(null)
const admittedRef = ref<object | null>(null)
const atPlaceRef = ref<object | null>(null)
/** รับ props มาจากหน้าหลัก */
const props = defineProps({
data: {
type: Array,
default: null,
},
onSubmit: {
type: Function,
default: () => "",
},
});
data: {
type: Array,
default: null,
},
onSubmit: {
type: Function,
default: () => "",
},
})
/** ข้อมูล v-model ของฟอร์ม */
const formData = reactive<any>({
dateLeaveStart: null,
dateLeaveEnd: null,
totalLeave: 1,
file: null,
writeat: "",
received: "",
at: "",
dateAt: "",
admitted: "",
atPlace: "",
info:''
});
dateLeaveStart: null,
dateLeaveEnd: null,
totalLeave: 1,
file: null,
writeat: "",
received: "",
at: "",
dateAt: "",
admitted: "",
atPlace: "",
info: "",
})
/** maping ref เข้าตัวแปรเพื่อเตรียมตรวจสอบ */
const formRef: FormRef08 = {
dateLeaveStart: dateLeaveStartRef,
dateLeaveEnd: dateLeaveEndRef,
writeat: writeatRef,
received: receivedRef,
at: atRef,
dateAt: dateAtRef,
admitted: admittedRef,
atPlace: atPlaceRef,
};
/** ฟังชั่นตรวจสอบความถูกต้องก่อน บันทึก */
function onValidate() {
const hasError = [];
for (const key in formRef) {
if (Object.prototype.hasOwnProperty.call(formRef, key)) {
const property = formRef[key];
if (property.value && typeof property.value.validate === "function") {
const isValid = property.value.validate();
hasError.push(isValid);
}
}
}
if (hasError.every((result) => result === true)) {
onSubmit();
}
dateLeaveStart: dateLeaveStartRef,
dateLeaveEnd: dateLeaveEndRef,
writeat: writeatRef,
received: receivedRef,
at: atRef,
dateAt: dateAtRef,
admitted: admittedRef,
atPlace: atPlaceRef,
}
/** ฟังชั่น บันทึก */
/** ฟังก์ชั่นตรวจสอบความถูกต้องก่อน บันทึก */
function onValidate() {
const hasError = []
for (const key in formRef) {
if (Object.prototype.hasOwnProperty.call(formRef, key)) {
const property = formRef[key]
if (property.value && typeof property.value.validate === "function") {
const isValid = property.value.validate()
hasError.push(isValid)
}
}
}
if (hasError.every(result => result === true)) {
onSubmit()
}
}
/** ฟังก์ชั่น บันทึก */
function onSubmit() {
dialogConfirm(
$q,
async () => {
console.log(formData);
props.onSubmit();
},
"ยืนยันการบันทึกข้อมูล",
"ต้องการยืนยันการบันทึกข้อมูลนี้หรือไม่ ?"
);
dialogConfirm(
$q,
async () => {
console.log(formData)
props.onSubmit()
},
"ยืนยันการบันทึกข้อมูล",
"ต้องการยืนยันการบันทึกข้อมูลนี้หรือไม่ ?"
)
}
</script>
<template>
<q-icon name="mdi-numeric-3-circle" size="20px" color="primary" />
<div class="q-pl-sm text-weight-bold text-dark">กรอกข้อมูล</div>
<form @submit.prevent="onValidate">
<q-card bordered class="q-pa-md bg-grey-1">
<div class="row q-pa-sm q-col-gutter-sm">
<q-input
ref="writeatRef"
class="col-12 col-sm-12"
dense
outlined
bg-color="white"
hide-bottom-space
v-model="formData.writeat"
label="เขียนที่"
:rules="[(val) => !!val || `${'เขียนที่'}`]"
/>
<q-icon name="mdi-numeric-3-circle" size="20px" color="primary" />
<div class="q-pl-sm text-weight-bold text-dark">กรอกข้อมูล</div>
<form @submit.prevent="onValidate">
<q-card bordered class="q-pa-md bg-grey-1">
<div class="row q-pa-sm q-col-gutter-sm">
<q-input
ref="writeatRef"
class="col-12 col-sm-12"
dense
outlined
bg-color="white"
hide-bottom-space
v-model="formData.writeat"
label="เขียนที่"
:rules="[val => !!val || `${'เขียนที่'}`]"
/>
<datepicker
class="col-12 col-md-4 col-sm-6"
menu-class-name="modalfix"
v-model="formData.dateLeaveStart"
:locale="'th'"
autoApply
borderless
:enableTimePicker="false"
week-start="0"
>
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
outlined
bg-color="white"
dense
ref="dateLeaveStartRef"
hide-bottom-space
class="full-width datepicker"
:model-value="
formData.dateLeaveStart != null
? date2Thai(formData.dateLeaveStart)
: null
"
:label="`${'ลาตั้งแต่วันที่'}`"
:rules="[(val) => !!val || `${'กรุณาเลือกลาตั้งแต่วันที่'}`]"
>
<template v-slot:prepend>
<q-icon
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
</q-icon>
</template>
</q-input>
</template>
</datepicker>
<datepicker class="col-12 col-md-4 col-sm-6" menu-class-name="modalfix" v-model="formData.dateLeaveStart" :locale="'th'" autoApply borderless :enableTimePicker="false" week-start="0">
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
outlined
bg-color="white"
dense
ref="dateLeaveStartRef"
hide-bottom-space
class="full-width datepicker"
:model-value="formData.dateLeaveStart != null ? date2Thai(formData.dateLeaveStart) : null"
:label="`${'ลาตั้งแต่วันที่'}`"
:rules="[val => !!val || `${'กรุณาเลือกลาตั้งแต่วันที่'}`]"
>
<template v-slot:prepend>
<q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)"> </q-icon>
</template>
</q-input>
</template>
</datepicker>
<datepicker
class="col-12 col-md-4 col-sm-6"
menu-class-name="modalfix"
v-model="formData.dateLeaveEnd"
:locale="'th'"
autoApply
borderless
:enableTimePicker="false"
week-start="0"
>
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
outlined
dense
ref="dateLeaveEndRef"
bg-color="white"
hide-bottom-space
class="full-width datepicker"
:model-value="
formData.dateLeaveEnd != null
? date2Thai(formData.dateLeaveEnd)
: null
"
:label="`${'ลาถึงวันที่'}`"
:rules="[(val) => !!val || `${'กรุณาเลือกลาถึงวันที่'}`]"
>
<template v-slot:prepend>
<q-icon
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
</q-icon>
</template>
</q-input>
</template>
</datepicker>
<datepicker class="col-12 col-md-4 col-sm-6" menu-class-name="modalfix" v-model="formData.dateLeaveEnd" :locale="'th'" autoApply borderless :enableTimePicker="false" week-start="0">
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
outlined
dense
ref="dateLeaveEndRef"
bg-color="white"
hide-bottom-space
class="full-width datepicker"
:model-value="formData.dateLeaveEnd != null ? date2Thai(formData.dateLeaveEnd) : null"
:label="`${'ลาถึงวันที่'}`"
:rules="[val => !!val || `${'กรุณาเลือกลาถึงวันที่'}`]"
>
<template v-slot:prepend>
<q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)"> </q-icon>
</template>
</q-input>
</template>
</datepicker>
<q-input
class="col-12 col-md-4 col-sm-6"
dense
outlined
bg-color="white"
type="number"
v-model="formData.totalLeave"
label="จำนวนวันที่ลา"
readonly
/>
<q-input class="col-12 col-md-4 col-sm-6" dense outlined bg-color="white" type="number" v-model="formData.totalLeave" label="จำนวนวันที่ลา" readonly />
<div class="full-width">
<div class="q-col-gutter-sm row">
<q-input
ref="receivedRef"
class="col-12 col-sm-6 col-md-4"
dense
bg-color="white"
outlined
v-model="formData.received"
label="ได้รับหมายเรียกของ"
hide-bottom-space
:rules="[(val) => !!val || `${'กรุณากรอกได้รับหมายเรียกของ'}`]"
/>
<div class="full-width">
<div class="q-col-gutter-sm row">
<q-input
ref="receivedRef"
class="col-12 col-sm-6 col-md-4"
dense
bg-color="white"
outlined
v-model="formData.received"
label="ได้รับหมายเรียกของ"
hide-bottom-space
:rules="[val => !!val || `${'กรุณากรอกได้รับหมายเรียกของ'}`]"
/>
<q-input
ref="atRef"
class="col-12 col-sm-6 col-md-4"
dense
bg-color="white"
outlined
v-model="formData.at"
label="ที่"
hide-bottom-space
:rules="[(val) => !!val || `${'กรุณากรอกที่'}`]"
/>
</div>
</div>
<q-input
ref="atRef"
class="col-12 col-sm-6 col-md-4"
dense
bg-color="white"
outlined
v-model="formData.at"
label="ที่"
hide-bottom-space
:rules="[val => !!val || `${'กรุณากรอกที่'}`]"
/>
</div>
</div>
<div class="full-width">
<div class="q-col-gutter-sm row">
<datepicker
class="col-12 col-md-4 col-sm-6"
menu-class-name="modalfix"
v-model="formData.dateAt"
:locale="'th'"
autoApply
borderless
:enableTimePicker="false"
week-start="0"
>
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
outlined
dense
ref="dateAtRef"
bg-color="white"
hide-bottom-space
class="full-width datepicker"
:model-value="
formData.dateAt != null ? date2Thai(formData.dateAt) : null
"
:label="`${'ลงวันที่'}`"
:rules="[(val) => !!val || `${'กรุณาเลือกลงวันที่'}`]"
>
<template v-slot:prepend>
<q-icon
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
</q-icon>
</template>
</q-input>
</template>
</datepicker>
<div class="full-width">
<div class="q-col-gutter-sm row">
<datepicker class="col-12 col-md-4 col-sm-6" menu-class-name="modalfix" v-model="formData.dateAt" :locale="'th'" autoApply borderless :enableTimePicker="false" week-start="0">
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
outlined
dense
ref="dateAtRef"
bg-color="white"
hide-bottom-space
class="full-width datepicker"
:model-value="formData.dateAt != null ? date2Thai(formData.dateAt) : null"
:label="`${'ลงวันที่'}`"
:rules="[val => !!val || `${'กรุณาเลือกลงวันที่'}`]"
>
<template v-slot:prepend>
<q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)"> </q-icon>
</template>
</q-input>
</template>
</datepicker>
<q-input
class="col-12 col-sm-6 col-md-4"
dense
bg-color="white"
ref="admittedRef"
outlined
v-model="formData.admitted"
label="ให้เข้ารับการ"
hide-bottom-space
:rules="[(val) => !!val || `${'กรุณากรอกให้เข้ารับการ'}`]"
/>
<q-input
class="col-12 col-sm-6 col-md-4"
dense
bg-color="white"
ref="admittedRef"
outlined
v-model="formData.admitted"
label="ให้เข้ารับการ"
hide-bottom-space
:rules="[val => !!val || `${'กรุณากรอกให้เข้ารับการ'}`]"
/>
<q-input
class="col-12 col-sm-6 col-md-4"
dense
bg-color="white"
outlined
ref="atPlaceRef"
v-model="formData.atPlace"
label="ณ ที่"
hide-bottom-space
:rules="[(val) => !!val || `${'กรุณากรอก ณ ที่'}`]"
/>
</div>
</div>
<q-input
class="col-12 col-sm-6 col-md-4"
dense
bg-color="white"
outlined
ref="atPlaceRef"
v-model="formData.atPlace"
label="ณ ที่"
hide-bottom-space
:rules="[val => !!val || `${'กรุณากรอก ณ ที่'}`]"
/>
</div>
</div>
<q-input
class="col-12 q-mt-sm"
dense
bg-color="white"
outlined
v-model="formData.info"
type="textarea"
label="รายละเอียด"
/>
<q-input class="col-12 q-mt-sm" dense bg-color="white" outlined v-model="formData.info" type="textarea" label="รายละเอียด" />
<div class="col-12 col-sm-6">
<q-file
v-model="formData.file"
dense
label="เอกสารประกอบ"
outlined
bg-color="white"
multiple
hide-bottom-space
>
<template v-slot:prepend>
<q-icon name="attach_file" color="primary" />
</template>
</q-file>
</div>
<div class="col-12 col-sm-6">
<q-file v-model="formData.file" dense label="เอกสารประกอบ" outlined bg-color="white" multiple hide-bottom-space>
<template v-slot:prepend>
<q-icon name="attach_file" color="primary" />
</template>
</q-file>
</div>
<div class="col-12 row" v-if="!edit">
<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>
<q-card bordered flat class="full-width">
<q-list separator>
<q-item v-for="file in files" :key="file.key" class="q-my-xs">
<q-item-section>
<q-item-label class="full-width ellipsis">
{{ file.fileName }}
</q-item-label>
<div class="col-12 row" v-if="!edit">
<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>
<q-card bordered flat class="full-width">
<q-list separator>
<q-item v-for="file in files" :key="file.key" class="q-my-xs">
<q-item-section>
<q-item-label class="full-width ellipsis">
{{ file.fileName }}
</q-item-label>
<q-item-label caption> </q-item-label>
</q-item-section>
</q-item>
</q-list>
</q-card>
</div>
</div>
</q-card>
<q-separator class="q-mt-sm" />
<div class="row col-12 q-pt-md">
<q-space />
<q-btn
id="onSubmit"
type="submit"
unelevated
dense
class="q-px-md items-center btnBlue"
label="บันทึก"
/>
</div>
</form>
<q-item-label caption> </q-item-label>
</q-item-section>
</q-item>
</q-list>
</q-card>
</div>
</div>
</q-card>
<q-separator class="q-mt-sm" />
<div class="row col-12 q-pt-md">
<q-space />
<q-btn id="onSubmit" type="submit" unelevated dense class="q-px-md items-center btnBlue" label="บันทึก" />
</div>
</form>
</template>

4
src/modules/05_leave/componenst/Forms/09_StudyForm.vue
View file

@ -75,7 +75,7 @@ const formRef: FormRef09 = {
writeat: writeatRef,
}
/** ฟังชั่นตรวจสอบความถูกต้องก่อน บันทึก */
/** ฟังก์ชั่นตรวจสอบความถูกต้องก่อน บันทึก */
function onValidate() {
const hasError = []
for (const key in formRef) {
@ -92,7 +92,7 @@ function onValidate() {
}
}
/** ฟังชั่น บันทึก */
/** ฟังก์ชั่น บันทึก */
function onSubmit() {
dialogConfirm(
$q,

4
src/modules/05_leave/componenst/Forms/10_TrainForm.vue
View file

@ -69,7 +69,7 @@ const formRef: FormRef10 = {
writeat: writeatRef,
}
/** ฟังชั่นตรวจสอบความถูกต้องก่อน บันทึก */
/** ฟังก์ชั่นตรวจสอบความถูกต้องก่อน บันทึก */
function onValidate() {
const hasError = []
@ -87,7 +87,7 @@ function onValidate() {
}
}
/** ฟังชั่น บันทึก */
/** ฟังก์ชั่น บันทึก */
function onSubmit() {
dialogConfirm(
$q,

2
src/modules/05_leave/componenst/Forms/11_WorkInternationalForm.vue
View file

@ -83,7 +83,7 @@ function onValidate() {
}
}
/** ฟังชั่น บันทึก */
/** ฟังก์ชั่น บันทึก */
function onSubmit() {
dialogConfirm(
$q,

487
src/modules/05_leave/componenst/Forms/13_RehabilitationForm.vue
View file

@ -1,322 +1,239 @@
<script setup lang="ts">
import { reactive, ref, computed } from "vue";
import { useCounterMixin } from "@/stores/mixin";
import { useQuasar } from "quasar";
import type { FormRef13 } from "@/modules/05_leave/interface/request/AddAbsence";
import { reactive, ref, computed } from "vue"
import { useCounterMixin } from "@/stores/mixin"
import { useQuasar } from "quasar"
import type { FormRef13 } from "@/modules/05_leave/interface/request/AddAbsence"
const $q = useQuasar();
const mixin = useCounterMixin();
const { date2Thai, dialogConfirm } = mixin;
const $q = useQuasar()
const mixin = useCounterMixin()
const { date2Thai, dialogConfirm } = mixin
const edit = ref<boolean>(true);
const isSave = ref<boolean>(false);
const files = ref<any>(null);
const filesUpload = ref<any>(null);
const edit = ref<boolean>(true)
const isSave = ref<boolean>(false)
const files = ref<any>(null)
const filesUpload = ref<any>(null)
/** ตัวแปร ref สำหรับแสดง validate */
const dateLeaveStartRef = ref<object | null>(null);
const dateLeaveEndRef = ref<object | null>(null);
const writeatRef = ref<object | null>(null);
const dateLeaveStartRef = ref<object | null>(null)
const dateLeaveEndRef = ref<object | null>(null)
const writeatRef = ref<object | null>(null)
/** รับ props มาจากหน้าหลัก */
const props = defineProps({
data: {
type: Array,
default: null,
},
onSubmit: {
type: Function,
default: () => "",
},
});
data: {
type: Array,
default: null,
},
onSubmit: {
type: Function,
default: () => "",
},
})
/** ข้อมูล v-model ของฟอร์ม */
const formData = reactive<any>({
writeat: "",
dateLeaveStart: null,
dateLeaveEnd: null,
file: "",
info: "",
});
writeat: "",
dateLeaveStart: null,
dateLeaveEnd: null,
file: "",
info: "",
})
/** maping ref เข้าตัวแปรเพื่อเตรียมตรวจสอบ */
const formRef: FormRef13 = {
dateLeaveStart: dateLeaveStartRef,
dateLeaveEnd: dateLeaveEndRef,
writeat: writeatRef,
};
dateLeaveStart: dateLeaveStartRef,
dateLeaveEnd: dateLeaveEndRef,
writeat: writeatRef,
}
/** ฟังชั่นตรวจสอบความถูกต้องก่อน บันทึก */
/** ฟังก์ชั่นตรวจสอบความถูกต้องก่อน บันทึก */
function onValidate() {
const hasError = [];
for (const key in formRef) {
if (Object.prototype.hasOwnProperty.call(formRef, key)) {
const property = formRef[key];
if (property.value && typeof property.value.validate === "function") {
const isValid = property.value.validate();
hasError.push(isValid);
}
}
}
if (hasError.every((result) => result === true)) {
onSubmit();
}
const hasError = []
for (const key in formRef) {
if (Object.prototype.hasOwnProperty.call(formRef, key)) {
const property = formRef[key]
if (property.value && typeof property.value.validate === "function") {
const isValid = property.value.validate()
hasError.push(isValid)
}
}
}
if (hasError.every(result => result === true)) {
onSubmit()
}
}
/** ฟังชั่น บันทึก */
/** ฟังก์ชั่น บันทึก */
function onSubmit() {
dialogConfirm(
$q,
async () => {
props.onSubmit();
console.log(formData);
isSave.value = true;
},
"ยืนยันการบันทึกข้อมูล",
"ต้องการยืนยันการบันทึกข้อมูลนี้หรือไม่ ?"
);
dialogConfirm(
$q,
async () => {
props.onSubmit()
console.log(formData)
isSave.value = true
},
"ยืนยันการบันทึกข้อมูล",
"ต้องการยืนยันการบันทึกข้อมูลนี้หรือไม่ ?"
)
}
/** ฟังชั่น อัปโหลด
/** ฟังก์ชั่น อัปโหลด
* consolelog ไว้ก่อน
*/
function upLoadFile() {
console.log("upload", filesUpload.value);
console.log("upload", filesUpload.value)
}
</script>
<template>
<q-icon name="mdi-numeric-3-circle" size="20px" color="primary" />
<div class="q-pl-sm text-weight-bold text-dark">กรอกข้อมูล</div>
<form @submit.prevent="onValidate">
<q-card bordered class="q-pa-md bg-grey-1">
<div class="row q-pa-sm q-col-gutter-sm">
<q-input
v-model="formData.writeat"
class="col-12 col-sm-12"
ref="writeatRef"
dense
outlined
bg-color="white"
label="เขียนที่"
hide-bottom-space
:rules="[(val) => !!val || `${'เขียนที่'}`]"
/>
<q-icon name="mdi-numeric-3-circle" size="20px" color="primary" />
<div class="q-pl-sm text-weight-bold text-dark">กรอกข้อมูล</div>
<form @submit.prevent="onValidate">
<q-card bordered class="q-pa-md bg-grey-1">
<div class="row q-pa-sm q-col-gutter-sm">
<q-input
v-model="formData.writeat"
class="col-12 col-sm-12"
ref="writeatRef"
dense
outlined
bg-color="white"
label="เขียนที่"
hide-bottom-space
:rules="[val => !!val || `${'เขียนที่'}`]"
/>
<datepicker
v-model="formData.dateLeaveStart"
class="col-12 col-md-4 col-sm-6"
menu-class-name="modalfix"
autoApply
borderless
week-start="0"
:enableTimePicker="false"
:locale="'th'"
>
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
ref="dateLeaveStartRef"
class="full-width datepicker"
bg-color="white"
outlined
dense
lazy-rules
hide-bottom-space
:model-value="
formData.dateLeaveStart != null
? date2Thai(formData.dateLeaveStart)
: null
"
:label="`${'ลาตั้งแต่วันที่'}`"
:rules="[(val) => !!val || `${'กรุณาเลือกลาตั้งแต่วันที่'}`]"
>
<template v-slot:prepend>
<q-icon
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
</q-icon>
</template>
</q-input>
</template>
</datepicker>
<datepicker v-model="formData.dateLeaveStart" class="col-12 col-md-4 col-sm-6" menu-class-name="modalfix" autoApply borderless week-start="0" :enableTimePicker="false" :locale="'th'">
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
ref="dateLeaveStartRef"
class="full-width datepicker"
bg-color="white"
outlined
dense
lazy-rules
hide-bottom-space
:model-value="formData.dateLeaveStart != null ? date2Thai(formData.dateLeaveStart) : null"
:label="`${'ลาตั้งแต่วันที่'}`"
:rules="[val => !!val || `${'กรุณาเลือกลาตั้งแต่วันที่'}`]"
>
<template v-slot:prepend>
<q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)"> </q-icon>
</template>
</q-input>
</template>
</datepicker>
<datepicker
v-model="formData.dateLeaveEnd"
class="col-12 col-md-4 col-sm-6"
menu-class-name="modalfix"
autoApply
borderless
week-start="0"
:locale="'th'"
:readonly="!formData.dateLeaveStart"
:enableTimePicker="false"
:min-date="
formData.dateLeaveStart
? new Date(
formData.dateLeaveStart.getTime() + 24 * 60 * 60 * 1000
)
: null
"
>
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
ref="dateLeaveEndRef"
class="full-width datepicker"
outlined
dense
lazy-rules
bg-color="white"
hide-bottom-space
:readonly="!formData.dateLeaveStart"
:model-value="
formData.dateLeaveEnd != null
? date2Thai(formData.dateLeaveEnd)
: null
"
:label="`${'ลาถึงวันที่'}`"
:rules="[(val) => !!val || `${'กรุณาเลือกลาถึงวันที่'}`]"
>
<template v-slot:prepend>
<q-icon
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
</q-icon>
</template>
</q-input>
</template>
</datepicker>
<datepicker
v-model="formData.dateLeaveEnd"
class="col-12 col-md-4 col-sm-6"
menu-class-name="modalfix"
autoApply
borderless
week-start="0"
:locale="'th'"
:readonly="!formData.dateLeaveStart"
:enableTimePicker="false"
:min-date="formData.dateLeaveStart ? new Date(formData.dateLeaveStart.getTime() + 24 * 60 * 60 * 1000) : null"
>
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
ref="dateLeaveEndRef"
class="full-width datepicker"
outlined
dense
lazy-rules
bg-color="white"
hide-bottom-space
:readonly="!formData.dateLeaveStart"
:model-value="formData.dateLeaveEnd != null ? date2Thai(formData.dateLeaveEnd) : null"
:label="`${'ลาถึงวันที่'}`"
:rules="[val => !!val || `${'กรุณาเลือกลาถึงวันที่'}`]"
>
<template v-slot:prepend>
<q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)"> </q-icon>
</template>
</q-input>
</template>
</datepicker>
<q-input
v-model="formData.info"
class="col-12 q-mt-sm"
bg-color="white"
dense
outlined
type="textarea"
label="รายละเอียด"
/>
<q-input v-model="formData.info" class="col-12 q-mt-sm" bg-color="white" dense outlined type="textarea" label="รายละเอียด" />
<div class="col-12 col-sm-6">
<q-file
v-model="formData.file"
bg-color="white"
dense
outlined
multiple
label="เอกสารประกอบ"
>
<template v-slot:prepend>
<q-icon name="attach_file" color="primary" />
</template>
</q-file>
</div>
<div class="col-12 col-sm-6">
<q-file v-model="formData.file" bg-color="white" dense outlined multiple label="เอกสารประกอบ">
<template v-slot:prepend>
<q-icon name="attach_file" color="primary" />
</template>
</q-file>
</div>
<div class="col-12 row" v-if="!edit">
<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>
<q-card bordered flat class="full-width">
<q-list separator>
<q-item v-for="file in files" :key="file.key" class="q-my-xs">
<q-item-section>
<q-item-label class="full-width ellipsis">
{{ file.fileName }}
</q-item-label>
<div class="col-12 row" v-if="!edit">
<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>
<q-card bordered flat class="full-width">
<q-list separator>
<q-item v-for="file in files" :key="file.key" class="q-my-xs">
<q-item-section>
<q-item-label class="full-width ellipsis">
{{ file.fileName }}
</q-item-label>
<q-item-label caption> </q-item-label>
</q-item-section>
</q-item>
</q-list>
</q-card>
</div>
</div>
</q-card>
<q-item-label caption> </q-item-label>
</q-item-section>
</q-item>
</q-list>
</q-card>
</div>
</div>
</q-card>
<div v-if="isSave" class="q-mt-md">
<q-icon name="mdi-numeric-4-circle" size="20px" color="primary" />
<div class="q-pl-sm text-weight-bold text-dark">
ดาวน์โหลด/อัปโหลดแบบฟอร์ม
</div>
<q-card class="bg-grey-1 q-pa-sm" bordered>
<div class="row">
<div class="col-12 col-sm-4 col-md-4 q-my-sm offset-sm-1 offset-md-2">
<div class="column q-mx-xs">
<div class="q-pl-sm text-weight-bold text-dark text-center">
ดาวน์โหลด
</div>
<q-btn
color="primary"
icon="download"
label="ดาวน์โหลดแบบฟอร์ม"
/>
</div>
</div>
<div class="col-10 col-sm-5 col-md-4 q-my-sm">
<div class="column q-mx-xs">
<div class="q-pl-sm text-weight-bold text-dark text-center">
อัปโหลด
</div>
<q-file
v-model="filesUpload"
dense
label="แบบฟอร์ม"
outlined
bg-color="white"
multiple
accept="application/pdf"
>
<template v-slot:prepend>
<q-icon name="attach_file" color="primary" />
</template>
</q-file>
</div>
</div>
<div class="col-md-1 self-end q-mb-sm">
<q-btn
v-if="filesUpload"
flat
round
color="primary"
icon="mdi-arrow-up-bold"
@click="upLoadFile"
><q-tooltip>อัปโหลด</q-tooltip></q-btn
>
</div>
</div>
</q-card>
</div>
<div v-if="isSave" class="q-mt-md">
<q-icon name="mdi-numeric-4-circle" size="20px" color="primary" />
<div class="q-pl-sm text-weight-bold text-dark">ดาวน์โหลด/อัปโหลดแบบฟอร์ม</div>
<q-card class="bg-grey-1 q-pa-sm" bordered>
<div class="row">
<div class="col-12 col-sm-4 col-md-4 q-my-sm offset-sm-1 offset-md-2">
<div class="column q-mx-xs">
<div class="q-pl-sm text-weight-bold text-dark text-center">ดาวน์โหลด</div>
<q-btn color="primary" icon="download" label="ดาวน์โหลดแบบฟอร์ม" />
</div>
</div>
<div class="col-10 col-sm-5 col-md-4 q-my-sm">
<div class="column q-mx-xs">
<div class="q-pl-sm text-weight-bold text-dark text-center">อัปโหลด</div>
<q-file v-model="filesUpload" dense label="แบบฟอร์ม" outlined bg-color="white" multiple accept="application/pdf">
<template v-slot:prepend>
<q-icon name="attach_file" color="primary" />
</template>
</q-file>
</div>
</div>
<div class="col-md-1 self-end q-mb-sm">
<q-btn v-if="filesUpload" flat round color="primary" icon="mdi-arrow-up-bold" @click="upLoadFile"><q-tooltip>อัปโหลด</q-tooltip></q-btn>
</div>
</div>
</q-card>
</div>
<div v-if="!isSave">
<q-separator class="q-mt-sm" />
<div class="row col-12 q-pt-md">
<q-space />
<q-btn
id="onSubmit"
type="submit"
unelevated
dense
class="q-px-md items-center btnBlue"
label="บันทึก"
/>
</div>
</div>
</form>
<div v-if="!isSave">
<q-separator class="q-mt-sm" />
<div class="row col-12 q-pt-md">
<q-space />
<q-btn id="onSubmit" type="submit" unelevated dense class="q-px-md items-center btnBlue" label="บันทึก" />
</div>
</div>
</form>
</template>

4
src/modules/05_leave/componenst/ListCalendar.vue
View file

@ -32,7 +32,7 @@ const model = ref(null)
const modeCancel = ref(true)
/**
* ฟังชันน์ยกเลิก model
* ฟังก์ชั่นยกเลิก model
* @param text
*/
const cancel = async (text: string) => {
@ -42,7 +42,7 @@ const cancel = async (text: string) => {
}
/**
* ฟังชันน์เปิด model
* ฟังก์ชั่นเปิด model
* @param text
*/
const view = async (text: string) => {

2
src/modules/05_leave/componenst/Table.vue
View file

@ -36,7 +36,7 @@ const props = defineProps({
})
/**
* ฟังชันน์ emit ค่าที่กำหนด
* ฟังก์ชั่น emit ค่าที่กำหนด
*/
const emit = defineEmits(["update:inputfilter", "update:inputvisible", "update:editvisible"])
const updateInput = (value: string | number | null) => {