50 lines
1.0 KiB
Vue
50 lines
1.0 KiB
Vue
<template>
|
|
<main>
|
|
<h1>
|
|
Alle foreslåtte viner
|
|
</h1>
|
|
<section class="requested-wines-container">
|
|
<p v-if="this.wines == undefined || this.wines.length <= 0">Ingen har foreslått noe enda!</p>
|
|
<RequestedWineCard v-for="requestedEl in wines" :key="requestedEl.id" :requestedElement="requestedEl" @deletedOne="refreshData" />
|
|
</section>
|
|
</main>
|
|
</template>
|
|
|
|
<script>
|
|
import { allRequestedWines } from "@/api";
|
|
import RequestedWineCard from "@/ui/RequestedWineCard";
|
|
export default {
|
|
components: {
|
|
RequestedWineCard
|
|
},
|
|
data(){
|
|
return{
|
|
wines: undefined,
|
|
canRequest: true
|
|
}
|
|
},
|
|
methods: {
|
|
async refreshData(){
|
|
this.wines = []
|
|
const wines = await allRequestedWines()
|
|
this.wines = wines
|
|
}
|
|
},
|
|
mounted() {
|
|
this.refreshData()
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
h1{
|
|
text-align: center;
|
|
}
|
|
|
|
.requested-wines-container{
|
|
display: flex;
|
|
justify-content: space-around;
|
|
flex-flow: row wrap;
|
|
align-items: stretch
|
|
}
|
|
</style> |