chamomind/jws-frontend
chamomind/jws-frontend
7
0
Fork 0
Code Issues Projects Releases Packages 1 Wiki Activity Actions

refactor: save One by one

Browse source
This commit is contained in:
Net 2024-08-01 11:29:58 +07:00
parent d4229cb838
commit feb7fa2575
1 changed files with 291 additions and 272 deletions
Download patch file Download diff file Expand all files Collapse all files

563
src/pages/03_customer-management/MainPage.vue
View file

@ -471,6 +471,7 @@ const statsCustomerType = ref<CustomerStats>({
CORP: 0,
PERS: 0,
});
const hideBranch = ref<boolean>(true);
const currentCustomerId = ref<string>('');
const dialogInputCustomerBranchForm = ref<boolean>(false);
const currentCustomer = ref<Customer>();
@ -580,6 +581,7 @@ const fieldCustomer = ref([
'customerNaturalPerson',
]);
const countStartsOne = ref<number>(1);
const dialogCustomerType = ref<boolean>(false);
const dialogInputForm = ref<boolean>(false);
const dialogEmployee = ref<boolean>(false);
@ -701,7 +703,10 @@ function onCloseBranch() {
}
function clearForm() {
inputFile.value = '';
profileFile.value = undefined;
profileUrl.value = null;
hideBranch.value = true;
dialogInputForm.value = false;
formData.value = {
@ -748,6 +753,7 @@ function clearForm() {
}
function clearFormEmployee() {
inputFile.value = '';
profileUrl.value = null;
profileSubmit.value = false;
dialogEmployee.value = false;
@ -912,17 +918,88 @@ async function onSubmit() {
flowStore.rotate();
}
async function onSubmitCustomerBranch() {
dialogInputCustomerBranchForm.value = false;
// await createBranch();
async function onSubmitBasicInformation() {
if (selectorLabel.value === 'EMPLOYER') {
dialog({
color: 'info',
icon: 'mdi-alert',
title: t('saveConfirmTitle'),
actionText: t('ok'),
persistent: true,
message: t('saveConfirmMessage'),
action: async () => {
const res = await create({
...formData.value,
customerBranch: [],
customerType: customerType.value === 'CORP' ? 'CORP' : 'PERS',
image: profileSubmit.value ? profileFile.value ?? null : null,
});
for (const item of formData.value.customerBranch || []) {
await createBranch({
...item,
customerId: currentCustomerId.value,
if (res) {
currentCustomerId.value = res.id;
hideBranch.value = false;
}
const resultList = await fetchList({ includeBranch: true });
if (resultList) listCustomer.value = resultList.result;
},
cancel: () => {},
});
}
clearForm();
// if (selectorLabel.value === 'EMPLOYEE') {
// const isOk = await checkEmployeeForm();
// if (isOk) {
// await employeeStore.create({
// ...formDataEmployee.value,
// image: profileSubmit.value ? profileFile.value ?? null : null,
// });
// const resultList = await employeeStore.fetchList();
// if (resultList) listEmployee.value = resultList.result;
// const resultStatsEmployee = await employeeStore.getStatsEmployee();
// if (resultStatsEmployee) statsEmployee.value = resultStatsEmployee;
// clearFormEmployee();
// }
// }
flowStore.rotate();
}
async function onSubmitCustomerBranch(opt: { isClearForm: boolean }) {
// await createBranch();
// for (const item of formData.value.customerBranch || []) {
// await createBranch({
// ...item,
// customerId: currentCustomerId.value,
// });
// }
dialog({
color: 'info',
icon: 'mdi-alert',
title: t('saveConfirmTitle'),
actionText: t('ok'),
persistent: true,
message: t('saveConfirmMessage'),
action: async () => {
if (
formData.value.customerBranch !== undefined &&
formData.value.customerBranch[indexTab.value] !== undefined
) {
await createBranch({
...formData.value.customerBranch[indexTab.value],
customerId: currentCustomerId.value,
});
}
},
cancel: () => {},
});
if (opt.isClearForm) {
dialogInputCustomerBranchForm.value = false;
clearForm();
}
const result = await fetchListById(currentCustomerId.value);
if (result) {
currentCustomerName.value = result.customerName;
@ -1178,6 +1255,7 @@ async function assignFormData(
if (!data) return;
indexTab.value = tabNo;
countStartsOne.value = 1;
prevCustomer.value = {
registeredBranchId: data.registeredBranchId,
@ -1225,8 +1303,39 @@ async function assignFormData(
});
cloneData();
}
if (formData.value.customerBranch?.length === 0) {
formData.value.customerBranch?.push({
code: '',
branchNo: 1,
address: '',
addressEN: '',
provinceId: '',
districtId: '',
subDistrictId: '',
zipCode: '',
email: '',
telephoneNo: '',
name: '',
status: 'CREATED',
taxNo: '',
nameEN: '',
legalPersonNo: '',
registerName: '',
registerDate: new Date(),
authorizedCapital: '',
employmentOffice: '',
bussinessType: '',
bussinessTypeEN: '',
jobPosition: '',
jobPositionEN: '',
jobDescription: '',
saleEmployee: '',
payDate: new Date(),
wageRate: 0,
});
}
}
function cloneData() {
formData.value = {
...prevCustomer.value,
@ -2972,7 +3081,12 @@ watch(isMainPage, () => {
no-app-box
width="60vw"
height="50vh"
:close="() => (dialogCustomerType = false)"
:close="
() => {
clearForm();
dialogCustomerType = false;
}
"
>
<div class="row full-width items-center">
<ItemCard
@ -2995,15 +3109,29 @@ watch(isMainPage, () => {
v-model:modal="dialogInputForm"
:title="$t('customerEmployerAdd')"
:customer-label="customerType"
:submit="
() => {
onSubmit();
}
"
:hiddenBtnSave="false"
:submit="() => {}"
:close="
() => {
clearForm();
dialogInputForm = false;
if (hideBranch && countStartsOne === 1) {
dialog({
color: 'warning',
icon: 'mdi-alert',
title: t('warning'),
actionText: t('ok'),
persistent: true,
message: t('notRecorded'),
action: async () => {
countStartsOne++;
clearForm();
dialogInputForm = false;
},
cancel: () => {},
});
} else {
clearForm();
dialogInputForm = false;
}
}
"
>
@ -3031,131 +3159,148 @@ watch(isMainPage, () => {
v-model:customer-name-en="formData.customerNameEN"
v-model:person-name="formData.personName"
v-model:tax-no="formData.taxNo"
@save="
async () => {
await onSubmitBasicInformation();
console.log('สร้าง');
}
"
/>
</template>
<template #address>
<!-- <FormCustomerBranch separator dense outlined /> -->
<div class="col-3 app-text-muted">
• {{ $t('formDialogCustomerBranch') }}
</div>
<div v-if="!hideBranch">
<div class="col-3 app-text-muted">
• {{ $t('formDialogCustomerBranch') }}
</div>
<div class="col-12 row bordered q-pt-none rounded">
<TabComponent
prefix-id="form-dialog"
v-model:branch-no="statBranchNo"
v-model:stat-branch-no="statBranchNo"
v-model:customer-branch="formData.customerBranch"
v-model:tab-index="indexTab"
>
<template #address>
<FormAddress
prefix-id="form-dialog"
:id="indexTab"
v-if="
indexTab !== undefined && formData.customerBranch?.[indexTab]
"
v-model:address="formData.customerBranch[indexTab].address"
v-model:address-e-n="formData.customerBranch[indexTab].addressEN"
v-model:province-id="formData.customerBranch[indexTab].provinceId"
v-model:district-id="formData.customerBranch[indexTab].districtId"
v-model:sub-district-id="
formData.customerBranch[indexTab].subDistrictId
"
v-model:zip-code="formData.customerBranch[indexTab].zipCode"
:title="$t('formDialogTitleEmployerAddress')"
separator
dense
outlined
/>
</template>
<div class="col-12 row bordered q-pt-none rounded">
<TabComponent
prefix-id="form-dialog"
v-model:branch-no="statBranchNo"
v-model:stat-branch-no="statBranchNo"
v-model:customer-branch="formData.customerBranch"
v-model:tab-index="indexTab"
@save="() => onSubmitCustomerBranch({ isClearForm: false })"
>
<template #address>
<FormAddress
prefix-id="form-dialog"
:id="indexTab"
v-if="
indexTab !== undefined && formData.customerBranch?.[indexTab]
"
v-model:address="formData.customerBranch[indexTab].address"
v-model:address-e-n="
formData.customerBranch[indexTab].addressEN
"
v-model:province-id="
formData.customerBranch[indexTab].provinceId
"
v-model:district-id="
formData.customerBranch[indexTab].districtId
"
v-model:sub-district-id="
formData.customerBranch[indexTab].subDistrictId
"
v-model:zip-code="formData.customerBranch[indexTab].zipCode"
:title="$t('formDialogTitleEmployerAddress')"
separator
dense
outlined
/>
</template>
<template #businessInformation>
<FormBusiness
prefix-id="form-dialog"
v-if="
indexTab !== undefined && formData.customerBranch?.[indexTab]
"
v-model:employment-office="
formData.customerBranch[indexTab].employmentOffice
"
v-model:bussiness-type="
formData.customerBranch[indexTab].bussinessType
"
v-model:bussiness-type-en="
formData.customerBranch[indexTab].bussinessTypeEN
"
v-model:job-position="
formData.customerBranch[indexTab].jobPosition
"
v-model:job-position-en="
formData.customerBranch[indexTab].jobPositionEN
"
v-model:job-description="
formData.customerBranch[indexTab].jobDescription
"
v-model:sale-employee="
formData.customerBranch[indexTab].saleEmployee
"
v-model:pay-date="formData.customerBranch[indexTab].payDate"
v-model:wage-rate="formData.customerBranch[indexTab].wageRate"
separator
dense
outlined
/>
</template>
<template #about>
<AboutComponent
v-if="
indexTab !== undefined && formData.customerBranch?.[indexTab]
"
prefix-id="form-dialog"
:type-customer="customerType"
v-model:branch-no="formData.customerBranch[indexTab].branchNo"
v-model:tax-no="formData.customerBranch[indexTab].taxNo"
v-model:customer-name="formData.customerBranch[indexTab].name"
v-model:customer-english-name="
formData.customerBranch[indexTab].nameEN
"
v-model:authorized-capital="
formData.customerBranch[indexTab].authorizedCapital
"
v-model:register-name="
formData.customerBranch[indexTab].registerName
"
v-model:register-date="
formData.customerBranch[indexTab].registerDate
"
dense
outlined
separator
/>
</template>
<template #contactInformation>
<ContactComponent
prefix-id="form-dialog"
v-if="
indexTab !== undefined && formData.customerBranch?.[indexTab]
"
v-model:mail="formData.customerBranch[indexTab].email"
v-model:telephone="formData.customerBranch[indexTab].telephoneNo"
dense
outlined
separator
/>
</template>
<template #otherDocuments>
<OtherInformation
prefix-id="form-dialog"
v-if="
indexTab !== undefined && formData.customerBranch?.[indexTab]
"
dense
outlined
/>
</template>
</TabComponent>
<template #businessInformation>
<FormBusiness
prefix-id="form-dialog"
v-if="
indexTab !== undefined && formData.customerBranch?.[indexTab]
"
v-model:employment-office="
formData.customerBranch[indexTab].employmentOffice
"
v-model:bussiness-type="
formData.customerBranch[indexTab].bussinessType
"
v-model:bussiness-type-en="
formData.customerBranch[indexTab].bussinessTypeEN
"
v-model:job-position="
formData.customerBranch[indexTab].jobPosition
"
v-model:job-position-en="
formData.customerBranch[indexTab].jobPositionEN
"
v-model:job-description="
formData.customerBranch[indexTab].jobDescription
"
v-model:sale-employee="
formData.customerBranch[indexTab].saleEmployee
"
v-model:pay-date="formData.customerBranch[indexTab].payDate"
v-model:wage-rate="formData.customerBranch[indexTab].wageRate"
separator
dense
outlined
/>
</template>
<template #about>
<AboutComponent
v-if="
indexTab !== undefined && formData.customerBranch?.[indexTab]
"
prefix-id="form-dialog"
:type-customer="customerType"
v-model:branch-no="formData.customerBranch[indexTab].branchNo"
v-model:tax-no="formData.customerBranch[indexTab].taxNo"
v-model:customer-name="formData.customerBranch[indexTab].name"
v-model:customer-english-name="
formData.customerBranch[indexTab].nameEN
"
v-model:authorized-capital="
formData.customerBranch[indexTab].authorizedCapital
"
v-model:register-name="
formData.customerBranch[indexTab].registerName
"
v-model:register-date="
formData.customerBranch[indexTab].registerDate
"
dense
outlined
separator
/>
</template>
<template #contactInformation>
<ContactComponent
prefix-id="form-dialog"
v-if="
indexTab !== undefined && formData.customerBranch?.[indexTab]
"
v-model:mail="formData.customerBranch[indexTab].email"
v-model:telephone="
formData.customerBranch[indexTab].telephoneNo
"
dense
outlined
separator
/>
</template>
<template #otherDocuments>
<OtherInformation
prefix-id="form-dialog"
v-if="
indexTab !== undefined && formData.customerBranch?.[indexTab]
"
dense
outlined
/>
</template>
</TabComponent>
</div>
</div>
</template>
</FormDialog>
@ -3319,144 +3464,7 @@ watch(isMainPage, () => {
<FormDialog
v-model:modal="dialogInputCustomerBranchForm"
:title="$t('formDialogTitleCreateSubBranch')"
:submit="
() => {
onSubmitCustomerBranch();
}
"
:close="() => {}"
>
<template #address>
<!-- <FormCustomerBranch separator dense outlined /> -->
<div class="col-3 app-text-muted">
• {{ $t('formDialogCustomerBranch') }}
</div>
<div class="col-12 row bordered q-pt-none rounded">
<TabComponent
prefix-id="form-dialog-branch"
v-model:stat-branch-no="statBranchNo"
v-model:customer-branch="formData.customerBranch"
v-model:tab-index="indexTab"
>
<template #address>
<FormAddress
prefix-id="form-dialog-branch"
:id="indexTab"
v-if="
indexTab !== undefined && formData.customerBranch?.[indexTab]
"
v-model:address="formData.customerBranch[indexTab].address"
v-model:address-e-n="formData.customerBranch[indexTab].addressEN"
v-model:province-id="formData.customerBranch[indexTab].provinceId"
v-model:district-id="formData.customerBranch[indexTab].districtId"
v-model:sub-district-id="
formData.customerBranch[indexTab].subDistrictId
"
v-model:zip-code="formData.customerBranch[indexTab].zipCode"
separator
dense
outlined
/>
</template>
<template #businessInformation>
<FormBusiness
prefix-id="form-dialog-branch"
v-if="
indexTab !== undefined && formData.customerBranch?.[indexTab]
"
v-model:employment-office="
formData.customerBranch[indexTab].employmentOffice
"
v-model:bussiness-type="
formData.customerBranch[indexTab].bussinessType
"
v-model:bussiness-type-en="
formData.customerBranch[indexTab].bussinessTypeEN
"
v-model:job-position="
formData.customerBranch[indexTab].jobPosition
"
v-model:job-position-en="
formData.customerBranch[indexTab].jobPositionEN
"
v-model:job-description="
formData.customerBranch[indexTab].jobDescription
"
v-model:sale-employee="
formData.customerBranch[indexTab].saleEmployee
"
v-model:pay-date="formData.customerBranch[indexTab].payDate"
v-model:wage-rate="formData.customerBranch[indexTab].wageRate"
separator
dense
outlined
/>
</template>
<template #about>
<AboutComponent
prefix-id="form-dialog-branch"
v-if="
indexTab !== undefined && formData.customerBranch?.[indexTab]
"
:type-customer="customerType"
v-model:tax-no="formData.customerBranch[indexTab].taxNo"
v-model:customer-name="formData.customerBranch[indexTab].name"
v-model:customer-english-name="
formData.customerBranch[indexTab].nameEN
"
v-model:authorized-capital="
formData.customerBranch[indexTab].authorizedCapital
"
v-model:register-name="
formData.customerBranch[indexTab].registerName
"
v-model:register-date="
formData.customerBranch[indexTab].registerDate
"
dense
outlined
separator
/>
</template>
<template #contactInformation>
<ContactComponent
prefix-id="form-dialog-branch"
v-if="
indexTab !== undefined && formData.customerBranch?.[indexTab]
"
v-model:mail="formData.customerBranch[indexTab].email"
v-model:telephone="formData.customerBranch[indexTab].telephoneNo"
dense
outlined
separator
/>
</template>
<template #otherDocuments>
<OtherInformation
prefix-id="form-dialog-branch"
v-if="
indexTab !== undefined && formData.customerBranch?.[indexTab]
"
dense
outlined
/>
</template>
</TabComponent>
</div>
</template>
</FormDialog>
<FormDialog
v-model:modal="dialogInputCustomerBranchForm"
:title="$t('formDialogTitleCreateSubBranch')"
:submit="
() => {
onSubmitCustomerBranch();
}
"
:submit="() => {}"
:close="
() => {
clearForm();
@ -3477,6 +3485,11 @@ watch(isMainPage, () => {
:stat-branch-no="statBranchNo"
v-model:customer-branch="formData.customerBranch"
v-model:tab-index="indexTab"
@save="
() => {
onSubmitCustomerBranch({ isClearForm: true });
}
"
>
<template #address>
<FormAddress
@ -3656,6 +3669,11 @@ watch(isMainPage, () => {
v-model:customer-name-en="formData.customerNameEN"
v-model:person-name="formData.personName"
v-model:tax-no="formData.taxNo"
@save="
() => {
console.log('แก้ไข');
}
"
/>
</template>
@ -3671,6 +3689,7 @@ watch(isMainPage, () => {
:readonly="!infoDrawerEdit"
v-model:customer-branch="formData.customerBranch"
v-model:tab-index="indexTab"
@save="() => onSubmitCustomerBranch({ isClearForm: false })"
>
<template #address>
<FormAddress