mirror of
https://github.com/EGroupware/egroupware.git
synced 2024-11-25 01:13:25 +01:00
Finish Et2Email widget
This commit is contained in:
parent
5df34bce91
commit
437ad34300
@ -18,6 +18,7 @@ export default css`
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
gap: 0.1rem 0.5rem;
|
||||
|
||||
background-color: var(--sl-input-background-color);
|
||||
@ -55,6 +56,7 @@ export default css`
|
||||
/* Tags */
|
||||
.email et2-email-tag {
|
||||
order: 2;
|
||||
flex-grow: 0;
|
||||
margin: auto 0px;
|
||||
--icon-width: 1.8em;
|
||||
|
||||
@ -62,7 +64,6 @@ export default css`
|
||||
}
|
||||
|
||||
/* Search box */
|
||||
|
||||
.email__search {
|
||||
flex: 1 1 auto;
|
||||
order: 10;
|
||||
@ -76,9 +77,13 @@ export default css`
|
||||
padding-inline: var(--sl-input-spacing-medium);
|
||||
}
|
||||
|
||||
.email .email__loading {
|
||||
order: 19;
|
||||
}
|
||||
.email .email__suffix {
|
||||
order: 20;
|
||||
}
|
||||
|
||||
/* Listbox */
|
||||
|
||||
.email__listbox {
|
||||
|
@ -283,7 +283,6 @@ export class Et2Email extends Et2InputWidget(LitElement) implements SearchMixinI
|
||||
this.classList.remove("et2-sortable-email");
|
||||
return;
|
||||
}
|
||||
console.log(this, " is sortable");
|
||||
this.classList.add("et2-sortable-email");
|
||||
let pull : boolean | string = !this.disabled && !this.readonly;
|
||||
if(this.readonly && !this.disabled)
|
||||
@ -450,12 +449,14 @@ export class Et2Email extends Et2InputWidget(LitElement) implements SearchMixinI
|
||||
clearTimeout(this._searchTimeout);
|
||||
|
||||
this.searching = true;
|
||||
this.requestUpdate("searching");
|
||||
|
||||
// Start the searches
|
||||
this._searchPromise = this.remoteSearch(this._search.value, this.searchOptions);
|
||||
return this._searchPromise.then(async() =>
|
||||
{
|
||||
this.searching = false;
|
||||
this.requestUpdate("searching", true);
|
||||
if(!this.open && this.hasFocus)
|
||||
{
|
||||
this.show();
|
||||
@ -584,7 +585,6 @@ export class Et2Email extends Et2InputWidget(LitElement) implements SearchMixinI
|
||||
*/
|
||||
private handleLostFocus = (event : MouseEvent | KeyboardEvent) =>
|
||||
{
|
||||
console.log(this, "lost focus");
|
||||
// Close when clicking outside of the component
|
||||
const path = event.composedPath();
|
||||
if(this && !path.includes(this))
|
||||
@ -690,6 +690,11 @@ export class Et2Email extends Et2InputWidget(LitElement) implements SearchMixinI
|
||||
// Tab or enter checks current value
|
||||
else if(Et2Email.TAG_BREAK.indexOf(event.key) !== -1)
|
||||
{
|
||||
// Don't want the key to do its normal ting
|
||||
event.stopPropagation();
|
||||
event.preventDefault();
|
||||
|
||||
// Check for valid email or current selection
|
||||
if(!this.validateAddress(this._search.value.trim()) && this.currentOption)
|
||||
{
|
||||
this._search.value = this.currentOption.value.replaceAll("___", " ");
|
||||
@ -1058,6 +1063,8 @@ export class Et2Email extends Et2InputWidget(LitElement) implements SearchMixinI
|
||||
<slot part="prefix" name="prefix" class="email__prefix"></slot>
|
||||
${this.tagsTemplate()}
|
||||
${this.inputTemplate()}
|
||||
${this.searching ? html`
|
||||
<sl-spinner class="email__loading"></sl-spinner>` : nothing}
|
||||
<slot part="suffix" name="suffix" class="email__suffix"></slot>
|
||||
</div>
|
||||
<div
|
||||
@ -1071,7 +1078,7 @@ export class Et2Email extends Et2InputWidget(LitElement) implements SearchMixinI
|
||||
@keydown=${this.handleSuggestionsKeyDown}
|
||||
@mouseup=${this.handleSuggestionsMouseUp}
|
||||
>
|
||||
${this.suggestionsTemplate()}
|
||||
${(this._selectOptions && this._selectOptions.length) ? this.suggestionsTemplate() : this.egw().lang("no matches found")}
|
||||
</div>
|
||||
</sl-popup>
|
||||
</div>
|
||||
|
@ -217,4 +217,4 @@ class Taglist extends Etemplate\Widget
|
||||
}
|
||||
|
||||
Etemplate\Widget::registerWidget(__NAMESPACE__ . '\\Taglist', array(
|
||||
'taglist', 'et2-select-email', 'et2-select-thumbnail'));
|
||||
'taglist', 'et2-select-email', 'et2-select-thumbnail', 'et2-email'));
|
@ -57,9 +57,9 @@
|
||||
</row>
|
||||
<row class="mailComposeHeaders" >
|
||||
<et2-description value="To"></et2-description>
|
||||
<et2-select-email id="to" allowDragAndDrop="true" width="100%" onclick="app.mail.address_click" multiple="true"
|
||||
onchange="app.mail.recipients_onchange" autofocus="true" searchUrl="EGroupware\Api\Etemplate\Widget\Taglist::ajax_email"
|
||||
placeholder="select or insert email address" includeLists="true" allowPlaceholder="true"></et2-select-email>
|
||||
<et2-email id="to" width="100%" onclick="app.mail.address_click" autofocus="true"
|
||||
onchange="app.mail.recipients_onchange"
|
||||
placeholder="select or insert email address" includeLists="true" allowPlaceholder="true"></et2-email>
|
||||
<et2-hbox>
|
||||
<et2-description id="cc_expander" value="Cc" class="et2_button_text" onclick="app.mail.compose_fieldExpander"></et2-description>
|
||||
<et2-description id="bcc_expander" value="Bcc" class="et2_button_text" onclick="app.mail.compose_fieldExpander"></et2-description>
|
||||
@ -67,16 +67,16 @@
|
||||
</row>
|
||||
<row class="mailComposeHeaders mailComposeJQueryCc">
|
||||
<et2-description value="Cc"></et2-description>
|
||||
<et2-select-email id="cc" width="100%" allowDragAndDrop="true" onclick="app.mail.address_click" multiple="true"
|
||||
<et2-email id="cc" width="100%" onclick="app.mail.address_click"
|
||||
onchange="app.mail.recipients_onchange" searchUrl="EGroupware\Api\Etemplate\Widget\Taglist::ajax_email"
|
||||
placeholder="select or insert email address" includeLists="true" allowPlaceholder="true"></et2-select-email>
|
||||
placeholder="select or insert email address" includeLists="true" allowPlaceholder="true"></et2-email>
|
||||
<et2-description></et2-description>
|
||||
</row>
|
||||
<row class="mailComposeHeaders mailComposeJQueryBcc">
|
||||
<et2-description value="Bcc"></et2-description>
|
||||
<et2-select-email id="bcc" width="100%" allowDragAndDrop="true" onclick="app.mail.address_click" multiple="true"
|
||||
<et2-email id="bcc" width="100%" onclick="app.mail.address_click"
|
||||
onchange="app.mail.recipients_onchange" searchUrl="EGroupware\Api\Etemplate\Widget\Taglist::ajax_email"
|
||||
placeholder="select or insert email address" includeLists="true" allowPlaceholder="true"></et2-select-email>
|
||||
placeholder="select or insert email address" includeLists="true" allowPlaceholder="true"></et2-email>
|
||||
<et2-description></et2-description>
|
||||
</row>
|
||||
<row class="mailComposeHeaders">
|
||||
|
Loading…
Reference in New Issue
Block a user