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

refactor: handle can edit employee

Browse source
This commit is contained in:
Thanaphon Frappet 2024-11-22 13:33:02 +07:00
parent fcb122a47e
commit f54ca1bd68
3 changed files with 78 additions and 50 deletions
Download patch file Download diff file Expand all files Collapse all files

17
src/pages/03_customer-management/BranchPage.vue
View file

@ -3,6 +3,7 @@ import { ref, onMounted, watch } from 'vue';
import { storeToRefs } from 'pinia';
import { useI18n } from 'vue-i18n';
import { QTableProps } from 'quasar';
import { useRoute } from 'vue-router';
import { baseUrl } from 'src/stores/utils';
import useCustomerStore from 'stores/customer';
@ -42,6 +43,7 @@ import { formatAddress } from 'src/utils/address';
import PaginationPageSize from 'src/components/PaginationPageSize.vue';
import { nextTick } from 'vue';
const route = useRoute();
const flowStore = useFlowStore();
const customerStore = useCustomerStore();
const employeeFormStore = useEmployeeForm();
@ -74,6 +76,7 @@ const maxPageBranch = ref<number>(1);
const pageSizeBranch = ref<number>(30);
const statusEmployeeCreate = defineModel<boolean>('statusEmployeeCreate');
const statusEmployeeEdit = defineModel<boolean>('statusEmployeeEdit');
const prop = withDefaults(
defineProps<{
@ -103,11 +106,8 @@ defineEmits<{
}>();
onMounted(async () => {
const url = window.location.href;
const parts = url.split('/');
customerBranchFormState.value.currentCustomerId = parts[4];
customerBranchFormState.value.currentCustomerId = route.params
.customerId as string;
await fetchList();
branch.value?.forEach((v) => {
@ -244,9 +244,9 @@ watch([customerId, inputSearch, currentStatus, pageSizeBranch], async () => {
await fetchList();
});
watch(
() => statusEmployeeCreate.value,
() => [statusEmployeeCreate.value, statusEmployeeEdit.value],
async () => {
if (statusEmployeeCreate.value) {
if (!statusEmployeeCreate.value || !statusEmployeeEdit.value) {
await fetchEmployee({
branchId: currentBranchEmployee.value,
pageSize: 999,
@ -255,7 +255,7 @@ watch(
const br = branch.value?.find(
(v) => v.id === currentBranchEmployee.value,
);
if (br) br._count.employee += 1;
if (br) br._count.employee = listEmployee.value.length;
}
},
);
@ -407,6 +407,7 @@ watch(
<NoData v-if="totalBranch === 0" :not-found="!!inputSearch" />
<div style="width: 100%" v-else>
{{ console.log(branch) }}
<q-table
v-if="branch"
flat

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

@ -220,8 +220,10 @@ watch(
}
if (tabName === 'employee') {
currentPageEmployee.value = 1;
await fetchListEmployee(true);
await fetchListEmployee({ fetchStats: true });
}
customerFormState.value.currentCustomerId = undefined;
flowStore.rotate();
},
);
@ -392,10 +394,16 @@ async function fetchListCustomer(fetchStats = false) {
}
}
async function fetchListEmployee(fetchStats = false) {
async function fetchListEmployee(opt?: {
fetchStats?: boolean;
page?: number;
pageSize?: number;
customerId?: string;
}) {
const resultListEmployee = await employeeStore.fetchList({
page: currentPageEmployee.value,
pageSize: pageSize.value,
customerId: opt?.customerId,
page: opt && opt.page ? opt.page : currentPageEmployee.value,
pageSize: opt && opt.pageSize ? opt.pageSize : pageSize.value,
status:
currentStatus.value === 'All'
? undefined
@ -413,7 +421,8 @@ async function fetchListEmployee(fetchStats = false) {
listEmployee.value = resultListEmployee.result;
}
if (fetchStats) employeeStats.value = await employeeStore.getStatsEmployee();
if (opt && opt.fetchStats)
employeeStats.value = await employeeStore.getStatsEmployee();
}
async function triggerChangeStatus(id: string, status: string) {
@ -505,10 +514,21 @@ async function deleteEmployeeById(opts: {
}
}
await fetchListEmployee(true);
if (route.name !== 'CustomerBranchManagement') {
await fetchListEmployee(
currentTab.value === 'employer'
? {
page: 1,
pageSize: 999,
customerId: customerFormState.value.currentCustomerId,
}
: { fetchStats: true },
);
flowStore.rotate();
flowStore.rotate();
}
},
cancel: () => {},
});
}
@ -1344,25 +1364,24 @@ const emptyCreateDialog = ref(false);
flat
@click.stop="
async () => {
const res = await employeeStore.fetchList({
customerId: props.row.id,
pageSize: 999,
passport: true,
visa: true,
});
if (!currentBtnOpen[props.rowIndex]) {
customerFormState.currentCustomerId =
props.row.id;
if (res) {
listEmployee = res.result;
await fetchListEmployee({
customerId: props.row.id,
page: 1,
pageSize: 9999,
});
currentBtnOpen.map((v, i) => {
if (i !== props.rowIndex) {
currentBtnOpen[i] = false;
}
});
currentBtnOpen[props.rowIndex] =
!currentBtnOpen[props.rowIndex];
}
currentBtnOpen[props.rowIndex] =
!currentBtnOpen[props.rowIndex];
}
"
>
@ -1814,6 +1833,7 @@ const emptyCreateDialog = ref(false);
>
<BranchPage
v-model:status-employee-create="statusEmployeeCreate"
v-model:status-employee-edit="employeeFormState.drawerModal"
v-if="currentCustomer"
:customer-type="currentCustomer.customerType"
:current-customer-name="
@ -2298,7 +2318,19 @@ const emptyCreateDialog = ref(false);
statusEmployeeCreate = true;
employeeFormState.isEmployeeEdit = false;
await fetchListEmployee(true);
if (route.name !== 'CustomerBranchManagement') {
await fetchListEmployee(
currentTab === 'employer'
? {
page: 1,
pageSize: 999,
customerId: customerFormState.currentCustomerId,
}
: { fetchStats: true },
);
flowStore.rotate();
}
}
"
:show="
@ -4184,7 +4216,18 @@ const emptyCreateDialog = ref(false);
if (employeeFormState.currentTab === 'other') {
await employeeFormStore.submitOther();
}
await fetchListEmployee();
if (route.name !== 'CustomerBranchManagement') {
await fetchListEmployee(
currentTab === 'employer'
? {
page: 1,
pageSize: 999,
customerId: customerFormState.currentCustomerId,
}
: undefined,
);
}
employeeFormState.isEmployeeEdit = false;
}
@ -4227,7 +4270,7 @@ const emptyCreateDialog = ref(false);
}
"
:active="currentFromDataEmployee.status !== 'INACTIVE'"
:use-toggle="currentTab === 'employee'"
use-toggle
color="white"
icon="mdi-account-outline"
:bg-color="
@ -4428,7 +4471,6 @@ const emptyCreateDialog = ref(false);
>
<template v-slot:btn-drawer-passport>
<q-btn
v-if="currentTab === 'employee'"
id="form-add-passport"
dense
flat
@ -4443,7 +4485,6 @@ const emptyCreateDialog = ref(false);
<template v-slot:btn-drawer-visa>
<q-btn
v-if="currentTab === 'employee'"
id="form-add-visa"
dense
flat
@ -4457,7 +4498,6 @@ const emptyCreateDialog = ref(false);
<template v-slot:btn-drawer-employee-checkup>
<q-btn
v-if="currentTab === 'employee'"
id="form-add-checkup"
dense
flat
@ -4471,7 +4511,6 @@ const emptyCreateDialog = ref(false);
<template v-slot:btn-drawer-employee-work-history>
<q-btn
v-if="currentTab === 'employee'"
id="form-add-work-history"
dense
flat
@ -4498,10 +4537,7 @@ const emptyCreateDialog = ref(false);
<div
class="rounded row q-py-sm q-mx-lg q-px-md"
style="position: absolute; z-index: 999; right: 0; top: 0"
v-if="
currentTab === 'employee' &&
currentFromDataEmployee.status !== 'INACTIVE'
"
v-if="currentFromDataEmployee.status !== 'INACTIVE'"
>
<div class="surface-1 row rounded">
<UndoButton
@ -5304,10 +5340,7 @@ const emptyCreateDialog = ref(false);
prefix-id="drawer-employee"
dense
outlined
:hide-action="
currentTab !== 'employee' ||
currentFromDataEmployee.status === 'INACTIVE'
"
:hide-action="currentFromDataEmployee.status === 'INACTIVE'"
v-model:current-index="employeeFormState.currentIndexCheckup"
v-model:employee-checkup="
currentFromDataEmployee.employeeCheckup
@ -5393,10 +5426,7 @@ const emptyCreateDialog = ref(false);
id="drawer-work-history"
prefix-id="drawer-employee"
dense
:hide-action="
currentTab !== 'employee' ||
currentFromDataEmployee.status === 'INACTIVE'
"
:hide-action="currentFromDataEmployee.status === 'INACTIVE'"
outlined
v-model:current-index="
employeeFormState.currentIndexWorkHistory
@ -5454,11 +5484,7 @@ const emptyCreateDialog = ref(false);
</template>
<template v-if="employeeFormState.currentTab === 'other'">
<FormEmployeeOther
:readonly="currentTab !== 'employee'"
:hide-action="
currentTab !== 'employee' ||
currentFromDataEmployee.status === 'INACTIVE'
"
:hide-action="currentFromDataEmployee.status === 'INACTIVE'"
v-if="employeeFormState.currentTab === 'other'"
id="drawer-other"
prefix-id="drawer-employee"

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

@ -53,6 +53,7 @@ export const useCustomerForm = defineStore('form-customer', () => {
treeFile: { label: string; file: { label: string }[] }[];
formDataOcr: Record<string, any>;
isImageEdit: boolean;
currentCustomerId?: string;
}>({
dialogType: 'info',
dialogOpen: false,