fix #314 Wrong display of the Window references in the context menu. (#315)

* fix: Add item to notify when window references is empty.

* fix: Display of Window references when they have many items in the list.

src/components/ADempiere/ContextMenu/contextMenuDesktop.vue

@@ -12,7 +12,7 @@
       @shortkey.native="actionContextMenu"
     >
       <template>
-        <el-submenu v-if="relationsList !== undefined && relationsList.length" class="el-menu-item" index="1">
+        <el-submenu v-if="!isEmptyValue(relationsList)" class="el-menu-item" index="1">
           <template slot="title">
             {{ $t('components.contextMenuRelations') }}
           </template>
@@ -33,12 +33,24 @@
                 {{ action.name }}
               </template>
               <el-scrollbar wrap-class="scroll-child">
-                <el-menu-item v-for="(child, key) in action.childs" :key="key" :index="child.uuid" @click="runAction(child)">
+                <el-menu-item
+                  v-for="(child, key) in action.childs"
+                  :key="key"
+                  :index="child.uuid"
+                  @click="runAction(child)"
+                >
                   {{ child.name }}
                 </el-menu-item>
               </el-scrollbar>
             </el-submenu>
-            <el-menu-item v-else v-show="!action.hidden" :key="index" :index="action.name" :disabled="action.disabled" @click="runAction(action)">
+            <el-menu-item
+              v-else
+              v-show="!action.hidden"
+              :key="index"
+              :index="action.name"
+              :disabled="action.disabled"
+              @click="runAction(action)"
+            >
               {{ action.name }}
             </el-menu-item>
           </template>
@@ -53,7 +65,9 @@
             index="xlsx"
             @click.native="exporBrowser('xlsx')"
           >
-            <template slot="title">{{ $t('components.contextMennuWindowReport') }}</template>
+            <template slot="title">
+              {{ $t('components.contextMennuWindowReport') }}
+            </template>
             <template v-for="(format, index) in option">
               <el-menu-item :key="index" :index="index">
                 {{ format }}
@@ -87,17 +101,25 @@
         <el-menu-item v-else disabled index="2">
           {{ $t('components.contextMenuActions') }}
         </el-menu-item>
-        <el-submenu :disabled="!isReferencesLoaded" class="el-menu-item" index="3">
+        <el-submenu :disabled="!(isReferecesContent && isLoadedReferences)" class="el-menu-item" index="3">
           <template slot="title">
             {{ $t('components.contextMenuReferences') }}
           </template>
-          <template v-if="references && references.referencesList">
+          <template v-if="references && !isEmptyValue(references.referencesList)">
-            <template v-for="(reference, index) in references.referencesList">
+            <el-scrollbar wrap-class="scroll-child">
-              <el-menu-item :key="index" :index="reference.displayName" @click="runAction(reference)">
+              <el-menu-item
+                v-for="(reference, index) in references.referencesList"
+                :key="index"
+                :index="reference.displayName"
+                @click="runAction(reference)"
+              >
                 {{ reference.displayName }}
               </el-menu-item>
-            </template>
+            </el-scrollbar>
           </template>
+          <el-menu-item v-else index="not-references" disabled>
+            {{ $t('components.withOutReferences') }}
+          </el-menu-item>
         </el-submenu>
       </template>
     </el-menu>

src/components/ADempiere/ContextMenu/contextMenuMixin.js

@@ -54,7 +54,7 @@ export const contextMixin = {
       downloads: this.$store.getters.getProcessResult.url,
       metadataMenu: {},
       recordUuid: this.$route.query.action,
-      isReferencesLoaded: false,
+      isLoadedReferences: false,
       exportDefault: 'xls',
       ROUTES
     }
