@extends('content.dashboard.dashboards-analytics')

@section('content')
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/sweetalert2/11.7.0/sweetalert2.min.css">
<!-- Inclure SweetAlert2 JS -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert2/11.7.0/sweetalert2.min.js"></script>
<script>
  function updateProgress() {
    $.ajax({
      url: '/migration/progress',
      type: 'GET',
      success: function(data) {
        var progress = data.progress;

        console.log('Progress:', progress); // Vérifie que cette ligne affiche bien la progression dans la console du navigateur

        // Mettre à jour la barre de progression
        $('#progress-bar').css('width', progress + '%');
        $('#progress-bar').attr('aria-valuenow', progress);
        $('#progress-bar').text(progress + '%');

        // Si la progression est inférieure à 100%, continuer
        if (progress < 100) {
          setTimeout(updateProgress, 1000); // Re-vérifie toutes les 1 seconde
        }
      }
    });
  }

  // Lancer la vérification de la progression
  updateProgress();
</script>
@if (session('success'))
<script>
  // Afficher le SweetAlert
  Swal.fire({
    icon: 'success',
    title: 'Succès',
    text: '{{ session('
    success ') }}', // Suppression des espaces incorrects
    showConfirmButton: true, // Pas de bouton de confirmation
    //timer: 5000 // Durée avant la disparition (en millisecondes)
  });
</script>
@endif
@if (session('error'))
        <script>
            Swal.fire({
                icon: 'error',
                title: 'Erreur',
                text: @json(session('error')),
                showConfirmButton: true,
            });
        </script>
    @endif

<!-- @if (session('error'))
    <div class="alert alert-danger">
        {{ session('error') }}
    </div>
@endif -->

<div class="container mt-5">
  <div class="card shadow-sm">
    <div class="card-header bg-default text-white">
      <h3 class="mb-2">Gestion des tâches automatisées</h3>
    </div>
    <div class="card-body">
      <ul class="nav nav-tabs" id="taskTab" role="tablist">
        <!-- Onglet 1: Identifier les redevables -->
        <li class="nav-item" role="presentation">
          <button class="nav-link active" id="identification-tab" data-bs-toggle="tab" data-bs-target="#identification" type="button" role="tab" aria-controls="identification" aria-selected="true">Identifier les redevables</button>
        </li>
        <!-- Onglet 4: Mise à jour des dettes dans redevable -->
        <li class="nav-item" role="presentation">
          <button class="nav-link" id="migration-redevable-dette-tab" data-bs-toggle="tab" data-bs-target="#migration-redevable-dette" type="button" role="tab" aria-controls="migration" aria-selected="false">Migration dans redevable et dette</button>
        </li>
        <!-- Onglet 2: Mise à jour des dettes -->
        <li class="nav-item" role="presentation">
          <button class="nav-link" id="mise-a-jour-tab" data-bs-toggle="tab" data-bs-target="#mise-a-jour" type="button" role="tab" aria-controls="mise-a-jour" aria-selected="false">Mise à jour des dettes dans redevable</button>
        </li>
        <!-- Onglet 3: Migration des données en ligne -->
        <li class="nav-item" role="presentation">
          <button class="nav-link" id="migration-tab" data-bs-toggle="tab" data-bs-target="#migration" type="button" role="tab" aria-controls="migration" aria-selected="false">Migration des données en ligne</button>
        </li>
      </ul>
      <div class="tab-content mt-2" id="taskTabContent">
        <!-- Identification des redevables -->
        <div class="tab-pane fade show active" id="identification" role="tabpanel" aria-labelledby="identification-tab">
          <span>Identifier les redevables à partir des sources externes (Fontion publique, CNSS, DGI et structures partenaires)</span>
          <div class="progress mb-5 mt-5">
            <div id="progress-bar" class="progress-bar" role="progressbar" style="width: 0%;" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100">0%</div>
          </div>
          @can('identifier.tabbottom1')<form action="{{ route('redevable.executeIdentification') }}" method="POST">
            @csrf
            <button type="submit" class="btn btn-lg btn-outline-primary w-100">Identifier les redevables</button>
          </form>@endcan
        </div>
        <!-- Migration à jour des dettes -->
        <div class="tab-pane fade" id="migration-redevable-dette" role="tabpanel" aria-labelledby="mise-a-jour-tab">
          <span>Insérer les nouveaux bénéficiaires de prêt dans la base redevable et insérer tous les bénéficiaires dans dette</span>
          <div class="progress mb-5 mt-5">
            <div id="progress-bar-migration-redevable-dette-tab" class="progress-bar" role="progressbar" style="width: 0%;" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100">0%</div>
          </div>
          @can('identifier.tabbottom2')<form action="{{ route('redevable.executeMiseAJour') }}" method="POST">
            @csrf
            <button type="submit" class="btn btn-lg btn-outline-success w-100">Migrer les données</button>
          </form>@endcan
        </div>
        <!-- Mise à jour des dettes -->
        <div class="tab-pane fade" id="mise-a-jour" role="tabpanel" aria-labelledby="mise-a-jour-tab">
          <span>Mettre à jour le montant de la dette du redevable</span>
          <div class="progress mb-5 mt-5">
            <div id="progress-bar-mise-a-jour-tab" class="progress-bar" role="progressbar" style="width: 0%;" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100">0%</div>
          </div>
          @can('identifier.tabbottom3')<form action="{{ route('redevable.executeMiseAJourDetteRedevable') }}" method="POST">
            @csrf
            <button type="submit" class="btn btn-lg btn-outline-success w-100">Mise à jour des dettes</button>
          </form>@endcan
        </div>
        <!-- Migration des données en ligne -->
        <div class="tab-pane fade" id="migration" role="tabpanel" aria-labelledby="migration-tab">
          <p>Recupérer les bénéficiaires de prêt de la plateforme pour insérer dans l'application pour une gestion ultérieure</p>
          <div class="progress mb-5 mt-5">
            <div id="progress-bar" class="progress-bar" role="progressbar" style="width: 0%;" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100">0%</div>
          </div>
          @can('identifier.tabbottom4')<form action="{{ route('redevable.executeMigration') }}" method="POST">
            @csrf
            <button type="submit" class="btn btn-lg btn-outline-info w-100">Migration des données en ligne</button>
          </form>@endcan
        </div>
      </div>
    </div>
  </div>
</div>
@endsection