Add date if allDay event, time if not

This commit is contained in:
Tom Hubrecht 2022-03-06 01:44:33 +01:00
parent a7a674e431
commit 0e78ae3cc4

View file

@ -4,6 +4,12 @@
export let event = undefined; export let event = undefined;
export let open = undefined; export let open = undefined;
export let toggle = undefined; export let toggle = undefined;
const timeFormat = d =>
d.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });
const dateFormat = d =>
d.toLocaleDateString('fr-FR', { month: '2-digit', day: '2-digit' });
</script> </script>
<Modal isOpen={open} {toggle} centered scrollable> <Modal isOpen={open} {toggle} centered scrollable>
@ -16,10 +22,22 @@
</ModalBody> </ModalBody>
{/if} {/if}
{#if event.extendedProps.location} <ModalFooter class="justify-content-between">
<ModalFooter class="justify-content-start"> <span>
<Icon name="geo" /> {#if event.extendedProps.location}
<span>{event.extendedProps.location}</span> <Icon name="geo" />
</ModalFooter> <span class="ms-1">{event.extendedProps.location}</span>
{/if} {/if}
</span>
<span>
{#if event.allDay}
<Icon name="calendar-range" />
<span class="ms-1">{dateFormat(event.start)} - {dateFormat(event.end)}</span>
{:else}
<Icon name="clock" />
<span class="ms-1">{timeFormat(event.start)} - {timeFormat(event.end)}</span>
{/if}
</span>
</ModalFooter>
</Modal> </Modal>