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

refactor: add Function edit Personal

Browse source
This commit is contained in:
Net 2024-08-07 13:30:05 +07:00
parent 54e330a4cf
commit 287d73a1a5
2 changed files with 103 additions and 30 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -9,7 +9,7 @@ import { calculateAge, dateFormat } from 'src/utils/datetime';
import useCustomerStore from 'stores/customer';
import useEmployeeStore from 'stores/employee';
import useMyBranchStore from 'stores/my-branch';
import useUtilsStore, { dialog, notify } from 'stores/utils';
import useUtilsStore, { dialog } from 'stores/utils';
import useFlowStore from 'stores/flow';
import { Status } from 'stores/types';
import { CustomerStats, Customer, CustomerBranch } from 'stores/customer/types';
@ -408,6 +408,12 @@ async function editCustomerForm(id: string) {
customerFormState.value.editCustomerId = id;
}
async function editEmployeeFormPersonal(id: string) {
await employeeFormStore.assignFormDataEmployee(id);
employeeFormState.value.dialogType = 'edit';
employeeFormState.value.drawerModal = true;
}
function employeeConfirmUnsave(close = true) {
dialog({
color: 'warning',
@ -615,8 +621,8 @@ watch(
? customerStats.map((v) => ({
count:
v.name === 'CORP'
? (statsCustomerType?.CORP ?? 0)
: (statsCustomerType?.PERS ?? 0),
? statsCustomerType?.CORP ?? 0
: statsCustomerType?.PERS ?? 0,
label:
v.name === 'CORP'
? 'customerLegalEntity'
@ -1507,12 +1513,10 @@ watch(
class="row q-py-sm"
style="white-space: nowrap"
@click="
() => {
// openDialogInputForm(
// 'INFO',
// props.row.id,
// true,
// );
async () => {
await editEmployeeFormPersonal(
props.row.id,
);
}
"
>
@ -1614,7 +1618,7 @@ watch(
{
icon: 'mdi-clock-outline',
value: props.row.dateOfBirth
? (calculateAge(props.row.dateOfBirth) ?? '')
? calculateAge(props.row.dateOfBirth) ?? ''
: '',
},
],
@ -1920,10 +1924,19 @@ watch(
:title="$t('form.title.create', { name: 'Employee' })"
v-model:modal="employeeFormState.dialogModal"
:undo="() => employeeFormUndo(false)"
:submit="
async () => {
await employeeFormStore.submitPersonal();
await fetchListEmployee();
}
"
:close="
() => {
employeeFormStore.resetFormDataEmployee(true);
}
"
:before-close="
() => {
console.log('asd');
if (employeeFormStore.isFormDataDifferent()) {
employeeConfirmUnsave();
return true;
@ -1933,6 +1946,7 @@ watch(
"
>
<div class="q-mx-lg q-mt-lg">
{{ employeeFormState.statusSavePersonal }}
<ProfileBanner
active
useToggle
@ -1944,12 +1958,20 @@ watch(
v-model:toggle-status="currentFromDataEmployee.status"
fallbackCover="/images/employee-banner.png"
: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' },
]"
:tabs-list="
[
{ name: 'personalInfo', label: 'personalInfo' },
{ name: 'healthCheck', label: 'healthCheck' },
{ name: 'workHistory', label: 'workHistory' },
{ name: 'other', label: 'other' },
].filter((v) => {
if (!employeeFormState.statusSavePersonal) {
return v.name === 'personalInfo';
}
return true;
})
"
:menu="formMenuIconEmployee"
:toggleTitle="$t('formDialogTitleUserStatus')"
:hideFade="
@ -2051,7 +2073,6 @@ watch(
v-model:nrc-no="currentFromDataEmployee.nrcNo"
v-model:code="currentFromDataEmployee.code"
@filter-owner-branch="employeeFormStore.employeeFilterOwnerBranch"
@save="() => employeeFormStore.submitPersonal()"
/>
<FormPerson
id="form-personal"
@ -2243,6 +2264,12 @@ watch(
? 'app-bg-female text-white'
: ''
"
:submit="
async () => {
await employeeFormStore.submitPersonal();
employeeFormState.isEmployeeEdit = false;
}
"
>
<div class="full-height full-width column">
<div class="q-mx-lg q-mt-lg">

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

@ -371,9 +371,10 @@ export const useEmployeeForm = defineStore('form-employee', () => {
profileSubmit: boolean;
formDataEmployeeSameAddr: boolean;
editReadonly: boolean;
statusSavePersonal: boolean;
infoEmployeePersonCard: {
id: string;
img: string;
img?: string;
name: string;
male: boolean;
female: boolean;
@ -392,6 +393,7 @@ export const useEmployeeForm = defineStore('form-employee', () => {
}
| undefined;
}>({
statusSavePersonal: false,
drawerModal: false,
imageDialog: false,
currentTab: 'personalInfo',
@ -491,7 +493,7 @@ export const useEmployeeForm = defineStore('form-employee', () => {
},
};
const resetEmployeeData = structuredClone(defaultFormData);
let resetEmployeeData = structuredClone(defaultFormData);
const currentFromDataEmployee = ref<EmployeeCreate>(
structuredClone(defaultFormData),
);
@ -503,10 +505,20 @@ export const useEmployeeForm = defineStore('form-employee', () => {
);
}
function resetFormDataEmployee(cb?: (...args: any[]) => unknown) {
state.value.dialogType = 'create';
// function resetFormDataEmployee(cb?: (...args: any[]) => unknown) {
// state.value.dialogType = 'create';
// currentFromDataEmployee.value = structuredClone(resetEmployeeData);
// cb?.();
// }
function resetFormDataEmployee(clean = false) {
if (clean) {
state.value.formDataEmployeeOwner = undefined;
resetEmployeeData = structuredClone(defaultFormData);
state.value.statusSavePersonal = false;
return;
}
currentFromDataEmployee.value = structuredClone(resetEmployeeData);
cb?.();
}
async function submitPersonal() {
@ -519,28 +531,61 @@ export const useEmployeeForm = defineStore('form-employee', () => {
employeeCheckup: [],
employeeOtherInfo: undefined,
});
if (res) {
await assignFormDataEmployee(res.id);
state.value.statusSavePersonal = true;
}
}
if (state.value.dialogType === 'edit') {
const res = await employeeStore.editById(
state.value.currentEmployee?.id || '',
{
...currentFromDataEmployee.value,
status:
state.value.currentEmployee?.status === 'CREATED'
? 'ACTIVE'
: state.value.currentEmployee?.status,
customerBranchId: state.value.formDataEmployeeOwner?.id || '',
employeeWork: [],
employeeCheckup: [],
employeeOtherInfo: undefined,
},
);
if (res) {
await assignFormDataEmployee(res.id);
state.value.statusSavePersonal = true;
}
}
}
async function assignFormDataEmployee(id: string) {
async function assignFormDataEmployee(id?: string) {
if (!id) {
resetEmployeeData = structuredClone(defaultFormData);
return;
}
const res = await employeeStore.fetchById(id);
if (res) {
state.value.currentEmployee = res;
const {
createdAt,
createdByUserId,
statusOrder,
id,
province,
district,
subDistrict,
updatedAt,
updatedByUserId,
createdBy,
updatedBy,
profileImageUrl,
...playlond
} = res;
currentFromDataEmployee.value = {
resetEmployeeData = {
...playlond,
provinceId: province?.id,
districtId: district?.id,
@ -551,13 +596,15 @@ export const useEmployeeForm = defineStore('form-employee', () => {
image: null,
};
currentFromDataEmployee.value = structuredClone(resetEmployeeData);
const foundBranch = await customerStore.fetchListCustomeBranchById(
playlond.customerBranchId,
);
state.value.currentEmployeeCode = playlond.code;
state.value.profileUrl = profileImageUrl || '';
state.value.profileUrl = profileImageUrl || ' ';
profileImageUrl
? (state.value.profileSubmit = true)
@ -573,10 +620,9 @@ export const useEmployeeForm = defineStore('form-employee', () => {
state.value.formDataEmployeeSameAddr = false;
}
if (state.value.infoEmployeePersonCard) {
state.value.infoEmployeePersonCard[0].img = profileImageUrl || '';
if (state.value.infoEmployeePersonCard && profileImageUrl !== null) {
state.value.infoEmployeePersonCard[0].img = profileImageUrl;
}
flowStore.rotate();
}
}