Merge pull request 'Teamcard' (#1) from Teamcard into master

Reviewed-on: #1
question-12
Aurian JAULT 2 years ago
commit 3735137d42

@ -9,28 +9,42 @@
<body> <body>
<div id="app"> <div id="app">
<h1>TP-noté</h1> <h1>TP-noté</h1>
<nav-bar></nav-bar> <nav-bar @add-team="addTeam"></nav-bar>
<team-card v-for="team in teams"
:id="team.id"
:nom="team.name"
:description="team.description">
</team-card>
</div> </div>
<script src="src/service/link-service.js"></script> <script src="src/service/link-service.js"></script>
<script src="src/class/team.js"></script> <script src="src/class/team.js"></script>
<script src="src/misc/const.js"></script> <script src="src/misc/const.js"></script>
<script src="main.js"></script> <script src="main.js"></script>
<script type="module"> <script type="module">
import { createApp } from 'https://unpkg.com/vue@3/dist/vue.esm-browser.js'; import { createApp } from 'https://unpkg.com/vue@3/dist/vue.esm-browser.js';
import NavBar from '/src/view/nav-bar.js'; import NavBar from '/src/view/nav-bar.js';
import TeamCard from '/src/view/team-card.js';
const app = createApp({ const app = createApp({
created(){}, created(){},
data(){ data(){
return{} return{
teams: []
}
}, },
methods:{} methods:{
addTeam: function(equipe){
console.log(equipe);
this.teams.push(equipe);
}
}
}); });
app.component('NavBar', NavBar); app.component('NavBar', NavBar);
app.component('TeamCard', TeamCard);
app.mount('#app'); app.mount('#app');
</script> </script>
</body> </body>
</html> </html>

@ -1,3 +1,2 @@
let linkService = new LinkService(); let linkService = new LinkService();
linkService.getLinks(); linkService.getLinks();

@ -1,4 +1,5 @@
export default{ export default{
emits: ['addTeam'],
data : function(){ data : function(){
return { return {
Home: '', Home: '',
@ -33,16 +34,21 @@ export default{
this.description+="The description must have at least 20 caracters " this.description+="The description must have at least 20 caracters "
} }
} }
if (this.errMessage.lenght==0) { if(this.errMessage.length===0){
console.log("jappelle la fonction")
this.addTeam(); this.addTeam();
} }
}, },
addTeam: function() { addTeam: function() {
let team = new Team(this.id, this.name, this.description); let team = new Team(this.id, this.name, this.description);
console.log(team); console.log(team);
this.$emit("addTeam",team);
this.id=''; this.id='';
this.name=''; this.name='';
this.description=''; },
myfun: function() {
console.log("gngn");
this.clicked=!this.clicked;
} }
}, },
template: template:
@ -73,4 +79,4 @@ export default{
<input type="submit" value="Submit" v-on:click="checkFields"/> <input type="submit" value="Submit" v-on:click="checkFields"/>
</form> </form>
` `
} }

@ -0,0 +1,14 @@
export default{
props: {
id: Number,
nom: String,
description: String
},
methods: {
},
template: `
<div id="teamCard">
<span>{{id}} {{nom}} description: {{description}}</span>
</div>
`
}
Loading…
Cancel
Save