From 5021d71f4de449113ee90d73860e22474299326f Mon Sep 17 00:00:00 2001
From: Raphael LACOTE <Raphael.LACOTE@etu.uca.fr>
Date: Tue, 14 Mar 2023 21:48:34 +0100
Subject: [PATCH] Modification majeur des composants

---
 index.html                            | 32 +++++++++----------------
 src/misc/constant.js                  |  4 ++--
 src/view/navbar.js                    |  1 -
 src/view/{team_add.js => team-add.js} |  6 ++---
 src/view/team.js                      | 34 +++++++++++++++++++++++++++
 src/view/teamcard.js                  | 13 +++++++++-
 6 files changed, 62 insertions(+), 28 deletions(-)
 rename src/view/{team_add.js => team-add.js} (94%)
 create mode 100644 src/view/team.js

diff --git a/index.html b/index.html
index 6a36862..a7ae2be 100644
--- a/index.html
+++ b/index.html
@@ -12,14 +12,15 @@
     <div id="app">
 
         <navbar></navbar>
-        <div class="team">
+        <team></team>
+        <!--<div class="team">
             <team-add @add-team="addTeam"></team-add>
         </div>
         <teamcard v-for="team in allTeam"
                   :id="team.id"
                   :name="team.name"
                   :description="team.description">
-        </teamcard>
+        </teamcard>-->
     </div>
 
     <script src="./src/misc/constant.js"></script>
@@ -31,27 +32,16 @@
         import { createApp } from 'https://unpkg.com/vue@3/dist/vue.esm-browser.js';
 
         import Navbar from './src/view/navbar.js';
-        import TeamAdd from './src/view/team_add.js';
-        import Teamcard from './src/view/teamcard.js';
-
-        const app = createApp({
-            data() {
-                return {
-                    allTeam: []
-                }
-            },
-            methods: {
-                addTeam: function (team) {
-                    console.log('index.addTeam', team);
-                    this.allTeam.push(team);
-                }
-            }
-        })
+        import Team from './src/view/team.js'
+
+        const app = createApp();
+
         app.component('Navbar', Navbar)
-            .component('TeamAdd', TeamAdd)
-            .component('Teamcard', Teamcard);
+            .component('Team', Team)
         app.mount('#app');
     </script>
 </body>
 
-</html>
\ No newline at end of file
+</html>
+
+<!--Ctrl Maj R-->
\ No newline at end of file
diff --git a/src/misc/constant.js b/src/misc/constant.js
index c1c9af9..fd5147e 100644
--- a/src/misc/constant.js
+++ b/src/misc/constant.js
@@ -1,3 +1,3 @@
 const ERROR_COLOR = 'red';
-const DESCRIPTION_MINIMAL_SIZE = 20;
-const NAME_MINIMAL_SIZE = 5;
\ No newline at end of file
+const DESCRIPTION_MINIMAL_SIZE = 1;
+const NAME_MINIMAL_SIZE = 1;
\ No newline at end of file
diff --git a/src/view/navbar.js b/src/view/navbar.js
index 8f9f476..26b1475 100644
--- a/src/view/navbar.js
+++ b/src/view/navbar.js
@@ -30,5 +30,4 @@ export default {
             <li><a target="_blank" :href="linkResults">Results</a></li>
         </ul>
     `
-
 };
\ No newline at end of file
diff --git a/src/view/team_add.js b/src/view/team-add.js
similarity index 94%
rename from src/view/team_add.js
rename to src/view/team-add.js
index f38e343..6e95c77 100644
--- a/src/view/team_add.js
+++ b/src/view/team-add.js
@@ -1,3 +1,5 @@
+
+
 export default {
     data: function() {
         return {
@@ -31,11 +33,10 @@ export default {
                     throw new StringSize("Name", NAME_MINIMAL_SIZE)
                 }
 
-                console.log(this.description.length)
                 const team = { id: this.id, name: this.name, description: this.description};
                 console.log('form.addTeam', team);
 
-                this.$emit('addTeam', team);
+                this.$emit('teamAjoute', team);
 
                 this.id = '';
                 this.name = '';
@@ -53,7 +54,6 @@ export default {
         }
     },
     template: `<section>
-                <h2>News form</h2>
                 <form @submit.prevent>
                     <div v-bind:style="{ color: errorColor}">{{ errorMessage }}</div>
                     <div>
diff --git a/src/view/team.js b/src/view/team.js
new file mode 100644
index 0000000..ac19ff1
--- /dev/null
+++ b/src/view/team.js
@@ -0,0 +1,34 @@
+import teamAdd from './team-add.js';
+import teamCard from './teamcard.js';
+
+
+export default {
+    data: function() {
+        return {
+            allTeam: []
+        }
+    },
+    methods: {
+        recupTeam: function (team) {
+            console.log('team.addTeam', team);
+            this.allTeam.push(team);
+        }
+    },
+    components: {
+        teamCard,
+        teamAdd
+    },
+    template: `
+        <section>
+            <h2>News form</h2>
+            <div class="team">
+                <teamAdd v-on:teamAjoute="recupTeam"></teamAdd>
+            </div>
+            <teamCard v-for="team in allTeam"
+                      :id="team.id"
+                      :name="team.name"
+                      :description="team.description">
+            </teamCard>
+        </section>
+    `
+}
diff --git a/src/view/teamcard.js b/src/view/teamcard.js
index 28400e9..bd6031e 100644
--- a/src/view/teamcard.js
+++ b/src/view/teamcard.js
@@ -13,6 +13,16 @@ export default {
             require : true
         }
     },
+    data: function () {
+        return {
+            isEdit: false
+        }
+    },
+    methods: {
+        editTeam: function () {
+            this.isEdit = !this.isEdit;
+        }
+    },
     computed: {
         description20(){
             if (this.description.length > 20) {
@@ -21,12 +31,13 @@ export default {
                 return this.description;
               }
             }
-        },
+    },
     template: `
         <div class="team-card">
             <span>ID of the Team : {{ id }}</span>
             <p>Name : {{ name }}</p>
             <p>Description : {{ description20 }}</p>
+            <button name="button" @click="editTeam">Editer</button>
         </div>
     `
 }
\ No newline at end of file