653 lines
25 KiB
Vue
653 lines
25 KiB
Vue
<script setup lang="ts">
|
||
import DialogHeader from "@/components/DialogHeader.vue";
|
||
import { ref, reactive, watch, computed } from "vue";
|
||
import { useQuasar } from "quasar";
|
||
|
||
import http from "@/plugins/http";
|
||
import config from "@/app.config";
|
||
import { useRoute } from "vue-router";
|
||
import { useCounterMixin } from "@/stores/mixin";
|
||
|
||
import type {
|
||
DataOptionTechnique,
|
||
ProjectYearOp,
|
||
} from "@/modules/08_KPI/interface/index/Main";
|
||
|
||
const $q = useQuasar();
|
||
const mixin = useCounterMixin();
|
||
const {
|
||
showLoader,
|
||
hideLoader,
|
||
dialogConfirm,
|
||
messageError,
|
||
success,
|
||
dialogMessageNotify,
|
||
} = mixin;
|
||
|
||
const props = defineProps({
|
||
getAll: Function,
|
||
});
|
||
const route = useRoute();
|
||
const idKpi = ref<string>(route.params.id.toLocaleString());
|
||
|
||
const development = ref<string[]>([]); //ตัวแปรเก็บ ตัวเลือกการพัฒนา
|
||
const reasonDevelopment70 = ref<string>(""); //อื่นๆ การลงมือปฏิบัติ (โดยผู้บังคับบัญชามอบหมาย)
|
||
const reasonDevelopment20 = ref<string>(""); //อื่นๆ การเรียนรู้จากผู้อื่น (Coach/Mentor/Consulting)
|
||
const reasonDevelopment10 = ref<string>(""); //อื่นๆ การฝึกอบรมอื่นๆ
|
||
|
||
const choice = ref<string>("MANUAL"); //ตัวเลืออก กรอกเอง/เลือกในระบบ
|
||
const projectName = ref<any>(""); //ชื่อเรื่อง
|
||
const projectOp = ref<ProjectYearOp[]>([]); //ตัวเลือก โครงการ/หลักสูตรการฝึกอบรม
|
||
const projectOpMain = ref<ProjectYearOp[]>([]); //ตัวเลือก โครงการ/หลักสูตรการฝึกอบรม แสดง
|
||
const choiceOp = ref<DataOptionTechnique[]>([
|
||
{ value: "PROJECT", label: "เลือกจากโครงการ/หลักสูตรการฝึกอบรม" },
|
||
{ value: "MANUAL", label: "กรอกเอง" },
|
||
]);
|
||
|
||
const checkOtherBox11 = computed<boolean>(() => {
|
||
return development.value.includes("other1");
|
||
});
|
||
const checkOtherBox12 = computed<boolean>(() => {
|
||
return development.value.includes("other2");
|
||
});
|
||
const checkOtherBox13 = computed<boolean>(() => {
|
||
return development.value.includes("other3");
|
||
});
|
||
|
||
const isDevelopment70 = computed(() => {
|
||
return projectTechniquesOp1.value.some((txt) =>
|
||
development.value.includes(txt.value)
|
||
);
|
||
});
|
||
const isDevelopment20 = computed(() => {
|
||
return projectTechniquesOp2.value.some((txt) =>
|
||
development.value.includes(txt.value)
|
||
);
|
||
});
|
||
const isDevelopment10 = computed(() => {
|
||
return projectTechniquesOp3.value.some((txt) =>
|
||
development.value.includes(txt.value)
|
||
);
|
||
});
|
||
|
||
const modal = defineModel<boolean>("modal", { required: true });
|
||
const id = defineModel<string>("id", { required: true });
|
||
|
||
const formData = reactive<{
|
||
year: number | null;
|
||
name: string;
|
||
group: any[];
|
||
target: string;
|
||
isDevelopment70: boolean;
|
||
isDevelopment20: boolean;
|
||
isDevelopment10: boolean;
|
||
achievement10: string;
|
||
achievement5: string;
|
||
achievement0: string;
|
||
}>({
|
||
year: null,
|
||
name: "",
|
||
group: [],
|
||
target: "",
|
||
isDevelopment70: false,
|
||
isDevelopment20: false,
|
||
isDevelopment10: false,
|
||
achievement10: "มีผลการพัฒนาและมีการดำเนินการตามเป้าหมายการนำไปพัฒนางาน",
|
||
achievement5: "มีผลการพัฒนาแต่ยังไม่ได้ดำเนินการตามเป้าหมายการนำไปพัฒนางาน",
|
||
achievement0: "ไม่ได้ดำเนินการพัฒนา",
|
||
});
|
||
|
||
const projectTechniquesOp1 = ref<DataOptionTechnique[]>([
|
||
{
|
||
value: "on_the_job_training",
|
||
label: "การฝึกปฏิบัติในงาน (On the job training)",
|
||
},
|
||
{
|
||
value: "job_project_assignment",
|
||
label: "การมอบหมายงาน/โครงการ (Job/Project assignment)",
|
||
},
|
||
{
|
||
value: "job_shadowing",
|
||
label: "การติดตามเรียนรู้รูปแบบการทำงานของผู้บริหาร (Job shadowing)",
|
||
},
|
||
{
|
||
value: "job_enlargement",
|
||
label: "การมอบหมายงานเพิ่มขึ้น (Job enlargement)",
|
||
},
|
||
{
|
||
value: "internal_trainer",
|
||
label: "การเป็นวิทยากรภายในหน่วยงาน (Internal trainer)",
|
||
},
|
||
{ value: "rotation", label: "การหมุนเวียนงาน (Rotation)" },
|
||
{ value: "activity", label: "การทำกิจกรรม (Activity)" },
|
||
{ value: "site_visit", label: "การศึกษาดูงานนอกสถานที่ (Site visit)" },
|
||
{
|
||
value: "benchmarking",
|
||
label: "การแลกเปลี่ยน เทียบเคียงความรู้ ประสมการณ์ (Benchmarking)",
|
||
},
|
||
{ value: "problem_solving", label: "การแก้ปัญหา (Problem-solving)" },
|
||
{ value: "team_working", label: "การทำงานเป็นทีม (Team working)" },
|
||
{ value: "other1", label: "อื่นๆ (ระบุ)" },
|
||
]);
|
||
const projectTechniquesOp2 = ref<DataOptionTechnique[]>([
|
||
{ value: "coaching", label: "การสอนงาน (Coaching)" },
|
||
{ value: "mentoring", label: "การเป็นพี่เลี้ยง (Mentoring)" },
|
||
{ value: "team_meeting", label: "การประชุมทีม (Team meeting)" },
|
||
{ value: "consulting", label: "การให้คำปรึกษา (Consulting)" },
|
||
{ value: "feedback", label: "การให้ข้อคิดเห็น/เสนอแนะ (Feedback)" },
|
||
{ value: "other2", label: "อื่นๆ (ระบุ)" },
|
||
]);
|
||
|
||
const projectTechniquesOp3 = ref<DataOptionTechnique[]>([
|
||
{
|
||
value: "self_learning",
|
||
label: "การเรียนรู้ด้วยตนเอง แบบ online/offline (Self – learning)",
|
||
},
|
||
{ value: "classroom_training", label: "การฝึกอบรม (Classroom training)" },
|
||
{
|
||
value: "in_house_training",
|
||
label: "การฝึกอบรมภายในองค์กร (In – house training)",
|
||
},
|
||
{
|
||
value: "public_training",
|
||
label: "การฝึกอบรมจากองค์กรภายนอก (Public training)",
|
||
},
|
||
{
|
||
value: "e_training",
|
||
label: "การฝึกอบรมผ่าน online (e – training / e – learning)",
|
||
},
|
||
{ value: "meeting", label: "การประชุม (Meeting)" },
|
||
{ value: "seminar", label: "การสัมมนา (Seminar)" },
|
||
{ value: "other3", label: "อื่นๆ (ระบุ)" },
|
||
]);
|
||
|
||
/** ปิด Dialog */
|
||
function close() {
|
||
modal.value = false;
|
||
id.value = "";
|
||
development.value = [];
|
||
formData.name = "";
|
||
formData.group = [];
|
||
formData.target = "";
|
||
reasonDevelopment70.value = "";
|
||
reasonDevelopment20.value = "";
|
||
reasonDevelopment10.value = "";
|
||
formData.achievement10 =
|
||
"มีผลการพัฒนาและมีการดำเนินการตามเป้าหมายการนำไปพัฒนางาน";
|
||
formData.achievement5 =
|
||
"มีผลการพัฒนาแต่ยังไม่ได้ดำเนินการตามเป้าหมายการนำไปพัฒนางาน";
|
||
formData.achievement0 = "ไม่ได้ดำเนินการพัฒนา";
|
||
|
||
choice.value = "MANUAL";
|
||
formData.year = null;
|
||
projectName.value = "";
|
||
reasonDevelopment70.value = "";
|
||
reasonDevelopment20.value = "";
|
||
reasonDevelopment10.value = "";
|
||
development.value = [];
|
||
|
||
props.getAll?.();
|
||
}
|
||
|
||
/** บันทึกข้อมูลการพัฒนาตน */
|
||
function onSubmit() {
|
||
if (
|
||
isDevelopment70.value == false &&
|
||
isDevelopment20.value == false &&
|
||
isDevelopment10.value == false
|
||
) {
|
||
dialogMessageNotify($q, "กรุณาเลือกวิธีการพัฒนา อย่างน้อย 1 ตัวเลือก");
|
||
} else {
|
||
dialogConfirm($q, () => {
|
||
const url = id.value
|
||
? config.API.kpiAchievementDevelop + `/${id.value}`
|
||
: config.API.kpiAchievementDevelop;
|
||
const body = {
|
||
name: formData.name,
|
||
target: formData.target,
|
||
achievement10: formData.achievement10,
|
||
achievement5: formData.achievement5,
|
||
achievement0: formData.achievement0,
|
||
isDevelopment70: isDevelopment70.value,
|
||
isDevelopment20: isDevelopment20.value,
|
||
isDevelopment10: isDevelopment10.value,
|
||
kpiUserEvaluationId: idKpi.value,
|
||
developmentProjects: development.value,
|
||
reasonDevelopment70: checkOtherBox11 ? reasonDevelopment70.value : "",
|
||
reasonDevelopment20: checkOtherBox12 ? reasonDevelopment20.value : "",
|
||
reasonDevelopment10: checkOtherBox13 ? reasonDevelopment10.value : "",
|
||
selectType: choice.value,
|
||
selectTypeYear: formData.year ? formData.year.toString() : null,
|
||
selectTypeId: projectName.value ? projectName.value.id : null,
|
||
};
|
||
showLoader();
|
||
http[id.value ? "put" : "post"](url, body)
|
||
.then((res) => {
|
||
success($q, "บันทึกข้อมูลสำเร็จ");
|
||
close();
|
||
})
|
||
.catch((e) => {
|
||
messageError($q, e);
|
||
})
|
||
.finally(() => {
|
||
hideLoader();
|
||
});
|
||
});
|
||
}
|
||
}
|
||
|
||
const customPosition = () => ({ top: "490px", left: "410px" });
|
||
|
||
async function getDataByYear() {
|
||
if (formData.year) {
|
||
showLoader();
|
||
http
|
||
.get(config.API.developmentMain + `/done?year=${formData.year}`)
|
||
.then(async (res) => {
|
||
const data = await res.data.result.data;
|
||
projectOpMain.value = data;
|
||
})
|
||
.catch((e) => {
|
||
messageError($q, e);
|
||
})
|
||
.finally(() => {
|
||
hideLoader();
|
||
});
|
||
}
|
||
}
|
||
|
||
function getProjectDetail(val: any) {
|
||
showLoader();
|
||
http
|
||
.get(config.API.developmentMain + `/tab3_1/${val.id}`)
|
||
.then((res) => {
|
||
const data = res.data.result;
|
||
formData.name = val.projectName;
|
||
formData.group = data.group;
|
||
formData.isDevelopment70 = data.isDevelopment70;
|
||
formData.isDevelopment20 = data.isDevelopment20;
|
||
formData.isDevelopment10 = data.isDevelopment10;
|
||
development.value = data.developmentProjectTechniqueActuals;
|
||
reasonDevelopment70.value =
|
||
data.developmentProjectTechniqueActuals.includes("other1")
|
||
? data.reasonDevelopment70
|
||
: "";
|
||
reasonDevelopment20.value =
|
||
data.developmentProjectTechniqueActuals.includes("other2")
|
||
? data.reasonDevelopment20
|
||
: "";
|
||
reasonDevelopment10.value =
|
||
data.developmentProjectTechniqueActuals.includes("other3")
|
||
? data.reasonDevelopment10
|
||
: "";
|
||
})
|
||
.catch((e) => {
|
||
messageError($q, e);
|
||
})
|
||
.finally(() => {
|
||
hideLoader();
|
||
});
|
||
}
|
||
|
||
/**
|
||
* function ค้นหาข้อมูลใน option
|
||
* @param val คำค้นหา
|
||
* @param update function
|
||
*/
|
||
function filterOptionFn(val: string, update: Function) {
|
||
projectName.value = "";
|
||
update(() => {
|
||
projectOp.value = projectOpMain.value.filter(
|
||
(e: any) => e.projectName.search(val) !== -1
|
||
);
|
||
});
|
||
}
|
||
|
||
watch(
|
||
() => id.value,
|
||
(i) => {
|
||
if (i) {
|
||
showLoader();
|
||
http
|
||
.get(config.API.kpiAchievementDevelop + `/${id.value}`)
|
||
.then(async (res) => {
|
||
const data = res.data.result;
|
||
formData.year = data.selectTypeYear;
|
||
await getDataByYear();
|
||
setTimeout(() => {
|
||
choice.value = data.selectType;
|
||
projectName.value = projectOpMain.value.find(
|
||
(i: any) => i.id == data.selectTypeId
|
||
);
|
||
formData.name = data.name;
|
||
formData.group = data.group;
|
||
formData.target = data.target;
|
||
formData.isDevelopment70 = data.isDevelopment70;
|
||
formData.isDevelopment20 = data.isDevelopment20;
|
||
formData.isDevelopment10 = data.isDevelopment10;
|
||
formData.achievement10 = data.achievement10;
|
||
formData.achievement5 = data.achievement5;
|
||
formData.achievement0 = data.achievement0;
|
||
development.value = data.developmentProjects;
|
||
reasonDevelopment70.value = data.developmentProjects.includes(
|
||
"other1"
|
||
)
|
||
? data.reasonDevelopment70
|
||
: "";
|
||
reasonDevelopment20.value = data.developmentProjects.includes(
|
||
"other2"
|
||
)
|
||
? data.reasonDevelopment20
|
||
: "";
|
||
reasonDevelopment10.value = data.developmentProjects.includes(
|
||
"other3"
|
||
)
|
||
? data.reasonDevelopment10
|
||
: "";
|
||
}, 500);
|
||
})
|
||
.catch((e) => {
|
||
messageError($q, e);
|
||
})
|
||
.finally(() => {
|
||
hideLoader();
|
||
});
|
||
}
|
||
}
|
||
);
|
||
</script>
|
||
<template>
|
||
<q-dialog persistent v-model="modal">
|
||
<q-card style="min-width: 80vw">
|
||
<q-form greedy @submit.prevent @validation-success="onSubmit">
|
||
<DialogHeader
|
||
:tittle="`${id ? 'แก้ไข' : 'เพิ่ม'}การพัฒนาตนเอง`"
|
||
:close="close"
|
||
/>
|
||
<q-separator />
|
||
<q-card-section style="max-height: 70vh" class="scroll">
|
||
<div class="row q-col-gutter-sm">
|
||
<div class="col-3">
|
||
<q-select
|
||
class="inputgreen"
|
||
outlined
|
||
dense
|
||
label="ตัวเลือก"
|
||
:options="choiceOp"
|
||
emit-value
|
||
map-options
|
||
option-label="label"
|
||
option-value="value"
|
||
v-model="choice"
|
||
>
|
||
</q-select>
|
||
</div>
|
||
<div class="col-3" v-if="choice == 'PROJECT'">
|
||
<datepicker
|
||
menu-class-name="modalfix"
|
||
v-model="formData.year"
|
||
:locale="'th'"
|
||
autoApply
|
||
position="center"
|
||
year-picker
|
||
:alt-position="customPosition"
|
||
:enableTimePicker="false"
|
||
@update:model-value="getDataByYear(), (projectName = '')"
|
||
>
|
||
<template #year="{ year }">{{ year + 543 }}</template>
|
||
<template #year-overlay-value="{ value }">{{
|
||
parseInt(value + 543)
|
||
}}</template>
|
||
<template #trigger>
|
||
<q-input
|
||
dense
|
||
outlined
|
||
hide-bottom-space
|
||
:rules="[(val:string) => !!val || `${'กรุณาเลือกปีงบประมาณ'}`,]"
|
||
class="inputgreen"
|
||
:model-value="
|
||
formData.year === null
|
||
? null
|
||
: Number(formData.year) + 543
|
||
"
|
||
:label="`${'ปีงบประมาณ'}`"
|
||
>
|
||
<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" v-if="choice == 'PROJECT'">
|
||
<q-select
|
||
outlined
|
||
dense
|
||
:rules="[(val:string) => !!val || `${'กรุณาเลือกโครงการ/หลักสูตรการฝึกอบรม'}`,]"
|
||
class="inputgreen"
|
||
label="โครงการ/หลักสูตรการฝึกอบรม"
|
||
:options="projectOp"
|
||
option-label="projectName"
|
||
option-value="id"
|
||
map-options
|
||
hide-bottom-space
|
||
use-input
|
||
:readonly="!formData.year"
|
||
v-model="projectName"
|
||
@update:model-value="getProjectDetail(projectName)"
|
||
@filter="filterOptionFn"
|
||
>
|
||
<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">
|
||
<q-input
|
||
v-model="formData.name"
|
||
outlined
|
||
dense
|
||
:rules="[(val:string) => !!val || `${'กรุณากรอกชื่อเรื่อง/เนื้อเรื่อง/หัวข้อการพัฒนา'}`,]"
|
||
lazy-rules
|
||
hide-bottom-space
|
||
class="inputgreen"
|
||
label="ชื่อเรื่อง/เนื้อเรื่อง/หัวข้อการพัฒนา"
|
||
>
|
||
</q-input>
|
||
</div>
|
||
<div class="col-12">
|
||
<span class="text-weight-medium">วิธีการพัฒนา</span>
|
||
</div>
|
||
<div class="row q-col-gutter-md full-width">
|
||
<div class="col-12 col-sm-6 col-md-6 col-lg-4">
|
||
<span class="text-weight-medium"
|
||
>70 การลงมือปฏิบัติ (โดยผู้บังคับบัญชามอบหมาย)</span
|
||
>
|
||
<q-option-group
|
||
class="check_box q-mt-sm"
|
||
keep-color
|
||
color="primary"
|
||
dense
|
||
v-model="development"
|
||
:options="projectTechniquesOp1"
|
||
type="checkbox"
|
||
/>
|
||
<div class="row q-pb-md" v-if="checkOtherBox11">
|
||
<div class="offset-4 col-8 q-mt-sm relative-position">
|
||
<div class="other_custom_input">
|
||
<q-input
|
||
v-model="reasonDevelopment70"
|
||
dense
|
||
outlined
|
||
class="inputgreen"
|
||
label="กรุณาระบุ"
|
||
></q-input>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-12 col-sm-6 col-md-6 col-lg-4">
|
||
<span class="text-weight-medium"
|
||
>20 การเรียนรู้จากผู้อื่น (Coach/Mentor/Consulting)</span
|
||
>
|
||
<q-option-group
|
||
class="check_box q-mt-sm"
|
||
keep-color
|
||
color="primary"
|
||
dense
|
||
v-model="development"
|
||
:options="projectTechniquesOp2"
|
||
type="checkbox"
|
||
/>
|
||
<div class="row q-pb-md" v-if="checkOtherBox12">
|
||
<div class="offset-4 col-8 q-mt-sm relative-position">
|
||
<div class="other_custom_input">
|
||
<q-input
|
||
v-model="reasonDevelopment20"
|
||
dense
|
||
outlined
|
||
class="inputgreen"
|
||
label="กรุณาระบุ"
|
||
></q-input>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-12 col-sm-6 col-md-6 col-lg-4">
|
||
<span class="text-weight-medium">10 การฝึกอบรมอื่นๆ</span>
|
||
<q-option-group
|
||
class="check_box q-mt-sm"
|
||
keep-color
|
||
color="primary"
|
||
dense
|
||
v-model="development"
|
||
:options="projectTechniquesOp3"
|
||
type="checkbox"
|
||
/>
|
||
<div class="row q-pb-md" v-if="checkOtherBox13">
|
||
<div class="offset-4 col-8 q-mt-sm relative-position">
|
||
<div class="other_custom_input">
|
||
<q-input
|
||
v-model="reasonDevelopment10"
|
||
dense
|
||
outlined
|
||
class="inputgreen"
|
||
label="กรุณาระบุ"
|
||
></q-input>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-12">
|
||
<q-input
|
||
label="เป้าหมายการนำไปพัฒนางาน"
|
||
v-model="formData.target"
|
||
outlined
|
||
type="textarea"
|
||
dense
|
||
class="inputgreen"
|
||
:rules="[(val:string) => !!val || `${'กรุณากรอกเป้าหมายการนำไปพัฒนางาน'}`,]"
|
||
lazy-rules
|
||
hide-bottom-space
|
||
></q-input>
|
||
</div>
|
||
<div class="col-12">
|
||
<q-card bordered>
|
||
<div class="bg-grey-2 row q-py-sm text-weight-bold col-12">
|
||
<div class="col-4 text-center">
|
||
<span>ระดับคะแนน</span>
|
||
</div>
|
||
<div class="col-8 text-start">
|
||
<span>เกณฑ์การประเมิน</span>
|
||
</div>
|
||
</div>
|
||
<div class="row q-pa-sm">
|
||
<div class="col-4 text-center self-start text-body1">
|
||
<span>10</span>
|
||
</div>
|
||
<div class="col-8">
|
||
<q-input
|
||
class="inputgreen"
|
||
v-model="formData.achievement10"
|
||
outlined
|
||
dense
|
||
label="เกณฑ์การประเมิน"
|
||
:rules="[(val:string) => !!val || `${'กรุณากรอกเกณฑ์การประเมิน'}`,]"
|
||
lazy-rules
|
||
hide-bottom-space
|
||
></q-input>
|
||
</div>
|
||
</div>
|
||
<q-separator />
|
||
<div class="row q-pa-sm bg-grey-2">
|
||
<div class="col-4 text-center self-start text-body1">
|
||
<span>5</span>
|
||
</div>
|
||
<div class="col-8">
|
||
<q-input
|
||
class="inputgreen"
|
||
v-model="formData.achievement5"
|
||
outlined
|
||
dense
|
||
label="เกณฑ์การประเมิน"
|
||
:rules="[(val:string) => !!val || `${'กรุณากรอกเกณฑ์การประเมิน'}`,]"
|
||
lazy-rules
|
||
hide-bottom-space
|
||
></q-input>
|
||
</div>
|
||
</div>
|
||
<q-separator />
|
||
<div class="row q-pa-sm">
|
||
<div class="col-4 text-center self-start text-body1">
|
||
<span>0</span>
|
||
</div>
|
||
<div class="col-8">
|
||
<q-input
|
||
class="inputgreen"
|
||
v-model="formData.achievement0"
|
||
outlined
|
||
dense
|
||
label="เกณฑ์การประเมิน"
|
||
:rules="[(val:string) => !!val || `${'กรุณากรอกเกณฑ์การประเมิน'}`,]"
|
||
lazy-rules
|
||
hide-bottom-space
|
||
></q-input>
|
||
</div>
|
||
</div>
|
||
</q-card>
|
||
</div>
|
||
</div>
|
||
</q-card-section>
|
||
|
||
<q-separator />
|
||
|
||
<q-card-actions align="right" class="bg-white text-teal">
|
||
<q-btn label="บันทึก" color="secondary" type="submit"
|
||
><q-tooltip>บันทึกข้อมูล</q-tooltip></q-btn
|
||
>
|
||
</q-card-actions>
|
||
</q-form>
|
||
</q-card>
|
||
</q-dialog>
|
||
</template>
|
||
<style scoped>
|
||
:deep(.check_box .q-checkbox) {
|
||
align-items: start;
|
||
}
|
||
|
||
.other_custom_input {
|
||
position: absolute;
|
||
top: -25px;
|
||
width: 100%;
|
||
}
|
||
</style>
|