From c766110bd90016c3de35ff3d1d33067b0247b940 Mon Sep 17 00:00:00 2001
From: jorgep <jorgep@verdnatura.es>
Date: Thu, 1 Aug 2024 14:13:37 +0200
Subject: [PATCH] chore: refs #4074 wip replace useRole for useAcl

---
 src/components/common/VnSelectDialog.vue      |  7 +++
 src/pages/Item/Card/ItemSummary.vue           | 55 ++++++++-----------
 src/pages/Supplier/Card/SupplierSummary.vue   | 13 ++---
 .../Travel/Card/TravelDescriptorMenuItems.vue |  9 +--
 src/pages/Worker/Card/WorkerTimeControl.vue   | 18 +++---
 .../Worker/Card/WorkerTimeReasonForm.vue      |  4 +-
 src/pages/Worker/WorkerList.vue               |  2 +-
 7 files changed, 52 insertions(+), 56 deletions(-)

diff --git a/src/components/common/VnSelectDialog.vue b/src/components/common/VnSelectDialog.vue
index 7f7c29f5d..6f2be4bfe 100644
--- a/src/components/common/VnSelectDialog.vue
+++ b/src/components/common/VnSelectDialog.vue
@@ -1,6 +1,7 @@
 <script setup>
 import { ref, computed } from 'vue';
 import { useRole } from 'src/composables/useRole';
+import { useAcl } from 'src/composables/useAcl';
 
 import VnSelect from 'src/components/common/VnSelect.vue';
 const emit = defineEmits(['update:modelValue']);
