diff --git a/src/components/ADempiere/Field/FieldDate.vue b/src/components/ADempiere/Field/FieldDate.vue index f7771131..f9c390d3 100644 --- a/src/components/ADempiere/Field/FieldDate.vue +++ b/src/components/ADempiere/Field/FieldDate.vue @@ -15,6 +15,10 @@ :disabled="isDisabled" :picker-options="pickerOptions" @change="preHandleChange" + @blur="focusLost" + @focus="focusGained" + @keydown.native="keyPressed" + @keyup.native="keyReleased" /> diff --git a/src/components/ADempiere/Field/FieldMixin.js b/src/components/ADempiere/Field/FieldMixin.js index fea5960e..260a7242 100644 --- a/src/components/ADempiere/Field/FieldMixin.js +++ b/src/components/ADempiere/Field/FieldMixin.js @@ -22,19 +22,6 @@ export const fieldMixin = { } }, computed: { - /* - getterValue() { - const field = this.$store.getters.getFieldFromColumnName({ - containerUuid: this.metadata.containerUuid, - columnName: this.metadata.columnName, - isAdvancedQuery: this.metadata.isAdvancedQuery - }) - if (field) { - return field.value - } - return undefined - }, - */ isDisabled() { return Boolean(this.metadata.readonly || this.metadata.disabled) } @@ -61,6 +48,36 @@ export const fieldMixin = { preHandleChange(value) { this.handleChange(value) }, + focusGained(value) { + this.$store.dispatch('notifyFocusGained', { + containerUuid: this.metadata.containerUuid, + columnName: this.metadata.columnName, + value: this.value + }) + }, + focusLost(value) { + this.$store.dispatch('notifyFocusLost', { + containerUuid: this.metadata.containerUuid, + columnName: this.metadata.columnName, + value: this.value + }) + }, + keyPressed(value) { + this.$store.dispatch('notifyKeyPressed', { + containerUuid: this.metadata.containerUuid, + columnName: this.metadata.columnName, + value: value.key, + keyCode: value.keyCode + }) + }, + keyReleased(value) { + this.$store.dispatch('notifyKeyReleased', { + containerUuid: this.metadata.containerUuid, + columnName: this.metadata.columnName, + value: value.key, + keyCode: value.keyCode + }) + }, /** * @param {mixed} value, main value in component * @param {mixed} valueTo, used in end value in range @@ -97,7 +114,12 @@ export const fieldMixin = { isSendCallout, isChangedOldValue } - + // Global Action performed + this.$store.dispatch('notifyActionPerformed', { + containerUuid: this.metadata.containerUuid, + columnName: this.metadata.columnName, + value: newValue + }) if (this.metadata.inTable) { this.$store.dispatch('notifyCellTableChange', { ...sendParameters, diff --git a/src/components/ADempiere/Field/FieldNumber.vue b/src/components/ADempiere/Field/FieldNumber.vue index 946719d0..eb1305f6 100644 --- a/src/components/ADempiere/Field/FieldNumber.vue +++ b/src/components/ADempiere/Field/FieldNumber.vue @@ -12,9 +12,10 @@ controls-position="right" :class="'display-type-amount ' + metadata.cssClassName" @change="preHandleChange" - @blur="changeValue" - @keydown.native="calculateValue" - @keyup.enter.native="changeValue" + @blur="focusLost" + @focus="focusGained" + @keydown.native="keyPressed" + @keyup.native="keyReleased" /> diff --git a/src/components/ADempiere/Field/FieldText.vue b/src/components/ADempiere/Field/FieldText.vue index a1df6911..333c174f 100644 --- a/src/components/ADempiere/Field/FieldText.vue +++ b/src/components/ADempiere/Field/FieldText.vue @@ -13,6 +13,10 @@ :show-password="Boolean(metadata.isEncrypted)" :autofocus="metadata.inTable" @change="preHandleChange" + @blur="focusLost" + @focus="focusGained" + @keydown.native="keyPressed" + @keyup.native="keyReleased" /> diff --git a/src/components/ADempiere/Field/FieldTime.vue b/src/components/ADempiere/Field/FieldTime.vue index 39a37c96..e65cf271 100644 --- a/src/components/ADempiere/Field/FieldTime.vue +++ b/src/components/ADempiere/Field/FieldTime.vue @@ -13,6 +13,10 @@ :readonly="Boolean(metadata.readonly)" :disabled="isDisabled" @change="preHandleChange" + @blur="focusLost" + @focus="focusGained" + @keydown.native="keyPressed" + @keyup.native="keyReleased" /> diff --git a/src/components/ADempiere/Field/FieldYesNo.vue b/src/components/ADempiere/Field/FieldYesNo.vue index a3d076b4..8c884c5b 100644 --- a/src/components/ADempiere/Field/FieldYesNo.vue +++ b/src/components/ADempiere/Field/FieldYesNo.vue @@ -9,6 +9,8 @@ :false-value="false" :disabled="isDisabled" @change="preHandleChange" + @blur="focusLost" + @focus="focusGained" /> diff --git a/src/store/modules/ADempiere/event.js b/src/store/modules/ADempiere/event.js new file mode 100644 index 00000000..af97c6d4 --- /dev/null +++ b/src/store/modules/ADempiere/event.js @@ -0,0 +1,103 @@ +// This store is used for catch all fieldEvents related to fieldEvents, note that the unique search based +// on columnName and containerUuid. All fieldEvents for fieldEvents (when apply for dispatch fieldEvents) are logged here +// and the used can implenment a suscription for get values from field. +// Please use it for add custom behavios for fieldEvents on forms and other components customized from user + +// Note that it need a structure with mandatory values: +// { +// containerUuid: Container UUID used as container of fields to listen, +// columnName: Column Name or unique value, it is a index with container, +// value: new value for event, +// keyCode: optional for key events +// } +// Generic Action +export const ACTION_PERFORMED = 1 +export const FOCUS_GAINED = 2 +export const FOCUS_LOST = 3 +// Input actions +export const KEY_PRESSED = 4 +export const KEY_RELEASED = 5 +const event = { + state: { + fieldEvents: [], + actionEvents: [] + }, + mutations: { + addChange(state, change) { + state.fieldEvents.push(change) + }, + addAction(state, action) { + state.actionEvents.push(action) + }, + resetStateLookup(state) { + state = { + fieldEvents: [], + actionEvents: [] + } + } + }, + actions: { + notifyActionPerformed({ commit }, event) { + commit('addChange', { + containerUuid: event.containerUuid, + columnName: event.columnName, + value: event.value, + eventType: ACTION_PERFORMED + }) + }, + notifyKeyPressed({ commit }, event) { + commit('addChange', { + containerUuid: event.containerUuid, + columnName: event.columnName, + value: event.value, + keyCode: event.keyCode, + eventType: KEY_PRESSED + }) + }, + notifyKeyReleased({ commit }, event) { + commit('addChange', { + containerUuid: event.containerUuid, + columnName: event.columnName, + value: event.value, + keyCode: event.keyCode, + eventType: KEY_RELEASED + }) + }, + notifyFocusGained({ commit }, event) { + commit('addChange', { + containerUuid: event.containerUuid, + columnName: event.columnName, + value: event.value, + eventType: FOCUS_GAINED + }) + }, + notifyFocusLost({ commit }, event) { + commit('addChange', { + containerUuid: event.containerUuid, + columnName: event.columnName, + value: event.value, + eventType: FOCUS_LOST + }) + }, + notifyRunAction({ commit }, action) { + commit('addAction', { + containerUuid: action.containerUuid, + action: action.action, + paremeters: action.parameters + }) + } + }, + getters: { + getFieldEventList: (state) => (containerUuid) => { + return state.fieldEvents.find(event => { + return event.containerUuid === containerUuid + }) + }, + getActionEventList: (state) => (containerUuid) => { + return state.actionEvents.find(action => { + return action.containerUuid === containerUuid + }) + } + } +} +export default event diff --git a/src/store/modules/ADempiere/panel.js b/src/store/modules/ADempiere/panel.js index 3beed19e..c7a9ebab 100644 --- a/src/store/modules/ADempiere/panel.js +++ b/src/store/modules/ADempiere/panel.js @@ -552,10 +552,18 @@ const panel = { * @param {array} withOutColumnNames */ notifyFieldChange({ commit, dispatch, getters }, { - parentUuid, containerUuid, panelType = 'window', isAdvancedQuery = false, - columnName, newValue, valueTo, displayColumn, - isSendToServer = true, isSendCallout = true, - isChangedOldValue = false, withOutColumnNames = [], + parentUuid, + containerUuid, + panelType = 'window', + isAdvancedQuery = false, + columnName, + newValue, + valueTo, + displayColumn, + isSendToServer = true, + isSendCallout = true, + isChangedOldValue = false, + withOutColumnNames = [], isChangeMultipleFields = false }) { return new Promise(async resolve => {