BuLi-Tipp weiter gemacht

src/components/bulitipp/Paarungsergebnisse.vue

@@ -0,0 +1,55 @@
+<script lang="ts">
+    export default {
+        props: {
+            paarungen: {
+                type: Array,
+                required: true
+            },
+            teams: {
+                type: Array,
+                required: true
+            }
+        }
+    }
+</script>
+<template>
+<section class="buli-results scroll-x" id="buliresults-section">
+    <br /><br />
+    <h2>Paarungsergebnisse . Spieltag</h2>
+    <table>
+      <tbody>
+        <tr>
+          <td>Paarung</td>
+          <td>Ergebnis</td>
+        </tr>
+        <tr v-for="paarung in paarungen">
+          <td>
+            <!-- Modal -->
+            <!-- 
+                  <iframe frameborder="0"></iframe> -->
+            <span class="as-link">
+              <span class="teams">
+                <span class="team">
+                  <img src="" alt="" />
+                  <p>{{ teams[paarung.team1].name }}</p>
+                </span>
+                <span class="vs"></span>
+                <span class="team">
+                  <p>{{ teams[paarung.team2].name }}</p>
+                  <img src="" alt="" />
+                </span>
+              </span>
+            </span>
+          </td>
+          <td>
+            <p>{{ paarung.result1 }} - {{ paarung.result2 }}</p>
+          </td>
+        </tr>
+      </tbody>
+    </table>
+  </section>
+</template>
+<style scoped>
+
+@import "../../assets/css/bulitipp2.css";
+</style>

src/components/bulitipp/Rangliste.vue

@@ -0,0 +1,40 @@
+<script lang="ts">
+    export default {
+        props: {
+            users: {
+                type: Array,
+                required: true
+            }
+        }
+    }
+</script>
+<template>
+<section class="rangliste" id="rangliste-sektion">
+    <br /><br />
+
+    <h2>Rangliste</h2>
+    <table>
+      <tbody>
+        <tr>
+          <td>Platz</td>
+          <td>Name</td>
+          <td>Punkte</td>
+        </tr>
+        <tr v-for="(user, i) in users">
+          <td>{{ i }}</td>
+          <td>
+            <!-- <iframe class="iframeRanglisteDetailansicht"
+                    data-src="">Detailansicht User 1</iframe> -->
+
+            <span class="as-link">{{ user.name }}</span>
+          </td>
+          <td>{{ user.points }}</td>
+        </tr>
+      </tbody>
+    </table>
+  </section>
+</template>
+<style scoped>
+
+@import "../../assets/css/bulitipp2.css";
+</style>

src/components/bulitipp/Tabelle.vue

@@ -0,0 +1,61 @@
+<script lang="ts">
+export default {
+  props: {
+    users: {
+      type: Array,
+      required: true,
+    },
+  },
+  computed: {
+    spieltage() {
+      let result=[
+        [5,10,15,20,25,30],
+        [5,10,15,20,25,30],
+        [5,10,15,20,25,30]
+      ];
+        
+        return result;
+    },
+  },
+  methods: {
+    tagessumme(spieltag:number, user:number){
+        return 5;
+    }
+  }
+};
+</script>
+<template>
+  <section class="buli-table" id="buli-table">
+    <br /><br />
+
+    <h2>Punktetabelle</h2>
+    <div id="load-table-btn-container">
+      <button id="load-table-btn">Punkte ausrechnen</button>
+    </div>
+    <table>
+      <tbody>
+        <tr>
+          <td>Tag</td>
+          <td v-for="user in users">{{ user.name }}</td>
+        </tr>
+        <tr v-for="spieltag,i in spieltage">
+          <td>{{ i+1 }}</td>
+
+          <!-- Modal -->
+
+          <!-- Open BTN -->
+          <td class="as-link" v-for="userpoints in spieltag">{{ userpoints }}</td>
+        </tr>
+
+        <tr>
+          <td>Summe</td>
+
+          <td v-for="user in users">{{ user.points }}</td>
+        </tr>
+      </tbody>
+    </table>
+  </section>
+</template>
+<style scoped>
+@import "../../assets/css/bulitipp2.css";
+</style>

src/components/bulitipp/Uebersicht.vue

@@ -0,0 +1,29 @@
+<script lang="ts">
+export default {
+    props: {
+        users: {
+            type: Array,
+            required: true
+        }
+    },
+}
+</script>
+<template>
+    <section class="uebersicht scroll-x">
+    <table>
+        <tbody>
+      <tr>
+        <td v-for="user in users">{{ user.kuerzel }}</td>
+      </tr>
+      <tr>
+          <td v-for="user in users">{{ user.points }}</td>
+            <!-- <iframe class="iframeRanglisteDetailansicht">Benutzer</iframe> -->
+      </tr>
+      </tbody>
+    </table>
+  </section>
+</template>
+<style scoped>
+
+@import "../../assets/css/bulitipp2.css";
+</style>