<form autocomplete="off" id="modal_form_pagar" @submit.prevent="pagarComision">
    <div class="modal fade" id="modal_pagar_pendiente" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header border-top-0 border-bottom-0">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <div class="form-row">
                        <div class="col">
                            <div id="contenerdor_campos_pagar">
                                <div class="form-group form-floating-label">
                                    <select class="form-control input-border-bottom" id="pagardivisa" @change="obtenerMetodosDivisa">
                                        <option value="" disabled selected>SELECCIONAR UNA OPCCIÓN</option>
                                        <?php foreach ($divisas as $row) : ?>
                                            <option value="<?= $row['div_id'] ?>"><?= $row['div_nombre'] ?></option>
                                        <?php endforeach; ?>
                                    </select>
                                    <label for="pagardivisa" class="placeholder">Divisa</label>
                                </div>
                                <div class="form-group form-floating-label">
                                    <select class="form-control input-border-bottom" id="pagarmetodo" @change="obtenerCuentasSegunMetodo">
                                        <option value="" disabled selected>SELECCIONAR UNA OPCCIÓN</option>
                                        <option v-for="metodo in metodos_pg" :value="metodo.md_id">{{metodo.mp_nombre}}</option>
                                    </select>
                                    <label for="pagarmetodo" class="placeholder">Metodo de pago</label>
                                </div>
                                <div class="form-group form-floating-label">
                                    <select class="form-control input-border-bottom" id="pagarcuenta">
                                        <option value="" disabled selected>SELECCIONAR UNA OPCCIÓN</option>
                                        <option v-for="cuenta in cuentas_pg" :value="cuenta.cmp_id">{{ cuenta.bc_alias }} - {{ cuenta.bc_tipo }} - {{ cuenta.ban_codigo }}</option>
                                    </select>
                                    <label for="pagarcuenta" class="placeholder">Cuenta</label>
                                </div>
                            </div>
                            <div class="form-group">
                                <input id="monto_sin_conversion" type="text" class="form-control input-border-bottom text-right" disabled="true">
                                <label for="monto_sin_conversion" class="placeholder">Monto</label>
                            </div>
                            <div class="form-group">
                                <input id="monto_con_conversion" type="text" class="form-control input-border-bottom text-right" disabled="true">
                                <label for="monto_con_conversion" class="placeholder">Monto a pagar</label>
                            </div>
                            <div class="col mt-3">
                                <button type="submit" class="btn btn-primary btn-round btn-block">pagar</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</form>
