Et2Select: Fix link search lost selected item, showing ?? instead

This commit is contained in:
nathan 2023-10-02 13:11:48 -06:00
parent 795160301b
commit 72112023e8
2 changed files with 26 additions and 25 deletions

View File

@ -713,6 +713,7 @@ export class Et2Select extends Et2WithSearchMixin(Et2WidgetWithSelect)
// Tag used must match this.optionTag, but you can't use the variable directly. // Tag used must match this.optionTag, but you can't use the variable directly.
// Pass option along so SearchMixin can grab it if needed // Pass option along so SearchMixin can grab it if needed
const value = (<string>option.value).replaceAll(" ", "___"); const value = (<string>option.value).replaceAll(" ", "___");
const classes = option.class ? Object.fromEntries((option.class).split(" ").map(k => [k, true])) : {};
return html` return html`
<sl-option <sl-option
part="option" part="option"
@ -720,9 +721,9 @@ export class Et2Select extends Et2WithSearchMixin(Et2WidgetWithSelect)
value="${value}" value="${value}"
title="${!option.title || this.noLang ? option.title : this.egw().lang(option.title)}" title="${!option.title || this.noLang ? option.title : this.egw().lang(option.title)}"
class=${classMap({ class=${classMap({
"match": this.searchEnabled && option.isMatch, "match": this.searchEnabled && (option.isMatch || false),
"no-match": this.searchEnabled && !option.isMatch, "no-match": this.searchEnabled && !(option.isMatch || false),
...Object.fromEntries((option.class || "").split(" ").map(k => [k, true])) ...classes
})} })}
.option=${option} .option=${option}
.selected=${this.getValueAsArray().some(v => v == value)} .selected=${this.getValueAsArray().some(v => v == value)}

View File

@ -804,21 +804,7 @@ export const Et2WithSearchMixin = dedupeMixin(<T extends Constructor<LitElement>
// Find and keep any selected remote entries // Find and keep any selected remote entries
// Doing it here catches keypress changes too // Doing it here catches keypress changes too
this.select.querySelectorAll("[aria-selected=true].remote").forEach((node) => this._keepSelectedRemote();
{
const value = node.value.replaceAll("___", " ");
if(!node.selected || this._selected_remote.some(o => o.value == value))
{
return;
}
const remote_option_index = this._remote_options.findIndex(o => o.value == value);
if(remote_option_index >= 0)
{
console.log("Keeping " + value, this._remote_options[remote_option_index]);
this._selected_remote.push(node.option);
this._remote_options.splice(remote_option_index, 1);
}
});
return true; return true;
} }
@ -845,13 +831,31 @@ export const Et2WithSearchMixin = dedupeMixin(<T extends Constructor<LitElement>
// Find the tag // Find the tag
const path = event.composedPath(); const path = event.composedPath();
const tag = <Et2Tag>path.find((el) => el instanceof Et2Tag); const tag = <Et2Tag>path.find((el) => el instanceof Et2Tag);
this.dropdown.hide(); this.hide();
this.updateComplete.then(() => this.updateComplete.then(() =>
{ {
tag.startEdit(event); tag.startEdit(event);
}); });
} }
_keepSelectedRemote()
{
this.select.querySelectorAll("[aria-selected=true].remote").forEach((node) =>
{
const value = node.value.replaceAll("___", " ");
if(!node.selected || this._selected_remote.some(o => o.value == value))
{
return;
}
const remote_option_index = this._remote_options.findIndex(o => o.value == value);
if(remote_option_index >= 0)
{
console.log("Keeping " + value, this._remote_options[remote_option_index]);
this._selected_remote.push(node.option);
this._remote_options.splice(remote_option_index, 1);
}
});
}
/** /**
* An option was selected * An option was selected
*/ */
@ -1097,11 +1101,7 @@ export const Et2WithSearchMixin = dedupeMixin(<T extends Constructor<LitElement>
{ {
let target = this._optionTargetNode || this; let target = this._optionTargetNode || this;
// Remove any previously selected remote options that aren't used anymore this._keepSelectedRemote();
this._selected_remote = this._selected_remote.filter((option) =>
{
return this.multiple ? this.value.indexOf(<string>option.value) != -1 : this.value == option.value;
});
this._remote_options = []; this._remote_options = [];