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

refactor: customer

Browse source
This commit is contained in:
puriphatt 2024-09-17 10:00:35 +07:00
parent 2ab96dc816
commit 234b03c7fa
12 changed files with 372 additions and 978 deletions
Download patch file Download diff file Expand all files Collapse all files

13
src/components/form/AddressForm.vue
View file

@ -289,6 +289,7 @@ watch(districtId, fetchSubDistrict);
hide-bottom-space
class="col-3"
v-model="homeCode"
mask="###########"
:dense="dense"
:label="$t('customer.form.homeCode')"
:readonly="readonly || sameWithEmployer"
@ -365,7 +366,7 @@ watch(districtId, fetchSubDistrict);
outlined
hide-bottom-space
class="col-md-1 col-4"
v-model="moo"
:model-value="readonly ? moo || '-' : moo"
:dense="dense"
:label="$t('form.moo')"
:readonly="readonly || sameWithEmployer"
@ -375,7 +376,7 @@ watch(districtId, fetchSubDistrict);
outlined
hide-bottom-space
class="col-md-3 col-6"
v-model="soi"
:model-value="readonly ? soi || '-' : soi"
:dense="dense"
:label="$t('form.soi')"
:readonly="readonly || sameWithEmployer"
@ -385,7 +386,7 @@ watch(districtId, fetchSubDistrict);
outlined
hide-bottom-space
class="col-md-3 col-6"
v-model="street"
:model-value="readonly ? street || '-' : street"
:dense="dense"
:label="$t('form.street')"
:readonly="readonly || sameWithEmployer"
@ -593,7 +594,7 @@ watch(districtId, fetchSubDistrict);
outlined
hide-bottom-space
class="col-md-1 col-4"
v-model="mooEN"
:model-value="readonly ? mooEN || '-' : mooEN"
:dense="dense"
label="Moo"
:readonly="readonly || sameWithEmployer"
@ -603,7 +604,7 @@ watch(districtId, fetchSubDistrict);
outlined
hide-bottom-space
class="col-md-3 col-6"
v-model="soiEN"
:model-value="readonly ? soiEN || '-' : soiEN"
:dense="dense"
label="Soi"
:readonly="readonly || sameWithEmployer"
@ -613,7 +614,7 @@ watch(districtId, fetchSubDistrict);
outlined
hide-bottom-space
class="col-md-3 col-6"
v-model="streetEN"
:model-value="readonly ? streetEN || '-' : streetEN"
:dense="dense"
label="Street"
:readonly="readonly || sameWithEmployer"

1
src/i18n/eng/index.ts
View file

