<link rel="stylesheet" href="css/dragAndDrop.css">

<header class="d-flex flex-column flex-md-row align-items-md-center p-3 bg-light ">
    <h2 class="bd-title" id="content">
        <span>Base ProWeb : Importer un fichier Excel</span>
    </h2>
</header>
<?php   
        echo core::filAriane(array(
            "current" => "Liste des salariés", 
            "arbo" => array( 
                "Proweb" => NULL,
                "Liste des salariés" => "/proweb-salaries.html",
                "Importer un fichier Excel (base Proweb)" => "/proweb-salaries-upload.html")
        )); 
?>
<br />
<form action="/submit.php" method="post" enctype="multipart/form-data" onsubmit="loading()">
    <input type="hidden" name="from" value="proweb-import-salaries">
    <div class="form-group">
        <label>Datation des données</label>
        <input type="date" class="form-control" value="<?php echo date("Y-m-d") ?>" name="date" placeholder="" required>
    </div>
    <br /> 
    <div class="file-drop-area">
        <span class="choose-file-button">Choisissez votre fichier Excel (XLSX)</span>
        <span class="file-message">ou déposez le dans cette zone</span>
        <input id="proweb-import-salaries" class="import-excel" name="proweb-import-salaries" type="file" onchange="dargAndDrop()">
    </div>
    <br />
    <input class="btn btn-primary btn-lg" style="width: 100%" type="submit" value="Charger le fichier de la base ProWeb">
</form>

<script>
    function dargAndDrop(){    
        var fileName = $("#proweb-import-salaries").val().split('\\').pop();
        $(".file-message").text($(".file-message").text().replace("ou déposez le dans cette zone", "Fichier prêt à être chargé : "+fileName));
    }
</script>