<template>
  <div>

    <p v-show="filtre_choisi.length === 0">{{ texte }}</p>
    <Filtre_Tag v-show="filtre_choisi === 'tags officiels'" @creer_filtre="creer_filtre"/>
    <Filtre_Tag_Libre v-bind:darktheme="darktheme"  v-show="filtre_choisi === 'tags libres' " v-bind:filtreChoisi="filtre_choisi"
                      v-bind:auteur="auteur" @creer_filtre="creer_filtre" v-bind:checkes="checkes" @lignesDropped="lignesDropped"
                      @actionTagLibre="actionTagLibre"/>
    <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_Note_Popularite v-show="filtre_choisi === 'note' " @creer_filtre="creer_filtre" v-bind:deconnexion="deconnexion"/>
    <Filtre_Type_Source v-show="filtre_choisi === 'type / source'" @creer_filtre="creer_filtre" v-bind:deconnexion="deconnexion"/>
    <Filtre_Recherche v-show="filtre_choisi === 'recherche'" @creer_filtre="creer_filtre"></Filtre_Recherche>

  </div>
</template>

<script>

import Filtre_Tag from "../components/filtres/Filtre_Tag";
import Filtre_Auteur from "../components/filtres/Filtre_Auteur";
import Filtre_Date from "../components/filtres/Filtre_Date";
import Filtre_Note_Popularite from "./filtres/Filtre_Note";
import Filtre_Type_Source from "../components/filtres/Filtre_Type_Source";
import Filtre_Tag_Libre from "../components/filtres/Filtre_Tag_Libre";
import Filtre_Recherche from "../components/filtres/Filtre_Recherche";


export default {
  name: "Detail_Contenu",
  components: {
    Filtre_Recherche,
    Filtre_Tag_Libre,
    Filtre_Tag,
    Filtre_Auteur,
    Filtre_Date,
    Filtre_Note_Popularite,
    Filtre_Type_Source
  },
  props: {
    /*  // mode filtre enclenché ou non
      modeFiltre: {},*/
    // information concernant l'ajout d'un filtre
    filtre_choisi: {},
    // auteur
    auteur: {},
    // mode panier enclenché ou non
    panierChoisi: {},
    // Signal de deconnexion
    deconnexion: {},
    // Signal d'activation ou non du theme sombre
    darktheme: {},
    // lignes cochées
    checkes: {}
  },
  methods: {
    /**
     * @vuese
     * Chaine de transmission d'un filtre créé
     */
    creer_filtre: function (event) {
      // Transmet la création d'un filtre
      // @arg filtre le filtre créé
      this.$emit("creer_filtre", {filtre: event})
    },
    /**
     * @vuese
     * Permet de savoir si les lignes sélectionnées ont été déposées sur un tag
     */
    lignesDropped: function () {
      this.$emit("lignesDropped")
    },
    /**
     * @vuese
     * Permet de remonter l'info pour un tag libre associé via drag&drop
     */
    actionTagLibre: function (event) {
      this.$emit("actionTagLibre", {creation: event.creation, id_contenu: event.id_contenu})
    }
  },
  data: function () {
    return {
      texte: "Ajoutez des filtres pour restreindre les contenus de la banque ou du panier en sélectionnant le filtre à appliquer dans la zone de choix ci dessus"
    }
  }
  /*  watch: {
      modeFiltre: function () {
        this.filtre_choisi = ""
      }
    },*/
}
</script>

<style scoped>

</style>