Does not sort the field list of the child tabs on every render. (#363)

src/components/ADempiere/DataTable/index.vue

@@ -165,7 +165,7 @@
               fixed
               min-width="50"
             />
-            <template v-for="(fieldAttributes, key) in fieldList">
+            <template v-for="(fieldAttributes, key) in fieldsList">
               <el-table-column
                 v-if="isDisplayed(fieldAttributes)"
                 :key="key"
@@ -445,12 +445,20 @@ export default {
       }
       return this.getterHeight - 300 - totalRow
     },
-    fieldList() {
+    fieldsList() {
       if (this.getterPanel && this.getterPanel.fieldList) {
-        return this.sortFields(
+        if ((this.panelType === 'window' && this.isParent) || this.panelType === 'browser') {
-          this.getterPanel.fieldList,
+          let orderBy = 'seqNoGrid'
-          this.panelType !== 'browser' ? 'seqNoGrid' : 'sequence'
+          if (this.panelType === 'browser') {
-        )
+            orderBy = 'sequence'
+          }
+
+          return this.sortFields({
+            fieldsList: this.getterPanel.fieldList,
+            orderBy
+          })
+        }
+        return this.getterPanel.fieldList
       }
       return []
     },
@@ -727,7 +735,7 @@ export default {
         this.$store.dispatch('addNewRow', {
           parentUuid: this.parentUuid,
           containerUuid: this.containerUuid,
-          fieldList: this.fieldList,
+          fieldList: this.fieldsList,
           isEdit: true,
           isSendServer: false
         })
@@ -744,7 +752,7 @@ export default {
     },
     async setFocus() {
       return new Promise(resolve => {
-        const fieldFocus = this.fieldList.find(itemField => {
+        const fieldFocus = this.fieldsList.find(itemField => {
           if (this.$refs.hasOwnProperty(itemField.columnName)) {
             if (fieldIsDisplayed(itemField) && !itemField.isReadOnly && itemField.isUpdateable) {
               return true
@@ -939,7 +947,7 @@ export default {
         }).then(response => {
           this.isLoadPanelFromServer = true
         }).catch(error => {
-          console.warn(`FieldList Load Error ${error.code}: ${error.message}.`)
+          console.warn(`Fields List Load Error ${error.code}: ${error.message}.`)
         })
       }
     },
@@ -959,7 +967,7 @@ export default {
           sums[index] = 'Σ'
           return
         }
-        const field = this.fieldList.find(field => field.columnName === columnItem.property)
+        const field = this.fieldsList.find(field => field.columnName === columnItem.property)
         if (!FIELDS_QUANTITY.includes(field.referenceType)) {
           sums[index] = ''
           return

src/components/ADempiere/DataTable/menu/menuTableMixin.js

@@ -2,7 +2,6 @@ import { supportedTypes, exportFileFromJson, exportFileZip } from '@/utils/ADemp
 import { showNotification } from '@/utils/ADempiere/notification'
 import { recursiveTreeSearch } from '@/utils/ADempiere/valueUtils'
 import { FIELDS_QUANTITY } from '@/components/ADempiere/Field/references'
-import { sortFields } from '@/utils/ADempiere/dictionaryUtils'
 
 export const menuTableMixin = {
   props: {
@@ -79,18 +78,9 @@ export const menuTableMixin = {
     getDataAllRecord() {
       return this.getterDataRecordsAndSelection.record
     },
-    fieldList() {
+    fieldsList() {
       if (this.panelMetadata && this.panelMetadata.fieldList) {
-        let sortAttribute = 'sequence'
+        return this.panelMetadata.fieldList
-        if (this.panelType === 'browser') {
-          sortAttribute = 'seqNoGrid'
-        }
-        // TODO: Change to destructuring and add isParent attribure to change
-        // orderBy sequence value to seqNoGrid value if isParent is false
-        return this.sortFields(
-          this.panelMetadata.fieldList,
-          sortAttribute
-        )
       }
       return []
     },
@@ -167,7 +157,6 @@ export const menuTableMixin = {
   },
   methods: {
     showNotification,
-    sortFields,
     closeMenu() {
       // TODO: Validate to dispatch one action
       this.$store.dispatch('showMenuTable', {
@@ -253,7 +242,7 @@ export const menuTableMixin = {
         this.$store.dispatch('addNewRow', {
           parentUuid: this.parentUuid,
           containerUuid: this.containerUuid,
-          fieldList: this.fieldList,
+          fieldList: this.fieldsList,
           isEdit: true,
           isSendServer: false
         })

src/store/modules/ADempiere/panel.js

@@ -95,7 +95,15 @@ const panel = {
             }
           }
         })
-        params.fieldList = assignedGroup(params.fieldList)
+
+        let orderBy = 'sequence'
+        if ((params.panelType === 'window' && !params.isParent) || params.panelType === 'browser') {
+          orderBy = 'seqNoGrid'
+        }
+        params.fieldList = assignedGroup({
+          fieldsList: params.fieldList,
+          orderBy
+        })
       }
 
       params.keyColumn = keyColumn

src/utils/ADempiere/dictionaryUtils.js

@@ -467,18 +467,21 @@ export function getFieldTemplate(attributesOverwrite) {
  * @param  {array} fieldList Field of List with
  * @return {array} fieldList
  */
-export function assignedGroup(fieldList, assignedGroup) {
+export function assignedGroup({ fieldsList, groupToAssigned, orderBy }) {
-  if (fieldList === undefined || fieldList.length <= 0) {
+  if (fieldsList === undefined || fieldsList.length <= 0) {
-    return fieldList
+    return fieldsList
   }
 
-  fieldList = sortFields(fieldList, 'sequence', 'asc', fieldList[0].panelType)
+  fieldsList = sortFields({
+    fieldsList,
+    orderBy
+  })
 
   let firstChangeGroup = false
   let currentGroup = ''
   let typeGroup = ''
 
-  fieldList.forEach(fieldElement => {
+  fieldsList.forEach(fieldElement => {
     if (fieldElement.panelType !== 'window') {
       fieldElement.groupAssigned = ''
       fieldElement.typeGroupAssigned = ''
@@ -507,12 +510,12 @@ export function assignedGroup(fieldList, assignedGroup) {
     fieldElement.groupAssigned = currentGroup
     fieldElement.typeGroupAssigned = typeGroup
 
-    if (assignedGroup !== undefined) {
+    if (groupToAssigned !== undefined) {
-      fieldElement.groupAssigned = assignedGroup
+      fieldElement.groupAssigned = groupToAssigned
     }
   })
 
-  return fieldList
+  return fieldsList
 }
 
 /**
@@ -524,18 +527,26 @@ export function assignedGroup(fieldList, assignedGroup) {
  * @param {string} panelType
  * @returns {array}
  */
-export function sortFields(arr, orderBy = 'sequence', type = 'asc', panelType = 'window') {
+export function sortFields({
-  if (panelType === 'browser') {
+  fieldsList,
-    orderBy = 'seqNoGrid'
+  orderBy = 'sequence',
-  }
+  type = 'asc'
-  arr.sort((itemA, itemB) => {
+}) {
+  if (type.toLowerCase() === 'asc') {
+    fieldsList.sort((itemA, itemB) => {
       return itemA[orderBy] - itemB[orderBy]
       // return itemA[orderBy] > itemB[orderBy]
     })
-  if (type.toLowerCase() === 'desc') {
+  } else {
-    return arr.reverse()
+    fieldsList.sort((itemA, itemB) => {
+      return itemA[orderBy] + itemB[orderBy]
+      // return itemA[orderBy] > itemB[orderBy]
+    })
   }
-  return arr
+  // if (type.toLowerCase() === 'desc') {
+  //   return fieldsList.reverse()
+  // }
+  return fieldsList
 }
 
 /**