BuLi-Tipp weiter gemacht

This commit is contained in:
R40fendt
2025-04-23 12:29:36 +02:00
parent f450567cc7
commit 6bc82f96a2
6 changed files with 404 additions and 164 deletions

View File

@@ -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>

View File

@@ -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>

View File

@@ -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>

View File

@@ -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>

View File

@@ -4,7 +4,7 @@ export default class RitzenbergenLib {
else return "http://bilder.ritzenbergen.de/"+mypath; else return "http://bilder.ritzenbergen.de/"+mypath;
} }
static api(path:string){ static api(path:string){
if(path.startsWith("/")) return "http://api.ritzenbergen.de"+path; if(path.startsWith("/")) return "http://192.168.188.38/Jonas/ritzenbergenapi"+path;
else return "http://api.ritzenbergen.de/"+path; else return "http://192.168.188.38/Jonas/ritzenbergenapi/"+path;
} }
} }

View File

@@ -2,36 +2,221 @@
import Navbar from "../components/Navbar.vue"; import Navbar from "../components/Navbar.vue";
import Footer from "../components/Footer.vue"; import Footer from "../components/Footer.vue";
import Modal from "../components/Modal.vue"; import Modal from "../components/Modal.vue";
import Uebersicht from "../components/bulitipp/Uebersicht.vue";
import Rangliste from "../components/bulitipp/Rangliste.vue";
import Paarungsergebnisse from "../components/bulitipp/Paarungsergebnisse.vue";
import Tabelle from "../components/bulitipp/Tabelle.vue";
export default { export default {
components: { components: {
Navbar, Navbar,
Footer, Footer,
Modal Modal,
Uebersicht,
Rangliste,
Paarungsergebnisse,
Tabelle
},
computed: {
tippenoffen() {
return this.$route.path === "/bulitipp/tippen";
}, },
computed: { users() {
tippenoffen(){ return [
return this.$route.path === "/bulitipp/tippen"; {
id: 1,
name: "User 1",
points: 10,
kuerzel: "U1",
}, },
tippenschliessen(){ {
return this.$router.push("/bulitipp"); id: 2,
} name: "User 2",
} points: 20,
} kuerzel: "U2",
},
{
id: 3,
name: "User 3",
points: 10,
kuerzel: "U3",
},
{
id: 4,
name: "User 4",
points: 20,
kuerzel: "U4",
},
{
id: 5,
name: "User 5",
points: 10,
kuerzel: "U5",
},
{
id: 6,
name: "User 6",
points: 20,
kuerzel: "U6",
},
].sort((a, b) => b.points - a.points);
},
teams() {
return {
1: {
name: "Team 1",
},
2: {
name: "Team 2",
},
3: {
name: "Team 3",
},
4: {
name: "Team 4",
},
5: {
name: "Team 5",
},
6: {
name: "Team 6",
},
7: {
name: "Team 7",
},
8: {
name: "Team 8",
},
9: {
name: "Team 9",
},
10: {
name: "Team 10",
},
11: {
name: "Team 11",
},
12: {
name: "Team 12",
},
13: {
name: "Team 13",
},
14: {
name: "Team 14",
},
15: {
name: "Team 15",
},
16: {
name: "Team 16",
},
17: {
name: "Team 17",
},
18: {
name: "Team 18",
},
};
},
paarungen() {
return [
{
id: 1,
team1: 1,
team2: 2,
result1: 1,
result2: 0,
},
{
id: 2,
team1: 3,
team2: 4,
result1: 1,
result2: 0,
},
{
id: 3,
team1: 5,
team2: 6,
result1: 1,
result2: 0,
},
{
id: 4,
team1: 7,
team2: 8,
result1: 2,
result2: 1,
},
{
id: 5,
team1: 9,
team2: 10,
result1: 0,
result2: 0,
},
{
id: 6,
team1: 11,
team2: 12,
result1: 3,
result2: 2,
},
{
id: 7,
team1: 13,
team2: 14,
result1: 2,
result2: 2,
},
{
id: 8,
team1: 15,
team2: 16,
result1: 0,
result2: 1,
},
{
id: 9,
team1: 17,
team2: 18,
result1: 3,
result2: 3,
},
];
},
},
methods: {
tippenschliessen() {
this.$router.push("/bulitipp");
},
},
};
</script> </script>
<template> <template>
<Navbar buttontext="Tippen" mainlink="/bulitipp/tippen"/> <Navbar buttontext="Tippen" mainlink="/bulitipp/tippen" />
<section class="header16 cid-u6k7q0xIhk bulitipp mbr-fullscreen mbr-parallax-background" id="hero-17-u6k7q0xIhk"> <section
<div class="mbr-overlay" style="opacity: 0.3; background-color: rgb(0, 0, 0);"></div> class="header16 cid-u6k7q0xIhk bulitipp mbr-fullscreen mbr-parallax-background"
id="hero-17-u6k7q0xIhk"
>
<div
class="mbr-overlay"
style="opacity: 0.3; background-color: rgb(0, 0, 0)"
></div>
<div class="container-fluid"> <div class="container-fluid">
<div class="row"> <div class="row">
<div class="content-wrap col-12 col-md-10"> <div class="content-wrap col-12 col-md-10">
<h1 class="mbr-section-title mbr-fonts-style mbr-white mb-4 display-1"> <h1
class="mbr-section-title mbr-fonts-style mbr-white mb-4 display-1"
>
<strong>Willkommen im Bundesliga Tippspiel</strong> <strong>Willkommen im Bundesliga Tippspiel</strong>
</h1> </h1>
<p class="mbr-fonts-style mbr-text mbr-white mb-4 display-7">Saison </p> <p class="mbr-fonts-style mbr-text mbr-white mb-4 display-7">
<br><br> Saison
</p>
<br /><br />
</div> </div>
</div> </div>
</div> </div>
@@ -43,158 +228,28 @@ export default {
<section class="features023 cid-u6k7q0xclF" id="metrics-1-u6k7q0xclF"> <Uebersicht :users="users" />
<div class="container">
<div class="row content-row justify-content-center">
<div class="item features-without-image col-12 col-md-6 col-lg-4 item-mb"> <!-- Rangliste -->
<div class="item-wrapper">
</div> <Rangliste :users="users"/>
</div>
<div class="item features-without-image col-12 col-md-6 col-lg-4 item-mb">
<div class="item-wrapper">
</div>
</div>
</div>
</div>
</section>
<section class="uebersicht scroll-x">
<table>
<tbody>
<tr>
<td>Kürzel</td>
</tr>
<tr>
<td id="uebersicht-user-<?php echo $user; ?>">
<iframe class="iframeRanglisteDetailansicht">Benutzer</iframe>
<button>Punkte</button> <!-- Style Rot Grün -->
</td>
</tr>
</tbody>
</table>
</section>
<!-- Rangliste -->
<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>
<td></td>
<td>
<iframe class="iframeRanglisteDetailansicht"
data-src="">Detailansicht User 1</iframe>
<span class="as-link">User 1</span>
</td>
<td></td>
</tr>
</tbody>
</table>
</section>
<!-- Paarungsergebnisse --> <!-- Paarungsergebnisse -->
<section class="buli-results scroll-x" id="buliresults-section"> <Paarungsergebnisse :paarungen="paarungen" :teams="teams"/>
<br><br>
<h2>Paarungsergebnisse . Spieltag</h2>
<table>
<tbody>
<tr>
<td>Paarung</td>
<td>Ergebnis</td>
</tr>
<tr>
<td>
<!-- Modal -->
<iframe frameborder="0"></iframe>
<span class="as-link">
<span class="teams">
<span class="team">
<img src="" alt="">
<p>Team 1</p>
</span>
<span class="vs"></span>
<span class="team">
<p>Team 2</p>
<img src="" alt="">
</span>
</span>
</span>
</td>
<td>
<p>1 - 0</p>
</td>
</tr>
</tbody>
</table>
</section>
<!-- Punktetabelle --> <!-- Punktetabelle -->
<section class="buli-table" id="buli-table"> <Tabelle :users="users"/>
<br><br>
<h2>Punktetabelle</h2> <br />
<div id="load-table-btn-container"> <br />
<button id="load-table-btn">Punkte ausrechnen</button> <br />
</div>
<table>
<tbody> <Footer />
<tr>
<td>Tag</td>
<td>User1</td>
</tr>
<tr>
<td>123</td>
<!-- Modal -->
<!-- Open BTN -->
<td class="as-link">Punkte</td>
</tr>
<tr>
<td>Summe</td>
<td>Benutzer</td>
</tr>
</tbody>
</table>
</section>
<br>
<br>
<br>
<Footer/>
</template> </template>
<style scoped> <style scoped>
@import "../assets/css/bulitipp2.css"; @import "../assets/css/bulitipp2.css";
</style> #hero-17-u6k7q0xIhk{
margin-bottom: 100px;
}
</style>