@@ -264,31 +264,30 @@ export const contextMixin = {
     },
     getReferences() {
       if (this.isReferecesContent) {
-        var references = this.getterReferences
+        const references = this.getterReferences
         if (references && references.length) {
           this.references = references
-          this.isReferencesLoaded = true
+          this.isLoadedReferences = true
         } else {
+          this.isLoadedReferences = false
           this.$store.dispatch('getReferencesListFromServer', {
             parentUuid: this.parentUuid,
             containerUuid: this.containerUuid,
             recordUuid: this.recordUuid
           })
             .then(() => {
-              this.references = this.$store.getters.getReferencesList(this.parentUuid, this.recordUuid)
+              this.references = this.getterReferences
-              if (this.references.referencesList.length) {
-                this.isReferencesLoaded = true
-              } else {
-                this.isReferencesLoaded = false
-              }
             })
             .catch(error => {
-              console.warn('References Load Error ' + error.code + ': ' + error.message)
+              console.warn(`References Load Error ${error.code}: ${error.message}.`)
+            })
+            .finally(() => {
+              this.isLoadedReferences = true
             })
         }
       } else {
         this.references = []
-        this.isReferencesLoaded = false
+        this.isLoadedReferences = false
       }
     },
     typeFormat(key) {

src/components/ADempiere/ContextMenu/contextMenuMobile.vue

@@ -30,15 +30,31 @@
           <el-menu-item-group>
             <el-scrollbar wrap-class="scroll">
               <template v-for="(action, index) in actions">
-                <el-submenu v-if="action.childs" :key="index" :index="action.name" :disabled="action.disabled">
+                <el-submenu
+                  v-if="action.childs"
+                  :key="index"
+                  :index="action.name"
+                  :disabled="action.disabled"
+                >
                   <template slot="title">
                     {{ action.name }}
                   </template>
-                  <el-menu-item v-for="(child, key) in action.childs" :key="key" :index="child.uuid" @click="runAction(child)">
+                  <el-menu-item
+                    v-for="(child, key) in action.childs"
+                    :key="key"
+                    :index="child.uuid"
+                    @click="runAction(child)"
+                  >
                     {{ child.name }}
                   </el-menu-item>
                 </el-submenu>
-                <el-menu-item v-else :key="index" :index="action.name" :disabled="action.disabled" @click="runAction(action)">
+                <el-menu-item
+                  v-else
+                  :key="index"
+                  :index="action.name"
+                  :disabled="action.disabled"
+                  @click="runAction(action)"
+                >
                   <svg-icon v-if="action.type === 'process'" icon-class="component" />
                   {{ action.name }}
                 </el-menu-item>
@@ -57,17 +73,25 @@
             </el-scrollbar>
           </el-menu-item-group>
         </el-submenu>
-        <el-submenu :disabled="!isReferecesContent && !isReferencesLoaded" class="el-menu-item" index="3">
+        <el-submenu :disabled="!(isReferecesContent && isLoadedReferences)" class="el-menu-item" index="3">
           <template slot="title">
             {{ $t('components.contextMenuReferences') }}
           </template>
-          <template v-if="references && references.referencesList">
+          <template v-if="references && isEmptyValue(references.referencesList)">
-            <template v-for="(reference, index) in references.referencesList">
+            <el-scrollbar wrap-class="scroll-child">
-              <el-menu-item :key="index" :index="reference.displayName" @click="runAction(reference)">
+              <el-menu-item
+                v-for="(reference, index) in references.referencesList"
+                :key="index"
+                :index="reference.displayName"
+                @click="runAction(reference)"
+              >
                 {{ reference.displayName }}
               </el-menu-item>
-            </template>
+            </el-scrollbar>
           </template>
+          <el-menu-item v-else index="not-references" disabled>
+            {{ $t('components.withOutReferences') }}
+          </el-menu-item>
         </el-submenu>
       </el-menu>
     </right-menu>

src/lang/ADempiere/en.js

@@ -122,6 +122,7 @@ export default {
     contextMenuRelations: 'Relations',
     contextMenuActions: 'Actions',
     contextMenuReferences: 'References',
+    withOutReferences: 'Without references for record',
     RunProcess: 'Run',
     ChangeParameters: 'Change Parameters',
     RunProcessAs: 'Run As',

src/lang/ADempiere/es.js

@@ -122,6 +122,7 @@ export default {
     contextMenuRelations: 'Relaciones',
     contextMenuActions: 'Acciones',
     contextMenuReferences: 'Referencias',
+    withOutReferences: 'Sin referencias para el registro',
     contextMenuDownload: 'Descargar',
     contextMenuShareLink: 'Compartir Link',
     contextMenuRefresh: 'Actualizar',