Problema com enableFields

TOTVS Fluig Documentos (ECM)
, ,
1

Estou tendo problemas ao usar o enableFields neste formulário.

Todos os campos são bloqueados normalmente, mas quando aplicado no campo "RECEBMAT_TIPO" o JS deixa de funcionar e o segundo card "TIPO_DEV" não aparece mais nas outras atividades.


<div class="card">
    <div class="card-header bg-secondary text-white">
        <li ><b>Tipo do Recebimento</b></li> 
    </div>

    <div class="card-body">
        <div class="row">
            <div class="col-sm">
                <input type="radio" name="RECEBMAT_TIPO" value="Normal"><b>Normal (Revenda / Estoque)</b >
            </div>

            <div class="col-sm">
                <input type="radio" name="RECEBMAT_TIPO" value="Industrialização"><b>Industrialização</b> 
            </div>

            <div class="col-sm">
                <input type="radio" name="RECEBMAT_TIPO" value="Devolução"><b>Devolução</b>
            </div>

            <div class="col-sm">
                <input type="radio" name="RECEBMAT_TIPO" value="Recusa"><b>Recusa</b>
            </div>
        </div>
    </div>
</div>

<br>

<div class="card" id="TIPO_DEV" style="display: none">
    <div class="card-header bg-secondary text-white">
        <li><b>Tipo de Devolução</b></li>
    </div>

    <div class="card-body">
        <div class="form-row" >
            <div class="col-sm">
                <input type="radio" name="RECEBMAT_DEV" value="Total"><b>Total</b >
            </div>

            <div class="col-sm">
                <input type="radio" name="RECEBMAT_DEV" value="Parcial"><b>Parcial</b >
            </div>
        </div>
    </div>
</div>

Este JS tem o objetivo de exibir ou ocultar o segundo card "TIPO_DEV" dependendo do input selecionado no primeiro card. (EX: "Normal" -> oculta / "Devolução" -> exibe)


<script>

    const inputs = [...document.getElementsByName('RECEBMAT_TIPO')];
    const card = document.getElementById('TIPO_DEV');

    inputs.forEach(i => i.addEventListener('change', e => {
        if (e.target.value === 'Devolução') card.style.display = 'block'
        else card.style.display = 'none'
    }));

    const checked = inputs.filter(i => i.checked).some(i => i.value === 'Devolução');

    if (checked) {
        card.style.display = 'block';
    }

</script>
2

Eu fiz +- isso usando jQUery e FadeIn, FadeOut


var campo_checked = $('#id_campo_checket').val();
if(campo_checked == 'Sim'){
    mostraDIV(1);
}else{
    mostraDIV(2);
}

function mostraDIV(resposta){
    if(resposta == 1){
        $('#div_id_1').fadeIn();
        $('#div_id_').fadeIn();
    }else if(resposta==2){
        $('#div_id_1').fadeOut();
        $('#div_id_2').fadeOut();
    }
}

Vê se isso ajuda. Adicionei função on change usando o mesmo código para ocultar.