derniere question

src/class/api-service.js

@@ -9,7 +9,7 @@ class ApiService{
         let responseJson = await response.json()
         return responseJson
     }
-    async post(link){
+    async post(link,value){
         const baseUrl = `${link}`;//edit
         const headers = {
             method: 'POST',

src/view/nav-bar.js

@@ -8,7 +8,9 @@ export default{
 			description:'',
 			teamClicked: false,
 			homeClicked: false,
+      resultsClicked: false,
 			errMessage:'',
+      errMessageMatch: '',
 			edit:false,
 			idxEdit:null
 		}
@@ -18,6 +20,7 @@ export default{
 			if(!this.teamClicked){
 				this.teamClicked=true;
 				this.homeClicked=false;
+				this.resultsClicked=false;
 			}
 			else{
 				this.teamClicked=false;
@@ -30,12 +33,24 @@ export default{
         this.news = infos
         this.homeClicked=true;
         this.teamClicked=false;
+        this.resultsClicked=false;
                 
 			}
 			else{
 				this.homeClicked=false;
 			}
 		},
+    clickResults: function(){
+      if(!this.resultsClicked)
+      {
+        this.resultsClicked = true;
+        this.teamClicked=false;
+        this.homeClicked=false;
+      }
+      else{
+        this.resultsClicked = false
+      }
+    },
 		checkFields: function() {
 			this.errMessage="";
 			document.querySelector("#name").removeAttribute("style");
@@ -100,20 +115,44 @@ export default{
 		},
 		Export:function(){
 			console.log(JSON.stringify(this.teams))
-		}
+		},
+    Match: function(){
+      this.errMessageMatch=""
+      const equipe1 = document.querySelector("#equipe1").value
+      const equipe2 = document.querySelector("#equipe2").value
+
+      const equipe1Score = document.querySelector("#equipe1Score").value
+      const equipe2Score = document.querySelector("#equipe2Score").value
+      
+
+      if (equipe1Score=="" || equipe2Score=="") {
+        this.errMessageMatch="Veuillez rentrer le score de TOUTES les equipes";
+        return;
+      }
+
+
+      const JSON = `[{"name":${equipe1},"score":${equipe1Score}},{"name":${equipe2},"score":${equipe2Score}}]`
+      
+      try {
+        const api = ApiService();
+        api.post("http://www.post-result.com",JSON)
+      } catch (Error) {
+        this.errMessageMatch="Une erreur sur la requette POST"
+      }
+    }
 	},
 	template: 
 		`
 			<div>
 				<span @click="clickHome" style="cursor: pointer">Home</span>
 				<span @click="clickTeams" style="cursor: pointer">Teams</span>
-				<span>Results</span>
+				<span @click="clickResults" style="cursor: pointer">Results</span>
 			</div>
-
+      <div v-if="homeClicked">
       <news-card v-for="info in news" 
           :title="info.title"
           :date="info.publishedAt"/>
-
+      </div>
 			<div id="Teams" v-if="teamClicked">
 				<form @submit.prevent>
 				<br>
@@ -138,5 +177,32 @@ export default{
 	 			</team-card>
 				<input type="submit" value="Export" v-if="teams.length>0" v-on:click="Export" />
 			</div>
+
+
+
+      <div v-if="resultsClicked">
+				<label>{{errMessageMatch}}</label><br/>
+         <form @submit.prevent>
+          <label for="equipe1">Choose a Team1:</label>
+          <select name="equipe1" id="equipe1">
+            <option v-for="team in teams"
+              :value="team.name" 
+              :label="team.name"/>
+          </select>
+          <span>Entre le score de l'équipe</span>
+          <input type="number" id="equipe1Score">
+          <br><br>
+          <label for="equipe2">Choose a Team2:</label>
+          <select name="equipe2" id="equipe2">
+            <option v-for="team in teams"
+              :value="team.name" 
+              :label="team.name"/>
+          </select>
+          <span>Entre le score de l'équipe</span>
+          <input type="number" id="equipe2Score">
+          <br><br>
+          <input type="submit" value="Submit" v-on:click="Match">
+        </form> 
+      </div>
 		`
 }