<form action="" @submit.prevent="guardarSMS" id="formSMS">
    <input type="hidden" id="smsID" name="smsID">
    <div class="modal fade" tabindex="-1" role="dialog" aria-hidden="true" id="modalSMS">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header mh">
                    crear &nbsp; <h4 class="modal-title"> SMS</h4>
                    <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-group">
                        <label for="smsModulo">Módulo</label>
                        <select name="smsModulo" id="smsModulo" class="form-control" @change="selectModulo($event)">
                            <option value="1" selected>Mensajes</option>
                            <option value="2">Servicios</option>
                            <option value="3">Documentos</option>
                        </select>
                    </div>
                    <div class="form-group">
                        <label for="smsTitulo">Título</label>
                        <input type="text" id="smsTitulo" name="smsTitulo" maxlength="100" placeholder="Título" class="form-control">
                    </div>
                    <div class="form-group">
                        <label for="smsCuerpo">Mensaje</label>
                        <div class="my-3" v-if="variables.length > 0">
                            <span class="muted">Variables </span>
                            <span class="badge badge-secondary" style="cursor: pointer;" v-for="row in variables" @click="colocarVariable(row, 1)"> {{ row }} </span>
                        </div>
                        <textarea name="smsCuerpo" id="smsCuerpo" @input="mensajeDeTexto($event)" cols="10" rows="5" maxlength="160" placeholder="Mensaje de texto" class="form-control"></textarea>
                        <small class="muted">caracteres </small><small class="muted" id="caracteresSMS">0</small>
                    </div>
                    <div class="row">
                        <div class="col-12">
                            <div class=" alert alert-warning" role="alert" v-for="row in errorForm">
                                {{ row }}
                            </div>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <div class="form-group pull-right">
                        <button type="submit" class="btn btn-sm btn-info">Guardar</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</form>