merge

index.html

@@ -42,27 +42,9 @@
                 }
             },
             methods:{
-                addTeam: function(equipe){
-                    if(!this.edit){//adding a team
-                        this.teams.push(equipe);
-                    }
-                    else{//editing a team
-                        this.teams.forEach((e,idx) => {
-                            if(e.id==this.newTeam.id&&e.name==this.newTeam.name&&e.description==this.newTeam.description){
-                                this.teams[idx]=equipe;
-                            }
-                        });
-                        this.edit=false;
-                        this.newTeam=null;
-                    }
-                },
-                editTeam: function (team) {
-                    this.newTeam=team;
-                    this.edit=!this.edit;
-                }
+
             }
         });
-
         app.component('NavBar', NavBar);
         app.component('TeamCard', TeamCard);
         app.component('NewsCard',NewsCard);

src/class/api-service.js

@@ -1,7 +1,7 @@
 class ApiService{
     constructor(){}
-    async get(id){
-        const baseUrl = `https://newsapi.org/v2/everything?q=esport&apiKey=${KEYAPI}`;//edit
+    async get(link){
+        const baseUrl = `${link}`;//edit
         const headers = {
             method: 'GET'
         };
@@ -11,8 +11,8 @@ class ApiService{
         console.log("responseJson",responseJson)
         return responseJson;
     }
-    async post(){
-        const baseUrl = `https://jsonplaceholder.typicode.com/posts/`;//edit
+    async post(link){
+        const baseUrl = `${link}`;//edit
         const headers = {
             method: 'POST',
             headers: {

src/view/nav-bar.js

@@ -2,19 +2,35 @@ export default{
     emits: ['addTeam'],
 	data : function(){
 		return {
-			Home: '',
-			Teams: '',
-			Results: '',
+			teams:[],
 			id:'',
 			name:'',
 			description:'',
-			clicked: false,
-			errMessage:''
+			teamClicked: false,
+			homeClicked: false,
+			errMessage:'',
+			edit:false,
+			idxEdit:null
 		}
 	},
 	methods: {
-		myfun: function() {
-			this.clicked=!this.clicked;
+		clickTeams: function() {
+			if(!this.teamClicked){
+				this.teamClicked=true;
+				this.homeClicked=false;
+			}
+			else{
+				this.teamClicked=false;
+			}
+		},
+		clickHome: function() {
+			if(!this.homeClicked){
+				this.homeClicked=true;
+				this.teamClicked=false;
+			}
+			else{
+				this.homeClicked=false;
+			}
 		},
 		checkFields: function() {
 			this.errMessage="";
@@ -52,23 +68,55 @@ export default{
 		addTeam: function(){
 			let team = new Team(this.id, this.name, this.description);
 			console.log(team);
-            this.$emit("addTeam",team);
+			if(!this.edit){//adding a team
+				this.teams.push(team);
+				this.id='';
+				this.name='';
+				this.description='';
+			}
+			else{//editing a team
+				this.teams[this.idxEdit]=team;
 				this.id='';
 				this.name='';
 				this.description='';
+				this.edit=false;
+			}
 		},
-        myfun: function() {
-			this.clicked=!this.clicked;
+		editTeam: function (team) {
+			this.edit=!this.edit;
+			this.teams.forEach((e,idx) => {
+				if(e.id==team.id&&e.name==team.name&&e.description==team.description){
+					this.idxEdit=idx;
+				}
+			});
+			if(this.edit){
+				this.id=team.id;
+				this.name=team.name	;
+				this.description=team.description;
+			}
+			else{
+				this.id='';
+				this.name='';
+				this.description='';
+			}
+		},
+		Export:function(){
+			console.log(JSON.stringify(this.teams))
 		}
 	},
 	template: 
 		`
 			<div>
-				<span>Home</span>
-				<span @click="myfun" style="cursor: pointer">Teams</span>
+				<span @click="clickHome" style="cursor: pointer">Home</span>
+				<span @click="clickTeams" style="cursor: pointer">Teams</span>
 				<span>Results</span>
 			</div>
-			<form @submit.prevent v-if="clicked">
+			<div id="Home" v-if="homeClicked">
+				<h2>Homeee</h2>
+			</div>
+
+			<div id="Teams" v-if="teamClicked">
+				<form @submit.prevent>
 				<br>
 				<label>{{errMessage}}</label><br/>
 				<div>
@@ -88,5 +136,12 @@ export default{
 
 				<input type="submit" value="Submit" v-on:click="checkFields"/>
 				</form>
+				<team-card @edit-team="editTeam" v-for="team in teams"
+					:id="team.id"
+					:nom="team.name"
+					:description="team.description">
+	 			</team-card>
+				<input type="submit" value="Export" v-if="teams.length>0" v-on:click="Export" />
+			</div>
 		`
 }