@@ -11,6 +12,10 @@ const $props = defineProps({
         type: Array,
         default: () => ['developer'],
     },
+    acls: {
+        type: Array,
+        default: () => [],
+    },
     actionIcon: {
         type: String,
         default: 'add',
@@ -22,9 +27,11 @@ const $props = defineProps({
 });
 
 const role = useRole();
+const acl = useAcl()
 const showForm = ref(false);
 
 const isAllowedToCreate = computed(() => {
+    if ($props.acls.length) console.log(acl.hasAny($props.acls));
     return role.hasAny($props.rolesAllowedToCreate);
 });
 
diff --git a/src/pages/Item/Card/ItemSummary.vue b/src/pages/Item/Card/ItemSummary.vue
index 7af3e0fa0..1571a903e 100644
--- a/src/pages/Item/Card/ItemSummary.vue
+++ b/src/pages/Item/Card/ItemSummary.vue
@@ -9,6 +9,7 @@ import ItemDescriptorImage from 'src/pages/Item/Card/ItemDescriptorImage.vue';
 import VnUserLink from 'src/components/ui/VnUserLink.vue';
 
 import { useRole } from 'src/composables/useRole';
+import { useAcl } from 'src/composables/useAcl';
 
 const $props = defineProps({
     id: {
@@ -19,21 +20,13 @@ const $props = defineProps({
 
 const route = useRoute();
 const { t } = useI18n();
-const roleState = useRole();
 
 const entityId = computed(() => $props.id || route.params.id);
 
-const isBuyer = computed(() => {
-    return roleState.hasAny(['buyer']);
-});
+const canEdit = computed(() => useAcl().hasAny('Item', '*', 'WRITE'));
 
-const isReplenisher = computed(() => {
-    return roleState.hasAny(['replenisher']);
-});
+const isReplenisher = computed(() => useRole().hasAny(['replenisher']));
 
-const isAdministrative = computed(() => {
-    return roleState.hasAny(['administrative']);
-});
 </script>
 
 <template>
@@ -66,13 +59,13 @@ const isAdministrative = computed(() => {
             </QCard>
             <QCard class="vn-one">
                 <component
-                    :is="isBuyer ? 'router-link' : 'span'"
+                    :is="canEdit ? 'router-link' : 'span'"
                     :to="{ name: 'ItemBasicData', params: { id: entityId } }"
                     class="header"
-                    :class="{ 'header-link': isBuyer }"
+                    :class="{ 'header-link': canEdit }"
                 >
                     {{ t('item.summary.basicData') }}
-                    <QIcon v-if="isBuyer" name="open_in_new" />
+                    <QIcon v-if="canEdit" name="open_in_new" />
                 </component>
                 <VnLv :label="t('item.summary.name')" :value="item.name" />
                 <VnLv :label="t('item.summary.completeName')" :value="item.longName" />
@@ -105,13 +98,13 @@ const isAdministrative = computed(() => {
             </QCard>
             <QCard class="vn-one">
                 <component
-                    :is="isBuyer ? 'router-link' : 'span'"
+                    :is="canEdit ? 'router-link' : 'span'"
                     :to="{ name: 'ItemBasicData', params: { id: entityId } }"
                     class="header"
-                    :class="{ 'header-link': isBuyer }"
+                    :class="{ 'header-link': canEdit }"
                 >
                     {{ t('item.summary.otherData') }}
-                    <QIcon v-if="isBuyer" name="open_in_new" />
+                    <QIcon v-if="canEdit" name="open_in_new" />
                 </component>
                 <VnLv
                     :label="t('item.summary.intrastatCode')"
@@ -138,13 +131,13 @@ const isAdministrative = computed(() => {
             </QCard>
             <QCard class="vn-one">
                 <component
-                    :is="isBuyer || isReplenisher ? 'router-link' : 'span'"
+                    :is="canEdit || isReplenisher ? 'router-link' : 'span'"
                     :to="{ name: 'ItemTags', params: { id: entityId } }"
                     class="header"
-                    :class="{ 'header-link': isBuyer || isReplenisher }"
+                    :class="{ 'header-link': canEdit || isReplenisher }"
                 >
                     {{ t('item.summary.tags') }}
-                    <QIcon v-if="isBuyer || isReplenisher" name="open_in_new" />
+                    <QIcon v-if="canEdit || isReplenisher" name="open_in_new" />
                 </component>
                 <VnLv
                     v-for="(tag, index) in tags"
@@ -155,13 +148,13 @@ const isAdministrative = computed(() => {
             </QCard>
             <QCard class="vn-one" v-if="item.description">
                 <component
-                    :is="isBuyer ? 'router-link' : 'span'"
+                    :is="canEdit ? 'router-link' : 'span'"
                     :to="{ name: 'ItemBasicData', params: { id: entityId } }"
                     class="header"
-                    :class="{ 'header-link': isBuyer }"
+                    :class="{ 'header-link': canEdit }"
                 >
                     {{ t('item.summary.description') }}
-                    <QIcon v-if="isBuyer" name="open_in_new" />
+                    <QIcon v-if="canEdit" name="open_in_new" />
                 </component>
                 <p>
                     {{ item.description }}
@@ -169,13 +162,13 @@ const isAdministrative = computed(() => {
             </QCard>
             <QCard class="vn-one">
                 <component
-                    :is="isBuyer || isAdministrative ? 'router-link' : 'span'"
+                    :is="canEdit ? 'router-link' : 'span'"
                     :to="{ name: 'ItemTax', params: { id: entityId } }"
                     class="header"
-                    :class="{ 'header-link': isBuyer || isAdministrative }"
+                    :class="{ 'header-link': canEdit }"
                 >
                     {{ t('item.summary.tax') }}
-                    <QIcon v-if="isBuyer || isAdministrative" name="open_in_new" />
+                    <QIcon v-if="canEdit" name="open_in_new" />
                 </component>
                 <VnLv
                     v-for="(tax, index) in item.taxes"
@@ -186,13 +179,13 @@ const isAdministrative = computed(() => {
             </QCard>
             <QCard class="vn-one">
                 <component
-                    :is="isBuyer ? 'router-link' : 'span'"
+                    :is="canEdit ? 'router-link' : 'span'"
                     :to="{ name: 'ItemBotanical', params: { id: entityId } }"
                     class="header"
-                    :class="{ 'header-link': isBuyer }"
+                    :class="{ 'header-link': canEdit }"
                 >
                     {{ t('item.summary.botanical') }}
-                    <QIcon v-if="isBuyer" name="open_in_new" />
+                    <QIcon v-if="canEdit" name="open_in_new" />
                 </component>
                 <VnLv :label="t('item.summary.genus')" :value="botanical?.genus?.name" />
                 <VnLv
@@ -202,13 +195,13 @@ const isAdministrative = computed(() => {
             </QCard>
             <QCard class="vn-one">
                 <component
-                    :is="isBuyer || isReplenisher ? 'router-link' : 'span'"
+                    :is="canEdit || isReplenisher ? 'router-link' : 'span'"
                     :to="{ name: 'ItemBarcode', params: { id: entityId } }"
                     class="header"
-                    :class="{ 'header-link': isBuyer || isReplenisher }"
+                    :class="{ 'header-link': canEdit || isReplenisher }"
                 >
                     {{ t('item.summary.barcode') }}
-                    <QIcon v-if="isBuyer || isReplenisher" name="open_in_new" />
+                    <QIcon v-if="canEdit || isReplenisher" name="open_in_new" />
                 </component>
                 <p v-for="(barcode, index) in item.itemBarcode" :key="index">
                     {{ barcode.code }}
diff --git a/src/pages/Supplier/Card/SupplierSummary.vue b/src/pages/Supplier/Card/SupplierSummary.vue
index 822586b47..04f763c15 100644
--- a/src/pages/Supplier/Card/SupplierSummary.vue
+++ b/src/pages/Supplier/Card/SupplierSummary.vue
@@ -4,13 +4,12 @@ import { useRoute } from 'vue-router';
 import { useI18n } from 'vue-i18n';
 import CardSummary from 'components/ui/CardSummary.vue';
 import VnLv from 'src/components/ui/VnLv.vue';
-import { useRole } from 'src/composables/useRole';
+import { useAcl } from 'src/composables/useAcl';
 import { dashIfEmpty } from 'src/filters';
 import VnUserLink from 'src/components/ui/VnUserLink.vue';
 import VnTitle from 'src/components/common/VnTitle.vue';
 
 const route = useRoute();
-const roleState = useRole();
 const { t } = useI18n();
 
 const $props = defineProps({
@@ -32,13 +31,11 @@ async function setData(data) {
     }
 }
 
-const isAdministrative = computed(() => {
-    return roleState.hasAny(['administrative']);
-});
 
-function getUrl(section) {
-    return isAdministrative.value && `#/supplier/${entityId.value}/${section}`;
-}
+
+const getUrl = (section) => 
+    useAcl().hasAny('Supplier','*','WRITE') ? `#/supplier/${entityId.value}/${section}`:'';
+
 </script>
 
 <template>
diff --git a/src/pages/Travel/Card/TravelDescriptorMenuItems.vue b/src/pages/Travel/Card/TravelDescriptorMenuItems.vue
index bd2561211..47b6f0aa6 100644
--- a/src/pages/Travel/Card/TravelDescriptorMenuItems.vue
+++ b/src/pages/Travel/Card/TravelDescriptorMenuItems.vue
@@ -8,7 +8,7 @@ import VnConfirm from 'components/ui/VnConfirm.vue';
 
 import axios from 'axios';
 import useNotify from 'src/composables/useNotify.js';
-import { useRole } from 'src/composables/useRole';
+import { useAcl } from 'src/composables/useAcl';
 
 const $props = defineProps({
     travel: {
@@ -21,7 +21,6 @@ const { t } = useI18n();
 const router = useRouter();
 const quasar = useQuasar();
 const { notify } = useNotify();
-const role = useRole();
 
 const redirectToCreateView = (queryParams) => {
     router.push({ name: 'TravelCreate', query: { travelData: queryParams } });
@@ -42,9 +41,7 @@ const cloneTravelWithEntries = async () => {
     }
 };
 
-const isBuyer = computed(() => {
-    return role.hasAny(['buyer']);
-});
+const canDelete = computed(() => useAcl().hasAny('Travel','*','WRITE'));
 
 const openDeleteEntryDialog = (id) => {
     quasar
@@ -81,7 +78,7 @@ const deleteTravel = async (id) => {
         </QItemSection>
     </QItem>
     <QItem
-        v-if="isBuyer && travel.totalEntries === 0"
+        v-if="canDelete && travel.totalEntries === 0"
         v-ripple
         clickable
         @click="openDeleteEntryDialog(travel.id)"
diff --git a/src/pages/Worker/Card/WorkerTimeControl.vue b/src/pages/Worker/Card/WorkerTimeControl.vue
index 7bce5983c..1081cba61 100644
--- a/src/pages/Worker/Card/WorkerTimeControl.vue
+++ b/src/pages/Worker/Card/WorkerTimeControl.vue
@@ -13,6 +13,7 @@ import WorkerTimeControlCalendar from 'pages/Worker/Card/WorkerTimeControlCalend
 import useNotify from 'src/composables/useNotify.js';
 import axios from 'axios';
 import { useRole } from 'src/composables/useRole';
+import { useAcl } from 'src/composables/useAcl';
 import { useWeekdayStore } from 'src/stores/useWeekdayStore';
 import { useStateStore } from 'stores/useStateStore';
 import { useState } from 'src/composables/useState';
@@ -26,7 +27,6 @@ import { date } from 'quasar';
 const route = useRoute();
 const { t, locale } = useI18n();
 const { notify } = useNotify();
-const { hasAny } = useRole();
 const _state = useState();
 const user = _state.getUser();
 const stateStore = useStateStore();
@@ -62,9 +62,11 @@ const arrayData = useArrayData('workerData');
 
 const worker = computed(() => arrayData.store?.data);
 
-const isHr = computed(() => hasAny(['hr']));
+const isHr = computed(() => useRole().hasAny(['hr']));
 
-const isHimSelf = computed(() => user.value.id === Number(route.params.id));
+const canSend = computed(() => useAcl().hasAny('WorkerTimeControl', 'sendMail', 'WRITE'));
+
+const isHimself = computed(() => user.value.id === Number(route.params.id));
 
 const columns = computed(() => {
     return weekdayStore.getLocales?.map((day, index) => {
@@ -443,7 +445,7 @@ onMounted(async () => {
         <div>
             <QBtnGroup push class="q-gutter-x-sm" flat>
                 <QBtn
-                    v-if="isHimSelf && state"
+                    v-if="isHimself && state"
                     :label="t('Satisfied')"
                     color="primary"
                     type="submit"
@@ -451,7 +453,7 @@ onMounted(async () => {
                     @click="isSatisfied()"
                 />
                 <QBtn
-                    v-if="isHimSelf && state"
+                    v-if="isHimself && state"
                     :label="t('Not satisfied')"
                     color="primary"
                     type="submit"
@@ -462,14 +464,14 @@ onMounted(async () => {
             </QBtnGroup>
             <QBtnGroup push class="q-gutter-x-sm q-ml-none" flat>
                 <QBtn
-                    v-if="reason && state && (isHimSelf || isHr)"
+                    v-if="reason && state && (isHimself || isHr)"
                     :label="t('Reason')"
                     color="primary"
                     type="submit"
                     @click="showReasonForm()"
                 />
                 <QBtn
-                    v-if="isHr && state !== 'CONFIRMED' && canResend"
+                    v-if="canSend && state !== 'CONFIRMED' && canResend"
                     :label="state ? t('Resend') : t('globals.send')"
                     color="primary"
                     type="submit"
@@ -596,7 +598,7 @@ onMounted(async () => {
             <WorkerTimeReasonForm
                 @on-submit="isUnsatisfied($event)"
                 :reason="reason"
-                :is-him-self="isHimSelf"
+                :is-himself="isHimself"
             />
         </QDialog>
     </QPage>
diff --git a/src/pages/Worker/Card/WorkerTimeReasonForm.vue b/src/pages/Worker/Card/WorkerTimeReasonForm.vue
index 5c1ab9118..23bdba15e 100644
--- a/src/pages/Worker/Card/WorkerTimeReasonForm.vue
+++ b/src/pages/Worker/Card/WorkerTimeReasonForm.vue
@@ -9,7 +9,7 @@ const $props = defineProps({
         type: String,
         default: '',
     },
-    isHimSelf: {
+    isHimself: {
         type: Boolean,
         default: false,
     },
@@ -40,7 +40,7 @@ const closeForm = () => {
                 v-model="reasonFormData"
                 type="textarea"
                 autogrow
-                :disable="!isHimSelf"
+                :disable="!isHimself"
             />
         </template>
     </FormPopup>
diff --git a/src/pages/Worker/WorkerList.vue b/src/pages/Worker/WorkerList.vue
index 0c2656597..45bc41856 100644
--- a/src/pages/Worker/WorkerList.vue
+++ b/src/pages/Worker/WorkerList.vue
@@ -269,7 +269,7 @@ function uppercaseStreetModel(data) {
                         option-label="name"
                         option-value="id"
                         hide-selected
-                        :roles-allowed-to-create="['salesAssistant', 'hr']"
+                        :acls="[]"
                         :disable="data.isFreelance"
                     >
                         <template #form>