Calendar: Fix sidebox owner could not select options

This commit is contained in:
nathan 2023-10-02 16:06:25 -06:00
parent 72112023e8
commit efe0eff776
3 changed files with 8 additions and 22 deletions

View File

@ -195,7 +195,7 @@ export const Et2WithSearchMixin = dedupeMixin(<T extends Constructor<LitElement>
/* Hide options that do not match current search text */ /* Hide options that do not match current search text */
.no-match { [searching] .no-match {
display: none; display: none;
} }
/* Different cursor for editable tags */ /* Different cursor for editable tags */
@ -1043,6 +1043,8 @@ export const Et2WithSearchMixin = dedupeMixin(<T extends Constructor<LitElement>
// Stop timeout timer // Stop timeout timer
clearTimeout(this._searchTimeout); clearTimeout(this._searchTimeout);
this.setAttribute("searching", "");
// Show a spinner // Show a spinner
let spinner = document.createElement("sl-spinner"); let spinner = document.createElement("sl-spinner");
spinner.slot = "expand-icon"; spinner.slot = "expand-icon";
@ -1066,6 +1068,7 @@ export const Et2WithSearchMixin = dedupeMixin(<T extends Constructor<LitElement>
this.remoteSearch(this._searchInputNode.value, this.searchOptions) this.remoteSearch(this._searchInputNode.value, this.searchOptions)
]).then(async() => ]).then(async() =>
{ {
this.removeAttribute("searching");
// Remove spinner // Remove spinner
spinner.remove(); spinner.remove();
@ -1102,7 +1105,7 @@ export const Et2WithSearchMixin = dedupeMixin(<T extends Constructor<LitElement>
let target = this._optionTargetNode || this; let target = this._optionTargetNode || this;
this._keepSelectedRemote(); this._keepSelectedRemote();
this._remote_options = []; this._remote_options = [];
// Not searching anymore, clear flag // Not searching anymore, clear flag

View File

@ -64,9 +64,8 @@ export class CalendarOwner extends Et2StaticSelectMixin(Et2Select)
return html``; return html``;
} }
// Tag used must match this.optionTag, but you can't use the variable directly.
// 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"
@ -76,7 +75,7 @@ export class CalendarOwner extends Et2StaticSelectMixin(Et2Select)
class=${classMap({ class=${classMap({
"match": option.isMatch, "match": option.isMatch,
"no-match": !option.isMatch, "no-match": !option.isMatch,
...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)}
@ -88,22 +87,6 @@ export class CalendarOwner extends Et2StaticSelectMixin(Et2Select)
</sl-option>`; </sl-option>`;
} }
/**
* Customise how tags are rendered. Overridden from parent to add email to title for hover
*
* @param item
* @protected
*/
protected _createTagNode(item)
{
const tag = super._createTagNode(item);
if(item.title)
{
tag.title = item.title;
}
return tag;
}
/** /**
* Override parent to handle our special additional data types (c#,r#,etc.) when they * Override parent to handle our special additional data types (c#,r#,etc.) when they
* are not available client side. * are not available client side.

View File

@ -21,7 +21,7 @@ Egroupware
<et2-select-cat id="cat_id" placeholder="All categories" onchange="app.calendar.update_state({cat_id: widget.getValue()});" emptyLabel="All categories" multiple="true"></et2-select-cat> <et2-select-cat id="cat_id" placeholder="All categories" onchange="app.calendar.update_state({cat_id: widget.getValue()});" emptyLabel="All categories" multiple="true"></et2-select-cat>
<et2-select id="status_filter" onchange="app.calendar.update_state({status_filter: widget.getValue()});" noLang="true"></et2-select> <et2-select id="status_filter" onchange="app.calendar.update_state({status_filter: widget.getValue()});" noLang="true"></et2-select>
<hrule/> <hrule/>
<et2-calendar-owner id="owner" onchange="app.calendar.update_state({owner: widget.getValue()}); return false;" multiple="true" allowFreeEntries="false" autocompleteParams="{&quot;checkgrants&quot;: true}"/> <et2-calendar-owner id="owner" onchange="app.calendar.update_state({owner: widget.getValue()}); return false;" multiple="true" allowFreeEntries="false" tabindex="0"/>
<hrule/> <hrule/>
<et2-box> <et2-box>
<grid id="integration" disabled="!@integration" width="100%"> <grid id="integration" disabled="!@integration" width="100%">