From 1a8be5ac34917e18bc352eb65f9f2f184125f988 Mon Sep 17 00:00:00 2001 From: puriphatt Date: Tue, 8 Apr 2025 12:10:13 +0700 Subject: [PATCH] refactor: add contact information fields to agency forms and update data models --- .../FormBasicInfoAgencies.vue | 77 ++++++++++++++++++- .../07_agencies-management/AgenciesDialog.vue | 61 +++++++++++++-- src/pages/07_agencies-management/MainPage.vue | 38 +++++++++ 3 files changed, 167 insertions(+), 9 deletions(-) diff --git a/src/components/07_agencies-management/FormBasicInfoAgencies.vue b/src/components/07_agencies-management/FormBasicInfoAgencies.vue index dbf9d568..f01bed38 100644 --- a/src/components/07_agencies-management/FormBasicInfoAgencies.vue +++ b/src/components/07_agencies-management/FormBasicInfoAgencies.vue @@ -14,6 +14,9 @@ defineProps<{ const group = defineModel('group', { default: '' }); const name = defineModel('name', { default: '' }); const nameEn = defineModel('nameEn', { default: '' }); +const contactName = defineModel('contactName', { default: '' }); +const email = defineModel('email', { default: '' }); +const contactTel = defineModel('contactTel', { default: '' }); type Options = { label: string; value: string }; @@ -35,7 +38,7 @@ type Options = { label: string; value: string };
+ + + + + + + +
diff --git a/src/pages/07_agencies-management/AgenciesDialog.vue b/src/pages/07_agencies-management/AgenciesDialog.vue index 3e2d4c77..91b93c31 100644 --- a/src/pages/07_agencies-management/AgenciesDialog.vue +++ b/src/pages/07_agencies-management/AgenciesDialog.vue @@ -10,6 +10,7 @@ import DrawerInfo from 'src/components/DrawerInfo.vue'; import DialogForm from 'src/components/DialogForm.vue'; import ProfileBanner from 'src/components/ProfileBanner.vue'; import SideMenu from 'src/components/SideMenu.vue'; +import FormBank from 'src/components/01_branch-management/FormBank.vue'; import FormBasicInfoAgencies from 'src/components/07_agencies-management/FormBasicInfoAgencies.vue'; import { UndoButton, @@ -19,6 +20,7 @@ import { } from 'src/components/button'; import AddressForm from 'src/components/form/AddressForm.vue'; import ImageUploadDialog from 'src/components/ImageUploadDialog.vue'; +import { BankBook } from 'src/stores/branch/types'; const institutionStore = useInstitution(); @@ -73,6 +75,9 @@ const data = defineModel('data', { group: '', name: '', nameEN: '', + contactName: '', + contactEmail: '', + contactTel: '', code: '', addressEN: '', address: '', @@ -88,6 +93,19 @@ const data = defineModel('data', { selectedImage: '', }, }); +const formBankBook = defineModel('formBankBook', { + default: [ + { + bankName: '', + accountNumber: '', + bankBranch: '', + accountName: '', + accountType: '', + currentlyUse: true, + bankUrl: '', + }, + ], +}); function viewImage() { imageState.imageDialog = true; @@ -237,11 +255,15 @@ watch( :menu="[ { name: $t('form.field.basicInformation'), - anchor: 'agencies-basic-info', + anchor: 'agencies-form-basic-info', }, { name: $t('general.address'), - anchor: 'agencies-address-info', + anchor: 'agencies-form-address-info', + }, + { + name: $t('agencies.bankInfo'), + anchor: 'agencies-form-bank-info', }, ]" background="transparent" @@ -275,14 +297,17 @@ watch( + @@ -427,13 +460,17 @@ watch( name: $t('general.address'), anchor: 'agencies-address-info', }, + { + name: $t('agencies.bankInfo'), + anchor: 'agencies-bank-info', + }, ]" background="transparent" :active="{ background: 'hsla(var(--blue-6-hsl) / .2)', foreground: 'var(--blue-6)', }" - scroll-element="#agencies-form-content" + scroll-element="#agencies-view-content" /> @@ -444,7 +481,7 @@ watch( 'q-py-md q-pr-md ': $q.screen.gt.sm, 'q-pa-sm': !$q.screen.gt.sm, }" - id="user-form-content" + id="agencies-view-content" style="height: 100%; max-height: 100; overflow-y: auto" > + diff --git a/src/pages/07_agencies-management/MainPage.vue b/src/pages/07_agencies-management/MainPage.vue index 8025ea58..e828fe39 100644 --- a/src/pages/07_agencies-management/MainPage.vue +++ b/src/pages/07_agencies-management/MainPage.vue @@ -85,6 +85,9 @@ const blankFormData: InstitutionPayload = { code: '', name: '', nameEN: '', + contactName: '', + contactEmail: '', + contactTel: '', addressEN: '', address: '', soi: '', @@ -98,6 +101,16 @@ const blankFormData: InstitutionPayload = { provinceId: '', selectedImage: '', status: 'CREATED', + bank: [ + { + bankName: '', + accountNumber: '', + bankBranch: '', + accountName: '', + accountType: '', + currentlyUse: true, + }, + ], }; const statusFilter = ref<'all' | 'statusACTIVE' | 'statusINACTIVE'>('all'); @@ -160,6 +173,19 @@ function assignFormData(data: Institution) { provinceId: data.provinceId, selectedImage: data.selectedImage, status: data.status, + contactEmail: data.contactEmail, + contactName: data.contactName, + contactTel: data.contactTel, + bank: [ + { + bankName: data.bank[0]?.bankName, + accountNumber: data.bank[0]?.accountNumber, + bankBranch: data.bank[0]?.bankBranch, + accountName: data.bank[0]?.accountName, + accountType: data.bank[0]?.accountType, + currentlyUse: data.bank[0]?.currentlyUse, + }, + ], }; } @@ -169,6 +195,9 @@ async function submit(opt?: { selectedImage: string }) { code: formData.value.code, name: formData.value.name, nameEN: formData.value.nameEN, + contactName: formData.value.contactName, + contactEmail: formData.value.contactEmail, + contactTel: formData.value.contactTel, addressEN: formData.value.addressEN, address: formData.value.address, soi: formData.value.soi, @@ -181,6 +210,14 @@ async function submit(opt?: { selectedImage: string }) { districtId: formData.value.districtId, provinceId: formData.value.provinceId, status: formData.value.status, + bank: formData.value.bank.map((v) => ({ + bankName: v.bankName, + accountNumber: v.accountNumber, + bankBranch: v.bankBranch, + accountName: v.accountName, + accountType: v.accountType, + currentlyUse: v.currentlyUse, + })), }; if ( (pageState.isDrawerEdit && currAgenciesData.value?.id) || @@ -922,6 +959,7 @@ watch( v-model="pageState.addModal" v-model:drawer-model="pageState.viewDrawer" v-model:data="formData" + v-model:form-bank-book="formData.bank" v-model:on-create-image-list="onCreateImageList" />