<h2 class="page-title">Editar Grupo</h2>
<p class="text-muted">Modifique los datos del grupo en el formulario.</p>
<div class="row">
    <div class="col-md-12">
        <div class="card shadow mb-4">
            <div class="card-header">
                <strong class="card-title">Formulario</strong>
            </div>
            <div class="card-body">
                <form action="<?= BASE_ACTION ?>groups/<?= $group->id ?>/update" method="POST">
                    <input type="hidden" name="_method" value="PUT">
                    <div class="form-group">
                        <label for="abbreviation">Abreviación</label>
                        <input type="text" name="abbreviation" class="form-control" id="abbreviation" 
                               value="<?= htmlspecialchars($group->abbreviation) ?>" required>
                    </div>
                    
                    <div class="form-group">
                        <label for="description">Descripción</label>
                        <textarea class="form-control" name="description" id="description" rows="4" required><?= htmlspecialchars($group->description) ?></textarea>
                    </div>

                    <div class="form-group">
                        <label class="d-block">Estado</label>
                        <div class="custom-control custom-radio">
                            <input type="radio" id="activo" name="active" class="custom-control-input" value="1" <?= $group->active == 1 ? 'checked' : '' ?>>
                            <label class="custom-control-label" for="activo">Activo</label>
                        </div>
                        <div class="custom-control custom-radio">
                            <input type="radio" id="inactivo" name="active" class="custom-control-input" value="0" <?= $group->active == 0 ? 'checked' : '' ?>>
                            <label class="custom-control-label" for="inactivo">Inactivo</label>
                        </div>
                    </div>
                    
                    <div class="d-flex justify-content-start">
                        <a href="<?= BASE_HREF ?>areas/<?= $area->id?>/show-groups" class="btn btn-secondary mr-2">Cancelar</a>
                        <button type="submit" class="btn btn-primary">Actualizar</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

<script>
    document.getElementById('abbreviation').addEventListener('input', function (event) {
        event.target.value = event.target.value.toUpperCase();
    });
    document.getElementById('description').addEventListener('input', function (event) {
        event.target.value = event.target.value.toUpperCase();
    });
</script>