735 lines
22 KiB
Vue
735 lines
22 KiB
Vue
<script setup lang="ts">
|
|
import { useCounterMixin } from "@/stores/mixin";
|
|
import { useEditPosDataStore } from "@/modules/04_registryPerson/stores/Edit";
|
|
|
|
import type { DataOption } from "@/modules/04_registryPerson/interface/index/Main";
|
|
import type { FormDataSalary } from "@/modules/04_registryPerson/interface/request/Edit";
|
|
|
|
const { date2Thai } = useCounterMixin();
|
|
const store = useEditPosDataStore();
|
|
|
|
const isReadonly = defineModel<boolean>("isReadonly", { required: true });
|
|
const empType = defineModel<string>("empType", { required: true });
|
|
const formData = defineModel<FormDataSalary>("formData", { required: true });
|
|
const commandCodeOptions = defineModel<DataOption[]>("commandCodeOptions", {
|
|
required: true,
|
|
});
|
|
const posTypeOptions = defineModel<DataOption[]>("posTypeOptions", {
|
|
required: true,
|
|
});
|
|
const posLevelOptions = defineModel<DataOption[]>("posLevelOptions", {
|
|
required: true,
|
|
});
|
|
const posLineOptions = defineModel<DataOption[]>("posLineOptions", {
|
|
required: true,
|
|
});
|
|
const posPathSideOptions = defineModel<DataOption[]>("posPathSideOptions", {
|
|
required: true,
|
|
});
|
|
const posExecutiveOptions = defineModel<DataOption[]>("posExecutiveOptions", {
|
|
required: true,
|
|
});
|
|
|
|
const props = defineProps({
|
|
updateSelectType: { type: Function, defult: () => {} },
|
|
});
|
|
|
|
/**
|
|
* ฟิลเตอร์ข้อมูลจาก input
|
|
* @param val ค่าที่ป้อนให้ input
|
|
* @param update function จาก quasar
|
|
* @param filtername type ที่กำหนด ของ input นั้นๆ
|
|
*/
|
|
function filterSelector(val: string, update: Function, filtername: string) {
|
|
switch (filtername) {
|
|
case "commandCode":
|
|
update(() => {
|
|
commandCodeOptions.value = store.commandCodeData.filter(
|
|
(v: DataOption) => v.name.indexOf(val) > -1
|
|
);
|
|
});
|
|
break;
|
|
|
|
case "posType":
|
|
update(() => {
|
|
posTypeOptions.value = store.posTypeData.filter(
|
|
(v: DataOption) => v.name.indexOf(val) > -1
|
|
);
|
|
});
|
|
break;
|
|
|
|
case "posLevel":
|
|
update(() => {
|
|
posLevelOptions.value = store.posLevelData.filter(
|
|
(v: DataOption) => v.name.indexOf(val) > -1
|
|
);
|
|
});
|
|
break;
|
|
|
|
case "posLine":
|
|
update(() => {
|
|
posLineOptions.value = store.posLineData.filter(
|
|
(v: DataOption) => v.name.indexOf(val) > -1
|
|
);
|
|
});
|
|
break;
|
|
|
|
case "posPathSide":
|
|
update(() => {
|
|
posPathSideOptions.value = store.posPathSideData.filter(
|
|
(v: DataOption) => v.name.indexOf(val) > -1
|
|
);
|
|
});
|
|
break;
|
|
|
|
case "posExecutive":
|
|
update(() => {
|
|
posExecutiveOptions.value = store.posExecutiveData.filter(
|
|
(v: DataOption) => v.name.indexOf(val) > -1
|
|
);
|
|
});
|
|
break;
|
|
|
|
default:
|
|
break;
|
|
}
|
|
}
|
|
|
|
function classInput(val: boolean) {
|
|
return {
|
|
"full-width cursor-pointer": val,
|
|
"full-width inputgreen cursor-pointer": !val,
|
|
};
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div class="row col-12 q-col-gutter-sm">
|
|
<div class="col-xs-12 col-sm-6 col-md-8">
|
|
<!-- :rules="[(val: string) => !!val || 'กรุณาเลือกประเภทคำสั่ง']" -->
|
|
<q-select
|
|
outlined
|
|
:class="classInput(isReadonly)"
|
|
:readonly="isReadonly"
|
|
dense
|
|
lazy-rules
|
|
borderless
|
|
v-model="formData.commandCode"
|
|
:label="`${'ประเภทคำสั่ง'}`"
|
|
emit-value
|
|
map-options
|
|
option-label="name"
|
|
:options="commandCodeOptions"
|
|
option-value="id"
|
|
hide-bottom-space
|
|
use-input
|
|
hide-selected
|
|
fill-input
|
|
input-debounce="0"
|
|
@update:model-value="props.updateSelectType"
|
|
@filter="(inputValue: string,
|
|
doneFn: Function) => filterSelector(inputValue, doneFn, 'commandCode'
|
|
)"
|
|
>
|
|
<template v-slot:no-option>
|
|
<q-item>
|
|
<q-item-section class="text-grey"> ไม่มีข้อมูล </q-item-section>
|
|
</q-item>
|
|
</template>
|
|
</q-select>
|
|
</div>
|
|
|
|
<div class="col-xs-12 col-sm-6 col-md-4">
|
|
<!-- :rules="[ (val: string) => !!val || `${'กรุณาเลือกวันที่คำสั่งมีผล'}`, ]" -->
|
|
<datepicker
|
|
menu-class-name="modalfix"
|
|
:readonly="isReadonly"
|
|
v-model="formData.commandDateAffect"
|
|
:locale="'th'"
|
|
autoApply
|
|
:enableTimePicker="false"
|
|
week-start="0"
|
|
:class="classInput(isReadonly)"
|
|
>
|
|
<template #year="{ year }">{{ year + 543 }}</template>
|
|
<template #year-overlay-value="{ value }">{{
|
|
parseInt(value + 543)
|
|
}}</template>
|
|
<template #trigger>
|
|
<q-input
|
|
:readonly="isReadonly"
|
|
outlined
|
|
dense
|
|
borderless
|
|
:model-value="
|
|
formData.commandDateAffect
|
|
? date2Thai(formData.commandDateAffect)
|
|
: null
|
|
"
|
|
:label="`${'วันที่คำสั่งมีผล'}`"
|
|
hide-bottom-space
|
|
clearable
|
|
@clear="formData.commandDateAffect = null"
|
|
>
|
|
<template v-slot:prepend>
|
|
<q-icon name="event" color="primary" class="cursor-pointer">
|
|
</q-icon>
|
|
</template>
|
|
</q-input>
|
|
</template>
|
|
</datepicker>
|
|
</div>
|
|
|
|
<div class="col-xs-12 col-sm-6 col-md-8">
|
|
<q-input
|
|
:readonly="isReadonly"
|
|
:class="classInput(isReadonly)"
|
|
outlined
|
|
dense
|
|
lazy-rules
|
|
borderless
|
|
v-model="formData.posNumCodeSit"
|
|
hide-bottom-space
|
|
:label="`${'หน่วยงานที่ออกคำสั่ง'}`"
|
|
hint="*ชื่อเต็มหน่วยงานที่ออกคำสั่ง"
|
|
/>
|
|
</div>
|
|
|
|
<div class="col-xs-12 col-sm-6 col-md-4">
|
|
<q-input
|
|
:readonly="isReadonly"
|
|
:class="classInput(isReadonly)"
|
|
outlined
|
|
dense
|
|
lazy-rules
|
|
borderless
|
|
v-model="formData.posNumCodeSitAbb"
|
|
hide-bottom-space
|
|
:label="`${'ตัวย่อหน่วยงานที่ออกคำสั่ง'}`"
|
|
/>
|
|
</div>
|
|
|
|
<div class="col-xs-6 col-sm-12 col-md-8">
|
|
<div class="row q-col-gutter-sm">
|
|
<div class="col-6">
|
|
<q-input
|
|
:readonly="isReadonly"
|
|
:class="classInput(isReadonly)"
|
|
outlined
|
|
dense
|
|
lazy-rules
|
|
borderless
|
|
v-model="formData.commandNo"
|
|
hide-bottom-space
|
|
:label="`${'เลขที่คำสั่ง'}`"
|
|
/>
|
|
</div>
|
|
<label class="col-1 flex justify-center items-center">/</label>
|
|
<div class="col-5">
|
|
<!-- :rules="[(val:string) => !!val || `${'กรุณากรอก พ.ศ.'}`]" -->
|
|
<datepicker
|
|
menu-class-name="modalfix"
|
|
v-model="formData.commandYear"
|
|
:locale="'th'"
|
|
autoApply
|
|
year-picker
|
|
:enableTimePicker="false"
|
|
:class="classInput(isReadonly)"
|
|
:readonly="isReadonly"
|
|
>
|
|
<template #year="{ year }">{{ year + 543 }}</template>
|
|
<template #year-overlay-value="{ value }">{{
|
|
parseInt(value + 543)
|
|
}}</template>
|
|
<template #trigger>
|
|
<q-input
|
|
:readonly="isReadonly"
|
|
dense
|
|
outlined
|
|
hide-bottom-space
|
|
:model-value="
|
|
formData.commandYear == null
|
|
? null
|
|
: formData.commandYear + 543
|
|
"
|
|
:label="`${'พ.ศ.'}`"
|
|
clearable
|
|
@clear="formData.commandYear = 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>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-xs-6 col-sm-6 col-md-4">
|
|
<!-- :rules="[ (val: string) => !!val || `${'กรุณาเลือก วันที่ลงนาม'}`,]" -->
|
|
<datepicker
|
|
menu-class-name="modalfix"
|
|
v-model="formData.commandDateSign"
|
|
:locale="'th'"
|
|
autoApply
|
|
:enableTimePicker="false"
|
|
week-start="0"
|
|
:class="classInput(isReadonly)"
|
|
:readonly="isReadonly"
|
|
>
|
|
<template #year="{ year }">{{ year + 543 }}</template>
|
|
<template #year-overlay-value="{ value }">{{
|
|
parseInt(value + 543)
|
|
}}</template>
|
|
<template #trigger>
|
|
<q-input
|
|
:readonly="isReadonly"
|
|
outlined
|
|
dense
|
|
borderless
|
|
:model-value="
|
|
formData.commandDateSign
|
|
? date2Thai(formData.commandDateSign)
|
|
: null
|
|
"
|
|
:label="`${'วันที่ลงนาม'}`"
|
|
hide-bottom-space
|
|
clearable
|
|
@clear="formData.commandDateSign = null"
|
|
>
|
|
<template v-slot:prepend>
|
|
<q-icon name="event" color="primary" class="cursor-pointer">
|
|
</q-icon>
|
|
</template>
|
|
</q-input>
|
|
</template>
|
|
</datepicker>
|
|
</div>
|
|
|
|
<div class="col-12">
|
|
<q-separator />
|
|
</div>
|
|
|
|
<div class="col-xs-6 col-sm-6 col-md-4">
|
|
<q-input
|
|
:class="classInput(isReadonly)"
|
|
:readonly="isReadonly"
|
|
outlined
|
|
dense
|
|
lazy-rules
|
|
borderless
|
|
v-model="formData.posNoAbb"
|
|
hide-bottom-space
|
|
:label="`${'ตัวย่อ'}`"
|
|
>
|
|
</q-input>
|
|
</div>
|
|
|
|
<div class="col-xs-6 col-sm-6 col-md-4">
|
|
<!-- :rules="[(val: string) => !!val || `${'กรุณากรอกตำแหน่งเลขที่'}`]" -->
|
|
<q-input
|
|
:class="classInput(isReadonly)"
|
|
:readonly="isReadonly"
|
|
outlined
|
|
dense
|
|
lazy-rules
|
|
borderless
|
|
v-model="formData.posNo"
|
|
hide-bottom-space
|
|
:label="empType === 'officer' ? 'เลขที่ตำแหน่ง' : 'ตำแหน่งเลขที่'"
|
|
>
|
|
</q-input>
|
|
</div>
|
|
|
|
<div class="col-xs-12 col-sm-6 col-md-4">
|
|
<!-- :rules="empType == '' ? [(val: string) => !!val || 'กรุณากรอกตำแหน่งในสายงาน' ] : [(val: string) => !!val || 'กรุณากรอกตำแหน่ง']" -->
|
|
<q-input
|
|
:class="classInput(isReadonly)"
|
|
:readonly="isReadonly"
|
|
outlined
|
|
dense
|
|
lazy-rules
|
|
borderless
|
|
v-model="formData.positionName"
|
|
:label="empType === 'officer' ? 'ตำแหน่งในสายงาน' : 'ตำแหน่ง'"
|
|
hide-bottom-space
|
|
/>
|
|
</div>
|
|
|
|
<div class="col-xs-6 col-sm-6 col-md-4">
|
|
<!-- :rules="empType == '' ? [(val: string) => !!val || 'กรุณาเลือกประเภทตำแหน่ง' ]:[(val: string) => !!val || 'กรุณาเลือกกลุ่มงาน' ]" -->
|
|
<q-select
|
|
outlined
|
|
:class="classInput(isReadonly)"
|
|
:readonly="isReadonly"
|
|
dense
|
|
lazy-rules
|
|
borderless
|
|
v-model="formData.positionType"
|
|
:label="empType === 'officer' ? 'ตำแหน่งประเภท' : 'กลุ่มงาน'"
|
|
emit-value
|
|
map-options
|
|
option-label="name"
|
|
:options="posTypeOptions"
|
|
option-value="name"
|
|
hide-bottom-space
|
|
use-input
|
|
hide-selected
|
|
fill-input
|
|
clearable
|
|
input-debounce="0"
|
|
@update:model-value="props.updateSelectType"
|
|
@filter="(inputValue: string,
|
|
doneFn: Function) => filterSelector(inputValue, doneFn, 'posType'
|
|
)"
|
|
>
|
|
<template v-slot:no-option>
|
|
<q-item>
|
|
<q-item-section class="text-grey"> ไม่มีข้อมูล </q-item-section>
|
|
</q-item>
|
|
</template>
|
|
</q-select>
|
|
</div>
|
|
|
|
<div class="col-xs-6 col-sm-6 col-md-4">
|
|
<!-- :rules="empType == '' ? [(val: string) => !!val || 'กรุณาเลือกระดับตำแหน่ง' ] : [(val: string) => !!val || 'กรุณาเลือกระดับชั้นงาน']" -->
|
|
<q-select
|
|
:class="classInput(isReadonly)"
|
|
:readonly="isReadonly"
|
|
:disable="!formData.positionType"
|
|
outlined
|
|
dense
|
|
lazy-rules
|
|
borderless
|
|
v-model="formData.positionLevel"
|
|
:label="empType === 'officer' ? 'ระดับตำแหน่ง' : 'ระดับชั้นงาน'"
|
|
emit-value
|
|
map-options
|
|
option-label="name"
|
|
:options="posLevelOptions"
|
|
option-value="name"
|
|
hide-bottom-space
|
|
use-input
|
|
hide-selected
|
|
fill-input
|
|
input-debounce="0"
|
|
@filter="(inputValue: string,
|
|
doneFn: Function) => filterSelector(inputValue, doneFn, 'posLevel'
|
|
)"
|
|
><template v-slot:no-option>
|
|
<q-item>
|
|
<q-item-section class="text-grey"> ไม่มีข้อมูล </q-item-section>
|
|
</q-item>
|
|
</template>
|
|
</q-select>
|
|
</div>
|
|
|
|
<div class="col-xs-6 col-sm-6 col-md-4" v-if="empType === 'officer'">
|
|
<q-input
|
|
:class="classInput(isReadonly)"
|
|
:readonly="isReadonly"
|
|
outlined
|
|
dense
|
|
lazy-rules
|
|
borderless
|
|
v-model="formData.positionCee"
|
|
hide-bottom-space
|
|
:label="`${'ระดับซี'}`"
|
|
>
|
|
</q-input>
|
|
</div>
|
|
|
|
<div class="col-xs-6 col-sm-6 col-md-4" v-if="empType === 'officer'">
|
|
<q-input
|
|
:class="classInput(isReadonly)"
|
|
:readonly="isReadonly"
|
|
outlined
|
|
dense
|
|
lazy-rules
|
|
borderless
|
|
v-model="formData.positionLine"
|
|
hide-bottom-space
|
|
:label="`${'สายงาน'}`"
|
|
/>
|
|
<!-- <q-select
|
|
outlined
|
|
:class="classInput(isReadonly)"
|
|
:readonly="isReadonly"
|
|
dense
|
|
lazy-rules
|
|
borderless
|
|
v-model="formData.positionLine"
|
|
:label="`${'สายงาน'}`"
|
|
emit-value
|
|
map-options
|
|
option-label="name"
|
|
:options="posLineOptions"
|
|
option-value="id"
|
|
hide-bottom-space
|
|
use-input
|
|
hide-selected
|
|
fill-input
|
|
clearable
|
|
input-debounce="0"
|
|
@filter="(inputValue: string,
|
|
doneFn: Function) => filterSelector(inputValue, doneFn, 'posLine'
|
|
)"
|
|
>
|
|
<template v-slot:no-option>
|
|
<q-item>
|
|
<q-item-section class="text-grey"> ไม่มีข้อมูล </q-item-section>
|
|
</q-item>
|
|
</template></q-select
|
|
> -->
|
|
</div>
|
|
|
|
<div class="col-xs-6 col-sm-6 col-md-4" v-if="empType === 'officer'">
|
|
<q-input
|
|
:class="classInput(isReadonly)"
|
|
:readonly="isReadonly"
|
|
outlined
|
|
dense
|
|
lazy-rules
|
|
borderless
|
|
v-model="formData.positionPathSide"
|
|
hide-bottom-space
|
|
:label="`${'ด้าน/สาขา'}`"
|
|
/>
|
|
<!-- <q-select
|
|
:class="classInput(isReadonly)"
|
|
:readonly="isReadonly"
|
|
outlined
|
|
dense
|
|
lazy-rules
|
|
borderless
|
|
v-model="formData.positionPathSide"
|
|
:label="`${'ด้าน/สาขา'}`"
|
|
emit-value
|
|
map-options
|
|
option-label="name"
|
|
:options="posPathSideOptions"
|
|
option-value="id"
|
|
hide-bottom-space
|
|
use-input
|
|
hide-selected
|
|
fill-input
|
|
clearable
|
|
input-debounce="0"
|
|
@filter="(inputValue: string,
|
|
doneFn: Function) => filterSelector(inputValue, doneFn, 'posPathSide'
|
|
)"
|
|
>
|
|
<template v-slot:no-option>
|
|
<q-item>
|
|
<q-item-section class="text-grey"> ไม่มีข้อมูล </q-item-section>
|
|
</q-item>
|
|
</template>
|
|
</q-select> -->
|
|
</div>
|
|
|
|
<div class="col-xs-6 col-sm-6 col-md-4" v-if="empType === 'officer'">
|
|
<q-input
|
|
:class="classInput(isReadonly)"
|
|
:readonly="isReadonly"
|
|
outlined
|
|
dense
|
|
lazy-rules
|
|
borderless
|
|
v-model="formData.positionExecutive"
|
|
hide-bottom-space
|
|
:label="`${'ตำแหน่งทางการบริหาร'}`"
|
|
/>
|
|
<!-- <q-select
|
|
:class="classInput(isReadonly)"
|
|
:readonly="isReadonly"
|
|
outlined
|
|
dense
|
|
lazy-rules
|
|
borderless
|
|
v-model="formData.positionExecutive"
|
|
:label="`${'ตำแหน่งทางการบริหาร'}`"
|
|
emit-value
|
|
map-options
|
|
option-label="name"
|
|
:options="posExecutiveOptions"
|
|
option-value="id"
|
|
hide-bottom-space
|
|
use-input
|
|
hide-selected
|
|
fill-input
|
|
input-debounce="0"
|
|
clearable
|
|
@filter="(inputValue: string,
|
|
doneFn: Function) => filterSelector(inputValue, doneFn, 'posExecutive'
|
|
)"
|
|
>
|
|
<template v-slot:no-option>
|
|
<q-item>
|
|
<q-item-section class="text-grey"> ไม่มีข้อมูล </q-item-section>
|
|
</q-item>
|
|
</template>
|
|
</q-select> -->
|
|
</div>
|
|
|
|
<div class="col-12">
|
|
<div class="row q-col-gutter-sm">
|
|
<div class="col-xs-6 col-sm-6 col-md-4">
|
|
<q-input
|
|
:class="classInput(isReadonly)"
|
|
:readonly="isReadonly"
|
|
ref="salaryRef"
|
|
dense
|
|
outlined
|
|
v-model="formData.amount"
|
|
label="เงินเดือน"
|
|
mask="###,###,###,###"
|
|
reverse-fill-mask
|
|
lazy-rules
|
|
hide-bottom-space
|
|
/>
|
|
</div>
|
|
|
|
<div class="col-xs-6 col-sm-6 col-md-4">
|
|
<q-input
|
|
:class="classInput(isReadonly)"
|
|
:readonly="isReadonly"
|
|
ref="amountSpecialRef"
|
|
dense
|
|
outlined
|
|
v-model="formData.amountSpecial"
|
|
label="เงินค่าตอบแทนพิเศษ"
|
|
mask="###,###,###,###"
|
|
reverse-fill-mask
|
|
hide-bottom-space
|
|
/>
|
|
</div>
|
|
|
|
<div class="col-xs-6 col-sm-6 col-md-4">
|
|
<q-input
|
|
:class="classInput(isReadonly)"
|
|
:readonly="isReadonly"
|
|
dense
|
|
outlined
|
|
v-model="formData.positionSalaryAmount"
|
|
label="เงินประจำตำแหน่ง"
|
|
mask="###,###,###,###"
|
|
reverse-fill-mask
|
|
lazy-rules
|
|
hide-bottom-space
|
|
/>
|
|
</div>
|
|
|
|
<div class="col-xs-6 col-sm-6 col-md-4">
|
|
<q-input
|
|
:class="classInput(isReadonly)"
|
|
:readonly="isReadonly"
|
|
dense
|
|
outlined
|
|
v-model="formData.mouthSalaryAmount"
|
|
label="เงินค่าตอบแทนรายเดือน"
|
|
mask="###,###,###,###"
|
|
reverse-fill-mask
|
|
lazy-rules
|
|
hide-bottom-space
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-xs-12 col-sm-12 col-md-12">
|
|
<div class="row q-col-gutter-sm">
|
|
<div class="col-xs-12 col-sm-4 col-md-4">
|
|
<q-input
|
|
:class="classInput(isReadonly)"
|
|
:readonly="isReadonly"
|
|
outlined
|
|
dense
|
|
lazy-rules
|
|
borderless
|
|
v-model="formData.orgRoot"
|
|
hide-bottom-space
|
|
:label="`${'หน่วยงาน'}`"
|
|
/>
|
|
</div>
|
|
|
|
<div class="col-xs-12 col-sm-4 col-md-4">
|
|
<q-input
|
|
:class="classInput(isReadonly)"
|
|
:readonly="isReadonly"
|
|
outlined
|
|
dense
|
|
lazy-rules
|
|
borderless
|
|
v-model="formData.orgChild1"
|
|
hide-bottom-space
|
|
:label="`${'ส่วนราชการระดับ 1'}`"
|
|
/>
|
|
</div>
|
|
|
|
<div class="col-xs-12 col-sm-4 col-md-4">
|
|
<q-input
|
|
:class="classInput(isReadonly)"
|
|
:readonly="isReadonly"
|
|
outlined
|
|
dense
|
|
lazy-rules
|
|
borderless
|
|
v-model="formData.orgChild2"
|
|
hide-bottom-space
|
|
:label="`${'ส่วนราชการระดับ 2'}`"
|
|
/>
|
|
</div>
|
|
|
|
<div class="col-xs-12 col-sm-4 col-md-4">
|
|
<q-input
|
|
:class="classInput(isReadonly)"
|
|
:readonly="isReadonly"
|
|
outlined
|
|
dense
|
|
lazy-rules
|
|
borderless
|
|
v-model="formData.orgChild3"
|
|
hide-bottom-space
|
|
:label="`${'ส่วนราชการระดับ 3'}`"
|
|
/>
|
|
</div>
|
|
|
|
<div class="col-xs-12 col-sm-4 col-md-4">
|
|
<q-input
|
|
:class="classInput(isReadonly)"
|
|
:readonly="isReadonly"
|
|
outlined
|
|
dense
|
|
lazy-rules
|
|
borderless
|
|
v-model="formData.orgChild4"
|
|
hide-bottom-space
|
|
:label="`${'ส่วนราชการระดับ 4'}`"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-xs-12 col-sm-12 col-md-12">
|
|
<q-input
|
|
:class="classInput(isReadonly)"
|
|
:readonly="isReadonly"
|
|
ref="docRef"
|
|
outlined
|
|
dense
|
|
borderless
|
|
v-model="formData.remark"
|
|
:label="`${'หมายเหตุ'}`"
|
|
type="textarea"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped></style>
|