453 lines
12 KiB
TypeScript
453 lines
12 KiB
TypeScript
import { ref, watch } from 'vue';
|
|
import { defineStore } from 'pinia';
|
|
import { CustomerCreate } from 'src/stores/customer/types';
|
|
import { Employee, EmployeeCreate } from 'src/stores/employee/types';
|
|
|
|
import useMyBranch from 'src/stores/my-branch';
|
|
import useCustomerStore from 'src/stores/customer';
|
|
import useEmployeeStore from 'src/stores/employee';
|
|
import useFlowStore from 'src/stores/flow';
|
|
|
|
export const useCustomerForm = defineStore('form-customer', () => {
|
|
const apiBaseUrl = import.meta.env.VITE_API_BASE_URL;
|
|
|
|
const customerStore = useCustomerStore();
|
|
const branchStore = useMyBranch();
|
|
|
|
const defaultFormData: CustomerCreate = {
|
|
status: 'CREATED',
|
|
personName: '',
|
|
customerType: 'CORP',
|
|
customerName: '',
|
|
customerNameEN: '',
|
|
taxNo: '',
|
|
registeredBranchId: branchStore.currentMyBranch?.id || '',
|
|
customerBranch: [],
|
|
image: null,
|
|
};
|
|
let resetFormData = structuredClone(defaultFormData);
|
|
|
|
const currentFormData = ref<CustomerCreate>(structuredClone(defaultFormData));
|
|
const state = ref<{
|
|
dialogType: 'info' | 'create' | 'edit';
|
|
dialogOpen: boolean;
|
|
dialogModal: boolean;
|
|
branchIndex: number;
|
|
saveMode: 'customer' | 'branch';
|
|
customerImageUrl: string;
|
|
imageDialog: boolean;
|
|
imageEdit: boolean;
|
|
editReadonly: boolean;
|
|
editCustomerId?: string;
|
|
editCustomerBranchId?: string;
|
|
}>({
|
|
dialogType: 'info',
|
|
dialogOpen: false,
|
|
dialogModal: false,
|
|
imageDialog: false,
|
|
branchIndex: 0,
|
|
editReadonly: true,
|
|
imageEdit: false,
|
|
saveMode: 'customer',
|
|
customerImageUrl: '',
|
|
editCustomerId: '',
|
|
editCustomerBranchId: '',
|
|
});
|
|
|
|
watch(
|
|
currentFormData,
|
|
(v) => (defaultFormData.customerType = v.customerType),
|
|
);
|
|
|
|
function isFormDataDifferent() {
|
|
return (
|
|
JSON.stringify(resetFormData) !== JSON.stringify(currentFormData.value)
|
|
);
|
|
}
|
|
|
|
function resetForm(clean = false) {
|
|
if (clean) {
|
|
defaultFormData.customerType = currentFormData.value.customerType;
|
|
currentFormData.value = structuredClone(defaultFormData);
|
|
currentFormData.value.registeredBranchId =
|
|
branchStore.currentMyBranch?.id || '';
|
|
resetFormData = structuredClone(defaultFormData);
|
|
resetFormData.registeredBranchId = branchStore.currentMyBranch?.id || '';
|
|
state.value.editCustomerId = '';
|
|
return;
|
|
}
|
|
|
|
if (!resetFormData.registeredBranchId) {
|
|
resetFormData.registeredBranchId = branchStore.currentMyBranch?.id || '';
|
|
}
|
|
|
|
if (state.value.dialogType === 'create') {
|
|
state.value.editCustomerId = '';
|
|
}
|
|
|
|
currentFormData.value = structuredClone(resetFormData);
|
|
}
|
|
|
|
async function assignFormData(id?: string) {
|
|
if (!id) {
|
|
resetFormData = structuredClone(defaultFormData);
|
|
return;
|
|
}
|
|
|
|
const data = await customerStore.fetchById(id);
|
|
|
|
if (!data) return;
|
|
|
|
state.value.customerImageUrl = `${apiBaseUrl}/customer/${id}/image`;
|
|
|
|
resetFormData.registeredBranchId = data.registeredBranchId;
|
|
resetFormData.status = data.status;
|
|
resetFormData.customerType = data.customerType;
|
|
resetFormData.customerName = data.customerName;
|
|
resetFormData.customerNameEN = data.customerNameEN;
|
|
resetFormData.personName = data.personName;
|
|
resetFormData.taxNo = data.taxNo;
|
|
resetFormData.image = null;
|
|
|
|
resetFormData.customerBranch = data.branch.map((v) => ({
|
|
id: v.id,
|
|
code: v.code,
|
|
branchNo: v.branchNo,
|
|
address: v.address,
|
|
addressEN: v.addressEN,
|
|
provinceId: v.province.id,
|
|
districtId: v.district.id,
|
|
subDistrictId: v.subDistrict.id,
|
|
zipCode: v.zipCode,
|
|
email: v.email,
|
|
telephoneNo: v.telephoneNo,
|
|
name: v.name,
|
|
status: undefined,
|
|
taxNo: v.taxNo,
|
|
nameEN: v.nameEN,
|
|
legalPersonNo: v.legalPersonNo,
|
|
registerName: v.registerName,
|
|
registerDate: new Date(v.registerDate),
|
|
authorizedCapital: v.authorizedCapital,
|
|
employmentOffice: v.employmentOffice,
|
|
bussinessType: v.bussinessType,
|
|
bussinessTypeEN: v.bussinessTypeEN,
|
|
jobPosition: v.jobPosition,
|
|
jobPositionEN: v.jobPositionEN,
|
|
jobDescription: v.jobDescription,
|
|
saleEmployee: v.saleEmployee,
|
|
payDate: new Date(v.payDate),
|
|
wageRate: v.wageRate,
|
|
}));
|
|
|
|
currentFormData.value = structuredClone(resetFormData);
|
|
}
|
|
|
|
function addCurrentCustomerBranch() {
|
|
currentFormData.value.customerBranch?.push({
|
|
id: '',
|
|
code: '',
|
|
branchNo:
|
|
(currentFormData.value.customerBranch?.at(-1)?.branchNo || 0) + 1,
|
|
address: '',
|
|
addressEN: '',
|
|
provinceId: '',
|
|
districtId: '',
|
|
subDistrictId: '',
|
|
zipCode: '',
|
|
email: '',
|
|
telephoneNo: '',
|
|
name: '',
|
|
status: 'CREATED',
|
|
taxNo: '',
|
|
nameEN: '',
|
|
legalPersonNo: '',
|
|
registerName: '',
|
|
registerDate: new Date(),
|
|
authorizedCapital: '',
|
|
employmentOffice: '',
|
|
bussinessType: '',
|
|
bussinessTypeEN: '',
|
|
jobPosition: '',
|
|
jobPositionEN: '',
|
|
jobDescription: '',
|
|
saleEmployee: '',
|
|
payDate: new Date(),
|
|
wageRate: 0,
|
|
});
|
|
}
|
|
|
|
async function submitForm() {
|
|
if (state.value.saveMode === 'customer') {
|
|
const _data = await submitFormCustomer();
|
|
if (_data) {
|
|
await assignFormData(_data.id);
|
|
state.value.dialogType = 'edit';
|
|
state.value.editReadonly = true;
|
|
state.value.editCustomerId = _data.id;
|
|
}
|
|
}
|
|
}
|
|
|
|
async function submitFormCustomer() {
|
|
if (state.value.dialogType === 'info') return;
|
|
|
|
if (state.value.dialogType === 'create') {
|
|
return await customerStore.create(currentFormData.value);
|
|
}
|
|
|
|
if (!state.value.editCustomerId) {
|
|
throw new Error(
|
|
'Form mode is set to edit but no ID is provided. Make sure to set customer ID.',
|
|
);
|
|
}
|
|
|
|
await customerStore.editById(state.value.editCustomerId, {
|
|
...currentFormData.value,
|
|
status:
|
|
currentFormData.value.status !== 'CREATED'
|
|
? currentFormData.value.status
|
|
: undefined,
|
|
image: currentFormData.value.image || undefined,
|
|
customerBranch: undefined,
|
|
});
|
|
}
|
|
|
|
return {
|
|
state,
|
|
resetFormData,
|
|
currentFormData,
|
|
isFormDataDifferent,
|
|
resetForm,
|
|
assignFormData,
|
|
submitForm,
|
|
addCurrentCustomerBranch,
|
|
};
|
|
});
|
|
|
|
export const useEmployeeForm = defineStore('form-employee', () => {
|
|
const customerStore = useCustomerStore();
|
|
const employeeStore = useEmployeeStore();
|
|
const flowStore = useFlowStore();
|
|
const branchStore = useMyBranch();
|
|
|
|
const state = ref<{
|
|
dialogType: 'info' | 'create' | 'edit';
|
|
currentTab: string;
|
|
dialogModal: boolean;
|
|
drawerModal: boolean;
|
|
currentEmployeeCode: string;
|
|
currentEmployee: Employee | null;
|
|
profileUrl: string;
|
|
isEmployeeEdit: boolean;
|
|
profileSubmit: boolean;
|
|
formDataEmployeeSameAddr: boolean;
|
|
infoEmployeePersonCard: {
|
|
id: string;
|
|
img: string;
|
|
name: string;
|
|
male: boolean;
|
|
female: boolean;
|
|
badge: string;
|
|
disabled: boolean;
|
|
}[];
|
|
formDataEmployeeOwner:
|
|
| {
|
|
id: string;
|
|
address: string;
|
|
addressEN: string;
|
|
provinceId: string;
|
|
districtId: string;
|
|
subDistrictId: string;
|
|
zipCode: string;
|
|
}
|
|
| undefined;
|
|
}>({
|
|
drawerModal: false,
|
|
currentTab: 'personalInfo',
|
|
dialogModal: false,
|
|
dialogType: 'info',
|
|
currentEmployeeCode: '',
|
|
currentEmployee: null,
|
|
profileUrl: '',
|
|
isEmployeeEdit: false,
|
|
profileSubmit: false,
|
|
formDataEmployeeSameAddr: false,
|
|
infoEmployeePersonCard: [],
|
|
formDataEmployeeOwner: undefined,
|
|
});
|
|
|
|
const defaultFormData: EmployeeCreate = {
|
|
code: '',
|
|
image: null,
|
|
customerBranchId: '',
|
|
nrcNo: '',
|
|
dateOfBirth: null,
|
|
gender: '',
|
|
nationality: '',
|
|
|
|
firstName: '',
|
|
firstNameEN: '',
|
|
lastName: '',
|
|
lastNameEN: '',
|
|
|
|
addressEN: '',
|
|
address: '',
|
|
zipCode: '',
|
|
|
|
passportType: '',
|
|
passportNumber: '',
|
|
passportIssueDate: null,
|
|
passportExpiryDate: null,
|
|
passportIssuingCountry: '',
|
|
passportIssuingPlace: '',
|
|
previousPassportReference: '',
|
|
|
|
visaType: '',
|
|
visaNumber: '',
|
|
visaIssueDate: null,
|
|
visaExpiryDate: null,
|
|
visaIssuingPlace: '',
|
|
visaStayUntilDate: null,
|
|
tm6Number: '',
|
|
entryDate: null,
|
|
workerStatus: '',
|
|
|
|
subDistrictId: '',
|
|
districtId: '',
|
|
provinceId: '',
|
|
|
|
employeeWork: [
|
|
{
|
|
workEndDate: null,
|
|
workPermitExpireDate: null,
|
|
workPermitIssuDate: null,
|
|
workPermitNo: '',
|
|
workplace: '',
|
|
jobType: '',
|
|
positionName: '',
|
|
ownerName: '',
|
|
remark: '',
|
|
},
|
|
],
|
|
employeeCheckup: [
|
|
{
|
|
coverageExpireDate: null,
|
|
coverageStartDate: null,
|
|
insuranceCompany: '',
|
|
medicalBenefitScheme: '',
|
|
remark: '',
|
|
hospitalName: '',
|
|
provinceId: '',
|
|
checkupResult: '',
|
|
checkupType: '',
|
|
},
|
|
],
|
|
employeeOtherInfo: {
|
|
citizenId: '',
|
|
fatherFirstName: '',
|
|
fatherLastName: '',
|
|
fatherFirstNameEN: '',
|
|
fatherLastNameEN: '',
|
|
fatherBirthPlace: '',
|
|
|
|
motherFirstName: '',
|
|
motherLastName: '',
|
|
motherFirstNameEN: '',
|
|
motherLastNameEN: '',
|
|
motherBirthPlace: '',
|
|
},
|
|
};
|
|
|
|
const resetEmployeeData = structuredClone(defaultFormData);
|
|
const currentFromDataEmployee = ref<EmployeeCreate>(
|
|
structuredClone(defaultFormData),
|
|
);
|
|
|
|
function resetFormDataEmployee(cb?: (...args: any[]) => unknown) {
|
|
currentFromDataEmployee.value = structuredClone(resetEmployeeData);
|
|
cb?.();
|
|
}
|
|
|
|
async function assignFormDataEmployee(id: string) {
|
|
const res = await employeeStore.fetchById(id);
|
|
|
|
if (res) {
|
|
state.value.currentEmployee = res;
|
|
|
|
const {
|
|
province,
|
|
district,
|
|
subDistrict,
|
|
createdBy,
|
|
updatedBy,
|
|
profileImageUrl,
|
|
...playlond
|
|
} = res;
|
|
|
|
currentFromDataEmployee.value = {
|
|
...playlond,
|
|
provinceId: province?.id,
|
|
districtId: district?.id,
|
|
subDistrictId: subDistrict?.id,
|
|
employeeCheckup: structuredClone(playlond.employeeCheckup),
|
|
employeeOtherInfo: structuredClone(playlond.employeeOtherInfo),
|
|
employeeWork: structuredClone(playlond.employeeWork),
|
|
image: null,
|
|
};
|
|
|
|
const foundBranch = await customerStore.fetchListCustomeBranchById(
|
|
playlond.customerBranchId,
|
|
);
|
|
|
|
state.value.currentEmployeeCode = playlond.code;
|
|
|
|
state.value.profileUrl = profileImageUrl || '';
|
|
|
|
profileImageUrl
|
|
? (state.value.profileSubmit = true)
|
|
: (state.value.profileSubmit = false);
|
|
|
|
state.value.isEmployeeEdit = true;
|
|
|
|
state.value.formDataEmployeeOwner = { ...foundBranch };
|
|
|
|
if (foundBranch.address === playlond.address) {
|
|
state.value.formDataEmployeeSameAddr = true;
|
|
} else {
|
|
state.value.formDataEmployeeSameAddr = false;
|
|
}
|
|
|
|
if (state.value.infoEmployeePersonCard) {
|
|
state.value.infoEmployeePersonCard[0].img = profileImageUrl || '';
|
|
}
|
|
|
|
flowStore.rotate();
|
|
}
|
|
}
|
|
|
|
async function employeeFilterOwnerBranch(
|
|
val: string,
|
|
update: (...args: unknown[]) => void,
|
|
) {
|
|
update(async () => {
|
|
const result = await customerStore.fetchListCustomeBranch({
|
|
includeCustomer: true,
|
|
query: val,
|
|
pageSize: 30,
|
|
});
|
|
if (result) employeeStore.ownerOption = result.result;
|
|
});
|
|
}
|
|
|
|
return {
|
|
state,
|
|
currentFromDataEmployee,
|
|
resetEmployeeData,
|
|
|
|
resetFormDataEmployee,
|
|
assignFormDataEmployee,
|
|
|
|
employeeFilterOwnerBranch,
|
|
};
|
|
});
|