ปรับฟอร์มทุนระบบพัฒนา

This commit is contained in:
Warunee Tamkoo 2024-04-18 16:05:39 +07:00
parent 6fb49dd324
commit 44fe23f289
5 changed files with 516 additions and 254 deletions

View file

@ -111,11 +111,11 @@ const columns = ref<QTableProps["columns"]>([
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "startDate",
name: "dateStart",
align: "left",
label: "วันที่เริ่มต้น",
sortable: true,
field: "startDate",
field: "dateStart",
format: (v) => date2Thai(v),
headerStyle: "font-size: 14px",
style: "font-size: 14px",
@ -123,11 +123,11 @@ const columns = ref<QTableProps["columns"]>([
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "endDate",
name: "dateEnd",
align: "left",
label: "วันที่สิ้นสุด",
sortable: true,
field: "endDate",
field: "dateEnd",
format: (v) => date2Thai(v),
headerStyle: "font-size: 14px",
style: "font-size: 14px",

View file

@ -1,7 +1,11 @@
<script setup lang="ts">
import { ref, watch, computed,reactive } from "vue";
import { ref, watch, computed, reactive } from "vue";
import Header from "@/components/DialogHeader.vue";
import type { DataOption,FormFilter,NewPagination } from "@/modules/15_development/interface/index/Main";
import type {
DataOption,
FormFilter,
NewPagination,
} from "@/modules/15_development/interface/index/Main";
import { useDevelopmentDataStore } from "@/modules/15_development/store/developmentStore";
import { useCounterMixin } from "@/stores/mixin";
import { useQuasar, type QTableProps } from "quasar";
@ -9,8 +13,7 @@ import { useQuasar, type QTableProps } from "quasar";
import http from "@/plugins/http";
import config from "@/app.config";
const rows = ref<any[]>([])
const rows = ref<any[]>([]);
const props = defineProps({
upDate: { type: Function },
});
@ -138,27 +141,30 @@ function onSubmit() {
if (selected.value?.length == 0) {
dialogMessageNotify($q, `กรุณาเลือก 1 รายการ`);
} else {
const data = selected.value[0];
const body = {
id:data.id,
name:data.name,
prefix:data.prefix,
rank:data.rank,
firstName:data.firstName,
lastName:data.lastName,
citizenId:data.citizenId,
level:data.level,
type:data.type,
posLevelId:data.posLevelId,
posTypeId:data.posTypeId,
position:data.position,
positionSide:data.positionSide,
posNo:data.posNo,
};
props.upDate?.(body)
closeDialog();
const data = selected.value[0];
const body = {
id: data.id,
name: data.name,
prefix: data.prefix,
rank: data.rank,
firstName: data.firstName,
lastName: data.lastName,
citizenId: data.citizenId,
level: data.level,
type: data.type,
posLevelId: data.posLevelId,
posTypeId: data.posTypeId,
position: data.position,
positionSide: data.positionSide,
posNo: data.posNo,
org: data.org,
rootId: data.rootId,
root: data.root,
orgRootShortName: data.orgRootShortName,
orgRevisionId: data.orgRevisionId,
};
props.upDate?.(body);
closeDialog();
}
}
@ -167,7 +173,7 @@ function closeDialog() {
modal.value = false;
rows.value = [];
selected.value = [];
inputSearch.value = ''
inputSearch.value = "";
}
/** class */
@ -186,20 +192,27 @@ function searchFilter() {
const data = res.data.result.data;
maxPage.value = Math.ceil(res.data.result.total / formFilter.pageSize);
rows.value = data.map((item: any) => ({
id:item.id ? item.id : null,
name: item.firstName ? `${item.prefix}${item.firstName} ${item.lastName}` : null,
prefix:item.prefix ? item.prefix : null,
rank:item.rank ? item.rank : null,
firstName:item.firstName ? item.firstName : null,
lastName:item.lastName ? item.lastName : null,
citizenId:item.citizenId ? item.citizenId : null,
level:item.posLevel ? item.posLevel : null,
type:item.posType ? item.posType : null,
posLevelId:item.posLevelId ? item.posLevelId : null,
posTypeId:item.posTypeId ? item.posTypeId : null,
position:item.position ? item.position : null,
positionSide:item.posExecutive ? item.posExecutive : null,
posNo:item.posNo ? item.posNo : null,
id: item.id ? item.id : null,
name: item.firstName
? `${item.prefix}${item.firstName} ${item.lastName}`
: null,
prefix: item.prefix ? item.prefix : null,
rank: item.rank ? item.rank : null,
firstName: item.firstName ? item.firstName : null,
lastName: item.lastName ? item.lastName : null,
citizenId: item.citizenId ? item.citizenId : null,
level: item.posLevel ? item.posLevel : null,
type: item.posType ? item.posType : null,
posLevelId: item.posLevelId ? item.posLevelId : null,
posTypeId: item.posTypeId ? item.posTypeId : null,
position: item.position ? item.position : null,
positionSide: item.posExecutive ? item.posExecutive : null,
posNo: item.posNo ? item.posNo : null,
org: item.org ? item.org : null,
rootId: item.rootId ? item.rootId : null,
root: item.root ? item.root : null,
orgRootShortName: item.orgRootShortName ? item.orgRootShortName : null,
orgRevisionId: item.orgRevisionId ? item.orgRevisionId : null,
}));
})
.catch((e) => {
@ -210,7 +223,7 @@ function searchFilter() {
});
}
function updatePage(val:number){
function updatePage(val: number) {
formFilter.page = val;
searchFilter();
}

View file

@ -106,6 +106,11 @@ const formBody = reactive<FormsSholarship>({
posExecutive: "", //
posLevelId: null, //
posTypeId: null, //
org: "",
rootId: null,
root: "",
orgRootShortName: "",
orgRevisionId: null,
guarantorRank: "", //()
guarantorPrefix: "", //()
guarantorFirstName: "", //()
@ -218,11 +223,12 @@ function fetchDataDetail(id: string) {
dataPerson.type = data.posTypeName ? data.posTypeName : "-";
dataPerson.level = data.posLevelName ? data.posLevelName : "-";
dataPerson.positionSide = data.posExecutive ? data.posExecutive : "-";
dataPerson.org = data.org ? data.org : "-";
dataGuarantor.citizenId = data.guarantorCitizenId
? data.guarantorCitizenId
: "-";
dataGuarantor.name = `${data.guarantorPrefix} ${data.guarantorFirstName} ${data.guarantorLastName}`;
dataGuarantor.name = `${data.guarantorPrefix}${data.guarantorFirstName} ${data.guarantorLastName}`;
dataGuarantor.position = data.position ? data.position : "-";
dataGuarantor.type = data.posTypeguarantorName
? data.posTypeguarantorName
@ -252,6 +258,17 @@ function onSubmit() {
typeof formBody.budgetApprove === "string"
? Number(formBody.budgetApprove.replace(/,/g, ""))
: formBody.budgetApprove;
if (formBody.scholarshipType === "RESEARCH") {
formBody.planType = "";
formBody.fundType = "";
formBody.budgetSource = "";
formBody.useOfficialTime = false;
formBody.reportBackNo = "";
formBody.reportBackNoDate = null;
formBody.reportBackDate = null;
formBody.changeDetail = "";
}
try {
const url = scholarshipId.value
? config.API.devScholarshipByid(scholarshipId.value)
@ -363,7 +380,6 @@ function onSelectGov(isGov: boolean) {
function upDate(data: DataPerson) {
if (isSelectGov.value) {
console.log(data);
formBody.profileId = data.id;
formBody.rank = data.rank;
formBody.prefix = data.prefix;
@ -374,6 +390,11 @@ function upDate(data: DataPerson) {
formBody.posTypeId = data.posTypeId;
formBody.posLevelId = data.posLevelId;
formBody.posExecutive = data.positionSide;
formBody.org = data.org;
formBody.rootId = data.rootId;
formBody.root = data.root;
formBody.orgRootShortName = data.orgRootShortName;
formBody.orgRevisionId = data.orgRevisionId;
dataPerson.id = data.id ? data.id : "-";
dataPerson.citizenId = data.citizenId ? data.citizenId : "-";
@ -382,6 +403,7 @@ function upDate(data: DataPerson) {
dataPerson.type = data.type ? data.type : "-";
dataPerson.level = data.level ? data.level : "-";
dataPerson.positionSide = data.positionSide ? data.positionSide : "-";
dataPerson.org = data.org ? data.org : "-";
isGov.value = true;
} else {
formBody.guarantorRank = data.rank;
@ -484,18 +506,18 @@ onMounted(() => {
<q-btn
unelevated
color="green"
label="สำเร็จการศึกษา"
label="เรียนจบ"
@click="onClickUpdateStatus('GRADUATE')"
/>
<q-btn
unelevated
color="red"
label="ไม่จบการศึกษา"
label="เรียนไม่จบ"
@click="onClickUpdateStatus('NOTGRADUATE')"
/>
</div>
<div :class="isStatus === 'GRADUATE' ? 'text-green' : 'text-red'" v-else>
{{ isStatus === "GRADUATE" ? "สำเร็จการศึกษา" : "ไม่จบการศึกษา" }}
{{ isStatus === "GRADUATE" ? "เรียนจบ" : "เรียนไม่จบ" }}
</div>
</div>
</div>
@ -533,7 +555,7 @@ onMounted(() => {
<div class="col-8 text-weight-medium">
{{ dataPerson.position }}
</div>
<div class="col-4 text-grey">ประเภท</div>
<div class="col-4 text-grey">ประเภทตำแหน</div>
<div class="col-8 text-weight-medium">
{{ dataPerson.type }}
</div>
@ -587,7 +609,8 @@ onMounted(() => {
class="col-3"
v-if="
formBody.scholarshipType !== '' &&
formBody.scholarshipType !== 'EXECUTIVE'
formBody.scholarshipType !== 'EXECUTIVE' &&
formBody.scholarshipType !== 'RESEARCH'
"
>
<q-select
@ -610,7 +633,7 @@ onMounted(() => {
/>
</div>
<div class="col-12">
<div v-if="formBody.scholarshipType !== 'RESEARCH'" class="col-12">
<q-radio
v-model="formBody.planType"
checked-icon="task_alt"
@ -629,193 +652,208 @@ onMounted(() => {
class="q-pl-sm"
/>
</div>
<div class="col-3">
<datepicker
menu-class-name="modalfix"
v-model="formBody.scholarshipYear"
:locale="'th'"
autoApply
year-picker
:enableTimePicker="false"
>
<template #year="{ year }">{{ year + 543 }}</template>
<template #year-overlay-value="{ value }">{{
parseInt(value + 543)
}}</template>
<template #trigger>
<q-input
dense
outlined
class="inputgreen"
:model-value="
formBody.scholarshipYear
? Number(formBody.scholarshipYear) + 543
: null
"
:label="`${'ปีงบประมาณที่ได้รับทุน'}`"
hide-bottom-space
:rules="[
<div class="row col-12 q-col-gutter-md">
<div class="col-3">
<datepicker
menu-class-name="modalfix"
v-model="formBody.scholarshipYear"
:locale="'th'"
autoApply
year-picker
:enableTimePicker="false"
>
<template #year="{ year }">{{ year + 543 }}</template>
<template #year-overlay-value="{ value }">{{
parseInt(value + 543)
}}</template>
<template #trigger>
<q-input
dense
outlined
class="inputgreen"
:model-value="
formBody.scholarshipYear
? Number(formBody.scholarshipYear) + 543
: null
"
:label="`${
formBody.scholarshipType === 'RESEARCH'
? 'ปีงบประมาณที่ได้รับอนุมัติ '
: 'ปีงบประมาณที่ได้รับทุน'
}`"
hide-bottom-space
:rules="[
(val: string) => !!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 class="col-3">
<q-select
dense
outlined
class="inputgreen"
label="แหล่งงบประมาณ"
hide-bottom-space
v-model="formBody.budgetSource"
:options="budgetSourceOp"
option-label="name"
option-value="id"
emit-value
map-options
:rules="[
>
<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 v-if="formBody.scholarshipType !== 'RESEARCH'" class="col-3">
<q-select
dense
outlined
class="inputgreen"
label="แหล่งงบประมาณ"
hide-bottom-space
v-model="formBody.budgetSource"
:options="budgetSourceOp"
option-label="name"
option-value="id"
emit-value
map-options
:rules="[
(val: string) =>
!!val || `${'กรุณาเลือกแหล่งงบประมาณ'}`,
]"
/>
/>
</div>
<div class="col-3">
<q-input
dense
outlined
hide-bottom-space
class="inputgreen"
v-model="formBody.budgetApprove"
label="งบประมาณที่ได้รับอนุมัติตลอดหลักสูตร"
mask="###,###,###,###,###,###"
reverse-fill-mask
:rules="[
(val: any) => {
if (!val && !formBody.isNoUseBudget) {
return 'กรุณากรอกงบประมาณที่ได้รับอนุมัติตลอดหลักสูตร';
}
return true;
},
]"
/>
</div>
<div class="col-3">
<q-checkbox
keep-color
color="primary"
v-model="formBody.isNoUseBudget"
label="ไม่ใช้งบประมาณ"
/>
</div>
</div>
<div class="col-3">
<q-input
dense
outlined
hide-bottom-space
class="inputgreen"
v-model="formBody.budgetApprove"
label="งบประมาณที่ได้รับอนุมัติตลอดหลักสูตร"
mask="###,###,###,###,###,###"
reverse-fill-mask
:rules="[
(val: string) =>
!!val || `${'กรุณากรอกงบประมาณที่ได้รับอนุมัติตลอดหลักสูตร'}`,
]"
/>
</div>
<div class="col-3">
<q-checkbox
keep-color
color="primary"
v-model="formBody.isNoUseBudget"
label="ไม่ใช้งบประมาณ"
/>
</div>
<div class="col-3">
<q-input
dense
outlined
class="inputgreen"
v-model="formBody.bookNo"
label="เลขที่หนังสืออนุมัติ"
hide-bottom-space
:rules="[
<div class="row col-12 q-col-gutter-md">
<div class="col-3">
<q-input
dense
outlined
class="inputgreen"
v-model="formBody.bookNo"
label="เลขที่หนังสืออนุมัติ"
hide-bottom-space
:rules="[
(val: string) =>
!!val || `${'กรุณากรอกเลขที่หนังสืออนุมัติ'}`,
]"
/>
</div>
<div class="col-3">
<datepicker
menu-class-name="modalfix"
v-model="formBody.bookNoDate"
:locale="'th'"
autoApply
:enableTimePicker="false"
>
<template #year="{ year }">{{ year + 543 }}</template>
<template #year-overlay-value="{ value }">{{
parseInt(value + 543)
}}</template>
<template #trigger>
<q-input
dense
outlined
class="inputgreen"
:model-value="
formBody.bookNoDate ? date2Thai(formBody.bookNoDate) : null
"
:label="`${'ลงวันที่'}`"
hide-bottom-space
:rules="[
/>
</div>
<div class="col-3">
<datepicker
menu-class-name="modalfix"
v-model="formBody.bookNoDate"
:locale="'th'"
autoApply
:enableTimePicker="false"
>
<template #year="{ year }">{{ year + 543 }}</template>
<template #year-overlay-value="{ value }">{{
parseInt(value + 543)
}}</template>
<template #trigger>
<q-input
dense
outlined
class="inputgreen"
:model-value="
formBody.bookNoDate ? date2Thai(formBody.bookNoDate) : null
"
:label="`${'ลงวันที่'}`"
hide-bottom-space
:rules="[
(val: string) =>
!!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 class="col-3">
<datepicker
menu-class-name="modalfix"
v-model="formBody.bookApproveDate"
:locale="'th'"
autoApply
:enableTimePicker="false"
>
<template #year="{ year }">{{ year + 543 }}</template>
<template #year-overlay-value="{ value }">{{
parseInt(value + 543)
}}</template>
<template #trigger>
<q-input
dense
outlined
class="inputgreen"
:model-value="
formBody.bookApproveDate
? date2Thai(formBody.bookApproveDate)
: null
"
:label="`${'หนังสืออนุมัติเมื่อวันที่'}`"
hide-bottom-space
:rules="[
>
<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 class="col-3">
<datepicker
menu-class-name="modalfix"
v-model="formBody.bookApproveDate"
:locale="'th'"
autoApply
:enableTimePicker="false"
>
<template #year="{ year }">{{ year + 543 }}</template>
<template #year-overlay-value="{ value }">{{
parseInt(value + 543)
}}</template>
<template #trigger>
<q-input
dense
outlined
class="inputgreen"
:model-value="
formBody.bookApproveDate
? date2Thai(formBody.bookApproveDate)
: null
"
:label="`${'หนังสืออนุมัติเมื่อวันที่'}`"
hide-bottom-space
:rules="[
(val: string) =>
!!val || `${'กรุณาเลือกวันที่หนังสืออนุมัติเมื่อวันที่'}`,
]"
>
<template v-slot:prepend>
<q-icon
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
</q-icon>
</template>
</q-input>
</template>
</datepicker>
>
<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 v-if="formBody.scholarshipType !== 'RESEARCH'" class="col-3">
<q-checkbox
keep-color
color="primary"
v-model="formBody.useOfficialTime"
label="ใช้เวลาราชการ"
/>
</div>
</div>
<div class="col-3">
<q-checkbox
keep-color
color="primary"
v-model="formBody.useOfficialTime"
label="ใช้เวลาราชการ"
/>
</div>
<div class="col-12">
<div v-if="formBody.scholarshipType !== 'RESEARCH'" class="col-12">
<q-input
outlined
dense
@ -832,13 +870,7 @@ onMounted(() => {
/>
</div>
<div
class="col-12"
v-if="
formBody.scholarshipType !== '' &&
formBody.scholarshipType !== 'EXECUTIVE'
"
>
<div class="col-12" v-if="formBody.scholarshipType !== 'EXECUTIVE'">
<div class="row col-12 q-col-gutter-md">
<div class="col-3">
<q-input
@ -895,7 +927,7 @@ onMounted(() => {
</template>
</datepicker>
</div>
<div class="col-3">
<div v-if="formBody.scholarshipType !== 'RESEARCH'" class="col-3">
<q-input
dense
outlined
@ -909,7 +941,7 @@ onMounted(() => {
]"
/>
</div>
<div class="col-2">
<div v-if="formBody.scholarshipType !== 'RESEARCH'" class="col-2">
<datepicker
menu-class-name="modalfix"
v-model="formBody.reportBackNoDate"
@ -950,7 +982,7 @@ onMounted(() => {
</template>
</datepicker>
</div>
<div class="col-2">
<div v-if="formBody.scholarshipType !== 'RESEARCH'" class="col-2">
<datepicker
menu-class-name="modalfix"
v-model="formBody.reportBackDate"
@ -1888,12 +1920,12 @@ onMounted(() => {
outlined
lazy-rules
hide-bottom-space
label="สถานที่ไปศึกษาดูงาน"
label="สถานที่ไปศึกษาดูงานในประเทศ"
class="inputgreen"
v-model="formBody.studyPlace"
:rules="[
(val: string) =>
!!val || `${'กรุณากรอกสถานที่ไปศึกษาดูงาน'}`,
!!val || `${'กรุณากรอกสถานที่ไปศึกษาดูงานในประเทศ'}`,
]"
/>
</div>
@ -1903,12 +1935,12 @@ onMounted(() => {
outlined
lazy-rules
hide-bottom-space
label="หัวข้อการไปศึกษาดูงาน"
label="หัวข้อการไปศึกษาดูงานในประเทศ"
class="inputgreen"
v-model="formBody.studyTopic"
:rules="[
(val: string) =>
!!val || `${'กรุณากรอกหัวข้อการไปศึกษาดูงาน'}`,
!!val || `${'กรุณากรอกหัวข้อการไปศึกษาดูงานในประเทศ'}`,
]"
/>
</div>
@ -1936,11 +1968,11 @@ onMounted(() => {
? date2Thai(formBody.studyStartDate)
: null
"
:label="`${'วันเริ่มต้นการศึกษาดูงาน'}`"
:label="`${'วันเริ่มต้นการศึกษาดูงานในประเทศ'}`"
hide-bottom-space
:rules="[
(val: string) =>
!!val || `${'กรุณาเลือกวันเริ่มต้นการศึกษาดูงาน'}`,
!!val || `${'กรุณาเลือกวันเริ่มต้นการศึกษาดูงานในประเทศ'}`,
]"
>
<template v-slot:prepend>
@ -1986,11 +2018,11 @@ onMounted(() => {
? date2Thai(formBody.studyEndDate)
: null
"
:label="`${'วันสิ้นสุดการศึกษาดูงาน'}`"
:label="`${'วันสิ้นสุดการศึกษาดูงานในประเทศ'}`"
hide-bottom-space
:rules="[
(val: string) =>
!!val || `${'กรุณาเลือกวันที่วันสิ้นสุดการศึกษาดูงาน'}`,
!!val || `${'กรุณาเลือกวันที่วันสิ้นสุดการศึกษาดูงานในประเทศ'}`,
]"
>
<template v-slot:prepend>
@ -2012,12 +2044,12 @@ onMounted(() => {
outlined
lazy-rules
hide-bottom-space
label="ประเทศที่ไปศึกษาดูงาน"
label="ประเทศที่เดินทางไปศึกษาดูงาน"
class="inputgreen"
v-model="formBody.studyCountry"
:rules="[
(val: string) =>
!!val || `${'กรุณากรอประเทศที่ไปศึกษาดูงาน'}`,
!!val || `${'กรุณากรอประเทศที่เดินทางไปศึกษาดูงาน'}`,
]"
/>
</div>
@ -2147,6 +2179,217 @@ onMounted(() => {
</div>
</div>
</div>
<!-- เลอกท 5 -->
<div
class="col-12"
v-else-if="formBody.scholarshipType === 'RESEARCH'"
>
<div class="row q-col-gutter-md">
<div class="col-3">
<q-select
dense
outlined
lazy-rules
hide-bottom-space
class="inputgreen"
label="ประเภทการพัฒนา"
v-model="formBody.studyTopic"
:options="[
'ศึกษา',
'ฝึกอบรม',
'ประชุม',
'ดูงาน',
'ปฏิบัติการวิจัย',
]"
:rules="[
(val: string) =>
!!val || `${'กรุณากรอกประเภทการพัฒนา'}`,
]"
/>
</div>
<div class="col-3">
<q-input
dense
outlined
lazy-rules
hide-bottom-space
label="ระดับปริญญา"
class="inputgreen"
v-model="formBody.degreeLevel"
:rules="[
(val: string) =>
!!val || `${'กรุณากรอกระดับปริญญา'}`,
]"
/>
</div>
<div class="col-6">
<q-input
dense
outlined
lazy-rules
hide-bottom-space
class="inputgreen"
label="หลักสูตรการฝึกอบรม"
v-model="formBody.course"
:rules="[
(val: string) =>
!!val || `${'กรุณากรอกหลักสูตรการฝึกอบรม'}`,
]"
/>
</div>
<div class="col-3">
<q-input
dense
outlined
lazy-rules
hide-bottom-space
label="สาขาวิชา"
class="inputgreen"
v-model="formBody.field"
:rules="[
(val: string) =>
!!val || `${'กรุณากรอกสาขาวิชา'}`,
]"
/>
</div>
<div class="col-3">
<q-input
dense
outlined
lazy-rules
hide-bottom-space
label="คณะ"
class="inputgreen"
v-model="formBody.faculty"
:rules="[
(val: string) =>
!!val || `${'กรุณากรอกคณะ'}`,
]"
/>
</div>
<div class="col-6">
<q-input
dense
outlined
lazy-rules
hide-bottom-space
label="สถาบันการศึกษา/หน่วยงานผู้จัด"
class="inputgreen"
v-model="formBody.studyPlace"
:rules="[
(val: string) =>
!!val || `${'กรุณากรอกสถาบันการศึกษา/หน่วยงานผู้จัด'}`,
]"
/>
</div>
<div class="col-3">
<datepicker
menu-class-name="modalfix"
v-model="formBody.startDate"
:locale="'th'"
autoApply
:enableTimePicker="false"
week-start="0"
@update:model-value="changeStartDate('startDate')"
>
<template #year="{ year }">{{ year + 543 }}</template>
<template #year-overlay-value="{ value }">{{
parseInt(value + 543)
}}</template>
<template #trigger>
<q-input
dense
outlined
class="inputgreen"
:model-value="
formBody.startDate
? date2Thai(formBody.startDate)
: null
"
:label="`${'วันเริ่มต้นการฝึกอบรม'}`"
hide-bottom-space
:rules="[
(val: string) =>
!!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 class="col-3">
<datepicker
menu-class-name="modalfix"
v-model="formBody.endDate"
:locale="'th'"
autoApply
:enableTimePicker="false"
week-start="0"
:min-date="formBody.startDate"
>
<template #year="{ year }">{{ year + 543 }}</template>
<template #year-overlay-value="{ value }">{{
parseInt(value + 543)
}}</template>
<template #trigger>
<q-input
dense
outlined
class="inputgreen"
:model-value="
formBody.endDate ? date2Thai(formBody.endDate) : null
"
:label="`${'วันสิ้นสุดการฝึกอบรม'}`"
hide-bottom-space
:rules="[
(val: string) =>
!!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 class="col-6">
<q-input
dense
outlined
lazy-rules
hide-bottom-space
label="ประเทศที่ไปศึกษา ฝึกอบรม ประชุม ดูงาน และปฏิบัติการวิจัย"
class="inputgreen"
v-model="formBody.studyCountry"
:rules="[
(val: string) =>
!!val || `${'กรุณากรอกประเทศที่ไปศึกษา ฝึกอบรม ประชุม ดูงาน และปฏิบัติการวิจัย'}`,
]"
/>
</div>
</div>
</div>
</div>
</div>
@ -2276,12 +2519,12 @@ onMounted(() => {
outlined
lazy-rules
hide-bottom-space
label="สถานที่ไปศึกษาดูงาน"
label="สถานที่ไปศึกษาดูงานในประเทศ"
class="inputgreen"
v-model="formBody.studyPlace"
:rules="[
(val: string) =>
!!val || `${'กรุณากรอกสถานที่ไปศึกษาดูงาน'}`,
!!val || `${'กรุณากรอกสถานที่ไปศึกษาดูงานในประเทศ'}`,
]"
/>
</div>
@ -2291,12 +2534,12 @@ onMounted(() => {
outlined
lazy-rules
hide-bottom-space
label="หัวข้อการไปศึกษาดูงาน"
label="หัวข้อการไปศึกษาดูงานในประเทศ"
class="inputgreen"
v-model="formBody.studyTopic"
:rules="[
(val: string) =>
!!val || `${'กรุณากรอกหัวข้อการไปศึกษาดูงาน'}`,
!!val || `${'กรุณากรอกหัวข้อการไปศึกษาดูงานในประเทศ'}`,
]"
/>
</div>
@ -2324,11 +2567,11 @@ onMounted(() => {
? date2Thai(formBody.studyStartDate)
: null
"
:label="`${'วันเริ่มต้นการศึกษาดูงาน'}`"
:label="`${'วันเริ่มต้นการศึกษาดูงานในประเทศ'}`"
hide-bottom-space
:rules="[
(val: string) =>
!!val || `${'กรุณาเลือกวันเริ่มต้นการศึกษาดูงาน'}`,
!!val || `${'กรุณาเลือกวันเริ่มต้นการศึกษาดูงานในประเทศ'}`,
]"
>
<template v-slot:prepend>
@ -2373,11 +2616,11 @@ onMounted(() => {
? date2Thai(formBody.studyEndDate)
: null
"
:label="`${'วันสิ้นสุดการศึกษาดูงาน'}`"
:label="`${'วันสิ้นสุดการศึกษาดูงานในประเทศ'}`"
hide-bottom-space
:rules="[
(val: string) =>
!!val || `${'กรุณาเลือกวันที่วันสิ้นสุดการศึกษาดูงาน'}`,
!!val || `${'กรุณาเลือกวันที่วันสิ้นสุดการศึกษาดูงานในประเทศ'}`,
]"
>
<template v-slot:prepend>
@ -2521,12 +2764,12 @@ onMounted(() => {
outlined
lazy-rules
hide-bottom-space
label="รวมระยะเวลาในการศึกษา"
label="รวมระยะเวลาในการฝึกอบรม "
class="inputgreen"
v-model="formBody.totalPeriod"
:rules="[
(val: string) =>
!!val || `${'กรุณากรอกรวมระยะเวลาในการศึกษา'}`,
!!val || `${'กรุณากรอกรวมระยะเวลาในการฝึกอบรม '}`,
]"
/>
</div>

View file

@ -9,6 +9,11 @@ interface FormsSholarship {
posExecutive: string; //ชื่อตำแหน่งทางการบริหาร
posLevelId: string | null; //ไอดีระดับตำแหน่ง
posTypeId: string | null; //ไอดีประเภทตำแหน่ง
org: string;
rootId: string | null;
root: string;
orgRootShortName: string;
orgRevisionId: string | null;
guarantorRank: string; //ยศ(ผู้ค้ำ)
guarantorPrefix: string; //คำนำหน้าชื่อ(ผู้ค้ำ)
guarantorFirstName: string; //ชื่อ(ผู้ค้ำ)

View file

@ -20,6 +20,7 @@ interface DataSholarship {
posTypeId: string; //ไอดีประเภทตำแหน่ง
posTypeName: string; //ไอดีระดับตำแหน่ง
posLevelName: string; //ไอดีประเภทตำแหน่ง
org: string;
guarantorRank: string; //ยศ(ผู้ค้ำ)
guarantorPrefix: string; //คำนำหน้าชื่อ(ผู้ค้ำ)
guarantorFirstName: string; //ชื่อ(ผู้ค้ำ)