From 305c77e94aa6f4d91af4716531d913fc862dddbc Mon Sep 17 00:00:00 2001 From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" Date: Thu, 4 Apr 2024 14:42:13 +0700 Subject: [PATCH] =?UTF-8?q?UI=20=E0=B8=A3=E0=B8=B2=E0=B8=A2=E0=B8=81?= =?UTF-8?q?=E0=B8=B2=E0=B8=A3=E0=B8=82=E0=B9=89=E0=B8=B2=E0=B8=A3=E0=B8=B2?= =?UTF-8?q?=E0=B8=8A=E0=B8=81=E0=B8=B2=E0=B8=A3=E0=B8=AF=E0=B8=97=E0=B8=B5?= =?UTF-8?q?=E0=B9=88=E0=B9=84=E0=B8=94=E0=B9=89=E0=B8=A3=E0=B8=B1=E0=B8=9A?= =?UTF-8?q?=E0=B8=97=E0=B8=B8=E0=B8=99=E0=B8=81=E0=B8=B2=E0=B8=A3=E0=B8=A8?= =?UTF-8?q?=E0=B8=B6=E0=B8=81=E0=B8=A9=E0=B8=B2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../components/scholarship/DetailView.vue | 178 ++++++++++++++---- .../15_development/interface/index/Main.ts | 20 ++ 2 files changed, 162 insertions(+), 36 deletions(-) diff --git a/src/modules/15_development/components/scholarship/DetailView.vue b/src/modules/15_development/components/scholarship/DetailView.vue index 499e8eb9b..6faa2e29f 100644 --- a/src/modules/15_development/components/scholarship/DetailView.vue +++ b/src/modules/15_development/components/scholarship/DetailView.vue @@ -3,6 +3,13 @@ import { ref, reactive, onMounted } from "vue"; import { useQuasar } from "quasar"; import { useRouter, useRoute } from "vue-router"; +import type { + DataOption, + DataPerson, +} from "@/modules/15_development/interface/index/Main"; + +import DialogGov from "@/modules/15_development/components/history/DialogGov.vue"; + import { useCounterMixin } from "@/stores/mixin"; const $q = useQuasar(); @@ -11,37 +18,53 @@ const route = useRoute(); const { dialogConfirm, showLoader, hideLoader, date2Thai } = useCounterMixin(); const title = ref(route.params.id ? "แก้ไข" : "เพิ่ม"); +const modalDialogGov = ref(false); -const budgetSourceOp = ref(["แหล่งงบประมาณกทม", "แหล่งงบประมาณอื่นๆ"]); -const scholarshipTypeOp = ref([ - { id: "1", label: "การศึกษาในประเทศ" }, +const budgetSourceOp = ref([ + { id: "1", name: "แหล่งงบประมาณกทม" }, + { id: "2", name: "แหล่งงบประมาณอื่นๆ" }, +]); +const scholarshipTypeOp = ref([ + { id: "1", name: "การศึกษาในประเทศ" }, { id: "2", - label: - "ฝึกอบรมในประเทศที่ส่งไปพัฒนากับหน่วยวงานภายนอก (หลักสูตรที่ไม่มีการไปต่างประเทศ)", + name: "ฝึกอบรมในประเทศที่ส่งไปพัฒนากับหน่วยวงานภายนอก (หลักสูตรที่ไม่มีการไปต่างประเทศ)", }, { id: "3", - label: - "ฝึกอบรมในประเทศที่ส่งไปพัฒนากับหน่วยวงานภายนอก (หลักสูตรที่มีการไปต่างประเทศ)", + name: "ฝึกอบรมในประเทศที่ส่งไปพัฒนากับหน่วยวงานภายนอก (หลักสูตรที่มีการไปต่างประเทศ)", }, { id: "4", - label: - "ฝึกอบรมในประเทศที่ส่งไปพัฒนากับหน่วยวงานภายนอก (หลักสูตรประเภทนักบริหาร)", + name: "ฝึกอบรมในประเทศที่ส่งไปพัฒนากับหน่วยวงานภายนอก (หลักสูตรประเภทนักบริหาร)", }, ]); -const scholarshipTypeShortOp = ref(["ทุน 1 (ก)(ข)(ค)", "ทุน 2 (ก)(ข)"]); +const scholarshipTypeShortOp = ref([ + { id: "1", name: "ทุน 1 (ก)(ข)(ค)" }, + { id: "2", name: "ทุน 2 (ก)(ข)" }, +]); const isGov = ref(false); +const isGuarantor = ref(false); +const isSelectGov = ref(false); const dataPerson = reactive({ id: "", - citizenId: "123xxxxxxxxxx", - name: "นางสาวสาวิตรี ศรีสมัย", - position: "นักทรัพยากรบุคคล", - type: "ทั่วไป", - level: "ปฏิบัติงาน", - positionPath: "นักทรัพยากรบุคคล", + citizenId: "", + name: "", + position: "", + type: "", + level: "", + positionSide: "", + org: "-", +}); +const dataGuarantor = reactive({ + id: "", + citizenId: "", + name: "", + position: "", + type: "", + level: "", + positionSide: "", org: "-", }); const formData = reactive({ @@ -89,6 +112,35 @@ function changeTrainingDateStart() { } } +function onSelectGov(isGov: boolean) { + isSelectGov.value = isGov; + modalDialogGov.value = true; +} + +function upDate(data: DataPerson) { + if (isSelectGov.value) { + dataPerson.id = data.id ? data.id : "-"; + dataPerson.citizenId = data.citizenId ? data.citizenId : "-"; + dataPerson.name = data.name ? data.name : "-"; + dataPerson.position = data.position ? data.position : "-"; + dataPerson.type = data.type ? data.type : "-"; + dataPerson.level = data.level ? data.level : "-"; + dataPerson.positionSide = data.positionSide ? data.positionSide : "-"; + // dataPerson.org = data. + isGov.value = true; + } else { + dataGuarantor.id = data.id ? data.id : "-"; + dataGuarantor.citizenId = data.citizenId ? data.citizenId : "-"; + dataGuarantor.name = data.name ? data.name : "-"; + dataGuarantor.position = data.position ? data.position : "-"; + dataGuarantor.type = data.type ? data.type : "-"; + dataGuarantor.level = data.level ? data.level : "-"; + dataGuarantor.positionSide = data.positionSide ? data.positionSide : "-"; + // dataGuarantor.org = data. + isGuarantor.value = true; + } +} + onMounted(() => { isGov.value = route.params.id ? true : false; }); @@ -112,7 +164,14 @@ onMounted(() => {
ข้อมูลราชการ - + เพิ่ม
@@ -146,7 +205,7 @@ onMounted(() => {
ตำแหน่งทางการบริหาร
- {{ dataPerson.positionPath }} + {{ dataPerson.positionSide }}
หน่วยงานที่สังกัด
{{ dataPerson.org }}
@@ -178,6 +237,7 @@ onMounted(() => { { { { { { { lazy-rules v-model="formData.scholarshipType" :options="scholarshipTypeOp" - option-label="label" + option-label="name" option-value="id" emit-value map-options - input-class="text-red" + class="inputgreen" label="เลือกประเภททุน" :rules="[ (val:string) => !!val || `${'กรุณาเลือกประเภททุน'}`, ]" - > - - + />
{ outlined hide-bottom-space lazy-rules + class="inputgreen" v-model="formData.scholarshipTypeShort" :options="scholarshipTypeShortOp" + option-label="name" + option-value="id" + emit-value + map-options label="ประเภททุน" :rules="[ (val:string) => !!val || `${'กรุณาเลือกประเภททุน'}`, ]" - > - - + />
{ reverse-fill-mask label="เลขที่สัญญา" mask="#" + class="inputgreen" v-model="formData.contractNumber" :rules="[ (val:string) => @@ -428,6 +494,7 @@ onMounted(() => { { เพิ่ม
-
+
เลขประจำตัวประชาชน
-
123xxxxxxxxxx
+
+ {{ dataGuarantor.citizenId }} +
+
ชื่อ-นามสกุล
+
+ {{ dataGuarantor.name }} +
+
ตำแหน่ง
+
+ {{ dataGuarantor.position }} +
+
ประเภท
+
+ {{ dataGuarantor.type }} +
ระดับตำแหน่ง
-
123xxxxxxxxxx
+
+ {{ dataGuarantor.level }} +
+
ตำแหน่งทางการบริหาร
+
+ {{ dataGuarantor.positionSide }} +
+
หน่วยงานที่สังกัด
+
+ {{ dataGuarantor.org }} +
@@ -589,6 +687,7 @@ onMounted(() => { outlined lazy-rules hide-bottom-space + class="inputgreen" label="หลักสูตรการฝึกอบรม" v-model="formData.trainingCourse" :rules="[ @@ -603,6 +702,7 @@ onMounted(() => { outlined lazy-rules hide-bottom-space + class="inputgreen" label="สถาบันการศึกษา/หน่วยงานผู้จัดการฝึกอบรม" v-model="formData.institution" :rules="[ @@ -630,6 +730,7 @@ onMounted(() => { diff --git a/src/modules/15_development/interface/index/Main.ts b/src/modules/15_development/interface/index/Main.ts index a2e1cae1b..3cb5a2a85 100644 --- a/src/modules/15_development/interface/index/Main.ts +++ b/src/modules/15_development/interface/index/Main.ts @@ -36,10 +36,30 @@ interface NewPagination { sortBy: string; } +interface DataPerson { + id: string; + name: string; + prefix: string; + rank: string; + firstName: string; + lastName: string; + citizenId: string; + level: string; + type: string; + posLevelId: string; + posTypeId: string; + position: string; + positionSide: string; + posNo: string; + oc: string; + [key: string]: any; +} + export type { DataOption, DataOptionCheckBox, ItemsMenu, NewPagination, FormFilter, + DataPerson, };