@extends('admin.base')
@section('title')

   EDUCATIVE | Bulletin
    
@endsection

@section('body')
 <div class="card">
    <div class="card-header">
        <h5>Bulletin</h5>
        <span>Bulletin de : {{$eleve->nom}} {{$eleve->prenom}}</span>
        <button class="btn btn-primary float-right" id="cmd">Télécharger</button>

    </div>
    <div id="content"  class="card-block table-border-style">
        <div class="row">
            <div class="col col-lg-4 col-md-4  col-sm-12 col-xm-12">
              <h6 class="text-center">
                MINISTERE DE L'ENSEIGNEMENT</br>
                PRIMAIRES</br>
                SECONDAIRES ET DE LA FORMATION</br>
                PROFESSIONNELLE
              </h6> 
            </div>
            <div class="col col-lg-4 col-md-4  col-sm-12 col-xm-12 text-center">
                 <img src="../user/img/logo-1.png">
            </div>
            <div class="col col-lg-4 col-md-4  col-sm-12 col-xm-12 ">
              <h6 class="text-center">REPUBLIQUE TOGOLAISE</br>
              Travail-Liberté-Patrie</h6>
            </div>
        </div>
        <div class="row">
            <div class="col col-12">
              <h6 class="text-center">
                BULLETIN D'EVALUATION DU PREMIER SEMESTRE
              </h6> 
            </div>
        </div>
        <div class="row">
            <div class="col col-4">
              <p class="text-center">
                LYCEE DE KPODZI / KPALIME<br>
                B.P.402 - Tel : +228 97 13 47 43<br>
                Préfecture de Kloto
              </p> 
            </div>
            <div class="col col-2">
              <p class="">
              </p> 
            </div>
            <div class="col col-6">
              <h6 class="">
                <table class="table table-bordered">
                  <thead>
                    <tr>
                      <th>ANNEE SCOLAIRE</th>
                      <th>CLASSE</th>
                      <th>EFFECTIF</th>
                      <!-- <th>CLASSES</th> -->
                    </tr>
                  </thead>
                  <tbody>
                    <tr>
                      <th>2022-2023</th>
                      <th> {{$eleve->classe->nom}}</th>
                      <th>{{$eleve->classe->effectif()}}</th>
                      <!-- <th>12</th> -->
                    </tr>
                  </tbody>
                </table>
              </h6> 
            </div>
        </div>
        <div class="row">
            <div class="col col-lg-4">
              <p class="text-center">
                NOM et PRENOMS : <strong>{{$eleve->nom}} {{$eleve->prenom}}</strong> 
              </p> 
            </div>
            <div class="col col-lg-4">
              <h6 class="text-center">
                SEXE : {{$eleve->sexe}}
              </h6> 
            </div>
            <!-- <div class="col col-lg-4">
              <h6 class="text-center">
                STATUT :
              </h6> 
            </div> -->
        </div>
        <div class="row pt-3 pb-4">
            <div align="center" class="col">
              <hr NOSHADE align="center" WIDTH="400"> 
            </div>
        </div> 
        <div class="table-responsive">
            <table class="table table-bordered">
                <thead>
                    <tr>
                      <th style="width: 2%">Matière</th>
                      <th style="width: 30%; text-align: center;" colspan="3" >Note de classe</th>
                      <th align="center"> Moy. classe.</th>
                      <th align="center"> Compo.</th>
                      <th align="center"> Moy. Gene./20 </th>
                      <th align="center"> Coef </th>
                      <th align="center"> Moy. Coef </th>
                      <th align="center"> Rang </th>
                      <th align="center"> Professeur </th>
                      <th align="center"> Appreciation </th>
                      <th align="center"> Signature </th>
                    </tr>
                </thead>
                <tbody>
                @foreach($tabMat as $i=>$val1)
                <tr>
                  <td >{{$tabMat[$i][0]}}</td>
                  <td align="center">{{$tabMat[$i][1]}}</td>
                  <td align="center">{{$tabMat[$i][2]}}</td>
                  <td align="center">{{$tabMat[$i][3]}}</td>
                  <td align="center">{{$tabMat[$i][4]}}</td>
                  <td align="center">{{$tabMat[$i][5]}}</td>
                  <td align="center">{{$tabMat[$i][6]}}</td>
                  <td align="center">{{$tabMat[$i][7]}}</td>
                  <td align="center">{{$tabMat[$i][8]}}</td>
                  @if($tabMat[$i][9] != "*")
                  <td align="center">{{$tabMat[$i][9]}} e</td>
                  @else
                   <td align="center">{{$tabMat[$i][9]}}</td>
                  @endif
                  <td align="center">{{$tabMat[$i][10]}}</td>
                  <td align="center">{{$tabMat[$i][11]}}</td>
                  <td></td>
                </tr> 
                @endforeach 
                <tr>
                  <th colspan="7" class="">
                    Total
                  </th>
                  <td align="center">
                    14
                  </td>
                  <td align="center"> 
                    220
                  </td>
                </tr>
                </tbody>
            </table>
        </div>
         <div class="row pt-3">
            <div class="col col-4">
              <table class="table table-bordered">
                <thead>
                  <tr>
                    <th colspan="2" >Moyenne sur 20</th>
                    <th >Rang</th>
                    <th >Sur</th>
                  </tr>
                </thead>
                  <tbody>
                    <tr>
                      <td>1er semestre :</td>
                      <td >15</td>
                      <td >2ème</td>
                      <td >10</td>
                    </tr>
                  </tbody>
                </table>
            </div>
            <div class="col col-4">
              <p class="">
              </p> 
            </div>
            <div class="col col-4 ">
                <table class="">
                  <tbody>
                    <tr>
                      <td>Moyenne la plus forte :</td>
                      <td>16</td>
                    </tr>
                    <tr>
                      <td>Moyenne la plus faible :</td>
                      <td>10</td>
                    </tr>
                    <tr>
                      <td>Moyenne générale semestrielle :</td>
                      <td>13.55</td>
                    </tr>
                  </tbody>
                </table> 
            </div>
        </div>
        <div class="row pt-3">
            <div class="col  col-6 offset-3">
              <table class="table table-bordered">
                <thead>
                  <tr>
                    <th style="text-align: center" >Décision du conseil et appréciation du chef d'établissement</th>
                  </tr>
                </thead>
                  <tbody>
                    <tr>
                      <td height="100"></td>
                    </tr>
                  </tbody>
                </table>
                <!-- <table class="border border-dark">
                <tbody>
                  <tr>
                    <th style="width: 600px; text-align: center" >Décision du conseil et appréciation du chef d'établissement</th>
                  </tr>
                  <tr>
                      <td height="100"></td>
                  </tr>
                  </tbody>
                </table> -->
            </div>
        </div>
        <div align="center" class="row pt-3 ">
            <div class="col  col-4">
              <table class="border border-dark">
                <tbody >
                  <tr >
                    <th style="width: 400px;text-align: center">Kpalime le 12/05/2023</th>
                  </tr>
                  <tr>
                    <th style="text-align: center" >Signature du chef d'établissement</th>
                  </tr>
                  <tr>
                    <td height="100"></td>
                  </tr>
                  <tr>
                    <td style="text-align: center" >KOUDEMA Djeba</td>
                  </tr>
                  </tbody>
                </table>
                </table>
            </div>
            <div class="col  col-4">
            </div>
            <div class="col  col-4 ">
              <table class="border border-dark ">
                <tbody >
                  <tr>
                    <th style="width: 400px; text-align: center" >Signature du Titulaire de classe</th>
                  </tr>
                  <tr>
                    <td height="130"></td>
                  </tr>
                  <tr>
                    <td style="text-align: center" >MESSA</td>
                  </tr>
                  </tbody>
              </table>
            </div>
        </div>
        <div class="row pt-4 pb-4">
            <div align="center" class="col">
              <hr NOSHADE align="center" WIDTH="400"> 
              <p style="font-weight: bold"> <em>Il n'est délivré qu'un seul bulletin de note. L'élève est tenu d'en faire des copies au besoin</em></p>
            </div>
        </div>
    </div>
 </div>

