@extends('layout.layout')
@section('breadcrumb')
  Analyse Multiple
@endsection
@section('content')
<form action="{{route('resultatMultiple')}}" method="post" id="report" enctype="multipart/form-data">
  @csrf
  <div class="container-fluid mt-5">
    <div class="row justify-content-center g-5">
      <div class="col-6">
        <label for="entreprise">Entreprise :</label>
        <select id="entreprise" class="form-select" name="entreprise" aria-label="Default select example" required>
                  <option selected disabled>Entreprise</option>
                  <br />
<b>Warning</b>:  Undefined variable $entreprises in <b>/home/agilgo/public_html/transformation-factory-new2/resources/views/pages/homemultiple.blade.php</b> on line <b>14</b><br />
<br />
<b>Warning</b>:  foreach() argument must be of type array|object, null given in <b>/home/agilgo/public_html/transformation-factory-new2/resources/views/pages/homemultiple.blade.php</b> on line <b>14</b><br />
        </select>
      </div>
      <div class="col-6">
        <label for="etablissement">Établissement :</label>
        <select name="etablissement" id="etablissement" class="form-select" required>
          <option value="" disabled selected>Établissement</option>
        </select>
      </div>
      <div class="col-6">
        <label for="periode">Choisissez une périodicité :</label>
        <select name="periode" id="periode" class="form-select" required>
        <option value="" disabled selected>Périodicité</option>
        <br />
