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

feat: create customer dialog on empty

Browse source
This commit is contained in:
Methapon2001 2024-08-13 20:55:13 +07:00
parent db5ed1c61a
commit d140c2dc34
1 changed files with 48 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -16,6 +16,7 @@ import { CustomerStats, Customer, CustomerBranch } from 'stores/customer/types';
import { Employee, EmployeeHistory } from 'stores/employee/types'; import { Employee, EmployeeHistory } from 'stores/employee/types';
import { AddressForm } from 'components/form'; import { AddressForm } from 'components/form';
import ItemCard from 'src/components/ItemCard.vue';
import DrawerInfo from 'components/DrawerInfo.vue'; import DrawerInfo from 'components/DrawerInfo.vue';
import ButtonAddComponent from 'components/ButtonAddCompoent.vue'; import ButtonAddComponent from 'components/ButtonAddCompoent.vue';
import PersonCard from 'components/shared/PersonCard.vue'; import PersonCard from 'components/shared/PersonCard.vue';
@ -134,6 +135,18 @@ const maxPageEmployee = ref<number>(1);
const pageSize = ref<number>(10); const pageSize = ref<number>(10);
const dialogCustomerImageUpload = ref<InstanceType<typeof ImageUploadDialog>>(); const dialogCustomerImageUpload = ref<InstanceType<typeof ImageUploadDialog>>();
const dialogEmployeeImageUpload = ref<InstanceType<typeof ImageUploadDialog>>(); const dialogEmployeeImageUpload = ref<InstanceType<typeof ImageUploadDialog>>();
const dialogCreateCustomerItem = [
{
icon: 'mdi:office-building',
text: 'customerLegalEntity',
color: 'var(--purple-8)',
},
{
icon: 'heroicons:user-solid',
text: 'customerNaturalPerson',
color: 'var(--green-9)',
},
];
watch(() => route.name, init); watch(() => route.name, init);
watch( watch(
@ -561,6 +574,8 @@ watch(
employeeFormState.value.isEmployeeEdit = false; employeeFormState.value.isEmployeeEdit = false;
}, },
); );
const emptyCreateDialog = ref(false);
</script> </script>
<template> <template>
@ -650,8 +665,8 @@ watch(
? customerStats.map((v) => ({ ? customerStats.map((v) => ({
count: count:
v.name === 'CORP' v.name === 'CORP'
? (statsCustomerType?.CORP ?? 0) ? statsCustomerType?.CORP ?? 0
: (statsCustomerType?.PERS ?? 0), : statsCustomerType?.PERS ?? 0,
label: label:
v.name === 'CORP' v.name === 'CORP'
? 'customerLegalEntity' ? 'customerLegalEntity'
@ -1686,7 +1701,7 @@ watch(
{ {
icon: 'mdi-clock-outline', icon: 'mdi-clock-outline',
value: props.row.dateOfBirth value: props.row.dateOfBirth
? (calculateAge(props.row.dateOfBirth) ?? '') ? calculateAge(props.row.dateOfBirth) ?? ''
: '', : '',
}, },
], ],
@ -1810,7 +1825,7 @@ watch(
? 'customerEmployerAdd' ? 'customerEmployerAdd'
: 'customerEmployeeAdd' : 'customerEmployeeAdd'
" "
@trigger="() => {}" @trigger="() => (emptyCreateDialog = true)"
/> />
</div> </div>
</template> </template>
@ -1838,6 +1853,35 @@ watch(
</div> </div>
</div> </div>
<DialogForm
v-model:modal="emptyCreateDialog"
:title="$t('customerCardUserType')"
hide-footer
no-app-box
width="60vw"
height="300px"
:close="() => (emptyCreateDialog = false)"
>
<div class="full-height row q-pa-md">
<ItemCard
class="col q-mx-sm full-height"
v-for="i in dialogCreateCustomerItem"
:key="i.text"
:icon="i.icon"
:text="i.text"
:color="i.color"
@trigger="
() => {
createCustomerForm(
i.text === 'customerLegalEntity' ? 'CORP' : 'PERS',
);
emptyCreateDialog = false;
}
"
/>
</div>
</DialogForm>
<DialogContainer <DialogContainer
:model-value="customerFormState.dialogModal" :model-value="customerFormState.dialogModal"
:on-open=" :on-open="