<?php $__env->startSection('content'); ?>
<div class="max-w-5xl mx-auto p-6 bg-white shadow rounded">
  <h2 class="text-2xl font-semibold mb-4">Prévisualisation de l'import de donateurs</h2>
  <form method="POST" action="<?php echo e(route('donateurs.import')); ?>">
    <?php echo csrf_field(); ?>
    <input type="hidden" name="confirm" value="1">
    <div class="mb-4">
      <label for="status-filter" class="mr-2">Afficher</label>
      <select id="status-filter" class="rounded border-gray-300">
        <option value="">Tous</option>
        <option value="ok">OK</option>
        <option value="ko">Pas OK</option>
        <option value="missing">Email/Téléphone manquant</option>
        <option value="dup-email">Email dupliqué</option>
        <option value="dup-phone">Téléphone dupliqué</option>
      </select>
    </div>
    <div class="overflow-x-auto">
      <table class="min-w-full divide-y divide-gray-200 mb-4 datatable">
        <thead class="bg-gray-50">
          <tr>
            <th class="px-4 py-2 text-left text-xs font-medium text-gray-500 uppercase">Nom</th>
            <th class="px-4 py-2 text-left text-xs font-medium text-gray-500 uppercase">Prénom</th>
            <th class="px-4 py-2 text-left text-xs font-medium text-gray-500 uppercase">Fonction</th>
            <th class="px-4 py-2 text-left text-xs font-medium text-gray-500 uppercase">Email</th>
            <th class="px-4 py-2 text-left text-xs font-medium text-gray-500 uppercase">Téléphone</th>
            <th class="px-4 py-2 text-left text-xs font-medium text-gray-500 uppercase">Statut</th>
            <th class="px-4 py-2 text-left text-xs font-medium text-gray-500 uppercase">Actions</th>
          </tr>
        </thead>
        <tbody class="bg-white divide-y divide-gray-200">
          <?php $__currentLoopData = $rows; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $i => $row): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
          <tr class="hover:bg-gray-50 <?php echo e($row['errors'] ? 'bg-red-50' : ''); ?>" data-errors="<?php echo e(implode('|', $row['errors'])); ?>" data-ok="<?php echo e($row['errors'] ? '0' : '1'); ?>">
            <td class="px-4 py-2">
              <input type="text" name="rows[<?php echo e($i); ?>][nom]" value="<?php echo e(old('rows.'.$i.'.nom', $row['nom'])); ?>" class="w-full rounded border-gray-300" />
            </td>
            <td class="px-4 py-2">
              <input type="text" name="rows[<?php echo e($i); ?>][prenom]" value="<?php echo e(old('rows.'.$i.'.prenom', $row['prenom'])); ?>" class="w-full rounded border-gray-300" />
            </td>
            <td class="px-4 py-2">
              <input type="text" name="rows[<?php echo e($i); ?>][fonction]" value="<?php echo e(old('rows.'.$i.'.fonction', $row['fonction'])); ?>" class="w-full rounded border-gray-300" />
            </td>
            <td class="px-4 py-2">
              <input type="text" name="rows[<?php echo e($i); ?>][email]" value="<?php echo e(old('rows.'.$i.'.email', $row['email'])); ?>" class="w-full rounded border-gray-300" />
            </td>
            <td class="px-4 py-2">
              <input type="text" name="rows[<?php echo e($i); ?>][telephone]" value="<?php echo e(old('rows.'.$i.'.telephone', $row['telephone'])); ?>" class="w-full rounded border-gray-300" />
            </td>
            <input type="hidden" name="rows[<?php echo e($i); ?>][sexe]" value="<?php echo e($row['sexe']); ?>" />
            <input type="hidden" name="rows[<?php echo e($i); ?>][groupes]" value="<?php echo e($row['groupes']); ?>" />
            <td class="px-4 py-2">
              <?php if($row['errors']): ?>
                <ul class="text-red-600 text-sm list-disc pl-4">
                  <?php $__currentLoopData = $row['errors']; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $err): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                    <li><?php echo e($err); ?></li>
                  <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                </ul>
              <?php else: ?>
                <span class="text-green-600">OK</span>
              <?php endif; ?>
            </td>
            <td class="px-4 py-2 text-center">
              <button type="button" class="remove-row text-red-600">❌</button>
            </td>
          </tr>
          <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
        </tbody>
      </table>
    </div>
    <div class="flex justify-end space-x-2">
      <a href="<?php echo e(route('donateurs.index')); ?>" class="px-4 py-2 bg-gray-200 rounded">Annuler</a>
      <button type="submit" name="action" value="visible" class="px-4 py-2 bg-green-600 text-white rounded hover:bg-green-700">Confirmer la liste affichée</button>
      <button type="submit" name="action" value="all" class="px-4 py-2 bg-green-600 text-white rounded hover:bg-green-700">Confirmer l'importation</button>
    </div>
  </form>
</div>
<script>
  document.addEventListener('DOMContentLoaded', function () {
    var tableEl = $('.datatable');
    tableEl.on('init.dt', function () {
      var table = tableEl.DataTable();

      tableEl.on('click', '.remove-row', function () {
        var row = $(this).closest('tr');
        table.row(row).remove().draw();
      });

      $.fn.dataTable.ext.search.push(function (settings, data, dataIndex) {
        if (settings.nTable !== table.table().node()) { return true; }
        var filter = document.getElementById('status-filter').value;
        if (!filter) { return true; }

        var row = table.row(dataIndex).node();
        var errors = (row.dataset.errors || '').split('|').filter(Boolean);
        var ok = row.dataset.ok === '1';

        if (filter === 'ok') {
          return ok;
        }
        if (filter === 'ko') {
          return !ok;
        }
        if (filter === 'missing') {
          return errors.includes('Email ou téléphone manquant');
        }
        if (filter === 'dup-email') {
          return errors.includes('Email dupliqué');
        }
        if (filter === 'dup-phone') {
          return errors.includes('Téléphone dupliqué');
        }

        return true;
      });

      document.getElementById('status-filter').addEventListener('change', function () {
        table.draw();
      });
    });
    document.querySelector('form').addEventListener('submit', function (e) {
      if (e.submitter && e.submitter.name === 'action' && e.submitter.value === 'visible') {
        let table = $('.datatable').DataTable();
        $(table.rows({ search: 'removed' }).nodes()).remove();
      }
    });
  });
</script>
<?php $__env->stopSection(); ?>

<?php echo $__env->make('layouts.app', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?><?php /**PATH /home/ecamesuac/public_html/notifications_colloque_uac/resources/views/donateurs/import_preview.blade.php ENDPATH**/ ?>