73 lines
1.6 KiB
Vue
73 lines
1.6 KiB
Vue
<script lang="ts">
|
|
import Modal from "../Modal.vue"
|
|
export default {
|
|
props: {
|
|
users: {
|
|
type: Array,
|
|
required: true
|
|
},
|
|
spieltag: {
|
|
type: Number,
|
|
required: false
|
|
},
|
|
tipps: {
|
|
type: Array,
|
|
required: true
|
|
},
|
|
paarungen: {
|
|
type: Array,
|
|
required: true
|
|
}
|
|
},
|
|
data(){
|
|
return {
|
|
currentuser: null,
|
|
modalOpen: false
|
|
}
|
|
},
|
|
components: {
|
|
Modal
|
|
}
|
|
}
|
|
</script>
|
|
<template>
|
|
<section class="uebersicht scroll-x">
|
|
<table>
|
|
<tbody>
|
|
<tr>
|
|
<td v-for="user in users" @click="currentuser=user; modalOpen=true">{{ user.kuerzel }}</td>
|
|
</tr>
|
|
<tr>
|
|
<td v-for="user in users" :style='{"color": user.hatgetippt()?"green":"red"}' @click="currentuser=user; modalOpen=true">{{ user.points }}</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</section>
|
|
<Modal v-if="modalOpen" @closemodal="modalOpen=false">
|
|
<div v-if="spieltag!=undefined">
|
|
<h1>Detailansicht für {{ currentuser.username }}, {{ spieltag }}. Spieltag</h1>
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<td>Paarung</td>
|
|
<td>Tipp von {{ currentuser.username }}</td>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr v-for="tipp, i in tipps.filter(t=>t.user==currentuser.id)">
|
|
<td>{{ paarungen[i].heim }} - {{ paarungen[i].gast }}</td>
|
|
<td>{{ tipp.tipp.heim }} - {{ tipp.tipp.gast }}</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<div v-else>
|
|
<h1>Lade...</h1>
|
|
</div>
|
|
</Modal>
|
|
</template>
|
|
<style scoped>
|
|
|
|
@import "../../assets/css/bulitipp2.css";
|
|
</style>
|