<b>Warning</b>:  Undefined variable $periodicites in <b>/home/agilgo/public_html/transformation-factory-new2/resources/views/pages/homemultiple.blade.php</b> on line <b>29</b><br />
<br />
<b>Warning</b>:  foreach() argument must be of type array|object, null given in <b>/home/agilgo/public_html/transformation-factory-new2/resources/views/pages/homemultiple.blade.php</b> on line <b>29</b><br />
        </select>
      </div>
      <div class="col-6">
        <label for="periodAnalyse">Période analysée :</label>
        <select name="periodAnalyse" id="periodAnalyse" class="form-select" required>
          <option value="" disabled selected>Période</option>
        </select>
      </div>
      <div class="col-8">
        <hr>
      </div>
      <div class="row justify-content-start">
      <div class="col-6" >
        <!-- <label for="rapport_1">Choisissez le 1<sup>er</sup> type de rapport :</label> -->
        <!-- <select id="rapport_1" class="form-select" name="rap_1"  aria-label="Default select example"  required>
              <option >Selectionner</option>
        </select> -->
          <ul id="rapport_1" style="list-style-type: none;">

          </ul>
        </div>

      </div>
      <!-- <div class="col-6">
        <label for="excel">Charger le fichier Excel du 1<sup>er</sup> rapport :</label>
        <label for="excel" class="upload">
          <input type="file" name="excel_file_1" accept=".xlsx, .xls" required>
          <button type="button">
            <svg xmlns="http://www.w3.org/2000/svg" width="27.367" height="24.645" viewBox="0 0 27.367 24.645">
              <g id="Groupe_192" data-name="Groupe 192" transform="translate(-1.331 -2.23)">
                <path id="Tracé_98" data-name="Tracé 98" d="M26.055,12.169v-.263a8.552,8.552,0,0,0-8.706-8.338,8.723,8.723,0,0,0-8,5.087A8.118,8.118,0,0,0,2.13,16.669a8.013,8.013,0,0,0,8.044,8H13.3V23.007H10.174a6.376,6.376,0,0,1-.206-12.719h.556l.194-.525a7.023,7.023,0,0,1,6.662-4.5,6.886,6.886,0,0,1,7.044,6.669,5.858,5.858,0,0,1,0,.662l-.069.6.544.25a5,5,0,0,1-2.119,9.562H18.3v1.663H22.78a6.666,6.666,0,0,0,3.275-12.5Z" transform="translate(-0.799 -1.338)" fill="#181830"/>
                <path id="Tracé_99" data-name="Tracé 99" d="M24.948,25.778a.832.832,0,0,0,.781-.506.85.85,0,0,0-.181-.919L21.379,20.19l-4.169,4.163a.837.837,0,0,0,.044,1.131.824.824,0,0,0,1.131.044L20.548,23.4V33.615a.831.831,0,1,0,1.662,0V23.4l2.144,2.144A.826.826,0,0,0,24.948,25.778Z" transform="translate(-6.379 -7.571)" fill="#181830"/>
              </g>
            </svg>
          </button>
        </label>
      </div> -->
      <!-- <div id="msg1" class="col-12 d-none">
        <div class="d-flex align-items-center">Veuillez vérifier ces points de départ et ces noms d'onglets sur Excel <img src="{{asset('/media/info.svg')}}" class="ms-2 cru" alt="info" role="button" data-bs-toggle="modal" data-bs-target="#excel1"></div>
      </div> -->
      <div id='content_1' class="dynamicTable col-12">
      </div>
      <div class="col-12 mt-2">
        <!-- <table class="table table-bordered border-light tf-table">
          <thead>
              <tr>
                  <th scope="col">Nom du rapport</th>
                  <th scope="col">Nom de l'onglet</th>
                  <th scope="col" class="db-col">Numéro de ligne</th>
                  <th scope="col" class="db-col">Numéro de colonne</th>
              </tr>
          </thead>
          <tbody>
              <tr>
                  <td>ALMM</td>
                  <td>F1607</td>
                  <td class="field"> <input type="text" value="B" name="col1" class="form-control"> </td>
                  <td class="field"> <input type="text" value="16" name="col2" class="form-control"> </td>
              </tr>
              <tr>
                  <td>ALMM</td>
                  <td>F90101</td>
                  <td class="field"> <input type="text" value="B" name="col3" class="form-control"> </td>
                  <td class="field"> <input type="text" value="20" name="col4" class="form-control"> </td>
              </tr>
              <tr>
                  <td>ALMM</td>
                  <td>C3336</td>
                  <td class="field"> <input type="text" value="B" name="col5" class="form-control"> </td>
                  <td class="field"> <input type="text" value="16" name="col6" class="form-control"> </td>
              </tr>
              <tr>
                  <td>ALMM</td>
                  <td>C3300</td>
                  <td class="field"> <input type="text" value="B" name="col7" class="form-control"> </td>
                  <td class="field"> <input type="text" value="18" name="col8" class="form-control"> </td>
              </tr>
          </tbody>
        </table> -->
      </div>
      <div class="row justify-content-start">
        <div class="col-6">
          <!-- <label for="verifonglet">Choisissez le 2<sup>er</sup> type de rapport :</label> -->
          <!-- <select id="rapport_2" class="form-select" name="rap_2" aria-label="Default select example" required>
          <option selected value="">Selectionner</option>
        </select> -->
        <ul id="rapport_2" style="list-style-type: none;">

        </ul>
      </div>
      </div>
      <!-- <div class="col-6">
        <label for="excel2">Charger le fichier Excel du 2<sup>ème</sup> rapport :</label>
        <label for="excel_file_2" class="upload">
          <input type="file" id="excel_file_2" name="excel_file_2" accept=".xlsx, .xls" required>
          <button type="button">
            <svg xmlns="http://www.w3.org/2000/svg" width="27.367" height="24.645" viewBox="0 0 27.367 24.645">
              <g id="Groupe_192" data-name="Groupe 192" transform="translate(-1.331 -2.23)">
                <path id="Tracé_98" data-name="Tracé 98" d="M26.055,12.169v-.263a8.552,8.552,0,0,0-8.706-8.338,8.723,8.723,0,0,0-8,5.087A8.118,8.118,0,0,0,2.13,16.669a8.013,8.013,0,0,0,8.044,8H13.3V23.007H10.174a6.376,6.376,0,0,1-.206-12.719h.556l.194-.525a7.023,7.023,0,0,1,6.662-4.5,6.886,6.886,0,0,1,7.044,6.669,5.858,5.858,0,0,1,0,.662l-.069.6.544.25a5,5,0,0,1-2.119,9.562H18.3v1.663H22.78a6.666,6.666,0,0,0,3.275-12.5Z" transform="translate(-0.799 -1.338)" fill="#181830"/>
                <path id="Tracé_99" data-name="Tracé 99" d="M24.948,25.778a.832.832,0,0,0,.781-.506.85.85,0,0,0-.181-.919L21.379,20.19l-4.169,4.163a.837.837,0,0,0,.044,1.131.824.824,0,0,0,1.131.044L20.548,23.4V33.615a.831.831,0,1,0,1.662,0V23.4l2.144,2.144A.826.826,0,0,0,24.948,25.778Z" transform="translate(-6.379 -7.571)" fill="#181830"/>
              </g>
            </svg>
          </button>
        </label>
      </div> -->
      <!-- <div id="msg2" class="col-12 d-none">
        <div class="d-flex align-items-center">Veuillez vérifier ces points de départ et ces noms d'onglets sur Excel <img src="{{asset('/media/info.svg')}}" class="ms-2 cru" alt="info" role="button" data-bs-toggle="modal" data-bs-target="#excel1"></div>
      </div> -->
      <div id='content_2' class="dynamicTable col-md-12">
      </div>
      <!-- <div class="col-12">
        <table class="table table-bordered border-light tf-table">
          <thead>
              <tr>
                  <th scope="col">Nom du rapport</th>
                  <th scope="col">Nom de l'onglet</th>
                  <th scope="col" class="db-col">Numéro de ligne</th>
                  <th scope="col" class="db-col">Numéro de colonne</th>
              </tr>
          </thead>
          <tbody>
              <tr>
                  <td>ALMM</td>
                  <td>F1607</td>
                  <td class="field"> <input type="text" value="B" name="col1" class="form-control"> </td>
                  <td class="field"> <input type="text" value="16" name="col2" class="form-control"> </td>
              </tr>
              <tr>
                  <td>ALMM</td>
                  <td>F90101</td>
                  <td class="field"> <input type="text" value="B" name="col3" class="form-control"> </td>
                  <td class="field"> <input type="text" value="20" name="col4" class="form-control"> </td>
              </tr>
              <tr>
                  <td>ALMM</td>
                  <td>C3336</td>
                  <td class="field"> <input type="text" value="B" name="col5" class="form-control"> </td>
                  <td class="field"> <input type="text" value="16" name="col6" class="form-control"> </td>
              </tr>
              <tr>
                  <td>ALMM</td>
                  <td>C3300</td>
                  <td class="field"> <input type="text" value="B" name="col7" class="form-control"> </td>
                  <td class="field"> <input type="text" value="18" name="col8" class="form-control"> </td>
              </tr>
          </tbody>
        </table>
      </div> -->
      <input id="rapprt_name_1" type="hidden" name="rapprt_name_1"/>
      <input id="rapprt_name_2" type="hidden" name="rapprt_name_2"/>
      <input id="entreprise_name" type="hidden" name="entreprise_name"/>
      <input id="etablissement_name" type="hidden" name="etablissement_name"/>
      <div class="col-12 text-center mb-4">
        <button type="submit" class="actionBtn">
          <svg xmlns="http://www.w3.org/2000/svg" width="34" height="34" class="me-3" viewBox="0 0 34 34">
            <g id="analyse" transform="translate(-972 -1860)">
              <path id="Tracé_95" data-name="Tracé 95" d="M27.116,44.887a15.109,15.109,0,1,1,0-30.217v15.1h15.1A15.109,15.109,0,0,1,27.116,44.887Zm11.8-12.467H24.084V18.07A12.093,12.093,0,1,0,38.917,32.421Z" transform="translate(960 1849.112)" fill="#fff"/>
              <path id="Tracé_96" data-name="Tracé 96" d="M25.33,12A15.121,15.121,0,0,1,40.446,27.116H25.33ZM37.046,24.084A12.091,12.091,0,0,0,28.362,15.4v8.684Z" transform="translate(965.554 1848)" fill="#fff"/>
            </g>
          </svg>
          Lancer l'analyse
        </button>
      </div>
    </div>
  </div>