@endsection

@section('javascript')

    @if(session()->has('info'))
    <script >

      Swal.fire('{{session('info')}}')
      
    </script>
    @endif  

    <script type="text/javascript">
        $('#note').on('show.bs.modal', function (event) {
        var button = $(event.relatedTarget) 
        var recipient = button.data('whatever') 
        var modal = $(this)
        modal.find('.modal-title').text('Enregistrement de note ')

      })
    </script>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.4.0/jspdf.umd.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.3.2/html2canvas.min.js"></script>

<!-- <script>

      window.jsPDF = window.jspdf.jsPDF
      document.getElementById("cmd").addEventListener("click", function () {
        var doc = new jsPDF({ orientation: 'portrait', unit: 'mm', format: 'a4' });
        var content = document.getElementById('content');
        html2canvas(content).then(function(canvas) {
                var imageData = canvas.toDataURL('image/jpeg'); 
                doc.addImage(imageData, 'JPEG', 10, 10, 190, 0);
                doc.save('document.pdf');
            });
      }); 
      
</script> -->

<script src="https://cdnjs.cloudflare.com/ajax/libs/html2pdf.js/0.10.1/html2pdf.bundle.min.js"></script>

<script>

    document.getElementById('cmd').addEventListener('click', function(event) {
        event.preventDefault();
        const element = document.getElementById('content' ); 
        // Remplacez 'element-to-convert' par l'ID de l'élément que vous souhaitez convertir en PDF
        html2pdf().from(element).save('bulletin.pdf');
    });

</script>o


@endsection