@ -155,6 +155,7 @@ export default {
invalidCustomeMessage: 'Invalid value. {msg}',
letterOnly: 'Only letters are allowed',
letterAndNumOnly: 'Only letters and number are allowed',
numOnly: 'Only number are allowed',
requireLength: 'Please enter {msg} character',
},
warning: {

1
src/i18n/tha/index.ts
View file

@ -155,6 +155,7 @@ export default {
invalidCustomeMessage: 'ข้อมูลไม่ถูกต้อง {msg}',
letterOnly: 'โปรดใช้เฉพาะตัวอักษรภาษาอังกฤษเท่านั้น',
letterAndNumOnly: 'โปรดใช้เฉพาะตัวอักษรภาษาอังกฤษและตัวเลขเท่านั้น',
numOnly: 'โปรดใช้เฉพาะตัวเลขเท่านั้น',
requireLength: 'กรุณากรอกให้ครบ {msg} หลัก',
},
warning: {

34
src/pages/03_customer-management/BranchPage.vue
View file

@ -718,25 +718,25 @@ watch([customerId, inputSearch, currentStatus], async () => {
</div>
</div>
<EmployerFormAbout
:index="customerBranchFormData.code?.slice(-2) || '00'"
class="q-mb-xl"
:index="customerBranchFormData.code"
:customer-type="customerType"
:customer-name="currentCustomerName"
:readonly="customerBranchFormState.dialogType === 'info'"
v-model:citizen-id="customerBranchFormData.citizenId"
v-model:id="customerBranchFormData.id"
v-model:legal-person-no="customerBranchFormData.legalPersonNo"
v-model:branch-code="customerBranchFormData.code"
v-model:customer-code="customerBranchFormData.code"
v-model:register-company-name="
customerBranchFormData.registerCompanyName
"
v-model:register-name="customerBranchFormData.registerName"
v-model:register-name-en="customerBranchFormData.registerNameEN"
v-model:register-date="customerBranchFormData.registerDate"
v-model:authorized-capital="
customerBranchFormData.authorizedCapital
"
v-model:prefixName="customerBranchFormData.namePrefix"
v-model:firstName="customerBranchFormData.firstName"
v-model:lastName="customerBranchFormData.lastName"
v-model:firstNameEN="customerBranchFormData.firstNameEN"
v-model:lastNameEN="customerBranchFormData.lastNameEN"
v-model:gender="customerBranchFormData.gender"
v-model:birthDate="customerBranchFormData.birthDate"
v-model:customerName="customerBranchFormData.customerName"
v-model:legalPersonNo="customerBranchFormData.legalPersonNo"
v-model:branchCode="customerBranchFormData.code"
v-model:registerName="customerBranchFormData.registerName"
v-model:registerNameEN="customerBranchFormData.registerNameEN"
v-model:registerDate="customerBranchFormData.registerDate"
v-model:authorizedCapital="customerBranchFormData.authorizedCapital"
v-model:telephoneNo="customerBranchFormData.telephoneNo"
v-model:codeCustomer="customerBranchFormData.codeCustomer"
/>
<div class="row q-col-gutter-sm q-mb-sm" id="employer-branch-address">
<div class="col-12 text-weight-bold text-body1 row items-center">

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

@ -1,5 +1,5 @@
<script setup lang="ts">
import { ref, watch, onMounted } from 'vue';
import { ref, watch, onMounted, computed } from 'vue';
import { useI18n } from 'vue-i18n';
import { useQuasar } from 'quasar';
import { useRoute, useRouter } from 'vue-router';
@ -121,7 +121,13 @@ async function init() {
if (_data) {
currentCustomer.value = _data;
utilsStore.currentTitle.path.push({
text: `${currentCustomer.value.firstName || '-'} ${currentCustomer.value.lastName || ''}`,
text: `${
_data.customerType === 'CORP'
? _data.branch[0].registerName
: locale.value === 'eng'
? _data.branch[0].firstNameEN + ' ' + _data.branch[0].lastNameEN
: _data.branch[0].firstName + ' ' + _data.branch[0].lastName
}`,
i18n: false,
});
} else {
@ -154,6 +160,13 @@ const customerTypeSelected = ref<{
value: 'all',
});
const customerNameInfo = computed(() => {
const name =
locale.value === 'eng'
? `${customerFormData.value.customerBranch[0].firstNameEN} ${customerFormData.value.customerBranch[0].lastNameEN}`
: `${customerFormData.value.customerBranch[0].firstName} ${customerFormData.value.customerBranch[0].lastName}`;
return name || '-';
});
const currentBtnOpen = ref<boolean[]>([]);
const employeeStats = ref(0);
const gridView = ref(false);
@ -482,7 +495,7 @@ async function openHistory(id: string) {
employeeHistoryDialog.value = true;
}
async function editCustomerForm(id: string) {
async function editCustomerForm(id: string, view?: boolean) {
await customerFormStore.assignFormData(id);
await fetchListOfOptionBranch();
await fetchImageList(
@ -490,6 +503,7 @@ async function editCustomerForm(id: string) {
customerFormData.value.selectedImage || '',
'customer',
);
customerFormState.value.branchIndex = -1;
customerFormState.value.dialogType = 'edit';
customerFormState.value.drawerModal = true;
customerFormState.value.editCustomerId = id;
@ -1212,7 +1226,7 @@ const emptyCreateDialog = ref(false);
>
<template #error>
<q-img
:src="`${props.row.customerType === 'CORP' ? `/images/customer-CORP-avartar-${props.row.gender}.png` : `/images/customer-PERS-avartar-${props.row.gender}.png`}`"
:src="`/images/customer-${props.row.customerType}-avartar-${props.row.customerType === 'PERS' ? props.row.branch[0].gender : 'male'}.png`"
/>
</template>
</q-img>
@ -1222,12 +1236,22 @@ const emptyCreateDialog = ref(false);
</div>
<div class="col">
<div class="col">
{{ props.row.firstName }}
{{ props.row.lastName }}
{{
props.row.customerType === 'CORP'
? props.row.branch[0].registerName || '-'
: props.row.branch[0].firstName +
' ' +
props.row.branch[0].lastName || '-'
}}
</div>
<div class="col app-text-muted">
{{ props.row.firstNameEN || '-' }}
{{ props.row.lastNameEN || '-' }}
{{
props.row.customerType === 'CORP'
? props.row.branch[0].registerNameEN || '-'
: props.row.branch[0].firstNameEN +
' ' +
props.row.branch[0].lastNameEN || '-'
}}
</div>
</div>
</div>
@ -1236,7 +1260,9 @@ const emptyCreateDialog = ref(false);
{{
props.row.branch.length !== 0
? props.row.branch[0].businessType !== null
? props.row.branch[0].businessType
? optionStore.mapOption(
props.row.branch[0].businessType,
)
: ''
: '-'
}}
@ -1327,7 +1353,7 @@ const emptyCreateDialog = ref(false);
dense
round
flat
@click.stop="editCustomerForm(props.row.id)"
@click.stop="editCustomerForm(props.row.id, true)"
/>
<KebabAction
@ -1337,7 +1363,7 @@ const emptyCreateDialog = ref(false);
() => {
const { branch, ...payload } = props.row;
currentCustomer = payload;
editCustomerForm(props.row.id);
editCustomerForm(props.row.id, true);
}
"
@edit="
@ -1420,10 +1446,18 @@ const emptyCreateDialog = ref(false);
code: props.row.code,
name:
$i18n.locale === 'eng'
? `${props.row.firstNameEN} ${props.row.lastNameEN} `.trim()
: `${props.row.firstName} ${props.row.lastName} `.trim(),
? props.row.customerType === 'CORP'
? props.row.branch[0].registerNameEN || '-'
: props.row.branch[0].firstNameEN +
' ' +
props.row.branch[0].lastNameEN || '-'
: props.row.customerType === 'CORP'
? props.row.branch[0].registerName || '-'
: props.row.branch[0].firstName +
' ' +
props.row.branch[0].lastName || '-',
img: `${baseUrl}/customer/${props.row.id}/image/${props.row.selectedImage}`,
fallbackImg: `/images/customer-${props.row.customerType}-avartar-${props.row.gender}.png`,
fallbackImg: `/images/customer-${props.row.customerType}-avartar-${props.row.customerType === 'PERS' ? props.row.branch[0].gender : 'male'}.png`,
male: undefined,
female: undefined,
detail: [
@ -1469,7 +1503,7 @@ const emptyCreateDialog = ref(false);
() => {
const { branch, ...payload } = props.row;
currentCustomer = payload;
editCustomerForm(props.row.id);
editCustomerForm(props.row.id, true);
}
"
@delete-card="deleteCustomerById(props.row.id)"
@ -1766,6 +1800,7 @@ const emptyCreateDialog = ref(false);
async () => {
customerFormStore.resetForm(customerFormState.dialogType === 'create');
onCreateImageList = { selectedImage: '', list: [] };
customerFormState.customerImageUrl = '';
await fetchListOfOptionBranch();
await customerFormStore.addCurrentCustomerBranch();
}
@ -1805,11 +1840,8 @@ const emptyCreateDialog = ref(false);
active
hide-fade
:fallback-cover="`/images/customer-${customerFormData.customerType}-banner-bg.jpg`"
:img="
customerFormState.customerImageUrl ||
`/images/customer-${customerFormData.customerType}-avartar-${customerFormData.gender}.png`
"
:fallbackImg="`/images/customer-${customerFormData.customerType}-avartar-${customerFormData.gender}.png`"
:img="customerFormState.customerImageUrl || null"
:fallbackImg="`/images/customer-PERS-avartar-male.png`"
:color="`hsla(var(--${customerFormData.customerType === 'PERS' ? 'teal-10-hsl' : 'violet-11-hsl'})/1)`"
:bg-color="`hsla(var(--${customerFormData.customerType === 'PERS' ? 'teal-10-hsl' : 'violet-11-hsl'})/0.1)`"
:icon="
@ -1875,50 +1907,36 @@ const emptyCreateDialog = ref(false);
id="customer-form-content"
style="height: 100%; max-height: 100%; overflow-y: auto"
>
<q-form
@submit.prevent="
async () => {
console.log(customerFormData);
// await customerFormStore.submitFormCustomer(onCreateImageList);
// customerFormState.readonly = true;
notify('create', $t('general.success'));
// await fetchListCustomer();
}
<EmployerFormBasicInfo
class="q-mb-xl"
:readonly="
(customerFormState.dialogType === 'edit' &&
customerFormState.readonly === true) ||
customerFormState.dialogType === 'info'
"
greedy
>
<!-- :create="customerFormState.dialogType === 'create'" -->
<EmployerFormBasicInfo
class="q-mb-xl"
:readonly="
(customerFormState.dialogType === 'edit' &&
customerFormState.readonly === true) ||
customerFormState.dialogType === 'info'
"
:action-disabled="customerFormState.branchIndex !== -1"
id="form-basic-info-customer"
:create="false"
@edit="
(customerFormState.dialogType = 'edit'),
(customerFormState.readonly = false)
"
@cancel="() => customerFormUndo(false)"
@delete="
customerFormState.editCustomerId &&
deleteCustomerById(customerFormState.editCustomerId)
"
:customer-type="customerFormData.customerType"
v-model:registered-branch-id="customerFormData.registeredBranchId"
v-mode:customerName="customerFormData.customerName"
v-mode:registerName="customerFormData.registerName"
v-mode:citizenId="customerFormData.citizenId"
v-mode:legalPersonNo="customerFormData.legalPersonNo"
v-mode:businessType="customerFormData.businessType"
v-mode:jobPosition="customerFormData.jobPosition"
v-mode:telephoneNo="customerFormData.telephoneNo"
v-model:branch-options="registerAbleBranchOption"
/>
</q-form>
:action-disabled="customerFormState.branchIndex !== -1"
id="form-basic-info-customer"
:onCreate="customerFormState.dialogType === 'create'"
@edit="
(customerFormState.dialogType = 'edit'),
(customerFormState.readonly = false)
"
@cancel="() => customerFormUndo(false)"
@delete="
customerFormState.editCustomerId &&
deleteCustomerById(customerFormState.editCustomerId)
"
:customer-type="customerFormData.customerType"
v-model:registered-branch-id="customerFormData.registeredBranchId"
v-mode:customerName="customerFormData.customerName"
v-mode:registerName="customerFormData.registerName"
v-mode:citizenId="customerFormData.citizenId"
v-mode:legalPersonNo="customerFormData.legalPersonNo"
v-mode:businessType="customerFormData.businessType"
v-mode:jobPosition="customerFormData.jobPosition"
v-mode:telephoneNo="customerFormData.telephoneNo"
v-model:branch-options="registerAbleBranchOption"
/>
<div class="row q-col-gutter-sm" id="form-branch-customer-branch">
<div class="col-12 text-weight-bold text-body1 row items-center">
<q-icon
@ -2062,6 +2080,7 @@ const emptyCreateDialog = ref(false);
:index="idx"
v-model:customer="customerFormData"
v-model:customer-branch="customerFormData.customerBranch[idx]"
:onCreate="customerFormState.dialogType === 'create'"
:customer-type="customerFormData.customerType"
:customer-name="`${customerFormData.firstName} ${customerFormData.lastName}`"
:readonly="customerFormState.branchIndex !== idx"
@ -2962,8 +2981,8 @@ const emptyCreateDialog = ref(false);
return false;
} else {
fetchListCustomer();
customerFormStore.resetForm(true);
customerFormState.branchIndex = -1;
customerFormStore.resetForm(true);
}
return false;
}
@ -2980,7 +2999,7 @@ const emptyCreateDialog = ref(false);
refreshImageState ? `?ts=${Date.now()}` : '',
) || null
"
:fallbackImg="`/images/customer-${customerFormData.customerType}-avartar-${customerFormData.gender}.png`"
:fallbackImg="`/images/customer-${customerFormData.customerType}-avartar-${customerFormData.customerType === 'PERS' ? customerFormData.customerBranch[0]?.gender : 'male'}.png`"
:color="`hsla(var(--${customerFormData.customerType === 'PERS' ? 'teal-10-hsl' : 'violet-11-hsl'})/1)`"
:bg-color="`hsla(var(--${customerFormData.customerType === 'PERS' ? 'teal-10-hsl' : 'violet-11-hsl'})/0.1)`"
:icon="
@ -3050,6 +3069,7 @@ const emptyCreateDialog = ref(false);
style="height: 100%; max-height: 100%; overflow-y: auto"
>
<EmployerFormBasicInfo
v-if="customerFormData.customerBranch.length > 0"
:readonly="
(customerFormState.dialogType === 'edit' &&
customerFormState.readonly === true) ||
@ -3058,7 +3078,7 @@ const emptyCreateDialog = ref(false);
:hide-action="customerFormData.status === 'INACTIVE'"
:action-disabled="customerFormState.branchIndex !== -1"
id="form-basic-info-customer"
:create="customerFormState.dialogType === 'create'"
:onCreate="customerFormState.dialogType === 'create'"
@edit="
(customerFormState.dialogType = 'edit'),
(customerFormState.readonly = false)
@ -3069,16 +3089,25 @@ const emptyCreateDialog = ref(false);
deleteCustomerById(customerFormState.editCustomerId)
"
:customer-type="customerFormData.customerType"
v-model:code="customerFormData.code"
v-model:registered-branch-id="customerFormData.registeredBranchId"
v-model:customerName="customerNameInfo"
v-model:registerName="
customerFormData.customerBranch[0].registerName
"
v-model:citizenId="customerFormData.customerBranch[0].citizenId"
v-model:legalPersonNo="
customerFormData.customerBranch[0].legalPersonNo
"
v-model:businessType="
customerFormData.customerBranch[0].businessType
"
v-model:jobPosition="
customerFormData.customerBranch[0].jobPosition
"
v-model:telephoneNo="
customerFormData.customerBranch[0].telephoneNo
"
v-model:branch-options="registerAbleBranchOption"
v-model:first-name="customerFormData.firstName"
v-model:last-name="customerFormData.lastName"
v-model:first-name-en="customerFormData.firstNameEN"
v-model:last-name-en="customerFormData.lastNameEN"
v-model:name-prefix="customerFormData.namePrefix"
v-model:gender="customerFormData.gender"
v-model:birth-date="customerFormData.birthDate"
/>
<!-- <div class="row q-col-gutter-sm q-mb-xl">
@ -3096,11 +3125,7 @@ const emptyCreateDialog = ref(false);
<div class="row q-col-gutter-sm" id="form-branch-customer-branch">
<div
class="col-12 text-weight-bold text-body1 row items-center"
:style="{
opacity:
customerFormState.branchIndex !== -1 ? '0.5' : undefined,
}"
class="col-12 text-weight-bold text-body1 row items-center q-mt-lg"
>
<q-icon
flat

28
src/pages/03_customer-management/components/employer/EmployerFormAbout.vue
View file

@ -50,7 +50,7 @@ const authorizedCapital = defineModel<string>('authorizedCapital', {
// both
const telephoneNo = defineModel<string>('telephoneNo');
const customerCode = defineModel<string | undefined>('customerCode', {
const codeCustomer = defineModel<string | undefined>('codeCustomer', {
required: true,
});
@ -130,6 +130,15 @@ watch(
:label="$t('customer.form.legalPersonCode')"
for="input-legal-person-code"
v-model="legalPersonNo"
mask="#############"
:rules="[
(val) => (val && val.length > 0) || $t('form.error.required'),
(val) =>
(val && val.length === 13 && /[0-9]+/.test(val)) ||
$t('form.error.invalidCustomeMessage', {
msg: $t('form.error.requireLength', { msg: 13 }),
}),
]"
/>
<q-input
@ -141,7 +150,7 @@ watch(
:disable="!readonly"
:readonly="readonly"
:label="$t('customer.form.customerCode')"
:model-value="customerCode"
:model-value="legalPersonNo"
/>
<q-input
@ -153,7 +162,7 @@ watch(
:label="$t('customer.form.branchCode')"
:disable="!readonly"
:readonly="readonly"
:model-value="`${branchCode?.slice(0, -2) || '-'}${index.toString().padStart(2, '0')}`"
:model-value="branchCode"
/>
</div>
@ -182,7 +191,7 @@ watch(
:rules="[
(val: string) => !!val || $t('form.error.required'),
(val: string) =>
/^[A-Za-z]+$/.test(val) || $t('form.error.letterOnly'),
/^[A-Za-z\s.,]+$/.test(val) || $t('form.error.letterOnly'),
]"
/>
</div>
@ -249,7 +258,7 @@ watch(
:disable="!readonly"
:readonly="readonly"
:label="$t('customer.form.customerCode')"
:model-value="customerCode"
:model-value="codeCustomer"
/>
<q-input
@ -262,6 +271,15 @@ watch(
:label="$t('customer.form.cardNumber')"
for="input-legal-person-no"
v-model="citizenId"
mask="#############"
:rules="[
(val) => (val && val.length > 0) || $t('form.error.required'),
(val) =>
(val && val.length === 13 && /[0-9]+/.test(val)) ||
$t('form.error.invalidCustomeMessage', {
msg: $t('form.error.requireLength', { msg: 13 }),
}),
]"
/>
</div>

734
src/pages/03_customer-management/components/employer/EmployerFormBasicInfo.vue
View file

@ -18,7 +18,7 @@ withDefaults(
prefixId?: string;
outlined?: boolean;
readonly?: boolean;
create?: boolean;
onCreate?: boolean;
actionDisabled?: boolean;
customerType?: 'CORP' | 'PERS';
hideAction?: boolean;
@ -78,60 +78,6 @@ watch(
);
},
);
// const prefixNameOptions = ref<Record<string, unknown>[]>([]);
// let prefixNameFilter: (
// value: string,
// update: (callbackFn: () => void, afterFn?: (ref: QSelect) => void) => void,
// ) => void;
// const genderOptions = ref<Record<string, unknown>[]>([]);
// let genderFilter: (
// value: string,
// update: (callbackFn: () => void, afterFn?: (ref: QSelect) => void) => void,
// ) => void;
// onMounted(() => {
// prefixNameFilter = selectFilterOptionRefMod(
// ref(optionStore.globalOption?.prefix),
// prefixNameOptions,
// 'label',
// );
// genderFilter = selectFilterOptionRefMod(
// ref(optionStore.globalOption?.gender),
// genderOptions,
// 'label',
// );
// });
// watch(
// () => optionStore.globalOption,
// () => {
// prefixNameFilter = selectFilterOptionRefMod(
// ref(optionStore.globalOption.prefix),
// prefixNameOptions,
// 'label',
// );
// genderFilter = selectFilterOptionRefMod(
// ref(optionStore.globalOption.gender),
// genderOptions,
// 'label',
// );
// },
// );
// watch(
// () => namePrefix.value,
// (v) => {
// if (v === 'mr') gender.value = 'male';
// else gender.value = 'female';
// },
// );
// function formatCode(input: string | undefined, type: 'code' | 'number') {
// if (!input) return;
// return input.slice(...(type === 'code' ? [0, -6] : [-6]));
// }
</script>
<template>
@ -239,7 +185,7 @@ watch(
</div>
<div
v-if="customerType === 'CORP' && !create"
v-if="customerType === 'CORP' && !onCreate"
class="row col-12 q-col-gutter-sm"
>
<q-input
@ -270,12 +216,12 @@ watch(
class="col-6 col-md-3"
:label="$t('customer.table.businessTypePure')"
for="input-first-name-en"
v-model="businessType"
:model-value="optionStore.mapOption(businessType)"
/>
</div>
<div
v-if="customerType === 'PERS' && !create"
v-if="customerType === 'PERS' && !onCreate"
class="row col-12 q-col-gutter-sm"
>
<q-input
@ -307,11 +253,11 @@ watch(
class="col-6 col-md-3"
:label="$t('customer.table.businessTypePure')"
for="input-first-name-en"
v-model="businessType"
:model-value="optionStore.mapOption(businessType)"
/>
</div>
<div v-if="!create" class="row col-12 q-col-gutter-sm">
<div v-if="!onCreate" class="row col-12 q-col-gutter-sm">
<q-input
dense
outlined
@ -320,7 +266,7 @@ watch(
class="col-6 col-md-5"
:label="$t('customer.form.jobPosition')"
for="input-first-name-en"
v-model="jobPosition"
:model-value="optionStore.mapOption(jobPosition)"
/>
<q-input
dense
@ -343,671 +289,5 @@ watch(
</q-input>
</div>
</div>
<!-- <div v-if="customerType === 'CORP'" class="col-12 row q-col-gutter-sm">
<q-input
dense
outlined
:readonly="readonly"
hide-bottom-space
class="col-12 col-md-6"
:label="$t('customer.form.customerName')"
for="input-first-name"
v-model="customerName"
:rules="[(val: string) => !!val || $t('form.error.required')]"
/>
<q-input
dense
outlined
:readonly="readonly"
hide-bottom-space
class="col-12 col-md-6"
:label="$t('customer.form.customerNameEN')"
for="input-first-name-en"
v-model="customerNameEN"
:rules="[
(val: string) => !!val || $t('form.error.required'),
(val: string) =>
/^[A-Za-z]+$/.test(val) || $t('form.error.letterOnly'),
]"
/>
<q-input
dense
outlined
:readonly="readonly"
hide-bottom-space
class="col-6 col-md-3"
:label="$t('general.taxNo')"
for="input-first-name-en"
v-model="taxNo"
mask="#############"
:rules="[
(val) => (val && val.length > 0) || $t('form.error.required'),
(val) =>
(val && val.length === 13 && /[0-9]+/.test(val)) ||
$t('form.error.invalidCustomeMessage', {
msg: $t('form.error.requireLength', { msg: 13 }),
}),
]"
/>
<q-input
dense
outlined
:readonly="readonly"
hide-bottom-space
class="col-6 col-md-3"
:label="$t('customer.table.businessTypePure')"
for="input-first-name-en"
v-model="businessType"
/>
<q-input
dense
outlined
:readonly="readonly"
hide-bottom-space
class="col-6 col-md-3"
:label="$t('customer.form.jobPosition')"
for="input-first-name-en"
v-model="jobPosition"
/>
<q-input
dense
outlined
:readonly="readonly"
hide-bottom-space
class="col-6 col-md-3"
:label="$t('customer.form.headQuarters.telephoneNo')"
for="input-first-name-en"
v-model="telephoneNo"
>
<template #prepend>
<q-icon
size="xs"
name="mdi-phone-outline"
class="cursor-pointer"
color="primary"
/>
</template>
</q-input>
</div>
<div v-if="customerType === 'PERS'" class="col-12 row q-col-gutter-sm">
<div class="col-9 row q-col-gutter-sm">
<q-select
outlined
clearable
use-input
fill-input
emit-value
map-options
hide-selected
hide-bottom-space
dense
class="col-12"
option-value="id"
input-debounce="0"
option-label="name"
v-model="registeredBranchId"
:readonly="readonly"
:options="filteredBranchOptions"
:hide-dropdown-icon="readonly"
:label="$t('customer.form.registeredBranch')"
:for="`${prefixId}-input-source-nationality`"
:rules="[
(val) => {
const roles = getRole() || [];
return (
['admin', 'system', 'head_of_admin'].some((v) =>
roles.includes(v),
) ||
!!val ||
$t('form.error.required')
);
},
]"
@filter="branchFilter"
>
<template v-slot:no-option>
<q-item>
<q-item-section class="text-grey">
{{ $t('general.noData') }}
</q-item-section>
</q-item>
</template>
</q-select>
<q-select
outlined
use-input
fill-input
emit-value
map-options
hide-selected
hide-bottom-space
input-debounce="0"
option-label="label"
option-value="value"
hide-dropdown-icon
class="col-12 col-md-2"
dense
:readonly="readonly"
:options="prefixNameOptions"
:for="`${prefixId}-select-prefix-name`"
:label="$t('form.prefixName')"
@filter="prefixNameFilter"
:model-value="readonly ? namePrefix || '-' : namePrefix"
@update:model-value="
(v) => {
typeof v === 'string' ? (namePrefix = v) : '';
}
"
@clear="namePrefix = ''"
:rules="[
(val) => {
const roles = getRole() || [];
return !!val || $t('form.error.required');
},
]"
>
<template v-slot:no-option>
<q-item>
<q-item-section class="text-grey">
{{ $t('general.noData') }}
</q-item-section>
</q-item>
</template>
</q-select>
<q-input
dense
outlined
:readonly="readonly"
hide-bottom-space
class="col-12 col-md-5"
:label="$t('customer.form.firstName')"
for="input-first-name"
v-model="firstName"
:rules="[
(val) => {
const roles = getRole() || [];
return !!val || $t('form.error.required');
},
]"
/>
<q-input
dense
outlined
:readonly="readonly"
hide-bottom-space
class="col-12 col-md-5"
:label="$t('customer.form.lastName')"
for="input-last-name"
v-model="lastName"
:rules="[
(val) => {
const roles = getRole() || [];
return !!val || $t('form.error.required');
},
]"
/>
<q-input
dense
outlined
:disable="!readonly"
readonly
hide-bottom-space
class="col-12 col-md-2"
label="Title"
for="input-prefix-name-en"
:model-value="
readonly
? capitalize(namePrefix || '') || '-'
: capitalize(namePrefix || '')
"
/>
<q-input
dense
outlined
:readonly="readonly"
hide-bottom-space
class="col-12 col-md-5"
label="Name"
for="input-first-name-en"
v-model="firstNameEN"
:rules="[
(val: string) => !!val || $t('form.error.required'),
(val: string) =>
/^[A-Za-z]+$/.test(val) || $t('form.error.letterOnly'),
]"
/>
<q-input
dense
outlined
:readonly="readonly"
hide-bottom-space
class="col-12 col-md-5"
label="Surname"
for="input-last-name-en"
v-model="lastNameEN"
:rules="[
(val: string) => !!val || $t('form.error.required'),
(val: string) =>
/^[A-Za-z]+$/.test(val) || $t('form.error.letterOnly'),
]"
/>
<q-input
outlined
class="col-md-5 col-12"
hide-bottom-space
v-model="lastNameEN"
mask="#############"
:readonly="readonly"
dense
:label="$t('personnel.form.citizenId')"
:rules="[
(val) => (val && val.length > 0) || $t('form.error.required'),
(val) =>
(val && val.length === 13 && /[0-9]+/.test(val)) ||
$t('form.error.invalidCustomeMessage', {
msg: $t('form.error.requireLength', { msg: 13 }),
}),
]"
for="input-citizen-id"
/>
<q-select
outlined
use-input
fill-input
emit-value
map-options
hide-selected
hide-bottom-space
input-debounce="0"
option-label="label"
option-value="value"
class="col-md-2 col-6"
dense
:readonly="readonly"
:options="genderOptions"
:hide-dropdown-icon="readonly"
:for="`${prefixId}-select-gender`"
:label="$t('form.gender')"
@filter="genderFilter"
:model-value="readonly ? gender || '-' : gender"
@update:model-value="
(v) => (typeof v === 'string' ? (gender = v) : '')
"
@clear="gender = ''"
>
<template v-slot:no-option>
<q-item>
<q-item-section class="text-grey">
{{ $t('general.noData') }}
</q-item-section>
</q-item>
</template>
</q-select>
<DatePicker
v-model="birthDate"
class="col-md col-6"
:id="`${prefixId}-input-birth-date`"
:readonly="readonly"
:label="$t('form.birthDate')"
:disabled-dates="disabledAfterToday"
:rules="[
(val: string) =>
!!val ||
$t('form.error.selectField', { field: $t('form.birthDate') }),
]"
/>
<q-input
:for="`${prefixId}-input-age`"
:id="`${prefixId}-input-age`"
dense
outlined
:label="$t('personnel.age')"
class="col-md col-12"
:model-value="
birthDate?.toString() === 'Invalid Date' ||
birthDate?.toString() === undefined
? ''
: calculateAge(birthDate)
"
/>
</div>
<div class="row col-12 q-col-gutter-sm">
<q-input
dense
outlined
:readonly="readonly"
hide-bottom-space
class="col-6 col-md"
:label="$t('customer.table.businessTypePure')"
for="input-first-name-en"
v-model="firstNameEN"
/>
<q-input
dense
outlined
:readonly="readonly"
hide-bottom-space
class="col-6 col-md"
:label="$t('customer.form.jobPosition')"
for="input-first-name-en"
v-model="firstNameEN"
/>
<q-input
dense
outlined
:readonly="readonly"
hide-bottom-space
class="col-6 col-md-3"
:label="$t('customer.form.headQuarters.telephoneNo')"
for="input-first-name-en"
v-model="firstNameEN"
>
<template #prepend>
<q-icon
size="xs"
name="mdi-phone-outline"
class="cursor-pointer"
color="primary"
/>
</template>
</q-input>
</div>
</div> -->
<!-- <div class="col-12 row q-col-gutter-sm">
<q-select
outlined
clearable
use-input
fill-input
emit-value
map-options
hide-selected
hide-bottom-space
dense
class="col-12 col-md-7"
option-value="id"
input-debounce="0"
option-label="name"
v-model="registeredBranchId"
:readonly="readonly"
:options="filteredBranchOptions"
:hide-dropdown-icon="readonly"
:label="$t('customer.form.registeredBranch')"
:for="`${prefixId}-input-source-nationality`"
:rules="[
(val) => {
const roles = getRole() || [];
return (
['admin', 'system', 'head_of_admin'].some((v) =>
roles.includes(v),
) ||
!!val ||
$t('form.error.required')
);
},
]"
@filter="branchFilter"
>
<template v-slot:no-option>
<q-item>
<q-item-section class="text-grey">
{{ $t('general.noData') }}
</q-item-section>
</q-item>
</template>
</q-select>
</div>
<div class="col-12 row q-col-gutter-sm">
<q-select
outlined
use-input
fill-input
emit-value
map-options
hide-selected
hide-bottom-space
input-debounce="0"
option-label="label"
option-value="value"
hide-dropdown-icon
class="col-12 col-md-2"
dense
:readonly="readonly"
:options="prefixNameOptions"
:for="`${prefixId}-select-prefix-name`"
:label="$t('form.prefixName')"
@filter="prefixNameFilter"
:model-value="readonly ? namePrefix || '-' : namePrefix"
@update:model-value="
(v) => {
typeof v === 'string' ? (namePrefix = v) : '';
}
"
@clear="namePrefix = ''"
:rules="[
(val) => {
const roles = getRole() || [];
return !!val || $t('form.error.required');
},
]"
>
<template v-slot:no-option>
<q-item>
<q-item-section class="text-grey">
{{ $t('general.noData') }}
</q-item-section>
</q-item>
</template>
</q-select>
<q-input
dense
outlined
:readonly="readonly"
hide-bottom-space
class="col-12 col-md-5"
:label="$t('customer.form.firstName')"
for="input-first-name"
v-model="firstName"
:rules="[
(val) => {
const roles = getRole() || [];
return !!val || $t('form.error.required');
},
]"
/>
<q-input
dense
outlined
:readonly="readonly"
hide-bottom-space
class="col-12 col-md-5"
:label="$t('customer.form.lastName')"
for="input-last-name"
v-model="lastName"
:rules="[
(val) => {
const roles = getRole() || [];
return !!val || $t('form.error.required');
},
]"
/>
</div>
<div class="col-12 row q-col-gutter-sm">
<q-input
dense
outlined
:disable="!readonly"
readonly
hide-bottom-space
class="col-12 col-md-2"
:label="$t('customer.form.prefixName')"
for="input-prefix-name"
:model-value="
readonly
? capitalize(namePrefix || '') || '-'
: capitalize(namePrefix || '')
"
/>
<q-input
dense
outlined
:readonly="readonly"
hide-bottom-space
class="col-12 col-md-5"
:label="$t('customer.form.firstNameEN')"
for="input-first-name-en"
v-model="firstNameEN"
:rules="[
(val: string) => !!val || $t('form.error.required'),
(val: string) =>
/^[A-Za-z]+$/.test(val) || $t('form.error.letterOnly'),
]"
/>
<q-input
dense
outlined
:readonly="readonly"
hide-bottom-space
class="col-12 col-md-5"
:label="$t('customer.form.lastNameEN')"
for="input-last-name-en"
v-model="lastNameEN"
:rules="[
(val: string) => !!val || $t('form.error.required'),
(val: string) =>
/^[A-Za-z]+$/.test(val) || $t('form.error.letterOnly'),
]"
/>
</div>
<div class="col-12 row q-col-gutter-sm">
<q-select
outlined
use-input
fill-input
emit-value
map-options
hide-selected
hide-bottom-space
input-debounce="0"
option-label="label"
option-value="value"
class="col-12 col-md-2"
dense
:readonly="readonly"
:options="genderOptions"
:hide-dropdown-icon="readonly"
:for="`${prefixId}-select-gender`"
:label="$t('form.gender')"
@filter="genderFilter"
:model-value="readonly ? gender || '-' : gender"
@update:model-value="(v) => (typeof v === 'string' ? (gender = v) : '')"
@clear="gender = ''"
:rules="[
(val) => {
const roles = getRole() || [];
return !!val || $t('form.error.required');
},
]"
>
<template v-slot:no-option>
<q-item>
<q-item-section class="text-grey">
{{ $t('general.noData') }}
</q-item-section>
</q-item>
</template>
</q-select>
<VueDatePicker
:id="`${prefixId}-input-birth-date`"
:for="`${prefixId}-input-birth-date`"
utc
autoApply
v-model="birthDate"
:disabled-dates="disabledAfterToday"
:teleport="true"
:dark="$q.dark.isActive"
:locale="$i18n.locale === 'tha' ? 'th' : 'en'"
:enableTimePicker="false"
:disabled="readonly"
class="col-12 col-md-3"
>
<template #year="{ value }">
{{ $i18n.locale === 'tha' ? value + 543 : value }}
</template>
<template #year-overlay-value="{ value }">
{{ $i18n.locale === 'tha' ? value + 543 : value }}
</template>
<template #trigger>
<q-input
:for="`${prefixId}-input-birth-date`"
hide-bottom-space
placeholder="DD/MM/YYYY"
:label="$t('form.birthDate')"
dense
outlined
:readonly="readonly"
:rules="[
(val: string) =>
!!val || $t('selectValidate') + $t('form.birthDate'),
]"
:mask="readonly ? '' : '##/##/####'"
:model-value="
birthDate && readonly
? dateFormat(birthDate)
: dateFormat(birthDate, false, false, true)
"
@update:model-value="
(v) => {
if (v && v.toString().length === 10) {
const today = new Date();
const date = parseAndFormatDate(v, locale);
birthDate = date && date > today ? today : date;
}
}
"
>
<template v-slot:prepend>
<q-icon
size="xs"
name="mdi-calendar-blank-outline"
class="cursor-pointer"
color="primary"
/>
</template>
</q-input>
</template>
</VueDatePicker>
<q-input
:for="`${prefixId}-input-age`"
:id="`${prefixId}-input-age`"
dense
outlined
readonly
:label="$t('general.age')"
class="col-12 col-md-2"
:model-value="
birthDate?.toString() === 'Invalid Date' ||
birthDate?.toString() === undefined
? ''
: calculateAge(birthDate)
"
/>
</div> -->
</div>
</template>

