Ajout d'un composant pour charger des fichiers

src/Contenu.vue

@@ -28,9 +28,9 @@ export default {
      * @vuese
      * Transmission de l'information concernant la création d'un nouveau contenu
      */
-    newContenu: function () {
+    newContenu: function (event) {
       // Evenement à destination de Volet_Base
-      this.$emit("newContenu")
+      this.$emit("newContenu", {source: event.source})
 
     },
     /**

src/ImporterFichier.vue

 <template>
-$END$
+<div style="text-align: center">
+
+  Je suis la page pour charger un contenu<br>
+
+  <input type="file" name="fichier" @change="onUploadFiles">
+
+
+
+</div>
 </template>
 
 <script>
+import Service from "./service/Service";
+
 export default {
-name: "ImporterFichier"
+  name: "ImporterFichier",
+  methods: {
+
+     onUploadFiles:  function (event) {
+      const file = event.target.files.item(0)
+       let formData = new FormData();
+       formData.append('file', file);
+       Service.uploaderContenuPerso(formData)
+    }
+  }
 }
 </script>
 

src/Index.vue

@@ -16,6 +16,7 @@
     <Tags v-show="etat === 'Tags'"  ></Tags>
     <p style="text-align: center" v-show="errorLogin">{{errorMessage}}</p>
     <NewContenu v-show="etat === 'newContenu'" v-bind:auteur="auteur" @contenuAjoute="ajouterUnContenu" @retourArriere="retourArriere"></NewContenu>
+    <ImporterFichier v-show="etat === 'importContenu'"></ImporterFichier>
   </div>
 </template>
 
@@ -27,6 +28,7 @@ import Maj from "./Maj";
 import Profil from "./Profil";
 import Tags from "./Tags";
 import NewContenu from "./NewContenu";
+import ImporterFichier from "./ImporterFichier";
 // import Service from "./service/Service";
 // import showdown from "showdown"
 
@@ -93,8 +95,14 @@ export default {
      * @vuese
      * Changement de l'affichage pour passer en mode de création de contenu
      */
-    newContenu: function () {
-      this.etat = "newContenu"
+    newContenu: function (event) {
+      if (event.source === '1') {
+        // alert("event.source : " + event.source)
+        this.etat = "newContenu"
+      } else if (event.source === '2') {
+      this.etat = "importContenu"
+    }
+
     },
     /**
      * @vuese
@@ -127,6 +135,7 @@ export default {
 
   },
   components:{
+    ImporterFichier,
     NewContenu,
     Login,
     Contenu,

src/Maj.vue

@@ -16,21 +16,21 @@
           <tr>
             <th>Titre</th>
             <th>Auteur</th>
-            <th>Version actuelle</th>
-            <th>Date Version actuelle</th>
+            <th>Version courante</th>
+            <th>Date Maj</th>
             <th>Accepter</th>
             <th>Refuser</th>
           </tr>
           <tbody>
 
           <tr  v-for="(item, index) in contenusRecu" :key="index">
-            <td :id="JSON.stringify(item._id)" v-on:click="consulterContenuMaj(item)">Contenu1</td>
+            <td :id="JSON.stringify(item._id)" v-on:click="consulterContenuMaj(item)">{{item.titre}}</td>
             <b-popover :target="JSON.stringify(item._id)"  v-on:show="rechercherTexte(item.idContenuEnCours)" triggers="hover" placement="bottom">
               <p id="beautiful" v-html="texteDuContenu"></p>
             </b-popover>
 
             <td>{{ item.auteurDemande }}</td>
-            <td>prout : {{contenusRecu.length}}</td>
+            <td>{{ item.version_en_cours }}</td>
             <td>01/06/2021</td>
             <td id="valider" v-on:click="gererPublication(item, 'o')"><img v-bind:src="imageCoche"  alt='' height=20 width=20></td>
             <td id="refuser" v-on:click="gererPublication(item, 'n')"><img v-bind:src="imageCroix"   alt='' height=20 width=20></td>
@@ -54,7 +54,7 @@
 
             <th>Titre</th>
             <th>Auteur</th>
-            <th>Version proposée</th>
+            <th>Version courante</th>
             <th>Date Version proposée</th>
             <th>Etat</th>
             <th>Conserver</th>
@@ -65,8 +65,8 @@
           <tbody>
 
           <tr  v-for="(item, index) in contenusPropose" :key="index">
-            <td :id="JSON.stringify(item._id)" v-on:click="consulterContenuMaj(item)">Contenu1</td>
-            <b-popover :target="JSON.stringify(item._id)"  v-on:show="rechercherTexte(item._id, 'banque')" triggers="hover" placement="bottom">
+            <td :id="JSON.stringify(item._id)" v-on:click="consulterContenuMaj(item)">{{item.titre}}</td>
+            <b-popover :target="JSON.stringify(item._id)"  v-on:show="rechercherTexte(item.idContenuEnCours)" triggers="hover" placement="bottom">
               <p v-html="texteDuContenu"></p>
             </b-popover>
             <td>{{ item.auteurContenu }}</td>
@@ -169,10 +169,7 @@ export default {
       // auteurContenu -> undefined == nous sommes sur une maj tiers. Le cas contraire = maj d'un contenu perso à faire
       if (item.auteurContenu === undefined) {
 
-        let test = item._id
-        console.log("id item")
-        console.log(test)
-        data = {id_tiers: JSON.stringify(item._id), reponse: reponse, auteur: this.auteur}
+        data = {id_tiers: JSON.stringify(item._id), reponse: reponse, auteur: this.auteur, titre: item.titre}
         Service.gererMajTiers(data).then(function () {
           that.contenusRecu = that.contenusRecu.filter(contenu => contenu._id !== item._id)
           if (that.isContenuMajVide() )
@@ -211,7 +208,6 @@ export default {
         let reception = response.data
         that.contenusRecu = []
 
-
         for (let i = 0; i < reception.length; i++) {
           if (reception[i].etat === "enCours") {
             that.contenusRecu.push(reception[i])

src/components/Volet_Base.vue

@@ -86,8 +86,8 @@
             </b-popover>
             <td>{{ item.auteur }}</td>
             <td>{{item.versionEnCours.numero}}</td>
-            <td>{{item.versionEnCours}}</td>
-            <td class="prout">{{item.versionEnCours}}</td>
+            <td>{{item.versionEnCours.date}}</td>
+            <td class="prout">{{item.versionEnCours.popularite}}</td>
             <td>{{item.note}}</td>
             <td v-b-popover.hover.bottom="item.tags_banque_fixes.toString()">{{item.tags_banque_fixes.toString()}}</td>
 
@@ -107,7 +107,12 @@
     <Modifier_Contenu v-bind:auteur="auteur" v-bind:texteDuContenu = "texteDuContenu" v-bind:contenuCliqueProvenance = "contenuCliqueProvenance"
                       v-show="!modeConsultation && modeModification" @choixModif="choixModif" v-bind:titreContenu="titreContenu"/>
 
-    <div v-show="panierChoisi && !modeConsultation" class="circle" v-on:click="ajouterContenu" v-bind:style="{'margin-left': '95%'}">
+    <div id="ajouterContenu" v-show="panierChoisi && !modeConsultation" class="circle"  v-bind:style="{'margin-left': '95%'}">
+      <b-popover target="ajouterContenu" triggers="click" placement="lefttop">
+        <template #title>Choix : </template>
+        <button v-on:click="ajouterContenu('1')" v-bind:style="'height: auto; width: auto'">1. Créer un markdown</button>
+        <button v-on:click="ajouterContenu('2')" v-bind:style="'height: auto; width: auto'">2. Importer un xml moodle</button>
+      </b-popover>
     </div>
   </div>
 </template>
@@ -338,9 +343,9 @@ export default {
      * @vuese
      * Evenement pour lancer le composant de création de contenu
      */
-    ajouterContenu: function () {
+    ajouterContenu: function (nombre) {
       // Evenement pour lancer le composant de création de contenu
-      this.$emit("newContenu")
+      this.$emit("newContenu", {source: nombre})
     },
     /**
      * @vuese

src/service/Service.js

@@ -44,6 +44,14 @@ export default {
     creerContenuPerso(data) {
         return axios.post(urlBase + contenus + "addContenu", data, this.getHeader(localStorage.token))
     },
+    uploaderContenuPerso(data){
+        return axios.post(urlBase + contenus + "uploadContenu", data, {
+            headers: {
+                'Content-Type': 'multipart/form-data',
+                Authorization: "Bearer " + localStorage.token,
+            }
+        })
+    },
     creerContenuTiers(data) {
         return axios.patch(urlBase + contenus + "ajouterTiers", data, this.getHeader(localStorage.token))
     },