Übersicht Modal hinzugefügt

README.md

@@ -6,7 +6,8 @@ TODO:
 
 - Addhit
 - Galerie (Bilder müssen noch auf NAS)
-- BuLi-Tipp (Rangliste, Paarungsergebnisse und Übersicht) Tippen funktioniert, Min und Max beim Spieltag Input auch
+- BuLi-Tipp (Übersicht, Paarungsergebnisse Ladescreen) Tippen funktioniert, Min und Max beim Spieltag Input auch, Modals funktionieren alle bis auf Übersicht
+- BuLi-Tipp User Active Spalte
 - Startseite (Events testen, type=fotos?)
 - Footer, Texte?
 - Event Fotos

src/components/bulitipp/Uebersicht.vue

@@ -1,28 +1,52 @@
-<script lang="js">
+<script lang="ts">
+import Modal from "../Modal.vue"
 export default {
     props: {
         users: {
             type: Array,
             required: true
-        }
+        },
+				spieltag: {
+						type: Number,
+						required: false
+				}
     },
+		data(){
+				return {
+						currentuser: null,
+						modalOpen: false
+				}
+		},
+		components: {
+				Modal
+		}
 }
 </script>
 <template>
-    <section class="uebersicht scroll-x">
+		<section class="uebersicht scroll-x">	
     <table>
         <tbody>
       <tr>
-        <td v-for="user in users">{{ user.kuerzel }}</td>
+        <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'}">{{ user.points }}</td>
+          <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">
+						{{ currentuser }}
+						
+						<h1>Detailansicht für {{ currentuser.username }}, {{ spieltag }}. Spieltag</h1>
+				</div>
+				<div v-else>
+						<h1>Lade...</h1>
+				</div>
+		</Modal>
 </template>
 <style scoped>
 
 @import "../../assets/css/bulitipp2.css";
-</style>
+</style>

src/views/Bulitipp.vue

@@ -239,7 +239,7 @@ export default {
   </Modal>
 
   
-  <Uebersicht :users="users" />
+  <Uebersicht :users="users" :spieltag="maxspieltag" />
 
   <!-- Rangliste -->