@extends('layouts.app')
@section('title')
    Importer des Enseingants
@endsection

@section('head')
<style>
    .page-wrapper>.page-content {
        padding-top: 0px;
    }

    .col-6 {
        padding-left: 0px;
    }

    .download-block {
        margin-top: 20px;
    }

    .custom-file-label {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    tr:first-child {
        font-weight: bold;
    }
</style>
@endsection

@section('content-title')
{{-- Le titre du contenu qui a gauche en haut dans le content --}}
Enseignants
@endsection

@section('content')
<div class="container">
    <br><br>
    <div class="row">
        <div class="col-12">
            <div class="card" style="margin-bottom: 0px; border-bottom: 2px solid #2cabe3;">
                <div class="card-body">
                    <h4 class="card-title">Importation des enseignants</h4>
                    <h6 class="card-subtitle"> </h6>
                    <div class="d-flex justify-content-between download-block">
                        <div class="col-6" style="padding-top: 10px;">
                            Télecharger le modèle pour importer la liste de  vos enseignants
                        </div>
                        <div class="col-6 ">
                            <a href="{{url('models/teacher.model.csv')}}" download>
                                <button class="btn btn-lg btn-block font-medium btn-outline-warning without-overlay">
                                    Télécharger le modèle
                                    <i class="mdi mdi-download"></i>
                                </button>
                            </a>

                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="row pt-2">
        <div class="col-md-12">
            <div class="card">
                <div class="row">
                    <div class="col-3">
                        {{-- <i class="mdi mdi-upload" style="font-size: 5rem;"></i> --}}
                        <form action="{{route('teacher.process.import')}}" method="post" enctype="multipart/form-data">
                            @csrf
                            <div class="card">
                                <div class="card-body">
                                    <h4 class="card-title">Importer le fichier</h4>
                                    <h6 class="card-subtitle">Importer le fichier contenant les  données</h6>
                                    <form class="mt-4">
                                        <div class="input-group">
                                            <div class="custom-file">
                                                <input type="file" name="teacher_to_import" class="custom-file-input" id="files" accept=".csv"
                                                    required>
                                                <label class="custom-file-label" for="files">Choisir le
                                                    fichier</label>
                                            </div>
                                        </div>
                                        <div>
                                            <span style="font-size: 12px; color: red; display: none;" id="error">
                                                Absence de champs requis dans votre fichier
                                            </span>
                                        </div>
                                        <button type="submit" id="btn-submit" class="btn btn-primary"
                                            style="margin-top: 24px; display: none;">
                                            Soumettre
                                        </button>
                                    </form>
                                </div>
                            </div>
                        </form>
                    </div>
                    <div class="col-9">
                        <div id="parsed_csv_list"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>

</div>
@endsection

@section('scripts')
{{-- Ajouter de nouveau script a votre page --}}
<script src="{{asset('assets/add-ons/papaparse.js')}}"></script>*
<script src="{{asset('assets/scripts/upload-teachers.js')}}"></script>
@endsection