form
This commit is contained in:
setthawutttty
parent
5c4fd87033
commit
7aa2782a86
4 changed files with 96 additions and 190 deletions
|
|
@ -1,22 +1,21 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, reactive } from "vue";
|
||||
import { ref, reactive,watch } from "vue";
|
||||
import { useCounterMixin } from "@/stores/mixin";
|
||||
import { useRouter, useRoute } from "vue-router";
|
||||
import type { FormData } from "@/modules/05_leave/interface/request/AddAbsence";
|
||||
const router = useRouter();
|
||||
import { useLeaveStore } from '@/modules/05_leave/store'
|
||||
const mixin = useCounterMixin();
|
||||
const routeName = router.currentRoute.value.name;
|
||||
const files = ref<any>();
|
||||
const levelStudy = ref<string>("");
|
||||
const degree = ref<string>("");
|
||||
const major = ref<string>("");
|
||||
const educational = ref<string>("");
|
||||
const studyPeriod = ref<string>("");
|
||||
const country = ref<string>("");
|
||||
const capital = ref<string>("");
|
||||
const noteReason = ref("");
|
||||
|
||||
const dataStore = useLeaveStore()
|
||||
const { date2Thai } = mixin;
|
||||
const props = defineProps({
|
||||
model: {
|
||||
type: String,
|
||||
default: '',
|
||||
},
|
||||
onSubmit: {
|
||||
type: Function,
|
||||
default: () => "",
|
||||
},
|
||||
});
|
||||
|
||||
const formData = reactive<FormData>({
|
||||
dateStart: new Date(),
|
||||
|
|
@ -30,20 +29,10 @@ const formData = reactive<FormData>({
|
|||
leaveUse: "1",
|
||||
leaveRemaining: "1",
|
||||
});
|
||||
const props = defineProps({
|
||||
type: {
|
||||
type: String,
|
||||
default: "",
|
||||
},
|
||||
data: {
|
||||
type: Object,
|
||||
default: null,
|
||||
},
|
||||
onSubmit: {
|
||||
type: Function,
|
||||
default: () => "",
|
||||
},
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
</script>
|
||||
<template>
|
||||
<q-card bordered class="q-pa-md bg-grey-1">
|
||||
|
|
@ -57,7 +46,7 @@ const props = defineProps({
|
|||
borderless
|
||||
:enableTimePicker="false"
|
||||
week-start="0"
|
||||
:readonly="routeName != 'addAbsence'"
|
||||
readonly
|
||||
>
|
||||
<template #year="{ year }">
|
||||
{{ year + 543 }}
|
||||
|
|
@ -70,7 +59,7 @@ const props = defineProps({
|
|||
outlined
|
||||
dense
|
||||
hide-bottom-space
|
||||
:readonly="routeName != 'addAbsence'"
|
||||
readonly
|
||||
class="full-width datepicker"
|
||||
:model-value="
|
||||
formData.dateStart != null ? date2Thai(formData.dateStart) : null
|
||||
|
|
@ -94,7 +83,7 @@ const props = defineProps({
|
|||
dense
|
||||
outlined
|
||||
readonly
|
||||
v-model="formData.subject"
|
||||
v-model="dataStore.typeLeave"
|
||||
label="เรื่อง"
|
||||
/>
|
||||
<q-input
|
||||
|
|
@ -163,106 +152,4 @@ const props = defineProps({
|
|||
/>
|
||||
</div>
|
||||
</q-card>
|
||||
<q-card bordered class="q-pa-md bg-grey-1">
|
||||
<div class="col-12 row q-pa-sm q-col-gutter-sm">
|
||||
<q-input
|
||||
class="col-4"
|
||||
v-if="props.type === '7'"
|
||||
dense
|
||||
outlined
|
||||
v-model="levelStudy"
|
||||
label="ระดับที่ขอลาศึกษา"
|
||||
:readonly="routeName != 'addAbsence'"
|
||||
/>
|
||||
|
||||
<q-input
|
||||
class="col-4"
|
||||
v-if="props.type === '7'"
|
||||
dense
|
||||
outlined
|
||||
v-model="degree"
|
||||
label="ชื่อปริญญา/ประกาศนียบัตร"
|
||||
:readonly="routeName != 'addAbsence'"
|
||||
/>
|
||||
|
||||
<q-input
|
||||
class="col-4"
|
||||
v-if="props.type === '7'"
|
||||
dense
|
||||
outlined
|
||||
v-model="major"
|
||||
label="สาขาวิชาเอก/หลักสูตร/วิชา"
|
||||
:readonly="routeName != 'addAbsence'"
|
||||
/>
|
||||
|
||||
<q-input
|
||||
class="col-4"
|
||||
v-if="props.type === '7'"
|
||||
dense
|
||||
outlined
|
||||
v-model="educational"
|
||||
label="ณ สถานศึกษา"
|
||||
:readonly="routeName != 'addAbsence'"
|
||||
/>
|
||||
|
||||
<q-input
|
||||
class="col-4"
|
||||
v-if="props.type === '7'"
|
||||
dense
|
||||
outlined
|
||||
v-model="studyPeriod"
|
||||
label="ระยะเวลาในการศึกษาตลอดหลักสูตร"
|
||||
:readonly="routeName != 'addAbsence'"
|
||||
/>
|
||||
|
||||
<q-input
|
||||
class="col-4"
|
||||
v-if="props.type === '7'"
|
||||
dense
|
||||
outlined
|
||||
v-model="country"
|
||||
label="ประเทศ"
|
||||
:readonly="routeName != 'addAbsence'"
|
||||
/>
|
||||
|
||||
<q-input
|
||||
class="col-4"
|
||||
v-if="props.type === '7'"
|
||||
dense
|
||||
outlined
|
||||
v-model="capital"
|
||||
label="ด้วยทุน"
|
||||
:readonly="routeName != 'addAbsence'"
|
||||
/>
|
||||
|
||||
<q-input
|
||||
class="col-8"
|
||||
v-if="props.type === '7'"
|
||||
dense
|
||||
outlined
|
||||
v-model="noteReason"
|
||||
label="ที่มาของหลักสูตร"
|
||||
:readonly="routeName != 'addAbsence'"
|
||||
/>
|
||||
|
||||
<div class="col-12 row" v-if="routeName != 'addAbsence'">
|
||||
<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>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -32,8 +32,7 @@ const props = defineProps({
|
|||
(อาจดึงมาจากที่อยู่ปัจจุบันโดยอัตโนมัติ แต่ให้ผู้ใช้งานแก้ไขได้)
|
||||
</p> -->
|
||||
|
||||
<div class="col-12 row q-col-gutter-md q-pa-md">
|
||||
<div class="col-xs-12 col-sm-12">
|
||||
|
||||
<q-card bordered class="q-pa-md bg-grey-1">
|
||||
<div class="col-12 row q-pa-sm q-col-gutter-sm">
|
||||
<q-input
|
||||
|
|
@ -230,6 +229,5 @@ const props = defineProps({
|
|||
</div>
|
||||
</q-card>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -5,6 +5,7 @@ import type { FormLeavetMainData, OptionData, formListLeaveData } from "@/module
|
|||
import { useCounterMixin } from "@/stores/mixin"
|
||||
|
||||
export const useLeaveStore = defineStore("Leave", () => {
|
||||
const typeLeave = ref<string|undefined>('')
|
||||
const mixin = useCounterMixin()
|
||||
const { date2Thai } = mixin
|
||||
const LeaveType = ref<string | null>("0")
|
||||
|
|
@ -244,6 +245,53 @@ export const useLeaveStore = defineStore("Leave", () => {
|
|||
style: "font-size: 14px; width:10%;",
|
||||
},
|
||||
])
|
||||
function typeConvert(item: string,subitem:any) {
|
||||
console.log('first',item)
|
||||
if (item !== '5' && item !== '7') {
|
||||
typeLeave.value = convertSubtitle(item);
|
||||
}else if(item === '5'){
|
||||
typeLeave.value = convertSubtitleInfo(subitem);
|
||||
|
||||
}else if(item === '7'){
|
||||
typeLeave.value = convertSubtitleInfo2(subitem);
|
||||
}
|
||||
}
|
||||
|
||||
function convertSubtitle(val: string) {
|
||||
if (val) {
|
||||
switch (val) {
|
||||
case "0": return "ลาป่วย";
|
||||
case "1": return "ลากิจส่วนตัว";
|
||||
case "2": return "ลาคลอดบุตร";
|
||||
case "3": return "ลาไปช่วยเหลือภริยาที่คลอดบุตร";
|
||||
case "4": return "ลาพักผ่อน";
|
||||
case "5": return "ลาอุปสมบทหรือลาประกอบพิธีฮัจย์ฯ";
|
||||
case "6": return "ลาเข้ารับการตรวจเลือกหรือเข้ารับการเตรียมพล";
|
||||
case "7": return "ลาไปศึกษา";
|
||||
case "8": return "ลาไปปฎิบัติงานในองค์การระหว่างประเทศ";
|
||||
case "9": return "ลาติดตามคู่สมรส";
|
||||
case "10": return "ลาไปฟื้นฟูสมรรถภาพด้านอาชีพ";
|
||||
}
|
||||
}
|
||||
}
|
||||
function convertSubtitleInfo(val: string) {
|
||||
if (val) {
|
||||
switch (val) {
|
||||
case "0": return "ลาอุปสมบท";
|
||||
case "1": return "ลาประกอบพิธีฮัจย์";
|
||||
}
|
||||
}
|
||||
}
|
||||
function convertSubtitleInfo2(val: string) {
|
||||
if (val) {
|
||||
switch (val) {
|
||||
case "0": return "ลาไปศึกษา";
|
||||
case "1": return "ฝึกอบรม";
|
||||
case "2": return "ปฎิบัติการวิจัย";
|
||||
case "3": return "ดูงาน";
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
typeOptions,
|
||||
|
|
@ -264,6 +312,8 @@ export const useLeaveStore = defineStore("Leave", () => {
|
|||
fiscalyearOP,
|
||||
fiscalYearyear,
|
||||
options,
|
||||
optionsOrdination
|
||||
optionsOrdination,
|
||||
typeConvert,
|
||||
typeLeave
|
||||
}
|
||||
})
|
||||
|
|
|
|||
|
|
@ -1,15 +1,15 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, onMounted,computed } from "vue";
|
||||
import { ref, onMounted, computed } from "vue";
|
||||
import { useQuasar } from "quasar";
|
||||
import { useRouter, useRoute } from "vue-router";
|
||||
|
||||
import Form from '@/modules/05_leave/componenst/Form.vue'
|
||||
import Form from "@/modules/05_leave/componenst/Form.vue";
|
||||
import Form3 from "@/modules/05_leave/componenst/Forms/01_SickForm.vue";
|
||||
import { useLeaveStore } from "@/modules/05_leave/store";
|
||||
import http from "@/plugins/http";
|
||||
import config from "@/app.config";
|
||||
import type { QForm } from "quasar";
|
||||
|
||||
|
||||
const dataStore = useLeaveStore();
|
||||
|
||||
const router = useRouter();
|
||||
|
|
@ -17,18 +17,15 @@ const route = useRoute();
|
|||
const myform = ref<QForm | null>(null);
|
||||
const $q = useQuasar();
|
||||
|
||||
const model = ref('');
|
||||
const model = ref("");
|
||||
const modelSpecific = ref(null);
|
||||
|
||||
|
||||
|
||||
const clickBack = () => {
|
||||
router.push(`/leave`);
|
||||
};
|
||||
|
||||
onMounted(() => {});
|
||||
|
||||
|
||||
const saveAbsence = () => {
|
||||
$q.dialog({
|
||||
title: "ยืนยันการยื่นข้อมูลลาออก",
|
||||
|
|
@ -74,7 +71,7 @@ const saveAbsence = () => {
|
|||
<div class="col-xs-12 col-sm-12">
|
||||
<q-icon name="mdi-numeric-1-circle" size="20px" color="primary" />
|
||||
<div class="q-pl-sm text-weight-bold text-dark">
|
||||
เลือกประเภทการลา {{ model }}
|
||||
เลือกประเภทการลา
|
||||
</div>
|
||||
<div class="col-12 row q-pa-sm q-col-gutter-sm">
|
||||
<q-select
|
||||
|
|
@ -88,66 +85,40 @@ const saveAbsence = () => {
|
|||
emit-value
|
||||
map-options
|
||||
prefix="ประเภทใบลา :"
|
||||
@update:model-value="dataStore.typeConvert(model,null)"
|
||||
/>
|
||||
<!-- v-if (ลาอุปสมบทหรือลาประกอบพิธีฮัจย์ฯ||ลาไปศึกษา ฝึกอบรม ปฎิบัติการวิจัย หรือดูงาน) -->
|
||||
<div class="col-6 row q-pa-sm" v-if="model === '5' || model === '7'">
|
||||
<div
|
||||
class="col-6 row q-pa-sm"
|
||||
v-if="model === '5' || model === '7'"
|
||||
>
|
||||
<q-select
|
||||
dense
|
||||
class="q-ml-lg col-6"
|
||||
outlined
|
||||
v-model="modelSpecific"
|
||||
:options="model === '5' ? dataStore.optionsOrdination : dataStore.optionsSpecific"
|
||||
:options="
|
||||
model === '5'
|
||||
? dataStore.optionsOrdination
|
||||
: dataStore.optionsSpecific
|
||||
"
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
emit-value
|
||||
map-options
|
||||
prefix="ประเภทใบลา :"
|
||||
@update:model-value="dataStore.typeConvert(model,modelSpecific)"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<q-icon
|
||||
name="mdi-numeric-2-circle"
|
||||
size="20px"
|
||||
color="primary"
|
||||
v-if="model == '7'"
|
||||
/>
|
||||
<div
|
||||
class="q-pl-sm text-weight-bold text-dark"
|
||||
v-if="model == '7'"
|
||||
>
|
||||
เลือกประเภทใบลาศึกษา ฝึกอบรม ปฎิบัติการวิจัย หรือดูงาน
|
||||
</div>
|
||||
<div
|
||||
class="col-12 row q-pa-sm q-col-gutter-sm"
|
||||
v-if="model == '7'"
|
||||
>
|
||||
<q-select
|
||||
dense
|
||||
class="q-ml-lg col-6"
|
||||
outlined
|
||||
v-model="modelSpecific"
|
||||
:options="dataStore.optionsSpecific"
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
emit-value
|
||||
map-options
|
||||
prefix="ประเภทใบลา :"
|
||||
/>
|
||||
</div>
|
||||
<q-icon
|
||||
name="mdi-numeric-2-circle"
|
||||
size="20px"
|
||||
color="primary"
|
||||
v-else
|
||||
/>
|
||||
<q-icon
|
||||
name="mdi-numeric-3-circle"
|
||||
size="20px"
|
||||
color="primary"
|
||||
v-if="model == '7'"
|
||||
/>
|
||||
<q-icon name="mdi-numeric-2-circle" size="20px" color="primary" />
|
||||
<div class="q-pl-sm text-weight-bold text-dark">ข้อมูลการลา</div>
|
||||
<Form :model="model" />
|
||||
</div>
|
||||
<div v-if="model">
|
||||
<q-icon name="mdi-numeric-3-circle" size="20px" color="primary" />
|
||||
<div class="q-pl-sm text-weight-bold text-dark">กรอกข้อมูล</div>
|
||||
<Form :type="model"/>
|
||||
<Form3 v-if="model === '0' || model === '1' || model === '2'"/>
|
||||
</div>
|
||||
</div>
|
||||
<q-separator />
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue