ทะเบียนประวัติ: store ประวัติส่วนตัว
This commit is contained in:
puriphatt
parent
986e4b4898
commit
9d77ed6298
2 changed files with 262 additions and 80 deletions
|
|
@ -25,8 +25,16 @@ const {
|
|||
messageError,
|
||||
dialogConfirm,
|
||||
} = mixin;
|
||||
const { calculateAge, getGender, getRelationship, getReligion, getBloodGroup } =
|
||||
store;
|
||||
const {
|
||||
calculateAge,
|
||||
fetchPerson,
|
||||
filterSelector,
|
||||
// getGender,
|
||||
// getRelationship,
|
||||
// getReligion,
|
||||
// getBloodGroup,
|
||||
// getPersonOp,
|
||||
} = store;
|
||||
const profileId = ref<string>(
|
||||
route.params.id ? route.params.id.toString() : ""
|
||||
);
|
||||
|
|
@ -354,10 +362,19 @@ watch(
|
|||
|
||||
onMounted(async () => {
|
||||
await getData();
|
||||
store.genderOp.length === 0 ? await getGender() : "";
|
||||
store.relationshipOp.length === 0 ? await getRelationship() : "";
|
||||
store.religionOp.length === 0 ? await getReligion() : "";
|
||||
store.bloodGroupOp.length === 0 ? await getBloodGroup() : "";
|
||||
if (
|
||||
store.Ops.prefixOps.length === 0 ||
|
||||
store.Ops.genderOps.length === 0 ||
|
||||
store.Ops.bloodOps.length === 0 ||
|
||||
store.Ops.statusOps.length === 0 ||
|
||||
store.Ops.religionOps.length === 0
|
||||
) {
|
||||
await fetchPerson();
|
||||
}
|
||||
// store.genderOp.length === 0 ? await getGender() : "";
|
||||
// store.relationshipOp.length === 0 ? await getRelationship() : "";
|
||||
// store.religionOp.length === 0 ? await getReligion() : "";
|
||||
// store.bloodGroupOp.length === 0 ? await getBloodGroup() : "";
|
||||
});
|
||||
</script>
|
||||
<template>
|
||||
|
|
@ -487,12 +504,16 @@ onMounted(async () => {
|
|||
map-options
|
||||
hide-bottom-space
|
||||
input-debounce="0"
|
||||
new-value-mode="add-unique"
|
||||
option-label="name"
|
||||
option-value="id"
|
||||
v-model="formData.prefix"
|
||||
class="inputgreen"
|
||||
:options="store.prefixOp"
|
||||
:options="store.Ops.prefixOps"
|
||||
:label="dataLabel.prefix"
|
||||
:rules="[(val: string) => !!val || `${'กรุณาเลือก คำนำหน้าชื่อ'}`]"
|
||||
@filter="(inputValue: any,
|
||||
doneFn: Function) => filterSelector(inputValue, doneFn, 'prefixOps'
|
||||
)"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-6 col-sm-6 col-md-6">
|
||||
|
|
@ -590,7 +611,7 @@ onMounted(async () => {
|
|||
option-value="id"
|
||||
v-model="formData.genderId"
|
||||
class="inputgreen"
|
||||
:options="store.genderOp"
|
||||
:options="store.Ops.genderOps"
|
||||
:label="dataLabel.gender"
|
||||
/>
|
||||
</div>
|
||||
|
|
@ -608,7 +629,7 @@ onMounted(async () => {
|
|||
input-debounce="0"
|
||||
class="inputgreen"
|
||||
v-model="formData.relationshipId"
|
||||
:options="store.relationshipOp"
|
||||
:options="store.Ops.statusOps"
|
||||
:label="dataLabel.relationship"
|
||||
/>
|
||||
</div>
|
||||
|
|
@ -648,7 +669,7 @@ onMounted(async () => {
|
|||
input-debounce="0"
|
||||
v-model="formData.religionId"
|
||||
class="inputgreen"
|
||||
:options="store.religionOp"
|
||||
:options="store.Ops.religionOps"
|
||||
:label="dataLabel.religion"
|
||||
/>
|
||||
</div>
|
||||
|
|
@ -666,7 +687,7 @@ onMounted(async () => {
|
|||
input-debounce="0"
|
||||
v-model="formData.bloodGroupId"
|
||||
class="inputgreen"
|
||||
:options="store.bloodGroupOp"
|
||||
:options="store.Ops.bloodOps"
|
||||
:label="dataLabel.bloodGroup"
|
||||
/>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -6,11 +6,15 @@ import http from "@/plugins/http";
|
|||
import config from "@/app.config";
|
||||
|
||||
import type {
|
||||
Gender,
|
||||
Religion,
|
||||
Relationship,
|
||||
BloodGroup,
|
||||
} from "@/modules/04_registryNew/interface/response/Profile";
|
||||
DataOption,
|
||||
InformationOps,
|
||||
} from "@/modules/04_registryNew/interface/index/Main";
|
||||
// import type {
|
||||
// Gender,
|
||||
// Religion,
|
||||
// Relationship,
|
||||
// BloodGroup,
|
||||
// } from "@/modules/04_registryNew/interface/response/Profile";
|
||||
|
||||
export const useProfileDataStore = defineStore("profile", () => {
|
||||
const $q = useQuasar();
|
||||
|
|
@ -24,11 +28,45 @@ export const useProfileDataStore = defineStore("profile", () => {
|
|||
dateToISO,
|
||||
} = mixin;
|
||||
|
||||
const genderOp = ref<Gender[]>([]);
|
||||
const religionOp = ref<Religion[]>([]);
|
||||
const relationshipOp = ref<Relationship[]>([]);
|
||||
const bloodGroupOp = ref<BloodGroup[]>([]);
|
||||
const prefixOp = ref<string[]>(["นาย", "นาง", "นางสาว"]);
|
||||
const Ops = ref<InformationOps>({
|
||||
prefixOps: [],
|
||||
prefixOldOps: [],
|
||||
genderOps: [],
|
||||
bloodOps: [],
|
||||
statusOps: [],
|
||||
religionOps: [],
|
||||
employeeClassOps: [
|
||||
{ id: "perm", name: "ลูกจ้างประจำ" },
|
||||
{ id: "temp", name: "ลูกจ้างชั่วคราว" },
|
||||
],
|
||||
employeeTypeOps: [
|
||||
{ id: "gov", name: "งบประมาณเงินอุดหนุนรัฐบาล" },
|
||||
{ id: "bkk", name: "งบประมาณกรุงเทพมหานคร" },
|
||||
],
|
||||
});
|
||||
|
||||
const OpsFilter = ref<InformationOps>({
|
||||
prefixOps: [],
|
||||
prefixOldOps: [],
|
||||
genderOps: [],
|
||||
bloodOps: [],
|
||||
statusOps: [],
|
||||
religionOps: [],
|
||||
employeeClassOps: [
|
||||
{ id: "perm", name: "ลูกจ้างประจำ" },
|
||||
{ id: "temp", name: "ลูกจ้างชั่วคราว" },
|
||||
],
|
||||
employeeTypeOps: [
|
||||
{ id: "gov", name: "งบประมาณเงินอุดหนุนรัฐบาล" },
|
||||
{ id: "bkk", name: "งบประมาณกรุงเทพมหานคร" },
|
||||
],
|
||||
});
|
||||
|
||||
// const genderOp = ref<Gender[]>([]);
|
||||
// const religionOp = ref<Religion[]>([]);
|
||||
// const relationshipOp = ref<Relationship[]>([]);
|
||||
// const bloodGroupOp = ref<BloodGroup[]>([]);
|
||||
// const prefixOp = ref<string[]>(["นาย", "นาง", "นางสาว"]);
|
||||
|
||||
function calculateAge(birthDate: Date): string {
|
||||
const birthDateTimeStamp = new Date(birthDate).getTime();
|
||||
|
|
@ -47,77 +85,200 @@ export const useProfileDataStore = defineStore("profile", () => {
|
|||
return `${years} ปี ${months} เดือน ${days} วัน`;
|
||||
}
|
||||
|
||||
async function getGender() {
|
||||
const fetchPerson = async () => {
|
||||
showLoader();
|
||||
await http
|
||||
.get(config.API.profileNewGender)
|
||||
.get(config.API.person)
|
||||
.then((res) => {
|
||||
genderOp.value = res.data.result;
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
const data = res.data.result;
|
||||
let optionbloodGroups: DataOption[] = [];
|
||||
data.bloodGroups.map((r: any) => {
|
||||
optionbloodGroups.push({
|
||||
id: r.id.toString(),
|
||||
name: r.name.toString(),
|
||||
});
|
||||
});
|
||||
Ops.value.bloodOps = optionbloodGroups;
|
||||
OpsFilter.value.bloodOps = optionbloodGroups;
|
||||
|
||||
async function getRelationship() {
|
||||
showLoader();
|
||||
await http
|
||||
.get(config.API.profileNewRelationship)
|
||||
.then((res) => {
|
||||
relationshipOp.value = res.data.result;
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
let optiongenders: DataOption[] = [];
|
||||
data.genders.map((r: any) => {
|
||||
optiongenders.push({
|
||||
id: r.id.toString(),
|
||||
name: r.name.toString(),
|
||||
});
|
||||
});
|
||||
Ops.value.genderOps = optiongenders;
|
||||
OpsFilter.value.genderOps = optiongenders;
|
||||
|
||||
async function getReligion() {
|
||||
showLoader();
|
||||
await http
|
||||
.get(config.API.profileNewReligion)
|
||||
.then((res) => {
|
||||
religionOp.value = res.data.result;
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
let optionprefixs: DataOption[] = [];
|
||||
data.prefixs.map((r: any) => {
|
||||
optionprefixs.push({
|
||||
id: r.id.toString(),
|
||||
name: r.name.toString(),
|
||||
});
|
||||
});
|
||||
Ops.value.prefixOps = optionprefixs;
|
||||
OpsFilter.value.prefixOps = optionprefixs;
|
||||
|
||||
async function getBloodGroup() {
|
||||
showLoader();
|
||||
await http
|
||||
.get(config.API.profileNewBloodGroup)
|
||||
.then((res) => {
|
||||
bloodGroupOp.value = res.data.result;
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
let optionrelationships: DataOption[] = [];
|
||||
data.relationships.map((r: any) => {
|
||||
optionrelationships.push({
|
||||
id: r.id.toString(),
|
||||
name: r.name.toString(),
|
||||
});
|
||||
});
|
||||
Ops.value.statusOps = optionrelationships;
|
||||
OpsFilter.value.statusOps = optionrelationships;
|
||||
|
||||
let optionreligions: DataOption[] = [];
|
||||
data.religions.map((r: any) => {
|
||||
optionreligions.push({
|
||||
id: r.id.toString(),
|
||||
name: r.name.toString(),
|
||||
});
|
||||
});
|
||||
Ops.value.religionOps = optionreligions;
|
||||
OpsFilter.value.religionOps = optionreligions;
|
||||
})
|
||||
.catch((e: any) => {})
|
||||
.finally(() => {
|
||||
hideLoader();
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
const filterSelector = (val: any, update: Function, refData: string) => {
|
||||
switch (refData) {
|
||||
case "prefixOps":
|
||||
update(() => {
|
||||
Ops.value.prefixOps = OpsFilter.value.prefixOps.filter(
|
||||
(v: DataOption) => v.name.indexOf(val) > -1
|
||||
);
|
||||
});
|
||||
break;
|
||||
case "genderOps":
|
||||
update(() => {
|
||||
Ops.value.genderOps = OpsFilter.value.genderOps.filter(
|
||||
(v: DataOption) => v.name.indexOf(val) > -1
|
||||
);
|
||||
});
|
||||
break;
|
||||
case "bloodOps":
|
||||
update(() => {
|
||||
Ops.value.bloodOps = OpsFilter.value.bloodOps.filter(
|
||||
(v: DataOption) => v.name.indexOf(val) > -1
|
||||
);
|
||||
});
|
||||
break;
|
||||
case "statusOps":
|
||||
update(() => {
|
||||
Ops.value.statusOps = OpsFilter.value.statusOps.filter(
|
||||
(v: DataOption) => v.name.indexOf(val) > -1
|
||||
);
|
||||
});
|
||||
break;
|
||||
case "religionOps":
|
||||
update(() => {
|
||||
Ops.value.religionOps = OpsFilter.value.religionOps.filter(
|
||||
(v: DataOption) => v.name.indexOf(val) > -1
|
||||
);
|
||||
});
|
||||
break;
|
||||
case "employeeClassOps":
|
||||
update(() => {
|
||||
Ops.value.employeeClassOps = OpsFilter.value.employeeClassOps.filter(
|
||||
(v: DataOption) => v.name.indexOf(val) > -1
|
||||
);
|
||||
});
|
||||
break;
|
||||
case "employeeTypeOps":
|
||||
update(() => {
|
||||
Ops.value.employeeTypeOps = OpsFilter.value.employeeTypeOps.filter(
|
||||
(v: DataOption) => v.name.indexOf(val) > -1
|
||||
);
|
||||
});
|
||||
break;
|
||||
|
||||
default:
|
||||
break;
|
||||
}
|
||||
};
|
||||
|
||||
// async function getGender() {
|
||||
// showLoader();
|
||||
// await http
|
||||
// .get(config.API.profileNewGender)
|
||||
// .then((res) => {
|
||||
// genderOp.value = res.data.result;
|
||||
// })
|
||||
// .catch((e) => {
|
||||
// messageError($q, e);
|
||||
// })
|
||||
// .finally(() => {
|
||||
// hideLoader();
|
||||
// });
|
||||
// }
|
||||
|
||||
// async function getRelationship() {
|
||||
// showLoader();
|
||||
// await http
|
||||
// .get(config.API.profileNewRelationship)
|
||||
// .then((res) => {
|
||||
// relationshipOp.value = res.data.result;
|
||||
// })
|
||||
// .catch((e) => {
|
||||
// messageError($q, e);
|
||||
// })
|
||||
// .finally(() => {
|
||||
// hideLoader();
|
||||
// });
|
||||
// }
|
||||
|
||||
// async function getReligion() {
|
||||
// showLoader();
|
||||
// await http
|
||||
// .get(config.API.profileNewReligion)
|
||||
// .then((res) => {
|
||||
// religionOp.value = res.data.result;
|
||||
// })
|
||||
// .catch((e) => {
|
||||
// messageError($q, e);
|
||||
// })
|
||||
// .finally(() => {
|
||||
// hideLoader();
|
||||
// });
|
||||
// }
|
||||
|
||||
// async function getBloodGroup() {
|
||||
// showLoader();
|
||||
// await http
|
||||
// .get(config.API.profileNewBloodGroup)
|
||||
// .then((res) => {
|
||||
// bloodGroupOp.value = res.data.result;
|
||||
// })
|
||||
// .catch((e) => {
|
||||
// messageError($q, e);
|
||||
// })
|
||||
// .finally(() => {
|
||||
// hideLoader();
|
||||
// });
|
||||
// }
|
||||
|
||||
return {
|
||||
prefixOp,
|
||||
genderOp,
|
||||
religionOp,
|
||||
relationshipOp,
|
||||
bloodGroupOp,
|
||||
Ops,
|
||||
OpsFilter,
|
||||
// prefixOp,
|
||||
// genderOp,
|
||||
// religionOp,
|
||||
// relationshipOp,
|
||||
// bloodGroupOp,
|
||||
|
||||
calculateAge,
|
||||
getGender,
|
||||
getRelationship,
|
||||
getReligion,
|
||||
getBloodGroup,
|
||||
fetchPerson,
|
||||
filterSelector,
|
||||
// getGender,
|
||||
// getRelationship,
|
||||
// getReligion,
|
||||
// getBloodGroup,
|
||||
};
|
||||
});
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue