extern/egroupware_official
1
0
Fork 0
mirror of https://github.com/EGroupware/egroupware.git synced 2025-01-20 12:58:46 +01:00
Code Issues Packages Projects Releases Wiki Activity

Work on Search/LinkEntry

Browse Source 
- Fix events were messed up after search
This commit is contained in:
nathan 2022-06-02 15:44:13 -06:00
parent 22e178ff9a
commit f07aacaeaf
2 changed files with 20 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
api/js/etemplate/Et2Select/FindSelectOptions.ts
View File

@ -1,12 +1,3 @@
/**
* EGroupware eTemplate2 - Find select options
*
* @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
* @package api
* @link https://www.egroupware.org
* @author Nathan Gray
*/
export interface SelectOption export interface SelectOption
{ {
value : string; value : string;
@ -163,6 +154,7 @@ export function find_select_options(widget, attr_options?, options : SelectOptio
// Include passed options, preferring any content options // Include passed options, preferring any content options
if(options.length || Object.keys(options).length > 0) if(options.length || Object.keys(options).length > 0)
{ {
content_options = cleanSelectOptions(content_options);
for(let i in content_options) for(let i in content_options)
{ {
let value = typeof content_options[i] == 'object' && typeof content_options[i].value !== 'undefined' ? content_options[i].value : i; let value = typeof content_options[i] == 'object' && typeof content_options[i].value !== 'undefined' ? content_options[i].value : i;

21
api/js/etemplate/Et2Select/SearchMixin.ts
View File

@ -113,6 +113,10 @@ export const Et2WithSearchMixin = dedupeMixin((superclass) =>
::slotted([name="search_input"]:focus ){ ::slotted([name="search_input"]:focus ){
width: 100%; width: 100%;
} }
:host([search]) .select--open .select__prefix {
flex: 2 1 auto;
width: 100%;
}
.select__prefix ::slotted(.search_input) { .select__prefix ::slotted(.search_input) {
display: none; display: none;
margin-left: 0px; margin-left: 0px;
@ -149,8 +153,10 @@ export const Et2WithSearchMixin = dedupeMixin((superclass) =>
{ {
super.connectedCallback(); super.connectedCallback();
this.classList.toggle("search", this.searchEnabled);
// Missing any of the required attributes? Don't change anything. // Missing any of the required attributes? Don't change anything.
if(!this.search && !this.searchUrl && !this.allowFreeEntries) if(!this.searchEnabled)
{ {
return; return;
} }
@ -183,8 +189,9 @@ export const Et2WithSearchMixin = dedupeMixin((superclass) =>
protected _searchInputTemplate() protected _searchInputTemplate()
{ {
// I can't figure out how to get this full width via CSS
return html` return html`
<input type="text" @keydown=${this._handleSearchKeyDown}/> <input type="text" part="input" style="width:100%" @keydown=${this._handleSearchKeyDown}/>
`; `;
} }
@ -242,12 +249,21 @@ export const Et2WithSearchMixin = dedupeMixin((superclass) =>
protected _bindListeners() protected _bindListeners()
{ {
this.addEventListener("sl-blur", this._handleSearchAbort); this.addEventListener("sl-blur", this._handleSearchAbort);
if(this._oldChange)
{
// Search messes up event order somehow, selecting an option fires the change event before
// the widget is finished adjusting, losing the value
// This is not optimal, but we need to get that change event
this.removeEventListener("change", this._oldChange);
}
this._searchButtonNode.addEventListener("click", this._handleSearchButtonClick); this._searchButtonNode.addEventListener("click", this._handleSearchButtonClick);
} }
protected _unbindListeners() protected _unbindListeners()
{ {
this.removeEventListener("sl-blur", this._handleSearchAbort); this.removeEventListener("sl-blur", this._handleSearchAbort);
this.removeEventListener("change", this._handleChange);
this._searchButtonNode.removeEventListener("click", this._handleSearchButtonClick); this._searchButtonNode.removeEventListener("click", this._handleSearchButtonClick);
} }
@ -461,6 +477,7 @@ export const Et2WithSearchMixin = dedupeMixin((superclass) =>
item.classList.remove("match"); item.classList.remove("match");
item.classList.remove("no-match"); item.classList.remove("no-match");
}) })
this.syncItemsFromValue();
} }
} }