Rangliste und Tabelle: Spiel-Class wird jetzt genutzt

src/components/bulitipp/Rangliste.vue

@@ -1,4 +1,4 @@
-<script lang="js">
+<script lang="ts">
 import ritzenbergenlib from '../../ritzenbergenlib';
 import Modal from '../Modal.vue';
 
@@ -39,11 +39,19 @@ export default {
               return result.paarung.id === paarungsid;
             });
           },
-					calcPoints(tipp){
+			},
-						return ritzenbergenlib.RitzenbergenLib.calcPoints(tipp);
+					asyncComputed: {
-					}
+						spiele: {
+								get(){
+										if(this.spieltag==null) return;
+										if(this.currentuser==null) return;
+										return ritzenbergenlib.Spiel.fetchSpiele(this.spieltag-1, this.currentuser.id);
+								},
+								watch: ["spieltag","currentuser"],
+								default: []
 						}
 					}
+}
 </script>
 <template>
 <section class="rangliste" id="rangliste-sektion">
@@ -57,11 +65,12 @@ export default {
           <td>Tipp</td>
           <td>Punkte</td>
         </tr>
-        <tr v-for="(result,i) in results">
+        <tr v-for="(spiel,i) in spiele">
-          <td>{{ result.paarung.heim }} - {{ result.paarung.gast }}</td>
+          <td>{{ spiel.paarung.heim }} - {{ spiel.paarung.gast }}</td>
-					<td>{{ result.heim  }} - {{ result.gast }}</td>
+					<td>{{ spiel.result[0]  }} - {{ spiel.result[1] }}</td>
-					<td>{{ tipps[i].tipp.heim }} - {{ tipps[i].tipp.gast }}</td>
+					<td v-if="spiel.tipp!=null">{{ spiel.tipp[0] }} - {{ spiel.tipp[1] }}</td>
-					<td>{{ calcPoints(tipps[i]) }}</td>
+					<td v-else>-</td>
+					<td>{{ spiel.calcPoints() }}</td>
         </tr>
        </table>
     </Modal>

src/components/bulitipp/Tabelle.vue

@@ -1,4 +1,4 @@
-<script lang="js">
+<script lang="ts">
 import ritzenbergenlib from "../../ritzenbergenlib";
 import Modal from "../Modal.vue";
 export default {
@@ -21,10 +21,7 @@ export default {
       this.spieltag=spieltag;
       this.user=user;
     },
-		calcPoints(spiel){
+},
-				return ritzenbergenlib.RitzenbergenLib.calcPoints(spiel);
-		}
-  },
   components: {
     Modal,
   },
@@ -41,18 +38,9 @@ export default {
   },
   asyncComputed: {
     modalContent: {
-      get(){
+			get(): Array<ritzenbergenlib.Spiel>{
         if(this.spieltag==undefined) return [];
-        let params=new URLSearchParams({
+        return ritzenbergenlib.Spiel.fetchSpiele(this.spieltag,this.ts[this.spieltag][this.user].user.id);
-          spieltag: this.spieltag+1,
-          user: this.ts[this.spieltag][this.user].user.id
-        });
-        return fetch(this.RitzenbergenLib.api("/bulitipp/spieltag-user.php?")+params.toString()).then((response)=>{
-          return response.json();
-        }).then((data)=>{
-          return data.data;
-        })
-        ;
 		  },
       default: []
     }
@@ -77,7 +65,7 @@ export default {
         <td>{{ spiel.result[0] }} - {{ spiel.result[1] }}</td>
         <td v-if="spiel.tipp!=null">{{ spiel.tipp[0] }} - {{ spiel.tipp[1] }}</td>
         <td v-else> - </td>
-        <td>{{ calcPoints(spiel) }}</td>
+        <td>{{ spiel.calcPoints() }}</td>
       </tr>
     </table>
   </Modal>

src/ritzenbergenlib.ts

@@ -40,19 +40,6 @@ class RitzenbergenLib {
     if(path.startsWith("/")) return "http://192.168.188.38/Jonas/ritzenbergenapi"+path;
     else return "http://192.168.188.38/Jonas/ritzenbergenapi/"+path;
   }
-	static calcPoints(spiel){ //TODO class dafür erstellen
-      if(spiel.tipp==null) return 0;
-      if(spiel.result==spiel.tipp) return 3;
-      let differenztipp=spiel.tipp[0]-spiel.tipp[1];
-      let differenz=spiel.result[0]-spiel.result[1];
-      if(differenztipp==differenz) return 2;
-      if(
-        (spiel.tipp[0]>spiel.tipp[1] && spiel.result[0]>spiel.result[1]) ||
-        (spiel.tipp[0]<spiel.tipp[1] && spiel.result[0]<spiel.result[1])
-      ) return 1;
-      return 0;
-    }
-
 }
 
 class Paarung {
@@ -89,11 +76,51 @@ class Tipp{
   }
 }
 
+class Spiel {
+		public paarung: Paarung;
+		public result: [number, number]|null;
+		public tipp: [number, number]|null;
+		
+		constructor (paarung: Paarung, result: [number, number], tipp: [number, number]|null) {
+			this.paarung = paarung;
+			this.result = result;
+			this.tipp = tipp;
+		}
+		public calcPoints(){
+      if(this.tipp==null) return 0;
+      if(this.result==this.tipp) return 3;
+      let differenztipp=this.tipp[0]-this.tipp[1];
+      let differenz=this.result[0]-this.result[1];
+      if(differenztipp==differenz) return 2;
+      if(
+        (this.tipp[0]>this.tipp[1] && this.result[0]>this.result[1]) ||
+        (this.tipp[0]<this.tipp[1] && this.result[0]<this.result[1])
+      ) return 1;
+      return 0;
+    }
+		public static async fetchSpiele(spieltag: number, userid: number):Spiel[]{
+				let params=new URLSearchParams({
+          spieltag: spieltag+1,
+          user: userid
+        });
+        return fetch(RitzenbergenLib.api("/bulitipp/spieltag-user.php?")+params.toString()).then((response)=>{
+          return response.json();
+        }).then((data)=>{
+          return data.data;
+				}).then((data)=>{
+						return data.map((el)=>{
+								return new Spiel(new Paarung(el.paarung.heim, el.paarung.gast, el.paarung.id),el.result, el.tipp);
+						});
+				});
+		}
+}
+
 export default {
   RitzenbergenLib,
   User,
   SpieltagSumme,
   Paarung,
   Ergebnis,
-  Tipp
+  Tipp,
+	Spiel
 }