ui autocomplete changes

This commit is contained in:
Yuri Kuznetsov
2024-02-14 21:32:43 +02:00
parent e1e7d3d093
commit 1456569cf6
6 changed files with 53 additions and 72 deletions
+12 -7
View File
@@ -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<module:ui/autocomplete~item[]>,
* 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(''));
}
});
}
@@ -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) + ' &#60;' +
this.getHelper().escapeString(item.id) + '&#62;';
},
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);
});
},
});
@@ -73,8 +73,8 @@ class EmailEmailAddressFieldView extends BaseFieldView {
return this.getHelper().escapeString(item.name) + ' &#60;' +
this.getHelper().escapeString(item.id) + '&#62;';
},
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;
});
},
});
+4 -6
View File
@@ -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) + ' &#60;' +
this.getHelper().escapeString(item.id) + '&#62;';
},
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);
});
},
});
+27 -46
View File
@@ -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 => {
+3 -4
View File
@@ -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,
});