From b8f843ebb249637a96b8d41a37eedcb62e05a830 Mon Sep 17 00:00:00 2001 From: Dean Date: Mon, 4 Apr 2022 11:51:52 +0100 Subject: [PATCH] Fixes for date/time picker issue. --- packages/bbui/src/Form/Core/DatePicker.svelte | 38 ++++++++++++++----- .../backend/DataTable/RowFieldControl.svelte | 14 ++++++- 2 files changed, 42 insertions(+), 10 deletions(-) diff --git a/packages/bbui/src/Form/Core/DatePicker.svelte b/packages/bbui/src/Form/Core/DatePicker.svelte index c1c4cc866f..74b336b9b6 100644 --- a/packages/bbui/src/Form/Core/DatePicker.svelte +++ b/packages/bbui/src/Form/Core/DatePicker.svelte @@ -19,18 +19,35 @@ const dispatch = createEventDispatcher() const flatpickrId = `${uuid()}-wrapper` let open = false - let flatpickr, flatpickrOptions, isTimeOnly + let flatpickr, flatpickrOptions + + const resolveTimeStamp = timestamp => { + let maskedDate = new Date(`0-${timestamp}`) + + if (maskedDate instanceof Date && !isNaN(maskedDate.getTime())) { + return maskedDate + } else { + return null + } + } + + const isTS = resolveTimeStamp(value) != null - $: isTimeOnly = !timeOnly && value ? !isNaN(new Date(`0-${value}`)) : timeOnly $: flatpickrOptions = { element: `#${flatpickrId}`, - enableTime: isTimeOnly || enableTime || false, - noCalendar: isTimeOnly || false, + enableTime: timeOnly || enableTime || false, + noCalendar: timeOnly || false, altInput: true, - altFormat: isTimeOnly ? "H:i" : enableTime ? "F j Y, H:i" : "F j, Y", + altFormat: timeOnly ? "H:i" : enableTime ? "F j Y, H:i" : "F j, Y", wrap: true, appendTo, disableMobile: "true", + onReady: () => { + let timestamp = resolveTimeStamp(value) + if (timeOnly && timestamp) { + dispatch("change", timestamp.toISOString()) + } + }, } const handleChange = event => { @@ -76,10 +93,13 @@ return null } let date - let time = new Date(`0-${val}`) + let time + // it is a string like 00:00:00, just time - if (timeOnly || (typeof val === "string" && !isNaN(time))) { - date = time + let ts = resolveTimeStamp(val) + + if (timeOnly && ts) { + date = ts } else if (val instanceof Date) { // Use real date obj if already parsed date = val @@ -101,7 +121,7 @@ } -{#key isTimeOnly} +{#key timeOnly} { + let maskedDate = new Date(`0-${timestamp}`) + if (maskedDate instanceof Date && !isNaN(maskedDate.getTime())) { + return maskedDate + } else { + return null + } + } + $: stringVal = typeof value === "object" ? JSON.stringify(value, null, 2) : value $: type = meta?.type $: label = meta.name ? capitalise(meta.name) : "" + + const timeStamp = resolveTimeStamp(value) + const isTimeStamp = timeStamp ? true : false {#if type === "options"} @@ -34,7 +46,7 @@ sort /> {:else if type === "datetime"} - + {:else if type === "attachment"} {:else if type === "boolean"}