62 lines
2.1 KiB
Vue
62 lines
2.1 KiB
Vue
<script setup lang="ts">
|
|
import { reactive, ref, watch } from "vue"
|
|
|
|
import SickForm from "@/modules/05_leave/componenst/Forms/01_SickForm.vue"
|
|
import HelpWifeBirthForm from "@/modules/05_leave/componenst/Forms/04_HelpWifeBirthForm.vue"
|
|
import VacationForm from "@/modules/05_leave/componenst/Forms/05_VacationForm.vue"
|
|
import FollowSpouseForm from "@/modules/05_leave/componenst/Forms/12_FollowSpouseForm.vue"
|
|
const type = ref<number>(0)
|
|
const typeOption = reactive([
|
|
{ id: 0, name: "" },
|
|
{ id: 1, name: "ลาป่วย" },
|
|
{ id: 2, name: "ลากิจ" },
|
|
{ id: 3, name: "ลาคลอด" },
|
|
{ id: 4, name: "ลาไปช่วยเหลือภริยาที่คลอดบุตร" },
|
|
{ id: 5, name: "ลาพักผ่อน" },
|
|
{ id: 6, name: "ลาติดตามคู่สมรส" },
|
|
])
|
|
|
|
async function onSubmit() {
|
|
console.log("testOnsub")
|
|
}
|
|
|
|
watch(
|
|
() => type.value,
|
|
() => {
|
|
// save store
|
|
console.log("ประเภทการลา===>", type.value)
|
|
}
|
|
)
|
|
</script>
|
|
|
|
<template>
|
|
<div class="col-12 row justify-center">
|
|
<div class="col-xs-12 col-sm-12 col-md-11">
|
|
<div class="toptitle text-white col-12 row items-center">
|
|
<q-btn icon="mdi-arrow-left" unelevated round dense flat color="primary" class="q-mr-sm" />
|
|
<div>ยื่นใบลา</div>
|
|
</div>
|
|
|
|
<q-card bordered>
|
|
<form>
|
|
<div class="col-12 row q-col-gutter-md q-pa-md">
|
|
<div class="col-xs-12 col-sm-12">
|
|
<q-select filled v-model="type" :options="typeOption" label="ประเภทการลา" option-value="id" option-label="name" map-options emit-value />
|
|
|
|
<SickForm v-if="type == 1 || type == 2 || type == 3" />
|
|
<HelpWifeBirthForm v-if="type == 4" />
|
|
<VacationForm v-if="type == 5" />
|
|
<FollowSpouseForm v-if="type == 6" />
|
|
</div>
|
|
</div>
|
|
|
|
<q-separator />
|
|
<div class="row col-12 q-pa-md">
|
|
<q-space />
|
|
<q-btn id="submitForm" unelevated dense class="q-px-md items-center btnBlue" label="บันทึก" @click="onSubmit" />
|
|
</div>
|
|
</form>
|
|
</q-card>
|
|
</div>
|
|
</div>
|
|
</template>
|