<!DOCTYPE html>
<html lang="fr">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Gestion des Concours - EST</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
    <link rel="stylesheet" href="../../../../../css/employee-styles.css">
</head>
<body>

<?php include "../../../../../layouts/employee/header.php" ?>

<?php include "../../../../../layouts/employee/concours/nav-second-level.php" ?>


<main class="main-content">
    <div class="container">

        <div class="stats-grid" id="statsGrid">
            <div class="stat-card">
                <div class="stat-icon">📊</div>
                <div class="stat-info">
                    <span class="stat-label">Total Inscriptions</span>
                    <span class="stat-value" id="statTotal">0</span>
                </div>
            </div>
            <div class="stat-card">
                <div class="stat-icon">✅</div>
                <div class="stat-info">
                    <span class="stat-label">Validées</span>
                    <span class="stat-value" id="statValide">0</span>
                </div>
            </div>
            <div class="stat-card">
                <div class="stat-icon">⏳</div>
                <div class="stat-info">
                    <span class="stat-label">En Attente</span>
                    <span class="stat-value" id="statEnAttente">0</span>
                </div>
            </div>
            <div class="stat-card">
                <div class="stat-icon">🎓</div>
                <div class="stat-info">
                    <span class="stat-label">Admis</span>
                    <span class="stat-value" id="statAdmis">0</span>
                </div>
            </div>
        </div>

        <div class="search-section">
            <form id="searchForm" class="search-form">
                <div class="form-group">
                    <label for="searchConcours">Concours</label>
                    <select id="searchConcours">
                        <option value="">Tous les concours</option>
                    </select>
                </div>
                <div class="form-group">
                    <label for="searchResultat">Résultat</label>
                    <select id="searchResultat">
                        <option value="">Tous</option>
                        <option value="ELLIBGIBLE_ECRIT">ELLIBGIBLE ECRIT</option>
                        <option value="NON_ELLIBGIBLE_ECRIT">NON ELLIBGIBLE ECRIT</option>
                        <option value="EN_COURS">EN COURS</option>
                    </select>
                </div>
                <div class="form-group">
                    <label for="searchEtat">État Inscription</label>
                    <select id="searchEtat">
                        <option value="">Tous</option>
                        <option value="EN_ATTENTE">En Attente</option>
                        <option value="VALIDE">Validée</option>
                        <option value="REJETE">Rejetée</option>
                    </select>
                </div>


                <div class="form-group">
                    <label for="searchStudent">Rechercher un étudiant</label>
                    <input type="text" id="searchStudent" placeholder="Nom, prénom, email ou CIN...">
                </div>
                <div class="form-group">
                    <label for="searchDiplome">Type Diplôme</label>
                    <select id="searchDiplome">
                        <option value="">Tous</option>
                    </select>
                </div>
                <div class="search-actions">
                    <button type="submit" class="btn btn-primary">🔍 Rechercher</button>
                    <button type="reset" class="btn btn-secondary" onclick="resetSearch()">🔄 Réinitialiser</button>
                    <button type="button" class="btn btn-success" onclick="openCreateModal()">➕ Nouvelle Inscription</button>
                    <button type="button" class="btn btn-info" onclick="openImportAvantEcritModal()">📥 Import Avant Écrit</button>
                </div>
            </form>
        </div>

        <div class="download-section">
            <span style="font-weight: 600; color: #495057;">📥 Télécharger :</span>
            <div class="btn-group" role="group">
                <button class="btn btn-primary" onclick="downloadInscriptions('EN_COURS')">
                    <i class="fas fa-file-excel"></i> Tous
                </button>
                <button class="btn btn-success" onclick="downloadInscriptions('ELLIBGIBLE_ECRIT')">
                    <i class="fas fa-file-excel"></i> Eligible Écrit
                </button>
                <button class="btn btn-info" onclick="downloadAdministrative('ELLIBGIBLE_ECRIT')">
                    <i class="fas fa-file-excel"></i> Affichage Administratif
                </button>
            </div>
        </div>

        <div class="multi-select-actions" id="multiSelectActions" style="display: none;">
            <div class="selected-info">
                <span id="selectedCount">0</span> inscription(s) sélectionnée(s)
            </div>
            <div class="btn-group">
                <button class="btn btn-success btn-sm" onclick="batchUpdateResultat('ELLIBGIBLE_ECRIT')">✅ Admis</button>
                <button class="btn btn-danger btn-sm" onclick="batchUpdateResultat('NON_ELLIBGIBLE_ECRIT')">❌ Non Admis</button>
                <button class="btn btn-secondary btn-sm" onclick="batchUpdateResultat('EN_COURS')">🔄 En Cours</button>
                <button class="btn btn-outline-secondary btn-sm" onclick="clearSelection()">Désélectionner tout</button>
            </div>
        </div>

        <div class="table-container">
            <div class="table-wrapper">
                <table>
                    <thead>
                    <tr>
                        <th class="checkbox-col">
                            <input type="checkbox" id="selectAll" onchange="toggleSelectAll()">
                        </th>
                        <th>Concours</th>
                        <th>Étudiant</th>
                        <th>Type Bac</th>
                        <th>Année Bac</th>
                        <th>Moyenne</th>
                        <th>Avant Ecrit</th>
                        <th>État</th>
                        <th>Résultat</th>
                        <th>Actions</th>
                    </tr>
                    </thead>
                    <tbody id="tableBody">
                    <tr>
                        <td colspan="10" style="text-align: center; padding: 40px;">
                            <div class="loading active">
                                <div class="spinner"></div>
                                <p style="margin-top: 10px;">Chargement des données...</p>
                            </div>
                        </td>
                    </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</main>

