credit-direct/templates/admin/societes_credit_table.php

<?php
?>

<div class="wrap">
    <h1>Gestion des Sociétés de Crédit</h1>

    <!-- Bouton pour créer une nouvelle société -->
    <div class="credit-actions-header">
        <button type="button" class="button button-primary" onclick="openSocieteModal()">
            <span class="dashicons dashicons-plus-alt"></span> Nouvelle société
        </button>
    </div>

    <!-- Table simple -->
    <table id="societes-table" class="wp-list-table widefat striped">
        <thead>
            <tr>
                <th style="width: 80px;">ID</th>
                <th>Nom de la société</th>
                <th style="width: 120px;">Status</th>
                <th style="width: 200px;">Actions</th>
            </tr>
        </thead>
        <tbody>
            <!-- Les données seront chargées via AJAX par DataTables -->
        </tbody>
    </table>

    <!-- Modal pour créer/modifier une société -->
    <div class="societe-modal" style="display: none;">
        <div class="credit-modal-overlay" onclick="closeSocieteModal()"></div>
        <div class="credit-modal-content">
            <div class="credit-modal-header">
                <h2>Nouvelle société</h2>
                <span class="credit-modal-close" onclick="closeSocieteModal()">&times;</span>
            </div>
            
            <form id="societe-form" class="credit-form">
                <div class="form-group-full">
                    <label for="societe-nom">Nom de la société <span class="required">*</span></label>
                    <input type="text" id="societe-nom" name="nom" required placeholder="Ex: Banque Exemple">
                </div>
                
                <div class="form-group-full">
                    <label for="societe-status">
                        <input type="checkbox" id="societe-status" name="status" value="1" checked>
                        Société active
                    </label>
                    <p class="description">Cochez cette case pour que la société apparaisse dans les formulaires de crédit.</p>
                </div>

                <div class="form-group-full">
                    <label for="societe-type-credit">Type de crédit</label>
                    <select id="societe-type-credit" name="type_credit[]" multiple style="min-height: 100px; width: 100%;">
                        <option value="PAT">PAT - Prêt à tempérament</option>
                        <option value="PH">PH - Crédit hypothécaire</option>
                    </select>
                    <p class="description">Sélectionnez les types de crédit que cette société propose. Maintenez Ctrl (ou Cmd sur Mac) pour sélectionner plusieurs types.</p>
                </div>
                
                <div class="form-actions">
                    <button type="button" class="button button-primary" onclick="saveSociete()">
                        <span class="dashicons dashicons-yes"></span> Sauvegarder
                    </button>
                    <button type="button" class="button" onclick="closeSocieteModal()">
                        <span class="dashicons dashicons-no"></span> Annuler
                    </button>
                </div>
            </form>
        </div>
    </div>
</div>

<style>
/* Styles spécifiques pour la modal des sociétés */
.societe-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 999999;
    display: none;
}

/* Correction du z-index pour Select2 dans la modal */
.societe-modal .select2-container--open .select2-dropdown {
    z-index: 1000000;
}

.societe-modal .select2-container {
    z-index: 999999;
}

.societe-modal.show {
    display: flex;
    align-items: center;
    justify-content: center;
    animation: fadeIn 0.3s ease-out;
}

.form-group-full label {
    display: block;
    font-weight: 600;
    margin-bottom: 8px;
    color: #23282d;
}

.form-group-full input[type="text"] {
    width: 100%;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 14px;
}

.form-group-full input[type="checkbox"] {
    margin-right: 8px;
}

.description {
    margin-top: 5px;
    font-size: 12px;
    color: #666;
    font-style: italic;
}

.badge-active {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 600;
    background-color: #46b450;
    color: white;
}

.badge-inactive {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 600;
    background-color: #dc3232;
    color: white;
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
</style>

<?php
// Les assets sont gérés par le factory
?>