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

src/components/bulitipp/Tippen.vue

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