Et2Date: Add "Ok" button to close calendar popup

This commit is contained in:
nathan 2022-10-18 09:08:53 -06:00
parent 05b316f7ff
commit 5f3570768d
4 changed files with 35 additions and 7 deletions

View File

@ -431,11 +431,15 @@ export class Et2Date extends Et2InputWidget(FormControlMixin(ValidateMixin(LitFl
options.plugins = [ options.plugins = [
// Turn on scroll wheel support // Turn on scroll wheel support
// @ts-ignore TypeScript can't find scrollPlugin, but rollup does // @ts-ignore TypeScript can't find scrollPlugin, but rollup does
new scrollPlugin(), new scrollPlugin()
// Add "today" button
this._buttonPlugin()
]; ];
// Add "Ok" and "today" buttons
const buttons = this._buttonPlugin();
if(buttons)
{
options.plugins.push(buttons)
}
// Listen for flatpickr change so we can update internal value, needed for validation // Listen for flatpickr change so we can update internal value, needed for validation
options.onChange = options.onReady = this._updateValueOnChange; options.onChange = options.onReady = this._updateValueOnChange;
@ -457,7 +461,14 @@ export class Et2Date extends Et2InputWidget(FormControlMixin(ValidateMixin(LitFl
*/ */
public _handleShortcutButtonClick(button_index, fp) public _handleShortcutButtonClick(button_index, fp)
{ {
fp.setDate(new Date()); switch(button_index)
{
case 0: // OK
fp.close();
break;
default:
fp.setDate(new Date());
}
} }
/** /**
@ -482,7 +493,10 @@ export class Et2Date extends Et2InputWidget(FormControlMixin(ValidateMixin(LitFl
{ {
// @ts-ignore TypeScript can't find ShortcutButtonsPlugin, but rollup does // @ts-ignore TypeScript can't find ShortcutButtonsPlugin, but rollup does
return ShortcutButtonsPlugin({ return ShortcutButtonsPlugin({
button: [{label: this.egw().lang("Today")}], button: [
{label: this.egw().lang("ok")},
{label: this.egw().lang("Today")}
],
onClick: this._handleShortcutButtonClick onClick: this._handleShortcutButtonClick
}) })
} }

View File

@ -102,7 +102,10 @@ export class Et2DateTime extends Et2Date
{ {
// @ts-ignore TypeScript can't find ShortcutButtonsPlugin, but rollup does // @ts-ignore TypeScript can't find ShortcutButtonsPlugin, but rollup does
return ShortcutButtonsPlugin({ return ShortcutButtonsPlugin({
button: [{label: this.egw().lang("Now")}], button: [
{label: this.egw().lang("ok")},
{label: this.egw().lang("Now")}
],
onClick: this._handleShortcutButtonClick onClick: this._handleShortcutButtonClick
}) })
} }

View File

@ -4107,6 +4107,11 @@ div.flatpickr-calendar.inline .flatpickr-day:not(.today) {
border: none; border: none;
} }
/* put bottom buttons in a row */
div.flatpickr-calendar .shortcut-buttons-flatpickr-buttons {
display: flex;
}
button.shortcut-buttons-flatpickr-button:hover { button.shortcut-buttons-flatpickr-button:hover {
background-color: #eceef1; background-color: #eceef1;
} }

View File

@ -105,6 +105,12 @@ export class SidemenuDate extends Et2Date
return options return options
} }
protected _buttonPlugin()
{
// No buttons
return null;
}
set_value(value) set_value(value)
{ {
if(typeof value !== "string" && value.length == 8) if(typeof value !== "string" && value.length == 8)