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

refactor: add hideDelete prop to various components and update delete button visibility logic
Some checks failed
Spell Check / Spell Check with Typos (push) Failing after 6s
Details

Browse source
This commit is contained in:
puriphatt 2025-07-07 10:40:35 +07:00
parent f646b3c9ba
commit a5791a1b54
7 changed files with 40 additions and 57 deletions
Download patch file Download diff file Expand all files Collapse all files

10
src/components/01_branch-management/BranchCard.vue
View file

@ -89,15 +89,7 @@ defineProps<{
</div>
</div>
</div>
<div
style="
display: block;
width: 100%;
height: 1px;
background: hsla(0 0% 0% / 0.1);
margin-bottom: var(--size-2);
"
/>
<q-separator />
<slot name="data"></slot>
<template v-if="!$slots.data">
<div

3
src/components/03_customer-management/TableEmpoloyee.vue
View file

@ -23,6 +23,7 @@ const prop = withDefaults(
addButton?: boolean;
prefixId?: string;
hideAction?: boolean;
hideDelete?: boolean;
}>(),
{
gridView: false,
@ -269,6 +270,7 @@ defineEmits<{
v-if="!inTable && !hideAction"
:id-name="props.row.firstName"
:status="props.row.status"
:hide-delete="hideDelete"
@view="$emit('view', props.row)"
@edit="$emit('edit', props.row)"
@delete="$emit('delete', props.row)"
@ -282,6 +284,7 @@ defineEmits<{
<div class="col-12 col-md-3 col-sm-6">
<PersonCard
history
:hide-delete="hideDelete"
:hide-action="hideAction"
:id="`card-${props.row.firstNameEN}`"
:field-selected="fieldSelected"

2
src/components/shared/PersonCard.vue
View file

@ -24,6 +24,7 @@ defineProps<{
prefixId?: string;
separateEnter?: boolean;
hideAction?: boolean;
hideDelete?: boolean;
}>();
defineEmits<{
@ -80,6 +81,7 @@ defineEmits<{
v-if="!hideAction"
:id-name="prefixId"
:status="disabled ? 'INACTIVE' : 'ACTIVE'"
:hide-delete="hideDelete"
@view="
separateEnter
? $emit('viewCard', 'INFO')

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

@ -751,7 +751,7 @@ watch(
})
"
>
<template #before v-if="canAccess('customer', 'edit')">
<template #before>
<EditButton
icon-only
v-if="customerBranchFormState.dialogType === 'info'"
@ -759,7 +759,10 @@ watch(
/>
<DeleteButton
icon-only
v-if="customerBranchFormState.dialogType === 'info'"
v-if="
customerBranchFormState.dialogType === 'info' &&
canAccess('customer', 'edit')
"
@click="
() => {
deleteBranchById(customerBranchFormData.id || '');

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

@ -1391,7 +1391,7 @@ const emptyCreateDialog = ref(false);
/>
<KebabAction
v-if="canAccess('customer', 'edit')"
:hide-delete="!canAccess('customer', 'edit')"
:id-name="
props.row.branch[0].customerName ||
props.row.branch[0].firstName
@ -1649,7 +1649,7 @@ const emptyCreateDialog = ref(false);
@click.stop="editCustomerForm(props.row.id)"
/>
<KebabAction
v-if="canAccess('customer', 'edit')"
:hide-delete="!canAccess('customer', 'edit')"
:status="props.row.status"
:id-name="props.row.name"
@view="
@ -1783,7 +1783,7 @@ const emptyCreateDialog = ref(false);
"
>
<TableEmpoloyee
:hide-action="!canAccess('customer', 'edit')"
:hide-delete="!canAccess('customer', 'edit')"
v-model:page-size="pageSize"
v-model:current-page="currentPageEmployee"
:grid-view="gridView"
@ -3880,7 +3880,6 @@ const emptyCreateDialog = ref(false);
:on-create="customerFormState.dialogModal"
:default-url="customerFormState.defaultCustomerImageUrl"
:hidden-footer="!customerFormState.isImageEdit"
:change-disabled="!canAccess('customer', 'edit')"
@add-image="
async (v) => {
if (!v) return;
@ -3990,7 +3989,6 @@ const emptyCreateDialog = ref(false);
v-model:on-create-data-list="onCreateImageList"
:on-create="employeeFormState.dialogModal"
:hidden-footer="!employeeFormState.isImageEdit"
:change-disabled="!canAccess('customer', 'edit')"
@add-image="
async (v) => {
if (!v) return;
@ -4132,7 +4130,6 @@ const emptyCreateDialog = ref(false);
>
<ProfileBanner
v-if="customerFormData.customerBranch !== undefined"
:readonly="!canAccess('customer', 'edit')"
:prefix="customerFormData.registeredBranchId"
:active="customerFormData.status !== 'INACTIVE'"
hide-fade
@ -4246,8 +4243,7 @@ const emptyCreateDialog = ref(false);
v-if="
customerFormState.branchIndex === -1 &&
!!customerFormState.editCustomerId &&
customerFormState.dialogType !== 'create' &&
canAccess('customer', 'edit')
customerFormState.dialogType !== 'create'
"
:disabled="!customerFormState.readonly"
/>
@ -4431,10 +4427,7 @@ const emptyCreateDialog = ref(false);
prefix-id="info"
v-if="!!customerFormState.editCustomerId"
:index="idx"
:hide-action="
customerFormData.status === 'INACTIVE' ||
!canAccess('customer', 'edit')
"
:hide-action="customerFormData.status === 'INACTIVE'"
v-model:customer="customerFormData"
v-model:customer-branch="
customerFormData.customerBranch[idx]
@ -4445,6 +4438,7 @@ const emptyCreateDialog = ref(false);
(customerFormState.branchIndex !== -1 &&
customerFormState.branchIndex !== idx)
"
:hide-delete="!canAccess('customer', 'edit')"
:readonly="customerFormState.branchIndex !== idx"
@edit="() => (customerFormState.branchIndex = idx)"
@cancel="() => customerFormUndo(false)"
@ -4569,7 +4563,6 @@ const emptyCreateDialog = ref(false);
>
<ProfileBanner
:prefix="employeeFormState.currentEmployee.firstName"
:readonly="!canAccess('customer', 'edit')"
hideFade
@update:current-tab="
() => {
@ -4807,10 +4800,7 @@ const emptyCreateDialog = ref(false);
}"
scroll-element="#drawer-employee-form-content"
>
<template
v-if="canAccess('customer', 'edit')"
v-slot:btn-drawer-passport
>
<template v-slot:btn-drawer-passport>
<q-btn
id="form-add-passport"
dense
@ -4824,10 +4814,7 @@ const emptyCreateDialog = ref(false);
/>
</template>
<template
v-if="canAccess('customer', 'edit')"
v-slot:btn-drawer-visa
>
<template v-slot:btn-drawer-visa>
<q-btn
id="form-add-visa"
dense
@ -4840,10 +4827,7 @@ const emptyCreateDialog = ref(false);
/>
</template>
<template
v-if="canAccess('customer', 'edit')"
v-slot:btn-drawer-employee-checkup
>
<template v-slot:btn-drawer-employee-checkup>
<q-btn
id="form-add-checkup"
dense
@ -4856,10 +4840,7 @@ const emptyCreateDialog = ref(false);
/>
</template>
<template
v-if="canAccess('customer', 'edit')"
v-slot:btn-drawer-employee-work-history
>
<template v-slot:btn-drawer-employee-work-history>
<q-btn
id="form-add-work-history"
dense
@ -4887,10 +4868,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="
currentFromDataEmployee.status !== 'INACTIVE' &&
canAccess('customer', 'edit')
"
v-if="currentFromDataEmployee.status !== 'INACTIVE'"
>
<div class="surface-1 row rounded">
<UndoButton
@ -4925,7 +4903,10 @@ const emptyCreateDialog = ref(false);
type="button"
/>
<DeleteButton
v-if="!employeeFormState.isEmployeeEdit"
v-if="
!employeeFormState.isEmployeeEdit &&
canAccess('customer', 'edit')
"
id="btn-info-basic-delete"
icon-only
@click="
@ -5408,7 +5389,7 @@ const emptyCreateDialog = ref(false);
/>
{{ $t('customerEmployee.form.group.passport') }}
<AddButton
v-if="$q.screen.lt.md && canAccess('customer', 'edit')"
v-if="$q.screen.lt.md"
id="btn-add-work"
icon-only
class="q-ml-sm"
@ -5492,7 +5473,6 @@ const emptyCreateDialog = ref(false);
<template v-slot:button>
<div
v-if="canAccess('customer', 'edit')"
class="surface-1 row rounded"
style="min-height: 35px"
>
@ -5626,7 +5606,7 @@ const emptyCreateDialog = ref(false);
/>
{{ $t('customerEmployee.form.group.visa') }}
<AddButton
v-if="$q.screen.lt.md && canAccess('customer', 'edit')"
v-if="$q.screen.lt.md"
id="btn-add-work"
icon-only
class="q-ml-sm"
@ -5691,7 +5671,6 @@ const emptyCreateDialog = ref(false);
<template v-slot:button>
<div
v-if="canAccess('customer', 'edit')"
class="surface-1 row rounded"
style="min-height: 35px"
>
@ -5809,7 +5788,7 @@ const emptyCreateDialog = ref(false);
{{ $t(`customerEmployee.formHealthCheck.title`) }}
<AddButton
v-if="$q.screen.lt.md && canAccess('customer', 'edit')"
v-if="$q.screen.lt.md"
id="btn-add-work"
icon-only
class="q-ml-sm"
@ -5937,7 +5916,7 @@ const emptyCreateDialog = ref(false);
/>
{{ $t(`customerEmployee.form.group.workHistory`) }}
<AddButton
v-if="$q.screen.lt.md && canAccess('customer', 'edit')"
v-if="$q.screen.lt.md"
id="btn-add-work"
icon-only
class="q-ml-sm"
@ -6042,10 +6021,7 @@ const emptyCreateDialog = ref(false);
</template>
<template v-if="employeeFormState.currentTab === 'other'">
<FormEmployeeOther
:hide-action="
currentFromDataEmployee.status === 'INACTIVE' ||
!canAccess('customer', 'edit')
"
:hide-action="currentFromDataEmployee.status === 'INACTIVE'"
v-if="employeeFormState.currentTab === 'other'"
id="drawer-other"
prefix-id="drawer-employee"

8
src/pages/03_customer-management/components/employer/EmployerFormBasicInfo.vue
View file

@ -102,7 +102,13 @@ const telephoneNo = defineModel<string>('telephoneNo', { default: '' });
class="col-md-6"
:readonly
:disabled="
!isRoleInclude(['admin', 'system', 'head_of_admin']) && !readonly
!isRoleInclude([
'admin',
'system',
'head_of_admin',
'executive',
'accountant',
]) && !readonly
"
:label="$t('customer.form.registeredBranch')"
select-first-value

3
src/pages/03_customer-management/components/employer/EmployerFormBranch.vue
View file

@ -51,6 +51,7 @@ withDefaults(
actionDisabled?: boolean;
customerType?: 'CORP' | 'PERS';
hideAction?: boolean;
hideDelete?: boolean;
}>(),
{
hideAction: false,
@ -81,7 +82,7 @@ withDefaults(
/>
<DeleteButton
icon-only
v-if="readonly"
v-if="readonly && !hideDelete"
@click="$emit('delete')"
type="button"
:disabled="actionDisabled"