From 79ec99554715a0e819ce2421c3479c980af64ebf Mon Sep 17 00:00:00 2001 From: Thanaphon Frappet Date: Mon, 27 Jan 2025 10:06:39 +0700 Subject: [PATCH] refactor: handle img employee --- .../03_customer-management/TableEmpoloyee.vue | 4 ++-- src/pages/03_customer-management/MainPage.vue | 6 +++--- src/pages/05_quotation/QuotationForm.vue | 1 - .../05_quotation/QuotationFormWorkerAddDialog.vue | 4 ++-- src/pages/05_quotation/QuotationFormWorkerSelect.vue | 11 +++++++---- .../12_debit-note/expansion/WorkerItemExpansion.vue | 1 - 6 files changed, 14 insertions(+), 13 deletions(-) diff --git a/src/components/03_customer-management/TableEmpoloyee.vue b/src/components/03_customer-management/TableEmpoloyee.vue index 36bb2d6c..58404160 100644 --- a/src/components/03_customer-management/TableEmpoloyee.vue +++ b/src/components/03_customer-management/TableEmpoloyee.vue @@ -288,8 +288,8 @@ defineEmits<{ : `${props.row.firstName} ${props.row.lastName} `.trim(), img: `${baseUrl}/employee/${props.row.id}/image/${props.row.selectedImage}` || - '/images/employee-avatar.png', - fallbackImg: '/images/employee-avatar.png', + `/images/employee-avatar-${props.row.gender}.png`, + fallbackImg: `/images/employee-avatar-${props.row.gender}.png`, male: props.row.gender === 'male', female: props.row.gender === 'female', detail: [ diff --git a/src/pages/03_customer-management/MainPage.vue b/src/pages/03_customer-management/MainPage.vue index dbd22972..ce66e008 100644 --- a/src/pages/03_customer-management/MainPage.vue +++ b/src/pages/03_customer-management/MainPage.vue @@ -2414,7 +2414,7 @@ const emptyCreateDialog = ref(false); refreshImageState ? `?ts=${Date.now()}` : '', ) || null " - :fallbackImg="'/images/employee-avatar.png'" + :fallbackImg="`/images/employee-avatar-${currentFromDataEmployee.gender === 'male' ? 'male' : 'female'}.png`" :tabs-list=" [ { @@ -3795,7 +3795,7 @@ const emptyCreateDialog = ref(false); style="background: #ee4367" > @@ -4318,7 +4318,7 @@ const emptyCreateDialog = ref(false); refreshImageState ? `?ts=${Date.now()}` : '', ) || null " - :fallbackImg="'/images/employee-avatar.png'" + :fallbackImg="`/images/employee-avatar-${currentFromDataEmployee.gender === 'male' ? 'male' : 'female'}.png`" :tabs-list="[ { name: 'personalInfo', diff --git a/src/pages/05_quotation/QuotationForm.vue b/src/pages/05_quotation/QuotationForm.vue index 6af0ee0b..ec29f238 100644 --- a/src/pages/05_quotation/QuotationForm.vue +++ b/src/pages/05_quotation/QuotationForm.vue @@ -1544,7 +1544,6 @@ async function formDownload() { quotationFormData.workerMax || selectedWorker.length " :readonly="readonly" - fallback-img="/images/employee-avatar.png" :rows="selectedWorkerItem" @delete="(i) => deleteItem(selectedWorker, i)" /> diff --git a/src/pages/05_quotation/QuotationFormWorkerAddDialog.vue b/src/pages/05_quotation/QuotationFormWorkerAddDialog.vue index 256439ef..52c32a4b 100644 --- a/src/pages/05_quotation/QuotationFormWorkerAddDialog.vue +++ b/src/pages/05_quotation/QuotationFormWorkerAddDialog.vue @@ -220,7 +220,7 @@ function getEmployeeImageUrl(item: Employee) { return `${API_BASE_URL}/employee/${item.id}/image/${item.selectedImage}`; } // NOTE: static image - return '/images/employee-avatar.png'; + return `/images/employee-avatar-${item.gender}.png`; } async function getWorkerList() { @@ -374,7 +374,7 @@ watch(() => state.search, getWorkerList); female: emp.gender === 'female', male: emp.gender === 'male', img: getEmployeeImageUrl(emp), - fallbackImg: '/images/employee-avatar.png', + fallbackImg: `/images/employee-avatar-${emp.gender}.png`, detail: [ { icon: 'mdi-passport', diff --git a/src/pages/05_quotation/QuotationFormWorkerSelect.vue b/src/pages/05_quotation/QuotationFormWorkerSelect.vue index 59904c0f..564acc7f 100644 --- a/src/pages/05_quotation/QuotationFormWorkerSelect.vue +++ b/src/pages/05_quotation/QuotationFormWorkerSelect.vue @@ -207,7 +207,7 @@ function getEmployeeImageUrl(item: Employee) { return `${API_BASE_URL}/employee/${item.id}/image/${item.selectedImage}`; } // NOTE: static image - return '/images/employee-avatar.png'; + return `/images/employee-avatar-${item.gender}.png`; } function init() { @@ -400,7 +400,7 @@ watch(() => state.search, getWorkerList); : `${emp.firstName} ${emp.lastName}`, female: emp.gender === 'female', male: emp.gender === 'male', - img: '/images/employee-avatar.png', + img: `/images/employee-avatar-${emp.gender}.png`, index: index, detail: [ { @@ -486,7 +486,7 @@ watch(() => state.search, getWorkerList); female: emp.gender === 'female', male: emp.gender === 'male', img: getEmployeeImageUrl(emp), - fallbackImg: '/images/employee-avatar.png', + fallbackImg: `/images/employee-avatar-${emp.gender}.png`, detail: [ { icon: 'mdi-passport', @@ -567,7 +567,10 @@ watch(() => state.search, getWorkerList); v-model:current-tab="employeeFormState.currentTab" v-model:toggle-status="currentFromDataEmployee.status" fallbackCover="/images/employee-banner.png" - :img="employeeFormState.profileUrl || `/images/employee-avatar.png`" + :img=" + employeeFormState.profileUrl || + `/images/employee-avatar-${currentFromDataEmployee.gender}.png` + " :toggleTitle="$t('status.title')" hideFade @view=" diff --git a/src/pages/12_debit-note/expansion/WorkerItemExpansion.vue b/src/pages/12_debit-note/expansion/WorkerItemExpansion.vue index aa4ee499..71c27205 100644 --- a/src/pages/12_debit-note/expansion/WorkerItemExpansion.vue +++ b/src/pages/12_debit-note/expansion/WorkerItemExpansion.vue @@ -67,7 +67,6 @@ const toggleWorker = defineModel('toggleWorker'); @update:employee-amount="(v) => $emit('update:employeeAmount', v)" :employee-amount :readonly="readonly" - fallback-img="/images/employee-avatar.png" :rows="rowWorker" @delete="(i) => $emit('delete', i)" />