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

Merge refactor/i18n into develop

Browse source
This commit is contained in:
Methapon Metanipat 2024-08-26 16:24:08 +07:00
parent 3da5bf9079
commit c681b19e39
99 changed files with 2192 additions and 2987 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -89,10 +89,10 @@ const { state: employeeFormState, currentFromDataEmployee } =
storeToRefs(employeeFormStore);
async function init() {
utilsStore.currentTitle.title = 'customerManagement';
utilsStore.currentTitle.title = 'menu.customer';
utilsStore.currentTitle.path = [
{
text: 'customerManagementCaption',
text: 'menu.customerCaption',
i18n: true,
handler: () => router.push('/customer-management'),
},
@ -111,7 +111,7 @@ async function init() {
if (_data) {
currentCustomer.value = _data;
utilsStore.currentTitle.path.push({
text: `${currentCustomer.value.firstName} ${currentCustomer.value.lastName}`,
text: `${currentCustomer.value.firstName || '-'} ${currentCustomer.value.lastName || ''}`,
i18n: false,
});
} else {
@ -141,7 +141,7 @@ const customerTypeSelected = ref<{
label: string;
value: 'all' | 'customerLegalEntity' | 'customerNaturalPerson';
}>({
label: t('all'),
label: t('general.all'),
value: 'all',
});
@ -602,14 +602,14 @@ const emptyCreateDialog = ref(false);
@click="createCustomerForm('CORP')"
padding="xs"
icon="mdi-office-building-outline"
:label="$t('add') + ' ' + $t('customerLegalEntity')"
:label="$t('general.add') + ' ' + $t('customer.employerLegalEntity')"
external-label
label-position="left"
/>
<q-fab-action
v-if="currentTab === 'employer'"
id="add-customer-natural-person"
:label="$t('add') + ' ' + $t('customerNaturalPerson')"
:label="$t('general.add') + ' ' + $t('customer.employerNaturalPerson')"
external-label
label-position="left"
@click="createCustomerForm('PERS')"
@ -619,7 +619,7 @@ const emptyCreateDialog = ref(false);
/>
<q-fab-action
v-if="currentTab === 'employee'"
:label="$t('add') + ' ' + $t('EMPLOYEE')"
:label="$t('general.add') + ' ' + $t('customer.employee')"
external-label
id="add-employee"
label-position="left"
@ -633,7 +633,7 @@ const emptyCreateDialog = ref(false);
<div class="column full-height no-wrap">
<div v-if="$route.name === 'CustomerManagement'" class="column full-height">
<div class="text-body-2 text-weight-medium q-mb-xs flex items-center">
{{ $t('dataSum') }}
{{ $t('general.dataSum') }}
<q-badge
v-if="listCustomer"
rounded
@ -681,8 +681,8 @@ const emptyCreateDialog = ref(false);
: (statsCustomerType?.PERS ?? 0),
label:
v.name === 'CORP'
? 'customerLegalEntity'
: 'customerNaturalPerson',
? 'customer.employerLegalEntity'
: 'customer.employerNaturalPerson',
icon:
v.name === 'CORP'
? 'mdi-office-building-outline'
@ -691,7 +691,7 @@ const emptyCreateDialog = ref(false);
}))
: [
{
label: 'EMPLOYEE',
label: 'customer.employee',
count: employeeStats,
icon: 'mdi-account-outline',
color: 'pink',
@ -720,7 +720,7 @@ const emptyCreateDialog = ref(false);
for="input-search"
outlined
dense
:label="$t('search')"
:label="$t('general.search')"
class="col-12 col-md-3"
:bg-color="$q.dark.isActive ? 'dark' : 'white'"
v-model="inputSearch"
@ -751,9 +751,9 @@ const emptyCreateDialog = ref(false);
emit-value
:hide-dropdown-icon="$q.screen.lt.sm"
:options="[
{ label: $t('all'), value: 'All' },
{ label: $t('statusACTIVE'), value: 'ACTIVE' },
{ label: $t('statusINACTIVE'), value: 'INACTIVE' },
{ label: $t('general.all'), value: 'All' },
{ label: $t('status.ACTIVE'), value: 'ACTIVE' },
{ label: $t('status.INACTIVE'), value: 'INACTIVE' },
]"
></q-select>
<q-select
@ -767,7 +767,7 @@ const emptyCreateDialog = ref(false);
? fieldDisplayCustomer
: fieldDisplayEmployee
"
:display-value="$t('displayField')"
:display-value="$t('general.displayField')"
:hide-dropdown-icon="$q.screen.lt.sm"
v-model="fieldSelected"
:option-label="(l) => $t(l.label)"
@ -855,7 +855,7 @@ const emptyCreateDialog = ref(false);
currentTab === 'employer' ? 'text-bold' : 'app-text-muted'
"
>
{{ $t('EMPLOYER') }}
{{ $t('customer.employer') }}
</div>
</q-tab>
<q-tab
@ -876,7 +876,7 @@ const emptyCreateDialog = ref(false);
currentTab === 'employee' ? 'text-bold' : 'app-text-muted'
"
>
{{ $t('EMPLOYEE') }}
{{ $t('customer.employee') }}
</div>
</q-tab>
</q-tabs>
@ -910,7 +910,16 @@ const emptyCreateDialog = ref(false);
@click="customerTypeSelected = { label: v, value: v }"
>
<span class="q-px-md ellipsis">
{{ $t(v) }}
{{
$t(
{
all: 'general.all',
customerLegalEntity: 'customer.employerLegalEntity',
customerNaturalPerson:
'customer.employerNaturalPerson',
}[v],
)
}}
</span>
</q-item>
</template>
@ -924,7 +933,7 @@ const emptyCreateDialog = ref(false);
clickable
>
<span class="q-px-md ellipsis">
{{ $t('totalEmployee') }}
{{ $t('general.all') }}
</span>
</q-item>
</template>
@ -1192,7 +1201,7 @@ const emptyCreateDialog = ref(false);
style="color: hsl(var(--green-6-hsl))"
/>
<span class="col-9 q-px-md flex items-center">
{{ $t('viewDetail') }}
{{ $t('general.viewDetail') }}
</span>
</q-item>
@ -1218,7 +1227,7 @@ const emptyCreateDialog = ref(false);
style="color: hsl(var(--cyan-6-hsl))"
/>
<span class="col-9 q-px-md flex items-center">
{{ $t('edit') }}
{{ $t('general.edit') }}
</span>
</q-item>
<q-item
@ -1245,7 +1254,7 @@ const emptyCreateDialog = ref(false);
}"
/>
<span class="col-9 q-px-md flex items-center">
{{ $t('delete') }}
{{ $t('general.delete') }}
</span>
</q-item>
@ -1272,8 +1281,8 @@ const emptyCreateDialog = ref(false);
<span class="q-pl-md">
{{
props.row.status !== 'INACTIVE'
? $t('switchOnLabel')
: $t('switchOffLabel')
? $t('general.open')
: $t('general.close')
}}
</span>
</div>
@ -1321,12 +1330,12 @@ const emptyCreateDialog = ref(false);
separateEnter
history
:prefix-id="
props.row.customerNameEN ?? props.rowIndex
props.row.customerNameEN ?? String(props.rowIndex)
"
:data="{
code: props.row.code,
name:
$i18n.locale === 'en-US'
$i18n.locale === 'eng'
? `${props.row.firstName} ${props.row.lastName} `.trim()
: `${props.row.firstNameEN} ${props.row.lastNameEN} `.trim(),
img:
@ -1356,8 +1365,8 @@ const emptyCreateDialog = ref(false);
}[props.row.customerType as string] || 'CORP',
value: $t(
props.row.customerType === 'CORP'
? 'customerLegalEntity'
: 'customerNaturalPerson',
? 'customer.employerLegalEntity'
: 'customer.employerNaturalPerson',
),
},
]"
@ -1402,7 +1411,7 @@ const emptyCreateDialog = ref(false);
style="width: 80px"
v-if="$q.screen.gt.sm"
>
{{ $t('showing') }}
{{ $t('general.recordPerPage') }}
</div>
<div>
<q-btn-dropdown
@ -1436,7 +1445,7 @@ const emptyCreateDialog = ref(false);
<div class="col-4 flex justify-center app-text-muted">
{{
$t('recordsPage', {
$t('general.recordsPage', {
resultcurrentPage: listCustomer.length,
total: statsCustomerType.PERS + statsCustomerType.CORP,
})
@ -1512,7 +1521,7 @@ const emptyCreateDialog = ref(false);
style="width: 80px"
v-if="$q.screen.gt.sm"
>
{{ $t('showing') }}
{{ $t('general.recordPerPage') }}
</div>
<div>
<q-btn-dropdown
@ -1546,7 +1555,7 @@ const emptyCreateDialog = ref(false);
<div class="col-4 flex justify-center app-text-muted">
{{
$t('recordsPage', {
$t('general.recordsPage', {
resultcurrentPage: listEmployee.length,
total: employeeStats,
})
@ -1577,16 +1586,8 @@ const emptyCreateDialog = ref(false);
>
<TooltipComponent
class="self-end q-ma-md"
:title="
currentTab === 'employer'
? 'customerEmployerTooltipTitle'
: 'customerEmployeeTooltipTitle'
"
:caption="
currentTab === 'employer'
? 'customerEmployerTooltipCaption'
: 'customerEmployeeTooltipCaption'
"
:title="'general.noData'"
:caption="'general.clickToCreate'"
imgSrc="personnel-table-"
/>
@ -1595,11 +1596,10 @@ const emptyCreateDialog = ref(false);
style="flex-grow: 1"
>
<EmptyAddButton
:label="
currentTab === 'employer'
? 'customerEmployerAdd'
: 'customerEmployeeAdd'
"
:label="'general.add'"
:i18n-args="{
text: $t(`customer.${currentTab}`),
}"
@trigger="
() => {
if (currentTab === 'employer') {
@ -1638,7 +1638,7 @@ const emptyCreateDialog = ref(false);
<DialogForm
v-model:modal="emptyCreateDialog"
:title="$t('customerCardUserType')"
:title="$t('customer.employerType')"
hide-footer
no-app-box
width="60vw"
@ -1725,7 +1725,7 @@ const emptyCreateDialog = ref(false);
<SideMenu
:menu="[
{
name: $t('customer.form.group.basicInfo'),
name: $t('form.field.basicInformation'),
anchor: 'form-basic-info-customer',
},
{
@ -1995,10 +1995,19 @@ const emptyCreateDialog = ref(false);
:img="employeeFormState.profileUrl || `/images/employee-avatar.png`"
:tabs-list="
[
{ name: 'personalInfo', label: 'personalInfo' },
{ name: 'healthCheck', label: 'healthCheck' },
{ name: 'workHistory', label: 'workHistory' },
{ name: 'other', label: 'other' },
{
name: 'personalInfo',
label: 'customerEmployee.form.group.personalInfo',
},
{
name: 'healthCheck',
label: 'customerEmployee.form.group.healthCheck',
},
{
name: 'workHistory',
label: 'customerEmployee.form.group.workHistory',
},
{ name: 'other', label: 'customerEmployee.form.group.other' },
].filter((v) => {
if (!employeeFormState.statusSavePersonal) {
return v.name === 'personalInfo';
@ -2008,7 +2017,7 @@ const emptyCreateDialog = ref(false);
})
"
:menu="formMenuIconEmployee"
:toggleTitle="$t('formDialogTitleUserStatus')"
:toggleTitle="$t('status.title')"
:hideFade="
employeeFormState.profileUrl === '' ||
employeeFormState.profileUrl === undefined
@ -2042,44 +2051,44 @@ const emptyCreateDialog = ref(false);
:menu="
[
{
name: $t('formDialogTitleInformation'),
name: $t('form.field.basicInformation'),
anchor: 'form-information',
tab: 'personalInfo',
},
{
name: $t('formDialogTitlePersonal'),
name: $t('customerEmployee.form.group.personalInfo'),
anchor: 'form-personal',
tab: 'personalInfo',
},
{
name: $t('formDialogTitlePersonnelAddress'),
name: $t('general.address'),
anchor: 'form-personal-address',
tab: 'personalInfo',
},
{
name: $t('formDialogTitlePassport'),
name: $t('customerEmployee.form.group.passport'),
anchor: 'form-passport',
tab: 'personalInfo',
},
{
name: $t('formDialogTitleVisa'),
name: $t('customerEmployee.form.group.visa'),
anchor: 'form-visa',
tab: 'personalInfo',
},
...(currentFromDataEmployee.employeeCheckup?.map((v, i) => ({
name: $t('customer.form.instance', { index: i + 1 }),
name: $t('general.times', { number: i + 1 }),
anchor: `form-employee-checkup-${i}`,
tab: 'healthCheck',
})) || []),
...(currentFromDataEmployee.employeeWork?.map((v, i) => ({
name: $t('customer.form.instance', { index: i + 1 }),
name: $t('general.times', { number: i + 1 }),
anchor: `form-employee-work-history-${i}`,
tab: 'workHistory',
})) || []),
{
name: $t('formDialogTitleFamilyHistory'),
name: $t('customerEmployee.form.group.family'),
anchor: 'form-employee-other',
tab: 'other',
},
@ -2159,7 +2168,7 @@ const emptyCreateDialog = ref(false);
dense
outlined
separator
:title="$t('formDialogTitleInformation')"
title="form.field.basicInformation"
:readonly="!employeeFormState.isEmployeeEdit"
:employee-owner-option="employeeStore.ownerOption"
v-model:customer-branch="employeeFormState.formDataEmployeeOwner"
@ -2176,7 +2185,7 @@ const emptyCreateDialog = ref(false);
outlined
employee
separator
:title="$t('personalInfo')"
title="customerEmployee.form.group.personalInfo"
v-model:open="employeeFormState.dialogModal"
v-model:firstName="currentFromDataEmployee.firstName"
v-model:lastName="currentFromDataEmployee.lastName"
@ -2210,7 +2219,7 @@ const emptyCreateDialog = ref(false);
dense
outlined
separator
:title="$t('formDialogTitlePassport')"
:title="$t('customerEmployee.form.group.passport')"
v-model:passport-type="currentFromDataEmployee.passportType"
v-model:passport-number="currentFromDataEmployee.passportNumber"
v-model:passport-issue-date="
@ -2236,7 +2245,7 @@ const emptyCreateDialog = ref(false);
id="form-visa"
dense
outlined
:title="$t(`formDialogTitleVisa`)"
title="customerEmployee.form.group.visa"
v-model:visa-type="currentFromDataEmployee.visaType"
v-model:visa-number="currentFromDataEmployee.visaNumber"
v-model:visa-issue-date="currentFromDataEmployee.visaIssueDate"
@ -2520,7 +2529,7 @@ const emptyCreateDialog = ref(false);
<SideMenu
:menu="[
{
name: $t('customer.form.group.basicInfo'),
name: $t('form.field.basicInformation'),
anchor: 'form-basic-info-customer',
},
{
@ -2727,7 +2736,7 @@ const emptyCreateDialog = ref(false);
v-model:drawer-open="employeeFormState.drawerModal"
:title="
employeeFormState.currentEmployee
? $i18n.locale === 'en-US'
? $i18n.locale === 'eng'
? `${employeeFormState.currentEmployee.firstNameEN} ${employeeFormState.currentEmployee.lastNameEN}`
: `${employeeFormState.currentEmployee.firstName} ${employeeFormState.currentEmployee.lastName}`
: '-'
@ -2802,7 +2811,7 @@ const emptyCreateDialog = ref(false);
fallback-cover="/images/employee-banner.png"
:title="
employeeFormState.currentEmployee
? $i18n.locale === 'en-US'
? $i18n.locale === 'eng'
? `${employeeFormState.currentEmployee.firstNameEN} ${employeeFormState.currentEmployee.lastNameEN}`
: `${employeeFormState.currentEmployee.firstName} ${employeeFormState.currentEmployee.lastName}`
: '-'
@ -2810,13 +2819,22 @@ const emptyCreateDialog = ref(false);
:caption="currentFromDataEmployee.code"
:img="employeeFormState.profileUrl || '/images/employee-avatar.png'"
:tabs-list="[
{ name: 'personalInfo', label: 'personalInfo' },
{ name: 'healthCheck', label: 'healthCheck' },
{ name: 'workHistory', label: 'workHistory' },
{ name: 'other', label: 'other' },
{
name: 'personalInfo',
label: 'customerEmployee.form.group.personalInfo',
},
{
name: 'healthCheck',
label: 'customerEmployee.form.group.healthCheck',
},
{
name: 'workHistory',
label: 'customerEmployee.form.group.workHistory',
},
{ name: 'other', label: 'customerEmployee.form.group.other' },
]"
:menu="formMenuIconEmployee"
:toggle-title="$t('formDialogTitleUserStatus')"
:toggle-title="$t('status.title')"
:hide-fade="
employeeFormState.profileUrl === '' ||
employeeFormState.profileUrl === undefined
@ -2835,44 +2853,44 @@ const emptyCreateDialog = ref(false);
:menu="
[
{
name: $t('formDialogTitleInformation'),
name: $t('form.field.basicInformation'),
anchor: 'drawer-form-information',
tab: 'personalInfo',
},
{
name: $t('formDialogTitlePersonal'),
name: $t('customerEmployee.form.group.personalInfo'),
anchor: 'drawer-form-personal',
tab: 'personalInfo',
},
{
name: $t('formDialogTitlePersonnelAddress'),
name: $t('form.address'),
anchor: 'drawer-form-personal-address',
tab: 'personalInfo',
},
{
name: $t('formDialogTitlePassport'),
name: $t('customerEmployee.form.group.passport'),
anchor: 'drawer-form-passport',
tab: 'personalInfo',
},
{
name: $t('formDialogTitleVisa'),
name: $t('customerEmployee.form.group.visa'),
anchor: 'drawer-form-visa',
tab: 'personalInfo',
},
...(currentFromDataEmployee.employeeCheckup?.map(
(v, i) => ({
name: $t('customer.form.instance', { index: i + 1 }),
name: $t('general.times', { number: i + 1 }),
anchor: `drawer-employee-checkup-${i}`,
tab: 'healthCheck',
}),
) || []),
...(currentFromDataEmployee.employeeWork?.map((v, i) => ({
name: $t('customer.form.instance', { index: i + 1 }),
name: $t('general.times', { number: i + 1 }),
anchor: `drawer-employee-work-history-${i}`,
tab: 'workHistory',
})) || []),
{
name: $t('formDialogTitleFamilyHistory'),
name: $t('customerEmployee.form.group.family'),
anchor: 'drawer-other',
tab: 'other',
},
@ -2944,7 +2962,7 @@ const emptyCreateDialog = ref(false);
prefix-id="drawer-info-employee"
dense
outlined
:title="'formDialogTitleInformation'"
title="form.field.basicInformation"
:readonly="!employeeFormState.isEmployeeEdit"
:employee-owner-option="employeeStore.ownerOption"
v-model:customer-branch="
@ -2965,7 +2983,7 @@ const emptyCreateDialog = ref(false);
outlined
employee
separator
:title="'personalInfo'"
title="customerEmployee.form.group.personalInfo"
:readonly="!employeeFormState.isEmployeeEdit"
v-model:firstName="currentFromDataEmployee.firstName"
v-model:lastName="currentFromDataEmployee.lastName"
@ -2996,7 +3014,7 @@ const emptyCreateDialog = ref(false);
dense
outlined
separator
:title="'formDialogTitlePassport'"
:title="'customerEmployee.form.group.passport'"
:readonly="!employeeFormState.isEmployeeEdit"
v-model:passport-type="currentFromDataEmployee.passportType"
v-model:passport-number="currentFromDataEmployee.passportNumber"
@ -3022,7 +3040,7 @@ const emptyCreateDialog = ref(false);
id="drawer-form-visa"
dense
outlined
:title="`formDialogTitleVisa`"
title="customerEmployee.form.group.visa"
:readonly="!employeeFormState.isEmployeeEdit"
v-model:visa-type="currentFromDataEmployee.visaType"
v-model:visa-number="currentFromDataEmployee.visaNumber"