hrms-bangkok/hrms-mgt
7
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

ปรับหน้าขอแก้ไขข้อมูลทะเบียนประวัติ

Browse source
This commit is contained in:
setthawutttty 2024-10-24 15:47:39 +07:00
parent d44cc0d477
commit c6acb3e2b8
9 changed files with 131 additions and 324 deletions
Download patch file Download diff file Expand all files Collapse all files

13
src/modules/04_registryPerson/components/Dialog/04_Father.vue
View file

@ -1,5 +1,5 @@
<script setup lang="ts">
import { reactive } from "vue";
import { reactive,watch } from "vue";
import { useQuasar } from "quasar";
import http from "@/plugins/http";
@ -28,6 +28,7 @@ const {
const modal = defineModel<boolean>("modal", { required: true }); // ตัวแปร popup
const profileId = defineModel<string>("profileId", { required: true }); //id บุคคล
const idCard = defineModel<string>("idCard", { required: true }); //เลขบัตร ปชช
const props = defineProps({
fetchData: Function,
@ -101,6 +102,15 @@ async function upDateStatus() {
hideLoader();
});
}
watch(
() => modal.value,
() => {
if (modal.value) {
storeLinkCenter.fetchPerson();
fatherData.citizenId = idCard.value;
}
}
);
</script>
<template>
<q-dialog v-model="modal" persistent>
@ -117,6 +127,7 @@ async function upDateStatus() {
<q-input
outlined
hide-bottom-space
readonly
bg-color="white"
dense
v-model="fatherData.citizenId"

13
src/modules/04_registryPerson/components/Dialog/05_Mother.vue
View file

@ -1,5 +1,5 @@
<script setup lang="ts">
import { reactive } from "vue";
import { reactive, watch } from "vue";
import { useQuasar } from "quasar";
import http from "@/plugins/http";
@ -32,6 +32,7 @@ const props = defineProps({
const modal = defineModel<boolean>("modal", { required: true }); // ตัวแปร popup
const profileId = defineModel<string>("profileId", { required: true }); //id บุคคล
const idCard = defineModel<string>("idCard", { required: true }); //เลขบัตร ปชช
const motherData = reactive<FormPerson>({
isLive: 1,
@ -100,6 +101,15 @@ async function upDateStatus() {
hideLoader();
});
}
watch(
() => modal.value,
() => {
if (modal.value) {
storeLinkCenter.fetchPerson();
motherData.citizenId = idCard.value;
}
}
);
</script>
<template>
<q-dialog v-model="modal" persistent>
@ -118,6 +128,7 @@ async function upDateStatus() {
hide-bottom-space
bg-color="white"
dense
readonly
v-model="motherData.citizenId"
:label="`${'เลขประจำตัวประชาชน'}`"
maxlength="13"

14
src/modules/04_registryPerson/components/Dialog/06_Couple.vue
View file

@ -1,5 +1,5 @@
<script setup lang="ts">
import { reactive } from "vue";
import { reactive, watch } from "vue";
import { useQuasar } from "quasar";
import http from "@/plugins/http";
@ -27,6 +27,7 @@ const {
const modal = defineModel<boolean>("modal", { required: true }); // ตัวแปร popup
const profileId = defineModel<string>("profileId", { required: true }); //id บุคคล
const idCard = defineModel<string>("idCard", { required: true }); //เลขบัตร ปชช
const props = defineProps({
fetchData: Function,
@ -120,6 +121,16 @@ function filterSelectorRelation(val: any, update: Function) {
);
});
}
watch(
() => modal.value,
() => {
if (modal.value) {
storeLinkCenter.fetchPerson();
storeLinkCenter.fetchDataRelationship();
coupleData.citizenId = idCard.value;
}
}
);
</script>
<template>
<q-dialog v-model="modal" persistent>
@ -160,6 +171,7 @@ function filterSelectorRelation(val: any, update: Function) {
outlined
bg-color="white"
dense
readonly
v-model="coupleData.citizenId"
:label="`${'เลขประจำตัวประชาชน'}`"
maxlength="13"

276
src/modules/04_registryPerson/components/Dialog/07_Child.vue
View file

@ -1,276 +0,0 @@
<script setup lang="ts">
import { ref, reactive } from "vue";
import { useQuasar } from "quasar";
import http from "@/plugins/http";
import config from "@/app.config";
import { useCounterMixin } from "@/stores/mixin";
import { useDataLinkCenter } from "@/modules/04_registryPerson/stores/LinkCenter";
import { useProfileDataStore } from "@/modules/04_registryPerson/stores/profile";
import type { FormChildren } from "@/modules/04_registryPerson/interface/index/family";
import Header from "@/components/DialogHeader.vue"; //ส่วนหัว popup
const $q = useQuasar();
const mixin = useCounterMixin();
const storeLinkCenter = useDataLinkCenter();
const storeProfile = useProfileDataStore();
const {
showLoader,
hideLoader,
messageError,
dialogConfirm,
modalError,
success,
} = mixin;
const props = defineProps({
fetchData: Function,
requestId: String,
});
const modal = defineModel<boolean>("modal", { required: true }); // ตัวแปร popup
const profileId = defineModel<string>("profileId", { required: true }); //id บุคคล
const childData = ref<FormChildren[]>([]);
/** ปิด popup */
async function closeDialog() {
modal.value = false;
childData.value = [];
}
/** อัพเดตข้อมูลครอบครัว */
async function onSubmit() {
if (childData.value.length !== 0) {
for (const child of childData.value) {
saveChildren(child);
}
}
}
async function saveChildren(child: FormChildren) {
const body = {
profileId: profileId.value,
childrenCitizenId: child.childrenCitizenId,
childrenPrefix: child.childrenPrefix,
childrenFirstName: child.childrenFirstName,
childrenLastName: child.childrenLastName,
childrenCareer: child.childrenCareer,
childrenLive: child.childrenLive === 1 ? true : false,
};
return http
.post(config.API.profileFamily("", "children"), body)
.then((res) => {})
.catch((e) => {
messageError($q, e);
hideLoader();
})
.finally(() => {});
}
/**
* เพิ่มลบ row
* @param type 1 = เพิ่ม / 0 = ลบ
* @param index ระบุว่าเป็น object ตัวไหน
*/
function onChild(type: number, index?: number) {
if (type === 1) {
childData.value.push({
id: "",
createdAt: "",
createdUserId: "",
createdFullName: "",
lastUpdatedAt: "",
lastUpdateUserId: "",
lastUpdateFullName: "",
profileId: "",
profileEmployeeId: "",
childrenCitizenId: "",
childrenPrefix: "",
childrenFirstName: "",
childrenLastName: "",
childrenCareer: "",
childrenLive: 1,
} as FormChildren);
} else if (type === 0 && index !== undefined) {
childData.value.splice(index, 1);
}
}
</script>
<template>
<q-dialog v-model="modal" persistent>
<q-card class="col-12" style="width: 80vw">
<q-form greedy @submit.prevent @validation-success="onSubmit">
<Header tittle="ขอปรับปรุงข้อมูลบุตร" :close="closeDialog" />
<q-separator />
<q-card-section class="scroll" style="max-height: 80vh">
<div class="row q-col-gutter-sm">
<div class="col-xs-12 text-weight-bold">
• บุตร
<q-btn
dense
round
flat
icon="add"
color="primary"
@click="onChild(1)"
><q-tooltip>เพิ่ม</q-tooltip></q-btn
>
</div>
<div
class="row col-12 q-col-gutter-x-xs"
v-for="(item, index) in childData"
:key="index"
>
<div class="col-12 q-mb-xs">บุตรคนที่:{{ index + 1 }}</div>
<div class="col-xs-6 col-sm-6 col-md-3">
<q-input
outlined
hide-bottom-space
bg-color="white"
dense
v-model="item.childrenCitizenId"
:label="`${'เลขประจำตัวประชาชน'}`"
maxlength="13"
:rules="[
(val:string) => !!val || 'กรุณากรอกเลขบัตรประชาชน',
(val:string) =>
val.length === 13 ||
'กรุณากรอกเลขบัตรประชาชนให้ครบ 13 หลัก',
]
"
class="inputgreen"
mask="#############"
/>
</div>
<div class="col-xs-6 col-sm-6 col-md-2">
<q-select
outlined
bg-color="white"
lazy-rules
hidden-space
hide-bottom-space
dense
class="inputgreen"
:rules="
[(val:string) => !!val || 'กรุณาเลือกคำนำหน้าชื่อ']
"
label="คำนำหน้าชื่อ"
v-model="item.childrenPrefix"
use-input
input-debounce="0"
emit-value
map-options
:options="storeLinkCenter.OpsPerson.prefixOps"
option-label="name"
option-value="name"
@filter="(inputValue:string,
doneFn:Function) => storeProfile.filterSelector(inputValue, doneFn,'prefixOps'
) "
/>
</div>
<div class="col-xs-6 col-sm-6 col-md-2">
<q-input
outlined
dense
hide-bottom-space
bg-color="white"
class="inputgreen"
lazy-rules
v-model="item.childrenFirstName"
:rules="
[(val:string) => !!val || 'กรุณากรอกชื่อ']
"
label="ชื่อ"
hidden-space
/>
</div>
<div class="col-xs-6 col-sm-6 col-md-2">
<q-input
outlined
dense
class="inputgreen"
bg-color="white"
hide-bottom-space
lazy-rules
v-model="item.childrenLastName"
:rules="
[(val:string) => !!val || 'กรุณากรอกนามสกุล']
"
label="นามสกุล"
/>
</div>
<div class="col-xs-6 col-sm-6 col-md-2">
<q-input
outlined
dense
class="inputgreen"
bg-color="white"
v-model="item.childrenCareer"
label="อาชีพ"
/>
</div>
<div class="self-center">
<q-btn
dense
flat
round
icon="mdi-trash-can"
color="red"
@click="onChild(0, index)"
>
<q-tooltip>ลบ</q-tooltip>
</q-btn>
</div>
<div class="col-12">
<div class="row q-my-xs">
<div class="q-mr-sm">สถานภาพการมีชีวิต</div>
<div>
<q-radio
class="q-mr-sm"
v-model="item.childrenLive"
checked-icon="task_alt"
unchecked-icon="panorama_fish_eye"
:val="1"
label="ยังมีชีวิตอยู่"
dense
:color="!item.childrenLive ? 'grey' : 'primary'"
/>
<q-radio
v-model="item.childrenLive"
checked-icon="task_alt"
unchecked-icon="panorama_fish_eye"
:val="0"
:color="!item.childrenLive ? 'grey' : 'red'"
label="ถึงแก่กรรม"
dense
/>
</div>
</div>
</div>
</div>
</div>
</q-card-section>
<q-separator />
<q-card-actions align="right">
<q-btn
label="บันทึกลงทะเบียนประวัติ"
color="secondary"
type="submit"
/>
<q-btn label="ยกเลิก" color="orange" @click="modal = false"
><q-tooltip>ยกเลิก</q-tooltip></q-btn
>
</q-card-actions>
</q-form>
</q-card>
</q-dialog>
</template>

22
src/modules/04_registryPerson/components/Dialog/DialogUpdate.vue
View file

@ -201,27 +201,6 @@ async function amiRequest() {
formDataAddress.currentDistrictId = data.value.currentDistrictId;
formDataAddress.currentSubDistrictId = data.value.currentSubDistrictId;
formDataAddress.currentZipCode = data.value.currentZipCode;
// formFamily.fatherFirstName = data.value.fatherName;
// formFamily.motherFirstName = data.value.motherName;
}
/**
* function fetch ข้อมูลความสัมพันธ์
*/
async function fetchDataRelationship() {
await http
.get(config.API.orgRelationship)
.then(async (res) => {
const list = await res.data.result.map((e: any) => ({
id: e.id,
name: e.name,
}));
storeLinkCenter.optionRelationshipMain = list;
})
.catch((err) => {
messageError($q, err);
});
}
watch(
@ -230,7 +209,6 @@ watch(
if (modal.value) {
showLoader();
count.value = 0;
await fetchDataRelationship();
await storeLinkCenter.fetchPerson();
await amiRequest();
presentAddress.value = formDataAddress.registrationZipCode ? "0" : "1";

85
src/modules/04_registryPerson/components/requestEdit/Page01_Detail.vue
View file

@ -13,6 +13,9 @@ import type { DataRequest } from "@/modules/04_registryPerson/interface/response
import Workflow from "@/components/Workflow/Main.vue";
import DialogUpdate from "@/modules/04_registryPerson/components/Dialog/DialogUpdate.vue";
import DialogUpdateFather from "@/modules/04_registryPerson/components/Dialog/04_Father.vue";
import DialogUpdateMother from "@/modules/04_registryPerson/components/Dialog/05_Mother.vue";
import DialogUpdateCouple from "@/modules/04_registryPerson/components/Dialog/06_Couple.vue";
const $q = useQuasar();
const router = useRouter();
@ -29,14 +32,21 @@ const {
const urlImg = ref<string>("");
const modalUpdate = ref<boolean>(false);
const modalFather = ref<boolean>(false);
const modalMother = ref<boolean>(false);
const modalCouple = ref<boolean>(false);
const profileId = ref<string>("");
const idCard = ref<string>("");
const citizenId = ref<string>("");
const requestId = ref<string>(route.params.id.toString());
const dataRequest = ref<any>({
const dataRequest = ref<DataRequest>({
id: "",
fullname: "",
createdAt: null,
createdAt: "",
topic: "",
detail: "",
status: "",
citizenId: "",
});
//ฟอร์มสถานะคำร้อง
@ -66,12 +76,7 @@ async function fetchDataRequest() {
.get(config.API.requestEdit + `${requestId.value}`)
.then((res) => {
const data = res.data.result;
dataRequest.value = {
fullname: data.fullname,
createdAt: data.createdAt,
topic: data.topic,
detail: data.detail,
};
dataRequest.value = data;
formData.status = data.status;
formData.remark = data.remark;
@ -195,8 +200,32 @@ async function downloadUrl(id: string, fileName: string) {
});
}
function onUpdate() {
modalUpdate.value = true;
function onUpdate(data: DataRequest) {
citizenId.value = data.citizenId as string;
if (data.topic == "ขอปรับปรุงข้อมูลจากกรมการปกครอง") {
modalUpdate.value = true;
} else if (data.topic == "ขอแก้ไขข้อมูล บิดา") {
modalFather.value = true;
} else if (data.topic == "ขอแก้ไขข้อมูล มารดา") {
modalMother.value = true;
} else if (data.topic == "ขอแก้ไขข้อมูล คู่สมรส") {
modalCouple.value = true;
}
}
function topicConvert(type: string) {
switch (type) {
case "ขอแก้ไขข้อมูล บิดา":
return "แก้ไขข้อมูล บิดา";
case "ขอแก้ไขข้อมูล มารดา":
return "แก้ไขข้อมูล มารดา";
case "ขอแก้ไขข้อมูล คู่สมรส":
return "แก้ไขข้อมูล คู่สมรส";
case "ขอปรับปรุงข้อมูลจากกรมการปกครอง":
return "ปรับปรุงข้อมูลจากกรมการปกครอง";
default:
return "";
}
}
onMounted(async () => {
@ -223,10 +252,10 @@ onMounted(async () => {
<q-btn
v-if="workflowRef?.permission.isUpdate"
color="public"
label="ปรับปรุงข้อมูลจากกรมการปกครอง"
@click="onUpdate"
:label="topicConvert(dataRequest.topic)"
@click="onUpdate(dataRequest)"
>
<q-tooltip>ปรับปรุงข้อมูลจากกรมการปกครอง</q-tooltip>
<q-tooltip>{{ topicConvert(dataRequest.topic) }}</q-tooltip>
</q-btn>
</div>
<q-card>
@ -270,7 +299,7 @@ onMounted(async () => {
class="full-width"
:model-value="
dataRequest.createdAt != null
? date2Thai(dataRequest.createdAt)
? date2Thai(dataRequest.createdAt as Date)
: null
"
:label="`${'วันที่ยื่นขอ'}`"
@ -465,7 +494,31 @@ onMounted(async () => {
<DialogUpdate
v-model:modal="modalUpdate"
v-model:id-card="idCard"
v-model:id-card="dataRequest.citizenId"
v-model:profile-id="profileId"
:fetch-data="fetchDataRequest"
:request-id="requestId"
/>
<DialogUpdateFather
v-model:modal="modalFather"
v-model:id-card="dataRequest.citizenId"
v-model:profile-id="profileId"
:fetch-data="fetchDataRequest"
:request-id="requestId"
/>
<DialogUpdateMother
v-model:modal="modalMother"
v-model:id-card="dataRequest.citizenId"
v-model:profile-id="profileId"
:fetch-data="fetchDataRequest"
:request-id="requestId"
/>
<DialogUpdateCouple
v-model:modal="modalCouple"
v-model:id-card="dataRequest.citizenId"
v-model:profile-id="profileId"
:fetch-data="fetchDataRequest"
:request-id="requestId"

12
src/modules/04_registryPerson/interface/response/Main.ts
View file

@ -27,18 +27,18 @@ interface DataPerson {
}
interface DataRequest {
createdAt: string;
createdFullName: string;
createdAt: string|Date;
createdFullName?: string;
detail: string;
fullname: string;
id: string;
lastUpdateFullName: string;
lastUpdatedAt: string;
remark: string;
lastUpdateFullName?: string;
lastUpdatedAt?: string;
remark?: string;
status: string;
topic: string;
profileId?: string;
idcard?: string;
citizenId: string;
}
interface DataProfile {

19
src/modules/04_registryPerson/stores/LinkCenter.ts
View file

@ -335,6 +335,24 @@ export const useDataLinkCenter = defineStore("DataLinkCenter", () => {
break;
}
}
/**
* function fetch ข้อมูลความสัมพันธ์
*/
function fetchDataRelationship() {
http
.get(config.API.orgRelationship)
.then((res) => {
const list = res.data.result.map((e: any) => ({
id: e.id,
name: e.name,
}));
optionRelationshipMain.value = list;
})
.catch((err) => {
messageError($q, err);
});
}
return {
fetchPerson,
OpsPersonFilter,
@ -348,5 +366,6 @@ export const useDataLinkCenter = defineStore("DataLinkCenter", () => {
fetchSubDistrict,
optionRelationshipMain,
optionRelationship,
fetchDataRelationship
};
});

1
src/modules/04_registryPerson/stores/profile.ts
View file

@ -34,7 +34,6 @@ export const useProfileDataStore = defineStore("profile", () => {
nationality: null,
ethnicity: null,
birthDate: null,
phone: null,
lastName: "",
firstName: "",
prefix: "",