{% extends "macros/base.html" %}


{% block title %}Editar Trabajador{% endblock %}

{% block head %}
<!-- HEAD -->
{% endblock %}


{% block content %}
<div class="row justify-content-center">
    <div class="col-md-8">
        <h2 class="mb-4">Editar Trabajador</h2>

        {% with messages = get_flashed_messages(with_categories=true) %}
          {% if messages %}
            {% for category, message in messages %}
              <div class="alert alert-{{ category }}">{{ message|safe }}</div>
            {% endfor %}
          {% endif %}
        {% endwith %}

        <div class="card mb-4">
            <div class="card-body">
                <form method="POST">
                    <div class="mb-3">
                        <label class="form-label">RUT</label>
                        <input type="text" class="form-control text-muted" value="{{ worker[1] }}" readonly disabled>
                    </div>
                    <div class="mb-3">
                        <label class="form-label">Nombre Completo</label>
                        <input type="text" class="form-control" name="name" value="{{ worker[2] }}" required>
                    </div>
                    <div class="mb-4">
                        <label class="form-label">Teléfono</label>
                        <input type="text" class="form-control" name="phone" id="phoneInput" value="{{ worker[3] }}" required>
                    </div>
                    <div class="mb-4">
                        <label class="form-label">Módulo Asignado</label>
                        <select class="form-select" name="modulo_id" required>
                            <option value="" disabled>Seleccionar Módulo...</option>
                            {% for mod in modulos %}
                                <option value="{{ mod[0] }}" {% if mod[0] == worker[4] %}selected{% endif %}>
                                    {{ mod[2] }} - {{ mod[1] }}
                                </option>
                            {% endfor %}
                        </select>
                    </div>
                    <div class="d-flex justify-content-between">
                        <a href="{{ url_for('manage_workers') }}" class="btn btn-secondary">Cancelar</a>
                        <button type="submit" class="btn btn-primary">Actualizar Datos</button>
                    </div>
                </form>
            </div>
        </div>

        <div class="card border-warning">
            <div class="card-header bg-warning text-dark border-warning">
                <strong>Opciones de Seguridad</strong>
            </div>
            <div class="card-body d-flex justify-content-between align-items-center">
                <div>
                    <h6 class="mb-1">Restablecer Contraseña</h6>
                    <small class="text-muted">Genera una nueva contraseña aleatoria si el trabajador olvidó la suya.</small>
                </div>
                <form action="{{ url_for('admin_reset_password', id=worker[0]) }}" method="POST">
                    <button type="submit" class="btn btn-outline-warning" onclick="return confirm('¿Generar nueva contraseña? La anterior dejará de funcionar inmediatamente.');">
                        Generar Nueva
                    </button>
                </form>
            </div>
        </div>

    </div>
</div>

<script>
    document.getElementById('phoneInput').addEventListener('input', function(e) {
        let value = this.value.replace(/\D/g, '');
        if (value.startsWith('56')) value = value.substring(2);
        value = value.substring(0, 9);
        
        if (value.length > 5) {
            this.value = value.replace(/(\d{1})(\d{4})(\d+)/, '$1 $2 $3');
        } else if (value.length > 1) {
            this.value = value.replace(/(\d{1})(\d+)/, '$1 $2');
        } else {
            this.value = value;
        }
    });
    
    window.addEventListener('DOMContentLoaded', () => {
        document.getElementById('phoneInput').dispatchEvent(new Event('input'));
    });
</script>
{% endblock %}