BuLi-Tipp weiter gemacht
This commit is contained in:
55
src/components/bulitipp/Paarungsergebnisse.vue
Normal file
55
src/components/bulitipp/Paarungsergebnisse.vue
Normal 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>
|
||||||
40
src/components/bulitipp/Rangliste.vue
Normal file
40
src/components/bulitipp/Rangliste.vue
Normal 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>
|
||||||
61
src/components/bulitipp/Tabelle.vue
Normal file
61
src/components/bulitipp/Tabelle.vue
Normal 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>
|
||||||
29
src/components/bulitipp/Uebersicht.vue
Normal file
29
src/components/bulitipp/Uebersicht.vue
Normal 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>
|
||||||
@@ -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;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -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: {
|
computed: {
|
||||||
tippenoffen() {
|
tippenoffen() {
|
||||||
return this.$route.path === "/bulitipp/tippen";
|
return this.$route.path === "/bulitipp/tippen";
|
||||||
},
|
},
|
||||||
|
users() {
|
||||||
|
return [
|
||||||
|
{
|
||||||
|
id: 1,
|
||||||
|
name: "User 1",
|
||||||
|
points: 10,
|
||||||
|
kuerzel: "U1",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
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() {
|
tippenschliessen() {
|
||||||
return this.$router.push("/bulitipp");
|
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">
|
|
||||||
<div class="item-wrapper">
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</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 -->
|
<!-- Rangliste -->
|
||||||
|
|
||||||
<section class="rangliste" id="rangliste-sektion">
|
<Rangliste :users="users"/>
|
||||||
<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>
|
|
||||||
<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 />
|
<Footer />
|
||||||
</template>
|
</template>
|
||||||
<style scoped>
|
<style scoped>
|
||||||
@import "../assets/css/bulitipp2.css";
|
@import "../assets/css/bulitipp2.css";
|
||||||
|
#hero-17-u6k7q0xIhk{
|
||||||
|
margin-bottom: 100px;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
Reference in New Issue
Block a user