Commit 2076cd5f authored by Jérémie Passerat's avatar Jérémie Passerat

Sauvegarde tests filtre_libre avant test plugin

parent c859fdd7
...@@ -66,9 +66,11 @@ export default { ...@@ -66,9 +66,11 @@ export default {
function (reponse) { function (reponse) {
let nouveauContenu = reponse.data let nouveauContenu = reponse.data
nouveauContenu.provenance = "perso" nouveauContenu.provenance = "perso"
nouveauContenu.tags_libres = []
that.$emit("contenuAjoute", {contenu: nouveauContenu}) that.$emit("contenuAjoute", {contenu: nouveauContenu})
that.contenuSaisi = '' that.contenuSaisi = ''
that.retourArriere(true) that.retourArriere(true)
that.isCreation = false
} }
) )
}, },
......
...@@ -5,62 +5,139 @@ ...@@ -5,62 +5,139 @@
<label>Choisir le tag de niveau 1</label><br><br> <label>Choisir le tag de niveau 1</label><br><br>
<select @change="niveau1()" v-model="tagUn"> <select @change="niveau1()" v-model="tagUn">
<option>Tag1.1</option> <option>Tag1</option>
<option>Tag1.2</option> <option>Tag2</option>
<option>Tag1.3</option> <option>Tag3</option>
</select><br><br> </select><br><br>
<label>Choisir le tag de niveau 2</label><br><br> <label>Choisir le tag de niveau 2</label><br><br>
<select @change="niveau2()" :disabled="niveauDeux === 0" v-model="tagDeux"> <select @change="niveau2()" :disabled="niveauDeux === 0" v-model="tagDeux">
<option v-for="i in 3" :key="i">{{tagUn}}.{{ i }}</option>
<option v-for="i in 3" :key="i">{{tagUn}}{{ i }}</option>
</select><br><br> </select><br><br>
<label>Choisir le tag de niveau 3</label><br><br> <label>Choisir le tag de niveau 3</label><br><br>
<select @change="niveau3()" :disabled="niveauTrois === 0" v-model="tagTrois"> <select @change="niveau3()" :disabled="niveauTrois === 0" v-model="tagTrois">
<option v-for="i in 5" :key="i">{{tagDeux}}{{ i }}</option> <option v-for="i in 5" :key="i">{{tagDeux}}.{{ i }}</option>
</select><br><br> </select><br><br>
<!-- <button v-on:click="validerTags">Valider</button>--> <button v-on:click="validerTags" :disabled="validationTags === 0">Valider</button>
<p>{{ tagsModifies }}</p>
</div> </div>
</template> </template>
<script> <script>
import Service from "./service/Service";
export default { export default {
name: "TagsFixes", name: "TagsFixes",
data: function(){ data: function(){
return { return {
niveauDeux: 0, niveauDeux: 0,
niveauTrois: 0, niveauTrois: 0,
validationTags: 0,
tagUn: '', tagUn: '',
tagDeux: '', tagDeux: '',
tagTrois: '' tagTrois: '',
tagsModifies: ''
} }
}, },
props: {
// permet de déterminer quand le composant est appelé en mode "Modifier_Contenu"
isModif: {},
// les tags "banque" du contenu
tagsBanque: {},
// l'id du contenu cliqué
id_contenu: {}
},
methods:{ methods:{
validerTags: function () { validerTags: function () {
this.$emit("tags", {tags: []})
let tagsChoisis = [this.tagUn]
if (this.tagDeux !== "")
tagsChoisis.push(this.tagDeux)
if (this.tagTrois !== "")
tagsChoisis.push(this.tagTrois)
if (this.tagsBanque === undefined) {
this.$emit("tags", {tags: tagsChoisis})
}
else {
let data = {id_contenu: JSON.stringify(this.id_contenu), tags: tagsChoisis}
Service.modifierTagsFixes(data)
this.tagsModifies = "tags modifiés"
}
}, },
/** /**
* @vuese * @vuese
Quand le 1er tag est choisi, on débloque le 2e tag Quand le 1er tag est choisi, on débloque le 2e tag
*/ */
niveau1: function () { niveau1: function () {
this.validationTags = 1
// si on est en mode "création de contenu", on débloque seulement le 2e étage de l'arborescence
if (this.tagsBanque === undefined){
this.niveauDeux = 1 this.niveauDeux = 1
}
else {
alert("Je le suis ici")
// si on est dans le mode modification de contenu, on efface les tags hiérarchiquement inférieurs et on bloque l'échelon 3
// this.niveauDeux = 0
//alert(this.niveauTrois)
this.niveauTrois = 0
//console.log(this.niveauTrois)
}
}, },
/** /**
* @vuese * @vuese
* Quand le 2e tag est choisi, on débloque le 3e tag * Quand le 2e tag est choisi, on débloque le 3e tag
*/ */
niveau2: function () { niveau2: function () {
// dans tous les cas, on débloque le 3e échelon
this.niveauTrois = 1 this.niveauTrois = 1
if (this.tagsBanque !== []){
// si on est dans le mode modification de contenu, on efface le tag du niveau 3
this.tagTrois = ""
}
}, },
/** /**
* @vuese * @vuese
* QUand le 3e tag est choisi, on renvoie les infos à NewContenu ou à ImporterFichier * QUand le 3e tag est choisi, ̶o̶n̶ ̶r̶e̶n̶v̶o̶i̶e̶ ̶l̶e̶s̶ ̶i̶n̶f̶o̶s̶ ̶à̶ ̶N̶e̶w̶C̶o̶n̶t̶e̶n̶u̶ ̶o̶u̶ ̶à̶ ̶I̶m̶p̶o̶r̶t̶e̶r̶F̶i̶c̶h̶i̶e̶r̶ on a rien à faire
*/ */
niveau3: function () { niveau3: function () {
//alert("en haut et en bas") /* //alert("en haut et en bas")
if (this.tagsBanque === [])
this.$emit("tags", {tags: [this.tagUn, this.tagDeux, this.tagTrois]}) this.$emit("tags", {tags: [this.tagUn, this.tagDeux, this.tagTrois]})
else{
// si on est ici c'est qu'on veut changer les tags d'un contenu
// on doit vérifier qu'aucun trou ne soit apparu dans les tags
alert("les nouveaux tags sont: " + this.tagUn + " " + this.tagDeux + " " + this.tagTrois)
}*/
}
},
watch: {
isModif: function () {
/* this.niveauDeux = 1
this.niveauTrois = 1
this.validationTags = 1*/
},
tagsBanque: function () {
// alert("Mais oui")
this.tagsModifies = ""
this.validationTags = 1
this.niveauDeux = 1
alert(this.tagsBanque.length)
this.tagUn = this.tagsBanque[0]
if (this.tagsBanque.length > 1){
//ert("Hihi")
this.tagDeux = this.tagsBanque[1]
this.niveauTrois = 1
}
if (this.tagsBanque.length === 3){
//alert("Huhu")
this.tagTrois = this.tagsBanque[2]
}
} }
} }
} }
......
...@@ -19,19 +19,25 @@ ...@@ -19,19 +19,25 @@
<input type="text" placeholder="tag a créer" v-model="nouveauTag"> <input type="text" placeholder="tag a créer" v-model="nouveauTag">
<button id="creerTag" v-on:click="creerTag"></button> <button id="creerTag" v-on:click="creerTag"></button>
</div> </div>
<p>----------------------------------------------------------------------------</p>
<TagsFixes v-bind:isModif="isModif" v-bind:tagsBanque="tagsBanque" v-bind:id_contenu="id_contenu"></TagsFixes>
</div> </div>
</template> </template>
<script> <script>
import Service from "./service/Service"; import Service from "./service/Service";
import TagsFixes from "@/TagsFixes";
export default { export default {
name: "TagsLibres", name: "TagsLibres",
components: {TagsFixes},
props: { props: {
// récupération du contenu cliqué // récupération du contenu cliqué
contenu: {}, contenu: {},
// récupération de l'auteur // récupération de l'auteur
auteur: {} auteur: {},
// provenance du contenu
contenuCliqueProvenance: {}
}, },
methods:{ methods:{
ajouterLeTag: function () { ajouterLeTag: function () {
...@@ -67,12 +73,18 @@ export default { ...@@ -67,12 +73,18 @@ export default {
tagsLibres: [], tagsLibres: [],
tagsDeAuteur: [], tagsDeAuteur: [],
ajouterTagExistant: '', ajouterTagExistant: '',
nouveauTag: '' nouveauTag: '',
isModif: false,
tagsBanque: [],
id_contenu: ''
} }
}, },
watch:{ watch:{
contenu: function () { contenu: function () {
let that = this let that = this
this.isModif = true
this.tagsBanque = this.contenu.tags_fixes
this.id_contenu = this.contenu._id
//this.tagsLibres = this.contenu.tags_libres //this.tagsLibres = this.contenu.tags_libres
Service.recupererTagLibre(this.auteur).then(function (response) { Service.recupererTagLibre(this.auteur).then(function (response) {
that.tagsDeAuteur = response.data that.tagsDeAuteur = response.data
......
...@@ -32,6 +32,8 @@ ...@@ -32,6 +32,8 @@
<p v-if="contenuCliqueProvenance!=='en-cours'">Source du contenu : {{sourceContenu}}</p> <p v-if="contenuCliqueProvenance!=='en-cours'">Source du contenu : {{sourceContenu}}</p>
<p v-if="contenuCliqueProvenance!=='en-cours'">Note du contenu (v {{versionChoisie}}) : {{noteContenu}}</p> <p v-if="contenuCliqueProvenance!=='en-cours'">Note du contenu (v {{versionChoisie}}) : {{noteContenu}}</p>
<p v-if="contenuCliqueProvenance!=='en-cours'">Popularite du contenu : {{populariteContenu}}</p> <p v-if="contenuCliqueProvenance!=='en-cours'">Popularite du contenu : {{populariteContenu}}</p>
<p v-if="contenuCliqueProvenance!=='en-cours'">Tags associés au contenu : {{tagsContenus}}</p>
<p> Voici l'intérieur de votre contenu dans sa version {{versionChoisie}} : </p> <p> Voici l'intérieur de votre contenu dans sa version {{versionChoisie}} : </p>
<span contenteditable="false" v-html="formatterMarkdown()"> <span contenteditable="false" v-html="formatterMarkdown()">
</span> </span>
...@@ -149,7 +151,8 @@ export default { ...@@ -149,7 +151,8 @@ export default {
typeContenu: '', typeContenu: '',
sourceContenu: '', sourceContenu: '',
populariteContenu: 0, populariteContenu: 0,
noteContenu: 0 noteContenu: 0,
tagsContenus: []
} }
}, },
computed: { computed: {
...@@ -165,6 +168,7 @@ export default { ...@@ -165,6 +168,7 @@ export default {
this.titreContenu = this.contenuClique.titre this.titreContenu = this.contenuClique.titre
this.populariteContenu = this.contenuClique.popularite this.populariteContenu = this.contenuClique.popularite
this.tagsContenus = this.contenuClique.tags_fixes.join(", ")
this.isContenuRefuse = false this.isContenuRefuse = false
......
...@@ -2,7 +2,8 @@ ...@@ -2,7 +2,8 @@
<div> <div>
<p v-show="filtre_choisi.length === 0">{{ texte }}</p> <p v-show="filtre_choisi.length === 0">{{ texte }}</p>
<Filtre_Tag v-show="filtre_choisi === 'tags officiels' || filtre_choisi === 'tags libres' " v-bind:filtreChoisi="filtre_choisi" @creer_filtre="creer_filtre"/> <Filtre_Tag v-show="filtre_choisi === 'tags officiels'" @creer_filtre="creer_filtre"/>
<Filtre_Tag_Libre v-show="filtre_choisi === 'tags libres' " v-bind:filtreChoisi="filtre_choisi" v-bind:auteur="auteur" @creer_filtre="creer_filtre"/>
<Filtre_Auteur v-bind:panierChoisi="panierChoisi" v-show="filtre_choisi === 'auteur'" v-bind:auteur="auteur" @creer_filtre="creer_filtre"/> <Filtre_Auteur v-bind:panierChoisi="panierChoisi" v-show="filtre_choisi === 'auteur'" v-bind:auteur="auteur" @creer_filtre="creer_filtre"/>
<Filtre_Date v-show="filtre_choisi === 'date' " @creer_filtre="creer_filtre"/> <Filtre_Date v-show="filtre_choisi === 'date' " @creer_filtre="creer_filtre"/>
<Filtre_Note_Popularite v-show="filtre_choisi === 'note' " @creer_filtre="creer_filtre" v-bind:deconnexion="deconnexion"/> <Filtre_Note_Popularite v-show="filtre_choisi === 'note' " @creer_filtre="creer_filtre" v-bind:deconnexion="deconnexion"/>
...@@ -18,12 +19,14 @@ import Filtre_Auteur from "../components/filtres/Filtre_Auteur"; ...@@ -18,12 +19,14 @@ import Filtre_Auteur from "../components/filtres/Filtre_Auteur";
import Filtre_Date from "../components/filtres/Filtre_Date"; import Filtre_Date from "../components/filtres/Filtre_Date";
import Filtre_Note_Popularite from "./filtres/Filtre_Note"; import Filtre_Note_Popularite from "./filtres/Filtre_Note";
import Filtre_Type_Source from "../components/filtres/Filtre_Type_Source"; import Filtre_Type_Source from "../components/filtres/Filtre_Type_Source";
import Filtre_Tag_Libre from "@/components/filtres/Filtre_Tag_Libre";
export default { export default {
name: "Detail_Contenu", name: "Detail_Contenu",
components: { components: {
Filtre_Tag_Libre,
Filtre_Tag, Filtre_Tag,
Filtre_Auteur, Filtre_Auteur,
Filtre_Date, Filtre_Date,
......
...@@ -84,6 +84,10 @@ export default { ...@@ -84,6 +84,10 @@ export default {
*/ */
nouveau_filtre: function(newVal) { // watch it nouveau_filtre: function(newVal) { // watch it
if (newVal.filtre.filtre.length === 0){
return
}
if (this.filtres_Choisis.length > 0){ if (this.filtres_Choisis.length > 0){
if (this.filtreDejaPresent(newVal.filtre.filtre)){ if (this.filtreDejaPresent(newVal.filtre.filtre)){
return return
......
...@@ -9,6 +9,7 @@ ...@@ -9,6 +9,7 @@
v-show="!modeModification && !modeConsultation" v-on:click="changerVariante">{{ texteBoutonvariante }}</button> v-show="!modeModification && !modeConsultation" v-on:click="changerVariante">{{ texteBoutonvariante }}</button>
<br> <br>
<div id="ensembleVolet">
<button id="boutonVolet" v-on:click="desactiverVolet" v-bind:style="{'margin-top': '0%'}"></button> <button id="boutonVolet" v-on:click="desactiverVolet" v-bind:style="{'margin-top': '0%'}"></button>
<div class="full" id="volet" v-bind:style="darktheme ? {'border-color': 'white'} : {'border-color': 'black'}" v-show="isActif"> <div class="full" id="volet" v-bind:style="darktheme ? {'border-color': 'white'} : {'border-color': 'black'}" v-show="isActif">
<Volet_Menu v-bind:darktheme="darktheme" v-bind:panierChoisi = "panierChoisi" @filtre_choisi="passerFiltre" @basculeRechercheFiltre="basculeRechercheFiltre"/> <Volet_Menu v-bind:darktheme="darktheme" v-bind:panierChoisi = "panierChoisi" @filtre_choisi="passerFiltre" @basculeRechercheFiltre="basculeRechercheFiltre"/>
...@@ -17,6 +18,7 @@ ...@@ -17,6 +18,7 @@
v-bind:modeFiltre="modeFiltre" v-bind:deconnexion="deconnexion" /> v-bind:modeFiltre="modeFiltre" v-bind:deconnexion="deconnexion" />
</div> </div>
</div> </div>
</div>
<div id="tableau" :class="darktheme ? 'tableaudark' : ''" :style="isActif ? {width: '90%'} : {width: '98%'}" > <div id="tableau" :class="darktheme ? 'tableaudark' : ''" :style="isActif ? {width: '90%'} : {width: '98%'}" >
<div class="choixPanier" v-show="panierChoisi && (!modeModification && !modeConsultation)"> <div class="choixPanier" v-show="panierChoisi && (!modeModification && !modeConsultation)">
...@@ -285,7 +287,7 @@ export default { ...@@ -285,7 +287,7 @@ export default {
* Permet de rendre le volet latéral bougeable à la souris * Permet de rendre le volet latéral bougeable à la souris
*/ */
this.modeModification = false this.modeModification = false
$('#ensemble').draggable() $('#ensembleVolet').draggable()
}, },
methods: { methods: {
/** /**
...@@ -738,12 +740,19 @@ export default { ...@@ -738,12 +740,19 @@ export default {
} }
if (event.filtres.filter(contenu => contenu.type === 'tags libres').length > 0) { if (event.filtres.filter(contenu => contenu.type === 'tags libres').length > 0) {
// tags libres // tags libres
let filtre_tags_libres = (event.filtres.filter(contenu => contenu.type === 'tags libres').map(contenu => contenu.filtre)) let filtre_tags_libres = (event.filtres.filter(contenu => contenu.type === 'tags libres').map(contenu => contenu.filtre))
contenusFiltres.forEach(contenu => console.log(contenu.tags_libres.length))
for (let i = 0; i < filtre_tags_libres.length; i++) { for (let i = 0; i < filtre_tags_libres.length; i++) {
if(filtre_tags_libres[i] === 'Contenu Sans Tag'){
contenusFiltres = contenusFiltres.filter(contenu => contenu.tags_libres.length === 0)
} else {
contenusFiltres = contenusFiltres.filter(contenu => contenu.tags_libres.includes(filtre_tags_libres[i])) contenusFiltres = contenusFiltres.filter(contenu => contenu.tags_libres.includes(filtre_tags_libres[i]))
} }
} }
}
if (event.filtres.filter(contenu => contenu.type === 'tags officiels').length > 0) { if (event.filtres.filter(contenu => contenu.type === 'tags officiels').length > 0) {
// tags officiels // tags officiels
let filtre_tags_fixes = (event.filtres.filter(contenu => contenu.type === 'tags officiels').map(contenu => contenu.filtre)) let filtre_tags_fixes = (event.filtres.filter(contenu => contenu.type === 'tags officiels').map(contenu => contenu.filtre))
......
<template> <template>
<div> <div>
<ul id="arborescence" class="menuNonFinal"> <ul id="arborescence" class="menuNonFinal">
<li class="element" v-on:click="naviguer"><span class="niveau"></span>Menu1</li> <li class="element" v-on:click="naviguer"><span class="niveau"></span>Tag1</li>
<ul class="cache menuNonFinal"> <ul class="cache menuNonFinal">
<li class="element" v-on:click="naviguer"><span class="niveau"></span>Sous Menu 1</li> <li class="element" v-on:click="naviguer"><span class="niveau"></span>Tag1.1</li>
<ul class="cache"> <ul class="cache">
<li class="element" v-on:click="nouveauFiltre">Water</li> <li class="element" v-on:click="nouveauFiltre">Tag1.1.1</li>
<li class="element" v-on:click="nouveauFiltre">Coffee</li> <li class="element" v-on:click="nouveauFiltre">Tag1.1.2</li>
<li class="element" v-on:click="nouveauFiltre">Tag1.1.3</li>
<li class="element" v-on:click="nouveauFiltre">Tag1.1.4</li>
<li class="element" v-on:click="nouveauFiltre">Tag1.1.5</li>
</ul> </ul>
<li class="element" v-on:click="naviguer"><span class="niveau"></span>Sous Menu 2</li> <li class="element" v-on:click="naviguer"><span class="niveau"></span>Tag1.2</li>
<ul class="cache"> <ul class="cache">
<li class="element" v-on:click="nouveauFiltre">Water</li> <li class="element" v-on:click="nouveauFiltre">Tag1.2.1</li>
<li class="element" v-on:click="nouveauFiltre">Coffee</li> <li class="element" v-on:click="nouveauFiltre">Tag1.2.2</li>
<li class="element" v-on:click="nouveauFiltre">Tag1.2.3</li>
<li class="element" v-on:click="nouveauFiltre">Tag1.2.4</li>
<li class="element" v-on:click="nouveauFiltre">Tag1.2.5</li>
</ul>
<li class="element" v-on:click="naviguer"><span class="niveau"></span>Tag1.3</li>
<ul class="cache">
<li class="element" v-on:click="nouveauFiltre">Tag1.3.1</li>
<li class="element" v-on:click="nouveauFiltre">Tag1.3.2</li>
<li class="element" v-on:click="nouveauFiltre">Tag1.3.3</li>
<li class="element" v-on:click="nouveauFiltre">Tag1.3.4</li>
<li class="element" v-on:click="nouveauFiltre">Tag1.3.5</li>
</ul> </ul>
</ul> </ul>
<li class="element" v-on:click="naviguer"><span class="niveau"></span>Menu2</li> <li class="element" v-on:click="naviguer"><span class="niveau"></span>Tag2</li>
<ul class="cache menuNonFinal"> <ul class="cache menuNonFinal">
<li class="element" v-on:click="naviguer"><span class="niveau"></span>Sous Menu 1</li> <li class="element" v-on:click="naviguer"><span class="niveau"></span>Tag2.1</li>
<ul class="cache">
<li class="element" v-on:click="nouveauFiltre">Tag2.1.1</li>
<li class="element" v-on:click="nouveauFiltre">Tag2.1.2</li>
<li class="element" v-on:click="nouveauFiltre">Tag2.1.3</li>
<li class="element" v-on:click="nouveauFiltre">Tag2.1.4</li>
<li class="element" v-on:click="nouveauFiltre">Tag2.1.5</li>
</ul>
<li class="element" v-on:click="naviguer"><span class="niveau"></span>Tag2.2</li>
<ul class="cache"> <ul class="cache">
<li class="element" v-on:click="nouveauFiltre">Water</li> <li class="element" v-on:click="nouveauFiltre">Tag2.2.1</li>
<li class="element" v-on:click="nouveauFiltre">Coffee</li> <li class="element" v-on:click="nouveauFiltre">Tag2.2.2</li>
<li class="element" v-on:click="nouveauFiltre">Tag2.2.3</li>
<li class="element" v-on:click="nouveauFiltre">Tag2.2.4</li>
<li class="element" v-on:click="nouveauFiltre">Tag2.2.5</li>
</ul> </ul>
<li class="element" v-on:click="naviguer"><span class="niveau"></span>Sous Menu 2</li> <li class="element" v-on:click="naviguer"><span class="niveau"></span>Tag2.3</li>
<ul class="cache"> <ul class="cache">
<li class="element" v-on:click="nouveauFiltre">Water</li> <li class="element" v-on:click="nouveauFiltre">Tag2.3.1</li>
<li class="element" v-on:click="nouveauFiltre">Coffee</li> <li class="element" v-on:click="nouveauFiltre">Tag2.3.2</li>
<li class="element" v-on:click="nouveauFiltre">Tag2.3.3</li>
<li class="element" v-on:click="nouveauFiltre">Tag2.3.4</li>
<li class="element" v-on:click="nouveauFiltre">Tag2.3.5</li>
</ul> </ul>
</ul> </ul>
<li class="element" v-on:click="naviguer"><span class="niveau"></span>Menu3</li> <li class="element" v-on:click="naviguer"><span class="niveau"></span>Tag3</li>
<ul class="cache menuNonFinal"> <ul class="cache menuNonFinal">
<li class="element" v-on:click="naviguer"><span class="niveau"></span>Sous Menu 1</li> <li class="element" v-on:click="naviguer"><span class="niveau"></span>Tag3.1</li>
<ul class="cache"> <ul class="cache">
<li class="element" v-on:click="nouveauFiltre">Water</li> <li class="element" v-on:click="nouveauFiltre">Tag3.1.1</li>
<li class="element" v-on:click="nouveauFiltre">Coffee</li> <li class="element" v-on:click="nouveauFiltre">Tag3.1.2</li>
<li class="element" v-on:click="nouveauFiltre">Tag3.1.3</li>
<li class="element" v-on:click="nouveauFiltre">Tag3.1.4</li>
<li class="element" v-on:click="nouveauFiltre">Tag3.1.5</li>
</ul> </ul>
<li class="element" v-on:click="naviguer"><span class="niveau"></span>Sous Menu 2</li> <li class="element" v-on:click="naviguer"><span class="niveau"></span>Tag3.2</li>
<ul class="cache"> <ul class="cache">
<li class="element" v-on:click="nouveauFiltre">Water</li> <li class="element" v-on:click="nouveauFiltre">Tag3.1.1</li>
<li class="element" v-on:click="nouveauFiltre">Coffee</li> <li class="element" v-on:click="nouveauFiltre">Tag3.1.2</li>
<li class="element" v-on:click="nouveauFiltre">Tag3.1.3</li>
<li class="element" v-on:click="nouveauFiltre">Tag3.1.4</li>
<li class="element" v-on:click="nouveauFiltre">Tag3.1.5</li>
</ul>
<li class="element" v-on:click="naviguer"><span class="niveau"></span>Tag3.3</li>
<ul class="cache">
<li class="element" v-on:click="nouveauFiltre">Tag3.1.1</li>
<li class="element" v-on:click="nouveauFiltre">Tag3.1.2</li>
<li class="element" v-on:click="nouveauFiltre">Tag3.1.3</li>
<li class="element" v-on:click="nouveauFiltre">Tag3.1.4</li>
<li class="element" v-on:click="nouveauFiltre">Tag3.1.5</li>
</ul> </ul>
</ul> </ul>
</ul> </ul>
...@@ -50,10 +92,7 @@ ...@@ -50,10 +92,7 @@
export default { export default {
name: "Filtre_Tag", name: "Filtre_Tag",
props: {
// permet de déterminer si on est en mode tag_libre ou tag_fixe
filtreChoisi: {}
},
methods: { methods: {
naviguer: function (e) { naviguer: function (e) {
if (e.offsetX > e.target.offsetLeft) { if (e.offsetX > e.target.offsetLeft) {
......
<template>
<div>
<ul id="arborescenceLibre" class="menuNonFinal">
<li><span class="nouveauTagLibre" @click="ajouterTagLibre">nouveau tag libre</span></li>
<li v-show="nouveauTagLibre"><span class="niveauInamovible"></span>
<input type="text" style="width: 150px; height: 20px"></li>
<li v-on:click="nouveauFiltre" ><span class="niveauInamovible"></span>Contenu Sans Tag</li>
<ul v-for="filtre in filtresLibres" :key="filtre" class="tagsLibres">
<li v-on:click="nouveauFiltre"><span class="niveauInamovible"></span>{{ filtre }}
<span class="poubel" @click="supprimerTagLibre"></span><span class="nouvelEchelon" @click="ajouterTagLibre"></span></li>
</ul>
</ul>
</div>
</template>
<script>
import Service from "../../service/Service";
export default {
name: "Filtre_Tag_Libre",
props: {
// permet de déterminer si on est en mode tag_libre ou tag_fixe
filtreChoisi: {},
// l'auteur en cours
auteur: {}
},
data: function () {
return {
filtresLibres: [],
nouveauTagLibre: false
}
},
methods: {
naviguer: function (e) {
if (e.offsetX > e.target.offsetLeft) {
//alert(e.target.text())
//alert("Je veux mettre" + e.target.innerText + "en filtre")
this.$emit("creer_filtre", {filtre: e.target.innerText, type: this.filtreChoisi})
}
else{
e.target.classList.toggle("niveau-down")
e.target.parentNode.nextElementSibling.classList.toggle('affiche')
}
},
nouveauFiltre: function (e) {
this.$emit("creer_filtre", {filtre: e.target.innerText, type: this.filtreChoisi})
},
supprimerTagLibre: function (e) {
this.filtresLibres = this.filtresLibres.filter(filtre => filtre !== e.target.parentNode.innerText.trim())
},
ajouterTagLibre: function (e) {
let tagRacine = e.target.parentNode.innerText
if (tagRacine === "nouveau tag libre"){
this.nouveauTagLibre = !this.nouveauTagLibre
} else {
let ul = document.createElement('ul')
ul.className = "tags libres"
let li = document.createElement('li')
li.append(document.createTextNode("prute"))
ul.appendChild(li)
e.target.parentNode.parentNode.appendChild(ul)
}
}
},
watch: {
filtreChoisi: function () {
let that = this
Service.recupererTagLibre(this.auteur).then(function (response) {
that.filtresLibres = response.data
})
}
}
}
</script>
<style scoped>
.menuNonFinal {
list-style-type: none;
}
.tagsLibres {
list-style-type: none;
padding-inline-start: 0px;
}
#arborescence {
padding: 4px;
text-align: left;
margin: 0 0 0 10px;
}
.niveau {
user-select: text;
}
body {
cursor: pointer;
}
.niveau::before {
content: "\25B6";
color: black;
display: inline-block;
margin-left: 2px;
margin-right: 4px;
}
.niveauInamovible::before {
content: "\23F9";
color: black;
display: inline-block;
margin-left: 2px;
margin-right: 4px;
padding-bottom: -50px;
}
.poubel::before {
content: "\01F5D1";
color: black;
display: inline-block;
margin-left: 2px;
margin-right: 4px;
}
.nouveauTagLibre::before {
content: "\002295 ";
color: black;
display: inline-block;
margin-left: 2px;
margin-right: 4px;
margin-top: -50px;
}
.nouvelEchelon::before {
content: "\002B";
color: black;
display: inline-block;
margin-left: 2px;
margin-right: 4px;
padding-bottom: -50px;
}
.niveau-down::before {
transform: rotate(90deg);
}
.cache {
display: none;
}
.affiche {
display: block;
}
.element{
display: flex;
}
li {
width: fit-content;
}
</style>
\ No newline at end of file
...@@ -130,6 +130,9 @@ export default { ...@@ -130,6 +130,9 @@ export default {
supprimerTagLibre(auteur, tag){ supprimerTagLibre(auteur, tag){
return axios.delete(urlBase + contenus + "supprimerTagLibre?auteur=" + auteur + "&tag=" + tag, this.getHeader(localStorage.token)) return axios.delete(urlBase + contenus + "supprimerTagLibre?auteur=" + auteur + "&tag=" + tag, this.getHeader(localStorage.token))
}, },
modifierTagsFixes(data) {
return axios.patch(urlBase + contenus + "modifierTags", data, this.getHeader(localStorage.token))
},
// gestion des en-cours // gestion des en-cours
creerEnCours(data) { creerEnCours(data) {
return axios.post(urlBase + en_cours + "newEnCours", data, this.getHeader(localStorage.token)) return axios.post(urlBase + en_cours + "newEnCours", data, this.getHeader(localStorage.token))
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment