ข้อมูลบุคคล: ต่อAPI

This commit is contained in:
oat 2024-02-05 14:04:00 +07:00
parent 47e96ddec5
commit 338c2a3b7d
12 changed files with 415 additions and 198 deletions

View file

@ -14,6 +14,14 @@ const gender = `${env.API_URI}/metadata/gender/`;
const relationship = `${env.API_URI}/metadata/relationship/`;
const religion = `${env.API_URI}/metadata/religion/`;
const orgRelationship = `${env.API_URI}/org/relationship/`;
const orgPrefix = `${env.API_URI}/org/prefix/`;
const orgRank = `${env.API_URI}/org/rank/`;
const orgBloodGroup = `${env.API_URI}/org/bloodGroup/`;
const orgGender = `${env.API_URI}/org/gender/`;
const orgReligion = `${env.API_URI}/org/religion/`;
const orgEducationLevel = `${env.API_URI}/org/educationLevel/`;
export default {
person: `${person}person`,
@ -105,4 +113,20 @@ export default {
listEducationLevelHistoryId: (id: string) => `${educationLevel}history/${id}`,
listEducationLevelPublished: `${educationLevel}history/published`,
listEducationLevelPublishedHistory: `${educationLevel}history/published-history`,
// API ใหม่
orgRelationship,
orgRelationshipId: (id: string) => `${orgRelationship}${id}`,
orgPrefix,
orgPrefixId: (id: string) => `${orgPrefix}${id}`,
orgRank,
orgRankId: (id: string) => `${orgRank}${id}`,
orgBloodGroup,
orgBloodGroupId: (id: string) => `${orgBloodGroup}${id}`,
orgGender,
orgGenderId: (id: string) => `${orgGender}${id}`,
orgReligion,
orgReligionId: (id: string) => `${orgReligion}${id}`,
orgEducationLevel,
orgEducationLevelId: (id: string) => `${orgEducationLevel}${id}`,
};

View file

@ -2,17 +2,12 @@
import { ref, onMounted } from "vue";
import type { QTableProps } from "quasar";
import { useCounterMixin } from "@/stores/mixin";
import { useRouter } from "vue-router";
import { usePersonalDataStore } from "@/modules/01_metadataNew/stores/personalStore";
import dialogHeader from "@/components/DialogHeader.vue";
import { useQuasar } from "quasar";
import DialogForm from "@/modules/01_metadataNew/components/personal/DialogForm.vue";
const store = usePersonalDataStore();
const router = useRouter();
const mixin = useCounterMixin();
const { dialogRemove, dialogConfirm } = mixin;
const columns = ref<QTableProps["columns"]>([
import http from "@/plugins/http";
import config from "@/app.config";
const TABLE_COLUMNS = [
{
name: "prefix",
align: "left",
@ -57,13 +52,17 @@ const columns = ref<QTableProps["columns"]>([
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
]);
] as const satisfies QTableProps["columns"];
const $q = useQuasar();
const store = usePersonalDataStore();
const mixin = useCounterMixin();
const { dialogRemove, messageError, showLoader, hideLoader } = mixin;
const filterKeyword = ref<string>("");
const dialog = ref<boolean>(false);
const prefix = ref<string>("");
const editId = ref<string>("");
const dialogStatus = ref<string>("");
const personalName = ref<string>("คำนำหน้าชื่อ");
const visibleColumns = ref<string[]>([
@ -97,8 +96,43 @@ const data = [
},
];
async function fetchData() {
showLoader();
await http
.get(config.API.orgPrefix)
.then(async (res) => {
console.log(res.data.result);
store.save(res.data.result);
})
.catch((err) => {
messageError($q, err);
})
.finally(() => {
hideLoader();
});
}
async function addData() {
await http.post(config.API.orgPrefix, {
name: prefix.value,
});
fetchData();
}
async function editData(id: string) {
await http.put(config.API.orgPrefixId(id), {
name: prefix.value,
});
fetchData();
}
async function deleteData(id: string) {
await http.delete(config.API.orgPrefixId(id));
fetchData();
}
onMounted(async () => {
store.fetchData(data);
fetchData();
});
</script>
@ -130,7 +164,7 @@ onMounted(async () => {
:display-value="$q.lang.table.columns"
emit-value
map-options
:options="columns"
:options="TABLE_COLUMNS"
option-value="name"
options-cover
style="min-width: 150px"
@ -140,7 +174,7 @@ onMounted(async () => {
<d-table
ref="table"
:columns="columns"
:columns="TABLE_COLUMNS"
:rows="store.row"
:filter="filterKeyword"
row-key="name"
@ -162,9 +196,7 @@ onMounted(async () => {
<template v-slot:body="props">
<q-tr :props="props" class="cursor-pointer">
<q-td v-for="col in props.cols" :key="col.id">
<div>
{{ col.value }}
</div>
{{ col.value }}
</q-td>
<q-td auto-width>
<q-btn
@ -185,6 +217,8 @@ onMounted(async () => {
() => {
dialogStatus = 'edit';
dialog = true;
prefix = props.row.name;
editId = props.row.id;
}
"
>
@ -197,7 +231,12 @@ onMounted(async () => {
</q-item>
<q-item clickable>
<q-item-section
@click="dialogRemove($q, async () => {})"
@click="
dialogRemove(
$q,
async () => await deleteData(props.row.id)
)
"
v-close-popup
>
<div class="row items-center white">
@ -219,5 +258,9 @@ onMounted(async () => {
v-model:data="prefix"
v-model:personalName="personalName"
v-model:dialogStatus="dialogStatus"
v-model:editId="editId"
:addData="addData"
:fetch-data="fetchData"
:edit-data="editData"
/>
</template>

View file

@ -7,12 +7,9 @@ import { usePersonalDataStore } from "@/modules/01_metadataNew/stores/personalSt
import dialogHeader from "@/components/DialogHeader.vue";
import { useQuasar } from "quasar";
import DialogForm from "@/modules/01_metadataNew/components/personal/DialogForm.vue";
const store = usePersonalDataStore();
const router = useRouter();
const mixin = useCounterMixin();
const { dialogRemove, dialogConfirm } = mixin;
const columns = ref<QTableProps["columns"]>([
import http from "@/plugins/http";
import config from "@/app.config";
const columns = [
{
name: "rank",
align: "left",
@ -57,16 +54,21 @@ const columns = ref<QTableProps["columns"]>([
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
]);
] as const satisfies QTableProps["columns"];
const store = usePersonalDataStore();
const router = useRouter();
const mixin = useCounterMixin();
const { dialogRemove, messageError, showLoader, hideLoader } = mixin;
const $q = useQuasar();
const filterKeyword = ref<string>("");
const dialog = ref<boolean>(false);
const rank = ref<string>("");
const rankRef = ref<any>(null);
const dialogStatus = ref<string>("");
const personalName = ref<string>("ยศ");
const editId = ref<string>("");
const visibleColumns = ref<string[]>([
"rank",
"createdAt",
@ -74,32 +76,43 @@ const visibleColumns = ref<string[]>([
"lastUpdateFullName",
]);
const data = [
{
id: "1",
name: "ยศ 1",
createdAt: new Date(),
lastUpdatedAt: new Date(),
lastUpdateFullName: "สาวิตรี ศรีสมัย",
},
{
id: "2",
name: "ยศ 2",
createdAt: new Date(),
lastUpdatedAt: new Date(),
lastUpdateFullName: "System Administrator",
},
{
id: "3",
name: "ยศ 3",
createdAt: new Date(),
lastUpdatedAt: new Date(),
lastUpdateFullName: "คณะกรรมการ ตรวจรับ",
},
];
async function fetchData() {
showLoader();
await http
.get(config.API.orgRank)
.then(async (res) => {
console.log(res.data.result);
store.save(res.data.result);
})
.catch((err) => {
messageError($q, err);
})
.finally(() => {
hideLoader();
});
}
async function addData() {
await http.post(config.API.orgRank, {
name: rank.value,
});
fetchData();
}
async function editData(id: string) {
await http.put(config.API.orgRankId(id), {
name: rank.value,
});
fetchData();
}
async function deleteData(id: string) {
await http.delete(config.API.orgRankId(id));
fetchData();
}
onMounted(async () => {
store.fetchData(data);
fetchData();
});
</script>
@ -186,6 +199,8 @@ onMounted(async () => {
() => {
dialogStatus = 'edit';
dialog = true;
rank = props.row.name;
editId = props.row.id;
}
"
>
@ -198,7 +213,12 @@ onMounted(async () => {
</q-item>
<q-item clickable>
<q-item-section
@click="dialogRemove($q, async () => {})"
@click="
dialogRemove(
$q,
async () => await deleteData(props.row.id)
)
"
v-close-popup
>
<div class="row items-center white">
@ -220,5 +240,9 @@ onMounted(async () => {
v-model:data="rank"
v-model:personalName="personalName"
v-model:dialogStatus="dialogStatus"
v-model:editId="editId"
:addData="addData"
:fetch-data="fetchData"
:edit-data="editData"
/>
</template>

View file

@ -7,12 +7,14 @@ import { usePersonalDataStore } from "@/modules/01_metadataNew/stores/personalSt
import dialogHeader from "@/components/DialogHeader.vue";
import { useQuasar } from "quasar";
import DialogForm from "@/modules/01_metadataNew/components/personal/DialogForm.vue";
import http from "@/plugins/http";
import config from "@/app.config";
const store = usePersonalDataStore();
const router = useRouter();
const mixin = useCounterMixin();
const { dialogRemove, dialogConfirm } = mixin;
const columns = ref<QTableProps["columns"]>([
const { dialogRemove, messageError, showLoader, hideLoader } = mixin;
const columns = [
{
name: "bloodGroup",
align: "left",
@ -57,14 +59,14 @@ const columns = ref<QTableProps["columns"]>([
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
]);
] as const satisfies QTableProps["columns"];
const $q = useQuasar();
const filterKeyword = ref<string>("");
const dialog = ref<boolean>(false);
const editId = ref<string>("");
const bloodGroup = ref<string>("");
const bloodGroupRef = ref<any>(null);
const dialogStatus = ref<string>("");
const personalName = ref<string>("กลุ่มเลือด");
const visibleColumns = ref<string[]>([
@ -74,32 +76,43 @@ const visibleColumns = ref<string[]>([
"lastUpdateFullName",
]);
const data = [
{
id: "1",
name: "A",
createdAt: new Date(),
lastUpdatedAt: new Date(),
lastUpdateFullName: "สาวิตรี ศรีสมัย",
},
{
id: "2",
name: "AB",
createdAt: new Date(),
lastUpdatedAt: new Date(),
lastUpdateFullName: "System Administrator",
},
{
id: "3",
name: "O",
createdAt: new Date(),
lastUpdatedAt: new Date(),
lastUpdateFullName: "คณะกรรมการ ตรวจรับ",
},
];
async function fetchData() {
showLoader();
await http
.get(config.API.orgBloodGroup)
.then(async (res) => {
console.log(res.data.result);
store.save(res.data.result);
})
.catch((err) => {
messageError($q, err);
})
.finally(() => {
hideLoader();
});
}
async function addData() {
await http.post(config.API.orgBloodGroup, {
name: bloodGroup.value,
});
fetchData();
}
async function editData(id: string) {
await http.put(config.API.orgBloodGroupId(id), {
name: bloodGroup.value,
});
fetchData();
}
async function deleteData(id: string) {
await http.delete(config.API.orgBloodGroupId(id));
fetchData();
}
onMounted(async () => {
store.fetchData(data);
fetchData();
});
</script>
@ -186,6 +199,8 @@ onMounted(async () => {
() => {
dialogStatus = 'edit';
dialog = true;
bloodGroup = props.row.name;
editId = props.row.id;
}
"
>
@ -198,7 +213,12 @@ onMounted(async () => {
</q-item>
<q-item clickable>
<q-item-section
@click="dialogRemove($q, async () => {})"
@click="
dialogRemove(
$q,
async () => await deleteData(props.row.id)
)
"
v-close-popup
>
<div class="row items-center white">
@ -220,5 +240,9 @@ onMounted(async () => {
v-model:data="bloodGroup"
v-model:personalName="personalName"
v-model:dialogStatus="dialogStatus"
v-model:editId="editId"
:addData="addData"
:fetch-data="fetchData"
:edit-data="editData"
/>
</template>

View file

@ -7,12 +7,14 @@ import { usePersonalDataStore } from "@/modules/01_metadataNew/stores/personalSt
import dialogHeader from "@/components/DialogHeader.vue";
import { useQuasar } from "quasar";
import DialogForm from "@/modules/01_metadataNew/components/personal/DialogForm.vue";
import http from "@/plugins/http";
import config from "@/app.config";
const store = usePersonalDataStore();
const router = useRouter();
const mixin = useCounterMixin();
const { dialogRemove, dialogConfirm } = mixin;
const columns = ref<QTableProps["columns"]>([
const { dialogRemove, messageError, showLoader, hideLoader } = mixin;
const columns = [
{
name: "gender",
align: "left",
@ -57,14 +59,14 @@ const columns = ref<QTableProps["columns"]>([
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
]);
] as const satisfies QTableProps["columns"];
const $q = useQuasar();
const filterKeyword = ref<string>("");
const dialog = ref<boolean>(false);
const gender = ref<string>("");
const genderRef = ref<any>(null);
const editId = ref<string>("");
const dialogStatus = ref<string>("");
const personalName = ref<string>("เพศ");
const visibleColumns = ref<string[]>([
@ -74,32 +76,43 @@ const visibleColumns = ref<string[]>([
"lastUpdateFullName",
]);
const data = [
{
id: "1",
name: "ชาย",
createdAt: new Date(),
lastUpdatedAt: new Date(),
lastUpdateFullName: "สาวิตรี ศรีสมัย",
},
{
id: "2",
name: "หญิง",
createdAt: new Date(),
lastUpdatedAt: new Date(),
lastUpdateFullName: "System Administrator",
},
{
id: "3",
name: "เพศทางเลือก",
createdAt: new Date(),
lastUpdatedAt: new Date(),
lastUpdateFullName: "คณะกรรมการ ตรวจรับ",
},
];
async function fetchData() {
showLoader();
await http
.get(config.API.orgGender)
.then(async (res) => {
console.log(res.data.result);
store.save(res.data.result);
})
.catch((err) => {
messageError($q, err);
})
.finally(() => {
hideLoader();
});
}
async function addData() {
await http.post(config.API.orgGender, {
name: gender.value,
});
fetchData();
}
async function editData(id: string) {
await http.put(config.API.orgGenderId(id), {
name: gender.value,
});
fetchData();
}
async function deleteData(id: string) {
await http.delete(config.API.orgGenderId(id));
fetchData();
}
onMounted(async () => {
store.fetchData(data);
fetchData();
});
</script>
@ -186,6 +199,8 @@ onMounted(async () => {
() => {
dialogStatus = 'edit';
dialog = true;
gender = props.row.name;
editId = props.row.id;
}
"
>
@ -198,7 +213,12 @@ onMounted(async () => {
</q-item>
<q-item clickable>
<q-item-section
@click="dialogRemove($q, async () => {})"
@click="
dialogRemove(
$q,
async () => await deleteData(props.row.id)
)
"
v-close-popup
>
<div class="row items-center white">
@ -220,5 +240,9 @@ onMounted(async () => {
v-model:data="gender"
v-model:personalName="personalName"
v-model:dialogStatus="dialogStatus"
v-model:editId="editId"
:addData="addData"
:fetch-data="fetchData"
:edit-data="editData"
/>
</template>

View file

@ -7,12 +7,14 @@ import { usePersonalDataStore } from "@/modules/01_metadataNew/stores/personalSt
import dialogHeader from "@/components/DialogHeader.vue";
import { useQuasar } from "quasar";
import DialogForm from "@/modules/01_metadataNew/components/personal/DialogForm.vue";
import http from "@/plugins/http";
import config from "@/app.config";
const store = usePersonalDataStore();
const router = useRouter();
const mixin = useCounterMixin();
const { dialogRemove, dialogConfirm } = mixin;
const columns = ref<QTableProps["columns"]>([
const { dialogRemove, messageError, showLoader, hideLoader } = mixin;
const columns = [
{
name: "religion",
align: "left",
@ -57,14 +59,14 @@ const columns = ref<QTableProps["columns"]>([
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
]);
] as const satisfies QTableProps["columns"];
const $q = useQuasar();
const filterKeyword = ref<string>("");
const dialog = ref<boolean>(false);
const religion = ref<string>("");
const religionRef = ref<any>(null);
const editId = ref<string>("");
const dialogStatus = ref<string>("");
const personalName = ref<string>("ศาสนา");
const visibleColumns = ref<string[]>([
@ -74,39 +76,43 @@ const visibleColumns = ref<string[]>([
"lastUpdateFullName",
]);
const data = [
{
id: "1",
name: "อิสลาม",
createdAt: new Date(),
lastUpdatedAt: new Date(),
lastUpdateFullName: "สาวิตรี ศรีสมัย",
},
{
id: "2",
name: "พุทธ",
createdAt: new Date(),
lastUpdatedAt: new Date(),
lastUpdateFullName: "System Administrator",
},
{
id: "3",
name: "ขงจื้อ",
createdAt: new Date(),
lastUpdatedAt: new Date(),
lastUpdateFullName: "คณะกรรมการ ตรวจรับ",
},
{
id: "4",
name: "คริสต์",
createdAt: new Date(),
lastUpdatedAt: new Date(),
lastUpdateFullName: "คณะกรรมการ ตรวจรับ",
},
];
async function fetchData() {
showLoader();
await http
.get(config.API.orgReligion)
.then(async (res) => {
console.log(res.data.result);
store.save(res.data.result);
})
.catch((err) => {
messageError($q, err);
})
.finally(() => {
hideLoader();
});
}
async function addData() {
await http.post(config.API.orgReligion, {
name: religion.value,
});
fetchData();
}
async function editData(id: string) {
await http.put(config.API.orgReligionId(id), {
name: religion.value,
});
fetchData();
}
async function deleteData(id: string) {
await http.delete(config.API.orgReligionId(id));
fetchData();
}
onMounted(async () => {
store.fetchData(data);
fetchData();
});
</script>
@ -193,6 +199,8 @@ onMounted(async () => {
() => {
dialogStatus = 'edit';
dialog = true;
religion = props.row.name;
editId = props.row.id;
}
"
>
@ -205,7 +213,12 @@ onMounted(async () => {
</q-item>
<q-item clickable>
<q-item-section
@click="dialogRemove($q, async () => {})"
@click="
dialogRemove(
$q,
async () => await deleteData(props.row.id)
)
"
v-close-popup
>
<div class="row items-center white">
@ -227,5 +240,9 @@ onMounted(async () => {
v-model:data="religion"
v-model:personalName="personalName"
v-model:dialogStatus="dialogStatus"
v-model:editId="editId"
:addData="addData"
:fetch-data="fetchData"
:edit-data="editData"
/>
</template>

View file

@ -4,15 +4,16 @@ import type { QTableProps } from "quasar";
import { useCounterMixin } from "@/stores/mixin";
import { useRouter } from "vue-router";
import { usePersonalDataStore } from "@/modules/01_metadataNew/stores/personalStore";
import dialogHeader from "@/components/DialogHeader.vue";
import { useQuasar } from "quasar";
import DialogForm from "@/modules/01_metadataNew/components/personal/DialogForm.vue";
import http from "@/plugins/http";
import config from "@/app.config";
const store = usePersonalDataStore();
const router = useRouter();
const mixin = useCounterMixin();
const { dialogRemove, dialogConfirm } = mixin;
const columns = ref<QTableProps["columns"]>([
const { dialogRemove, messageError, showLoader, hideLoader } = mixin;
const columns = [
{
name: "relationship",
align: "left",
@ -57,14 +58,13 @@ const columns = ref<QTableProps["columns"]>([
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
]);
] as const satisfies QTableProps["columns"];
const $q = useQuasar();
const filterKeyword = ref<string>("");
const dialog = ref<boolean>(false);
const relationship = ref<string>("");
const relationshipRef = ref<any>(null);
const dialogStatus = ref<string>("");
const personalName = ref<string>("สถานภาพ");
const visibleColumns = ref<string[]>([
@ -73,7 +73,7 @@ const visibleColumns = ref<string[]>([
"lastUpdatedAt",
"lastUpdateFullName",
]);
const editId = ref<string>("");
const data = [
{
id: "1",
@ -105,8 +105,43 @@ const data = [
},
];
async function fetchData() {
showLoader();
await http
.get(config.API.orgRelationship)
.then(async (res) => {
console.log(res.data.result);
store.save(res.data.result);
})
.catch((err) => {
messageError($q, err);
})
.finally(() => {
hideLoader();
});
}
async function addData() {
await http.post(config.API.orgRelationship, {
name: relationship.value,
});
fetchData();
}
async function editData(id: string) {
await http.put(config.API.orgRelationshipId(id), {
name: relationship.value,
});
fetchData();
}
async function deleteData(id: string) {
await http.delete(config.API.orgRelationshipId(id));
fetchData();
}
onMounted(async () => {
store.fetchData(data);
fetchData();
});
</script>
@ -193,6 +228,7 @@ onMounted(async () => {
() => {
dialogStatus = 'edit';
dialog = true;
editId = props.row.id;
}
"
>
@ -205,7 +241,12 @@ onMounted(async () => {
</q-item>
<q-item clickable>
<q-item-section
@click="dialogRemove($q, async () => {})"
@click="
dialogRemove(
$q,
async () => await deleteData(props.row.id)
)
"
v-close-popup
>
<div class="row items-center white">
@ -227,5 +268,9 @@ onMounted(async () => {
v-model:data="relationship"
v-model:personalName="personalName"
v-model:dialogStatus="dialogStatus"
v-model:editId="editId"
:addData="addData"
:fetch-data="fetchData"
:edit-data="editData"
/>
</template>

View file

@ -6,11 +6,13 @@ import { useRouter } from "vue-router";
import { usePersonalDataStore } from "@/modules/01_metadataNew/stores/personalStore";
import { useQuasar } from "quasar";
import DialogForm from "@/modules/01_metadataNew/components/personal/DialogForm.vue";
import http from "@/plugins/http";
import config from "@/app.config";
const store = usePersonalDataStore();
const mixin = useCounterMixin();
const { dialogRemove } = mixin;
const columns = ref<QTableProps["columns"]>([
const { dialogRemove, messageError, showLoader, hideLoader } = mixin;
const columns = [
{
name: "name",
align: "left",
@ -66,7 +68,7 @@ const columns = ref<QTableProps["columns"]>([
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
]);
] as const satisfies QTableProps["columns"];
const $q = useQuasar();
@ -84,43 +86,45 @@ const visibleColumns = ref<string[]>([
"lastUpdateFullName",
]);
const data = [
{
id: "1",
name: "เคยสมรสแต่ไม่ทราบสถานภาพสมรส",
rank: 1,
createdAt: new Date(),
lastUpdatedAt: new Date(),
lastUpdateFullName: "สาวิตรี ศรีสมัย",
},
{
id: "2",
name: "สมรส",
rank: 2,
createdAt: new Date(),
lastUpdatedAt: new Date(),
lastUpdateFullName: "System Administrator",
},
{
id: "3",
name: "แยกกันอยู่",
rank: 3,
createdAt: new Date(),
lastUpdatedAt: new Date(),
lastUpdateFullName: "คณะกรรมการ ตรวจรับ",
},
{
id: "4",
name: "โสด",
rank: 4,
createdAt: new Date(),
lastUpdatedAt: new Date(),
lastUpdateFullName: "คณะกรรมการ ตรวจรับ",
},
];
async function fetchData() {
showLoader();
await http
.get(config.API.orgEducationLevel)
.then(async (res) => {
console.log(res.data.result);
store.save(res.data.result);
})
.catch((err) => {
messageError($q, err);
})
.finally(() => {
hideLoader();
});
}
async function addData() {
await http.post(config.API.orgEducationLevel, {
name: educationLevel.value,
rank: educationRank.value,
});
fetchData();
}
async function editData(id: string) {
await http.put(config.API.orgEducationLevelId(id), {
name: educationLevel.value,
rank: educationRank.value,
});
fetchData();
}
async function deleteData(id: string) {
await http.delete(config.API.orgEducationLevelId(id));
fetchData();
}
onMounted(async () => {
store.fetchData(data);
fetchData();
});
</script>
@ -242,5 +246,9 @@ onMounted(async () => {
v-model:data="educationLevel"
v-model:personalName="personalName"
v-model:dialogStatus="dialogStatus"
v-model:editId="editId"
:addData="addData"
:fetch-data="fetchData"
:edit-data="editData"
/>
</template>

View file

@ -2,13 +2,14 @@
import { ref } from "vue";
import { useCounterMixin } from "@/stores/mixin";
import dialogHeader from "@/components/DialogHeader.vue";
import { useQuasar } from "quasar";
import { QInput, useQuasar } from "quasar";
const $q = useQuasar();
const mixin = useCounterMixin();
const { dialogConfirm } = mixin;
const dataRef = ref<any>(null);
const dataRef = ref<QInput | null>(null);
const educationRankRef = ref<QInput | null>(null);
const data = defineModel<string>("data", {
required: true,
});
@ -16,7 +17,7 @@ const personalName = defineModel<string>("personalName");
const dialogStatus = defineModel<string>("dialogStatus");
const editId = defineModel<string>("editId");
const dialog = defineModel<boolean>("dialog");
const educationRank = defineModel<any>("rank");
const educationRank = defineModel<number>("rank");
const props = defineProps({
fetchData: {
type: Function,
@ -36,8 +37,8 @@ function closeDialog() {
}
function validateForm() {
dataRef.value.validate();
educationRank.value.validate();
dataRef.value?.validate();
educationRankRef.value?.validate();
onSubmit();
}
@ -98,6 +99,7 @@ async function onSubmit() {
type="number"
lazy-rules
borderless
min="1"
class="col-12 bg-white q-ma-md"
:rules="[(val) => val != undefined || 'กรุณากรอกลำดับ']"
hide-bottom-space

View file

@ -4,11 +4,12 @@ interface DataResponse {
lastUpdateFullName: String;
lastUpdatedAt: Date;
prefix?: string;
rank?: string;
rank?: number;
bloodgroup?: string;
gender?: string;
religion?: string;
relationship?: string;
name?: string;
}
interface DataRow {
@ -17,11 +18,12 @@ interface DataRow {
lastUpdateFullName: String;
lastUpdatedAt: string | null;
prefix?: string;
rank?: string;
rank?: number;
bloodgroup?: string;
gender?: string;
religion?: string;
relationship?: string;
name?: string;
}
export type { DataResponse, DataRow };

View file

@ -10,7 +10,8 @@ const { date2Thai } = useCounterMixin();
export const usePersonalDataStore = defineStore("PersonalData", () => {
const row = ref<DataRow[]>([]);
function fetchData(data: DataResponse[]) {
function save(data: DataResponse[]) {
const list = data.map((e) => ({
...e,
createdAt: e.createdAt ? date2Thai(e.createdAt) : "",
@ -19,7 +20,7 @@ export const usePersonalDataStore = defineStore("PersonalData", () => {
row.value = list;
}
return {
fetchData,
save,
row,
};
});

View file

@ -6,6 +6,7 @@ import ListBloodGroup from "@/modules/01_metadataNew/components/personal/03ListB
import ListGender from "@/modules/01_metadataNew/components/personal/04ListGender.vue";
import ListReligion from "@/modules/01_metadataNew/components/personal/05ListReligion.vue";
import ListRelationship from "@/modules/01_metadataNew/components/personal/06ListRelationship.vue";
import ListEducation from "@/modules/01_metadataNew/components/personal/07ListEducationLevel.vue";
const currentTab = ref<string>("list_prefix");
const tabs = ref<Array<any>>([]);
@ -18,6 +19,7 @@ onMounted(() => {
{ label: "เพศ", value: "list_gender" },
{ label: "ศาสนา", value: "list_religion" },
{ label: "สถานภาพ", value: "list_relationship" },
{ label: "ระดับการศึกษา", value: "list_education" },
];
tabs.value = tabsPerson;
});
@ -57,6 +59,7 @@ onMounted(() => {
<ListGender v-if="currentTab == 'list_gender'" />
<ListReligion v-if="currentTab == 'list_religion'" />
<ListRelationship v-if="currentTab == 'list_relationship'" />
<ListEducation v-if="currentTab == 'list_education'" />
</div>
</div>
</q-card>