feat: add employee under employer (#35)
* refactor: btn add in table * refactor: Emits addEmployee * fix: visa can is null * refactor: update data * fix: number not update --------- Co-authored-by: Thanaphon Frappet <thanaphon@frappet.com>
This commit is contained in:
parent
a9c9467643
commit
05c1c07384
5 changed files with 61 additions and 20 deletions
|
|
@ -7,6 +7,8 @@ import PersonCard from 'components/shared/PersonCard.vue';
|
|||
import KebabAction from '../shared/KebabAction.vue';
|
||||
import useOptionStore from 'stores/options';
|
||||
|
||||
import { AddButton } from 'components/button';
|
||||
|
||||
const optionStore = useOptionStore();
|
||||
const pageSize = defineModel<number>('pageSize', { default: 30 });
|
||||
const currentPage = defineModel<number>('currentPage', { default: 1 });
|
||||
|
|
@ -18,6 +20,7 @@ const prop = withDefaults(
|
|||
columnsEmployee: any[];
|
||||
fieldSelected?: string[];
|
||||
inTable?: boolean;
|
||||
addButton?: boolean;
|
||||
}>(),
|
||||
{
|
||||
gridView: false,
|
||||
|
|
@ -37,6 +40,7 @@ const prop = withDefaults(
|
|||
);
|
||||
|
||||
defineEmits<{
|
||||
(e: 'add'): void;
|
||||
(e: 'view', data: any): void;
|
||||
(e: 'edit', data: any): void;
|
||||
(e: 'delete', data: any): void;
|
||||
|
|
@ -68,7 +72,9 @@ defineEmits<{
|
|||
<span v-if="col.label === 'nameEmployee'">
|
||||
{{ $t('fullname') }}
|
||||
</span>
|
||||
|
||||
<span v-if="col.label === '' && !!addButton">
|
||||
<AddButton icon-only @click.stop="() => $emit('add')" />
|
||||
</span>
|
||||
<span v-if="col.label !== ''">
|
||||
{{ $t(col.label) }}
|
||||
</span>
|
||||
|
|
|
|||
|
|
@ -70,6 +70,8 @@ const currentPageBranch = ref<number>(1);
|
|||
const maxPageBranch = ref<number>(1);
|
||||
const pageSizeBranch = ref<number>(30);
|
||||
|
||||
const statusEmployeeCreate = defineModel<boolean>('statusEmployeeCreate');
|
||||
|
||||
const prop = withDefaults(
|
||||
defineProps<{
|
||||
index?: string | number;
|
||||
|
|
@ -84,12 +86,13 @@ const prop = withDefaults(
|
|||
color: 'green',
|
||||
},
|
||||
);
|
||||
|
||||
const currentBranchEmployee = ref<string>('');
|
||||
const listEmployee = ref<Employee[]>([]);
|
||||
|
||||
const customerId = defineModel<string>('customerId', { required: true });
|
||||
|
||||
defineEmits<{
|
||||
(e: 'addEmployee', currentBranch: CustomerBranch): void;
|
||||
(e: 'back'): void;
|
||||
(e: 'viewDetail', branch: CustomerBranch, index: number): void;
|
||||
(e: 'dialog'): void;
|
||||
|
|
@ -210,6 +213,14 @@ function openEmployerBranchForm(formType: 'create' | 'edit' | 'info') {
|
|||
customerBranchFormState.value.dialogModal = true;
|
||||
}
|
||||
|
||||
async function fetchEmployee(branchId: string) {
|
||||
const res = await fetchBranchEmployee(branchId);
|
||||
|
||||
if (res) {
|
||||
listEmployee.value = res.data.result;
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(async () => {
|
||||
await fetchList();
|
||||
});
|
||||
|
|
@ -217,6 +228,19 @@ onMounted(async () => {
|
|||
watch([customerId, inputSearch, currentStatus], async () => {
|
||||
await fetchList();
|
||||
});
|
||||
watch(
|
||||
() => statusEmployeeCreate.value,
|
||||
async () => {
|
||||
if (statusEmployeeCreate.value) {
|
||||
await fetchEmployee(currentBranchEmployee.value);
|
||||
|
||||
const br = branch.value?.find(
|
||||
(v) => v.id === currentBranchEmployee.value,
|
||||
);
|
||||
if (br) br._count.employee += 1;
|
||||
}
|
||||
},
|
||||
);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
|
@ -487,20 +511,17 @@ watch([customerId, inputSearch, currentStatus], async () => {
|
|||
flat
|
||||
@click.stop="
|
||||
async () => {
|
||||
const res = await fetchBranchEmployee(props.row.id);
|
||||
currentBranchEmployee = props.row.id;
|
||||
await fetchEmployee(currentBranchEmployee);
|
||||
|
||||
if (res) {
|
||||
listEmployee = res.data.result;
|
||||
currentBtnOpen.map((v, i) => {
|
||||
if (i !== props.rowIndex) {
|
||||
currentBtnOpen[i] = false;
|
||||
}
|
||||
});
|
||||
|
||||
currentBtnOpen.map((v, i) => {
|
||||
if (i !== props.rowIndex) {
|
||||
currentBtnOpen[i] = false;
|
||||
}
|
||||
});
|
||||
|
||||
currentBtnOpen[props.rowIndex] =
|
||||
!currentBtnOpen[props.rowIndex];
|
||||
}
|
||||
currentBtnOpen[props.rowIndex] =
|
||||
!currentBtnOpen[props.rowIndex];
|
||||
}
|
||||
"
|
||||
>
|
||||
|
|
@ -537,6 +558,7 @@ watch([customerId, inputSearch, currentStatus], async () => {
|
|||
<q-td colspan="100%" style="padding: 16px">
|
||||
<div class="text-center">
|
||||
<TableEmpoloyee
|
||||
add-button
|
||||
in-table
|
||||
:list-employee="listEmployee"
|
||||
:columns-employee="columnsEmployee"
|
||||
|
|
@ -550,6 +572,12 @@ watch([customerId, inputSearch, currentStatus], async () => {
|
|||
'formDialogEmployeeNRCNo',
|
||||
'action',
|
||||
]"
|
||||
@add="
|
||||
() => {
|
||||
statusEmployeeCreate = false;
|
||||
$emit('addEmployee', props.row);
|
||||
}
|
||||
"
|
||||
@history="(item) => {}"
|
||||
@view="
|
||||
(item) => {
|
||||
|
|
@ -627,7 +655,6 @@ watch([customerId, inputSearch, currentStatus], async () => {
|
|||
"
|
||||
@submit="
|
||||
async () => {
|
||||
console.log('asasd');
|
||||
const res = await customerBranchFormStore.submitForm();
|
||||
|
||||
if (res) {
|
||||
|
|
|
|||
|
|
@ -76,6 +76,7 @@ import FormEmployeeOther from 'components/03_customer-management/FormEmployeeOth
|
|||
import useOptionStore from 'stores/options';
|
||||
import { DialogContainer, DialogHeader } from 'components/dialog';
|
||||
import KebabAction from 'src/components/shared/KebabAction.vue';
|
||||
import { nextTick } from 'vue';
|
||||
|
||||
const { t, locale } = useI18n();
|
||||
const $q = useQuasar();
|
||||
|
|
@ -91,6 +92,7 @@ const employeeFormStore = useEmployeeForm();
|
|||
const optionStore = useOptionStore();
|
||||
const ocrStore = useOcrStore();
|
||||
|
||||
const statusEmployeeCreate = ref<boolean>(false);
|
||||
const mrz = ref<Awaited<ReturnType<typeof parseResultMRZ>>>();
|
||||
const tabFieldRequired = ref<{ [key: string]: (keyof CustomerBranchCreate)[] }>(
|
||||
{
|
||||
|
|
@ -1833,6 +1835,7 @@ const emptyCreateDialog = ref(false);
|
|||
v-if="$route.name === 'CustomerBranchManagement'"
|
||||
>
|
||||
<BranchPage
|
||||
v-model:status-employee-create="statusEmployeeCreate"
|
||||
v-if="currentCustomer"
|
||||
:customer-type="currentCustomer.customerType"
|
||||
:current-customer-name="
|
||||
|
|
@ -1850,6 +1853,13 @@ const emptyCreateDialog = ref(false);
|
|||
v-model:customer-id="currentCustomer.id"
|
||||
v-model:mode-view="gridView"
|
||||
@back="$router.push('/customer-management')"
|
||||
@add-employee="
|
||||
async (currentBranch) => {
|
||||
createEmployeeForm();
|
||||
await nextTick();
|
||||
employeeFormState.formDataEmployeeOwner = { ...currentBranch };
|
||||
}
|
||||
"
|
||||
v-model:branch="branch"
|
||||
v-model:current-customer-url-image="currentCustomer.imageUrl"
|
||||
/>
|
||||
|
|
@ -2301,7 +2311,7 @@ const emptyCreateDialog = ref(false);
|
|||
if (employeeFormState.currentTab === 'other') {
|
||||
await employeeFormStore.submitOther();
|
||||
}
|
||||
|
||||
statusEmployeeCreate = true;
|
||||
employeeFormState.isEmployeeEdit = false;
|
||||
employeeFormState.currentIndex = -1;
|
||||
|
||||
|
|
@ -2582,7 +2592,7 @@ const emptyCreateDialog = ref(false);
|
|||
separator
|
||||
title="form.field.basicInformation"
|
||||
:readonly="!employeeFormState.isEmployeeEdit"
|
||||
:employee-owner-option="employeeStore.ownerOption"
|
||||
:employee-owner-option="employeeStore.ownerOption || []"
|
||||
v-model:customer-branch="employeeFormState.formDataEmployeeOwner"
|
||||
v-model:employee-id="employeeFormState.currentEmployeeCode"
|
||||
v-model:nrc-no="currentFromDataEmployee.nrcNo"
|
||||
|
|
|
|||
|
|
@ -612,7 +612,6 @@ export const useEmployeeForm = defineStore('form-employee', () => {
|
|||
provinceId: string;
|
||||
districtId: string;
|
||||
subDistrictId: string;
|
||||
zipCode: string;
|
||||
}
|
||||
| undefined;
|
||||
ocr: boolean;
|
||||
|
|
@ -1126,7 +1125,6 @@ export const useEmployeeForm = defineStore('form-employee', () => {
|
|||
|
||||
currentFromDataEmployee.value = structuredClone(resetEmployeeData);
|
||||
|
||||
|
||||
state.value.currentIndexPassport =
|
||||
(currentFromDataEmployee.value.employeePassport?.length || 0) - 1;
|
||||
|
||||
|
|
|
|||
|
|
@ -45,7 +45,7 @@ const useEmployeeStore = defineStore('api-employee', () => {
|
|||
gender?: string;
|
||||
status?: Status;
|
||||
passport?: boolean;
|
||||
visa: boolean;
|
||||
visa?: boolean;
|
||||
zipCode?: string;
|
||||
customerId?: string;
|
||||
}) {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue