feat: Standard method to is displayed field/column (#924)

src/components/ADempiere/DataTable/dataTables-Script.js

@@ -22,10 +22,9 @@ import TableMainMenu from '@/components/ADempiere/DataTable/menu'
 import IconElement from '@/components/ADempiere/IconElement'
 import { formatField } from '@/utils/ADempiere/valueFormat'
 import MainPanel from '@/components/ADempiere/Panel'
-import { sortFields } from '@/utils/ADempiere/dictionaryUtils'
+import { fieldIsDisplayed, sortFields } from '@/utils/ADempiere/dictionaryUtils.js'
 import { FIELDS_DECIMALS, FIELDS_QUANTITY, COLUMNS_READ_ONLY_FORM } from '@/utils/ADempiere/references'
 import { LOG_COLUMNS_NAME_LIST } from '@/utils/ADempiere/dataUtils.js'
-import { fieldIsDisplayed } from '@/utils/ADempiere'
 import evaluator from '@/utils/ADempiere/evaluator'
 import TableMixin from './mixin/tableMixin.js'
 import TableMixinSort from './mixin/mixinTableSort.js'
@@ -152,10 +151,11 @@ export default {
       return this.$store.getters.getHeigth
     },
     tableHeaderStyle() {
+      // record navigation
       if (this.isParent) {
         if (!this.isEmptyValue(this.activeName)) {
           return {
-            height: '55%',
+            height: '43%',
             overflow: 'auto'
           }
         } else if (this.isMobile) {
@@ -165,10 +165,12 @@ export default {
           }
         }
         return {
-          height: '11%',
+          height: '86px',
           overflow: 'hidden'
         }
       }
+
+      // tab children and browser result
       if (this.isMobile) {
         return {
           height: '10%'
@@ -291,6 +293,15 @@ export default {
   },
   methods: {
     sortFields,
+
+    /**
+     * Verify is displayed field in column table
+     */
+    isDisplayedField(field) {
+      return fieldIsDisplayed(field, true) &&
+        field.isShowedTableFromUser
+    },
+
     actionAdvancedQuery() {
       const activeNames = []
       if (!this.activeName.length) {
@@ -444,7 +455,7 @@ export default {
       if (this.preferenceClientId !== parseInt(row.AD_Client_ID, 10)) {
         return true
       }
-      if (fieldIsDisplayed(field)) {
+      if (this.isDisplayedField(field)) {
         // columnName: IsActive
         const fieldReadOnlyForm = COLUMNS_READ_ONLY_FORM.find(item => {
           return !item.isChangedAllForm &&
@@ -529,7 +540,7 @@ export default {
       return new Promise(resolve => {
         const fieldFocus = this.fieldsList.find(itemField => {
           if (Object.prototype.hasOwnProperty.call(this.$refs, itemField.columnName)) {
-            if (fieldIsDisplayed(itemField) && !itemField.isReadOnly && itemField.isUpdateable) {
+            if (this.isDisplayedField(itemField) && !itemField.isReadOnly && itemField.isUpdateable) {
               return true
             }
           }
@@ -675,17 +686,6 @@ export default {
         this.recordsSearchTableChildren = result
       }
     },
-    /**
-     * Verify is displayed field in column table
-     */
-    isDisplayed(field) {
-      const isDisplayed = field.isDisplayed &&
-        field.isDisplayedFromLogic &&
-        field.isShowedTableFromUser &&
-        !field.isKey
-      //  Verify for displayed and is active
-      return field.isActive && isDisplayed
-    },
     /**
      * Get the tab object with all its attributes as well as the fields it contains
      */

src/components/ADempiere/DataTable/filterColumns.vue

@@ -15,6 +15,7 @@
  You should have received a copy of the GNU General Public License
  along with this program.  If not, see <https:www.gnu.org/licenses/>.
 -->
+
 <template>
   <el-select
     v-model="fieldsListShowed"
@@ -36,6 +37,8 @@
 </template>
 
 <script>
+import { fieldIsDisplayed } from '@/utils/ADempiere/dictionaryUtils.js'
+
 export default {
   name: 'FilterColumns',
   props: {
@@ -54,17 +57,14 @@ export default {
     // available fields
     fieldsListAvailable() {
       return this.fieldsList.filter(fieldItem => {
-        const isDisplayed = fieldItem.isDisplayed || fieldItem.isDisplayedFromLogic
-        return fieldItem.isActive && isDisplayed && !fieldItem.isKey
+        return fieldIsDisplayed(fieldItem, true)
       })
     },
     fieldsListShowed: {
       get() {
         // columns showed
-        return this.fieldsList.filter(itemField => {
-          if (itemField.isShowedTableFromUser && (itemField.isDisplayed || itemField.isDisplayedFromLogic) && !itemField.isKey) {
-            return true
-          }
+        return this.fieldsListAvailable.filter(itemField => {
+          return itemField.isShowedTableFromUser
         }).map(itemField => {
           return itemField.columnName
         })

src/components/ADempiere/DataTable/index.vue

@@ -32,18 +32,19 @@
             @shortkey.native="actionAdvancedQuery()"
           >
             <el-collapse-item :title="$t('table.dataTable.advancedQuery')" name="PanelAdvancedQuery">
-              <main-panel
-                v-if="isLoadedPanel || !isEmptyValue(activeName) && activeName[0] === 'PanelAdvancedQuery'"
-                v-show="!isEmptyValue(activeName) && activeName[0] === 'PanelAdvancedQuery'"
-                :container-uuid="'table_' + containerUuid"
-                :parent-uuid="'table_' + parentUuid"
-                :metadata="panelMetadata"
-                panel-type="table"
-                is-advanced-query
-                class="collapse_item_wrap"
-              />
+              <template v-if="isLoadedPanel">
+                <main-panel
+                  :container-uuid="'table_' + containerUuid"
+                  :parent-uuid="'table_' + parentUuid"
+                  :metadata="panelMetadata"
+                  panel-type="table"
+                  is-advanced-query
+                  class="collapse_item_wrap"
+                />
+              </template>
             </el-collapse-item>
           </el-collapse>
+
           <div v-if="!isMobile">
             <table-main-menu
               :container-uuid="containerUuid"
@@ -172,7 +173,7 @@
             />
             <template v-for="(fieldAttributes, key) in fieldsList">
               <el-table-column
-                v-if="isDisplayed(fieldAttributes)"
+                v-if="isDisplayedField(fieldAttributes)"
                 :key="key"
                 :label="headerLabel(fieldAttributes)"
                 :column-key="fieldAttributes.columnName"

src/components/ADempiere/Field/index.vue

@@ -16,13 +16,9 @@
  along with this program.  If not, see <https:www.gnu.org/licenses/>.
 -->
 <template>
-  <!--
-    this v-show is to indicate that if the field is not shown,
-    therefore you should not leave the column size spacing of your
-    <el-col></el-col> container-->
   <div v-if="!inTable">
     <el-col
-      v-if="isDisplayed"
+      v-if="isDisplayedField"
       key="is-panel-template"
       :xs="24"
       :sm="12"
@@ -171,19 +167,22 @@ export default {
         // DOM properties
         required: this.isMandatory,
         readonly: this.isReadOnly,
-        displayed: this.isDisplayed,
+        displayed: this.isDisplayedField,
         disabled: !this.field.isActive,
         isSelectCreated: this.isSelectCreated,
         placeholder: this.field.help ? this.field.help.slice(0, 40) + '...' : ''
       }
     },
-    isDisplayed() {
+
+    isDisplayedField() {
       if (this.isAdvancedQuery) {
         return this.field.isShowedFromUser
       }
+
       return fieldIsDisplayed(this.field) &&
         (this.isMandatory || this.field.isShowedFromUser || this.inTable)
     },
+
     isMandatory() {
       if (this.isAdvancedQuery) {
         return false
@@ -269,7 +268,7 @@ export default {
         return 'in-table'
       }
       return ''
-    },
+    }
   },
   watch: {
     metadataField(value) {

src/store/modules/ADempiere/panel/actions.js

@@ -1,3 +1,19 @@
+// ADempiere-Vue (Frontend) for ADempiere ERP & CRM Smart Business Solution
+// Copyright (C) 2017-Present E.R.P. Consultores y Asociados, C.A.
+// Contributor(s): Edwin Betancourt EdwinBetanc0urt@outlook.com www.erpya.com
+// This program is free software: you can redistribute it and/or modify
+// it under the terms of the GNU General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+
+// This program is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+// GNU General Public License for more details.
+
+// You should have received a copy of the GNU General Public License
+// along with this program.  If not, see <https://www.gnu.org/licenses/>.
+
 import {
   isEmptyValue,
   typeValue
@@ -5,7 +21,7 @@ import {
 import { convertObjectToKeyValue } from '@/utils/ADempiere/valueFormat.js'
 import evaluator, { getContext, parseContext } from '@/utils/ADempiere/contextUtils.js'
 import { showMessage } from '@/utils/ADempiere/notification.js'
-import { assignedGroup } from '@/utils/ADempiere/dictionaryUtils.js'
+import { assignedGroup, fieldIsDisplayed } from '@/utils/ADempiere/dictionaryUtils.js'
 import router from '@/router'
 import language from '@/lang'
 
@@ -248,7 +264,10 @@ const actions = {
       valueAttribute: true
     })
   },
+
   /**
+   * Show all columns in table
+   * TODO: Add show fields in panel
    * @param {string}  containerUuid
    * @param {array}   fieldsList
    */
@@ -259,10 +278,10 @@ const actions = {
     if (isEmptyValue(fieldsList)) {
       fieldsList = getters.getFieldsListFromPanel(containerUuid)
     }
+
     const fieldsIncludes = []
     fieldsList.forEach(fieldItem => {
-      const isDisplayed = fieldItem.isDisplayed && fieldItem.isDisplayedFromLogic && !fieldItem.isKey
-      if (fieldItem.isActive && isDisplayed) {
+      if (fieldIsDisplayed(fieldItem, true)) {
         fieldsIncludes.push(fieldItem.columnName)
       }
     })

src/store/modules/ADempiere/panel/getters.js

@@ -136,6 +136,7 @@ const getters = {
    */
   getFieldsListNotMandatory: (state, getters) => ({
     containerUuid,
+    isTable = false,
     isEvaluateShowed = true
   }) => {
     // all optionals (not mandatory) fields
@@ -145,13 +146,11 @@ const getters = {
         if (isMandatory) {
           return false
         }
-        const isButtonField = fieldItem.componentPath === 'FieldButton'
-        if (isButtonField) {
-          return false
-        }
+
         if (isEvaluateShowed) {
-          return fieldIsDisplayed(fieldItem)
+          return fieldIsDisplayed(fieldItem, isTable)
         }
+
         return true
       })
   },
@@ -329,6 +328,7 @@ const getters = {
     const fieldsList = getters.getFieldsListFromPanel(containerUuid)
     let fieldsIsDisplayed = []
     const fieldsNotDisplayed = []
+
     if (fieldsList.length) {
       fieldsIsDisplayed = fieldsList.filter(itemField => {
         const isMandatory = itemField.isMandatory && itemField.isMandatoryFromLogic
@@ -338,8 +338,9 @@ const getters = {
         fieldsNotDisplayed.push(itemField)
       })
     }
+
     return {
-      fieldIsDisplayed,
+      fieldsIsDisplayed,
       fieldsNotDisplayed,
       totalField: fieldsList.length,
       isDisplayed: Boolean(fieldsIsDisplayed.length)

src/utils/ADempiere/dictionaryUtils.js

@@ -17,7 +17,7 @@
 import evaluator from '@/utils/ADempiere/evaluator'
 import { isEmptyValue, parsedValueComponent } from '@/utils/ADempiere/valueUtils'
 import { getContext, getParentFields, getPreference, parseContext } from '@/utils/ADempiere/contextUtils'
-import REFERENCES, { DEFAULT_SIZE, FIELDS_HIDDEN } from '@/utils/ADempiere/references'
+import REFERENCES, { BUTTON, DEFAULT_SIZE, FIELDS_HIDDEN } from '@/utils/ADempiere/references'
 import { FIELD_OPERATORS_LIST } from '@/utils/ADempiere/dataUtils'
 import language from '@/lang'
 
@@ -571,24 +571,95 @@ export function sortFields({
  * @returns {boolean}
  */
 export function fieldIsDisplayed({
+  // standard
   panelType,
   isActive,
   isDisplayed,
-  isDisplayedFromLogic,
-  isQueryCriteria
-}) {
-  // Verify if field is active
-  if (!isActive) {
+  displayType,
+  // panel
+  isQueryCriteria,
+  isKey,
+  // table
+  isDisplayedGrid,
+  // other
+  isDisplayedFromLogic
+}, isTable = false) {
+  // button field not showed
+  if (displayType === BUTTON.id) {
     return false
   }
 
+  // verify if field is active
+  if (!isActive || !isDisplayed) {
+    return false
+  }
+
+  // window (record navigation and tab childs), browser (table result)
+  if (isTable) {
+    return fieldIsDisplayedTable({
+      // standard
+      panelType,
+      // table,
+      isKey,
+      isDisplayedGrid,
+      // other
+      isDisplayedFromLogic
+    })
+  }
+
+  // window, process and report, browser (table result)
+  return fieldIsDisplayedPanel({
+    // standard
+    panelType,
+    // panel
+    isQueryCriteria,
+    // other
+    isDisplayedFromLogic
+  })
+}
+
+/**
+ * Determinate if field is displayed in panel
+ * @returns {boolean}
+ */
+export function fieldIsDisplayedPanel({
+  // standard
+  panelType,
+  // panel
+  isQueryCriteria,
+  // other
+  isDisplayedFromLogic
+}) {
   // browser query criteria
   if (panelType === 'browser') {
     return isQueryCriteria
   }
 
-  // window, table (advanced query), process and report, browser (table) result
-  return isDisplayed && isDisplayedFromLogic
+  // window, process and report
+  return isDisplayedFromLogic
+}
+
+/**
+ * Determinate if field/column is displayed in table
+ * @returns {boolean}
+ */
+export function fieldIsDisplayedTable({
+  // standard
+  panelType,
+  // table,
+  isKey,
+  isDisplayedGrid,
+  // other
+  isDisplayedFromLogic
+}) {
+  // window table
+  if (panelType === 'window' && !isDisplayedGrid) {
+    return false
+  }
+
+  // window , browser (table) result
+  return isDisplayedFromLogic &&
+    !isKey
 }
 
 // Convert action to action name for route