diff --git a/client/src/ui/autocomplete.js b/client/src/ui/autocomplete.js index a1b508ac30..66a282e653 100644 --- a/client/src/ui/autocomplete.js +++ b/client/src/ui/autocomplete.js @@ -40,17 +40,17 @@ class Autocomplete { /** * @typedef {{ - * name: string, + * name?: string, * forceHide?: boolean, * lookup?: string[], - * lookupFunction?: function (string, function (module:ui/autocomplete~item[])): void, + * lookupFunction?: function (string): Promise, * minChars?: Number, * formatResult?: function (module:ui/autocomplete~item): string, * onSelect?: function (module:ui/autocomplete~item): void, * beforeRender?: function (HTMLElement): void, * triggerSelectOnValidInput?: boolean, * autoSelectFirst?: boolean, - * handleFocusMode?: 1|2, + * handleFocusMode?: 1|2|3, * focusOnSelect?: boolean, * }} module:ui/autocomplete~options */ @@ -64,9 +64,10 @@ class Autocomplete { const lookup = options.lookupFunction ? (query, done) => { - options.lookupFunction(query, items => { - done({suggestions: items}); - }); + options.lookupFunction(query) + .then(items => { + done({suggestions: items}) + }); } : options.lookup; @@ -122,7 +123,7 @@ class Autocomplete { triggerSelectOnValidInput: options.triggerSelectOnValidInput, }); - this.$element.attr('autocomplete', 'espo-' + options.name); + this.$element.attr('autocomplete', 'espo-' + (options.name || 'dummy')); if (options.handleFocusMode) { this.initHandleFocus(options); @@ -155,6 +156,10 @@ class Autocomplete { } this.$element.autocomplete('onFocus'); + + if (options.handleFocusMode === 3) { + this.$element.on('change', () => this.$element.val('')); + } }); } diff --git a/client/src/views/email/fields/email-address-varchar.js b/client/src/views/email/fields/email-address-varchar.js index 7ad6c5ce3a..e2a4fa7fa9 100644 --- a/client/src/views/email/fields/email-address-varchar.js +++ b/client/src/views/email/fields/email-address-varchar.js @@ -336,7 +336,7 @@ class EmailAddressVarcharFieldView extends BaseFieldView { const autocomplete = new Autocomplete(this.$input.get(0), { name: this.name, autoSelectFirst: true, - triggerSelectOnValidInput: true, + triggerSelectOnValidInput: false, focusOnSelect: true, minChars: 1, forceHide: true, @@ -354,15 +354,15 @@ class EmailAddressVarcharFieldView extends BaseFieldView { return this.getHelper().escapeString(item.name) + ' <' + this.getHelper().escapeString(item.id) + '>'; }, - lookupFunction: (query, done) => { - Espo.Ajax + lookupFunction: query => { + return Espo.Ajax .getRequest('EmailAddress/search', { q: query, maxSize: this.getAutocompleteMaxCount(), onlyActual: true, }) .then(/** Record[] */response => { - const result = response.map(item => { + return response.map(item => { return { id: item.emailAddress, name: item.entityName, @@ -374,8 +374,6 @@ class EmailAddressVarcharFieldView extends BaseFieldView { value: item.emailAddress, }; }); - - done(result); }); }, }); diff --git a/client/src/views/email/fields/email-address.js b/client/src/views/email/fields/email-address.js index 6028ea2404..1098a2a4bf 100644 --- a/client/src/views/email/fields/email-address.js +++ b/client/src/views/email/fields/email-address.js @@ -73,8 +73,8 @@ class EmailEmailAddressFieldView extends BaseFieldView { return this.getHelper().escapeString(item.name) + ' <' + this.getHelper().escapeString(item.id) + '>'; }, - lookupFunction: (query, done) => { - Espo.Ajax + lookupFunction: query => { + return Espo.Ajax .getRequest('EmailAddress/search', { q: query, maxSize: this.getAutocompleteMaxCount(), @@ -99,7 +99,7 @@ class EmailEmailAddressFieldView extends BaseFieldView { result = result.filter(item => item.emailAddress !== current) } - done(result); + return result; }); }, }); diff --git a/client/src/views/fields/email.js b/client/src/views/fields/email.js index 512edf0d0e..36bc3f4c60 100644 --- a/client/src/views/fields/email.js +++ b/client/src/views/fields/email.js @@ -363,7 +363,7 @@ class EmailFieldView extends VarcharFieldView { focusOnSelect: true, minChars: 1, forceHide: true, - handleFocusMode: 2, + handleFocusMode: 1, onSelect: item => { this.$element.val(item.emailAddress); }, @@ -371,14 +371,14 @@ class EmailFieldView extends VarcharFieldView { return this.getHelper().escapeString(item.name) + ' <' + this.getHelper().escapeString(item.id) + '>'; }, - lookupFunction: (query, done) => { - Espo.Ajax + lookupFunction: query => { + return Espo.Ajax .getRequest('EmailAddress/search', { q: query, maxSize: this.getAutocompleteMaxCount(), }) .then(/** Record[] */response => { - const result = response.map(item => { + return response.map(item => { return { id: item.emailAddress, name: item.entityName, @@ -390,8 +390,6 @@ class EmailFieldView extends VarcharFieldView { value: item.emailAddress, }; }); - - done(result); }); }, }); diff --git a/client/src/views/fields/user.js b/client/src/views/fields/user.js index b9c587ead8..e4564eddcf 100644 --- a/client/src/views/fields/user.js +++ b/client/src/views/fields/user.js @@ -27,6 +27,7 @@ ************************************************************************/ import LinkFieldView from 'views/fields/link'; +import Autocomplete from 'ui/autocomplete'; class UserFieldView extends LinkFieldView { @@ -98,60 +99,40 @@ class UserFieldView extends LinkFieldView { super.afterRender(); if (this.mode === this.MODE_SEARCH) { - let $elementTeams = this.$el.find('input.element-teams'); + const $elementTeams = this.$el.find('input.element-teams'); - - $elementTeams.autocomplete({ - beforeRender: $c => { - if (this.$elementName.hasClass('input-sm')) { - $c.addClass('small'); - } - }, - serviceUrl: () => { - return 'Team?&maxSize=' + this.getAutocompleteMaxCount() + '&select=id,name'; - }, + const autocomplete = new Autocomplete($elementTeams.get(0), { minChars: 1, - triggerSelectOnValidInput: false, - paramName: 'q', - noCache: true, - formatResult: suggestion => { - // noinspection JSUnresolvedReference - return this.getHelper().escapeString(suggestion.name); - }, - transformResult: response => { - response = JSON.parse(response); - let list = []; - - response.list.forEach(item => { - list.push({ - id: item.id, - name: item.name, - data: item.id, - value: item.name, - }); - }); - - return {suggestions: list}; - }, - onSelect: /** {id: string, name: string } */s => { - this.addLinkTeams(s.id, s.name); + focusOnSelect: true, + handleFocusMode: 3, + autoSelectFirst: true, + forceHide: true, + onSelect: item => { + this.addLinkTeams(item.id, item.name); $elementTeams.val(''); - $elementTeams.focus(); + }, + lookupFunction: query => { + return Espo.Ajax + .getRequest('Team', { + maxSize: this.getAutocompleteMaxCount(), + select: 'id,name', + q: query, + }) + .then(/** {list: Record[]} */response => { + return response.list.map(item => ({ + id: item.id, + name: item.name, + data: item.id, + value: item.name, + })); + }); }, }); - $elementTeams.attr('autocomplete', 'espo-' + this.name); + this.once('render remove', () => autocomplete.dispose()); - this.once('render', () => { - $elementTeams.autocomplete('dispose'); - }); - - this.once('remove', () => { - $elementTeams.autocomplete('dispose'); - }); - - let type = this.$el.find('select.search-type').val(); + const type = this.$el.find('select.search-type').val(); if (type === 'isFromTeams') { this.searchData.teamIdList.forEach(id => { diff --git a/client/src/views/fields/varchar.js b/client/src/views/fields/varchar.js index 4111cebead..e4fdad7441 100644 --- a/client/src/views/fields/varchar.js +++ b/client/src/views/fields/varchar.js @@ -291,10 +291,9 @@ class VarcharFieldView extends BaseFieldView { onSelect: () => this.trigger('change'), lookup: this.params.options, lookupFunction: this.useAutocompleteUrl ? - (query, done) => { - Espo.Ajax.getRequest(this.getAutocompleteUrl(query)) - .then(response => this.transformAutocompleteResult(response)) - .then(result => done(result)); + query => { + return Espo.Ajax.getRequest(this.getAutocompleteUrl(query)) + .then(response => this.transformAutocompleteResult(response)); } : undefined, });