feat [front]: display pretty date

This commit is contained in:
Alice 2022-07-13 01:02:23 +02:00
parent e424f4f671
commit b16d7e31ae
2 changed files with 22 additions and 1 deletions

View file

@ -74,7 +74,7 @@
</template> </template>
</div> </div>
<div class="ml-auto title is-4"> <div class="ml-auto title is-4">
{{ film.projectionDate }} {{ prettyDate.full(film.projectionDate) }}
</div> </div>
</footer> </footer>
</div> </div>
@ -90,6 +90,7 @@
<script setup lang="ts"> <script setup lang="ts">
import { Film } from "~/composables/types" import { Film } from "~/composables/types"
import { PropType } from "@vue/runtime-core" import { PropType } from "@vue/runtime-core"
import { prettyDate } from "~/composables/strUtils"
const props = defineProps({ const props = defineProps({
film: { type: Object as PropType<Film>, required: true }, film: { type: Object as PropType<Film>, required: true },

View file

@ -0,0 +1,20 @@
export const prettyDate = {
full(date: Date | string) {
const objDate = typeof date === "string" ? new Date(date) : date
const strDate = objDate.toLocaleDateString("fr-FR", {
weekday: "long",
year: "numeric",
month: "long",
day: "numeric",
})
const hour = objDate
.getHours()
.toLocaleString("fr-FR", { minimumIntegerDigits: 2 })
const minute = objDate
.getMinutes()
.toLocaleString("fr-FR", { minimumIntegerDigits: 2 })
const time = `${hour}h${minute}`
return `${strDate}, ${time}`
},
}