</form>

<!-- modal excel -->

<div class="modal fade excelmodal" id="excel1" tabindex="-1" aria-labelledby="excel1Label" aria-hidden="true">
  <div class="modal-dialog modal-lg modal-dialog-centered">
    <div class="modal-content">
      <div class="closeWrap text-end">
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <div class="modal-body text-center">
        <img src="{{asset('media/excel1.jpg')}}" class="img-fluid rounded">
      </div>
    </div>
  </div>
</div>

  <!-- modal report -->
  <div class="modal fade" tabindex="-1" role="dialog" id="myModal">
  <div class="modal-dialog modal-lg modal-dialog-centered" role="document">
  <div class="modal-content">
  <div class="closeWrap text-end">
  <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
  </div>
  <div class="modal-body">
  <div class="container py-4 text-center">
  <h2>le rapport est déjà éxistant</h2>
  <p> Voulez-vous l'écraser</p>
  <div class="btn-group" role="group" aria-label="...">
    <!-- <form  action="{{route('resultat')}}" method="post"> -->
      <!-- @csrf -->

      <button id="reportEcraser" type="submit" name="button" class="btn btn-primary">Oui</button>
      <button id="reportCancel" type="button" class="btn btn-default" data-bs-dismiss="modal">Non</button>
    <!-- </form> -->
  </div>
  </div>
  </div>
        <!-- <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
          <button type="button" class="btn btn-primary">Save changes</button>
        </div> -->
      </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
  </div><!-- /.modal -->
  <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<script>