67
src/pages/03_customer-management/components/employer/EmployerFormBranch.vue
View file

@ -47,6 +47,7 @@ withDefaults(
customerName: string;
readonly?: boolean;
prefixId?: string;
onCreate?: boolean;
actionDisabled?: boolean;
customerType?: 'CORP' | 'PERS';
hideAction?: boolean;
@ -69,37 +70,37 @@ withDefaults(
? $t('customer.form.headQuarters.title')
: $t('customer.form.branch.title', { name: index || 0 })
}}
<!-- <EditButton
icon-only
v-if="readonly"
@click="$emit('edit')"
class="q-ml-auto"
type="button"
:disabled="actionDisabled"
/>
<DeleteButton
icon-only
v-if="readonly"
@click="$emit('delete')"
type="button"
:disabled="actionDisabled"
/>
<UndoButton
icon-only
v-if="!readonly"
@click="$emit('cancel')"
type="button"
class="q-ml-auto"
:disabled="actionDisabled"
/> -->
<!-- v-if="!readonly" -->
<SaveButton
icon-only
@click="$emit('save')"
class="q-ml-auto"
type="submit"
:disabled="actionDisabled"
/>
<div class="q-ml-auto row no-warp">
<EditButton
icon-only
v-if="readonly"
@click="$emit('edit')"
class="q-ml-auto"
type="button"
:disabled="actionDisabled"
/>
<DeleteButton
icon-only
v-if="readonly"
@click="$emit('delete')"
type="button"
:disabled="actionDisabled"
/>
<UndoButton
icon-only
v-if="!readonly && !onCreate"
@click="$emit('cancel')"
type="button"
:disabled="actionDisabled"
/>
<SaveButton
v-if="!readonly"
icon-only
@click="$emit('save')"
type="submit"
:disabled="actionDisabled"
/>
</div>
</span>
<div class="col-12" :style="{ opacity: actionDisabled ? '.5' : undefined }">
@ -140,13 +141,13 @@ withDefaults(
v-model:birthDate="item.birthDate"
v-model:customerName="item.customerName"
v-model:legalPersonNo="item.legalPersonNo"
v-model:branchCode="item.branchCode"
v-model:branchCode="item.code"
v-model:registerName="item.registerName"
v-model:registerNameEN="item.registerNameEN"
v-model:registerDate="item.registerDate"
v-model:authorizedCapital="item.authorizedCapital"
v-model:telephoneNo="item.telephoneNo"
v-model:customerCode="item.customerCode"
v-model:codeCustomer="item.codeCustomer"
/>
</q-tab-panel>
<q-tab-panel name="business">

4
src/pages/03_customer-management/components/employer/EmployerFormBusiness.vue
View file

@ -110,6 +110,7 @@ let jobPositionENFilter = selectFilterOptionRefMod(
map-options
hide-selected
hide-bottom-space
hide-dropdown-icon
input-debounce="0"
option-value="value"
option-label="label"
@ -142,6 +143,7 @@ let jobPositionENFilter = selectFilterOptionRefMod(
map-options
hide-selected
hide-bottom-space
hide-dropdown-icon
input-debounce="0"
option-value="value"
option-label="label"
@ -170,6 +172,7 @@ let jobPositionENFilter = selectFilterOptionRefMod(
map-options
hide-selected
hide-bottom-space
hide-dropdown-icon
input-debounce="0"
option-value="value"
option-label="label"
@ -200,6 +203,7 @@ let jobPositionENFilter = selectFilterOptionRefMod(
map-options
hide-selected
hide-bottom-space
hide-dropdown-icon
input-debounce="0"
option-value="value"
option-label="label"

71
src/pages/03_customer-management/form.ts
View file

@ -140,28 +140,21 @@ export const useCustomerForm = defineStore('form-customer', () => {
resetFormData.registeredBranchId = data.registeredBranchId;
resetFormData.status = data.status;
resetFormData.customerType = data.customerType;
resetFormData.code = data.code || '';
resetFormData.namePrefix = data.namePrefix;
resetFormData.firstName = data.firstName;
resetFormData.lastName = data.lastName;
resetFormData.firstNameEN = data.firstNameEN;
resetFormData.lastNameEN = data.lastNameEN;
resetFormData.gender = data.gender;
resetFormData.birthDate = new Date(data.birthDate);
resetFormData.image = null;
resetFormData.selectedImage = data.selectedImage;
resetFormData.customerBranch = await Promise.all(
data.branch.map(async (v) => ({
id: v.id,
code: v.code || '',
customerCode: '',
provinceId: v.provinceId,
districtId: v.districtId,
subDistrictId: v.subDistrictId,
firstName: v.firstName,
firstNameEN: v.firstNameEN,
lastName: v.lastName,
lastNameEN: v.lastNameEN,
gender: v.gender,
birthDate: v.birthDate,
namePrefix: v.namePrefix,
wageRate: v.wageRate,
payDate: v.payDate, // Convert the string to a Date object
payDateEN: v.payDateEN,
wageRateText: v.wageRateText,
payDate: v.payDate,
saleEmployee: v.saleEmployee,
jobDescription: v.jobDescription,
jobPositionEN: v.jobPositionEN,
@ -169,23 +162,49 @@ export const useCustomerForm = defineStore('form-customer', () => {
businessTypeEN: v.businessTypeEN,
businessType: v.businessType,
employmentOffice: v.employmentOffice,
employmentOfficeEN: v.employmentOfficeEN,
telephoneNo: v.telephoneNo,
contactName: v.contactName,
email: v.email,
subDistrictId: v.subDistrictId,
districtId: v.districtId,
provinceId: v.provinceId,
streetEN: v.streetEN,
street: v.street,
mooEN: v.mooEN,
moo: v.moo,
soiEN: v.soiEN,
soi: v.soi,
addressEN: v.addressEN,
address: v.address,
workplaceEN: v.workplaceEN,
workplace: v.workplace,
authorizedCapital: v.authorizedCapital,
registerDate: v.registerDate,
registerNameEN: v.registerNameEN,
registerName: v.registerName,
legalPersonNo: v.legalPersonNo,
citizenId: v.citizenId,
codeCustomer: v.codeCustomer,
updatedByUserId: v.updatedByUserId,
updatedAt: v.updatedAt,
createdByUserId: v.createdByUserId,
createdAt: v.createdAt,
code: v.code,
statusOrder: v.statusOrder,
status: v.status,
customerId: v.customerId,
citizenId: v.citizenId || '',
authorizedCapital: v.authorizedCapital || '',
registerDate: new Date(v.registerDate), // Convert the string to a Date object
registerNameEN: v.registerNameEN || '',
registerName: v.registerName || '',
legalPersonNo: v.legalPersonNo || '',
registerCompanyName: '',
id: v.id,
homeCode: v.homeCode,
contactTel: v.contactTel,
officeTel: v.officeTel,
agent: v.agent,
customerName: v.customerName,
authorizedName: v.authorizedName,
authorizedNameEN: v.authorizedNameEN,
payDateEN: v.payDateEN,
statusSave: true,
contactName: v.contactName || '',
file: await customerStore.listAttachment(v.id).then(async (r) => {
if (r) {
return await Promise.all(
@ -220,7 +239,7 @@ export const useCustomerForm = defineStore('form-customer', () => {
? ''
: currentFormData.value.customerBranch?.[0].branchCode
: '',
customerCode: '',
codeCustomer: '',
legalPersonNo:
currentFormData.value.customerBranch.length !== 0
@ -373,7 +392,6 @@ export const useCustomerBranchForm = defineStore('form-customer-branch', () => {
registerNameEN: '',
registerName: '',
legalPersonNo: '',
registerCompanyName: '',
statusSave: false,
contactName: '',
file: [],
@ -441,7 +459,6 @@ export const useCustomerBranchForm = defineStore('form-customer-branch', () => {
registerName: _data.registerName,
legalPersonNo: _data.legalPersonNo,
contactName: _data.contactName,
registerCompanyName: '',
statusSave: false,
file: [],
};

130
src/stores/customer/index.ts
View file

@ -335,7 +335,6 @@ const useCustomerStore = defineStore('api-customer', () => {
) {
if (data.customerBranch) {
if (data.customerBranch[0].citizenId) {
console.log('1');
delete data.customerBranch[0]['authorizedNameEN'];
delete data.customerBranch[0]['authorizedName'];
delete data.customerBranch[0]['authorizedCapital'];
@ -368,7 +367,7 @@ const useCustomerStore = defineStore('api-customer', () => {
branchCode: undefined,
id: undefined,
customerId: undefined,
customerCode: undefined,
codeCustomer: undefined,
})),
selectedImage: imgList.selectedImage,
},
@ -404,18 +403,6 @@ const useCustomerStore = defineStore('api-customer', () => {
},
) {
const { customerBranch, image, ...payload } = data;
// const attachment = payload.customerBranch?.map((v) => v.file);
// payload.customerBranch = payload.customerBranch?.map((v) => {
// const { code: _code, ...rest } = v;
// return { ...rest };
// });
// if (payload.customerBranch?.length) {
// for (let i = 0; i < payload.customerBranch?.length; i++) {
// delete payload.customerBranch[i].file;
// }
// }
const res = await api.put<
Customer & {
@ -423,28 +410,32 @@ const useCustomerStore = defineStore('api-customer', () => {
imageUrl: string;
imageUploadUrl: string;
}
>(`/customer/${id}`, payload, {
headers: {
'X-Session-Id': flow?.sessionId,
'X-Rtid': flow?.refTransactionId || flowStore.rtid,
'X-Tid': flow?.transactionId,
>(
`/customer/${id}`,
{
...payload,
branch: data.customerBranch?.map((v) => ({
...v,
file: undefined,
branchCode: undefined,
id: undefined,
customerId: undefined,
codeCustomer: undefined,
createAt: undefined,
createdByUserId: undefined,
statusOrder: undefined,
updatedAt: undefined,
updatedByUserId: undefined,
})),
},
});
// await Promise.allSettled([
// ...res.data.branch.map(async (v, i) => {
// const fileList = attachment?.[i];
// if (fileList)
// return await addBranchAttachment(v.id, { file: fileList });
// }),
// image &&
// (await axios
// .put(res.data.imageUploadUrl, image, {
// headers: { 'Content-Type': image.type },
// onUploadProgress: (e) => console.log(e),
// })
// .catch((e) => console.error(e)));
// ]);
{
headers: {
'X-Session-Id': flow?.sessionId,
'X-Rtid': flow?.refTransactionId || flowStore.rtid,
'X-Tid': flow?.transactionId,
},
},
);
if (!res) return false;
@ -494,30 +485,35 @@ const useCustomerStore = defineStore('api-customer', () => {
}
async function createBranch(
data: CustomerBranchCreate & { id?: string; customerId: string },
data: CustomerBranchCreate & {
id?: string;
customerId: string;
codeCustomer: string;
},
flow?: {
sessionId?: string;
refTransactionId?: string;
transactionId?: string;
},
) {
const {
customerCode,
registerCompanyName,
statusSave,
code,
file,
...payload
} = data;
const { codeCustomer, statusSave, code, file, birthDate, ...payload } =
data;
if (!!payload.citizenId) {
delete payload['registerDate'];
delete payload['registerName'];
delete payload['registerNameEN'];
delete payload['authorizedCapital'];
delete payload['legalPersonNo'];
if (data.citizenId) {
delete data['authorizedNameEN'];
delete data['authorizedName'];
delete data['registerDate'];
delete data['authorizedCapital'];
delete data['registerNameEN'];
delete data['registerName'];
delete data['legalPersonNo'];
} else {
delete payload['citizenId'];
delete data['citizenId'];
}
console.log(data.birthDate);
console.log(!data.birthDate);
if (!data.birthDate) {
delete data['birthDate'];
}
const res = await api.post<CustomerBranch>('/customer-branch', payload, {
@ -536,20 +532,44 @@ const useCustomerStore = defineStore('api-customer', () => {
async function editBranchById(
id: string,
data: Partial<CustomerBranchCreate & { id?: string; customerId: string }>,
data: Partial<
CustomerBranch & {
id?: string;
customerId: string;
codeCustomer: string;
}
>,
flow?: {
sessionId?: string;
refTransactionId?: string;
transactionId?: string;
},
) {
if (data.citizenId) {
delete data['authorizedNameEN'];
delete data['authorizedName'];
delete data['registerDate'];
delete data['authorizedCapital'];
delete data['registerNameEN'];
delete data['registerName'];
delete data['legalPersonNo'];
} else {
delete data['citizenId'];
}
if (!data.birthDate) delete data['birthDate'];
const {
customerCode,
registerCompanyName,
statusSave,
code,
status,
codeCustomer,
createdAt,
createdByUserId,
statusOrder,
updatedAt,
updatedByUserId,
file,
registerCompanyName,
statusSave,
...payload
} = data;

84
src/stores/customer/types.ts
View file

@ -30,33 +30,57 @@ export type Customer = {
};
export type CustomerBranch = {
customerId: string;
contactName: string;
wageRate: number;
payDate: string;
payDateEN: string;
jobDescription: string;
jobPosition: string;
businessType: string;
employmentOffice: string;
authorizedCapital: string;
registerDate: Date | null;
registerNameEN: string;
registerName: string;
legalPersonNo?: string;
citizenId: string;
updatedByUserId: string;
createdByUserId: string;
statusOrder: number;
telephoneNo: string;
email: string;
subDistrictId: string;
districtId: string;
provinceId: string;
addressEN: string;
address: string;
code: string;
id: string;
customerCode?: string;
wageRateText: 'string';
wageRate: 0;
payDateEN: 'string';
payDate: 'string';
jobDescription: 'string';
jobPosition: 'string';
businessType: 'string';
agent: 'string';
contactName: 'string';
officeTel: 'string';
contactTel: 'string';
email: 'string';
subDistrictId: 'string';
districtId: 'string';
provinceId: 'string';
streetEN: 'string';
street: 'string';
mooEN: 'string';
moo: 'string';
soiEN: 'string';
soi: 'string';
addressEN: 'string';
address: 'string';
employmentOfficeEN: 'string';
employmentOffice: 'string';
homeCode: 'string';
authorizedNameEN: 'string';
authorizedName: 'string';
authorizedCapital: 'string';
registerDate: '2024-09-16T07:52:42.627Z';
registerNameEN: 'string';
registerName: 'string';
legalPersonNo: 'string';
citizenId: 'string';
birthDate: '2024-09-16T07:52:42.627Z';
gender: 'string';
lastNameEN: 'string';
lastName: 'string';
firstNameEN: 'string';
firstName: 'string';
namePrefix: 'string';
telephoneNo: 'string';
codeCustomer: 'string';
customerName: 'string';
updatedByUserId: 'string';
createdByUserId: 'string';
code: 'string';
statusOrder: 0;
customerId: 'string';
id: 'string';
status: Status;
createdBy: string | null;
@ -72,6 +96,7 @@ export type CustomerBranch = {
};
export type CustomerBranchCreate = {
customerCode?: string;
customerId: string;
legalPersonNo?: string;
citizenId?: string;
@ -117,6 +142,7 @@ export type CustomerBranchCreate = {
authorizedCapital?: string;
authorizedName?: string;
authorizedNameEN?: string;
code?: 'string';
file?: {
name?: string;
group?: string;
@ -129,7 +155,7 @@ export type CustomerCreate = {
customerBranch?: (CustomerBranchCreate & {
id?: string;
branchCode?: string;
customerCode?: string;
codeCustomer?: string;
})[];
selectedImage?: string;
status?: Status;
@ -145,7 +171,7 @@ export type CustomerUpdate = {
customerBranch?: (CustomerBranchCreate & {
id?: string;
branchCode?: string;
customerCode?: string;
codeCustomer?: string;
})[];
image?: File;
registeredBranchId: string;