refactor: implement role-based access control for customer edit actions in BranchPage and MainPage components
Some checks failed
Spell Check / Spell Check with Typos (push) Failing after 7s

This commit is contained in:
puriphatt 2025-07-03 13:32:21 +07:00
parent aaa448fa0c
commit c991e9e03f
2 changed files with 19 additions and 8 deletions

View file

@ -9,7 +9,7 @@ import { baseUrl } from 'src/stores/utils';
import useCustomerStore from 'stores/customer';
import useFlowStore from 'stores/flow';
import useOptionStore from 'stores/options';
import { dialog } from 'stores/utils';
import { dialog, canAccess } from 'stores/utils';
import { Status } from 'stores/types';
import { Employee } from 'stores/employee/types';
@ -285,7 +285,7 @@ watch(
<template>
<FloatingActionButton
style="z-index: 999"
v-if="$route.name !== 'CustomerManagement'"
v-if="$route.name !== 'CustomerManagement' && canAccess('customer', 'edit')"
@click="openEmployerBranchForm('create')"
hide-icon
></FloatingActionButton>
@ -615,7 +615,7 @@ watch(
<div class="text-center">
<TableEmpoloyee
:prefix-id="props.row.registerName || props.row.firstName"
add-button
:add-button="canAccess('customer', 'edit')"
in-table
:list-employee="listEmployee"
:columns-employee="columnsEmployee"
@ -751,7 +751,7 @@ watch(
})
"
>
<template #before>
<template #before v-if="canAccess('customer', 'edit')">
<EditButton
icon-only
v-if="customerBranchFormState.dialogType === 'info'"

View file

@ -6,7 +6,7 @@ import { useRoute, useRouter } from 'vue-router';
import { getUserId, getRole } from 'src/services/keycloak';
import { baseUrl, setPrefixName, waitAll } from 'src/stores/utils';
import { dateFormat } from 'src/utils/datetime';
import { dialogCheckData } from 'stores/utils';
import { dialogCheckData, canAccess } from 'stores/utils';
import useOcrStore from 'stores/ocr';
import useCustomerStore from 'stores/customer';
@ -658,7 +658,7 @@ const emptyCreateDialog = ref(false);
<FloatingActionButton
style="z-index: 999"
:hide-icon="currentTab === 'employee'"
v-if="$route.name === 'CustomerManagement'"
v-if="$route.name === 'CustomerManagement' && canAccess('customer', 'edit')"
@click="
() => {
if (currentTab === 'employee') {
@ -1391,6 +1391,7 @@ const emptyCreateDialog = ref(false);
/>
<KebabAction
v-if="canAccess('customer', 'edit')"
:id-name="
props.row.branch[0].customerName ||
props.row.branch[0].firstName
@ -1639,6 +1640,7 @@ const emptyCreateDialog = ref(false);
</template>
<template v-slot:action>
<KebabAction
v-if="canAccess('customer', 'edit')"
:status="props.row.status"
:id-name="props.row.name"
@view="
@ -1889,6 +1891,7 @@ const emptyCreateDialog = ref(false);
"
>
<TooltipComponent
v-if="canAccess('customer', 'edit')"
class="self-end q-ma-md"
:title="'general.noData'"
:caption="'general.clickToCreate'"
@ -1900,6 +1903,7 @@ const emptyCreateDialog = ref(false);
style="flex-grow: 1"
>
<EmptyAddButton
v-if="canAccess('customer', 'edit')"
:label="'general.add'"
:i18n-args="{
text: $t(`customer.${currentTab}`),
@ -1914,6 +1918,7 @@ const emptyCreateDialog = ref(false);
}
"
/>
<NoData v-else />
</div>
</template>
</div>
@ -3865,6 +3870,7 @@ 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;
@ -4115,6 +4121,7 @@ const emptyCreateDialog = ref(false);
>
<ProfileBanner
v-if="customerFormData.customerBranch !== undefined"
:readonly="!canAccess('customer', 'edit')"
:prefix="customerFormData.registeredBranchId"
:active="customerFormData.status !== 'INACTIVE'"
hide-fade
@ -4228,7 +4235,8 @@ const emptyCreateDialog = ref(false);
v-if="
customerFormState.branchIndex === -1 &&
!!customerFormState.editCustomerId &&
customerFormState.dialogType !== 'create'
customerFormState.dialogType !== 'create' &&
canAccess('customer', 'edit')
"
:disabled="!customerFormState.readonly"
/>
@ -4412,7 +4420,10 @@ const emptyCreateDialog = ref(false);
prefix-id="info"
v-if="!!customerFormState.editCustomerId"
:index="idx"
:hide-action="customerFormData.status === 'INACTIVE'"
:hide-action="
customerFormData.status === 'INACTIVE' ||
!canAccess('customer', 'edit')
"
v-model:customer="customerFormData"
v-model:customer-branch="
customerFormData.customerBranch[idx]