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

README.md

@@ -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
+- BuLi-Tipp (Rangliste, Paarungsergebnisse und Übersicht) Tippen funktioniert, Min und Max beim Spieltag Input auch
-- Startseite (Events?)
+- Startseite (Events testen, type=fotos?)
 - Footer, Texte?
 - Event Fotos
 - Navbar Hamburger Menu

src/assets/css/bulitipp2.css

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

src/components/bulitipp/Tippen.vue

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