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

feat: employee address (same with employer)

Browse source
This commit is contained in:
puriphatt 2024-06-13 10:07:20 +00:00
parent c72f44d50a
commit 39118cc227
5 changed files with 204 additions and 40 deletions
Download patch file Download diff file Expand all files Collapse all files

92
src/components/03_customer-management/BasicInformation.vue
View file

@ -1,4 +1,5 @@
<script setup lang="ts">
import { CustomerBranch } from 'src/stores/customer/types';
import { onMounted, ref } from 'vue';
const customerName = defineModel<string>('customerName');
@ -8,7 +9,15 @@ const taxNo = defineModel<string | null | undefined>('taxNo');
const employerID = defineModel<string>('employerID');
// employee
const customerBranchId = defineModel<string>('customerBranchId');
const customerBranch = defineModel<{
id: string;
address: string;
addressEN: string;
provinceId: string;
districtId: string;
subDistrictId: string;
zipCode: string;
}>('customerBranch');
const employeeId = defineModel<string>('employeeId');
const nrcNo = defineModel<string>('nrcNo');
@ -20,7 +29,7 @@ defineProps<{
typeCustomer?: string;
employee?: boolean;
employeeOwnerOption?: { label: string; value: string }[];
employeeOwnerOption?: CustomerBranch[];
}>();
defineEmits<{
@ -91,11 +100,20 @@ onMounted(async () => {});
:readonly="readonly"
:borderless="readonly"
hide-bottom-space
class="col-3"
class="col-12"
:label="$t('formDialogEmployerBranchCode')"
v-model="customerBranchId"
option-label="label"
option-value="value"
v-model="customerBranch"
:option-value="
(v) => ({
id: v.id,
address: v.address,
addressEN: v.addressEN,
provinceId: v.provinceId,
districtId: v.districtId,
subDistrictId: v.subDistrictId,
zipCode: v.zipCode,
})
"
emit-value
map-options
:options="employeeOwnerOption"
@ -104,7 +122,65 @@ onMounted(async () => {});
(val: string) =>
!!val || $t('selectValidate') + $t('formDialogEmployerBranchCode'),
]"
/>
>
<template v-slot:before-options>
<q-item>
<div
class="row items-center col-12 app-text-muted text-weight-medium"
>
<div class="col-4">{{ $t('branchCode') }}</div>
<div class="col">{{ $t('name') }}</div>
<div class="col">{{ $t('address') }}</div>
</div>
</q-item>
</template>
<template v-slot:option="scope">
<q-item v-bind="scope.itemProps">
<div v-if="scope.opt" class="row items-center col-12">
<div class="col-4">
{{ scope.opt.code }}
</div>
<div class="col">
{{ $i18n.locale === 'en-US' ? scope.opt.nameEN : scope.opt.name }}
</div>
<div v-if="scope.opt.province" class="col">
{{
$i18n.locale === 'en-US'
? scope.opt.addressEN
: scope.opt.address
}}
({{
$i18n.locale === 'en-US'
? scope.opt.province.nameEN
: scope.opt.province.name
}})
</div>
</div>
</q-item>
</template>
<template v-slot:selected-item="scope">
<div v-if="scope.opt" class="row items-center col-12">
<div class="col-4">
{{ scope.opt.code }}
</div>
<div class="col">
{{ $i18n.locale === 'en-US' ? scope.opt.nameEN : scope.opt.name }}
</div>
<div v-if="scope.opt.province" class="col">
{{
$i18n.locale === 'en-US' ? scope.opt.addressEN : scope.opt.address
}}
({{
$i18n.locale === 'en-US'
? scope.opt.province.nameEN
: scope.opt.province.name
}})
</div>
</div>
</template>
</q-select>
<q-input
for="input-employeeID"
:dense="dense"
@ -112,7 +188,7 @@ onMounted(async () => {});
:readonly="true"
:borderless="readonly"
hide-bottom-space
class="col-3"
class="col-6"
:label="$t('formDialogEmployeeID')"
v-model="employeeId"
/>