แสดงข้อมูล แขวง/ตำบล

src/api/manage/api.person.ts

@@ -22,9 +22,9 @@ const orgGender = `${env.API_URI}/org/metadata/gender/`;
 const orgReligion = `${env.API_URI}/org/metadata/religion/`;
 const orgEducationLevel = `${env.API_URI}/org/metadata/educationLevel/`;
 
-const orgProvince = `${env.API_URI}/org/metadata/province/`;
-const orgDistrict = `${env.API_URI}/org/metadata/district/`;
-const orgSubDistrict = `${env.API_URI}/org/metadata/subDistrict/`;
+const orgProvince = `${env.API_URI}/org/metadata/province`;
+const orgDistrict = `${env.API_URI}/org/metadata/district`;
+const orgSubDistrict = `${env.API_URI}/org/metadata/subDistrict`;
 
 export default {
   person: `${person}person`,

src/modules/01_metadataNew/components/personal/DialogForm.vue

@@ -9,6 +9,7 @@ const mixin = useCounterMixin();
 const { dialogConfirm } = mixin;
 
 const dataRef = ref<QInput | null>(null);
+const zipCodeRef = ref<QInput | null>(null);
 const educationRankRef = ref<QInput | null>(null);
 const data = defineModel<string>("data", {
   required: true,
@@ -18,6 +19,7 @@ const dialogStatus = defineModel<string>("dialogStatus");
 const editId = defineModel<string>("editId");
 const dialog = defineModel<boolean>("dialog");
 const educationRank = defineModel<number>("educationRank");
+const zipCode = defineModel<string>("zipCode");
 const props = defineProps({
   fetchData: {
     type: Function,
@@ -38,6 +40,7 @@ function closeDialog() {
 
 function validateForm() {
   dataRef.value?.validate();
+  zipCodeRef.value?.validate();
   educationRankRef.value?.validate();
   onSubmit();
 }
@@ -109,6 +112,23 @@ async function onSubmit() {
             />
           </div>
         </q-card-section>
+        <q-card-section class="q-pa-none" v-if="personalName === 'แขวง/ตำบล'">
+          <div class="col-12 q-ma-md">
+            <q-input
+              ref="zipCodeRef"
+              outlined
+              v-model="zipCode"
+              label="รหัสไปรษณีย์"
+              dense
+              class="inputgreen"
+              lazy-rules
+              borderless
+              :rules="[(val) => val.length > 0 || 'กรุณากรอกรหัสไปรษณีย์']"
+              hide-bottom-space
+              mask="#####"
+            />
+          </div>
+        </q-card-section>
         <q-separator color="grey-4" />
         <q-card-actions align="right">
           <q-btn

src/modules/01_metadataNew/components/personal/province/01_District.vue

@@ -72,7 +72,7 @@ const district = ref<string>("");
 const rows = ref<FormDistrict[]>([])
 
 const dialogStatus = ref<string>("");
-const personalName = ref<string>("อำเภอ");
+const personalName = ref<string>("เขต/อำเภอ");
 const visibleColumns = ref<string[]>([
   "name",
   "createdAt",
@@ -83,7 +83,7 @@ const visibleColumns = ref<string[]>([
 async function fetchData() {
   showLoader();
   await http
-    .get(config.API.orgProvince+`${id.value}`)
+    .get(config.API.orgProvince+`/${id.value}`)
     .then(async (res) => {
       const data = res.data.result.districts
       const list = data.map((e:any) => ({
@@ -105,7 +105,6 @@ async function addData() {
   await http
     .post(config.API.orgDistrict, {
       name: district.value,
-      provinceId:id.value
     })
     .then(() => {
       fetchData();
@@ -121,7 +120,7 @@ async function addData() {
 
 async function editData(id: string) {
   await http
-    .put(config.API.orgDistrict + `${id}`, {
+    .put(config.API.orgDistrict + `/${id}`, {
       name: district.value,
     })
     .then(() => {
@@ -138,7 +137,7 @@ async function editData(id: string) {
 
 async function deleteData(id: string) {
   await http
-    .delete(config.API.orgDistrict + `${id}`)
+    .delete(config.API.orgDistrict + `/${id}`)
     .then(() => {
       fetchData();
       success($q, "ลบข้อมูลสำเร็จ");

src/modules/01_metadataNew/components/personal/province/02_SubDistrict.vue

@@ -8,13 +8,16 @@ import { useQuasar } from "quasar";
 import DialogForm from "@/modules/01_metadataNew/components/personal/DialogForm.vue";
 import http from "@/plugins/http";
 import config from "@/app.config";
+import type{ FormSubDistrict } from '@/modules/01_metadataNew/interface/response/personal/personal'
 
+const rows = ref<FormSubDistrict[]>([])
 const router = useRouter();
 const route = useRoute();
 const id = ref<string>(route.params.id as string)
+const idProvince = ref<string>(route.params.provinceId as string)
 const store = usePersonalDataStore();
 const mixin = useCounterMixin();
-const { dialogRemove, messageError, showLoader, hideLoader, success } = mixin;
+const { dialogRemove, messageError, showLoader, hideLoader, success,date2Thai } = mixin;
 const columns = [
   {
     name: "name",
@@ -66,10 +69,11 @@ const $q = useQuasar();
 const editId = ref<string>("");
 const filterKeyword = ref<string>("");
 const dialog = ref<boolean>(false);
-const province = ref<string>("");
+const subDistrict = ref<string>("");
+const zipCode = ref<string>("");
 
 const dialogStatus = ref<string>("");
-const personalName = ref<string>("อำเภอ");
+const personalName = ref<string>("แขวง/ตำบล");
 const visibleColumns = ref<string[]>([
   "name",
   "createdAt",
@@ -80,9 +84,15 @@ const visibleColumns = ref<string[]>([
 async function fetchData() {
   showLoader();
   await http
-    .get(config.API.orgDistrict+`${id.value}`)
+    .get(config.API.orgDistrict+`/${id.value}`)
     .then(async (res) => {
-      store.save(res.data.result);
+      const data = res.data.result.subDistricts
+      const list = data.map((e:any) => ({
+      ...e,
+      createdAt: e.createdAt ? date2Thai(e.createdAt) : "",
+      lastUpdatedAt: e.lastUpdatedAt ? date2Thai(e.lastUpdatedAt) : "",
+    }));
+      rows.value = list
     })
     .catch((err) => {
       messageError($q, err);
@@ -94,8 +104,8 @@ async function fetchData() {
 
 async function addData() {
   await http
-    .post(config.API.orgDistrict, {
-      name: province.value,
+    .post(config.API.orgSubDistrict, {
+      name: subDistrict.value,
     })
     .then(() => {
       fetchData();
@@ -111,8 +121,9 @@ async function addData() {
 
 async function editData(id: string) {
   await http
-    .put(config.API.orgDistrict + `${id}`, {
-      name: province.value,
+    .put(config.API.orgSubDistrict + `/${id}`, {
+      name: subDistrict.value,
+      zipCode: zipCode.value,
     })
     .then(() => {
       fetchData();
@@ -128,7 +139,7 @@ async function editData(id: string) {
 
 async function deleteData(id: string) {
   await http
-    .delete(config.API.orgDistrict + `${id}`)
+    .delete(config.API.orgSubDistrict + `/${id}`)
     .then(() => {
       fetchData();
       success($q, "ลบข้อมูลสำเร็จ");
@@ -141,9 +152,6 @@ async function deleteData(id: string) {
     });
 }
 
-function nextPage(id: string) {
-  router.push(`/master-data/personal/sub-district/${id}`);
-}
 
 onMounted(async () => {
   fetchData();
@@ -178,7 +186,8 @@ onMounted(async () => {
             () => {
               dialogStatus = 'create';
               dialog = true;
-              province = '';
+              subDistrict = '';
+              zipCode = ''
             }
           "
         >
@@ -212,7 +221,7 @@ onMounted(async () => {
       <d-table
         ref="table"
         :columns="columns"
-        :rows="store.row"
+        :rows="rows"
         :filter="filterKeyword"
         row-key="name"
         flat
@@ -235,7 +244,6 @@ onMounted(async () => {
             <q-td
               v-for="col in props.cols"
               :key="col.id"
-              @click="nextPage(props.row.id)"
             >
               <div>
                 {{ col.value }}
@@ -256,7 +264,8 @@ onMounted(async () => {
                     dialogStatus = 'edit';
                     dialog = true;
                     editId = props.row.id;
-                    province = props.row.name;
+                    subDistrict = props.row.name;
+                    zipCode = props.row.zipCode;
                   }
                 "
               >
@@ -286,7 +295,8 @@ onMounted(async () => {
 
   <DialogForm
     v-model:dialog="dialog"
-    v-model:data="province"
+    v-model:data="subDistrict"
+    v-model:zipCode="zipCode"
     v-model:personalName="personalName"
     v-model:dialogStatus="dialogStatus"
     v-model:editId="editId"

src/modules/01_metadataNew/interface/response/personal/personal.ts

@@ -28,11 +28,17 @@ interface DataRow {
 
 interface FormDistrict {
   id: string;
+  createdAt: string;
+  createdUserId: string;
+  lastUpdatedAt: string;
+  lastUpdateUserId: string;
+  createdFullName: string;
+  lastUpdateFullName: string;
   name: string;
-  districts: District[];
+  provinceId: string;
 }
 
-interface District {
+interface FormSubDistrict {
   id: string;
   createdAt: string;
   createdUserId: string;
@@ -43,4 +49,4 @@ interface District {
   name: string;
   provinceId: string;
 }
-export type { DataResponse, DataRow,FormDistrict,District };
+export type { DataResponse, DataRow,FormDistrict,FormSubDistrict };