$(document).ready(function(){

$("#report").submit(function(e){
  // e.preventDefault();

  var entreprise = $('#entreprise_name').val();
  var etablissement = $('#etablissement_name').val();
  var periodAnalyse = $('#periodAnalyse').val();
  var title = entreprise + "_" + etablissement +"_" +periodAnalyse;
  var data  = new FormData;
  data.append('title',title);
  var headers = {headers: {'Content-Type': 'application/json', 'X-Requested-With': 'XMLHttpRequest','encode'  : true}};
  axios.post('ajaxReport',data,headers).then((response)=>{
    console.log(response);
    if(response.data.reportExisst == "true") {
      // $('#myModal').modal('show');
      // $('#report').append("<input type='hidden' name='reportEcraser' value='Oui'/><br/>");
      $('#report').append("<input type='hidden' name='report_id' value='" + response.data.report_id + "'/><br/>");
      e.target.submit();
      $('#reportEcraser').click("click",function(){
        // console.log('reportid',response.data.report_id);
      });
      $('#reportCancel').click("click",function(){
        // console.log('reportid',response.data.report_id);
        $('#report').append("<input type='hidden' name='reportEcraser' value='Non'/><br/>");
        e.target.submit();
      });
    }

    if(response.data.reportExisst == "false") {
      $('#report').append("<input type='hidden' name='reportEcraser' value='Non'/><br/>");
      e.target.submit();
    }
  },(error)=>{
    console.log(error);
  });
  console.log(title);
});
  $("#entreprise").change(function(){
    var data  = new FormData;
    data.append('entreprise_id',$(this).val());
    data.append('action','getEtablissement');
    var headers = {headers: {'Content-Type': 'application/json', 'X-Requested-With': 'XMLHttpRequest','encode'  : true}};
      axios.post('ajaxMultiple',data,headers).then((response)=>{
        console.log(response);
        $('#etablissement').html(response.data);
        var entre = $('#entreprise option:selected').text();
        $('#entreprise_name').val(entre);

      },(error)=>{
        console.log(error);
      });

    // console.log(data);
  });
$("#etablissement").change(function(){
  var etabliss = $('#etablissement option:selected').text();
  $('#etablissement_name').val(etabliss);
})
  $('#rapport_1').change(function(){
       var data = new FormData();
       var action = 'getCategories';
       var parentID = [];
       $('#rapport_1 input[type="checkbox"]:checked').each(function() {
         var parentIdValue= $(this).val()
         if ($.inArray(parentIdValue, parentID) === -1) {
           parentID.push(parentIdValue);
         }
         else {
       // Remove the value from the array
            parentID = $.grep(parentID, function(v) {
            return v !== parentIdValue;
       });

     }
       });
       data.append('parent_id', parentID);
       data.append('periode_id', $("#periode").val());
       data.append('periode', $("#periode option:selected").text());
       data.append('action', 'getCategoriesReport_2');
       var headers = {headers: {'Content-Type': 'application/json', 'X-Requested-With': 'XMLHttpRequest','encode'  : true}};
       axios.post('ajaxMultiple', data,headers)
        .then((response) => {
          console.log('#rapport_2',response.data);
          console.log('parent',parentID);
          $('#rapport_2').html(response.data);
          $('#content_2').html('');
        }, (error) => {
          console.log(error);
        });
        var file = [];
        // var checkedFile = $('#rapport_1 input[type="checkbox"]:checked').val();
        // file.push(checkedFile);
        // if ($.inArray(checkedFile, file) === -1) {
        // }
        $('#rapport_1 input[type="checkbox"]:checked').each(function() {
          if ($.inArray($(this).val(), file) === -1) {
            file.push($(this).val());
          }else {
        // Remove the value from the array
        file = $.grep(file, function(v) {
          return v !== $(this).val();
        });

      }
        });
        var periode=$('#periode').val()

        $('#rapprt_name_1').val(file)
        $('#msg1').removeClass('d-none')
        getFileType(file,periode,'#content_1')
  });
  $("#periode").change(function(){
       var data = new FormData();
       var action = 'getCategories';
       data.append('parent_id', 0);
       data.append('periode_id', $(this).val());
       data.append('periode', $("#periode option:selected").text());
       data.append('action', 'getCategories');
       var headers = {headers: {'Content-Type': 'application/json','X-Requested-With': 'XMLHttpRequest','encode'  : true}}
       axios.post('ajaxMultiple', data,headers)
        .then((response) => {
          console.log(response.data);
          $('#rapport_1').html(response.data.html);
          $('#periodAnalyse').html(response.data.periodAnalyse);
        }, (error) => {
          console.log(error);
        });
  });
  $("#rapport_2").change(function(){
    // var file=$('#rapport_2 option:selected').text(),
    var file = [];
    $('#rapport_2 input[type="checkbox"]:checked').each(function() {
      if ($.inArray($(this).val(), file) === -1) {
        file.push($(this).val());
      }else {
    // Remove the value from the array
    file = $.grep(file, function(v) {
      return v !== $(this).val();
    });

  }
    });
    var periode=$('#periode').val()
    $('#rapprt_name_2').val(file)
    $('#msg2').removeClass('d-none')
    getFileType(file,periode,'#content_2')
  })

});
function getFileType(file,periodicite,content){
  var data = new FormData();
  data.append('file', file);
  data.append('periodicite', periodicite);
  data.append('action', 'getFileType');
  var headers = {headers: {'Content-Type': 'application/json','X-Requested-With': 'XMLHttpRequest', 'encode'  : true}}
  const action = 'getFileType';

  axios.post('ajaxMultiple',data,headers)
   .then((response) => {
     console.log('getfiletype');
     console.log(response.data);
     $(content).html(response.data)
   //   $('#rapport_1 input[type="checkbox"]').change(function() {
   //
   //     if ($(this).is(':checked')) {
   //       if ($(content).find('#'+ fileId).length === 0) {
   //         // console.log('getfiletype1,'fileId);
   //       }
   //   } else {
   //     console.log('getfiletype2',fileId);
   //     $(content).find('#'+ fileId).remove();
   //   }
   // });
   }, (error) => {
     console.log(error);
   });
  }
  function selectReferentiel() {
    // alert( document.getElementById('referentiel').value)
    switch (document.getElementById('referentiel').value) {
      case "Formula":
        window.location = "formula/formula.php"
        break;

        case "file_type":
        window.location = "file_type/file_type.php"
        break;
    }
  }

</script>
@endsection