<?php include "../../../../../layouts/employee/footer.php" ?>

<?php include "../create-edit/modal.php" ?>

<?php include "../view/modal.php" ?>

<div class="toast-container" id="toastContainer"></div>

<!-- Modal: Import Avant Écrit (par CIN) -->
<div id="importAvantEcritModal" style="display:none; position:fixed; inset:0; background:rgba(0,0,0,0.5); z-index:1000; align-items:center; justify-content:center;">
    <div style="background:#fff; border-radius:10px; width:90%; max-width:480px; max-height:90vh; overflow-y:auto; box-shadow:0 10px 30px rgba(0,0,0,0.2);">
        <div style="display:flex; align-items:center; justify-content:space-between; padding:16px 20px; border-bottom:1px solid #e9ecef;">
            <h3 style="margin:0; font-size:18px;">📥 Importer Moyenne Avant Écrit</h3>
            <button type="button" onclick="closeImportAvantEcritModal()" style="background:none; border:none; font-size:22px; line-height:1; cursor:pointer; color:#6c757d;">&times;</button>
        </div>
        <form id="importAvantEcritForm" style="padding:20px;">
            <div class="form-group" style="margin-bottom:16px;">
                <label for="importConcoursId" style="display:block; margin-bottom:6px; font-weight:600;">Concours *</label>
                <select id="importConcoursId" required style="width:100%; padding:8px; border:1px solid #ced4da; border-radius:6px;">
                    <option value="">-- Sélectionner un concours --</option>
                </select>
            </div>
            <div class="form-group" style="margin-bottom:8px;">
                <label for="importAvantEcritFile" style="display:block; margin-bottom:6px; font-weight:600;">Fichier CSV *</label>
                <input type="file" id="importAvantEcritFile" accept=".csv" required style="width:100%;">
            </div>
            <p style="font-size:13px; color:#6c757d; margin:0 0 12px 0;">
                Format attendu (séparateur <strong>;</strong>) :<br>
                <code>CIN;moyenne_calcule_avant_ecrit</code><br>
                Exemple : <code>RT901234;11</code>
            </p>
            <div style="margin-bottom:20px;">
                <button type="button" class="btn btn-outline-secondary btn-sm" onclick="downloadSampleCsvAvantEcrit()">
                    <i class="fas fa-file-csv"></i> Télécharger un exemple CSV
                </button>
            </div>
            <div style="display:flex; justify-content:flex-end; gap:10px; border-top:1px solid #e9ecef; padding-top:16px;">
                <button type="button" class="btn btn-secondary" onclick="closeImportAvantEcritModal()">Annuler</button>
                <button type="submit" class="btn btn-primary">📥 Importer</button>
            </div>
        </form>
    </div>
</div>

<script src="main.js"></script>
</body>
</html>