const $ = (id) => document.getElementById(id);

const tableau_entre = new Tabulator("#tableau-stock-entree", {
    columns: [
        {title: "Produit", field: "produit"},
        {title: "Catégorie", field: "categorie"},
        {title: "Conditionnement", field: "conditionnement"},
        {title: "Fournisseur", field: "fournisseur"},
        {title: "Date de commande", field: "date_commande"},
        {title: "Date de livraison", field: "date_livraison"},
        {title: "Quantité commandée", field: "quantite_commander"},
    ],
})

const tableau_sortie = new Tabulator("#tableau-stock-sortie", {
    columns: [
        {title: "Produit", field: "produit"},
        {title: "Catégorie", field: "categorie"},
        {title: "Conditionnement", field: "conditionnement"},
        {title: "Date de la demande", field: "date_demande"},
        // {title: "Date de mise à disposition", field: "date_mise_a_dispo"},
        {title: "Quantité demandée", field: "quantite_demander"},
    ]
})

const filtreMois = $("filtreMois");

filtreMois.addEventListener("change", function () {
    tableau_entre.setData(`${filtreMois.dataset.url}`, {
        dateFiltre: filtreMois.value,
        typeFiltre: $("type_operation").value 
    })

    tableau_sortie.setData(`${filtreMois.dataset.url}`, {
        dateFiltre: filtreMois.value,
        typeFiltre: $("type_operation").value 
    })
})

$("type_operation").addEventListener("change", function () {
    if(this.value === "entree"){
        $("tableau-stock-entree").style.display = "";
        $("tableau-stock-sortie").style.display = "none";
    }
})

$("type_operation").addEventListener("change", function () {
    if(this.value === "sortie"){
        $("tableau-stock-entree").style.display = "none";
        $("tableau-stock-sortie").style.display = "";
    }
})