forked from extern/egroupware
Et2Date: Add support for inline dates & passing a format to parseDate
This commit is contained in:
parent
a74bd82dde
commit
0017b78b53
@ -9,7 +9,7 @@
|
|||||||
*/
|
*/
|
||||||
|
|
||||||
|
|
||||||
import {css} from "@lion/core";
|
import {css, html} from "@lion/core";
|
||||||
import {FormControlMixin, ValidateMixin} from "@lion/form-core";
|
import {FormControlMixin, ValidateMixin} from "@lion/form-core";
|
||||||
import 'lit-flatpickr';
|
import 'lit-flatpickr';
|
||||||
import {Et2InputWidget} from "../Et2InputWidget/Et2InputWidget";
|
import {Et2InputWidget} from "../Et2InputWidget/Et2InputWidget";
|
||||||
@ -25,7 +25,7 @@ import "flatpickr/dist/plugins/scrollPlugin.js";
|
|||||||
* @param {string} dateString
|
* @param {string} dateString
|
||||||
* @returns {Date | undefined}
|
* @returns {Date | undefined}
|
||||||
*/
|
*/
|
||||||
export function parseDate(dateString)
|
export function parseDate(dateString, formatString?)
|
||||||
{
|
{
|
||||||
// First try the server format
|
// First try the server format
|
||||||
if(dateString.substr(-1) === "Z")
|
if(dateString.substr(-1) === "Z")
|
||||||
@ -44,7 +44,7 @@ export function parseDate(dateString)
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
let formatString = <string>(window.egw.preference("dateformat") || 'Y-m-d');
|
formatString = formatString || <string>(window.egw.preference("dateformat") || 'Y-m-d');
|
||||||
//@ts-ignore replaceAll() does not exist
|
//@ts-ignore replaceAll() does not exist
|
||||||
formatString = formatString.replaceAll(new RegExp('[-/\.]', 'ig'), '-');
|
formatString = formatString.replaceAll(new RegExp('[-/\.]', 'ig'), '-');
|
||||||
let parsedString = "";
|
let parsedString = "";
|
||||||
@ -65,6 +65,10 @@ export function parseDate(dateString)
|
|||||||
case 'd-M-Y':
|
case 'd-M-Y':
|
||||||
parsedString = `${dateString.slice(6, 10)}/${dateString.slice(3, 5,)}/${dateString.slice(0, 2)}`;
|
parsedString = `${dateString.slice(6, 10)}/${dateString.slice(3, 5,)}/${dateString.slice(0, 2)}`;
|
||||||
break;
|
break;
|
||||||
|
case 'Ymd':
|
||||||
|
// Not a preference option, but used by some dates
|
||||||
|
parsedString = `${dateString.slice(0, 4)}/${dateString.slice(4, 6,)}/${dateString.slice(6, 8)}`;
|
||||||
|
break;
|
||||||
default:
|
default:
|
||||||
parsedString = '0000/00/00';
|
parsedString = '0000/00/00';
|
||||||
}
|
}
|
||||||
@ -288,7 +292,11 @@ export class Et2Date extends Et2InputWidget(FormControlMixin(ValidateMixin(LitFl
|
|||||||
static get properties()
|
static get properties()
|
||||||
{
|
{
|
||||||
return {
|
return {
|
||||||
...super.properties
|
...super.properties,
|
||||||
|
/**
|
||||||
|
* Display the calendar inline instead of revealed as needed
|
||||||
|
*/
|
||||||
|
inline: {type: Boolean}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -361,6 +369,11 @@ export class Et2Date extends Et2InputWidget(FormControlMixin(ValidateMixin(LitFl
|
|||||||
options.dateFormat = "Y-m-dT00:00:00\\Z";
|
options.dateFormat = "Y-m-dT00:00:00\\Z";
|
||||||
options.weekNumbers = true;
|
options.weekNumbers = true;
|
||||||
|
|
||||||
|
if(this.inline)
|
||||||
|
{
|
||||||
|
options.inline = this.inline;
|
||||||
|
}
|
||||||
|
|
||||||
// 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
|
||||||
options.plugins = [new scrollPlugin()];
|
options.plugins = [new scrollPlugin()];
|
||||||
@ -416,6 +429,23 @@ export class Et2Date extends Et2InputWidget(FormControlMixin(ValidateMixin(LitFl
|
|||||||
return value;
|
return value;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Inline calendars need a slot
|
||||||
|
*
|
||||||
|
* @return {TemplateResult}
|
||||||
|
* @protected
|
||||||
|
*/
|
||||||
|
// eslint-disable-next-line class-methods-use-this
|
||||||
|
_inputGroupAfterTemplate()
|
||||||
|
{
|
||||||
|
return html`
|
||||||
|
<div class="input-group__after">
|
||||||
|
<slot name="after"></slot>
|
||||||
|
<slot/>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Change handler setting modelValue for validation
|
* Change handler setting modelValue for validation
|
||||||
*
|
*
|
||||||
@ -439,11 +469,18 @@ export class Et2Date extends Et2InputWidget(FormControlMixin(ValidateMixin(LitFl
|
|||||||
set minDate(min : string | Date)
|
set minDate(min : string | Date)
|
||||||
{
|
{
|
||||||
if(this._instance)
|
if(this._instance)
|
||||||
|
{
|
||||||
|
if(min)
|
||||||
{
|
{
|
||||||
// Handle timezone offset, flatpickr uses local time
|
// Handle timezone offset, flatpickr uses local time
|
||||||
let date = new Date(min);
|
let date = new Date(min);
|
||||||
let formatDate = new Date(date.valueOf() + date.getTimezoneOffset() * 60 * 1000);
|
let formatDate = new Date(date.valueOf() + date.getTimezoneOffset() * 60 * 1000);
|
||||||
this._instance.set('minDate', formatDate)
|
this._instance.set("minDate", formatDate)
|
||||||
|
}
|
||||||
|
else
|
||||||
|
{
|
||||||
|
this._instance.set("minDate", "")
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -459,11 +496,18 @@ export class Et2Date extends Et2InputWidget(FormControlMixin(ValidateMixin(LitFl
|
|||||||
set maxDate(max : string | Date)
|
set maxDate(max : string | Date)
|
||||||
{
|
{
|
||||||
if(this._instance)
|
if(this._instance)
|
||||||
|
{
|
||||||
|
if(max)
|
||||||
{
|
{
|
||||||
// Handle timezone offset, flatpickr uses local time
|
// Handle timezone offset, flatpickr uses local time
|
||||||
let date = new Date(max);
|
let date = new Date(max);
|
||||||
let formatDate = new Date(date.valueOf() + date.getTimezoneOffset() * 60 * 1000);
|
let formatDate = new Date(date.valueOf() + date.getTimezoneOffset() * 60 * 1000);
|
||||||
this._instance.set('maxDate', formatDate)
|
this._instance.set("maxDate", formatDate)
|
||||||
|
}
|
||||||
|
else
|
||||||
|
{
|
||||||
|
this._instance.set("maxDate", "")
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user