fix(03): employee customer
This commit is contained in:
puriphatt
parent
f8c991393f
commit
2254218039
3 changed files with 68 additions and 44 deletions
|
|
@ -9,6 +9,9 @@ import {
|
|||
SaveButton,
|
||||
UndoButton,
|
||||
} from 'components/button';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
const { locale } = useI18n();
|
||||
|
||||
const optionsBranch = defineModel<{ id: string; name: string }[]>(
|
||||
'optionsBranch',
|
||||
|
|
@ -29,7 +32,7 @@ const customerBranch = defineModel<{
|
|||
const nrcNo = defineModel<string>('nrcNo');
|
||||
const code = defineModel<string>('code');
|
||||
|
||||
defineProps<{
|
||||
const props = defineProps<{
|
||||
noAction?: boolean;
|
||||
title?: string;
|
||||
dense?: boolean;
|
||||
|
|
@ -56,6 +59,31 @@ let branchFilter: (
|
|||
update: (callbackFn: () => void, afterFn?: (ref: QSelect) => void) => void,
|
||||
) => void;
|
||||
|
||||
function listBranch(customerCode: string) {
|
||||
if (!props.employeeOwnerOption) return '';
|
||||
const groupedLists: { [key: string]: CustomerBranch } =
|
||||
props.employeeOwnerOption.reduce((acc, item) => {
|
||||
const code = item.codeCustomer;
|
||||
if (!acc[code]) {
|
||||
acc[code] = [];
|
||||
}
|
||||
acc[code].push(item);
|
||||
return acc;
|
||||
}, {});
|
||||
const list: CustomerBranch[] = groupedLists[customerCode];
|
||||
const names = list.map((v) => {
|
||||
return v.customer.customerType === 'CORP'
|
||||
? locale.value === 'eng'
|
||||
? v.registerNameEN
|
||||
: v.registerName
|
||||
: locale.value === 'eng'
|
||||
? `${v.firstNameEN} ${v.lastNameEN}`
|
||||
: `${v.firstName} ${v.lastName}`;
|
||||
});
|
||||
|
||||
return names.join(' / ');
|
||||
}
|
||||
|
||||
watch(
|
||||
() => optionsBranch.value,
|
||||
() => {
|
||||
|
|
@ -160,8 +188,6 @@ onMounted(() => {
|
|||
]"
|
||||
>
|
||||
<template v-slot:option="scope">
|
||||
<!-- {{ console.log(scope.opt) }} -->
|
||||
|
||||
<q-item
|
||||
v-if="scope.opt"
|
||||
v-bind="scope.itemProps"
|
||||
|
|
@ -173,7 +199,12 @@ onMounted(() => {
|
|||
<div class="q-mt-sm">
|
||||
<div>
|
||||
<span v-if="scope.opt.customer.customerType">
|
||||
{{ `${scope.opt.code} ${$t('general.name')}` }}:
|
||||
{{ scope.opt.code }}
|
||||
{{
|
||||
scope.opt.customer.customerType === 'CORP'
|
||||
? $t('customer.form.registerName')
|
||||
: $t('customer.form.ownerName')
|
||||
}}:
|
||||
{{
|
||||
scope.opt.customer.customerType === 'CORP'
|
||||
? scope.opt.customerName
|
||||
|
|
@ -187,24 +218,15 @@ onMounted(() => {
|
|||
|
||||
<div class="text-caption app-text-muted-2 q-mb-xs">
|
||||
<span v-if="scope.opt.customer" class="col column">
|
||||
{{ $t('customerEmployee.form.employerSelect.branchName') }}:
|
||||
{{
|
||||
scope.opt.customer.customerType === 'CORP'
|
||||
? $i18n.locale === 'eng'
|
||||
? scope.opt.registerNameEN
|
||||
: scope.opt.registerName
|
||||
: $i18n.locale === 'eng'
|
||||
? `${scope.opt.firstNameEN} ${scope.opt.lastNameEN}` ||
|
||||
'-'
|
||||
: `${scope.opt.firstName} ${scope.opt.lastName}` || '-'
|
||||
}}
|
||||
{{ $t('customerBranch.form.title') }}:
|
||||
{{ listBranch(scope.opt.codeCustomer) }}
|
||||
</span>
|
||||
<span v-if="scope.opt.province" class="col">
|
||||
{{ $t('general.address') }}
|
||||
{{
|
||||
$i18n.locale === 'eng'
|
||||
? `${scope.opt.addressEN || ''}, ${scope.opt.mooEN && `${$t('form.moo')} ${scope.opt.mooEN},`} ${scope.opt.soiEN && `${$t('form.soi')} ${scope.opt.soiEN},`} ${scope.opt.streetEN && `${scope.opt.streetEN} Rd,`} ${scope.opt.subDistrict.nameEN || ''}, ${scope.opt.district.nameEN || ''}, ${scope.opt.province.nameEN || ''}`
|
||||
: `${scope.opt.address || ''}, ${scope.opt.moo && `${$t('form.moo')} ${scope.opt.moo},`} ${scope.opt.soi && `${$t('form.soi')} ${scope.opt.soi},`} ${scope.opt.street && `${$t('form.street')} ${scope.opt.street},`} ${scope.opt.subDistrict.name || ''}, ${scope.opt.district.name || ''}, ${scope.opt.province.name || ''}`
|
||||
: `${scope.opt.address || ''}, ${scope.opt.moo && `${$t('form.moo')} ${scope.opt.moo},`} ${scope.opt.soi && `${$t('form.soi')} ${scope.opt.soi},`} ${scope.opt.street && `${$t('form.road')} ${scope.opt.street},`} ${scope.opt.subDistrict.name || ''}, ${scope.opt.district.name || ''}, ${scope.opt.province.name || ''}`
|
||||
}}
|
||||
{{ scope.opt.subDistrict?.zipCode || '' }}
|
||||
</span>
|
||||
|
|
@ -222,50 +244,44 @@ onMounted(() => {
|
|||
>
|
||||
<div class="q-mr-sm">
|
||||
{{ scope.opt.code }}
|
||||
{{ $t('customerEmployee.form.employerSelect.branchName') }}:
|
||||
{{
|
||||
$i18n.locale === 'eng'
|
||||
? scope.opt.registerNameEN
|
||||
: scope.opt.registerName
|
||||
scope.opt.customer.customerType === 'CORP'
|
||||
? $t('customer.form.registerName')
|
||||
: $t('customer.form.ownerName')
|
||||
}}:
|
||||
{{
|
||||
scope.opt.customer.customerType === 'CORP'
|
||||
? scope.opt.customerName
|
||||
: $i18n.locale === 'eng'
|
||||
? `${scope.opt.firstNameEN} ${scope.opt.lastNameEN}` || '-'
|
||||
: `${scope.opt.firstName} ${scope.opt.lastName}` || '-'
|
||||
}}
|
||||
</div>
|
||||
<div
|
||||
class="text-caption app-text-muted-2"
|
||||
v-if="scope.opt.customer && scope.opt.province"
|
||||
>
|
||||
{{ $t('customerEmployee.form.employerSelect.branchName') }}:
|
||||
{{
|
||||
$i18n.locale === 'eng'
|
||||
? scope.opt.customer.firstNameEN ||
|
||||
'-' + ' ' + scope.opt.customer.lastNameEN
|
||||
: scope.opt.customer.firstName ||
|
||||
'-' + ' ' + scope.opt.customer.lastName
|
||||
}}
|
||||
{{ $t('customerBranch.form.title') }}:
|
||||
{{ listBranch(scope.opt.codeCustomer) }}
|
||||
|
||||
{{ $t('general.address') }}
|
||||
{{
|
||||
$i18n.locale === 'eng'
|
||||
? `${scope.opt.addressEN || ''} ${scope.opt.subDistrict.nameEN || ''} ${scope.opt.district.nameEN || ''} ${scope.opt.province.nameEN || ''}`
|
||||
: `${scope.opt.address || ''} ${scope.opt.subDistrict.name || ''} ${scope.opt.district.name || ''} ${scope.opt.province.name || ''}`
|
||||
? `${scope.opt.addressEN || ''}, ${scope.opt.mooEN && `${$t('form.moo')} ${scope.opt.mooEN},`} ${scope.opt.soiEN && `${$t('form.soi')} ${scope.opt.soiEN},`} ${scope.opt.streetEN && `${scope.opt.streetEN} Rd,`} ${scope.opt.subDistrict.nameEN || ''}, ${scope.opt.district.nameEN || ''}, ${scope.opt.province.nameEN || ''}`
|
||||
: `${scope.opt.address || ''}, ${scope.opt.moo && `${$t('form.moo')} ${scope.opt.moo},`} ${scope.opt.soi && `${$t('form.soi')} ${scope.opt.soi},`} ${scope.opt.street && `${$t('form.road')} ${scope.opt.street},`} ${scope.opt.subDistrict.name || ''}, ${scope.opt.district.name || ''}, ${scope.opt.province.name || ''}`
|
||||
}}
|
||||
{{ scope.opt.subDistrict?.zipCode || '' }}
|
||||
<q-tooltip v-if="scope.opt.customer && scope.opt.province">
|
||||
{{ $t('customerEmployee.form.employerSelect.branchName') }}:
|
||||
{{
|
||||
$i18n.locale === 'eng'
|
||||
? scope.opt.customer.firstNameEN ||
|
||||
'-' + ' ' + scope.opt.customer.lastNameEN
|
||||
: scope.opt.customer.firstName ||
|
||||
'-' + ' ' + scope.opt.customer.lastName
|
||||
}}
|
||||
{{ $t('customerBranch.form.title') }}:
|
||||
{{ listBranch(scope.opt.codeCustomer) }}
|
||||
|
||||
{{ $t('general.address') }}
|
||||
{{
|
||||
$i18n.locale === 'eng'
|
||||
? `${scope.opt.addressEN || ''} ${scope.opt.subDistrict.nameEN || ''} ${scope.opt.district.nameEN || ''} ${scope.opt.province.nameEN || ''}`
|
||||
: `${scope.opt.address || ''} ${scope.opt.subDistrict.name || ''} ${scope.opt.district.name || ''} ${scope.opt.province.name || ''}`
|
||||
? `${scope.opt.addressEN || ''}, ${scope.opt.mooEN && `${$t('form.moo')} ${scope.opt.mooEN},`} ${scope.opt.soiEN && `${$t('form.soi')} ${scope.opt.soiEN},`} ${scope.opt.streetEN && `${scope.opt.streetEN} Rd,`} ${scope.opt.subDistrict.nameEN || ''}, ${scope.opt.district.nameEN || ''}, ${scope.opt.province.nameEN || ''}`
|
||||
: `${scope.opt.address || ''}, ${scope.opt.moo && `${$t('form.moo')} ${scope.opt.moo},`} ${scope.opt.soi && `${$t('form.soi')} ${scope.opt.soi},`} ${scope.opt.street && `${$t('form.road')} ${scope.opt.street},`} ${scope.opt.subDistrict.name || ''}, ${scope.opt.district.name || ''}, ${scope.opt.province.name || ''}`
|
||||
}}
|
||||
{{ scope.opt.zipCode || '' }}
|
||||
{{ scope.opt.subDistrict?.zipCode || '' }}
|
||||
</q-tooltip>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue