Add date if allDay event, time if not
This commit is contained in:
parent
a7a674e431
commit
0e78ae3cc4
1 changed files with 24 additions and 6 deletions
|
@ -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}
|
||||||
|
|
||||||
|
<ModalFooter class="justify-content-between">
|
||||||
|
<span>
|
||||||
{#if event.extendedProps.location}
|
{#if event.extendedProps.location}
|
||||||
<ModalFooter class="justify-content-start">
|
|
||||||
<Icon name="geo" />
|
<Icon name="geo" />
|
||||||
<span>{event.extendedProps.location}</span>
|
<span class="ms-1">{event.extendedProps.location}</span>
|
||||||
</ModalFooter>
|
|
||||||
{/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>
|
||||||
|
|
Loading…
Reference in a new issue