แก้ ทะเบียนประวัติใหม่(ข้อมูลครอบครัว) /เพิ่ม เเสดงทั้งหมด ทะเบียนประวัติเก่า

This commit is contained in:
STW_TTTY\stwtt 2024-04-03 10:55:05 +07:00
parent eb7f758dab
commit b43f4a6b77
6 changed files with 184 additions and 110 deletions

View file

@ -332,7 +332,6 @@ import type {
OrganizaOption, OrganizaOption,
GovermentOption, GovermentOption,
} from "../../interface/index/Main"; } from "../../interface/index/Main";
// import { log } from "console";
// import { organizationSet } from "../interface/index/Main"; // import { organizationSet } from "../interface/index/Main";
import { useCounterMixin } from "@/stores/mixin"; import { useCounterMixin } from "@/stores/mixin";

View file

@ -309,7 +309,6 @@ import type {
OrganizaOption, OrganizaOption,
GovermentOption, GovermentOption,
} from "../../interface/index/Main"; } from "../../interface/index/Main";
// import { log } from "console";
import type { EnumStringMember } from "@babel/types"; import type { EnumStringMember } from "@babel/types";
// import { organizationSet } from "../interface/index/Main"; // import { organizationSet } from "../interface/index/Main";

View file

@ -9,7 +9,6 @@ import { StructChart } from "structure-chart";
import "structure-chart/structure-chart.css"; import "structure-chart/structure-chart.css";
import { useCounterMixin } from "@/stores/mixin"; import { useCounterMixin } from "@/stores/mixin";
import { useOrganizational } from "@/modules/02_organizationalNew/store/organizational"; import { useOrganizational } from "@/modules/02_organizationalNew/store/organizational";
import { log } from "console";
const mixin = useCounterMixin(); const mixin = useCounterMixin();
const store = useOrganizational(); const store = useOrganizational();

View file

