Fixes for date/time picker issue.
This commit is contained in:
parent
aeea15e8db
commit
b8f843ebb2
|
@ -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 @@
|
|||
}
|
||||
</script>
|
||||
|
||||
{#key isTimeOnly}
|
||||
{#key timeOnly}
|
||||
<Flatpickr
|
||||
bind:flatpickr
|
||||
value={parseDate(value)}
|
||||
|
|
|
@ -19,10 +19,22 @@
|
|||
export let value = defaultValue || (meta.type === "boolean" ? false : "")
|
||||
export let readonly
|
||||
|
||||
const resolveTimeStamp = timestamp => {
|
||||
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
|
||||
</script>
|
||||
|
||||
{#if type === "options"}
|
||||
|
@ -34,7 +46,7 @@
|
|||
sort
|
||||
/>
|
||||
{:else if type === "datetime"}
|
||||
<DatePicker {label} bind:value />
|
||||
<DatePicker {label} timeOnly={isTimeStamp} bind:value />
|
||||
{:else if type === "attachment"}
|
||||
<Dropzone {label} bind:value />
|
||||
{:else if type === "boolean"}
|
||||
|
|
Loading…
Reference in New Issue