577 lines
19 KiB
JavaScript
577 lines
19 KiB
JavaScript
import FieldDefinition from '@/components/ADempiere/Field'
|
|
import FilterFields from '@/components/ADempiere/Panel/filterFields'
|
|
import { fieldIsDisplayed } from '@/utils/ADempiere/dictionaryUtils.js'
|
|
import { parsedValueComponent } from '@/utils/ADempiere/valueUtils.js'
|
|
import { convertObjectToKeyValue } from '@/utils/ADempiere/valueFormat.js'
|
|
import { LOG_COLUMNS_NAME_LIST } from '@/utils/ADempiere/dataUtils.js'
|
|
|
|
export default {
|
|
name: 'MainPanelMixin',
|
|
components: {
|
|
FieldDefinition,
|
|
FilterFields
|
|
},
|
|
props: {
|
|
parentUuid: {
|
|
type: String,
|
|
default: undefined
|
|
},
|
|
containerUuid: {
|
|
type: String,
|
|
required: true
|
|
},
|
|
metadata: {
|
|
type: Object,
|
|
default: () => {}
|
|
},
|
|
// tab type group
|
|
groupTab: {
|
|
type: Object,
|
|
default: () => ({
|
|
groupType: '',
|
|
groupName: ''
|
|
})
|
|
},
|
|
panelType: {
|
|
type: String,
|
|
default: 'window'
|
|
},
|
|
isAdvancedQuery: {
|
|
type: Boolean,
|
|
default: false
|
|
},
|
|
isShowedRecordNavigation: {
|
|
type: Boolean,
|
|
default: false
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
panelMetadata: {},
|
|
fieldsList: [], // groups list of fields
|
|
dataRecords: {},
|
|
isLoadPanel: false,
|
|
isLoadRecord: false,
|
|
uuidRecord: this.$route.query.action,
|
|
fieldGroups: [],
|
|
firstGroup: {},
|
|
groupsView: 0,
|
|
tagTitle: {
|
|
base: this.$route.meta.title,
|
|
action: ''
|
|
}
|
|
}
|
|
},
|
|
computed: {
|
|
shadowGroup() {
|
|
if (this.isMobile) {
|
|
return 'never'
|
|
}
|
|
return 'hover'
|
|
},
|
|
optionCRUD() {
|
|
return this.isEmptyValue(this.uuidRecord) ? 'create-new' : this.uuidRecord
|
|
},
|
|
isPanelWindow() {
|
|
return this.panelType === 'window'
|
|
},
|
|
panelAttributes() {
|
|
return {
|
|
recordUuid: this.uuidRecord,
|
|
optionCRUD: this.optionCRUD,
|
|
isShowedRecordNavigation: this.isShowedRecordNavigation,
|
|
clientId: this.getContainerClientId,
|
|
isProcessingContext: this.getContainerProcessing,
|
|
isProcessedContext: this.getContainerProcessed
|
|
}
|
|
},
|
|
getContainerProcessing() {
|
|
if (this.isPanelWindow && !this.isAdvancedQuery) {
|
|
return this.$store.getters.getContainerProcessing(this.parentUuid)
|
|
}
|
|
return false
|
|
},
|
|
getContainerProcessed() {
|
|
if (this.isPanelWindow && !this.isAdvancedQuery) {
|
|
return this.$store.getters.getContainerProcessed(this.parentUuid)
|
|
}
|
|
return false
|
|
},
|
|
getContainerClientId() {
|
|
let clientId = null
|
|
if (this.isPanelWindow && !this.isAdvancedQuery) {
|
|
// client id from current record
|
|
clientId = this.$store.getters.getValueOfField({
|
|
parentUuid: this.parentUuid,
|
|
containerUuid: this.containerUuid,
|
|
columnName: 'AD_Client_ID'
|
|
})
|
|
if (!this.isEmptyValue(clientId)) {
|
|
return parseInt(clientId, 10)
|
|
}
|
|
}
|
|
return clientId
|
|
},
|
|
getterPanel() {
|
|
return this.$store.getters.getPanel(this.containerUuid)
|
|
},
|
|
getterFieldsList() {
|
|
let panel = this.panelMetadata
|
|
if (!this.isEmptyValue(panel) && panel.fieldsList) {
|
|
return panel.fieldsList
|
|
}
|
|
panel = this.getterPanel
|
|
if (panel) {
|
|
return panel.fieldsList
|
|
}
|
|
return undefined
|
|
},
|
|
isMobile() {
|
|
return this.$store.state.app.device === 'mobile'
|
|
},
|
|
getterDataStore() {
|
|
if (this.isPanelWindow) {
|
|
return this.$store.getters.getDataRecordAndSelection(this.containerUuid)
|
|
}
|
|
return {
|
|
recordCount: 0,
|
|
isLoaded: false,
|
|
record: []
|
|
}
|
|
},
|
|
getterIsLoadedRecord() {
|
|
return this.getterDataStore.isLoaded
|
|
},
|
|
classCards() {
|
|
if (this.isMobile || this.fieldGroups.length < 2 || this.isShowedRecordNavigation) {
|
|
return 'cards-not-group'
|
|
}
|
|
return 'cards-in-group'
|
|
}
|
|
},
|
|
watch: {
|
|
// used only panel modal (process associated in browser or window)
|
|
containerUuid() {
|
|
if (['report', 'process'].includes(this.panelType)) {
|
|
this.generatePanel(this.metadata.fieldsList)
|
|
}
|
|
},
|
|
'$route.query.action'(newValue, oldValue) {
|
|
// used in field, if uuid record or different create-new, field is read only
|
|
this.uuidRecord = newValue
|
|
|
|
if (newValue !== oldValue && this.isPanelWindow) {
|
|
this.changePanelRecord(newValue)
|
|
}
|
|
},
|
|
isLoadPanel(value) {
|
|
if (value) {
|
|
this.readParameters()
|
|
}
|
|
}
|
|
},
|
|
created() {
|
|
// get fields with uuid
|
|
this.getPanel()
|
|
},
|
|
methods: {
|
|
/**
|
|
* Get the tab object with all its attributes as well as the fields it contains
|
|
*/
|
|
getPanel() {
|
|
const panel = this.getterPanel
|
|
if (!this.isEmptyValue(panel) && panel.fieldsList) {
|
|
this.panelMetadata = panel
|
|
const fieldsList = panel.fieldsList
|
|
if (fieldsList && Array.isArray(fieldsList)) {
|
|
this.generatePanel(fieldsList)
|
|
}
|
|
} else {
|
|
this.$store.dispatch('getPanelAndFields', {
|
|
parentUuid: this.parentUuid,
|
|
containerUuid: this.containerUuid,
|
|
panelType: this.panelType,
|
|
panelMetadata: this.metadata,
|
|
isAdvancedQuery: this.isAdvancedQuery
|
|
}).then(panelResponse => {
|
|
this.panelMetadata = panelResponse
|
|
this.generatePanel(panelResponse.fieldsList)
|
|
}).catch(error => {
|
|
console.warn(`Field Load Error: ${error.message}. Code: ${error.code}.`)
|
|
})
|
|
}
|
|
},
|
|
generatePanel(fieldsList) {
|
|
// order and assign groups
|
|
this.fieldsList = fieldsList
|
|
if (fieldsList.length) {
|
|
this.fieldGroups = this.sortAndGroup(fieldsList)
|
|
}
|
|
let firstGroup
|
|
if (this.fieldGroups[0] && this.fieldGroups[0].groupFinal === '') {
|
|
firstGroup = this.fieldGroups[0]
|
|
this.fieldGroups.shift()
|
|
}
|
|
this.firstGroup = firstGroup
|
|
|
|
this.isLoadPanel = true
|
|
},
|
|
/**
|
|
* TODO: Delete route parameters after reading them
|
|
*/
|
|
readParameters() {
|
|
const parameters = {
|
|
isLoadAllRecords: true,
|
|
isReference: false,
|
|
isNewRecord: false,
|
|
isWindow: true,
|
|
criteria: {}
|
|
}
|
|
const route = this.$route
|
|
if (this.isPanelWindow) {
|
|
// TODO: use action notifyPanelChange with isShowedField in true
|
|
this.getterFieldsList.forEach(fieldItem => {
|
|
const { columnName, componentPath, displayType, isAdvancedQuery, isMandatory } = fieldItem
|
|
if (Object.prototype.hasOwnProperty.call(route.query, columnName) && !isAdvancedQuery) {
|
|
fieldItem.isShowedFromUser = true
|
|
fieldItem.value = parsedValueComponent({
|
|
columnName,
|
|
componentPath,
|
|
displayType,
|
|
isMandatory,
|
|
value: route.query[columnName]
|
|
})
|
|
if (String(route.query.isAdvancedQuery) === String(isAdvancedQuery)) {
|
|
fieldItem.value = parsedValueComponent({
|
|
columnName,
|
|
componentPath,
|
|
displayType,
|
|
value: route.query[columnName]
|
|
})
|
|
if (fieldItem.isRange && this.$route.query[`${columnName}_To`]) {
|
|
fieldItem.valueTo = parsedValueComponent({
|
|
columnName,
|
|
componentPath,
|
|
displayType,
|
|
value: route.query[`${columnName}_To`]
|
|
})
|
|
}
|
|
}
|
|
}
|
|
})
|
|
|
|
if (route.query.action && route.query.action === 'reference') {
|
|
const referenceInfo = this.$store.getters.getReferencesInfo({
|
|
windowUuid: this.parentUuid,
|
|
recordUuid: route.query.recordUuid,
|
|
referenceUuid: route.query.referenceUuid
|
|
})
|
|
if (!this.isEmptyValue(referenceInfo)) {
|
|
parameters.referenceUuid = referenceInfo.uuid
|
|
parameters.referenceWhereClause = referenceInfo.whereClause
|
|
}
|
|
|
|
route.params.isReadParameters = true
|
|
parameters.isLoadAllRecords = false
|
|
parameters.isReference = true
|
|
} else if (route.query.action && route.query.action === 'create-new') {
|
|
parameters.isNewRecord = true
|
|
} else if (route.query.action && route.query.action === 'criteria') {
|
|
route.params.isReadParameters = true
|
|
Object.keys(route.params).forEach(param => {
|
|
if (!this.isEmptyValue(route.params[param])) {
|
|
parameters.criteria[param] = route.params[param]
|
|
}
|
|
})
|
|
} else if (route.query.action && route.query.action === 'listRecords') {
|
|
parameters.isLoadAllRecords = true
|
|
route.params.isReadParameters = true
|
|
} else if (!this.isEmptyValue(route.query.action) &&
|
|
!['create-new', 'reference', 'advancedQuery', 'criteria', 'listRecords'].includes(route.query.action)) {
|
|
parameters.isLoadAllRecords = false
|
|
parameters.value = route.query.action
|
|
parameters.tableName = this.metadata.tableName
|
|
parameters.columnName = 'UUID'
|
|
route.params.isReadParameters = true
|
|
}
|
|
// Only call get data if panel type is window
|
|
if (!Object.prototype.hasOwnProperty.call(route.params, 'isReadParameters') || route.params.isReadParameters) {
|
|
this.getData(parameters)
|
|
}
|
|
let viewTitle = ''
|
|
if (route.query && !this.isEmptyValue(route.query.action)) {
|
|
viewTitle = route.query.action
|
|
}
|
|
this.setTagsViewTitle(viewTitle)
|
|
} else {
|
|
if (this.panelType === 'table' && route.query.action === 'advancedQuery') {
|
|
// TODO: use action notifyPanelChange with isShowedField in true
|
|
this.fieldsList.forEach(fieldItem => {
|
|
const { columnName, componentPath, displayType, isAdvancedQuery } = fieldItem
|
|
|
|
if (Object.prototype.hasOwnProperty.call(route.query, columnName) && isAdvancedQuery) {
|
|
fieldItem.isShowedFromUser = true
|
|
|
|
if (route.query.action === 'advancedQuery' && isAdvancedQuery) {
|
|
this.dataRecords[columnName] = parsedValueComponent({
|
|
columnName,
|
|
componentPath,
|
|
displayType,
|
|
value: route.query[columnName]
|
|
})
|
|
if (fieldItem.isRange && route.query[`${columnName}_To`]) {
|
|
this.dataRecords[columnName] = parsedValueComponent({
|
|
columnName,
|
|
componentPath,
|
|
displayType,
|
|
value: route.query[`${columnName}_To`]
|
|
})
|
|
}
|
|
}
|
|
}
|
|
})
|
|
parameters.isWindow = false
|
|
this.$store.dispatch('notifyPanelChange', {
|
|
parentUuid: this.parentUuid,
|
|
containerUuid: this.containerUuid,
|
|
isAdvancedQuery: route.query.action === 'advancedQuery',
|
|
newValues: this.dataRecords,
|
|
isSendToServer: true,
|
|
isSendCallout: false,
|
|
fieldsList: this.fieldsList,
|
|
panelType: this.panelType
|
|
})
|
|
} else if (['process', 'browser'].includes(this.panelType)) {
|
|
if (!this.isEmptyValue(route.query)) {
|
|
this.$store.dispatch('notifyPanelChange', {
|
|
containerUuid: this.containerUuid,
|
|
newValues: route.query,
|
|
isShowedField: true,
|
|
isSendCallout: false,
|
|
panelType: this.panelType
|
|
})
|
|
parameters.isWindow = false
|
|
}
|
|
}
|
|
}
|
|
},
|
|
/**
|
|
* @param {object} parameters parameters to condition the data query
|
|
*/
|
|
getData(parameters) {
|
|
if (parameters.isWindow && this.isPanelWindow && !this.getterIsLoadedRecord) {
|
|
this.$store.dispatch('getDataListTab', {
|
|
parentUuid: this.parentUuid,
|
|
containerUuid: this.containerUuid,
|
|
isLoadAllRecords: parameters.isLoadAllRecords,
|
|
isReference: parameters.isReference,
|
|
referenceWhereClause: parameters.referenceWhereClause,
|
|
columnName: parameters.columnName,
|
|
value: parameters.value,
|
|
criteria: parameters.criteria
|
|
})
|
|
.then(response => {
|
|
let action = 'create-new'
|
|
let params = this.$route.params
|
|
if (response.length && !parameters.isNewRecord) {
|
|
this.dataRecords = response[0]
|
|
const recordId = this.dataRecords[`${this.metadata.tableName}_ID`]
|
|
params = {
|
|
...params,
|
|
tableName: this.metadata.tableName,
|
|
recordId
|
|
}
|
|
if (this.$route.query.action === 'reference') {
|
|
action = 'reference'
|
|
} else {
|
|
// 'criteria'
|
|
action = this.dataRecords.UUID
|
|
}
|
|
let viewTitle = ''
|
|
if (this.$route.query && !this.isEmptyValue(this.$route.query.action)) {
|
|
viewTitle = this.$route.query.action
|
|
}
|
|
this.setTagsViewTitle(viewTitle)
|
|
this.isLoadRecord = true
|
|
}
|
|
|
|
this.$router.push({
|
|
name: this.$route.name,
|
|
params,
|
|
query: {
|
|
...this.$route.query,
|
|
action
|
|
}
|
|
}, () => {})
|
|
|
|
if (action === 'create-new') {
|
|
this.$store.dispatch('setDefaultValues', {
|
|
panelType: this.panelType,
|
|
parentUuid: this.parentUuid,
|
|
containerUuid: this.containerUuid,
|
|
isNewRecord: true
|
|
})
|
|
} else {
|
|
const attributes = convertObjectToKeyValue({
|
|
object: this.dataRecords
|
|
})
|
|
this.$store.dispatch('notifyPanelChange', {
|
|
parentUuid: this.parentUuid,
|
|
containerUuid: this.containerUuid,
|
|
attributes
|
|
})
|
|
}
|
|
})
|
|
.catch(error => {
|
|
console.warn(`Error getting data list tab. Message: ${error.message}, code ${error.code}.`)
|
|
})
|
|
}
|
|
},
|
|
/**
|
|
* Group the arrangement into groups of columns that they contain, it must
|
|
* be grouped after having the order
|
|
* @param {array} fieldsList
|
|
* @return {array} groupsList
|
|
* TODO: Save into store to dont regenerate
|
|
*/
|
|
sortAndGroup(fieldsList) {
|
|
if (this.isEmptyValue(fieldsList)) {
|
|
return
|
|
}
|
|
let groupsList = [{
|
|
groupFinal: '',
|
|
metadataFields: fieldsList
|
|
}]
|
|
|
|
// reduce, create array with number groupAssigned element comun
|
|
if (this.isPanelWindow) {
|
|
groupsList = fieldsList
|
|
.reduce((groupsList, currentValue) => {
|
|
if (!groupsList.includes(currentValue.groupAssigned)) {
|
|
groupsList.push(currentValue.groupAssigned)
|
|
}
|
|
return groupsList
|
|
}, [])
|
|
.map(itemGroup => {
|
|
return {
|
|
groupFinal: itemGroup,
|
|
metadataFields: fieldsList.filter(itemField => {
|
|
return itemField.groupAssigned === itemGroup
|
|
})
|
|
}
|
|
})
|
|
}
|
|
|
|
// count and add the field numbers according to your group
|
|
groupsList.forEach(groupFields => {
|
|
const typeG = groupFields.metadataFields[0].typeGroupAssigned
|
|
groupFields.typeGroup = typeG
|
|
|
|
const fieldsDisplayed = groupFields.metadataFields.filter(field => {
|
|
return fieldIsDisplayed(field)
|
|
})
|
|
|
|
if ((this.groupTab.groupType === 'T' && this.groupTab.groupName === groupFields.groupFinal) ||
|
|
(this.groupTab.groupType !== 'T' && groupFields.typeGroup !== 'T')) {
|
|
this.groupsView = this.groupsView + 1
|
|
}
|
|
groupFields.activeFields = fieldsDisplayed.length
|
|
})
|
|
|
|
return groupsList
|
|
},
|
|
/**
|
|
* Set title in tag view
|
|
* @param {string} actionValue
|
|
*/
|
|
setTagsViewTitle(actionValue) {
|
|
if (actionValue !== 'create-new' && !this.isEmptyValue(actionValue) && this.panelMetadata.isDocument && this.getterDataStore.isLoaded) {
|
|
this.$store.dispatch('listWorkflows', this.metadata.tableName)
|
|
this.$store.dispatch('listDocumentStatus', {
|
|
recordUuid: this.$route.query.action,
|
|
tableName: this.metadata.tableName
|
|
})
|
|
}
|
|
if (actionValue === 'create-new' || this.isEmptyValue(actionValue)) {
|
|
this.tagTitle.action = this.$t('tagsView.newRecord')
|
|
} else if (actionValue === 'advancedQuery') {
|
|
this.tagTitle.action = this.$t('tagsView.advancedQuery')
|
|
} else {
|
|
const { identifierColumns } = this.panelMetadata
|
|
if (!this.isEmptyValue(identifierColumns)) {
|
|
const keyName = identifierColumns[0].columnName
|
|
if (this.dataRecords[keyName]) {
|
|
this.tagTitle.action = this.dataRecords[keyName]
|
|
} else {
|
|
const field = this.fieldsList.find(fieldItem => fieldItem.isIdentifier)
|
|
const value = this.$store.getters.getValueOfField({
|
|
parentUuid: this.parentUuid,
|
|
containerUuid: this.containerUuid,
|
|
columnName: field.columnName
|
|
})
|
|
this.tagTitle.action = value
|
|
}
|
|
} else {
|
|
this.tagTitle.action = this.$t('tagsView.seeRecord')
|
|
}
|
|
}
|
|
if (this.isPanelWindow) {
|
|
this.$store.dispatch('tagsView/updateVisitedView', {
|
|
...this.$route,
|
|
title: `${this.tagTitle.base} - ${this.tagTitle.action}`
|
|
})
|
|
}
|
|
},
|
|
changePanelRecord(uuidRecord) {
|
|
if (!['create-new', 'reference', 'advancedQuery', 'criteria', 'listRecords'].includes(uuidRecord)) {
|
|
this.$store.dispatch('seekRecord', {
|
|
parentUuid: this.parentUuid,
|
|
containerUuid: this.containerUuid,
|
|
recordUuid: uuidRecord
|
|
}).then(() => {
|
|
if (this.panelMetadata.isTabsChildren) {
|
|
// delete records tabs children when change record uuid
|
|
this.$store.dispatch('deleteRecordContainer', {
|
|
viewUuid: this.parentUuid,
|
|
withOut: [this.containerUuid]
|
|
})
|
|
}
|
|
})
|
|
}
|
|
|
|
const currentRecord = this.getterDataStore.record.find(record => record.UUID === uuidRecord) || {}
|
|
this.dataRecords = currentRecord
|
|
this.$store.commit('setCurrentRecord', currentRecord)
|
|
|
|
this.setTagsViewTitle(uuidRecord)
|
|
if (this.$route.query && this.$route.query.action === 'create-new') {
|
|
this.setFocus()
|
|
}
|
|
},
|
|
async setFocus() {
|
|
return new Promise(resolve => {
|
|
const fieldFocus = this.getterFieldsList.find(itemField => {
|
|
if (itemField.handleRequestFocus) {
|
|
return true
|
|
}
|
|
if (Object.prototype.hasOwnProperty.call(this.$refs, itemField.columnName)) {
|
|
if (fieldIsDisplayed(itemField) &&
|
|
!(itemField.isReadOnly ||
|
|
// records in columns manage by backend
|
|
LOG_COLUMNS_NAME_LIST.includes(itemField.columnName)) &&
|
|
itemField.isUpdateable &&
|
|
itemField.componentPath !== 'FieldSelect') {
|
|
return true
|
|
}
|
|
}
|
|
})
|
|
if (fieldFocus) {
|
|
this.$refs[fieldFocus.columnName][0].focusField()
|
|
}
|
|
resolve()
|
|
return
|
|
})
|
|
}
|
|
}
|
|
}
|