Tippen verbessert, einige QoL Features, updaten von Tipps hinzugefügt, Styles hinzugefügt für die Buttons

This commit is contained in:
R40fendt
2025-08-22 18:59:48 +02:00
parent e4f82af875
commit c893f1165e
3 changed files with 85 additions and 14 deletions

View File

@@ -6,8 +6,8 @@ TODO:
- Addhit
- Galerie (Bilder müssen noch auf NAS)
- BuLi-Tipp (Rangliste und Übersicht) Tippen sollte funktionieren, CSS fehlt noch für die Buttons
- Startseite (Events?)
- BuLi-Tipp (Rangliste, Paarungsergebnisse und Übersicht) Tippen funktioniert, Min und Max beim Spieltag Input auch
- Startseite (Events testen, type=fotos?)
- Footer, Texte?
- Event Fotos
- Navbar Hamburger Menu

View File

@@ -30,12 +30,26 @@
transition: background-color 0.3s ease;
}
input[type="submit"]:hover {
input[type="submit"]:hover, .green-button:hover {
background-color: #3e8e41;
transform: scale(1.01);
}
.red-button {
background-color: #f44336; /* Rot für einen negativen Button */
color: white;
padding: 12px 20px;
border: none;
border-radius: 4px;
cursor: pointer;
transition: background-color 0.3s ease;
width: 100%;
}
.red-button:hover {
background-color: #d32f2f;
transform: scale(1.01);
}
@@ -191,16 +205,20 @@ h2 {
}
}
/* Submit-Button */
.tippenEintragen input[type="submit"] {
.tippenEintragen input[type="submit"], .green-button {
background-color: #4CAF50;
color: white;
padding: 10px 20px;
border: none;
border-radius: 5px;
cursor: pointer;
width: 150px;
width: 100%;
transition: all 0.3s ease-in-out;
}
.tippenEintragen input[type="submit"]:hover, .green-button:hover {
background-color: #3e8e41;
transform: scale(1.01);
}
/* Meldung für nicht vorbereiteten Spieltag */
.tippenEintragen h1 {

View File

@@ -9,7 +9,7 @@ export default {
required: false,
},
},
data() {
data() {
return {
spieltag: "",
vmodelspieltag: "",
@@ -24,7 +24,8 @@ export default {
new ritzenbergenlib.Tipp(null, null, null),
new ritzenbergenlib.Tipp(null, null, null)
],
disabled: false
disabled: false,
schongetippt: true
};
},
asyncComputed: {
@@ -93,6 +94,56 @@ export default {
this.disabled = false;
return this.maxspieltag + 1;
}
},
watch: ["maxspieltag"]
},
tippupdater:{
get(){
const params = new URLSearchParams({
spieltag: this.spieltag.toString()
});
return fetch(
ritzenbergenlib.RitzenbergenLib.api(
"/bulitipp/tippsuser.php?" + params.toString()),
{
method: "GET",
headers: {
Authorization: "Bearer " + this.token,
},
}
)
.then((response) => response.json())
.then((response) => {
if (response.length > 0) {
return response.map((el:any) => {
if(el==null){
this.schongetippt = false;
return new ritzenbergenlib.Tipp(null, null, null);
}
this.schongetippt=true;
return new ritzenbergenlib.Tipp(
el.paarung,
el.score1,
el.score2
);
});
}
}).then(response=>{
this.tipps=response;
return response;
});
},
watch: ["spieltag"]
},
zeitzutippen: {
get(){
return fetch(
ritzenbergenlib.RitzenbergenLib.api(
"/bulitipp/zeitzutippen.php"
)
)
.then((response) => response.json());
}
}
},
@@ -122,7 +173,7 @@ export default {
},
}
);
this.spieltag = "";
}
},
};
@@ -131,7 +182,9 @@ export default {
<div>
<div v-if="(spieltag == '' || spieltag == null) && userinfo != null">
<h1>Moin {{ userinfo.username }}!</h1>
<br /><br />
<br />
<h4 v-if="zeitzutippen!=null">Du hast noch <span v-if="zeitzutippen.days!=0">{{ zeitzutippen.days }} Tage und </span>{{ zeitzutippen.hours }} Stunden Zeit, den {{ zeitzutippen.spieltag }}. Spieltag zu tippen.</h4>
<br />
<div v-if="disabled">
<h3>Gerade kann nicht getippt werden.</h3><br>
</div>
@@ -147,7 +200,7 @@ export default {
/>
<input type="submit" value="Tippen" :disabled="disabled" />
<br /><br />
<input type="button" value="Ausloggen" @click="$emit('logout')" />
<input type="button" value="Ausloggen" @click="$emit('logout')" class="red-button" />
</form>
</div>
<div class="tippenEintragen" v-else>
@@ -162,9 +215,9 @@ export default {
<span class="team-name">{{ paarung.gast }}</span>
<img :src="getTeamImage(paarung.gast)" alt="" /><br />
</span>
<input type="submit" value="Tippen" />
<input type="submit" :value="schongetippt?'Tipps aktualisieren':'Tippen'" class="green-button"/>
<br /><br />
<input type="button" value="Abbrechen" @click="spieltag = ''" />
<input type="button" value="Abbrechen" @click="spieltag = ''" class="red-button" />
</form>
</div>
</div>