<div class="card-panel white modal" style="height: 500px; overflow-y:scroll;" id="modalEditar">
    <form method="post" action="" onsubmit="edita(); return false;">
        <div class="row modal-content">
            <div class="col s8 offset-s2">
                <h5 class="center">{{i18n.gettext("Editar la lista")}}: {{dataBuffer.list_id}} ({{dataBuffer.list_name}})</h5>
            </div>
            <div class="row">
                <div class="col s8 offset-s2">
                    {{i18n.gettext("Nombre")}}: <br>
                    <div class="input-field ">
                        <input id="nombreListaEditar" type="text" required="required" v-bind:value="dataBufferEdit.list_name" onInput="cambiaNombre()">
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col s8 offset-s2">
                    {{i18n.gettext("Descripción")}}: <br>
                    <div class="input-field ">
                        <input id="descripcionListaEditar" type="text" :value="dataBufferEdit.list_description" onInput="cambiaNombre()">
                    </div>
                </div>
            </div>

            <div class="input-field col s8 offset-s2">
                <select id="campanaEditar" class="browser-default" required="required" onChange="cambiaNombre()">
                    <option v-for="campana in campanas" v-bind:value="campana.campaign_id" :selected="campana.campaign_id == dataBufferEdit.campaign_id?'selected':''">{{campana.campaign_name}}</option>
                </select>
                <label class="active" for="campanaEditar">{{i18n.gettext("Campaña")}}:</label>
            </div>

            <!-- ==================================================== -->
            <!-- Seleccion de CRM -->
            <div class="input-field col s8 offset-s2">
                <p>
                    <label for="tieneCrmEditar">
                        <input type="checkbox" id="tieneCrmEditar" v-model="tieneCrmEditar" disabled>
                        <span>{{traducirFrase("Con CRM")}}</span>
                    </label>
                </p>
            </div>
            <div class="input-field col s8 offset-s2" v-if="tieneCrmEditar">
                <select id="crmCrear" class="browser-default" v-model="crmEditar" disabled>
                    <option value="" disabled selected>{{traducirFrase("Selecciona un CRM")}}</option>
                    <option
                        v-for="item in crms"
                        :key="item.value"
                        :value="item.value"
                    >
                        {{ item.label }}
                    </option>
                </select>
                <label for="crmCrear" class="active">{{traducirFrase("CRM")}}</label>
            </div>
            <!-- ==================================================== -->

            <div class="input-field col s8 offset-s2 center">
                <button class="modal-close btn waves-effect waves-light" onclick="$('#modalEditar').modal('close');" type='button' id='CancelarCampa'>{{i18n.gettext("Cancelar")}}
                    <i class="material-icons right">cancel</i>
                </button>
                <button class="btn waves-effect waves-light " type="submit" name="action" id="botonEdita">{{i18n.gettext("Editar")}}
                    <i class="material-icons right">send</i>
                </button>
            </div>
        </div>
    </form>
</div>
