32 lines
821 B
Vue
32 lines
821 B
Vue
<template>
|
|
<v-container>
|
|
<h1>Directors</h1>
|
|
<v-row>
|
|
<v-col cols="4" v-for="director in directors">
|
|
<v-card :title="director.name">
|
|
<v-card-text>
|
|
<ul class='pl-2'>
|
|
<li>birthdate: {{director.birthdate.toLocaleDateString()}}</li>
|
|
<li>nationality: {{director.nationality}}</li>
|
|
</ul>
|
|
</v-card-text>
|
|
</v-card>
|
|
</v-col>
|
|
</v-row>
|
|
</v-container>
|
|
</template>
|
|
<script setup>
|
|
import {ref} from 'vue'
|
|
const directors = ref([])
|
|
fetch("http://localhost:8000/directors").then(async response => {
|
|
let data = await response.json()
|
|
directors.value = data.map(raw_director => {
|
|
const birthdate = raw_director.birthdate.split("-")
|
|
return {
|
|
...raw_director,
|
|
birthdate: new Date(birthdate[2], birthdate[1], birthdate[0])
|
|
}
|
|
})
|
|
})
|
|
</script>
|