@ -15,6 +15,7 @@
v-model:pagination="pagination" v-model:pagination="pagination"
> >
<template v-slot:pagination="scope"> <template v-slot:pagination="scope">
งหมด {{ props.total }} รายการ
<q-pagination <q-pagination
v-model="currentPage" v-model="currentPage"
active-color="primary" active-color="primary"
@ -531,6 +532,10 @@ const props = defineProps({
type: Number, type: Number,
require: true, require: true,
}, },
total: {
type: Number,
require: true,
},
}); });
const emit = defineEmits([ const emit = defineEmits([

View file

@ -85,6 +85,7 @@
:onTab="changeTab" :onTab="changeTab"
:rowsPerPage="rowsPerPage" :rowsPerPage="rowsPerPage"
:page="page" :page="page"
:total="total"
:maxPage="maxPage" :maxPage="maxPage"
@update:pagination="updatePagingProp" @update:pagination="updatePagingProp"
:rows-per-page-options="[50, 100, 200, 500]" :rows-per-page-options="[50, 100, 200, 500]"
@ -176,6 +177,7 @@ const { changeTreeRegister, selectedRegister, expandedRegister } = dataStore;
const maxPage = ref<number>(1); const maxPage = ref<number>(1);
const rowsPerPage = ref<number>(50); const rowsPerPage = ref<number>(50);
const page = ref<number>(1); const page = ref<number>(1);
const total = ref<number>(0)
const mixin = useCounterMixin(); const mixin = useCounterMixin();
const { date2Thai, messageError, typeRetire, showLoader, hideLoader } = mixin; const { date2Thai, messageError, typeRetire, showLoader, hideLoader } = mixin;
@ -1375,6 +1377,7 @@ const doSearch = async () => {
.then((res) => { .then((res) => {
let data = res.data.result.data; let data = res.data.result.data;
maxPage.value = Math.ceil(res.data.result.totalRows / rowsPerPage.value); maxPage.value = Math.ceil(res.data.result.totalRows / rowsPerPage.value);
total.value = res.data.result.totalRows
rows.value = []; rows.value = [];
data.map((e: ResponseObject) => { data.map((e: ResponseObject) => {
rows.value.push({ rows.value.push({

View file

@ -42,6 +42,17 @@ const fatherData = reactive({
lastName: "", lastName: "",
job: "", job: "",
}); });
const fatherDataEdit = reactive({
isHaveInfo: 1,
isLive: 0,
citizenId: "",
prefix: "",
firstName: "",
lastName: "",
job: "",
});
const motherData = reactive({ const motherData = reactive({
isHaveInfo: 1, isHaveInfo: 1,
isLive: 0, isLive: 0,
@ -51,6 +62,17 @@ const motherData = reactive({
lastName: "", lastName: "",
job: "", job: "",
}); });
const motherDataEdit = reactive({
isHaveInfo: 1,
isLive: 0,
citizenId: "",
prefix: "",
firstName: "",
lastName: "",
job: "",
});
const spouseData = reactive({ const spouseData = reactive({
isHave: 1, isHave: 1,
isLive: 0, isLive: 0,
@ -61,35 +83,51 @@ const spouseData = reactive({
job: "", job: "",
}); });
const spouseDataEdit = reactive({
isHave: 1,
isLive: 0,
citizenId: "",
prefix: "",
firstName: "",
lastName: "",
job: "",
});
const rows = ref<any>([]); const rows = ref<any>([]);
const historyRows = ref<any>([]); const historyRows = ref<any>([]);
const prefixFilter = ref([]); const prefixFilter = ref([]);
const childrenData: any = reactive({ const childrenData: any = reactive({
childrens: [], childrens: [],
}); });
const childrenDataEdit: any = reactive({
childrens: [],
});
function editForm(rows: any) { function editForm(rows: any) {
if (rows !== null) { if (rows !== null) {
fatherData.isLive = rows.fatherLive ? 1 : 0;
fatherData.citizenId = rows.fatherCitizenId; fatherDataEdit.isHaveInfo = rows.fatherFirstName !== null ? 1 : 0;
fatherData.prefix = rows.fatherPrefix; fatherDataEdit.isLive = rows.fatherLive ? 1 : 0;
fatherData.firstName = rows.fatherFirstName; fatherDataEdit.citizenId = rows.fatherCitizenId;
fatherData.lastName = rows.fatherLastName; fatherDataEdit.prefix = rows.fatherPrefix;
fatherData.job = rows.fatherCareer; fatherDataEdit.firstName = rows.fatherFirstName;
motherData.isLive = rows.motherLive ? 1 : 0; fatherDataEdit.lastName = rows.fatherLastName;
motherData.citizenId = rows.motherCitizenId; fatherDataEdit.job = rows.fatherCareer;
motherData.prefix = rows.motherPrefix; motherDataEdit.isHaveInfo = rows.motherLive ? 1 : 0;
motherData.firstName = rows.motherFirstName; motherDataEdit.isLive = rows.firstName !== null ? 1 : 0;
motherData.lastName = rows.motherLastName; motherDataEdit.citizenId = rows.motherCitizenId;
motherData.job = rows.motherCareer; motherDataEdit.prefix = rows.motherPrefix;
spouseData.isLive = rows.coupleLive ? 1 : 0; motherDataEdit.firstName = rows.motherFirstName;
spouseData.citizenId = rows.coupleCitizenId; motherDataEdit.lastName = rows.motherLastName;
spouseData.prefix = rows.couplePrefix; motherDataEdit.job = rows.motherCareer;
spouseData.firstName = rows.coupleFirstName; spouseDataEdit.isLive = rows.coupleFirstName !== null ? 1 : 0;
spouseData.lastName = rows.coupleLastName; spouseDataEdit.citizenId = rows.coupleCitizenId;
spouseData.job = rows.coupleCareer; spouseDataEdit.prefix = rows.couplePrefix;
spouseData.isHave = rows.couple ? 1 : 0; spouseDataEdit.firstName = rows.coupleFirstName;
childrenData.childrens = rows.children.map((e: any) => ({ spouseDataEdit.lastName = rows.coupleLastName;
spouseDataEdit.job = rows.coupleCareer;
spouseDataEdit.isHave = rows.couple ? 1 : 0;
childrenDataEdit.childrens = rows.children.map((e: any) => ({
...e, ...e,
childrenLive: e.childrenLive ? 1 : 0, childrenLive: e.childrenLive ? 1 : 0,
})); }));
@ -101,9 +139,32 @@ async function fetchData(id: string) {
await http await http
.get(config.API.profileNewFamilyByProfileId(id)) .get(config.API.profileNewFamilyByProfileId(id))
.then(async (res) => { .then(async (res) => {
const data = res.data.result;
rows.value = res.data.result; rows.value = res.data.result;
if (rows.value !== null) { if (rows.value !== null) {
editForm(rows.value); fatherData.isLive = data.fatherLive ? 1 : 0;
fatherData.citizenId = data.fatherCitizenId;
fatherData.prefix = data.fatherPrefix;
fatherData.firstName = data.fatherFirstName;
fatherData.lastName = data.fatherLastName;
fatherData.job = data.fatherCareer;
motherData.isLive = data.motherLive ? 1 : 0;
motherData.citizenId = data.motherCitizenId;
motherData.prefix = data.motherPrefix;
motherData.firstName = data.motherFirstName;
motherData.lastName = data.motherLastName;
motherData.job = data.motherCareer;
spouseData.isLive = data.coupleLive ? 1 : 0;
spouseData.citizenId = data.coupleCitizenId;
spouseData.prefix = data.couplePrefix;
spouseData.firstName = data.coupleFirstName;
spouseData.lastName = data.coupleLastName;
spouseData.job = data.coupleCareer;
spouseData.isHave = data.couple ? 1 : 0;
childrenData.childrens = data.children.map((e: any) => ({
...e,
childrenLive: e.childrenLive ? 1 : 0,
}));
} }
}) })
.catch((err) => { .catch((err) => {
@ -132,13 +193,13 @@ async function fetchHistoryData(id: string) {
} }
async function addData() { async function addData() {
fatherIsHaveInfo.value = fatherData.isHaveInfo === 1 ? true : false; fatherIsHaveInfo.value = fatherDataEdit.isHaveInfo === 1 ? true : false;
motherIsHaveInfo.value = motherData.isHaveInfo === 1 ? true : false; motherIsHaveInfo.value = motherDataEdit.isHaveInfo === 1 ? true : false;
spouseIsHave.value = spouseData.isHave === 1 ? true : false; spouseIsHave.value = spouseDataEdit.isHave === 1 ? true : false;
fatherIsLive.value = fatherData.isLive === 1 ? true : false; fatherIsLive.value = fatherDataEdit.isLive === 1 ? true : false;
motherIsLive.value = motherData.isLive === 1 ? true : false; motherIsLive.value = motherDataEdit.isLive === 1 ? true : false;
spouseIsLive.value = spouseData.isLive === 1 ? true : false; spouseIsLive.value = spouseDataEdit.isLive === 1 ? true : false;
const children = childrenData.childrens.map((e: any) => ({ const children = childrenDataEdit.childrens.map((e: any) => ({
childrenLive: !!e.childrenLive, childrenLive: !!e.childrenLive,
childrenCareer: e.childrenCareer, childrenCareer: e.childrenCareer,
childrenCitizenId: e.childrenCitizenId, childrenCitizenId: e.childrenCitizenId,
@ -156,24 +217,24 @@ async function addData() {
await http[method](url, { await http[method](url, {
profileId: rows.value === null ? id.value : undefined, profileId: rows.value === null ? id.value : undefined,
motherLive: motherIsHaveInfo.value ? motherIsLive.value : null, motherLive: motherIsHaveInfo.value ? motherIsLive.value : null,
motherCitizenId: motherIsHaveInfo.value ? motherData.citizenId : null, motherCitizenId: motherIsHaveInfo.value ? motherDataEdit.citizenId : null,
motherPrefix: motherIsHaveInfo.value ? motherData.prefix : null, motherPrefix: motherIsHaveInfo.value ? motherDataEdit.prefix : null,
motherFirstName: motherIsHaveInfo.value ? motherData.firstName : null, motherFirstName: motherIsHaveInfo.value ? motherDataEdit.firstName : null,
motherLastName: motherIsHaveInfo.value ? motherData.lastName : null, motherLastName: motherIsHaveInfo.value ? motherDataEdit.lastName : null,
motherCareer: motherIsHaveInfo.value ? motherData.job : null, motherCareer: motherIsHaveInfo.value ? motherDataEdit.job : null,
fatherLive: fatherIsHaveInfo.value ? fatherIsLive.value : null, fatherLive: fatherIsHaveInfo.value ? fatherIsLive.value : null,
fatherCitizenId: fatherIsHaveInfo.value ? fatherData.citizenId : null, fatherCitizenId: fatherIsHaveInfo.value ? fatherDataEdit.citizenId : null,
fatherPrefix: fatherIsHaveInfo.value ? fatherData.prefix : null, fatherPrefix: fatherIsHaveInfo.value ? fatherDataEdit.prefix : null,
fatherFirstName: fatherIsHaveInfo.value ? fatherData.firstName : null, fatherFirstName: fatherIsHaveInfo.value ? fatherDataEdit.firstName : null,
fatherLastName: fatherIsHaveInfo.value ? fatherData.lastName : null, fatherLastName: fatherIsHaveInfo.value ? fatherDataEdit.lastName : null,
fatherCareer: fatherIsHaveInfo.value ? fatherData.job : null, fatherCareer: fatherIsHaveInfo.value ? fatherDataEdit.job : null,
coupleLive: spouseIsHave.value ? spouseIsLive.value : null, coupleLive: spouseIsHave.value ? spouseIsLive.value : null,
coupleCitizenId: spouseIsHave.value ? spouseData.citizenId : null, coupleCitizenId: spouseIsHave.value ? spouseDataEdit.citizenId : null,
couplePrefix: spouseIsHave.value ? spouseData.prefix : null, couplePrefix: spouseIsHave.value ? spouseDataEdit.prefix : null,
coupleFirstName: spouseIsHave.value ? spouseData.firstName : null, coupleFirstName: spouseIsHave.value ? spouseDataEdit.firstName : null,
coupleLastName: spouseIsHave.value ? spouseData.lastName : null, coupleLastName: spouseIsHave.value ? spouseDataEdit.lastName : null,
coupleLastNameOld: spouseIsHave.value ? spouseData.lastName : null, coupleLastNameOld: spouseIsHave.value ? spouseDataEdit.lastName : null,
coupleCareer: spouseIsHave.value ? spouseData.job : null, coupleCareer: spouseIsHave.value ? spouseDataEdit.job : null,
couple: spouseIsHave.value, couple: spouseIsHave.value,
children: children, children: children,
}) })
@ -213,7 +274,7 @@ async function onSubmit() {
} }
const addChildren = async () => { const addChildren = async () => {
childrenData.childrens.push({ childrenDataEdit.childrens.push({
childrenLive: 0, childrenLive: 0,
childrenCitizenId: "", childrenCitizenId: "",
childrenPrefix: "", childrenPrefix: "",
@ -225,9 +286,9 @@ const addChildren = async () => {
}; };
function deleteChildren(items: any) { function deleteChildren(items: any) {
const index = childrenData.childrens.findIndex((r: any) => r.id == items.id); const index = childrenDataEdit.childrens.findIndex((r: any) => r.id == items.id);
childrenData.childrens.splice(index, 1); childrenDataEdit.childrens.splice(index, 1);
} }
onMounted(async () => { onMounted(async () => {
@ -279,7 +340,7 @@ onMounted(async () => {
> >
</div> </div>
</div> </div>
<div v-if="fatherData.isHaveInfo"> <div v-if="fatherData.firstName !== null">
<div class="col-12 row q-pb-sm"> <div class="col-12 row q-pb-sm">
<div class="q-mr-md text-weight-bold text-primary text-subtitle1"> <div class="q-mr-md text-weight-bold text-primary text-subtitle1">
ดา ดา
@ -321,7 +382,7 @@ onMounted(async () => {
</div> </div>
</q-card> </q-card>
</div> </div>
<div v-if="motherData.isHaveInfo"> <div v-if="motherData.firstName !== null">
<div class="col-12 row q-pb-sm q-pt-md"> <div class="col-12 row q-pb-sm q-pt-md">
<div class="q-mr-md text-weight-bold text-primary text-subtitle1"> <div class="q-mr-md text-weight-bold text-primary text-subtitle1">
มารดา มารดา
@ -363,7 +424,7 @@ onMounted(async () => {
</div> </div>
</q-card> </q-card>
</div> </div>
<div v-if="spouseData.isHave"> <div v-if="spouseData.firstName !== null">
<div class="col-12 row q-pb-sm q-pt-md"> <div class="col-12 row q-pb-sm q-pt-md">
<div class="q-mr-md text-weight-bold text-primary text-subtitle1"> <div class="q-mr-md text-weight-bold text-primary text-subtitle1">
สมรส สมรส
@ -479,7 +540,7 @@ onMounted(async () => {
</div> </div>
<div class="flex q-gutter-sm"> <div class="flex q-gutter-sm">
<q-radio <q-radio
v-model="fatherData.isHaveInfo" v-model="fatherDataEdit.isHaveInfo"
checked-icon="task_alt" checked-icon="task_alt"
unchecked-icon="panorama_fish_eye" unchecked-icon="panorama_fish_eye"
:val="1" :val="1"
@ -488,7 +549,7 @@ onMounted(async () => {
color="primary" color="primary"
/> />
<q-radio <q-radio
v-model="fatherData.isHaveInfo" v-model="fatherDataEdit.isHaveInfo"
checked-icon="task_alt" checked-icon="task_alt"
unchecked-icon="panorama_fish_eye" unchecked-icon="panorama_fish_eye"
:val="0" :val="0"
@ -498,16 +559,20 @@ onMounted(async () => {
/> />
</div> </div>
</div> </div>
<q-card bordered class="bg-grey-1 q-pa-md"> <q-card
v-if="fatherDataEdit.isHaveInfo"
bordered
class="bg-grey-1 q-pa-md"
>
<div class="row q-col-gutter-md"> <div class="row q-col-gutter-md">
<div class="col"> <div class="col">
<q-input <q-input
:disable="!fatherData.isHaveInfo" :disable="!fatherDataEdit.isHaveInfo"
outlined outlined
hide-bottom-space hide-bottom-space
bg-color="white" bg-color="white"
dense dense
v-model="fatherData.citizenId" v-model="fatherDataEdit.citizenId"
:label="`${'เลขประจำตัวประชาชน'}`" :label="`${'เลขประจำตัวประชาชน'}`"
maxlength="13" maxlength="13"
:rules="[ :rules="[
@ -519,7 +584,7 @@ onMounted(async () => {
</div> </div>
<div class="col"> <div class="col">
<q-select <q-select
:disable="!fatherData.isHaveInfo" :disable="!fatherDataEdit.isHaveInfo"
outlined outlined
bg-color="white" bg-color="white"
lazy-rules lazy-rules
@ -528,7 +593,7 @@ onMounted(async () => {
class="inputgreen" class="inputgreen"
:rules="[(val) => !!val || 'กรุณาเลือกคำนำหน้าชื่อ']" :rules="[(val) => !!val || 'กรุณาเลือกคำนำหน้าชื่อ']"
label="คำนำหน้าชื่อ" label="คำนำหน้าชื่อ"
v-model="fatherData.prefix" v-model="fatherDataEdit.prefix"
use-input use-input
input-debounce="0" input-debounce="0"
emit-value emit-value
@ -543,13 +608,13 @@ onMounted(async () => {
</div> </div>
<div class="col"> <div class="col">
<q-input <q-input
:disable="!fatherData.isHaveInfo" :disable="!fatherDataEdit.isHaveInfo"
outlined outlined
dense dense
bg-color="white" bg-color="white"
class="inputgreen" class="inputgreen"
lazy-rules lazy-rules
v-model="fatherData.firstName" v-model="fatherDataEdit.firstName"
:rules="[(val) => !!val || 'กรุณากรอกชื่อ']" :rules="[(val) => !!val || 'กรุณากรอกชื่อ']"
label="ชื่อ" label="ชื่อ"
hidden-space hidden-space
@ -557,25 +622,25 @@ onMounted(async () => {
</div> </div>
<div class="col"> <div class="col">
<q-input <q-input
:disable="!fatherData.isHaveInfo" :disable="!fatherDataEdit.isHaveInfo"
outlined outlined
dense dense
class="inputgreen" class="inputgreen"
bg-color="white" bg-color="white"
lazy-rules lazy-rules
v-model="fatherData.lastName" v-model="fatherDataEdit.lastName"
:rules="[(val) => !!val || 'กรุณากรอกนามสกุล']" :rules="[(val) => !!val || 'กรุณากรอกนามสกุล']"
label="นามสกุล" label="นามสกุล"
/> />
</div> </div>
<div class="col"> <div class="col">
<q-input <q-input
:disable="!fatherData.isHaveInfo" :disable="!fatherDataEdit.isHaveInfo"
outlined outlined
dense dense
class="inputgreen" class="inputgreen"
bg-color="white" bg-color="white"
v-model="fatherData.job" v-model="fatherDataEdit.job"
label="อาชีพ" label="อาชีพ"
/> />
</div> </div>
@ -584,23 +649,23 @@ onMounted(async () => {
<div class="q-mr-sm">สถานภาพการม</div> <div class="q-mr-sm">สถานภาพการม</div>
<div> <div>
<q-radio <q-radio
:disable="!fatherData.isHaveInfo" :disable="!fatherDataEdit.isHaveInfo"
class="q-mr-sm" class="q-mr-sm"
v-model="fatherData.isLive" v-model="fatherDataEdit.isLive"
checked-icon="task_alt" checked-icon="task_alt"
unchecked-icon="panorama_fish_eye" unchecked-icon="panorama_fish_eye"
:val="1" :val="1"
label="ยังมีชีวิตอยู่" label="ยังมีชีวิตอยู่"
dense dense
:color="!fatherData.isHaveInfo ? 'grey' : 'primary'" :color="!fatherDataEdit.isHaveInfo ? 'grey' : 'primary'"
/> />
<q-radio <q-radio
:disable="!fatherData.isHaveInfo" :disable="!fatherDataEdit.isHaveInfo"
v-model="fatherData.isLive" v-model="fatherDataEdit.isLive"
checked-icon="task_alt" checked-icon="task_alt"
unchecked-icon="panorama_fish_eye" unchecked-icon="panorama_fish_eye"
:val="0" :val="0"
:color="!fatherData.isHaveInfo ? 'grey' : 'red'" :color="!fatherDataEdit.isHaveInfo ? 'grey' : 'red'"
label="ถึงแก่กรรม" label="ถึงแก่กรรม"
dense dense
/> />
@ -615,7 +680,7 @@ onMounted(async () => {
</div> </div>
<div class="flex q-gutter-sm"> <div class="flex q-gutter-sm">
<q-radio <q-radio
v-model="motherData.isHaveInfo" v-model="motherDataEdit.isHaveInfo"
checked-icon="task_alt" checked-icon="task_alt"
unchecked-icon="panorama_fish_eye" unchecked-icon="panorama_fish_eye"
:val="1" :val="1"
@ -624,7 +689,7 @@ onMounted(async () => {
color="primary" color="primary"
/> />
<q-radio <q-radio
v-model="motherData.isHaveInfo" v-model="motherDataEdit.isHaveInfo"
checked-icon="task_alt" checked-icon="task_alt"
unchecked-icon="panorama_fish_eye" unchecked-icon="panorama_fish_eye"
:val="0" :val="0"
@ -634,16 +699,20 @@ onMounted(async () => {
/> />
</div> </div>
</div> </div>
<q-card bordered class="bg-grey-1 q-pa-md"> <q-card
v-if="motherDataEdit.isHaveInfo"
bordered
class="bg-grey-1 q-pa-md"
>
<div class="row q-col-gutter-md"> <div class="row q-col-gutter-md">
<div class="col"> <div class="col">
<q-input <q-input
:disable="!motherData.isHaveInfo" :disable="!motherDataEdit.isHaveInfo"
outlined outlined
hide-bottom-space hide-bottom-space
bg-color="white" bg-color="white"
dense dense
v-model="motherData.citizenId" v-model="motherDataEdit.citizenId"
:label="`${'เลขประจำตัวประชาชน'}`" :label="`${'เลขประจำตัวประชาชน'}`"
maxlength="13" maxlength="13"
:rules="[ :rules="[
@ -655,12 +724,12 @@ onMounted(async () => {
</div> </div>
<div class="col"> <div class="col">
<q-select <q-select
:disable="!motherData.isHaveInfo" :disable="!motherDataEdit.isHaveInfo"
outlined outlined
bg-color="white" bg-color="white"
lazy-rules lazy-rules
dense dense
v-model="motherData.prefix" v-model="motherDataEdit.prefix"
:rules="[(val) => !!val || 'กรุณาเลือกคำนำหน้าชื่อ']" :rules="[(val) => !!val || 'กรุณาเลือกคำนำหน้าชื่อ']"
label="คำนำหน้าชื่อ" label="คำนำหน้าชื่อ"
hidden-space hidden-space
@ -679,13 +748,13 @@ onMounted(async () => {
</div> </div>
<div class="col"> <div class="col">
<q-input <q-input
:disable="!motherData.isHaveInfo" :disable="!motherDataEdit.isHaveInfo"
outlined outlined
dense dense
class="inputgreen" class="inputgreen"
bg-color="white" bg-color="white"
lazy-rules lazy-rules
v-model="motherData.firstName" v-model="motherDataEdit.firstName"
:rules="[(val) => !!val || 'กรุณากรอกชื่อ']" :rules="[(val) => !!val || 'กรุณากรอกชื่อ']"
label="ชื่อ" label="ชื่อ"
hidden-space hidden-space
@ -693,25 +762,25 @@ onMounted(async () => {
</div> </div>
<div class="col"> <div class="col">
<q-input <q-input
:disable="!motherData.isHaveInfo" :disable="!motherDataEdit.isHaveInfo"
outlined outlined
class="inputgreen" class="inputgreen"
dense dense
bg-color="white" bg-color="white"
lazy-rules lazy-rules
v-model="motherData.lastName" v-model="motherDataEdit.lastName"
:rules="[(val) => !!val || 'กรุณากรอกนามสกุล']" :rules="[(val) => !!val || 'กรุณากรอกนามสกุล']"
label="นามสกุล" label="นามสกุล"
/> />
</div> </div>
<div class="col"> <div class="col">
<q-input <q-input
:disable="!motherData.isHaveInfo" :disable="!motherDataEdit.isHaveInfo"
outlined outlined
class="inputgreen" class="inputgreen"
dense dense
bg-color="white" bg-color="white"
v-model="motherData.job" v-model="motherDataEdit.job"
label="อาชีพ" label="อาชีพ"
/> />
</div> </div>
@ -720,23 +789,23 @@ onMounted(async () => {
<div class="q-mr-sm">สถานภาพการม</div> <div class="q-mr-sm">สถานภาพการม</div>
<div> <div>
<q-radio <q-radio
:disable="!motherData.isHaveInfo" :disable="!motherDataEdit.isHaveInfo"
class="q-mr-sm" class="q-mr-sm"
v-model="motherData.isLive" v-model="motherDataEdit.isLive"
checked-icon="task_alt" checked-icon="task_alt"
unchecked-icon="panorama_fish_eye" unchecked-icon="panorama_fish_eye"
:val="1" :val="1"
label="ยังมีชีวิตอยู่" label="ยังมีชีวิตอยู่"
dense dense
:color="!motherData.isHaveInfo ? 'grey' : 'primary'" :color="!motherDataEdit.isHaveInfo ? 'grey' : 'primary'"
/> />
<q-radio <q-radio
:disable="!motherData.isHaveInfo" :disable="!motherDataEdit.isHaveInfo"
v-model="motherData.isLive" v-model="motherDataEdit.isLive"
checked-icon="task_alt" checked-icon="task_alt"
unchecked-icon="panorama_fish_eye" unchecked-icon="panorama_fish_eye"
:val="0" :val="0"
:color="!motherData.isHaveInfo ? 'grey' : 'red'" :color="!motherDataEdit.isHaveInfo ? 'grey' : 'red'"
label="ถึงแก่กรรม" label="ถึงแก่กรรม"
dense dense
/> />
@ -751,7 +820,7 @@ onMounted(async () => {
</div> </div>
<div class="flex q-gutter-sm"> <div class="flex q-gutter-sm">
<q-radio <q-radio
v-model="spouseData.isHave" v-model="spouseDataEdit.isHave"
checked-icon="task_alt" checked-icon="task_alt"
unchecked-icon="panorama_fish_eye" unchecked-icon="panorama_fish_eye"
:val="1" :val="1"
@ -760,7 +829,7 @@ onMounted(async () => {
color="primary" color="primary"
/> />
<q-radio <q-radio
v-model="spouseData.isHave" v-model="spouseDataEdit.isHave"
checked-icon="task_alt" checked-icon="task_alt"
unchecked-icon="panorama_fish_eye" unchecked-icon="panorama_fish_eye"
:val="0" :val="0"
@ -770,17 +839,17 @@ onMounted(async () => {
/> />
</div> </div>
</div> </div>
<q-card v-if="spouseData.isHave" bordered class="bg-grey-1 q-pa-md"> <q-card v-if="spouseDataEdit.isHave" bordered class="bg-grey-1 q-pa-md">
<div class="row q-col-gutter-md"> <div class="row q-col-gutter-md">
<div class="col"> <div class="col">
<q-input <q-input
:disable="!spouseData.isHave" :disable="!spouseDataEdit.isHave"
outlined outlined
hide-bottom-space hide-bottom-space
bg-color="white" bg-color="white"
dense dense
class="inputgreen" class="inputgreen"
v-model="spouseData.citizenId" v-model="spouseDataEdit.citizenId"
:label="`${'เลขประจำตัวประชาชน'}`" :label="`${'เลขประจำตัวประชาชน'}`"
maxlength="13" maxlength="13"
:rules="[ :rules="[
@ -791,13 +860,13 @@ onMounted(async () => {
</div> </div>
<div class="col"> <div class="col">
<q-select <q-select
:disable="!spouseData.isHave" :disable="!spouseDataEdit.isHave"
outlined outlined
class="inputgreen" class="inputgreen"
bg-color="white" bg-color="white"
lazy-rules lazy-rules
dense dense
v-model="spouseData.prefix" v-model="spouseDataEdit.prefix"
:rules="[(val) => !!val || 'กรุณาเลือกคำนำหน้าชื่อ']" :rules="[(val) => !!val || 'กรุณาเลือกคำนำหน้าชื่อ']"
label="คำนำหน้าชื่อ" label="คำนำหน้าชื่อ"
hidden-space hidden-space
@ -815,13 +884,13 @@ onMounted(async () => {
</div> </div>
<div class="col"> <div class="col">
<q-input <q-input
:disable="!spouseData.isHave" :disable="!spouseDataEdit.isHave"
outlined outlined
class="inputgreen" class="inputgreen"
dense dense
bg-color="white" bg-color="white"
lazy-rules lazy-rules
v-model="spouseData.firstName" v-model="spouseDataEdit.firstName"
:rules="[(val) => !!val || 'กรุณากรอกชื่อ']" :rules="[(val) => !!val || 'กรุณากรอกชื่อ']"
label="ชื่อ" label="ชื่อ"
hidden-space hidden-space
@ -829,25 +898,25 @@ onMounted(async () => {
</div> </div>
<div class="col"> <div class="col">
<q-input <q-input
:disable="!spouseData.isHave" :disable="!spouseDataEdit.isHave"
outlined outlined
dense dense
class="inputgreen" class="inputgreen"
bg-color="white" bg-color="white"
lazy-rules lazy-rules
v-model="spouseData.lastName" v-model="spouseDataEdit.lastName"
:rules="[(val) => !!val || 'กรุณากรอกนามสกุล']" :rules="[(val) => !!val || 'กรุณากรอกนามสกุล']"
label="นามสกุล" label="นามสกุล"
/> />
</div> </div>
<div class="col"> <div class="col">
<q-input <q-input
:disable="!spouseData.isHave" :disable="!spouseDataEdit.isHave"
outlined outlined
dense dense
class="inputgreen" class="inputgreen"
bg-color="white" bg-color="white"
v-model="spouseData.job" v-model="spouseDataEdit.job"
label="อาชีพ" label="อาชีพ"
/> />
</div> </div>
@ -856,19 +925,19 @@ onMounted(async () => {
<div class="q-mr-sm">สถานภาพการม</div> <div class="q-mr-sm">สถานภาพการม</div>
<div> <div>
<q-radio <q-radio
:disable="!spouseData.isHave" :disable="!spouseDataEdit.isHave"
class="q-mr-sm" class="q-mr-sm"
v-model="spouseData.isLive" v-model="spouseDataEdit.isLive"
checked-icon="task_alt" checked-icon="task_alt"
unchecked-icon="panorama_fish_eye" unchecked-icon="panorama_fish_eye"
:val="1" :val="1"
label="ยังมีชีวิตอยู่" label="ยังมีชีวิตอยู่"
dense dense
:color="!spouseData.isHave ? 'grey' : 'primary'" :color="!spouseDataEdit.isHave ? 'grey' : 'primary'"
/> />
<q-radio <q-radio
:disable="!spouseData.isHave" :disable="!spouseDataEdit.isHave"
v-model="spouseData.isLive" v-model="spouseDataEdit.isLive"
checked-icon="task_alt" checked-icon="task_alt"
unchecked-icon="panorama_fish_eye" unchecked-icon="panorama_fish_eye"
:val="0" :val="0"
@ -896,7 +965,7 @@ onMounted(async () => {
<q-tooltip> เพมขอม </q-tooltip> <q-tooltip> เพมขอม </q-tooltip>
</q-btn> </q-btn>
</div> </div>
<div v-for="(items, index) in childrenData.childrens" :key="index"> <div v-for="(items, index) in childrenDataEdit.childrens" :key="index">
<div class="col-12 row q-gutter-sm q-pb-xs q-mt-xs"> <div class="col-12 row q-gutter-sm q-pb-xs q-mt-xs">
<div class="text-medium q-pl-md"> <div class="text-medium q-pl-md">
ตรคนท : {{ index + 1 }} ตรคนท : {{ index + 1 }}